@charset "utf-8";
.mt1{
  margin: 1em auto 0 auto !important; 
}
.mb3{
  margin: 0 auto 3em auto !important; 
}


/* tiktok */
  .tiktok_box{
    position: relative;
    height: 730px;
    max-height: 730px;
    width: 100%;
    overflow: hidden;
    margin-bottom: 40px;
  }
  .tiktok_box iframe{
    position: absolute;
    top:50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: auto;
    height: 730px;
    max-height: 730px;
    display: block;
    visibility: unset;
    overflow: hidden;
  }

  .flex_box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .banner h3.recomend_bn{
    max-width: 1260px;
    margin: 0 auto;
  }
  @media screen and (max-width:500px) {
    .banner h3.recomend_bn a{
      width: 90%;
      margin: 0 auto;
    }
  }

  .recomend_r,.recomend_l{
    width: 100%;
    margin-bottom: 1em;
    }
    @media screen and (max-width:500px) {
      .recomend_r,.recomend_l{
        margin-bottom: 0;
      }
    }
  .recomend_r img,.recomend_l img{
    width:100%;
  }
  @media screen and (min-width:768px) {
    .recomend_r{
        width: 57.53%;
    }
    .recomend_l{
        width: 42.47%;
    }
  }

  /*check_item*/
/*   .check_item{
    width: 80%;
    max-width:20em;
    background-color: #9b8978;
    text-align: center;
    margin: 0 auto 3em auto;
    padding: 1em;
  }
  .check_item a{
    display: block;
    padding: 1em 1.5em;
    color: #fff;
    border: 1px solid #fff;
    font-size: 1.2em;
    line-height: 1.2em;
  }
  .check_item a:after{
    display: inline-block;
    content:'';
    background-image: url(../img/2024/ya_wh.svg);
    width: 1em;
    height: 1em;
    background-position: right 1em center;
    background-size:1em ;
  } */

    .check_item p{
      color: #fff;
    }

    .check_item a{
      text-align: center;
      color: #BB945B;
      background-color: #fff;
      border-radius: 100px;
      width: 21%;
      margin: .5em auto 0;
      display: block;
      font-weight: bold;
      padding: .5em 0;
      font-size: .9em;
    }
    @media screen and (max-width:768px) {
      .check_item a{
        width: 50%;
        margin: 5vw auto 0;
      }
    }


    /*buy_item*/
    .buy_item{
      width: 80%;
      max-width:20em;
      text-align: center;
      margin: 0 auto 3em auto;
      padding: 1em;
    }
    .buy_item a{
      display: block;
      padding: 1em 1.5em;
      color: #fff;
      background-color: #c09d7a;
      border-radius: 50px;
      font-size: 1.2em;
      line-height: 1.2em;
    }
    .buy_item a:after{
      display: inline-block;
      content:'';
      background-image: url(../img/2024/ya_wh.svg);
      width: 1em;
      height: 1em;
      background-position: right 1em center;
      background-size:1em ;
    }

/*=============================
20240822改修
=============================*/
.simple_basic,
.style_3{
  margin: 7em auto 2em;
}
@media screen and (max-width:768px) {
  .simple_basic,
  .style_3{
    margin: 4em auto 2em;
  }
}
.style_3{
  width: 67%;
  position: relative;
}
@media screen and (max-width:768px) {
  .style_3{
    margin-top: 24vw;
    width: 90%;
  }
}
.simple_basic h2,
.style_3 h2{
  text-align: center;
  font-size: 126px;
  font-size: clamp(76px, calc(8.25rem + ((1vw - 7.69px) * 2.6064)), 190px);
  position: relative;
  z-index: 1;
}
@media screen and (max-width:768px) {
  .simple_basic h2,
  .style_3 h2{
    font-size: 13vw;
  }
}

.style_3 h2{
  /* font-size: 80px; */
  font-size: clamp(30px, calc(3.125rem + ((1vw - 7.69px) * 4.344)), 100px);
  text-align: left;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -6px;
}
@media screen and (max-width:768px) {
  .style_3 h2{
    font-size: 9.2vw;
    letter-spacing: -3px;
    text-shadow: 0 0 5px #fff;
  }
}
.simple_basic h2 span,
.style_3 h2 span{
  position: absolute;
  top: -.5em;
  right: 0;
  left: 0;
  margin: auto;
  width: 8%;
}
@media screen and (max-width:768px) {
  .simple_basic h2 span,
  .style_3 h2 span{
    top: -.8em;
    width: 19%;
  }
}
.style_3 h2 span{
  top: -1.7em;
  right: auto;
  width: 16%;
  z-index: -1;
}
@media screen and (max-width:768px) {
  .style_3 h2 span{
    top: -7vw;
    width: 44%;
  }
}
.simple_basic p{
  text-align: center;
  /* font-size: 23px; */
  margin: 1em auto 2em;
  line-height: 1.5;
  letter-spacing: -1px;
  font-size: clamp(10px, calc(0.625rem + ((1vw - 7.69px) * 1.7376)), 30px);
  font-weight: 500;
}
@media screen and (max-width:768px) {
  .simple_basic p{
    margin: 0em auto 2em;
    font-size: 3.5vw;
  }
}
.simple_basic ul.point{
  justify-content: space-between;
  width: 60%;
  margin: 2em auto;
}
@media screen and (max-width:768px) {
  .simple_basic ul.point{
    width: 90%;
  }
}
.simple_basic ul.point li{
  /* font-size: 23px; */
  font-size: clamp(8px, calc(01rem + ((1vw - 7.69px) * 1.3032)), 23px);
  color: #C6B96A;
  font-weight: bold;
  position: relative;
}
@media screen and (max-width:768px) {
  .simple_basic ul.point li{
    font-size: 3vw;
  }
}
.simple_basic ul.point li:after{
  content: url(../img/2024/cheak_img.svg);
  width: 1.1em;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: -13%;
}
.simple_basic .flex.img{
  gap: 2em 1em;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media screen and (max-width:768px) {
  .simple_basic .flex.img{
    gap: 2vw;
  }
}
.simple_basic .flex.img img{
  width: 100%;
}
.simple_basic .flex.img img:nth-child(2){
  width: 39%;
}
.simple_basic .flex.img img:nth-child(3){
  width: 58%;
}
@media screen and (max-width:768px) {
  .simple_basic .flex.img img:nth-child(3){
    width: 58.5%;
  }
}

/*選べる3つのスタイル*/
.style_3 .style_anchor span img{
  width: 2%;
  margin-right: 1%;
}
@media screen and (max-width:768px) {
  .style_3 .style_anchor span img{
    width: 4vw;
    margin-right: 3vw;
  }
}
.style_3 .style_anchor{
  margin: 3em 1em 1em;
}
.style_3 .style_anchor li{
  margin-bottom: 2em;
}
@media screen and (max-width:768px) {
  .style_3 .style_anchor li{
    margin-bottom: 6vw;
  }
}
.style_3 .style_anchor li a{
  /* font-size: 30px; */
  font-size: clamp(16px, calc(1rem + ((1vw - 7.69px) * 2.954)), 50px);
  font-weight: 500;
  vertical-align: super;
}
@media screen and (max-width:768px) {
  .style_3 .style_anchor li a{
    font-size: 6vw;
  }
}
@media screen and (max-width:768px) {
  .style_3 .style_anchor li a span{
    display: inline-flex;
  }
}

.style_3 .style_anchor li a:hover{
  opacity: .6;
}
.style_3 .style_anchor li.sb a{
  color: #1A1A1A;
}
.style_3 .style_anchor li.ns a{
  color: #BD9A7A;
}
.style_3 .style_anchor li.cs a{
  color: #6F5228;
}
.style_3 .style3_img{
  position: absolute;
  top: -2em;
  right: 0;
  width: 53%;
}


/*共通のアイテムリスト*/
.style_item {
  text-align: center;
  padding-top: 2em;
}
@media screen and (max-width:768px) {
  .style_item {
    padding-top: 1em;
  }
}
.style_item .tag{
  gap: 2em;
  margin-bottom: .5em;
}
@media screen and (max-width:768px) {
  .style_item .tag{
    gap: 4vw;
    padding-bottom: .5em;
  }
  .style_item .tag li{
    font-size: 3vw;
  }
}

.style_item h2{
  font-size: 56px;
  font-weight: 650;
  letter-spacing: -1px;
  font-size: clamp(45px, calc(3.25rem + ((1vw - 7.69px) * 4.344)), 80px);
}

@media screen and (max-width:768px) {
  .style_item h2{
    font-size: 11.5vw;
  }
}
.style_item p {
  font-weight: 500;
  margin: 1em 0;
  letter-spacing: -1px;
  font-size: clamp(11px, calc(0.525rem + ((1vw - 7.69px) * 1.7376)), 30px);
}
@media screen and (max-width:768px) {
  .style_item p {
    font-size: 3.5vw;
  }
}
.style_item .l-inner{
  max-width: 1200px;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 3em;
}

.style_item .style_item_list ul.flex{
  flex-wrap: wrap;
  gap: 1em;
  width: 95%;
  margin: 2em auto 0;
  justify-content: flex-start;
  align-items: flex-start;
}
@media screen and (max-width:768px) {
  .style_item .style_item_list ul.flex{
    margin: 1em auto 0;
    gap: 3vw;
  }
}
.style_item .style_item_list ul li{
  width:calc((100% - 1em*3)/4);
}
@media screen and (max-width:768px) {
  .style_item .style_item_list ul li{
    width: calc((100% - 3vw* 2) / 3);
  }
}
.style_item .style_item_list ul li a{
  display: block;
  color: #1A1A1A;
}

.style_item .style_item_list ul li a dl dt img{
  width: 100%;
}
.style_item .style_item_list ul li a dl dd {
  /* font-size: 17px; */
  font-size: clamp(10px, calc(0.625rem + ((1vw - 7.69px) * 1.3032)), 25px);
  line-height: 1.1;
  margin-top: 1em;
}
@media screen and (max-width:768px) {
  .style_item .style_item_list ul li a dl dd {
    font-size: 3.2vw;
  }
}
.style_item .style_item_list ul li a dl dd span{
  display: block;
  font-size: .8em;
}
.style_item .style_item_list ul li a dl dd.online_btn{
  background: #fff;
  width: 70%;
  margin: 1em auto 2em;
  /* font-size: 17px; */
  font-size: clamp(10px, calc(0.625rem + ((1vw - 7.69px) * 1.3032)), 25px);
  padding: 3% 0;
  box-shadow: 0 0 6px #0000001c;
  color: #BB945B;
}
/*=====================
シンプルベーシック
=====================*/
.style_sb{
  /* background-color: #EDEDED; */
 /*  margin-top: 15em; */
  margin-top: 12%;
}
/*=====================
ナチュラルスタイル
=====================*/
.style_ns{
  background-color: #cfbaa3;
  color: #fff;
}
.style_ns .style_item_list ul li a{
  color: #fff;
}
/*=====================
ナチュラルスタイル
=====================*/
.style_cs{
  background-color: #705840;
  color: #fff;
}
.style_cs .style_item_list ul li a{
  color: #fff;
}


/*=====================
SEOスタイル調整
=====================*/
.top_txt_area h1{
  font-size: clamp(25px, calc(1.5625rem + ((1vw - 7.68px) * 0.8681)), 35px);
  font-weight: 600;
  margin: 0% 0 1%;
} 
.top_txt_area h2{
  padding: 0 0 .5%;
}
.furniture .top_txt_area p{
  font-size: clamp(14px, calc(0.875rem + ((1vw - 7.68px) * 0.8681)), 24px);
}
@media screen and (max-width:768px) {
  .top_txt_area h1{
    font-size: 4.5vw;
    margin: 4% 0 0%;
  } 
  .furniture .top_txt_area p{
    font-size: 3.5vw;
  }
}


.banner_area.sogo{
  margin-top: 5%; 
}
.banner_area.sogo .inner{
  padding-bottom: 0;
  margin-bottom: 7%;
}
.banner_area.sogo a{
  background-color: #fff;
  display: block;
  color: #666;
  position: relative;
}
.banner_area.sogo a:after{
  position: absolute;
  content: url(../img/sogo_arrow.svg);
  bottom: .5%;
  right: 1%;
  width: 4%;
  height: 17%;
}
.banner_area.sogo img{
  width:100%;
}
.banner_area.sogo .flex{
  gap: 2%;
  display: flex;
  flex-wrap: wrap;
}
.banner_area.sogo picture,
.banner_area.sogo .txt_block{
  max-width: 50%;
  width: 49%;
}

.banner_area.sogo .txt_block h3{
  margin-bottom: 5%;
  font-size: 1.3em;
  letter-spacing: 1px;
  margin-top: 0;
}

.banner_area.sogo .txt_block h3,
.banner_area.sogo .txt_block p {
  white-space: normal;
  text-align: start;
}
@media screen and (max-width:768px) {
  .banner_area.sogo{
    width: 90%;
    margin: 5% auto 0;
  }
  .banner_area.sogo a:after{
    position: absolute;
    content: url(../img/sogo_arrow.svg);
    bottom: .5%;
    right: 1%;
    width: 9%;
    height: 9%;
  }
  .banner_area.sogo .flex{
    display: block;
  }
  .banner_area.sogo picture,
  .banner_area.sogo .txt_block{
    max-width: 100%;
    width: 100%;
    padding: 4%;
    display: block;
  }

  .banner_area.sogo .txt_block h3,
  .banner_area.sogo .txt_block p {
    text-align: center;
  }
}