@charset "UTF-8";



body {
background-color:#fff;
	animation: bodyFadeIn 2s ease 0s 1 normal;
	-webkit-animation: bodyFadeIn 2s ease 0s 1 normal;
      font-family: 'Open Sans', sans-serif;
}

 
@keyframes bodyFadeIn {
	0% {opacity: 0}
	100% {opacity: 1}
}
 
@-webkit-keyframes bodyFadeIn {
	0% {opacity: 0}
	100% {opacity: 1}
}

header {
display: flex;
background-color: #;
padding: 20px 0 10px 0;
margin: 0 0 20px 0;

}


header #head1{
margin: 0 auto; 
max-width: 760px;
background-color: #;
}


header #head1 p {
text-align: center;
}

header #head1 p img {
width: 120px;
height: auto;
}


.Allwrap {
display: flex;
margin: 0 auto;
flex-direction: row-reverse;
max-width: 1500px;
 position: relative;
}

.BigMain {
width: 100%;
}





#wrapper0 {
position: relative;
margin: 0 40px 0px 40px;
}

#wrapper {
  position: relative;
  /*width: 960px;*/
  max-width: 100%;
  height: auto;
  margin: 0 auto;   /*全体の中央寄せ*/
  /*border: 1px solid #aaa;*/
  overflow:hidden;
  /*background-color:#DDD;*/
  }



.border {
 margin: 30px auto 30px ;
 /*height: 2px;*/
 max-width: 100%;
width: 30%;
/*background-color: #20B2AA;*/
/* text-align: right;*/
}

.border p{
 margin: 0px auto;
 max-width: 840px;
 color: #FF6600;
 font-size: 16px;
 border-bottom: 1px dotted #FF6600;
}










nav.regular {
margin: 0 auto;
max-width: 960px;
background-color: #0;
 }



nav.regular ul {
  display: flex;
  /*flex-wrap: wrap;*/
  max-width: 840px;
  /*margin: 0px auto;*/
background-color: #;
 }



nav.regular ul li{
  margin: 20px 10px 20px 10px;
  padding: 0px 20px 0px 20px;
  /*box-sizing: border-box;*/
  max-width: 400px;
  /*border-top: 1px  dotted #FFF;*/
  border-left: 1px   dotted #000;
  background-color: ;
  text-align: center;
}


nav.regular ul li{
  flex: 1 1 100px;
}

nav.regular ul #only1{
 border-left: none; 
}

nav.regular ul #only1 {
  flex: 1 1 150px;
}





nav.regular ul a {
display: block;
font-size: 17px;
  color: #666;
  display: block;	
}





#nav-drawer {
/*display: none;*/
}


nav.inDrawer {
    margin: 1.5px 0;
    padding : 0px 0px;
}

nav.inDrawer li {
/*display: block;*/
padding : 8px 0px 8px 0px;
color: #FF6600;
font-size: 17px;
text-indent: 1em;
line-height: 30px;
font-weight: normal;
 border-bottom : dotted  1px #FF6600;
}

nav.inDrawer li a {
color: #FF6600;
}



#mainWrodsWrap {
margin: 0 auto;
max-width: 960px;
padding-bottom: ;
 background-repeat: no-repeat;
  background-size: cover;
 /*background-image:url(../img1/0601A.png);*/
}


#mainWrods {
margin: 0 auto;
max-width: 960px;
}

#mainWrods p {
text-align: center;
color: #666;
white-space: pre-line;
}


#mainWrodsWrap #photomain img {
display: block;
margin: 0 auto;
max-width: 960px;
}





.swiper {
  /*スライダーの幅と高さを調整*/
  max-width: 960px;
  height: 300px;
  background-color: #ccc;

}

.swiper-slide {
  /*スライド要素の幅と高さを調整*/
  width: 100%;
  height: 100%;

  /*テキストの位置調整*/
  display: flex;
  justify-content: center;
  align-items: center;

  /*テキストの色と太さを指定*/
  color: #ggg;
  font-weight: bold;

  background-image:url(../img1/img1/productTop2.png);

}

/*①各スライドに以下クラスを追加で付与*/
/*②スライド背景色を設定*/
.slide1 {
  background-color: #88acbd;
}

.slide2 {
  background-color: #99cb1f;
}

.slide3 {
  background-color: #aaa;
}


.swiper-slide #slideVi1 {
  width: 960px;
  height: 300px;
background-image:url(../img1/HimwariTop1.png)
}


.swiper-slide #slideVi2 {
  width: 960px;
  height: 300px;
background-image:url(../img1/HimwariTop2.png)
}


.swiper-slide #slideVi3 {
  width: 960px;
  height: 300px;
background-image:url(../img1/HimwariTop3.png)
}


.content0 {
  width: 100%;
  padding: 20px 0 20px 0;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 0% 80%;
 /* background-image:url(../img1/cottons3.jpg)*/
}

.content0::before {
  background: inherit;
  content: '';
  filter: blur(5px);
  position: absolute;
  z-index: 0;
  top: -5px;
  right: -5px;
  bottom: -5px;
  left: -5px;
}




.content {
  display: flex;
  flex-wrap: wrap; 
  max-width: 960px;
  margin: 0px auto;
}

#mainWrap {
position: relative;
}




#section0 #a2{
 margin: 3px 0 0 0;
 position: relative;
 background-repeat: no-repeat;
 background-size: cover;
 background-position: center;
 background-image: url(../img1/Topimg1500_2.png);
 background-color:#fff;
}

#section0 {
margin: 0 40px 0px 40px;
}

#section0 #b2{
position: relative;
}



#section0 #b2 #gradef {
height: 100px;
background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 99%);
}


#section0 #inner-t2 {
margin: 0px auto; 
/*margin: 0 0 0px 80px;*/
max-width: 840px;
padding: 80px 0px 0px 40px;
}



#section0 #inner-t2 h2 {
 white-space: pre-line;
 padding: 0 0 0 0;
 font-size: 30px;
 color: #fff;
 line-height: 70px;
 text-align: ;
 letter-spacing: 1px;
 /*border-bottom: 1px dotted #fff;*/
 /*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
  /* 追加 */
  /*transform: rotate(.03deg);*/
 }

#section0 #inner-text2 {
 position: relative;
}

#section0 #inner-text2 p{
white-space: pre-line;
letter-spacing: 2px;
padding: 25px 0 0px 0;
color: #fff;
font-size: 16px;
line-height: 30px;
font-family: 'Open Sans', sans-serif;
}



.reco1 {
  margin: 50px 0 30px 0;
  display: flex;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.reco1in{
display: flex;
margin: 0 auto;
width: 960px;
align-items: flex-start;

}

.reco1 h1 {
padding:  15px 10px 20px 10px;
 color: #FF6600;
text-indent: 1em;
text-align: center;
font-size: 35px;
line-height:35px;
border-bottom : dotted  2px #FF6600;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}



#section5 {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 300px;
}


#section5 p {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 300px;
  background-image: url(../img1/saunaTop3.png);
}


#section5 p a {
display:block;
  max-width: 960px;
  height: 300px;
}


#section6 {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 300px;
}


#section6 p {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 300px;
  background-image: url(../img1/jinTop1.png);
}


#section6 p a {
display:block;
  max-width: 960px;
  height: 300px;
}







#mainWrodsWrap2 {
position: absolute;
	bottom: 0;
   width: 100%;
/*background-color: rgba(229,229,229,.1);*/
}

#mainWrods2 #mainWrods2p {
margin: 30px auto 30px;
max-width: 960px;
width: 90%;
text-align: ;
color: #fff;
font-size: 16px;
white-space: pre-line;
line-height: 25px;
letter-spacing: 1.5px;
text-shadow: 1px 1px 10px rgba(0,0,0,1);
text-shadow: -1px 1px 10px rgba(0,0,0,1);
text-shadow: 1px -1px 10px rgba(0,0,0,1);
text-shadow: -1px -1px 10px rgba(0,0,0,1);

text-shadow: 
    gray 2px 1px 2px, gray -2px 1px 2px,
    gray 2px -1px 2px, gray -2px -1px 2px;
  
/*background-color: rgba(255,255,255,.4);*/
}

#mainWrodsWrap3 {
position: absolute;
	bottom: 0;
   width: 100%;
/*background-color: rgba(229,229,229,.1);*/
}

#mainWrods3 #mainWrods3p {
margin: 30px auto 30px;
max-width: 960px;
width: 90%;
text-align: ;
color: #fff;
font-size: 16px;
white-space: pre-line;
line-height: 25px;
letter-spacing: 1.5px;
text-shadow: 1px 1px 10px rgba(0,0,0,1);
text-shadow: -1px 1px 10px rgba(0,0,0,1);
text-shadow: 1px -1px 10px rgba(0,0,0,1);
text-shadow: -1px -1px 10px rgba(0,0,0,1);

text-shadow: 
    gray 2px 1px 2px, gray -2px 1px 2px,
    gray 2px -1px 2px, gray -2px -1px 2px;
  
/*background-color: rgba(255,255,255,.4);*/
}


#Qcot1 {
  margin: 50px 0 30px 0;
  display: flex;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

#Qcot1in{
display: flex;
margin: 0 auto;
width: 960px;
align-items: flex-start;

}

#Qcot1 h1 {
padding:  15px 10px 20px 10px;
 color: #FF6600;
text-indent: 1em;
text-align: center;
font-size: 35px;
line-height:35px;
border-bottom : dotted  2px #FF6600;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}





#Qctiy {
margin: 50px 0 30px 0;
  display: flex;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

#Qctiyin{
display: flex;
margin: 0 auto;
width: 960px;
align-items: flex-start;

}

#Qctiy h1 {
padding:  15px 10px 20px 10px;
 color: #FF6600;
text-indent: 1em;
text-align: center;
font-size: 35px;
line-height:35px;
border-bottom : dotted  2px #FF6600;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  /* 追加 */
}





#section1 {
  margin: 0 auto;
  background-image: url(../img1/);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 2000px;
}

#section1 #section1in {
padding: 0px 0 30px 0;
 max-width: 100%;
background: linear-gradient(to bottom, rgba(255,255,255,0) 10%, #fff);
}

#section1 #section1in #section1inin {
padding: 0px 0 0px 0;
 max-width: 100%;
/*background: linear-gradient(to top, rgba(255,255,255,0) 80%, #fff);*/
}


.proflex {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 30px auto 0;
max-width: 960px;
background-color:;
}


.proflex .proBox {
margin: 0 0 9px 0;
flex: 0 1 24%;
height: 200px;
border: 1px solid #ddd;
 background-repeat: no-repeat;
 background-size: 80%;
 background-position: center;
}

.proflex .proBox p {
margin: 0px 0px  0px;
font-size: 25px;
text-align: center;
}


.proflex .proBox .aTop {
display: block;
width: 100%;
height: 70%;
background-color:;
}

.proflex .proBox .aBott{
display: block;
/*margin: 133px 0 0 0;*/
padding-top: 5%;
width: 100%;
height: 24%;
color: #666;
text-align: center;
font-size: 18px;
/*background-color: rgba(255,255,255,0.5);*/
background-color: rgba(255,255,255,0.75);
}



#section2 {
 margin: 0 auto;
  background-image: url(../img1/.png);
  background-repeat: no-repeat;
  background-size: contain;
  /*background-position: center;*/
  max-width: 960px;
}

#section2 #section2in {
padding: 0px 0 30px 0;
 max-width: 100%;
/*background: linear-gradient(to bottom, rgba(255,255,255,0) 70%, #fff);*/
}

#section2 #section2in #section2inin {
padding: 30px 0 0px 0;
 max-width: 100%;
/*background: linear-gradient(to top, rgba(255,255,255,0) 70%, #fff);*/
}




.BoxBack1 {
  margin: 20px 0 0 0;
  display: flex;
  width: 100%;
  height:;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-image: url("../img1/");
}


.Boxtext {
margin: 40px 0 0 0;
width: 50%;
}

.Boxtext p {
margin: 0 auto;
width: 90%;
white-space: pre-line;
font-size: calc(15px  + (16 - 15)*(100vw - 610px)/(960 - 610));
line-height: calc(25px  + (27 - 25)*(100vw - 610px)/(960 - 610));
}

.Boxtext p a {
width: 90%;
white-space: pre-line;
font-size: calc(15px  + (16 - 12)*(100vw - 610px)/(960 - 610));
line-height: calc(25px  + (27 - 25)*(100vw - 610px)/(960 - 610));
}

.Boximg {
width: 50%;
}

.Boximg p {
width: 60%;
margin: 40px auto 0;
text-align: center;
}





#section3 {
margin: 0 0px 0 0px;
position: relative;
  /*padding-bottom: 550px;*/
  background-image: url(../img1/productTop6.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#section3 #section3in {
padding-bottom: 100px;
 max-width: 100%;
background: linear-gradient(to bottom, rgba(255,255,255,0) 70%, #fff);
}

#section3 #section3inin {
padding-top: 0px;
 max-width: 100%;
background: linear-gradient(to top, rgba(255,255,255,0) 70%, #fff);
}



#section3 #logo4 {
margin:  50px auto 0;
width: 300px;
}

#section3 #logo4 img {
  width: 300px;
  height: auto;
}


#section3 .ProlinkRap {
text-align: center;
}

#section3 .ProlinkRap .goProducts .Prolink {
display: inline-block;
margin:  30px auto 0;
padding: 10px 0 10px 0;
text-align: center;
color: #666;
font-size: 23px;
font-weight: 500;
background-color: rgba(255,255,255,.3);
width: 200px;
border: dotted  2px #bbb;
border-radius: 10px 10px 10px 10px;
}

#section3 .ProlinkRap .goProducts:hover .Prolink {
color: #fff;
/*background-color: rgba(247,130,99,.3);*/
/*background-color: rgba(32,178,170,.3);*/
/*background-color: rgba(190,190,190,.3);*/
background-color: rgba(247,140,119,.3);
}




#section4 {
margin: 0 0 60px 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#section4 h2 {

}

#section4 .host {
margin: 100px auto 0px;
max-width: 960px;
}



#section4 .host .hosttext {
margin: 0 auto;
max-width: 960px;
width: 100%;
}

#section4 .host .hosttext h2 {
margin: 40px auto 20px;
max-width: 300px;
text-align: center;
font-size: 20px;
border-bottom: 1px dotted #666;
}

#section4 .host .hosttext p {
text-align: center;
}








footer {
margin: 30px auto 0;
background: #F1A652;
}



footer .footerin {
padding: 0px 0 30px 0;
/*background: #ccc;*/
}

nav.Fnav {

margin: 0 auto;
max-width: 960px;
 }



nav.Fnav ul {
	
  display: flex;
  flex-wrap: wrap;
   /*width: 60%; */
  /*max-width: 960px;*/
  margin: 0px auto;
 }



nav.Fnav ul li{
  margin: 20px 0 20px 0;
  padding: 0px 0 0px 0;
  /*box-sizing: border-box;*/
  border-left: 1px   dotted  #fff;
  background-color: ;
  text-align: center;
}


nav.Fnav ul li{
  flex: 1 1 50px;
}

nav.Fnav ul #only22{
 border-left: none; 
}

nav.Fnav ul #only11 {
 flex: 1 1 90px;
}


nav.Fnav a {
	
display: block;
font-size: 12px;
  color: #fff;	

}



footer .Fcomp {
margin: 10px auto 0px;
max-width: 960px;
}

footer .Fcomp h2 {
text-align: center;
font-size: 15px;
  color: #fff;
}

footer .Fcomp p {
text-align: center;
 font-size: 12px;
  color: #fff;
}

#toPageTop {
	position: fixed;
        z-index: 5;
        bottom: 35px;
	right: 10px;
}





@media (max-width: 960px) {

header #head1 h1 {
           font-size: calc(30px  + (40 - 30)*(100vw - 610px)/(960 - 250));
           line-height: calc(40px  + (50 - 40)*(100vw - 610px)/(960 - 250));
}

nav.inDrawer a {
	
           font-size: calc(17px  + (17 - 17)*(100vw - 610px)/(960 - 250));
           line-height: calc(20px  + (20 - 20)*(100vw - 610px)/(960 - 250));	

}

	.card-img div {
         padding-bottom: calc(310px + (310 - 310) * (100vw - 610px) / (960 - 610));
	}
       
	/*.card-inner h3 {
		font-size: calc(23px  + (30 - 23)*(100vw - 610px)/(960 - 610));
		line-height: calc(28px  + (42 - 28)*(100vw - 610px)/(960 - 610));
	}*/
	.card-inner h4 {
		font-size: calc(16px  + (20 - 16)*(100vw - 610px)/(960 - 610));
		line-height: calc(20px  + (26 - 20)*(100vw - 610px)/(960 - 610));
	}
	.card-inner p {
		font-size: calc(15px  + (16 - 15)*(100vw - 610px)/(960 - 610));
		line-height: calc(19px  + (27 - 19)*(100vw - 610px)/(960 - 610));
	}
	span.cta-card {
		font-size: calc(13px  + (14 - 13)*(100vw - 610px)/(960 - 610));
		line-height: calc(20px  + (25 - 20)*(100vw - 610px)/(960 - 610));
               /* margin-left: 60%;*/
	}
	.row-big-card .cont .card-inner {
		padding-left: 30px;
		padding-top: 25px;
	}
}

@media (max-width: 870px) {

.topflexinin1 {
width: 25%;
}

.topmain {
display: flex;
flex-direction: column;
padding: 0px 0 0 0;
width: 75%;
background-color:;
}

.topflexinin3 {
display: none;
}

}

@media (max-width: 700px) {

.wrap22in {
margin: 0 0px 0 0px;
}

.topmain .topmainin h1 {
margin: 40px 0 20px 0;
text-align: center;
/*font-size: 25px;*/
font-size: calc(30px + (40 - 30) * (100vw - 700px) / (700 - 250));
}

.topmain .topmaintext #logo5 {
margin: 0 auto;
width: 55%;

}

.topmain .topmaintext #logo5 img {
margin-left: 5%;
width: 95%;
}


.topmain .topmaintext #logo6 {
width: 44%;
}

.topmain .topmaintext #logo6 img {
margin: 15px auto 0;
width: 70%;
}

.topflex .topflexin {
margin: 0 0px 0 0px;
}

.topmainimgBoxin {
 padding-bottom: 230px;
}

.topflex .topflexin .imgBox div {
 /*padding-bottom: 95%;*/
 padding-bottom: calc(150px + (180 - 150) * (100vw - 700px) / (700 - 250));
}

.topflex .topflexin .imgBoxMid div {
 margin: 0px 0 0px 0;
 /*padding-bottom: 95%;*/
 padding-bottom: calc(150px + (180 - 150) * (100vw - 700px) / (700 - 250));
}


/*
.topflex .topflexin {
margin: 0 0px 0 0px;
display: flex;
flex-direction: column;
}
*/

/*
.topflexinin1 {
display: none;
}
*/

/*
.topmain {
display: flex;
flex-direction: column;
padding: 0px 0 0 0;
width: 100%;
background-color:;
}
*/



#section3 {
margin: 0 0px 0 0px;
}

#inner-g100 div {
 display: block;
 background-repeat: no-repeat;
 background-size: cover;
 background-position: center;
 padding-bottom: 150px;
}

#a100d{
display: none;
}

.flexBlog {
  display: flex;
  flex-wrap: nowrap; 
}

.linkWrap {
 margin: 0 auto;
  max-width: 100%
}

.linkWrap .linkBlog {
    display: inline-block;
    text-align: center;
    max-width: 100%;
    width: 100%;
    font-size: 12px;
    line-height: 20px;
    margin: 0 auto;
    padding: 0 5% 0 5%;
    border: 1px dotted #20B2AA;
    color: #20B2AA;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

}

/*
@media screen and (min-width:610px) and ( max-width:960px) {
inner-hero {
  position: absolute;
  top: 50%;
  left: 0%;
  transform: translate(-50%,-50%);
  text-align: center;
  z-index:1;
  width: %;
}
}
*/


@media all and (max-width: 610px) {




header #head1 p {
margin: 0px auto 0px;
font-size: 10px;
text-align: center;
}


header #head1 p img {
width: 90px;
height: auto;
}

nav.regular ul a {
display: block;
font-size: 15px;
  color: #666;
  display: block;	
}



#section0 #a2{
margin: 3px 0 0 0;
 position: relative;
 background-repeat: no-repeat;
 background-size: cover;
 background-position: 0 0;
 background-image: url(../img1/Topimg1100_3.png);
}

#section0 #b2{
position: relative;
}


#section0 #inner-t2 {
margin: 0 20px 0 20px;
width: ;
padding-top: 50px;
padding-bottom;;
padding-left: 0px;
padding-right: 0px;
}



#section0 #inner-t2 h2 {
 padding: 0 0 0 0;
 font-size: calc(25px + (30 - 25) * (100vw - 610px) / (610 - 250));
 color: #fff;
 line-height: 50px;
 text-align: ;
 letter-spacing: 1px;
 }

#section0 #inner-text2 {
 position: relative;
}

#section0 #inner-text2 p{
white-space: pre-line;
letter-spacing: 2px;
padding: 25px 0 0px 0;
color: #fff;
font-size: 14px;
line-height: 25px;
font-family: 'Open Sans', sans-serif;
text-shadow: 1px 1px 3px rgba(0,0,0,0.3);
}


.swiper {
  /*スライダーの幅と高さを調整*/
  max-width: 960px;
  height: 200px;
  background-color: #ccc;

}

.swiper-slide {
  /*スライド要素の幅と高さを調整*/
  width: 100%;
  height: 100%;

  /*テキストの位置調整*/
  display: flex;
  justify-content: center;
  align-items: center;

  /*テキストの色と太さを指定*/
  color: #ggg;
  font-weight: bold;

  background-image:url(../img1/img1/productTop2.png);

}

/*①各スライドに以下クラスを追加で付与*/
/*②スライド背景色を設定*/
.slide1 {
  background-color: #88acbd;
}

.slide2 {
  background-color: #99cb1f;
}

.slide3 {
  background-color: #aaa;
}


.swiper-slide #slideVi1 {
  max-width: 610px;
  height: 200px;
background-image:url(../img1/HimwariTop1.png)
}


.swiper-slide #slideVi2 {
  max-width: 610px;
  height: 200px;
background-image:url(../img1/HimwariTop2.png)
}


.swiper-slide #slideVi3 {
  max-width: 610px;
  height: 200px;
background-image:url(../img1/HimwariTop3.png)
}



#section1 {
  margin: 0 auto;
  background-image: url(../img1/);
  background-repeat: no-repeat;
  background-size: 230%;
  background-position: top;
  max-width: 2000px;
}

#section1 #section1in {
padding: 0px 0 30px 0;
 max-width: 100%;
background: linear-gradient(to bottom, rgba(255,255,255,0) 10%, #fff);
}

#section1 #section1in #section1inin {
padding: 0px 0 0px 0;
 max-width: 100%;
/*background: linear-gradient(to top, rgba(255,255,255,0) 80%, #fff);*/
}


.proflex .proBox {
flex: 0 1 49%;
}

.proflex .proBox .aTop {
display: block;
width: 100%;
height: 70%;
}


.proflex .proBox .aBott{
display: block;
/*margin: 133px 0 0 0;*/
padding-top: 5%;
width: 100%;
height: 24%;
color: #666;
text-align: center;
font-size: 18px;
background-color: rgba(255,255,255,0.5);
}



#section2 {
  margin: 0 auto;
  background-image: url(../img1/.png);
  background-repeat: no-repeat;
  background-size: 120%;
  background-position: top;
  max-width: 2000px;
}

#section2 #section2in {
padding: 0px 0 30px 0;
 max-width: 100%;
background: linear-gradient(to bottom, rgba(255,255,255,0) 10%, #fff);
}

#section2 #section2in #section2inin {
padding: 0px 0 0px 0;
 max-width: 100%;
/*background: linear-gradient(to top, rgba(255,255,255,0) 80%, #fff);*/
}


.BoxBack1 {
  margin: 0px 0 0 0;
  display: block;
  width: 100%;
  height:;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-image: url("../img1/wata5.png");
}

.Boxtext {
margin: 40px 0 0 0;
width: 100%;
}

.Boxtext p {
margin: 0 auto;
width: 90%;
white-space: pre-line;
font-size: calc(15px  + (16 - 15)*(100vw - 610px)/(960 - 610));
line-height: calc(21px  + (25 - 21)*(100vw - 610px)/(960 - 610));
}

.Boximg {
margin: 0 auto;
width: 100%;
display: flex;
}



#mainWrodsWrap2 {
/*position: absolute;*/
	/*bottom: 0;*/
margin: 0 2%;
max-width: 96%;
background-color: rgba(255,255,255,.9);
box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
border-radius: 10px;
}

#mainWrods2 #mainWrods2p {
margin: 20px auto;
padding: 0px 0px;
max-width: 90%;
text-align: start;
color: #666;
font-size: calc(14px  + (19 - 14)*(100vw - 320px)/(610 - 320));
line-height: calc(18px  + (33 - 16)*(100vw - 320px)/(610 - 320));
white-space: normal;
letter-spacing: 1px;
text-shadow: none;

}

#mainWrodsWrap3 {
/*position: absolute;*/
	/*bottom: 0;*/
margin: 0 2%;
max-width: 96%;
background-color: rgba(255,255,255,.9);
border-radius: 10px;
box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
border-radius: 10px;
}

#mainWrods3 #mainWrods3p {
margin: 20px auto;
/*padding: 20px 20px;*/
max-width: 90%;
text-align: start;
color: #666;
font-size: calc(14px  + (19 - 14)*(100vw - 320px)/(610 - 320));
line-height: calc(18px  + (33 - 16)*(100vw - 320px)/(610 - 320));
white-space: normal;
letter-spacing: 1px;
text-shadow: none;
}



#sakaiMap1 {
position: absolute;
z-index: 0;
    top: 10%;
    left: 53%;
    bottom: 0;
}

#sakaiMap1 img {
width: calc(200px + (250 - 200) * (100vw - 610px) / (610 - 250));
}


#section3 #section3in {
padding-bottom: 150px;
max-width: 100%;

}

#section3 #section3inin {
padding-top: 0px;
max-width: 100%;
}

#section3 #logo4 {
margin:  70px auto 0;
width: 200px;
}

#section3 #logo4 img {
  width: 200px;
  height: auto;
}



#section5 {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 200px;
}


#section5 p {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 200px;
  background-image: url(../img1/saunaTop3.png);
}


#section5 p a {
  max-width: 960px;
  height: 200px;
}


#section6 {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 200px;
}


#section6 p {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  max-width: 960px;
  height: 200px;
  background-image: url(../img1/jinTop1.png);
}


#section6 p a {
  max-width: 960px;
  height: 200px;
}

nav.regular ul a {
	
display: block;
font-size: 13px;
  color: #666;
  display: block;
		

}
.row-big-card .cont .card-inner {
	    padding: 0 20px 30px;
	    position: relative;
	    z-index: 3;
	    top: 45%;
	    left: 0;
	    bottom: 0;
	    background: white;
	    width: calc(100% - 40px); 
            /*background-repeat: no-repeat;
            background-position: 90% 90%;
            background-size: 20%;*/
           /* background-image : url("../img1/Back1a.png");*/
	}

.row-big-card2 .cont2 .card-inner2 {
	    padding: 0 20px 30px;
	    position: relative;
	    z-index: 3;
	    top: 45%;
	    left: 0;
	    bottom: 0;
	    background: white;
	    width: calc(100% - 40px); 
            /*background-repeat: no-repeat;
            background-position: 90% 90%;
            background-size: 20%;*/
           /* background-image : url("../img1/Back1a.png");*/
	}

.inner-hero {
  position: absolute;
  top: 50%;
  left: 78%;
  transform: translate(-50%,-50%);
  text-align: center;
  z-index:1;
  /*background-color: #FFF;*/
}

#inner-t2 {
 padding: 10px 15px 10px 15px;

}







	.row-big-card .cont .card-img div {
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
	}
	.row-big-card .cont:hover .card-img img, .row-big-card .cont:hover .card-img div {
	   /* -webkit-clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 92%);*/
		clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 92%);
	}

	.card-img {
		padding-left: 0;

	}

	.card-img div {
		padding-bottom: 64%;
	}

	/*.card-inner h3 {
		font-size: calc(25px  + (48 - 25)*(100vw - 320px)/(610 - 320));
		line-height: calc(33px  + (66 - 33)*(100vw - 320px)/(610 - 320));
	}*/
	.card-inner h4 {
		font-size: calc(18px  + (24 - 18)*(100vw - 320px)/(610 - 320));
		line-height: calc(22px  + (26 - 22)*(100vw - 320px)/(610 - 320));
	}
	.card-inner p {
		font-size: calc(14px  + (19 - 14)*(100vw - 320px)/(610 - 320));
		line-height: calc(18px  + (33 - 18)*(100vw - 320px)/(610 - 320));
	}
	span.cta-card {
		font-size: calc(13px  + (14 - 13)*(100vw - 320px)/(610 - 320));
		line-height: calc(25px  + (30 - 25)*(100vw - 320px)/(610 - 320));
	}


.row-big-card2 .cont2 .card-img2 div {
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
	}
	.row-big-card2 .cont2:hover .card-img2 img, .row-big-card2 .con2t:hover .card-img2 div {
	   /* -webkit-clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 92%);*/
		clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 92%);
	}

	.card-img2 {
		padding-left: 0;

	}

	.card-img2 div {
		padding-bottom: 64%;
	}

	/*.card-inner h3 {
		font-size: calc(25px  + (48 - 25)*(100vw - 320px)/(610 - 320));
		line-height: calc(33px  + (66 - 33)*(100vw - 320px)/(610 - 320));
	}*/
	.card-inner2 h4 {
		font-size: calc(18px  + (24 - 18)*(100vw - 320px)/(610 - 320));
		line-height: calc(22px  + (26 - 22)*(100vw - 320px)/(610 - 320));
	}
	.card-inner2 p {
		font-size: calc(14px  + (19 - 14)*(100vw - 320px)/(610 - 320));
		line-height: calc(18px  + (33 - 18)*(100vw - 320px)/(610 - 320));
	}
	span.cta-card2 {
		font-size: calc(13px  + (14 - 13)*(100vw - 320px)/(610 - 320));
		line-height: calc(25px  + (30 - 25)*(100vw - 320px)/(610 - 320));
	}


.content .toptext {
  width: calc(100% - 50px);
 
}

nav.Fnav {

margin: 0 auto;
max-width: 960px;
 }



nav.Fnav ul {
  display: flex;
  flex-direction: column;
  margin: 0px auto;
 }



nav.Fnav ul li{
  margin: 0px 0 0px 0;
  padding: 15px 0 15px 0;
  /*box-sizing: border-box;*/
  border-bottom: 1px   dotted #fff;
  background-color: ;
  text-align: center;
}


nav.Fnav ul li{
flex: 1 1 0px;
}

nav.Fnav ul #only22{
 border-bottom: 1px   dotted #fff;
border-top: 1px   dotted #fff;
background: #ccc;
}

nav.Fnav ul #only22 a{
padding: 0px 0 0px 0;
font-size: 19px;
color: #000;
}

nav.Fnav ul #only11 {
flex: 1 1 0px;
}


nav.Fnav a {
	
display: block;
font-size: 17px;
  color: #fff;		

}

}


body #Humb2 {
   display: none;
   position: fixed;
   z-index: 99;
   top: 0;/*全体に広がるように*/
   left: 0;
   padding: 0px 25px 25px 25px;
   background-color: rgba(255,255,255,0.6);
   border-radius: 2px 2px 20px 2px;
}



body .SubMainNavi #Humb {
   position: fixed;
   width: 17%;
   max-width: 250px;
   padding: 0px 0 0 10px;
   /* background-color: rgba(255,255,255,0.6);*/
   /*border-radius: 2px 2px 20px 2px;*/
}


#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 35px;/*長さ*/
  border-radius: 3px;
  background: #FF6600;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 250px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

.accbox {
    margin: 2em 0;
    padding: 0;
    max-width: 400px;/*最大幅*/
}

.accbox #toHome {
display: flex;
margin: 0 0 10px 0;
width: 100%;
align-items: flex-start;
}

.accbox #toHome p {
padding:  0px 10px 10px 10px;
 color: #FF6600;
text-indent: ;
text-align: center;
font-size: 22px;
line-height:22px;
border-bottom : dotted  2px #FF6600;
font-family: ;
  /* 追加 */
}

.accbox #toHome p a {
color: #555;
background: linear-gradient(transparent 80%, #ffffa8 0%);
}



/*ラベル*/
.accbox label {
    display: block;
    margin: 1.5px 0;
    padding : 11px 12px;
    color :#FF6600;
    font-weight: normal;
    background :;
    cursor :pointer;
    transition: all 0.5s;
    border-bottom : dotted  1px #FF6600;
}

.accbox label a {
   font-size: 16px;
   color :#FF6600;
}

.accshow h2 {
color: #FF6600;
}

.accshow h2 a {
font-size: 14px;
color: #555;
text-indent: 1em;
line-height: 25px;
}

.accshow .labelh2dotto {
margin: 0 0 5px 0;
}

.accshow .labelh2dotto a {
color: #FF6600;
border-bottom : dotted  1px #FF6600;
}

/*ラベルホバー時*/
/*
.accbox label:hover {
    background :#85baef;
}
*/

/*チェックは隠す*/
.accbox input {
    display: none;
}

/*中身を非表示にしておく*/
.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.cssacc:checked + .accshow {
    height: auto;
    padding: 5px;
    background: ;
    opacity: 1;
}

@media (max-width: 1000px) {

body #Humb2 {
display: block;
   position: fixed;
   z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  padding: 25px;
   background-color: rgba(255,255,255,0.6);
   border-radius: 2px 2px 20px 2px;
}

body .BigMain {
width: 100%;
}

body .SubMainNavi {
display: none;
}
}