*,ul{margin:0;padding:0;}
body{
    min-width:1200px;
}
.delay-1 {
    animation-delay: .2s;
}
.delay-2 {
    animation-delay: .4s;
}
.delay-3 {
    animation-delay: .6s;
}
.delay-4 {
    animation-delay: .8s;
}
.delay-5 {
    animation-delay: 1s;
}
.delay-6 {
    animation-delay: 1.2s;
}
.delay-7 {
    animation-delay: 1.4s;
}
.delay-8 {
    animation-delay: 1.6s;
}
.delay-9 {
    animation-delay: 1.8s;
}
.delay-0 {
    animation-delay: 2s;
}
.delay-11 {
    animation-delay: 2.2s;
}

.wrapbox{
    background-color:#fff;
}
.titimg{
    width:31.77%;
    margin-top:3%;
    margin-bottom:2%;
}
.bannerbg{
    position:relative;
    background:url(/wp-content/uploads/pageimg/dragonaug/2bg.png) no-repeat center center;
    background-size:100% 100%;
}
.onebox{
    width:54.9%;
    position:absolute;
    top:0;
    right:7.3%;
}
.onebox .imgbox{
    width:65.8%;
    margin:0 auto;
    padding:1.5% 0;
}
.bannerbg .imgbox.left{
    width:38%;
    padding:2.35% 0;
    padding-left:3%;
}
.bannerbg .textbox{
    text-align:center;
    font-size:18px;
    color:#222;
    line-height:3.8vw;
    padding-right:1.2%;
    text-align:right;
    color:#fff;
}

/*  */
.zhineng{
    position:relative;
}
.zhineng .znbg{
    position:relative;
}
.zhineng .pingban{
    width:16.927%;
    position:absolute;
    right:19.27%;
    top:16.15%;
}
.zhineng .znmain{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
}
.zhineng .znmain li{
    position:absolute;
    display:inline-block;
    width:22px;
    height:22px;
}
.zhineng .znmain i{
    width:20px;
    height:20px;
    display:block;
    border-radius:50%;
    border:2px solid #fff;
    background:rgba(0,0,0,0.6);

    animation:scalea 2s infinite;
    -webkit-animation:scalea 2s infinite;
}

@-webkit-keyframes scalea {
    0%, 50%, 100% {transform:scale(1);}
    25%, 75% {transform:scale(1.3);}
}
@-moz-keyframes scalea {
    0%, 50%, 100% {transform:scale(1);}
    25%, 75% {transform:scale(1.3);}
}
@-o-keyframes scalea {
    0%, 50%, 100% {transform:scale(1);}
    25%, 75% {transform:scale(1.3);}
}
@keyframes scalea {
    0%, 50%, 100% {transform:scale(1);}
    25%, 75% {transform:scale(1.3);}
}
.zhineng .znmain span{
    width:156px;
    display:block;
    line-height:32px;
    height:34px;
    text-align:center;
    border-radius:16px;
    font-size:16px;
    border:1px solid #706b65;
    background:rgba(0,0,0,0.4);
    color:#fff;
    position:absolute;
    top:-6px;
    left:29px;
}
.zhineng .znmain li.left span{
    left:auto;
    right:29px;
}
.zhineng .znmain li.w102 span{
    width:102px;
}
.zhineng .znmain li.w98 span{
    width:98px;
}
.zhineng .znmain li.w169 span{
    width:169px;
}
.zhineng .znmain .li1{
    left:10.9375%;
    top:57.5%;
}
.zhineng .znmain .li2{
    left:35.46875%;
    top:85.463%;
}
.zhineng .znmain .li3{
    left:22.29%;
    top:64.856%;
}
.zhineng .znmain .li4{
    left:40.46875%;
    top:20.607%;
}
.zhineng .znmain .li5{
    left:58.854%;
    top:48.88%;
}
.zhineng .znmain .li6{
    left:53.49%;
    top:92.49%;
}
.zhineng .znmain .li7{
    left:64.9%;
    top:32.59%;
}
.zhineng .znmain .li8{
    left:68.8%;
    top:66.29%;
}
.zhineng .znmain .li9{
    left:85.677%;
    top:44%;
}
.zhineng .znmain .li10{
    left:50.26%;
    top:76.3578%;
}

/*  */
.yhbox{
    width:63.54%;
    margin:0 auto;
    padding-top:3.64vw;
    padding-bottom:2.6vw;
}
.yhbox li{
    float:left;
    width:25%;
    padding:0 1.2%;
}
.leftimgbox{
    width:21.22%;
    position:absolute;
    left:0;
    top:0;
    z-index:99;
}
.yhimgbox{
    width:70.5%;
    margin-left:23%;
}
.yhimgbox .yhimgmain{
    padding:2% 0;
}
.yhimgbox .yhimgleft{
    float:left;
    width:56.54%;
}
.yhimgbox .yhimgright{
    float:right;
    width:41.7%;
}
.bannerbg .titimg{
    margin-left:21.6%;
    margin-top:2.5%;
    width:56.8%;
}
.djbmleft{
    width:57.5%;
    float:left;
    padding-left:10%;
    padding-top:3.125vw;
    padding-right:5.1%;
}
.djbmleft .djbmimg{
    position:absolute;
}
.djbmleft .djbmimg1{
    left:5.2%;
    top:15.6vw;
    width:87%;
}
.djbmleft .djbmimg2{
    left:42.57%;
    top:17.7vw;
    width:21%;
}
.djbmleft li{
    width:2.35vw;
    height:2.35vw;
    position:absolute;
}
.djbmleft p{
    width:100%;
    width:10vw;
    padding:0.8vw 0;
    margin:0;
    text-align:center;
    line-height:1.1vw;
    font-size:0.78vw;
    text-align:left;
    position:absolute;
    left:0;
    top:100%;
    color:#000;
}
.djbmleft p strong{
    display:block;
    color:#414c2c;
    font-weight:bold;
}
.djbmleft li.djbmli1{
    left:23.9%;
    top:10vw;
}
.djbmleft li.djbmli2{
    left:40.67%;
    top:11.45vw;
}
.djbmleft li.djbmli3{
    left:57.06%;
    top:10.41vw;
}
.djbmleft li.djbmli4{
    left:75%;
    top:8.07vw;
}
.djbmleft li.djbmli5{
    left:84.6%;
    top:17vw;
}
.djbmleft li.djbmli2 p{
    top:-4.9vw;
    left:-30%;
}
.djbmleft li.djbmli3 p{
    top:-4.9vw;
    left:-47%;
}
.djbmleft li.djbmli4 p{
    left:-47%;
}
.djbmleft li.djbmli5 p{
    left:-170%;
    top:1vw;
}
.djbmleft li:hover p{
    transition:all 0.3s;
    transform:scale(1.1);
}
.djbmleft li:hover a img{
    transition:all 0.5s;
    transform:rotate(270deg);
}
.djbmbox{
    width:32.6%;
    float:left;
    padding-top:3.38vw;
}
.djbmwrap .djbmbox .p3{
    color:#333335;
    line-height:40px;
    /*font-size:24px;*/
    font-size:1.25vw;
}
.djbmwrap .djbmbox .p3 span{
    font-weight:bold;
    color:#c20c23;
    /*font-size:34px;*/
    font-size:1.77vw;
}
.djbmbox .form_innerp{
    width:100%;
    margin:0;
}
.djbmbox .form_innerp .srkbox{
    width:100%;
    clear:both;
    overflow:hidden;
    zoom:1;
}
.djbmbox .form_innerp a{
    color:#fff;
    text-align:center;
    display:block;
    border-radius:5px;
    line-height:3.49vw;
    font-size:1.5vw;
    background:#456f6e;
    margin-top:1.5vw;
}
.djbmbox input{
    background:#fff;
    float:left;
    width:100%;
    height:3.49vw;
    line-height:3.49vw;
    padding:0 10px;
    margin-bottom:0.625vw;
    margin-right:0;
    border-radius:3px;
    border:1px solid #767676;
}

.textp{
    width:67.4%;
    margin:0 auto;
    padding:30px 0;
    background:url(/wp-content/uploads/pageimg/rabbitaug/dian_w.png) repeat-x center center;
}
.textp p{
    width:270px;
    background:#eaf3ee;
    line-height:40px;
    margin:0 auto;
    text-align:center;
    font-size:22px;
    color:#323433;
}
.textp p span{
    color:#b3262c;
    font-size:30px;
    font-weight:bold;
}
.biaoti{
    width:100%;
    color:#4d4d4d;
}
.biaoti i{
    display:inline-block;
    width:10px;
    height:10px;
    margin:0 35px;
    vertical-align:middle;
    background:#4d4d4d;
}
.biaoti h2{
    width:100%;
    font-size:60px;
    line-height:80px;
    text-align:center;
    font-weight:bold;
}
.biaoti p{
    width:100%;
    font-size:30px;
    line-height:64px;
    text-align:center;
}

/*  */
.graybg{
    width:100%;
    background:url(/wp-content/uploads/pageimg/dragonapril/bg2.png) no-repeat center center;
    background-size:100% 100%;
    padding-top:2.6vw;
}
.designerbox{
    width:53.125%;
    margin:0 auto;
    padding-top:2vw;
    padding-bottom:2vw;
}
.designerbox .listbox li{
    width:33.33%;
    float:left;
    padding:0 3%;
}
.twobox{
    /*width:72%;*/
    margin:0 auto;
    padding-top:1.8vw;
    padding-bottom:2.6vw;
}
.twobox .listbox{
    width:86.6%;
    margin:0 auto;
    padding:5% 0;
}
.twobox .listbox li{
    width:25%;
    float:left;
    padding:0 2%;
}

.caseswiperbox{
    width:63%;
    float:left;
    position:relative;
}
.swiperbtn{
    width:30%;
    float:left;
    position:relative;
    display:block;
    padding-left:5%;
    padding-top:4.5vw;
}
.swiperbtn span{
    display:block;
    opacity:1;
    width:100%;
    height:8.8vw;
    background:none;
    background-color:transparent;
    border-radius:0;
    position:relative;
}
.swiperbtn span:before{
    content:"";
    display:block;
    width:19.5%;
    border:dashed 1px #ddd;
    position:absolute;
    top:2vw;
    left:-19.5%;
}
.swiperbtn span img{
    transition:all 0.3s;
    width:100%;
    filter:saturate(0%) brightness(2) ;
}
.swiperbtn .swiper-pagination-bullet-active img{
    filter: brightness(1);
}
/*.caseswiperbox .caseonebtn .swiper-pagination-bullet-active:before{
    background:transparent;
}
.caseswiperbox .caseonebtn span:nth-child(2),.caseswiperbox .caseonebtn span.cur2{
    background-image:url(/wp-content/uploads/pageimg/rabbitmay/case2.jpg);
}
.caseswiperbox .caseonebtn span:nth-child(3),.caseswiperbox .caseonebtn span.cur3{
    background-image:url(/wp-content/uploads/pageimg/rabbitmay/case3.jpg);
}
.caseswiperbox .caseonebtn span:nth-child(4),.caseswiperbox .caseonebtn span.cur4{
    background-image:url(/wp-content/uploads/pageimg/rabbitmay/case4.jpg);
}*/
.caseone{
    width:100%;
}
.caseone .swiper-slide a{
    position:relative;
    display:block;
    width:100%;
    height:100%;
}
.caseone .swiper-slide a img{
    width:100%;
}
.caseone .swiper-slide p{
    color:#333;
    line-height:200%;
    text-align:right;
}

.buzhoubox{
    background:#456f6e;
    padding-bottom:1.5625vw;
}
.buzhoubox .buzhoumain p{
    font-size:1.46vw;
    color:#fff;
    clear:both;
    text-align:center;
    height:5.1vw;
    line-height:5.1vw;
}
.buzhoubox .buzhoubm{
    width:71.5%;
    margin:0 auto;
}
.buzhoubox .buzhoubm .sub_m{
    width:79%;
    float:left;
}
.buzhoubox .buzhoubm .sub_m input{
    width:24.8%;
    float:left;
    height:68px;
    line-height:68px;
    border-radius:3px;
    border:1px solid #cbcbcb;
    background-color:#fff;
    padding:0 15px;
    font-size:20px;
}
.buzhoubox .buzhoubm a{
    display:block;
    width:20.2%;
    float:right;
    background:#c2272d;
    background-size:auto 100%;
    border-radius:3px;
    color:#fff;
    text-align:center;
    height:68px;
    line-height:68px;
    font-size:24px;
    border-top-right-radius:34px;
    border-bottom-right-radius:34px;
}
.rezhuangbox{
    background:url(/wp-content/uploads/pageimg/dragonaug/7bg.png) repeat;
}
.rezhuangmain{
    width:54.3%;
    float:left;
    padding:0 3vw;
}
.rezhuangmain h2,.loupanbox h2{
    font-size:2.1vw;
    line-height:7.29vw;
    color:#000;
    text-align:center;
    font-weight:bold;
    margin-bottom:0.78vw;
}
.rezhuangmain li{
    float:left;
    padding:0 4.6% 3%;
    width:25%;
    text-align:center;
    line-height:200%;
    font-size:1vw;
}
.rezhuangmain li img{
    width:7.76vw;
    height:7.76vw;
}
.loupanbox .listbox{
    border-left:solid 1px #739390;
    width:71.875%;
    margin:0 auto;
}
.loupanbox h2{
    margin-top:2.5vw;
    margin-bottom:0;
}
.loupanbox a{
    display:block;
    float:left;
    background-color:#456f6e;
    border-top:solid 1px #739390;
    border-right:solid 1px #739390;
    text-align:center;
    height:2.5vw;
    line-height:2.5vw;
    font-size:1vw;
    color:#fff;
    width:10%;s
}










.fourbox{
    width:74.9%;
    margin:0 auto;
    background:rgba(255,255,255,0.3);
    background-size:100%;
    border-bottom-left-radius:30px;
    border-bottom-right-radius:30px;
    padding:4.16vw 4.7% 2.6vw;
}
.fourbox .left{
    width:37.8%;
    float:left;
}
.fourbox .right{
    width:61.7%;
    float:left;
    padding-left:5%;
    padding-top:10.4%;
}
.fourbox .img1{
    width:86%;
    margin:0;
}
.fourbox .bottom{
    padding-top:2.6vw;
}
.fourbox .img2{
    width:64%;
    float:left;
    margin-right:2%;
}
.fourbox .bottom .goaipage{
    width:23%;
    float:left;
    height:3.2vw;
    line-height:3.2vw;
    text-align:center;
    color:#fff;
    border-radius:10px;
    background:#b90d23;
    font-size:1.15vw;
    font-weight:bold;
}
.fivebox{
    background-size:100%;
    position:relative;
    padding-top:5.98vw;
    /*padding-bottom:4.27vw;*/
    margin-top:-5.98vw;
}
.fivebox .fiveimg{
    width:18.54%;
    position:absolute;
    top:0;
    right:15.625%;
}
.huiguswiperbox{
    width:49%;
    float:left;
    padding-top:10%;
}
.huiguswiperbox .huigubox .swiper-slide{
    width:20%;
}
.fiveright{
    width:35.4%;
    float:right;
}
.fiveright .swiper-pagination.decasebtn{
    clear:both;
    overflow:hidden;
    width:100%;
    margin:0 auto;
    position:relative;
    bottom:0;
}
.fiveright .swiper-pagination.decasebtn .swiper-pagination-bullet{
    opacity:1;
    width:100%;
    height:2.97vw;
    line-height:2.97vw;
    background:rgba(0,0,0,0.5);
    border:1px solid #8c7e7b;
    text-align:center;
    margin-bottom:1.4vw;
    color:#fff;
    border-radius:15px;
    cursor:pointer;
}
.fiveright .swiper-pagination.decasebtn .swiper-pagination-bullet-active{
    background:rgba(255,255,255,0.5);
    color:#333;
}
.sevenbox{
    /*background:url(/wp-content/uploads/pageimg/rabbitsep/10bg.png) no-repeat center top;*/
    background-size:100%;
    padding-top:3.4%;
    padding-bottom:2.5%;
}
.sevenbox img{
    width:73.6%;
}
.eightbox{
    background:url(/wp-content/uploads/pageimg/rabbitsep/11bg.png) no-repeat 8% center;
}
.eightmain{
    width:65.625%;
    margin:0 auto;
    padding-bottom:10.4vw;
}
.eightleft{
    width:25.1%;
    float:left;
}
.eightright{
    width:58.8%;
    float:right;
    position:relative;
}

.eightbox .listbox{
    width:53.5%;
    margin:0 auto;
    padding-bottom:5%;
}
.eightbox .listbox li{
    width:20%;
    float:left;
    padding:2% 2.5% 0;
}
.eightbox .listbox li span{
    display:block;
    line-height:2.6vw;
    font-size:1.15vw;
    text-align:center;
    color:#41200f;
}
.eightbox .listbox li img{
    height:100%;
}
/*.eightright .swiper-pagination.twocasebtn{
    width:133px;
    left:-156px;
    top:50%;
    transform: translateY(-50%);
    padding-top:20px;
}
.eightright .swiper-pagination-clickable .swiper-pagination-bullet{
    width:120px;
    height:48px;
    line-height:48px;
    border-radius:0;
    color:#000;
    opacity:1;
    display:block;
    float:none;
    background:#f7f7f7;
    margin-bottom:20px;
    border-radius:5px;
    position:relative;
}
.eightright .swiper-pagination-clickable .swiper-pagination-bullet-active{
    background:#a9a9a9;
}
.eightright .swiper-pagination-clickable .swiper-pagination-bullet-active:before{
    content:" ";
    display:block;
    border:12px solid transparent;
    border-left:24px solid #a9a9a9;
    width:0;
    height:0;
    position:absolute;
    top:12px;
    right:-26px;
}*/




.eightright .swiper-pagination.twocasebtn{
    width: 6.93vw;
    min-width:85px;
    left: -22%;
    top:50%;
    transform: translateY(-50%);
    padding-top: 1vw;
}
.eightright .swiper-pagination-clickable .swiper-pagination-bullet{
    width: 6.25vw;
    min-width:75px;
    height: 2.5vw;
    line-height: 2.5vw;
    border-radius:0;
    color:#000;
    opacity:1;
    display:block;
    float:none;
    background:#f7f7f7;
    margin-bottom: 1vw;
    border-radius:5px;
    position:relative;
}
.eightright .swiper-pagination-clickable .swiper-pagination-bullet-active{
    background:#a9a9a9;
}
.eightright .swiper-pagination-clickable .swiper-pagination-bullet-active:before{
    content:" ";
    display:block;
    border: 0.625vw solid transparent;
    border-left: 1.25vw solid #a9a9a9;
    width:0;
    height:0;
    position:absolute;
    top: 0.625vw;
    right: -1.25vw;
}
/* 设计师列表 */
.designbox{
    width:60%;
    margin:0 auto;
}
.designbox .titimg{
    width:72.26%;
}
.designbox .text{
    font-size:22px;
    padding-bottom:20px;
    color:#3f3939;
}
.designbox .text li{
    display:inline-block;
    text-align:center;
    padding:0 25px;
    line-height:30px;
    background:url(../images/huanjia/line.jpg) no-repeat right center;
}
.designbox .text li:last-child{
    background:none;
}

.designbtn{
    width:1120px;
    margin:0 auto;
}
.designbtn ul{
    width:462px;
    float:right;
}
.designbtn li{
    width:33.33%;
    padding:0 22px;
    padding-bottom:32px;
    line-height:44px;
    float:left;
}
.designbtn li a{
    color:#fff;
    width:100%;
    float:left;
    height:45px;
    font-size:28px;
    position:relative;
    border-radius:5px;
    text-align:center;
}
.designbtn li a i{
    display:block;
    background:#fff;
    height:3px;
    width:82px;
    position:absolute;
    bottom:-1px;
    left:50%;
    margin-left:-41px;
}
.designbtn li a:after,.designbtn li a::after{
    content: " ";
    width:0;
    height:0;
    border-width:13px;
    border-left:8px;
    border-right:8px;
    border-style: solid;
    position:absolute;
    left:50%;
    margin-left:-6px;
    bottom:-24px;
    border-color:#c59c7e transparent transparent transparent;
    display:none;
}
.designbtn li a:hover,.designbtn li.active a{
    background:#c59c7e;
}
.designbtn li a:hover i,.designbtn li.active a i{
    display:none;
}
.designbtn li a:hover:after,.designbtn li.active a:after{
    display:block;
}
.designlistbox{
    padding-bottom:2px;
    border:2px solid #231816;
    border-radius:20px;
    padding:3.5%;
    background:#fff;
}
.deimgbox{
    padding:10px 4px 0;
}
.designbox .ulbox{
    padding:23px 20px;
}
.designbox .ulbox li{
    width:20%;
    margin-bottom:23px;
    float:left;
    line-height:44px;
    padding:0 1%;
}
.designbox .ulbox li a{
    width:100%;
    display:block;
    text-align:center;
    background:#fff;
    border-radius:8px;
    font-size:16px;
    border:2px solid #302625;
}

.desileft{
    /*width:480px;*/
    width:45.2%;
    height:22.6vw;
    min-height:273px;
    float:right;
    position:relative;
}
.desileft .desiimg img{
    width:100%;
}
.desileft .desiimg{
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-position:top left;
    background-size:100%;
    transition:all 0.6s;
}
.desiinfo{
    width:100%;
    padding:20px 30px;
    position:absolute;
    bottom:0;
    left:0;
    background:rgba(0,0,0,0.6);
    color:#fff;
}
.desiinfo p{
    margin:0;
    font-size: 22px;
    line-height: 34px;
}
.designlist{
    display:block;
}
.designlist ul{
    width:12.5%;
    float:left;
}
.designlist ul.maxbox{
    width:25%;
}
.designlist ul.maxbox li{
    width:50%;
    float:left;
}
.designlist ul img{
    padding:8px 4px 0;
}
.designlist ul.maxbox li.maximg{
    width:100%;
    float:none;
}
.designlist li a{
    float:left;
}

.threebox{
}
.threebox .titimg{
    margin-bottom:15px;
    width:47.2%;
}
.threebox .titimg2{
    width:23.5%;
}
.threebox .listbox{
    width:66.51%;
    margin:0 auto;
    padding-top:24px;
}
.threebox .listbox ul{
    clear:both;
    overflow:hidden;
    zoom:1;
}
.threebox .listbox li{
    width:25%;
    float:left;
    padding:16px;
}
.threebox .listbox li img{
    transition:all 0.3s;
}
.threebox .listbox li:hover img{
    transform:translateY(-2%);
}
.sixbox{
    background:#456f6e;
    margin-top:5vw;
}
.sixbox .titimg{
    width:47.5%;
}
.sixmain{
    width:86.82%;
    margin:0 auto;
    padding-bottom:2%;
}
.sixmain .btmleft{
    width:59%;
    float:left;
}
.sixmain .btmleft li{
    float:left;
    width:25%;
    padding-right:3.2%;
}
.sixmain .btmleft h2{
    font-size:2.1vw;
    line-height:6.77vw;
    color:#fff;
    text-align:center;
    font-weight:bold;
}
.sixmain .btmright{
    width:37.6%;
    float:right;
    padding-top:6.77vw;
}
.sixmain .btmright strong{
    line-height:1.71vw;
    height:1.71vw;
    font-size:1.25vw;
    color:#3a3a3a;
    font-weight:bold;
    display:block;
    text-align:center;
}
.sixmain .btmright span{
    font-size:0.72vw;
    display:block;
    text-align:center;
    margin-bottom:0.5vw;
}
.sixmain .btmright p{
    color:#3a3a3a;
    font-size:12px;
    line-height:2vw;
    text-align:right;
    color:#fff;
}
.sixmain .btnbox{
    clear:both;
    float:none;
    padding-bottom:15px;
}
.sixmain .btnbox a{
    width:385px;
    height:64px;
    line-height:64px;
    border-radius:8px;
    text-align:center;
    background:#d51c24;
    color:#fff;
    font-size:1.25vw;
    float:left;
    margin-right:20px;
}
.sixmain .btnbox p{
    padding-top:32px;
    line-height:30px;
    float:left;
    font-size:16px;
}
.sixmain .bjbaombox input{
    background:#fff;
    float:left;
    width:100%;
    height:3.49vw;
    line-height:3.49vw;
    padding:0 10px;
    margin-bottom:0.625vw;
    margin-right:0;
    border-radius:3px;
    border:1px solid #767676;
}
.sixmain .bjbaombox a{
    color:#fff;
    text-align:center;
    display:block;
    border-radius:5px;
    line-height:3.49vw;
    font-size:1.5vw;
    margin-top:0.5vw;
    background:#ba272d;
}



.laybox{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.5);
    display:none;
    z-index:91;
}
.laybox .laybg{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:block;
}
.laybox .laymain{
    position:absolute;
    max-width:776px;
    width:100%;
    *width:776px;
    top:50%;
    left:50%;
    margin-left:-388px;
    margin-top:-301px;
}
.opacity-hide{
    opacity: 0;
}
.opacity-show{
    opacity: 1;
}

.toptit{
    width:100%;
    line-height:116px;
    font-size:40px;
    color:#fff;
    background:#01375b;
    text-align:center;
}
.toptit i{
    display:inline-block;
    width:5px;
    height:5px;
    background:#fff;
    vertical-align:middle;
    margin-right:30px;
    margin-left:10px;
}

.clearfix:after,.clearfix:before,.clearfix::after,.clearfix::before{
    content:" ";
    display:block;
    clear:both;
    overflow:hidden;
    zoom:0;
}