@charset "utf-8";

/* Ajidokoro Mimatsu Website */
/* home.css */

/*
===================================================
	ブラウザサイズ順応
===================================================
*/

body,
html,
#wrapper {
	height: 100%;
	overflow-y: hidden;
}


/*
===================================================
	gateArea
===================================================
*/

#gateArea {
	height: 100%;
	width: 100%;
}
#gateArea h1 {
	height: 300px;
	width: 300px;
	z-index: 100;
	display: none;
}
#gateArea #bEhoumaki {
	position: absolute;
	left: 20px;
	bottom: 35px;
	z-index: 100;
	/*box-shadow: 1px 1px 4px rgba(0,0,0,0.25);
	-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.25);
	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.25);
	-o-box-shadow: 1px 1px 4px rgba(0,0,0,0.5);
	-ms-box-shadow: 1px 1px 4px rgba(0,0,0,0.25);*/
	display: none; /* jQueryで表示させるため */
}
#gateArea #jitan {
	position: absolute;
	z-index: 101;
}
#gateArea #kouji{	
	position: absolute;
	z-index: 101;
}
#gateArea #obon {
	position: absolute;
	top: 20px;
	left: 20px;
	z-index: 101;
}
#gateArea #jbc {
	position: absolute;
	top: 20px;
	left: 20px;
	z-index: 101;
	width: clamp(180px, 15.7vw, 241px);
}
#gateArea #jbc img{
	width: 100%;
	height: auto;
}

#gateArea #news {
	padding-left: 22px;
	/*idth: 300px;*/
	width: 427px;
	position: absolute;
	right: 10px;
	top: 20px;
	z-index: 101;
	/* background: url(../img/common/mark_h2.png) repeat-y left top; */
	background: url(../img/common/mark_h2.png) repeat-y left top, rgba(0, 0, 0, .4);
	backdrop-filter: blur(2px);
	padding: 10px 10px 10px 22px;
}
#gateArea #news li {
	padding: 2px 0;
	color: #fff;
	line-height: 1.4;
	font-size: 1.2em;
	/* text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8); */
}
#gateArea #news li.small {
	font-size: 0.975em;
}
#gateArea #news li strong {
	display: block;
	margin-bottom: 5px;
}
#gateArea #bGotoeat {
	padding-left: 22px;
	padding-top: 70px;
	/*idth: 300px;*/
	width: 340px;
	position: absolute;
	right: -50px;
	/*top: 35px;*/
	z-index: 101;
}

#gateArea #gateLunch,
#gateArea #gateMimatsu,
#gateArea #gateUnagi {
	height: 100%;
	width: 50%;
	float: left;
	z-index: 10;
}
#gateArea #gateLunch a,
#gateArea #gateMimatsu a,
#gateArea #gateUnagi a {
	height: 100%;
	width: 100%;
	display: block;
	background: url(../img/home/overlay_gate.png) repeat left top;
	filter: alpha(opacity=0);
	opacity: 0;
}
#gateArea.sp #gateLunch a,
#gateArea.sp #gateMimatsu a,
#gateArea.sp #gateUnagi a {
	opacity: 0.75;
}
#gateArea #gateLunch p,
#gateArea #gateMimatsu p,
#gateArea #gateUnagi p {
	height: 180px;
	width: 102px;
	background: url(../img/home/enter_lunch.png) no-repeat left top;
	text-indent: -9999px;
}
/*#gateArea #gateMimatsu p {
	background-image: url(../img/home/enter_mimatsu.png);
}*/
#gateArea #gateMimatsu p {
	background-image: url(../img/home/enter_takeout.png);
}
/*#gateArea #gateMimatsu p {
	background-image: url(../img/home/enter_fuku.png);
}*/
/*#gateArea #gateMimatsu p {
	background-image: url(../img/home/enter_unagi.png);
}*/


/* -------------------------------------------
	copyright
------------------------------------------- */
#gateArea #copyright {
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 18px;
	z-index: 1000;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
	


/* ----------  ---------- */


/* ライトボックス */
.piro_html .h_t_r,
.piro_html .h_t_l {
	background: none !important;
}
.caption {
	background: none !important;
}
.caption p {
	display: none !important;
}
@media screen and (max-width: 980px), screen and (max-height: 780px), (orientation: portrait){
	#gateArea #news{
		width: 90vw;
		height: fit-content;
		right: 20px;
	}
	#gateArea #news.sp-bottom{
		top: inherit;
		bottom: 35px;
	}
	#gateArea #news.sp-center{
		right: 50%;
		transform: translateX(50%);
	}
	#gateArea #news.sp-tCenter li{
		text-align: center;
	}
	#gateArea #news.sp-w70{
		width: min(70vw, 600px);
	}
}
@media screen and (max-width: 980px), (orientation: portrait){
	#gateArea #news li{
		font-size: max(2.2rem, 1.5vh);
		line-height: 1.35;
	}
}
@media screen and (max-height: 600px){
	#gateArea #news li{
		font-size: clamp(10px, 3vh, 16px);
		line-height: 1.35;
	}
}
@media screen and (max-width: 780px), screen and (max-height: 500px), (orientation: portrait){
	#gateArea #kouji{
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		width: min(90vw, 400px);
	}
	#gateArea #kouji img{
		width: 100%;
	}
}
body{
	min-width: auto;
	width: 100%;
}
/* END */