@charset "utf-8";

/* =============================================================================
   基本設定
   ========================================================================== */

*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
::selection {
	background: #921d3c; /* Safari用 */
	color: #fff;
}
::-moz-selection {
	background: #921d3c; /* Firefox用 */
	color: #fff;
}

html {
	overflow-y: scroll;
	font-size: 62.5%;
}

body {
	line-height: 1.6;
	font-size: 1.4rem;
	font-family: '-apple-system', 'BlinkMacSystemFont','Hiragino Sans','Hiragino Kaku Gothic ProN',"segoe ui",'游ゴシック  Medium','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	color:#503f27;
	word-break: break-all;
	background-color: #fff;
	vertical-align: baseline;
}
#wrapper {
	overflow: hidden;
}
h1,h2,h3,h4,p,dl,menu,ol,ul,dd {
    margin: 0 0 0 0;
    padding: 0;
    font-weight: normal;
}
table {border-collapse: collapse;}

img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
em,strong,address {
	font-style: normal;
}
li {
	list-style: none;
}
a {
	display: block;
	text-decoration: none;
	outline: none !important;
}
a:link {
	color:#503f27;
}
a:visited {
	color:#503f27;
}
a:hover {
	color:#503f27;
	text-decoration: none;
	filter: alpha(opacity=70);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=70)";  /* ie 8 */
	-moz-opacity:0.7;                  /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7;              /* Safari 1.x */
	opacity:0.7;
	zoom:1;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
a:active {
	color:#503f27;
}

/* =============================================================================
   基本設定
   ========================================================================== */
@media screen and (min-width: 768px) {
	.wrap {
		width: 1100px;
		margin: 0 auto;
		padding: 0 30px;
	}
	section {
		padding: 60px 0;
	}
	.beige {
		background: url(images/global/bgBeige.jpg) repeat 0 0;
	}
	h2,
	.ttl1 {
		padding-bottom: 60px;
		text-align: center;
	}
	.ttl1 {
		background: url(images/top/bgLinks.png) no-repeat 50% 0;
	}

	h2 span,
	.ttl1 span {
		position: relative;
		padding: 60px 80px 20px 80px;
		display: inline-block;
		font-size: 24px;
		letter-spacing: 1em;
		text-indent:1em;
		background: url(images/global/bgTtlTriangle.png) repeat-x 0 100%;
	}
	h2 span:before,
	.ttl1 span:before {
		width: 138px;
		height: 50px;
		content: "";
		display: block;
		background: url(images/global/bgTtltop.png) no-repeat 0 0;
		background-size: contain;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translate3d(-50%, 0, 0);
			-webkit-transform: translate(-50%, -0); /* Safari用 */
			transform: translate(-50%, 0);
	}
	p.btn {
		text-align: center;
	}
	p.btn a {
		padding: 10px 200px;
		display: inline-block;
		border: 1px solid #a49f9f;
		position: relative;
	}

	p.btn a:after {
		content: '';
		width: 6px;
		height: 6px;
		border: 0px;
		border-top: solid 1px #503f27;
		border-right: solid 1px #503f27;
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		position: absolute;
		top: 50%;
		right: 20px;
		margin-top: -4px;
	}


	/* =====  スライダー 共通 ===== */
	.bx-wrapper .bx-viewport {
		box-shadow: none;
	}
	.bx-wrapper .bx-viewport {
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
		border:none;
		left: 0px;
		background-color:transparent;
	}
}

@media screen and (max-width: 767px) {
	.wrap {
		padding: 40px 20px;
		position: relative;
	}
	.beige {
		background: url(images/global/bgBeige.jpg) repeat 0 0;
	}
	h2,
	.ttl1 {
		margin-bottom: 20px;
		text-align: center;
	}
	h2 span,
	.ttl1 span {
		position: relative;
		padding: 40px 0 20px 0;
		display: block;
		font-size: 18px;
		letter-spacing: 0.4em;
		text-indent:0.4em;
		background: url(images/global/bgTtlTriangle.png) repeat-x 0 100%;
	}
	h2 span:before,
	.ttl1 span:before {
		width: 69px;
		height: 25px;
		content: "";
		display: block;
		background: url(images/global/bgTtltop.png) no-repeat 0 0;
		background-size: contain;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translate3d(-50%, 0, 0);
			-webkit-transform: translate(-50%, -0); /* Safari用 */
			transform: translate(-50%, 0);
	}
	p.btn {
		text-align: center;
	}
	p.btn a {
		padding: 5px;
		display: block;
		border: 1px solid #a49f9f;
		position: relative;
	}
	p.btn a:after {
		content: '';
		width: 6px;
		height: 6px;
		border: 0px;
		border-top: solid 1px #503f27;
		border-right: solid 1px #503f27;
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		position: absolute;
		top: 50%;
		right: 20px;
		margin-top: -4px;
	}

	/* =====  スライダー 共通 ===== */
	.bx-wrapper .bx-viewport {
		box-shadow: none;
	}
	.bx-wrapper .bx-viewport {
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
		border:none;
		left: 0px;
		background-color:transparent;
	}
	.bx-wrapper .bx-controls-direction a {
		z-index: 0;
	}
}


/* =============================================================================
   header
   ========================================================================== */
@media screen and (min-width: 768px) {
	header {
		border-top: 10px solid #c1b695;
		background: url(images/global/bgBeige.jpg) repeat 0 0;
	}
	header > div {
		background: url(images/global/bgHeader.png) no-repeat 50% 0;
	}
	header .inner {
		width: 1100px;
		margin: 0 auto;
		padding: 0 30px;
		position: relative;
	}

	/* gNavi  header */
	#top-head {
	    top: -100px;
	    position: absolute;
	    width: 100%;
	    margin: 100px auto 0;
	    line-height: 1;
	    z-index: 999;
	}
	#top-head .logo {
		padding: 30px 0;
		text-align: center;
	}
	#subMenu {
		text-align: right;
		position: absolute;
		top: 20px;
		right: 30px;
	}
	#subMenu .language {
		margin-bottom: 30px;
	}
	#subMenu .language li {
		display: inline-block;
	}
	#subMenu .language a {
		font-size: 12px;
		line-height: 1;
		padding: 0 15px;
		color: #80715c;
		border-right: 1px solid #80715c;
		/*display: none;*/
	}
	/*#subMenu .language li:nth-of-type(3),*/
	#subMenu .language li:nth-of-type(4) {
		display: none;
	}
	#subMenu .language li:first-of-type a {
		border-left: 1px solid #80715c;
	}
	#subMenu .gSearch {
	}
	#subMenu .gSearch input[type="text"] {
		width: 200px;
		padding:4px;
		border: 1px solid #80715c;
		background-color: transparent;
		border-radius: 5px;
		display: inline-block;
	}	#subMenu .gSearch input::placeholder {
		color: #80715c;
	}
	#subMenu .gSearch p {
		display: inline-block;
	}
	#subMenu .gSearch #search_btn {
		padding: 5px 10px;
		display: inline-block;
		color: #fff;
		background-color: #80715c;
		border-radius: 5px;
		border: none;
	}
	#global-nav {
		background: url(images/global/bgBeige.jpg) repeat 0 0;
	}
	#global-nav ul {
		width: 1040px;
		margin: 0 auto;
		padding: 20px 0;
		line-height: 0;
		font-size: 0;
		text-align: center;
		vertical-align: bottom;
	}
	#global-nav ul li {
		display: inline-block;
		border-right: 1px dotted #80715c;
	}
	#global-nav ul li.sp {
		display: none;
	}
	#global-nav ul li:first-of-type {
		border-left: 1px dotted #80715c;
	}
	#global-nav ul li a {
		width: 125px;
		height: 70px;
		display: block;
	}
	#global-nav ul li:nth-child(1n) a {
		background: url(images/global/iconNaviIntro.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(2n) a {
		background: url(images/global/iconNaviSpot.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(3n) a {
		background: url(images/global/iconNaviEvent.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(4n) a {
		background: url(images/global/iconNaviGourmet.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(5n) a {
		background: url(images/global/iconNaviSouvenir.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(6n) a {
		background: url(images/global/iconNaviStay.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(7n) a {
		background: url(images/global/iconNaviHistory.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(8n) a {
		background: url(images/global/iconNaviAccess.png) no-repeat 50% 50%;
	}

	#global-nav ul li a:hover {
		filter: alpha(opacity=100);        /* ie lt 8 */
		-ms-filter: "alpha(opacity=100)";  /* ie 8 */
		-moz-opacity:1;                  /* FF lt 1.5, Netscape */
		-khtml-opacity: 1;              /* Safari 1.x */
		opacity:1;
		zoom:1;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		-o-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;
	}

	#global-nav ul li:nth-child(1n) a:hover,
	#global-nav ul li.intro_on a {
		background: #9dc138 url(images/global/iconNaviIntro_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(2n) a:hover,
	#global-nav ul li.spot_on a {
		background: #e6b43e url(images/global/iconNaviSpot_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(3n) a:hover,
	#global-nav ul li.event_on a {
		background: #f0dd35 url(images/global/iconNaviEvent_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(4n) a:hover,
	#global-nav ul li.gourmet_on a {
		background: #7e9bbf url(images/global/iconNaviGourmet_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(5n) a:hover,
	#global-nav ul li.souvenir_on a {
		background: #9c599a url(images/global/iconNaviSouvenir_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(6n) a:hover,
	#global-nav ul li.stay_on a {
		background: #cf6b80 url(images/global/iconNaviStay_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(7n) a:hover,
	#global-nav ul li.history_on a {
		background: #65873b url(images/global/iconNaviHistory_on.png) no-repeat 50% 50%;
	}
	#global-nav ul li:nth-child(8n) a:hover,
	#global-nav ul li.access_on a {
		background: #ac3c28 url(images/global/iconNaviAccess_on.png) no-repeat 50% 50%;
	}
	/* Toggle Button */
	#nav-toggle {
	    display: none;
	}
	#top-head {
		margin: 0;
		position: static;
		top: 0;
	}
	#top-head .sp {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	header .inner .nav1 li img {
		display: none;
	}
	header {
		border-top: 5px solid #c1b695;
		background: url(images/global/bgBeige.jpg) repeat 0 0;
	}
	header .inner {
		padding: 0 20px;
		position: relative;
	}
	header .logo {
		margin-right: 5rem;
		text-align: center;
	}
	header .logo img {
		width: auto;
		height: 50px;
		padding: 10px 0;
	}

	#top-head,
	.inner {
	    width: 100%;
	    padding: 0;
		margin: 0;
		position: static;
		top: 0;
	}
	#subMenu {
		display: none;
	}
	#top-head #global-nav {
		display: none;
	}
	.drawer-menu {
		padding-bottom: 100px;
	}
	.drawer-toggle.drawer-hamburger {
		background-color: #c1b695;
	}
	.drawer-hamburger {
		width: 3rem;
		padding: 15px .75rem 30px;
	}
	.drawer-hamburger .txt {
		position: absolute;
		right: 7px;
		bottom: 8px;
		font-size:10px;
		font-weight: bold;
	}
	.drawer--top .drawer-hamburger, .drawer--top.drawer-open .drawer-hamburger {
		right: 20px;
	}
	.drawer-nav {
		overflow: scroll;
		padding-top: 50px;
	}
	.drawer-nav,
	.drawer-dropdown-menu {
		background: url(images/global/bgBeige.jpg) repeat 0 0;
	}
	#top-head a, #top-head {
		color: #503f27;
	}
	.drawer-menu-item,
	.drawer-dropdown-menu-item {
		padding: 20px 20px;
		border-bottom: 1px dotted #c1b695;
		position: relative;
		font-size: 14px;
	}
	li:first-child .drawer-menu-item {
		border-top: 1px dotted #c1b695;
	}
	.drawer-menu-item:after,
	.drawer-dropdown-menu-item:after {
		content: "＞";
		width: 1em;
		height: 1em;
		color: #503f27;
		font-weight: bold;
		position: absolute;
		top: 40%;
		right: 20px;
		transform: translate3d(0, -50%, 0);
		-webkit-transform: translate(0, -50%); /* Safari用 */
		transform: translate(0, -50%);
	}
	.drawer-dropdown .drawer-menu-item:after {
		display: none;
	}
	.drawer-dropdown-menu-item {
		padding: 20px 20px 20px 40px;
		line-height: 1;
	}

}


/* =============================================================================
   Footer
   ========================================================================== */
@media screen and (min-width: 768px) {
	footer {
		background: #fff url(images/global/bgFoot.jpg) repeat 0 0;
	}
	footer > div {
		position: relative;
		background: url(images/global/bgFooter.png) no-repeat 80% 0;
	}
	footer > div:before {
		width: 100%;
		height: 8px;
		content: "";
		display: block;
		background: url(images/global/bgTtlTriangle.png) repeat-x 50% 0;
		position: absolute;
		top: 10px;
		left: 0;
	}
	footer > div > div.wrap {
		padding: 60px 30px 60px 30px;
	}
	footer address {
		width: 380px;
		margin-bottom: 30px;
		float: left;
	}
	footer address p {
		line-height: 2;
	}
	footer h1 {
		margin-bottom: 10px;
		font-size: 24px;
		
		font-weight: bold;
		line-height: 1;
	}
	footer ul.sns {
		width: 190px;
		margin-bottom: 30px;
		float: left;
	}
	footer ul.sns li {
		margin-bottom: 15px;
	}
	footer ul.sns li a {
		font-size: 14px;
	}
	footer ul.sns li i {
		margin-right: 10px;
		font-size: 24px;
	}
	footer ul.nav {
		width: 200px;
		margin-bottom: 30px;
		float: left;
	}
	footer ul.nav li {
		margin-bottom: 15px;
	}
	footer ul.nav li i {
		margin-right: 10px;
	}
	footer ul.link {
		clear: both;
	}
	footer ul.link li {
		width: 235px;
		margin-right: 20px;
		display: inline-block;
	}
	footer .copy {
		padding: 20px 0;
		font-size: 12px;
		text-align: center;
		color: #fff;
		background-color: rgba(146, 29, 60, 0.3);
	}
	#page-top a {
		position: fixed;
		bottom: 20px;
		right: 20px;
		z-index: 30;
	}
	#page-top a:hover {
		opacity: 0.8;
	}
}

@media screen and (max-width: 767px) {
	footer {
		background: #fff url(images/global/bgFoot.jpg) repeat 0 0;
	}
	footer > div {
		position: relative;
		background: url(images/global/bgFooter_sp.png) no-repeat 100% 0;
	}
	footer > div:before {
		width: 100%;
		height: 8px;
		content: "";
		display: block;
		background: url(images/global/bgTtlTriangle.png) repeat-x 50% 0;
		position: absolute;
		top: 10px;
		left: 0;
	}
	footer > div > div.wrap {
		padding: 40px 20px 10px 20px;
	}
	footer address {
		margin-bottom: 10px;
	}
	footer address p {
		line-height: 2;
	}
	footer address p a {
		display: inline-block;
	}
	footer h1 {
		margin-bottom: 10px;
		font-size: 24px;
		letter-spacing: 0.4em;
		font-weight: bold;
		line-height: 1;
	}
	footer ul.sns {
		width: 100%;
		margin-bottom: 10px;
	}
	footer ul.sns li {
		width: 48%;
		display: inline-block;
		margin-bottom: 10px;
	}
	footer ul.sns li a {
		font-size: 14px;
	}
	footer ul.sns li i {
		margin-right: 10px;
		font-size: 24px;
	}
	footer ul.nav {
		display: none;
	}
	footer ul.nav li {
		margin-bottom: 10px;
	}
	footer ul.nav li i {
		margin-right: 10px;
	}
	footer ul.link {
		width: 100%;
	}
	footer ul.link li {
		width: 46%;
		margin: 2% 1%;
		display: inline-block;
	}
	footer .copy {
		padding: 10px 0;
		font-size: 12px;
		text-align: center;
		color: #fff;
		background-color: rgba(146, 29, 60, 0.3);
	}

	#page-top a {
		width: 40px;
		height: 40px;
		display: block;
		text-align: center;
		position: fixed;
		bottom: 10px;
		right: 10px;
		z-index: 30;
		color: #fff;
		line-height: 1.2;
		z-index: 30;
	}
}
/* =============================================================================
	404 Page not Found.
   ========================================================================== */
@media screen and (min-width: 768px) {
	.pageNot h2 {
		padding: 60px 0 0 0;
		text-align: center;
	}
	.pageNot .cont {
		width: 790px;
		margin: 0 auto;
		padding: 40px;
	}
	.pageNot .cont p {
		padding: 0 0 40px 0;
	}
	.pageNot .cont li {
		margin: 0 0 10px 0;
	}
	.pageNot .cont i {
		padding-right: 0.5em;
	}
}

@media screen and (max-width: 767px) {
	.pageNot h2 {
	}
	.pageNot .cont {
	}
	.pageNot .cont p {
		padding: 0 0 20px 0;
	}
	.pageNot .cont li {
		margin: 0 0 10px 0;
	}
	.pageNot .cont i {
		padding-right: 0.5em;
	}
}
/* =============================================================================
	preparation
   ========================================================================== */
@media screen and (min-width: 768px) {
	.preparation h2 {
		padding: 60px 0 0 0;
		text-align: center;
	}
	.preparation .cont {
		width: 790px;
		margin: 0 auto;
		padding: 40px;
	}
	.preparation .cont p {
		padding: 0 0 40px 0;
	}
	.preparation .cont li {
		margin: 0 0 10px 0;
	}
	.preparation .cont i {
		padding-right: 0.5em;
	}
}

@media screen and (max-width: 767px) {
	.preparation h2 {
	}
	.preparation .cont {
	}
	.preparation .cont p {
		padding: 0 0 20px 0;
	}
	.preparation .cont li {
		margin: 0 0 10px 0;
	}
	.preparation .cont i {
		padding-right: 0.5em;
	}
}