@charset "utf-8";
@import url('style.css');


/* 메인비주얼 */
/* .mainroll {position: relative} */
.mainroll {overflow:hidden; position:relative; width:100%; height:520px; /* background-size:cover !important; */}
.mainroll .visualTxt {position: absolute;top:120px;left: 0;width: 100%; z-index: 100;text-align: center;}
.mainroll .visualTxt .tit {font-size:37px; line-height:1.3; font-family: "NotoSans-Bold";color: #fff; text-shadow: 1px 1px 3px #555}
.mainroll .visualTxt .tit > em {color:#2d3e84; text-shadow: 1px 1px 3px #fff}
.mainroll .visualTxt .tit > span {display:inline-block}
.mainroll .item {position: relative;width: 100%;height:100%; outline:1px solid red}
.mainroll .item img {max-height:520px}
.mainroll .item_bg01 {background: url("/images/main/main_visual01.jpg") no-repeat center center/cover}

/* 메인비주얼 문구 */
.mainroll .tit {position:relative; opacity:0;filter:Alpha(opacity=0); visibility:hidden;
	-moz-transition:transform 0.8s, opacity 1.0s;
	-ms-transition:transform 0.8s, opacity 1.0s;
	-webkit-transition:transform 0.8s, opacity 1.0s;
	-o-transition:transform 0.8s, opacity 1.0s;
	transition:transform 0.8s, opacity 1.0s;
}
/* 메인비주얼 문구 Active */
.mainroll.active .tit {
	opacity:1.0;filter:Alpha(opacity=100); visibility:visible;
	-ms-transform: translateX(0) rotate(0.0001deg);
    -o-transform: translateX(0) rotate(0.0001deg);
    -moz-transform: translateX(0) rotate(0.0001deg);
    -webkit-transform: translateX(0) rotate(0.0001deg);
     transform: translateX(0) rotate(0.0001deg); 
}
.mainroll.active .tit{-webkit-transition-delay:0.3s; -moz-transition-delay:0.3s; -o-transition-delay:0.3s; -ms-transition-delay:0.3s; transition-delay:0.3s}


/* 메인비주얼 이미지 */
.mainroll .item_bg01{
	position:absolute; left:0; width:100%; height:100%;
	-ms-transform: scale(1.1,1.1) rotate(0.0001deg);
    -o-transform: scale(1.1,1.1) rotate(0.0001deg);
    -moz-transform: scale(1.1,1.1) rotate(0.0001deg);
    -webkit-transform: scale(1.1,1.1) rotate(0.0001deg);
     transform: scale(1.1,1.1) rotate(0.0001deg);
	-webkit-transition:transform 5s  ease-in-out ;
	-moz-transition:transform 5s ease-in-out ;
	-o-transition:transform 5s ease-in-out ;
	-ms-transition:transform 5s ease-in-out ;
    transition:transform 5s ease-in-out ;	
}
/* 메인비주얼 이미지 Active */
.mainroll.active .item_bg01{
	-ms-transform: scale(1.0,1.0) rotate(0.0001deg);
    -o-transform: scale(1.0,1.0) rotate(0.0001deg);
    -moz-transform: scale(1.0,1.0) rotate(0.0001deg);
    -webkit-transform: scale(1.0,1.0) rotate(0.0001deg);
     transform: scale(1.0,1.0) rotate(0.0001deg);
}

/*메인컨텐츠*/
.mainConArea {/* width:1200px; */ width:100%; margin:0 auto; padding:70px 0 76px 0}
.titleWrap{text-align:center;margin-bottom:50px;}
.title{font-size:32px;color: #3a3a3a;font-family:"NotoSans-Bold";}
.subTitle{margin-top:10px;font-size:12px;font-family:"NotoSans-Light";color: #777;letter-spacing: 0}
.subTitle2 {font-family: 'NotoSans-Bold', sans-serif;font-size: 22px;color: #000;margin: 80px 0 30px;}
.subTitle2.first {margin:0 0 30px}


/* 사업내용 */
.mainService {overflow: hidden; background:#f4f5f9; padding:40px 0;}
.mainService .mainPerformance {width:100%; max-width:1200px; margin:0 auto; overflow: hidden}
.mainService .mainPerformance li {float:left;width: calc(50% - 20px); margin-left:40px}
.mainService .mainPerformance li:first-child {margin-left:0;}
.mainService .mainPerformance li a {display:block; position:relative}
.mainService .mainPerformance li .title {padding:24px 30px 0;font-family:"NotoSans-Medium";font-size:17px;color:#555;line-height:25px;text-align: center;word-break: keep-all;}
.mainService .mainPerformance li:hover .title {text-decoration:underline;color: #eb743c}
.mainService .mainPerformance li a img {width: 100%}


/* 제품소개 마우스 오버시 효과 */
.mainService .mainPerformance li a .line {display:none}


.mainNotices {width:100%; max-width:1200px; margin:0 auto; margin-top:50px; padding-top:20px;overflow: hidden;}
.mainNotices .title {color: #3a3a3a;font-size: 27px;font-family:"NotoSans-Bold";position: relative;padding-left: 17px;margin-bottom: 20px;}
.mainNotices .title::after {content: '';display: block;position: absolute;left: 0;top: 0;width: 4px;height: 27px;background: #eb743c;margin-right:10px;}
.mainNotices > div {position:relative;float:left;width:calc(50% - 20px);border:0; margin-left: 40px; }
.mainNotices > div:first-of-type {margin-left: 0px;padding-right: 0px;}
.mainNotices > div a.a01{position:relative;height:173px;padding:0;}
.mainNotices > div:last-child:after{display:none;}
.mainNotices > div h2{font-size:18px;margin-bottom:5px;color: #555;margin:0;text-align:left;line-height: 1.5}
.mainNotices > div p{display:block;line-height:20px;color:#828282;font-size: 14px;font-family:"NotoSans-Light";margin-top: 16px}
.mainNotices > div span{color:#afafaf;font-size: 14px;}


/* /* 고객센터 */ */
.mainCustomer {width:50%}
.mainCustomer h1 {font-family:"NotoSans-Medium"; color:#3a3a3a; font-size:27px}
.mainCustomer .ul01_2 {margin-top:25px}
.mainCustomer .ul01_2 em {font-family:"NotoSans-Medium"; font-weight:500; font-size:22px}
.mainCustomer .ul01_2 p.slogan {margin-top:0px; font-family:"NotoSans-Regular"; font-size:17px; font-weight:300; color:#021058}
.mainCustomer .ul01_2 li {width:calc(100% - 40px);  padding:15px 20px; background:url(/images/main_customer2.jpg) no-repeat center 0; background-size:cover}
.mainCustomer .ul01_2 p.txt {font-family:"NotoSans-Regular"}
.mainCustomer .ul01_2 .tel {font-size:20px; color:#eb743c}
.mainCustomer .ul01_2 .tel em {color:#eb743c; font-style:normal}	
.mainCustomer .ul01_2 .fax {font-size:20px; color:#333; margin-left:10px}
.mainCustomer .ul01_2 .fax em {color:#000; font-style:normal}
.mainCustomer .ul01_2 p.btn {margin-top:15px; text-align:left; padding:0}
.mainCustomer .ul01_2 p.btn a.btn {width:50%; height:30px; line-height:29px; font-weight:400; font-size:15px; letter-spacing:0.09em; background:#bf2932; font-family:"NotoSans-Medium"; }
.mainCustomer .ul01_2 p.btn a.btn:hover {background:#000}
.mainCustomer .ul01_2 p.btn a.btn_b05 {display:inline-block;background:#4f4f4f;color:#fff;text-decoration:none;vertical-align:middle; text-align:center}
.mainCustomer .radius {-moz-border-radius:15px;-webkit-border-radius:15px;border-radius:15px;}




/* 미디어쿼리 시작 */
@media all and (max-width:1220px) {

	/*메인비주얼*/
	.mainroll .visualTxt {top: 90px;}
	.mainroll .visualTxt .tit {font-size: 32px;}	
	.mainroll .item {background-size:cover}
	.mainroll {height:420px}

	/*메인컨텐츠*/
	.mainConArea {width:94%}	
	.mainService {background:#fff; padding:0}
	.mainNotices {padding-top:60px; border-top:1px solid #dedede;}
	.mainService .mainPerformance li {width:calc(50% - 15px); margin-left:30px}
	.mainNotices > div {width:calc(50% - 15px); margin-left:30px; }
}



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

	/* 메인 고객센터 */
	.mainCustomer .ul01_2 p.slogan {font-size:15px}	
	.mainCustomer .ul01_2 .tel,
	.mainCustomer .ul01_2 .fax {font-size:17px;}	
	.mainCustomer .ul01_2 .tel em,
	.mainCustomer .ul01_2 .fax em {font-size:19px;}	
}


@media all and (max-width:1010px) {
	/*메인컨텐츠*/
	.mainService .mainPerformance li .title {font-size:15px;padding:18px 12px 0;line-height: 20px;}	
	.mainService .mainPerformance li {margin-bottom: 10px}
}


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


@media all and (max-width:981px) {
	
	h2 {font-size:25px; margin-top:50px;}
	h2 .sp02{font-size:17px !important;}
	.titleWrap {margin-bottom: 5%}
	.title {font-size:28px}
	.subTitle {margin-top: 5px}
	.subTitle2 {margin-bottom:15px; font-size:19px}


	/*메인컨텐츠*/	
	.mainService .mainPerformance li {width:calc(50% - 10px); margin-left:20px}

	.mainNotices .title {font-size: 24px}
	.mainNotices .title::after {height: 24px;}
	.mainNotices > div {width:100%;border-top: 0px solid #d0d0d0;border-bottom: 0px solid #dedede;margin-left: 20px;}
	.mainNotices > div:last-child {border-top: 0;}
	.mainNotice > div a.a01 {display: block;padding: 0 20px 0 0;box-sizing: border-box;}
	.mainNotices > div h2 {font-size: 16px;}
	.mainNotices > div a.a01 {padding:0 20px 0 0 !important;}

	.mainNotices .div01,
	.mainNotices .mainCustomer{clear:both; width:100%; margin-left:0  !important;}

	.notice .bx-next{right:0px}
	.notice .bx-prev{right:25px}

	.mainCustomer h1 {margin-top:50px}
	.mainCustomer .ul01_2 li {width:calc(100% - 40px);  padding:30px 25px}
	.mainCustomer .ul01_2 p.slogan {font-size:17px}	
	.mainCustomer .ul01_2 .tel,
	.mainCustomer .ul01_2 .fax {font-size:19px;}	
	.mainCustomer .ul01_2 .tel em,
	.mainCustomer .ul01_2 .fax em {font-size:21px;}			
}

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

	/*메인비주얼*/
	.mainroll {height:340px}
	.mainroll .visualTxt {top: 70px;}
	.mainroll .visualTxt .tit {font-size: 25px;}
	.mainroll .visualTxt .txt {font-size: 18px;line-height: 24px}
	.mainroll .item_bg01 {background: url("/images/main/main_visual_m01.jpg") repeat-x center center/cover}	

	/*메인컨텐츠*/	
	.title {font-size:24px}
	.mainConArea {padding:7% 3% 7% 3%}
	.mainService .mainPerformance li {float:left;width: calc(50% - 5px); margin-left:10px}
	.mainService .mainPerformance li .title {font-size:14px;padding:10px 0 0;line-height: 20px;}	
	.mainNotices .title {font-size: 20px}
	.mainNotices .title::after {height: 20px;}
}

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

	/* 고객센터 */
	.mainCustomer .ul01_2 li {width:calc(100% - 20px);  padding:15px 10px}
	.mainCustomer .ul01_2 p.slogan {font-size:14px}
	.mainCustomer .ul01_2 p.txt span {display:block}
	.mainCustomer .ul01_2 p.txt i {display:none}
	.mainCustomer .ul01_2 .tel em {margin-right:3.5px}	
	.mainCustomer .ul01_2 .fax {margin:10px 0 0 0}
	.mainCustomer .ul01_2 p.btn a.btn {width:100%}
}


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

	/*메인비주얼*/
	/* #mainVisual .item {height:260px} */
	.mainroll {height:260px}
	.title {font-size:20px}
	.mainroll .visualTxt {top: 50px;}
	.mainroll .visualTxt .tit {font-size: 20px;}	
	

	/*메인컨텐츠*/	
	.mainService .mainPerformance li .title {font-size:13px;}
	.mainPerformance {margin-top:0}
	.mainNotices {margin-top:20px; padding-top:30px}

	/* 고객센터 */
	.mainCustomer h1 {margin-top:30px}
}


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


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

	/* 고객센터 */
	.mainCustomer .ul01_2 li {width:calc(100% - 20px);  padding:15px 10px}
	.mainCustomer .ul01_2 p.slogan {font-size:13px}
}