@charset "utf-8"; /* pc */ /************************************************** 공통 **************************************************/ html {font-size:10px; overflow-x:hidden;} input [type="text"], input.text {height:2.6rem; padding:0 0 0 0.5rem;} input [type="check"], input [type="radio"] {margin:0 03rem 0.1rem 0; padding:0; width:1.3rem; height:1.3rem; vertical-align:middle;} select {height:2.6rem;} textarea {width:100%; padding:1rem; color:#333;} /* 추가 */ textarea:focus {outline:none;} /* 추가 */ .block {display:block;} a.blank:after {content:""; display:inline-block; width:12px; height:12px; margin:-2px 0 0 3px; vertical-align:middle; background:url("../../images/sub/win.gif") no-repeat center center;} /* 파일첨부 */ .filebox input[type="file"] {position:absolute; top:0; overflow:hidden; clip:rect(0,0,0,0);} .filebox label {display:inline-block; padding:0 0.6rem; width:8rem; text-align:center; color: #fff; font-size:1.5rem; vertical-align: middle; background: #777; cursor: pointer; height:3.4rem;line-height:3.4rem;border-radius: 5px;} .filebox .upload {display: inline-block; padding:0.6rem 1rem; font-size:1.4rem; font-family: inherit; line-height: normal; vertical-align: middle; background:#fefefe !important; border: 1px solid #ebebeb; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing:border-box; height:3.4rem;} /* skip navigation */ #skipnavi a{display:block; position:absolute; top:-40px; left:0; z-index:1005; width:100%; height:40px; line-height:40px; text-align:center; font-weight:bold; transition:0.3s; -webkit-transition:0.3s; -moz-transition:0.3s; -o-transition:0.3s;} #skipnavi a:hover{top:0px; z-index:1005; background:#4669b2; color:#fff;} #skipnavi a:active{top:0px; z-index:1005; background:#4669b2; color:#fff;} #skipnavi a:focus{top:0px; z-index:1005; background:#4669b2; color:#fff;} /* layout */ #wrapper {display:block; position:relative; height:100%; min-width:120rem; margin:0 auto;} /* global link */ #wrapper .global {position:absolute; left:0; top:0; width:100%; z-index:1002; border-bottom:1px solid #dcdcdc;} #wrapper .global .site_link {position:relative; left:50%; margin-left:-60rem; width:120rem; z-index:201;} #wrapper .global .site_link:after {content:""; display:block; clear:both;} #wrapper .global .site_link ul {float:right;} #wrapper .global .site_link ul:after {content:""; display:block; clear:both;} #wrapper .global .site_link .join li {float:left; position:relative; padding:0px 0px 0px 20px;} #wrapper .global .site_link .join li a {display:block; text-decoration:none; color:#333; box-sizing:border-box; font-size:15px; font-weight:400; height:40px; line-height:40px;} #wrapper .global .site_link .join li a[target="_blank"]:after {content:""; display:inline-block; width:12px; height:12px; margin:-2px 0 0 3px; vertical-align:middle; background:url("../../images/sub/win.gif") no-repeat center center;} #wrapper .global .site_link .join li a:hover, #wrapper .global .site_link .join li a:active {color:#017bbf;} /* header */ #header {position:relative; width:100%; z-index:1000;background-color:#ffffff;border-bottom:1px solid #E0E0E0;transition: top 0.3s ease-in-out;} #header .header_box {position:relative; width:calc(100% - 20rem); margin:0 auto;display:flex;align-items: center;height: 10rem;justify-content: space-between;} #header .header_box:after{content:""; height:0; font-size:0; visibility:hidden; display:block; clear:both;} #header .logo {display:inline-block; width:15.5rem; height:5.6rem; text-indent:-9999em; z-index:12;flex-shrink: 0;} #header .logo a {display:block; width:100%; height:100%; background:url("../../images/common/logo.svg") no-repeat center/cover;} /* gnb */ #gnb_area{margin-right:5rem;} #gnb_area .depth2{display:flex;} #gnb_area a{cursor: pointer;} #gnb_area .depth2 > li{position:relative;min-width:20rem;} #gnb_area .depth2 > li > a{font-size:2rem;font-weight:600;display:block;text-align: center;line-height:10rem;} #gnb_area .depth2 > li.on > a{color:#00A1C5;} #gnb_area .depth2 > li:last-child{min-width:23rem;} #gnb_area .depth2 > li:first-child .depthBox:before{content:'';position: absolute;bottom:-1px;background-color:#EAF3FF;right:100%;width:100vw;height:calc(100% + 1px);background-image: url('../../images/common/simbol.png'); background-repeat: no-repeat;background-position-x: right;background-position-y: bottom;background-size: auto 100%;border-bottom:1px solid #e0e0e0;} #gnb_area .depth2 > li:last-child .depthBox:before{background:#fff;position:absolute;left:calc(100% + 1px);width:100vw;height:calc(100% + 1px);content:'';bottom:-1px;border-bottom:1px solid #e0e0e0;} #gnb_area .depthBox{position:absolute;top:100%;left:auto;padding:2.5rem 3rem 0;background:#fff;width:100%;border-right:1px solid #E0E0E0;opacity:0;visibility: hidden;border-bottom:1px solid #e0e0e0;border-top:1px solid #e0e0e0;} #gnb_area .depthBox a{font-size:1.8rem;font-weight:400;display:block;padding:1.5rem 0;} #gnb_area .depthBox a:hover span, #gnb_area .depthBox a:focus span, #gnb_area .depthBox a:active span{text-decoration: underline;} #gnb_area .depth2 > li:first-child .depthBox{border-left:1px solid #e0e0e0;} #gnb_area .depth2 > li.on .depthBox{background:#003DA5;color:#fff;} #header.active #gnb_area .depthBox{opacity:1;visibility:visible;} /* 사이트맵, 모바일메뉴 */ .btn_menu {position:absolute; right:0; top:50%; z-index:11;-webkit-transform: translateY(-50%);transform: translateY(-50%);display: block;} /* 수정 */ .btn_menu a {display:block; position:relative; width:5rem; height:1.7rem;} .btn_menu a:after {content:""; display:block; position:absolute; left:0; width:100%; border-bottom:0.2rem solid #222;bottom:0;} .btn_menu .bar {display:block; position:absolute; left:0; top:0; width:100%; height:0.2rem; background:#222; text-indent:-9999em;} /* all menu, mobile menu */ .menu_area {display:none; width:100%; position:fixed; left:100%; top:10rem; bottom:0; width:100%; z-index:1500; background:#fff; letter-spacing:-0.04em;} .menu a{cursor: pointer;} .menu_box, #menu{height:100%;} .menu{height:100%;padding: 8% 3rem 0;gap:4rem;border-top:1px solid #e0e0e0;text-align: center;} .menu > li{min-width:20rem;display:inline-block;vertical-align: top;text-align: left;} .menu > li + li{margin-left:4rem;} .menu > li > a{display:block;font-size:2.2rem;font-weight:700;position:relative;padding-bottom:3.1rem;} .menu > li > a:before{content: '';width:7px;height:7px;position:absolute;left:0;bottom:0;background:#00A1C5;} .menu > li > a:after{content: '';width:calc(100% - 15px);height:1px;background:#E0E0E0;position:absolute;right:0;bottom:3.5px; } .menu > li > a span{display:block;} .menu > li .depth2{padding-top:2.8rem;} .menu > li .depth2 > li > a{color:#424242;font-size:1.8rem;font-weight:400;padding:0.6rem 0;display:block;} .menu > li .depth2 > li.on > a{color:#003DA5;} .menu .depth3{padding:3px 0 5px;} .menu .depth3 > li{position: relative;padding-left:1rem;margin-bottom:4px;} .menu .depth3 > li + li{margin-top:4px;} .menu .depth3 > li:before{content:'';width:4px;height:1px;background:#BDBDBD;position:absolute;left:0;top:1rem;} .menu .depth3 > li > a{display:block;font-size:1.6rem;color:#424242;} .menu .depth3 > li > a:hover span, .menu .depth3 > li > a:focus span, .menu .depth3 > li > a:active span{text-decoration: underline;color:#003DA5;} .menu_close {position:absolute; right:11rem; top:-7rem; width:4rem; height:4rem; text-align:center; font-size:0;} .menu_close span {display:inline-block; position:relative;color:#333;width:100%;height:100%;} .menu_close span::before, .menu_close span::after {content:""; display:block; position:absolute; left:0; width:100%; border-bottom:0.2rem solid #222;} .menu_close span::before {top:50%; transform:rotate(-45deg);} .menu_close span::after {top:50%; transform:rotate(45deg);} /* footer */ #footer{background:#1C1F2C;padding:4rem 0 5rem;} #footer .foot_link a{color:#fff;display:block;} #footer .foot_link{display:flex;align-items: center;} #footer .foot_link li{position: relative;} #footer .foot_link li a:after{content:'';width:3px;height:3px;background:#9E9E9E;margin:0 1.6rem;display:inline-block;vertical-align: middle;} #footer .foot_link li:last-child a:after{display: none;} #footer .area1{padding:1.5rem 0;border-bottom:1px solid #525252;display:flex;justify-content: space-between;} #footer .sns_link{display: flex;gap:1.6rem;} #footer .sns_link a{text-indent: -1000px;font-size:0;width:2.4rem;height:2.4rem;font-size:0;background-repeat: no-repeat;background-position: center;background-size: cover;display:block;} #footer .sns_link .blog a{background-image:url('../../images/common/naver-blog.png');} #footer .sns_link .instagram a{background-image:url('../../images/common/instagram.png');} #footer .sns_link .youtube a{background-image:url('../../images/common/youtube.png');} #footer .area2{display:flex;justify-content: space-between;padding-top:3.7rem;} #footer .address{display:flex;gap:3rem;} #footer address{color:#E0E0E0;opacity:0.6;font-weight: 400;letter-spacing: -0.48px;line-height:1.6;} #footer .related .group {height: 5.5rem;border-bottom: 1px solid #fff;position: relative;min-width: 17rem;color: #8e8e8e;} #footer .related .group.active .label::after {-webkit-transform: rotate(180deg);transform: rotate(180deg);} #footer .related .group.active .list {visibility: visible;overflow: visible;width: auto;height: auto;opacity: 1;padding: 2rem 0;-webkit-transition: all 0.3s;transition: all 0.3s;} #footer .related a {display: block;position: relative;padding: 0 2rem;} #footer .related a + a {margin-top: 0.5rem;} #footer .related .label {line-height: 5.5rem;color: #fff;font-weight: 700;color: #fff;padding: 0 3rem 0 0;width:100%;text-align: left;} #footer .related .label::after {position: absolute;top: auto;left: auto;right: auto;font-family: "remixicon";font-size: 1.8rem;right: 1rem;color: #bcc3c9;content: "\ea4d";-webkit-transition: all 0.3s;transition: all 0.3s;} #footer .related .list {visibility: hidden;overflow: hidden;width: 0;height: 0;opacity: 0;position: absolute;left: 0;bottom: 100%;width: 100% !important;margin-bottom: 0.5rem;background-color: #777;color: #fff;line-height: 2.5rem;border-radius: 0.6rem;} .btn-top{position:fixed;left:auto;right:9rem;bottom:9rem;transition: all .3s;z-index:100;background-color:#00A1C5;color:#fff;width:8rem;height:8rem;text-align: center;font-family: "Red_Hat_Display";font-weight:700;display:flex;align-items: center;justify-content: center;flex-direction: column;opacity:0;visibility: hidden;transform:translateY(100px);box-shadow: 12px 16px 35px 0px rgba(0,0,0,0.30);transition: box-shadow 150ms linear, background-color 150ms linear, transform 150ms } .btn-top:before{content:'\EA78';font-family: 'remixicon';display:block;text-align: center;font-weight:500;font-size:1.9rem;line-height:1;} .btn-top.active{opacity:1;visibility: visible;transform:translateY(0)} .btn-top:hover{transform: scale(.98);background-color:#019bbe;box-shadow: 6px 8px 8px 0px rgba(0,0,0,0.30);} .btn-top:active{ transform: scale(.97);background-color:#019bbe;box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.30);} /************************************************** 메인 **************************************************/ /* main anchor_menu */ .anchor_wrap {position:absolute; right:8rem; bottom:0; width:3.1rem; height:100%; z-index:51;} #anchor_menu {position:absolute; top:50%; transform:translateY(-50%); background-color:#ffffff; padding:1rem; border-radius:10rem; border:2px solid #e6e6e6;} #anchor_menu li {position:relative; padding:0.8rem 0; text-align:center;} #anchor_menu li a {display:block; position:relative; padding:0.5rem; width:0.9rem; height:0.9rem;} #anchor_menu li a:before {content:""; position:absolute; width:1rem; height:1rem; left:50%; top:50%; transform:translate(-50%,-50%); background:#e9e8e6; border-radius:50%;} #anchor_menu li span {position:absolute; top:50%; left:0rem; width:6rem; text-align:right; color:rgba(48,48,48,1.0); font-size:1.4rem; font-weight:600; transform:translateY(-50%); margin-right:1rem;} #anchor_menu li.active span {color:#ff9647; font-weight:600;} #anchor_menu li.active a:before {background-color:#ff9647;} /* 메인화면 헤더 비주얼1번 위에 고정 */ #header.up{position:fixed;top:0;left:0;width:100%;z-index:1000;background:#fff;box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);} #header.hiddn{top:-10rem;} #header.up #gnb_area .depth2 > li > a{color:#222;} #header.up .btn_menu .bar{background:#222;} #header.up .btn_menu a:after{border-color: #222;} #header.up .logo a{background:url('../../images/common/logo.svg') no-repeat center/cover;} #header.on{background:#fff;} #header.mob{background:#fff;position:fixed;} #header.mob.hiddn{top:0;} #header.mob .logo a{background: url(../../images/common/logo.svg) no-repeat center / cover;} #header.on #gab, #header.on .btn_menu a{display: none;} /* 타이틀 */ .main_tit {margin-bottom:7rem; line-height:1.1; font-size:4.6rem; color:#fff; font-weight:700; letter-spacing:-0.1rem;} /* effect */ .star {height:1px; width:1px; border-radius:5px; box-shadow:0px 0px 10px white; background:powderblue; position:absolute;} #effect2 {position:absolute; left:0; top:0; bottom:0; width:43%; overflow:hidden;} #effect2 img {width:100%; height:100%; transform:scale(1.3); -webkit-transition:ease-out 3s; transition:ease-out 3s;} .fp-viewing-business #effect2 img {transform:scale(1); width:100%; height:100%;} .lite {height:3px; width:3px; border-radius:50%; box-shadow:0px 0px 10px white; background:#23a8f2; position:absolute;} /* 메인(비주얼) */ .main_visual {width:100%; height:100%;} .btn_scroll {position:absolute; left:50%; bottom:5%; width:7rem; height:7rem; color:#fff; text-align:center; font-size:1.4rem; z-index:1000; cursor:pointer;} .btn_scroll:hover {background:rgba(255,255,255,0.2); border:0.1rem solid #fff;} .btn_scroll .line {position:absolute; background-color:#fff; transition:ease-in-out 0.1s; -webkit-transition:ease-in-out 0.1s;} .btn_scroll .line_t {top:0; left:0; height:0.1rem;} .btn_scroll .line_r {top:0; right:0; width:0.1rem;} .btn_scroll .line_b {bottom:0; right:0; height:0.1rem;} .btn_scroll .line_l {bottom:0; left:0; width:0.1rem;} .btn_scroll .txt {display:block; padding:2.3rem 0;} .btn_scroll .arrow {display:inline-block; width:1.8rem; height:2rem; background:url("../../images/main/btn_scroll.png") no-repeat;} /* visual */ .main_visual .bx-wrapper {position:relative; padding:0;-ms-touch-action:pan-y; touch-action:pan-y; width:100%; height:100%;} .main_visual .bxslider {margin:0; padding:0;} .main_visual .bx-viewport {width:100%; height:100%; -webkit-transform:translatez(0);} .main_visual .slider_img {width:100vw; height:100vh; transform:scale(1.3) rotate(.001deg); -webkit-transform:scale(1.3) rotate(.001deg); -moz-transform:scale(1.3) rotate(.001deg); transition:transform 6s ease-out; -webkit-transition:-webkit-transform 6s ease-out; -moz-transition:-moz-transform 6s ease-out;} .main_visual .slider_img.bg01 {background:url("../../images/main/main_slider01.jpg") no-repeat 50% 50%; background-size:cover;} .main_visual .slider_img.bg02 {background:url("../../images/main/main_slider02.png") no-repeat 50% 50%; background-size:cover;} .main_visual .slider_img.bg03 {background:url("../../images/main/main_slider03.png") no-repeat 50% 50%; background-size:cover;} .main_visual .slider_img.bg04 {background:url("../../images/main/main_slider04.jpg") no-repeat 50% 50%; background-size:cover;} .main_visual .slider_img > img {display:none; width:100%; line-height:1; font-size:1%;} .fp-viewing-business .main_visual .zoom .slider_img{transform:scale(1.5); -webkit-transform:scale(1.5); -moz-transform:scale(1.5);} .main_visual .bx-wrapper .bx-controls {position:absolute; left:50%; bottom:7.5%; width:120rem; margin-left:-62rem; z-index:55; text-align:center;} .main_visual .bx-wrapper .bx-controls-auto {display:inline-block; position:relative; vertical-align:middle; margin-right:1.0rem; top:0.2rem;} .main_visual .bx-wrapper .bx-pager {display:inline-block; position:relative; vertical-align:middle; line-height:1; z-index:51;} .main_visual .bx-wrapper .bx-pager-item {position:relative; display:inline-block; line-height:1; margin:0 1.0rem; text-align:center; vertical-align:middle;} .main_visual .bx-wrapper .bx-pager-link {display:block; width:0.8rem; height:0.8rem; line-height:1; font-size:0; background:#ff9647; border-radius:50%;} .main_visual .bx-wrapper .bx-pager-link.active {width:1.4rem; height:1.4rem; background:#dbdde4;} .main_visual .bx-wrapper .bx-controls-auto .bx-start {display:block; text-indent:-9999px; width:1rem; height:1.4rem; outline:0; background:url("../../images/main/slider_play.png") no-repeat 50% 50%;} .main_visual .bx-wrapper .bx-controls-auto .bx-stop {display:block; text-indent:-9999px; width:0.8rem; height:1.4rem; outline:0; background:url("../../images/main/slider_stop.png") no-repeat 50% 50%;} .main_visual .slider_txt {position:absolute; text-align:center; left:50%; top:50%; width:120rem; margin-left:-62rem; -ms-transform:translate(0,-74%); -moz-transform:translate(0,-74%); -webkit-transform:translate(0,-74%); transform:translate(0,-74%); color:#fff; z-index:1000;} .main_visual .slider_txt h2.txt01 {position:relative; font-size:6.0rem; font-weight:700; letter-spacing:-0.15rem;} .main_visual .slider_txt h2.txt01::before {content:""; position:absolute; top:-1rem; left:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt01::after {content:""; position:absolute; top:7rem; right:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt02 {position:relative; font-size:6.0rem; font-weight:700; letter-spacing:-0.15rem;} .main_visual .slider_txt h2.txt02::before {content:""; position:absolute; top:-1rem; left:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt02::after {content:""; position:absolute; top:7rem; right:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt03 {position:relative; font-size:6.0rem; font-weight:700; letter-spacing:-0.15rem;} .main_visual .slider_txt h2.txt03::before {content:""; position:absolute; top:-1rem; left:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt03::after {content:""; position:absolute; top:7rem; right:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt04 {position:relative; font-size:6.0rem; font-weight:700; letter-spacing:-0.15rem;} .main_visual .slider_txt h2.txt04::before {content:""; position:absolute; top:-1rem; left:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2.txt04::after {content:""; position:absolute; top:7rem; right:11rem; width:1px; height:35px; background-color:#ffffff; transform:rotate(-60deg);} .main_visual .slider_txt h2 {display:block; opacity:0; filter:Alpha(opacity=0); -moz-transform:translateY(15%); -ms-transform:translateY(15%); transform:translateY(15%); -moz-transition:all 1s; -ms-transition:all 1s; transition:all 1s;} .main_visual .slider_txt p {display:block; opacity:0; filter:Alpha(opacity=0); -moz-transform:translateY(15%); -ms-transform:translateY(15%); transform:translateY(15%); -moz-transition:all 1s; -ms-transition:all 1s; transition:all 1s;} .main_visual .slider_txt p {-moz-transform:translateY(50%); -ms-transform:translateY(50%); transform:translateY(50%);} .main_visual .active-slide .slider_txt h2 {opacity:1.0; filter:none; -moz-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0);} .main_visual .active-slide .slider_txt p {opacity:1.0; filter:none; -moz-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0);} .main_visual .slider_txt p {margin-top:2rem; font-size:2.5rem; font-weight:100; color:rgba(255,255,255,1.0); transition-delay:0.2s;} .main_visual .active-slide .slider_img {transform:scale(1) rotate(.001deg);} /* 소개 */ .main_introduce {position:relative; width:120rem; margin:9rem auto 0 auto;} .main_introduce h2.main_tit {position:relative; text-align:center; color:#303030; font-size:3.8rem; margin-bottom:8rem;} .main_introduce h2.main_tit span.h2_txt {position:absolute; top:6rem; width:100%; display:block; text-align:center; color:#303030; font-size:2.0rem; font-weight:400;} .main_introduce_box {position:relative;} .introduce_box {display:flex; justify-content:space-between;} .introduce_box:first-child {margin-bottom:2rem; height:29rem;} .introduce_box:last-child {height:21rem;} .box_greeting {width:720px; background-color:#ffffff; display:flex; justify-content:space-between;} .box_greeting .greeting_01 {width:295px; background-color:#dee4f2;} .box_greeting .greeting_01 .ceo_pic {position:relative; height:220px; background:url("../../images/main/img_main_ceo.png") no-repeat 0 0;} .box_greeting .greeting_01 .ceo_pic span.ceo_txt01 {position:absolute; top:7rem; left:2.2rem; font-size:1.6rem; color:#303030; font-weight:500;} .box_greeting .greeting_01 .ceo_pic span.ceo_txt02 {position:absolute; top:9.2rem; left:2.2rem; font-size:2.5rem; color:#303030; font-weight:700;} .box_greeting .greeting_01 a {text-align:center; padding-right:4rem; display:block; color:#ffffff; background:#003DA5 url("../../images/main/i_ceo_go.png") no-repeat 18rem 2.6rem; line-height:70px;} .box_greeting .greeting_02 {width:425px; padding:4.5rem 0 0 3rem; color:#303030; font-weight:500;} .box_greeting .greeting_02 p:nth-child(1) {font-size:1.7rem; font-weight:700; margin-bottom:4rem;} .box_greeting .greeting_02 p:nth-child(2) {font-size:1.5rem; margin-bottom:3rem;} .box_greeting .greeting_02 p:nth-child(3) {font-size:1.5rem;} .box_banner {width:460px; background-color:#0057a1;} .box_banner .cont {position:relative; width:460px;} .box_banner .cont button {border:none; background-color:transparent; cursor:pointer;} .box_banner .cont a {transform:skew(-0.1deg);} .box_banner .cont a img {vertical-align:middle; height:auto; width:auto; max-width:100%; border:none} .box_banner .cont #main_banner {position:relative;} .box_banner .cont #main_banner .btn_banner_prev {position:absolute; z-index:3; color:transparent; display:block; width:34px; height:33px; bottom:1.8rem; left:3rem; background:url("../../images/main/i_arrow_left.png") center center no-repeat;} .box_banner .cont #main_banner .btn_banner_next {position:absolute; z-index:3; color:transparent; display:block; width:34px; height:33px; bottom:1.8rem; left:6.6rem; background:url("../../images/main/i_arrow_right.png") center center no-repeat;} .box_banner .cont .btnControl {position:absolute; left:10.2rem; bottom:1.3rem; z-index:3;} /* 수정 */ .box_banner .cont .btnControl .btnPlay {display:none;} .box_banner .cont .btnControl .btnPause {} .box_banner .cont .btnControl a {display:inline-block;} .box_banner .cont #main_banner .main_banner_dots {position:absolute; right:3rem; bottom:2.4rem; z-index:3;} .box_banner .cont #main_banner .main_banner_dots li {display:none; font-size:1.5rem; color:#ffffff; transform:skew(-0.1deg); font-weight:300;} .box_banner .cont #main_banner .main_banner_dots li.slick-active {display:block;} .box_banner .cont #main_banner .main_banner_dots li span {color:#ffffff; font-weight:700;} .box_banner .cont #main_banner .main_banner_dots li span.bar {color:#ffffff; display:inline-block; margin:0 .2rem;} .box_banner .cont #main_banner .btn_bg {position:absolute; z-index:2; bottom:0; left:0; background:rgba(0,0,0,0.6); width:100%; height:7rem;} .box_banner .cont .slick-slide {height:29rem; overflow:hidden;} .box_banner .cont .slick-slide img {min-width:100%; min-height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);} .box_organize {width:650px; background-color:#ffffff;} .box_organize .organize_txt {height:78px; padding:2.2rem 3rem 0 3rem; color:#303030;} .box_organize .organize_txt .txt01 {font-weight:700; margin-bottom:0.5rem;} .box_organize .organize_txt a.mobile_link {display:none;} .box_organize .search_area {margin-bottom:0; background:url("../../images/main/i_search_area.png") no-repeat 3rem center; padding:0 0 0 11.5rem; line-height:132px;} .box_organize .search_area .search_select {width:100px;} .box_organize .search_area .search_select label {font-weight:700;} .box_organize .search_area .search_input {width:280px;} .box_organize .search_area .btn_search {width:80px; background:#0057a1;} .box_organize .search_area .btn_search i {display:none;} .box_hire {width:530px; background-color:#0057a1; color:#ffffff;} .box_hire .hire_01 {height:95px; padding:2.2rem 3rem 0 3rem;} .box_hire .hire_01 .txt01 {font-weight:700; margin-bottom:0.5rem;} .box_hire .hire_02 {display:flex; justify-content:space-between;} .box_hire .hire_02 a.link01 {text-align:center; width:50%; background:#00386b url("../../images/main/i_hire_link02.png") no-repeat center 2.1rem; display:block; line-height:65px; padding-top:5rem;} .box_hire .hire_02 a.link02 {text-align:center; width:50%; background:#00437e; display:block; line-height:35px; padding-top:2.5rem;} /* 사업 */ #section2 {background:#ffffff; font-family:'NotoSansNew', 'malgun gothic', 'dotum';} .main_business {position:relative; width:120rem; margin:9rem auto 0 auto;} .main_business h2.main_tit {position:relative; text-align:center; color:#303030; font-size:3.8rem; margin-bottom:8rem;} .main_business h2.main_tit span.h2_txt {position:absolute; top:6rem; width:100%; display:block; text-align:center; color:#303030; font-size:2.0rem; font-weight:400;} .main_business_box {position:relative;} .main_business_box .business_box_01 a {display:flex; justify-content:space-between; height:300px; margin-bottom:2rem; color:#ffffff;} .main_business_box .business_box_01 a img {box-shadow:5px 10px 15px 0px rgba(0,0,0,0.2); -webkit-box-shadow:5px 10px 15px 0px rgba(0,0,0,0.2); -moz-box-shadow:5px 10px 15px 0px rgba(0,0,0,0.2);} .main_business_box .business_box_01 a .txt {margin-top:2rem; font-weight:500;} .main_business_box .business_box_01 a p {margin-top:1rem; font-size:1.4rem;} .main_business_box .business_box_01 a .field_0101 {width:380px; padding:3rem 4rem 0 4rem; background:linear-gradient(135deg, #0266b3, #0266b3, #0266b3);} .main_business_box .business_box_01 a .field_0102 {width:380px; padding:3rem 4rem 0 4rem; background:linear-gradient(135deg, #4669b2, #4669b2, #4669b2);} .main_business_box .business_box_01 a .field_0103 {width:380px; padding:3rem 4rem 0 4rem; background:linear-gradient(135deg, #0266b3, #4669b2, #7dcdcc);} .main_business_box .business_box_02 a {display:flex; justify-content:space-between; height:300px; color:#ffffff;} .main_business_box .business_box_02 a img {box-shadow:5px 10px 15px 0px rgba(0,0,0,0.2); -webkit-box-shadow:5px 10px 15px 0px rgba(0,0,0,0.2); -moz-box-shadow:5px 10px 15px 0px rgba(0,0,0,0.2);} .main_business_box .business_box_02 a .txt {margin-top:2rem; font-weight:500;} .main_business_box .business_box_02 a p {margin-top:1rem; font-size:1.4rem;} .main_business_box .business_box_02 a .field_0201 {width:380px; padding:3rem 4rem 0 4rem; background:linear-gradient(135deg, #4669b2, #4669b2, #4669b2);} .main_business_box .business_box_02 a .field_0202 {width:380px; padding:3rem 4rem 0 4rem; background:linear-gradient(135deg, #0266b3, #4669b2, #7dcdcc);} .main_business_box .business_box_02 a .field_0203 {width:380px; padding:3rem 4rem 0 4rem; background:linear-gradient(135deg, #0266b3, #0266b3, #0266b3);} /* 참여 */ #section3 {background:url("../../images/main/bg_section3.png") no-repeat 0 0; background-size:cover; font-family:'NotoSansNew', 'malgun gothic', 'dotum';} .main_community {position:relative; width:120rem; margin:10rem auto 0 auto;} .main_community h2.main_tit {position:relative; text-align:center; color:#303030; font-size:3.8rem; margin-bottom:12rem;} .main_community h2.main_tit span.h2_txt {position:absolute; top:6rem; width:100%; display:block; text-align:center; color:#303030; font-size:2.0rem; font-weight:400;} .main_community_box {position:relative; display:flex; justify-content:space-between; height:363px;} .main_community_box .community_box_01 {position:relative; width:500px; background:rgba(101,122,255,0.8); color:#ffffff; padding:3rem 0 0 3rem;} .main_community_box .community_box_01::after {content:""; display:table; clear:both;} .main_community_box .community_box_01 .community_tit {float:left; font-weight:700; font-size:1.9rem; margin-right:2rem; padding-top:1rem;} .main_community_box .community_box_01 ul.icon_box {float:left; width:75%;} .main_community_box .community_box_01 ul::after {content:""; display:table; clear:both;} .main_community_box .community_box_01 ul li {float:left; margin-right:5.5rem; margin-bottom:2.5rem;} .main_community_box .community_box_01 ul li:nth-child(2) {margin-right:0;} .main_community_box .community_box_01 ul li:nth-child(3) {margin-bottom:0;} .main_community_box .community_box_01 ul li:nth-child(4) {margin-bottom:0; margin-right:0;} .main_community_box .community_box_01 ul li a .icon_0101 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0101.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_01 ul li a .icon_0102 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0102.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_01 ul li a .icon_0103 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0103.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_01 ul li a .icon_0104 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0104.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_01 ul li a .icon_txt {text-align:center; margin-top:2rem; font-weight:400;} .main_community_box .community_box_02 {position:relative; width:680px; background:rgba(255,255,255,0.8); color:#303030; padding:3rem 0 0 3rem;} .main_community_box .community_box_02::after {content:""; display:table; clear:both;} .main_community_box .community_box_02 .community_tit {float:left; font-weight:700; font-size:1.9rem; margin-right:2rem; padding-top:1rem;} .main_community_box .community_box_02 ul.icon_box {float:left; width:75%;} .main_community_box .community_box_02 ul::after {content:""; display:table; clear:both;} .main_community_box .community_box_02 ul li {float:left; margin-right:4rem; margin-bottom:2.5rem;} .main_community_box .community_box_02 ul li:nth-child(3) {margin-right:0;} .main_community_box .community_box_02 ul li:nth-child(4) {margin-bottom:0;} .main_community_box .community_box_02 ul li:nth-child(5) {margin-bottom:0;} .main_community_box .community_box_02 ul li:nth-child(6) {margin-bottom:0; margin-right:0;} .main_community_box .community_box_02 ul li a .icon_0201 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0201.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_02 ul li a .icon_0202 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0202.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_02 ul li a .icon_0203 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0203.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_02 ul li a .icon_0204 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0204.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_02 ul li a .icon_0205 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0205.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_02 ul li a .icon_0206 {width:10rem; height:10rem; background:#edefff url("../../images/main/i_icon_0206.png") no-repeat center center; margin:0 1.7rem 0 1.7rem; border-radius:2.5rem;} .main_community_box .community_box_02 ul li a .icon_txt {text-align:center; margin-top:2rem; font-weight:400;} /* 공유 */ #section4 {background:#ffffff; font-family:'NotoSansNew', 'malgun gothic', 'dotum';} .main_communication {position:relative; width:120rem; margin:10rem auto 0 auto;} .main_communication h2.main_tit {position:relative; text-align:center; color:#303030; font-size:3.8rem; margin-bottom:6rem;} .main_communication h2.main_tit span.h2_txt {position:absolute; top:6rem; width:100%; display:block; text-align:center; color:#303030; font-size:2.0rem; font-weight:400;} .main_communication .communication_more {display:none;} .main_communication_box {position:relative;} .main_communication_box .communication_box_01 {display:flex; justify-content:space-between; margin-bottom:5rem;} .main_communication_box .communication_box_01 .box_wrap {width:285px; height:247px; border:1px solid #cdcdcd; font-weight:400; padding:3rem 3rem 0 3rem;} .main_communication_box .communication_box_01 .box_wrap .press_tit {position:relative; text-align:right; font-size:1.4rem; font-weight:300; margin-bottom:2rem;} .main_communication_box .communication_box_01 .box_wrap .press_tit span {position:absolute; left:0; background-color:#954bb2; width:74px; height:24px; line-height:22px; text-align:center; color:#ffffff; border-radius:10rem;} .main_communication_box .communication_box_01 .box_wrap .notice_tit {position:relative; text-align:right; font-size:1.4rem; font-weight:300; margin-bottom:2rem;} .main_communication_box .communication_box_01 .box_wrap .notice_tit span {position:absolute; left:0; background-color:#4669b2; width:74px; height:24px; line-height:22px; text-align:center; color:#ffffff; border-radius:10rem;} .main_communication_box .communication_box_01 .box_wrap a .txt01 {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; width:223px; white-space:normal; height:4.4rem; overflow:hidden; text-overflow:ellipsis; font-weight:700; margin-bottom:3rem;} .main_communication_box .communication_box_01 .box_wrap a p {display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; width:223px; white-space:normal; height:5.7rem; overflow:hidden; text-overflow:ellipsis; font-weight:400; font-size:1.4rem;} .main_communication_box .communication_box_02 {display:flex; justify-content:space-between;} .main_communication_box .communication_box_02 .sns_wrap {position:relative; width:860px;}/* 수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tit {position:absolute; top:0; left:0; font-weight:700; font-size:3.2rem;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab {position:relative;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list {position:relative;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list:after {content:""; display:block; clear:both;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li {position:relative;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li a span {position:relative; top:1.4rem; left:27rem;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li a {position:relative; float:left; color:#898989;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li a span {font-weight:400; display:inline-block; cursor:pointer; font-size:1.8rem; margin-right:3rem;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li a span:after {content:""; display:block; position:absolute; right:-1.6rem; top:11px; width:3px; height:3px; background:#303030; border-radius:10rem;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li:last-child a span:after {background:none;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li.active a {color:#303030;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li.active a span {font-weight:700;} /* .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul {position:absolute; top:86px; width:860px; left:0;}수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul {position:absolute; top:86px; width:1200px; left:0;}/* 수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul:after {content:""; display:block; clear:both;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li {float:left; margin-right:2rem;} /* .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li:nth-child(4) {margin-right:0;} 수정 */ /* .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap {width:200px; height:200px; border:1px solid #cdcdcd; font-weight:400; padding:3rem 2.5rem;}수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap {width:180px; height:200px; border:1px solid #cdcdcd; font-weight:400; padding:3rem 2.5rem;}/* 수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap a .txt01 {display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; width:150px; white-space:normal; height:6.5rem; overflow:hidden; text-overflow:ellipsis; font-weight:700; margin-bottom:3rem;} /* 수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap a p {display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; width:200px; white-space:normal; height:5.7rem; overflow:hidden; text-overflow:ellipsis; font-weight:400; font-size:1.4rem;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap a {margin-bottom:3rem;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap .date {text-align:right; font-size:1.4rem; font-weight:300;} .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li.more {position:absolute; top:-7.5rem; right:-2rem;} /* 210719 */ /* .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap_instar {width:200px; height:2px; border:1px solid #cdcdcd; font-weight:400; margin:0rem 1.6rem 0 1.6rem;}수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap_instar {width:180px; height:2px; border:1px solid #cdcdcd; font-weight:400; /* margin:0rem 1.6rem 0 1.6rem; */}/* 수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap_instar a {margin-bottom:3rem;} /* .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap_instar a img {width:200px; height:200px;}수정 */ .main_communication_box .communication_box_02 .sns_wrap .sns_tab ul.tab_list li ul li .box_wrap_instar a img {width:180px; height:200px;}/* 수정 */ .main_communication_box .communication_box_02 .letter_wrap {position:relative; display:inline-block; width:300px; text-align:right;}/* 수정 */ .main_communication_box .communication_box_02 .letter_wrap .letter_tit {display:inline-block; font-weight:700; font-size:3.2rem; width:20px; word-wrap:break-word; text-align:center; vertical-align:top; margin-right:2.5rem; line-height:1.2;} .main_communication_box .communication_box_02 .letter_wrap img {display:inline-block; border:1px solid #cdcdcd;} /************************************************** 서브 **************************************************/ .container{width:140rem;max-width:90%;margin:0 auto;} /* default */ #container {position:relative; } #content {position:relative; width:128rem; margin:0 auto; max-width: 90%;padding-bottom:20rem;} #content::after {content:""; display:table; clear:both;} #content.content_people {padding:7rem 0 0 6rem;} #content.content_people::before {content:""; display:block; position:absolute; left:-90%;bottom:0; width:100%; height:29rem; background-color:#f4f4f4;} #content.content_people::after {content:""; display:block; position:absolute; right:-100%;bottom:0; width:100%; height:29rem; background-color:#f4f4f4; z-index:-1;} .sub_visual .container, #footer .sub.container{width:128rem;} /* 비주얼 */ .sub_visual{position:relative;height:23.5rem;color:#fff;display:flex;align-items: center;} .sub_visual .img{ position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);display: block;z-index: -1;width: 100vw;height: 100%;overflow: hidden;} .sub_visual img{max-width: inherit;width: 100%;height: 100%;object-fit: cover;transform: scale(1.2);animation: visual_scale 7s;animation-fill-mode: forwards;} @keyframes visual_scale { 100%{transform:scale(1)} } @keyframes visual_scale2 { 100%{transform:translate(-50%, -50%) scale(1)} } .sub_visual .sub_title strong{position:relative;display:inline-block;font-size:4.8rem;font-weight:700;padding:2rem 0 1.5rem;} .sub_visual .sub_title strong:before{content:'';width:8.4rem;height:5px;background:#fff;position:absolute;top:0;left:5px;transform: skew(-50deg);} .sub_visual .sub_title p{font-size:1.8rem;font-weight:500;} .sub_visual .sub_title strong:after{width:2rem;height:5px;content:'';background:#fff;position:absolute;top:0;left:0;} /* location */ .sub_navi {position:absolute; right:0;top:3rem;display: none;} .sub_navi .home{font-size:0;} .sub_navi .home:before{content:'\EE1E';font-family: 'remixicon';color:#616161;font-size:1.6rem;} .sub_navi .navi_wrap > *{position: relative;color:#757575;} .sub_navi .navi_wrap > *:after{color:#9E9E9E;font-family: 'remixicon';content:'\EA6E';display:inline-block;margin:0 0.5rem 0 0.7rem;font-size:1.6rem;} .sub_navi .navi_wrap > *:last-child:after{display: none;} /* 사이드메뉴 */ /* 2412 개편*/ #side{position: relative;padding-top:1px;} #side:before{content: '';width:100vw;left:50%;top:100%;height:1px;background:#616161;position:absolute;transform: translateX(-50%);z-index: 1;} #side .path:after{clear: both;display:block;content:'';} #side .path > div{float:left;height:6rem;} #side .path > div:before{content:'';width:1px;height:100%;background:#e0e0e0;display: inline-block;} #side .path > .home{border-left: 1px solid #e0e0e0;} #side .path > .home:before{display: none;} #side .home a{width:6rem;height:100%;display: flex;align-items: center;justify-content: center;font-size:0;} #side .home a:after{content:'\EE1E';font-family: 'remixicon';font-size:2rem;color:#003DA5;} #side [class*="list"]{width:24rem;} #side [class*="list"] a{font-size:1.6rem;font-weight:500;display: block;cursor: pointer;} #side .list1 > ul{position:absolute;top:100%;left:auto;width:100%;z-index: 10;margin-top:1px;margin-left:1px;} #side .list1.active > ul{background:#003DA5;padding:1.6rem 1.6rem 0.6rem;} #side .list1 > ul > li{color:#fff;display:none;margin-bottom:1rem;} #side .list1.active > ul > li{display: block;} #side .list1 > ul > li.active{display: block;} #side .list1{position:relative;} #side .list2 h2.title{display: none;} #side .path .list1 .active{position:absolute;top:-6.2rem;font-size:1.6rem;color:#222;font-weight:500;height:6.1rem;line-height:6rem;width:100%;left:0;margin-bottom:0;} #side .path .list1 .active:after{content:'\EA4E';font-family: 'remixicon';top:0;position:absolute;right:1.6rem;transition:all .3s;} #side .path .list1.active .active:after{transform:rotate(180deg);} #side .path .list1 .active > a{padding-left:1.6rem;} #side .path .list1.active .active{background:#003DA5;color:#fff;} #side .snb{position:absolute;top:100%;left:auto;background:#003DA5;width:24rem;z-index: 11;margin-top:1px;} #side .list2{border-right:1px solid #E0E0E0;} #side .list2 .snb_wrap{width:100%;} #side .snb > li > a{margin-bottom:1rem;color:#fff;display:none;} #side .snb li:last-child > a{margin-bottom:0;} #side .list2 #s_btn{position:absolute;left:30.1rem;width:24rem;top:0;} #side .list2 [class*="snb_btn"]{color:#222;height:6.2rem;display: flex;align-items: center;padding:0 1.6rem;padding-right:4rem;} #side .list2 [class*="snb_btn"]:after{content: '\EA4E';font-family: 'remixicon';top: auto;position: absolute;right: 1.6rem;transition: all .3s;} #side .list2 [class*="snb_btn"].on{background:#003DA5;color:#fff;} #side .list2 [class*="snb_btn"].on:after{transform: rotate(180deg);} #side .list2 .snb_btn2{height:6.1rem;} #side .snb.active{padding:1.6rem;} #side .snb.active > li > a{display: block;} #side .snb.active > li.open > a{background:#003DA5;color:#fff; text-decoration: underline; text-underline-offset: 4px;} .snb_btn2{position: absolute;left:24.1rem;width:auto;top:-6.2rem;border-right:1px solid #e0e0e0; white-space: pre-wrap;width:100%;text-align:left;} .unfd{display: none;} #side .snb li > ul{display: none;position:absolute;left:24.1rem;background: #003DA5;width:100%;color:#fff;font-size:1.6rem;top:0;} #side .snb li > ul > li{margin-bottom:1rem;} #side .snb li > ul > li:last-child{margin-bottom:0;} #side .snb li > ul.me_nu{display:block;padding:1.6rem;padding-right:4rem;border-right:1px solid #ddd;;} #side.fix{position:fixed;top:0;left: 50%;width: 100%;background: #fff;transform: translateX(-50%);z-index: 99;box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);} #side.fix .path{width: 128rem;left: 50%;transform: translateX(-50%);position: relative;} /* btn */ .btn_area {position:relative; text-align:right; margin-top:1.5rem;font-size:1.8rem;} .btn {display:inline-block; font-weight:400; text-align:center; vertical-align:middle; cursor:pointer; border:0; white-space:nowrap; line-height:1; margin-right:1rem;} /* 수정 */ .btn:last-child {margin-right:0;} /* 추가 */ .btn_list {min-width:10rem; padding:0 1rem; height:4rem; line-height:3.8rem; background:#fff; color:#003DA5; border:0.1rem solid #003DA5;} .btn_intxt_down {background:#fff url("../../images/sub/btn_intxt_down.png") no-repeat calc(100% - 1.3rem) center; border:1px solid #898989; color:#555; font-size:1.4rem; font-weight:300; text-align:center; display:inline-block; border-radius:8px; padding:0.8rem 4rem 0.8rem 1rem; width:10rem;} /* 추가 */ .btn_cancel {min-width:10rem; padding:0 1rem; height:4rem; line-height:3.8rem; background:#898989; color:#fff;} /* 추가 */ .btn_confirm {min-width:10rem; padding:0 2rem; height:5rem; font-size:1.8rem; line-height:4.8rem; background:#003DA5; color:#fff;} /* 추가 */ .btn_set_left {position:absolute; left:0; top:0} /* 추가 */ /* tab */ .edu_process .lnb {margin-bottom:2rem; width:100%; border-bottom:1px solid #d6d6d6;} .edu_process .lnb ul {position:relative;} .edu_process .lnb ul:after {content:""; display:block; clear:both;} .edu_process .lnb li {float:left; position:relative; padding:0; font-size:1.8rem; letter-spacing:-1px; text-align:center;} .edu_process .lnb li:before {display:none;} .edu_process .lnb li a {display:block; position:relative; color:#303030;} .edu_process .lnb li a[target="_blank"]:after {content:""; display:inline-block; width:12px; height:12px; margin:-2px 0 0 3px; vertical-align:middle; background:url("../../images/sub/win.gif") no-repeat center center;} /* tab01(4개 이하) */ .edu_process .lnb.tmn01 li {width:20%; height:52px; line-height:50px; margin-bottom:-1px; margin-left:-1px; border:1px solid #d6d6d6; background-color:#f8f8f8;} .edu_process .lnb.tmn01 li a {overflow:hidden; height:100%; padding:0px; white-space:nowrap; text-overflow:ellipsis;} .edu_process .lnb.tmn01 li.on {line-height:45px;} .edu_process .lnb.tmn01 li.on a {z-index:10; height:calc(100% + 2px);line-height:50px; margin:-1px; border-top:3px solid #003DA5; border-left:1px solid #d6d6d6; border-right:1px solid #d6d6d6; color:#003DA5; font-weight:600; background:#fff;} .edu_process .lnb.tmn01 li.on a:before { background:url("../../images/common/lnb_ico.png"); height:7px; top:calc(50% - 3px);} /* search */ .search_select {display:inline-block; position:relative; width:165px; height:4.5rem; line-height:4.5rem; border:0.1rem solid #cdcdcd; z-index:1; vertical-align:middle; background:#fff;} .search_select:before {content:""; position:absolute; top:50%; right:1rem; width:1rem; height:0.6rem; margin-top:-0.3rem; background:url("../../images/sub/bg_arrow02.png") no-repeat center/cover;} .search_select label {position:absolute; top:0; left:0; padding-left:1.7rem; z-index:-1; width:100%; text-align: left;} .search_select select {display:block; width:100%; height:4.3rem; line-height:normal; vertical-align:middle; font-family:inherit; border:0; opacity:0; filter:alpha(opacity=0); -webkit-appearance:none; -moz-appearance:none; appearance:none;padding:1rem;} .search_input {display:inline-block; margin:0 5px 0 5px; position:relative; width:30%; height:4.5rem; line-height:4.5rem; text-align:left; border:0.1rem solid #cdcdcd; padding:0 1rem; vertical-align:middle; overflow:hidden; background:#fff;} .search_input input {position:relative; top:-2px; border:0;color:#747474;} .search_input input[id*="search"]{width:100% !important;} .search_input input:focus {outline:none;} .search_input input::placeholder {color:#787878; opacity:0.8; font-weight:300;} .search_input input::-webkit-input-placeholder {color:#787878; opacity:0.8; font-weight:300;} .search_input input::-ms-input-placeholder {color:#787878; opacity:0.8; font-weight:300;} .search_input input::-mos-input-placeholder {color:#787878; opacity:0.8; font-weight:300;} .search_area .btn_search, .offce_search_box .btn_search {display:inline-block; width:8rem; height:4.5rem; text-align:center; font-size:1.8rem; color:#fff; border:0; background:#003DA5;} .search_area .btn_search i, .offce_search_box .btn_search i {display:none;} /* board 목록 */ .tbl_top {margin-bottom:1.1rem;} .tbl_top .tbl_count {font-size:1.8rem; font-weight:500; vertical-align:middle;} .tbl_top .tbl_count .count_bold {font-weight:400; color:#000000;} .tbl_wrap {position:relative; width:100%;} .tbl_list {display:table; width:100%; table-layout:fixed; border-top:0.1rem solid #8595ff;} .tbl_colgroup {display:table-column-group;} .tbl_colgroup .col {display:table-column;} .tbl_head {display:table-header-group;} .tbl_body {display:table-row-group} .tbl_row {display:table-row} .tbl_cel {display:table-cell; vertical-align:middle;} .tbl_cel .m_data, .tbl_cel .m_data2 {display:none;} .tbl_cel:hover {cursor:pointer;} .tbl_list .tbl_head .tbl_cel {padding:1.2rem 0 1.4rem 0; border-bottom:1px solid #d5d3d6; text-align:center; background:#f5f6ff; color:#3d3d3d; font-size:1.8rem; line-height:1.1; font-weight:600;} .tbl_list .tbl_body .tbl_cel {padding:1.3rem 1rem; border-bottom:1px solid #d5d3d6; color:#333; font-size:1.8rem; line-height:1.1;font-weight:300;} .tbl_list .tbl_body .tbl_row:hover{background:#fbfbfb;} /* 추가 */ .tbl_cel.title.l.bd_text.reply {background: url(../../images/sub/i_reply.png) no-repeat 15px center;padding-left: 40px;} .tbl_row.no_date:hover .tbl_cel {background:#fff !important;} .tbl_list .subject {display:inline-block; max-width:95%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#3d3d3d;} .tbl_list .subject02 {display:block; margin-bottom:1.5rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#3d3d3d; font-size:2rem; font-weight:400; letter-spacing:-0.06em;} .tbl_list .i_new {vertical-align:top; margin-left:0.3rem;} .tbl_cel.num, .tbl_cel.date, .tbl_cel.name, .tbl_cel.hit, .tbl_cel.group, .tbl_cel.task, .tbl_cel.tel, .tbl_cel.office, .tbl_cel.type, /* 추가 */ .tbl_cel.statu, /* 추가 */ .tbl_cel.cycle, /* 추가 */ .tbl_cel.time, /* 추가 */ .tbl_cel.file {text-align:center;} .tbl_cel.file img {display:inline-block;} .tbl_row.no_date .no_txt {text-align:center;width:100%;} .tbl_cel.tag {text-align:center; letter-spacing:-0.04em; font-weight:400;} .tbl_cel .tag_ing {width:7.7rem; height:7.7rem; line-height:7.7rem; color:#fff; font-size:1.8rem; background:#243e72; border-radius:50%;} .tbl_cel .tag_end {width:7.7rem; height:7.7rem; line-height:7.7rem; color:#fff; font-size:1.8rem; background:#bababa; border-radius:50%;} .period_date {font-size:1.6rem; color:#919191;} .i_date {display:inline-block; margin-right:0.4rem;} .fix_notice {background:#f9f9f9;} .fix_notice .num img {display:inline-block;} .txt_pp {color:#003DA5 !important;} /* 추가 */ .txt_999 {color:#999 !important;} /* 추가 */ .txt_red {color:#e85432 !important;} /* 추가 */ .txt_sort {font-weight:400; margin-right:1.0rem; padding-left:0 !important;} /* 추가 */ /* board 상세 */ #bbsView {position:relative;} #bbsView:before {content:""; display:block; position:absolute; top:0; left:0; right:0; z-index:10; border-top:1px solid #8595ff;} .form_group {position:relative; margin-bottom:-1px; border-top:1px solid #d7d7d7; border-left:0px solid #d7d7d7; border-right:0px solid #d7d7d7; border-bottom:1px solid #d7d7d7;} .bd_b1 {border-bottom:1px solid #d7d7d7;} .form_group:after {content:""; display:block; clear:both;} /* 241121_기존 스타일 .form_group dl {position:static; overflow:hidden;}*/ .form_group dl:not(.content) {position:static; overflow:hidden;display:flex;} .form_group dl dt {box-sizing:border-box; width:30%; margin-left:-1px; padding:1rem 2rem; text-align:left; font-weight:400;padding:1rem 2rem;font-weight:600;background:#f5f6ff;display: flex;align-items: center;} /* 수정 */ .form_group dl dd {box-sizing:border-box; width:70%; padding:1rem 2rem;background:#fff;min-height:4.7rem;} /* 수정 */ .form_group dl dd > div{white-space: inherit !important;} .form_group.col03 dl:nth-child(1) {float:left; width:40%;} .form_group.col03 dl:nth-child(2) {float:left; width:30%;} .form_group.col03 dl:nth-child(3) {float:left; width:30%;} .form_group.col03 dl.title {width: 70%;} .form_group dl.content dd {margin:0; padding:2rem; line-height:1.6; min-height:20rem;width:100%;} .form_group dl.content dd .pre_wrap {white-space:pre-wrap;} .form_group dl.content dd img {max-width:100%; margin:5px 0;width: auto !important; height: auto !important;} .form_group dl.content > dd p {margin:0;} #bbsFile {position:relative;} #bbsFile:before {content:""; display:block; position:absolute; top:0; left:0; right:0; z-index:10;} .form_group2 {position:relative; margin-bottom:-1px; border-top:1px solid #d7d7d7; border-left:0px solid #d7d7d7; border-right:0px solid #d7d7d7; border-bottom:1px solid #d7d7d7;} .form_group2:after {content:""; display:block; clear:both;} .form_group2 dl {position:static; overflow:hidden;} .form_group2 dl dt {position:absolute; top:0; bottom:0; box-sizing:border-box; width:140px; margin-left:-1px; padding:1rem 2rem; background:#f5f6ff; line-height:1.6; text-align:left; font-weight:400;} .form_group2 dl dd {box-sizing:border-box; margin-left:134px; padding:10px 12px 0px 22px;} .form_group2 dl dd:last-child {padding-bottom:10px;} .form_group2 dl dd a {display:block;} .form_group2 dl dd a.i_hwp {background:url("../../images/sub/i_hwp.png") no-repeat 0 0; padding-left:3rem;} .form_group2 dl dd a.i_pdf {background:url("../../images/sub/i_pdf.png") no-repeat 0 0; padding-left:3rem;} .file_size {color:#898989; margin-left:1.0rem;} /* 추가 */ /* board 상세 prev,next */ .prevNext {margin-top:1.5rem; border-top:0.1rem solid #aeaeae;} .prevNext li {position:relative; padding-left:14.0rem; border-bottom:0.1rem solid #d7d7d7; height:5rem; line-height:5rem; cursor:pointer;} .prevNext li:last-child {border-color:#d7d7d7;} .prevNext strong {position:absolute; left:0; top:0; bottom:0; width:14.0rem; background:#f5f6ff; text-align:center; font-weight:400;} .prevNext i {display:inline-block; margin-left:1.5rem; width:1.3rem; height:0.9rem; vertical-align:middle;} .prevNext .i_prev {background:url("../../images/sub/i_prev.png") no-repeat;} .prevNext .i_next {background:url("../../images/sub/i_next.png") no-repeat;} .prevNext a {display:block; width:100%;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .prevNext li span {padding-left:20px;} /* board page */ .paging_wrap {position:relative; margin-top:5rem;} .paging_wrap:after {content:""; display:block; height:0; font-size:0; visibility:hidden; clear:both;} .paging {text-align:center; font-size:0;} .paging a {display:inline-block; min-width:40px; height:40px; line-height:40px; color:#3d3d3d; font-size:1.3rem; background-color:#fff; border:1px solid #dedede; vertical-align:middle; margin-left:3px;} .paging a:hover {background-color:#003DA5; color:#fff;} .paging strong {position:relative; display:inline-block; min-width:40px; height:40px; line-height:40px; color:#ffffff; font-size:12px; background-color:#003DA5; border:1px solid #dedede; margin-left:-1px; vertical-align:middle;} .paging a.btn_page {text-indent:-9999em; font-size:0; background-repeat:no-repeat;} .paging a.btn_page::after {display:none;} .paging a.first {background-image:url("../../images/sub/btn_pageFirst.png"); margin-right:4px; background-position:center;} .paging a.prev {background-image:url("../../images/sub/btn_pagePrev.png"); margin-right:15px; background-position:center;} .paging a.next {background-image:url("../../images/sub/btn_pageNext.png"); margin-left:15px; background-position:center;} .paging a.last {background-image:url("../../images/sub/btn_pageLast.png"); margin-left:4px; background-position:center;} /* board 상세 */ table.table_view {border-top:1px solid #2052a6;} table.table_view thead {background-color:#f9f9f9; border-bottom:1px solid #d7d7d7; height:45px;} table.table_view thead th {text-align:center; font-weight:600;} table.table_view tbody {height:45px;} table.table_view tbody th {background-color:#f8f8f8; position:relative; text-align:left; border-bottom:1px solid #d7d7d7; font-weight:600; line-height:45px; padding-left:30px;} table.table_view tbody th span.th_check {position:absolute; right:30px;} table.table_view tbody th.line_inh {line-height:inherit !important; padding-top:10px; padding-bottom:10px;} table.table_view tbody td {position:relative; text-align:center; border-bottom:1px solid #d7d7d7; font-weight:400; padding-top:8px; padding-bottom:8px; line-height:normal;} table.table_view tbody td a:hover {color:#4b5fff;} table.table_view tbody td span.re_num {position:absolute; top:0; right:0; color:#4b5fff; font-weight:700;} table.table_view tbody td.bd_text a {text-overflow:ellipsis; word-wrap:break-word; display:-webkit-box; overflow:hidden; -webkit-line-clamp:1; -webkit-box-orient:vertical; padding-left:10px; width:calc(100% - 30px);} table.table_view tbody tr.fix_notice th {color:#4b5fff; font-weight:700;} table.table_view tbody tr.fix_notice td {color:#4b5fff; font-weight:700;} table.table_view tbody td.bd_text.reply {background:url("../../images/sub/i_reply.png") no-repeat 15px center; padding-left:40px;} table.table_view tbody td ul.file_view li {margin-bottom:5px;} table.table_view tbody td ul.file_view li:last-child {margin-bottom:0px;} table.table_view tbody td ul.file_view li a.i_pdf {background:url("../../images/sub/i_pdf.png") no-repeat 0 0; padding-left:3rem;} table.table_view tbody td ul.file_view li a.i_hwp {background:url("../../images/sub/i_hwp.png") no-repeat 0 0; padding-left:3rem;} table.table_view tbody td input.t_view {display:inline-block; border:1px solid #d1d1d1; height:32px; font-size:1.4rem; margin-right:5px; padding-left:7px; padding-right:7px; vertical-align:middle;} table.table_view tbody td input.t_view:last-child {margin-right:0px;} table.table_view tbody td input.t_view:focus {outline:none;} table.table_view tbody td select.t_view {display:inline-block; border:1px solid #d1d1d1; height:32px; font-size:1.4rem; margin-right:5px; padding-left:7px; padding-right:7px; vertical-align:middle;} table.table_view tbody td select.t_view:last-child {margin-right:0px;} table.table_view tbody td select.t_view:focus {outline:none;} table.table_view tbody td select.t_view:disabled {background-color:#f3f3f3;} table.table_view tbody td textarea.t_con {border:1px solid #d1d1d1; width:100%; height:150px; font-size:1.4rem; margin-right:5px; padding-left:7px; padding-right:7px; margin-bottom:5px; resize:none;} table.table_view tbody td textarea.t_con:focus {outline:none;} table.table_view tbody td textarea.t_con2 {border:1px solid #d1d1d1; width:100%; min-height:100px; font-size:1.4rem; margin-right:5px; padding-left:7px; padding-right:7px; resize:none;} table.table_view tbody td textarea.t_con2:focus {outline:none;} table.table_view tbody td input.date {width:120px; background:#ffffff url("../../images/sub/i_date.png") no-repeat 95px center; border:1px solid #d1d1d1; height:34px; padding-right:30px; font-size:1.4rem; padding-left:7px;} table.table_view tbody td input.date:focus {outline:none;} table.table_view tbody td input.date::placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td input.date::-webkit-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td input.date::-ms-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td input.date::-mos-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td .filebox {position:relative; display:inline-block;} table.table_view tbody td .filebox label {display:inline-block; width:80px; height:34px; line-height:32px; text-align:center; color:#ffffff; vertical-align:middle; background-color:#787878; cursor:pointer; margin-bottom:10px; font-size:1.4rem;} table.table_view tbody td .filebox input[type="file"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;} table.table_view tbody td .filebox input.upload-name {position:absolute; left:calc(100% + 0px); display:inline-block; border:1px solid #d1d1d1; height:34px; vertical-align:middle; padding-left:7px;} table.table_view tbody td input::placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td input::-webkit-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td input::-ms-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td input::-mos-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} table.table_view tbody td span.check_form {width:17rem; line-height:4.9rem; border-radius:50px; border:1px solid #d1d1d1;} table.border_none {border-top:none;} table.border_none tbody td {border-bottom:none;} table.border_line thead th {border-right:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7;} table.border_line thead th:last-child {border-right:none;} table.border_line tbody td {border-right:1px solid #d7d7d7;} table.border_line tbody td:last-child {border-right:none;} table.table_view tbody th span.th_btn {position:absolute; top:50%; right:50px; transform:translateY(-50%);} table.table_view tbody td span.td_btn {position:absolute; top:50%; right:0px; transform:translate(0%, -50%); -ms-transform:translate(0%, -20%);} table.table_view tbody td .support_area {position:relative; left:0rem; top:-0.2rem; height:4rem; line-height:4rem; width:calc(100% - 30px);} table.table_view tbody td .support_area:after {content:""; display:block; clear:both;} table.table_view tbody td .support_area .field_wrap span {width:180px; font-size:14px; color:#303030; font-weight:200; position:relative; display:inline-block; vertical-align:top; padding-right:0px; float:left; overflow:hidden; margin-right:5px;} table.table_view tbody td .support_area .field_wrap span input.t_view {margin-right:0px;} table.table_view tbody td .support_area .field_wrap span:last-child {color:#303030; font-weight:400;} table.table_view tbody td .support_area .field_wrap span:last-child:after {background:none;} table.table_view tbody td .support_area .field_wrap span:after {content:""; display:block; position:absolute; right:13px; top:1px; width:17px; height:100%; background:url("../../images/sub/navi_arrow.png") no-repeat center 17px;} h4 {position:relative;} h4 span.th_check {position:absolute; top:6px; right:0px; font-size:1.6rem; font-weight:400;} .form_group.title dl.title dt, .form_group.col03 dl dt{width:150px;} .form_group.title dl.title dd, .form_group.col03 dl dd{width:calc(100% - 150px);} /* 컨텐츠용 테이블 */ .tbl_txt {display:table; width:100%; table-layout:fixed; border-top:0.1rem solid #cacaca;} .tbl_txt .tbl_head .tbl_cel {padding:1.0rem 0 1.0rem 0; border-bottom:1px solid #cacaca; text-align:center; background:#f8f8f8; color:#555; font-size:1.5rem; line-height:1.1; font-weight:300; border-right:1px solid #cacaca;} .tbl_txt .tbl_head .tbl_cel:last-child {border-right:none;} .tbl_txt .tbl_body .tbl_cel {padding:1.0rem 0 1.0rem 0; border-bottom:1px solid #cacaca; color:#555; font-size:1.5rem; line-height:1.1; letter-spacing:-0.06em; font-weight:300; text-align:center; border-right:1px solid #cacaca;} .tbl_txt .tbl_body .tbl_cel:last-child {border-right:none;} .tbl_txt .txt_left {text-align:left !important; padding-left:2.0rem !important;} /* content_wrap */ #content .content_wrap {padding-top:10rem;} .content_wrap .m_block {display:inline;} .content_wrap h3.title {font-size:4rem; color:#222; font-weight:700;padding-bottom:2.7rem;} .content_wrap .position_rel {position:relative;} .content_wrap .area_content {font-weight:300; letter-spacing:-0.03em;position:relative;margin-top:6rem; font-size:1.8rem; line-height:1.5;} .content_wrap .area_content::before{content:'';width:0.7rem;height:0.7rem;position: absolute;left:0;top:-6rem;background:#00A1C5;} .content_wrap .area_content::after{content:'';width:calc(100% - 1.5rem);position: absolute;left:1.5rem;top:-5.75rem;background:#616161;height:1px;} .content_wrap .area_content .br {display:block; height:3.3rem;} .content_wrap .area_content h4 {font-size:2.2rem; font-weight:600; color:#333;} .content_wrap .area_content .h4_tit {font-size:1.8rem; font-weight:400; color:#333;} /* 수정 */ .content_wrap .area_content .h4_tit .txt_red{display:inline;} .content_wrap .area_content .h4_tit_i {position:relative; font-size:1.8rem; font-weight:500; margin-left:1.1rem;} .content_wrap .area_content .h4_tit_i::before {content:""; position:absolute; top:1.25rem; left:-1.1rem; width:4px; height:4px; line-height:37px; background:#303030; border-radius:100%;} .content_wrap .area_content .h4_txt li {position:relative; margin-left:1.1rem; color:#555; font-weight:300;} .content_wrap .area_content .h4_txt li.red_mark {margin-left:1.6rem; color:#eb0808;} .content_wrap .area_content .h4_txt li::before {content:"-"; position:absolute; top:0; left:-1.1rem;} .content_wrap .area_content .h4_txt li.red_mark::before {content:"※"; position:absolute; top:0; left:-1.9rem;} .content_wrap .area_content .h4_txt .last_depth li::before {margin-left:1.1rem; content:none !important;} /* content table 210719 */ table.table caption {display:block !important; text-indent:-9999em !important; font-size:0 !important;} table.table thead {background-color:#f8f8f8; border-top:1px solid #cbcbcb; border-bottom:1px solid #cbcbcb; height:45px;} table.table thead th {position:relative; text-align:center; font-weight:600; border-right:1px solid #cbcbcb;} table.table thead th:last-child {border-right:none;} table.table tbody {height:45px;} table.table tbody th {position:relative; text-align:center; border-right:1px solid #cbcbcb; border-bottom:1px solid #cbcbcb; font-weight:400; line-height:45px; padding-left:1rem; padding-right:1rem;} table.table tbody th:last-child {border-right:none;} table.table tbody td {position:relative; text-align:center; border-right:1px solid #cbcbcb; border-bottom:1px solid #cbcbcb; font-weight:400; padding:1rem;line-height:1.3;} table.table tbody td:last-child {border-right:none;} table.table .borderRight { border-right: 1px solid #cbcbcb !important;} /* instagram 210719 */ ul.instar_list {position:relative;} ul.instar_list:after {content:""; display:block; clear:both;} ul.instar_list li {position:relative; float:left; margin-right:20px; margin-bottom:20px; cursor:pointer;} ul.instar_list li:nth-child(4) {margin-right:0;} ul.instar_list li:nth-child(8) {margin-right:0;} ul.instar_list li:nth-child(12) {margin-right:0;} ul.instar_list li img {width:225px; height:225px;} ul.instar_list li a:hover::after {content:"새 창에서 보기"; display:block; text-align:center; position:absolute; overflow:hidden; padding-top:70%; color:#ffffff; right:0; left:0; bottom:0; width:100%; height:100%; background:rgba(0,0,0,0.7) url("../../images/sub/instagram_more.png") no-repeat center 40%; background-size:98px 98px;} /* youtube 210719 */ /*250207 cya*/ .youtube_wrap {position:relative;display:flex;flex-wrap:wrap;gap:3.5rem 2rem;} .youtube_wrap:after {content:""; display:block; clear:both;} .youtube_wrap .youtube_list {position:relative;cursor:pointer;width: calc(33.3333% - 1.4rem);} .youtube_wrap .youtube_list .img {width:100%;display:block;height:31rem;position:relative;overflow:hidden;border: 1px solid #ddd;} .youtube_wrap .youtube_list .img img{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);object-fit:cover;width:100%;min-height:100%;} .youtube_wrap .youtube_list .youtube_title{font-weight:500;font-size:1.9rem;margin-top:1.5rem;color:#333;} .youtube_wrap .youtube_list .img::after {content:"영상 보기"; display:block; text-align:center; position:absolute; overflow:hidden; padding-top:40%; color:#ffffff; right:0; left:0; bottom:0; width:100%; height:100%; background:rgba(0,0,0,0.7) url("../../images/sub/youtube_play.png") no-repeat center 40%; background-size:60px 60px;opacity:0;visibility:hidden;} .youtube_wrap .youtube_list:hover .img::after{opacity:1;visibility:visible;} .lightboxed {cursor:pointer;} div#lightboxed--cache {position:fixed; left:-99999999px;} div#lightboxed--container {display:none; position:fixed; top:0; right:0; bottom:0; left:0; background:#000; background:rgba(0,0,0,0.7); z-index:9001;} div#lightboxed--stage {position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; overflow:hidden;} div#lightboxed--content {position:absolute; top:0; left:0;} div#lightboxed--content .lightboxed--frame {position:absolute; top:0; left:0;} div#lightboxed--content .lightboxed--frame img , div#lightboxed--content .lightboxed--frame iframe {position:absolute; top:50%; left:50%; max-width:100%; max-height:100%; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); border:0;} div#lightboxed--content .lightboxed--frame .lightboxed--caption {position:absolute; bottom:0; right:0; padding:10px; background:#000000; background:rgba(0,0,0,0.9); color:#ffffff !important;} div#lightboxed--thumbs {display:none; position:absolute; bottom:0; left:50%; -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); transform:translateX(-50%);} div#lightboxed--thumbs .lightboxed--thumb {float:left; overflow:hidden; border-radius:2px; cursor:pointer;} div#lightboxed--thumbs .lightboxed--thumb .lightboxed--thumb_border {position:relative; width:100%; height:100%; background:#ffffff; background:rgba(255,255,255,0.4); transition:500ms background;} div#lightboxed--thumbs .lightboxed--thumb.lightboxed--active .lightboxed--thumb_border {background:rgba(255,255,255,0.7); transition:500ms background;} div#lightboxed--thumbs .lightboxed--thumb img {position:absolute; top:50%; left:50%; max-width:100%; max-height:100%; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%);} div#lightboxed--bttn_close {position:absolute; top:10px; right:10px; background:#ffffff; background:rgba(255,255,255,0.6); background-image:url("../../images/sub/controls.png"); background-repeat:no-repeat; background-size:auto 100%; background-position:100%; width:30px; height:30px; border-radius:100%; cursor:pointer;} div#lightboxed--bttn_next {display:none; position:absolute; top:50%; right:10px; background:#ffffff; background:rgba(255,255,255,0.6); background-image:url("../../images/sub/controls.png"); background-repeat:no-repeat; background-size:auto 100%; background-position:50%; width:30px; height:30px; border-radius:100%; cursor:pointer; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%);} div#lightboxed--bttn_prev {display:none; position:absolute; top:50%; left:10px; background:#ffffff; background:rgba(255,255,255,0.6); background-image:url("../../images/sub/controls.png"); background-repeat:no-repeat; background-size:auto 100%; background-position:0%; width:30px; height:30px; border-radius:100%; cursor:pointer; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%);} /* 정보제공용 테이블 */ .tbl_inform {display:table; width:100%; table-layout:fixed; border-top:0.1rem solid #8994fc; margin-bottom:30px;} .tbl_inform .tbl_row {display:table-row} .tbl_inform .tbl_cel {display:table-cell; padding:1.0rem 0 1.0rem 2.0rem; border-bottom:1px solid #cacaca; text-align:left;} .tbl_inform .tbl_cel.th {background:#f5f6ff; font-weight:600;} .tbl_inform .tbl_colgroup_mobile {display:none;} /* 인풋테이블 */ .tbl_input {display:table; width:100%; table-layout:fixed; border-top:0.1rem solid #8994fc; margin-bottom:30px;} .tbl_input .tbl_row {display:table-row; height:4.6rem;} .tbl_input .tbl_cel {display:table-cell; padding:0.8rem 2rem 0.8rem 2.0rem; border-bottom:1px solid #cacaca; text-align:left;} .tbl_input .tbl_cel.th {background:#f5f6ff; font-weight:600;} .tbl_input .tbl_colgroup_mobile {display:none;} .tbl_cel > div > div{white-space: inherit !important;} #middle_content .tbl_cel > .pd_l15.pd_r15{padding-left:0 !important;padding-right:0 !important;} .tbl_input input:disabled {background:#eaeaea; color:#898989;} .tbl_input_txt {display:inline-block; position:relative; width:30%; height:3.5rem; line-height:3.5rem; text-align:left; border:0.1rem solid #cdcdcd; vertical-align:middle; overflow:hidden; background:#fff;} .tbl_input_txt input {position:relative; top:-2px; border:0; width:100%; height:3.5rem; line-height:3.5rem; padding:0 1rem;} .tbl_input_txt input:focus {outline:none;} .tbl_input_txt input::placeholder {color:#787878; opacity:0.8; font-weight:300;} .tbl_input_txt input::-webkit-input-placeholder {color:#787878; opacity:0.8; font-weight:300;} .tbl_input_txt input::-ms-input-placeholder {color:#787878; opacity:0.8; font-weight:300;} .tbl_input_txt input::-mos-input-placeholder {color:#787878; opacity:0.8; font-weight:300;} .tbl_input_select {display:inline-block; position:relative;height:3.5rem; line-height:3.5rem; z-index:1; vertical-align:middle; background:#fff;} .phone_select {display:inline-block; position:relative; width:100px; height:3.5rem; line-height:3.5rem; border:0.1rem solid #cdcdcd; z-index:1; vertical-align:middle; background:#fff;} .phone .tbl_input_txt {width:100px;} .tbl_input_select:before {content:""; position:absolute; top:50%; right:1rem; width:1rem; height:0.6rem; margin-top:-0.3rem; background:url("../../images/sub/bg_arrow02.png") no-repeat 0 0;} .tbl_input_select label {position:absolute; top:0; left:0; z-index:-1; color:#747474; width:100%;} .tbl_input_select select {display:block; width:100%;vertical-align:middle; font-family:inherit;padding:0 2.5rem 0 1rem;height:100%; -webkit-appearance:none; -moz-appearance:none; appearance:none;} .tbl_input_select [name*="email2"]{width:auto !important;} .tbl_caption {font-size:1.3rem; color:#555; font-weight:400; width:100%; margin-bottom:0.5rem;} /* 추가 */ .al_right {text-align:right;} /* 추가 */ /************************************************** 콘텐츠 **************************************************/ /* 회사소개-회사소개 */ .vision_mobile {display:none;} .vision_guide {text-indent:-9999em; font-size:0;} .history {text-align:center;} .history_mobile {display:none;} .history_guide {text-indent:-9999em; font-size:0;} /* .history {overflow:hidden; border:1px solid;} .history li {text-align:center;} .history .year {float:left; display:block; border:1px solid red; width:10rem; height:5rem; vertical-align:middle; clear:both;} .history .content {float:left; display:block; border:1px solid blue; width:50rem; vertical-align:middle;} .history .content li {text-align:left; float:left; width:5.0rem; clear:both;} */ /* CEO인사말-회사소개 */ .hello_tit {font-size:2.8rem; line-height:1.4; font-weight:400; letter-spacing:-0.2rem;} .hello_txt {margin-top:3rem; color:#2a2a2a; font-size:2.6rem; line-height:1.5; letter-spacing:-0.15rem;} .hello_txt strong {display:block; font-weight:400; font-size:2.8rem;} .hello_txt2 {margin-top:4.5rem; color:#2a2a2a; font-size:2.2rem; line-height:1.6; letter-spacing:-0.03em;} .hello_txt2 .br {display:block; height:3.3rem;} .content_wrap .area_content .hello_img {position:absolute; top:0; left:0; width:225px;} .content_wrap .area_content .hello_txt01 {float:right; width:calc(100% - 265px); margin-top:40px;} .content_wrap .area_content .hello_txt01 span.greeting {color:#4669b2; font-size:2.4rem; margin-bottom:1rem;} .content_wrap .area_content .hello_txt02 {padding:70px 0 0 0; background:url("../../images/sub/img_sub01_bg.png") no-repeat right -16px; clear:both; min-height:42rem;} .ceo {display:block; margin-top:1rem; text-align:right; font-size:1.8rem; color:#303030; font-weight:400; margin-right:20px;} .ceo .sign {width:12rem; height:4rem; margin-left:2rem; background:url("../../images/sub/img_sub01_sign.png") no-repeat; background-size:100%; vertical-align:bottom;} /* 부서안내-회사소개 */ .organize {text-align:center;} .organize_mobile {display:none;} ul.organize_guide {position:absolute; text-indent:-9999em; font-size:0;} /* 오시는길 */ .map_area {width:100% !important; background:#f3f3f3;} .way_to_come dl dt {position:relative; float:left; flex-direction: column; box-sizing:border-box; width:20rem; height:auto; margin-left:-1px; background:#f5f6ff; line-height:1.6; font-weight:400;justify-content: center; border-bottom:1px solid #d7d7d7;} .way_to_come dl dt img{margin-bottom:1rem;} .way_to_come dl dd {box-sizing:border-box; height:12rem; line-height:1.6; border-bottom:1px solid #d7d7d7;padding:2rem;width:calc(100% - 20rem);} /* 브로슈어 */ .brochure .title {width:100%; padding:13px 10px 13px 30px; background:#f5f6ff; line-height:1.6; text-align:left; font-weight:400; overflow:hidden;} .brochure .title span {float:left; font-size:2rem; padding:3px 0;} .btn_broch {display:flex; justify-content:space-between; width:220px; float:right;} .btn_broch li a {display:inline-block; width:100px; height:34px; background:#fff; border-radius:10px; padding:4px 10px; letter-spacing:-0.1rem;} .btn_broch .btn_down {border:1px solid #003DA5; color:#003DA5; background:#fff url("../../images/sub/i_btn_down.png") no-repeat 68px center;} .btn_broch .btn_view {border:1px solid #999; color:#333; background:#fff url("../../images/sub/i_btn_view.png") no-repeat 68px center;} .img_brochure {margin:0 auto; display:block; box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.3);} .img_brochure img{width:100% !important; height: auto !important;} /* CI 소개 */ .ci_area {width:100%; background:#fff url("../../images/sub/pattern_ci_area.png"); padding:5rem; display: flex;justify-content: center;} .ci_exp_area {background:#f8f8f8; border:1px solid #e1e3e5; margin:0 auto; padding:5rem; display:flex; align-items: center; justify-content: center;} .pantone {display:flex; justify-content:space-evenly; gap:2rem;} .pantone li {display:block; width:100%; border:1px solid #e1e3e5;} .pantone span {display:block;} .pantone .color {padding:2rem; height:11.5rem; color:#fff; font-size:1.8rem;} .pantone .txt {padding:2rem; font-size:1.8rem; color:#555;} .pantone .blue .color {background:#3a66af;} .pantone .lightblue .color {background:#62adda;} .pantone .gray .color {background:#4f555a;} .pantone .gold .color {background:#bca14e url("../../images/sub/gold.jpg") no-repeat center/cover;} .pantone .silver .color {background:#d4d5d6 url("../../images/sub/silver.jpg") no-repeat center/cover;} /* 인증면허 */ .certi > ul {display:flex; margin-bottom:50px;align-items: center;} .certi ul li.dashed {border-top:1px dashed #ccc; height:2px; width:130px;} .certi ul li.year {background:#5369ae; width:60px; height:60px; border-radius:30px; font-size:2rem; font-weight:600; color:#fff; text-align:center; padding:17px 0;} .certi ul li.item {height:5rem; min-width:130px; padding:0 2rem; text-align:center; background:#fff; border:1px solid #5369ae; border-radius:4px; font-weight:400; display:flex;align-items: center;justify-content: center;} .certi ul li.item_line2 ul {display:flex;} .certi ul li.item_line2 ul + ul{margin-top:2rem;} .certi ul li.item + .item{margin-left:2rem;} /* 차량사업-사업분야 */ .business_guide.bg01 {background:url("../../images/sub/img_business_guide01.png") no-repeat center center; background-size:cover; margin-bottom:3rem; padding:8.0rem 4rem 4.6rem 4rem; font-size:1.8rem; color:#ffffff;} .business_guide.bg02 {background:url("../../images/sub/img_business_guide02.png") no-repeat center center; background-size:cover; margin-bottom:3rem; padding:8.0rem 4rem 4.6rem 4rem; font-size:1.8rem; color:#ffffff;} .business_guide.bg03 {background:url("../../images/sub/img_business_guide03.png") no-repeat center center; background-size:cover; margin-bottom:3rem; padding:8.0rem 4rem 4.6rem 4rem; font-size:1.8rem; color:#ffffff;} .business_guide.bg04 {background:url("../../images/sub/img_business_guide04.png") no-repeat center center; background-size:cover; margin-bottom:3rem; padding:8.0rem 4rem 4.6rem 4rem; font-size:1.8rem; color:#ffffff;} .business_guide.bg05 {background:url("../../images/sub/img_business_guide05.png") no-repeat center center; background-size:cover; margin-bottom:3rem; padding:8.0rem 4rem 4.6rem 4rem; font-size:1.8rem; color:#ffffff;} .i_business01 {background:url("../../images/sub/i_business01.png") no-repeat 0 0; padding:6rem 0 0 0;} .i_business02 {background:url("../../images/sub/i_business02.png") no-repeat 0 0; padding:6rem 0 0 0;} .i_business03 {background:url("../../images/sub/i_business03.png") no-repeat 0 0; padding:7.3rem 0 0 0;} .i_business04 {background:url("../../images/sub/i_business04.png") no-repeat 0 0; padding:7rem 0 0 0;} .i_business05 {background:url("../../images/sub/i_business05.png") no-repeat 0 0; padding:7.3rem 0 0 0;} .content_wrap .area_content .h4_img {display:flex; justify-content:space-between;gap:2.5rem;} .content_wrap .area_content .h4_img.t2 li{flex:auto;} .content_wrap .area_content .h4_img li{flex:1;} .content_wrap .area_content .h4_img li img {border:1px solid #e1e4e6;width:100%;} /* 정보공개제도안내-정보공개 */ .open_guide {background:#f9f9fa url("../../images/sub/i_online_promotion.png") no-repeat 4rem center; margin-bottom:3rem; border:1px solid #e9ecf6; padding:5rem 5rem 5rem 15rem; font-size:1.8rem;} .open_data_down {position:relative; background-color:#f5f6ff; display:flex; justify-content:space-between;padding:2rem 3rem;align-items: center;gap:1.5rem;} .open_data_down ul {display:flex; justify-content:space-between; width:100%;} .open_data_down a {background:#003DA5 url("../../images/sub/i_open_down.png") no-repeat calc(100% - 2.0rem) center; color:#ffffff; font-weight:300; text-align:center; padding:1rem 5rem 1rem 2rem; display:block; border-radius:8px;} .open_data_down .list{display: flex;gap:1rem;align-items: center;justify-content: center;flex-wrap: wrap;} .open_data_down .list br{display: none;} .sc_link {text-decoration:underline;} .openprocess_mobile {display:none;} /* 온라인홍보-알림마당 */ .online_promotion {background:#f9f9fa url("../../images/sub/i_online_promotion.png") no-repeat 4rem center; margin-bottom:3rem; border:1px solid #e9ecf6; padding:4rem 5rem 4rem 15rem; font-size:1.8rem;} /* 알림마당-경영현황홍보 */ .manage_guide {background:#f9f9fa url("../../images/sub/i_online_promotion.png") no-repeat 4rem center; margin-bottom:3rem; border:1px solid #e9ecf6; padding:4rem 5rem 4rem 15rem; font-size:1.8rem;} /* 항목별보고서 */ .report_area {display:flex; justify-content:space-between;} .report_area_mobile {display:none;} .report_area .area_l {float:left; width:31%;} .report_area .area_c {float:left; width:31%;} .report_area .area_r {float:right; width:31%;} .report_area .title {background:#f5f6ff; border-top:1px solid #8994fc; border-bottom:#d6d6d6; font-size:1.8rem; font-weight:400; color:#333; text-align:center; padding:12px 0;} .report_area .content {padding:15px 10px; font-size:1.8rem; font-weight:400; color:#333} .report_area .content ul li {padding:5px 0;} .report_area .content ul li a:hover {color:#003DA5;} .report_area .content ul li ul {margin:6px 0 6px 20px; font-size:1.7rem;} .report_area .content ul li ul li::before {content:"-"; margin-right:6px; color:#898989;} .report_area .content ul li ul li a {color:#898989;} /* 고객지원 */ .voc_guide {background:#f1f3f8 url("../../images/sub/i_voc_guide.png") no-repeat 4rem center; margin-bottom:3rem; border:1px solid #e1e3e5; padding:4rem 5rem 4rem 18rem; font-size:1.8rem; letter-spacing:-0.05em; font-weight:400;} .voc_guide2 {background:#f1f3f8 url("../../images/sub/i_voc_guide.png") no-repeat 4rem center; margin-bottom:3rem; border:1px solid #e1e3e5; padding:5rem 5rem 5rem 18rem; font-size:1.6rem; letter-spacing:-0.05em; font-weight:400;} .btn_voc {margin-top:2.0rem;} .btn_voc ul {display:flex; gap:1rem;} .btn_voc a {display:inline-block; background:#003DA5; color:#fff; font-size:1.7rem; padding:1.1rem 2.5rem; min-width:15rem; border-radius:26px;} .btn_voc a img {display:inline-block; margin-left:2.0rem;} .dash_line {border-bottom:1px dashed #acacac; margin:30px 0;} .agree_area {padding:0 10rem; overflow:hidden;} .agree_area div {float:left; margin-right:10rem; margin-top:0.7rem;} .agree_area ul {display:flex; justify-content:flex-end;gap:1rem;} .agree_area a {display:inline-block; padding:0.7rem; width:150px; text-align:center; font-size:1.6rem;} .agree_area .btn_yes {border-radius:6px; background:#003DA5; color:#fff;} .agree_area .btn_no {border-radius:6px; background:#fff; color:#003DA5; border:1px solid #003DA5;} /* faq */ .faq_wrap {margin:0 auto;border-top:1px solid #4669b2;} .faq_wrap .faq_title {position:relative; margin:0;padding:2rem 5rem 2rem 2rem; font-size:1.7rem !important; font-weight:600 !important; color:#545454 !important; cursor:pointer; border-bottom:1px solid #cacaca;overflow: hidden;} .faq_wrap .faq_title::before {content:""; position:absolute; right:2rem; top:50%; width:1.5rem; height:0.9rem; background:url("../../images/sub/i_arrow_down.png") no-repeat 0 0;transform: translateY(-50%);} .faq_wrap .faq_title.open::before {transform:rotate(180deg);} .faq_wrap .faq_title.open::after {opacity:0;} .faq_wrap .faq_title .faq_q{width:2.5rem;float: left;} .faq_wrap .faq_title .faq_q_txt{display:block;width:calc(100% - 2.5rem);float: left;white-space: initial; line-height: 1.3;} .faq_con {padding:3rem; width:100%; border-bottom:1px solid #cacaca; background:#f8f8f9;} .faq_con:after {content:""; display:block; clear:both;} .faq_con span.faq_a {float:left; font-weight:600; color:#003DA5;width:2.5rem;} .faq_con p.faq_txt {float:left; word-break: keep-all;white-space: inherit !important;width:calc(100% - 2.5rem);font-size:1.7rem;} /* 민원결과조회 본인인증 */ .verification ul {display:flex; gap:3rem;} .verification ul > li{flex:1;flex-shrink: 0;} .verification a {display:block; border:0.1rem solid #e3e3e3;text-align:center; padding:14rem 3rem 3rem 3rem; border-radius:10px;height:100%;} .verification a:hover {border:0.1rem solid #003DA5;} .verification p {color:#333; font-weight:400; margin-bottom:1.6rem;} .verification span { color:#555; font-weight:300; margin-bottom:2rem;min-height:5rem;} .verification .phone {background:url("../../images/sub/i_verification_phone.png") no-repeat center 3rem;} .verification .ipin {background:url("../../images/sub/i_verification_ipin.png") no-repeat center 3rem;} .btn_veri {display:inline-block; background:#003DA5; color:#fff; padding:1.1rem 2.5rem; width:100%; border-radius:26px;} .btn_veri img {display:inline-block; margin-left:2.0rem;} /* 민원결과조회 목록 */ .comp_result {margin:0 auto; margin-bottom:3rem;} .comp_result ul {display:flex; gap:3rem;} .comp_result li{flex:1;} .comp_result a {display:block; border:0.1rem solid #e3e3e3; height:11rem; padding:2.4rem 12rem 2.4rem 2.4rem; border-radius:10px;} .comp_result a:hover {border:0.1rem solid #003DA5;} .comp_result p {font-size:1.8rem; color:#333;} .comp_result span {font-size:2.8rem; color:#666; font-weight:600;} .comp_result .step01 {background:url("../../images/sub/i_comp_result_01.png") no-repeat 90% 50%;} .comp_result .step02 {background:url("../../images/sub/i_comp_result_02.png") no-repeat 90% 50%;} .comp_result .step03 {background:url("../../images/sub/i_comp_result_03.png") no-repeat 90% 50%;} /* 사이버신고센터 */ .btn_txt {border:0.1rem solid #003DA5; color:#003DA5; font-size:1.7rem; font-weight:400; padding:0.8rem 1.4rem; display:inline-block;transition:all .3s;} .btn_txt:hover, .btn_txt:focus{background:#003DA5;color:#fff;} .steps {width:100%; display:flex; justify-content:space-between;} .steps li {font-size:1.5rem; color:#aeaeae; display:inline-block; padding:5rem 0 0 0; position:relative; font-weight:400;} .steps_line {width:45rem; height:4px; background:#e3e3e3; position:absolute; top:20px; left:-400px; z-index:-1;} .steps .step01 {background:url("../../images/sub/i_step01.png") no-repeat 50% 10%;} .steps .step02 {background:url("../../images/sub/i_step02.png") no-repeat 50% 10%;} .steps .step03 {background:url("../../images/sub/i_step03.png") no-repeat 50% 10%;} .steps li{text-align: center;} .steps .on.step01 {background:url("../../images/sub/i_step01_on.png") no-repeat 50% 10%; color:#5369ae; font-weight:600;} .steps .on.step02 {background:url("../../images/sub/i_step02_on.png") no-repeat 50% 10%; color:#5369ae; font-weight:600;} .steps .on.step03 {background:url("../../images/sub/i_step03_on.png") no-repeat 50% 10%; color:#5369ae; font-weight:600;} .steps .on .steps_line {background:#5369ae;} /* 사이버신고센터 - 신고접수방법 */ .way_to_report {background:#f1f3f8; border:1px solid #e8e8e8; padding:0 3.0rem;} .way_to_report li {padding:3.0rem 0; border-bottom:1px dashed #aeaeae; overflow:hidden;} .way_to_report li:last-child {border-bottom:none;} .way_to_report div {font-size:1.5rem; color:#898989; display:inline-block; vertical-align:middle; padding:0 5rem;width:100%;} .way_to_report span {font-size:1.8rem; color:#555; font-weight:400; margin-right:1.5rem;} .way_to_report p {font-size:1.7rem; color:#555; margin-top:0.7rem; font-weight:400;} .way_to_report a {background:#003DA5 url("../../images/sub/i_open_down.png") no-repeat calc(100% - 2.0rem) center; color:#ffffff; font-size:1.7rem; font-weight:300; text-align:left; padding:1rem 5rem 1rem 2rem; display:inline-block; border-radius:8px; vertical-align:middle; float:right; min-width:20rem; margin-top:0.6rem;} .way_to_report .shortcut {background:#003DA5 url("../../images/sub/i_shortcut.png") no-repeat calc(100% - 2.0rem) center;} .way_to_report .paper {background:url("../../images/sub/i_paper.png") no-repeat 1rem 50%;} .way_to_report .email {background:url("../../images/sub/i_email.png") no-repeat 1rem 50%;} .way_to_report .cyber {background:url("../../images/sub/i_cyber.png") no-repeat 1rem 50%;} /* 사전정보공개 */ .tab_type2_mobile {display:none;} .tab_type2 {background:#f8f8f8; border-top:0.1rem solid #e3e3e3; padding:3rem; overflow:hidden; margin-bottom:2rem;} .tab_type2 ul {display:flex;} .tab_type2 ul:last-child {margin-top:-0.1rem;} .tab_type2 .all {float:left; height:10.1rem; width:20% !important;display: flex;align-items: center;justify-content: center;} .tab_type2 .tabs {background:#fff; border:0.1rem solid #e0e0e0; padding:1.1rem 3rem; margin-left:-0.1rem; width:25%; text-align:center; color:#333;display:flex;align-items: center;justify-content: center;} .tab_type2 .tabs:hover {background:#003DA5; color:#fff; font-weight:500;} .tab_type2 .tabs:hover span {color:#d7daf8;} .tab_type2 .tabs.on {background:#003DA5; color:#fff; font-weight:500;} .tab_type2 .tabs.on span {color:#d7daf8;} .tab_type2 .tabs span {color:#898989; margin-left:0.5rem;} /* modal_pop */ .modal_pop {display:none; text-align:left; overflow:auto; position:fixed; z-index:9999; width:100%; height:100%; top:0; left:0; background-color:rgba(0,0,0,0.4);} .modal_content {position:relative; margin:0 auto; padding:0; min-height:calc(100% - 3.5rem); display:flex; align-items:center; height:100%;} .modla_center {width:100%; box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.3);} .modal_header {height:45px; padding:0 0 0 20px; font-size:1rem; background:#657af2; color:#ffffff; line-height:45px;} .modal_header h3 {margin:0 0 0 0; font-size:2.1rem; font-weight:400;} .modal_header:after {content:""; display:block; clear:both;} .close {float:right; width:60px; height:45px; line-height:35px; font-size:5.0rem; color:#ffffff; text-align:center;} .close:hover, .close:focus {color:#fff; text-decoration:none; cursor:pointer;} .modal_body {background-color:#ffffff; /* border:1px solid #4669b2; */ padding:40px; max-height:80vh !important; overflow-y:auto;} a.btnModal {text-decoration:none;} .modal_pop_search {padding-bottom:3px;} .modal_pop_search button.btn-darkblue {top:-1px ! important; right:0px !important} .close_btn_area {padding:20px; background:#fff; text-align:right;} .close_btn_area label {font-size:1.4rem; color:#555; margin-right:20px;} .close_btn_area .modal_close {background:#abb6eb; color:#fff; border:none; padding:0 20px; height:30px; font-size:1.4rem;} /* 조직도 tree */ .group_wrap {position:relative; background-color:#fafafa; border:1px solid #c8c8c8; padding:50px;} .group_tree ul {list-style-type:none; position:relative; padding:0; cursor:default; border-left:1px solid #d6d6d6;} .group_tree ul {margin:0 0 0 20px; display:none;} .group_tree li {position:relative; margin:0 0 0 0px; padding:0px 0 0px 0;} .group_tree ul.depth_wrap li {margin:0 0 0px 20px; padding-top:10px;} .group_tree .depth01 {border:1px solid #567dcd; background-color:#6c8bcd; width:140px; height:40px; line-height:38px; text-align:center; color:#ffffff; font-size:1.4rem;} .group_tree .depth02 {margin-left:0px; border:1px solid #c8c8c8; background:#ffffff url("../../images/sub/i_tree_close.png") no-repeat 20px center; width:140px; height:40px; line-height:38px; color:#686868; padding-left:40px; font-size:1.4rem;} .group_tree .depth03 {margin-left:0px; border:1px solid #c8c8c8; background:#ffffff url("../../images/sub/i_tree_close.png") no-repeat 20px center; width:140px; height:40px; line-height:38px; color:#686868; padding-left:40px; font-size:1.4rem;} .group_tree .expander {background:#ffffff url("../../images/sub/i_tree_add.png") no-repeat 20px center; cursor:pointer;} .group_tree .expander.expanded {background:#ffffff url("../../images/sub/i_tree_close.png") no-repeat 20px center;} .group_tree ul.expanded {display:block;} .group_tree ul.depth_wrap li:before {position:absolute; top:30px; left:-20px; height:1px; width:20px; border-top:1px solid #d6d6d6; content:"";} .group_tree ul.depth_wrap li:last-child:after {position:absolute; top:31px; left:-23px; bottom:0; width:7px; background-color:#fafafa; content:"";} ul.job_posting {display:flex; justify-content:space-between; flex-wrap:wrap;} ul.job_posting li {width:305px; height:240px; background-color:#ffffff; border:1px solid #e9e9e9; margin-bottom:20px; padding:30px 25px 30px 25px; box-shadow:2px 5px 10px 0px rgba(0,0,0,0.1); -webkit-box-shadow:2px 5px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow:2px 5px 10px 0px rgba(0,0,0,0.1); cursor:pointer;} ul.job_posting li:hover {border:1px solid #4669b2;} ul.job_posting li .job_title {position:relative; border-bottom:1px solid #d6d6d6; height:98px;} ul.job_posting li .job_title .process_sort {font-weight:500; color:#1c1c1c; margin-bottom:10px;} ul.job_posting li .job_title span.process_acc {position:absolute; top:0; right:0; color:#ffffff; border-radius:100px; background-color:#fda729; min-width:74px; padding:0.2rem 1.5rem 0.2rem 1.5rem; font-size:1.3rem; text-align:center;} ul.job_posting li .job_title span.process_end {position:absolute; top:0; right:0; color:#ffffff; border-radius:100px; background-color:#9a9a9a; min-width:74px; padding:0.2rem 1.5rem 0.2rem 1.5rem; font-size:1.3rem; text-align:center;} ul.job_posting li .job_title .process_con {font-weight:400; color:#1c1c1c; white-space:normal; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:42px; overflow:hidden; text-overflow:ellipsis;} ul.job_posting li .job_day {position:relative; margin-top:25px;} ul.job_posting li .job_day span.process_dday {text-align:center; border:1px solid #003DA5; color:#003DA5; width:65px; height:25px; line-height:23px; margin-right:25px;} ul.job_posting li .job_day span.process_date {letter-spacing:0;} ul.job_posting li .job_day .process_group {margin-top:15px;} .search_area {position:relative; margin-bottom:3rem; padding:2rem 1rem; background:#f5f6ff;text-align: center;} .search_area button {margin-left:5px;} .search_area button:first-child {margin-left:0px;} .search_form {position:relative;} .search_col {width:100%;} .search_col::after {content:""; display:table; clear:both;} .search_col .form_input {width:100%; margin-right:10px; padding:0.5rem 0 0.5rem 0;} .search_col .form_input:nth-child(3) {width:280px; margin-right:0px;} .search_col .form_input label {width:80px; font-size:1.4rem; font-weight:600; padding-left:20px;} .search_col .form_input input {position:relative;top:1px;max-width:calc(100% - 85px);border:1px solid #d1d1d1;height:40px;padding-left:10px;padding-right:10px;font-size:1.4rem;} .search_col .form_input input.date {width:125px; background:#ffffff url("../../images/sub/i_date.png") no-repeat 100px center; padding-right:30px; font-size:1.4rem;} .search_col .form_input span {margin-left:3px; margin-right:3px;} .search_col .form_input input::placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} .search_col .form_input input::-webkit-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} .search_col .form_input input::-ms-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} .search_col .form_input input::-mos-input-placeholder {color:#787878; opacity:0.8; font-weight:300; font-size:1.4rem;} .search_col .form_input input:focus {outline:none;} .search_col .form_input select {max-width:calc(100% - 85px); border:1px solid #d1d1d1; height:40px; padding-left:5px; padding-right:5px; font-size:1.4rem;} .search_col .form_input select:focus {outline:none;} .search_btn {position:absolute; bottom:7px; right:20px; width:160px; text-align:right;} /* 2021.12.30 인권경영 추가 */ .human_mng {display:inline-block; width:100%; background-color:#ffffff; border:4px solid #4669b2; border-image:linear-gradient(to right, #4669b2, #3cbddc, #4b5fff); border-image-width:4px; border-image-slice:1; text-align:center; padding:80px 50px 80px 50px;} .human_mng {background-color:#ffffff; background-image:url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 10h10v10H0V10zM10 0h10v10H10V0z' fill='%23edeff7' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");} .human_mng p.mng_title {font-size:4rem; font-weight:700; margin-bottom:60px; color:#4669b2;} .human_mng p.mng_txt01 {font-size:2rem; font-weight:700; margin-bottom:50px; text-align:left;} .human_mng p.mng_txt01 span.col_b {color:#5f6ee8; display:revert;} .human_mng ul.mng_list {margin-bottom:20px;} .human_mng ul.mng_list li {font-size:2rem; position:relative; padding-left:55px; text-align:left; margin-bottom:15px; font-weight:500;} .human_mng ul.mng_list li::before {content:"하나,"; display:block; position:absolute; left:0px; font-weight:600; color:#003DA5;} .human_mng p.mng_txt02 {font-size:2rem; font-weight:700; margin-top:60px; margin-bottom:60px; text-align:left;} .human_mng p.mng_sign {font-size:2.4rem; font-weight:700;} /* 애니메이션 규칙 */ @-webkit-keyframes starlite { 0% {background:powderblue; height:4px; width:4px; box-shadow:0px 0px 10px white;} 10% {background:#b0e5de;} 20% {background:#b0e5cc;} 30% {background:#cce5b0;} 40% {background:#dae5b0;} 50% {background:#e5ddb0; width:6px; height:6px; box-shadow:0px 0px 10px #d3bd3d;} 100% {width:4px; height:4px; background:powderblue; box-shadow:0px 0px 10px white;} } @keyframes starlite { from {background:powderblue; height:4px; width:4px; box-shadow:0px 0px 10px white;} 10% {background:#b0e5de;} 20% {background:#b0e5cc;} 30% {background:#cce5b0;} 40% {background:#dae5b0;} 50% {background:#e5ddb0; width:6px; height:6px; box-shadow:0px 0px 10px #d3bd3d;} 100% {width:4px; height:4px; background:powderblue; box-shadow:0px 0px 10px white;} } .lite.pulse {animation:lite 2s infinite;} @-webkit-keyframes lite { 0% {background:#45c1eb; height:4px; width:4px; box-shadow:0px 0px 10px white;} 10% {background:#28a2df;} 20% {background:#2a96cb;} 30% {background:#1f69af;} 40% {background:#2a96cb;} 50% {background:#28a2df; width:6px; height:6px; box-shadow:0px 0px 10px #0f5ca0;} 100% {width:4px; height:4px; background:#45c1eb; box-shadow:0px 0px 10px white;} } @keyframes lite { from {background:#45c1eb; height:4px; width:4px; box-shadow:0px 0px 10px white;} 10% {background:#28a2df;} 20% {background:#2a96cb;} 30% {background:#1f69af;} 40% {background:#2a96cb;} 50% {background:#28a2df; width:6px; height:6px; box-shadow:0px 0px 10px #0f5ca0;} 100% {width:4px; height:4px; background:#45c1eb; box-shadow:0px 0px 10px white;} } .night {position:relative;width:100%;height:100%;-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg);} @-webkit-keyframes particleAnimation{ from {-webkit-transform:translateX(0);opactiy:1;} to {-webkit-transform:translateX(100vw);opactiy:0;} } @keyframes particleAnimation{ from {transform:translateX(0); opacity:1;} to {transform:translateX(100vw); opacity:0;} } @keyframes spinRight { 0% {-webkit-transform:rotate(0deg); transform:rotate(0deg); transform-origin:center;} 100% {-webkit-transform:rotate(360deg); transform:rotate(360deg); transform-origin:center;} } @keyframes spinLeft { 0% {-webkit-transform:rotate(0deg); transform:rotate(0deg); transform-origin:center;} 100% {-webkit-transform:rotate(-360deg); transform:rotate(-360deg); transform-origin:center;} } @keyframes twinkle { 0% {-webkit-transform:rotate(0deg); transform:rotate(0deg); transform-origin:center;} 100% {-webkit-transform:rotate(360deg); transform:rotate(360deg); transform-origin:center;} } @keyframes twinkle { 0% {-webkit-transform:rotate(0deg); transform:rotate(0deg); transform-origin:center;} 100% {-webkit-transform:rotate(-360deg); transform:rotate(-360deg); transform-origin:center;} } .img_sky {position:absolute; bottom:0; left:-6%; animation:sky 20s linear forwards; -webkit-animation:sky 20s linear forwards; z-index:1;} .img_sky img {width:100%;} @-webkit-keyframes sky{ 0% {transform:translate(0,55%); opacity:0.6;} 50% {transform:translate(-12%,40%);} 100% {transform:translate(-25%,31%); opacity:0.8;} } @keyframes sky{ 0% {transform:translate(0%,55%); opacity:0.6;} 50% {transform:translate(-12%,40%);} 100% {transform:translate(-25%,31%); opacity:0.8;} } @keyframes mainZoom1 { 0% {transform:scale(1.1,1.1);} 100% {transform:scale(1.3,1.3);} } @-webkit-keyframes mainZoom1 { 0% {-webkit-transform:scale(1.1,1.1);} 100% {-webkit-transform:scale(1.3,1.3);} } .gallery{display:flex;width:100%;gap:1.5rem 3.4rem;margin:3rem 0 4rem;} .gallery > li{flex:1;} .gallery > li .thumb{height:22rem;display:block;position:relative;border-radius:1rem;overflow:hidden;border:1px solid #EEEEEE;margin-bottom:1rem;} .gallery > li .thumb img{object-fit:cover;position:absolute;top:50%;left:50%;height:100%;width:100%;transform:translate(-50%, -50%);} .gallery > li .desc > .title{font-size:2rem;text-overflow: ellipsis;display:-webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;height:5.2rem;overflow:hidden;font-weight:600;line-height:1.3;word-break: break-all;} .gallery > li .desc .title + .date{display:block;margin-top:1rem;} .gallery > li .desc .date{color:#111;font-size:1.5rem;} .gallery > li .desc .date .label{color:#707070;margin-right:.75rem;font-weight:400;} .gallery > li .desc .date .label:after{height:1rem;background:#ddd;width:1px;display:inline-block;content:'';margin-left:0.75rem} /* ceo 인사말 20241230 수정 */ .ceo_cont >*{margin-top: 2rem; color: #333; font-size: 1.8rem; font-weight: 400; line-height: 1.5;} .ceo_cont >.t{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; margin-top: 0; border: 1px solid #E0E0E0; border-top: 5px solid #003DA5; background: #fff url(../../images/sub/ceo_img03.png) no-repeat right bottom / 39.3rem auto;} .ceo_cont >.t >.imgs{overflow: hidden; display: block; position: relative; width: 30.4rem; height: 34rem;} .ceo_cont >.t >.imgs >img{ position: absolute; top: 50%; left: 50%; width: auto; min-width: 100%; max-width: none; height: 100%; -webkit-transform: translate(calc(-50%),calc(-50%)); transform: translate(calc(-50%),calc(-50%)); } .ceo_cont >.t >.txts{display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: center; align-items: center; width: calc(100% - 30.4rem); padding: 2.5rem 4.6rem;} .ceo_cont >.t >.txts >*{display: block; width: 100%; margin-top: 2rem; color: #333; font-size: 1.8rem; font-weight: 500; line-height: 1.5;} .ceo_cont >.t >.txts >*:first-child{margin-top: 0;} .ceo_cont >.t >.txts >strong{display: block; width: 100%; color: #003DA5; font-size: 2.4rem; font-weight: 700; line-height: 1.5;} .ceo_cont >.t + p{margin-top: 4rem;} .ceo_cont >.sign{display: block; text-align: right;} .ceo_cont >.sign >img{display: block; margin: 1rem 0 0 auto;} /* sns 바로가기 20241230 추가 */ .sns_cont{display: block; position: relative; padding: 9.5rem 8rem; background: url(../../images/sub/snscont_img01.png) no-repeat center center/ cover;} .sns_cont:before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: linear-gradient(259deg, rgba(0, 0, 0, 0.00) 3.64%, rgba(0, 0, 0, 0.85) 54.56%);} .sns_cont .txts{position: relative; z-index: 1;} .sns_cont .txts >strong{display: block; color: #fff; font-size: 3.6rem; font-weight: 700; line-height: 1.2;} .sns_cont .txts >ul{margin-top: 4.8rem;} .sns_cont .txts >ul >li:not(:first-child){margin-top: 1.4rem;} .sns_cont .txts >ul >li >a{display: inline-flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; position: relative; color: #fff; font-size: 2rem; font-weight: 500; line-height: 1.2;} .sns_cont .txts >ul >li >a:hover{text-decoration: underline; text-underline-position: under;} .sns_cont .txts >ul >li >a:before{content: ""; display: block; width: 4rem; height: 4rem; margin-right: 0.8rem; background-repeat: no-repeat; background-position: center center; background-size: 100% auto;} .sns_cont .txts >ul >li.y >a:before{background-image: url(../../images/sub/snscont_img02.png);} .sns_cont .txts >ul >li.b >a:before{background-image: url(../../images/sub/snscont_img03.png);} .sns_cont .txts >ul >li.i >a:before{background-image: url(../../images/sub/snscont_img04.png);} .sns_cont .txts >ul >li >a:after{content: ""; display: block; width: 2rem; height: 2rem; margin-left: 0.4rem; background: url(../../images/sub/snscont_img05.png) no-repeat center center/ 100% auto;} /*경영전략체계*/ .diagram{padding-top:2rem;} .diagram > div{display: flex;flex-direction: column;align-items: center;position:relative;padding-bottom:5.2rem;} .diagram > div + div{margin-top:1.2rem;} .diagram > div:after{content: '';position: absolute;bottom:0;left: 50%; transform: translateX(-50%);width: 64rem;height: 3.8rem;background: linear-gradient(180deg, #EEE -34.21%, #FFF 100%);clip-path: polygon(50% 0%, 0% 100%, 100% 100%);} .diagram > div:last-child{padding-bottom:0;} .diagram > div:last-child:after{display: none;} .diagram .label{width:17.2rem;flex-shrink: 0;text-align: center;background:#003DA5;color:#fff;font-size:1.8rem;font-weight:700;display: flex;align-items: center;justify-content: center;padding:0.6rem 0;border-radius:5rem;margin-bottom:1.2rem;} .diagram div:nth-child(2) .label{background:#3A66AF;} .diagram div:nth-child(3) .label{background:#62ADDA;} .diagram div:nth-child(4) .label{background:#1083B4;} .diagram div:nth-child(5) .label{background:#234E97;} .diagram div:nth-child(6) .label{background:#2B4256;} .diagram div:nth-child(7) .label{background:#4F555A;} .diagram > div:nth-child(-n+2) .label{position:absolute;top:-2rem;margin-bottom:0;} .diagram > div:nth-child(2){margin-top:3.2rem;} .diagram .cont{text-align: center;width:100%;} .diagram .border_box{border: 1px solid #E0E0E0;} .diagram .point1{display: block;padding:4rem 1rem;color: #003DA5;font-size:2.4rem;font-weight:700;text-align: center;} .diagram .point2{display: block;padding:4rem 1rem;color: #222;font-size:2.4rem;font-weight:600;text-align: center;} .diagram .flex_list{display: flex;gap:1.2rem;} .diagram .flex_list > *{flex:1;border:1px solid #E0E0E0;padding:2.8rem 1rem;} .diagram .box1 span{display: block;color: #757575;font-size:1.8rem;font-weight:500;} .diagram .box1 p{color: #222;font-size:1.8rem;font-weight:500;} .diagram .box1 p b{font-size:5.2rem;font-weight:700;line-height:1.3;} .diagram .box2 li{display: flex;align-items: center;justify-content: center;flex-direction: column;} .diagram .box2 li i{display: flex;justify-content: center;margin-bottom:1.5rem;} .diagram .box2 li span{color: #424242;font-size:1.8rem;font-weight:500;display: block;} .diagram .box3 li{color: #234E97;font-size:2.4rem;font-weight:500;} .diagram .box4 li{color: #222;font-size:2.2rem;font-weight:500;} .diagram .box5{display: grid;grid-template-columns: repeat(4, 1fr);font-weight:500;} .diagram .box5 em{display: block;font-family: 'NotoSansKR';margin-bottom:1rem;} .prepare_page{background:#F9F9FA;text-align: center;padding:8rem 2rem;font-size:2rem;} .prepare_page i{background:#00A1C5;width:18rem;height:18rem;border-radius:50%;text-align: center;line-height:18rem;display:inline-flex;align-items: center;justify-content: center;margin-bottom:3.2rem;} .openprocess_pc{display: block;width:100%;margin-bottom:3rem;} select[name="complaintType"]{height:3.5rem;} /*egs전략체계*/ .diagram .color1, .diagram .color1 li{color:#278A2A;} .diagram .color2, .diagram .color2 li{color:#234E97;} .diagram .color3, .diagram .color3 li{color:#F37243;} .diagram .box2 li > b{font-size:2.4rem;font-weight:700;display:block;margin-bottom: 0.4rem;} .diagram .box3 > li ul{display:flex;justify-content: center;align-items: center;} .diagram .box3 > li ul li{flex:1;font-size:2rem;position: relative;} .diagram .box3 > li ul li + li::before{content:'';width:1px;height:100%;display: inline-block;background:#e0e0e0;position:absolute;left:0;}