@charset "utf-8"; /*画册竞价页css*/ a:hover { text-decoration: inherit; color: #999; } img { -ms-interpolation-mode: bicubic; border: 0; vertical-align: bottom; max-width: 100%; } .clear{ clear:both } .loading{ position: fixed;width: 100%;height: 100%;top: 0;background: #1a1a1a;z-index: 99; } .loading img{ display: block;margin: 150px auto;width: 500px; } .box-content{ padding: 50px 0; } /*标题*/ .h3-title{ text-align: center; font-size: 1.9rem; margin: 55px 0 0; font-weight: 200; letter-spacing: 1px; line-height: 24px; } .h3-title small{ text-align: center; width: 100%; display: block; line-height: 31px; font-size: 20px; letter-spacing: 1px; font-weight: 300; margin: 15px 0; } /*咨询按钮*/ .button-call{ line-height: 15px; background: #439bdb; padding: 15px 25px; font-size: 22px; border-radius: 5px; margin: 0 auto; letter-spacing: 1px; border: 0; display: block; font-weight: 300; color: #fff; } .button-call:hover{ bottom: 95px !important; box-shadow: 1px 5px 9px -3px #111; } /*滚动灰色箭头*/ .carousel-control-next .carousel-control-next-icon{ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23888' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e") !important; } .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23888' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e") !important; } .carousel-indicators li{ background-color: #888; } /*弹出留言框*/ /*正文内容*/ body,html{ overflow-x:hidden;table-layout: fixed;word-wrap:break-word;word-break:break-all; } /*首图*/ .banner-top .carousel-item.vis1{ position: absolute; background: url(../images/intitle/banner1.jpg) no-repeat center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; width: 100%; height: 100%; } .banner-top .carousel-item.vis2{ position: absolute; background: url(https://www.xlibai.com/wp-content/themes/xiaolibai/images/banner/b.jpg) no-repeat center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; width: 100%; height: 100%; } /*文字环绕特效*/ .wrapper { margin: 0 auto; padding:0; width: 100%; z-index: -1; } .tagcloud { position: relative; height: 700px; z-index: 0; } .tagcloud a { display: block; border-radius: 50%; color: #222; font-weight: 300; font-size: 18px; text-decoration: none; text-align: center; } .b01{ width: 160px; height: 160px; line-height: 160px; } .b02{ width: 130px; height: 130px; line-height: 130px; } .b03{ width: 100px; height: 100px; line-height: 100px; } .b04{ width: 80px; height: 80px; line-height: 80px; } .co01{ background:none; /*background: -moz-linear-gradient(top, #d1e5fd 0%, #3d86f4 100%); background: -webkit-linear-gradient(top, #d1e5fd 0%,#3d86f4 100%); background: -o-linear-gradient(top, #d1e5fd 0%,#3d86f4 100%); background: -ms-linear-gradient(top, #d1e5fd 0%,#3d86f4 100%); background: linear-gradient(to bottom, #d1e5fd 0%,#3d86f4 100%);*/ } .co02{ background: -moz-linear-gradient(top, #eee 0%, #ddd 100%); background: -webkit-linear-gradient(top, #eee 0%,#ddd 100%); background: -o-linear-gradient(top, #eee 0%,#ddd 100%); background: -ms-linear-gradient(top, #eee 0%,#ddd 100%); background: linear-gradient(to bottom, #eee 0%,#ddd 100%); } .co03{ background: -moz-linear-gradient(top, #fff4e2 0%, #ffd79c 100%); background: -webkit-linear-gradient(top, #fff4e2 0%,#ffd79c 100%); background: -o-linear-gradient(top, #fff4e2 0%,#ffd79c 100%); background: -ms-linear-gradient(top, #fff4e2 0%,#ffd79c 100%); background: linear-gradient(to bottom, #fff4e2 0%,#ffd79c 100%); } .co04{ background: -moz-linear-gradient(top, #fef4fa 0%, #fbbae0 100%); background: -webkit-linear-gradient(top, #fef4fa 0%,#fbbae0 100%); background: -o-linear-gradient(top, #fef4fa 0%,#fbbae0 100%); background: -ms-linear-gradient(top, #fef4fa 0%,#fbbae0 100%); background: linear-gradient(to bottom, #fef4fa 0%,#fbbae0 100%); } .co05{ background: -moz-linear-gradient(top, #fedc90 0%, #ffb515 100%); background: -webkit-linear-gradient(top, #fedc90 0%,#ffb515 100%); background: -o-linear-gradient(top, #fedc90 0%,#ffb515 100%); background: -ms-linear-gradient(top, #fedc90 0%,#ffb515 100%); background: linear-gradient(to bottom, #fedc90 0%,#ffb515 100%); } .co06{ background: -moz-linear-gradient(top, #bcf7ca 0%, #1fda4b 100%); background: -webkit-linear-gradient(top, #bcf7ca 0%,#1fda4b 100%); background: -o-linear-gradient(top, #bcf7ca 0%,#1fda4b 100%); background: -ms-linear-gradient(top, #bcf7ca 0%,#1fda4b 100%); background: linear-gradient(to bottom, #bcf7ca 0%,#1fda4b 100%); } .co07{ background: -moz-linear-gradient(top, #f7cdf8 0%, #db43e7 100%); background: -webkit-linear-gradient(top, #f7cdf8 0%,#db43e7 100%); background: -o-linear-gradient(top, #f7cdf8 0%,#db43e7 100%); background: -ms-linear-gradient(top, #f7cdf8 0%,#db43e7 100%); background: linear-gradient(to bottom, #f7cdf8 0%,#db43e7 100%); } /*文字环绕特性结束*/ /*背书*/ .img1{ background: #f0f4f5; padding:0; } .img1 img,.img2 img{ display: block; width: 100%; } .img2.rongzi1{ position: relative; margin-bottom: -45px; } .img2.rongzi1 .button-call{ position: relative; bottom: 90px; } /*案例*/ .case{ position: relative; } .case span{ display: block; text-align: center; background: #1c529a; color: #fff; font-size: 17px; line-height: 35px; } .case .container-fluid{ position: absolute; bottom: 35px; width: 60%; left: 20%; } /*更多服务*/ .box-content .wk_serve{ width: 1100px; margin: 50px auto; } .box-content .wk_serve>div { background: url(../images/album/brand_12.png) no-repeat center; background-size: 100% 100%; width: 31%; margin-right: 3.5%; height: 60%; float: left; padding: 5% 3% 15%; min-height: 410px; max-height: 755px; } .box-content .wk_serve>div .wk_serve_01 { border-bottom: 1px solid #888; margin-bottom: 20px; padding-bottom: 25px; } .box-content .wk_serve>div .wk_serve_01 { border-bottom: 1px solid #888; margin-bottom: 20px; padding-bottom: 25px; } .box-content .wk_serve>div .wk_serve_01 { border-bottom: 1px solid #888; margin-bottom: 20px; padding-bottom: 25px; color: #000; } .box-content .wk_serve>div .button { text-align: center; } .box-content .wk_serve>div .wk_serve_01>h2 { font-size: 25px; font-weight: 500; letter-spacing: 1px; color: #000; text-shadow: 0px 0px 0px #333; } .box-content .wk_serve>div .wk_serve_01>p { font-size: 16px; line-height: 30px; letter-spacing: 0.5px; } .box-content .wk_serve>div .wk_serve_01 span { line-height: 69px; font-size: 16px; padding: 3px 15px 4px; border: 1px solid #888; margin-right: 2%; letter-spacing: 1px; } .box-content .wk_serve>div .button span { line-height: 15px; background: #b1b1b1; padding: 5px 20px; font-size: 22px; border-radius: 5px; margin: 0 auto; letter-spacing: 1px; color: #fff; } .box-content .wk_serve>div .button span:hover { box-shadow: 1px 2px 12px 1px #999; padding: 6px 22px; position: relative; bottom: 5px; } .box-content .wk_serve>div .wk_serve_01 span:hover { background: #595757; color: #fff; } /*正文内容结束*/ /*底部导航*/ .fp-auto-height.active .wk_footer_side { padding: 26px 0; background: #0e0e0e; opacity: 1; -webkit-opacity: 1; -moz-opacity: 1; } .wk_footer { margin: 0 auto; min-width: 1000px; width: 100%; background: url(../images/brand/logo_4.png) no-repeat left center; color: #b6b3b3; line-height: 26px; } .wk_footer a { color: #b6b3b3; } .wk_footer .footer_serve { float: right; clear: both; } .fp-auto-height .wk_footer_side { padding: 26px 5%; background: #0e0e0e; } .wk_footer .footer_serve span { line-height: 37px; margin: 0 15px; font-size: 15px; font-family: initial; letter-spacing: 1px; } /*案例弹出窗口*/ .case_day{ border: 0; height: 100%; position: fixed; top: 0; margin: 0 auto; width: 100%; display: none; z-index: 20; } .case_day::-webkit-scrollbar { display: none; } .case_day .close{ top: 5%; right: 1%; width: 50px; height: 50px; position: absolute; background: url(../images/common/x.png) no-repeat center; } .case_day .shade{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #3339; } .case_day iframe{ width: 85%; height: 100%; border: 0; margin: 0 auto; display: block; } /*返回顶部*/ p#back-to-top{ position:fixed; display:none; bottom:100px; right:80px; } p#back-to-top a{ text-align:center; text-decoration:none; color:#d1d1d1; display:block; width:64px; /*使用CSS3中的transition属性给跳转链接中的文字添加渐变效果*/ -moz-transition:color 1s; -webkit-transition:color 1s; -o-transition:color 1s; } p#back-to-top a:hover{ color:#979797; } p#back-to-top a span{ background:transparent url(../images/common/top01.png) no-repeat center; background-size: 100%; border-radius:6px; display:block; height:64px; width:56px; margin-bottom:5px; /*使用CSS3中的transition属性给标签背景颜色添加渐变效果*/ -moz-transition:background 1s; -webkit-transition:background 1s; -o-transition:background 1s; } #back-to-top a:hover span{ background:transparent url(../images/common/top02.png) no-repeat center; background-size: 100%; } /*返回顶部结束*/ /*内容结束*/ /*响应式布局*/ @media only screen and (max-width: 1650px) { .content{ width: 120%; margin-left: -10%; } } @media only screen and (max-width: 1350px) { .content{ width: 140%; margin-left: -20%; } } @media only screen and (max-width: 1200px) { } @media only screen and (max-width: 1150px) { } @media only screen and (max-width: 1055px) { } @media only screen and (max-width: 1000px) { .content { width: 180%; margin-left: -40%; } .box-content.more,.button-call{ display: none; } } @media only screen and (max-width: 750px) { .bounceInDown,.carousel,.carousel-inner{ height: 180px !important; } }