html { min-width: 1260px; }
h1 { font-size: 30px; line-height: 42px; color: #343434; font-weight: bold; }
h2 { font-size: 22px; line-height: 30px; color: #343434; font-weight: bold; }
h6 { font-size: 10px; line-height: 14px; font-weight: 200; color: #9A9A9A; }
/****** official website简写:ow ******/
.ow_ctn { padding: 120px 0; }

.box_shadow { box-shadow: 0 2px 9px rgba(2,0,36,0.2); }

.immediate_experience { position: fixed; cursor: pointer; top: 300px; right: 225px; z-index: 99; border: 0; border-radius: 1px; color: #fff; font-size: 18px; line-height: 21px; padding: 22px 14px; width: 45px; background: -webkit-linear-gradient(top,#6334FF 0,#02C5F8 100%); background: linear-gradient(top,#6334FF 0,#02C5F8 100%); box-shadow: 0 1px 5px rgba(2,3,16,0.35); }
.immediate_experience:before { content: '立即体验'; display: block; }

.header_nav { text-align: center; vertical-align: top; border-bottom: 1px solid rgba(255,255,255,0.3); position: fixed; top: 0; left: 0; right: 0; background: rgba(9,10,65,1); z-index: 10000; }
.header_nav > a { display: inline-block; color: #fff; font-size: 15px; line-height: 21px; padding: 22px 16px; cursor: pointer; vertical-align: top; }
.header_nav > a:first-child { padding: 0; margin: 16px 20px 0 0; }
.header_nav img { width: 95px; height: 32px; display: inline-block; }
.header_nav > a.active { color: #488BFF; border-bottom: 2px solid #488BFF; }

@media screen and (max-width: 1366px) {
.header nav > a:first-child { margin-right: 100px; }
}

.free_trial { background-image: url(/images/index/mfsy.jpg); background-repeat: no-repeat; background-size:cover; background-position: 50% 50%; padding: 90px 0; text-align: center; }
.ft_submit { border: 1px solid rgba(255,255,255,0.5); width: 500px; height: 55px; border-radius: 2px; overflow: hidden; }
.ft_submit input { border: 0; height: 100%; background-color: transparent; padding: 16px 20px; color: white; opacity: 0.5; font-size: 16px; line-height: 22px; }
/** 下面这些不能弄成一行**/
.ft_submit input::-webkit-input-placeholder { color: white; }
.ft_submit input:-moz-placeholder { color: white; }
.ft_submit input::-moz-placeholder { color: white; }
.ft_submit input:-ms-input-placeholder { color: white; }
.ft_submit button { border: 0; width: 190px; height: 100%; background-color: white; color: #383838; font-size: 16px; line-height: 22px; }

footer { padding: 60px 0 20px 0; background-color: #191C20; margin: auto; }
footer .hr { width: 1220px; height: 1px; background-color: rgba(151,151,151,0.2); margin: auto; }
footer > div { width: 1220px; margin: auto; }
footer p, footer span, footer a { font-size: 13px; line-height: 18px; color: #fff; opacity: 0.5; }
footer span, footer a { margin: 5px 5px; display: inline-block; }
.footer1 { min-height: 280px; margin-bottom: 40px; }
.footer1 img { width: 38px; height: 40px; }
.footer1 section { width: 240px; margin-left: 44px; }
.footer1 .hr { width: 1px; min-height: 280px; height: 100%; margin: 0; }

.footer2 { padding: 40px; }

.copyright { width: 100%; margin: 0px auto; color: #fff; padding: 45px 0; font-size: 13px; line-height: 18px; background-color: #15161A; text-align: center; }
.copyright p { opacity: 0.6; }
.copyright a { color: #fff; opacity: 0.9; margin-top: 10px; margin-bottom: 10px; display: inline-block; }
.copyright a:nth-of-type(1) { margin-right: 10px; }
.copyright a:hover { color: #fff; }



.cus_case { width: 1300px; margin: auto; }

.cus_case_ctn { margin-bottom: 48px; display: table; }

.cus_case_ctn > section { display: inline-block; width: 300px; border-radius: 2px; overflow: hidden; position: relative; margin: 12px; float: left; }
.cus_case_ctn > section:hover { box-shadow: 0 8px 16px rgba(0,0,0,0.15); }
.cus_case_ctn > section:hover > p { border-color: rgba(208,208,208,0.5); }
.cus_case_ctn > section:first-child { width: 625px; }
.cus_case_ctn > section:first-child img { height: 361px; }
.cus_case_ctn > section:first-child p { padding: 16px 15px; }

.cus_case_ctn img { width: 100%; height: 150px; display: block; }

.cus_case_ctn p { background-color: white; border: 1px solid rgba(208,208,208,0.5); padding: 12px 15px; text-align: left; font-size: 15px; line-height: 21px; color: #333336; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;height:47px; }

.cus_case button { background-color: transparent;border: 1px solid rgba(154,154,154,0.5); color: #333336; font-size: 12px; padding: 10px 0; width: 122px; }

/********分页效果********/
.pagination { display: inline-block; padding-left: 0; margin: 0 0; border-radius: 4px; }
.pagination > li { display: inline; }
.pagination > li:first-child > a, .pagination > li:first-child > span { margin-left: 0; }
.pagination > .disabled > a, .pagination > .disabled > a:focus, .pagination > .disabled > a:hover, .pagination > .disabled > span, .pagination > .disabled > span:focus, .pagination > .disabled > span:hover { color: #A5A5A5; cursor: not-allowed; background-color: #EFEFEF; border-color: #DEDEDE; }
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover { z-index: 3; color: #fff; cursor: default; background-color: #488BFF; border-color: #2D75F0; }
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover { z-index: 2; color: #fff; background-color: #488BFF; border-color: #2D75F0; }
.pagination > li { position: relative; float: left; padding: 6px 10px; margin: 0 5px; color: #A5A5A5; text-decoration: none; background-color: #EFEFEF; border-color: #DEDEDE; font-size: 12px; line-height: 13px; border-radius: 2px; }
.pagination > li > a, .pagination > li > span{color: #A5A5A5; text-decoration: none;}
.pagination > li > a > span { font-size: 12px; line-height: 13px; }

.cus_recommend_case { background-color: #F5F5F6; text-align: center; }
.cus_recommend_case section { width: 408px; height: 500px; display: inline-block; position: relative; overflow: hidden; }
.cus_recommend_case section img { display: inline-block; width: 100%; height: 100%; }
.cus_recommend_case button { background-color: transparent; border: 1px solid #343434; font-size: 14px; line-height: 20px; padding: 9px 0; width: 122px; cursor: pointer; }

.cus_recommend_case section .mask { top: 500px; left: 0; right: 0; bottom: 0; position: absolute; background: rgba(39,105,227,0.3); text-align: center; padding: 0 40px; }
.cus_recommend_case section h3 { font-size: 22px; line-height: 30px; color: white; position: absolute; top: 198px; left: 0; right: 0; z-index: 8;font-weight:200; }
.cus_recommend_case section h3:before { content: ''; display: block; margin: auto; width: 44px; height: 6px; background: #2769E3; border-radius: 50px; margin-bottom: 30px; }
.cus_recommend_case section .mask p { font-size: 16px; line-height: 26px; color: white; opacity: 0.8; margin-top: 225px; margin-bottom: 20px;font-weight:200; }
.cus_recommend_case section .mask button { color: white; border-color: white; cursor: pointer; }

/********动画效果********/
.cus_recommend_case section:hover .mask { animation: anmt_case_mask 0.8s; animation-fill-mode: forwards; -moz-animation: anmt_case_mask 0.8s; -moz-animation-fill-mode: forwards; -webkit-animation: anmt_case_mask 0.8s; -webkit-animation-fill-mode: forwards; -o-animation: anmt_case_mask 0.8s; -o-animation-fill-mode: forwards; }
.cus_recommend_case section:hover h3 { animation: anmt_case_h3 0.8s; animation-fill-mode: forwards; -moz-animation: anmt_case_h3 0.8s; -moz-animation-fill-mode: forwards; -webkit-animation: anmt_case_h3 0.8s; -webkit-animation-fill-mode: forwards; -o-animation: anmt_case_h3 0.8s; -o-animation-fill-mode: forwards; }



@keyframes anmt_case_mask {
from { top: 500px; }
to { top: 0; }
}

@-moz-keyframes anmt_case_mask {
from { top: 500px; }
to { top: 0; }
}

@-webkit-keyframes anmt_case_mask {
from { top: 500px; }
to { top: 0; }
}

/*@-o-keyframes anmt_case_mask {
 from { top: 500px; }
to { top: 0; }
}*/

@keyframes anmt_case_h3 {
from { top: 198px; }
to { top: 112px; }
}

@-moz-keyframes anmt_case_h3 {
from { top: 198px; }
to { top: 112px; }
}

@-webkit-keyframes anmt_case_h3 {
from { top: 198px; }
to { top: 112px; }
}