body{ background:#efefef url(../images/p-bg.jpg) no-repeat center 0; background-size: 100% auto; }
.nav{  height: 190px; background:  url(../images/nav_bg.png) no-repeat 0 70px; background-size: 100% auto;  text-align: center;}
.nav a.navs1,
.nav a.navs1:visited{ display: inline-block; margin-top:70px; width: 140px;height: 120px; line-height: 120px; color:#8395ab; font-size: 16px; }
.nav a.navs1.cur,
.nav a.navs1:hover,
.nav a.navs1:active {color:#fff; background: url(../images/nav_a.png) no-repeat 0 0; }
.nav img{ display: inline-block; margin: 0 100px;}

.pagetitle{ padding: 125px 0 0 0; text-align: center; line-height: 60px; color: #6699cc;  font-size: 24px;text-transform: uppercase;}
.pagetitle span{ border-top:solid 1px #6699cc; color: #fff; font-size: 48px;}


.pagenav{ padding: 80px 0 125px 0;  text-align: center; line-height: 45px; font-size: 16px;}
.pagenav a{ display: inline-block; margin: 0 20px; width: 160px; height: 45px;  background: url(../images/page_sof_bg2.png) no-repeat 0 0;  background-size: 100%  100% ; color:#000;position: relative; z-index: 101;}
.pagenav a.cur,
.pagenav a:hover,
.pagenav a:active { background: url(../images/page_sof_bg1.png);background-size: 100%  100% ; color:#fff;}

.list{ padding-top:60px; background: #fff; }
.list_title{ margin:0 40px; padding:10px 20px 10px 10px;line-height: 25px; background: #f6f6f6; text-align: right;}
.list_title a,
.list_title span{padding: 0 5px;}

.list_list{ margin:0 40px; padding: 55px 0; }
.list_list li{ padding: 20px; margin-bottom: 40px; height: 150px; font-size: 16px;color: #999; text-align: right; background: #f6f6f6;}
.list_list li img{ float: left; margin-right: 20px; width: 225px; height: 150px; border-radius: 3px; }
.list_list li a.titles{ display: block; height: 125px; text-align: left; font-size: 24px;  overflow: hidden;}
.list_list li a.org,
.list_list li a.org:hover,
.list_list li a.org:active{ padding-left:50px; color: #cc9933;}

.more{ margin:60px auto; width: 150px; height: 40px; line-height: 40px;  display: block; background: #000; color:#fff; text-align: center; border-radius: 3px; font-size: 16px; cursor:pointer;}
.more.no{ background: none; color:#666; }

.pe{ width: 716px; position: absolute; top:205px;left:0;  z-index: 100; }
.pe img{ width: 100%; }


.infos_title{margin: 55px 80px; }
.infos_title dt{font-size: 30px; padding-bottom:45px;  line-height: 36px; border-bottom: solid 1px #e1e0e0;text-align: center}
.infos_title dd{ text-align: right;  padding-top:25px;font-size: 16px; color: #999;}
.infos_title dd a{ padding-left:50px; }
.infos{ margin: 55px 80px; line-height: 36px; font-size: 16px; }
.infos_more{margin: 0 80px 20px 80px; padding: 35px 0; border-top: solid 1px #e1e0e0; line-height: 20px; font-size: 16px;}


.f-input,.f-select,.f-but{display:inline-block;padding: 0 5px; margin: 0 5px; height:35px;line-height: 35px; border:solid 1px rgba(0,0,0,.1); border-radius: 3px; }
.t-textarea{display:inline-block;padding: 0; margin: 0 5px;width:98%; height:100px;line-height: 25px; border:solid 1px rgba(0,0,0,.1); border-radius: 3px;}
.f-select::-ms-expand { display: none; }
.f-select{appearance:none;-moz-appearance:none;-webkit-appearance:none; background:url(../images/select.png) no-repeat right center;}
.f-select:after{content: "\e90e";}

.f-check input{display:none;}
.f-check input + i{display:inline-block;margin-right:5px;margin-left:3px; padding:0 15px;height:30px;width: auto;line-height:28px; font-size:14px;vertical-align:middle;background-color:#fff;border:1px solid rgba(0,0,0,.1);border-radius:3px; cursor: pointer;}
.f-check input:checked + i{border-color:#3399cc; background: #3399cc;color:#fff;}
.f-check:hover input + i{border-color:#6699cc; background: #6699cc;color:#fff;}

.theform{  margin: 0 auto; padding: 1% 1% 50px 1%;  width: 475px;}
.theform > div{ display:block;margin: 20px 0; line-height: 35px;color:#666;}
.theform > div span{display:inline-block;float:left;width: 100px; font-size: 16px; color:#000;}
.theform > div.pa{ padding-left:100px; }
.theform > div.pa:last-child{ margin-bottom: 0;}
.theform .f-input,.theform .but-big,.t-textarea{width: 350px;}
.theform .f-select{width: 362px; }
.theform .f-check input + i{ margin-bottom: 5px; }
.theform  button{background: #3399cc;color:#fff; line-height: 40px; width: 200px;  text-align: center; border: 0; border-radius: 5px; font-size: 16px; margin-top:5px; cursor: pointer;}



.footer{ margin-top:55px;}

@media only screen and (max-width: 1920px) { 
body{ background:#efefef url(../images/p-bg.jpg) no-repeat center 0; background-size: auto 895px; }
}   

@media only screen and (max-width: 1500px) { 

.pe{ width:650px; margin-left:-10%;}
}   


@media only screen and (max-width: 1080px) { 
.nav{ background: none;}
.pagenav a{ width: 130px; height: 35px; line-height: 35px;}
.pagetitle{ padding: 75px 0 0 0;}
.pagenav{ padding: 35px 0 65px 0; }
.pe{ width: 65%; margin-left:-10%;top:100px;}
.nav a.navs1{ display: none; }
}   
 
@media only screen and (max-width: 860px) { 
.pe{ width:0; height:0;}
.infos_title{margin: 35px 60px; }
.infos_title dt{ font-size: 24px; line-height: 28px; padding-bottom:35px; }
.infos{ margin: 35px 60px;}
.infos_more{margin: 35px 60px;font-size: 12px; line-height: 18px;}

.list_title{ text-align: left;}
}   
 


@media only screen and (max-width: 750px) { 
.list_list{ padding-top: 40px; }
.list_list li{ height: 115px; font-size: 14px;}
.list_list li img{width: 172px; height: 115px; border-radius: 3px; }
.list_list li a.titles{ height: 95px;  margin-bottom: 5px;}
.pe{ width:0; height:0;}

.theform{ width: 375px;}
.theform .f-input,.theform .but-big,.t-textarea{width: 250px;}
.theform .f-select{width: 262px; }
.theform > div.pa{ padding-left:0; text-align: center; }
}   



@media only screen and (max-width: 600px) { 
body{ background:#efefef url(../images/p-bg.jpg) no-repeat right 0; background-size: auto 560px; }
.pagenav a{ width: 100px;margin: 0 10px; }
.list{ padding-top:0; margin: 0;  }
.list_title{ margin: 0;background: #fff; border-bottom:solid 1px #e1e0e0;}
.list_list{ padding: 0; margin:0; }
.list_list li{ padding: 10px;margin-bottom: 10px;   font-size: 12px;height:80px; }
.list_list li img{width: 105px; height: 70px; border-radius: 3px; }
.list_list li a.titles{ height: 60px;  margin-bottom: 5px; font-size: 14px;}
.list_list li a.org{padding-left:5px;}
.more{ margin:40px auto; width: 90%; height: 40px; line-height: 40px;  display: block; background: #000; color:#fff; text-align: center; border-radius: 3px; font-size: 16px; cursor:pointer;}
.pagetitle{line-height: 40px; font-size: 18px;}
.pagetitle span{ border-top:solid 1px #6699cc; color: #fff; font-size: 32px;}
.infos_title{margin: 35px;  }
.infos_title dt{ font-size: 24px; line-height: 28px; padding-bottom:35px;  text-align: left;}
.infos{ margin: 35px; font-size: 14px; line-height: 28px;}

.theform{ width: 325px;}
.theform .f-input,.theform .but-big,.t-textarea{width: 200px;}
.theform .f-select{width: 212px; }
}   


@media only screen and (max-width: 380px) { 
.pagenav a{ width: 80px;margin: 0 5px; }
}   

/* ---- 底部 ---- */
.mobile-footer {
    margin-top: 48px;
    padding: 32px 18px 40px;
    text-align: center;
    border-top: 1px solid rgba(59, 131, 164, 0.18);
    background: rgba(10, 15, 35, 0.5);
}
.footer-brand {
    font-size: 16px;
    font-weight: bold;
    color: #7996ea;
    letter-spacing: 3px;
    margin-bottom: 16px;
}
.footer-brand::before,
.footer-brand::after {
    content: " · ";
    color: #4a5a8a;
    font-weight: normal;
}
.footer-divider {
    width: 40px;
    height: 1px;
    margin: 14px auto;
    background: linear-gradient(90deg, transparent, rgba(59,131,164,0.4), transparent);
}
.footer-health {
    font-size: 11px;
    color: #3d4f70;
    line-height: 2.1;
    margin-bottom: 16px;
}
.footer-health strong {
    color: #5a7aa5;
    font-weight: normal;
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
}
.footer-info {
    font-size: 11px;
    color: #354566;
    line-height: 2;
}
.footer-info span {
    color: #4a6090;
}