.container{ width: 1445px;}
.top{ height: 549px; background-repeat: no-repeat; background-size: cover;}
.game-top{ background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/top_inside_game.jpg);}
.service-top{ background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/top_inside_service.jpg);}

.game-top .nav{ float: right;}
.game-top .nav a{ padding: 0 40px; border-right: 1px rgba(255,255,255,.2) solid;}

.service-top .logo{ margin-right: 20px;}
.service-top .nav a{ padding: 0 30px; border-right:none;}
.service-top .topTitle{ margin-top: 112px;}

.title-list{ padding: 55px 0; border-bottom: 1px #E2E2E2 solid;}
.title-list .coordinate{ float: right; font-size: 20px; line-height: 45px; color: #666666;}
.title-list .coordinate i{ float: left; margin-right: 2px; width: 31px; height: 45px; background: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_coordinate.png) no-repeat;}
.title-list .coordinate a{ color: #666666;}
.title-list .coordinate a:hover{ text-decoration: underline;}
.title-list .coordinate span{ font-size: 22px; color: #333333; font-weight: bold;}

.news-list,
.news-detail{ margin-top: 60px; padding: 30px 60px; background: #fff; border-radius: 20px;}
.news-list .list-nav{ margin-bottom: 50px; overflow: hidden;}
.news-list .list-nav li{ position: relative; float: left; margin-right: 38px; width: 140px; line-height: 50px; font-size: 24px; color: #666; 
text-align: center; cursor: pointer;}
.news-list .list-nav li:hover,
.news-list .list-nav li.active{  background:#6798F8;color: #fff; border-radius: 50px;}
.news-list .list-news{ margin-top: 15px; clear: both;}
.news-list .list-news ul{ display: none;}
.news-list .list-news ul.active{ display: block;}
.news-list .list-news li{ display: block; position: relative; padding: 30px 0; font-size: 18px; color: #D2E0F0; cursor: pointer; border-bottom: 1px #E2E2E2 solid;}
.news-list .list-news li .text{ display: inline-block; margin-left: -10px; width:1045px; font-size: 24px; color: #333; white-space: nowrap; text-overflow: ellipsis; 
overflow: hidden; word-break: break-all;} 
.news-list .list-news li:hover h2.text{ color: #6798f8;}
.news-list .list-news li .date{ float: right; font-size: 18px; color: #666666;}
.news-list .list-news li .detail{ color: #666; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; 
display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; clear: both;}
.page{ margin: 50px auto; text-align: center;}
.page a{ display: inline-block; margin: 0 5px; width: 44px; height: 44px; background: #f4f4f4; font-size: 18px; color: #666; text-align: center; line-height: 44px; border-radius: 5px;}
.page a:hover,
.page a.active{ background: #6798f8; color: #fff;}

.news-detail .news-title{ padding-bottom: 30px; font-size: 36px; color: #333; border-bottom: 1px #E9E9E9 solid;}
.news-detail .news-title .other{ margin-top: 15px; font-size: 18px; color: #666;}
.news-detail .detail{ padding: 50px 0; font-size: 18px; color: #666; line-height: 30px; border-bottom: 1px #E9E9E9 solid;}
.news-detail .detail img{ max-width: 100%;}
.news-detail .page a{ margin: 0 10px; width: 140px; height: 58px; font-size: 24px; line-height: 58px; color: #6798f8; border:2px #6798f8 solid; background: #fff; border-radius: 10px;}
.news-detail .page a:hover{ background: #6798f8; color: #fff;}

.footer{ margin-top: 50px; padding: 40px 0; background: -moz-linear-gradient(top, #7D99E9 0%, #6372DF 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7D99E9), color-stop(100%,#6372DF));
background: -webkit-linear-gradient(top, #7D99E9 0%,#6372DF 100%);
background: -o-linear-gradient(top, #7D99E9 0%,#6372DF 100%);
background: -ms-linear-gradient(top, #7D99E9 0%,#6372DF 100%);
background: linear-gradient(to bottom, #7D99E9 0%,#6372DF 100%);}
.list-detail li{ margin-right: 40px; width: 263px; height: 263px; background: url(//png.pookcdn.net/bydr-lobby/boke_new/bg_footer_list.png) no-repeat;}
.list-detail li img{ margin-top: 58px; margin-bottom: 40px; padding: 0; width: 144px; border: none; border-radius: 0px;}
.list-detail li p{ margin: 0 auto; width: 205px; height: 45px; background: #6272DC; line-height: 45px; text-align: center; border-radius: 30px; 
box-shadow: 0 2px 2px #585EBF inset;}
.list-detail li a p{ background: #FFD777; color: #354282; box-shadow: none;}
.list-detail li span{ color: #fef3a3;}
.list-href a{ color: #E8EDCC; border-color: #E8EDCC; }
.footer .text{ color: #86A7F7;}

.features-content .title-features{ margin-top: 50px; text-align: center;}
.features-content .data-list{ width: 1593px; height: 968px;}
.features-content .data-content .swiper-button-prev,
.features-content .data-content .swiper-button-next{ margin-top:-150px; width: 89px; height: 89px; background-repeat: no-repeat; background-size: 100% 100%;}
.features-content .data-content .swiper-button-prev{ left: -100px; background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_arrow_pre.png);}
.features-content .data-content .swiper-button-next{ background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_arrow_next.png);}
.features-content .data-content .swiper-slide,
.features-content .raiders-content .swiper-slide{ opacity: 0!important;}
.features-content .data-content .swiper-slide-active,
.features-content .raiders-content .swiper-slide-active{ opacity: 1!important;}
.data-content .swiper-button-next::after, 
.data-content .swiper-container-rtl .swiper-button-prev::after,
.data-content .swiper-button-prev::after, 
.data-content .swiper-container-rtl .swiper-button-next::after{ content: "";}

.intro-content{ padding: 60px 0 150px; background: #dbefff;}
.intro-content .intro-list{ width: 1438px;}
.intro-content .swiper-introList .swiper-slide{ width: 1438px; height: 659px;}
.intro-content .gallery-thumbs-intro{ margin-top: 10px; width: 1327px;}
.intro-content .gallery-thumbs-intro .swiper-slide{ width: 154px!important; height: 150px; border: 1px #fff solid; border-radius: 20px; background-repeat: no-repeat;
 background-position:  center center; cursor: pointer;}
.features-content .intro-content .swiper-button-prev,
.features-content .intro-content .swiper-button-next{ margin-top:255px; width: 45px; height: 153px; background-repeat: no-repeat; background-size: 100% 100%;}
.features-content .intro-content .swiper-button-prev{ left: 0; background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_arrow_intro_pre.png);}
.features-content .intro-content .swiper-button-next{ background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_arrow_intro_next.png);}
.intro-content .swiper-button-prev::after, 
.intro-content .swiper-container-rtl .swiper-button-next::after,
.intro-content .swiper-button-next::after, 
.intro-content .swiper-container-rtl .swiper-button-prev::after{ content: "";}

.raiders-list{ margin-top: 70px; width: 1438px;}
.raiders-list .swiper-pagination{ bottom: 338px!important;}
.raiders-list .swiper-pagination-bullet{ width: 19px; height: 11px; border-radius: 5px;}
.raiders-list .swiper-pagination-bullet-active{ width: 55px; background: #13a9ff; }

.service-content .title-list{ padding: 80px 0 30px;}
.service-content .coordinate{ float: none;}
.service-content .service-list{ height: 783px; clear: both;}
.service-content .service-list li{ float: left; margin-top: 65px; margin-right: 35px; width: 315px; height: 500px; background: #fff; font-size: 20px; color: #9D9D9D; line-height: 40px;
border-radius: 20px; cursor: pointer; text-align: center; transition: all .5s; }
.service-content .service-list li:last-child{ margin-right: 0;}
.service-content .service-list li:hover{ margin-top: 100px; box-shadow: 0 0 20px #b4b4b4;}
.service-content .service-list .ico-service{ display: block; margin: 55px auto 0;}
.service-content .service-list .service-title{ display: inline-block; padding-bottom: 5px; margin-bottom: 30px; font-size: 30px; font-weight: bold; text-align: center;
color: #707070; border-bottom: 3px #707070 solid;}
.service-content .service-list li:hover .service-title{ color: #FC8F24; border-color: #FC8F24;}

.customer-form{ margin: 37px auto 130px; padding: 100px 0; width: 1440px; background: #fff; border-radius: 20px;}
.customer-form .txt-input,
.customer-form .txt-textarea{ display: block; margin: 0 auto 35px; width: 785px; height: 60px; border: 1px #E0E0E0 solid; font-size: 18px; color: #666; line-height: 60px;
border-radius: 5px;}
.customer-form .txt-input img,
.customer-form .txt-textarea img{ float: left;}
.customer-form .txt-input span,
.customer-form .txt-textarea span{ float: left; width: 80px;}
.customer-form .txt-input input{ margin-left: 10px; width: 640px; height: 58px; font-size: 18px; color: #333; border: none; vertical-align: top;}
.customer-form .txt-textarea{ height: 190px;}
.customer-form .txt-textarea textarea{ display: block; margin: 5px 10px; clear:both; width: 760px; height: 120px; font-family: "microsoft yahei"; font-size: 18px;
color: #333; border: none; resize: none;}
.customer-form .btn-sumbit{ display: block; margin: 65px auto 0; width: 295px; height: 70px; background: #6798f8; font-size: 30px; color: #fff;
text-align: center; line-height: 70px; text-align: center; border-radius: 40px;}
.customer-form .btn-sumbit:hover{ transform: scale(.95);}
.customer-form .tips{ margin-bottom: 35px; text-align: center; font-size: 22px; }
.customer-form .tips img{ margin-right: 10px; vertical-align: middle;}
.customer-form .tips a{ color: #6698f8;}
.customer-form .tips .tips-icon{ display: inline-block; margin-right: 5px; width: 31px; height: 29px; 
background: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_read_off.png) no-repeat; vertical-align: middle; background-size: 100% 100%; cursor: pointer;}
.customer-form .tips .tips-icon.active{ background-image: url(//png.pookcdn.net/bydr-lobby/boke_new/ico_read.png);}

.recover-form .txt-input span{ width: 150px;}
.recover-form .txt-input input{ width: 550px; height: 57px;}
.recover-form .txt-input i{ color: #6798F8;}
.recover-form .txt-input-auth{ position: relative; margin-left: 328px; width: 590px;}
.recover-form .txt-input-auth input{ width: 370px;}
.recover-form .txt-input-auth .btn-send{position: absolute; top: 0; right: -195px; width: 190px; height: 60px; background: #6798f8; color: #fff; text-align: center; border-radius: 5px;}
.recover-form .txt-input-auth .btn-send.off{ background: #aeaeae;}



@media screen and (max-width: 1920px){
.container{ width:1029px;}	
.top{ height: 412px;}	
.game-top .nav a{ padding: 0 30px;}	
.news-list .list-nav{ margin-bottom: 30px;}
.news-list .list-news li .text{ width: 845px;}
.list-detail li{ width: 198px; height: 198px; background-size: 100% 100%;}
.list-detail li img{ margin-top:45px; margin-bottom: 30px; width: 103px;}
.features-content .data-list{ width: 1195px; height: 727px;}
.features-content .data-list .swiper-slide img{width: 1195px; height: 727px;}
.intro-content .intro-list{ width: 1079px;}
.intro-content .swiper-introList .swiper-slide{ height: 495px; background-size: 100% 100%;}
.intro-content .gallery-thumbs-intro{ width: 1000px;}
.intro-content .gallery-thumbs-intro .swiper-slide{ margin: 0 5px!important; width: 116px!important; height: 113px; background-size: 100% 100%;}
.features-content .intro-content .swiper-button-prev, 
.features-content .intro-content .swiper-button-next{ margin-top: 195px; width: 34px; height: 116px;}
.features-content .title-features{ margin: 30px auto 20px;}
.raiders-list,
.raiders-list .swiper-slide img{ width: 1079px;}
.service-content .service-list{ height: 580px;}
.service-content .service-list li{ margin-right: 28px; width: 235px; height: 375px;}
.service-content .service-list .ico-service{ margin-top: 40px; width: 160px; height: 161px;}
.service-content .service-list .service-title{ margin-bottom: 20px; font-size: 22px;}
.service-content .service-list .service-tips{ font-size: 15px;  line-height: 30px;}
.customer-form{ width: 1029px;}
.recover-form .txt-input-auth{ margin-left: 121px;}
.raiders-list .swiper-pagination{ bottom: 260px!important;}
}

@media screen and (max-width: 1440px){
.container{ width: 809px;}	
.top{ height: 309px;}
.title-list{ padding: 30px 0;}	
.title-list img{ width: 198px;}
.title-list .coordinate,
.title-list .coordinate span{ font-size: 12px;}
.title-list .coordinate i{ margin-top: 9px; width: 19px; height: 26px; background-size: 100% 100%;}
.news-list, 
.news-detail{ margin-top: 30px; padding: 20px 30px; }
.news-list .list-nav{ margin-bottom: 0;}
.news-list .list-nav li{ width: 80px; height: 29px; font-size: 14px; line-height: 29px;}
.news-list .list-news li .text{ width: 700px; font-size: 14px;}
.news-list .list-news li .date,
.news-list .list-news li .detail{ font-size: 12px;}
.page a{ width: 26px; height: 26px; font-size: 12px; line-height: 26px;}
.list-detail li{ width: 148px; height: 148px;}
.list-detail li img{ margin-top: 30px; width: 82px;}
.list-detail li p{ width: 130px; height: 27px; font-size: 12px; line-height: 27px;}
.features-content .title-features img{ width: 542px;}
.intro-content .intro-list{ width: 809px;}
.intro-content .swiper-introList .swiper-slide{ width: 809px; height: 372px;}
.intro-content .gallery-thumbs-intro{ width: 730px;}
.intro-content .gallery-thumbs-intro .swiper-slide{ margin-right: 0!important; width: 87px!important; height: 86px;}
.features-content .intro-content .swiper-button-prev, 
.features-content .intro-content .swiper-button-next{ margin-top: 148px; width: 26px; height: 87px;}
.features-content .data-list,
.features-content .data-list .swiper-slide img{ width: 897px; height: 545px;}
.features-content .data-content .swiper-button-prev, 
.features-content .data-content .swiper-button-next{ margin-top: -100px; width: 51px; height: 51px;}
.raiders-list, 
.raiders-list .swiper-slide img{ width: 809px;}
.raiders-list .swiper-pagination-bullet{ width: 11px; height: 7px;}
.raiders-list .swiper-pagination-bullet-active{ width: 32px;}
.raiders-list .swiper-pagination{ bottom: 200px!important;}
.service-top .topTitle{ margin-top: 65px;}
.service-top .topTitle img{ width: 177px; height: 75px;}
.service-content .title-list{ padding: 50px 0 20px;}
.service-content .service-list{ height: 380px;}
.service-content .service-list li{ margin-top: 30px; width: 177px; height: 282px;}
.service-content .service-list .ico-service{ margin-top: 20px; width: 121px; height: 121px;}
.service-content .service-list .service-title{ border-bottom-width: 1px; margin-bottom: 10px; font-size: 16px;}
.service-content .service-list .service-tips{ font-size: 12px; line-height: 25px;}
.news-detail .news-title{ padding-bottom: 15px; font-size: 20px;}
.news-detail .news-title .other{ margin-top: 15px; font-size: 12px;}
.news-detail .detail{ font-size: 12px;}
.news-detail .page a{ width: 79px; height: 33px; font-size: 13px; line-height: 33px; border-width: 1px;}
.customer-form{ width: 812px;}
.customer-form .tips{ font-size: 12px;}
.customer-form .tips img{ width: 77px;}
.customer-form .txt-input, 
.customer-form .txt-textarea{ width: 450px; height: 35px; font-size: 12px; line-height: 35px;}
.recover-form .txt-input-auth{ width: 335px;}
.recover-form .txt-input span{ width: 90px;}
.customer-form .txt-input img, 
.customer-form .txt-textarea img{ width: 29px; height: 35px;}
.recover-form .txt-input input,
.customer-form .txt-input input{ width: 300px; height: 33px; font-size: 12px;}
.recover-form .txt-input-auth{ margin-left: 180px; }
.recover-form .txt-input-auth .btn-send{ right: -114px;  width: 107px; height: 35px; 
font-size: 12px; line-height: 35px;}
.customer-form .btn-sumbit{ width: 116px; height: 39px; font-size:16px; line-height: 39px;}
.proving_text{ height: 35px; font-size: 12px; line-height: 35px; background-size: 29px 35px;}
.customer-form .tips .tips-icon{ width: 18px; height: 17px;}

}