@charset "UTF-8";


/* Common
   ============================= */
body { font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

.fadeOff { opacity: 0; -webkit-transition: 1s all; transition: 1s all; -webkit-transform: translateY(50px); transform: translateY(50px); }
.fadeOn { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); z-index: 2; }
@media screen and (max-width:479px){
	.pc { display: none; }
	.sp { display: block; }
}
@media screen and (min-width:480px){
	.sp { display: none; }
}


/* SNS
   ============================= */
.sns { overflow:hidden; margin:1em 0 0.5em 0; text-align: left;}
.sns #facebook { float:left; width:20%; text-align: left; }
.sns #twitter { float:left; width:auto; margin-right:5px; }


/* Contents
   ============================= */
#footprint { margin-bottom: 1em; }
#contents {color: #333;/* background: #fff; */}
#pageTitle { margin-bottom: 40px; }
#pageTitle h1 { float: none; float: none; }
#pageTitle img { width: 100%; }
#intro { width: 800px; margin: 0 auto; text-align: center; }
@media screen and (max-width:479px){
	#intro { margin-bottom: 0; }
}
@media screen and (max-width:479px){
	#intro { width: 100%; padding: 0 2%; -webkit-box-sizing: border-box;
	box-sizing: border-box; }
}
#intro h1 { font-size: 2.5em; float: none; }
#main { }
#main img { width: 100%; }
#main h1 {font-size: 1.8em;line-height: 1;font-weight: bold;margin-bottom: 1.5em;}
#main h2 { font-size: 2.5em; margin-bottom: 1em; border: 0; }
@media screen and (max-width:479px){
	#main h1 { text-align: center; }
	#main h2 { height: auto; margin-bottom: .5em; }
}
#main h3 { font-size: 2.5em; }
#main p {font-size: 1.2em;}
@media screen and (max-width:479px){
	#main p { font-size: 1.4em; }
}

#contents section { width: 100%; padding: 40px 0 20px; }
.innerWrap {width: 800px;margin: 0 auto;overflow: hidden;margin-bottom: 60px;padding: 5em 2em;}
@media screen and (max-width:479px){
	.innerWrap { width: 100%; padding: 0 2%; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 20px; }
}
article:nth-child(2n+1)::before {content:"";height: 700px;width: 900px;background: hsla(40, 100%, 93%, 0.8);display:block;position:absolute;top:0;left: 0;z-index: -1;-webkit-transform: rotate(10deg);transform: translate(0%, -2%) rotate(-6deg) scale(1.3,1);}
article:nth-child(2n)::before {content:"";height: 700px;width: 900px;background: hsla(40, 100%, 93%, 0.8);display:block;position:absolute;top: -51px;left: 0;z-index: -1;-webkit-transform: rotate(-10deg);transform: translate(-5%,5%) rotate(5deg) scale(1.2,1);}
article {margin-bottom: 4em;padding-bottom: 4em;/* border-bottom: 1px solid #ddd; */position:relative;background: transparent;}
article:last-child { border-bottom: 0; }
article h3 { color: #866030;font-size: 1em!important;font-weight: bold; }
.imageBox { float: left; width: 50%;}
.imageBox .mainImage {}
.imageBox .subImage { }
.imageBox .subImage .subImageBox {  }
@media screen and (max-width:479px){
	.imageBox { float: none;width: 100%;margin-bottom: 3em;}
}

.infoBox {float: right;width: 46%;}
@media screen and (max-width:479px){
	.infoBox {float: none;width: 100%;}
}
.infoBox .shopTitle {margin-bottom: 3.5em;}
.infoBox .shopTitle h1 {float: none;}
.infoBox .shopTitle h4 {font-size: 1.5em;margin-bottom: 0.5em;color: #333;}
.infoBox .shopTitle p {margin-bottom: 1em;}

.infoBox .featureBox {border: 3px solid #866030;color: #866030;margin-bottom: 2em;background: #fff;}
.infoBox .feature {font-weight: bold;border-bottom: 1px solid #866030;padding: 1em;line-height: 1.8;}
.infoBox .feature:last-child { border: 0; }

.infoBox .data {margin-bottom: 1.5em;font-size: 1.3em;}
.infoBox .data .tel {}
.infoBox .data .tel::before { color:#c8a374; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f098"; margin-right: .5em; }
.infoBox .data .address {}
.infoBox .data .address::before { color:#c8a374; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f041"; margin-right: .5em; }
.infoBox .data .time {}
.infoBox .data .time::before { color:#c8a374; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f017"; margin-right: .5em; }

.infoBox a { text-decoration: none!important; }
.infoBox .shopBtn {color: #fff;padding: 1em;background: #ff7223;text-align: center;}
.infoBox .shopBtn::before { font-family: "Font Awesome 5 Free"; font-weight: bold; content:"\f35d"; margin-right: .5em; }