@import url(iconfont.css);
@import url(ui.css);
@import url(swiper.min.css);
@import url(jquery.fancybox.min.css);
@import url(pc.css);
@media screen and (max-width: 767px) {
    body {min-width: 320px; padding-top: 60px; }
    .container {width: auto; padding: 0 15px;}
    .m-header{ display: flex; }
    .header{ display: none; }

    .banner{ background: url(../images/bg2.jpg) no-repeat center / cover; height: 500px;  padding-top: 100px; }
    .banner h3{ font-size: 20px; margin-bottom: 15px;}
    .banner h2{ font-size: 40px;}

    .in-about{ margin-top: 20px; position: relative; }
    .in-about:before{ font-size: 80px;}
    .in-about .text{margin-right: 0; }

    .in-pro{position: relative; padding: 80px 0 50px; }
    .in-pro:before{ font-size: 80px;}
    .in-pro .prev{ left: 20%; }
    .in-pro .next{ right: 20%; }

    .number{margin-bottom: 0; }
    .number h2{ font-size: 40px; }
    .number h3{ font-size: 40px;  }
    .number .lg4{ margin-bottom: 30px; }

    .in-ab{ padding-top: 30px; }

    .in-life .container{ padding: 0; }
    .in-life-con{ flex-wrap: wrap;}
    .in-life-con .pic{ flex:100%; order: 100 }
    .in-life-con li{ height: 130px; }
    .in-life-con li:nth-child(9),.in-life-con li:nth-child(10),.in-life-con li:nth-child(11){ margin-bottom: 10px; }
    .in-life-con .text{ flex:100%; }
    .in-life-con .text h2{ font-size: 40px; }

    .banner-sub{height: 300px; padding: 0 15px; }
    .banner-sub .text{ bottom: 50px; font-size: 40px; }
    .banner-sub h1{  font-size: 24px;}

    .section{ padding: 25px 0; }
    .list-1 .more{ margin-top: 10px; }

    .help1 dl dt{ height: auto; padding: 15px 0;}
    .help1 dl dd{ margin-top: -15px;}

    .message{ padding: 15px; margin-top: 20px; }
    .message h2{ font-size: 20px; line-height: 1.5; margin-bottom: 15px; }
    .message p{ font-size: 16px; line-height: 1.5; }
    .formgroup{ flex-wrap: wrap; margin-bottom: 15px; }
    .formgroup input{ flex:100%; margin-right: 0;  }
    .formgroup input:last-child{  margin-top: 15px;  }
    .message .tel{  margin-top: 20px; }

    .contact1 form{ margin:0 0 30px 0; }
    .share{  margin-top: 20px;}
    .share h3{ font-size: 20px; flex:0 0 180px; }

    .why1 .text{ padding-right: 0; }
    .why1 .img-center{ margin-top: 20px; }

    .why2 ul{ flex-wrap: wrap;}
    .why2 li{ flex:100%; margin-right: 0; margin-bottom: 20px; }

    .why3 .con{ flex-wrap: wrap; }
    .why3 .con .text{ flex:100%; margin-right: 0; margin-bottom: 20px;}
    .why3 .con .pic{ flex:100%; margin-bottom: 20px;}
    .why3 .con ul{ flex:100%; margin-left: 0; }

    .ship2 li:first-child a{ margin-top: 0;}
    .ship2 li .text{ padding: 25px;}

    .ship3{ flex-wrap: wrap;  }
    .ship3 .text{margin-right: 0;}
    .ship3 .text h2{ font-size: 24px;}
    .ship3 ul{ flex:100%; }

    .ship4{ margin-top:20px;  }
    .ship4 h2{  font-size:20px; }
    .ship4 .lan{ height: 10px; }

    .banner2{ margin-top: 0; }

    .proshow1{ padding: 0 0 30px; }
    .proshow1 .text{ padding-right: 0;}
    .proshow1 .text h2{ font-size: 24px; }
    .proshow1 .text2 h2{ font-size: 24px; margin-bottom: 10px; line-height: 1.6; }
    .proshow1 .text2 h3{ font-size: 24px; }
    .proshow1 .text2 h4{ font-size: 28px;}

    .proshow2{ padding: 30px 0; }
    .proshow2 .items{ padding-right: 0; }
    .proshow2 .tits h2{ font-size: 24px; margin-bottom: 15px; }
    .proshow2 .tits p{ line-height: 1.6; margin-bottom: 15px; }

    .info-content{ padding:30px 15px 0; }
   

}