@charset "UTF-8";

/**

バック地（白）

**/
.bg-fff {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 10;
	
	background: #fff;
/*	background: rgba(209,93,213,1.00);*/
}
.bg-fff.m01{
	width: calc( 100% - 50px );
	height: auto;
	margin: 0;
	padding: 25px;
}

.z-index10{
	z-index: 10;
}
.bg-fff2 {
	clear: both;
	width: 100%;
	height: 30%;
	min-height: 150px;
	max-height: 300px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	
	background: #fff;
/*	background: rgba(209,93,213,1.00);*/
}





/**

loading

**/
#loading{
  position: absolute;
  left: calc(50% - 50px);
  top: calc(50% - 25px);
}
#loading img{
	width: 100px;
	height: auto;
}
#loader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #FFF;
  z-index: 9999;
}


/**

ムービー（ohfuji移植）

**/
.top_main_ph1_bg{
	clear: both;
	width: 100%;
	max-width: 1200px;
	max-width: 1130px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	z-index: 3;
	
	border: none;
	background: none;
	
/*	background: rgba(229,49,52,1.00);*/
}
.top_main_ph1_bg img{
	width: 100%;
	height: auto;
	
	border: none;
	background: none;
}
.top_main_ph1_bg2{
	position: relative;
	z-index: -3;
	
	border: none;
	background: none;
	
/*	background: rgba(161,207,215,1.00);*/
}
.top_main_ph1{
	clear: both;
	width: 100%;
	height: auto;
	position:fixed;
	position:absolute;
	margin: 0;
	padding: 0 ;
	top:70px;
	top:0;
	z-index: 3;
	
	border: none;
	background: none;
	
/*	border: 2px solid #000;*/
	/*background: rgba(148,226,153,1.00);*/
}
@media print, screen and (min-width: 801px) {
.top_main_ph1{
	top:80px;
	top:0;
	
	border: none;
	background: none;
}	
}

.top_main_ph2{
	clear: both;
	width: 100%;
	height: auto;
	position:absolute;
	top: 0;
	margin: 0;
	padding: 0 ;
	
	z-index: 2;
/*	display: none;*/
	opacity: 0;
	
	border: none;
	background: none;
/*
	animation-duration:1s;
	animation-fill-mode:forwards;
	animation-name:fadeInAnime;
*/
}
@keyframes fadeInAnime{
	from {
	opacity: 0;
	}
	to {
	opacity: 1;
	}
}



@media print, screen and (max-width: 800px) {
.top_main_ph1_bg1{
	clear: both;
	width: 100%;
	height: 100%;
	position:absolute;
	top: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	
	border: none;
	background: none;
}
.top_main_ph1{
	clear: both;
	width: 106%;
	height: auto;
	position:absolute;
	top: 0;
	left: -3%;
	right: -3%;
	
	border: none;
	background: none;
}
.top_main_ph2_bg1{
	clear: both;
	width: 100%;
	height: 100%;
	position:absolute;
	top: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	
	border: none;
	background: none;
}
.top_main_ph2{
	clear: both;
	width: 106%;
	height: auto;
	position:absolute;
	top: 0;
	left: -3%;
	right: -3%;
	
	border: none;
	background: none;
}	
}

video#video01 {
	border: none;
	background: none;
}	




/***
	
スマホビデオ
	
***/
#video02{
	width: 100%;
	height: auto;
	position:absolute;
	top: 0;
	left: 0;
	z-index: -1;
	z-index: 10;
	opacity: 0;
	
}



/***
	
ビデオ／スマホでは読み込みさせない
	
***/
/*
@media screen and (min-width: 801px) {
  .video-wrap {
	display: block;
  }
  .image-wrap {
	display: none;
  }
}
@media screen and (max-width: 600px) {
  .video-wrap {
	display: none;
  }
  .image-wrap {
	display: block;
	width: 100%;
  }
}
*/
  

/*
#play{
	display:block;
	width: 100px;
	height: auto;
	position: absolute;
	top: -30px;
	right: 0;
	z-index: -1;
	cursor: pointer;
}
#play2{
	display:block;
	width: 100px;
	height: auto;
	position: absolute;
	top: -30px;
	right: 0;
	z-index: -1;
	z-index: 999;
	cursor: pointer;
}
*/
#replay{
	display: none;
	width: 85px;
	height: auto;
	position: fixed;
	position: absolute;
	top: 60px;
	top: 2px;
	right: 0;
	z-index: 5;
	cursor: pointer;
}
#skip,
#skip2{
	width: 85px;
	height: auto;
	position: fixed;
	position: absolute;
	top: 60px;
	top: 2px;
	right: 0;
	z-index: 5;
	cursor: pointer;
}
@media print, screen and (min-width: 801px) {
/*
#play{
	display:none;
}
*/
#replay{
	top: 100px;
	top: 15px;
	right: 10px;
}
#skip,
#skip2{
	top: 100px;
	top: 15px;
	right: 10px;
}
}




.top2_box1_title1{
	clear: both;
	width: 100%;
	height: auto;
	font-family: 'Noto Serif JP' , 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', serif ;
	font-weight: 400;
/*	font-weight: 700;*/
	text-align:center;
	
	font-size:20px;
	font-size:5vw;
	font-size:4vw;
	font-size:3.7vw;
	font-size:3.55vw;
	line-height:160%;
	color:#333;
	font-feature-settings: "palt";/*（自動カーニング）*/
	letter-spacing: 0.02em;
}
@media print, screen and (min-width: 801px) {
.top2_box1_title1{
	font-size:26px;
	line-height:105%;
	line-height:160%;
	letter-spacing: 0.06em;
	
}
}



.top2_box1_txt1{
	clear: both;
	width: 83.334%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}
@media print, screen and (min-width: 801px) {
.top2_box1_txt1{
	width: 100%;
	max-width: 500px;
	
}
}
.top2_box1_txt2{
	clear: both;
	width: 83.334%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}
@media print, screen and (min-width: 801px) {
.top2_box1_txt2{
	width: 92%;
	max-width: 860px;
	position: relative;
	z-index: 10;
/*	overflow: hidden;*/
	
/*	background:rgba(81,175,107,1.00);*/
	
}
.top2_box1_txt2-left{
	width: calc((100% - 860px) / 2);
	height: 2000px;
	position: absolute;
	top: 0;
	left: 0;
/*	background: rgba(215,141,142,0.5);*/
	background-image: url("../img/top2/top2_box1_bg-line1.png?20260707");
	background-position: top right;
	mix-blend-mode: luminosity;
	mix-blend-mode: screen;
	mix-blend-mode: multiply;
	z-index: 100;
	pointer-events: none; /* ボタン判定透過 */
}
.top2_box1_txt2-left2{
	width: calc((100% - 860px) / 2);
	height: 2000px;
	position: absolute;
	top: 0;
	left: 1px;
/*	background: rgba(215,141,142,0.5);*/
	background-image: url("../img/top2/top2_box1_bg-line1-2.png?20260707");
	background-position: top right;
	
	z-index: 99;
	pointer-events: none; /* ボタン判定透過 */
}
.top2_box1_txt2-right{
	width: calc((100% - 860px) / 2);
	height: 2000px;
	position: absolute;
	bottom: 0;
	right: 0;
/*	background: rgba(215,141,142,0.5);*/
	background-image: url("../img/top2/top2_box1_bg-line1.png?20260707");
	background-position: bottom left;
	pointer-events: none; /* ボタン判定透過 */
}
}
.top2_box1_txt2-bar1{
	clear: both;
	width: 100%;
	height: 1px;
	margin: 0;
	padding: 0;
	border: none;
	border-top: 1px solid #66baa8;
	border-collapse: collapse;
}



/**

INFO（box2）

**/
.top_box2bg{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	background: #72c7cd;
/*
	z-index: -1;
	z-index: 1;
*/
	z-index: -1;
}

.top_box25-0212bg{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	background: #c8e7e9;
/*
	z-index: -1;
	z-index: 1;
*/
	z-index: -1;
}


/**

box3

**/
/*
.top_box3bg{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	background-image: url("../img/top2/top2_box3_bg1s@2x.png?20260707");
	background-position: top;
	background-size: cover;
}
*/
@media print, screen and (max-width: 800px) {
.top_box3bg1{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	background-image: url("../img/top2/top2_box3_bg1s@2x.png?20260707");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100%;
}
}
@media print, screen and (min-width: 801px) {
.top_box3bg1{
	clear: both;
	width: 100%;
/*	max-width: 1400px;*/
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background-image: url("../img/top2/top2_box3_bg1.png?20260707");
	background-position: top center;
	background-repeat: no-repeat;
/*	background-size: auto;*/
}
.top_box3bg1.concept01{
	background-image: url("../img/top2/top2_box3_bg1-2.png?20260707");
	background-position: top left;
}
}
@media print, screen and (min-width: 801px) {
.top_box3bg2{
	clear: both;
	width: 100%;
/*	max-width: 1400px;*/
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background-image: url("../img/top2/top2_box3_bg2-2.png?20260707");
	background-position: top center;
	background-repeat: no-repeat;
/*	background-size: auto;*/
}
.top_box3bg2.concept01{
	background-image: url("../img/top2/top2_box3_bg2-3.png?20260707");
	background-position: top right;
}
}





.top_box3_txt1{
	clear: both;
	width: 75%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background: #fff;
}
.top_box3_txt2{
	clear: both;
	width: 87.5%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background: #fff;
}
@media print, screen and (min-width: 801px) {
.top_box3_txt1{
	width: 92%;
	max-width: 800px;
}
.top_box3_txt2{
	width: 92%;
	max-width: 800px;
}
}

.top2_box3_cap1{
	clear: both;
	width: 87.5%;
	height: auto;
	margin: 0 auto;
	padding: 8px 0 0;
	position: relative;
/*	background:rgba(192,0,3,0.4);*/
}
@media print, screen and (min-width: 801px) {
.top2_box3_cap1{
	clear: both;
	width: 33.571%;
	height: auto;
	margin: 0;
	padding: 0;
	position: absolute;
	bottom: 0;
	right: 0;
}
}


.top2_box3_cap2{
	clear: both;
	width: 87.5%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}
@media print, screen and (min-width: 801px) {
.top2_box3_cap2{
	clear: both;
	width: auto;
	height: auto;
	margin: 8px 20px 0 0;
	padding: 0;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 5;
}
}





.top2_box4s{
	clear: both;
	width: 87.5%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	
	background: #fff;
}

.top_box4_pc2 .pc2_ph1{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
}
.top_box4_pc2{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
@media print, screen and (min-width: 801px) {
.top_box4_pc2 .pc2_ph1{
	width: 50%;
}
.top_box4_pc2 .pc2_ph1.m01{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-content: space-between;
}
.top_box4_pc2 .pc2_ph2{
	clear: both;
	width: 50%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
}
	
	
.pc2_txt1bg,
.pc2_txt2bg{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0 0 10px;
	position: relative;
	background: rgba(107,213,164,1.00);
	background: #fff;
}
.pc2_txt2bg{
	padding: 15px 0 0;
}
.pc2_txt1,
.pc2_txt2{
	clear: both;
	width: 57.143%;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 0;
	float: right;
	position: relative;
	top: 0;
	right: 3%;
}
.pc2_txt1{
	width: 440px;
}
}
.pc2_txt2{
	float: left;
	left: 3%;
}

@media print, screen and (min-width: 1001px) {
.pc2_txt1{
	right: 21.428%;
}
.pc2_txt2{
	left: 21.428%;
}
}



@media print, screen and (max-width: 800px) {
.pcon1{
	display: none;
}
.pcon2{
	display: none;
}
}
@media print, screen and (min-width: 801px) {
.pcon1{
	display: none;
}
.pcon2{
	display: block;
}
}
@media print, screen and (min-width: 951px) {
.pcon1{
	display: block;
}
.pcon2{
	display: none;
}
}





.top_box4_pc2 .pc2_ph3{
	clear: both;
	width: 50%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
}	
@media print, screen and (min-width: 801px) {
.top_box4_pc2 .pc2_ph3{
	width: 25%;
}
}


.top2_box4_txt1s,
.top2_box4_txt2s{
	display: none;
}

@media print, screen and (max-width: 800px) {
.top2_box4_txt1s,
.top2_box4_txt2s{
	display: block;
	clear: both;
	width: 18.75%;
	height: auto;
	margin: 0;
	padding: 0;
	position: absolute;
}
.top2_box4_txt1s{
	top: -45%;
	right: 0;
}	
.top2_box4_txt2s{
	bottom: -38%;
	left: 0;
}	
}


.top2_box3-2_ph01,
.top2_box3-2_ph02,
.top2_box3-2_ph03,
.top2_box3-2_ph04,
.top2_box3-2_ph05{
	/* box-shadow */
	box-shadow: 0px 0px 12px 0px rgba(10,10,10,0.2);
}
@media print, screen and (max-width: 800px) {
.top2_box3-2_ph01,
.top2_box3-2_ph02,
.top2_box3-2_ph03,
.top2_box3-2_ph04,
.top2_box3-2_ph05,
.top2_box3-2_ph06,
.top2_box3-2_ph07,
.top2_box3-2_ph08,
.top2_box3-2_ph09,
.top2_box3-2_ph10{
	clear: both;
	width: 54.167%;
	height: auto;
	margin: 0;
	padding: 0;
	position: absolute;
}

/*写真パーツ*/
.top2_box3-2_ph01{
	left: 6.25%;
	top: 0;
	z-index: 10;
}
.top2_box3-2_ph02{
	right: 6.25%;
	top: 18.939%;
	z-index: 8;
}
.top2_box3-2_ph03{
	left: 6.25%;
	top: 37.879%;
	z-index: 9;
}
.top2_box3-2_ph04{
	right: 6.25%;
	bottom: 18.939%;
	z-index: 7;
}
.top2_box3-2_ph05{
	left: 6.25%;
	bottom: 0;
	z-index: 6;
}
/*バック地パーツ*/
.top2_box3-2_ph06{
	left: 0;
	top: 4.545%;
	z-index: 5;
}
.top2_box3-2_ph07{
	right: 0;
	top: 15.909%;
	z-index: 4;
}
.top2_box3-2_ph08{
	left: 16.667%;
	top: 40.909%;
	z-index: 3;
}
.top2_box3-2_ph09{
	right: 16.667%;
	bottom: 15.909%;
	z-index: 2;
}
.top2_box3-2_ph10{
	left: 0;
	bottom: 4.545%;
	z-index: 1;
}
	
}
@media print, screen and (min-width: 801px) {
.top2_box3-2_ph01,
.top2_box3-2_ph02,
.top2_box3-2_ph03,
.top2_box3-2_ph04,
.top2_box3-2_ph05,
.top2_box3-2_ph06,
.top2_box3-2_ph07,
.top2_box3-2_ph08,
.top2_box3-2_ph09,
.top2_box3-2_ph10{
	clear: both;
	width: 25%;
	height: auto;
	margin: 0;
	padding: 0;
	position: absolute;
}


/*写真パーツ*/
.top2_box3-2_ph01{
	left: 0;
	top: 21.818%;
	z-index: 9;
}
.top2_box3-2_ph02{
	left: 20.714%;
	bottom: 7.273%;
	z-index: 7;
}
.top2_box3-2_ph03{
	left: 38.928%;
	top: 30.909%;
	z-index: 10;
}
.top2_box3-2_ph04{
	right: 17.286%;
	top: 0;
	z-index: 8;
}
.top2_box3-2_ph05{
	right: 0;
	top: 34.545%;
	z-index: 6;
}
/*バック地パーツ*/
.top2_box3-2_ph06{
	left: 5.714%;
	top: 7.273%;
	z-index: 4;
}
.top2_box3-2_ph07{
	left: 27.357%;
	bottom: 0;
	z-index: 2;
}
.top2_box3-2_ph08{
	left: 34.643%;
	top: 23.636%;
	z-index: 5;
}
.top2_box3-2_ph09{
	right: 13.714%;
	top: 9.091%;
	z-index: 3;
}
.top2_box3-2_ph10{
	right: 8.571%;
	bottom: 16.364%;
	z-index: 1;
}
}








.cap_number1{
	clear: both;
	width: 15px;
	height: 15px;
	margin: 0;
	padding: 0;
	position: absolute;
	bottom: 0;
	right: 0;
	overflow: hidden;
	background: #000;
/*	background: #990;*/
	
	display: flex;
	align-items: center;
	align-content: center;
}
.cap_number1 p{
	clear: both;
	width: auto;
	height: auto;
	margin: 0 auto;
	padding: 0;
	
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 12px;
	line-height: 100.1%;
	font-weight: 400;
	font-weight: 700;
	text-align: center;
	color: #fff;
	
	position: relative;
	top: -1px;
}





.top_box5bg1{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;

}

.top_box5bg2 {
	clear: both;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	position: fixed;
	top: 0;
	left: 0;
/*	z-index: 1;*/
	
	background: #fff;
	
	background-size: cover;
	background-position: top center;
}
@media print, screen and (max-width: 800px) {
.top_box5bg2 {
	
}
}

.top2_box5_flex1{
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
}
@media print, screen and (min-width: 801px) {
.top2_box5_flex1{
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}
}
@media print, screen and (min-width: 801px) {
.top2_box5_flex1.centerbox1{
	justify-content: center;
}
}


.top2_box5_btn1{
	clear: both;
	width: 66.667%;/*480px*/
	width: 76.191%;/*420px*/
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	/* preview */
	background-color: #fff;
	/* drop-shadow */
/*	filter: drop-shadow(0px 0px 7px rgba(0,0,0,0.3));*/
/*
	border: 1px solid #999;
	border-collapse: collapse;
*/
	border: none;
}
@media print, screen and (min-width: 801px) {
.top2_box5_btn1{
	width: 32%;
	max-width: 320px;
	margin: 0;
	padding: 0;
}
.top2_box5_btn1.col4{
	width: 30%;
	max-width: 320px;
	max-width: 240px;
	margin: 0;
	padding: 0;
}
.top2_box5_btn1.col4.centerbtn1{
	margin: 0 15px;
	margin: 0 6px;
	margin: 0 8px;
}
}


.top2_box5_logo1{
	clear: both;
	width: 66.667%;/*480px*/
	width: 76.191%;/*420px*/
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
}
@media print, screen and (min-width: 801px) {
.top2_box5_logo1{
	width: 34%;
	max-width: 340px;
	margin: 0;
	padding: 0;
}
}

.top2_box5_txt1{
	clear: both;
	width: 83.334%;/*480px*/
	width: 95.239%;/*420px*/
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
}
@media print, screen and (min-width: 801px) {
.top2_box5_txt1{
	width: 66%;
	max-width: 660px;
	margin: 0;
	padding: 0;
}
}
