@font-face {font-family: 'Tensentype'; src: url('../font/Tensentype MeiHeiJ.eot'); src: url('../font/Tensentype MeiHeiJ.eot?#font-spider') format('embedded-opentype'), url('../font/Tensentype MeiHeiJ.woff') format('woff'), url('../font/Tensentype MeiHeiJ.ttf') format('truetype'), url('../font/Tensentype MeiHeiJ.svg') format('svg'); font-weight: normal; font-style: normal; }
@font-face {font-family: "iconfont"; src: url('../font/iconfont.eot?t=1521449514878'); /* IE9*/ src: url('../font/iconfont.eot?t=1521449514878#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../font/iconfont.woff?t=1521449514878') format('woff'), url('../font/iconfont.ttf?t=1521449514878') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ url('../font/iconfont.svg?t=1521449514878#iconfont') format('svg'); /* iOS 4.1- */ }

.abs {position: absolute;}.rel {position: relative;}
.fw {color: #fff}.c6{color: #666;}.c3{color: #333;}.c9{color: #999;}
.o6 {opacity: .6}
.t0 {top: 0;} .r0 {right: 0;}
.f9 {font-size: 12px; font-size:10.8px\9; -webkit-transform: scale(0.70); }.f12{font-size: .75rem;}.f14 {font-size: .9rem;}.f30{font-size: 1.875rem;}.f32 {font-size: 2rem}
.lh2 {line-height: 1.8}
.tc {text-align: center;}.tr{text-align: right;}.tl{text-align: left;}
.tdn {text-decoration: none;}
.auto {margin-left: auto; margin-right: auto;}
.mt20 {margin-top: 1.25rem;} .mt30 {margin-top: 2rem;}.mr0{margin-right: 0 !important;}
.p20{padding: 1.25rem;}.pt30 {padding-top: 2rem;}.pb50{padding-bottom: 2.2rem;}
.box {-webkit-box-sizing: border-box;box-sizing: border-box;}.dn{display: none !important;}

body {margin: 0; font-family: 'Arial'; font-size: 100%;background-color: #000 }

header {position: fixed; top: 0; width: 100%; height: 4.375rem; z-index:10; background-color: transparent}
header section {width: 100%; max-width: 93.75rem; min-width: 64rem; position: relative; margin: 0 auto;}
header .icon-list {display: none}
header .icon-close {display: none}
header .coname {font-family: 'Tensentype'; font-size: 1.125rem; padding-top: 0rem; color: #fff; line-height: 3;}
header .menu {font-size: .9rem; margin-right: 2.5rem;}
header ul {list-style: none; padding: 0; text-align: center; position: absolute; margin-top: 0;}
header li {padding:0 .5rem; display: inline-block; margin-left: 2.5rem;}
header li a {color: #333;color: #fff; text-decoration: none; display: block; line-height: 1.5; padding: 0.9rem 0; font-weight: bold;}
header li a:hover, header li a.curr {border-bottom:2px solid #ca0505; color: #ca0505 !important}
header li a.lang {width: 2.25rem ;height: 2.25rem; padding: 0;line-height: 2.25rem; position: relative; background-image: url(../img/lang.png); background-size: cover;}
header li a.lang:hover {border-bottom: 0}

header .e {font-size: 12px; font-size:10.8px\9; -webkit-transform: scale(0.70)}
header .logo {width: 7.875rem;height: 2.8125rem; background: url(../img/logo.png) no-repeat left center;
  background-size: contain;top: .7rem;position: absolute;left: 3rem;display: block;}
header .tran {-webkit-transition-property: background-color; -webkit-transition-duration: 0.3s; -webkit-transition-timing-function: ease;}
header.fixed {background: #fff;}
header.fixed li a{color: #333;}
header.fixed .logo{background-image: url(../img/logo2.png)}
header.fixed .icon-list {color: #5e5e5e}
header.fixed li a.lang {border-radius: 50%; background-color: #efefef; color: #333; width: 2.25rem ;height: 2.25rem; padding: 0;line-height: 2.25rem; position: relative; top: -.3125rem;}

footer {background-color: #000; color: #999; padding-bottom: 1rem; line-height: 1.5}
footer section {width: 100%; max-width: 93.75rem; min-width: 64rem; position: relative; 
  margin: 0 auto; background-color: transparent;padding:0 3rem 0; -webkit-box-sizing: border-box; box-sizing: border-box;}
footer .emails {font-size: .85rem;}
footer .emails label{ font-size: .75rem; display: block;}
footer ul {list-style: none; padding: 1rem 0 1.2rem; border-bottom: 1px solid #2d2d2d; width: 50%; margin: 0;}
footer li {display: inline-block; padding-right: 8rem;}
footer a {text-decoration: none; color: #fff; }
footer .contact {position: absolute; right: 3rem; top: 1rem; text-align: right}
footer .contact .t {font-size: 12px; font-size:10.8px\9; -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); -webkit-transform-origin: right; -ms-transform-origin: right; transform-origin: right;}
footer .contact .ring {border:1px solid #333; border-radius: 100%; display: inline-block;
  width: 2.375rem;height: 2.375rem;line-height: 2.3rem; text-align: center; margin-left: .5rem; margin-top: .5rem;
position: relative;}

footer .contact .icon-taptap {font-size: .9rem;}
footer .contact .icon-taptap:before {position: absolute; left: 0; right: 0 ; top:.125rem;}
footer .contact .icon-facebook {font-size: 1.3rem;}
footer .contact .icon-facebook:before {position: absolute; left: 0; right: 0 ; margin-left: -.1rem;}
footer .contact .icon-weixin {font-size: 1.25rem;}
footer .contact .icon-weixin:before {position: absolute; left: 0; right: 0 ; top:.1rem;}

footer .coname {font-family: 'Tensentype'; font-size: 1.125rem; padding-top: 1rem;
text-indent: -9999rem; overflow: hidden;
background: url(../img/cname.png) no-repeat; background-size: contain;
width: 14.5625rem;height: 1.0625rem; margin-top: 1.45rem; margin-bottom: .5rem; -webkit-box-sizing: border-box; box-sizing: border-box;}
footer .coname2 {font-size: .75rem;}
footer .addr {position: absolute; right: 3rem; font-size: .75rem; text-align: right; margin-top: -2.5rem;}
footer .addr a {color: #999; text-decoration: underline;}
footer .addr img {vertical-align: text-bottom; margin-right: .25rem; height: 1rem}
footer .addr label {color: #fff}
footer .addr .alert {margin-top: 4px; margin-bottom: 20px}
footer .split {color: #999; border-left: 1px solid #999; padding-left: .5rem; margin-left: .5rem;}
footer .tdu {text-decoration: underline; }

h4 {color: #333;}
.titbg {color: #333}
.aboutbtn {position:relative; ;display: block; height: 3.5rem; width: 15rem; background-color: #ca0505; font-size: 1rem;line-height: 3.5rem; color: #fff;}
.aboutbtn::before {content:''; background: #dbdbdb; height: 3.5rem; width: 15rem; display: block; z-index: -1;
position: absolute; top: 3px;left: 3px;}
.aboutbtn .icon-arrow-r {font-size: 1.2rem; position: absolute; right: 1rem;}

.home .swiper-container {height: 29rem;}
.home .swiper-slide div {height: 29rem; width: 100%; background: url(../img/bannel1.jpg) top center; background-size:cover;}
.home .swiper-slide .img2 {background-image: url(../img/bannel2.jpg)}
.home .swiper-slide .img3 {background-image: url(../img/bannel3.jpg)}
.home .swiper-slide .img4 {background-image: url(../img/bannel4.jpg)}

.swiper-pagination-bullet {width: 1.5rem; height:0.1875rem; background-color: #fff; opacity: .3; border-radius:0;}
.swiper-pagination-bullet-active {opacity: 1;}
.slider-i {position: absolute; top:10rem; z-index: 3; pointer-events:none; width: 100%; text-align: center;}
.slider-i img {width: 23.6rem; }

.iconfont {font-family:"iconfont" !important; font-size:16px; font-style:normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.icon-facebook:before { content: "\e6d4"; }
.icon-close:before { content: "\e616"; }
.icon-location:before { content: "\e628"; }
.icon-list:before { content: "\e604"; }
.icon-arrow-r:before { content: "\e788"; }
.icon-taptap:before { content: "\e623"; }
.icon-weixin:before { content: "\e627"; }

.modal-open {overflow: hidden;}
.modal-open .modal{display: block; opacity: 1;}
.modal {-webkit-transition: opacity .15s linear;-o-transition: opacity .15s linear;transition: opacity .15s linear; opacity: 0;
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; display: none; overflow: hidden; outline: 0; background: rgba(0,0,0,.3) }

.bggrey {background-color: #f2f2f4;}
body .bggrey section {background-color: transparent; margin-top: 0;}
.bgwhite {background-color: #fff;}
body .bgwhite section {background-color: transparent; margin-top: 0;}
body > section {background-color: #fff}
body section section { max-width: 67.5rem; min-width: 67.5rem; position: relative; margin: -3rem auto 0;
padding:2.125rem 4.375rem 3.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff}

.titlebg {width: 100%; max-width: 93.75rem; min-width: 64rem; position: relative; margin: 0 auto;}
h1 {background-size: contain; text-indent: -999px; overflow: hidden; 
  background: no-repeat left bottom;background-size: contain; margin-bottom: 0.625rem;}
.titlebg section {padding: 0;background-color: transparent; padding-top: 8.15rem; }
.clear_mb_3{margin-bottom: -3rem;}

/* about us */
.bannel-aboutus {background-color: #f7f7f7}
.h1-aboutus {width: 18.625rem;height: 3.5rem; background-image: url(../img/h1-aboutus.png);}
/*
.bannel-aboutus .bg {width: 100%; height: 35.40625rem; 
  background: url(../img/bannel-aboutus.jpg) center top no-repeat; background-size: cover;}  
*/
.bannel-aboutus .bg {}
.bgwhite .aboutus-section {margin-bottom: 3.75rem; position: relative; top: -2.5rem; background: #fff;} 
.aboutus-section h4 {font-size: 1.625rem; font-weight: normal; margin: 1rem 0;}
.aboutus-section h5 {font-size: 1.125rem; font-weight: normal; margin-bottom: 1rem; margin-top:3rem;}
.aboutus-section h5.red {color:#ca0505; margin-top: 1rem; padding-bottom: 1rem; font-size: 1.375rem;}

.aboutus-section p {line-height: 1.8;color: #999; font-size: 0.875rem;}
.aboutus-section .cbox {border-bottom: 1px solid #e7e7e7; margin: 3rem 3rem 0; padding-bottom: 4rem; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.aboutus-section .cbox div {width: 10rem; height: 10rem; margin-left: 3rem; margin-right: 3rem;
background: url(../img/c1.png) no-repeat center center; background-size: contain;}
.aboutus-section .cbox .img2 {background-image: url(../img/c2.png)}
.aboutus-section .cbox .img3 {background-image: url(../img/c3.png)}
.aboutus-section .honor {margin: 3rem 3rem 0; padding-bottom: 0rem; text-align: left; vertical-align: top;}
.aboutus-section .honor label {color: #1c1c1c; font-size: 1.375rem; vertical-align: top}
.aboutus-section .honor .con {
  vertical-align: top;
  margin-left: 9rem ; display: inline-block; margin-top: 0; font-size: .875rem;}
.aboutus-section .history {margin: 3rem 3rem 0; padding-bottom: 4rem; text-align: left;border-bottom: 1px solid #e7e7e7;}
.aboutus-section .history label {color: #1c1c1c; font-size: 1.375rem;}
.aboutus-section .history .historyimg {
width: 50.75rem; height: 14.81rem; margin-top: 3rem; margin-bottom: 2rem;
background: url(../img/history.jpg) no-repeat center center; background-size: contain;}
.bgwhite .aboutus-section {top: 0;margin-bottom: 0;}
.aboutus-section .video {border-bottom: 1px solid #e7e7e7;padding-bottom: 4rem;}
.aboutus-section .video video{width: 50rem; height: 28.125rem;}

/* games */

.game-section .maodian {position: relative; top:-5rem;display: block;
/* background: red; width: 10px; height: 10px; */}
.bannel-games {background-color: #f7f7f7}
.bannel-games section {background-color: transparent; /*padding: 0;*/}
.h1-games {width: 18.625rem;height: 3.5rem; background-image: url(../img/h1-games.png);}
.bannel-games .bg {width: 100%; height: 15rem; 
  background: url(../img/bannel-games.jpg) top center no-repeat; background-size: cover;}
.game-section .h4 {font-size: 1.625rem;}
.game-section .tit {top: -9.38rem;text-align: center; height: 6rem;}
.game-section .tit .img {margin-bottom: -2.75rem; }
.game-section .tit .img img {width: 16.5625rem;}
.game-section .titbg {line-height: 1; padding-top: 2.625rem;padding-bottom: 2rem; 
  margin-left: -4.375rem; margin-right: -4.375rem;}
.game-section {margin-top: 0;}
.game-section .section-list {padding-left: 2.5rem; padding-right: 2.5rem; padding-bottom: 1.5rem;}
.game-section .list {list-style: none; padding-left: 0; margin-bottom: 0;}
.game-section .list h4 {font-size: 1.75rem;display: inline-block; font-weight: normal;margin: 0;}
.game-section .list .subtit {color: #acacac; font-size: 0.875rem; margin-left: .5rem;}
.game-section .list p {font-size: 0.875rem; color: #999; line-height: 1.5; padding-right: 8rem;}
.game-section .list .tags span{ border:1px solid #e0e0e0; border-radius: .25rem; background-color: #fff; font-size: 0.75rem; padding:0 .5rem; line-height: 1.8; color:#999; display: inline-block;margin-right: .2rem;}

.game-section .list .icon {width: 4.8125rem;height: 4.8125rem;
  background: url(../img/g1i.jpg) center center; background-size: cover; float: right}
.game-section .list .img {margin-top: 1.25rem;margin-bottom: 2rem;width: 52.25rem;height: 19.5rem; 
  background: url(../img/g1.jpg) center top no-repeat; background-size: cover; position: relative;}
.game-section .list .con {background-color: #21273b; color: #fff;
  width: 14.75rem;height: 19.4rem; 
  -webkit-box-sizing: border-box; 
          box-sizing: border-box; position: absolute; right: -10.25rem; top: 1rem; 
  padding: 0.75rem 1.8rem; font-size: 0.75rem; line-height: 1.5}
.game-section .list .con h4 {font-size: 1.3rem;display: block; margin: .75rem 0; color: #fff}
.game-section .list .more {font-size: .75rem;display: block; margin: .75rem 0; position: relative;}
.game-section .list .ring { color: #999; text-decoration: none; margin-right: 1rem; padding-top: .75rem; display: inline-block;}
.game-section .list .iconfont {border-radius: 100%; display: inline-block; background-color: #333;
width: 2rem;height: 2rem;line-height: 2rem; text-align: center; color: #fff;margin-right: .75rem; vertical-align: middle}
.game-section .list .icon-taptap {font-size: .75rem;   position: relative;}
.game-section .list .icon-taptap:before {position: absolute; left: 0; right: 0; top:.08rem; margin-left: .1rem;}
.game-section .list .icon-facebook {font-size: 1.25rem;   position: relative;}
.game-section .list .icon-facebook:before {position: absolute; left: 0; right: 0; margin-left: -.15rem; margin-top: -.125rem;}
.game-section .list .icon-bahamut {width: 2rem; height: 2rem; background: url(../img/bahamut.png) no-repeat; background-size: cover;}
.game-section .list .appstore {position: absolute; right: 0;filter: drop-shadow( 0 5px 10px rgba(0,0,0,0.4));padding-top: .75rem; margin-top: -0.3125rem;}

.game-section .item1 .icon {background-image: url(../img/g1i.jpg)}
.game-section .item1 .img {background-image: url(../img/g1.jpg); display: block;}
.game-section .item2 .icon {background-image: url(../img/g2i.jpg)}
.game-section .item2 .img {background-image: url(../img/g3.jpg); margin-left: 10.25rem;display: block;}
.game-section .item2 .con {background-color: #993300; right: auto;left: -10.2rem;}
.game-section .item3 .icon {background-image: url(../img/g3i.jpg)}
.game-section .item3 .img {background-image: url(../img/g2.jpg);display: block;}
.game-section .item3 .con {background-color: #366;}

.game-section .list2 {list-style: none; padding-left: 0; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.game-section .list2 .img1, .game-section .list2 .img2 {margin-top: 1.25rem;}
.game-section .list2 li {width: 48%}
.game-section .list2 h4 {font-size: 1.75rem;display: inline-block; font-weight: normal;margin: 0;}
.game-section .list2 .subtit {color: #acacac; font-size: 0.875rem; margin-left: .5rem;}
.game-section .list2 p {font-size: 0.875rem; color: #999; line-height: 1.5; padding-right: 0;}
.game-section .list3 {display: -webkit-box;display: -ms-flexbox;display: flex;}
.game-section .list3 li {width: 14.6875rem; display: inline-block; margin-right: 1.25rem;}
.game-section .list3 .img2 {background-image: url(../img/g7.jpg)}
.game-section .list3 h4 {font-size: .875rem ; font-weight: bold; margin-top: 1.25rem;}
.game-section .list3 p {padding-right: 0; font-size: .75rem}
.game-section .list3-h4 {font-size: 1.125rem;}
/* workplace */
.bannel-workplace {background-color: #f7f7f7}
.bannel-workplace .titlebg {width: 100%; max-width: 93.75rem; min-width: 64rem; position: relative; margin: 0 auto;}
.h1-workplace {width: 20rem;height: 3.5rem;  background: url(../img/h1-workplace.png) no-repeat left bottom;background-size: contain; }
.bannel-workplace .bg {width: 100%; height: 15rem; 
  background: url(../img/bannel-workplace.jpg) center top no-repeat; background-size: cover;}

.bgwhite .workplace-section {margin-bottom: 3.75rem; position: relative; /* top: -2.5rem; background: #fff; */} 
.bgwhite .workplace-section2 {margin-bottom: 0;padding-bottom: 0;}
.workplace-section h4 {font-size: 1.625rem; font-weight: normal; margin: 1rem 0;}
.workplace-section .subtit {font-size: 0.875rem; color: #999; line-height: 1.5}
.workplace-section .fl-list {margin-top: 2rem; list-style: none; padding-left: 0; 
  padding-bottom: 0rem; margin-bottom: 3rem;
  -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; display:-webkit-box; display:-ms-flexbox; display:flex; 
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.workplace-section .fl-list li {width: 14.125rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff;
 text-align: center; line-height: 1.5; padding: 2rem; margin-bottom: .75rem; border:1px solid #e8e8e8;}
.workplace-section .fl-list .img {width: 4.375rem;height: 4.375rem; margin:0 auto;
  background: url(../img/w1.png) no-repeat center center; background-size: contain;}
.workplace-section .fl-list .tit {font-size: 1.375rem; margin: 1rem 0; color: #333;}
.workplace-section .fl-list .con {font-size: 0.875rem; color: #999;}

.workplace-section .fl-list .img2 {background-image: url(../img/w2.png)}
.workplace-section .fl-list .img3 {background-image: url(../img/w3.png)}
.workplace-section .fl-list .img4 {background-image: url(../img/w4.png)}
.workplace-section .fl-list .img5 {background-image: url(../img/w5.png)}
.workplace-section .fl-list .img6 {background-image: url(../img/w6.png)}
.workplace-section .fl-list .img7 {background-image: url(../img/w7.png)}
.workplace-section .fl-list .img8 {background-image: url(../img/w8.png)}
.workplace-section .hd {color: #999; padding-bottom: 2rem;}

.workplace-section .swiper-container {height: 21.8125rem; margin-top: 2rem;}
.workplace-section .swiper-slide div {height: 21.8125rem; width: 100%; background: url(../img/w1.jpg) top center; background-size:cover;}
.workplace-section .swiper-slide .img2 {background-image: url(../img/w2.jpg)}
.workplace-section .swiper-slide .img3 {background-image: url(../img/w3.jpg)}
.workplace-section .swiper-slide .img4 {background-image: url(../img/w4.jpg)}
.workplace-section .swiper-slide .img5 {background-image: url(../img/w5.jpg)}
.workplace-section .swiper-slide .img6 {background-image: url(../img/w6.jpg)}

/* products */

.h1-apps {width: 17.8rem;height: 3.34rem; background-image: url(../img/h1-apps.png);}
/* .bg-apps {width: 100%; height: 0.5rem; } */
.bannel-games .bg-apps {width: 100%; height: 15rem;
  background: url(../img/bannel-apps.png) top center no-repeat; background-size: cover;}

@media(max-width: 768px) {
  .h1-apps {margin-left: 1.25rem; width: 10rem;height: 2.1rem;}
  .bannel-games .bg-apps {width: 100%; height: calc(100vw * 0.3467);}
}

/* careers */

.main-tabs {width: 67.5rem; margin-left: -4.375rem;margin-right: -4.375rem; margin-top: -2.1rem; vertical-align: top;}
.main-tabs a {width: 50%; display: inline-block; border-top:0.25rem solid #aaa; background-color: #f3f3f3;
height: 3.5rem; line-height: 3.5rem; text-decoration: none; color: #000; font-size: 1.25rem;vertical-align: top;}
.main-tabs a.curr {background-color: #fff; color:#ca0505; border-top-color: #ca0505; overflow: hidden; line-height: 4rem}
/*#tabplane1, #tabplane2 {padding-top: 2rem;}*/
#tabplane1, #tabplane2 {padding-top: 38px;}
#tabplane2 {margin-bottom: 0;}

.bannel-careers {background-color: #f7f7f7}
.bannel-careers .titlebg {width: 100%; max-width: 93.75rem; min-width: 64rem; position: relative; margin: 0 auto;}
.h1-careers {width: 18.625rem;height: 3.5rem; 
  background-image: url(../img/h1-careers.png); }
.bannel-careers .bg {width: 100%; height: 15rem; 
  background: url(../img/bannel-careers.jpg) center center no-repeat; background-size: cover;}
.bgwhite .careers-section {position: relative; background: #fff; padding-bottom: 160px} 
.careers-section .maodian {position: relative; top:-9rem;display: block;
/*background: red; width: 10px; height: 10px; */}
.careers-section h4 {font-size: 24pt; font-weight: normal; margin: 13px 0;}
.careers-section .subtit {font-size: 12pt; color: #999;line-height: 1.5}
.careers-section .careers-tabs {position: relative; text-align: center; width: 96%; margin: 12px auto 60px; padding-top: 40px;}

/*.careers-section .careers-tabs a{width: 40%; display: inline-block; border:1px solid #e4e4e4;
font-size: 1.25rem; color: #333; line-height: 3.375rem; text-align: center;text-decoration: none;margin-right: 0.0625rem;}*/
/*.careers-section .careers-tabs a.curr {border-color: #ca0505; background-color: #ca0505; color: #fff; }*/
.curr_sz{width: 420px; height: 138px; display: inline-block;   background-size: 100% 100%; background-image: url(../img/shzpn.png); background-repeat:no-repeat; margin-right: 20px;}
.curr_xz{width: 420px; height: 138px; display: inline-block;  background-size: 100% 100%; background-image: url(../img/xyzpn.png); background-repeat:no-repeat; margin-right: 20px;}
.curr_xz:hover{width: 420px; height:138px; background-image: url(../img/xyzpv.png); background-repeat: no-repeat; margin-right: 20px;}
.curr_sz:hover{width: 420px; height:138px; background-image: url(../img/shzpv.png); background-repeat: no-repeat; margin-right: 20px;}
.careers-section .list {
  padding-top: 2rem; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; 
  padding-left: 0; list-style: none; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: -5rem;}
.careers-section .list > li {width: 48%; background-color: #fafafa; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 2rem; padding-bottom: 2rem;}
.careers-section .list > li .icon { width: 7.5rem;height: 7.5rem;border-radius: 100%; 
background: url(../img/ca1.png) #fff center center; background-size: contain; margin: -3.75rem auto 0;}
.careers-section .list > li .tit {font-size: 1.375rem; margin: 3rem 0 1rem;}
.careers-section .list dl {text-align: left; font-size: 0.875rem; padding:0 3.75rem}
.careers-section .list dt {font-size: 1rem; padding:1rem 0}
.careers-section .list dd {padding:0; margin: 0;}
.careers-section .list dd ul {list-style: square; padding-left: 1.25rem; line-height: 1.8; color: #999}
.careers-section .list dd ul a {color: #c00; text-decoration: none}
.careers-section .list > li .icon2 {background-image: url(../img/ca2.png)}
.careers-section .list > li .icon3 {background-image: url(../img/ca3.png)}
.careers-section .list > li .icon4 {background-image: url(../img/ca4.png)}
.careers-section .list > li .icon5 {background-image: url(../img/ca5.png)}
.careers-section .list > li .icon6 {background-image: url(../img/ca6.png)}
.careers-section .list > li .icon7 {background-image: url(../img/ca7.png)}
.careers-section .list > li .icon8 {background-image: url(../img/ca8.png)}
.careers-section .list > li .icon9 {background-image: url(../img/ca9.png)}
#society_menu .sp {margin:0 1.25rem; color:#ccc;}
#society_menu .curr {color: #ca0505}
#society_menu a {cursor: pointer;}
/*#school div {padding:5rem 0;}*/

/* contact */
.bannel-contact {background-color: #f7f7f7}
.bannel-contact .titlebg {width: 100%; max-width: 93.75rem; min-width: 64rem; position: relative; margin: 0 auto;}
.h1-contact {width: 18.625rem;height: 3.5rem; 
  background-image: url(../img/h1-contact.png);}
.bannel-contact .bg {width: 100%; height: 15rem; 
  background: url(../img/bannel-contact.jpg) center center no-repeat; background-size: cover;}
.bgwhite .contact-section {position: relative; background: #fff;} 
.contact-section .subtit {font-size: 0.875rem; color: #999;line-height: 1.5;}
.contact-section .subtit em {font-style: normal; color: #ca0505}
.contact-section .contact-info { text-align: left; padding: 2rem 0rem 0rem 6rem; vertical-align: top;}
.contact-section .contact-info label {color: #333; font-size: 1rem; font-weight: bold;
  display: inline-block; vertical-align: top; line-height: 1.65; margin-right: 3rem; float: left;}
.contact-section .contact-info .con { display: inline-block; vertical-align: top; font-size: 0.875rem; color: #999;}

.contact-section .contact-info table { float: left; }
.contact-section .contact-info table td{ font-size: 0.875rem; color: #999;}

.contact-section .link {font-size: 0.75rem; border-bottom: 1px solid #e7e7e7;; padding: 2rem 6rem 2.5rem; margin: 0 2rem;}
.contact-section .ring { color: #999; text-decoration: none; margin-right: 1.5rem; margin-left: 1.5rem;}

.contact-section .iconfont {border-radius: 100%; display: inline-block; background-color: #333;vertical-align: middle;
  width: 2.6rem;height: 2.6rem; line-height: 2.6rem; text-align: center; color: #fff; margin-right: .75rem;}
.contact-section .icon-taptap {font-size: .9rem;   position: relative;}
.contact-section .icon-taptap:before {position: absolute; left: 0; right: 0; top: .1rem;}
.contact-section .icon-facebook { font-size: 1.6rem; position: relative;}
.contact-section .icon-facebook:before {position: absolute; left: 0; right: 0; top: -.12rem; left: -.3rem;}
.contact-section .icon-weixin { font-size: 1.25rem;   position: relative;}
.contact-section .icon-weixin:before {position: absolute; left: 0; right: 0;}

#model-weixin {display: none}
#model-weixin.open {display: block;z-index:11; position: fixed; left: 0;right: 0;top: 0;bottom: 0; 
  text-align: center; line-height: 1.5; color: #666; font-size: .725rem; background-color: rgba(0,0,0,.3);}
#model-weixin .box {width: 18.125rem; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 2rem 3.5rem;background-color: #fff; margin: 10rem auto;}
#model-weixin .btn {position: relative; display: block; height: 3.125rem; background-color: #ca0505;
font-size: 1rem; line-height: 3.125rem; color: #fff; text-align: center; margin-top: 1.5rem;}

@media(max-width: 768px) {
  html {font-size: 18px !important; }
  header {height: 3.33rem;}
  header .logo {width: 4.66rem; height: 1.667rem;top: .8rem;left: 1.25rem;}

  body .menu {display: none; margin-right: 0;}
  .menu.open {display: block;background: #fff;width: 100%; text-align: left; -webkit-box-sizing: border-box; box-sizing: border-box; 
    padding:0 1.25rem .5rem; margin-top:3.33rem; border-top: 1px solid #eee;z-index: 10}
  .menu.open li{display: block; border-bottom: 1px solid #eee; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0;}
  .menu.open a{color: #333; font-size: 1rem; line-height: 1.25rem; padding:1rem 0 .8rem;}
  .menu.open a div{font-size: 1rem; position: absolute; right: 1.25rem;}
  .menu.open a.lang {position: absolute; right: 4rem;top: -2.8rem; text-align: center;}
  header .menu.open a.lang {background-color: #efefef;width: 2.25rem; height: 2.25rem; padding: 0; line-height: 2.5rem;}
  header section, footer section, section {width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; min-width:inherit;}
  header li a {font-weight: normal;}
  header.open {background: #fff;}
  header.open li a{color: #333;}
  header.open .logo{background-image: url(../img/logo2.png)}
  header.open .icon-list {display: none;}

  header.open .icon-close {display: block;}
  header .icon-list {display: block; font-size: 1rem; color: #fff; position: absolute; right: 0; padding: 1.2em;}
  header .icon-close {display: none; font-size: 1rem; position: absolute; right: 0; padding: 1.2em; color: #5e5e5e}
  .home .swiper-container {height: 20.5rem;}
  .home .swiper-slide div {height: 20.5rem;}
  .home .slider-i {top: 9rem;}
  .home .slider-i img {width: 60vw}

  footer {height: auto; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1rem;}
  footer section {padding: 0;}
  footer .emails {width: auto}
  footer ul {width: auto; padding-bottom: .725rem;}
  footer .name {text-align: center; color:#fff;}
  footer .contact {width: 100%; position: relative;top: auto; right: auto; text-align: left; padding-top: .725rem;
    border-bottom: 1px solid #2d2d2d; padding-bottom: .725rem;}
  footer .contact .ring {margin-left: 0; margin-right: .5rem;}
  footer .contact .t {text-align: left; -webkit-transform: scale(1);}
  footer li {display: inline-block; padding-right: 10%}
  footer .coname {font-family: 'Tensentype'; padding-top: 1.5rem; 
  font-family: 'Tensentype'; font-size: 1.125rem; padding-top: 1rem;
  text-indent: -9999rem; overflow: hidden;
  background: url(../img/cname.png) no-repeat; background-size: contain;
  width: 12rem;height: 0.7rem; margin: 1.45rem auto .5rem; -webkit-box-sizing: border-box; box-sizing: border-box;}
  footer .addr {width: 100%; position: relative; top: 1rem; right: auto; text-align: center; padding-bottom: 2rem; margin-top: 0; }

  footer .contact .icon-taptap {font-size: .8rem;}
  footer .contact .icon-taptap:before {position: absolute; left: 0; right: 0 ; top:.05rem;}
  footer .contact .icon-facebook {font-size: 1.25rem;}
  footer .contact .icon-facebook:before {position: absolute; left: 0; right: 0 ; margin-left: -.25rem; margin-top: -.1rem;}
  footer .contact .icon-weixin {font-size: 1rem;}
  footer .contact .icon-weixin:before {position: absolute; left: 0; right: 0 ; top:.1rem; margin-left: .1rem}

  h1 {margin: .5rem 0;}
  /* index */
  .home .swiper-slide div {background-image: url(../img/bannel1m.jpg)}
  .home .swiper-slide .img2 {background-image: url(../img/bannel2m.jpg)}
  .home .swiper-slide .img3 {background-image: url(../img/bannel3m.jpg)}
  .home .swiper-slide .img4 {background-image: url(../img/bannel4m.jpg)}

  /* about us */
  .h1-aboutus {margin-left: 1.25rem; width: 10rem;height: 2.1rem; }
  .bannel-aboutus .bg {width: 100%; height: calc(100vw * 0.3467);}
  .bgwhite .aboutus-section {margin-top:0;top: 0;margin-bottom:0;}
  .aboutus-section h4 {font-size: 1.375rem;}
  .bgwhite .aboutus-section {padding: 1.25rem 1.25rem;}
  .aboutus-section p {font-size: .875rem; line-height: 1.8}
  .aboutus-section .cbox {margin: 1.25rem 0 0; padding-bottom: 1rem; display: block;}
  .aboutus-section .cbox div {margin: 0 auto 1.5rem; width: calc(100vw * .45); height: calc(100vw * .45)}
  .aboutus-section .honor {margin: 1.25rem 0; padding-bottom:1.25rem;}
  .aboutus-section .honor label {color: #1c1c1c; font-size: 1.375rem;display: block;text-align: center; padding: 1.25rem 0}
  .aboutus-section .honor .con {margin-left: 0;margin-top: 0; font-size: .875rem;}
  
  .aboutus-section .history {margin: 1.25rem 0; padding-bottom:0.25rem;}
  .aboutus-section .history label {color: #1c1c1c; font-size: 1.375rem;display: block;text-align: center; padding: .75rem 0;margin: 0;}
  .aboutus-section .history .historyimg {width:100% ; height: calc(100vw * 0.708); margin-top: 1.25rem; margin-bottom: 0;
background: url(../img/history2.jpg) no-repeat center center; background-size: contain;}
  .aboutus-section .video {padding-bottom:3rem;}
  .aboutus-section .video video{width:100% ; height: calc(100vw * 0.5625)}
  /* games */
  .h1-games {margin-left: 1.25rem; width: 10rem;height: 2.1rem;}
  .game-section .maodian {top:-4rem;}
  .game-section .tit .h4{font-size: 1.375rem}
  .bannel-games .bg {width: 100%; height: calc(100vw * 0.3467);}
  .game-section section {padding: 2rem 1.25rem;}
  .game-section .tit {padding-left: 0;padding-right: 0; top:-5.6rem; height: 6rem;}
  .game-section .titbg {margin-left: 0;margin-right: 0; padding-left: 2rem; padding-right: 2rem;}
  .game-section .tit .img img{width: 50%}
  .game-section .list {padding-bottom: 0;}
  .game-section .list h4 { font-size: 1.25rem ;}
  .game-section .list p {padding-right: 0;}
  .game-section .list .icon {width: 2rem;height: 2rem; margin-top: -0.5rem;}
  .game-section .list .tags span{ margin-bottom: .5rem;}
  .game-section .list .con h4 {font-size: 1rem; margin: 0; }
  .game-section .list .img {width: 100vw; height: auto; margin-left: -1.25rem; background-repeat: no-repeat; 
    background-position: top center; padding-top: calc(100vw *  0.331)}
  .game-section .list .con {
    position: relative;
    left: auto; right: auto; 
    height: auto ; width: 100%; margin-left: 0; padding:1.25rem;}

  .game-section .section-list {padding: 1.25rem 1.25rem 2rem;}
  .game-section .list2 {display: block; margin-bottom: -5rem}
  .game-section .list2 p {font-size: .75rem;}
  .game-section .list2 li {width: 100%; margin-bottom: 3rem; border-bottom: 1px solid #e7e7e7; padding-bottom: 1rem;}
  .game-section .list2 li:last-child {border-bottom: 0; margin-bottom: 0;padding-bottom: 0;}
  .game-section .list2 .img1, .game-section .list2 .img2 {margin-top: .275rem; width: 100vw; margin-left: -1.25rem;}

  .game-section .list .iconfont {margin-right: .5rem;}
  .game-section .list .icon-taptap {font-size: .75rem;}
  .game-section .list .icon-taptap:before {top:.08rem; margin-left: .1rem;}
  .game-section .list .icon-facebook {font-size: 1.25rem; }
  .game-section .list .icon-facebook:before {margin-left: -.15rem; margin-top: -.125rem;}

  .game-section .list3-h4 {margin: 0; font-size: 1rem}
  .game-section .list3 h4 {font-size: .875rem}
  .game-section .list3 .img1, .game-section .list3 .img2{width: 100%; margin-top: 0;}
  .game-section .list3 {display: block;}
  .game-section .list3 li {width: auto; margin-right: 0;}
  .game-section .list {margin-bottom: -1rem;}
  .game-section .list .img {background-size: contain;margin-top: 0.25rem; text-decoration: none;}
  .game-section .list .ring .text{ display: none; }
  /* workplace */
  .h1-workplace {margin-left: 1.25rem; width: 10rem;height: 2.1rem;}
  .bannel-workplace .bg {width: 100%; height: calc(100vw * 0.3467);}
  .bgwhite .workplace-section {margin-bottom:0;margin-top: 0;}
  .workplace-section section {padding: 1.25rem 1.25rem; }
  .workplace-section h4 { font-size: 1.25rem ;}
  .bgwhite .workplace-section {top:0;}
  .workplace-section .subtit {line-height: 1.5}
  .workplace-section .fl-list {padding-bottom:0;margin-bottom: 0;}
  .workplace-section .fl-list li {width: inherit; padding: 1.25rem;}
  .workplace-section .fl-list .tit {font-size: 1rem;}
  .workplace-section .mt30 {margin-top: 1.25rem;}
  .workplace-section .hd .tit {font-size: 1rem;}
  .workplace-section .hd .f14 {font-size: .75rem;}
  .workplace-section .hd .p20 {padding-left: 0;padding-right: 0;}
  .workplace-section img {width: 100vw; margin-left: -1.25rem;}

  .workplace-section .swiper-container {width: 100vw; height: 7.78rem; margin-left: -1.25rem;}
  .workplace-section .swiper-slide div {height: 7.78rem;}

  /* careers */
  .main-tabs {width: 100vw; margin-left: -1.25rem;margin-right: -1.25rem; margin-top: -1.25rem;}
  .h1-careers {margin-left: 1.25rem; width: 10rem;height: 2.1rem;}
  .bannel-careers .bg {width: 100%; height: calc(100vw * 0.3467);}
  .bgwhite .careers-section {margin-bottom:0; padding-bottom: 3rem;}
  .careers-section .maodian {top:-11rem;}
  .careers-section section {padding: 1.25rem 1.25rem; }
  .careers-section h4 { font-size: 1.25rem ;}
  .bgwhite .careers-section {top:0;}
  .careers-section .subtit {line-height: 1.5; }
 /* .careers-section .list { margin-bottom: -4rem; margin-top: 3rem;padding-top: 0;}
  .careers-section .list > li {width: 100%}
  .careers-section .list > li .icon { width: 6.5rem;height: 6.5rem;}
  .careers-section .list > li .tit {font-size: 1.25rem;}
  .careers-section .list > li .tit {font-size: 1.125rem; margin: .725rem 0;}
  .careers-section .list dl {font-size: 0.75rem;    padding: 0 2rem;}
  .careers-section .list dt {font-size: 0.875rem; padding: .725rem 0;}*/

  .careers-section .careers-tabs {margin: 1.778rem auto 4rem;width: 100%;}
  .careers-section .careers-tabs a{width: 200px; height: 69px; font-size: 1.222rem; line-height: 3.333rem; margin-right: 0.0625rem; margin-top: 30px;}
  #society_menu .sp {margin:0 0.8rem;}
  /* contact */
  .h1-contact {margin-left: 1.25rem; width: 10rem;height: 2.1rem;}
  .bannel-contact .bg {width: 100%; height: calc(100vw * 0.3467);}
  .contact-section {padding-bottom: 0;}
  .contact-section .link {padding: 1rem 0 1.5rem; font-size: .725rem; margin: 0;}
  .contact-section .ring {margin-left: .25rem;margin-right: .25rem;}
  .contact-section .iconfont {border-radius: 100%; display: inline-block; background-color: #333;
    vertical-align: middle; width: 1.725rem;height: 1.725rem; line-height: 1.725rem; 
    text-align: center; color: #fff; margin-right: .25rem;}
  .contact-section .icon-taptap {font-size: .625rem;   position: relative;}
  .contact-section .icon-taptap:before {position: absolute; left: 0; right: 0;}
  .contact-section .icon-facebook { font-size: 1.125rem; position: relative;}
  .contact-section .icon-facebook:before {position: absolute; left: -.25rem; top: -.1rem;}
  .contact-section .icon-weixin { font-size: .825rem;   position: relative;}
  .contact-section .icon-weixin:before {position: absolute; left: 0; right: 0;}

  .contact-section .subtit {font-size: 0.825rem}

  .contact-section .contact-info {padding: 0;}
  .contact-section .contact-info { text-align: left; padding: 1.5rem 1rem 0;}
  .contact-section .contact-info label {font-size: .889rem;}
  .contact-section .contact-info .con {font-size: .825rem;}
  .bgwhite .contact-section {margin-bottom: 0; top:0;}
  .contact-section section {padding: 1.25rem 1.25rem;}

  #model-weixin.open {line-height: 1.5; font-size: .725rem;}
  #model-weixin .box {width: 14.445rem; padding: 1.8rem 2rem 1.5rem; margin: 5rem auto;}
  #model-weixin .btn {position: relative; display: block; height: 2.725rem; background-color: #ca0505;
  font-size: .825rem; line-height: 2.725rem; margin-top:1.25rem;}


  .titlebg { max-width: inherit !important; min-width: inherit !important; }
  .titlebg section {padding: 7.5rem 0 0;}

  body section section{min-width: inherit;}

}

@media (max-width:350px) {
}