﻿@charset "utf-8";
/* CSS Document */
/*all*/
@media screen and (max-width: 1024px) {
	.mune{ display:none;}
	#hamburger{ display:block;}
	.bottomlist{ display:block;}
	.footer{ margin-bottom:52px;}
}

/*index*/
@media screen and (max-width: 1680px) {
    .header .logo{ padding:15px 0;}
    .header .mune .m-list a{ padding:30px 20px;}
    .iab .txt{ padding:50px;}
    .iab .txt .tit h3{ font-size:2.4em;}
    .iab .dots .dot h3 span{ font-size:32px;}
    .iab .dots .dot{ padding:24px;}
}
@media screen and (max-width: 1450px) {
    .header .mune .m-list a{ font-size:1.4em;}
	.header .logo img{ width:220px;}
	.banner .swiper-pagination-bullet{ width:30px; height:2px;}
	.banner .swiper-container-horizontal>.swiper-pagination-bullets,.banner  .swiper-pagination-custom,.banner  .swiper-pagination-fraction{ bottom:30px;}
    .footer .fo1 .link a{ font-size:1.4em; padding:0 40px;}
    .iab .dots .dot h3 span{ font-size:28px;}
    .prs .warp div img{ height:60px;}
}
@media screen and (max-width: 1250px) {
	.iab .txt{ padding:40px;}
	.iab .txt .tit h3{ font-size:2em;}
	.iab .txt .tit h4{ font-size:2em;}
	.iab .txt .t p{ font-size:1.4em;}
	.iab .txt .tit{ margin-bottom:20px;}
	.iab .txt .t a{ margin-top:30px; padding:12px 20px 12px 30px;}
    .iab .dots .dot{ padding:20px;}
     .prs .warp div img{ height:50px;}
      .prs{  padding:30px 0;}
}
@media screen and (max-width: 1024px) {
	.header .logo img{ width:160px;}
	#hamburger { top: 25px;}
	.iab,.iab>*{ display:block; }
	.iab{ overflow:hidden;}
	.iab .txt{ width:50%; float:left;}
	.iab .dots{ width:50%; float:left;}
	.iab .img{ width:100%; height:400px; clear:both;}
	.footer .fo1 .link a{ padding:0 30px;}
	 .prs .warp div img{ height:40px;}
}
@media screen and (max-width: 850px) {
	.iab .dots .dot{ padding:12px 20px;}
	.iab .dots .dot h3 span{ font-size:24px;}
	.iab .txt,.iab .dots{ width:100%; float:none;}
	.footer .fo1{ display:none;}
	.footer .fo2 p{  display:block;}
}
@media screen and (max-width: 650px) {
	.header .logo img{ width:120px;}
    #hamburger { top: 20px; right:15px;}
    .iab .txt{ padding:40px 20px;}
    .banner .swiper-container-horizontal>.swiper-pagination-bullets,.banner  .swiper-pagination-custom,.banner  .swiper-pagination-fraction{ bottom:30px;}
    .bottomlist ul li img{ width:25px; height:25px;}
    .footer{ margin-bottom:37px;}
}
@media screen and (max-width: 450px) {
	 .header .logo{ padding:10px 0;}
	 .header .logo img{ width:140px;}
	.banner .swiper-container-horizontal>.swiper-pagination-bullets,.banner  .swiper-pagination-custom,.banner  .swiper-pagination-fraction{ bottom:20px;}
    .iab .txt .t a{ margin-top:20px; padding:6px 20px 6px 30px;}
    .iab .txt .tit{ margin-bottom:10px;}
    .iab .txt .tit h3,.iab .txt .tit h4{ font-size:1.8em;}
}

/*about*/
@media screen and (max-width: 1680px) {
	.banners .warp2{ height:400px;}
	.banners .t h3{ font-size:2.4em;}
	.banners .t p{ font-size:2em;}
	.lists a{ padding:20px 20px;}
	.tits{ padding:40px 0;}
	.tits .tit h3{ font-size:2.4em;}
	.tits .tit h4{ font-size:2em;}
	.tits .t p{ font-size:1.4em;}
	.about-t .dots .dot{ padding:30px 50px;}
    .about-t .dots{ padding:40px 0;}
    .about-t .txt{ padding:50px;}
    .about-t .dots .dot .t h3 span{ font-size:30px;}
}
@media screen and (max-width: 1450px) {
	.about-t .dots .dot img{ height:40px;}
	.about-t .dots .dot{ padding:40px 40px}
}
@media screen and (max-width: 1250px) {
	.banners .warp2{ height:300px;}
	.banners .t h3{ font-size:2em;}
	.banners .t p{ font-size:1.8em;}
	.about-t .dots .dot .t{ width:140px;}
	.about-t .txt{ padding:30px 20px;}
	.about-t .dots .dot{ padding:40px 20px}
	.lists a{ font-size:1.4em;}
}
@media screen and (max-width: 1024px) {
	.about-t{ display:block;}
	.about-t .dots{ width:100%;}
	.about-t .dots .dot{ padding:20px 20px}
	.about-t .dots{ padding:0;}
	#m2 .lists{ display:none;}
}
@media screen and (max-width: 850px) {
    .tits .warp2{ display:block;}	
    .tits{ padding:30px 0;}
    .tits .tit{ width:100%; margin-bottom:15px;}
    .tits .t{ width:100%;}
    .tits .tit h3{ font-size:2em;}
    .tits .tit h4{ font-size:1.8em;}
}
@media screen and (max-width: 450px){
	.banners .warp2{ height:240px;}
	.about-t .dots .dot img{ height:30px;}
	.about-t .dots .dot .t h3 span{ font-size:24px;}
}

/*business*/
@media screen and (max-width: 1680px) {
	.business .dots .dot .img img{ width:40px;}
    .business .dots .dot{ margin:20px 0px 20px 70px; }
    .business .dots .dot .t h3{ font-size:1.6em;}
    .business .dots .dot .t p{ font-size:1.4em;}
}
@media screen and (max-width: 1250px) {
	.business .dots .dot .t h3{ margin-bottom:4px;}
	.business .dots .dot .img{ padding:5px; margin-left:-10px;}
    .business .dots .dot .t{ padding:0 0 0 20px;}
    .business .dots .dot{ padding: 15px 0; margin:15px 0px 15px 30px; width: calc(33.33% - 35px); }
    .business .dots .dot:nth-child(3n-2){ margin-left: 20px;}
}
@media screen and (max-width: 850px) {
	.business .dots .dot{ width: calc(50% - 35px); }
	.business .dots .dot:nth-child(3n-2){ margin-left: 30px;}
}
@media screen and (max-width: 650px) {
    .business .dots .dot{ width: calc(100% - 35px); }
}

/*intellectual*/
@media screen and (max-width: 1250px) {
    .intellectual .dots{ width: calc(100% + 20px); margin-left: -10px; padding: 40px 0 0 0 ;}
    .intellectual .dots .dot{ width: calc(25% - 20px);  margin: 10px 10px; }
    .intellectual .dots .dot .t p{ font-size:1.4em; margin-top:6px;}
}
@media screen and (max-width: 850px) {
	.intellectual .dots .dot{ width: calc(33.33% - 20px);}
	.intellectual{ padding-bottom:40px;}
	div.fy{ padding-top:20px;}
	div.fy a,div.fy span.current,div.fy span.disabled{ padding:4px 8px; }

}
@media screen and (max-width: 650px) {
	.intellectual .dots .dot{ width: calc(50% - 20px);}
}
@media screen and (max-width: 450px) {
	.intellectual .dots .dot{ width: calc(100% - 20px);}
}

/*enterprise*/
@media screen and (max-width: 1680px) {
	.enterprise .dots{ width: calc(100% + 30px); margin-left: -15px; padding: 40px 0 0 0 ;}
    .enterprise .dots .dot{ width: calc(25% - 40px);  margin: 10px 20px;}
    .enterprise .dots .dot .img img { box-shadow: 2px 2px 10px rgb(0 0 0 / 30%);}
}
@media screen and (max-width: 1250px) {
	.enterprise .dots{ width: calc(100%); margin-left: 0px; }
    .enterprise .dots .dot{ width: calc(25% - 20px);  margin: 10px 10px;}
    .enterprise .dots .dot .t p{ font-size:1.4em;}
}
@media screen and (max-width: 850px) {
	.enterprise .dots .dot{ width: calc(33.33% - 20px); }
	 .enterprise .dots .dot .img img { box-shadow: 2px 2px 5px rgb(0 0 0 / 30%);}
}
@media screen and (max-width: 650px) {
	.enterprise .dots .dot{ width: calc(50% - 20px); }
}
@media screen and (max-width: 450px) {
	.enterprise .dots .dot{ width: calc(100% - 20px); }
}

/*honor*/
@media screen and (max-width: 1680px) {
	
	.honor .dots .dot span{ padding:30px 20px;}
	.honor .imgs .di .t p{ font-size:1.6em;}
}
@media screen and (max-width: 1250px) {
	.honor .dots .dot{ width: calc(100%);}
	.honor .dots .dot p{ font-size:1.6em;}
    .honor .imgs .di .t p{ font-size:1.4em;}
    .honor .dots .dot span img{ width:24px;}
    .honor{ padding:40px 0;}
}
@media screen and (max-width: 650px) {
	.honor .imgs{ display:block; }
	.honor .imgs .di{ margin:0 auto;}
	.honor .dots .dot span{ padding:12px 10px;}
	.honor .dots .dot p{ padding:4px 6px;}
	.honor .imgs .di .t p{ margin-top:10px;}
}

/*environment*/
@media screen and (max-width: 1450px) {
	.environment .boxs .box .t p{ margin:15px 0 0 0;}
	.environment{ padding:40px 0;}
}
@media screen and (max-width: 1024px) {
	.environment .boxs .box .t p{ font-size:1.4em; margin-top:10px;}
	.environment .boxs .box .img{ border-radius:10px;}
	.environment .boxs{ width:100%; margin:0;}
	.environment .boxs .box{ width: calc(33.33% - 20px); margin: 10px;}
}
@media screen and (max-width: 850px) {
	.environment .boxs .box{ width: calc(50% - 20px);}
}
@media screen and (max-width: 450px) {
	.environment .boxs .box{ width: calc(100% - 20px);}
}

/*news*/
@media screen and (max-width: 1680px){
	.news-t .ndots .nd{ width: calc(33.33% - 40px); margin: 20px 20px;}
    .news-t .ndots .nd .t .more{ margin-top:15px;}
    .news-t{ padding:40px 0;}
}
@media screen and (max-width: 1250px){
	.news-t .ndots{ overflow:hidden; width: calc(100%); margin:0px;}
	.news-t .ndots .nd{ width: calc(33.33% - 20px); margin: 10px 10px;}
    .news-t .ndots .nd .t h3{ font-size:1.6em;}
}
@media screen and (max-width: 1024px){
	.news-t .ndots .nd{ width: calc(50% - 20px); }
}
@media screen and (max-width: 650px){
	.news-t .ndots .nd{ width: calc(100%); margin:10px 0;}
}

/*newsshow*/
@media screen and (max-width: 1550px) {
	.newsshow{ padding:60px 0;}
}
@media screen and (max-width: 1024px) {
	.newsshow .tit,.newsshow .btn{ padding:40px 20px;}	
	.newsshow .txt{ padding:20px;}
}
@media screen and (max-width: 600px) {
	.newsshow .tit h3{ font-size:1.6em;}
	.newsshow .tit .dot h4{ font-size:1em; padding:10px 2px;}
	.newsshow .tit{ padding:30px 20px 0 20px;}
	.newsshow .btn{ padding:0px 20px 30px 20px;}	
	.newsshow .btn a{ padding:10px 15px;}
	.newsshow { padding: 40px 0;}
	.newsshow .btn a { padding: 8px 10px;}
}

/*product*/
@media screen and (max-width: 1680px){
	.product-t .pboxs{ width: calc(100% + 20px); margin-left: -10px; }
    .product-t .pboxs .pb{ width: calc(25% - 20px); margin: 15px 10px; }
}
@media screen and (max-width: 1250px){
	.product-t .pboxs .pb .txt:after{top:4px; width:20px;  background-size:contain;}
    .product-t .pboxs .pb .txt p{ font-size:1.4em;}
    .product-t .pboxs .pb .txt{ padding:8px 30px 8px 12px;}
    .product-t{ padding:40px 0;}
}
@media screen and (max-width: 850px){
	 .product-t .pboxs .pb{ width: calc(33.33% - 20px); margin: 10px;}
}
@media screen and (max-width: 850px){
	 .product-t .pboxs .pb{ width: calc(50% - 20px);}
}
@media screen and (max-width: 650px){
	.ab-list .warp2{ display:block;}
	.lists{overflow:hidden;}
    .lists a{ padding:12px; text-align:center;  line-height:1.2; float:left; width:33.33%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}	
}
@media screen and (max-width: 450px){
	 .product-t .pboxs .pb{ width: calc(100% - 20px);}
}

/*productshow*/
@media screen and (max-width: 1680px){
	.productshow .txts{ padding-left:4%;}
}
@media screen and (max-width: 1450px){
	.productshow .txts .tit{  margin:20px 0;}
    .productshow .txts .tit h3{ font-size:2em; }
}
@media screen and (max-width: 1250px){
    .productshow .txts{ padding-left:0%;}
    .productshow{ padding:60px 0;}
}
@media screen and (max-width: 1024px){
    .productshow .imgs,.productshow .txts{ width:100%; float:none; max-width:650px;  margin:0 auto; padding:0;}
    .productshow .imgs{ margin-bottom:30px;}
    .productshow .txts .tit{  margin:0px 0 15px 0;}
    .productshow .txts .tit h3{ font-size:1.8em; }
    .productshow .txts .t p{ line-height:2;}
    #m4 .tits .tit a{ font-size:1.4em; margin-top:10px;}
}
@media screen and (max-width: 850px){
	.pro-plate img{ min-width: 1000px;}
	.pro-plate{ overflow-x: scroll;}
}
@media screen and (max-width: 650px){
	.productshow{ padding:40px 0;}
	.productshow .imgs .gallery-thumbs .p-n, .productshow .imgs .gallery-thumbs .p-p{ width:30px;}
	.productshow .imgs .gallery-thumbs{ padding:0 40px;}
	#m4 .tits .tit a{ margin-bottom:-30px;}
	.productshow .imgs .gallery-top{ margin-bottom:10px;}
	.productshow .txts .t table tr td{ padding: 5px;}
}
@media screen and (max-width: 450px){
	.productshow .imgs .gallery-thumbs .p-n, .productshow .imgs .gallery-thumbs .p-p{ width:20px; background-size:15px;}
	.productshow .imgs .gallery-thumbs{ padding:0 30px;}
	.productshow .txts .t p{ line-height:1.8;}
}

/*announcement*/
@media screen and (max-width: 1680px){
	.announcement-t{ padding:60px 0;}
}
@media screen and (max-width: 1250px){
	.announcement-t{ padding:40px 0;}
	.announcement-t .dots .dot{ padding:10px 0;}
	.announcement-t .dots .dot>*{width:120px;}
	.announcement-t .dots .dot .d1{ width: calc(100% - 360px)}
	.announcement-t .dots .dot>* p{ font-size:1.4em;}
}
@media screen and (max-width: 850px){
	.announcement-t .dots .dot>*{width:80px; padding:0 4px;}
	.announcement-t .dots .dot .d1{ width: calc(100% - 240px)}
}
@media screen and (max-width: 650px){
	.announcement-t .dots .dot>*{width:60px; padding:0 4px;}
	.announcement-t .dots .dot .d1{ width: calc(100% - 180px)}
}

/*contact*/
@media screen and (max-width: 1680px) {
	.contact-t .feedback{ padding:50px 50px 20px 50px;}
    .contact-t .feedback .tit h3{ font-size:2em;}
    .contact-t input, .contact-t textarea{ margin-top:25px;}
}
@media screen and (max-width: 1450px) {
	.contact-t .ctxts p{ font-size:1.6em;}
	#container{ height:480px;}
}
@media screen and (max-width: 1250px) {
	.contact-t .feedback{ padding:30px 20px;}
	 .contact-t .feedback .tit h3{ font-size:1.8em; margin-bottom:6px;}
    .contact-t input, .contact-t textarea{ margin-top:20px;}
    #container{ height:420px;}
}
@media screen and (max-width: 1024px) {
	.contact-t .cmf .map,.contact-t .feedback{ float:none;  width:100%;}
}
@media screen and (max-width: 850px) {
	.contact-t .ctxts .warp2{ flex-wrap: wrap; }
	.contact-t .ctxts .warp2 .ct{ width:50%; margin:10px 0; padding:0 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	.contact-t .ctxts p{ font-size:1.4em;}
	.contact-t .ctxts{  padding: 30px 0;}
}
@media screen and (max-width: 450px) {
	.contact-t .ctxts h3{ font-size:1.4em;}
	.contact-t .ctxts .warp2 .ct{ width:100%;}
	.contact-t .feedback .tit h3{ font-size:1.6em;}
}