@charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=block'); @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@600;700&display=block'); @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'); html, 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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; font-size:100%; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; } html{font-size: 10px;} body { font-family: 'Roboto', 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', '맑은 고딕', Dotum, 돋움, Arial, Helvetica, sans-serif; font-style:normal; font-size:1.6rem; color:#111; line-height:normal; letter-spacing:0; position:relative; } ol, ul { list-style:none; } blockquote, q {quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content:none; } table {	border-collapse:collapse; border-spacing:0; } legend { display:none; } em, address { font-style:normal; font-weight:normal; } button { cursor:pointer; border:0; background: transparent; font: inherit;padding:0;box-shadow:none;} img { vertical-align:top; border:0; } a { color:#111; text-decoration:none; } a:active, a:focus, a:link, a:visited { text-decoration:none; } a:hover { text-decoration:underline; } a:hover,a:active:hover, a:focus:hover, a:link:hover, a:visited:hover { text-decoration:none; color:#4fa9b5;} input[type="text"] {padding: 0; border: none;border-radius: 0; box-sizing: border-box;font-family: inherit; outline: none;} .hide, .blind { width:0; height:0; margin:0; padding:0; position:absolute; left:0; top:0; font-size:0; text-indent:-9999px; overflow:hidden; visibility:hidden; } .common_inner{width: 1250px;margin: 0 auto;} .common_inner1{width: 700px; margin: 0 auto;position: relative;} .img_box{position: relative; box-sizing: border-box;} .img_box img{width: 100%;height: 100%; object-fit: cover; vertical-align: middle;} .cont_title{ font-size: 17px; line-height: 22px; font-weight: bold; margin-top: 11px; } .main_content{margin-top: 50px;} .title{ font-size: 18px; margin-bottom: 19px; margin-right: 10px; } .title a{display: flex;align-items: center;} .title a::after{ content: ''; display: block; width: 9px; height: 15px; background: url(../img/icon/ic_arrow.png) no-repeat; background-size: 100%; margin-left: 10px; } .abb1{} .abb2{ overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; } .abb3{ overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: keep-all; } .header{ position: relative; border-bottom: 1px solid #dfdfdf; height: 60px; box-sizing: border-box; } .header .common_inner{ display: flex; align-items: center; height: 60px; } .logo_area{margin-right: 90px;} .logo_area a{ display: flex; align-items: center; gap: 20px; } .logo_area .symbol{ display: inline-block; background: url(../img/logo/symbol.png) no-repeat; width: 60px; height: 60px; flex-shrink: 0; } .logo_area .logo{ width: 176px;height: 35px; } .logo_area .logo img{width: 100%;height: 100%;} .nav_area{ display: flex; width: 100%; justify-content: space-between; align-items: center; } .nav_area .nav_list{ display: flex; gap: 90px; font-size: 15px; font-weight: 500; margin-right: auto; } .nav_area .nav_item{position: relative;padding: 10px 0;} .nav_area .nav_item .s_link {font-size:13px; color:#888; font-weight:500;} .nav_area .btn_nav_search{ display: block; background: url(../img/icon/ic_search.png) no-repeat; width: 20px;height: 20px; background-size: 100%; margin-left: 20px; } .nav_area .btn_nav_search.active{ background: url(../img/icon/ic_close_B.png) no-repeat; width: 18px; height: 18px; background-size: 100%; margin-left: 2px; } .nav_item .nav_link.on{color: #4fa9b5;} .nav_subList{ position: absolute; top: 40px; left: 50%; z-index: 99; background: #fff; width: 130px; padding: 20px 15px; box-sizing: border-box; font-size: 13px; border: 1px solid #dfdfdf; transform: translateX(-50%); display: none; } .nav_subList li+li{ margin-top: 18px; } .nav_subList li a{ display: block; width: 100%; } .lang_box{ position: relative; font-size: 14px; font-weight: 500; margin-right: 50px; padding: 10px 0; box-sizing: border-box; } .lang_box span{ cursor: pointer; display: flex; align-items: center; gap: 5px; } .lang_box span.on{color: #4fa9b5;} .lang_box span:hover{color: #4fa9b5;} .lang_box span::after{ content: ''; display: inline-block; transform: rotate(0deg); background: url(../img/icon/ic_arrowB.png) no-repeat; background-size: 100%; width: 8px;height: 5px; } .lang_box span.on::after{ transform: rotate(180deg); } .lang_list{ position: absolute; top: 40px; left: 50%; z-index: 99; background: #fff; width: 130px; padding: 20px 15px; box-sizing: border-box; font-size: 13px; border: 1px solid #dfdfdf; transform: translateX(-50%); display: none; } .lang_list li+li{ margin-top: 18px; } .login_box { display: flex; } .login_box a { height: 24px; line-height: 22px; font-size: 13px; font-weight: 500; box-sizing: border-box; border:1px solid #dfdfdf; padding: 0 12px; border-radius: 12px; } .login_box a + a { margin-left: 5px; } .header .search_wrap{ width: 100%; height: 80px; position: absolute; bottom: -82px; background: rgb(255 255 255 / 95%); border-bottom: 1px solid #dfdfdf; z-index: 9; display: flex; align-items: center; display: none; } .header .search_wrap.active{display: flex;} .header .search_wrap form{ margin: 0 auto; width: 500px; height: 44px; border: 1px solid #dfdfdf; border-radius: 5px; display: flex; align-items: center; background: #ededed; } .header .search_wrap form input{ background: #ededed; border: none; width: 100%; height: 100%; padding: 0 17px; font-size: 14px; } input::placeholder {color:#333333;} .header .search_wrap .btn_search{ background: url(../img/icon/ic_search_B.png) no-repeat; background-size: 100%; width: 20px; height: 20px; margin-right: 17px; } .event_top_banner{ height: 60px; position: relative; } .event_top_banner .inner{ height: 60px; width: 1220px; margin: 0 auto; } .event_top_banner a{ display: block; width: 100%; height: 100%; } .event_top_banner .img_box{height: 60px;} .event_top_banner .img_box img{width: 100%;height: 100%;object-fit: cover;} .event_top_banner .btn_close{ position: absolute; right: 20px; top: 50%; transform: translateY(-50%); width: 25px; height: 25px; background: url(../img/ic_close.png) no-repeat center; } .footer{ margin-top: 100px; background: #181818; padding: 30px 0; } .footer ul{ display: flex; align-items: center; color: #fff; } .footer ul a{ color: #fff; font-size: 13px; margin: 0 15px; } .footer ul li{position: relative;} .footer ul li+li::after{ content: ''; display: block; width: 1px; height: 10px; background: #303030; position: absolute; top: 60%; left: 0; transform: translateY(-50%); } .footer .link_info{ display: flex; justify-content: space-between; margin-bottom: 25px; } .footer .f_mail{ text-transform: uppercase; color: #fff; font-size: 12px; display: flex; align-items: center; } .footer .f_mail::before{ content: ''; display: inline-block; margin-right: 6px; width: 18px; height: 13px; background: url(../img/icon/ic_mail.png) no-repeat center; background-size: 100%; } .footer ul li:first-child a{margin-left: 0;} .copyright{ font-size: 12px; color: #666666; } .atc_ad_wing { position: relative; left: 0; top: 0; width: 1220px; margin:0 auto; z-index: 90; } .atc_ad_wing .wing_left { position: absolute; left: -155px; top: 80px; width: 120px; height: 600px; } .atc_ad_wing .wing_left a { display: block; width:100% } .atc_ad_wing .wing_left a + a { margin-top:20px; } .atc_ad_wing .wing_right { position: absolute; right: -155px; top: 80px; width: 120px; height: 600px; }