@charset "utf-8";

.subSlide{max-width:1400px; width:100%; text-align:center; margin:0 auto;}
.owl-item{text-align:left; }
.subHeader{width:100%; height:auto; display:block; background:#3d4863;}
.subContainer .container, .subHeader .container{max-width:1400px; width:100%; height:100%; text-align:center; margin:0 auto; }
.subBg{width:100%; height:70px; display:flex; align-items:flex-end; margin:0 auto;}
.subBg p{color:#fff; display:flex; align-items:flex-end; width:100%; text-align:left; height:100%; font-size:39px; font-weight:600; letter-spacing:-4px; line-height:1; } 
.subBg p > span{font-size:18px; color:#fff; opacity:.45; font-weight:400; letter-spacing:0; text-transform:uppercase; margin-left:10px;}
.subPart-01 .subBg p{background:url('../../images/ep/mainBtn-01_over.png') bottom right / auto no-repeat;}
.subPart-02 .subBg p{background:url('../../images/ep/mainBtn-02_over.png') bottom right / auto no-repeat;}
.subPart-03 .subBg p{background:url('../../images/ep/mainBtn-03_over.png') bottom right / auto no-repeat;}
.subPart-04 .subBg p{background:url('../../images/ep/mainBtn-04_over.png') bottom right / auto no-repeat;}
.subPart-05 .subBg p{background:url('../../images/ep/mainBtn-05_over.png') bottom right / auto no-repeat;}
.subPart-06 .subBg p{background:url('../../images/ep/mainBtn-06_over.png') bottom right / auto no-repeat;}

/* 탭 메뉴 */
.subNav{position:relative; width:100%; height:37px; background:#fff; border-bottom:1px solid #e6e6e6; box-sizing: content-box; z-index:99;/* display:none;*/}
.subNav.fixed{position:fixed;}
.subNav .container{display:flex; align-items:flex-start; text-align:left; position:relative;}
.subNav ul{display:block; /*width:250px;*/width:25%; height:auto; border-left:1px solid #e6e6e6; position:absolute; top:0; left:0; overflow:hidden;}
.subNav ul:last-child{/*width:500px; left:250px;*/width:75%;left:25%; border-right:1px solid #e6e6e6;}
.subNav ul > li{display:none; width:100%; height:auto;}
.subNav ul > li.selectPage{display:block;}
.subNav ul > li.selectPage a{display:flex; color:#777; align-items:center;}

.subNav ul > li a{display:none; border-bottom:1px solid #ddd; align-items:center; height:37px; padding:0 15px; width:auto; text-align:left; letter-spacing:0; font-size:13px; font-weight:500; line-height:1; background:#fff; color:#aaa;}
.subNav ul > li a > i{width:auto; margin-right:15px; display:inline-block;}
.subNav ul > li a > span{ width:50%; flex:auto; margin-right:10px; line-height:1.4; word-break:break-all; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.subNav ul.open{border:1px solid #9aa0b6; border-top:none;}


.subNav .depth-01.open > li,
.subNav .depth-02.open > li.active{display:block !important;}
.subNav .depth-01.open > li a,
.subNav .depth-02.open > li a{display:flex !important;}

.subNav ul li.selectPage a:hover,
.subNav ul.open li.selectPage a{color:#222;background:#f1f1f1;}
.subNav ul > li a:hover{color:#4d5ca7;}


/* - 닫기 버튼 */
.subNav .icon{flex:auto; display:contents !important;}
.subNav .icon > i{width:13px; height:13px; position:relative; display:block; float:right;}
.subNav .icon > i:before,
.subNav .icon > i:after{ content:''; height:1px; display:block; background:#c0c0c0; -webkit-transition:all .3s ease; transition: all .3s ease; position:absolute; width:100%; top:50%; left:0;}
.subNav .icon > i:before{transform:rotate(90deg);-webkit-transform:rotate(90deg);}
.subNav .icon > i:after{transform:rotate(180deg);-webkit-transform:rotate(180deg);}
.subNav .open > li a:first-child .icon{flex:auto; display:contents !important;}
.subNav .open > li a:first-child .icon > i:before{transform:rotate(180deg);-webkit-transform:rotate(180deg);}
.subNav .open .select .icon{display:none !important;}
.subNav.fixed{top:80px}

/* 콘텐츠 페이징 */
.contPage {position:relative; margin:30px auto 0;overflow:hidden;}
.contPage > div {display:flex; align-items:center; flex-direction:column; width:50%;padding:30px; margin-bottom:40px;}
.contPage > div button {width:100%; display:block;min-height:85px;overflow:hidden;text-align:center;transition:all ease-in-out .3s;}
.contPage > div button:after {
	margin:30px auto 0 auto;
	display:block;content:'';width:50px;height:35px;
	background-image:url('../../images/newMosf/content/contPage.png');
	background-repeat:no-repeat;
}
.contPage > div button > span {
	height:45px; line-height:1.4; word-break:break-all; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}

.contPage > div button span.prevArrow {transform:rotate(-180deg);}
/*.contPage > div a:hover {color:#2c9be8;}
.contPage > div a:hover:after {background-position:right -35px;}*/
.contPage:before {content:''; position:absolute;bottom:30px;left:50%;width:1px;height:100%;background-color:#bbb;}
/* .contPage .pageNext,
.contPage .pagePrev {display:none;} */

.contPage .pagePrev {float:left;}
.contPage .pageNext {float:right;}
.contPage .pagePrev button:after {background-position:-142px 0;transform:rotate(-180deg);}
.contPage .pageNext button:after {background-position:right 0;}

.info-popup{display:none}

/* ==== 1400px 이하 일때 (뷰포트 1400px 기준) ==== */ @media only screen and (max-width:1400px) {
	.subContainer > .container,
	.subHeader .container{max-width:90% !important;}
	.subNav{/*top:5.714vw; *//* top:80px; */}
	.subNav.fixed{top:5.714vw; /* top:80px; */}
	
}

/* ==== 1023px 이하 일때 ==== */ @media only screen and (max-width:1023px) {
	.subContainer > .container{max-width:100% !important; padding:0 !important;}
	.subHeader .container{max-width:100% !important; padding:0 10px !important;}
	.subNav.fixed{top:59px;}
	/*.subNav{top:125px;}*/
	body {overflow:hidden;}
	.info-popup{position:fixed; top:0; left:0; background:rgba(0,0,0,.85); display:none; width:100%; height:100%; z-index:99999;}
	.info-popup .container {position:relative; display:flex; align-items:flex-end; flex-direction:column; text-align:center; margin:0 auto; width:100%; height:100%;}
	.info-popup .container .popCnt{flex:auto; width:auto; height:100%; display:flex; align-items:center; margin:0 auto;}
	.info-popup .container .popCnt > .wrap{display:block; }
	.info-popup .container .popCnt > .wrap img{margin-bottom:10px;}
	.info-popup .container .popCnt > .wrap p{color:#fff; font-size:12px;}
	.info-popup .container .popClose{height:auto; position:absolute; top:20px; right:20px;}
		/* - 닫기 버튼 */
		.info-popup .container .popClose > a{display:block; width:auto; height:auto; font-size:0}
		.info-popup .container .popClose > a > i{width:30px; height:30px; position:relative; display:block; text-align:center; margin:0 auto;}
		.info-popup .container .popClose > a > i:before,
		.info-popup .container .popClose > a > i:after{ content:''; height:3px;  position:absolute; width:100%; top:50%; left:0; background:#fff;}
		.info-popup .container .popClose > a > i:before{transform:rotate(45deg);-webkit-transform:rotate(45deg);}
		.info-popup .container .popClose > a > i:after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}
		.info-popup .container .popClose > a > i:after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}
		.info-popup .container .popClose > a > i > b{width:0; -webkit-transition:all .1s ease; transition: all .1s ease;}

	
}
/* ==== 770px 이하 일때 (뷰포트 375px 기준) ==== */ @media only screen and (max-width:767px) {
	/* 메인 비주얼 영역 */
	.subContainer > .container,
	.subHeader .container{padding:0 2.667vw !important; /* padding:0 10px; */}
	.subNav.fixed{top:59px;}
	.subNav .depth-01{width:35%;}
	.subNav ul:last-child{width:65%;left:35%; border-right:0;}
	.subBg p{font-size:30px;}
	.subNav .depth-02.open > li.active{height:auto; position:relative; overflow-y:auto;}
	.subNav .depth-02.open > li.active > .listWrap{position:absolute; top:0; left:0; width:100%; height:auto;}
	
	/* 콘텐츠 페이징 */
	.contPage {width:100%;margin:30px auto 0;}
	.contPage > div {padding:10px;}
}
