@charset "utf-8"; /* CSS Document */ body { font-size:16px;} .box0{ width:1680px; max-width:94%; margin:0 auto;} .box1{ width:1200px; max-width:94%; margin:0 auto;} .pcHide{ display:none !important;} .moHide{} /*header*/ #header{ position:absolute; width:100%; z-index:999; top:0; left:0; right:0;} #header .top_wrap .logo, #header .utile_wrap, #header .gnb_wrap .gnb > li, #header .gnb_wrap .gnb > li .dp1{ height:5em;} #header .top_wrap .logo, #header .top_wrap .utile_wrap{ width:24.5em;} #header .top_wrap .logo > a{ display:block; padding-bottom:.375em;} #header .top_wrap .logo .img{ display:inline-block;} #header .top_wrap .logo .img img{ } #header .top_wrap .logo .img .logoA{} #header .top_wrap .logo .img .logoB{ display:none;} #header .utile_wrap{} #header .utile_wrap .menu > li .in{ position:relative; display:block; padding:0 .75em; color:#fff;} #header .utile_wrap .menu > li .in:before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:.625em; background:#fff; opacity:.2;} #header .utile_wrap .menu > li:first-child .in:before{ display:none;} #header .utile_wrap .menu > li .in .tt{ font-size:.875em;} #header .utile_wrap .menu > li .in .xi {font-size:1.9em;} #header .utile_wrap .menu > li .in:hover .tt{ text-decoration:underline;} #header .utile_wrap .all{ margin-left:1.75em;} #header .utile_wrap .all_btn{ position:relative; display:block; width:1.625em; height:1.125em;} #header .utile_wrap .all_btn .ham, #header .utile_wrap .all_btn .ham:before, #header .utile_wrap .all_btn .ham:after { display:block; width:100%; height:2px; background:#fff; transition:.2s;} #header .utile_wrap .all_btn .ham:before, #header .utile_wrap .all_btn .ham:after { content:""; position:absolute; right:0;} #header .utile_wrap .all_btn .ham:before{ top:50%;} #header .utile_wrap .all_btn .ham:after { top:100%;} #header .utile_wrap .all_btn:hover .ham:before{ width:80%;} #header .utile_wrap .all_btn:hover .ham:after { width:90%;} #header .utile_wrap .all_wrap{ position:fixed; top:0; bottom:0; left:0; right:0; opacity:0; visibility:hidden; transition:.3s;} #header .utile_wrap .all_wrap .wrap_bg{ position:absolute; top:0; bottom:0; left:0; right:0; background:#000; opacity:.4; cursor:pointer;} #header .utile_wrap .all_wrap .wrap_in{ position:absolute; top:0; right:0; width:100%; height:100%; max-width:25em; background:#0d1119; border-left:1px solid #000; box-shadow:-5px 0 .25em rgba(0,0,0,.3); transform:translateX(100%); transition:.3s} #header .utile_wrap .all_wrap .inner{ padding:1.5em 1.5em;} #header .utile_wrap .all_wrap .all_top{ position:relative;} #header .utile_wrap .all_wrap .all_top:before, #header .utile_wrap .all_wrap .all_top:after { content:""; display:block; position:absolute; bottom:0; left:1.25em; right:1.25em; height:1px;} #header .utile_wrap .all_wrap .all_top:before{ background:#000;} #header .utile_wrap .all_wrap .all_top:after { background:#fff; margin-bottom:-1px; opacity:.1;} #header .utile_wrap .all_wrap .all_top .all_logo{ flex:1;} #header .utile_wrap .all_wrap .all_top .all_logo > a{ display:block;} #header .utile_wrap .all_wrap .all_top .all_logo .img{ display:inline-block;} #header .utile_wrap .all_wrap .all_top .all_logo .img img{} #header .utile_wrap .all_wrap .all_top .close_btn{ display:block; width:2.25em; line-height:2.25em; border:2px solid rgba(255,255,255,.6); border-radius:100%; box-sizing:content-box; text-align:center; color:#fff; transition:.2s;} #header .utile_wrap .all_wrap .all_top .close_btn .xi{ font-size:1.375em;} #header .utile_wrap .all_wrap .all_top .close_btn:hover{ background:#fff; border-color:#fff; color:#000;} #header .utile_wrap .all_wrap .all_gnb .gnb, #header .utile_wrap .all_wrap .all_gnb .gnb .flex{ display:block;} #header .utile_wrap .all_wrap .all_gnb .gnb{ padding-bottom:2em;} #header .utile_wrap .all_wrap .all_gnb .gnb a{ color:#fff; text-align:left !important;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp1{ padding:1em 1.25em; border-top:2px solid #fff; border-bottom:1px dashed rgba(255,255,255,.1); transition:.2s;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp1 .tt{ font-size:1.063em;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2{ padding:1em 1.25em 2em 1.25em;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li {display:block;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li > a{ position:relative; padding:.5em 0; padding-left:1em; color:rgba(255,255,255,.7);} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li > a:before{ content:""; position:absolute; left:0; top:50%; margin-top:-1px; width:5px; height:2px; background:rgba(255,255,255,.4);} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li > a .tt{ font-size:.875em;} #header .utile_wrap .all_wrap .all_gnb .gnb > li:hover .dp1, #header .utile_wrap .all_wrap .all_gnb .gnb > li.on .dp1{ background:#fff; color:#111;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li:hover > a, #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li.on > a{ color:#fff;} #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li:hover > a .tt, #header .utile_wrap .all_wrap .all_gnb .gnb > li .dp2 > li.on > a .tt{ text-decoration:underline;} #header .utile_wrap .all.on .all_wrap{ opacity:1; visibility:visible;} #header .utile_wrap .all.on .all_wrap .wrap_in{ transform:translateX(0);} #header .gnb_wrap .gnb{ text-align:center;} #header .gnb_wrap .gnb > li{ position:relative} #header .gnb_wrap .gnb > li:before, #header .gnb_wrap .gnb > li:before{ left:50%} #header .gnb_wrap .gnb > li:after{ right:50%} #header .gnb_wrap .gnb > li .dp1{ color:#fff; padding:0 3.8em; position:relative; transition:.3s} #header .gnb_wrap .gnb > li .dp1 .tt{ position:relative; z-index:1; font-size:1.250em; font-family:'NotoSans'; font-weight:500;} #header .gnb_wrap .gnb > li .dp2{ position:absolute; left:50%; margin-left:-6rem; width:12rem; opacity:0; visibility:hidden; border:1px solid #ddd; background:#fff; display:block !important;} #header .gnb_wrap .gnb > li .dp2 > li{ display:block} #header .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; color:#888; text-align:center; padding:1em .5em; border-top:1px dotted #999;} #header .gnb_wrap .gnb > li .dp2 > li:first-child > a{ border-top:none} #header .gnb_wrap .gnb > li .dp2 > li > a .vm{ font-size:1em; position:relative;} #header .gnb_wrap .gnb > li:hover .dp1, #header .gnb_wrap .gnb > li.on .dp1{} #header .gnb_wrap .gnb > li:hover:before, #header .gnb_wrap .gnb > li.on:before, #header .gnb_wrap .gnb > li:hover:after, #header .gnb_wrap .gnb > li.on:after{ opacity:1; width:50%} #header .gnb_wrap .gnb > li:hover .dp1:after, #header .gnb_wrap .gnb > li.on .dp1:after{ opacity:1} #header .gnb_wrap .gnb > li:hover .dp2{ opacity:1; visibility:visible} #header .gnb_wrap .gnb > li .dp2 > li:hover > a{ color:#3167a6} #header .gnb_wrap .gnb > li .dp2:after{ content:""; position:absolute; left:0; top:-3px; width:0; height:3px; background:#003876; z-index:1; transition:.3s;} #header .gnb_wrap .gnb > li:hover .dp2:after, #header .gnb_wrap .gnb > li.on .dp2:after{ width:100%;} #header.gnbOpen{ background:#fff; box-shadow:3px 0 5px rgba(0,0,0,.2); } #header.gnbOpen .top_wrap .logo .img .logoA{ display:none;} #header.gnbOpen .top_wrap .logo .img .logoB{ display:block;} #header.gnbOpen .top_wrap .logo .tt{ color:#555;} #header.gnbOpen .utile_wrap .menu > li .in{ color:#555;} #header.gnbOpen .utile_wrap .menu > li.point .in{ color:#4562cf;} #header.gnbOpen .utile_wrap .menu > li .in:before{ background:#000;} #header.gnbOpen .utile_wrap .all_btn .ham, #header.gnbOpen .utile_wrap .all_btn .ham:before, #header.gnbOpen .utile_wrap .all_btn .ham:after { background:#333;} #header.gnbOpen .gnb_wrap .gnb > li .dp1{ color:#222;} #header.gnbOpen .gnb_wrap .gnb > li .dp1:after{ background:#4562cf;} #header.inLogin{ background:#fff; box-shadow:3px 0 5px rgba(0,0,0,.2); } #header.inLogin .top_wrap .logo .img .logoA{ display:none;} #header.inLogin .top_wrap .logo .img .logoB{ display:block;} #header.inLogin .top_wrap .logo .tt{ color:#555;} #header.inLogin .utile_wrap .menu > li .in{ color:#555;} #header.inLogin .utile_wrap .menu > li.point .in{ color:#4562cf;} #header.inLogin .utile_wrap .menu > li .in:before{ background:#000;} #header.inLogin .utile_wrap .all_btn .ham, #header.inLogin .utile_wrap .all_btn .ham:before, #header.inLogin .utile_wrap .all_btn .ham:after { background:#333;} #header.inLogin .gnb_wrap .gnb > li .dp1{ color:#222;} #header.inLogin .gnb_wrap .gnb > li .dp1:after{ background:#4562cf;} .scroll #header.active {background:inherit; box-shadow:none} /**/ .mainScroll{ position:absolute; right:5em; bottom:4em; z-index:100} .mainScroll .line{ display:block; width:1px; height:10em; background:#fff} .mainScroll .tt{ font-family:sans-serif; color:#fff; word-spacing:2px; letter-spacing:1px; transform:rotate(90deg); transform-origin:0 0; position:absolute; left:1.25em; top:0; width:10em; padding:0 .25em; box-sizing:border-box; animation-name: downAni; animation-duration: 3s; animation-iteration-count: infinite} .mainScroll .tt > i{ font-size:.625em} @keyframes downAni{ 70% {margin-top:0} 90% {margin-top:.5em} 100% {margin-top:0} } /*footer*/ #footer{} #footer .gotop.top_st{ position:fixed; z-index:1; width:4em; line-height:4em; height:4em; right:3em; bottom:3em; text-align:center; border-radius:50%; background:#fff; color:#444; transition:.3s; transform:translateY(7em); opacity:0; box-shadow:0 0 1em .125em rgba(0,0,0,.3); z-index:100;} #footer .gotop.top_st .xi{ font-size:2em} #footer .gotop.top_st:hover{ background:#003f87; color:#fff} .scroll #footer .gotop.top_st{ transform:translateY(0); opacity:1} .main #footer .gotop.top_st {display:none} #footer .foot_wrap{ background:#333;} #footer .foot_wrap .box1{ position:relative} #footer .foot_wrap .menu_W { border-bottom:1px solid rgba(255,255,255,.1)} #footer .foot_wrap .con{} #footer .foot_wrap .con .logo img{ height:80px; opacity:.6;} #footer .foot_wrap .con .copy{ margin-top:3em; font-size:.688em; color:#fff; opacity:.5; letter-spacing:0; text-transform:uppercase; font-family:'Ms';} #footer .foot_wrap .menu_wrap{ padding:1em 0 ;} #footer .foot_wrap .info_wrap{ padding:1.5em 0 3em 0; flex:1 1 1%;} #footer .foot_wrap .info_wrap > li{ line-height:1.7; font-size:.938em;} #footer .foot_wrap .info_wrap > li .tt{ display:inline-block; color:#fff; font-size:.938em; font-family:'NotoSans'; font-weight:400; margin-right:2em;} #footer .foot_wrap .info_wrap > li .tit{ color:#fff;} #footer .foot_wrap .info_wrap > li a:hover{ text-decoration:underline;} #footer .foot_wrap .menu_wrap .menu > li > a{ display:block; margin-right:1.5em; font-size:.938em; color:#fff; padding:1em 0 ;} #footer .foot_wrap .menu_wrap .menu > li:first-child > a:before{ display:none;} #footer .foot_wrap .menu_wrap .menu > li > a:hover{ text-decoration:underline;} #footer .foot_wrap .bottom_wrap .logo {margin-top:-50px;} #footer .foot_wrap .hanwithLogo{ position:absolute; right:290px} #footer .goTop{ position:absolute; right:0; background:rgba(0,0,0,.3); width:3.75em; color:#fff; margin-left:1em; margin-top:1.25em; top:0; height:50px} #footer .goTop .tt{ display:block; font-size:.688em} #footer .goTop .vm{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; max-width:100%; height:auto; white-space:normal} #footer .goTop:hover{ background:#003876} #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} .fAmily_wrap {border-top:1px solid #ddd} .family_wrap{ padding:1em 0em; background:#fff;} .family_wrap .control{ width:14%; position:relative; margin-top:1.8%;} .family_wrap .family { width:86%;} .family_wrap .control .tit{color:#222; display:inline-block; padding-top:4px; font-size:1.125em; } .family_wrap .control .arrow {position:absolute; right:10px; top:0;} .family_wrap .control .arrow > li{ display:inline-block; width:1.5em; line-height:1.5em; background:#fff; text-align:center; cursor:pointer; border:1px solid #ddd;} .family_wrap .control .arrow > li .xi{ font-size:1.125em; color:#222;} .family_wrap .control .arrow > li:hover{ background:#003876; transition:.3s;} .family_wrap .control .arrow > li:hover .xi {color:#fff;} .family_wrap .control .arrow .slick-hidden{ display:inline-block;} .family_wrap .family .item > a{ display:block;} .family_wrap .family .item .in{height:4.375em;} .family_wrap .family .item .in img{ max-width:90%; max-height:80%;} .family_wrap .family .item .in:hover{ border-color:#3c4968;} /*main*/ .mainSlider_wrap{ position:relative;} .mainSlider{ position:relative; background:#f5f5f5} .mainSlider .el{ height:49em; position:relative; overflow:hidden} .mainSlider .el .bg{ position:absolute; right:0; bottom:0; width:100%; height:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; } .mainSlider .el .box1{ position:relative} .mainSlider .el .slogan{ position:absolute; z-index:2; left:0; top:12em; width:100%; transform:translateY(1em); opacity:0; text-align:center; transition:1s; transition-timing-function:ease;} .mainSlider .el .slogan .tt{ color:#fff;} .mainSlider .el .slogan .t1{ font-size:1.375em; font-weight:500;} .mainSlider .el .slogan .t1:after{ content:""; display:block; margin:1.25em auto 1.125em auto; width:1.75em; height:2px; background:#fff;} .mainSlider .el .slogan .t2{ font-size:3.000em; font-weight:300; letter-spacing:-1px;} .mainSlider .el .slogan .bold{ font-weight:700;} .mainSlider .el.swiper-slide-active .slogan{ transform:translateY(0); opacity:1; transition:1s; transition-delay:.5s; transition-timing-function:ease} .mainControl{ position:absolute; left:0; z-index:100; width:100%; bottom:6em} .mainControl .mainSlider-btn{ width:2.5em; line-height:2.5em; cursor:pointer; color:#fff; border:1px solid #fff; outline:none; text-align:center; transition:.3s; margin:0 .25em} .mainControl .mainSlider-btn .xi{ font-size:1.5em} .mainControl .mainSlider-btn:hover{ color:#6666dd; border-color:#6666dd; opacity:1} .mainControl .mainPauseWrap{ margin-left:1em} .mainControl .mainPauseWrap .mainSlider-play{ display:none; background:#6666dd; color:#fff; border-color:transparent} .mainControl .mainPauseWrap.pause .mainSlider-play{ display:block} .mainControl .mainPauseWrap.pause .mainSlider-pause{ display:none} .mainPaging{ position: absolute; z-index:100; left:50%; bottom:7em; transform:translateX(-50%);} .mainPaging .mainSlider-pagination > span{ border-radius:0; width:1.25em; height:1.25em; position:relative; background:#fff !important; opacity:1 !important; font-size:.5em; margin-right:.5em} .mainPaging .mainSlider-pagination > span:after{ content:""; position:absolute; left:0; top:0; width:0; height:100%; background:#003876; transition:0} .mainPaging .mainSlider-pagination > span.swiper-pagination-bullet-active{ width:8em} .mainPaging .mainSlider-pagination > span.swiper-pagination-bullet-active:after{ width:100%; transition:5s !important} /*main_con1*/ .main_Con1_Wrap {margin-bottom:5em;} .main_Con1_Wrap .ti_w {text-align:center; padding:60px 0 50px 0;} .main_Con1_Wrap .ti_w .t1 {font-family:'NotoSans'; font-weight:700; color:#171717; font-size:1.875em;} .main_Con1_Wrap .ti_w .t2 {font-family:'NotoSans'; font-weight:300; color:#8f8f8f; font-size:1.063em; padding:15px 0 25px 0; letter-spacing:-.3px;} .main_Con1_Wrap .ti_w .line {background:#171717; width:30px; height:2px; margin:0 auto;} .main_Con1_Wrap .con1 {} .main_Con1_Wrap .con1 .list {} .main_Con1_Wrap .con1 .list > li {width:25%;} .main_Con1_Wrap .con1 .list > li .inner {} .main_Con1_Wrap .con1 .list > li .inner .tw {padding:2em 1em 1em 1em; text-align:center;} .main_Con1_Wrap .con1 .list > li .inner .tw .ti {color:#333; font-size:1.563em; font-family:'NotoSans'; font-weight:700;} .main_Con1_Wrap .con1 .list > li .inner .tw .tx {color:#767373; padding:15px 0 30px 0; font-size:.875em; font-weight:400; line-height:1.5;} .main_Con1_Wrap .con1 .list > li .inner .icon {display:block; text-align:center} .main_Con1_Wrap .con1 .list > li .inner .more_bTn {border:1px solid #5c5c5c; padding:.5em 3em; display:inline-block} .main_Con1_Wrap .con1 .list > li .inner .more_bTn .tt {color:#5c5c5c; font-size:.875em; vertical-align:middle} .main_Con1_Wrap .con1 .list > li .inner .more_bTn .xi {vertical-align:middle; color:#5c5c5c; font-size:1.063em; padding-left:5px} .main_Con1_Wrap .con1 .list > li .inner .more_bTn:hover {transition:.3s; background:#003876} .main_Con1_Wrap .con1 .list > li .inner .more_bTn:hover .tt, .main_Con1_Wrap .con1 .list > li .inner .more_bTn:hover .xi {transition:.3s; color:#fff} .main_Con1_Wrap .con1 .list > li.bg1 {background:#ffe9d6} .main_Con1_Wrap .con1 .list > li.bg2 {background:#e3efff} .main_Con1_Wrap .con1 .list > li.bg3 {background:#fff8d6} .main_Con1_Wrap .con1 .list > li.bg4 {background:#ebffe3} .main_Con2_Wrap {position:relative; background-repeat:no-repeat; background-size:cover; background-position:center center; background-image:url(../images/main/con2_bg.jpg);/* height:420px; margin-bottom:25em;*/ height:240px; margin-bottom:5em;} .main_Con2_Wrap .ti_w {text-align:center; padding:65px 0 50px 0} .main_Con2_Wrap .ti_w .ti {color:#fff; font-family:'Nanum Myeongjo'; line-height:1.6; vertical-align:baseline; letter-spacing:-1px;} .main_Con2_Wrap .ti_w .t1 {font-weight:400; font-size:1.688em} .main_Con2_Wrap .ti_w .t2 {font-weight:800; font-size:2.250em} .main_Con2_Wrap .con2 {background:#fff; padding:3em;} .main_Con2_Wrap .con2 .list {margin:0 0 0 -2em} .main_Con2_Wrap .con2 .list > li {width:50%;} .main_Con2_Wrap .con2 .list > li .inner {margin:0 0 0 2em;} .main_Con2_Wrap .con2 .list > li .inner .title {margin-bottom:1em; position:relative;} .main_Con2_Wrap .con2 .list > li .inner .title .tit { font-weight:700; font-size:1.438em; color:#3a3a3a;} .main_Con2_Wrap .con2 .list > li .inner .title .xi {position:absolute; right:0; top:0; color:#3a3a3a; font-size:1.7em;} .main_Con2_Wrap .con2 .list > li .inner .title .xi:hover {transform:rotate(90deg); transition:.2s; color:#003876} .main_Con2_Wrap .con2 .list > li .inner .in {border:1px solid #e6e6e6; padding:2em; min-height:280px;} .main_Con2_Wrap .con2 .list > li .inner .top_w{cursor:pointer} .main_Con2_Wrap .con2 .list > li .inner .top_w .t_con{flex:1; min-width:0; margin-left:2em;} .main_Con2_Wrap .con2 .list > li .inner .top_w .t_con .tit{font-weight:500; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#4a4a4a; font-size:1em; padding-bottom:10px;} .main_Con2_Wrap .con2 .list > li .inner .top_w .t_con .tit:after{ content:'N'; display:inline-block; width:20px; line-height:20px; background:#0b65c2; text-align:center; color:#fff; border-radius:50%; font-size:.750em; margin-left:8px;} .main_Con2_Wrap .con2 .list > li .inner .top_w .t_con .txt{ font-size:.813em; color:#828282; font-weight:400; height:30px; overflow:hidden;} .main_Con2_Wrap .con2 .list > li .inner .top_w .date{ width:4.5em; height:4.5em; background:#f1f1f1; text-align:center;} .main_Con2_Wrap .con2 .list > li .inner .top_w .date .dd{ display:block; font-size:1.375em; color:#003876; font-weight:700;} .main_Con2_Wrap .con2 .list > li .inner .top_w .date .ym{ font-size:.875em; color:#646464; font-weight:500;} .main_Con2_Wrap .con2 .list > li .inner .top_w .t_con .tit:hover {color:#003876; transition:.3s} .main_Con2_Wrap .con2 .list > li .inner .top_w .t_con .txt:hover {color:#003876; transition:.3s} .main_Con2_Wrap .con2 .list > li .inner .bot_w{padding-top:2em; border-top:1px solid #ddd; margin-top:2em;} .main_Con2_Wrap .con2 .list > li .inner .bot_w li{ font-size:.938em; margin-bottom:19px;} .main_Con2_Wrap .con2 .list > li .inner .bot_w li .tx{ width:80%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-weight:500; color:#595959; font-size:.938em; padding-left:.7em; position:relative;} .main_Con2_Wrap .con2 .list > li .inner .bot_w li .tx:before {position:absolute; content:""; width:3px; height:3px; left:0; top:5px; border-radius:50%; background:#0b65c2} .main_Con2_Wrap .con2 .list > li .inner .bot_w li .tx:hover{ text-decoration:underline; cursor:pointer;} .main_Con3_Wrap {background-repeat:no-repeat; background-size:cover; background-position:center center; background-image:url(../images/main/con3_bg.jpg); margin-top:20em;} .main_Con3_Wrap .inner {padding:3em 0;} .main_Con3_Wrap .tit {color:#fff; text-align:center; font-family:'Nanum Myeongjo'; font-weight:800; font-size:2.5em; padding:0 0 40px 0;} .main_Con3_Wrap .con3 {} .main_Con3_Wrap .con3 .list {margin:0 0 0 -1em;} .main_Con3_Wrap .con3 .list > li {width:25%;} .main_Con3_Wrap .con3 .list > li .inner {margin:0 0 0 1em; background:#fff; text-align:center; padding:2em 1em;} .main_Con3_Wrap .con3 .list > li .inner .icon {margin-bottom:20px;} .main_Con3_Wrap .con3 .list > li .inner .t1 {color:#3a3a3a; font-size:1.438em; font-weight:700;} .main_Con3_Wrap .con3 .list > li .inner .line {display:inline-block; margin:15px auto; background:#0b65c2; width:20px; height:1px;} .main_Con3_Wrap .con3 .list > li .inner .t2 {color:#525252; font-size:.875em; font-weight:400; line-height:1.4;} .main_Con3_Wrap .con3 .list > li .inner .btn_W {margin-top:25px;} .main_Con3_Wrap .con3 .list > li .inner .btn_W .bTn {display:inline-block; border-radius:4px; border:1px solid #254069; width:120px; line-height:40px; margin-right:5px;} .main_Con3_Wrap .con3 .list > li .inner .btn_W .bTn:last-child {margin-right:0;} .main_Con3_Wrap .con3 .list > li .inner .btn_W .bTn .tt {font-size:.938em; color:#254069;} .main_Con3_Wrap .con3 .list > li .inner .btn_W .bTn:hover {background:#254069; transition:.3s;} .main_Con3_Wrap .con3 .list > li .inner .btn_W .bTn:hover .tt {color:#fff; } /*contents*/ #contents{} #contents .subtop_wrap .sub_visual{ height:23em; position:relative; overflow:hidden} #contents .subtop_wrap .sub_visual .bg{ position:absolute; left:0; top:0; width:100%; height:100%} #contents .subtop_wrap .sub_visual .wrap_in{ position:relative; height:100%} #contents .subtop_wrap .sub_visual .wrap_in .sub_slogan{ flex:1 1 auto} #contents .subtop_wrap .sub_visual .wrap_in .sub_menu{ flex:0 0 auto} #contents .sub_slogan{ color:#fff; transform:translateY(2em); opacity:0} #contents .sub_slogan .in{ width:100%; text-align:center} #contents .sub_slogan .t1{ font-size:2.5em; font-weight:700} .load #contents .sub_slogan{ transform:translateY(0); opacity:1; transition:1s} #contents .sub_menu{ padding-bottom:0} #contents .sub_menu .gnb{ flex-wrap: wrap} #contents .sub_menu .gnb > li{ width:100%} #contents .sub_menu .gnb > li .dp2{justify-content:center;overflow:hidden;} #contents .sub_menu .gnb > li .dp2 > li{ flex:1 1 50%; max-width:50%} #contents .sub_menu .gnb > li .dp2 > li > a{ display:block; height:4.25em; background:#fff; color:#666; transition:.3s; position:relative; border-bottom:1px solid #ddd; margin-top:.5em} #contents .sub_menu .gnb > li .dp2 > li > a:after{ content:""; position:absolute; left:-1px; top:25%; height:50%; width:1px; background:#ddd} #contents .sub_menu .gnb > li .dp2 > li > a .vm{ font-family: 'NotoSans'; font-weight:500; font-size:1.125em} #contents .sub_menu .gnb > li .dp2 > li:hover > a{ color:#003876} #contents .sub_menu .gnb > li .dp2 > li.on{ z-index:1; box-shadow:0 0 1em .25em rgba(0,0,0,.3)} #contents .sub_menu .gnb > li .dp2 > li.on > a{ color:#003876; border-bottom:1px solid #fff; margin-top:.5em} #contents .sub_menu .gnb > li .dp2 > li.on > a:after{ background:#fff; width:100%; height:3px; top:-3px; left:0} .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} #contents .sub_page_menu{ position:absolute; left:0; right:0; bottom:0;} #contents .sub_page_menu .menu{ background:#ebf0f4;} #contents .sub_page_menu .menu .tit{ height:4em;} #contents .sub_page_menu .menu .home .tit{ width:4em; background:#003876; color:#fff;} #contents .sub_page_menu .menu .def{ position:relative; cursor:pointer;} #contents .sub_page_menu .menu .def > .tit{ position:relative; min-width:16em; padding:0 2.5em 0 2em; border-right:1px solid #d4d5d8;} #contents .sub_page_menu .menu .def > .tit .tt{ font-size:1.125em;} #contents .sub_page_menu .menu .def > .tit .arrow{ position:absolute; right:.5em; top:50%; margin-top:-.5em; transition:.2s;} #contents .sub_page_menu .menu .def > .tit .arrow:before{ content:"\e942";} #contents .sub_page_menu .menu .def:hover > .tit, #contents .sub_page_menu .menu .def.on > .tit{ background:#1b2435; color:#fff;} #contents .sub_page_menu .menu .def.on > .tit .arrow{ transform:rotate(-180deg);} #contents .sub_page_menu .menu .def .gnb{ position:absolute; top:100%; left:0; right:1px; padding:.5em; background:#fff; border:solid #1b2435; border-width:0 1px 1px 1px; display:none;} #contents .sub_page_menu .menu .def .gnb .flex{ display:block;} #contents .sub_page_menu .menu .def .gnb li > a{ position:relative; padding:.625em 1em; border-top:1px solid #ecf0f4; text-align:left !important; color:#444;} #contents .sub_page_menu .menu .def .gnb li:first-child > a{ border-top:none;} #contents .sub_page_menu .menu .def .gnb li > a .tt{ font-size:.938em;} #contents .sub_page_menu .menu .def .gnb li.plus > a{ padding-right:2.5em;} #contents .sub_page_menu .menu .def .gnb li.plus > a:after{ content:"\e913"; font-family:xeicon; color:#333; position:absolute; top:.5em; right:.5em; width:1.5em; height:1.5em; line-height:1.5em; background:#fff; border-radius:100%; text-align:center;} #contents .sub_page_menu .menu .def .gnb li:hover > a{ background:#ebf0f4;} #contents .sub_page_menu .menu .def .gnb li.on > a{ background:#003876; color:#fff;} #contents .sub_page_menu .menu .def .gnb > li, #contents .sub_page_menu .menu .def .gnb > li .dp1, #contents .sub_page_menu .menu .def .gnb > li .dp2, #contents .sub_page_menu .menu .def .gnb > li .dp2 > li, #contents .sub_page_menu .menu .def .gnb > li .dp2 > li > a, #contents .sub_page_menu .menu .def .gnb > li .dp3{ display:none;} #contents .sub_page_menu .menu .def .gnb li.on{ display:block !important;} #contents .sub_page_menu .menu .depth_1 .gnb > li, #contents .sub_page_menu .menu .depth_1 .gnb > li .dp1, #contents .sub_page_menu .menu .depth_2 .gnb > li .dp2, #contents .sub_page_menu .menu .depth_2 .gnb > li .dp2 > li, #contents .sub_page_menu .menu .depth_2 .gnb > li .dp2 > li > a, #contents .sub_page_menu .menu .depth_3 .gnb > li .dp2, #contents .sub_page_menu .menu .depth_3 .gnb > li .dp3{ display:block;} #contents .sub_page_menu .menu .def.on .gnb{ display:block;} #contents .con_page_top{ padding:1.75em 0 1.5em 0; border-bottom:1px solid #ebf0f4;} #contents .con_page_top .con_tit{ position:relative; padding-top:.75em;} #contents .con_page_top .con_tit:before{ content:""; display:block; position:absolute; top:0; left:.125em; width:1.5em; height:2px; background:#003876;} #contents .con_page_top .con_tit .tit{ font-size:1.875em; color:#222;} #contents .con_page_top .con_nav{ padding-right:.25em;} #contents .con_page_top .con_nav > li{ color:#888;} #contents .con_page_top .con_nav > li:before{ content:"\e93e"; font-family:xeicon; display:inline-block; vertical-align:middle; padding:0 .5em; font-size:.750em; color:#999;} #contents .con_page_top .con_nav > li:first-child:before{ visibility:hidden;} #contents .con_page_top .con_nav > li:last-child{ color:#333; } #contents .con_page_top .con_nav > li > *{ display:inline-block;} #contents .con_page_top .con_nav > li .home{ font-size:.813em; color:#555;} #contents .con_page_top .con_nav > li .tt{ font-size:.875em;} #contents .doc{ padding:3em 0 12em 0;} /**/ .point_Blue {color:#003876; vertical-align:baseline !important;} .point_Sky {color:#4562cf; vertical-align:baseline !important;} /**/ .page_Sec1 {margin-top:1em !important;} .page_Sec2 {margin-top:2em !important;} .page_Sec3 {margin-top:3em !important;} .page_Sec4 {margin-top:4em !important;} .page_Sec5 {margin-top:5em !important;} .page_Sec6 {margin-top:6em !important;} .page_Sec7 {margin-top:7em !important;} .page_Sec8 {margin-top:8em !important;} .page_Sec9 {margin-top:9em !important;} /**/ .hover_St:hover {transition:.3s; background:#fdb707 !important; color:#fff !important; } /**/ .page_col{ margin-bottom:.75em;} .page_col *{ margin-bottom:0 !important;} .page_col{ margin-top:3em;} .page_col:first-child{ margin-top:0;} .page_col > .tit, .page_col > .con{ padding:2em 0;} .page_col > .con{ flex:1; border-top:2px solid #e8e8e8; margin-left:2em;} .page_col > .tit{ width:18em; position:relative; border-top:2px solid #e8e8e8} .page_col > .tit:before, .page_col > .tit:after { content:""; position:absolute; top:-2px; height:2px; width:1em;} .page_col > .tit:before{ left:0; background:#003876;} .page_col > .tit:after { left:.8em; background:#44afd3;} .page_col > .tit.none {width:100%;} .page_tit{ margin-bottom:.75em; margin-top:3em} .page_tit:first-child{ margin-top:0} .page_tit .xi {vertical-align:baseline !important; font-size:1.5em;} .page_tit .tt{ font-size:1.5em; color:#222; letter-spacing:-1px; margin-bottom:.5em; font-family:'NotoSans'; font-weight:500; vertical-align:baseline !important;} .page_tit2{ margin-bottom:.75em; margin-top:3em} .page_tit2:first-child{ margin-top:0} .page_tit2 > .tit{padding:0 0 .5em 0; position:relative; border-bottom:2px solid #e8e8e8} .page_tit2 > .tit:before, .page_tit2 > .tit:after { content:""; position:absolute; bottom:-2px; height:2px; width:1em;} .page_tit2 > .tit:before{ left:0; background:#003876;} .page_tit2 > .tit:after { left:.8em; background:#44afd3;} .page_tit2 .tt{ font-size:1.5em; color:#222; letter-spacing:-1px; margin-bottom:.5em; font-family:'NotoSans'; font-weight:500; vertical-align:baseline !important;} /**/ .memo_st{ /*background:#f3f7f9; border:1px solid #ddd; padding:.750em 1em;*/} .memo_st.bg1 {background:#fafafa} .memo_st:first-child{ margin-bottom:1em;} .memo_st:last-child { margin-top:1em;} .memo_st > p .xi {color:#aaa; font-size:1em; line-height:1;} .memo_st > p .tt{margin-top:.5em; padding:0 0 .125em 0; line-height:1.4; font-size:.875em; color:#444;} .memo_st > p .tt:first-child{ margin-top:0;} .memo_st > p .tt * { vertical-align:baseline;} /**/ .page_link_Btn {display:inline-block; background:#003876; border-radius:5px; padding:.45em .8em; margin-left:5px;} .page_link_Btn .link_Btn_tt {color:#fff; font-size:.8em;} /**/ .page_list {/*background:#fafafa; border:1px solid #eee; padding:1.5em;*/ border:1px solid #e6e6e6; padding:1.5em 1.75em; border-radius:4px;} .page_list .tt {color:#444; font-size:.938em; padding-bottom:.8em;} .page_list .tt:last-child {padding-bottom:0;} .page_list2 {/*margin-top:1em; background:#fafafa; border:1px solid #eee; padding:1.5em;*/ margin-top:1em; border:1px solid #e6e6e6; padding:1.5em 1.75em; border-radius:4px;} .page_list2:first-child {margin-top:0;} .page_list2 > dt {font-size:1.125em; font-family:'NotoSans'; font-weight:500; color:#003876; padding-bottom:1em;} .page_list2 > dd {padding-bottom:.7em; } .page_list2 > dd .tx {color:#444; font-size:.938em; padding-bottom:.8em; position:relative; padding-left:.5em;} .page_list2 > dd .tx:before {position:absolute; content:""; left:0; top:6px; width:2px; height:2px; border-radius:50%; background:#003876} .page_list2 > dd .tx:last-child {padding-bottom:0;} .page_list3 {margin-top:1em;} .page_list3 > dt {} .page_list3 > dt > p {padding-bottom:1.3em; color:#003876; line-height:1.5; font-size:.938em; padding-bottom:.8em; font-family:'NotoSans'; font-weight:500;} .page_list3 > dd {margin-left:1em;} .page_list3 > dd .tx {color:#444; font-size:.938em; padding-bottom:.8em;} .page_list3 > dd .tx:last-child {padding-bottom:0;} .page_list4 {border:1px solid #e6e6e6; padding:1.5em 1.75em; border-radius:4px;} .page_list4 .ti {color:#444; font-size:.938em; padding-bottom:1em;} .page_list4 .tt {color:#444; font-size:.938em; padding-bottom:.8em; padding-left:.5em; position:relative;} .page_list4 .tt:before {position:absolute; content:""; left:0; top:9px; width:2px; height:2px; border-radius:50%; background:#003876} .page_list4 .tt:last-child {padding-bottom:0;} /**/ .page_num_list {/*margin-top:.6em; padding:1.5em; border:1px dashed #cfd8e2; background:#fff*/} .page_num_list .num_list {margin-top:1em; line-height:1.4;} .page_num_list .num_list:first-child {margin-top:0;} .page_num_list .num_list > li {padding-top:1em; /*border-top:1px dashed #c6ced7*/} .page_num_list .num_list > li:first-child {border-top:none; padding-top:0; margin-top:0;} .page_num_list .num_list > li .in {position:relative; padding:0 0 .4em 0;} .page_num_list .num_list > li .in .ti {} .page_num_list .num_list > li .in .ti .tit {color:#003876; font-family:'NotoSans'; font-weight:500; font-size:.938em; line-height:1.5;} .page_num_list .num_list > li .in .ti .titt {display:block; color:#222; font-size:.938em; line-height:1.5; padding-top:1.063em;} .page_num_list .num_list > li .in .ti .txt {color:#666; font-size:.938em; margin-top:.5em; display:block;} /**/ .page_tbl_wrap {margin-top:2em;} .page_tbl_wrap.in_St {margin-top:0;} .page_tbl_wrap .page_tbl_tit {color:#003876; font-size:.938em; padding-bottom:.8em;} /**/ .map_view{ border-top:3px solid #ddd; box-shadow:0 .25em .5em rgba(0,0,0,.2); transition:.3s; padding:1em; border-radius:0 0 1em 1em} .map_view .tt {padding-bottom:10px; font-size:1.063em; color:#222; letter-spacing:-2px; vertical-align:middle;} .map_view .xi {vertical-align:middle; font-size:1.188em; padding-right:5px;} .map_view:hover{ border-color:#0b4790 } .map_info1 {overflow:hidden; margin-bottom:20px; box-shadow:2px 3px 8px -1px #a4a4a4; padding:1.5em; margin-top:1em; box-sizing:border-box; border-radius:1em} .map_info1 .t1 span { color:#666; display:inline-block; margin-right:20px; font-size:.938em;} .map_info1 .t1 span.st {margin-bottom:15px;} .map_info1 .t1 span:last-child { margin-right:0;} .map_info1 .t1 .xi { font-size:1em; color:#fff; margin-right:5px; border-radius:50%; width:1.8em; height:1.8em; line-height:1.8em; text-align:center; background:#003876} .map_info1 .t1 span .stop1 {background:#187ce8; color:#fff; text-align:center; border-radius:50px; padding:.5em 1em; font-size:.813em;} /**/ .person_list{ margin:2em 0 0 -1em} .person_list > li{width:50%;} .person_list .wrap_in{ margin:0 0 1em 1em; border:1px solid #ddd; box-sizing:border-box;} .person_list .wrap_in .img_wrap{ width:40%;} .person_list .wrap_in .img_wrap .in {padding:1em; box-sizing:border-box; flex:1} .person_list .wrap_in .img_wrap .vm_wrap:before{/* vertical-align:bottom*/} .person_list .wrap_in .info_wrap{ width:60%; position:relative;} .person_list .wrap_in .info_wrap:before{ content:""; position:absolute; left:0; top:0; width:1px; height:100%; background:#ddd} .person_list .wrap_in .info_wrap .info2{ padding:1.5em} .person_list .wrap_in .info_wrap .info2 .t1{ color:#222; font-size:1.063em} .person_list .wrap_in .info_wrap .info2 .t2{ margin:.125em 0 .375em 0; } .person_list .wrap_in .info_wrap .info2 .t2 .t2_in1 {font-family:'NotoSans'; font-weight:700; color:#222; font-size:1.8em; vertical-align:baseline;} .person_list .wrap_in .info_wrap .info2 .t2 .t2_in2 {vertical-align:baseline; font-family:'NotoSans'; font-weight:400; color:#666; font-size:1.188em;} .person_list .wrap_in .info_wrap .info2 .t3{ font-family:'NotoSans'; font-weight:500; color:#0c66c6; margin-bottom:.5em; margin-top:1.5em;} .person_list .wrap_in .info_wrap .info2 .t4{ color:#888; line-height:1.5; font-size:.938em; position:relative; padding-left:.6em;} .person_list .wrap_in .info_wrap .info2 .t4:before {position:absolute; content:""; width:3px; height:3px; border-radius:50%; background:#003876; left:0; top:10px;} .person_list .wrap_in .info_wrap .info2 .t4 > *, .person_list .wrap_in .info_wrap .info2 .t4 p, .person_list .wrap_in .info_wrap .info2 .t4 span, .person_list .wrap_in .info_wrap .info2 .t4 font { font-family:'NotoSans' !important; color:#888 !important; line-height:1.5em; font-size:14px !important} .person_list.wd3 {margin:0 0 0 -.6em;} .person_list.wd3 > li {width:33.33%;} .person_list.wd3 .wrap_in {margin:0 0 .6em .6em;} .person_list.wd3 .wrap_in .info_wrap .info2 .t2 .t2_in1 {font-size:1.6em;} .person_list.wd3 .wrap_in .info_wrap .info2 .t2 .t2_in2 {font-size:1.063em} .person_list.wd3 .wrap_in .info_wrap .info2 .t3 {font-size:.938em;} /**/ .join_select{ margin:0 0 0 -2em; padding:0 5%} .join_select > li{ flex:1 1 1%} .join_select > li > a{ display:block; margin:2em 0 0 2em; height:100%; box-sizing:border-box; padding:3em 1em; text-align:center; border:3px solid #eee; transition:.3s} .join_select > li > a .icon{ display:block; width:5em; line-height:5em; background:#f5f5f5; margin:0 auto; border-radius:50%; color:#999; transition:.3s} .join_select > li > a .icon:before{ font-size:2em} .join_select > li > a .t1{ display:block; font-family:'NotoSans'; font-weight:500; font-size:1.75em; margin:.5em 0} .join_select > li > a .t2{ display:block; color:#666; min-height:3em;} .join_select > li > a .more{ display:inline-block; background:#666; color:#fff; margin:0 auto; padding:.5em 2em; margin-top:3em; transition:.3s} .join_select > li > a:hover{ border-color:#003876; box-shadow:0 0 1em .125em rgba(0,0,0,.2);} .join_select > li > a:hover .icon{ color:#003876} .join_select > li > a:hover .more{ background:#003876; color:#fff} /**/ .page_tbg_Wrap {height:350px; background-position:center center; background-repeat:no-repeat; background:url(../images/sub/sub1_1_bg.jpg);} .page_tbg_TW {width:90%; display:block; margin:-180px auto 3px auto; padding:3.5em 9em; box-sizing:border-box; text-align:center; background:#fff} .page_tbg_TW .t1 {font-size:2em; color:#003876; font-family:'NotoSans'; font-weight:700;} .page_tbg_TW .t2 {color:#666; font-size:1em; line-height:1.5; letter-spacing:-.3px; font-weight:500;} .page_tbg_TW .line {width:30px; height:2px; margin:1.2em auto; background:#003876;} /**/ .page_inFo_Wrap1{ position:relative; margin-top:4em;} .page_inFo_Wrap1:before{ content:""; position:absolute; top:0; left:0; width:100%; height:55%; background:#f7fafc; z-index:-1;} .page_inFo_Wrap1 .title {text-align:center; padding:3em 0;} .page_inFo_Wrap1 .title > * {display:block;} .page_inFo_Wrap1 .title .t1 {font-family:'NotoSans'; font-weight:700; font-size:2.250em; letter-spacing:-.3px; position:relative; display:inline-block} .page_inFo_Wrap1 .title .t1:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:.45em; background:#108ad3; opacity:.15;} .page_inFo_Wrap1 .list{ margin-left:-1.5em;} .page_inFo_Wrap1 .list > li{ width:33.33%;} .page_inFo_Wrap1 .list > li .in{ margin-left:1.5em;} .page_inFo_Wrap1 .list .img{ overflow:hidden;} .page_inFo_Wrap1 .list .con{ position:relative; padding:2em .3em 0 .3em; text-transform:uppercase;} .page_inFo_Wrap1 .list .con .num{ position:absolute; top:-1em; left:.5em; width:1.5em; line-height:1.5em; background:#003876; border-radius:50%; text-align:center; font-family:'NotoSans',sans-serif; font-size:1.750em; color:#fff;} .page_inFo_Wrap1 .list .con .tit{ font-size:1.500em; color:#003876; font-family:'NotoSans'; font-weight:500; letter-spacing:-.075em;} .page_inFo_Wrap1 .list .con .txt{ font-size:1em; color:#3c3c3d; line-height:1.5em; margin-top:.5em;} .page_inFo_Wrap2{ position:relative; margin-top:4em;} .page_inFo_Wrap2 .title {text-align:center; padding:3em 0;} .page_inFo_Wrap2 .title > * {display:block;} .page_inFo_Wrap2 .title .t1 {font-family:'NotoSans'; font-weight:700; font-size:2.250em; letter-spacing:-.3px; position:relative; display:inline-block} .page_inFo_Wrap2 .title .t1:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:.45em; background:#108ad3; opacity:.15;} .page_inFo_Wrap2.pdno {margin-top:0;} .page_inFo_Wrap2.pdno .title {padding:4em 0 1.2em 0;} .page_inFo_Bg {padding:0 0 2em 0; background:#fafafa; margin-top:6em;} .inFo_list .tw, .inFo_list .img{ width:48%} .inFo_list .tw{ padding:0 0 2em 0} .inFo_list .img{ position:relative} .inFo_list .img .bg{ position:absolute; left:0; top:0; width:100%; height:100%} .inFo_list > li{ margin:3em 0} .inFo_list > li:first-child {margin:0 0 3em 0;} .inFo_list > li:nth-child(2n-1) .img{order:-1} .inFo_list > li:nth-child(2n) .tw{ text-align:right} .inFo_list > li .tw .page_line{ height:2px; background:#003876; margin:0 0 2em 0; width:2em; display:inline-block} .inFo_list > li .tw .tt{ font-size:1.188em; color:#313232; letter-spacing:-1px; line-height:1.6;} .inFo_list2_ti {font-size:1em; color:#5c5e5e; padding-bottom:3em; font-size:1.125em; letter-spacing:-.3px; text-align:center; line-height:1.6;} .inFo_list2{ margin:0 0 1em -1.5em} .inFo_list2 > li{ flex:1 1 1%} .inFo_list2 > li .in {margin:0 0 0 1.5em;} .inFo_list2 > li .in .tt{ font-size:1em; color:#313232; letter-spacing:-1px; line-height:1.5; padding:1em 1em 0 1em} /* 신규 회원가입 폼 */ /*동의*/ .member_agree .agree{ padding:3em; border:solid #ddd; border-width:2px 1px 1px 1px; border-top-color:#333; font-size:.938em; color:#777; line-height:1.5em;} .member_agree .agree.H{ padding:1em 1.5em; border-top-width:1px; height:10em; font-size:.813em; overflow-y:scroll;} .member_agree .agree p{ padding:.5em 0;} .member_agree .agree *{ vertical-align:baseline;} .member_agree .agree strong{ color:#333;} .member_agree .check{ padding:1em 2em; border:solid #ddd; border-width:0 1px 1px 1px; border-radius:0 0 .6em .6em; text-align:right; font-size:.813em;} /*멤버 box*/ .member_wrap{ letter-spacing:-.5px; padding-top: 5em;} .member_wrap .login_box{ width:580px; max-width:100%; margin:0 auto;} .member_wrap .join_box { width:640px; max-width:100%; margin:0 auto;} /*멤버 버튼*/ .member_btn_wrap{ margin:1.5em 0 0 -.4em;} .member_btn_wrap > *{ width:50%;} .member_btn_wrap .in{ margin-left:.4em; display:block} /*회원가입, 로그인 타이틀*/ .member_wrap .member_tit{ padding:3em 0 2em 0; text-align:center;} .member_wrap .member_tit .tit{ font-family:'Ms','NotoSans',sans-serif; font-size:2.500em; color:#3c3c3d; font-weight:600; letter-spacing:0; text-transform:uppercase;} .member_wrap .member_tit .txt{ font-size:1.125em; color:#69696b; font-weight:300; padding-top:.8em;} /*로그인*/ .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 .save_wrap{ margin-top:1.2em;} .member_wrap .form .save_wrap .find{ padding-top:.3em; text-align:right;} .member_wrap .form .save_wrap .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 .save_wrap .find .link:before{ content:""; position:absolute; top:10%; left:0; width:1px; height:80%; background:#ccc;} .member_wrap .form .save_wrap .find .link:first-child{ margin-left:0; padding-left:0;} .member_wrap .form .save_wrap .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; border-radius:5px; font-size:1.125em;} .member_wrap .form .btn_wrap .btn.c1{ background:#005aab; color:#fff;} .member_wrap .form .btn_wrap .btn.c2{ background:#ffffff; border-color:#005aab; color:#005aab;} .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 .member_form{ padding:2.5em 2em; border:1px solid #ccc; border-top-width:4px; border-top-color:#005aab;} .member_wrap .member_form .form li.inp_wrap .in_tt{ width:100%; color:#777; font-size:.938em; margin:1em 0 1em 0; line-height:1.5} .member_wrap .member_form .member_f_tt{ font-weight:600; margin-bottom:1em;} .member_wrap .member_form .member_f_tt .ess{ vertical-align:bottom;} /*회원가입 폼*/ .member_wrap .form2{ margin-top:1.5em; padding-top:1.5em; border-top:1px dashed #ccc;} .member_wrap .form2.stn{ margin-top:0; padding-top:0; border-top:none;} .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:after{ display:block; clear:both; content:'';} .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; *display:inline; zoom:1; vertical-align:middle;} .member_wrap .form2 .check_wrap .label_sec{ min-width:5em} .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 .label_tit{ position:relative; width:20%; float:left; box-sizing:border-box; font-size:.938em;} .member_wrap .form2 .check_wrap .label_tit:after{ content:""; position:absolute; right:0; top:0; height:100%; width:1px; background:#ccc;} .member_wrap .form2 .ess{ display:none;} .member_wrap .form2 .required .ess{ display:inline-block; vertical-align:text-bottom;} .member_wrap .form2 .field{ position:relative;} .member_wrap .form2 .field .txt{ position:absolute; z-index:1; top:50%; left:1.2em; transform:translate(0, -50%); transition:transform .2s ease-out; transform-origin:0 0;} .member_wrap .form2 .field.on .txt{ color:#69696b; transform:translate(0, -120%) scale(.7,.7);} .member_wrap .form2 .col .col_w1{ width:65.68%; margin-left:1%;} .member_wrap .form2 .col .col_w1:first-child{ width:66.66%; margin-left:0;} .member_wrap .form2 .col .col_w2{ width:32.34%; margin-left:1%;} .member_wrap .form2 .col .col_w2:first-child{ width:33.32%; margin-left:0;} .form2 .input_st, .form3 .input_st{ height:4.2em !important; padding:.6em 1.2em !important; line-height: auto !important;} .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;} /*회원가입 폼 - input3*/ .member_wrap .ph_list{ float:left; width:80%; box-sizing:border-box; padding-left:2em;} .member_wrap .ph_list:after{ display:block; clear:both; content:'';} .member_wrap .ph_list > li{ float:left; width:33.33%;} .member_wrap .ph_list > li .xi{ margin-right:5px;} .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:400;} .member_wrap .terms_wrap .c1{ color:#d31717;} /*회원가입 완료*/ .member_wrap .finish_wrap{ text-align:center;} .member_wrap .finish_wrap .tit{ font-size:1.500em; color:#3c3c3d; letter-spacing:-1px;} .member_wrap .finish_wrap .tit span{ font-weight:600; vertical-align: baseline;} .member_wrap .finish_wrap .txt{ padding:1em 0; color:#69696b; font-weight:300; line-height:1.5} .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 .th .xi{ vertical-align:middle;} .member_wrap .finish_wrap .join_fin .td{ width:auto; letter-spacing:0;} /*회원가입 진행절차*/ .page_step_wrap{ text-align:center; margin-bottom:2em;} .page_step_wrap .step{ display:inline-block; *display:inline; zoom:1;} .page_step_wrap .step > li .in{ position:relative; padding:0 1.5em; min-width:7em;} .page_step_wrap .step > li .in:before{ content:"\e940"; font-family:xeicon; position:absolute; font-size:2.000em; color:#ddd; 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:.4em 0; font-size:2.25em; 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%; transform:translate(-50%, -50%); width:1.6em; height:1.6em; background:#f5f5f5; border-radius:100%;} .page_step_wrap .step > li .in .tt{ color:#aaa; font-weight:400;} .page_step_wrap .step > li.on .in .xi{ color:#fff;} .page_step_wrap .step > li.on .in .xi:after{ background:#005aab;} .page_step_wrap .step > li.on .in .tt{ color:#3c3c3d;} /*mypage*/ .memo_wrap{ border:1px solid #ddd; border-radius:.5em; padding:2em 3em; margin-bottom:2em} .memo_wrap *{ vertical-align: top} .memo_wrap .t1{ color:#555; line-height:1.5} .memo_wrap .t2{ font-size:.813em; color:#111; line-height:1.5} .memo_wrap .c1{ color:#FF3333} .memo_wrap .tel{ font-family:tahoma,sans-serif; font-weight:bold; color:#111; font-family:1.25em} .memo_wrap .tel .xi{ margin-right:.25em}