@charset "utf-8"; /* CSS Document */
.box0 { padding:0 4vw } 
.box1 { width:1400px; margin:0 auto; max-width:94% } 
.box2 { width:1600px; margin:0 auto; } 

.gnb li.m_hide { display:none } 
body:not(.pop) { display:flex; flex-direction:column; min-height:100vh; min-height:calc(var(--vh, 1vh) * 100) } 

.gnb li.m_hide { display:none } 
.gnb .layer { display:none !important; } 
.gnb .blank .arrow:before { content:"\e980"; } 

.fullH { height:calc(100vh); box-sizing:border-box; } 
.fullMH { min-height:calc(100vh) !important; box-sizing:border-box; } 

.filW { filter:var(--crWhitefil); } /*화이트*/
.filB { filter:var(--crBlackfil); } /*블랙*/
.filRE { filter:var(--crfilRE); } /*색상반전*/

/*header*/
.headT { padding-top:var(--headH); } 
.headH,
#header .gnb_wrap .gnb > li,
#header .gnb_wrap .gnb > li .dp1 { height:var(--headH); transition:height .2s, background .2s; box-sizing:border-box; } 
#header:hover { background: #fff; } 
#header:hover .inner { color: var(--crBlack); } 
#header:hover .logo { filter: none; } 
#header:hover .all_wrap .all_btn { filter: var(--crBlackfil); } 
#header:hover { color: var(--crBlack); } 
#header:hover .all_wrap .allBtn { filter: none; } 

#header { z-index:999; position:fixed; top:0; left:0; width:100%; transition: transform 1s; color: #fff; } 
#header .inner { color:#fff; } 
#header .logo,
#header .all_wrap .all_btn { filter:var(--crWhitefil); } 
#header .inner .gnb_wrap { /*padding-left: 8em; */ } 
#header .logo { width:18em; } 
#header .side_wrap { } 
#header .logo > .in img { display:block; width:17em; transition:.2s; transform-origin:left center; } 
#header .logo img { width: 100%; } 

#header .all_wrap .allBtn { filter:var(--crWhitefil); } 
#header .all_wrap .allBtn > .xi { font-size: 2em; } 

#header .top_wrap .gnb_wrap { padding-left: 8vw; } 

#header .gnb_wrap .gnb > li { position:relative; overflow:hidden; } 
#header .gnb_wrap .gnb > li .dp3 { display:none; } 
#header .gnb_wrap .gnb > li .dp1 { position:relative; padding:0 2.5em; } 
#header .gnb_wrap .gnb > li .dp1 .tt { position:relative; font-size:1.250em; font-weight:600; } 
#header .gnb_wrap .gnb > li .dp1 .tt:after { content:""; display:block; position:absolute; right: -10px; top: -6px; width: 6px; height: 6px; opacity: 0; background: var(--crBlack); border-radius: 50%; content: ''; transition: .3s; } 
#header .gnb_wrap .gnb > li.on .dp1 .tt:after,
#header .gnb_wrap .gnb > li.act .dp1 .tt:after { opacity: 1; } 
#header .gnb_wrap .gnb > li.act { z-index:2; overflow:visible; } 
#header .gnb_wrap .gnb > li.act .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after { opacity:1; transform:scaleX(.7); } 
html:not(.simple) #header:not(.active) .gnb_wrap .gnb > li .dp1:after { filter:var(--crWhitefil); } 
#header .gnb_wrap .gnb > li.m_guide .dp1 { display: none; } 

#header .gnb_wrap .gnb > li .dp2 { display:inline-block; opacity: 0; margin-top: -1em; position:absolute; padding: 0; top:100%; left:50%; width:13em; background-color: var(--siteC); border-radius: .5em; color:#fff; transform:translateX(-50%); max-height: 0; overflow: auto; transition: max-height 1.25s, padding-top .3s, padding-bottom .3s; } 
#header .gnb_wrap .gnb > li .dp2:before { /* background-color: var(--siteC2); content: ''; */ /*content:""; display:block; position:absolute; top:0; left:50%; transform:translate(-50%,-100%); display: none; border-style:solid; border-color:transparent transparent var(--siteC2); border-width:0 7px 7px; */ } 
#header .gnb_wrap .gnb > li .dp2 > li > a { padding:.325em 0; transition:.2s; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .tt { position:relative; font-size:1em; font-weight:500; opacity: .95; } 
#header .gnb_wrap .gnb > li.act .dp2 { max-height:calc(100vh - 56px); overflow-y: hidden; opacity: 1; padding: 1em 0 1em 0; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in { position:relative; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in:after { content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:#fff; } 
#header .gnb_wrap .gnb > li .dp2 > li > a:hover .in:after { width:100%; transition:.65s } 

#header .gnb_wrap .gnb > li .dp2 .m2_data {display: none;}
#header .all_wrap .all_layer .wrap_middle .gnb .dp2 > li.m2_data > a {display: none;}
#header .side_wrap { } 
#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:4.5em; } 
#header .all_wrap .all_btn { position:relative; display:block; width:2.5em; height:1.125em; 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:1.5px; 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:50%; } 
#header .all_wrap .all_btn .ham:after { top:calc(100% - 1px); width:68%; } 
#header .all_wrap .all_btn:hover .ham:before { width:100%; } 
#header .all_wrap .all_btn:hover .ham:after { width:100%; } 

#header .all_wrap .all_layer { position:fixed; top:0; left:0; width:100%; height:100vh; opacity:0; visibility:hidden; } 
#header .all_wrap .all_layer .all_close { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.5); opacity:0; backdrop-filter:blur(.75em); } 
#header .all_wrap .all_layer .all_inner { position:absolute; top:0; right:0; width:30em; max-width:100%; height:100%; background:#fff; box-shadow:-1em 0 1em rgba(0,0,0,.1); transform:translateX(100%); } 
#header .all_wrap .all_layer .all_inner > .wrap_in { gap:2em; padding:3em 3em; } 


#header .all_wrap .all_layer .wrap_top a { transition:.2s; } 
#header .all_wrap .all_layer .wrap_top .all_logo { } 
#header .all_wrap .all_layer .wrap_top .all_logo .in { display:block; width:15em; } 
#header .all_wrap .all_layer .wrap_top .all_logo .in img { width:100%; } 
#header .all_wrap .all_layer .wrap_top .all_mem { gap:.25em; padding:1em 0; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in { height:2.25em; padding:0 1em; border:1px solid #ddd; border-radius:.25em; line-height:normal; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in .tt { font-size:.938em; font-weight:500; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in:hover { background:var(--siteC); border-color:var(--siteC); color:#fff; } 

#header .all_wrap .all_layer .wrap_middle { } 
#header .all_wrap .all_layer .wrap_middle .gnb { flex-wrap:wrap; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li { flex:1 1 100%; } 
#header .all_wrap .all_layer .wrap_middle .gnb   >li.m_guide {display: none;}
#header .all_wrap .all_layer .wrap_middle .gnb > li.m_customer { display:block; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.m_member   { display:none; } 
#header .all_wrap .all_layer .wrap_middle .gnb ul.flex { display:block; } 
#header .all_wrap .all_layer .wrap_middle .gnb a { position:relative; justify-content:flex-start; text-align:left !important; font-weight:500; transition:.2s; } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more { } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more > a.link { display:none; } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more > a.layer { display:flex !important; padding-right:2.5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more > a .arrow { position:absolute; right:1em; top:50%; transform:translateY(-50%); font-size:1em; } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more > a .arrow:before { content:"\e943"; font-size:1.250em; display:block; transition:.2s; } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more > ul { display:none; } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more.on > a .arrow:before { transform:rotate(-180deg); } 
#header .all_wrap .all_layer .wrap_middle .gnb li.more.on > ul { display:block; } 
#header .all_wrap .all_layer .wrap_middle .gnb ul { padding:1em 1em; } 
#header .all_wrap .all_layer .wrap_middle .gnb ul li > a { padding:.875em .5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb ul li.more .arrow { right:.5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li { } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 { height:4em; padding:0 1.5em; border:solid var(--crGray); border-width:1px 0; margin-bottom:-1px; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .tt { font-size:1.188em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.act .dp1,
#header .all_wrap .all_layer .wrap_middle .gnb > li.on .dp1 { background-image:var(--crGrad1); color:#fff; } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp2 > li > a { padding-left:1.5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp2 > li > a:before { content:""; position:absolute; left:.75em; top:50%; width:.313em; height:.313em; background:var(--siteC2); border-radius:50%; transform:translateY(-50%); } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp2 > li > a .tt { font-size:1.063em; } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp2 > li.act > a { background:var(--crGray) } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp2 > li.on > a { color:var(--siteC); font-weight:600; } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp3 { background:var(--crGray2); } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp3 > li > a { color:#444; } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp3 > li + li > a { border-top:1px dashed #ddd; } 
#header .all_wrap .all_layer .wrap_middle .gnb .dp3 > li.act > a .tt,
#header .all_wrap .all_layer .wrap_middle .gnb .dp3 > li.on > a .tt { text-decoration:underline; } 

.dp2_data #contents .sub_page_menu,
.dp2_data #contents .sub_page_top .nav  {display: none;}
 

.allGnbOn { overflow-y:hidden } 
.allGnbOn body { overflow-y:scroll } 
.allGnbOn #header .all_wrap .all_btn { z-index:999; position:fixed; top:1em; right:2vw; width:2.5em; height:3em; filter: brightness(0) invert(0) !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; height:2px; } 
.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; } 
.allGnbOn #header .all_wrap .all_layer .all_close { opacity:1; transition:.4s; } 
.allGnbOn #header .all_wrap .all_layer .all_inner { transform:translateX(0); transition:.4s; } 


.scroll #header { } 
.scroll #header { background: #fff; color: var(--crBlack); box-shadow:0 0 2em rgba(0,0,0,.1); transform: translateY(0em); } 
.scroll.up #header { background:#fff; color:#111 } 
.scroll.up #header .top_wrap .wrapH,
.scroll.up #header .top_wrap .gnb_wrap .dp1 { height:4.5em } 
.scroll.up #header .top_wrap .etc_wrap .etcBtn { filter: brightness(0) invert(0); } 
.scroll.up .headerT { padding-top:4em } 
.scroll.up #header .top_wrap .logo > a { filter:none } 
.scroll.up #header .top_wrap .gnb_wrap .gnb > li.on .dp1 { color:var(--siteC) } 
.scroll.up #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after { background:var(--siteC) } 

.scroll #header .inner { color: var(--crBlack); } 
.scroll .headH,
.scroll #header .gnb_wrap .gnb > li,
.scroll #header .gnb_wrap .gnb > li .dp1 { height: var(--headHS); } 
.scroll #header .logo { filter: none; } 
.scroll #header .all_wrap .all_btn { filter: brightness(0) invert(0); } 
.scroll #header .all_wrap .allBtn { filter: none; } 

/*footer*/
.privacy_wrap { border-bottom: 1px solid #40454e; } 
.privacy_wrap .privacy_list { position: relative; padding: 1em 0; gap: 4em; } 
.privacy_wrap .privacy_list > li a { position: relative; } 
.privacy_wrap .privacy_list > li a:hover { text-decoration:underline; } 
.privacy_wrap .privacy_list > li:first-of-type > a:after { background: none; } 
.privacy_wrap .privacy_list > li a:after { content: ""; position: absolute; left: -31px; top: 86%; width: 15px; transform: rotate(90deg); height: 1px; margin: -0.5em 0 0 -0.5em; background: #40454e; } 
.privacy_wrap .privacy_list > li a > p.d_color { color: #aa9b83; } 
.info_wrap .info .info_ttl { margin-bottom: 1em; } 

#footer { z-index:1; color:#fff; background:#111; padding:0em 0 5em 0 } 
#footer .f_wrap{gap: 4em;}
#footer .goTop { position:fixed; right:0; bottom:0; width:3.5em; line-height:3.5em; text-align:center; background:var(--siteC); 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) } 
#footer .logo_wrap { padding-top: 3em; } 
#footer .logo { filter:brightness(0) invert(1); width: 20%;} 
#footer .logo img { height:3em } 
#footer .footer_right {flex: 1 100%;}
#footer .menu_wrap { margin-right:auto; display:flex; gap:2em } 
#footer .menu_wrap > li > a { opacity:.6; font-weight:500 } 
#footer .menu_wrap > li.point > a { opacity:1; font-weight:700 } 
#footer .info_wrap { display:flex; justify-content:space-between; align-items:flex-start; margin-top:1.5em; gap: 4em; } 
#footer .info { overflow:hidden; flex:1 1 0%; min-width:0 } 
#footer .info > li { float:left; margin-right:2em; margin-bottom:.25em; opacity:.8; position:relative } 
#footer .info > li:before { content:""; position:absolute; left:-1em; height:70%; top:50%; transform:translateY(-50%); width:1px; background:#fff; opacity:.2 } 
#footer .info > li.point { font-weight:600 } 
#footer .info > li.br { clear:left } 
#footer .copyright { font-size:.813em; opacity:.6; text-transform:uppercase; margin-top:1em } 
#footer .site_wrap { margin-left:auto; background:#222; width:14em; font-size:.875em; position:relative } 
#footer .site_wrap .siteBtn { display:flex; align-items:center; padding:1em; font-weight:500; transition:.3s } 
#footer .site_wrap .siteBtn .arrow { margin-left:auto; transition:.3s } 
#footer .site_wrap .list { position:absolute; left:0; bottom:100%; width:100%; background:inherit; visibility:hidden; opacity:0; transform:translateY(1em); transition:.3s } 
#footer .site_wrap .list > li > a { display:block; padding:1em; padding-right:3em; border-bottom:1px solid rgba(255,255,255,.1); position:relative; transition:.3s } 
#footer .site_wrap .list > li > a:after { content:"\e980"; font-family:xeicon; position:absolute; right:1em; top:50%; transform:translateY(-50%); opacity:0; transition:.3s } 
#footer .site_wrap .list > li > a:hover { background:rgba(255,255,255,.1) } 
#footer .site_wrap .list > li > a:hover:after { opacity:1 } 
#footer .site_wrap .siteBtn:hover,
#footer .site_wrap.on .siteBtn { background:rgba(0,0,0,.2) } 
#footer .site_wrap.on .siteBtn .arrow { transform:rotate(180deg) } 
#footer .site_wrap.on .list { visibility:visible; opacity:1; transform:translateY(0) } 

.sns_st { display:flex; gap:.5em } 
.sns_st > li > a { display:flex; align-items:center; justify-content:center; width:2.5em; height:2.5em; color:#fff; border-radius:50%; transition:.3s } 
.sns_st > li > a:hover { background:#fff; color:#111 } 

/*member*/

.grd-bg { background: #f4f4f4; } 
.member_wrap { letter-spacing: -.5px } 
.member_wrap .input_st { height: 3em; cursor: pointer; } 
.member_wrap .login_box { width: 520px; max-width: 100%; margin: 0 auto; padding-top: 6em; } 
.member_wrap .login_box.login_box2 { width: 800px; } 
.member_wrap .join_box { width: 600px; max-width: 100%; margin: 0 auto; } 
.member_wrap .join_box.w2 { width: 800px; } 
.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; font-weight: 700; 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: var(--siteC); color: #fff; } 
.member_wrap .form .btn_wrap .btn.c2 { background: #ffffff; border-color: var(--siteC); color: var(--siteC); } 
.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 { position:relative; display: inline-block; font-size: 1.85em; opacity: .85; } 
.member_wrap .form2 .required .ess:before { position: absolute; top: -20px; font-size: .7em; content: '*'; color: #cb2025; } 
*/
.member_wrap .form2 .field { position: relative; } 
.member_wrap .form2 .field .txt { position: absolute; top: 50%; left: 1.2em; padding-bottom: 0.8em; 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, -95%) scale(.7, .7); padding:0 1em; background: #fff; } */
.member_wrap .form2 .field.on .txt { color: #69696b; transform: translate(-15%, -95%) scale(.7, .7); padding: 0 1em; background: none; } 
.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 .form3 { margin-top: 1.5em; padding-top: 1.5em; border-top: 1px dashed #ccc; } 
.member_wrap .form3 .check_wrap { display: flex; align-items: center; gap: 1em; } 
.member_wrap .form3 .check_wrap .tit { padding-right: 1em; border-right: 1px solid #ddd; } 
.member_wrap .form3 .check_wrap .tit i { font-weight: 600; font-size: 1.05em; } 

.member_wrap .sns.btn_wrap { padding: 1.5em 0 0; border-top: 1px solid #ddd; } 
.member_wrap .btn_wrap .snsP { text-align: center; color: #999; font-size: 1.1em; margin: .3em 0 1em; } 
.member_wrap .sns.btn_wrap .btn.c4 { background: #2db400; color: #fff; border: 1px solid #2db400; } 
.member_wrap .sns.btn_wrap .btn.c3 { background: #f9e000; color: #624A3D; border: 1px solid #f9e000; } 
.member_wrap .sns.btn_wrap .btn .xi { padding-right: 0.1em; vertical-align: bottom; } 

.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; } 

.fin_box { padding: 3em 5em 4em; border: 1px solid #ddd; border-radius: 1em; background: #fff; } 
.fin_box .xIco { margin-bottom: 3em; } 
.fin_box .xIco .imgfix { width: 5.5em; margin: 0 auto; position: relative; } 
.fin_box .xIco .imgfix::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 4.5em; height: 4.5em; border-radius: 50%; background: #eee; z-index: -1; } 
.fin_box .tit { font-size: 1.5em; margin-bottom: 1em; } 
.fin_box .tt1 { font-size: 1.125em; } 

.member_btn_wrap { gap: .25em; margin: 2em 0 0; justify-content: center; } 
.member_btn_wrap > * { } 
.member_btn_wrap .in { } 
.member_btn_wrap .in .input_st.s1 { border-color: var(--siteC); } 

.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 { align-items: center; display: flex; gap: 1em; justify-content: end; 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; margin-bottom: 2em; } 
.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 .5em; 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: #fff; 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: var(--siteC); } 
.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; } 



/**********공통**********/
#contents .doc { padding: 4em 0 10em 0; } 
#contents .doc.pt0 { padding: 0em 0 10em 0; } 
#contents .doc.pb0 { padding: 4em 0 0em 0; } 

.Rlate { position:relative; } 

.con_idx { position:relative } 
.con_idx > .idx { position:absolute; left:0; top:0; width:100%; visibility:hidden; filter:alpha(opacity=0); opacity:0; display: none; } 
.con_idx > .idx.on { position:relative; visibility: visible; filter:alpha(opacity=100); opacity:1; display: block; } 

.page_tit{padding: 1em 0;}
.page_tit .tit{font-weight: 800; font-size: 3em;}
.page_tit .t1{font-weight: 700; font-size: 2.5em;}
.page_tit .t2{font-weight: 700; font-size: 2em;}

.page_txt {padding: .5em 0;}
.page_txt .t1{ font-size: 1.8em; color: #333;}
.page_txt .t2{ font-size: 1.5em; color: #333;}


.dott{position: relative;margin-left: .5em;}
.dott::before{content: "";position: absolute; left: -12px; top: 14px; width: .3em; height: .3em; background-color: #333; border-radius: 50%; }
.bar{position: relative;}
.bar::before{content: ""; position: absolute; width: 3em; height: 3px; background: var(--siteC);}

.img_con{width: 40%;  height: 20em; overflow: hidden; border-radius: .8em;}
.img_con2{width: 50%;  height: 20em; overflow: hidden; border-radius: .8em;}

/*gary before*/
.begray { position: relative; } 
.begray:before { position: absolute; width: 100%; bottom: 0; top: 4.5em; background: #f9f9f9; content: ''; } 

/*gra line*/
.sub_line { width: 100%; height: 2px; background: linear-gradient(to right, #7fc31c, #00844a); } 

/*page_dot 공통*/
.page_dot_list { padding: 0 1.25em; margin-top: 1.25em; } 
.page_dot_list > li { position:relative; margin-bottom: .5em; } 
.page_dot_list > li > .txt { font-size: 1em; } 
.page_dot_list > li:before { position: absolute; left: -13px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); content: ''; } 
.page_dot_list > li:last-of-type { margin-bottom: 0em; } 

.page_dot_list.s1 { margin-top: 0em; } 
.page_dot_list.s1 > li:before { width: none; height: none; background: none; top: unset; left: -15px; content: '-'; } 

/*page_line 공통*/
.page_line_list { margin-top: 1.25em; } 
.page_line_list > li { position:relative; padding: .65em 1.25em; border-bottom: 1px solid #e5e5e5; } 
.page_line_list > li > .txt { font-size: 1em; } 
.page_line_list > li:before { position: absolute; left: -13px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); content: ''; } 


/*sub areaD*/
.page_con { position:relative; padding: 4em 0; } 
.page_con.conP2 { position:relative; padding: 2em 0; } 
.page_con.conP3 { position:relative; padding: 0em 0; } 
.page_con.bg1 { background: #f9f9f9; } 
.page_con.bg2 { background: #e9edff; } 
.page_con.bg3 { background: #fafafa; } 
.listW50{width: 50%;}
.listW60{width: 60%;}
/*버튼*/
.button-gradient { color: #fff; background-image: linear-gradient(48deg, #90fa3e, #21996c, #21996c, #63ff93); background-size: 300% 100%; background-position: 0%; border-color: transparent; transition: background ease .3s; } 
.button-gradient:hover { background-position: 15%; } 
.btn-round { border-radius: 50px; } 
.sub_btn .btn { padding-top: 18px; padding-bottom: 18px; width: 200px; text-align: center; font-size: 20px; font-weight: 700; } 
.sub_btn .btn > .xi { margin-left: .3em; } 
.sub_btn .btn.s1 { font-size: 16px; padding-bottom: 16px; padding-top: 16px; font-weight: 600; background: var(--siteC); color: #fff; } 

/*sub 타이틀 점*/
.dot-tit { position:relative; padding-left: 1em; font-size: 1.85em; font-weight: 800; color: #111; margin-bottom: 1.15em; } 
.dot-tit:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; margin: auto; width: 7px; height: 7px; border-radius: 50%; border: 4px solid var(--siteC); } 

/*sub 펼쳐짐 효과*/
.sub-wide { overflow: hidden; position: relative; clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%); transition: clip-path 1.2s cubic-bezier(0.4, 0, 0.2, 1) .15s; } 
.sub-wide.on { clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); visibility: visible; opacity: 1; transition: clip-path 1.2s cubic-bezier(0.4, 0, 0.2, 1) 0.15s, opacity 1.4s cubic-bezier(0.4, 0, 0.2, 1) 0s; } 

/*구분 de*/
.sub_diviC { gap: 6em; transform: translateY(2em); transition: 1s; opacity: 0; } 
.sub_diviC.listShow.on { transform: translateY(0em); transition: 1s; opacity: 1; } 
.sub_diviC .dvT { flex: 1 1 20%; } 
.sub_diviC .dvT .tit { } 
.sub_diviC .dvIF { flex: 1 1 80%; } 
.sub_diviC .dvIF .tt { font-size: 1.1em; line-height: 1.6; color: #444; } 

/*flex box*/
.flex_box { } 
.flex_box.s1 { margin: 0 0 -1em -1em; } 
.flex_box.s2 { margin: 0 0 -2em -2em; } 
.flex_box.s3 { } 
.flex_box.s4 { } 
.flex_box.s5 { } 

.flex_box .fst2>li { flex: 1 1 50%; max-width: 50%; } 
.flex_box .fst2>li>.in { margin: 0 0 1em 1em; } 
.flex_box .fst3>li { flex: 1 1 33.33%; max-width: 33.33%; } 
.flex_box .fst3>li>.in { margin: 0 0 1em 1em; } 
.flex_box .fst4>li { flex: 1 1 25%; max-width: 25%; } 
.flex_box .fst4>li>.in { margin: 0 0 1em 1em; } 

/*flex 구분*/
.FlexWrap { display:flex; gap:3em; align-items:flex-start; position:relative; box-sizing:border-box } 
.FlexWrap.gap1 { gap: 6em; } 
.FlexWrap.acen { align-items: center; } 
.FlexWrap .wrapTit { width:45%; box-sizing:border-box } 
.FlexWrap .wrapTit .main_more { margin-top:3em } 
.FlexWrap .wrapCon { flex:1 1 0%; min-width:0 } 

/*flex 텍스트 리스트*/
.text_GapList { } 
.text_GapList > li { margin-bottom: 1em; } 
.text_GapList.st2 > li { margin-bottom: 1em;  padding: .5em;} 
.text_GapList > li:last-of-type { margin-bottom: 0em; } 
.text_GapList > li { display: flex; gap: 1em; } 
.text_GapList > li > .Tit { width: 12em; } 
.text_GapList.titW1 > li > .Tit { width: 14em; } 
.text_GapList > li > .Tit > .tt { color: var(--siteC); font-size: 18px; font-weight: 600; } 
.text_GapList > li > .Txt { width: 100%; } 
.text_GapList > li > .Txt > .txt { font-weight: 500; font-size: 18px; color: #000; line-height: 1.4; } 
.text_GapList > li > .Txt > .txt2 { font-weight: 500; font-size: 20px; color: #000; line-height: 1.4; } 
.text_GapList.BoxList > li { padding: .75em 1.25em; width: 100%; background: #f7f7f7; margin-bottom: .5em; border-radius: 3px; box-sizing: border-box; } 
.text_GapList.BoxList > li.st2 { padding: .75em 1.25em; width: 100%; border: 1px solid #eee; margin-bottom: .5em; border-radius: 3px; box-sizing: border-box; background-color: #fff; 
border-radius: .8em; } 
.text_GapList.cen > li { align-items: center; } 
.text_GapList.st > li { align-items: start; } 

.text_GapList.mb2 > li { margin-bottom: 2em; } 
.text_GapList.mb2 > li:last-of-type { margin-bottom: 0em; } 

.text_GapList.crnum { counter-reset: cirnum 0; } 
.text_GapList.crnum > li { position:relative; padding-left: 1em; } 
.text_GapList.crnum > li:before { content: counter(cirnum); counter-increment: cirnum; font-weight: 600; position: absolute; top: 0; left: -1.25em; font-size: .8em; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; background: #000;; z-index: 111; } 

/*sub 탑 공통*/
.sub #header .logo,
.sub #header .all_wrap .all_btn { filter: none; } 
.sub #header .inner { color: var(--crBlack); } 
.sub #contents { padding-top: var(--headB); } 
/*contents*/
#contents .sub_page_top { box-sizing:border-box; display:flex; flex-direction:column } 
#contents .sub_page_top .visual_wrap { height:58vh; position:relative; overflow:hidden; transition:.5s } 
html:not(.scroll) #contents .sub_page_top .visual_wrap { padding:0 } 
#contents .sub_page_top .visual_wrap .wrapIn { position:relative; height:100% } 
#contents .sub_page_top .visual_wrap .bg { position:absolute; left:0; top:0; width:100%; height:100%; background-color:#000; opacity: 1; /*transform: translateX(4.5em); */ transition:.3s; } 
#contents .sub_page_top .visual_wrap .bg:before { position: absolute; width: 100%; height: 100%; background: rgba(0,0,0, .15); content: ''; } 
#contents .sub_page_top .visual_wrap .con_wrap { height:100%; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:#fff; box-sizing:border-box } 
#contents .sub_page_top .visual_wrap .con_wrap .t1 { font-size: 3.65em; font-weight: 700; } 
#contents .sub_page_top .visual_wrap .slogan { position:relative; flex:1 1 0%; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2em 0 } 
#contents .sub_page_menu .gnb .dp2 > li.m2_data_ {display: none;}
#contents .sub_page_top .visual_wrap .slogan .t1 { font-weight:700; font-size:3em; text-transform:uppercase; letter-spacing:-.025em; padding-left:.025em; line-height:1 } 
#contents .sub_page_top .visual_wrap .slogan .sub-slogan { font-size: 1.45em; font-weight: 500; padding: 0 4vw; } 
.load #contents .sub_page_top .visual_wrap .bg { /*animation: 1.5s subVisual cubic-bezier(0.39, 0.58, 0.57, 1) forwards; */ } 

#contents .sub_page_top .tit_wrap { } 
#contents .sub_page_top .tit_wrap .wrapIn { display:flex; flex-direction: column-reverse; height: 30vh; margin-bottom: 5vh; } 
#contents .sub_page_top .tit_wrap .wrapIn .tit { } 
#contents .sub_page_top .tit_wrap .tit .t1 { font-size:3.85em; font-weight:800 } 
#contents .sub_page_top .nav { display:flex; align-items:center; margin-bottom: 1.5em; } 
#contents .sub_page_top .nav > li { position:relative; text-transform:uppercase; font-weight: 600; color: #999999; font-size: 1.1em; } 
#contents .sub_page_top .nav > li:not(.home):before { content: ''; display: inline-block; vertical-align: middle; margin: 0 10px; width: 16px; height: 2px; background: #DDDDDD; border-radius: 10px; transform: rotateZ(110deg); } 
#contents .sub_page_top .nav > li:last-of-type { color: #111; font-weight: 800; } 
#contents .sub_page_top .nav > li.home { } 
#contents .sub_page_top .nav > li.home > a { width:1.5em; height:1.5em; border-radius:50%; display:flex; align-items:center; justify-content:center } 
#contents .sub_page_top .nav > li.home > a .xi { font-size:1.45em } 
#contents .sub_page_top .sub_tab { position: absolute; bottom: 0; width:100%; background: rgba(0,0,0, .2); backdrop-filter: blur(2px); box-shadow: 6px 0 18px rgba(0,0,0,.05); } 
#contents .sub_page_top .sub_tab .gnb > li { width:100% } 
#contents .sub_page_top .sub_tab .gnb .dp2 { justify-content:center } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li { position: relative; flex: 1; max-width: 20%; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li.on:after { position: absolute; top: 0; width: 100%; height: 3px; background: #fff; content: ''; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li:last-of-type:before { display: none; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li:before { position: absolute; right: 0; width: 1px; height: 20px; background: rgba(255,255,255, .35); content: ''; top: 50%; transform: translateY(-50%); } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li > a { display:flex; align-items:center; letter-spacing: .03em; justify-content:center; font-size: 1.25em; font-weight: 500; color: #fff; opacity: .65; height:4.25em; padding:0 .5em; transition: .15s; position:relative } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li > a:hover { opacity: 1; transition: .15s; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li > a .va { font-weight:600; font-size:1.125em; opacity:.7; position:relative; z-index:1 } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li.on > a { color:#fff; opacity: 1; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li.on > a:after { content:""; position:absolute; left:0; bottom:0; width:100%; height:100%; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li:hover > a .va,
#contents .sub_page_top .sub_tab .gnb .dp2 > li.on > a .va { opacity:1; } 
#contents .sub_page_top .sub_tab .gnb .dp2 > li > .layer { display: none; } 

#contents .sub_page_menu { padding-top: 1.15em; } 
#contents .sub_page_menu .gnb { display:block; transform:translateX(-2em); } 
#contents .sub_page_menu .gnb .dp2 { } 
#contents .sub_page_menu .gnb .dp2 > li { } 
#contents .sub_page_menu .gnb .dp2 > li.m2_data {display: none; } 
#contents .sub_page_menu .gnb .dp2 > li > a { padding:1em 2em; color:#888; } 
#contents .sub_page_menu .gnb .dp2 > li > a .tt { font-size:1.250em; 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: var(--siteC); transform:scaleX(0); transition:transform .3s; } 
#contents .sub_page_menu .gnb .dp2 > li.act > a .in,
#contents .sub_page_menu .gnb .dp2 > li.on > a .in { color:var(--siteC); } 
#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); } 

.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 } 

/*버튼 공통*/
.Abtn .more { display: inline-flex; width: auto; align-items: center; border: 1px solid var(--crBlack); box-sizing: border-box; color: var(--siteC2); font-size: 16px; padding: .8em 1.5em; overflow: hidden; position: relative; font-weight: 700; } 
.Abtn .more.white { border: 1px solid #fff; color: #fff; transition: all 0.2s; } 
.Abtn .more.white:hover { border: 1px solid var(--crBlack); } 
.Abtn .more.round { border-radius: 70px; } 
.Abtn .more:before { content: ""; display: inline-block; position: absolute; top: 0; left: 0; height: 100%; width: 0; z-index: 1; background-color: var(--siteC2); transition: all 0.5s; background-color: #222; } 

.Abtn .more.c1:hover:before { background-color: var(--siteC); color: #fff; } 
.Abtn .more.c1:hover { border: 1px solid var(--siteC); } 

.Abtn .more.s1 { font-size: .9em; } 
.Abtn .more.s2 { font-size: .85em; } 

.Abtn .more > span { position:relative; z-index: 2; } 
.Abtn .more:hover { color: #fff; } 
.Abtn .more:hover::before { width: 100%; } 
.Abtn .more > .xi { padding-left: .65em; position: relative; z-index: 2; } 

.Abtn .more.st1 { border: none; padding: 0em; font-weight: 500; font-size: 1.25em; border-radius: 0; color: #eee; } 
.Abtn .more.st1:before { top: unset; bottom: 0; width: 0%; height: 3px; background: rgba(255,255,255, .65); content: ''; transition: .3s all; } 
.Abtn .more.st1:hover:before { width: 100%; } 

/**/
.vod_wrap { position:relative; width: 100%; height: 100%; } 
.vod_wrap .vod { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover } 
.vod_wrap .layer { position:absolute; left:0; top:0; width:100%; height:100% } 


.visualSlide_wrap {  height: 100dvh; } 
.visualSlide { height:100%; } 
.visualSlide .el { position:relative; overflow:hidden; height:100%; } 
.visualSlide .el .bg { position:absolute; left:0; top:0; width:calc(100% + 6em); height:100%; opacity:0; transition:2s, opacity 4s; } 
.visualSlide .el .bg:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background-color: rgb(144 150 205 / 20%); } 
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg { left:-3em; opacity:1; transition:3s, opacity 1s; } 


.visualSlideSlogan_wrap { position:absolute; left:0; width:100%; bottom:0; box-sizing:border-box; z-index:10; color:#fff } 
.visualSlideSlogan_wrap .wrapIn { display:flex; flex-direction:column; height:100% } 
.visualSlide_wrap .slogan { text-align: center; margin-bottom:auto; transform:translateY(-60%); box-sizing:border-box; padding:0 5vw; } 
.visualSlide_wrap .slogan .t1 { font-size:1.875em; font-weight:500 } 
.visualSlide_wrap .slogan .t2 { font-size:3.65em; font-weight:800; line-height:1.05; } 
.visualSlide_wrap .slogan .t3 { font-size:1.675em; line-height:1.6; margin-top: 1.25em; } 
.visualSlide_wrap .slogan .ani { overflow:hidden } 
.visualSlide_wrap .slogan .ani > i { transform:translateY(200%); } 
.load .visualSlide_wrap .slogan .ani > i { transform:translateY(0); transition:1s } 
.load .visualSlide_wrap .slogan .ani.d1 > i { transition-delay:.5s } 
.load .visualSlide_wrap .slogan .ani.d2 > i { transition-delay:1s } 
.load .visualSlide_wrap .slogan .ani.d3 > i { transition-delay:1.5s } 
.load .visualSlide_wrap .slogan .ani.d4 > i { transition-delay:2s } 
.visualSlide_control { margin-top:2em; display:flex; align-items:flex-end; width:100% } 
.visualSlide_control .control { margin:0 0 1em auto } 
.visualSlide_control .paging { width:5em; text-align:center; } 
.visualSlide_control .paging .swiper-pagination-current { font-weight:700 } 


.visualSlideSlogan_wrap .slogan .load_txt { font-size: 3.15em; font-weight: 500; color: transparent; opacity: 0; text-shadow: 0 0 16px white; } 

.mainScroll { color:#fff } 
.mainScroll .line { position:relative; display:block; height:4em; overflow:hidden } 
.mainScroll .line:before { content:""; position:absolute; left:50%; top:0; height:100%; width:1px; background:#fff; } 
.mainScroll .dot { position:absolute; left:50%; transform:translateX(-50%); top:0; width:.5em; height:.5em; background:#fff; border-radius:50% } 
.mainScroll .tt { display:block; transform:rotate(90deg); font-size:.75em; margin:0 0 2.5em 0 } 
.mainScroll .tt .xi { font-size:1.5em; margin-right:.25em } 

.main_con { padding: 6em 0; } 

.main_tit { margin-bottom:4em; display:flex; flex-direction:column; } 
.main_tit.mbn { margin-bottom: 0em; } 
.main_tit.g1 { gap:2em } 
.main_tit.hc { align-items:center; text-align:center } 
.main_tit.vc { justify-content:center } 
.main_tit .t1 { font-size: 3.15em; font-weight: 800; color: var(--crBlack) } 
.main_tit .t2 { font-size: 2.35em; font-weight: 800; } 
.main_tit .t3 { font-size: 26px; letter-spacing: -0.03em; line-height: 1; word-break: keep-all; word-wrap: break-word; line-height: 1.4; font-weight: 400; color: #333; margin-top: 20px; } 
.main_tit .t4 { font-size: 1.25em; margin-bottom: .5em; font-weight: 900; text-transform: uppercase; color: var(--siteC); } 
.main_tit .tit1 { font-size:7.25vw; font-weight:900; letter-spacing:-.063em; word-spacing:.125em } 
.main_tit .tit1.s1 { font-size:5.5em } 
.main_tit .tit1.s2 { font-size:3em } 
.main_tit .tt1 { font-size:1.25em; line-height:1.8; font-weight:500 } 
.main_tit .vodW { position:relative } 
.main_tit .vodW .vod_wrap { position:absolute; left:0; top:0; width:100%; height:100%; mix-blend-mode:lighten } 
.main_tit .vodW .twrap { background:#fff } 
.main_tit .c1 { opacity:.1 } 

.main_more { } 
.main_more .btn { position: relative; display: inline-block; min-width: 160px; width: auto; padding: 14px 24px; border-radius: 99px; font-size: 20px; letter-spacing: -0.03em; line-height: 1; color: #fff; text-align: center; vertical-align: middle; box-sizing: border-box; background-color: var(--siteC); overflow: hidden; transition: color 0.2s linear; } 
.main_more .btn.s1 { font-size: 18px; } 
.main_more .btn > .xi { margin-left: .5em; } 
.main_more .btn.line:before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; transition: bottom 0.2s linear; background-color: #fff; } 

.main_more .btn.line { border: 1px solid var(--siteC); color: var(--siteC); background-color: var(--siteC); } 
.main_more .btn.line:hover:before { bottom: 100%; } 
.main_more .btn.line:hover { color: #fff; } 
.main_more .btn > * { position:relative; } 


/*메인 서브 타이틀*/
.main_tit { position:relative; } 
.main_tit .icon:before { width: 3.15em; height: 1px; background: var(--siteC); content: ''; } 
.main_tit .icon.white:before { background: #fff; } 
.main_tit .main_subt { margin-bottom: 1em; } 
.main_tit .main_subt .tt { font-size: 1.65em; font-weight: 700; } 
.main_tit .main_subt .tt.ffEN { font-size: 2.15em; font-weight: 700; } 
.main_tit .icon { display: inline-flex; align-items: center; gap: 1em; } 

.mainFlex { display:flex; gap:4em; align-items:flex-start; position:relative; box-sizing:border-box } 
.mainFlex .wrapTit { width:30%; position:sticky; left:0; top:0; padding:5em 0; box-sizing:border-box } 
.mainFlex .wrapCon { flex:1 1 0%; min-width:0 } 

/*메인 텍스트 슬라이드*/
.marqueeAni { animation-name: marqueeAni; animation-duration: 30s; animation-timing-function:linear; animation-iteration-count: infinite } 
@keyframes marqueeAni { 
 0% { transform:translateX(0); } 
100% { transform:translateX(-50%); } 
 }
.page_mq { overflow:hidden; } 
.page_mq .mqTT { display:flex; flex-shrink:0; white-space:nowrap; text-transform: uppercase; } 
.page_mq .mqTT.bod { border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; } 
.page_mq .mqTT.c1 { color: #f4f4f4; } 
.page_mq .mqTT.c2 { color: var(--siteC4); } 
.page_mq .mqTT > * { margin:0 .375em; } 
.page_mq .mqTT .name { margin: 0 .375em 0 0; } 
.page_mq .mv_tit { } 
.page_mq .mv_tit .tit { font-weight: 900; } 
.page_mq .mv_tit .tit.fs1 { font-size: 7.45em; } 

/*메인 비즈니스*/
.buSlide_wrap { position:relative; } 
.buSlide { position:relative; } 
.buSlide .el { } 
.buSlide .el > .img_box { position: relative; box-sizing: border-box; padding: 2.5rem; width: 100%; height: 38rem; } 
.buSlide .el > .img_box:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .4); content: ''; } 
.buSlide .el > .img_box:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 100%; z-index: 1; background: linear-gradient(144deg, rgba(0, 209, 210, 0.7) 0%, rgba(18, 129, 255, 0.7) 100%); opacity: 0; transition: 0.5s; } 
.buSlide .el > .img_box > .txt_area { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 80%; margin-top: 4em; transition: .5s; z-index: 2; } 
.buSlide .el > .img_box > .txt_area > strong { font-size: 2.65em; font-weight: 800; color: #fff; } 
.buSlide .el > .img_box > .txt_area > .txt { font-size: 1.25em; line-height: 1.4; color: #fff; margin-top: 15px; transition: .5s; transform: translateY(30px); opacity: 0; } 
.buSlide .el > .img_box > .txt_area > .main_more { transform: translateY(30px); transition: .5s; opacity: 0; } 
.buSlide .el > .img_box:hover:before { top: 0; opacity: 1; } 
.buSlide .el > .img_box:hover > .txt_area { margin-top: 0em; } 
.buSlide .el > .img_box:hover > .txt_area > .main_more,
.buSlide .el > .img_box:hover > .txt_area > .txt { transform: translateY(0); opacity: 1; } 

.buSlide_wrap .swiperBtn.p_ar,
.buSlide_wrap .swiperBtn.p_al { font-size: 1.65em; } 
.buSlide_wrap .swiperBtn.p_al { left: -65px; } 
.buSlide_wrap .swiperBtn.p_ar { right: -65px; } 

.buSlide_wrap .paging-con { position: absolute; left: 50%; transform: translateX(-50%); padding-top: 4em; } 
.buSlide_wrap .paging-con .swiper-pagination-bullet { /*width: 30px; height: 3px; */ width: 8px; height: 8px; border: 1px solid var(--siteC); background: #fff; border-radius: 50%; transition: all .2s; } 
.buSlide_wrap .paging-con .swiper-pagination-bullet-active { background: var(--siteC); } 

/*메인 비즈니스 서비스*/
.main_service { position:relative; background: var(--siteC); overflow: hidden; } 
.main_service .mark_img { position: absolute; left: -25em; bottom: 0; z-index: 1; } 
.main_service .mark_img > img { width: 99em; height: 100%; filter: brightness(0) invert(1); opacity: .07; } 
.service_wrap { position:relative; z-index: 2; } 
.service_wrap .wrap_con { gap: 12em; } 
.service_wrap .wrap_con .tit_Con { width: 50%; display: flex; flex-direction: column; justify-content: space-between; } 
.service_wrap .wrap_con .tit_Con > .img_con { width: 100%; height: 14rem; border-radius: 20em; overflow: hidden; } 
.service_wrap .wrap_con .tit_Con > .img_con > img { width: 100%; height: 100%; object-fit: cover; } 
.service_wrap .wrap_con .tit_Con > .main_tit .t4,
.service_wrap .wrap_con .tit_Con > .main_tit .t3,
.service_wrap .wrap_con .tit_Con > .main_tit .t1 { color: #fff; } 
.service_wrap .wrap_con .round_con { width: 40%; } 

.round_con .round_list { } 
.round_con .round_list > li { text-align: center; } 
.round_con .round_list > li > .in { margin: 0 0 1em 1em; } 
.round_con .round_list > li > .in > .icon_box { display: flex; align-items: center; justify-content: center; margin: 0 auto; width: 8em; height: 8em; border-radius: 50%; background: #fff; transition: .25s; } 
.round_con .round_list > li > .in > .icon_box > img { width: 3em; } 
.round_con .round_list > li > .in > .icon_box.qr > img { width: 4em; } 
.round_con .round_list > li > .in > .tit { font-size: 16px; color: rgba(255, 255, 255, 1); text-align: center; margin-top: 7px; font-weight: 600; } 
.round_con .round_list > li > .in:hover > .icon_box { background: var(--siteC2); } 
.round_con .round_list > li > .in:hover > .tit { color: rgba(255,255,255, 1);  } 

/*메인 구인*/
.main_hu { position: relative; } 
.main_hu:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .25); content: ''; } 
.main_hu .main_tit .t4,
.main_hu .main_tit .t3,
.main_hu .main_tit .t1 { color: #fff; } 

/*메인 공지*/
.notice_wrap { } 
.notice_wrap .noticeSlide { margin-left: -45px; } 
.notice_wrap .noticeSlide .el { min-width: 25%;} 
.notice_wrap .noticeSlide .el > .infoB { position:relative; display: block; padding: 0 45px; border-right: 1px solid #ddd; } 
.notice_wrap .noticeSlide .el > .infoB > .top { padding-bottom: 1.5em; transition: .25s; align-items: center; } 
.notice_wrap .noticeSlide .el > .infoB > .top > .tt { font-size: 1.25em; font-weight: 800; } 
.notice_wrap .noticeSlide .el > .infoB > .top > .xi { transform: rotate(-45deg); font-size: 1.65em; } 
.notice_wrap .noticeSlide .el > .infoB > .date_con { } 
.notice_wrap .noticeSlide .el > .infoB > .date_con > .year { font-size: .85em; color: #444; } 
.notice_wrap .noticeSlide .el > .infoB > .date_con > .date { font-size: 1.1em; font-weight: 800; } 
.notice_wrap .noticeSlide .el > .infoB > .title_con { margin: 1.5em 0; height: 3em; } 
.notice_wrap .noticeSlide .el > .infoB > .title_con > p { font-size: 1.1em; font-weight: 700; } 
.notice_wrap .noticeSlide .el > .infoB > .img_con { width: 100%; height: 9rem; border: 1px solid #ddd; border-radius: 1em; overflow: hidden; } 
.notice_wrap .noticeSlide .el > .infoB > .img_con > img { width: 100%; height: 100%; object-fit: cover; } 

.notice_wrap .noticeSlide .el > .infoB:hover .top { color: var(--siteC); } 
.notice_wrap .noticeSlide .el > .infoB:hover .title_con > p { text-decoration: underline; } 


.slide_wrap { position:relative; } 
.slide_wrap .control { gap: 2em; } 
.slide_wrap .control .swiperBtn { width: auto; height: 1.5em; background: transparent; color: #111; font-size: 2.15em; } 
.slide_wrap .control .swiperBtn.prev:before { content:"\e906" } 
.slide_wrap .control .swiperBtn.next:before { content:"\e907" } 

/*메인 링크*/
.main_link { position:relative; overflow: hidden; } 
.onSlider > li { width:50%; cursor: pointer; } 
.onSlider > li .bg { opacity: 0; transition:.3s } 
.onSlider > li .con { position:relative; z-index:2; justify-content: center; border-right:1px solid rgba(255,255,255,.2); color:#fff; background: rgba(0,0,0, .5); height: 20rem; text-align:center; transition:.3s; } 
.onSlider > li .con .tit { font-weight:700; font-size:1.875em; margin-bottom: .75em; margin-top:3em; opacity: .75; transition: .5s; } 
.onSlider > li .con .txt { font-size: 1.1em; font-weight: 500; line-height: 1.5; margin-bottom: 1em; opacity: 0; transition: .5s; transform: translateY(30px); } 
.onSlider > li .con .xi { opacity: 0; transition: .5s; transform: translateY(30px); } 
.onSlider > li .con .list { color: #fff; width:auto; padding-right:1em; } 
.onSlider > li .con .list > li > span { font-weight: 700; opacity: 1; } 

.onSlider > li:hover .bg { opacity:1 } 
.onSlider > li.on .bg { opacity:1 } 

.onSlider > li:hover .con .tit { margin-top: 1em; opacity: 1; } 
.onSlider > li:hover .con .xi,
.onSlider > li:hover .con .txt { transform: translateY(0); opacity: 1; } 

/*메인 파트너*/
.main_partner { padding-bottom: 3em; } 
.partner-gradient { z-index: 2; background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent 51%, #fff); position: absolute; inset: 0%; overflow: hidden; } 
.partnerSlide_wrap { } 
.partnerSlide_wrap .partnerSlide { position:relative; } 
.partnerSlide_wrap .partnerSlide .swiper-wrapper { transition-timing-function: linear; } 
.partnerSlide_wrap .partnerSlide .el { } 
.partnerSlide_wrap .partnerSlide .el > .Pbox { display: flex; align-items: center; justify-content: center; padding: 1.15em 1em; box-sizing: border-box; } 
.partnerSlide_wrap .partnerSlide .el > .Pbox > img { width: 14em; max-height: 45px; height: 45px; object-fit: contain; } 

/* 메인 컴파니 */
.main_company{ background: var(--crGray2);}
.main_company .infor_wrap{}
.main_company .infor_wrap .wrap_con{gap: 4em;}
.main_company .infor_wrap .tit_Con{width: 50%; flex-shrink: 0;}
.main_company .infor_wrap .vod_wrap{width: 100%; height: 25rem; overflow: hidden; position: relative;}

/* sub */



/*페이지 숫자 리스트*/


.page_con.bg4 {background: #f4f4f4;}
.ttdot { position: relative; padding-left: 0.8em; } 
.ttdot:before { position: absolute; content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); top: 8.5px; left: 0; } 

.fw400{ font-weight: 400;}
.fw500{ font-weight: 500;}
.fw600{ font-weight: 600;}
.fw700{ font-weight: 700;}
.fw800{ font-weight: 800;}
.fw900{ font-weight: 900;}
.base {vertical-align: baseline;}

html.pop .popWrap.privacy {width: 900px; margin: 0 auto;}

.flex_table .thead{ margin-bottom:1em}
.flex_table .tbody{ display:flex; flex-direction:column; height:100%}
.flex_table .tr{ flex:1 1 0%; min-height:0; display:flex; border:1px solid #ddd; box-sizing:border-box; overflow:hidden}
.flex_table .tr:not(:last-child){border-bottom:none}
.flex_table .tr:first-child{ border-top-left-radius:.5em; border-top-right-radius:.5em}
.flex_table .tr:last-child{ border-bottom-left-radius:.5em; border-bottom-right-radius:.5em}
.flex_table .td{ display:flex; flex-direction:column; align-items:center; min-height:2.5em; justify-content:center; text-align:center; flex:1 1 0%; min-width:0; box-sizing:border-box; padding:1em; border-right:1px solid #ddd}
.flex_table .td.al{ align-items:flex-start}
.flex_table .td:last-child{ border-right:none}
.flex_table .td.bg1{ background:#f5f5f5}
.flex_table .td.w1{ flex:0 0 10em}
.flex_table .td.w2{ flex:0 0 8em}
.flex_table .td.wName{ flex:0 0 7em}
.flex_table .td.wPo{ flex:0 0 4em}
.flex_table .td.wMail{ flex:0 0 12em}
.flex_table .td.wTel{ flex:0 0 9em}
.flex_table .thead .tr{ box-shadow:0 .25em .5em rgba(0,0,0,.1); background:#fff; color:#0060ae}
.flex_table .thead .tr:first-child{ border-top-left-radius:0; border-top-right-radius:0; border-top:1px solid #0060ae}
.flex_table .flex_table{ flex: 1 1 0; min-width:0}
.flex_table .flex_table .thead{ margin-bottom:0}
.flex_table .flex_table .tr{ border:none; border-bottom:1px solid #ddd}
.flex_table .flex_table .tr:last-child{ border-bottom:none}


/* 회사소개 - 개요 */

.greeting_Wrap { } 
.greeting_Wrap .Greeting_con { gap: 4em; align-items: center; } 
.greeting_Wrap .Greeting_con .G_left { flex: 1 1 35%; } 
.greeting_Wrap .Greeting_con .G_left .img_con { width: 100%; height:35.5em; } 
.greeting_Wrap .Greeting_con .G_left .img_con > img { width: 100%; height: 100%; object-fit: cover; } 
.greeting_Wrap .Greeting_con .G-right { flex: 1 1 60%; } 
.greeting_Wrap .Greeting_con .G-right > .top_logo { width: 14.5em; margin-bottom: 1.25em; } 
.greeting_Wrap .Greeting_con .Top_ttl { position:relative; } 
.greeting_Wrap .Greeting_con .Top_ttl .gary_t { position: absolute; bottom: 4.5em; left: 25%; } 
.greeting_Wrap .Greeting_con .Top_ttl .gary_t > p { font-weight: 900; color: #e9e9e9; font-size: 4.45em; font-style: italic; opacity: .65; } 
.greeting_Wrap .Greeting_con .Top_ttl > p { font-size: 2.3em; font-weight: 500; } 
.greeting_Wrap .Greeting_con .Top_ttl > p > span { } 
.greeting_Wrap .Greeting_con .G_line { position:relative; border: 1px dashed #e9e9e9; width: 100%; margin: 2.25em 0; } 
.greeting_Wrap .Greeting_con .G_line:before { position: absolute; left: 0; width: 70px; height: 1px; background: var(--siteC); content: ''; } 
.greeting_Wrap .Greeting_con .G_btm { } 
.greeting_Wrap .Greeting_con .G_btm .page_tt { } 
.greeting_Wrap .Greeting_con .G_btm .page_tt > .tt { font-size: 1.25em; font-weight: 500; margin-top: 1em; line-height: 1.5; color: #444; } 
.greeting_Wrap .Greeting_con .G_btm .page_tt > .tt:first-of-type { margin-top: 0em; } 
.greeting_Wrap .Greeting_con .G_btm .ceo { margin-top: 1.5em; align-items: center; gap:1em;} 
.greeting_Wrap .Greeting_con .G_btm .ceo .sign{ width: 16em;}
.greeting_Wrap .Greeting_con .G_btm .ceo .ceo_t { text-align: right;} 
.greeting_Wrap .Greeting_con .G_btm .ceo .ceo_t > p { font-size: 1.45em; font-weight: 600; } 
.greeting_Wrap .Greeting_con .G_btm .ceo .ceo_t > p > span { font-size: 1.5em; } 

.page_ttbg_bg { background: url(../images/sub/vision_bg.jpg); padding: 6em 0; background-attachment: fixed; } 
.page_ttbg_bg .sub_tt.t4 { margin-bottom: 1em; } 

.company_list {gap: 1em;}
.company_list .el {flex: 1 1 32.3%; border: 1px solid #fff; text-align: center; color: #fff; background: rgba(255, 255, 255, .1); padding: 2em 0;}
.company_list .el .tit {font-size: 1.5em; font-weight: 800;  margin-bottom: 1em;}
.company_list .el .tt {font-size: 1.125em; min-height: 3em;}

.summary_con {gap: 3em;}
.summary_con .left {width: 30%; background: var(--siteC); padding: 1.5em 1em; border-radius: .8em;}
.summary_con .left .tt {background: #fff; color: var(--siteC); padding: .5em 1em; border-radius: 3em; margin-bottom: .8em; font-size: 1.125em; font-weight: 600;}
.summary_con .left .tt:last-child {margin-bottom: unset;}
.summary_con .right {flex: 1 100%; background: #fff; padding: 1em; border-radius: 1em;}
.legal_sys{}
.legal_sys .sysT{ width:60%; margin:0 auto; padding:1.5em 1em; box-sizing:border-box; border-radius:.5em; background:var(--siteC); color:#fff; text-align:center; position:relative;}
.legal_sys .sysT::after{ content:''; width:100%; height:27px; border-left:1px dashed #002144; position:absolute; left:50%; bottom:-26px;}
.legal_sys .sysB .in > li{}
.legal_sys .sysB .in > li {}
.group{ width:calc( (100% - 30px)/4); margin-right:10px; border:1px solid var(--siteC);; border-radius:.5em; position:relative; background: #fff;}
.group.w2 {width:calc( (100% - 30px)/2);}
.group .tt{ display:flex; justify-content:center; align-items:center; width:100%; height:3em; font-size:1.125em}
.group .td{ align-items:center; padding:0 1em; font-size:1rem; line-height:1.4; color:#333; word-break:keep-all}
.group:last-child{ margin-right:0;}
.group:before{ content:''; width:calc( 100% + 9px); height:1em; border-top:1px dashed #002144; border-left:1px dashed #002144; position:absolute; left:50%; top:-24px;}
.group:last-child:before{ border-top:none; border-left:1px dashed #002144;}
.group:after{ content:''; width:10px; height:10px; border:4px solid var(--siteC2);; border-radius:50%; background-color:#fff; position:absolute; left:50%; top:-9px; transform:translateX(-50%);} 


/*  */
.page_certificate { } 
.page_certificate .list { gap: 4.5em 2em; } 
.page_certificate .list > li { position: relative; flex: 0 0 calc(25% - 2em); cursor: pointer; } 
.page_certificate .list > li .img-area { position: relative; padding: 2.5em; background: var(--crGray2); border: 3px solid transparent; transition: 0.3s; box-sizing: border-box; } 
.page_certificate .list > li .xi { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 2.5em; height: 2.5em; border: 3px solid var(--siteC); border-radius: 50%; color: var(--crWhite); background: var(--siteC); opacity: 0; visibility: hidden; transition: 0.3s; display: flex; align-items: center; justify-content: center; } 
.page_certificate .list > li:hover .xi { opacity: 1; visibility: visible; } 
.page_certificate .list > li:hover .img-area { border-color: var(--siteC); } 
.page_certificate .list > li .img-area .imgfix { box-shadow: 0 0 30px rgba(0, 0, 0, .075); width: 210px; height: 310px; } 
.page_certificate .list > li .txt { margin-top: 1.5em; text-align: center; } 
.page_certificate .list > li .txt > p { font-size: 1.125rem; } 
.page_certificate .list > li .txt > span { display: inline-block; font-size: 1rem; color: var(--crGray3); margin-top: 10px; } 

.page_certificate.st2 .list { gap: 2em 2em; }
.page_certificate.st2 .list > li .img-area { position: relative; padding: 1.5em; background: var(--crGray2); border: 3px solid transparent; transition: 0.3s; box-sizing: border-box; } 
.page_certificate.st2 .list > li .img-area .imgfix { box-shadow: 0 0 30px rgba(0, 0, 0, .075); width: 272px; height: 100px; background: #fff; text-align: center;} 
.page_certificate.st2 .list > li .img-area .imgfix img {width: 14em; max-height: 45px; height: 45px; object-fit: contain; padding-top: 1.5em;}

html.pop .popWrap.img {width: 25vw; opacity: 0; transform: scale(0.5); transition: 0.5s;}
html.pop .popWrap.img.ani {opacity: 1; transform: scale(1);}
html.pop .popWrap.img .popTit {background: transparent; padding: 0; justify-content: flex-end;}
html.pop .popWrap.img .popTit .popClose .xi {color: #fff; text-align: right;}
html.pop .popWrap.img .tit .t1 {display: inline-block; font-size: 1.125rem; color: #fff; font-weight: 500; margin-top: 1rem;}

.page_prime {}
.page_prime .list {gap: 4.5em 2em; }
.page_prime .list > li {position: relative; flex: 0 0 calc(25% - 2em);}
.page_prime .list > li .tt {line-height: 1.6;}
.page_prime .list > li .tt span {vertical-align: baseline;}

/* 경원의 장점 */

.slogan_wrap { margin-top:4em;}
.slogan_wrap .top { margin-bottom: 8em;}
.slogan_wrap .midd {margin-bottom:8em;}
.slogan_wrap .midd .inn_box { width:28.3%;}
.slogan_wrap .inn_box p {font-size: 1.2em; font-weight: 500;display: inline-block; min-width: 11.4em; background: #fff; border: 2px solid var(--siteC2); color: #000; padding: 1em 2em; border-radius: 1em;}
.slogan_wrap .midd .inn_box .logo {width: 10em; margin: 0 auto; height: 10em; line-height: 10em; background-color: var(--siteC); border-radius: 50%; position:relative; padding: 2em; z-index: 2;}
.slogan_wrap .midd .inn_box .logo:after { position:absolute; top: -42.5%; left: -41.5%; content:''; border:1px solid rgba(51,51,51,.3); border-radius:50%; width:25.9em; height:25.9em;}
.slogan_wrap .midd .logo img {filter: var(--crWhitefil);}
.slogan_wrap .left_box {margin-right: 5em;}
.slogan_wrap .left_box .logo {width: 10em; margin: 0 auto; height: 10em; line-height: 10em; background-color: #fff; border-radius: 50%; position:relative; padding: 2em; z-index: 2;}
/*.slogan_wrap .left_box .logo:after { position:absolute; top: -8.5%; left: -20.5%; content:''; border:1px solid rgba(51,51,51,.3); border-radius:50%; width:16.9em; height:16.9em;}*/
.slogan_wrap .right_box {}
.slogan_wrap .right_box .inn_box { margin-bottom:1em;}

.circle { position: absolute;top: 0; left: 0; background-color: inherit; border:1px solid var(--siteC2); height: 100%; width: 100%; border-radius: 100%; opacity: 0.5; animation: pulse 3s ease-out infinite; z-index: -1;}
.circle:nth-of-type(1) {animation-delay: -0.5s;}
.circle:nth-of-type(2) { animation-delay: -1s;}
.circle:nth-of-type(3) {animation-delay: -1.5s;}

@keyframes pulse {
      100% {
        transform: scale(1.5);
        opacity: 0;
      }
}

.slogan_wrap .inn_box {position:relative;}
.slogan_wrap .inn_box.dot1:before { position:absolute; bottom: -33%; left:50%; content:''; width:.5em; height:.5em; background-color:var(--siteC2); border-radius:50%;}
.slogan_wrap .inn_box.dot2:before { position:absolute; bottom:50%; right:0.5%; content:''; width:.5em; height:.5em; background-color:var(--siteC2); border-radius:50%;}
.slogan_wrap .inn_box.dot3:before { position:absolute; bottom:50%; left:2.5%; content:''; width:.5em; height:.5em; background-color:var(--siteC2); border-radius:50%;}
.slogan_wrap .inn_box.dot4:before { position:absolute; top:-40%; left:50%; content:''; width:.5em; height:.5em; background-color:var(--siteC2); border-radius:50%;}

/* 오시는길 */
.map_Wrap{}
.map_Wrap .map_con{ overflow: hidden; border-radius: 1em;}
.map_Wrap .map_infoCon{ padding-top: 4.5em;}
.map_Wrap .map_infoCon .contact_list{ margin-top: 1em; gap: 4em;}
.map_Wrap .map_infoCon .contact_list > li{ position:relative;}
.map_Wrap .map_infoCon .contact_list > li:before{ position: absolute; top: 50%; right: -2rem; transform: translateY(-50%); width: 1px; height: 1.6rem; background-color: #888; content: "";}
.map_Wrap .map_infoCon .contact_list > li:last-of-type:before{ content: none;}
.map_Wrap .map_infoCon .contact_list > li > p{ font-size: 1.6em;}
.map_Wrap .map_infoCon .contact_list > li > p > span{ color: #666; font-weight: 600;}

.map_Wrap .map_infoCon .map_box{ padding-bottom: 3.5em; margin-bottom: 3.5em; border-bottom: 1px solid #ddd;}
.map_Wrap .map_infoCon .map_box:last-of-type{ margin-bottom: 0em; padding-bottom: 0em; border: none;}
.root_daum_roughmap .wrap_controllers{ display: none;}

.way_list {}
.way_list li {border-bottom: 1px dashed #ddd;}
.way_list li .left_icon {width: 20%; text-align: center; }
.way_list li .left_icon > i {width: 3em; height: 3em; background: var(--siteC); line-height: 3em; color: #fff; border-radius: 50%; font-size: 1.6em;}
.way_list li .right_info {flex: 1 100%; padding: 2em 0; }
.way_list li .right_info .detail_ti {font-size: 1.3em; font-weight: 700; margin-bottom: 1em; color: var(--siteC);}
.way_list li .right_info .detail_t {margin-bottom: .5em;}
.way_list li .right_info .detail_t:last-child {margin-bottom: unset;}
.way_list li .right_info .detail_t span {background: var(--gradC2); color: #fff; padding: .5em 1em; border-radius: 3em; margin-right: .5em;}
.way_list li .right_info .detail_t span.c1 { background: #6585c3; }
.way_list li .right_info .detail_t span.c2 { background: #3a77bc; }
.way_list li .right_info .detail_t span.c3 { background: #5bb946; }


/* 경원이야기 */

.greeting_dp3 { margin-bottom: 3em; } 
.greeting_dp3 .gnb { justify-content:center; } 
.greeting_dp3 .dp3 { justify-content:center; background: #f4f4f4; } 
.greeting_dp3 .dp3 > li { width: 12em; } 
.greeting_dp3 .dp3 > li > a { display: inline-block; text-align: center; padding: 1em 0; font-size: 1.125em; font-weight: 500; width: 100%; border: 1px solid #f4f4f4; border-radius: .5em; } 
.greeting_dp3 .dp3 > li:hover > a,
.greeting_dp3 .dp3 > li.on > a { background: #fff; border: 1px solid var(--siteC2); color: var(--siteC2); } 

.greeting_dp3.st2 { position: absolute; top: 5%;left: 50%; transform: translate(-50%, -150%); } 
.greeting_dp3.st2 .gnb { justify-content:center; } 
.greeting_dp3.st2 .dp3 { justify-content:center; background: #f4f4f4; } 
.greeting_dp3.st2 .dp3 > li { width: 12em; } 
.greeting_dp3.st2 .dp3 > li > a { display: inline-block; text-align: center; padding: 1em 0; font-size: 1.125em; font-weight: 500; width: 100%; border: 1px solid #f4f4f4; border-radius: .5em; } 
.greeting_dp3.st2 .dp3 > li:hover > a,
.greeting_dp3.st2 .dp3 > li.on > a { background: #fff; border: 1px solid var(--siteC2); color: var(--siteC2); } 

/* 연혁 */

.page_twrap_img { position:relative; padding-bottom:7em } 
.page_twrap_img .wrap_con { width:70%; background:#fff; position:relative; z-index:1; box-sizing:border-box; padding:3em; padding-bottom:4em } 
.page_twrap_img .wrap_con:before { content:""; position:absolute; left:0; top:0; width:2em; height:2em; border:.25em solid #0060ae; border-right:none; border-bottom:none } 
.page_twrap_img .wrap_img { position:absolute; left:0; bottom:0; width:100%; height:70% } 
.page_twrap_img .wrap_img .img { height:100% } 
.page_twrap_img.st1 { padding-bottom:5em } 
.page_twrap_img.st1 .wrap_con { width:80%; margin:0 auto; text-align:center; padding:3em; border-top:1px solid #111 } 
.page_twrap_img.st1 .wrap_con.st2{ width:80%; margin:0 auto; text-align:center; padding:2em; border-top:1px solid #111 } 
.page_twrap_img.st1 .wrap_con:before { display:none } 
.page_twrap_img.st1 .wrap_img { height:80% } 

.history_wrap { display:flex; align-items:flex-start; position:relative; padding:4em 0 1em 0 } 
.history_wrap:before { content:""; position:absolute; top:0; width:1px; height:calc(100% - 3em); background:#ddd } 
.history_wrap:before,
.history_wrap .tabLink { left:27em } 
.history_wrap .wrap_tab { width:27em; padding:1em 0; padding:0 6em 0 3em; box-sizing:border-box } 
.history_wrap .wrap_tab > li > a { margin:2em 0; color:#111; position:relative; filter:grayscale(1); transition:.3s } 
.history_wrap .wrap_tab > li > a:before { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,.5) } 
.history_wrap .wrap_tab > li > a .t1 { font-weight:700; font-size:1.75em } 
.history_wrap .wrap_tab > li.on > a,
.history_wrap .wrap_tab > li > a:hover,
.history_wrap .wrap_tab > li > a:focus { filter:grayscale(0); color:#fff } 
.history_wrap .wrap_tab > li.on > a:before,
.history_wrap .wrap_tab > li > a:hover:before,
.history_wrap .wrap_tab > li > a:focus:before { width:100%; height:100%; background:rgba(0,0,0,.2) } 
.history_wrap .wrap_tab > li.on > a { border-color:#111; box-shadow:0 0 .5em rgba(0,0,0,.1) } 
.history_wrap .wrap_tab > li.on > a:after { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:100%; height:100%; border:.25em solid #0063ae } 
.history_wrap .wrap_con { flex:1 1 0%; min-width:0; box-sizing:border-box; padding:2em 0; padding-right:6em } 
.history_wrap .tabLink { width:5em; height:3em; position:absolute; bottom:0; transform:translatex(-50%) } 
.fadeAni { animation-name: fadeAni; animation-duration: 2s; animation-iteration-count: infinite } 
.history_wrap .tabLink .xi { font-size:3em; position:absolute; left:0; top:0; width:100%; text-align:center; color:#ddd; margin-left:1px; animation-duration: 3s; animation-iteration-count: infinite } 
.history_wrap .tabLink .xi:before { content:"\e943" } 
.history_wrap .tabLink.tab1 .xi:before { content:"\e946" } 
.history_wrap .tabLink .xi:nth-child(1) { transform:translateY(-.188em) scale(.6); animation-name: angleAni1 } 
.history_wrap .tabLink .xi:nth-child(2) { transform:scale(.8); animation-name: angleAni2 } 
.history_wrap .tabLink .xi:nth-child(3) { transform:translateY(.188em); animation-name: angleAni3 } 
.history_wrap .tabLink.tab1 .xi:nth-child(1) { transform:translateY(-.188em) scale(1); animation-name: angleAni3 } 
.history_wrap .tabLink.tab1 .xi:nth-child(3) { transform:translateY(.188em) scale(.6); animation-name: angleAni1 } 
.history_wrap .tabLink:hover .xi,
.history_wrap .tabLink:focus .xi { animation-name: none; color:#0060ae } 
@keyframes angleAni1 { 
 0% { color: #ddd } 
10% { color: #0063ba } 
20% { color: #ddd } 
 }
@keyframes angleAni2 { 10% { color: #ddd } 
20% { color: #0063ba } 
30% { color: #ddd } 
 }
@keyframes angleAni3 { 20% { color: #ddd } 
30% { color: #0063ba } 
40% { color: #ddd } 
 }
.history > li { padding:0 0 4em 4em; position:relative } 
.history > li:before { content:""; position:absolute; left:0; top:1.25em; width:3em; height:1px; background:#ddd } 
.history > li .dot { position:absolute; left:0; top:1.25em; transform:translate(-50%,-50%); width:1.5em; height:1.5em } 
.history > li .dot:before,
.history > li .dot:after { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; border-radius:50% } 
.history > li .dot:before { background:none; } 
.history > li .dot:after { background:#ccc; width:40%; height:40% } 
.history > li .year .t1 { font-weight:700; font-size:1.75em; letter-spacing:-.063em } 
.history > li .list { padding:1em 0 } 
.history > li .list > li { display:flex; padding:.5em .125em } 
.history > li .list > li .month { width:4em; margin-right:2em } 
.history > li .list > li .con { flex:1 1 0%; min-width:0; padding:.125em 0; color:#666 } 
.history > li .list > li .con .t1 { font-size:1.063em } 
.history > li .month .t1 { font-weight:500; font-size:1.125em; } 
.history > li.on .year,
.history > li.on .list > li .month { color:#0060ae } 
.history > li.on .list > li .con { color:#111; font-weight:500 } 
.history > li.on .dot:before { background:#0060ae; opacity:.4; animation-name: scaleAni; animation-duration: 2s; animation-iteration-count: infinite } 
.history > li.on .dot:after { background:#0060ae } 
@keyframes scaleAni { 100% { opacity:0; width:150%; height:150% } 
 }


/* 구인 */
.recuit_tit { margin-bottom: 3em; } 
.recuit_tit .t1 { font-size: 2em; font-weight: 700; } 
.recuit_tit .t1 span { vertical-align: baseline; } 
.recuit_tit .t2 { font-size: 1.25em; margin-top: 1em; } 


.business-con01 .area { position: relative; width: 100%; height: 690px; -webkit-box-sizing: border-box; box-sizing: border-box; } 
/* 배경 세계지도 */
.business-con01-bg { position: absolute; top: 0; left: 50%; margin-left: -650px; width: 1300px; height: 690px; background: url("../images/content/business_bg.jpg") center/cover no-repeat; } 
/* 동그란 dashed 영역 */
.business-cir { position: absolute; top: 110px; left: 0; right: 0; margin: auto; width: 500px; height: 500px; border: 3px dashed #e4e4e4; -webkit-border-radius: 100%; border-radius: 100%; } 
.business-cir:before { position: absolute; top: 50%; left: 50%; margin-top: -214.5px; margin-left: -214.5px; display: block; content: ''; width: 429px; height: 429px; background: url("../images/content/business_con01_line.png") center/cover no-repeat; animation: spinL 10s infinite linear; } 
.business-cir:after { position: absolute; top: 50%; left: 50%; margin-top: -185.5px; margin-left: -185.5px; display: block; content: ''; width: 371px; height: 371px; background: url("../images/content/business_con01_cirbg.png") center/cover no-repeat; } 
/* 가운데 로고 영역 */
.business-cir-logo { position: absolute; top: 50%; left: 50%; margin-top: -140px; margin-left: -140px; width: 280px; height: 280px; background-color: #fff; border: 1px solid #eee; -webkit-border-radius: 100%; border-radius: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; z-index: 1; } 
.business-cir-logo img { position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; display: block; max-width: 80%; } 
/* 각 링크 영역 */
.business-cir-link { position: absolute; top: 110px; left: 0; right: 0; margin: auto; width: 500px; height: 500px; } 
.business-cir-link-list { } 
.business-cir-link-item { position: absolute; z-index: 1; } 
.business-cir-link-item a { display: block; width: 190px; } 
.business-cir-link-item a.ta-c { text-align: center; } 
.business-cir-link-item a.ta-l { text-align: left; } 
.business-cir-link-item a.ta-r { text-align: right; } 
.business-cir-link-item a .dot { position: absolute; display: block; width: 20px; height: 20px; background-color: rgba(0,69,151,0.2); -webkit-border-radius: 100%; border-radius: 100%; } 
.business-cir-link-item a .dot:before { position: absolute; top: 50%; left: 50%; margin-top: -5px; margin-left: -5px; display: block; content: ''; width: 4px; height: 4px; border: 3px solid #004597; background-color: #fff; -webkit-border-radius: 100%; border-radius: 100%; } 
.business-cir-link-item a .dot:after { position: absolute; top: 50%; left: 50%; margin-top: -21px; margin-left: -21px; display: block; content: ''; width: 40px; height: 40px; border: 1px solid #e8e8e8; -webkit-border-radius: 100%; border-radius: 100%; opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } 
.business-cir-link-item a h5 { font-size: 24px; font-weight: 500; letter-spacing: -0.65px; color: #222; -webkit-transition: color 0.3s; transition: color 0.3s; } 
.business-cir-link-item a p { margin-top: 7px; font-size: 15px; line-height: 1.3; letter-spacing: -0.25px; color: #999; } 
/* selected */
.business-cir-link-item.selected a h5 { font-weight: 600; color: #004597; } 
.business-cir-link-item.selected a .dot:after { opacity: 1; } 
/* 각 item css */
.business-cir-link-item.item01 { top: -85px; left: 50%; margin-left: -95px; } 
.business-cir-link-item.item01 a .dot { bottom: 85px; left: 50%; margin-left: -10px; } 

.business-cir-link-item.item03 { top: 40px; right: -149px; } 
.business-cir-link-item.item03 a .dot { top: -4px; left: -53px; } 

.business-cir-link-item.item05 { top: 440px; right: -135px; } 
.business-cir-link-item.item05 a .dot { top: 2px; left: -55px; } 

.business-cir-link-item.item04 { top: 440px; left: -135px; } 
.business-cir-link-item.item04 a .dot { top: 2px; right: -55px; } 

.business-cir-link-item.item02 { top: 24px; left: -102px; } 
.business-cir-link-item.item02 a .dot { top: -4px; right: -53px; } 
.agree_box {height: 12em; border: 1px solid #ddd; padding: 1em;}
.popWrap .agree_box {border: unset;}
.ren_price {font-size: 1.125em; font-weight: 600;}
.ren_price2 {font-size: 1em;}
.ren_price2 span {font-weight: 600; font-size: 1.25em; margin: 0 .2em;}
.logowrap{width: 15em;}
.subpage_wrap > .con_wrap{ border-bottom: 1px solid #ddd; line-height: 1.4; }
.subpage_wrap > .con_wrap:first-child{border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; line-height: 1.4; }
.subpage_wrap > .con_wrap > strong {font-size: 2.5em; font-weight: 700; width: 3em; padding: .5em 0;}
.subpage_wrap > .con_wrap > p { width: 100%; padding: 1.5em 0; font-size: 1.5em;}

.course_list { width: 100%; } 
.course_list> li { width: calc(25% - 2em);gap: 2em; } 
.course_list> li > .in { height : 20em; border-radius: 50%; padding: 1.5em; box-sizing: border-box; position: relative; flex-wrap: nowrap; display: block; } 
.course_list> li > .in> .con > .txtwrap {color: #fff;}
.course_list> li > .in> .con > .txtwrap > .tit{font-size: 1.8em; font-weight: 800;}

.course_list> li > .in.pic1 { background-image: url(../images/sub/management/sub_img1.jpg); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } 
.course_list> li > .in.pic2 { background-image: url(../images/sub/management/sub_img2.jpg); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } 
.course_list> li > .in.pic3 { background-image: url(../images/sub/management/sub_img3.jpg); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } 
.course_list> li > .in.pic4 { background-image: url(../images/sub/management/sub_img4.jpg); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; }