.f12 {
    font-size: 12px;
}

.ma {
    margin-left: auto;
    margin-right: auto;
}

.mb025 {
    margin-bottom: 25px;
}

.mb050 {
    margin-bottom: 50px;
}

.pr {
    position: relative;
}

.pa {
    position: absolute;
}

.di {
    display: inline;
}

.db {
    display: block;
}

.df {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.aifs {
    align-items: flex-start;
}

.aic {
    align-items: center;
}

.jcsb {
    justify-content: space-between;
}

.jcc {
    justify-content: center;
}

.tl {
    text-align: left;
}

.tc {
    text-align: center;
}

.tr {
    text-align: right;
}

.hl {
    display: inline !important;
    background: linear-gradient(transparent 50%, #fff2b3 0%);
}

p {
    margin: 0;
}

.sections {
    font-size: 16px;
    max-width: 510px;
    width: 100%;
    margin: 0 auto;
}

.video {
    display: block;
    width: 88.235%;
    padding-top: 49.412%;
    margin: 0 auto;
}

.video iframe {
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

#sec02 {
    margin-bottom: 40px;
}

#sec03 {
    margin: 0 0 25px;
}

#sec03 .txt {
    font-size: 12px;
    width: 88.235%;
}
#sec04 h2 {
    text-align: center;
    font-size: 26px;
    line-height: 1.6;
    background: #ffedf2;
    padding: 0 0 25px;
    margin: 0 0 25px;
}

#sec04 h2 span {
    font-size: 34px;
}

#sec04 h3 {
    text-align: center;
    font-size: 22px;
    line-height: 1.8;
    color: #ff9703;
    margin: 35px 0 25px;
}

#sec09 h2 {
    text-align: center;
    font-size: 26px;
    line-height: 1.6;
    background: #ffedf2;
    padding: 0 0 25px;
    margin: 0 0 30px;
}

#sec09 h2 span {
    font-size: 34px;
}

#sec09 h3 {
    text-align: left;
    font-size: 22px;
    line-height: 1.8;
    background: #fff8fa;
    color: #ff7094;
    margin: 0 auto 20px;
}

#sec04 .sec04-1 .txt,
#sec04 .sec04-2 .txt,
#sec04 .sec04-3 .txt {
    width: 86.275%;
}

#sec04 .sec04-4 .txt,
#sec04 .sec04-5 .txt {
    width: 55.49%;
}

#sec04 .img {
    width: 44.51%;
}

#sec04 .txt span {
    width: 84.806%;
    line-height: 1.8;
    display: block;
    margin: 0 auto;
}

#sec04 .sec04-1 .df {
    border: solid 1px #ccc;
    padding: 0 30px 30px;
}

#sec04 .sec04-1 .df .txt {
    width: 51.340%;
    font-size: 16px;
    line-height: 1.8;
}

#sec04 .sec04-1 .df .pic {
    width: 42.635%;
}

#sec04 .sec04-1 h2 {
    margin-top: 0;
}

#sec04 .sec04-3 hr {
    display: block;
    margin-top: 35px;
    border: dotted #e5e5e5;
    border-width: 0 0 2px 0;
}

#sec06 p {
    width: 88.235%;
    margin: 0 auto 40px;
}

#sec07 {
    background: #faf6ef;
    padding: 0 0 50px;
}

#sec07 .sec07_btn {
    width: 88.235%;
    margin: 0 auto;
    text-align: center;
}

#sec09 .sec09-1 .txt {
    width: 55.49%;
}

#sec09 .sec09-1 .img {
    width: 44.51%;
}

#sec09 .txt span {
    width: 77.745%;
    line-height: 1.8;
    display: block;
    margin: 0 auto;
}

#sec09 .sec09-2 .pic {
    width: 35.49%;
}

#sec09 .sec09-2 .dtl {
    width: 64.51%;
}

#sec09 .sec09-2 h4 {
    display: inline;
    color: #ffa203;
    border: solid 2px #ffa203;
    border-radius: 14px;
    padding: 3px 18px;
    margin: 0 0 15px 15px;
}

#sec09 .sec09-2 .txt {
    width: 80%;
    line-height: 1.8;
    margin: 15px 0 0 15px;
}

#sec09 .sec09-3 h4 {
    display: inline;
    color: #ffa203;
    border: solid 2px #ffa203;
    border-radius: 14px;
    padding: 3px 18px;
    margin: 0 0 15px 30px;
}

#sec09 .sec09-3 .txt {
    width: 88%;
    margin: 0 auto 30px;
}

#sec09 .sec09-3 .pics {
    margin: 15px auto 0;
}

#sec10 {
    background: #faf6ef;
    padding: 0 0 50px;
    margin: 0 0 35px;
}

#sec11 {
    border: solid 2px #ccc;
    padding: 0 30px 30px 30px;
    margin: 0 0 60px;
}

#sec11 h4 {
    display: inline;
    color: #fff;
    background: #659ed6;
    border-radius: 14px;
    padding: 6px 18px;
}

#sec11 ul {
    font-size: 18px;
    width: 420px;
    padding: 0 0 0 20px;
    margin: 15px 0 30px;
    list-style: none;
}

#sec11 ul li {
    background: url('https://www.natural-s.jp/img/items/mk_527baby_milky_cream/pc/202210_11-icon.png') 0 0 no-repeat;
    min-height: 32px;
    padding: 0 0 0 40px;
    margin: 0 0 20px;
}

#sec11 .df ul {
    width: 50%;
}

#sec12 img {
    width: 100%;
}

#otoku_bottle {
    margin-bottom: 40px;
}

/* faq----------------------------- */
#kidsline .q_box .title {
    position: relative;
    cursor: pointer;
    transition: all .5s ease;
    background: url(/img/items/mk_527baby_milky_cream/pc/question_icon.png) no-repeat left center;
    background-size: 38px;
    text-align: left;
    text-align: left;
    padding: 12px 45px 12px 61px;
    line-height: 3.4rem;
    border-bottom: 1px dashed #f8a443;
    margin-bottom: 2rem;
    font-size: 19px;
}
#kidsline .q_box .title::before,
#kidsline .q_box .title::after{
    position: absolute;
    content: '';
    right: 15px;
    top: 47%;
    width: 15px;
    height: 2px;
    background-color: #343434;
}
#kidsline .q_box.title::before{
    top:47%;
    right: 15px;
    transform: rotate(0deg);
}
#kidsline .q_box .title::after{    
    top: 47%;
    right: 15px;
    transform: rotate(90deg);
    transition: 0.5s;
}
#kidsline .q_box .title.close::after{
    transform: rotate(0deg);
}
#kidsline .q_box .box {
    display: none;
    background: #fff7ea;
    margin:0 0 3%;
    padding: 3%;

    text-align: left;
    font-size: 1.7rem;
}


@media only screen and (max-width: 767px) {
    p {
        margin: 0;
    }

    .ma {
        margin-left: auto;
        margin-right: auto;
    }
    #sec02 {
        margin-bottom: 40px;
    }
    .mb010 {
        margin-bottom: 10px;
    }

    .mb015 {
        margin-bottom: 15px;
    }

    .mb020 {
        margin-bottom: 20px;
    }

    .mb025 {
        margin-bottom: 25px;
    }

    .mb050 {
        margin-bottom: 50px;
    }

    .pr {
        position: relative;
    }

    .pa {
        position: absolute;
    }

    .di {
        display: inline;
    }

    .db {
        display: block;
    }

    .df {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

    .aifs {
        align-items: flex-start;
    }

    .aic {
        align-items: center;
    }

    .jcsb {
        justify-content: space-between;
    }

    .jcc {
        justify-content: center;
    }

    .tl {
        text-align: left;
    }

    .tc {
        text-align: center;
    }

    .tr {
        text-align: right;
    }

    .hl {
        display: inline !important;
        background: linear-gradient(transparent 70%, #fff2b3 0%);
    }

    .sections {
        max-width: 750px;
        width: 100%;
        margin: 0 auto;
    }

    .sec_inner {
        width: 89.334%;
        margin: 0 auto;
    }

    .video {
        display: block;
        margin: 0 auto;
    }

    #sec02 .video {
        width: 95.525%;
        padding-top: 53.6%;
    }

    #sec10 .video {
        width: 85.334%;
        padding-top: 48.0%;
    }

    .video iframe {
        width: 100%;
        height: 100%;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    #sec02 {
        margin-bottom: 40px;
    }

    #sec03 {
        margin: 0 0 25px;
    }

    #sec03 .txt {
        font-size: 22px;
        line-height: 1.8;
    }

    #sec04 h2 {
        text-align: center;
        font-size: 36px;
        line-height: 1.6;
        background: #ffedf2;
        padding: 0 30px 25px;
        margin: 0 0 25px;
    }

    #sec04 h2 span {
        font-size: 48px;
    }

    #sec04 h3 {
        text-align: center;
        font-size: 30px;
        line-height: 1.8;
        color: #ff9703;
        margin: 35px 0 25px;
    }

    #sec04 h3 span {
        font-size: 36px;
    }

    #sec09 h2 {
        text-align: center;
        font-size: 36px;
        line-height: 1.6;
        background: #ffedf2;
        padding: 0 30px 25px;
        margin: 0 0 30px;
    }

    #sec09 h2 span {
        font-size: 48px;
    }

    #sec09 h3 {
        text-align: left;
        font-size: 30px;
        line-height: 1.8;
        background: #fff8fa;
        color: #ff7094;
        padding-left: 2.24%;
        margin: 0 auto 40px;
    }

    #sec04 .sec04-1 .txt {
        font-size: 30px;
        width: 100%;
        line-height: 1.8;
    }

    #sec04 .sec04-3 .txt {
        font-size: 30px;
        width: 100%;
        line-height: 1.8;
    }

    #sec04 .sec04-3 .txt.note {
        font-size: 22px;
    }

    #sec04 .sec04-2 .txt {
        font-size: 30px;
        width: 88%;
        line-height: 2;
    }

    #sec04 .sec04-4 .txt,
    #sec04 .sec04-5 .txt {
        font-size: 30px;
        width: 55%;
    }

    #sec04 .img {
        width: 44%;
    }

    #sec04 .txt span {
        width: 84.806%;
        line-height: 1.8;
        display: block;
        margin: 0 auto 60px;
    }

    #sec04 .sec04-1 .float_area {
        border: solid 2px #ccc;
        border-width: 0 2px 2px;
        padding-bottom: 40px;
    }

    #sec04 .sec04-1 .float_area .pic {
        width: 41.194%;
        float: right;
        margin: 0 45px 0 30px;
    }

    #sec04 .sec04-1 .float_area .txt {
        width: 87%;
        font-size: 30px;
        line-height: 2;
        margin: 0 0 0 45px;
    }

    #sec04 .sec04-1 .float_area::after {
        content: " ";
        display: block;
        clear: both;
    }

    #sec04 .sec04-3 hr {
        display: block;
        margin-top: 35px;
        border: dotted #e5e5e5;
        border-width: 0 0 4px 0;
    }

    #sec06 p {
        width: 88.235%;
        margin: 0 auto 60px;
    }

    #sec07 {
        background: #faf6ef;
        padding: 0 0 75px;
    }

    #sec07 .sec07_btn {
        width: 89.333%;
        margin: 0 auto;
    }

    #sec09 .sec09-1 .txt {
        width: 55.49%;
    }

    #sec09 .sec09-1 .img {
        width: 44.51%;
    }

    #sec09 .txt span {
        font-size: 30px;
        width: 84.806%;
        line-height: 1.8;
        display: block;
        margin: 0 auto;
    }

    #sec09 .sec09-2 .pic {
        width: 35.971%;
    }

    #sec09 .sec09-2 .dtl {
        width: 58.029%;
    }

    #sec09 .sec09-2 h4 {
        font-size: 28px;
        font-weight: 350;
        display: inline;
        color: #ffa203;
        border: solid 2px #ffa203;
        border-radius: 21px;
        padding: 3px 18px;
        margin: 0;
    }

    #sec09 .sec09-2 .txt {
        font-size: 30px;
        line-height: 1.8;
        width: 94%;
        margin: 15px 0 0 0;
    }

    #sec09 .sec09-3 h4 {
        font-size: 28px;
        font-weight: 350;
        display: inline;
        color: #ffa203;
        border: solid 2px #ffa203;
        border-radius: 21px;
        padding: 3px 18px;
        margin: 0;
    }

    #sec09 .sec09-3 .txt {
        font-size: 30px;
        line-height: 1.8;
        margin: 0 auto 45px;
    }

    #sec09 .sec09-3 .pics {
        margin: 30px auto 0;
    }

    #sec10 {
        background: #faf6ef;
        padding: 0 0 50px;
        margin: 0 0 35px;
    }

    #sec11 {
        border: none;
        padding: 0;
        margin: 0;
    }

    #sec11 .sec_inner {
        border: solid 2px #ccc;
        padding: 0 30px 30px 30px;
        margin: 0 auto 60px;
    }

    #sec11 h4 {
        font-size: 26px;
        font-weight: 350;
        display: inline;
        color: #fff;
        background: #659ed6;
        border-radius: 18px;
        padding: 8px 24px;
        margin: 0;
    }

    #sec11 ul {
        font-size: 30px;
        padding: 0 0 0 20px;
        margin: 30px 0 45px;
        list-style: none;
    }

    #sec11 ul li {
        background: url('https://www.natural-s.jp/img/items/mk_527baby_milky_cream/sp/202210_11-icon.png') 0 0 no-repeat;
        min-height: 42px;
        padding: 0 0 0 60px;
        margin: 0 0 20px;
    }

    #sec11 .df ul {
        width: 56%;
    }

    #sec12 img {
        width: 100%;
    }

            /* 関連商品(上部) */
            #sec_item .products_list_wrap{
        justify-content: center;
        padding: 0 20px;
        justify-content: space-around;
        margin-bottom: 80px;
    }
    #sec_item .products_list_detail .name{
        font-size: 26px;
    }
    #sec_item .products_list_detail .name span{
        font-size: 24px;
    }
    #sec_item .products_list_item .price div>.num{
        font-size: 32px;
    }
    #sec_item .products_list_wrap .recomend_itm{
        position: relative;
    }
    #sec_item .products_list_wrap .recomend_itm::before{
        position: absolute;
        top: 30px;
        left: 0;
        z-index: 1;
        line-height: 120px;
        content: "おすすめ";
        font-weight: bold;
        font-size: 25px;
        color: #fff;
        text-align: center;
        background-color: #ff8888;
        border-radius: 100px;
        height: 120px;
        width: 120px;
    }
    #sec_item .products_list_wrap .products_list_btn>a{
        display: flex;
        justify-content: center;
        align-items: center;
        height: 80px;
        color: #fff !important;
        font-size: 27px;
        text-decoration: none;
        background-color: #f39632;
        border-radius: 8px;
    }
    #sec_item .products_list_wrap .products_list_bottom .part{
        font-size: 20px;
    }
    #sec_item .products_list_bottom .btn-favorite label span{
        width: 34px;
        height: 33px;
    }
    #sec_item .products_list_item .price div>.num .tax{
        font-size: 21px;
    }
    #otoku_bottle {
        margin-bottom: 40px;
    }

    /* faq----------------------------- */
    #kidsline .q_box .title {
        position: relative;
        cursor: pointer;
        transition: all .5s ease;
        background: url(/img/items/mk_527baby_milky_cream/pc/question_icon.png) no-repeat left center;
        background-size: 47px;
        text-align: left;
        text-align: left;
        padding: 15px 45px 15px 61px;
        border-bottom: 1px dashed #f8a443;
        margin-bottom: 2rem;
    }

    #kidsline .q_box .title::before,
    #kidsline .q_box .title::after{
        position: absolute;
        content: '';
        right: 15px;
        top: 47%;
        width: 28px;
        height: 3px;
        background-color: #343434;
    }
    #kidsline .q_box.title::before{
        top:47%;
        right: 15px;
        transform: rotate(0deg);
    }
    #kidsline .q_box .title::after{    
        top: 47%;
        right: 15px;
        transform: rotate(90deg);
        transition: 0.5s;
    }
    #kidsline .q_box .title.close::after{
        transform: rotate(0deg);
    }
    #kidsline .q_box .box {
        display: none;
        background: #fff7ea;
        margin:0 0 3%;
        padding: 3%;
        text-align: left;
        font-size: 25px;
    }
}