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


/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
@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:-15px; cursor:move}
	.custom-scrollbar-wrapper .scroll-object{max-width:none; width:800px; }
	.custom-scrollbar-cover{display:block; position:absolute; top:0px; left:0px; right:0px; bottom:0px; background-color:rgba(0,0,0,0.5)}
	.custom-scrollbar-cover .scroll-cover-txt{position:absolute; top:50%; left:0; width:100%; text-align:center; color:#fff; font-size:300; font-size:15px;}
	.custom-scrollbar-cover .scroll-cover-txt i{font-size:30px; display:block; margin-bottom:20px; }
}

/* -------- 공통 :: 탭 -------- */
@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:40px; }
	.sub-tab-list-style ul li a em{font-size:13px}
	/* Tab Fixed Move*/
	/* Mobile Tab Drop Menu */
	.sub-drop-menu-style{position:relative;}
	.sub-drop-open-btn-style{display:block; position:relative; padding:0 15px; height:40px; line-height:40px; font-size:15px; background-color:#333; box-sizing:border-box;}
	.sub-drop-open-btn-style span{color:#fff; }
	.sub-drop-open-btn-style .arrow{color:#fff; position:absolute; top:50%; right:15px; margin-top:-7px}
	.sub-drop-open-btn-style.open .arrow{transform:rotate(180deg)}
	.sub-drop-menu-style ul{display:none; margin:0; height:auto; position:absolute; top:100%; left:0px; right:0px; background-color:#fff; border:1px solid #ddd; border-top:0; z-index:11; box-sizing:border-box;}
	.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:10px 15px; border:0;}
	.sub-drop-menu-style ul li a em{font-size:13px;}
	.sub-drop-menu-style ul li.selected a{background-color:transparent;}
	.sub-drop-menu-style ul li.selected a em{color:#f57f20; 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:1024px){
	.business-page{margin-top: -40px;}
	/* 배경 세계지도 */
	.business-con01-bg{left: 0; margin-left: 0; width: 100%; height: 690px; -webkit-background-size: contain; background-size: contain;}
	/* 동그란 dashed 영역 */
	.business-cir,
	.business-cir-link{transform: scale(0.9);}
	/* 탭 컨텐츠 */
	.business-con02{margin-top: -40px; padding-top: 0;}
}
@media all and (max-width:900px){
	.business-page{margin-top: -80px;}
	/* 동그란 dashed 영역 */
	.business-cir,
	.business-cir-link{transform: scale(0.8);}
	/* 탭 컨텐츠 */
	.business-con02{margin-top: -80px;}
}
@media all and (max-width:800px){
	.business-page{margin-top: 0;}
	.business-con01 .area{height: 350px;}
	/* 배경 세계지도 */
	.business-con01-bg{height: 350px; display: none;}
	/* 공통 */
	.business-cir,
	.business-cir-link{transform: scale(1.0);}
	/* 동그란 dashed 영역 */
	.business-cir{top: 20px; width: 280px; height: 280px; opacity: 0.25;}
	.business-cir:before{margin-top: -125px; margin-left: -125px; width: 250px; height: 250px; display: none;}
	.business-cir:after{margin-top: -100px; margin-left: -100px; width: 200px; height: 200px;}
	/* 가운데 로고 영역 */
	.business-cir-logo{margin-top: -70px; margin-left: -70px; width: 140px; height: 140px;}
	/* 각 링크 영역 */
	.business-cir-link{position: absolute; width: 100%; height: auto; top: 50%; left: 0; padding: 0 15px; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transform: scale(1.0) translateY(-50%); transform: scale(1.0) translateY(-50%);}
	.business-cir-link-list{margin: -10px 0;}
	.business-cir-link-item{width: calc(50% - 60px); margin: 10px 10px 10px 50px; position: relative; float: left;}
	.business-cir-link-list .business-cir-link-item:nth-child(2n+1){clear: both;}
	.business-cir-link-item a{width: 100%;}
	.business-cir-link-item a.ta-c{text-align: left;}
	.business-cir-link-item a.ta-r{text-align: left;}
	.business-cir-link-item a .dot{width: 20px; height: 20px;}
	.business-cir-link-item a .dot:before{position: absolute; top: 50%; left: 50%; margin-top: -5px; margin-left: -5px; display: block; content: ''; width: 4px; height: 4px; border: 3px solid #004597; background-color: #fff; -webkit-border-radius: 100%; border-radius: 100%;}
	.business-cir-link-item a .dot:after{position: absolute; top: 50%; left: 50%; margin-top: -21px; margin-left: -21px; display: block; content: ''; width: 40px; height: 40px; border: 1px solid #e8e8e8; -webkit-border-radius: 100%; border-radius: 100%; opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s;}
	.business-cir-link-item a h5{font-size: 17px;}
	.business-cir-link-item a p{margin-top: 5px; font-size: 13px;}
	/* selected */
	.business-cir-link-item.selected a h5{font-weight: 600; color: #004597;}
	.business-cir-link-item.selected a .dot:after{opacity: 1;}
	/* 각 item css */
	.business-cir-link-item.item01{top: 0; left: 0; margin-left: 50px;}
	.business-cir-link-item.item02{top: 0; left: 0;}
	.business-cir-link-item.item03{top: 0; right: 0;}
	.business-cir-link-item.item04{top: 0; left: 0;}
	.business-cir-link-item.item05{top: 0; right: 0;}
	.business-cir-link-item.item01 a .dot,
	.business-cir-link-item.item02 a .dot,
	.business-cir-link-item.item03 a .dot,
	.business-cir-link-item.item04 a .dot,
	.business-cir-link-item.item05 a .dot{top: -2px; margin-top: 0; bottom: auto; left: -40px; margin-left: 0;}
}

/* 탭 컨텐츠 */
@media all and (max-width:1024px){
	.business-process-list{margin: -12.5px -25px;}
	.business-process-item, #tabCon02 .business-process-item{width: calc(50% - 50px); margin: 12.5px 25px;}
	.business-process-list .business-process-item:nth-child(3):before{display: none;}

	.business-bottom-item:before{top: 80px;}
	.business-bottom-item:after{top: 78px;}
	.business-bottom-item img{height: 50px;}
	.business-bottom-item p{margin-top: 50px; font-size: 16px;}
}
@media all and (max-width:800px){
	/* 탭 컨텐츠 */
	.business-con02{margin-top: 0; padding-top: 20px;}

	.business-tab-tit h5{font-size: 18px;}
	.business-tab-tit p{margin-top: 10px; font-size: 27px;}

	.business-tab-info{margin-top: 25px; padding-bottom: 35px;}
	.business-tab-info:before{top: 100px;}
	.business-tab-bnr > div{width: 100%; height: auto; float: none;}
	.business-tab-bnr-left{padding: 30px 4.5%; height: auto; display: block;}
	.business-tab-bnr-left .top{margin-bottom: 15px;}
	.business-tab-bnr-left .top img{height: 80px;}
	.business-tab-bnr-left .top h5{margin-left: 15px; font-size: 21px;}
	.business-tab-bnr-left p{padding: 0 4px; font-size: 15px;}
	.business-tab-bnr-right{position: relative; height: 0; padding-top: 61.63%;}
	.business-tab-item{padding-top: 30px;}
	.cm-business-tit{margin-bottom: 15px; padding-left: 15px; font-size: 20px;}
	.cm-business-tit:before{width: 9px; height: 18px;}
	
	.dot-txt-group ul{margin: -7.5px 0;}
	.dot-txt-group ul li{width: 100%; margin: 7.5px 0%;}
	.dot-txt-group ul li h5{margin-bottom: 7px; padding-left: 17px; font-size: 14px;}
	.dot-txt-group ul li h5:before{top: -1px;}
	.dot-txt-group ul li p{padding-left: 17px; font-size: 13px;}
	.dot-txt-group ul li p + h5{margin-top: 15px;}

	.business-process-tit{margin-top: -2px; font-size: 14px; line-height: 1.5;}
	.business-process{padding-top: 15px;}
	.business-process-list{margin: -20px 0;}
	.business-process-item, #tabCon02 .business-process-item{width: 100%; margin: 20px 0; padding: 20px 20px 25px;}
	.business-process-item:before{top: -30.5px; margin-top: 0; left: 50%; margin-left: -10px; width: 20px; height: 19px; -webkit-transform: rotate(90deg); transform: rotate(90deg);}
	.business-process-list .business-process-item:nth-child(3):before{display: block;}
	.business-process-item b{font-size: 18px;}
	.business-process-item h5{margin-top: 12px; font-size: 16px;}
	.business-process-item p{margin-top: 8px; padding-left: 8px; font-size: 13px;}

	.business-partners-list ul{margin:0 -1%;}
	.business-partners-list li {margin: 0 1% 2%; width: 48%; max-width: none;}
	.business-partners-list li > div {padding:5px;}
	.business-partners-list .partners-img-box {height:50px;}
	.business-partners-list .partner-name{height:30px; font-size:13px;}

	.business-tab-bottom{padding: 40px 0 50px;}
	.business-bottom-wrapper{padding-top: 15px;}
	.business-bottom-list{margin: -20px 0;}
	.business-bottom-item{margin: 20px 0; width: 33.33%;}
	.business-bottom-item:before{top: 48px;}
	.business-bottom-list .business-bottom-item:nth-child(4):before{display: none;}
	.business-bottom-item:after{top: 46px; margin-left: -2px; width: 4px; height: 4px;}
	.business-bottom-item img{height: 30px;}
	.business-bottom-item p{margin-top: 33px; font-size: 14px;}
}