@charset "utf-8";

div{box-sizing:border-box;-webkit-box-sizing:border-box}

.pc{display:block}
.mo{display:none}

.layout{width:1200px;height:100%;margin:0 auto}
.layout:after{content:"";display:block;clear:both}

.ir{overflow:hidden}
.ir:before{content:"";display:inline-block;vertical-align:top;width:100%;height:100%}

button{background-color:transparent}

/************/ 

#wrap{position:relative;width:100%;overflow:hidden}

#header{position:relative;z-index:100;height:78px}
#animate{position:relative;overflow:hidden}
#animate:before{
	content:"";position:absolute;top:0;left:0;right:0;height:100%;opacity:0;
	background:url(/images/cyber/common/animate-pattern.png);
	transition:opacity 300ms ease-in-out;
	-webkit-transition:opacity 300ms ease-in-out;
}

#animate:after{content:"";position:absolute;top:78px;left:0;right:0;height:1px;background:#5d5f5e}

#animate.open:before{opacity:1}
#animate .style{padding:0 20px}


#header #logo,#header #sitelink{position:relative;z-index:1}
#header #logo{float:left}
#header #sitelink{float:right}
#header #sns{float:right;position: relative;z-index: 1;padding-right:10px;}

#sns{height:78px}
#sns:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#sns a{position:relative;display:inline-block;padding:0 2px;vertical-align:middle;}
#sns a[target="_blank"]{background:none;}
#m_sns{display:none;}

#logo{padding:12px 0 0;margin:0}
#logo a{display:inline-block;vertical-align:bottom;font-size:0;line-height:1}
#logo .cyber{width:242px;height:56px;background:url(/images/cyber/common/logo_02.png) no-repeat;background-size:auto 100%}

#sitelink{height:78px}
#sitelink:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#sitelink a{position:relative;display:inline-block;height:45px;padding:0 25px;margin-left:2px;line-height:16px;vertical-align:middle;text-align:center;color:#fff;transition:color 0.1s ease-in-out}
#sitelink a span{position:relative}
#sitelink a:before{content:"";display:inline-block;height:110%;vertical-align:middle}
#sitelink a:after{content:"";position:absolute;top:0;left:0;right:0;height:100%;border:1px solid #fff;border-radius:25px;opacity:0.5}
#sitelink a:hover,#sitelink a:focus{color:#fff}

#sitelink .member{}
#sitelink .login{}
#sitelink .home{width:45px;height:45px;padding:0;background:url(/images/cyber/common/sitelink_icon.png) no-repeat 50% 50%}
#sitelink .home span{position:fixed;top:-1px;left:-1px;width:1px;height:1px;overflow:hidden}

#sitelink .menu_open,
#sitelink .mobile{width:45px;height:45px;padding:0;text-align:center}

#sitelink .menu_open{}
#sitelink .mobile{display:none}

#sitelink .menu_open:before,
#sitelink .mobile:before{margin-left:-6px}



#sitelink .fireinthefinger{position:relative;display:inline-block;width:18px;height:12px;line-height:1;vertical-align:middle}
#sitelink .fireinthefinger span{position:absolute;left:0;top:0;width:100%;height:2px;line-height:1;background-color:#fff}
#sitelink .fireinthefinger .bar1{left:0;top:0}
#sitelink .fireinthefinger .bar2{left:0;top:5px}
#sitelink .fireinthefinger .bar3{left:0;top:10px}



#flower{position:absolute;z-index:10;top:75px;height:4px;background-color:#278dff}

#gnb{position:relative;height:78px}
#gnb #tm{height:100%;text-align:center}
#gnb #tm .th1>a{transition:color 0.2s ease-in-out}
#gnb #tm .th2>li{margin:0 20px}
#gnb #tm .th2>li>a{transition:background-color 0.1s ease-in-out}

#tm .th1{display:inline-block;margin:0 -2px;vertical-align:top}
#tm .th1>a{display:block;height:78px;margin:0 20px;line-height:75px;font-size:18px;color:#fff}
#tm .th1>a:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#tm .th1>a.current,#tm .th1>a:hover,#tm .th1>a:focus{color:#fff}

#tm .th2{display:none;position:absolute;top:78px;left:50%;width:260px;min-height:300px;padding:25px 0;margin-left:-297px;text-align:left;border:0 dashed #676a68;border-left-width:1px}
#tm .th2 a{display:block;padding:5px 20px 5px 30px;background:url(/images/cyber/common/gnb-link-bullet.png) no-repeat 10px -36px;color:#e2e3e3}
#tm .th2 a.ov,#tm .th2 a:hover,#tm .th2 a:focus{background-position:5px 8px;color:#fff}


#gnb #tm .no1 .th2{margin-left:-435px}
#gnb #tm .no2 .th2{margin-left:-175px}
#gnb #tm .no3 .th2{margin-left:85px;border-right-width:1px}

#tm .th1 .current+.th2{background:#060f18}


#location{height:381px;margin-top:-78px;background:#333 url(/images/cyber/common/location-background-1.jpg) no-repeat 50% 0}
#location .layout{position:relative}
#location h1{margin-bottom:15px;line-height:1;font-weight:600;font-family:"ngn",sans-serif;font-size:38px;color:#fff}

#location[class^="sub01"]{background-image:url(/images/cyber/common/location-background-1.jpg)}
#location[class^="sub02"]{background-image:url(/images/cyber/common/location-background-2.jpg)}
#location[class^="sub03"]{background-image:url(/images/cyber/common/location-background-3.jpg)}
#location[class^="sub04"]{background-image:url(/images/cyber/common/location-background-4.jpg)}



#location #navigate{padding-top:135px}

#navigate{}
#navigate .function{display:inline-block;margin:0 10px}
#navigate span,#navigate a{display:inline-block;vertical-align:middle;color:#fff}
#navigate span:before{content:">";display:inline-block;margin:0 5px;font-family:"돋움",dotum,sans-serif}

#navigate .icon{margin:0 5px}
#navigate .icon:before{background:url(/images/cyber/common/icon_navigate.png) no-repeat}
#navigate .home{width:18px;height:18px;margin:0;text-align:left;overflow:hidden;background:transparent}
#navigate .home:before{content:"";display:block;width:18px;height:100%;margin:0}

#navigate .facebook{width:9px;height:16px}
#navigate .twitter{width:20px;height:14px}
#navigate .kakaotalk{width:16px;height:15px}
#navigate .print{display:none;width:14px;height:14px;background:none;}

#navigate .facebook:before{background-position:0 -20px}
#navigate .twitter:before{background-position:0 -40px}
#navigate .kakaotalk:before{background-position:0 -80px}
#navigate .print:before{width:14px;height:14px;background-position:0 -60px}

#location .navi-text{width:100%;overflow:hidden;background:no-repeat 50% 0}
#location .navi-text:before{content:"";display:block;height:100%}
#location .mcode-1{height:64px;background-image:url(/images/cyber/common/navigate-title-1.png);font-size:0;}
#location .mcode-2{height:64px;background-image:url(/images/cyber/common/navigate-title-2.png);font-size:0;}
#location .mcode-3{height:78px;background-image:url(/images/cyber/common/navigate-title-3.png);font-size:0;}


#menulocate{}
#menulocate a{position:absolute;top:190px;padding:15px 25px;background:url(/images/cyber/common/menulocate-black-pattern.png);color:#fff}

#menulocate a[data-control="prev"]{left:0;padding-left:70px}
#menulocate a[data-control="next"]{right:0;padding-right:70px}

#menulocate .icon{position:absolute;top:20px;width:27px;height:10px;background:url(/images/cyber/common/menulocate-control-icon.png) no-repeat 0 50%}
#menulocate .prev{left:20px;background-position:0 50%}
#menulocate .next{right:20px;background-position:-27px 50%}


#menulocate a.ov,
#menulocate a:hover,
#menulocate a:focus{background:url(/images/cyber/common/menulocate-black-pattern-ov.png)}


#remote{margin-top:-27px}
#remote:after{content:"";clear:both;display:block}
#remote #lnb{position:relative}
#remote #lnb:after{content:"";display:block;clear:both;}
#remote #lnb .th2{position:relative;float:left} 
#remote #lnb .th2 .link_2th{z-index:10;position:relative;display:block;padding:20px 0;text-align:center;font-size:18px;line-height:1;border:solid #e1e1e1;border-width:1px 1px 1px 0;background-color:#fff;color:#333;}
#remote #lnb .th2 .link_2th:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#remote #lnb .th2:first-child .link_2th{border-left:1px solid #e1e1e1}
#remote #lnb .th2:first-child .link_2th_ov,
#remote #lnb .th2:first-child .link_2th:hover,
#remote #lnb .th2:first-child .link_2th:focus,
#remote #lnb .th2 .link_2th_ov,
#remote #lnb .th2 .link_2th:hover,
#remote #lnb .th2 .link_2th:focus{border:solid #0060d8;border-width:1px 1px 1px 0;background-color:#0060d8;color:#fff}




#remote #lnb .th3{display:none;z-index:10;position:absolute;top:71px;width:100%;text-align:center}
#remote #lnb .th3:before{content:"";position:absolute;top:-20px;left:50%;margin-left:-10px;border:10px solid transparent;border-bottom-color:#fff}
#remote #lnb .th3 li{display:inline-block}
#remote #lnb .th3 li .link_3th{display:block;padding:10px 15px;font-size:15px;color:#565656}
#remote #lnb .th3 li .link_3th_ov,#remote #lnb .th3 li .link_3th:hover,#remote #lnb .th3 li .link_3th:focus{display:block;font-size:15px;color:#0060d8}

#remote.animate{transition:padding 0.3s;-webkit-transition:padding 0.3s}
#remote.action{padding-bottom:27px}



#footer{border-top:4px solid #0060d8;background-color:#383b3e} 

#footer .layout,#footer a{display:block;color:#d2d3d4}
#footer a:hover,#footer a:focus{color:#fff}
#footer .layout{position:relative;padding:30px 0}

#footer address{}
#footer .util{margin:10px auto 0;width:95px;}
#footer .util a{float:left;margin-left:5px;}
#footer .util a[target="_blank"]{padding-right:0;background:transparent}


#footer .return-top{position:absolute;top:-47px;right:-60px}

#footer address,#footer .copy{font-size:13px}



#anchor_group{position:relative;float:left;width:217px;margin:-10px 0 0 20px;padding-top:10px}
#anchor_group .title:before,#anchor_group .title span:before{content:"";display:inline-block;height:100%;vertical-align:middle;text-indent:0}
#anchor_group .title{display:block;width:100%;height:36px;overflow:hidden;text-indent:15px;text-align:left;border-radius:3px;background-color:#303338;color:#d2d3d4}
#anchor_group .title:hover,#anchor_group .title:focus{color:#fff}
#anchor_group .title span{float:right;height:100%;padding-right:15px;text-indent:0;font-size:24px;font-family:"돋움",dotum,sans-serif}
#anchor_group .select{display:none;position:absolute;bottom:40px;right:0;width:720px;border-radius:3px;background-color:#303338}
#anchor_group .select .inner{width:720px;padding:20px 0;overflow:hidden}
#anchor_group .select .item{float:left;width:220px;margin-left:20px}
#anchor_group .select .item b{display:block;font-size:20px}
#anchor_group .select .item ul{padding-left:15px;border-left:1px solid #252525}
#anchor_group .select .item ul li{margin-bottom:5px}
#anchor_group .select .item ul li a{display:block}

#footer_logo{position:absolute;top:20px;right:0;width:175px;height:28px;background:url(/images/cyber/common/footer_logo.png) no-repeat}


#content{padding:30px 0}


/* 모바일메뉴 */
#shadow_device {display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:900;background:#000;opacity:0.7}

/*모바일 메뉴*/
#mo_gnb{display:none;position:absolute;top:0;right:-240px;width:240px;height:100%;overflow:auto;background:#454950;z-index:1010;box-shadow:0px 0px 10px #333}

#mo_sitelink{height:73px;text-align:center;background-color:#278dff;overflow:hidden;}
#mo_sitelink a:first-child{border-left:none;}
#mo_sitelink a{display:inline-block;float:left;padding:20px 10px 10px;height:100%;width:33.3%;border-left:1px solid #2e3238;color:#fff}
#mo_sitelink .icon{display:none;width:16px;height:16px;margin-right:5px;vertical-align:middle;background:url(/images/cyber/common/icon_sitelink.png) no-repeat}
#mo_sitelink .login .icon{width:15px;margin-top:-5px;background-position:-28px 0}
#mo_sitelink .english .icon{margin-top:-2px;background-position:-28px -30px}

#mo_sitemap{background:#393b41}
#mo_sitemap a{display:block;padding:20px 0;text-align:center;color:#c0c6d0}
#mo_sitemap a:after{content:"";display:inline-block;width:19px;height:15px;margin-left:7px;vertical-align:middle;background:url(/images/cyber/common/mo_sitemap.png) no-repeat 0 50%}

#mo_tm{}
#mo_tm a{display:block;line-height:1;font-size:15px;color:#c0c6d0}
#mo_tm .th1{border-top:1px solid #2e3238}
#mo_tm .th1>a{position:relative;padding:20px 0 20px 30px;font-size:18px}
#mo_tm .th1>a:after{content:">";position:absolute;top:20px;right:20px;font-size:20px;transition:transform 0.3s;font-family:"돋움",dotum,sans-serif}
#mo_tm .th1>a.ov,
#mo_tm .th1>a:active{color:#278dff}
#mo_tm .th1>a.ov:after{transform:rotate(90deg)}

#mo_tm .th2{background-color:#393b41}
#mo_tm .th2>li{border-top:1px dashed #595959}
#mo_tm .th2>li:nth-child(1){border-top-width:0}
#mo_tm .th2>li>a{position:relative;padding:15px 0 15px 30px}
#mo_tm .th2>li>a:after{content:"+";position:absolute;top:13px;right:20px;font-size:20px;font-family:"돋움",dotum,sans-serif}
#mo_tm .th2>li>a.ov,
#mo_tm .th2>li>a:active{color:#278dff}
#mo_tm .th2>li>a.ov:after{content:"-"}

#mo_tm .th3{padding:10px 0;background-color:#2b2c30}
#mo_tm .th3>li{}
#mo_tm .th3>li>a{padding:5px 0 5px 40px}
#mo_tm .th3>li>a.ov,
#mo_tm .th3>li>a:active{color:#278dff}


@media only screen and (max-width:999px) {
	#sns {height: 65px;}
}
@media only screen and (max-width:480px) {
	#sns{display:none;}
	#m_sns {display:block;text-align: center;margin-top: 10px;}
	#m_sns a {margin: 0 3px;}
	#m_sns a[target="_blank"] {background: none;padding-right:0}
}

@media only screen and (min-width:640px) {
	#footer .util{float:right;margin-top:-45px;}
}

/*팝업창*/
.pop_font{text-indent:15px; margin-left:10px; float:left;}
.pop_font a:link{font-family:"Gulim"; font-size:14px; line-height:26px; letter-spacing:0; color:#FFFFFF;}
.pop_font a:visited{font-family:"Gulim"; font-size:14px; line-height:26px; letter-spacing:0; color:#FFFFFF;}
.pop_font a:active{font-family:"Gulim"; font-size:14px; line-height:26px; letter-spacing:0; color:#FFFFFF;}
.pop_font a:hover{font-family:"Gulim"; font-size:14px; line-height:26px; letter-spacing:0; color:#FFFFFF; font-weight:bold;}
.pop_close{width:48px; float:right;}
.pop_close img{margin-top:4px;}
.pop_con_box{ background:#ffffff; margin:3px 6px}
.pop_bt_bg{height:35px; background:#000000;padding:6px 3px 6px 3px}
.pop_bg{background:#1370AA; padding:3px 0px 3px 0px}