@charset "utf-8";

#wrap{margin:0;}

/* Main Visual */
.mv_sec {overflow: hidden; position: relative; background-color: #000;}
.mv_sec .video {width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 1;}
.mv_sec .mv_img {opacity: 0; transition: all 0.5s; width: 100%; position: relative; z-index: 2;}
.mv_sec .mv_img_pc {display: block;}
.mv_sec .mv_img_m {display: none;}
.mv_sec .slogan {max-width: 1440px; width: 100%; position: absolute; top: 365px; left: 50%; transform: translateX(-50%); display: flex; justify-content: flex-end; z-index: 3;}
.mv_sec .slogan div {max-width: 750px; width: 100%;}
.mv_sec .slogan h2 {font-size: 4.6875em; line-height: 1; color: #fff; font-weight: 700; text-align: center; position: relative; opacity: 0; top: 50px;  transition: 0.5s 0.5s;}
.mv_sec .slogan h4 {font-size: 2em; line-height: 1; color: #fff; font-weight: 500; text-align: center; margin-top: 35px; position: relative; opacity: 0; top: 50px;  transition: 0.5s 0.75s;}
.mv_sec ul {position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 3; max-width: 1440px; width: 100%; justify-content: space-between; opacity: 0; transition: 0.5s 1s;}
.mv_sec ul li {max-width: 197px; width: 13.4%; background-color: #fff; border-radius: 5px; padding: 18px 0;}
.mv_sec ul li img {display: block; max-width: 80%; margin: 0 auto;}
.mv_sec .skip_btn {position: absolute; bottom: 60px; right: 30px; background-color: #e5222a; font-weight: 600; text-align: center; font-size: 1em; color: #fff; line-height: 2; padding: 10px 20px; z-index: 5; overflow: hidden; border-radius: 5px;}

.mv_sec .mv_img.on {opacity: 1;}
.mv_sec .slogan.on h2,
.mv_sec .slogan.on h4 {opacity: 1; top: 0;}
.mv_sec ul.on {opacity: 1; bottom: 40px;}