@charset "UTF-8";

body{background: url(/cdht/xhtml/ztzl/sdgx/images/header_bg.png) center top no-repeat;}
.container{width: 1240px;margin: 0 auto;}
.header{padding-top: 30px;}
.site-logo{display: block;width: fit-content;}
.site-logo img{display: inline-block;height: 35px;vertical-align: middle;}
.site-logo img:first-child{margin-right: 10px;height: 46px;}
.header-text{margin: 0 auto;margin-top: 10px;width: fit-content;}
.header-text img{display: block;}

.main{margin-top: 30px;margin-bottom: 30px;}
.main .content{background-color: #fff;padding: 20px 45px;}
.main .content .mod-title{padding-bottom: 20px;border-bottom: 2px solid #9c9c9c;}
.main .content .mod-title h3{font-size: 26px;text-align: center;}
.main .content .mod-content{margin-top: 25px;}
.main .content .hd{width: calc(256 / 1150 * 100%);float: left;}
.main .content .hd li{padding: 7px 0;position: relative;}
.main .content .hd li a{display: block;padding: 15px 0;text-align: center;background-color: #f2f2f2;font-size: 18px;}
.main .content .hd li.on a{background-color: #00bafa;color: #fff;font-weight: 700;}
.main .content .hd li.on::after{content: "";border-top: 7px solid transparent;border-bottom: 7px solid transparent;border-left: #00bafa solid 10px;position: absolute;left: 100%;top: 50%;transform: translateY(-50%);}
.main .content .bd{width: calc(850 / 1150 * 100%);float: right;height: 350px;}
.main .content .bd>div{width: 100%;height: 100%;}
.main .content .bd .text-tips{font-size: 12px;color: #999;margin-top: 10px;float: right;}

@media (max-width: 1280px){
  .container{width: 970px;}
  .main .content .hd li a{font-size: 16px;}
  .main .content .bd{height: 320px;}
}

@media (max-width: 992px){
  .container{width: 750px;}
  .main .content .hd{width: 100%;float: none;}
  .main .content .hd ul{margin: 0 -10px;}
  .main .content .hd ul li{padding: 10px;width: calc(100% / 3);float: left;}
  .main .content .hd li.on::after{display: none;}
  .main .content .bd{width: 100%;float: none;margin-top: 20px;}
  .main .content .bd{height: 350px;}
}

@media (max-width: 768px){
  .container{width: calc(100% - 20px);}
  .main .content .hd ul li{width: calc(100% / 2);}
}

@media (max-width: 431px){
  .main .content{padding: 15px;}
  .main .content .mod-title{padding-bottom: 10px;}
  .main .content .mod-title h3{font-size: 18px;}
  .main .content .mod-content{margin-top: 10px;}
  .main .content .hd ul li{width: 100%;padding: 5px 10px;}
  .main .content .hd li a{font-size: 14px;padding: 10px 0;}
  .header{padding-top:15px;}
}