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


/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
@media all and (max-width:1280px){
	.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:1560px){
	.ethical-content .sub-tab-wrapper-style{padding:0 var(--area-padding);}
}
@media all and (max-width:1280px){
	.ethical-content .sub-tab-wrapper-style{margin-bottom: 5rem;}
	.sub-tab-list-style .area{padding:0}
	/* Tab Fixed Move*/
	.sub-tab-list-style.top-fixed{top:80px;}
}
@media all and ( max-width: 800px ){
	.ethical-content .sub-tab-wrapper-style{height:auto; margin-bottom: 5rem;}
	.ethical-content .sub-tab-list-style ul{margin: -0.3rem; height:auto;}
	.ethical-content .sub-tab-list-style ul li{margin: 0.3rem; width: calc(50% - 0.6rem); max-width: none;}
	.ethical-content .sub-tab-list-style ul li a{height: 45px;}
	/* 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{background-color:transparent; border-color: #eee;}
	.sub-drop-menu-style ul li.selected a em{color:#f57f20; font-weight:600; }
}
@media all and (max-width:480px){
	.sub-tab-list-style ul li {width: calc(33.333% - 0.6rem);}
	/* Tab Fixed Move*/	
	.sub-tab-list-style.top-fixed{top:60px;}
}

/* -------- 공통 :: 레이아웃 -------- */
@media all and (max-width:800px){
	.sub-flex-con {flex-wrap: wrap;}
	.sub-flex-con .left-con {width: 100%; padding-right: 0;}
	.sub-flex-con .right-con {width: 100%; padding-top: 2rem;}
	.sub-flex-con .con-tit {font-size: 2.8rem;}
}

/* ******************  01. 회사소개 ********************** */
/* -------- 공통 -------- */
@media all and (max-width:800px){
	.cm-container {display: block;}
	.cm-tit-box {width: 100% !important; padding-right: 0;}
	.cm-content-wrap {width: 100% !important; margin-top: 3rem;}
}

/* -------- CEO 인사말 -------- */
@media all and (max-width:1280px){
	.ceo-top-con .top-txt {font-size: 3.5rem;}
	.ceo-top-con .txt-box {padding-top: 9.5rem;}
	.ceo-bt-con .sign-box figure {margin-left: 3rem;}
	.ceo-bt-con .sign-box figure img {max-width:75%;}
}

@media all and (max-width:800px){
	/* .ceo-top-con .inner {flex-direction: column-reverse;} */
	.greeting-page {padding-bottom: 7.5rem;}
	.ceo-top-con .inner {align-items: flex-end;}
	.ceo-top-con .txt-box {width: 62%; padding: 0 5% 8.5% 0;}
	.ceo-top-con .img-box {margin-right: 0; width: 38%;}
	.ceo-top-con .top-tit {font-size: 1.8rem;}
	.ceo-top-con .top-txt {font-size: 2.6rem;}

	.ceo-bt-con {margin-top: 3rem;}
	.ceo-bt-con .inner {display: block;}
	.ceo-bt-con .inner .left-box, .ceo-bt-con .inner .right-box {width: 100%;}
}

@media all and (max-width:640px){
	.ceo-top-con {margin-top: 10rem;}
	.ceo-top-con::before {height: 140%; top: -40%;}
}

@media all and (max-width:480px){
	.ceo-top-con {margin-top: 15rem;}
	.ceo-top-con::before {height: 170%; top: -70%;}
	.ceo-top-con .top-txt {font-size: 2.3rem;}
	.ceo-top-con .txt-box {width: 62%; padding: 0 5% 12% 0;}
}

/* -------- 기업개요 -------- */
/* 경영정신 */
@media all and (max-width:1280px){
	.overview-page {padding-bottom:12rem;}
}
@media all and (max-width:800px){
	.overview-page {padding-bottom: 7.5rem;}
	.overview-page .sub-tab-wrapper-style {margin: 0 var(--area-padding) 6rem;}
	.overview-page .sub-tab-wrapper-style ul li a {padding: 0 1.5rem; box-sizing: border-box;}
	.spirit-content-con {padding-top: 0;}
	.spirit-content-con .spirit-schema-box {margin-bottom: 6.5rem;}
	.spirit-txt-list-box .spirit-txt-list {padding: 3rem 0;}
	.spirit-txt-list-box .spirit-txt-list > p {padding-left: 3rem; width: calc(100% - 12.8rem);}
}

/* 비전 */
@media all and (max-width:800px){
	.vision-content-con {padding-top: 0;}
	.vision-content-con .cm-container:first-child {margin-bottom: 6rem;}
	.vision-content-con .vision-main-txt-box {padding: 4rem 3rem;}
	.vision-content-con .vision-main-txt {font-size: 2.6rem;}
}

/* 핵심가치 */
@media all and (max-width:800px){
	.value-content-con .value-list-box .value-list {padding: 3rem 0;}
	.value-content-con .value-list-box .value-list .tit {font-size: 2.8rem;}
	.value-content-con .value-list-box .value-list .tit > span {font-size: 2rem;}
	.value-content-con .value-list-box .value-list .txt {font-size: 1.6rem;}

	.value-content-con .value-list-box .value-list .icon {width: 9rem; height: 9rem; margin-right: 3rem;}
	.value-content-con .value-list-box .value-list .txt-box {width: calc(100% - 12rem);}
	.value-content-con .value-list-box .value-list .tit {display: block;}
	.value-content-con .value-list-box .value-list .tit > span {display: block; padding-left: 0;}
}

/* -------- 사업장 소개 -------- */
@media all and (max-width:800px){
	.location-page {padding-bottom: 9rem;}
	.location-list-box .contact-list-box .contact-list {display: block;}
	.location-list-box .contact-list-box .contact-list span {padding-right: 0; min-width: auto;}
	.location-list-box .contact-list-box .contact-list p {width: 100%;}
	.location-list-box .contact-list-box .contact-list .block-inner {width: 100%;}

	/* .location-list-box .location-list .img-box {width: 50%;}
	.location-list-box .location-list .info-box {width: 45%; padding-right: 5%;} */
	.location-list-box .root_daum_roughmap .wrap_map {height: 20rem;} 
	/* .location-list-box .location-list .top-box {align-items: flex-end;} */

	.location-list-box .location-list .top-box {flex-direction: column-reverse; align-items: flex-start;}
	.location-list-box .location-list .info-box {width: 100%; padding-right: 0; margin-top: 3rem;}
	.location-list-box .location-list .img-box {width: 100%;}
	.location-list-box .location-list .img-box img {max-width: none; width: 100%;}
	.location-list-box .map-box {margin-top: 3rem;}
	.location-list-box .location-list .info-box > h5 {padding-bottom: 2rem;}
}

/* @media all and (max-width:640px){
} */

/* -------- CI -------- */
@media all and (max-width:1280px){
	.ci-color-list {flex-wrap: wrap;}
	.ci-color-list .color-box {width: 100%;}
}
@media all and (max-width:800px){
	.ci-con01 {padding-bottom: 8rem;}
	.ci-logo-detail-box .ci-2row-detail-list {margin: 0;}
	.ci-logo-detail-box .ci-2row-detail-list li {float: none; width: 100%; margin: 0; margin-bottom: 3rem;}
	.ci-logo-detail-box .ci-2row-detail-list li:last-child {margin-bottom: 0;}
	.ci-con02 {padding: 8rem 0;}
	.ci-color-list {margin-bottom: 7rem;}
	.ci-color-list .color-box dd span {padding: 0 1rem;}
	.ci-slogan-box strong {font-size: 2.6rem;}
}
@media all and (max-width:480px){
	.ci-color-list .color-box dd em {display: none;}
	.ci-color-list .color-box dd span {display: block; padding-left: 0;}
}

/* ****************** 04. 채용정보 ********************** */
@media all and (max-width:1280px){
	/* -------- 인사제도 -------- */
	.welfare-list li {max-width: none;}
	.welfare-list li .icon {width: 100%;}
}
@media all and (max-width:800px){
	/* -------- 인사제도 -------- */
	.recruit-guide-con {padding: 7.5rem 0 8rem;}
	.promotion-system-con:first-of-type {margin-bottom: 4rem;}
	.promotion-system-list li:before {width: 3rem; height: 3rem; line-height: 3rem; left: -2.2rem; margin-top: -1.5rem;}
	.promotion-system-list.executive li {width: calc(33.33% - 1.4rem);}
	.promotion-system-list.executive li:nth-child(4):before {display: none;}
	.promotion-system-list.research li {width: calc(33.33% - 1.2rem);}
	.promotion-system-list.research li:before {left: -2.1rem;}
	.promotion-system-list.research li:nth-child(4):before {display: none;}
	.personnel-con:first-of-type {margin-bottom: 1.5rem;}
	.personnel-con .personnel-item .icon {width: 10rem; height: 10rem;}
	.personnel-con .personnel-item .txt-box {width: calc(100% - 10rem); padding-left: 3rem;}
	.welfare-list {margin: -1.5rem -1rem;}
	.welfare-list li {width: calc(20% - 2rem); margin: 1.5rem 1rem;}

	/* -------- 채용절차 -------- */
	.recruit-process-con {padding: 8rem 0;}
	.recruit-process-tit {font-size: 3.6rem;}
	.recruit-process-list {flex-wrap: wrap; margin: -2.2rem;}
	.recruit-process-list li {width: calc(33.33% - 4.4rem); margin: 2.2rem;}
	.recruit-process-list li:nth-child(4):before {display: none;}
	.recruit-inquiry-con {padding: 7.5rem 0 8rem;}
}
@media all and (max-width:480px){
	/* -------- 인사제도 -------- */
	.promotion-system-list li {padding: 2.6rem 1rem 0.5rem; min-height: 11rem;}
	.welfare-list li {width: calc(33.33% - 2rem); }

}

/* ****************** 05. 윤리경영 ********************** */
/* -------- 임직원 행동지침 -------- */
@media all and (max-width:800px){
	.ethical-page {padding-bottom: 9rem;}
	.ethical-top-banner {border-radius: 0; height: auto;}
	.ethical-top-banner .inner {padding: 6rem 4rem; box-sizing: border-box;}
	.ethical-top-banner .inner .tit {font-size: 2.4rem;}
	.ethical-txt-box {padding: 4rem 0;}
	.ethical-txt-box:first-of-type {padding-top: 4rem; border-top: 1px solid #ddd;}
	.ethical-txt-box .txt01 {  font-size: 2rem;  margin-bottom: 2rem;}
}

/* -------- 신고서 작성 -------- */
@media all and (max-width:1280px){
	.declaration-list li dl dd {width: 100%;}
}
@media all and (max-width:800px){
	.declaration-list {flex-wrap: wrap; margin: -1rem 0;}
	.declaration-list li {width: 100%; margin: 1rem 0; padding: 3rem;}
	.declaration-list li .num {font-size: 3rem;}
	.declaration-con03 {padding-top: 8rem;}
	.declaration-con03 .sub-flex-con .con-tit {padding-top: 0;}
	.declaration-btn-controls {flex-wrap: wrap;}
	.declaration-btn-controls .txt {width: 100%; margin-bottom: 4rem;}
	.declaration-btn-controls .cm-btn-controls {width: 100%;}
}

/* -------- 분쟁광물관리정책 확인 -------- */
@media all and (max-width:1280px){
	.mineral-con01 .mineral-map-box .nation-circle {margin-top: -7.1rem; margin-left: 1.9rem;}
}
@media all and (max-width:800px){
	.mineral-con01 {  padding: 20rem 0 8rem; margin-top: -11rem;}
	.mineral-con01 .mineral-map-box .nation-circle { margin-top: -5.1rem; margin-left: 0.3rem;}
	.mineral-con01 .mineral-map-box .nation-circle .name {top: -3.5rem; font-size: 1.6rem; width: 9rem; margin-left: -4.5rem; height: 3.5rem; line-height: 3.5rem;}
	.mineral-con01 .txt-box {margin-top: -2rem;}
	.mineral-con02 {padding-top: 8rem;}
}
@media all and (max-width:480px){
	.mineral-con01 .mineral-map-box .nation-circle { margin-top: -4rem; margin-left: -0.5rem;}
}

/* -------- 4대실천사항 -------- */
@media all and (max-width:800px){
	.ethical-content .sub-tab-wrapper-style {padding: 0;}
	.ethical-content .sub-tab-list-style ul li a em {font-size: 1.3rem;}

	.practice-con {padding: 3rem 0;}
	.practice-con:first-of-type {padding-top: 0;}
	.practice-con .practice-tit {margin-bottom: 2rem;}
	.practice-tbl th, .practice-tbl td {padding: 1.8rem 1.5rem;}
}

/***** 문의하기 수정 :: 250102 *****/
@media all and (max-width: 800px) {
	.inquiry-page {padding-bottom: 7rem;}
	.inquiry-page .inquiry-style09 .inquiry-txt-con {margin-bottom: 0;}
	.inquiry-page .pro-list {flex-wrap: wrap; gap: 2rem 0; margin-top: 4rem;}
	.inquiry-page .pro-list li {width: 100%; margin-right: 0;}
	.inquiry-page .pro-list.mobile li {margin-top: 0;}
	.inquiry-page .pro-list.mobile li:first-of-type {margin-top: 0;}
	.inquiry-page .pro-list.mobile li .bg {padding: 13rem 0; height: auto;}

	.inquiry-page .pro-img-list {flex-wrap: wrap; margin-top: 4rem;}
	.inquiry-page .pro-img-list li {width: 100%; margin-right: 0; margin-top: 2rem;}
	.inquiry-page .pro-img-list li:first-of-type {margin-top: 0;}
}

@media all and (min-width: 801px) {
	.inquiry-page .pro-list li:hover .bg {transform: scale(1.05);}
}

/********** 250930 유지보수 **********/
/***** gaming display 추가 *****/
@media all and (max-width: 1280px) {
	.core-advan-list .list-item .txt-inner {bottom: -25.7rem; padding: 0 2.5rem;}
	.core-advan-list .list-item .txt-inner .core-advan-list-tit {font-size: 2.8rem;}
	.core-advan-list .list-item .txt-inner .inner-txt-list {min-height: 25.7rem;}
	.core-advan-list .list-item:first-child .txt-inner .core-advan-list-tit {transform: translateX(20%);}
	.core-advan-list .list-item:nth-child(2) .txt-inner .core-advan-list-tit {transform: translateX(5%);}
	.core-advan-list .list-item:last-child .txt-inner .core-advan-list-tit {transform: translateX(20%);}

	.core-advan-list .list-item:hover .txt-inner {bottom: -2rem;}
}

@media all and (max-width: 800px) {
	.product-page .sub-tab-list-style ul li {width: 100%;}
	.product-page .sub-tab-list-style ul li.selected a em br {display: none;}
	.power-control-page .sub-tab-wrapper-style {height: auto;}
	.power-control-page .sub-tab-list-style ul li {width: 100%; margin: 0.3rem;}

	.gaming-display-page .pro-sub-con:not(:nth-child(2)) {margin-top: 8rem;}
	.gaming-display-page .pro-sub-con.area-box:last-child .tit-box {margin-bottom: 2.5rem;}
	.spec-table-wrap {margin-top: 3rem;}
	.pro-sub-con .table-toggle-btn {height: 6rem; padding: 0 2rem;}
	.pro-sub-con .table-toggle-btn span {font-size: 1.8rem;}
	.pro-sub-con .table-toggle-btn i {font-size: 2rem;}
	.spec-table-wrap .custom-scrollbar-wrapper {padding: 0 2rem;}

	.core-advan-list {display: flex; flex-direction: column; align-items: center;}
	.core-advan-list .list-item {width: 100%; max-width: 43.637rem; padding-top: 97.224%;}

	.core-advan-list .list-item .txt-inner {bottom: 2.5rem;}
	.core-advan-list .list-item .txt-inner .core-advan-list-tit {margin-bottom: 2rem; text-align: left; transform: translateX(0) !important;}
	.core-advan-list .list-item:hover .txt-inner {bottom: 2.5rem;}
	.core-advan-list .list-item .txt-inner .inner-txt-list {min-height: auto;}
	.core-advan-list .list-item .txt-inner .inner-txt-list .txt-list {opacity: 1;}
}