@charset "utf-8";
/***************************************************************************************************
	mv.css
***************************************************************************************************/
@import url('page_weeks_4_mv.css');
/*
*/
#page_top .blk_mv {
	position: absolute;
	left:50%;
	top:50%;
	width:100vw;
	height:100%;
	translate: -50% -50%;
}
#page_top .blk_mv::before {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
	height: 400px;
	left:0;
	top:max(360px, calc(100% - 240px));
	background-color: #e8faff;
	mask-image: url('../images/bk_mask_1.png');
  mask-repeat: repeat-x;
  mask-position: 50% 0;
  mask-size: 1460px auto;
	opacity:0;
}
#page_top .blk_mv.show::before {
  animation:mv_kf_1 1s ease-out 0s 1 normal both;
}
@keyframes mv_kf_1 {
  0%   {
		opacity:0;
		mask-position: calc(50% - 300px) 0;
	}
  100% {
		opacity:1;
		mask-position: 50% 0;
	}
}
#page_top .blk_mv.hide {
	width:100%;
	height:100%;
  animation:blk_mv_kf_2 .4s ease-out 0s 1 normal both;
}
@keyframes blk_mv_kf_2 {
  0%   { opacity: 1; transform: scale(1);}
  100% { opacity: 0; transform: scale(.95);}
}
 
/*  */
#page_top .blk_mv .l {
	position: absolute;
	left:50%;
	top:calc(50% - 30px);
	opacity: 0;
	transform: scale(.2);

	width:200px;
	height: 232px;
	translate: -50% -50%;
  background-image: url('../images/mv2/mv_logo_01.svg');
	background-position: 50% 50%;
	background-size: 100% auto;
}
#page_top .blk_mv.show .l {
  animation:blk_mv_kf_1 .4s cubic-bezier(0.175, 0.885, 0.320, 1.275) .6s 1 normal both;
	animation-delay: 0s;
}
@keyframes blk_mv_kf_1 {
  0%   { opacity: 0; transform: scale(.2);}
  100% { opacity: 1; transform: scale(1);}
}
/*  */
#page_top .blk_mv .is {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	overflow: hidden;
}
/*  */
#page_top .blk_mv .i {
	position: absolute;
	translate: -50% -50%;
	rotate:45deg;
	overflow: hidden;
	border-radius: 10px;

	opacity: 0;
	transform: scale(.2);
}
#page_top .blk_mv.show .i {
  animation:blk_mv_kf_1 .6s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s 1 normal both;
}
#page_top .blk_mv .i::after {
	position: absolute;
	display: block;
	content: '';
	left:50%;
	top:50%;
	width: 200%;
	height: 200%;
	translate: -50% -50%;
	rotate:-45deg;
	background-position: 50% 50%;
}
#page_top .blk_mv .i.p_1_l {
	left:calc(50% - 174px);
	top:calc(50% - 247px);
	width:224px;
	height: 224px;
}
#page_top .blk_mv .i.p_1_l::after {
  background-image: url('../images/mv2/mv_img_15.jpg');
	background-position: 93% -84%;
  background-size: 573px auto;
}
#page_top .blk_mv .i.p_2_l {
	left: calc(50% - 326px);
  top: calc(50% - 73px);
	width:194px;
	height: 194px;
}
#page_top .blk_mv .i.p_2_l::after {
  background-image: url('../images/mv2/mv_img_12.jpg');
	background-position: -35% 90%;
  background-size: 483px auto;
}
#page_top .blk_mv .i.p_3_l {
	left:calc(50% - 141px);
	top:calc(50% + 225px);
	width:194px;
	height:194px;
}
#page_top .blk_mv .i.p_3_l::after {
  background-image: url('../images/mv2/mv_img_04.jpg');
	background-position: 0% 34%;
  background-size: 493px auto;
}
#page_top .blk_mv .i.p_4_l {
	left: calc(50% - 601px);
  top: calc(50% - 140px);
	width: 248px;
	height: 248px;
}
#page_top .blk_mv .i.p_4_l::after {
  background-image: url('../images/mv2/mv_img_08.jpg');
	background-position: -19% 20%;
  background-size: 606px auto;
}
#page_top .blk_mv .i.p_5_l {
	left: calc(50% - 705px);
  top: calc(50% + 50px);
	width: 124px;
	height: 124px;
}
#page_top .blk_mv .i.p_5_l::after {
  background-image: url('../images/mv2/mv_img_03.jpg');
	background-position: -108% 51%;
  background-size: 255px auto;
}
#page_top .blk_mv .i.p_6_l {
	left: calc(50% - 479px);
  top: calc(50% + 154px);
	width: 298px;
	height: 298px;
}
#page_top .blk_mv .i.p_6_l::after {
  background-image: url('../images/mv2/mv_img_13.jpg');
	background-position: -148% 46%;
  background-size: 649px auto;
}
#page_top .blk_mv .i.p_7_l {
	left: calc(50% - 705px);
  top: calc(50% + 296px);
	width: 179px;
	height: 179px;
}
#page_top .blk_mv .i.p_7_l::after {
  background-image: url('../images/mv2/mv_img_11.jpg');
	background-position: 52% 96%;
  background-size: 439px auto;
}
#page_top .blk_mv .i.p_8_l {
	left: calc(50% - 961px);
  top: calc(50% + 47px);
	width:194px;
	height: 194px;
}
#page_top .blk_mv .i.p_8_l::after {
  background-image: url('../images/mv2/mv_img_10.jpg');
	background-position: 121% 115%;
  background-size: 592px auto;
}
#page_top .blk_mv .i.p_9_l {
	left: calc(50% - 970px);
  top: calc(50% - 196px);
	width: 124px;
	height: 124px;
}
#page_top .blk_mv .i.p_9_l::after {
  background-image: url('../images/mv2/mv_img_05.jpg');
	background-position: -6% 44%;
  background-size: 317px auto;
}
#page_top .blk_mv .i.p_10_l {
	left: calc(50% - 412px);
  top: calc(50% - 223px);
	width: 96px;
	height: 96px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_10_l::after {
	display: none;
}
#page_top .blk_mv .i.p_11_l {
	left: calc(50% - 789px);
  top: calc(50% - 51px);
	width: 96px;
	height: 96px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_11_l::after {
	display: none;
}
#page_top .blk_mv .i.p_1_r {
	left:calc(50% + 174px);
	top:calc(50% - 247px);
	width:224px;
	height: 224px;
}
#page_top .blk_mv .i.p_1_r::after {
  background-image: url('../images/mv2/mv_img_14.jpg');
	background-position: 62% 117%;
  background-size: 709px auto;
}
#page_top .blk_mv .i.p_2_r {
	left: calc(50% + 326px);
  top: calc(50% - 73px);
	width:194px;
	height: 194px;
}
#page_top .blk_mv .i.p_2_r::after {
  background-image: url('../images/mv2/mv_img_02.jpg');
	background-position: 132% 50%;
  background-size: 407px auto;
}
#page_top .blk_mv .i.p_3_r {
	left:calc(50% + 141px);
	top:calc(50% + 225px);
	width:194px;
	height:194px;
}
#page_top .blk_mv .i.p_3_r::after {
  background-image: url('../images/mv2/mv_img_07.jpg');
	background-position: 272% 50%;
  background-size: 407px auto;
}
#page_top .blk_mv .i.p_4_r {
	left: calc(50% + 601px);
  top: calc(50% - 140px);
	width: 248px;
	height: 248px;
}
#page_top .blk_mv .i.p_4_r::after {
  background-image: url('../images/mv2/mv_img_01.jpg');
	background-position: 40% 54%;
  background-size: 947px auto;
}
#page_top .blk_mv .i.p_5_r {
	left: calc(50% + 705px);
  top: calc(50% + 50px);
	width: 124px;
	height: 124px;
}
#page_top .blk_mv .i.p_5_r::after {
  background-image: url('../images/mv2/mv_img_09.jpg');
	background-position: 54% 56%;
  background-size: 182px auto;
}
#page_top .blk_mv .i.p_6_r {
	left: calc(50% + 479px);
  top: calc(50% + 154px);
	width: 298px;
	height: 298px;
}
#page_top .blk_mv .i.p_6_r::after {
  background-image: url('../images/mv2/mv_img_10.jpg');
	background-position: -6% 19%;
  background-size: 727px auto;
}
#page_top .blk_mv .i.p_7_r {
	left: calc(50% + 705px);
  top: calc(50% + 296px);
	width: 179px;
	height: 179px;
}
#page_top .blk_mv .i.p_7_r::after {
  background-image: url('../images/mv2/mv_img_05.jpg');
	background-position: -6% 44%;
  background-size: 317px auto;
}
#page_top .blk_mv .i.p_8_r {
	left: calc(50% + 961px);
  top: calc(50% + 47px);
	width:194px;
	height: 194px;
}
#page_top .blk_mv .i.p_8_r::after {
  background-image: url('../images/mv2/mv_img_11.jpg');
	background-position: 45% 171%;
  background-size: 495px auto;
}
#page_top .blk_mv .i.p_9_r {
	left: calc(50% + 970px);
  top: calc(50% - 196px);
	width: 124px;
	height: 124px;
}
#page_top .blk_mv .i.p_9_r::after {
  background-image: url('../images/mv2/mv_img_03.jpg');
	background-position: -108% 51%;
  background-size: 255px auto;
}
#page_top .blk_mv .i.p_10_r {
	left: calc(50% + 412px);
  top: calc(50% - 223px);
	width: 96px;
	height: 96px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_10_r::after {
	display: none;
}
#page_top .blk_mv .i.p_11_r {
	left: calc(50% + 789px);
  top: calc(50% - 51px);
	width: 96px;
	height: 96px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_11_r::after {
	display: none;
}
/*  */
#page_top .blk_mv .i.p_1_l {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_2_l {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_3_l {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_4_l {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_5_l {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_6_l {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_7_l {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_8_l {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_9_l {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_10_l {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_11_l {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_1_r {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_2_r {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_3_r {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_4_r {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_5_r {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_6_r {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_7_r {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_8_r {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_9_r {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_10_r {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_11_r {
	animation-delay: .4s;
}
/***************************************************************************************************
  responsive
***************************************************************************************************/
@media screen and (max-width:1000px) {
/*  */
	#page_top .blk_mv {
		height: 150%;
		width:150vw;
	}
	#page_top .blk_mv .is {
		scale:.8;

	}
	/*  */
	#page_top .blk_mv .l {

		background-size: 85% auto;
	}
}
/*  */
@media screen and (max-width:700px) {
/*
*/
#page_top .blk_mv {
	position: absolute;
	left:0;
	top:0;
	width:100vw;
	height:100%;
	translate: 0;
	overflow: hidden;

}

#page_top .blk_mv::before {
	width: 100%;
	height: 300px;
	left:0;
	mask-size: 800px auto;
	top:max(200px, calc(100% - 160px));
}
/*  */
#page_top .blk_mv .l {
	position: absolute;
	left:calc(100% - 5vw);
	top:calc(50% - 30px);


	width:calc(200px * .65);
	height: calc(232px * .65);
	translate: -100% -50%;

}
/*  */
#page_top .blk_mv .is {
	left:50px;
	width: 95vw;
	overflow: visible;
	scale:1;
}
/*  */
#page_top .blk_mv .i {
	border-radius: 6px;
}
#page_top .blk_mv .i.i_l {
	display: none;
}
#page_top .blk_mv .i.i_s {
	display: block;
}
#page_top .blk_mv .i.p_1 {
	left: calc(100% - 165px);
	top: calc(50% - 222px);
	width: 149px;
	height: 149px;
}
#page_top .blk_mv .i.p_1::after {
  background-image: url('../images/mv2/mv_img_13.jpg');
	background-position: 654% 48%;
	background-size: 289px auto;
}
#page_top .blk_mv .i.p_2 {
	left: calc(100% - 255px);
	top: calc(50% - 108px);
	width: 116px;
	height: 116px;
}
#page_top .blk_mv .i.p_2::after {
  background-image: url('../images/mv2/mv_img_02.jpg');
	background-position: 85% 59%;
	background-size: 262px auto;
}
#page_top .blk_mv .i.p_3 {
	left: calc(100% - 347px);
	top: calc(50% - -25px);
	width: 178px;
	height: 178px;
}
#page_top .blk_mv .i.p_3::after {
  background-image: url('../images/mv2/mv_img_01.jpg');
	background-position: 42% 59%;
	background-size: 733px auto;
}
#page_top .blk_mv .i.p_4 {
	left: calc(100% - 209px);
	top: calc(50% - -118px); 
	width: 120px;
	height: 120px;
}
#page_top .blk_mv .i.p_4::after {
  background-image: url('../images/mv2/mv_img_10.jpg');
	background-position: 37% 7%;
	background-size: 292px auto;
}
#page_top .blk_mv .i.p_5 {
	left: calc(100% - 304px);
	top: calc(50% - -215px);
	width: 120px;
	height: 120px;
}
#page_top .blk_mv .i.p_5::after {
  background-image: url('../images/mv2/mv_img_04.jpg');
	background-position: 5% 36%;
	background-size: 309px auto;
}
#page_top .blk_mv .i.p_6 {
	left: calc(100% - 420px);
	top: calc(50% - 151px);
	width: 149px;
	height: 149px;
}
#page_top .blk_mv .i.p_6::after {
  background-image: url('../images/mv2/mv_img_14.jpg');
	background-position: 40% 17%;
	background-size: 344px auto;
}
#page_top .blk_mv .i.p_7 {
	left: calc(100% - 483px);
	top: calc(50% - 36px);
	width: 74px;
	height: 74px;
}
#page_top .blk_mv .i.p_7::after {
  background-image: url('../images/mv2/mv_img_03.jpg');
	background-position: 28% 497%;
	background-size: 200px auto;
}
#page_top .blk_mv .i.p_8 {
	left: calc(100% - 493px);
	top: calc(50% - -100px);
	width: 108px;
	height: 108px;
}
#page_top .blk_mv .i.p_8::after {
  background-image: url('../images/mv2/mv_img_05.jpg');
	background-position: 31% 54%;
	background-size: 221px auto;
}
#page_top .blk_mv .i.p_9 {
	left: calc(100% - 647px);
	top: calc(50% - 49px);
	width: 149px;
	height: 149px;
}
#page_top .blk_mv .i.p_9::after {
  background-image: url('../images/mv2/mv_img_12.jpg');
	background-position: -17% 43%;
	background-size: 321px auto;
}
#page_top .blk_mv .i.p_10 {
	left: calc(100% - 658px);
	top: calc(50% - -154px);
	width: 128px;
	height: 128px;
}
#page_top .blk_mv .i.p_10::after {
  background-image: url('../images/mv2/mv_img_11.jpg');
	background-position: -67% 51%;
	background-size: 248px auto;
}
#page_top .blk_mv .i.p_11 {
	left: calc(100% - 714px);
	top: calc(50% - 190px);
	width: 116px;
	height: 116px;
}
#page_top .blk_mv .i.p_11::after {
  background-image: url('../images/mv2/mv_img_08.jpg');
	background-position: -58% 33%;
	background-size: 271px auto;
}
#page_top .blk_mv .i.p_12 {
	left: calc(100% - 831px);
	top: calc(50% - 95px);
	width: 149px;
	height: 149px;
}
#page_top .blk_mv .i.p_12::after {
  background-image: url('../images/mv2/mv_img_09.jpg');
	background-position: 140% 62%;
	background-size: 275px auto;
}
#page_top .blk_mv .i.p_13 {
	left: calc(100% - 804px);
	top: calc(50% - -105px);
	width: 116px;
	height: 116px;
}
#page_top .blk_mv .i.p_13::after {
  background-image: url('../images/mv2/mv_img_06.jpg');
	background-position: 13% 47%;
	background-size: 221px auto;
}
#page_top .blk_mv .i.p_14 {
	left: calc(100% - 989px);
	top: calc(50% - 146px);
	width: 120px;
	height: 120px;
}
#page_top .blk_mv .i.p_14::after {
  background-image: url('../images/mv2/mv_img_15.jpg');
	background-position: 482% 50%;
	background-size: 229px auto;
}
#page_top .blk_mv .i.p_15 {
	left: calc(100% - 118px);
	top: calc(50% - -223px);
	width: 128px;
	height: 128px;
}
#page_top .blk_mv .i.p_15::after {
  background-image: url('../images/mv2/mv_img_07.jpg');
	background-position: 115% 53%;
	background-size: 294px auto;
}
#page_top .blk_mv .i.p_16 {
	left: calc(100% - 304px);
	top: calc(50% - 198px);
	width: 57px;
	height: 57px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_16::after {
	display: none;
}
#page_top .blk_mv .i.p_17 {
	left: calc(100% - 543px);
	top: calc(50% - -185px);
	width: 57px;
	height: 57px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_17::after {
	display: none;
}
#page_top .blk_mv .i.p_18 {
	left: calc(100% - 596px);
	top: calc(50% - 166px);
	width: 57px;
	height: 57px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_18::after {
	display: none;
}
#page_top .blk_mv .i.p_19 {
	left: calc(100% - 882px);
	top: calc(50% - -19px);
	width: 57px;
	height: 57px;
	background-color: #e8faff;
}
#page_top .blk_mv .i.p_19::after {
	display: none;
}
/*  */
#page_top .blk_mv .i.p_1 {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_2 {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_3 {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_4 {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_5 {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_6 {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_7 {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_8 {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_9 {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_10 {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_11 {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_12 {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_13 {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_14 {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_15 {
	animation-delay: .6s;
}
#page_top .blk_mv .i.p_16 {
	animation-delay: .7s;
}
#page_top .blk_mv .i.p_17 {
	animation-delay: .4s;
}
#page_top .blk_mv .i.p_18 {
	animation-delay: .5s;
}
#page_top .blk_mv .i.p_19 {
	animation-delay: .6s;
}


/*  */
}