@charset "euc-kr"; /* @import url('/assets/css/set/html5-Reset.css') screen; @import url('/assets/css/set/font.css') screen; */ @import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css'); /* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap'); */ /******************************************************************************************************************************** * Basic SET ********************************************************************************************************************************/ body {background: #fff;} img {vertical-align: top;} img, fieldset {border: none;} ul, ol, li {list-style: none;} address, em {font-style: normal;} li img, dl img, object {vertical-align: middle;} input, select, textarea, form img {vertical-align: middle;} aside, figure, figcaption, hgroup, nav, video, object, header, article, section, footer, article, section, footer {display:block;} /* h1, h2, h3, h4, h5, dl, dt, dd, ul, li, ol, th, td, p, blockquote, form, fieldset, legend, body, div, input { margin: 0; padding: 0; font-family: '맑은 고딕', 'Malgun Gothic', 'MalgunGothicRegular', sans-serif; font-size: 15px; color: #333; letter-spacing: 0; line-height: 110%; font-weight: 400; vertical-align: middle; } */ /* h1, h2, h3, h4, h5, dl, dt, dd, ul, li, ol, th, td, p, blockquote, form, fieldset, legend, body, div, input { margin: 0; padding: 0; vertical-align: middle; } */ /* *::placeholder{ font-family: "Noto Sans KR", "Noto Sans", "맑은 고딕", "Malgun Gothic"; } */ a i{ color: #fff; } .Noto { font-family: 'Noto Sans KR', 'Noto Sans', sans-serif; image-rendering: -webkit-optimize-contrast; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: auto; } body {overflow-y: scroll;} body.scroll-None {overflow-y: auto;} a {color: #333; text-decoration: none; outline: none; cursor: pointer; transition: all 0.2s;} a:link, a:hover, a:active {text-decoration: none;} a:hover {color: #ff5529; text-decoration: underline;} a.link {color: #005cba; text-decoration: underline;} a.link:hover {color: #ff5529;} a.underline-None {text-decoration: none !important;} area, a, a:focus, button:focus {outline: none;} textarea {min-height: 50px; max-height: 70vh; resize: vertical;} input, select, textarea {font-size: 100%; margin:0; padding: 0; vertical-align: middle;} select {cursor: pointer;} strong {font-weight: 700;} .clear, .clearfix {clear: both; margin: 0; padding: 0;} .clearfix::after {content: ''; clear: both; display: block;} * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } i {display: inline-block; vertical-align: middle;} /* 페이지 내 스크롤상태 표시 */ .comm-progress-bar { display: block; position: fixed; top: 0; left: 0; width: 0%; height: 3px; background: rgb(253,191,38); z-index: 100000; transition: all 0.5s; } /* 드래그 방지 - text : 텍스트 선택이 가능 */ .cnt-select-None { -ms-user-select: none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; } /* 마우스 커서 변경 */ /* .customer-pointer {cursor: url('/images/mo3.png'), url('/images/mo3.cur'), auto !important} */ /******************************************************************************************************************************** * Top(header) ********************************************************************************************************************************/ /*---- Sub Navi -----------------------------------------*/ /* #subNavi-hide header.header-wrap {height: 140px !important;} #subNavi-hide article.body-wrap {margin-top: 140px !important;} */ #subNavi-hide header .sub-Navi {display: none;} header .sub-Navi { clear: both; height: 40px; /* border-bottom: 1px solid #e5e8ed; background: #f5f5f5; */ border-bottom: 1px solid #e4ebf2; background: #f2f6f9; /* box-shadow: 0 1px 2px 0 rgba(0,0,0, 0.05); */ } header .sub-Navi .menu-field { padding-left: 0px; overflow: hidden; } header .sub-Navi .menu-field ul {float: left;} header .sub-Navi .menu-field li { float: left; } header .sub-Navi .menu-field li a.menu { display: block; position: relative; height: 40px; padding: 0 15px; font-size: 13px; color: #555; letter-spacing: -0.5px; line-height: 39px; } header .sub-Navi .menu-field li a.menu:hover {color: #f47d31; text-decoration: none;} header .sub-Navi .menu-field li a.menu.active {color: #ff5529; font-weight: bold;} header .sub-Navi .menu-field li a.menu::after { content: ""; display: block; position: absolute; right: 0px; top: 50%; width: 1px; height: 10px; margin: -5px 0 0 0; background: #ccc; } header .sub-Navi .menu-field li:last-child a.menu::after {display: none;} /*---- page Inner Navi -----------------------------------------*/ .comm-pgNavi-wrap { clear: both; position: relative; margin: 0px 0 -10px 0; padding: 40px 0 0 0; /* overflow: hidden; */ background: #f9f9f9; z-index: 1; } .comm-pgNavi-wrap::before, .comm-pgNavi-wrap::after { content: ""; display: block; position: absolute; top: 0; bottom: 0px; width: 100%; border-bottom: 1px solid #e5e5e5; background: #f9f9f9; } .comm-pgNavi-wrap::before {left: -100%;} .comm-pgNavi-wrap::after {right: -100%;} .comm-pgNavi-wrap div.box {position: relative; padding: 0 0 0px 0; z-index: 10;} .comm-pgNavi-wrap ul { float: left; width: 100%; } .comm-pgNavi-wrap li {float: left; position: relative;} .comm-pgNavi-wrap li a { clear: both; display: block; position: relative; bottom: 0; height: 50px; font-size: 15px; color: #555; letter-spacing: -0.5px; line-height: 48px; text-decoration: none !important; text-align: center; vertical-align: middle; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #ddd; border-right: 1px solid #d9d9d9; background: #ffffff; background: -moz-linear-gradient(top, #ffffff 0%, #f8f8f8 100%); background: -webkit-linear-gradient(top, #ffffff 0%,#f8f8f8 100%); background: linear-gradient(to bottom, #ffffff 0%,#f8f8f8 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8f8f8',GradientType=0 ); /* box-shadow: 0 2px 1px 0 rgba(0,0,0, 0.05); */ transition: all 0.2s; } .comm-pgNavi-wrap li:first-child a {border-left: 1px solid #d9d9d9;} .comm-pgNavi-wrap li.active a {animation: none !important;} .comm-pgNavi-wrap li a:hover {color: #111; bottom: -3px; box-shadow: 0 2px 1px 0 rgba(0,0,0, 0.05);} .comm-pgNavi-wrap li.active a { font-size: 16px; color: #fff; font-weight: bold; border-top: 1px solid #196972; border-bottom: 1px solid #15535a; background: #333; /* #093d6b */ box-shadow: 0 2px 2px 0 rgba(0,0,0, 0.25), 0 23px 1px 0 rgba(255,255,255, 0.02) inset; } .comm-pgNavi-wrap .small li a, .comm-pgNavi-wrap .small li.active a {font-size: 13px;} .comm-pgNavi-wrap li.active a::before { content: ""; display: block; position: absolute; bottom: -8px; left: 50%; width: 16px; height: 16px; margin: 0 0 0 -8px; padding: 9px 1px 0 0; font-size: 5px; color: #fff; text-align: center; border-radius: 100%; background: #333 url('/images/pgNavi_ic_org.png') no-repeat center 9px; /* #093d6b */ z-index: 2; } .comm-pgNavi-wrap .update-icon { position: absolute; top: -10px; left: 50%; margin: 0 0 0 -17px; z-index: 5; } /******************************************************************************************************************************** * Top(header) 수정(2021-05-03~) ********************************************************************************************************************************/ header.header-new-wrap {min-width: 1300px; z-index: 10;} /* IE10+ : IE11 지원종료 안내 */ .comm-ie11-show {display: none;} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { header.header-new-wrap {margin-top: 36px;} header.header-new-wrap::before { content: "★ IE11 지원 종료 - 2021년 8월 17일 이후에는 Internet Explorer 지원이 중단됩니다. 정상적인 서비스 이용을 위해 다른 브라우저(크롬, 엣지 등)를 사용하세요."; position: absolute; top: 0; left: 0; right: 0; height: 36px; font-size: 14px; color: #fff; letter-spacing: -0.5px; line-height: 34px; text-align: center; background: #e32b24; } .comm-ie11-show {display: block !important;} } /*----- sMenu -----------------------------------------*/ header.header-new-wrap .top-smenu {border-bottom: 1px solid #eee; background-color: #f4f4f4;} header.header-new-wrap .top-smenu a.t-qlink { display: inline-block; position: relative; height: 30px; margin: 0 0px 0 0; padding: 0 6px; font-size: 12px; color: #777; letter-spacing: -0.3px; line-height: 30px; text-decoration: none; } header.header-new-wrap .top-smenu a.t-qlink::after { content: ""; display: block; position: absolute; top: 11px; right: -3px; width: 1px; height: 9px; background: rgba(0,0,0, 0.15); } header.header-new-wrap .top-smenu a.t-qlink:first-child {padding-left: 0;} header.header-new-wrap .top-smenu a.t-qlink.None {padding-right: 0;} header.header-new-wrap .top-smenu a.t-qlink.None::after {display: none;} header.header-new-wrap .top-smenu a.t-qlink i {margin: 0;} header.header-new-wrap .top-smenu a.t-qlink i.fa-star-o {margin: 0 2px 1px 0; font-size: 11px; color: #999; vertical-align: text-bottom;} /* main용 */ header.header-new-wrap .top-smenu a.t-qlink.bookmark::after {display: none;} header.header-new-wrap .top-smenu a.t-qlink.home {padding: 0 10px; border-left: 1px solid #eaeaea; border-right: 1px solid #e7e7e7; background: #fff;} header.header-new-wrap .top-smenu a.t-qlink.home::before { content: ""; display: block; position: absolute; bottom: -1px; left: 0; right: 0; height: 1px; background: #fff; } header.header-new-wrap .top-smenu a.t-qlink.home::after {display: none;} /* Right Button */ header.header-new-wrap .top-smenu .rt {position: absolute; top: 0; right: 0;} header.header-new-wrap .top-smenu .rt a.t-qlink {font-size: 13px; color: #555; letter-spacing: -0.5px;} header.header-new-wrap .top-smenu .rt a.t-qlink:hover {color: #ff5529;} header.header-new-wrap .top-smenu .rt a.t-qlink.coupon { display: inline-block; position: relative; height: 20px; margin: 0 0 2px 8px; padding: 0 8px; font-size: 11px; color: #fff; letter-spacing: -0.8px; line-height: 20px; text-align: center; text-decoration: none !important; vertical-align: middle; border-radius: 3px; background: #375693; } header.header-new-wrap .top-smenu .rt a.t-qlink.coupon:hover {background: #356bd6;} header.header-new-wrap .top-smenu .rt a.t-qlink.user {font-size: 12px; color: #777; cursor: default;} header.header-new-wrap .top-smenu .rt a.user strong {display: inline-block; margin: 0 2px 0 0; color: #e94e1b;} header.header-new-wrap .top-smenu .rt a.user i {margin: 0 3px 2px 0; font-size: 12px; color: #e94e1b; vertical-align: middle;} header.header-new-wrap .top-smenu .rt a.mydata {color: #666699; font-weight: bold;} header.header-new-wrap .top-smenu .rt a.mypage {color: #e94e1b; font-weight: bold;} /* 패키지 회원용 */ header.header-new-wrap .top-smenu .rt a.t-qlink.package { display: inline-block; position: relative; height: 20px; margin: 0 -6px 2px 8px; padding: 0 8px; font-size: 11px; color: #fff; letter-spacing: -0.8px; line-height: 20px; text-align: center; text-decoration: none !important; vertical-align: middle; border-radius: 3px; background: #e05555; } header.header-new-wrap .top-smenu .rt a.t-qlink.package i {margin: 0 4px 3px 0; vertical-align: middle;} /* infoBox Hover */ header.header-new-wrap .top-smenu .rt .login-info:hover .comm-member-infoBox {height: 380px;} /*----- infoBox -----*/ .comm-member-infoBox { position: absolute; top: 16px; left: 0; height: 0px; padding: 5px 5px 0 0; transition: height 0.2s; overflow: hidden; z-index: 1000; } header.header-new-wrap .top-smenu .rt .comm-member-infoBox {top: 25px !important;} .comm-member-infoBox .bx { width: 240px; min-height: 100px; border: 1px solid #cacaca; background: #fff; box-shadow: 3px 3px 3px 0 rgba(0,0,0, 0.1); } .comm-member-infoBox .mBtns {border-bottom: 1px solid #d7d7d7; overflow: hidden;} .comm-member-infoBox .mBtns a { float: left; width: 42%; height: 26px; font-size: 11px; color: #666; line-height: 25px; text-decoration: none !important; text-align: center; border-right: 1px solid #e0e0e0; background: #f0f4f8; } .comm-member-infoBox .mBtns a:last-child {border-right: none;} .comm-member-infoBox .mBtns a:hover {color: #000; background: #e0e9f1;} .comm-member-infoBox .mBtns a.power {width: 16%; background: #fff;} .comm-member-infoBox .mBtns a.power i {margin: 0 0 3px 0 !important; font-size: 15px !important; color: #dd1010 !important;} .comm-member-infoBox .info { position: relative; padding: 13px 14px 13px 14px; font-size: 12px; color: #444; letter-spacing: 0px; line-height: 175%; } .comm-member-infoBox .info .d-day {position: absolute; top: 12px; right: 14px; color: #333;} .comm-member-infoBox .info .d-day i {font-size: 12px !important;} .comm-member-infoBox .btn2 { display: block; height: 25px; margin: 0 14px 5px 14px; font-size: 12px; color: #ff643c; line-height: 23px; text-decoration: none !important; text-align: center; border: 1px solid #ff643c; border-radius: 3px; } .comm-member-infoBox .btn2.regist {color: #666699; border-color: rgba(102,102,153, 0.7);} .comm-member-infoBox .helpdesk { margin: 14px 0 0 0; padding: 11px 14px 11px 14px; font-size: 12px; color: #666; letter-spacing: -0.2px; line-height: 120%; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #d7d7d7; } .comm-member-infoBox .helpdesk a { display: block; margin: 6px 0 0 0; font-size: 12px; color: #555; line-height: 23px; text-decoration: none !important; text-align: center; border: 1px solid #e0e0e0; border-radius: 3px; } .comm-member-infoBox .helpdesk a span { display: inline-block; height: 25px; padding: 0 12px 0 0; background: url('/images/mySave_menu_icon.png') no-repeat right 7px; background-size: auto 9px; } .comm-member-infoBox .quick { position: relative; padding: 11px 20px 13px 16px; font-size: 12px; color: #555; letter-spacing: -0.2px; line-height: 180%; } .comm-member-infoBox .quick a { display: block; padding: 0 0 0 8px; background: url('/images/ic_dot2.gif') no-repeat 0 9px; } /*----- head -----------------------------------------*/ header.header-new-wrap .top-head {position: relative; height: 90px;} header.header-new-wrap .top-head .logo { float: left; display: inline-block; margin: 21px 0 0 10px; } /*----- Total Search -----*/ header.header-new-wrap .top-head .total-search-wp {float: left; position: relative; margin: 24px 0 0 40px;} /* header.header-new-wrap .top-head .total-search-wp .form-control { width: 480px; height: 40px; padding-left: 20px; padding-right: 60px; font-size: 16px; color: #333; font-weight: 400; border: none; border-radius: 40px; background-color: #eee; transition: all 0.2s; } */ .form-control option{ font-family: "맑은 고딕", "Malgun Gothic", "Noto Sans KR", "Noto Sans"; } header.header-new-wrap .top-head .total-search-wp .form-control { width: 470px; height: 42px; padding-left: 20px; padding-right: 90px; font-size: 16.5px; color: #333; font-weight: bold; border: 2px solid #333; border-radius: 42px; background-color: #fff; transition: all 0.2s; } header.header-new-wrap .top-head .total-search-wp .form-control:focus {background-color: #fefefe;} header.header-new-wrap .top-head .total-search-wp .form-control::-moz-placeholder {font-size: 13.5px !important; color: #ccc !important;} header.header-new-wrap .top-head .total-search-wp .form-control:-ms-input-placeholder {font-size: 13.5px !important; color: #ccc !important;} header.header-new-wrap .top-head .total-search-wp .form-control::-webkit-input-placeholder {font-size: 13.5px !important; color: #ccc !important;} header.header-new-wrap .top-head .total-search-wp .Btn { position: absolute; top: 0; right: 0; width: 52px; height: 42px; font-size: 20px; line-height: 100%; text-align: center; text-decoration: none !important; border-radius: 0px; } header.header-new-wrap .top-head .total-search-wp .Btn i {display: block; margin: 10px 0 0 0;} /* 자동완성형 */ header.header-new-wrap .top-head .total-search-wp .sugicn-icon { position: absolute; top: 11px; left: 404px; width: 25px; height: 17px; cursor: pointer; z-index: 2; overflow: hidden; } header.header-new-wrap .top-head .total-search-wp #SchSug { position: absolute; top: 41px; left: 20px; width: 400px !important; height: 0px !important; z-index: 50; } header.header-new-wrap .top-head .total-search-wp #SchSug iframe {width: 400px !important; height: 0; padding: 0 0 0px 0;} /* 예판상세검색 */ header.header-new-wrap .top-head .btn-detail-yp { float: left; display: inline-block; height: 34px; margin: 28px 0 0 10px; padding: 0 15px; font-size: 11.5px; color: #fff; letter-spacing: -0.5px; line-height: 34px; text-align: center; text-decoration: none; border-radius: 34px; background: #074378; } header.header-new-wrap .top-head .btn-detail-yp:hover {background: #0c61ad;} header.header-new-wrap .top-head .btn-rank { float: left; display: inline-block; position: relative; width: 48px; height: 34px; margin: 28px 0 0 8px; font-size: 11.5px; color: #fff; letter-spacing: -0.5px; line-height: 34px; text-align: center; text-decoration: none; border-radius: 34px; border: 1px solid #ddd; background: #fff url('/images/comm_navi_rank.png') no-repeat 50% 50%; overflow: hidden; } header.header-new-wrap .top-head .btn-rank::before { content: ""; display: block; position: absolute; bottom: 0; left: 0; right: 0; height: 17px; background: rgba(0,0,0, 0.03); } header.header-new-wrap .top-head .btn-rank:hover {border-color: #ccc;} /*------ Top slide Banner -----*/ header.header-new-wrap .top-head .top-slide-Banner {position: absolute; top: 18px; right: 25px; z-index: 1;} header.header-new-wrap .top-head .top-slide-Banner .mask { width: 240px; height: 55px; overflow: hidden; } header.header-new-wrap .top-head .top-slide-Banner #ban_imgList {position: relative; width: 2000px; left: 0; top: 0;} header.header-new-wrap .top-head .top-slide-Banner #ban_imgList div {float: left; margin: 0; padding: 0;} header.header-new-wrap .top-head .top-slide-Banner #ban_imgList div img {width: 240px; height: 55px;} header.header-new-wrap .top-head .top-slide-Banner .ban-Btn { position: absolute; bottom: -1px; right: -25px; z-index: 10; } header.header-new-wrap .top-head .top-slide-Banner .ban-Btn a { display: inline-block; width: 14px; height: 14px; font-size: 12px; line-height: 8px; text-align: center; text-decoration: none; border: 1px solid #ccc; background: #fbfafa; } header.header-new-wrap .top-head .top-slide-Banner .ban-Btn a.pre {width: 15px !important; border-right: none;} header.header-new-wrap .top-head .top-slide-Banner .ban-Btn a:hover { color: #fff; border-color: #ff643c; background-color: #f25f39; } /*------ 예판상세검색 modal -----------------------------------------*/ header.header-new-wrap .top-yp-sch-detail-modal { display: none; position: absolute; top: 90px; left: 50%; width: 1100px; height: 460px; margin: 0 0 0 -550px; border: 1px solid #111; background: #fff; box-shadow: 0 5px 8px 0 rgba(0,0,0, 0.1); z-index: 1000; animation: group-modal-Mv 0.2s ease-out; } header.header-new-wrap .top-yp-sch-detail-modal .mtitle { position: relative; height: 42px; margin: 0 0 0px 0; padding: 13px 0 0 15px; font-size: 15px; line-height: 1em; font-weight: bold; vertical-align: middle; border-bottom: 1px solid #d5d5d5; } header.header-new-wrap .top-yp-sch-detail-modal .mtitle .close2 { display: block; position: absolute; top: 50%; right: 10px; width: 30px; height: 30px; margin: -15px 0 0 0; background: url('/images/close.png') no-repeat center center; background-size: 22px 22px; transition: all 0.3s; } header.header-new-wrap .top-yp-sch-detail-modal .mtitle .close:hover {background-image: url('/images/close_hover.png');} header.header-new-wrap .top-yp-sch-detail-modal .comm-search-wp {box-shadow: none;} header.header-new-wrap .top-yp-sch-detail-modal .comm-search-wp .dateBtn.w1 {width: 60px; padding: 0;} /*----- Navigation Front -----------------------------------------*/ /* 전체메뉴 Icon */ header.header-new-wrap .nav-front {height: 0; z-index: 11;} header.header-new-wrap .nav-front .toggle-menu-icon { position: absolute; top: 12px; left: 0px; width: 50px; padding: 10px 5px; } header.header-new-wrap .nav-front .toggle-menu-icon::before, header.header-new-wrap .nav-front .toggle-menu-icon::after { content: ''; display: block; height: 4px; border-radius: 4px; background-color: #444; transition: all 0.2s ease-in-out; } header.header-new-wrap .nav-front .toggle-menu-icon:before {margin-bottom: 16px; box-shadow: 0 10px 0 #444;} header.header-new-wrap .nav-front .toggle-menu-icon.active:before { box-shadow: 0 0 0 #444; transform: translateY(10px) rotate(45deg); } header.header-new-wrap .nav-front .toggle-menu-icon.active:after {transform: translateY(-10px) rotate(-45deg);} header.header-new-wrap .nav-front .regst-join { display: inline-block; position: absolute; top: 15px; right: 0; height: 36px; padding: 0 20px; font-size: 13px; color: #fff; letter-spacing: -0.8px; line-height: 36px; text-align: center; text-decoration: none !important; border-radius: 38px; background-color: #ff643c; } header.header-new-wrap .nav-front .regst-join:hover {background-color: #f47d31;} header.header-new-wrap .nav-front .regst-join i {margin: 0 6px 3px 0; font-size: 11px; vertical-align: middle;} /* 카테고리 메뉴 아이콘 출력 */ header.header-new-wrap .nav-front .icon-open {position: absolute; top: -2px; left: 750px;} header.header-new-wrap .nav-front .icon-special {position: absolute; top: -2px; left: 742px;} /* 문자형 */ header.header-new-wrap .nav-front .post-stxt { position: absolute; top: -10px; left: 474px; width: 66px; height: 19px; font-family: 'Noto Sans KR', 'Noto Sans','맑은 고딕', 'Malgun Gothic'; font-size: 10px; color: #fff; letter-spacing: -0.5px; line-height: 18px; font-weight: 400; text-align: center; border-radius: 24px; background: #009cff; z-index: 2; } header.header-new-wrap .nav-front .post-stxt::before {content: "좋은 콘텐츠";} header.header-new-wrap .nav-front .issue-stxt { position: absolute; top: -9px; left: 836px; width: 46px; height: 18px; font-family: 'Noto Sans KR', 'Noto Sans','맑은 고딕', 'Malgun Gothic'; font-size: 10px; color: #46a3de; letter-spacing: 0px; line-height: 16px; font-weight: 400; text-align: center; border: 1px solid #7ebee6; border-radius: 24px; background: #fff; z-index: 2; } header.header-new-wrap .nav-front .issue-stxt::before {content: "ISSUE";} /*----- Navigation -----------------------------------------*/ header.header-new-wrap nav { position: relative; border-top: 1px solid #dcdcdc; border-bottom: 3px solid #00498a; background: #fff; box-shadow: 0 1px 2px 0 rgba(0,0,0, 0.1); z-index: 10; } header.header-new-wrap nav .Navi { width: 1200px; height: 65px; margin: 0 auto; padding: 0 0 0 60px; } header.header-new-wrap nav .Navi li.nv-row {float: left; margin: 0 10px;} header.header-new-wrap nav .Navi li.nv-row a.category { position: relative; display: block; height: 62px; padding: 1px 6px 0 6px; font-family: 'Noto Sans KR', 'Noto Sans', sans-serif; font-size: 20px; color: #444; letter-spacing: -0.8px; line-height: 62px; font-weight: 700; text-decoration: none !important; transition: all 0.2s; } header.header-new-wrap nav .Navi li.nv-row a.category::before { content: ""; display: block; position: absolute; top: 50%; right: -10px; width: 1px; height: 14px; margin: -6px 0 0 0; background: rgba(0,0,0, 0.15); } header.header-new-wrap nav .Navi li.nv-row:last-child a.category::before {display: none;} header.header-new-wrap nav .Navi li.nv-row a.category:hover {color: #ff5529;} header.header-new-wrap nav .Navi li.nv-row a.category.active {color: #ff4c11;} /* 이슈특집용 */ header.header-new-wrap nav .Navi li.nv-row.issue {position: relative;} header.header-new-wrap nav .Navi li.nv-row.issue:hover .box {height: 250px;} header.header-new-wrap nav .Navi li.nv-row.issue .box { position: absolute; top: 68px; left: -10px; height: 0; transition: height 0.2s; overflow: hidden; z-index: 1000; } header.header-new-wrap nav .Navi li.nv-row.issue .box ul { width: 220px; min-height: 100px; padding: 17px 15px 15px 15px; border-left: 2px solid #00498a; border-right: 2px solid #00498a; border-bottom: 2px solid #00498a; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; background: #fff; box-shadow: 2px 2px 5px 0 rgba(0,0,0, 0.2); } header.header-new-wrap nav .Navi li.nv-row.issue .box li { margin: 0 0 7px 0; padding: 0 0 0 10px; font-size: 13px; color: #222; letter-spacing: -0.5px; line-height: 130%; text-align: left; background: url('/images/common_toggle_ic1.png') no-repeat 0 8px; } header.header-new-wrap nav .Navi li.nv-row.issue .box li:last-child {margin-bottom: 0;} header.header-new-wrap nav .Navi li.nv-row.issue .box li:hover {background-image: url('/images/common_toggle_ic3.png');} header.header-new-wrap nav .Navi li.nv-row.issue .box li a {display: block;} /*----- navi sub -----*/ header.header-new-wrap nav .Navi .gnb-sub .container-n { bottom: 0; height: 100%; padding: 15px 0 0 240px; border-right: 1px solid #e3e3e3; background: #fff; } header.header-new-wrap nav .Navi .gnb-sub .container-n .close { display: block; position: absolute; bottom: 0px; right: -41px; width: 41px; height: 38px; border: 1px solid #e3e3e3; border-bottom: none; background: #fff url('/images/comm_toggle_close2.png') no-repeat center center; } header.header-new-wrap nav .Navi .gnb-sub { display: none; position: absolute; top: 68px; left: 0px; right: 0; height: 260px; border-bottom: 1px solid #333; background-color: #f7f7f7; box-shadow: 3px 3px 2px 0 rgba(0,0,0, 0.1); z-index: 900; } header.header-new-wrap nav .Navi .gnb-sub.law {height: 340px;} header.header-new-wrap nav .Navi .gnb-sub.acc {height: 660px;} header.header-new-wrap nav .Navi .gnb-sub.silmu {height: 490px;} header.header-new-wrap nav .Navi .gnb-sub.lecture {height: 275px;} header.header-new-wrap nav .Navi .gnb-sub .subj { position: absolute; top: 0; bottom: 0; left: 0; width: 190px; padding: 145px 0 0 0; font-size: 11px; color: #aaa; letter-spacing: -0.8px; line-height: 130%; text-align: center; border-left: 1px solid #dfdfdf; border-right: 1px solid #cdd9e4; background-color: #ecf0f4; background-repeat: no-repeat; background-position-x: 50%; z-index: 901; } header.header-new-wrap nav .Navi .gnb-sub.law .subj {background-image: url('/images/comm_navi_icon(law).png'); background-position-y: 55px;} header.header-new-wrap nav .Navi .gnb-sub.acc .subj {background-image: url('/images/comm_navi_icon(acc).png'); background-position-y: 50px;} header.header-new-wrap nav .Navi .gnb-sub.yp .subj {background-image: url('/images/comm_navi_icon(yp).png'); background-position-y: 60px;} header.header-new-wrap nav .Navi .gnb-sub.silmu .subj {background-image: url('/images/comm_navi_icon(silmu).png'); background-position-y: 60px;} header.header-new-wrap nav .Navi .gnb-sub.post .subj {background-image: url('/images/comm_navi_icon(post).png'); background-position-y: 60px;} header.header-new-wrap nav .Navi .gnb-sub.consult .subj {background-image: url('/images/comm_navi_icon(consult).png'); background-position-y: 60px;} header.header-new-wrap nav .Navi .gnb-sub.persons .subj {background-image: url('/images/comm_navi_icon(persons).png'); background-position-y: 55px;} header.header-new-wrap nav .Navi .gnb-sub.lecture .subj {background-image: url('/images/comm_navi_icon(lecture).png'); background-position-y: 55px;} header.header-new-wrap nav .Navi .gnb-sub .subj .stit { display: block; position: relative; margin: 0 0 14px 0; font-size: 21px; color: #444; letter-spacing: -2px; } header.header-new-wrap nav .Navi .gnb-sub .subj .stit::before { content: ""; display: block; position: absolute; top: -18px; left: 50%; width: 30px; height: 3px; margin: 0 0 0 -15px; background: #555; } header.header-new-wrap nav .Navi .gnb-sub.acc .acc-column.ifrs {padding-top: 10px;} /* Toggle Reset */ header.header-new-wrap nav .Navi .gnb-sub .nv-sub li .hot {display: inline-block; margin: 0 0 3px 6px; vertical-align: middle;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub {float: left; margin: 0 45px 10px 0;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li { float: none; display: block; position: relative; font-size: 14px; color: #666; letter-spacing: -0.5px; line-height: 150%; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub li.navi-subj { display: block; height: 46px; margin: 0 0 12px 0; padding: 0 40px 0 0; font-size: 17px; color: #111; line-height: 46px; font-weight: bold; border-bottom: 1px solid #555; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub li.navi-subj a {display: block; color: #111; font-weight: bold; text-decoration: none !important;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li.navi-subj.active {border-color: #ff4c11;} header.header-new-wrap nav .Navi .gnb-sub.silmu .nv-sub li.navi-subj {padding-right: 30px;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li a.item { display: block; padding: 0 20px 0 0px; font-size: 13px; color: #555; letter-spacing: -0.5px; line-height: 160%; /* background: url('/images/main_Toggle_ic.png') no-repeat 0 11px; */ } header.header-new-wrap nav .Navi .gnb-sub.law .nv-sub li a.item, header.header-new-wrap nav .Navi .gnb-sub.silmu .nv-sub li a.item {line-height: 150%;} header.header-new-wrap nav .Navi .gnb-sub.acc .nv-sub li a.item {line-height: 140%;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li a.item:hover {color: #ff643c;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li a.item.active {color: #ff4c11;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li .more { display: inline-block; width: 9px; height: 9px; margin: 0 0 2px 6px; vertical-align: middle; background: url('/images/comm_Toggle_more.png') no-repeat 0 0; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub .ssub { display: none; position: absolute; top: 0px; left: 90px; width: 160px; padding: 10px 0 11px 12px !important; border: 1px solid #777; background: #f7f7f7; box-shadow: 3px 3px 1px 0 rgba(0,0,0, 0.1); z-index: 1001; overflow: hidden; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub .ssub.wide {width: 200px;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub .ssub a { clear: both; display: block; font-size: 12px; color: #666; line-height: 150%; text-indent: 8px; background: url('/images/ic_gray2.gif') no-repeat 0 8px; overflow: hidden; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub .ssub a:hover {color: #ff5529;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li:hover .ssub {display: block;} /* stit 내 more/ssub hidden 및 show 처리 */ header.header-new-wrap nav .Navi .gnb-sub .nv-sub li.navi-subj .more {display: none;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub.gnb-sub-hidden {display: none;} header.header-new-wrap nav .Navi .gnb-sub .nv-sub li:hover .ssub.gnb-sub-hide {display: none;} /* 재경실무 메뉴 위치 변경 */ header.header-new-wrap nav .Navi .gnb-sub.silmu .nv-sub.top-move {margin-top: -80px !important;} /* 유관기관 상담사례 Icon */ header.header-new-wrap nav .Navi .gnb-sub .nv-sub .icon-nts { display: inline-block; position: relative; height: 14px; margin: 0 0 1px 9px; padding: 0 5px; font-size: 8px; color: #fff; letter-spacing: -0.5px; line-height: 14px; text-align: center; vertical-align: text-bottom; border-radius: 3px; background: #e05555; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub .icon-nts::before {content: "2006년 부터";} header.header-new-wrap nav .Navi .gnb-sub .nv-sub .icon-nts::after { content: ""; position: absolute; top: 50%; left: -6px; width: 0px; height: 0px; margin: -3px 0 0 0; border: 3px solid; border-color: transparent #e05555 transparent transparent; } /* 실무강의 Icon */ header.header-new-wrap nav .Navi .gnb-sub .nv-sub .icon-lecture { display: inline-block; position: relative; height: 14px; margin: 0 0 1px 9px; padding: 0 5px; font-size: 8px; color: #fff; letter-spacing: -0.5px; line-height: 14px; text-align: center; vertical-align: text-bottom; border-radius: 3px; background: #5a52c9; } header.header-new-wrap nav .Navi .gnb-sub .nv-sub .icon-lecture::before {content: "온라인교육";} header.header-new-wrap nav .Navi .gnb-sub .nv-sub .icon-lecture::after { content: ""; position: absolute; top: 50%; left: -6px; width: 0px; height: 0px; margin: -3px 0 0 0; border: 3px solid; border-color: transparent #5a52c9 transparent transparent; } /*----- 회계메뉴 예외 처리 -----*/ header.header-new-wrap nav .Navi .gnb-sub .acc-column { float: left; width: 33.33333333333333%; padding: 0 0 0 10px; } header.header-new-wrap nav .Navi .gnb-sub .acc-column .nv-sub {margin-bottom: 2px;} .nv-sub-accT {display: none;} header.header-new-wrap nav .Navi .gnb-sub .acc-column .nv-sub-accT { display: block; height: 30px; margin: 8px 50px 4px -10px; font-size: 14px; color: #111; letter-spacing: -0.5px; line-height: 29px; font-weight: bold; text-align: center; background: rgba(64,68,72, 0.2); transition: all 0.1s; } header.header-new-wrap nav .Navi .gnb-sub .acc-column:hover .nv-sub-accT {color: #fff; background: #074378;} /* IFRS 계정과목별 회계와 세무 */ header.header-new-wrap nav .Navi .gnb-sub .acc-column .nv-sub-accT.new {background: #ff643c;} /* 5분특강 배너 */ .comm-nToggle-wp .nv-menu dd .FiveminLec-Banner {display: none !important;} .Navi .gnb-sub .FiveminLec-Banner {display: inline-block; position: absolute; top: 60px; right: 60px;} .Navi .gnb-sub .FiveminLec-Banner a {display: inline-block; margin: 0 0 0 10px; vertical-align: middle;} /*----- 전체메뉴 Toggle -----------------------------------------*/ /*----- toggle menu -----*/ .comm-nToggle-wp { display: none; position: absolute; top: 68px; left: 0px; right: 0; border-bottom: 1px solid #000; background-color: #f7f7f7; box-shadow: 0 3px 2px 0 rgba(0,0,0, 0.1); z-index: 1000; } .comm-nToggle-wp .toggle-close { display: block; position: absolute; bottom: 0px; right: -40px; width: 41px; height: 38px; border: 1px solid #d3d3d3; border-bottom: none; background: #fff url('/images/comm_toggle_close2.png') no-repeat center center; } .comm-nToggle-wp .nv-menu { position: relative; height: 720px; margin: 0 0px 0px 0px; padding: 10px 1px 10px 1px; border-left: 1px solid #d7d7d7; border-right: 1px solid #d3d3d3; background: #fff url('/images/navi_toggle_bg.png') no-repeat right 0; background-size: auto 100%; /* overflow: hidden; */ } .comm-nToggle-wp .nv-menu dl {float: left; position: relative; width: 100%; margin: 6px 0 0 0;} .comm-nToggle-wp .nv-menu dl.c4 dd {width: 25%;} .comm-nToggle-wp .nv-menu dl.c5 dd {width: 20%;} .comm-nToggle-wp .nv-menu dl.c6 dd {width: 16.66666666666667%;} .comm-nToggle-wp .nv-menu dl.c7 dd {width: 14.28571428571429%;} .comm-nToggle-wp .nv-menu dl.c8 dd {width: 12.5%;} .comm-nToggle-wp .nv-menu dd { float: left; position: relative; bottom: 0; margin: 10px 0 15px 0; padding: 0 14px 0 14px; font-size: 100%; border-left: 1px solid #eaeaea; } .comm-nToggle-wp .nv-menu dd:first-child {border-left: none;} .comm-nToggle-wp .nv-menu dd::before { content: ""; display: block; position: absolute; top: 0; bottom:0; right: -1px; width: 1px; height: 100%; background: #eaeaea; } .comm-nToggle-wp .nv-menu dd.rt-Noline::before {display: none;} .comm-nToggle-wp .nv-menu dd .navi-tit { display: block; position: relative; height: 30px; margin: 0 0 13px 0; padding: 0 0 0 0px; font-size: 14px; color: #111; letter-spacing: -0.5px; line-height: 29px; font-weight: bold; text-decoration: none !important; text-align: center; background: rgba(64,68,72, 0.2); transition: all 0.1s; } .comm-nToggle-wp .nv-menu dd:hover .navi-tit, .comm-nToggle-wp .nv-menu dd.active .navi-tit {color: #fff; background: #074378;} /*--- sub ---*/ .comm-nToggle-wp .nv-menu dd .nv-sub {clear: both; margin: 0 0 9px 0;} .comm-nToggle-wp .nv-menu dd .nv-sub li {position: relative; float: none; width: 100%;} .comm-nToggle-wp .nv-menu dd .nv-sub li.navi-subj { margin: 0 0 4px 0; padding: 0 0 0 14px; font-size: 15px; color: #313b4e; letter-spacing: -0.5px; line-height: 120%; font-weight: bold; text-align: left; background: url('/images/common_toggle_ic1.png') no-repeat 5px 8px; transition: all 0.2s; } .comm-nToggle-wp .nv-menu dd .nv-sub li.navi-subj a {color: #313b4e;} .comm-nToggle-wp .nv-menu dd .nv-sub li.navi-subj.active {background-image: url('/images/common_toggle_ic3.png');} .comm-nToggle-wp .nv-menu dd .nv-sub li a.item { display: block; padding: 0 0 0 22px; font-size: 12px; color: #555; letter-spacing: -0.5px; line-height: 160%; background: url('/images/main_Toggle_ic.png') no-repeat 14px 9px; } .comm-nToggle-wp .nv-menu dd .nv-sub li a.item:hover {color: #ff5529;} .comm-nToggle-wp .nv-menu dd .nv-sub li a.item.active {color: #ff5529; font-weight: bold;} /*--- ssub ---*/ .comm-nToggle-wp .nv-menu dd .nv-sub li .more { display: inline-block; width: 9px; height: 9px; margin: 0 0 3px 5px; vertical-align: middle; background: url('/images/comm_Toggle_more.png') no-repeat 0 0; } /* stit 내 more/ssub hidden 처리 */ .comm-nToggle-wp .nv-menu dd .nv-sub li.gnb-sub-show {display: none;} .comm-nToggle-wp .nv-menu dd .nv-sub li .ssub { display: none; position: absolute; top: 0px; left: 90px; width: 150px; padding: 10px 0 11px 12px !important; border: 1px solid #777; background: #f7f7f7; box-shadow: 3px 3px 1px 0 rgba(0,0,0, 0.1); transition: all 0.2s; z-index: 1001; overflow: hidden; } .comm-nToggle-wp .nv-menu dd .nv-sub li .ssub.wide {width: 180px;} .comm-nToggle-wp .nv-menu dd .nv-sub li .ssub a { clear: both; display: block; font-size: 12px; color: #666; line-height: 150%; text-indent: 8px; background: url('/images/ic_gray2.gif') no-repeat 0 8px; overflow: hidden; } .comm-nToggle-wp .nv-menu dd .nv-sub li .ssub a:hover {color: #ff5529;} .comm-nToggle-wp .nv-menu dd .nv-sub li:hover .ssub {display: block;} /* 예외 */ .comm-nToggle-wp .nv-menu dd.persons .nv-sub li .ssub {left: 30px;} .comm-nToggle-wp .nv-menu dd .nv-sub li .hot {display: inline-block; margin: 0 0 3px 6px; vertical-align: middle;} /* 회계메뉴 예외 처리 */ .comm-nToggle-wp .nv-menu dd.acc .acc-column .nv-sub-accT { display: block; margin: 15px 0 12px 0; padding: 0 0 8px 17px; font-size: 15px; color: #111; letter-spacing: -0.5px; line-height: 120%; font-weight: bold; border-bottom: 1px solid #ddd; background: url('/images/board_ic.gif') no-repeat 0 4px; } .comm-nToggle-wp .nv-menu dd.acc .acc-column {display: block; margin-bottom: 25px;} /*----- Quick Link 부분 -----*/ .comm-nToggle-wp .nv-menu .nv-menu-Quick {position: absolute; top: 490px; left: 19px; width: 160px; border: 1px solid #ddd; border-bottom-color: #d3d3d3; border-right-color: #d3d3d3;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li {border-bottom: 1px solid #e3e3e3;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li:last-child {border-bottom: none;} .comm-nToggle-wp .nv-menu .nv-menu-Quick a { display: block; height: 36px; padding: 0 16px 0 40px; font-size: 12px; color: #555; letter-spacing: -0.5px; line-height: 34px; font-weight: normal; text-decoration: none; background-color: #fafafa; background-repeat: no-repeat; background-position: 10px center; } .comm-nToggle-wp .nv-menu .nv-menu-Quick a:hover {color: #ff5529; font-weight: bold; background-color: #f3f5f8;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.threeDan a:hover {color: #41aaa4;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.threeDan a {background-image: url('/images/comm_left_threeDan.png');} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.bub a:hover {color: #f19452;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.bub a {background-image: url('/images/comm_left_bub.png');} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.kifrs a:hover {color: #aec21f;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.kifrs a {background-image: url('/images/comm_left_kifrs.png');} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.mysave a:hover {color: #9b6a38;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.mysave a {background-image: url('/images/comm_left_mysave.png');} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.error a:hover {color: #3faeaa;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.error a {background-image: url('/images/comm_left_error.png');} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.pc a:hover {color: #dfaa2d;} .comm-nToggle-wp .nv-menu .nv-menu-Quick li.pc a {background-image: url('/images/comm_left_pc.png');} /******************************************************************************************************************************** * 공통 Left Toggle Menu ********************************************************************************************************************************/ input[type="checkbox"]#comm_lt_Menu {display: none;} input[type="checkbox"]#comm_lt_Menu:checked ~ .comm-lt-Menu-wp {left: 0px !important;} input[type="checkbox"]#comm_lt_Menu:checked ~ .comm-lt-Menu-wp .lt-Btn i {margin-left: 0px;} input[type="checkbox"]#comm_lt_Menu:checked ~ .comm-lt-Menu-wp .lt-Btn i::before {content: "\f053";} .comm-lt-Menu-wp { position: absolute; top: 230px; bottom: 0; left: -220px; width: 220px; height: 100%; border-right: 1px solid #cacfd3; background: #f8f9fb; transition: left 0.2s; z-index: 2; } .comm-lt-Menu-wp.up {position: fixed; top: 0px;} .comm-lt-Menu-wp .lt-Btn { display: block; position: absolute; top: 15px; right: -30px; width: 30px; height: 46px; padding: 14px 0 0 6px; font-size: 14px; color: #555; line-height: 100%; border: 1px solid #cacfd3; border-top-right-radius: 46px; border-bottom-right-radius: 46px; background: #fafafa; cursor: pointer; z-index: 8; } .comm-lt-Menu-wp .lt-Btn i {margin-left: 2px;} .comm-lt-Menu-wp .lt-Btn i::before {content: "\f054";} .comm-lt-Menu-wp .ctg-stit { padding: 45px 0 15px 0; font-family: 'Noto Sans KR', 'Noto Sans' !important; font-size: 15.5px; line-height: 100%; font-weight: 400; text-align: center; background-color: #fff; background-repeat: no-repeat; background-position: 50% 15px; background-size: auto 25px; } .comm-lt-Menu-wp.law .ctg-stit {background-image: url('/images/comm_navi_icon(law).png');} .comm-lt-Menu-wp.acc .ctg-stit {background-image: url('/images/comm_navi_icon(acc).png');} .comm-lt-Menu-wp.yp .ctg-stit {background-image: url('/images/comm_navi_icon(yp).png');} .comm-lt-Menu-wp.silmu .ctg-stit {background-image: url('/images/comm_navi_icon(silmu).png');} .comm-lt-Menu-wp.post .ctg-stit {background-image: url('/images/comm_navi_icon(post).png');} .comm-lt-Menu-wp.consult .ctg-stit {background-image: url('/images/comm_navi_icon(consult).png');} .comm-lt-Menu-wp.persons .ctg-stit {background-image: url('/images/comm_navi_icon(persons).png');} .comm-lt-Menu-wp.lecture .ctg-stit {background-image: url('/images/comm_navi_icon(lecture).png');} .comm-lt-Menu-wp .ctg-box .nv-sub.finh {padding-bottom: 100px;} /* 회계메뉴만 예외 처리 */ .comm-lt-Menu-wp.acc .ctg-box .nv-sub .more {display: none !important;} .comm-lt-Menu-wp.acc .ctg-box .nv-sub .ssub {display: none !important;} .comm-lt-Menu-wp .ctg-box { position: relative; bottom: 0px; height: 100%; margin: 15px 15px 0 15px; padding: 18px 6px 18px 6px; border: 1px solid #dae1e6; background: #fff; } .comm-lt-Menu-wp .ctg-box::after { content: ""; display: block; position: absolute; top: -15px; bottom: 0; right: -16px; width: 2px; background: rgba(0,0,0, 0.03); } .comm-lt-Menu-wp .ctg-box .nv-sub {clear: both; margin: 0 0 10px 0;} .comm-lt-Menu-wp .ctg-box .nv-sub li {position: relative; float: none; width: 100%;} .comm-lt-Menu-wp .ctg-box .nv-sub li.navi-subj { margin: 0 0 4px 0; padding: 0 0 0 14px; font-size: 14px; color: #313b4e; letter-spacing: -0.5px; line-height: 120%; font-weight: bold; text-align: left; background: url('/images/common_toggle_ic1.png') no-repeat 5px 8px; transition: all 0.2s; } .comm-lt-Menu-wp .ctg-box .nv-sub li.navi-subj a {color: #313b4e;} .comm-lt-Menu-wp .ctg-box .nv-sub li.navi-subj.active {background-image: url('/images/common_toggle_ic3.png');} .comm-lt-Menu-wp .ctg-box .nv-sub li a.item { display: inline-block; padding: 0 10px 0 22px; font-size: 12px; color: #555; letter-spacing: -0.5px; line-height: 155%; background: url('/images/main_Toggle_ic.png') no-repeat 14px 9px; } .comm-lt-Menu-wp .ctg-box .nv-sub li a.item:hover {color: #ff5529;} .comm-lt-Menu-wp .ctg-box .nv-sub li a.item.active {color: #ff5529; font-weight: bold;} /*--- ssub ---*/ .comm-lt-Menu-wp .ctg-box .nv-sub li .more { display: inline-block; width: 9px; height: 9px; margin: 0 0 3px 5px; vertical-align: middle; background: url('/images/comm_Toggle_more.png') no-repeat 0 0; } .comm-lt-Menu-wp .ctg-box .nv-sub li .ssub { display: none; position: absolute; top: 0px; left: 90px; width: 150px; padding: 10px 0 11px 12px !important; border: 1px solid #777; background: #f7f7f7; box-shadow: 3px 3px 1px 0 rgba(0,0,0, 0.1); transition: all 0.2s; z-index: 1001; overflow: hidden; } .comm-lt-Menu-wp .ctg-box .nv-sub li .ssub.wide {width: 180px;} .comm-lt-Menu-wp .ctg-box .nv-sub li .ssub.top-move {top: -50px;} .comm-lt-Menu-wp .ctg-box .nv-sub li .ssub a { clear: both; display: block; font-size: 12px; color: #666; line-height: 150%; text-indent: 8px; background: url('/images/ic_gray2.gif') no-repeat 0 8px; overflow: hidden; } .comm-lt-Menu-wp .ctg-box .nv-sub li .ssub a:hover {color: #ff5529;} .comm-lt-Menu-wp .ctg-box .nv-sub li:hover .ssub {display: block;} .comm-lt-Menu-wp .ctg-box .nv-sub li .hot {display: none;} /* stit 내 more/ssub hidden 및 show 처리 */ .comm-lt-Menu-wp .ctg-box .nv-sub li.gnb-sub-show {display: none;} /* .comm-lt-Menu-wp .ctg-box .nv-sub li.navi-subj .more {display: none;} .comm-lt-Menu-wp .ctg-box .nv-sub.gnb-sub-hidden {display: none;} */ /*------ 유관기관 바로가기 ------*/ .comm-lt-Menu-wp .sitelink-wp {position: absolute; bottom: 0px; left: 16px; right: 16px;} .comm-lt-Menu-wp .sitelink-wp .box ul {float: left; width: 100%;} .comm-lt-Menu-wp .sitelink-wp .box li { float: left; width: 25%; text-align: center; border: 1px solid #dae1e6; border-left: none; } .comm-lt-Menu-wp .sitelink-wp .box li:last-child {border-right: none;} .comm-lt-Menu-wp .sitelink-wp .box li a.part { display: block; height: 24px; font-size: 12px; color: #3d4655; line-height: 24px; text-decoration: none; background: #f8f9fb; cursor: pointer; } .comm-lt-Menu-wp .sitelink-wp .box li a.part:hover {color: #fff; background-color: #6799cf;} .comm-lt-Menu-wp .sitelink-wp .box li .toggle { display: none; position: fixed; bottom: 40px; left: 30px; width: 250px; padding: 0 0 20px 0; background: #407ec5; box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); z-index: 11000; animation: toggle 300ms ease-out; } @keyframes toggle { from { opacity: 0; transform: translate(0, 10px); } to { opacity: 1; transform: translate(0, 0); } } .comm-lt-Menu-wp .sitelink-wp .toggle p.subj { position: relative; height: 45px; padding: 20px 0 0 41px; font-size: 13px; color: #fff; letter-spacing: -0.5px; text-align: left; background: url('/pds/images/main/main_sitelink_popTop.png') no-repeat 0 0; } .comm-lt-Menu-wp .sitelink-wp .toggle p.subj a { display: block; position: absolute; top: 0; right: 0; width: 30px; height: 30px; cursor: pointer; z-index: 110; } .comm-lt-Menu-wp .sitelink-wp .toggle .list { width: 207px; margin: 0 auto; padding: 7px 5px 5px 8px; line-height: 1em; text-align: left; vertical-align: top; border-radius: 6px; background: #fff; } .comm-lt-Menu-wp .sitelink-wp .toggle .list a { display: inline-block; min-width: 92px; height: 20px; margin: 0 0 0 0; padding: 0 0 0 7px; font-size: 12px; letter-spacing: -0.5px; background: url('/pds/images/main/main_sitelink_popIc.png') no-repeat 0 8px; } .comm-lt-Menu-wp .sitelink-wp .toggle .list a:hover {background-image: url('/pds/images/main/main_sitelink_popIc_hover.png');} .top-cd-menu {display: none;} /******************************************************************************************************************************** * 공통 right Navigation ********************************************************************************************************************************/ input[type="checkbox"]#comm_rt_Menu {display: none;} input[type="checkbox"]#comm_rt_Menu:checked ~ .comm-rt-Menu-wp {right: 0 !important;} input[type="checkbox"]#comm_rt_Menu:checked ~ .comm-rt-Menu-wp .rt-Btn {width: 17px;} input[type="checkbox"]#comm_rt_Menu:checked ~ .comm-rt-Menu-wp .rt-Btn i::before { content: "\f054"; margin: 0 0 0 5px; } .comm-rt-Menu-wp { position: fixed; top: 0; bottom: 0; right: -60px; width: 60px; border: 1px solid #5c5c5d; border-right: none; background: #74747a; box-shadow: -2px 0 0px 0 rgba(0,0,0, 0.1); transition: right 0.2s; z-index: 10; } .comm-rt-Menu-wp .box { position: relative; top: 0; bottom: 0; left: 0; right: 0; height: 100%; z-index: 11; } .comm-rt-Menu-wp .rt-Btn { display: block; position: absolute; top: 50%; right: 60px; width: 20px; height: 56px; margin: -35px 0 0 0; border: 1px solid #5c5c5d; border-right-color: #6a6a6a; background: #74747a; box-shadow: -1px 2px 3px 0 rgba(0,0,0, 0.2); transition: margin 0.1s; cursor: pointer; } .comm-rt-Menu-wp .rt-Btn i::before { content: "\f053"; margin: 0 0 0 5px; font-size: 10px; color: #fff; line-height: 55px; text-align: center; } .comm-rt-Menu-wp .rt-Btn:hover {border-color: #e95833; background: #ff643c;} .comm-rt-Menu-wp ul {margin: 0px 0 0 0; transition: margin 0.1s;} .comm-rt-Menu-wp li:last-child {border-bottom: none;} .comm-rt-Menu-wp li.subj { height: 26px; font-size: 9px; color: rgba(255,255,255, 0.7); letter-spacing: 1px; line-height: 24px; text-align: center; background: #111; box-shadow: 0 12px 0 0 rgba(255,255,255, 0.06) inset; transition: all 0.3s; } .comm-rt-Menu-wp:hover li.subj {color: #fff; background: #1b3c70;} .comm-rt-Menu-wp li a { display: block; position: relative; padding: 35px 0 14px 0; font-size: 11px; color: #ddd; letter-spacing: -0.5px; line-height: 1.1em; text-align: center; text-decoration: none; background: #74747a url('/images/comm_rig_icon(new).png') no-repeat; background-position-x: 5px; transition: none; } .comm-rt-Menu-wp li a::before { content: ""; display: block; position: absolute; bottom: 0px; left: 8px; right: 8px; height: 1px; background: #89898e; } .comm-rt-Menu-wp li a::after { content: ""; display: block; position: absolute; bottom: 1px; left: 8px; right: 8px; height: 1px; background: #646469; } .comm-rt-Menu-wp li:last-child a::before, .comm-rt-Menu-wp li:last-child a::after {display: none;} .comm-rt-Menu-wp li a:hover { color: #fff; text-shadow: 0 1px 0 rgba(0,0,0, 0.5); background-color: #69696e; background-position-x: -44px; } .comm-rt-Menu-wp li.pRtQ1 a {background-position-y: -138px;} .comm-rt-Menu-wp li.pRtQ2 a {background-position-y: -66px;} .comm-rt-Menu-wp li.pRtQ3 a {padding-top: 34px; background-position-y: -200px;} .comm-rt-Menu-wp li.pRtQ4 a {background-position-y: -272px;} .comm-rt-Menu-wp li.pRtQ5 a {background-position-y: -417px;} .comm-rt-Menu-wp li.pRtQ6 a {background-position-y: -478px;} .comm-rt-Menu-wp li.pRtQ7 a {padding-top: 38px; background-position-y: -340px;} /*----- scroll up 시 -----*/ /* .comm-rt-Menu-wp.cMenu-up ul {margin-top: 83px;} .comm-rt-Menu-wp.cMenu-up .Btn {margin-top: 27px;} */ /*----- sub메뉴 없을 시 -----*/ /* #subNavi-hide .comm-rt-Menu-wp ul {margin-top: 140px;} #subNavi-hide .comm-rt-Menu-wp.cMenu-up ul {margin-top: 43px;} #subNavi-hide .comm-rt-Menu-wp.cMenu-up .Btn {margin-top: 9px;} */ /*------ 마이메뉴 ------*/ .comm-rt-Menu-wp .comm-my-menu-wp { display: none; position: absolute; top: 14px; left: -185px; width: 180px; padding: 12px 0 12px 0; border: 1px solid #141414; background: #fff; box-shadow: 2px 2px 4px 0 rgba(0,0,0, 0.2); animation: myMenu_Ani 0.5s ease-out; } @keyframes myMenu_Ani { from { opacity: 0; transform: translate(0, 20px); } to { opacity: 1; transform: translate(0, 0); } } .comm-rt-Menu-wp .comm-my-menu-wp dl { clear: both; min-height: 200px; max-height: 400px; margin: 0 0 2px 0; padding: 0 12px; overflow: hidden; } .comm-rt-Menu-wp .comm-my-menu-wp dt { height: 19px; margin: 0 0 8px 0; font-size: 12px; color: #fff; line-height: 16px; font-weight: bold; text-align: center; background: #bababa; } .comm-rt-Menu-wp .comm-my-menu-wp dd { clear: both; margin: 0 0 10px 0; padding: 0 2px 0 2px; font-size: 13px; line-height: 1.3em; } .comm-rt-Menu-wp .comm-my-menu-wp dd strong { display: block; margin: 0 0 3px 0; padding: 0 0 0 8px; background: url('/images/comm_mymenu_ic1.png') no-repeat 0 10px; } .comm-rt-Menu-wp .comm-my-menu-wp dd .menu { display: block; margin: 0 0 0 8px; padding: 0 0 0 8px; background: url('/images/comm_mymenu_ic2.gif') no-repeat 0 10px; } .comm-rt-Menu-wp .comm-my-menu-wp dd .menu .mymenu-del-chk { display: none; margin: 0 4px 0 0; vertical-align: text-bottom; } .comm-rt-Menu-wp .comm-my-menu-wp dd a { display: inline-block; font-size: 12px; color: #666; letter-spacing: -1px; } .comm-rt-Menu-wp .comm-my-menu-wp dd a:hover {color: #ff5529;} .comm-rt-Menu-wp .comm-my-menu-wp .btns { margin: 0 12px; padding: 10px 0 0 0; border-top: 1px dotted #666; } .comm-rt-Menu-wp .comm-my-menu-wp .btns {text-align: center;} .comm-rt-Menu-wp .comm-my-menu-wp .btns a.btn-type { display: inline-block; height: 24px; padding: 0 8px; font-size: 11px; line-height: 19px; font-weight: normal; } .comm-rt-Menu-wp .comm-my-menu-wp .btns .btn-type.comm-myMenu-del {display: none;} /******************************************************************************************************************************** * page별 Default SET ********************************************************************************************************************************/ .container-n { position: relative; width: 1200px; margin: 0 auto; padding: 0; vertical-align: top; /* border-left: 1px solid red; border-right: 1px solid red; */ } .body-wrap { clear: both; position: relative; min-width: 1300px; margin: 0px auto 0 auto; overflow: hidden; /* overflow-y: hidden; */ } article.bg {background: #f9f9f9;} article .Lt {float: left;} article .Rt {float: right;} .body-Contents-wp { position: relative; min-height: 700px; margin: 80px 0 120px 0; text-align: left; /* border-left: 1px solid rgba(0,0,0, 0.1); border-right: 1px solid rgba(0,0,0, 0.1); */ z-index: 1; } .body-Contents-wp.bg-white {background: #fff;} .body-Contents-wp.search-wrap {margin-top: 5px;} .body-Contents-wp.top-None {margin-top: 0;} .body-Contents-wp.None {margin: 0;} /*------ 쳇봇 ------*/ .comm-chatBot-Btn { position: fixed; bottom: 75px; right: 29px; /* animation: chatBot_Ani 0.8s infinite; */ z-index: 100; } .comm-chatBot-Btn a { display: block; position: relative; width: 64px; height: 64px; padding: 15px 0 0 0; font-size: 200%; color: #fff; line-height: 0 !important; text-decoration: none !important; text-align: center; border-radius: 100%; border: 1px solid #01a77d; background: #00b789; /* background: #0079db url('/images/comm_chatBot_Btn.png') no-repeat center 0; */ box-shadow: 2px 2px 3px 0 rgba(0,0,0, 0.2); transition: all 0.2s; } .comm-chatBot-Btn a:hover {border-color: #ff643c; background-color: #f25f39;} /* @keyframes chatBot_Ani {50% {bottom: 78px;}} */ .comm-chatBot-Btn a::after { content: "Beta"; display: inline-block; position: absolute; top: -20px; left: 50%; width: 40px; height: 16px; margin: 0 0 0 -20px; font-size: 11px; color: #fff; line-height: 14px; text-align: center; border-radius: 16px; background: #ff5529; } .comm-chatBot-Btn a:hover::after {background: #00b789;} /*------ 소셜아이콘 ------*/ .social-icon-wp {position: absolute; top: 140px; right: 0;} .social-icon-wp ul {float: left;} .social-icon-wp li { float: left; margin: 0 0 0 4px; } .social-icon-wp li a { display: block; width: 45px; height: 45px; border-radius: 100%; background-image: url('/images/social_icon.png'); background-repeat: no-repeat; background-size: auto 45px; transition: all 0.3s; cursor: pointer; } .social-icon-wp li:hover a { transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -o-transform:rotateY(360deg); -ms-transform:rotateY(360deg); backface-visibility: hidden; -webkit-backface-visibility: hidden; } .social-icon-wp li a.facebook {background-color: #336699; background-position: 0 0;} .social-icon-wp li a.twitter {background-color: #00acec; background-position: -45px 0;} .social-icon-wp li a.LinkedIn {background-color: #0877b5; background-position: -90px 0;} .social-icon-wp li a.googlePlus {background-color: #c20806; background-position: -135px 0;} .social-icon-wp li a.kakaotalk {background-color: #fbe300; background-position: -180px 0;} .social-icon-wp li a.kakaoStory {background-color: #fccb00; background-position: -225px 0;} .social-icon-wp li a.kakaoPlus {background-color: #fedf2a; background-position: -270px 0;} .social-icon-wp li a.naverBlog {background-color: #00cf38; background-position: -315px 0;} .social-icon-wp li a.naverPost {background-color: #00c73c; background-position: -360px 0;} .social-icon-wp li a.youtube {background-color: #cc191e; background-position: -405px 0;} /***** 2019-09-17 수정 *****/ .social-icon-wp.small li a { width: 36px; height: 36px; background-image: url('/images/social_icon2.png'); background-repeat: no-repeat; background-size: auto 36px; } .social-icon-wp.small li a.facebook {background-color: #336699; background-position: 0 0;} .social-icon-wp.small li a.twitter {background-color: #00acec; background-position: -36px 0;} .social-icon-wp.small li a.LinkedIn {background-color: #0877b5; background-position: -72px 0;} .social-icon-wp.small li a.googlePlus {background-color: #c20806; background-position: -108px 0;} .social-icon-wp.small li a.kakaotalk {background-color: #fbe300; background-position: -144px 0;} .social-icon-wp.small li a.kakaoStory {background-color: #fccb00; background-position: -180px 0;} .social-icon-wp.small li a.kakaoPlus {background-color: #fedf2a; background-position: -216px 0;} .social-icon-wp.small li a.naverBlog {background-color: #00cf38; background-position: -252px 0;} .social-icon-wp.small li a.naverPost {background-color: #00c73c; background-position: -288px 0;} .social-icon-wp.small li a.youtube {background-color: #cc191e; background-position: -324px 0;} .social-icon-wp.small li a.naverStore {background-color: #00c73c; background-image: url('/images/comm_bottom_icon01.png'); background-position: 0 0;} /*------ 이용약관, 개인정보취급방침, 이메일무단수집거부, 저작권보호 modal ------*/ .comm-pop-law { position: relative; padding: 30px 30px 30px 30px; } .pop-div .modal-law-stit, .comm-pop-law .modal-law-stit { display: block; margin: -10px 0 20px 0; font-size: 200%; color: #444; letter-spacing: -1.5px; line-height: 1.4em; font-weight: bold; text-align: center; } .copyright-lawBox { height: 660px; margin: 0 0; padding: 15px 30px 20px 30px; font-size: 13px; color: #444; line-height: 1.6em; text-align: justify; /* white-space: pre-wrap; */ border: 1px solid #ddd; overflow-x: hidden; overflow-y: auto; } .copyright-lawBox.small {height: 520px; padding-top: 20px;} .copyright-lawBox strong {color: #333;} .copyright-lawBox .stit { display: block; margin: 15px 0 8px 0; font-size: 17px; color: #444; font-weight: bold; text-decoration: none; cursor: default; } .copyright-lawBox .sstit {padding: 10px 0 5px 0; font-size: 14px; color: #444; font-weight: bold;} .copyright-lawBox .bar {margin: 17px 0 10px 0; border-top: 1px dashed #eee;} .copyright-lawBox .txt_in {display: inline-block; padding: 8px 20px 10px 20px;} .copyright-lawBox td {font-size: 13px; color: #444; line-height: 1.6em;} /*----- 이메일무단수집거부 -----*/ .pop-div .copyright-lawBox .email-law-wp, .comm-pop-law .copyright-lawBox .email-law-wp { position: relative; font-size: 100%; color: #444; line-height: 1.6em; overflow: hidden; } .pop-div .copyright-lawBox .email-law-wp .title, .comm-pop-law .copyright-lawBox .email-law-wp .title { display: block; height: 121px; margin: 0 0 25px 0; padding: 15px 150px 0 0; font-size: 120%; line-height: 150%; font-weight: bold; background: url('/pds/images/sub/helpdesk/email_visual.png') no-repeat right 0px; } .pop-div .copyright-lawBox .email-law-wp .title .date, .comm-pop-law .copyright-lawBox .email-law-wp .title .date {display: block; font-size: 14px; font-weight: normal;} .pop-div .copyright-lawBox .email-law-wp .box, .comm-pop-law .copyright-lawBox .email-law-wp .box { display: block; margin: 0 0 30px 0; padding: 20px 20px 20px 20px; border-color: #ddd; background: #f9f9f9; } .pop-div .copyright-lawBox .email-law-wp .box .bar, .comm-pop-law .copyright-lawBox .email-law-wp .box .bar {margin: 12px 0 10px 0; border-color: #ddd;} /*----- 저작권보호 -----*/ .pop-div .copyright-lawBox .copyright-law-wp, .comm-pop-law .copyright-lawBox .copyright-law-wp { position: relative; font-size: 100%; color: #444; line-height: 1.6em; overflow: hidden; } .pop-div .copyright-lawBox .copyright-law-wp .txt-num, .comm-pop-law .copyright-lawBox .copyright-law-wp .txt-num {margin-bottom: 6px;} .pop-div .copyright-lawBox .copyright-law-wp .txt-num:last-child, .comm-pop-law .copyright-lawBox .copyright-law-wp .txt-num:last-child {margin-bottom: 0;} /*---- 하단배너용 -----------------------------------------*/ .comm-bottom-banner {position: fixed; left: 50%; bottom: 0; margin: 0 0 0 -650px; z-index: 1000; animation: bottomBanner 0.3s 7s linear forwards;} @keyframes bottomBanner { 0% {bottom: 0;} 100% {bottom: -120px;} } .comm-bottom-banner .chk { display: inline-block; position: absolute; top: 10px; right: 68px; width: 100px; height: 20px; cursor: pointer; } .comm-bottom-banner .chk input {margin: 0 0 0px 0;} /* 배너 hidden */ .bottom-banner-hide .comm-bottom-banner {display: none;} /* 이벤트 디데이 카운터 */ .comm-bottom-banner .countDay {position: absolute; top: 106px; left: 900px; z-index: 10000;} .comm-bottom-banner .countDay .box { display: inline-block; font-size: 13px; color: #fff; font-weight: bold; text-align: center; } .comm-bottom-banner .countDay .box span { display: block; position: relative; width: 40px; height: 40px; margin: 0 0 1px 0; padding: 0 1px 0 0; font-family: 'Helvetica'; font-size: 32px; color: #fff; letter-spacing: -2.5px; line-height: 42px; border-radius: 3px; background: #000; } .comm-bottom-banner .countDay .box span::after { content: ""; display: block; position: absolute; left: 0; right: 0; bottom: 0; height: 19px; border-top: 1px solid rgba(0,0,0, 0.4); background: rgba(0,0,0, 0.1); } /*---- 공통 SKY 배너용 -----------------------------------------*/ .comm-sky-banner { position: fixed; left: 0.5%; bottom: 0.5%; margin: 0 0 10px 10px; animation: SkyBanner_ani 0.8s infinite; z-index: 100; } @keyframes SkyBanner_ani { 50% {margin-bottom: 15px;} } .comm-sky-banner .close { position: absolute; top: 0px; right: 0px; width: 24px; height: 24px; font-size: 18px; color: #fff; line-height: 18px; text-align: center; border-radius: 100%; background: #333; cursor: pointer; } /*---- 위클리 유입시 콘텐츠 하단배너용 -----------------------------------------*/ .comm-contents-bottom-Banner { clear: both; position: relative; margin: 50px 0 10px 0; padding: 0 0 20px 0; text-align: center; z-index: 100; overflow: hidden; } .comm-contents-bottom-Banner a {display: block; padding: 0 0 25px 0;} .comm-contents-bottom-Banner a:last-child {margin-bottom: 0;} /* POST 하단 배너(아카데미 교육 링크 용) */ .sub-post-contents-Banner {clear: both; position: relative; margin: 0px 0 60px 0; padding: 0 0 20px 0; text-align: center; z-index: 100;} .comm-contents-bottom-Banner a {display: block; margin: 0 auto;} /*---- 상담위원용 알림 배너 -----------------------------------------*/ .comm-counselorAlert-wp { position: fixed; left: 10px; bottom: 10px; width: 200px; min-height: 160px; border: 1px solid #393184; border-radius: 12px; background: #fff; box-shadow: 10px 10px 10px 0 rgba(0,0,0, 0.25); z-index: 1000000000; animation: counselorAlert_ani 0.5s ease-out; } @keyframes counselorAlert_ani { 0% {bottom: -300px;} 80% {bottom: 20px;} 100% {bottom: 10px;} } .comm-counselorAlert-wp .stit { position: relative; height: 50px; padding: 2px 16px 0 0; font-size: 15px; font-weight: 300; line-height: 49px; text-align: center; border-bottom: 1px solid #e0e0e0; } .comm-counselorAlert-wp .stit::before {content: ""; position: absolute; top: -15px; left: 50%; width: 30px; height: 30px; margin: 0 0 0 -15px; border-radius: 100%; background: #e05555 url('/pds/images/sub/consult/comm_alert_icon.png') no-repeat center center; box-shadow: 2px 2px 2px 0 rgba(0,0,0, 0.15);} .comm-counselorAlert-wp .stit strong {display: inline-block; margin: 0 3px 0 0; font-weight: 600;} .comm-counselorAlert-wp .stit .close {position: absolute; top: 50%; right: 12px; width: 20px; height: 20px; margin: -9px 0 0 0; background: url('/images/close.png') no-repeat 0 0; background-size: 100% 100%;} .comm-counselorAlert-wp ul {padding: 14px 15px 15px 12px;} .comm-counselorAlert-wp li {margin: 0 0 8px 0; padding: 0 0 0 9px; font-size: 13px; line-height: 135%; background: url('/images/Guide_ic3.png') no-repeat 0 5px;} .comm-counselorAlert-wp li:last-child {margin-bottom: 0;} .comm-counselorAlert-wp li .subj {display: inline-block; margin: 0 0 2px 0; color: #28216d; font-weight: 500;} .comm-counselorAlert-wp li .subj.cont {margin: 0;} /******************************************************************************************************************************** * Form ********************************************************************************************************************************/ /*----- Defalut Set -----*/ /*----- 한글만 입력 -----*/ .int-kor {ime-mode: active;} /*----- 영문만 입력 -----*/ .int-eng {ime-mode: inactive;} /*----- 숫자만 입력 -----*/ .int-number {ime-mode: disabled; letter-spacing: 0;} button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit; } button {overflow: visible;} button, select {text-transform: none;} button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input {line-height: normal;} input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-appearance: textfield; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { padding: .35em .625em .75em; margin: 0 2px; border: 1px solid #c0c0c0; } legend {padding: 0; border: 0;} textarea {overflow: auto;} optgroup {font-weight: bold;} input, button, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; } label { display: inline-block; max-width: 100%; font-weight: normal; } input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } input[type="radio"], input[type="checkbox"] { margin: 4px 0 0; margin-top: 1px \9; line-height: normal; } input[type="file"] {display: block;} input[type="range"] { display: block; width: 100%; } select[multiple], select[size] {height: auto;} input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus { outline: none; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } output { display: block; padding-top: 7px; font-size: 14px; line-height: 1.42857143; color: #444; } .form-control { display: block; width: 100%; height: 34px; padding: 6px 10px; font-size: 15px; line-height: 1.42857143; color: #444; background-color: #fff; background-image: none; border: 1px solid #d5d5d5; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0, .075); box-shadow: inset 0 1px 1px rgba(0,0,0, .075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } .form-control.inline {display: inline-block; width: auto;} .form-control:focus { border-color: #777; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0,0,0, 0.1); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0,0,0, 0.1); background: #fafcff; } .form-control::-moz-placeholder { font-size: 15px; color: #afafaf; letter-spacing: -0.2px; font-weight: normal; opacity: 1; } .form-control:-ms-input-placeholder {font-size: 15px; color: #afafaf; letter-spacing: -0.2px; font-weight: normal;} .form-control::-webkit-input-placeholder {font-size: 15px; color: #afafaf; letter-spacing: -0.2px; font-weight: normal;} .form-control[disabled], .form-control[readonly] { background-color: #eee !important; opacity: 1; } fieldset[disabled] .form-control { background-color: #eee; opacity: 1; } .form-control[disabled], fieldset[disabled] .form-control {cursor: not-allowed;} textarea.form-control {height: auto;} input[type="search"] {-webkit-appearance: none;} /*------ customer set ------*/ .form-info { display: inline-block; margin: 0 0 0 20px; padding: 1px 0 0 0; font-size: 13px; color: #df7474; letter-spacing: -0.2px; line-height: 1.2em; vertical-align: middle; } .form-info.None {margin: 2px 0 0 0;} .form-info i {display: inline-block; margin: 0 5px 2px 0; font-size: 15px; vertical-align: middle;} .form-txt { display: inline-block; margin: 2px 20px 0 6px; font-size: 13px; font-weight: normal; vertical-align: middle; } .form-info2 { display: block; margin: 6px 0 0 0; font-size: 12px; color: #555; line-height: 150%; } label.form {cursor: pointer;} i.essential-ic { margin: 0 0 2px 5px; font-size: 10px; color: #e05555; font-weight: normal !important; vertical-align: middle; } i.essential-ic.big {margin: 0 0 2px 6px; font-size: 90%;} /* input */ .int-1 { display: inline-block; height: 42px; margin: 0 0 0px 0; padding-left: 10px; } .int-1.radius-None, .selt-1.radius-None {border-radius: 0 !important;} .int-1.bg {background: #fafafa;} .int-1.bg2 {background: #f3f3f3;} .int-1.bg-red {background: #fef2f2;} .int-1.bg-None {background: #fff;} .int-1.focus-None:focus {border-color: #d9d9d9; box-shadow: none; box-shadow: 0 1px 1px rgba(0,0,0,.075) inset;} .int-1.txt-rt {padding-right: 15px; text-align: right;} .int-1.txt-big {font-size: 110% !important;} .int-1.small {height: 38px;} .int-1.boder-color {border-color: #c9c9c9;} .int-1.boder-color:focus {border-color: #888;} .int-big { display: inline-block; height: 50px; margin: 0 0 0px 0; padding-left: 10px; font-size: 17px; } .int-big.bg-None {background: #fff !important} /* select box */ .selt-1 { display: inline-block; height: 42px; margin: 0 0 0px 0; padding: 3px 3px 3px 10px; font-size: 14px; } .selt-1.small {height: 38px !important;} .selt-1.bg-None {background: #fff;} .selt-1.native { -webkit-appearance: none; /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; padding-right: 30px !important; background: #fff url('../images/select_bg.png') no-repeat center right !important; background-size: auto 10px !important; transition: all 0.3s; } .selt-1.native::-ms-expand {display: none;} .selt-1.native:hover { background: #fff url('../images/select_bg_hover.png') no-repeat center right !important; background-size: auto 10px !important; } .selt-1.bg {background: #fafafa;} .radio { display: inline-block; width: 16px; height: 16px; } .calendar-btn { display: inline-block; height: 28px; margin: 0 0 0 4px; cursor: pointer; } .int-textarea {padding-top: 10px; padding-bottom: 10px;} .int-bg {background: #f9f9f9 !important;} /* checkbox */ .checkbox-field.block label {display: block;} .checkbox-field.inline {display: inline-block;} .checkbox-field .chkbox {display: none;} .checkbox-field .square { display: inline-block; width: 20px; height: 20px; margin: 0 8px 0 0; font-size: 100%; line-height: 12px; text-align: center; vertical-align: middle; border: 1px solid #7d9fca; background: #f0f7fc; } .checkbox-field .square i {opacity: 0;} .checkbox-field label {cursor: pointer;} .checkbox-field .chkbox:checked + label i {opacity: 1 !important;} .checkbox-field.ch label.checking i {opacity: 1 !important;} .checkbox-field.ch label i {opacity: 0;} .checkbox-field.mrg-rt30 {margin-right: 30px;} /* radio */ .radio-field.inline {display: inline-block;} .radio-field input[type=radio]{display: none;} .radio-field label { padding: 0 20px 0 0; font-size: 100%; vertical-align: middle; cursor: pointer; } .radio-field label::before { content: ""; display: inline-block; position: relative; width: 22px; height: 22px; margin: 0 8px 0 0; line-height: 32px; vertical-align: middle; border: 1px solid #a9c5dc; border-radius: 100%; background: #f0f7fc; cursor: pointer; z-index: 5; } .radio-field input[type=radio]:checked + label::before { width: 22px; height: 22px; border: 5px solid #d2e0ec; background: #0795ee; } .radio-field.inline label {padding-right: 30px;} .radio-field input[disabled]:checked + label::before { width: 22px; height: 22px; border: 5px solid #ddd; background: #999; } .radio-field input[disabled] + label::before {background: #ddd;} /*----- radio -----*/ .radio-field-new { display: inline-block; position: relative; min-height: 22px; margin: 4px 25px 0px 0; padding: 0 0 4px 30px; font-size: 100%; font-weight: 300 !important; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .radio-field-new.None {margin: 4px 0 0 0; padding: 0 0 0 22px;} .radio-field-new.None2 {margin-right: 0;} .radio-field-new.mR {margin-right: 15px;} .radio-field-new.w250 {width: 250px; margin-bottom: 5px;} .radio-field-new.hrd-w {width: 280px; margin-right: 0px; margin-bottom: 5px;} .radio-field-new.block {display: block;} .radio-field-new input {position: absolute; width: 0; height: 0; opacity: 0; cursor: pointer;} .radio-field-new .checkmark { position: absolute; top: 50%; left: 0; width: 22px; height: 22px; margin: -13px 0 0 0; border: 1px solid #e0e0e0; border-radius: 100%; background-color: #eee; } .radio-field-new:hover input ~ .checkmark {border-color: #cfcfcf; background-color: #ddd;} .radio-field-new input:checked ~ .checkmark {border-color: #1c8ae2; background-color: #2196F3;} .radio-field-new .checkmark:after {content: ""; position: absolute; display: none;} .radio-field-new input:checked ~ .checkmark:after {display: block;} .radio-field-new .checkmark:after { top: 50%; left: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 100%; background: #fff; } /*----- checkbox -----*/ .radio-field-new.checkbox .checkmark {border-radius: 0;} .radio-field-new.checkbox .checkmark:after { top: 3px; left: 7px; width: 7px; height: 12px; margin: 0; border: solid #fff; border-width: 0 3px 3px 0; border-radius: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); background: none; } /* 2021-06-24 이제노 추가 */ /* float */ .f_l{float:left !important;}.f_r{float:right !important;} /* padding */ .p0{padding:0 !important;}.p5{padding:5px !important;}.p10{padding:10px !important;}.p15{padding:15px !important;} .pt0{padding-top:0 !important;}.pt5{padding-top:5px !important;}.pt10{padding-top:10px !important;}.pt15{padding-top:15px !important;}.pt20{padding-top:20px !important;}.pt25{padding-top:25px !important;}.pt30{padding-top:30px !important;}.pt35{padding-top:35px !important;}.pt40{padding-top:40px !important;}.pt45{padding-top:45px !important;}.pt50{padding-top:50px !important;}.pt55{padding-top:55px !important;}.pt60{padding-top:60px !important;}.pt65{padding-top:65px !important;}.pt70{padding-top:70px !important;}.pt75{padding-top:75px !important;}.pt80{padding-top:80px !important;}.pt85{padding-top:85px !important;}.pt90{padding-top:90px !important;}.pt95{padding-top:95px !important;}.pt100{padding-top:100px !important;} .pl0{padding-left:0 !important;}.pl5{padding-left:5px !important;}.pl10{padding-left:10px !important;}.pl15{padding-left:15px !important;}.pl20{padding-left:20px !important;}.pl25{padding-left:25px !important;}.pl30{padding-left:30px !important;}.pl35{padding-left:35px !important;}.pl40{padding-left:40px !important;}.pl45{padding-left:45px !important;}.pl50{padding-left:50px !important;}.pl55{padding-left:55px !important;}.pl60{padding-left:60px !important;}.pl65{padding-left:65px !important;}.pl70{padding-left:70px !important;}.pl75{padding-left:75px !important;}.pl80{padding-left:80px !important;}.pl85{padding-left:85px !important;}.pl90{padding-left:90px !important;}.pl95{padding-left:95px !important;}.pl100{padding-left:100px !important;} .pr0{padding-right:0 !important;}.pr5{padding-right:5px !important;}.pr10{padding-right:10px !important;}.pr15{padding-right:15px !important;}.pr20{padding-right:20px !important;}.pr25{padding-right:25px !important;}.pr30{padding-right:30px !important;}.pr35{padding-right:35px !important;}.pr40{padding-right:40px !important;}.pr45{padding-right:45px !important;}.pr50{padding-right:50px !important;}.pr55{padding-right:55px !important;}.pr60{padding-right:60px !important;}.pr65{padding-right:65px !important;}.pr70{padding-right:70px !important;}.pr75{padding-right:75px !important;}.pr80{padding-right:80px !important;}.pr85{padding-right:85px !important;}.pr90{padding-right:90px !important;}.pr95{padding-right:95px !important;}.pr100{padding-right:100px !important;} .pb0{padding-bottom:0 !important;}.pb5{padding-bottom:5px !important;}.pb10{padding-bottom:10px !important;}.pb15{padding-bottom:15px !important;}.pb20{padding-bottom:20px !important;}.pb25{padding-bottom:25px !important;}.pb30{padding-bottom:30px !important;}.pb35{padding-bottom:35px !important;}.pb40{padding-bottom:40px !important;}.pb45{padding-bottom:45px !important;}.pb50{padding-bottom:50px !important;}.pb55{padding-bottom:55px !important;}.pb60{padding-bottom:60px !important;}.pb65{padding-bottom:65px !important;}.pb70{padding-bottom:70px !important;}.pb75{padding-bottom:75px !important;}.pb80{padding-bottom:80px !important;}.pb85{padding-bottom:85px !important;}.pb90{padding-bottom:90px !important;}.pb95{padding-bottom:95px !important;}.pb100{padding-bottom:100px !important;} .plr0{padding-left:0 !important;padding-right:0 !important;}.plr5{padding-left:5px !important;padding-right:5px !important;}.plr10{padding-left:10px !important;padding-right:10px !important;}.plr15{padding-left:15px !important;padding-right:15px !important;} /* margin */ .m0{margin:0 !important;}.m5{margin:5px !important;}.m10{margin:10px !important;} .mt0{margin-top:0 !important;}.mt5{margin-top:5px !important;}.mt10{margin-top:10px !important;}.mt15{margin-top:15px !important;}.mt20{margin-top:20px !important;}.mt25{margin-top:25px !important;}.mt30{margin-top:30px !important;}.mt35{margin-top:35px !important;}.mt40{margin-top:40px !important;}.mt45{margin-top:45px !important;}.mt50{margin-top:50px !important;}.mt55{margin-top:55px !important;}.mt60{margin-top:60px !important;}.mt65{margin-top:65px !important;}.mt70{margin-top:70px !important;}.mt75{margin-top:75px !important;}.mt80{margin-top:80px !important;}.mt85{margin-top:85px !important;}.mt90{margin-top:90px !important;}.mt95{margin-top:95px !important;}.mt100{margin-top:100px !important;} .ml0{margin-left:0 !important;}.ml5{margin-left:5px !important;}.ml10{margin-left:10px !important;}.ml15{margin-left:15px !important;}.ml20{margin-left:20px !important;}.ml25{margin-left:25px !important;}.ml30{margin-left:30px !important;}.ml35{margin-left:35px !important;}.ml40{margin-left:40px !important;}.ml45{margin-left:45px !important;}.ml50{margin-left:50px !important;}.ml55{margin-left:55px !important;}.ml60{margin-left:60px !important;}.ml65{margin-left:65px !important;}.ml70{margin-left:70px !important;}.ml75{margin-left:75px !important;}.ml80{margin-left:80px !important;}.ml85{margin-left:85px !important;}.ml90{margin-left:90px !important;}.ml95{margin-left:95px !important;}.ml100{margin-left:100px !important;} .mr0{margin-right:0 !important;}.mr5{margin-right:5px !important;}.mr10{margin-right:10px !important;}.mr15{margin-right:15px !important;}.mr20{margin-right:20px !important;}.mr25{margin-right:25px !important;}.mr30{margin-right:30px !important;}.mr35{margin-right:35px !important;}.mr40{margin-right:40px !important;}.mr45{margin-right:45px !important;}.mr50{margin-right:50px !important;}.mr55{margin-right:55px !important;}.mr60{margin-right:60px !important;}.mr65{margin-right:65px !important;}.mr70{margin-right:70px !important;}.mr75{margin-right:75px !important;}.mr80{margin-right:80px !important;}.mr85{margin-right:85px !important;}.mr90{margin-right:90px !important;}.mr95{margin-right:95px !important;}.mr100{margin-right:100px !important;} .mb0{margin-bottom:0 !important;}.mb5{margin-bottom:5px !important;}.mb10{margin-bottom:10px !important;}.mb15{margin-bottom:15px !important;}.mb20{margin-bottom:20px !important;}.mb25{margin-bottom:25px !important;}.mb30{margin-bottom:30px !important;}.mb35{margin-bottom:35px !important;}.mb40{margin-bottom:40px !important;}.mb45{margin-bottom:45px !important;}.mb50{margin-bottom:50px !important;}.mb55{margin-bottom:55px !important;}.mb60{margin-bottom:60px !important;}.mb65{margin-bottom:65px !important;}.mb70{margin-bottom:70px !important;}.mb75{margin-bottom:75px !important;}.mb80{margin-bottom:80px !important;}.mb85{margin-bottom:85px !important;}.mb90{margin-bottom:90px !important;}.mb95{margin-bottom:95px !important;}.mb100{margin-bottom:100px !important;} /* width */ .w100p{width:100% !important;}.w75p{width:75% !important;}.w66p{width:66.6% !important;}.w50p{width:50% !important;}.w33p{width:33.3% !important;}.w25p{width:25% !important;} .b0{border:0 !important;}.bt0{border-top:0 !important;}.bl0{border-left:0 !important;}.br0{border-right:0 !important;}.bb0{border-bottom:0 !important;} .posR{position:relative !important;} .hidden_box{position:absolute;width:0;height:0;overflow:hidden;font-size:0;line-height:0;visibility:hidden;border:none;} .zeno_loader_outer{height:auto;text-align:center;} .zeno_loader_cont{display:inline-block;min-height:75px;line-height:25px;padding:15px;background-color:#fff;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;} .zeno_loader_cont p{color:#12121f;font-size:13px;text-align:center;font-weight:400;letter-spacing:-0.025em;padding-top:10px;margin:0;} .zeno_loader_cont p.spin{font-size:1.5rem;padding-top:0;}