@charset "utf-8";


/* ==================================================================
    brand_4c_personal_order.css

=================================================================== */
/* ==================================================================
   ■ 共通指定
=================================================================== */
.contents .text._s {
    margin-bottom: 0;
}
.contents .text._l {
    font-size: 2rem;
    line-height: 1.5;
    margin-bottom: 20px;
}

/* --------------------------------
   □  accent
-------------------------------- */
#brand_4c_personal_order .accent {
    background-image: url(../../images/4c/personal_order/accent_pc.jpg);
}
    #brand_4c_personal_order .accent .heading {
        text-transform: capitalize;
        margin-bottom: 20px;
    }

/* --------------------------------
   □  explain
-------------------------------- */
#explain .boxArea {
    padding: 0;
    border: none;
}
#explain .boxArea .lv4.en {
    margin-bottom: 5px;
}
#explain .boxArea figure {
    width: 52%;
}
#explain .boxArea .txtArea {
    width: 42%;
}
#explain .boxArea .text + .asterisk {
    margin-top: 10px;
}

/* --------------------------------
   □  noteSec
-------------------------------- */
#noteSec {
    background: #F2F7FF;
    padding-bottom: 150px;
}
#noteSec .asterisk {
    font-size: 1.6rem;
    margin-bottom: 0;
}

/* --------------------------------
   □  footer
-------------------------------- */
#brand_4c_personal_order footer {
    padding-top: 0;
}


@media (max-width: 1600px) and (min-width: 768px) {
}


@media (max-width: 1400px) and (min-width: 768px) {
}


@media (max-width: 1200px) and (min-width: 768px) {
}


/* タブレット用
-------------------------------------------- */
@media (max-width: 999px) and (min-width: 768px) {
}


@media only screen and (max-width : 767px) {
    /* ==================================================================
       ■ 共通指定
    =================================================================== */
    .contents .text,
    .contents .text._s {
        margin-bottom: 0;
    }
    .contents .text._l {
        font-size: 1.8rem;
    }

    /* --------------------------------
       □  accent
    -------------------------------- */
    #brand_4c_personal_order .accent {
        background-image: url(../../images/4c/personal_order/accent_sp.jpg);
        background-position: center;
    }
        #brand_4c_personal_order .accent .txtArea {
            width: 92%;
            top: 8%;
            bottom: auto;
            left: 50%;
            transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
        }

    /* --------------------------------
       □  explain
    -------------------------------- */
    #explain .boxArea:not(:last-child) {
        margin-bottom: 40px;
    }
    #explain figure {
        margin-bottom: 15px;
    }

    /* --------------------------------
       □  noteSec
    -------------------------------- */
    #noteSec {
        padding-bottom: 60px;
    }
    #noteSec .asterisk {
        font-size: 1.4rem;
    }

}