@charset "utf-8";
body {font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;letter-spacing: 0.1em; line-height:1em;font-size: 15px;color: #466b7f}
body,html {height: 100%;}
/*delete>>body {background: lightgray}*/
.textout {overflow: hidden;white-space: nowrap;text-indent: 100%;}
.bg {height: 0;background: center center /cover no-repeat;}
.content {width: 940px;margin: 0 auto;text-align: center}
a:hover,a:active {opacity: .7;}
.w100 {width: 100%;}
.br:after {content: "\A";white-space: pre ;}
.justsp {display: none;}
.fade {opacity:0;position: relative;top: 15px;transition: .7s;}
.fade.nomv{top:0}
.fade.view{opacity: 1;top:0}

#wrapper {min-width: 940px;max-width: 1400px;margin: 0 auto;background: white;padding-bottom: 100px;position: relative}
#wrapper >header h1{text-align: center;margin-bottom: 30px; padding-top:calc(720/1280*100%);background-image: url(../images/top_main.jpg); }
#wrapper >header p {margin-bottom:100px;text-align: center;}
#wrapper >header p img {width: 435px;max-width: 80%;}

#wrapper >nav {height:100vh;width: 100%;overflow: hidden;background: #64c8eb; position: absolute;text-align: center;padding: 6em 0 4em;z-index: 250;}
#wrapper >nav ul {margin-bottom: 2.5em;}
#wrapper >nav li {max-width: 171px;margin: 0 auto;padding-bottom:1.5em;position: relative;background:center top /contain no-repeat;}
#wrapper >nav li a {display: block;height: 1em;margin: 0 auto;min-width: 171px; overflow: hidden;white-space: nowrap;text-indent: 100%;}
#wrapper >nav li:nth-of-type(1) {background-image: url(../images/nav_menu1.gif)}
#wrapper >nav li:nth-of-type(2) {background-image: url(../images/nav_menu2.gif);}
#wrapper >nav li:nth-of-type(3) a {height: 2.6em;}
#wrapper >nav li:nth-of-type(3) {background-image: url(../images/nav_menu4.gif)}
#wrapper >nav li:nth-of-type(4) {background-image: url(../images/nav_menu5.gif)}
#wrapper >nav li:nth-of-type(5) {background-image: url(../images/nav_menu6.gif);}
#wrapper >nav li:nth-of-type(5) a {height: 2.5em;}
#wrapper >nav li:nth-of-type(1),
#wrapper >nav li:nth-of-type(4),
#wrapper >nav li:nth-of-type(5) {padding-bottom: 2.5em; margin-top:1.5em; margin-bottom:1.5em; }
#wrapper >nav li:nth-of-type(1):after,
#wrapper >nav li:nth-of-type(3):after,
#wrapper >nav li:nth-of-type(4):after {content:url(../images/nav_point.gif);position: absolute;left: 48%;bottom: 0}
#wrapper >nav img {max-width: 82px;}
#menuBtn {position: absolute;right: 1em;top: 1em;background:#64c8eb url(../images/nav_menu_open.gif) no-repeat left top /contain;width: 57px;height: 57px; z-index: 300;}
#menuBtn:hover {cursor: pointer;}

#wrapper >nav {display: none;}
#menuBtn.on {background-image: url(../images/nav_menu_close.gif);}

#concept>p:nth-of-type(1) {margin-bottom: 90px;padding-top:calc(535/940*100%);background-image: url(../images/top_image1.jpg);}
#concept>div {margin-bottom: 75px;}
#concept>div p {height: 265px; line-height: 2em;box-sizing: border-box;padding-top: 4em}
#concept>div p:nth-child(1){padding-left: 50%;background: url(../images/top_image2.jpg) no-repeat left top /contain;}
#concept>div p:nth-child(2){padding-right: 50%;background: url(../images/top_image3.jpg) no-repeat right top /contain;}
#concept>p:nth-of-type(2) {margin: 0 auto;background: url(../images/top_title.gif) no-repeat center center; height: 22px;max-width: 80%;margin-bottom: 100px;}

.menu header {margin: 0 20px;position: relative;margin-bottom: 90px;}
.menu header img.time {position: absolute;left: 20px;top: 12%;}
.menu header h1 {height: 0; padding-top:calc(570/1280*100%);}
.menu section>h1 {height: 1.5em; margin-bottom: 20px;overflow: hidden;white-space: nowrap;text-indent: 100%;background:center top no-repeat}
.menu p {letter-spacing: 0;line-height: 2em; margin-bottom: 2em;}
.menu p.point {padding-top: 40px; margin-bottom: 3em !important;position:relative;}
.menu p.point:before {content: "●";font-size: .7em; color: #87d6f1; position: absolute;left: 49.5%;top: 0}
.menu p:not([class='point']){font-size: .95em;}
.menu .info {font-size: .75em!important;margin-top: -.5em;}
.menu .viewmenu {display: block;width: 237px; height: 35px;margin: 0 auto;background:center top no-repeat;overflow: hidden;white-space: nowrap;text-indent: 100%;margin-top: 2em; margin-bottom: 100px;}
.menu h2 {height: 13px; margin-bottom: 10px;overflow: hidden;white-space: nowrap;text-indent: 100%;background:center top no-repeat}

#lunch header h1 {background-image: url(../images/lunch_main.jpg);}
#lunch section>h1 {background-image: url(../images/lunch_title.gif);}
#lunch section>h2:nth-of-type(1) {background-image: url(../images/lunch_sub1.gif);}
#lunch section>h2:nth-of-type(2) {background-image: url(../images/lunch_sub2.gif);}
#lunch .viewmenu {background-image: url(../images/lunch_viewmenu.gif);}

#cafe header h1 {background-image: url(../images/cafe_main.jpg);}
#cafe section>h1 {background-image: url(../images/cafe_title.gif);}
#cafe section>h2 {background-image: url(../images/cafe_sub1.gif);height: 17px;}
#cafe .viewmenu {background-image: url(../images/cafe_viewmenu.gif);}

#dinner header h1 {background-image: url(../images/dinner_main.jpg);}
#dinner section>h1 {background-image: url(../images/dinner_title.gif);}
#dinner section>h2 {background-image: url(../images/dinner_sub1.gif);}
#dinner .viewmenu {background-image: url(../images/dinner_viewmenu.gif);}

#interior {position: relative;}
#interior header {letter-spacing: 0; background: #64c8eb;width: 33%;height: 100%;box-sizing: border-box;position: absolute;right: 0;top:0; color: white;z-index: 300;}
#interior header h1 {height: 21px; background: url(../images/interior_logo.gif) no-repeat center top;margin-bottom: 2em;}
#interior header p {text-align: center;line-height: 1.8em;}
#interior header p span {display: block; margin-top: 2em;font-size: .9em;line-height: 2em;}
#interior #slide {position: relative;}
#interior ul {background: #64c8eb;}
#interior li {width: 67%;}
#interior li img {width: 100%;vertical-align: bottom}
#pager {position: absolute;left: 0;bottom: 1em;z-index: 300;width: 67%;text-align: center}
#pager span {display: inline-block;width: 30px;border-bottom: 3px solid white;height: 5px;}
#pager span:hover {cursor: pointer;}
#pager span:not(:last-child){margin-right: 20px;}
#pager span.cycle-pager-active{border-color: #aaf0ff;}

#shopInfo {text-align: left;background-color: #f1f3f4;width: 100%;overflow: hidden;}
#shopInfo>h1 {height: 22px; background: url(../images/shopinfo_title.gif) top no-repeat;overflow: hidden;white-space: nowrap;text-indent: 100%;margin-top: 90px;margin-bottom: 65px;}
#shopInfo >dl {font-size: .96em; line-height: 2em;width: 60em;padding-left: 12%; margin: 0 auto;margin-bottom: 85px;}
#shopInfo >dl>dt {height: 2em; box-sizing: border-box;float: left; position: relative;width: 270px;overflow: hidden;white-space: nowrap;text-indent: 100%;}
#shopInfo >dl>dd {box-sizing: border-box;padding-left: 370px;margin-bottom: 1.5em;}

#shopInfo >dl>dt:nth-of-type(1){background: url(../images/shopinfo_sub1.gif) no-repeat left center;}
#shopInfo >dl>dt:nth-of-type(2){background: url(../images/shopinfo_sub2.gif) no-repeat left center;}
#shopInfo >dl>dt:nth-of-type(3){background: url(../images/shopinfo_sub3.gif) no-repeat left center;}
#shopInfo >dl>dt:nth-of-type(4){background: url(../images/shopinfo_sub4.gif) no-repeat left center;}
#shopInfo >dl>dt:nth-of-type(5){background: url(../images/shopinfo_sub5.gif) no-repeat left center;}
#shopInfo >dl>dt:nth-of-type(6){background: url(../images/shopinfo_sub6.gif) no-repeat left center;}
#shopInfo >dl>dt:nth-of-type(7){background: url(../images/shopinfo_sub7.gif) no-repeat left center;}

#shopInfo dd dt {float: left;}
#shopInfo dd dd {padding-left: 100px;}
#shopInfo dd dd .left-space {
	margin-left: 5.5em;
}

#gMap {background-color: #f1f3f4;width: 100%;height: 356px; margin-bottom: 75px;}

footer {padding-top: 185px; background: url(../images/footer_milk.gif) no-repeat center top;text-align: left!important;}
footer a {text-decoration: none;color: #00aeeb}
footer p {position: relative;border:1px solid #ccc;padding: 1em;border-radius: 3em;font-size: .85em; line-height: 2em; margin-bottom: 30px;}
footer p span {display: block;}
footer p a {display: block;}
footer p:hover,footer p:active {border-color: #e0e0e0;opacity: .7}
footer p img {float: left; margin:0 2em 0 3em;width: 197px;}
footer p:after {content: url(../images/footer_icon.gif);position: absolute;right: 4em; top: 38%;}
footer small {display: block;text-align: center;font-family: "Lucida Sans Unicode", "Lucida Grande", "sans-serif";font-size: .7em;letter-spacing: .05em;color: #84A2B1}

aside#totop {position: fixed; right: 10px; bottom: 10px; cursor: pointer;z-index:350;}

.marker{
	display: inline;
	background:linear-gradient(transparent 60%, #DCEAEA 0%);
}

.news{
	border:1px solid red;
	width:70%;
	margin:0 auto 20px;
	padding:20px 10PX 10px;
	line-height: 30px;
	text-align: center;
	color:#7C8188;
}
.news dt{
	font-size: 1em;
	font-weight:bold;
}
.news dd a{
	color:red;
}
.news dd.green a{
	color:green;
}

.news dd a:hover{
	opacity:0.5;
}

.img_item01 {
	font-size: 12px;
	margin:-48px 0 -200px;
	text-align:right;
}
.img_item02 {
	font-size: 12px !important;;
	margin:-90px 15px 0;
	padding-bottom:30px;
	text-align:right;
}

.mt-60{
	margin-top:-60px;
}
.mb-60{
	margin-bottom:60px;
}
.red{
	color:red;
}
.green{
	color:green;
}
.txt-m{
	font-size:1.2em;
}
.pc-none{
	display: none;
}


/*SP幅*/
@media screen and (max-width: 640px) {
	body{font-size:3.5vw;}
	.content {width: auto;margin: 0 4%;}
	.br, .nosp {display: none!important;}
	.justsp {display: inline!important;}
	
	#wrapper {width: auto;min-width: auto;max-width: auto;padding-bottom: 2em;}
	#wrapper >header h1 {background-image: url(../images/sp/sp_top_main.jpg);padding-top: calc(780/640*100%);margin-bottom: 2.5em;}
	#wrapper >header p {text-align: center;margin-bottom:4em;}
	#wrapper >header p img {width: 455px;}
	
	#menuBtn {opacity: 1;}
	
	#concept.content {margin: 0 6%;}
	#concept>p:nth-of-type(1) {padding-top:calc(318/560*100%);background-image: url(../images/sp/sp_top_image1.jpg);margin-bottom: 2.5em;}
	#concept>div {margin-bottom: 2.5em;}
	#concept>div p {padding-top: 0; height: auto;margin-bottom: 2.5em}
	#concept>div p:nth-child(1){padding-left: 0;padding-bottom:calc(315/560*100%);background: url(../images/sp/sp_top_image2.jpg) no-repeat left bottom /contain;}
	#concept>div p:nth-child(2){padding-right: 0;padding-bottom:calc(315/560*100%);background: url(../images/sp/sp_top_image3.jpg) no-repeat left bottom /contain;}
	#concept>div p span {display: block;margin-bottom: 2.5em;}
	#concept>p:nth-of-type(2) {background: url(../images/sp/sp_top_title.gif) no-repeat center center /contain;height: 68px;margin-bottom: 3.5em;}
	
	.menu header {margin: 0;margin-bottom: 2.5em;}
	.menu header img.time {display: none;}
	.menu header h1 {padding-top:calc(426/640*100%);}
	.menu section>h1 {width: 80%;margin: 0 auto;height: 3.7em;margin-bottom: 1em; background-size: contain;}
	.menu p {margin-bottom: 2em;}
	.menu p span {display: block;}
	.menu p.point {padding-top: 2.5em; margin-bottom: 2.5em !important;}
	.menu .viewmenu {max-width: 90%; width: 445px; height: 60px;background:center top /contain no-repeat;margin-bottom: 4em;margin-top: 0;}
	.menu h2 {height: 1.2em!important; margin-bottom: 1em;background:center top /contain no-repeat}
	
	#lunch header h1 {background-image: url(../images/sp/sp_lunch_main.jpg);}
	#lunch section>h1 {background-image: url(../images/sp/sp_lunch_title.gif);}
	#lunch section>h2:nth-of-type(1) {background-image: url(../images/sp/sp_lunch_sub1.gif);}
	#lunch section>h2:nth-of-type(2) {background-image: url(../images/sp/sp_lunch_sub2.gif);}
	#lunch .viewmenu {background-image: url(../images/sp/sp_lunch_viewmenu.gif);}

	#cafe header h1 {background-image: url(../images/sp/sp_cafe_main.jpg);}
	#cafe section>h1 {background-image: url(../images/sp/sp_cafe_title.gif);height: 1.5em;}
	#cafe section>h2 {background-image: url(../images/sp/sp_cafe_sub1.gif);}
	#cafe .viewmenu {background-image: url(../images/sp/sp_cafe_viewmenu.gif);}

	#dinner header h1 {background-image: url(../images/sp/sp_dinner_main.jpg);}
	#dinner section>h1 {background-image: url(../images/sp/sp_dinner_title.gif);}
	#dinner section>h2 {background-image: url(../images/sp/sp_dinner_sub1.gif);}
	#dinner .viewmenu {background-image: url(../images/sp/sp_dinner_viewmenu.gif);}

	#interior header {width: 100%;position: relative;padding: 2.5em 4%;}
	#interior header h1 {height: 27px; background: url(../images/sp/sp_interior_logo.gif) no-repeat center top /contain;margin-top: 0;margin-bottom: 2em;}
	#interior header p {position: static;transform: translate(0);}
	#interior ul {background: white;}
	#interior li {width: 100%;}
	#pager {width: 100%;}
	
	#shopInfo {text-align: left;margin:0;}
	#shopInfo>h1 {width: 80%;margin: 0 auto;height: 1.5em; background: url(../images/sp/sp_shopinfo_title.gif) center top /contain no-repeat;margin-bottom: 2.5em;margin-top: 4em;}
	#shopInfo >dl {width: 95%; font-size: .95em; padding-left:1em;margin-bottom: 2.5em;}
	#shopInfo >dl>dt {min-height: 3em;width: 40%;max-width: 235px; background-position:0 .5em!important;}
	#shopInfo >dl>dt:after {content:none}
	#shopInfo >dl>dd {padding-left: 46%;margin-bottom: 2.2em;}
	#shopInfo >dl>dd span {display: block;}

	#shopInfo >dl>dt:nth-of-type(1){background: url(../images/sp/sp_shopinfo_sub1.gif) no-repeat left center /contain;}
	#shopInfo >dl>dt:nth-of-type(2){background: url(../images/sp/sp_shopinfo_sub2.gif) no-repeat left center /contain;}
	#shopInfo >dl>dt:nth-of-type(3){background: url(../images/sp/sp_shopinfo_sub3.gif) no-repeat left center /contain;}
	#shopInfo >dl>dt:nth-of-type(4){background: url(../images/sp/sp_shopinfo_sub4.gif) no-repeat left center /contain;}
	#shopInfo >dl>dt:nth-of-type(5){background: url(../images/sp/sp_shopinfo_sub5.gif) no-repeat left center /contain;}
	#shopInfo >dl>dt:nth-of-type(6){background: url(../images/sp/sp_shopinfo_sub6.gif) no-repeat left center /contain;}
	#shopInfo >dl>dt:nth-of-type(7){background: url(../images/sp/sp_shopinfo_sub7.gif) no-repeat left center /contain;}

	#shopInfo dd dt {float: none;}
	#shopInfo dd dd {padding-left: 0; float: none;}
	#shopInfo dd dd .left-space {
		margin-left: 0;
	}
	#shopInfo dd li {text-indent: -1em;}
	
	#gMap {width: 100%;height: 18em; margin-bottom: 3em;}

	footer {padding-top: 11em; background-image: url(../images/sp/sp_footer_milk.gif);background-size: contain;}
	footer p {padding: 1.5em 1em 1.2em 1.3em;border-radius: 1.5em;line-height: 1.7em; margin-bottom: 1.5em;}
	footer p span {display: inline;}
	footer p img {display: block;float: none; margin:0 auto 1em;width: 255px;}
	footer p:after {content: url(../images/sp/sp_footer_icon.gif);position: absolute;right: 1.5em; bottom: .7em;top: auto;}

	aside#totop  {width: 71px;}
	aside#totop img {width: 100%;}
	
	
	.news{
	width:95%;
	margin:-30px auto 20px;
	padding:10px 0;
	line-height: 20px;
	}
	

.img_item01{
	margin:-30px 0 0;
	text-align:right;
}
.img_item02{
	margin:-35px 0 0;
	padding-bottom:0;
	text-align:right;
}

.sp-mt20{
	margin-top: 20px;
}
.sp-mt20{
	margin-top: 20px;
}
.sp-mt30{
	margin-top: 30px;
}
	

.pc-none{
	display: block;
}

.sp-none{
	display: none;
}


}

@media screen and (max-width: 450px) {
	#wrapper >nav {padding-top: 7.5em;}
	#wrapper >nav ul {margin-bottom: 2em;}
	#wrapper >nav li {padding-bottom: 1em;}
	#wrapper >nav li:nth-of-type(1),
	#wrapper >nav li:nth-of-type(4),
	#wrapper >nav li:nth-of-type(5) {padding-bottom: 2em;margin-bottom: 1em;}
	#wrapper >nav img {max-width: 20%;}

	#menuBtn {width: 4em;height: 4em;}
	aside#totop  {width: 4em;}
	aside#totop img {width: 100%;}
}
@media screen and (max-width: 320px) {
	footer small span {display: block;line-height: 2em;}
}