html,body{height: 100%;}

#main02{height: 100%;}
#main02 #particle-canvas{height: 100%; opacity: 0.1;}

#main02 .mv{position:relative; width: 100%; height: 100%;}
#main02 .mv .slide_ctn{width: 100%; height: 100%;}
#main02 .mv .slide_ctn .slick-track,
#main02 .mv .slide_ctn .slick-list{height: 100%;}
#main02 .mv .slide_ctn .mv_img{width: 100%; height: 100%;}
#main02 .mv .slide_ctn .mv01{background:url(/img/main/mv01.jpg) 50% 50% no-repeat; background-size:cover;height: 100%;}
#main02 .mv .slide_ctn .mv01 .ani_img{position:absolute; top: 100px; left: 45vw; z-index: 10; animation:asMove 10s infinite alternate linear}
#main02 .mv .slide_ctn .mv02{background:url(/img/main/mv02.jpg) 50% 50% no-repeat; background-size:cover}
#main02 .mv .slide_ctn .mv02 .ani_img{position:absolute; top: 100px; left: 85px; animation:mMove 1s infinite linear}
#main02 .mv .slide_ctn .mv02 .ani_img.img02{top:-70px; left:420px; animation:mMove 1.5s infinite linear}
#main02 .mv .slide_ctn .mv02 .ani_img.img03{top:164px; left:580px; animation:mMove 3s infinite linear}
#main02 .mv .slide_ctn .mv02 .ani_img.img04{top:-38px; left:962px; animation:mMove 2s infinite linear}
#main02 .mv .slide_ctn .mv02 .ani_img.img05{top:376px; left:900px; animation:mMove 4s infinite linear}
#main02 .mv .slide_txt{position: absolute; top: 50%; left: 0; transform:translateY(-50%); z-index: 11; width: 100%; padding: 0 60px; box-sizing:border-box;}
#main02 .mv .slide_txt .item{}
#main02 .mv .slide_txt .item h2{font-weight:300; font-size:45px; letter-spacing:-0.03em; color: #fff;}
#main02 .mv .slide_txt .item h2 span{font-weight:bold;}
#main02 .mv .slide_txt .item P{font-weight:300; font-size:16px; letter-spacing:-0.03em; color: #fff; line-height:1.7em; margin-top:28px; margin-bottom:55px;}
#main02 .mv .slide_txt .item .btn{width: 200px; height: 60px; box-sizing:border-box; border-top: 1px solid #fff; border-bottom: 1px solid #fff;  opacity: 0.4;}
#main02 .mv .slide_txt .item .btn a{display:inline-block; width: 100%; vertical-align: top; width: 100%; height: 100%; line-height:60px; color: #fff; font-family: 'Montserrat', sans-serif; font-weight:400;}
#main02 .mv .slide_txt .item .btn a i{background:url(/img/main/icon_m_arrow.png) 50% 50% no-repeat; background-size:cover; display:inline-block; width: 12px; height: 11px; margin-left: 15px;}
#main02 .mv .slide_txt .item .btn:hover{opacity: 1; background:#005aab; border-top:1px solid #005aab; border-bottom: 1px solid #005aab;}
#main02 .mv > .slide_dots{display:none; }
#main02 .mv .slide_btn{position:absolute; bottom: 160px; left: 60px; z-index: 100; padding-right: 50px;}
#main02 .mv .slide_btn span{position:absolute; top: 0;right: 0; display:inline-block; width: 30px; height: 30px; text-align: center; cursor: pointer;}
#main02 .mv .slide_btn span.play{display:none; }
#main02 .mv .slide_btn span.on{display:none;}
#main02 .mv .slide_btn span.play.on{display:block;}
#main02 .mv .slide_btn span > i{font-size:16px; color: #fff; margin: 7px 0;}
#main02 .mv .slide_btn .slick-dots li{position: relative; width: 32px; height: 32px; display:inline-block; vertical-align: top;}
#main02 .mv .slide_btn .slick-dots li button{outline:none; border:none; position:absolute; top: 50%; left: 50%; width: 4px; height: 4px; background: #fff; font-size:0; border-radius:2px; transform:translate(-50%,-50%);}
#main02 .mv .slide_btn .slick-dots li .slide_dots{position:absolute; top: 0; left: 0; opacity: 0;}
#main02 .mv .slide_btn .slick-dots li.slick-active .slide_dots{opacity: 1;}
#main02 .mv .slide_btn .slick-dots li.slick-active .slide_dots .p_bar{animation:c_progress 4s both}
#main02 .mv .slide_btn .slick-dots li.slick-active .slide_dots.on .p_bar{display:none; }
/* #main02 .mv .slide_txt .item.slick-active h2{animation:fadeDown 1.7s both}
#main02 .mv .slide_txt .item.slick-active p{animation:fadeLeft 1.9s 0.8s both} */

@keyframes c_progress{
	0%{stroke-dashoffset:95; }
	100%{stroke-dashoffset:0; }
}

@keyframes asMove{
	0%{transform:translate(-30px,-60px)}
	100%{transform:translate(30px,60px)}
}

@keyframes mMove{
	0%{transform:translate(0,0); opacity: 0;}
	50%{transform:translate(-300px,300px); opacity: 1;}
	100%{transform:translate(-600px,600px); opacity: 0;}
}

@keyframes fadeDown{
	0%{transform:translateY(-160px); opacity: 0;}
	100%{transform:translateY(0); opacity: 1;}
}

@keyframes fadeLeft{
	0%{transform:translateX(-360px); opacity: 0;}
	100%{transform:translateX(0); opacity: 1;}
}


@media screen and (max-width:1000px){
	#main02 .mv .slide_txt{top: 43%; padding: 0 16px;}
	#main02 .mv .slide_txt .item h2{font-size:38px;}
	#main02 .mv .slide_txt .item P{margin-bottom:30px;}
	#main02 .mv .slide_btn{left: 16px;}

	#main02 .mv .slide_ctn .mv02 .ani_img.img05{top: 0; left: 250px;}
	#main02 .mv .slide_ctn .mv02 .ani_img.img04{top: -38px; left: 181px;}
}

@media screen and (max-width:800px){
	#main02 .mv .slide_txt .item h2{font-size:32px; word-break:keep-all}
	#main02 .mv .slide_txt .item P{margin-bottom:30px; word-break:keep-all}
	#main02 .mv .slide_btn{left: 16px;}
	#main02 .mv .slide_ctn .mv02 .ani_img.img02{left: 350px;}
	#main02 .mv .slide_ctn .mv02 .ani_img.img03{left: 300px;}
}