@media screen and (min-width: 992px) {
    .menu-right > li.category-product { display: none; }
    .menu-right > li:hover > ul { top: 100%; pointer-events: all; opacity: 1; visibility: visible; }
}

@media screen and (max-width: 1024px) {
    .banner-sub { display: none }
    .menu-left { width: 240px; }
    .list-mnl a { width: 238px; height: 80px; }
    .banner .slide-bn { margin-left: 239px; }
    .item-sp .text { padding: 10px; }
        .item-sp .text .price .fix, .l-nitem .text .price .fix, .item-sp .text .price small, .l-nitem .text .price small { margin-left: 5px; }
        .item-sp .text .price, .l-nitem .text .price { font-size: 16px; display: inline-block; }
    .tit-id h2 { font-size: 32px; }
    a.logo { min-width: 200px; }
    a.call-hl { padding-left: 35px; font-size: 32px; background-position: 0 0; }
    .banner .swiper-slide { height: 320px }
    .ct-ct .right { padding-left: 25px; }
    .if-it .lSSlideOuter .lSPager.lSGallery li:nth-of-type(3) { display: none; }
    .sp-ct .left .bot-sp { grid-template-columns: repeat(3, 1fr); grid-gap: 15px; }
    .if-it .lSSlideOuter .lSPager.lSGallery li, .if-it .icon-video { width: 65px !important; height: 65px; }
        .if-it .icon-video:after { width: 41px; height: 41px; top: 12px; left: 12px; }
    .if-it .icon-video { left: 40px }
    .if-it .lSSlideOuter .lSPager.lSGallery { padding-left: 115px }
    .if-it > .img { padding-bottom: 75px }
    .if-it .img.bgd .lSSlideOuter .lSPager.lSGallery li:nth-of-type(2):before { background: #43434366; content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; cursor: pointer; }
    .if-it .img.bgd .lSSlideOuter .lSPager.lSGallery li:nth-of-type(2):after { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); content: "\f141"; font: normal normal normal 14px/1 FontAwesome; font-size: 32px; color: #fff; cursor: pointer; }
    .slsp { margin-bottom: 15px; }
    .list-btn a { display: block; margin-bottom: 10px; text-align: center; margin: 0 0 10px !important }
        .list-btn a:last-child { display: flex; align-items: center; justify-content: center; min-height: 54px; padding: 10px; }
    .gh1-ct .right, .gh2-ct .right { width: 400px }
    .gh1-ct .left, .gh2-ct .left { width: calc(100% - 400px); padding-right: 15px }
    .code-fix .pick-code { padding: 3px 0 }
    .code-fix form button { font-size: 14px; width: 80px }
    .list-mnl { width: 240px; }
        .list-mnl a > span { padding-left: 0; }
        .list-mnl a span:after { right: 0; }
        .list-mnl > div > a { height: 79.2px }
    .ct-ct .left img { height: initial !important; }
    #imageGallery li { height: 311px; }
    .l-tnewsb .slider { grid-template-columns: repeat(3, 1fr); }
    .item-sp .text .dh { opacity: 1; visibility: visible; }
    .listsp-r .item .img { width: 60px; height: 60px; }
    .cls-popular { min-height: initial; }
}

@media screen and (min-width: 991px) {
    .menu-right ul > li:hover .sub-menu { opacity: 1; visibility: visible; }
}

@media screen and (max-width: 991px) {
    .gh1-ct .right, .gh2-ct .right,
    .gh1-ct .left, .gh2-ct .left { width: 100%; padding: 0; }
    .gh1-ct .right, .gh2-ct .right { margin-top: 15px; }
    .cover { position: fixed; background: rgba(0, 0, 0, 0.7); z-index: 1000; transform-origin: 50% 50%; transition: transform 300ms ease-in-out 0s; }
    .if-it .text, .if-it > .img { width: 100%; }
    .if-it .text { padding-left: 0; padding-top: 15px; }
    .sp-ct { display: block; }
    .language { display: none; }
    .head-menu { position: fixed; right: 0; z-index: 9999; visibility: visible; transition: .4s linear; transform-origin: 50% 50%; width: 300px; pointer-events: none; opacity: 0; height: initial; }
        .head-menu.open { opacity: 1; pointer-events: initial; transition-delay: 500ms; pointer-events: all; }
    .banner .slide-bn { margin-left: 0; border-radius: 0 0 20px 20px; }
    a.hotline { display: none; }
    .list-sp { grid-template-columns: repeat(3, 1fr); }
    .tit-id h2 { width: 350px; background-size: auto 100% !important; }
    .touch-menu { position: absolute; width: 26px; height: 26px; right: 0; top: 50%; border-radius: 4px; z-index: 1001; display: block; transform: translateY(-50%); }
        .touch-menu span { display: block; width: 24px; position: absolute; height: 2px; background-color: var(--main-color); left: 0; top: 13px; transform: translateY(-50%); transition: .3s linear; }
        .touch-menu.clicked span:nth-of-type(2) { display: none; }
        .touch-menu.clicked span:nth-of-type(1) { transform: rotate(45deg); top: 12px; left: -2px; }
        .touch-menu.clicked span:nth-of-type(3) { transform: rotate(-45deg); bottom: 12px; left: -1px; }
        .touch-menu.clicked { z-index: 999; }
        .touch-menu span:nth-of-type(1),
        .touch-menu span:nth-of-type(3) { content: ''; width: 30px; position: absolute; height: 2px; background-color: var(--main-color); left: 0px; top: 4px; transition: .3s linear; }
        .touch-menu span:nth-of-type(3) { top: initial; bottom: 2px; width: 28px; }
        .touch-menu.fixed { position: fixed; top: 20px; right: 20px; }
    .closed-menu { position: fixed; top: 33px; right: 41px; color: #ffffff; background: transparent; padding: 0; line-height: 1; font-size: 13px; width: 23px; height: 23px; text-align: center; font-size: 0; }
        .closed-menu:before { content: ''; width: 30px; height: 2px; background: var(--hover-color); position: absolute; left: -4px; top: 11px; transform: rotate(45deg); }
        .closed-menu:after { content: ''; width: 30px; height: 2px; background: var(--hover-color); position: absolute; left: -4px; top: 11px; transform: rotate(-45deg); }
    .bg-black.active { opacity: 1; visibility: visible; }
    .bg-black { display: block; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: #00000075; z-index: 9999; opacity: 0; visibility: hidden; transition: .3s linear; }
    .headct.flex-bet { padding-right: 50px; }
    .form-search input { width: 250px }
    .menu-left { display: none }
    .menu-right ul { width: 100%; display: block; padding: 0; }
    .menu-right > ul > li { display: block; padding: 0; width: 100%; margin-bottom: 0; border-bottom: 1px solid #cdcdcd; }
        .menu-right > ul > li.active > a { color: var(--hover-color); }
    .menu-right ul li:last-child { border-bottom: none; }
    .menu-right ul { margin-bottom: 0; }
        .menu-right ul li ul li a img { margin-right: 5px; }
    .menu-mobile li a, .menu-mobile li p { font-family: Sb; font-size: 16px; color: #fff; padding: 10px 15px; display: block; line-height: 1.3; text-transform: uppercase; text-align: center; margin-bottom: 0; }
    .menu-mobile li ul li a { text-transform: initial; font-size: 14px; padding: 10px 15px; }
    .menu-ct { position: relative; }
    .head-menu .btn-close { position: absolute; top: 10px; right: 10px; color: #fff; display: block; width: 30px; height: 30px; text-align: right; font-size: 24px; cursor: pointer; }
    .tit-id h2 { font-size: 28px; line-height: 1.2; }
    .list-newsid .item .img { width: 120px; }
    .list-newsid .item .text { width: calc(100% - 120px); }
    .footer-ct { display: block; overflow: hidden }
        .footer-ct .item { padding: 0; margin-bottom: 15px; }
            .footer-ct .item.menu-ft { padding-top: 0; width: 50%; float: left; margin: 0 0px 15px; padding: 0 15px; }
            .footer-ct .item:last-child { margin-bottom: 0; }
    .sp-ct > .left, .sp-ct > .right { width: 100%; }
    #imageGallery li { height: 675px; }
    .if-it .button-prev, .if-it .button-next { top: calc((675px - 64px)/2); }
    .sp-ct .left .head-sp { }
    .sp-ct .head-sp .right form { display: flex; align-items: center; }
        .sp-ct .head-sp .right form select { width: 200px; height: 38px; background: initial; -webkit-appearance: auto; -moz-appearance: initial; }
    .left .head-sp .left { margin-bottom: 0; }
    .sp-ct .head-sp .right form label { margin-right: 5px; }
    .page { display: block; text-align: center; }
        .page > span { display: block; margin-bottom: 3px }
    .news-ct .right { width: 240px; }
    .news-ct .left { width: calc(100% - 240px); }
        .news-ct .left .tt { display: block; }
    .news-ev { margin-bottom: 20px; }
    .list-newsk .item .img { width: 130px; }
    a.call-hl { text-align: left; padding-left: 52px; }
    .list-newsk .item .text { width: calc(100% - 130px); }
    .if-it .lSSlideOuter .lSPager.lSGallery { padding-left: 70px; }
    .if-it .icon-video { left: 0; }
    .gh1-ct .left { width: 100%; padding-right: 0; margin-bottom: 0; }
    .gh1-ct .right { width: 100% }
    .hotline-gh { display: none; }
    .head-top.fixed { position: fixed; top: 0; left: 0; right: 0; z-index: 100; animation-name: fadeInDown; animation-duration: .5s; padding-top: 10px; }
        .head-top.fixed ~ .head-menu.open { top: 90px; }
            .head-top.fixed ~ .head-menu.open .closed-menu { top: 28px; }
    .menu-right { padding-left: 0; }
        .menu-right > li { display: block; padding: 0; position: relative; border-bottom: 1px solid #cdcdcd; }
            .menu-right > li > p,
            .menu-right > li > a { display: inline-block; padding: 10px 0; }
            .menu-right > li > ul li a { background: transparent; }
            .menu-right > li.category-product > p { color: #fff; font-family: B; margin: 0; }
            .menu-right > li:last-child { border-bottom: none; }
            .menu-right > li > i { margin-bottom: 0; position: absolute; right: 5px; top: 14px; color: #fff; width: 20px; height: 20px; text-align: right; transition: .2s linear; }
            .menu-right > li > ul { position: relative; right: 0; top: 0; width: 100%; min-width: auto; opacity: 1; pointer-events: all; display: none; transition: initial; background: #75c8f1 }
                .menu-right > li > ul li:last-child a { border-bottom: none; }
                .menu-right > li > ul li a { color: #fff; }
    .sub-product { background: #94d5f5; }
    ul.menu-right { width: 100%; display: block; }
    .gt-htd { padding: 15px 0; margin-bottom: 15px; }
        .gt-htd > p { font-size: 20px; }
        .gt-htd .item { display: block; }
            .gt-htd .item .text { padding: 0 0 15px 0; }
    .footer { background-size: auto 100%; background-position: center; padding-top: 90px; }
    section.gt { padding-bottom: 0; }
    .news-ct .left .tt .newstt-top { margin-top: 15px; }
    .l-tnewsb .slider { grid-template-columns: repeat(2,1fr); }
    #cover, .closed-menu { display: block; }
    section.map { margin-bottom: 15px; }
    .item-map iframe { height: 350px; }
    section.form-cont { padding-bottom: 15px; }
    section.top-prj { padding: 15px 0; }
    section.ds-sp { padding-bottom: 30px; }
    .head-top { padding: 15px 0; }
    .event_mobile { width: 40px; height: 40px; position: absolute; right: 0; top: 0; }
        .event_mobile:before { content: ''; width: 15px; height: 1px; background: #fff; position: absolute; top: 19px; left: 14px; }
        .event_mobile:after { content: ''; height: 15px; width: 1px; background: #fff; position: absolute; top: 12px; left: 21px; transition: all 0.5s; }
        .event_mobile.active:after { transform: rotateY(90deg); }
    .sub-product { position: relative; left: 0; top: 0; opacity: 1; pointer-events: all; visibility: visible; background: #94d5f5; border: none; }
        .sub-product ul li { padding: 0 10px; }
            .sub-product ul li:before { display: none; }
    .open-content .text { width: calc(100% - 20px); }
    .open-content ._detail iframe { height: 419px; }
}

@media screen and (max-width: 767px) {
    .fix-tool a:nth-of-type(3) { background: var(--main-color); }
    body { padding-bottom: 40px; }
    p.gh span, a.gh span { top: -5px; right: 21px; line-height: 22px; }
    .open-content .text { width: calc(100% - 20px); }
    .open-content ._detail iframe { height: 200px; max-height: 80%; }
    .head-menu { background: transparent; height: 100%; }
    #cover, .closed-menu { display: block; }
    .touch-menu span:nth-of-type(1),
    .touch-menu span:nth-of-type(3),
    .touch-menu span { background: #fff; }
    .banner .swiper-slide { height: initial; }
    .gh2-ct h1 { font-family: M; }
    header { margin-bottom: 0; z-index: 100; }
    .banner .slide-bn { border-radius: 20px }
    .headct.flex-bet { display: block; padding-right: 0; position: initial; }
    .head-top { position: relative; padding: 0 0 10px; }
    a.logo { min-width: initial; display: block; text-align: center; position: relative; z-index: 99; padding: 5px 0 15px; }
    .head-top:before { left: 0; right: 0; bottom: 0; height: 50px; background: var(--main-color); position: absolute; content: ''; z-index: 1; }
    .form-search { z-index: 2; width: 60%; margin-left: 20%; }
    .touch-menu { right: auto; left: 15px; bottom: -1px; top: auto; border: #000000; }
    .form-search input { width: 100%; border: none; padding: 6px 40px 5px 10px; }
    .touch-menu span:after { display: none }
    .gh-head { position: absolute; bottom: 10px; right: 15px; }
        .gh-head .content-ghf, .bg-brown { display: none }
    p.gh, a.gh { font-size: 0; background: initial; position: relative; padding-top: 0; width: 32px; height: 32px; color: #fff; }
        p.gh:before, a.gh:before { content: "\f07a"; font: normal normal normal 14px/1 FontAwesome; position: absolute; color: #fff; left: 0; font-size: 30px; z-index: 9; }
    .mn-afbn { display: block; margin-bottom: 15px; }
    .afbn { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 10px; }
    section.banner { margin-bottom: 15px; position: relative; z-index: 99; margin-top: 15px; }
    .topprj .list-a .item { margin: 0 2.5px; padding: 9px 18px; font-size: 14px; }
    .afbn .item { display: block; padding: 5px; border: 1px solid #d0d0d0; border-radius: 15px; text-align: center; }
        .afbn .item span { display: block }
            .afbn .item span:first-child { margin-bottom: 3px; height: 58px; overflow: hidden; }
        .afbn .item h3 { margin-bottom: 0; font-family: R; font-size: 14px; font-weight: 400; }
        .afbn .item span img { max-width: 100% }
    section.top-prj { padding: 0px 0 20px; }
    .list-sp { grid-template-columns: repeat(2, 1fr); grid-gap: 15px; margin-bottom: 15px; }
    .item-big .item-sp:first-child { margin-bottom: 15px; }
    .tit-id > a { display: none }
    .tit-id h2 { width: 100% }
    .dsp-ct > a { text-align: center; display: block; color: #2cb1f3; font-family: 'R'; font-size: 14px; margin-bottom: 0; line-height: 1; }
        .dsp-ct > a i { margin-left: 5px; font-weight: bold; line-height: 1 }
    section.ds-sp { padding-bottom: 15px; }
    .tit-id h2 { background: #2cb1f3 !important; padding: 5px 10px 5px 50px; position: relative; border-radius: 20px; line-height: 1; font-size: 20px; }
    .item-sp .text .price small, .l-nitem .text .price small { display: block; line-height: 1.5; margin-left: 0; }
    .ds-sp.table-t h2 > span { width: 32px; height: 32px; }
    .list-newsid { display: block; margin: 0 -10px 15px; }
    .footer-ct .item.social { position: initial; }
    .list-newsid .item:first-child { margin-bottom: 15px }
    .footer { background: #edfdff; padding: 15px 0; margin: 0; }
    .footer-ct { background-color: transparent; padding: 0 }
    footer.tc { margin-top: 0 }
    a.seemore { border-radius: 20px; font-size: 14px; padding: 7.5px 19.5px; }
    section.news-id { padding: 0 0 15px 0; }
    .topprj h2 { font-size: 30px; }
    .sp-ct { display: block; }
        .sp-ct > .left { width: 100%; padding-right: 0; margin-bottom: 15px; }
        .sp-ct > .right { width: 100%; }
        .sp-ct .head-sp .right form label { display: none; }
    .mobile { display: block; }
        .mobile .dsmn-mn p.name, .mobile .bl > p.name, .sp-ct > .right .new-item p.name, .news-ct .dmtt p.name, .videol p.name { background: #f5f5f5; position: relative; font-family: 'R'; }
    .sp-ct .head-sp .right form select { width: 100%; background: #fff; }
    .mobile .dsmn-mn p.name:before, .mobile .bl > p.name:before, .sp-ct > .right .new-item p.name:before, .news-ct .dmtt p.name:before, .videol p.name:before { content: ''; display: block; position: absolute; top: 18px; right: 15px; border: 8px solid transparent; border-top-color: #645764; }
    .news-ct { display: block; }
    .sp-ct > .right .toggle { display: none; }
    .dsmn-mn .list-a, .d-bl { border: 1px solid #d0d0d0; border-top: 0; display: none; }
    .mobile .dsmn-mn { margin-bottom: 15px; }
    .mobile { margin-bottom: 15px; }
    .head-menu { display: flex; width: 100%; }
    .menu-right { width: 100%; max-height: calc(100% - 120px); overflow-y: auto; }
    .menu-mobile { background: var(--main-color); overflow-y: auto; }
        .menu-mobile .sub-menu { display: none; border-top: 1px solid #cdcdcd; background: #75c8f1; }
        .menu-mobile li { position: relative; }
    .head-top.fixed ~ .head-menu.open { top: 50px; }
        .head-top.fixed ~ .head-menu.open .closed-menu { top: 14px; }
        .head-top.fixed ~ .head-menu.open .menu-right { max-height: calc(100% - 50px); }
    .d-bl { padding: 20px 15px 30px }
    .sp-ct .left .head-sp { margin: 0 -15px 15px -15px; }
    .sp-ct > .right .new-item, .news-ct .right .dmtt, .news-ct .right .videol { border-radius: 0; }
    .sp-ct > .right .dsmn-mn, .sp-ct > .right .bl { display: none; }
    .news-ct .left { width: 100%; padding-left: 0; margin-bottom: 20px; }
    .list-newstt .item { display: block }
        .list-newstt .item .img { width: 100%; margin-bottom: 15px }
        .list-newstt .item .text { width: 100%; padding: 0; }
            .list-newstt .item .text h3, .tt .news-ev .text h3 { font-size: 18px; margin-bottom: 10px; }
    section.news .text .content { margin-bottom: 10px; }
    .list-newsk .item .text > a, .tt .item .text > a, .newstt-top .item .mobile > a { margin: 15px auto; }
    .list-newsk .item { display: block; }
        .list-newsk .item .img { width: 100%; margin-bottom: 15px; }
        .list-newsk .item .text { width: 100%; padding-left: 0; }
    .news-ct .right { width: 100%; }
        .news-ct .right .dmtt { margin-bottom: 15px }
        .news-ct .right .videol { margin-bottom: 0 }
    .menu-li { padding: 10px 0; }
    .mnli-ct { display: inline-block; line-height: 1.3; }
    .gt-htd .item { display: block; margin: 0; }
        .gt-htd .item .img { width: 100%; margin-left: 0; margin-bottom: 20px; }
        .gt-htd .item .text { width: 100%; padding: 0; margin: 0; margin-bottom: 15px; }
    .list-gtcl, .list-imghtd { display: block; }
        .list-gtcl .item, .list-imghtd .item { margin-bottom: 15px; }
            .list-gtcl .item:last-child, .list-imghtd .item:last-child { margin-bottom: 0; }
    .ct-ct { display: block; }
        .ct-ct .left { width: 100%; margin-bottom: 15px; }
        .ct-ct .right { width: 100%; padding-left: 0; }
    section.map { display: block; margin-bottom: 15px; }
        section.map .item { margin-bottom: 20px; }
    .form-cont .form-group { margin-bottom: 10px; width: 100% !important; margin-left: 0 !important; }
    .l-tnewsb h3 { font-size: 20px; }
    .news-ct .left .text-detail { margin-bottom: 15px; }
    .if-it > .img { width: 100%; margin-bottom: 20px }
    .if-it > .text { width: 100%; padding: 0 }
    .list-btn { display: flex; }
        .list-btn a { white-space: initial; margin: 0 2px 0 0 !important; display: block; border-radius: 0; padding: 35px 10px 5px; }
        .list-btn > a:last-child { margin-right: 0 !important }
        .list-btn .mobile { margin-bottom: 0 }
    .sp-ct > .right .new-item { margin-bottom: 0; }
    .list-btn .mobile a { background: #ff0000; height: 100%; }
    .if-it .lSSlideOuter .lSPager.lSGallery li, .if-it .icon-video { width: 81px !important; height: 81px }
    .if-it > .img { padding-bottom: 90px }
    .if-it .icon-video:after { width: 45px; height: 45px; left: 18px; top: 18px }
    .if-it .lSSlideOuter .lSPager.lSGallery { padding-left: 37% }
    .if-it.novideo .lSSlideOuter .lSPager.lSGallery { padding-left: 0; }
    .if-it .icon-video { left: calc(37% - 90px) }
    .list-splq .lSSlideOuter { margin-bottom: 0; }
    section.splq { margin-bottom: 20px; }
    a.logo-ft { text-align: center; margin-bottom: 10px; }
    .code-fix { padding: 0 }
    .form-gt { border: 0; border-radius: 0; margin-bottom: 0; }
        .form-gt p.name, .form-gt .price { padding: 12px 0 }
    .dssp { display: none }
    .gh-mobile span.slsp { font-size: 15px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #d0d0d0; line-height: 1 }
    section.gh1 { padding: 0px 0 15px; }
    .gh1-ct h1 { margin-bottom: 12px }
    .gh-mobile .item { display: flex; padding-bottom: 15px; margin-bottom: 10px; border-bottom: 1px solid #d0d0d0; }
        .gh-mobile .item .img { width: 82px; padding: 0; background: #f6f7f9; border: 1px solid #cdcdcd; display: flex; align-items: center; }
        .gh-mobile .item .text { width: 180px; padding: 0 10px; }
        .gh-mobile .item .lst-bt { width: calc(100% - 82px - 180px) }
        .gh-mobile .item .img a { height: 100%; display: flex; align-items: center; justify-content: center; }
        .gh-mobile .item .img img { max-width: 100% }
        .gh-mobile .item .text h3 { font-family: R; margin-bottom: 5px; font-size: 15px; font-weight: 400; }
        .gh-mobile .item .text .price { font-family: B; font-size: 18px; line-height: 1.2; margin-bottom: 10px; display: block; }
        .gh-mobile .item .text .vat { font-family: R; font-weight: 400; font-size: 13px; display: block; }
        .gh-mobile .item .text .price .fix { margin-left: 10px; color: #2cb1f3 }
        .gh-mobile .item .text .price small { display: block; font-family: R; color: #898989; text-decoration: line-through; }
    .gh-mobile .down-app, .gh-mobile .up-app { width: 26px; height: 26px; display: block; border: 1px solid #898989; display: flex; align-items: center; justify-content: center; }
    .gh-mobile .form-flex { display: flex; justify-content: flex-end; margin-bottom: 10px; }
        .gh-mobile .form-flex input { width: 30px; height: 26px; border: 1px solid #898989; border-left: 0; border-right: 0; text-align: center; font-size: 14px; }
    .gh-mobile .recycle { font-size: 20px; color: #f44336; display: flex; justify-content: flex-end; }
    .gh1-ct .mobile { margin-bottom: 0 }
    .code-fix form input { border-radius: 25px }
    .code-fix form button { border-radius: 0 25px 25px 0 }
    .code-fix .pick-code { border-radius: 15px }
    .gh1-ct .right > a { padding: 15px; line-height: 1; border-radius: 0; }
    .form-gt .price p span { font-family: B; font-size: 18px }
    .gh2-ct .left { width: 100%; padding-right: 0; }
    .gh2-ct .right { width: 100%; }
        .listsp-r, .gh2-ct .right p.name { display: none; }
        .gh2-ct .right .spr { border: 0; border-radius: 0; }
    .tggh { padding: 0; }
        .tggh p.shipp { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #d0d0d0; }
        .tggh p { font-size: 16px; margin-bottom: 10px; }
            .tggh p span { font-family: Sb; font-size: 16px; }
            .tggh p.shipp span { font-family: R; max-width: 150px; text-align: right; font-size: 14px; }
    .gh2-ct .right.gh3 .tggh { display: block; }
    .gh2-ct .left button { width: 100%; padding: 10px; line-height: 1; }
    section.gh2 { padding: 0px 0 15px; }
    a.dm { white-space: nowrap; width: 100%; text-align: center; margin-left: initial; transform: initial; }
    section.gh2.prgh3 { margin-bottom: 0; padding: 10px 0 30px; }
    .contact-r .ctr p { font-size: 16px; }
    .contact-r { border-radius: 0; }
    .head-top.fixed a.logo { display: none; }
    .topprj .list-a a { text-align: center; }
    .topprj .list-a { margin-bottom: 15px; }
    .back-top { width: 35px; height: 35px; bottom: 55px; right: 15px; top: initial; }
    .cls-popular { min-height: initial; }
    .item-sp .text { padding: 6px; }
    .item-sp .img { padding: 0; }
    .item-sp .text h3 { min-height: 57px; font-family: 'R'; font-weight: 400; }
    .item-sp .text .dh { display: block; opacity: 1; visibility: visible; font-size: 14px; }
    .slide-tprjid .item-sp .text { min-height: 125px; }
    .newsid-ct h2 { font-size: 30px; }
    .list-newsid .item .text p.time span { font-size: 13px; line-height: 1; font-family: 'R'; }
    span.cal { background-position: 1px 4px; }
    .list-newsid .item .text h3 { font-size: 15px; line-height: 1.3; margin-bottom: 3px; }
    .list-newsid .item .img { width: 100px; }
    .list-newsid .item a { height: initial; }
    .list-newsid .item .text { width: calc(100% - 100px); padding-left: 10px; }
        .list-newsid .item .text p.time { margin-bottom: 3px; }
        .list-newsid .item .text p:not(.time) { font-size: 14px; max-height: 40px; }
    .list-newsid .item:first-child .text h3 { font-size: 20px; margin-bottom: 0; }
    .footer-ct .item.menu-ft { padding-top: 0; }
    .copyright { padding: 10px 0; font-size: 14px; }
    .sp-ct .left .top-sp h1 { font-size: 20px; }
    .sp-ct .left .top-sp { margin-bottom: 15px; }
        .sp-ct .left .top-sp h2 { font-size: 16px; line-height: 1.3; margin-bottom: 10px; }
        .sp-ct .left .top-sp img { max-width: 100%; height: initial; }
    .sp-ct .head-sp .right select { width: 100%; }
    .sp-ct .left .bot-sp { grid-gap: 15px; }
    .view-tt-prd { grid-column: 1/3; }
    section.sp { padding-bottom: 15px; }
    #imageGallery li { height: 345px; }
    .if-it .text .price span.o-fix { font-size: 16px; margin-left: 10px; }
    .if-it .text .price span.fix { width: initial; padding: 0 10px; }
    section.gt { padding-bottom: 15px; }
    .gt-htd { padding: 0; margin-bottom: 15px; }
        .gt-htd h1 { text-align: left; font-size: 20px; margin-bottom: 5px; }
        .gt-htd > p { text-align: left; font-size: 16px; line-height: 1.4; margin-bottom: 5px; }
        .gt-htd .item .text p { font-family: 'R'; line-height: 1.4; }
    iframe { margin-bottom: -10px; }
    .gtcl h2 { font-size: 20px; margin-bottom: 15px; }
    .list-gtcl p { font-size: 14px; line-height: 1.4; font-family: 'R'; }
    .gtcl { margin-bottom: 20px; }
    .img-htd { margin-bottom: 0; }
        .img-htd h2 { font-size: 20px; }
    .list-newsk .item .img a { display: block; height: 100%; }
    .time-day { margin-bottom: 10px; }
    .tit-detail h1 { font-size: 20px; }
    .time-day span, .time-day span.tag { font-size: 14px; }
        .time-day span.tag { margin-left: 15px; }
    .tit-detail { margin-bottom: 15px; }
    .likeshare #fb-root { display: none !important; }
    .topnews-b p.name { font-size: 20px; font-family: 'Sb'; margin-bottom: 15px; }
    section.news { padding-bottom: 15px; }
    .form-cont h2, section.contact, .list-itct, .ct-ct .right > p { margin-bottom: 15px; }
    .form-cont button { padding: 8px 48px; font-size: 16px; }
    section.form-cont { padding-bottom: 15px; }
    .form-cont textarea { margin-bottom: -5px; }
    .grid-load-search { grid-template-columns: repeat(2,50%); }
    .product-search { margin-bottom: 15px; }
    .top-gh { display: grid; grid-template-columns: repeat(3,calc(100%/3)); }
        .top-gh p { margin-right: 0; padding: 0 15px; }
            .top-gh p:nth-of-type(2):before { width: 115px; }
            .top-gh p:nth-of-type(3):before { width: 115px; right: calc(50% - 115px); }
    .gh2-ct .left select, .gh2-ct .left input { height: 35px; font-size: 14px; }
    .gh2-ct .left .form-group.w-50 { width: calc(50% - 7.5px); }
    .m-2 { margin-left: 15px; }
    .gh2-ct .left textarea { font-size: 14px; }
    .gh2-ct .form-group.last-f label.radio-inline { margin-bottom: 0; font-size: 14px; margin-right: 5px; padding-left: 25px; }
    .form-group .radio-inline .checkmark:after { width: 14px; height: 14px; top: 2px; left: 2px; }
    .form-group .radio-inline .checkmark { width: 20px; height: 20px; }
    .gh2-ct .form-group.last-f label.radio-inline:last-child { margin-bottom: 0; }
    .gh2-ct .left.gh3 p { font-size: 29px; }
    .alrt-payment { position: fixed; z-index: 9999; left: 0; bottom: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; transition: all 0.5s ease; }
        .alrt-payment.active { pointer-events: all; opacity: 1; }
            .alrt-payment.active span { bottom: 15px; }
            .alrt-payment.active.success span { background: #5cb85c; color: #ffffff; }
        .alrt-payment span { padding: 5px 0; font-size: 14px !important; font-weight: 400; color: red; font-family: R !important; width: calc(100% - 30px); background: #ffffff; text-align: center; border-radius: 5px; display: block; z-index: 10000; margin: auto; margin-top: -50px; position: relative; transition: all 0.5s ease; position: absolute; left: 15px; }
        .alrt-payment:before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.5); z-index: 9; }
    .gh2-ct h1.alertsuccess { font-size: 35px; }
    .article-order-success .tggh { padding: 15px; }
    .article-order-success .contact-r { margin-bottom: 15px; }
        .article-order-success .contact-r .ctr { padding: 15px; }
    section.gh3 { padding: 15px 0 0 0; }
    .article-order-success { padding-bottom: 0; }
    .preview-cart button,
    .preview-booking button { border: none; background: var(--main-color); color: #fff; padding: 15px; line-height: 1; border-radius: 0; font-size: 18px; text-transform: uppercase; display: block; width: 100%; }
    .closed-menu { top: 84px; left: 17px; }
    .fix-tool { display: flex; width: 100%; right: 0; bottom: 0; }
        .fix-tool a { width: 25%; border-radius: 0; margin-top: 0; color: #fff; }
            .fix-tool a img { width: 25px; }
    .item-sub { display: block; margin-bottom: 10px; padding-bottom: 10px; }
        .item-sub .img { width: 100%; margin-bottom: 8px }
        .item-sub .text { width: 100% }
        .item-sub .img img { margin-right: 0 }
        .item-sub .text h3 { padding-top: 0; }
            .item-sub .text h3 a { padding: 0; font-size: 18px; }
    .sub-product { padding: 10px }
    .footer-ct .item.menu-ft { width: 100% }
}

@media (min-width: 601px) and (max-width: 767px) {
    .head-menu { height: 100%; align-items: start; }
        .head-menu .menu-right { height: 100%; overflow-y: auto; max-height: initial; }
    .closed-menu { bottom: 11px; }
    .list-sp { grid-template-columns: repeat(3, 1fr); }
    .list-newsid .item:first-child { display: flex; }
        .list-newsid .item:first-child .img { width: 200px; }
        .list-newsid .item:first-child .text { width: calc(100% - 200px); padding-left: 10px; }
    .footer-ct { display: grid; grid-template-columns: 50% 50%; }
        .footer-ct > * { grid-column: initial; grid-row: inherit; }
        .footer-ct .item.menu-ft,
        .footer-ct .item.social { grid-column: initial; grid-row: initial; }
        .footer-ct .item.infor-footer { grid-row: initial; grid-column: 1/3; }
    .top-gh p br { display: none; }
    .top-gh p:nth-of-type(2):before,
    .top-gh p:nth-of-type(3):before { width: 200px; }
    .top-gh p:nth-of-type(3):before { right: calc(50% - 200px); }
    .list-imghtd { grid-template-columns: repeat(2, 1fr); display: grid; grid-gap: 15px; }
    .sp-ct { display: block; }
    .if-it > .text,
    .if-it > .img { width: 50%; }
    .if-it > .text { padding-left: 15px; }
    #imageGallery li { height: 319px; }
    .if-it .button-prev, .if-it .button-next { top: calc((319px - 64px)/2); }
    .list-newstt .item, .list-newsk .item { display: flex; }
        .list-newstt .item .img, .list-newsk .item .img { width: 150px; }
        .list-newstt .item .text, .list-newsk .item .text { width: calc(100% - 150px); padding-left: 15px; }
            .newstt-top .item .mobile > a, .list-newsk .item .text > a { display: none; }
    .tt .news-ev .item { display: flex; }
    .tt .news-ev .img { width: 200px; }
    .tt .news-ev .text { width: calc(100% - 200px); padding-left: 15px; }
        .tt .news-ev .text > a { display: none; }
    .ct-ct .left { margin: 0 }
        .ct-ct .left .img { display: none; }
}

@media screen and (max-width: 600px) {
    .preview-cart,
    .preview-booking { width: 100vw; position: fixed; bottom: 0; left: 0; z-index: 99; background: #fff; padding: 15px 0 0 0; box-shadow: 0 0 15px -5px rgba(0,0,0,0.5); transition: all 0.5s ease; }
        .preview-cart .form-gt,
        .preview-cart .code-fix { padding: 15px 15px 0 15px; }
    .preview-booking { padding-top: 0; }
    .btn-toogle-cart,
    .btn-toogle-booking { width: 60px; height: 25px; border: 1px solid var(--main-color); border-radius: 30px; background: var(--main-color); position: absolute; left: calc((100% - 60px)/2); top: -35px; }
        .btn-toogle-cart:before,
        .btn-toogle-cart:after,
        .btn-toogle-booking:before,
        .btn-toogle-booking:after { content: ''; position: absolute; top: 10px; width: 20px; height: 2px; background: #ffffff; display: block; transition: all 0.5s ease; }
        .btn-toogle-cart:before,
        .btn-toogle-booking:before { transform: rotate(30deg); left: 10px; }
        .btn-toogle-cart:after,
        .btn-toogle-booking:after { transform: rotate(-30deg); right: 11px; }
        .btn-toogle-cart.hide:before,
        .btn-toogle-booking.hide:before { transform: rotate(-30deg); }
        .btn-toogle-cart.hide:after,
        .btn-toogle-booking.hide:after { transform: rotate(30deg); }
    .preview-booking .tggh,
    .preview-cart .tggh { padding: 15px 15px 0 15px; }
    .preview-booking .contact-r { border-left: none; border-right: none; border-top: none; }
        .preview-booking .contact-r .ctr { padding: 10px 15px; }
    .btn-send-order .alrt-contact { padding: 0; margin: 0; }
    .sp-ct .left .bot-sp { grid-template-columns: repeat(2, 1fr); }
}

@media screen and (max-width: 420px) {
    .open-content ._detail iframe { height: 221px; max-height: 80%; }
    .if-it .button-prev, .if-it .button-next { top: calc((345px - 64px)/2); }
    .change-color { display: grid; grid-template-columns: repeat(5,1fr); padding-left: 1px; margin: 0 -5px; }
        .change-color p.name { grid-column: 1/6; margin-right: 0; }
        .change-color > * { margin: 0 5px; margin-bottom: 10px; }
    .inline-radio label img { max-height: 70px; }
    .change-color .inline-radio span { width: calc(100% + 2px); height: calc(100% + 2px); top: -1px; left: -1px; }
    .inline-radio label{width:100%;height:100%;}
}

@media screen and (max-width: 376px) {
    .if-it .button-prev, .if-it .button-next { top: calc((345px - 64px)/2); }
}
