@charset "utf-8";
/***************************************************************************************************
	page_weeks_3_mv.css
***************************************************************************************************/
/*
*/
#mv_weeks_3 {
  position: absolute;
  left:0;
  top:0;
	width:100%;
  height: 100%;
  opacity:0;
}
#mv_weeks_3.show {
  animation:mv_weeks_3_kf_1 .4s ease-out .2s 1 normal both;
}
@keyframes mv_weeks_3_kf_1 {
  0%   { opacity: 0; transform: scale(.95);}
  100% { opacity: 1; transform: scale(1);}
}
#mv_weeks_3.hide {
  animation:mv_weeks_3_kf_2 .4s ease-out 0s 1 normal both;
}
@keyframes mv_weeks_3_kf_2 {
  0%   { opacity: 1; transform: scale(1);}
  100% { opacity: 0; transform: scale(.95);}
}
#mv_weeks_3 .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;
}
#mv_weeks_3.show .mv_content {
  pointer-events:auto;
}
#mv_weeks_3.hide .mv_content {
  pointer-events:none;
}
#mv_weeks_3 .tit {
  position:absolute;
  left:2%;
  top:0;
  width: max(500px, 40%);
  height: 100%;
  z-index: 2;
}
#mv_weeks_3 .tit img {
  position:absolute;
  display: block;
  width: 94%;
  height:92%;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  object-fit: contain;

}
#mv_weeks_3 .blk_bk {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  z-index: 1;
  overflow: hidden;

}
#mv_weeks_3 .blk_bk::before {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
  min-width: 1600px;
	height: 100%;
	left:50%;
	top:0;
  background-image: url('../images/weeks3/img_2.jpg');
	background-position: 50% 50%;
	background-size: 100% auto;
  transform:translateX(-50%);
}
#mv_weeks_3 .blk_bk::after {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
  height: 100%;
	left:max(600px, 45%);
	top:0;
  background-image: url('../images/weeks3/img_1.png');
	background-position: 100% 50%;
	background-size:  auto 100%;
  transform: translateX(-100%);
}
/***************************************************************************************************
  responsive
***************************************************************************************************/

@media screen and (max-width: 1000px) {
/*
*/
#mv_weeks_3 .mv_content {
  left:3%;
  top:0;
  width:94%;
  height: calc(100% - 25px);
  transform:none;
  pointer-events: none;
}
#mv_weeks_3 .tit {
  left:2%;
  top:60px;
  width:96%;
  height: calc(45% - 40px);
  background-image: url('../images/weeks3/img_3_sp.png');
	background-position: 50% 50%;
	background-size: contain;
}
#mv_weeks_3 .tit img {
  opacity: 0;
  pointer-events: none;
}
#mv_weeks_3 .blk_bk::before {
	width: 100%;
  min-width: 0;
	height: 60%;
	left:0;
	top:40%;
  background-image: url('../images/weeks3/img_2_sp.jpg');
	background-position: 50% 50%;
	background-size: cover;
  transform:none;
}
#mv_weeks_3 .blk_bk::after {
	width: 100%;
  height: 65%;
	left:0;
	top:0;
  background-image: url('../images/weeks3/img_1_2_sp.jpg'), url('../images/weeks3/img_1_sp.png');
	background-position: 50% -5px, 50% 100%;
	background-size: 1000px 50px, 1000px auto;
  transform: none;
}
#mv_weeks_3 .blk_bk_sp {
  position: absolute;
	width: 100%;
  max-width: 540px;
  height: 65%;
	left:50%;
	top:0;
  transform: translateX(-50%);
  z-index: 3;
}
#mv_weeks_3 .blk_bk_sp .bk_1 {
  position: absolute;
	width: 100px;
  height: 100px;
  left:0;
  top:calc(100% + min(30px, 5.2vw));
  transform: translateY(-152px);
  background-image: url('../images/weeks3/img_3_3_sp.png');
	background-position: 15px 100%;
	background-size: auto max(40px, min(55px, 8vh));
}
#mv_weeks_3 .blk_bk_sp .bk_2 {
  position: absolute;
	width: 100px;
  height: 100px;
  left:0;
  top:0;
  background-image: url('../images/weeks3/img_3_1_sp.png');
	background-position: 10px 10px;
	background-size: auto max(45px, min(60px, 8vh));
}
#mv_weeks_3 .blk_bk_sp .bk_3 {
  position: absolute;
	width: 100px;
  height: 100px;
  left:calc(100% - 100px);
  top:0;
  background-image: url('../images/weeks3/img_3_2_sp.png');
	background-position: calc(100% - 10px) 10px;
	background-size: auto max(45px, min(60px, 8vh));
}


/*  */

}