@charset "utf-8"; /* CSS Document */ :root{ --color_dblue:#003974; --color_lblue:#00aeef; --color_redu_btn:#ee2d29} body{ font-size:16px} .box0{ padding:0 6%} .box1{ width:1300px; margin:0 auto; max-width:95%} .box1.acn{ width:1300px; margin:0 auto; max-width:95%} .box2{ width:1600px; margin:0 auto; max-width:95%} .box3{ width: 1400px; margin: 0 auto; max-width: 95%;} .PC{ display:block !important} .PHONE{ display:none !important} .gnb li.m_hide{ display:none} .gnb .layer{ display:none !important;} .sns_st{ gap:.5em;} .sns_st > li .in{ width:2.5em; height:2.5em; background:#fff; border-radius:50%; color:#000; transition:.3s;} .sns_st > li .in .tt{ display:none;} .sns_st > li .in:hover{ background:#49b7be; color:#fff;} .cw > .sns_st > li .in{ background:transparent; color:#fff;} .cw > .sns_st > li .in:hover{ background:#fff; color:#000;} .fullH{ height:calc(100vh); box-sizing:border-box;} .fullMH{ min-height:calc(100vh) !important; box-sizing:border-box;} .filW{ filter:brightness(0) invert(1);}/*화이트*/ .filB{ filter:brightness(0) invert(0);}/*블랙*/ .filRE{ filter:invert(1);}/*색상반전*/ /*스크롤 페이지*/ .scrollMg{ scroll-margin-top: 13em; scroll-snap-stop: always; scroll-behavior: smooth;} /*header*/ .headT{ padding-top:6.5em;} .headH, #header .gnb_wrap .gnb > li, #header .gnb_wrap .gnb > li .dp1{ height:6.5em; transition: height .2s, background .2s, padding .35s ease; box-sizing:border-box;} #header{ z-index:999; position:fixed; top:0; left:0; width:100%; background: #fff; border-bottom: 1px solid #eee;} #header:before {content: ''; position: absolute; top: calc(6.5em - 2px); left: 0; width: 100%; height: 1px; background: #ddd; opacity: 0; transition: .2s;} #header.gnbOpen:before{ top: calc(6.5em - 2px);} #header.gnbOpen:before {opacity: 1;} .active#header:before {top: calc(5em - 2px);} .fp-viewing-0 #header:before{ top: calc(7em - 2px);} .main #header .inner{ color:111;} .main #header .logo, .main #header .all_wrap .all_btn{ /* filter:brightness(0) invert(1); */} /* #header .logo, #header .side_wrap{ width:12em;} */ #header .logo{ width:13em;} #header .side_wrap{ width:auto;} #header .logo{ margin:auto 0;} #header .logo > .in img{ width:100%; margin:auto 0; transition:.2s; transform-origin:left center;} #header .gnb_wrap .gnb > li{ overflow:hidden;} #header .gnb_wrap .gnb > li .dp1{ position:relative; padding:0 2em;} #header .gnb_wrap .gnb > li .dp1 .tt{ font-size:1.25em; font-weight:500; text-transform:uppercase;} #header .gnb_wrap .gnb > li .dp1:after{ content:""; display:block; position:absolute; left:0; bottom:0; width:100%; height:3px; background:#042d5c; opacity:0; transform:scaleX(0); transition:transform .3s;} #header .gnb_wrap .gnb > li.act .dp1:after, #header .gnb_wrap .gnb > li.on .dp1:after{ opacity:1; transform:scaleX(.7);} #header .gnb_wrap .gnb > li .dp2{ display:block; max-width:18em; margin:0 auto; transition:.2s; padding: 1.5em 0;} #header .gnb_wrap .gnb > li .dp2 > li > a{ display:block; padding:.5em .5em; font-weight:300;} #header .gnb_wrap .gnb > li .dp2 > li > a .tt{ font-size:1em;} #header .gnb_wrap .gnb > li .dp3{ display:none;} #header .gnb_wrap .gnb > li.act{ background:#f7f8ff;} #header .gnb_wrap .gnb > li.act .dp1:after, #header .gnb_wrap .gnb > li.on .dp1:after{ opacity:1;} #header .gnb_wrap .gnb > li .dp2 > li.act > a, #header .gnb_wrap .gnb > li .dp2 > li.on > a{ font-weight:400;} #header .side_wrap{ gap:0 2em;} #header .side_wrap .mem{} #header .side_wrap .mem > li{} #header .side_wrap .mem > li .in{ gap:0 .5em; padding:.5em 1em;} #header .side_wrap .mem > li .in:hover .tt{ text-decoration:underline;} #header .all_wrap{ color:#000;} #header .all_wrap .all{ width:2.5em;} #header .all_wrap .all_btn{ position:relative; display:block; width:1.8em; height:1.35em; margin-left:auto;} #header .all_wrap .all_btn .ham, #header .all_wrap .all_btn .ham:before, #header .all_wrap .all_btn .ham:after {display:block; width:100%; height: 2px;background:#000;transition:.2s, background 0s;} #header .all_wrap .all_btn .ham:before, #header .all_wrap .all_btn .ham:after { content:""; position:absolute; right:0;} #header .all_wrap .all_btn .ham:before{ top:calc(50% - 1px); width:100%;} #header .all_wrap .all_btn .ham:after { top:calc(100% - 2px); width:100%;} #header .all_wrap .all_btn:hover .ham:before{ width:70%;} #header .all_wrap .all_btn:hover .ham:after { width:80%;} #header .all_wrap .all_layer { position:fixed; top:0; left:0; width:100%; height:100vh; opacity:0; visibility:hidden; pointer-events:none; overflow: hidden;} #header .all_wrap .all_layer .all_shape{ position:fixed; bottom:-7em; right:-2vw; width:25vw; opacity:.15;} #header .all_wrap .all_layer .all_shape img{ width:100%;} #header .all_wrap .all_layer .all_inner{ width:100%; height: 100vh; /* min-height:100%; */ overflow:hidden; color:#fff; position: relative;} #header .all_wrap .all_layer .all_inner:before {content: ''; position: absolute; width: 5vw; height: 5vw; transform: scale(0); right: 4vw; top: 2em; border-radius: 50%; background: #04182e; transition: .8s; z-index: -1;} #header .all_wrap .all_layer .all_inner > .wrap_bg{ width:40%; padding:16vh 4vw 3em; opacity: 0; transition: .3s;} #header .all_wrap .all_layer .all_inner > .wrap_in{ flex:1; padding:16vh 2vw 3em; overflow:hidden;} #header .all_wrap .all_layer .all_inner > .wrap_bg .cs{ padding-top:2em; font-size:1.188em;} #header .all_wrap .all_layer .wrap_middle{ padding-bottom:3em; opacity:0; transform:translateY(2em);} #header .all_wrap .all_layer .wrap_middle .gnb{ display:block;} #header .all_wrap .all_layer .wrap_middle .gnb li a{ position:relative;} #header .all_wrap .all_layer .wrap_middle .gnb > li + li{ margin-top:4em;} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp1{ display:inline-block; text-align:left !important;} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .tt{ font-size:2.000em;} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2{ margin-top:1.5em; align-items:center;} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li:not(:last-child) > a:after{ content:""; margin:0 1.5em; width:1px; height:1em; background:rgba(255,255,255,.4);} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .in{} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .tt{ font-size:1.063em;} #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li.act > a .tt{ text-decoration:underline;} .allGnbOn{ overflow-y:hidden} .allGnbOn body{ overflow-y:scroll} .allGnbOn #header .all_wrap .all_layer .all_inner:before {transform: scale(100);} .allGnbOn #header .logo{ width: 15em; z-index:100; position:fixed; top:0; left:4vw; filter:brightness(0) invert(1) !important;} .allGnbOn #header .all_wrap .all_btn{ z-index:9999; position:fixed; top:2em; right:4vw; width:3.5em; height:3.5em; filter:brightness(0) invert(1) !important;} .allGnbOn #header .all_wrap .all_btn .ham{ background:transparent !important; transition:0s;} .allGnbOn #header .all_wrap .all_btn .ham:before, .allGnbOn #header .all_wrap .all_btn .ham:after { width:100% !important; top:50% !important;} .allGnbOn #header .all_wrap .all_btn .ham:before{ transform:rotate(45deg);} .allGnbOn #header .all_wrap .all_btn .ham:after { transform:rotate(-45deg);} .allGnbOn #header .all_wrap .all_layer{ z-index:99; opacity:1; visibility:visible; pointer-events:all} .allGnbOn #header .all_wrap .all_layer .wrap_bg .slogan{ opacity:1; transform:scale(1); transition:1s; transition-delay:.4s;} .allGnbOn #header .all_wrap .all_layer .wrap_middle{ opacity:1; transform:translate(0); transition:1s; transition-delay:.2s;} .allGnbOn #header .all_wrap .all_layer .wrap_bg{ opacity:1;} /* new */ #header .all_wrap{ width:auto; height:100%; } #header .all_wrap .btn_all{ height:100%} #header .all_wrap .btn_all .btn_in{ position:relative; display:block; width:1.75em; height:1.5em;} #header .all_wrap .btn_all .ham, #header .all_wrap .btn_all .ham:before, #header .all_wrap .btn_all .ham:after {display:block; width:100%; height:2px; background:#555; border-radius:1em; transition:.2s;} #header .all_wrap .btn_all .ham:before, #header .all_wrap .btn_all .ham:after { content:""; position:absolute; right:0;} #header .all_wrap .btn_all .ham:before{ top:calc(50% - 2px);} #header .all_wrap .btn_all .ham:after { top:calc(100% - 4px); background:#555;} #header .all_wrap .btn_all .btn_in:hover .ham:before{ width:75%;} #header .all_wrap .btn_all .btn_in:hover .ham:after { width:85%;} #header .all_wrap .all{ position:fixed; top:0; left:0; width:100%; height:100%; opacity:0; visibility:hidden;} #header .all_wrap .all .wrap_bg{ position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.5;} #header .all_wrap .all .wrap_in{ position:absolute; top:0; right:0; width:100%; height:100%; background:#fff; color:#000;} #header .all_wrap .all .wrap_in .scrollst{ height:100%;} #header .all_wrap .all .all_img{ position:relative; width:30%; height:100%;} #header .all_wrap .all .all_img:after{ content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.3;} #header .all_wrap .all .all_img ~ .scrollst{ flex:1;} #header .all_wrap .all .allconWrap{ padding:12vh 4vw;} #header .all_wrap .all .all_top .tit_in{width: 20em; margin-bottom:5em;} #header .all_wrap .all .all_top .tit_in .tt{ font-size:3.000em; color:#222;} #header .all_wrap .all .all_gnb .gnb .flex{ display:block; text-align:left !important;} #header .all_wrap .all .all_gnb .flex .va_wrap{ text-align:left!important} #header .all_wrap .all .all_gnb .gnb > li{ flex:1; padding:1.5em 1em 2.5em 1em;} #header .all_wrap .all .all_gnb .gnb > li ~ li{ border-left:1px solid #e5e5e5;} #header .all_wrap .all .all_gnb .gnb > li a{ padding:.5em 0; transition:.1s;} #header .all_wrap .all .all_gnb .gnb > li .dp1{} #header .all_wrap .all .all_gnb .gnb > li .dp1:before{ content:""; display:inline-block; vertical-align:top; margin-right:.375em; width:.438em; height:.438em; background:#00a3d6; border-radius:50%;} #header .all_wrap .all .all_gnb .gnb > li .dp1 .tt{ font-size:1.375em; font-weight:600;} #header .all_wrap .all .all_gnb .gnb > li .dp2{ padding:2.5em 0 0 .875em;} #header .all_wrap .all .all_gnb .gnb > li .dp2 > li > a{ opacity:.6;} #header .all_wrap .all .all_gnb .gnb > li .dp2 > li > a .tt{ font-size:1.063em;} #header .all_wrap .all .all_gnb .gnb > li:hover .dp1{ color:#006ab5;} #header .all_wrap .all .all_gnb .gnb > li .dp2 > li:hover > a{ opacity:1;} #header .all_wrap .all .all_gnb .gnb > li .dp3{ display:none;} #header.allOpen .all_wrap .btn_all .btn_in{ position:fixed; top:1.5em; right:2em; z-index:999; width:2.5em; height:2.5em; transition:transform .3s;} #header.allOpen .all_wrap .btn_all .ham{ background:transparent !important; transition:0s;} #header.allOpen .all_wrap .btn_all .ham:before, #header.allOpen .all_wrap .btn_all .ham:after { width:100% !important; top:50% !important; background:#000 !important;} #header.allOpen .all_wrap .btn_all .ham:before{ transform:rotate(45deg);} #header.allOpen .all_wrap .btn_all .ham:after { transform:rotate(-45deg);} #header.allOpen .all_wrap .btn_all .btn_in:hover{ transform:rotate(90deg);} #header.allOpen .all_wrap .all{ opacity:1; visibility:visible; transition:.3s;} #header.allOpen .all_wrap .all .all_top, #header.allOpen .all_wrap .all .all_gnb{ animation:txtAni-up 1s both;} #header.allOpen .all_wrap .all .all_top{ animation-delay:.2s;} #header.allOpen .all_wrap .all .all_gnb{ animation-delay:.5s;} /* .gsClass.tShow .el{ overflow:hidden} .gsClass.tShow .el > i{ transform:translateY(-100%); transition:1s} .gsClass.tShow.on .el > i{transform:translateY(0)} .gsClass.imgShow{overflow:hidden; background:rgba(0,0,0,.05);} .gsClass.imgShow .el{ transition:1s;} .gsClass.imgShow.left .el{ transform:translateX(-100%)} .gsClass.imgShow.right .el{ transform:translateX(100%)} .gsClass.imgShow.top .el{ transform:translateY(-100%)} .gsClass.imgShow.bottom .el{ transform:translateY(100%)} .gsClass.imgShow.on .el{transform:translate(0)} .gsClass.listShow .el{ transform:translateY(50%); opacity:0; transition:.3s} .gsClass.listShow.on .el{ transform:translateY(0); opacity:1} .gsClass.listShow.on .el:nth-child(1){ transition-delay:.2s} .gsClass.listShow.on .el:nth-child(2){ transition-delay:.4s} .gsClass.listShow.on .el:nth-child(3){ transition-delay:.6s} .gsClass.listShow.on .el:nth-child(4){ transition-delay:.8s} .gsClass.listShow.on .el:nth-child(5){ transition-delay:1s} .gsClass.listShow.on .el:nth-child(6){ transition-delay:1.2s} .gsClass.listShow.on .el:nth-child(7){ transition-delay:1.4s} .gsClass.listShow.on .el:nth-child(8){ transition-delay:1.6s} .gsClass.listShow.on .el:nth-child(9){ transition-delay:1.8s} .gsClass.listShow.on .el:nth-child(10){ transition-delay:2s} */ .dp1on .gnb .dp2{ display:none!important} .dp2on .gnb > li, .dp2on .gnb > li .dp1, .dp2on .gnb > li .dp3{ display:none!important} .dp2on .gnb > li.on{ display:block!important} .dp3on .gnb > li, .dp3on .gnb > li .dp1, .dp3on .gnb > li .dp2 > li, .dp3on .gnb > li .dp2 > li > a{ display:none!important} .dp3on .gnb > li.on, .dp3on .gnb > li .dp2 > li.on{ display:block!important} #header.active .headH, #header.active .gnb_wrap .gnb > li, #header.active .gnb_wrap .gnb > li .dp1{ height:5em;} #header.active .logo > .in img{ transform:scale(.85,.85);} #header.active .logo{ margin:0;} /* .fp-viewing-0 .headH, .fp-viewing-0 #header .gnb_wrap .gnb > li, .fp-viewing-0 #header .gnb_wrap .gnb > li .dp1{ height:7em;} .fp-viewing-0 #header .logo > .in img{ transform: inherit;} .fp-viewing-0 #header.active .headH{ height: 7em;} */ .wrapHide{ /* height:5em; */} .stickyT{ position:sticky !important; /* top:5em; */} /* .main #header{ display: none;} .fp-viewing-0 #header{ display: block;} */ #header.active{ background:#fff; box-shadow: 3px 0 9px rgba(0,0,0,.15);} #header.active .inner{ color:#000;} #header.active .logo, #header.active .all_wrap .all_btn{ filter:none;} #header.active .gnb_wrap .gnb > li.act .dp1, #header.active .gnb_wrap .gnb > li.on .dp1{ color:#042d5c;} #header.gnbOpen{ box-shadow:0 4px 1em rgba(0,0,0,.15); background: #fff;} #header.gnbOpen:before{ /* background:#8198c9; */ opacity:.6;} #header.gnbOpen .gnb_wrap .gnb > li{ height:auto;} #header.gnbOpen .gnb_wrap .gnb .dp2{ /*padding:2em 0;*/} #header.gnbOpen .gnb_wrap .gnb > li .dp1 {/* padding: 0 2.5em; */} /*contents*/ /* #contents .sub_page_top{} #contents .sub_page_tit{padding: 2em 0 1.5em 0;} #contents .sub_page_tit .wrap_tit{ padding-left: 1em;} #contents .sub_page_tit .wrap_tit .sub_tit{font-size: 1.5em;font-weight:500;color:#888;margin-bottom: .2em;} #contents .sub_page_tit .wrap_tit .sub_txt{font-weight: 700;font-size: 2.65em;} #contents .sub_page_tit .nav{ padding-bottom:1em;} #contents .sub_page_tit .nav > li{} #contents .sub_page_tit .nav > li .xi{ width:1.5em; height:1.5em; background:#aaa; border-radius:50%; font-size:1em; color:#aaa;} #contents .sub_page_tit .nav > li .tt{ vertical-align:middle; font-size:.938em;} #contents .sub_page_tit .nav > li + li:before{ content:"\e940"; font-family:xeicon; padding:0 .5em; vertical-align:middle; opacity:.8;} #contents .sub_page_tit .nav > li:last-child .tt{ text-decoration:underline;} #contents .sub_page_menu{ padding-bottom:1.5em;} #contents .sub_page_menu .gnb{display:block;} #contents .sub_page_menu .gnb .dp2{ gap:.5em} #contents .sub_page_menu .gnb .dp2 > li{} #contents .sub_page_menu .gnb .dp2 > li > a{padding: .5em 2em; color:#888;border-radius: 3.25em;border: 1px solid #ccc;height: 3.25em;} #contents .sub_page_menu .gnb .dp2 > li > a .tt{font-size: 1.1250em;font-weight:500;} #contents .sub_page_menu .gnb .dp2 > li > a .in{ position:relative; padding:0 .5em;} #contents .sub_page_menu .gnb .dp2 > li > a .in:after{ content:""; position:absolute; left:0; bottom:-.875em; width:100%; height:3px; background:#042d5c; transform:scaleX(0); transition:transform .3s;} #contents .sub_page_menu .gnb .dp2 > li.act > a, #contents .sub_page_menu .gnb .dp2 > li.on > a{ background:#042d5c;} #contents .sub_page_menu .gnb .dp2 > li.act > a .in, #contents .sub_page_menu .gnb .dp2 > li.on > a .in{ color:#fff;} #contents .sub_page_menu .gnb .dp2 > li.act > a .in:after, #contents .sub_page_menu .gnb .dp2 > li.on > a .in:after{ transform:scaleX(1);} #contents .sub_page_bg{ width: calc(1300px + 2em); margin: 0 auto; border-radius: 2em; overflow: hidden;transition: all .5s;} #contents .sub_page_bg .wrap_in{position:relative;height: 24em;overflow:hidden;} #contents .sub_page_bg .bg{ position:absolute; top:0; left: 0; width:calc(100%); height:100%; transition:3s;} .load #contents .sub_page_bg .bg{ } #contents .sub_page_bg .gsBlank{ } */ /*contents*/ #contents .sub_page_top{position: relative;box-sizing: border-box;box-shadow: 0 0 20px rgba(0,0,0,.1);} #contents .sub_page_tit{padding: 4em 0 6em 0;} #contents .sub_page_tit .wrap_tit{ padding-left: 1em;} #contents .sub_page_tit .wrap_tit .sub_tit{font-size: 3.5em;font-weight: 700;color: #fff;margin-bottom: .2em; text-shadow: 1px 1px 10px rgba(0,0,0,.15);} #contents .sub_page_tit .wrap_tit .sub_txt{font-weight: 700;font-size: 2.65em;} #contents .sub_page_tit .nav{ padding-bottom:1em;} #contents .sub_page_tit .nav > li{} #contents .sub_page_tit .nav > li .xi{width:1.5em;height:1.5em;background: #fff;border-radius:50%;font-size:1em;color: var(--siteC);} #contents .sub_page_tit .nav > li .tt{vertical-align:middle;font-size:.938em;color: #fff;} #contents .sub_page_tit .nav > li + li:before{content:"\e940";font-family:xeicon;padding:0 .5em;vertical-align:middle;opacity:.8;color: #fff;} #contents .sub_page_tit .nav > li:last-child .tt{ text-decoration:underline;} #contents .sub_page_menu{ padding-bottom:1.5em;} #contents .sub_page_menu .gnb{display:block;/* transform:translateX(-2em); */} #contents .sub_page_menu .gnb .dp2{ gap:.5em} #contents .sub_page_menu .gnb .dp2 > li{} #contents .sub_page_menu .gnb .dp2 > li > a{padding: .5em 1.5em;color: #fff;border-radius: 3em;border: 1px solid #777;height: 3em;background: rgba(0,0,0, .5);transition: all .2s;} #contents .sub_page_menu .gnb .dp2 > li > a .tt{font-size: 1.1250em;font-weight:500;} #contents .sub_page_menu .gnb .dp2 > li > a .in{ position:relative; padding:0 .5em;} #contents .sub_page_menu .gnb .dp2 > li > a .in:after{ position:absolute; left:0; bottom:-.875em; width:100%; height:3px; background:#042d5c; transform:scaleX(0); transition:transform .3s;} #contents .sub_page_menu .gnb .dp2 > li.act > a, #contents .sub_page_menu .gnb .dp2 > li.on > a{background: var(--siteC);border-color: var(--siteC);} #contents .sub_page_menu .gnb .dp2 > li.act > a .in, #contents .sub_page_menu .gnb .dp2 > li.on > a .in{color: #fff;} #contents .sub_page_menu .gnb .dp2 > li.act > a .in:after, #contents .sub_page_menu .gnb .dp2 > li.on > a .in:after{ transform:scaleX(1);} #contents .sub_page_bg{width: 100%;height: calc(100% - 6.5em);margin: 0 auto;/* border-radius: 2em; */overflow: hidden;transition: all .5s;position: absolute;top: 6.5em;left: 50%;z-index: -1;transform: translateX(-50%);} #contents .sub_page_bg::before{content:'';width:100%;height:100%;background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,0.1));position:absolute;left:0;top:0;z-index: 2;} #contents .sub_page_bg .wrap_in{position:relative;height: 100%;overflow:hidden;width: 100%; z-index: 1;} #contents .sub_page_bg .bg{ position:absolute; top:0; left: 0; width:calc(100%); height:100%; background-position: center top; transition:3s;} .load #contents .sub_page_bg .bg{ /* right:-2vw; */} #contents .sub_page_bg .gsBlank{ /*position:absolute; top:50%; left:0; height:105%; width:35vw; background:#042d5c; transform:translateY(-50%);*/} .scroll #contents .sub_page_bg{ width:100%; border-radius:0;} #contents .doc{ padding:4em 0 10em;} #contents .doc.pb_n{ padding: 8em 0 0 0;} .simple #contents .sub_page_tit .wrap_tit .sub_txt, .simple #contents .sub_page_bg{ display:none;} .simple #contents .sub_page_tit{ padding-top:3.5em;} .simple #contents .sub_page_tit .wrap_tit .sub_tit{ font-size:3.000em; color:#000;} .simple #contents .doc{ padding-top:0;} /* #footer{background:#2e3f53;} #footer:after{ display:block; clear:both; content:'';} #footer .info_wrap{ padding:2em 0 4em;} #footer .info_wrap .f_after{ gap:2em;} #footer .info_wrap .f_logo{ max-width: 15em; filter:grayscale(1) invert(0) brightness(3) opacity(0.5);} #footer .info_wrap .f_logo > img{ width: 100%; height: 4em;} #footer .info_wrap .info{ float:left; } #footer .info_wrap .info:after{ display:block; clear:both; content:'';} #footer .info_wrap .info > li{ margin-right:2em; font-weight: 100; color:#fff !important; opacity:.8; line-height:1.6; letter-spacing:0; font-size:.938em;} #footer .info_wrap .info > .br{ display: inline-block; width: 100%;} #footer .info_wrap .info > li.copyright{ clear:both; padding-top:30px; color:#fff; opacity:.4; font-size:.85em;} #footer .site_wrap{ position:relative} #footer .site_wrap .siteBtn{ line-height:3em; border:1px solid rgba(255,255,255,.1); width:13em; margin:.5em 0; font-size:.813em; padding:0 1em 0 1.5em; color:#fff; transition:.3s; background:#112641;} #footer .site_wrap .site{ position:absolute; left:0; z-index:10; bottom:-1.5em; margin-bottom:-.25em; width:100%; background:#1c2335; opacity:0; visibility:hidden; transition:.3s} #footer .site_wrap:hover .site{ opacity:1; visibility:visible} #footer .site_wrap .site > li{ border-bottom:1px solid rgba(255,255,255,.1);} #footer .site_wrap .site > li > a{ display:block; font-size:.75em; padding:.75em 1.5em; padding-right:3em; font-weight:300; color:#fff; overflow:hidden; position:relative; opacity:.7; transition:.3s} #footer .site_wrap .site > li > a .icon:before{ content:"\e980"; font-size:.813em; margin-right:.125em} #footer .site_wrap .site > li > a:after{ content:"\e907"; font-family:xeicon!important; position:absolute; right:-2em; top:50%; margin-top:-.5em; transition:.3s} #footer .site_wrap:hover .siteBtn, #footer .site_wrap .site > li:hover > a{ background:rgba(0,0,0,.3); opacity:1} #footer .site_wrap .site > li:hover > a:after{ right:1.5em} #footer .gotop{ width:4em; height:3.5em; background:#43576f; color:#fff; border:1px solid transparent; margin-left:1em; text-align:center; transition:.3s} #footer .gotop .xi{ display:block} #footer .gotop .tt{ display:block; font-size:.688em; letter-spacing:0} #footer .gotop:hover{ background:#fff; color:#1c2335; border-color:#1c2335} #footer .f_top{ border-bottom:1px solid rgba(255,255,255,.1);} #footer .f_top .f_top_list li{ margin-right:25px; position:relative; padding-right:25px; transition:.3s;} #footer .f_top .f_top_list li:after{ content:'·'; position:absolute; top:0; right:0; color:#a1b3cb;} #footer .f_top .f_top_list li:last-child:after{ display:none;} #footer .f_top .f_top_list li a{color:#a1b3cb; display:block;} #footer .f_top .f_top_list li:hover a{ color:#c8d5e7;} */ /* ori */ /* FOOTER */ #footer .goTop{display: flex; justify-content: center; align-items: center; z-index:999; position:fixed; right:0; bottom:0; width:3.5em; height:3.5em; /* border-radius: 50%; */ text-align:center; background:#24499b; color:#fff; box-shadow:0 0 1em rgba(0,0,0,.1); opacity:0; transform:translateY(100%); transition:.5s} #footer .goTop .xi{ font-size:1.5em; transition:.3s} #footer .goTop:hover .xi{ transform:translateY(-.25em)} .scroll #footer .goTop{ opacity:1; transform:translateY(0)} .allGnbOn #footer .goTop{display: none;} /* #footer{ padding:4em 0 6em 0; background: #222222; color:#fff;} */ #footer{padding:3em 0 5em 0;background: #f1f1f1; color:#555;} #footer .logo_wrap .wrap_in{ gap:2.5em;} #footer .logo_wrap .logo img{ height:3.75em; opacity: .8; } #footer .logo_wrap .logo > span{ padding: 1em; border: 1px solid #ddd; box-sizing: border-box; font-size: 1em;} /* #footer .menu{ gap:0 1em;} #footer .menu > li + li{ margin-top: 0.5em;} #footer .menu > li .in{display: flex; justify-content: space-between; align-items: center; gap:1em;position:relative;} #footer .menu > li .in strong.tt{} #footer .menu > li .in span.tt{ opacity: .6;} #footer .menu > li .in .xi{ transform: rotate(-45deg)} #footer .menu > li .in:hover .tt{ text-decoration:underline;} */ #footer .menu{ display:flex; flex-direction:column; gap:1em 0} #footer .menu > li{ width:100%;} #footer .menu > li > a{ display:block; padding-right:2em; font-size:1.063em; position:relative; opacity:.6} #footer .menu > li > a:after{ content:"\e915"; font-family:xeicon; position:absolute; right:0; top:0; transform:rotate(45deg)} #footer .menu > li > a.point{ opacity:1} #footer .info_wrap{ flex:1; gap:4em; } #footer .info_wrap .logo_wrap{ margin-bottom: 3em;} #footer .info_wrap .info{ overflow:hidden; width: 80%} #footer .info_wrap .info > li{margin-right:3em; margin-bottom:.75em; opacity:.8; position:relative; display: flex; gap: .2em;} #footer .info_wrap .info > li:before{ content:""; position:absolute; left:-1.5em; height:70%; top:50%; transform:translateY(-50%); width:1px; background:#000; opacity:.2} #footer .info_wrap .info > li.point{ font-weight:600} #footer .info_wrap .info > li.br{ padding-right: 50%;} #footer .info_wrap .info .tit{ opacity:1; font-weight:500;} #footer .copy_wrap {/* border-top: 1px solid rgba(255,255,255,.3); */ /* margin-top: 1.5em; */padding-top: 2em;} #footer .copy_wrap .copyright{font-size:.813em; text-transform:uppercase; opacity:.6;} #footer .info_wrap .link{ gap:.5em;} #footer .info_wrap .link > li .in{ gap:0 1em; height:3em; padding:0 1.375em; border:1px solid rgba(255,255,255,.3); border-radius:10em; transition:.2s;} #footer .info_wrap .link > li .in .xi{ font-size:.875em; opacity:.6;} #footer .info_wrap .link > li .in:hover{ background:#49b7be; border-color:#49b7be;} /* #footer .menu_wrap .menu > li + li .in:before{ content:""; width:1px; height:1em; margin:0 1em; background:rgba(0, 0, 0, .3);} #footer .menu_wrap .menu > li .in:not(.point) .tt{ opacity:.7;} */ #footer .menu_wrap .family{ width:13em; margin-top: 3em; border-radius:.5em; border: 1px solid #ccc;background: #fff; position: relative; /* position: absolute; right: 0; top: 5em; */} #footer .menu_wrap .family .in{ padding:.8em 1.625em; opacity:.7;} #footer .menu_wrap .family .in .tt{} #footer .menu_wrap .family .in .arrow{ font-size:1em; transition:.2s;} #footer .menu_wrap .family .in .arrow:before{ content:"\e944"} #footer .menu_wrap .family .list{position:absolute;left:0;bottom: calc(100% + 2px);width:100%;max-height: 16em;margin-bottom:-1px;padding:1em 1em;background: #fff;border-bottom:1px solid rgba(255,255,255,.2);box-sizing:border-box;display:none;border: 1px solid #ddd;} #footer .menu_wrap .family .list > li > a{ display:block; padding:.5em 0; font-size:.938em;} #footer .menu_wrap .family .list > li > a:hover{ text-decoration:underline;} #footer .menu_wrap .family.on .in{ opacity:1;} #footer .menu_wrap .family.on .in .arrow{ transform:rotate(180deg);} #footer .menu_wrap .family.on .list{ display:block;} .partner_area{ border-top:1px solid #dddddd; padding:15px 0;} .partner_area .partner{ overflow:hidden;} .partner_area .partner > dt{ float:left; width:235px; height:50px;} .partner_area .partner > dt .va {height:100%;} .partner_area .partner > dt .va_tt{ font-size:18px; color:#222222; letter-spacing:-1px; line-height:1;} .partner_area .partner > dd{ width: 100%;} .partner_area .partner > dd .slider li a{ display:block; height:48px; border:1px solid #cccccc;} .partner_area .partner > dd .slider li a img{ width:100%; height:100%; max-width:183px; max-height:48px;} .partner_area .partner > dd .slider li:hover a{ border:1px solid #aaaaaa;} .agree_wrap{ padding:.5em; font-size:.875em; line-height:1.5} /*inc*/ .page_secmt1{ margin-top: 1em !important} .page_secmt2{ margin-top: 2em !important} .page_secmt3{ margin-top: 3em !important} .page_secmt4{ margin-top: 4em !important} .page_secmt { margin-top: 5em !important;} .page_secmt6{ margin-top: 6em !important;} .page_secmt7{ margin-top:7em !important;} .page_secmt8{ margin-top:8em !important;} .page_secmt9{ margin-top:9em !important;} .page_secmt10{ margin-top:10em !important;} .page_secmb { margin-bottom: 5em !important;} .page_secmb6{ margin-bottom: 6em !important;} .page_secmb7{ margin-bottom:7em !important;} .page_secmb8{ margin-bottom:8em !important;} .page_secmb9{ margin-bottom:9em !important;} .page_secmb10{ margin-bottom:10em !important;} .fw400{ font-weight: 400;} .fw500{ font-weight: 500;} .fw600{ font-weight: 600;} .fw700{ font-weight: 700;} .fw800{ font-weight: 800;} .fw900{ font-weight: 900;} /*===============================================font======================================================*/ .main_txt{} .main_txt:last-child{ margin-bottom:0;} .main_txt.m1{ margin-bottom:1.5em;} a.main_txt{ display:block;} .main_txt .tit{ margin-top: 1em;} .main_txt .txt{ margin-top:2em; line-height:1.6;} .main_txt > div:first-child{ margin-top:0;} .main_txt .line{ display:inline-block; width:1px; height:2px; background:#3c9a8c;} .main_txt .line.w{ width:2.25em; margin:1.75em 0;} .main_txt .line.h{ height:1.5em; margin:1.5em .125em;} .main_txt .line:first-child{ margin-top:0;} .main_txt .line + .tit, .main_txt .line + .txt{ margin-top:0;} .main_txt .t1{ font-size:1.000em;} .main_txt .t2{ font-size:1.250em;} .main_txt .t3{ font-size:1.375em;} .main_txt .t4{ font-size:1.500em;} .main_txt .t5{ font-size:1.875em;} .main_txt .t6{ font-size:2.250em;} .main_txt .t7{ font-size:2.625em;} .main_txt .t8{ font-size:3.500em; line-height: 1.4;} .main_txt .t9{ font-size:7.750em;} .main_txt .t10{ font-size:3.000em;} .main_txt .gray{ opacity: .85;} .main_txt .fw400{ font-weight: 400;} .main_txt .fw500{ font-weight: 500;} .main_txt .fw600{ font-weight: 600;} .main_txt .fw700{ font-weight: 700;} .main_txt .fw800{ font-weight: 800;} .main_txt.cw .tt{ color:#fff;} .main_txt.cw .line{ background:#fff;} .main_txt .nw{ white-space:nowrap;} .page_sec2{ padding-top: 2em;} .page_sec3{ padding-top: 3em;} .page_sec4{ padding-top: 4em;} .page_sec5{ padding-top: 5em;} .page_sec6{ padding-top: 6em;} .page_sec7{ padding-top: 7em;} .page_sec8{ padding-top: 8em;} .page_secb2{ padding-bottom: 2em;} .page_secb3{ padding-bottom: 3em;} .page_secb4{ padding-bottom: 4em;} .page_secb5{ padding-bottom: 5em;} .page_secb6{ padding-bottom: 6em;} .page_secb7{ padding-bottom: 7em;} .page_secb8{ padding-bottom: 8em;} .page_txt .tit + .tit{ margin-top:1em;} .page_txt .tit + .txt{ margin-top:2.5em;} .page_txt > .txt{ margin-top:2em;} .page_txt > .txt:first-child{ margin-top:0;} .page_txt > .txt .page_tt + .page_tt{ margin-top:1em;} .page_tt{ font-size:1em; word-break:keep-all; line-height:1.4;} .page_tt > .tt + .tt{ margin-top:1.5em;} .page_tt.o1{ opacity:.75;} .page_tt.s1{ font-size:0.938em} .page_tt.s2{ font-size:1.063em} .page_tt.s3{ font-size:1.125em} .page_tt.s4{ font-size:1.250em; } .page_tt.s5{ font-size:1.313em} .page_tt.s6{ font-size:1.500em; font-weight: 700;} .page_tt.s7{ font-size:1.625em} .page_tt.s8{ font-size:1.875em} .page_tt.s9{ font-size:2.00em; font-weight: 500; color: #666;} .page_tt.s10{ font-size:3em; font-weight: 800;} .page_tt.s11{ font-size:2.65em; font-weight: 700;} .page_tt.s12{ font-size:4.000em;} .page_tt.s13{ font-size:6.500em;} .page_tt.s14{ font-size: 2.525em; font-weight: 700; } .page_tt.lh15{line-height: 1.5; } /*===============================================main======================================================*/ /* quick */ #quick{ position:fixed; left:0; top:0; width:8em; height:100%; z-index:100} #quick .va{ width:100%; text-align:left} #quick .menu > li > a{ display:block; border:1px solid rgba(255,255,255,.2); border-left:none; background:#000; background:rgba(0,0,0,.7); color:#fff; line-height:3em; margin-bottom:-1px; transform:translateX(-5.25em); transition:.3s; cursor:pointer; position:relative; text-align:right} #quick .menu > li > a .xi{ font-size:1em; width:3em; height:3em; border-left:1px solid rgba(255,255,255,.2); text-align:center; margin-left:.5em} #quick .menu > li > a .xi:before{ font-size:1.25em} #quick .menu > li > a .tt{ vertical-align: top; font-family:Arial, Helvetica, sans-serif; font-size:.75em} #quick .menu > li > a:hover{ transform:translateX(-.5em); z-index:1} .mainNav_wrap{ position:fixed; z-index:9; right:0; top:35%;} #mainNav > li *{transition:.3s} #mainNav > li{ margin-bottom: .5em;} #mainNav > li:last-of-type{ margin-bottom: 0em;} #mainNav > li > a{ display:block; text-align:right; padding:.5em 1em} #mainNav > li > a .line, #mainNav > li > a .tt{ display:inline-block; *display:inline; zoom:1; vertical-align:middle} #mainNav > li > a .line{ width:.5em; height:.5em; border-radius:100%; background:#000; margin-left:1em; opacity:.5} #mainNav > li > a .tt{ color:#fff; font-size: 1em; opacity: .75; } #mainNav > li > a{ background:#000; background:rgba(0,0,0,.45); border-radius:3em 0 0 3em} #mainNav > li.on > a{ background:#000; background:rgba(0,0,0,.7); border-radius:3em 0 0 3em} #mainNav > li.on > a .tt{ opacity:1; visibility:visible} #mainNav > li.on > a .line{ background:#fff; opacity:1} #mainNav > li:hover:not(.on) > a .tt{ opacity:1} .scrollDown{ position:absolute; bottom:3em; margin-bottom:0; width:100%; left:0; z-index:10; text-align:center; color:#fff; opacity:.85; animation-name: scrollDownAni; animation-duration: 3s; animation-iteration-count: infinite} .scrollDown .s1{ font-size:3em; vertical-align:middle} .scrollDown .s2{ font-size:1.5em; vertical-align:middle; margin-left:-.5em} @keyframes scrollDownAni{ 40% { margin-bottom:-1em} 50% { margin-bottom:0} } /*메인*/ .section{ overflow:hidden; position:relative; background-repeat:no-repeat; background-position:center top} .section.bg_b{ position: relative;} .section.bg_b:before{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; background: rgba(0,0,0,.25);} .section_wrap{ position:relative; height: 100%; box-sizing: border-box; z-index: 9;} .section_wrap.pt{ padding-top: 7em;} .section_wrap .section_tit .m_tt{ font-size:2.4em; text-align:center;} .section_wrap .section_tit .m_tw{ color:#555; font-size:1.125em; text-align:center; margin-top:20px;} .br1{ border-radius:1em; overflow:hidden} .outRound{ position:relative} .outRound:before, .outRound:after{ content:""; position:absolute; width:1em; height:1em; z-index:1; background:url(../images/inc/round.svg) no-repeat; background-size:100% 100%} .outRound.rb{ border-top-left-radius:1em} .outRound.rb:before{ right:0; bottom:100%} .outRound.rb:after{ right:100%; bottom:0} .outRound.lb{ border-top-right-radius:1em} .outRound.lb:before{ left:0; bottom:100%; transform:rotate(90deg)} .outRound.lb:after{ left:100%; bottom:0; transform:rotate(90deg)} .main_more{ display: flex; justify-content: center; align-items: center;} .main_more.st1{ border-radius: 50%; background-color: #fff;} .main_more.st1.s1{ width: 50px; height: 50px; color:#111} .main_more.st1.s2{ width: 40px; height: 40px; color:#777;} .main_more.st2{ display: inline-flex; height: 1.875em; padding:0 1.125em; border:1px solid #ddd; border-radius: 2em; background:#fff; line-height: 1.875em; color:#777} .main_more.st2 .tt{ margin-right: 0.5em;} .main_more.st2 .xi{ font-size: 1em;} /* main top */ .mainTop {margin-top: 7.5em;} .mainTop.top1 {margin-top: 4.5em;} .mainTop .wrapIn{ display:flex; gap:1em; } .mainTop .wrapIn .visualCon{ width:78%; position: relative;} .mainTop .wrapIn .visualCon .resize{ padding-bottom:57.25%} .mainTop .wrapIn .visualCon .resize .visualSlide_wrap{ position:absolute; left:0; top:0; width:100%; height:100%} /* main top - banner */ .mainTop .wrapIn .topCon{ flex:1 1 0%; display:flex; flex-direction:column; gap:1em; position:relative; z-index:10} .mainTop .wrapIn .topCon .wrap1{ height:50%} .mainTop .wrapIn .topCon .banner{ display: flex; flex-direction: column; justify-content: space-between; padding:2.5em 2em 2em;} .mainTop .wrapIn .topCon .banner .main_more{ transition: all .3s; } .mainTop .wrapIn .topCon .banner .icon{ width: 80px; height: 65px; background-position: center bottom; position: absolute; right: 2em; bottom: 2em;} .mainTop .wrapIn .topCon .support{ width: 100%; height: 100%; box-sizing: border-box; background: #d3f9eb;} .mainTop .wrapIn .topCon .support1{ width: 100%; height: 100%; box-sizing: border-box; background: #78ebe2 /* #b9fdf7 */;} .mainTop .wrapIn .topCon .cs{ width: 100%; height: 100%; box-sizing: border-box; background: #a6c8d9 /* #d8f0ff */;} .mainTop .wrapIn .topCon .gb{ width: 100%; height: 100%; box-sizing: border-box; background: #d8dee2;} .mainTop .wrapIn .topCon .banner .tit_wrap{} .mainTop .wrapIn .topCon .banner .tit_wrap .tit_top{ margin-bottom: 1.125em; font-weight: 500; font-size: 1.25em; color:#002e54} .mainTop .wrapIn .topCon .banner .tit_wrap .tit{ font-weight: 700; font-size: 1.625em; color:#111;} .mainTop .wrapIn .topCon .banner:hover .main_more{ background-color: var(--siteC);} .mainTop .wrapIn .topCon .banner:hover .main_more .xi{ color:#fff;} .mainTop .wrapIn .con2_1 .btn4:hover .main_more{ background-color: var(--siteC);} .mainTop .wrapIn .con2_1 .btn4:hover .main_more .xi{ color:#fff;} /* 메인비주얼 */ .vod_wrap{ position:relative} .vod_wrap:after{content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.2)} .vod{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover} .visualSlide, .visualSlide .el{ height:100%} .visualSlide .el .bg{ position:absolute; left:-10%; top:0; width:110%; height:100%} .visualSlide .el .vod_wrap{ position:relative; height:100%} .visualSlide .el .vod_wrap:after{ background:rgba(0,0,0,.3)} .visualSlide .el.swiper-slide-active .bg, .visualSlide .el.swiper-slide-duplicate-active .bg{ transition:5s; left:0} .visualSlide_wrap .slogan{ position:absolute; left:0; top:0; width:100%; height: 100%; box-sizing:border-box; padding:10% 30% 15% 8%; background:rgba(0,0,0,.2); z-index:10; color:#fff; display:flex; flex-direction:column; gap:1.8em} .visualSlide_wrap .slogan .t1{ font-weight:700; font-size:3em; line-height: 1;} .visualSlide_wrap .slogan .t2{ font-weight:500; font-size:1.25em;line-height:1.5} .visualSlide_wrap .el .slogan .t1{ transform:translateY(1em); opacity:0} .visualSlide_wrap .el .slogan .in{ display:block; overflow:hidden} .visualSlide_wrap .el .slogan .in > i{ display:block; transform:translateY(100%); opacity:0} .visualSlide_wrap .el.swiper-slide-active .slogan .t1{ transform:translateY(0); opacity:1; transition:1s} .visualSlide_wrap .el.swiper-slide-active .slogan .in > i{ transform:translateY(0); opacity:1; transition:1s; transition-delay:.2s} .visualSlide_wrap .el.swiper-slide-active .slogan .in:nth-child(2) > i{ transition-delay:.4s} .visualSlide_wrap .el.swiper-slide-active .slogan .in:nth-child(3) > i{ transition-delay:.6s} .visualSlide_wrap{ position:relative } .visualSlide_control{ position:absolute; right:0; bottom:0; background:#052a48; z-index:10; display:flex; align-items:flex-end; padding:.5em; border-bottom-right-radius: 1em;} .visualSlide_control .control{ margin-bottom:1em} .visualSlide_control .paging{ width:5em; text-align:center;} .visualSlide_control .paging .swiper-pagination-current{ font-weight:700} .fllH{ height: calc(100vh); box-sizing: border-box;} /* main 공통 */ .main_sec{ padding:5em 0;} /* main sec3 */ .main_sec.sec3{} .main_sec.sec3 .boardList{ padding:1em; box-sizing: border-box;} /* main sec2 */ .main_sec.sec2{ } /*********** SUB ************/ /*서브 공통*/ .tupper{ text-transform:uppercase;} .bg_gray{ background: #f9f9f9; padding: 6em 0; margin: 6em 0;} .bg_gray.mb_n{ margin: 6em 0 0 0;} .page_top{margin-top: 3em;} .page_top .tit{ text-align: center; position: relative;} .page_top .tit .tt{font-weight: 800;font-size: 3em;color:#111;} .page_top .tit .en{font-weight: 200;font-size: 3.5em;color: #eee; position: absolute;top: .5em;left: .5em;z-index: -1;} .page_top .tit::after{ content: ''; display: block; width: 1px; height: 2em; margin: .5em auto 0;background: #000;} .page_con{ padding: 0 0 6em 0;} .page_con.pb0 , .page_con:last-of-type{ padding: 0 0 0 0;} .page_con .con{ padding:0 1.25em;} /* */ .table_box{} .table_box .scr_i{display: none;} .table_box .scr_i .xi{ transform: rotate(90deg);} .table_box table{} .conLay{} .conLay + .conLay{ margin-top: 6em} .conLay .inner{ gap:4em} .conLay .inner.high{ gap:4em} .conLay .inner.row{ gap:4em} .conLay .txt_wrap{ flex:1; padding:3em 0 2em;} .conLay.layL .txt_wrap{ padding-left: 2em;} .conLay.layR .txt_wrap{ padding-right: 2em;} .conLay .txt_wrap .tit .line{ width: 2.5em; height: 3px; margin-bottom: 1em;background:var(--siteC);} .conLay .txt_wrap .page_tt.s3{line-height: 1.5; color:#333;} .conLay .img_wrap{ width: 45%;} .conLay .img_wrap .img{position: relative;} .conLay .img_wrap .img::after{ content: ''; width: 100%; height: 100%; background:var(--siteC); position: absolute; left: -.5em; bottom: -.5em; z-index: -1; opacity: .4; } .conLay.layR .img_wrap{ order:-1;} .conLay.layR .img_wrap .img::after{left:auto; right:-.5em;} .conLay.st2 .img_wrap{ width: 30%;} .conLay.st2 .img_wrap .img::after{display: none;} /* .conTit{ margin-bottom:1.5em; padding:.8em; border-radius:.5em; background:linear-gradient(90deg, var(--color_dblue), var(--color_lblue)); font-weight: 600; font-size:1.25em; color:#fff;} */ /*인사말*/ .ceo_wrap{ padding:5em 3em 6em; margin:0 auto; border-radius:2em; background:url(../images/sub/about/message_bg.jpg) no-repeat 0 0 / cover; position:relative; overflow: hidden;} .ceo_wrap::after{ content:''; width: 100%; height: 100%; background:linear-gradient(180deg, rgba(0, 0, 0, .15), rgba(0, 0, 0, .95)); position:absolute; left: 0; top: 0;} .ceo_wrap .slogan{margin-bottom: 4em;padding-bottom: 4em;border-bottom:1px solid #fff;position:relative;z-index: 1;} .ceo_wrap .slogan .tt{font-weight:600; font-size: 2em;color:rgba(255, 255, 255, .9);} .ceo_wrap .slogan::before, .ceo_wrap .slogan::after{ content:''; width: 11px; height: 11px; border-radius:50%; background-color: #fff; position:absolute; bottom:-6px;} .ceo_wrap .slogan::before{ left:0;} .ceo_wrap .slogan::after{ right:0;} .ceo_wrap .message{ gap:4em; padding:0 3em; position:relative; z-index: 1;} .ceo_wrap .message .txt_wrap{ flex:1; color:#fff;} .ceo_wrap .message .txt_wrap .t1{ padding-bottom:2em; font-weight: 600; font-size:1.5em; letter-spacing:0;} .ceo_wrap .message .txt_wrap .t2{ padding-bottom:1em; font-size:1.25em; line-height: 1.5; word-break:keep-all;} .ceo_wrap .message .txt_wrap .t2:last-child{ padding-bottom:0} .ceo_wrap .message .txt_wrap .name{ padding-top:3em; padding-right:2em; font-size:1.375em; text-align: right;} .ceo_wrap .message .txt_wrap .name > em{ margin-right: 0.2em;} .ceo_wrap .message .txt_wrap .name > strong{ margin:0 0 0 .5em; font-size:1.1em;} .ceo_wrap .message .img_wrap{ width:35%; padding-bottom:47%;border-radius:1.5em; overflow:hidden;} /* 설립목적 및 연혁 */ /* 역대회장 */ .pastCEOs{} .pastCEOs .inner{ } .pastCEOs .list{gap: 2em 1.5em;} .pastCEOs .list li{display: flex;gap:2em;width: calc((100% - 3em) / 3);padding: 2.5em 2em;border:1px solid #ddd;box-shadow: 0 0 20px rgba(0,0,0, .15);border-top: 1px solid var(--siteC);} .pastCEOs .list li .img_wrap{width:8em;height: 9em;border-radius: 2em;background: url(../images/temp/noimg_profile.jpg) no-repeat center center / contain;box-shadow: 0 0 20px rgba(0, 0, 0, .15);overflow: hidden;} .pastCEOs .list li .img_wrap .img{ height: 100%;} /* .pastCEOs .list li .img_wrap img{ width: 100%; max-height: 100%; border:1px solid #ddd; border-radius: 2em; object-fit: cover;} */ .pastCEOs .list li .txt_wrap{display: flex; flex-direction: column; justify-content: space-between; flex:1; padding: 1em 0;} .pastCEOs .list li .txt_wrap .position{ display: block; margin-bottom:1em; font-weight: 500; color: var(--siteC2); line-height: 1.2em;} .pastCEOs .list li .txt_wrap .name{ display: block; margin-bottom: 1em; font-size: 1.875em; font-weight: 700; color:#333;} .pastCEOs .list li .txt_wrap .affi{ color: #777; word-break: break-word;} /* 조직도 */ .org_chart{ padding:1em 0;} .table_st.org th{ color:#333;} .table_st.org tbody td{ text-align: center;} .table_st.org tbody td .xi.link:hover{ color:var(--siteC2)} /* 협약기관 */ .partner_wrap{} .partner_wrap .partner_list{ gap:2em; } .partner_wrap .partner_list > li{ width:calc( (100% - 2em) / 2); border:1px solid #ddd; background:#fff; position: relative;} .partner_wrap .partner_list > li a{ } .partner_wrap .partner_list > li .img{ padding:3em 2em; text-align: center;} .partner_wrap .partner_list > li .img img{ max-width:20em; max-height: 10em;} /*오시는 길*/ .tab.location .list_tab{ gap:0 1em;} .tab.location .list_tab > li{} .tab.location .list_tab > li .step_tit{ padding:.8em 2.5em; border-radius:2em; border:2px solid var(--color_dblue); font-size: 1.125em; color:#333; text-align: center;} .tab.location .list_tab > li.on .step_tit{ background-color:var(--color_dblue); color:#fff;} .root_daum_roughmap .wrap_map{ position: relative;} .root_daum_roughmap .wrap_controllers{ display: none;} .map_wrap{} .map_wrap .map_con{ flex: 1 1 40%;} .map_wrap .map_location{ flex: 1 1 60%; overflow: hidden; border-radius: 2em;} /* kakao map 사용시 */ .map_wrap .map_location.jpg{ box-shadow: -5px 5px 20px rgba(0, 0, 0, .1);} /* 지도 이미지 사용시 */ .map_wrap .m_icon{} .map_wrap .m_icon > li{ flex: 1 1 100%; } .map_wrap .m_icon > li .icon_wrap{ display:flex; align-items:center; margin-top: 2.5em;} .map_wrap .m_icon > li .icon_wrap img{ width:2.5em; padding:.3em; box-sizing: border-box; box-shadow: 1px 0 3px rgba(0,0,0,.25); background: #f4f4f4; border-radius: 50%; position: relative; margin-left:.5em;} .map_wrap .m_icon > li .icon_wrap .icon_ttl{ font-size: 1.5em; font-weight: 700; margin:0 .5em;/* margin: 1em 0 .65em 0; */} .map_wrap .m_icon > li .icon_wrap .icon_txt{ font-size: 1.25em; color: #666;} /* 주요사업소개 */ .table_st.inTable{ border-top:none;} .con_box.business{} .con_box.business .tit1{ display: flex; align-items: center; gap:.8em; font-size: 1.125em;} .con_box.business .tit1 + .tit1{ margin-top: 0.5em;} .con_box.business .tit1 .tt{ min-width: 5em; padding:.5em 1em; border-radius: 2em; background:var(--siteC); font-weight: 600; color:#fff; text-align: center;} .con_box.business .desc_wrap{ } .con_box.business .desc_wrap .tit2{ margin-bottom: .5em; font-weight: 700; font-size:1.125em; } .con_box.business .desc_wrap .con_list{ padding-left:.8em;} .con_box.business .desc_wrap .con_list .tit{font-weight:600; color:#333; position:relative} .con_box.business .detail{} .con_box.business .detail .inTable .dot_list{ margin-left: 1em; } .con_box.business .detail .inTable .page_tt + .dot_list{ margin-top: 0.8em;} .con_box.business .act_desc{ display: flex; gap: 3em; } .con_box.business .act_desc + .act_desc{ margin-top: 1em;} .con_box.business .act_desc > .tit{ width: 10em;} .con_box.business .act_desc > .tit .tt{ display: block; height: 2.5em; padding:0 1em; border-radius: 2em; background:var(--siteC); font-weight: 600; line-height: 2.5em;color:#fff; text-align: center;} .con_box.business .act_desc .t1{ font-weight: 600; font-size: 1.125em; line-height: 2.5rem;} .con_box.business .act_desc .content{ flex:1; max-width: calc(100% - 13em);} .con_box.business .act_desc .content .inner{} .con_box.business .act_desc .content .inner{ } .con_box.business .act_desc .content .inner .tit2{ margin: .5em 0 .8em; font-weight: 700; font-size:1.125em; } .con_box.business .act_desc .content .inner .con_list{ padding-left:.8em;} .con_box.business .act_desc .content .inner .con_list .tit{font-weight:600; color:#333; position:relative} .con_box.business .act_desc .content .inner .detail{} .con_box.business .act_desc .content .inner .detail .inTable .dot_list{ margin-left: 1em; } .con_box.business .act_desc .content .inner .detail .inTable .page_tt + .dot_list{ margin-top: 0.8em;} .con_box.business .act_desc .content .inner .detail .inTable .w_1{ width: 30%;} /* 보유면허 */ /* .license_list{ gap:4em 3em;} .license_list > li{ width:calc( ( 100% - 9em) /4); border:1px solid #ddd; position: relative; transition:all .6s;} .license_list > li .thumb{overflow:hidden; width:100%;} .license_list > li .thumb img{ width: 100%; transform:scale(1.05); transition:all .6s;} .license_list > li .tit{ width:100%; padding:.8em .5em; box-sizing: border-box; font-weight: 600; font-size:1.125em; color:#fff; text-align:center; background-color:rgba(0, 0, 0, .7); position: absolute; left: 0; bottom: 0;} .license_list > li .hover_line{} .license_list > li .hover_line .line{content:""; background:#03569f; position:absolute; z-index:10; transition:all 0.3s ease-out;} .license_list > li .hover_line .line:nth-child(1){ width:0; height:2px; left:0; top:0;} .license_list > li .hover_line .line:nth-child(2){ width:0; height:2px; right:0; bottom:0;} .license_list > li .hover_line .line:nth-child(3){ width:2px; height:0; left:0; bottom:0;} .license_list > li .hover_line .line:nth-child(4){ width:2px;height:0; right:0; top:0;} .license_list > li:hover{ box-shadow: 3px 3px 15px rgba(0, 0, 0, .1)} .license_list > li:hover .thumb img{ transform: scale(.95);} .license_list > li:hover .hover_line .line{ transition:all 0.3s 0s ease-out;} .license_list > li:hover .hover_line .line:nth-child(1){width:100%;} .license_list > li:hover .hover_line .line:nth-child(2){width:100%;} .license_list > li:hover .hover_line .line:nth-child(3){height:100%;} .license_list > li:hover .hover_line .line:nth-child(4){height:100%;} .license_wrap:not(:last-child){ margin-bottom:5em;} .license_wrap .slide_tit{ margin-bottom:1.5em; padding:.8em; border-radius:.5em; background:linear-gradient(90deg, var(--color_dblue), var(--color_lblue)); font-weight: 600; font-size:1.25em; color:#fff;} */ /* 보유장비 */ /* .gear_wrap{ padding:0 .5em; box-sizing:border-box;} .gear_list{ gap:4em;} .gear_list > li{ width:calc( (100% - 8em) / 3); } .gear_list > li a{} .gear_list .img{ height:0; padding-bottom:65%; margin-bottom:1em} .gear_list .img img{} .gear_list .cont{} .gear_list .cont .tit{ margin-bottom: 0.5em; padding-left: .5em; border-left:3px solid var(--color_dblue); font-weight: 600; font-size:1.25em; color:var(--color_dblue);} .gear_list .cont .td{ padding-left: 1em; font-size:1.125em; line-height: 1.4; color:#333; } body.pop .popWrap.gear{max-width: 80vw;} body.pop .popWrap.gear .popIn{ padding-top:3em;} body.pop .popWrap.gear .popTit{ background-color:var(--color_dblue); color:#fff;} body.pop .popWrap.gear .popTit .popClose .xi{ color:#fff;} .gear_intro{gap:3em;height: 38em; } .gear_intro .img_wrap{width: 50%;padding: 2em 1em;background-color: #fff;border: 1px solid #ddd;box-shadow: 0 3px 10px rgba(0, 0, 0, .1);} .gear_intro .img_wrap .pop_slide{ overflow:hidden;} .pop_slide{} .pop_slide .swiper-slide{ max-width: 100%;} .pop_slide .swiper-pagination{ margin-top:2em; position: relative;} .pop_slide .swiper-pagination-bullet{ height:.5em; border-radius:1em; background-color:var(--color_dblue)} .pop_slide .swiper-pagination-bullet-active{ width:2em; } .gear_intro .txt_wrap{width: 50%; max-height: 100%;overflow: hidden;} .gear_intro .txt_wrap .page_tt.dot3{ margin-bottom:1em;} .gear_intro .txt_wrap .in{ height:90%; padding:0 1em 1em 0; box-sizing:border-box;} .gear_intro .txt_wrap .in .board_table.gear{ border-top:2px solid var(--color_dblue)} .gear_intro .txt_wrap .in .board_table.gear th, .board_table.gear td{ height: 2.5em;} */ /* CI소개 */ /**/ .patternGrid{background-image: repeating-linear-gradient(#ddd, #ddd 1px, transparent 0, transparent 10px), repeating-linear-gradient(90deg, #ddd, #ddd 1px, transparent 0, transparent 10px)} .lineGrid {border:1px solid #ddd;} .logo_intro{ gap:5em;} .logo_intro .logo{width: 40%;padding:5em 10em;} .logo_intro .logo img{ width:9em;} .logo_intro .desc{width: 60%; padding-top:1em;} .logo_intro .desc .tit{ margin-bottom:.5em; font-weight: 500; font-size:1.25em; color:var(--color_dblue);} .logo_intro .desc .t1 + .tit{ margin-top:2em;} .logo_intro .desc .t1{ font-size:1.125em; color:#555; line-height: 1.5;} .logo_intro .desc .colorInfo{} .logo_intro .desc .colorInfo > li{} .logo_intro .desc .btn_wrap{ gap:1em; margin-top:4em;} .logoType{ gap:2em;} .logoType > li{ width:calc( (100% - 2em) / 2); padding:4em 5em; box-sizing:border-box; border:1px solid #ddd; text-align: center; } .logoType > li img{ max-width:50%;} .logoType .type1{} .logoType .type2{} .logoType .type2 img{filter:grayscale(1) opacity(.5)} /**/ .ci_col_Wrap{ gap:2em;} .ci_col_Wrap > li{ flex:1} .ci_col_Wrap .wrap_in{ border:1px solid #ddd;padding: 1em;} .ci_col_Wrap .wrap_in .img_wrap{width: 30%;box-shadow:5px 7px 13px rgba(0,0,0,.2)} .ci_col_Wrap .wrap_in .img_wrap.bg1 {background:#003974} .ci_col_Wrap .wrap_in .img_wrap.bg2 {background:#00aeef;} .ci_col_Wrap .wrap_in .img_wrap.bg3 {background:#ee2d29;} .ci_col_Wrap .wrap_in .info_wrap{ width:70%; position:relative} .ci_col_Wrap .wrap_in .info_wrap:before{ content:""; position:absolute; left:0; top:0; width:1px; height:100%; background:#ddd} .ci_col_Wrap .wrap_in .info_wrap .info{padding-left: 1.5em;text-align:left;width:100%;box-sizing:border-box;} .ci_col_Wrap .wrap_in .info_wrap .info > p .tx { margin-right:1em; color:#222;display:inline-block;vertical-align:bottom;} .ci_col_Wrap .wrap_in .info_wrap .info .t1{ color:#003876; font-size:1.8em; letter-spacing:-2px; font-family:'notokrB'; padding-left:.1em; padding-bottom:.8em;} .ci_col_Wrap .wrap_in .info_wrap .info .t2{ color:#555; margin:.125em 0 .375em 0; font-size:.938em; padding-left:.2em;} .ci_col_Wrap .wrap_in .info_wrap .info .t3{ color:#555; font-size:.938em; padding-left:.2em;} .ci_col_Wrap .wrap_in .info_wrap .info .t4{ color:#555; margin-top:.125em; font-size:.938em; padding-left:.2em;} /* */ .con_box{ padding:2em;} .con_box.mt{margin-top:3em;} .con_box.bg{ background-color: #f6f6f6;} .con_box.tline{border:1px solid #ddd; border-top: 2px solid var(--siteC); word-break: keep-all;} .con_box.line{ border:1px solid #ddd; border-radius: .5em;} .con_box .check_wrap{ display: flex; align-items: center; gap:2em; padding:0 2em;} .con_box .check_wrap .icon{width: 8em;height: 8em;background-repeat: no-repeat;background-position: center center;background-size:contain;padding: 1.5em;border-radius: 50%;border: 2px solid #ddd;display: flex;justify-content: center;align-items: center;box-sizing: border-box;} .con_box .check_wrap .icon img{ height: 100%; margin-left:10px} .con_box .check_wrap .cont{} .con_box .check_wrap .cont .tit{margin-bottom: .2em;font-weight: 600;font-size:1.25em;color:var(--color_dblue);display: block;} .con_box .check_wrap .cont .td{margin-bottom: 1.2em;margin-bottom:1em; font-size: 1.125em;color:#555;} .con_box .check_wrap .cont .td:last-child{ margin-bottom: 0;} .con_box .desc{ margin-bottom: 1em; padding-left: 1.5em; } .con_box .desc .page_tt + .page_tt{ margin-top:.2em;} /* .con_tit{ position:relative;} .con_tit .stroke{font-weight: 800; position: absolute; top: -68px; left: 50%; font-size:5.75em; color: transparent; -webkit-text-stroke: 2px #ddd;} */ .con_box .busi_img + .busi_tit{ margin-top:2em; } .con_box .law_wrap{margin-left: 1.5em;} .con_box .law_wrap .tit{ margin-bottom: 0.5em; font-weight: 600; font-size:1.125em; color:var(--color_dblue)} .con_box .law_wrap .cont_list{ list-style-type: circle;} .con_box .law_wrap .cont_list > li + li{margin-top: 1em;} .con_box .law_wrap .cont_list .cont{ color:#333; position: relative;} .con_box .law_wrap .cont_list .cont .num{ padding-right: 0.5em;} .con_box .law_wrap .t2{ margin-top: 1em; color:var(--color_lblue)} /* .page_tt.dot1{ margin-bottom:.8em; padding-left:1em; font-weight: 600; font-size:1.5em; color:#333; position: relative;} .page_tt.dot1::before{ content:''; width: 12px; height: 18px; background:url(../images/sub/tit_bullet.png); position:absolute; left:0; top:7px;} */ .page_tt.dot1{margin-bottom:.8em;padding-left:1em;font-weight: 600;font-size: 1.875em;color:#111; position: relative;} .page_tt.dot1::before{content:'';position:absolute;top: 10px;left:0;width: 12px;height: 12px;background:#2e8ae6;border-radius:50%;} .page_tt.dot1::after{content:'';position:absolute;top: 25px;left: 12px;width: 6px;height: 6px;background:#33bbff;border-radius:50%;} .page_tt.dot2{margin-bottom:.5em; padding-left: 1.5em; font-weight: 600; font-size: 1.125em; color:#555; position: relative;} .page_tt.dot2::before{content:''; width: 18px;height: 18px; background:url(../images/sub/tit_bullet2.png) no-repeat 0 0 / cover; position:absolute;left:0;top: 4px;} .page_tt.dot3{margin-bottom:.5em;/* padding-left: 1.2em; */font-weight: 600; font-size: 1.375em; color:#555; position: relative;} .page_tt.dot3::before{content:"\e92b"; display: inline-block; margin-right: .5em; font-family:xeicon; color:var(--siteC2); /* width:15px; height:5px; border-radius: 5px; background-color:var(--color_lblue); *//* position:absolute;left:0;top: 6px; */} .page_tt.dot4{ padding-left: 1em; color:#555; position: relative;} .page_tt.dot4::before{ content: ''; width: 5px; height: 1px; background-color:#777; position: absolute; left: 0; top: 9px;} .dot_wrap.dot4{ padding-left:2em} .dot_wrap .page_tt.dot4 + .dot4{ margin-top: 0.5em;} .tit_icon1{ position: relative;} .tit_icon1::before{ content: ''; width: 1.25em; height: 1.25em; border-radius: 50%; background:#006ab5; position: absolute; left: -13px; top: -5px; z-index: -1; opacity: .3;} .dot_list{ } .dot_list.ml{ margin-left: 1.5em;em } .dot_list > li{padding-left: 1em; position: relative;} .dot_list > li + li{ margin-top: 0.5em;} .dot_list > li::before {content: ''; width:5px; height:5px; border-radius:50%; background:#5fa1d9; position: absolute; left: 0; top: 0.5em;} .dot_list > li a{ padding-left:.8em; font-size:1.125em; color:#333;} .dot_list > li .xi{ margin-left:.8em; font-size:1em; color:#999; vertical-align: bottom; } .dot_list.st2{ margin-left: 0;} .dot_list.st2 > li{ display:flex; padding-left:.8em; font-size: 1.25em;} .dot_list.st2 > li + li{ margin-top:1em;} /* .dot_list > li::before{ background-color: #777;} */ .dot_list.st2 > li strong{display:inline-block; width:5em; margin-right: 1em; line-height:1.4; text-align: justify;} .dot_list.st2 > li strong::after , .dot_list.st2 > li strong::before{content: ''; display:inline-block; width: 100%;} /* .busi_step_wrap{ text-align: center;} .busi_step{ display: flex; justify-content: space-around;} .busi_step > li{ display:flex; justify-content: center; align-items: center; width:10em; height:10em; border-radius: 50%; border:1px solid #ddd; background-color:#fff; position: relative;} .busi_step > li:not(:last-child)::before{ content:'\e93e'; font-family:xeicon; font-weight: 700; font-size: 1.5em; color:#999; position: absolute; right:-4em;} .busi_step > li.blue{ border-color:var(--color_lblue); background-color: var(--color_lblue); color:#fff} .busi_step > li.point{ border-color:var(--color_lblue); /* background-color: var(--color_lblue); color:#fff */ color:var(--color_dblue)} .busi_step > li.point::after{ content: ''; width:11em; height:11em; border:1px dashed #777; border-radius: 50%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);} .busi_step > li.goal{ border-color: var(--color_dblue); color:var(--color_dblue)} .busi_step > li .tt{ font-weight: 600; font-size: 1.125em; text-align: center; word-break: keep-all;} .busi_step.step4{} */ /*표*/ .sub_rule_wrap {} .sub_rule_wrap .ti_w {background:#fff; padding:3em; border:1px solid #ddd; border-bottom:none; border-top:3px solid #3167a6;} .sub_rule_wrap .ti_w .t1 { font-size:2em; color:#222; text-align:center} .sub_rule_wrap .ti_w .yearW {text-align:right;} .sub_rule_wrap .ti_w .yearW .tt{color:#666; font-size:.813em; line-height:1.6; font-weight:300;} .dl_st{ padding:3em 2em 4em 2em; border:1px solid #ddd; background:#fafafa; margin-bottom:1.5em;} .dl_st:last-child {margin-bottom:0;} .dl_st > dt{ font-size:1.5em; color:#222; font-weight:500; margin-bottom:1em; text-align:center} .dl_st > dt .ts{ font-size:.75em} .dl_st > dd{ line-height:1.2; color:#666; font-size:1.063em; margin-top:2em} .dl_st > dt + dd{ margin-top:0} .dl_st > dd > ul{ margin-left:.5em} .dl_st > dd > ul li:not(:first-child){ margin-top:0em} .dl_st.st1 {border-top:none;} .dl_st.st2 > dd {margin-top:2em;} .dl_st > dd > p { margin-bottom:.5em; line-height:1.5;} .page_tit:not(:first-child){ margin-top:6em; line-height:1.2} .page_tit .t1{ font-weight:500; font-size:1.5em; position:relative; padding:.75em 0} .page_tit .t1:before{ content:""; position:absolute; left:0; top:0; width:2em; height:.25em; box-sizing:border-box; background:#3167a6; border-right:1em solid #bbb} .page_tit .t1.ac:before{ left:50%; transform:translateX(-50%)} .page_tit .t1.no:before {display:none;} .page_tit .t2{ font-weight:500; font-size:2.5em; } .page_tit .t3{ position:relative; padding-left:1.375em; font-weight:500; font-size:1.188em; color:#111; line-height:1.2; margin-bottom:.75em} .page_tit .t3:before{ content:""; position:absolute; left:0; top:.125em; background: linear-gradient(-225deg, #4578c8 49%, #3167a6 50%); width:1em; height:1em} .page_tit.st2 .t3 {font-size:1.5em; padding-left:.65em; margin-bottom:1em;} .page_tit.st2 .t3:before {width:5px; height:20px;} .page_tit.st2 .t3:after {display:none} .page_tit .t3:after{ content:""; position:absolute; left:0; top:.125em; width:1em; height:1em; background:#fff; transform:scale(.5)} .page_tit .t4 {margin-top:1em; font-size:1.250em; line-height:1.6;} .dl_st.intro {background:#fff; border-top:3px solid #3167a6; padding: 1em 2em 3em 2em} .dl_st.intro .page_tit .t3 {margin-bottom:1em; font-size:1.3em; padding-left:.65em;} .dl_st.intro .page_tit .t3:before {width:5px; height:20px;} .dl_st.intro .page_tit .t3:after {display:none;} .dl_st.intro > dd {margin-bottom:3em;} .dl_st.intro > dd:last-child {margin-bottom:0;} .ul_st{ margin-top:-1.25em} .ul_st > li .ul_in{ position:relative; padding:0 1em; margin-top:1.25em; color:#666} .ul_st > li .ul_in:before{ content:""; width:1em; height:1em; border-radius:50%; background:#063165; font-size:.375em; position:absolute; left:0; top:1.75em; line-height:1} .ul_st > li .ul_in .t1{ font-weight:500; color:#063165} .ul_st.s1 > li{ margin-top:.875em; font-size:.938em; line-height:1.5} .ul_st.s1 > li .ul_in:before{ top:1em} .ul_st.st3{ margin-top:0} .ul_st.st3 > li{ counter-increment:ul_st3; position:relative; padding:.25em 2em} .ul_st.st3 > li:before{ content:counter(ul_st3) "."; font-weight:500; width:1.5em; padding-right:.5em; text-align:right; color:#063165; position:absolute; left:0; top:.3em} .ul_st.st3 > li:last-child {margin-bottom:.875em;} .ul_st.st3 > li > p {line-height:1.8;} .ul_st.st3 > li .account {margin: 1em 0;padding: 1em;border: 1px solid #ddd;box-sizing: border-box; background:#f3f7f9;} .ul_st.st3 > li .account .point {color:#3167a6; font-size:1.3em;} .ul_st.st3.ver2{ margin-top:0} .ul_st.st3.ver2 > li{ position:relative; padding:.25em 2em} .ul_st.st3.ver2 > li:before{content: '';width: 4px;height: 4px; padding-right:0; /* text-align:right; */background: #3167a6 ; position:absolute;left: 17px;top: 14px;border-radius: 50%;} .guide_wrap {border:1px solid #ddd; padding:3em; box-sizing:border-box; background:#f4f4f4; border-top:3px solid #3167a6;} .upTxt {margin-bottom:1em; line-height:1.5; color:#666; font-size:1.125em;} .dl_st > dd > p.type {color:#111; font-size:1.3em;} .down_info {font-size:.875em; color:#3167a6;} .down_info.st2 { color:#666;} .join_btn {margin-top:3em;} .join_btn .btn a {padding:1em 2em; box-sizing:border-box; background:#779dc9; margin: 0 auto; color:#fff;} .join_btn .btn {} .join_btn .btn a:hover {background:#3167a6; transition:.3s;} .join_btn.st2 {margin-top:0;} .join_btn.st2 .btn a {padding:.5em 2em; box-sizing:border-box; margin: 0 auto} /*연혁*/ .history_bgw {overflow:hidden; position:relative; margin:0 5em 3em 5em;} .history_bgw .bg_w {position:absolute; left:0; top:0; width:100%; height:100%; background-position:center top; background-repeat:no-repeat; background-size:cover; background-attachment:fixed;} .history_bgw .txt_wrap {text-align:center; } .history_bgw .txt_wrap .en {font-weight: 700; padding-bottom:.5em; color:#fff; letter-spacing:5px; font-size:2.5em; } .history_bgw .txt_wrap .kr {font-size:1.7em; color:#fff; font-weight:500;} .history_bgw .line_wrap{ position:relative; height:15em;} .history_bgw .line_wrap .line{ position:absolute; background:#fff; width:1px; height:1px; transition:1s; opacity:.5; display:none;} .history_bgw .line_wrap .line.hor{ transition-delay:1s} .history_bgw .line_wrap .line.top{ top:0} .history_bgw .line_wrap .line.bot{ bottom:0} .history_bgw .line_wrap .line.left{ left:0} .history_bgw .line_wrap .line.right{ right:0} .load .history_bgw .line_wrap {margin:2em 1.5em;} .load .history_bgw .line_wrap .line.ver{ height:100%} .load .history_bgw .line_wrap .line.hor{width:40%;} .load .history_bgw .line_wrap .line{ display:block} .history_wrap{ position:relative; overflow:hidden; padding:2em 0;} .history_wrap:before, .history_wrap .lineAni{ content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#ddd} .history_wrap .lineAni{ height:0; background:#3167a6; transition:.3s} .history_wrap .lineAni:before, .history_wrap:after{ content:""; position:absolute; left:50%; top:0; margin-left:-.5em; width:1em; height:1em; background:#fff; border:.25em solid #3167a6; border-radius:100%; box-sizing:border-box} .history_wrap:after{ top:auto; bottom:0} .history_wrap .history > li{ margin-top:4em} .history_wrap .history > li:first-child{ margin-top:0} .history_wrap .history > li .year{ width:50%; overflow:hidden; justify-content:flex-end} .history_wrap .history > li .year .wrap_in{ position:relative; overflow:hidden; width:15em} .history_wrap .history > li .year .tt{ display:inline-block; position:relative; padding:0 .5em; font-size:2.5em; letter-spacing:-3px; font-weight: 400; color:#3167a6; /* font-family: Georgia, "Times New Roman", Times, serif */} .history_wrap .history > li .year .tt:before{ content:""; position:absolute; left:100%; top:50%; margin-top:-1px; width:100%; border-top:2px dotted #aaa;} /* .history_wrap .history > li .year .tt:after{ content:"'"; font-style:italic} */ .history_wrap .history > li .year .tt:after{ content:""; width: .5em; height: .5em; border-radius: 50%; background: var(--siteC); opacity: .2; position: absolute; right: 10px; top: 10px;} .history_wrap .history > li .list{ width:50%; margin-top:1em} .history_wrap .history > li .list > li{ margin-top:.5em} .history_wrap .history > li .list > li:first-child{ margin-top:0} .history_wrap .history > li .list .wrap_in{ padding:0 2em} .history_wrap .history > li .list .wrap_in .img_wrap .resize {padding-bottom:35% !important;} .history_wrap .history > li .list .wrap_in .img_wrap .resize .img_r {text-align:right !important;} .history_wrap .history > li .list .wrap_in .img_wrap .resize .img_l {text-align:left !important;} .history_wrap .history > li .list .month{ flex:0 0 3em} .history_wrap .history > li .list .month .tt{ color:#999; font-size:1.125em; /* font-family:Georgia, "Times New Roman", Times, serif; */ letter-spacing:-1px} .history_wrap .history > li .list .month .tt:after{ content:"월"; font-size:.813em; font-weight:500} .history_wrap .history > li .list .detail > li{ margin-top:.5em} .history_wrap .history > li .list .detail > li:first-child{ margin-top:0} .history_wrap .history > li .list .detail .tt{ position:relative; padding:0 1.5em; margin-top:.125em; color:#333; font-size:.938em; line-height:1.7; font-weight:400;} .history_wrap .history > li .list .detail .tt:before{ content:""; position:absolute; left:0; top:.5em; width:.75em; border-top:2px solid #ddd} .history_wrap .history > li .list .detail .desc{width:calc(100% - 1.125em); margin:.5em 0 .5em 1.25em; padding:.8em; box-sizing: border-box; border: 1px solid #ddd; border-radius: .5em; font-size: .9375em; line-height: 1.5; color:#555;} .history_wrap .history > li:nth-child(2n) .year{ justify-content:flex-start; text-align:right} .history_wrap .history > li:nth-child(2n) .year .tt:before{ left:auto; right:100%} .history_wrap .history > li:nth-child(2n) .list{ order:-1} .history_wrap .history > li:nth-child(2n) .list > li > .flex{ justify-content:flex-end} .history_wrap .history > li:nth-child(2n) .list .month{ text-align:right} .history_wrap .history > li:nth-child(2n) .list .detail{ order:-1} .history_wrap .history > li:nth-child(2n) .list .detail .tt{ text-align:right} .history_wrap .history > li:nth-child(2n) .list .detail .tt:before{ left:auto; right:0} /* */ .map_tit .t1 img {padding:3px; box-sizing:border-box;} .map_info1 { overflow:hidden; margin-bottom:20px; box-shadow:2px 3px 8px -1px #a4a4a4; padding:1.5em; margin-top:1em; font-weight:400; box-sizing:border-box; background:#fff;} .map_info1 .t1 span { color:#666; display:inline-block; margin-right:30px; margin-bottom:10px; line-height:1.5;} .map_info1 .t1 span:last-child { margin-right:0;} .map_info1 .t1 .xi { font-size:1em; color:#fff; margin-right:10px; border-radius:50%; width:1.8em; height:1.8em; line-height:1.8em; text-align:center; background:#3167a6} .sub_tbl.tac{ margin-top:1em;} .sub_tbl .tbl_st {border:1px solid #ccc; border-top:3px solid #3167a6; font-size:0.938em; width:100%;} .sub_tbl .tbl_st tbody th {background:#f0f4f7; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:1em 1.5em; font-weight:500; color:#333; text-align:center; } .sub_tbl .tbl_st tbody td {background:#fff; text-align:center; color:#666; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:1em 1.5em; line-height:1.5;} .calendar {width:50%;} .top_wrap .con.con2 {width:50%; box-sizing:border-box; padding:3em 0 0 3em;} .Pcon_bd1 {background: #f4f4f4; border:1px solid #ddd; padding:4em 2em; box-sizing:border-box; margin-top:2em;} .Pcon_bd1 .sche_day .date {font-size:.9em; color:#666;} .Pcon_bd1 .sche_day .tit {font-size:1.25em; margin-bottom:2em;} .sche_day .tit a:hover{ text-decoration:underline;} .sche_day .txt{ overflow:hidden;} .sche_day .txt strong, .sche_day .txt span{ display:block; float:left; padding:4px 0; color:#5f6265; line-height:1.3;} .sche_day .txt .t1{ width:20%; color:#292d31;} .sche_day .txt .t2{ width:80%;} .label_st .xi.check {font-size: inherit;} /**/ .page_tab .list_tab, .page_tab .list_tab > li, .page_tab .list_tab > li > a{ } .page_tab { text-align:center;} .page_tab .list_tab{ display: flex; gap:.5em; } .page_tab .list_tab > li {width:20%;} .page_tab .list_tab > li > a{padding:1em 1em; border:1px solid #ddd; border-radius: 3em; color:#666; transition:.3s; display:block; } .page_tab .list_tab > li > a .step_tit {font-size:1.125em; letter-spacing:.1px;} .page_tab .list_tab > li > a > *{ display:inline-block; *display:inline; zoom:1;} .page_tab .list_tab > li .icon{ margin-left:.5em; color:#3167a6;} .page_tab .list_tab > li .icon:before{ content:"\e937";} .page_tab .list_tab > li:hover > a, .page_tab .list_tab > li.on > a{box-shadow:0 0 1em 0.125em rgba(0,0,0,.1); color:#3167a6; border-color:#3167a6;} .page_tab .list_tab > li:hover .icon, .page_tab .list_tab > li.on .icon{ color:#fff;} .dl_st.white {background:#fff;} /* MINT ***************************/ /* 훈련가소개 */ .trainers_wrap{} .trainers_wrap .list{gap: 2em;} .trainers_wrap .list > li{display: flex; align-items: center; gap:2em;width:calc((100% - 2em) / 2);padding:1.5em; border:1px solid #ddd; border-top:1px solid var(--siteC); box-shadow: 0 0 20px rgba(0,0,0,.15);} .trainers_wrap .list > li .img_wrap{width: 10em; height: 12em;border:1px solid #ddd;border-radius: 2em;overflow: hidden;} .trainers_wrap .list > li .img_wrap .profile{ width: 100%; height: 100%;} .trainers_wrap .list > li .txt_wrap{flex:1; display: flex; flex-direction: column;justify-content: space-between;/* padding: 1em 0 .5em; */ position: relative;} .trainers_wrap .list > li .txt_wrap .cont{} .trainers_wrap .list > li .txt_wrap .name{margin-bottom: .5em;padding-bottom: .3em;font-weight: 600;font-size: 1.5em;color:var(--siteC);border-bottom: 1px solid #ddd;} .trainers_wrap .list > li .txt_wrap .info{} .trainers_wrap .list > li .txt_wrap .info > li{ display: flex; gap: .5em;} .trainers_wrap .list > li .txt_wrap .info > li + li{ margin-top: 0.5em;} .trainers_wrap .list > li .txt_wrap .info > li .tt{width: 4em; font-weight: 600; color:#555; position: relative;} .trainers_wrap .list > li .txt_wrap .info > li .tt::after{ content: ''; width: 1px; height: 1em; background:#555; position: absolute; right: 0; top: 4px;} .trainers_wrap .list > li .txt_wrap .info > li .td{ flex: 1; word-break: break-all;} .trainers_wrap .list > li .txt_wrap .btn_wrap{ display: inline-flex; margin-top: 1.5em; } .trainers_wrap .list > li .txt_wrap .more_btn{ padding: .3em 1em; border: 1px solid var(--siteC) ;border-radius: 2em; font-weight: 600;color:var(--siteC);} .trainers_wrap .list > li .txt_wrap .more_btn .tt{ font-size: .9375em;} .trainers_wrap .list > li .txt_wrap .more_btn .xi{margin-left: .2em; font-size: .875em; transition: all .3s;} .trainers_wrap .list > li:hover .txt_wrap .more_btn .xi{ margin-left:.8em; } .trainers_wrap .list > li .txt_wrap .more{ display: flex; justify-content: center;align-items: center; width: 2em; height: 2em; border:1px solid var(--siteC); border-radius: 50%; position: absolute; right: 0; top: 0;} /* TNT 소개 */ .thum_list.st1{} .thum_list.st1 > .list{} .thum_list.st1 > .list > li{ padding:0 1em 1.5em; border-bottom:1px solid #ccc;} .thum_list.st1 > .list > li + li{ margin-top: 1.5em;} .thum_list.st1 > .list .inner{ gap:2em;} .thum_list.st1 > .list .inner .txt_wrap{flex:1;padding: 1.5em 0 1em;} .thum_list.st1 > .list .inner .txt_wrap .dot_list{margin-top: 1em; margin-left: 1.5em;} .thum_list.st1 > .list .inner .img_wrap{ order:-1;width: 30%; border: 1px solid #eee; border-radius: .5em; box-shadow: 2px 2px 10px rgba(0,0,0,.15); overflow: hidden;} .memo_box{ padding:2em; border:2px solid #ddd; border-radius:1em; background:#f4f4f4;} .memo_box .in{} .con_box.step{ padding:0 0 0 .8em;} .steps-st2 > ul{display: flex; gap:40px;} .steps-st2 > ul > li{ flex:1; /* width: calc( (100% - 120px) / 4); */ position: relative; border:1px solid #ddd; border-top: 2px solid var(--siteC); padding: 25px; box-sizing:border-box; display: flex; align-items: center;} .steps-st2 > ul > li:before{position: absolute; left: -40px; top:0;height: 100%; content: ''; background: url('../images/sub/about/steps.gif') center center no-repeat; width: 40px} .steps-st2 > ul > li:first-child:before{background: none} .steps-st2 .ico{width: 110px; margin:0 auto} .steps-st2 .txt{flex:1; color: #333} .steps-st2.type2{text-align: center;} .steps-st2.type2 > ul{} .steps-st2.type2 > ul > li{display: block;} .steps-st2.type2 .ico{/* width: auto */} .steps-st2.type2 .ico img{display: block; margin: 0 auto;} .steps-st2 .cont{margin-top: 20px;} .steps-st2 .t{display: block; color: #333} .steps-st2 .c{margin-top: 10px; padding:0 1em; letter-spacing: -0.04em; word-break: keep-all;} .steps-st2 .small{font-size: .938rem; margin-top: 5px; display: block; color: #666} /* 교육안내***************************/ /*본인확인*/ .form.record .inp_wrap {margin-bottom: 1em;} .check_tit {width: 20%; font-size: 1.25em; font-weight: 600; color: #333; margin-right: 1em;} .inquiry_wrap{ margin-top: 8em;} .inquiry_wrap .inquiry_boX{ width:500px; max-width:100%; margin:0 auto;} .inquiry_wrap .inquiry_boX.check { width:600px; max-width:100%; margin:0 auto;} .inquiry_wrap .inquiry_tit{ padding:0 0 2em 0; text-align:center;} .inquiry_wrap .inquiry_tit .tit{font-size:2.25em; color:#333; font-weight:600; letter-spacing: -1px;} .inquiry_wrap .inquiry_form{ padding:2.5em 2em; border:1px solid #ddd; border-top:2px solid var(--siteC); box-shadow:1px 5px 10px rgba(0,0,0,0.2)} .inquiry_wrap .form > li:first-child{ margin-top:0;} .inquiry_wrap .form .inp_wrap{ position:relative; margin-top:.4em;} /* .inquiry_wrap .form .inp_wrap .xi{ position:absolute; top:0; left:0; width:2em; line-height:55px; text-align:center; font-size:1.750em; color:#3c3c3d;} */ .inquiry_wrap .form .inp_wrap .tt{ position:absolute; top:0; left:0; width:6em; line-height:55px; text-align:center; border-right:1px solid #ddd; color:#3c3c3d;} .inquiry_wrap .form .inp_wrap .inp{ box-sizing:border-box; width:100%; height:55px; padding:0 1em 0 4em; background:#fff; border:1px solid #ddd; border-radius:5px; font-family:'gs';} .inquiry_wrap .form .btn_wrap{ margin-top:.6em;} .inquiry_wrap .form .btn_wrap .btn{width:100%; border:1px solid transparent; padding:1em; border-radius:.5em; font-weight:700; font-size:1.175em; position:relative; overflow:hidden; background:#fff; color:var(--siteC); transition:.3s; font-family:'gs';} .inquiry_wrap .form .btn_wrap .btn.c1{ background:var(--siteC); color:#fff;} /*major*/ /* .board_flex{ margin:-2em 0 0 -2em; padding-bottom: 5rem;} .board_flex > li .in{ margin:2em 0 0 2em} .board_flex > li .in{ display:block; border:1px solid #ddd; overflow:hidden} .board_flex > li .in .img_wrap{ display:block; position:relative} .board_flex > li .in .img_wrap .resize{ padding-bottom:40%; background-size:auto; height:80px;} .board_flex > li .in .img_wrap .btn{ position:absolute; z-index:1; left:50%; bottom:0; transform:translate(-50%,50%); width:2.25em; line-height:2.25em; border-radius:50%; background:#fff; box-shadow:0 0 .5em rgba(0,0,0,.2); text-align:center; transition:.3s} .board_flex > li .in .img_wrap .btn:hover{ background:#105faa; color:#fff} .board_flex > li .in .img_wrap .btn .icon{ font-size:1em} .board_flex > li .in .img_wrap .btn.home{ margin-left:2em; opacity:0} .board_flex > li .in .img_wrap .btn.home .icon:before{content:"\e902"} .board_flex > li .in:hover .img_wrap .btn.home{ margin-left:0; opacity:1} .board_flex > li .in .con_wrap{ display:block; background:#f5f5f5; text-align:center; padding:1.5em} .board_flex > li .in .con_wrap .t1{ font-weight:500; color:#333} .board_flex > li .in .con_wrap .btn{ margin-top:.25em} .board_flex > li .in .con_wrap .btn .st{} .board_flex > li .in .con_wrap .btn .st .xi{ font-size:1em} .board_flex.partner > li{width:33.333%} .board_flex.partner > li .in .img_wrap .resize{ padding-bottom:40%; background-size:contain} .board_flex.ce > li{width:25%} .board_flex.ce > li .in .img_wrap .resize{ padding-bottom:141.6%; background-size:contain} .board_flex > li .in .con_wrap {padding:15px;} .board_flex > li .in .con_wrap .t1.name { font-size:1em;} .board_flex > li .in .img_wrap .resize {height:30px;} */ /*MEMBER***************************/ .h100{ height: 100vh; box-sizing: border-box;} .grd-bg{ background: #eaeef6;} .member_wrap{ letter-spacing:-.5px} .member_wrap .input_st{ height:3em;} .member_wrap .login_box{ width:520px; max-width:100%; margin:0 auto;} .member_wrap .join_box { width:600px; max-width:100%; margin:0 auto;} .member_wrap .confirm_box{ width:45%; margin:0 auto} .member_wrap .member_tab{ text-align:center; padding:0 1px 0 0;} .member_wrap .member_tab > li{ width:50%;} .member_wrap .member_tab > li .in{ position:relative; z-index:1; margin:0 -1px -1px 0; padding:1em .5em; background:#f0f0f0; border:1px solid #d4d5d8; font-size:1.125em; color:#72727d;} .member_wrap .member_tab > li.on .in{ z-index:2; background:#fff; border-bottom-color:transparent; color:#0ea04f;} .member_wrap .member_tab > li.on .in:before{ content:""; position:absolute; top:-1px; left:-1px; right:-1px; height:4px; background:#0ea04f;} .member_wrap .member_tit{ padding:0 0 2em 0; text-align:center;} .member_wrap .member_tit .tit{ font-size:2.500em; color: #111; letter-spacing:0; text-transform:uppercase;} .member_wrap .member_tit .txt{ font-size:1.125em; font-weight:600; color: #111; padding-top:.8em;} .member_wrap .member_form{ padding:2.5em 2em; background: #fff; border-radius: 1.5em; box-shadow: 2px 2px 6px rgba(0,0,0,.15); border-top-width:4px; border-top-color:#3167a6;} .member_wrap .member_form.st1{ border-top:none !important} .member_wrap .form > li:first-child{ margin-top:0;} .member_wrap .form .inp_wrap{ position:relative; margin-top:.4em;} .member_wrap .form .inp_wrap .xi{ position:absolute; top:0; left:0; width:2em; line-height:55px; text-align:center; font-size:1.750em; color:#3c3c3d;} .member_wrap .form .inp_wrap .tt{ position:absolute; top:0; left:0; width:6em; line-height:55px; text-align:center; border-right:1px solid #ddd; color:#3c3c3d;} .member_wrap .form .inp_wrap .inp{ box-sizing:border-box; width:100%; height:55px; padding:0 1em 0 4em; background:#fff; border:1px solid #ddd; border-radius:5px;} .member_wrap .form { margin-top:1.2em;} .member_wrap .form .find{ padding-top:.3em; text-align:right;} .member_wrap .form .find .link{ position:relative; display:inline-block; *display:inline; zoom:1; vertical-align:middle; margin-left:.8em; padding-left:.8em; font-weight:300;} .member_wrap .form .find .link:before{ content:""; position:absolute; top:10%; left:0; width:1px; height:80%; background:#ccc;} .member_wrap .form .find .link:first-child{ margin-left:0; padding-left:0;} .member_wrap .form .find .link:first-child:before{ display:none;} .member_wrap .form .btn_wrap{ margin-top:.6em;} .member_wrap .form .btn_wrap .btn{ display:block; box-sizing:border-box; text-align:center; width:100%; margin:.4em 0; padding:1em 1em; border:1px solid transparent; font-size:1.125em; border-radius:.3em} .member_wrap .form .btn_wrap .btn.c1{ background:#3167a6; color:#fff;} .member_wrap .form .btn_wrap .btn.c2{ background:#ffffff; border-color:#3167a6; color:#3167a6;} .member_wrap .form .btn_wrap .btn.c3{ background:#3e3e49; color:#fff;} .member_wrap .form .msg_wrap{ margin-top:2em;} .member_wrap .form .msg_wrap .tt{ margin:.4em 0; font-size:.938em; color:#3c3c3d; font-weight:300;} .member_wrap .form .msg_wrap .tt.icon{ position:relative; padding-left:1.6em;} .member_wrap .form .msg_wrap .tt.icon .xi{ position:absolute; top:0; left:0; line-height:1;} .member_wrap .form .id_wrap{ padding:3em 1em; background:#f5f5f5; border:1px solid #e5e5e5; text-align:center; font-size:1.125em;} .member_wrap .form .id_wrap strong{ vertical-align:baseline; color:#3f3f9f; letter-spacing:0;} .member_wrap .form .sns_wrap{ margin-top:2em;} .member_wrap .form .sns_wrap .btn{ position:relative; display:block; margin-top:.4em; border:1px solid #ccc; border-radius:5px;} .member_wrap .form .sns_wrap .btn:first-child{ margin-top:0;} .member_wrap .form .sns_wrap .btn .tt{ display:block; box-sizing:border-box; line-height:55px; padding:0 1em 0 6em; color:#3c3c3d;} .member_wrap .form .sns_wrap .btn .icon{ position:absolute; top:-1px; left:-1px; bottom:-1px; width:2em; line-height:57px; border-radius:5px 0 0 5px; text-align:center; font-size:2.000em; color:#fff;} .member_wrap .form .sns_wrap .btn .icon.naver{ background:#2CB400;} .member_wrap .form .sns_wrap .btn .icon.daum{ background:linear-gradient(-225deg, #6e9cfc 0%, #fb676a 70%, #ffe001 100%); font-family:'Ms','NotoSans',sans-serif; font-weight:600;} .member_wrap .form .sns_wrap .btn .icon.google{ background:#1A73E8;} .member_wrap .form .sns_wrap .btn .icon.kakao{ background:#FAE100; color:#3C1E1E;} .member_wrap .form .sns_wrap .btn:hover{} .member_wrap .form2{ margin-top:1.5em; padding-top:1.5em; border-top:1px dashed #ccc;} .member_wrap .form2 .tit{ font-size:1.325em; margin-bottom:1em; font-weight: 600; display:block; } .member_wrap .form2:first-child{ margin-top:0; padding-top:0; border-top:none;} .member_wrap .form2 > li{ margin-top:.4em; font-weight:300;} .member_wrap .form2 > li:first-child{ margin-top:0;} .member_wrap .form2 .inp_wrap{ color:#3c3c3d;} .member_wrap .form2 .inp_wrap select.input_st, .member_wrap .form2 .inp_wrap input[type=text].input_st, .member_wrap .form2 .inp_wrap input[type=password].input_st{ background-color:transparent;} .member_wrap .form2 .inp_wrap input[disabled=disabled].input_st{ background-color:#f5f5f5;} .member_wrap .form2 .check_wrap > *{/* display:inline-block;*/ zoom:1; vertical-align:middle; flex-wrap :wrap; align-items:center;} .member_wrap .form2 .check_wrap .label_wrap{ width:100%;} .member_wrap .form2 .check_wrap .label_wrap > *{ width:33.33%; margin:.2em 0;} .member_wrap .form2 .check_wrap .tit{ display:block; font-size:1.125em; padding-bottom:1em} .member_wrap .form2 .check_wrap .tit.st2 {padding-bottom:0; font-size:1em; color:#333;} .member_wrap .form2 .check_wrap .check_ul{width:100%;} .member_wrap .form2 .check_wrap .check_ul.st{ background:#fff} .member_wrap .form2 .check_wrap .check_ul.st > li{ padding:0} .member_wrap .form2 .check_wrap .check_ul > li{ width:20%;} .check_ul > li .label_st .xi {font-size:1em;} .member_wrap .form2 .check_wrap .check_ul > .last {flex:0 1 100%;} .member_wrap .form2 .check_wrap .check_ul .last .w18 {width:18.5em;} .member_wrap .form2 .ess{ display:none;} .member_wrap .form2 .required .ess{ display:inline-block; font-size: 1.85em; opacity: .85;} .member_wrap .form2 .field{ position:relative;} .member_wrap .form2 .field .txt{ position:absolute; top:50%; left:1.2em; font-size: 1.05em; color: #888; font-weight: 600; transform:translate(0, -50%); transition:transform .2s ease-out; transform-origin:0 0;} .member_wrap .form2 .field.on .txt{ color:#69696b; transform:translate(0, -110%) scale(.7,.7);} .member_wrap .form2 .colr .col_w1{ width:65.68%; margin-left:1%;} .member_wrap .form2 .colr .col_w1:first-child{ width:66.66%; margin-left:0;} .member_wrap .form2 .colr .col_w2{ width:32.34%; margin-left:1%;} .member_wrap .form2 .colr .col_w2:first-child{ width:33.32%; margin-left:0;} .member_wrap .form2 .tit.input_st{ background:#f5f5f5;} .member_wrap .form2 .check_st{ position:relative; text-align:center; border-color:transparent; cursor:pointer;} .member_wrap .form2 .check_st .on{ position:absolute; top:-1px; bottom:-1px; left:-1px; right:-1px; background:#fff; border:1px solid #095282; border-radius:5px;} .member_wrap .form2 .check_st .on ~ span{ position:relative; color:#095282;} .member_wrap .form2 .check_st:hover input ~ .on, .member_wrap .form2 .check_st input:checked ~ .on{ background:#095282;} .member_wrap .form2 .check_st:hover input ~ .on ~ span, .member_wrap .form2 .check_st input:checked ~ .on ~ span{ color:#fff;} .member_wrap .form2 .check_st input[type=checkbox], .member_wrap .form2 .check_st input[type=radio]{ width:0; height:0; overflow:hidden; opacity:0;} .member_wrap .type_wrap{} .member_wrap .type_wrap > li{ width:50%;} .member_wrap .type_wrap > li .inner{ border-left:1px solid #ddd; padding:0 2em; text-align:center;} .member_wrap .type_wrap > li:first-child .inner{ border-left:none;} .member_wrap .type_wrap .icon{ height:8em;} .member_wrap .type_wrap .txt{ margin-top:1em; min-height:5em;} .member_wrap .type_wrap .txt .t1{ font-size:1.500em; color:#3f3f9f;} .member_wrap .type_wrap .txt .t2{ font-size:.938em; color:#69696b; padding-top:.4em;} .member_wrap .type_wrap .btn{ display:inline-block; *display:inline; zoom:1; margin-top:1em; padding:.6em 2.5em; background:#fff; border:1px solid #3f3f9f; border-radius:5px; color:#3f3f9f; transition:.2s;} .member_wrap .type_wrap .btn:hover{ background:#3f3f9f; color:#fff;} .member_wrap .terms_wrap .all_check{ padding:1em 0; border-bottom:1px dashed #bbb;} .member_wrap .terms_wrap > li{ padding-top:1.5em;} .member_wrap .terms_wrap > li:first-child{ padding-top:0;} .member_wrap .terms_wrap .tit{ margin-bottom:.6em; font-size:1.125em; color:#3c3c3d; font-weight:600;} .member_wrap .terms_wrap .c1{ color:#d31717;} .member_wrap .terms_wrap .all_check .xi {font-size:1em;} .member_wrap .finish_wrap{ text-align:center;} .member_wrap .finish_wrap .tit{ font-size:1.760em; color:#111; font-weight: 700; letter-spacing:-1px;} .member_wrap .finish_wrap .txt{ padding:.4em 0; color:#888; } .member_wrap .finish_wrap .join_fin{ font-size:.938em; color:#3c3c3d;} .member_wrap .finish_wrap .join_fin .th, .member_wrap .finish_wrap .join_fin .td{ padding:.8em 1.5em; border:1px solid #ddd; text-align:left;} .member_wrap .finish_wrap .join_fin .th{ width:10em; background:#f5f5f5;} .member_wrap .finish_wrap .join_fin .td{ width:auto; letter-spacing:0;} .member_wrap .finish_wrap .join_fin .th .mem_icon{ gap: .2em; font-size: 1.1em; font-weight: 600;} .member_btn_wrap{ margin:1.5em 0 0 -.4em;} .member_btn_wrap > *{ width:50%;} .member_btn_wrap .in{ margin-left:.4em;} .member_btn_wrap .in .input_st.s1 {border-color:#3167a6;} .member_agree .agree{ padding:3em; border:1px solid #ddd; border-top:2px solid #3c3c3d; font-size:.938em; color:#69696b; font-weight:300; line-height:1.4em;} .member_agree .agree.H{ padding:1.5em; border-top-width:1px; height:7em; overflow-y:scroll;} .member_agree .agree p{ padding:.5em 0;} .member_agree .agree *{ vertical-align:baseline;} .member_agree .agree strong{ color:#3c3c3d;} .member_agree .check{ padding:1em 2em; border:1px solid #ddd; border-top:none; border-radius:0 0 5px 5px; text-align:right; background:#f9f9f9} .member_agree h1{ color:#111; font-weight:600} .member_agree .check .xi {font-size:1em;} /**/ .page_step_wrap{ text-align:center;} .page_step_wrap .step{ display:inline-block; *display:inline; zoom:1;} .page_step_wrap .step > li .in{ position:relative; padding:0 1em; min-width:8em;} .page_step_wrap .step > li .in:before{ content:"\e940"; font-family:xeicon; position:absolute; font-size:2.000em; color:#c9c9c9; top:.2em; left:-.5em;} .page_step_wrap .step > li:first-child .in:before{ display:none;} .page_step_wrap .step > li .in > *{ position:relative; display:block;} .page_step_wrap .step > li .in .xi{ margin:.2em 0; font-size:2em; color:#ddd;} .page_step_wrap .step > li .in .xi:before{ position:relative; z-index:2;} .page_step_wrap .step > li .in .xi:after{ content:""; position:absolute; z-index:1; top:50%; left:50%; box-shadow: 1px 2px 3px rgba(0,0,0, .15); transform:translate(-50%, -50%); width:1.6em; height:1.6em; background:#f5f5f5; border-radius:100%;} .page_step_wrap .step > li .in .tt{ font-size:1.125em; color:#888;} .page_step_wrap .step > li.on .in .xi{ color:#fff;} .page_step_wrap .step > li.on .in .xi:after{ background:#3167a6;} .page_step_wrap .step > li.on .in .tt{ color:#3c3c3d; font-weight: 600;} .regular_mem .xi {font-size:1em;} .space_st{ display:inline-block; *display:inline; zoom:1; vertical-align:middle;} .space_st.Spst1{ margin-left:5px;} .space_st:first-child{ margin-left:0;} .board_search_wrap .search_tt {display:inline-block; margin-right:1em;} .board_search_wrap .download {margin-bottom:1em; font-size:1.5em;} .board_search_wrap .join_btn {margin-bottom:2em;} /* 회칙 */ .society .sub_p_tit .t2{ padding-top:10px;} .society .tbox .tt{ position:relative;} .society .tbox .tt .st{ font-size:.813em; position:absolute; bottom:-9px; right:0; color:#666;} .society .t_nav{ margin-bottom:3em; padding:0 2em;} .society .t_nav ul{ gap:.5em;/* margin-left:-15px; */} .society .t_nav ul li { flex: 1 1 calc( ( 100% - 3em) / 7)} .society .t_nav ul li .inner { text-align: center; color: #555; border: 1px solid var(--siteC); transition: all .3s; padding: 15px; border-radius:50px;} .society .t_nav ul li .inner:hover { border-color:var(--siteC); background: var(--siteC); color:#fff} .society .page_pd{ margin-bottom:3em;} .pn_btn{ display:block; border-radius:50px; border:1px solid #499324; color:#499324 !important; line-height:36px; width:135px; text-align:center; margin:0 auto; font-size:.938em; transition:.3s;} .pn_btn .xi{vertical-align:bottom;} .pn_btn:hover{ background:#499324; color:#fff !important;} .sub_p_tit{ margin-bottom:.75em; margin-top:4em} .sub_p_tit:first-child{ margin-top:0} .sub_p_tit .t2{ font-size:1.4em; color:#222; letter-spacing:-2px; word-spacing:2px;} .tbox{ border:1px solid #ddd; box-sizing:border-box; padding:2em; position:relative;} .tbox:after{ content:''; width:8%; height:2px; background:var(--siteC); position:absolute; top:-1px; left:0;} .tbox strong{ color:#000; font-size:1.1em;} .tbox .tt{ font-size:1.25em; color:#000;} .tbox .tw{ margin-bottom:1em; line-height:1.7;} .tbox.fst_01{ font-size:1.068em;} .tbox .tw .s_num{ padding-left: 1em;} .tbox .tw .rule_org{ display: inline-block; padding:1em 1em 2em; } .tbox .tw .rule_org img{ } /* privacy */ .popWrap.policy{ width:60vw; height: 70vh;} .iconz{margin-top: 2em;} .iconz > ul{width: 100%; gap: 1.5em;} .iconz > ul> li.lines{ flex:1; border: 1px solid #ccc; border-radius: 0.8em; padding: .8em; box-sizing: border-box;} .iconz > ul> li.lines> p> span{display: inline-block;text-align: center;width: 100%;} .iconz .img_mbox{ width: 50%;} .link .txt p{display: inline-block; width: 25%; text-align: left; line-height: 50px;} .threeline{padding: 2em;} .threeline.bg1 {background: var(--crGray);padding: 2em;border-radius: 0.8em;box-shadow: 0 3px 0.5em rgba(0,0,0,.15);} .threeline .threeflout{width: 100%; gap: 3.5em;} .threeline>.threeflout >li{width: calc(30% - 1em);} .threeline>.threeflout >li img{border-radius: .8em;} .pd1{ padding-top:2.5em;} .page_con.bg2{background-color: #eff7fc ; padding: 1em 0; } .page_con2{padding: 2em 0; } .con_idx {position: relative; width: 100%; /* border: 1px solid #ddd; */ border-top: none; border-radius: 0 0 .8em .8em; box-sizing: border-box;} .bd1 {position: relative; width: 100%; border: 1px solid #ddd; border-top: none; border-radius: 0 0 .8em .8em; box-sizing: border-box; height: 240px;} .con2_list {} .con1 {width: 650px; height: 300px;} .con2_list .wrap_idx {width: 100%; height: 100%;} .plus{display: inline-block; position: absolute; top: 4px;right: 16px; color: #003876;} .plus::after{content: ""; position: absolute; top: -5px;right: 37px; width: 1px; height: 59px; background-color: #ddd;} .plus .xi{color: #003876;} .con2_list .wrap_idx > ul {width: 100%; border: 1px solid #ddd; border-radius: .8em .8em 0 0; border-bottom: 0; position: relative; overflow: hidden; } .tab.st1 {background-color: #eee;width: 100%; line-height: 50px; } .con1> .wrap_idx > .st1 > li{background-color: #eee; text-align: center; border: 1px solid #ddd; border-left: none; border-top: 0;} /* .con_idx */ .con1> .wrap_idx > .st1 > li .tt {display: inline-block;cursor: pointer;font-size: 1.125em;color: #979797;padding: .2em 1.5em; } .con1> .wrap_idx > .st1 > li.on, .con1> .wrap_idx > .st1 > li.on .tt{background-color: #fff; color: #095282; text-align: center; cursor: pointer; border-bottom: none;} li.con1 .in .list > li .list_t {display: block;position: relative;padding-top: .7em;} li.con1 .in {/*padding: 0 0.5em;*/box-sizing: border-box;} li.con1 .in .list > li {display: block;position: relative;} li.con1 .in .list > li .list_t .txt {display: inline-block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width: 70%;color: #595959;font-size: .938em;padding-bottom: .8em;} li.con1 .in .list > li .list_t .date {position: absolute;top: 50%;right: .2em;transform: translateY(-50%);font-size: .875em;color: #848484;font-family: 'notokrR';} .f50{flex: 0 0 50%;} .f70{flex: 0 0 70%;} .con_idx >.list> li {padding: .7em 0;} /*main contents 4 con2_1*/ .brline{border: 1px solid #ddd; border-radius: 0.8em; width: 100%; height: 100%; box-sizing: border-box; } .con2{width:330px;height: 300px; position: relative; box-sizing: border-box;} .con2_1{width:240px;height: 300px; position: relative; box-sizing: border-box;} .con2_1 span{color: #26b2a5;} .con2 img{position: absolute;right: 10px;bottom: 10px;} .main_more.st2:hover{background: #ccc; color: #fff;} .btn4{width: 100%;height: 95px; background-color: #f5f5f5;border-radius: .8em; margin-bottom: .5em; /* cursor: pointer; */} .btn4:last-of-type{background-color: #b9fdf7;border-radius: .8em; margin-bottom: .0em;} /*img radius*/ .img_radius{width: 100%; border-radius: .8em;} .img_mbox{margin: 1em 0;width: 60%;}