@charset "utf-8";
/*********************************************
**    Copyright (C) 2016 tobe zoo
**                  All Rights Reserved.
**********************************************/

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
 
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
 
body {
    line-height:1;
}
 
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}
 
ul {
    list-style:none;
}
 
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
   
table {
    border-collapse:collapse;
    border-spacing:0;
}
 
/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
 
input, select {
    vertical-align:middle;
}
html {
	-webkit-text-size-adjust: 100%;
	font-size: 62.5%;
}


/* General */

body{
	font:13px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS P Gothic", Osaka, "メイリオ", Meiryo, sans-serif;
    *font-size:small;/* IE用 */
    *font:x-small;/* IE 互換モード用 */
	background: url(../images/bg.jpg);
	color: #fff;
}

/* フォントサイズ対応表
10px:77%     11px:85%     12px:93% 
13px:100%    14px:108%    15px:116%
16px:123.1%  17px:131%    18px:138.5%
19px:146.5%  20px:153.9%  21px:161.6%
22px:167%    23px:174%    24px:182%
25px:189%    26px:197%
*/

/* clearfix */
.clearfix:after {/*for modern browser*/
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {zoom: 1;/*for IE 5.5-7*/}

h1,h2,h3,h4,h5 { font-weight: normal; }


/* LINK
----------------------------------------------*/
a {
	text-decoration: none;
	color: #cc6518;
}
a:hover {
	text-decoration: underline;
}
a:hover img {
	filter: alpha(opacity=60);
	-moz-opacity: 0.60;
	opacity: 0.60;
}

/* Common Class
----------------------------------------------*/
li {
	float: left;
}
.Inner {
	width: 95%;
	margin: 0 auto;
}
.totop {
	text-align: right;
	margin-bottom: 30%;
}
img {
	width: 100%;
	height: auto;
}

/* logo
--------------------------------------------------------*/
#header {
	position: fixed;
	top: 0;
	background: url(../images/bg.jpg) repeat-x;
	width: 100%;
	min-height: 1%;
	z-index: 1000;
}
#header button {
	background: url(../smp-images/btn_menu.png) no-repeat;
	width: 100%;
	text-align: center;
	text-indent: -9999em;
	border: 0 none;
	max-width: 332px;
	height: 100%;
	min-height: 58px;
	margin: 0 auto;
	display:block;
}
#smpNavi {
	display: none;
	background: url(../images/bg.jpg);
	padding: 2% 10%;
	width: 75%;
	margin: 0 auto;
}
#smpNavi li {
	width: 45%;
	margin: 5% 5% 5% 0;
}
#smpNavi li:nth-child(2n) {
	margin-right: 0;
}
.logo {
	width: 85%;
	min-height: 70px;
	background: url(../smp-images/logo.png) no-repeat center center;
	background-size: 80% auto;
	margin: 15px auto 10px;
	text-align: center;
}
.logo a {
	width: 100%;
	min-height: 70px;
	display: block;
	text-indent: -10000px;
}

/* pricetable
--------------------------------------------------------*/
.pricetable {
	margin-bottom: 5%;
}
.pricetable table {
	margin-bottom: 5%;
}
.pricetable td {
	border-bottom: 1px dotted #fff;
	padding: 10px 0;
}
.pricetable .pr {
	text-align: center;
}

.pricetable .pr_cat {
	text-align: right;
}
.pricetable strong {
	display: block;
	font-size: 1.2em;
	font-weight: bold;
	color: #000;
	padding: 2px 0 2px 55px;
	margin-bottom: 10px;
}
.pricetable strong.dog {
	background: #fff url("../images/icon_dog.png") no-repeat;
}
.pricetable strong.cat {
	background: #fff url("../images/icon_cat.png") no-repeat;
}
.attention20 {
	background: url("../images/bg.jpg");
	width: 100%;
	font-size: 1.5em;
	color: #fff;
	text-align: center;
	margin-bottom: 20px;
}
.attention20 span {
	background: url("../images/greeting_bg.png") no-repeat -18px 10px;
	display: block;
	padding: 12px 0 12px 120px;
}

/* attention
--------------------------------------------------------*/
.attention {
	background: #333;
	padding: 5% 3%;
	margin: 5% auto 0;
}
.attention h4 {
	padding: 0 3% 5px;
	border-bottom: 1px solid #fff;
	margin: 0 auto 20px;
	text-align: center;
	width: 50%;
}

/* footer
------------------------------------------------------------*/
#footer {
	background: #000;
	padding: 30px;
}
#footer h5,#footer  ul {
	float: right;
}
#footer ul {
	margin-right: 50px;
}
#footer ul li {
	float: left;
	margin-left: 30px;
}

/* tothetopfixed
------------------------------------------------------------*/
div.tothetopfixed {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 1500;
}	

div.tothetopfixed a {
	display: block;
	margin: 0;
	background-color: transparent;
}

div.tothetopfixed a:hover {
	background: transparent;
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	opacity:0.5;
}

/* greeting
--------------------------------------------------------*/
#ContentsArea section {
	margin-top: -45%;
	padding-top: 45%;
}
#imgArea {
	margin-top: -4.1% !important;
}
.scroll img {
	width: 10%;
	margin: 0 auto 20%;
	display: block;
}
#greeting {
	background: url(../images/greeting_bg.png) no-repeat left bottom;
	background-size: 40% auto;
	text-align: center;
	width: 95%;
	margin: 0 auto 5%;
	padding-bottom: 25%;
}
#greeting h2,#greeting p {
	margin-bottom: 4%;
	line-height: 3;
}
#greeting img {
	width: 40%;
	text-align: center;
}

/* menu
--------------------------------------------------------*/
#menu ul {
	margin: 0 auto 30px;
	width: 85%;
}
#menu li {
	margin-right: 10%;
	width: 45%;
}
#menu ul li:nth-child(2n) {
	margin-right: 0;
}

/* hotel-intro
--------------------------------------------------------*/
#hotel-intro {
	background: rgba(237,109,15,.2);
}
#hotel-intro,#salon-intro,#schedule,#shopinfo {
	padding: 5% 0 0;
	margin-bottom: 0 !important;
}
#hotel-intro .Inner {
	background: url(../images/line.png) no-repeat center bottom;
}
#hotel-intro .Inner,#salon-intro .Inner,
#schedule .Inner,#shopinfo .Inner {
	padding-top: 5%;
	padding-bottom: 10%;
}
#hotel-intro h2,#salon-intro h2,
#schedule h2,#shopinfo h2 {
	margin-bottom: 3%;
	text-align: center;
}
h2 img {
	width: 90%;
}
#hotel-intro dd,
#salon-intro #upper dd {
	margin-top: 1em;
}
#hotel-intro dd img,
#salon-intro #upper dd img,
#waonsen dd img {
	display: block;
	margin-bottom: 1em;
}
#hotel-intro  h3 {
	margin-bottom: 5%;
}

/* hotel
--------------------------------------------------------*/
#hotel h3 img {
	width: 18%;
	display: block;
	margin-bottom: 1rem;
}
p.room,#freespace p {
	text-align: center;
	margin-bottom: 5%;
}

/* azukari
--------------------------------------------------------*/
#azukari .pricetable {
	width: 95%;
	margin: 0 auto 5%;
}
#azukari th img {
	width: 50%;
}
#azukari td img {
	width: 20%;
}

/* sougei
--------------------------------------------------------*/
#azukari h3 img {
	display: block;
	margin-bottom: 1rem;
	width: 40%;
}
#sougei h3 img {
	display: block;
	margin-bottom: 1rem;
	width: 30%;
}
#freespace h3 img {
	display: block;
	margin-bottom: 1rem;
	width: 40%;
}
#freespace .pricetable {
	width: 250px;
	margin: 0 auto 50px;
}
#sougei .pricetable {
	width: 90%;
	margin: 0 auto 50px;
}

#sougei .attention h4 img {
	width: 70%;
}

/* salon-intro
--------------------------------------------------------*/
#salon-intro {
	background: rgba(143,195,31,.2);
}
#salon-intro #upper dd img {
	width: 70%;
}
#waonsen {
	margin: 5% 0;
}
#waonsen dt {
	width: 208px;
	margin: 0 auto 5%;
}
#waonsen dd {
}
.doubles {
	margin: 50px 0 0;
}


/* schedule
--------------------------------------------------------*/
#schedule h2 img {
	width: 60%;
}
#schedule p {
	font-size: 1.5em;
	text-align: center;
}
.gc-wrap {
    /* max-width: 800px; */
    margin: 3% auto;
}
 
.g-calendar {
    position: relative;
    /* overflow: hidden;
    height: 0; */
    padding-bottom: 100%;
}
 
.g-calendar iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	z-index: 0;
}
 
@media screen and (max-width:767px) {
    .g-calendar {
        padding-bottom: 100%;
    }
}

/* shopinfo
--------------------------------------------------------*/
#shopinfo h2 img {
	width: 40%;
}
#shopinfo dl {
	margin-bottom: 3%;
}
#shopinfo iframe {
}

/* contact
--------------------------------------------------------*/
#contact {
	background: #cc6518;
	padding: 30px 0;
	text-align: center;
}
#contact h2 img {
	width: 100%;
}

/* スタッフ募集
--------------------------------------------------------*/
.reqruit_wrap {
	width: 95vw;
	margin: 40px auto 40px;
}
.reqruit_wrap img {
	width: 100%;
}


/* slick
--------------------------------------------------------*/
.top-slider_wrap {
	width: 95vw;
	height: 58.917vw;
	margin: 0 auto 10px;
	position: relative;
	z-index: 1;
}
.top-slider_wrap::after {
	content: '';
	width: 95vw;
	height: 58.197vw;
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	display: block;
	background-image: url(../images/top-slide_frame.png);
	background-size: contain;
	background-repeat: no-repeat;
}
.common_slider_wrap {
	width: 95vw;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 40px;
}
/* .slick-prev::before, .slick-next::before {
	font-size: 20px;
}
.slick-prev, .slick-next {
	width: 30px;
	height: 30px;
} */
.slick-prev {
	left: 0;
	z-index: 400;
}
.slick-next {
	right: 0;
	z-index: 400;
}

/* 202109改修 */
.heyatype_wrap {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-flow: row nowrap;
	        flex-flow: row nowrap;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	gap: 20px;
	margin-bottom: 60px;
}
.heyatype_wrap img {
	width: 200px;
}
.separate {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-flow: row wrap;
	        flex-flow: row wrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	gap: 10px;
}
.waribiki_wrap .separate img {
	height: 40px;
	-o-object-fit: contain;
	   object-fit: contain;
	-o-object-position: left;
	   object-position: left;
}
.waribiki_wrap h4 {
	font-size: 20px;
	margin-bottom: 10px;
}
.waribiki_wrap p span {
	font-weight: bold;
	color: #FE4D0B;
	font-size: 15px;
}

.calender_wrap {
	height: 207vw;
	padding-top: 6vh;
	padding-bottom: 6vh;
}
.calender_wrap iframe {
	/* width: 100%; */
}

.fs20 {
	font-size: 18px;
}
.mt60 {
	margin-top: 60px;
}
.mb20 {
	margin-bottom: 20px;
}