/*
======================================================================
*	Author:				    www.vokodesign.com
*	Creation Date:		2018-08-29
*	Last Author:		  licky
======================================================================
*/

/* css reset */
* { margin:0; padding:0;}
*, *:before, *:after {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
p { line-height:1.6;}
img { max-width:100%; border:none; display:block; overflow:hidden;}
li{ list-style-type: none;}
a { color:#1e1e1e; text-decoration:none; transition:all 0.3s ease-out 0s; -webkit-tap-highlight-color:transparent;}
a:link { color:#1e1e1e;}
a:visited { color:#1e1e1e;}
a:hover { text-decoration:none;}
a:active { color:#1e1e1e;}
.fl { float:left;}
.fr { float:right;}
.clearf { zoom:1;}
.clearf:after { content:'\20'; display:block; clear:both;}
/*去掉手机按下时默认的灰色*/
a,button,input,textarea { border:none; outline:none; box-shadow:none; -webkit-appearance:none;/* 去除移动端上控件内阴影 */ resize:none;/* 禁止textarea拖拽放大 */  -webkit-tap-highlight-color:rgba(0,0,0,0);/* 取消input瞬间出现灰色背景 */}
/*修改表单元素placeholder默认置灰文字颜色*/
.form-control::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder, input[type="url"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="text"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="password"]::-moz-placeholder {color:#8d8d8d; font-weight:normal;}
h1, h2, h3, h4, h5, h6 { font-style:normal; font-weight:bolder; line-height:1.2125em; text-rendering:optimizelegibility; text-transform:uppercase;}
html.no-scroll {overflow-y:hidden;}
body { width:100%; -webkit-font-smoothing: antialiased; font-size:14px;}
html {overflow:scroll; overflow-x:hidden; font-family:"Helvetica Neue",Helvetica,"PingFang SC","Microsoft Yahei","WenQuanYi Micro Hei",Arial,Verdana,sans-serif;}




/***** 字体图标 *****/
@font-face {font-family: 'iconfont';
    src: url('images/fonts/font_gbst3yrm6q146lxr/iconfont.eot');
    src: url('images/fonts/font_gbst3yrm6q146lxr/iconfont.eot?#iefix') format('embedded-opentype'),
    url('images/fonts/font_gbst3yrm6q146lxr/iconfont.woff') format('woff'),
    url('images/fonts/font_gbst3yrm6q146lxr/iconfont.ttf') format('truetype'),
    url('images/fonts/font_gbst3yrm6q146lxr/iconfont.svg#iconfont') format('svg');
}

.iconfont{
    font-family:"iconfont";
    font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
}




/****************************************/
/**************    公共    **************/
/***************************************/
/*分栏*/
.row {margin:0 auto; padding:0 20px; max-width:1200px; width:100%;}
.row2 {max-width:100%; padding:0 5px;}
.row_pr0 {padding-right:0;}
.page-spiel {margin-bottom:40px; text-align:center;}
/*白色文字*/
.text-white{ color:#fff;}
.pad-top{ padding-top:60px; }
/*模块标题(默认)*/
.page-title{ margin-top:70px; text-align:center;}
.page-title .line { display:none; width:1px; height:60px; margin:0 0 10px 33px; position:relative; background:#333333;}
.page-title .line em { visibility:hidden; position:absolute; bottom:0; left:-2px; display:block; width:5px; height:5px; transform:rotate(45deg); background:#333333;}
.page-title h3{ text-align:center; margin-bottom:5px; font-size:48px; color:#333333; letter-spacing:2px;}
.page-title p{ text-align:center; font-size:14px; color:#333333; text-transform:uppercase;}
/*模块标题(EN)*/
.page-title-en {}
.page-title-en p{ letter-spacing:6px;}
/*** 元素 ***/
.btn{ background-color:#222; color:#fff; padding:8px 28px; border-radius:36px; display:inline-block; font-size:12px; letter-spacing:2px; cursor:pointer;}
.page-spiel{ text-align:center; margin-bottom:66px;}
.page-spiel p{ margin-bottom:0px; font-size:20px;}
 /* 分栏 */
 .inner_section {margin:auto;}
 .large-6 {position:relative; width:50%;}
 .small-12 {position:relative; width:100%;}
.column , .columns { position:relative; padding-left:20px; padding-right:20px; float:left; width:100%;}
.pad-normal{ padding:40px 0;}
.pad-large{ padding-top:100px; padding-bottom:100px;}
.mag-normal {margin:40px auto;}
.left {float:left!important;}
.row:before, .row:after {content:" "; display:table;}
.row:after {clear:both;}
.large-centered { float:none; margin:auto;}
.whalf { width:50%;}

.box-title { margin-bottom:80px; text-align:center;}
.box-title h2 {font-size:44px;}
.box-title p {font-size:18px; font-weight:500; opacity:0.2; text-transform:uppercase;}

/* tab */
.tab {margin-bottom:40px;}
.tab .swiper1 .swiper-slide {width:auto; padding:0 20px 5px 20px; opacity:0.5; font-size:18px; display:inline-block; cursor:pointer;}
.tab .swiper1 .selected { opacity:1; font-weight:bold; border-bottom:2px solid #FF0000;}
.tab .swiper1 {margin-bottom:20px;}
.tab .swiper2 .swiper-slide {width:auto; padding:0；}
.tab .swiper2 .swiper-slide a { display:inline-block; font-size:16px; margin-bottom:10px; padding:5px 20px;}
.tab .swiper2 .swiper-slide a.on { color:#FFFFFF; border-radius:20px; background:#FF0000;}
/**/
.sub-title {}
.sub-title h2 {font-size:22px;}

 /* 按钮 */
a.btn { display:inline-block; position:relative; font-size:18px; padding:16px 40px; text-align:center; color:rgba(255,255,255,1); border:1px solid rgba(0,0,0,1); background:rgba(0,0,0,1); text-transform:uppercase;}
a.btn_border {border:1px solid rgba(0, 0, 0, 1); background:none;}
a.btn_no_border {border:none; border-bottom:1px solid rgba(0, 0, 0, 1); color:#ffffff; border-color:#ffffff; background:none;}
a.btn_view_more {color:#1e1e1e; border-color:#ffffff;}
a.btn-black { color:rgba(0,0,0,1); background:rgba(255,255,255,1);}
/* 下拉框 */
select {
  cursor:pointer; width:100%; font-size:14px; border-radius:0; outline:none!important; padding:14px;
  /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
  border: 1px solid rgba(0, 0, 0, 0.2);
  /*很关键：将默认的select选择框样式清除*/
  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;
}
/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display:none; }
select option {}

/* 按钮:查看更多 */
a.more {display:inline-block; width:140px; height:50px; line-height:50px; font-style:14px; text-align:center; border-radius:4px; border:1px solid rgba(0,0,0,0.1); background:#ffffff;}
a.more i { position:relative; top:3px;/*position、top为解决图标偏高*/ display:inline-block; color:rgba(255,255,255,0); font-size:20px; text-indent:-20px; line-height:1; font-style:normal; font-family:'next'!important;   /* Better Font Rendering =========== */-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; transition:all 0.3s ease-out 0s;}
a.more i::before {content:"\e900";}
a.more:hover { color:#ffffff; border-color:#e94609; background:#e94609;}
a.more:hover i {text-indent:2px; color:rgba(255,255,255,1);}
/**/
a.more_transparent {border:1px solid rgba(255,255,255,0.2); color:#ffffff; background:none;}
a.more_transparent:hover { text-indent:10px; border:1px solid rgba(0,0,0,1); background:rgba(0,0,0,1);}
a.more_transparent:hover i {text-indent:0px;}

/* 表单 */
.form .c3 {width:100%; overflow:hidden;}
.form .c3 .ic { float:left; width:50%;}
.form .c3 h2 {font-size:14px; font-weight:normal; margin-bottom:20px;}
.form label { float:left; margin:0 20px 20px 0;}
.form label input[type="radio"] { display:block; float:left; margin:0; padding:0; width:20px; height:20px;}
.form label input[type="radio"]:checked {background:#2d80e0;}
.form label span { display:block; float:left; margin-left:4px; height:20px; line-height:20px;}
.form .kindly-reminder {font-size:12px; color:#8d8d8d;}
/*开始：横向多个select*/
.form .c3 .ic_select {}
.form .c3 .ic_select .icc {width:50%; float:left; position:relative;}
.form .c3 .ic_select .icc:first-child select {border-right:none;}
.form .c3 .ic_select .icc:last-child select {border-left-color:rgba(0,0,0,0.1);}
.form .c3 .ic_select .icc i { display:block; width:9px; height:9px; position:absolute; right:20px; top:20px; background:url("images/select_arrow_icon.svg") repeat scroll 0 0; background-size:9px auto; background-repeat:no-repeat; background-position:center right;}
/*结束：横向多个select*/
.form .c3 .ic_100 {width:100%;}
.form .c3 .ic .icc {margin:0 24px 0 0;}
.form .c3 .ic:last-child .icc {margin-right:0;}
.form input { margin-bottom:20px; width:100%; padding:16px; border-radius:0; font-size:14px; border:1px solid rgba(0,0,0,0.2); transition:border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;}
.form select {margin-bottom:20px; border-radius:0;}
.form textarea { float:left; margin-bottom:20px; width:100%; height:160px; border-radius:0; padding:16px; font-size:14px; border:1px solid rgba(0,0,0,0.2); background:none; transition:border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;}
.form .btn { display:block; width:25%; color:#ffffff; border-radius:0; border:1px solid rgba(0,0,0,0); background:#2d80e0; transition:all 0.3s ease-out 0s;}
.form .btn:hover {opacity:0.5;}
.form input:focus , .form textarea:focus { color:#333333; box-shadow:0 0 10px rgba(0,0,0,0.1); transition:all 0.3s ease-out 0s;}


/* 返回顶部 */
.rTop {display:none; width:40px; height:40px; border-radius:4px; position:fixed; right:20px; bottom:20px; opacity:0.5; background:rgba(0,0,0,0.9) url("images/rTop_arrow.svg"); background-repeat:no-repeat; background-position:center; background-size:16px auto;}
.rTop:hover {opacity:1;}

/* 分页 */
#pages { margin:30px 0; text-align:center;}
#pages a , #pages span {display:inline-block; padding:10px 20px; margin:0 5px; border-radius:2px; border:1px solid rgba(0,0,0,0.05);}
#pages span {background:#e94609; color:#ffffff;}
#pages a:hover {border:1px solid rgba(0,0,0,0.2);}




/****************************************/
/**************    主页    **************/
/****************************************/

/***** 导航 *****/
.navigation{ position:fixed; left:0; top:0; z-index:3; width:100%; background:rgba(255,255,255,1); overflow:hidden; -webkit-transition:all 0.2s; transition:all 0.2s; -moz-transition:all 0.2s;}
.navigation .row {}
.navigation .inner_navigation {}
.navigation .logo { float:left; display:block; margin-top:10px; width:160px; height:70px; background:rgba(0, 0, 0, 0) url("images/logo.png") no-repeat left center / 100% auto;}
.navigation .logo img {display:block; width:100%;}
.menu{ list-style:none; overflow:hidden; text-align:right; float:right;}
.menu li{ float:left;}
.menu li:nth-child(2) {display:none;}
.menu li h1 {font-weight:normal;}
.menu li a{ position:relative; display:inline-block; padding:0 30px; font-size:18px; font-weight:bold; text-align:center; height:90px; line-height:90px; text-transform:uppercase; letter-spacing:3px; font-style:normal; text-rendering:optimizeLegibility; }
.menu li a:hover {color:#2864FF;}
/* 导航切换样式 */
.sticky-nav {box-shadow:0 10px 20px rgba(0, 0, 0, 0.1); border:none; background:rgba(255,255,255,1);}
.sticky-nav .logo { margin-top:5px;}
.sticky-nav li a {height:80px; line-height:80px; color:rgba(0,0,0,1);}
/*侧栏*/
.navigation .nav_more { display:none; position:fixed; right:0; top:0; z-index:999999; width:77px; height:77px; border:none; outline:none; cursor:pointer; background:none;}
.navigation .nav_more::after {width:32px; height:3px; right:22px; top:42px; background:#1e1e1e; content:""; position:absolute; -moz-transform:rotate(0deg); -ms-transform:rotate(0deg); -webkit-transform:rotate(0deg); transform:rotate(0deg); /*@include transform-origin(100%,100%);*/}
.navigation .nav_more::before {width:32px; height:3px; right:22px; top:32px; background:#1e1e1e; content:""; position:absolute; -moz-transform:rotate(0deg); -ms-transform:rotate(0deg); -webkit-transform:rotate(0deg); transform:rotate(0deg); /*@include transform-origin(0%,0%);*/}
.navigation .nav_more[data-animation="nav_more_hit"]:before, #navigation .nav_more[data-animation="nav_more_hit"]:after {-moz-transition:ease-out 300ms; -o-transition:ease-out 300ms; -webkit-transition:ease-out 300ms; transition:ease-out 300ms;}
.navigation .nav_more:hover::before , #navigation .nav_more:hover::after {opacity:0.9;}
.navigation .nav_more_hit {}
.navigation .nav_more_hit:before { top:37px; -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg);}
.navigation .nav_more_hit:after { top:37px; -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
.navigation .nav_more_off::before , #navigation .nav_more_off::after {background:#000000;}


/* 全屏Banner */
#home .swiper-container { margin-top:90px; }
#home .swiper-slide { height:600px;
  cursor:move;
  cursor:grab;
  background-color:#009FAB; background-attachment:scroll; background-position:center center; background-size:cover;
  overflow:hidden;
  position:relative;
}
#home .swiper-slide::before {content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}
#home .cell-1 { background:#1e1e1e url("images/banner_1.jpg"); background-attachment:scroll; background-position:center center; background-size:cover;}
#home .cell-2 { background:#1e1e1e url("images/banner_2.jpg"); background-attachment:scroll; background-position:center center; background-size:cover;} 
#home .swiper-wrapper {}
#home .swiper-slide .text { position:absolute; z-index:2; left:50%; top:50%; width:80%; margin-left:-42%; text-align:center; color:#ffffff; opacity:0;}
#home .swiper-slide .text h1 { font-size:72px; margin-bottom:20px;}
#home .swiper-slide .text p {margin:0; font-size:32px; line-height:1; /*letter-spacing:5px; padding-left:5px;*/}
#home .swiper-slide .ma {display:none;}
#home .swiper-slide .btn-area {}
#home .swiper-slide .btn-area a { background:linear-gradient(to top, rgba(0,159,171,0), rgba(0,159,171,0.6)); transition:all 0.3s ease 0s; -moz-transition:all 0.3s ease 0s;/* Firefox 4 */ -webkit-transition:all 0.3s ease 0s;/* Safari 和 Chrome */ -o-transition:all 0.3s ease 0s;/* Opera */}
#home .swiper-slide .btn-area a:hover { color:#ffffff; background:linear-gradient(to top, rgba(0,159,171,0), rgba(0,159,171,1));}
#home .swiper-slide .btn-area a:hover::before {display:none;}
#home .swiper-slide .mask {width:100%; height:100%; position:absolute; z-index:1; left:0; top:0; background:#000000; opacity:0;}
/* 当前幻灯片设置动画 */
#home .swiper-slide-active .text { opacity:1; margin-left:-40%;/*默认文字区域偏移量，实现文字动画效果*/ -webkit-transition-delay:0.3s;transition-delay:0.3s;-webkit-transition-duration:1s; transition-duration:1s;/* Safari 5.1 - 6.0 */}
/**/
.swiper-button-next, .swiper-button-prev {width:50px; height:80px; border-radius:2px; margin-top:-40px;}
.swiper-button-next:hover, .swiper-button-prev:hover { background-color:rgba(0,0,0,0.5); transition:all 0.3s ease 0s; -moz-transition:all 0.3s ease 0s;/* Firefox 4 */ -webkit-transition:all 0.3s ease 0s;/* Safari 和 Chrome */ -o-transition:all 0.3s ease 0s;/* Opera */}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next { left:20px; background-image:url("images/prev.svg"); background-size:20px auto; background-repeat:no-repeat; background-position:center;}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right:20px; background-image:url("images/next.svg"); background-size:20px auto; background-repeat:no-repeat; background-position:center;}
/**/
.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {bottom:20px;}
.swiper-pagination-bullet {background:#ffffff; opacity:0.2;}
.swiper-pagination-bullet-active {opacity:1;}



/***** 公司介绍 *****/
.service { padding:150px 0; width:100%;}
.service .inner_section {}
.service .box-title {}
.service .desc {font-size:22px; margin-bottom:50px;}
.service ul {margin:0 -40px;}
.service ul li { float:left; width:33.333333%; padding:0 40px}
.service ul li .inner { position:relative;}
.service ul li .icon {width:200px; height:200px; margin:0 auto 30px;}
.service ul li .text { text-align:center;}
.service ul li .text h4 {font-size:22px; margin-bottom:10px;}
.service ul li .text p {font-size:18px;}
.service ul li .icon-1 {background:url("images/service-icon-1.png") no-repeat scroll center center / 100% auto;}
.service ul li .icon-2 {background:url("images/service-icon-2.png") no-repeat scroll center center / 100% auto;}
.service ul li .icon-3 {background:url("images/service-icon-3.png") no-repeat scroll center center / 100% auto;}
/*hover*/
.service ul li:hover {}
.service ul li:hover .inner {/*box-shadow:0 15px 30px rgba(0, 0, 0, 0.1); transform:translate3d(0px, -2px, 0px);*/}


/***** intro *****/
.intro { padding:150px 0; background:#f8f8f8;}
.intro .row {position:relative;}
.intro .il {float:right; width:50%;}
.intro .text {float:left; width:50%; padding-right:5%; }
.intro .text p {font-size:22px; margin-bottom:30px; line-height:2;}


/***** download *****/
.download {padding:200px 0 200px;}
.download .l {float:left; width:40%;}
.download .l img {width:100%;}
.download .r {float:right; width:50%; padding:30px 0 0 0;}
.download .r h2 {font-size:44px; padding-left:5px;}
.download .r p {font-size:22px; margin-bottom:50px; line-height:2;}
.download .r img {display:block; width:40%;}




/***** contact *****/
.contact { padding:150px 0 200px; text-align:center; background:url("images/map.jpg") no-repeat scroll center center / 100% auto; background-size:cover;}
.contact .inner_section {}
.contact .title h2 {font-size:36px;}
.contact .text {font-size:22px; line-height:2; display:inline-block; width:auto; margin:auto; text-align:left; padding:60px 80px; color:#ffffff; background:#2864FF;}




/***** 版权 *****/
.copyright { padding:50px 0; text-align:center; background:#ffffff;}
.copyright .inner-copyright {}
.copyright .beian {}
.copyright .beian p { padding:4px 0; font-size:18px;}
.copyright .beian p a {padding:0 10px;}
.copyright .beian p span {opacity:0.5; font-size:14px;}
.copyright .beian a.vokodesign { padding:0 0 0 10px; text-decoration:underline; opacity:0.5;}
.copyright .beian a.vokodesign:hover {opacity:1;}