/* 폰트 크기 */ .f13{font-size: 13px;} .f14{font-size: 14px;} .f16{font-size: 16px; font-size: 1rem;} .f18{font-size: 18px !important;font-size: 1.125rem !important;} /* 폰트 컬러 */ .color-green{color: #139db7} .color-red{color: #ac2f30} .color-navy{color: #233d5d} /* bg-컬러 */ .bg-blue{background: #005090; color: #fff} .bg-green{background: #139db7;color: #fff} #header{position: absolute;left: 0;top:0;width: 100%;height: 91px; background: rgba(255,255,255,.17);color: #fff;border-bottom: 1px solid rgba(255,255,255,.18); z-index: 150} #header > .inner{padding-left: 145px;} #lnb{text-align: center;font-size: 0;padding-top: 35px;letter-spacing: 0;} #lnb > li{display: inline-block;font-size: 16px;float: left; width: 14.2857142857%} #lnb > li:first-child{margin-left: 0;} #lnb > li > a{font-weight: 700;} #lnb a{display: block;} #header.on{background: #fff; color: #000} .allmenu{position: absolute;left: 0;top:91px;width: 100%;z-index: 130;background: url('../img/common/allmenu_bg.png') left top repeat;overflow: hidden; display: none; color: #fff} .allmenu:before{position: absolute;left: 91px;bottom: 0;content: ''; width: 262px; height: 207px; background: url('../img/common/allmenu_logo.png') center center no-repeat;} .allmenu .inner{padding-left: 145px;} .allmenu .nav{text-align: center; font-size: 14px; line-height: 1.15; font-weight: 300;display: -webkit-flex; display: -ms-flex; display: flex;} .allmenu .nav > li{float: left; width: 14.2857142857%; padding: 30px 5px} .allmenu .nav > li > a{font-weight: 700;} .allmenu .nav .depth{font-size: 12px; margin-top: 20px;} .allmenu .nav .depth > li{margin-top: 10px;} .allmenu .nav .depth > li:first-child{margin-top: 0;} .allmenu .nav .depth > a:hover{text-decoration: underline;} .allmenu .nav a{display: block;} .allmenu .nav > li:hover{background: #982728} #footer .top{border: 1px solid #ddd;border-left: 0;border-right: 0; line-height: 60px;} #footer .top .l{float: left;} #footer .top .l > li{float: left;position: relative; padding-left: 20px;margin-left: 20px;} #footer .top .l > li:before{position: absolute;left: 0;top:50%;width: 1px;height: 2em;margin-top: -1em;content: '';background: #ddd} #footer .top .l > li:first-child{padding-left: 0;margin-left: 0;} #footer .top .l > li:first-child:before{background: none} #footer .top .r{float: right;;} #footer .top .r > li{float: left;margin-left: 20px;} #footer .top .r > li:first-child{margin-left: 0;} #footer .add{padding: 30px 0; font-size: 13px; color: #666; letter-spacing:0.3px} #footer .copy{color: #999;margin-top: 5px;} #sub_visual{background: url('../img/common/bg1.jpg') center center no-repeat; background-size: cover;height: 435px; color: #fff;text-align: center;font-size: 1.25em; padding: 215px 15px 130px;line-height: 1.15; text-shadow: 4px 3px 3px rgba(0,0,0,.35)} .sub_t{font-size: 2.200em;margin-bottom: .5em;} #path{z-index: 30} #path, #path .in > li{height: 65px} #path .inner{position: relative; height: 100%} #path .home, #path .depth > a{line-height: 65px;} #path .home a{overflow: hidden;} #path{background-color: #233d5d; font-size: 14px;color: #fff} #path a{display: block} #path .in >li{float: left; height: 100%;border-right: 1px solid rgba(255,255,255,.1);} #path .home{background: url('../img/common/ico-home.png') center center no-repeat;width: 63px;border-left: 1px solid rgba(255,255,255,.1);;white-space: nowrap;overflow: hidden;text-indent: -999px} #path .depth{min-width: 230px;position: relative;} #path .depth > a{padding: 0 60px 0 20px; position: relative;} #path .depth > a:after{width: 17px;height: 17px;background: url('../img/common/ico-arrowdown.png') center center no-repeat; position: absolute; right: 20px;content: '';top: 50%;margin-top: -8px;} #path .sub{position: absolute; background-color: #fff; border:1px solid #ddd;left: -1px;top:65px;width: 101%;display:none;z-index: 149;color: #333} #path .sub li{border-top: 1px solid #ddd;height: 50px;display: table;width:100%} #path .sub li:first-child{border-top:0} #path .sub li:hover{background: #f1f1f1} #path .sub a{;padding: 0 15px;display: table-cell;vertical-align: middle} #path .depth_2 > a{color: #fff;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} #btn-share{position: absolute; right: 0;top:0; padding: 0 20px;height: 100%; border:1px solid rgba(255,255,255,.1);; border-top: 0; border-bottom: 0; color: #fff} #btn-share span{background: url('../img/common/btn-share.png') left center no-repeat; padding-left: 26px;} #sub_page{padding-top: 80px; padding-bottom: 100px;} .fixed #path{position: fixed;left: 0;top:0;width: 100%} .fixed #cont{padding-top: 80px;} #btn-menu{width: 1.875em; height: 2.375em; position: absolute;right: .938rem;top:50%;margin-top: -1.1825em; background: url('../img/common/btn-menu.png') right center no-repeat; background-size: 100%;white-space: nowrap;overflow: hidden;text-indent: -999px;display: none;} #btn-menu.on{background-image: url('../img/common/btn-close.png')} /* 올메뉴 */ .menu_m {position:absolute; width: 100%;z-index: 999;background-color:#fff; top:5em;z-index: 300;left: 0; display: none;} .menu_m .close_btn{position: absolute;left: -2.5em;top:1em} .menu_m .close_btn img{width: 1.5em; display: block;} .top_nav_m{line-height: 1; padding: 0 10px; font-size: 15px} .top_nav_m a{display: block} .top_nav_m > li > a{padding: 1em 10px;font-size: 18px;color: #000;position: relative;font-weight: 700} .top_nav_m > li.on > a{color: #fff} .top_nav_m > li{border-bottom:1px solid #ddd;cursor: pointer} .top_nav_m > li:last-child{border-bottom: 0;} .top_nav_m .depth{color: #555;display: none; padding: 18px 10px; border-top: 2px solid #ac2f30;} .top_nav_m .depth li{margin-top: 5px;} .top_nav_m .depth li:first-child{margin-top: 0;} .top_nav_m .depth li a{position: relative; padding: 5px 10px;font-weight: 400} .allmenu_bg {display: none;position: absolute; height:100%; top: 5em;width:100%; background:rgba(0,0,0,.7);z-index: 150;left: 0} /* 2023-08-23 추가 */ #header > .inner {height:100%} #lnb {display:flex; justify-content:space-between; padding-right:98px} .allmenu .nav {display:flex; justify-content:space-between; padding-right:98px} #header .util {position:absolute; top:50%; right:0; transform:translateY(-50%); font-size:0} #header .util > button {width:44px; height:44px; margin-left:10px; border-radius:50%; text-align:center} #header .util > button.btn-search-layer {background:#4B4B4B; background:url('../img/sub/icon_listsch.png') #4B4B4B no-repeat 50%; font-size:0} #header .util > button.btn-search-layer.on {background-color:#939393; background-image:url('../img/close_btn.gif')} #header .util > button.btn-hotissue {background:#AC2F30; color:#fff; font-size:9px;} #header .util > button.btn-hotissue.on {background:url('../img/close_btn.gif') #CD8283 no-repeat 50%; font-size:0} .search-layer {display:none; justify-content:center; align-items:center; position:absolute; top:91px; left:0; width:100%; height:300px; z-index:10; background:#EFEFEF} /* 2023.08.29 컬러값 수정 */ .search-layer.on {display:flex} .search-layer .search-layer__title {text-align:center; color:#AC2F30; font-size:32px; font-weight:400} .search-layer .search-layer__title strong {font-weight:700} .search-layer .search-layer__txt {margin:16px 0 0 0; font-size:18px} .search-layer .search-layer__txt strong {font-weight:700} .search-layer .search-layer__input {margin-top:24px; font-size:0} .search-layer .search-layer__input input[type="text"]{width:calc(100% - 56px); height:56px; padding:18px 24px; background:#fff; border:2px solid #AC2F30; font-size:16px} .search-layer .search-layer__input input[type="text"]:focus {border-width:2px !important} .search-layer .search-layer__input input[type="text"] + button {width:56px; height:56px; background:url('../img/sub/icon_listsch.png') #AC2F30 no-repeat 50%} .hotissue-layer {display:none; overflow-y:auto; position:absolute; top:91px; left:0; z-index:100; width:100%; height:calc(100vh - 91px); padding:80px 0 40px; background:url('../img/common/bg_hotissue.jpg') no-repeat 50%; background-size:cover; text-align:center} .hotissue-layer .hotissue-layer__title {text-align:center; color:#fff; font-size:24px; font-weight:300} .hotissue-layer .hotissue-layer__title strong {display:block; font-size: 54px; font-weight: 700} .hotissue-layer .hotissue-slide {margin-top:20px; width:960px; margin:0 auto} .hotissue-layer .hotissue-indicator {display:block; text-align:center; margin:0 0 20px} .hotissue-layer .hotissue-indicator .custom-paging {display:inline-block; position:relative;} .hotissue-layer .hotissue-indicator .slick-arrow {position:absolute; top:50%; width:10px; height:10px; margin-top:-7px; border-left: 1px solid #fff; border-top:1px solid #fff} .hotissue-layer .hotissue-indicator .slick-arrow.slide-prev {left:0; transform:rotate(-45deg)} .hotissue-layer .hotissue-indicator .slick-arrow.slide-next {right:0; transform:rotate(-220deg)} .hotissue-layer .hotissue-indicator .slide-dots {padding:0 30px} .hotissue-layer .hotissue-indicator .slide-dots > li {display:none; font-size:18px; color:rgba(255,255,255,0.5); font-weight:700} .hotissue-layer .hotissue-indicator .slide-dots > li > strong {color:#fff} .hotissue-layer .hotissue-indicator .slide-dots > li.slick-active {display:block} .hotissue-layer .hotissue-list .hotissue-list__group {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap} .hotissue-layer .hotissue-list__item {float:left; width:24%; height:200px; margin:12px 0 0 0;border-radius:6px; background:url('../img/common/bg_hotissue_item_off.svg') rgba(115, 115, 115, 0.5) no-repeat right bottom; text-align:left} .hotissue-layer .hotissue-list__item a {display:block; width:100%; height:100%; padding:24px} .hotissue-layer .hotissue-list__item .item__badge {display:inline-block; padding:5px 14px; background:#fff; border-radius:14px; font-size:14px; letter-spacing:-0.14px; font-weight:700} .hotissue-layer .hotissue-list__item .item__title {display:block; margin-top:10px; line-height:1.4; color:#fff; font-size:20px; font-weight:400} .hotissue-layer .hotissue-list__item .item__subtitle {display:block; margin-top:2px; line-height:1.4; color:#fff; font-size:16px; font-weight:400; opacity:0.6} .hotissue-layer .hotissue-list__item:hover {background-color:#fff !important; background-image:url('../img/common/bg_hotissue_item_on.svg')} .hotissue-layer .hotissue-list__item:hover .item__badge {color:#fff !important} .hotissue-layer .hotissue-list__item.green {background-color:#8EC349} .hotissue-layer .hotissue-list__item.green .item__badge {color:#8EC349} .hotissue-layer .hotissue-list__item.green:hover .item__badge {background:#8EC349} .hotissue-layer .hotissue-list__item.green:hover .item__title {color:#8EC349} .hotissue-layer .hotissue-list__item.green:hover .item__subtitle {color:#8EC349} .hotissue-layer .hotissue-list__item.orange {background-color:#FCAB31} .hotissue-layer .hotissue-list__item.orange .item__badge {color:#FCAB31} .hotissue-layer .hotissue-list__item.orange:hover .item__badge {background:#FCAB31} .hotissue-layer .hotissue-list__item.orange:hover .item__title {color:#FCAB31} .hotissue-layer .hotissue-list__item.orange:hover .item__subtitle {color:#FCAB31} .hotissue-layer .hotissue-list__item.sky {background-color:#00B7C9} .hotissue-layer .hotissue-list__item.sky .item__badge {color:#00B7C9} .hotissue-layer .hotissue-list__item.sky:hover .item__badge {background:#00B7C9} .hotissue-layer .hotissue-list__item.sky:hover .item__title {color:#00B7C9} .hotissue-layer .hotissue-list__item.sky:hover .item__subtitle {color:#00B7C9} .hotissue-layer .hotissue-list__item.brown {background-color:#AE9B85} .hotissue-layer .hotissue-list__item.brown .item__badge {color:#AE9B85} .hotissue-layer .hotissue-list__item.brown:hover .item__badge {background:#AE9B85} .hotissue-layer .hotissue-list__item.brown:hover .item__title {color:#AE9B85} .hotissue-layer .hotissue-list__item.brown:hover .item__subtitle {color:#AE9B85} .hotissue-layer .hotissue-list__item.blue {background-color:#3794EA} .hotissue-layer .hotissue-list__item.blue .item__badge {color:#3794EA} .hotissue-layer .hotissue-list__item.blue:hover .item__badge {background:#3794EA} .hotissue-layer .hotissue-list__item.blue:hover .item__title {color:#3794EA} .hotissue-layer .hotissue-list__item.blue:hover .item__subtitle {color:#3794EA} .hotissue-layer .btn-go {display:inline-block; height:56px; margin:30px auto 0; padding:17px 24px 15px 30px; border-radius:100px; background:#fff; color:#333; font-size:16px; font-weight:700} .hotissue-layer .btn-go::after {content:""; display:inline-block; width:10px; height:10px; margin-left:14px; border-left: 2px solid #333; border-top:2px solid #333; transform:rotate(-220deg)}