/* =========================================================
   VISER GLOBAL SUB TAB SYSTEM
   - 모든 일반 페이지 / 게시판 / 통합검색 / 약관 탭 공통 기준
   - PC : max 1680px, 상단 38px, 높이 58px
   - Mobile : 좌우 15px, 상단 24px, 높이 52px, 2열
   ========================================================= */

/* 1. 탭 전체 영역 */
.company-bookmark,
.business-bookmark,
.core-bookmark,
.contact-bookmark,
.cert-bookmark-nav,
.esg-tab-wrap,
.tech-column-tabs,
.search-tab-wrap,
.terms-tab-wrap{
    position:relative;
    width:100%;
    max-width:none;
    margin:38px auto 0;
    padding:0;
    background:#fff;
    box-sizing:border-box;
}

/* 기존 padding으로 위치를 잡던 페이지 초기화 */
.cert-bookmark-nav{
    padding-top:0;
}

/* 2. 탭 내부 폭 / 배열 */
.company-bookmark-inner,
.business-bookmark-inner,
.core-bookmark-inner,
.contact-bookmark-inner,
.cert-bookmark-inner,
.esg-tabbar,
.tech-column-tabs-inner,
.search-tab-inner,
.terms-tab-inner{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(0, 1fr);
    width:100%;
    max-width:1680px;
    margin:0 auto;
    padding:0;
    border-top:1px solid #d8d8d8;
    border-left:1px solid #d8d8d8;
    background:#fff;
    box-sizing:border-box;
}

/* 기술칼럼 기존 하단 여백은 콘텐츠 간격으로 유지 */
.tech-column-tabs-inner{
    margin-bottom:55px;
}

/* 기술자료 / FAQ / 다운로드 / 주요장비 탭 위치 공통 기준 */
body .tech-column-tabs{
    margin:38px auto 0;
    padding:0;
}

body .tech-column-tabs-inner{
    width:100%;
    max-width:1680px;
    margin:0 auto 55px;
    padding:0;
}

/* 3. 모든 탭 버튼 */
.company-bookmark-link,
.business-bookmark-link,
.core-bookmark-link,
.contact-bookmark-link,
.cert-bookmark-inner > a,
.esg-tabbar .tab-btn,
.tech-column-tab,
.search-tab,
.terms-tab{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:auto;
    min-width:0;
    height:58px;
    margin:0;
    padding:0 14px;
    border:0;
    border-right:1px solid #d8d8d8;
    border-bottom:1px solid #d8d8d8;
    background:#fff;
    color:#111;
    font-size:16px;
    line-height:1.25;
    font-weight:600;
    letter-spacing:-.02em;
    text-align:center;
    text-decoration:none;
    word-break:keep-all;
    white-space:normal;
    box-sizing:border-box;
    transition:color .2s ease, background-color .2s ease;
}

/* 기존 flex 비율 제거 */
.cert-bookmark-inner > a,
.esg-tabbar .tab-btn,
.tech-column-tab,
.terms-tab{
    flex:none;
}

/* 4. 활성 / hover */
.company-bookmark-link:hover,
.company-bookmark-link.is-active,
.business-bookmark-link:hover,
.business-bookmark-link.is-active,
.core-bookmark-link:hover,
.core-bookmark-link.is-active,
.contact-bookmark-link:hover,
.contact-bookmark-link.is-active,
.cert-bookmark-inner > a:hover,
.cert-bookmark-inner > a:focus,
.cert-bookmark-inner > a.active,
.esg-tabbar .tab-btn:hover,
.esg-tabbar .tab-btn.active,
.tech-column-tab:hover,
.tech-column-tab:focus,
.tech-column-tab.active,
.search-tab:hover,
.search-tab.active,
.terms-tab:hover,
.terms-tab.active{
    color:#118b77;
    background:#fbfdfc;
}

/* 5. 활성 하단 녹색선 */
.company-bookmark-link:after,
.business-bookmark-link:after,
.core-bookmark-link:after,
.contact-bookmark-link:after,
.cert-bookmark-inner > a:after,
.esg-tabbar .tab-btn:after,
.tech-column-tab:after,
.search-tab:after,
.terms-tab:after{
    content:"";
    position:absolute;
    left:-1px;
    right:-1px;
    bottom:-1px;
    height:3px;
    background:transparent;
}

.company-bookmark-link.is-active:after,
.business-bookmark-link.is-active:after,
.core-bookmark-link.is-active:after,
.contact-bookmark-link.is-active:after,
.cert-bookmark-inner > a.active:after,
.esg-tabbar .tab-btn.active:after,
.tech-column-tab.active:after,
.search-tab.active:after,
.terms-tab.active:after{
    background:#118b77;
}

/* 검색 탭은 1개이므로 전체 폭 */
.search-tab-inner{
    grid-template-columns:1fr;
    grid-auto-flow:row;
}

/* =========================================================
   TAB FIXED BEHAVIOR
   - 스크롤 고정은 공통 head.php / default.css에서 처리
   - subtab.css는 디자인 / 폭 / 간격만 관리
   ========================================================= */


/* =========================================================
   MOBILE
   ========================================================= */
@media screen and (max-width:700px){
    .company-bookmark,
    .business-bookmark,
    .core-bookmark,
    .contact-bookmark,
    .cert-bookmark-nav,
    .esg-tab-wrap,
    .tech-column-tabs,
    .search-tab-wrap,
    .terms-tab-wrap{
        position:relative;
        top:auto;
        z-index:auto;
        margin-top:24px;
        padding:0;
    }

    .company-bookmark-inner,
    .business-bookmark-inner,
    .core-bookmark-inner,
    .contact-bookmark-inner,
    .cert-bookmark-inner,
    .esg-tabbar,
    .tech-column-tabs-inner,
    .terms-tab-inner{
        grid-auto-flow:row;
        grid-auto-columns:auto;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        width:calc(100% - 30px);
        max-width:none;
        margin-left:auto;
        margin-right:auto;
    }

    .search-tab-inner{
        width:calc(100% - 30px);
        max-width:none;
        grid-template-columns:1fr;
    }

    .company-bookmark-link,
    .business-bookmark-link,
    .core-bookmark-link,
    .contact-bookmark-link,
    .cert-bookmark-inner > a,
    .esg-tabbar .tab-btn,
    .tech-column-tab,
    .search-tab,
    .terms-tab{
        width:100%;
        height:52px;
        padding:0 8px;
        font-size:14px;
        line-height:1.25;
    }

    body .tech-column-tabs{
        margin-top:24px;
        padding:0;
    }

    body .tech-column-tabs-inner{
        width:calc(100% - 30px);
        margin-left:auto;
        margin-right:auto;
        margin-bottom:35px;
    }
}