@charset "utf-8";

.cdpb_only ul li {
    list-style: none;
}
.cdpb_only a {
    color: #000;
    text-decoration: none;
}
.cdpb_only img {
    width: 100%;
}
p.cdpb_only_p {
    /*padding-left: 3%;*/
    color: #333;
    margin-bottom: 5%;
}
.cdpb_only {
    color: #000;
}
.cdpb_only 
.main_img_area, .brand_pr_area, .ctgr_list_area, .na_con, .bp_sp_area, .cl_area_sp {
    margin: 3% 0 10%;
}
div.cdpb_only .main_img_area {
    margin-bottom: 7%;
}
.brand_pr_area {
    margin: 0 0 7%;
}
.ctgr_list_area {
    margin: 0 0 10%;
}
.main_img_area ul {
    padding: 0;
}
.slider_area_sp {
    display: none;
}
.breadcrumbs span {
    color: #000;
}


/*　メイン画像エリア　*/
.main_img_sp {
    display: none;
}

/* ストーリーページ入口 */
div.brand_pr_area button.bpr_btn {
    width: 23%;
    position: relative;
    top: 29em;
    left: 14%;
}
.bp_sp_area {
    display: none;
}

/* ロゴ・メニューリスト */
ul.imenu_list {
    margin: 0;
}
/*ul.imenu_list li a:hover,
.imenu_list span:hover {
    border-bottom: solid #000 2px;
}*/
nav.globalnav-wrap {
    border-top: solid 2px #000;
    border-bottom: solid 2px #000;
    height: 66px;
}
.imenu_nav ul.imenu_list {
    cursor: pointer;
    padding-top: 1px;
}
.bh_logo_area {
    margin: 0 auto 3%;
    width: 10%;
}
.imenu_nav .imenu_list li a, .imenu_list span {
    display: block;
    margin: 0;
    padding: 7% 16px;
    height: auto;
    color: #000;
    font-size: 1em;
    font-weight: 550;
    line-height: 20px;
    text-decoration: none;
    text-align: left;
    background: #fff;
}
.cdpb_logo_sp {
    display: none;
}
li.has-child:hover .mir-arrow {
    transform: rotate(90deg);
}
.globalnav-wrap ul.imenu_list li.imlist_title:hover {
    border-bottom: solid 3.5px #000;
}

/* メニューリスト */
ul.imenu_list {
    display: flex;
    padding: 0;
    justify-content: center;
}
/*ul.imenu_list li {
    padding: 0 3%;
}*/
nav.globalnav-wrap a {
    font-size: 1.6rem;
}

nav.globalnav-wrap li::marker {
    display: none;
}

/* 以下カテゴリメニューについての記述 */
/*2階層目以降は横並びにしない*/
nav.globalnav-wrap ul ul {
    display: block;
}
/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
nav.globalnav-wrap ul li{
    position: relative;
    display: inline-block;
    width: 100%;
}

/*ナビゲーションのリンク設定*/
nav.globalnav-wrap ul li a{
  display: block;
  text-decoration: none;
  color: #999;
  padding:20px 35px;
  transition:all .3s;
}

nav.globalnav-wrap ul li li a{
  padding:10px 35px;
}

/*nav.globalnav-wrap ul li a:hover{
  color:#fff; 
}*/

/*==矢印の設定*/

span.material-icons-round {
    display: inline;
    vertical-align: bottom;
    padding: 0;
}
nav.globalnav-wrap ul li span.material-icons-round {
    background: rgba(0,0,0,0);
}
li.has-child a.pull_down_arrow span {
    background: rgba(0,0,0,0);
    padding: 0;
}
span.pull_down_arrow {
    justify-content: space-between;
    display: flex;
}
a.pull_down_arrow span {
    background: rgba(0,0,0,0);
    padding: 0;
    display: flex;
    justify-content: space-between;
}

/*2階層目を持つliの矢印の設定*/
/*nav.globalnav-wrap ul li.has-child::before{
  content:'';
  position: absolute;
  left:15px;
  top:25px;
  width:6px;
  height:6px;
  border-top: 2px solid #999;
    border-right:2px solid #999;
    transform: rotate(135deg);
}*/

/*3階層目を持つliの矢印の設定*/
/*nav.globalnav-wrap ul ul li.has-child::before{
  content:'';
  position: absolute;
  left:6px;
  top:17px;
  width:6px;
  height:6px;
    border-top: 2px solid #fff;
    border-right:2px solid #fff;
    transform: rotate(45deg);
}*/

/*== 2・3階層目の共通設定 */

/*下の階層を持っているulの指定*/
nav.globalnav-wrap li.has-child ul{
    padding: 0;
    /*絶対配置で位置を指定*/
      position: absolute;
      left:0;
      top:64px;
      z-index: 4;
    /*形状を指定*/
      background:#f2f2f2;
      width:100%;
    /*はじめは非表示*/
      visibility: hidden;
      opacity: 0;
    /*アニメーション設定*/
      transition: all .3s;
}

/*hoverしたら表示*/
nav.globalnav-wrap li.has-child:hover > ul,
nav.globalnav-wrap li.has-child ul li:hover > ul,
nav.globalnav-wrap li.has-child:active > ul,
nav.globalnav-wrap li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
nav.globalnav-wrap li.has-child ul li a{
  color: #000;
  border-bottom:solid 1px rgba(255,255,255,0.6);
}

nav.globalnav-wrap li.has-child ul ul li a {
    background: #eee;
}

/*nav.globalnav-wrap li.has-child ul li:last-child a{
  border-bottom:none;
}*/

nav.globalnav-wrap li.has-child ul li a:hover,
nav.globalnav-wrap li.has-child ul li a:active{
  background:#eee;
}


/*==3階層目*/

/*3階層目の位置*/
nav.globalnav-wrap li.has-child ul ul{
  top:0;
  left:287px;
  background:#f2f2f2;
}

/*nav.globalnav-wrap li.has-child ul ul li a:hover,
nav.globalnav-wrap li.has-child ul ul li a:active{
  background:#f2f2f2;
}*/

/*スマホ版メニューカテゴリ*/
.wrap {
  max-width: 1020px;
  margin: 0 auto;
  padding: 0 20px;
}

.toggle_title {
  position: relative;
  padding: 20px;
  border-bottom: 1px solid #000;
  cursor: pointer; 
}

.toggle_title:hover {
  opacity: 0.7;
  transition: 0.5s;
}

.toggle_ans {
  margin: 0;
  padding: 20px;
  display: none;
}

/*プラス*/
.plus {
  position: absolute;
  right: 20px;
  top: 0;
  height: 100%;
  border-radius: 0px 10px 10px 0px;
}

.plus:before,
.plus:after {
  display: block;
  content: "";
  background-color: #6b3906;
  position: absolute;
  width: 15px;
  height: 1px;
  bottom: 50%;
  right: 50%;
  transform: translate(50%, 50%);
  transition: 0.5s;
}

.plus:before {
  width: 1px;
  height: 15px;
}

/*アコーディオンが開いたらプラスをマイナスにする*/
.toggle_title.selected .plus:before {
  transform: translate(50%, 50%) rotate(90deg);
}





/* 商品リンク */
.ctgr_list_area {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.sc_con, .mu_con, .brandlist_con, .tc_con {
    width: 48%
}
button.btn_detail, button.bpr_btn {
    background-color: #000;
    width: 100%;
    padding: 16px 0 16px 0;
    letter-spacing: 0.2em;
}
a.click_btn {
    color: #FFFFFF;
}
div.sc_con button.btn_detail, div.mu_con button.btn_detail {
    width: 45%;
    position: relative;
    top: 70%;
    left: 8%;
}
div.brandlist_con, div.tc_con {
    margin-top: 3%;
}
.cl_area_sp {
    display: none;
}


/* NEWARRIVAL */
.na_con li {
    list-style: none;
}
.cdpb_only span.nat_en {
    font-family: 'Montserrat', 'Yu Gothic Medium', '\6E38\30B4\30B7\30C3\30AF Medium', YuGothic, '\6E38\30B4\30B7\30C3\30AF\4F53', '\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3', '\30E1\30A4\30EA\30AA', sans-serif;
    font-weight: 200;
    font-size: 3rem;
}
.na_title {
    margin-bottom: 3%;
}
.nat_ja {
    font-weight: bold;
    font-size: 1em;
    margin-left: 1.3%;
}
/*.item_img {
    width: 18em;
    height: 23em;
    object-fit: cover;
}*/
.na_area ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.na_area ul::after {
    content: "";
    display:block;
    width:23%;
}
.na_area li {
    width: 23%;
}
.na_area li:nth-child(n):nth-child(-n+3) {
    margin-right: 2%;
}
div.naitem_price p {
    font-weight: bold;
}
div.item_detail p {
    margin: 3% 0;
}


/* CLOSE UP */
.cu_area {
    display: flex;
    margin-bottom: 7%;
}
.cu_img_con {
    margin-right: 3%;
}
.cu_text_con {
    width: 90%;
}
.cu_article h1 {
    font-weight: 400;
    line-height: inherit;
}
.cu_text {
    margin: 3% 0;
    line-height: 2.3rem;
    font-size: 1.4rem;
    letter-spacing: 0.03rem;
}
.cu_article, .item_np {
    color: #000;
}
div.btn_detail button.cua_btn {
    width: 55%;
}
.cu_detail_btn {
    text-align: center;
    margin: 6% 0 0;
}
.item_np p, .item_note p {
    letter-spacing: 0.03rem;
}
.item_note p {
    color: #999;
}
.item_note {
    margin-top: 6%;
}


/*-------------------------
ここからストーリーページ記述
-------------------------*/
.cdpb_story_area img {
    width: 100%;
}
.cdpb_st_mainv, .cdpb_intro {
    margin: 3% 0 7%;
}
.cdpb_story_area a {
    color: #000;
}
.cdpb_story_area li {
    list-style: none;
}
.cdpb_story_area a {
    text-decoration: none;
}
    /* 商品が4点以上になったら以下は削除/ここから */
    .product_pr_con ul::after {
        display: none;
    }
    /* ここまで */
button.ttopb_detail {
    color: #fff;
    width: 30%;
}
div.ttop_btn {
    text-align: center;
    margin: 6% 0 3%;
}
.prdt_title, .cdpbis_title, .hrtg_txt h2 {
    font-size: 1.8em;
    text-align: center;
}
.cdpb_prdt_title {
    margin: 0;
}
.cdpbi_slider,.about_hrtg, .cdpb_product_area {
    margin: 9% 0;
}
.cdpb_product_area {
    margin-bottom: 0;
}
.about_hrtg {
    display: flex;
}
.u-pc-hide {
    display: none;
}
.hrtg_txt {
    margin: auto;
}
.hrtg_txt p {
    line-height: 2;
    text-align: center;
    margin-top: 10%;
    font-size: 1.4rem;
}
.hrtg_txt h2 {
    font-weight: 400;
}
/*メインビジュアルエリア*/
.cs_main01_sp {
    display: none;
}
/*ブランド紹介*/
.cdpb_intro_img_sp {
    display: none;
}
.hrtg_img_sp {
    display: none;
}


/*slider*/
.slick-arrow {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  padding: 0;
  width: 20px;
  height: 38px;
  color: transparent;
  z-index: 1;
  transition: opacity 0.5s;
  z-index: 1;
}
.slick-arrow:hover {
  opacity: 0.7;
}
img.slick-arrow.prev-arrow, img.slick-arrow.next-arrow {
    max-width: 4%;
    opacity: 0.4;
    cursor: pointer;
}
img.slick-arrow.prev-arrow {
    top: 360px;
    left: 313px;
}
img.slick-arrow.next-arrow {
    top: 360px;
    right: 313px;
}


p.cdpb_sli_text_title {
    font-size: 2rem;
    text-align: center;
    margin-top: 5%;
}
p.txt.cdpb_sli_text, p.cdpb_sli_annotation {
    width: 70%;
    margin: 5% auto 0;
}
#double-slider {
    max-width: 90%;
    margin: 0 auto;
}
div#text-slider-container {
    max-width: 60%;
    margin: 0 auto;
}
.slick-slide:not(.slick-current) {
  opacity: .5;
}
.btn_detail.story_btn {
    text-align: center;
    margin-top: 5%;
}
.btn_detail.story_btn button {
    margin-left: 3%;
}




/* 以下レスポンシブ */
@media screen and (max-width:768px) {
    .cdpb_only .main_img_area, .brand_pr_area, .ctgr_list_area, .na_con, .bp_sp_area, .cl_area_sp {
        margin: 17% 0;
    }
    .breadcrumbs, .brand_head, .brand_pr_area, .ctgr_list_area, .na_con, .rcmd_con, .cu_con {
        width: 90%;
        margin: 20% auto;
    }
    .brand_head {
        margin: 0;
        width: 100%;
    }
    .na_title {
        display: grid;
    }
    .nat_ja, .cl_area_sp_ja {
        font-size: 1.5rem;
        font-weight: 400;
    }
    .cl_area_sp ul, .na_con ul, .rcmd_area ul {
        padding: 0;
    }
    p.cdpb_only_p {
        padding-left: 3%;
    }
    .cdpb_only .breadcrumbs, .cdpb_story_area .breadcrumbs {
        display: block;
        margin: 0 auto 5%;
        font-size: 1.2rem;
    }
        
    /* ロゴエリア */
    .bh_logo_area {
        margin: 0 auto;
        width: 50%;
    }
    .cdpb_logo {
        display: none;
    }
    .cdpb_logo_sp {
        display: block;
    }
    div.cdpb_only .main_img_area {
        margin-top: 0;
    }
    
    /* PC表示メニューリストの非表示 */
    header.imenu_nav {
        display: none;
    }
    
    /* スライダー */
    .slider_area {
        display: none;
    }
    .slider_area_sp {
        display: none;
        /*スライド画像がもらえた時表示*/
        /*display: block;
        margin: 0 auto 20%;*/
    }
    
    /* SP版メインエリア */
    .main_img_sp {
        display: block;
    }
    .mis_01 {
        text-align: center;
    }
    button.misa_btn {
        background-color: #fff;
        width: 63%;
        padding: 16px 0 16px 0;
        color: #000;
        border: 2px solid #000;
        font-size: 1.5rem;
    }
    p.mis_name {
        font-size: 1.8rem;
        font-weight: bold;
        margin: 5% 0;    
    }
    
    /* カテゴリ商品リンクの非表示 */
    .ctgr_list_area {
        display: none;
    }
    
    /* ブランドストーリー */
    .bp_pc_area {
        display: none;
    }
    .bp_sp_area {
        display: block;
    }
    div.bp_sp_area button.bpr_btn_sp {
        width: 63%;
        position: relative;
        left: 19%;
        top: 0;
    }
    
    /* スマホ版カテゴリメニューの表示 */ 
    .cl_area_sp {
        display: block;
    }
    ul.imenu_list{
        display: block;
    }
    ul.imenu_list li span {
        background-color: #000;
        color: #fff;
    }
    /*ul.imenu_list li span:nth-child(n):nth-child(-n+3) {
        border-bottom: solid #fff 1px;
    }*/
    span.imenu_tc a, span.imenu_cdpb_st a {
        color: #fff;
    }
    .cl_area_sp ul li {
        list-style: none;
    }
    li.sp_ctgr_menu ul {
        display: none;
        background: #f2f2f2;
    }
    li.sp_ctgr_menu ul li.has-child ul {
        display: none;
    }
    .has-child-ul {
        display: flex;
        flex-wrap: wrap;
        border: solid 1px #f2f2f2;
    }
    .has-child-ul li {
        width: 50%;
    }
    ul.imenu_list li span.o-c_btn {
        color: #000;
        background: #f2f2f2;
        font-weight: normal;
        padding: 7% 16px;
    }
    ul.imenu_list li ul li.cl_a_sp_li {
        padding: 7% 16px;
    }
    .has-child-ul li {
        padding: 6% 2% 6% 4%;
        background: #fff;
        border-bottom: solid 1px #f2f2f2;
    }
    .has-child-ul li:nth-child(odd) {
        border-right: solid 1px #f2f2f2;
    }
    .sp_ctgr_menu ul li a {
        display: block;
        width: 100%;
        height: 100%;
    }
    span.imenu_tc, span.imenu_cdpb_st {
        display: flex;
        justify-content: space-between;
    }
    li.cl_a_sp_li span.material-icons-round, .has-child-ul span.material-icons-round {
        background: none;
        color: #000;
    }
    .sp_ctgr_menu ul li a {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .sp_ctgr_menu {
        border-bottom: solid 1px #fff;
    }
    .cl_a_sp_li, .has-child {
        border-bottom: solid 1px #e2e2e2;
    }
    span.cclick_btn {
        padding: 0;
    }
    /*開閉ボタン*/
    span.cclick_btn::before,span.cclick_btn::after {
        content: '';
        display: block;
        width: 15px;
        height: 1px;
        background: #fff;
        transform: translateY(-50%);
        position: absolute;
        top: 50%;
        right: 5%;
    }
    .has-child span.cclick_btn_w::before,span.cclick_btn_w::after {
        content: '';
        display: block;
        width: 15px;
        height: 1px;
        background: #000;
        transform: translateY(-50%);
        position: absolute;
        top: 50%;
        right: 5%;
    }
    span.cclick_btn::after, span.cclick_btn_w::after {
        transform: translateY(-50%) rotate(90deg);
        transition: 0.5s;
    }
    #mobilemenu .active span.cclick_btn::after,
    li.has-child.active span.cclick_btn_w::after{
        transform: rotate(180deg);
        transition: .5s;
    }
    span.cclick_btn, span.cclick_btn_w {
        display: block;
        position: relative;
        background: transparent;
    }
    li.sp_ctgr_menu span.ccb_title {
        padding: 7% 16px;
    }
    span.cclick_btn_w::before, span.cclick_btn_w::after {
        background: #000;
    }
    #mobilemenu .active_w span.cclick_btn_w::after {
        transform: rotate(180deg);
        transition: 0.5s;
    }

    
    
    /* NEWARRIVAL */
    .na_area li {
        width: 45%;
    }
    .na_area li:nth-child(n):nth-child(-n+3) {
        margin: 0;
    }
    /* CLOSEUP */
    .cu_area {
        display: block;
    }
    .cu_img_con {
        margin-right: 0%;
    }
    .cu_text_con {
        width: 100%;
    }
    .cu_article h1 {
        font-size: 1.6em;
    }
    .cu_area {
        margin-bottom: 15%;
    }
    
    /*-------------------------
    ここからストーリーページ記述
    -------------------------*/
    .cs_main01 {
        display: none;
    }
    .cs_main01_sp {
        display: block;
    }
    .cdpbi_slider, .about_hrtg, .cdpb_product_area {
        margin: 20% 0;
    }
    /*ブランド紹介*/
    .cdpb_intro_img {
        display: none;
    }
    .cdpb_intro_img_sp {
        display: block;
    }
    .prdt_title, .cdpbis_title, .hrtg_txt h2 {
        font-size: 2rem;
    }
    /*slider*/
    #double-slider {
        max-width: 100%;
    }
    p.cdpb_sli_text_title {
        font-size: 1.5rem;
    }
    img.slick-arrow.prev-arrow, img.slick-arrow.next-arrow {
        max-width: 9%;
    }
    img.slick-arrow.next-arrow {
        top: 215px;
        right: 5%;
    }
    img.slick-arrow.prev-arrow {
        top: 215px;
        left: 5%;
    }
    div#text-slider-container {
        width: 85%;
        margin: 0 auto;
    }
    p.txt.cdpb_sli_text, p.cdpb_sli_annotation {
        width: 100%;
        margin: 8% 0;
        line-height: 2.3rem;
    }
    .btn_detail.story_btn button {
        margin-top: 6%;
    }
    /*heritage*/
    .about_hrtg {
        display: block;
    }
    .hrtg_img_pc {
        display: none;
    }
    .hrtg_img_sp {
        display: block;
    }
    .u-pc-hide {
        display: block;
    }
    .hrtg_txt p {
        margin-top: 7%;
    }
    .hrtg_txt h2 {
        margin-top: 7%;
    }
    .cdpb_product_area {
        width: 88%;
        margin: 0 auto;
    }
    .cdpb_product_area ul {
        padding: 0;
    }
    button.ttopb_detail {
        width: 90%;
    }
    .cdpb_product_area div.ttop_btn {
        display: none;
    }
    h1.cdpbis_title {
        margin-bottom: 6%;
    }
    /*category*/
    .cl_area_sp_en, .cl_area_sp_ja {
        font-family: 'Montserrat', 'Yu Gothic Medium', '\6E38\30B4\30B7\30C3\30AF Medium', YuGothic, '\6E38\30B4\30B7\30C3\30AF\4F53', '\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3', '\30E1\30A4\30EA\30AA', sans-serif;
    }
    .cl_area_sp_en {
        font-size: 3rem;
        font-weight: 200;
    }
    /*.cl_area_sp_ja {
        font-size: 1rem;
    }*/
    .cl_area_sp .rcmd_titke.na_title {
        margin-left: 5%;
    }
}