body{
    margin: 0;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 13px;
    line-height: 20px;
    color: #656565;
    background-color: #15a1b2;
    position: relative;
}
header{
    padding: 0;
    border: none;
    /*border-top: 7px solid #323249;*/
    background: none;
    z-index: 7777777;
}
.holder{
    width: 1258px;
    height: auto;
    background: #fff;
    margin: auto;
    padding-bottom: 70px;
    position: relative;
    /*border-bottom: 7px solid #323249;*/
    z-index: 2;
}
.logo{
    margin-right: 29px;
    margin-left: 50px;
}
.data{
    width: 960px;
    height:180px;
    margin-right: 48px;
    z-index: 3;
}
.tag_line{
    width: 100%;
    height:82px;
}
.english{
    font-size: 14px;
    color: #0d2c4b;
    margin-top: 45px;
}

.search-form_it {
    padding: 5px 32px 3px 8px;
    width: 129px;
    text-transform: uppercase;
    border: none;
    font-size: 13px;
}
.navbar-form{
    position: absolute;
    right:48px;
    top:40px;
}
.search_box{
    width: 188.63px;
    height:27px;
    border: 1px solid #e7e7e7;
}
.add_shadow{
    box-shadow: 0px 0px 3px #15a1b2;
}

.sf-menu {
    margin: -32px 0 0 0px;
    white-space: nowrap;
    line-height: 1.0;
    float: right;
}
.nav_ul{
    width: 970px;
    height:34px;
    margin-top: 20px;
    position: relative;
    z-index: 202!important;
}
.nav_ul>li{
    width: 170px;
    height: 34px;
    line-height: 34px;
    color: #b3b3b3;
    margin-right: 20px;
    border-bottom: 1px solid #ddd;
    float: left;
    cursor: pointer;
    position: relative;

}
.nav_ul a{
    position: relative;
    z-index: 1000000;
}
.nav_ul>li:hover{
    transition: 0.4s ease all;
    border-color: #15a1b2;
    background: none;
    color: #313149;
}
 .add_border{
     border-color: #15a1b2 !important;
     background: none;
     color: #313149 !important;
 }
 .sub-menu{
     width: 100%;
     height: auto;
     border-top: 1px solid #323249;
     background: #f8f8f4;
     -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.1);
     -moz-box-shadow: 0 0 2px rgba(0,0,0,0.1);
     box-shadow: 0 0 2px rgba(0,0,0,0.1);
     margin-top: 1px;
     z-index: 20;

 }
 .sub-menu li{
     font-size: 11px;
     color: #313149;
     width: 100%;
     height:34px;
     background: url("../images/submenu-border.gif") repeat-x;
     border-bottom: 1px solid #ddd;
     text-indent: 1em;
     font-weight: bold;
 }
 .sub-menu li:hover{
     transition: 0.5s ease all;
     color: #52b1bb;
 }
 .sub-menu a{
     display: block;
     width: 100%;
     height:100%;
 }

.swiper-container {
    width: 971px;
    height: auto;
    margin-left: 240px !important;
    margin-top: 50px;
    margin-bottom: 30px;
}

.swiper-container2{
    width: 971px;
    height: auto;
    margin-left: 76px!important;
    margin-top: -30px;
}
.swiper-container2 .swiper-slide{
    height: auto;
    display: none;
}



.camera_caption{margin-left: 240px;}
.camera_caption .h2{
    margin: 0;
    color: #1e1d1d;
    text-transform: uppercase;
    font-size: 24px;
    line-height: 1;
    width: 85%;
    letter-spacing: 0;
}



.camera_caption p {
    padding: 15px 0 0;
    background: none;
    color: #9d9d9d;
    float: left;
    width: 85%;
}

.es_ea{
    width: 970px;
    height:210px;
    border-top: 2px solid #f5f4ee;
    border-bottom: 2px solid #f5f4ee;
    margin-left: 240px;
    margin-top: 50px;
    position: relative;
    overflow: hidden;
}

.es-nav{
    width: 61px;
    height:126px;
    background: url("../images/carousel-item-tail.gif") repeat;
    padding: 5px;
    position: absolute;
    right:0;
    top:40px;
}
.es-nav div{
    width: 61px;
    height:63px;
    background: #f8f8f4;
    text-align: center;
    line-height: 63px;
    cursor: pointer;

}
.es-nav div:hover{
    color: #fff;
    background: #2f2f46;
}
.es-nav-prev{
    margin-bottom: 2px;
}
.ea_box{
    width: 864px;
    height:136px;
    margin-top: 45px;
    overflow: hidden;
    position: relative;
}
.ea_box ul{
    width: 12000px;
    height:136px;
    position: absolute;
    left:0;
    top:0;
}
.ea_box ul li{
    float: left;
    background: url("../images/carousel-item-tail.gif") repeat;
    width: 248px;
    height:116px;
    margin-right:30px;
    padding: 5px;
}
.es_cot{
    width: 248px;
    height: 116px;
    background: #f8f8f4;
}
.ico{
margin-top: 26px;
    margin-left: 25px;
}
.desc{
    width: 140px;
    margin-left: 8px;
    margin-top: 26px;
}
.desc_tit{
    font: bold 14px/20px Arial, Helvetica, sans-serif;
    font-family: 'Cinzel',serif;
    width: 157px;
    font-size: 18px;
    color:#52b1bb;
    text-transform: uppercase;
    letter-spacing:2px;
    line-height: 1.2;
    font-weight: normal;
    text-transform: uppercase;
    pointer-events: none;
}
.read{
    color: #b3b3b3;
    font-size: 12px;
    margin-top: 15px;
}
.read a{
    margin-left:5px;
}
.read a:hover{
    transition: 0.4s ease all;
    color:#52b1bb;
    text-decoration: underline ;
}
.see_more{
    position: absolute;
    right: 5px;
    bottom: 5px;
    color: #b3b3b3;
    font-size: 12px;}
.see_more:hover{
    color: #52b1bb;
}
.row{
    width: 970px;
    height:425px;
    margin-left: 240px;
    margin-top: 78px;
}
.expret{
    width: 30%;
    height: auto;

}
.expret_cont{
    position: relative;
    margin-top: 15px;
}
.expret_cont img{
    position: absolute;
    left:-3px;
    top:0;

}
.expret_cont a{
    width: 275px;
    color: #656565;
    display: inline-block;
    padding: 0;
    margin-left: 25px;

    　　webkit-line-clamp:4;

    　　display: -webkit-box;

    　　-webkit-box-orient:vertical;

    　　text-overflow:ellipsis;

    　　overflow:hidden;
}
.expret_cont a:hover{
    color: #52b1bb;
}
.zj_box{
    height: 400px;
    border-bottom:1px solid #f5f5f1;
    position: relative;
}
.span3{
    width: 275px !important;
    float: left;
}
.zj_box h2{
    font: normal 23px/36px Cinzel;
    color: #656565;
    text-transform:uppercase;
}
.styled{
    margin-top: 15px;
}
.styled li{
    background: url("../images/arrow-icon.gif") no-repeat;
    margin-right: 5px;
    font-size: 10px;
    height: 30px;
    background-position: 0px 6px;
    text-transform:uppercase;
}
.styled li a{
    margin-left: 12px;
    color: #52b1bb;
text-decoration: underline;
}
.comera{
    display: block;
    margin:130px auto;
}
footer{
    width: 1250px;
    height: 30px;
    margin:30px auto;
}
footer ul li{
float: left;
    margin-right: 20px;
}
.top{
    cursor: pointer;
    position: fixed;
    right:50px;
    bottom: 50px;
    width: 50px;
    height: 50px;
    background:url("../images/up-arrow.png") #52b1bb no-repeat center;
}
.bottom{
    position: absolute;
    right:5px;
    top:10px;
}
.title-section{
    width: 92%;
   height: auto;
    margin: auto;
    margin-top: 20px;
}
.title-header{
    font-size: 26px!important;
    font: normal 30px/30px Cinzel;
    color: #1e1d1d;
    text-rendering: optimizelegibility;
    text-transform:Uppercase;
}
.breadcrumb{
    width: 100%;
    height:40px;
    margin-top: 15px;
    background: #f8f8f4;
    border: 1px solid #fdfdfd;
    -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 0 2px rgba(0,0,0,0.1);
    box-shadow: 0 0 2px rgba(0,0,0,0.1);
    line-height: 40px;
}
.breadcrumb li{
    float: left;
}
.divider{
    color: #52b1bb;
    margin-left: 15px;
    line-height: 40px;
    margin-right: 5px;
}
.divider a{
    font-size: 16px;
}
/*.active{
    margin-left: 5px;
}*/
.ccsp_box {
    width: 92%;
    height: auto;
    padding-bottom: 120px;
    margin: auto;
    margin-top: 20px;
}
.ccsp_left{
    width: 60%;
    height:auto;
}
.ccsp_left h2{
    font: normal 24px/36px Cinzel !important;
    color: #1e1d1d;
    margin: 20px 0 25px;
    text-transform: uppercase;
    text-rendering: optimizelegibility;
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}
.ccsp_right {
    width: 30%;
    height: auto;
    margin-top: 15px;
}
.ccsp_right h2{
    font: normal 24px/36px Cinzel !important;
    color: #1e1d1d;
    text-transform: uppercase;
    text-rendering: optimizelegibility;
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    padding: 0;
    margin: auto;
    margin-bottom: 15px;
}
.ccss_vn{
    margin-top: 15px;
}
.ccss_vn h5{
    font: bold 14px/20px Arial, Helvetica, sans-serif;
    color: #656565;
}
.css_cot{
    width: 100%;
    margin-top: 15px;
    background:url("../images/quotes-small.png") no-repeat;
    background-size: 15px;
    padding-left:20px;
    margin-left: -18px;
}
.css_cot:hover{
    color: #52b1bb;
    cursor: pointer;
}


.video_left{
    width: 50%;
    height: auto;
}
.video_right{
    width: 35%;
}
.videos{
    width: 673px;
    height:322px;
    border: 6px solid #dddddd;
    margin-top: 60px;
}
.name_pro{
    font: normal 24px/36px Cinzel !important;
    color: #1e1d1d;
    margin: 20px 0 25px;
    text-transform: uppercase;
    text-rendering: optimizelegibility;
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    width: 100%;
    height:60px;
    margin-top: 60px;
    line-height: 60px;
    border-top:1px solid #eaeaea;
    border-bottom:1px solid #eaeaea;
}
.name_pro pre{
    line-height: 60px;
    color: #212121;
}
.acticle{
    margin-top: 25px;
}
.domec{
    width: 90%;
    margin: auto;
    margin-top: 30px;
}
.domec_title{
    font: normal 24px/36px Cinzel !important;
    color: #1e1d1d;
    margin: 20px 0 25px;
    text-transform: uppercase;
    text-rendering: optimizelegibility;
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}
.download{
    margin-top: 30px;
    font-size: 17px;
    font-weight: bold;
}
.lod li{
    margin-top:30px;
}
.lod a{
    margin-left: 10px;
}
.lod a:hover{
    color: #52b1bb;
}

.cate{
    width: auto;
    height:32px;
    margin-right: 25px;
}
.cate dt{
    float: left;
    font-weight: bold;
    margin-right:15px;
    height: 100%;
    line-height: 32px;
}
.cate dd{
    float: left;
    margin-top: 2px;
    margin-bottom: 2px;
    height: 100%;
    width: auto;
    line-height: 32px;
    margin-right: 15px;
    padding-left: 6px;
    padding-right: 6px;
    cursor: pointer;
    color: rgb(82,163,187);
}
.cate dd:hover{
    background: #f7f8f3;
}
.add_bg{
    color: rgb(255, 255, 255)!important;
    background-color: rgb(82, 163, 187)!important;
    background-image: linear-gradient(rgb(82, 177, 187), rgb(82, 142, 187));
    background-repeat: repeat-x;
}
.portfolio-grid{
    width: 110%;
    height: auto;
    margin-top: 20px;
    display: none!important;;
}

.portfolio-grid2{
    width: 110%;
    height: auto;
    margin-top: 20px;
    display: none;
}
.portfolio-grid2 h3{
    color: #51b2b9;
    line-height: 25px;
    margin-top: 10px;
    font-size: 22px;
}

.portfolio-grid li{
    width: 369px;
    height: 370px;
    float: left;
    margin-right: 28px;
    animation:myfirst2 0.8s;
    -moz-animation:myfirst2 0.8s;
    -webkit-animation:myfirst2 0.8s;
    -o-animation:myfirst2 0.8s;
    transition-property: transform,opacity;
    position: relative;
}

.portfolio-grid2 li{
    width: 369px;
    height: 370px;
    float: left;
    margin-right: 28px;
    animation:myfirst1 0.8s;
    -moz-animation:myfirst1 0.8s;
    -webkit-animation:myfirst1 0.8s;
    -o-animation:myfirst1 0.8s;
    transition-property: transform,opacity;
    position: relative;
    margin-bottom: 20px;
}
.portfolio-grid h3{
    color: #52b1bb;
    text-decoration: none;
    font-size: 23px;
    margin-top: 8px;
    margin-left: 4px;
    font-weight: normal;
    text-transform : uppercase;

}
.portfolio-grid h3{
    text-transform : uppercase;
    font-weight: normal;
}
.portfolio-grid h3 a pre{
    text-transform : uppercase;
    text-transform : uppercase
}
.portfolio-grid h3:hover{
    text-decoration: underline;
}
.ico_img{
    width: 100%;
    height: 238px;
    position: relative;
}
/*.portfolio-grid li:nth-child(1)*/
/*{*/
    /*animation:myfirst 1.5s;*/
    /*-moz-animation:myfirst 1.5s;*/
    /*-webkit-animation:myfirst 1.5s;*/
    /*-o-animation:myfirst 1.5s;*/
/*}*/
/*.portfolio-grid li:nth-child(2)*/
/*{*/
    /*background: #000;*/
    /*animation:myfirst2 2s;*/
    /*-moz-animation:myfirst2 2s;*/
    /*-webkit-animation:myfirst2 2s;*/
    /*-o-animation:myfirst2 2s;*/
    /*transition-property: transform,opacity;}*/
@keyframes myfirst1
{
    from {    transform: translate3d(0px, 0px, 0px) scale3d(0, 0, 0);opacity: 0;}
    to {    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1);opacity: 1;}
}
@keyframes myfirst2
{
    from {    transform: translate3d(-184px, 0px, 92px) scale3d(0, 0, 0);}
    to {    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1);}
}
@keyframes myfirst3
{
    from {    transform: translate3d(-184px, 0px, 92px) scale3d(0, 0, 0);}
    to {    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1);}
}
.ico_bg{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    background: rgba(0,0,0,0.4);
    opacity: 0;
    cursor: pointer;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
}
.ico_bg:hover{
    opacity: 1;
}
.ico_bg img{
    position: absolute;
    left:45%;
    top:45%;
}
.except{
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    display: -webkit-box; /** 将对象作为伸缩盒子模型显示 **/
    -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
    -webkit-line-clamp: 2; /** 显示的行数 **/
    overflow: hidden;
    text-overflow: ellipsis;
    /** 隐藏超出的内容 **/
}
.pex_btn{
    display: block;
    margin-top: 5px;
    width: 90px;
    height:30px;
    color: rgb(255, 255, 255)!important;
    background-color: rgb(82, 163, 187)!important;
    background-image: linear-gradient(rgb(82, 177, 187), rgb(82, 142, 187));
    background-repeat: repeat-x;
    text-align: center;
    line-height: 30px;
    margin-left: 10px;
}
.pex_btn:hover{
    background: #fff;
}
.pages{

    height: 30px;
    margin: auto;
    margin-top: 30px;
    margin-left: 300px;
}
.pages li{
    height:30px;
    color: #15a1b2;
    background: #ebebeb  ;
    float: left;
    text-align: center;
    line-height: 30px;
    cursor: pointer;
    padding: 0 10px;

}

.page dd{
    float: left;
}

.ex_list{
    width: 100%;
    height:209px;
    padding-bottom: 5px;
    border-bottom: 1px solid #eaeaea;
    margin-top: 29px;
}
.ex_list ul{
    margin-bottom: 25px;
}
.dt_under{
    display: block;
    width: 250px;
    height: 100%;
    margin-right: 16px;
}
.dt_under img{
    width: 100%;
    height: 100%;
}
.gren{width: 250px !important;height: 200px!important;}
.add_see{position: absolute;left: 10px;bottom: -30px; color: #b3b3b3;}
.add_see a{
    margin-left: 5px;
    color: #b3b3b3;
    font-size: 12px;
}
.add_see a:hover{
    transition: 0.4s ease all;
    color: #15a1b2;
}
.wenzhang{
    text-overflow: ellipsis;
    display: -webkit-box; /** 将对象作为伸缩盒子模型显示 **/
    -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
    -webkit-line-clamp: 6; /** 显示的行数 **/
    overflow: hidden;  /** 隐藏超出的内容 **/
}