/* 액자 반응형 CSS */
#nopc-photoframe-main-img {
    display: none;
}

.artframe .nopc-blue-bar {
    display: none;
}

.top-banner .no-pc {
    display: none;
}

.mobile-only {
    display: none!important;
}


.order-slide-wrap {
    padding-left: 10px;
    padding-right: 5px;
}

@media screen and (max-width:576px) {
    .mobile-mb20 {
        margin-bottom: 20px;
    }

    .mobile-menu {
        top: 90px!important;
    }

    .mobile-none {
        display: none;
    }

    .artframe-main .popular-frame-title {
        font-size: 26px;
    }

    .indesign-radius img {
        border-radius: 20px;
    }

    .easy-quick-order {
        margin-top: 40px;
        justify-content: space-around!important;
    }

    .frame-mainlink-text {
        margin-top: 10px;
        margin-bottom: 30px;
    }

    .btn-slide-prev, .btn-slide-next {
        display: none;
    }

    .artframe-main .owl-item {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .myframe-slide .btn-next:hover {
        background-color: rgba( 255, 255, 255, 0 );
    }

    .myframe-slide .btn-prev {
        top: 60.5%!important;
    }

    .myframe-slide .btn-next {
        top: 60.5%!important;
    }

    #photoframe-main-img {
        display: none;
    }

    #nopc-photoframe-main-img {
        display: block;
    }

    .artframe .my-room {
        display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, auto)); column-gap:10px;
    }

    .artframe .my-room .item img {
        width:98%;
    }

    .artframe .make-frame {
        width: 290px;
        height: 60px;
        font-size: 24px;
        margin: auto;
        display: inherit;
        padding-top: 10px;
        margin-bottom: 50px;
    }

    .artframe .choice-box {
        height: auto; padding:20px 0; background:#fcfcfc; border-bottom: 12px solid #f5f5f5; zoom:0.8;
    }

    .frameview-section .frame-view-title02-1 {
        margin-top: 65px;
    }
    /* 셀프 액자 만들기 */
    .myframe-section .myframe-link-title {
        font-size: 26px;
        margin-top: 75px;
    }

    .frame-main-text-01 {
        font-size: 26px;
    }

    .img-over-link .btn {
        top: 110px;
    }

    .over-link-btn2 {
        top: 180px !important;
    }

    .frame-comming-btn {
        top: 145px!important;
    }

    /* 모바일 상세보기 링크 */
    #main-menu>li {
        width: 160px;
    }

    #sub-menu {
        top: 43px;
        z-index: 5;
    }

    #sub-menu>li {
        padding: 12px 0px;
    }

    #main-menu>li > a {
        font-size: 20px;
    }

    .frame-nav ul li .fa-triangle {
        bottom: 4px;
    }

    .artframe .more-grid2 {
        /* display:grid; grid-template-columns: repeat(auto-fill, minmax(350px, auto)); gap:15px; */
        flex-wrap: wrap;
    }

    #main-menu>li>a {
        padding: 10px 0px;
    }
    /* 모바일 캔버스 */
    .frameview-section .frame-compare-subtitle {
        margin-bottom: 20px;
    }
    /* 모바일 아트룩스 */
    .frameview-section .frame-view-title02 {
        margin-top: 70px;
        margin-bottom: 10px;
    }

    .frameview-section .frame-view-subtitle02 {
        margin-bottom: 20px;
    }

    /* 명화 선택주문 */
    .artframe .choice-box .container .row .col:first-child{
        margin-left: 15px;
    }
    .artframe .choice-box .container .row .col{
        margin-right: 15px;
    }

    .compare-pcmargin {
        margin-right: 0px;
    }


    .artframe .order-grid2 {
        /* display:grid; grid-template-columns: repeat(auto-fill, minmax(400px, auto)); gap:15px; */
        flex-wrap: wrap;
    }

    .fm-mb-row .frame-radio {
        margin-bottom: 0px!important;
    }

}


@media screen and (max-width:768px) {
    #quick-menu {
        display: none;
    }
    .pc-only {
        display: none!important;
    }

    .mobile-only {
        display: block!important;
    }

    .frame-header {
        display: none;
    }

    .artframe .blue-bar {
        display: none;
    }

    .artframe .nopc-blue-bar {
        display: block;
    }

    .artframe .myframe-titel1 {
        padding-top:50px;
    }

    .artframe .nopc-myframe-titel1 {
        display: block;
    }

    .artframe .frame-main-text-01 {
        margin-top:0;
    }

    .choose-picture {
        /* display:grid; grid-template-columns: repeat(auto-fill, minmax(200px, auto)); gap:10px; */
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        align-items: center;
    }

    .choose-picture img {
        width:200px;
    }

    .choose-picture h2 {
        font-size: 20px;
    }

    .artframe .add-option {
        display:grid; grid-template-columns: repeat(auto-fill, minmax(130px, auto)); /* row-gap: 30px; */
    }

    .artframe .add-option img {
        width:95%;
    }

    .artframe .add-option-title {
        margin-bottom: 30px;
    }

    .top-banner .pc {
        display: none;
    }

    .top-banner .no-pc {
        display: block;
    }

    .artframe .column3 {
        display:grid; grid-template-columns: repeat(auto-fill, minmax(48%, auto)); row-gap: 10px;
    }

    .artframe .column3 .item:nth-child(1) {
        grid-column: 1/3;
    }

    .artframe .column3 .item:nth-child(1) img {
        width:100%;
    }

    .artframe .column3 .item:nth-child(2) {
        grid-column: 1; grid-row: 2;
    }

    .artframe .column3 .item:nth-child(2) img {
        width:100%;
    }

    .artframe .column3 .item:nth-child(3) {
        grid-column: 2; grid-row: 2;
    }

    .artframe .column3 .item:nth-child(3) img {
        width:100%;
    }



    .artframe .order-column3 {
        display:grid; grid-template-columns: repeat(auto-fill, minmax(48%, auto)); row-gap: 10px;
    }

    .artframe .order-column3 .item:nth-child(1) {
        grid-column: 1/3;
    }

    .artframe .order-column3 .item:nth-child(1) img {
        width:100%;
    }

    .artframe .order-column3 .item:nth-child(2) {
        grid-column: 1; grid-row: 2;
    }

    .artframe .order-column3 .item:nth-child(2) img {
        width:100%;
    }

    .artframe .order-column3 .item:nth-child(3) {
        grid-column: 2; grid-row: 2;
    }

    .artframe .order-column3 .item:nth-child(3) img {
        width:100%;
    }


    #order-slide {
        width:100%;
    }

    #myframe1-slide {
        /* width: 80%; margin: 0 auto; */
    }

    #myframe2-slide {
        /* width: 80%; margin: 0 auto; */
    }


    .myframe-slide .btn-prev {
        position:absolute; left:0; top:55%; transform: translateY(-55%); width:60px; height:60px; z-index:10;
    }

    .myframe-slide .btn-next {
        position:absolute; right:0; top:55%; transform: translateY(-55%); width:60px; height:60px; z-index:10;
    }

    .order-slide-wrap {
        padding: 0 1rem;
    }

    .spec-table-cv img {
        width: 98%;
    }

    /* 자세히 보기 */
    .top-banner {
        margin-top: 0 !important;
    }

    /* 주문페이지 썸네일 */
    .slide-thumb {
        zoom: 0.7;
    }

    .slide-thumb img {
        border: 2px solid #fff; border-radius: 15%;
    }

    .slide-thumb img:hover {
        border: 2px solid #ccc;
    }


    .artframe .sizing .item {
        margin-bottom: 3rem;
    }

    .artluxe .sizing .item:nth-child(1) {
        width:100vw; text-align:center; grid-column: 1; grid-row: 1;
    }

    .artluxe .sizing .item:nth-child(2) {
        width:100vw; text-align:center; grid-column: 1; grid-row: 2;
    }

    .artluxe .sizing .item:nth-child(3) {
        width:100vw; text-align: center; grid-column: 1; grid-row: 3;
    }

    .artluxe .sizing .item:nth-child(4) {
        width:100vw; text-align: center; grid-column: 1; grid-row: 4;
    }

    .artluxe .sizing .item:nth-child(5) {
        width:100vw; text-align: center; grid-column: 1; grid-row: 5;
    }

    .fa-info-circle {
        display: none;
    }

    .slide-thumb {
        /* border-bottom: 1px solid #d6d6d6;  */
        padding-bottom: 20px;
    }

    .btn2-slide-prev {
        left: -50px!important;
    }

    .btn2-slide-next {
        right: -50px!important;
    }

    .slide-mbwidth {
        max-width: 185px!important;
    }

    /* 모바일 주문페이지 간격 */
    .fm-mborder-position01 {
        /* top: 30px; */
    }

    .fm-order-interval {
        margin-top: 0px!important;
        margin-bottom: 0px!important;
    }

    .fm-mb-row {
        display: flex;
        justify-content: space-between;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .fm-mborder-artluxe01 {
        bottom: 55px;
    }

    .mobile-dflex {
        display: flex;
        justify-content: space-between;
    }


}

@media screen and (max-width:992px) {
    .artframe .choice-box {
        overflow-x:auto;
    }

    .artframe .choice-box::-webkit-scrollbar {
        display: none;
    }

    .artframe .choice-box .container {
        width:1140px;
        display: flex;
        margin-right: 42px;
    }

    #qm-estimate {
        display:none;
    }

    #estimate-box {
        display: block !important;
    }
}

@media screen and (max-width:1200px) {
    #preview-img {
        width: 100%;
    }

    #preview-img2 {
        width: 100%;
    }
}

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

}


.quick-bar {
    right:10px !important; bottom:135px !important;
}
