@charset "UTF-8";

/* INTERFACE */

br.sp{
	display:none;
}

body header nav{
	display:none;
	background-color:#fff;
	padding:30px 40px;
	border:1px solid #082e6c;
	position:absolute;
	top:0;
	right:0;
	z-index:1;
}

body header nav ul{
	margin:0;
	padding:0;
	list-style-type:none;
	font-size:15px;
}

body header nav ul li{
	padding:10px 0;
	border-bottom:1px dotted #ddd;
}

body footer{
	margin:100px 0 0;
	padding:100px 0 0;
	text-align:center;
	background-color:#082e6c;
	background-image:url("../img/interface/shape_forest02.png");
	background-repeat:no-repeat;
	background-position:top center;
	background-size:100% auto;
}

body footer>a:hover{
	opacity:0.8;
}

body footer>a img{
	max-width:400px;
}

body footer>ul{
	margin:40px 0;
	padding:0 40px;
	list-style-type:none;
}

body footer>ul li{
	display:inline-block;
	margin:0 20px 10px;
	font-size:14px;
	font-weight:300;
}

body footer>ul li a:link,
body footer>ul li a:visited{
	color:#f7f1dd;
}

body footer>div{
	padding:40px 40px 60px;
	background-color:#062359;
}

body footer>div>a:link,
body footer>div>a:visited{
	display:block;
	margin:0 0 25px;
	font-size:11px;
	font-weight:300;
	line-height:1.4em;
	color:#fff;
}

body footer>div>a:hover,
body footer>div>a:active{
	text-decoration:none;
}

body footer>div>a img{
	width:150px;
}

body footer>div address{
	margin:0 0 50px;
	font-style:normal;
	font-size:14px;
	font-weight:300;
	color:#fff;
}

body footer>div address a:link,
body footer>div address a:visited{
	color:#fff;
}

body footer>div small{
	font-family:Verdana,sans-serif;
	font-size:9px;
	color:#89aae0;
}

/* HOME */

#home #key{
	position:relative;
	background-image:url(../img/key.jpg);
	background-repeat:no-repeat;
	background-size:150% auto;
	background-position:top center;
	background-attachment:fixed;
}

#home #key picture img{
	width:100%;
	vertical-align:bottom;
}

#home #key a img{
	max-width:380px;
	vertical-align:bottom;
	position:absolute;
	bottom:125px;
	left:50%;
	transform:translateX(-50%);
}

#home #key #language{
	position:absolute;
	top:25px;
	left:20px;
	font-size:15px;
	color:#fff;
}

#home #key #language a{
	font-size:15px;
	color:#fff;
}


#home #key h1{
	margin:0;
	padding:0 5px 5px;
	text-align:;
	font-size:12px;
	font-weight:300;
	color:#082e6c;
	background-color:#fff;
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
	z-index:1;
	overflow:hidden;
}

#home #key h1>span{
	display:block;
	padding:12px 25px 15px;
	border-bottom:1px solid #082e6c;
	border-left:1px solid #082e6c;
	border-right:1px solid #082e6c;
}

#home #key h1>span>span{
	display:block;
	padding:16px 0 0;
	float:right;
}

#home #key h1 img.logotype{
	width:150px;
	float:left;
	vertical-align:bottom;
}

#home #key h1 img.symbol{
	width:auto;
	height:80px;
	margin:0 10px 0 0;
	vertical-align:bottom;
}


#home #key_bottom{
	padding:0 30px;
	position:relative;
	top:-60px;
}

#home #key_bottom>div{
	max-width:1200px;
	height:140px;
	margin:0 auto;
	background-color:#fff;
	background-image:url(../img/interface/shape_birds.png);
	background-repeat:no-repeat;
	background-size:auto 80px;
	background-position:top 28px left 12.5%;
}

#home #welcome{
	min-height:500px;
	padding:0 60px;
	background-image:url(../img/interface/shape_forest.png);
	background-repeat:no-repeat;
	background-size:100% auto;
	background-position:center bottom;
}

#home #welcome>div{
	max-width:900px;
	margin:0 auto;
	overflow:hidden;
	position:relative;
	top:-140px;
}

#home #welcome>div .txt{
	width:47%;
	float:left;
	padding:12% 0 0;
}

#home #welcome>div .txt h2{
	margin:0 0 40px;
}

#home #welcome>div .txt h2 img{
	max-width:350px;
}

#home #welcome>div .txt h3{
	margin:40px 0 20px;
	font-size:18px;
	font-weight:500;
}

#home #welcome>div .txt p{
	margin:0 0 35px;
	text-align:justify;
	font-size:15px;
	font-weight:300;
	line-height:1.7em;
}

#home #welcome>div .pic{
	width:47%;
	float:right;
}

#home #welcome>div .pic img{
	width:100%;
	vertical-align:bottom;
}

#home #cottage{
	padding:20px 0 80px;
	background-image:url(../img/interface/bg_star.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:top center;
}

#home #cottage>div{
	max-width:960px;
	margin:0 auto;
	padding:0 10px;
	text-align:center;
}

#home #cottage>div h2{
	margin:0 0 40px;
	font-size:14px;
	font-weight:300;
	color:#fff;
}

#home #cottage>div h2 span{
	display:block;
	font-family: 'Montserrat', sans-serif;
	font-size:40px;
	letter-spacing:2px;
}

#home #cottage>div>div{
	display:flex;
	flex-wrap:wrap;
}

#home #cottage>div>div>div{
	width:33.33333%;
	box-sizing:border-box;
	padding:0 30px 40px;
}

#home #cottage>div>div>div a{
	font-size:14px;
	color:#fff;
}

#home #cottage>div>div>div a img{
	width:100%;
	margin:0 0 6px;
	vertical-align:bottom;
	border-radius:10px;
}

#home #cottage>div>div>div a:hover{
	text-decoration:none;
}

#home #cottage>div>div>div a:hover img{
	opacity:0.8;
}

#home #restaurant{
	min-height:330px;
	background-image:url("../img/restaurant_pic.jpg");
	background-repeat:no-repeat;
	background-size:55% auto;
	background-position:right top;
}

#home #restaurant>div{
	max-width:900px;
	margin:0 auto;
	padding:0 40px;
}

#home #restaurant>div>div{
	width:40%;
	padding:10% 0;
}

#home #restaurant>div h2{
	margin:0 0 30px;
	font-size:14px;
	font-weight:300;
}

#home #restaurant>div h2 span{
	display:block;
	font-family: 'Lato', sans-serif;
	font-size:30px;
	font-weight:400;
	letter-spacing:2px;
}

#home #restaurant>div p{
	margin:0 0 30px;
	text-align:justify;
	font-size:14px;
	font-weight:300;
	line-height:1.7em;
}

#home #bakery{
	min-height:330px;
	max-height:700px;
	background-image:url("../img/bakery_pic.jpg");
	background-repeat:no-repeat;
	background-size:55% auto;
	background-position:left top;
	background-color:#f7f1dd;
}

#home #bakery>div{
	max-width:900px;
	margin:0 auto;
	padding:0 40px;
	color:#664618;
}

#home #bakery>div>div{
	width:40%;
	margin:0 0 0 auto;
	padding:10% 0;
}

#home #bakery>div h2{
	margin:0 0 40px;
	font-size:14px;
	font-weight:300;
}

#home #bakery>div h2 span{
	display:block;
	font-family: 'Lato', sans-serif;
	font-size:30px;
	font-weight:400;
	letter-spacing:2px;
}

#home #bakery>div p{
	margin:0 0 40px;
	text-align:justify;
	font-size:14px;
	font-weight:300;
	line-height:1.7em;
}

@media screen and (max-width:700px){
	#home #restaurant>div>div{
		padding:8% 0;
	}
	#home #bakery>div>div{
		padding:8% 0;
	}
}


/* SUB */

#sub>article{
	max-width:2000px;
	margin:0 auto;
}

#sub #key{
	position:relative;
}

#sub #key picture img{
	width:100%;
	vertical-align:bottom;
}

#sub #key>a{
	margin:0;
	padding:0 5px 5px;
	font-size:12px;
	font-weight:300;
	color:#082e6c;
	background-color:#fff;
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
	z-index:1;
	overflow:hidden;
}

#sub #key>a>span{
	display:block;
	padding:12px 25px 15px;
	border-bottom:1px solid #082e6c;
	border-left:1px solid #082e6c;
	border-right:1px solid #082e6c;
}

#sub #key>a>span>span{
	display:block;
	padding:16px 0 0;
	float:right;
}

#sub #key>a>span img.logotype{
	width:150px;
	float:left;
	vertical-align:bottom;
}

#sub #key>a>span img.symbol{
	width:auto;
	height:80px;
	margin:0 10px 0 0;
	vertical-align:bottom;
}

#sub #key h1{
	width:300px;
	height:90px;
	text-align:center;
	color:#fff;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	background-image:url("../img/interface/title_bg.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

#sub #key h1 span{
	display:block;
	padding:8% 0 0;
	font-size:24px;
	font-weight:400;
	letter-spacing:2px;
}

#sub #key h1.picnone{
	width:450px;
	margin:0 auto;
	padding:200px 0 0;
	position:static;
	transform:none;
	background-image:none;
}

#sub #key h1.picnone>span{
	padding:9% 0;
	background-image:url("../img/interface/title_bg.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

#sub #contents{
	max-width:1000px;
	margin:0 auto;
	padding:70px 50px;
	text-align:center;
}

#sub #contents p.lead,
#villa #contents p.lead{
	margin:0 0 40px;
	font-size:17px;
	font-weight:300;
	line-height:2em;
}

#sub #contents p.lead sup,
#villa #contents p.lead sup{
	font-size:10px;
}

#sub #contents section{
	margin:100px 0;
	overflow:hidden;
	text-align:left;
}

#sub #contents section>img{
	width:100%;
	margin:0 0 40px;
	vertical-align:bottom;
}

#sub #contents section>img.f_left{
	width:40%;
	margin:0 50px 40px 0;
	float:left;
}

#sub #contents section>img.f_right{
	width:40%;
	margin:0 0 40px 50px;
	float:right;
}

#sub #contents section h2{
	display:inline-block;
	margin:0 0 70px;
	padding:0 0 25px;
	font-size:30px;
	font-weight:100;
	letter-spacing:1px;
	background-image:url("../img/interface/title_line.svg");
	background-repeat:no-repeat;
	background-size:60px 5px;
	background-position:bottom left;
}

#sub #contents section p{
	margin:0 0 40px;
	text-align:justify;
	font-size:16px;
	font-weight:300;
	line-height:2em;
}

#sub #contents section p b{
	font-size:16px;
	font-weight:500;
}

#sub #contents section ul{
	margin:0;
	padding:0 0 0 25px;
	font-size:15px;
	font-weight:300;
}

#sub #contents section ul li{
	margin:0 0 15px;
}

#sub #contents section div.iframe{
	width:100%;
	height:0;
	padding:50% 0 0;
	position:relative;
}

#sub #contents section div.iframe iframe{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}

#sub #contents section.center h2{
	display:block;
	text-align:center;
	background-image:url("../img/interface/title_line_blue.svg");
	background-position:bottom center;
	background-size:60px 4px;
}

#sub #contents section.center h3{
	font-size:25px;
	font-weight:300;
}

#sub section#cottage{
	margin:100px 0 40px;
}

#sub #cottage>div{
	max-width:960px;
	margin:0 auto;
	padding:0 10px;
	text-align:center;
}

#sub #cottage>div>div{
	display:flex;
	flex-wrap:wrap;
}

#sub #cottage>div>div>div{
	width:33.33333%;
	box-sizing:border-box;
	padding:0 10px 30px;
}

#sub #cottage>div>div>div a{
	font-size:14px;
}

#sub #cottage>div>div>div a img{
	width:100%;
	margin:0 0 6px;
	vertical-align:bottom;
	border-radius:10px;
}

#sub #cottage>div>div>div a:hover{
	text-decoration:none;
}

#sub #cottage>div>div>div a:hover img{
	opacity:0.8;
}

/* VILLA */

#villa>article{
	max-width:2000px;
	margin:0 auto;
}

#villa #key{
	position:relative;
}

#villa #key>a{
	display:block;
	margin:0;
	padding:0 5px 5px;
	font-size:12px;
	font-weight:300;
	color:#082e6c;
	background-color:#fff;
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
	z-index:1;
}

#villa #key>a:hover{
	text-decoration:none;
}

#villa #key>a>span{
	display:block;
	padding:12px 25px 15px;
	border-bottom:1px solid #082e6c;
	border-left:1px solid #082e6c;
	border-right:1px solid #082e6c;
}

#villa #key>a>span>span{
	display:block;
	padding:16px 0 0;
	float:right;
}

#villa #key>a>span img.logotype{
	width:150px;
	float:left;
	vertical-align:bottom;
}

#villa #key>a>span img.symbol{
	width:auto;
	height:80px;
	margin:0 10px 0 0;
	vertical-align:bottom;
}

#villa #key h1{
	height:450px;
	box-sizing:border-box;
	margin:0;
	padding:180px 0 0;
	text-align:center;
	font-size:14px;
	font-weight:300;
	color:#fff;
	background-image:url("../img/interface/title_bg_villa.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

#villa #key h1 span{
	display:block;
	margin:0 0 10px;
	font-family:'Lato', sans-serif;
	font-size:40px;
	font-weight:400;
	line-height:1em;
	letter-spacing:2px;
}

#villa #key_bottom{
	padding:0 30px;
	position:relative;
	top:-80px;
}

#villa #key_bottom>div{
	max-width:1200px;
	height:80px;
	margin:0 auto;
	background-color:#fff;
}

#villa #contents{
	padding:0 40px 20%;
	background-image:url(../img/interface/shape_forest.png);
	background-repeat:no-repeat;
	background-size:100% auto;
	background-position:center bottom;
}

#villa #contents>div{
	max-width:1000px;
	margin:0 auto;
	padding:0 20px 150px;
	text-align:center;
	background-image:url(../img/interface/shape_birds.png);
	background-repeat:no-repeat;
	background-size:auto 100px;
	background-position:bottom left 12.5%;
}

#villa #contents #main{
	position:relative;
	top:-80px;
}

#villa #contents #slider{
	margin:0 0 60px;
}

#villa #contents #slider img{
	width:100%;
	vertical-align:bottom;
}

#villa #contents #slider .slider-for{
	margin:0 0 8px;
}

#villa #contents section{
	margin:80px 0 0;
	overflow:hidden;
	text-align:left;
}

#villa #contents section:last-of-type{
	margin:80px 0 50px;
}

#villa #contents section>img{
	width:100%;
	vertical-align:bottom;
}

#villa #contents section>img.f_left{
	width:40%;
	margin:0 50px 40px 0;
	float:left;
}

#villa #contents section>img.f_right{
	width:40%;
	margin:0 0 40px 50px;
	float:right;
}

#villa #contents section h2{
	margin:0 0 70px;
	padding:0 0 25px;
	font-size:30px;
	font-weight:100;
	letter-spacing:1px;
	background-image:url("../img/interface/title_line_blue.svg");
	background-repeat:no-repeat;
	background-size:60px 5px;
	background-position:bottom left;
}

#villa #contents section p{
	margin:0 0 40px;
	text-align:justify;
	font-size:16px;
	font-weight:300;
	line-height:2em;
}

#villa #contents section table.spec{
	margin:0 0 50px;
	border-collapse:collapse;
	border-top:1px dotted #ccc;
}

#villa #contents section table.spec th{
	padding:10px 15px;
	text-align:center;
	font-size:14px;
	font-weight:400;
	color:#082e6c;
	background-color:#fff2cc;
	border-bottom:1px dotted #ccc;
	border-left:1px dotted #ccc;
	white-space:nowrap;
}

#villa #contents section table.spec td{
	padding:10px 15px;
	font-size:15px;
	font-weight:300;
	color:#333;
	border-bottom:1px dotted #ccc;
	border-right:1px dotted #ccc;
}

#villa #cottage{
	margin:0;
	padding:20px 0 80px;
	background-image:url(../img/interface/bg_star.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:top center;
}

#villa #cottage h2{
	margin:0 0 50px;
	text-align:center;
	font-size:14px;
	font-weight:300;
	color:#fff;
}

#villa #cottage h2 span{
	display:block;
	font-family:'Lato', sans-serif;
	font-size:40px;
	font-weight:400;
	letter-spacing:2px;
}

#villa #cottage>div{
	max-width:1000px;
	margin:0 auto;
	padding:0 50px;
	text-align:center;
}

#villa #cottage>div>div{
	display:flex;
	flex-wrap:wrap;
}

#villa #cottage>div>div>div{
	width:33.33333%;
	box-sizing:border-box;
	padding:0 10px 40px;
}

#villa #cottage>div>div>div a{
	font-size:14px;
	color:#fff;
}

#villa #cottage>div>div>div a img{
	width:100%;
	margin:0 0 6px;
	vertical-align:bottom;
	border-radius:10px;
}

#villa #cottage>div>div>div a:hover{
	text-decoration:none;
}

#villa #cottage>div>div>div a:hover img{
	opacity:0.8;
}


/* RESERVATION */

#bnr_area{
	margin:0;
	padding:0;
	list-style-type:none;
}

#bnr_area li{
	width:33.33333%;
	box-sizing:border-box;
	padding:0 5px 10px;
	float:left;
}

#bnr_area li a:hover{
	opacity:0.8;
}

#bnr_area img{
	width:100%;
}

#facebook{
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	max-width:500px;
}

#facebook .fb-page,
#facebook .fb-page span,
#facebook iframe{
	width: 100% !important;
	height: 500px !important;
}