@charset "utf-8";
/* CSS Document */

/* ================================================================
( ・∋ Reset
================================================================ */
html {
   font-size: 100%;
   overflow-y: scroll;
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
	 -webkit-font-smoothing: antialiased;
	 }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, 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-style:normal; font-size: 100%; vertical-align: baseline;}

html,body { width:100%; height:100%;min-width:1280px;}

strong { font-style: normal; font-weight: bold;}
img { border: 0; vertical-align:top; -ms-interpolation-mode: bicubic;/*ie7*/}
a:hover {opacity: 0.6;transition: 0.3s;}
ul,ol { list-style: none;}

/* ================================================================
( ・∋ Base
================================================================ */
body { color:#222;background:url(../img/bg.jpg) repeat;
	font-family: Verdana, Roboto, "Droid Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif, "游ゴシック", YuGothic;
	/*font-family :"Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;*/
	font-size: 16px;
	line-height: 2.0em;
	}
	
a{color:#222; text-decoration:none;}

/*---clearfix---*/
.clearfix:before , .clearfix:after  , .wrapper:after , .inner:after , section:after , footer:after , main:after , #index nav:after{ content:""; display:table;}
.clearfix:after  , section:after , .inner:after , footer:after , main:after , #index nav:after{ clear:both;}
.clearfix , section , main , footer:after{ clear:both; zoom:1;}

/*---table---*/
table { width:100%; border-collapse: collapse;border-spacing: 0;margin-bottom: 20px;}
th,td { padding: 10px;border-bottom:#b0b0b0 solid 1px;}
th {text-align:left; font-weight:normal;}
.wrapper , .inner{width:1000px; margin:0 auto;}

/*---header---*/
#index header{background:url(../img/bg.jpg) repeat; position:absolute;width:245px; height:570px; margin:0 auto;text-align:center; top:100px; left:80px; z-index:1;}
#index nav { clear:both; padding:30px 20px 0 0;width:245px; box-sizing:border-box; margin:0 0 20px 0;}
#index nav li{ float:right; margin:0 16px 0 0;}
.h_plan02{ position:absolute; width:100%; bottom:0; background:url(../img/bg02.jpg) repeat; }
.h_plan02 a{ display:block;padding:20px; height:70px; box-sizing:border-box;}
header{background:url(../img/bg.jpg) repeat; position:fixed;width:100%; height:160px; margin:0 auto;top:0; left:0; z-index:1000;}
nav { width:650px; padding:60px 0 0 0; margin:0 auto;}
nav ul{}
nav li{ float:left; margin:0 20px 0 0;}
.h_plan{ float:right; width:260px; text-align:center; padding:30px 20px 0 0; box-sizing:border-box;}
.header_image{position:relative; width:100%; height:800px;}
.header_image h2{text-align:center; padding:360px 0 0 0;}
#onsen .header_image{ background:url(../img/onsen/header.jpg) no-repeat center center;}
#cuisine .header_image{ background:url(../img/cuisine/header.jpg) no-repeat center center;}
#facilities .header_image{ background:url(../img/facilities/header.jpg) no-repeat center center;}
#access .header_image{ background:url(../img/access/header.jpg) no-repeat center center;}
#sightseeing .header_image{ background:url(../img/sightseeing/header.jpg) no-repeat center center;}

/*---contents---*/
main{ display:block; padding:60px 0;}
section{margin:0 0 120px 0;}
.wrapper , .inner{width:1000px; margin:0 auto; position:relative;}
.lead{ position:relative;}
.lead01{ position:absolute; left:-150px; top:0;}
.lead02{ position:absolute; right:-125px; top:110px;}
.w50{width:50%; position:relative;}
.w300{width:300px;}
.w400{width:400px;}
.w460{width:460px;}
.w480{width:480px;}
.w500{width:500px;}
.w560{width:560px;}
.w600{width:600px;}
.w700{width:700px;}

footer{ clear:both;width:100%;background:url(../img/f_bg.png) repeat-x bottom ; text-align:center; padding:60px 0 0 0; position:relative; }
footer img{ margin:0 0 120px 0;}
footer::before{ display:block; content:""; width:100%; height:3px; background:#408ba5; position:absolute; bottom:46px;z-index:1;}
footer strong{ font-weight:normal; font-size:20px;}
address{font-size:12px;height:40px; background:#222; color:#DDD; padding:10px 0 0 0; box-sizing:border-box;}
address img{margin:8px 0 0 0;}
.pagetop{position:fixed; bottom:100px; right:20px; z-index:100;}
.pagetop a{display:block; background:#222; width:40px; height:120px; text-align:center; padding:20px 0; box-sizing:border-box;}
.pagetop a img{ transition:0.3s;}
.pagetop a:hover img{-webkit-transform: translateY(-10px);transform: translateY(-10px);}

/*---common---*/
h1{float:left;}
.center{text-align:center;}
.f_left{ float:left;}
.f_right{float:right;}
.m_t15{ margin-top:15px;}
.m_t20{ margin-top:20px;}
.m_t30{ margin-top:30px;}
.m_t50{ margin-top:50px;}
.m_t60{ margin-top:60px;}
.m_t140{ margin-top:140px;}
.m_b10{margin-bottom:10px;}
.m_b20{margin-bottom:20px;}
.m_b30{margin-bottom:30px;}
.m_b40{margin-bottom:40px;}
.m_b60{margin-bottom:60px;}

/*フォーム*/
input , select , input[type=checkbox] , textarea{border:none; background:#FFF; height:40px; padding:5px; margin:0; box-sizing:border-box;}
textarea{height:auto;}
input[type=image]{border:none; padding:0; opacity:1; transition:0.3s;}
input[type=image]:hover{opacity:0.7;}
label {padding-left:30px;line-height:24px;display:inline-block;cursor:pointer;position:relative;}
label:before {content:'';width:24px;/* ボックスの横幅 */height:			24px;			/* ボックスの縦幅 */display:		inline-block;position:		absolute;left:			0;
	background-color:	#FFF;border:none;
}
input[type=checkbox] {display:		none;}
input[type=checkbox]:checked + label:before {content:'\2713';/* チェックの文字 */ 
	font-size:		24px;			/* チェックのサイズ */
	color:			#fff;			/* チェックの色 */
	background-color:	#a15558;			/* チェックした時の色 */
}
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background:#FFF url(../img/select_arrow.png) right 50% no-repeat; padding:5px 20px 5px 5px}
select::-ms-expand {display: none;}
input[type=submit]{ background:#3d9fd2; padding:16px 40px; font-size:20px; color:#FFF; height:auto;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;}
input[type=submit]:hover{cursor:pointer;}

/* ================================================================
( ・∋ Index
================================================================ */
#mainVisual{ position:relative;overflow:hidden;}
.point_col{ position:relative; padding:60px 0 0 0;}
.point_col h2 img{ position:absolute; z-index:10;top: 0;left: 0;bottom: 0;right: 0; margin:auto;}
.point_col h3{ width:100px; position:absolute; z-index:1;}
.point_col h3.t_yu{top:-50px;left:10%;}
.point_col h3.t_cuisine{bottom:-50px;right:10%;}
.point_col a{position:relative; display:block; width:100%;}
/*.point_col .t_yu{ position:absolute; z-index:1;top: -50px;left: 0;right: 0; margin:auto;}*/
.point{ float:left; width:50%; height:auto;position:relative; /*overflow:hidden;*/}
/*.point:before{content:'';display:block;width:100%; height:0; padding-bottom:75%;}*/
.point_img{width:100%; height:100%; overflow:hidden; position:relative;}
.point_img img{width:100%;/*-webkit-transform: scale(1);transform: scale(1);-webkit-transition: 1s ease-in-out;transition: 1s ease-in-out; position:absolute;top: 0;left: 0;bottom: 0;right: 0;*/}
/*.point_img:hover img{-webkit-transform: scale(1.3);  transform: scale(1.3)}*/
.point_icon{width:60px !important; position:absolute; left:0; right:0; bottom:0; top:0;margin:auto; display:none;}
.point_col a:hover .point_icon{ display:inherit;}

.point_window{ position:absolute; width:100%; height:100%; top:0; left:0; background:#FFF; /*background:url(../img/winndow.png) no-repeat right center;*/ z-index:1;}

.plan_rss{ display:flex;align-items:center;}
.plan_rss_t{ width:30%; text-align:center;}
.plan_rss_t h3{margin:0 0 120px 0;}
/*.plan_rss_col{width:70%;}
.plan_rss_col a{display:block; float:left; width:33.33%; overflow:hidden; position:relative;}
.plan_rss_col a:before{content:'';display:block;width:100%; height:0; padding-bottom:100%;}
.plan_rss_col img{width:100%; height:100%; position:absolute;left:0; right:0; bottom:0; top:0;margin:auto;}
.plan_rss_col a p{position:absolute; background:rgba(0,0,0,0.5); color:#FFF; top:0; left:0; width:100%; height:100%; padding:10%;box-sizing:border-box; font-size:16px; opacity:0; transition:0.3s;}
.plan_rss_col a p:hover{opacity:1;}*/


.plan_rss_col{width: 70%;}
.plan_rss_col a{width: 32.833%;
	margin-left: 0.5%;
	display: block;
	overflow: hidden;
	margin-bottom: 30px;
	vertical-align:top;
	float: left;
}
.plan_rss_col p{
	height: 60px;
	padding: 10px;
	background:rgba(0,0,0,0.5);
	color:#FFF;
	vertical-align:bottom;
}
.plan_img{width: 100%; overflow: hidden;}
.plan_img img{width: 100%; height: auto; vertical-align: bottom;}


.i_obo01{width:100%;height:200px;background-attachment: fixed;background-image: url(../img/index/obi01.jpg);	background-repeat: no-repeat;background-position: right top;float: right;position:relative;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.2) inset;background-size: cover; margin:0 0 120px 0; overflow:hidden;}

#index video {min-width: 1300px;width: 100%;opacity: 1;left: 0;top: 0;}

.plan_search{
	font-size: 14px;
	line-height: 1.2em;
	padding: 37px 0 0 0;
	color: #222;
	font-family : "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;
}
.plan_search table{float:left; width:300px;}
.plan_search span{font-size:11px;}
.plan_search table , .plan_search th , .plan_search td{background:url(../img/index/bg_search.jpg) repeat;border:none; padding:10px 20px; margin:0; vertical-align: middle;}
.plan_search input , .plan_search select , .plan_search table img{margin:8px 0 0 0;}
/*.plan_search tr td:first-child{padding:0 0 0 20px;}
*/.plan_search input[type=image]{ margin:0 0 0 0; height:100%;}


#mainVisual{position: relative;
	width: 100%;
	height: auto;
}
#mainVisual:before {
	content: "";
	display: block;
	padding-top: 56.3%; /* 1:1 */
}

.movie_inner{
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	overflow:hidden;
}
.movie_inner video{
	width:100%;
	height:auto !important;
	margin-left:auto;
	margin-right:auto;
	/*object-fit: cover;*/
}
.news{width:660px;}

.index_lead{margin:0 auto; width:640px;}
.index_lead p {float:right; margin:0 0 0 30px;}
.index_lead p:last-child{margin:0 0 0 0;}

/* ================================================================
( ・∋ Onsen
================================================================ */
.onsen_lead{width:80%; margin:0 auto; padding:60px 0 0 0;}
.slide_col{ position:relative; }
.slide_col h2 img{ position:absolute; z-index:10;top: 0;left: 0;bottom: 0;right: 0; margin:auto;}
.slide_img h3{ width:100px; position:absolute; z-index:1;}
.slide_col .slide{ float:left; width:50%; height:auto;position:relative;}
.slide_img , .kazokuyu{height:600px; overflow:hidden; position:relative;}
.kazokuyu video{ display:block;margin:0 auto;}
.kazokuyu p{width:80%; margin:20px auto 0 auto;}

.bx-pager , .bx-pager02 , .bx-pager03{position:absolute; bottom:10px; right:10px;}
.bx-pager img , .bx-pager02 img , .bx-pager03 img{ margin:0 5px 0 0; border:#FFF solid 3px; width:80px; height:auto;min-height:auto;}

.gaiyou{display:flex;align-items:center;justify-content:space-between; margin:0 0 60px 0;}
.gaiyou h4{ width:160px;}
.gaiyou table{ width:840px;}

/* ================================================================
( ・∋ Cuisine
================================================================ */
/*#dinner{ position:relative;}
*/#dinner h3{position:absolute; top:0; left:0; right:0; text-align:center; z-index:10; margin:0 auto;}
#dinner { width:100%;height: 667px;overflow:hidden; position:relative;}
#dinner .bx-viewport {
    overflow: visible !important;
    width: 1026px !important;
  }
#dinner .main-container {overflow: hidden; padding-bottom: 150px;}
#dinner .slider {
    list-style: none;
    margin: 0;
    padding: 0;
  }
#dinner .slider li {
    width: 1000px !important;
    margin: 0;
    padding: 0;
  }
#dinner .bx-controls{width:1000px;}
.dinner_image{width:100%; margin:-100px auto 0; height:770px; overflow: hidden;}
.adjust01{position:relative; width: 1400px; margin: 0 auto;}


.shisetsu{display:flex;align-items:center;justify-content:space-between; margin:0 0 60px 0;}
.shisetsu h3{ width:60px;}

.kondate{ width:100%; margin:0 auto 120px auto;}
.kondate h3{ float:right;margin:0 0 0 40px;}
.kondate p{float:right;line-height:3em; letter-spacing:3px;-ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; }

.staff{position:relative; background:url(../img/cuisine/staff.png) no-repeat right top; height:500px;}
.staff p{/*width:300px;*/ margin:0 0 0 360px; text-align:right;-ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; text-align:left;}
.d_i01{position:absolute;top:0px;left: 0;}
.d_i02{position:absolute;top: 175px;left: 200px;}
.d_i03{position:absolute;top: 430px;left: 90px;}
.d_i04{position:absolute;top: 260px;left: -30px;left: -px;}
.d_i05{position:absolute;top: 390px;left: 310px;}
.d_i06{position:absolute;top: 250px;left: 470px;}


/* ================================================================
( ・∋ Sightseeing
================================================================ */
.s_col{display:flex;align-items:center;justify-content:space-between; margin:0 0 60px 0;}
.s_col::after{display: none;}
.t_s_main_s01 , .t_s_main_s02 , .t_s_main_s03 , .t_s_main_s04{ text-align:center; padding:10px 0; margin:0 0 60px 0;}
.t_s_main_s01{ background:rgba(65,137,158,0.5);}
.t_s_main_s02{ background:rgba(190,89,14,0.6);margin:0 0 20px 0;}
.t_s_main_s03{ background:rgba(69,143,33,0.5);}
.t_s_main_s04{ background:rgba(143,33,49,0.6);}

.shutter_l_t{ background:#111; width:100%; height:50%; position:fixed; top:0; left:0; z-index:10000;-webkit-animation:shutter02 5s forwards;animation:shutter02 2s forwards;min-height:400px;}
.shutter_l_b{ background:#000; width:100%; height:50%; position:fixed; bottom:0; left:0; z-index:10000;-webkit-animation:shutter02 5s forwards;animation:shutter02 2s forwards;min-height:400px;}



@-webkit-keyframes shutter02 {
0% {height:50%;min-height:400px;}
60% {height:50%;min-height:400px;}
70% {height:25%;min-height:200px;}
80% {height:25%;min-height:200px;}
100% {height:0%;min-height:0px;}
}
@keyframes shutter02 {
0% {height:50%;min-height:400px;}
60% {height:50%;min-height:400px;}
70% {height:25%;min-height:200px;}
80% {height:25%;min-height:200px;}
100% {height:0%;min-height:0px;}
}



/* ================================================================
( ・∋ 追加
================================================================ */
.slide_img video{
	width: auto;
	height: 677px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
