@charset "utf-8";
body {
padding: 20px;}

body,text {
font-family: Meiryo,Arial,Helvetica,Verdana,sans-serif;
word-break:break-all;
margin:0; padding:0;
font-size: 80%;
-webkit-text-size-adjust: 100%;
animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;
-webkit-tap-highlight-color:rgba(0,0,0,0);
color: #7c7063;
line-height: 1.6;
letter-spacing: 2px;}

a:link {-webkit-transition: 0.3s; transition: 0.3s;}
a {text-decoration: none;}
a{outline: none;}
:focus {outline:none;}
::-moz-focus-inner {border:0;}

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;}

a:hover img {opacity: 0.6;}
a img {transition: opacity 0.3s ease-out;}

ul, li {margin: 0; padding: 0; list-style: none;}
h1, h2, h3 {margin: 0; font-weight: normal; font-size: 90%;}
table {border-collapse: collapse;
border-spacing: 0;}


/*▼head area--------------------*/
nav.globalMenuSp {
border-bottom: 1px solid #eaeaea;
-webkit-box-shadow: 0px 0px 15px #ebeaea;
box-shadow: 0px 0px 15px #ebeaea;
z-index: 2;
top: 0;
left: 0;
position: fixed;
text-align: center;
transform: translateY(-100%);
transition: all 0.6s;
width: 100%;
background-color: rgba(255,255,255,.9);}

nav.globalMenuSp ul {
margin: 5% auto 2%;
width: 90%;
position: relative;}

nav.globalMenuSp li {
list-style-type: none;
padding: 0;
width: 100%;
border-bottom: 1px solid #e3ded4;}

nav.globalMenuSp ul li:last-child {
padding-bottom: 0;
border-bottom: none;}

nav.globalMenuSp ul li a {
display: block;
color: #746752;
padding: .6em 0;
font-size: 120%;
font-family: 'Noto Sans Japanese', serif;}

nav.globalMenuSp.active {
transform: translateY(0%);}

.navToggle {
display: block;
position: fixed;
right: 8px;
top: 9px;
width: 38px;
height: 38px;
cursor: pointer;
z-index: 3;
background: #c22828;
text-align: center;}

.navToggle span {
display: block;
position: absolute;
width: 24px;
border-bottom: solid 3px #eee;
-webkit-transition: .35s ease-in-out;
-moz-transition: .35s ease-in-out;
transition: .35s ease-in-out;
left: 7px;}

.navToggle span:nth-child(1) {
top: 8px;}

.navToggle span:nth-child(2) {
top: 18px;}

.navToggle span:nth-child(3) {
top: 28px;}

.navToggle span:nth-child(4) {
border: none;
color: #eee;
font-size: 10px;
font-weight: bold;
top: 54px;
letter-spacing: 1px;}

.navToggle.active span:nth-child(1) {
top: 18px;
left: 7px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);}

.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
top: 18px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);}

#mainNav {
margin: 1% auto;
width: 1000px;
overflow: hidden;}

#mainNav ul{
width: 783px;
float: right;
overflow: hidden;}

#mainNav li{
float: left;
width: 156px;
padding: 2% 0;}

.nav_logo {
width: 17%;
padding-top: 1em;}

.navTTL {
font-family: 'Marcellus', serif!important;
color: #746953;
font-weight: bold;
font-size: 130%;
text-align: center;
display: block;
margin-top: 4%;}

#mainNav li,
#mainNav li::before,
#mainNav li::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;}

#mainNav li:hover{
letter-spacing: 4px;
background: #f1f1f1;
text-indent: 4px;}

.mainnav_Sub {
color: #ce0000;
font-weight: bold;
font-size: 80%;
display: block;
text-align: center;}

.spNav_sub {
display: block;
font-size: 65%;}

.nav_logo_sp {width: 140px; margin: 14px 0;}

/*under1200----------------------------*/
@media screen and (max-width : 1200px) {
#mainNav {width: 750px;}
#mainNav ul{width: 567px;}
#mainNav li{width: 113px;}
.navTTL {font-size: 110%; margin-top: 4%;}
.nav_logo {padding-top: .9em;}
}


/*▼greeting area--------------------*/
#greeting {
margin: 4% auto;
width: 90%;
max-width: 1000px}

#greeting p{
font-size: 120%;
letter-spacing: 4px;
line-height: 35px;
text-align: center;
margin: 4% 0 6%;
font-family: 'Noto Serif JP', serif;
transform: rotate(0.001deg);}

.aisatu_logo {
max-width: 320px;
width: 70%;
margin-top: 5%;}

.kazariwaku {
max-width: 420px;
width: 70%;}

/*under1200----------------------------*/
@media screen and (max-width : 1200px) {
#greeting {margin: 5% auto;}
#greeting p{font-size: 100%; line-height: 30px;}
.aisatu_logo {max-width: 250px;}
.kazariwaku {max-width: 320px;}
}

/*under800----------------------------*/
@media screen and (max-width : 800px) {
#greeting {margin: 10% auto;}

#greeting p{
font-size: 90%;
letter-spacing: 1px;
line-height: 20px;
margin-top: 5%;}
}


/*▼area1--------------------*/
#area1 {
overflow: hidden;}

.boxLeft {
float: left;
background: #d5cbc2;}

.boxRight {
float: left;
background: #e0e0e0;}

.boxLeft, .boxRight {
width: 50%;
height: 300px;
padding: 40px 0 290px;}

.boxIn {
height: 170px;}

.boxIn p{
text-align: center;
font-size: 85%;
color: #5b4a38;
letter-spacing: 4px;
margin: 0 0 30px;}

.box_inTTL {
font-size: 25px!important;
font-family: 'Marcellus', serif!important;
transform: rotate(0.001deg);
margin-bottom: 0!important;}

.text_a,  .subtext_a{
font-size: 90%;
display: block;
text-align: center;
letter-spacing: 5px;
line-height: 25px;
color: #5b4a38;}

/*under1200----------------------------*/
@media screen and (max-width : 1200px) {
.boxLeft, .boxRight {padding: 40px 0 250px;}
.boxIn p{font-size: 80%;}
.text_a {letter-spacing: 2px;}
.box_inTTL {font-size: 22px!important;}
}

/*under800----------------------------*/
@media screen and (max-width : 800px) {
.boxLeft, .boxRight {
width: 100%;
float: none;
height: auto;
padding: 20px 0 30px;}

.boxIn {height: auto; margin-bottom: 20px;}
.boxIn p{font-size: 85%; letter-spacing: 2px; margin: 0 0 20px;}

.text_a {
font-size: 85%;
letter-spacing: 2px;
line-height: 20px;
margin-bottom: 40px;}

.subtext_a {
font-size: 85%;
letter-spacing: 2px;
line-height: 20px;}
}


/*▼examplearea--------------------*/
.example {
background: #FAF7F2;
text-align: center;
height: 300px;
padding: 40px 0 290px;}

.ex_mgn {margin-top: 55px;}

/*under1200----------------------------*/
@media screen and (max-width : 1200px) {
.example {
padding: 40px 0 250px;}

.ex_mgn {margin-top: 38px;}
}

/*under800----------------------------*/
@media screen and (max-width : 800px) {
.example {height: auto; padding: 20px 0 15px;}
.ex_mgn {margin-top: 0;}
}


/*▼photoarea--------------------*/
#photo {
width: 95%;
max-width: 1000px;
margin: 8% auto;}

#photo ul{overflow: hidden;}

#photo li{
float: left;
width: 23%;
margin: 1%;}

#photo img{vertical-align: bottom;}

/*under800----------------------------*/
@media screen and (max-width : 800px) {
#photo {margin: 4% auto;}
#photo li{width: 46%; margin: 2%;}
}


/*▼footer--------------------*/
footer {overflow: hidden;}

.box2Left {
float: left;
background: #efe9e3;
padding: 40px 0 290px;}

.box2Right {
float: left;}

.box2Left, .box2Right {
width: 50%;
height: 410px;}

.box2In {
margin-bottom: 35px;}

address, .box2In p{
font-size: 90%;
text-align: center;
letter-spacing: 1px;
margin: 4px 0;
font-style: normal;}

.foot_logo {
width: 200px;
margin: 7px 0 20px;}

.tel {
font-size: 110%!important;
font-weight: bold;
padding: 5px 0;}

/*under800----------------------------*/
@media screen and (max-width : 800px) {
address, .box2In p{
font-size: 85%;
letter-spacing: 0;}

.box2Left {
width: 100%;
float: none;
height: auto;}

.box2Right {
width: 100%;
float: none;
height: 220px;
overflow: hidden;}

.box2Left {padding: 30px 0 40px;}

.foot_logo {
width: 150px;
margin: 7px 0 20px;}
}


/*▼menu page--------------------*/
#menu_contents {
width: 90%;
max-width: 800px;
margin: 0 auto 120px;}

.pricetable {
width: 100%;
margin-bottom: 8%;}

.pricetable3 {
width: 100%;}

.pricetable tr, .pricetable3 tr {
border-bottom: 1px dashed #c2bab4;}

.pricetable td, .pricetable3 td {
font-size: 90%;
padding: 12px 0 8px;}

.tdright {text-align: right;}

.pricetable2 {
width: 100%;
margin-bottom: 8%;}

.pricetable2 tr{
border-bottom: 1px dashed #c2bab4;}

.pricetable2 td{
font-size: 110%;
padding: 12px 0 8px;}

.cen {text-align: center;}

.menuTTL_img {
max-width: 550px;
margin: 6% 0 3%;}

.price_ttl {
vertical-align: middle;
font-size: 160%;
font-weight: bold;
color: #a70606;}

.price_ttl_sub {
font-size: 120%;
font-weight: bold;
display: block;
margin-bottom: 10px;}


.menu_title {
	margin-bottom: 50px;
	background-color: #f7f4f1;
	padding: 40px 0!important;
	border-radius: 30px;
}

.menu_title img {
	width: 500px;
	margin: 0 auto;
	display: block;
}

.menu_info {
	text-align: center;
	margin: 0 0 30px 0;
}

/*under1200----------------------------*/
@media screen and (max-width : 1200px) {
#menu_contents {max-width: 700px;}
.menuTTL_img {max-width: 400px; margin: 8% 0 3%;}
.price_ttl {font-size: 130%;}
.price_ttl_sub {font-size: 110%;}
.pricetable td, .pricetable2 td{font-size: 100%;}
}

/*under800----------------------------*/
@media screen and (max-width : 800px) {
#menu_contents {margin: 0 auto 50px;}
.menuTTL_img {width: 100%; margin: 10% 0 3%;}
.price_ttl {font-size: 120%;}
.pricetable {margin-bottom: 10px;}
.pricetable td, .pricetable2 td{padding: 10px 0 8px; font-size: 90%;}
.pricetable_sp {width: 100%;}
.pricetable_sp tr{border-bottom: 1px dashed #c2bab4;}
.pricetable_sp td{font-size: 90%; padding: 10px 0 8px;}
.price_ttl_sub {font-size: 100%;}


.menu_title {
	margin-bottom: 20px;
	padding: 20px 0!important;
	border-radius: 10px;
}

.menu_title img {
	width: 100%;
	max-width: 400px;
}

.menu_info {
	font-size: 90%;
	margin: 0 0 30px 0;
	padding-top: 20px;
}



}


/*▼contact page--------------------*/
#formWrap {
width: 90%;
max-width: 700px;
font-size: 100%;
height: auto;
margin: 100px auto;}

input#formbutton {
-webkit-appearance: none;
width: 110px;
height: 40px;
margin: 0 5px;
background: rgba(239,239,239,0.7);
border: 1px solid #ccc;
color: #968772;
border-radius: 6px;
font-size: 110%;
letter-spacing: 2px;
text-indent: 2px;
text-align: center;
transition: .2s;
font-family: 'M PLUS Rounded 1c', sans-serif;
transform: rotate(0.001deg);}

#formbutton:hover {
background-color: #baaf9f;
color: white;
border:1px solid #baaf9f;}

.input_area {
width:100%;
border: 1px solid #ccc;
height: 35px;
padding: 10px;
margin: 5px 0 20px;}

.input_area2 {
width:100%;
border: 1px solid #ccc;
padding: 10px;}

/*under800------------------------- */
@media screen and (max-width : 800px) {
#formWrap {margin: 50px auto; font-size: 90%;}
}



/*▼other--------------------*/
.line_img {width: 150px;}

.title {cursor: pointer;
border-bottom: 1px dotted #ccc;
margin-top: 20px;
padding-bottom: 5px}

.chusyajo {max-width: 500px; width: 100%;}
.col {background: #edebe7;}
.bor {border-bottom: 1px solid #edebe7;}
.mgn {margin-top: 10%;}
.mgn2 {margin: 0 0 1%;}
.mgn3 {margin-bottom: 5%;}
.mgn4 {margin-bottom: 6%;}
.pc-mgn {margin-bottom: 50px;}
.menu-subtext {margin: -30px 0 30px;}

#contents, #contents_sp {
width: 90%;
max-width: 900px;
margin: 80px auto;}

#contents h2 img, #contents_sp h2 img, #menu_contents h2 img{
width: 17px;
vertical-align: middle;
margin-right: 10px;}

.text_b {
font-weight: bold;
font-size: 140%;
vertical-align: middle;}

.text_b1 {
font-weight: bold;
font-size: 180%;
vertical-align: middle;
font-family: 'Noto Serif JP', serif;
transform: rotate(0.001deg);}

.text_c {
font-weight: bold;
display: inline-block;
border-bottom: 1px solid #ccc;
margin-bottom: 10px;}

.text_d {
font-size: 100%;
padding: 0 10px;}

.text_e {
font-size: 90%;
display: inlin-block;
font-weight: bold;}

.text_f {
font-size: 90%;
margin-top: -50px;}

#contents h2, #contents_sp h2{
margin-bottom: 10px;}

#contents h3{
font-size: 110%;
letter-spacing: 1px;
margin-bottom: 8%;}

.guide_ttlwrap {
background: #d5cbc2;
padding: 30px 0;}

.menu_ttlwrap {
background: #e0e0e0;
padding: 30px 0;}

.contact_ttlwrap {
background: #efe9e3;
padding: 30px 0;}

.subpageTTL {
letter-spacing: 4px;
test-indent: 4px;
text-align: center;
font-size: 25px!important;
font-family: 'Marcellus', serif!important;
transform: rotate(0.001deg);
margin-bottom: 0!important;}

.guide_ttlwrap p, .menu_ttlwrap p, .contact_ttlwrap p{
text-align: center;
margin: 0 0 20px;
font-size: 85%;
color: #5b4a38;
letter-spacing: 4px;
text-indent: 4px;}

.guide_mgn {
margin-bottom: 50px;
}

.topbuck {
position: fixed;
bottom: 18px;
right: 18px;
color: #a59472;}

.copy {
padding: 10px 0;
font-size: 85%;
text-align: center;
letter-spacing: 1px;
background: #c6b9ac;
border: 1px solid #c6b9ac;
overflow: hidden;}

a.moji_l {
border: 0px solid #a59a90;
width: 220px;
padding: 15px 0;
margin: 20px auto 0;
font-weight: bold;
background-color: #a59a90;
letter-spacing: 6px;
text-indent: 6px;
color: #fff;
transition: background-color .3s;
display: block;
font-family: 'M PLUS Rounded 1c', sans-serif;
transform: rotate(0.001deg);}

a.moji_l:hover {color: #a59a90; background-color: #fff;}


/*under1200----------------------------*/
@media screen and (max-width : 1200px) {
.copy {font-size: 75%;}
a.moji_l {margin: 0 auto;}
#contents {max-width: 700px;}
#contents h3{font-size: 100%;}
.text_b {margin-left: 5px;}
.text_b1 {font-size: 150%;}
#contents h2 img{margin-right: 2px; width: 13px;}
#menu_contents h2 img{margin-right: 6px; width: 13px;}
.text_f {margin-top: -45px;}
}


/*under800----------------------------*/
@media screen and (max-width : 800px) {
body, text {font-size: 80%;}
.copy {font-size: 60%; letter-spacing: 1px;}
a.moji_l {border: 0px solid #948a80; width: 170px; padding: 10px 0;}
guide_ttlwrap {padding: 10px 0 13px;}
#contents, #contents_sp {margin: 40px auto;}
#contents h3{margin-bottom: 13%;}
#contents h2 img, #contents_sp h2 img{margin-right: 0;}
.text_b {font-size: 120%; margin-bottom: 10px;}
.text_b1 {font-size: 130%; margin-bottom: 10px;}
.text_d {font-size: 85%;}
.text_f {margin-top: 0; font-size: 80%;}
#contents, .pricetable2, .pc, #mainNav {display: none;}
.mgn2 {margin: 10% 0 1%;}
.mgn3 {margin: 10% 0 5%;}
.mgn4 {margin: 10% 0 6%;}
.sp-mgn {margin-top: 30px;}
.pc-mgn {margin-bottom: 0;}
.sp_logo {width: 142px; margin: 14px auto 13px;}
}


/*over800----------------------------*/
@media screen and (min-width : 801px) {
#contents_sp, .sp_logo, .price_sp, .nav_logo_sp, .sp, .navToggle, .globalMenuSp {display: none;}
}


