@charset "utf-8";
/* CSS Document */
/*---------------------------------------------------------------------
1.reset
2.font
3.set
4.header
5.mainh
6.fotter
7~~~~~~

---------------------------------------------------------------------*/


/*
reset
---------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockaquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul, dl{
	margin: 0;
	padding: 0;
    list-style: none;
}

li, dt, dd{
	margin: 0;
	padding: 0;
}

blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

img{
	margin: 0;
	padding: 0;
}


/*
font
---------------------------------------------------------------------*/
/***********
Webfont
*
 Noto Fonts (c) Google Inc. Licensed under Apache License 2.0
 https://www.google.com/get/noto/
*
***********/

@font-face {
	font-family: "noteserif-tate";
	font-style: normal;
	font-weight: normal;	
	src: url("font/notoserifcjkjp_regular-tate.eot?") format('eot'),
		url("font/notoserifcjkjp_regular-tate.woff") format('woff'),
		url("font/notoserifcjkjp_regular-tate.ttf") format('truetype');
}


@font-face {
	font-family: "noteserif";
	font-style: normal;
	font-weight: normal;	
	src: url("font/notoserifcjkjp_regular.eot?") format('eot'),
		url("font/notoserifcjkjp_regular.woff") format('woff'),
		url(font/notoserifcjkjp_regular.ttf) format('truetype');
}


@font-face {
	font-family: "noteserif";
	font-style: normal;
	font-weight: bold;	
	src: url("font/notoserifcjkjp_bold.eot?") format('eot'),
		url("font/notoserifcjkjp_bold.woff") format('woff'),
		url(font/notoserifcjkjp_bold.ttf) format('truetype');
}



@font-face {
	font-family: "notosans";
	font-style: normal;
	font-weight: normal;	
	src: url("font/notosanscjkjp_demilight.eot?") format('eot'),
		url("font/notosanscjkjp_demilight.woff") format('woff'),
		url(font/notosanscjkjp_demilight.ttf) format('truetype');
}



@font-face {
	font-family: "notosans";
	font-style: normal;
	font-weight: bold;	
	src: url("font/notosanscjkjp_bold.eot?") format('eot'),
		url("font/notosanscjkjp_bold.woff") format('woff'),
		url(font/notosanscjkjp_bold.ttf) format('truetype');
}


/*
set
---------------------------------------------------------------------*/

html{
	font-size: 62.5%;/*font-size: 1.0rem;*/
}

html,body{
	width:100%;
    height:100%;
	min-width: 1280px;
}

body{
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: 1px;
	font-family:"noteserif","noteserif-tate";
	font-weight:normal;
	color: #222;/*black*/
	-webkit-text-size-adjust: 100%;
	background: url(../img/base/bg-w.png);
}





/*
guideline
---------------------------------------------------------------------*/

.wrap-12{
	overflow: hidden;
	width: 1280px;
	margin: 0 auto;
}

.wrap{
	width: 1130px;
	margin: 0 auto;
}



.wrap-10{
	width: 1000px;
	margin: 0 auto;
}


.wrap-9{
	width: 900px;
	margin: 0 auto;
}


.wrap-8{
	width: 800px;
	margin: 0 auto;
}


.wrap-7{
	width: 700px;
	margin: 0 auto;
}

.wrap-6{
	width: 600px;
	margin: 0 auto;
}


a{
	color: #222;
	text-decoration: none;
}

a:hover img{
opacity: .5;
-webkit-opacity: .5;
-moz-opacity: .5;
filter: alpha(opacity=50);	/* IE lt 8 */
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
}

a img{
-webkit-transition: opacity 1s ease-out;
-moz-transition: opacity 1s ease-out;
-ms-transition: opacity 1s ease-out;
transition: opacity 1s ease-out;
}

.clear{
	clear: both;
	content: "";
	display: block;
}


img{
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}


.naka table{
	width: 100%;
	margin: 20px auto 40px auto;
	font-size: 1.4rem;
	font-family: "notosans";
	
}

.naka table caption{
	padding: 8px 0;
	text-align: left;
	font-weight: bold;
}

.naka table tbody tr{
	border-bottom: 1px solid #ccc;
}



.naka table th{
	width: 30%;
	padding: 8px 0;
	vertical-align: middle;
	text-align: center;
}

.naka table td{
	padding:8px 0;
	text-align: left;
	
}

.naka table tfoot{
	text-align: right;
	font-size: 1.2rem;
}



strong{
	font-weight: bold;
}


.bt1{
	border-top: 1px solid #ccc;
}


a.ido:hover,
.ido a:hover,
a.ido2:hover,
.ido2 a:hover,
.planall a:hover,
#guestroom #submit_button:hover{
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}


a.ido,
.ido a{
	margin: 20px 0;
	padding: 16px 40px 18px 50px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	background-image: url(../img/base/arrow-w.png) ,url(../img/base/bg-red.png);
	background-repeat: no-repeat ,repeat;
	background-position: 16px 50%;
	animation: arrow 3s ease 1s infinite forwards;
}


a.ido2,
.ido2 a{
	margin: 50px 0;
	padding: 16px 50px 18px 50px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	background-image: url(../img/base/arrow-w.png) ,url(../img/base/bg-gara.png);
	background-repeat: no-repeat ,repeat;
	background-position: 16px 50%;
	animation: arrow2 3s ease 1s infinite forwards;
}


.planall a{
	display: block;
	width: 100%;
	margin: 20px 0 0 0;
	padding: 40px 0px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	background-image:url(../img/base/arrow-w.png) ,url(../img/base/bg-gara.png);
	background-position: 16px 50%;
	background-repeat: no-repeat,repeat;
	animation: arrow2 3s ease 1s infinite forwards;					
}


@keyframes arrow {
  0% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-red.png);
		background-repeat: no-repeat ,repeat;
		background-position: 16px 50%;
  }
  50% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-red.png);
		background-repeat: no-repeat ,repeat;
		background-position: 20px 50%;
  }
  100% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-red.png);
		background-repeat: no-repeat ,repeat;
		background-position: 16px 50%;
  }
}

@keyframes arrow2 {
  0% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-gara.png);
		background-repeat: no-repeat ,repeat;
		background-position: 16px 50%;
  }
  50% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-gara.png);
		background-repeat: no-repeat ,repeat;
		background-position: 20px 50%;
  }
  100% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-gara.png);
		background-repeat: no-repeat ,repeat;
		background-position: 16px 50%;
  }
}




/*
header
---------------------------------------------------------------------*/


header{
	position: fixed;
	overflow: hidden;
	width: 100%;
	padding: 20px 0 0 0;
	background: url(../img/base/bg.png);
	z-index: 100;
}

header .wrap{
	width: 1280px;
}

header .logo{
	float: left;
	width: 260px;
	padding-top: 5px;
}


.cb-header {
  position: fixed; /* ヘッダーバーを固定 */
  top: 0; /* 上から0の位置に固定 */
  left: 0; /* 左から0の位置に固定 */
  display: none; /* ヘッダーバーを非表示 */
}




header #nav{
	float: left;
}


header #nav nav{
	overflow: hidden;
}

	header #nav nav ul li{
		float: left;
		height: 100%;
		letter-spacing: 2px;
	}

	header #nav nav ul li+li{
		margin-left: 30px;
	}

		header #nav nav ul li a{
			display: block;
			padding: 10px 10px 23px 10px;
			color: #fff;
		}



		header #nav nav ul li.activ a{
			border-bottom: 6px solid #872a2a;
		}

				header #nav nav ul li a:hover{
					color: #aaa;
					border-bottom: 6px solid #333;
				}



header .tel{
	float: right;
}


/*
main
---------------------------------------------------------------------*/

main{
	clear: both;
	display: block;
}


main.naka{
	padding-top: 85px;
	background-image: url(../img/base/dia-gara.png), url(../img/base/dia-gara-min.png);
	background-repeat: no-repeat;
	background-position: 0 0 , 100% 400px;
}


main > div:last-child{
	margin-bottom: 0;
	
}

.home h1{
	margin: 0 auto 60px auto;
	padding:0;
	text-align: center;
	font-size: 2.4rem;
	letter-spacing: 2px;
}

.naka h1{
	margin: 0 0 20px 0;
	padding: 0px 0 10px 0;
	text-align: center;
	font-size: 3.6rem;
	background: url(../img/base/line.png) no-repeat 50% 100%;
}




h2{
	margin: 0 auto 40px auto;
	text-align: center;
	letter-spacing: 3px;
	font-size: 4rem;
}

.naka h2 span{
	display: block;
	font-size: 3rem;
}

h3{
	margin: 0 auto 50px auto;
	padding: 0;
	text-align: center;
	font-size: 3.6rem;

}


h4{
	margin:0 auto 10px auto;
	padding: 0 0 4px 0;
	text-align: left;
	font-size: 3rem;
	border-bottom: 5px solid #222;
}


h5{
	margin: 30px auto 10px auto;
	padding:  5px 0 8px 10px;
	font-size: 1.8rem;
	font-weight: bold;
	color: #fff;
	background: url(../img/base/bg-gara.png);
	border-left: 6px solid #872a2a;
}



p{
	font-family: "notosans";
}

.read{
	margin: 0 0 50px 0 ;
	text-align: center;
	font-size: 1.4rem;
}



#pagehead{
	height: 300px;
	margin: 0px 0 0 0;
	text-align: center;		
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;	
}


#pagehead + .section{
	padding-top: 50px;
}

#pagenai-nav{
	clear: both;
	display: block;
	content: "";
	margin: 60px 0 0 0;
	padding: 0;
	text-align: center;
}

#pagenai-nav:after{
	clear: both;
	display: block;
	content: "";
}

		#pagenai-nav nav ul li {
			display: inline-table;
			margin-bottom: 50px;

		}

		#pagenai-nav nav ul li +li{
			margin-left: 10px;
		}

				#pagenai-nav nav ul li a{
					display: block;
					padding: 12px 30px 15px 50px;
					text-align: center;
					border: 1px dotted #ccc;
					background:#fff url(../img/base/arrow.png) 20px 50% no-repeat;
					animation: arrowb 3s ease 1s infinite forwards;


				}
				#pagenai-nav nav ul li a:hover{
					text-decoration: underline;
				}







.tate-yoko{
	-webkit-text-combine: horizontal;
	-ms-text-combine-horizontal: all;
	text-combine-upright: all;

}

.bg-a{
	padding: 100px 0 100px 0;
	background: url(../img/base/alpha_bg-w.png);
}

.bg-agara{
	background-image: url(../img/base/alpha_bg-gara.png);
}

.bg-w{
	background-color: #fff;
}

.section{
	padding: 100px 0 100px 0;
}


.section2{
	overflow: hidden;
	padding: 80px 0 80px 0;
}


.section-single{
	padding: 100px 0 100px 0;
	
}

		.section-single .pic{
			margin: 20px auto;
			text-align: center;
		}


		.section-single p{
			text-align: center;
			line-height: 2.7;
		}


.sayu{
	overflow: hidden;
	padding: 80px 0;
}
		.sayu .naiyo{
			float: left;
			width: 510px;
		}

				.sayu .naiyo p{
					font-size: 1.4rem;
				}

				.sayu .naiyo .ido{
					margin-top: 50px;
				}

				.sayu .naiyo .ido a{
					display: block;
				}


		.sayu .pic{
			float: right;
			width: 720px;
		}



.sayu2{
	overflow: hidden;
	padding: 80px 0;
}
		.sayu2 .naiyo{
			float: right;
			width: 510px;
		}

				.sayu2 .naiyo p{
					font-size: 1.4rem;
				}

				.sayu2 .naiyo .ido{
					margin-top: 50px;
				}

				.sayu2 .naiyo .ido a{
					display: block;
				}


		.sayu2 .pic{
			float: left;
			width: 720px;
		}





.section-nav{
	clear: both;
	display: block;
	content: "";
	overflow: hidden;
	padding: 100px 0 100px 0;
}


		.section-nav ul li{
			overflow: hidden;
		}

		.section-nav ul li+li{
			margin-top:150px;
		}


				.section-nav ul li h3{
					float: left;
					width: 70px;
					height: 100%;
					margin-right: 50px;
					padding: 24px 0;
					border-top:3px solid #d7494f;
				}

				.section-nav ul li .info{					
					overflow: hidden;
					float: right;
					width: calc(100% - 50px);

				}


						.section-nav ul li .info img+p{
							margin-top: 20px;
						}

						.section-nav ul li .info p{
							line-height: 2.7;

						}


				.section-nav ul li .pic{
					width: 640px;
					height: 426px;
					background: #fff;
					text-align: center;
				}

				.section-nav ul li.picr .pic{float: right;}
				.section-nav ul li.picl .pic{float: left;}


				.section-nav ul li .naiyo{
					width: calc(100% - 120px - 60px - 640px);
				}


				.section-nav ul li.picr .naiyo{float: left; padding-top: 24px;}
				.section-nav ul li.picl .naiyo{float: left; margin-left: 60px; padding-top: 24px;}



						.section-nav ul li .naiyo p{
							line-height: 2.7;
							font-size: 1.2rem;

						}

						.section-nav ul li .naiyo strong{
							display: block;
							margin: 0 0 0px 0;
							line-height: 1.5;
							letter-spacing: 2px;
							font-size: 1.8rem;
						}


						.section-nav ul li .naiyo dl{
						}


									.section-nav ul li .naiyo dl dt{
										padding: 24px 0 32px 0;
										letter-spacing: 4px;
										font-size: 1.8rem;
									}

									.section-nav ul li .naiyo dl dd{
										line-height: 2;
										font-size: 1.2rem;
									}


				.section-nav ul li .ido{
					margin: 50px 0 0 0;
				}


				.section-nav ul li .ireko {
					overflow: hidden;
					float: right;
					width: calc(100% - 50px);
				}


				.section-nav ul li .info + .ireko {
					padding-top: 40px;

				}

						.section-nav ul li .ireko .naiyo{
							width: calc(100% - 60px - 640px);
						}


.right_line,
.left_line{
	position: relative;
}


.left_line:before {
	content: "";
	height: 1px;
	background-color: #999;
	position: absolute;
	top: 16px;
}


.right_line:after {
	content: "";
	height: 1px;
	background-color: #999;
	position: absolute;
	top: 16px;
}



/*
fotter
---------------------------------------------------------------------*/

footer{
	clear: both;
	display: block;
	margin: 0px 0 0 0;
	padding: 50px 0;
	color: #fff;
	font-size: 1.4rem;
	background: url(../img/base/bg.png);
}


footer a{
	color: #fff;
	text-decoration: none;
}


footer .data1{
	float: left;
	width: 360px;
}

footer .data2{
	float: left;
	width: calc(100% - 360px - 240px);
}

footer .data3{
	float: right;
	width: 240px;
	padding-top: 20px;
}



footer dl{
	float: left;
	overflow: hidden;
	margin-bottom: 30px;
}


		footer dl dt{
			margin-bottom: 10px;
			text-align: left;
			line-height: 1.3;
		}


		footer dl dd{
			padding-top: 20px;
			font-family: "notosans";
			letter-spacing: 0;
			line-height: 2;
		}




footer #nav{
}


		footer #nav nav{
			overflow: hidden;
		}

				footer #nav nav ul{
					overflow: hidden;
				}

						footer #nav nav ul li{
							display: block;
							float: left;
							width: 90px;
							letter-spacing: 2px;
						}

						footer #nav nav ul li:nth-child(5){
							clear: both;
						}

						footer #nav nav ul li:nth-child(3),
						footer #nav nav ul li:nth-child(7){
							width: 140px;
							padding-left: 10px;
						}

						footer #nav nav ul li:nth-child(8){
							width: 170px;
						}


								footer #nav nav ul li a{
									display: block;
									margin-bottom: 2px;
									padding: 20px 0 10px 0;
									font-size: 1.4rem;
								}

								footer #nav nav ul li a:hover{
									margin-bottom: 0;
									color: #ccc;
									border-bottom: 2px solid #872a2a;
								}



footer .gaibulink{
	margin-top: 30px;
}

		footer .gaibulink a{
			margin: 0px 10px 2px 0;
			padding: 20px 50px;
			color: #fff;
			text-align: left;
			font-size: 1.4rem;
			background-repeat: no-repeat;
			background-position: 0px 50%;
		}

		footer .gaibulink a:hover{
			margin-bottom: 0;
			color: #ccc;
			border-bottom: 2px solid #872a2a;
		}


		footer .gaibulink a.facebook{background-image: url(../img/base/facebook-w.png);}
		footer .gaibulink a.instagram{background-image: url(../img/base/instagram-w.png);}


footer .tel{
	padding: 20px 0 0 0;
	text-align: center;
	border: 1px solid #fff;
}


footer .ido a{
	display: block;
	
}


.copyright{
	padding: 30px 0 0 0;
	text-align: center;
	line-height: 1;
	color: #aaa;
}




.jump {
    position: fixed;
    bottom: 30%;
    right: 0px;
	z-index: 900;
	animation: jump 6s ease 0s 1 forwards;
}

@keyframes jump {
  0% {
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }

  80% {
		filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
	
	
  100% {
	  	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
  }
}


.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 0px;
	z-index: 500;
}


/*
movie
---------------------------------------------------------------------*/

#movie_wrap {
    height: auto;
	margin: 0 auto 0px auto;
	padding: 0;
	line-height: 0;
}

#hotspamovie{
	width: 960px;
	margin: 0 auto;
	padding: 0;
}



/*
swiper
---------------------------------------------------------------------*/
.slidethumbs ul li{
	width: 300px;
	height: 100px;
	border-radius:0;
}

		.slidethumbs ul li.swiper-pagination-bullet{
			filter:alpha(opacity=100);
			-moz-opacity: 1;
			opacity: 1;
		}

		.slidethumbs ul li.swiper-pagination-bullet-active{
			filter:alpha(opacity=50);
			-moz-opacity: 0.5;
			opacity: 0.5;
		}


/*
fade
---------------------------------------------------------------------*/


.fade-up,
.fade-down{
	-webkit-transition: all 5s;
	-moz-transition: all 5s;    
	-ms-transition: all 5s;
	-o-transition: all 5s;
	transition: all 5s;
}





.fade-left,.fade-left_b,
.fade-right,.fade-right_b{
      -webkit-transition: all 5s;
      -moz-transition: all 5s;
      -ms-transition: all 5s;
      -o-transition: all 5s;
      transition: all 5s;
}


.fade-in{
	opacity:0;
	-webkit-transition: all 5s;
	-moz-transition: all 5s;
	-ms-transition: all 5s;
	-o-transition: all 5s;
	transition: all 5s;
}

.fade-point{
	opacity:1;
}



.base-point{
	opacity:1;
	transform:translate(0px, 0px);
	-webkit-transform: translate(0px, 0px);
	-moz-transform:translate(0px, 0px);
	-ms-transform:translate(0px, 0px);
	
}

.fade-up-point{
	opacity:0;
	transform:translate(0px, 50px);
	-webkit-transform: translate(0px, 50px);
	-moz-transform:translate(0px, 50px);
	-ms-transform:translate(0px, 50px);
}


.fade-down-point{
	opacity:0;
	transform:translate(0px, -50px);
	-webkit-transform: translate(0px, -50px);
	-moz-transform:translate(0px, -50px);
	-ms-transform:translate(0px, -50px);
}



.fade-right-point{
	opacity:0;
	transform:translate(160px, 0px);
	-webkit-transform: translate(160px, 0px);
	-moz-transform:translate(160px, 0px);
	-ms-transform:translate(160px, 0px);
}

.fade-right_b-point{
	opacity:0;
	transform:translate(160px, 160px);
	-webkit-transform: translate(160px, 160px);
	-moz-transform:translate(160px, 160px);
	-ms-transform:translate(160px, 160px);
}

.fade-left-point{
	opacity:0;
	transform:translate(-160px, 0px);
	-webkit-transform: translate(-160px, 0px);
	-moz-transform:translate(-160px, 0px);
	-ms-transform:translate(-160px, 0px);
}

.fade-left_b-point{
	opacity:0;
	transform:translate(-160px, 160px);
	-webkit-transform: translate(-160px, 160px);
	-moz-transform:translate(-160px, 160px);
	-ms-transform:translate(-160px, 160px);
}



/*
topslide
---------------------------------------------------------------------*/

#topslide{
	width: 100%;
    height: auto;
	margin: 0 auto 0px auto;
	padding: 0;
	line-height: 0;
	background: #222;
}






#topslide #welcome{
	position: absolute;
	top: 320px;
	left: 42%;
	color: #ccc;
	z-index: 10;
	line-height: 2.5;
}


#topslide #welcome .moon{
	width: 130px;
	height: 90px;
	margin: 0 auto;
	text-align: center;
	animation: moon 8s ease 0s 1 forwards;
	background-repeat: no-repeat;
	background-position: 0 50%;
}

@keyframes moon {
  0% {
	  
		background-image: url(../img/base/logo-moon_w.png);
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }

 10% {
	  
		background-image: url(../img/base/logo-moon_w.png);
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
	
 40% {
	  
		background-image: url(../img/base/logo-moon_y.png);
	  filter:alpha(opacity=50);
		-moz-opacity: 0.5;
		opacity: 0.5;
  }
	
  80% {
		background-image: url(../img/base/logo-moon_y2.png);
	  	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
  }
	
	
  100% {
		background-image: url(../img/base/logo-moon_y.png);
	  	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
  }
}

#topslide #welcome .moon img{
	animation: moon2 5s ease 0s 1 forwards;
}


@keyframes moon2 {
  0% {
	  
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
  
	 10% {
	  
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
	
	
  100% {
	  	filter:alpha(opacity=50);
		-moz-opacity: 0.5;
		opacity: 0.5;
  }
}


#topslide #welcome .logo2{
	animation: logo 8s ease 0s 1 forwards;
}

@keyframes logo {
  0% {
	  
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
  
	 30% {
	  
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
	
	
  100% {
	  	filter:alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
  }
}



#topslide .swiper-container{
	animation: black 10s ease 0s 1 forwards;
}

@keyframes black {
  0% {
		filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
  
  100% {
		filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
  }
}


#topslide .swiper-container img{
	width: 100%;
	height: auto;
}


/*
topmovie
------------------------ ---------------------------------------------*/

.movie video{
	width: 100%;
	height: auto;
}


/*
feature
------------------------ ---------------------------------------------*/



#feature h1{
	display: none;
}

#feature p{
	font-family:"noteserif";
}


#feature #f1{
	overflow: hidden;
	padding: 50px 0;
	background: url(../img/base/bg.png);
}

#feature #f1 .wrap-12{
	overflow: hidden;
	position: relative;
	background-image: url(../img/home/feature_1_map.png) ,url(../img/home/feature_1_bg.png);
	background-position: 100% 100%,100% 0;
	background-repeat: no-repeat;
}


		#feature #f1 .title1{
			position: absolute;
			top: 0;
			right: 0;
		}

		#feature #f1 .title2{
			position: absolute;
			top: 5px;
			right: 50px;
		}

		#feature #f1 .data1 {
			position: absolute;
			bottom: 0;
			left: 680px;
			color: #fff;
			
		}

				#feature #f1 .data1 img{
					margin-top: 20px;
				}



		#feature #f1 .data2 {
			position: relative;
			float: left;
			padding-bottom: 10px;
		}

				#feature #f1 .data2 img{
					margin-bottom: 20px;
				}


				#feature #f1 .data2 p{
					width: 400px;
					font-size: 1.4rem;
					color: #fff;
				}

				#feature #f1 .data2 div{
					position: absolute;
					right: 0;
					bottom: 20px;
				}




#feature #f2{
	overflow: hidden;
	padding: 50px 0;
	background: url(../img/base/bg-w2.png);
}


#feature #f2 .wrap-12{
	overflow: hidden;
	position: relative;
	height: 650px;
	background-image: url(../img/home/feature_2.jpg) , url(../img/home/feature_2-2.jpg) ,url(../img/home/feature_2-3.jpg),url(../img/home/feature_2-4.jpg) ,url(../img/home/feature_2_bg.png);
	background-position: 0px 20px, 0 50%,0 95%,95% 95%,100% 0;
	background-repeat: no-repeat;
	
}

		#feature #f2 .title1{
			position: absolute;
			top: 50px;
			width: 100%;
			text-align: center;
		}


		#feature #f2 .data1 {
			position: absolute;
			bottom: 40px;
			width: 100%;
			text-align: center;
		}

				#feature #f2 .data1 p{
					color: #fff;
				}

				#feature #f2 .data1 div{
					margin-top: 30px;
				}


/*
homeplan
------------------------ ---------------------------------------------*/


#homeplan{
	padding-top: 50px;
	padding-bottom: 100px;
	background: url(../img/base/alpha_bg-gara.png);
}


#homeplan ul {
	overflow: hidden;
	margin-bottom: 50px;
}

		#homeplan ul li{
			width: 240px;
			float: left;
		}

		#homeplan ul li+li{
			margin-left: 55px;
		}


				#homeplan ul li .thumb img{
					width: 100%;
					height: auto;
				}

					#homeplan ul li .naiyo dl{
					}


								#homeplan ul li .naiyo dl dt{
									padding: 15px 0 0 0;
									text-align: justify;
									font-size: 1.4rem;
									font-family: "notosans";
								}

				#homeplan ul li:hover{
					text-decoration: underline;
}


				#homeplan ul li .ido{
					margin: 50px 0 0 0;
				}




#homeplan .planall a{
	display: block;
	width: 100%;
	margin: 20px 0 0 0;
	padding: 40px 0px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	background-image:url(../img/base/arrow-w.png) ,url(../img/base/bg-gara.png);
	background-position: 420px 50%;
	background-repeat: no-repeat,repeat;
	animation: arrowhomeplan 3s ease 1s infinite forwards;					
}


@keyframes arrowhomeplan {
  0% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-gara.png);
		background-repeat: no-repeat ,repeat;
		background-position: 420px 50%;
  }
  50% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-gara.png);
		background-repeat: no-repeat ,repeat;
		background-position: 425px 50%;
  }
  100% {
		background-image: url(../img/base/arrow-w.png) , url(../img/base/bg-gara.png);
		background-repeat: no-repeat ,repeat;
		background-position: 420px 50%;
  }
}


/*
search
---------------------------------------------------------------------*/
#search{
	
	overflow: hidden;
	padding: 40px 0;
	background: url(../img/base/bg-gara.png);
}

		#search .wrap > .data1{
			float: left;
			width: 200px;
			color: #fff;
			text-align: center;
		}

		#search .wrap > .data2{
			float: right;
			width: 900px;
			background: url(../img/base/bg-w.png);
			-webkit-border-radius: 4px;
			-moz-border-radius: 4px;
			border-radius: 4px;
		}

#search .kensakumado h4{
	margin: 10px auto;
	padding: 0 0 4px 0;
	color: #fff;
	text-align: center;
	font-size: 2.4rem;
	letter-spacing: -1px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}


		#search .kensakumado p{			
			text-align: center;
			font-size: 1.2rem;
		}

#search .plan_form{
}

#search .plan_form .data1{
	float: left;
	width: 630px;
	padding:  20px 0 20px 20px;
}

#search .plan_form .data2{
	float: right;
	width: 200px;
	padding: 30px 20px 20px 20px;
}


		#search .plan_form .retsu{
			overflow: hidden;
			margin: 0;
			padding: 16px;
		}

		#search .plan_form .retsu+.retsu{
			padding-top: 20px;	
			border-top: 1px dotted #ccc;
		}


				#search .plan_form dl{
					float: left;
					padding: 0;
					text-align: left;
				}

				#search .retsu dl+dl{
					margin-left: 50px;

				}

				#search .retsu dl.mitei{
					margin-left: 10px;

				}

				#search .retsu dl.guests{
				}


						#search .retsu dl dt{
							float: left;
							margin: 0 10px 0 0;
							padding: 0;
							line-height: 1;
						}

						#search .retsu dl.hiduke dt{
							margin-right: 35px;
						}




						#search .retsu dl dd{
							float: left;
						}

								#search .retsu dl dd select{
									width: 180px;
									padding: 8px 5px 8px 5px;
									font-weight: bold;
									font-family:"noteserif";
									border: 1px solid #eee;
									background: url(../img/base/alpha_bg.png);
								}




					#search .retsu .hiduke input{
						width: 155px;
						margin: 0;
						padding: 10px;
						background-image:  url(../img/base/calendar.png), url(../img/base/alpha_bg.png);
						background-repeat:no-repeat,repeat;
						background-position:  95% 48% ,0 0 ;
						border: 1px solid #aaa;
						font-size: 1.8rem;

					}


					#search .retsu .mitei dt{
						margin-left: 10px;
						padding-top: 5px;

					}

						#search .retsu .mitei .label-checkbox input[type="checkbox"]{
							display: none;
						}
						#search .retsu .mitei .label-checkbox{
							cursor: pointer;
							color: #aaa;
							font-size: 2rem;
						}
						#search .retsu .mitei .label-checkbox input[type="checkbox"]:checked + .lever{
							padding: 0 4px;
							color: #C00;
							border: 2px solid  #C00;
							font-size: 1.6rem;
							background: #fff;
						}

						#search .retsu .mitei .label-checkbox input[type="checkbox"]:checked + .lever:after{
							content: "日付未定選択中";
							color: #C00;
						}


#search .retsu dl.price dd {
	margin-left: 22px;
}

						#search .retsu dl.price dd img{
							margin:5px 10px 5px 0;
						}





		#search .search_btn{
			text-align: center;
		}


				#search .search_btn:hover{
					filter:alpha(opacity=70);
					-moz-opacity: 0.7;
					opacity: 0.7;
				}


				#search .search_btn #submit_button { 
					width: 100%;
					padding: 30px  0px;
					color: #fff;
					text-align: center;
					font-size: 1.4rem;
					font-family:"noteserif";
					background-image:url(../img/base/arrow-w.png) ,url(../img/base/bg-red.png);
					background-position: 16px 50%;
					background-repeat: no-repeat,repeat;
					border: none;
					animation: arrow 3s ease 1s infinite forwards;					
				}
	



#homeslide {
    width: 100%;
    height: 300px;
}

#homeslide h3{
	display: none;
}


#homeslide ul li{
	display: inline-block;
}





#info{
	overflow: hidden;
	padding:100px 0 150px 0;
	background: #fff;
}

		#info .data1{
			float: left;
			width: 470px;
		}

		#info .data2{
			float: right;
			width: 600px;
		}



#newsfeed{
	overflow: hidden;
}

		#newsfeed ul{
			overflow: hidden;
			margin-bottom: 30px;
		}

		.info #newsfeed ul{
			margin-top: -15px;
		}


				#newsfeed ul li{
					overflow: hidden;
					padding:10px 0;
					text-align: left;
					border-bottom: 1px dotted #ccc;
					font-family: "notosans";
				}

				#newsfeed ul li:first-child{
					padding-top: 0;
				}



						#newsfeed ul li:hover{
							background: #eee;

						}

						#newsfeed ul li span{
							margin-right: 20px;
						}


						#newsfeed ul li a:hover{
							text-decoration: underline;
						}
#newsfeed .news-img{
	float: left;
	width: 110px;
	text-align: center;
}
		#newsfeed .news-img img{
			width: auto;
			height: 80px;
		}

#newsfeed .news-text{
	float: left;
	width: calc(100% - 120px);
	margin-left: 10px;
}

#newsfeed .news-text dl{
}


#newsfeed .news-text dl dt{
	padding-top: 10px;
	font-size: 1.2rem;
}


#newsfeed .news-text dl dd{
	font-size: 1.4rem;
}




.php{
	width: 12em;
	float: right;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}

#newsfeed .ido2{
	text-align: right;
}


#homesns .gaibulink a:hover,
#homesns .gaibulink2 a:hover{
	background-color: #eee;
}

#homesns .gaibulink{
	overflow: hidden;
	margin-top: 40px;
}

		#homesns .gaibulink ul li{	
		}

				#homesns .gaibulink ul li a{
					position: relative;
					display: block;
					margin: 10px 0;
					padding: 16px 0 20px 50px;
					color: #222;
					text-align: left;
					font-size: 1.4rem;
					border: 1px solid #222;
					background-image: url(../img/base/arrow.png);
					background-repeat: no-repeat;
					background-position: 16px 50%;
					animation: arrowb 3s ease 1s infinite forwards;
				}

				#homesns .gaibulink ul li a:after{
					position: absolute;
					right: 20px;
				}

				#homesns .gaibulink ul li a.facebook:after{content: url(../img/base/facebook.png);}
				#homesns .gaibulink ul li a.instagram:after{content: url(../img/base/instagram.png);}





#homesns .gaibulink2{
	overflow: hidden;
}

		#homesns .gaibulink2 ul li{
			float: left;
			width: 48%;
		}

#homesns .gaibulink2 ul li+li{
	margin-left: 4%;
}


				#homesns .gaibulink2 ul li a{
					display: block;
					margin: 0px 0;
					padding: 16px 0 20px 50px;
					color: #222;
					text-align: left;
					font-size: 1.4rem;
					border: 1px solid #222;
					background-image: url(../img/base/arrow.png);
					background-repeat: no-repeat;
					background-position: 16px 50%;
					animation: arrowb 3s ease 1s infinite forwards;
				}

#homesns .gaibulink2 ul li a span{
	display: block;
}




@keyframes arrowb {
  0% {
		background-image: url(../img/base/arrow.png);
		background-repeat: no-repeat;
		background-position: 16px 50%;
  }
  50% {
		background-image: url(../img/base/arrow.png) ;
		background-repeat: no-repeat;
		background-position: 20px 50%;
  }
  100% {
		background-image: url(../img/base/arrow.png) ;
		background-repeat: no-repeat;
		background-position: 16px 50%;
  }
}


#map .ido{
	margin-top: 20px;
	margin-bottom: 50px;
}

#map .ido a{
	padding-right: 23px;
	
}
#map .ido a+a{
	margin-left: 20px;
}




/*
greetiong
------------------------ ---------------------------------------------*/


#greeting{
	position: relative;
}

#greetingbg{
	overflow: hidden;
	width: 1280px;
	margin: 50px  auto ;
	
}

#greetingbg>.wrap{
	height: 700px;
	text-align: left;
	
	animation: greetingbg 2s ease 0s 1 forwards;
}

@keyframes greetingbg {
  0% {
	  width: 50%;
	  filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	  background: #fff;
  }
	
	
  100% {
	  width: 100%;
	  filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
	  background: #222;
  }
}




#greetingbg  img{
	width: 100%;
	height: auto;
	animation: greetingbg2 5s ease 0s 1 forwards;
}


@keyframes greetingbg2 {
  0% {
	  
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
  
	 40% {
	  
	  filter:alpha(opacity=0);
		-moz-opacity: 0;
		opacity: 0;
  }
	
	70% {
	  	filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
  }
	
	
  100% {
	  	filter:alpha(opacity=95);
	-moz-opacity: 0.95;
	opacity: 0.95;
  }
}


#greeting #comment{
	position: absolute;
	top: 100px;
	z-index: 50;
	text-shadow:0px 0px 8px #000000;
	
}

		#greeting #comment .wrap{
			position: relative;
			color: #fff;
			animation: comment 8s ease 0s 1 forwards;
			}


			@keyframes comment {
			  0% {

				  filter:alpha(opacity=0);
					-moz-opacity: 0;
					opacity: 0;
			  }

				 40% {

				  filter:alpha(opacity=0);
					-moz-opacity: 0;
					opacity: 0;
			  }

				70% {
					filter:alpha(opacity=100);
				-moz-opacity: 1;
				opacity: 1;
			  }


			  100% {
					filter:alpha(opacity=100);
				-moz-opacity: 1;
				opacity: 1;
			  }
			}

				#greeting #comment h1{
					position: absolute;
					padding-left: 50px;
					background: none;
				}

				#greeting #comment h2{
					margin: 100px 0 50px 150px;
					
					text-align: left;
				}

				#greeting #comment p{
					margin-left: 150px;
					font-size: 1.4rem;
					line-height: 2.5;

				}

				#greeting #comment p.hissya{
					margin: 30px 0 30px 450px;
				}



/*
guestroom-select
------------------------ ---------------------------------------------*/
#guestroom-select h1{
	display: none;
}

#guestroom-select .select > ul {
    display: -webkit-flex;
    display: flex;
}

		#guestroom-select .select > ul li {
			width: 100%;
			height: 700px;
			-webkit-transition: width 2s ease-out;
			transition: width 2s ease-out;
		}
		#guestroom-select .select > ul li.select-wayou:hover,
		#guestroom-select .select > ul li.select-special:hover,
		#guestroom-select .select > ul li.select-hanare:hover{
			width: 150%;
		}


				#guestroom-select .select ul li div{
					height: 100%;
					background: rgba(0,0,0,0.5);
					text-align: center;
				}


				#guestroom-select .select ul li div a{
					display: block;
					width: 100%;
					height: 100%;
					color: #fff;
				}

				#guestroom-select .select ul li div:hover{
					background: rgba(0,0,0,0.0);
				}

				#guestroom-select .select ul li div a:hover img{
				opacity: 1;
				-webkit-opacity: 1;
				-moz-opacity: 1;
				filter: alpha(opacity=100);	/* IE lt 8 */
				-ms-filter: "alpha(opacity=100)"; /* IE 8 */
				}

				#guestroom-select .select ul li div h2{
					margin: 0;
					padding: 50px 0 30px 0;
				}


				#guestroom-select .select ul li div ol｛{

				}

						#guestroom-select .select ul li div ol li{
							position: relative;
							width: 120px;
							height: 25px;
							margin: 0 auto;
						}

						#guestroom-select .select ul li div ol li:before{
							content: "－";
							position: absolute;
							left: 0;
						}

						#guestroom-select .select ul li div ol li:after{
							content: "－";
							position: absolute;
							right: 0;
						}




						#guestroom-select .select ul li.select-wayou{
							background:#222 url(../img/guestroom/select_wayou.jpg) 0% 0 no-repeat;
						}

						#guestroom-select .select ul li.select-special{
							background:#222 url(../img/guestroom/select_special.jpg) 50% 0 no-repeat;
						}

						#guestroom-select .select ul li.select-hanare{
							background:#222 url(../img/guestroom/select_hanare.jpg) 100% 0 no-repeat;
						}




/*
guestroom
------------------------ ---------------------------------------------*/

#guestroom{
	
}

.pageslide{
	overflow: hidden;
	position: relative;
}

#guestroom .info + .pageslide{
	margin-top: 100px;
}


.room-wayou .pageslide h3{
	background: url(../img/base/line.png) 50% 55% repeat-x;
}

.room-wayou .pageslide h3 strong{
	padding: 10px 20px 20px 20px;
	font-size: 2.4rem;
	background: url(../img/base/bg-w.png);
}

		.pageslide .slidemain{
			float: left;
			width: 960px;
		}

		.pageslide .slidethumbs {
			float: right;
			width: 300px;
			height: 640px;
			box-sizing: border-box;
			padding: 0px 0;
		}




#guestroom .info{
	overflow: hidden;
	margin: 50px 0 0 0;
	
}

		#guestroom .info .data1{
			float: right;
			width: 750px;
		}

				#guestroom .info .data1 table th{
					width: 15%;
				}


		#guestroom .info .data2{
			float: left;
			width: 300px;
			margin-top: 100px;
			color: #fff;
			text-align: center;
		}



#guestroom .search_hidden{
	display: none;
}



#guestroom .submit_button{
	display: block;
	width: 100%;
	margin: 20px 0;
	padding: 52px 40px 56px 50px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	letter-spacing: 2px;
	font-family: "noteserif";
	border: none;
	background-image: url(../img/base/arrow-w.png) ,url(../img/base/bg-red.png);
	background-repeat: no-repeat ,repeat;
	background-position: 16px 50%;
	animation: arrow 3s ease 1s infinite forwards;
}

#guestroom .submit_button:hover{
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}




#otherroom{
	text-align: center;
}

		#otherroom ul li{
			display: inline-block;
			vertical-align: top;

		}

		#otherroom ul li+li{
			margin-left: 100px;
		}

				#otherroom ul li dl dt{
					margin: 10px 0;
					font-size: 2.4rem;
				}

						#otherroom ul li dl dt span{
							display: block;
							margin-bottom: 10px;
							padding-bottom: 5px;
							letter-spacing: 5px;
							font-size: 2rem;			
							font-weight: bold;
							background: url(../img/base/line.png) 50%100% no-repeat;
						}

				#otherroom ul li dl dd{
					font-size: 1.4rem;
				}



/*
room-wayou
------------------------ ---------------------------------------------*/
  
.room-wayou #pagehead{
	background-image: url(../img/guestroom/room_wayou-pagehead.jpg);
}

.room-wayou #hanamizuki #thumbs1.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-hanamizuki_0-min.jpg);}
.room-wayou #hanamizuki #thumbs2.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-hanamizuki_1-min.jpg);}
.room-wayou #hanamizuki #thumbs3.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-hanamizuki_2-min.jpg);}
.room-wayou #hanamizuki #thumbs4.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-hanamizuki_3-min.jpg);}
.room-wayou #hanamizuki #thumbs5.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-hanamizuki_4-min.jpg);}
.room-wayou #hanamizuki #thumbs6.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-hanamizuki_5-min.jpg);}


.room-wayou #tachibana #thumbs1.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-tachibana_0-min.jpg);}
.room-wayou #tachibana #thumbs2.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-tachibana_1-min.jpg);}
.room-wayou #tachibana #thumbs3.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-tachibana_2-min.jpg);}
.room-wayou #tachibana #thumbs4.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-tachibana_3-min.jpg);}
.room-wayou #tachibana #thumbs5.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-tachibana_4-min.jpg);}
.room-wayou #tachibana #thumbs6.swiper-pagination-bullet{background-image: url(../img/guestroom/wayou-tachibana_5-min.jpg);}

/*
room-special
------------------------ ---------------------------------------------*/

.room-special #pagehead{
	background-image: url(../img/guestroom/room_special-pagehead.jpg);
}

.room-special #thumbs1.swiper-pagination-bullet{background-image: url(../img/guestroom/special-nishikigi_0-min.jpg);}
.room-special #thumbs2.swiper-pagination-bullet{background-image: url(../img/guestroom/special-nishikigi_1-min.jpg);}
.room-special #thumbs3.swiper-pagination-bullet{background-image: url(../img/guestroom/special-nishikigi_2-min.jpg);}
.room-special #thumbs4.swiper-pagination-bullet{background-image: url(../img/guestroom/special-nishikigi_3-min.jpg);}
.room-special #thumbs5.swiper-pagination-bullet{background-image: url(../img/guestroom/special-nishikigi_4-min.jpg);}
.room-special #thumbs6.swiper-pagination-bullet{background-image: url(../img/guestroom/special-nishikigi_5-min.jpg);}



/*
room-hanare
------------------------ ---------------------------------------------*/

.room-hanare #pagehead{
	background-image: url(../img/guestroom/room_hanare-pagehead.jpg);
}

.room-hanare #thumbs1.swiper-pagination-bullet{background-image: url(../img/guestroom/hanare_0-min.jpg);}
.room-hanare #thumbs2.swiper-pagination-bullet{background-image: url(../img/guestroom/hanare_1-min.jpg);}
.room-hanare #thumbs3.swiper-pagination-bullet{background-image: url(../img/guestroom/hanare_2-min.jpg);}
.room-hanare #thumbs4.swiper-pagination-bullet{background-image: url(../img/guestroom/hanare_3-min.jpg);}
.room-hanare #thumbs5.swiper-pagination-bullet{background-image: url(../img/guestroom/hanare_4-min.jpg);}
.room-hanare #thumbs6.swiper-pagination-bullet{background-image: url(../img/guestroom/hanare_5-min.jpg);}



/*
cuisine
------------------------ ---------------------------------------------*/
#cuisine #pagehead{
	background-image: url(../img/cuisine/pagehead.jpg);
}

#dinner{
	overflow: hidden;
	position: relative;
	height: 900px;
}


#dinner>div{
	position: absolute;
}


#dinner div:nth-child(1){top: 0px; left: 0px;}
#dinner div:nth-child(2){top: 0px; left: 330px;}
#dinner div:nth-child(3){top: 0px; right: 0px;}
#dinner div:nth-child(4){top: 230px; left: 0px;}
#dinner div:nth-child(5){top: 230px; left: 250px;}
#dinner div:nth-child(6){top: 460px; left: 0px;}
#dinner div:nth-child(7){top: 460px; left: 650px}
#dinner div:nth-child(8){top: 660px; left: 650px;}
#dinner div:nth-child(9){top:460px; right: 0px;}
#dinner div:nth-child(10){top:710px; right: 0px;}



#type{
	
}
		#type p{
			text-align: justify;
			font-size: 1.4rem;
		}

		#type .pic {
			margin-top: 20px;
		}

		#type .pic img+img{
			margin-left: 16px;
		}




/*
hotspa
------------------------ ---------------------------------------------*/
#hotspa #pagehead{
	background-image: url(../img/hotspa/pagehead.jpg);
}

#daiyokujyo .naiyo{
	float: right;
} 

#daiyokujyo .pic{
	float: left;
}


#daiyokujyo .naiyo .img{
	margin-top: 30px;
	text-align: center;
}



#uchiyu{
	overflow: hidden;
	text-align: center;
}

		#uchiyu ul li{
			width: 400px;
			float: left;

		}

		#uchiyu ul li+li{
			margin-left: 40px;
		}


				#uchiyu ul li dl dt{
					margin: 10px 0;
					padding-bottom: 5px;
					letter-spacing: 5px;
					font-size: 2rem;			
					font-weight: bold;
					background: url(../img/base/line.png) 50%100% no-repeat;
				}

				#uchiyu ul li dl dd{
					font-size: 2.4rem;
				}


#uchiyu ul li .ido{
	margin-top: 30px;
	margin-bottom: 50px;
}
	

/*
facility
------------------------ ---------------------------------------------*/
#facility #pagehead{
	background-image: url(../img/facility/pagehead.jpg);
}


#kannai{
	overflow: hidden;
	position: relative;
	height: 950px;
	margin-bottom: -50px;
}


#kannai>div{
	position: absolute;
}


#kannai div:nth-child(1){top: 0px; left: 170px;}
#kannai div:nth-child(2){top: 0px; left: 560px;}
#kannai div:nth-child(3){top: 250px; left: 0px;}
#kannai div:nth-child(4){top: 250px; left: 310px;}
#kannai div:nth-child(5){top: 0px; left: 0px;}
#kannai div:nth-child(6){top: 460px; left: 0px;}
#kannai div:nth-child(7){top: 460px; left: 730px}
#kannai div:nth-child(8){top: 460px; right: 0px;}
#kannai div:nth-child(9){top:670px; left: 730px;}
#kannai div:nth-child(10){top:670px; right: 0px;}


/*
access
------------------------ ---------------------------------------------*/
#access #pagehead{
	background-image: url(../img/access/pagehead.jpg);
}

#access #map{
	padding: 0px 0;
}

#access #map .pic{
	border: 1px solid #ccc;
}

#access .naiyo h3{
	margin-bottom: 20px;
	text-align: left;
	
}

#access .naiyo h4{
	margin-top: 20px;
}


#access .naiyo p{
	line-height: 1.8;
}


#tourism{
	
}

#tourism ul li{
	float: left;
	margin-right: 20px;
	margin-bottom: 30px;
	text-align: center;
}

#tourism ul li:nth-child(3n){
	margin-right: 0;
}


#tourism ul li img{
	display: block;
}




/*
news
------------------------ ---------------------------------------------*/
main#news{
	padding-top: 50px;
}

		#news h1{
			margin: 0 0 20px 0;
			padding: 0px 0 10px 0;
			text-align: center;
			font-size: 3.6rem;
			background: url(../img/base/line.png) no-repeat 50% 100%;
		}



		#news.single h1{
			display: none;
		}

		#news.single h2{
			margin-bottom: 10px;
			text-align: justify;
		}

#news.single .detail{
	text-align: justify;
	font-size: 1.4rem;
}



		.single .up_ymd{
			text-align: right;
			font-size:13px;
			margin:0 0 50px 0;
			padding:0  0 10px 0;
			border-bottom: 1px solid #ccc;
		}


		.single .tenpfile{
			margin:5px 0 35px;
			text-align:center;
		}

				.single.tenpfile img{
					max-width:100%;
					height:auto;
				}

.pankz{
	
}

.pankz{
	padding: 0px 0 30px 0;
	font-size: 1.4rem;
}

.pankz ul li{
	display: inline-block;
}

.pankz ul li+li:before{
	content: ">";
	padding-right: 20px;
}

.pankz ul li a{
	color: #222;
	text-decoration: underline;
}

.pager{
	text-align: center;
	padding:50px;
	clear:both;
}
		.pager a{
			border: 1px solid #999;
			border-radius: 5px 5px 5px 5px;
			color: #333;
			font-size: 12px;
			padding: 16px;
			text-decoration: none;
			margin:0 10px;
		}

				.pager a.current{
					background: #999;
					border: 1px solid #999;
					border-radius: 5px 5px 5px 5px;
					color: #fff;
					font-size: 12px;
					padding: 16px;
					margin:0 1px;
					text-decoration: none;
				}

				.pager a:hover{
					background:#999;
					color: #fff;
				}

.overPagerPattern{
	padding:0 2px ;	
}