@charset "utf-8";



/*------------------------------------------------------------------------------------------

*

*

    products_sp.css

*

*

------------------------------------------------------------------------------------------ */





/* --------------------------------------------------------------------------------------------------------------

*

    max-width: 640px

*

-------------------------------------------------------------------------------------------------------------- */



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

    

    

    .und{

        text-decoration: underline;

    }

    

/* --------------------------------------------------

*

    #page_product

*

-------------------------------------------------- */

    #page_product {

        padding: 0 0 25px 0;

        background-color: #000125;

        overflow: hidden;

        position: relative;

    }

  

  .product_header {

    padding-bottom: 27px;

  }

  

  .product_header_sp_nav {

    display: flex;

    position: relative;

    z-index: 30;

  }

  

  .product_header_sp_nav li {

    width: 50%;

    height: 50px;

    display: table;

  }

  

  .product_header_sp_nav li:first-child {

    border-right: 1px solid #4d4e67;

  }

  

  .product_header_sp_nav li a {

    display: table-cell;

    width: 100%;

    height: 45px;

    background: #000125;

    color: #fff;

    text-align: center;

    vertical-align: middle;

    font-size: 12px;

    line-height: 1.2;

  }

  

  .product_bg img {

    width: 100%;

  }

  

/*

  .concentrate .product_header_title {

    margin: 0 12px;

  }

*/



  .concentrate .product_header_title,

  .basemake .product_header_title,

  .actirise .product_header_title {

    margin: 29px 0 25px 18px;

  }

  

  .concentrate .product_header_title {

    width: 287px;

  }

  

  .basemake .product_header_title {

    width: 242px;

  }

  

  .actirise .product_header_title {

    width: 228px;

  }

  

  .product_header_title img {

    width: 100%;

  }

  

  .product_header_text {

    margin: 0 18px;

    font-size: 14px;

    line-height: 1.5;

    color: #fff;

  }

    #product_list {

        width: 320px;

        margin: 0 auto;

    }

    #product_list:after {

        content: '';

        clear: both;

        display: block;

    }

    #product_list a {

        color: #fff;

    }

    #product_list li {

        padding: 0 0 0 129px;

        margin: 0 0 40px 0;

        position: relative;

        color: #fff;

        transition: opacity .1s ease;

    }

    #product_list li:hover {

        opacity: .7;

    }

    #product_list li .img {

        text-align: center;

        position: absolute;

        top: 0;

        left: 0;

    }

    #product_list li:not(.clean-lyt) .img img {

        width: 129px;

        height: auto;

    }

    #product_list li.p_t_wash .img {

        top: -40px;

    }

    #product_list li.p_c_treatment .img {

        top: -28px;

        left: 6px;

    }

    #product_list li.p_c_lotion .img {

        top: -38px;

    }

    #product_list li.p_c_cream .img {

        top: -15px;

        left: 13px;

    }

    #product_list li.p_c_oil .img {

        top: -30px;

        left: 12px;

    }

    #product_list li .col_desc {

        width: auto;

        height: 100px;

        position: relative;

    }

    #product_list li .ico_new {

        margin: 0 0 1px 0;

    }

    #product_list li .ico_new img {

        width: 33px;

        height: auto;

    }

    #product_list li h3 {

        margin: 0 0 0px -3px;

        font-size: 16px;

        letter-spacing: -.05em;

        line-height: 1.2em;

    }

    #product_list li h3 br.sp {

        display: block;

    }

    #product_list li .category {

        padding: 3px 6px;

        margin: 2px 0 6px 0;

        height: 20px;

        display: inline-block;

        box-sizing: border-box;

        border: 1px solid #fff;

        font-size: 10px;

        letter-spacing: .05em;

    }

    #product_list li .btn_detail {

        position: absolute;

        bottom: 0;

        left: 0;

    }

    #product_list li .btn_detail img {

        width: 56px;

        height: auto;

    }

    .hide {

        visibility: hidden;

    }

    #product_list li.clean-lyt h3 .h_note {

        font-size: 12px;

    }

    #product_list li.clean-lyt.shadow-type-g h3 .h_note {

        display: block;

        line-height: 1.4;

    }

    /* 201706 : CLEAN LAYOUT*/

    #product_list li.clean-lyt {

        position: relative;

    }

    #product_list li.clean-lyt .img {

        position:absolute;

        left: 64px;

        top:48%;/*50%;*/

        transform: translate(-50%, -50%);

        -webkit-transform: translate(-50%, -50%);

        -ms-transform: translate(-50%, -50%);

    }

    /*

    #product_list li.clean-lyt .img img {

        width:auto;

        height:auto;

    }

    */

    /* --------------------------------------------------

    *

        #page_product_detail

    *

    -------------------------------------------------- */

    #page_product_detail {

        background-color: #000125;

        color: #010043;

    }

    #page_product_detail h2 .h_note{

        font-size: 12px;

        display:block;

    }

    #page_product_detail h1 .h_note{

        font-size: 12px;

    }

    #page_product_detail a {

        color: #010043;

    }

    #page_product_detail p.title_products {

        padding: 21px 0;

        text-align: center;

        line-height: 0;

        position: relative;

    }

    #page_product_detail p.title_products img {

        width: 81px;

        height: auto;

    }

    .ruby-text{

        line-height: 2.1em;

        font-size:14px;

    }

    #section_detail #how_to_use li.ruby-round-text {

        line-height: 2.1em;

    }

    .ruby-text ruby,

    #page_product_detail ruby.ruby-round{

        display: inline-table;

        margin: 0;

        padding: 0;

        border: none;

        white-space: nowrap;

        text-indent: 0;

        vertical-align: text-bottom;

    }

    .ruby-text ruby rb,

    #page_product_detail ruby.ruby-round rb{

        display: table-row;

        margin: 0;

        padding: 0;

        border: none;

        line-height: 1.6;

        text-align: center;

    }

    .ruby-text ruby rt,

    #page_product_detail ruby.ruby-round rt{

        display: table-header-group;

        margin: 0;

        padding: 0;

        border: none;

        font: inherit;

        font-size: 60%;

        line-height: 0.45;

        text-align: center;

    }

    #page_product_detail ruby.ruby-round rb {

        line-height: 1.45;

    }

    #page_product_detail ruby.ruby-round rt {

        font-size: 14px;

        font-weight: bold;

        font-family: 'NotoSans', Meiryo,メイリオ,'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',san-serif;

        line-height: 0;

    }

    /*for firefox*/

    @-moz-document url-prefix(){

      #page_product_detail ruby.ruby-round rb{

        line-height: 1.52;

      }

    }



    /* -----------------------------------

        #section_product

    ----------------------------------- */

    #section_product {

        padding: 44px 0 0 0;

        box-sizing: border-box;

        background-color: #fff;

        overflow: hidden;

    }

    #section_product .section_inner {

        width: 100%;

        margin: 0 auto;

    }

    #section_product .caution {

        font-size: 12px;

    }

    #section_product .product_img {

        width: 42%;

        height: 224px;

        text-align: center;

        float: left;

        margin-top: -55px;

    }

    #section_product .product_img img {

        height: auto;

    }

    .t_wash #section_product .product_img img {

        width: 52px;

        margin-top: 0;

    }

    .c_lotion #section_product .product_img img {

        width: 50px;

        margin-top: 40px;

    }

    .c_cream #section_product .product_img img {

        width: 118px;

        margin-top: 0;

    }

    .c_oil #section_product .product_img img {

        width: 85px;

        margin-top: 0;

    }

    .c_treatment #section_product .product_img img {

        width: 120px;

        margin-top: 50px;

    }

    .t_cleansing_cream #section_product .product_img img {

        margin-top: 0px;

    }

    .c_eyecream #section_product .product_img img {

        margin-top: 0px;

    }

    .f_massage_cream #section_product .product_img img {

        margin-top: 0px;

    }

    .c_treatment #section_product .t_cleansing_cream_img img {

        margin-top: 0px;

    }

    .c_treatment #section_product .e_cream_img img {

        margin-top: 0px;

    }

    .c_treatment #section_product .f_massage_cream_img img {

        margin-top: 0px;

    }

    .clean-lyt #section_product .product_img {

        height: auto;

        margin-top: 0;

    }

    .clean-lyt #section_product .product_img img {

        width: 50%;

        /*70px;*/

        height: auto;

        margin-bottom: 40px;

        /*50px;*/

    }

    /* EXCEPTION FOR CONCEALER */

    .concealer.clean-lyt #section_product .product_img img {

        width: 17px;

    }

    /* EXCEPTION FOR FACE POWDER */

    .face_powder.clean-lyt #section_product .product_img img {

        width: 76%;

        margin-top: 10px;

        margin-bottom: 50px;/*70px;*/

    }

    /* EXCEPTION FOR FACE PUFF */

    .face_puff.clean-lyt #section_product .product_img img {

        width: 76%;

        margin-bottom: 40px;

    }

    /* EXCEPTION FOR MAKEUP SPONGE L */

    .makeup_sponge_l.clean-lyt #section_product .row .desc {

        margin-bottom: 25px;

    }

    /* EXCEPTION FOR CONCENTRATE PROGRAM */

    .concentrate_program.clean-lyt #section_product .col_right h1 {

        margin: 0 0 10px 0;

        line-height: 1.0;

    }

    .concentrate_program.clean-lyt #section_product .product_img {

        width: 100%;

    }

    .concentrate_program.clean-lyt #section_product .product_img img {

        width: auto;

        max-width: 80%;

        margin-bottom: 20px;

    }

    /**

     * Trial Kit

     */

    .trial_kit #section_product .product_img_limited.sp {

        margin: 0 17px 20px 17px;

    }

    .trial_kit #section_product .product_img {

        width: 48%;

        margin: 0 0 32px 0;

        height: auto;

    }

    .trial_kit #section_product .product_img img {

        width: 111px;

        margin-top: 0;

    }

    .trial_kit #section_product .product_img_limited.sp img {

        width: 100%;

    }

    .trial_kit #section_product .col_right {

        width: 52%;

    }

    .trial_kit #section_product .col_right h1 {

        margin: 0 0 10px 0;

        line-height: 1.0;

    }

    .trial_kit #section_detail .item_hd .category {

        display: inline-block;

        margin-bottom: 0;

        margin-right: 6px;

        top: 3px;

    }

    .trial_kit #section_detail .item_hd .item_name {

        display: inline;

    }

    /* shoplist 非表示 */

    .trial_kit #section_product .row .how_to {

        border: none;

        margin: 0;

    }

    .trial_kit #section_product .row .how_to .buy {

        display: none;

    }

    .trial_kit #section_product .row .how_to .sns_list {

        bottom: 0;

    }

    /* shoplist 非表示 */

    

    /**

     * Concentrate Oil Kit

     */

    .c_oil_kit #section_product .product_img_limited.sp {

        margin: 0 17px 20px 17px;

    }

    .c_oil_kit #section_product .product_img {

        width: 48%;

        margin: 0 0 32px 0;

        height: auto;

    }

    .c_oil_kit #section_product .product_img img {

        width: 120px;

        margin-top: 0;

    }

    .c_oil_kit #section_product .product_img_limited.sp img {

        width: 100%;

    }

    .c_oil_kit #section_product .col_right {

        width: 52%;

    }

    .c_oil_kit #section_detail .item_hd .category {

        display: inline-block;

        margin-bottom: 0;

        margin-right: 6px;

        top: 3px;

    }

    .c_oil_kit #section_detail .item_hd .item_name {

        display: inline;

    }

    /* shoplist 非表示 */

    .c_oil_kit #section_product .row .how_to {

        border: none;

        margin: 0;

    }

    .c_oil_kit #section_product .row .how_to .buy {

        display: none;

    }

    .c_oil_kit #section_product .row .how_to .sns_list {

        bottom: 0;

    }

    /**

     * Cyclator

     */

    #page_product_detail.cyclator_kit h1 .h_note,

    #page_product_detail.cyclator h1 .h_note{

        font-size: 16px;

        line-height: 1.0;

        display: block;

    }

    #page_product_detail.cyclator_kit #section_product .col_right h1,

    #page_product_detail.cyclator #section_product .col_right h1 {

        margin: 0 0 10px -3px;

    }



    /* 12/1まで */

    /*

    .cyclator_kit #section_product .row .how_to,

    .cyclator #section_product .row .how_to {

        border: none;

        margin: 0;

    }

    */

    /*

    .cyclator_kit #section_product .row .how_to .buy,

    .cyclator #section_product .row .how_to .buy {

        display: none;

    }

    

    .cyclator_kit #section_product .row .how_to .sns_list,

    .cyclator #section_product .row .how_to .sns_list {

        bottom: 0;

    }

    */

    /* 12/1まで */

    

    .cyclator_kit #section_detail #how_to_use ul.use_fig li.img_use,

    .cyclator #section_detail #how_to_use ul.use_fig li.img_use {

        margin: 24px 0;

    }

    .cyclator_kit #section_detail #how_to_use ul.use_fig li.img_use.img_use_2,

    .cyclator #section_detail #how_to_use ul.use_fig li.img_use.img_use_2 {

        margin: 24px 0 0 0;

    }

    .cyclator_kit #section_detail #how_to_use ul.use_fig li.img_use img,

    .cyclator #section_detail #how_to_use ul.use_fig li.img_use img {

        width: 100%;

        float: none;

        margin: 0;

    }

    #related_list.cyclator_kit ul,

    #related_list.cyclator ul {

        width: 470px;

    }

    #related_list.cyclator_kit li.t_cleansing_cream,

    #related_list.cyclator li.t_cleansing_cream {

        width: 120px;

    }

    #related_list.cyclator_kit li.t_cleansing_cream img,

    #related_list.cyclator li.t_cleansing_cream img {

        width: 82%;

    }

    /* shoplist 非表示 */



    #section_product .col_right {

        width: 58%;

        padding: 0 0 0 0;

        box-sizing: border-box;

        text-align: left;

        float: right;

    }

    #section_product .col_right .category {

        height: 20px;

        margin: 0 0 10px 0;

        padding: 3px 6px;

        box-sizing: border-box;

        display: inline-block;

        border: 1px solid #010042;

        font-size: 10px;

        letter-spacing: .05em;

    }

    #section_product .col_right .brand {

        margin: 0 0 4px 0;

        font-size: 12px;

        letter-spacing: 0;

        line-height: 1.5;

    }

    #section_product .col_right h1 {

        margin: 0 0 2px -3px;

        font-size: 20px;

        letter-spacing: -.05em;

        line-height: 1.2em;

    }

    #section_product .col_right h1.large {

        letter-spacing: -.1em;

    }

    #section_product .col_right .vol {

        margin: 0 0 5px 0;

        font-size: 15px;

        letter-spacing: 0;

        line-height: 1.333em;

    }

    #section_product .col_right .vol:last-child {

        margin: 0 0 15px 0;

    }

    /* EXCEPTION FOR CONCENTRATE PROGRAM */

    .concentrate_program.clean-lyt #section_product .col_right {

        padding: 0 17px;

        margin-bottom:20px;

        float: none;

        width: 100%;

    }

    #section_product .row {

        clear: both;

    }

    #section_product .row .desc {

        margin: 20px 0;/*0 0 13px 0;*/

        padding: 0 17px;

        font-size: 16px;

        line-height: 1.4em;

        letter-spacing: 0;

    }

    #section_product .row .desc br {

        display: block;

    }

    #section_product .row .desc .ico_arrow {

        /*padding: 0 0 0 18px;*/

        padding: 0 0 0 18px;

        position: relative;

        display: inline-block;

        margin-top: 20px;

    }

    #section_product .row .desc .ico_arrow.ico_arrow_02 {

        margin-bottom: 12px;

    }

    #section_product .row .desc .ico_arrow:before {

        content: '';

        width: 6px;

        height: 100%;

        display: block;

        background-image: url(../images/products/detail/parts_arrow_right.png);

        background-repeat: no-repeat;

        background-position: center;

        background-size: 6px;

        position: absolute;

        top: 1px;

        left: 0;

    }

    #section_product .desc>ul>li{

        padding-left: 1em;

        text-indent: -1em;

    }

    #section_product .desc>ul>li/*:not(:last-child)*/{

        margin-bottom: 20px;

    }

    /**

     * .color_variations

     */

    #section_product .row .color_variations {

        margin-top: 30px;

        margin-bottom: 30px;

    }

    #section_product .row .color_variations ul {}

    #section_product .row .color_variations li {

        /*display: inline-block;*/

        white-space: nowrap;

        margin-bottom: 10px;

    }

    #section_product .row .color_variations li img {

        display: inline-block;

        width: 30px;

        height: auto;

        margin-right: 12px;

        vertical-align: middle;

        image-rendering: optimizeQuality;

    }

    #section_product .row .color_variations li img.large {

        width: 60px;

    }

    #section_product .row .color_variations li p {

        display: inline-block;

        font-size: 12px;

        vertical-align: middle;

    }

    #section_product .row .color_variations li p span.co_ref {

        font-size: 16px;

        margin-right: 8px;

    }

    #section_product .row .how_to {

        clear: both;

        height: 46px;

        margin: 0 17px 75px 17px;

        line-height: 42px;

        box-sizing: border-box;

        text-align: center;

        border-top: 1px solid #b2b2b2;

        border-bottom: 1px solid #b2b2b2;

        position: relative;

    }

    #section_product .row .how_to .buy {

        padding: 0 0 0 18px;

        font-size: 16px;

        letter-spacing: .05em;

        display: inline-block;

        position: relative;

    }

    #section_product .row .how_to .buy a:hover {

        text-decoration: underline;

    }

    #section_product .row .how_to .buy:before {

        content: '';

        width: 7px;

        height: 100%;

        display: block;

        background-image: url(../images/products/detail/parts_arrow_right.png);

        background-repeat: no-repeat;

        background-position: center;

        background-size: 7px;

        position: absolute;

        top: 1px;

        left: 0;

    }

    #section_product .row .how_to .sns_list {

        width: 100%;

        position: absolute;

        bottom: -68px;

        left: 0;

    }

    #section_product .row .how_to .sns_list ul {

        letter-spacing: -.40em;

    }

    #section_product .row .how_to .sns_list li {

        margin: 0 10px;

        display: inline-block;

        letter-spacing: normal;

        vertical-align: top;

    }

    #section_product .row .how_to .sns_list li img {

        width: 30px;

        height: auto;

        margin: 10px 0 0 0;

        transition: opacity .1s ease;

    }

    #section_product .row .how_to .sns_list li img:hover {

        opacity: .7;

    }



/*

#actirise

*/

    .actirise #section_product .product_img {

      margin-top: 0;

/*      height: auto;*/

    }

  

    .a_cleansing_oil #section_product .product_img {

      min-height: 230px;

      height: auto;

    }

  

    .a_wash #section_product .product_img {

      min-height: 210px;

      height: auto;

    }

  

    .a_lotion #section_product .product_img {

      min-height: 224px;

      height: auto;

    }

  

    .a_lotion_enriched #section_product .product_img {

      min-height: 225px;

      height: auto;

    }

  

    .a_lotion_enriched #section_product .product_img {

      min-height: 225px;

      height: auto;

    }

  

    .a_cream #section_product .product_img {

      min-height: 185px;

      height: auto;

    }

  

    .a_emulsion #section_product .product_img {

      min-height: 207px;

      height: auto;

    }

  

    .a_emulsion_enriched #section_product .product_img {

      min-height: 207px;

      height: auto;

    }



    .a_program #section_product .product_img {

      width: 43%;

      margin: 0 0 0 0;

      min-height: 160px;

      height: auto;

    }

  

    html[lang="zh"] .a_program #section_product .product_img {

      height: 130px;

    }

  

    .a_program #section_product .col_right {

      padding-bottom: 0;

    }

    .actirise #section_product .product_img img {

      width: 100%;

      height: auto;

    }

    .actirise #section_product .row .desc {

      margin-top: 40px;

      margin-bottom: 30px;

    }

    .actirise .caution:before{

      content:"※";

    }

    .actirise .caution{

      display:block;

      text-align: left !important;

      font-size: 12px;

      padding-left:12px;

      text-indent: -12px;

    }

  

  .a_program #section_product .col_right .vol {

    font-size: 14px;

  }



  .a_program #section_product .a_program_list {

    margin-top: 15px;

  }



  .a_program #section_product .a_program_list li {

    margin-bottom: 10px;

  }



  .a_program #section_product .a_program_list li a {

    padding: 0 0 0 10px;

    font-size: 14px;

    position: relative;

    line-height: 1.4;

  }



  .a_program #section_product .a_program_list li a:hover {

    text-decoration: underline;

  }



  .a_program #section_product .a_program_list li a:before {

    content: '';

    width: 6px;

    height: 100%;

    display: block;

    background-image: url(../images/products/detail/parts_arrow_right.png);

    background-repeat: no-repeat;

    background-position: 0 0;

    background-size: 6px;

    position: absolute;

    top: 8px;

    left: 0;

  }



    /* -----------------------------------

        #section_detail

    ----------------------------------- */

    #section_detail {

        clear: both;

        overflow: hidden;

        background-color: #f6f6f6;

    }

    #section_detail .section_detail_01,

    #section_detail .section_detail_02 {

        overflow: hidden;

    }

    #section_detail .section_detail_02 {

        background-color: #fff;

    }

    #section_detail .item_hd {

        padding-bottom: 15px;

        margin: 30px 18px 0 18px;

        border-bottom: 1px solid #010042;

        text-align: center;

    }

    #section_detail .item_hd .category {

        height: 20px;

        padding: 3px 6px;

        margin-bottom: 10px;

        box-sizing: border-box;

        display: inline-block;

        border: 1px solid #010042;

        font-size: 10px;

        letter-spacing: .05em;

        vertical-align: bottom;

    }

    #section_detail .item_hd .item_name {

        font-size: 16px;

        line-height: 1.5;

        box-sizing: border-box;

    }

    /*

        #feature

    */

    #section_detail #feature {

        margin: 0 auto 0 auto;

        overflow: hidden;

    }

    #section_detail #feature h3 {

        margin: 23px 0 20px 0;

        font-size: 16px;

        letter-spacing: .05em;

        text-align: center;

    }

    #section_detail #feature .desc > p {

        margin: 0 20px;

        font-size: 16px;

        line-height: 1.5;

    }

    #section_detail #feature ul {

        padding: 0 18px;

    }

    #section_detail #feature li {

        margin: 0 0 20px 0;

        padding-left: 1em;

        text-indent: -1em;

        font-size: 16px;

        line-height: 1.4em;

        letter-spacing: 0;

    }

    #section_detail #feature li.caution {

        font-size: 12px;

    }

    .clean-lyt .caution:before{

        content:"※";

    }

    .clean-lyt .caution{

        display:block;

        text-align: left !important;

        font-size: 12px;

        padding-left:12px;

        text-indent: -12px;

    }

    #section_detail #feature li.bold {

        font-weight: bold;

        text-indent: 0;

        padding-left: 0;

    }

    .c_treatment #section_detail #feature li {

        margin-bottom: 9px;

    }

    .c_treatment #section_detail #feature li.btm {

        margin-bottom: 20px;

    }

    /*

        #how_to_use

    */

    #section_detail #how_to_use {

        margin: 0 auto 20px auto;

        overflow: hidden;

    }

    #section_detail #how_to_use h3 {

        margin: 23px 0 20px 0;

        font-size: 16px;

        letter-spacing: .05em;

        text-align: center;

    }

    #section_detail #how_to_use ul {

        padding: 0 18px;

    }

    #section_detail #how_to_use li {

        margin: 0 0 20px 0;

        padding-left: 1em;

        text-indent: -1em;

        font-size: 16px;

        line-height: 1.4em;

        letter-spacing: 0;

    }

    #section_detail #how_to_use li.caution {

        font-size: 12px;

    }

    #section_detail #how_to_use li.bold {

        font-weight: bold;

    }

    .c_treatment #section_detail #how_to_use li {

        margin-bottom: 9px;

    }

    .c_treatment #section_detail #how_to_use li.btm {

        margin-bottom: 20px;

    }

    #section_detail #how_to_use .img_use {

        margin: 20px 0 25px 10px;

        /*

        margin: 20px 0 25px -30px;

        text-align: center;

        */

    }

    #section_detail #how_to_use .img_use:not(.default) img {

        width: 260px;

        height: auto;

    }

    #section_detail #how_to_use .img_use_2:not(.default) img {

        width: 30%;

        float: right;

        margin-top: 10px;

    }

    #section_detail #how_to_use .img_use.default {

        margin-left: 0;

        margin-right: 0;

        display: block;

    }

    #section_detail #how_to_use .img_use.default.h-centered {

        text-align: center;

    }

     #section_detail #how_to_use li.spatula_title {

        width: 100%;

        margin: 0 auto;

        text-indent: inherit;

        margin-bottom: 10px;

        text-align: inherit;

        padding-left: 0px;

    }

    #section_detail #how_to_use li.spatula_sub {

        margin: 0 auto;

        margin-bottom: 10px;

        font-size: 12px;

    }

    #section_detail #how_to_use li.spatula_text {

        width: 60%;

        text-align: justify;

    }

    #section_detail #how_to_use li.how_to_use_subttl {

        font-weight: bold;

    }

    /**

     * Concentrate Lotion Kit

     */

    .c_lotion_kit #section_product {

        padding-top: 0;

    }

    .c_lotion_kit #section_product .product_img {

        width: 100%;

        height: auto;

        float: none;

        margin-bottom: 14px;

    }

    .c_lotion_kit #section_product .product_img img {

        width: 100%;

        height: auto;

    }

    .c_lotion_kit #section_product .col_right {

        float: none;

        padding: 0 17px;

        width: inherit;

    }

    .c_lotion_kit #section_product .col_right .vol {

        font-size: 14px;

    }

    .c_lotion_kit #section_product .product_desc .notes {

        font-size: 12px;

        padding-left: 1em;

        padding-right: 1em;

        text-indent: -1em;

        margin-left: 17px;

        margin-right: 17px;

    }

    .c_lotion_kit #section_product br {

        display: block;

    }

    /*

        #plant_component

    */

    #plant_component {

        margin: 0 20px 20px 20px;

        text-align: center;

    }

    #plant_component h3 {

        height: 40px;

        background-color: #01003e;

        line-height: 40px;

        font-size: 16px;

        color: #fff;

        letter-spacing: .05em;

        position: relative;

        cursor: pointer;

    }

    #plant_component h3:before {

        content: '';

        display: block;

        width: 1px;

        height: 13px;

        background-color: #fff;

        position: absolute;

        top: 14px;

        right: 21px;

        transition: all .15s ease;

        -webkit-transition: all .15s ease;

    }

    #plant_component h3:after {

        content: '';

        display: block;

        width: 13px;

        height: 1px;

        background-color: #fff;

        position: absolute;

        top: 20px;

        right: 15px;

        transition: all .15s ease;

        -webkit-transition: all .15s ease;

    }

    .for_ie #plant_component h3.on:before {

        height: 13px !important;

        top: 14px !important;

        right: 21px !important;

    }

    .for_ie #plant_component h3.on:after {

        width: 13px !important;

        top: 20px !important;

        right: 15px !important;

    }

    #plant_component h3:hover:before {

        transform: rotate(90deg);

        -webkit-transform: rotate(90deg);

        -ms-transform: rotate(90deg);

    }

    #plant_component h3:hover:after {

        transform: rotate(90deg);

        -webkit-transform: rotate(90deg);

        -ms-transform: rotate(90deg);

    }

    #plant_component h3.on:before {

        content: '';

        display: block;

        width: 1px;

        height: 17px;

        background-color: #fff;

        position: absolute;

        top: 12px;

        right: 20px;

        transform: rotate(45deg);

        -webkit-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

    }

    #plant_component h3.on:after {

        content: '';

        display: block;

        width: 17px;

        height: 1px;

        background-color: #fff;

        position: absolute;

        top: 20px;

        right: 12px;

        transform: rotate(45deg);

        -webkit-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

    }

    .for_ie #plant_component h3:before {

        width: 15px !important;

        height: 15px !important;

        content: '';

        display: block;

        background-color: transparent !important;

        background-image: url(../images/parts_ico_accordion_pc.png);

        background-size: 15px !important;

        background-repeat: no-repeat;

        background-position: center !important;

        position: absolute;

        top: 12px !important;

        right: 15px !important;

    }

    .for_ie #plant_component h3.on:before {

        background-image: url(../images/parts_ico_accordion_pc_on.png);

        background-size: 13px !important;

        right: 15px !important;

    }

    .for_ie #plant_component h3:after {

        display: none !important;

    }

    #plant_component h4 {

        margin: 15px 0 0 0;

        font-size: 14px;

        font-weight: bold;

    }

    #plant_component .section_inner {

        margin: 0 auto;

        overflow: hidden;

        background-image: url(../images/parts_product_detail_section_bg.png);

    }

    #plant_component ul {

        padding: 20px 0 15px 0;

        letter-spacing: -.40em;

        background-color: #ededed;

        overflow: hidden;

    }

    #plant_component li {

        width: 50%;

        margin: 0 0 15px 0;

        display: inline-block;

        vertical-align: top;

        font-size: 15px;

        line-height: 1.3em;

        letter-spacing: 0;

    }

    #plant_component li.single {

        width: 100%;

    }

    #plant_component li span {

        margin: 5px 0 0 0;

        font-size: 11px;

        line-height: 1.4em;

        display: block;

        white-space: nowrap;

    }

    #plant_component li .img {

        margin: 0 0 2px 0;

    }

    #plant_component li .img img {

        width: 100px;

        height: auto;

    }

    #plant_component .plant_txt{

        line-height: 1.6;

        margin: -12px 0 22px 0;

        background-color: #ededed;

    }

    /*

        #component

    */

    #component {

        clear: both;

        margin: 0 0 40px 0;

        padding: 0 20px;

    }

    #component h3 {

        height: 40px;

        background-color: #01003e;

        line-height: 40px;

        font-size: 16px;

        text-align: center;

        color: #fff;

        letter-spacing: .05em;

        position: relative;

        cursor: pointer;

    }

    #component h3:before {

        content: '';

        display: block;

        width: 1px;

        height: 13px;

        background-color: #fff;

        position: absolute;

        top: 14px;

        right: 21px;

        transition: all .15s ease;

        -webkit-transition: all .15s ease;

    }

    #component h3:after {

        content: '';

        display: block;

        width: 13px;

        height: 1px;

        background-color: #fff;

        position: absolute;

        top: 20px;

        right: 15px;

        transition: all .15s ease;

        -webkit-transition: all .15s ease;

    }

    .for_ie #component h3.on:before {

        height: 13px !important;

        top: 14px !important;

        right: 21px !important;

    }

    .for_ie #component h3.on:after {

        width: 13px !important;

        top: 20px !important;

        right: 15px !important;

    }

    #component h3:hover:before {

        transform: rotate(90deg);

        -webkit-transform: rotate(90deg);

        -ms-transform: rotate(90deg);

    }

    #component h3:hover:after {

        transform: rotate(90deg);

        -webkit-transform: rotate(90deg);

        -ms-transform: rotate(90deg);

    }

    #component h3.on:before {

        content: '';

        display: block;

        width: 1px;

        height: 17px;

        background-color: #fff;

        position: absolute;

        top: 12px;

        right: 20px;

        transform: rotate(45deg);

        -webkit-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

    }

    #component h3.on:after {

        content: '';

        display: block;

        width: 17px;

        height: 1px;

        background-color: #fff;

        position: absolute;

        top: 20px;

        right: 12px;

        transform: rotate(45deg);

        -webkit-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

    }

    .for_ie #component h3:before {

        width: 15px !important;

        height: 15px !important;

        content: '';

        display: block;

        background-color: transparent !important;

        background-image: url(../images/parts_ico_accordion_pc.png);

        background-size: 15px !important;

        background-repeat: no-repeat;

        background-position: center !important;

        position: absolute;

        top: 12px !important;

        right: 15px !important;

    }

    .for_ie #component h3.on:before {

        background-image: url(../images/parts_ico_accordion_pc_on.png);

        background-size: 13px !important;

        right: 15px !important;

    }

    .for_ie #component h3:after {

        display: none !important;

    }

    #component .section_inner {

        margin: 0 auto;

        box-sizing: border-box;

        background-color: #ededed;

        font-size: 12px;

        line-height: 1.666em;

        letter-spacing: 0;

    }

    #component .section_inner p {

        padding: 10px 15px 15px 15px;

    }

    /* -----------------------------------

        #related_list

    ----------------------------------- */

    #related_list {

        padding: 40px 0 0 0;

        text-align: center;

        color: #01003e;

        background-color: #fff;

    }

    #related_list .section_inner {

        overflow-x: scroll;

        overflow-y: hidden;

        -webkit-overflow-scrolling: touch;

    }

    #related_list a {

        color: #01003e;

        transition: opacity .1s ease;

    }

    #related_list a:hover {

        opacity: .7;

    }

    #related_list ul {

        width: 400px;

        padding: 0 5px;

        margin:0 auto;

    }

    #related_list li {

        width: 110px;

        padding: 0px 10px 20px 10px;

        display: inline-block;

        vertical-align: top;

        text-align: left;

        position: relative;

    }

    #related_list h4 {

        margin: 0 0 35px 0;

        font-size: 16px;

        letter-spacing: 0;

        line-height: 1.25em;

    }

    #related_list .img {

        width: 100%;

        text-align: center;

        margin-bottom: 20px;

    }

    #related_list .img img {

        height: auto;

        width: 90%;

    }

    #related_list .name {

        margin: 0 0 0px 0;

        font-size: 16px;

        letter-spacing: -.05em;

        line-height: 1.25em;

    }

    #related_list .category {

        padding: 3px 6px;

        margin: 0 0 5px 0;

        height: 20px;

        display: inline-block;

        box-sizing: border-box;

        border: 1px solid #01003e;

        font-size: 10px;

        letter-spacing: .05em;

    }

    /*

    * Clean Layout for related_list (TEST!!!)

    */

    #related_list li{

        text-align: center;

    }

    /*

    #related_list.clean-lyt {

        padding: 40px 0 20px 0;

        text-align: center;

        color: #01003e;

        background-color: #fff;

        width: 100%;

        overflow: hidden;

    }

    #related_list.clean-lyt .section_inner {

        width: 100%;

        max-width: 400px;

        margin: 0 auto;

        padding: 0;

        -webkit-overflow-scrolling:auto;

    }

    

    #related_list.clean-lyt ul {

        width: 100%;

        padding:0;

        margin:0;

    }

    

    #related_list.clean-lyt li{

        width: 32%;

        padding: 0;

        margin: 0;

        overflow: hidden;

        box-sizing: border-box;

        border: none;

        display: inline-block;

        vertical-align: top;

    }

    

    */

    #related_list .name .h_note {

        font-size: 12px;

        line-height: 1;

    }

    /**

     * Form Reset

     */

    .wrap_checkbox .reset {

        display: block;

        width: 88.75%;

        height: 24px;

        line-height: 24px;

        background: #FFF;

        color: #000125;

        font-size: 85.714285714286%;

        cursor: pointer;

        margin: 0 auto;

        text-align: center;

        margin-top: 10px;

    }

    .no-filter .wrap_checkbox .reset {

        opacity: 0.3;

        margin-top: 10px;

    }

    .wrap_checkbox .reset:before {

        display: inline-block;

        content: '';

        width: 10px;

        height: 10px;

        background-image: url('../images/products/parts_ico_close.png');

        background-repeat: no-repeat;

        background-position: center;

        background-size: contain;

        margin-right: 5px;

    }

    /**

    * Form layout

    */

    .wrap_checkbox {

        width:100%;

        color: #fff;

        border-bottom: 1px solid #4d4e67;

        border-top: 1px solid #4d4e67;

        padding-top: 3px;/*15px;*/

        padding-bottom: 15px;

        margin-bottom: 15px;

    }

    .wrap_checkbox p{

        width: 88.75%;

        margin:auto;

    }

    .wrap_checkbox label {

        display: inline-block;

        width: 49%;/*calc(33.3% - 10px);*/

        /*margin-left: 10px;*/

        white-space: nowrap;

        font-size: 3.5vw;

    }

    .wrap_checkbox input {

        width: 20px;

        height: 20px;

        vertical-align: middle;

    }

    .flex {

        display: flex;

        flex-wrap: wrap;

        margin-bottom: 15px;

        /*margin-left: 8px;*/

    }

    

    .wrap_checkbox .check-all{

        width:100%;

        border-bottom: 1px solid #4d4e67;

        padding:4px 0;

    }

    .wrap_checkbox .flex:not(:first-child) .check-all{

        border-top: 1px solid #4d4e67;

    }

    .wrap_checkbox .flex span:not(.check-all){

        margin-top:10px;

    }

    

    /**

     * Bottom Reset

     */

    #page_product .reset_btm {

        width: 100%;/*88.75%;*/

        border: 1px solid #FFF;

        margin: 0 auto 13px;

        color: #FFF;

        text-align: center;

        padding: 15px 0;

        box-sizing: border-box;

        cursor: pointer;

        z-index: 1000;

        position: relative;

    }

    .no-filter .reset_btm {

        display: none;

    }

    #page_product .reset_btm span {}

    #page_product .reset_btm span:before {

        display: inline-block;

        content: '';

        width: 6px;

        height: 10px;

        background-image: url('../images/products/parts_arrow_left.png');

        background-repeat: no-repeat;

        background-position: center;

        background-size: contain;

        margin-right: 5px;

    }

    /**

     *product layout

     */

    #product_list li.p_t_cleansing_cream .img {

        left: 13px;

    }

    #product_list li.p_c_eyecream .img {

        left: 12px;

    }

    #product_list li.p_f_massage_cream .img {

        left: 11px;

    }

    .pc_only {

        display: none;

    }

    #product_list .sp_only {

        display: block;

    }

}





/* ----- max-width: 640px ----- */