.hisClick { position: absolute; right: 0; width: 200px; top: 50%; transform: translateY(-50%); z-index: 11; } .hisClick .height { height: 80px; } .hisTop { height: 15px; width: 30px; position: absolute; top: -7.5px; left: 40px; background: url(../images/his_top.png) no-repeat center; background-size: 15px 10px; z-index: 11; } .hisDown { height: 15px; width: 30px; position: absolute; bottom: -7.5px; left: 40px; background: url(../images/his_down.png) no-repeat center; background-size: 15px 10px; z-index: 11; } .topLong { height: 1px; width: 130px; background: #999999; position: absolute; top: 0; right: 0; } .topShort { height: 1px; width: 40px; background: #999999; position: absolute; top: 0; left: 0; } .btmLong { height: 1px; width: 130px; background: #999999; position: absolute; bottom: 0; right: 0; } .btmShort { height: 1px; width: 40px; background: #999999; position: absolute; bottom: 0; left: 0; } .hisCenter { height: 1px; width: 40px; background: #999999; position: absolute; top: 50%; left: 0; transform: translateY(-50%); } .hisRed { height: 30px; width: 3px; background: #FD1E00; position: absolute; top: 50%; right: -2px; transform: translateY(-50%); } .hisAct .flex { transform: scale(1.3); transition: all .3s; } .hisTime { width: 344px; height: 400px; border-right: 1px solid #f6f6f6; } .timeBox { transition-timing-function: linear; flex-direction: column; } .yearTitle { font-size: 26px; } .yearUnit { font-size: 12px; } .hisCon { display: none; } .swiper-slide { transform: scale(0.75); transition: all .3s; } .my-slide-next { transform: scale(0.9) !important; box-shadow: 0px 8px 20px 1px rgba(50, 51, 51, 0.19); } .certArr { width: 52px; height: 52px; position: absolute; top: 50%; transform: translateY(-50%); margin: auto; z-index: 11; opacity: .4; transition: all .3s; } .certArr:hover{ opacity: 1; } .certLeft { background: url(../images/cretArr-r.png?time=3) no-repeat center; background-size: 52px 52px; transform: rotate(180deg); left: -60px; } .certRight { background: url(../images/cretArr-r.png?time=3) no-repeat center; background-size: 52px 52px; right: -60px; } .redBtn { border: 1px solid #FD1E00; padding: 10px 20px; color: #FD1E00; } .autorCon { position: absolute; width: 58.75%; border: 1px solid #999999; padding: 20px; right: 0; margin-top: 30px; } .autorCon .box { margin-left: 135px; } .autorCon .box .desc { line-height: 30px; } .autorIco { /* width: 600px; */ height: 400px; z-index: 2; } .keyword{ font-size: 22px; } .garyBtn{ color: #A7A7A7; border: 1px solid #A7A7A7; padding: 10px 20px; } a:hover .garyBtn{ color: #DA2735 !important; border: 1px solid #DA2735; } a:hover .b1{ display: none; } a:hover .b2{ display: block !important; transition: lrMove .3s linear inherit; } .createdSild:nth-child(2n){ flex-flow:row-reverse } .autorCon .title::after{ position: absolute; bottom: 0; left: 0; margin: auto; content: ''; width: 54px; height: 5px; background: #000000; border: 1px solid #000000; } .descLine::after{ position: absolute; bottom: 0; left: 0; margin: auto; content: ''; width: 54px; height: 5px; background: #000000; border: 1px solid #000000; } .descLine::before{ position: absolute; /* top: 0; */ bottom: 2px; left: 0; right: 0; margin: auto; content: ''; height: 1; background: #dedede; } .ccBox .li{ height: 31.25vw; margin-bottom: 90px; } .ccBox .cDesc{ font-size: 20px; line-height: 30px; } .ccBox .li:nth-child(2n-1){ /*color: #333;*/ } .ccBox .li:nth-child(2n) .flex{ /*color: #fff;*/ align-items: flex-end; } .ccBox .li .newsPage{ border: 1px solid #333; color: #333; } /*.ccBox .li:nth-child(2n-1) .newsPage{*/ /* border: 1px solid #333;*/ /* color: #333;*/ /*}*/ /*.ccBox .li:nth-child(2n) .newsPage{*/ /* border: 1px solid #fff;*/ /* color: #fff;*/ /*}*/ .ccBox a:hover .newsPage{ border: 1px solid #DA2735 !important; color: #DA2735 !important;; } .cycx{ position:absolute;left:0;right:0;margin:auto; } .cycx .fatTitle{ font-size: 74px; } #page_22 .mWrap .left{ width: 300px; } #page_22 .mWrap .right{ width: calc(100% - 300px); } @media screen and (max-width: 768px) { .hisConWidth{ min-width:100%; } .cycx .fatTitle{ font-size: 30px; } #page_22 .mWrap .left{ min-width: 100%; justify-content:center !important; padding-right: 0; } #page_22 .mWrap .right{ min-width: 100%; } .hisConWidth:before, .hisConWidth:after{ display: none; } #page_23 .li{ height: auto; margin-bottom: 30px; } #page_23 .li img{ display: none; } .cycx{ position: relative; } .timeTIps{ display:none; } } .timeTIps{ position:absolute; bottom:20px; left:0; right:0; margin:auto; }