@charset "UTF-8";

@media (max-width:1940px) {
  .level {width:100%;}
  .sub-menu ul {width:100%;}
}

@media (max-width:1920px) {
  .page-alarm .alarm-banner img{width:100%;}
 
}
@media (max-width:1700px) {
  .level {width:100%; flex-direction: column;}
  .level .view-level {width:100%;}
  .level .view-level {text-align:left;}
  .level .view-level .det {width:100%; text-align:left; margin:0; padding:25px 30px;}
  .level .view-level .det .label {padding-bottom:30px; font-size: 25px;}
  .level .chart {padding:30px; text-align: left; font-size: 25px;}
  .img-book {margin:-50px 0 -170px 0;}
  .level {height:auto;}
  .level .view-level .det .txt.web {display:none;}
  .level .view-level .det .txt.mobile {display:block; font-size:15px; line-height:30px;}
  .label-mobile {width:100%; display:Block; background-color:#3a8fce; color:#fff;font-size: 25px; font-weight:700;padding:40px 35px 80px 35px;}
  .info-book {padding:160px 35px 0 35px; height:auto;}
  .info-book .in {flex-direction: column;}
  .info-book .label {width:155px; font-size: 14px; padding-bottom:10px; border-bottom:1px solid #fff;}
  .info-book .num {font-size: 20px;}
  .info-book .num strong {font-size: 50px; line-height:60px;}
  .info-book .det {font-size:15px; line-height:30px;}
  .info-book:after {height:50px; bottom:-50px;}
  
  .banner .view-banner .list-num .num {font-size:140px;}
 
}
@media (max-width:1600px) {
  .function {width:100%;}
}

@media (max-width:1500px) {
  .step-write{width:100%; padding:0 10px 35px 10px;}
  .step-write .swiper-slide img {width:100%;}
  .write-book {padding:100px 0 110px 0; }
  .box-help.red {margin:-69px auto 0 auto;}
  .step-write .swiper-button-next, .swiper-button-prev {display:none;}
  .step-write .swiper-pagination {bottom:0;}
  .step-write .swiper-pagination-bullet {width: 64px; height: 22px; }
  .fix-top a {right:0; left:initial;}
  .banner .view-banner .list-num .num {font-size:110px;}
    
  .wrap-infor {padding-bottom:100px;}
 
  .function {padding:60px 30px 0 30px; margin:0;}
  .function .box-function {width:100%; padding:20px;}
  .function .box-function ol .badge {margin-left:-35px; line-height:60px; font-size:30px;}
  .function .box-function ol .badge strong {font-size:40px;}
  .function .box-function ol .strong-txt {font-size:25px;}
  .function .box-function ol .strong-txt em {margin:15px 0;}
  .function .box-function ol .strong-txt em:before {width:100%;}
  .function .box-function ol .det {font-size:15px; line-height:30px;}
  .box-help.pink {margin:-58px auto 0 auto;}
  .alarm-swiper {right:150px;}
}
@media (max-width:1400px) { 
  
  .alarm-infor {width:100%;}
 
}
@media (max-width:1380px) {
  .patent {padding:135px 30px 60px 30px}
  .patent .img-step {width:100%;}
  .help { padding:0 0 373px 0; width:100%; height:auto; flex-direction: column; overflow:hidden;}
  .help .label {width:100%; text-align: left; padding:30px 30px 25px;font-size: 25px;}
  .help .det {font-size: 24px;line-height: 38px;  width:auto; background-size:100% 100%;display:flex; justify-content: center; align-items: center; }
  .help .det span {padding:20px 35px 20px 125px;font-size: 24px;line-height: 38px;}
  .help .det span:before {width:77px; height:88px; left:30px; top:45px;}
  .wrap-help {padding:0 30px;}
  .box-help {width:100%; margin:-385px 0 0 0;flex-direction: column; height:auto;}
  .box-help .left {width:100%; padding:15px 30px;}
  .box-help .select {width:100%;font-size: 20px; background-size:22px 13px;}
  .box-help p {padding:18px 0 0 0;font-size: 25px;}
  .form  {padding:15px 20px;}
  .form .wrap-check {padding:0; margin-bottom:15px;}
  .form .wrap-check .label-checkbox {font-size: 15px;}
  .form .wrap-check .label-checkbox input {}
  .form .wrap-check a {font-size: 15px;}
  .form .form-input {display:flex; width:100%; border-bottom:none; flex-direction: column; padding:0;}
  .form .form-input label {font-size:15px; padding:8px 0; border-bottom:1px solid #6f6f6f; margin-bottom:8px;}
  .form .form-input input {padding:10px;font-size: 15px; width:100%;}
  .form .wrap-form {margin-top:25px;}
  .form .wrap-form .form-input {margin-top:25px; margin-bottom:13px;}
  .form .btn-button {width:100%; height:45px; font-size:23px;}
  .brand {margin:25px 0 0 0; padding:0 30px 20px 30px; width:100%;}
  .brand .label {margin-bottom:15px;}
  .brand .link {flex-direction: column;}
  .brand .link a {width:100%; height:110px;font-size: 15px;}
  .brand .link a img {width:160px;}
  .layout-footer {padding:25px 20px; height:auto;}
  .layout-footer .flex {flex-wrap:wrap; gap:10px;}
    
  .fix-top {width:100%; bottom:140px;}
  .fix-top a {left:initial; right:20px; width:48px; height:48px;}
  .introduce .swiper-label {width:100%; font-size: 25px; font-weight:700; line-height:80px; padding:0 30px;}
  .banner-introduce {height:auto;padding:40px 30px 50px 30px;}
  .banner-introduce img {Width:100%;}
  .intro-swiper .swiper-pagination {width:100%; text-align:center;}
  .panda .swiper-slide {width:140px;}
  .panda .swiper-slide + .swiper-slide {margin-left:25px;}
  .panda {padding:30px 0 0 0;}
  .write {display:none;}
  .txt-info {padding:100px 0 30px 0;font-size: 20px;
    line-height: 40px;}
  .txt-info span {display:block;}
  .txt-info br {display:none;}
  .info-write {padding:50px 0 0 0;}
  .info-write .title strong {font-size: 25px; padding-bottom:20px;}
  .info-write .title p {font-size:25px;}
  .write-img {display:flex; flex-direction: column; justify-content: center;align-items: center; padding:0 30px; gap:35px; padding-bottom:102px;}
  .write-img img {width:100%; max-width:452px;}
  .write-book .title {width:347px; height:90px; background-size:100% 100%; top:-40px;}
  .banner-benefit {height:auto; padding:40px 30px 50px 30px; }
  .banner-benefit .intro-banner2 {width:100%;}
  .banner-benefit .btn-view {display:none;}
  .view-benefit01 {padding:0 20px;}

}
@media (max-width:1200px) {
  body {letter-spacing: 0;}
  .layout-header {width:100%; height:100px; border-bottom:none; padding:0 30px;}

  .layout-header .list-menu{display:none;}
  .layout-header.white .link-menu {background:url(/images/ico-menu-w.png) no-repeat;}
  .link-menu {display:inline-block;width:22px; height:19px; background:url(/images/ico-menu.png) no-repeat;}
  .banner {height:844px; margin-top:-100px; padding-top:100px; background:url(/images/bg-banner-m.png) no-repeat; background-size:100% 100%;}
  .banner:before {display:none;}
  .banner .view-banner {padding:30px 30px 0 30px; width:100%;}
  .banner .view-banner .txt {font-size: 15px;}
  .banner .view-banner .title {margin:30px 0;font-size: 40px;}
  .banner .view-banner .title span {padding:0;}
  .banner .view-banner .list-num {flex-direction: column; align-items: flex-start; gap:50px;} 
  .banner .view-banner .list-num .label {padding-bottom:10px; border-bottom:1px solid #fff; width:160px;font-size: 14px;}
  .banner .view-banner .list-num .label span {display:inline-block;}
  .banner .view-banner .list-num .num {font-size: 50px;}
  .banner .view-banner .list-num .num span {font-size:20px;}
  .view-edu {width:100%; padding-bottom:60px;}
  .wrap-edu .label {height:80px; padding:0 30px;}
  .wrap-edu .label span {font-weight:700; line-height:80px;}
  .view-edu .txt {padding:30px 0 0 0; text-align: center;font-size: 15px;}
  .view-edu strong {margin:0; padding:40px 35px 0 35px; font-size: 40px; line-height:60px; background:url(/images/ico-beacon.png) no-repeat right 35px top 12px / 74px 74px;;}
  .view-edu strong span {padding:0; text-align:right;}
  .view-edu .list-ol {display:flex; flex-direction: column;  margin:55px 0 0 0; background:none; padding:0 35px; gap:50px;}

  .view-edu .list-ol li strong {width:74px; height:67px; background-size:100% 100%; position:absolute; transform:translateX(0);top:-30px; left:7px; background:url(/images/ico-num01-m.png) no-repeat;}
  .view-edu .list-ol li:nth-child(2) strong {background:url(/images/ico-num02-m.png) no-repeat;}
  .view-edu .list-ol li:nth-child(3) strong {background:url(/images/ico-num03-m.png) no-repeat;}

  .view-edu .list-ol li .box.web {display:none;}
  .view-edu .list-ol li .box.mobile {display:flex; align-items: center; justify-content: center; text-align:center;}
  .view-edu .list-ol li .box {padding:0; width:100%;font-size: 15px; height:110px;}
  .level .view-level {width:100%; text-align:left;}
  .level .view-level .det {width:100%;}
  .level .chart img {width:100%;}
  .img-book {padding:0 35px; }
  .img-book .swiper-slide {width:135px;}
  
  .img-book .swiper-slide + .swiper-slide {margin-left:25px;}
  
  .patent .title {background-size:113px 116px; padding-top:140px;font-size: 25px; line-height:40px;}

  
  .page-alarm .title{width:100%; font-size: 25px; font-weight:700; line-height:80px; padding:0 30px;}
  

  .alarm-infor {padding:510px 20px 0 20px;}
  .alarm-infor .txt-infor {font-size:15px; line-height:30px;}
  .alarm-infor .btn-help {margin:20px 0 10px 0; line-height:30px; width:150px; font-size:16px;}
  .alarm-infor .sub {font-size:10px; margin-bottom:50px;}
  .wrap-alarm-swiper {width:auto; left:30px; right:30px;transform:translateX(0); top:initial; bottom:66px;}
  .wrap-alarm-swiper .alarm-swiper {right:50%; transform:translateX(50%); top:0; width:355px; padding:0 50px 22px 50px;}
    .alarm-banner .mobile {display:block;}
    .alarm-banner .web {display:none;}
  
}


@media (max-width:400px) {

  .view-alarm {display:none;}
.view-benefit03 .web {display:none;}
.view-benefit03 .mobile {display:block;}
}