@charset "UTF-8";

/* 넓이 설정 */
.bodyWrap {margin:0 auto; min-width:360px; word-break:keep-all; transition:all ease 0.4s 0.3s;}
.colWide {margin:0 auto; padding:0 15px; max-width:1830px; min-width:360px;}

/* 콘텐츠 영역 설정 */
.mainContents {position:relative; display:block; }
.subContents {position:relative; display:block; padding:100px 0;}
.inner {position:relative; max-width:1280px; margin:0 auto;}

/* 상단 레이아웃 디자인 */
.header {position:fixed; top:0; left:0; width:100%; padding:25px 0; transition:all ease 0.4s 0.0s; z-index:99;}
.header .colWide {display:flex; align-items:stretch;}
.header.scroll_on {min-height:auto; background:#fff; box-shadow:0 1px 5px 0 rgba(0,0,0,0.15);}
.header .logo {padding:0 40px 0 0;}
.header .logo a {display:block; width:240px; height:50px; margin:0 0 0; background:url('../images/logo.png') no-repeat 50% 50%; background-size:100% auto;}

.menuWrap {display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:baseline; width:100%;}
.mainMenu {display:flex; text-align:center;}
.mainMenu a {transition:all ease 0.3s 0.0s;}
.mainMenu > li > a {display:block; padding:10px 35px; font-size:18px; font-weight:600; color:#fff;}
.mainMenu > li > a [href="javascript:;"] {cursor:inherit;}
.mainMenu > li:hover ul {border-color:#01b4e5;}
.mainMenu ul {display:none; padding:10px 0; margin:7px 0 0; font-size:15px; border-top:2px solid transparent;}
.mainMenu ul li a {display:block; padding:5px 0;}
.mainMenu ul li a:hover {color:#01b4e5;}
.header.scroll_on .mainMenu > li > a {color:#111}

.drawerBtn,.mainMenu .box_menu {display:none;}
.bgAllMenu {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7);}

/* 하단 레이아웃 디자인 */
.footer {position:relative; display:block; background:#f6f6f6; padding:80px 0;}
.footer .snsInfo {display:flex; justify-content:space-between;}
.footer .snsInfo div i[class*="xi-"] {font-size:34px; color:#a9a9a9;}
.footer .snsInfo dd a:hover,.footer .snsInfo div > a:hover i {color:#2947CA;}
.footer .comlanyInfo {font-size:14px; line-height:18px;}
.footer .comlanyInfo .br_none {display:none;}

/* sub-location */
.location_box {position:absolute; width:100%; margin-top:-30px; z-index:21}
.locationArea {max-width:1280px; margin:0 auto;}
.locationArea .location {display:table; table-layout:fixed; width:100%; background:#2947CA; z-index:21}
.locationArea .location > li {display:inline-block; vertical-align:middle; position:relative; height:60px; border-left:1px solid #5973e5;}
.locationArea .location > li:first-child {margin-left:0; border-left:none;}
.locationArea .location > li.home > a {text-align:center; display:block; width:60px; line-height:60px; font-size:1.5rem; color:#fff;}
.locationArea .location > li.locationLink > a {padding:0 40px; height:60px; line-height:60px; color:#fff; transition:0.4s; text-align:center; width:100%; border-right:1px solid #5973e5;}
.locationArea .location > li.locationLink > a.active {opacity:1.0; text-decoration:underline;}
.locationArea .location > li.locationLink a:hover,.locationArea .location > li.locationLink.on a {opacity:1.0; transform:translateY(-10px); text-decoration:underline;}

/*  contents : sub */
.sub_visual_title {position:absolute; margin-top:300px; left:50%; transform:translateX(-50%); width:100%; max-width:1280px;}
.sub_visual_title h2 {font-weight:600; font-size:50px; color: #fff; letter-spacing:-0.03em; text-transform: uppercase;}
.subContents .sub_title {margin-bottom:60px; text-align:center; padding-bottom:26px; border-bottom:1px solid #dfdfdf;}
.subContents .sub_title h2 {font-size:30px; font-weight:600;}

/* sub-topbg : sub이미지, sub타이틀 */
.sub_topbg {width:100%; height:500px; margin:0 auto; background-position: 50% 50%; background-repeat:no-repeat; background-size:cover; background-color:rgba(0, 0, 0, 0.5);}
.sub_topbg.topbg01 {background-image:url(../images/subVisual01.jpg);}
.sub_topbg.topbg02 {background-image:url(../images/subVisual02.jpg);}
.sub_topbg.topbg03 {background-image:url(../images/subVisual03.jpg);}
.sub_topbg.topbg04 {background-image:url(../images/subVisual04.jpg);}
.sub_topbg.topbg05 {background-image:url(../images/subVisual05.jpg);}

/* 미디어쿼리 적용 */
@media screen and (max-width:1280px) {
	.subContents,.footer {padding:50px 15px;}
	.mainMenu > li a {font-size:16px;}
}

@media screen and (max-width:1024px) {
	.header {height:70px; padding-top:10px; padding-bottom:5px;}
	.header .logo a {width:190px;}
}

@media screen and (max-width:960px) {
	.menuWrap {display:block; position:fixed; top:0; padding-top:30px; right:-300px; width:300px; height:100%; background:#fff;}
	.mainMenu {display:block; text-align:left;}
	.mainMenu > li {position:relative;}
	.mainMenu > li a {color:#111}
	.mainMenu > li > a:after {content:"\e941"; position:absolute; top:12px; right:20px; width:22px; height:22px; line-height:22px; display:block; text-indent:0; font-size:20px; color:#888; vertical-align:middle; font-family:'xeicon'; transition:all ease 0.3s 0s;}
	.mainMenu > li.gotChild > a:after {content:"\e944"; background:#fff;}
	.mainMenu > li.on > a:after {border-color:#2947CA;}
	.mainMenu > li.on > a:after {color:#2947CA;transform:rotate(180deg);}
	.mainMenu ul {padding:10px 0 10px 45px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; background:#f8f8f8;}
	.mainMenu ul li:last-child {padding-bottom:0;}
	.mainMenu ul li:first-child {padding-top:0; margin-top:0; border-top:0;}
	.mainMenu ul li a:before {content:"\e93f"; display:inline-block; margin:0 10px 0 -15px; text-indent:0; font-size:18px; vertical-align:middle; font-family:'xeicon';}
	.mainMenu .box_menu {display:block; position:absolute; top:0; width:100%; height:70px; background-color:#2947CA;}
	.mainMenu .box_menu span{font-weight:700; font-size:20px; line-height:70px; letter-spacing:-0.025em; color:#fff; padding-left:35px;}
	.mainMenu .m_mt {margin-top:45px;}

    .drawerBtn {display:block; position:fixed; top:15px; right:15px;}
	.drawerBtn button {font-size:40px;}
	.drawerBtn button i {transition:all ease 0.7s 0s;}
	.drawerBtn.on button {color:#fff;}
	.drawerBtn.on button i {transform:rotate(180deg);}

	.sub_topbg {height:360px;}
	.sub_visual_title {margin-top:240px; padding:0 15px;}
	.sub_visual_title h2 {font-size:40px;}
	.subContents .sub_title {margin-bottom:40px; padding-bottom:40px;}
	.location_box {display:none;}
}

@media screen and (max-width:768px) {
	.footer .comlanyInfo .br_none {display:block; line-height:0;}
}

@media screen and (max-width:640px) {
	.sub_topbg {height:240px;}
	.subContents .sub_title h2 {font-size:24px;;}
	.sub_visual_title {margin-top:160px;}
	.sub_visual_title h2 {font-size:30px;}

	.footer {padding:40px 15px;}
	.footer .snsInfo {flex-direction:column;}
	.footer .snsInfo > div {width:100%; text-align:center;}
}

@media screen and (max-width:480px) {
}