@charset "utf-8";

.title { line-height:1.5; }
.title > .en { display:block; font:.9rem / 1.8 "Rubik", sans-serif; letter-spacing:.1em; }
.title > .en:first-letter { color:#c71432; }

.sec-img-txt, .sec-txt-img { position:relative; margin-top:8.7%; margin-bottom:7.7%; padding-top:6%; }
.sec-box { width:50%; padding:6%; background:#fff; }
.sec-title { margin-bottom:1.5em; font-size:1.75em; }
.sec-img { position:absolute; top:0; width:60%; height:100%; z-index:-1; background:no-repeat center / cover; }

.sec-img-txt .sec-box { margin-left:auto; }
.sec-txt-img .sec-img { right:0; }


/* mv ------------- */
#mv { position:relative; z-index: 0; height:100vh; overflow:hidden; }
.mv-txt {
  position:absolute; top:50%; left:14.28%; z-index:1;
  font-size:2.625em; color:#fff;
          transform: translateY(-50%);
  -webkit-transform:translateY(-50%);
  }
  /*.mv-txt::before {
    content:attr(data-label);
    font:1rem / 1 'Rubik', sans-serif; color:#fff;
    display:block; }*/
.mv-scroll {
  position:absolute; bottom:0; left:50%; z-index:1;
  padding-bottom:65px; color:#fff;
          transform: translateX(-50%);
  -webkit-transform:translateX(-50%);
  }
  .mv-scroll::before, .mv-scroll::after {
    content:""; position:absolute; left:50%; margin-left:-1px;
    display:block; width:2px; height:60px; }
  .mv-scroll::before { bottom:0; background:#eae7e4; }
  .mv-scroll::after  { top:37px; background:#c71432; animation:drop 5s ease 0s infinite normal; }
  @keyframes drop {
    0%   { height:0; }
    100% { height:60px; }
    }


.slide { overflow:hidden; }
.slide [class^="slide-"] { position:relative; width:100%; height:100vh; background:no-repeat center / cover; }
.slide .slide-01 { background-image:url(../img/top/mv_slide01.jpg); }
.slide .slide-02 { background-image:url(../img/top/mv_slide02.jpg); }
.slide .slide-03 { background-image:url(../img/top/mv_slide03.jpg); }
.slide .slide-04 { background-image:url(../img/top/mv_slide04.jpg); }
.slide .slide-05 { background-image:url(../img/top/mv_slide05.jpg); }
.slide .slide-06 { background-image:url(../img/top/mv_slide06.jpg); }
.slide .slide-07 { background-image:url(../img/top/mv_slide07.jpg); }

.slide-animation{ animation:fadezoom 8s 0s forwards; }
@keyframes fadezoom {
  0%   { transform: scale(1); }
  100% { transform: scale(1.2); }
  }


.sns {z-index: 10; position: absolute;right: 2.5em;top: 50%;transform: translateY(-50%);}
.sns > li:not(:last-child) { margin-bottom: 20px; }
.sns > li > a { display: block; width: 30px; height: 30px; text-align: center; border-radius: 100%; border: 1px solid #fff; opacity: .7; }
.sns > li > a > img { width: 15px; vertical-align: baseline; }
.sns > li > a:hover { opacity: 1; }


.mv-link { position: absolute; bottom: 30px; left: 0; background: #fff; margin: 0; }
.mv-link a { display: block; padding: 1em 3em 1em 2em; }
.mv-link a span { margin-right: 1em; padding: .2em 1em .3em; background: #c71432; font-size: .75em; color: #fff;}

/* news ------------- */
#news > .inner { max-width:1000px; }
.news-list  { max-height:130px; overflow-y:auto; }
.news-list > li { margin-bottom:1em; line-height:1.6; }
.news-list .date { display:inline-block; width:120px; }

/* news ------------- */
#news_en > .inner { max-width:1000px; margin: auto;}
.news-list  { max-height:130px; overflow-y:auto; }
.news-list > li { margin-bottom:1em; line-height:1.6; }
.news-list .date { display:inline-block; width:120px; }

/* お知らせの下のバナー */
.bnr-box { margin-block:2em 1.5em; }
.bnr-box a{ display:block; }
.bnr-box .bnr + .bnr{ margin-top:1.5em; }

.bnr-box2 { margin-block:2em 1.5em; }
.bnr-box2 a{ display:block; }
.bnr-box2 .bnr + .bnr{ margin-top:1.5em; }

.bnr-box_en { margin-block:2em 1.5em; }
.bnr-box2_en a{ display:block; }
.bnr-box2_en .bnr + .bnr{ margin-top:1.5em; }

/*.bnr_tv { margin-top: 20px; margin-bottom: 90px; }
.bnr_tv a { display: inline-block; }
.bnr_tv img { margin: auto; }*/

/* products ------------- */
#products {padding-block: 4% 6.4%; overflow: hidden;}
#products .title { margin-bottom:1em; font-size:2em; text-align:center; }
.products-bnr > li { width:49%; background-color: #000; }
.products-bnr > li > a { position: relative; display: block; padding: 10px; min-height: 320px; color: #fff; text-decoration: none; background:no-repeat center /cover;}
.products-bnr > li.takamura > a { background-image: url("../img/top/bg_takamura.jpg"); }
.products-bnr > li.bamtera > a { background-image: url("../img/top/bg_bamtera.jpg"); }
.products-bnr > li > a::before { content: ""; position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; border: 1px solid #fff; }

.products-bnr > li .ttlBox { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 80%; }
.products-bnr > li.takamura .ttlBox .logo img { width: 128px; }
.products-bnr > li.bamtera .ttlBox .logo img { width: 195px; }

.products-bnr > li .ttlBox .txt { margin: 0; font-size: 1.125em; letter-spacing: .05em; }
.products-bnr > li .ttlBox .txt > .en { display: block; font-size: .72rem; font:.9rem / 1.8 "Rubik", sans-serif; }

.products-bnr > li > a:hover { opacity: .7; }

.products-list { margin-top:100px; position:relative; }
#products .products-list .title { position:absolute; top:0; left:0; bottom:0; margin-bottom:0; padding-left:5vw; padding-right:3vw; /* z-index:1; */ background:#f6f6f6; }
.products-list .title > .en { display:inline-block; margin-top:2rem; font:.9rem / 1.8 "Rubik", sans-serif; }
.products-items > li {  max-width:300px; width:30vw; }
.products-items > li + li { margin-left:2vw; }
.products-items > li > a { display:block; }
.products-items > li > a:hover { text-decoration:none; }
.products-items .name { margin:.6em 0 .1em; line-height:1.5; }
.products-items .price { margin:0; text-align:right; line-height:1; }

#products .slick-slide img { width: 100%; }
/*#products .slick-list { padding-left: 0!important; }*/

/* concept ------------- */
#concept .sec-img { background-image:url(../img/top/img_concept.jpg); }

/* selected_material ------------- */
.selected_material { margin-bottom: 7.7%; position: relative; }
.selected_material::before { content: ""; position: absolute; z-index: -1; top: 0; right: 0; width: 100%; height: 40%; background-color: #f6f6f6; }
.selected_material .head_ttl_box { padding: 6.4% 0; }
.selected_material .head_ttl_box .title { margin-bottom: 1em; font-size:2em; text-align:center; }

.selected_material .sec-img-txt,
.selected_material .sec-txt-img { margin-top: 0; }

.selected_material .list_box { margin-top: -3em; background: #fff; }
.selected_material .sec-title { margin-bottom: 0; }
.selected_material .sec-more { margin: 0; }

/* works ------------- */
#works { padding:6.4% 0; }
#works .title { margin-bottom: 1em; font-size:2em; text-align:center; }

.order { margin-top:8.7%; }

/*slide設定*/
#works .slider { width: 90%; margin: 0 auto; }

#works .slick-slide figure { position: relative; overflow: hidden; height: 400px; width: 100%;}
#works .slick-slide img { position: absolute;
    left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
    width: 100%; height: auto; object-fit: cover; font-family: 'object-fit: cover;'; }

.work-slide { width: 100%; }
.work-slide .slick-slide { margin: 0 10px; }
.work-slide li { position: relative; }
.work-slide li .ttl { position: absolute; bottom: 0; left: 0; margin: 0; padding:.5em 1em; background: #fff; letter-spacing: .1em; }


#works .slick-dots { margin: 20px 0 0 auto; }
#products .slick-dots { margin: 20px 0 0 3vw; padding-left: 0; }
#works .slick-dots li,#products .slick-dots li { display:inline-block; }
#works .slick-dots li:nth-child(n+2),#products .slick-dots li:nth-child(n+2) { margin-left:15px; }
#works .slick-dots button,#products .slick-dots button { position:relative; text-indent:-9999px; background-color:#d8d8d8; padding:0; width:18px; height:3px; }
#works .slick-active button,#products .slick-active button { background-color:#807f79; }

/*.slide-dots { bottom:0; }
.slide-dots li { margin:0 2px; }
.slide-dots li button::before { content:""; right:0; bottom:0; width:15px; height:3px; margin:auto; background:#2f3681; -webkit-transition:all .3s; transition:all .3s; }*/

/* bamboo ------------- */
#bamboo .sec-img { background-image:url(../img/top/img_bamboo.jpg); }
#old_material .sec-img { background-image: url(../img/top/img_old_material.jpg); }
#old_material.material { margin-top: 8%; }

#news.grove { margin-top: -3%; }

/* media ------------- */
#news.media { margin-top: 8%; }

/* insta ------------- */
.insta { margin-top: 8%; margin-bottom: 8% ; }
.insta_list li { width:24%; margin-bottom:1.25%; }
.insta_list li a { overflow: hidden; position:relative; display:block; padding-top:100%; background-color:#eee; display:block; }
.insta_list li img { position:absolute; top:50%; left:50%; width:100%; height: 100%; object-fit: cover; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); transition:all .5s; -webkit-transition:all .5s; }
.insta_list li a:hover img { opacity:.6; }

/* expo2025 */
.expo2025 {text-align: center; margin: auto 0 19px;}
.expo2025 img { width:50% }




/* ================================================================
  レスポンシブ
=================================================================== */
/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {

  /* お知らせの下のバナー */
  .bnr-box { margin-block: 120px 40px;}
  .bnr-box img{ width: 75%;}
  .bnr-box .bnr + .bnr{ margin-top:2.5em; }

  .bnr-box2 { margin-block: 120px -80px;}
  .bnr-box2 img{ width: 75%;}
  .bnr-box2 .bnr + .bnr{ margin-top:2.5em; }

  .bnr-box_en { margin-block: 60px 55px; }
  .bnr-box_en img{ width: 75%;}
  .bnr-box_en .bnr + .bnr{ margin-top:2.5em; }

  /* products ------------- */
  #products .slick-slide { margin-left: 30px; }
  .products-bnr > li .ttlBox .logo { float: left; margin-right: 50px; }
  .products-bnr > li.takamura .ttlBox .txt { margin-top: 45px; }
  .work-slide .slick-slide { margin: 0 15px; }
  .work-slide li .ttl {  font-size: 1.125em;  }
  .products-items .name { font-size: 1.125em;}


  /* selected_material ------------- */
  .list_box > li { display: flex; display: -webkit-flex; flex-wrap: wrap; }
  .list_box > li + li { margin-top: 5em; }
  .list_box > li figure { width: 45%; }
  .list_box > li .lead { display: flex; flex-direction: column; justify-content: center; flex: 1; -webkit-box-flex: 1; }
  .list_box > li:nth-child(odd) .lead { margin-left: 5%; padding-right: 5%; }
  .list_box > li:nth-child(even) .lead { margin-right: 5%; padding-left: 5%; }
  .list_box > li:nth-child(even) figure { order: 1; }

}

/* 960px以上(PC) */
@media screen and (min-width: 960px) {
  .gmenu > li:first-child { display:none; }

  /* news ------------- */
  #news { padding:80px 0 90px; position:relative; }
  .news-title { width:26.5%; font-size:2em; }
  .news-list  { width:73.5%; }
  .news-more  { position:absolute; top:100px; left:0; }

  .products-box ul { padding-left: 10%; margin-right: -10%;}
}

/* 1200px以上 */
@media screen and (min-width: 1200px) {
  #works .slick-dots { max-width: 1200px; margin: 50px 0 0 auto; }
}


/* ================================================================
  タブレット
=================================================================== */
/* 1024以下 (タブレット横以下) */
@media screen and (max-width: 1024px) {

}

/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {

  .sec-img-txt, .sec-txt-img { margin-bottom:0; }
  .sec-box { width:60%; }
  .sec-img { width:70%; }

  /* mv ------------- */
  .mv-scroll { left: auto; right: 2.5em; padding-bottom: 80px; transform:none;}
  .mv-scroll::after  { top:35px; }

  /* news ------------- */
  #news { padding:1.5em 0 3em; }
  .news-title { padding:1rem 0; font-size:2em; }
  .news-title::after { margin-left:1em; }
  .news-list  { width:100%; }
  .news-more  { display:inline-block; margin:2em 0 0 auto; }

  .grove-more { display:inline-block; margin:2em 0 0 auto; }


   #news_en { padding:0 0 0.5em; }
  .news-title { padding:1rem 0; font-size:2em; }
  .news-title::after { margin-left:1em; }
  .news-list  { width:100%; }
  .news-more  { display:inline-block; margin:2em 0 0 auto; }

  /* products ------------- */
  #products { padding:4em 0; }
  .products-list .title { left:2rem; }
  .products-box ul { padding-left: 18%; margin-right: -18%;}
  /*.products-box { padding-left:8rem; }*/
  #works .slick-slide figure { height: 300px; }
  
  
  .selected_material .sec-img-txt,
  .selected_material .sec-txt-img { margin-bottom: 7.7%; }

}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){

  .sec-box { width:100%; padding-top:0; }
  .sec-img { width:100%; padding-top:65%; position:static; }

  /* mv ------------- */
  .mv-txt{
    font-size:1.85em; top: 49%; left:50%; letter-spacing:.08em; white-space:nowrap;
    transform: translate(-50%,-50%);
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    }
  .mv-scroll::after  { top:33px; }
  .mv-link { bottom: 20px; }
  .mv-link a { padding: .8em 1.1em .8em 1em; line-height: 1.8; }

  /* news ------------- */
  .news-list .date { display:block; }
  
  
  /*.bnr_tv { margin-top: 10px; margin-bottom: 55px; }*/

  /* products ------------- */
  #products { padding: 1em 0 4em; }
  .products-bnr > li { width:100%; }
  .products-bnr > li + li { margin-top:1em; }
  .products-bnr > li > a { min-height: 200px; padding: 5px; }
  .products-bnr > li > a::before { top:5px; right: 5px; bottom: 5px; left: 5px; }
  .products-bnr > li .ttlBox { text-align: center; }
  .products-bnr > li.takamura .ttlBox .logo img {  width:78px; }
  .products-bnr > li.bamtera .ttlBox .logo img { width: 135px; }
  .products-bnr > li .ttlBox .txt { line-height: 1.2; margin-top: 1em; }
  #works .slick-dots { text-align: center; }
  /*   #products .slick-dots {margin-left: 20%; } */
 /* .products-box ul {  padding-left: 0; margin-right: 0; }*/
  #products .slick-slide { margin-right: 10px; }

  #works .slick-slide figure { height: 200px; }

  .products-list { margin-top:50px; }
  #products .products-list .title { font-size:1.5em; padding-left:6vw; padding-right:5vw; }
  .products-list .title > .en {margin-top:1rem; }
  /*.products-box { padding-left:6rem; }*/
  
  /* selected_material ------------- */
  .selected_material { margin-bottom: 15.4%; }
  .selected_material .head_ttl_box { padding: 13% 0 0; }
   
  .selected_material .sec-img-txt .inner,
  .selected_material .sec-txt-img .inner { margin: 0; }
  .selected_material .sec-img-txt .sec-box,
  .selected_material .sec-txt-img .sec-box { padding-top: 6%; }
  
  .list_box > li + li { margin-top: 10%; }
  .list_box > li .lead { margin-top: 5%; }

  /* works ------------- */
  #works { padding: 13% 0; }
  
  .order { margin-top: 12%; }
  
  /* media ------------- */
  #news.media { margin-top: 12%; }
  
  /* insta ------------- */
  .insta { margin-top: 13%; margin-bottom: 12% ; }
  .insta_list li { width:49%; }
  .insta_list li:last-child,.insta_list li:nth-last-child(2) { display:none; }



}