html{
	font-size: 62.5%;
	line-height: 100%;
	-webkit-text-size-adjust:100%;
}
body{
	/* background: url(../images/pattern-02.jpg); */
	font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体","Hiragino Sans", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}
a{
	color: #0a5180;
	text-decoration: none;
	transition: all 0.2s ease-out;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	cursor: pointer;
}
a:hover{
	opacity: .5;
}
img{
    height: auto;
    width: 100%;
    max-width: 100%;
    line-height: 0;
}
p,figure{
	line-height: 0;
}
input{
	height: 40px;
	margin: 0;
	padding: 0 0.5em;
	border: 1px solid #ccc;
	border-radius: 2px;
	box-sizing: border-box !important;
	line-height: 38px;
}
button{
        background-color: transparent;
        border: none;
        cursor: pointer;
        outline: none;
        padding: 0;
        appearance: none;
}
select{
	height: 40px;
	border: 1px solid #ccc;
}
li{
	list-style-type: none;
}
.sp{
	display: block;
}
.pc{
	display: none;
}
@media screen and (min-width: 1024px){
	.sp{
		display: none;
	}
	.pc{
		display: block;
	}
}
nav{
	background: rgba(29,62,101,1);
	padding-bottom: 15px;
}
nav ul li a{
	color: #fff;
	margin: 0 5vw;
	height: 50px;
	line-height: 53px;
	display: block;
	width: 90vw;
	font-size: 1.6rem;
	padding-right: 10vw;
	text-align: right;
}
@media screen and (min-width: 1024px){
	nav{
		width: 80vw;
		background: #1D3E65;
		margin: auto;
		padding: 0 11vw;
		height: 50px;
	}
	nav ul{
		display: flex;

		justify-content: space-between;
	}
	nav ul li{
		list-style: none;
		/* width: calc(100%/7); */
		text-align: center;
	}
	nav ul li a{
		list-style: none;
		font-size: 1.5rem;
		width: 100%;
		display: block;
		border-bottom: none;
		margin: 0;
		padding-right: 0;
	}
}

@media screen and (max-width: 1023px){
	.menu_btn{
	text-align: right;
	padding-right: 15vw;
	display: block;
	color: #fff;
	background:#1D3E65;
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	font-size: 1.8rem;
	height: 50px;
	line-height: 52px;
	width: 100%;
	position: relative;
	}
	.menu_btn:before{
	content: url(../images/top//icon_open.svg);
    transform: scale(0.5);
    position: absolute;
    top: 2%;
    right: 1vw;
    display: block;
	}
	.menu_btn.close:before{
	content: url(../images/top/icon_close.svg);
    transform: scale(.5);
    position: absolute;
    top: 2%;
    right: 2.3vw;
    display: block;
	}
	.menu_list {
	display: none;
	margin: 0;
	padding-inline-start: 0px;
	list-style: none;
	background-color: rgba(29,62,101,.95);
	position: absolute;
	}
}


@media screen and (max-width: 1023px){
	#gnav-btn {
    color: gray;
    padding: 10px;
    font-size: 30px;
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 100;
    background-color: white;
    border: solid 1px #d1caca;
    border-radius: 3px;
  }
  #gnav-input:checked ~ #gnav-content {
    top: 0;
  }
  #gnav-content {
    position: fixed;
    top: -100%;
    left: 0;
    z-index: 10;
    transition: 0.3s;
    width: 100%;
  }
  .humb-menu__title {
    padding: 1.5rem;
  }
  .humb-menu label {
    display: flex;
    justify-content: space-between;
    padding: 1.5rem;
    cursor: pointer;
    border-top: 0.5px solid #c7c5c5;
  }
  .humb-menu input {
    display: none;
  }
  .humb-menu .accshow {
    height: 0;
    overflow: hidden;
  }
  .humb-menu .accshow p {
    padding: 1.5rem;
  }
  .humb-menu .cssacc:checked + .accshow {
    height: auto;
  }
}
.fixed{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 2;
	margin: auto;
	text-align: center;
}

.sp.main_video {
	position: relative;
	overflow: hidden;
	min-width: 100%;
	height: 100vh;
}
.sp.main_video video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100vh;
	height: 100vh;
	-webkit-transform: translate(-50%, -50%);	
	  transform: translate(-50%, -50%);
}
@media screen and (min-width: 500px){
	.sp.main_video video {
	  object-fit: cover;
	  height: auto;
	}
}
@media screen and (min-width: 960px){
	.sp.main_video video {
	  height: auto;
	}
}
.sp .video-btn {
	position: relative;
	display: none;
	height: 100vh;
}
.sp .video-btn img{
	position: absolute;
	margin: auto;
	transform: translate(-50%, -50%);
	width: 8rem;
	height: 8rem;
	top: 45%;
	left: 50%;
}
.pc.main_video {
	position: relative;
	overflow: hidden;
	min-width: 100%;
	height: 100vh;
	margin-bottom: 50px;
}
.pc.main_video video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100vh;
	-webkit-transform: translate(-50%, -50%);	
	  transform: translate(-50%, -50%);
}
.pc .video-btn {
	position: relative;
	display: none;
	height: 100vh;
	cursor: pointer;
}
.pc .video-btn img{
	position: absolute;
	margin: auto;
	transform: translate(-50%, -50%);
	width: 8rem;
	height: 8rem;
	top: 50%;
	left: 50%;
}

.finished .video-btn {
	position: relative;
	display: block;
}
.finished .video-btn {
	position: relative;
}
.finished .video-btn:after {
	position: absolute;
	top: 40vh;
	left: 40vw;
	margin: auto;
	width: 1em;
	height: 1em;
	color: #fff;
	transform: scale(.4, .4);
}
.pc .finished .video-btn:after {
	position: absolute;
	top: 40vh;
	left: 22vw;
	color: #fff;
	transform: scale(.5, .5);
}
.sp .log_ttl{
	position: absolute;
	top:30px;
	right:5vw;
	z-index: 2;
	width: 45vw;
}
.pc .log_ttl{
	position: absolute;
	top:30px;
	right:5vw;
	z-index: 2;
	width: 20vw;
}


@media screen and (max-width: 1023px){
	.toggle {
	display: none;
	}
	.Label {
		text-align: right;
		padding-right: 15vw;
		display: block;
		color: #fff;
		background:#1D3E65;
		font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
		font-size: 2rem;
		height: 60px;
		line-height: 62px;
	}
	.Label::before{
		content:"";
		width: 6px;
		height: 6px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		position: absolute;
		top:42%;
		right: 3.2rem;
		transform: rotate(135deg);
		font-size: 1rem;
	}
	.Label,
	.content {
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		transform: translateZ(0);
		transition: all 0.3s;
	}
	.content {		/*本文*/
		/* height: 0; */
		margin-bottom:10px;
		overflow: hidden;
	}
	.toggle:checked + .Label + .content {	/*開閉時*/
		/* height: auto; */
		transition: all .3s;
	}
	.toggle:checked + .Label::before {
		transform: rotate(-45deg) !important;
		top:48%;
	}
}



/* 豪商のまち */
#town{
	margin: auto;
}
#town h2{
	color: #1D3E65;
	font-size: 2.3rem;
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	margin: auto;
	font-weight: bold;
	padding: 70px 10vw 25px;
}
#town .text{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
	padding: 0 10vw;
	margin-bottom: 50px;
} 
#town .img03{
	margin-top: 80px;
}
#town .bg{
	background: #1D3E65;
	color: #fff;
	padding: 30px 10vw;
}

#town .bg dt{
	font-size: 1.7rem;
	position: relative;
	margin-bottom: 20px;
}
#town .bg dt:after{
	content: "";
	width: 18vw;
	height: 1px;
	background: #fff;
	position: absolute;
	left: 5em;
	top: 46%;
}
#town .bg dd{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
}

@media screen and (min-width: 1024px){
	#town{
		position: relative;
		width: 80vw;
		height: 78vw;
	}
	#town h2{
		font-size: 2.3rem;
		padding: 18px 15px;
		position: absolute;
		top: 4vw;
		right: 17.5vw;
		writing-mode: vertical-rl;
		border-left: 1px solid #1D3E65;
		border-right: 1px solid #1D3E65;
		letter-spacing: 3px;
	}
	#town .text{
		font-size: 1.5rem;
		padding: 0;
		position: absolute;
		top: 32vw;
		left: 1vw;
	}
	#town .pattern1{
		display: inline-block;
	}
	#town .img01{
		position: absolute;
		top: 4vw;
		left: 0;
		width: 45%;
	}
	#town .img02{
		position: absolute;
		top: 19vw;
		right: 0;
		width: 45%;
	}
	#town .img03{
		position: absolute;
		top: 41vw;
		right: 0;
		display: flex;
	}
	#town .img03 p{
		width: 45%;
	}
	#town .img03 .bg{
		width: 55%;
		padding: 0 7vw 0;
		display: table;
	}
	#town .img03 .bg dl{
		font-size: 1.7rem;
		vertical-align: middle;
		display: table-cell;
	}
	#town .img03 .bg dt{
		font-size: 1.7rem;
	}
	#town .bg dt:after{
		width: 4vw;
	}
	#town .img03 .bg dd{
		font-size: 1.5rem;
	}
}
@media screen and (min-width: 1300px){
	#town h2{
		top: 4vw;
		right: 17vw;
	}
	#town .text{
		left: 3vw;
		top: 34vw;
	}
	#town .img01{
		width: 48%;
	}
	#town .img02{
		width: 48%;
	}
	#town .img03 .bg{
		width: 55%;
	}
}


/* グルメのまち */
#gourmet{
	margin: auto;
}
#gourmet h2{
	color: #1D3E65;
	font-size: 2.3rem;
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	margin: 0 auto;
	font-weight: bold;
	padding: 110px 10vw 25px 
}
#gourmet .bgcolor{
	background: #F5F3ED;
	padding-top: 30px;
}
#gourmet .text{
	font-size: 1.5rem;
	line-height: 1.5;
	padding: 0 10vw 50px;
	line-height: 1.7;
    letter-spacing: 1.5px;
} 
#gourmet .img07{
	margin-top: 80px;
}
#gourmet .bg{
	background: #1D3E65;
	color: #fff;
	padding: 30px 10vw;
}
#gourmet .bg dt{
	font-size: 1.7rem;
	position: relative;
	margin-bottom: 20px;
}
#gourmet .bg dt:after{
	content: "";
	width: 18vw;
	height: 1px;
	background: #fff;
	position: absolute;
	left: 4em;
	top: 46%;
}
#gourmet .bg dd{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
}
@media screen and (min-width: 1024px){
	#gourmet .bgcolor{
		background: none;
	}
	#gourmet{
		position: relative;
		width: 80vw;
		height: 100vw;
	}
	#gourmet h2{
		font-size: 2.3rem;
		padding: 18px 15px;
		position: absolute;
		top: -2vw;
		right: 12.5vw;
		writing-mode: vertical-rl;
		border-left: 1px solid #1D3E65;
		border-right: 1px solid #1D3E65;
		letter-spacing: 3px;
	}
	#gourmet .text{
		font-size: 1.5rem;
		padding: 0;
		position: absolute;
		top: 31vw;
		left: 2.5vw;
	}
	#gourmet .text2{
		top: 52vw;
		left: 46vw;
	}
	#gourmet .pattern1{
		display: inline-block;
	}
	#gourmet .img04{
		position: absolute;
		top: 0;
		left: 0;
		width: 60%;
	}
	#gourmet .img05{
		position: absolute;
		top: 18vw;
		right: 0;
		width: 35%;
	}
	#gourmet .img06{
		position: absolute;
		top: 47vw;
		left: 0;
		width: 19vw;
	}
	#gourmet .img07{
		position: absolute;
		top: 47vw;
		left: 21vw;
		width: 19vw;
		margin-top: 0;
	}
	#gourmet .img08{
		position: absolute;
		top: 70vw;
		right: 0;
		display: flex;
		flex-direction:row-reverse;
	}
	#gourmet .img08 p{
		width: 45%;
	}
	#gourmet .img08 .bg{
		width: 55%;
		padding: 0 7vw 0;
		display: table;
	}
	#gourmet .img08 .bg dl{
		vertical-align: middle;
		display: table-cell;
	}
	#gourmet .img08 .bg dt{
		font-size: 1.7rem;
	}
	#gourmet .bg dt:after{
		width: 4vw;
	}
	#gourmet .img08 .bg dd{
		font-size: 1.5rem;
	}
}
@media screen and (min-width: 1300px){
	#gourmet .text{
		top: 31vw;
		left: 9vw;
	}
	#gourmet .text2{
		top: 51vw;
		left: 46vw;
	}
	#gourmet .img06,#gourmet .img07{
		top: 45vw;
	}
	#gourmet .img08{
		top: 68vw;
	}
}



/* 歴史に触れる */
#history{
	margin: auto;
}
#history h2{
	color: #1D3E65;
	font-size: 2.3rem;
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	margin: auto;
	font-weight: bold;
	padding: 110px 0 40px;
	text-align: center;
}
#history .text{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
	padding: 0 10vw;
	margin-bottom: 50px;
} 
#history .img03{
	margin-top: 80px;
}
#history .bg{
	background: #1D3E65;
	color: #fff;
	padding: 30px 10vw;
}

#history .bg dt{
	font-size: 1.7rem;
	position: relative;
	margin-bottom: 20px;
}
#history .bg dt:after{
	content: "";
	width: 18vw;
	height: 1px;
	background: #fff;
	position: absolute;
	left: 5em;
	top: 46%;
}
#history .bg dd{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
}

@media screen and (min-width: 1024px){
	#history{
		width: 100%;
		background-color: #F5F3ED;
	}
	#history > div{
		width: 80vw;
		height: 100vw;
		margin: auto;
		position: relative;
	}
	#history h2{
		font-size: 2.3rem;
		padding: 0;
		position: absolute;
		top: 8vw;
		left: 7vw;
		padding: 18px 15px;
		writing-mode: vertical-rl;
		border-left: 1px solid #1D3E65;
		border-right: 1px solid #1D3E65;
		letter-spacing: 3px;
	}
	#history .img09{
		position: absolute;
		top: 5vw;
		left: 20vw;
		width: 42%;
	}
	#history .img10{
		position: absolute;
		top: 7vw;
		right: 0;
		width: 28%;
	}
	#view .img11{
		position: absolute;
		top: 73vw;
		right: 0;
		width: 33%;
	}
	#history .img29{
		position: absolute;
		top: 33vw;
		right: 6vw;
		width: 30%;
	}
	#history .img12{
		position: absolute;
		top: 51vw;
		right: 6vw;
		width: 30%;
	}
	#history .img13{
		position: absolute;
		top: 62vw;
		left: 5vw;
		width: 30%;
	}
	#history .img14{
		position: absolute;
		top: 70vw;
		right: 0;
		width: 55%;
	}
}
@media screen and (min-width: 1400px){
	#history h2{
		top: 9vw;
		left: 8vw;
	}
	#history .img09{
		top: 5vw;
		left: 20vw;
		width: 45%;
	}
	#history .img10{
		top: 7vw;
		right: 0;
		width: 27%;
	}
	#view .img11{
		top: 73vw;
		width: 34%;
	}
	#history .img29{
		top: 33vw;
		right: 6vw;
		width: 32%;
	}
	#history .img12{
		top: 51vw;
		right: 6vw;
		width: 32%;
	}
	#history .img13{
		top: 62vw;
		left: 5vw;
		width: 32%;
	}
	#history .img14{
		top: 71vw;
		right: 0;
		width: 57%;
	}
}


/* 風景を楽しむ */
#view{
	margin: auto;
	background: #F5F3ED;
}
#view h2{
	color: #1D3E65;
	font-size: 2.3rem;
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	margin: 60px auto 0;
	font-weight: bold;
	padding: 60px 0 40px;
	text-align: center;
}
#view .text{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
	padding: 0 10vw;
	margin-bottom: 50px;
} 
#view .img03{
	margin-top: 80px;
}
#view .bg{
	background: #1D3E65;
	color: #fff;
	padding: 30px 10vw;
}

#view .bg dt{
	font-size: 1.7rem;
	position: relative;
	margin-bottom: 20px;
}
#view .bg dt:after{
	content: "";
	width: 18vw;
	height: 1px;
	background: #fff;
	position: absolute;
	left: 5em;
	top: 46%;
}
#view .bg dd{
	font-size: 1.5rem;
	line-height: 1.7;
	letter-spacing: 1.5px;
}

@media screen and (min-width: 1024px){
	#view{
		width: 80vw;
		height: 112vw;
		margin: auto;
		position: relative;
		background: none;
	}
	#view h2{
		font-size: 2.3rem;
		position: absolute;
		top: 0vw;
		right: 10vw;
		padding: 18px 15px;
		writing-mode: vertical-rl;
		border-left: 1px solid #1D3E65;
		border-right: 1px solid #1D3E65;
		letter-spacing: 3px;
	}
	#view .img15{
		position: absolute;
		top: 7vw;
		left: 0;
		width: 65%;
	}
	#view .img16{
		position: absolute;
		top: 20vw;
		right: 0;
		width: 28%;
	}
	#view .img17{
		position: absolute;
		top: 40vw;
		left: 2vw;
		width: 38%;
	}
	#view .img18{
		position: absolute;
		top: 63vw;
		left: 2vw;
		width: 38%;
	}
	#view .img19{
		position: absolute;
		top: 46vw;
		right: 2vw;
		width: 50%;
	}
	#view .img20{
		position: absolute;
		top: 87vw;
		left: 0;
		width: 36%;
	}
	#view .img21{
		position: absolute;
		top: 87vw;
		left: 31vw;
		width: 24%;
	}
	#history .img22{
		position: absolute;
		top: 30vw;
		left: 0;
		width: 50%;
	}
}
@media screen and (min-width: 1400px){
	#view h2{
		font-size: 2.3rem;
	}
}





/* 旅をする */
#trip{
	margin: auto;
}
#trip h2{
	color: #1D3E65;
	font-size: 2.3rem;
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	margin: auto;
	font-weight: bold;
	padding: 110px 0 40px;
	text-align: center;
}
#trip > div > div dl dd{
	color: #fff;
	background: #1D3E65;
	text-align: center;
	width: 75vw;
	margin: 30px auto 80px;
	height: 50px;
	line-height: 51px;
	font-size: 1.5rem;
}

@media screen and (min-width: 1024px){
	#trip{
		width: 100%;
		background-color: #F5F3ED;
		padding: 50px 0 10px;
	}
	#trip > div{
		width: 80vw;
		margin: auto;
	}
	#trip h2{
		font-size: 2.3rem;
		padding: 0;
		text-align: center;
		margin-bottom: 40px;
		padding: 18px 15px;
		writing-mode: vertical-rl;
		border-left: 1px solid #1D3E65;
		border-right: 1px solid #1D3E65;
		letter-spacing: 3px;
	}
	#trip > div > div{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#trip > div > div dl{
		width: 30%;
	}
	#trip > div > div dl dd{
		color: #fff;
		background: #1D3E65;
		text-align: center;
		width: 70%;
		height: 35px;
		line-height: 36px;
	}	
}



#bnr_area{
	margin: 100px auto;
	text-align: center;
	
}
#bnr_area img{
	width: 90vw;
	text-align: center;
	margin: auto;
}
#bnr_area p{
	line-height: 1;
}
#bnr_area .text{
	font-size: 1.5rem;
	margin: 20px auto 10px;
	line-height: 1.7;
    letter-spacing: 1.5px;
	font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体","Hiragino Sans", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
	
}
#bnr_area .link a{
	background: #1D3E65;
	color: #fff;
	padding: 10px 5rem;
	display: inline-block;
	margin: auto;
	font-size: 1.4rem;
}
@media screen and (min-width: 1024px){
	#bnr_area{
		margin: 80px auto;
	}	
	#bnr_area img{
		width: 40%;
	}
	#bnr_area .link a{
		padding: 8px 5rem;
	}
}


.pattern1{
	position: relative;
	margin: 0 auto 20px;
	width: 96vw;
}
figcaption{
	position: absolute;
	top:30px;
	left: 0;
	background-color: rgba(29,62,101,.8);
	color: #fff;
	height: 35px;
	line-height: 36px;
	text-align: center;
	padding: 0 9vw;
	font-size: 1.3rem;
	letter-spacing: 1.5px;
}
@media screen and (min-width: 1024px){
	.pattern1{
		margin: auto;
	}
	figcaption{
		padding: 0 3vw;
		line-height: 37px;
		font-size: 1.3rem;
	}

}
@media screen and (min-width: 1300px){
	figcaption{
		padding: 0 4vw;
	}

}





@media screen and (max-width: 1023px){
.sp .wrap{
    width: calc(100% - 3em) !important;
    margin: auto !important;
}
#areaMap{
	background: url(../images/pattern-03.jpg);
	padding: 2em 0;
	}
	#areaMap h2{
		margin: 20px auto;
		text-align: center;
	}
	#areaMap h2 img{
		width: auto;
		height: 9em;
	}
	#areaMap section{}
		#areaMap section img{
			width: 100%;
			}
	#areaMap section+section{}
		#areaMap section+section > div{
			padding: 1em;
			}
		#areaMap section+section > div > img{
			width: 20vw;
			height: auto;
			}
		#areaMap section+section > div > img+div{
			display: inline-block;
			padding: 1em;
			background: #fff;
			box-shadow: 0 0 3px #ccc;
			}
	#areaMap p{
		line-height: 1.5;
		margin-top: 1em;
		font-size: 1.7rem;
	}
	#areaMap h4{
		color: #000;
		font-weight: bold;
		font-size: 4.2vw;
		line-height: 1.4em;
		}
	#areaMap h4+p{
		margin-top: 0.5em;
		}
		#areaMap h4+p .but{
			display: block;
			text-align: center;
			}

	#areaMap .but{
		background: #f2c022;
		color: #000;
		}
		#areaMap .but svg{
			fill: #000;
			}
	#areaMap #gMap{
		height: 60vh;
		}
		/*
		#areaMap #gMap img{
			width: auto !important;
			height: auto !important;
			}
		*/
	#areaMap iframe {
		clear:both;
		width: 100%;
		max-width:100% !important;
		}
		#booking{
			background: url(../images/pattern-02.jpg);
			}
			#booking h2{
				margin: auto;
				text-align: center;
				padding: 30px 0;
			}
			#booking h2 img{
			    width: auto;
    			height: 9em;
			}
			#booking p{
				line-height: 1.5;
				font-size: 1.7rem;
			}
			#booking figure,
			#booking figure+div{
				text-align: center;
				margin: 1.5em auto;
				}
				#booking figure+div .but:nth-child(1){
					background: #d34871;
					padding: 0.8em 4.9em;
					}
				#booking figure+div .but:nth-child(2){
					background: #f2c022;
					padding-top: 0.6em;
					padding-bottom: 0.6em;
					}
					#booking figure+div .but svg{
						fill: #fff;
						}
					#booking figure+div .but i img{
						width: 1.4em;
						height: 1.4em;
						margin-top: -0.7em;
						}
				#booking figure+div a+a{
					margin-top: 1em;
					}
			#booking form{
				counter-reset: sample;
				overflow: hidden;
				}
				#booking form input[type="radio"]{
					height: 4.2vw;
					margin-right: 0.2em;
					}
				#booking form select,
				#booking form input[type="text"]{
					width: 100%;
					}
				#booking form dl+dl{
					margin-top: 1em;
					}
					#booking form dl:first-child{
						margin-top: -1px;
						}
				#booking form dt,
				#booking form dd{
					padding: 1em;
					font-size: 1.7rem;
					line-height: 2;
					}
				#booking form dt{
					padding-bottom: 0.5em;
					border-top: 1px dotted #ada5a1;
					font-weight: bold;
					}
					#booking form dt:before{
						counter-increment: sample;
						content: counter(sample)".";
						}
				#booking form dd{
					padding-top: 0;
					}
				#booking form li{
					list-style: none;
					line-height: 1em;
					}
					#booking form li+li{
						margin-top: 0.5em;
						}
				#booking form dl+div{
					display: -webkit-flex;
					display: flex;
					-webkit-justify-content: center;
					justify-content: center;
					border-top: 1px dotted #ada5a1;
					padding: 1em;
					}
					#booking form dl+div a+a{
						margin-left: 1em;
						}
				#booking form .but i{
					margin-right: 0.2em;
					top: 49%;
					}
					.butY.large i:first-child {
						right: 0.5em;
						top: 45%;
					}
			#booking #cp,
			#booking #rn,
			#booking #pn,
			#booking #px{
				width: 40%;
				font-size: 1em;
				}
			#booking #calBtn{
				margin-top: 1em;
				}
				.contents{}
				.contents header{
					display: -ms-flexbox;
					display: flex;
					-ms-flex-pack: justify;
					justify-content: space-between;
					}
					.contents header h2{
						width: 25%;
						text-align: center;
						margin: auto;
						}
					.contents header p{
						width: 550px;
						text-align: justify;
						}
				.contents section{
					margin-top: 40px;
					background: #fff;
					border: 1px solid #ada5a1;
					}
				.contents h3{
					margin: -1px;
					margin-bottom: 0;
					padding: 0.8em;
					background: #0a5180;
					color: #fff;
					font-size: 1.8rem;
					font-weight: bold;
					line-height: 1em;
					text-align: center;
					}
			
			.but{
				display: inline-block;
				padding: 0.5em 3em;
				padding-top: 0.6em;
				background: #0a5180;
				border-radius: 4px;
				color: #fff;
				line-height: 1.2em;
				font-weight: bold;
				transition: all 0.2s ease-out;
				 position: relative;
				 line-height: 2;
				 font-size: 1.4rem;
				}
				.but i {
					position: absolute;
					right: 0.5em;
					top: 35%;
				}
				.but:hover{
					text-decoration: none;
					}
				.but svg,.but .svg{
					width: 1em;
					height: 1em;
					margin-top: -0.1em;
					vertical-align: middle;
					fill: #fff;
					transition: all 0.2s ease-out;
					opacity: .8;
					}
				.but.small{
					padding: 0.8em;
					font-size: 1.2rem;
					line-height: 1em;
					}
				.but.large{
					padding: 0.8em 1.5em;
					font-size: 1.8rem;
					line-height: 1em;
					box-shadow: 2px 2px 3px rgba(0,0,0,.2);
					}
					.but.large:hover{
						opacity: .8;
						}
					.but.large i:first-child{
						margin-right: 0.5em;
						}
					.but.large i:last-child{
						margin-left: 1em;
						}
}


@media screen and (min-width: 1024px){
article {
    padding: 60px 0;
}
.contents header p {
    width: 550px;
    text-align: justify;
	line-height: 1.5;
	font-size: 14px;
	color: rgb(64, 64, 64);
}
#areaMap{
	background: url(../images/pattern-03.jpg);
	}
	#areaMap header+div{
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: justify;
		justify-content: space-between;
		}
	#areaMap section{
		width: 382px;
		}
	#areaMap section+section{
		width: 550px;
		}
		#areaMap section+section > div{
			padding: 1em;
			}
		#areaMap section+section > div > img+div{
			display: inline-block;
			padding: 1em;
			background: #fff;
			box-shadow: 0 0 3px #ccc;
			}
	#areaMap h4{
		color: #000;
		font-weight: bold;
		line-height: 1.4em;
		}
	#areaMap h4+p{
		margin-top: 0.5em;
		}
		#areaMap h4+p .but{
			display: block;
			text-align: center;
			}
	#areaMap footer{
		margin-top: 40px;
		text-align: center;
		}
		#areaMap footer .but{
			padding-right: 0.5em;
			background: #f2c022;
			}
			#areaMap footer .but svg{
				fill: #000;
				}
	#areaMap .but{
		background: #f2c022;
		color: #000;
		}

#booking{
	background: url(../images/pattern-02.jpg);
	}
	#booking figure,
	#booking figure+div{
		text-align: center;
		margin: 2em auto;
		width: 75%;
		}
	#booking figure+div .but{
		padding-left: 2.5em;
		}
		#booking figure+div .but:nth-child(1){
			background: #d34871;
			}
		#booking figure+div .but:nth-child(2){
			background: #f2c022;
			}
		#booking figure+div .but svg,
		#booking figure+div .but i img{
			width: 1.2em;
			height: 1.2em;
			margin: -0.3em 0;
			fill: #fff;
			}
		#booking figure+div .but+.but{
			margin-left: 0.5em;
			}
	#booking form{
		position: relative;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-ms-flex-pack: justify;
		justify-content: space-between;
		counter-reset: sample;
		padding: 30px;
		overflow: hidden;
		}
		#booking form input[type="radio"]{
			height: 1em;
			margin-right: 0.2em;
			}
		#booking form input[type="text"]{
			width: 100%;
			margin-bottom: 5px;
			}
		#booking form select{
			width: 40%;
			}
		#booking form dl{
			width: 50%;
			}
			#booking form dl:nth-of-type(odd){
				padding-right: 30px;
				}
			#booking form dl:nth-of-type(even){
				padding-left: 30px;
				border-left: 1px dotted #ada5a1;
				}
		#booking form dt{
			margin-bottom: 0.8em;
			padding-bottom: 0.5em;
			border-bottom: 1px dotted #ada5a1;
			font-weight: bold;
			font-size: 1.4rem;
			}
			#booking form dt:before{
				counter-increment: sample;
				content: counter(sample)".";
				}
		#booking form dd+dt{
			margin-top: 2em;
			}
		#booking form li{
			list-style: none;
			line-height: 1em;
			font-size: 1.5em;
			}
			#booking form li+li{
				margin-top: 0.5em;
				}
		#booking form dl+div{
			width: 100%;
			display: -ms-flexbox;
			display: flex;
			-ms-flex-pack: center;
			justify-content: center;
			margin-top: 30px;
			}
			#booking form dl+div a+a{
				margin-left: 1em;
				}
		#booking form .but i{
			margin-right: 0.2em;
			top: 20%;
			}
	#booking #cp,
	#booking #rn,
	#booking #pn,
	#booking #px{
		width: 40%;
		}

		.contents{}
		.contents header{
			display: -ms-flexbox;
			display: flex;
			-ms-flex-pack: justify;
			justify-content: space-between;
			}
			.contents header h2{
				width: 25%;
				text-align: center;
				margin: auto;
				}
			.contents header p{
				width: 550px;
				text-align: justify;
				}
		.contents section{
			margin-top: 40px;
			background: #fff;
			border: 1px solid #ada5a1;
			}
		.contents h3{
			margin: -1px;
			margin-bottom: 0;
			padding: 0.8em;
			background: #0a5180;
			color: #fff;
			font-size: 1.8rem;
			font-weight: bold;
			line-height: 1em;
			text-align: center;
			}
	
	.but{
		display: inline-block;
		padding: 0.5em 3em;
		padding-top: 0.6em;
		background: #0a5180;
		border-radius: 4px;
		color: #fff;
		line-height: 1.2em;
		font-weight: bold;
		transition: all 0.2s ease-out;
		 position: relative;
		 line-height: 2;
		 font-size: 1.4rem;
		}
		.but i {
			position: absolute;
			left: 1.1em;
			top: 30%;
		}
		.but:hover{
			text-decoration: none;
			}
		.but svg,.but .svg{
			width: 1em;
			height: 1em;
			margin-top: -0.1em;
			vertical-align: middle;
			fill: #fff;
			transition: all 0.2s ease-out;
			opacity: .8;
			}
		.but.small{
			padding: 0.8em 2.8em;
			font-size: 1.2rem;
			line-height: 1em;
			}
			.but.small i{
				top: 28% !important;
			}
		.but.large{
			padding: 0.8em 1.5em;
			font-size: 1.8rem;
			line-height: 1em;
			box-shadow: 2px 2px 3px rgba(0,0,0,.2);
			}
			.but.large:hover{
				opacity: .8;
				}
			.but.large i:first-child{
				margin-right: 0.5em;
				}
			.but.large i:last-child{
				margin-left: 1em;
				}
}







@media screen and (max-width: 1023px){

	#areaMap footer{
		margin-top: 1em;
		text-align: center;
		}
		#areaMap footer .but{
			padding-right: 2em;
			}

			#footer{
				background: url(../images/pattern-02.jpg);
				}
				#footer svg{
					width: 2em  !important;
					height: 2em  !important;
					color: #ccc;
					vertical-align: top;
					}
				#footer li{
					list-style: none;
					line-height: 4em !important;
					}
				#footer li svg{
					margin-top:1.5em !important;
				}
			#fNav{}
				#fNav dt{
					padding: 0.8em 1em;
					background: #083c66;
					color: #fff;
					font-size: 5vw;
					font-weight: bold;
					text-align: center;
					line-height: 1em;
					}
					#fNav dt i{
						margin-right: 0.5em;
						}
					#fNav dt svg{
						width: 1.2em;
						height: 1.2em;
						margin-top: -0.2em;
						fill: #fff;
						vertical-align: top;
						opacity: .5;
						}
				#fNav dd+dt{
					margin-top: 2em;
					}
				#fNav dd{
					overflow: hidden;
					}
				#fNav li{
					margin-top: 1em;
					list-style: none;
					text-align: center;
					}
			
			#pickup{}
				#pickup li{
					position: relative;
					display: -webkit-flex;
					display: flex;
					margin: 0;
					padding: 1em;
					}
					#pickup li+li{
						border-top: 1px dotted #ada5a1;
						}
				#pickup a{
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 100%;
					font-size: 0;
					}
				#pickup figure{
					width: 30vw;
					}
				#pickup p{
					width: calc(100% - 30vw);
					padding-left: 1em;
					text-align: justify;
					line-height: 1.4em;
					}
				#pickup time{
					position: absolute;
					right: 1em;
					bottom: 1em;
					color: #0a5180;
					}
			
			#fSns{
				display: -webkit-flex;
				display: flex;
				-webkit-justify-content: center;
				justify-content: center;
				padding: 2em 0;
				}
				#fSns li{
					margin-left: 0.5em;
					}
				#fSns a{
					display: block;
					background: #000;
					border-radius: 100%;
					}
				#fSns svg{
					margin: 3vw;
					width: 10vw;
					height: 10vw;
					}
				#fSns .instagram a{
					background: #e4405f;
					}
				#fSns .facebook a{
					background: #315096;
					}
				#fSns .twitter a{
					background: #1da1f2;
					}
				#fSns .line a{
					background: #00c300;
					}
				#fSns svg{
					fill: #fff;
					}
				#fSns+div{
					text-align: center;
					}
					#fSns+div a{
						position: relative;
						display: block;
						background: #f2f2f2;
						border-top: 1px solid #ccc;
						padding: 1em;
						font-size: 5vw;
						font-weight: bold;
						line-height: 1em;
						}
					#fSns+div i{
						position: absolute;
						right: 1em;
						}
					#fSns+div svg{
						fill: #0a5180;
						opacity: .8;
						width: 1em !important;
						height: 1em !important;
						}
			
			#copyright{
				padding: 1em 0;
				text-align: center;
				background: url(../images/pattern-01.jpg);
				}
				#copyright p{
					color: #fff;
					font-size: 4vw;
					line-height: 1em;
					}
			
			.wrap{
				width: calc(100% - 2em);
				margin: auto;
				}
			
			.course{}
				.course p{
					text-align: justify;
					}
				.course header{
					margin-top: -2em;
					padding: 1em 0;
					background: #fff;
					}
					.course header h2{
						height: 32vw;
						border: 1px solid #fff;
						background-repeat: no-repeat;
						background-position: left top;
						background-size: auto 100%;
						font-size: 0;
						}
					.course header p{
						margin-top: 1em;
						}
				.course section{
					position: relative;
					margin-top: 1em;
					padding-bottom: 5em;
					}
					.course section:before{
						content: "";
						position: absolute;
						left: 50%;
						bottom: -1em;
						height: 6em;
						margin-left: -3;
						border-left: 6px dotted #000;
						}
					.course section:last-child{
						padding-bottom: 0;
						}
						.course section:last-child:before{
							content: none;
							}
						.course section:last-child div+span{
							display: none;
							}
					.course section figure{}
						.course section figure .thumbBox{
							padding-top: 66.66%;
							}
					.course section figure+figure{
						position: absolute;
						width: 30vw;
						right: 1em;
						margin-top: -34.2vw;
						}
						.course section figure+figure .thumbBox{
							padding-top: 100%;
							background-size: cover;
							border-radius: 100%;
							box-shadow: 0 0 0 1vw #fff;
							}
					.course section figure+div{
						padding: 1em;
						background: #fff;
						}
						.course section figure+div span{
							top: 0;
							left: 0;
							width: 6em;
							padding: 0.5em 0;
							}
					.course section div+span{
						left: 50%;
						bottom: 1em;
						width: 8em;
						margin-left: -4em;
						padding: 0.5em;
						border-radius: 2em;
						}
					.course section span{
						position: absolute;
						display: block;
						background: #000;
						color: #fff;
						font-weight: bold;
						line-height: 1em;
						text-align: center;
						}
					.course section h3{
						font-size: 5vw;
						font-weight: bold;
						line-height: 1.4em;
						}
					.course section p{
						margin-top: 1em;
						}
					.course section dl{
						margin-top: 1.5em;
						}
					.course section dt{
						padding-left: 0.5em;
						border-left:  0.5em solid #0a5180;
						font-weight: bold;
						line-height: 1.2em;
						}
					.course .but{
						margin-top: .5em;
						border: 2px solid #0a5180;
						background: #fff;
						color: #0a5180;
						}
						.course .but svg{
							fill: #0a5180;
							opacity: 1;
							}
						.course .but:hover{
							background: #0a5180;
							color: #fff;
							}
							.course .but:hover svg{
								fill: #fff;
								}
			
			.contents{}
				.contents header{}
					.contents header h2{
						text-align: center;
						}
						.contents header h2 img{
							width: auto;
							height: 5em;
							}
					.contents header p{
						margin-top: 1em;
						text-align: justify;
						}
				.contents section{
					margin-top: 2em;
					background: #fff;
					border: 1px solid #ada5a1;
					}
				.contents h3{
					margin: -1px;
					margin-bottom: 0;
					padding: 0.8em;
					background: #0a5180;
					color: #fff;
					font-size: 5vw;;
					font-weight: bold;
					line-height: 1em;
					text-align: center;
					}
			
			.but{
				position: relative;
				display: block;
				padding: 0.5em 1em;
				padding-right: 2em;
				background: #0a5180;
				border-radius: 4px;
				color: #fff;
				line-height: 1.2em;
				font-weight: bold;
				transition: all 0.2s ease-out;
				}
				.but i{
					position: absolute;
					right: 0.5em;
					top: 50%;
					}
				.but img{
					max-width: auto;
					width: 100%;
					height: auto;
					}
				.but svg,
				.but .svg{
					width: 1em;
					height: 1em;
					margin-top: -0.5em;
					vertical-align: top;
					fill: #fff;
					transition: all 0.2s ease-out;
					opacity: .8;
					}
				.but.small{
					padding: 0.8em;
					font-size: 3.6vw;
					line-height: 1em;
					}
					.but.small i{
						position: static;
						}
					.but.small svg{
						margin-top: 0;
						}
				.but.large{
					padding: 0.8em 1em;
					font-size: 5vw;
					line-height: 1em;
					box-shadow: 2px 2px 3px rgba(0,0,0,.2);
					}
					.but.large i:first-child{
						margin-right: 0.5em;
						}
					.but.large i:last-child{
						margin-left: 1em;
						}
			
			.thumb{
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: auto;
				height: calc(100% + 0px);
				opacity: 0 !important;
				-ms-filter: "alpha(opacity=0)" !important;
				}
				.thumbBox{
					position: relative;
					display: block;
					width: 100%;
					margin: 0;
					padding: 100% 0 0 0;
					overflow: hidden;
					background-color: #ccc;
					background-repeat: no-repeat;
					background-position: center;
					background-size: cover;
					transition: opacity 0.5s ease-out;
					}
				.thumbBox.wide{}
				.thumbBox.long{
					background-size: contain;
					}
			
			.none{
				display: none;
				}
			
			
			/* ie */
			@media all and (-ms-high-contrast: none){}
			
			/* STORY */
			.story ul li {
			  list-style: none;
			}
			
			.story .story_inner {
			  width: calc(100% - 2em);
			  margin: 0 auto;
			}
			
			.story .story_main_ttl {
			  margin-bottom: 40px;
			  text-align: center;
			}
			
			.story .topicpath {
			  padding: 40px 0;
			  background: url("../images/story/common/main_bg001.png") ;
			}
			  .story .topicpath ul {
				display: flex;
				flex-wrap: wrap;
				width: calc(100% - 2em);
				margin: 0 auto;
			  }
			  .story .topicpath ul li {
				margin-right: 10px;
			  }
			  .story .topicpath ul li a {
				margin-right: 10px;
				color: #000;
				text-decoration: underline;
			  }
			  .story .topicpath ul li a:hover {
				text-decoration: none;
			  }
			
			.story .top_ttl {
			  padding: 50px 0;
			  background: url("../images/story/common/main_bg001.png") ;
			}
			  .story .top_ttl h2 {
				width: calc(100% - 2em);
				margin: 0 auto;
			  }
			  .story .top_ttl h2 img {
				width: 100%;
			  }
			
			.story .lnav {
			  padding-bottom: 55px;
			  background: url("../images/story/common/main_bg001.png") ;
			}
			  .story .lnav ul {
				width: calc(100% - 2em);
				margin: 0 auto;
			  }
			  .story .lnav ul li {
				margin-bottom: 20px;
			  }
			  .story .lnav ul li:last-child {
				margin-bottom: 0;
			  }
			  .story .lnav ul li img {
				width: 100%;
			  }
			
			.story .story_sec {
			  padding: 40px 0 ;
			  background: url("../images/story/common/story_bg001.png");
			}
			  .story .story_sec .story_ttl {
				margin-bottom: 40px;
				padding: 10px 10px 5px;
				background-color: #11527e;
				font-size: 5vw;
				line-height: 1.5;
				font-weight: normal;
				text-align: center;
				color: #fff;
			  }
			  .story .story_sec .story_box {
				margin-bottom: 40px;
			  }
			  .story .story_sec .story_box figure img {
				width: 100%;
			  }
			  .story .story_sec .story_box dl {
				padding: 20px;
				background:rgba(255,255,255,0.9);
			  }
			  .story .story_sec .story_box dl dt {
				margin-bottom: 15px;
				color: #917f40;
				font-size: 5vw;
				font-weight: bold;
			  }
			  .story .story_sec .story_box dl dd {
			  }
			
			
			.story .photo_sec {
			  padding: 40px 0;
			  background: url("../images/story/common/photo_bg001.png");
			}
			  .story .photo_sec ul li {
				margin-bottom: 40px;
			  }
			  .story .photo_sec ul li:last-child {
				margin-bottom: 0;
			  }
			  .story .photo_sec figcaption {
				margin-top: 15px;
			  }
			  .story .photo_sec figure img {
				width: 100%;
			  }
			
			.story .point_sec {
			  padding-top: 40px;
			  background: url("../images/story/common/point_bg001.png");
			}
			  .story .point_sec .point_box {
				margin-bottom: 60px;
			  }
			  .story .point_sec .point_box figure {
				margin-bottom: 20px;
				text-align: right;
			}
			  .story .point_sec .point_box figcaption {
				margin-top: 10px;
			  }
			  .story .point_sec .point_box figure img {
				width: 100%;
			  }
			  .story .point_sec .point_box p {
				padding: 20px;
				background-color: #fff;
			  }
			  .story .point_sec .point_box p span {
				text-align: right;
				margin-top: 1em;
				display: block;
			  }
			  .story .point_sec .spot_ttl {
				width: 50%;
				margin-bottom: 50px;
				padding-left: 20px;
				border-left: 10px solid #917f40;
			  }
			  .story .point_sec .spot_item {
				margin-bottom: 60px;
			  }
			  .story .point_sec .spot_item .item_ttl {
				margin-bottom: 20px;
				padding: 10px;
				color: #fff;
				font-size: 2rem;
				background-color: #92803b;
				border: 1px solid #c6bd9b;
			  }
			  .story .point_sec .spot_item figure {
				margin-bottom: 20px;
				text-align: center;
			  }
			  .story .point_sec .spot_item  figure img {
				width: 100%;
			  }
			  .story .point_sec .spot_item figcaption {
				margin-top: 30px;
				font-size: 5vw;
				font-weight: bold;
				text-align: left;
			  }
			  .story .point_sec .spot_item table {
				width: 100%;
				margin-bottom: 20px;
			  }
			  .story .point_sec .spot_item table tr {
				border-bottom: 1px solid #8f7c3c;
			  }
			  .story .point_sec .spot_item table th {
				display: block;
				padding: 10px 10px 5px;
				text-align: left;
				vertical-align: top;
				font-weight: bold;
			  }
			  .story .point_sec .spot_item table td {
				display: block;
				padding: 0 10px 10px;
			  }
			
			  .story .point_sec .spot_item .item_btn {
				width: 205px;
				margin: 0 auto;
			  }
			  .story .point_sec .spot_item .item_btn li {
				margin-bottom: 10px;
			  }
			  .story .point_sec .spot_item .item_btn li:last-child {
				margin-bottom: 0;
			  }
			  #areaMap footer{
				margin-top: 1em;
				text-align: center;
				}
				#areaMap footer .but{
					padding-right: 2em;
					}
}



















/* #wrapper{
	overflow: hidden;
} */

/* #header{
	background: url(../images/pattern-01.jpg);
	color: #fff;
	line-height: 42px;
	}
	#header h1{
		float: left;
		}
	#header ul{
		display: -ms-flexbox;
		display: flex;
		-ms-flex-align-items: center;
		align-items: center;
		-ms-flex-pack: end;
		justify-content: flex-end;
		}
	#header li{
		position: relative;
		list-style: none;
		margin-left: 1em;
		}
		#header li iframe,#header li .fb-like span{
			vertical-align: middle !important;
			}
		#header li:last-child{
			padding-right: 1.2em;
			font-weight: bold;
			}
	#header a{
		color: #fff;
		}
	#header i{
		position: absolute;
		right: 0;
		top: 50%;
		}
	#header svg{
		width: 1em;
		height: 1em;
		margin-top: -0.5em;
		fill: #fff;
		vertical-align: top;
		opacity: .8;
		} */

#hero{
	height: 568px;
	margin-bottom: 190px;
	background: url(../images/heroImg-01.jpg) center center;
	background-size: cover;
	overflow: hidden;
	}
	#hero > div{
		position: relative;
		z-index: 1;
		}
		#hero > div p{
			position: absolute;
			}
	#hero li{
		position: relative;
		}
		#hero li p{
			position: relative;
			height: 568px;
			}
			#hero li p img{
				position: absolute;
				right: 0;
				bottom: 50px;
				}
	#hero .thumbBox{
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		padding: 0;
		}
#story #hero {
  height: auto;
  margin-bottom: 0;
}
#story #hero img {
  width: 100%;
}

#gNav{
	position: absolute;
	top: 610px;
	width: 100%;
	height: 204px;
	background: url(../images/pattern-01.jpg);
	overflow: hidden;
	}
	#gNav:before{
		content: "";
		position: absolute;
		display: block;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: url(../images/gNavPattern.jpg) center top repeat-x;
		}
	#gNav.min{
		position: fixed;
		height: 70px;
		top: 0;
		left: 0;
		z-index: 1;
		-webkit-animation: gNav 0.5s 1;
		animation: gNav 0.5s 1;
		}
		@-webkit-keyframes gNav {
			0% {top: -90px;}
			100% {top: 0px;}
			}
		@keyframes gNav {
			0% {top: -90px;}
			100% {top: 0px;}
			}
		#gNav.min:before{
			content: none;
			}
		#gNav.min ul{
			background: none;
			}
		#gNav.min li:nth-child(1){
			background: url(../images/gNavMin-02_on.png);
			}
			#gNav.min li:nth-child(1):before{
				content: url(../images/gNavMin-02.png);
				}
		#gNav.min li:nth-child(2){
			background: url(../images/gNavMin-03_on.png);
			}
			#gNav.min li:nth-child(2):before{
				content: url(../images/gNavMin-03.png);
				}
		#gNav.min li:nth-child(3){
			background: url(../images/gNavMin-04_on.png);
			}
			#gNav.min li:nth-child(3):before{
				content: url(../images/gNavMin-04.png);
				}
		#gNav.min li:nth-child(4){
			background: url(../images/gNavMin-05_on.png);
			}
			#gNav.min li:nth-child(4):before{
				content: url(../images/gNavMin-05.png);
				}
		#gNav.min li:nth-child(5){
			background: url(../images/gNavMin-06_on.png);
			}
			#gNav.min li:nth-child(5):before{
				content: url(../images/gNavMin-06.png);
				}
		#gNav.min li:nth-child(6){
			background: url(../images/gNavMin-07_on.png);
			}
			#gNav.min li:nth-child(6):before{
				content: url(../images/gNavMin-07.png);
				}
		#gNav.min li:nth-child(7){
			background: url(../images/gNavMin-08_on.png);
			}
			#gNav.min li:nth-child(7):before{
				content: url(../images/gNavMin-08.png);
				}
	#gNav ul{
		position: relative;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-ms-flex-pack: center;
		justify-content: center;
		width: 1080px;
		margin: auto;
		background: url(../images/gNavBg.jpg) center top no-repeat;
		}
	#gNav li{
		display: block;
		position: relative;
		background-repeat: no-repeat;
		background-position: center center;
		list-style: none;
		}
		#gNav li a{
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			font-size: 0;
			}
		#gNav li:before{
			transition: opacity 0.2s ease-out;
			}
		#gNav li:hover:before{
			opacity: 0;
			}
		#gNav li:nth-child(1){
			background: url(../images/gNav-02_on.png);
			}
			#gNav li:nth-child(1):before{
				content: url(../images/gNav-02.png);
				}
		#gNav li:nth-child(2){
			background: url(../images/gNav-03_on.png);
			}
			#gNav li:nth-child(2):before{
				content: url(../images/gNav-03.png);
				}
		#gNav li:nth-child(3){
			background: url(../images/gNav-04_on.png);
			}
			#gNav li:nth-child(3):before{
				content: url(../images/gNav-04.png);
				}
		#gNav li:nth-child(4){
			background: url(../images/gNav-05_on.png);
			}
			#gNav li:nth-child(4):before{
				content: url(../images/gNav-05.png);
				}
		#gNav li:nth-child(5){
			background: url(../images/gNav-06_on.png);
			}
			#gNav li:nth-child(5):before{
				content: url(../images/gNav-06.png);
				}
		#gNav li:nth-child(6){
			background: url(../images/gNav-07_on.png);
			}
			#gNav li:nth-child(6):before{
				content: url(../images/gNav-07.png);
				}

		#gNav li:nth-child(7){
			background: url(../images/gNav-08_on.png);
			}
			#gNav li:nth-child(7):before{
				content: url(../images/gNav-08.png);
				}
#story #gNav {
  position: relative;
  top: 0;
}
		#story #gNav li:nth-child(5){
			background: url(../images/gNav-06_active.png);
			}
			#story #gNav li:nth-child(5):before{
				content: url(../images/gNav-06_active.png);
				}

/* #main{
	background: url(../images/pattern-02.jpg);
	}
	#main article{
		padding: 60px 0;
		} */

[id^="nav_"]{
	position: absolute;
	display: block;
	width: 100px;
	height: 0;
	margin-top: -130px;
	}

#movie{
	padding-top: 5em;
	}
	#movie>div {
		padding: 0 7em;
		}
		#movie .youtube {
			position: relative;
			width: 100%;
			padding-top: 56.25%;
			}
			#movie .youtube iframe {
				position: absolute;
				top: 0;
				right: 0;
				width: 100% !important;
				height: 100% !important;
				}

#bnr{
	padding-top: 5em;
	}

#about{}
	#nav_about{
		margin-top: -60px;
		}
	#about h2{
		margin-top: 0.5em;
		color: #0a5180;
		}
	#about h3{
		margin-top: 1.2em;
		color: #083c66;
		font-size: 2.8rem;
		font-weight: bold;
		line-height: 1.4em;
		}
	#about p{
		margin-top: 1em;
		text-align: justify;
		}
	#about figure{
		overflow: hidden;
		}
		#about figure div{
			float: left;
			width: 140px;
			padding-top: 140px;
			}
			#about figure div:first-child{
				width: 290px;
				margin-right: 10px;
				padding-top: 290px;
				}
			#about figure div:nth-child(n+3){
				margin-top: 10px;
				}
			#about figure div:nth-child(n+5){
				margin-left: 10px;
				}
	#about .wrap{
		display: -ms-flexbox;
		display: flex;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
		-ms-flex-pack: justify;
		justify-content: space-between;
		}
		#about .wrap > div{
			width: calc(100% - 480px);
			}
		#about .wrap > figure{
			width: 440px;
			}
	#about .thumbBox{
		background-size: cover;
		}

#ushi {
	background: url("../images/ushi_pattern.jpg");
	}
	.ushi-btn {
		margin-top: 60px;
		text-align: center;
		}
	.ushi01 {
		margin-bottom: 45px;
		padding-bottom: 60px;
		border-bottom: 1px solid #b1a887;
		}
		.ushi01 .block {
			display: flex;
			justify-content: space-between;
			margin-top: 40px;
			}
		.ushi01 .box {
			width: 470px;
			}
			.ushi01 .box h3 {
				margin-bottom: 25px;
				color: #917f40;
				font-size: 2.4rem;
				font-weight: bold;
				}
		.ushi01 .block:first-child .box {
			width: 480px;
			padding-top: 25px;
			}
			.ushi01 .block:first-child .box div {
				display: flex;
				}
				.ushi01 .block:first-child .box div p {
					width: 320px;
					padding-right: 4px;
					}
				.ushi01 .block:first-child .box div figure {
					padding-top: 40px;
					}
	.ushi02 {
		position: relative;
		margin-bottom: 45px;
		padding-bottom: 80px;
		border-bottom: 1px solid #b1a887;
		}
		.ushi02 .block {
			margin-top: 50px;
			}
			.ushi02 .block ul {
				display: flex;
				justify-content: space-between;
				margin-top: 35px;
				}
				.ushi02 .block ul li {
					list-style: none;
					}
				.ushi02 .block .box {
					display: flex;
					justify-content: space-between;
					margin-top: 30px;
					}
					.ushi02 .block .box p {
						width: 490px;
						padding-top: 40px;
						}
					.ushi02 .block .box div {
						width: 435px;
						}
						.ushi02 .block .box div h4 {
							margin-bottom: 15px;
							font-size: 2rem;
							font-weight: bold;
							}
						.ushi02 .block .box div dt {
							float: left;
							}
						.ushi02 .block .box div dd {
							margin-left: 6em;
							padding-bottom: 5px;
							}
		.ushi02 .ico {
			position: absolute;
			right: 15px;
			bottom: 25px;
			}
	.ushi03 {
		padding-bottom: 60px;
		}
		.ushi03 .block {
			display: flex;
			justify-content: space-between;
			margin-top: 55px;
			}
			.ushi03 .block .box {
				width: 470px;
				}
				.ushi03 .block .box:first-child figure {
					margin-bottom: 35px;
					}
				.ushi03 .block .box:last-child figure {
					margin-top: 35px;
					}

#meisyo{
	background: url(../images/pattern-03.jpg);
	}
	#meisyo header{
		background: url(../images/meisyoHeaderBg.jpg);
		border-top: 10px solid #301709;
		}
		#meisyo header p:before{
			content: url(../images/meisyoTitle.png);
			}
	#meisyo section{}
		#meisyo section:before{
			border-color: #301709;
			}
		#meisyo section span{
			background: #301709;
			}
		#meisyo section h3{
			color: #301709;
			}

#anaba{
	background: url(../images/pattern-04.jpg);
	}
	#anaba header{
		background: url(../images/anabaHeaderBg.jpg);
		border-top: 10px solid #902a19;
		}
		#anaba header p:before{
			content: url(../images/anabaTitle.png);
			}
	#anaba section{}
		#anaba section:before{
			border-color: #902a19;
			}
		#anaba section span{
			background: #902a19;
			}
		#anaba section h3{
			color: #902a19;
			}

#column {
  background: url("../images/column_bg001.png");
}

  #column .column_list {
    display: flex;
    flex-wrap: wrap;
    margin-top: 40px;
  }

  #column .column_list li {
    position: relative;
    width: 310px;
    margin-right: 25px;
    margin-bottom: 70px;
    list-style: none;
  }

  #column .column_list li:nth-child(3n) {
    margin-right: 0;
  }

  #column .column_list dl {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px;
    background:rgba(0,0,0,0.5);
    color: #fff;
  }

  #column .column_list dt {
    margin-bottom: 10px;
    font-size: 2.4rem;
    line-height: 1.2;
    font-weight: bold;
  }

  #column .column_list .detail_btn {
    position: absolute;
    bottom: -15px;
    right: 13px;
  }



#topics{
	background: url(../images/pattern-03.jpg);
	}
	#topics h2{
		text-align: center;
		}
	#topics h3{
		margin: 1.5em auto 0.5em;
		text-align: center;
		font-size: 2.4rem;
		font-weight: bold;
		color: #0a5180;
		}
	#topics h3+div{
		border-top: 1px solid #0a5180;
		}
	#topics h3+div>div:nth-of-type(1){
		display: -ms-flexbox;
		display: flex;
		-ms-flex-flow: wrap row;
		flex-flow: wrap row;
		-ms-flex-pack: justify;
		justify-content: space-between;
		padding: 1em 0 1.5em;
		}
	#topics h3+div>div:nth-of-type(1) figure{
		position: relative;
		width: 480px;
		}
	#topics h3+div>div:nth-of-type(1) div{
		position: relative;
		margin: 1em auto;
		width: 100%;
		}
			#topics h3+div>div:nth-of-type(1) div a{
				position: relative;
				padding-left: 1.2em;
				line-height: 1.6em;
				}
				#topics h3+div>div:nth-of-type(1) div a[target="_blank"]:before{
					position: absolute;
					left: 0;
					top: 0;
					font-family: 'icomoon';
					content: "\e92c";
					}
	#topics figcaption{
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		padding: 0.8em;
		background: rgba(0,0,0,0.8);
		color: #fff;
		font-size: 1.2rem;
		line-height: 1.2em;
		}
	#topics p{
		text-align: justify;
		}
		#topics p+p{
			margin-top: 1em;
			}
		#topics p+dl{
			margin-top: 1em;
			}
			#topics p+dl dt{
				float: left;
				width: 7em;
				padding-left: 5px;
				border-left: 5px solid #0a5180;
				font-weight: bold;
				line-height: 1.2em;
				}
			#topics p+dl dd{
				padding-left: 7em;
				}
	#topics time{
		display: block;
		margin: 1em auto;
		font-size: 1.6rem;
		font-weight: bold;
		}
		#topics time:before{
			content: "実施期間：";
			}
		#topics h3+div>div:nth-of-type(2){
			text-align: center;
			}
	#topics .but{
		padding: 1em 0.5em 1em 10em;
		background: #f2c022;
		color: #000;
		width: 650px;
		position: relative;
		text-align: left;
		line-height: 1.4em;
		box-shadow: 2px 2px 3px rgba(0,0,0,.2);
		}
		#topics .but:hover{
			opacity: 0.8;
			}
		#topics .but span{
			position: absolute;
			top: 50%;
			left: 0;
			width: 9em;
			padding-left: 1.5em;
			margin-top: -0.5em;
			}
		#topics .but svg{
			fill: #000;
			}
	#topics .thumbBox{
		padding-top: 66.66%;
		background-color: rgba(255,255,255,0.6);
		}
		#topics .long{
			background-color: rgba(255,255,255,0.2);
			background-size: cover;
			background-position: 50% 22%;
			}

/* トピックス 1902 豪商のまち松阪 観光交流センター 2019年4月オープン！ */
#days1902{}
	#days1902>figure:nth-of-type(1){
		width: 330px!important;
		}
	#days1902>div{
		width: 600px!important;
		}
	#days1902>figure{}
		#days1902>figure:nth-of-type(2){
			width: 100%!important;
			padding: 1em;
			background: url("../images/topicsBg-01.png");
			}
			#days1902>figure:nth-of-type(2) .thumbBox{
				background: none;
				background-size: contain;
				background-repeat: no-repeat;
				padding-top: 33.33%;
				margin: 0!important;
				}
	#topics .but{
		width:auto;
		padding: 1em 2em 1em 2.5em;
		}
/* ここまで トピックス 1902 */

#outLink{
	background: url(../images/pattern-02.jpg);
	}
	#outLink h2{
		position: relative;
		margin-bottom: 40px;
		padding-bottom: 1.5em;
		text-align: center;
		line-height: 106px;
		overflow: hidden;
		border-bottom: 2px dashed #ada5a1;
		}
		#outLink h2 img{
			vertical-align: middle;
			}
		#outLink h2:before{
			content: url(../images/outLinkLogo.png);
			position: absolute;
			left: 0;
			}
	#outLink h2+p{
		text-align: center;
		}
	#outLink p+div{
		position: relative;
		overflow: hidden;
		margin-top: 40px;
		padding: 30px;
		border: 1px solid #ada5a1;
		}
		#outLink p+div:before{
			content: "";
			position: absolute;
			top: 30px;
			left: 50%;
			height: calc(100% - 60px);
			margin-left: -1px;
			border-left: 2px dashed #ada5a1;
			}
	#outLink ul{
		float: left;
		width: calc(50% - 30px);
		}
	#outLink ul+ul{
		float: right;
		}
	#outLink li{
		height: 100px;
		list-style: none;
		}
	#outLink li+li{
		margin-top: 30px;
		}
	#outLink a{
		position: relative;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-align: center;
		align-items: center;
		line-height: 1.4em;
		}
		#outLink a:hover{
			background: rgba(10,81,128,0.2);
			}
		#outLink a span{
			display: block;
			width: calc(100% - 140px);
			padding: 0 2em;
			}
		#outLink a i{
			position: absolute;
			right: 0.5em;
			top: 50%;
			}
	#outLink figure{
		width: 140px;
		}
		#outLink figure .thumbBox{
			padding-top: 100px;
			}
	#outLink svg{
		width: 1.4em;
		height: 1.4em;
		margin-top: -0.7em;
		fill: #0a5180;
		vertical-align: top;
		opacity: .8;
		}

#footer{
	background: url(../images/pattern-02.jpg);
	}
  .pagetop {
    position: fixed;
    right: 20px;
    bottom: 45px;
  }
	#footer svg{
		width: 1em;
		height: 1em;
		color: #000;
		vertical-align: top;
		}
	#footer li{
		position: relative;
		padding-left: 1.2em;
		line-height: 1em;
		list-style: none;
		}
		#footer li i{
			position: absolute;
			left: 0;
			top: 50%;
			}
		#footer li svg{
			margin-top: -0.5em;
			}

#fNav{
	padding: 30px 0;
	color: #0a5180;
	}
	#fNav > *:nth-of-type(n+2){
		margin-top: 10px;
		}
	#fNav dt{
		position: absolute;
		padding-left: 1.2em;
		color: #083c66;
		font-weight: bold;
		}
		#fNav dt a{
			color: #083c66;
			}
		#fNav dt i{
			position: absolute;
			left: 0;
			top: 50%;
			}
		#fNav dt svg{
			margin-top: -0.5em;
			fill: #083c66;
			opacity: .5;
			}
	#fNav dd{
		padding-left: 10em;
		overflow: hidden;
		}
		#fNav dd span{
			float: left;
			margin: 0 20px 20px 0;
			text-align: left;
			}
			#fNav dd span a{
				display: block;
				}
	#fNav ul{
		float: left;
		}
		#fNav ul+ul{
			margin-left: 3em;
			}
	#fNav li{}
		#fNav li+li{
			margin-top: 1em;
			}
		#fNav li a{
			color: #404040;
			}
		#fNav li svg{
			fill: #0a5180;
			opacity: .5;
			}
	#fNav+div{
		padding: 1em 0;
		background: url(../images/pattern-01.jpg);
		color: #fff;
		}
		#fNav+div ul{
			text-align: center;
			}
		#fNav+div li{
			display: inline-block;
			}
		#fNav+div li+li{
			margin-left: 1em;
			}
		#fNav+div a{
			color: #fff;
			}
		#fNav+div svg{
			fill: #fff;
			opacity: .5;
			}

#copyright{
	position: relative;
	padding: 1em 0;
	text-align: center;
	}
	#copyright:before{
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: url(../images/pattern-01.jpg);
		opacity: .9;
		}
	#copyright p{
		position: relative;
		color: #fff;
		font-size: 1.2rem;
		line-height: 1em;
		}

.wrap{
	width: 980px !important;
	margin: auto !important;
	}

.course{}
	.course p{
		text-align: justify;
		}
	.course header{
		position: relative;
		margin-top: -60px;
		margin-bottom: 40px;
		-webkit-animation: loop 100s infinite linear;
		animation: loop 100s infinite linear;
		}
		.course header:after{
			content: "";
			position: absolute;
			left: 0;
			bottom: -20px;
			width: 100%;
			height: 20px;
			opacity: .12;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&1+1,0+100 */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjElIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(0,0,0,1) 0%, rgba(0,0,0,1) 1%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(0,0,0,1) 1%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,1) 1%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 ); /* IE6-8 */
			}
		@-webkit-keyframes loop {
			0% {background-position: 0 center;}
			100% {background-position: -1984px center;}
			}
		@keyframes loop {
			0% {background-position: 0  center;}
			100% {background-position: -1984px center;}
			}
		.course header .wrap{
			position: relative;
			height: 390px;
			}
		.course header h2{
			display: none;
			}
		.course header p{
			position: absolute;
			left: 0;
			top: 0;
			width: 440px;
			height: 100%;
			padding: 10px 30px;
			background: #fff;
			}
			.course header p:before{
				display: block;
				margin-bottom: 0.5em;
				}
	.course section{
		position: relative;
		min-height: 400px;
		padding: 40px 0 40px 400px;
		}
		.course section:before{
			content: "";
			position: absolute;
			left: 240px;
			top: 320px;
			height: calc(100% - 320px);
			margin-left: -2px;
			border-left: 4px dotted #000;
			}
		.course section:last-child{
			padding-bottom: 0;
			}
			.course section:last-child:before{
				content: none;
				}
			.course section:last-child div+span{
				display: none;
				}
		.course section figure{
			position: absolute;
			top: 0;
			left: 0;
			width: 480px;
			}
			.course section figure .thumbBox{
				padding-top: 320px;
				}
		.course section figure+figure{
			width: 220px;
			top: 160px;
			left: -40px;
			}
			.course section figure+figure .thumbBox{
				padding-top: 100%;
				background-size: cover;
				border-radius: 100%;
				}
		.course section figure+div{
			position: relative;
			padding: 30px;
			background: #fff;
			}
			.course section figure+div span{
				top: 0;
				left: 0;
				width: 6em;
				padding: 0.5em 0;
				font-size: 1.8rem;
				}
		.course section div+span{
			left: 240px;
			top: 340px;
			width: 8em;
			margin-left: -4em;
			padding: 0.5em;
			border-radius: 2em;
			}
		.course section span{
			position: absolute;
			display: block;
			background: #000;
			color: #fff;
			font-weight: bold;
			line-height: 1em;
			text-align: center;
			}
		.course section h3{
			margin-top: 1em;
			font-size: 2.4rem;
			font-weight: bold;
			line-height: 1.4em;
			}
		.course section p{
			margin-top: 1em;
			}
		.course section dl{
			margin-top: 1.5em;
			}
		.course section dt{
			padding-left: 5px;
			border-left: 5px solid #0a5180;
			font-weight: bold;
			line-height: 1.2em;
			}
		.course section dd{
			display: -ms-flexbox;
			display: flex;
			-ms-flex-flow: row wrap;
			flex-flow: row wrap;
			-ms-flex-pack: start;
			justify-content: flex-start;
			}
		.course .but{
			margin: 10px 10px 0 0;
			padding-right: 0.5em;
			border: 2px solid #0a5180;
			background: #fff;
			color: #0a5180;
			}
			.course .but i{
				margin-left: 1em;
				}
			.course .but svg{
				fill: #0a5180;
				opacity: 1;
				}
			.course .but:hover{
				background: #0a5180;
				color: #fff;
				}
				.course .but:hover svg{
					fill: #fff;
					}



.thumb{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	height: calc(100% + 0px);
	opacity: 0 !important;
	-ms-filter: "alpha(opacity=0)" !important;
	}
	.thumbBox{
		position: relative;
		display: block;
		width: 100%;
		margin: 0;
		padding: 100% 0 0 0;
		overflow: hidden;
		background-color: #ccc;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		transition: opacity 0.5s ease-out;
		}
	.thumbBox.wide{}
	.thumbBox.long{
		background-size: contain;
		}

.center{
	text-align: center;
	}

.none{
	display: none;
	}


/* ie */
@media all and (-ms-high-contrast: none){}


/* STORY */
.story ul li {
  list-style: none;
}

.story .story_inner {
  width: 980px;
  margin: 0 auto;
}

.story .story_main_ttl {
  margin-bottom: 65px;
  text-align: center;
}

.story .topicpath {
  padding: 40px 0;
  background: url("../images/story/common/main_bg001.png") ;
  font-size: 1.5rem;
}
  .story .topicpath ul {
    display: flex;
    width: 980px;
    margin: 0 auto;
  }
  .story .topicpath ul li {
    margin-right: 10px;
  }
  .story .topicpath ul li a {
    margin-right: 10px;
    color: #000;
    text-decoration: underline;
  }
  .story .topicpath ul li a:hover {
    text-decoration: none;
  }

.story .top_ttl {
  padding-bottom: 50px;
  background: url("../images/story/common/main_bg001.png") ;
  text-align: center;
}

.story .lnav {
  padding-bottom: 55px;
  background: url("../images/story/common/main_bg001.png") ;
}
  .story .lnav ul {
    display: flex;
    justify-content: space-between;
    width: 980px;
    margin: 0 auto;
  }

.story .story_sec {
  padding: 140px 0 305px;
  background: url("../images/story/common/story_bg001.png");
}
  .story .story_sec .story_ttl {
    margin-bottom: 40px;
    padding: 10px 10px 5px;
    background-color: #11527e;
    font-size: 3.6rem;
    line-height: 1.5;
    font-weight: normal;
    text-align: center;
    color: #fff;
  }
  .story .story_sec .story_box {
    position: relative;
  }
  .story .story_sec .story_box dl {
    position: absolute;
    width: 784px;
    padding: 35px 40px;
    background:rgba(255,255,255,0.9);
  }
  .story .story_sec .story_box dl dt {
    margin-bottom: 30px;
    color: #917f40;
    font-size: 2.4rem;
    font-weight: bold;
  }
  .story .story_sec .story_box dl dd {
    font-size: 1.5rem;
  }
  .story .story_sec .txt_r dl {
    right: -35px;
    top: 460px;
  }
  .story .story_sec .txt_l dl {
    left: -35px;
    top: 460px;
  }


.story .photo_sec {
  padding: 150px 0 130px;
  background: url("../images/story/common/photo_bg001.png");
}
  .story .photo_sec ul {
    display: flex;
    flex-wrap: wrap;
  }
  .story .photo_sec ul li {
    width: 467px;
    margin-right: 45px;
    margin-bottom: 80px;
  }
  .story .photo_sec ul li:nth-child(2n) {
    margin-right: 0;
  }
  .story .photo_sec figcaption {
    margin-top: 15px;
    font-size: 1.5rem;
  }

.story .point_sec {
  padding-top: 140px;
  background: url("../images/story/common/point_bg001.png");
}
.story .point_sec .point_box {
  position: relative;
  margin-bottom: 150px;
}
.story .point_sec .point_box figure {
  position: absolute;
  top: 50px;
  right: 0;
  text-align: right;
}
.story .point_sec .point_box figcaption {
  margin-top: 10px;
}
.story .point_sec .point_box p {
  width: 700px;
  padding: 50px 150px 50px 45px;
  background-color: #fff;
  font-size: 1.5rem;
}
.story .point_sec .point_box p span {
  text-align: right;
  margin-top: 1em;
  display: block;
}
.story .point_sec .spot_ttl {
  margin-left: 20px;
  margin-bottom: 50px;
  padding-left: 20px;
  border-left: 10px solid #917f40;
}
.story .point_sec .spot_item {
  margin-bottom: 100px;
}
.story .point_sec .spot_item .item_ttl {
  margin-bottom: 40px;
  padding: 18px 30px 25px;
  background: url("../images/story/common/point_ttl_bg001.png") no-repeat center top;
  color: #fff;
  font-size: 2.4rem;
}
.story .point_sec .spot_item figure {
  margin-bottom: 20px;
  text-align: center;
}
.story .point_sec .spot_item figcaption {
  margin-top: 30px;
  font-size: 2.0rem;
  font-weight: bold;
  text-align: left;
}
.story .point_sec .spot_item .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.story .point_sec .spot_item table {
  width: 750px;
  font-size: 1.5rem;
}
.story .point_sec .spot_item table tr {
  border-bottom: 1px solid #8f7c3c;
}
.story .point_sec .spot_item table th {
  width: 205px;
  padding: 20px 10px;
  text-align: left;
  vertical-align: top;
  font-weight: bold;
}
.story .point_sec .spot_item table td {
  padding: 20px 10px;
}

.story .point_sec .spot_item .item_btn {
  width: 205px;
}
.story .point_sec .spot_item .item_btn li {
  margin-bottom: 10px;
}
.story .point_sec .spot_item .item_btn li:last-child {
  margin-bottom: 0;
}


.story_shi .story_sec .story_box_01 {
  margin-bottom: 360px;
}
.story_shi .story_sec .story_box_02 {
  margin-bottom: 250px;
}
.story_shi .story_sec .story_box_03 {
  margin-bottom: 310px;
}
.story_shi .story_sec .story_box_04 {
  margin-bottom: 270px;
}
.story_shi .story_sec .story_box_05 {
  margin-bottom: 225px;
}
.story_shi .story_sec .story_box_06 {
  margin-bottom: 360px;
}
.story_shi .story_sec .story_box_07 {
  margin-bottom: 200px;
}
.story_shi .story_sec .story_box_08 {
  margin-bottom: 215px;
}
.story_shi .story_sec .story_box_09 {
  margin-bottom: 150px;
}


.story_fu .story_sec .story_box_01 {
  margin-bottom: 240px;
}
.story_fu .story_sec .story_box_02 {
  margin-bottom: 250px;
}
.story_fu .story_sec .story_box_03 {
  margin-bottom: 360px;
}
.story_fu .story_sec .story_box_04 {
  margin-bottom: 250px;
}
.story_fu .story_sec .story_box_05 {
  margin-bottom: 280px;
}
.story_fu .story_sec .story_box_06 {
  margin-bottom: 250px;
}

.story_ma .story_sec .story_box_01 {
  margin-bottom: 260px;
}
.story_ma .story_sec .story_box_02 {
  margin-bottom: 280px;
}
.story_ma .story_sec .story_box_03 {
  margin-bottom: 250px;
}
.story_ma .story_sec .story_box_04 {
  margin-bottom: 270px;
}
.story_ma .story_sec .story_box_05 {
  margin-bottom: 250px;
}
.story_ma .story_sec .story_box_06 {
  margin-bottom: 200px;
}

.story_so .story_sec .story_box_01 {
  margin-bottom: 280px;
}
.story_so .story_sec .story_box_02 {
  margin-bottom: 300px;
}
.story_so .story_sec .story_box_03 {
  margin-bottom: 230px;
}
.story_so .story_sec .story_box_04 {
  margin-bottom: 220px;
}
.story_so .story_sec .story_box_05 {
  margin-bottom: 340px;
}
.story_so .story_sec .story_box_06 {
  margin-bottom: 280px;
}

.story_re .story_sec .story_box_01 {
  margin-bottom: 250px;
}
.story_re .story_sec .story_box_02 {
  margin-bottom: 260px;
}
.story_re .story_sec .story_box_03 {
  margin-bottom: 290px;
}
.story_re .story_sec .story_box_04 {
  margin-bottom: 300px;
}
.story_re .story_sec .story_box_05 {
  margin-bottom: 320px;
}

.story_ho .story_sec .story_box_01 {
  margin-bottom: 330px;
}
.story_ho .story_sec .story_box_02 {
  margin-bottom: 250px;
}
.story_ho .story_sec .story_box_03 {
  margin-bottom: 330px;
}
.story_ho .story_sec .story_box_04 {
  margin-bottom: 340px;
}
.story_ho .story_sec .story_box_05 {
  margin-bottom: 320px;
}
.story_ho .story_sec .story_box_06 {
  margin-bottom: 350px;
}