@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; }

	.page-tit{font-size:28px; margin-bottom:30px}

}

/* -------- 공통 :: 탭 -------- */
@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}
	.sub-tab-list-style ul li:after{height:15px; margin-top:-7px}
	/* 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){
	/* 제품리스트*/
	.prd-list-con li a .new-cate{font-size:13px; width:55px; height:55px; line-height:55px; top:10px; left:10px}
}
@media all and (max-width:960px){	
	/* 제품뷰페이지*/
	/* 상단 */
	.prd-view-top{display:block; text-align:center}
	.prd-view-top > div{display:block}
	.prd-view-top .prd-detail{padding:30px 0 0}
	.prd-view-top .prd-img{width:415px; margin:0 auto}
}
@media all and (max-width:800px){
	/* 제품리스트*/
	.prd-page-tit{font-size:25px}
	.prd-list-con{margin-top:20px}
	.prd-list-con li{width:32.533%}
	.prd-list-con li a .prd-txt .tit{font-size:15px}
	.prd-list-con li a .prd-txt .explain{font-size:13px; margin-top:10px}
	.prd-list-con li a .new-cate{font-size:11px; width:45px; height:45px; line-height:45px;}
	/* 검색폼 */
	.prd-search-box select, .prd-search-box input, .prd-search-box button{height:40px}
	.prd-search-box select{padding-left:10px; font-size:13px; width:100px; margin-right:5px}
	.prd-search-box button{width:100px; font-size:13px; padding:0 10px; line-height:42px}
	.prd-search-box button i{font-size:15px; margin-top:-7px; right:10px}
	.prd-search-box input{width:calc(100% - 205px); font-size:13px; padding:0 10px}

	/* 제품뷰페이지*/
	/* 상단 */
	.prd-view-top{margin:40px 0 50px}
	.prd-view-top .prd-img{width:100%; max-width:350px}
	.prd-view-top .prd-detail .prd-name{font-size:30px;}
	.prd-view-top .prd-detail .prd-txt-01{font-size:14px; margin-top:10px}
	.prd-view-top .prd-detail .prd-txt-02{font-size:14px; margin-top:15px}
	.prd-view-top .prd-detail .prd-txt-03{margin-top:20px;}
	.prd-view-top .prd-detail .prd-txt-03 dt, .prd-view-top .prd-detail .prd-txt-03 dd{font-size:14px;}
	.prd-view-top .prd-detail .prd-txt-03 dt{width:70px}
	.prd-view-top .prd-detail .prd-txt-03 dd{max-width:calc(100% - 70px)}
	.prd-view-top .prd-detail .pdf-btn{width:160px; height:40px; line-height:40px; font-size:13px; margin-top:30px}
	.prd-view-top .prd-detail .pdf-btn i{font-size:18px; margin-right:9px}
	/* 하단 :: 설명 */
	.prd-info-con .sub-tab-con{padding:50px 0}
	.prd-info-con .sub-tab-con .prd-info-tit{font-size:20px; margin-bottom:20px}
	.prd-info-con .sub-tab-con .prd-info-tit:after{width:5px; height:5px; right:-10px}
	.prd-info-con .sub-tab-con .prd-info-txt{font-size:13px;}
	.prd-info-con .sub-tab-con .dot-txt li:before{top:9px}
}
@media all and (max-width:480px){
	/* 제품리스트*/
	.prd-list-con li{width:49.2%}
	/* 검색폼 */
	.prd-search-box select, .prd-search-box input, .prd-search-box button{float:none}
	.prd-search-box select{width:100%; background:#eee url("/images/icon/select_arrow_icon.png") no-repeat 96% 50%; margin:0 0 5px}
	.prd-search-box input{display:inline-block; width:calc(100% - 103px); vertical-align:top}
	.prd-search-box button{display:inline-block; vertical-align:top}
}



/* ****************** 회사소개 ********************** */
	/* 기업가치 */
@media all and (max-width:1024px){
	.value-box .value-list li .icon-txt{bottom:0;}
}

@media all and (max-width:800px){
	/* 인사말 */
	.greeting-intro .greeting-intro-title{font-size:21px;}
	.greeting-txt .greeting-explain-tltle{font-size:16px;}
	.greeting-txt .greeting-explain{font-size:13px;}

	.greeting-intro{float:none; width:100%; margin-bottom:30px;}
	.greeting-intro .greeting-img img{width:100%;}
	.greeting-txt{float:none; width:100%; padding-left:0;}
	.greeting-txt:before{width:0;}

	/* 골든부스터 소개 */
	.intro-symbol .symbol-explain .symbol-title{font-size:20px;}
	.intro-symbol .symbol-explain .symbol-txt{font-size:14px;}

	/* 설비현황 */
	.facility-table th, .facility-table td{font-size:13px;}

	/* 찾아오시는길 */
	.location-wrap .location-address .title{font-size:19px;}
	.location-wrap .location-address .address{font-size:13px; left:200px;}

	/* 기업가치 */
	.value-box .value-tit{font-size:20px;}
	.value-box .value-list li .icon-txt{font-size:13px;}
	.value-box .value-txt-list .txt{font-size:14px;}

	.value-wrap{display:block;}
	.value-box{display:block; width:100%; padding:40px 20px; margin-bottom:20px;}
	.value-box .value-list{margin:30px 0; padding-bottom:30px;}
}

@media all and (max-width:640px){
	/* 골든부스터 소개 */
	.intro-wrap{display:block; margin-bottom:30px;}
	.intro-wrap .intro-img-bg{display:block; width:100%; margin-bottom:20px;}
	
	.intro-wrap.system{display:flex; flex-direction:column-reverse;}
	.intro-wrap.system .intro-img-bg{border:1px solid #eee; box-sizing:border-box;}
	.intro-symbol{width:100%;}
	.intro-symbol .symbol-explain{padding:5% 0;}

	/* 설비현황 */
	.facility-table colgroup col:nth-child(1){width:20%;}
	.facility-table colgroup col:nth-child(2){width:35%;}
	.facility-table colgroup col:nth-child(3){width:35%;}
	.facility-table colgroup col:nth-child(4){width:10%;}

	.facility-img-list{margin-bottom:30px;}
	.facility-img-list li{float:none; width:80%; margin:0 auto 20px;}
	.facility-img-list li:last-child{margin-right:auto;}

	/* 찾아오시는길 */
	.location-wrap .location-address{margin-bottom:35px;}
}

@media all and (max-width:480px){
	/* 기업가치 */
	.value-box .value-list li .icon-txt{bottom:-5%;}
}