@charset "UTF-8";

/*-----------------------
 main
 -----------------------*/
 .smLogo{
	 margin-top: 30px;
 }
 
 body, html, main {
    /* important */
    height: 100%;
}

#concept{
	position: relative;
}


.conceptText{
	margin:  0 auto;
	text-align: center;
/*	background-image: url(../images/top/concept_back.png) ;
background-repeat: no-repeat;*/	
	max-width: 380px;
	line-height: 200%;
	margin-top: 30px;
	padding: 0 20px;
}

.conceptText h2{
	border-bottom: 1px solid;
	width: 93px;
	margin: 0 auto;
	padding-bottom: 10px;
	margin-bottom: 20px;
	font-size: 28px;
	letter-spacing: 0.3em;
}

#dropmenu {
    max-width: 720px;
    margin: 60px auto;
}

.coment,.textWrapper{
	font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
}

.coment{
	font-size: 12px;
}

.back{
	padding-left: 60px;
}

.coment,.yoyaku{
	text-align: center;
}

.left,.right{
	padding: 0 100px;
}

.menutext{
	float: left;
}

.price{
	float: right;
}

.photo {
	width: 100%;
}

.text h3{
	font-size: 40px;
	text-align: center;
	padding: 10px 0;
	margin-bottom: 5px;
	font-weight: bold;
}

.textWrapper{
	width: 300px;
	margin: 15px 0;
	
}

.title{
	text-align: center;
	margin-top: 90px;
	letter-spacing: 0.3em;
	border-bottom: 1px solid;
	padding-bottom: 10px;
	margin-bottom: 5px;
}

.detail{
	padding: 30px 0;
	font-size: 13px;
	font-family:"Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
	
}

.menuWrapper{
	margin: 0 auto !important;
	padding: 80px 0 0;
}

.reserved {
    margin: 50px auto 0;
}

.style{
	margin-top: 80px;
	margin-bottom: 80px;
}

.style li{
	float: left;
	padding-right: 10px;
}


 @media only screen and (max-width: 480px) {
	 
	 .left, .right {
    padding: 0 30px;
}
	 
	 
.title {
    margin-top: 50px;
}
	 
.left img{
    padding-left: 38px;		 
	 }
	 
.yoyaku img{
    padding-left: 0;		 
	 }
	 
	 .reserved {
    max-width: 48%;
}
	
	 .reserved img{
    max-width: 100%;
}
.style li {
    padding-left: 15px;
	padding-bottom: 20px;
}
	 
}


 @media only screen and (max-width: 320px) {
	 
.textWrapper {
    width: 260px;
	 }
	 
	 .style li {
		 width: 50%;
}

	 
}