@charset "utf-8";
/* CSS Document */

html{
	-webkit-overflow-scrolling:touch;
}

html,body{
	height:100%;
	margin:0;
	padding:0;
	font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", YuMincho, 游明朝体, "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	-webkit-font-smoothing:antialiased;
	font-size:16px;
	letter-spacing:0.05em;
}

.sans{
	font-family:  "メイリオ", Meiryo, Osaka, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

*{
	box-sizing:border-box;
}

/* header */

#header{
	width:100%;
	position:fixed;
	top:-120px;
	left:0;
	z-index:1000;
}

@media screen and (max-width:900px){
	#header{
		top:-200px;
	}
}

#header .hd_bg{
	padding:10px 0;
	background-color:#fff;
}

.hg_bg_s,
.gnav_s{
	display:none;
}

.logo{
	text-align:center;
}

.hd_tel{
	position:absolute;
	top:0;
	right:0;
	margin-right:5%;
	margin-top:0.5em;
	border:solid 1px #2a1a00;
	border-radius:5px;
	padding:0.2em 1em;
	background-color:#2a1a00;
	color:#fff;
}

.fa-phone{
	transform:rotate(20deg);
}
.hd_tel span{
}

.gnav{
	background-color:#2a1a00;
}


.gnav ul{
	width:100%;
	text-align:center;
}

.gnav ul li{
	display:inline-block;
	text-align:center;
}

.gnav ul li a{
	font-size:1.2em;
	font-weight:bold;
	display:inline-block;
	text-align:center;
	color:#fff;
	text-decoration:none;
	padding:20px 20px 0;
	line-height:20px;
}

.gnav ul li a::after{
	content:"";
	display:block;
	width:0;
	transition:width 0.3s;
	border-bottom:3px solid #fff;
	padding-bottom:20px;
}

.gnav ul li a:hover::after{
	width:100%;
}

.gnav ul li a.current{
	color:#e2dfba;
}

@media screen and (max-width:900px){

.gnav{
	background-color:#2a1a00;
	}


.gnav ul{
	width:100%;
	text-align:center;
	padding-left:18%;
	padding-right:18%;
	}
}


@media screen and (max-width:768px){
	
	/* header */
	.hd_bg,
	.gnav{
		display:none;
	}
	
	.hg_bg_s{
		display:block;
		position:fixed;
		top:0;
		padding:10px 20px;
		width:100%;
		background-color:#fff;
	}
	
	.logo_s{
		padding-left:5%;
	}
	
	.fa-phone{
		position:absolute;
		top:0;
		right:0;
		padding-right:20px;
		padding-top:15px;
		color:#000;
	}
	
	.gnav_s{
		display:block;
		position:fixed;
		top:55px;
		width:100%;
		background-color:#2a1a00;
	}


.gnav_s ul{
	width:100%;
	text-align:center;
}

.gnav_s ul li{
	display:inline-block;
	width:20%;
	text-align:center;
}

.gnav_s ul li a{
	font-size:0.8em;
	display:inline-block;
	text-align:center;
	color:#fff;
	text-decoration:none;
	padding-top:10px;
	padding-bottom:10px;
	line-height:1.5em;
	vertical-align:middle;
}	
}

/* main visual fade in */
.main_pic_b{
	display:none;
	width:100%;
	height:auto;
	position:absolute;
	top:0;
	left:0;
	z-index:4;
}

.main_pic_b img{
	width:100%;
}

.main_pic_a{
	display:none;
}

.main_text_p{
	position:absolute;
	width:100%;
	top:50%;
	text-align:center;
	z-index:5;
	color:#fff;
	font-weight:bold;
	line-height:4em;
	text-shadow:5px 1px 4px #858585;
}

.main_text_p span{
	opacity:0;
}

.font_b{
	font-size:2.5em;
}

.font_s{
	font-size:1.5em;
}


/* main visual */

.main_pic{
	width:100%;
	overflow:hidden;
	position:relative;
}

.main_pic_s{
	display:none;
}

.right_box{
	position:absolute;
	background:url(../img/top_main_pic_p.png) no-repeat;
	background-size:cover;
	width:60%;
	height:100%;
	right:0;
	top:0;
}

.left_box{
	position:relative;
	width:40%;
	height:100%;
	left:0;
	background-color:#fff;
}

.logo_left{
	text-align:center;
	margin-top:100px;
}

.logo_under{
	text-shadow:1px 1px 1px #858585;
}

.main_nav{
	text-align:center;
	padding-top:40px;
}

.main_nav li{
	text-align:left;
	display:inline;
	-webkit-writing-mode:vertical-rl;
	writing-mode: tb-rl;
	writing-mode:vertical-rl;
	padding-top:20px;
}

.main_nav li a{
	display:block;
	text-decoration:none;
	height:280px;
	width:40px;
	text-align:left;
	line-height:40px;
	font-size:1.2em;
	color:#4f4f4f;
}

.main_nav li a:hover{
	font-weight:bold;
}

@media screen and (max-width:768px){
	.main_pic_a{
		display:block;
	}
	
	.main_pic{
		width:100%;
	}
	
	.main_pic_p{
		display:none;
	}
	
	.main_pic_s{
		position:relative;
		display:block;
		margin-top:110px;
		margin-bottom:-2px;
	}
	
	.main_pic_s .main_pic_s_0{
		width:100%;
	}
	
	.main_pic_s .main_pic_logo{
		width:45%;
		position:absolute;
		top:20%;
		left:50%;
		transform:translate(-50%,0);
		-webkit-transform:translate(-50%,0);
	}
	
	.main_pic_s .main_pic_logo img{
		width:100%;
	}

	
	.main_pic_s .main_text_s{
		position:absolute;
		width:100%;
		top:70%;
		text-align:center;
		color:#fff;
		font-size:5vw;
		font-weight:bold;
		text-shadow:5px 1px 4px #858585;
	}
	
}

/* section1 */

.about_pickup{
	width:100%;
	display:none;
	background:url(../img/bg_1.png) repeat;
	padding-bottom:2em;
}

.sec1_pic{
	text-align:center;
}

.sec1_pic .img_p{
	padding:10px;
	width:30%;
}

.sec1_pic .img_s{
	display:none;
}

.sec1_h2,
.sec1_desc{
	text-align:center;
	color:#fff;
}

.sec1_h2{
	padding-bottom:1em;
	font-size:1.5em;
}

.sec1_h2_p{
	width:75%;
}

.sec1_h2_s{
	display:none;
}

.sec1_desc{
	padding:0 2em 0.5em;
	line-height:2em;
}

.sec1_btn{
	text-align:center;
	margin-top:1em;
}
.square_btn_1{
	display:inline-block;
	padding:0.7em 5em;
	text-decoration:none;
	color: #e2dfba;
	border: solid 1px #e2dfba;
	border-radius: 1px;
	transition: .4s;
}

.square_btn_1:hover {
	background: #e2dfba;
	color: white;
}

.square_btn_2{
	display:inline-block;
	padding:0.7em 5em;
	text-decoration:none;
	color: #2a1a00;
	border: solid 1px #2a1a00;
	border-radius: 1px;
	transition: .4s;
}

.square_btn_2:hover {
	background: #2a1a00;
	color: white;
}


@media screen and (max-width:768px){
	
	.about_pickup{
		display:block;
	}
	
	.sec1_pic .img_p{
		display:none;
	}
	
	.sec1_pic .img_s{
		display:inline;
		margin-top:1%;
		padding:1% 0.5%;
		width:32%;
	}
	
	.sec1_h2_p{
		display:none;
	}
	
	.sec1_h2_s{
		display:block;
		width:100%;
	}
	
	.sec1_h2,
	.sec1_desc{
		padding:2% 5%;
		text-align:left;
	}
	
	.about_pickup .sec1_btn{
		text-align:center;
	}

}

/* section2 */
.food_pickup{
	position:relative;
	display:none;
	width:100%;
	padding:20% 0;
	overflow-x:hidden;
}
.sec2_pic{
	position:absolute;
	top:0;
	left:0;
	width:60%;
	padding:20% 0;
	z-index:0;
	background-image:url(../img/top_sec2_foodpickup_p.png);
	background-size:cover;
	background-position:center left;
}

.sec2_pic .sec2_pic_s{
	display:none;
}

.sec2_h2{
	width:40%;
	position:absolute;
	top:15%;
	right:5%;
	padding-bottom:2em;
	z-index:3;
}

.sec2_h2 img{
	width:100%;
}

.sec2_cnt{
	width:40%;
	position:absolute;
	right:5%;
	top:45%;
	z-index:2;
}


.sec2_desc{
	line-height:2em;
	letter-spacing:2px;
}

.sec2_bg_right{
	position:absolute;
	top:0;
	right:-10%;
	width:60%;
	padding:20% 0;
	z-index:1;
	background:url(../img/bg_3.png) repeat;
	transform:skewX(15deg);
}

.sec2_btn{
	text-align:right;
	margin-top:2em;
}

@media screen and (max-width:1024px){
	
	.food_pickup{
		display:none;
	}
	
	.sec2_cnt{
		width:40%;
		top:45%;
	}
	
	.sec2_h2{
		padding-bottom:1em;
	}
	
	.sec2_btn{
		margin-top:1em;
	}
	
}

@media screen and (max-width:880px){
	.sec2_desc{
		font-size:0.8em;
	}
}

@media screen and (max-width:768px){
	.food_pickup{
		display:block;
		padding:0;
	}
		
	.food_pickup .sec2_pic{
		position:static;
		width:100%;
		background-image:none;
		padding:0;
	}
	
	.food_pickup .sec2_pic .sec2_pic_s{
		display:block;
		width:100%;
		height:auto;
	}
	
	.sec2_h2{
		position:static;
		width:100%;
		text-align:center;
		padding-bottom:0;
		background:url(../img/bg_3.png) repeat;
	}
	
	.sec2_h2 img{
		width:90%;
		margin-top:2em;
	}
	
	.food_pickup .sec2_cnt{
		position:static;
		width:100%;
		padding:5% 5% 10% 5%;
		line-height:1.2em;
		background:url(../img/bg_3.png) repeat;
	}
	
	.sec2_h2{
		padding-top:0;
	}
	
	.sec2_desc{
		font-size:1em;
	}
	
	.food_pickup .sec2_bg_right{
		display:none;
	}
	
	.food_pickup .sec2_cnt .sec2_btn{
		text-align:center;
	}	
}


/* section3 */

.drink_pickup{
	position:relative;
	display:none;
	width:100%;
	margin:0 0 40% 0;
}


.sec3_pic{
	position:absolute;
	top:0;
	right:0;
	width:60%;
	padding:20% 0;
	z-index:0;
	background-image:url(../img/top_sec3_drinkpicup_p.png);
	background-size:cover;
	background-position:center right;
}

.sec3_pic .sec3_pic_s{
	display:none;
}


.sec3_h2{
	width:40%;
	position:absolute;
	left:5%;
	padding-top:5%;
	padding-bottom:3em;
	z-index:3;
}

.sec3_h2 img{
	width:100%;
}

.sec3_cnt{
	width:40%;
	position:absolute;
	left:5%;
	padding-top:23%;
	z-index:2;
}


.sec3_desc{
	color:#fff;
	line-height:2em;
	letter-spacing:2px;
}

.sec3_bg_left{
	position:absolute;
	top:0;
	left:-10%;
	width:60%;
	padding:20% 0;
	z-index:1;
	background:url(../img/bg_2.png) repeat;
	transform:skewX(15deg);
}

.sec3_cnt .sec3_btn{
	text-align:right;
	margin-top:2em;
}

@media screen and (max-width:1024px){
	
	.sec3_h2{
		padding-top:3%;
	}
	
	.sec3_cnt{
		padding-top:20%;

	}
	
	.sec3_btn{
		margin-top:0;
	}
}

@media screen and (max-width:880px){
	.sec3_desc{
		font-size:0.8em;
	}
}



@media screen and (max-width:768px){
	.drink_pickup{
		display:block;
		padding:0;
	}

	.drink_pickup .sec3_pic{
		position:static;
		width:100%;
		background-image:none;
		padding:0;
	}
	
	.drink_pickup .sec3_pic .sec3_pic_s{
		display:block;
		width:100%;
		height:auto;
	}
	
	.sec3_h2{
		position:static;
		width:100%;
		text-align:center;
		padding-bottom:0;
		background:url(../img/bg_2.png) repeat;
	}
	
	.sec3_h2 img{
		width:90%;
		margin-top:2em;
	}
	
	.sec3_cnt{
		position:static;
		width:100%;
		line-height:1.5em;
		background:url(../img/bg_2.png) repeat;
		padding:5% 5% 10% 5%;
		margin-bottom:-40%;
	}
	
	.sec3_h2{
		padding-top:0;
	}
	
	.sec3_desc{
		font-size:1em;
	}
	
	.drink_pickup .sec3_bg_left{
		display:none;
	}
	
	.drink_pickup .sec3_cnt .sec3_btn{
		text-align:center;
	}
}

/* link */

.link_area{
	display:none;
}

@media screen and (max-width:768px){
	.link_area{
		display:block;
		width:100%;
		background:url(../img/bg_3.png) repeat;
		margin:0 auto;
		padding:10%;
	}

	.coupon,.calling{
		margin:3em auto;
	}

	.coupon img,
	.calling img{
		width:100%;
		text-align:center;
	}
	

}


/* page top */

.page_top{
	display:none;
}

.page_top p{
	position:fixed;
	right:20px;
	bottom:20px;
	z-index:10000;
}

.move_page_top{
	display:block;
}

.move_page_top_i{
	color:#555;
	opacity:0.7;
}

/* footer */

#footer{
	width:100%;
	font-size:1.05em;
	color:#fff;
	display:none;
	line-height:1.5em;
}

.footer_line{
	height:10px;
	background:url(../img/footer-line.png);
}

.footer_line img{
	display:none;
}

.footer_body{
	height:450px;
	position:relative;
	background-color:#433122;

}

.footer_content{
	width:1024px;
	margin:0 auto;
}

.footer_logo{
	padding:1.8em 5% 0 0%;
	float:left;
}

.footer_desc{
	width:auto;
	float:left;
	font-size:0.9em;
}

.footer_desc img{
	padding-top:2em;
}

.footer_desc .dl_bottom{
	padding-bottom:10%;
}

.footer_desc dt{
	width:6em;
	float:left;
	text-align:left;
	padding-right:1.5em;
	padding-top:1em;
}

.footer_desc dd{
	float:left;
	padding-top:1em;
}

.footer_link{
	float:right;
	padding-top:2em;
	padding-right:2%;
}

.footer_link p{
	display:none;
}

.copyright{
	position:absolute;
	right:5%;
	bottom:5%;
}

@media screen and (max-width:1024px){
	
	.footer_content{
		width:768px;
		margin:0 auto;
		}

	.footer_link iframe{
		display:none;
	}
	
	.footer_link p{
		display:block;
	}
	
}


@media screen and (max-width:768px){
	
	#footer{
		display:block;
	}
	
.footer_line{
	width:100%;
	height:100px;
	background:url(../img/footer_line_s.png) repeat-x;
}

	.footer_line img{
		display:block;
		margin:0 auto;
		padding:4% 0;
	}
	
	.footer_body{
		height:250px;
	}
	.footer_logo{
		display:none;
		float:none;
	}
	
	.footer_content{
		width:90%;
		display:table;
		margin:0 auto;
	}
	
	.footer_desc{
		width:100%;
		float:none;
	}
	.footer_desc p img{
		display:none;
	}
	
	.footer_desc dl{
		width:100%;
		font-size:0.7em;
		float:none;
	}
	
	.footer_desc dt{
		padding-right:1em;
	}
		.footer_desc dt{
	}

	
	.footer_desc dt,
	.footer_desc dd{
		padding-top:0.5em;
	}
	
	.footer_link p{
		position:absolute;
		top:5%;
		right:5%;
	}
	
	.copyright{
		font-size:0.6em;
		bottom:1em;
		left:15%;
	}
	
}