@charset "utf-8";

/* root */
:root{
    /* font */
    --main-font: 'Inter','Pretendard', sans-serif;
    --point-font: 'Outfit', 'Inter', 'Pretendard', sans-serif;
    /* color */
    --brand-color: #ED6C00;
    --text-color: #111;
    --sub-text-color: #444;
    --bg-color-gray: #f8f8f8;
    --line-color: #ddd;
}

/* 반응형 */
@media (max-width: 1600px) {
    header .header_wr {
        padding: 0 40px;
    }

    /* index */
    #main_wr .visual .inset .banner .text-box{
        left: 40px;
    }
    #main_wr .company .bg-txt.left-txt{
        left: 40px;
    }
    #main_wr .company .bg-txt.right-txt{
        right: 40px;
    }
}

@media (max-width: 1440px) {
    /* header */
    header nav .dp1, header.active .dp1{
        padding: 0 40px;
    }
    /* index */
    #main_wr .visual .inset .banner .text-box{
        left: 60px;
    }
    #main_wr .visual .inset .banner .text-box .text-wrap .banner-tit{
        font-size: 58px;
    }

    #main_wr .company .bg-txt{
        font-size: 120px;
    }

    /* sub-page */
    #sub-banner .sub-tab-menu {
        margin: 60px 0 30px;
    }
    #sub-banner h2{
        font-size: 60px;
    }
    .page-head h2,
    .history .timeline-wrap .year,
    .program02 .head-tit{
        font-size: 50px;
    }
    #page-wrap .page-head-sub{
        font-size: 48px;
    }

    /* product */
    .product .product-item a{
        padding: 40px;
    }
    .product .product-item a .img-wrap{
        max-width: 300px;
        max-height: 300px;
        width: 100%;
        height: auto;
    }
    .product .product-item a .img-wrap img{
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

@media (max-width: 1280px) {
    /* header */
    header nav .dp1, header.active .dp1{
        padding: 0 25px;
    }
    .fix-btn{
        width: 60px;
        height: 60px;
    }
    
    /* index */
    #main_wr .visual .inset .banner .text-box .text-wrap .banner-tit{
        font-size: 44px;
    }
    #main_wr .visual .inset .banner .text-box .text-wrap > p{
        font-size: 18px;
    }

    #main_wr .main-tit{
        font-size: 40px;
    }
    #main_wr .tit-wrap p{
        font-size: 18px;
    }
    #main_wr .company .bg-txt{
        font-size: 100px;
    }
    #main_wr .product .cont{
        width: 100%;
    }
    #main_wr .product .cont:first-child .img-box{
        width: 100%;
    }
    #main_wr .product .cont:first-child .img-box img{
        width: 100%;
        object-fit: contain;
    }
    #main_wr .product .cont .img-box{
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        max-width: 500px;
        margin: 0 auto;
    }
    #main_wr .product .cont .tit{
        font-size: 28px;
    }
    .product .dr-btn{
        width: 160px;
        height: 50px;
        margin-top: 30px;
    }
    .program02 .full-cont-wrap .btn-wrap .app-btn{
        width: 180px;
        height: 50px;
    }
    .bi .btn-download{
        width: 160px;
        height: 50px;
    }
    #main_wr .product .cont-wrap::before,
    #main_wr .product .cont-wrap::after{
        width: calc(100% - 80px);
        aspect-ratio: 11 / 8;
        height: auto;
    }
    #main_wr .research .cont .tit{
        font-size: 24px;
    }
    #main_wr .partner .partner-swiper img{
        height: 80px;
    }
    
    /* sub-page */
    #sub-banner h2{
        font-size: 52px;
    }
    #sub-banner .bg{
        height: 380px;
    }
    .page-head h2,
    #page-wrap .page-head-sub,
    .history .timeline-wrap .year,
    .program02 .head-tit{
        font-size: 40px;
    }
    
    /* font-size */
    #page-wrap .cont-head-tit,
    .inner_box #bo_v_title .bo_v_tit{
        font-size: 36px;
    }
    .greeting .cont-wrap .name,
    .product .feature-list .tit{
        font-size: 25px;
    }
    .greeting .cont-wrap .text-wrap .tit,
    .icon-wrap .icon-box .txt,
    .vision .cv-wrap .img-wrap li .txt,
    .brand .full-cont-wrap .text-box .point,
    .bi .color-wrap .color-box .tit,
    .program01 .process .step-item .tit,
    .product .intro-wrap .sub-tit,
    .news #bo_gall .gall_text_href a .news-title{
        font-size: 20px;
    }
    .img-txt-wrap .text,
    .vision .cc-wrap .tit-wrap p,
    .vision .cv-wrap .tit-wrap p,
    .fs20{
        font-size: 18px;
    }

    /* greeting */
    #page-wrap.gre::before,
    #page-wrap.gre::after{
        width: calc(100% - 80px);
        aspect-ratio: 11 / 8;
        height: auto;
    }

    /* cert */
    .cert #bo_gall #gall_ul{
        grid-template-columns: repeat(4, 1fr);
        gap: 50px 24px;
    }

    /* prgoram02 */
    .program02 .app-list{
        margin-bottom: 120px;
    }
    .phone-mockup{
        width: 50%;
        max-width: 350px;
    }
    .phone-mockup .screen{
        border-radius: 40px;
    }
    .program02 .intro-wrap .frame::after{
        width: 120px;
        height: 120px;
    }
    .program02 .intro-wrap::before{
        bottom: 0;
    }
    .program02 .cont-wrap .text-wrap .cont-head-tit .num{
        font-size: 120px;
        bottom: 10px;
    }

    /* product */
    .product .product-item a{
        flex-direction: column;
    }
    .product .product-item a .img-wrap{
        margin: 0 auto;
    }
    .product .product-wrap{
        gap: 40px 30px;
    }
    .product .intro-wrap,
    .product .feature-list{
        gap: 50px;
    }
    
    
}

/* 태블릿 */
@media (max-width: 1080px) {
    /* reset */
    body{
        font-size: 16px;
    }

    /* header */
    header .header_wr {
        height: 70px;
        padding: 0 20px;
    }
    header .gnb nav {
        transition: all .5s ease .5s;
        display: none;
        opacity: 0;
    }
    header .logo{
        width: 80px;
    }
    header .r-inset{
        display: flex;
        align-items: center;
    }
    header .gnb .toggle-btn {
        display: block;
    }
    header.open .gnb .toggle-btn > span {
        position: absolute;
        width: 100%;
        top: 50%;
        background: #333;
    }
    header.open .gnb .toggle-btn > span + span {
        margin: 0;
    }
    header.open .gnb .toggle-btn > span:nth-child(1) {
        transform: rotate(45deg);
    }
    header.open .gnb .toggle-btn > span:nth-child(2) {
        display: none;
    }
    header.open .gnb .toggle-btn > span:nth-child(3) {
        transform: rotate(135deg);
    }
    header .nav-bg {
        opacity: 0;
        position: fixed;
        top: 0;
        left: 0;
        background: #fff;
        width: 100%;
        height: 100%;
        z-index: -10000000;
        transition: all .3s ease;
        visibility: hidden;
    }
    header.open .nav-bg {
        opacity: 1;
        visibility: visible;
    }
    header.open .logo .white{
        display: none;
    }
    header.open .logo .black{
        display: block;
    }
    header.open .lang-wrap .arrow{
        background-image: url(../img/qlab/arrow-black.png);
    }
    header.open .gnb{
        color: var(--text-color);
    }
    header.open .gnb nav {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        /* z-index: -1; */
        /* background: #FFF; */
        opacity: 1;
    }
    header.open .gnb nav .navlist{
        flex-direction: column;
        padding: 0 20px;
        position: relative;
        padding-top: 80px;
    }
    nav .navlist li.depth1 {
        width: 100%;
        padding: 28px 0;
        border-bottom: 1px solid #d9d9d9d9;
        display: block;
        position: relative;
    }
    header.open .gnb nav .navlist li .dp1 {
        text-align: left;
        padding: 22px 30px;
        color: var(--text-color);
        text-align: left;
        padding: 0;
        width: 100%;
        font-size: 20px;
        font-weight: 600;
        height: auto;
        justify-content: flex-start;
    }
    header nav .lnb li a{
        padding: 12px;
        display: block;
    }
    header nav .lnb li a::after{
        left: 0;
    }
    header nav .lnb {
        display: none;
        position: inherit;
        height: auto;
        font-size: inherit;
        opacity: 1;
        overflow: visible;
        transition: none;
    }
    nav .navlist li .lnb .dp2 {
        background: inherit;
        box-shadow: none;
        padding-top: 20px;
    }
    nav .navlist li .lnb .dp2 li {
        display: block;
        padding: 0;
        text-align: left;
    }

    .fix-btn-wrap{
        right: 20px;
        bottom: 20px;
    }

    /* index */ 
    #main_wr .inner{
        padding: 0 20px;
    }
    #main_wr .visual .inset .banner .text-box{
        left: 20px;
    }
    #main_wr .visual .indicator{
        padding: 0 20px;
    }

    #main_wr .main-tit{
        font-size: 24px;
    }
    #main_wr .company .bg-txt.left-txt{
        left: 20px;
    }
    #main_wr .company .bg-txt.right-txt{
        right: 20px;
    }

    #main_wr .product .cont-wrap{
        margin-bottom: 100px;
    }
    #main_wr .product .cont .tit{
        font-size: 24px;
    }

    #main_wr .research{
        padding: 100px 0;
    }
    #main_wr .research .cont .tit{
        font-size: 20px;
    }
    #main_wr .research .cont{
        padding: 30px;
    }

    #main_wr .partner{
        padding: 150px 0;
    }

    /* sub-page */
    #sub-banner .sub-tab-menu {
        margin: 40px 0 20px;
    }
    #sub-banner{
        margin-top: 120px;
    }
    #page-wrap .inner{
        padding: 0 20px;
    }
    #sub-banner h2{
        font-size: 48px;
    }
    #sub-banner .inner{
        padding: 0 20px;
    }
    #sub-banner .sub-tab-menu ul{
        gap: 40px;
    }
    #page-wrap{
        margin: 90px 0 120px;
    }
    #page-wrap.gre{
        padding: 90px 0 120px;
    }
    #page-wrap.no-bottom{
        margin: 90px 0 0;
    }
    .page-head{
        margin-bottom: 60px;
    }
    .page-head h2,
    #page-wrap .page-head-sub,
    .history .timeline-wrap .year,
    .program02 .head-tit{
        font-size: 36px;
    }
    #page-wrap .cont-head-tit,
    .inner_box #bo_v_title .bo_v_tit{
        font-size: 32px;
    }

    /* font-size */
    .product .feature-list .tit{
        font-size: 24px;
    }
    .greeting .cont-wrap .name{
        font-size: 22px;
    }
    .greeting .cont-wrap .text-wrap .tit,
    .icon-wrap .icon-box .txt,
    .vision .cv-wrap .img-wrap li .txt,
    .brand .full-cont-wrap .text-box .point,
    .bi .color-wrap .color-box .tit,
    .program01 .process .step-item .tit,
    .product .intro-wrap .sub-tit,
    .news #bo_gall .gall_text_href a .news-title{
        font-size: 18px;
    }
    

    /* greeting */
    .greeting .cont-wrap{
        gap: 50px;
    }
    .greeting .img-wrap{
        width: 50%;
    }
    .greeting .text-wrap{
        width: 50%;
        margin-top: 50px;
    }
    .greeting .cont-wrap .img-box{
        width: 100%;
    }
    
    /* vision */
    .img-txt-wrap .text-box{
        margin-left: 50px;
    }
    .img-txt-wrap .img-txt-box:nth-of-type(even) .text-box{
        margin-right: 50px;
    }
    .vision .cc-wrap{
        padding: 100px 0;
        margin-top: 100px;
    }
    .vision .cv-wrap{
        padding: 100px 0;
    }
    .icon-wrap .icon-box .img-box{
        width: 80px;
        height: 80px;
    }

    /* bs */
    .bs-wrap{
        padding-bottom: 100px;
    }
    .brand .full-cont-wrap,
    .program02 .full-cont-wrap{
        padding: 120px 0;
        overflow-x: hidden;
    }
    /* bi */
    .bi .color-wrap .color-box{
        padding: 40px;
    }

    /* program01 */
    .program01 .process-wrap,
    .program01 .icon-wrap{
        padding: 100px 0;
    }
    /* .program01 .process .step-item{
        text-align: left;
    }
    
    .program01 .process .step-item .txt-wrap{
        flex-direction: column;
    } */
    .program01 .process{
        grid-template-columns: 1fr;
        /* gap: 30px; */
    }
    .program01 .process .step-item{
        flex-direction: row;
        gap: 20px;
        padding: 0 0 30px;
    }
    .program01 .process .step-item .dot{
        width: 24px;
        height: 24px;
    }
    .program01 .process .step-item .day{
        margin: 0;
        width: 120px;
        padding: 10px 0;
        text-align: center;
        flex-shrink: 0;
    }
    .program01 .process .step-item{
        text-align: left;
    }
    .program01 .process .step-item br.dn{
        display: none;
    }
    .program01 .process .step-item .txt-wrap{
        flex-direction: column;
    }
    .program01 .process .step-item:nth-child(1)::after,
    .program01 .process .step-item:nth-child(3)::before{
        width: 12px;
        height: calc(300% + 30px);
        left: 0;
        top: 20px;
        border-bottom: 0;
        border-right: 2px solid var(--brand-color);
    }
    .program01 .process .step-item:nth-child(3)::before{
        height: 100%;
        border-right: 2px dashed var(--brand-color);
    }

    .program01 .icon-wrap .icon-list{
        grid-template-columns: repeat(2, 1fr);
        gap: 20px 0;
    }

    .who-wrap{
        padding: 50px;
    }

    /* prgram 02 */
    .program02 .intro-wrap::before{
        top: 50%;
        bottom: auto;
        left: 50%;
        transform: translate(-50%, -50%);
        /* height: 00px; */
        width: 100%;
    }
    .program02 .app-list {
        grid-template-columns: repeat(1, 1fr);
        gap: 50px;
    }
    .phone-mockup{
        width: 210px;
    }
    .phone-mockup .screen{
        border-radius: 30px;
    }
    .program02 .intro-wrap .frame::after{
        width: 40%;
        height: auto;
        min-width: 60px;
        aspect-ratio: 1 / 1;
        right: -40px;
    }
    .program02 .inner::before{
        /* content: none; */
        width: 100%;
        bottom: -120px;
        left: 50%;
        transform: translateX(-50%);
    }
    .program02 .app-list .text-wrap{
        margin: 0 auto;
    }
    

    /* product */
    .product .product-item a:hover .img-wrap img{
        transform: none;
    }
    .product .feature-wrap{
        padding: 100px 0;
    }
    
    /* 게시판 */
    /* research */
    /* view */
    .inner_box #bo_v_title .bo_v_tit{
        padding: 50px 0;
    }
    .research-info, .research #bo_v_link{
        width: 100%;
    }
    .research .profile_info_ct{
        flex-direction: column;
        gap: 20px;
        padding: 0 0 50px;
    }
    /* .research #bo_v_link ul{
        display: flex;
        gap: 12px;
    } */
    .research #bo_v_link a{
        width: 180px;
        height: 50px;
    }
    #bo_v_atc{
        padding: 50px 0;
    }
    .back-to-list .btn{
        width: 180px;
    }
    .bo_v_nb li a{
        padding: 0;
    }
    .research-info li span:first-child{
        width: 90px;
    }


    /* news */
    .news #bo_gall #gall_ul{
        gap: 50px 20px;
    }
    
}


@media (max-width: 905px){
    /* cert */
    .cert #bo_gall #gall_ul{
        grid-template-columns: repeat(3, 1fr);
        gap: 40px 22px;
    }
}

/* 모바일 */
@media (max-width: 768px) {
   /* reset */
    body {
        font-size: 14px;
    }

    /* header */
    header .shop-btn a{
        font-size: 14px;
        padding: 8px 24px;
    }
    header .lang-wrap .lang{
        gap: 12px;
    }
    header .lang-wrap .arrow{
        width: 12px;
    }
    nav .navlist li.depth1 {
        padding: 20px 0;
    }
    header.open .gnb nav .navlist li .dp1 {
        font-size: 18px;
    }
    

    /* footer */
    footer, footer .top .info {
        font-size: 14px;
    }
    footer .footer-wrap{
        flex-direction: column;
        padding: 60px 20px 40px;
    }
    footer .top{
        flex-direction: column;
        gap: 30px;
    }
    footer .top .family-site {
        width: 100%;
    }
    footer .bottom{
        margin-top: 40px;
        padding-top: 20px;
        /* border-top: 1px solid #333; */
        flex-direction: column;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }
    footer .bottom .top-btn-wrap{
        width: 44px;
        height: 44px;
    }
    footer .bottom .top-btn-wrap img{
        width: 20px;
        height: 20px;
    }
    footer .bottom .copyright{
        font-size: 14px;
    }

    .fix-btn{
        width: 44px;
        height: 44px;
    }
    .fix-btn img{
        width: 16px;
        height: 16px;
    }
    .product .dr-btn{
        margin-top: 20px;
    }
    /* index */
    #main_wr .visual .inset .banner.slide1 .img{
        background-image: url(../img/drcoach/banner01-mo.jpg);
    }
    #main_wr .visual .inset .banner.slide2 .img{
        background-image: url(../img/drcoach/banner02-mo.jpg);
    }
    #main_wr .visual .inset .banner.slide3 .img{
        background-image: url(../img/drcoach/banner03-mo.jpg);
    }

    #main_wr .visual .inset .banner .text-box .text-wrap .banner-tit{
        font-size: 32px;
    }
    #main_wr .visual .inset .banner .text-box .text-wrap > p {
        font-size: 16px;
    }
    #main_wr .visual .progress-item .num{
        font-size: 14px;
    }

    #main_wr .main-tit{
        font-size: 28px;
    }
    #main_wr .tit-wrap p{
        font-size: 16px;
    }
    #main_wr .company{
        max-height: 500px;
    }
    #main_wr .company .bg-txt{
        font-size: 80px;
    }
    #main_wr .company .txt-top{
        padding-right: 80px;
    }
    #main_wr .company .txt-bottom{
        padding-left: 80px;
    }
    #main_wr .company .point_btn a{
        padding: 20px 40px;
    }

    #main_wr .product .cont-wrap{
        flex-direction: column;
        gap: 20px;
    }
    #main_wr .product .cont-wrap::before, #main_wr .product .cont-wrap::after{
        content: none;
    }
    
    #main_wr .product .cont .tit{
        font-size: 20px;
        padding: 0;
    }
    #main_wr .research .cont-wrap{
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
    }
    #main_wr .research .cont .dec{
        font-size: 14px;
    }
    #main_wr .partner .partner-swiper img{
        height: 60px;
    }

    /* sub-page */
    #sub-banner h2{
        font-size: 40px;
    }
    #sub-banner .sub-tab-menu .tab-inner{
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }
    #sub-banner .sub-tab-menu ul{
        flex-wrap: nowrap;
        width: max-content;
        gap: 24px;
        padding-bottom: 6px;
    }
    #sub-banner .sub-tab-menu .tab-inner::-webkit-scrollbar{
        display:none;
    }
    #sub-banner .sub-tab-menu .tab-inner{
        scrollbar-width:none;
    }
    #sub-banner .bg{
        height: 280px;
    }
    
    .page-head h2,
    #page-wrap .page-head-sub,
    .history .timeline-wrap .year,
    .program02 .head-tit{
        font-size: 32px;
    }
    #page-wrap .cont-head-tit,
    .inner_box #bo_v_title .bo_v_tit{
        font-size: 28px;
    }
    #page-wrap .cont-head{
        margin-bottom: 50px;
    }

    /* font-size */
    .greeting .cont-wrap .name,
    .product .feature-list .tit{
        font-size: 18px;
    }
    .greeting .cont-wrap .text-wrap .tit,
    .img-txt-wrap .text,
    .vision .cc-wrap .tit-wrap p,
    .vision .cv-wrap .tit-wrap p,
    .icon-wrap .icon-box .txt,
    .vision .cv-wrap .img-wrap li .txt,
    .brand .full-cont-wrap .text-box .point,
    .bi .color-wrap .color-box .tit,
    .program01 .process .step-item .tit,
    .product .intro-wrap .sub-tit,
    .fs20,
    .news #bo_gall .gall_text_href a .news-title{
        font-size: 16px;
    }

    .news #bo_gall .gall_info .gall_date{
        font-size: 13px;
    }
    

    /* greeting */
    .greeting .cont-wrap{
        flex-direction: column;
        gap: 30px;
    }
    .greeting .img-wrap{
        width: 100%;
        max-width: 400px;
    }
    .greeting .text-wrap{
        width: 100%;
        margin-top: 0;
    }
    .greeting .cont-wrap .name{
        gap: 12px;
    }
    .greeting .cont-wrap .text-wrap p + p{
        margin-top: 12px;
    }
    .greeting .cont-wrap .text-wrap .tit{
        padding: 0;
    }

    #page-wrap.gre::before,
    #page-wrap.gre::after{
        width: 150%;
        bottom: -3%;
        right: auto;
        left: 5%;
    }

    /* vision */
    
    .img-txt-wrap .img-txt-box{
        flex-direction: column;
        gap: 30px;
    }
    .img-txt-wrap .img-txt-box:nth-of-type(even){
        flex-direction: column;
    }
    .img-txt-wrap .img-txt-box:nth-of-type(even) .text-box{
        text-align: left;
    }
    .img-txt-wrap .img-txt-box:nth-of-type(even) .text::after{
        right: auto;
        left: 0;
    }
    .img-txt-wrap .text-box{
        margin: 0;
    }
    .img-txt-wrap .img-txt-box:nth-of-type(even) .text-box {
        margin-right: 0;
    }
    .vision .cc-wrap .tit-wrap p, .vision .cv-wrap .tit-wrap p{
        margin-top: 12px;
    }
    .img-txt-wrap .img-txt-box:not(:last-child){
        margin-bottom: 60px;
    }
    .img-txt-wrap .text{
        padding-top: 12px;
        margin-top: 12px;
    }
    .vision .cc-wrap .tit-wrap, .vision .cv-wrap .tit-wrap{
        margin-bottom: 30px;
    }
    .vision .cc-wrap .icon-wrap .icon-list{
        grid-template-columns: repeat(2,1fr);
        gap: 20px 0;
    }
    .vision .cc-wrap .icon-wrap .icon-list::before{
        content: none;
    }
    .icon-wrap .icon-box{
        border: 0;
    }
    .icon-wrap .icon-box:nth-child(3){
        border: 0; 
    }
    .icon-wrap .icon-box:nth-child(2),
    .icon-wrap .icon-box:nth-child(4){
        border: 0;
    }
    .icon-wrap .icon-box{
        padding: 10px;
    }
    .vision .cv-wrap .img-wrap ul{
        grid-template-columns: repeat(2, 1fr);
    }

    

    /* history */
    .history .timeline-wrap .timeline-box{
        flex-direction: column;
        gap: 20px;
    }
    .history .timeline-wrap .month-item{
        margin-bottom: 20px;
    }

    /* bi */
    .bi .page-head{
        margin-bottom: 30px;
    }
    .bi .color-wrap{
        flex-direction: column;
        gap: 12px;
    }
    .bi .logo-img-wrap{
        margin: 50px 0 30px;
    }
    .bi .color-wrap .color-box{
        gap: 24px;
    }
    .bi .logo-img-wrap{
        height: 300px;
    }

    /* program01 */
    .program01 .intro-wrap{
        flex-direction: column;
        gap: 20px;
        margin-bottom: 50px;
    }
    .program01 .intro-wrap h3, .program01 .intro-wrap p {
        width: 100%;
    }
    .program01 .process .step-item .dot{
        display: none;
    }
    .program01 .process .step-item:nth-child(1)::after,
    .program01 .process .step-item:nth-child(3)::before{
        content: none;
    }
    .program01 .icon-wrap .icon-box:nth-child(3){
        border: 0;
    }
    .program01 .process-wrap .cont-head{
        text-align: left;
    }
    .program01 .process .step-item{
        padding-bottom: 20px;
    }
    .program01 .process .step-item .tit{
        margin-bottom: 6px;
    }

    .who-wrap{
        flex-direction: column;
        gap: 30px;
    }
    .who-wrap > *{
        width: 100%;
    }
    .who-wrap .who-list li{
        padding: 20px 0;
    }

    /* program02 */
    .program02 .app-list{
        /* margin-bottom: 80px; */
    }
    .program02 .full-cont-wrap .text-box .tit{
        margin: 12px 0 50px;
    }
    .program02 .full-cont-wrap{
        padding: 100px 0;
    }
    .program02 .cont-wrap .text-wrap .cont-head-tit .num{
        font-size: 80px;
    }

    /* product */
    .product .product-item a .img-wrap{
        max-width: 200px;
        /* max-height: 250px; */
    }
    .product .product-wrap{
        gap: 20px;
    }
    .product .product-item a{
        padding: 30px 40px 10px;
    }
    .product .intro-wrap{
        flex-direction: column;
        gap: 30px;
        padding-bottom: 80px;
    }
    .product .feature-wrap{
        padding: 80px 0;
    }
    .product .feature-list{
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
    }
    .product .intro-wrap .sub-tit{
        margin: 10px 0;
    }
    .product .feature-list:not(:last-child){
        margin-bottom: 30px;
    }
    .product .feature-list .num{
        width: 28px;
        height: 28px;
        line-height: 28px;
        font-size: 14px;
        margin-top: 0;
    }

    /* 게시판 */
    /* research */
    .pg_wrap{
        margin-top: 50px;
    }
    .research table thead{
        display: none;
    }
    .research #bo_list .td_num2{
        display: none;
    }
    .research #bo_list tbody tr{
        /* display: flex;
        flex-direction: column;
        gap: 0px; */
        display: block;
        padding: 25px 10px;
        border-bottom: 1px solid #ecf0f1;
    }
    .research .tbl_head01 td{
        padding: 0;
        height: auto;
        line-height: 1.5;
    }
    .tbl_head01 td{
        border: 0; 
    }
    .research .tbl_head01 td .bo_tit{
        padding: 0;
    }
    .research #bo_list td.td_journal,
    .research #bo_list td.td_published{
        display: inline-block;
        /* align-items: center; */
        width: auto;
        margin-top: 6px;
        font-size: 13px;
        opacity: .8;
        /* white-space: nowrap; */
    }
    .research #bo_list td.td_published{
        margin-left: 10px;
        padding-left: 10px;
        position: relative;
    }
    .research #bo_list td.td_published::after{
        content: '';
        position: absolute;
        top: 8px;
        left: -1px;
        width: 3px;
        height: 3px;
        border-radius: 50%;
        background: #999;        
    }
    .tbl_head01 tbody tr:hover td{
        background: none;
    }

    /* view */
    .research .inner_box #bo_v_title .bo_v_tit,
    .research .profile_info_ct{
        padding: 0 0 30px;
    }
    
    #bo_v_atc{
        padding: 30px 0;
    }
    .back-to-list{
        margin-top: 50px;
    }
    .research-info li{
        gap: 10px;
    }

    /* news */
    .news #bo_gall #gall_ul{
        grid-template-columns: repeat(2, 1fr);
    }
    .news #bo_gall .gall_con .gall_img_txt{
        margin-top: 20px;
    }
    .news #bo_gall .gall_info{
        margin-top: 8px;
    }
    /* view */
    .write-info-box .write-info {
        font-size: 14px;
    }
}


@media (max-width: 767px) {
    .write-info-box .write-info {
        flex: 1;
        margin: inherit;
    }
}


@media (max-width: 599px) {
    br.mo{
        display: none;
    }
    /* header */
    header .shop-btn a{
        padding: 10px 20px;
    }
    header .lang-wrap .lang{
        padding: 10px 0;
    }
    header .lang-wrap .icon img{
        width: 20px;
        height: 20px;
    }
    header .lang-wrap ul .lang{
        width: 65px;
        text-align: center;
    }
    /* footer */
    footer .info .info-tit{
        width: 100px;
    }
    footer .top .info-flex{
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    footer .top .info li span{
        min-width: 62px;
        flex-shrink: 0;
    }

    /* index */
    #main_wr .main-tit{
        font-size: 22px;
    }
    
    #main_wr .company .bg-txt{
        font-size: 60px;
    }
    #main_wr .product .cont-wrap{
        margin-bottom: 75px;
    }
    #main_wr .research{
        padding: 75px 0;
    }
    #main_wr .partner{
        padding: 100px 0;
    }

    /* sub-page */
    #sub-banner{
        margin-top: 100px;
    }
    #sub-banner h2{
        font-size: 36px;
    }
    #page-wrap{
        margin: 50px 0 80px;
    }
    #page-wrap.gre{
        padding: 50px 0 80px;
    }
    #page-wrap.no-bottom{
        margin: 50px 0 0;
    }
    #sub-banner .sub-tab-menu{
        margin: 24px 0 12px;
    }
    .page-head{
        margin-bottom: 30px;
    }
    .page-head h2,
    #page-wrap .page-head-sub,
    .history .timeline-wrap .year,
    .program02 .head-tit{
        font-size: 28px;
    }
    #page-wrap .cont-head-tit,
    .inner_box #bo_v_title .bo_v_tit{
        font-size: 24px;
    }


    /* font-size */



    /* vision */
    .vision .cc-wrap{
        padding: 75px 0;
        margin-top: 75px;
    }
    .vision .cv-wrap{
        padding: 75px 0;
    }

    /* history */
    .history .timeline-wrap .month-item{
        margin-bottom: 12px;
    }

    /* cert */
    .cert #bo_gall #gall_ul{
        grid-template-columns: repeat(2, 1fr);
        gap: 32px 20px;
    }
    .cert #bo_gall .gall_text_href{
        margin: 12px;
    }
    /* bs */
    .bs-wrap{
        padding-bottom: 75px;
    }
    .brand .full-cont-wrap,
    .program02 .full-cont-wrap{
        padding: 80px 0;
    }
    /* bi */
    .bi .logo-img-wrap .img-item{
        width: 60%;
    }
    .bi .color-wrap .color-box .value{
        gap: 20px;
    }
    .bi .page-head{
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    .bi .btn-download::after{
        width: 20px;
        height: 20px;
        object-fit: contain;
    }
    .bi .btn-download{
        padding: 0;
        width: 140px;
        height: 44px;
    }
    /* program01 */
    .program01 .process-wrap,
    .program01 .icon-wrap{
        padding: 75px 0;
    }
    .program01 .process .step-item .day{
        width: 100px;
    }
    .who-wrap{
        padding: 30px;
        gap: 20px;
    }
    .who-wrap .who-list li{
        padding: 16px 0;
    }
    .who-wrap .who-list li::before{
        width: 18px;
        height: 18px;

    }
    

    /* prgram02 */
    .program02 .full-cont-wrap .btn-wrap{
        flex-direction: column;
    }
    .program02 .intro-wrap .frame::after{
        right: -30px;
    }
    .program02 .intro-wrap::before{
        width: 100%;
    }

    /* product */
    .product .product-wrap{
        grid-template-columns: repeat(1, 1fr);
    }
    .product .intro-wrap{
        padding-bottom: 50px;
    }
    .product .feature-wrap{
        padding: 50px 0;
    }

    .product .feature-list .text-wrap{
        flex-direction: column;
        gap: 10px;
    }
    .product .feature-list .tit{
        margin-bottom: 8px;
        margin-left: 36px;
    }
    .product .feature-list:not(:last-child){
        margin-bottom: 20px;
    }
    .product .dr-btn{
        width: 140px;
        height: 44px;
    }
    .product .feature-list .text-wrap{
        position: relative;
    }
    .product .feature-list .num{
        position: absolute;
        top: 0;
        left: 0;
    }

    /* 게시판 */
    /* research */
    /* view */
    .research .profile_info_ct{
        gap: 10px;
    }
    .research-info li{
        flex-direction: column;
        gap: 5px;
    }

    /* news */
    .news #bo_gall .gall_con .gall_img_txt{
        margin-top: 16px;
    }
    .news #bo_gall .gall_text_href a .news-title{
        font-size: 14px;
    }
    /* paging */
    .pg_wrap .pg .pg_current{
        width: 32px;
        height: 32px;
        line-height: 32px;
    }
    .pg_wrap .pg{
        gap: 16px;
    }
    /* view */
    #bo_v_link{
        padding: 0 20px;
    }
}