@media screen and (max-width:1280px){



    /* review */
    .review_wrap .review_top .box .text {font-size: 1.8rem;}



    /* about */
    .about_2 .cont_box .text .big {font-size: 1.8rem;}
    .about_2 .cont_box .text .big br {display: none; }
    .about_2 .cont_box .text .small {font-size: 1.6rem; margin-top: 5px;}
    .price_tab .cont_box .point_list li br {display: none;}



}



@media screen and (max-width:1024px){



    /* padding กค margin style*/
    .padding_tb {padding:110px 0;}
    .padding_t {padding-top: 110px;}
    .padding_b {padding-bottom: 110px;}
    .margin_tb {margin:110px 0;}
    .margin_t {margin-top: 110px;}
    .margin_b {margin-bottom: 110px;}




    /* header */
    #header {height: 60px;}
    #header .hd_box {transform: unset; position: unset;}
    #header .hd_logo {left: 5%;}
    #header .hd_nav .nav {text-align: center; position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%);}
    #header .hd_nav .menu {display: block; margin:40px 0;}
    #header .hd_nav .menu > a {font-size: 20px; color: #fff;}
    .m_menu {display:block; position:absolute; right:3.5%; top:50%; width:24px; height:24px; transform: translate(-50%,-50%);
        text-decoration:none; z-index: 999;}
    .m_menu span {display:block; width:100%; height:2px; background:#111;
        color:transparent; position:absolute; top:50%; transform: translate(0,-50%); transition:all 0.5s;}
    .m_menu span:before,
    .m_menu span:after {content:""; position:absolute; left:0; top:0; height:2px; background:#111; transition:all 0.5s;}
    .m_menu span:before {top:-8px; width:100%;}
    .m_menu span:after {top:8px; width: 100%;}
    .m_menu.on span,
    #header.active .m_menu.on span,
    #header.header_main .m_menu.on span {background:rgba(225,245,136,0) !important;}
    .m_menu.on span:before,
    .m_menu.on span:before{top:0px; transform : rotate(45deg); background: #fff;}
    .m_menu.on span:after {top:0px; transform : rotate(-45deg); background: #fff;}
    .aside {
        width:100%; height:100%; background:rgba(0,0,0,.9);
        position:fixed !important; top:0; left:-100%; bottom:0; transition:all 0.5s; z-index: 998; overflow: hidden;
    }
    .aside.on {left:0;}



    #header.header_main .m_menu span,
    #header.header_main .m_menu span:before,
    #header.header_main .m_menu span:after,
    #header.active .m_menu.on span,
    #header.active .m_menu.on span:before,
    #header.active .m_menu.on span:after {background: #fff;}



    #header.active .m_menu span,
    #header.active .m_menu span:before,
    #header.active .m_menu span:after {background: #111;}



    #header.active .hd_nav .menu > a {color: #fff;}



    /* title */
    .body_tit {gap: 5px;}
    .body_tit .big {font-size: 3.2rem;}   
    .body_tit .small {font-size: 1.8rem;}
    .body_tit .top {font-size: 1.6rem;} 
    .body_tit .cmnt {color: #555; font-size: 1.4rem;}



    /* main */
    .main_top .main_top_tit p {font-size:4rem;}



    /* sub */
    .sub_top {margin-top: 60px; height: 220px;}
    .sub_top_tit .big p {font-size: 4rem; margin: 15px 0;}
    .sub_top_tit .small {font-size: 2.4rem;}
    .sub_box_tit p {font-size: 2rem;}



    /* review */
    .review_wrap .review_top {flex-direction: column;}
    .review_wrap .review_top .box {flex-direction: row;}
    .review_wrap .review_top .box .text {
        flex: 1; display: flex; flex-direction: column; justify-content: center;
    }
    .review_wrap .review_top .box .img {flex: 1;}

    /* client */
    .client_wrap .client_top {flex-direction: column;}
    .client_wrap .client_top .box {flex-direction: row;}
    .client_wrap .client_top .box .text {
        flex: 1; display: flex; flex-direction: column; justify-content: center;
    }
    .review_wrap .review_top .box .img {flex: 1;}


    /* count */
    .count_wrap .count_box {gap: 20px;}
    .count_wrap .count_box .box_inner {gap: 3px;}
    .count_wrap .count_box .box_inner .icon {width: 60px;}
    .count_wrap .count_box .box_inner .text2 {font-size: 3.2rem;}



    /* about */
    .about_1 .graph_box {max-width: 700px; margin:0 auto;}
    .about_1 .graph_box .text_box .text li {font-size: 1.6rem; padding-left: 13px;}
    .about_1 .graph_box .text_box .text li::before {width: 5px; height: 5px; top: 9px;}



    .about_2 .cont_box {flex-direction: column; max-width: 700px; margin: 0 auto;}
    .about_2 .cont_box .box {flex-direction: row; align-items: center;} 
    .about_2 .cont_box .box > div {width: 100%;}



    /* service */
    .service_1 .cont_box {gap: 60px;}
    .service_1 .cont_box .box {gap: 40px;}
    .service_1 .cont_box .img_box {flex-basis: 300px;}
    .service_1 .cont_box .text_box .title {font-size: 3rem;}
    .service_1 .cont_box .text_box .text {margin-top: 20px;}
    .service_1 .cont_box .text_box .text p {font-size: 1.6rem;}



    .service_2 .cont_box {gap: 20px;}
    .service_2 .cont_box .box .icon {width: 60px;}
    .service_2 .cont_box .box .text_box .text1 {font-size: 1.6rem;}
    .service_2 .cont_box .box .text_box .text2 {font-size: 1.8rem;}



    /* contact */
    .price_tab .cont_box {gap: 20px;}
    .price_tab .cont_box .box_tit {gap: 3px; height: 140px;}
    .price_tab .cont_box .box_tit .small {font-size: 1.6rem;}
    .price_tab .cont_box .box_tit .big {font-size: 2.4rem;}
    .price_tab .cont_box .box_list {gap: 20px; padding: 40px 30px;}
    .price_tab .cont_box .box_list li {font-size: 1.6rem;}



    .price_tab .cont_box .point_tit {font-size: 1.8rem; padding-left: 30px;}
    .price_tab .cont_box .point_tit::before {width: 24px; height: 24px;}
    .price_tab .cont_box .point_list li {padding-left: 30px;}
    .price_tab .cont_box .point_list li::before {height: 22px; height: 22px; left: 0;}




}




@media screen and (max-width:768px){



    /* img */
    .img_m {display: block;}
    .img_pc {display: none;}



    /* btn style */
    .btn_st01 {font-size: 1.6rem; height: 45px; max-width: 150px;}



    /* title */
    .body_tit {margin-bottom: 35px;}
    .body_tit .big {font-size: 2.8rem;}



    /* main */
    .main_top .main_top_tit p {font-size: 3rem;}



    /* sub */
    .sub_top_tit .big p {font-size: 3.5rem; margin: 10px 0;}
    .sub_top_tit .small {font-size: 2rem; margin-top: 30px;}
    .sub_box_tit {margin-bottom: 25px;}
    .sub_box_tit p {font-size: 1.8rem;}
    
    /* review */
    .review_wrap .review_top {max-width: 380px; margin:0 auto; gap:60px;}
    .review_wrap .review_top .box {flex-direction: column;}



    /* count */
    .count_wrap .count_box {flex-direction: column; gap: 40px;}
    .count_wrap .count_box .box {border-radius: 0; background:none;}
    .count_wrap .count_box .box:after {display: none;}
    .count_wrap .count_box .box_inner {position: unset; transform: unset;}



    /* compare */
    .compare_wrap .compare_box {flex-direction: column; gap: 40px; max-width: 400px;}    
    .compare_wrap .compare_box .box .tit .big {height: auto; font-size: 2rem;}
    .compare_wrap .compare_box .box .tit .small {font-size: 1.6rem;}
    .compare_wrap .compare_box .box .info li {height: 90px; font-size: 1.6rem;}
    .compare_wrap .compare_box .box .info li p {font-size: 1.4rem;}
    .compare_wrap .compare_box .box_inside .info:after {display: none;}
    
    /* about */
    .about_1 .graph_box {max-width: 400px;}
    .about_1 .graph_box .box {flex-direction: column; gap: 20px;}
    .about_2 .cont_box {max-width: 400px;}
    .about_2 .cont_box .box {flex-direction: column;}
    .about_3 .cont_box {flex-wrap: wrap;}
    .about_3 .cont_box p {width: calc(50% - 10px);}



    /* service */
    .service_1 .cont_box {max-width: 450px;}
    .service_1 .cont_box .box {flex-direction: column; align-items: flex-start; gap: 20px;}
    .service_1 .cont_box .img_box {flex-basis: auto; width: 100%;}
    .service_2 .cont_box {flex-direction: column; max-width: 300px; gap: 30px;}
    .service_3 .cont_box .box {flex-direction: column; gap: 20px;}
    .service_3 .cont_box .box .icon {flex-basis: auto; width: 70px;}
    .service_3 .cont_box .box .text_box .text1 {font-size: 2rem;}
    .service_3 .cont_box .box .text_box .text2 {font-size: 1.6rem;}
    .service_4 .img_box {max-width: 400px; margin: 0 auto;}
    .service_5 .cont_box {gap: 30px;}
    .service_5 .cont_box .box {text-align: left; padding: 40px 25px;}
    .service_5 .cont_box .box .title .num {font-size: 1.4rem;}
    .service_5 .cont_box .box .title .big {font-size: 2rem;}
    .service_5 .cont_box .box .text {font-size: 1.6rem; margin-top: 10px;}



    /* portfolio */
    .portfolio_wrap .video_list li {width: calc(50% - 10px)}
    .portfolio_wrap .btn_more {margin-top: 40px; font-size: 1.4rem; padding: 7px 0;}



    /* contact */
    .price_tab .tab_btn {margin-bottom: 40px;}
    .price_tab .tab_btn li {font-size: 1.6rem; height: 50px}
    .price_tab .cont_box {flex-direction: column; max-width: 400px; margin:0 auto;}
    .price_tab .cont_box .blank {display: none;}



}




@media screen and (max-width:480px) {



    .inner {width: auto; margin:0 20px}



    /* padding กค margin style*/
    .padding_tb {padding:80px 0;}
    .padding_t {padding-top: 80px;}
    .padding_b {padding-bottom: 80px;}
    .margin_tb {margin:80px 0;}
    .margin_t {margin-top: 80px;}
    .margin_b {margin-bottom: 80px;}



    /* title */
    .body_tit .top {font-size: 1.4rem;}
    .body_tit .big {font-size: 2.4rem;}
    .body_tit .small {font-size: 1.6rem;}
    .body_tit .small br {display: none;}




    /* header */
    #header {height: 55px;}
    #header .hd_logo img {height: 32px;}
    .m_menu {width: 20px; height: 20px; }
    .m_menu span {height: 2px;}
    .m_menu span:before, .m_menu span:after {height: 2px;}
    .m_menu span:before {top:-7px;}
    .m_menu span:after {top:7px;}




    /* scroll */
    #scroll_move {height: 55px; margin-top:-55px;}



    /* main */
    .main_top {height: calc(100vh - 72px);}
    .main_top .main_top_tit p {font-size: 2.3rem;}
    .main_top .main_top_tit p .point {padding: 3px;}



    /* sub */
    .sub_top {height: 150px;}
    .sub_top_full {height: calc(100vh - 72px);}
    .sub_top_tit .big p {font-size: 2.7rem;}
    .sub_top_tit .small {font-size: 1.8rem;}
    .sub_box_tit p {font-size: 1.6rem;}



    /* review */
    .review_wrap .review_top {gap: 40px;}
    .review_wrap .review_top .box .text {font-size: 1.6rem;}
    .review_wrap .review_top .box .text:before {width: 20px; height: 20px;}



    /* count */
    .count_wrap .count_box .box_inner {gap: 0;}
    .count_wrap .count_box .box_inner .text1 {font-size: 1.6rem;}
    .count_wrap .count_box .box_inner .text2 {font-size: 2.4rem;}



    /* about */
    .about_3 .body_tit .small br {display: block;}



    /* service */
    .service_1 .cont_box .text_box .title {font-size: 2.4rem;}



    /* portfolio */
    .portfolio_wrap .video_list {gap: 10px;}
    .portfolio_wrap .video_list li {width: calc(50% - 5px)}


    /* contact */
    .price_tab .tab_btn {margin-bottom: 40px; gap:10px}
    .price_tab .tab_btn li {font-size: 1.4rem; padding:5px;}



}