@charset "utf-8";
/****************************************/
/* Name: 아이엠테크
/* PART: CONTENT 
/* Version: 1.0 / day: 2017-06-02
/* Author: imtec 
/****************************************/

#Container{position: relative; width: 100%; overflow: hidden;}
#Container .content{
	width: 1200px; 
 	margin: 0 auto; position: relative;}


/* 메인컨텐츠 */

.mConBox01 .bx-wrapper, .mConBox01 .bx-viewport{	
	width: 100%; height: 100% !important; 
}
.mConBox01{
	min-height: 600px; position: relative;
}
.mConBox01 .content{
	height: 100%; width: 1200px; margin: 0 auto; position: relative;
}
.mConBox01 .bx-viewport{
	overflow: hidden; pointer-events: none;
 }
.mConBox01 .visualSlide{
	width: auto; height: 100%;
}
.visualSlide li{
	width: 100%; height: 100%; 
	position: relative; overflow: hidden;
	background-attachment: fixed !important;
	background-size: cover !important;
}
.visualSlide li.bg01{
	background: url('/img/main/visual_slide01.jpg') center center no-repeat;
	
}
.visualSlide li.bg02{
	background: url('/img/main/visual_slide02.jpg') center center no-repeat;
}
.visualSlide li.bg03{
	background: url('/img/main/visual_slide03.jpg') center center no-repeat;
}
.visualSlide li.bg04{
	background: url('/img/main/visual_slide04.jpg') center center no-repeat;
}
.visualSlide .txt_box{
	position: absolute; color: #fff; 
	bottom: 145px; left: 0;
}
.visualSlide li .txt_box{
	animation-name: fade_left;
	animation-duration: 1s;

}
@keyframes fade_left{
	from{
		opacity: 0;
		left: -200px;
	}
	to{
		opacity: 1;
		left: 0;
	}
}
.visualSlide .txt_box h2{
	font-size: 5.6rem; font-weight: bold; line-height: 1.3;
	margin-bottom: 20px; position: relative;
}
.visualSlide .txt_box h2::before{
	content: "";display: inline-block;
	width: 40px; height: 1px; position: absolute;
	top: -9px; left: 0; background: #fff;
}
.visualSlide .txt_box span{
	display: block; font-size: 1.8rem;
}
.visualSlide .txt_box a{
	padding: 10px 36px; border:2px solid #fff; margin-top: 50px;
	display: inline-block;
	font-size: 1.5rem;
	transition: all 0.3s;
	pointer-events: auto;
}
.visualSlide .txt_box a:hover,
.visualSlide .txt_box a:focus{
	background: #fff; color: #444; font-weight: bold;
}
.mConBox01 .bx-controls{
	position: absolute; bottom: 50px;
	width: 100%; text-align: center;
	z-index: 100;
}
.mConBox01 .bx-pager{
	display: inline-block;
}
.mConBox01 .bx-pager-item{
	display: inline-block;
}
.mConBox01 .bx-pager-link{
	width: 21px; height: 21px; display: inline-block;
	margin-right: 10px; text-indent: -9999px;	
	background: url('/img/main/slidePageOff.png') center center no-repeat;
}
.mConBox01 .bx-pager-item:last-child .bx-pager-link{
	margin-right: 0;
}
.mConBox01 .bx-pager-link.active{
	background: url('/img/main/slidePageOn.png') center center no-repeat;
}
.mConBox01  .control_btn{
	display: inline-block;
}
.mConBox01  .control_btn > a{
	width: 8px; height:13px;
	position: relative; top: 1px;
	display: inline-block; margin-right: 15px;
}
.mConBox01 .stop-slide{
	background: url('/img/main/btnSlideStop.png') center center no-repeat;
}
.mConBox01 .start-slide{
	background: url('/img/main/btnSlidePlay.png') center center no-repeat;
}

.mConBox02{
	width: 100%; height: 640px;
	padding-top: 80px;
	background: url('/img/main/conBox02_bg.jpg') center center no-repeat;
	background-size: cover;
	overflow:hidden;
}
.mConBox02 h2{
	font-size: 48px; font-weight: bold; color: #fff;
	position: relative; text-align: center;
}
.mConBox02 h2::after{
	content: ""; display: inline-block;
	position: absolute; bottom: -5px; left: 50%; margin-left: -20px;
	width: 40px; height: 1px; background: #fff;
}
.mConBox02 .content > span.titleInfo{
	color: #cbd3e5; display: block; text-align: center;
	margin: 22px 0 55px 0; font-size: 1.5rem;
}
.mConBox02 .mListBox{
	overflow: hidden; margin-bottom: 30px;
}
.mConBox02 .mListBox li{
	width: 220px; height: 220px;
	margin-right: 25px; float: left;
}
.mListBox li:last-child{
	margin-right: 0;
}
.mListBox li a{
	display: block; color: #fff; font-size: 1.6rem; font-weight: bold;
	width: 100%; height: 100%; text-align: center;
	padding-top: 130px; position: relative;
}
.mListBox li a.ic01{
	background: rgba(3,55,141,0.76) url('/img/main/ic_mCon2_list01.png') center 76px no-repeat;
}
.mListBox li a.ic02{
	background: rgba(255,255,255,0.2) url('/img/main/ic_mCon2_list02.png') center 76px no-repeat;
}
.mListBox li a.ic03{
	background: rgba(3,55,141,0.76) url('/img/main/ic_mCon2_list03.png') center 76px no-repeat;
}
.mListBox li a.ic04{
	background: rgba(255,255,255,0.2) url('/img/main/ic_mCon2_list04.png') center 76px no-repeat;
}
.mListBox li a.ic05{
	background: rgba(3,55,141,0.76) url('/img/main/ic_mCon2_list05.png') center 76px no-repeat;
}
.mListBox li a.on{
	text-indent: -9999px;
	background-image: none;
}

.mListBox li a .hover{
	width: 100%; height: 100%; display: table;
	position: absolute; top: 0; left: 0;
	font-size: 1.4rem; font-weight: normal;
	opacity: 0;
	
}
.mListBox li a .hover.on{
	opacity: 1;
}
.mListBox li a .hover span{
	display: table-cell; vertical-align: middle;
	text-indent: initial;
}

.mConBox02 .newsBox{
	width: 980px; height: 60px;
	float: left;
	position: relative;
	background: rgba(0,0,0,0.26);
}
.newsBox .newTitle{
	width: 110px; height: 100%; color: #fff; font-size: 1.6rem;
	text-align: center; line-height: 60px;
	background: #da1804; position: absolute; left: 0;
}
.newsBox .newsSlide{
	width: 100%; height: 100%;
	padding-left: 140px; color: #fff;	
}
.newsBox .newsSlide li{
	line-height: 60px; width: 100% !important;
}
.newsBox .newsSlide li a{
	font-weight: bold;
	max-width: 70%;
	overflow: hidden;
	display: inline-block;
	white-space: nowrap;
	text-overflow: ellipsis;
	margin-right: 10px;
	float: left;
}
.newsBox .control{
	position: absolute; right: 23px; top: 17px;
	height: 100%;
}
.newsBox .control button,
.newsBox .control a{
	width: 27px; height: 27px;
	border:1px solid #fff;
	border-radius: 50%; text-indent: -9999px;	
	float: left; margin-right: 10px;
}
.newsBox .control a{
	margin-right: 0;
	background: url('/img/main/btn_news_more.png') center center no-repeat;
}
.newsBox .control .prev-slide{
	background: url('/img/main/btn_news_prev.png') center center no-repeat;
}
.newsBox .control .next-slide{
	background: url('/img/main/btn_news_next.png') center center no-repeat;
}
.mConBox02 .intro_down{
	width: 220px; height: 60px; line-height: 60px;
	float: right; text-align: center;
	background: #0eb153; color: #fff; font-weight: bold;
}
.mConBox02 .intro_down span{
	display: inline-block;
	padding-left: 28px;
	background: url('/img/main/ic_intro.png') left center no-repeat;
	background-size: 20px 21px;
}


.mConBox03{
	width: 100%;
	padding-top: 80px; 
}

.pofol_box{
	overflow: hidden; ;
}
.pofol_box li{
	max-width: 385px; max-height: 330px;
	float: left; margin-right: 22px; margin-bottom: 22px;
	position: relative; overflow: hidden; 
}
.pofol_box li:nth-child(3n+3){
	margin-right: 0;
}
.pofol_box li img{
	transition: all 0.3s;
}
.pofol_box li .hover{
	position: absolute; top: 0; left: 0;
	width: 100%; height: 100%;
	display: block;
	background: rgba(0,95,202,0);
	transition: all 0.3s;
}
.pofol_box li:hover .hover,
.pofol_box li:focus .hover{
	background: rgba(0,95,202,0.8);
}
.pofol_box li:hover img,
.pofol_box li:focus img{
	transform: scale(1.04);
}
.pofol_box li .hover span{
	color: #fff;
}
.pofol_box li .hover .txt{
	position: absolute; bottom: 45px; left: 0px;
	opacity: 0;
	transition: all 0.3s;
}
.pofol_box li:hover .hover .txt,
.pofol_box li:focus .hover .txt{
	opacity: 1;
	left: 40px;
	transition: all 0.3s 0.2s;
}

.pofol_box li .hover .year{
	position: relative; display: block;
	margin-bottom: 15px;
	font-size: 2rem; font-weight: bold;
}
.pofol_box li .hover .year::after{
	width: 45px; height: 1px; display: inline-block;
	content: ""; background-color: #fff;
	position: absolute; bottom: -5px; left: 0;
}
.pofol_box li .hover .tit{
	font-size: 2.2rem;
	font-weight: bold;
	display: block;
	word-break: keep-all;
}
.btnPofolMore{
	width: 100%; margin-bottom: 130px;
	text-align: center;
}
.btnPofolMore a{
	margin-top: 60px;
	display: inline-block;
	width: 60px; height: 60px;
	border:1px solid #a7a7a7; text-indent: -9999px;
	background: url('/img/common/btn_pofol_more.png') center center no-repeat;
	transition: background-color 0.3s;
}
.btnPofolMore a:hover,
.btnPofolMore a:focus{
	background: #005fca url('/img/common/btn_pofol_more_on.png') center center no-repeat;
	border-color: #005fca;
}

.btn_top{
	position: fixed;
	bottom: 50px; left: 50%;
	margin-left: 630px;
	z-index: 1000;
	display: none;
	cursor:pointer;
}


@media all and (max-width: 1280px){
	#Container .content{
		width: 1000px;
	}
	.mConBox01 .content{
		width: 1000px; position: relative;		
	}
	.mConBox02 .mListBox li{
		width: 188px; height:188px;
		margin-right: 15px;
	}
	.mListBox li:last-child{
		margin-right: 0;
	}
	.mListBox li a{
		padding-top: 115px;
	}
	.mListBox li a.ic01,
	.mListBox li a.ic02,
	.mListBox li a.ic03,
	.mListBox li a.ic04,
	.mListBox li a.ic05{
		background-position: center 60px;
	}
	.mConBox02 .newsBox{
		width: 75%
	}
	.mConBox02 .intro_down{
		width: 25%;
	}
	.newsBox .newsSlide li a{
	max-width: 60%;
	}
	.pofol_box li{
		width: 32%; height: auto;
		margin-right: 2%; 
	}
	.pofol_box li:
	.pofol_box li:nth-child(3n+3){
	margin-right: 0;
	}
	.btn_top{
		left: inherit; right: 10px;
		margin:0;
	}
}


/* 태블릿 */

@media all and (max-width: 1024px){
	#Container .content{
		width: 94%;  
	}
	#Container .mConBox01 .content.visual{
		width: 80%; 	
	}	
	.mConBox02 .mListBox li{
		width: 18.4%;
		margin-right: 2%;
	}
	.mConBox02 .mListBox li:last-child{
		margin-right: 0;
	}
	.newsBox .newsSlide li a{
	max-width: 45%;
	}
	.pofol_box li .hover .txt{
		width: 100%;
	}
	.pofol_box li .hover .year{
		font-size: 1.6rem;
	}
	.pofol_box li .hover .year::after{
		width: 36px;
	}
	.pofol_box li .hover .tit{
		font-size: 2rem;
		display: block; max-width: 80%;
		overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 
	}
}

/* 모바일 */
@media all and (max-width: 680px){

	.visualSlide .txt_box h2{
		font-size: 3.2rem;
	}
	.mConBox02{
		padding: 30px 0; height: auto;
	}
	.mConBox02 .mListBox li{
		width: 49%; height: 100px;
		margin-right: 1%; margin-bottom: 1%;
	}
	.mConBox02 .mListBox li:nth-chil(3),
	.mConBox02 .mListBox li:nth-chil(5){
		margin-right: 0;
	}
	.mConBox02 .mListBox li:first-child{
		width: 100%; margin-right: 0;
	}	
	.mConBox02 .mListBox{
		margin-bottom: 20px;
	}
	.mListBox li a{
		padding-top: 65px;
	}
	.mListBox li a .hover{
		display: none;
	}
	.mListBox li a.ic01, 
	.mListBox li a.ic02, 
	.mListBox li a.ic03, 
	.mListBox li a.ic04, 
	.mListBox li a.ic05{
		background-position: center 20px;	
		background-color: rgba(3,55,141,0.76);
	}
	.mListBox li a.ic02, 
	.mListBox li a.ic03{
		background-color: rgba(255,255,255,0.2)
	}	
	.mConBox02 .newsBox{
		width: 100%;
	}
	.newsBox .newTitle{
		font-size: 1.5rem;
		width: 55px;
	}
	.newsBox .newsSlide{
		padding-left: 70px;
	}
	.newsBox .newsSlide li a{
		width: 50%;
	}
	.newsBox .control .prev-slide,
	.newsBox .control .next-slide{
		display: none;
	}
	.mConBox02 .intro_down{
		width: 100%; margin-top: 1%;
	}

	.mConBox03{
		padding: 30px 0; height: auto;
	}
	.mConBox03 h2{
		font-size: 3.6rem;
	}
	.mConBox03 span.info_txt{
		margin-bottom: 20px;
	}
	.pofol_box{
		text-align: center;
	}
	.pofol_box li{
		width: 100%; margin:0; margin-bottom: 10px;
		float: none; text-align: left;
		display: inline-block;
	}
	.pofol_box li .hover{
		height: 100px; top:inherit; bottom: 0;
		display: block;
		background: rgba(0,95,202,0.8)
	}
	.pofol_box li .hover .txt{
		opacity: 1; left: 40px; bottom: 20px;
	}
	.btnPofolMore{
		margin-bottom: 40px;
	}
	.btnPofolMore a{
		margin-top: 30px;
	}
	.btn_top{
		display: none !important;
	}
}	


/* 서브컨텐츠 */

#content{
	padding-top: 80px; 
}

.subVisual{
	width: 100%; height: 360px;
	background: url('/img/sub/subVisual.jpg') center top no-repeat;
	background-attachment: fixed;
	padding-top: 165px; text-align: center; color: #fff;
	word-break : keep-all; 
}
.subVisual.bg01{
	background: url('/img/sub/subVisual01.jpg') center top no-repeat;
}
.subVisual.bg02{
	background: url('/img/sub/subVisual02.jpg') center top no-repeat;
}
.subVisual.bg03{
	background: url('/img/sub/subVisual03.jpg') center top no-repeat;
}
.subVisual.bg04{
	background: url('/img/sub/subVisual04.jpg') center top no-repeat;
}
.subVisual.bg05{
	background: url('/img/sub/subVisual05.jpg') center top no-repeat;
}
.subVisual > div{
	position: relative;
}
.subVisual span{
	display: block; font-size: 2rem; position: relative;
}
.subVisual .smTxt{
	margin-bottom: 35px;
	animation-name: fade_left;
	animation-duration: 0.7s;
	animation-fill-mode: both;
}
.subVisual .smTxt::after{
	content: ""; display: inline-block;
	width: 40px; height: 1px;
	background: #fff; position: absolute;
	bottom: -15px; left: 50%; margin-left: -20px;
}
.subVisual .bigTxt{
	font-size: 2.8rem; font-weight: bold;
	animation-name: fade_left;
	animation-duration: 0.7s;
	animation-delay: 0.5s;	
	animation-fill-mode: both;
}

.tab_2Depth{
	width: 1200px; margin: 0 auto; position: relative; overflow: hidden;
	left: 1px;	
}
.tab_2Depth li{
	float: left; margin-left: -1px;
	width: 25%; height: 50px; line-height: 50px;
	border: 1px solid #e1e1e1;
	color: #666;  text-align: center;
}
.tab_2Depth li:first-child{
	margin-left: 0;
}
.tab_2Depth li.on{
	color: #005fca; font-size: 1.5rem; font-weight: bold;
	border-bottom: 4px solid #005fca;
}
.tab_2Depth li a{
	display: inline-block;
	width: 100%; height: 100%;
}


/* 뷰화면 */

.viewVisual{
	width: 100%; height: 590px;
	background: url('/img/sub/viewVisual01.jpg') center top no-repeat;
	background-attachment: fixed;
}
#Container .viewVisual .content{
	height: 100%; width: 100%; 
}
.viewVisual .titleBox{
	text-align: center; display: inline-block;
	position: absolute; top: 50%; left: 50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	color: #fff;
	font-family: "nanumsquare" !important;
}
.viewVisual .titleBox h2{
	font-size: 5.6rem; font-weight: bold; position: relative;
	margin-bottom: 55px; line-height: 1.3;
}
.viewVisual .titleBox h2::after{
	width: 40px; height: 1px; 
	content: ""; display: inline-block;
	position: absolute; bottom: -20px; left: 50%;
	margin-left: -20px;
	background: #fff;
}
.viewVisual .titleBox p{
	font-size: 1.8rem; text-align: center;
}
.viewCtrWrap{
	width: 100%; height: 100%; position: absolute;
}
.viewCtrBox{
	position: relative; width: 100%; height: 100%;
}
.viewCtr{
	position: absolute; right: 0px; top: 50%; 
	transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	z-index: 1000;
}
.viewCtr li{
	margin-bottom: 1px;
}
.viewCtr li:last-child{
	margin-bottom: 0;
}
.viewCtr li a{
	display: inline-block;
	width: 80px; height: 80px;
	text-align: center;
	padding-top: 50px; color: #fff; font-size: 1.2rem;
	transition: all 0.3s;
}
.viewCtr li a.ic01{
	background: rgba(243,45,45,0.8) url('/img/sub/ic_viewList.png') center 24px no-repeat;
}
.viewCtr li a.ic02{
	background: rgba(68,68,68,0.8) url('/img/sub/ic_viewPrev.png') center 25px no-repeat;
}
.viewCtr li a.ic03{
	background: rgba(68,68,68,0.8) url('/img/sub/ic_viewNext.png') center 25px no-repeat;
}
.viewCtr li a.ic01:hover,
.viewCtr li a.ic01:focus{
	background-color: rgba(243,45,45,1);
}
.viewCtr li a.ic02:hover,
.viewCtr li a.ic02:focus,
.viewCtr li a.ic03:hover,
.viewCtr li a.ic03:focus{
	background-color: rgba(68,68,68,1);
}

.viewContent{
	width: 100%; text-align: center;
}
.viewContent .content{	
	width: 100%; text-align: center;
	overflow: hidden;
}
.viewContent .info01{
	padding: 60px 0; display: inline-block;
}
.viewContent .info01 h3{
	font-size: 34px; font-weight: normal;
	margin-bottom: 20px; margin-top: 10px;
}
.viewContent .info01 ul{
	float: left; margin-right: 95px;
	padding-left: 90px; position: relative;
}
.viewContent .info01 ul:last-child{
	margin-right: 0;
}
.viewContent .info01 ul::after{
	content: ""; display: inline-block;
	position: absolute; left: 67px; top: 0;
	width: 1px; height: 100%; border-right: 1px dotted #cdcdcd;
}
.viewContent .info01 ul li{
	line-height: 1.8; text-align: left;
}
.viewContent .info01 ul li span{
	color: #222; position: absolute; left: 0;
	font-weight: bold;
}
.viewContent .info01 ul:last-child{
	margin-right: 0;
}
.info02{
	width: 100%; text-align: center; padding: 90px 0;
	background: #f1f1f1
}
.info03{
	width: 100%; text-align: center; padding: 70px 0 50px 0;
}
.info04{
	width: 100%; text-align: center; padding-top: 70px;
}

.footListCtr{
	width: 100%; position: relative;
}
.footListCtr li{
	width: 33.33%; float: left;
}
.footListCtr li a{
	display: inline-block; padding: 23px 0;
	font-weight: bold; width: 100%;
}
.footListCtr li a.ic01{
	text-align: left; padding-left: 27px;
	background: url('/img/sub/ic_viewPrev2.png') left center no-repeat;
}
.footListCtr li a.ic02{
	text-align: center;
}
.footListCtr li a.ic02 span{
	display: inline-block;
	padding-left: 27px;
	background: url('/img/sub/ic_viewList2.png') left center no-repeat;
}
.footListCtr li a.ic03{
	text-align: right; padding-right: 27px;
	background: url('/img/sub/ic_viewNext2.png') right center no-repeat;
}

.footListCtr li a:hover{
	color: #005fca;
}
.footListCtr li a.ic01:hover{
	background: url('/img/sub/ic_viewPrev2_on.png') left center no-repeat;
}
.footListCtr li a.ic02:hover span{
	background: url('/img/sub/ic_viewList2_on.png') left center no-repeat;
}
.footListCtr li a.ic03:hover{
	background: url('/img/sub/ic_viewNext2_on.png') right center no-repeat;
}




.s1_1_box{
	width: 100%; position: relative; overflow: hidden;
}
.s1_1_box dl{
	float: left; width: 25%; position: relative;
	text-align: center; padding: 205px 10px 0 10px;
}
.s1_1_box dl::after{
	position: absolute; right: 1px; top: 78px;
	content: ""; display: inline-block;
	width: 6px; height: 6px; border-radius: 50%;
	background: #afafaf;
}
.s1_1_box dl:last-child::after{
	background: none;
}
.s1_1_box dl.ic01{
	background: url('/img/sub/sub01_1_img01.jpg') center top no-repeat;
}
.s1_1_box dl.ic02{
	background: url('/img/sub/sub01_1_img02.jpg') center top no-repeat;
}
.s1_1_box dl.ic03{
	background: url('/img/sub/sub01_1_img03.jpg') center top no-repeat;
}
.s1_1_box dl.ic04{
	background: url('/img/sub/sub01_1_img04.jpg') center top no-repeat;
}
.s1_1_box dl dt{
	font-size: 1.8rem; color:#005fca; font-weight: bold;
	margin-bottom: 15px; 
}
.s1_1_bg{
	margin-top: 75px;
	width: 100%;
	padding: 450px 0 60px 0; text-align: center; position: relative;
	background: #f7f7f7 url('/img/sub/sub01_1_bg.jpg') center 17px no-repeat;
}
.s1_1_bg::before{
	width: 50%; height: 100%; content: ""; display: block;
	position: absolute; left: -50%; top: 0;
	background: #f7f7f7;
}
.s1_1_bg::after{
	width: 50%; height: 100%; content: ""; display: block;
	position: absolute; right: -50%; top: 0;
	background: #f7f7f7;
}
.s1_1_bg h2{
	font-size: 4rem; font-weight: bold; color: #005fca;
	margin-bottom: 25px;
}
.s1_1_bg p{
	font-size: 1.6rem; text-align: center;
}

.s1_2_box{
	margin-top: 60px; position: relative; text-align: center;
	width: 100%; overflow: hidden;
}
.s1_2_box::after{
	content: ""; display: block;
	width: 4px; height: 100%; position: absolute;
	left: 50%; margin-left: -5px; top: 0;
	background: url('/img/sub/s1_2_lineBg.jpg') center top repeat-y;
}
.s1_2_box.tab02{
	display: none;
}
.s1_2_box dl{
	width: 50%; position: relative; clear: both;
	margin-bottom: 50px;
}
.s1_2_box dt{
	font-size: 4rem; font-weight: bold; line-height: 1; 
	position: relative; margin-top: -4px
	height: 100%;
}
.s1_2_box dd{
	display: inline-block;
	text-align: left;
}
.s1_2_box dd li{
	line-height: 1;
	margin-bottom: 15px;
}
.s1_2_box .left{
	float: left; text-align: right;	
}
.s1_2_box .left dt{
	position: absolute; right: -135px;	
}
.s1_2_box .left dt::after{
	content: ""; display: inline-block;
	width: 12px; height: 12px;
	border-radius: 50%; border:3px solid #333;
	background: #fff;
	box-sizing: border-box; z-index: 10;
	position: absolute; top: 4px; left:-50px;
}
.s1_2_box .left dd{
	display: inline-block; margin-right: 45px;
}
.s1_2_box .right{	
	float: right; text-align: left;
	
}
.s1_2_box .right dt{
	position: absolute; left: -140px;
}
.s1_2_box .right dt::after{
	content: ""; display: inline-block;
	width: 12px; height: 12px;
	border-radius: 50%; border:3px solid #333;
	background: #fff;
	box-sizing: border-box; z-index: 10;
	position: absolute; top: 4px; right:-50px;
}
.s1_2_box .right dd{
	display: inline-block; margin-left: 45px;
}

.s1_3_box .mapInfo{
	width: 100%;
	margin-top: -33px; 
	position: relative; z-index: 1000;
	background: #fff; margin-bottom: 110px;
	border:1px solid #dbdbdb;
	overflow: hidden;
}
.s1_3_box .mobile_map{
	display: none;
}
.mapInfo dl{
	width: 50%;
	float: left; padding: 35px 10px;
	text-align: center;
	position: relative;
}
.mapInfo dl:last-child::before{
	content: ""; display: block; position: absolute;
	width: 1px; height: 100%; left: 0; top: 0;
	background: #dbdbdb;
}
.mapInfo dl dt{
	font-size: 1.8rem; font-weight: bold;
	height: 54px; line-height: 54px; display: inline-block;
	padding-left: 64px; position: relative;
	margin-bottom: 15px;
}
.mapInfo dl dt::before{
	content: ""; display: block; position: absolute;
	width: 54px; height: 54px; top: 0; left: 0;
	border-radius: 50%; border: 1px solid #cacaca;
	background: url('/img/sub/ic_mapInfo01.png') center center no-repeat;
}
.mapInfo dl dt.ic01::before{
	background: url('/img/sub/ic_mapInfo01.png') center center no-repeat;
}
.mapInfo dl dt.ic02::before{
	background: url('/img/sub/ic_mapInfo02.png') center center no-repeat;
}
.transportInfo{
	margin-bottom: 130px;
}
.transportInfo::after{
	content: ""; clear: both; display: block;
}
.transportInfo dl{
	width: 50%; padding-right: 40px;
	float: left;
}
.transportInfo dl:last-child{
	padding-right: 0;
}
.transportInfo dt{
	padding-left: 42px; height: 34px; line-height: 34px;
	font-size: 1.6rem; font-weight: bold; position: relative;
	margin-bottom: 30px; 
}
.transportInfo .subway dt{
	background: url('/img/sub/ic_subway.png') left center no-repeat;
}
.transportInfo .bus dt{
	background: url('/img/sub/ic_bus.png') left center no-repeat;
}
.transportInfo dt::after{
	content: ""; display: inline-block; width: 100%; height: 1px;
	position: absolute; bottom: -10px; left: 0;
	background: #e1e1e1;
}
.transportInfo span{
	display: inline-block; width:46px; height: 46px; color: #fff; text-align: center;
	font-size: 1.3rem; font-weight: bold; margin-right: 13px;
	border-radius: 50%;
}
.transportInfo .subway span{
	background: #ef5f2e; line-height: 46px;
}
.transportInfo .bus dd{
	height: 46px; line-height: 46px; display: inline-block;
	margin-right: 40px;
}
.transportInfo .bus dd:first-child{
	margin-right: 40px;
}
.transportInfo .bus .bus_1{
	background: #005fca;
}
.transportInfo .bus .bus_2{
	background: #fea439; 
}

.s1_4_box{
	width: 100%; height: 622px; position: relative;
	margin-bottom: 150px;
}
.s1_4_box .ognBox{
	width: 815px; height: 100%; 
	position: absolute; left: 50%; margin-left: -323px;
	background: url('/img/sub/s1_4_bg01.jpg') center center no-repeat;
}

.s2_1_box{
	width: 100%; position: relative; padding-top: 50px;
	margin-bottom: 100px; overflow: hidden;
}
.s2_1_box .s2_1_bgBox{
	width: 633px; height: 593px;
	position: absolute; left: 50%; top: 100px;
	transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	background: url('/img/sub/s2_1_bg01.jpg') center center no-repeat;
	z-index: -1;
}
.s2_1_box .titleBox{
	float: left;overflow: hidden;
	padding-left: 44px; padding-top: 8px;
}
.s2_1_box .titleBox h3{
	font-size: 2.6rem; font-weight: bold; 
	margin-bottom: 15px; position: relative;
}
.s2_1_box .titleBox h3 span{
	display: inline-block; position: relative;
}
.s2_1_box .titleBox h3 .start::before{
	width: 34px; height: 28px;
	content: ""; display: inline-block;
	position: absolute; top: -8px; left: -44px;
	background: url('/img/sub/s2_1_title_bg01.png') center center no-repeat;
}
.s2_1_box .titleBox h3 .end::after{
	width: 34px; height: 28px;
	content: ""; display: inline-block;
	position: absolute; top: 8px; right: -44px;
	background: url('/img/sub/s2_1_title_bg02.png') center center no-repeat;
}
.s2_1_box dl{
	width: 230px; margin-bottom: 115px; margin-top: 20px;
}
.s2_1_box dl.right{
	float: right;
}
.s2_1_box dl.left{
	float: left; clear: both;
}
.s2_1_box dl dt{
	font-family: "nanumsquare" !important;
	font-size: 2.6rem; font-weight: bold;
	margin-bottom: 10px; position: relative;
}
.s2_1_box dl dt::before{
	width: 100%; height: 1px;
	content: ""; display: inline-block;
	position: absolute; top: -20px; left: 0px;	
	background: #ccc;
}

.s4_1_box{
	width: 100%; position: relative;
}
.s4_1_box .bg01{
	padding: 50px 0 20px 0;
}
.s4_1_box .bg02{
	padding: 50px 0 20px 0;
	background: #f7f7f7; position: relative;
}
.s4_1_box .bg02::before{
	height: 100%; width: 50%;
	content: ""; display: inline-block;
	position: absolute; top:0; left: -50%; 
	background: #f7f7f7;	
}
.s4_1_box .bg02::after{
	height: 100%; width: 50%;
	content: ""; display: inline-block;
	position: absolute; top:0; right: -50%; 
	background: #f7f7f7;	
}
.s4_1_box h3{
	font-size: 2.4rem; font-weight: bold; margin-bottom: 40px;
	position: relative; text-align: center; padding-bottom: 15px;
	border-bottom: 1px solid #e1e1e1; color: #333;
}
.s4_1_box h3::after{
	height: 1px;
	content: ""; display: inline-block;
	position: absolute; bottom: -1px; left: 50%; 
	background: #111;
}
.s4_1_box .bg01 h3::after{
	width: 64px; margin-left: -32px;
}
.s4_1_box .bg02 h3::after{
	width: 40px; margin-left: -20px;
}
.s4_1_box ul{
	overflow: hidden;
}
.s4_1_box ul li{
	float: left; width: 20%; margin-bottom:30px;
}

/* 원격지원 */
.pcRemote{
	width: 100%; text-align: center;
	background: url('/img/sub/pcRemoteBg.jpg') center top no-repeat;
}
.pcRemote .title{
	width: 100%; text-align: center;
	padding: 60px 0 40px 0;
	border-bottom: 1px solid #b2c5d6;
}
.pcRemote .content p{
	text-align: center; font-weight: bold;
	color: #05335e; font-size: 1.6rem;
	margin: 45px 0 20px 0;
}
.pcRemote .btn_down{
	position: relative; display: inline-block;
}
.pcRemote .btn_down::after{
	content: ""; display: inline-block;
	width: 10px; height: 100%;
	position: absolute; right: 30px; top: 0;
	background: url('/img/common/ic_down.png') center center no-repeat;
}
.pcRemote .btn_down a{
	display: inline-block;
	height: 42px; line-height: 42px;
	padding: 0 52px 0 43px; color: #fff; font-size: 1.5rem;
	background: #05335e; font-weight: bold;
}
.pcRemote .download{
	margin-top: 60px;
}
.pcRemote .btn_down.down02 a,
.pcRemote .btn_down.down03 a{
	padding-left: 57px; height: 50px; line-height: 50px;
}
.pcRemote .btn_down.down02 a{
	background: #005fca; margin-right: 10px;
}
.pcRemote .btn_down.down02 > span{
	width: 26px; height: 26px; line-height: 26px;
	color: #005fca; background: #fff;
	border-radius: 50%; display: inline-block;
	position: absolute; top:12px; left: 20px;
	font-weight: bold;
}
.pcRemote .btn_down.down02 a span{
	color: #a4d1ff;
}
.pcRemote .btn_down.down03 a{
	background: #1b9ece;
}
.pcRemote .btn_down.down03 > span{
	width: 26px; height: 26px; line-height: 26px;
	color: #1b9ece; background: #fff;
	border-radius: 50%; display: inline-block;
	position: absolute; top:12px; left: 20px;
	font-weight: bold;
}
.pcRemote .btn_down.down03 a span{
	color: #90e1fe;
}


/* min-pc */

@media all and (max-width: 1280px){
	.tab_2Depth{
		width: 1000px;
	}	
	.s2_1_box .s2_1_bgBox{
		width: 50%; 
		background-size: 100%;
	}

}


/* 태블릿 */

@media all and (max-width: 1024px){
	.tab_2Depth{
		width: 94%;
	}
	.viewContent .content{
		text-align: center; padding-left: 0;
	}


	.s1_1_box dl{
		width: 50%; margin-bottom: 50px;
	}
	.s1_1_box dl:nth-child(2)::after{
		background: none;
	}
	.s1_1_bg h2{
		font-size: 3rem;
	}
	.s1_1_bg p{
		font-size: 1.5rem; 
	}

	.s1_4_box{
		height: 1024px;
	}
	.s1_4_box .ognBox{
		width: 100%; height: 100%; 
		position: relative; left: initial; margin:0;
		background: url('/img/sub/s1_4_bg02.jpg') center center no-repeat;
	}

	.s2_1_box .titleBox{
		float: none;
	}
	.s2_1_box .s2_1_bgBox{
		max-width: 633px; width: 90%; height: 0; padding-bottom: 93.6%;
		position: relative; margin-top: -100px; margin-bottom: 150px;
	}
	.content .s2_1_box dl{
		float: left; width: 45%; 
		margin-right: 10%; margin-bottom: 30px; 
		padding-bottom:10px;
	}
	.s2_1_box dl.left{
		clear: initial;
		margin-right: 0;
	}

	.s4_1_box ul li{
		width: 25%;
	}		

}

@media all and (max-width: 680px){
	



	.s1_1_box{
		padding: 20px 20px 0 20px;
	}
	.s1_1_box dl{
		width: 100%; margin-bottom: 30px; padding: 205px 0px 30px 0px;
		border-bottom: 1px solid #ddd;
	}
	.s1_1_box dl dt{
		margin-bottom: 10px;
	}
	.s1_1_box dl::after{
		background: none;
	}	
	.s1_1_bg{
		background-size: 300px;
		padding-top: 300px;
	}
	.s1_1_bg p br{
		display: none;
	}
	.s1_1_bg h2, .s1_1_bg p{
		word-break: keep-all;
	}


	.content .s1_2_box::after{		
		left: 95px; 
	}
	.content .s1_2_box dl{
		width: 100%;
		padding-left: 110px; text-align: left;
	}

	.content .s1_2_box dl dt{
		margin-right: 0px; position: absolute;
		left: 15px; right: initial;
		font-size: 2.8rem;
		display: inline-block;
	}
	.content .s1_2_box dl dt::after{
		right:-25px; left: 71px; left: initial;
	}
	.content .s1_2_box dl dd{
		margin-left: 0; margin-right: 0;
	}
	.content .s1_2_box dl dd ul li{
		line-height: 1.5;
	}	
	
	.s1_3_box .mapInfo{
		margin-bottom: 80px;
	}
	.transportInfo{
		margin-bottom: 60px;
	}
	.transportInfo dl{
		width: 100%; margin-bottom: 40px;
	}
	.transportInfo .bus dd{
		margin-bottom: 20px;
	}

	.s1_4_box .ognBox{
		background: url('/img/sub/s1_4_bg03.jpg') center center no-repeat;
	}

	.s2_1_box{
		margin-bottom: 20px;
	}
	.s2_1_box .titleBox{
		width: 100%; padding-left: 0;
		text-align: center;
	}
	.s2_1_box .titleBox h3{
		font-size: 2rem;
	}
	.s2_1_box .titleBox p{
		text-align: center;
	}
	.content .s2_1_box dl{
		margin-top: 0;
	}
	.s2_1_box dl dt{
		font-size: 1.8rem;
	}

	.s4_1_box ul li{
		width: 33.33%;
	}	
	.viewContent .info01{
		padding: 40px 0;
	}
	.viewContent .info01 h3{
		font-size: 2.6rem; word-break: keep-all;
	}
	.viewVisual .titleBox h2{
		font-size: 3.2rem;
	}
	.viewVisual .titleBox p{
		font-size: 1.6rem
	}
	.viewCtrWrap .viewCtr{
		bottom: 0; top: initial; right: 0;
		transform: translate(0,0);
		-ms-transform: translate(0,0);
	}
	.viewCtrWrap .viewCtr li{
		float: left; margin-bottom: 0; margin-right: 1px;
	}
	.footListCtr li a.ic01 span,
	.footListCtr li a.ic03 span{
		display: none;
	}

	.s4_1_box ul li{
		width: 50%;
	}	
	.s1_3_box .pc_map{
		display: none;
	}
	.s1_3_box .mobile_map{
		display: block;
	}	
	.s1_3_box .mobile_map img{
		width: 100%;
	}


	.pcRemote{
		width: 100%;text-align: center;
		background: url('/img/sub/pcRemoteBg.jpg') center top no-repeat;
	}
	.pcRemote .btn_down{
		width: 100%;
	}	
	.pcRemote .download{
		margin:0;
	}
	.pcRemote .btn_down a,
	.pcRemote .btn_down.down02 a,
	.pcRemote .btn_down.down03 a{
		padding:; 0; width: 100%;
	}
	.pcRemote .btn_down.down02{
		margin: 10px 0;
	}	

}