﻿.bannerBox { padding: 50px 0; height: 550px; background: url(../images/banner_bg.png) no-repeat center top; background-size: 100% 100%; }
.bannerBox h2 { font-size: 38px; text-align: center; color: #FFFEEE; line-height: 60px; }
.bannerBox h1 { display: block; width: 800px; margin: 20px auto; }
.bannerBox p { width: 850px; margin: 0px auto; font-size: 34px; font-weight: bold; color: #FFFEEE; text-align: center; letter-spacing: 2px; line-height: 64px; background: linear-gradient(90deg,rgba(255,255,255,0),#FF4000,rgba(255,255,255,0)); }

section { padding: 30px 0; }

.boxBg1 { background: url(../images/box_bg1.png) no-repeat center top / cover; }
.boxBg2 { background: url(../images/box_bg2.png) no-repeat center top / cover; }

.box .container { padding: 30px; box-sizing: border-box; background: rgba(255,255,255,.9); border: 8px solid #FFD999; border-radius: 20px; box-shadow: inset 0 0 20px #FFA000; }

.boxTit { display: flex; justify-content: center; align-items: center; width: 100%; height: 64px; background: linear-gradient(90deg,rgba(255,255,255,0),#FF2000,#FF2000,rgba(255,255,255,0)); margin-bottom: 20px; }
.boxTit span { font-size: 40px; font-weight: bold; color: #FFFFFF; text-align: center; letter-spacing: 2px; margin: 0 10px; }
.boxTit img { display: block; height: 30px; }

.yuyue { display: flex; justify-content: center; flex-wrap: wrap; }
.orderBox { width: 50%; padding: 30px; box-sizing: border-box; background: linear-gradient(0deg,#DD0000,#FF4000); border-radius: 20px 0 0 20px; }
.orderBox .orderTit { font-size: 14px; line-height: 1.2; text-align: center; }
.orderBox .orderItem { display: flex; justify-content: space-between; align-items: center; margin: 20px auto;  }
.orderBox #province, .orderBox #city { width: 49%; }
.orderBox select { width: 100%; height: 46px; border: none; border-radius: 6px; padding: 0 16px; box-sizing: border-box; font-size: 18px; background: #FFFFFF; }
.orderBox input { width: 100%; height: 46px; border: none; border-radius: 6px; padding: 0 16px; box-sizing: border-box; font-size: 18px; background: #FFFFFF; }
.orderBox .code, .orderBox .send { width: 49%; }
.orderBox .send { background: linear-gradient(0deg,#FFD000,#FFF000); color: #FF4000; font-size: 20px; font-weight: bold; text-align: center; cursor: pointer; }
.orderBox .orderBtn { height: 50px; background: linear-gradient(0deg,#FFD000,#FFF000); color: #FF4000; font-size: 24px; font-weight: bold; cursor: pointer; }
#__nc { width: 100%; }
#__nc #your-dom-id * { height: 46px !important; line-height: 46px !important; font-size: 16px; box-sizing: border-box; border-radius: 6px; }
#__nc .nc_wrapper { width: 100% !important; }
.orderBox .orderItem label { color: #FFFFFF; }
.orderBox .orderItem .checkbox { width: 20px; height: 20px; margin-right: 2px; }
.orderBox .check a { color: #FFD999; }
.zlBox { width: 50%; padding: 30px; box-sizing: border-box; background: linear-gradient(#FFFDDD,#FFD999); border-radius: 0 20px 20px 0; }
.zlTit { font-size: 22px; font-weight: bold; color: #DD0000; text-align: center; margin-bottom: 10px; }
.zlTit span { color: #DD0000;; }
.zlList { display: flex; justify-content: center; flex-wrap: wrap; }
.zlList li { line-height: 44px; padding: 6px 30px; box-sizing: border-box; background: linear-gradient(90deg,#DD0000,#FF4000); border-radius: 10px; font-size: 20px; font-weight: bold; color: #FFFFFF; text-align: center; margin-bottom: 12px; }
.zlList li a { color: #FFFFFF; }
.zlList li a:hover { color: #FFF000; }
.zlList li:nth-last-child(1) { margin-bottom: 0; }
.zlBox img { display: block; width: 85%; border-radius: 8px; margin: 0 auto; }
.zlBox a { display: block; width: 45%; height: 40px; margin: 10px auto; background: linear-gradient(0deg,#FFC000,#FFF000); border-radius: 20px; box-shadow: 0 0 8px #FF4000; font-size: 18px; font-weight: bold; color: #FF4000; text-align: center; line-height: 40px; }
.zlBox a:hover { background: linear-gradient(0deg,#FFF000,#FFC000); color: #DD0000; }

.navList { display: flex; justify-content: space-evenly; flex-wrap: wrap; margin-top: 20px; }
.navList li { width: 11.5%; margin: 10px .5%; border-radius: 10px; box-shadow: 0 0 20px rgba(0,0,0,.1); background: rgba(255,255,255,0.7); padding: 10px; box-sizing: border-box; }
.navList li a { display: block; width: 100%; font-size: 18px; text-align: center; line-height: 30px; }
.navList li a:hover { color: #FF4000; }
.navList li a img { display: block; width: 60%; margin: 0 auto; }

.tableBox table { width: 100%; border: 1px solid #FF4000; }
.tableBox table tr:nth-child(odd) { background: #FFFEEE; }
.tableBox table tr:nth-child(even) { background: #FFFFFF; }
.tableBox table th { background: #FF4000; font-size: 20px; color: #FFFFFF; line-height: 50px; }
.tableBox table td { border: 1px solid #FF4000; box-sizing: border-box; font-size: 20px; text-align: center; line-height: 34px; padding: 4px; box-sizing: border-box; }
.tableBox table td a { display: block; width: 120px; height: 40px; line-height: 40px; margin: 10px auto; text-align: center; font-size: 16px; color: #FFFFFF; background: linear-gradient(90deg,#DD0000,#FF4000); border-radius: 20px; }
.tableBox table td a:hover { background: #FF9000; }

#chart1 { width: 100%; height: 700px; padding: 0 30px; box-sizing: border-box; border-radius: 20px; background: rgba(255,255,255,0.9); }

.tsList { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
.tsList li { width: 23%; margin: 10px 1%; background: #FFFFFF; border-radius: 10px; padding: 6px; box-sizing: border-box; }
.tsList li:hover { box-shadow: 0 0 8px #FFD000; }
.tsList li a { display: block; width: 100%; }
.tsList li a img { width: 100%; height: 220px; border-radius: 10px; }
.tsList li p { height: 48px; font-size: 16px; text-align: center; line-height: 24px; }
.tsList li a span { display: block; width: 70%; margin: 2px auto; font-size: 16px; line-height: 36px; text-align: center; color: #FFFFFF; background: linear-gradient(90deg,#DD0000,#FF4000); border-radius: 20px; }
.tsList li a span:hover { background: #FF9000; }

.ewmList { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
.ewmList li { width: 22%; margin: 4px 1.5%; }
.ewmList li a img { display: block; width: 100%; height: auto; border: 6px solid #FF6000; border-bottom: 0; box-sizing: border-box; border-radius: 10px 10px 0 0; }
.ewmList li a p { background: linear-gradient(180deg,#FF4000,#FF3000); font-size: 18px; line-height: 44px; text-align: center; color: #FFFFFF; border-radius: 0 0 10px 10px; }

.cityList { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.cityList li { width: 14%; margin: 10px 1%; }
.cityList li a { display: block; width: 100%; line-height: 44px; font-size: 18px; text-align: center; color: #FFFFFF; background: linear-gradient(90deg,#DD0000,#FF4000); border-radius: 22px; }
.cityList li a:hover { background: #FF9000; }

.downTable img { display: block; width: 200px; margin: 0 auto; }

@media only all and (max-width: 1200px) {
    
  section { padding: .5rem 0; }
  
  .bannerBox { padding: 1.25rem 0 0; height: 11rem; background-size: cover; }
  .bannerBox h2 { font-size: .85rem; line-height: 1.5rem; }
  .bannerBox h1 { width: 15rem; margin: .5rem auto 0; }
  .bannerBox p { width: 16rem; font-size: .75rem; letter-spacing: 0; line-height: 1.5rem; }
    
  .box .container { padding: .5rem; border-width: .2rem; border-radius: .5rem; box-shadow: inset 0 0 .5rem #FFC000; }

  .boxTit { height: 1.7rem; margin-bottom: .5rem; }
  .boxTit span { font-size: .95rem; letter-spacing: 0; margin: 0 .25rem; }
  .boxTit img { height: .75rem; }

  .orderBox { width: 100%; padding: .75rem; border-radius: .5rem .5rem 0 0; }
  .orderBox .orderTit { font-size: .65rem; }
  .orderBox .orderItem { margin: .5rem auto;  }
  .orderBox select { width: 100%; height: 1.8rem; border: none; border-radius: .2rem; padding: 0 .4rem; font-size: .7rem; }
  .orderBox input { width: 100%; height: 1.8rem; border: none; border-radius: .2rem; padding: 0 .4rem; font-size: .7rem; }
  .orderBox .send { font-size: .75rem;  }
  .orderBox .orderBtn { height: 1.8rem; font-size: .85rem; }
  #__nc { width: 100%; height: 1.8rem; }
  #__nc #nc * { height: 1.8rem !important; line-height: 1.8rem !important; font-size: .7rem; box-sizing: border-box; border-radius: .2rem; }
  #__nc .slider { height: 1.8rem !important; left: 0 !important; right: 0 !important; }
  #__nc .icon { width: .8rem; left: .5rem !important; }
  #__nc .button { width: 1.8rem !important; height: 1.8rem !important; }
  .check { font-size: .65rem; line-height: 1rem; }
  .orderBox .orderItem .checkbox { width: 1.2rem; height: 1.2rem; margin-right: .1rem; }
  .zlBox { width: 100%; padding: .75rem; border-radius: 0 0 .5rem .5rem; }
  .zlTit { font-size: .85rem; margin-bottom: .3rem; }
  .zlTit span { color: #DD0000;; }
  .zlList li { line-height: 1.6rem; padding: .15rem .5rem; border-radius: .25rem; font-size: .7rem; margin-bottom: .4rem; }
  .zlBox img { width: 100%; border-radius: .2rem; }
  .zlBox a { width: 60%; height: 1.7rem; margin: .25rem auto; border-radius: .85rem; box-shadow: 0 0 .2rem #FF4000; font-size: .75rem; line-height: 1.7rem; }
  
  .navList { width: 100%; margin-top: .5rem; }
  .navList li { width: 23%; margin: .15rem 1%; border-radius: .25rem; padding: .1rem 0; }
  .navList li a { width: 100%; font-size: .65rem; line-height: 1.4rem; }
  .navList li a img { width: 50%; }
  
  #chart1 { height: 30rem; padding: 0 0; border-radius: .5rem; background: rgba(255,255,255,.5); }

  .tableBox table tr:nth-child(1) { line-height: 1rem; }
  .tableBox table th { font-size: .7rem; line-height: 1.2rem; }
  .tableBox table td { line-height: 1rem; font-size: .7rem; padding: .2rem; }
  .tableBox table td a { width: 4rem; height: 1.5rem; line-height: 1.5rem; margin: .25rem auto; font-size: .65rem; border-radius: .75rem; }
  
  .tsList li { width: 48%; margin: .2rem 1%; border-radius: .25rem; padding: .15rem; }
  .tsList li:hover { box-shadow: 0 0 .2rem #FFD000; }
  .tsList li a img { height: 6rem; border-radius: .25rem; }
  .tsList li a p { height: 1.7rem; font-size: .7rem; line-height: .85rem; }
  .tsList li a span { display: block; width: 80%; margin: .2rem auto; font-size: .65rem; line-height: 1.5rem; border-radius: .75rem; }
  
  .ewmList li { width: 46%; margin: .3rem 2%; }
  .ewmList li a img { width: 100%; height: auto; border-width: 4px; border-bottom: 0; border-radius: .25rem .25rem 0 0; }
  .ewmList li a p { font-size: .7rem; line-height: 1.5rem; border-radius: 0 0 .25rem .25rem; }
  
  .cityList { margin-top: .25rem; }
  .cityList li { width: 31%; margin: .25rem 1%; }
  .cityList li a { display: block; width: 100%; font-size: .7rem; line-height: 1.5rem; border-radius: .8rem; }

  .downTable img { width: 6.5rem; }
    
}