@charset "utf-8";
/* *******************************************************
 * filename : content_responsive.css
 * description : 서브페이지 컨텐츠 반응형 CSS
 * date : 2022-03-14
******************************************************** */


/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
@media all and (max-width:1220px){
	.custom-scrollbar-wrapper .scroll-object{max-width:100%;}
}
@media all and (max-width:800px){
	.custom-scrollbar-wrapper{position:relative;margin-right:calc(-1* var(--area-padding)); cursor:move}
	.custom-scrollbar-wrapper .scroll-object{max-width:none; width:800px; }
	.cm-scroll-drag-guide {display:flex; justify-content:flex-end; margin-right:var(--area-padding); }
	.cm-scroll-drag-guide .cm-scroll-drag-inner { position: relative; width:50px; height: 50px; }
	.cm-scroll-drag-guide .cm-scroll-drag-inner:before { position:absolute; top:4px; right:0; width:100%; height:3px; background-color:#ccc; content:""; border-radius:5px;}
	.cm-scroll-drag-guide .drag-tail { position: absolute; z-index: 1; left: 0px; top: 3px; animation:moveScrollAni 3s both infinite; }
	.cm-scroll-drag-guide .drag-tail .tail{display:block; width: 25px; height: 5px; background-color: rgba(0, 0, 0, 0.7); border-radius:5px; opacity:1; }
	.cm-scroll-drag-guide .drag-tail .hand-icon{ font-size:30px; color:#aaa }
	@keyframes moveScrollAni {
		0%, 10% {
			left: 0;
			margin-left: 0px;
		}
		50% {
			left: 100%;
			margin-left: -25px;
		}
		100% {
			left: 0;
			margin-left: 0px;
		}
	}
}

/* -------- 공통 :: 탭 -------- */
@media all and (max-width:1220px){
	.sub-tab-list-style .area{padding:0}
}
@media all and (max-width:1024px){
	/* Tab Fixed Move*/
	.sub-tab-list-style.top-fixed{top:80px;}
}
@media all and ( max-width: 800px ){
	/* Tab 공통 스타일 */
	.sub-tab-wrapper-style,
	.sub-tab-list-style.top-fixed,
	.sub-tab-list-style ul li a{height:4.5rem; }
	.sub-tab-list-style ul li a em{font-size:1.5rem}
	/* Tab Fixed Move*/
	/* Mobile Tab Drop Menu */
	.sub-drop-menu-style{position:relative;}
	.sub-drop-open-btn-style{display:block; position:relative; padding:0 1.5rem; height:4.5rem; line-height:4.5rem; font-size:1.5rem; background-color:#000; box-sizing:border-box; border-radius:1rem; z-index:12;}
	.sub-drop-open-btn-style span{color:#fff; }
	.sub-drop-open-btn-style .arrow{color:#fff; position:absolute; top:50%; right:1.5rem; margin-top:-0.7rem}
	.sub-drop-open-btn-style.open .arrow{transform:rotate(180deg)}
	.sub-drop-menu-style ul{display:none; margin:0; height:auto; position:absolute; top:calc(100% - 1rem); left:0px; right:0px; background-color:#fff; border:1px solid #000; border-top:0; z-index:11; box-sizing:border-box; padding-top:1rem; border-radius:0 0 1rem 1rem;}
	.sub-drop-menu-style ul li{position:static; display:block; float:none; border:0; border-top:1px solid #eee; width:auto; background-color:transparent}
	.sub-drop-menu-style ul li:first-child{border-top:0; border-left:0}
	.sub-drop-menu-style ul li a{display:block; width:auto; height:auto; padding:1rem 1.5rem; border:0;}
	.sub-drop-menu-style ul li a em{font-size:1.5rem;}
	.sub-drop-menu-style ul li.selected{background-color:transparent;}
	.sub-drop-menu-style ul li.selected a em{color:var(--main-color); font-weight:600; }
}
@media all and (max-width:480px){
	/* Tab Fixed Move*/	
	.sub-tab-list-style.top-fixed{top:60px;}
}


/* ******************  사업실적 ********************** */
@media all and ( max-width: 800px ) {
	.copy-link{display: none;}
	.business-page {padding-bottom:13rem;}
}


@media all and (max-width:1580px){
	#business-nav-box {max-height:72rem;}
}

@media all and (max-width:1280px){
	/* #business-nav-box-wrapper:after {max-width:23.7rem; right: 5.4rem;} */
	#business-contents {min-height:52rem;}
	#business-nav-box {max-height:57rem;}
	#business-nav-box .nav-list li {max-width:24rem; position: relative;}
	.business-top .txt-box {flex-direction:column;}
	.business-top .txt-box .sub-txt{font-size:2.2rem;}
	.performance-type-box {width:100%; align-self: flex-start; margin-top: 3rem;}
	.performance-type-box ul{width:100%;}
	.performance-type-box ul li{width:50%;}
	.performance-type-box ul li a{height:5.5rem; padding:0 1.5rem;}
	.performance-type-box ul li a em{font-size:1.8rem;}
}

@media all and (max-width:800px){
	.performance-box {flex-direction:column-reverse; padding: 0 3rem;}
	#business-nav-box-wrapper {width: 100%;}
	#business-nav-box-wrapper:after {display:none;}
	#business-nav-box {width: 100%; overflow:initial; margin-right: 0;}
	#business-nav-box .sub-tab-wrapper-style {height: 45px; padding-right: 0;}
	#business-nav-box .sub-drop-open-btn-style {height: 45px; line-height:45px; border-radius:1rem; background:#000; z-index:12;}
	#business-contents {width: 100%; margin-right: 0; margin: 3rem 0 0;}
	#business-nav-box .sub-tab-list-style ul {max-height:25rem; overflow-y:scroll; border:1px solid #000; border-top:0; border-radius:0 0 1rem 1rem; top: calc(100% - 1rem); padding-top:1rem; padding-bottom:0;}
	#business-nav-box .nav-list li {max-width:none; border-radius:0; margin-top:0; border-top:1px solid #eee;}
	#business-nav-box .nav-list li:first-child{border-top:0;}
	#business-nav-box .nav-list li a{height:4rem;}
	#business-nav-box .nav-list li .num{line-height:0.9;}
	#business-nav-box .nav-list li.selected{background:#fff;}
	#business-nav-box .nav-list li.selected em{color:var(--main-color);}

	.performance-conuter .first-num {font-size:2rem;}
	#business-contents {min-height:45rem;}
	.detail-pop-btn {width: 7rem; height: 7rem; font-size:2.2rem;}
}

@media all and (max-width:640px){
	.performance-box{padding:0 3rem 3rem;}
	#business-contents {min-height:auto;}
}


/* ******************  사업분야 ********************** */
@media all and (max-width:800px){
	.cm-sytem-img-wrapper.col-3 .cm-sytem-img-box {width: 100%; margin-right: 0;}
}

@media all and (max-width:800px){
	.parking-pop-content {width: auto; margin: 50px 15px; max-width:none;}
	.parking-pop-inner {padding: 6rem 4rem;}
	.parking-pop-content.partner .parking-pop-inner {padding: 6rem 4rem;}
}

@media all and (max-width:1280px){
	.field-page.parking .field-con.point02 .txt-box {padding: 0 7rem; box-sizing: border-box;}
	.field-page.parking .field-con.point02 .txt-box:after {width: 70%; height: 7.5rem; background-size:100%;}
	.field-page.parking .field-con.point03 .inner-box {padding: 0 4rem;}

	.list-arrow-wrap .slick-prev {margin-left: -2rem;}
	.list-arrow-wrap .slick-next {margin-right: -2rem;}
}

@media all and (max-width:800px){
	.deco-img-box {margin: 5rem 0 2rem;}
	.field-intro-top {padding-bottom:7rem;}
	.field-con.point01 {padding-top: 7rem;}
	.field-system-list {margin-top: -4rem;}
	.field-system-list li {width: 100%; margin-right: 0; margin-top: 2rem;}
	.field-list-box ul > li .img-box img {width: 100%;}
	.intro-img-box.flex {flex-wrap:wrap;}
	.field-page.parking .field-con.point02 {margin-top: 7.5rem;}
	.field-page.parking .field-con.point02 > div {width: 100%;}
	.field-page.parking .field-con.point02 .txt-box {padding: 7rem 7rem 11rem;}
	.field-page.parking .field-con.point02 .txt-box:after {height: 6rem;}
	.field-page.parking .field-con.point03 {flex-direction:column-reverse;}
	.field-page.parking .field-con.point03 > div {width: 100%;}
	.field-page.parking .field-con.point03 .inner-box {        padding: 8rem 3rem 0;}
	.field-btn-wrap a {width: auto; padding: 0 2rem;}
	.field-btn-wrap a i {margin-left: 3rem;}
	.intro-img-box.flex .img-box {width: 100%; margin-right: 0;}
	.intro-img-box.flex .img-box:last-of-type {margin-top: 2rem;}
	.field-con.flex {flex-wrap:wrap;}
	.field-page.parking .field-con.point04 {padding: 8.25rem 0 7.5rem;}
	.management-system-box {padding: 4.5rem 3rem; flex-direction: column; justify-content: center; align-items: center;}
	.management-system-box .left-img-box {width: 100%;}
	.management-system-box .arrow {margin: 5rem 0;}	
	.management-system-box .arrow .inner-arrow i {transform: rotate(90deg); margin-left: -2px;}
	.system-inner-box {margin-top: 2rem; width: 70%;}
	.system-inner-box .list {margin: 5.9rem auto 3rem;}
	.field-page.parking .field-con.point05 {padding: 15rem 0;}
}

@media all and (max-width:640px){
	.list-arrow-wrap .slick-prev {margin-left: -3rem;}
	.list-arrow-wrap .slick-next {margin-right: -3rem;}
	.system-inner-box {width: 90%;}
}

@media all and (max-width:480px){
	.list-arrow-wrap .slick-prev {margin-left: 0; left: 0;}
	.list-arrow-wrap .slick-next {margin-right: 0; right: 0;}
	.pop-partner-list .logo-box {padding: 2.35rem 1rem;}
}


@media all and (max-width:800px){
	.field-page.video .field-con {padding-top: 7rem;}
	.field-page.video .field-con.point05 .cm-sytem-img-box {padding: 5rem 3rem;}
	.field-page.video .field-con.point06 .cm-sytem-img-box {padding: 5.5rem 3rem 5rem;}
	.cm-sytem-img-wrapper {flex-wrap:wrap;}
	.cm-sytem-img-wrapper .cm-sytem-img-box {width: 100%; margin-right: 0;}
	.cm-sytem-img-box {padding: 4rem 3rem;}
	.cm-sytem-img-box > ul {flex-wrap:wrap;}
	.cm-sytem-img-box > ul li {width: 100%; margin-right: 0; margin-top: 3rem;}
	.cm-sytem-img-box > ul li:first-of-type {margin-top: 0;}
	.system-img-tit {margin-top: 1rem;}
	.field-page.video .cm-sytem-img-box {margin-top: 2rem;}
	.field-page.video .field-con.point03 .cm-sytem-img-box, .field-page.video .field-con.point04 .cm-sytem-img-box {padding: 4.5rem 3rem 3.2rem;}
}

@media all and (max-width:500px){
	.field-page.video .field-con.point05 .custom-scrollbar-wrapper .scroll-object {width: 500px;}
}


/* ******************  Product ********************** */
@media all and (max-width:1280px){
	.prd-view-top .left-con {width: 45%;}
	.prd-view-top .right-con {width: 55%;}
}

@media all and (max-width:800px){
	.prd-view-page {padding-bottom:13rem;}
	.prd-view-top {flex-wrap:wrap;}
	.prd-view-top .left-con {width: 100%;}
	.prd-view-top .right-con {width: 100%; margin-top: 5rem;}
	.prd-view-con {flex-wrap:wrap;}
	.prd-view-tit {width: 100%;}
	.prd-view-txt {width: 100%; margin-top: 3rem;}
	.photo-nav-list li {height: auto; padding: 3rem 0;}
}

@media all and (max-width:480px){
	.prd-view-tb td:first-of-type {width: 35%;}
}

/* ******************  자료실  ********************** */
@media all and (max-width:800px){
	.data-page {padding-bottom:13rem;}
	.data-top-con {flex-direction: column;}
	.data-top-con .bbs-top-list-box .board-search-box {margin-top: 2rem; margin-bottom: 0;}
	.download-item {flex-wrap:wrap; padding: 2rem 0;}
	.download-item .num {width: 4rem;}
	.download-btn {width: 100%; margin-top: 2.5rem;}
}


/* ******************  고객지원  ********************** */
@media all and (max-width:1280px){
	.as-page .inquiry-style09 .inquiry-txt-con {padding-right: 0;}
	.as-page .bbs-write-tbl .cm-form-fieldset-box {max-width:initial;}
	.as-page .phone-fieldset .fakeform-selectbox {max-width: calc(33.33% - 20px) !important;}
	.as-page .email-fieldset .fakeform-selectbox {    max-width: calc(50% - 30px) !important;}
}

@media all and (max-width:800px){
	.inquiry-contents {top: 0;}
	.as-page .inquiry-style09 {flex-wrap:wrap;}
	.as-page .inquiry-style09 .inquiry-txt-con {width: 100%; margin-bottom: 3rem;}
	.as-page .inquiry-style09 .bbs-write-con {width: 100%; padding-left: 0;}
}
/* faq */
@media all and (max-width:800px){
	.faq-page {padding-bottom:13rem;}
}