@charset "UTF-8";

body {
	width:100%;
	height:100%;
	margin: 0;
	padding:0;
	text-align: center;
	font-size: 15px;
	line-height: 1.6;
	color: #333;
	font-weight: 400;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Osaka,sans-serif;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	background-color:#FFF;
}
html { height:100%;}
h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p {
	padding: 0;
	margin: 0;
	font-weight: normal;
	font-size: inherit;
}
ul { list-style-type: none;}
img { border:0; -ms-interpolation-mode: bicubic; -webkit-backface-visibility: hidden;}
a { -webkit-tap-highlight-color:rgba(0,0,0,0);}
*{ margin :0px; padding: 0px; box-sizing: border-box;}
.fixed { position: fixed; width: 100%; height: 100%;}
.center { text-align:center;}
.clear { clear:both;}
.sp { display:none;}
#wrapper { width:100%; overflow:hidden; min-width:1100px;}
.bg_none { background-image:none;} /* スライダー背景画像非表示 \*/
@media screen and (max-width:750px){
	body {
		width:100%;
		margin:0;
		padding:0;
		color:#000;
		font-size:14px;
		min-width: inherit;
	}
	.sp { display:block;}
	.pc { display:none;}
	#wrapper { min-width: inherit;}
}
@media screen and (min-width: 750px) {
	/*--- 750px以上はtelリンク無効 ---*/
	a[href^="tel:"] {
		pointer-events: none;
	}
}

/*-----------------------------------------------
clearfix
-----------------------------------------------*/
.clearfix:after {
	content:".";
	height:0;
	clear:both;
	display:block;
	visibility:hidden;
}
/* IE */
.clearfix { display:inline-block;}
/* MacIE \*/
* html .clearfix {height: 1em;}
.clearfix {display: block;}

/*-----------------------------------------------
リンク
-----------------------------------------------*/
a:link { color:#333; text-decoration: none;}
a:visited { color:#333; text-decoration: none;}
a:hover { color:#333; text-decoration: none;}

.link_w a:link { color:#fff;}
.link_w a:visited { color:#fff;}
.link_w a:hover { color:#fff;}

.link_red a:link { color:#860302;}
.link_red a:visited { color:#860302;}
.link_red a:hover { color:#860302; text-decoration:underline;}


/*-----------------------------------------------
 font
-----------------------------------------------*/
@font-face {
  font-family: 'Noto Serif Japanese';
  font-style: normal;
  font-weight: 600;
  src:  url('../font/NotoSerifCJKjp-SemiBold.otf') format('opentype'),
		url("../font/NotoSerifCJKjp-SemiBold.woff") format("woff");
}
.font_red { color:#860302;}

/*-----------------------------------------------
ヘッダー
-----------------------------------------------*/
#header {
	position:fixed;
	top:0;
	padding:0;
	clear:both;
	width:100%;
	height:80px;
	background: #FFF;
	text-align:left;
	z-index:100;
	background: rgba(255,255,255,0.85);
	min-width:1200px;
	box-shadow:0 4px 4px rgba(0,0,0,0.2);
}
#header h1 { float:left; padding:8px 30px;}
#header h1 img { width:244px;}
#header #menu { float:right; margin-right:30px;}
#header #menu li {
	margin:28px 9px;
	padding:0 3px 6px;
	float:left;
	color:#333;
	font-family: 'Noto Sans JP';
	font-weight: 500;
	transform: rotate(0.05deg);
	letter-spacing:0.5px;
}
/* safariのみ
_::-webkit-full-page-media, _:future, :root #header #menu li {
	font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
	font-weight:700;
}
*/
#header #menu p.head-plan {
	display: inline-block;
	margin:20px 0 0 15px;
}
#header #menu a:link { color:#333;}
#header #menu a:visited { color:#333;}
#header #menu a:hover { color:#333;}
#header #menu p a:hover { color:#333;}
@media screen and (max-width:1300px){
	#header #menu { margin-right:20px;}
	#header #menu li {margin:30px 9px; font-size:13px;}
}
@media screen and (max-width:750px){
	#header {
		width:100%;
		position:fixed;
		background: rgba(255,255,255,0.7);
		min-width: inherit;
		height:70px;
	}
	#header h1 { width:100%; padding:7px 15px;}
	#header h1 img { width:220px; z-index:100;}
	#header #menu { width:100%; margin-right:0; margin-top:30px; text-align:center;}
	#header #menu li {
		width:70%;
		margin:10px auto;
		padding-bottom:5px;
		float:none;
		display:block;
		font-size:15px;
		letter-spacing:0;
		color:#FFF;
	}
	#header #menu p.head-plan {
		display:none;
		margin:0;
	}
	#header #menu a:link { color:#fff;}
	#header #menu a:visited { color:#fff;}
	#header #menu a:hover { color:#fff;}
	#header #menu p a:hover { color:#fff;}
}

/* ベストレート保証*/
#bestrate {
	position:fixed;
	bottom: 66px;
    right: 10px;
	padding:6px 0 0;
	clear:both;
	width:50%;
    min-width: 180px;
	background: #fff;
	text-align:center;
	z-index:99;
    border-radius: 3px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .5);
}
#bestrate img { width: 90%; height: auto;}

/* 予約ナビゲーション*/
#yoyakunavi {
	position:fixed;
	bottom:0;
	padding:0;
	clear:both;
	width:100%;
	height:64px;
	background: #720000;
	text-align:center;
	z-index:99;
	min-width:1200px;
}
#yoyakunavi li { display:inline-block; font-weight:500;}
#yoyakunavi li.waribiki {
	vertical-align: top;
	margin:10px 7px;
}
#yoyakunavi li.navi_search,
#yoyakunavi li.navi_plan,
#yoyakunavi li.navi_room {
	width:200px;
	height:40px;
	margin:10px 7px;
	font-size:14px;
	font-family: 'Noto Sans JP';
	font-weight: 500;
	transform: rotate(0.05deg);
}
_::-webkit-full-page-media, _:future, :root #yoyakunavi li.navi_search,
#yoyakunavi li.navi_plan,
#yoyakunavi li.navi_room { /* safariのみ*/
	font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
	font-weight:700;
}
#yoyakunavi li.navi_search img,
#yoyakunavi li.navi_plan img,
#yoyakunavi li.navi_room img {
	vertical-align: middle;
	margin: 0 10px 3px 0;
}
#yoyakunavi li.navi_search a,
#yoyakunavi li.navi_plan a,
#yoyakunavi li.navi_room a {
	width:100%;
	height:38px;
	line-height:40px;
}
#yoyakunavi li.navi_search {
	background-color:#9F3538;
	border:1px solid #DCB6B7;
}
#yoyakunavi li.navi_search .hvr-fade:hover,
#yoyakunavi li.navi_search .hvr-fade:focus,
#yoyakunavi li.navi_search .hvr-fade:active {
	background-color:#CC5153;
	color:#FFF;
}
#yoyakunavi li.navi_plan {
	background-color:#805836;
	border:1px solid #BDA997;
}
#yoyakunavi li.navi_plan .hvr-fade:hover,
#yoyakunavi li.navi_plan .hvr-fade:focus,
#yoyakunavi li.navi_plan .hvr-fade:active {
	background-color:#977646;
	color:#FFF;
}
#yoyakunavi li.navi_room {
	background-color:#6A5344;
	border:1px solid #BBB1AA;
}
#yoyakunavi li.navi_room .hvr-fade:hover,
#yoyakunavi li.navi_room .hvr-fade:focus,
#yoyakunavi li.navi_room .hvr-fade:active {
	background-color:#806C5F;
	color:#FFF;
}
#yoyakunavi li.navi_tel {
	vertical-align: top;
	margin:23px 7px;
}

/* ページトップ*/
#yoyakunavi .p-top {
	width:38px;
	height:38px;
	margin:10px 7px;
	border:1px solid #C88C8E;
}
#yoyakunavi .p-top a {
	width:100%;
	height:38px;
	line-height:38px;
}
#yoyakunavi .p-top img {
	vertical-align:middle;
	margin:0 0 5px 0;
	opacity: 0.8;
}
#yoyakunavi .p-top .hvr-fade:hover,
#yoyakunavi .p-top .hvr-fade:focus,
#yoyakunavi .p-top .hvr-fade:active {
	background: rgba(255,255,255,0.2);
}
@media screen and (max-width:750px){
	/* 予約ナビゲーション*/
	#yoyakunavi {
		height:58px;
		min-width: inherit;
	}
	#yoyakunavi ul {
		width:100%;
		margin:0 auto;
	}
	#yoyakunavi li.waribiki { display:none; margin:0;}
	#yoyakunavi li.navi_search,
	#yoyakunavi li.navi_plan,
	#yoyakunavi li.navi_room {
		border:1px solid #ad8a8b;
		text-align:center;
		width:18%;
		height:45px;
		margin:6px 0 0;
		font-size:9px;
		font-weight:bold;
	}
	#yoyakunavi li.navi_search img,
	#yoyakunavi li.navi_plan img,
	#yoyakunavi li.navi_room img,
	#yoyakunavi li.navi_tel img {
		display:block;
		margin: 6px auto;
		height:20px;
		width:auto;
	}
	#yoyakunavi li.navi_tel img {
		height:19px;
	}
	#yoyakunavi li.navi_search a,
	#yoyakunavi li.navi_plan a,
	#yoyakunavi li.navi_room a,
	#yoyakunavi li.navi_tel a,
	#yoyakunavi .p-top a {
		width:100%;
		height:43px;
		line-height:1;
	}
	#yoyakunavi li.navi_tel,
	#yoyakunavi .p-top {
		vertical-align: top;
		border:1px solid #ad8a8b;
		text-align:center;
		width:18%;
		height:45px;
		margin:6px 0 0;
		font-size:10px;
		font-weight:bold;
	}
	#yoyakunavi li.navi_tel .hvr-fade:hover,
	#yoyakunavi li.navi_tel .hvr-fade:focus,
	#yoyakunavi li.navi_tel .hvr-fade:active,
	#yoyakunavi .p-top .hvr-fade:hover,
	#yoyakunavi .p-top .hvr-fade:focus,
	#yoyakunavi .p-top .hvr-fade:active {
		background: rgba(255,255,255,0.2);
		color:#FFF;
	}
	#yoyakunavi .p-top img {
		height:10px;
		opacity: 1;
		margin: 10px auto;
	}
}

/* メニューラインの動き */
.hvr-underline-from-center {
  display: inline-block;
  vertical-align: middle;
  padding:0 3px 3px;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
}
.hvr-underline-from-center:before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  right: 50%;
  bottom: 0;
  background: #DF0012;
  height: 3px;
  -webkit-transition-property: left, right;
  transition-property: left, right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
  left: 0;
  right: 0;
}
@media screen and (max-width:750px){	
	/* メニューラインの動き */
	.hvr-underline-from-center {
	  display: block;
	  z-index:100;
	}
	.hvr-underline-from-center:before { display:none;}
	.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
	  left: 0;
	  right: 0;
	}
	
	/* スマホ用ナビ */
	header {
		display:table;
		width:100%;
		position:fixed;
		z-index:10;
	}
	header:after {content:''}
	header ul li a {color:inherit; display:block}
	header ul li:after {content:''}
	header ul li:last-child {border-bottom:none;margin-bottom:30px;}
	.nav-content {
		width: 100%;
		height: 100%;
		overflow-y: scroll;
	  -webkit-overflow-scrolling:touch; 
	}
	
	/* ハンバーガーメニュー */
	#navToggle {
		display:blok;
		position:absolute;
		right:20px;
		top:22px;
		width:30px;
		height:55px;
		cursor:pointer;
		z-index:100;}
	#navToggle div {position:relative}
	#navToggle span {
		display:block;
		position:absolute;
		width:100%;
		border-bottom:solid 3px #3B2911;
		-webkit-transition: .35s ease-in-out;
		-moz-transition: .35s ease-in-out;
		transition: .35s ease-in-out}
	#navToggle span:nth-child(1) {top:0}
	#navToggle span:nth-child(2) {top:11px}
	#navToggle span:nth-child(3) {top:22px}
	
	/* メニューの動き */
	#navToggle {display:block;}
	.openNav #navToggle span {
		border-bottom:solid 3px #FFF;
	}
	.openNav #navToggle span:nth-child(1) {
		top: 11px;
		-webkit-transform:rotate(-45deg);
		-moz-transform:rotate(-45deg);
		transform:rotate(-45deg);
	}
	.openNav #navToggle span:nth-child(2),
	.openNav #navToggle span:nth-child(3) {
		top: 11px;
		-webkit-transform:rotate(45deg);
		-moz-transform:rotate(45deg);
		transform:rotate(45deg);
	}
	#head-bg {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0px;
		background: #000;
		z-index: -1;
		opacity:0;
		display: none;
		margin-top:0;
		overflow-y: scroll;
		background: rgba(0,0,0,0.8);
	}
}

/*-----------------------------------------------
フッター
-----------------------------------------------*/
footer {
	clear:both;
	width:100%;
	background-color:#570C0B;
	color:#fff;
	margin-top:80px;
	text-align:center;
	font-size:14px;
	padding:0 0 70px 0;
	overflow:hidden;
}
#footer-inner {
	width:1080px;
	margin:0 auto;
	padding:0;
}
.foot_logo img {
	margin:60px 0 40px;
}
.foot_menu {
	float:left;
	text-align:left;
	line-height:2.5;
	transform: rotate(0.05deg);
}
.foot_menu a:hover { text-decoration: underline;}
.foot_sns {
	float:right;
	width:220px;
	text-align:left;
	font-size:15px;
}
.foot_sns li {
	display:inline-block;
	margin:10px 5px 0 0;
}
.foot_sns li:last-child { margin:10px 0 0 0;}
.credit {
	clear:both;
	margin:15px 0 40px;
	font-size:14px;
	color:#B0A79C;
	line-height:1.9;
}
.credit a:link { color:#B0A79C; text-decoration: none;}
.credit a:visited { color:#B0A79C; text-decoration: none;}
.credit a:hover { color:#fff; text-decoration: underline;}
footer .pay { display: inline-block; color: #fff; margin: 30px 0 0; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
footer .pay img { width: 24px; height: auto; margin-right: 10px;}

@media screen and (max-width:750px){
	footer {
		margin-top:30px;
		font-size:13px;
		padding:0 0 110px 0;
	}
	#footer-inner {
		width:90%;
	}
	.foot_logo img {
		width:230px;
		margin:30px 0 15px;
	}
	.foot_menu {
		float:none;
		text-align:center;
		line-height:2;
	}
	.foot_menu a { white-space:nowrap;}
	.foot_menu a:hover { text-decoration: none;}
	.foot_sns {
		float:none;
		width:100%;
		text-align:center;
		font-size:14px;
		margin-top:15px;
	}
	.foot_sns p { font-weight:bold;}
	.foot_sns li {
		margin:5px 5px 0 0;
	}
	.foot_sns li:last-child { margin:5px 0 0 0;}
	.foot_sns li img {
		width:40px;
	}
	.credit {
		margin:15px auto 30px;
		font-size:13px;
		line-height: inherit;
        width: 90%;
	}
	.credit a:hover { color:#fff; text-decoration: none;}
    footer .pay {}
    footer .pay img { width: 30px; margin: 0 0 10px; display: block;}

}

/*-----------------------------------------------
ページ内リンク
-----------------------------------------------*/
a.anchor{
    display: block;
    padding-top: 80px;
    margin-top: -80px;
}
@media screen and (max-width:750px){
a.anchor{
    display: block;
    padding-top: 70px;
    margin-top: -70px;
}
}

/*-----------------------------------------------
共通コンテンツ
-----------------------------------------------*/
#container { padding:70px 0 0;}
#top #container { padding:120px 0 0;}
.bigphoto { display:block; margin:0 auto 20px;}
.page_bage { background-color:#FAF5EF;}
.page_bage2 { background-color:#F5F2EA;}

@media screen and (max-width:750px){
	#container { padding:30px 0 0;}
	#top #container { padding:80px 0 0;}
	.bigphoto { width:100%; margin:0 auto 15px;}
	.bigphoto img { width:100%;}
}

/*-----------------------------------------------
共通タイトル
-----------------------------------------------*/
.font_NS {
	font-family: 'Noto Serif Japanese', serif;
	transform: rotate(0.05deg);
}
.font_Jomo {
	font-family: 'Jomolhari', serif;
	transform: rotate(0.05deg);
}

/*  下層ページ */
#toptitle {
	width:100%;
	height:115px;
	text-align:center;
	clear:both;
	margin:80px 0 0;
	background-image:url(../img/share/title_bg.jpg);
	background-position:left top;
	background-repeat:no-repeat;
	background-size:auto 115px;
}
#toptitle p {
	font-size:24px;
	color:#fff;
	letter-spacing:3px;
	line-height:1;
	padding:33px 0 10px;
}
#toptitle span {
	font-size:18px;
	color:#C2B57E;
	line-height:1;
}
@media screen and (max-width:750px){
	#toptitle {
		height:80px;
		background-size:auto 80px;
		margin:70px 0 0;
	}
	#toptitle p {
		font-size:21px;
		letter-spacing:2px;
		padding:20px 0 5px;
	}
	#toptitle p img {
		width:160px;
		height:auto;
	}
	#toptitle span {
		font-size:15px;
	}
}

.content_title {
	clear:both;
	margin:0 auto 30px;
	background-image:url(../img/share/contitle_bg.png);
	background-position:center top;
	background-repeat:no-repeat;
	background-size:210px auto;
}
.content_title p {
	font-size:43px;
	color:#A25352;
	letter-spacing:3px;
	line-height:1;
	padding:20px 0 5px;
}
.content_title span {
	font-size:18px;
	color:#333;
	line-height:1;
}
.subtitle { font-size:25px; margin-bottom:20px;}
.subcaption { font-size:16px; line-height:1.8;}
@media screen and (max-width:750px){
	.content_title {
		margin:0 auto 10px;
		background-size:150px auto;
	}
	.content_title p {
		font-size:28px;
		letter-spacing:2px;
		padding:15px 0 3px;
	}
	.content_title span {
		font-size:14px;
	}
	.subtitle { font-size:20px; margin-bottom:10px; line-height:1.5;}
	.subcaption {
		display:block;
		font-size:14px;
		line-height: inherit;
		width:90%;
		margin:0 auto;
		text-align:left;
	}
}

/*-----------------------------------------------
共通リンクボタン
-----------------------------------------------*/
/*  arrow */
.arrow{
	position: relative;
	display: inline-block;
	padding-right: 10px;
}
.arrow::after {
	content: '';
	display: block;
	width: 8px;
	height: 8px;
	border-top: solid 2px #231815;
	border-left: solid 2px #231815;
}
.arrow-right::after {
	transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}
.arrow-down::after {
	transform: rotate(225deg);
	-ms-transform: rotate(225deg);
	-webkit-transform: rotate(225deg);
}


/* ラウンドボタン */
.btn_round a {
	width:260px;
	height:52px;
	margin:30px auto 0;
	display:block;
	line-height:52px;
	font-size:15px;
	font-weight:bold;
	text-align:center;
	border-radius: 25px; 
    -webkit-border-radius: 25px;  
    -moz-border-radius: 25px;
	background: rgba(255,255,255,0.9);
	padding-left:30px;
	transform: rotate(0.05deg);
}
.btn_round img {
	padding-top:5px;
	margin:0 10px 0 0;
}
.btn_round .arrow-right::after {
	position: absolute;
	left: 23%;
	top: 50%;
	margin-top: -5px;
}
.btn_round .hvr-fade:hover,
.btn_round .hvr-fade:focus,
.btn_round .hvr-fade:active {
	background: rgba(255,255,255,0.8);
	color:#333;
}
.btn_round .arrow-right:hover::after {
	animation: arrow .4s;
	will-change: transform;
}
@keyframes arrow {
	50% { left: 25%;}
	100% { left: 23%;}
}
@media screen and (max-width:750px){
	.btn_round a { 	width:230px; font-size:14px; margin:15px auto 10px;}
	.btn_round .arrow-right:hover::after { animation: none;}
}


/* スクエアボタン */
.btn_sq {
	clear:both;
	width:100%;
	margin:10px auto 0;
}
.btn_sq a {
	height:50px;
	display:block;
	line-height:48px;
	font-size:15px;
	font-weight:bold;
	text-align:center;
	border-radius: 5px; 
    -webkit-border-radius: 5px;  
    -moz-border-radius: 5px;
	background: #fff;
	padding-left:20px;
	border:2px solid #999;
	transform: rotate(0.05deg);
}
.btn_sq .arrow-right::after {
	position: absolute;
	left: 30%;
	top: 50%;
	margin-top: -5px;
}
.btn_sq .arrow-right:hover::after {
	animation: arrow2 .4s;
	will-change: transform;
}
@keyframes arrow2 {
	50% { left: 32%;}
	100% { left: 30%;}
}
.btn_sq a:hover { text-decoration:none;}
@media screen and (max-width:750px){
	.btn_sq a { font-size:15px;}
	.btn_sq .arrow-right:hover::after { animation: none;}
}

/* スクエアボタン2 */
.btn_sq2 {
	clear:both;
	width:325px;
	margin:10px auto 0;
}
.btn_sq2 a {
	height:50px;
	display:block;
	line-height:48px;
	font-weight:bold;
	text-align:center;
	border-radius: 5px; 
    -webkit-border-radius: 5px;  
    -moz-border-radius: 5px;
	background: #fff;
	padding-left:20px;
	border:2px solid #999;
	transform: rotate(0.05deg);
}
.btn_sq2 .arrow-right::after {
	position: absolute;
	left: 18%;
	top: 50%;
	margin-top: -5px;
}
.btn_sq2 a:hover { color: #666;}
@media screen and (max-width:750px){
	.btn_sq2 {
		width:100%;
		margin:5px auto 0;
	}
	.btn_sq2 .arrow-right::after {
		left: 15%;
	}
}


/* MORE */
.btn_more { clear:both;}
.btn_more a {
	width:168px;
	height:50px;
	margin:0 auto;
	display:block;
	line-height:50px;
	font-size:15px;
	font-weight:bold;
	text-align:center;
	border-radius: 25px; 
    -webkit-border-radius: 25px;  
    -moz-border-radius: 25px;
	background: rgba(255,255,255,0.9);
	padding-left:30px;
	border:2px solid #999;
	letter-spacing:2px;
	transform: rotate(0.05deg);
}
.btn_more .arrow-right::after {
	position: absolute;
	left: 23%;
	top: 50%;
	margin-top: -5px;
}
.btn_more .hvr-fade:hover,
.btn_more .hvr-fade:focus,
.btn_more .hvr-fade:active {
	background:#FFF;
	color:#333;
}
.btn_more .arrow-right:hover::after {
	animation: arrow3 .4s;
	will-change: transform;
}
@keyframes arrow3 {
	50% { left: 25%;}
	100% { left: 23%;}
}
@media screen and (max-width:750px){
	.btn_more a { font-size:14px; margin:15px auto 10px;}
	.btn_more .arrow-right:hover::after { animation: none;}
}

/*-----------------------------------------------
 ページネーション
-----------------------------------------------
.pagenation {
	clear:both;
	margin:50px auto;
	font-size:20px;
	letter-spacing:3px;
	color:#898989;
}
.pagenation li {
	display:inline-block;
	padding:0 10px;
	transform: rotate(0.05deg);
}
@media screen and (max-width:750px){
.pagenation {
	margin:20px auto;
	font-size:19px;
}
}
*/
/*-----------------------------------------------
 アニメーション
-----------------------------------------------*/
/* 移動＋フェードイン*/ 
.fadein{
  animation-name:fadeIn;
  animation-duration:1s;
  animation-timing-function: ease;
  animation-delay:0s;
  -webkit-animation: fadeIn 1s ease 0s;
}
@keyframes fadeIn {
  0% {opacity: 0; transform: translateY(20px);}
  100% {opacity: 1; transform: translateY(0);}
}

/* TOPのみ jsで実装*/
.fade-mv{
	clear:both;
	opacity: 0;
	transition: 1s;
	transition-timing-function:ease-out;
	transform: translate(0,30px); 
	-webkit-transform: translate(0,30px); 
}
.mv{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/* 画像ホバーエフェクト*/
.linkimg img {
	cursor: pointer;
	transition-duration: 0.3s;
}
.linkimg:hover img {
	opacity: 0.7;
	transition-duration: 0.3s;
}
img.linkimg {
	cursor: pointer;
	transition-duration: 0.3s;
}
img.linkimg:hover {
	opacity: 0.7;
	transition-duration: 0.3s;
}

/*-----------------------------------------------
 モーダルウィンドウ
-----------------------------------------------*/
.modal{
    display: none;
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
	z-index:100;
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100%;
    position: absolute;
    width: 100%;
}
.modal__content{
    background: #fff;
    padding: 5px 15px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
	border-radius: 10px; 
    -webkit-border-radius: 10px;  
    -moz-border-radius: 10px;
}
.modal__content p {
	width:80%;
	margin:0 auto;
	text-align:center;
	font-size:24px;
	letter-spacing:2px;
	padding-bottom:10px;
	border-bottom:1px solid #85792E;
	transform: rotate(0.05deg);
}
.modal__content p img {
	margin-right:10px;
	padding-bottom:5px;
	vertical-align: middle;
}
.js-modal-close {
	display:block;
	font-size:40px;
	color:#727171;
	line-height:1;
	font-weight:bold;
	text-align:right;
}
.modal_main {
	width:450px;
	margin:30px auto 0;
	text-align:left;
}
.modal_mg { padding-top:20px;}
.modal_main img {
	vertical-align: middle;
	margin-left:20px;
	padding-bottom:3px;
	cursor:pointer;
}
.js-modal-close:hover,
.js-modal-close:focus,
.js-modal-close:active { color:#727171;}
.modal__content .year,
.modal__content .month,
.modal__content .day { display:none;}

/* フォームデザイン*/ 
.modal__content input#submit_button {
	width:325px;
	height:50px;
	font-size:15px;
	font-weight:bold;
	line-height:49px;
	text-align:center;
	color:#FFF;
	background-color:#B26766;
	border-style: none;
	border-radius: 5px; 
    -webkit-border-radius: 5px;  
    -moz-border-radius: 5px;
	text-align:center;
	margin-top:15px;
	margin-bottom:50px;
	transform: rotate(0.05deg);
	cursor:pointer;
}
.modal__content input#submit_button:hover {
	opacity: 0.8;
}
.modal__content input[type='submit'] {
	-webkit-appearance: none;
	border-radius: 0;
}
.modal__content input[type='text']{
	width: 200px;
	padding: 3px;
	border-radius: 3px;
	border: 1px solid #ccc;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	font-size:15px;
	outline: 0;
}
.select-wrap {
	position: relative;
	max-width: 60px;
	display:inline-block;
}
.select-wrap:before {
	position: absolute;
	right: 8px;
	top: 37%;
	content: '';
	width: 13px;
	height: 13px;
	background: url(../img/share/select_arrow.png) no-repeat;
	background-size:13px;
	pointer-events: none;
}
.select-wrap select{
	width: 60px;
	outline:none;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	height: 25px;
	padding: 3px 10px;
	border:none;
	background-color: #F0F0F0;
	border-radius: 3px;
}
.select-wrap select::-ms-expand { display: none;}
.select-wrap-plan {
	position: relative;
	max-width: 350px;
	display:inline-block;
}
.select-wrap-plan:before {
	position: absolute;
	right: 0;
	top: 0;
	content: '';
	width: 25px;
	height: 25px;
	background: url(../img/share/select_arrow.png) no-repeat center ;
	background-size:13px;
	pointer-events: none;
	background-color: #F0F0F0;
}
.select-wrap-plan select{
	width: 350px;
	outline:none;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	height: 25px;
	padding: 3px 10px;
	border:none;
	background-color: #F0F0F0;
	border-radius: 3px;
}
.select-wrap-plan select::-ms-expand { display: none;}
.modal__content select { font-size:13px;}
@media screen and (max-width:750px){
	.modal__content{
		padding: 5px 15px;
		width: 90%;
		border-radius: 10px; 
		-webkit-border-radius: 10px;  
		-moz-border-radius: 10px;
	}
	.modal__content p {
		width:100%;
		font-size:19px;
		letter-spacing:1px;
		padding-bottom:8px;
	}
	.modal__content p img {
		margin-right:10px;
		padding-bottom:5px;
		width:20px;
	}
	.js-modal-close {
		font-size:35px;
		font-weight:normal;
	}
	.modal_main {
		width:90%;
		margin:20px auto 0;
		font-size:13px;
	}
	.modal_main img {
		margin-left:0;
	}
	.modal_mg { padding-top:10px;}
	/* フォームデザイン*/ 
	.modal__content input#submit_button {
		width:90%;
		margin-top:10px;
		margin-bottom:30px;
	}
	.modal__content input[type='text']{
		width: 120px;
		font-size:16px;
		transform: scale(0.9);
	}
	.select-wrap {
		position: relative;
		max-width: 60px;
		font-size:16px;
		transform: scale(0.9);
		height: 30px;
	}
	.select-wrap-plan {
		width:100%;
		max-width: 100%;
		font-size:16px;
	}
	.select-wrap-plan:before {
		width: 30px;
		height: 30px;
	}
	.select-wrap-plan select{
		width:100%;
		height: 30px;
	}
	.modal__content select {
		font-size:16px;
	}
}

/*-----------------------------------------------
 マージン
-----------------------------------------------*/
.mgtop05 { margin-top:5px;}
.mgtop10 { margin-top:10px;}
.mgtop30 { margin-top:30px;}
.mgbtm10 { margin-bottom:10px;}
.mgbtm20 { margin-bottom:20px;}

@media screen and (max-width:320px){
	.modal__content{
		top: 5%;
		left: 5%;
		transform: scale(0.7);
	}
}

/*-----------------------------------------------
 GoToTravelバナー
-----------------------------------------------*/
#gototravel { width: 90%; margin: 0 auto 3em;}
#gototravel img { width: 100%; max-width: 564px; height: auto; border: 2px solid #000;}
#plan #gototravel { margin: 2.5em auto 2em;}
@media screen and (max-width:750px){
    #gototravel { width: 90%; margin: 0 auto 2em;}
    #plan #gototravel { margin: 1em auto 2em;}
}

/* 追加バナー */
.banner { margin: 80px auto 0;}
.banner img { border: thin solid #000;}
.banner2 { margin: 25px auto 0;}
.banner3 { margin: 50px auto 30px;}
.banner3 a:link { text-decoration: underline;}
@media screen and (max-width:750px){
    .banner { margin: 40px auto 0;}
    .banner img { max-width: 90%;}
    .banner2 { margin: 15px auto 0;}
    .banner2 img { max-width: 90%;}
    .banner3 { margin: 30px auto 30px;}
    .banner3 img { max-width: 90%;}
}