@charset "utf-8";


/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 800px ){
	/* 메인 비주얼 :: 이미지 */
	#mainVisual, #mainVisualWrapper{/* height: auto; */height: 330px;}
	.main-visual .main-visual-inner{/* background: none !important; */}
	.main-visual .main-visual-inner .pc-img{display: none !important;}
	.main-visual .main-visual-inner .m-img{display: block; width: 100%;}
	.main-visual-m-img img{width:100%;}
	/* 메인 비주얼 :: 텍스트 */
	#mainVisualInfoBox {top: auto; margin-top: 0; bottom: 27px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt1{font-size:8px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt1 .pc-txt{display: none;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt1 .m-txt{display: block;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt2{font-size:25px; margin-top: 10px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt2 .pc-txt{display: none;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt2 .m-txt{display: block;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt3{display:block; font-size: 16px; line-height: 22px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt3 .pc-txt{display: none;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-txt3 .m-txt{display: block;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn{margin-top: 16.5%; width:106px; height:30px; line-height:30px; border:2px solid rgba(255,255,255,0.5); font-size:11px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn:before,
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn:after{top:-2px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn:before{left:-2px; width:2px; height:34px;}
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn:after{width:40px; height:30px; border-top:2px solid #fff; border-bottom:2px solid #fff}
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn:hover:before{width:110px}
	#mainVisualInfoBox .main-visual-info-item .main-visual-more-btn:hover:after{width:106px}
	/* 메인 비주얼 :: 화살표 및 번호 */
	#mainVisual .main-slick-btn{bottom:-8px; width:20px; font-size: 11px;}
	#mainVisual .main-slick-prev{left: auto; right: 80px;}
	#mainVisual .main-slick-next{left: auto; right: 5px;}
	/* 메인 비주얼 :: 로딩circle */
	.circle-line{bottom:-8px; left:auto; right: 27.5px;}
	/* dot 배경 및 일시정지 추가 */
	.main-dot-con{width: 50px; height: 50px;}
	.main-dot-con .pause a i, .main-dot-con .play a i{line-height: 50px;}
}





/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
@media all and ( max-width: 800px ){
	/* 공통 :: 타이틀 */
	.main-tit{font-size: 23px; margin-bottom: 15px;}
}


/* -------- 메인 컨텐츠 01:: WHO WE ARE, NEWS -------- */
/* WHO WE ARE */
@media all and (max-width:1024px){
	.main-who-con{width: 100%;}
	.main-who-con .tit .img{display: none;}
	.main-who-con .m-img{margin-top: 25px; display: block;}
	.main-who-con .m-img img{display: inline-block; margin-right: 10px;}
}
@media all and (max-width:800px){
	.main-news-tit{font-size: 13px;}
	.main-who-con .tit{font-size: 17px; line-height: 25px; height: auto;}
	.main-who-con .txt{padding-top: 14px; font-size: 12px; line-height: 18px;}
	.main-who-con .txt .m-br{display: block;}
}


/* NEWS */
@media all and (max-width:1024px){
	.main-news-con{margin-top: 65px; padding-top: 60px; width: calc(54% + 20px); float: left;}
	.main-news-tit{width: 100%; top: 0; left: 0;}
	/* 이미지 */
	.main-news-list-inner{}
	.main-news-list-inner li{margin-right: 20px;}
	.main-news-list-inner li a .img-con{width: 100%; height: 0; padding-top: 56%; position: relative;}
	.main-news-list-inner li a .img-con img{position: absolute; margin: auto; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; max-width: none; max-height: none;}
	/* 텍스트 */
	.main-news-list-inner li a .txt-con{width: 100%; float: left;}
	.main-news-list-inner li a .txt-con .txt {margin-top: 20px; }
	/* 슬라이드 추가css */
	.main-news-list .slick-list{overflow: visible;}
}

@media all and (max-width:800px){
	.main-news-tit{font-size: 17px;}
	.main-news-con{margin-top: 45px; padding-top: 30px;}
	.main-news-list-inner li a .txt-con .txt{margin-top: 15px; font-size: 13px; line-height: 17px; height:54px;}
	
}





/* -------- 메인 컨텐츠 :: 컨텐츠1(공지사항,기업소개,온라인문의) -------- */
@media all and (max-width:800px){
	#mainContent1{display:none;}
	#mainContent1{padding:35px 0 55px;}
	.main-customer-con{margin: 0 -3%;}
	.main-customer-con .customer-inner{width: 94%; position: static;}
	.main-customer-con .customer-inner:before{position: static; width: 100%; height: 1px; margin: 25px 0;}
	/* 공지사항 */
	.customer-inner .main-board-tit{font-size:17px; padding-bottom:17px;}
	.customer-inner .board-more-btn{font-size:12px;}
	.customer-inner .board-more-btn i{font-size:12px;}
	.customer-inner li{margin-top:15px}
	.customer-inner li:first-child{margin-top:8px;}
	.customer-inner li .bbs-tit{font-size:12px;}
	/* 배너 */
	.customer-inner .img-con a .main-board-banner-thumb{padding-top:47.25%;}
	.customer-inner .img-con a .main-board-banner-thumb img{position:absolute; top:0px; left:0; margin-left: 0; width:100%; height:100%;}

	#mainContent1_m{ display:block;}
	#mainContent1_m{padding:5px 0 55px;}
	
	#mainContent100_m{ display:block;}
	#mainContent100_m{padding:5px 0 1px;}
	
	#mainContent100{display:none;}
	
	
	
}



/* -------- 메인 컨텐츠 :: 컨텐츠2(product) -------- */
@media all and (max-width:800px){
	#mainContent8 .area-box{padding-top:33px; padding-bottom: 35px;}
	ul.main-prd-list{margin: 0 -5px; height: 130px;}
	ul.main-prd-list li{margin: 0 5px; height: 130px; position: static;}
	ul.main-prd-list li a{position: static; height: 130px; padding: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	ul.main-prd-list li a .img-con{width: 100%; padding-left: 0; display: block; height: 60px; text-align: center;}
	ul.main-prd-list li a .img-con span{display: inline-block; max-width: 95%; max-height: 60px; text-align: center;}
	ul.main-prd-list li a .img-con span img{max-width: none; max-height: 60px;}
	ul.main-prd-list li a .txt-con{margin-top: 12px; float: left; width: 100%; padding-right: 0; display: block; height: auto; text-align: center;}
	ul.main-prd-list li a .txt-con p{padding-left: 0; display: inline-block; font-size: 11px; line-height: 1.2;}
	ul.main-prd-list li a .txt-con p br{display: none;}

	ul.main-prd-list .slick-arrow{top: -40px; width: 28px; height: 28px; line-height: 28px;}
	ul.main-prd-list .slick-arrow.slick-prev{left: 5px;}
	ul.main-prd-list .slick-arrow.slick-next{right: 5px;}
	ul.main-prd-list .slick-arrow.slick-prev i, .slick-arrow.slick-next i{font-size: 11px;}
}




/* -------- 메인 컨텐츠 :: 컨텐츠3() -------- */
@media all and ( max-width: 1024px ){
	/* .main-quick-menu-list .quick-menu-item .item-sub-tit br{display: none;} */
	.main-quick-menu-list .quick-menu-item .item-tit{font-size:26px;}
	.main-quick-menu-list .quick-menu-item .item-sub-tit{font-size:14px; line-height: 1.5;}
}
@media all and ( max-width: 800px ){
	#mainContent3 {padding: 35px 0 30px;}

	.main-quick-menu-list .quick-menu-item{margin-top: 15px; width:100%;}
	.main-quick-menu-list .quick-menu-item:first-child{margin-top: 0;}
	.main-quick-menu-list .quick-menu-item a{padding-top:74%;}
	.main-quick-menu-list .quick-menu-item a .quick-menu-thumb .pc-img{display: none;}
	.main-quick-menu-list .quick-menu-item a .quick-menu-thumb .m-img{display: block;}
	.main-quick-menu-list .quick-menu-item .item-txt-box {top:23%;}
	.main-quick-menu-list .quick-menu-item .item-txt-box strong{margin-bottom:10px;}
	.main-quick-menu-list .quick-menu-item .item-tit{font-size:20px;}
	.main-quick-menu-list .quick-menu-item .item-sub-tit{font-size:15px; line-height: 1.5;}

	.main-quick-menu-list .quick-menu-item .item-txt-box .cir{width: 30px; height: 30px;  }
	.main-quick-menu-list .quick-menu-item .item-txt-box .cir i{font-size: 13px; line-height: 30px;}
}




/* -------- 메인 컨텐츠 :: 컨텐츠4() -------- */
@media all and ( max-width: 1290px ){
	ul.main-rule-list li a .rule-list-inner .txt-box{height:180px; }
	ul.main-rule-list li a .rule-list-inner .txt-box .txt-box-inner{ }
	
	ul.main-rule-list li a .rule-list-inner .txt-box .cir {margin-right: 0;}

	
	
	ul.main-rule-list li a .rule-list-inner .txt-box .tit{width: 450px;font-size: 22px;}
ul.main-rule-list li a .rule-list-inner .txt-box .sub-tit-main{display: inline-block; width: calc(100% - 5px); margin-top:10px;  font-size: 15px; }

	
	
	
	
	
	}
@media all and ( max-width: 800px ){
	ul.main-rule-list li{width: 100%; margin-top: 20px;}
	ul.main-rule-list li:first-child{margin-top: 0;}
	ul.main-rule-list li a .rule-list-inner{}
	ul.main-rule-list li a .rule-list-inner .txt-box{height:180px; margin: 0 20px; padding: 0 20px; width: calc(100% - 80px); background:none;}

	ul.main-rule-list li a .rule-list-inner .txt-box .txt-box-inner{width: 100%; padding-bottom:50px;  padding-right: 0px; display: table-cell; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	ul.main-rule-list li a .rule-list-inner .txt-box .tit{display: block; width: auto; font-size: 20px; color:#fff; text-align:center;}
	ul.main-rule-list li a .rule-list-inner .txt-box .sub-tit-main{margin-top: 7px; display: block; width: 100%; font-size: 13px; color:#fff; text-align:center;}
	ul.main-rule-list li a .rule-list-inner .txt-box .cir{ position: absolute; top:50px; left:50%; margin-left:-10px; margin-top: 55px; width: 30px; height: 30px; }
	ul.main-rule-list li a .rule-list-inner .txt-box .cir i{font-size: 13px; line-height: 30px;}
}




/* -------- 메인 컨텐츠 :: 컨텐츠5(퀵메뉴) -------- */

@media all and ( max-width: 1220px ){
	.icon-list-wrapper li a > div{width: calc(100% - 30px); padding: 0 15px;}
	.icon-list-wrapper li a p{font-size: 20px;}
	.icon-list-wrapper li a p .arrow{margin-top: 10px; font-size: 13px;}
}
@media all and ( max-width: 1024px ){
	.icon-list-wrapper li{width: 50%;}
	.icon-list-wrapper li:nth-child(3):before{display: none;}
	.icon-list-wrapper li:nth-child(2)~*{margin-top: 30px;}
	.icon-list-wrapper li:nth-child(1) a > div, .icon-list-wrapper li:nth-child(3) a > div{padding-left: 0; width: calc(100% - 15px);}
	.icon-list-wrapper li:nth-child(2) a > div ,.icon-list-wrapper li:nth-child(4) a > div{padding-right: 0; width: calc(100% - 15px);}
}
@media all and ( max-width: 800px ){
	#mainContent5{padding: 45px 0;}
	.icon-list-wrapper li:before{height: 60px;}
	.icon-list-wrapper li:first-child:before{display: none;}
	.icon-list-wrapper li a{display: block; width: 100%; height: 60px;}
	.icon-list-wrapper li a > div{height: 60px;}
	.icon-list-wrapper li a .cir-icon{top: 50%; margin-top: -20px; width: 40px; height: 40px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
	.icon-list-wrapper li.li-01 .cir-icon, .icon-list-wrapper li.li-02 .cir-icon, .icon-list-wrapper li.li-03 .cir-icon, .icon-list-wrapper li.li-04 .cir-icon{-webkit-background-size: contain; background-size: contain;}

	.icon-list-wrapper li:nth-child(1) a > div, .icon-list-wrapper li:nth-child(3) a > div{width: calc(100% - 30px); padding-right: 30px;}
	.icon-list-wrapper li:nth-child(2) a > div ,.icon-list-wrapper li:nth-child(4) a > div{width: calc(100% - 30px); padding-left: 30px;}

	.icon-list-wrapper li a p{padding-left: 65px; font-size: 15px;}
	.icon-list-wrapper li a p .arrow{margin-top: 7px; font-size: 12px;}
}
@media all and ( max-width: 480px ){
	.icon-list-wrapper li a .cir-icon{margin-top: -15px; width: 30px; height: 30px;}
	
	.icon-list-wrapper li:nth-child(2)~*{margin-top: 15px;}

	.icon-list-wrapper li:nth-child(1) a > div, .icon-list-wrapper li:nth-child(3) a > div{width: calc(100% - 15px); padding-right: 15px;}
	.icon-list-wrapper li:nth-child(2) a > div ,.icon-list-wrapper li:nth-child(4) a > div{width: calc(100% - 15px); padding-left: 15px;}

	.icon-list-wrapper li a p{padding-left: 45px; font-size: 14px;}
}




/* ******************  메인 오른쪽 퀵메뉴 ********************** */
@media all and ( max-width: 1800px ){
	#rightBar{right: 15px;}
}
@media all and ( max-width: 1640px ){
	#rightBar{right:-56px;}
	#rightBar.fixed{visibility:hidden;opacity:0;filter:Alpha(opacity=0);}
}