/* Home Pc */


/*====== 共通 =====*/

.btnDown{
	display: block; width: 40px; height: 40px;  border-radius: 50%; background-color: #248471; position: absolute;
	left: 0; right: 0; bottom: -4vh; margin: auto; z-index: 5; transition: all .3s ease-in;
	animation: downOpa-move 1s forwards 3s; opacity: 0; -webkit-opacity: 0;
}

.btnDown i{
	font-size: 16px; height: 16px; position: absolute;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	top: 0; left: 0; right: 0; bottom: 0; margin: auto; color: #fff;
}

.btnDown:hover{animation: down-move 1s linear infinite;}

@keyframes down-move {
	0% {
		transform: translateY(0);
	}
	
	25% {
		transform: translateY(5px);
	}
	
	50% {
		transform: translateY(0);
	}
	
	75% {
		transform: translateY(5px);
	}
	
	100% {
		transform: translateY(0);
	}
}

@keyframes downOpa-move {
	from {
		opacity: 0;
		-webkit-opacity: 0;
	}

	to {
		opacity: 1;
		-webkit-opacity: 1;
	}
}


/*====== キービジュアル =====*/

#keyvisual{
	width: 100%; height: 100vh; position: relative; margin-bottom: 0vh;
	animation: height-move 1s forwards 1s;
}

#keyvisual #kv1{
	width: 100%; height: 100vh; background-image: url("/_common/img/kv/kv_bg3.jpg?3");
	background-position: center; background-repeat: no-repeat; background-size: cover;
	animation: height-move 1s forwards 2s;
}

@keyframes height-move {
	from {
		height: 100vh;
		margin-bottom: 0vh;
	}

	to {
		height: 95vh;
		margin-bottom: 5vh;
	}
}

#keyvisual #kv1 .catchcopy{
	width: 50%; height: auto; position:absolute; top: 30%; left: 0; right: 0; bottom: unset !important; margin: auto;
	transform: scale(0); animation: scale-move 3s forwards 1s;
}

@keyframes scale-move {
	from {
		transform: scale(0);
	}

	to {
		transform: scale(1);
	}
}

#keyvisual .bg_mountain{
	width: 100%; height: auto; position:absolute; top: unset; left: 0; right: 0; bottom: 0; margin: auto;
	transform: translateY(200px); animation: mountain-move 1s forwards 2s;
}

@keyframes mountain-move {
	from {
		transform: translateY(200px);
	}

	to {
		transform: translateY(0);
	}
}

/*====== h1 h2 h3 =====*/

h1 {
	font-size: 50px; line-height: 50px; text-align: center;
	margin: 0 auto 70px;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
	position: relative; overflow: visible;
}
h1 span {
	font-family: fot-tsukuardgothic-std, sans-serif !important; font-weight: 700!important; 
}



/*====== SEC1 =====*/

#sec01{padding: 125px 0 133px;}

#sec01 h1 {
	line-height: 1.4;
}

#sec01 .top_catchcopy{
	font-family: fot-tsukuardgothic-std, sans-serif !important; font-weight: 700; font-size: 50px; line-height: 70px; text-align: center;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
	margin: 0 auto; position: relative; overflow: visible;
}
#sec01 .top_catchcopy img{
	display: block; width: 82px; height: 82px; position: absolute; top: -34px; right: -32px;
	left: unset;
    bottom: unset;
}

#sec01 .top_catchcopy_eng{
	font-family: 'Poppins', sans-serif !important; font-weight: 600; font-size: 20px; color: #16695f; margin: 40px auto 48px;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}

#sec01 .bg_snowmountain {
    display: block;
    position: absolute;
    width: 348px;
    height: 79px;
    right: 3%;
    left: unset;
    top: 318px;
    bottom: unset;
}
.sec00Box {width: 80%; margin: 20px auto 20px; height: 560px;}
.sec00Box img {width: 100%; border-radius: 20px;}
.sec00Box h2 {font-weight: bold!important;}
.sec01Box{width: 100%; overflow: hidden; position: relative;}

h2.sec00 {font-weight: bold!important;}

path.sec01BoxBg{
	display: block; position: absolute; left: 0; bottom: 80px;
	width: 96%; height: 50%; border-radius: 0 20px 20px 0; background-color: #f7f8f5;
}

.sec01Box img{
	float: left; position: relative !important; width: 66% !important; border-radius: 20px; border: 10px #fff solid;
}


.sec01Box p{
	display: block;
    float: right;
    width: 30%;
    padding-right: 5%;
    padding-right: 6%;
    font-weight: 400;
    font-size: 16px;
    line-height: 40px;
    padding-top: 8%;
    text-align: left;
}


.bg_sec01_02{
	display: block;
    position: absolute;
    width: 20%;
    height: auto;
    bottom: 2%;
    right: 8%;
    top: unset;
    left: unset;
}

/*====== SEC2 =====*/

#sec02 .bg_snowmountain {
    display: block;
    position: absolute;
    width: 348px;
    height: 79px;
    left: 3%;
    right: unset;
    top: 23px;
    bottom: unset;
}
#sec02 h2 { margin: 0 auto!important;}
#sec02 h2 span {font-family: fot-tsukuardgothic-std, sans-serif !important; color: #000!important; font-weight: 700; font-size: 24px; margin: 10px auto!important;}

#sec02 h4{
	margin: 50px auto 0px; overflow: visible; position: relative;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}
#sec02 h5 span,
#sec02 h4 span{
	display: block;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}
#sec02 h4 span {color: #16695f; font-family: 'Poppins', sans-serif !important; font-weight: 600; font-size: 40px; margin: 0 auto 30px;}
#sec02 h5 {margin: 0 auto 50px!important;}
#sec02 h5 span {font-family: fot-tsukuardgothic-std, sans-serif !important; font-weight: 700; font-size: 24px; margin: 0 auto;}

#sec02 h4.white span{color: #fff !important;}

.sec02Box{
	float: left; width: 50%; height: 567px; background-position: center; background-repeat: no-repeat;
	background-size: cover; overflow: hidden; padding-top: 40px; box-sizing: border-box;
}

.sec02Style01{background-image: url("/_common/img/home/img02_bg_style01.jpg");}
.sec02Style02{background-image: url("/_common/img/home/img02_bg_style02.jpg");}
.sec02Style03{background-image: url("/_common/img/home/img02_bg_style03.jpg");}
.sec02Style04{background-image: url("/_common/img/home/img02_bg_style04.jpg");}
.sec02Style05{background-image: url("/_common/img/home/img02_bg_style05_2.jpg");}
.sec02Style06{background-image: url("/_common/img/home/img02_bg_style06.jpg?20230101");
	padding-top: 40px; box-sizing: border-box;
}



.sec02Box h3.sec02h3 { color: #fff; margin: 0px auto 6px!important;}
.sec02Box h3 span {font-size: 20px; margin: 0px auto 6px!important;}
.sec02BoxTit1{
	margin: 0px auto 6px!important; display: block; position: relative; overflow: visible;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}

.sec02BoxTit1{color: #fff!important;}
.sec02BoxTit1 span {display: block; font-family: 'Poppins', sans-serif !important; font-weight: 600;  color: #fff!important; text-align: center; font-size: 26px; margin: 25px auto 0px!important;}
.sec02BoxTit1 span:nth-of-type(1){margin: 25px auto 0px!important; font-size: 24px;}
.sec02BoxTit1 span:nth-of-type(2){margin: 5px auto 25px!important; font-size: 30px;}

.sec02BoxTit1:before{left: -70px; width: 25px; height: 27px;}
.sec02BoxTit1:after{right: -70px; width: 25px; height: 27px;}
.sec02BoxTit1:before{
	display: block; position: absolute; top: 5px; content: ""; background-image: url("/_common/img/common/imgStyles01.png"); 
	background-position: center; background-repeat: no-repeat; background-size: cover;
}
.sec02BoxTit1:after{
	display: block; position: absolute; top: 5px; content: ""; background-image: url("/_common/img/common/imgStyles02.png"); 
	background-position: center; background-repeat: no-repeat; background-size: cover;
}

.sec02BoxTit2 { 
		display: block; position: relative; overflow: visible;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
	font-size: 26px; font-weight: 700; color: #fff; text-align: center; margin: 0px auto 30px;}


.sec02Box p{
	display: block; max-width: 90%; text-align: center;
	font-size: 16px; line-height: 34px; margin: 0 auto; color: #fff;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}

.sec02_subtit {
	display: block; max-width: 90%; text-align: center;
	font-size: 16px; line-height: 34px; margin: -20px auto 30px;
}

.sec02Box .image_circles{
	display: flex; justify-content: space-evenly; flex-wrap: wrap; width: 85%; margin: 25px auto 0;
}
.sec02Box .image_circles .img_styles{
	display: block;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}
.sec02Box .image_circles .img_styles img{
	display: block; position: relative !important; border: 3px #fff solid; border-radius: 50%; width: 98px; height: 98px;
	box-shadow: 3.716px 3.346px 5px 0px rgba(0, 0, 0, 0.3);
	transition: all .3s ease-in;
}
.sec02Box .image_circles .img_styles:hover{cursor: pointer;}
.sec02Box .image_circles .img_styles:hover img{transform: scale(1.1);}

.sec02Box .image_circles .img_styles span{display: block; font-size: 16px; color: #fff; margin-top: 12px; text-align: center; line-height: 1.4;}

.br1100, .br1005{display: none;}

@media screen and (max-width:1250px) { 
	.sec02Box .image_circles{width: 90%;}
	.sec02Box .image_circles .img_styles img{width: 75px; height: 75px;}
	.sec02Box .image_circles .img_styles span{font-size: 12px;}
}

@media screen and (max-width:1100px) { 
	.br1100{display: block;}
}

@media screen and (max-width:1100px) { 
	.br1005{display: block;}
}


/*====== SEC3 =====*/

#sec03{
	padding: 50px 0 95px; background-image: url("/_common/img/home/img03_bg.jpg"); background-repeat: no-repeat;
	background-position: center; background-size: cover;
}

.sec03imgBox{
	float: left; width: 544px; height: 396px; border-radius: 10px;
	background-image: url("/_common/img/home/bg_pattern01.jpg");
	background-repeat: repeat; background-size: 128px 128px;
	position: relative;
}

.sec03imgBoxInner{
	display: flex;
    float: left;
    align-content: space-between;
    flex-wrap: wrap;
    margin: 25px 25px 25px 35px;
    height: 348px;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
}
.sec03imgBoxInner .sec03hours{
	display: flex;
    align-items: center;
    justify-content: space-between;
    height: fit-content;
    height: -ms-fit-content;
    height: -moz-fit-content;
    height: -webkit-fit-content;
    height: -o-fit-content;
    width: 254px;
}

.sec03imgBoxInner .sec03hours div:nth-of-type(1){
	position: relative; width: 114px; height: 110px; border-radius: 50%; background-color: #333;
}
.sec03imgBoxInner .sec03hours div:nth-of-type(1) span{
	display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; 
	font-size: 18px; font-weight: 600; color: #fff; 
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}

.sec03imgBoxInner .sec03hours div:nth-of-type(2){
	width: 113px; height: 63px; background-image: url("/_common/img/home/img_arrow.png");
	background-repeat: no-repeat; background-size: cover; position: relative;
}
.sec03imgBoxInner .sec03hours div:nth-of-type(2) span{
	display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; 
	font-size: 16px; font-weight: 600; color: #fff; 
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}

.sec03imgBox img{
	position: absolute;
    width: 215px;
    height: 256px;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 15px;
    left: unset;
}

.sec03info{
	float: left;
    width: calc(100% - 550px);
    padding: 15px 0 0 45px;
}

.sec03info h5.accessTitle i, .sec03info h5.accessTitle span{color: #fff;}

.accessBody p{color: #fff;}


/*====== SEC4 =====*/

#sec04{
	padding: 50px 0 95px;
}


/*====== SEC5 =====*/

#sec05{
	padding: 100px 0 155px; background-color: #f7f8f5;
}


.snsTitle{
	position: relative; overflow: visible; width: calc(100% - 100px); height: 50px; padding-bottom: 10px; margin: 0 80px 0 20px;
	background-image: url("/_common/img/home/img05_sns_title_bg.png");
	background-repeat: repeat-x;
	background-position: left bottom;
	background-size: 50px 50px;
	margin-bottom: 45px;
}

.snsTitle:before{
	display: block; position: absolute; content: ""; width: 20px; height: 50px; bottom: 0; left: -20px;
	background-image: url("/_common/img/home/img05_sns_title_bg_head.png"); background-repeat: no-repeat;
}

.snsInsta:after{
	display: block; position: absolute; content: ""; width: 80px; height: 50px; bottom: 0; right: -80px;
	background-image: url("/_common/img/home/img05_sns_title_bg_instagram.png"); background-repeat: no-repeat;
}

.snsTwitter:after{
	display: block; position: absolute; content: ""; width: 80px; height: 50px; bottom: 0; right: -80px;
	background-image: url("/_common/img/home/img05_sns_title_bg_twitter.png"); background-repeat: no-repeat;
}

.snsFacebook:after{
	display: block; position: absolute; content: ""; width: 80px; height: 50px; bottom: 0; right: -80px;
	background-image: url("/_common/img/home/img05_sns_title_bg_facebook.png"); background-repeat: no-repeat;
}


.snsTitle span{font-family: 'Poppins', sans-serif !important; font-weight: 600; font-size: 30px;}

.snsLeft, .snsRight{width: 45%;}
.snsLeft{float: left;}
.snsRight{float: right;}


.gallery{
	width: 100%; overflow: hidden; margin-bottom: 60px;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}
.gallery img{
	position: relative;
    float: left;
    display: block;
    width: calc((100% - 15px) / 4);
    border-left: 5px #fff solid;
}
.gallery img:first-of-type{border: none !important;}

.snsBody{
	width: 90%; background-color: #fff; border-radius: 20px; height: 520px; overflow-x: hidden; overflow-y: auto;
	margin: 0 auto;
}
.snsBody img{position: relative;}


.top_catchcopy:before {
    display: block;
    position: absolute;
    content: "";
    background-image: url(/_common/img/home/stars.png);
    width: 82px;
    height: 82px;
    background-repeat: no-repeat;
    background-size: cover;
    right: 0;
    top: -40px;
}


/************************/
/*
/*     youtube用        */
/*                      */
/************************/

.youtube{
    position:relative;
    width:100%;
    height:0;
    padding-top:75%;
	
}
.youtube iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
	padding-top:40px
	}
	
	
	
	
button.focus_play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 100%;
	height: 100%;
	background: none;
	border: none;
	cursor : pointer;
}

.blockarea2,
.blockarea3,
.blockarea4,
.blockarea5,
.blockarea6,
.blockarea7,
.blockarea8,
.blockarea1 {
	display: none;
}

.blockarea_2,
.blockarea_3,
.blockarea_4,
.blockarea_5,
.blockarea_6,
.blockarea_7,
.blockarea_8,
.blockarea {
	position:fixed;
	z-index: 9999;
	width: 100%;
	height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background: rgba(255,255,255,0.25);
}

.blockarea_8 iframe,
.blockarea_7 iframe,
.blockarea_6 iframe,
.blockarea_5 iframe,
.blockarea_4 iframe,
.blockarea_3 iframe,
.blockarea_2 iframe,
.blockarea iframe {
	position: absolute;
    width: 652px;
    height: 366px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

.relative {
	position: relative;
    top:0;
    left:0;
	right: 0;
	margin: 20px auto;
    width:100%;
    height:100%;
	padding-top:50px
	
}


.relativeYt {
	position: relative;
    top:0;
    left:0;
    width:100%;
    height:100%;
	padding-top:50px;
	
}


