@charset "UTF-8";
/* CSS Document */

body{
	margin: 0;
	text-align: center;
	justify-content: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-style: normal;
	color: #440000
}

.wrap{margin: 0 auto;}

@media  (min-width: 0px) and (max-width: 480px) {
	.wrap{width: 96%;}
}	

@media  (min-width: 481px) and (max-width: 1024px) {
	.wrap{width: 96%;}
}	

@media  (min-width: 1025px) {
	.wrap{width: 90%;max-width: 1024px}
}

@media  (min-width: 768px) {
	.flexbox_sb{
		display: flex;
		justify-content: space-between;
	}
}
 



.bold{font-weight: 700}

.tel{
	font-family: acumin-pro, sans-serif;
	font-weight: 700;
}

/*--- header ---*/

#header{
	background-color: #e7dacd;
	background: rgb(246,241,236);
	background: linear-gradient(0deg, rgba(246,241,236,1) 0%, rgba(231,218,205,1) 100%);
	padding: 1.5em 0 1em;
	}
#header .disc{
	margin:0 auto .8em;
	text-align: left;
}
#header .flexbox_sb{}
#header > div{text-align: left;}

#logotitle{position: relative;text-align: left;}
	
#header h1{
	font-family: tbudgothic-std, sans-serif;
	font-weight: 800;
	letter-spacing: 0
}

#header h1 a{
	color: #440000;
	text-decoration: none;
	font-size: 16px
}

#logotitle p{font-size: 1.2em;font-weight: 700;}

#logotitle:before{
		position: absolute;
		top:0;
		left: 0;
		content:" ";
		display: inline-block;
		vertical-align: middle;
		background:  url(../img/h1_logo.png) no-repeat;
		background-size:contain;
	}


@media  (min-width: 481px) {
	#logotitle{width: 58%}
	#contact_info{width: 40%}
	#header h1{margin-bottom: 5px}
	
}

@media  (min-width: 481px) and (max-width: 1024px) {
	#header h1 a{font-size: 25px;}
	#logotitle{padding: 5px 0 0 90px}
	#logotitle:before{width: 70px;height: 70px;}
}

@media  (min-width: 1025px) {
	#header h1 a{font-size: 28px;}
	#logotitle{padding: 8px 0 0 110px}
	#logotitle:before{width: 86px;height: 86px;}
}




#contact_info dl{
	display: flex;
	justify-content: flex-start;
	flex-wrap:wrap;
	align-items: center;
	font-weight: 700;
	margin-bottom: .5em;
	background: #fff;padding: 0 1em .3em;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	
}

#contact_info dl dt{
	border-radius: 4px;
	background-color: #40210F;
	color: #fff;
	text-align: center;
	padding: 7px 8px 5px;
	line-height: 1em;
	margin-right: .8em;
}
#contact_info dl dd{letter-spacing: 0}
#contact_info dl dd.tel{font-size: 32px;}
#contact_info dl dd.open{background: #fff;margin-bottom: .3em;}

#contact_info .add{}

#contact_info .add:before{
	font-family: icomoon;
	content: "\e9ed";
}

@media  (min-width: 481px) and (max-width: 1024px) {
	#contact_info dl dd.tel{font-size: 22px;}
	#contact_info dl dt{font-size: smaller}
}

@media  (min-width: 1025px) {
	#contact_info dl dd.tel{font-size: 32px;}
}




/*--- intoro ---*/

#intoro{background: rgba(232, 219, 206, 0.6);}

#catch{background: #80292D url(../img/bg_tool1.png) no-repeat 10% -10px;
	padding-top: 2.5em;}
#catch h2{
	color: #fff;
	display: inline-block;
	margin-bottom: .8em;
	padding:0 1em 1em;
	font-size: 20px;
	letter-spacing: 2px;
	font-family: kan415typos-std, sans-serif;
	border-bottom: 1px solid rgba(255, 255, 255, 0.4);
	}


@media  (min-width: 481px) {
	#catch h2{font-size: 28px;}
}

#catch img.readimg{position:relative;z-index: 2;display: block;text-align: center;margin: 0 auto}


#catch img.mainimg{margin-top: -5em;position:relative;z-index: 1;display: block;width: 100%;height: auto}


#about{margin-bottom: 3em}

#about h3{margin-top: -7em; position: relative;z-index: 3;}

#about p{font-size: 1.2em;line-height: 1.7em}


@media  (max-width: 768px) {
	#about p br{display: none}
}

/*--- slick ---*/

#slide_wrap{padding: 0 0 2em}
.slide{
	overflow: hidden
}


/*--- menu ---*/
#menu{
	padding: 100px 0 3em;
	background: url(../img/menu_back.png) no-repeat left top,
		url(../img/bg_tool3.png) no-repeat right bottom
}

@media  (max-width: 768px) {
	#menu{padding: 180px 0 3em;}
}

#menu h2{font-size: 2.3em;margin-bottom: .3em;
	text-shadow: 
       4px  4px 0px #ffffff,
      -4px  4px 0px #ffffff,
       4px -4px 0px #ffffff,
      -4px -4px 0px #ffffff,
       4px  0px 0px #ffffff,
       0px  4px 0px #ffffff,
      -4px  0px 0px #ffffff,
       0px -4px 0px #ffffff;
}

#menu h3{
	margin-bottom: 1em;
	font-size: 1.2em
}
ul#menulist{
	display: flex;
	justify-content: flex-start;
	flex-wrap:wrap;
	margin-bottom: 20px;
	margin-right: -1%;
}

ul#menulist li{
	font-family: tbudgothic-std, sans-serif;
	line-height: 1em;
	width: 32%;
	margin-right: 1%;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	background: rgb(128,41,45);
	background: -moz-linear-gradient(0deg, rgba(128,41,45,1) 28%, rgba(159,76,80,1) 100%);
	background: -webkit-linear-gradient(0deg, rgba(128,41,45,1) 28%, rgba(159,76,80,1) 100%);
	background: linear-gradient(0deg, rgba(128,41,45,1) 28%, rgba(159,76,80,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#80292d",endColorstr="#9f4c50",GradientType=1);
	padding: .6em .5em;
	color: #fff;
	font-size: 26px;
	border: solid 3px #fff;
	margin-bottom: 10px;
	-webkit-box-shadow:1px 1px 6px #ccc;
	-moz-box-shadow:1px 1px 6px #ccc;
	box-shadow: 1px 1px 6px #ccc;
	position: relative;
	}


#price{
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	-webkit-box-shadow:1px 1px 6px #ccc;
	-moz-box-shadow:1px 1px 6px #ccc;
	box-shadow: 1px 1px 6px #ccc;
	position: relative;
	margin-left: 50px;
	position: relative;
	text-align: left;
	padding: 2em 2em 3em 100px;
	background:rgba(255, 255, 255, 0.6)
}

.circle{
	position: absolute;
	left: -50px;
	width: 8em;
	height: 8em;
	border-radius: 50%;
	background: #F15A24;
	text-align: center;
	font-family: tbudgothic-std, sans-serif;
}

.circle span{
  	position: absolute;
  	display: inline-block;
  	left: 0;
  	right: 0;
  	top: 50%;
	color: #fff;
	font-size: 1.4em;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align:center;
}



#price dl{
	display: flex;
	justify-content: flex-start;
	flex-wrap:wrap;
	align-items: center
}

#price dl dt{
	font-size: 1.5em;
	font-weight: 700;
	padding-right: 1em
}

#price dl dt:before{
	content: "■";
}
#price dl dd{}
#price dl dd span{
	font-size: 2em;
	padding-right: 1em;
	font-weight: 900;
	font-family: tbudgothic-std, sans-serif;
}

dl#zenshin{border-bottom: dotted 2px #80292D;padding-bottom: .8em;margin-bottom: 1em}

/*--- interior ---*/
#interior{background: rgba(232, 219, 206, 0.6);}
#interior > div{position: relative;width: 80%;max-width: 980px;margin: 0 auto}

#interior h2{
	position: absolute;
	width: 30%;
	left: 0;
	top: 50px
}


#in_img {width: 80%;
	float:right;
}

#in_img img{width: 100%;height: auto;display: block}


/*--- voice ---*/
#voice{padding: 2em 0}

#voice >div{padding: 1em;background: #ffffdf}

#voice h2{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	background: #440000;
	color: #fff;
	text-align: left;
	margin-bottom: .6em;
	padding: .4em .8em;
	box-shadow:3px 3px 0px rgba(0, 0, 0, 0.2);
	position: relative;
}

#voice h2:before{
	font-family: icomoon;
	content: "\e96c";
	padding-right: .5em
}

#voice ul{text-align: left}

#voice ul li{border-bottom:dotted 2px rgba(70, 0, 0, 0.4);padding:0 .5em .5em;margin-bottom: .5em}

#voice ul li:last-child{border-bottom: none}



/*--- minohara ---*/

#minohara{padding-bottom: 2em}

#minohara > div {
	margin: 0 auto;
	background: rgba(251,176,59,0.2);
	border-radius: .5em;
	border: solid 1px #FBB03B;
	padding: 1.5em;
}


@media  (min-width: 1025px) {
	#voice{padding: 3em 0}
	#minohara{padding-bottom: 3em}
	#minohara > div{padding: 2.5em;}
}



#minohara > div > div{text-align: left}
#minohara > div > div:nth-child(1){width: 40%;}
#minohara > div > div:nth-child(2){width: 57%;}

.btn_1{
	background-color: #FBB03B;
	border-radius: 0.5em;
	padding: 0.8em;
	margin-top: .6em;
	display: block;
	text-align: center;
	font-weight: bold;
	font-size: 1.2em
}

#pr h3{
	color: red;
	font-size: 1.5em;
	border-bottom: solid 1px #440000;
	padding-bottom: .7em;
	margin-bottom: .7em
}

#pr p{font-size: 1.1em}


#sp_fix{display: none}

/* footer */

#footer{background: rgba(232, 219, 206, 0.6);}
#footer > div{text-align: left;}

#gaikan img{width: 100%;height: auto}

#footer h2{
	font-family: tbudgothic-std, sans-serif;
	font-weight: 800;
	margin-bottom: 8px
}



#footer_info dl{
	display: flex;
	justify-content: flex-start;
	flex-wrap:wrap;
	align-items: center;
	font-weight: 700;
	margin-bottom: .5em
}

#footer_info dl dt{
	border-radius: 4px;
	background-color: #40210F;
	color: #fff;
	text-align: center;
	padding: 7px 8px 5px;
	line-height: 1em;
	margin-right: .8em;
}

ul#point{margin-bottom: .5em;}

ul#point li{display: inline-block;
	background: #fff;
	padding: .2em 1em;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	font-weight: 700;
	margin-right: .5em;
}


ul#open{
	margin-bottom: .5em;
	background: #fff;
	border: solid 1px #80292c;
	padding: .3em .8em
}

ul#open li{display: inline-block;font-weight: bold;}
ul#open li span{font-size: smaller;margin-right: .5em}
ul#open li:first-child:after{
	content: "／"
}

#footer_info .add{}
#footer_info .add:before{
	font-family: icomoon;
	content: "\e9ed";
}


#footer > div > div:nth-child(1){width: 33%;}
#footer > div > div:nth-child(2){width: 42%;}
#footer > div > div:nth-child(3){width: 25%;}



@media  (min-width: 481px) and (max-width: 1024px) {
	#footer_info{padding: 1em 1.3em 1em}
	#map{padding: 1em 1em 0 0}
	#footer h2{font-size: 1.5em}
	#footer_info dl dd{font-size: 1.3em;}
}

@media  (min-width: 1025px) {
	#footer_info{padding: 2em 2.3em 0}
	#footer_info p{font-size: 1.1em}
	#map{padding: 2em 2em 0 0}
	#footer h2{font-size: 2em;}
	#footer_info dl dd{font-size: 2.5em;}
	ul#open li{font-size: 1.2em}
	ul#point li{font-size: 1.2em}
}




.cr{background: #80292c;padding: 1em .5em;color: #fff;font-size: .8em}

/*--- width ---*/
.w10{width:10%}
.w20{width:20%}
.w30{width:30%}
.w40{width:40%}
.w50{width:50%}
.w60{width:60%}
.w70{width:70%}
.w80{width:80%}
.w90{width:90%}
.w100{width:100%}

/*--- a link ---*/
a{text-decoration: none;color: #000000}
a:hover{color:#fff}



