﻿@charset "utf-8"; /* CSS Document */
/****************reset*******************/


body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,p {
    padding:0;
    margin:0;
    width:auto;
    font-size:100%;
    line-height:100%;
    font-weight:normal;
    box-sizing:border-box;
}

ul,li {
    list-style:none;
    padding:0;
    margin:0;
    font-size:100%;
    line-height:100%;
    font-weight:normal;
}
a img {
    border:none;
}
img {
    line-height:100%;
    font-size:0px;
    -webkit-backface-visibility:hidden;
}
a,button {
    text-decoration:none;
    transition:.4s;
    -webkit-transition:.4s;
}
a,button {
}

/****************clearfix*******************/
.clearfix {
    min-height:1px;
    overflow-x:hidden;
}

* html .clearfix {
    height:1px;
    /*\*/
    /*/ height:auto; overflow:hidden; /**/
}

p,li,h3,h4,a,strong,dd,dt,dl,td,th {
    color:#fff;
    letter-spacing: .075em;
}
h2.contents_ttl{
	font-family: "Noto Serif JP", serif;
	position:absolute;
	bottom:-4vw;
	right:2vw;
	font-size:10vw;
	color:#fff;
	opacity:.16;
	z-index:2;
}
h2.contents_ttl2{
	font-family: "Noto Serif JP", serif;
	position:absolute;
	top:-8vw;
	left:2vw;
	font-size:10vw;
	color:#fff;
	opacity:.16;
	z-index:2;
}
h3{
	font-size:58px;
	font-family: "Noto Serif JP", serif;
	font-weight: 300;
	font-style: normal;
}
h3 span{
	font-size:36px;
}
h4{
	font-size:48px;
	font-family: "Noto Serif JP", serif;
}

body {
	font-family:"dnp-shuei-gothic-kin-std","Noto Sans JP","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
    background: #001521;
    line-height:180%;
    font-size:14px;
    margin: 0 auto;
    position: relative;
	overflow-x:hidden;
}
.inner1440{
	width:90%;
	max-width: 1440px;
	margin: 0 auto;
	position: relative;
}
.relative {
    position:relative;
    overflow:auto;
}
.sp {
	display:none!important;
}
.tablet {
	display:none;
}
.txt_center{
	text-align:center;
}

/* ふわっjs 　*/
.fadeUpTrigger,.fadeUpTrigger2{
	opacity: 0;
}

.fadeUp{
	animation-name:fadeUpAnime;
	animation-duration:1.5s;
	animation-fill-mode:forwards;
	opacity:0;
}
.fadeUp2{
	animation-name:fadeUpAnime2;
	animation-duration:2.5s;
	animation-fill-mode:forwards;
	opacity:0;
}

@keyframes fadeUpAnime{
	from {
		opacity: 0;
		transform: translateY(100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes fadeUpAnime2{
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/* ふわっjs 　*/

/* メインイメージ */
.head_logo{
    width: 302px;
    max-width: 33%;
    position: absolute;
    top: 4vw;
    left: 4vw;
    z-index: 2;
}
.main_slide{
	width:100%;
	height:100vh;
	overflow-y:hidden;
}
.main_slide .slide_img{
	width:100vw;
	height:100vh;
}
.main_slide .slide_img.slick-animation{
	width:100vw;
	height:100vh;
	animation: fadezoom 12s 0s forwards;
}
.main_slide .slide_img1{
	background:url("../img/main.jpg") center no-repeat;
}
.main_slide .slide_img2{
	background:url("../img/main2.jpg") center no-repeat;
}
.main_slide .slide_img3{
	background:url("../img/main3.jpg") center no-repeat;
}
.main_slide .slide_img4{
	background:url("../img/main4.jpg") center no-repeat;
}
@keyframes fadezoom {
  0% {
    background-size:100vw;
  }

  100% {
    background-size:110vw;
  }
}
/* メインイメージ */

.contents_txt{
	width:64%;
	max-width:900px;
	margin:86px auto 0;
}
.contents_txt img{
	width:100%;
	height:auto;
}

.news {
	width:96%;
	margin:0 auto;
    padding: 10vh 0 22vh;
}
.news li{
	padding:48px 8px;
	margin-bottom:32px;
	border-bottom:1px solid #fff;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.news li:last-child{
	margin-bottom:0;
}
.news li p{
	width:calc( 100% - 120px );
    line-height: 2;
}
.news li p.days{
	width:120px;
}

.outline{
	padding-bottom:16vh;
	position:relative;
	background:linear-gradient(#000000,#001521);
	position:relative;
}
.outline .days{
	width:60%;
	margin:0 auto;
    position: absolute;
    top: -3.0vw;
    left: 20%;
}
.outline .outline_img{
	width:820px;
	max-width:64%;
    padding: 9vw 0 0;
}

.about{
	display:flex;
	flex-wrap:wrap;
	position:relative;
}
.about_img{
	width:50%;
	background:url("../img/about.jpg") no-repeat center;
	background-size:cover;
}
.about_txt{
	width:50%;
	padding:10% 4%;
}
.about_txt h3{
	margin-bottom:48px;
}
.about_txt p{
	font-size:19px;
	line-height:2.4;
}


/*promo*/
.promo{
	height:33vw;
	text-align:center;
    position: relative;
    z-index: 1;
    background-color: #000;
    overflow: hidden;
}
.promo:before{
	content:"";
	background:#0005;
	position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	width:100%;
	height:100%;
	z-index:2;
}
.promo .start{
	z-index:2;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.promo img{
	width:150px;
}
.promo .video_area{
	width:100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.promo video{
    width: 100%;
    aspect-ratio:100/34;
    height: auto;
    pointer-events: none;
    -o-object-fit: cover;
    object-fit: cover;
}
/*promo*/

.price{
	padding:15.6vh 0;
	background:#000;
	text-align:center;
	position:relative;
}
.price h3{
	letter-spacing:0.3em;
}
.price img{
	width:960px;
	max-width:90%;
	margin:6vw auto 0;
}

.map{
	padding:10vh 0 20vh;
}
.map_img{
	width:960px;
	max-width:90%;
    margin: 0 auto 16vw;
}

.map_bg{
	width:76%;
	height:60vh;
}
.map_bg:before{
	animation-duration:5s;
	animation:blink 1.75s ease-in-out infinite alternate;
}
@keyframes blink{
    0% {opacity:0.35;}
    100% {opacity:1;}
}

.map_contents2 .map_bg{
	margin-left:24%;
	position:relative;
}
.bg1:before{
	content:"";
	width:64vw;
	height:52vh;
	background:url("../img/map1.svg") no-repeat;
	background-size:contain;
	position:absolute;
	left:-2%;
	top:-6vw;
}
.bg2:before{
	content:"";
	width:64vw;
	height:52vh;
	background:url("../img/map2.svg") no-repeat right;
	background-size:contain;
	position:absolute;
	right:-12vw;
	top:-10vw;
}
.bg4:before{
    content: "";
    width: 72vw;
    height: 40vh;
    background: url(../img/map4.svg) no-repeat right;
    background-size: contain;
    position: absolute;
    right: -12vw;
    top: -12vw;
}
.bg5:before{
    content: "";
    width: 48vw;
    height: 52vh;
    background: url(../img/map5.svg) no-repeat;
    background-size: contain;
    position: absolute;
    left: -2%;
    top: -6vw;
}
.bg6:before{
    content: "";
    width: 72vw;
    height: 40vh;
    background: url(../img/map6.svg) no-repeat right;
    background-size: contain;
    position: absolute;
    right: -12vw;
    top: -12vw;
    opacity: .5;
}
.bg7:before{
    content: "";
    width: 36vw;
    height: 40vh;
    background: url(../img/map7.svg) no-repeat;
    background-size: contain;
    position: absolute;
    left: -2vw;
    top: -8vw;
}
.bg8:before{
    content: "";
    width: 48vw;
    height: 38vh;
    background: url(../img/map8.svg) no-repeat right;
    background-size: contain;
    position: absolute;
    right: -2vw;
    top: -12vw;
}
.map_contents{
	margin-bottom:28vw;
	position:relative;
}
.map_contents:last-child{
	margin-bottom:0;
}
.map_contents_ttl{
    font-size: 14vw;
    font-family: "Noto Serif JP", serif;
    color: #fff;
    opacity: .16;
    position: absolute;
    bottom: -5.6vw;
    line-height: 1;
}
.map_contents_ttl{
    font-size: 13vw;
    font-family: "Noto Serif JP", serif;
    color: #fff;
    opacity: .16;
    position: absolute;
    bottom: -5.2vw;
    line-height: 1;
}
.map_contents1 .map_contents_ttl{
	left:2.4vw;
}
.map_contents2 .map_contents_ttl{
	right:2.4vw;
}
.map_txt{
	width:50%;
	padding:4%;
	background:#001521;
	position:absolute;
	bottom:-14vw;
}
.map_contents1 .map_txt{
	left:50%;
}
.map_txt h4{
	margin-bottom:32px;
}
.map_txt p{
	font-size:17px;
	line-height:2;
}

.access {
	margin:20vw auto 0;
	position:relative;
}
.access iframe{
	width:100%;
}
.access p{
	width:900px;
	max-width:90%;
	margin:64px auto 0;
	line-height:2;
	font-size:16px;
}

footer {
	width:1000px;
	max-width:90%;
	margin:18vw auto 0;
}
footer .ft_logo{
	width:300px;
	margin-bottom:60px;
}
footer p{
	line-height:2;
}
footer p.copy{
	margin:8vw auto 10vw;
}
@media all and (max-width:1024px){
	/*promo*/
	.promo{
		height:56vw;
	}
	.promo .video_area{
		width:100%;
	}
	.promo video{
        aspect-ratio: 100 / 77;
	}
	/*movie*/
}
@media all and (max-width:640px){
	.pc{display:none!important;}
	.sp{display:block!important;}
	.inner1440{
		width:90%;
		overflow:hidden;
	}
	
	h2.contents_ttl{
		font-size: 13.6vw;
        bottom: -6vw;
	}
	h2.contents_ttl2{
		font-size: 13.6vw;
        top: -11.2vw;
	}
	h3{
		font-size:9.6vw;
	}
	h3 span{
		font-size:6vw;
	}
	h4{
		font-size:8vw;
	}
	/* メインイメージ */
	.main_slide{
    	height:50vh;
	}
	.main_slide .slide_img.slick-animation{
		width:100vw;
		height:50vh;
	}
	@keyframes fadezoom {
	  0% {
		background-size:185vw;
	  }

	  100% {
		background-size:210vw;
	  }
	}
	/* メインイメージ */
	.news{
		padding:4.8vh 0 10vh;
	}
	.news li{
		padding:4vh 8px;
        margin-bottom: 1.6vh;
	}
	.outline{
		padding-bottom: 8vh;
	}
	.outline .days{
		width:90%;
		top: -4vw;
		left:5%;
	}
	.outline .outline_img{
		width:80%;
    	max-width:none;
	}

	.about_img{
		width:100%;
		height:44vh;
	}
	.about_txt{
		width:100%;
	    padding: 7vh 4%;
	}
	.about_txt h3{
		margin-bottom:3vh;
	}
	.about_txt p{
		font-size:3.8vw;
	}
	
	
/*promo*/
	.promo{
		height:72vw;
		margin-top:10vh;
	}
	.promo img{
		width: 27vw;
	}
	.promo video{
        width: 100%;
        aspect-ratio: 100 / 72;
	}
/*promo*/
	
	.price{
		padding:12vh 0;
	}
	.price img{
		width:75%;
		margin-top:6vh;
	}
	
	.map_bg{
		width:100%;
		height:40vh;
	}
	.map_txt{
		position:relative;
		width:100%;
	}
	.map_txt h4{
		margin-bottom:4vw;
	}
	.map_txt p{
		font-size:3.5vw;
	}
	.map_contents1 .map_txt{
		left:auto;
	}
	.map_contents_ttl{
		bottom:auto;
		top:37vh;
	}
	.map_contents2 .map_bg{
		margin-left:0;
	
	}
	.bg1:before{
		width:88vw;
		height:24vh;
	}
	.bg2:before{
		width:88vw;
		height:16vh;
	}
	.bg4:before{
		width:88vw;
		height:24vh;
	}
	.bg5:before{
		width:88vw;
		height:28vh;
	}
	.bg6:before{
 	   width: 100vw;
 	   height: 20vh;
	}
	.bg7:before{
		width: 72vw;
        height: 23vh;
	}
	.bg8:before{
        width: 72vw;
        height: 23vh;
        top: -16vw;
	}
	
	.access iframe{
		height:44vh;
	}
	.access p{
    	max-width: 92%;
    	margin:7.2vw auto 0;
		font-size:3.5vw;
	}
	
	footer .ft_logo{
		width:60%;
		margin-bottom:4vh;
	}
	footer p.copy{
		margin:8vh auto 10vh;
	}
}