@charset "utf-8";
/* ---------------------------------------- /
/
/ リセット
/
/ ---------------------------------------- */
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, orm, 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; vertical-align: baseline; font-weight:500;}

ol, ul{ list-style:none;}
caption, th{ text-align: left;}

:focus { outline: none;}

/* ---------------------------------------- /
/
/ 基本設定
/
/ ---------------------------------------- */
html,body { width:100%; height:100%; min-width:1280px;}

body {
	font-size: 18px;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0.5px;
	color:#222222;
}


img { border:none; outline:none; vertical-align:middle; max-width: 100%;}


*, *:before, *:after {
    -webkit-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

.clear{	clear:both;	}
.clearfix:before,
.clearfix:after {
    content: " ";
	display: table;}
.clearfix:after {
    clear: both;
}

.f_left{ float:left;}
.f_right{ float:right;}


/* 汎用CSS
=============================================================================*/
/* ------- リンク ------- */
a,a:visited{
	color: #000000;
	font-weight: bold;
	text-decoration: underline;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
	}
a:hover,a:active{ text-decoration: none;}

/* ------- フォント ------- */
::selection {background: rgba(183,214,13,0.5); color: #658c20;}
::-moz-selection {background: rgba(183,214,13,0.5); color: #658c20;}

.sunserif{ font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;font-weight: 500;}
.serif{ font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.strong { font-weight:bold;}
.font_s{ font-size: 14px;}
.font_m{ font-size: 16px;}
.text_r{ text-align:right;}
.text_c { text-align:center;}
.text_l { text-align:left;}
.caution{ color:#81264a; font-weight:bold; font-size: 13px;}


/* --------------　透過　------------------ */

.opacity a:hover img{
	opacity: 0.6;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}

/* --------------　シャドウ　------------------ */
.shadow1 img{ box-shadow: 0 10px 20px rgba(0,0,0,0.05), 0 6px 6px rgba(0,0,0,0.1); -webkit-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.shadow1 img:hover{ box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.28);}
.shadow2{ box-shadow: 0 10px 20px rgba(0,0,0,0.05), 0 6px 6px rgba(0,0,0,0.1);}
.shadow3{ box-shadow:0px 4px 8px -4px rgba(0,0,0,0.5);}
.shadow4{ box-shadow: 0px 6px 6px -6px rgba(0,0,0,0.8);}
.text_shadow01{ text-shadow:1px 1px 3px rgba(0,0,0,0.5);	}

/* --------------　見出し　------------------ */
.midashi-01{ font-size: 26px; font-weight: bold; letter-spacing: 0.15em;}
.midashi-02{ font-size: 20px; font-weight: bold; letter-spacing: 0.15em; color: #658c20;}
.midashi-03 span{ font-size: 18px; color: #fff; font-weight: bold; display: inline-block; padding: 0.2em 1em; background: url("../img/base/btn-bg.jpg") repeat top left;}

/* --------------　box　------------------ */
.box1280{ width: 1280px; margin: 0 auto;}
.box1180{ width: 1180px; margin: 0 auto;}
.box980{ width: 980px; margin: 0 auto;}

.contents_inner{ max-width: 700px;}
.inner_pd50{ padding: 0 50px;}
.box_inner{ padding-right: 50px; }
.box_inner.col2_left{ float: right; padding-left: 50px; padding-right: 0;}

.bg-01{ background: #c7d672; -webkit-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.bg-02{ background: #e3eab8; -webkit-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.bg-03{ background: #cde9f0;}
.bg-04{ background: #b4e4f0;}

.box-white{ background: #fff; text-align: center; font-weight: bold; color: #658c20; padding: 0.5em 0;}
.box-gray{ background: #eeeeee; font-size: 16px; padding: 1em;}


/* --------------　コンテンツライン　------------------ */

/* --------------　テーブル　------------------ */
.table{
	width: 100%;
	border-top: 3px solid #76a920;
	border-bottom: 3px solid #76a920;
	border-collapse: collapse;
	font-size: 16px;
}
.table.t_fix{ table-layout: fixed;}

.table th{
	text-align: center;
	background: #fff;
	border-bottom: 1px solid #76a920;
	border-right: 1px solid #76a920;
	color: #76a920;
	font-weight: bold;
	padding: 0.5em 0.5em;
	vertical-align: middle;
}
.table td{
	text-align: center;
	background: #fff;
	border-right: 1px solid #76a920;
	padding: 0.5em 0.5em;
	vertical-align: middle;
}
.table th:last-of-type,
.table td:last-of-type{ border-right: none;}
.table .border_bottom{border-bottom: 1px solid #76a920;}
.table .border_right{border-right: 1px solid #76a920 !important;}
/* --------------　定義リスト　------------------ */
dt{ display: inline-block; font-weight: bold; color: #fff; background: #76a920; padding: 0 0.5em; margin-right: 1em;}
dd{ display: inline-block;}
/* --------------　select　------------------ */
.select-wrap select{
		width: 100%;
        outline:none;
        text-indent: 0.01px;
        text-overflow: '';
        background: #76a920;
        vertical-align: middle;
        font-size: 14px;
		font-weight: bold;
        -webkit-appearance: button;
        -moz-appearance: button;
        appearance: button;
		color: #fff;
		border: none;
		padding: 5px 20px 7px 10px;
		cursor: pointer;
    }
.select-wrap select option{
      background-color: #76a920;
      color: #fff;
    }
.select-wrap select::-ms-expand {
      display: none;
    }
.select-wrap select:-moz-focusring { 
      color: transparent; 
      text-shadow: 0 0 0 #fff;
    }
    .select-wrap {
		width: 120px;
        position:relative;
    }
    .select-wrap:before {
        z-index: 1;
        position: absolute;
        right: 0;
        top: 0;
		bottom: 0;
        content: url("../img/base/arrow-01.png");
        pointer-events: none;
		background: rgba(255,255,255,.3);
		padding: 0 6px;
		line-height: 28px;
    }
/* --------------　ボタン　------------------ */
.btn-white a{
	display: inline-block;
	width: 100%;
	border: 1px solid rgba(255,255,255,.8);
	padding: 0.5em 1em;
	line-height: 1;
}
.btn-white a:hover{
	opacity: 1;
	background: #fff;
	color: #76a920;
}
_:lang(x)::-ms-backdrop, .btn-white a {
    padding-top: 0.7em; /*IE游ゴ対策*/
} 
.btn-white02 a,.btn-white02 a:visited{
	display: inline-block;
	width: 100%;
	border: 1px solid #E0E8D2;
	background: #E0E8D2;
	padding: 0.2em 1em;
	line-height: 1;
	color: #658c20;
	margin-top: 7px;
}
.btn-white02 a:hover{
	opacity: 1;
	background: #658c20;
	color: #fff;
}
_:lang(x)::-ms-backdrop, .btn-white02 a {
    font-family: "メイリオ", sans-serif; /*IE游ゴ対策*/
} 
.btn-black{
	width: 243px;
	height: 53px;
	position: relative;
}
.btn-black::after{
	content: "";
	background: #76a920;
	width: 240px;
	height: 50px;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 1;
}
.btn-black a{
	display: block;
	position: absolute;
	width: 240px;
	background: url("../img/base/btn-bg.jpg") repeat top left;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	text-decoration: none;
	z-index: 2;
	top: 0;
	left: 0;
	-webkit-transition: all 0.1s linear 0s;
	transition: all 0.1s linear 0s;
}
.btn-black a:hover{
	top: 3px;
	left: 3px;
}
.btn-black a::after{
	content: "";
	background: url("../img/base/arrow-03.png") no-repeat top center;
	width: 14px;
	height: 12px;
	display: block;
	position: absolute;
	top: 19px;
	right: 20px;
}
/* --------------　画像　------------------ */
.img100{ width: 100%; height: auto;}
/*角丸イメージ*/
.img_round{
	border-radius: 10px;
}
/* --------------　調整　------------------ */
.mb1{ margin-bottom: 1em !important;}
.mb10{ margin-bottom: 10px !important;}
.mb20{ margin-bottom: 20px !important;}
.mb30{ margin-bottom: 30px !important;}
.mb40{ margin-bottom: 40px !important;}
.mb50{ margin-bottom: 50px !important;}
.mb60{ margin-bottom: 60px !important;}
.mb70{ margin-bottom: 70px !important;}
.mb80{ margin-bottom: 80px !important;}
.mb90{ margin-bottom: 90px !important;}
.mb100{ margin-bottom: 100px !important;}
.mb110{ margin-bottom: 110px !important;}
.mb120{ margin-bottom: 120px !important;}
.mb130{ margin-bottom: 130px !important;}



/* header
=============================================================================*/
header{
	border-top: 6px solid #76a920;
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	padding-bottom: 18px;
}
.header_tel{
	width: 310px;
	float: right;
	text-align: right;
	font-size: 10px;
	font-weight: bold;
	padding: 4px 0 14px 0;
}
.header_tel img{ margin-left: 6px;}
header .btn_list{ float: right;}
header .btn_list li{ margin-right: 10px;}
header .btn_list a{ text-decoration: none; font-size: 14px; font-weight: normal; margin-top: 0; vertical-align: top; border: none;}
header .btn_list a:hover{ border: none; background: #76A920;}
header h1{ float: left; margin-right: 14px; margin-top: -4px; line-height: 1;}
header h1 img{ vertical-align: top;}
header nav{ float: right;}
header ul li{ float: left; margin-right: 20px;}
header ul li:nth-child(7),header ul li:nth-child(8){ margin-right: 15px; padding-top: 4px;}
header ul li:last-child{ margin-right: 0;}
header .select-wrap{ margin-top: 4px;}

/* footer
=============================================================================*/
footer{
	font-size: 14px;
	color: #fff;
}
footer a,footer a:visited{ color: #fff; text-decoration: none; font-weight: normal;}
footer a:hover,footer a:active{ opacity: 0.6;}
footer .select-wrap{ border: 1px solid rgba(255,255,255,.8);}
footer .select-wrap select{ background: #658c20; padding: 4px 20px 6px 10px;}
.footer_top{
	background: url("../img/base/footer_img.png") no-repeat bottom center;
	height: 112px;
	text-align: right;
	padding: 40px 25px 0 0;
	margin-top: 30px;
}
footer .footer_inner{
	background: #658c20;
	padding: 20px 0 30px 0;
}
footer .footer_inner ul li{
	float: left;
}
footer .footer_inner .footer_navi li a{
	line-height: 1;
	vertical-align: middle;
}
footer .footer_inner .footer_navi li::after{
	content: "";
	width: 1px;
	height: 14px;
	background: rgba(255,255,255,.5);
	display: inline-block;
	margin: 0 10px;
	vertical-align: middle;
}
footer .footer_inner .footer_navi li:last-child::after{ display: none;}

footer .footer_inner .btn_list li{
	margin-right: 15px;
}
footer .f_right{ text-align: right; margin-bottom: 30px; line-height: 1.8;}
.yadosagashi img{ vertical-align: bottom;}

footer .footer_inner .f_left{
	position: relative;
}
footer .footer_inner .f_left .qr{
	display:block;
	position: absolute;
	top:40px;
	right:0px;
	width:120px;
	font-size:14px;
	text-align: center;
	margin: 0px auto ;
	line-height:1.4em;
}
footer .footer_inner .f_left .qr img{
		display:block;
	text-align: center;
	margin: 0px auto -15px;
	width:80px;
}
/* ============================================
	TOPページ-#index
=============================================== */
/*----------contents01----------*/
#index .contents01{
	padding: 80px 0;
	background: url("../img/top/contents01-bg.png") no-repeat right 152px;
}
/*----------contents02----------*/
#index .contents02{
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#index .contents02 .flex-colum{
	width: 25%;
	-webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
     -ms-flex-direction: row;
         flex-direction: row;
	position: relative;
}
#index .contents02 .flex-colum a{
	position: absolute;
	display: block;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	border: 1px solid #fff;
	z-index: 3;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);	
	transform: translateY(-50%) translateX(-50%);
}
#index .contents02 .flex-colum .point_img{
	float: left;
	width: 44%;
	height: 100%;
	position: relative;
	line-height: 1;
}
#index .contents02 .flex-colum .point_img .point_text-bottom{
	position: absolute;
	bottom: 3px;
	right: 0;
}
#index .contents02 .flex-colum .point_img .point_text-top{
	position: absolute;
	top: 3px;
	left: 3px;
}
#index .contents02 .flex-colum .point_detail{
	float: right;
	width: 56%;
	height: 100%;
	padding: 40px 16px;
}
#index .contents02 .flex-colum .point_detail h2{
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 10px;
}
#index .contents02 .flex-colum:hover{ background: #76a920; color: #fff;}
#index .contents02 .flex-colum:hover .point_img{ opacity: 0.6;}

#index .contents02 .btn-more{
	color: #76a920;font-size: 14px;
	font-weight: bold;
	border-bottom: 2px solid #76a920;
	background: url("../img/base/arrow-02.png") no-repeat 95% 50%;
	padding-bottom: 6px;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
#index .contents02 .flex-colum:hover .btn-more{
	color: #fff;
	background: url("../img/base/arrow-03.png") no-repeat 95% 50%;
	border-bottom: 2px solid #fff;
}
#index .flex-colum:nth-of-type(1) .point_img{ background: url("../img/top/point_photo-01.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(2) .point_img{ background: url("../img/top/point_photo-02.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(3) .point_img{ background: url("../img/top/point_photo-03.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(4) .point_img{ background: url("../img/top/point_photo-04.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(5) .point_img{ background: url("../img/top/point_photo-05.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(6) .point_img{ background: url("../img/top/point_photo-06.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(7) .point_img{ background: url("../img/top/point_photo-07.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(8) .point_img{ background: url("../img/top/point_photo-08.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(9) .point_img{ background: url("../img/top/point_photo-09.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(10) .point_img{ background: url("../img/top/point_photo-10.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(11) .point_img{ background: url("../img/top/point_photo-11.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
#index .flex-colum:nth-of-type(12) .point_img{ background: url("../img/top/point_photo-12.jpg") no-repeat top center; -webkit-background-size: cover; background-size: cover;}
/*----------contents03----------*/
#index .contents03{
	width: 100%;
	display: table;
}
#index .contents03 .col_left{
	width: 40%;
	display: table-cell;
	vertical-align: middle;
	background: url("../img/top/contents03-left.jpg") no-repeat top center;
	-webkit-background-size: cover;
	background-size: cover;
}
#index .contents03 .col_right{
	width: 60%;
	display: table-cell;
	vertical-align: middle;
	background: #c7d672;
	padding: 38px 60px;
}
#index .contents03 .col_right .contents_inner{ max-width: 800px;}
/*----------contents04----------*/
#index .contents04{ padding: 80px 0;}
#index .contents04 .f_left{ width: 810px;}
#index .contents04 .f_right{ width: 320px;}
#index .fb_wp{ width: 320px; height: 392px; margin-bottom: 20px;}
/*----------contents05----------*/
#index .contents05{
	width: 100%;
	display: table;
}
#index .contents05 .col_left{
	width: 40%;
	display: table-cell;
	vertical-align: middle;
	background: #fff;
	text-align: right;
	padding: 40px 40px 40px 0;
}
#index .contents05 .col_right{
	width: 60%;
	display: table-cell;
	vertical-align: middle;
	background: url("../img/blog-bg.jpg")no-repeat bottom right #c7d672;
	padding: 80px;
}
/*----------ヘッダー動画----------*/
#index .header_movie{
	position:relative;
	}
#index .header_movie{
	position: relative;
	top:0;
	padding-bottom: 36%;
	width:100%;
	height:0;
	overflow: hidden;
	z-index:0;
	background-color:#000;
	margin-top: 98px;
}
#index .header_movie video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto !important;
}

/*loopeslider*/
.loopslider {
	margin: 0 auto;
	width: 100%;
	height: 256px;
	text-align: left;
	position: relative;
	overflow: hidden;
}

.loopslider ul {
	width: 100%;
	height: 256px;
	float: left;
	display: inline;
	overflow: hidden;
}
.loopslider ul li {
	width: 384px;
	height: 256px;
	float: left;
	display: inline;
	overflow: hidden;
}
.loopslider ul li img{ width: 100%; height: auto;}
.loopslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.loopslider ul {
	display: inline-block;
	overflow: hidden;
}

/* ============================================

	下層ページ共通-.subpage

=============================================== */
.subpage .header_wp{ height: 400px; position: relative; margin-top: 98px;}
.subpage .pagetitle{ 
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);	
	transform: translateY(-50%) translateX(-50%);
}

/*contents*/
.subpage .contents01{ padding: 80px 0;}
.col2{ display: table; width: 100%;}
.col2 > section,
.col2 > div{ display: table-cell; width: 50%; vertical-align: top; padding: 80px 0;}
.col2 .box_inner{ margin: 0 0 0 50px;}
.col2 .box_inner.col2_left{ margin: 0 50px 0 0;}


/*レイアウト*/
.planbanner_l{
	width: 1180px;
	height: 205px;
	position: relative;
}
.planbanner_l img{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	-webkit-transition: all 0.1s linear 0s;
	transition: all 0.1s linear 0s;
}
.planbanner_l img:hover{
	top: 5px;
	left: 5px;
}
.planbanner_l::after{
	content: "";
	background: #76a920;
	width: 1175px;
	height: 200px;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 1;
}
.planbanner_fix{
	position: fixed;
	right: 0;
	top: 120px;
	z-index: 10;
}

/* ============================================
	温泉・日帰り　-　#hotspring
=============================================== */
#hotspring .header_wp{ background: url("../img/hotspring/mainvisual.jpg") no-repeat top center; background-size: cover;}
/*----------contents01----------*/
#hotspring .contents01 .lead_text{ padding-left: 80px; margin-bottom: 40px; line-height: 1.8;}

#hotspring .contents01 .section01{ position: relative; height: 510px; margin-bottom: 60px;;}
#hotspring .contents01 .section01::after{
	content: "";
	width: 590px;
	height: 370px;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	background: #eee;
	z-index: 0;
}
#hotspring .contents01 .section01 .movie_wp{ position: absolute; top: 0; left: 0; z-index: 1;}
#hotspring .contents01 .section01 .roten_detail{ position: absolute; width: 400px; top: 240px; right: 40px; z-index: 1;}
#hotspring .contents01 .section01 .roten_detail h3{ font-weight: bold; font-size: 20px; margin-bottom: 20px;}
#hotspring .contents01 .section01 .roten_detail dl{ font-size: 16px;}
#hotspring .contents01 .section02 .slider_wp{ width: 570px; height: 380px; background: #76a920;}
#hotspring .contents01 .col4,
#hotspring .contents02 .col5{
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#hotspring .contents01 .col4 > div{
	width: 25%;
	-webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
	position: relative;
}
#hotspring .contents01 .table th{ width: 190px;}
#hotspring .contents01 .table td{ text-align: left; padding-left: 1em;}

/*----------contents02----------*/
#hotspring .contents02 .col5 > section{
	width: 20%;
	-webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
	position: relative;
	padding-bottom: 20px;
}
#hotspring h3 .step{ display: block; text-align: center; color: #fff; font-size: 24px; font-weight: bold; background: url("../img/base/btn-bg.jpg") repeat top left; padding: 0.2em 0;}
#hotspring h3 .title{ display: block; text-align: center; font-size: 20px; font-weight: bold; padding: 0.2em 0; border-bottom: 1px solid #222; margin-bottom: 20px;}
#hotspring .howto_img{ text-align: center; margin-bottom: 20px;}
#hotspring .contents02 p{ font-size: 16px; padding: 0 40px;}
/*----------contents03----------*/
#hotspring .contents03 .f_left{ width: 666px; height: 542px; position: relative;}
#hotspring .contents03 .f_left .a_img01{ position: absolute; top: 0; left: 0; z-index: 2;}
#hotspring .contents03 .f_left .a_img02{ position: absolute; right: 0; bottom: 0; z-index: 1;}
#hotspring .contents03 .f_left::after{
	content: "";
	display: block;
	position: absolute;
	width: 440px;
	height: 293px;
	background: #76a920;
	z-index: 0;
	top: 142px;
	left: 112px;
}
#hotspring .contents03 .f_right{ width: 470px; padding-top: 140px;}
/*----------contents04----------*/
#hotspring .contents04 .section01{ position: relative; height: 510px; margin-bottom: 60px;;}
#hotspring .contents04 .section01::after{
	content: "";
	width: 590px;
	height: 370px;
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	background: #eee;
	z-index: 0;
}
#hotspring .contents04 .section01 .movie_wp{ position: absolute; top: 0; right: 0; z-index: 1;}
#hotspring .contents04 .section01 .roten_detail{ position: absolute; width: 420px; top: 220px; left: 60px; z-index: 1;}
#hotspring .contents04 .section01 .roten_detail h3{ font-weight: bold; font-size: 20px; margin-bottom: 20px;}
#hotspring .contents04 .section01 .roten_detail dl{ font-size: 16px;}

/*----------contents05----------*/
#hotspring .contents05{ padding: 60px 0;}
#hotspring .contents05 .box-white .strong{ color: #76a920;}
#hotspring .contents05 .box-white p{ color: #222;}

/* ============================================
	手作り料理　-　#cuisine
=============================================== */
#cuisine .header_wp { overflow: hidden;}
#cuisine .header_wp video{
	position: absolute;
	width: 100%;
	height: auto !important;
	top: 0;
	left: 0;
}
#cuisine .col2 > div{ padding: 0; vertical-align: middle;}
/*----------contents01----------*/
#cuisine .contents01 .lead_text{ padding-left: 80px; margin-bottom: 36px; line-height: 1.8;}
#cuisine .contents01 .text_zoom{ color: #76a920; font-size: 16px;}
#cuisine .contents01 .text_zoom img{ margin-right: 6px;}

/*----------contents02----------*/
#cuisine .contents02{ height: 697px; position: relative;}
#cuisine .contents02 .col_detail{
	width: 596px;
	position: absolute;
	top: 20px;
	right: 0;
	z-index: 1;
}
#cuisine .contents02 .col_detail p{ margin-left: 40px; line-height: 1.8;}
#cuisine .contents02 .btn-black{ width: 283px;}
#cuisine .contents02 .btn-black::after{ width: 280px;}
#cuisine .contents02 .btn-black a{ width: 280px;}
#cuisine .contents02 .b_img01{ position: absolute; top: 0; left: 0; z-index: 1;}
#cuisine .contents02 .b_img02{ position: absolute; top: 390px; left: 350px; z-index: 1;}
#cuisine .contents02::after{
	content: "";
	width: 713px;
	height: 476px;
	background: #e3eab8;
	display: block;
	position: absolute;
	top: 187px;
	left: 57px;
	z-index: 0;
}
/*----------contents03----------*/
#cuisine .contents03{ height: 530px; position: relative;}
#cuisine .contents03 .col_detail{
	width: 560px;
	position: absolute;
	top: 40px;
	left: 40px;
	z-index: 1;
}
#cuisine .contents03 .col_detail p{ margin-left: 40px; line-height: 1.8;}
#cuisine .contents03 .b_img01{ position: absolute; top: 75px; right: 0; z-index: 1;}
#cuisine .contents03 .b_img02{ position: absolute; top: 220px; right: 582px; z-index: 1;}
#cuisine .contents03::after{
	content: "";
	width: 713px;
	height: 351px;
	background: #cde9f0;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}
/*----------contents04----------*/
#cuisine .contents04{ height: 720px; position: relative;}
#cuisine .contents04 .col_detail{
	width: 521px;
	position: absolute;
	top: 20px;
	right: 72px;
	z-index: 1;
}
#cuisine .contents04 .col_detail p{ margin-left: 40px; line-height: 1.8;}
#cuisine .contents04 .b_img01{ position: absolute; top: 0; left: 0; z-index: 1;}
#cuisine .contents04 .b_img02{ position: absolute; top: 220px; right: 72px; z-index: 1;}
#cuisine .contents04 .b_img03{ position: absolute; top: 393px; left: 170px; z-index: 1;}
#cuisine .contents04::after{
	content: "";
	width: 713px;
	height: 476px;
	background: #e3eab8;
	display: block;
	position: absolute;
	top: 187px;
	left: 57px;
	z-index: 0;
}
/*----------contents05----------*/
#cuisine .contents05 .bg-01{ padding: 40px 0;}
#cuisine .contents05 .slider_wp{ background: #c7d672;}
#cuisine .contents05 .slider_wp img{ min-width: 700px !important;}
#cuisine .contents05 .special{
	background: #e3eab8;
	padding: 10px;
}
#cuisine .contents05 .special .f_left{ max-width: 100px; width: 18%;}
#cuisine .contents05 .special .f_right{padding-left: 10px; padding-top: 6px; float: left;}
#cuisine .contents05 .special .f_right h3{ font-size: 20px; font-weight: bold; margin-bottom: 4px;}
#cuisine .contents05 .thumb_pager a{
	display: inline-block;
	margin-right: 10px;
}
#cuisine .contents05 .thumb_pager a:last-child{ margin-right: 0;}
/*----------contents06----------*/
#cuisine .contents06{ padding: 60px 0;}
#cuisine .contents06 .box-white .strong{ color: #76a920;}
#cuisine .contents06 .box-white p{ color: #222;}
/*----------contents07----------*/
#cuisine .contents07 .f_left{ width: 700px; height: 477px;}
#cuisine .contents07 .f_left::after{ width: 700px; height: 467px;}
#cuisine .contents07 .f_right{ width: 400px; padding-top: 100px;}



/* ============================================
	館内　-　#facilities
=============================================== */
#facilities .header_wp{ background: url("../img/facilities/mainvisual.jpg") no-repeat top center; background-size: cover;}
#facilities .col2 > div{ padding: 0; vertical-align: middle;}
/*----------contents01----------*/
#facilities .contents01 .lead_text{ width: 1180px; margin: 0 auto; padding-left: 80px; margin-bottom: 40px; line-height: 1.8;}
#facilities .contents01 .bg-01{ background: url("../img/active/contents01_section01-bg.jpg") no-repeat right bottom #c7d672;}
#facilities .thumb_pager a{
	display: inline-block;
	margin-right: 10px;
}
#facilities .thumb_pager a:last-child{ margin-right: 0;}

.f_box01{ width: 570px; height: 410px; position: relative;}
.f_box01 .f_img{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.f_box01 h3{
	position: absolute;
	top: 356px;
	left: 0;
	z-index: 2;
}
.f_box01 .midashi-03 span{padding: 12px 1.5em;}
.f_box01::after{
	content: "";
	display: block;
	position: absolute;
	width: 570px;
	height: 380px;
	z-index: 0;
	top: 10px;
	right: -10px;
	background: #76a920;
}
.f_box02{ width: 560px; height: 416px; position: relative;}
.f_box02 .f_img{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.f_box02 h3{
	position: absolute;
	bottom: 16px;
	left: 40px;
	z-index: 2;
	font-weight: bold;
	font-size: 16px;
}
.f_box02::after{
	content: "";
	display: block;
	position: absolute;
	width: 540px;
	height: 360px;
	z-index: 0;
	bottom: 0;
	right: 0;
	background: #eeeeee;
}

.box_inner div.Twin{width: 440px; min-width: 460px;}
.box_inner div.Single{width: 145px; min-width: 145px; display: inline-block; }
.box_inner div.Barrier-free{width: 295px; min-width: 315px; display: inline-block; }

/*----------contents02----------*/


/*----------contents03----------*/

/* ============================================
	アクティブ　-　#active
=============================================== */
#active .header_wp{ background: url("../img/active/mainvisual.jpg") no-repeat top center; background-size: cover;}
/*----------contents01----------*/
#active .contents01 .movie_wp{ padding: 0; position: relative; overflow: hidden;}
#active .contents01 .movie_wp video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	min-width: 878px;
	height: auto !important;
}
#active .contents01 .section01 .bg-01{ height: 480px; vertical-align: middle; background: url("../img/active/contents01_section01-bg.jpg") no-repeat right bottom #c7d672;}
#active .contents01 .section02 .bg-02{ height: 480px; vertical-align: middle;}
#active .contents01 .section02 .movie_wp{ background: url("../img/active/contents01_section02-photo.jpg") no-repeat top center; background-size: cover;}
/*----------contents02----------*/
#active .contents02 .section01 .bg-04{ background: url("../img/base/bg-snow.png") no-repeat right bottom #cde9f0;}
#active .contents02 .section01 .movie_wp{ background: url("../img/active/contents02_section01-photo.jpg") no-repeat top center;background-size: cover;}

#active .contents02 .section01 ul{ max-width: 334px;}

#active .contents02 ul li{ border-bottom: 2px solid #2081a9; color: #2081a9; margin-bottom: 10px;}
#active .contents02 ul li a{
	display: block;
	position: relative;
	text-decoration: none;
	color: #2081a9;
}
#active .contents02 ul li a::after{
	content: "";
	width: 14px;
	height: 12px;
	background: url("../img/base/arrow-04.png") no-repeat top center;
	position: absolute;
	display: block;
	top: 30%;
	right: 10px;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
#active .contents02 ul li a:hover{
	opacity: 0.6;
}
#active .contents02 ul li a:hover::after{
	right: 0;
}
#active .contents02 .col4{
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#active .contents02 .col4 > section{
	width: 25%;
	-webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
	position: relative;
}
#active .contents02 .col4 h4{
	border-bottom: 2px solid #2081a9;
	color: #2081a9;
	margin-bottom: 10px;
	font-size: 22px;
	font-weight: bold;
}
#active .contents02 .col4 .box_inner{
	padding: 20px 40px;
	font-size: 16px;
}
/* ============================================
	団体予約・料金案内　-　#price
=============================================== */
#price .header_wp{ background: url("../img/price/mainvisual.jpg") no-repeat top center; background-size: cover;}
/*----------contents01----------*/
#price .contents01 .f_left,
#price .contents01 .f_right{ width: 540px;}
/*----------contents02----------*/
#price .contents02 .bg-01{
	background: url("../img/top/blog-bg.jpg") no-repeat right bottom #c7d672;
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
	display: block;
}
#price .contents02 .box_inner{ width: 540px; padding: 0;}
#price .contents02 .box_inner .table th{ width: 160px;}
#price .contents02 .box_inner .table td{ text-align: left;}
/* ============================================
	アクセス・周辺情報　-　#access
=============================================== */
#access .header_wp{ background: url("../img/access/mainvisual.jpg") no-repeat top center; background-size: cover;}
#access .contents02,
#access .contents03{ padding: 80px 0;}

.spot_wp{
	background: #fff;
	border: 1px solid #76a920;
	margin-bottom: 20px;
}
.contents03 .spot_wp{
	border: 1px solid #2081a9;
}
.spot_wp:last-of-type{ margin-bottom: 0;}
.spot_img{ width: 320px;}
.spot_detail{ width: 856px; padding: 20px; font-size: 16px;}
.contents02 .spot_img,
.contents03 .spot_detail{ float: left;}
.contents02 .spot_detail,
.contents03 .spot_img{ float: right;}

.spot_wp h3{ font-size: 20px; border-bottom: 2px solid #76a920; color: #76a920; font-weight: bold; padding-bottom: 2px; margin-bottom: 16px;}
.contents03 .spot_wp h3{ border-bottom: 2px solid #2081a9; color: #2081a9;}
.spot_wp h3 a{
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: #76a920;
}
#access .contents04 p a{
	display: block;
	position: relative;
	text-decoration: none;
	color: #76a920;
}
.contents03 .spot_wp h3 a{
	color: #2081a9;
}
.spot_wp h3 a::after{
	content: "";
	width: 14px;
	height: 14px;
	background: url("../img/base/arrow-02.png") no-repeat top center;
	display: inline-block;
	margin-left: 14px;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
#access .contents04 p a::after{
	content: "";
	width: 14px;
	height: 12px;
	background: url("../img/base/arrow-02.png") no-repeat top center;
	position: absolute;
	display: block;
	top: 30%;
	right: 10px;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
.contents03 .spot_wp h3 a::after{
	background: url("../img/base/arrow-04.png") no-repeat top center;
}
.spot_wp h3 a:hover,
#access .contents04 p a:hover{
	opacity: 0.6;
}
.spot_wp h3 a:hover::after{
	margin-left: 24px;
}
#access .contents04 p a:hover::after{
	right: 0;
}
/*----------contents04----------*/
#access .contents04{ padding-top: 60px;}
#access .contents04 p{
	width: 400px;
	margin: 0 auto;
	font-size: 20px;
	border-bottom: 2px solid #76a920;
	color: #76a920;
	font-weight: bold;
	padding-bottom: 2px;
}


/* RSS
=============================================================================*/
/*プラン*/
.mini{
	width:100%;
	margin-bottom: 30px;
}
.mini:last-child{ margin-bottom: 0;}
.mini h3{
	font-size:16px;
	line-height:26px;
	margin-bottom:10px;
	font-weight: bold;
}
.mini p{ font-size: 14px;}

.minileft{
	width: 530px;
	float: right;
}
.miniright{
	float: left;
	width:260px;
}
.miniright img{
	width:260px;
	height: auto;
}
.mini p{
	word-wrap : break-word;
	overflow-wrap : break-word;
	font-size:14px;
	line-height: 24px;
}
/*空室検索*/
.search_wp{
	width: 100%;
	padding: 20px 20px 12px 20px;
	font-size:14px;
	background: #fff;
	margin-bottom: 40px;
}
.search_wp h3{ width: 220px; padding-right: 20px; float: left; padding-top: 24px;}
.search_wp h4 { float:left; line-height: 30px;}
.search_wp h4 span{ font-size: 12px;}
.search_wp form{ width: 920px; float: left;}
.search_wp .column-top{ margin-bottom: 20px;}
.search_wp div div{ float:left;}

.search_wp input,
.search_wp select{
	font-size:13px;
	color:#330d0e;
	background: rgba(0,0,0,.1);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 0px solid rgba(0,0,0,.1);
}
.search_wp select::-ms-expand{
	display: none; /*IE矢印*/
}
.search_wp .search_btn input{ border: none;}
.search_wp input[type="text"]{
	width:130px;
	height:30px;
	padding: 2px 5px;
}
.search_wp select{
	width:100%;
	height:30px;
	padding: 0 5px;
	background: url("../img/base/arrow-00.png") 95% 50% no-repeat rgba(0,0,0,.1);
}
.search_wp .check_in label{
	position: relative;
	display: inline-block;
	word-break: break-all;
	line-height: 1.2;
	margin-top: 4px;
}
.search_wp .check_in label input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}
.search_wp .check_in label input[type="checkbox"] + span{
	position: relative;
  	padding: 0 0 0 0;
	font-size: 12px;
}
.search_wp .check_in label input[type="checkbox"] + span::before{
  border-color: #83b136;
}
.search_wp .check_in label input[type="checkbox"]:checked + span::before {
  background-color: #fff;
}
.search_wp .check_in label input[type="checkbox"] + span::before, .search_wp .check_in label input[type="checkbox"] + span::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  content: '';
  box-sizing: border-box;
}
.search_wp .check_in label input[type="checkbox"] + span::before {
  z-index: 0;
  background-color: rgba(0,0,0,.1);
  width: 12px;
  height: 12px;
  margin: 2px 0 0 56px;
}
.search_wp .check_in label input[type="checkbox"] + span::after {
  z-index: 1;
  margin: 2px 59px;
  width: 6px;
  height: 9px;
}
.search_wp .check_in label input[type="checkbox"]:checked + span::before {
  background-color: rgba(0,0,0,.1);
}
.search_wp .check_in label input[type="checkbox"]:checked + span::after {
  border: 2px solid #83b136;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.search_wp .check_in span img{ vertical-align: middle;}
.search_wp .search_btn input{
	background:none;
	cursor: pointer;
	-webkit-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
.search_wp .search_btn input:hover{ opacity: 0.6;}

.check_in{ width:330px; margin-right:20px;}
.check_in h4{ width: 113px; margin-right:10px;}
.guests { width: 250px;}
.guests h4{ width: 110px; margin-right:10px;}
.type { width: 292px; margin-right:20px;}
.type h4{ width: 152px; margin-right:10px;}
.type select,.guests select{ width: 130px;}
.price{ width:493px; margin-right:20px;}
.price h4 { width: 90px; margin-right:10px;}
.price span{ font-size:12px;}
.price .text{ margin: 0 6px;}
.price select{ width:180px;}
.search_btn{ float:left; }