*{margin:0;padding: 0;}
ul,ol{list-style:none;}
a{text-decoration:none;}
body{font-family:"微软雅黑";}


.banner {
		  position: relative;
		  width: 100%;
		  text-align: center;
		}
		
		.banner img {
		  width: 100%;
		  vertical-align: middle;
		}
		
		.banner-txt {
		  position: absolute;
		  top: 50%;
		  left: 5%;
		  transform: translateY(-50%);
		  color: #fff;
		  text-align: left;
		  width:50%; 
		}
		
		.banner h1 {
		  font-size: 3.5vw;
		  
		}
		
		
		.banner p {width: 60%;
		  font-size: 1.25vw; 
		  margin-top: 35px;
		}

		.banner-txt span {padding: 10px 25px;border: 1px solid #002fa7; background-color: #002fa7;color: #fff;font-size:18px;font-size: 1.5vw;}
		.banner-contact{margin-top: 5vw;}
		
		
		.sketch{width: 80%;margin: 50px auto;}
		
		
		@media screen and (max-width:768px){
			.banner-txt {
			  text-align: left;
			  width:80%; 
			}
			
			.banner h1 {
			  font-size: 24px;
			  
			}
			
			
			.banner p {width: 60%;
			  font-size: 12px; 
			  margin-top: 15px;
			}
			
		}
		
		
		.title-h2 h2{font-size: 2.5vw; text-align: center;margin: 20px; font-weight:bold;}
		.title-h2 p{font-size: 22px; }
		.title-h2 i{width:76px ;height:3px;background:#F36F2F;display: block;margin: 20px auto;text-align: center;}
		.sketch p{font-size: 18px;line-height: 1.6}
		.Product{width: 80%;margin: 0 auto;}
		.product-only{ background-color: #f8f9f9;margin-bottom: 25px;}
		h3{font-size: 28px;margin-bottom: 10px;}
		a h3{color:#002fa7;font-weight: bold;}
		a:hover h3{text-decoration:underline;}
		.text p{margin: 15px auto;line-height: 1.6; font-size: 20px;}
		.left-list ul li {margin-bottom: 10px;font-size: 20px;}
		.trait{display: flex;flex-wrap: wrap;justify-content: space-between;}
		.trait-left{width: 60%;margin: 20px;}
		.trait-right{width: 30%;margin: 20px;}
		.product-details{margin-bottom: 15px;}
		.product-details a{font-size: 24px;color: #002fa7;}
		.product-details:hover a{text-decoration:underline;}
		.right-img img {flex: 100%;max-width: 100%; }
		
		
		@media screen and (max-width:768px){
			.sketch{width: 80%;margin: 30px auto;}
			.title-h2 h2{font-size: 34px;}
			.title-h2 p{font-size: 16px;}
			.sketch p{font-size: 14px;}
			h3{font-size: 22px;}
			.Product{width: 90%;}
			.trait-left,.trait-right{width: 100%;}
			
		}
		
		
		.contact {width: 80%;margin: 30px auto;-position: center;color: #002FA7;text-align: center;margin-bottom: 50px;}
		.contact h2 {font-size: 3.5vw;font-weight:bold;}
		.contact p {color: #fff;margin: 3%;font-size: 1.2rem;}
		.contact-us{width: 20%;margin: 20px auto;line-height: 40px;background-color: #fff;border-radius: 10px; border:4px solid #002FA7;;}
		.contact-us:hover{background-color: #002fa7;}
		.contact-us p{color: #002FA7;font-size: 24px;}
		.contact-us p:hover{color: #fff;}
		
		@media screen and (max-width:768px){
			.contact h2 {font-size: 30px;}
			.contact-us{width: 50%;}
		}
		
		
		.FAQ-QA {width: 70%; margin: 20px auto 40px;}
		.faq-section {margin-bottom: 20px;}
		.faq-title:hover {background-color: #eee; transition: background-color 0.3s;}
		.faq-title {font-size: 28px; cursor: pointer; font-weight: bold; padding: 10px; border-radius: 5px;}
		.faq-title i.fa::before {color:#002fa7;content: "\f067";}/* + */
		.faq-title.open i.fa::before {color:#002fa7;content: "\f068"; }/* - */
		.faq-content {display: none; width: 95%;margin: 10px auto;}
		.faq-content p{margin-top: 5px; font-size: 16px;line-height:1.5;}
		.FAQ-QA i{float: right;margin-bottom: 20px;}
		
		@media screen and (max-width:768px){
			.FAQ-QA {width: 90%; margin: 20px auto;}
			.faq-title {font-size: 22px;}
		}
		
		.success{width:80%;margin:0 auto;}
		.blog-B-1{margin: 0 auto; background-color: #eee;transition: transform 0.3s, box-shadow 0.3s, margin-top 0.3s;}
		.success .blog-B-1 {border-radius: 10px;overflow: hidden;display: flex;flex-wrap: wrap;justify-content: flex-start;}
		
		.blog-img-1{width: 45%;}
		.success .blog-B-1 img {flex:100% ;max-width: 100%;display: block;}
		.success .blog-B-1 .text{width: 50%;}
		.blog-B-1 h3{padding: 10px;margin: 10px;font-size: 1.5rem;color: #002fa7;}
		.blog-B-1 p{padding-left: 10px;margin-left: 10px;line-height: 1.5rem;color: #111; font-size: 18px;}
			
		.more p{display: inline-block;background-color: #002fa7;color: #fff;transition: background-color 0.1s; border-radius: 10px;line-height: 40px;}
		.more p:hover {background-color: #fff;color: #002fa7;}
		.more{text-align: right;margin-right: 20px;}
		@media screen and (max-width:768px){
			.blog-B-1{width: 90%;}
			.blog-img-1{width: 100%;}
			.success .blog-B-1 .text{width: 100%;}
			.more{text-align: right;}
		}