@charset "utf-8";
/***************************************************************************************************
	page_weeks_4_mv.css
***************************************************************************************************/
/*
*/
#mv_weeks_4 {
  position: absolute;
  left:0;
  top:0;
	width:100%;
  height: 100%;
  opacity:0;
}
#mv_weeks_4.show {
  animation:mv_weeks_4_kf_1 .4s ease-out .2s 1 normal both;
}
@keyframes mv_weeks_4_kf_1 {
  0%   { opacity: 0; transform: scale(.95);}
  100% { opacity: 1; transform: scale(1);}
}
#mv_weeks_4.hide {
  animation:mv_weeks_4_kf_2 .4s ease-out 0s 1 normal both;
}
@keyframes mv_weeks_4_kf_2 {
  0%   { opacity: 1; transform: scale(1);}
  100% { opacity: 0; transform: scale(.95);}
}
#mv_weeks_4 .mv_content {
  position:absolute;
  left:50%;
  top:calc(50% - 40px);
  width:92%;
  max-width: 2000px;
  height: calc(100% - 120px);
  transform:translate(-50%, -50%);
  pointer-events: none;
  overflow: hidden;
}
#mv_weeks_4.show .mv_content {
  pointer-events:auto;
}
#mv_weeks_4.hide .mv_content {
  pointer-events:none;
}
/*  */
#mv_weeks_4 .blk_txt {
  position:absolute;
  left: 50%;
  top:50%;
  width:100%;
  height:100%;
  min-height: 500px;
  translate: -50% -50%;
  z-index: 3;
}
#mv_weeks_4 .blk_txt h2,
#mv_weeks_4 .blk_txt p {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
}
#mv_weeks_4 .blk_txt picture {
  position:absolute;
  display: block;
  width:100%;
  height:100%;
  left:50%;
  top:50%;
  object-fit: contain;
  translate: -50% -50%;
}
#mv_weeks_4 .blk_txt picture img {
  position:absolute;
  display: block;
  width:100%;
  height:100%;
}
#mv_weeks_4 .blk_txt .txt_1 {
  opacity:0;
}
#mv_weeks_4.show .blk_txt .txt_1 {
  animation:mv_weeks_4_kf_6 1s  cubic-bezier(00.680, -0.550, 0.265, 1.550) .2s 1 normal both;
}
#mv_weeks_4.hide .blk_txt .txt_1 {
  animation:mv_weeks_4_kf_4 .4s ease-out .4s 1 normal both;
}
#mv_weeks_4 .blk_txt .txt_2 {
  opacity:0;
}
#mv_weeks_4.show .blk_txt .txt_2 {
  animation:mv_weeks_4_kf_3 1s cubic-bezier(00.680, -0.550, 0.265, 1.550) 0s 1 normal both;
}
#mv_weeks_4.hide .blk_txt .txt_2 {
  animation:mv_weeks_4_kf_4 .4s ease-out .4s 1 normal both;
}
#mv_weeks_4 .blk_txt .txt_3 {
  opacity:0;
}
#mv_weeks_4.show .blk_txt .txt_3 {
  animation:mv_weeks_4_kf_7 .6s  ease-out .6s 1 normal both;
}
#mv_weeks_4.hide .blk_txt .txt_3 {
  animation:mv_weeks_4_kf_4 .4s ease-out .4s 1 normal both;
}
@keyframes mv_weeks_4_kf_3 {
  0%   { opacity: 0; scale:.7;}
  100% { opacity: 1; scale:1;}
}
@keyframes mv_weeks_4_kf_4 {
  0%   { opacity: 1; scale:1;}
  99%   { opacity: 1;}
  100% { opacity: 0;}
}
@keyframes mv_weeks_4_kf_6 {
  0%   { opacity: 0;  scale:.8;}
  100% { opacity: 1;  scale:1;}
}
@keyframes mv_weeks_4_kf_7 {
  0%   { opacity: 0;}
  100% { opacity: 1;}
}
/*  */
#mv_weeks_4 .blk_bk {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  z-index: 1;
  overflow: hidden;
  background-image: url('../images/weeks4/bk_01.jpg');
	background-position: 50% 50%;
	background-size: cover;
}
#mv_weeks_4 .blk_bk > div {
  position: absolute;
  background-position: 50% 50%;
	background-size: 100% 100%;
}
#mv_weeks_4 .blk_bk .bk_1 {
  left:0;
  top:0;
  width:31.3%;
  height:86.4%;
  background-image: url('../images/weeks4/bk_02_01.png');
}
#mv_weeks_4 .blk_bk .bk_2 {
  left:100%;
  top:0;
  width:34.1%;
  height:59.4%;
  background-image: url('../images/weeks4/bk_02_02.png');
  translate: -100% 0;

}
#mv_weeks_4 .blk_bk .bk_3 {
  left:0;
  top:100%;
  width:31.4%;
  height:52.8%;
  background-image: url('../images/weeks4/bk_02_03.png');
  translate:0 -100%;
}
#mv_weeks_4 .blk_bk .bk_4 {
  left:100%;
  top:100%;
  width:33.4%;
  height:54.2%;
  background-image: url('../images/weeks4/bk_02_04.png');
  translate:-100% -100%;
}
/*  */
#mv_weeks_4 .blk_img {
  position:absolute;
  left: 50%;
  top:50%;
  width:100%;
  max-width: 1500px;
  height:100%;
  min-height: 550px;
  translate: -50% -50%;
  z-index: 2;
  opacity: 0;
}
#mv_weeks_4.show .blk_img {
  animation:mv_weeks_4_kf_5 1s cubic-bezier(00.680, -0.550, 0.265, 1.550) 0s 1 normal both;
}
#mv_weeks_4.hide .blk_img {
  animation:mv_weeks_4_kf_4 .4s ease-out .4s 1 normal both;
}
@keyframes mv_weeks_4_kf_5 {
  0%   { opacity: 0; scale:.9;}
  100% { opacity: 1; scale:1;}
}
#mv_weeks_4 .blk_img > div {
  position:absolute;
  display: block;
  background-position: 50% 50%;
	background-size: contain;
}
#mv_weeks_4 .blk_img .i_1 {
  width:23.7%;
  min-width:225px;
  height:53%;
  left: -3%;
  top: -11%;
  background-image: url('../images/weeks4/img_01.png');
}
#mv_weeks_4 .blk_img .i_2 {
  width:16.1%;
  min-width:191px;
  height:28%;
  left: 67%;
  top: -5%;
  background-image: url('../images/weeks4/img_02.png');
}
#mv_weeks_4 .blk_img .i_3 {
  width:27.5%;
  min-width:327px;
  height:61.6%;
  left: 84%;
  top: -39%;
  background-image: url('../images/weeks4/img_03.png');
}
#mv_weeks_4 .blk_img .i_4 {
  width:21.8%;
  min-width:259px;
  height:40%;
  left: 82%;
  top: 18%;
  background-image: url('../images/weeks4/img_04.png');
}
#mv_weeks_4 .blk_img .i_5 {
  width:33.1%;
  min-width:394px;
  height:49.3%;
  left: 72%;
  top: 62%;
  background-image: url('../images/weeks4/img_05.png');
}
#mv_weeks_4 .blk_img .i_6 {
  width:31.2%;
  min-width:372px;
  height:49.3%;
  left: -4%;
  top: 67%;
  background-image: url('../images/weeks4/img_06.png');
}
#mv_weeks_4 .blk_img .i_7 {
  width:13.1%;
  min-width:156px;
  height:21.8%;
  left: 6%;
  top: 45%;
  background-image: url('../images/weeks4/img_07.png');
}
/***************************************************************************************************
  responsive
***************************************************************************************************/
@media screen and (max-width: 1000px) {
  /*
  */
  #mv_weeks_4 .mv_content {
    left:3%;
    top:0;
    width:94%;
    height: calc(100% - 25px);
    transform:none;
    pointer-events: none;
  }

}
@media screen and (max-width: 700px) {
/*
*/
#mv_weeks_4 .blk_txt {
  min-height: 460px;
}
/*  */
#mv_weeks_4 .blk_bk {
  /* background-image: url('../images/weeks4/00_dummy_05.jpg'); */
}
#mv_weeks_4 .blk_bk > div {

}
#mv_weeks_4 .blk_bk .bk_1 {
  width:54.1%;
  height:31.7%;
  background-image: url('../images/weeks4/bk_02_01_sp.png');
}
#mv_weeks_4 .blk_bk .bk_2 {
  width:56.8%;
  height:24.9%;
  background-image: url('../images/weeks4/bk_02_02_sp.png');
}
#mv_weeks_4 .blk_bk .bk_3 {
  width:54.5%;
  height:28.1%;
  background-image: url('../images/weeks4/bk_02_03_sp.png');
}
#mv_weeks_4 .blk_bk .bk_4 {
  width:66.9%;
  height:32.6%;
  background-image: url('../images/weeks4/bk_02_04_sp.png');
}
/*  */
#mv_weeks_4 .blk_img {
  max-width: 400px;
  min-height: 300px;
}
#mv_weeks_4 .blk_img .i_1 {
  width:51.6%;
  min-width:0;
  height:31.6%;
  min-height: 148px;
  /* width: 183px;
  height:180px; */
  left: -17%;
  top: -5%;
}
#mv_weeks_4 .blk_img .i_2 {
  width:28.7%;
  min-width:0;
  height:14.4%;
  min-height: 67px;
  left: 38%;
  top: 4%;
  background-image: url('../images/weeks4/img_02_sp.png');
}
#mv_weeks_4 .blk_img .i_3 {
  display:none;
}
#mv_weeks_4 .blk_img .i_4 {
  width:43.9%;
  min-width:0;
  height:21.9%;
  min-height: 102px;
  left: 72%;
  top: 2%;
}
#mv_weeks_4 .blk_img .i_5 {
  width:55.4%;
  min-width:0;
  height:22.5%;
  min-height: 105px;
  left: 60%;
  top: 81%;
}
#mv_weeks_4 .blk_img .i_6 {
  width:72.7%;
  min-width:0;
  height:28.6%;
  min-height: 134px;
  left: -33%;
  top: 77%;
}
#mv_weeks_4 .blk_img .i_7 {
  width:22.7%;
  min-width:0;
  height:10.3%;
  min-height: 48px;
  left: 43%;
  top: 77%;
}
/*  */
}
