@charset "UTF-8";

/*컨텐츠공통*/
#menu7893_obj48,
#multipleContentsDiv_help_38{max-width:1400px;margin: 0 auto;overflow:hidden;position:relative;}
@media all and (max-width:1400px){
	#menu7893_obj48,
	#multipleContentsDiv_help_38{max-width:96%;}
}

/*1단퀵링크*/
#menu7893_obj48{position:absolute;left:50%;margin-left:-700px !important;top:70px;width:1400px !important;}
.quickLink ul{display:flex;flex-wrap:wrap;justify-content:space-between;}
.quickLink ul li{width:33%;text-align:center; border:1px solid rgba(255,255,255,.5); position:relative;padding-bottom:29px;}
.quickLink ul li:before{content:"";display:none;width:100%;height:100%;position:absolute;left:0;top:0;background:url(../../images/main/quickLink_bg.png) no-repeat center;background-size:cover;}
.quickLink ul li p,
.quickLink ul li a{position:relative;}
.quickLink ul li p{font-size:27px;color:#FFF;font-family:'Noto Medium';padding:30px 0 20px 0;}
.quickLink ul li p span{display:block;font-size:22px;}
.quickLink ul li p:before{content:"";display:block;width:65px;height:58px;margin: 0 auto 20px auto;background-size:100% !important;}
.quickLink ul li.li_1 p:before{background:url(../../images/main/icon_1.png) no-repeat center;}
.quickLink ul li.li_2 p:before{background:url(../../images/main/icon_2.png) no-repeat center;}
.quickLink ul li.li_3 p:before{background:url(../../images/main/icon_3.png) no-repeat center;}
.quickLink ul li a{display:inline-block;color:#FFF;font-size:15px;border:1px solid rgba(255,255,255,.5);padding:5px 15px;margin:0 5px;}
.quickLink ul li a:after{content:"";display:inline-block;width:32px;height:6px;background:url(../../images/main/arrow_8_r_w.png);margin-left:10px;vertical-align:4px;}

@media all and (min-width:1025px){
	.quickLink ul li:hover{border-color:transparent;}
	.quickLink ul li:hover:before{display:block;}
}
@media all and (max-width:1400px){
	#menu7893_obj48{left:2%;margin-left:0 !important;width:96% !important;}
}
@media all and (max-width:1024px){
.quickLink ul{display:block;width:90%;margin: 0 auto;}
.quickLink ul li{width:100%;text-align:left;border:0;border-bottom:1px solid rgba(255,255,255,.5);padding:15px 0;overflow:hidden;}
.quickLink ul li.li_2{margin:0;}
.quickLink ul li.li_3{border:0;}
.quickLink ul li p{font-size:20px;padding:0 0 0 55px;display:inline-block;}
.quickLink ul li p span{display:inline;font-size:16px;padding-left:10px;}
.quickLink ul li p:before{width:35px;height:31px;margin:0;position:absolute;left:0;top:0;}
.quickLink ul li a{border-radius:30px;padding:3px 10px;margin:3px 0 0 5px;float:right;}
.quickLink ul li a:after{display:none;}
}
@media all and (max-width:768px){
	#menu7893_obj48{top:30px;}
	.quickLink ul li p{font-size:18px;}
	.quickLink ul li p span{display:block;padding-left:0;}
}

/*2단*/
/*구조*/
#multipleDiv_help_38{margin-top:-60px;}
#multipleContentsDiv_help_38{padding:30px 15px 60px 25px;background:#FFF;}
#menu7893_obj9{width:48% !important;float:left;padding-right:4%;}
#menu7893_obj185{width: 25% !important; float: left;}
#menu7893_obj15{width:calc(52% - 325px) !important;float:left;padding-right:3%;}
#menu7893_obj51{width:25% !important;float:right;}
@media all and (max-width: 1400px){
	.wrap-popup .control{width: calc(100% - 40px);}
	#menu7893_obj9{width:45% !important;}
	#menu7893_obj185{width: 30% !important;}
}
@media all and (max-width:1280px){
	#menu7893_obj9{width:38% !important;}
	#menu7893_obj185{width: 35% !important;}
	#menu7893_obj15{width:calc(62% - 325px) !important;}
}
@media all and (max-width:1024px){
	#multipleContentsDiv_help_38{padding:30px 20px;}
	#menu7893_obj9{width:50% !important;padding-right: 0; float: left;}
	#menu7893_obj185{width: 47.5% !important; float: right;}
	#menu7893_obj15{width:47.5% !important;padding-right:0;float:right;}
	#menu7893_obj51{width:100% !important;float:none; clear:both; padding-top: 10px !important;}
}
@media all and (max-width:768px){
	#menu7893_obj9,
	#menu7893_obj15, #menu7893_obj185{width:100% !important;float:none;}
	#menu7893_obj15{margin-top:40px;}
}

/*배너*/
.banner{padding:0 10px 10px 0;}
.banner ul{display:flex;flex-wrap:wrap;justify-content:space-between;}
.banner ul li{width:49.5%;}
.banner ul li a{display:block;box-sizing:border-box;text-align:center;border:1px solid #DDD;padding:25px 10px;position:relative;height:100%;}
.banner ul li a:before{content:"";display:block;width:40px;height:1px;background:#DDD;position:absolute;top:0;left:0;transform: rotate(45deg);transform-origin:0 0;}
.banner ul li a span{display:block;}
.banner ul li a span:before{content:"";display:block;margin:0 auto 10px auto;width:43px;height:32px;background-size:100% !important;}
.banner ul li a.a_1 span:before{background:url(../../images/main/icon_5.png) no-repeat center;}
.banner ul li a.a_2 span:before{background:url(../../images/main/icon_6.png) no-repeat center;}
.banner div{margin-top:20px;box-shadow:3px 3px 5px #DDD;}
.banner div a{display:block;text-align:center;background:url(../../images/main/banner_bg.png) no-repeat center;background-size:cover;}
.banner div a:before,
.banner div a:after{content:"";display:inline-block;}
.banner div a:before{display: none; width:42px;height:39px;vertical-align:-13px;background:url(../../images/main/icon_9.png) no-repeat center;}
.banner div a:after{width:21px;height:21px;vertical-align:-2px;background:url(../../images/main/play_2_w.png) no-repeat center;border:2px solid #FFF;border-radius:30px;}
.banner div a span{display:inline-block;font-size:17px;color:#FFF;font-family:'Noto Medium';padding:27px 10px;}
@media all and (min-width:1025px){
	.banner ul li a:hover span:before,
	.banner div a:hover:after{transform: rotatey(360deg);transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);}
}
@media all and (max-width:1024px){
	.banner{padding:0;overflow:hidden;margin-top:20px;}
	.banner ul{width:50%;float:left;}
	.banner div{width:47.5%;float:right;margin-top:0;box-shadow:none;}
	.banner div a span{padding:44px 10px;}
}
@media all and (max-width:768px){
	.banner ul{width:100%;float:none;}
	.banner div{width:100%;float:none;margin-top:10px;}
	.banner div a span{padding:25px 10px;}
}
@media all and (max-width:320px){
	.banner ul li{width:100%;margin-bottom:5px;}
	.banner ul li a{padding:15px 10px;}
	.banner ul li a:before,
	.banner ul li a span:before{display:none;}
	.banner div a:before,
	.banner div a:after{display:none;}
	.banner div a span{font-size:16px;padding:15px 10px;}
}
