@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean');

* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;}

body, ul{margin:0; padding:0; font-family: 'Noto Sans KR', sans-serif;}
li{list-style:none;}
h1, h2, h3, h4, h5, p, a {font-family: 'Noto Sans KR', sans-serif; text-decoration:none; margin:0; padding:0;color:#404040;}



/*-------------------main-header---------------*/
.main_header{width:100%;background:#fff; height:80px; position:fixed; z-index:99;margin:0 auto;}
.main_header img{width:130px;float:left;margin-left:6%; margin-top:24px;}
.menu{text-align:center; margin:0 auto; width:600px;}
.menu li{float:left; height:100%; width:33.33%;line-height:80px; }
.menu li a{color:#404040;font-size:18px; font-weight:500;padding:0 10px;}
.menu li a:hover{padding-bottom:23px !important;border-bottom:4px solid rgb(0 78 98);}
.menu_border{padding-bottom:24px !important;border-bottom:4px solid rgb(0 78 98);}
.menu_line{padding-bottom:28px !important;border-bottom:4px solid rgb(0 78 98);}
.main_header select{float:right; font-size:13px; border:none; line-height:100px;font-family: 'Noto Sans KR', sans-serif; width:60px; padding:29px 0; margin-right:5%;}
.main_header select option{border:none;}

.m-header{display:none;}


/*popup*/
.popup01{width:380px; height:550px; position:absolute; top:100px; left:40px;z-index:11;}
.popup01 img{width:100%;}
.popup01 a{width:100%; height:30px; position:absolute; bottom:30px; left:0;}
.popup01 button{border:none; background:#241917; font-size:14px; color:#fff;width:100%; text-align:right; padding:0 15px 5px 0;position:absolute;bottom:0; right:0;}
.popup01 button div{width:10px; height:10px;background:#fff;display:inline-block; margin-right:10px;}

/*-------------------MAIN---------------*/
.videobcg { 
     position: absolute;
     top: 0px;
     left: 0px;
     min-width: 100%;
     min-height: 100%;
     width: auto;
     height: auto;
     overflow: hidden;
}
.main-point, .m-img-bugs{display:none;}

/*main-contents*/
.overlay{position:absolute; opacity:0.7;top:0; left:0;min-width: 100%; min-height: 100%;}
.title{width:1400px;z-index:4; margin:0 auto; position:absolute; top:130px;}
.title h3{color:#fff;text-align:center;font-size:26px;font-weight:400; text-shadow:2px 2px 2px #1b3365;}
.title p{color:#fff;font-size:110px; font-weight:800; letter-spacing:-5px; margin-top:-14px; text-shadow:2px 2px 2px #1b3365;}
.title span {font-size: 90px; font-weight: 700; letter-spacing: -5px;}
.font h3{font-family: 'Furore';}
.font p{font-family: 'Furore';}
.title img{width:100%;margin:0 auto;}
.visual-inner .swiper-slide {position: relative;}
.visual-inner .main-img {width:100%;height:100%;z-index:1;}
.visual-inner .main-img img {
    position: absolute;
    bottom: 150px; left: 50%; transform: translateX(-50%);
    max-height: 50%;
}

.visual-inner .swiper-slide-active .main-img img {transition: all 1.5s cubic-bezier(0.7, 0, 0.2, 1);}
.visual-inner .swiper-slide-active .main-img .left {transform: translateX(-110%);}
.visual-inner .swiper-slide-active .main-img .right {transform: translateX(20%);}
.visual-inner .shortcut-wrap {
    position: absolute;
    right: 9%;
    top: 50%;
    z-index: 2;
}
.visual-inner .shortcut-wrap a {
	display: inline-block;
    padding: 10px 33px;
    font-size: 18px;
    color: #333;
    letter-spacing: -1px;
    background: #fff;
    border-radius: 50px;
}
.small-logo{position:absolute; right:10%; top:30%;z-index:2;}
.small-logo img{width:130%;}
.page_btn {
    position: absolute;
    right: 8%;
    top: 50%;
    z-index: 2;
}
.page_btn a {
	display: inline-block;
    padding: 10px 33px;
    font-size: 18px;
    color: #fff;
    letter-spacing: -1px;
    background: #1d8f4b;
    border-radius: 50px;
}
.egg_btn {top: 42%;}
.egg_btn a {
	background: #fff;
    color: #000;
}

/*main 애니메이션 효과*/
.swiper-container .swiper-slide.swiper-slide-active .main-img1 img{transition:transform 1.5s cubic-bezier(0.7, 0, 0.2, 1); transform:translate(0);}
.swiper-container .swiper-slide.swiper-slide-active .main-img2 img{transition:transform 2.0s cubic-bezier(0.7, 0, 0.2, 1); transform:translate(0);}

/*MAIN 하단메뉴*/
.menu-bottom{position:absolute; bottom:0; left:0;width:100%; height:100px;z-index:1;}
.menu-bottom ul{width:100%; height:100%;}
.menu-bottom ul li{width:calc(20% - 2px); height:100%;margin-right:2px;float:left;}
.swiper-pagination-h {
	display: flex;
	justify-content: center;
	gap: 0 0.333%;
}
.swiper-pagination-h span{border-radius:0;width:14.28%; margin:0 !important;margin-right:1px; height:76px; opacity:1;background-size:40% !important; }
/* .swiper-pagination-h span:first-child{background:url('/img/logo/bugsbot_logo_off2.png')no-repeat center 100%;}
.swiper-pagination-h span:nth-child(2){background:url('/img/logo/superwings_logo_off2.png')no-repeat center 100%;} */


.swiper-pagination-h span {
	background: no-repeat center;
	background-color: rgba(255,255,255,.5);
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
}
/* .swiper-pagination-h span:nth-child(2){background:url('/img/logo/peppapig_logo_off2.png')no-repeat center 100%;}
.swiper-pagination-h span:nth-child(3){background:url('/img/logo/octonauts_logo_off2.png')no-repeat center 100%;}
.swiper-pagination-h span:nth-child(4){background:url('/img/logo/crayola_logo_off2.png')no-repeat center 100%;}
.swiper-pagination-h span:last-child{background:url('/img/logo/egg_logo_off2.png')no-repeat center 100%;} */


/* .swiper-pagination-h span:last-child{background:url('/img/logo/crayola_logo_off2.png')no-repeat center 100%;margin-right:0 !important;} */

/* .swiper-pagination-h .bottom1.swiper-pagination-bullet-active{background:url('/img/logo/bugsbot_logo_on2.png')no-repeat center 100%;background-size:99%;}
.swiper-pagination-h .bottom2.swiper-pagination-bullet-active{background:url('/img/logo/superwings_logo_on3.png')no-repeat center 100%;background-size:99%;} */

/* .swiper-pagination-h .bottom1.swiper-pagination-bullet-active{background:url('/img/logo/galaxy_logo_on2.png')no-repeat center 100%;background-size:99%;}
.swiper-pagination-h .bottom2.swiper-pagination-bullet-active{background:url('/img/logo/peppapig_logo_on2.png')no-repeat center 100%;background-size:99%;}
.swiper-pagination-h .bottom3.swiper-pagination-bullet-active{background:url('/img/logo/octonauts_logo_on3.png')no-repeat center 100%;background-size:99%;}
.swiper-pagination-h .bottom4.swiper-pagination-bullet-active{background:url('/img/logo/crayola_logo_on3.png')no-repeat center 100%;background-size:99%;}
.swiper-pagination-h .bottom5.swiper-pagination-bullet-active{background:url('/img/logo/egg_logo_on2.png')no-repeat center 100%;background-size:99%;} */

/* .swiper-pagination-h .bottom5.swiper-pagination-bullet-active{background:url('/img/logo/crayola_logo_on3.png')no-repeat center 100%;background-size:99%;} */


/*-------------------footer---------------*/
footer{width:100%; position:absolute; bottom:0;height:50px; background:#404040;}
.w-footer{display:block; padding: 15px 0;}
.m-footer{display:none;}
footer p{color:#8c8c8c; text-align:center; font-size:14px;}


/* =============== 221219 추가 === */
.menu-pc .drop-down-menu.focus a {
    padding-bottom: 23px !important;
    border-bottom: 4px solid rgb(0 78 98);
}
.menu-pc .brand-depth {
    position: absolute;
    display: flex;
    top: 80px; left: 0;
    width: 100vw; height: 224px;
    background: #fff;
    border-top: 1px solid #ececec;
    display: none;
}
.menu-pc .brand-depth .brand-menu-area {
    display: flex;
    margin: 49px 0 0 115px;
    justify-content: space-between;
}
.menu-pc .brand-menu-area p.name {
    line-height: 1;
    font-size: 28px; color: rgb(0 78 98);
    font-weight: 700;
}
.menu-pc .brand-menu-area .depth2-box {
    margin-top: -8px;
    width: calc(100% - 188px);
}
.menu-pc .brand-menu-area .depth2-box li {
    width: 10%; height: auto;
    line-height: 1;
}
.menu-pc .brand-menu-area .depth2-box li:nth-child(n+11) {margin-top: 32px;}
.menu-pc .brand-menu-area .depth2-box li a {
    position: relative;
    display: block;
    height: 46px;
    padding: 0 !important; border: 0 !important;
}
.menu-pc .brand-menu-area .depth2-box li a img {
    position: absolute;
    top: 50%; left: 50%; transform: translate(-50%,-50%);
    width: auto;
    max-width: 86px; max-height: 40px;
    float: none;
    margin: 0;
}
/*
.menu-pc .brand-depth .right-img-area {
    position: absolute;
    top: 0; right: 0;
    width: 760px; height: 100%;
}
.menu-pc .brand-depth .right-img-area img {
    width: 100%; height: 100%;
    object-fit: cover;
    padding: 0; margin: 0;
}
*/

@media screen and (max-width: 1800px){.menu-pc .brand-depth .right-img-area {width: 680px;}}
@media screen and (max-width: 1700px){.menu-pc .brand-depth .right-img-area {width: 580px;}}
@media screen and (max-width: 1600px){
    .menu-pc .brand-depth .right-img-area {display: none;}
    .menu-pc .brand-depth {height: auto;}
    .menu-pc .brand-depth .brand-menu-area {
        width: 100%;
        margin: 0;
        padding: 49px 65px 70px;
    }
    .menu-pc .brand-menu-area .depth2-box li {width: 14.285%;}
    .menu-pc .brand-menu-area .depth2-box li:nth-child(n+6) {margin-top: 0;}
    .menu-pc .brand-menu-area .depth2-box li:nth-child(n+8) {margin-top: 32px;}
}


/*-------------------------------------------------------------------------------*/

@media (max-width: 1620px) {

	.small-logo img{width:110%;}

}

/*모바일*/
@media (max-width: 600px) {
	/*메뉴*/
	.main_header{display:none;}
	.m-header{display:block; position:fixed; z-index:11;width:100%; height:60px;background:#fff;}
	.menu-box{width:60px; margin-bottom:10px;}
	.m-header>a>img{width:85px; margin:0 0 30px 15px;}
	.menu{display:none;width:100%; height:100%; background:#fff;position:relative;border-top:1px solid #dedede; }
	.menu li a:hover{border:none;}
	.red-box{border-right:4px solid rgb(0 78 98); display:block;}
	.menu li{float:inherit; height:60px; width:35%;text-align:left; line-height:60px;}
	.menu>li>a{font-size:16px;font-weight:400;display:block;}
	.m-close{display:none; float:right; width:25px; margin:11px 10px 0 0;}
	.m-sub-menu{position:absolute; top:0; left:35%; width:65%; height:70%; background:#fff; border-left:1px solid #dedede; overflow-y:scroll;}
	.m-sub02, .m-sub03{display:none;}
	.m-sub04{height:100%; top:inherit; bottom:0; z-index:1}
	.scroll-icon{display:none;width:12%; position:absolute; bottom:5%; right:calc(40% - 12%);}


	.m-sub-menu>li{width:100%; height:60px;}
	.m-sub-menu>li>a{width:100%; height:100%; font-size:14px;font-weight:400;display:block;padding:0; padding-left:45%; text-align:left;}
	.m-header select{color:rgb(0 78 98); border:none; background:transparent; position:absolute; top:20px; right:20px;}
	.m-header select option{color:#404040;}
    .visual-inner .main-img img {bottom: 110px;}
    .visual-inner .swiper-slide-active .main-img .left {transform: translateX(-70%);}
    .visual-inner .swiper-slide-active .main-img .right {transform: translateX(-30%);}.visual-inner .shortcut-wrap {
		    right: auto;
			left: 4%;
			top: 41%;
			z-index: 3;
			margin: 0 10px;
	}
	.visual-inner .shortcut-wrap a {padding: 10px 20px;}

    /* ======= 221219 추가 === */
    .menu .brand-depth li a {
        display: flex;
        padding-left: 0;
        padding: 0 !important;
    }
    .menu .brand-depth li a .logo-box {
        position: relative;
        width: 42.5%;
    }
    .menu .brand-depth li a img {
        position: absolute;
        top: 50%; left: 50%; transform: translate(-50%,-50%);
        max-width: 66px; max-height: 36px;
    }
    .menu .brand-depth li a .brand-name {
        width: 57.5%;
    }


		 /*브랜드서브메뉴단*/
		.menu-b01{background:url('/img/logo/galaxy_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b02{background:url('/img/logo/bugsbot_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b03{background:url('/img/logo/superwings_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b04{background:url('/img/logo/peppapig_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b05{background:url('/img/logo/octonauts_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b06{background:url('/img/logo/crayola_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b07{background:url('/img/logo/ssangmoon_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b08{background:url('/img/logo/davidRC_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b09{background:url('/img/logo/robot_train_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-b10{background:url('/img/logo/egg_logo_on.png')no-repeat -20% 50%; background-size:60%;}

		 /*애니메이션서브메뉴단*/
		.menu-a01{background:url('/img/logo/galaxy_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-a02{background:url('/img/logo/bugsbot_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-a03{background:url('/img/logo/superwings_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-a04{background:url('/img/logo/robot_train_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-a05{background:url('/img/logo/peppapig_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-a06{background:url('/img/logo/octonauts_logo_on.png')no-repeat -20% 50%; background-size:60%;}

		 /*제품서브메뉴단*/
		 /*
		.menu-p01{background:url('/img/logo/bugsbot_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p02{background:url('/img/logo/superwings_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p03{background:url('/img/logo/peppapig_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p04{background:url('/img/logo/octonauts_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p05{background:url('/img/logo/crayola_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p06{background:url('/img/logo/robot_train_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p07{background:url('/img/logo/ssangmoon_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p08{background:url('/img/logo/davidRC_logo_on.png')no-repeat -20% 50%; background-size:60%;}
		.menu-p09{background:url('/img/product/logo/p-teans-logo.png')no-repeat -10% 50%; background-size:50%;}
		.menu-p10{background:url('/img/product/logo/p-etc-logo.png')no-repeat -10% 50%; background-size:50%;}
		*/
		.m-sub03>img{position:absolute; bottom:0; right:10%; width:50%;}
		.m-sub03 li {position: relative;}
		.m-sub03 li img {position: absolute; top: 50%; transform: translateY(-50%); width: 40%;}


	/*메인*/
	#videobcg, .v-play, .swiper-pagination-h, .popup01, .main-img1, .main-img2{display:none;}
	.overlay{background-size:cover; opacity:1;}
	/* .m-back01{background:url('/img/mobile/m-main-bugs.jpg')no-repeat center !important; } */
/* 	.m-back01{background:url('/img/mobile/m-main-galaxy.jpg')no-repeat center !important; }
	.m-back02{background:url('/img/mobile/m-main-super.jpg')no-repeat center !important; }
	.m-back03{background:url('/img/mobile/m-main-peppa.jpg')no-repeat center !important; }
	.m-back04{background:url('/img/mobile/m-main-octonaut.jpg')no-repeat center !important; }
	.m-back05{background:url('/img/mobile/m-main-crayola.jpg')no-repeat center !important; }
	.m-back06{background:url('/img/mobile/m-main-egg.jpg')no-repeat center !important; } */
	.main-point{display:block;width:130px; z-index:2; position:absolute; bottom:0px; right:0;}

	.small-logo{left:0%;top:30%; right:inherit; z-index:3;}
	.small-logo img{width:80%;}
	.page_btn {
		right: auto;
		left: 4%;
		top: 41%;
		z-index: 3;
		margin: 0 10px;
	}
	.page_btn a {
		padding: 10px 20px;
	}
	.egg_btn {top: 37%;}

	.title{width:100%; top:12%;}
	.title h3{font-size:16px;}
	.title p{font-size:1.9rem; margin-top:-10px; letter-spacing:-2px;} 
	.middle-title{left:0;}


		/*은하안전단*/
		.m-img-galaxy{display:block;width:100%; height:100%; z-index:3;}
		.m-galaxy1{width: 75%; position: absolute; bottom: 80px; right: 0; transform:translate(200px, 0); z-index:2;}
		.m-galaxy2{width: 56%; position: absolute; bottom: 87px; left: 35px; transform:translate(350px, 0); z-index:3;}
		.m-galaxy3{width: 59%; position: absolute; bottom: 109px; left: 54px; transform:translate(280px, 0);}

		.swiper-container .swiper-slide.swiper-slide-active .m-img-galaxy img:nth-child(1), .swiper-container .swiper-slide.swiper-slide-active .m-img-super img{transition:transform 1.5s cubic-bezier(0.7, 0, 0.2, 1); transform:translate(0);}
		.swiper-container .swiper-slide.swiper-slide-active .m-img-galaxy img:nth-child(2){transition:transform 2.5s cubic-bezier(0.7, 0, 0.2, 1); transform:translate(0);}
		.swiper-container .swiper-slide.swiper-slide-active .m-img-galaxy img:nth-child(3){transition:transform 2.5s cubic-bezier(0.7, 0, 0.2, 1); transform:translate(0);}

	

	.swiper-pagination-bullets{top:unset !important; bottom:60px;right:calc(50% - 75px) !important;}
	.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{display:inline-block !important; margin:0 10px !important;}
	
	footer{height:57px;}
	.w-footer{display:none;}
	.m-footer{display:block;}
	footer p{font-size:12px; padding:10px 0;text-align:center; line-height:1;}
}