/* lower
======================================== */
#main{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
#main h2{
	width: 100%;
	text-align: center;
	color: #fff;
	font-family: 'Cormorant Garamond', serif;
	font-weight: 500;
	font-size: 40px;
	line-height: 1.1;
}
.page-concept #main{
	background: url(http://obasse.com/img/concept/main.jpg) no-repeat center center;
	background-size: cover;
}
.page-room #main{
	background: url(http://obasse.com/img/room/main.jpg) no-repeat center center;
	background-size: cover;
}
.page-menu #main{
	background: url(http://obasse.com/img/menu/main.jpg) no-repeat center center;
	background-size: cover;
}
.page-access #main{
	background: url(http://obasse.com/img/access/main.jpg) no-repeat center center;
	background-size: cover;
}
.page-reservation #main{
	background: url(http://obasse.com/img/reservation/main.jpg) no-repeat center center;
	background-size: cover;
}

/*content*/
#contents{
	padding: 0 0 90px;
}
#contents .section{
	max-width: 1020px;
	margin: 70px auto 0 auto;
}
#contents .section-full{
	max-width: 100%;
	margin: 80px auto 0 auto;
}

/*intro*/
#contents #intro{
	text-align: center;
}
#contents #intro h3{
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	font-size: 20px;
	line-height: 1.8;
	text-align: center;
}
#contents #intro p{
	margin-top: 30px;
	font-family: 'Cormorant Garamond', serif;
	font-weight: 500;
	font-size: 17px;
	line-height: 1.8;
	text-align: center;
}
/*title-set*/
#contents .title-set h4{
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	font-size: 28px;
	line-height: 1.1;
}
#contents .title-set p{
	font-family: 'Cormorant Garamond', serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.1;
	margin-top: 8px;
}
/*col*/
#contents .col2,
#contents .col3{
	font-size: 0;
}
#contents .col2 > li{
	display: inline-block;
	width: 47.5%;
	vertical-align: top;
	margin-right: 5%;
	margin-top: 30px;
}
#contents .col2 > li:nth-child(2n){
	margin-right: 0;
}
#contents .col1 p,
#contents .col2 li p{
	font-size:14px;
	line-height: 1.8;
}
#contents .col1 .en,
#contents .col2 li .en{
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 13px;
	line-height: 1.6;
	color: #63514c;
}
#contents .col3 li{
	display: inline-block;
	width: 30%;
	vertical-align: top;
	margin-right: 5%;
	margin-top: 30px;
}
#contents .col3 li:nth-child(3n){
	margin-right: 0;
}

/*CONCEPT
====================*/
.page-concept #contents .photo-bg{
	width: 100%;
	background-size: cover;
}
#foodstuffs .photo-bg{
	background: url(http://obasse.com/img/concept/photo01_1.jpg) no-repeat center center;
}
#dish .photo-bg{
	background: url(http://obasse.com/img/concept/photo02_1.jpg) no-repeat center center;
}
#profile .photo-bg{
	background: url(http://obasse.com/img/concept/photo03_1.jpg) no-repeat center center;
}
#profile.section-full{
	margin: 0 auto;
}
#profile h4,
#profile p{
	text-align: center;
}
#profile .title-set{
	margin-bottom: 30px;
}
#profile p.en{
	margin-top: 20px;
}

/*MENU
====================*/
.page-menu #contents{
	padding: 0 0 0;
}
.page-menu #menu-area{
	background: url(http://obasse.com/img/menu/menu_bg_pc.jpg) no-repeat top center;
	background-size: 2300px 1616px;
	height: 1615px;
}
.page-menu #menu-area h4{
	font-family: 'Cormorant Garamond', serif;
	font-weight: 500;
	font-size: 35px;
	line-height: 1.1;
	text-align: center;
}
.page-menu #menu-area h3{
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	font-size: 22px;
	line-height: 1.1;
	text-align: center;
	margin-top: 10px;
	font-weight: normal;
}
.page-menu #menu-area table.menu-list{
	width: 100%;
	margin-top: 40px;
}
.page-menu #menu-area td{
	width: 50%;
	padding: 12px 0;
}
.page-menu #menu-area td.jp{
	text-align: right;
	padding-right: 50px;
}
.page-menu #menu-area td.en{
	border-left: solid 1px #e5e5e5;
	padding-left: 50px;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	color: #63514c;
}
.page-menu #menu-area #dinner{
	margin-top: 430px;
}
.page-menu #menu-area #dinner .note-jp{
	margin-top: 40px;
	font-size: 13px;
	text-align: center;
	line-height: 1.6;
}
.page-menu #menu-area #dinner .note-en{
	margin-top: 15px;
	font-size: 12px;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	color: #63514c;
	text-align: center;
	line-height: 1.6;
}
.page-menu .menu-image{
	display: none;
}

/*ROOM
====================*/
.page-room #contents .photo-bg{
	width: 100%;
	background-size: cover;
}
#floor1 .photo-bg{
	background: url(http://obasse.com/img/room/photo01_1.jpg) no-repeat center center;
}
#floor2 .photo-bg{
	background: url(http://obasse.com/img/room/photo02_1.jpg) no-repeat center center;
}
#floor3 .photo-bg{
	background: url(http://obasse.com/img/room/photo03_1.jpg) no-repeat center center;
}
.page-room h4.floor-num{
	font-family: 'Cardo', serif;
	font-weight: 400;
	font-size: 50px;
	line-height: 1.1;
}
.page-room h4.floor-num span{
	font-size: 20px;
	display: block;
}
.page-room p{
	margin-top: 15px;
}
.page-room .floor-photo{
	font-size: 20px;
}

/*ACCESS
====================*/
.page-access #contents{
	padding: 0 0 0;
}
.page-access #contents .section{
	max-width: 800px;
	margin: 70px auto 0 auto;
}
.page-access a{
	color: #41342f;
}
.page-access .tab{
	font-size: 0;
	border-bottom: solid 1px #302926;
	margin-top: 60px;
}
.page-access .tab li{
	display: inline-block;
	width: 50%;
	font-size: 14px;
	font-weight: bold;
	cursor: pointer;
	text-align: center;
	padding: 10px 0;
	transition-duration: .4s;
}
.page-access .tab li:hover{
	background: #e5e5e5;
}
.page-access .tab li.select{
	background: #302926;
	color: #fafafa;
}
.page-access .access_table table{
	border-collapse: collapse;
	width: 100%;
}
.page-access .access_table th,
.page-access .access_table td{
	border-bottom: solid 1px #e5e5e5;
	padding: 15px 0;
}
.page-access .access_table tr:last-child th,
.page-access .access_table tr:last-child td{
	border-bottom: none;
}
.page-access .access_table th{
	width: 20%;
	padding-left: 20px;
	padding-right: 20px;
}
.page-access .access_table td{
	width: 80%;
}
.page-access .access_table td span,
.page-access .access_table td .note{
	font-size: 12px;
}
.page-access .access_table table h4{
	line-height: 1.1;
	margin-bottom: 6px;
}
.page-access .access_table table p + h4{
	margin-top: 1.2em;
}
.page-access .access_table table p + p{
	margin-top: .5em;
}
.page-access .access_table table p{
	line-height: 1.4;
}
.page-access .access_table table.en{
	display: none;
}
.page-access .access_table table.en h4{
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.4;
	color: #63514c;
}
.page-access .access_table table.en th,
.page-access .access_table table.en td{
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.4;
	color: #63514c;
}
.page-access .btm_photo{
	font-size: 0;
	margin-top: 60px;
}
.page-access .btm_photo li{
	display: inline-block;
	width: 33.3333%;
}
.page-access .map-area{
	max-width: 500px;
	margin: 40px auto 0;
	text-align: center;
}
.page-access .bt_more{
	display: inline-block;
	font-family: 'Lato', sans-serif;
	font-weight: 700;
	margin-top: 40px;
}
.page-access .bt_more a{
	display: block;
	padding: 8px 14px;
	color: #9b957e;
	border: solid 1px #bfbaa9;
	border-radius: 20px;
	transition-duration: .2s;
}
.page-access .bt_more a:hover{
	background: #bfbaa9;
	color: #fff;
}

/*RESERVATION
====================*/
.page-reservation .border{
	padding: 60px 0 0 0;
	border-top: solid 1px #e5e5e5;
}
.page-reservation .tel{
	font-family: 'Cardo', serif;
	font-weight: 400;
	font-size: 30px;
	text-align: center;
}
.page-reservation .tel a{
	color: #41342f;
}
.page-reservation .hp{
	width: 700px;
	margin: 40px auto 0;
}
.page-reservation .reserve-table{
	font-size: 14px;
}
.page-reservation .reserve-table th,
.page-reservation .reserve-table td{
	padding: 5px 0;
}
.page-reservation .reserve-table th{
	padding-right: 20px;
}
.page-reservation #contents .col2 li{
	margin-top: 0;
}
.page-reservation #contents .col2 li p{
	margin-top: 20px;
	font-size: 13px;
	line-height: 1.6;
}
.page-reservation .en th,
.page-reservation .en td,
.page-reservation .en p{
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.5;
	color: #63514c;
}
.page-reservation .bt_hp{
	margin-top: 30px;
	text-align: center;
}
.page-reservation .bt_hp a{
	display: block;
	background: #302926;
	color: #fff;
	text-align: center;
	padding: 15px 0;
	font-size: 20px;
	line-height: 1.1;
	font-weight: bold;
	transition-duration: .4s;
}
.page-reservation .bt_hp a:hover{
	opacity: .7;
}
.page-reservation .bt_hp span{
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 12px;
}
#ticket h4{
	margin-top: 40px;
}
#ticket p{
	margin-top: 20px;
}
#ticket .note{
	margin-top: 20px;
}
#ticket .note li{
	margin-top: 5px;
	font-size: 13px;
	text-indent: -1em;
	margin-left: 1em;
	line-height: 1.4;
}

/* Responsive Styles
======================================== */
@media only screen and (max-width: 1280px) {
	#contents .section{
		max-width: 85%;
	}
}
@media only screen and (max-width: 1080px) {
	/*ACCESS
	====================*/
	.page-access .sub_photo{
		width: 85%;
		margin: 0 auto;
	}
}
@media only screen and (max-width: 768px) {
	/*intro*/
	#contents #intro h3{
		font-size: 18px;
		line-height: 1.7;
		text-align: left;
	}
	#contents #intro p{
		font-size: 16px;
		line-height: 1.6;
		text-align: left;
	}
	#contents #intro h3,
	#contents #intro p{
		text-align:justify;
		text-justify: inter-ideograph;
	}
	#contents #intro br{
		display: none;
	}
	/*col*/
	#contents .col2 > li{
		display: block;
		width: 100%;
		margin-right: 0;
		margin-top: 20px;
	}
	#contents .col1 p,
	#contents .col2 li p{
		font-size:14px;
		line-height: 1.6;
		text-align:justify;
		text-justify: inter-ideograph;
	}
	#contents .col1 .en,
	#contents .col2 li .en{
		font-size: 12px;
		line-height: 1.4;
	}
	#contents .col3 li{
		width: 33.3333%;
		margin-right: 0;
	}
	/*CONCEPT
	====================*/
	#profile h4,
	#profile p{
		text-align: left;
	}
	/*MENU
	====================*/
	.page-menu #contents{
		padding: 0 0 0;
	}
	.page-menu #contents #lunch.section{
		margin: 0px auto 0 auto;
	}
	.page-menu #menu-area{
		background: none;
		height: auto;
	}
	.page-menu #menu-area table.menu-list{
		width: 100%;
		margin-top: 20px;
	}
	.page-menu #menu-area td{
		width: 50%;
		padding: 6px 0;
	}
	.page-menu #menu-area #dinner{
		margin-top: 0;
	}
	.page-menu #menu-area #dinner .note-jp{
		margin-top: 20px;
	}
	.page-menu #menu-area #dinner .note-en{
		margin-top: 8px;
	}
	.page-menu .menu-image{
		display: block;
	}
	
	/*RESERVATION
	====================*/
	.page-reservation #contents .col2 li:last-child{
		margin-top: 30px;
	}
	.page-reservation #contents .col2 li p{
		margin-top: 10px;
	}
}
@media screen and (max-width: 480px) {
	/*content*/
	#contents{
		padding: 0 0 60px;
	}
	#contents .section{
		margin: 35px auto 0 auto;
	}
	#contents .section-full{
		margin: 40px auto 0 auto;
	}
	/*intro*/
	#contents #intro h3{
		font-size: 16px;
		line-height: 1.6;
		text-align: left;
	}
	#contents #intro p{
		margin-top: 15px;
		font-size: 15px;
		line-height: 1.4;
		text-align: left;
	}
	#contents #intro h3,
	#contents #intro p{
		text-align:justify;
		text-justify: inter-ideograph;
	}
	#contents #intro br{
		display: none;
	}
	/*title-set*/
	#contents .title-set{
		padding-bottom: 5px;
	}
	#contents .title-set h4{
		font-size: 22px;
		line-height: 1.3;
	}
	#contents .title-set p{
		font-size: 16px;
		line-height: 1.1;
		margin-top: 6px;
	}
	
	/*CONCEPT
	====================*/
	#profile.section-full{
		margin: 0 auto;
	}
	#profile br{
		display: none;
	}
	
	/*MENU
	====================*/
	.page-menu #contents{
		padding: 0 0 30px;
	}
	.page-menu #menu-area td.jp{
		padding-right: 25px;
	}
	.page-menu #menu-area td.en{
		padding-left: 25px;
	}
	
	/*ROOM
	====================*/
	.page-room #contents .section-full{
		margin: 65px auto 0 auto;
	}
	.page-room h4.floor-num{
		text-align: center;
		font-size: 40px;
	}
	.page-room h4.floor-num span{
		text-align: center;
	}
	
	/*ACCESS
	====================*/
	.page-access #contents .section{
		margin: 35px auto 0 auto;
	}
	.page-access .access_table th{
		display: block;
		width: 100%;
		border-bottom: none;
		padding: 15px 8% 5px 8%;
		font-weight: bold;
	}
	.page-access .access_table td{
		display: block;
		width: 100%;
		border-bottom: solid 1px #e5e5e5;
		padding: 0 8% 15px 8%;
	}
	.page-access .access_table table.en th{
		font-weight: 700;
	}
	.page-access .access_table th:empty{
		padding: 10px 8% 0 8%;
	}
	
	/*RESERVATION
	====================*/
	.page-reservation .border{
		padding: 35px 0 0 0;
		border-top: solid 1px #e5e5e5;
	}
}