/** sub visual **/
.b_sv_box{height: 300px; width: 100%; position: relative; overflow: hidden;}
.b_sv_box figure{position: absolute; left: 0; top:0; width: 100%; height: 100%; z-index: -1; transform: scale(1.1); }
.b_sv_box figure.mo_ver{display: none;}
.b_sv_box .b_inner{padding-top: 200px; text-align: left; color: #fff;}
.b_sv_box h2{transform: translateY(30px); opacity: 0;}
.b_sv_box.on figure{transform: scale(1); transition:transform 5s linear;}
.b_sv_box.on h2{transform: translateY(0); opacity: 1; transition:transform .7s, opacity .5s;}

@media screen and (max-width: 720px){
    .b_sv_box{height: 220px; }
    .b_sv_box .b_inner {padding-top: 100px;text-align: center;}
    .b_sv_box figure.pc_ver{display: none;}
    .b_sv_box figure.mo_ver{display: block;}
}



/** sub navigation **/
.b_navi_box{border-bottom: 1px solid #eeeeee; width: 100%; height: 65px; background-color: #fff; position: sticky; top: 100px; z-index: 5; }
.b_navi_box .b_inner{display: flex; justify-content: center; align-items: center; height: 100%; }
.b_navi_box #b_gnb > li > a{display: none;}
.b_navi_box #b_gnb > li .b_sub_menu{display: none;}
.b_navi_box #b_gnb > li.on .b_sub_menu{display: flex; align-items: center; }
.b_navi_box #b_gnb > li.on .b_sub_menu li{padding:0 45px; position: relative;}
.b_navi_box #b_gnb > li.on .b_sub_menu li::after{content: ''; width: 1px; height: 20px; right: 0; top: 50%; transform:translateY(-50%); position: absolute; background-color: #eeeeee;}
.b_navi_box #b_gnb > li.on .b_sub_menu li:last-child::after{display: none;}
.b_navi_box #b_gnb > li.on .b_sub_menu li a{display: block; font-weight: 500; padding: 5px; font-size: 1rem; color: #a4a4a4; word-break: keep-all; text-align: center;text-transform: uppercase;}
.b_navi_box #b_gnb > li.on .b_sub_menu li.sub_on{font-weight: bold; color: #222222;}
.b_navi_box #b_gnb > li.on .b_sub_menu li.sub_on a{ color: #222222;}
@media screen and (max-width: 1080px){
    .b_navi_box{top: 80px;}
}
@media screen and (max-width: 720px){
    .b_navi_box{height: 45px; border-bottom:0; top: 60px;}
    .b_navi_box #b_gnb > li.on .b_sub_menu li {padding: 0 14px;}
    .b_navi_box #b_gnb > li.on .b_sub_menu li::after{display: none;}
    .b_navi_box #b_gnb > li.on .b_sub_menu li a{font-size: 12px; padding: 8px 1px;}

    .b_navi_box #b_gnb > li.on .b_sub_menu li.sub_on a{border-bottom: 1px solid #5477b0;}
}


/** sub section common **/
.b_sub_sec{padding: 150px 0;}
.b_sub_sec .b_tit_box{text-align: center; margin-bottom: 45px;}
.b_sub_sec .b_tit_box span{margin-bottom:15px ; display: block;text-transform: uppercase;}
.commercial_tabs_sec{padding-top: 0; padding-bottom: 0; position: sticky; top: 165px; z-index: 4; background-color: #fff; border-bottom: 1px solid #eeeeee;}
.commercial_tabs_sec .tabs-section{padding: 0;}
.commercial_apply_sec .b_tit_box, .commercial_solution_sec .b_tit_box{text-align: left;}
.commercial_apply_sec .tabs-section{padding:0px;}
.commercial_apply_sec .tabs{justify-content: flex-start;}

@media screen and (max-width: 1080px){
    .b_sub_sec{padding: 100px 5px;}
    .commercial_tabs_sec{padding-bottom: 0; top: 145px;}
}
@media screen and (max-width: 720px){
    .b_sub_sec{padding: 75px 10px;}
    .b_sub_sec .b_tit_box{margin-bottom: 35px;}
    .commercial_tabs_sec{padding-bottom: 0; top: 105px;}
}


/** company > 회사소개 - sec01 **/
.b_sub_01 {padding-top: 200px; padding-bottom: 0;}
.b_sub_01 .b_inner{height: 270px; overflow: hidden;}
.b_sub_01 h3{font-size: 7.5rem; position: relative ; z-index: 3; transform: translateY(280px);}
.b_sub_01 .b_img_box{width: 80%; height: 640px; background: url(/img/sub/company/sec01_bg.jpg) no-repeat center / cover; margin:0 auto; margin-top: -65px; }
.b_sub_01 h3.txt_motion{transform: translateY(0px); transition: transform .6s; }

@media screen and (max-width: 720px){
    .b_sub_01 {padding-top: 75px; }
    .b_sub_01 h3{font-size: 32.5px; transform: translateY(80px);}
    .b_sub_01 .b_inner {height: 80px;}
    .b_sub_01 .b_img_box{height: 250px; margin-top: -26px;}
}


/** company > 회사소개 - sec02 **/
.b_sub_02 .b_tit_box{margin-bottom: 45px;}
.b_sub_02 .b_cont_box p{text-align: center; line-height: 1.8; word-break: keep-all;}
.b_sub_02 .b_ceo_box{text-align: center; margin-top: 30px;}
.b_sub_02 .b_ceo_box span{margin-right: 25px;}
.company_esg_wrap{display: flex; align-items: flex-start; justify-content: center; gap: 40px; margin-top: 90px;}
.company_esg_wrap img{width: 50%; max-width: 600px; display: block; border-radius: 16px;}

@media screen and (max-width: 720px){
    .b_sub_02 .b_tit_box{margin-bottom: 35px;}
    .b_sub_sec .b_tit_box span {margin-bottom: 10px;}
    .b_sub_02 .b_ceo_box{margin-top: 50px;}
    .b_sub_02 .b_ceo_box img{width: 170px;}
    .b_sub_02 .b_ceo_box span {margin-right: 10px;}
    .company_esg_wrap{flex-direction: column; align-items: center; gap: 25px; margin-top: 50px;}
    .company_esg_wrap img{width: 100%; max-width: 400px;}
}


/** company > 회사소개 - sec03 (Vision & Mission) **/
.b_sub_03{background-color: #f9f9f9; }
/** company.php는 b_sub_03 클래스를 History 섹션에도 재사용하고 있어, Location(b_sub_06) 바로 다음에 오는 b_sub_03만 따로 흰색으로 지정 **/
.b_sub_06 + .b_sub_03{background-color: #fff; }
.b_sub_03 .b_tit_box{margin-bottom: 60px;}
.b_sub_03 .b_cont_box{display: flex; align-items: flex-start; flex-wrap: wrap;}
.b_sub_03 .b_cont_box > div{position: relative; width: 50%; aspect-ratio: 9/8; z-index: 3; color: #fff; display: flex; justify-content: space-between; padding:50px 40px; overflow: hidden;}
.b_sub_03 .b_cont_01 {flex-direction: column;}
.b_sub_03 .b_cont_02 {flex-direction: column-reverse; margin-top: 60px;}
.b_sub_03 .b_cont_box .b_bg_box{position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; transition:transform .5s ease;}
.b_sub_03 .b_cont_01 .b_bg_box{background: url(/img/sub/company/sec03_img01.jpg) no-repeat center / cover;}
.b_sub_03 .b_cont_02 .b_bg_box{background: url(/img/sub/company/sec03_img02.jpg) no-repeat center / cover;}
.b_sub_03 .b_cont_box > div:hover .b_bg_box{transform: scale(1.1); transition:transform 2s linear;}

.b_sub_03 .b_cont_01 span{text-align: right;}
.b_sub_03 .b_cont_02 p{text-align: right;}
.b_sub_03 .b_cont_box > div span{word-break: keep-all;}

@media screen and (max-width: 1080px){
    .b_sub_03 .b_cont_box{flex-direction: column; width: 100%; margin: 0 auto; align-items: center;}
    .b_sub_03 .b_cont_box > div{width: 100%; max-width: 500px; padding: 30px;}
    .b_sub_03 .b_cont_01 {margin-right: 20px;}
    .b_sub_03 .b_cont_02 {margin-left: 20px; margin-top: 0; }
}
@media screen and (max-width: 720px){
    .b_sub_03 .b_tit_box {margin-bottom: 45px;}
    .b_sub_03 .b_cont_box > div{padding: 30px;}
    .b_sub_03 .b_cont_box p{font-size: 35px;}
}
@media screen and (max-width: 580px){
    .b_sub_03 .b_cont_box{max-width: 310px; }
    .b_sub_03 .b_cont_box > div{height: 285px; max-width: 285px; padding: 20px;}
    .b_sub_03 .b_cont_01{margin-right: auto;}
    .b_sub_03 .b_cont_02{margin-left: auto;}
}
@media screen and (max-width: 720px){
    .b_sub_03 .b_cont_box .b_bg_box::after{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.35); pointer-events: none;}
}


/** company > 회사소개 - sec04 **/
.b_sub_04 .b_cont_box{text-align: center; }
.b_sub_04 .b_cont_box p{word-break: keep-all;}


/** company > 회사소개 - sec5 **/
.b_sub_05{background: url(/img/sub/company/sec05_bg.jpg) no-repeat center / cover;}
.b_sub_05 .b_tit_box{color: #fff; text-align: left;}
.b_sub_05 .b_tit_box h3{margin-bottom: 30px;letter-spacing: -0.5px;}
.b_sub_05 .b_list_box{display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap;}
.b_sub_05 .b_list_box li{width: 23.5%; background-color: rgba(0,0,0,.2); border:1px solid rgba(82,82,82,.2); padding:25px; position: relative; height: 275px; display: flex; align-items: flex-end;}
.b_sub_05 .b_list_box li figure{position: absolute; right: 25px; top: 25px;}
.b_sub_05 .b_list_box li figure img{display: block; margin-left: auto;}
.b_sub_05 .b_list_box .b_txt_box{color: #fff; }
.b_sub_05 .b_list_box .b_txt_box p{margin-bottom: 20px;}
.b_sub_05 .b_list_box .b_txt_box .b_num{color: #fff; font-size: 4.5rem;}
.b_sub_05 .b_list_box li figure.b_icon_invert img{filter: brightness(0) invert(1);}

@media screen and (max-width: 1280px){
    .b_sub_05 .b_list_box li {width: 23.5%;}
    .b_sub_05 .b_list_box .b_txt_box .b_num{font-size: 5rem;}
}
@media screen and (max-width: 1080px){
    .b_sub_05 .b_list_box li{height: 200px;}
    .b_sub_05 .b_list_box li figure img{height: 40px;}
    .b_sub_05 .b_list_box .b_txt_box .b_num{font-size: 4rem;}
}
@media screen and (max-width: 820px){
    .b_sub_05{background: url(/img/sub/company/sec05_bg_m.jpg) no-repeat center / cover;}
    .b_sub_05 .b_list_box{flex-direction: column; gap:20px}
    .b_sub_05 .b_list_box li {width: 100%; height: 165px; padding:20px;}
    .b_sub_05 .b_tit_box h3 {margin-bottom: 25px;}
    .b_sub_05 .b_list_box .b_txt_box p{margin-bottom: 15px;}
    .b_sub_05 .b_list_box li figure{right: 20px; top: 20px;}
    .b_sub_05 .b_list_box li figure img {height: 33px;}
}


/** company > 회사소개 - sec06 **/
.b_sub_06{background-color: #f9f9f9;}
.b_sub_06 .b_tit_box{text-align: left; margin-bottom: 60px;}
.b_sub_06 .b_map_box {height: 600px; margin-bottom: 60px;border: solid 1px #eee;}
.b_sub_06 .b_map_box iframe{height: 100%; width: 100%;}
.b_sub_06 .b_list_box ul{border-top: 2px solid #222222;}
.b_sub_06 .b_list_box li{padding: 45px 0px; border-bottom: 1px solid #d9d9d9; display: flex; align-items: center;}
.b_sub_06 .b_list_box li > div{display: flex; align-items: center;}
.b_sub_06 .b_list_box .b_list_tit{width: 200px; padding-left: 40px;}
.b_sub_06 .b_list_box .b_list_cont{width: calc(100% - 200px); padding-left: 80px;display: block;}
.b_sub_06 .b_list_box .b_list_cont p{word-break: keep-all;line-height: 1.8}
.b_sub_06 .b_list_box .b_list_tit figure{width: 40px;}

@media screen and (max-width: 1080px){
    .b_sub_06 .b_tit_box{margin-bottom: 40px;}
    .b_sub_06 .b_map_box {height: 400px; margin-bottom: 60px;}
}
@media screen and (max-width: 720px){
    .b_sub_06 .b_tit_box{margin-bottom: 35px;}
    .b_sub_06 .b_map_box {height: 220px; margin-bottom: 60px;}
    .b_sub_06 .b_list_box li {padding: 20px 0px; flex-direction: column; align-items: flex-start;}
    .b_sub_06 .b_list_box .b_list_tit{width: 100%; padding-left: 20px; margin-bottom: 10px;}
    .b_sub_06 .b_list_box .b_list_tit figure{width: 20px;}
    .b_sub_06 .b_list_box li:nth-child(1) .b_list_tit figure img{width: 12px;}
    .b_sub_06 .b_list_box li:nth-child(2) .b_list_tit figure img{width: 13px;}
    .b_sub_06 .b_list_box li:nth-child(3) .b_list_tit figure img{width: 14px;}
    .b_sub_06 .b_list_box .b_list_cont {width: 100%; padding-left: 20px;}
    .b_sub_06 .b_list_box .b_list_cont p{font-size: 11px;}
}



/*커스텀*/

/*technology*/
.b_tit_box p {margin-top:20px;}
.f9_bg {background-color:#f9f9f9}
.center{text-align: center;}
.b_ytb_box { max-width: 1280px; width: 100%; aspect-ratio: 16 / 9; border-radius: 20px;margin-bottom:60px;}
.b_features { display: flex; justify-content: center; gap: 30px; text-align: center;}
.feature_item { width: 28%}
.feature_item p{margin-top: 15px;}
.feature_icon {  max-width: 80px; width:100%; margin-bottom: 30px;}
.solution_grid {display: flex; justify-content: center; gap: 20px; margin: 30px 0;}
.tech02_img_box {margin-top:60px;}
.solution_item { position: relative; max-width: 450px; border-radius: 10px; overflow: hidden; }
.solution_img { width: 100%; height: auto; display: block; transition: transform 0.3s ease;}
.solution_item:hover .solution_img { transform: scale(1.05);}
.solution_text { position: absolute; bottom: 10px; right: 10px; color: #fff; padding: 5px 10px;
				font-weight: bold; text-transform: uppercase; border-radius: 5px;}
.solution_desc { margin-top: 40px;line-height: 1.5; font-weight: 400;}
.solution_desc p + p { margin-top: 12px;}
.tabs-section { padding: 20px;}
.tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;  }
.tab-btn { flex: 0 1 calc(25% - 15px); display: flex; align-items: center; justify-content: space-between; background: #f9f9f9; border: 1px solid #e0e0e0;
    border-radius: 8px; padding: 20px; text-align:right; font-size: 1rem;; font-weight: bold; color: #333; cursor: pointer;
	transition: all 0.3s ease; text-transform: uppercase}
.tab-btn img {max-width:55px;}
.tab-btn.active { background-color: #004a9f; color: white; border-color: #004a9f; }
  
.tab-btn.active img {filter: brightness(0) invert(1)}

/* 상업용 그룹(fluux03/게시판 commercial/fluux04) 공통 상단 3탭: 적용제품/라인업/솔루션 */
.main_tabs { display: flex; gap: 16px; }
.main-tab-btn { flex: 1; display: block; background: #f9f9f9; border: 1px solid #e0e0e0; border-radius: 8px; padding: 18px 20px;
	text-align: center; font-size: 1.05rem; font-weight: bold; color: #333; cursor: pointer; transition: all 0.3s ease;
	text-decoration: none;line-height: 1.5}
.main-tab-btn.active { background-color: #004a9f; color: #fff; border-color: #004a9f; }
@media screen and (max-width: 720px){
	.main_tabs { flex-direction: column; }
}

/* commercial_tabs_sec 는 위 b_navi_box(상업용/가정용/부품) 바와 붙어 보이도록 같은 디자인으로 통일 */
.commercial_tabs_sec .main_tabs{justify-content: center; align-items: center; gap: 0; height: 65px;}
.commercial_tabs_sec .main-tab-btn{flex: none; position: relative; display: block; height: auto; padding: 0 45px;
	background: none; border: none; border-radius: 0; box-shadow: none;
	font-size: 1rem; font-weight: 500; color: #a4a4a4; text-transform: uppercase; line-height: 1;}
.commercial_tabs_sec .main-tab-btn::after{content: ''; width: 1px; height: 20px; right: 0; top: 50%; transform: translateY(-50%); position: absolute; background-color: #eeeeee;}
.commercial_tabs_sec .main-tab-btn:last-child::after{display: none;}
.commercial_tabs_sec .main-tab-btn.active{background: none; color: #222222; border-color: transparent; font-weight: 500;}
@media screen and (max-width: 720px){
	.commercial_tabs_sec .main_tabs{flex-direction: row; height: 45px;}
	.commercial_tabs_sec .main-tab-btn{padding: 0 14px; font-size: 12px;}
	.commercial_tabs_sec .main-tab-btn::after{display: none;}
	.commercial_tabs_sec .main-tab-btn.active{border-bottom: 1px solid #5477b0;}
}

.b_sub_04 .solution_item{border: solid 1px #eeeeee;  border-radius: 10px;}
.b_sub_04 .solution_item p{color:#222;}

  /* Tab Contents Section */
.tab_top_tit { display: flex; align-items: center;  gap: 20px;text-transform: uppercase;text-align: left;}
.tab_top_con { text-align: left; padding: 30px; background-color: #fff;border-radius: 20px; margin-top: 30px;
    		   display: flex; flex-direction: column;  gap: 15px;}

.tab_line { text-align: left; margin-top: 40px; padding-bottom: 20px; border-bottom: solid 2px #1b4689;}
.tab_line h4{margin-bottom: 20px;}
.tab-panel { display: none;  }
.tab-panel.active { display: block; }
.table_tit {   display: flex; justify-content: space-between; margin-bottom: 30px;  align-items: center;}
.tab_table table { border-collapse: collapse;  width: 100%;table-layout: fixed;text-align: center; }
.table_wrap{display: flex;flex-direction: column;gap:100px;margin-top: 90px;}

.tab_table th, .tab_table td { border: 1px solid #ddd;  padding: 15px; word-wrap: break-word; }
.tab_table th { background-color: #dce4ea;
    color: #333;
    font-weight: bold;
    height: 60px;
    font-size: 1.25rem;
    border-bottom: 2px solid #2a5ca1;}
.tab_table td {height: 40px;font-size: 1.125rem;}
  .tab_table tbody tr:nth-child(even) {
    background-color: #f9f9f9; /* 줄마다 배경색 다르게 */
  }
  .tab_table th:first-child, .tab_table td:first-child {
    border-left: none; /* 테이블 왼쪽 외곽선 제거 */
  }
 .tab_table th:last-child, .tab_table td:last-child {
    border-right: none; /* 테이블 오른쪽 외곽선 제거 */
  }

  .tab_table td[rowspan] {
    vertical-align: middle; /* rowspan 셀 가운데 정렬 */
  }
 .tab_table .b_more_btn {
    margin: 0;
    background-color: #1b4689;
    border-radius: 75px;
    height: 45px;
    width: 140px;
    color: #fff;
    transition: background-color 0.3s ease, transform 0.3s ease; /* 부드러운 전환 효과 */
    padding: 10px;
    text-align: center;
    line-height: 25px; /* 텍스트 정렬 */
    cursor: pointer; /* 커서를 포인터로 변경 */
  }

  .tab_table .b_more_btn:hover {
    background-color: #2a5ca1;
  }

@media screen and (max-width: 1080px){
	.tab-btn { flex-basis: calc(50% - 10px);}
	.sol_box_warp{grid-template-columns: repeat(2, 1fr);}
}

@media screen and (max-width: 720px){
	.solution_grid {flex-direction: column;}
	.tab-btn img { max-width: 40px;}
	.b_features{flex-direction: column;}
	.feature_item{width:100%;}
	.tab-btn { flex-basis: 100%;}

	/* tech02 solution_grid : 모바일에서 세로 stack 대신 스와이프 슬라이드로 전환 */
	.solution_grid.sol_swipe {
		flex-direction: row;
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		margin: 30px 0;
		gap: 12px;
	}
	.solution_grid.sol_swipe::-webkit-scrollbar { display: none; }
	.solution_grid.sol_swipe .solution_item {
		flex: 0 0 85%;
		max-width: none;
		scroll-snap-align: center;
	}
}



/*solution*/

.sol_box_warp { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; row-gap: 90px;}
.sol_box { display: flex; flex-direction: column; gap: 25px; background-color: #fff; padding: 30px;
    border-radius: 15px; box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);}
.sol_box_img_wrap {position: relative; overflow: hidden; border-radius: 15px; }
.sol_box p{flex: 1 1 auto;}
.sol_box img{display: block;   width: 100%;  height: auto;  transition: transform 0.3s ease; }
.sol_box:hover img {
  transform: scale(1.05); /* 호버 시 이미지 확대 */
}
.sol_pro_wrap { border-top: 1px solid #d9d9d9; padding-top: 20px;}
.sol_pro_btn { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; row-gap:12px;}
.sol_pro_btn a{position:relative; font-size:15px; font-weight:600; line-height:1.4; padding-bottom:3px;
	transition: color 0.25s ease; cursor: pointer;}
.sol_pro_btn a:not(:last-child){margin-right:14px; padding-right:14px; border-right:1px solid #d9d9d9;}
.sol_pro_btn a:nth-child(4n+1){color: #1b4689;}
.sol_pro_btn a:nth-child(4n+1):hover{color: #6a8ecf;}
.sol_pro_btn a:nth-child(4n+2){color: #1c6b8a;}
.sol_pro_btn a:nth-child(4n+2):hover{color: #4b9bb8;}
.sol_pro_btn a:nth-child(4n+3){color: #5881c3;}
.sol_pro_btn a:nth-child(4n+3):hover{color: #8fabdc;}
.sol_pro_btn a:nth-child(4n){color: #13305F;}
.sol_pro_btn a:nth-child(4n):hover{color: #45608f;}



@media screen and (max-width: 1080px){	
	.sol_box_warp{grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width:720px){	
	.sol_box_warp{grid-template-columns: repeat(1, 1fr);gap:70px;}
}


/*fluux01*/

.p_0301_1  h3 { font-size: 2.25rem; transform: none;}
.p_0301_1 .b_img_box{margin-top:0px;}
.p_0301_1 h3.txt_motion { transform: none; transition: none;}
.p_0301_1 .b_cont_box {padding-top:30px;width: 94%;margin:0 auto;}
.p_0301_1 .txt_wrap {display: flex; flex-direction: column; gap:15px;}
.fluux_cah_box {display: flex; align-items: center;  justify-content: space-between; gap: 50px;}
.fluux_cah_box img{max-width:680px;width:50%;flex-shrink:0;border-radius: 15px;}
.fluux_cah_box > div{flex:1; min-width:0;}
.fluux_cah_box p{text-align: left!important;margin-top:20px;line-height: 1.6!important;}
.fluux_cah_wrap { display: flex; flex-direction: column;  gap: 120px; max-width: 1410px; margin: 0 auto;}
.fluux_cah_wrap .fluux_cah_box:nth-of-type(2) {flex-direction: row-reverse;}

.fc_b {color:#1C478A;display: inline!important}


@media screen and (max-width: 1080px){
	.fluux_cah_wrap{gap:60px;}
	.fluux_cah_box {flex-direction: column;text-align: center;gap:40px;}
	.fluux_cah_wrap .fluux_cah_box:nth-of-type(2) {flex-direction: column;}
	.fluux_cah_box img{width:100%;}
	.fluux_cah_box p{text-align: center!important}
}

/*fluux01 - 산업용·상업용·가정용 정수 솔루션*/
.p_0301_3{background-color:#fff;border-radius:20px;padding:60px 40px;margin:0 auto 80px;border-bottom: 1px solid #d9d9d9;}
.p_0301_3 .b_tit_box p{;margin-left:auto;margin-right:auto;}
.p_0301_3 .fluux_bis_box{max-width:445px;background-color:#f9f9f9;}
.p_0301_3 .fluux_bis_box:nth-child(even){background-color:#f9f9f9;}
.fluux_info_list{margin-top:20px;}
.fluux_info_list li{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #e2e2e2;}
.fluux_info_list li:last-child{border-bottom:none;}
.fluux_info_list li span:first-child{color:#1C478A;}
.fluux_product_list{margin-top:20px;}
.fluux_product_list li{position:relative;padding-left:16px;line-height:1.6;margin-bottom:10px;}
.fluux_product_list li:last-child{margin-bottom:0;}
.fluux_product_list li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background-color:#1C478A;}

@media screen and (max-width: 720px){
	.p_0301_3{padding:40px 20px;margin-bottom:50px;}
	.fluux_info_list li{padding:12px 0;}
}

/*fluux02*/
.fluux_bis_wrap {display: flex;justify-content: center; gap: 40px;}
.fluux_bis_box {max-width: 480px; width: 100%; background-color: #f2f7ff; padding: 30px; border-radius: 15px; text-align: left;}
.fluux_bis_box p{margin-top:20px;}
.fluux_bis_box:nth-child(even){background-color:#f9f9f9}
.p_0302_3 .fluux_bis_box {max-width: 480px; width: 100%; background-color: #fff; padding: 30px; border-radius: 15px; text-align: left;}
.fluux_bis_box img{width: 100%;max-width: 90px;margin-bottom: 60px;}

.p_0203_1 img {width:100%;max-width:1400px;margin-top: 15px;}
.partner_logo_list { display: grid; grid-template-columns: repeat(7, 1fr); gap: 20px; list-style: none;  padding: 0; margin: 0;}
.partner_logo_list li img { width: 100%; max-width: 210px; height: auto; display: block;  margin: 0 auto;  border: solid 1px #d9d9d9;  padding: 5px;}
.partner_logo_list li  {background-color: #fff;}

@media screen and (max-width: 920px){
	.p_0203_1 img{width:100%;max-width:320px;margin:15px auto}
}

@media screen and (max-width: 720px){
	.partner_logo_list { display: grid; grid-template-columns: repeat(3, 1fr);}
	.fluux_bis_box img{width: 100%;max-width: 70px;margin-bottom: 30px;}
}

.biz_area_box{margin-top: 60px;}
.biz_area_grid{display: grid; grid-template-columns: repeat(3, minmax(0, 300px)); justify-content: center; gap: 20px; list-style: none; padding: 0; margin: 0;}
.p_0203_1 .biz_area_grid li img{width: 100%; max-width: none; margin-top: 0; display: block; border-radius: 10px; border:solid 1px #eee; margin-bottom: 12px;}
.biz_area_grid li p{color: #434343; line-height: 1.4;}
.biz_area_list{text-align: center; margin-top: 70px; padding: 45px 0; background-color: #f7f8fa; border-radius: 14px; display: flex; list-style: none;}
.biz_area_list > li{flex: 1; padding: 0 40px; position: relative;}
.biz_area_list > li:not(:last-child)::after{content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 70%; background-color: #dcdfe6;}
.biz_area_list > li p:first-child{color: #1b4689;}
.biz_area_list > li p:last-of-type{color: #8a8f98; margin-top: 10px;}

.carbon_box{text-align: left; margin-top: 90px; padding-top: 60px; border-top: 1px solid #d9d9d9;}
.carbon_head{margin-bottom: 30px;}
.carbon_head span{display: block; margin-bottom: 8px;}
.carbon_tit{letter-spacing: .3px;}
.carbon_img_grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; list-style: none; padding: 0; margin-top: 0;}
.p_0203_1 .carbon_img_grid li img{width: 100%; max-width: none; margin-top: 0; display: block; border-radius: 10px;}
.carbon_cert_box{background-color: #f7f9fc; border-radius: 14px; padding: 34px 40px; margin: 40px 0 25px;}
.carbon_list{list-style: none; display: flex; flex-direction: column; gap: 12px;}
.carbon_list li{position: relative; padding-left: 22px;}
.carbon_list li::before{content: ''; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; border-radius: 50%; background-color: #1b4689;}
.carbon_cert_box .carbon_list{margin-bottom: 20px;}
.carbon_spec{display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding-top: 18px; border-top: 1px dashed #d9d9d9;}
.carbon_spec_item{background-color: #e7ebfa; border-radius: 10px; padding: 14px 18px; color: #333; line-height: 1.5;}
.carbon_spec_item strong{color: #1b4689; font-weight: 600;}

@media screen and (max-width: 720px){
	.biz_area_grid{grid-template-columns: repeat(2, 1fr); gap: 12px;}
	.biz_area_box{margin-top: 40px;}
	.biz_area_list{margin-top: 45px; padding: 10px 0; flex-direction: column;}
	.biz_area_list > li{padding: 20px 24px;}
	.biz_area_list > li:not(:last-child)::after{right: auto; bottom: 0; top: auto; left: 50%; transform: translateX(-50%); width: 60%; height: 1px;}
	.carbon_box{margin-top: 60px; padding-top: 40px;}
	.carbon_img_grid{grid-template-columns: repeat(1, 1fr);}
	.carbon_cert_box{padding: 26px 24px; margin: 30px 0 20px;}
	.carbon_spec{grid-template-columns: repeat(1, 1fr); gap: 8px;}
}

.p_0203_4 .b_cont_box{margin-top: 60px;}
.p_0203_4 .b_cont_box p{text-align: left}
.p_0203_4 .b_cont_box img{width: 100%; max-width: 1200px; margin: 0 auto; }

.process_step_list{text-align: left; margin-top: 30px;}
.process_step_list ul{list-style: none; padding: 0; display: flex;flex-direction: column;}
.process_step_list li{display: flex; align-items: flex-start; gap: 16px; text-align: left;}
.process_step_list .step_num{flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 13px;}
.process_step_list .step_txt p:last-child{color: #666; line-height: 1.6; margin-top: 4px;}
.process_step_list li:nth-child(1) .step_num{background-color: #d9791f;}
.process_step_list li:nth-child(2) .step_num{background-color: #17a189;}
.process_step_list li:nth-child(3) .step_num{background-color: #1c6fb0;}
.process_step_list li:nth-child(4) .step_num{background-color: #f0a416;}
.process_step_list li:nth-child(5) .step_num{background-color: #5b3a8e;}
.process_step_list li:nth-child(6) .step_num{background-color: #8bc53f;}
.process_step_list li:nth-child(7) .step_num{background-color: #1c6e8c;}

@media screen and (max-width: 720px){
	.p_0203_4 .b_cont_box{margin-top: 40px;}
	.process_step_list{padding-top: 40px;border-top: solid #eee 1px;}
	.process_step_list ul{gap: 18px;}
}

.line_img_grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; list-style: none; padding: 0; margin-top: 60px;}
.line_img_grid li img{width: 100%; display: block; border-radius: 10px;  margin-bottom: 15px;border: 1px solid #eee;}
.line_img_grid li p{color: #434343; line-height: 1.4;}

@media screen and (max-width: 1080px){
	.line_img_grid{grid-template-columns: repeat(2, 1fr); row-gap: 50px;}
}

@media screen and (max-width: 720px){
	.line_img_grid{margin-top: 40px; gap: 20px; row-gap: 40px;}
	.line_img_grid li img{margin-bottom: 15px;}
}

.zero_defect_box{margin-top: 60px;}
.zero_defect_tit{display: inline-flex; align-items: center; gap: 15px; padding: 20px 55px; border: 2px solid #5477b0; border-radius: 12px; font-size: 2.25rem; font-weight: 800; letter-spacing: 1px; font-family: 'Pretendard', sans-serif;}
.zero_defect_tit .zd_light{color: #8fb0dd;}
.zero_defect_tit .zd_dark{color: #1b4689;}
.zero_defect_tit .zd_gear{width: 38px; margin-left: 5px;}
.zero_defect_arrow{display: block; font-size: 2.5rem; line-height: 1; color: #5477b0; margin: 15px 0 10px;}
.zero_defect_grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: 45px 30px; list-style: none; padding: 0; margin:0 auto;max-width: 1000px;}
.zd_img_wrap{width: 100%; max-width: 190px; aspect-ratio: 1 / 1; border-radius: 50%; overflow: hidden; margin: 0 auto 15px; border: 1px solid #eee;}
.zd_img_wrap img{width: 100%; height: 100%; object-fit: cover; display: block;}
.zero_defect_grid li p{color: #1b4689; line-height: 1.5;}
.zero_defect_grid li p .fs_16{display: block; color: #777; margin-top: 4px;}

@media screen and (max-width: 1080px){
	.zero_defect_grid{grid-template-columns: repeat(2, 1fr);}
}

@media screen and (max-width: 720px){
	.zero_defect_box{margin-top: 40px;}
	.zero_defect_tit{padding: 15px 30px; font-size: 1.5rem; gap: 10px;}
	.zero_defect_tit .zd_gear{width: 26px;}
	.zero_defect_grid{gap: 35px 20px; margin-top: 20px;}
}

@media screen and (max-width:1080px){
	.fluux_bis_wrap { flex-direction: column;  align-items: center;}
}

.p_0301_2{width: 94%;margin:0 auto;}

.p_0301_1 .b_img_box{width: 80%; height: 640px; margin:0 auto; overflow: hidden; position: relative; background: #f6f6f5;}
.p_0301_1 .b_img_box video{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; display: block; border: none; outline: none;}
.p_0301_2 .b_img_box{width: 80%; height: 640px; background: url(/img/sub/0302/sec01_bg.jpg) no-repeat center / cover; margin:0 auto;}
.tech03_hero_bg .b_img_box{background-image: url(/img/sub/0203/sec01_bg.jpg);}
.p_0204_1 .b_img_box{width: 80%; height: 640px; background: url(/img/sub/0204/sec01_bg.jpg) no-repeat center / cover; margin:0 auto;}

@media screen and (max-width: 720px){
	.p_0301_1 .b_img_box { height: 250px;}
	.p_0301_2 .b_img_box { height: 250px;}
	.p_0204_1 .b_img_box { height: 250px;}
}


/*samsung*/

.samsung_logo {height: 70px; margin:20px 0; position: sticky; top: 0%; background-color: #fff; display: flex; align-items: center; justify-content: flex-start;}
.samsung_back{height: 70px; padding: 20px 15px;position: sticky; top: 0%; background-color: #fff;display: flex; align-items: center;  justify-content: space-between;}
.samsung_back p{font-size: 2.125rem; font-weight: 700;font-family: 'Pretendard', sans-serif;}
.samsung_logo img{width: 100%;max-width:300px;margin-left: 30px;}
.samsung_back img{width: 100%;max-width:30px;}
.samsung_banner{width: 100%;max-width: 1920px!important; height: 400px; background: url(/samsung/img/banner.jpg) no-repeat center / cover; margin:0 auto;
				display: flex; align-items: center; justify-content: center; flex-direction: column;color:#fff;font-family: 'Pretendard', sans-serif;}
.samsung_banner h3{font-size: 2.25rem;font-weight: 700;margin:0}
.samsung_banner p{font-size: 1.125rem;font-weight: 700;margin:20px 0 0}

.samsung_manual_wrap {width:100%; max-width:1400px;margin: 90px auto;display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; row-gap: 90px;}
.samsung_manual_box img{width: 100%;max-width: 380px;border-radius: 15px;border:solid 1px #eee;}
.samsung_manual_box p{font-family: 'Pretendard', sans-serif;font-size: 1.125rem;font-weight: 700;margin:30px 0 0}

.samsung_sub { width: 100%; max-width: 1200px; margin: 0 auto;}
.samsung_sub .samsung_logo img{width: 100%;max-width:400px;margin-left: 0;}
.samsung_sub_img img{width: 100%;max-width: 1200px;}
.samsung_sub_tit {width:100%;max-width: 1200px; margin: 0 auto;}

.samsung_intro { text-align: center;}
.samsung_intro_thum{ width: 100%; max-width: 1200px; border-radius: 30px;}
.samsung_down {text-decoration: none; width: 100%; max-width: 1200px; margin: 30px 0; color: #fff; background: #002b60; padding: 15px 0; border-radius: 100px;
	display: flex;    justify-content: center;    align-items: center;}
.samsung_down span{font-size:1.8rem;font-weight: 500;font-family: 'Pretendard', sans-serif;}
.samsung_down img{margin-right: 20px;width: 100%; max-width: 25px;}



@media screen and (max-width: 1080px){
	.samsung_banner h3{font-size: 2.25rem;}
	.samsung_banner p { font-size: 2.5rem;;}
	.samsung_manual_wrap {width: 90%; grid-template-columns: repeat(2, 1fr);row-gap: 80px;}
	.samsung_sub{width: 95%;}
	.samsung_manual_box p {font-size: 2.125rem;}
	.samsung_logo img { max-width: 160px; margin-left: 10px;}
	
}

@media screen and (max-width: 720px){
	.samsung_manual_wrap {width: 90%; grid-template-columns: repeat(1, 1fr)!important; row-gap: 60px!important;}
	.samsung_banner p { font-size: 1.5rem; }
	
}

/*신기술소개*/
.p_0204 {background:url('/img/sub/0204/mf_main_sec04_bg.jpg') no-repeat center center / cover;height:1700px; width:100%; position: relative;z-index: 0}
img.p0204_map_img { max-width: 500px; margin-top: 30px;}
.main_sec04_content02 { text-align: center; margin-bottom: 40px; position: relative;  z-index: 10;}

.p_0204 h2{margin-top: 30px;}
.p_0204_4 img{width: 100%;max-width: 795px;}
.mf_sec04_warp_position { display: flex; justify-content: center; align-items: center; position:absolute; bottom: 8%; left: 50%; transform: translateX(-50%);}

.mf_sec04_warp { display: flex; justify-content: space-around; flex-wrap: wrap; max-width: 1200px;}

.mf_sec04_box { border: 1px solid #d9d9d9; border-radius: 15px; padding: 35px 20px; width: 45%; background-color: rgba(255, 255, 255, 0.6);
    text-align: center; margin: 10px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);  transition: transform 0.3s ease;  position: relative; z-index: 10;}

.mf_sec04_box:hover { transform: translateY(-10px);}

.mf_sec04_box img { margin-bottom: 15px; width: 50px; height: 50px;}

.mf_sec04_box p { font-weight: 500;}

.p_0204_spec_txt_wrap {  margin-top: 20px;}

.p_0204_5 .b_cont_box p { color: #fff; background-color: #6283b2;  padding: 15px 25px; border-radius: 100px;width: fit-content;margin: 0 auto;margin-bottom: 40px;}
.p_0204_5 img { margin:0 auto;width: 100%;max-width: 956px;  padding-bottom: 50px;}

@media screen and (max-width:768px){
	.p_0204 {background:url('/img/sub/0204/main_sec04_bg_m.jpg') no-repeat center center / cover;height: 845px;}
    .mf_sec04_warp { gap:0.5%; }
    .mf_sec04_warp_position {bottom: 5%; width: 92%; }
    .mf_sec04_box {width: 49%; padding: 20px 0;margin:0 0 10px 0;}
    .main_sec04_content02 {margin-top: 0px;}
    .main_sec04 {height: 1040px;}
}

/*회사연혁*/

.his_tit {margin-top:30px;}
.his_tit p{margin-top:20px;line-height: 1.5;font-weight: 500;}
.his_year_wrap {margin-top:40px;display: flex; gap:20px;flex-wrap: wrap;}
.his_year_box { border: #5477b0 solid 1px; padding: 13px 20px; border-radius: 100px; color: #222; font-weight: 500; text-align: center; width: 150px; 
	transition: background-color 0.3s ease, transform 0.3s ease;}
.his_year_box:hover{background-color: #82a5df;border:#82a5df;color: #fff;}
.his_year_wrap .on{ background-color: #5477b0; padding: 13px 20px; border-radius: 100px; color: #fff;  text-align: center; width: 150px;}

.his_year_img_wrap{display: flex; justify-content: space-around;margin-top: 50px;gap: 30px;}
.his_year_img {position: relative;overflow: hidden; border-radius: 20px;height: 100%;}
.his_year_img_box .on img{filter: grayscale(0);}
.on.his_year_img { border: solid 6px #5477b0;}
.his_year_img_box img {width: 100%;max-width: 360px;filter: grayscale(1) opacity(50%);display: block; transition: transform 0.3s ease-in-out;height: 100%;}
.his_year_img_box:hover .his_year_img img{ transform: scale(1.05);filter: grayscale(0)}
.his_txt { position: absolute; bottom: 10px; right: 10px; color: #fff;  padding: 5px 10px;  font-weight: bold;  text-transform: uppercase;  border-radius: 5px;}

@media screen and (max-width:768px){
	.his_year_img_wrap{display: grid; grid-template-columns: repeat(2, 1fr);gap: 15px;}
	.his_year_img{border-radius:10px;}
	.on.his_year_img { border: solid 3px #5477b0;}
}


/*esg*/

.loading {width: 200px;margin: 0 auto;padding-bottom: 50px;}
.center-lo { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width: 400px; margin:0 auto 40px;}
.loging {display: flex; justify-content: space-between; width: 180px;height: 100px; position: relative;}
.loging div { background: #5477b0; width: 20px; height: 20px; border-radius: 50%; animation: loding 2s infinite;}

#load1 { animation-delay: 0s;}
#load2 {animation-delay: 0.2s;}
#load3 { animation-delay: 0.4s;}
#load4 { animation-delay: 0.6s;}
#load5 { animation-delay: 0.8s;}

@keyframes loding {
  0% { transform: translateY(0); background: #5477b0;  }
  50% { transform: translateY(70px); background: #54B0AE; opacity: 0.5; }
  100% { transform: translateY(0); opacity: 1; }
}

/*03수정*/

.table_wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 90px;}
.product-card { display: flex; flex-direction: column; align-items: center; text-align: center; background: #fff; border-radius: 10px; padding: 25px;gap:20px;   box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); transition: transform 0.2s ease-in-out;}

.product-card:hover { transform: scale(1.02);}


.product-title { width: 100%; padding-bottom: 25px; border-bottom: solid 1px #d9d9d9;}

.product-image img { max-width: 300px; height: auto;border-radius: 15px;width: 100%;}

.view-more-btn {display: inline-block;background: #003366; color: #fff; padding: 10px 20px; border-radius: 20px; font-weight: bold;
	margin-top: 10px; transition: background-color 0.3s ease, transform 0.3s ease;}
.view-more-btn:hover { background-color: #2a5ca1;  }

.product_label{ background-color: #eee; width: fit-content; padding: 6px 10px; color: #2a5ca1; border-radius: 25px; margin-bottom: 10px;text-transform: uppercase;}
.tab_top p {line-height: 1.5;}

@media screen and (max-width:1080px){
	.table_wrap { grid-template-columns: repeat(2, 1fr); gap: 24px; }
	.product-card:hover { transform: scale(1.00);}
	.product_label{margin: 0 auto 10px;}
}

@media screen and (max-width:720px){
	.table_wrap { grid-template-columns: 1fr; gap: 20px; }
}

/*samsung_수정*/

@media screen and (max-width: 720px){
	.samsung_manual_wrap {width: 90%; grid-template-columns: repeat(3, 1fr)!important; column-gap: 20px;row-gap:30px!important; margin: 50px auto;}
	.samsung_manual_wrap:last-of-type  {margin:30px auto!important}
	.samsung_banner p { font-size: 1.5rem; }
	.samsung_manual_box img {border-radius: 5px;}
	.samsung_manual_box p { font-size: 1.125rem;margin: 20px 0 0; }
	.samsung_banner{height: 200px;}
	.samsung_logo{margin:0}

}

/* ESG page */
.esg_intro_sec { padding-bottom: 90px; }
.esg_content_sec { padding-top: 100px; }
.tab-btn.disabled, .tab-btn:disabled { cursor: not-allowed; color: #bbb; background: #f2f2f2; border-color: #eee; }
.tab-btn.disabled:hover, .tab-btn:disabled:hover { background: #f2f2f2; }
.esg-tabs .tab-btn { justify-content: center; }
.esg-tabs .tab-btn:hover { background-color: #e6edf5; border-color: #004a9f; color: #004a9f; }
.esg-tabs .tab-btn.active:hover { background-color: #004a9f; color: #fff; }

.esg_table table { border-collapse: collapse; border: 1px solid #e5e7eb; border-radius: 14px; overflow: hidden;margin-top:15px; }
.esg_table th, .esg_table td { border: 1px solid #eef0f2;background-color: #fff; }
.esg_table th { background-color: #12172b; color: #fff; border-color: #12172b; }
.esg_table th .esg_small { font-size: 0.7em; }
.esg_table tbody tr:nth-child(even) { background-color: transparent; }
.esg_table tbody tr.esg_total_row td { box-shadow: inset 0 1px 0 #12172b; }
.esg_sec_tit { text-align: left;}
.esg_group + .esg_group { border-top: 1px solid #ddd; margin-top: 60px; padding-top: 40px; }
.esg_table_wrap {
    margin-top: 60px;
}
