@media screen and (min-width: 786px) and (max-width: 1600px) {
  .content {
    padding: 0 1.2rem;
  }
  .content_b {
    padding: 0 1.2rem;
    max-width: 1440px;
  }
  .swiper_content {
    padding: 10px 1.2rem;
  }
  .about_technology .main {
    margin-top: 20px;
  }
  .about_global img {
    transform: translate(0);
  }
}
@media screen and (min-width: 786px) and (max-width: 1440px) {
  .content {
    max-width: 1220px;
  }
  .content_b {
    max-width: 1220px;
  }
  .swiper_content {
    max-width: 1240px;
  }
  header .header_main nav .menu {
    gap: 20px;
  }
  .home_solution .items .item a {
    min-height: 510px;
  }
  .about_milestone .line i {
    width: 32%;
  }
  .about_milestone .rocket {
    width: 32vw;
  }
  .installer_offer .items .item {
    min-height: 510px;
  }
  .join_main .search-box form{
    flex-flow: wrap;
    gap: 1rem;
  }
  .product_spec .full_table table {
    display: block;
    overflow: auto;
  }
  header .header_main nav .menu > li > a {
    font-size: 15px;
  }
}
@media screen and (min-width: 786px) and (max-width: 1220px) {
  .content {
    max-width: 1000px;
  }
  .content_b {
    max-width: 1000px;
  }
  .swiper_content {
    max-width: 1020px;
  }
  .swiper_btns_full {
    gap: 1rem;
  }
  .swiper_btns_full div {
    width: 3.5rem;
    height: 3.5rem;
  }
  header .header_main .logo img {
    width: 200px;
  }
  header .header_main nav .menu {
    gap: 1rem;
  }
  header .header_main nav .menu > li > a {
    font-size: 14px;
  }
  header .header_main .btns .store {
    text-indent: -999px;
    overflow: hidden;
    padding: 0;
    gap: 0;
    padding: 10px;
    line-height: unset;
    border-radius: 8px;
  }
  header .header_main .btns .store::before {
    width: 20px;
    height: 20px;
  }
  header .header_main .btns .store::after {
    border-radius: 8px;
  }
  header .header_main .btns {
    min-width: 200px;
  }
  header .menu_product .main .items {
    gap: 2rem 20px;
  }
  .home_solution .items {
    grid-template-columns: repeat(2, 1fr);
  }
  .home_advantage .nav {
    margin-top: 0;
  }
  .home_advantage .home_advantage_swiper {
    margin-top: 0;
    padding-top: 0;
  }
  .home_advantage .imgs {
    width: 40%;
  }
  .posts .post .info .title {
    font-size: 20px;
  }
  .home_blog .list ul li a .title {
    font-size: 18px;
  }
  .home_offer .home_offer_swiper .swiper-slide {
    max-width: 380px;
  }
  .about_culture .nav ul li {
    gap: 15px;
  }
  .about_culture .nav ul li i {
    width: 3em;
  }
  .about_culture .nav ul li h3 {
    font-size: 22px;
  }
  .about_culture .nav ul li p {
    font-size: 1rem;
    line-height: 1.5;
  }
  .about_technology .about_technology_intro_swiper .swiper-slide strong {
    font-size: 2rem;
    min-width: 60px;
  }
  .about_technology .about_technology_intro_swiper .swiper-slide p {
    font-size: 1rem;
    line-height: 1.5;
  }
  .about_milestone .line i {
    width: 38%;
  }
  .about_milestone .rocket {
    width: 38vw;
  }
  .support_intro .support_intro_swiper .swiper-slide {
    max-width: 380px;
  }
  .installer_offer .items {
    grid-template-columns: repeat(2, 1fr);
  }
  .installer_solution .con2 i {
    max-width: 100px;
  }
  .product_grid_main .pro_banner > a {
    height: 400px;
  }
  ul.grid_products li.grid_product .img img {
    width: 70%;
    height: 70%;
  }
  ul.grid_products li.grid_product.grid_guide a {
    padding-right: 30px;
  }
  ul.grid_products li.grid_product.grid_guide .icon {
    display: none;
  }
  .category_banner .nav {
    max-width: 100%;
    overflow: auto;
  }
  .category_banner .nav ul li a {
    white-space: nowrap;
    padding: 15px;
    font-size: 15px;
  }
  .sustain_walk .content > .flex {
    gap: 2rem;
  }
  .sustain_family .main ul li div strong {
    font-size: 18px;
  }
  .sustain_family .main ul li div p {
    font-size: 15px;
  }
  .sustain_corporate .main ul li strong {
    max-width: 100%;
  }
  .square_btns {
    max-width: 98%;
  }
  .partner_products .nav ul li {
    font-size: 15px;
  }
  .product_feature ul li {
    padding: 2rem 1rem;
  }
  .product_feature ul li .icon {
    width: 40px;
    height: 40px;
    margin-bottom: 1rem;
  }
  .product_feature ul li strong {
    font-size: 20px;
  }
  .product_spec .left img {
    width: 100%;
  }
  .login_modalcontent {
    zoom: 0.8;
  }
  .join_main .list .row a span{
    margin-right: 1.2rem;
  }
  .partner_products .nav ul li{
    white-space: nowrap;
  }
  .partner_products .nav ul{
    overflow: auto;
    justify-content: left;
  }
  .dcmain .flex{
    flex-flow: wrap;
  }
  .dcmain .leftnav{
    width: 100%;
  }
  .dcmain .rightlist{
    width: 100%;
  }
}
@media screen and (min-width: 786px) and (max-width: 1000px) {
  .content {
    max-width: 786px;
  }
  .content_b {
    max-width: 786px;
  }
  .swiper_content {
    max-width: 806px;
  }
  .swiper_btns_full div {
    width: 3rem;
    height: 3rem;
  }
  header .header_main .flex {
    gap: 1rem;
  }
  header .header_main .logo img {
    width: 150px;
  }
  header .header_main nav .menu {
    gap: 12px;
  }
  header .header_main nav .menu > li > a {
    font-size: 13px;
  }
  header .header_main nav .sub-menu > li > a {
    font-size: 13px;
  }
  header .header_main .btns {
    min-width: unset;
    gap: 1rem;
  }
  header .header_main .btns .pcenter {
    margin: 0;
  }
  header .menu_product .main .items {
    gap: 20px;
    grid-template-columns: repeat(3, 1fr);
  }
  .posts .post .img .cat {
    left: 20px;
  }
  .posts .post .info .title {
    font-size: 18px;
  }
  .home_blog .main {
    gap: 12px;
  }
  .home_blog .posts {
    gap: 12px;
  }
  .home_blog .list .con {
    padding: 22px 12px;
  }
  .home_blog .list ul li a .title {
    font-size: 1rem;
  }
  .about_culture .nav ul li {
    padding: 1rem 0;
  }
  .about_global .nums .num span {
    font-size: 40px;
  }
  .about_milestone .about_milestone_swiper .swiper-slide strong {
    font-size: 22px;
  }
  .about_word .about_word_swiper .swiper-slide .info p {
    font-size: 18px;
    line-height: 1.5;
  }
  .blog_new .list .posts {
    gap: 20px;
    grid-template-columns: repeat(2, 1fr);
  }
  .cases_list .list .cases {
    grid-template-columns: repeat(3, 1fr);
  }
  .installer_offer .items {
    grid-template-columns: repeat(2, 1fr);
  }
  .installer_solution .con1 p {
    font-size: 1rem;
    line-height: 1.5;
  }
  li.sy_line_product .right > img {
    width: 70%;
    transform: translate(-4%, 25%);
  }
  ul.grid_products li.grid_product.grid_guide strong {
    font-size: 17px;
  }
  ul.grid_products li.grid_product.grid_guide a {
    padding: 20px;
  }
  .sustain_family .main ul li div {
    padding: 1.2rem;
  }
  .sustain_family .main ul li div strong {
    font-size: 16px;
  }
  .sustain_family .main ul li div p {
    font-size: 14px;
    line-height: 1.4;
  }
  .sustain_corporate .main ul li strong {
    font-size: 20px;
    line-height: 1.5;
    margin-bottom: 1rem;
  }
  .sustain_corporate .main ul li p {
    font-size: 16px;
    line-height: 1.4;
  }
  .sustain_corporate .main ul li {
    padding: 50px 20px;
  }
  .partner_advantage ul li {
    padding: 40px 20px;
  }
  .partner_advantage ul li strong {
    font-size: 22px;
  }
  .partner_advantage ul li p {
    font-size: 15px;
  }
  .partner_advantage ul li .img {
    width: 80px;
    height: 80px;
  }
  .partner_market .main ul li > div {
    padding: 20px;
  }
  .partner_market .main ul li > div strong {
    font-size: 20px;
  }
  .partner_market .main ul li > div p {
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
  .partner_market .main ul li.active > div {
    padding-bottom: 20px;
  }
  .partner_dealer .main > ul > li > strong {
    font-size: 22px;
  }
  .partner_dealer .main > ul > li > p {
    font-size: 15px;
  }
  .partner_dealer .main > ul > li .infos strong {
    font-size: 16px;
    margin-bottom: 0.4rem;
  }
  .partner_dealer .main > ul > li .infos ul li {
    font-size: 14px;
  }
  .product_feature ul {
    grid-template-columns: repeat(2, 1fr);
  }
  .product_feature ul li {
    aspect-ratio: unset;
  }
  .product_preview > .content > .flex {
    flex-flow: wrap;
  }
  .product_preview .left {
    width: 100%;
  }
  .product_preview .right {
    width: 100%;
    padding-top: 2rem;
  }
  .product_energy .right h2 {
    font-size: 40px;
  }
  .login_modal .login_modalcontent {
    width: 100%;
    height: 80vh;
  }
  .login_modalcontent > .flex {
    flex-flow: wrap;
  }
  .login_modal .login_modalcontent .left,
  .login_modal .login_modalcontent.changing .left {
    width: 100%;
    padding: 2rem 1.2rem;
    height: 40%;
  }
  .login_modal .login_modalcontent .right,
  .login_modal .login_modalcontent .right.register-block,
  .login_modal .login_modalcontent.changing .right {
    width: 100%;
    padding: 3rem 1.2rem;
    height: 60%;
    overflow: auto;
  }
  .login_modal .login_modalcontent .right.register-block .form {
    padding-left: 0;
    padding-right: 0;
  }
  .login_modal .login_modalcontent > .flex {
    min-height: unset;
  }
  .login_modal .login_modalcontent .left .logo {
    margin-bottom: 2rem;
  }
  .login_modal .login_modalcontent .left .logo img {
    width: 50%;
  }
  .login_modal .login_modalcontent .left .btns span {
    font-size: 0.75rem;
    padding: 1rem 2rem;
    text-align: left;
    max-width: 60%;
  }
  .login_modal .login_modalcontent .left .btns {
    text-align: center;
  }
  .login_modal .login_modalcontent .left .btns span:after {
    width: 48px;
    height: 48px;
  }
  .login_modal .login_modalcontent {
    top: unset;
    bottom: -150%;
    border-radius: 0;
    transform: translate(-50%, 0);
  }
  .login_popup .login_modal .login_modalcontent {
    bottom: 0;
    transform: translate(-50%, 0);
    top: unset;
    overflow: auto;
  }
  .login_modal .login_modalcontent .right > div > strong {
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
  }
  .login_modal .login_modalcontent .right > div > p {
    font-size: 13px;
  }
  .login_modal .login_modalcontent .right .form {
    margin-top: 1.2rem;
  }
  .login_modal .login_modalcontent .right .form input:not([type="checkbox"]),
  .login_modal .login_modalcontent .right .form textarea {
    font-size: 14px;
    padding: 0.7rem 1.2rem;
  }
  .login_modal .login_modalcontent .right .form select {
    font-size: 14px;
    padding: 0.7rem 1.2rem;
  }
  .remember_flex,
  .remember_flex a {
    font-size: 14px;
  }
  .login_modal .login_modalcontent .right .form input[type="submit"] {
    margin-top: 1.5rem;
  }
  .login_modal .login_modalcontent.changing .left .btns {
    display: none;
  }
  .login_modal .login_modalcontent.changing .right .form {
    margin-top: 2rem;
  }
  .login_modal .login_modalcontent .right .form select {
    background-size: 8px;
    background-position: right 15px center;
  }
  .login_modal .login_modalcontent.changing .right .form .text-right {
    width: 100%;
  }
  .login_modal .login_modalcontent .right.success-block > div > strong {
    font-size: 1.1rem;
  }
}
@media screen and (max-width: 1000px) {
  .home_advantage .main {
    flex-wrap: wrap;
    gap: 3rem 20px;
  }
  .home_advantage .main .nav {
    width: 100%;
    padding: 0;
  }
  .home_advantage .main .nav::before {
    width: 100%;
    height: 1px;
    top: unset;
    bottom: 1px;
  }
  .home_advantage .main .nav .line {
    display: none;
  }
  .home_advantage .main .nav ul {
    display: flex;
    gap: 12px;
    overflow: auto;
  }
  .home_advantage .main .nav ul li {
    margin: 0;
    border-bottom: 2px solid transparent;
  }
  .home_advantage .main .nav ul li.active,
  .home_advantage .main .nav ul li:hover {
    border-color: var(--theme_color);
  }
  .home_advantage .main .imgs {
    width: 48%;
  }
  .about_technology .main {
    flex-direction: column-reverse;
    margin-top: 3rem;
  }
  .about_technology .main .imgs {
    width: 80%;
  }
  .downmain form .col2 {
    width: 100%;
  }
}
