@charset "utf-8";
/* CSS Document */

html {
	scroll-behavior: smooth;
}

body {
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-weight: 500;
	color: #0b1118;
	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

figure { margin: 0; }

/*--- scroll nav ---*/
/*
.clone-nav {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20;
	width: 100%;
	height: 100px;
	background: #fff;
	box-sizing: border-box;
	transition: .5s;
	opacity: 0;
	z-index: 500;
}
.clone-nav ul {
	margin-left: auto;
}
.is-show {
	opacity: 1!important;
}
.nav {
	opacity: 0;
}
*/



/*================================ loading ================================*/

#loading-box {
	background: rgb(217,222,228);
	background: linear-gradient(0deg, rgba(217,222,228,1) 0%, rgba(231,234,240,1) 49%, rgba(255,255,255,1) 100%);
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 2000;
}
.loader {
  	position: absolute;
  	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
  	perspective: 1000px;
}

.bound { 
	-webkit-animation: bound 1.1s linear 0s 1;
	animation: bound 1.1s linear 0s 1;
}

@-webkit-keyframes bound {
	0%   { transform: scale(0.8,1.4) translate(0%,-100%); opacity: 0; }
	10%  { transform: scale(0.8,1.4) translate(0%,-15%); }
	20%  { transform: scale(1.4,0.6) translate(0%,30%); }
	30%  { transform: scale(0.9,1.1) translate(0%,-10%); }
	40%  { transform: scale(0.95,1.2) translate(0%,-30%); }
	50%  { transform: scale(0.95,1.2) translate(0%,-10%); }
	60%  { transform: scale(1.1,0.9) translate(0%,5%); }
	70%  { transform: scale(1.0,1.0) translate(0%,0%); }
	100% { transform: scale(1.0,1.0) translate(0%,0%); opacity: 1; }
}
@keyframes bound {
	0%   { transform: scale(0.8,1.4) translate(0%,-100%); opacity: 0; }
	10%  { transform: scale(0.8,1.4) translate(0%,-15%); }
	20%  { transform: scale(1.4,0.6) translate(0%,30%); }
	30%  { transform: scale(0.9,1.1) translate(0%,-10%); }
	40%  { transform: scale(0.95,1.2) translate(0%,-30%); }
	50%  { transform: scale(0.95,1.2) translate(0%,-10%); }
	60%  { transform: scale(1.1,0.9) translate(0%,5%); }
	70%  { transform: scale(1.0,1.0) translate(0%,0%); }
	100% { transform: scale(1.0,1.0) translate(0%,0%); opacity: 1; }
}



/*================================ header ================================*/

/* header__logo */

.hd-logo {
	position: absolute;
	top: 30px;
	left: 50px;
	z-index: 1000;
}
.hd-logo h1 {
	margin: 0;
}

/* header__nav */

.hd-nav {
	/*width: 800px;*/
	display: flex;
	align-items: center;
	position: absolute;
	top: 30px;
	right: 30px;
	z-index: 1000;
	overflow: hidden
}

.hd-nav-fade {
	opacity: 0;
	-webkit-animation: example 1s ease 4s 1 forwards;
	animation: example 1s ease 4s 1 forwards;
}
@-webkit-keyframes example {
	100% {
		opacity: 1;
	}
}
@keyframes example {
	100% {
		opacity: 1;
	}
}

.navList {
	width: 100%;
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
}
.navList .navList__item {
	/*width: 20%;*/
	font-size: 1.1em;
	font-weight: 500;
	text-align: center;
}
.navList .navList__item a {
	display: block;
	position: relative;
	padding: 0 1em 1em 1em;
	height: 100%;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	color: #fff;
	text-decoration: none;
	box-sizing: border-box;
	transition: .3s;
}
.navList .navList__item a:hover {
	color: #fff;
}
.navList .navList__item a:after {
	position: absolute;
	bottom: 5px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: #fff;
	transform: scale(0,1);
	transform-origin: left top;
	transition: transform .3s;
}
.navList .navList__item a:hover::after { transform: scale(1,1); }
.navList .navList__item a span { display: block; font-size: 1.1em; line-height: 1.2em; margin-top: 5px; }
.navList .navList__item a p { font-size: .6em; line-height: 1em; margin-bottom: 5px; }

.current {
	color: #fff;
	position: relative;
}
.current a {
	color: #fff!important;
}
.current:after {
	position: absolute;
	bottom: 0px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: #fff;
}

#sp-header {
	display: none;
}

/* share */

.home__share {
    position: absolute;
    top: 40%;
    right: 0;
    width: 90px;
    transform: translate3d(0, -50%, 0);
    display: flex;
    justify-content: center;
	z-index: 100;
}
.home__share .home__share__title {
    text-align: center;
    margin-bottom: 20px;
}
.home__share ul { list-style: none; padding: 0; }
.home__share ul li { margin-top: 10px; }

/* stay contact button */

.stay-contact-button {
	position: fixed;
	right: 0;
	bottom: 13%;
	z-index: 50;
}
.stay-contact-button a {
	display: block;
	position: relative;
	padding: 1.5em 2em 3em 2em;
	writing-mode: vertical-rl;
	font-weight: bold;
	color: #fff;
	text-align: center;
	text-decoration: none;
	background: #38a959;
}
.stay-contact-button a:before {
    content: "";
    position: absolute;
    right: 25px;
    bottom: 10%;
    width: 35px;
    margin-left: -10px;
    margin-top: -1px;
    height: 1px;
    background: #fff;
    z-index: 1;
    transition: .5s;
}
.stay-contact-button a:after {
    content: "";
    position: absolute;
    right: 25px;
    bottom: 10%;
    width: 12px;
    margin-top: -1px;
    margin-left: -2px;
    height: 1px;
    background: #fff;
    z-index: 1;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    transition: .5s;
}


/*global-menu*/
.top_global-navigation { 
    width: 100%; 
    position: fixed;
    top: 0;  
    z-index: 1000; 
    background: #fff; 
    box-shadow: 0px 2px 23px -9px rgb(78 78 78 / 50%);
    transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    transform: translateY(-100%);
	display: flex;
	display: -webkit-flex;
	justify-content: space-between;
} 
.top_global-navigation.hide { transform: translateY(0); }

.top_global-navigation .logo { margin: 10px 0 0 30px; }

ul.global-navigation__menu { /*max-width: 798px;*/ margin: 10px 30px 10px 0; padding: 0; display: flex; display: -webkit-flex; }
ul.global-navigation__menu li {
    list-style: none;
	text-align: center;
    position: relative;
}
ul.global-navigation__menu li a {
	display: block;
    position: relative;
    padding: 1em;
    height: 100%;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #222;
    text-decoration: none;
    box-sizing: border-box;
    transition: .3s;
}
ul.global-navigation__menu li a:after {
	position: absolute;
	bottom: 5px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: #222;
	transform: scale(0,1);
	transform-origin: left top;
	transition: transform .3s;
}
ul.global-navigation__menu li a:hover::after { transform: scale(1,1); }
ul.global-navigation__menu li a p {
    font-size: .6em;
    line-height: 1em;
    margin-bottom: 5px;
}
ul.global-navigation__menu li a span {
    display: block;
    font-size: 1.1em;
    line-height: 1.2em;
    margin-top: 5px;
}



/*================================ slider ================================*/

.slideshow {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100vh;
	z-index: 1;
}

/*
.slideshow::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 24px;
	background: url("../img/common/slide_under.png") repeat-x;
	background-position: 0 0;
	-webkit-animation: bgroop 20s linear infinite;
    animation: bgroop 20s linear infinite;
	z-index: 100;
}
@-webkit-keyframes bgroop {
    from { background-position: 0  0; }
    to { background-position: -1956px 0; }
}
@keyframes bgroop {
    from { background-position: 0 0; }
    to { background-position: -1956px 0; }
}
*/

.slideshow .slideshow-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.slideshow .slides {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.slideshow .slide {
	display: none;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	opacity: 0;
	transition: opacity 0.3s ease;
}
.slideshow .slide.is-active {
	display: block;
}
.slideshow .slide.is-loaded {
	opacity: 1;
}
.slideshow .slide .caption {
	position: absolute;
    right: 5%;
    bottom: 7%;
	text-align: right;
	box-sizing: border-box;
}
.slideshow .slide .image-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center;
	z-index: 1;
	background-size: cover;
	image-rendering: optimizeQuality;
}
.slideshow .slide .image-container::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.2);
}
.slideshow .slide .image {
	width: 100%;
	object-fit: cover;
	height: 100%;
}
.slideshow .slide-content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	color: #fff;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
.slideshow .slide .caption .title {
	margin: 0 auto;
	max-width: 1000px;
	font-size: 2.5em;
	line-height: 1.5em;
	letter-spacing: 5px;
  	text-transform: uppercase;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	/*background: -webkit-linear-gradient(0deg,#ACB6E5,#86FDE8);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;*/
}
.slideshow .slide .caption .title a{
	position: relative;
	top: 0;
	left: 0;    
    text-decoration: none;
    color:#FFF;
}
.slideshow .slide .caption .title a:hover{
    top:1px;
    left:1px;
    color:#eee;
}
.slideshow .slide .caption .title a:active{
    top:1px;
    left:1px;
    color:#eee;
}
.slideshow .slide .caption .text {
	margin: 0 auto;
	max-width: 1000px;
	font-size: 1.5em;
	letter-spacing: 0.1em;
	line-height: 1.5;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 300;
	font-style: normal;
}
.slideshow .slide .caption span {
	font-size: 1.3em;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
}

.slideshow .slide .btn {
	margin: 15px 0 0;
	border-color: #fff;
}
.slideshow .slide .btn::before {
	background: #fff;
}
.slideshow .pagination {
	position: absolute;
	bottom: 70px;
	left: 0;
	width: 100%;
	height: 12px;
	cursor: default;
	z-index: 2;
	text-align: center;
}
.slideshow .pagination .item {
	display: inline-block;
	padding: 15px 5px;
	position: relative;
	width: 46px;
	height: 32px;
	cursor: pointer;
	text-indent: -999em;
	z-index: 1;
}
.slideshow .pagination .item + .page {
	margin-left: -2px;
}
.slideshow .pagination .item::before {
	content: "";
	display: block;
	position: absolute;
	top: 15px;
	left: 5px;
	width: 36px;
	height: 2px;
	background: rgba(255, 255, 255, 0.5);
	transition: background 0.2s ease;
}
.slideshow .pagination .item::after {
	width: 0;
	background: #fff;
	z-index: 2;
	transition: width 0.2s ease;
}
.slideshow .pagination .item:hover::before, .slideshow .pagination .item.is-active::before {
	background-color: #fff;
}
.slideshow .arrows .arrow {
	margin: -33px 0 0;
	padding: 20px;
	position: absolute;
	top: 50%;
	cursor: pointer;
	z-index: 3;
}
.slideshow .arrows .prev {
	left: 30px;
}
.slideshow .arrows .prev:hover .svg {
	left: -10px;
}
.slideshow .arrows .next {
	right: 30px;
}
.slideshow .arrows .next:hover .svg {
	left: 10px;
}
.slideshow .arrows .svg {
	position: relative;
	left: 0;
	width: 14px;
	height: 26px;
	fill: #fff;
	transition: left 0.2s ease;
}

/* scroll */

.scroll-Block {
    position: absolute;
    bottom: 4rem;
    left: 0;
    z-index: 10;
}
.scroll-Block .Txt {
    display: block;
    font-size: .9em;
	font-weight: bold;
	position: relative;
	bottom: 1.7rem;
	right: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
.scroll-Block .Txt a {
	color: #fff;
	text-decoration: none;
	letter-spacing: .1em;
}
.scroll-Block .Line {
    position: relative;
    margin: 50px 0 0 63px;
    width: 2px;
    height: 60px;
    overflow: hidden;
    z-index: 10;
}
.scroll-Block .Line:after, .scroll-Block .Line:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 2px;
    height: 100%;
}
.scroll-Block .Line:before {
    background: #FFF;
    z-index: 10;
    -webkit-animation: scroll 2s infinite normal;
    animation: scroll 2s infinite normal;
}
.scroll-Block .Line:after {
    background: transparent;
}

@-webkit-keyframes scroll {
	0% {
		-webkit-transform: translate3d(0,-100%,0);
	}
	15% {
		-webkit-transform: translate3d(0,-98%,0);
	}
	85% {
		-webkit-transform: translate3d(0,98%,0);
	}
	100% {
		-webkit-transform: translate3d(0,100%,0);
	}
}



/*================================ footer ================================*/

footer { background: #192636; }
footer .inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	padding: 3.5em 0 2.5em 0;
}

footer .inner .ft-top {
	display: flex;
	align-items: center;
	padding: 0 0 30px 0;
	margin-bottom: 30px;
	border-bottom: 1px #999999 solid;
}
footer .inner .ft-top .ft-logo { margin: 0 30px 0 0; line-height: 0; }
footer .inner .ft-top h2 { margin: 0; font-size: 1.2em; font-weight: 500; color: #fff; }

footer .inner .ft-add {
	list-style: none;
	padding: 0 0 30px 0;
	margin-bottom: 30px;
	border-bottom: 1px #999999 solid;
}
footer .inner .ft-add li {
	position: relative;
	padding: 0 0 5px 25px;
	color: #fff;
}
footer .inner .ft-add li:nth-child(1)::before { content: ""; position: absolute; top: 5px; left: 0; width: 20px; height: 20px; background: url(../img/common/footer_icon01.png) no-repeat; }
footer .inner .ft-add li:nth-child(2)::before { content: ""; position: absolute; top: 5px; left: 0; width: 20px; height: 20px; background: url(../img/common/footer_icon02.png) no-repeat; }
footer .inner .ft-add li:nth-child(3)::before { content: ""; position: absolute; top: 5px; left: 0; width: 20px; height: 20px; background: url(../img/common/footer_icon03.png) no-repeat; }

footer .inner .ft-nav {
	list-style: none;
	padding: 0;
	display: flex;
}
footer .inner .ft-nav li { margin-right: 30px; }
footer .inner .ft-nav li a { color: #fff; text-decoration: none; }

footer .copy {
	padding: 1.5em 0;
	font-size: .8em;
	color: #222;
	text-align: center;
	background: #fff;
}



/*================================ top page ================================*/

/*--- おすすめ情報 ---*/

.top-pickup {
	padding: 80px 0;
	position: relative;
}
.top-pickup::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	background: #ececec;
	z-index: -1;
}
.top-pickup .sec-ttl {
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-bottom: 50px;
	overflow: hidden;
}
.top-pickup .sec-ttl span { display: block; width: 350px; margin: 0 auto; font-size: 1.8em; line-height: 1.5em; position: relative; }
.top-pickup .sec-ttl span:before {
    content: "";
    position: absolute;
    top: 60%;
    right: 100%;
    height: 30px;
    width: 100vw;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
	background: url("../img/common/top_pickup_line.png") repeat-x;
}
.top-pickup .sec-ttl span:after {
    content: "";
    position: absolute;
    top: 60%;
    left: 100%;
    height: 30px;
    width: 100vw;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: url("../img/common/top_pickup_line.png") repeat-x;
}
.top-pickup .sec-ttl small { font-size: .7em; }

.top-pickup .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
}
.top-pickup .ct-inner ul {
	list-style: none;
	padding: 3em;
	display: flex;
	justify-content: space-between;
	background: #fff;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
	z-index: 10;
}
.top-pickup .ct-inner ul li { width: 31%; }
.top-pickup .ct-inner ul li strong {
	display: block;
	font-size: 1.2em;
	margin-bottom: 5px;
}
.top-pickup .ct-inner ul li span:nth-child(1) {
	display: block;
	position: relative;
	width: 80px;
	padding: .2em .5em;
	margin-bottom: -15px;
	color: #fff;
	text-align: center;
	z-index: 10;
}
.top-pickup .ct-inner ul li span:nth-child(2) {
	display: inline-block;
	padding: 0;
	margin-right: 20px;
	color: #666;
}
.top-pickup .ct-inner ul li p {
	padding-left: 20px;
	color: #222;
	border-left: 5px #e5be00 solid;
}
.top-pickup .ct-inner ul li a:nth-child(1) { display: block; text-decoration: none; transition: .3s; }
.top-pickup .ct-inner ul li a:nth-child(1):hover { opacity: .7; }
.top-pickup .ct-inner ul li a:nth-child(2) { color: #999; }
.pk-bg01 { background: #e5be00; }
.pk-bg02 { background: #f44063; }

/*--- ムービー ---*/

.video-wrap { position: relative; height: 600px; overflow: hidden; }
.video-wrap video { display: block; margin: 0 auto; width: 100%; top: -20%; transform: translateY(-20%); }
.video-wrap figure {
	position: absolute;
  	top: 50%;
  	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	margin: auto;
	z-index: 1;
}
.video-wrap .youtube-logo {
	position: absolute;
	bottom: 5%;
  	left: 50%;
	transform: translateX(-50%);
	margin: auto;
	z-index: 1;
}
.video-wrap .video { display: none; }

/*--- お知らせ ---*/

.top-topics {
	padding: 80px 0;
}
.top-topics .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
.top-topics .tabs {
	width: 65%;
	padding: 40px 0;
	border-top: 1px solid #d4d4d4;
}
.top-topics .tabs .sec-ttl {
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    margin: 0 0 30px 0;
	display: flex;
	align-items: center;
}
.top-topics .tabs .sec-ttl span {
    display: inline-block;
    font-size: 1.8em;
    line-height: 1em;
	margin-right: 20px;
	padding-bottom: 10px;
}
.top-topics .tabs .sec-ttl small {
    font-size: .7em;
}
.top-topics .tab_item {
	/*width: calc(100%/3);*/
	width: 33.3%;
	height: 53px;
	border-bottom: 3px solid #111;
	line-height: 53px;
	font-size: 1em;
	text-align: center;
	color: #565656;
	display: block;
	float: left;
	font-weight: bold;
	transition: all 0.2s ease;
}
.top-topics .tab_item:hover {
	opacity: 0.75;
}
input[name="tab_item"] {
	display: none;
}
.top-topics .tab_content {
	display: none;
	padding: 1em 0;
	clear: both;
	overflow: hidden;
}
.top-topics #cate01:checked ~ #cate01_content,
.top-topics #cate02:checked ~ #cate02_content,
.top-topics #cate03:checked ~ #cate03_content {
	display: block;
}
.top-topics .tabs input:checked + .tab_item {
	/*background-color: #319767;*/
	background-color: #111;
	color: #fff;
}
.top-topics .tab_content ul {
	list-style: none;
	padding: 0;
}
.top-topics .tab_content ul li {
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px #ddd solid;
}
.top-topics .tab_content ul li span { display: inline-block; margin-left: 10px; }
.top-topics .tab_content ul li a { display: block; padding-top: 5px; font-weight: 600; color: #222; text-decoration: none; }

.cate-bg-color00 { padding: 0 1em; font-size: .8em; color: #fff; background: #ff4633; border-radius: 30px; }
.cate-bg-color01 { padding: 0 1em; font-size: .8em; color: #fff; background: #319767; border-radius: 30px; }
.cate-bg-color02 { padding: 0 1em; font-size: .8em; color: #fff; background: #19a1a1; border-radius: 30px; }
.cate-bg-color03 { padding: 0 1em; font-size: .8em; color: #fff; background: #fbb200; border-radius: 30px; }

.top-topics .button { width: 400px; margin: 50px auto 0 auto; text-align: center; }
.top-topics .button a {
	display: block;
	padding: 1em 2em;
	font-weight: 600;
	color: #222;
	text-decoration: none;
	border: 1px solid rgba(0,0,0,0.25);
	transition: .3s;
}
.top-topics .button a:hover {
	border: 1px solid rgba(0,0,0,0.8);
}

/*--- その他 ---*/

.top-other {
	width: 30%;
	padding-top: 40px;
	border-top: 1px solid #d4d4d4;
}
.top-other .bnner { margin-bottom: 30px; line-height: 0; }
.top-other .bnner a { transition: .3s; }
.top-other .bnner a:hover { opacity: .7; }

.top-other .contact { width: 100%; height: 195px; }
.top-other .contact a {
	position: relative;
	padding: 3.5em 1em 2em 1em;
	height: 100%;
	font-size: 1.5em;
	font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
	color: #222;
	letter-spacing: .1em;
	text-align: center;
	text-decoration: none;
	background: #fbf548;
	box-sizing: border-box;
	display: -webkit-flex;
 	display: flex;
 	-webkit-align-items: center;
 	align-items: center;
 	-webkit-justify-content: center;
 	justify-content: center;
	flex-wrap: wrap;
	transition: .3s;
}
.top-other .contact a span {
	display: block;
	width: 100%;
	font-size: .5em;
}
.top-other .contact a::before {
	content: "";
	position: absolute;
	top: 30%;
	left: 50%;
  	transform: translateY(-50%) translateX(-50%);
  	-webkit- transform: translateY(-50%) translateX(-50%);
  	margin: auto;
	width: 42px;
	height: 30px;
	background: url("../img/common/contact_icon.png") no-repeat;
}
.top-other .contact a:hover {
	opacity: .6;
}


/*--- その他 ---*/

.top-banner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	margin-bottom: 100px;
}
.top-banner ul {
	display: flex;
	/*justify-content: space-between;*/
	list-style: none;
	padding: 0;
	flex-wrap: wrap;
}
.top-banner ul li {
	width: 23%;
	margin-right: 2.6%;
	margin-bottom: 30px;
}
.top-banner ul li:nth-child(4n) {
	margin-right: 0;
}



/*================================ common ================================*/

.pg-head {
	display: flex;
	align-items: center;
	position: relative;
	padding: 10rem 15rem 12rem 15rem;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-size: 3em;
	font-weight: 700;
	font-style: normal;
	color: #fff;
}
.pg-head::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 60px;
	background: url("../img/common/pghead_under.png") no-repeat;
	background-position: center;
}
.pg-head span {
	display: block;
	padding-top: 10px;
	margin-left: 30px;
	font-size: .4em;
}

.pg-head-pickup {
	font-size: 2.7em;
	line-height: 2em;
	font-family: ten-mincho, serif;
	font-style: normal;
	font-weight: 400;
}

.pg-head-bg01 { background: url("../img/stay/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }
.pg-head-bg02 { background: url("../img/eat/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }
.pg-head-bg03 { background: url("../img/outdoor/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }
.pg-head-bg04 { background: url("../img/watch/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }
.pg-head-bg05 { background: url("../img/know/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }
.pg-head-bg06 { background: url("../img/trouble/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }
.pg-head-bg07 { background: url("../img/pickup/pg_mv_img.jpg") no-repeat; background-size: cover; background-position: center; }

.pg__share {
    position: absolute;
    top: 38%;
    right: 0;
    width: 90px;
    transform: translate3d(0, -50%, 0);
    display: flex;
    justify-content: center;
	z-index: 100;
}
.pg__share .pg__share__title {
    text-align: center;
    margin-bottom: 20px;
}
.pg__share ul { list-style: none; padding: 0; }
.pg__share ul li { margin-top: 10px; }

.contents {
	padding: 80px 0;
	position: relative;
}
.contents .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	position: relative;
}
.contents .ct-inner::after {
	content: "";
    clear: both;
    display: block;
}
.contents .sec-ttl {
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-bottom: 50px;
}
.contents .sec-ttl span {
	display: block;
	margin: 0 auto;
	font-size: 1.8em;
	line-height: 1.5em;
	position: relative;
}
.contents .sec-ttl p { font-size: .8em; }
.contents .sec-ttl br { display: none; }

.pass-area { text-align: center; padding: 30px 0 0 0; }
.pass-area ul {
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
}
.pass-area ul li { display: inline-block; margin: 0 10px; }
.pass-area ul li a { color: #222; text-decoration: none; position: relative; }
.pass-area ul li a::after {
	content: ">";
	position: absolute;
	top: -3px;
	right: -20px;
}
.pass-area ul li a span { padding-bottom: 2px; border-bottom: 1px solid #677176; }



/*================================ spot ================================*/

.contents .spot-ttl {
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-bottom: 30px;
}
.contents .spot-ttl span {
	display: block;
	margin: 0 auto;
	font-size: 1.8em;
	line-height: 1.5em;
	position: relative;
}
.contents .spot-ttl p { font-size: .8em; }

.contents .spot-cate { width: 100%; margin-bottom: 40px; text-align: center; }
.contents .spot-cate div {
	display: inline-block;
	padding: .2em 1em;
	margin: 0 5px;
	color: #38a959;
	border: 1px #38a959 solid;
	border-radius: 50px;
}

.spot-Box { background: #ececec; position: relative; }
.spot-Box .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	padding: 80px 0;
}
.spot-Box .ct-inner .search-Box {
	width: 100%;
	padding: 1em;
	margin-bottom: 50px;
	text-align: center;
	background: #fff;
	border-radius: 6px;
	box-sizing: border-box;
}

.spot-Box .ct-inner .search-Box .search01 { display: inline-block; }
.spot-Box .ct-inner .search-Box .search02 { display: inline-block; }
.spot-Box .ct-inner .search-Box .search03 { display: inline-block; }

.spot-Box .ct-inner .search-Box span:nth-child(1) { margin-right: 10px; font-weight: 600; display: inline-block; }
.spot-Box .ct-inner .search-Box span:nth-child(3) { margin-right: 10px; margin-left: 40px; font-weight: 600; display: inline-block; }
.spot-Box .ct-inner .search-Box select {
	display: inline-block;
	width: 300px;
	padding: 10px;
	border-radius: 5px;
	border: 1px #ccc solid;
	margin-right: 20px;
}

.spot-Box .ct-inner .search-Box .toggle-buttons{display: inline-flex;}
.spot-Box .ct-inner .search-Box .toggle-buttons label { display: flex; position: relative;}
.spot-Box .ct-inner .search-Box .toggle-buttons [type=checkbox] {
    -webkit-appearance: none;
    -moz-appearance: none;
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}
/* appearance: none; for IE11 */
_:-ms-lang(x)::-ms-backdrop, .spot-Box .ct-inner .search-Box .toggle-buttons [type=checkbox] {
	visibility: hidden;
}
.spot-Box .ct-inner .search-Box .toggle-buttons .button {
	z-index: 1;
}
.spot-Box .ct-inner .search-Box .toggle-buttons :not(:first-child) .button {
	border-left: 1px solid #567;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.spot-Box .ct-inner .search-Box .toggle-buttons :not(:last-child) .button {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.spot-Box .ct-inner .search-Box .toggle-buttons :checked + .button {
	background-color: #345;
	color: #fff;
}

.spot-Box .ct-inner .search-Box .toggle-buttons :disabled + .button {
	cursor: not-allowed;
	opacity: .6;
	color: #def;
}
.toggle-buttons .button {
	display: inline-block;
	padding: .3em 1em;
	border-radius: 4px;
	border: 1px solid #567;
	text-align: center;
	color: #000;
	background-color: #fff;
	cursor: pointer;
}

.toggle-buttons .button:hover {
	background-color: #567;
	color: #fff;
}

.toggle-buttons .button:disabled {
	cursor: not-allowed;
	opacity: .6;
	color: #def;
}

.spot-post-list { display: flex; flex-wrap: wrap; }
.spot-post-list .list-item { width: 24%; margin-right: 1.3%; margin-bottom: 60px; background: #fff; }
.spot-post-list .list-item:nth-child(4n) { margin-right: 0; }
.spot-post-list .list-item figure { line-height: 0; }
.spot-post-list .list-item figure img { width: 100%; }
.spot-post-list .list-item figure a { transition: .5s; }
.spot-post-list .list-item figure a:hover { opacity: .7; }

.spot-post-list .list-item .text_wrap { position: relative; padding: 1.5em; height: 270px; overflow:hidden; }
.spot-post-list .list-item .text_wrap strong { font-size: 1.2em; }
.spot-post-list .list-item .text_wrap p { margin: 10px 0; position:relative; height:132px; overflow:hidden; }
.spot-post-list .list-item .text_wrap p a { color: #222; text-decoration: none; }

.spot-post-list .list-item .text_wrap .button {
	width: 84%;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 1.5em;
	margin: auto;
	text-align: center;
}

.spot-post-list .list-item .text_wrap .sns {
	display: flex;
	position: absolute;
	left: 1.5em;
	right: 0;
	bottom: 5.5em;
}
.spot-post-list .list-item .text_wrap .sns figure {
	width: 25px;
	margin-right: 10px;
}

.spot-post-list .list-item .text_wrap .button a {
	display: block;
	position: relative;
	padding: .5em;
	color: #fff;
	text-decoration: none;
	background: #960;
	border: 1px solid rgba(0,0,0,0);
	transition: .3s;
}
.spot-post-list .list-item .text_wrap .button a:hover {
	color: #000;
	background: #fc6;
	border: 1px solid rgba(0,0,0,1);
}
.spot-post-list .list-item .text_wrap .button a::before {
	content: "";
	position: absolute;
	top: 30%;
	left: 25%;
	width: 16px;
	height: 20px;
	background: url("../img/common/spot_map_icon01.png") no-repeat;
	transition: .3s;
}
.spot-post-list .list-item .text_wrap .button a:hover::before {
	content: "";
	position: absolute;
	top: 30%;
	left: 25%;
	width: 16px;
	height: 20px;
	background: url("../img/common/spot_map_icon02.png") no-repeat;
}

.spot-post-list .list-item .bottom-table {
	display: table;
	table-layout: fixed;
	width: 100%;
	border-top: 1px solid #eaeae6;
	box-sizing: border-box;
}
.spot-post-list .list-item .bottom-table .cate-cell {
	display: table-cell;
	vertical-align: middle;
	padding: .5em 1.5em;
}
.spot-post-list .list-item .bottom-table .cate-cell a {
	font-size: .9em;
	color: #777;
}
.spot-post-list .list-item .bottom-table .link-cell {
	display: table-cell;
	width: 50px;
	border-left: 1px solid #eaeae6;
}
.spot-post-list .list-item .bottom-table .link-cell a {
	display: block;
	height: 30px;
	padding: .5em 1.5em;
	position: relative;
	color: #222;
	text-decoration: none;
	overflow: hidden;
}
.spot-post-list .list-item .bottom-table .link-cell a::before,
.spot-post-list .list-item .bottom-table .link-cell a::after {
	content: "\f061";
	position: absolute;
	top: 35%;
	right: 1em;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}
.spot-post-list .list-item .bottom-table .link-cell a::after {
	opacity: 0;
	right: 2.5em;
}
.spot-post-list .list-item .bottom-table .link-cell a:hover::before { animation: arrowbefore .5s; }
.spot-post-list .list-item .bottom-table .link-cell a:hover::after { animation: arrowafter .5s; }

@keyframes arrowbefore {
	100% {
		right: -.5em;
		opacity: 0;
	}
}
@keyframes arrowafter {
	99% {
		right: 1em;
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}



/*================================ spot details ================================*/

.spot-dt-Box { }
.spot-dt-Box .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
}
.spot-dt-Box .ct-inner .main-img {
	width: 100%;
	display: flex;
	justify-content: space-between;
	margin-bottom: 60px;
}
.spot-dt-Box .ct-inner .main-img div:nth-child(1) {
	writing-mode: vertical-rl;
	padding-right: 3%;
	font-size: 2em;
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1em;
	color: #38a959;
}
.spot-dt-Box .ct-inner .main-img div:nth-child(1) span { font-size: .6em; margin-top: 30px; }
.spot-dt-Box .ct-inner .main-img div:nth-child(2) { width: 97%; }
.spot-dt-Box .ct-inner .main-img div:nth-child(2) img { width: 100%; }

.spot-dt-Box .ct-inner .data-Box { line-height: 2em; font-size: 1.1em; }
.spot-dt-Box .ct-inner .data-Box p { margin-bottom: 3rem; }
.spot-dt-Box .ct-inner .data-Box h2 { padding: 30px 0; position: relative; font-size: 1.8em; }
.spot-dt-Box .ct-inner .data-Box h2:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1.5px;
    background-color: #d4d4d4;
}
.spot-dt-Box .ct-inner .data-Box h2:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 15%;
    height: 3px;
    background-color: #38a959;
}
.spot-dt-Box .ct-inner .data-Box h3 { padding-left: 20px; position: relative; font-size: 1.5em; line-height: 1.5; }
.spot-dt-Box .ct-inner .data-Box h3:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}

.spot-dt-Box .ct-inner .add {
	margin-bottom: 3rem;
	padding: 3rem;
	border: #eaeaea solid 1px;
	line-height: 2em;
}
.spot-dt-Box .ct-inner .add ul { list-style: none; margin: 0; padding: 0; }
.spot-dt-Box .ct-inner .add ul li span { font-weight: bold; }

.spot-dt-Box .ct-inner .map { margin-bottom: 3rem; }



/*================================ root ================================*/

.route {}
.route h3 {
	position: relative;
    padding-left: 20px;
    font-size: 1.5em;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    margin-top: 0;
	margin-bottom: 30px;
}
.route h3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}
.route ul { list-style: none; padding: 0; margin-bottom: 50px; }
.route ul li {
	position: relative;
	padding: .3em 0 .3em 8em;
	margin-bottom: 10px;
	font-weight: bold;
}
.route ul li span {
	width: 80px;
	position: absolute;
	top: 0;
	left: 0;
	padding: .3em 1em;
	color: #fff;
	text-align: center;
	background: #222;
	border-radius: 5px;
}
.route .map {
	width: 100%;
        height: 480px;
}



/*================================ access ================================*/

.access {}
.access p { line-height: 2em; }

.access .acc-Box01 { margin-bottom: 60px; }
.access .acc-Box01 .ttl01 {
	position: relative;
	font-size: 2.5em;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-bottom: 30px;
	overflow: hidden;
}
.access .acc-Box01 .ttl01 span { color: #38a959; }
.access .acc-Box01 .ttl01::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 70%;
    height: 2px;
    width: 100vw;
	background: #222;
}
.access .acc-Box01 .ttl01::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 70%;
    height: 2px;
    width: 100vw;
	background: #222;
}
.access .acc-Box01 .txt {
	display: flex;
	justify-content: space-between;
	margin-bottom: 60px;
}
.access .acc-Box01 .txt div { width: 55%; }
.access .acc-Box01 .txt figure { width: 40%; }
.access .acc-Box01 ul {
	list-style: none;
	padding: 0;
	margin-bottom: 60px;
	display: flex;
	justify-content: space-between;
}
.access .acc-Box01 ul li { width: 32%; line-height: 0; }
.access .acc-Box01 ul li img { width: 100%; }

.access .acc-Box02 { margin-bottom: 60px; }
.access .acc-Box02 h2 {
	padding: 20px 0;
	margin: 40px 0;
	position: relative;
	font-size: 1.8em;
}
.access .acc-Box02 h2:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1.5px;
    background-color: #d4d4d4;
}
.access .acc-Box02 h2:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 15%;
    height: 3px;
    background-color: #38a959;
}
.access .acc-Box02 h3 {
	padding-left: 20px;
	position: relative;
	font-size: 1.5em;
	line-height: 1.5;
}
.access .acc-Box02 h3::before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}
.access .acc-Box02 ul {
	padding: 40px;
	background-color: #f0f5f7;
	line-height: 2em;
}

.access .acc-Box03 { }
.access .acc-Box03 h3 {
	padding-left: 20px;
	position: relative;
	font-size: 1.5em;
	line-height: 1.5;
}
.access .acc-Box03 h3::before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}
.access .acc-Box03 ul {
	padding: 40px;
	background-color: #f0f5f7;
	line-height: 2em;
}



/*================================ topics ================================*/

.topics-Box {}
.topics-Box ul {
	list-style: none;
	padding: 0;
}
.topics-Box ul li {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px #ddd solid;
}
.topics-Box ul li span { display: inline-block; margin-left: 10px; }
.topics-Box ul li a { display: block; padding-top: 5px; font-weight: 600; color: #222; text-decoration: none; }

.topics-pg-Box {}
.topics-pg-Box .day {}
.topics-pg-Box .day span { display: inline-block; margin-right: 10px; margin-left: auto; }
.topics-pg-Box .title { font-size: 2em; margin-bottom: 50px; }
.topics-pg-Box .txt-area { line-height: 2em; }
.topics-pg-Box .txt-area p { margin-bottom: 30px; }

.important-Box {}
.important-Box ul {
	list-style: none;
	padding: 0;
}
.important-Box ul li {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px #ddd solid;
}
.important-Box ul li span { display: inline-block; margin-left: 10px; }
.important-Box ul li a { display: block; padding-top: 5px; font-weight: 600; color: #222; text-decoration: none; }

.important-pg-Box {}
.important-pg-Box .day {}
.important-pg-Box .day span { display: inline-block; margin-right: 10px; margin-left: auto; }
.important-pg-Box .title { font-size: 2em; margin-bottom: 50px; }
.important-pg-Box .txt-area { line-height: 2em; }
.important-pg-Box .txt-area p { margin-bottom: 30px; }



/*================================ pickup ================================*/

.pickup-Box {
	width: 100%;
	margin-bottom: 50px;
}
.pickup-Box ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	z-index: 10;
}
.pickup-Box ul li { width: 31%; }
.pickup-Box ul li span {
	display: block;
	position: relative;
	width: 80px;
	padding: .2em .5em;
	margin-bottom: -15px;
	color: #fff;
	text-align: center;
	z-index: 10;
}
.pickup-Box ul li p {
	padding-left: 20px;
	font-weight: 600;
	color: #222;
	border-left: 5px #e5be00 solid;
}
.pickup-Box ul li a:nth-child(1) { display: block; text-decoration: none; transition: .3s; }
.pickup-Box ul li a:nth-child(1):hover { opacity: .7; }
.pickup-Box ul li a:nth-child(2) { color: #999; }

.pickup-pg-Box {}
.pickup-pg-Box .day {}
.pickup-pg-Box .day span { display: inline-block; margin-right: 10px; }
.pickup-pg-Box .day span:nth-child(1) { width: 80px; padding: .2em .5em; color: #fff; text-align: center; }
.pickup-pg-Box .day span:nth-child(2) {}
.pickup-pg-Box .day span:nth-child(3) a { color: #666; }
.pickup-pg-Box .title { font-size: 2.5em; letter-spacing: .1em; margin-bottom: 50px; margin-top: 0; }
.pickup-pg-Box .txt-area { line-height: 2em; }
.pickup-pg-Box .txt-area p { margin-bottom: 30px; }



/*================================ gallery ================================*/

.gallery-Box01 { padding: 3rem 0; margin-bottom: 60px; background: #ececec; }
.gallery-Box01 .ct-inner { width: 90%; max-width: 1300px; margin: 0 auto; }

.gallery-Box02 { margin-bottom: 50px; }
.gallery-Box02 .ct-inner { width: 90%; max-width: 1300px; margin: 0 auto; }
.gallery-Box02 .ct-inner fieldset { padding: 0; border: 0; margin-bottom: 10px; }
.gallery-Box02 .ct-inner fieldset ul { display: flex; list-style: none; padding: 0; margin: 0; }
.gallery-Box02 .ct-inner label { margin: 0 40px 0 10px; }
.gallery-Box02 .ct-inner .search-Box { display: flex; justify-content: space-between; margin-top: 20px; }
.gallery-Box02 .ct-inner .search-Box .button {}
.gallery-Box02 .ct-inner .search-Box .button .btn01 {
	width: 230px;
	padding: .5em .5em .5em 1.5em;
	margin-right: 10px;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	background: #38a959;
	border: 0;
	border-radius: 5px;
	position: relative;
}
.gallery-Box02 .ct-inner .search-Box .button .btn01::before {
	content: "";
	position: absolute;
	top: 27%;
	left: 12%;
	width: 16px;
	height: 16px;
	background: url("../img/gallery/search_icon01.png") no-repeat;
	transition: .3s;
}
.gallery-Box02 .ct-inner .search-Box .button .btn02 {
	width: 230px;
	padding: .5em .5em .5em 1.5em;
	margin-right: 10px;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	background: #222;
	border: 0;
	border-radius: 5px;
	position: relative;
}
.gallery-Box02 .ct-inner .search-Box .button .btn02::before {
	content: "";
	position: absolute;
	top: 27%;
	left: 15%;
	width: 16px;
	height: 16px;
	background: url("../img/gallery/search_icon02.png") no-repeat;
	transition: .3s;
}
.gallery-Box02 .ct-inner .search-Box .search {}
.gallery-Box02 .ct-inner .search-Box .search .sch01 { width: 300px; padding: .9em; margin-right: 10px; }
.gallery-Box02 .ct-inner .search-Box .search .sch02 {
	padding: .5em;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	background: #222;
	border: 0;
	border-radius: 5px;
}

.gallery-Box03 {}
.gallery-Box03 .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
.gallery-Box03 .ct-inner .list-item { width: 24%; margin-right: 1.3%; margin-bottom: 60px; background: #fff; }
.gallery-Box03 .ct-inner .list-item:nth-child(4n) { margin-right: 0; }
.gallery-Box03 .ct-inner .list-item figure { line-height: 0; margin-bottom: 15px; }
.gallery-Box03 .ct-inner .list-item figure img { width: 100%; }
.gallery-Box03 .ct-inner .list-item figure a { transition: .5s; }
.gallery-Box03 .ct-inner .list-item figure a:hover { opacity: .7; }

.gallery-Box03 .ct-inner .list-item .text_wrap { position: relative; }
.gallery-Box03 .ct-inner .list-item .text_wrap strong { display: block; font-size: 1.2em; margin-bottom: 5px; }
.gallery-Box03 .ct-inner .list-item .text_wrap span { display: inline-block; margin-bottom: 20px; padding: 0 .8em; font-size: .9em; background: #ececec; border-radius: 50px; }
.gallery-Box03 .ct-inner .list-item .text_wrap .button {
	width: 70%;
	margin-right: auto;
	text-align: center;
}
.gallery-Box03 .ct-inner .list-item .text_wrap .button a {
	display: block;
	position: relative;
	padding: .5em .5em .5em 1.5em;
	color: #fff;
	text-decoration: none;
	background: #222;
	border: 1px solid rgba(0,0,0,0);
	border-radius: 5px;
	transition: .3s;
}
.gallery-Box03 .ct-inner .list-item .text_wrap .button a:hover {
	color: #222;
	background: #fff;
	border: 1px solid rgba(0,0,0,1);
}
.gallery-Box03 .ct-inner .list-item .text_wrap .button a::before {
	content: "";
	position: absolute;
	top: 25%;
	left: 20%;
	width: 16px;
	height: 16px;
	background: url("../img/gallery/download_icon01.png") no-repeat;
	transition: .3s;
}
.gallery-Box03 .ct-inner .list-item .text_wrap .button a:hover::before {
	content: "";
	position: absolute;
	top: 25%;
	left: 20%;
	width: 16px;
	height: 16px;
	background: url("../img/gallery/download_icon02.png") no-repeat;
}



/*================================ pamphlet ================================*/

.adobe-pdf-Box { padding: 3rem 0; margin-bottom: 60px; background: #ececec; }
.adobe-pdf-Box .ct-inner { width: 90%; max-width: 1300px; margin: 0 auto; }

.pamphlet-Box {}
.pamphlet-Box .ct-inner {
	width: 90%;
	max-width: 1300px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
.pamphlet-Box .ct-inner .list-item { width: 22%; margin-right: 4%; margin-bottom: 60px; background: #fff; }
.pamphlet-Box .ct-inner .list-item:nth-child(4n) { margin-right: 0; }
.pamphlet-Box .ct-inner .list-item figure { line-height: 0; margin-bottom: 15px; }
.pamphlet-Box .ct-inner .list-item figure img { width: 100%; }

.pamphlet-Box .ct-inner .list-item .text_wrap { position: relative; }
.pamphlet-Box .ct-inner .list-item .text_wrap strong { display: block; font-size: 1em; margin-bottom: 8px; }
.pamphlet-Box .ct-inner .list-item .text_wrap span { display: inline-block; margin-bottom: 20px; padding: 0 .8em; font-size: .9em; background: #ececec; border-radius: 50px; }
.pamphlet-Box .ct-inner .list-item .text_wrap .button {
	width: 70%;
	margin-right: auto;
	text-align: center;
}
.pamphlet-Box .ct-inner .list-item .text_wrap .button a {
	display: block;
	position: relative;
	padding: .5em .5em .5em 1.5em;
	color: #fff;
	text-decoration: none;
	background: #222;
	border: 1px solid rgba(0,0,0,0);
	border-radius: 5px;
	transition: .3s;
}
.pamphlet-Box .ct-inner .list-item .text_wrap .button a:hover {
	color: #222;
	background: #fff;
	border: 1px solid rgba(0,0,0,1);
}
.pamphlet-Box .ct-inner .list-item .text_wrap .button a::before {
	content: "";
	position: absolute;
	top: 25%;
	left: 20%;
	width: 16px;
	height: 16px;
	background: url("../img/gallery/download_icon01.png") no-repeat;
	transition: .3s;
}
.pamphlet-Box .ct-inner .list-item .text_wrap .button a:hover::before {
	content: "";
	position: absolute;
	top: 25%;
	left: 20%;
	width: 16px;
	height: 16px;
	background: url("../img/gallery/download_icon02.png") no-repeat;
}



/*================================ about ================================*/

.about {}
.about .kv-wrap {
	display: flex;
	justify-content: space-between;
	height: 585px;
	margin-bottom: 100px;
}
.about .kv-wrap .txt-Box { width: 35%; writing-mode: vertical-rl; }
.about .kv-wrap .txt-Box h2 {
	font-size: 3em;
	font-family: fot-tsukubrdgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
	line-height: 1.5em;
	display: inline-block;
}
.about .kv-wrap .txt-Box p {
	line-height: 2em;
	margin-right: 40px;
	display: inline-block;
}
.about .kv-wrap figure { width: 60%; position: relative; }
.about .kv-wrap figure img { width: 100%; }
.about .kv-wrap figure::after {
	content: "";
	position: absolute;
	bottom: 10%;
	left: -20%;
	width: 200px;
	height: 3px;
	background: #38a959;
	z-index: -1;
}
.about table { width: 100%; line-height: 2em; border-collapse: collapse; }
.about table th { padding: 1.5em 1em; border-bottom: 1px #ccc solid; }
.about table td { padding: 1.5em 1em; border-bottom: 1px #ccc solid; }
.about table td ul { padding-left: 20px; }
.about table td ul li { padding: 5px 0; }



/*================================ member ================================*/

.member {}

.member h2 {
    position: relative;
    font-size: 2.5em;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    text-align: center;
	margin-top: 0;
}

.member table { width: 100%; line-height: 2em; border-collapse: collapse; }
.member table th { padding: .5em 1em; border-bottom: 1px #ccc solid; background-color: #f0f5f7; text-align: left; }
.member table td { padding: .5em 1em; border-bottom: 1px #ccc solid; }
.member table tr td:nth-child(2) { font-weight: bold; }



/*================================ language ================================*/

.language {}

.language h3 {
    position: relative;
	padding-left: 20px;
    font-size: 1.5em;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
	margin-top: 0;
}
.language h3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}

.language ul {
	list-style: none;
	padding: 0;
	display: flex;
	justify-content: space-between;
}
.language ul li {
	position: relative;
	width: 24%;
}
.language ul li a {
	display: block;
	padding: 1.5em 1em;
	color: #fff;
	text-align: center;
	text-decoration: none;
	background: #38a959;
}

.language .lg-txt {
	margin-bottom: 60px;
	line-height: 2em;
}



/*================================ terms ================================*/

.terms {}

.terms h3 {
    position: relative;
	padding-left: 20px;
    font-size: 1.5em;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
	margin-top: 0;
}
.terms h3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}

.terms ul {
	padding-left: 20px;
}
.terms ul li {
	margin-bottom: 20px;
}

.terms .terms-txt {
	margin-bottom: 60px;
	line-height: 2em;
}



/*================================ contact ================================*/

.contact-Box {}
.contact-Box .ct-inner { width: 90%; max-width: 1300px; margin: 0 auto; }

#toi-Box { margin-bottom: 60px; padding: 1em; background: #f0f0f0; text-align: center; }
#toi-Box .toi-conts { width: 60%; margin: auto; }
#toi-Box .toi-conts dt { margin-bottom: 20px; font-size: 1.5em; font-weight: bold; }
#toi-Box .toi-conts dd { margin: 0; margin-bottom: 20px; }
#toi-Box .toi-conts p {
	margin: 0;
	margin-bottom: 15px;
	font-size: 2.5em;
	font-weight: bold;
	color: #222;
}

#toi-Box .toi-conts .button { width: 400px; margin: 0 auto 20px auto; text-align: center; }
#toi-Box .toi-conts .button a {
	display: block;
	padding: .7em 1em;
	font-size: 1.2em;
	color: #fff;
	text-decoration: none;
	background: #38a959;
}

.form-box .step { text-align: center; margin-bottom: 40px; }

.form-box { width: 80%; margin: 0 auto; }
.form-box span { margin-right: 20px; }
.form-box figure { width: 450px; margin: 0 auto 50px auto; }
.form-box p { text-align: center; line-height: 2em; margin-bottom: 50px; }

.form-btn-box {
	width: 450px;
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
}

.form-box .btn-box {
	width: 100%;
	text-align: center;
}

.form-box .btn01 {
	width: 200px;
	padding: .7em 1em;
	background: #38a959;
	border: none!important;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	margin-right: 30px;
	transition: .2s linear;
	-webkit-transition: .2s linear;
}
.form-box .btn02 {
	width: 200px;
	padding: .7em 1em;
	background: #38a959;
	border: none!important;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	transition: .2s linear;
	-webkit-transition: .2s linear;
}
.form-box .btn03 {
	width: 200px;
	padding: .7em 1em;
	background: #222;
	border: none!important;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	margin-right: 30px;
	transition: .2s linear;
	-webkit-transition: .2s linear;
}
.form-box .btn04 {
	width: 200px;
	padding: .7em 1em;
	background: #222;
	border: none!important;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	transition: .2s linear;
	-webkit-transition: .2s linear;
}
.form-box .btn05 {
	width: 200px;
	padding: .7em 1em;
	margin: 0 auto;
	background: #222;
	border: none!important;
	font-size: 1em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #fff;
	transition: .2s linear;
	-webkit-transition: .2s linear;
}
.form-box .btn01:hover, .form-box .btn02:hover,
.form-box .btn03:hover, .form-box .btn04:hover, .form-box .btn05:hover {
    background: #758c9e;
}
.form-box table {
	width: 100%;
	table-layout: fixed;
	margin-bottom: 30px;
}
.form-box th {
	width: 30%;
	border: 0;
    padding: 2em 0;
    text-align: left;
	border-bottom: 1px solid #ddd;
}
.form-box td {
	border: 0;
    padding: 2em 0;
    text-align: left;
	border-bottom: 1px solid #ddd;
}
.form-box tr:first-child th, .form-box tr:first-child td {
	border-top: 1px solid #ddd;
}
.form-box .require {
    padding: 1px 8px;
    color: #fff;
    font-size: .8em;
    font-style: normal;
	font-weight: 300;
    letter-spacing: 1px;
    margin: 0 0 0 10px;
    line-height: 9px;
    border-radius: 3px;
    zoom: normal;
    background: #fbb200;
}
.from-text01 { padding: 10px; border: 1px #ccc solid; border-radius: 5px; }
.from-text02 { padding: 10px; border: 1px #ccc solid; border-radius: 5px; }
.from-text03 { padding: 10px; border: 1px #ccc solid; border-radius: 5px; width: 80%; }
.from-select { padding: 10px; border-radius: 5px; border: 1px #ccc solid; }

.form-box table td span { margin: 0 10px 0 5px; }
.form-box table td p { font-size: .9em; text-align: left; margin-bottom: 0; }



/*================================ page top ================================*/

#page_top {
	width: 110px;
    height: 70px;
    position: fixed;
    right: 0;
    bottom: 0;
    opacity: 0.8;
    text-align: center;
    border-radius: 50%;
}
#page_top a {
	position: relative;
	display: block;
	padding-top: 40px;
	font-size: .8em;
	font-weight: 600;
	color: #222;
	text-decoration: none;
}
#page_top a::before {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f106';
	font-size: 25px;
	color: #758c9e;
	position: absolute;
	width: 25px;
	height: 25px;
	top: -10px;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
}



/*================================ 記事用 CSS ================================*/

.pickup-pg-Box h1 {
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-style: normal;
	font-weight: 900;
}

.pickup-pg-Box h2 {
	padding: 30px 0;
	position: relative;
	font-size: 1.8em;
	font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
}
.pickup-pg-Box h2:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1.5px;
    background-color: #d4d4d4;
}
.pickup-pg-Box h2:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 15%;
    height: 3px;
    background-color: #38a959;
}

.pickup-pg-Box h3 {
    position: relative;
    padding-left: 20px;
    font-size: 1.3em;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    margin-top: 0;
}
.pickup-pg-Box h3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: #0b1118;
}

.pickup-pg-Box .txt-area img {}

.pickup-pg-Box .spot-post-list {
    display: flex;
    flex-wrap: wrap;
}
.pickup-pg-Box .spot-post-list .list-item {
    width: 24%;
    margin-right: 1.3%;
    margin-bottom: 60px;
    background: #fff;
}
.pickup-pg-Box .spot-post-list .list-item:nth-child(4n) {
    margin-right: 0;
}

.pickup-pg-Box .route-button {
	width: 250px;
}
.pickup-pg-Box .route-button a {
	display: block;
	position: relative;
	padding: .5em;
	color: #fff;
	text-align: center;
	text-decoration: none;
	background: #222;
	border: 1px solid rgba(0,0,0,0);
	transition: .3s;
}
.pickup-pg-Box .route-button a:hover {
	color: #222;
	background: #fff;
	border: 1px solid rgba(0,0,0,1);
}
.pickup-pg-Box .route-button a::before {
	content: "";
	position: absolute;
	top: 30%;
	left: 25%;
	width: 16px;
	height: 20px;
	background: url("../img/common/spot_map_icon01.png") no-repeat;
	transition: .3s;
}
.pickup-pg-Box .route-button a:hover::before {
	content: "";
	position: absolute;
	top: 30%;
	left: 25%;
	width: 16px;
	height: 20px;
	background: url("../img/common/spot_map_icon02.png") no-repeat;
}


/* ピックアップ横並び4点 */

.yoko-narabi-box { width: 100%; display: flex; flex-wrap: wrap; }
.yoko-narabi-box .item { width: 22%; margin-right: 2%; }
.yoko-narabi-box .item .img { line-height: 0; }
.yoko-narabi-box .item .img img { width: 100%!important; height: auto!important; }