section#items{padding: 100px 0;}
@media(max-width: 768px){
  section#items{padding: 40px 0;}
}

#items .bxslider,#breakfast .bxslider{margin-top:15px; }

.ttl-ctn{}
.ttl-ctn h3{font-size: 48px;}
.ttl-ctn div{margin-top:0;}
.ttl-ctn p.jn{font-size: 22px;letter-spacing: 0.1em;}

.ttl-flex-ctn{display: flex;flex-wrap: wrap;align-items: center;}
.ttl-flex-ctn h3{font-size: 48px;}
.ttl-flex-ctn div{margin-left: 30px;}
.ttl-flex-ctn p.jn{font-size: 22px;letter-spacing: 0.1em;}
@media(max-width: 768px){
  .ttl-ctn h3{font-size: 32px;text-align: center;}
  .ttl-ctn p.jn{font-size: 18px;letter-spacing: 0.01em;}
  .ttl-flex-ctn p.jn{font-size: 18px;letter-spacing: 0.01em;}
  .ttl-flex-ctn div{margin-left: 0;overflow-wrap: break-word;width: 100%;text-align: center;}
  .ttl-flex-ctn{display: flex;flex-wrap: wrap;align-items: center;}
  .ttl-flex-ctn h3{font-size: 32px;text-align: center;width: 100%;}
  .ttl-flex-ctn p.jn{font-size: 18px;letter-spacing: 0.01em;}
}

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

  ◆ mv

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

#mv{position: relative;width: 100%;height:100vh;background: url(../images/mv.jpg)center center no-repeat;background-size:cover; }
#mv .inner{width: 100%;position: relative;margin: 0 auto;height: 100%;}
#mv h1{position: absolute;max-width: 780px;width:80%;bottom: 7%;left:3%;}

#mv .rights{position: absolute;left:20px;bottom:20px;color:#007F68;font-size: 14px;}

@media(max-width:768px){
  #mv h1{width:95%;bottom: 12%;}
  #mv{width: 100%;height:500px;background: url(../images/mv_sp.jpg)center center no-repeat;background-size:cover; }
  #mv p{color:#000;font-size: 14px;margin-top: 20px;letter-spacing: normal;}
  #mv .inner .box{margin-top: 10px;}
  #mv .rights{position: absolute;left:auto;right:20px;bottom:20px;color:#007F68;font-size: 12px;}
}

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

◆　lead

----------------------------------------------------*/
section#lead{color:#fff;}
#lead .ctn{padding:120px 0;}
#lead .txt{width: 50%;}
#lead .txt h2{margin-bottom: 40px;}
#lead .img{width: 45%;}
#lead .img img{}
#lead .img img:first-child{margin-bottom: 10px;}
#lead .lead_text{font-size: 16px; line-height: 28px; margin-bottom: 10px; }
#lead .en{font-size: 15px; line-height: 27px; }

@media(max-width: 768px){
  #lead .ctn{padding:40px 0;}
  #lead .txt{width: 100%;}
  #lead .txt h2{margin-bottom: 40px;}
  #lead .img{width: 100%;}
}


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

◆　menu

----------------------------------------------------*/
section#menu{color:#fff;text-align: center;padding:30px 0 70px;}

#menu p{font-size: 22px;margin-top: 10px;letter-spacing: 0.2em;}
#menu div{width:90%;max-width:660px;margin: 40px auto 0;display: flex;justify-content: space-between;}
#menu div a{display: block;width: 28%;}

@media(max-width: 768px){
  section#menu{color:#fff;text-align: center;padding:30px 0 30px;}
  #menu p{font-size: 18px;margin-top: 5px;letter-spacing: 0.05em;}
  #menu div{margin: 30px auto 0;;}
  #menu div a{display: block;width: 27%;}
}

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

◆　items

----------------------------------------------------*/
#amenity .ctn{padding:40px;}

#items .ttl-flex-ctn{padding: 50px 0;}
#items h4{color:#007F68;font-size: 18px;margin-top: 10px;}
#items .ctn .box{width: 48%;overflow-wrap: break-word;}
#items .message{margin-top: 60px;}
#items .message h3{color:#007F68;font-size: 30px;margin-bottom: 20px;}
#amenity .message .img{width: 40%;}
#amenity .message .txt{width: 55%;}
#amenity .message h4,#amenity .message p{color:#007F68;}
#amenity .message p{font-size: 16px; line-height: 24px; margin-bottom: 10px; }
  #amenity .message .en{font-size: 15px; line-height: 27px; }
  #amenity .box .description{font-size: 15px; line-height: 24px; margin-top: 10px; margin-bottom: 10px; }
  #amenity .box .en{font-size: 14px; line-height: 24px; }


@media(max-width: 768px){
  #items .message{margin-top: 40px;}
  #items .message h3{color:#007F68;font-size: 26px;margin-bottom: 5px;}
  #items .ttl-flex-ctn{padding: 20px 0;}
  #items .ctn .box{width: 100%;}
  #items .ctn .box:nth-child(2){margin-top: 20px;}
  #items h4{font-size: 16px;margin-top: 10px;}
  #amenity .ctn{padding:20px;}
  #amenity .message .img{width: 100%;margin-bottom: 10px;}
  #amenity .message .txt{width: 100%;}
    #amenity h4{font-size: 18px;margin-top: 10px;}
 #amenity h4, span.explanation{font-size: 15px; line-height:15px;}
}



#eye .ttl,#eye .message{align-items: center;}

#eye .ttl .txt{width:calc(50% - 50px);}
#eye .ttl .txt h3{margin-top: -50px;}
#eye .ttl .img{width:calc(45% + 250px);margin-right: -150px;}
#eye{margin-top: 140px;}
#eye .message{margin-top: -50px;}
#eye .message .img{width: 50%;}
#eye .message .txt{width: 45%;}
.overlap{position: relative;margin-bottom: 10px;z-index: 10;}
.white_box{position: absolute;right:0;top:0;background:#fff;height: 50px;width: 50px;z-index: 20; }
#eye .message p{font-size: 16px; line-height: 24px; margin-bottom: 10px; }
#eye .message .en{font-size: 15px; line-height: 27px; }
#eye .eye-box .description{font-size: 15px; line-height:24px; margin-top: 10px; margin-bottom: 10px; }
#eye .eye-box .en{font-size: 14px; line-height: 24px; }

@media(max-width: 768px){
  #eye{margin-top: 120px;}
  #eye .ttl .txt{width:100%;text-align: center;}
  #eye .ttl .txt h3{margin-top: -50px;}
  #eye .ttl .img{width:100%;margin-right:0;}

  #eye .message{margin-top: 0;}
  #eye .message .img{width: 100%;}
  #eye .message .txt{width: 100%;}
      #eye .eye-box h4, span.explanation{font-size: 15px; line-height:15px;}
}


.eye-box{padding:30px 40px 40px;margin-top: 60px;}
.eye-box h4{margin-bottom: 5px;}

#bag .ttl-flex-ctn{margin: 80px auto 0;width: 580px;}
#bag .ctn h4{margin-bottom: 5px;}
#bag .ctn .txt{width: 45%;}
#bag .ctn .img{width: 50%;}
#bag .ctn .description{font-size: 15px; line-height:24px; margin-top: 10px; margin-bottom: 10px; }
#bag .ctn .en{font-size: 14px; line-height: 24px; }

@media(max-width: 768px){
  .eye-box{padding:20px;margin-top: 20px;}
  .eye-box h4{margin-bottom: 5px;}

  #bag .ttl-flex-ctn{margin: 20px auto 0;width: 100%;text-align: center;}
  #bag .ctn h4{margin-bottom: 5px;}
  #bag .ctn .txt{width: 100%;}
  #bag .ctn .img{width: 100%;}
  #bag .txt h4, span.explanation{font-size: 15px; line-height:15px;}
}


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

  ◆ breakfast

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

#breakfast .ttl{position: relative;width: 100%;}
#breakfast .ttl .txt{position: absolute;top:50%;right: 0;padding: 20px 30px;margin-top: -88px;}

#breakfast .ttl .jn{font-size: 22px;}
#breakfast .ttl .img{margin-left: -200px;max-width:1000px; }
#breakfast .ttl .txt{background:rgba(255,255,255,0.6); }

#breakfast .message{margin-top: 60px;}
#breakfast .message h3{color:#007F68;font-size: 30px;margin-bottom: 20px;}
#breakfast .message .img{width: calc(55% + 200px);margin-right: -200px;}
#breakfast .message .txt{width: 40%;}
#breakfast .message h4,#breakfast .message p{color:#007F68;}
#breakfast .message h4, span.explanation{font-size: 15px; line-height:15px;}
#breakfast .message p{font-size: 16px; line-height: 24px; margin-bottom: 10px; }
#breakfast .message .en{font-size: 15px; line-height: 27px; }
#breakfast .ctn .description{font-size: 15px; line-height:24px; margin-top: 10px; margin-bottom: 10px; }
#breakfast .ctn .en{font-size: 14px; line-height: 24px; margin-bottom: 10px;}

@media(max-width: 768px){
  #breakfast .ttl .jn{font-size: 18px;margin-top: 20px;}
  #breakfast .ttl{position: static;width: 100%;text-align: center;}
  #breakfast .ttl .txt{position: static;padding: 0;margin-top: 0;}

  #breakfast .message .img{width: 100%}
  #breakfast .message .txt{width: 100%;}
}

#breakfast .ctn{padding: 40px;margin-top: 60px;}
#breakfast .ctn .img{width: 47.5%}
#breakfast .ctn .txt{width: 47.5%}
#breakfast .ctn .txt h4{color:#007F68;font-size: 18px;text-indent: -1.3em;padding-left: 1.2em;}


.line{width: 100%;height: 1px;background:#007F68;margin:40px 0;}

@media(max-width: 768px){
  #breakfast .message{margin-top: 40px;}
  #breakfast .message h3{color:#007F68;font-size: 26px;margin-bottom: 5px;}
  #breakfast .ctn{padding: 20px;margin-top: 20px;}
  #breakfast .ctn .img{width: 100%}
  #breakfast .ctn .txt{width: 100%}
  #breakfast .ctn .txt h4{color:#007F68;font-size: 16px;margin-top: 10px;}

  .line{width: 100%;height: 1px;background:#007F68;margin:20px 0;}
}


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

  ◆ sauna

----------------------------------------------------*/
section#sauna{padding:100px 0;}

#sauna .h2-under .jn{font-size: 22px;margin-top: 30px;}
#sauna .sec-top{margin-top: 60px;align-items: flex-end;}
#sauna .sec-top .txt{width: 32%;}
#sauna .sec-top .img{width:calc(65% + 200px);margin-right:-200px;}
#sauna .txt .jn{font-size: 16px; line-height: 28px; margin-bottom: 10px; }
#sauna .txt .en{font-size: 15px; line-height: 27px; }

#sauna .ctn{padding:40px;margin-top: 60px;}
#sauna .ctn .box{align-items: flex-end;}
#sauna .ctn .box .img{width: 60%;}
#sauna .ctn .box .ttl{width: 38.5%;}
#sauna .ctn .box .ttl h3{font-size: 26px;color:#007F68;margin-bottom: 20px;padding-left: 10px }

  #sauna .ctn .box .ttl .gfont-2{font-size: 22px;color:#007F68;margin-bottom: 10px;padding-left: 2px }
    #sauna .ctn .box .ttl .gfont-2-en{font-size: 14px;color:#007F68;margin-bottom: 10px;padding-left: 2px }

@media(max-width: 768px){
  section#sauna{padding:60px 0 40px;}

  #sauna .h2-under .jn{font-size: 18px;margin-top: 20px;}
  #sauna .sec-top{margin-top: 20px;align-items: flex-end;}
  #sauna .sec-top .txt{width: 100%;margin-top: 10px;}
  #sauna .sec-top .img{width:100%;margin-right:0;}

  #sauna .ctn{padding:20px;margin-top: 20px;}
  #sauna .ctn .box{align-items: flex-end;}
  #sauna .ctn .box .img{width: 100%;}
  #sauna .ctn .box .ttl{width: 100%; text-align: center;}

  .spmt-10{margin-top: 10px;}

}

.avail{padding: 40px;margin-top: 60px;}
.avail h3{font-size: 40px;color:#007F68;margin-bottom: 20px;}
.avail h4{color:#007F68;font-size: 18px;}
.avail .img{width: 45%;}
.avail .txt{width: 50%;}

  #sauna .avail .description{font-size: 15px; line-height:24px; margin-top: 10px; margin-bottom: 10px; }
#sauna .avail .en{font-size: 14px; line-height: 24px; margin-bottom: 10px; }

@media(max-width: 768px){
  .avail{padding: 20px;margin-top: 20px;}
  .avail h3{font-size: 22px;margin-bottom: 10px;}
  .avail h4{font-size: 16px;}
  .avail .img{width: 100%;}
  .avail .txt{width: 100%;margin-top: 10px;}
}


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

  ◆　details of stay plan

----------------------------------------------------*/
section#detail{padding:20px 0 60px;}

#detail .h2-under{margin-top: 80px;}
#detail .h2-under h3{font-size: 38px;}
#detail .h2-under .catch{font-size: 28px;margin-top: 20px;}
#detail .h2-under .date{font-size: 38px;margin-top: 5px;}

#detail .img{width: 640px;margin: 60px auto 0;}

.plan_ul{width: 90%;max-width: 800px;margin: 60px auto 0;}

@media(max-width: 768px){
  #detail .h2-under{margin-top: 30px;}
  #detail .h2-under h3{font-size: 20px;line-height: normal;}
  #detail .h2-under .catch{font-size: 18px;margin-top: 10px;}
  #detail .h2-under .date{font-size: 22px;margin-top: 0px;}

  #detail .img{width: 640px;margin: 60px auto 0;}

  .plan_ul{width: 90%;max-width: 800px;margin: 60px auto 0;}
}

#detail ul li{text-indent: -1em;padding-left: 1em; font-size: 17px; line-height:22px; margin-bottom: 10px; margin-top: 10px; }
#detail ul li span.en{font-size: 15px; color:#007f68;  }
#detail ul li span{color:#007F68;}
#detail .gfont-2{padding-left: 22px;}

#detail .price{margin-top: 60px;}
#detail h3{font-size: 22px;line-height: 28px;}
#detail h3 span{color:#007F68;}
#detail .box{width: 45%;background:#fff;border:1px solid #007F68;border-radius:0 70px 0 70px;padding: 40px 50px;}
#detail .line{margin:8px 0;}

#detail .fee{margin-top: 20px;color:#007F68;}
#detail .fee .person{font-size: 20px;}
#detail .fee .money{font-size: 32px;margin-top: -5px;}

@media(max-width: 768px){
  #detail .gfont-2{padding-left: 0px;}
  #detail .price{margin-top: 40px;}
  section#detail{padding:20px 0 10px;}

  #detail .box{width: 90%;border-radius:0 70px 0 70px;padding: 30px;margin: 0 auto;}
  #detail .box:nth-child(2){margin-top: 20px;}
  #detail .img{width: 100%;margin: 20px auto 0;}

  #detail h3{font-size: 18px;line-height: 22px;}
  #detail .fee{margin-top: 10px;color:#007F68;}
  #detail .fee .person{font-size: 16px;}
  #detail .fee .money{font-size: 22px;margin-top: 0;}
  #detail .line{margin:3px 0;}
}



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

  ◆　reservations

----------------------------------------------------*/
#reserve{padding: 100px 0;}
#reserve .link{margin-top: 40px;}
#reserve .link a{padding: 40px 0;display: block;width: 45%;background: #007F68;border:1px solid #007F68;text-align: center;color: #fff;border-radius: 0 80px 0 80px;}
#reserve .link a p{font-size: 21px;}
#reserve .link a:hover{transition: .2s;background:#fff;color:#007F68;}

@media(max-width:768px){
  #reserve{padding: 60px 0;}
  #reserve .link{margin-top: 20px;}
  #reserve .link a{padding: 20px 0;display: block;width: 90%;margin: 0 auto;background: #007F68;border-radius: 0 70px 0 70px;}
  #reserve .link a p{font-size: 18px;}
  #reserve .link a:nth-child(2){margin-top: 20px;}
}

.stay h3{font-size: 26px;border:1px solid #595757;width: 5em;margin: 60px auto 5px;}
.stay .h3-sub{font-size: 30px;margin-top: 10px;}
.stay .tel{font-size: 60px;}
.seay .tel a{font-size: #595757;}
.stay .tel span{font-size:30px;} 
.stay .time{font-size: 28px;margin-top: -10px;}

@media(max-width:768px){
  .stay h3{font-size: 18px;border:1px solid #595757;width: 5em;margin: 40px auto 5px;}
  .stay .h3-sub{font-size: 18px;margin-top: 10px;}
  .stay .tel{font-size: 36px;letter-spacing: 0.02em;}
  .stay .tel span{font-size:18px;} 
  .stay .time{font-size: 16px;margin-top: 0px;letter-spacing: 0.03em;}
}



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

  ◆　profile
  
----------------------------------------------------*/
#profile .ctn{padding: 40px;background:#fff;}
#profile .ctn .img{width: 30%;color:#007F68;}
#profile .ctn .img .en-name{font-size: 30px;}
#profile .ctn .img .jn-name{font-size: 20px;margin: 10px 0 5px;}

#profile .ctn .txt{width: 65%;}
#profile .ctn .txt h3{font-size: 40px;}
#profile .ctn .txt .h3-under{margin-top: 20px;font-size: 20px;}
#profile .ctn .txt .ttl{margin-bottom: 20px;}
#profile .txt .description{font-size: 16px; line-height:24px; margin-top: 10px; margin-bottom: 10px; }
#profile .txt .en{font-size: 14px; line-height: 24px; }

@media(max-width: 768px){
  #profile .ctn{padding: 20px;}
  #profile .ctn .img{width: 100%; text-align: center;}
  #profile .ctn .img div{width: 60%;margin: 10px auto 5px;}
  #profile .ctn .txt{width: 100%;}
  #profile .ctn .img .en-name{font-size: 26px;}
  #profile .ctn .img .jn-name{font-size: 18px;margin: 10px 0 5px;}

  #profile .ctn .txt h3{font-size: 26px;margin-top: 20px;}
  #profile .ctn .txt .h3-under{margin-top: 3px;font-size: 16px;}
  #profile .ctn .txt .ttl{margin-bottom: 10px;}
}


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

  ◆　cooperation
  
----------------------------------------------------*/
section#coop{padding: 100px 0 0;}
#coop h2{margin-bottom: 50px;}
#coop p{text-align: center;}
.sponsor{margin-bottom:50px;}
.sponsor p{font-size: 18px;margin-bottom: 10px;}
.logo-box{max-width: 560px;width: 85%;margin: 0 auto;}
.logo-box a{width: 45%;margin-bottom: 10px;display: block;}

@media(max-width: 768px){
  section#coop{padding: 60px 0 0;}
  #coop h2{margin-bottom: 30px;}
  .sponsor{margin: 0 auto 30px;width: 85%;}
  .sponsor p{font-size: 16px;margin-bottom: 10px;}
  .logo-box a{width: 48%;margin-bottom: 10px;display: block;}
}


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

  ◆ footer - フッター 

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

footer{padding:30px 0 20px;width:100%;color:#595757;}
footer .inner p{color:#e2db93;background: #700000;display: inline-block;padding: 10px 20px;margin-bottom:20px;}
footer .inner{width:90%;max-width: 860px;margin: 40px auto 0;}
footer ul.annotation li{font-size: 14px;}
footer p.group_link,footer p.group_link a{text-align: center;color:#595757;font-size: 16px;margin: 100px 0 0;}
footer .copyright{
  text-align: center;
  color: #888;
  font-size: 12px;
  margin: 20px 0 0;
}


@media(max-width: 768px){
  footer{padding:20px 0 0;}
  footer .inner{width:90%;max-width: 860px;margin: 20px auto 0;}
  footer p.group_link,footer p.group_link a{font-size: 14px;padding: 0px 0 20px;margin: 50px 0 0;} 
  footer ul.annotation li{font-size: 12px;}
  ul.links li{width:100%;}
  ul.links li a{width:180px;margin: 25px auto 0;display: block;}
  footer .copyright{
    font-size: 10px;
    margin: 10px 0 0;
    padding-bottom: 10px;
  }  
}