@charset "utf-8";
@font-face {
 font-family: 'SangSangRock';
 src: url('https://gcore.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/SangSangRockOTF.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}

@font-face {
 font-family: 'GmarketSansMedium';
 src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}
/* header */
#header #logo {position:relative;line-height:0; font-size:0;padding:17px 0;}
#header .slogon{position:absolute; left:53%;transform:translateX(-50%); top:36px; /*line-height:0; font-size:0;*/font-weight:normal;display:flex;align-items: center;flex-direction: column}
#header .slogon > div{position:relative;padding-right:30px;font-size:24px;font-family: "SangSangRock",dotum,sans-serif;color:#000;letter-spacing: -1px}
#header .slogon > div span:first-child{color:#466fff}
#header .slogon > div span:nth-child(2){color:#466fff}
#header .slogon > div span:last-child{color:#cc2f2a}
#header .slogon img{width:250px;max-height:80px;}
#header .slogon > span{font-size:22px;color:#222;font-weight: bold;letter-spacing: -1px;}
#header .slogon strong{font-size:28px;color: #cc2f2a;letter-spacing: 0;margin-top:8px;}
#header .slogon strong > span{color: #5c0087;font-size:28px;font-family: "GmarketSansMedium",dotum,sans-serif;font-weight:500}
#header .slogon .cheerup{width:400px;height:20px;overflow: hidden}
#header .slogon .cheerup > div {width:100%;vertical-align: middle;overflow: hidden;display: flex;flex: 0 0 auto;white-space: nowrap;overflow: hidden;transition: 0.3s;padding:0;}
#header .slogon .cheerup > div > span{color:#000;font-size:14px;font-weight: normal;font-family: "Nanum Gothic",dotum,sans-serif;animation: textLoop 150s linear infinite;padding-left:100%;display:inline}

@keyframes textLoop {
 0% {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
 }
 100% {
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
 }
}

.t_gnb:after{content:"";clear:both;display:block;}

/* lnb */ 
#lnb {position:relative; z-index:100; width:990px;font-family: 'Nanum Gothic'; }
#lnb li {position:relative;float:left;display:block; height:50px; text-align:left;width:14.2%; } 

#lnb li a{display:block;line-height:50px;color:#fff;font-size:16px;text-align:center; font-weight:bold;}
#lnb li a:hover {text-decoration:underline; color:#fddf68; font-weight:600;}
#lnb li:before{content:'';position:absolute;top:22px;left:-3px;display:block;width:6px;height:6px;border-radius:100px;background:#fff;opacity:0.2;}
#lnb li:first-child:before{display:none;}
#lnb li{width:14%;}
#lnb>ul>li:nth-child(5){width:16%;}

#lnb ul {margin:0; padding:0; width:100%;   }
#lnb ul div.top2m {padding:9px 0 0 0; display:none;  }
#lnb ul ul li:first-child { padding-top:8px;}

.lnb_bar{width:100%;min-width:990px;height:330px; height:360px; position:absolute; top:167px; z-index:0; left:0; background:rgba(255,255,255,0.95); box-shadow: 1px 1px #c9c9c9; z-index:99; }

#lnb ul ul li {float:none; height:auto;width:100%; padding:5px; display:block; letter-spacing:-2px; border-bottom:1px dotted #ddd;box-sizing:border-box;}
#lnb ul ul li:last-child {border-bottom:0;}
#lnb ul ul li a {display:block;text-decoration:none;text-align:left;color:#4e4e4e;font-size:13px;margin:0; line-height:16px;  letter-spacing:-1.2px; font-weight:normal;}
#lnb ul ul li a {}
#lnb ul ul li a:hover {text-decoration:none;}
#lnb ul ul li a:hover , #lnb ul ul li a.active {color:#00218b; font-weight:bold; text-decoration:none;}
 
#lnb ul li ul{ border-left:1px solid #ddd; height:326px; top:80px; padding:0 0 0 0; height:360px;}
#lnb ul #top2m8 ul{ border-right:1px solid #ddd;}
#lnb ul #top2m8 ul li:nth-child(3){height:40px;}

/* t_gnb */
.t_gnb li{float:left;height:32px;line-height:32px;padding:0 20px;background:#142d55;}
.t_gnb li a{font-size:14px;color:#fff;}
.t_gnb li a:hover{text-decoration:underline;}
.t_gnb li.on{background:#fff;}
.t_gnb li.on a{color:#000;}

/* gnb */
.gnb {position:absolute; top:62px; right:0px;}
.gnb li {float:left; font-size:12px;}
.gnb li a {display:inline-block; color:#5f5f5f; padding:0 10px 1px 10px; font-weight:bold; background:url("/imgs/header/gnb_dot2.gif") no-repeat 0 10px;}
.gnb li a:hover {color:#00218b;}
.gnb li.first a {background:none;}

.gnb li.box1 a {background:#cc2f2a; font-family:dotum; color:#fff; padding:2px 6px 0 6px;}
.gnb li.box2 a {background:#094aad; font-family:dotum; color:#fff; padding:2px 6px 0 6px;}
.gnb li.box3 a {background:#000; font-family:dotum; color:#fff; padding:2px 6px 0 6px;}
.gnb li.box1,.gnb li.box2 {padding:0 2px 0 ;}

/* sns */
.sns {position:absolute; top:55px; right:0;}
.sns li {float:left; margin-right:5px;}
.sns li:last-child{margin-top:10px;}

/* sub_visual */
#subWrapper .visual_1 {background:url("/imgs/sub/sub_visual_1.png") no-repeat right 0;}
#subWrapper .visual_2 {background:url("/imgs/sub/sub_visual_2.png") no-repeat right 0;}
#subWrapper .visual_3 {background:url("/imgs/sub/sub_visual_3.png") no-repeat right 0;}
#subWrapper .visual_4 {background:url("/imgs/sub/sub_visual_4.png") no-repeat right 0;}
#subWrapper .visual_5 {background:url("/imgs/sub/sub_visual_5.png") no-repeat right 0;}
#subWrapper .visual_6 {background:url("/imgs/sub/sub_visual_6.png") no-repeat right 0;}
#subWrapper .visual_7 {background:url("/imgs/sub/sub_visual_7.png") no-repeat right 0;}
#subWrapper .visual_8 {background:url("/imgs/sub/sub_visual_6.png") no-repeat right 0;}
#subWrapper .visual_9 {background:url("/imgs/sub/sub_visual_5.png") no-repeat right 0;}
#subWrapper .visual_10 {background:url("/imgs/sub/sub_visual_4.png") no-repeat right 0;}
#subWrapper .visual_11 {background:url("/imgs/sub/sub_visual_3.png") no-repeat right 0;}
#subWrapper .visual_12 {background:url("/imgs/sub/sub_visual_2.png") no-repeat right 0;}
#subWrapper .visual_13 {background:url("/imgs/sub/sub_visual_1.png") no-repeat right 0;}
#subWrapper .visual_14 {background:url("/imgs/sub/sub_visual_14.png") no-repeat right 0;}
#subWrapper .visual_15 {background:url("/imgs/sub/sub_visual_14.png") no-repeat right 0;}
#subWrapper .visual_16 {background:url("/imgs/sub/sub_visual_14.png") no-repeat right 0;}

/* subMenu */
#subMenu {width:185px;}
#subMenu h2 {padding:58px 0 16px 0; line-height:33px; font-size:28px; color:#444; font-family:"맑은고딕","Malgun Gothic";  letter-spacing:-1px;}
#subMenu li {padding:0 0 5px 0;position:relative;}
#subMenu li li {padding:0;}
#subMenu li a {display:block; background:url("/imgs/sub/subMenuBul.gif") no-repeat 0 0; color:#fff; width:190px; padding:4px 0 5px 8px; font-weight:bold; letter-spacing:-1px;}
#subMenu li.blank a:after{content: '';width:11px;height:11px;position:absolute;top:10px;right:0;background:url('/imgs/sub/btnLink_ico.png') no-repeat 100% 50%;display:inline-block;}
#subMenu li.blank a:hover{background-color:#d90618;background-position:20px -37px;}
#subMenu li a:hover,#subMenu li.on a, #subMenu li.on a:hover {background-position:0 -37px;}
#subMenu ul ul {padding:8px 0 2px;}
#subMenu li li a {width:155px; padding:4px 0 4px 24px; color:#616161; font-weight:normal; line-height:15px; background-position:4px -83px !important;}
#subMenu li li.blank a:after{content: '';width:11px;height:11px;position:absolute;top:6px;right:0;background:url('/imgs/sub/btnLink_ico1.png') no-repeat 100% 50%;display:inline-block;}
#subMenu li li a:hover,#subMenu li li.on a, #subMenu li li.on a:hover {color:#000 !important; font-weight:bold !important; background-position:4px -83px !important; letter-spacing: -1px !important;}


/* centerColumn */
.content_in {position:relative; width:720px;}
.subTitleWrap {position:relative; height:75px; width:720px; margin:97px 0 20px 0;}
#content .subTitle {position:absolute; top:0; left:2px; color:#2a2a2a; font-size:24px; line-height:28px; font-weight:bold; letter-spacing:-2px; background:url("/imgs/sub/subTitle.gif") no-repeat 1px 0; padding:8px 0 0 0;}
#content .location {position:absolute; top:54px; left:5px; color:#767676;}
#content .location img {margin:0; padding-right:7px;padding-top:1px;}
#content .location a {color:#767676;}
#content .location a:hover {color:#767676; text-decoration:underline;}
#content .location .lo_arrow {padding:0 4px;}
#content .location a span {color:#767676;}
 {position:relative; width:720px; min-height:400px; padding:40px 0; margin:0 0 50px 0;}

.subTitleWrap_play {position:relative; height:190px; width:990px;}
.subTitleWrap_play .subTitle {top:100px !important;}
.subTitleWrap_play .location {top:154px !important;}
_play {position:relative; width:990px; min-height:400px; padding:40px 0; margin:0 0 50px 0;}

/* footer */
 #footer {position:relative; width:990px; margin:0 auto;}

/* viewer */
.viewer {position:absolute;top:78px;right:0;padding:8px 20px 4px;background:#152e48;border-radius:50px;}
.viewer h3 {float:left;font-size:14px;color:#fff;opacity:0.6;padding-right:10px;}
.viewer ul {float:left;padding-right:10px;}
.viewer li {float:left;padding:0 0 0 10px;}

#footer .foot_link{float:left;}
#footer .foot_link a{display:inline-block;padding:12px 0;color:#c6c6c6;}
#footer .foot_link a:hover {text-decoration:underline; }
#footer .foot_link a.point{color:#fff;}
#footer .foot_link span {color:#354250;padding:0 5px;}

#footer .copy {padding:78px 0 0 0; color:#fff;}
#footer .copy .line {padding:0 10px;}
#footer .btn_top {position:absolute; right:0; top:0;}
#footer .btn_top a{display:block;width:50px;line-height:49px;background:#de4326;text-align:center;font-size:14px;color:#fff;font-weight:bold;}

.family_site{position:absolute;top:6px;right:50px; z-index:100;}
.select {position:relative;float:left;background:#202f3e; width:158px; margin:0 5px 0 0;}
.select .myValue {cursor:pointer;padding:0 10px;border:1px solid #394754;background:url('/imgs/footer/f_open.png') no-repeat 92% 14px; font-size:13px;color:#fff; width:100%; height:37px;line-height:36px; text-align:left;}
.select a:hover {background:#0e1e2e;}
.select.open .myValue{background-image:url('/imgs/footer/f_close.png');}
.select ul {bottom:37px; left:0; width:100%;  height:400px; overflow-y:auto; background:#202f3e; padding:5px 0 0 0;}
.select li a{display:block;font-size:13px;color:#fff;padding:4px 5px 3px 10px;line-height:1.4;}
.select li a:hover {text-decoration:underline; color:#e66c57;}
.select ul.aList{ display:none;}
.select.open ul.aList{ display:block;}