.gnb_wrap ul,.gnb_wrap li {list-style:none;} /* 전체 가로폭 설정 */ #gnb .gnb_wrap,.container { transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; } #sideBar, #topSpacer{display:none;} #hd{-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #hd.scDown{margin-top:0;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #hd {min-width:320px; position:fixed; width:100%; left:0px; top:0px; z-index:9999;} #hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden} #snbOpen, #sideBarCover, #snbMvAr, #snbMvArBottom{display:none;} #hd_wrapper {position:relative;margin:0 auto;padding:0px 0;width:100%;zoom:1} #hd_wrapper:after {display:block;visibility:hidden;clear:both;content:""} #sbn_side{position:absolute;top:20px;right:0} /* 본문 바로가기 */ #skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden} #skip_to_container a:focus, #skip_to_container a:active {top:0;width:100%;height:40px;font-size:12px;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em} /* 최상단 링크버튼 영역 ------------------------------------------------------------------------------*/ #tnb_wrap.tnb_wrap{position:relative;margin:0 auto;width:100%;height:35px;background:none;z-index:2;} .topetcbox {position:relative;} .topetcbox .tl_left {float:left;height:34px;overflow:hidden;padding-left:1px;} .topetcbox .tl_right {float:right;} .topetcbox .tl_left a, .topetcbox .tl_right a {display:inline-block;float:left;padding:0 1em;line-height:34px;} .topetcbox .tl_left a {font-size:14px;} .topetcbox .tl_left a {display:inline-block;padding:0 10px;height:35px; line-height:35px;font-size:14px;} .topetcbox .tl_left a:focus, .topetcbox .tl_left a:hover {} #tnb {position:relative;top:0px;right:0;width:100%;margin:0 auto; transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; } .scDown #tnb {top:0px;} #tnb h3 {position:absolute;font-size:0;line-height:0;overflow:hidden} #tnb ul {position:relative;top:0;margin:0 auto;width:100%;zoom:1} #tnb ul:after {display:block;visibility:hidden;clear:both;content:""} #tnb li {float:left;margin-bottom:-1px;font-size:0.92em;margin:0;padding:0;} #tnb a {padding:0 10px;height:35px; line-height:35px;font-size:12px;} #tnb a:focus, #tnb a:hover {} #tnb .tnb_admin a{} #tnb .tnb_left{float:left} #tnb .tnb_left a{;padding:0 14px} #tnb .tnb_cart{} #tnb .tnb_community{} #tnb .tnb_community i{font-size:15px} #tnb .tnb_community{font-weight:bold;} #tnb .tnb_community:focus, #tnb .tnb_community:hover {border-bottom:0} #tnb .tnb_community a{} #tnb .tnbIco{font-size:12px;} #tnb_wrap.tnbDown {position:absolute;top:-35px;} #tnb .info_color {display:inline-block;line-height:35px;font-size:12px;letter-spacing:-0.05em;} .no_line { border-left:none !important; } /* 상단로고 ------------------------------------------------------------------------------*/ #logo, #logo2 {float:left;} #logo {padding:0px;margin:0px 0px 0px 24px;} #logo a, #logo2 a {display:block;padding:0;overflow:hidden;text-indent:-5000px;} #logo a{height:80px;background-image:url(../../../images/logo_color.png);background-repeat:no-repeat;background-position:center;} .mainframe #logo a{height:80px;background-image:url(../../../images/logo_white.png);background-repeat:no-repeat;background-position:center;} .fp-viewing-002 .mainframe #logo a{height:80px;background-image:url(../../../images/logo_color.png);background-repeat:no-repeat;background-position:center;} .fp-viewing-005 .mainframe #logo a{height:80px;background-image:url(../../../images/logo_color.png);background-repeat:no-repeat;background-position:center;} .fp-viewing-006 .mainframe #logo a{height:80px;background-image:url(../../../images/logo_color.png);background-repeat:no-repeat;background-position:center;} #logo img{display:block;height:60px;width:auto;} #logo2 {} #logo2 a{height:40px;background-image:url(../../../images/logo_color.png);background-repeat:no-repeat;background-position:center;background-size:80%;} #logo2 img{display:block;height:60px;width:auto;} #logo, #logo a, #logo2, #logo2 a, #logo img, #logo2 img { transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; } /* .scDown #logo img{height:60px;} */ .scDown #logo a {background-image:url(../../../images/logo_down.png);background-repeat:no-repeat;background-position:center;} /* 상단 메뉴 컬러 ------------------------------------------------------------------------*/ #gnb {} #gnb .gnb_1dli .gnb_1da {color:var(--menu-basic-color);} #gnb #gnb_1dul > li.active > a {color:var(--menu-select-color);} @media (min-width: 841px) { #gnb .gnb_1dli:hover .gnb_1da {color:var(--menu-over-color);} #gnb .gnb_1dli:hover .gnb_1da u {background:var(--menu-select-color);} } .gnb_1dli_on a.gnb_2da, a.gnb_2da, .gnb_2dli_on a.gnb_3da, a.gnb_3da {background:none;color:var(--color-fff);} @media (min-width: 841px) { a.gnb_2da:hover, a.gnb_3da:hover {background:var(--main-color2); color:var(--color-fff);} } #gnb #gnb_1dul > li > .gnb_2dul > .gnb_2dul_box > li.active > a {color:var(--main-color2);} #gnb #gnb_1dul > li > .gnb_2dul > .gnb_2dul_box > li.active > a:hover {color:var(--color-fff);} #gnb #gnb_1dul > li .gnb_2dul .gnb_2dul_box li.active a {} .gnb_2dul > .gnb_2dul_box > li > .gnb_3dul > .gnb_3dul_box > li.active > a {color:#ffce01;} @media (min-width: 841px) { .gnb_2dul > .gnb_2dul_box > li > .gnb_3dul > .gnb_3dul_box > li.active > a:hover {color:var(--color-fff);} } .gnb_2dul {background:var(--opacity-b-color8);} .gnb_3dul {background:var(--opacity-b-color8);} .scDown #gnb {border-bottom:1px solid var(--border-color1);background-color:var(--color-fff);} @media (max-width: 840px){ #gnb {background-color:var(--color-fff);} .mainframe #logo a, .fp-viewing-002 .mainframe #logo a, .fp-viewing-005 .mainframe #logo a, .fp-viewing-006 .mainframe #logo a {background-image:url(../../../images/logo_color.png);height:51px;} .dan_left h3 {font-size:1.5em;} } #gnb .gnb_menu_btn {background:none;color:var(--color-333);} /* 메인 컬러 변경 */ .mainframe #gnb .gnb_1dli .gnb_1da {color:var(--color-fff);} .mainframe #gnb #gnb_1dul > li.active > a {color:var(--main-color2);} .mainframe #gnb .gnb_menu_btn {background:none;color:var(--color-fff);} @media (min-width: 841px) { .mainframe #gnb .gnb_1dli:hover .gnb_1da {color:var(--main-color2);} .mainframe #gnb .gnb_1dli:hover .gnb_1da u {background:var(--main-color2);} } .fp-viewing-002 .mainframe #gnb .gnb_1dli .gnb_1da {color:var(--menu-basic-color);} .fp-viewing-002 .mainframe #gnb #gnb_1dul > li.active > a {color:var(--menu-select-color);} .fp-viewing-002 .mainframe #gnb .gnb_menu_btn {background:none;color:var(--color-333);} @media (min-width: 841px) { .fp-viewing-002 .mainframe #gnb .gnb_1dli:hover .gnb_1da {color:var(--menu-over-color);} .fp-viewing-002 .mainframe #gnb .gnb_1dli:hover .gnb_1da u {background:var(--menu-select-color);} } .fp-viewing-005 .mainframe #gnb .gnb_1dli .gnb_1da {color:var(--menu-basic-color);} .fp-viewing-005 .mainframe #gnb #gnb_1dul > li.active > a {color:var(--menu-select-color);} .fp-viewing-005 .mainframe #gnb .gnb_menu_btn {background:none;color:var(--color-333);} @media (min-width: 841px) { .fp-viewing-005 .mainframe #gnb .gnb_1dli:hover .gnb_1da {color:var(--menu-over-color);} .fp-viewing-005 .mainframe #gnb .gnb_1dli:hover .gnb_1da u {background:var(--menu-select-color);} } .fp-viewing-006 .mainframe #gnb .gnb_1dli .gnb_1da {color:var(--menu-basic-color);} .fp-viewing-006 .mainframe #gnb #gnb_1dul > li.active > a {color:var(--menu-select-color);} .fp-viewing-006 .mainframe #gnb .gnb_menu_btn {background:none;color:var(--color-333);} @media (min-width: 841px) { .fp-viewing-006 .mainframe #gnb .gnb_1dli:hover .gnb_1da {color:var(--menu-over-color);} .fp-viewing-006 .mainframe #gnb .gnb_1dli:hover .gnb_1da u {background:var(--menu-select-color);} } /* 상단메뉴 ------------------------------------------------------------------------------*/ #gnb{position:relative;display:block;z-index:1;} #gnb h2{position:absolute;font-size:0;line-height:0;overflow:hidden} #gnb .gnb_wrap{ position:relative; display:flex; flex-direction: row; justify-content: space-between; margin:0 auto;width:100%;max-width:100%;height:80px;border:none;padding:0px 0px 0px 0px; transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; } /* #gnb #gnb_1dul {font-size:1.083em;padding: 0;zoom:1;} */ #gnb #gnb_1dul {display:flex;padding: 0;zoom:1;} #gnb ul:after {display:block;visibility:hidden;clear:both;content:""} #gnb .gnb_1dli{float:left;position:relative;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #gnb .gnb_1dli .gnb_1da{height:80px;line-height:80px;padding:0 20px;font-size:18px;font-weight:700; position:relative;word-break: keep-all;word-wrap: break-word; } #gnb .gnb_1dli:hover .gnb_1da{text-decoration:none;} #gnb .gnb_1dli .gnb_1da u{display:block;width:1px;height:3px;position:absolute;left:50%;bottom:0px;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #gnb .gnb_1dli .gnb_1da u {} #gnb .gnb_1dli:hover .gnb_1da u{width:50%;margin-left:-25%;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} .gnb_1dli .bg{display:inline-block;width:0px;height:0px;overflow:hidden;text-indent:-999px} .gnb_1da {display:inline-block;font-weight:400;text-decoration:none;} .gnb_2dul {display:none;position:absolute;top:80px; left:50%; margin-left:-90px;width:180px;padding: 0;border-top:0px; overflow:hidden;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #gnb .gnb_1dli:hover .gnb_2dul {display:block;} .gnb_2dli{width:100%; -webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} .gnb_2dli:first-child{border:0} .gnb_2da {display:block;padding:13px;line-height:1.4em;font-size:14px;font-weight:400; text-align:left;text-decoration:none;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} a.gnb_2da:hover{ padding-left:18px;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;text-decoration:none;} .gnb_3da {display:block;padding:5px;padding-left:20px;line-height:1.4em;font-size:14px;font-weight:400; text-align:left;text-decoration:none;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} a.gnb_3da:hover{ padding-left:28px;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;text-decoration:none;} a.gnb_3da:before {content:" - ";} .gnb_1dli_air .gnb_2da {} .gnb_1dli_on .gnb_2da {} .gnb_2da:focus, .gnb_2da:hover {} .gnb_1dli_over .gnb_2dul {display:block;} .gnb_1dli_over2 .gnb_2dul {display:block;} .gnb_wrap .gnb_empty {height:80px;;width:100%;text-align:center;line-height:80px;} .gnb_wrap .gnb_empty a{text-decoration:underline} .gnb_wrap .gnb_al_ul .gnb_empty, .gnb_wrap .gnb_al_ul .gnb_empty a{} .gnb_right {position:relative;display:inline-block;float:right;} .gnb_right li {display:inline-block;float:left;height:80px;} .gnb_right li .flg_set #flg {top:28px;margin-top:0px;left:0px;} /*------------------------------------------------------------------------------ active 메뉴 설정 ------------------------------------------------------------------------------*/ #gnb #gnb_1dul > li.active > a {} #gnb #gnb_1dul > li .gnb_2dul .gnb_2dul_box li.active a {font-weight:400;} #gnb #gnb_1dul > li .gnb_2dul .gnb_2dul_box li.active a:hover {} /* 상단메뉴 ------------------------------------------------------------------------*/ #gnb .gnb_menu_btn {width:50px;height:80px;border:0;vertical-align:top;font-size:18px} #gnb .gnb_close_btn {width:50px;height:50px;border:0;vertical-align:top;font-size:18px;position:absolute;top:0;right:0} #gnb .gnb_mnal {} .scDown #gnb .gnb_menu_btn {} #gnb_all {display:none;position:absolute;top:0;width:100%;z-index:1000;-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.2);-moz-box-shadow:0 2px 5px rgba(0,0,0,0.2);box-shadow:0 2px 5px rgba(0,0,0,0.2)} #gnb_all h2 {position:relative;display:inline-block;width:100%;font-size:18px;line-height:1.2em;padding:5px 20px;margin:0;text-align:left;} #gnb_all .gnb_al_ul {position:relative;display:flex;width:100%;height:100%;font-size:14px;text-align:left;overflow:hidden;} #gnb_all .gnb_al_ul:after {display:block;visibility:hidden;clear:both;content:""} #gnb_all .gnb_al_ul > li:nth-child(5n+1) {border-left:0} #gnb_all .gnb_al_li {width:100%;min-height:215px;padding:20px;} #gnb_all .gnb_al_li:not(:last-child) {border-right:1px solid #ddd;} #gnb_all .gnb_al_li .gnb_al_a {font-size:1.2em;display:block;position:relative;margin-bottom:10px;font-weight:bold;} #gnb_all .gnb_al_li li {line-height:2em} #gnb_all .gnb_al_li li a {} #gnb_all .gnb_al_li li a:hover {text-decoration: underline;} #gnb_all_bg {display:none;width:100%;height:100%;position:fixed;left:0;top:0;z-index:999} .gnb_2dul .gnb_2dul_box {border:none;} .scDown #gnb {padding:0px 0;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} .scDown #gnb .gnb_1dli .gnb_1da {text-shadow:none;} .scDown #gnb .gnb_1dli:hover .gnb_1da {} #sideBar {float:left;width:20%;} #snb{width:100%; margin-top:-50px;} #snb {width:100%;} #snb > li.snb{width:100%;display:none;} #snb > li.snb.active{display:block !important;} #snb > li > h2{width:100%;} #snb > li > h2 a{display:block; text-align:center; padding:80px 10px; } #snb > li > h2 a b{display:block;font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} #snb > li > h2 a sub{display:block;padding-top:10px;font-family:vardana;font-size:12px;letter-spacing:0.05em;font-weight:normal;filter:Alpha(opacity=50); opacity:0.5; -moz-opacity:0.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} #snb > li .snb2dDown{display:none;} #snb > li > ul{} #snb > li > ul > li{} #snb > li > ul > li a{display:block;padding:15px;;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #snb > li > ul > li a b{font-size:13px;} #snb > li > ul > li a:hover{padding-left:20px;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;} #snb > li > ul > li.snb2d.active a{} #snb > li > ul > li a{overflow:hidden;} #snb > li > ul > li a i{float:right;} .snbCS{ padding:20px;} .snbCS dt{padding-bottom:10px;font-size:16px; font-weight:bold; } .snbCS dd{font-size:11px;} .snbCS dd strong{display:block;font-size:18px; padding-bottom:10px; ;} .snbCS dd b{display:block;font-size:11px;} .snbHome {position:relative;display:block;width:100%;padding:1rem 0;} .snbHome > a {padding:0.5em 1em;font-size:1.3rem;} /* 화면낭독기 사용자용 */ #hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden} .msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important} /******************************************************************************************************* 반응형 설정 ********************************************************************************************************/ @media (max-width:1680px) { } @media (max-width:1132px) { } @media (max-width:1060px) { #gnb .gnb_1dli .gnb_1da {padding:0 10px;font-size:16px;} } @media (max-width:1016px) { #gnb .gnb_wrap {width:95%;} .container {width:95% !important;} } @media (max-width: 840px){ #gnb {} .stiz1,.stiz2,.stiz3,.stiz4,.stiz5,.stiz6,.stiz7,.stiz8,.stiz9 { padding:5.5em 0 3em;} #gnb {background-padding:0;} #ctt {padding:0;} #gnb_all, #gnb_all_bg {display:none !important;} .lang_right {display:none;} #logo a, #gnb .gnb_wrap {height:51px;background-size:100%;} #logo a, #logo2 a, #footer .logo, #gnb_all h2 span {} #logo a, .scDown #logo a{background-image:url(../../../images/logo_color.png);background-repeat:no-repeat;background-position:center;background-size:100%;} } @media (max-width: 500px){ .stiz1,.stiz2,.stiz3,.stiz4,.stiz5,.stiz6,.stiz7,.stiz8,.stiz9 { padding:4.5em 0 2em;} }