.hearder-top{ border-bottom: 4px solid #c80207; } .hearder-down{ margin-top: 0 !important; } /*# */ .banner{ width: 100%; overflow: hidden; } .banner .flex-direction-nav{display: none;} .banner .ban-box{ width: 89%; bottom: 5.5%; left:0; height: 20px; padding-right: 7%; box-sizing:border-box; opacity: 0; } .banner .flex-control-nav{ width: 160px; height: 20px; text-align: center; position: absolute; right: 40%; } .banner .flex-control-paging li{ margin: 0 5px; text-align: center; } .banner .line{ background-color: rgba(255,255,255,0.5); height:0px; z-index: 30; position: absolute; right: 4%; bottom: 3%; transition:all 0.4s; -webkit-transition:all 0.4s; } .indpro{ width: 92%; max-width: 1800px; margin: 10px auto 60px; } .indpro .h_h1{text-align:center;font-size:40px;line-height:30px;color:#000000;padding-bottom:20px; margin:80px 0 0 0;} .indpro .h_h1.on{background: center bottom no-repeat;} .indpro .h_h1 span{font-family:arial;font-size:30px;line-height:30px;color:#999999;text-transform:uppercase;} .indpro .h_h2{text-align:center;font-size:16px;line-height:30px;color:#666666;margin:10px 0 25px 0;overflow:hidden;} @media (max-width:1200px){ .indpro .h_h1{text-align:center;font-size:30px;line-height:30px;color:#000000;padding-bottom:20px; margin:80px 0 0 0;} .indpro .h_h1.on{background: center bottom no-repeat;} .indpro .h_h1 span{font-family:arial;font-size:30px;line-height:30px;color:#999999;text-transform:uppercase;} .indpro .h_h2{text-align:center;font-size:16px;line-height:30px;color:#666666;margin:10px 0 25px 0;overflow:hidden;} } .indpro .title{ text-align: center; margin-bottom: 55px; } .indpro .title h2,.indsx .box .warp .title h2{ font-size: 42px; line-height: 70px; color: #282828; text-transform:uppercase; font-family: 'open sans','arial'; } .indpro .title h2 span,.indsx .box .warp .title h2 span{ font-size: 60px } .indpro .title .fa{ font-size: 36px; color: #282828; line-height: 45px; font-family: '΢���ź�' } .indpro .pc-list{ width:100%; color: #fff; padding-bottom: 50px; overflow: hidden; } .indpro .pc-list ul{ width: 103%; } .indpro .pc-list li{ width:18%; float: left; margin-right: 1.6%; text-align: center; box-sizing:border-box; } .indpro .pc-list li a{ display: block; width:100%; height:100%; margin: 0 auto; cursor: pointer; border:1px solid #e5e5e5; } .indpro .pc-list li a .pic{ width: 100%; overflow: hidden; background-color: #000; } .indpro .pc-list li a .pic img{ display: inline-block; width: 100%; transition: all ease-in .3s; -webkit-transition: all ease-in .3s; transform: scale(1.12); opacity: 0.8; filter: alpha(opacity=80); } .indpro .pc-list li:hover a .pic img{ transform: scale(1.02); opacity:1; filter: alpha(opacity=100); } .indpro .pc-list li a .box{ padding:43px 3% 0; position: relative; } .indpro .pc-list li a .box h2{ font-size: 22px; color: #282828; font-family: '΢���ź�'; line-height:30px; min-height: 60px; /*margin-bottom: 60px;*/ } .indpro .pc-list li a .box .details,.indpro .pc-list li a .box .details p{ font-size: 14px; color: #666666; line-height: 28px; } .indpro .pc-list li a .box .details{min-height:130px} .indpro .pc-list li a .box .btn{ width: 170px; height: 30px; line-height: 30px; background-color: #e5e5e5; font-size: 16px; color: #282828; margin:0 auto; display: block; transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .indpro .pc-list li a .box .btn:hover{ color: #fff; background-color: #a40000; } .indsx{ width: 100%; height: auto; position: relative; } @media (max-width:1200px){ .indsx .pic{ width: 100%; overflow: hidden; background: url(/uploads/image/tpsimages/15059941921954pkwhf.jpg) center/cover no-repeat; height:200px; } } @media (min-width:1200px){ .indsx .pic{ width: 100%; overflow: hidden; background: url(/uploads/image/tpsimages/15059941921954pkwhf.jpg) center/cover no-repeat; height:500px; } } .indsx .pic img{ display: block; width:100%; position: relative; } .indsx .box{ position: absolute; top:55%; width:92%; right: 0; margin-right: -700px; max-width: 1400px; text-align: center; z-index: 3; } .indsx .box .warp{ width:610px; float: right; } .indsx .box .warp .title h2{ color: #fff; margin-bottom: 15px; } .indsx .box .warp .title .tit{ color: #fff; font-size: 36px; line-height: 45px; margin-bottom: 20px; } .indsx .box .warp .details{ padding-top: 60px; position: relative; } .indsx .box .warp .details:before{ display: block; width: 1px; height: 53px; background-color: rgba(255,255,255,0.2); position: absolute; left: 49.5%; top: 0; content: ''; } .indsx .box .warp .details .name{ font-size: 30px; color: #ffffff; line-height: 40px; font-family: 'arial'; margin-bottom: 10px; } .indsx .box .warp .details .name span{ font-size: 18px; font-family: '΢���ź�'; padding-left: 10px; } .indsx .box .warp .details .fa{ font-size: 14px; line-height: 28px; color: #ffffff; font-family: 'arial'; padding-bottom: 60px; margin-bottom: 55px; background: center bottom no-repeat; } .indsx .box .warp .details .btns{ font-size: 18px; line-height:28px; background-color: #a40000; line-height: 28px; width: 166px; border:1px solid #a40000; display: block; color: #fff; font-family: 'arial'; margin: 0 auto; transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .indsx .box .warp .details .btns:hover{ background-color: transparent; color: #a40000; } #indpro .flex-direction-nav,.indpro #ph-list,.indpro .swiper-pagination{display: none;} .indjj{ width: 100%; background: center/cover no-repeat; } .indjj .title{ width: 100%; position: relative; z-index: 2; } .indjj .title img{ padding-top: 90px; width: 42px; margin: 0 auto; display: block; } .indjj .title:before{ content: ' '; display: block; width: 1px; height: 73px; background-color: #b8b8b8; position: absolute; top: 0; left: 50%; } .indjj .warp{ width: 92%; max-width: 1400px; margin: 0 auto; position: relative; padding-bottom: 85px; } .indjj .warp .pic{ width: 642px; margin: 0 auto; position: relative; padding-right: 35px } .indjj .warp .pic .img{ display: block; width: 100%; } .indjj .warp .pic .mbox{ position: absolute; top: 0; left: 0; width: 100%; } .indjj .warp .pic .mbox .img1{ display: block; width: 117px; margin:175px auto 0; } .indjj .warp .pic .mbox .img2{ width: 370px; margin: 0 auto 15px; display: block; } .indjj .warp .pic .mbox .fa{ font-size: 26px; line-height: 36px; color: #282828; font-family: '΢���ź�'; text-align: center; } .indjj .warp .box{ position: absolute; transition: all .3s; -webkit-transition: all .3s; /*opacity: 0;*/ } /*.indjj .warp .box.on{ opacity: 1; }*/ .indjj .warp .box h2{ font-size: 22px; line-height: 30px; color: #282828; margin-bottom: 12px; position: relative; /*top:-20px;*/ transition: all .5s; -webkit-transition: all .5s; /*opacity: 1;*/ } /*.indjj .warp .box.on h2{top: 0;opacity: 1;}*/ .indjj .warp .box .fa{ font-size: 14px; color: #787878; line-height: 24px; transition: all .5s; -webkit-transition: all .5s; position: relative; /*top: 20px;*/ } /*.indjj .warp .box.on .fa{top: 0}*/ .indjj .warp .box1{ width: 240px; left: 50%; margin-left:-602px; top: 0; text-align: right; } .indjj .warp .box1 img{ display: block; width: 272px; position: absolute; right:-295px; top:30px; } .indjj .warp .box2{ width: 205px; top: 240px; margin-left: -654px; left: 50%; text-align: right; } .indjj .warp .box2 img{ display: block; width: 310px; position: absolute; right:-330px; top:25px; } .indjj .warp .box3{ width: 220px; top:540px; left:50%; margin-left: -610px; text-align: right; } .indjj .warp .box3 img{ display: block; width: 245px; position: absolute; right:-268px; top: -37px; } .indjj .warp .box4{ width:210px; top:95px; left:50%; margin-left: 422px; text-align: left; } .indjj .warp .box4 img{ display: block; width: 183px; position: absolute; left:-206px; top: -11px; } .indjj .warp .box5{ width:265px; top:475px; left: 50%; margin-left: 510px; text-align: left; } .indjj .warp .box5 img{ display: block; width: 338px; position: absolute; left:-361px; top: -7px; } .inddb{ width: 100%; position: relative; } .inddb .pic{ width: 100%; overflow: hidden; } .inddb .pic img{ display: block; width: 100%; } .inddb .warp{ position: absolute; top: 0; right: 0; width: 100%; padding: 0 10%; box-sizing: border-box; z-index: 2; height: 100%; overflow: hidden; } .inddb .warp .mbox{ width: 20%; height: 100%; float: left; text-align: center; position: relative; box-sizing:border-box; border-right: 1px solid rgba(255,255,255,0.2) } .inddb .warp .mbox .box{ transition: all ease .3s; -webkit-transition: all ease .3s; background-color: transparent; } .inddb .warp .mbox1 .box{ height: 65%; width: 100%; position: absolute; bottom: 0; left: 0; border-left: 1px solid rgba(255,255,255,0.2); border-top: 1px solid rgba(255,255,255,0.2); box-sizing:border-box; transition: all .5s; -webkit-transition: all .5s; } .inddb .warp .mbox .box:hover,.inddb .warp .mbox .box.on{ background-color: rgba(202,0,0,0.8); } .inddb .warp .mbox .box a{ display: block; width: 100%; height: 100%; cursor: pointer; } .inddb .warp .mbox .box .title{ width:199px; margin:45px auto 25%; padding:70px 0 65px; transition: all .5s; -webkit-transition: all .5s; position: relative; } .inddb .warp .mbox .box .title:before,.inddb .warp .mbox .box .title:after{ display: block; width: 0; height: 1px; content: ''; position: absolute; left: 0; background-color: rgba(255,255,255,0.2); transition: all ease-in .4s; -webkit-transition: all ease-in .4s; margin-left: 0; left: 50%; } .inddb .warp .mbox .box .title:before{top: 0;} .inddb .warp .mbox .box .title:after{bottom: 0;} .inddb .warp .mbox .box:hover .title:before,.inddb .warp .mbox .box.on .title:before{ width: 100%; left: 0; } .inddb .warp .mbox .box:hover .title:after,.inddb .warp .mbox .box.on .title:after{ width: 100%; left: 0; } .inddb .warp .mbox .box .title h2{ font-size: 24px; line-height: 30px; color: #ffffff; font-family: '΢���ź�'; position: relative; bottom: 5px; transition: all ease-in .4s; -webkit-transition: all ease-in .4s; } .inddb .warp .mbox .box:hover .title h2,.inddb .warp .mbox .box.on .title h2{bottom: 0} .inddb .warp .mbox .box .title .fa{ font-size: 16px; line-height: 30px; color: #ffffff; font-family: 'arial'; position: relative; top: 5px; transition: all .4s; -webkit-transition: all .4s; } .inddb .warp .mbox .box:hover .title .fa,.inddb .warp .mbox .box.on .title .fa{top: 0} .inddb .warp .mbox .box i{ display: block; width:50px; height: 50px; margin: 0 auto; transition: all ease .5s; -webkit-transition: all ease .5s; background: center/100% auto no-repeat; position: relative; top: 15px; opacity: 0; } .inddb .warp .mbox .box:hover i,.inddb .warp .mbox .box.on i{opacity: 1;top: 0;} .inddb .warp .mbox2 .box{ height: 50.7%; border-bottom: 1px solid rgba(255,255,255,0.2); position: absolute; top: 0; left: 0; width: 100%; } .inddb .warp .mbox2 .box .title{ margin:45px auto 20%; } .inddb .warp .mbox3{ border-right: 0; } .inddb .warp .mbox3 .box{ width: 100%; height: 47.5%; position: absolute; left: 0; bottom: 12%; border: 1px solid rgba(255,255,255,0.2); border-left:0; } .inddb .warp .mbox3 .box .title{ margin: 45px auto 15%; } .inddb .warp .mbox4{ width: 43%; } .inddb .warp .mbox4 .box{ height: 33%; position: absolute; left: 0px; bottom: 6.5%; width: 100%; border: 1px solid rgba(255,255,255,0.2); border-right: 0; } .inddb .warp .mbox4 .box .mian{ width: 64%; } .inddb .warp .mbox4 .box .title{ margin: 30px auto 8%; padding: 30px 0 30px; } .inddb .list,.indnew #ph-indnew,.indnew .swiper-indnew{display: none;} .indser{ width: 100%; padding: 180px 0 165px; position: relative; } .indser .img{ display: block; width: 28.5%; position: absolute; left: 0; bottom: 0; } .indser .warp{ width: 92%; max-width: 1400px; margin: 0 auto; position: relative; z-index: 3; } .indser .warp .left{ width: 40%; float: left; } .indser .warp .left .title{margin-bottom: 50px;} .indser .warp .left .title h2,.indku .mian .title h2,.indnew .title h2{ font-size:42px; color: #282828; line-height: 60px; text-transform: uppercase; font-family: 'open sans','arial'; } .indser .warp .left .title span,.indku .mian .title h2 span,.indnew .title h2 span{ font-size: 60px; } .indser .warp .left .title .fa,.indku .mian .title .fa,.indnew .title .fa{ font-size: 36px; color: #282828; line-height: 45px; font-family: '΢���ź�' } .indser .warp .left .box{ /* padding-left: 25%; */ font-family: '΢���ź�'; position: relative; } /* .indser .warp .left .box:before{ display: block; width: 20%; left: 0; height: 1px; top: 14px; content: ''; background-color: #cccccc; position: absolute; } */ .indser .warp .left .box .details h3{ font-size: 18px; line-height: 28px; } .indser .warp .left .box .details p,.indser .warp .left .box .details{ font-size: 15px; line-height: 28px; color: #282828; text-align: justify; } .indser .warp .left .box .more{ font-size: 15px; line-height: 34px; color: #ffffff; width: 128px; display: block; text-align: center; border:1px solid #ca0000; background-color:#ca0000; height: 34px; margin-top: 75px; transition: all ease .4s; -webkit-transition: all ease .4s; } .indser .warp .left .box .more:hover{ background-color:transparent; color: #a65300 } .indser .warp .right{ width: 53%; float: right; } .indser .warp .right img{ display: block; max-width: 100%; } .indku{ width: 100%; background-color: #f5f5f5; padding: 110px 0 140px; } .indku .mian{ width: 92%; margin: 0 auto; max-width: 1400px; } .indku .mian .title{margin-bottom: 60px;} .indku .mian .warp .left{ width: 23.5%; float: left; } .indku .mian .warp .left img{max-width: 100%;} .indku .mian .warp .right{ width: 75.8%; float: left; position: relative; overflow: hidden; } .indku .mian .warp .right:before{ display: block; width: 100%; content: ''; height: 1px; background-color: #dcdcdc; position: absolute; top: 0; left: 24px; } .indku .mian .warp .right .top{ margin-bottom:2.2%; position: relative; } .indku .mian .warp .right .mbox .pic{ width: 31%; float: left; margin-left:2.1%; position: relative; } .indku .mian .warp .right .mbox .pic a,.indnew .pc-list ul li a{ display: block; width: 100%; height: 100%; cursor: pointer; } .indku .mian .warp .right .mbox .pic img{ width: 100%; display: block; } .indku .mian .warp .right .mbox .pic .tip{ position: absolute;top: 0; left: 0; width: 100%; height: 100%; text-align: center; transition: all ease .4s; -webkit-transition: all ease .4s; } .indku .mian .warp .right .mbox .pic:hover .tip{background-color: rgba(0,0,0,0.2);} .indku .mian .warp .right .mbox .pic .tip .fa{ font-size: 26px; line-height: 34px; color: #ffffff; font-family: '΢���ź�'; padding: 20% 0 20%; background: center bottom/40px no-repeat; } .indku .mian .warp .right .mbox .box{ width: 58%; float: left; margin-left: 7%; } .indku .mian .warp .right .mbox .box h3{ font-size: 24px; line-height: 28px; color: #282828; margin: 70px 0 10px; } .indku .mian .warp .right .mbox .box .fa{ font-size: 14px; line-height: 28px; color: #282828; text-align: justify; } .indnew{ width: 92%; max-width: 1722px; margin: 0 auto; padding: 30px 0 80px; } @media (min-width:1500px){ .indnew .title {width:1722px;margin:0 auto;} .indnew .title .h_h1{text-align:center;font-size:40px;line-height:50px;color:#000000;padding-bottom:20px; margin:38px 0 0 0;} .indnew .title .h_h1.on{background: center bottom no-repeat;} .indnew .title .h_h1 span{font-family:arial;font-size:30px;line-height:30px;color:#999999;text-transform:uppercase;} .indnew .title .h_h2{text-align:center;font-size:16px;line-height:30px;color:#666666;margin:10px 0 65px 0;overflow:hidden;} } @media only screen and (min-width: 1330px) and (max-width: 1500px) { .indnew .title {width:1200px;margin:0 auto;} .indnew .title .h_h1{text-align:center;font-size:40px;line-height:50px;color:#000000;padding-bottom:20px; margin:38px 0 0 0;} .indnew .title .h_h1.on{background: center bottom no-repeat;} .indnew .title .h_h1 span{font-family:arial;font-size:30px;line-height:30px;color:#999999;text-transform:uppercase;} .indnew .title .h_h2{text-align:center;font-size:16px;line-height:30px;color:#666666;margin:10px 0 65px 0;overflow:hidden;} } @media (max-width:1300px){ .indnew .title {width:1005;margin:0 auto;} .indnew .title .h_h1{text-align:center;font-size:30px;line-height:50px;color:#000000;padding-bottom:20px; margin:0px 0 0 0;} .indnew .title .h_h1.on{background: center bottom no-repeat;} .indnew .title .h_h1 span{font-family:arial;font-size:30px;line-height:30px;color:#999999;text-transform:uppercase;} .indnew .title .h_h2{text-align:center;font-size:16px;line-height:30px;color:#666666;margin:10px 0 15px 0;overflow:hidden;} } .indnew .pc-list ul li{ width: 31%; float: left; margin-right:3.5%; } .indnew .pc-list ul li:last-child{margin-right: 0} .indnew .pc-list ul li a .box{margin-top: 30px;} .indnew .pc-list ul li a .box h3{ font-size: 20px; color: #282828; line-height: 30px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family: '΢���ź�'; margin-bottom: 15px; transition: all .3s; -webkit-transition: all .3s; } .indnew .pc-list ul li:hover a .box h3{color: #a65300;} .indnew .pc-list ul li a .box .time{ font-size: 14px; color: #282828; line-height: 24px; margin-bottom: 10px; } .indnew .pc-list ul li a .box .fa{ font-size: 14px; line-height: 28px; color: #282828; height: 52px; overflow: hidden; } .indnew .pc-list ul li a .pic{ width: 100%; overflow: hidden; /*background-color: #000;*/ } .indnew .pc-list ul li a .pic img{ display: inline-block; width: 100%; height: 22em; transition: all ease-in .3s; -webkit-transition: all ease-in .3s; transform: scale(1.1); -webkit-transform: scale(1.1); /*opacity: 0.9;*/ /*filter: alpha(opacity=80);*/ } .indnew .pc-list ul li:hover a img{ transform: scale(1.02); -webkit-transform: scale(1.02); /*opacity: 1;*/ /*filter: alpha(opacity=100);*/ } @media (max-width:1600px){ .indjj .warp .box5{margin-left:30%;} .inddb .warp .mbox .box .title{ width:160px; padding: 50px 0 50px; } .inddb .warp .mbox4 .box .title{ margin: 30px auto 8%; padding: 30px 0 30px; } .inddb .warp .mbox .box .title h2{ font-size: 20px; line-height: 30px; } .inddb .warp .mbox .box .title .fa{ font-size: 14px; line-height: 20px; } .inddb .warp .mbox .box i{ width:40px; height: 40px; } .indser{padding: 150px 0 120px;} } @media (max-width:1500px){ .indsx .box{ right: 0; margin-right: 4%; } } @media (max-width:1400px){ .indsx .pic img{ width:1400px; left: 50%; height: 670px; margin-left: -750px; position: relative; } .indsx .box .warp .details .fa{ padding-bottom: 50px; margin-bottom: 45px; } .indsx .box .warp .details{padding-top: 50px;} .indsx .box .warp .details:before{height: 40px} .indjj .warp .pic{width: 540px;} .indjj .warp .pic .mbox .img1{width: 85px;margin: 140px auto 0;} .indjj .warp .pic .mbox .img2{width: 270px} .indjj .warp .pic .mbox .fa{font-size: 20px;line-height: 30px;} .indjj .warp .box1{margin-left:-545px} .indjj .warp .box1 img{width: 230px;right: -250px;} .indjj .warp .box2 img{width: 255px;top: 30px;right: -275px;} .indjj .warp .box2{margin-left: -582px;top: 196px;} .indjj .warp .box3 img{width: 208px;right: -230px;} .indjj .warp .box3{margin-left: -560px;top: 450px} .indjj .warp .box4 img{width: 125px;left: -145px;} .indjj .warp .box4{top: 101px;margin-left: 326px;} .indjj .warp .box5 img{width: 295px;left: -315px;} .indjj .warp .box5{top:410px} .inddb .warp{width: 100%;padding: 0 5%;} .inddb .warp .mbox .box .title{padding: 40px 0 40px;} .inddb .warp .mbox4 .box .title{ margin: 20px auto 8%; padding: 20px 0 20px; } } @media (max-width:1200px){ .indpro .pc-list li a .box h2{ font-size: 20px; line-height: 28px; } .indpro .pc-list li a .box{ padding: 30px 3% 0; } .indpro .pc-list li a .box .btn{ font-size: 15px; } .indsx .box .warp{width: 570px} .indsx .box .warp .details .fa{padding-bottom: 40px;} .indjj .warp .pic{width:420px;} .indjj .warp .pic .mbox .img1{width:75px;margin:105px auto 0;} .indjj .warp .pic .mbox .img2{width:230px} .indjj .warp .pic .mbox .fa{font-size: 18px;line-height:26px;} .indjj .warp .box h2{font-size: 18px;line-height: 26px} .indjj .warp .box .fa{line-height: 20px} .indjj .warp .box1{margin-left:-504px} .indjj .warp .box1 img{width: 200px;right:-217px;} .indjj .warp .box2 img{width:219px;top: 30px;right:-234px;} .indjj .warp .box2{margin-left: -522px;top: 144px;} .indjj .warp .box3 img{width: 177px;right:-194px;} .indjj .warp .box3{margin-left:-516px;top:360px} .indjj .warp .box4 img{width: 110px;left:-125px;top:0px;} .indjj .warp .box4{top: 61px;margin-left: 261px;} .indjj .warp .box5 img{width: 230px;left: -247px;} .indjj .warp .box5{top:316px;margin-left: 23%;} .inddb .pic img{ width: 1200px; height: 560px; position: relative; left: 50%; margin-left: -600px; } .inddb .warp .mbox .box .title{width: 140px} .inddb .warp .mbox .box i{ width: 30px; height: 30px; } .inddb .warp .mbox .box .title h2{ font-size: 18px; } .indser{padding: 130px 0 100px;} .indser .warp .left{width: 41%} .indser .warp .left .title{margin-bottom: 30px} /* .indser .warp .left .box{padding-left: 20%;} */ /* .indser .warp .left .box:before{width: 15%} */ .indser .warp .left .box .more{margin-top: 40px;} .indku .mian .warp .right .mbox .box{ width: 60%; margin-left: 5%; } .indku .mian .warp .right .mbox .box h3{margin: 45px 0 10px;} } @media (max-width:1024px){ .indpro .title h2,.indsx .box .warp .title h2,.indser .warp .left .title h2,.indku .mian .title h2, .indnew .title h2{font-size: 34px;} .indpro .title h2 span,.indsx .box .warp .title h2 span,.indser .warp .left .title span, .indku .mian .title h2 span,.indnew .title h2 span{ font-size: 48px; } .indpro .title img{margin: 90px 0 17px;} .indpro .title .fa,.indser .warp .left .title .fa,.indku .mian .title .fa, .indnew .title .fa{font-size: 29px;} .indpro .pc-list{display: none;} .indpro #ph-list,.indnew #ph-indnew{ display: block; width: 100%; margin: 0 auto; position: relative; overflow: hidden; direction: ltr; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; } .indpro #ph-list .swiper-wrapper,.indnew #ph-indnew .swiper-wrapper{ position: relative; width: 100%; height: 100%; } .indpro #ph-list .swiper-wrapper .swiper-slide,.indnew #ph-indnew .swiper-wrapper .swiper-slide{ width: 50%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; text-align: center; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .indpro #ph-list .swiper-wrapper .swiper-slide a,.indnew #ph-indnew .swiper-wrapper .swiper-slide a{ display: block; width: 92%; margin: 0 auto; border:1px solid #e5e5e5; } .indpro #ph-list .swiper-wrapper .swiper-slide a .pic,.indnew #ph-indnew .swiper-wrapper .swiper-slide a .pic{ width: 100%; } .indpro #ph-list .swiper-wrapper .swiper-slide a .pic img,.indnew #ph-indnew .swiper-wrapper .swiper-slide a .pic img{ display: block; width: 100%; } .indpro #ph-list .swiper-wrapper .swiper-slide a .box{ padding:43px 3% 0; position: relative; } .indpro #ph-list .swiper-wrapper .swiper-slide a .box h2{ font-size: 20px; color: #282828; font-family: '΢���ź�'; line-height:30px; min-height: 60px; /*margin-bottom: 35px;*/ } .indpro #ph-list .swiper-wrapper .swiper-slide a .box .details,.indpro #ph-list .swiper-wrapper .swiper-slide a .box .details p{ font-size: 14px; color: #666666; line-height: 28px; } .indpro #ph-list .swiper-wrapper .swiper-slide a .box .details{min-height:130px} .indpro #ph-list .swiper-wrapper .swiper-slide a .box .btn{ width: 170px; height: 30px; line-height: 30px; background-color: #e5e5e5; font-size: 14px; color: #282828; margin:0 auto; display: block; transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .indpro .swiper-pagination{ display: block; text-align: center; width: 100%; position: relative; margin:30px 0 0; } .indpro .swiper-pagination-bullet{ width: 10px; border-radius: 100%; border:1px solid #e5e5e5; height: 10px; background: #fff; opacity: 1; margin: 0 6px; } .indpro .swiper-pagination-bullet-active{ background-color: #a40000 } .indsx .box .warp .details .name,.indsx .box .warp .details .fa{display: none;} .indsx .box .warp{width: 480px;} .indsx .box{top: 42%;} .indsx .box .warp .details:before{display: none;} .indsx .pic img{ width: 1200px; height: 574px; margin-left: -600px; } .indjj .warp{width: 70%;padding-bottom: 30px;} .indjj .warp .pic{width:100%;margin:30px auto ;padding: 0} .indjj .warp .box{ position: relative; width: 45%; left: 0; top: 0; float: left; transition: all 0s; -webkit-transition: all 0s; opacity:1; margin: 0 0 25px 0; text-align: left; padding-left: 5%; } .indjj .warp .box h2{ top:0px; transition: all 0; -webkit-transition: all 0; opacity: 1; } .indjj .warp .box .fa{ transition: all 0s; -webkit-transition: all 0s; top: 0px; line-height: 24px; } .indjj .warp .box img{display: none;position: relative;} .inddb .warp{width: 100%;} .inddb .warp .mbox{width: 20%;} .inddb .warp .mbox4{width: 37%} .inddb .warp .mbox .box .title{padding: 40px 0 0px;width: 100%;} .inddb .warp .mbox4 .box .title{margin: 0px auto 15%;} .inddb .warp .mbox .box .title:before, .inddb .warp .mbox .box .title:after{display: none;} .inddb .warp .mbox .box .title h2{bottom: 0} .inddb .warp .mbox .box .title .fa{top: 0} .inddb .warp .mbox .box i{opacity: 1;top: 0;} .inddb .warp .mbox .box .title:before, .inddb .warp .mbox .box .title:after{ width: 100%; left: 0 } .indser,.indku,.indnew{padding: 100px 0 100px;} .indser .img,.indnew .pc-list{display: none;} .indser .warp .left{margin-bottom: 50px;} .indser .warp .left,.indser .warp .right{ width: 100%; float: none; } /* .indser .warp .left .box{padding-left: 10%;} */ /* .indser .warp .left .box:before{width: 7%;} */ .indku .mian .warp .left{display: none;} .indku .mian .warp .right .mbox .ph-no{display: none;} .indku .mian .warp .right{width: 100%;} .indku .mian .warp .right .mbox .pic{ width: 45%; margin:0 5% 0 0; } .indku .mian .warp .right .mbox .box{ width: 45%; margin-left: 0 } .indku .mian .warp .right .mbox .pic .tip{ background-color: rgba(0,0,0,0.1); } .indku .mian .warp .right .top{margin-bottom: 4%} .indnew #ph-indnew .swiper-wrapper .swiper-slide a{ border:0; text-align: left; } .indnew #ph-indnew .swiper-wrapper .swiper-slide a .box{margin-top: 30px} .indnew #ph-indnew .swiper-wrapper .swiper-slide a .box h2{ font-size: 20px; color: #282828; line-height: 30px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family: '΢���ź�'; margin-bottom: 15px; } .indnew #ph-indnew .swiper-wrapper .swiper-slide a .box .time{ font-size: 14px; color: #282828; line-height: 24px; margin-bottom: 10px; } .indnew #ph-indnew .swiper-wrapper .swiper-slide a .box .details{ font-size: 14px; line-height: 26px; color: #282828; height: 52px; overflow: hidden; } .indnew #ph-indnew .swiper-wrapper .swiper-slide a .pic{ width: 100%; overflow: hidden; } .indnew #ph-indnew .swiper-wrapper .swiper-slide a .pic img{ display: block; width: 100%; } .indnew .swiper-indnew{ text-align: center; width: 100%; position: relative; margin-top:50px; display: block; } .indnew .swiper-indnew span{ width: 10px; border-radius: 100%; border: 1px solid #e5e5e5; height: 10px; background: #fff; opacity: 1; margin: 0 6px; } .indnew .swiper-indnew .swiper-pagination-bullet-active{ background-color: #a40000; } } @media (max-width:767px){ .inddb .warp{width: 100%;padding: 20px 0;} .inddb .warp .mbox .box .title h2{font-size: 12px;} .inddb .warp .mbox .box .title .fa{font-size: 12px;} .indser,.indku,.indnew{padding: 30px 0;} .indser .warp .left{margin-bottom: 20px;} .indser .warp .left .box .more{margin-top: 20px;} .indnew .swiper-indnew{margin-top: 20px;} .inddb .warp .mbox{width: 100%;height: 20%;} .inddb .warp .mbox1 .box, .inddb .warp .mbox2 .box, .inddb .warp .mbox3 .box, .inddb .warp .mbox4 .box{border: 1px solid rgba(255,255,255,0.2);position: static;width: 92%; margin: 20px 4%;box-sizing: border-box;height: calc(100% - 40px); height: -moz-calc(100% - 40px); height: -webkit-calc(100% - 40px); } .inddb .warp .mbox .box .title{margin: 0;padding: 0;} } .event-box .title h2,.phil-box .title h2,.phil-list .title h2,.hon-list .title h2,.vi-list .title h2{ font-size: 42px; color: #282828; line-height:70px; text-transform: uppercase; font-family: 'open sans','arial'; } .event-box .title h2 span,.phil-box .title h2 span,.phil-list .title h2 span,.hon-list .title h2 span,.vi-list .title h2 span{font-size: 60px;} .event-box .title .fa,.phil-box .title .fa,.phil-list .title .fa,.hon-list .title .fa,.vi-list .title .fa{ font-size: 36px; color: #282828; line-height: 45px; font-family: '΢���ź�'; } .event-box .list{ width: 100%; position: relative; padding-bottom: 50px; margin-bottom: 80px; } .event-box .list .box,.vi-list .list .box{ width:46.5%; float: left; background-color: #fff; } .event-box .list .box a,.vi-list .list .box a{ display: block; width: 100%; height: 100%; cursor: pointer; } .event-box .list .box .img,.vi-list .list .box .img{ width: 100%; overflow: hidden; background-color: #000; } .event-box .list .box .img img,.vi-list .list .box .img img{ display: block; width: 100%; max-width: 100%; opacity: 0.8; transition: all .4s; -webkit-transition: all .4s; transform: scale(1.1); -webkit-transform: scale(1.1); } .event-box .list .box:hover .img img,.vi-list .list .box:hover .img img{ opacity: 1; transform: scale(1.02); -webkit-transform: scale(1.02); } .event-box .list .box h2{ font-size: 22px; color:#333333; line-height:34px; font-family: '΢���ź�'; width: 90%; margin: 40px auto 5px; transition: all .4s; -webkit-transition: all .4s; } .event-box .list .box:hover h2{color: #8c3861} .event-box .list .box .time{ font-size: 14px; color: #666666; line-height: 24px; width: 90%; margin: 0 auto 15px; padding-bottom: 15px; border-bottom: 1px solid #ececec } .event-box .list .box .fa{ font-size: 15px; line-height: 26px; color: #666666; width: 90%; margin: 0 auto 28px; } .event-box .list .box .btn{ color: #666666; font-size: 14px; width: 128px; height: 34px; line-height: 34px; border:1px solid #dcdcdc; display: block; text-align: center; margin:0 0 65px 5%; border-radius: 30px; transition: all .4s; -webkit-transition: all .4s; } .event-box .list .box .btn:hover{ background-color: #8c3861; border: 1px solid #8c3861; color: #fff; } .en-btns{ display:block; margin:0px auto; width: 155px; padding-right: 60px; font-size: 24px; color: #333333; line-height: 30px; cursor: pointer; background: center right no-repeat; } .phil-box,.hon-list{ width: 92%; margin: 0 auto; max-width: 1400px; padding-bottom: 110px; } .phil-box .title{ text-align: center; padding: 95px 0 35px; } .phil-box .details{width: 86%;margin: 0 auto;} .phil-box .details,.phil-box .details p{ font-size: 18px; line-height: 36px; color: #666666; text-align: center; } .phil-box .details img{ max-width: 100%; margin: 40px 0; } .phil-list{overflow: hidden;} .phil-list .title{ padding: 100px 0 150px; background-color: #f1f1f1; text-align: center; } .phil-list .list{ /*width: 92%;*/ max-width: 1200px; margin: 0 auto 30px; } .phil-list .list ul .mboc1{margin-bottom: 25px;} .phil-list .list ul .mboc1 .pic{ width: 48%; float: left; position: relative; background: #f8f8f8; padding: 20px; } .phil-list .list ul .mboc1 .pic img,.phil-list .list ul .mboc2 .pic img,.phil-list .list ul .mboc3 .pic img{ display: block; width: 100%; } .phil-list .list ul .mboc1 .pic{ /*border: 1px solid #e8e8e8;*/ /*padding: 20px;*/ box-sizing: border-box; } .phil-list .list ul .mboc1 .pic .about-logo img{ width: 120px; } .phil-list .list ul .mboc1 .pic .about-logo h3{ font-size: 20px; font-weight: bold; margin: 20px 0 10px; } .phil-list .list ul .mboc1 .pic .about-logo p{ font-size: 14px; color: #666; } .phil-list .list ul .mboc2 .pic{ /*border: 1px solid #e8e8e8;*/ padding: 20px; background: #f8f8f8; box-sizing: border-box; } .phil-list .list ul .mboc2 .pic .about-logo{ text-align: left; } .phil-list .list ul .mboc2 .pic .about-logo img{ max-width: 300px; } .phil-list .list ul .mboc2 .pic .about-logo h3{ font-size: 20px; font-weight: bold; margin: 20px 0 10px; } .phil-list .list ul .mboc2 .pic .about-logo p{ font-size: 14px; color: #666; } .phil-list .list ul .mboc1 .box{ width: 48%; float: right; padding-top: 25px; } .phil-list .list ul .mboc1 .box .tit{ width: 310px; margin-bottom: 60px; position: relative; } .phil-list .list ul .mboc1 .box .tit span,.phil-list .list ul .mboc2 .box .tit span,.phil-list .list ul .mboc3 .box .tit span{ font-size: 18px; line-height: 28px; color: #282828; text-align: right; display: block; } .phil-list .list ul .mboc1 .box .tit h3,.phil-list .list ul .mboc2 .box .tit h3,.phil-list .list ul .mboc3 .box .tit h3{ display:block; color: #282828; font-size: 30px; line-height: 47px; border-top: 1px solid #333333 } .phil-list .list ul .mboc1 .box .tit i,.phil-list .list ul .mboc2 .box .tit i,.phil-list .list ul .mboc3 .box .tit i{ display: block; font-size: 180px; color: #efefef; font-family: 'gothic'; font-style: normal; font-weight: bold; line-height: 150px; position: absolute; left: 0; top: -60px; z-index: -1; } .phil-list .list ul .mboc1 .box .details,.phil-list .list ul .mboc2 .box .details,.phil-list .list ul .mboc3 .box .details{margin-bottom:25px} .phil-list .list ul .mboc1 .box .details h4,.phil-list .list ul .mboc2 .box .details h4,.phil-list .list ul .mboc3 .box .details h4{ font-size: 20px; color: #333333; line-height: 28px; margin-bottom: 5px; margin-top: 10px; text-align:left; } .phil-list .list ul .mboc1 .box .details .fa,.phil-list .list ul .mboc2 .box .details .fa,.phil-list .list ul .mboc3 .box .details .fa{ font-size: 14px; line-height: 26px; color: #666666; text-align: justify; } .phil-list .list ul .mboc2{margin-bottom: 0} .phil-list .list ul .mboc2 .pic{ float: right; width: 48%; } .phil-list .list ul .mboc2 .box{ float: left; width:48%; } .phil-list .list ul .mboc2 .box .tit{ width: 360px; position: relative; padding-top: 58px; margin-bottom: 58px; } .phil-list .list ul .mboc2 .box .tit span{padding-right: 45px;} .phil-list .list ul .mboc2 .box .tit i,.phil-list .list ul .mboc3 .box .tit i{ top: 0 } .phil-list .list ul .mboc3 .pic{ width: 51%; float: left; } .phil-list .list ul .mboc3 .box{ width: 39%; float: right; } .phil-list .list ul .mboc3 .box .tit{ width: 315px; position: relative; padding-top: 60px; margin-bottom: 55px; } .bg5{background-color: #f5f5f5} .hon-list .title{ text-align: center; padding: 90px 0 80px; } .hon-list{padding-bottom: 10px;} .hon-list .list ul{width: 103%;margin-bottom: 20px} .hon-list .list ul li{ float: left; width: 22%; margin: 0 3% 55px 0; box-shadow: -0.5px -0.5px 2px 0px rgba(0,0,0,0.1); position: relative; z-index: 2; } .hon-list .list ul li:before{ display: block; width: 74px; height: 168px; background: center/cover no-repeat; content: ''; position: absolute; bottom: 1%; right:-5%; z-index: -1 } .hon-list .list ul li a{ display: block; width: 100%; height: 100%; box-sizing:border-box; padding: 5px; overflow: hidden; cursor: pointer; } .hon-list .list ul li a img{ width: 100%; } #pslides{ width: 100%; height: 700px; overflow: hidden; display: block; margin-bottom: 80px; } #pslides ul{ width: 100%; height: 100%; display: block; } #pslides ul li{ width: 4%; float: left; display: block; height: 100%; border-left: 1px solid #e0e0e0; box-sizing:border-box; } #pslides ul li:hover,#pslides ul li.on{ border-left: 1px solid #666666; } #pslides ul li:first-child{border-left:0} #pslides ul li.on{ width: 36%; } #pslides ul li h2{ font-size: 40px; color: #e0e0e0; line-height: 45px; text-align: center; font-family: microsoft yahei; font-weight: 700; display: block; } #pslides ul li.on h2{display: none;} #pslides ul li:hover h2{color: #333333} #pslides ul li h3{ font-size: 40px; color: #333333; line-height: 45px; font-family: microsoft yahei; font-weight: 700; display: none; padding: 0 10px; } #pslides ul li.on h3{ display: block; } #pslides ul li .tit{ font-size: 20px; line-height: 30px; color: #333333; margin-top:80px; display: none; padding: 0 10px; } #pslides ul li.on .tit{ display: block; } #pslides ul li .details{ font-size: 16px; line-height: 30px; color: #666666; margin-top:35px; height:auto; text-align: justify; display: none; padding: 0 10px; } #pslides ul li.on .details{ display: block; } #pslides ul li.on .details img{max-width: 100%;} #slides{display: none;} .ph-blist{display: none;} .video-list{ width: 92%; margin: 120px auto 0; max-width: 1090px; } .video-list .mvideo{ width: 100%; position: relative; } .video-list .viddeo{ display: block; width: 100%; display: none; } .video-list .tip{ width: 100%; overflow: hidden; position: relative; } .video-list .tip img{ display: block; width: 100%; transition: all .4s; -webkit-transition: all .4s; transform: scale(1.08); -webkit-transform: scale(1.08); } .video-list:hover .tip img{ transform: scale(1.02); -webkit-transform: scale(1.02); } .video-list .tip i{ display: block; width: 60px; height: 60px; background: center no-repeat; position: absolute; left: 50%; top: 50%; margin: -30px 0 0 -30px; z-index: 3; cursor: pointer; } .video-list .box{padding: 10px 0 50px;} .video-list .box h3{ font-size: 20px; line-height: 30px; color: #333333; font-family: '΢���ź�'; } .video-list .box .details{ font-size: 16px; color: #666666; line-height: 30px; font-family: '΢���ź�'; } .vi-list{ width: 92%; max-width: 1170px; margin: 0 auto; } .vi-list .title{ margin-bottom: 30px; text-align: center; } .vi-list .list{ width: 100%; /*overflow: hidden;*/ position: relative; margin-bottom: 100px; } .vi-list .list .box{ width: 45%; float: left; } .vi-list .list .box.on{top: 75px;} .vi-list .list .box .img{ margin-bottom: 40px; position: relative; } .vi-list .list .box .img .viddeo{ display: block; width: 100%; display: none; } .vi-list .list .box .img i{ display: block; width: 60px; height: 60px; position: absolute; left: 50%; top: 50%; cursor: pointer; z-index: 5; margin: -30px 0 0 -30px; background: center/cover no-repeat; } .vi-list .list .box h2{ font-size: 20px; line-height: 32px; color: #333333; font-family: '΢���ź�'; margin-bottom: 10px; } .vi-list .list .fa{ font-size: 16px; line-height: 30px; color: #666666; font-family: '΢���ź�'; } .vi-list .en-btns{margin:80px auto 130px;} .video-tip{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); position: fixed; top: 0; left: 0; z-index: 50; display: none; } .video-tip .warp{ width: 900px; height: 500px; position: absolute; top: 50%; left: 50%; margin: -250px 0 0 -475px; } .video-tip .warp i{ display: block; width: 37px; height: 37px; background: center no-repeat; position: absolute; top: -50px; right: -50px; cursor: pointer; } .video-tip .warp .viddeo{ display: block; width:900px; height: 500px; } .phone-title #ph-title,.phone-title .pc-title{background-color:#fff;} @media (max-width:1600px){ #pslides ul li h2, #pslides ul li h3{ font-size: 30px; } } @media (max-width:1500px){ } @media (max-width:1300px){ .phil-list .list ul .mboc1 .box .details .fa, .phil-list .list ul .mboc2 .box .details .fa, .phil-list .list ul .mboc3 .box .details .fa{ font-size: 15px; line-height: 25px; } .phil-list .list ul .mboc1 .box .details h4, .phil-list .list ul .mboc2 .box .details h4, .phil-list .list ul .mboc3 .box .details h4{ font-size: 22px; line-height: 30px; } } @media (max-width:1200px){ .phil-list .title{padding:80px 0 110px;} /*.phil-list .list ul .mboc1 .pic{top: -50px}*/ .phil-list .list ul .mboc1 .box .tit i, .phil-list .list ul .mboc2 .box .tit i, .phil-list .list ul .mboc3 .box .tit i{ font-size: 150px; line-height: 125px; top: -40px; } .phil-list .list ul .mboc1 .box{padding-top: 80px;} .phil-list .list ul .mboc1 .box .tit{margin-bottom: 50px;} .phil-list .list ul .mboc1 .box .tit h3, .phil-list .list ul .mboc2 .box .tit h3, .phil-list .list ul .mboc3 .box .tit h3{ font-size: 26px; line-height: 40px; } .phil-list .list ul .mboc1 .box .tit span, .phil-list .list ul .mboc2 .box .tit span, .phil-list .list ul .mboc3 .box .tit span{ font-size: 16px; } .phil-list .list ul .mboc2 .box .tit span{padding-right: 0} .phil-list .list ul .mboc2 .box .tit i,.phil-list .list ul .mboc3 .box .tit i{top: 0} .phil-list .list ul .mboc2 .box .tit,.phil-list .list ul .mboc3 .box .tit{padding-top: 40px;margin-bottom: 50px;} .phil-list .list ul .mboc1 .box .details h4, .phil-list .list ul .mboc2 .box .details h4, .phil-list .list ul .mboc3 .box .details h4{ font-size: 20px; line-height: 30px; margin-bottom: 5px; } .phil-list .list ul .mboc1 .box .details, .phil-list .list ul .mboc2 .box .details, .phil-list .list ul .mboc3 .box .details{ margin-bottom: 15px } #hscrollbox2 .mbox .title{ font-size: 20px; } #hscrollbox2 .mbox:hover .year{ font-size: 22px; } #pslides ul li.on{width: 28%} #pslides ul li{width:4.5%;} #pslides ul li .tit{margin-top: 50px;} #pslides ul li .details{margin-top: 20px;} } @media (max-width:1024px){ .event-box{width: 96%} .event-box .title{padding: 60px 0 10px;} .event-box .title h2,.phil-box .title h2, .phil-list .title h2,.hon-list .title h2,.vi-list .title h2{font-size: 34px;} .event-box .title h2 span, .phil-box .title h2 span, .phil-list .title h2 span,.hon-list .title h2 span,.vi-list .title h2 span{font-size: 48px;} .event-box .title .fa,.phil-box .title .fa,.phil-list .title .fa,.hon-list .title .fa,.vi-list .title .fa{font-size: 29px;} .pc-title{padding: 30px 0;margin: -50px auto 0} .pc-title a{ height: 40px; line-height: 40px; } .phil-box{padding-bottom: 70px;} .phil-box .details, .phil-box .details p{font-size: 16px;line-height: 28px} .phil-box .details, .phil-box .details p{width: 100%;} .phil-list .title{padding: 60px 0 70px;} .phil-list .list{width: 100%;} .phil-list .list ul .mboc1 .box{ padding-top: 30px; } .phil-list .list ul .mboc1 .pic,.phil-list .list ul .mboc2 .pic,.phil-list .list ul .mboc3 .pic{ top: 0; width: 92%; float: none; height: auto; overflow: hidden; border-left: none; border-right: none; border-top: none; padding: 15px; margin: 0 auto; } .phil-list .list ul .mboc1 .pic .about-logo p, .phil-list .list ul .mboc2 .pic .about-logo p{ font-size: 16px; } .phil-list .list ul .mboc1 .pic img,.phil-list .list ul .mboc2 .pic img{ /*margin-top: -50%;*/ } .phil-list .list ul .mboc3 .pic img{margin-top: -15%} .phil-list .list ul .mboc1 .box,.phil-list .list ul .mboc2 .box,.phil-list .list ul .mboc3 .box{ width:92%; float: none; margin: 0 auto; } .phil-list .list ul .mboc1 .box .tit h3, .phil-list .list ul .mboc2 .box .tit h3, .phil-list .list ul .mboc3 .box .tit h3{line-height: 50px} .phil-list .list ul .mboc1 .box .tit span, .phil-list .list ul .mboc2 .box .tit span, .phil-list .list ul .mboc3 .box .tit span{line-height: 34px} .phil-list .list ul .mboc1 .box .details .fa, .phil-list .list ul .mboc2 .box .details .fa, .phil-list .list ul .mboc3 .box .details .fa{ font-size: 16px; line-height: 28px; } .phil-list .list ul .mboc1,.phil-list .list ul .mboc2{margin-bottom: 70px;} .phil-list .list ul .mboc1 .box .details, .phil-list .list ul .mboc2 .box .details, .phil-list .list ul .mboc3 .box .details{margin-bottom: 20px} .phil-list .list ul .mboc2 .box,.phil-list .list ul .mboc3 .box{padding-top:30px;} .hon-list .title{padding: 70px 0 60px;} .hon-list .list ul li{ width: 31%; margin: 0 2% 40px 0; } #hscrollbox2, #slides { width: 100%; display: block; height: 660px; margin: 20px auto 130px; } #slides .swiper-slide:first-child{ border-left: 1px solid #ebebeb; } #slides .swiper-slide{ text-align: center; font-size: 18px; background: #fff; width: auto; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; border-right: 1px solid #ebebeb; overflow: hidden; cursor: pointer; } #slides .swiper-slide .box{ width:160px; padding: 0 10px; position: relative; height: 100%; } #slides .swiper-slide .box .year{ font-size: 16px; line-height: 26px; color: #aaaaaa; padding-bottom: 25px; opacity: 1; } #slides .swiper-slide .box h3{ font-size: 20px; line-height: 30px; color: #333333; margin-bottom: 15px; opacity: 0; } #slides .swiper-slide .box .details{ font-size: 16px; line-height: 30px; color: #666666; opacity: 0; margin-bottom: 25px; height:auto; text-align: justify; } #slides .swiper-slide .box h2{ display: block; width: 26px; text-align: center; font-size: 24px; color:#aaaaaa; position: absolute; left:50%; line-height: 30px; bottom: 0; margin-left: -13px; } #slides .swiper-button-prev{ display: block; position: absolute; left: 5%; top: 40%; width: 30px; height: 50px; z-index: 10; margin-top: -15px; background: center no-repeat; } #slides .swiper-button-next{ display: block; position: absolute; right: 5%; top: 40%; width: 30px; height: 50px; z-index: 10; margin-top: -15px; background: center no-repeat; } #slides .swiper-button-next, #slides .swiper-button-prev{display: none;} .ph-blist{overflow: hidden;width: 100%;display: block;} .ph-blist #blist{ width:94%; margin: 0 auto 60px; padding-bottom: 60px; } .ph-blist #blist .swiper-slide { text-align: center; font-size: 14px; background: #fff; width: 50%; margin-right: 15px; /* center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .ph-blist #blist .box{width:88%;margin: 0 auto} .ph-blist #blist .box .year{ color: #282828; font-size: 24px; line-height: 30px; margin-bottom: 20px; } .ph-blist #blist .box h3{ font-size: 24px; line-height: 36px; color: #282828; margin-bottom: 15px; } .ph-blist #blist .box .details{ font-size: 16px; line-height: 30px; color: #666666; text-align: justify; } .ph-blist #blist .box .details img{max-width: 100%;} .hon-list{padding-bottom:40px} .ph-blist #blist .swiper-scrollbar{height: 3px;} .ph-blist #blist .swiper-scrollbar-drag{ height: 5px; position: relative; top: -1px; background-color: #a04b72 } .video-list{margin: 80px auto 0;} .video-list .tip{display: none;} .video-list .viddeo{display: block;} .vi-list{width: 96%} .vi-list .list .box .img .viddeo{display: block;} .vi-list .list .box .img img,.vi-list .list .box .img i{display: none;} #slides .swiper-slide-active .box{ padding: 0 30px; width: 220px; } #slides .swiper-slide-active .box .year{ font-size: 24px; color: #282828; } #slides .swiper-slide-active .box h3, #slides .swiper-slide-active .box .details{opacity:1;} #slides .swiper-slide-active .box h2{display: none;} #pslides{display: none;} } .pc-title a:hover, .pc-title a.on { color: #fff; background-color: #c80207;} @media (max-width:767px){ .event-box .title{padding: 60px 0 30px;} .event-box .title h2,.phil-box .title h2, .phil-list .title h2,.hon-list .title h2,.vi-list .title h2{ font-size: 22px; line-height: 40px; } .event-box .title h2 span, .phil-box .title h2 span, .phil-list .title h2 span,.hon-list .title h2 span,.vi-list .title h2 span{font-size: 30px;} .event-box .title .fa,.phil-box .title .fa, .phil-list .title .fa,.hon-list .title .fa,.vi-list .title .fa{ font-size: 18px; line-height: 30px; } .event-box{width: 92%} .event-box .list .box{ width: 100%; margin: 0 0 30px 0 } .event-box .list .box h2{ font-size: 18px; line-height: 26px; margin: 30px auto 5px; } .event-box .list .box .fa{font-size: 14px} .event-box .list .box .btn{ font-size: 13px; width: 110px; height: 30px; line-height: 30px; margin: 0 0 40px 5%; } .en-btns{ margin: 20px auto 80px; width: 130px; padding-right: 37px; font-size: 18px; } .pc-title{display: none;} #ph-title{ display: block; width:100%; margin: 0 auto; padding: 10px 0; position: relative; overflow: hidden; direction: ltr; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; background-color: #f6f6f6 } #ph-title .swiper-wrapper .swiper-slide{ width:25%; } #ph-title .swiper-wrapper .swiper-slide a{ display: block; width: 100%; height: 34px; line-height: 34px; text-align: center; font-size: 15px; color: #333; } #ph-title .swiper-wrapper .swiper-slide.on a{ background-color: #a04b72; color: #fff; } .phil-box .title{padding: 60px 0 20px;} .phil-box .details, .phil-box .details p{font-size: 14px;line-height: 24px;} .phil-box .details img{margin: 20px 0;} .phil-box {padding-bottom: 40px;} .phil-list .title {padding: 35px 0 40px;} .phil-list .list{margin: 0 auto 80px;} .phil-list .list ul .mboc1 .box .tit i, .phil-list .list ul .mboc2 .box .tit i, .phil-list .list ul .mboc3 .box .tit i{ font-size: 120px; line-height: 100px; } .phil-list .list ul .mboc1 .box .tit span, .phil-list .list ul .mboc2 .box .tit span, .phil-list .list ul .mboc3 .box .tit span, .phil-list .list ul .mboc1 .box .details .fa, .phil-list .list ul .mboc2 .box .details .fa, .phil-list .list ul .mboc3 .box .details .fa{ line-height: 24px; font-size: 14px; } .phil-list .list ul .mboc1 .box .tit h3, .phil-list .list ul .mboc2 .box .tit h3, .phil-list .list ul .mboc3 .box .tit h3{ line-height: 36px; font-size: 18px; } .phil-list .list ul .mboc1 .box .tit{width: 230px;} .phil-list .list ul .mboc1 .box .tit i{top: -20px} .phil-list .list ul .mboc1 .box{padding-top:30px;} .phil-list .list ul .mboc1 .box .tit{margin-bottom: 40px;} .phil-list .list ul .mboc1 .box .details h4, .phil-list .list ul .mboc2 .box .details h4, .phil-list .list ul .mboc3 .box .details h4{ font-size: 16px; line-height: 26px; } .phil-list .list ul .mboc1, .phil-list .list ul .mboc2{margin-bottom: 30px;} .phil-list .list ul .mboc2 .box .tit{width: 270px} .phil-list .list ul .mboc3 .box .tit{width: 250px} .phil-list .list ul .mboc2 .box .tit, .phil-list .list ul .mboc3 .box .tit{padding-top: 25px;margin-bottom: 40px;} .phil-list .list ul .mboc3 .pic img{margin-top: 0} .phil-list .list ul .mboc1 .pic .about-logo p, .phil-list .list ul .mboc2 .pic .about-logo p{ font-size: 14px; } .hon-list .title{padding: 40px 0 30px;} .hon-list .list ul li:before{display: none;} .hon-list .list ul{width: 100%;} .hon-list .list ul li{ width: 47%; margin: 0 1.5% 20px 1.5%; box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.1); } .hon-list {padding-bottom: 70px;} .hon-list.on{padding-bottom:0} .ph-blist #blist .swiper-slide{width:90%;} .ph-blist #blist .box .year{ font-size: 16px; line-height: 26px; margin-bottom: 10px; } .hon-list.on .title{padding: 40px 0} .ph-blist #blist .box h3{ font-size: 16px; line-height: 26px; margin-bottom: 10px; } .ph-blist #blist .box .details,.video-list .box .details,.vi-list .list .fa{ font-size: 14px; line-height: 26px; } .ph-blist #blist .swiper-scrollbar{height: 2px;} .ph-blist #blist .swiper-scrollbar-drag{ height: 4px; position: relative; top: -1px; } .video-list {margin: 50px auto 0;} .video-list .box h3,.vi-list .list .box h2{ font-size: 16px; line-height: 26px; } .vi-list .list .box{ width: 100%; float: none; margin-bottom: 30px; } .vi-list .list{margin-bottom: 45px;} .vi-list .list .box .img{margin-bottom: 20px;} .vi-list .list .box h2{margin-bottom: 5px} .vi-list{width: 92%} .vi-list .en-btns {margin: 30px auto 70px;} #slides{height: 430px;margin: 20px auto 60px;} #slides .swiper-slide .box{ padding: 0 25px; width: 220px; } #slides .swiper-slide .box .year,#slides .swiper-slide-active .box .year{ font-size: 20px; padding-bottom: 15px; } #slides .swiper-slide-active .box h3,#slides .swiper-slide .box h3{ font-size: 16px; line-height: 26px; margin-bottom: 10px; opacity: 1; } #slides .swiper-slide .box .details{ font-size: 14px; line-height: 24px; } #slides .swiper-slide .box h2{ display: none; } } .indsx .box{ height: 100% ; padding: 20px 0 ; box-sizing: border-box ; top: 0 ; margin: 0 ; text-align: right; } .h-mt img{ height: 100%; margin-right: 10%; } @media (max-width:1200px){ .indsx .box{ height: 100%; padding: 20px 0; } } @media (max-width:414px){ .indsx .box{width: 100%;text-align: center;} .indsx .box img{margin-right: 0;} }