@media (max-width:1199px){
    #header .header-menu-part {
        margin-left: 30px;
    }
    #banner .banner-left{width: 50%;}
    #grow .grow-left{width: 55%;}
    #grow .grow-img{width: 36%;}
    .partner-body .partner-box{margin-bottom: 25px;}
    #contact-banner .banner-box {
        max-width: 50%;
    }
    #source {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .source-left{text-align: center;width: 100%;}
    .source-right{width: 65%;margin: 25px auto 0;}
    .source-right .title{text-align: center;}
    .source-right .desc{text-align: center;}
    .source-right .theme-btn{margin: 0 auto;}
    #box-section{padding: 3rem 0;}
    #box-section .source-right{margin: 0 auto 25px;}
    #category {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

@media (max-width:991px){
    #header .menu-bar{display: block;}
    #header .header-menu-part{margin: 0;display: flex;justify-content: end;}
    /* #header .header-menu-part .menu-part{width: 250px;background-color: #fff;position: fixed;top: 0;left: 0;height: 100%;align-content: start;padding: 25px;transform: translateX(-100%);transition: 0.5s all;} */
    #header .header-menu-part .menu-part{width: 100%;
        background-color: #fef4ea;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        align-content: center;
        padding: 25px;
        justify-content: center !important;
        text-align: center;
        transform: scale(0);
        transform-origin: 85% 5%;
        transition: transform 0.5s cubic-bezier(0.755, 0.05, 0.855, 0.06);
        will-change: transform;}
    #header .header-menu-part .menu{display: inline-block;
        z-index: 10;
        padding: 0;
        border: 0;
        background: transparent;
        outline: 0;
        cursor: pointer;
        border-radius: 50%;
        transition: background-color 0.15s linear;
    }
    #header .header-menu-part.nav--open .menu-part{transform: scale(1);}
    #header .header-menu-part .menu:hover,
    #header .header-menu-part .menu:focus {
        background-color: rgba(0, 0, 0, 0.5);
    }
    #header .header-menu-part .menu:hover .menuicon,
    #header .header-menu-part .menu:focus .menuicon{color: #fff;}
    .menuicon {
        display: block;
        cursor: pointer;
        color: #000;
        transform: rotate(0deg);
        transition: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    .menuicon__bar, .menuicon__circle {
        fill: none;
        stroke: currentColor;
        stroke-width: 3;
        stroke-linecap: round;
    }
    .menuicon__bar {
        transform: rotate(0deg);
        transform-origin: 50% 50%;
        transition: transform 0.25s ease-in-out;
    }
    .menuicon__circle {
        transition: stroke-dashoffset 0.3s linear 0.1s;
        stroke-dashoffset: 144.513262038;
        stroke-dasharray: 144.513262038;
    }
    .nav--open .menuicon {
        /* color: white; */
        transform: rotate(180deg);
    }
    .nav--open .menuicon__bar:nth-child(1),
    .nav--open .menuicon__bar:nth-child(4) {
        opacity: 0;
    }
    .nav--open .menuicon__bar:nth-child(2) {
        transform: rotate(45deg);
    }
    .nav--open .menuicon__bar:nth-child(3) {
        transform: rotate(-45deg);
    }
    .nav--open .menuicon__circle {
        stroke-dashoffset: 0;
    }
    #header .header-menu-part.openMenu .menu-part{transform: translateX(0);}
    #header .header-menu-part.openMenu .menu-part{clip-path: polygon(101% -1%, 101% 101%, -1% 101%, -1% -1%);}
    #header .header-menu-part .menu-part > .nav{gap: 0 !important;margin-bottom: 15px;}
    #header .header-menu-part .menu-part > .nav:last-child{margin-bottom: 0;}
    #header .header-menu-part .menu-part > .nav li{width: 100%;margin-bottom: 20px;}
    #header .header-menu-part .menu-part > .nav li:last-child{margin-bottom: 0;}
    #header .header-menu-part .menu-part > .nav li a{font-size: 1.3rem;}
    #header .header-menu-part .menu-part > .nav li .theme-btn{justify-content: center;font-size: 0.875rem;padding: 0.5em 1.320em;}
    #header .header-menu-part .menu-part > .nav.header-menu{width: 100%;}
    #header .header-menu-part .menu-part > .nav.auth-menu li{margin-bottom: 15px;}
    .banner-left .title{font-size: 3rem;}
    .theme-btn.large {
        font-size: 1rem;
        padding: 1rem 2rem;
    }
    #banner .banner-left {
        width: 55%;
    }
    #banner .banner-right {
        width: 45%;
    }
    .banner-left ul.gap-4{gap: 0 !important;}
    .banner-left ul li:not(:last-child){margin-right: 10px;}
    #community-board .community-body .community-box{width: 50%;border-bottom: 1px solid#fff;}
    #community-board .community-body .community-box:nth-child(2n) {
        border-right: 0 !important;
    }
    #community-board .community-body .community-box:nth-child(4n) {
        border-right: 1px solid#fff;
    }
    #community-board .community-body .community-box:nth-child(n+5) {
        /*border-bottom: 1px solid #fff;*/
        display:none;
    }
    #community-board .community-body .community-box:nth-child(n+3) {
        border-bottom: 0 !important;
    }
    #community-board{padding: 4rem 0;}

    #customers{padding-top: 50px;}
    #customers .customer-left {
        width: 100%;
        margin-bottom: 25px;
        text-align: center;
    }
    #customers .customer-logo{max-width: 100%;}
    #customers .customer-logo .logo-box {
        padding: 10px;
    }
    #contact-banner{padding-top: 5rem;padding-bottom: 5rem;}
    #contact-section .contact-section{flex-wrap: wrap;}
    #contact-section .contact-box{width: 100%;}
    #map-section .map-box{flex-wrap: wrap;}
    #map-section .map-box .map {
        flex: 0 0 100%;
    }
    #map-section .map-box .contact-info{flex: 0 0 100%;}
    .customer-slider-box .slider-img-box {
        width: 100%;
    }
    .customer-slider-box .slider-right {
        width: 100%;
        padding-left: 0;
    }
    #customer-banner,
    #inspiration-banner{height: calc(100vh - 68px);}
    #inspiration-banner .inspiration-banner-feature{display: none;}
}

@media (max-width:767px){
    #banner {
        padding: 3rem 0;
    }
    #banner .banner-left {
        width: 100%;
    }
    #banner .banner-right {
        width: 60%;
        margin: 35px auto 0;
    }
    #community-board .community-head{margin: 0 auto 45px;}
    #community-board .community-head .title {
        font-size: 1.5rem;
    }
    #community-board .community-body .community-box{padding: 25px;}
    
    #customers .customer-left h2 {
        font-size: 2rem;
    }
    #customers .customer-left p {
        font-size: 1rem;
    }

    #grow .grow-left{width: 100%;order: 2;}
    #grow .grow-img {
        width: 50%;
        margin: 0 auto 25px;
    }
    .theme-head .theme-title{font-size: 1.5rem;}
    #about .about-body .desc{font-size: 0.875rem;}
    #our-mission .our-mission-section .our-mission-left{margin-bottom: 25px;}
    #our-mission .our-mission-section .our-mission-left .title{font-size: 1.5rem;margin-bottom: 1.5rem;}
    #our-mission .our-mission-section .our-mission-left .desc{font-size: 1rem;}
    #footer .footer-menu{margin-bottom: 15px;}
    #about,
    #our-mission,
    #feature{padding-top: 30px;padding-bottom: 30px;}
    .partner-body .row > .col-md-6:last-child .partner-box{margin-bottom: 0;}
    #contact-banner .banner-box {
        max-width: 100%;
    }
    #contact-banner{padding-top: 3rem;}
    #contact-banner .banner-img{display: none;}
    #contact-banner .banner-box .title{font-size: 2rem;}
    #map-section{padding-top: 30px;padding-bottom: 30px;}
    #map-section .map-head {
        margin-bottom: 50px;
    }
    #map-section .map-head .title {
        font-size: 1.5rem;
    }
    #map-section .map-box .map iframe{height: 300px;}
    #map-section .map-box .contact-info{padding: 1.5rem;}
    #map-section .map-box .contact-info .info-box .title {
        font-size: 1.2rem;
        line-height: 1.30;
    }
    #customer-banner .banner-left .title {
        font-size: 2rem;
    }
    #customer-banner .banner-left .desc {
        margin: 25px 0;
    }
    #customer-slider-section .customer-slider .slick-list{padding: 0 50px;}
    #inspiration-banner .source-box{margin: 0 auto;}
    .source-right{width: 100%;}
    #category {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    #category .category-box{width: 45%;padding-top: 30%;margin-bottom: 15px;}
    #category .category-box .info{padding: 0 1rem;}
    #category .category-box .info p {
        font-size: 1.2rem;
    }
    #category .category-box .info .icon{font-size: 1rem;}
    #box-section {
        padding: 2rem 0;
    }
    .source-right .title {
        font-size: 2rem;
    }
    .source-right .desc {
        font-size: 1.1rem;
        margin: 1.5rem 0;
    }
    .source-right .theme-btn{width: 200px;}
    .banner-left ul li:not(:last-child){margin: 0 0 10px}
    .banner-left ul li{width: 100%;}
    .banner-left ul li .theme-btn{justify-content: center;}
    .imageTextSection .sectionRow:not(:last-child){margin-bottom: 3rem;}
    .imageTextSection .sectionRow .imageBox{width:100%;order: 2;}
    .imageTextSection .sectionRow .contentBox{width: 100%;margin-bottom: 1rem;}
}

@media (max-width:640px){
    .banner-left .title {
        font-size: 2.5rem;
    }
    .theme-btn.large {
        font-size: 0.8rem;
        padding: 0.7rem 1.5rem;
    }
    #community-board {
        padding: 2rem 0;
    }
    #community-board .community-body .community-box h3{font-size: 2rem;}
    #customers {
        padding-top: 35px;
    }
    #grow {
        padding-top: 20px;
        padding-bottom: 45px;
    }
    #grow .grow-left h2 {
        font-size: 1.3rem;
    }
    #grow .grow-left .btn-part{gap: 1rem !important;}
    #footer{padding-top: 2rem;padding-bottom: 2rem;}
    #footer .social-list ul{padding: 0 25px;}
    #footer .social-list ul li:not(:last-child) {
        margin-right: 25px;
    }
    #footer .social-list ul li a{font-size: 20px;}
    #partner {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    #partner .theme-head {
        margin-bottom: 35px;
    }
    #customer-banner .banner-left .title {
        font-size: 1.6rem;
    }
    #customer-banner .banner-left .theme-btn{font-size: 0.875rem;}
    #customer-slider-section {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .source-right .title {
        font-size: 1.5rem;
    }
    .source-right .desc {
        font-size: 1rem;
        margin: 1.2rem 0;
    }
    #inspiration-banner .source-box{padding: 30px;}
    #inspiration-banner .source-box .title {
        font-size: 2rem;
    }
    #inspiration-banner .source-box .desc {
        font-size: 1rem;
        margin: 15px 0 30px;
    }
}

@media (max-width:575px){
    #footer .footer-menu{width: 50%;}
    .customer-slider-box{margin: 0 5px;}
    #inspiration-banner .source-box{width: 100%;}
    .source-right .count-part{gap: 35px;}
    .source-right .theme-btn {
        width: 165px;
    }
    #banner .banner-right{display: none;}
    #footer .footer-menu{display: none;}
    #footer .social-list{margin: 0 auto 25px;}
    #footer .footer-bottom .footer-app{display: flex;}
    .contactBtn{width: 40px;height: 40px;font-size: 20px;bottom: 10px;right: 10px;}
    .imageTextSection {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .imageTextSection .sectionRow .contentBox .title {
        font-size: 1.3rem;
    }
}

@media (max-width:479px){
    #header{padding-top: 15px;padding-bottom: 15px;}
    #banner {
        padding: 2rem 0;
        min-height: auto;
    }
    .banner-left .title {
        font-size: 1.8rem;
    }
    .banner-left .desc{font-size: 0.875rem;}
    #community-board {
        padding: 1.5rem 0;
    }
    #community-board .community-head {
        margin: 0 auto 25px;
    }
    #community-board .community-body .community-box{padding: 15px;}
    #community-board .community-body .community-box figure {
        max-width: 90px;
    }
    #community-board .community-body .community-box h3 {
        font-size: 1.5rem;
    }
    #community-board .community-body .community-box p{font-size: 0.840rem;}
    /* #community-board .community-body .community-box {
        width: 100%;border: 0 !important;padding: 20px;
    } */
    #community-board .community-body .community-box:last-child{padding-bottom: 0;}
    #community-board .community-head .title {
        font-size: 1.2rem;
    }
    #community-board .community-head .desc{font-size: 0.875rem;}
    #customers .customer-logo .logo-box {
        width: 50%;
        padding: 20px;
    }
    #customers .customer-left h2 {
        font-size: 1.5rem;
    }
    #customers .customer-left p {
        font-size: 0.875rem;
    }
    #grow{padding-bottom: 30px;}
    #grow .grow-left h2 {
        font-size: 1.2rem;
    }
    #grow .grow-left p{font-size: 0.875rem;}
    #grow .grow-left .btn-part {
        margin: 20px 0 10px;
        gap: 0.5rem !important;
    }
    #grow .grow-left .btn-part li{width: 100%;}
    #grow .grow-left .btn-part li .theme-btn{justify-content: center;}
    #grow .grow-left span {
        font-size: .850rem;
    }
    /* .theme-btn.large {
        font-size: 0.7rem;
        padding: 0.5rem 1.2rem;
    } */
    #footer .footer-menu{width: 100%;}
    #footer .social-list ul {
        padding: 0 15px;
    }
    #footer .social-list ul li:not(:last-child) {
        margin-right: 20px;
    }
    #footer .social-list ul li a{font-size: 1rem;}
    .partner-body .partner-box .partner-logo{margin: 0 auto 30px;}
    .partner-body .partner-box .title {
        font-size: 20px;
        margin-bottom: 20px;
    }
    .partner-body .partner-box .desc{font-size: 0.875rem;}
    .theme-head{margin-bottom: 25px;}
    #our-mission .our-mission-section .our-mission-left .title {
        font-size: 1.2rem;
        margin-bottom: 1rem;
    }
    #our-mission .our-mission-section .our-mission-left .desc{font-size: 0.875rem;}
    .theme-head .theme-title {
        font-size: 1.2rem;
    }
    #about .about-body .desc {
        font-size: 0.850rem;
    }
    #contact-banner {
        padding-top: 2rem;
    }
    #contact-banner .banner-box .title {
        font-size: 1.5rem;
    }
    #contact-section .contact-box{padding: 20px 30px;}
    #contact-section .contact-box .title{font-size: 0.875rem;margin: 15px 0;}
    #contact-section .contact-box .desc{font-size: 0.875rem;margin-bottom: 15px;}
    #contact-section .contact-box .mobile{font-size: 0.875rem;}
    #contact-banner .banner-box .desc{font-size: 0.875rem;}
    #contact-section .contact-box .mobile.global {
        margin-bottom: 15px;
    }
    #contact-section .contact-box .theme-btn{margin-top: 25px;font-size: 0.875rem;padding: 0.6em 1.350em;}
    #map-section{padding-top: 15px;}
    #map-section .map-head {
        margin-bottom: 35px;
    }
    #map-section .map-head .title {
        font-size: 1.2rem;
    }
    #map-section .map-box .contact-info {
        padding: 1.2rem;
    }
    #map-section .map-box .contact-info .info-box .title {
        font-size: 1.1rem;
    }
    #map-section .map-box .contact-info .info-box:not(:last-child) {
        margin-bottom: 20px;
    }
    #map-section .map-box .contact-info .info-box a,
    #map-section .map-box .contact-info .info-box .address{font-size: 0.875rem;}
    #partner .theme-head {
        margin-bottom: 25px;
    }
    .theme-btn{padding: 0.30em 1.320em;}
    .customer-slider-box{padding: 10px;font-size: 14px;bottom: calc(100% + 10px);}
    .customer-slider-box .slider-img-box h3 {
        font-size: 1rem;
    }
    .customer-slider-box .slider-right{padding-top: 10px;}
    .customer-slider-box .slider-right p{font-size: 13px;}
    #customer-slider-section .customer-slider .slick-list {
        padding: 0 25px;
    }
    #customer-banner,
    #inspiration-banner{height: calc(100vh - 58px);}
    #inspiration-banner .source-box .title {
        font-size: 1.5rem;
    }
    #inspiration-banner .source-box .desc{font-size: 0.875rem;}
    #inspiration-banner .source-box .theme-btn{font-size: 1rem;}
    #source {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .source-right .title {
        font-size: 1.2rem;
    }
    .source-right .desc{font-size: 0.875rem;}
    .source-right .count-part p {
        font-size: 1.2rem;margin-bottom: 5px;
    }
    .source-right .count-part{margin-bottom: 1rem;}
    .source-right .count-part span{font-size: 0.875rem;}
    .source-right .theme-btn{font-size: 1rem;width: 145px;}
    #category .category-box {
        width: 100%;
        padding-top: 50%;
    }
    #community-board .community-body .community-box:nth-child(n+5){display: none;}
    #community-board .community-body .community-box:nth-child(n+3){border-bottom: 0;}
    #footer .footer-bottom .menu li{margin-bottom: 5px;}
    .imageTextSection .sectionRow:not(:last-child) {
        margin-bottom: 2rem;
    }
    .imageTextSection .sectionRow .contentBox .title {
        font-size: 1.2rem;
        margin-bottom: 0.5rem;
    }
    .imageTextSection .sectionRow .contentBox .desc {
        font-size: .9rem;
    }
}

@media (max-width:375px){
    #contact-section .contact-box {
        padding: 15px;
    }
    #contact-section .contact-box .contact-logo {
        width: 40px;
    }
    #contact-section .contact-box .desc{margin-bottom: 0;}
    #map-section .map-box .map iframe {
        height: 260px;
    }
    #customer-slider-section .customer-slider .slick-list {
        padding: 0 15px;
    }
}