@charset "UTF-8";

/* 注意：scssなし *.cssを直接変更可能 */

/* キービジュアル更新 */
@media print, screen and (min-width: 769px)
{
    .special-care #main_2
    {
        width: 100%;
        height: calc(100vh - 190px);
        min-height: 550px;
        background-image: url('../img/skincare/series/special-care/mainvisual1_product_pc_260227.png'), url('../img/skincare/series/special-care/mainvisual1.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: auto 100%, cover;
    }
}

@media screen and (max-width: 768px)
{
    .special-care #main_2
    {
        width: 100%;
        height: 146.2vw;
        background: url('../img/skincare/series/special-care/mainvisual1_product_sp_260227.jpg') no-repeat center center;
        background-size: cover;
    }
}

/* 202512 定期拡充対応　add */

.special-care {
    font-family: "Noto Serif JP", serif;
    font-weight: 400;
    letter-spacing: 0;
}

.special-care #lineup ul li .text p.desc, .lineup ul li .text p.desc,
.special-care #lineup ul li .text p.category, .lineup ul li .text p.category {
    letter-spacing: 0;
}

.special-care #main_2 section .tl_main {
    font-family: 'Bentham', serif;
    font-size: 48px;
    text-align: center;
    margin-bottom: 8px;
    letter-spacing: 1px;
}

@media screen and (max-width: 768px) {
    .special-care #main_2 section .tl_main {
        font-size: 8vw;
        margin-bottom: 2vw;
    }
}

.special-care #main_2 section .tl_sub {
    font-size: 14px;
    text-align: center;
    margin-bottom: 40px;
    letter-spacing: 1px;
}

@media screen and (max-width: 768px) {
    .special-care #main_2 section .tl_sub {
        font-size: 3vw;
        margin-bottom: 5vw;
    }
}

.special-care .ttl .sub,
.special-care .btn,
.special-care #lineup ul li .text h3 span:nth-child(1), .lineup ul li .text h3 span:nth-child(1),
.special-care #lineup ul li .text h3 span:nth-child(2), .lineup ul li .text h3 span:nth-child(2) {
    font-family: "Noto Serif JP", serif;
}

.special-care .ttl .sub {
    font-weight: 400;
}

.special-care #lineup .notes {
    font-size: 11px;
    margin-top: 8px;
}

@media screen and (max-width: 768px) {
    .special-care #lineup .notes {
        font-size: 2.8vw;
        margin-top: 4vw;
        margin-bottom: 4vw;
    }
}

.special-care #lineup sup {
    font-size: 80%;
    vertical-align: super;
    margin: 0 1px;
}

.special-care #main_2 section {
    width: auto;
}

@media screen and (min-width: 769px) {
    .special-care #main_2 section {
        width: auto;
        transform: translate(-500px, -50%);
    }
}