﻿@charset "utf-8";



.lens-1{

    width: 1204px;

    height: 487px;

    background: url(../images/lens-1.png) no-repeat top center;

    margin-top: 60px;

}

.lens-9{

    width: 1204px;

    height: 487px;

    background: url(../images/lens-9.png) no-repeat top center;

    margin-top: 60px;

}



.lens-1-con{

    width: 570px;

    padding: 40px 0 0 40px;

    color: #fff;

}

.lens-1-tit{

    font-family: '004ttf';

    font-size: 70px;

}

.lens-1-text{

    font-family: '003ttf';

    font-size: 30px;

    line-height: 38px;

    margin-top: 20px;

}



.lens-2{

    margin-top: 45px;

    height: 389px;

    overflow: hidden;

}



.lens-2-l{

    width: 692px;

    height: 389px;

    background: #a5a5a5;

}

.lens-2-con{

    width: 600px;

    padding: 30px 40px;

    color: #fff;

}

.lens-2-con .lens-1-text p{

    position: relative;

    padding-left: 30px;

    line-height: 44px;

}

.lens-2-con .lens-1-text p span{

    position: absolute;

    left: 0;

    top: 4px;

    font-size: 14px;

    line-height: 38px;

}



.lens-2-r{

    width: 498px;

    height: 389px;

}

.lens-2-r img{

    display: block;

    width: 100%;

    height: 100%;

}



.lens-3{

    margin-top: 70px;

    height: 401px;

    overflow: hidden;

}

.lens-3-l{

    width: 446px;

}

.lens-3-con{

    width: 373px;

    padding: 0 40px;

    color: #000;

}



.lens-3-r{

    width: 713px;

    height: 401px;

}

.lens-3-r img{

    display: block;

    width: 100%;

    height: 100%;

}





.lens-4{

    margin-top: 20px;

    height: 389px;

    overflow: hidden;

}

.lens-4-l{

    width: 692px;

    height: 389px;

    background: #a5a5a5;

}

.lens-4-con{

    width: 590px;

    padding: 30px 40px;

    color: #fff;

}



.lens-2-r{

    width: 498px;

    height: 389px;

}

.lens-2-r img{

    display: block;

    width: 100%;

    height: 100%;

}



.lens-5{

    margin-top: 50px;

}

.lens-5-l{

    width: 692px;

}

.lens-5-con{

    width: 590px;

    padding: 0 40px;

    color: #000;

}



.lens-5-r{

    width: 498px;

}

.lens-5-r img{

    display: block;

    width: 100%;

    height: 100%;

}

.brief-0{

    margin-top: 30px;

    position: relative;

}



.brief-1{

    padding: 50px;

    line-height: 24px;

    color: #fff;

    background: #ca9300 !important;

    width: 370px;

    height: 460px;

    z-index: 99;

    position: absolute;

    top: 70px;

    left: 0px;

}

.brief-1 h3{

    line-height: 30px;

    font-size: 22px;

    margin-bottom: 15px;

}

.brief-1 p{

    padding-bottom: 15px;

}

.brief-2 {

   z-index: 1;

   padding-left:376px; 

}

.brief-3{

    margin-top: 70px;

    position: relative;

}



.brief-4{

    padding: 50px;

    line-height: 24px;

    color: #fff;

    background: #063f75 !important;

    width: 370px;

    height: 490px;

    z-index: 99;

    position: absolute;

    top: 40px;

    right: 0px;

}

.brief-4 h3{

    line-height: 30px;

    font-size: 22px;

    margin-bottom: 15px;

}



td {

    border: 0px !important;

	text-align: center;

}



tr.row1, tr.row2 {

    border-bottom: 1px solid #bdc7d1;

}



td.col1a, td.col2a, td.col3a {

    border-right: 1px solid #bdc7d1 !important;

}



td.col1a {

    /* padding: 20px 0px 30px !important; */

}



td.col2a {

        padding: 40px 0px 30px !important;

}



td.col3a {

    padding: 40px 0px 20px !important;

}



.brief-4 .number{

   color: #ca9300 !important;

   font-weight: 400;

   font-size: 40px;

}

.brief-4 p{

    padding-bottom: 15px;

}

.brief-5 {

   z-index: 1;

}



.bounceInLeft {

    -webkit-animation-name: bounceInLeft;

    animation-name: bounceInLeft;

  }

  

  @-webkit-keyframes bounceInRight {

    from,

    60%,

    75%,

    90%,

    to {

      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    }

  

    from {

      opacity: 0;

      -webkit-transform: translate3d(3000px, 0, 0);

      transform: translate3d(3000px, 0, 0);

    }

  

    60% {

      opacity: 1;

      -webkit-transform: translate3d(-25px, 0, 0);

      transform: translate3d(-25px, 0, 0);

    }

  

    75% {

      -webkit-transform: translate3d(10px, 0, 0);

      transform: translate3d(10px, 0, 0);

    }

  

    90% {

      -webkit-transform: translate3d(-5px, 0, 0);

      transform: translate3d(-5px, 0, 0);

    }

  

    to {

      -webkit-transform: translate3d(0, 0, 0);

      transform: translate3d(0, 0, 0);

    }

  }

  

  @keyframes bounceInRight {

    from,

    60%,

    75%,

    90%,

    to {

      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    }

  

    from {

      opacity: 0;

      -webkit-transform: translate3d(3000px, 0, 0);

      transform: translate3d(3000px, 0, 0);

    }

  

    60% {

      opacity: 1;

      -webkit-transform: translate3d(-25px, 0, 0);

      transform: translate3d(-25px, 0, 0);

    }

  

    75% {

      -webkit-transform: translate3d(10px, 0, 0);

      transform: translate3d(10px, 0, 0);

    }

  

    90% {

      -webkit-transform: translate3d(-5px, 0, 0);

      transform: translate3d(-5px, 0, 0);

    }

  

    to {

      -webkit-transform: translate3d(0, 0, 0);

      transform: translate3d(0, 0, 0);

    }

  }

  

  .bounceInRight {

    -webkit-animation-name: bounceInRight;

    animation-name: bounceInRight;

  }

  