@charset "utf-8";

/**************************************************
*
*   sub.css
*
***************************************************/
/* 기술소개 - 전기차충전 - 과금형충전 */
.sub_tech_intro_wrap .anchor_fee .single_img_box {padding: 20px 30%;}

/* 기술소개 - 전기차부속품 - 부속품 */
.sub_tech_intro_wrap .anchor_ec_part .vid_img_box {aspect-ratio: 700 / 575; max-height: 575px;}




/* 
.com_ctt_box_02 .char {
    animation: slide-in .7s cubic-bezier(.3, 0, .7, 1) both;
    animation-delay: calc(100ms * var(--char-index));
}
@keyframes slide-in {
from {
    transform: scale(0.4) translateY(80%);
    opacity: 0;
}
} */
/* Scaling */
.com_ctt_box_02  [data-scroll="out"] .char {
	transform: scale(0);
}


/* 시험인증 - 내용 테이블 */
.sub_certi_content_box {border-top: 3px solid #000; font-weight: 500; color: #000;}
.sub_certi_content_box > tbody tr { border-bottom: 1px solid #ddd;}
.sub_certi_content_box > tbody th,.sub_certi_content_box > tbody > td {padding: 30px;}
.sub_certi_content_box > tbody th {font-size: 20px; width: 16%; text-align: left; word-break: keep-all;}
.sub_certi_content_box > tbody td {width: 100%; font-size: 18px; line-height: 1.5; padding: 35px 15px; font-weight: 400; text-align: left;}

.sub_certi_content_box > tbody td span {display: block;}
.sub_certi_content_box > tbody td p {width: 100%;}
.sub_certi_content_box > tbody td a {display: inline-block; font-weight: 500; word-break: break-all;}
.sub_certi_content_box > tbody td a:hover {color: #4898ff;}


/* 강조 글씨 */
.sub_certi_content_box > tbody td .certi_bold_text {font-weight: bold; text-align: left;}

/* 내용 테이블 안 리스트 공통 */
.sub_certi_content_box > tbody td ul {margin-top: 5px;}
.sub_certi_content_box > tbody td ul > li {list-style:none; text-align: left;}
.sub_certi_content_box > tbody td ul > li::before {content: '\00B7'; font-weight: bold; margin-right: 10px;}


/* 내용 안 테이블 공통 */
.certi_com_inner_table {width: 100%; border-collapse: collapse; margin-top: 10px; width: 100%; border: 1px solid #ddd;}
.certi_com_inner_table tr {border-left: 0px;}
.certi_com_inner_table thead {background: #f9f9f9;}
.certi_com_inner_table thead th {text-align: center; background: #f9f9f9; width: 100% !important; padding: 8px 0px; font-size: 18px; line-height: 1.2; word-spacing: -3px; border-left: 1px solid #ddd; word-break: break-all;}
.certi_com_inner_table tbody td {text-align: center; padding: 5px 20px; word-spacing: -1.5px; border-top: 1px solid #ddd; border-left: 1px solid #ddd;}
.certi_com_inner_table tbody td > img {display: block; margin: 0px auto;}


@media screen and (max-width: 1080px) {
    .sub_certi_content_box {border-top: none; text-align: left;}
    .sub_certi_content_box > tbody th {font-size: 20px; text-align: left; width: 100%; font-weight: bold; padding: 0px;}
    .sub_certi_content_box > tbody td {font-size: 15px; line-height: 1.5; margin-bottom: 20px; padding: 16px 0px 30px 0px; border-bottom: 1px solid #ddd;}
    .sub_certi_content_box > tbody > tr {display: flex; flex-direction: column; align-items: flex-start; justify-content: center; border-bottom: 100px;}
    .sub_certi_content_box > tbody td > img {display: block; margin: 0px auto; max-width: 80%;}
	
    .sub_certi_content_box > tbody td .certi_bold_text {width: 100%;}
    
    .certi_com_inner_table thead th, .certi_com_inner_table tbody td {font-size: 14px;}
}

@media screen and (max-width: 768px) {
    .sub_certi_content_box > tbody td {font-size: 14px;}

    .certi_com_inner_table thead th {padding: 3px 3px; background: #f9f9f9; border-top: 1px solid #ddd; color: #555; border-bottom: none; text-align: center;}
    .certi_com_inner_table tbody td {padding: 3px 5px;}
    .certi_com_inner_table tbody td > img {max-width: 20%;}


}

@media screen and (max-width: 480px) {

    .sub_certi_content_box > tbody td { line-height: 1.5;}
    .sub_certi_content_box > tbody th {font-size: 18px;}
    .sub_certi_content_box > tbody td > img {max-width: 95%;}

    .certi_com_inner_table {margin-bottom: 10px;}
    .certi_com_inner_table thead th {font-size: 13px;}
    .certi_com_inner_table tbody td {font-size: 13px;}
    
    .sub_certi_content_box > tbody td ul > li::before {margin-right: 5px;}

    /* 시험인증 - 전자파적합성, 안전 인증기준 리스트 */
    .sub_certi_content_box > tbody td > ul.sub_certi_default_list {display: flex; flex-wrap: wrap; gap: 15px; justify-content: flex-start;}
}


/* 시험인증 - 안전 ******************************************************************/

/* 안전확인신고 신청 및 처리 절차 */
.certi_order_notice {margin-top: 10px;}



/* 시험인증 - 계량 ******************************************************************/

/* 계량 형식승인 개요 정의 리스트*/
.mensuration_define_list {padding: 20px 50px 0px 20px;  text-align: left;}
.mensuration_define_list ul li {list-style: none;}
.mensuration_define_list ul li::before {content: '\25CB'; margin-right: 10px; font-size: 15px;}


/* 계량 검정 개요 */
.certification_emc_outline_table {table-layout: auto;}
.certification_emc_outline_table > tbody > tr > td:first-of-type {text-align: left;}

@media screen and (max-width: 1080px) {
    /* 계량 형식승인 개요 정의 리스트*/
    .mensuration_define_list {padding: 10px 10px 0px 10px;}
}



/* 시험인증 - 통신적합성 ******************************************************************/

/* 차데모 시험기관 리스트 */
.chademo_agency_list {display: flex; flex-wrap: wrap; gap: 10px; padding-top: 20px;}
.chademo_agency_list li::before {content: none !important;}

/* 차데모 인증절차 */
.chademo_certi_order_list {display: flex; flex-direction: column; gap: 10px; padding: 20px 0px 0px 20px;}
.chademo_certi_order_list li::before {content: none !important;}
.chademo_certi_order_list li::before {content: none !important;}
.chademo_certi_order_list li {display: flex; align-items: center; gap: 15px;}
.chademo_certi_order_list li p > span {font-weight: 500;}



/* 시험인증 - 상호운용성 ******************************************************************/

/* EV-READY 시험기관 리스트 */
.certification_evready_agency_list tr {width: 100%;}





@media screen and (max-width: 1080px) {
    .chademo_agency_list {align-items: center; justify-content: center;}
    .chademo_agency_list li {width: 25%;}
}
@media screen and (max-width: 768px) {
    
}
@media screen and (max-width: 480px) {
    .chademo_agency_list li {width: 15%;}
    
    .chademo_certi_order_list {padding: 15px 0px 0px 0px;}
    .chademo_certi_order_list li {line-height: 1.2;}
    .chademo_certi_order_list li > img {max-width: 15%;}

}

/* 서브페이지 헤더 배경이미지 */


/* no_contents */
.no_contents img{margin:0 auto}
.no_contents {text-align: center; padding-bottom: 30px;}
.no_contents .txt_01 {margin-top: 20px; font-size: 40px; font-weight: 800;}
.no_contents .txt_01 .tit {color: var(--com-sub-color-01);}
.no_contents .txt_02 {margin-top: 10px; font-weight: 500; line-height: 1.4;}

@media screen and (max-width: 1080px) { 
    .no_contents .txt_01 {font-size: 30px; margin-top: 10px;}
    .no_contents .txt_02 {margin-top: 5px;}
}

@media screen and (max-width: 768px) {  
    .no_contents {padding-bottom: 10px;}
    .no_contents img {width: 250px;}
    .no_contents .txt_01 {font-size: 20px; margin-top: 10px;}
    .no_contents .txt_02 {margin-top: 5px;}
}

@media screen and (max-width: 480px) {
    .no_contents img {width: 200px;}
}



/********************************************************
  
  * 단체표준인증 서명 팝업 
  
  ********************************************************/
 
.popup_need_chk_box .bg{width:100%; position: fixed; top:0; left: 0; height: 100%; background-color: #000; opacity : 0.5; display: none; z-index: 99;}
.contracted_apply .popup_need_chk {width: 610px; max-width: 95%; text-align: center; font-size: 17px; box-shadow: 2px 2px 10px #999; color: #000; font-weight: 500; position: fixed; top: 50%; left: 50%; background-color: #fff; z-index: 999;display: none;}
.contracted_apply .popup_need_chk.submitPopup {z-index: 99999;}
.contracted_apply .popup_need_chk.applyListPopup{width: 900px;}
.contracted_apply .popup_need_chk .txt_box {line-height: 1.8; padding: 55px 10px 35px;}
.contracted_apply .popup_need_chk .txt_box.applyPopup {padding: 17px 10px 35px;}
.commentTxt{display: flex;}
.contracted_apply .popup_need_chk .btn_chk_complete {display: flex;justify-content: center;align-items: center;width: 100%;padding: 10px 0;font-size: 21px;color: #fff;background-color: #333333;}
.contracted_apply .popup_need_chk .btn_chk_complete:hover {background-color: #232323;}
.contracted_apply .popup_need_chk .btn_chk_complete.cancel{background-color: #828282;}
.contracted_apply .popup_need_chk .btn_chk_complete.cancel:hover {background-color: #4d4d4d;}

@media screen and (max-width:480px) {
  .contracted_apply .popup_need_chk {font-size: 14px;}
  .contracted_apply .popup_need_chk .txt_box {padding: 30px 10px 25px;}
  .contracted_apply .popup_need_chk .chk_box {gap: 0 20px; padding-bottom: 25px;}
  .contracted_apply .popup_need_chk .chk_box input {min-width: 18px; height: 18px; margin-right: 5px;}
  .contracted_apply .popup_need_chk .btn_chk_complete {font-size: 16px; padding: 7px 0;}
}

@media screen and (max-width:768px){
    .contracted_apply .tbl_board .sub_txt {font-size: 14px;}
}

/* 260107 플랫폼소개 추가 */
.platform-wrap h2 {color: #000; font-size: 30px; padding: 0px 0px 40px 0px;}
.platform-wrap p {font-size: 18px;line-height: 1.5; font-weight: 400; word-break: keep-all;}
.platform-wrap .platform-img {display: flex; align-items: center; justify-content: center; padding: 120px 0;}
.platform-wrap .platform-img .center {position:relative; width: 340px; height: 340px; background: #EFF4FD; border:2px solid #d9e1f1; border-radius: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; box-shadow: 0 0 20px rgba(21, 77, 161, 0.25); }
.platform-wrap .platform-img .center::before {content: ''; background: url(/resources/user/infra/img/sub/platform_img_logo.png) center no-repeat; display: block; width: 91px; height: 40px; right: 60px; margin-bottom: 10px;}
.platform-wrap .platform-img .tt {font-size: 24px; font-weight: 600; color: var(--com-sub-color-01); margin-bottom: 14px;}
.platform-wrap .platform-img .tx {font-size: 18px;line-height: 1.5; color: #555;}
.platform-wrap .platform-img ul li {position: absolute; width: 200px; height: 200px; border-radius: 100%; border: 2px solid #c3cee6; background: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; box-shadow: 4px 3px 0 rgba(0,0,0,.1);}
.platform-wrap .platform-img ul li:nth-child(1) {top: -70px; left: -150px; z-index: -1}
.platform-wrap .platform-img ul li:nth-child(2) {top: -70px; right: -150px;}
.platform-wrap .platform-img ul li:nth-child(3) {bottom: -70px; left: -150px; z-index: -1}
.platform-wrap .platform-img ul li:nth-child(4) {bottom: -70px; right: -150px;}
.platform-wrap .platform-img ul li .tx {color: #000; font-size: 18px; font-weight: 600;} 
.platform-wrap .platform-list {display: flex; flex-direction: column; gap: 30px;}
.platform-wrap .platform-list .item{display: flex; align-items: stretch; border: 1px solid #d8d8d8; border-radius: 30px; border-left: 0;}
.platform-wrap .platform-list .item .item-tit {font-size: 22px; font-weight:700; width: 100%; max-width: 380px; display: flex; align-items: center; justify-content: center; background: #C9D9F2; padding: 30px 20px; border-radius: 30px;}
.platform-wrap .platform-list .item:nth-child(2) .item-tit {background: #DFEAFA}
.platform-wrap .platform-list .item:nth-child(3) .item-tit {background: #ADC9F3}
.platform-wrap .platform-list .item:nth-child(4) .item-tit {background: #8EB6F2}
.platform-wrap .platform-list .item .item-txt {width: calc(100% - 380px); padding: 30px 40px;}
.platform-wrap .platform-list .item .item-txt .tt {font-size: 20px; font-weight: 600;}
.platform-wrap .platform-list .item .item-txt .tx {font-size: 18px; line-height: 1.5; margin-top: 10px; color: #555;}
.platform-wrap .platform-list .item .item-txt .tx li {position: relative;padding-left: 15px;}
.platform-wrap .platform-list .item .item-txt .tx li::before {content: '-'; position: absolute; top: 0; left: 0;}

@media screen and (max-width: 1080px) {
    .platform-wrap h2 {font-size: 20px; padding-bottom: 20px;}
    .platform-wrap p {font-size: 15px;}
    .platform-wrap .platform-img .center {width: 260px;height: 260px;}
    .platform-wrap .platform-img .tt {font-size: 18px;}
    .platform-wrap .platform-img .tx {font-size: 15px;}
    .platform-wrap .platform-img ul li {width: 140px; height: 140px;}
    .platform-wrap .platform-img ul li:nth-child(1) {top: -70px; left: -90px;}
    .platform-wrap .platform-img ul li:nth-child(2) {top: -70px; right: -85px;}
    .platform-wrap .platform-img ul li:nth-child(3) {bottom: -70px; left: -90px; z-index: -1}
    .platform-wrap .platform-img ul li:nth-child(4) {bottom: -70px; right: -85px;}
        .platform-wrap .platform-img ul li .tx {font-size: 15px;}
     .platform-wrap .platform-img ul li .ic {width: 40px;}
    .platform-wrap .platform-list .item {flex-direction: column; border: none;}
    .platform-wrap .platform-list .item .item-tit {font-size: 18px; padding: 20px; max-width: 100%;}
    .platform-wrap .platform-list .item .item-txt {width: 100%;}
    .platform-wrap .platform-list .item .item-txt .tt {font-size: 16px;}
    .platform-wrap .platform-list .item .item-txt .tx li {font-size: 15px;}
}

@media screen and (max-width: 520px) {
    .platform-wrap .platform-img {padding : 40px 0}
    .platform-wrap .platform-img .center {width: 100%; height: auto; padding: 20px; border-radius:10px;}
    .platform-wrap .platform-img ul {display: flex; flex-wrap: wrap; gap: 6px; width: 100%; margin-top: 15px;}
    .platform-wrap .platform-img ul li {position: static; z-index: 1!important; width: calc(50% - 3px); border-radius: 10px; box-shadow: none;}
    .platform-wrap .platform-img .tx br {display: none; }
    .platform-wrap .platform-list {gap: 15px;}
    .platform-wrap .platform-list .item .item-tit {font-size: 16px; padding: 12px;}
    .platform-wrap .platform-list .item .item-txt {padding: 20px 25px;}
}