
/*-------------------ANIMATION------------------------*/
.animation-swiper{z-index:1;}
.animation01{width:100%; height:100%; padding-top:160px; position:relative;overflow:hidden;}
.animation01 img{position:absolute;}
.animation01 iframe{position:absolute; top:calc(50% - 200px) !important; left:calc(50% - 500px) !important;}
.ani-detail iframe{top:calc(50% - 250px) !important;}

.animation02{width:100%; height:auto; margin:0 auto;background:#f9f9f9;padding:80px;}
.ani02_frame{width:1200px; margin:0 auto; height:100%;}
.ani02_frame p{font-size:26px; padding-bottom:50px; font-weight:500;}
.ani02_frame article.season {margin: 30px 0; text-align: center;}
.ani02_frame h4{margin-bottom: 30px; display: inline-block; padding: 4px 20px; font-size:26px; color: #fff; background: #d2131b; border-radius: 16px;}
.ani02_frame .roll .slick-arrow {
	top: 130px;
	width: 27px; height: 86px;
	background: url(/img/animation/animation-left.png) no-repeat center/contain;
}
.ani02_frame .roll .slick-next {background-image: url(/img/animation/animation-right.png); right: -50px;}
.ani02_frame .roll .slick-prev {left: -55px;}
.ani_play{width:100%; height:auto;}
.ani_play_box{width:auto;margin-bottom:20px; height:240px;display:inline-block; overflow:hidden;}
.ani_play_box p{font-size:16px; padding:5px 0; font-weight:400; text-align:center; background: #eee; border: 1px solid #ccc;}
.ani_play_box img{width:280px; height: 200px; cursor:pointer;  transition:all 0.5s;}
/*.ani_play_box img:hover{transform:scale(1.1);}*/
.no-margin{margin-right:0;}

	/*animation-은하안전단*/
	.a-bg06{background:url('/img/animation/animation_galaxy_bg.jpg')no-repeat center center;background-size:cover;}
	.a-bg06:after {content:''; background:url('/img/animation/animation_galaxy_bg_line.png')no-repeat center center; width: 100%; height: 100%; position: absolute; top: 58%; left: 50%; transform: translate(-50%, -50%);}
	.ani_galaxy01{left:12%;width:350px;bottom:6%;}
	.ani_galaxy02{right:13%; bottom:6%;width:350px;}
	
	/*animation-벅스봇*/
	.a-bg05{background:url('/img/animation/animation_bugsbot_bg.jpg')no-repeat center center;background-size:cover;}
	.a-bg05 h4{font-size:34px; position:absolute; top:20%; color:#333; left:calc(50% - 225px);}

	/*animation-슈퍼윙스*/
	.a-bg01{background:url('/img/animation/animation_superwings_bg.jpg')no-repeat center center;background-size:cover;}
	.ani_super01{left:5%;width:400px;bottom:0;}
	.ani_super02{right:5%; bottom:0;width:400px;}
	.ani_super03{left:6%; top:23%;width:350px;}

	/*animation-로봇트레인*/
	.a-bg02{background:url('/img/animation/animation_robottrain_bg.jpg')no-repeat center center;background-size:cover;}
	.ani_robot01{right:80px;width:430px;bottom:250px;}
	.ani_robot02{left:5%; bottom:10px;width:400px;}
	.ani_robot03{left:100px; top:30%;width:400px;}

	/*animation-옥토넛*/
	.a-bg03{background:url('/img/animation_octonauts_bg.jpg')no-repeat center center;background-size:cover;}
	.ani_octo01{left:120px;width:480px;top:30%;}
	.ani_octo02{right:10%; bottom:50px;width:400px;}
	.ani_octo03{right:0; bottom:80px;width:280px;}

	/*animation-페파피그*/
	.a-bg04{background:url('/img/animation/animation_peppa_bg.jpg')no-repeat center center;background-size:cover;}
	.ani_peppa01{left:8%;width:370px;bottom:70px;}
	.ani_peppa02{right:10%; bottom:50px;width:400px;}

/*애니상세-벅스봇*/
.ani-detail{height:1200px !important; position:relative;}
.single-item{width:1000px !important; margin:0 auto !important; height:220px !important; position:absolute !important; bottom:50px; left:calc(50% - 500px);} 
.animation01 .slick-slide img{width:250px; padding:15px;z-index:1;}
.ani_d_text{margin:15px; position:absolute;width:220px !important;bottom:0;background:#fff;height:80px;padding:10px;}
.single-item h4{font-size:18px !important; position:static !important; color:#d47926;}
.single-item p{font-size:16px;}
		.ani-detail .slick-dots li{margin:0; width:80px; height:8px;}
		.ani-detail .slick-dots li button{padding:0; width:100%; height:100%;background:#dedede;}
		.ani-detail .slick-dots li button:hover:before, .slick-dots li button:focus:before{width:80px; height:8px; background:#f38624; opacity:1;}
		.ani-detail .slick-dots li button:before{font-size:0;}
		.ani-detail .slick-dots li.slick-active button{background:#f38624;}
		.ani-detail .slick-dots li button:before{content:none;}


/*-------------------------------------------------------------------------------*/

@media (max-width: 1760px) {
	.ani_robot03, .ani_robot02{width:350px;}
	.ani_robot01{width:400px; bottom:200px;}
}


@media (max-width: 1620px) {

	.ani_super01, .ani_robot03, .ani_robot02, .ani_robot01{width:300px;}
	.ani_super02, .ani_peppa02{top:inherit; bottom:0;width:300px;}		
	.animation01{padding-top:160px;}
	.ani_super01, .ani_robot03, .ani_robot02, .ani_peppa01{left:0;}
	.ani_super02, .ani_peppa02{right:0;}		
	.ani_super03{top:30%; left:0;width:300px;}		
	.ani_robot01{right:0;}	
	.ani_peppa01{width:300px; bottom:0;}
}

@media (max-width: 1520px) {
	.ani_super02, .ani_peppa02{top:inherit; bottom:0;width:300px;}		
	.ani_super03, .ani_robot03{top:25%; left:inherit; right:0; width:300px;}		
	.ani_robot01{right:0; bottom:0;}
	.ani_peppa01{width:300px; bottom:0;}

}

	/*모바일*/

	@media (max-width: 600px) {

		.brand-menu{background:rgba(255, 255, 255, 0.5);}

		/*컨텐츠*/
		.animation01{padding-top:60px; height:550px;}
		.animation01 iframe{top:calc(60% - 30%) !important; width:90% !important; height:300px !important; left:calc(50% - 45%) !important;}
		.ani_galaxy01, .ani_galaxy02, .ani_super01, .ani_robot03, .ani_robot02, .ani_super02, .ani_peppa02, .ani_super03, .ani_robot03, .ani_robot01, .ani_peppa01{display:none;}
		.animation02{padding:0;}
		.ani02_frame{width:90%;}
		.ani02_frame p{font-size:20px; padding:30px 0;}
		.ani_play{width:100%;}
		.ani_play_box{width:100%; height:auto; margin-right:0;}
		.ani_play_box p{font-size:14px; padding:10px 0 0 0;}
		.ani_play_box p span{display:none;}
		.bugs_box{width:auto; margin:10px !important;}

		.a-bg03{background:url('/img/mobile/m-ani-oct.jpg')no-repeat center center;background-size:cover;}
		
		.a-bg05 h4{font-size:20px; left:calc(50% - 140px); top:22%;}

		/*애니상세-벅스봇*/
		.ani-detail{height:750px !important;}
		.single-item{width:90% !important; height:170px !important;bottom:30px; left:5%;} 
		.animation01 .slick-slide img{width:170px; padding:10px;}
		.ani_d_text{width:170px !important;margin:0 10px; height:100px;border-right:1px solid #c9c9c9;}
		.single-item h4, .single-item p{font-size:14px !important; line-height:25px;}

		.ani_play_box img {width: 100%; height: 134px;}
		.ani02_frame .roll .slick-arrow {width: 13px;}
		.ani02_frame .roll .slick-next {right: -15px;}
		.ani02_frame .roll .slick-prev {left: -15px;}
	}

	
	@media (max-width: 599px) {
		
		/*애니상세-벅스봇*/
		.ani-detail{height:750px !important;}
		.single-item{width:90% !important; height:170px !important;bottom:30px; left:5%;} 
		.animation01 .slick-slide img{width:170px; padding:0;}
		.ani_d_text{width:170px !important;margin:0; height:80px;border-right:1px solid #c9c9c9;}
		.single-item h4, .single-item p{font-size:14px !important; line-height:25px;}
		.ani-detail .slick-dots{display:block !important;}
		.ani-detail .slick-dots li{height:5px !important; background:#fff; margin:0 !important;}
		.ani-detail .slick-dots li button:before{content:none !important;}
		.single-item li.slick-active{background:#c7111a;}
	}


	@media (max-width: 360px) {
		.single-item h4, .single-item p{font-size:13px !important;}
		.animation01 .slick-slide img{width:170px;}
	}