/* LESS Document */
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, blockquote, pre, form, fieldset, table, th, td, span, p { margin:0px; padding:0px;}
@ln-blue-color : #122040; @white : #fff; @blue : #001e45; @list-color : #595959; @index-border-color : #25436b; @back-color : #484846; @black : #000; @select-b-color : #ccc; @gray:#b2b2b2;
@limit-width : 1280px; @product-width : 808px;
@auto-margin : 0 auto;
@box-shadow : 0.5px 10px 10px #aaa;
.left { float:left; }
.right { float:right; }
.border-radius (@radius) {
border-radius: @radius;
-moz-border-radius: @radius;
-webkit-border-radius: @radius;
}
.box-shadow {
-webkit-box-shadow: @box-shadow;
-moz-box-shadow: @box-shadow;
box-shadow: @box-shadow;
}
.like-btn {
text-align:center;
cursor:pointer;
}
.opacity(@num){
@result : @num * 100;
opacity:@num;
filter:~"alpha(opacity=@{result})";
-moz-opacity:@num;
}
.font (@size) {
font-family:~"Hiragino Sans GB W3,'微软雅黑','宋体', sans-serif";
font-size:@size;
line-height:@size;
}
.font_b (@size) {
font-family:~"Hiragino Sans GB W6，'微软雅黑','宋体', sans-serif";
font-size:@size;
line-height:@size;
}
.font-one (@size){
font-family:~"'微软雅黑','宋体', sans-serif";
font-size:@size;
line-height:@size;
}
.transition {
transition: all 0.5s ease-in;
}
.element_center { text-align:center; }
.limit_width { width:@limit-width; margin:@auto-margin; position:relative; min-width:@limit-width;}
/*head*/
.head { height:81px; background-color:@ln-blue-color; position:relative; min-width:@limit-width;}
.head .logo { position:absolute; top:0px; left:0px; z-index:1; }
.head ul { .left; margin-left:193px; margin-bottom:0px; }
.head ul li { .left; width:125px; .font(16px); color:@white; list-style:none; line-height:63px; .like-btn; height:63px; border-left:1px solid #25436b; margin-top:9px;}
/*foot*/
.foot { background-color:@ln-blue-color; overflow:hidden; min-width:@limit-width; }
.foot .tree_href { padding:37px 0px 0px 10px; overflow:hidden; }
.foot .tree_href .mid-line { height:105px; width:1px; .left; background-color:@index-border-color; margin-top:18px;}
.foot .tree_href dl { .left; width:203px; color:@white; }
.foot a { color:@white; text-decoration:none;
&:hover { text-decoration: none; color:@white; }
}
.foot .tree_href dl dt { .font(14px); font-weight:normal; .opacity(0.3); text-align:center; margin-bottom:32px; }
.foot .tree_href dl dd { .font(12px); .opacity(0.3); text-align:center; margin-bottom:11px;
&:hover { .opacity(1); }
}
.foot .tree_href .share_icon a { .opacity(0.5); margin:0px 9px;
&:hover { .opacity(1); }
}
.foot .copyright { color:@white; .opacity(0.3); .font(12px); text-align:center; margin-bottom:12px; }
/* content */
.content { width:100%; position:relative; &.g_bg { background-color:#efefef; } overflow:hidden; }
.abs { position:absolute; z-index:1;}
.main-nav { left:33px; top:34px; color:#fff;
.t-tab {
margin-bottom:24px;
.font-one(14.5px);
font-weight:bold;
a {
&:hover {
text-decoration:none;
.opacity(1);
}
color:#fff;
.opacity(0.5);
}
span{
margin-right:10px;
&.hover {
font-style:italic;
a {
.opacity(1);
}
}
}
samp{
.font-one(14.5px);
.opacity(0.5);
}
}
ul li {
.font(13px); color:#fff;
margin-top:18px;
&.hover {
a { .opacity(1); font-weight:600; font-style:italic;}
}
ul{
margin-left:11px;
}
a {
color:#fff;
.opacity(0.5);
.font(13px);
&:hover { .opacity(1); text-decoration:none; }
}
}
}
.control { top:397px;
.c-l { float:left; .transition; }
.c-r { float:right; .transition; }
}
/* gallery */
.gallery { position:relative; height:971px; background-color:@ln-blue-color;}
.gallery .item{ .transition; position:absolute; top:0px; .opacity(0.5);
.info { right:2px; bottom:20px; opacity:0; .transition;
dl { border-bottom:1px solid #697384; width:135px; color:#001e45; margin-bottom:14px; position:relative;
.img { position:absolute; left:-115px; width:100px; height:52px; top:0px; }
dt { .font(14px); font-weight:normal; margin-bottom:11px; }
dd { .font(12px); margin-bottom:11px;}
}
}
}
.gallery .item.hover { .opacity(1); .info{ opacity:1; } }
/* progress_bar */
.progress_bar {
height : 15px; width : 100%; position:absolute; z-index:5; background-color: #fff; display:none;
.progress_mid { width:20%; height: 10px; background-color: #122040;}
}
/* article */
.article { .limit_width; margin-top:29px;
.left-menu{
width:193px; .left;
.t-icon { height:109px; background:url(../images/t_icon.png) no-repeat; text-align:center; .font_b(24px); color:@white; padding-top:54px; }
.b-list { margin-top:12px; width:193px;
div {
height:88px; text-align:center; .font-one(16px); font-weight:bold;
&.blue { background-color:@blue; color:@white; }
&.white { background-color:@white; color:@blue; }
.b-line { height:88px; width:150px; padding-top:35px; border-bottom:1px solid rgba(255,255,255,0.4); margin:0 auto; cursor:pointer; }
}
}
}
.right-c { width:1077px; .right; padding:21px; background-color:@white; .box-shadow;
.floor { margin-bottom:45px; overflow:hidden;
.foor-title { .font_b(24px); color:@blue; }
.cat-item { width:505px; }
.a-list li { .font(14px); color:@list-color; margin:24px 0px 0px;}
hr { border-top:1px solid @back-color; margin-bottom:0px; }
p.re-select { padding:20px 0px;
select { width:171px; height:49px; border:1px solid @select-b-color; text-align:center; .font(18px); color:@back-color; margin-right:6px; }
span.br_btn { width:171px; display:inline-block; height:49px; background-color:@blue; color:@white; .font(18px); line-height:49px; text-align:center; cursor:pointer; }
}
table tr{ color:@back-color; text-indent:28px;
&.th { .font_b(18px); td { padding:17px 0px;} }
&.tr { .font(18px); border-top:1px solid @back-color; td { padding:30px 0px;} a.see { .font(14px); color:@blue; } }
}
p.re-tip { .font(18px); color:@back-color; line-height:40px; margin-top:24px; letter-spacing:1.8px; }
}
.limit-img img { width:1031px; }
.v-item { margin-bottom:40px;
.v-pic { height:690px; width:1035px; overflow:hidden; position:relative;
.v-video { position:absolute; z-index:2; width:1035px; height:690px; }
img { position:relative; z-index:1; }
.play-btn { position:absolute; top:50%; left:50%; margin-top:-93px; margin-left:-95px; z-index:3;}
}
.v-title { .font(18px); color:@blue; margin-top:40px; }
}
.ac-item { .left; margin-left:24px;
&.clear_margin { margin:0px; }
.ac-pic { width:329px; height:456px; overflow:hidden; }
p { .font(18px); color:@blue; text-align:center; margin:21px 0px 66px; a { color:@blue; text-decoration:none; }}
}
.post-tab { text-align:center; margin-bottom:20px;
span { margin-left:27px; color:@blue; .font-one(18px);
a { color:@blue; .opacity(0.7); text-decoration:none;
&:hover { .opacity(1); }
}
&.hover { a { .opacity(1); } }
&.clear_margin { margin:0px; }
}
}
.post-frame{
.b-img { width:100%; height:576px; overflow:hidden; position:relative;
.info { position:absolute; .font(18px); color:@white; padding:14px 23px 7px; background-color:rgba(0,0,0,0.6); width: 120px;
height: 45px; text-align:left; bottom: 50%; right: -120px; margin-top: 25px; .border-radius(50px);
a { color:@white; text-decoration:none; }
.dl-icon { margin-left:10px; }
}
}
.s-img { width:100%; margin-top:29px; overflow:hidden;
.img-item { float:left; width:326px; margin-left:28px;
.image { width:100%; height:182px; overflow:hidden; }
&.clear_margin { margin:0px; }
p { .font-one(18px); color:@blue; margin-top:15px; }
a { color:@blue; text-decoration:none; }
&.hover img { .opacity(1); }
}
}
}
.infor-item { overflow:hidden; padding:34px 0px; border-bottom:1px solid @blue; width:100%;
&.intro { padding:73px 0px; }
.l-item { width:479px; .left; height:354px; overflow:hidden;
&.intro { width:510px; height:384px; img { height:384px; }}
}
.r-item { width:477px; .right;
.i-title { .font_b(18px); color:@blue; line-height:28px; border-bottom:1px dashed @blue; letter-spacing:1px; &.pa { padding-bottom:5px; } }
.i-time { .font_b(18px); color:@blue; line-height:28px; letter-spacing:1px; }
.i-content { .font(16px); color:@list-color; line-height:28px; margin-top:40px; height:210px; }
.intro-content { .font(12px); color:@list-color; line-height:22px; letter-spacing:0.75px; margin-top:10px; }
p.more { .font(16px); color:@blue; text-align:right; a { color:@blue; }}
}
&.clear-padding { padding-top:0px; }
&.clear_border { border:none; }
}
.page { text-align:right; }
.contact { padding-bottom:130px;
.c-title { .font_b(18px); color:@blue; margin-bottom:30px; letter-spacing:1.8px; }
ul li { list-style:none; .font(16px); color:@black; margin-bottom:20px; letter-spacing:2.8px; }
span.s-more { .font(14px); color:@black; letter-spacing:2.8px; margin-left:35px; }
}
.c-mid { text-align:center;
.info-title { .font_b(24px); color:@blue; margin-top:37px; }
hr.dashed { border-top:1px dashed @blue; }
.info-stitle { .font_b(16px); color:@blue; line-height:28px; }
.info-c { text-align:left; .font(14px); color:@list-color; letter-spacing:2px; p{ margin:30px 0px;} line-height:28px; }
}
}
}
.cat-item { position:relative;
.cat-info { position:absolute; bottom:0px; left:0px; z-index:1; padding:24px; width:100%; background-color:rgba(0,0,0,0.5); .font(17px); color:@white; }
}
.tos-frame { overflow:hidden;
.tos-nav { height:99px; width:100%; background:url(../images/tab_bg.jpg) no-repeat; margin:32px 0px;
li { float:left; width:194px; text-align:center; margin-right:60px; color:@blue; list-style:none; .font(18px); padding-top:38px; cursor:pointer;
&.lar { width:230px; }
&.last { margin-right:0px; }
&.hover { color:@white; }
}
&.tab0 { background-position:0px -297px; }
&.tab1 { background-position:0px -198px; }
&.tab2 { background-position:0px -99px; }
}
.tos-content { position:relative; border:1px solid @blue; padding:0px 0px 70px 37px; background-color:@white;
&:before { content:""; position:absolute; top:-25px; right:95px; border-width:0px 25px 25px; border-style:solid; border-color:@blue transparent;display:block; width:0; }
&:after { content:""; position:absolute; top:-24px; right:96px; border-width:0px 24px 24px; border-style:solid; border-color:@white transparent;display:block; width:0;}
&.state0:before { right:890px; } &.state0:after { right:891px; }
&.state1:before { right:620px; } &.state1:after { right:621px; }
&.state2:before { right:365px; } &.state2:after { right:366px; }
.tos-f { overflow:hidden; }
.cl { .left; width:496px; padding-right:40px; margin-top:50px; .font(14px); color:@blue; height:90px; }
}
}
/* 图片浏览 */
.slider-gallery { background-color:@blue; width:100%; padding-top:35px; overflow:hidden;
&.no-pad { padding-top:0px; }
&.post-frame { background-color:@white;
.s-slider .s-img .s-scroll img { margin-left:0px; }
}
.b-img { height:732px; position:relative; overflow:hidden;
.b-img-frame { position:relative; z-index:1; overflow:hidden; width:100%; }
.b-info { position:absolute; width:100%; bottom:0px; left:0px; padding:40px 47px; background-color:rgba(0,0,0,0.5); color:@white; .font(30px); z-index:3; }
.b-control { position:absolute; z-index:4; width:100%; top:0px; left:auto; height:100%;
.c-l { position:absolute; left:25px; top:50%; margin-top:-26px; cursor:pointer;
&:after { content:""; display: block; width: 50px; height: 50px; .border-radius(25px); background-color:@black; position:absolute; z-index:-1; top: -8px; left: -15px; overflow:hidden; .opacity(0.4); }
}
.c-r { position:absolute; right:25px; top:50%; margin-top:-26px; cursor:pointer;
&:after { content:""; display: block; width: 50px; height: 50px; .border-radius(25px); background-color:@black; position:absolute; z-index:-1; top: -8px; left: -15px; overflow:hidden; .opacity(0.4); }
}
}
}
.s-slider { margin:45px 0px; height:198px; width:100%; position:relative;
.s-img { width:905px; overflow:hidden; margin:0 auto; position:relative; z-index:3;
.s-scroll { width:99999px;
img { float:left; margin-left:26px; .opacity(0.75); cursor:pointer;
&.clear_m { margin:0px; }
&.hover { .opacity(1); }
}
}
}
.s-control { .slider-gallery > .b-img > .b-control;
.c-l { .slider-gallery > .b-img > .b-control > .c-l; margin-top:-17px; }
.c-r { .slider-gallery > .b-img > .b-control > .c-r; margin-top:-17px; }
}
.c-l { .slider-gallery > .b-img > .b-control > .c-l; margin-top:-17px; z-index:4; display:none; }
.c-r { .slider-gallery > .b-img > .b-control > .c-r; margin-top:-17px; z-index:4; display:none; }
}
}
.back-a { text-align:right; .font(14px); padding:20px 0; color:@back-color;
a { color:@back-color; &:hover{ color:@back-color; } }
}
/* 弹窗 */
.pop-window { position:fixed; z-index:2; width:100%; height:100%; top:0px; left:auto; display:none;
.pop-bg { position:absolute; z-index:1; width:100%; height:100%; .opacity(0.5); background-color:@black; top:0px; left:auto; }
.pop { width:670px; height:567px; padding:0px 0px 50px; background-color:@white; position:relative; z-index:2; margin:0 auto;
.pop-title-bar { padding:0 80px; background-color:@blue; height:60px;
span { color:@white;
&.pt { .left; .font(18px); line-height:60px; }
&.pc { .right; .font(11px); line-height:60px; a { color:@white; }}
}
}
.pop-content { width:507px; margin:10px auto 0px; height:461px; overflow:auto;
.re-pop {
p { .font(14px); color:@back-color; samp { color:@blue; .font(14px); } line-height:28px;}
hr { border-top:1px solid @blue; .opacity(0.4); }
}
}
}
}
/* 对首页按钮进行样式修复 */
.carousel-control {
.glyphicon:empty { width:26px; }
.glyphicon-chevron-left { &:before { content:"";} width:26px; height:53px; background:url(../images/control_l.png) no-repeat center; }
.glyphicon-chevron-right { &:before { content:"";} width:26px; height:53px; background:url(../images/control_r.png) no-repeat center; }
}
#carousel-example-generic{
.carousel-indicators li { width:8px; height:8px; }
.carousel-indicators .active { width:10px; height:10px; }
}
/* 企业介绍 */
.introduce { padding:18px 50px 55px;
.intro-layout { position:relative; overflow:hidden;
.front { width:550px; height:288px; position:absolute; z-index:3; top:0px; color:@back-color;
p { &.title{ .font-one(20px);} .font-one(14px); line-height:22px; }
}
.left.front { background:url(../images/introlayout1.gif) no-repeat; left:0px; padding-left:23px; padding-right: 97px; padding-top: 20px; }
.right.front { background:url(../images/introlayout2.gif) no-repeat; right:0px; padding-right:23px; padding-left:107px; padding-top:50px; }
&+.intro-layout { margin-top:20px; }
}
.intro-cal-title { height:2px; background-color:@gray; margin-top:60px; text-align:center; margin-bottom:35px;
.mid-t span{ background-color:@white; .font-one(20px); color:@back-color; margin-top:-10px; display:inline-block; padding:0px 68px; }
}
.intro-row { margin-top:10px; }
.intro-text-row { overflow:hidden;
.row { .left; width:233px; padding:15px 70px 0px 8px; margin:0px; li { list-style-position:inside; list-style-type: square; .font-one(14px); color:@back-color; line-height:18px; }}
}
}