@charset "utf-8";

/* .slick */
.slick{
  width:min(100%,1320px);
  margin:auto;
}


/* .breadcrumbs */
@media screen and (max-width:768px){
  .breadcrumbs{
    width:90%;
  }
}

/* #top */
#top{
  max-width:860px;
  margin-top:min(5%,50px);
  display: -webkit-flex;
  display: flex;
}
#top h1{
  width:9.5em;
  line-height:1.5;
  font-size:min(3vw,30px);
  text-align:left;
  white-space:nowrap;
}
#top h1 .en{
  display:block;
  color:#3a4e69;
  letter-spacing:0.1em;
}
#top h1 .en.small{
  font-size:min(2.4vw,24px);
}
#top h1 .en span{
  display:block;
}
#top h1 .jp{
  display:block;
  margin-top:5%;
  font-size:min(2.6vw,26px);
}
#top p{
  padding-top:0.5em;
  flex:1;
  line-height:2;
  text-align:left;
}

@media screen and (max-width:768px){
  #top{
    margin-top:5%;
    display: block;
  }
  #top h1{
    width:auto;
    line-height:1.5;
    font-size:5vw;
    text-align:center;
  }
  #top h1 .en{
    letter-spacing:0.1em;
    text-indent:0.1em;
  }
  #top h1 .en.small{
    font-size:4.5vw;
  }
  #top h1 .en span{
    display:inline;
    margin-right:0.3em;
  }
  #top h1 .jp{
    margin-top:3%;
    font-size:4.6vw;
  }
  #top p{
    margin-top:5%;
  }
}


/* #coupon */
#coupon{
  padding-bottom:0;
}
#coupon .coupon_list{
  max-width:1024px;
  margin-top:min(1%,10px);
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
#coupon .coupon_list li{
  width:min(49%,500px);
  margin-top:min(3%,30px);
}

@media screen and (max-width:768px){
  #coupon .coupon_list{
    width:80%;
    margin-top:3%;
    display: block;
  }
  #coupon .coupon_list li{
    width:auto;
    margin-top:7%;
  }
}

/* #salon_info */
#salon_info{
  padding-bottom:0;
}
#salon_info .cont_wrapper{
  max-width:960px;
  margin-top:min(5%,50px);
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#salon_info .cont_wrapper section h3{
  line-height:1.5;
  font-size:min(2vw,20px);
  text-align:left;
  letter-spacing:0.1em;
}
#salon_info .cont_wrapper section .sns{
  margin-top:5%;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
}
#salon_info .cont_wrapper section .sns li{
  width:1.8em;
  margin:0 1em;
}
#salon_info .cont_wrapper dl{
  width:min(62%,600px);
  line-height:1.7;
  text-align:left;
  letter-spacing:0.1em;
}
#salon_info .cont_wrapper dl dt{
  float:left;
}
#salon_info .cont_wrapper dl dd{
  padding-left:8em;
}
#salon_info .cont_wrapper dl dd span{
  display:inline-block;
  margin-right:2em;
}
#salon_info .cont_wrapper dl dd span:last-of-type{
  margin-right:0;
}
#salon_info .reserve_wrapper{
  max-width:820px;
  margin-top:min(9%,90px);
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#salon_info .reserve_wrapper li{
  width:min(47%,384px);
}
#salon_info .reserve_wrapper li a{
  display:block;
  aspect-ratio:192 / 42;
  border:2px solid #889199;
  font-weight:500;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
}
#salon_info .reserve_wrapper li .btn_reserve{
  padding-right:1.5em;
  font-size:min(2vw,20px);
  letter-spacing:0.1em;
}
#salon_info .reserve_wrapper li .btn_reserve img{
  width:2em;
  margin-right:1.5em;
}
#salon_info .reserve_wrapper li .btn_tel{
  padding-right:1.2em;
  font-size:min(2.3vw,23px);
  letter-spacing:0.1em;
}
#salon_info .reserve_wrapper li .btn_tel img{
  width:1.2em;
  margin-right:1em;
}
#salon_info .map{
  margin-top:min(12%,120px);
}
#salon_info .map iframe {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

@media screen and (max-width:768px){
  #salon_info .cont_wrapper{
    margin-top:9%;
    display: block;
  }
  #salon_info .cont_wrapper section h3{
    font-size:4vw;
    text-align:center;
    letter-spacing:0.1em;
    text-indent:0.1em;
  }
  #salon_info .cont_wrapper section .sns{
    margin-top:5%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
  }
  #salon_info .cont_wrapper section .sns li{
    width:1.8em;
    margin:0 1.5em;
  }
  #salon_info .cont_wrapper dl{
    width:auto;
    margin-top:9%;
  }
  #salon_info .cont_wrapper dl dt{
    float:left;
  }
  #salon_info .cont_wrapper dl dd{
    padding-left:8em;
  }
  #salon_info .cont_wrapper dl dd span{
    display:inline-block;
    margin-right:2em;
  }
  #salon_info .reserve_wrapper{
    width:45%;
    margin-top:min(9%,90px);
    display: block;
  }
  #salon_info .reserve_wrapper li{
    width:auto;
  }
  #salon_info .reserve_wrapper li a{
    aspect-ratio:192 / 44;
    border-width:1px;
    
  }
  #salon_info .reserve_wrapper li .btn_reserve{
    font-size:2.8vw;
  }
  #salon_info .reserve_wrapper li .btn_reserve img{
    width:1.5em;
  }
  #salon_info .reserve_wrapper li .btn_tel{
    margin-top:9%;
    font-size:3.2vw;
  }
  #salon_info .reserve_wrapper li .btn_tel img{
    width:0.9em;
    margin-right:1em;
  }
  #salon_info .map{
    position:relative;
    padding-top:52%;
  }
  #salon_info .map iframe {
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
  }
}


/* #topics */
#topics{
}
