@charset "utf-8";

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

    .pc_only { display: none !important; }
    .mo_only { display: block !important; }
    table.mo_only { display: table !important; }

    .content {
        padding: 80px 0 30px;
    }

    #ctt .lnb {
        width: 100%;
        padding: 10px 0;
    }

    #ctt .lnb li {
        font-size: 14px;
        height: 36px;
    }
    #ctt .lnb li span {
        height: 36px;
        width: 100%;
    }

    .product .pdt_tit {
        font-size: 28px;
    }

    .product .pdt_hd > .pdt_tit {
        display: none;
    }

    .product .hd_txt_wrap {
        height: auto;
        border-bottom: 0;
        background: none;
    }

    .product .hd_txt_wrap .pdt_col_2 {
        flex-direction: column;
    }

    .product .hd_txt_wrap .pdt_col_2 > .hd_txt {
        width: 100%;
        flex: none;
        order: -1;
    }

    .product .hd_txt_wrap .pdt_col_2 > .hd_img {
        width: 100%;
        flex: none;
        background: #f3f5f4;
    }

    .product .hd_txt_wrap > .wrapper {
        padding: 0;
    }

    .product .hd_txt {
        padding: 0 25px;
    }

    .product .hd_txt_mn {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 2px solid #bebebe;
    }

    .product .hd_txt_mn > span {
        font-size: 28px;
        margin-right: 0;
    }

    .product .hd_txt_mn button {
        font-size: 0;
        position: relative;
        right: auto;
        top: auto;
        width: 25px;
        height: 25px;
        margin-top: 0;
        padding: 0;
        border: none;
        background: url(../../../img/ico/ico_img_more.png) no-repeat center center;
        background-size: contain;
        flex-shrink: 0;
    }

    .product .hd_txt_info {
        font-size: 14px;
        padding-top: 15px;
        padding-bottom: 20px;
        line-height: 20px;
    }

    .product .hd_img {
        text-align: center;
        padding: 0;
    }

    .product .hd_img img {
        max-width: 100%;
        height: auto;
    }

    .product .over_img {
        position: relative;
        top: 0;
    }

    .product .pdt_wrap {
        margin-top: 80px !important;
        padding-top: 0 !important;
    }
    .product .pdt_wrap:first-child {
        margin-top: 80px !important;
        padding-top: 40px !important;
    }

    .product .pdt_txt_wrap {
        padding: 0 30px 15px;
    }

    .product .pdt_txt_1 {
        font-size: 20px;
        padding: 20px 0 15px;
        border-bottom: 2px solid #bebebe;
    }

    .product .pdt_wrap:first-child .pdt_txt_1 {
        white-space: nowrap;
    }

    .product .pdt_wrap:first-child .wrapper>div:first-child {
        padding-top: 0;
    }

    .product .pdt_wrap:first-child .pdt_txt_1 > div {
        display: inline;
    }

    .product .pdt_txt_2 {
        font-size: 14px;
        padding: 15px 0 0;
    }

    .product .pdt_info > .wrapper.pdt_col_2 {
        display: flex;
        flex-direction: column;
    }

    .product .pdt_info > .wrapper.pdt_col_2 > .pad_l {
        width: 100%;
        padding: 0;
    }

    .product .pdt_info > .wrapper.pdt_col_2 > .pad_l > .pdt_img_1 {
        padding: 15px;
    }

    .product .pdt_info > .wrapper.pdt_col_2 > .bd_img {
        width: 100%;
    }

    .pad_l { padding-left: 0; }
    .pad_r { padding-right: 0; }

    .product .bd_img.bd_img_1 {
        padding: 0 15px;
    }

    .product .pdt_img_1 {
        padding: 15px;
    }

    .product .pdt_info img {
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    .sb1000_img_r {
        max-width: 100%;
        margin: 0 auto;
    }

    .img_label {
        font-size: 12px;
    }

    .product .pdt_wrap:nth-child(2) .pdt_info:after {
        height: 40%;
    }

    /* 어플리케이션 섹션 모바일 */
    .product .pdt_wrap.app_section {
        margin-top: 80px !important;
        padding-top: 40px !important;
    }
    .app_tit {
        font-size: 20px !important;
    }
    .app_content {
        flex-direction: column;
    }
    .product .pdt_col_2.app_content > div {
        width: 100%;
        padding: 20px 15px;
        margin-bottom: 20px;
    }
    .app_feature_list .app_feature_txt {
        font-size: 16px;
    }
    .app_feature_list .app_feature_txt strong {
        font-size: 20px;
    }
    .app_feature_list .app_feature_txt p {
        font-size: 18px;
    }

    .app_img_wrap {
        width: 100%;
        text-align: center;
        padding: 0 15px;
    }
    .app_img_wrap img {
        max-width: 70%;
        height: auto;
    }
    .app_info_wrap {
        width: 100%;
        padding: 20px 15px 0;
    }
    /* 앱 다운로드 행 */
    .app_download {
        flex-direction: column !important;
    }
    .app_download_row {
        min-width: 0;
        width: 100%;
        padding: 5px 0 !important;
    }

    .app_feature_item {
        margin-bottom: 15px;
        padding: 12px 15px;
    }
    .app_feature_ico {
        width: 75px;
        height: 75px;
        min-width: 75px;
        margin-right: 15px;
    }
    .app_download_row .app_feature_ico {
        width: 75px;
        height: 75px;
        min-width: 75px;
        margin-left: 15px;
    }
    .app_feature_txt strong {
        font-size: 14px;
    }
    .app_feature_txt p {
        font-size: 12px;
    }

    /* 제품 구성 모바일 */
    .pdt_composition {
        padding: 20px 15px;
    }
    .composition_labels .comp_txt {
        font-size: 10px;
    }

    /* 주요 제원 모바일 */
    .product .pdt_wrap.spec .pdt_info .wrapper {
        padding: 20px 15px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .product .pdt_info table {
        width: 100%;
        table-layout: fixed;
    }
    .product .pdt_info table thead th {
        font-size: 12px;
        height: 30px;
    }
    .product .pdt_info table.mo_only tbody th {
        font-size: 11px;
        height: 30px;
        width: 30%;
    }
    .product .pdt_info table.mo_only tbody td {
        font-size: 11px;
        height: 30px;
        width: 70%;
    }
    .product .pdt_info table tbody th,
    .product .pdt_info table tbody td {
        font-size: 12px;
        height: 30px;
    }

    /* 제품 영상 모바일 */
    .product .pdt_wrap.video .pdt_info .wrapper {
        padding: 20px 15px;
    }

    /* 모달 모바일 */
    section.modal_wrap .modal_bg {
        top: 50%;
        transform: translateY(-50%);
        height: auto;
        padding: 50px 20px 20px;
    }
    section.modal_wrap .modal {
        max-width: 95%;
    }
    .pdt_slide.slick-slider {
        background: #fff;
        padding: 10px 50px 10px;
        width: 100%;
        aspect-ratio: 1 / 1;
        position: relative;
        overflow: visible;
    }
    .pdt_slide .slick-list {
        height: 100% !important;
        padding-bottom: 15% !important;
    }
    .pdt_slide .slick-track,
    .pdt_slide .slick-slide,
    .pdt_slide .slick-slide > div {
        height: 100% !important;
        display: flex !important;
        align-items: flex-end !important;
        justify-content: center !important;
    }
    .slick-list {
        width: 100%;
    }
    section.modal_wrap .pdt_slide img[src*="img_02"] {
        margin-bottom: 65px !important;
    }
    section.modal_wrap .pdt_slide img {
        max-width: 90% !important;
        max-height: 80% !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
        display: block;
        margin-top: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 0 !important;
    }
    section.modal_wrap button.cls_btn {
        right: 10px !important;
        top: -35px !important;
        width: 24px !important;
        height: 24px !important;
        background-size: contain;
    }
    section.modal_wrap .modal {
        position: relative !important;
    }
    section.modal_wrap button.slick-arrow {
        width: 25px !important;
        height: 50px !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        filter: brightness(0.8) !important;
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 10 !important;
        display: block !important;
    }
    section.modal_wrap button.slick-prev {
        left: 10px !important;
        background-image: url(../../../img/20/product/slide/modal_prev_btn.png) !important;
    }
    section.modal_wrap button.slick-next {
        right: 10px !important;
        background-image: url(../../../img/20/product/slide/modal_next_btn.png) !important;
    }
}