@charset "utf-8";
/* CSS Document */
/*CSS初期化*/
@import url("reset.css");
header { display:block;}
body	{
	color:#3d3735;
	font:16px "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic" , "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	background-color:#bfdfe8;
}

a { color:#57514f; text-decoration:none;}



.ft-sm { font-family: "Sawarabi Mincho";}
.ancher { display:block; height:1px; width:1px; position:relative; top:-100px;}


#page_header	{ background:url(../img/base/header.png); border-bottom:2px solid #ffffff; vertical-align:middle; position:fixed; z-index:1024; width:100%;}
#page_header .box	{ width:960px; height:60px; margin:0 auto; padding:10px 5px; position:relative;}
#page_header .description	{ background-color:#bfdfe8; border-bottom:2px solid #ffffff; height:24px;}
#page_header .description p	{ width:960px; margin:0 auto; padding-top:4px; vertical-align:middle; font-size:80%;}

#page_header h1	{ width:315px; height:60px; position:absolute; top:10px; left:5px;}
#page_header h1 a { display:block; width:271px; height:60px;}
#page_header h1 img	{ width:100%;}
#page_header nav { display:block; width:460px; position:absolute; bottom:16px; left:300px;}
#page_header nav li { display:inline-block; margin-right:20px;}
#page_header nav a { border-bottom:3px dotted #57514f; text-decoration:none; font-size:120%; line-height:1.4; display:block;}
#page_header .box:after	{ content:""; display:block; clear:both;}
#page_header .links	{ position:absolute; right:-10px; top:5px;}
#page_header .links li	{ list-style:none; margin-left:5px; display:inline-block;}
#page_header .links li.xaas	{ padding:5px; background-color:#ffffff; -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;}
#page_header .links li.xaas img	{ display:block;}


#catch { background:url(../img/index/catch-back.png) center bottom repeat; padding-top:108px;}
#catch .box	{ width:960px; margin:0 auto; position:relative;}
#catch img	{ display:block;}
#catch .logo	{ position:absolute; top:60px; left:75px;}

#catch-text { padding:20px 0; background-color:#f2f2f2; border-top:2px solid #ffffff; border-bottom:2px solid #ffffff;}
#catch-text .box	{ width:960px; margin:0 auto; position:relative;}
#catch-text p	{ display:none;}
#catch-text .img0 { position:absolute; top:-50px; right:180px; display:block;
  transform: rotate(-6deg);
  -ms-transform: rotate(-6deg);
  -moz-transform: rotate(-6deg);
  -webkit-transform: rotate(-6deg);
  -o-transform: rotate(-6deg);
  z-index:2;
}
#catch-text .img1 { position:absolute; top:-20px; right:-50px; display:block;
  transform: rotate(6deg);
  -ms-transform: rotate(6deg);
  -moz-transform: rotate(6deg);
  -webkit-transform: rotate(6deg);
  -o-transform: rotate(6deg);
  z-index:1;
}


#content { background:#ffffff; width:960px; margin:0 auto;}

.content-box { padding:50px 17px 0;}
.content-box:after { content:""; display:block; clear:both;}



.headline { font-size:150%; margin-bottom:25px;}
.headline p { width:calc(100% - 65px); width:-webkit-calc(100% - 65px); display:inline-block; border-bottom:6px dotted #d2bda8; border-radius:3px; line-height:37px;}
.headline p .text	{ position:relative; top:5px; color:#42210b; font-weight:normal;}
.headline p:after	{ content:""; display:block; clear:both;}
.headline-icon		{}
.headline-icon:after{ width:60px; height:54px; display:inline-block; font-size:8px; font-family: "Sawarabi Mincho"; background:url(../img/base/icon-footstep-0.png) 0 0 no-repeat;
 content:attr(data-text); text-align:center; line-height:54px; color:#603813; margin-right:5px;
}

.headline .icon			{ display:block; float:right;}
.headline .icon:before	{ content:""; display:inline-block; background:url(../img/base/icon-dog.png) center center no-repeat; width:37px; height:31px; position:relative; top:5px;}
.headline .icon:after	{ font-size:60%; font-family: "Sawarabi Mincho"; font-weight:normal; color:#998675; content:attr(data-text); position:relative; bottom:3px; margin-left:5px;}


#shower-content	{ text-align:center;}
.shower-img	{ display:inline-block; vertical-align:middle; margin-right:20px;}
.shower-text	{ display:inline-block; vertical-align:middle; width:512px; padding:20px; border:6px solid #e8e6d8; text-align:left;}


.price-menu:after	{ content:""; display:block; clear:both;}
.price-menu .box-l	{ width:620px; float:left;}
.price-menu .box-r	{ width:280px; float:right;}

.price-menu .box-r .link	{ padding:10px 0; text-align:center;}
.link-bottom	{ display:none;}


.menu-table-0 { width:620px;}
.menu-table-0 tr:nth-child(even) td	{ background-color:#e8e6d8;}
.menu-table-0 tr:nth-child(odd) td	{ background-color:#f5f4eb;}
.menu-table-0 tr:nth-of-type(1) td { background-color:#f2f2f2; text-align:center; padding:10px;}
.menu-table-0 td:nth-of-type(1) { padding:7px 5px 7px 20px;}
.menu-table-0 td:nth-of-type(2) { border-right:1px dotted #cccccc; border-left:1px dotted #cccccc; padding:7px 0 7px 50px;}
.menu-table-0 td:nth-of-type(3) { padding:7px 0 7px 80px;}
.menu-table-0 td:nth-of-type(3) span	{ display:inline-block; padding-left:20px;}

.price-menu .price-list { border:2px dotted #c1b9b6;}
.price-menu .price-list li { list-style:none; margin-bottom:0.5em;}
.price-menu .price-list li:before { display:inline-block; content:"・";}
.price-menu .price-list li p { display:inline-block; width:calc(100% - 30px); width:-webkit-calc(100% - 30px);}
.price-menu .menu-name { background-color:#f2f2f2; text-align:center; padding:10px;}


.price-menu .set-0 .box { margin:7px; background:url(../img/index/price-img-0.png) right bottom no-repeat;}
.price-menu .set-1	{ margin-top:20px;}
.price-menu .set-1 .box { text-align:center; margin:20px 7px 7px; padding-bottom:13px; background:url(../img/index/price-img-1.png) right bottom no-repeat;}


.price-menu .set-2	{ margin-top:20px;}
.price-menu .set-2 .box { margin:7px;}
.price-menu .set-2 .price	{ display:inline-block; float:right;}
.price-menu .set-2 .var { text-align:left; padding-left:15px;}
.price-menu .set-2 .var li { display:inline-block; width:calc(33% - 3px); width:-webkit-calc(33% - 3px);}
.price-menu .set-2 li:after	{ content:""; display:block; clear:both;}
.price-menu .set-2 .var li:last-of-type { margin-right:0;}
.price-menu .set-2 .var li span {
    vertical-align: middle;
    position: relative;
    line-height: 12px;
    width: 12px;
    height: 12px;
    background: #3d3735;
    border: 2px solid #3d3735;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    text-align: center;
    color: #ffffff;
	font-size:10px;
	font-weight:normal;
	display:inline-block;
	bottom:2px;
}
.price-menu .set-2 .var li:before { content:"";}

.price-menu .set-2 .portal	{ text-align:right; font-size:80%;}
.price-menu .set-2 .portal a { text-decoration:none;}
.price-menu .set-2 .portal a:before { display:inline-block; content:""; width:23px; height:16px; background:url(../img/base/icon-question.png) 0 0 no-repeat;}
.price-menu .price-list li p.portal	{ width:100%;}


.image_set.herb { vertical-align:bottom; text-align:center; margin-bottom:30px; position:relative; left:-10px;}
.image_set.herb span { display:inline-block; width:18%;
-webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; overflow:hidden;
}
.image_set.herb img { display:block; width:100%;}
.image_set.herb span:nth-of-type(1) { border:10px solid #f7e7da; box-shadow:20px 20px 0px 1px #fef3e9; }
.image_set.herb span:nth-of-type(2) { border:10px solid #e6edbc; box-shadow:20px 20px 0px 1px #f0f6dd; margin:0 40px;}
.image_set.herb span:nth-of-type(3) { width:38%; border:10px solid #f7dfe8; box-shadow:20px 20px 0px 1px #fdeff4; }


#herb-content .box { padding:10px; margin:15px 4% 0;}
#herb-content .box:first-of-type { margin-top:0;}
#herb-content .box:before	{ content:""; display:inline-block; width:170px; height:108px; background:url(../img/index/herb-img-0.png) 0 0 no-repeat; vertical-align:middle;}
#herb-content .box .text	{ display:inline-block; width:calc(100% - 200px); -webkit-width:calc(100% - 200px); margin-left:20px; vertical-align:middle;}
#herb-content .box p { margin-left:6px;}
#herb-content .box .desc { margin-bottom:8px; margin-left:0;}
#herb-content .desc b { font-weight:normal; border-radius:6px; padding:3px 6px; background-color:#998675; color:#ffffff;}
#herb-content .box-1 .desc b { background-color:#95c5c6;}
#herb-content .box-2 .desc b { background-color:#b5b75a;}

#herb-content .box-1:before { background-image:url(../img/index/herb-img-1.png)}
#herb-content .box-2:before { background-image:url(../img/index/herb-img-2.png)}

#herb-content .box-0 { background-color:#f5f3f1;}
#herb-content .box-1 { background-color:#f6f9f9;}
#herb-content .box-2 { background-color:#f9fbf1;}




#bathing-img { width:24%; float:left;}
#bathing-img img.for_pc { width:80%; margin:0 auto; display:block;}
#bathing-img img.for_sp { display:none;}
#bathing-content { width:75%; float:right;}
#bathing-content .box { padding:10px; margin:15px 0 0;}
#bathing-content .box:first-of-type { margin-top:0;}
#bathing-content .box:before	{ content:""; display:inline-block; width:107px; height:90px; background:url(../img/index/bathing-img-0.png) 0 0 no-repeat; vertical-align:middle;}
#bathing-content .box .text	{ display:inline-block; width:calc(100% - 140px); -webkit-width:calc(100% - 140px); margin-left:20px; vertical-align:middle;}
#bathing-content .box p { margin-left:6px;}
#bathing-content .box .desc { margin-bottom:8px; margin-left:0;}
#bathing-content .desc b { font-weight:normal; border-radius:6px; padding:3px 6px; background-color:#998675; color:#ffffff;}
#bathing-content .box-1 .desc b { background-color:#95c5c6;}
#bathing-content .box-2 .desc b { background-color:#b5b75a;}

#bathing-content .box-1:before { background-image:url(../img/index/bathing-img-1.png)}
#bathing-content .box-2:before { background-image:url(../img/index/bathing-img-2.png)}

#bathing-content .box-0 { background-color:#f5f3f1;}
#bathing-content .box-1 { background-color:#f6f9f9;}
#bathing-content .box-2 { background-color:#f9fbf1;}


.instagram-headline { margin:30px 0 0 5px; position:relative;}
.instagram-headline a		{ text-decoration:underline; color:#998675;}
.instagram-headline span	{ display:inline-block; margin-left:15px; width:calc(100% - 70px); -webkit-width:calc(100% - 70px); vertical-align:middle;}
.instagram-headline:before { content:""; background:url(../img/base/insta.png) center center no-repeat; display:inline-block; width:50px; height:50px; vertical-align:middle;}
#instagram-content .box { margin:25px 80px 0; padding-bottom:70px;}
#instagram-content ul	{ font-size:0;}
#instagram-content li	{ display:inline-block; margin:0 9px 9px 0;}
#instagram-content li span { width:100px; height:100px; display:block; background-size:cover;}

#info-access { display:block; background-color:#f2f2f2; border-top:2px solid #ffffff; border-bottom:2px solid #ffffff;}
#info-access .box { width:960px; margin:0 auto;}

#map { width:650px; margin:0 auto; padding:10px 0; border:2px dotted #c7b299; background-color:#ffffff; display:inline-block; vertical-align:middle;
position:relative; bottom:30px;}
#map_canvas {width: 630px; height: 284px; margin:0 auto;}
#map_canvas img { display:block; width:100%; height:auto;}
.google-map { text-align:center; margin-top:5px;}
.google-map a { text-decoration:none;}
#info-access .headline-icon:after { background-image:url(../img/base/icon-footstep-1.png);}


#info-access .text { width:265px; display:inline-block; vertical-align:middle; font-size:86%; position:relative; bottom:25px;}
#info-access .text p	{ margin-bottom:10px; }
#info-access .name	{ font-size:160%; margin-top:50px;}
#info-access .number  {font-size:14px; margin-top:-1em; }

#info-access .text .sub	{ color:#808080;}
#info-access dl { padding-bottom:100px; }
#info-access dt	{ display:inline-block; width:calc(30% - 12px); width:-webkit-calc(30% - 12px); padding:5px; background-color:#3d3735; color:#ffffff; margin-bottom:5px; text-align:center;}
#info-access dd	{ display:inline-block; width:calc(68% - 10px); width:-webkit-calc(68% - 10px); padding:5px 0; margin:0 0 5px 10px;}
#info-access dd.tel	{ font-size:120%; position:relative; top:0.15em; font-weight:bold;}

#telme { display:none;}

#copyright { background:url(../img/base/header.png); padding-top:90px; border-top:2px solid #ffffff; margin-top:-50px;}
#copyright p	{ text-align:center; font-size:80%; background-color:#ffffff; padding:10px 0 ; line-height:1;}











@media screen and (min-width: 0px) and (max-width: 960px) {

	#page_header	{ width:100%;}
	#page_header .box	{ width:auto; height:auto; padding:0; position:static;}
	#page_header .description	{ height:auto; overflow-x:hidden; font-size:80%;}
	
	#page_header h1	{ width:60%; max-width:271px; height:auto; position:static; margin:0 auto 0 10px; padding:10px 0;}
	#page_header h1 a { display:block; width:100%; margin:0 auto;}
	#page_header h1 img	{ width:100%;}

#page_header nav { left:315px;}
#page_header nav a { border-bottom:2px dotted #57514f; text-decoration:none; font-size:120%; line-height:1.2; display:block;}
	#page_header .box:after	{ content:""; display:block; clear:both;}
	#page_header .links	{ top:50px; right:10px;}
	#page_header .links li	{ list-style:none; margin-left:5px; display:inline-block;}
#page_header .links { display:none;}
.link-bottom img	{ display:block; margin:0 auto; width:auto; height:8vh}
.link-bottom	{ padding:5px 0; display:block; position:fixed; bottom:0; width:100%; background-color:#ffffff;}






#catch { padding-top:98px;}
#catch .box	{ width:100%; margin:0 auto; position:relative;}
#catch img	{ display:block; width:100%;}
#catch .logo	{ position:absolute; width:40%; top:10%; left:6%;}

#catch .box	{ width:100%;}

#catch-text { padding:20px 0; background-color:#f2f2f2; border-top:2px solid #ffffff; border-bottom:2px solid #ffffff;}
#catch-text .box	{ width:96%; margin:0 auto; position:relative; text-align:center;}



#catch-text .img0 { position:static; display:inline-block;
  transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  width:47%;
  margin-right:1.5%;
}
#catch-text .img1 { position:static; display:inline-block;
  transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  width:47%;
  margin-left:1.5%;
}

#catch-text .text-img-box	{ width:100%; overflow:hidden;}



#content { width:100%;}


	#info-access .box { width:100%;}
	#map { width:calc(100% - 20px);  width:-webkit-calc(100% - 20px); padding:10px;}
#map { width:66%; margin:0 auto; padding:10px 0; border:2px dotted #c7b299; background-color:#ffffff; display:inline-block; vertical-align:middle;}
#map_canvas {width:calc(100% - 20px); width:-webkit-calc(100% - 20px); height: 410px; margin:0 auto;}
.google-map { text-align:center; margin-top:5px;}
.google-map a { text-decoration:none;}
#info-access .headline-icon:after { background-image:url(../img/base/icon-footstep-1.png);}


#info-access .text { width:32%;}


.price-menu .box-l	{ width:56%; float:left;}
.price-menu .box-r	{ width:43%; float:right;}

.menu-table-0 { width:100%;}

.menu-table-0 tr:nth-of-type(1) td { padding:5px 0; font-size:80%;}
.menu-table-0 td:nth-of-type(1) { padding:3px 5px 3px 5px; font-size:80%;}
.menu-table-0 td:nth-of-type(2) {padding:3px 0 3px ; text-align:center;}
.menu-table-0 td:nth-of-type(3) { padding:3px 0 3px ; text-align:center;}
.menu-table-0 td:nth-of-type(3) span	{ display:inline-block; padding-left:20px;}

.price-menu .set-0 .box { background:none; }
.price-menu .set-1 .box { background:none; }

#herb-content .box:before	{ content:""; display:inline-block; width:85px; height:54px; background-size:contain; vertical-align:middle;}
#herb-content .box .text	{ display:inline-block; width:calc(100% - 110px); -webkit-width:calc(100% - 110px); margin-left:10px; vertical-align:middle;}
#herb-content .box { padding:10px 0 10px 5px; margin:15px 3% 0;}

#bathing-img img.for_pc { width:90%;}

#bathing-content .box:before	{ content:""; display:inline-block; width:53px; height:45px; background-size:contain; vertical-align:middle;}
#bathing-content .box .text	{ display:inline-block; width:calc(100% - 70px); -webkit-width:calc(100% - 70px); margin-left:10px; vertical-align:middle;}
#bathing-content .box { padding:10px 5px 10px 5px; margin:15px 0 0 5px;}






#instagram-content .box { margin:25px 10px 0;}



.price-menu .set-2 .portal	{ font-size:90%;}
.price-menu .set-2 .portal a:before { width:18px; height:14px; background-size:contain;}

}



@media screen and (min-width: 0px) and (max-width: 836px) {
#instagram-content li { width:24%; height:24vw; margin-right:1%;}
#instagram-content li span { width:100%; height:100%;}
}


@media screen and (min-width: 0px) and (max-width: 760px) {
	#page_header .links	{ display:none;}

#page_header nav { display:block; width:420px; position:absolute; bottom:16px; left:300px;}

.headline .icon			{ display:none;}


.price-menu .box-l	{ width:100%; float:none;}
.price-menu .box-r	{ width:100%; float:none;}

.menu-table-0 { width:100%; margin-bottom:20px;}

.menu-table-0 tr:nth-of-type(1) td { padding:5px 0; font-size:80%;}
.menu-table-0 td:nth-of-type(1) { padding:3px 5px 3px 5px; font-size:80%;}
.menu-table-0 td:nth-of-type(2) {padding:3px 0 3px ; text-align:center;}
.menu-table-0 td:nth-of-type(3) { padding:3px 0 3px ; text-align:center;}
.menu-table-0 td:nth-of-type(3) span	{ display:inline-block; padding-left:20px;}

.price-menu .set-0 li { width:32%; display:inline-block;}

.price-menu .set-2 li { margin-bottom:1px; border-bottom:1px dotted #cccccc;}
.price-menu .set-2 li:last-of-type { margin-bottom:0; border-bottom:none;}

.price-menu .set-2 li li { border-bottom:none;}

.shower-img	{ display:none;}


	#info-access .box { width:100%;}
	#map { width:calc(100% - 20px);  width:-webkit-calc(100% - 20px); padding:10px; position:static;}
	#map_canvas { width:100%; height:auto;}
	#info-access .addr { width:auto; display:table; margin:0 auto;}
	#info-access .text { width:100%;}
	#info-access .text .pc	{ display:none; }
	#info-access .zip	{ padding-right:10px;}

	#info-access dl	{ width:100%; margin:0 auto;}

#info-access .name	{text-align:center; margin-top:10px; width:100%;}
#info-access .number  {font-size:14px; margin-top:-1em; text-align:center;}
#info-access dl { padding-bottom:0; }
}




@media screen and (min-width: 0px) and (max-width: 640px) {

.headline { font-size:100%;}
.headline p { width:calc(100% - 35px); width:-webkit-calc(100% - 35px); padding-bottom:3px; display:inline-block; border-bottom:2px dotted #d2bda8; border-radius:0; line-height:27px;}
.headline-icon:after{ width:30px; height:27px; display:inline-block; font-size:0; font-family: "Sawarabi Mincho"; background:url(../img/base/icon-footstep-0.png) 0 0 no-repeat; background-size:contain;
 content:""; text-align:center; line-height:27px; color:#603813; margin-right:5px; position:relative; top:10px;
}

	#page_header .box	{ width:100%; height:auto; padding:0; position:static;}
	#page_header .description	{ height:auto;}
	
	#page_header h1	{ width:calc(100% - 50px); width:-webkit-calc(100% - 50px); height:auto; display:block; position:static; margin:0 auto; padding:10px 0 0 50px;}
	#page_header h1 a { width:80%; max-width:271px; display:block; margin:0 auto;}

	#page_header nav { display:none;}
	#page_header .box:after	{ content:""; display:block; clear:both;}
	#page_header .links	{ top:40px;}
	#page_header .links li	{ list-style:none; margin-left:5px; display:inline-block;}
#catch { padding-top:78px;}


#catch-text p	{ display:block; text-align:left; padding:5px;}
#catch-text p:nth-of-type(1) { padding:10px 5px 0;}
#catch-text p:nth-of-type(2) { padding:5px 5px 0;}


.image_set.herb { position:static;}
.image_set.herb span:nth-of-type(1) { width:36%; border:10px solid #f7e7da; box-shadow:10px 10px 0px 1px #fef3e9; margin:0 10px 0 0; }
.image_set.herb span:nth-of-type(2) { width:36%; border:10px solid #e6edbc; box-shadow:10px 10px 0px 1px #f0f6dd; margin:0 0 0 10px;}
.image_set.herb span:nth-of-type(3) { width:calc(72% + 40px); width:-webkit-calc(72% + 40px); border:10px solid #f7dfe8; box-shadow:10px 10px 0px 1px #fdeff4; margin:20px auto 0; }

#herb-content .box { margin:15px 0 0;}

#bathing-img img.for_pc { display:none;}
#bathing-img { width:100%; margin:0 auto 20px; float:none;}
#bathing-img img.for_sp { width:80%; margin:0 auto; display:block;}
#bathing-content { float:none; width:100%;}

#telme { display:block; width:100%; position:fixed; bottom:0; background:rgba(23,149,180,0.7);}
#telme p	{ text-align:center; padding:10px 0;}
#telme p:before { display:inline-block; width:1.2em; height:1.2em; content:""; background:url(../img/base/tel.png) center center no-repeat; background-size:contain; position:relative; top:0.1em; margin-right:0.4em;}
#telme a	{ font-size:120%; color:#ffffff;}

.pc #telme { display:none;}
.distel #telme { display:none;}

.text-img-box	{ display:none;}
.shower-text	{ display:inline-block; vertical-align:middle; width:auto; padding:20px; border:6px solid #e8e6d8; text-align:left;}





}

@media screen and (orientation: portrait) and (min-width: 0px) and (max-width: 640px) {


}





@media screen and (min-width: 0px) and (max-width: 480px) {

	.sp	{ display:block;}
	#page_header .description	{ display:none;}
	#page_header .links	{ top:15px;}
	#catch { padding-top:68px;}

.price-menu .set-0 li { width:49%; display:inline-block; font-size:80%;}

#instagram-content li { width:30.5%; height:30.5vw; margin-right:2%; margin-bottom:2%;}
#instagram-content li span { width:100%; height:100%;}


	#info-access .text .pc	{ display:block; }

}