@import "../css/font-awesome.min.css";
@import "../css/iconfont.css";
/* 弘帝基础框架 */
*{ font-size:14px; font-family:Microsoft-YaHei,Arial;}
body{ background:url(huipai.jpg) fixed center;}
ul{padding-left: 0; list-style: none;}
ul li{box-sizing: border-box;}
a{color: #161616;}
h6{margin:0}
a:hover{ color: #FB0B28; text-decoration: none;}
.m-t-b-10{ margin-top: 10px; margin-bottom: 10px;}
.p-t-b-10{padding-top:10px; padding-bottom:10px;}
.p-t-b-20{padding-top:20px; padding-bottom:20px;}
.p-t-b-60{ padding-top: 60px; padding-bottom: 60px;}
.m-b-4{margin-bottom: 2px;}
.nopic{display: none;}
/* 弘帝实例框架 */
.banner{max-height:800px; position: relative;}
#epen .RowsTitle .Title{display: flex; flex-direction: row-reverse;flex-wrap: nowrap; justify-content: center; align-items: center;}
#epen .RowsTitle .Title .cn{ display: inline-block; font-size: x-large; font-weight: bold; margin:0 0.5em;}
#epen .RowsTitle .Title .en{ display: inline-block; font-size: xx-large; color:#FB0B28; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;}
#epen .Subject{ margin-bottom: 20px; text-align: center; text-shadow: 0px 0px 1px #fff;}
#epen .More{ text-align: center;}
#epen .More a{ display: inline-block; padding:10px 50px; background: #FB0B28; color:#fff; line-height:2em;}
#epen .More a:hover{ background:#161616; color:#fff;}
menu{padding:0; margin:0}
.icon-dianhua2{font-size:24px; line-height: 1em;}
.z{ position: absolute; z-index: 1500; width: 100%; height: 100%; display: table-cell; text-align:center;}
.slogon{ display: inline-block; margin-top:60px; background:rgba(0,0,0,0); padding: 50px; border-radius: 10px;}
.slogon .RowsTitle .Title{ font-size: 20px; color: #fff; line-height: 68px;}
.slogon .Descript{ line-height: 40px; font-weight: bold; font-size: 36px; color: #fff;}
.slogon ul{display: flex; flex-flow: row nowrap; justify-content: center; padding-top: 30px;}
.slogon ul li{ margin: 20px;}
.slogon ul li a{ display: block; white-space: nowrap; padding:15px 30px; background:#FB0B28; color: #fff; font-size: 16px;}
.slogon ul li a:hover{ background: #161616;}
.logo{ line-height: 100%; max-height: 80px; font-size:36px;}
.logo img{ height: 50px;}
.logor{font-weight: bold;}
.logor h3{ margin-bottom: 10px; font-size:24px;letter-spacing:0px; color:#c00;}
.position-sticky{top:0;z-index: 3000;background:url(huipai.jpg) fixed center;}
.about .Margin{ display: flex; flex-flow: row nowrap; justify-content:space-between; line-height: 2em; margin-bottom:30px;}
.about .Content .card{ width: 48%; max-height: 362px; overflow: hidden;}
.about .Content .card img{ width: 100%; height: 100%;}
.about .Content .intro{ width: 48%; font-size:16px; line-height: 2em; color:#333; text-indent: 2em;}
.about .Content .intro br{ display:block; line-height: 2.5em;}
.about #epen .RowsTitle{ margin-bottom: 10px;}
.about #epen .RowsTitle .Title .cn{ border-bottom:2px solid #B03840; line-height:48px; margin: 0; padding:0 10px;}
.about #epen .RowsTitle .Title .en{ border-bottom:2px solid #ccc; padding:0 10px; line-height: 48px;}
.about #epen .Subject{ color: #666; text-shadow: none; margin-bottom:30px;}
.bg-black{ background:#111; color: #fff;}
.bg-grey{ background: #BEBEBE;}
.bg-black ul{ display: flex; flex-flow: row nowrap; justify-content: center;}
.bg-black ul li{ display: inline; position: relative; color:#fff;}
.bg-black ul li.active{ background:url(hover.png) no-repeat center;}
.bg-black ul li a{display:block; width:142px; text-align: center; line-height: 60px; color:inherit; white-space: nowrap;}
.bg-black ul li a b{display:inline-block; margin-left:8px; border-top: 5px solid #fff; border-left:5px solid transparent; border-right:5px solid transparent;}
.bg-black ul li ul{display: none; background: #05417f; position: absolute; top:60px; z-index:2000; padding:0px 5px 15px 5px;}
.bg-black ul li ul li{ display: inline; color: #fff;}
.bg-black ul li ul li a{ display: block; line-height: 40px; border-bottom:1px solid #054688;}
.bg-black ul li ul li:last-child a{ border-bottom: 0;}
.bg-black ul li ul li a:hover{ background: #04376C;}
.bg-black ul li:hover ul{ display: block;}
.navbar{display:flex;padding:0; justify-content:flex-end;margin-right:-15px;margin-bottom:5px;}
.navbar ul{display: flex;flex-flow: row wrap; margin:0;}
.navbar ul li{margin-left:10px;}
.navbar ul li a{ display: block; padding:5px 20px; border:1px solid #c00; border-radius: 30px;}
.chat a::before{margin-right:8px;content:'\f0e6';font-family:'FontAwesome'; color:#c00;}
.pre a::before{margin-right:8px;content:'\f044';font-family:'FontAwesome'; color:#c00;}
.icon-reorder{ color: #fff;}
.link a{ padding: 0 10px; }
.menu{display:flex; flex-flow: row nowrap; justify-content: space-between;}
.navbar-toggler{display: none;}
.penthouse{ display: flex; height: 39px; background:url(eave.png) repeat-x #fff;}
.service ul{display: flex; flex-flow: row nowrap; justify-content: space-between;}
.service ul li{ width: 48%; padding: 20px; background: #686868;}
.service ul li h4 a{ display:block; font-size: 26px; line-height: 2em; font-weight: bold; pointer-events: none; color: #fff; text-align: center;}
.service ul li .memo{ color: #ccc;}
#ArticleIntro ul{ display:inline-block; width: 100%;}
#ArticleIntro ul li{ text-align:left; margin-bottom:20px;}
#ArticleIntro ul li .thumbs{ width:120px; height:120px;}
#ArticleIntro ul li .thumbs img{ max-width:120px; max-height:120px;}
#ArticleIntro ul li .detail .title a{ display:block; font-size:16px; font-weight:bold; line-height:1.2em;}
#ArticleIntro ul li .detail .intro{ margin-top:10px; line-height:1.5em; min-height:42px; max-height:65px; color:#888; overflow: hidden;}
#ArticleIntro ul li .detail .intro .enter{ float: right; display:none; height:100%; line-height:100%;}
#ArticleIntro ul li .detail .intro .enter a{ display: block; line-height: 100%; text-transform:uppercase;}
.LongDatePlus{ float:left; padding:8px; border:2px solid #C01A20; margin-right:20px; background:#C01A20; text-align:center; margin-bottom:20px;}
.LongDatePlus .dd{ display:block; font-size:24px; font-weight:bold; line-height:28px;}
.news .Margin{margin-top:80px;margin-bottom:50px;}
#CompanyOnlineMap{ height: 400px; border: 1px solid #ccc; border-top:0; padding: 10px; background: #fff;}
#map{ height: 100%;}
#Telephonist{ border:1px solid #ccc; border-bottom:0; background-color: rgba(255, 255, 255, .8); padding: 10px; padding-left: 50%; padding-top:50px; background-image:url(tele.jpg); background-repeat: no-repeat; background-position:55px 55px; }
.CompanyName{ font-size: x-large;}
#map_canvas{ height: 100%;}
#ArticleView ul,#ProductView ul{ display: flex; width: 100%; flex-flow:row wrap;}
#ArticleView ul li,#ProductView ul li{ display: flex; flex-flow: column wrap; width:25%;padding-left:15px;padding-right:15px; margin-bottom:20px; max-height: 400px; min-height: 120px;}
#ArticleView ul li .thumbs,#ProductView ul li .thumbs{ display: flex;box-sizing: border-box;  width: 100%; height:calc(100% - 56px); overflow: hidden;}
#ArticleView ul li .thumbs a,#ProductView ul li .thumbs a{ display: flex; box-sizing: border-box; width: 100%; height: 100%; text-align: center; align-items: center; justify-content: center;}
#ArticleView ul li img,#ProductView ul li img{ box-sizing: border-box; padding: 0.25rem; background-color: #fff; border: 1px solid #dee2e6; border-radius: 0.25rem; max-width: 100%; max-height:100%;}
#ArticleView ul li .atext,#ProductView ul li a{ display: block; padding-top:10px; line-height: 1.5em; text-align: center;color:#333; max-height:56px; overflow: hidden;}
.news #ArticleView ul li .atext{color:#fff;}
#ArticleDetail .Title,#ProductDetail .Title{ display:block; text-align:center; font-size:30px; font-weight:bold; line-height:1.5em; padding: 20px 0;}
.Log{ display:block; text-align:center; background:rgba(240, 240, 240,.5); margin-bottom:20px; padding:10px 0;}
.Picture{ text-align:center;}
#epen .Subject .Descript{color:#FB0B28; font-size:16px;}
#ProductDetail img,#ArticleDetail img{ max-width:760px;}
#ArticleDetail .Detail,#ArticleDetail .Detail *{ color: inherit; font-size: inherit;}
#ArticleDetail .Detail img,#ProductDetail .Detail img,.body .Content .Margin img{max-width: 100%;}
#ArticleDetail .Detail p{ margin:5px auto;}
.contact{ align-content: center;}
.contact .Content,.contact .Margin{ height: 100%; align-items:right;}
.contact .Hotline{ display:flex; flex: 3; align-items: center; justify-content:flex-end;}
.contact .dt{display: flex; flex-flow: row nowrap; align-items: center; justify-content: right;}
.contact .dt::before{content:'\f098';margin-right:10px;font-family:'FontAwesome';font-size: 20px; color: #C01A20;}
.contact .dd,.contact .dd a{ white-space: nowrap; text-align: left; font-size: 18px; line-height: 1.5rem;}
.contact .dt a{font-size:16px;}
.submenu{ display: flex; flex-flow: row nowrap; border-bottom: 1px solid #000;}
.submenu .RowsTitle{ background: none; margin: 0;}
.submenu .RowsTitle .cn{ font-size: 24px; text-indent: 58px; font-weight: bold; text-align: left;}
.submenu .RowsTitle .Title .en{ font-size: 20px; margin-top: -30px; letter-spacing:2px; line-height:36px;}
.submenu .RowsTitle .Title .en::first-letter{ font-size: 70px; margin-right: 10px; font-family: Georgia, Times, Times New Roman, serif; letter-spacing:0;}
.submenu .Content{ float: left; min-height:60px; margin-left: 50px;}
.submenu ul{ display: flex; flex-direction: row; margin-top: 5px;}
.submenu ul li a{display: block; padding:0 20px; line-height: 50px; font-size: 20px;}
.submenu ul li.subsel a{background: #5A342b; color: #fff;}
#wowslider-container .ws_bullets { top:0; right: 0; }
#wowslider-container { overflow: hidden; zoom: 1; position: relative; width:100%; height:100%; margin:0 auto; z-index:100; }
#wowslider-container .ws_shadow { width:100%; height:30px; position: absolute; left:0; bottom:-30px; z-index:-1; }
#wowslider-container .ws_images { position: absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; }
#wowslider-container .ws_images a { color:transparent; }
#wowslider-container .ws_images img { top:0; left:0; border:none 0; }
#wowslider-container a { text-decoration: none; outline: none; border: none; }
#wowslider-container .ws_bullets { font-size: 0px; top:calc(100% - 50px); left:50%; float: left; position:absolute; z-index:70; }
#wowslider-container .ws_bullets div { position:relative; float:left; }
#wowslider-container .ws_bullets a { width:8px; height:8px; background:none; border:0; margin:3px; border-radius:6px; border: 1px solid #fff; float: left; text-indent: -9999px; position:relative; }
#wowslider-container .ws_bullets a.ws_selbull{ background-color:#eee; border: 1px solid transparent; width: 30px;}
#wowslider-container a.ws_next, #wowslider-container a.ws_prev { position:absolute; display:none; top:50%; margin-top:-40px; z-index:60; height: 80px; width: 38px; background:#000; opacity: .2;}
#wowslider-container a.ws_next { right:20px; }
#wowslider-container a.ws_next:before{ float:left; width:0;height:0;content:"";border-left:20px solid #fff; border-top:20px solid transparent; border-bottom:20px solid transparent; margin-left:10px; margin-top: 20px;}
#wowslider-container a.ws_prev { left:20px;}
#wowslider-container a.ws_prev:before{ float:left; width:0;height:0;content:"";border-right:20px solid #fff; border-top:20px solid transparent; border-bottom:20px solid transparent; margin-left:8px; margin-top: 20px;}
#wowslider-container a.ws_next:hover { opacity: .8;}
#wowslider-container a.ws_prev:hover { opacity: .8;}
#wowslider-container a.ws_next, #wowslider-container a.ws_prev { display:block }
#wowslider-container:hover a.ws_next, #wowslider-container:hover a.ws_prev { display:block }
#wowslider-container .ws-title { position: absolute; bottom:50px; left: 0; margin-right:5px; z-index: 50; padding:12px; color: #F9FBFB; text-transform:uppercase; background:#000000; font-family: Helvetica, Arial, Verdana, sans-serif; font-size: 18px; }
#wowslider-container .ws-title div { padding-top:5px; font-size: 13px; text-transform:none; }
#wowslider-container .ws_bullets a img { text-indent:0; display:block; top:16px; left:-120px; visibility:hidden; position:absolute; -moz-box-shadow: 0 0 5px #999999; box-shadow: 0 0 5px #999999; border: 5px solid #FFFFFF; }
#wowslider-container .ws_bullets a:hover img { visibility:visible; }
#wowslider-container .ws_bulframe div div { height:90px; overflow:visible; position:relative; }
#wowslider-container .ws_bulframe div { left:0; overflow:hidden; position:relative; width:240px; }
#wowslider-container .ws_bullets .ws_bulframe { display:none; top:20px; overflow:visible; position:absolute; cursor:pointer; -moz-box-shadow: 0 0 5px #999999; box-shadow: 0 0 5px #999999; border: 5px solid #FFFFFF; }
#wowslider-container .ws_bulframe span { display:block; position:absolute; top:-11px; margin-left:-9px; left:120px; width:15px; height:6px; }
.guide{ margin-bottom: 40px; color:#666;}
.guide *{ color:#666;}
.bottom{background:url(proof.jpg) repeat-x #ccc; padding-top:40px;}
.nav{ background: #5F2D30;}
.nav .MenuCenter{ margin: 0 auto;}
.nav ul{ display: flex; flex-flow: row wrap; justify-content: center; margin-bottom: 0;}
.nav ul li{ flex: 1;}
.nav ul li a{ display: block; white-space: nowrap; color: #fff; padding: 15px 20px;}
.copyright{ padding: 10px 0; text-align: center;}
.tiplabel{display:inline-block;height:20px;}
.mode a{display:block; color:#fff; font-size:16px; font-weight:bold; padding-bottom:10px;}
.Pagination{ text-align: right;}
.Pagination span{background:#FB0B28; padding:5px; color: #fff;margin:0 3px}
.Pagination a{ margin:0 3px;}
online{ position: fixed; z-index: 10000; right:0; top: 350px;}
online .Content{ display: flex; flex-flow: column nowrap;}
online div{ display: flex; flex-flow: row nowrap; justify-content: right; position: relative;}
online div::before{ display:flex; width:50px; height: 50px; font-family: fontawesome; font-size: 30px; align-items: center; justify-content: center; background: #c00; color: #fff; margin:1px;}
online .qq::before{content: '\f1d6';}
online .tel::before{content: '\f095';}
online .istop::before{content: '\f077';}
online div span{ display:none; position: absolute; background: #fff; right:60px; text-align: left; border:1px solid #ccc; border-left:5px solid #c00; padding:10px; white-space: nowrap;}
online div span::after{ float: left; position: absolute; right:-6px; top: 15px; width:10px; height:10px; content:""; transform:rotate(45deg); background: #fff; border-top:1px solid #ccc; border-right: 1px solid #ccc;}
online div span a{ display: block; margin: 10px 0;}
.copyright select{background:none;padding:5px 20px;line-height: 1em;border-radius: 10px;}
/* 手机自适合 */
@media (max-width: 992px) {
    .p-t-b-60{ padding-top: 50px; padding-bottom: 50px;}
    #ArticleView ul li,#ProductView ul li{ width: 33%;}
    .navbar-toggler{ display:block; position: fixed; z-index: 2000; top:15px; right: 20px; background: #FB0B28; color: #fff; border-radius: 5px; margin: 6px; width: 50px; height: 50px;}
    .menu{display:none; position: fixed; top: 68px; left: 0; z-index: 3000; background:#FB0B28;}
    .menu ul{ flex-flow:column wrap; padding: 10px;}
    .menu ul li{ background: rgba(255,255,255, .5); margin: 2px 0;}
    .menu ul li a{display:block; line-height: 36px;}
    .menu ul li a b{ border-left: 5px solid #fff; border-top:5px solid transparent; border-bottom:5px solid transparent;}
    .menu ul li:hover{background: #FB0B28;}
    .menu ul li ul{left:110px; top:0; padding-top:5px; padding-bottom:5px; border:1px solid #FB0B28;}
    .menu ul li ul li a{white-space:pre-wrap; line-height: 1.5em; padding:10px;}
    .slogon{ zoom: 80%;}
}
@media (max-width: 768px)  {
    .p-t-b-60{ padding-top: 40px; padding-bottom: 40px;}
    #ArticleView ul li,#ProductView ul li{ width: 48%;}
    .about .Margin{ flex-direction: column;}
    .about .Content .intro,.about .Content .card{ width: auto; margin: 0 0 20px 0;}
    .about .RowsTitle .More{ left: 0; right: 0;}
    .slogon{ zoom: 60%;}
    .service ul{ flex-flow: column wrap;}
    .service ul li{ width: 100%;}
    .service ul li:first-child{ margin-bottom: 18px;}
    .news #ArticleIntro .Summary{ float:none; width:100%; margin-right:0px;}
    .submenu{ display: flex; flex-flow: column wrap; border-bottom: 1px solid #000; justify-content: center; zoom: 80%;}
    .submenu .RowsTitle{ margin-bottom: 20px;}
    .submenu .Content{ float:none; height:60px; margin-left: 0px;}
    .submenu ul{ justify-content: left;}
}
@media (max-width: 576px)  {
    .p-t-b-60{ padding-top: 30px; padding-bottom: 30px;}
    #ArticleView ul li { width:50%;}
    .slogon{ zoom: 50%;}
    .submenu{border:0;}
    .submenu .Content{ border: 1px solid #000; margin-bottom:10px; clear: both;}
    .submenu ul{display: flex;flex-flow: row wrap;margin:2%;}
    .submenu ul li{width:33%;}
    .submenu ul li a{display:block; text-align: center;}
    .submenu .clear{display: none;}
    #Telephonist{background-size:100%;background-position:0 0; padding:10px;padding-top:250px; }
}
@media (max-width: 576px)  {
    .logo img{ width:220px; height: auto;}
}