/*
File Name: static-front.css
Author: DURU, 아이비넷
Version: 1.0.1
* SUMMARY:
*     0) Section & Row & col
*     0) Typography
*     0) Banner
*     0) Landing
*     0) Pricing
*     0) UX Builder - Pricing table
*     0) UX Builder - QnA
*
*/
/* **************************************** *
* Section & Row & col
* **************************************** */
.static-area .section {
    padding-top: 55px;
    padding-bottom: 55px;
}

.static-area .section.no-gap {
    padding-top: 0;
    padding-bottom: 0;
}

.static-area .section:first-child {
    padding-top: 0;
    margin-bottom: 78px;
}

@media screen and (max-width: 849px) {
    .static-area .section {
        padding-top: 25px;
        padding-bottom: 25px;
    }
}

/* **************************************** *
* Typography
* **************************************** */
/* .static-area .row h1, .static-area .row h2 {
line-height: 1.8;
} */
.static-area .row h2 {
    margin-bottom: 42px;
    color: #030d51;
}

.static-area .row h2.ty2{
    margin: 0 0 25px 0;
    font-size: 1.8rem;
    color: #35509a;
}

.static-area .row h3 {
    font-family: 'Poppins', sans-serif;
    color: #030d51;
}

.static-area .row h3.ty2{
    font-size: 1.6rem;
    color: #35509a;
}

@media screen and (max-width: 849px) {
    .static-area .row h2 {
        margin-bottom: 12px;
        line-height: 1.5;
        font-size: 19px;
    }

    .static-area .section-pricing-03 .row h2{
        margin-top: 33px;
    }

    .static-area .row h2.ty2{
        font-size: 1.4rem;
    }

    .static-area .row h3.ty2{
        font-size: 1.28rem;
    }
}



/* **************************************** *
* Landing
* **************************************** */
.static-area .section.landing-00, .static-area .section.landing-00 div.img {
    margin-bottom: 0px !important;
}

.landing-01 .col {
    padding-bottom: 0px;
}

.landing-01 h3 {
    font-size: 21px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #030d51;
    margin-bottom: 0;
    max-width: 554px;
    margin: auto;
    font-family: 'Poppins', sans-serif;
}

.landing-01 .img {
    margin-bottom: 13px !important;
    margin-top: 10px;
}

.landing-01 .img img {
    max-height: 28px;
    width: auto;
}

.landing-01 p {
    font-family: 'Poppins', sans-serif;
    margin-bottom: 0px;
    font-size: 13px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.69;
    letter-spacing: normal;
    text-align: center;
    color: #030d51;
}

.landing-01 p span {
    font-family: "Roboto", sans-serif;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: normal;
    text-align: center;
    color: #030d51;
}

.landing-02 .col {
    padding-bottom: 0px;
}

.landing-02 .lading-table {
    max-width: 584px;
    margin: auto;
}

.landing-02 .lading-table td {
    border: none;
    vertical-align: top;
    padding-top: 0;
    padding-bottom: 8px;
    padding-right: 0;
}

.landing-default p.landing-p {
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.56;
    letter-spacing: normal;
    color: #333333;
}

.landing-default a.button {
    width: 100%;
    max-width: 222px;
    height: 48px;
    padding: 10px;
    border-radius: 3px;
    background-color: #ffb801 !important;
    border: none;
    color: #ffffff !important;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: bold;
    margin-top: 60px;
}

.landing-default a.button.success {
    background-color: #35509a !important;
}

.landing-default a.button.alert {
    margin-top: 10px;
    background-color: #ffadad !important;
}

.landing-03{
    padding-bottom: 15px !important;
}

.landing-03 .button.success {
    display: block;
    margin-left: auto;
    margin-right: 0;
}

.landing-03 .slider-wrapper {
    max-width: 383px;
    border-radius: 50%;
}

.landing-03 .slider-wrapper:after {
    content: "";
    width: 100%;
    height: auto;
    padding-top: 100%;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0px;
    border-radius: 50%;
    background-color: #99e5f9;
    z-index: -1;
}

.landing-03 .flickity-viewport {
    max-width: 374px;
    max-height: 374px;
}

.landing-03 .flickity-viewport .img{
    border-radius: 374px;
    overflow: hidden;
}

.landing-03 .flickity-prev-next-button {
    color: #95e5f9;
    opacity: 1 !important;
}

.landing-03 svg.flickity-button-icon {
    display: none;
}

.landing-03 button.flickity-prev-next-button {
    background-size: 21px 24px;
    background-repeat: no-repeat;
}

.landing-03 button.flickity-prev-next-button.next {
    background-position: center right;
    background-image: url('https://cdn.talktomeinkorean.com/images/ttmik-next@3x.png');
}

.landing-03 button.flickity-prev-next-button.previous {
    background-position: center left;
    background-image: url('https://cdn.talktomeinkorean.com/images/ttmik-previous@3x.png');
}

.landing-04 img {
    max-width: 333px;
    margin-top: 10px;
    margin-right: 10px;
}

.landing-04 .img-inner.dark:before {
    content: "";
    width: 308px;
    height: 223px;
    display: inline-block;
    position: absolute;
    right: 48px;
    top: 0;
    background-color: #faebeb;
    z-index: -1;
}

.landing-04 .is-divider {
    display: block !important;
    margin: 151px 0px 0px 72px !important;
}

@media screen and (max-width: 849px) {
    .landing-01 h3 {
        font-size: 16px;
        padding-left: 15px;
        padding-right: 15px;
    }

    .static-area .landing-default h2 {
        font-size: 19px;
    }

    .landing-default a.button {
        margin-top: 20px;
    }

    .landing-01 .col {
        overflow: hidden;
    }

    .landing-03 .slider-wrapper:after {
        right: -5px;
    }

    .landing-04 .img-inner.dark:before {
        right: 20px;
    }

    .landing-04 .is-divider {
        margin: 50px 0px 0px 0px !important;
        margin-left: auto !important;
    }
}

@media screen and (max-width: 600px) {
    .landing-default .min-large-column-reverse {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }

    .static-area .section.landing-00 div.img {
        margin: 1.2em auto !important;
    }
}

/* rebuild */

.static-area .landing-cta {
    padding: 40px 15px;
}

.landing-cta .row h1{
    font-family: 'Poppins', sans-serif;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 0;
    margin-bottom: 15px;
}

.landing-cta .row p{
    font-family: 'Poppins', sans-serif;
    font-size: 19px;
    font-weight: 600;
    margin-bottom: 30px;
}

.section-landing-why {
    padding-bottom: 0 !important;
}

.section-landing-why p, .section-landing-cost p {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #333333;
}

.section-landing-why p {
    margin: 80px 0 80px 60px;
    max-width: 340px;
}


.section-landing-why .image-area {
    width: 100%;
    max-width: 498px;
    background-image: url('https://cdn.talktomeinkorean.com/images/landing_01.gif');
    background-size: 100%;
    background-repeat: no-repeat;
}

.section-landing-why .image-area:before {
    content: '';
    display: block;
    padding-top: 54.2168%;
}

.section-landing-why .shape-1 {
    top: 0;
    left: -100px;
    max-width: 201px;
}

.section-landing-why .shape-2 {
    bottom: 30px;
    right: 0;
    max-width: 201px;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.section-landing-testemonial{
    padding-bottom: 55px !important;
}

.section-landing-testemonial .row-box-shadow-1-hover .col{
    position: relative;
    padding-top: 30px;
}

.section-landing-testemonial .row-box-shadow-1-hover .col a{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    color: transparent;
    background-color: transparent;
    border-color: transparent;
    opacity: 0;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.section-landing-testemonial .row-box-shadow-1-hover .col-inner{
    background-color: #f9f9f9;
}

.section-landing-testemonial .row-box-shadow-1-hover .col-inner:hover{
    -webkit-box-shadow: none;
    box-shadow: none;
}

.section-landing-testemonial .testimonial-box p {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
    font-style: normal;
    color: #000;
}

.section-landing-testemonial .testimonial-box{
    min-height: 340px;
    padding: 24px 28px;
}

.section-landing-testemonial .testimonial-box .icon-box-text{
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.section-landing-testemonial .testimonial-box .testimonial-name{
    display: block;
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    color: #000;
}

.section-landing-testemonial .testimonial-box .testimonial-name-divider{
    display: none;
}

.section-landing-testemonial .testimonial-box .testimonial-company{
    display: block;
    position: relative;
    padding-left: 34px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.38;
    font-style: normal;
    color: #000;
}

.section-landing-testemonial .testimonial-box .testimonial-company:before{
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 24px;
    height: 24px;
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.section-landing-testemonial .testimonial-box.testimonial-book .testimonial-company:before{
    background-image: url("https://cdn.talktomeinkorean.com/images/review-book.svg");
}

.section-landing-testemonial .testimonial-box.testimonial-site .testimonial-company:before{
    background-image: url("https://cdn.talktomeinkorean.com/images/review-site.svg");
}

.section-landing-testemonial .testimonial-box.testimonial-review .testimonial-company:before{
    background-image: url("https://cdn.talktomeinkorean.com/images/review-course.svg");
}

.section-landing-testemonial .testimonial-box.testimonial-youtube .testimonial-company:before{
    background-image: url("https://cdn.talktomeinkorean.com/images/review-youtube.svg");
}

.section-landing-testemonial .row{
    display : flex;
    justify-content: center;
}

.section-landing-testemonial .row.flickity-enabled .flickity-prev-next-button {
    display: block !important;
    position: static;
    width: 40px;
    height: 40px;
    margin: 0 16px;
    padding: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    background-size: 100% auto !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.section-landing-testemonial .row.flickity-enabled .flickity-prev-next-button.previous{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2335509A'%3E%3Cpath d='M23.5 11L14 20.5l9.5 9.4 1.2-1.2-8.1-8.2 8.1-8.2z'/%3E%3Cpath fill-rule='nonzero' d='M20 38.2C10 38.2 1.8 30.1 1.8 20 1.8 10 9.9 1.8 20 1.8S38.2 9.9 38.2 20c0 10-8.2 18.2-18.2 18.2zM20 0C9 0 0 9 0 20s9 20 20 20 20-9 20-20S31 0 20 0z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") !important;
}

.section-landing-testemonial .row.flickity-enabled .flickity-prev-next-button.next{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2335509A'%3E%3Cpath d='M16.3 29.9l9.5-9.4-9.5-9.5-1.3 1.3 8.2 8.2-8.2 8.2z'/%3E%3Cpath fill-rule='nonzero' d='M20 1.8c10 0 18.2 8.1 18.2 18.2S30.1 38.2 20 38.2C10 38.2 1.8 30.1 1.8 20S9.9 1.8 20 1.8zM20 40c11 0 20-9 20-20S31 0 20 0 0 9 0 20s8.9 20 20 20z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") !important;
}

.section-landing-testemonial .row.flickity-enabled .flickity-prev-next-button[disabled]{
    opacity: .35 !important;
}

.static-area .section{
    flex-flow: column;
}

.static-area .section .overlay{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    min-width: 100vw;
    background-color: #fff;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.static-area .section.overlay + *{
    position: relative;
    z-index: 2;
}

.section-landing-cost .row h2{
    line-height: 1;
    margin-top: 0;
    margin-bottom: 27px;
}

.section-landing-cost a.button {
    width: 100%;
    max-width: 190px;
    height: 48px;
    border-radius: 3px;
    background-color: #ffadad !important;
    border: none;
    color: #ffffff !important;
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    margin-top: 39px;
}

.section-landing-cost {
    margin-bottom: 56px;
    padding-top: 100px !important;
    padding-bottom: 90px !important;
}

.section-landing-cost .col.large-6.txt-cont{
    padding-left: 35px;
}

.section-landing-cost .image-area {
    width: 100%;
    max-width: 414px;
    background-image: url('https://cdn.talktomeinkorean.com/images/landing_03.gif');
    background-size: 100%;
    background-repeat: no-repeat;
    margin-left: auto;
}

.section-landing-cost .image-area:before {
    content: '';
    display: block;
    padding-top: 65.2173%;
}

.section-landing-cost .shape-1 {
    top: -30px;
    left: 55px;
    width: 61px;
    height: 61px;
    background-color: #ffebeb;
    border-radius: 300px;
}

.section-landing-cost .shape-2 {
    top: 50px;
    left: 0;
    width: 100%;
    max-width: 500px;
    padding-top: 32.4%;
    background-color: #ffebeb;
    border-radius: 200px;
    -webkit-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    transform: rotate(-40deg);
}

.section-landing-premium {
    margin-top: 55px;
    border-top: dashed 1.5px #d7e3f2;
    text-align: center;
}

.section-landing-premium .row h2{
    margin-bottom: 10px;
}

.section-landing-premium .col.large-4 {
    padding-bottom: 30px;
}

.section-landing-premium .image-cont{
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 97px;
    text-align: center;
    margin-bottom: 5px;
}

@media screen and (min-width: 850px) {
    .section-landing-testemonial .row-box-shadow-1-hover .col-inner:hover{
        -webkit-transform: translateX(0px) scale(1.05);
        -ms-transform: translateX(0px) scale(1.05);
        transform: translateX(0px) scale(1.05);
    }
}

@media screen and (max-width: 849px) {
    .section-landing-testemonial .testimonial-box{
        min-height: 330px;
    }

    .static-area .section .row{
        margin: auto !important;
    }

    .section-landing-why p{
        margin: 20px auto;
    }

    .section-landing-why .shape-1{
        top: -60px;
        left: 15px;
    }

    .section-landing-why .shape-2{
        bottom: -60px;
        right: 15px;
    }

    .landing-cta .row h1{
        font-size: 1.4rem;
    }

    .landing-cta .row h1.font-notosans-700{
        font-size: 1.3rem;
    }

    .landing-cta .row p{
        font-size: 14px;
        margin-bottom: 20px;
    }

    .section-landing-premium{
        margin-top: 0;
    }

    .section-landing-premium .row h3{
        font-size: 1rem;
    }

    .section-landing-premium .col.large-4{
        padding-bottom: 40px;
    }

    .section-landing-cost {
        margin-bottom: 25px;
        padding-top: 40px !important;
        padding-bottom: 25px !important;
    }

    .section-landing-cost a.button{
        margin-top: 20px;
    }
}

@media screen and (max-width: 640px) {
    .landing-cta .row p{
        display: none;
    }
}

@media screen and (max-width: 600px) {
    .static-area .landing-cta{
        padding: 30px 15px;
    }
}

/* **************************************** *
* Pricing
* 20221103
* leesoyeon
* **************************************** */

.static-area .shape {
    position: absolute;
}

.static-area .image-area {
    position: relative;
}

.static-area .zi-0 {
    z-index: 0;
}

.static-area .zi-1 {
    z-index: 1;
}

.static-area .zi-2 {
    z-index: 2;
}

.static-area .zi-3 {
    z-index: 3;
}

/* pc */
.section-pricing-01 {
    width : 100%;
    height:  862px;  
    background-color : #9999FF;
    margin:0 !important;
    padding: 0 !important;
}

.section-pricing-01 .pricing-banner {
    display: flex;
    position: relative;
    height : 100%;
}

.section-pricing-01 .pricing-banner img{
    position:absolute;
    bottom:0;
    right:0;
}

.section-pricing-01 .pricing-banner-inner{
    display : flex;
    position : relative;
    flex-direction : column;
    justify-content: center;
    width : 100%;
}
.section-pricing-01 .pricing-banner-inner .pricing-title{
    color : #030D51;
    font-size : 48px;
    display : block;
}

.section-pricing-01 .pricing-title.mobile{
    display : none;
} 

.section-pricing-01 .pricing-benefit{
    line-height : 32px;
    color :#fff;
    list-style-type: none;
    margin: 0;
    padding : 0;
}

.section-pricing-01 .pricing-benefit .item{
    display : flex;
    align-items: center;
    margin-bottom: 20px;
    font-size : 22px;
}

.section-pricing-01 .pricing-benefit .item::before{
    content : url('https://cdn.talktomeinkorean.com/wp-content/themes/ttmik/assets/images/pricing-benefit-checkbox.svg'); 
    margin-right : 20px;
    line-height: 1;
}

.section-pricing-01 .pricing-benefit:after {
    content: '';
}

.section-pricing-02{
    margin : 120px 0 60px 0;
}

.section-pricing-02 .pricing-plan-wrapper{
    display: flex;
    flex-wrap: inherit;
    flex-direction: row;
    justify-content: flex-end;
}

.section-pricing-02 .pricing-title{
    font-size : 42px;
    max-width : 230px;
}

.section-pricing-02 .pricing-plan{
    display : flex;
    justify-content: flex-end;
    gap : 20px;
}

.section-pricing-02 .pricing-plan-box{
    width : 380px;
    border-radius : 20px;
    padding : 20px 30px;
    display : flex;
    flex-direction: column;
    justify-content: space-between;
}

.section-pricing-02 .pricing-plan-box.yearly{
    background-color : #3333FF;
    color : #FFFFFF;
}

.section-pricing-02 .pricing-plan-box.monthly{
    background-color : #FFFFFF;
    color : #3333FF;
}

.section-pricing-02 .pricing-plan-title {
    font-size: 20px;
    margin-bottom:20px;
    display: flex;
    flex-flow: row-reverse;
    justify-content: flex-end;
}

.section-pricing-02 .pricing-plan-box.yearly .pricing-plan-title {
    gap:30px;
}

.section-pricing-02 .pricing-plan-box.monthly .pricing-plan-title {
    gap:10px;
}

.section-pricing-02 .pricing-plan-box .on-sale{
    font-size: 15px;
    color: #3333FF;
    border-radius: 10px;
    padding: 5px 10px;
    max-width:110px;
    margin-bottom:15px;
}

.section-pricing-02 .pricing-plan-box.yearly .on-sale{
    background-color: #FFC0ED;
}

.section-pricing-02 .pricing-plan-box.monthly .on-sale{
    background-color : #E9F2B3;
}

.section-pricing-02 .pricing-plan-content{
    display : flex;
    flex-direction : row;
    justify-content: space-between;
    align-items: flex-end;
}

.section-pricing-02 .pricing-plan-content .price-area p{
    margin : 0;
    padding : 0;
    line-height: initial;
}

.section-pricing-02 .pricing-plan-content .price-area .price{
    font-size : 32px;
}

.section-pricing-02 .link-area{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
}

.section-pricing-02 .link-area a{
    display: flex;
    width: 56px;
    height: 56px;
    align-items: center;
    justify-content: center;
    border-radius : 10px;
}

.section-pricing-02 .link-area a .text-indent{
    text-indent: -9999px;
}

.section-pricing-02 .yearly .link-area a:hover{
    background-color : #5555FF;
}

.section-pricing-02 .monthly .link-area a:hover{
    background-color : #EAEAFF;
}

.section-pricing-01 .pricing-banner {
    display: flex;
    position: relative;
    height : 100%;
}

.section-pricing-01 .pricing-banner img{
    position:absolute;
    bottom:0;
    right:0;
}

.section-pricing-01 .pricing-banner-inner{
    display : flex;
    position : relative;
    flex-direction : column;
    justify-content: center;
}
.section-pricing-01 .pricing-banner-inner .pricing-title{
    color : #030D51;
    font-size : 48px;
    display : block;
}

.section-pricing-01 .pricing-title.mobile{
    display : none;
} 

.section-pricing-01 .pricing-benefit{
    line-height : 32px;
    color :#fff;
    list-style-type: none;
    margin: 0;
    padding : 0;
}

.section-pricing-01 .pricing-benefit .item{
    display : flex;
    align-items: center;
    margin-bottom: 20px;
    font-size : 22px;
}

.section-pricing-01 .pricing-benefit .item::before{
    content : url('https://cdn.talktomeinkorean.com/wp-content/themes/ttmik/assets/images/pricing-benefit-checkbox.svg'); 
    margin-right : 20px;
    line-height: 1;
}

.section-pricing-01 .pricing-benefit:after {
    content: '';
}

.section-pricing-02{
    margin : 120px 0 60px 0;
}

.section-pricing-02 .pricing-title{
    font-size : 42px;
    max-width : 230px;
}

.section-pricing-02 .pricing-plan{
    display : flex;
    justify-content: flex-end;
    gap : 20px;
}

.section-pricing-02 .pricing-plan-box{
    width : 380px;
    border-radius : 20px;
    padding : 20px 30px;
    display : flex;
    flex-direction: column;
    justify-content: space-between;
}

.section-pricing-02 .pricing-plan-box.yearly{
    background-color : #3333FF;
    color : #FFFFFF;
}

.section-pricing-02 .pricing-plan-box.monthly{
    background-color : #FFFFFF;
    color : #3333FF;
}

.section-pricing-02 .pricing-plan-box.yearly .on-sale{
    background-color: #FFC0ED;
}

.section-pricing-02 .pricing-plan-box.monthly .on-sale{
    background-color : #E9F2B3;
}

.section-pricing-02 .pricing-plan-content{
    display : flex;
    flex-direction : row;
    justify-content: space-between;
    align-items: flex-end;
}

.section-pricing-02 .pricing-plan-content .price-area p{
    margin : 0;
    padding : 0;
    line-height: initial;
}

.section-pricing-02 .pricing-plan-content .price-area .price{
    font-size : 32px;
}

.section-pricing-02 .link-area{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
}

.section-pricing-02 .link-area a{
    display: flex;
    width: 56px;
    height: 56px;
    align-items: center;
    justify-content: center;
    border-radius : 10px;
}

.section-pricing-02 .link-area a .text-indent{
    text-indent: -9999px;
}

.section-pricing-02 .yearly .link-area a:hover{
    background-color : #5555FF;
}

.section-pricing-02 .monthly .link-area a:hover{
    background-color : #EAEAFF;
}

.section-pricing-03 {
    margin-bottom: 56px;
    padding-bottom: 22px;
}

.section-pricing-03 .image-area {
    max-width: 481px;
    background-image: url('https://cdn.talktomeinkorean.com/images/ttmik-pricing_03.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
    margin-left: 60px;
    margin-bottom: 15px;
    margin-top: 40px;
}

.section-pricing-03 .image-area:before {
    content: '';
    display: block;
    padding-top: 66.8181%;
}

.section-pricing-03 .shape-1 {
    position: inherit;
    width: 100%;
    max-width: 221px;
    height: 11px;
    background-color: #ffb803;
}

.section-pricing-03 .shape-2 {
    bottom: 0;
    right: 0;
    width: 100%;
    max-width: 453px;
    padding-top: 39.0909%;
    background-color: #95e6f9;
}

/*add 22.03.16 */
.section-pricing-03 .membership-info {
    background-color: #E9F2B3;
    font-family : 'Dm Sans', sans-serif;
    padding: 40px 30px 40px 50px;
    border-radius : 20px;
    margin-bottom: 100px;
    color: #030D51;
    font-size : 18px;
}

.section-pricing-03 .membership-info ul{
    /* list-style-position: inside; */
}

.section-pricing-03 .membership-info ul,
.section-pricing-03 .membership-info ul li:last-child{
    margin: 0;
    padding : 0;
}

.section-pricing-03 .membership-info ul,
.section-pricing-03 .membership-info ul li:last-child{
    margin: 0;
    padding : 0;
}

.section-pricing-03 .membership-info .contact-link {
    text-decoration: underline;
    color : #9999FF;
    font-weight:bold;
}

.section-pricing-03 .membership-info .contact-link {
    text-decoration: underline;
    color : #9999FF;
    font-weight:bold;
}

.section-pricing-04 {
    margin-bottom: 56px;
    padding-bottom: 22px !important;
}

.section-pricing-04 .col.large-6.align-middle {
    padding-right: 0px !important;
}

.section-pricing-04 .image-area {
    width: 100%;
    max-width: 480px;
    background-image: url('https://cdn.talktomeinkorean.com/images/ttmik-pricing_02.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
    margin-left: 15px;
}

.section-pricing-04 .image-area:before {
    content: '';
    display: block;
    padding-top: 61.2500%;
}

.section-pricing-04 .shape-1 {
    top: 29px;
    left: 15px;
    width: 100%;
    max-width: 308px;
    padding-top: 41.5194%;
    background-color: #ffebeb;
}

.section-pricing-04 .shape-2 {
    top: 22px;
    left: 292px;
    width: 100%;
    max-width: 500px;
    padding-top: 32.4%;
    background-color: #ffebeb;
    border-radius: 200px;
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
}

.section-pricing-05 {
    margin-bottom: 60px;
}

.section-pricing-05 .image-area {
    width: 100%;
    max-width: 483px;
    background-image: url('https://cdn.talktomeinkorean.com/images/ttmik-pricing_04.png');
    background-size: 100%;
    background-position: center right;
    background-repeat: no-repeat;
    margin-right: 0px;
}

.section-pricing-05 .image-area:before {
    content: '';
    display: block;
    padding-top: 97.3084%;
}

.section-pricing-05 .shape-1 {
    top: 11%;
    right: 0%;
    width: 221px;
    height: 11px;
    background-color: #ffb803;
}

.section-pricing-05 a.button {
    width: 100%;
    max-width: 222px;
    height: 48px;
    border-radius: 3px;
    background-color: #ffb801 !important;
    border: none;
    color: #ffffff !important;
    font-size: 18px;
    font-weight: bold;
    white-space: nowrap;
    margin-top: 72px;
}

.static-area .section-textbooks {
    margin-bottom: 80px;
}

.container.section-textbooks .row {
    width: 100% !important;
}

.static-area .section-textbooks h2 {
    margin-top: 0;
    margin-bottom: 12px;
}

.static-area .section-textbooks p {
    margin-bottom: 0px;
    max-width: 100%;
    font-size: 18px;
    font-weight: normal;
    letter-spacing: normal;
    color: #030d51;
}

.section-textbooks ol.flickity-page-dots {
    left: auto;
    right: 40px;
    bottom: 39px;
}

.section-textbooks .flickity-page-dots .dot {
    margin: 0px 0px 0px 14px;
}

.section-textbooks .slider-nav-light.slider-nav-dots-simple .flickity-page-dots .dot {
    opacity: 1;
}

.section-textbooks .flickity-page-dots .dot.is-selected {
    background-color: #c3ede6 !important;
    border-color: #c3ede6;
}

.section-textbooks a.button {
    width: 100%;
    max-width: 333px;
    height: 80px;
    font-size: 18px;
    font-weight: bold;
    line-height: 60px;
    margin-right: 0px;
    border-radius: 50px;
    border: none;
    color: #030d51 !important;
    background-color: #c3ede6 !important;
}

.section-textbooks .btn-align {
    text-align: center;
}

.static-area .section-premium-cta {
    margin-top: 25px;
    margin-bottom: 20px;
    text-align: center;
}

.container.section-premium-cta .row {
    width: 100% !important;
}

.static-area .section-premium-cta h2 {
    max-width: 945px;
    font-size: 42px;
    margin: 0 auto 32px;
}

.static-area .section-premium-cta p {
    margin-bottom: 0px;
    max-width: 100%;
    font-size: 18px;
    font-weight: normal;
    letter-spacing: normal;
    color: #030d51;
}

.section-premium-cta a.button {
    width: 100%;
    max-width: 333px;
    height: 80px;
    font-size: 18px;
    font-weight: bold;
    line-height: 60px;
    margin-right: 0px;
    border-radius: 50px;
    border: none;
    color: #030d51 !important;
    background-color: #c3ede6 !important;
}

.no-gap .large-6 {
    padding-bottom: 0px;
}

.no-gap .row {
    width: 100% !important;
    margin: auto !important;
}

/* mobile */
@media screen and (max-width: 849px) {
    .section-pricing-01 {
        height : auto;
        min-height : 400px;
        display: flex;
        justify-content: center;
    }

    .section-pricing-01 .pricing-banner{
        margin: 30px 0;
        justify-content: center;
    }

    .section-pricing-01 .pricing-banner img{
        display: none;
    }
    .section-pricing-01 .pricing-banner-inner .pricing-title{
        text-align:center;
        font-size: 35px;
        display : block;
    }
    
    .section-pricing-01 .pricing-title.pc{
        display : none;
    } 
    
    .section-pricing-01 .pricing-benefit:after {
        content: 'flickity';
        display: none;
    }

    .section-pricing-01 .pricing-benefit .flickity-viewport{
        min-height : 200px;
    }
 
    .section-pricing-01 .pricing-benefit .flickity-page-dots{
        bottom: 0px;
    }

    .section-pricing-01 .pricing-benefit .flickity-page-dots .dot{
        opacity: 0.5;
        background-color: #FFFFFF;
        border-color: #FFFFFF;
    }

    .section-pricing-01 .pricing-benefit .flickity-page-dots .dot.is-selected{
        background-color: #FFFFFF;
    }
    .section-pricing-02{
        margin: 50px 0;
    }
    .section-pricing-02 .pricing-plan-wrapper{
        flex-direction: column;
    }

    .section-pricing-02 .pricing-title{
        text-align : center;
        max-width : inherit;
        margin-bottom : 20px;
        font-size:32px;
    }

    .section-pricing-02 .pricing-plan{
        flex-direction : column;
        padding-bottom:0;
    }

    .section-pricing-02 .pricing-plan-box{
        width : 100%;
    }
    
    .section-pricing-02 .pricing-plan-title{
        flex-direction: column;
        gap:0 !important;
    }
    .section-textbooks .flickity-page-dots {
        right: 20px;
        bottom: 20px;
    }

    .static-area .section-premium-cta h2 {
        font-size: 22px;
    }

    .section:not(.landing-default) .min-large-column-reverse {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }


    span.br_tag {
        display: none;
    }

    .section-pricing-03 {
        margin-bottom: 0px;
    }

    .section-pricing-03 .image-area {
        margin-left: 0px;
    }

    .section-pricing-03 .shape-1 {
        top: 22px;
        right: 0%;
        max-width: 100px;
    }

    .section-pricing-04 .image-area {
        margin-left: 0px;
    }

    .section-pricing-04 .shape-1 {
        left: 0px;
    }

    .section-pricing-04 .shape-2 {
        left: auto;
        right: 10%;
        max-width: 230px;
        top: 60%;
    }

    .section-pricing-05 .col.large-6:first-child {
        position: initial;
    }

    .section-pricing-05 .col.large-6 a.button {
        position: absolute;
        bottom: 0;
        z-index: 1;
    }

    .section-pricing-05 .col.large-6:last-child {
        padding-bottom: 100px;
    }

    .section-pricing-05 .shape-1 {
        right: 0px;
        width: 120px;
    }

    .section-pricing-05 .shape-2, .section-pricing-05 .shape-3 {
        right: 10%;
        max-width: 300px;
        height: 134px;
    }

    .static-area .section-textbooks {
        margin-bottom: 10px;
    }

     /* add 22.03.16 */
     .section-pricing-03 .membership-info {
        padding: 40px 20px 30px 30px;
        width: 98%;
        margin-left: auto;
        margin-right: auto;
    }
}



/* **************************************** *
* UX Builder - QnA
* **************************************** */
.ttm-qna .accordion {
    margin-bottom: 39px;
}

.ttm-qna .accordion .toggle {
    top: 50% !important;
    left: auto;
    right: 0;
    width: 24px;
    height: 24px;
    min-height: 24px;
    line-height: 24px;
    margin-right: 20px;
    background-color: #d7e3f2;
    border-radius: 99px;
    opacity: 1;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.ttm-qna .accordion .accordion-title.active .toggle {
    -webkit-transform: translateY(-50%) rotate(-180deg);
    ;
    -ms-transform: translateY(-50%) rotate(-180deg);
    ;
    transform: translateY(-50%) rotate(-180deg);
    ;
}

.ttm-qna .accordion .toggle .icon-angle-down {
    font-size: 14px;
}

.ttm-qna .accordion .accordion-title {
    padding: 25px 20px;
    padding-right: 50px;
    background-color: transparent;
    color: #000000;
    font-weight: 500;
    border-color: rgba(204, 204, 204, 0.5);
}

.ttm-qna .accordion .accordion-title.active {
    color: #000000;
    border-color: rgba(204, 204, 204, 0.5);
}

.ttm-qna .accordion .accordion-inner {
    background-color: #f9f9f9;
    border-top: 1px solid rgba(204, 204, 204, 0.5);
    padding-bottom: 13px;
}

.ttm-qna .accordion .accordion-item:last-child {
    border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}

.ttm-qna .accordion .accordion-title span:before {
    content: "Q. ";
}

.ttm-qna .accordion .accordion-inner p {
    margin-bottom: 10px;
    max-width: 703px;
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: normal;
    color: #000000;
}

html .ttm-qna a.button.primary.ttm-qna-btn {
    background-color: #9c9cf7;
    color: #ffffff;
    width: 100%;
    max-width: 222px;
    height: 48px;
    border: none;
    float: right;
    margin-right: 20px;
}

.ttm-qna a.ttm-qna-btn span {
    line-height: 29px;
    font-size: 18px;
}

