body { 
   font-size: .16rem; 
   overflow-x: hidden !important;
}

@media ( max-width: 414px )  { 

   body { font-size: .14rem; }

   }





@font-face {

   font-family: "bebas";

   src:  url("fonts/bebas.eot"); 

   src:  url("fonts/bebas.ttf") format("truetype"),

         url("fonts/bebas.eot") format("embedded-opentype");

   font-style: normal; font-weight: normal;

}

.bebas { font-family: "bebas"; line-height: 1; }



/* reset */

.primary { color: #e53d34 !important; }



header { height: .8rem; display: table; width: 100%; border-bottom: 1px solid #dfdfdf;}

   header .x { width: 0; display: table-cell; vertical-align: middle; }

      header .x.nv { width: 100%; }

   header .logo a { display: block; padding-left: .2rem; }

   header .logo img { display: block; height: .34rem; }



   .nv { text-align: right; padding-right: .2rem; white-space: nowrap; overflow: hidden;}

   .nv .i { display: inline-block; padding: 0 .14rem; line-height: .8rem; font-size: .18rem;}

   .nv .i:hover { background-color: #e6e6e6; }

   .nv .i.active { background-color: #e53d34; color: #FFF; }



   header .tel { border-left: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf; padding: 0 .15rem; }

   header .tel .in { padding: .2rem; }

   header .tel p { line-height: 1; font-size: .12rem; padding-left: .2rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill-rule='evenodd' fill='%23333' d='M4.646 3.578L3.371 4.875c.664 1.474 2.072 3.116 3.706 3.668l1.102-1.099s2.613.456 3.201.741c.509.247.678.794.598 1.469-.086.726-1.037 2.326-2.75 2.343-1.713.018-4.236-1.272-6.043-3.176C1.377 6.916-.235 4.502.024 2.452.282.403 2.068.036 2.514.003c.452-.033.811.099 1.083.437.351.435 1.049 3.138 1.049 3.138z'/%3E%3C/svg%3E") no-repeat 0 50% / auto .12rem; white-space: nowrap; }

   header .tel i { display: block; line-height: 1; font-weight: bold; font-size: .2rem; white-space: nowrap; padding-top: .06rem; }



   header .lgu .in { }

      header .lgu .in a { display: block; line-height: .4rem; font-size: .18rem; padding: .2rem;}

      header .lgu .in a:hover { background-color: #e53d34; color: #FFF;}



   header .resp-tog { width: .6rem; height: .8rem; display: block; background: url("data:image/svg+xml,%3Csvg class='icon' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cpath d='M0 39.385h1024v157.538H0zM0 433.23h1024v157.538H0zm0 393.846h1024v157.538H0z' fill='%23111'/%3E%3C/svg%3E") no-repeat 50% 50% / .24rem auto; }

   .resp-tog, .resp-tog-w, .nv-drop { display: none; }



@media ( max-width: 1680px ) {

   .nv .i, header .lgu .in a, header .tel i { font-size: .14rem; }

}



@media ( max-width: 1440px ) {

   header .logo img { height: .3rem; }

   .nv .i { padding: 0 .08rem; }

}

@media ( max-width: 1280px ) {

   header .x.logo { width: 100%; }

   header .logo img { height: .38rem; }

   header .resp-tog-w { border-left: 1px solid #dfdfdf; display: table-cell; width: 0; }

   header .resp-tog { display: block; cursor: pointer; padding: .2rem; }

      header .resp-tog:hover { background-color: #efefef; }

   header .tel { border-left: 0; }

   header .tel i { font-size: .2rem; }

   header .x.nv { position: fixed; width: 2.4rem; height: 100%; background-color: #FFF; left: -2.4rem; top: 0; opacity: 0; z-index: 2000; border-right: 1px solid #dfdfdf; padding-right: 0; transition: all 0.24s ease-in-out; box-shadow: 0 0 .1rem rgba(100,100,100,0.3);}

      .resp-open header .x.nv { left: 0; opacity: 1;} 

      .resp-open .nv-drop { position: fixed; z-index: 1999; background-color: rgba(255,255,255,0.8); width: 100%; height: 100%; top: 0; left: 0; display: block; }

   .nv .i { display: block; text-align: left; line-height: .5rem; padding-left: .3rem; border-bottom: 1px solid #dfdfdf; }

}

@media ( max-width: 414px ) {

   header .logo a { padding-left: .1rem; padding-right: .1rem; }

   header .logo img { height: auto; width: 100%; }

   header .lgu, header .tel { display: none; }

   header, header .resp-tog { height: .6rem; }

}



footer { border-top: .04rem solid #e53d34; padding: .3rem; }

   footer .c1 { float: left; }

   footer .c1 img { width: 1rem; }

   footer .c2 { float: right; text-align: right;}

@media ( max-width: 414px )  { 

   footer .c1, footer .c2 { float: none; width: 100%; text-align: center; }

   footer .c1 { padding-bottom: .2rem; }

}



.focus-index {  }

   .focus-index img { width: 100%; }



.idx-r { margin: .6rem 0; }

@media ( max-width: 414px )  { 

   .idx-r { margin: .3rem 0; }

 }

.idx-r-h { text-align: center; }

   .idx-r-h img { width: 3rem; }

@media ( max-width: 414px )  { 

   .idx-r-h img { width: 85%; }

 }



.idx-r1 .c { padding: .3rem 0; }

   .idx-r1 .c .i { width: 20%; float: left;  text-align: center; }

   .idx-r1 .c i { display: block; width: 65%; margin: 0 auto; padding-bottom: 65%; border-radius: 100%; background-color: #d9e1e7; background-repeat: no-repeat; background-position: 50% 50%; background-size: 50% auto; }

      .idx-r1 .c .i-1 i { background-image: url("../images/idx-ico-1.png"); }

      .idx-r1 .c .i-2 i { background-image: url("../images/idx-ico-2.png"); }

      .idx-r1 .c .i-3 i { background-image: url("../images/idx-ico-3.png"); }

      .idx-r1 .c .i-4 i { background-image: url("../images/idx-ico-4.png"); }

      .idx-r1 .c .i-5 i { background-image: url("../images/idx-ico-5.png"); }

   .idx-r1 .c p { padding-top: .2rem; font-size: .18rem; font-weight: bold;}

@media ( max-width: 414px )  { 

   .idx-r1 .c i { width: 95%; padding-bottom: 95%; }

   .idx-r1 .c p { padding-top: .1rem; }
   .idx-r1 .c p { font-size: .12rem;  }

}





.idx-r2 .c { padding: .3rem 0; }



.idx-r3 { padding: .6rem 0;}

@media ( max-width: 414px )  { 

   .idx-r3 { padding: .3rem 0; }

}

@media ( max-width: 414px )  { 

   .idx-r1 .c i { width: 95%; padding-bottom: 95%; }

   .idx-r1 .c p { padding-top: .1rem; }

}



.culture-wrap { display: table; width: 100%; table-layout: fixed; padding: .5rem 0; }

   .culture-wrap .i { width: 20%; display: table-cell; vertical-align: top; background-repeat: no-repeat; background-position: 50% 0; background-size: 60% auto; padding: .8rem .1rem 0 3%;}

   .culture-wrap .i-1 { background-image: url("../images/culture-t-1.png"); }

   .culture-wrap .i-2 { background-image: url("../images/culture-t-2.png"); }

   .culture-wrap .i-3 { background-image: url("../images/culture-t-3.png"); }

   .culture-wrap .i-4 { background-image: url("../images/culture-t-4.png"); }

   .culture-wrap .i-5 { background-image: url("../images/culture-t-5.png"); }



   .culture-wrap .i p { width: 1em; line-height: 1; float: right; word-break: break-all; margin: 0 .06rem;}
@media ( min-width: 415px ) {
    .culture-wrap { height: 0; padding-bottom: 21.67441860465116%; background: url(../images/ts2.png) no-repeat 50% 50% / contain; margin: .4rem 0; }
    .culture-wrap .i { display: none; }
}
@media ( max-width: 414px )  { 

   .culture-wrap { padding: .3rem; }

}





@media ( max-width: 1280px ) { 

   .culture-wrap .i { padding: .8rem 3% 0 5%; }

}

@media ( max-width: 414px )  { 

   .culture-wrap .i { background-size: .8rem auto; padding: .9rem 7% 0 0; }

   .culture-wrap .i p { margin: 0 .02rem; }

}



.idx-r4 { background: #e0f2fc url("../images/sea.jpg") no-repeat 50% 50% / cover; padding: 5% 0; margin-bottom: 0;}

.idx-r4 .c { display: table; width: 100%; table-layout: fixed; padding: .4rem 0;}

.idx-r4 .idx-r-h img { }

   .idx-r4 .c1, .idx-r4 .c2 { display: table-cell; vertical-align: top; width: 50%; padding: 0 .2rem; font-family: KaiTi, KaiTi_GB2312; font-size: .18rem; }

   .idx-r4 .more { display: inline-block; line-height: .4rem; border: 1px solid #e53d34; padding: 0 .6rem; color: #e53d34; background-color: #FFF;}

@media ( max-width: 414px )  { 

   .idx-r4 .c1, .idx-r4 .c2 { display: block; width: 100%; padding: 0;}

   .idx-r4 .idx-r-h img { width: 100%; }

}





.page-wrap { display: table; width: 100%; table-layout: fixed;}

   .main-s { display: table-cell; width: 24%; vertical-align: top; }

   .main-c { display: table-cell; width: 76%; padding: .8rem 5%; vertical-align: top;}

      .main-c.bg-grey { background-color: #e8edf1; }



.sd-t { padding-left: 25%; padding-top: .8rem;  }

   .sd-t i { display: block; padding-bottom: .3rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='1'%3E%3Cpath fill-rule='evenodd' fill='%23e53d34' d='M0 0h1v1H0V0z'/%3E%3C/svg%3E") no-repeat 0 100% / 1em .05rem; font-size: .44rem; font-weight: bold; line-height: 1;}

.sd-m { padding-top: .6rem; padding-bottom: .6rem; overflow: hidden;}

   .sd-m a { display: block; line-height: 1.2; padding: 12% 5% 12% 25%; font-size: .26rem; }

   .sd-m a:hover { background-color: #e6e6e6; }

   .sd-m a.active { background-color: #e53d34; color: #FFF; font-weight: bold; }


@media ( min-width: 414px )  { 

   .main-c.b-padding { padding: 5% 8%; }

}
@media ( min-width: 1440px )  { 

   .main-c.b-padding { padding: 5% 15%; }

}

   

@media ( max-width: 414px )  { 

   .main-s, .main-c { display: block; width: 100%; }

   .main-c { padding: 0; }

   .sd-t { padding: 5%; }

   .sd-t i { text-align: center; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='1'%3E%3Cpath fill-rule='evenodd' fill='%23e53d34' d='M0 0h1v1H0V0z'/%3E%3C/svg%3E") no-repeat 50% 100% / 1em .05rem; font-size: .28rem; }

   .sd-m { padding-top: .2rem; padding-bottom: 0; display: flex;  }

   .sd-m a { flex: 1; padding: .2rem; text-align: center; font-size: .14rem; font-weight: bold;  }

}





.p-content { font-size: .2rem;  }

   .p-content p + p { margin-top: .2rem; }

@media ( max-width: 414px )  { 

   .p-content { padding: .3rem; font-size: .16rem;}

}



.list-gd {  }

   .list-gd .i { width: 50%; float: left; padding: .2rem; display: table; }

   .list-gd .i a { display: table-cell; vertical-align: middle; padding: 10% 0; height: 1.8rem; background-color: #e8edf1; color: #111; font-size: .2rem; text-align: center; transition: all .2s ease-in-out; line-height: 1.2;}

   .list-gd .i a:hover { background-color: #e53d34; color: #FFF; }

@media ( max-width: 414px )  { 

   .list-gd { }

   .list-gd .i { width: 50%; }

   .list-gd .i a { height: 1rem; font-size: .14rem; display: flex; padding: .2rem; justify-content: center; align-items: center; }

}



.surface-p1 { background: url("../images/p1.jpg") no-repeat 100% 100% / auto 100%; }

@media ( max-width: 414px )  { 

   .surface-p1 { height: 3rem; background: url("../images/p1.jpg") no-repeat 100% 100% / auto 100%;}

}



.article-view {  }

   .article-view .t { line-height: 1; text-align: center; font-size: .32rem; font-weight: bold; padding-top: .5rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='1'%3E%3Cpath fill-rule='evenodd' fill='%23e53d34' d='M0 0h1v1H0V0z'/%3E%3C/svg%3E") no-repeat 50% 100% / 1.25em .05rem; padding-bottom: .2rem;}

   .article-view .c { background-color: #e8edf1; margin: 2% 4%; padding: 5%;}

@media ( max-width: 414px )  { 

   .article-view .t { font-size: .24rem; margin: 0 .2rem; }

   .article-view .c { padding: 0; margin: 0; }

}



.section-t { color: #e53d34; font-size: .32rem; text-align: center; padding-top: .5rem; font-weight: bold; }



.trade-wrap { display: table; width: 100%; table-layout: fixed; padding: 8% 5% 0; }

   .trade-wrap .i { width: 16.66666666%; padding: 0 2%; display: table-cell; text-align: center; }

   .trade-wrap .i i { display: block; height: 0; padding-bottom: 100%; width: 100%; border-radius: 100%; background-color: #e8edf1; background-position: 50% 50%; background-size: 75% auto; background-repeat: no-repeat; }

   .trade-wrap p { padding-top: 5%; font-size: .24rem; font-weight: bold;}

   .trade-wrap .i1 { background-image: url("../images/p-trade-1.png"); }

   .trade-wrap .i2 { background-image: url("../images/p-trade-2.png"); }

   .trade-wrap .i3 { background-image: url("../images/p-trade-3.png"); }

   .trade-wrap .i4 { background-image: url("../images/p-trade-4.png"); }

   .trade-wrap .i5 { background-image: url("../images/p-trade-5.png"); }

   .trade-wrap .i6 { background-image: url("../images/p-trade-6.png"); }

@media ( max-width: 414px )  { 

   .trade-wrap { display: flex; flex-flow: row wrap; padding: .3rem;}

   .trade-wrap .i { width: 33.333333333%; padding: .1rem;}

   .trade-wrap p { font-size: .14rem; }

}



.pgx { text-align: center; padding-top: 1rem;}  

   .pgx a { display: inline-block; line-height: .4rem; background-color: #e8edf1; padding: 0 .4rem; cursor: pointer; transition: all .2s ease-in-out;}

   .pgx a + a { margin-left: .4rem; }

   .pgx a:hover { background-color: #e53d34; color: #FFF;}

   .pgx a.disabled { cursor: not-allowed; pointer-events: none; opacity: .4; }



.news-grid { padding-top: .6rem; }

   .news-grid .i { padding: 0 .2rem; float: left; width: 50%; }

   .news-grid .in { display: table; width: 100%; padding: 8%; background-color: #e8edf1; }

   .news-grid .in:hover { background-color: #e53d34; transition: all .2s ease-in-out;}



   .news-grid .i-d { width: 0; display: table-cell; vertical-align: top; text-align: right; padding-right: .2rem; border-right: 1px solid #ccc; }

      .news-grid .i-d i { display: block; color: #e53d34; width: .7rem; font-weight: bold; font-size: .24rem; line-height: 1.2; }

      .news-grid .i-d cite { font-weight: bold; }

   .news-grid .i-m { width: 100%; display: table-cell; vertical-align: top; padding-left: .2rem;}

      .news-grid .i-m .t { font-weight: bold; font-size: .22rem; line-height: 1.2; height: 4.8em; overflow: hidden;}

      .news-grid .i-m .c { font-size: .14rem; color: #999; line-height: 1.4; height: 7em; overflow: hidden; }

      .news-grid .i-m .more { font-weight: bold; font-size: .14rem; padding-top: .6rem; }



   .news-grid .in:hover, 

   .news-grid .in:hover .i-m .c, 

   .news-grid .in:hover .i-d i { color: #FFF; }

@media ( max-width: 414px )  { 

   .news-grid .i { width: 100%; float: none; margin-bottom: .2rem; }

   .news-grid .i-m, .news-grid .i-d,.news-grid .in { display: block; }

   .news-grid .i-m { padding-left: 0; }

   .news-grid .i-d { width: 100%; text-align: left; border: 0; padding-bottom: .1rem; }

}



.article-gud { margin: 2% 4%; }

   .article-gud a { display: block; line-height: .5rem; border: 1px solid #dfdfdf; padding: 0 .3rem;}

   .article-gud .a1 { float: left; }

   .article-gud .a2 { float: right; }

@media ( max-width: 414px )  { 

   .article-gud  { display: flex; }

   .article-gud a { flex: 1; line-height: 1.2; padding: .2rem; background-color: #e8edf1; border: .05rem solid #fff; }

   .article-gud .a2 { text-align: right; }

}



.support-wrap { display: table; width: 100%; margin: 5% auto;}

   .support-wrap .i { display: table-cell; vertical-align: top; padding: 0 2%;}

   .support-wrap .in { background-color: #e8edf1; padding: 25% 0; text-align: center; display: block; }

   .support-wrap .in img { width: 45%; }

   .support-wrap .in p { font-size: .2rem; font-weight: bold; }



.im-network { max-width: 980px; margin: .4rem auto; } .im-network img { width: 100%; }



.contact-w { display: table; width: 100%; height: 100%; padding: 0 5%;}

.contact-s, .contact-c { display: table-cell; vertical-align: middle; height: 100%; }

.contact-s { width: 35%; background: url("../images/contact-im.png") no-repeat 50% 50% / contain;  }

.contact-c { width: 65%; }

   .contact-c .c { border: .3rem solid #FFF; background-color: #e8edf1; padding: 5%; display: table; width: 100%; }

   .contact-c .t { width: 30%; vertical-align: top; display: table-cell; font-size: .34rem; font-weight: bold; padding-left: .5rem; line-height: 1.2; }

   .contact-c .t1 { background: url("../images/contact-i1.png") no-repeat 0 0 / .4rem auto; }

   .contact-c .t2 { background: url("../images/contact-i2.png") no-repeat 0 0 / .4rem auto; }

   .contact-c .t3 { background: url("../images/contact-i3.png") no-repeat 0 0 / .4rem auto; }

   .contact-c .d { font-size: .18rem; line-height: 1.8; display: table-cell; vertical-align: top; }

   .contact-c .d p + p { border-top: 1px solid #dfdfdf; padding-top: .1rem; margin-top: .1rem; }
@media ( max-width: 1440px )  { 
   .contact-c .t { font-size: .28rem; padding-left: .4rem; }
}
@media ( max-width: 414px )  { 

   .contact-w, .contact-s, .contact-c, .contact-c .t, .contact-c .d { display: block; width: 100%; }

   .contact-s { height: 3rem; margin-bottom: -.5rem; }

   .contact-c .c { border: 0; margin: .2rem 0; }

   .contact-c .t { padding-bottom: .2rem; font-size: .24rem;}

   .contact-c .d { font-size: .14rem; line-height: 1.4; }

   .contact-c .d p + p { padding-top: .1rem; }

}