@charset "utf-8"; /* html 엘리먼트 속성 초기화 */ h1, h2, h3, h4, h5, h6{font-size:1em; margin:0px;} p, ul, ol, li, dl, dt, dd, form, fieldset{margin:0px; padding:0px; font-size:100%;} ul, ol, li{list-style:none; font-size:100%;} table{border-collapse:collapse; font-size:100%;} legend {visibility:hidden;overflow:hidden;width:0;height:0;background-color:transparent;font-size:0;line-height:0;} caption {visibility:hidden;overflow:hidden;width:0;height:0;background-color:transparent;font-size:0;line-height:0;text-indent: -9999em;} img{border:0 none; font-size:0px; line-height:0px; vertical-align: top} input, select, textarea{margin:0px; padding:0px;} .msie7 label input[type=radio], .msie7 label input[type=checkbox]{width:14px;height:14px;} html{width:100%;} html{overflow-x:hidden;} body{position:relative;top:0;min-width:1200px;} /* 그외 초기화 */ body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, header, hgroup, footer ,nav ,section ,article ,aside ,figure ,video ,audio {margin:0;padding:0;border:0;} em, address{font-style:normal} hr{display:none} select, textarea, input, label,img,button{vertical-align:middle} table td{word-wrap:break-word;word-break:break-all;} button{cursor:pointer} /** common style **/ /* font n color */ body,input,select,textarea,a,button{line-height:1;font-family:'나눔고딕','Nanum Gothic',"Malgun Gothic",'돋움',Dotum,Helvetica,AppleGothic,sans-serif;font-size:13px;color:#4b4e5a;} a{text-decoration:none;/*color:#e2632e;text-decoration:underline;*/} a:hover, a.on, a.active{text-decoration:none;} /*#header a, #footer a, #quick a, span[class*="btn"] a, div[class*="tab"] a, .title_section a{text-decoration:none;}*/ @font-face { font-family: 'Nanum Gothic'; font-style: normal; font-weight: normal; src: url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot); src: url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'), url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype'); } @font-face { font-family: 'Nanum GothicB'; font-style: normal; font-weight: bold; src: url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot); src: url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'), url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'), url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype'); } @font-face { font-family: 'Nanum GothicE'; font-style: normal; font-weight: bold; src: url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot); src: url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'), url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff) format('woff'), url(http://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.ttf) format('truetype'); } .top{position:absolute;z-index:2;overflow:hidden;width:250px;height:18px;top:30px;left:52.5%;margin:0 0 0 416px;} .top > li{float:left;padding:0 10px;background:url(../web/kor/images/main/top_line.png) no-repeat right center;} .top > li + li + li{background:none;padding-right:0px;} .top > li > a{display:block;color:#fff;font-size:12px;} .gnb{position:absolute;z-index:3;width:100%;padding:10px 0;top:42px;} .header{width:1264px;height:63px;overflow:hidden;margin:0 auto;} .header > h1{float:left;} .header > h1 a{display: block; height: 63px; width: auto;} .header > h1 a img {width: auto;} .header > ul{float:right;margin-top:32px; margin-right: -25px;} .header > ul > li {float:left;;text-align:center; position: relative;} .header > ul ul {display: none;} .header > ul > li + li + li + li + li + li{margin-right:0px;} .header > ul > li > a {display:block;padding:5px 25px;color:#fff;font-size:17px;font-family:'Nanum GothicB'} .header > ul > li:first-child > a:hover{color:#ff47b4} .header > ul > li:first-child + li > a:hover{color:#ffbf60} .header > ul > li:first-child + li + li > a:hover{color:#a3e04c} .header > ul > li:first-child + li + li + li > a:hover{color:#2abfff} .header > ul > li:first-child + li + li + li + li > a:hover{color:#9f1cb7} .header > ul > li:first-child + li + li + li + li + li > a:hover{color:#ccc} .gnb.tops .gnb_trarea {position: absolute; width: 100%; height: calc(100vh - 85px); left: 0; top: 85px; z-index: 2; background: rgba(0,0,0,0.2); display: none;} .gnb.tops .header {overflow: visible;} .gnb.tops .header > ul > li > a {padding: 5px 0; width: 160px;} .gnb.tops .header > ul ul {position: absolute; left: 0; top: 42px; width: 100%; background: #ec008c; padding: 8px 0 10px; display: none; z-index: 3;} .gnb.tops .header > ul ul * {font-size: 13px; line-height: 1.3;} .gnb.tops .header > ul ul a {color: #fff; display: block; padding: 5px 0;} .gnb.tops .header > ul ul a:hover {background: #b9006e; color: #fff;} .gnb.tops .header > ul > li > a.on {color:#ff47b4} .gnb.tops .header > ul > li > a.on + ul {display: block;} .snb{background:#f6f6f6;overflow:hidden;display:none;position:fixed;width:100%;height:0px;z-index:999999;top:85px;} .snb > div{position:relative;left:50%;margin:0 0 0 -274px;width:950px;} .snb > div > ul{float:left;width:150px;height:160px;border-right:1px solid #dadada;background:#fff;padding:20px 0 0 0;} .snb > div > ul:first-child{border-left:1px solid #dadada;} .snb > div > ul > li{margin-bottom:18px;padding-left:20px;} .quick{position:absolute;z-index:2;background:url(../web/kor/images/main/bg_black.png) repeat-x center top;bottom: 0;left:0;width:100%;height:141px;text-align:center;} .quick > li{display:inline-block;width:130px;margin:0 60px;padding:30px 0 0 0;position:relative;} .quick > li:first-child{margin-left:0px;} .quick > li:first-child + li + li + li + li{margin-right:0px;} .quick > li > a{position:absolute;display:block;width:100%;height:90px;color:#fff;font-size:17px;margin-top:0px;font-family:'Nanum GothicB'} .quick > li > a > span{display:block;color:#fff; margin-top: 5px;} .bg_video{position:absolute;z-index:1;left:0;top:0;background:url(../web/kor/images/main/bg_video.png) repeat left top;width:100%;height:700px;} .main_tit{border:1px solid #000;border-left:0;border-right:0;width:300px;margin:0 auto;padding:20px 0;font-size:24px;color:#000;font-family:'Nanum GothicB';text-align:center;} .comList{min-height:180px;padding:40px 0 100px 0;text-align:center;font-size:24px;color:#555;} .kitas_box{overflow:hidden;width:1200px;margin:70px auto 100px auto;} .kitas_box h3{font-size:24px;color:#000;font-family:'Nanum GothicB';margin-bottom:40px;} .kitas_shop{float:left; position:relative; width:696px;height:388px; margin-right:40px;} .kitas_shop > div{overflow:hidden;} .kitas_shop h3 > span{color:#a640b8;} .kitas_shop.notice ol.btn {overflow: hidden;position: absolute;right: 0;top: 18px;} .kitas_shop .bbs_con ol.btn li {float: left;margin-left: 3px;} .kitas_shop .bbs_con { overflow: hidden;padding: 0;} .kitas_shop .bbs_con.noti_con {display: block;} .kitas_shop .bbs_con > div {height: 324px;overflow: hidden;position: relative;} .kitas_shop .bbs_con ul {left: 0; margin: 0;position: absolute;top: 0;width: 100%;} .kitas_shop .bbs_con ul li {border-bottom: 1px dotted #ccc;overflow: hidden;} .kitas_shop .bbs_con ul li a {display: block; height: 45px; margin: 10px 0;overflow: hidden;} .kitas_shop .bbs_con ul li a > div p { overflow: hidden;text-overflow: ellipsis; white-space: nowrap;} .kitas_shop .bbs_con ul li a > div .tit {color: #000;font-size: 15px;font-weight: 600;padding: 0 0 2px;} .kitas_shop .bbs_con ul li a > div .con {color: #666;} .kitas_shop .bbs_con ul li a > div p span.date {color: #5b5b5b; float: right;font-size: 12px;} .main_goods{float:left;width:450px;height:324px;padding:44px 0 0 26px;background:url(../web/kor/images/main/mall_main_img.png) no-repeat -20px top;} .main_goods > a{display:block;} .main_goods > a > .goods_info{background:rgba(255,255,255,0.8);padding:20px;width:206px;height:194px;} .main_goods > a > .goods_info > strong{display:block;font-size:20px;color:#000;margin-top:5px;} .main_goods > a > .goods_info > span{display:block;font-size:15px;color:#636363;margin:10px 0 20px 0;} .main_goods > a > .goods_info > p{font-size:14px;color:#636363;line-height:20px;} .main_goods > a > .goods_info > .pay{display:block;margin-top:20px;font-size:20px;color:#f033a3;font-family:'Nanum GothicB';text-align:right;} .kitas_shop > div > ul{float:left;width:240px;background:#f0f0f0;height:324px;} .kitas_shop > div > ul > li{border-bottom:1px solid #e1e1e1;} .kitas_shop > div > ul > li + li + li{border-bottom:0;} .kitas_shop > div > ul > li > a{display:block;padding:25px 20px;overflow:hidden;} .kitas_shop > div > ul > li > a > img{float:left;border:1px solid #e1e1e1;margin-right:15px;} .kitas_shop > div > ul > li > a > strong{float:left;width:120px;margin-bottom:8px;} .kitas_shop > div > ul > li > a > span{float:left;} .kitas_fb{float:left;} .kitas_fb h3 > span{color:#015bae;} .kitas_fb > div{width:396px;height:324px;} .kitas_sc{float:left;width:64px;height:322px;border:1px solid #e1e1e1;border-left:0;margin-top:64px;} .kitas_sc > ul{width:28px;margin:0 auto;padding-top:16px;} .kitas_sc > ul > li{margin-bottom:10px;} .footer {background:#292929 ;padding:45px 0;text-align:center;font-size:12px;line-height:20px;color:#ddd;} .footer .ft_wrap {background:transparent url(/images/footer_logo.png) no-repeat 10px 0; text-align: left; width: 1200px; margin: 0 auto;} .footer .ft_wrap p {font-size: 24px; font-weight: bold; padding-bottom: 10px; margin-left: 250px;} .footer .ft_wrap div {margin-left: 250px;} .footer .ft_wrap p span {display: inline-block; font-weight: bold; margin-left: 20px; font-size: 14px;} .footer .ft_wrap p span a {color: #ddd;margin-right: 20px;} .addCompany{width:1200px;margin: 0 auto;text-align:center;} .addCompany > li{display:inline-block; margin:10px 16px; vertical-align: top;} .addCompany > li a {border: 1px solid #eee; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; display: inline-block; width: 200px; height: 130px; font-size: 14px; display: flex; justify-content: center; align-items: center; flex-direction: column; background: #f9f9f9; overflow: hidden;} .addCompany > li a:hover {border: 1px solid #aaa;} .addCompany > li dl {} .addCompany > li dt {font-size: 14px; font-weight: 500; margin: 10px 0 5px;} .addCompany > li dd {font-size: 13px; color: #666;} #popup{margin:-200px 0 0 -200px;left:50%;top:50%;position:fixed;z-index:999;} #popup > img{width:400px;} #mask2 { position:absolute; z-index:99; background-color:rgba(0,0,0,0.7); left:0; top:0; width:100%; height:100%; } #pop_bottom{position:fixed;bottom:0;z-index:9999;width:100%;padding:20px 0;background:#fff;color:#333;font-size:18px;text-align:right;cursor:pointer;} .layer_pop{position:absolute;z-index:999999;left:100px;top:150px;width:390px;border:4px solid #000;} .layer_pop > .pop_bottom{padding:8px 0;background:#fff;color:#333;font-size:13px;text-align:right;cursor:pointer;overflow:hidden;} .layer_pop > .pop_bottom > .bo1{float:left;margin-left:20px;} .layer_pop > .pop_bottom > .bo2{float:right;margin-right:20px;} .mtxt {position: absolute;top: 25%;width: 100%;left: 0;color: #fff;text-align: center;} .mtxt .tit {font-size: 35px; line-height: 45px;} .mtxt .desc {font-size: 20px;} .mtxt .date {font-size: 25px;} .mtxt {position: absolute;top: 250px;left:50%;margin-left:-270px;width: 600px;padding:40px 30px;border:1px solid #fff;color: #fff;text-align: center;} .mtxt .tit {font-size: 42px; line-height: 55px; font-weight: bold} .mtxt .desc {font-size: 20px;line-height: 25px; margin-top:30px} .mtxt .date {font-size: 40px;margin-top:30px;} .kitas_shop.notice {position: relative; width:700px; margin-right: 36px; height: 388px;} .kitas_shop.notice .bt {margin-bottom:0; padding-bottom:40px;border-bottom:1px solid #ccc;} .kitas_shop ol.btn {position: absolute;right: 0;top: 18px; width:60px; height: 20px;} .kitas_shop ol.btn:after {content: ''; display: block; visibility: visible;clear: both;} .kitas_shop ol.btn li {float: left;margin-left: 3px; width:20px; height: 20px;} .kitas_shop ol.btn li a {display: block;} .kitas_shop ol.btn li .top { position: static;width: 19px;height: 19px;margin: 0 0 0 2px;} .kitas_shop .bbs_con { overflow: hidden;padding: 0;border-bottom:1px solid #ccc;} .kitas_shop .bbs_con > div {height: 324px;overflow: hidden;position: relative;} .kitas_shop .bbs_con ul {left: 0; margin: 0;position: absolute;top: 0;width: 100%;} .kitas_shop .bbs_con ul li {border-bottom: 1px dotted #ccc;overflow: hidden;} .kitas_shop .bbs_con ul li a {display: block; height: 43px; margin: 10px 0;overflow: hidden;} .kitas_shop .bbs_con ul li a > div p { overflow: hidden;text-overflow: ellipsis; white-space: nowrap;} .kitas_shop .bbs_con ul li a > div .tit {color: #000;font-size: 15px;font-weight: 600;padding: 0 0 5px;} .kitas_shop .bbs_con ul li a > div .con {color: #666;} .kitas_shop .bbs_con ul li a > div p span.date {color: #5b5b5b; float: right;font-size: 12px;} .kitas_fb {float: left;width: 399px;} /* 2018 추가분 */ .top-notice{display:none;background:url(../web/kor/images/main/bg_notice.png) repeat-y center top;} .top-notice ul{width:1020px;margin:0 auto;font-size:0;} .top-notice ul li{display:inline-block;} .top-notice .close{position:absolute;width:34px;height:34px;top:40px;left:50%;margin:0 0 0 520px;background:url(../web/kor/images/main/top_close.png) no-repeat left center;font-size:0;text-indent:-9999px;overflow:hidden;cursor:pointer;} .side-menu{display:none;position:fixed;right:0;top:100px;width:100px;background:rgba(0,0,0,0.7);} .side-menu ul li{text-align:center;background-size:30px auto;padding:20px 10px;border-bottom:1px solid rgba(0,0,0,0.2)} .side-menu ul li.sm1{background:url(../web/kor/images/main/menu_ico0.png) no-repeat center 20px;} .side-menu ul li.sm2{background:url(../web/kor/images/main/menu_ico3.png) no-repeat center 20px;} .side-menu ul li.sm3{background:url(../web/kor/images/main/menu_ico2.png) no-repeat center 20px;} .side-menu ul li.sm4{background:url(../web/kor/images/main/menu_ico4.png) no-repeat center 20px;} .side-menu ul li a{display:block;padding:60px 0 0 0;color:#fff;} .top_box{position:relative;width:100%;height:100%;overflow:hidden} .top_box .yt_wrap{position:absolute;left:0;right:0;top:0;bottom:0;z-index:-99; width: 100%;} .top_box .yt_box{position:absolute;left:50%;top:50%;width:1280px;height:720px} .top_box .title{position:absolute;left:50%;top:50%;width:500px;height:240px;margin-left:-250px;margin-top:-260px;text-indent:-9999px;background:url("../web/kor/images/logo.png") no-repeat 0 0} .top_box .btn_pop{position:absolute;left:50%;top:50%;width:128px;height:128px;margin-left:-64px;margin-top:-24px;background:url("../web/kor/images/btn_pop.png") no-repeat 0 0;cursor:pointer} .top_box .btn_vol{position:absolute;right:20px;top:20px;width:32px;height:32px;background:url("../web/kor/images/volume.png") no-repeat;cursor:pointer} .top_box .btn_vol.on{background-position:0 0} .top_box .btn_vol.off{background-position:0 -32px} .top_box .bg_dot{position:absolute;width:100%;height:100%;left:0;top:0;background:url("../web/kor/images/bg.png");z-index:-9} .main_chatitle {width: 1200px; font-size: 24px; color: #000;font-family: 'Nanum GothicB';padding-left: 10px; margin: 0 auto 30px;} .kitas_channelbar {background: #fafafb; vertical-align: top; text-align: center;} .kitas_channelbar li {display: inline-block; text-align: center; padding: 55px 0 40px; margin: 0 60px;} .kitas_channelbar li a {display: block; width: 100px; height: 100px; position: relative;} .kitas_channelbar li a span {display: block; padding-top: 75px; font-size: 14px;} .kitas_channelbar li.m_cn1 a {background: transparent url(/images/kc_youtube.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .kitas_channelbar li.m_cn2 a {background: transparent url(/images/kc_facebook.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .kitas_channelbar li.m_cn3 a {background: transparent url(/images/kc_naverblog.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .kitas_channelbar li.m_cn4 a {background: transparent url(/images/kc_navercafe.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .kitas_channelbar li.m_cn5 a {background: transparent url(/images/kc_instgram.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .kitas_channelbar li.m_cn6 a {background: transparent url(/images/kc_inquiry.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .kitas_channelbar li.m_cn7 a {background: transparent url(/images/kc_kks.png) center 0 no-repeat; -webkit-background-size: 65px auto; background-size: 65px auto;} .bx-wrapper .bx-prev {border-left: 1px solid #ccc;} .bx-wrapper .bx-next {border-right: 1px solid #ccc;} .banner .btbnr_title { background: #f3f3f3; border: 1px solid #ccc;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding:17px 25px;font-size: 20px; font-weight: bold;} .banner .ft_silderbox {border: 1px solid #ccc; border-top: 0; border-bottom: 0;} .banner .slider4 .slide {text-align: center;} .banner .slider4 .slide a {display: inline-block;padding: 20px 0;} .mfwrap {width: 1200px; margin: 0 auto;} .footer_gnb {background:transparent url(/images/mfbgbg.gif) repeat-x 0 0} .footer_gnb li {width: 20%; float: left; text-align: center; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; border-left: 1px solid #ccc; height: 230px;} .footer_gnb li:first-child {border-left:0;} .footer_gnb li dt {background: #f3f3f3; font-size: 15px; padding: 17px 0; margin-bottom: 10px; border-top: 1px solid #ccc;} .footer_gnb li dd a {line-height: 2; font-size: 13px; color: #666;} .footer_gnb:after {content:""; display: block; height: 0; clear: both;} .aside_menu {width: 426px; height: 60px; position: fixed; z-index: 9000000; bottom: 0; right: 0; cursor: pointer;} .aside_menu ul {position: absolute; bottom: 0; width: 100%;} .aside_menu li {float: left;width: 50%; height: 60px;} .aside_menu li a {display: block; width: 100%; height: 60px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 18px;} .aside_menu li:nth-child(1) a {background:#ea008b; animation:bgan1 0.5s 0s infinite alternate;} .aside_menu li:nth-child(2) a {background:#f8af44; animation:bgan2 0.5s 0s infinite alternate;} @keyframes bgan1 { from {background:#ea008b;} to {background:#c30074;} } @keyframes bgan2 { from {background:#f8af44;} to {background:#ff9800;} } .top_banner {background:#f5f55b; height: 100px;} .top_banner2 {background:#f5f55b; height: 100px;} .top_banner ul {width:1200px;margin:0 auto;font-size:0;} .top_banner ul li {float: left; width: 50%;} .top_banner ul li a {width: 100%; display: block;} .top_banner ul li a img {height: 100px; width: 600px;} .top_banner ul:after {content:""; display: block; height: 0; width: 100%; clear: both;} .top_banner .top_banner_close {position:absolute;width:34px;height:34px;top:40px;left:50%;margin:0 0 0 610px;background:url(../web/kor/images/main/top_close.png) no-repeat left center;font-size:0;text-indent:-9999px;overflow:hidden;cursor:pointer;} .top_banner2 ul {width:1200px;margin:0 auto;font-size:0;} .top_banner2 ul li {display:inline-block;} .top_banner2 ul li a {width: 100%; display: block;} .top_banner2 ul li a img {height: 100px; width: 1200px;} .top_banner2 .top_banner_close {position:absolute;width:34px;height:34px;top:40px;left:50%;margin:0 0 0 610px;background:url(../web/kor/images/main/top_close.png) no-repeat left center;font-size:0;text-indent:-9999px;overflow:hidden;cursor:pointer;}