@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
 * date : 2020-11-25
******************************************************** */

/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 1366px ){
	#mainVisual {padding-left: 0; width: 100%; background: #000 }
	.main-visual-txt-inner {padding-right: 15px;}
	/* 메인 비주얼 :: 스크롤아이콘 */
	.main-scroll-icon{display: none;}
}
@media all and ( max-width: 1220px ){
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-item .main-visual-txt-con{margin-top: -20px; text-align: center;}
	.main-visual-txt-inner{width: 100%; padding-right: 0; text-align: center;}
	.main-visual-item .main-visual-txt-con .main-visual-txt1{font-size:42px;}
	.main-visual-item .main-visual-txt-con .main-visual-txt2{font-size:42px; margin-bottom:20px;}
	.main-visual-item .main-visual-txt-con .main-visual-txt3{font-size:26px;}
	/* 메인 비주얼 :: Dots */
	.main-visual-con .slick-dots-wrapper{bottom: 40px;}
	/* 메인 비주얼 :: 방패아이콘 */
	.main-point-icon{top: 50%; margin-top: -160px; left: 50%; margin-left: 100px; right: auto; width: auto; padding-right: 0;}
	.main-point-icon span{margin-left: 0; width: 85px; height: 85px;}
	.main-point-icon span:before{margin-top: -80px; margin-left: -80px; width: 160px; height: 160px;}
	.main-point-icon span:after{margin-top: -63px; margin-left: -63px; width: 126px; height: 126px;}
}
@media all and ( max-width: 800px ){
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-item .main-visual-txt-con .main-visual-txt1{font-size:31px;}
	.main-visual-item .main-visual-txt-con .main-visual-txt2{font-size:31px; margin-bottom:15px}
	.main-visual-item .main-visual-txt-con .main-visual-txt3{font-size: 20px;}
	/* 메인 비주얼 :: Dots */
	.main-visual-con .slick-dots-wrapper{bottom:30px;}
	.main-visual-item .main-visual-pc-img {opacity: 50%;}
	/* 메인 비주얼 :: 방패아이콘 */
	.main-point-icon{margin-top: -125px; margin-left: 80px; margin-left: -30px;}
	.main-point-icon span{width: 60px; height: 60px;}
	.main-point-icon span:before{margin-top: -60px; margin-left: -60px; width: 120px; height: 120px;}
	.main-point-icon span:after{margin-top: -45px; margin-left: -45px; width: 90px; height: 90px;}
}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
@media all and ( max-width: 1420px ){
	.main-tit-box.btn-display .area {padding-right: 180px !important;}
	.main-tit-box .main-tit-btn{right:75px;}
}
@media all and ( max-width: 1024px ){
	.main-tit-box .main-tit{font-size:27px;}
	.main-tit-box .main-sub-tit{margin-top:5px; font-size:37px;}
	.main-tit-box .main-tit-btn{top: 20px;}
}
@media all and ( max-width: 800px ){
	.main-tit-box.btn-display .area{padding-right: 115px !important;}
	.main-tit-box .main-tit{font-size:21px;}
	.main-tit-box .main-sub-tit{margin-top:5px; font-size:31px;}
	.main-tit-box .main-tit-btn{right:35px;}
	.main-tit-box .main-tit-btn:before{margin-top: -30px; left: 27px; width: 60px; height: 60px;}
	.main-tit-box .main-tit-btn span{font-size: 12px; line-height: 30px; letter-spacing: 1.5px;}
	.main-tit-box .main-tit-btn span i{position: relative; top: 4px; margin-left: 5px; font-size: 15px;}
}
/* @media all and ( max-width: 640px ){
	.main-tit-box.btn-display .area{padding-right: 15px !important;}
	.main-tit-box .main-tit-btn{margin-top: 30px; display: inline-block; position: relative; top: 0; right:0;}
	.main-tit-box .main-tit-btn:before{margin-top: -30px; left: 27px; width: 60px; height: 60px;}
	.main-tit-box .main-tit-btn span{font-size: 12px; line-height: 30px; letter-spacing: 1.5px;}
	.main-tit-box .main-tit-btn span i{position: relative; top: 4px; margin-left: 5px; font-size: 15px;}
} */


/* -------- 메인 컨텐츠 :: 컨텐츠1(신용등급, 매출액, 임직원) -------- */
@media all and ( max-width: 1366px ){
	.main-company-con {padding-left: 120px;}
	.main-company-item{padding: 0 4.5%;}
	.main-company-list .main-company-item:first-child{padding-left: 5.4%;}
}
@media all and ( max-width: 1220px ){
	#mainCompanyCon{margin-top: 0;}
	.main-company-con {padding-left: 0;}
	.main-company-list{height: 120px;}
	.main-company-list:before{display: none;}
	.main-company-item .tit img {height: 45px;}
	.main-company-item .info strong {font-size: 36px; line-height: 45px;}
	.main-company-item .info b {font-size: 44px; line-height: 45px;}
	.main-company-item .info sup {font-size: 32px;}
}
@media all and ( max-width: 1024px ){
	.main-company-list{height: auto;}
	.main-company-item,
	.main-company-list .main-company-item:first-child{width: 100%; padding: 30px 8.5%;}
	.main-company-item:before{top: 0; margin-top: -1px; left: 15px; right: 15px; width: auto; height: 1px;}
}
@media all and ( max-width: 800px ){
	.main-company-item,
	.main-company-list .main-company-item:first-child{width: 100%; padding: 20px 5.4%;}
	.main-company-item .tit img{height: 40px;}
	.main-company-item .tit span{margin-left: 10px; font-size: 15px;}
	.main-company-item .info{font-size: 19px;}
	.main-company-item .info b{font-size: 31px; line-height: 40px;}
	.main-company-item .info strong{font-size: 25px; line-height: 40px; }
	.main-company-item .info sup{font-size: 25px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠2(서비스) -------- */
@media all and ( max-width: 1780px ){
	/* 01,04*/
	.item01 .main-service-txt, .item04 .main-service-txt {bottom: -145px; height: 200px;}
}
@media all and ( max-width: 1660px ){
	/* 02,03 */
	.main-service-txt{bottom: -110px; height: 165px;}
}
@media all and ( max-width: 1580px ){
	#mainServiceCon .main-tit-box .main-tit-btn {right: 55px;}
	.main-service-list{margin: 0 -15px;}
	.main-service-item{width: calc(25% - 30px); margin: 0 15px;}
	/* 02,03 */
	.main-service-txt{bottom: -135px; height: 190px;}
	/* 01,04*/
	.item01 .main-service-txt, .item04 .main-service-txt {bottom: -165px; height: 220px;}
}
@media all and ( max-width: 1480px ){
	#mainServiceCon .main-tit-box .area{max-width: none; padding: 0 90px; padding-right: 180px !important;}
	#mainServiceCon .main-tit-box .main-tit-btn {right: 130px;}
}
@media all and ( max-width: 1366px ){
	#mainServiceCon .main-tit-box .area{padding: 0 30px;}
	#mainServiceCon .main-tit-box .main-tit-btn {right: 75px;}
}
@media all and ( max-width: 1220px ){
	.main-service-con{margin-top: 100px;}
	.main-service-txt .top span{display: none;}
	.main-service-txt .bottom ul{margin: -7px 0;}
	.main-service-txt .bottom ul li {margin: 7px 0; width: 100%; float: none;}
	/* 02 */
	.item02 .main-service-txt .bottom ul li,
	.item02 .main-service-txt .bottom ul li:nth-child(odd){width: 100%;}
}
@media all and ( max-width: 1120px ){
	.main-service-txt{bottom: 0; height: auto;}
	.main-service-txt .top{width: 100%; height: 80px; align-items: initial; justify-content: center; flex-direction: column;}
	.main-service-txt .top h5{width: 100%;}
	.main-service-txt .top span{display: block; width: 100%; margin-top: 5px; margin-left: 0;}
	.main-service-txt .bottom{display: none;}
	.item01 .main-service-txt, .item04 .main-service-txt{bottom: 0; height: auto;}
}
@media all and ( max-width: 1024px ){
	#mainServiceCon .main-tit-box .area{padding: 0 15px; padding-right: 170px !important;}
	#mainServiceCon .main-tit-box .main-tit-btn {right: 65px;}
}
@media all and ( max-width: 800px ){
	#mainServiceCon{padding:65px 0 70px;}
	#mainServiceCon .main-tit-box .area{padding-right: 115px !important;}
	#mainServiceCon .main-tit-box .main-tit-btn {right: 35px;}
	.main-service-con {margin-top: 50px;}
	.main-service-list{margin: 0 -10px;}
	.main-service-item{width: calc(50% - 20px); margin: 10px;}
	.main-service-txt .top{width: 100%; padding: 0 10px; height: 65px;}
	.main-service-txt .top h5{font-size: 17px;}
	.main-service-txt .top span{font-size: 13px;}
}
/* @media all and ( max-width: 640px ){
	#mainServiceCon .main-tit-box.btn-display .area{padding-right: 15px !important;}
	#mainServiceCon .main-tit-box .main-tit-btn{margin-top: 30px; display: inline-block; position: relative; right: auto;}
} */


/* -------- 메인 컨텐츠 :: 컨텐츠3(PR Video) -------- */
@media all and ( max-width: 1220px ){
	.main-video-thum{padding-bottom: 100px; position: static; float: right;}
}
@media all and ( max-width: 1024px ){
	#mainVideoCon{padding-top: 150px;}
	#mainVideoCon:before{height: 50px;}
	#mainVideoCon:after{width: 50px;}
	.main-video-con {margin-top: 50px;}
	.main-video-txt{padding-bottom: 0;}
	.main-video-txt .tit01{font-size: 27px;}
	.main-video-txt .tit02{font-size: 35px;}
	.main-video-txt .txt{font-size: 24px;}
}
@media all and ( max-width: 800px ){
	#mainVideoCon{padding-top: 100px;}
	#mainVideoCon:before{height: 35px;}
	#mainVideoCon:after{width: 35px;}
	.main-video-con{margin-top: 50px;}
	.main-video-txt{float: none; width: 100%; padding-bottom: 40px;}
	.main-video-txt .tit01{font-size: 21px;}
	.main-video-txt .tit02{margin-top: 10px; font-size: 35px;}
	.main-video-txt .txt{margin-top: 15px; font-size: 18px;}
	.main-video-thum{float: none; width: 100%; padding-bottom: 50px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠4(파트너사) -------- */
@media all and ( max-width: 1420px ){
	.main-partner-tab-con{padding: 0 40px;}
	.main-partner-list .slick-arrow.slick-prev{left: -40px;}
	.main-partner-list .slick-arrow.slick-next{right: -40px;}
}
@media all and ( max-width: 1024px ){
	.main-partner-tab-con{padding: 0 50px;}
}
@media all and ( max-width: 800px ){
	#mainPartnerCon{padding: 80px 0;}
	#mainPartnerCon .main-tit-box.btn-display .area {padding-right: 15px !important;}
	.main-partner-tab-wrapper{margin-top: 50px; height:41px;}
	.main-partner-tab-list{padding: 0 10px;}
	.main-partner-tab-list ul li:before{bottom: -2px; margin-left: -2px; width: 4px; height: 4px;}
	.main-partner-tab-list ul li a{height:40px;}
	.main-partner-tab-list ul li a em{font-size:15px;}
	.main-partner-tab-list ul li.selected:before{width: 60px; margin-left: -30px;}
	.main-partner-tab-content{padding-top: 35px;}
	.main-partner-tab-con{padding: 0 30px;}
	.main-partner-list .partner-item-inner{height:55px; padding:0 6px;}
	.main-partner-list .slick-arrow{margin-top:-20px; width:40px; height:40px; font-size:20px;}
	.main-partner-list .slick-arrow i{line-height:40px;}
	.main-partner-list .slick-arrow.slick-prev{left:-35px;}
	.main-partner-list .slick-arrow.slick-next{right:-35px;}

	.main-partner-list .partner-item-inner span img {    max-width: 70%;}
}
@media all and ( max-width: 480px ){
	.main-partner-tab-list{padding-bottom: 10px;}
	.main-partner-tab-list ul li:before {bottom: -12px;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠5(Customer) -------- */
@media all and ( max-width: 1024px ){
	#mainCustomerCon .main-tit-box .main-sub-tit {font-size: 29px;}
	/* 갤러리형 */
	.main-gallery{width: 100%; float: left;}
	.main-gallery-list{margin: 0 -20px;}
	.main-gallery-item{width: calc(50% - 40px); margin: 0 20px;}
	/* 게시판형 */
	.main-board{margin-top: 60px; width: 100%; float: left;}
}
@media all and ( max-width: 800px ){
	#mainCustomerCon{padding: 60px 0;} 
	#mainCustomerCon .main-tit-box .main-sub-tit {margin-top: 0; font-size: 29px;}

	.main-customer-con{margin-top: 60px;}
	/* 갤러리형 */
	.main-gallery-list{margin: 0 -10px;}
	.main-gallery-item{width: calc(50% - 20px); margin: 0 10px;}
	.main-gallery-txt{margin-top: 15px;}
	.main-gallery-txt .tit{font-size: 17px;}
	.main-gallery-txt .date{margin-top: 15px; padding-left: 17px;}
	.main-gallery-txt .date:before{font-size: 13px;}

	/* 게시판형 */
	.main-board{margin-top: 50px;}
	.main-board-item a{padding: 17px 0 15px;}
	.main-board-date{width: 80px;}
	.main-board-date b{font-size: 16px;}
	.main-board-date span{margin-top: 7px; font-size: 13px;}
	.main-board-info{padding: 0 10px; width: calc(100% - 100px);}
	.main-board-info .tit{font-size: 14px; line-height: 20px;}
	.main-board-info .tit span{padding: 0 10px; font-size: 12px; line-height: 20px; margin-right: 7px;}
	.main-board-info .txt{margin-top: 8px; font-size: 13px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠6(채용) -------- */
@media all and ( max-width: 1220px ){
	.main-recruit-top .date{width: calc(100% - 120px); min-width: none;}
}
@media all and ( max-width: 1024px ){
	.main-recruit-list{margin: -10px;}
	.main-recruit-item{width: calc(50% - 20px); margin: 10px;}
}
@media all and ( max-width: 800px ){
	#mainRecruitCon{padding-top: 60px; background: #fff url("../images/main/main_recruit_bg.jpg") center top no-repeat;}
	#mainRecruitCon .main-tit-box .main-sub-tit{font-size: 29px;}

	.main-recruit-con{margin-top: 35px;}
	.main-recruit-list{margin: -5px;}
	.main-recruit-item{width: calc(100% - 10px); margin: 5px;}
	.main-recruit-item a{padding: 15px; width: 100%; height: auto;}
	.main-recruit-item a:before{border-color: #d9d9d9;}
	.main-recruit-top .progress{width: 70px; height: 24px; font-size: 13px; line-height: 24px;}
	.main-recruit-top .date{width: calc(100% - 85px); max-width: 77px; padding-left: 10px; font-size: 13px; line-height: 24px;}
	.main-recruit-top .date:before{top: -1px; left: 0; font-size: 14px;}
	.main-recruit-middle{padding: 15px 0;}
	.main-recruit-middle .company{width: 60%; padding-right: 10px; font-size: 15px; line-height: 20px;}
	.main-recruit-middle .place{width: 40%; font-size: 13px; line-height: 20px;}
	.main-recruit-bottom{padding-top: 15px;}
	.main-recruit-bottom .txt01{font-size: 13px;}
	.main-recruit-bottom .txt02{margin-top: 10px; font-size: 13px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠7(CONTACT US) -------- */
@media all and ( max-width: 1366px ){
	#mainContactCon .main-tit-box{width: 340px;}
	.main-contact-con{width: calc(100% - 360px);}
}
@media all and ( max-width: 1220px ){
	#mainContactCon .main-tit-box{width: 100%; padding-right: 0; float: none;}
	.main-contact-con{margin-top: 40px; width: 100%; float: none;}
	.main-contact-con:before{display: none;}
	.main-contact-list{width: auto; margin: 0 -30px;}
	.main-contact-item{width: calc(33.33% - 60px); margin: 0 30px;}
}
@media all and ( max-width: 1024px ){
	#mainContactCon .main-tit-box .main-sub-tit {font-size: 34px;}
	.main-contact-list{margin: 0 -20px;}
	.main-contact-item{width: calc(33.33% - 40px); margin: 0 20px;}
}
@media all and ( max-width: 800px ){
	#mainContactCon{padding: 45px 0;}
	#mainContactCon .main-tit-box .main-sub-tit {font-size: 28px;}
	.main-contact-con{margin-top: 30px;}
	.main-contact-list{margin: 0 -10px;}
	.main-contact-item{width: calc(33.33% - 20px); margin: 0 10px; text-align: center;}
	.main-contact-img{width: 100%;}
	.main-contact-img img{height: 40px; display: inline-block;}
	.main-contact-txt{margin-top: 10px; margin-left: 0; width: 100%;}
	.main-contact-txt h5{font-size: 15px;}
	.main-contact-txt p{margin-top: 5px; font-size: 16px;}
}
@media all and ( max-width: 640px ){
	/* .main-contact-list{margin: -10px 0;}
	.main-contact-item{width: 100%; margin: 10px 0;}
	.main-contact-img{width: 60px; text-align: center;}
	.main-contact-txt{margin-left: 10px; width: calc(100% - 70px);} */
	.main-contact-txt h5{font-size: 14px;}
	.main-contact-txt p{font-size: 15px;}
}