/*모집이벤트용 배너*/
.recruit-ban{width: 100%; position: relative; height: 325px; background: url(/assets/_Img/Main/first_banner.png?v=2) repeat-x 100% center; }
.recruit-ban .txt{float: left; width: calc(60% - 60px); color: #fff; font-size: 30px; line-height: 40px; padding: 100px 0 0 60px;}
.recruit-ban .img{width: 40%; float: right; padding-top:48px; position: absolute; right: 0; bottom: 0}
.recruit-ban .m-img{display: none;}
.recruit-ban .img img{width: 100%;}
.recruit-ban .m-txt{background: #1e90c0; line-height: 32px; color: #fff; font-size: 18px; float: left; width: 200px; display: inline-block; text-align: center; margin-top: 10px}

/*배너 4종 레이아웃*/
#ban02{margin-right: 20px}
.banner-set{position:relative; margin-top: 20px;margin-bottom: 15px; width: 100%; display: block; float: left;}
.banner-set .lef{width: calc(100% - 337px); display: inline-block; float: left;}
.banner-set .rig{width: 317px; display: inline-block;margin-left: 20px; float: right;}

/*슬라이드배너 공통*/
.banner .owl-wrapper:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.banner{
	position: relative;
	-ms-touch-action: pan-y;
	display: block;
	float: left;
}
.banner.wp50{width: calc(50% - 10px);max-width: 323px;}
.banner.wp100{
	width: 100%;
	box-sizing: border-box;
	position: relative;
}
#ban04 {height: 325px;}
#ban06{display: none !important;}
.banner .state{position: absolute; z-index: 9; top: 0px; margin-top: -22px; left: 50%; margin-left: -60px; font-size: 14px; color: #fff; text-align: center; padding: 10px 5px; width: 120px; box-sizing: border-box; height: 44px}
.banner .state.c-01{background: #053262}
.banner .state.c-02{background: #d270f7}
.banner.wp100 span.img.pc{}
.banner.wp100 span.img.mobile{display: none;}
.banner.wp100 span.cont{padding: 30px 0 30px 0; }
.banner.wp50 span.img-mo{display: none;}
.banner.wp50 span.cont{padding: 40px 0; }
.banner span.cont{text-align: center; width: 100%; display: block;position: relative; }
.banner span.cont.b-01{background: rgba(176,176,176,0.9);color: #fff}
.banner span.cont.b-02{background: rgba(49,49,49,0.9);color: #fff}
.banner span.cont.b-03{background: rgba(255,255,255,0.7); color: #222; position: absolute; bottom: 0; z-index: 99;}
.banner span.cont .tit{font-size: 18px; margin-bottom: 10px}
.banner span.cont .txt{font-size: 14px}
.banner .item img{display: block;width: 100%;height: auto}
.banner .owl-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.banner .owl-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.banner .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}

.banner .owl-item{
	float: left;
	width: 100%;
	cursor: pointer;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
	cursor: pointer;
}
.owl-controls {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.grabbing {
    cursor:url(grabbing.png) 8 8, move;
}

.banner  .owl-wrapper,
.banner  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}

.banner .owl-controls{
	margin-top: 10px;
	text-align: center;
	position: absolute;
	z-index: 9;
	bottom: 10px;
	width: 100%;
}

.banner .owl-controls .owl-buttons div{
	display: block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
	width: 34px;
	height: 34px;
}

div .owl-prev{background: url(/assets/_Img/Main/ban01_prev.png);margin-left: 10px; float: left;}
div .owl-next{background: url(/assets/_Img/Main/ban01_next.png);float: right; margin-right: 10px}

.banner .owl-controls.clickable .owl-buttons div:hover{
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
	text-decoration: none;
}

/*배너 가로형*/
.ban03{width: 100%; background: #80aec8; position: relative; float: left; margin-top: 18px;padding: 42px 0; display: none;}
.ban03 .align-c{width: 360px; margin: 0px auto; position: relative;}
.ban03 span.img{width: 45%;float: left;}
.ban03 span.txt{width: calc(55% - 20px); font-size: 18px; color: #fff; line-height: 24px;float: left; margin-left: 20px; padding-top: 10px}
.ban03 span.txt span{background: #fff; color:#80aec8 }
.ban03 span.img img{width: 100%}


/*@media only screen and (max-width:990px){
	.banner-set{width: 100%; padding: 0px}
	#ban02{margin-right: 10px}
	.banner.wp50{width: calc(50% - 5px);max-width: 472px;}

}*/
@media only screen and (max-width:990px){
	.banner-set{margin-top: 0px; margin-bottom: 0px}
	.recruit-ban{display: none;}
	#ban04{height:auto; display: none !important; }
	#ban06{display: block !important;height:auto;}
	.banner-set .lef{width: 100%;}
	.banner-set .rig{width: 100%; margin-left: 0;}
	#ban04{height:auto; }
	.banner.wp100{max-height: 304px; border: 1px solid #cccfd5;}
	.banner.wp100 span.img.pc{display: none}
	.banner.wp100 span.img.mobile{width: calc(60% - 1px); float: left; display: block;max-height: 311px; height: 100%; border-right: 1px solid #cccfd5}
	.banner.wp100 span.img.mobile img{width: 100%}
	.banner.wp100 span.cont{width: calc(40% - 20px); float: left;padding: 9% 0 9% 20px; text-align: left;}
	.banner span.cont.b-03{background: #fff; position: relative;}
}

@media only screen and (max-width:720px){
	.banner.wp100 span.img.mobile{width: calc(52% - 1px);}
	.banner.wp100 span.cont{width:calc(48% - 20px);padding: 4% 0 4% 20px;}
	.ban03{margin-top: 10px}
}
@media only screen and (max-width:650px){
	.banner.wp100 span.cont{padding: 5% 0 5% 20px;}
}

@media only screen and (max-width:570px){
	.banner.wp100{max-height: 704px}
	.banner.wp100 span.img.mobile{width: 100%; border-right: 0}
	.banner.wp100 span.cont{width: 100%; text-align: center; padding: 3% 0 3% 0; margin-left: 0}
}
@media only screen and (max-width:550px){

}

@media only screen and (max-width:480px){
	.banner.wp50{width: 100%;max-width: 550px; margin-bottom: 10px}
	.banner.wp50 span.img-pc{display: none;}
	.banner.wp50 span.img-mo{width: 50%; display: inline-block; float: left; max-height: 194px; height: 100%}
	.banner.wp50 img{width: 100%; height: 100%;}
	#ban01 .owl-item,#ban01 .owl-item .item,#ban02 .owl-item,#ban02 .owl-item .item{height: 180px !important }
	#ban02{display: none;}
	.banner.wp50 span.cont{padding: 80px 0 30px 0; width: 50%; float: left; height: 100%}
	.banner .state{margin-top: 25px; padding: 5px; height: 34px; border: 1px solid #fff}
	.banner .state.c-01{background: none}
	.banner .state.c-02{background: none}
	.ban03{margin-top: 0px}
	.ban03 .align-c{width: 300px;}
	.ban03 span.txt{font-size: 16px; padding-top: 0px}
}
@media only screen and (max-width:400px){
	#ban01 .owl-item,#ban01 .owl-item .item,#ban02 .owl-item,#ban02 .owl-item .item{height: 326px !important }
		.banner.wp50 span.img-pc{display: block;}
	.banner.wp50 span.img-mo{display: none;}
	.banner.wp50 img{width: 100%; height: 100%;}
	.banner.wp50 span.cont{padding: 40px 0 30px 0; width: 100%; float: none; max-height: 300px; height: 100%}
	.banner .state{margin-top: -22px; padding: 10px 5px; height: 44px; border: 0px solid #fff}
	.banner .state.c-01{background: #053262}
	.banner .state.c-02{background: #d270f7}

}
@media only screen and (max-width:380px){
	.ban03{padding: 20px 0 30px 0}
	.ban03 .align-c{width: 280px; }
	.ban03 span.img{width: 100%;text-align: center;}
	.ban03 span.img img{max-width:180px }
	.ban03 span.txt{width:100%; margin-left: 0px; padding-top: 15px; text-align: center;}
	div .owl-next{float: right; margin-right: 10px;}
}
