@charset "utf-8";

/*--------------------------------
full page setting
--------------------------------*/
/* arrow for slides */
.fp-controlArrow{
	display:none;
}

.section{
	padding: 0;
	text-align:left;
	color:#fff;
}
/* Backgrounds will cover all the section */
#section0,
#section1,
#section2,
#section3,
#section4,
.slide{
	background-size: cover;
}
.clear {
	clear:both;
}
br.clear {
	clear: both;
	font: 0pt/0pt sans-serif;
	background-color:#00FFFF;
}
.clearfix:after {
    content: '';
    display: block;
    clear: both;
}
.clearfix {
    zoom: 1; /* for IE6/7 */
}

/*--------------------------------
common
--------------------------------*/
.forsp{
	display:none;
}

a{
	outline : 0;
	color:#fff;
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}
.article{
	color:#fff;
	line-height:200%;
	font-size:13px;
}

.article h2{
	background-repeat: no-repeat;
	background-position: left top;
	text-indent: -9999px;
}
.article h3{
	background-repeat: no-repeat;
	background-position: left top;
	text-indent: -9999px;
}
.nav{
	width:119px;
	height:120px;
	position: absolute;
}

.gotop{
	position: absolute;
	height: 19px;
	width: 119px;
	left: 0px;
	top: 50px;
	z-index:10;
}

/*--------------------------------
section0　T
--------------------------------*/
#section0{
	padding: 0;
	background-image: url(../img/slideshow/s01.jpg);
}
#logoarea{
	width:100%;
	background-color:#fff;
	z-index:99;
	height:254px;
	padding:0;
	margin:0;
	text-align:center;
	position: absolute;
	background-image: url('../img/shadow.png');
	background-repeat: repeat-x;
}
#logoarea h1{
	width:100%;
	height:254px;
	padding:0;
	margin:0 auto;
	left: 0px;
	top: 0px;
	text-indent: -9999px;
}
#logoarea h5{
	color: #040404;
	font-size: 16px;
	letter-spacing: 3px;
	line-height: 1.3em;
	text-align: right;
	position: absolute;
	right: 40px;
	top: 15px;
}
#logoarea .six{
	font-size: 13px!important;
	line-height: 1.8em!important;
	letter-spacing: 1px!important;
	padding-top: 15px!important;
}
#logoarea h5 a:link{
	color: #040404;
	text-decoration: underline;	
}
#logoarea h5 a:hover{
	color: #040404;
	text-decoration: none;	
}
#logoarea h5 a:visited{
	color: #040404;
	text-decoration: underline;	
}
#logoarea h1 img{
	width: 38px;
	height: 210px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
#logoarea h1 span{
	text-indent: -9999px;
	display:block;
	height:1px;
}
#gmenubox{
	position: absolute;
	left: 0;
	top: 300px;
	z-index:99;
	width:100%;
}
#gmenu{
	width:199px;
	margin:0 auto;
}
#gmenu li{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	background-repeat: no-repeat;
	background-position: left top;
	height: 188px;
	width: 48px;
	display:block;
	float:right;
}
#gmenu li a{
	height: 188px;
	width: 48px;
	display:block;
}

/* slideshow */
#maximage{
	position:relative !important;
}
#holder #maximage img.sp_t{
	display:none;
}
#holder {
	margin:0;
	width:100%;
}
div.mc-image {
	-webkit-transition: left 2s ease-in-out;
	-moz-transition: left 2s ease-in-out;
	-o-transition: left 2s ease-in-out;
	transition: left 2s ease-in-out;
}

/*size setting*/
.landscape #logoarea, #logoarea h1{
	height:125px;
}
.landscape #logoarea h1 img{
	width:19px;
	height:105px;
	margin:0 auto;
}
.landscape #gmenubox{
	top:145px;
}

/*
.portrait #holder #maximage img.pc{display:none;}
.portrait #holder #maximage img.sp_t{display:block;}
*/

/*--------------------------------
section1　About
--------------------------------*/
#section1{
	background-image: url(../img/bg01.jpg);
}
#section1 .article{
	width:28%;
	padding:6% 9% 0 4%;
	line-height:160%;
}
#section1 h2{
	background-image: url(../img/sttl_aboutus.png);
	height:29px;
	margin-bottom:40px;
}
#nav1{
	left: 35.8%;
	bottom: 65px;
}

/*size setting*/
.landscape #section1 .article{
	width:40%;
	height:100%;
	background-color:#080703;
	padding:3% 4% 0 4%;
}
.landscape #gmenubox{
	top:32%;
}
.portrait #section1{
	background-color:#080703;
	background-image: url(../img/bg01_p.jpg);
}
.portrait #section1 .article{
	width:50%;
	padding:5%;
}

@media screen and (max-height: 650px) {
#nav1{
	left: 34%;
	bottom: 65px;
}
}

/*--------------------------------
section2 food
--------------------------------*/
#section2{
	background-image: url(../img/bg02.jpg);
}
#section2 .article{
	position: relative;
	width:80%;
	padding:100px 10% 60px 10%;
	height:calc(42%-160px);
	background-color:#3b2a08;
}
#s2_sttl{
	margin-bottom:40px;
	max-width:440px;
}
#nav2{
	left:40%;
	bottom:-60px;
}
#section2 .floatl{
	width:45%;
}
#section2 .floatr{
	width:45%;
	padding-left:10%;
}

/*size setting*/
.landscape #section2 .article{
	width:94%;
	padding:3%;
	font-size:12px;
}
.landscape #section2 .floatr{
	width:52%;
	padding-left:3%;
}
.portrait #section2{
	background-color:#080703;
	background-image: url(../img/bg02_p.jpg);
}
.portrait #section2 .article{
	width:90%;
	padding:30px 5% 60px 5%;
	height:calc(42% - 90px);
}
.portrait #nav2{
	left:40%;
	bottom:-60px;
}

/*--------------------------------
section3 menu
--------------------------------*/
#section3{
	padding: 0;
}
.slide{
	padding: 0;
	width:100%;
	background-repeat:no-repeat;
	background-color:#080703;
}
.slide .article{
	width:39%;
	max-width:663px;
	padding:4% 12% 0 6%;
	position:relative;
}
.slide h3{
	height:30px;
	margin-bottom:35px;
}

/* menu top */
#slide1{
	background-image: url(../img/bg03.jpg);
}
#slide1 .article{
	width:28%;
	padding:6% 10% 0 4%;
}
#slide1 h2{
	height:29px;
}
#slide1 h2{
	background-image: url(../img/sttl_menu.png);
	margin-bottom:40px;
}
#smenubox{
	margin-top:10%;
}
#smenubox p{
	margin-top:5px;
}
#nav3{
	position: relative;
	margin-top:9%;
	margin-left: 512px;
}

/*lunch*/
#lunch{
	background-image: url(../img/bg_lunch.jpg);
}
#lunch h3{
	background-image: url(../img/sm_ttl_lunch.jpg);
}
#lunch .article{
	width:43%;
	max-width:731px;
	padding-right:7%;
}

/*dinner*/
#dinner{
	background-image: url(../img/bg_dinner.jpg);
}
#dinner h3{
	background-image: url(../img/sm_ttl_dinner.jpg);
}
#dinner .article{
	width:66%;
	max-width:1097px;
	padding-right:7%;
}

/*sweets*/
#sweets{
	background-image: url(../img/bg_sweets.jpg);
}
#sweets h3{
	background-image: url(../img/sm_ttl_sweets.jpg);
}

/*drink*/
#drink{
	background-image: url(../img/bg_drink.jpg);
}
#drink h3{
	background-image: url(../img/sm_ttl_drink.jpg);
}
.snavi{
	padding:15px 7% 20px 0;
	position:absolute;
	width:155px;
	top:0;
	right:0;
	text-align:right;
}
#drink .snavi{
	width:57px;
}
.snavi a{
	display:block;
	float:left;
}
.nav_next{
	margin-left:45px;
}

/*size setting*/
.landscape #slide1 .article{
	width:36%;
	min-width:400px;
	padding:3%;
	font-size:12px;
	background-color:#080703;
}
.landscape #slide1 h2{
	margin-bottom:20px;
}
.landscape #smenubox img{
	width:150px;
	height:24px;
}
.landscape #smenubox p{
	margin-top:0px;
}
.landscape .slide .article{
	width:39%;
	min-width:500px;
	padding:3% 3% 0 3%;
	background-color:#080703;
}
.landscape .slide h3{
	height:30px;
	margin-bottom:15px;
}
.portrait .slide .article{
	width:82%;
	max-width:663px;
	padding:5% 12% 0 6%;
}
.portrait #slide1{
	background-image: url(../img/bg03_p.jpg);
}
.portrait #slide1 .article{
	width:50%;
	padding:5%;
}

@media screen and (max-height: 650px) {
#nav3{
	margin-left: 385px;
	bottom: 20px;
}
}

/*--------------------------------
section4 access
--------------------------------*/
#section4{
	background-image: url(../img/bg04.jpg);
}
#section4 .article{
	position: relative;
	background-color: #171003;
	width: 90%;
	padding-right: 5%;
	padding-bottom: 60px;
	padding-left: 5%;
}
#s4_wrap{
	max-width:1348px;
	padding:6%;
	width:88%;
	height:calc(46%-105px);
}
#section4 .floatl{
	width:calc(100% - 349px);
}
#s4_map{
	width:349px;
	float:left;
}
#s4_map .map{
	width:100%;
}
#s4_sttl{
	float:left;
	width:217px;
	padding-right:10%;
	padding-bottom:45px;
}
#s4_mid{
	float:left;
	width:535px;
}
#s4_six{
	width: 430px;
	float: left;
	padding-top: 74px;
}
#section4 .yellow{
	font-size: 16px !important;
	color: #fdf407 !important;
	letter-spacing: 3px !important;
	padding-top: 14px;
	padding-bottom: 14px;
}
#section4 h4{
	font-size: 20px !important;
	clear: both;
	padding-top: 20px;
}
#btn_gmap{
	display: inline;
	margin-left: 20px;
	margin-top:15px;
}
#nav4{
	width:120px;
	height:60px;
	right:50%;
	margin-right:-60px;
	bottom:-15px;
}
.w5{
	width:4em;
}
.recruit{
	float: right;
}
a.overwhite{
    background-color:#ffffff;
    display:block;
}

a.overwhite:hover img{
    cursor:pointer;
    filter: alpha(opacity=80);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=80)";  /* ie 8 */
    -moz-opacity:0.8;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.8;              /* Safari 1.x */
    opacity:0.8;
    zoom:1;
}
.shop{
	width: 942px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 60px;
}
.shop1{
	float: left;
	font-size: 20px;
	width: 403px;
	text-align: center;
}
.shop2{
	margin-left: 136px;
	float: left;
	font-size: 20px;
	width: 403px;
	text-align: center;
}
.shop1 a:link{
	color: #fefcfb;
	text-decoration: none;	
}
.shop1 a:hover{
	color: #fefcfb;
	text-decoration: underline;
}
.shop1 a:visited{
	color: #fefcfb;
	text-decoration: none;	
}
.shop2 a:link{
	color: #fefcfb;
	text-decoration: none;	
}
.shop2 a:hover{
	color: #fefcfb;
	text-decoration: underline;
}
.shop2 a:visited{
	color: #fefcfb;
	text-decoration: none;	
}

/*size setting*/
.landscape #s4_wrap{
	padding:20px 6%;
}
#section4 .floatl{
	width:45%;
}
#section4 .floatr{
	width:45%;
	padding-left:10%;
}
.landscape #s4_sttl, .landscape #s4_mid,
.portrait #s4_sttl, .portrait #s4_mid{
	float:none;
}
.landscape #s4_map,
.portrait #s4_map{
	float:right;
	width:44%;
}
.landscape  #s4_wrap .forsp,
.portrait #s4_wrap .forsp{
	display:block;
	padding-top:5px;
}
.portrait #section4{
	background-image: url(../img/bg04_p.jpg);
}

@media only screen and (max-device-width: 650px) {
#section4 .floatr{
	width:45%;
	padding-left:0%;
}
#s4_mid{
	float:none;
	width:535px;
}
#s4_six{
	width: 535px;
	float: none;
	padding-top: 74px;
}
#section4 .floatl {
    float: none;
}
#section4 .floatr {
    float: none;
}
.shop{
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	margin-top: 60px;
}
.shop1{
	font-size: 20px;
	width: 403px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
.shop2{
	margin-top: 36px;
	font-size: 20px;
	width: 403px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
}