/*===============================================*/

/* TOP.CSS  */

/*last up 2017.01.12 nagaden*/


/*//////////////////////////////////

background
///////////////////////////////////*/
.bg-nami{
	background: url(../img/common/bg_nami.png) center 20% no-repeat;
}

/*===============================================*/

/* contents  */

/*===============================================*/


/*h*//*=====================================--------*/
h2.h2-img{
	width: 100%;
	text-align: center;
	margin: 120px auto 0;
	}

	@media screen and (max-width:959px) {
		h2.h2-img{
			margin: 20px auto 0;
			}	

		h2.h2-img img{
			width: 70%;
			height: auto;
			}
		}

h2.h2-img-ossm{
	width: 100%;
	text-align: center;
	margin: 60px auto 0;
	}

	@media screen and (max-width:959px) {
		h2.h2-img-ossm{
			margin: 20px auto 0;
			}	

		h2.h2-img-ossm img{
			width: 30%;
			height: auto;
			}
		}

	/*sp*/
	@media screen and (max-width:480px) {
		h2.h2-img{
			margin: 10px auto 0;
			}	
		}

/*section*//*
=====================================--------------*/
.wrap-sec{
	margin-top: 120px;
	}
	@media screen and (max-width:480px) {
		.wrap-sec{
			margin-top: 60px;
		}
	}

/*section*//*/
=====================================--------------*/
/*キムチ*/
.wrap-ossm-1366{
	background-size:contain;
	padding: 60px 0;
	height: 645px;
	width: 96%;
	max-width: 1366px;
	margin: 60px auto 0;
}
.bg-harami{	background: url(../osusume/img/harami_bg.png) no-repeat top right;}
.bg-tan{ background: url(../osusume/img/tan_bg.png) no-repeat top left;}
.bg-karubi{	background: url(../osusume/img/karubi_bg.png) no-repeat top right;}
.bg-yakisuki{	background: url(../osusume/img/yakisuki_bg.png) no-repeat top right;}
.bg-osusume03{	background: url(../osusume/img/osussume03_bg.png) no-repeat top right;}


@media screen and (max-width:959px) {
	.wrap-ossm-1366{
		background: none;
		padding: 0;
		height: auto;
		margin: 0px auto 0;
		}
	}

.ossm-txt-wrap{
	width: 100%;
	max-width: 580px;
	font-size: 20px;
	font-size: 2rem;
}
@media screen and (max-width:640px) {
.ossm-txt-wrap{
	width: 100%;
	max-width: 580px;
	font-size: 18px;
	font-size: 1.8rem;
}
	
}
.ossm-left{
	margin: 160px 0 0;
	padding-left: 20px;
}
.ossm-right{
	margin: 160px 0 0 auto;
	padding-right: 20px;
	text-align: right;
}

	@media screen and (max-width:959px) {
			.ossm-right{
				margin: 40px auto 0;
				padding:0;
				text-align: center;
				}
			.ossm-left{
				margin: 40px auto 0;
				padding: 0;
				text-align: center;
				}
		}


.ossm-txt-wrap{
	width: 96%;
	text-shadow: 2px 2px 3px #000;
}

@media screen and (min-width:959px) {
.ossm-txt-wrap figure{ display: none;}
}
.ossm-txt-wrap figure img{
	width: 100%;
	height: auto;
}


.ossm-txt-wrap h3{
	margin-top: 10px;
	transition: .8s;
	overflow: hidden;
}
.ossm-txt-wrap h3 img{
			width: 100%;
			height: auto;
		}

	@media screen and (max-width:969px) {
		.ossm-txt-wrap h3 img{
			width: auto;
			height: 40px;
		}
		}

	@media screen and (max-width:640px) {
		.ossm-txt-wrap h3 img{
			width: auto;
			height: 36px;
		}
		}
.ossm-txt-wrap p{
	margin-top: 50px;
	width: 96%;
	max-width: 400px;
	transition: .8s;
	overflow: hidden;
}
@media screen and (max-width:959px) {
.ossm-txt-wrap p{
	margin: 10px auto 0;
	width: 100%;
	min-width: 300px;
	max-width: 768px;
}
	
}

.ossm-txt-wrap p.price{
	margin-top: 20px;
	text-align: right;
	font-size: 36px;
	font-size: 3.6rem;
	font-weight: bold;
	}
	@media screen and (max-width:959px) {
		.ossm-txt-wrap p.price{
			margin-top: 5px;
			text-align: right;
			font-size: 24px;
			font-size: 2.4rem;
			}
	}
.small-font{font-size: 14px; font-size: 1.4rem; margin-left: 5px;}
	@media screen and (max-width:640px) {
		.small-font{font-size: 12px; font-size: 1.2rem; margin-left: 5px;}
	}


/*humburg*//*
=====================================--------------*/
.wrap-humburg{
	padding: 60px 0;
	width: 96%;
	max-width: 1366px;
	margin: 60px auto 0;
}
@media screen and (max-width:959px) {
	.wrap-humburg{
		padding: 0;
		height: auto;
		margin: 0px auto 0;
		}
	}

h3.hum-h3{
	width: 96%;
	max-width: 960px;
	margin: 0 auto 0;
	transition: .8s;
	overflow: hidden;
}

	@media screen and (max-width:480px) {
		h3.hum-h3{
			margin: 30px auto 0;
		}
	}

p.hum-text{
	width: 96%;
	max-width: 960px;
	margin: 0 auto 0;
	transition: .8s;
	overflow: hidden;
}

p.hum-image{
	width: 96%;
	max-width: 1366px;
	margin: 0 auto 0;
	transition: .8s;
	overflow: hidden;
}

h3.hum-h3 img,
p.hum-text img,
p.hum-image img{
	width: 100%;
	height: auto;
}



/*sagari*//*
=====================================--------------*/
.wrap-sagari{
	padding: 60px 0 90px;
	width: 96%;
	max-width: 1366px;
	margin: 60px auto 0;
}
@media screen and (max-width:959px) {
	.wrap-sagari{
		padding: 0px 0 30px;
		height: auto;
		margin: 0px auto 0;
		}
	}

h3.sagari-h3{
	width: 100%;
	max-width: 960px;
	margin: 0 auto 0;
	transition: .8s;
	overflow: hidden;
}

	@media screen and (max-width:480px) {
		h3.sagari-h3{
			margin: 30px auto 0;
		}
	}

p.sagari-text{
	width: 96%;
	max-width: 650px;
	margin: 40px auto 0;
	transition: .8s;
	overflow: hidden;
}

p.sagari-image{
	width: 96%;
	max-width: 1109px;
	margin: 40px auto 0;
	transition: .8s;
	overflow: hidden;
}

.sagari-image_wrap{
	width: 96%;
	max-width: 960px;
	margin: 40px auto 0;
	transition: .8s;
	overflow: hidden;
}
.sagari-image_460_left{
	width: 460px;
	margin: 0 auto 0;
	float: left;
}
.sagari-image_460_right{
	width: 460px;
	margin: 0 auto 0;
	float: right;
}
	@media screen and (max-width:480px) {
		.sagari-image_wrap{
	margin: 20px auto 0;
}
		.sagari-image_460_left{
			width: 100%;
			max-width: 460px;
			margin: 0 auto 0;
			float: none;
			text-align: center;
		}
		.sagari-image_460_right{
			width: 100%;
			max-width: 460px;
			margin: 20px auto 0;
			float: none;
			text-align: center;
		}		
				.sagari-image_460_left img{
			width: 100%;
					height: auto;
		}
		.sagari-image_460_right img{
			width: 100%;
			height: auto;
		}		
	}

.image_wrap{
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
.image_wrap p{
	width: 50%;
	max-width: 470px;
}
.image_wrap p img{
	width: 100%;
	height: auto;
}
@media screen and (max-width:480px) {
	.image_wrap{
		flex-wrap: wrap-reverse;
	}
.image_wrap p{
	width: 100%;
	margin: 20px auto 0;
	height: auto;
}
}


h3.sagari-h3 img,
p.sagari-text img,
p.sagari-image img,
p.sagari-image_wrap img{
	width: 100%;
	height: auto;
}

/*sagari*//*
=====================================--------------*/
.ls-wrap{
	width: 96%;
	max-width: 960px;
	padding: 30px;
	border: 1px solid #fff;
	margin: 40px auto 0;
}

.ls-image{
	width: 46%;
	max-width: 410px;
	float: left;
}
.ls-text{
	width: 48%;
	max-width: 436px;
	float: right;
}

	@media screen and (max-width:480px) {
		.ls-wrap{
			padding: 20px;
			}

		.ls-image{
			width: 100%;
			max-width: 410px;
			float: none;
			text-align: center;
			margin: 0 auto 0;
		}
		.ls-text{
			width: 100%;
			max-width: 436px;
			float: none;
			text-align: center;
			margin: 24px auto 0;
		}	
	}

.ls-wrap img,
.ls-image img,
.ls-text img{
	width: 100%;
	height: auto;
}


/*Roastbeef*//*
=====================================--------------*/
.wrap-rb{
	padding: 60px 0 60px;
	width: 96%;
	max-width: 960px;
	margin: 60px auto 0;
	/*border-bottom: 1px dotted #fff;
	border-top: 1px dotted #fff;*/
}
@media screen and (max-width:959px) {
	.wrap-rb{
		padding: 30px 0 60px;
		height: auto;
		margin: 0px auto 0;
		}
	}

h3.rb-h3{
	width: 100%;
	max-width: 960px;
	margin: 0 auto 0;
	transition: .8s;
	overflow: hidden;
	text-align: center;
}

	@media screen and (max-width:480px) {
		h3.hum-h3{
			margin: 30px auto 0;
		}
	}


p.rb-text{
	width: 96%;
	max-width: 960px;
	text-align: center;
	margin: 48px auto 0;
	transition: .8s;
	overflow: hidden;
}

h3.rb-h3 img,
p.rb-text img{
	width: 100%;
	height: auto;
}
	@media screen and (max-width:480px) {
		p.rb-text{
	margin: 28px auto 0;
}

	p.rb-text img{
		width: 80%;
		height: auto;
	}
	}



/*bana-list*//*
=====================================--------------*/
.bana-wrap{
	width: 96%;
	max-width: 960px;
	margin: 120px auto 0;
}

.bana-wrap ul li{
	width: 48%;
	max-width: 460px;
}
.left-bana{float: left;}
.right-bana{ float: right;}

.bana-wrap ul li img{
	width: 100%;
	height: auto;
}

	@media screen and (max-width:640px) {
		.bana-wrap{
			margin: 40px auto 0;
			}	

.bana-wrap ul li{
	width: 96%;
	max-width: 460px;
	margin: 10px auto 0;
	text-align: center;
	}
.left-bana{float: none;}
.right-bana{ float: none; margin-top: 10px;}
}


/*おススメ食べ方*/
.wrap-ossm-tabekata{
	width: 100%;
	max-width: 1366px;
	margin: 30px auto 0;
}

.wrap-ossm-tabekata ul li{
	width: 48%;
	margin-right: 4%;
	float: left;
	transition: .8s;
	overflow: hidden;
}
.wrap-ossm-tabekata ul li:nth-child(2){
	margin-right: 0;
}
.wrap-ossm-tabekata ul li img{
	width: 100%;
	height: auto;
}

@media screen and (max-width:640px) {
	.wrap-ossm-tabekata ul li{
		width: 96%;
		margin:30px auto 0;
		float: none;
	}
	.wrap-ossm-tabekata ul li:nth-child(2){
		margin-right: auto;
	}
}


/*おススメ3column*/
.wrap-ossm-clum3{
	width: 100%;
	max-width: 960px;
	margin: 30px auto 0;
}

.wrap-ossm-clum3 ul li{
	width: 300px;
	margin-right: 30px;
	float: left;
	transition: .8s;
	overflow: hidden;
}
.wrap-ossm-clum3 ul li:nth-child(3){
	margin-right: 0;
}
.wrap-ossm-clum3 ul li img{
	width: 100%;
	height: auto;
	max-width: 300px;
}

@media screen and (max-width:640px) {
	.wrap-ossm-clum3 ul li{
		width: 96%;
		margin:30px auto 0;
		float: none;
		text-align: center;
	}
	.wrap-ossm-clum3 ul li:nth-child(3){
		margin-right: auto;
	}
}

/*anime*/
.list-mv06{
	transform: scale(0, 0) rotateY(180deg);
	-webkit-transform: scale(0, 0) rotateY(180deg);
}
.mv06{
	transform: scale(1, 1) rotateY(360deg);
	-webkit-transform: scale(1, 1) rotateY(360deg);
}


/*anime*/
.list-mv07{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
}
.mv07{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

.wrap_itadaki{
	width: 100%;
	text-align: center;
	background-image: url(../osusume/img/itadaki_bg.png);
	background-size: cover;
	background-position: center top;
}


.wrap_reiwa{
	width: 100%;
	text-align: center;
	background-image: url(../osusume/img/itadaki_bg.png);
	background-size: cover;
	background-position: center top;
}


.wrap-ossm-960{
	width: 100%;
	max-width: 960px;
	margin: 30px auto 0;
	text-align: center;
}
.wrap-ossm-960 img{
	width: 100%;
	height: auto;
}

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


.column_wrap{
	width: 100%;
	max-width: 960px;
	margin: 32px auto 0;
	display: flex;
	flex-wrap: wrap;
}

.colum_item_2{
	width: 50%;
	text-align: center;
	padding: 10px;
}
.colum_item_2 img{
	width: 100%;
	max-width: 470px;
	height: auto;
}
@media screen and (max-width:480px) {
.column_wrap{
	flex-wrap: nowrap;
	flex-direction: column;
	justify-content: center;
  align-items: center;
}
.colum_item_2{
	width: 100%;
	text-align: center;
	padding: 3px;
}
}
#sogyokinensai h3.rb-h3{
	max-width: 599px;
}
.menu_wrap{
	text-align: center;
}
.menu_ttl_col2{
	max-width: 900px;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin: 0 auto;
}
.menu_ttl_col2.aiCenter{
	align-items: center;
}
.menu_ttl_col2 p > img{
	width: 95%;
	height: auto;
}

.notice_wrap{
	border: 1px solid #fff;
	border-radius:5px;
	margin:auto;
	padding:20px;
	max-width: 960px;
	width: 90%;
	margin-top: 30px;
}
.notice_wrap p{
	font-size: 1.6rem;
	margin: 30px auto;
	text-align: center;
}
.notice_wrap p.font-s{
	font-size: 1.3rem;
	margin: 10px auto;
}
.menu_img{
	max-width: 100%;
	height: auto;
}

@media screen and (min-width:640px) {
	.menu_ttl_col2 p:nth-of-type(2){
		text-align: right;
	}
}

@media screen and (max-width:640px) {
	.menu_ttl_col2{
		flex-wrap: wrap;
	}
	.menu_ttl_col2 p{
		width: 100%;
		text-align: center;
	}
	.menu_img{
		width: 100%;
		height: auto;
	}

}


#xmas_pack{
	position: relative;
	background: url(../osusume/img/bg_xmas_top.png) no-repeat center top / 80%, url(../osusume/img/bg_xmas.jpg) no-repeat center top / cover;
	padding: 120px 15px 0;
}
#xmas_pack .menu_wrap{
	position: relative;
	padding-block: 120px 60px;
}
#xmas_pack .menu_wrap h3{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(calc(100vw - 30px), 1164px);
	text-align: center;
}
#xmas_pack .menu_wrap h3 img{
	width: min(100%, 1164px);
	height: auto;
}
.menu_wrap h4.menu_sub_ttl{
	text-align: center;
}
.menu_wrap h4.menu_sub_ttl img{
	max-width: 100%;
	height: auto;
}
.bgBrown50{
	background: rgba(68, 12, 12, .5);
}
.maxWidth936{
	max-width: 936px;
	margin: 0 auto;
}
.menu_ex_wrap,
.menu_img_wrap{
	position: relative;
}
.menu_ex_wrap p{
	text-align: center;
}
.xmas_icon{
	position: absolute;
}
.menu_ex_wrap img.xmas_icon.icon1{
	width: min(10vw, 97px);
	height: auto;
	left: 0;
	bottom: 0;
	transform: translateX(-30%);
}
.menu_ex_wrap img.xmas_icon.icon2{
	width: min(12.6vw, 121px);
	height: auto;
	right: 0;
	bottom: 0;
	transform: translateX(30%);
}
#xmas_pack .menu_ttl_col2{
	justify-content: space-evenly;
	margin-top: 30px;
}
.menu_img_wrap{
	margin-top: 40px;
}
.menu_img_wrap .menu_img{
	position: relative;
	max-width: 100%;
	height: auto;
	z-index: 3;
}
.menu_img_wrap img.xmas_icon.icon3{
	width: min(21.8vw, 210px);
	height: auto;
	top: 0;
	right: 0;
	transform: translate(47%, -39%);
	z-index: 1;
}
.menu_img_wrap img.xmas_icon.icon4{
	width: min(16.4vw, 158px);
	height: auto;
	bottom: 0;
	left: 0;
	transform: translate(-43%, 19%);
	z-index: 2;
}
.menu_img_wrap img.xmas_icon.icon5{
	width: min(29vw, 280px);
	height: auto;
	bottom: 0;
	left: 0;
	transform: translate(-4%, 10%);
	z-index: 4;
}
#xmas_pack .menu_wrap .notice_wrap{
	margin-top: 60px;
}

@media screen and (max-width:1160px) {
	#xmas_pack {
		background: url(../osusume/img/bg_xmas_top.png) no-repeat center top / 100%, url(../osusume/img/bg_xmas.jpg) no-repeat center top / cover;
	}
	.menu_img_wrap{
		margin-top: 60px;
	}
	#xmas_pack .menu_wrap{
		padding-block: 20% 45px;
	}
	.menu_wrap h4.menu_sub_ttl img{
		max-width: 60%;
	}
	.menu_ex_wrap{
		margin-block: 40px;
	}
	.menu_ex_wrap img.xmas_icon.icon1{
		left: 5%;
		bottom: 115%;
	}
	.menu_ex_wrap img.xmas_icon.icon2{
		right: 5%;
		bottom: 120%;
	}
	#xmas_pack .menu_ttl_col2{
		margin-top: 50px;
		gap: 20px 20px;
	}
	.menu_img_wrap img.xmas_icon.icon3 {
		width: min(16.35vw, 210px);
		height: auto;
		top: -7%;
		right: 5%;
	}
	.menu_img_wrap img.xmas_icon.icon4 {
		width: min(12.3vw, 158px);
		height: auto;
		left: 0;
		transform: translate(-10%, 91%);
	}
	.menu_img_wrap img.xmas_icon.icon5 {
		width: min(21.75vw, 280px);
		height: auto;
		transform: translate(0, 10%);
	}
}
@media screen and (max-width:768px) {
	#xmas_pack{
		overflow: hidden;
	}
	#xmas_pack .menu_wrap h3{
		width: min(110vw, 741px);
	}
}

#sogyokinensai2.wrap-rb{
	background: url(../osusume/img/sogyo_bg.jpg) repeat center bottom;
	/* max-width: 712px; */
	padding: 0 0 30px;
}
#sogyokinensai2 .menuTtl{
	width: 100%;
	background: url(../osusume/img/sogyo_ttl_bg.jpg) no-repeat center center;
	background-size: cover;
	padding: 48px 15px 30px;
}
#sogyokinensai2 .menuTtl h3{
	text-align: center;
}
#sogyokinensai2 .menuTtl h3 img{
	max-width: 100%;
	height: auto;
}
#sogyokinensai2 .menu_wrap{
	/* max-width: 712px; */
	margin: 30px auto 0;
	padding: 0 15px;
}
