@charset "utf-8";
/*----------------
[1]common
[2]headerContainer
[3]sideContainer
[4]footerContainer
[5]Container
[6]topContainer
[7]subContainer
[8]other
------------------ */

/* **********************************************************************************************
[1]common
************************************************************************************************ */
html{
	margin: 0;
	padding: 0;
}
body{
	line-height: 1.5;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	font-size: 15px;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	color: #000;
	letter-spacing: 0.5px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
	min-width: 940px;
}
header {
	width: 100%;
	height: 100vh;
	z-index: 99999999997;
	position: relative;
	top: 0px;
	left: 0;
}


#trns{
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 99999999999999;
	background-image: url(images/logo.webp);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 160px 60px;
	background-color: #2d364b;
}
#wrapper {
	width: 100%;
	position: relative;
	overflow: hidden;
}

/* clear
----------------------------------------------- */
.clear { clear: both; }
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix { min-height: 1px; }
* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* a
----------------------------------------------- */
a,a:link { text-decoration: none; }
a img, img {
	border: none;
	line-height: normal;
	vertical-align: top;
}

/* img
----------------------------------------------- */
img{
    max-width: 100%;
    height: auto;
    width /***/:auto;
}
.imgText {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.object-fit-img {
	object-fit: cover;
	object-position: 50% 50%;
	font-family: 'object-fit: cover; object-position: 50% 50%;'
}

/* slide
----------------------------------------------- */
#topContent,
.top000 {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	background-image: url(images/bg-wood.jpg);
	background-repeat: repeat;
	background-size: ;
	background-position: left top;
}

#topContent2 {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
}

.firstView {
	position: absolute;
	width: 100%;
	top:0;
	left:0;
}

#topContent2 .firstView{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}


.scroll {
	position: absolute;
	bottom: 10px;
	left: 50%;
	color: #fff;
	width: 90px;
	height: 90px;
	margin-left: -45px;
	font-size: 14px;
	z-index: 99999999999;
	text-align: center;
	font-family: 'Lora', serif;
}
.scroll a{
	color: #fff;
	position: relative;
	width: 90px;
	height: 90px;
	display: block;
	box-sizing: border-box;
}
.scroll a:after {
	position: absolute;
	background-color: #FFF;
	width: 1px;
	height: 30px;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: 25px;
	content: "";
	transition:bottom .3s,height .3s;
}
.scroll a:hover:after{
	 bottom: 0px;
	 height: 55px;
	 transition:bottom .3s,height .3s;
}


/* **********************************************************************************************
[2]headerContainer
************************************************************************************************ */

.headerMain {
	position: absolute;
	width: 100%;
	height: 100vh;
	top:50%;
	left: 50%;
	margin-left: -50%;
	margin-top: -50vh;
}

header h1 {
	position: relative;
	width: 100%;
	height: 100vh;
	top:0;
	left:0;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: top .3s;
}
header h1 a {
	display: block;
	background-repeat: no-repeat;
	background-position: left top;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	width: 472px;
	height: 731px;
	background-size: 75% auto;
	margin: 0 auto 0;
	box-sizing: border-box;
	background-image: url(images/topiamges_03plus.png);
	background-position: center center;
	transition: opacity .3s,width .3s,height .3s,background-image .3s;
}

#topContent2 .headerMain {
	position: absolute;
	width: 100%;
	height: 100vh;
	top:0;
	left: 0;
	margin-left: 0;
	margin-top: 0;

}

#topContent2 h1 {
	position: absolute;
	width: 239px;
	height: 308px;
	top:50%;
	left:50%;
	display: block;
	align-items: inherit;
	justify-content: inherit;
	margin-top: -250px;
	margin-left: -119.5px;
	text-align: center;
	transition: top .3s;
}
#topContent2 h1 a {
	display: block;
	background-repeat: no-repeat;
	background-position: left top;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	width: 239px;
	height: 308px;
	background-size: cover;
	margin: 0 auto 0;
	box-sizing: border-box;
	background-image: url(images/firstviewTtl.png);
	background-position: center center;
	transition: opacity .3s,width .3s,height .3s,background-image .3s;
}

.shoplist {
	position: absolute;
	bottom: calc(10% + 30px);
	left: 50%;
	width: 700px;
	margin-left: -350px;
	text-align: center;
}

.shoplist li{ display: inline-block; margin: 3px 1px;}
.shoplist li a{
  display: block;
  margin: auto;
  padding: 10px;
  font-weight: 700;
  box-sizing: border-box;
  font-family: sans-serif;
  font-size: 16px;
  text-decoration: none;
  text-shadow:
    -2px 4px 4px #091243,
    0 0 10px #00D0FF,
    inset 1px 1px 1px white;
  color: #0ae4fe;
  border: 1.5px solid;
  border-radius: 4px;
  background-color: rgba(0,0,0,0.60);
  box-shadow:
    2px 4px 3px rgba(1,118,140, 0.3),
    0 0 7px 2px rgba(0,208,255, 0.6),
    inset 2px 4px 3px rgba(1,118,140, 0.3),
    inset 0 0 7px 2px rgba(0,208,255, 0.6);
}

/* **********************************************************************************************
[3]priceContainer
************************************************************************************************ */

.priceMain {margin-top:1px;}

.priceMain {
	padding: 80px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	width: 100%;
	color: #FFF;
	font-weight: 700;

}

.subPtxt {font-size: 35px; text-shadow: #0ae4fe 1px 1px 5px, #0ae4fe -1px 1px 5px, #0ae4fe 1px -1px 5px, #0ae4fe -1px -1px 5px;}
.subPtxt span{font-size: 50px;}

.yellowtxt{text-shadow: #fefc0aa8 1px 1px 5px, #fefc0aa8 -1px 1px 5px, #fefc0aa8 1px -1px 5px, #fefc0aa8 -1px -1px 5px;}
span.largetxt{font-size:60px;}

.mainPtxt {margin-bottom: 30px;}
.mainPtxt dt,
.mainPtxt dd {display: inline-block; text-shadow: #0ae4fe 1px 1px 5px, #0ae4fe -1px 1px 5px, #0ae4fe 1px -1px 5px, #0ae4fe -1px -1px 5px;}

.mainPtxt1 {font-size: 54px; line-height: 1.0;}
.mainPtxt1 span{font-size: 85px; display: block;}

.mainPtxt2 {font-size: 168px; line-height: 1.0;}
.mainPtxt2 span{font-size: 100px;}

.mainPtxt3 {font-size: 98px; line-height: 1.0;}
.mainPtxt3 span{font-size: 28px; display: block;}




/* **********************************************************************************************
[4]footerContainer
************************************************************************************************ */
footer {
	position: relative;
	width: 100%;
	padding: 80px 80px;
	box-sizing:  border-box;
	color: #fff;
	background-image: url(images/bg-footer.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}


.footerCompany { box-sizing: border-box; text-align: center; margin-bottom: 40px;}
.footerCompany h2 {
width: 200px;
height: 75px;
margin: 0px auto 0;
box-sizing: border-box;
}


/* copyright
----------------------------------------------- */
.copyright {
	font-size: 10px;
	text-align: center;
	padding: 10px 0;
	position: relative;
	box-sizing: border-box;
	font-family: 'Ubuntu', sans-serif;
	color: #fff;
}

/* pageTop
----------------------------------------------- */
#pageTop {
	position: fixed;
	bottom: 10px;
	right: 22px;
	color: #FFF;
	width: 48px;
	height: 48px;
	text-align: center;
	font-size: 10px;
	z-index: 999999999;
}
#pageTop a{
	color: #fff;
	position: relative;
	width: 48px;
	height: 48px;
	display: block;
	box-sizing: border-box;
	font-family: 'Lora', serif;
	border-radius: 50%;
	padding-top: 20px;
	border: 1px solid #fff;
	line-height: 1.1;
}
#pageTop a:after {
	position: absolute;
	width: 8px;
	height: 8px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 10px;
	left: 0;
	right: 0;
	margin: 0 auto;
	content: "";
	transition: top .3s;
}

#pageTop a:hover:after {
	top: 7px;
	transition: top .3s;
}



/* **********************************************************************************************
[5]Container
************************************************************************************************ */
#container {
	width: 100%;
	box-sizing: border-box;
	padding: 0;
	position: relative;
	z-index:99999999;

}

#container section{position: relative;}

/* Ttl
----------------------------------------------- */

.mainTtl {
	position: relative;
	margin-bottom: 40px;
	text-align: center;
}

.mainTtl .mainTtlBg {
	display: inline-block;
	position: relative;
	font-size: 50px;
	font-weight: 900;
	line-height: 1.0;
}


.mainTtl .ttlen {
	display: block;
	font-size: 25px;
	font-weight: 300;
	font-family: 'Ubuntu', sans-serif;
	opacity: 0.5;
	letter-spacing: 5px;
}

.mainTtl .mainTtlBg:after,
.mainTtl .mainTtlBg:before {
	position: absolute;
	top:0;
	bottom:0;
	margin: auto;
	font-size: 65px;
	font-weight: 100;
}

.mainTtl .mainTtlBg:before {
	left:-60px;
	content:"[";
}

.mainTtl .mainTtlBg:after {
	content:"]";
	right:-60px;
}

/* Btn
----------------------------------------------- */

.mainBtn {
	margin: 80px auto;
	text-align: center;
}

.mainBtn li {display: inline-block; padding: 0 5px; box-sizing: border-box;}

.mainBtn li a,
.shopBtn a {
  display: block;
  margin: auto;
  padding: 20px 70px 20px 50px;
  box-sizing: border-box;
  font-family: sans-serif;
  font-size: 25px;
  text-decoration: none;
  text-shadow:
    -2px 4px 4px #091243,
    0 0 10px #00D0FF,
    inset 1px 1px 1px white;
  color: #0ae4fe;
  border: 2px solid;
  border-radius: 4px;
  background-color: rgba(0,0,0,0.15);
  box-shadow:
    2px 4px 3px rgba(1,118,140, 0.3),
    0 0 7px 2px rgba(0,208,255, 0.6),
    inset 2px 4px 3px rgba(1,118,140, 0.3),
    inset 0 0 7px 2px rgba(0,208,255, 0.6);
  animation: flickering 5s infinite;
}

.staffBtn a {
  display: block;
  margin: 60px 30% 0px 30%;
  padding: 20px 70px 20px 50px;
  box-sizing: border-box;
  font-family: sans-serif;
  font-size: 25px;
  color: #fff;
  border: 2px solid;
  border-radius: 4px;
  background-color: rgba(0,0,0,0.15);
}

.mainBtn.mainBtn2 li a {
  display: block;
  margin: auto;
  padding: 20px 70px 20px 50px;
  box-sizing: border-box;
  font-family: sans-serif;
  font-size: 25px;
  text-decoration: none;
  text-shadow:none;;
  color: #fff;
  border: none;
  border-radius: 4px;
  background-color: #dc993a;
  box-shadow: none;
  animation: inherit;
  font-weight: 700;
}



.mainBtn li a:hover,
.shopBtn a:hover,
.shoplist li a:hover {
  background-color: rgba(255,255,255,0.15);
  text-shadow:
    -2px 4px 4px #000000,
    0 0 10px #000000,
    inset 1px 1px 1px #000000;
}

.mainBtn.mainBtn2 li a:hover {
  background-color: #fbb450;
  text-shadow:none;
}

.mainBtn li span,
.shopBtn span {position: relative;}
.mainBtn li span:after,
.shopBtn span:after {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
	right: -20px;
	width: 10px;
	height: 10px;
	border-top: 3px solid #0ae4fe;
	border-right: 3px solid #0ae4fe;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.mainBtn.mainBtn2 li span:after {
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;
}

@keyframes flickering {
  0% {
    border-color: transparent;
    opacity: 0.2;
  }

  2% {
    border-color: #0ae4fe;
    opacity: 1;
  }

  4% {
    border-color: transparent;
    opacity: 0.2;
  }

  8% {
    border-color: #0ae4fe;
    opacity: 1;
  }

  28% {
    border-color: #0ae4fe;
    opacity: 1;
  }

  30% {
    border-color: transparent;
    opacity: 0.2;
  }

  36% {
    border-color: #0ae4fe;
    opacity: 1;
  }

  100% {
    border-color: #0ae4fe;
    opacity: 1;
  }
}


/* **********************************************************************************************
[6]Container
************************************************************************************************ */

/* common
---------------------------------------------- */
.commonText {font-size: 18px; margin-bottom: 30px; font-weight: 500; position: relative;}

.conceptBg {
	position: absolute;
	width: 100%;
	opacity: 0.15;
	top:-80px;
	left:0;
}

.top000,
.top003 {color: #fff; text-align: center;}

.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
  max-width: 1250px;
  margin: 0 auto;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}



.listTxt li{
	float: left;
	width: 33.333%;
	overflow: hidden;
	position: relative;
	box-sizing: border-box;
}

.listTxt figure {
	position: relative;
	width: 100%;
}

.listTxt li dl {
	position: absolute;
	top: 50%;
	left:50%;
	height: 252px;
	width: 260px;
	margin-left: -130px;
	margin-top: -126px;
	/* padding: 30px;
	box-sizing: border-box; */
}

.listTxt li dt {
	font-size: 25px;
	font-weight: 700;
	margin-bottom: 40px;
	text-shadow: #0ae4fe 1px 1px 5px, #0ae4fe -1px 1px 5px, #0ae4fe 1px -1px 5px, #0ae4fe -1px -1px 5px;
	line-height: 1.1;
}

.listTxt.listTxt2 li dt {
	text-shadow: #c32ffc 1px 1px 5px, #c32ffc -1px 1px 5px, #c32ffc 1px -1px 5px, #c32ffc -1px -1px 5px;
}


.listTxt li:nth-of-type(1) dt {padding-top: 30px; box-sizing: border-box;}
.listTxt li:nth-of-type(3) dt {padding-top: 20px; box-sizing: border-box;}

.listTxt.listTxt2 li:nth-of-type(1) dt {padding-top: 0px; box-sizing: border-box;}
.listTxt.listTxt2 li:nth-of-type(3) dt {padding-top: 0px; box-sizing: border-box;}



.listTxt li dd {
	font-size: 16px;
	font-weight: 500;
	text-align: left;
}

/* ------------------002----------------------- */
.top002 {
background-color: #2d364b;
text-align: center;
color: #FFF;
line-height: 1.1;
width: 100%;
font-weight: 700;
}

.top002 h3 {
	position: absolute;
	top: -50px;
	left:0;
	font-size: 55px;
	font-weight: 700;
	text-shadow: #0ae4fe 1px 1px 6px, #0ae4fe -1px 1px 6px, #0ae4fe 1px -1px 6px, #0ae4fe -1px -1px 6px;
	transform: rotate( -4deg );
	width: 100%;
}

.staffBox {
	margin-top: 80px;
}

.staffBox li {
	float: left;
	width: 20%;
}

.staffBox li:nth-of-type(7) {
	float: left;
	width: 60%;
}
.staffBox li:nth-of-type(9),
.staffBox li:nth-of-type(6) {
	clear: both;
}
/* ------------------003----------------------- */
.top003 {background-color: #2d364b;}

.dartsBg {
	position: absolute;
	top:0;
	left:0;
	width: 100%;

}

.top003 h3 {
	position: relative;
	top: 20px;
	left:0;
	font-size: 55px;
	font-weight: 700;
	text-shadow: #c32ffc 1px 1px 6px, #c32ffc -1px 1px 6px, #c32ffc 1px -1px 6px, #c32ffc -1px -1px 6px;
	width: 100%;
	margin-bottom: 60px;
	line-height: 1.1;
}

.listTxt.listTxt2 {
background-image: url(images/bg-paper.jpg);
}

/* ------------------004----------------------- */
.top004 {
background-image: url(images/bg-paper.jpg);
background-repeat: repeat;
color: #603e0c;
border-bottom: 1px solid #FFF;
}

.top004 .mainTtl .ttlen {color: #FFF; opacity:1.0;}
.foodBg {
font-size: 15vw;
font-weight: 900;
opacity:0.5;
position: absolute;
top: 80px;
left:0;
width: 100%;
text-align: center;
color: #FFF;
}

.foodmenu {
	position: relative;
	margin-bottom: 3px;
}

.foodmenuImg {
	width: 60%;
	padding-top: 40%;
	float: left;
	position: relative;
	overflow: hidden;
}

.foodPrice {
	width: 40%;
	float: left;
}
.foodPrice div {
position: absolute;
bottom:0;
right:0;
width: 40%;

}
.foodmenu2 .foodmenuImg {
	float: right;
}
.foodmenu2 .foodPrice div {
right:inherit;
bottom:inherit;
left:0;
top:0;
}


.foodmenuImg2 {
	float: left;
	width: calc(50% - 3px);
	padding-top: 37.5%;
	position: relative;
	overflow: hidden;
	margin-left: 3px;
	box-sizing: border-box;
}

.foodmenu2 .foodmenuImg2 {
	margin-left: 0;
	margin-right: 3px;
	box-sizing: border-box;
}

.foodPrice ul {padding: 0 30px; box-sizing: border-box;}
.foodPrice ul li:first-child {border-top: 1px solid #603e0c;}
.foodPrice ul li {padding: 15px 0; box-sizing: border-box; border-bottom: 1px solid #603e0c;}
.foodPrice ul li span {
	display: inline-block;
	float: right;
}

.foodmenu2 .foodPrice ul {padding-top: 45%;}

.voicesubTtl,
.instTtl {text-align: center;}

.voicesubTtl span {
	display: inline-block;
	font-size: 25px;
	font-weight:700;
	position: relative;
	z-index:999;
}

.voicesubTtl span img {
width: 40px;
}

.voicesubTtl span:before {
	position: absolute;
	height: 10px;
	width: calc(100% - 90px);
	background-color: #ffcf00;
	content:"";
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	z-index:1;

}

.instTtl {font-size: 50px; font-weight: 900; margin-bottom: 40px; }
.instTtl span {position: relative; display: inline-block;}

.instTtl span:after {
position: absolute;
background-image: url(images/ttl-voice.png);
background-size: cover;
background-repeat: no-repeat;
width: 250px;
height: 20px;
bottom:-15px;
left:0;
right:0;
margin:auto;
content:"";
}

.voiceBox li{float: left; width: 33.333%; padding: 0 20px; box-sizing: border-box;}
.voiceBox li div {
	border: 2px solid #000;
	padding: 30px;
	box-sizing: border-box;
	position: relative;
}

.voiceBox li span{
	position: absolute;
	background-color: rgba(255,207,0,0.12);
	top: 15px;
	left: 15px;
	display: block;
	width: 100%;
	height: 100%;
}


.voiceBox li div:before,
.voiceBox li div:after {
	position: absolute;
	content:"";
	width: 38px;
	height: 38px;
	background-repeat: no-repeat;
	background-size: 33px 27px;
	background-position: center center;
	background-color: #FFF;
}
.voiceBox li div:before {
	background-image: url(images/bg-voice001.jpg);
	left:-15px;
	top:-15px;
}
.voiceBox li div:after {
	background-image: url(images/bg-voice002.jpg);
	right:-15px;
	bottom:-15px;
}

.name {
	position: absolute;
	bottom:0;
	right:0;
	padding: 30px;
	box-sizing: border-box;

}

.voice {margin-bottom: 60px; line-height: 1.8; font-weight: 500;}
.top006 {
background-color: #2d364b;
text-align: center;
color: #FFF;
line-height: 1.1;
width: 100%;
font-weight: 700;
}

.top006 h3 {
	font-size: 50px;
	font-weight: 900;
	margin-bottom: 40px;
}

.top006 p {font-size: 16px;}
.top006 p.telephone span,
.top006 p.telephone a {font-size: 35px; }
.top006 #map,
.top006 #loading {color: #000;}
.shopBtn {text-align: center; margin: 30px auto 0px; width: 500px;}

.ggmap {
	position: relative;
	width: 100%;
	padding-top: 30%;
	height: 0;
	overflow: hidden;
}

.ggmap iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.shoptel dt{font-size: 30px;}
.shoptel dt span{display: inline-block; position: relative;}
.shoptel dt span:before,
.shoptel dt span:after {
	position: absolute;
	height: 1px;
	width: 80px;
	background-color: #FFF;
	content:"";
	top:0;
	bottom:0;
	margin: auto 0;
}
.shoptel dt span:before {left:-100px;}
.shoptel dt span:after {right:-100px;}
.shoptel dd{font-size: 70px; font-weight: 900;}

.snsBtn {display:none; margin: 40px auto 0; text-align: center;}
.snsBtn li {display: inline-block; padding: 1px; box-sizing: border-box;}
.snsBtn li img {width: 40px;}

.mainBtn.mainBtn2 {margin-bottom: 0;}

/*youtubeで再生*/
.p-ams__yt {
  position: relative;
  z-index: 0;
	  width: 100%;
  aspect-ratio: 16 / 9;
  max-width: 1250px;
}
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
}
.overlay {
  z-index: -1;
  transform:translate3d(0,0,0);
}
.p-ams__yt iframe {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -2;
  width: 100% ;
  height: 100% ;
}

/*----------007採用------------*/
.top007 {
background-color: #d78e33;
text-align: center;
color: #FFF;
line-height: 1.1;
width: 100%;
font-weight: 700;
}

.top007 h3 {
	position: relative;
	top: 0px;
	left:0;
	font-size: 55px;
	font-weight: 700;
	color:#fff;
	line-height: 150%;
	/*
	text-shadow: #0ae4fe 1px 1px 6px, #0ae4fe -1px 1px 6px, #0ae4fe 1px -1px 6px, #0ae4fe -1px -1px 6px;
	*/
	transform: rotate( -4deg );
	width: 100%;
}

/*end*/
#gmap_info_window{
  text-align: center;
  font-size:16px;
  font-weight: bold;
}
.blink {
    color: red;
    animation: blinker 1s linear infinite;
  }

  @keyframes blinker {
    50% {
      opacity: 0;
    }
  }

#map {
        margin:auto;
        height: 50vh;
        width: 100%;
        position: relative;
        overflow: hidden;
    }

.shopBtn2 {text-align: center; margin: 10px auto 0px;}


.shopBtn2 a {
	display: block;
	background-color: #0ae4fe;
	color: #FFF;
	font-size: 20px;
	font-weight: 900;
	padding: 10px 30px;
	box-sizing: border-box;
	border-radius: 5px;
}
/* **********************************************************************************************
[7]other
************************************************************************************************ */
/* common
----------------------------------------------- */

.foodmenuImg img,
.foodmenuImg2 img,
#topContent2 .firstView img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.firstView img {width: 100%;}

header h1 a:hover,
footer h2 a:hover,
.shopBtn2 a:hover {opacity:0.9; filter: alpha(opacity=90); -ms-filter: "alpha( opacity=90 )";}



/* **********************************************************************************************
[3]sideContainer
************************************************************************************************ */

/* btn
----------------------------------------------- */



/* font
----------------------------------------------- */
.f10 { font-size: 10px; }
.f11 { font-size: 11px; }
.f12 { font-size: 12px; }
.txtC,.alignC { text-align: center; }
.txtR,.alignR { text-align: right; }
.txtL,.alignL { text-align: left; }
a.txtD { text-decoration: underline; color: #000; }

.box10 {
	width: 100%;
	margin: 0 auto;
	padding: 80px;
	box-sizing: border-box;
	position: relative;
}

.box10T {
	width: 100%;
	padding: 0 80px 80px;
	box-sizing: border-box;
	position: relative;
}
.posiR { position: relative; }

.notoserifjp {font-family: 'Noto Serif JP', serif;}
.lora {font-family: 'Lora', serif;}
.notosansjp {font-family: 'Noto Sans JP', sans-serif;}
.asap {font-family: 'Asap', sans-serif;}
.ubuntu {font-family: 'Ubuntu', sans-serif;}


:hover { transition:background-color .3s, color .3s, opacity .3s;}
.pcno,
.pcno2 { display: none; }



@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -10%, 0);
    transform: translate3d(0, -10%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -10%, 0);
    transform: translate3d(0, -10%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-10%, 0, 0);
    transform: translate3d(-10%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-10%, 0, 0);
    transform: translate3d(-10%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(10%, 0, 0);
    transform: translate3d(10%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(10%, 0, 0);
    transform: translate3d(10%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}