@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500;700&family=Noto+Sans+TC:wght@300;400;500;700&display=swap');

html,
body {
    margin: 0;
    padding: 0;
    font-size: 100%;
}

* {
    box-sizing: border-box;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
}

a {
    text-decoration: none;
    color: #222;
}

.linebreak {
    display: none;
}

.linebreak_pc {
    display: block;
}

.vPC {
    display: inline !important;
}

.vMB {
    display: none !important;
}

@font-face {
    font-family: "OptimaEL";
    src: url("/media/export/cms/artstudio/202004_EL_RN_RNwhitening/pc/font/OptimaEL-Text.eot?#iefix") format("embedded-opentype"),
        url("/media/export/cms/artstudio/202004_EL_RN_RNwhitening/pc/font/OptimaEL-Text.otf") format("opentype"),
        url("/media/export/cms/artstudio/202004_EL_RN_RNwhitening/pc/font/OptimaEL-Text.woff") format("woff"),
        url("/media/export/cms/artstudio/202004_EL_RN_RNwhitening/pc/font/OptimaEL-Text.ttf") format("truetype"),
        url("/media/export/cms/artstudio/202004_EL_RN_RNwhitening/pc/font/OptimaEL-Text.svg#OptimaEL-Text") format("svg");

    font-weight: normal;
    font-style: normal;
}

#el_ec_main {
    font-family: "OptimaEL", "Noto Sans TC", 微軟正黑體, Arial, sans-serif;
    font-size: 1rem;
    width: 100%;
    background-color: #cedff1;
    letter-spacing: 0;
    margin: 0 auto;
    font-weight: 400;
}

#el_ec_main img {
    width: 100%;
    display: block;
}

.area_ct {
    width: 100%;
}

.w1366_ct,
.w1000_b1366_ct {
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.w1000_ct {
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.w_c0720sp {
    color: #a42d32;
    font-weight: 600;
    margin: 0 .1em;
}

.w_en {
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

.w_big {
    font-size: 1.5em;
}


/****************************************************************************** 0720 */

.kv_0720 {
    width: 100%;
    background-color: #f1dad4;
    padding-bottom: 3em;
}

.kv_0720_ct {
    width: 1000px;
    height: 490px;
    margin: 0 auto;
    background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/0720sp_kv.png);
    background-position: center top;
    background-size: 100%;
    background-repeat: no-repeat;
    overflow: hidden;
}

.kv_0720_bd {
    width: 50%;
    margin-top: 4em;
}

.kv_0720_title {
    color: #c03e40;
    font-size: 3.6em;
    text-align: center;
    font-weight: 500;
}

.kv_0720_caption {
    color: #64332c;
    display: flex;
    font-size: 2em;
    justify-content: center;
    letter-spacing: .1em;
    align-items: center;
    height: 2em;
    margin-top: -.3em;
}

.kv_0720_caption_block {
    padding: .1em .5em 0;
    border: 1px solid #64332c;
    font-size: .75em;
    line-height: 1em;
    margin-left: .5em;
    margin-top: .2em;
}

.kv_0720_text {
    width: 100%;
    margin: 3em 0 0 10%;
    font-size: 1.1em;
}

.kv_0720_text span {
    font-weight: 500;
    color: #c03e40;
    font-size: 1.3em;
}

.kv_0720_line_text {
    margin-top: .7em;
    font-weight: 300;
    font-size: 1.1em;
}

.kv_0720_line_text small {
    margin-top: .8em;
}

.kv_0720_line_text span {
    font-size: 1.8em;
}

.sp_0720 {
    width: 100%;
    background-color: #c03e40;
    padding-bottom: 2em;
    padding-top: 2em;
}

.sp_0720_ct {
    width: 1000px;
    height: 707px;
    margin: 0 auto 2em;
    background-position: center top;
    background-size: 100%;
    background-repeat: no-repeat;
    overflow: hidden;
}

.sp_0720_ct_1 {
    background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/sp_0720_ct_1.png);
}

.sp_0720_ct_2 {
    background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/sp_0720_ct_2.png);
}

.sp_0720_ct_3 {
    background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/sp_0720_ct_3.png);
}

.sp_0720_title {
    font-weight: 600;
    font-size: 2em;
    width: fit-content;
    margin: 4em auto 0;
}

.sp_0720_text {
    font-size: 1.4em;
    width: fit-content;
    margin: 0 auto 0;
    text-align: center;
    line-height: 1.2em;
}

.sp_0720_text_free {
    width: 2em;
    height: 2em;
    background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/0720sp_c2.png);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    color: #fff;
    line-height: 2em;
    text-align: center;
    display: inline-block;
}

.sp_0720_bd {
    display: grid;
    grid-template-columns: auto 1fr;
    width: fit-content;
    margin: 17.5em auto 0;
    align-items: center;
}

.sp_0720_c1 {
    width: 4em;
    height: 4em;
    background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/0720sp_c1.png);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    color: #fff;
    line-height: 1.2em;
    text-align: center;
    font-size: 2em;
    font-weight: 500;
    letter-spacing: .05em;
    padding: .9em 0 0;
    margin: 0 .5em;
}

.sp_0720_ctext {
    font-size: 2.4em;
    font-weight: 600;
    line-height: 1em;
}

.sp_0720_ctext small {
    font-size: .7em;
    font-weight: 300;
}


@media screen and (max-width: 1000px) {

    .kv_0720,
    .sp_0720 {
        font-size: 1.6vw;
    }


    /****************************************************************************** 0720 */
    .kv_0720_ct {
        width: 100%;
        height: calc(490 * 100vw/1000);
    }



    .sp_0720_ct {
        width: 100%;
        height: calc(707 * 100vw/1000);
    }


}


/***
 *                ███████╗███████╗ ██████╗ 
 *                ╚════██║██╔════╝██╔═████╗
 *                    ██╔╝███████╗██║██╔██║
 *                   ██╔╝ ╚════██║████╔╝██║
 *                   ██║  ███████║╚██████╔╝
 *                   ╚═╝  ╚══════╝ ╚═════╝ 
 *                                         
 */
@media screen and (max-width: 750px) {

    .vPC {
        display: none !important;
    }

    .vMB {
        display: block !important;
    }

    .linebreak {
        display: block;
    }

    .linebreak_pc {
        display: none;
    }

    .kv_0720 {
        font-size: 2.6vw;
    }

    .sp_0720 {
        font-size: 1.7vw;
    }

    .sp_0720_title {
        margin: 11vw auto 0;
    }

    .sp_0720_bd {
        margin: 28vw auto 0;
    }

    /************************************************************ 0720 */
    .kv_0720_ct {
        width: 100%;
        height: calc(706 * 100vw/750);
        background-image: url(https://www.esteelauder.com.tw/media/export/cms/2022EC/07/images/0720sp_kv_m.png);
    }

    .kv_0720_bd {
        width: 50%;
        margin-top: 6em;
    }

    .kv_0720_title {
        line-height: 1em;
    }

    .kv_0720_caption {
        display: block;
        text-align: center;
        font-size: 2.2em;
        margin-top: 0;
    }

    .kv_0720_caption_block {
        width: fit-content;
        margin: 0.2em auto 0;
        padding-top: .2em;
    }

    .kv_0720_text {
        width: 170%;
        margin: 4em 0 0 14vw;
    }


    .sp_0720_text_free {
        line-height: 2.1em;
    }


    .sp_0720_title {
        font-size: 2.5em;
    }

    .sp_0720_ctext {
        font-size: 2.8em;
    }


}