@charset "utf-8"; 
/* widequick142 CSS */

.widequick142 {position:relative; z-index:0; width:100%; height:100%; float:left; text-align:center; box-sizing:border-box;}
.widequick142 .qBoxbg_wrap {position:relative; z-index:0; width:100%; height:100%; padding-top:150px; box-sizing:border-box; background:inherit;}
.widequick142 .qBoxbg_wrap .qBgcolor {position:absolute; top:0px; left:0px; z-index:-1; width:100%;  height:80%; background:rgba(29,36,54,1); overflow:hidden;}
.widequick142 .qBoxbg_wrap .qBgcolor > img {position:absolute; top:0px; left:0px; z-index:0; width:100%; height:auto; min-height:100%; opacity:0.5;}

.widequick142 .qBox {position:relative; top:20%; left:0; z-index:1; width:100%; display:inline-block; text-align:center; box-sizing:border-box; margin-bottom:50px;}

.widequick142 .qBox ul {position:relative; width:90%; margin:0 auto; overflow:hidden;}
.widequick142 .qBox ul li {position:relative; float:left; height:570px; margin-left:2%; box-sizing:border-box; border:1px solid rgba(255, 255, 255, 0.26);}
.widequick142 .qBox ul li:first-child {margin-left:0;}
.widequick142 .qBox ul li:only-child {width:96%;}
.widequick142 .qBox ul li:nth-last-child(2),
.widequick142 .qBox ul li:nth-last-child(2)+li {width:49%;}
.widequick142 .qBox ul li:nth-last-child(3),
.widequick142 .qBox ul li:nth-last-child(3)~li {width:32%;}
.widequick142 .qBox ul li:nth-last-child(4),
.widequick142 .qBox ul li:nth-last-child(4)~li {width:23.5%}

.widequick142 .qBox ul li .acline {display:block; position:absolute; background:#fff; transition:all .5s; z-index:3;}
.widequick142 .qBox ul li .acline:nth-child(1) {top:0; width:0; height:1px;}
.widequick142 .qBox ul li .acline:nth-child(2) {top:0; right:0; width:1px; height:0;}
.widequick142 .qBox ul li .acline:nth-child(3) {bottom:0; right:0; width:0; height:1px;}
.widequick142 .qBox ul li .acline:nth-child(4) {bottom:0; left:0; width:1px; height:0;}
.widequick142 .qBox ul li:hover .acline:nth-child(1) {width:100%;}
.widequick142 .qBox ul li:hover .acline:nth-child(2) {height:100%;}
.widequick142 .qBox ul li:hover .acline:nth-child(3) {width:100%;}
.widequick142 .qBox ul li:hover .acline:nth-child(4) {height:100%;}

.widequick142 .qBox .qCont {position:relative; z-index:1; width:100%; height:100%; box-sizing:border-box; overflow:hidden;}
.widequick142 .qBox .qCont .qbnr {position:absolute; left:0; top:0; z-index:1; width:100%; height:100%; background:#fff; display:block; overflow:hidden; box-sizing:border-box;}
.widequick142 .qBox .qCont .qbnr .qColor {position:absolute; z-index:2; top:0px; left:0px;  width:100%; height:100%;}
.widequick142 .qBox .qCont .qbnr .bnBgimg {position:absolute; z-index:1; left:-999px; right:-999px; bottom:-999px; top:-999px; opacity:1; margin:auto; width:auto; min-width:100%; min-height:100%; display:inline-block; vertical-align:middle;}
.widequick142 .qBox .qCont .qbnr:hover .bnBgimg {transform:scale(1.1); transition:transform 1s ease 0s;}


.widequick142 .qBox .qCont .qbnr .iconBox {position:absolute; top:14%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); z-index:3; width:100px; height:100px; overflow:hidden; box-sizing:border-box;}
.widequick142 .qBox .qCont .qbnr .iconBox img {width:100%; height:100%;}

.widequick142 .qBox .qCont .qbnr .txtBox {position:absolute; top:34%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); z-index:3; width:80%; height:50%; color:#fff; overflow:hidden;}
.widequick142 .qBox .qCont .qbnr .txtBox .tit {margin-bottom:5%; -webkit-line-clamp:1; text-overflow:ellipsis; white-space:normal; -webkit-box-orient:vertical; display:-webkit-box; overflow:hidden;}
.widequick142 .qBox .qCont .qbnr .txtBox .txt {height:52%; line-height:1.4em; overflow:hidden;
                                              -webkit-line-clamp:7; text-overflow:ellipsis; white-space:normal; -webkit-box-orient:vertical; display:-webkit-box;}
.widequick142 .qBox .qCont .qbnr .txtBox .btnLink {position:absolute; bottom:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);
                                                  width:auto; min-width:50%; height:60px; line-height:60px; padding:0 15px; color:#fff; box-sizing:border-box; border:1px solid #fff;
                                                -webkit-line-clamp:1; text-overflow:ellipsis; white-space:normal; -webkit-box-orient:vertical; display:-webkit-box; overflow:hidden;}
.widequick142 .qBox .qCont .qbnr .txtBox .btnLink:hover {font-weight:600; color:#000; background:#fff;}


/* layout */
.border-radius .widequick142 .qBox .qCont {border-radius:15px;}
.border-radius .widequick142 .qBox ul li {border-radius:15px;}
.border-radius .widequick142 .qBox ul li:hover {border:1px solid #fff;}
.border-radius .widequick142 .qBox ul li .acline {display:none;}
.border-radius .widequick142 .qBox .qCont .qbnr .txtBox .btnLink {border-radius:10px;}


@media (max-width:799px) {
  .widequick142 .qBoxbg_wrap {padding:30px 0 0;}
  .widequick142 .qBoxbg_wrap .qBgcolor {height:100%;}
  .widequick142 .qBox {top:10%; margin-bottom:0;}
  .widequick142 .qBox ul li {width:90% !important; float:none !important; margin:0 auto 30px !important; height:300px;}
  .widequick142 .qBox .qCont .qbnr .iconBox {top:5%;}
  .widequick142 .qBox .qCont .qbnr .txtBox {top:42%; height:50%;}
  .widequick142 .qBox .qCont .qbnr .txtBox .tit {margin-bottom:2%;}
  .widequick142 .qBox .qCont .qbnr .txtBox .txt {height:38%; -webkit-line-clamp:3;}
  .widequick142 .qBox .qCont .qbnr .txtBox .btnLink {height:40px; line-height:40px; padding:0 10px;}
}