@charset "utf-8";

/* ===================================
	layout
 =================================== */
.inner {position:relative; max-width:1400px; margin:0 auto;}
.inner2 {position:relative; max-width:600px; margin:0 auto;}
.mgT100{margin-top: 100px}
.header-wrap.js-open-m{z-index: 9}
.subContents.js-open-m{z-index: 0}
/* 공통 */
.fx{display: flex; display: -ms-flex; display: -webkit-flex;}
.fr{float: right;}
.grid{max-width:1400px; width:100%; margin:0 auto;position: relative;}
body.js-fixed {position:fixed; width:100%;}
.wrap {position:relative; min-width:320px; overflow:hidden; background:#fefefe;max-width: 100%;margin: 0 auto;}
.video_wrap{position: absolute;width: 100%;height: 100%;top: 0;left: 0;max-width: 100%;}
.video_wrap video{width: 100%}
/*header*/
.header-wrap { width:100%; position:absolute; z-index:1004; transition: all 0.3s ease-in-out; top:0;color: #fff;max-width: 100%;}
.header-inner { text-align:center; width:100%; margin:0 auto; position: relative;}
.header-logo {position:absolute; left:50px;top:50%; transform:translateY(-50%); width:98px; height:50px; transition: all 0.3s ease-in-out; z-index:1001;}
.header-logo a {display:block; width:100%; height:100%; background:url('../images/common/logo.png') 0 center no-repeat;  overflow:hidden; text-indent:-9999px; text-align:left; background-size:100%; transition: all 0.3s ease-in-out;}
.js-open-d .header-logo a,.js-fixed .header-logo a{background:url('../images/common/logo_h.png') 0 center no-repeat;}

/*GNB*/
.gnb {transition: all 0.3s ease-in-out; position:relative; z-index:1000;}
.gnb.js-open-d,.js-fixed .gnb{background: #fff; }
.gnb:after {content:''; display:block; background-color:#fff; position:absolute;left:0; top:120px; height:00px; width:100%;transition: all 0.3s ease-in-out;}
.gnb.js-open-d:after {height:120px; border-top: 1px solid #eee;}
.gnb-wrap {font-size:0;display:inline-block;position: relative;left: -120px;border-bottom: 1px solid rgba(255,255,255,0.2); text-align: left;}
.gnb-1dep{display:inline-block; vertical-align:middle; height:120px; position:relative;transition: all .3s ease;}
.gnb-1dep::before {content: "";width: 100%;height: 100%;position: absolute;display: block;transition: all .5s ease;top: 100%;visibility: hidden}
.gnb-1dep.js-open-d::before{background:#0e5ab8;transition: all .5s ease;top: 0;visibility: visible;}
.gnb.js-open-d .gnb-1dep > a span{color: #222}
.gnb.js-open-d .gnb-1dep > a span, .js-fixed .gnb .gnb-1dep > a span{color: #222}
.gnb-1dep > a {display:block; line-height:120px; padding:0 25px; font-size:18px; font-weight:500;  text-transform: uppercase;position:relative;  box-sizing: border-box; transition: all 0.3s ease-in-out;}

.gnb-1dep.js-open-d > a span{color: #fff !important}
.gnb-1dep > a span,
.gnb-1dep > a em {color:#fff; display:inline-block; line-height:1.3; transition: all 0.3s ease-in-out; vertical-align: baseline; font-family: 'S-CoreDream';}
.gnb-1dep.js-open-d > a em {color:rgba(56, 154, 214, 1);}
.gnb-2dep {max-height:0; overflow:hidden; position:absolute;left:50%; transition: all 0.3s ease-in-out; z-index:1000; white-space: nowrap; transform: translateX(-50%);visibility: hidden;}
.gnb-1dep:nth-child(1) .gnb-2dep,.gnb-1dep:nth-child(2) .gnb-2dep,.gnb-1dep:nth-child(3) .gnb-2dep{left:0; transform: translateX(0);}

.gnb-2dep > li {display:inline-block; line-height:118px; vertical-align:middle;}
.gnb-2dep > li > a {position: relative;display:inline-block; padding:0 20px; font-size:16px; color:#666; font-weight: 600; line-height:1.3; text-align:left; transition: all 0.3s ease-in-out;}
.gnb-2dep > li > a:hover { color:#004caa;}
.gnb-2dep > li > a::after{content: "";width: 6px;height: 6px;background: #004caa;position: absolute;border-radius: 100%;right:40px;transition: all .3s ease;opacity: 0; top: 50%; transform: translateY(-50%);}
.gnb-1dep.js-open-d .gnb-2dep{max-height:120px; transition: all .3s ease;visibility: visible;}
.gnb-2dep > li > a:hover::after{right: 10px;transition: all .3s ease;opacity: 1;}
.gnb-inner-util {display:none;}
.gnb-dimmed{position:fixed; top:0px; left:0; z-index:999; width:100%; height:100%; background-color:rgba(0, 0, 0, .5);display:none; }
/* .gnb-dimmed.js-open-d {display:block;} */

.subContents{min-height: 600px;position: relative;z-index: 1002;}

/*Util*/
.top__util {position:absolute; font-size:0; z-index:1000;top: 0%; right: 0; }
.top__util-inner .top__util-item {display: block;transition: all .3s ease;float: left;text-align: center}
.top__util-inner .top__util-item a{font-size: 15px;color: #fff;display: block;line-height: 120px;width: 125px;min-height: 120px}
.top__util-inner .top__util-item.item1{background: #4087df}
.top__util-inner .top__util-item.item2{background: #1b69c9}
.top__util-inner .top__util-item.item3{background: #0e5ab8}
.top__util-inner .top__util-item.item4{background:#0f3f88 url('../images/contents/m_menu.png') center no-repeat}

.top__util-inner2{width: 125px;flex-direction: column;position: absolute;right: 0}
.top__util-inner2 .top__util-item {display: block;transition: all .3s ease;position: relative;text-align: center}
.top__util-inner2 .top__util-item p{font-size: 15px;color: #fff;display: block;;width: 125px;padding: 35px 0;line-height: 24px;}
.top__util-inner2 .top__util-item p span.title {display: block;}
.top__util-inner2 .top__util-item p span.num{display: inline-block;font-weight: 900;font-size: 17px}
.top__util-inner2 .top__util-item p em{font-weight: 400;font-size: 13px}
.top__util-inner2 .top__util-item.item1{background: #0087be}
.top__util-inner2 .top__util-item.item2{background: #009aab}
.top__util-inner2 .top__util-item.item2::after{content: "";position: absolute;background: url('../images/main/main_bg.png') no-repeat bottom; width: 600px;height: 600px;right: 0;top: 0;z-index: -1}
.top__util-inner2 .top__util-item.item2.sub::after {display: none;}
.subContents::after {display: block; content: ""; position: absolute; background: url('../images/main/sub_bg.png') bottom no-repeat; width: 600px; height: 450px; right: 0; top: -65px; z-index: -1;}





/* 22.04.13 - 회원가입메뉴 마이페이지 전환 */
.top__util-item.item2 {position: relative;}
.top__util-item.item2 .top__gnb-2dep {max-height: 0; overflow: hidden; width: 300%; position: absolute; top: 100%; right: 0; transition: all .3s ease-in-out;}
.top__util-item.item2 .top__gnb-2dep li {background: #fff; text-align: left; padding: 0 20px;}
.top__util-item.item2 .top__gnb-2dep li:first-child {padding-top: 20px;}
.top__util-item.item2 .top__gnb-2dep li:last-child {padding-bottom: 20px; position: relative;}
.top__util-item.item2 .top__gnb-2dep li:last-child::before {display: block; content: ""; width: 100px; height: 86px; position: absolute; bottom: 20px; right: 14px; background: url('../images/member/my-page.png') no-repeat center;}
.top__util-item.item2 .top__gnb-2dep a {display: inline-block; width: auto; font-weight: 500; font-size: 14px; color: #666; min-height: 1px; line-height: 1.4; padding: 5px 0; position: relative; z-index: 1;}
.top__util-item.item2 .top__gnb-2dep a::before {display: block; content: ""; width: 0; height: 1px; background: #0e5ab8; position: absolute; top: 22px; left: 0; transition: all .3s ease-in-out;}

.top__util-item.item2:hover .top__gnb-2dep {max-height: 2000px; }
.top__util-item.item2 .top__gnb-2dep a:hover {color: #0e5ab8;}
.top__util-item.item2 .top__gnb-2dep a:hover::after {display: block; content: ""; width: 6px; height: 6px; border-radius: 50%; background: #0e5ab8; position: absolute; top: 50%; right: -16px; transform: translateY(-50%);}

.top__util-item.item2 .top__gnb-2dep a.on {color: #0e5ab8;}
.top__util-item.item2 .top__gnb-2dep a.on::after {display: block; content: ""; width: 6px; height: 6px; border-radius: 50%; background: #0e5ab8; position: absolute; top: 50%; right: -16px; transform: translateY(-50%);}
.top__util-item.item2 .top__gnb-2dep a:hover::before {width: 100%;}

@media only screen and (max-width:650px) {
  .top__util-item.item2 .top__gnb-2dep {right: auto; left: 0;}
}


/* 언어선택 */
.top__util .lang{ cursor: pointer; position: relative; font-size: 12px;line-height: 120px;width: 125px}
.top__util .lang .lang_view{align-items: center; justify-content: center; width:100%; height:100%; transition: all .3s ease}
.js-open-d .top__util .lang .lang_view,.js-fixed .top__util .lang .lang_view{transition: all .3s ease}
.top__util .lang .lang_view span{font-weight: 500;transition: all .3s ease;font-size: 16px;font-family: 'Montserrat', sans-serif;font-weight: 400}
.top__util .lang .lang_view.on span{font-weight: 700;transition: all .3s ease}
.top__util .lang .lang_view span::after{content: "";width: 10px;height: 6px; display: block;background: url('../images/main/lang_arrow.png') center no-repeat;position: absolute;top: 50%; right: 20%;
transform: translate(-50%, -50%);;transition: all .3s ease}
.top__util .lang .lang_view.on span::after{transform:translate(-50%, -50%) rotateZ(180deg);}
.top__util .lang a{display: block; width:100%; height:100%;}
.top__util .lang ul{position: absolute; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15); display: none;width: 100%}
.top__util .lang ul.on{display: block;}
.top__util .lang ul li a{position: relative;background:#fff;color:#666; box-sizing: border-box; transition: all .3s ease; font-size:12px;font-weight: 500;letter-spacing: 2.5px;transition: all .3s ease;font-family: 'Montserrat', sans-serif;line-height: 48px;min-height: 48px}
.top__util .lang ul li a::after{content: "";width: 6px;height: 6px;background: transparent;position: absolute;border-radius: 100%;top: 50%;left: calc(50% + 22px);transform: translate(-50%, -50%);transition: all .5s ease}

.top__util .lang ul li:hover a{font-weight: 700;text-decoration: underline;text-underline-position: under;transition: all .5s ease;text-decoration-color:rgba(14,90,184,0.5);text-decoration-thickness: 2px;color: #0e5ab8}
.top__util .lang ul li:hover a::after{background: #0e5ab8;transition: all .5s ease}


@media(max-width:1620px){
}

/* @media only screen and (max-width: 1024px) {
	.header-logo{left:10px;}
  .js-open-d .header-logo a, .js-fixed .header-logo a {background-size: contain;}
} */

/* 전체메뉴 */
.newAllmenu { z-index:99999; position:relative; display:none;}
.newAllmenu-close {display:block; position: fixed; right: 2%; top: 15px; width: 60px; height: 60px; z-index:1002; padding:0; font-size:0; background-color:transparent; transition: all 0.3s ease-in-out;overflow:hidden; text-indent:-8888888px;}
.newAllmenu-close span:before,
.newAllmenu-close span:after {content:''; display:block; width:48px; height:2px; background-color:#fff; position:absolute; top:50%; left:50%;transition: all 0.3s ease-in-out;}
.newAllmenu-close span:before {transform:translate(-50%, -50%) rotate(45deg);}
.newAllmenu-close span:after {transform:translate(-50%, -50%) rotate(-45deg);}
.newAllmenu-close:hover span:before,
.newAllmenu-close:focus span:before {transform:translateX(-50%) rotate(-45deg); background-color:#fff;}
.newAllmenu-close:hover span:after,
.newAllmenu-close:focus span:after {transform:translateX(-50%) rotate(45deg); background-color:#fff;}

.newAllmenu .container {position:fixed; top:0px; left:0; z-index:999; width:100%; height:100%; background-color:rgba(255, 255, 255, 1);}
.newAllmenu .container .content{position: relative; width:100%; height:100%;background: url(../images/main/bg_sitemap.jpg) no-repeat; background-position: bottom;background-size: cover;}
.newAllmenu .container .content .title_box h2{text-align: center; font-size:45px; font-family: 'S-CoreDream';}
.newAllmenu .container .content .title_box h2 span{position: relative; color:#fff; font-weight: 700;}
.newAllmenu .container .content .menu_box{align-items: center; }

.newAllmenu .container .content .menu_box .menu_group{width: 100%}
.newAllmenu .container .content .menu_box .menu_group .menu_list{margin-top:90px;}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul{display: table;width: 100%}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li{display: flex;transition: all .3s ease;padding-left: 15%;border-bottom: 1px solid rgba(255,255,255,0.15)}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li:first-child{border-top:1px solid rgba(255,255,255,0.15)}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li:hover{background:#f7f7f7;}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > h3{font-size:40px; color:#fff; padding:35px 60px; box-sizing: border-box; text-align: left; font-weight: 700;min-width: 360px;transition: all .3s ease}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li:hover > h3{color: #1b69c9;transition: all .3s ease}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul{display: table;}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li{position: relative;;display: table-cell;transition: all .5s ease}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li::before {content: "";width: 100%;height: 0;position: absolute;display: block;transition: all .5s ease; bottom: -1px; visibility: hidden;}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li:hover::before{background: #0e5ab8;transition: all .5s ease; visibility: visible; height: calc(100% + 1px);}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li:hover{transition: all .5s ease}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li:hover > ul > li > a{color:#222;}
.newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li:hover > ul > li:hover > a{color:#fff;}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li > a{padding:20px 30px; box-sizing: border-box; font-size:18px; color:#fff; display: block; text-align: center; font-weight: 500;}
.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li > a span {position: relative;padding-bottom: 10px;transition: all .3s ease}

.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li > a:hover{color:#0c4da2;}

.newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > ul > li > a:hover span::after{opacity:1;transition: all .3s ease}

.newAllmenu .container .content .menu_box .menu_group .text {padding: 35px 0;text-align: right;font-weight: 900;font-size: 110px;line-height: 90px}
.newAllmenu .container .content .menu_box .menu_group .text h3{color: #fff}
.newAllmenu .container .content .menu_box .menu_group .text h2{display: inline-block;}
.newAllmenu .container .content .menu_box .menu_group .text h2 span{color: #0c4da2;float: left;animation:colorchange 20s infinite alternate;transition: all .5s ease}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an1{animation-delay: .1s;animation-duration: 10s}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an2{animation-delay: .5s;}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an3{animation-delay: 1s;animation-duration: 9s}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an4{animation-delay: 1.5s;}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an5{animation-delay: 2s;}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an6{animation-delay: 1s;animation-duration: 13s}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an7{animation-delay: 1.2s;}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an8{animation-delay: 1.7s;animation-duration: 12s}
.newAllmenu .container .content .menu_box .menu_group .text h2 span.an9{animation-delay: 3s;}
@keyframes colorchange {
  0% {
    color: #82baff;
  }
  10% {
    color: #3983de;
  }
  20% {
    color: #0e5bb9;
  }
  30% {
    color: #009aab;
  }
  40% {
    color: #7cb4f8;
  }
  50% {
    color: #4d97f1;
  }
  60% {
    color: #0e5bb9;
  }
  70% {
    color: #12417c;
  }
  80% {
    color: #0087be;
  }
  90% {
    color: #023a83;
  }
  100% {
    color: #023a83;
  }
}

@media(max-width:1440px){
	.newAllmenu .container .content .title_box{display: none;}
	.newAllmenu .container .content .menu_box{width:100%; margin:0 auto; justify-content: center;}
}

@media only screen and (max-width: 1200px) {
	.newAllmenu-close {right:5px;}
}
@media only screen and (max-width: 1024px) {
	.newAllmenu{display:none !important;}
}

/*Sub Title*/
.contents__title {position:relative; color:#333; font-size:45px;}
.contents__title h3{text-align:left;font-size:40px;color:#222; position:relative; font-weight:700; padding:70px 0;}


@media only screen and (max-width:1024px){
	.contents__title {padding: 20px 0 0 0;}
	.contents__title h3{ font-size: 32px; padding-bottom:35px;}
}
@media only screen and (max-width:768px){
	.contents__title h3{ font-size: 28px; padding-bottom:30px; }
	.contents__title h3 span{ background-size:20px auto; padding:20px 0 0 0;}
}
@media only screen and (max-width:480px){
	.contents__title h3{ font-size: 24px; padding-bottom:25px; text-align: center;}
}

/*Sub Small Title*/
.sub__stitle {overflow:hidden;}
.sub__stitle h3 {text-align:center; position: relative; }
.sub__stitle span {background:#fff; padding:0 5%; display: inline-block; font-size:30px; font-weight:500; color:#222; margin:0 20px; line-height:1.3;}
.sub__stitle h3:before,
.sub__stitle h3:after {content:''; display:block; width: 50%; height:1px;  background:#ef413d; position:absolute; top:50%; z-index:-1;}
.sub__stitle h3:before {left:0;}
.sub__stitle h3:after {right:0;}

@media only screen and (max-width:768px){
	.sub__stitle span {font-size:24px;}
}

@media only screen and (max-width:480px){
	.sub__stitle span {font-size:20px;}
}

.sub_visual{position:relative; width:100%; margin:0 auto; height:360px; z-index: 1; align-items: center; overflow: hidden;}

.sub_visual.nth-1{background: url('../images/contents/sub1.jpg') no-repeat center / cover; }
.sub_visual.nth-2{background: url('../images/contents/sub2.jpg') no-repeat center / cover; }
.sub_visual.nth-3{background: url('../images/contents/sub3.jpg') no-repeat center / cover; }
.sub_visual.nth-4{background: url('../images/contents/sub4.jpg') no-repeat center / cover; }
.sub_visual.nth-5{background: url('../images/contents/sub5.jpg') no-repeat center / cover; }
.sub_visual.nth-6{background: url('../images/contents/sub7.jpg') no-repeat center / cover; }
.sub_visual.nth-7{background: url('../images/contents/sub7.jpg') no-repeat center / cover; }
.sub_visual.nth-8{background: url('../images/contents/sub6.jpg') no-repeat center / cover; }
.sub_visual.nth-9{background: url('../images/contents/sub1.jpg') no-repeat center / cover; }
.sub_visual-bg{position: absolute;;display: block;background-size: cover !important;transform:scale(1) skew(0.001deg);transition:all 10s ease-in-out;width: 100%;height: 100%}

.sub_visual .sub_visual-inner {width:100%;}
.sub_visual .sub_title h2{font-family: 'Montserrat', sans-serif;font-size: 40px;font-weight: bold;text-align: right;color:#fff; float: right; display: inline-block;text-align: left;margin-top: 45px}
.sub_visual .sub_title h2::before{content: "";width: 57px;height: 57px;display: block;position: absolute;background: url('../images/main/ic_slide.png') center no-repeat; background-size: contain;top: -7px;right: 185px}
.sub__title-text p{font-size: 14px;font-weight: 700;line-height: 23px;letter-spacing: 4px;text-align: right;color: #fff}

.lnb{position:relative; width:100%; bottom:0; left:0; text-align:left; border-bottom: 1px solid #e1e1e1; z-index: 1003;}
.lnb.js-open-m{z-index: 0}
.lnb-wrap{max-width:1400px; margin:0 auto; position:relative; width:auto;}

.lnb-list{font-size:0; background:transparent; position:relative;}
.lnb-list::before {content:''; display: block; width:1px; height:100%; background-color:#e1e1e1; position:absolute; top:0; left:0;}
.lnb-list > li{display:inline-block; vertical-align:top; position:relative;}
.lnb-list > li::before {content:''; display: block; width:1px; height:100%; background-color:#e1e1e1; position:absolute; top:0; right:0;}

.lnb-item {min-width:300px; max-width:30%; height:65px;}
.lnb-home{width:73px; height:65px;}
.lnb-home a{ height: 100%;display: block;padding:0; background: url('../images/contents/lnb_home.jpg') center no-repeat;font-size: 0}


.lnb-link {position:relative; display:block; line-height:65px; height:100%;padding:0 60px 0 20px; color:#222; transition:all 0.3s ease-in-out; border:1px solid; border-color:transparent;}
.lnb-link span {display:block;  overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:16px; font-weight:500;}
.lnb-link:after {content:''; display:block; position:absolute; right:16px; top:50%; height:24px; width:24px; background:transparent url('../images/common/lnb_open.png') center center no-repeat; transition: all .3s ease-in-out; transform:translateY(-50%); border-radius: 24px;;}

.lnb-link:hover{color:#222;background:rgba(255, 255, 255, 0.3);}
.lnb-link.js-active {background-color:rgba(255, 255, 255, 1); color:#222; border-color:#f1f1f1; border-bottom-color: transparent;}
.lnb-link.js-active::before {content:''; display:block; border-bottom:1px solid #f1f1f1; width:100%; position:absolute; height:1px; top: 63px;z-index: 9; left:50%; transform: translateX(-50%); }
.lnb-link.js-active:after { transform:translateY(-50%) rotate(180deg);}

.lnb__menu-list{position:absolute;left:0;top:65px; display:none; z-index:2;  width:100%; border:1px solid #f1f1f1; border-top:0; background-color:#fff;box-shadow:6px 7px 21px rgb(73 84 116 / 10%)}
.lnb__menu-list a {position: relative;;display:block; line-height:1.3; color:#666; font-weight:500; padding:20px; white-space: normal; word-break: break-all; transition:all 0.3s ease-in-out; position:relative;border-bottom: 1px solid #f1f1f1;font-weight: 400}
.lnb__menu-list a::after{position: absolute;top: 50%;left: 100%;transform: translate(calc(-100% - 20px), calc(-50% + 0.5px));content: "";width: 36px;height: 19px;display: block;background: url('../images/common/ic_menu.png') center no-repeat;transition: all .3s ease;opacity:0}
.lnb__menu-list a:hover:after{transition: all .3s ease;opacity:1}
.lnb__menu-list li:last-child a{border:0}
.lnb__menu-list a > span {display:inline-block; font-size:15px;}
.lnb__menu-list a:hover {font-weight:700; padding:20px 30px;color: #fff;background: #1b69c9;border-color: #1b69c9}
.lnb__menu-list a:hover::before {left:28px;}
.visual__contents{position:relative;}
.visual__contents-inner  {position:relative;}

/* .sub_visual{background-size: cover !important;}
.sub_visual.nth-1 .sub_visual-bg{background: url('../images/contents/bg_visual1.jpg') center no-repeat;}
.sub_visual.nth-2 .sub_visual-bg{background: url('../images/contents/bg_visual2.jpg') center no-repeat;}
.sub_visual.nth-3 .sub_visual-bg{background: url('../images/contents/bg_visual3.jpg') center no-repeat;}
.sub_visual.nth-4 .sub_visual-bg{background: url('../images/contents/bg_visual4.jpg') center no-repeat;}
.sub_visual.nth-5 .sub_visual-bg{background: url('../images/contents/bg_visual5.jpg') center no-repeat;}
.sub_visual.nth-6 .sub_visual-bg{background: url('../images/contents/bg_visual6.jpg') center no-repeat;} */

@media only screen and (max-width:1900px){
  .sub_visual .sub_title h2 {margin-right: 50px;}
}

@media only screen and (max-width:1620px){
  .sub_visual .sub_title h2 {margin-right: 100px;}
}

@media(max-width:1440px){
	.sub_title h2{font-size:45px;}
}

@media(max-width:1024px){
	.sub_title h2{font-size:35px;}
	.lnb-wrap ul li{font-size:20px;}
  .sub_visual{height: 400px}
}

@media only screen and (max-width:768px){
  .lnb-wrap {background: #fff;}
  .lnb-item {max-width: 50%; width: calc(50% - 37px); min-width: 1px;}
}

@media(max-width:500px){
	.lnb-wrap{height:auto;}
	.lnb-wrap > ul{flex-wrap: wrap; width:100%;}
	.lnb-wrap > ul > li{border-bottom:1px solid #ddd;}
	.lnb-wrap > ul > .home a{width:100%;  padding:0 30px;}
	.lnb-wrap > ul > .home a i{width:100%;}
	.lnb-wrap > ul > li > a{width:100%; display: flex; display: -ms-flex; display: -webkit-flex; justify-content: space-between;}
}

@media(max-width:425px){
	.lnb{border:0;}
	.lnb-wrap{width:100%;}
	.lnb-wrap > ul{width:100%;}
	.lnb-wrap ul li{font-size:14px;}
	.lnb-wrap ul li::after{top:-2px;}
	.sub_visual{height:370px;}

  .sub_visual .sub_title h2 {margin-right: 0; text-align: center; width: 100%;}
}

@media(max-width:1024px){
	/* .top__util .lang{font-size:14px; display: none;} */
	.top__util .lang ul li a{font-size:14px;}

  .gnb-inner-util .language-wrap {position:absolute; top:50%; left:0px; width:auto; display:block; transform: translateY(-50%); }
  .gnb-inner-util .language-list {background-color:transparent; border:0px;}
  .gnb-inner-util .language-list li {display: inline-block; margin-left:10px;}
  .gnb-inner-util .language-list li a {padding:10px 20px; font-size:12px; color:#fff; line-height:1.3; position:relative; border:1px solid rgba(255, 255, 255, 0.4);}
  .gnb-inner-util .language-list li a:hover {color:#5a4099; background-color: #fff;}
}


/* 사이드메뉴 유틸 - 22.04.15 */
.gnb-inner-util .top__util-inner {display: none;}
.gnb-inner-util .top__util-inner .top__util-item {width: 33.3333%;}
.gnb-inner-util .top__util-inner .top__util-item > a {display: block; text-align: center; line-height: 60px; width: 100%;}
.gnb-inner-util .top__util-inner .top__util-item.item2 .top__gnb-2dep {box-shadow: 0 5px 10px rgb(0 0 0 / 15%); max-width: 200px;}
.gnb-inner-util .top__util-inner .top__util-item.item2 .top__gnb-2dep a {padding: 10px 0;}
.gnb-inner-util .top__util-inner .top__util-item.item2 .top__gnb-2dep a:hover::before {top: 28px;}

.gnb-inner-util .lang {width: 100%; font-size:16px; cursor: pointer; position: relative; display: -ms-flex; display: -webkit-flex;}
.gnb-inner-util .lang .lang_view {display: block; width: 100%;}
.gnb-inner-util .lang .lang_view span {line-height: 60px; padding-right: 10px;}
.gnb-inner-util .lang .lang_view span::after {content: ""; width: 10px; height: 6px; display: block; background: url('../images/main/lang_arrow.png') center no-repeat; position: absolute; top: 50%; right: 5px; transform: translate(-50%, -50%); transition: all .3s ease-in-out;}
.gnb-inner-util .lang .lang_view.on span::after {transform: translate(-50%, -50%) rotateZ(180deg);}

.gnb-inner-util .lang a {display: block; width:100%; height:100%;}
.gnb-inner-util .lang ul {position: absolute; left:0; top:100%; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15); display: none; z-index: 9999; width:100%;}
.gnb-inner-util .lang ul.on {display: block;}
.gnb-inner-util .lang ul li a {width: 100%; line-height: 60px; background:#fff; transition: all .3s ease; font-size:16px; color: #666; text-align: center; display: block; box-sizing: border-box;}
.gnb-inner-util .lang ul li:hover a {background:#ddd;}




/* footer */

/* footer-top */
.footer{position: relative;}
.footer-top {position: absolute;;display: none;font-size: 0;width: 24px;height: 74px;background: url("../images/common/top.png") no-repeat center;top: 10px;right: 2%;transform: translate(-50%, 50%);transition: all .5s ease;z-index: 1}
.footer-top:hover{transform: translate(-50%, 25%);transition: all .5s ease}
.footer-top::before{content: "";position: absolute;width: 20px;height: 20px;background: rgba(27,105,201,0.5);top: 15%;left: 50%;transform: translate(-50%, -50%);border-radius: 100%;opacity: 0;z-index: -1}
.footer-top:hover::before{transform: translate(-50%, -50%) scale(2); opacity: 1;transition: all .5s ease}

/* footer-menu */
.footer__menu {background: #222; text-align: center; padding: 40px 0;}
.footer__menu-wrap {font-size: 0;}
.footer__menu-item {display: inline-block; position: relative;}

.footer__menu-item+.footer__menu-item::after {display: block; content: ""; width: 6px; height: 6px; border-radius: 50%; background: #004caa; position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%);}
.footer__menu-item a {display: block; padding: 0 35px; font-size: 16px; font-weight: 700; color: #fff;}
.footer__menu-item a span {vertical-align: baseline;}

.footer-bottom {padding: 84px 0 114px; text-align: center; position: relative;}
.footer_logo {position: absolute; top: 84px; left: 20px;}
.footer_logo a{width: 122px;height: 63px;background: url("../images/common/footer_logo.png") no-repeat center;display: block;font-size: 0}
.footer-item {display: inline-block; font-size: 16px; font-weight: 300; color: #666; line-height: 1.8;word-break: keep-all;}
.footer-item span {vertical-align: baseline;}

.footer-item+.footer-item {margin-left: 30px;}
.footer-item:nth-of-type(2) {margin-left: 0;}
.footer-item:nth-of-type(1) span {letter-spacing: 1px;}

.footer-copy {letter-spacing: 4px; text-transform: uppercase; margin-top: 40px; font-size: 12px; font-weight: 400; color: #161616;line-height: 1.5}


@media (max-width:1920px) {
  .video_wrap video{width: auto;}
}
@media(max-width:1620px){
  .header-wrap.js-fixed{background: #fff}

	.header-inner{height:90px;}
  .gnb:after{top: 91px;}
  .gnb-1dep{height: 90px}
  .gnb.js-open-d:after{height: 90px}
  .gnb-1dep > a{line-height: 90px;font-size: 16px}
  .gnb-2dep > li{line-height: 90px}
  .gnb-1dep.js-open-d .gnb-2dep{max-height: 90px}
  .top__util-inner .top__util-item a{line-height: 90px;min-height: 90px;width: 100px;font-size: 14px}
  .top__util .lang{line-height: 90px;min-height: 90px;width: 100px}
  .top__util-inner2{width: 100px}
  .top__util-inner2 .top__util-item p {width: auto;}
  .top__util-inner2 .top__util-item a{width: 100px;padding: 20px 0}
  .top__util-inner2 .top__util-item a strong{font-size: 15px}
  .top__util .lang .lang_view span{font-size: 14px}
  .top__util .lang .lang_view span::after{right: 10%}
  .top__util-inner2 .top__util-item.item2::after{width: 480px; height: 400px; background: url('../images/main/main_bg1.png') no-repeat bottom center / 100%;}
  .subContents::after {background: url('../images/main/sub_bg.png') no-repeat top right / contain; width: 480px; height: 590px;}

}
@media only screen and (max-width: 1440px) {
	.header-logo {left:40px;}
}

@media only screen and (max-width: 1200px) {
  .gnb-1dep > a{padding: 0 22px;font-size: 15px}
  .gnb-2dep > li > a{font-size: 14px}
  /* .gnb-wrap{left: 0} */

  /* .top__util{position: relative;float: right;} */
}
@media only screen and (max-width: 1100px) {
  .gnb-1dep > a{padding: 0 15px}
}

@media all and (max-width: 1024px) {
	.header-wrap {min-width:320px; height:60px;}
	.header-wrap.js-fixed .gnb:before,
	.header-wrap.js-fixed .gnb:after {display:none;}
	.gnb-1dep > a {font-size:14px;}

  .header-logo,
  .top__util {z-index: 999;}


	/*GNB*/

	/* .gnb {display: none} */
  .gnb {width:320px; height:100%; background:#fff; display:block; position:fixed; z-index:1005; top:0px; right:-100%;transition: all 0.3s ease-in-out; overflow-y:auto; }
  .gnb-1dep > a span,.gnb-1dep > a em{color: #222}
	.gnb-wrap {margin:0; width:100%;left: 0}
	.gnb.js-open-m {right:0;transition: all 0.3s ease-in-out; overflow-y:auto;}
	.gnb-1dep{display:block; font-size:16px; height:auto; position:relative; border-bottom: 1px solid #ddd; width:100%; max-width:100%; }
	.gnb-1dep > a {display:block; line-height:50px; padding:0 20px; color:#222; text-transform: none; margin:0;}
	.gnb-1dep > a:hover,
	.gnb-1dep.js-open-m > a{color:#222 !important;}
	.gnb-1dep > a:after {position: absolute; top: 20px; left:auto; right: 16px; width: 10px; height: 10px; border-width: 0 0 1px 1px; border-style: solid; border-color: #222; content: '';  transition: all 0.3s ease-in-out;  transform: rotate(-135deg); opacity: 1; background:transparent;}
	.gnb-1dep.js-open-m > a:after {top:20px;transition: all 0.3s ease-in-out; transform: rotate(-135deg);}
	.gnb-1dep > a.is-2depth-m:after {position: absolute; top: 16px; right: 16px; width: 10px; height: 10px; border-width: 0 0 1px 1px; border-style: solid; border-color: #222; content: '';  transition: all 0.3s ease-in-out;  transform: rotate(-45deg);}
	.gnb-1dep.js-open-m > a.is-2depth-m:after {top:22px;transition: all 0.3s ease-in-out; transform: rotate(-225deg);}
	.gnb-2dep,
	.gnb-1dep:nth-child(3) .gnb-2dep {height:auto; max-height:0; overflow:hidden; position:static; width:auto; padding:0; margin:0; background-color:#efefef;border-top:0px solid #ddd;  transform:translateX(0); border-radius: 0; box-shadow:none; transition: all 0.1s ease-in-out;}
	.gnb-1dep:last-child .gnb-2dep {margin-left:0;}
  .gnb-2dep{visibility: visible;}
	.gnb-2dep > li {border-bottom:1px solid #ddd; padding:0; margin:0; display: block; transition: all .3s ease;}
	.gnb-2dep > li > a {display:block; padding:12px 30px; font-size:15px; color:#666; text-align:left;font-weight: normal;}
	.gnb-2dep > li > a:hover,
	.gnb-2dep > li > a:focus {font-weight:400; padding:12px 30px; color:#222;}
	.gnb-2dep > li:first-child {margin-top:0px;}
	.gnb-2dep > li:last-child {margin-bottom:0px; border:0;}

	/*3depth*/
	.gnb-3dep { padding:0; border-top:1px dashed #ccc;}
	.gnb-3dep a {display:block; padding:8px 0 8px 45px; position:relative; color:#888;}
	.gnb-3dep a:hover {color:#222; padding:8px 0 8px 45px;}
	.gnb-3dep a:before,
	.gnb-3dep a:hover:before {left:38px; top:15px;}
	.gnb-3dep > li:last-child {margin-bottom: 0px;}
	.gnb-1dep.js-open-m > a:before {display:none;}
	.gnb-1dep.js-open-m .gnb-2dep{max-height:1000px;border-top:1px solid #ddd; transition: all 0.8s ease-in-out;}


	/*util*/
	.gnb-inner-util {display:block; position:relative; height:60px; background-color:#1b69c9; padding:0 60px 0 0;font-size:0;}
	.gnb-mbtn-close {display:block; position: absolute; z-index: 3000; top: 0; right: 0; bottom: 0; width: 60px; min-height: 26px; margin: auto 0px; text-indent: -999em; -webkit-transition: none; transition: none; cursor: pointer; background:#3a3a3a; overflow:hidden; }
	.gnb-mbtn-close:before, .gnb-mbtn-close:after, .gnb-mbtn-close > span:before, .gnb-mbtn-close > span:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 25px; height: 0; border-top: 2px solid #fff; margin: auto; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .3s; transition: .3s; content: ''; opacity: 1; }
	.gnb-mbtn-close:not(.zxcv):before { top: 16px; }
	.gnb-mbtn-close:not(.zxcv):after { bottom: 16px; }
	.js-open-m .gnb-mbtn-close {top:0px; right:0; min-height: 26px; }
	.js-open-m .gnb-mbtn-close:before, .js-open-m .gnb-mbtn-close:after, .js-open-m .gnb-mbtn-close > span:before, .js-open-m .gnb-mbtn-close > span:after {border-top: 2px solid #fff;  }
	.js-open-m .gnb-mbtn-close:before { width: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
	.js-open-m .gnb-mbtn-close:after { width: 0; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); }
	.js-open-m .gnb-mbtn-close > span:before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
	.js-open-m .gnb-mbtn-close > span:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
	.gnb-dimmed.js-open-m {display:block; top:0;}

  .footer-info {margin-left: 130px; padding: 0 20px;}
}

@media(max-width:800px){
  .footer_logo{position: relative;top: 0;margin-bottom: 50px; left: 0;}
  .footer-bottom{padding: 50px 0 100px}
  .footer_logo a{margin: 0 auto;}
  .footer-info{margin-left: 0}
  .footer-item{font-size: 14px}
  .footer-copy{font-size: 10px}
  .footer__menu-item a{font-size: 14px;padding: 0 20px}
}
@media(max-width:650px){
  .top__util-inner2{display: none}
  .top__util-inner .top__util-item.item1,.top__util-inner .top__util-item.item2,.top__util-inner .top__util-item.item3{display: none}
  .gnb-inner-util .top__util-inner {display: block;}
  .gnb-inner-util .top__util-inner .top__util-item.item1,
  .gnb-inner-util .top__util-inner .top__util-item.item2,
  .gnb-inner-util .top__util-inner .top__util-item.item3 {display: inline-flex; max-width: 33.3333%;}
  .top__util-item.item2 .top__gnb-2dep {z-index: 1;}
  .header-inner{height: 60px}
  .header-logo{height: 40px}

  .header-logo a,
  .js-open-d .header-logo a,
  .js-fixed .header-logo a {background: url('../images/common/logo_h.png') 0 center no-repeat; background-size: contain;}
  .header-wrap{position: fixed;background: #fff;z-index: 99999;border-bottom: 1px solid #ddd;box-sizing: border-box;}
  .top__util-inner .top__util-item a {min-height: 60px; line-height: 60px; width: 80px;}
  .subContents::after {display: none;}
}
@media(max-width:480px){
  .footer__menu{padding: 25px 0}
  .footer__menu-item a{font-size: 11px;padding: 0 15px}
  .footer__menu-item:first-child a{padding-left: 0}
  .footer__menu-item:last-child a{padding-right: 0}
  .footer-top{width: 21px;top:-100px;background: url(../images/common/top_h.png) no-repeat center;background-size: contain;}
}

@media(max-width:425px){
	.header-logo {width: 80px; left: 20px;}
}



/* 구글번역 - 22.05 .02 */
#google_translate_element {float: left; width: 125px; height: 120px; background: #5c9eef; position: relative;}
.goog-te-gadget {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0 !important; text-align: center;}
.goog-te-gadget .goog-te-combo {font-family: 'Noto Sans KR' !important;}
.goog-logo-link {position: absolute;}
/* .goog-te-gadget > span {font-size: 0;} */

@media only screen and (max-width:1620px) {
  #google_translate_element {width: 100px; min-height: 90px; height: auto;}
}

@media only screen and (max-width:650px) {
  #google_translate_element {max-height: 60px; min-height: 1px; height: 59px; background: #fff;}
}


/* 반응형 - 22.04.15 */

/* 공용 */
@media only screen and (max-width:1620px) {
  .sub_visual {height: 330px;}

  .newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li {padding-left: 5%;}
}

@media only screen and (max-width:1440px) {
  .grid {padding: 0 20px; max-width: 1440px;}

  /* 전체메뉴 */
  .newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > h3 {font-size: 30px; padding: 25px 20px;}

  /* GNB */
  .gnb-wrap {left: -135px;}
  .gnb-1dep > a {font-size: 12px; padding: 0 15px;}
}

@media only screen and (max-width: 1240px) {
  /* 전체메뉴 */
  .newAllmenu .container .content .menu_box .menu_group .menu_list > ul > li {padding-left: 0;}
  .newAllmenu .container .content .menu_box .menu_group .menu_list ul > li > h3 {width: 200px;}

  /*GNB*/
  .gnb {width:320px; height:100%; background:#fff; display:block; position:fixed; z-index:1005; top:0px; right:-100%;transition: all 0.3s ease-in-out; overflow-y:auto; }
  .gnb-1dep > a span,.gnb-1dep > a em{color: #222}
	.gnb-wrap {margin:0; width:100%;left: 0}
	.gnb.js-open-m {right:0;transition: all 0.3s ease-in-out; overflow-y:auto;}
	.gnb-1dep{display:block; font-size:16px; height:auto; position:relative; border-bottom: 1px solid #ddd; width:100%; max-width:100%; }
	.gnb-1dep > a {display:block; line-height:50px; padding:0 20px; color:#222; text-transform: none; margin:0;}
	.gnb-1dep > a:hover,
	.gnb-1dep.js-open-m > a{color:#222 !important;}
	.gnb-1dep > a:after {position: absolute; top: 20px; left:auto; right: 16px; width: 10px; height: 10px; border-width: 0 0 1px 1px; border-style: solid; border-color: #222; content: '';  transition: all 0.3s ease-in-out;  transform: rotate(-135deg); opacity: 1; background:transparent;}
	.gnb-1dep.js-open-m > a:after {top:20px;transition: all 0.3s ease-in-out; transform: rotate(-135deg);}
	.gnb-1dep > a.is-2depth-m:after {position: absolute; top: 16px; right: 16px; width: 10px; height: 10px; border-width: 0 0 1px 1px; border-style: solid; border-color: #222; content: '';  transition: all 0.3s ease-in-out;  transform: rotate(-45deg);}
	.gnb-1dep.js-open-m > a.is-2depth-m:after {top:22px;transition: all 0.3s ease-in-out; transform: rotate(-225deg);}
	.gnb-2dep,
	.gnb-1dep:nth-child(3) .gnb-2dep {height:auto; max-height:0; overflow:hidden; position:static; width:auto; padding:0; margin:0; background-color:#efefef;border-top:0px solid #ddd;  transform:translateX(0); border-radius: 0; box-shadow:none; transition: all 0.1s ease-in-out;}
	.gnb-1dep:last-child .gnb-2dep {margin-left:0;}
  .gnb-2dep{visibility: visible;}
	.gnb-2dep > li {border-bottom:1px solid #ddd; padding:0; margin:0; display: block; transition: all .3s ease;}
	.gnb-2dep > li > a {display:block; padding:12px 30px; font-size:15px; color:#666; text-align:left;font-weight: normal;}
  .gnb-2dep > li > a{font-size: 0}
  .gnb-1dep.js-open-m .gnb-2dep > li > a{font-size: 15px}
	.gnb-2dep > li > a:hover,
	.gnb-2dep > li > a:focus {font-weight:400; padding:12px 30px; color:#222;}
	.gnb-2dep > li:first-child {margin-top:0px;}
	.gnb-2dep > li:last-child {margin-bottom:0px; border:0;}

	/*3depth*/
	.gnb-3dep { padding:0; border-top:1px dashed #ccc;}
	.gnb-3dep a {display:block; padding:8px 0 8px 45px; position:relative; color:#888;}
	.gnb-3dep a:hover {color:#222; padding:8px 0 8px 45px;}
	.gnb-3dep a:before,
	.gnb-3dep a:hover:before {left:38px; top:15px;}
	.gnb-3dep > li:last-child {margin-bottom: 0px;}
	.gnb-1dep.js-open-m > a:before {display:none;}
	.gnb-1dep.js-open-m .gnb-2dep{max-height:1000px;border-top:1px solid #ddd; transition: all 0.8s ease-in-out;}


	/*util*/
	.gnb-inner-util {display:block; position:relative; height:60px; background-color:#1b69c9; padding:0 60px 0 0;font-size:0;}
	.gnb-mbtn-close {display:block; position: absolute; z-index: 3000; top: 0; right: 0; bottom: 0; width: 60px; min-height: 26px; margin: auto 0px; text-indent: -999em; -webkit-transition: none; transition: none; cursor: pointer; background:#3a3a3a; overflow:hidden; }
	.gnb-mbtn-close:before, .gnb-mbtn-close:after, .gnb-mbtn-close > span:before, .gnb-mbtn-close > span:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 25px; height: 0; border-top: 2px solid #fff; margin: auto; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .3s; transition: .3s; content: ''; opacity: 1; }
	.gnb-mbtn-close:not(.zxcv):before { top: 16px; }
	.gnb-mbtn-close:not(.zxcv):after { bottom: 16px; }
	.js-open-m .gnb-mbtn-close {top:0px; right:0; min-height: 26px; }
	.js-open-m .gnb-mbtn-close:before, .js-open-m .gnb-mbtn-close:after, .js-open-m .gnb-mbtn-close > span:before, .js-open-m .gnb-mbtn-close > span:after {border-top: 2px solid #fff;  }
	.js-open-m .gnb-mbtn-close:before { width: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
	.js-open-m .gnb-mbtn-close:after { width: 0; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); }
	.js-open-m .gnb-mbtn-close > span:before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
	.js-open-m .gnb-mbtn-close > span:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
	.gnb-dimmed.js-open-m {display:block; top:0;}
}

@media only screen and (max-width: 640px) {
  /* 푸터 */
  .footer__menu-item {width: 50%;}
  .footer__menu-item:last-child {width: 100%; margin-top: 20px;}
  .footer__menu-item:last-child::after {display: none;}
}
