@charset "utf-8"; /* 导航栏 */ * { margin: 0; padding: 0; list-style: none; } body { height: auto; font-family: "微软雅黑"; text-align:justify; } .nav { width: 100%; height: 5.5em; position: fixed; left: 0; top: 0; z-index: 99; background: rgba(250, 252, 255, 0.7); } /* div 半透明设置 filter:alpha(opacity=50); 支持 ie 浏览器-moz-opacity:0.50; 支持 firefox 浏览器opacity:0.50; 支持 chrome, opera, safari 等浏览器 */ .logo { width: 15.54%; height: 63.8%; margin-left: 5.4%; margin-top: 20px; float: left; } .logo img { width: 100%; } .background img { width: 100%; } .nav_name { width: 50%; margin-left: 8%; height: 63.8%; float: left; margin-top: 1.6%; text-align: center; } .nav_name ul { margin-top: 1em; color: #ab0119; } .nav_name ul li { float: left; margin-left: 3%; letter-spacing: 0.05em; } .nav_name ul li a { color: #ab0119; text-decoration: none; } .nav_name ul li hr { color: #ab0119; display: none; margin-top: 0.3em; } .tel { width: 9%; height: 63.8%; float: left; margin-top: 0.02em; margin-left: 1%; line-height: 6.2em; text-align: center; color: #cc3333; } .language{ width: 175px; float: right; margin-top: 10px; text-align: center; color: #cc3333; font-size: 14px; } .language a{ color: #cc3333; font-size: 14px; } .work { width: 14%; height: 24px; float: left; margin-top: 45px; margin-left: 1%; font-size: 12px; line-height: 24px; background: #cc3333; border-radius: 5px; padding-left: 7px; color: #fff; } .work_word { float: left; } .email { background: #ac021a; margin-left: 10px; float: left; width: 34px; height: 19px; margin-top: 3px; line-height: 19px; text-align: center; border-radius: 5px; } .oa { background: #ac021a; margin-left: 10px; float: left; width: 50px; height: 19px; margin-top: 3px; line-height: 19px; text-align: center; border-radius: 5px; } /* 联系我们 */ .top { background: url(/uploads/image/epcimages/top_back.png) no-repeat; height: auto; width: 100%; background-size: 100% 100%; } .content_left { float: left; width: 50%; height: auto; } .content_left_detial { width: 57%; height: auto; margin-left: 25%; margin-top: 11%; } .content_right { float: left; width: 50%; height: 700px; } .clear { clear: both; } .ewm { width: 200px; height: 200px; margin-top: 35px; margin-left: 26%; } /* foot */ .footer { background: url(/uploads/image/epcimages/foot_back.jpg) no-repeat; width: 100%; height: 85%; background-size: 100% 100%; } .content_us { color: #ab0119; font-size: 2em; text-align: center; margin: 88px 0 0 0; padding-top: 20px; } .content_information { margin-top: 4.5em; margin-left: 40%;; } .content_information ul li { margin-bottom: 1em; } .gj { width: 55%; margin-left: 23%; margin-top: 3%; } .ewm_hr { width: 503px; height: 33px; margin-top: 5px; margin-left: 5%; } .ewm_content { width: 200px; margin-top: 2px; margin-left: 26%; text-align: center; font-size: 15px; } /* 首页 第二屏 */ #group_introduction { background: #ab0119; width: 150px; height: 30px; font-size: 15px; color: #fff; line-height: 30px; text-align: center; margin-left: 15%; margin-top: 30%; transition: background 0.7s; -moz-transition: background 0.7s; -webkit-transition: background 0.7s; -o-transition: background 0.7s; transition: color 0.7s; -moz-transition: color 0.7s; -webkit-transition: color 0.7s; -o-transition: color 0.7s; } #group_culture { width: 150px; height: 30px; font-size: 15px; color: #ab0119; line-height: 30px; text-align: center; margin-left: 15%; margin-top:10px; transition: background 0.7s; -moz-transition: background 0.7s; -webkit-transition: background 0.7s; -o-transition: background 0.7s; transition: color 0.7s; -moz-transition: color 0.7s; -webkit-transition: color 0.7s; -o-transition: color 0.7s; } #group_distribution { width: 150px; height: 30px; font-size: 15px; color: #ab0119; line-height: 30px; text-align: center; margin-left: 15%; margin-top: 10px; transition: background 0.7s; -moz-transition: background 0.7s; -webkit-transition: background 0.7s; -o-transition: background 0.7s; transition: color 0.7s; -moz-transition: color 0.7s; -webkit-transition: color 0.7s; -o-transition: color 0.7s; } #group_five { width: 150px; height: auto; font-size: 15px; color: #ab0119; line-height: 30px; text-align: center; margin-left: 15%; margin-top:10px; transition: background 0.7s; -moz-transition: background 0.7s; -webkit-transition: background 0.7s; -o-transition: background 0.7s; transition: color 0.7s; -moz-transition: color 0.7s; -webkit-transition: color 0.7s; -o-transition: color 0.7s; } .more_a { text-decoration: none; color: #fff; } a { text-decoration: none; } #group_introduction_detile { width: 49%; height: 26em; margin-left: 43%; margin-top: 8em; color: #fff; font-size: 0.9em; line-height: 1.5em; } #group_culture_detile { width: 49%; height: 23em; margin-left: 43%; margin-top: 8em; display: none; color: #fff; } #group_distribution_detile { width: 49%; height: 23em; margin-left: 43%; margin-top: 8em; display: none; color: #fff; } #group_five_detile { width: 49%; height: 23em; margin-left: 43%; margin-top: 8em; display: none; color: #fff; } /* 第三屏 */ #group_memorabilia { color: #ab0119; font-size: 2em; text-align: center; font-family: "微软雅黑"; margin-top: 1%; } #group_memorabilia_img { text-align: center; margin-top: 7em; } .time_content_li { margin-left: 38.5%; margin-top: 3em; display: none; } .time_content_date { color: #ab0119; font-size: 1.4em; margin-top: 0.2em; } .time_content_p1 { font-size: 0.9em; margin-top: 0.3em; } .time_content_p2 { font-size: 0.9em; margin-top: 0.15em; } .circular { width: .6em; height: .6em; background: #fff; border: .2em solid #ebe9e9; border-radius: 1em; margin: .15em 1em .3em 0em; margin-left: 1em; } #time ul { float: left; margin-left: 4%; width: 100%; } #time ul li { float: left; width: 8%; } #time ul li span { font-size: .7em; } #time { background: url(/uploads/image/epcimages/line.png); width: 100%; height: 1.5em; background-size: 100% 100%; margin-top: 9em; } /* 第四屏 */ .group_business_box{ text-align: center; } .group_business_box ul{ width:900px; margin:30px auto; } .group_business_box li{ float:left; } #group_business { color: #ab0119; font-size: 2em; text-align: center; font-family: "微软雅黑"; margin-top: 1%; } #group_business_img { text-align: center; overflow: hidden; } .group_business_box img:hover{ transform: scale(1.1); cursor: pointer; transition: all 1s; } .group_business_box img:{ cursor: pointer; transition: all 1s; } .group_business_box { width: 100%; height: 350px; margin-top: 25px } .group_business_box_ul { list-style-type: none; margin-left: 13%; } .group_business_box_li { float: left; margin-left: 30px; } .group_business_name { text-align: center; font-size: 20px; margin-top: 10px; } .group_business_abstract { font-size: 12px; margin-top: 7px; } ul.items li { display: inline-block; width: 250px; height: 350px; margin: 0 8px; background: url(/uploads/image/epcimages/bg_green.png) no-repeat 0px 400px; overflow: hidden; } ul.items li i { display: block; position: relative; margin: 0 auto; margin-top: 43px; height: 69px; } ul.items li.pc i { width: 69px; background: url(/uploads/image/epcimages/words.png) no-repeat -245px -357px; } ul.items li.mobi i { width: 64px; background: url(/uploads/image/epcimages/words.png) no-repeat -416px -291px; } ul.items li.sys i { width: 76px; background: url(/uploads/image/epcimages/words.png) no-repeat -415px -362px; } ul.items li.app i { width: 74px; background: url(/uploads/image/epcimages/words.png) no-repeat -244px -439px; } ul.items li.host i { width: 79px; background: url(/uploads/image/epcimages/words.png) no-repeat -420px -439px; } ul.items li u { display: block; position: absolute; width: 156px; height: 156px; margin-left: 46px; background: url(/uploads/image/epcimages/words.png) no-repeat 0px -363px; -webkit-transition: all .5s ease-in-out 0s; -moz-transition: all .5s ease-in-out 0s; -ms-transition: all .5s ease-in-out 0s; -o-transition: all .5s ease-in-out 0s; transition: all .5s ease-in-out 0s; } ul.items li u.cl { clip: rect(0px, 156px, -10px, 78px); } ul.items li u.cl { clip: rect(0px, 156px, 156px, 78px); } ul.items li u.cr { clip: rect(156px, 78px, 156px, 0px); } ul.items li u.cr { clip: rect(0px, 78px, 156px, 0px); } ul.items li strong { display: block; margin-top: 70px; font-size: 16px; font-weight: normal; text-align: center; font-family: "微软雅黑"; color: #000; } ul.items li p { position: relative; top: 200px; color: white; font-family: "微软雅黑"; font-size: 12px; line-height: 1.5em; text-align: center; } ul.items li:hover { background-position: 0px 0px; -webkit-transition: all .5s ease-in-out .3s; -moz-transition: all .5s ease-in-out .3s; -ms-transition: all .5s ease-in-out .3s; -o-transition: all .5s ease-in-out .3s; transition: all .5s ease-in-out .3s; } ul.items li:hover i { -webkit-transition: all .5s ease-in-out .4s; -moz-transition: all .5s ease-in-out .4s; -ms-transition: all .5s ease-in-out .4s; -o-transition: all .5s ease-in-out .4s; transition: all .5s ease-in-out .4s; } ul.items li.pc:hover i { background: url(/uploads/image/epcimages/words.png) no-repeat -168px -357px; } ul.items li.mobi:hover i { background: url(/uploads/image/epcimages/words.png) no-repeat -337px -291px; } ul.items li.sys:hover i { background: url(/uploads/image/epcimages/words.png) no-repeat -327px -362px; } ul.items li.app:hover i { background: url(/uploads/image/epcimages/words.png) no-repeat -164px -439px; } ul.items li.host:hover i { background: url(/uploads/image/epcimages/words.png) no-repeat -335px -439px; } ul.items li:hover u.cl { clip: rect(0px, 156px, -10px, 78px); } ul.items li:hover u.cr { clip: rect(156px, 78px, 156px, 0px); } ul.items li:hover strong { color: white; -webkit-transition-delay: .4s; -moz-transition-delay: .4s; -ms-transition-delay: .4s; -o-transition-delay: .4s; transition-delay: .4s; } ul.items li:hover p { top: 15px; -webkit-transition: all .3s ease-in-out .5s; -moz-transition: all .3s ease-in-out .5s; -ms-transition: all .3s ease-in-out .5s; -o-transition: all .3s ease-in-out .5s; transition: all .3s ease-in-out .5s; text-align: left; margin-left: 10px; } .friendshiplink { width: 100%; height: 30px; background: rgba(254, 95, 92, 0.3); text-align: center; position: absolute; left: 0; line-height: 30px; bottom: 26px; } .friendshiplink p { font-size: 1em; margin-bottom: 1.1em; padding-top: .9em; color: #cc3333; font-family: "微软雅黑"; } .friendshiplink span { font-size: .8em; font-family: "微软雅黑"; margin-left: .5em; } .friendshiplink a{ color:#000; } .copyright { width: 100%; padding-left: 25%; height: 26px; background: #af011a; color: #987675; font-size: 13px; line-height: 26px; position: absolute; left: 0; bottom: 0; } .copyright ul { margin-left: 60% } .copyright li { float: left; height: 38px; line-height: 38px; margin-left: 5px; color: #987675; font-size: 13px; } .copyright p { float: left; height: 38px; line-height: 38px; margin-left: 20%; font-size: 13px; color: #987675; } .back_to_top { height: 30px; margin-top: 4px; float: right; margin-right: 30px; } .gonggao{ width: 30%; margin-left: 35%; margin-top: 40%; } .gonggao span{ color:#fff; } #overall { width: 55.6%; height: 3em; line-height: 3em; background: #e6e2e3; position: relative; overflow: hidden; margin-left: 21%; font-size: .938em; } .redleft { float: left; transform: skew(-50deg, 0deg); -ms-transform: skew(-50deg, 0deg); -moz-transform: skew(-50deg, 0deg); -webkit-transform: skew(-50deg, 0deg); width: 61%; height: 3em; background: #cc3333; margin-left: -9%; } .redright { transform: skew(-50deg, 0deg); -ms-transform: skew(-50deg, 0deg); -moz-transform: skew(-50deg, 0deg); -webkit-transform: skew(-50deg, 0deg); width: 59%; height: 3em; background: #e6e2e3; margin-right: -12%; float: right; } .span2 { display: inline-block; position: absolute; left: 50%; color: #fff; font-style: normal; transform: skew(50deg, 0deg); -ms-transform: skew(50deg, 0deg); /* ie 9 */ -moz-transform: skew(50deg, 0deg); /* firefox */ -webkit-transform: skew(50deg, 0deg); /* safari and chrome */ -o-transform: skew(50deg, 0deg); /* opera */ } .span1 { display: inline-block; font-style: normal; color: #cc3333; float: right; position: absolute; right: 54%; transform: skew(50deg, 0deg); -ms-transform: skew(50deg, 0deg); /* ie 9 */ -moz-transform: skew(50deg, 0deg); /* firefox */ -webkit-transform: skew(50deg, 0deg); /* safari and chrome */ -o-transform: skew(50deg, 0deg); /* opera */ } .hr { width: 55.6%; height: .3em; margin-left: 21%; background: #ab0119; } .news_list { background: #f6f6f7; width: 100%; height: 5.75em; transition: background 0.7s; -moz-transition: background 0.7s; -webkit-transition: background 0.7s; -o-transition: background 0.7s; } .news_list:hover { background: #e6e2e3; } .date { float: left; background: #e6e2e3; margin-left: .1em; height: 5em; width: 5em; margin-top: .5em; } .date span { margin-left: .2em; } .d { font-size: 1.8em; color: #ac011a; } .m { font-size: 0.8em; color: #000; } .y { font-size: 0.9em; color: #000; } .news_detil { float: left; margin-left: 20px; width: 86%; height: 20px; margin-top: 10px; } .news_title { font-size: 16px; color: #424242;; } .news_abstract { font-size: 12px; color: #424242; margin-top: 2px; } .more { width: 100%; height: 1.4em; background: #e6e2e3; font-size: .8em; color: #cc3333; text-align: center; line-height: 1.4em; font-style: italic; transition: background 0.7s; -moz-transition: background 0.7s; -webkit-transition: background 0.7s; -o-transition: background 0.7s; } .more a{ color: #cc3333; text-decoration:none; transition: color 0.7s; -moz-transition: color 0.7s; -webkit-transition: color 0.7s; -o-transition: color 0.7s; } #news { color: #ab0119; font-size: 32px; text-align: center; font-family: "微软雅黑"; margin-top: 1px; height: 45px; line-height: 45px; } .news_list_box_2 { display: none; } .news_img { width: 447px; height: 64px; margin-left: 34%; margin-top: 0.75em; }