﻿html { font-family: "microsoft yahei", arial; }
body { margin:0 0; background:#0b1430; color:#fff; line-height:150%; text-align:center;font-family:arial, "microsoft yahei";position:relative;}
body, select, input, button, h1, h2, h3, h4, h5, h6 {font-size:14px}
body, h1, h2, h3, h4, h5, h6, ul, ol, li, form, p, dl, dt, dd, table, th, td, img, blockquote { margin:0; padding:0; border:0 }
input, button, textarea, img { line-height:normal }
abbr, acronym, address, cite, q, em, code, var, dfn, ins { font-style:normal; text-decoration:none; border:0 }
q:before, q:after { content:"" }
ul, ol { list-style:none }
table { border-collapse:collapse; border-spacing:0 }
input.text { border:1px solid #ccc; height:15px; padding:1px; margin:0 }
input.file { height:22px; padding:1px;height:19px;border:1px solid #ccc}
input.button, button { line-height:135%; padding:0 .5em; overflow:visible }
select, input, button { vertical-align:middle }
.radio input, .checkbox input, input.radio, input.checkbox { width:16px; height:16px; margin:0 3px 0 0; overflow:hidden }
button img { vertical-align:middle }
textarea.textarea { border:1px solid #ccc }
textarea.default { border:1px solid #ccc; height: 40px; }
a{text-decoration:none;color:#666;}
a:hover{color:#474747;text-decoration:none;}
strong, em {color:#565656;}



.kap-loading-icon{border:none; -webkit-animation:kap_ani_rotate 0.5s infinite linear; animation:kap_ani_rotate 0.5s infinite linear; width:32px; height:32px; position:fixed;z-index:9999; left:50%; top:50%; display:none; margin-left:-16px; margin-top:-32px;}
.kap-loading .kap-loading-icon{display:block;}
.kap-loading:before{content:""; position:fixed; left:0px; top:0px; width:100%; height:100%; background-color:#04091d; z-index:9999;}
.kap-loading-status{font-size:14px; line-height:30px; height:30px; position:fixed; left:0px; top:50%; margin-top:0px; color:#fff; text-align:center; display:none; width:100%; z-index:9999;}
.kap-loading .kap-loading-status{display:block;}
@-webkit-keyframes kap_ani_rotate{0%{ -webkit-transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);}}
@-moz-keyframes kap_ani_rotate{0%{ -webkit-transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);}}
@keyframes kap_ani_rotate{0%{ -webkit-transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);}}
@-webkit-keyframes fadeinright {
    0% {
        opacity: 0;
        -webkit-transform: translatex(100%);
        transform: translatex(100%);
    }
 
    100% {
        opacity: 1;
        -webkit-transform: translatex(0%);
        transform: translatex(0%);
    }
}
@-webkit-keyframes fadeinleft {
    0% {
        opacity: 0;
        -webkit-transform: translatex(-100%);
        transform: translatex(-100%);
    }
 
    100% {
        opacity: 1;
        -webkit-transform: translatex(0%);
        transform: translatex(0%);
    }
}

.po{position:absolute;}
.scaledraw{	-webkit-animation-name:scaledraw;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;-webkit-animation-duration:5s;}
.scale{animation:scaleani 1s linear infinite alternate;}

.pc{padding-bottom:87px;background:#0d1329;}
.pc .p img{width:100%;display:block;}

.pc .banner{width:100%;margin:0 auto;position:relative;}
.pc .banner img{width:100%;display:block;}
.pc .banner .po.form{width:100%;top:74%;}
.pc .banner .po.form #form1{width: 1100px;display: inline-block;margin: 0 auto;}

.pc .form .fields{width:100%;background:rgba(0,0,0,0.2);padding:15px 15px;box-sizing:border-box;font-size:0;border-radius:5px;text-align:center;}
.pc .form .field{width:23%;display:inline-block; box-sizing:border-box;position:relative;font-size:14px;color:#555;text-align:left;box-sizing:border-box;background:#fff;border-radius:5px;margin-right:2%;}
.pc .form .field.select{margin-right:0;text-align:center;}
.pc .form .field input{width:100%;height:50px;border:0;outline:0;background:0;padding-left:10px;box-sizing:border-box;color:#666;box-sizing:border-box;}
.pc .form .field input::-webkit-input-placeholder{color:#888;}
.pc .form .field select{width:100%;height:40px;border:0;outline:0;background:transparent url(/uploads/image/s2images/pc_form_select.png) no-repeat;background-position:right center;background-size:auto 4px;box-sizing:border-box;color:#666;-webkit-appearance:none;}
.pc .form .field.area select{width:42%;display:inline-block;font-size:14px;margin-right:4%;height:50px;border:0;outline:0;}
.pc .form .field.area select:last-child{margin-right:0;}
.pc .form .field.store select{color:#ec4728;}
.pc .form .btn{width:640px;position:relative;margin:20px auto 0px;}
.pc .form .btn img{width:100%;display:block;cursor:pointer;}
.pc .form .title{width:100%;position:relative;margin:20px auto 20px;text-align: center;}
.pc .form .btn img{width:100%;display:block;cursor:pointer;}

.pc .home_float{width:107px;position:fixed;right:0;bottom:90px;z-index:111;}
.pc .home_float img{width:100%;display:block;cursor:pointer;}

.pc .bottom{width:100%;position:fixed;right:0;left:0;bottom:0;display: flex;align-items: center;background:#0d1329;height: 87px;background-size:100% 100%;z-index:111;cursor:pointer;}
.pc .bottom .pic{width:732px;margin:0 auto;position:relative;}
.pc .bottom .pic img{width:100%;display:block;}

.pc .p1{width:100%;margin:0px auto;}
.pc .p4{margin-bottom:40px;}
.pc .main{background: url(/uploads/image/s2images/pc-footer.png) top;background-size: 100% 100%;}
.pc .p3{width:100%;margin:0px auto;position:relative;}
.pc .p3 .pics{width:1066px;height:421px;left:38px;top:218px;position:absolute;overflow:hidden;}
.pc .p3 .pics img{position:absolute;left:100%;top:0;}
.pc .p3 .pics img.on{left:0%;}
.pc .p3 .cover{width:100%;left:0;top:0;}
.pc .p3 .ctrl{width:56px;top:320px;}
.pc .p3 .ctrl img{display:block;cursor:pointer;}
.pc .p3 .ctrl.prev{left:-56px;}
.pc .p3 .ctrl.next{right:-56px;}
.pc .p3 .ctrl.prev:hover{left:-62px;}
.pc .p3 .ctrl.next:hover{right:-62px;}

.pc .pics{width:1058px;margin:0 auto;position:relative;}

.pc .home{width:340px;margin:20px auto 30px;cursor:pointer;}
.pc .home img{width:100%;display:block;}

.pc .foot{width:864px;text-align:center;padding:20px 0;margin:0 auto;}
.pc .foot .copy{width:864px;margin:0 auto;}
.pc .foot img{width:100%;display:block;}


.h5{padding-bottom:43px;background:#071434;background-size:100% 100%;}
.h5 .p{width:100%;max-width:750px;margin:0 auto;box-sizing:border-box;position:relative;overflow-x:hidden;}
.h5 .p img{display:block;width:100%;}

.h5 .p1{background:url(/uploads/image/s2images/h5_p1_bg.jpg) no-repeat;background-size:100% 100%;padding-bottom:10px;}
.h5 .p1 .title{width:100%;margin:0;}
.h5 .form{width:72%;box-sizing:border-box;margin-top: 0;}
.h5 .form .wrap{padding:25px 0% 20px;}
.h5 .form .field{width:100%;box-sizing:border-box;position:relative;margin-bottom:18px;font-size:14px;color:#555;text-align:left;/*border-bottom:1px solid #ccc;background:#fff;border-radius:5px;*/}
.h5 .form .field label{line-height:18px;display:block;}
.h5 .form .field label span{color:red;}
.h5 .form .field input{width:100%;height:50px;border:0;outline:0;background:#02255e;border:1px solid #4b628a;padding-left:16px;box-sizing:border-box;color:#fff;}
.h5 .form .field input::-webkit-input-placeholder{color:#ccc;}
.h5 .form .field select{width:100%;height:50px;border:1px solid #4b628a;outline:0;background:#02255e url(/uploads/image/s2images/h5_form_select.png) no-repeat;background-position:right center;background-size:auto 4px;box-sizing:border-box;color:#fff;-webkit-appearance:none;}
.h5 .form .field .code-btn{color:#fff;border:1px solid #eee;padding:0 10px;}
.h5 .form .field.area{font-size:0;text-align:center;}
.h5 .form .field.area label{font-size:14px;}
.h5 .form .field.area select{width:48%;display:inline-block;font-size:14px;margin-right:3%;text-align:center;}
.h5 .form .field.area select:last-child{margin-right:0;}
.h5 .form .field.store select{color:#ec4728;}
.h5 .form .btn{width:100%;position:relative;margin:0 auto;}
.h5 .form .btn a{width:100%;display:block;height:40px;line-height:40px;text-align:center;font-size:18px;font-weight:bold;color:#000;background:#e4be5d;border-radius:5px;}

.h5 .p2{position:relative;}
.h5 .p2 .btn{width:66.75%;left:16.625%;bottom:8.5%;}
.h5 .p2 .btn.fixed{position:fixed;top:auto;bottom:0%;left:12%;}
.h5 .p2 .home{width:50%;left:25%;bottom:6%;}
.h5 .p2 .copy{width:96%;left:2%;bottom:0%;}


.h5 .p3 .pics{width:100%;left:0;top:0;}
.h5 .p3 .pics img{position:absolute;left:100%;top:0;}
.h5 .p3 .pics img.on{left:0%;}
.h5 .p3 .arrows{width:100%;left:0;top:30%;}
.h5 .p3 .arrows img{display:block;}
.h5 .p3 .ctrl{width:10%;height:32%;top:30%;}
.h5 .p3 .ctrl.prev{left:0;}
.h5 .p3 .ctrl.next{right:0;}

.h5 .p5{position:relative;}
.h5 .p5 img{width:100%;display:block;}
.h5 .p5 .pics{width:100%;left:0;top:0;}
.h5 .p5 .pics img{position:absolute;left:100%;top:0;}
.h5 .p5 .pics img.on{left:0%;}
.h5 .p5 .ctrl{width:10%;height:32%;top:37%;border:0px solid #fff;}
.h5 .p5 .arrows{width:100%;left:0;top:0%;}
.h5 .p5 .arrows img{display:block;}
.h5 .p5 .ctrl.prev{left:0;}
.h5 .p5 .ctrl.next{right:0;}

.h5 .mobilefooter,
.h5 .mobilefooter a{color:#fff;}

.h5 .po.updown{animation:updownani 1s linear infinite alternate;}
.h5 .po.leftright{animation:leftrightani 1s linear infinite alternate;}
.h5 .po.scale{animation:scaleani 1s linear infinite alternate;}
.h5 .po.fire{animation:fire 1s linear infinite alternate;}

.h5 .home_float{width:15%;position:fixed;right:3%;bottom:10%;}
.h5 .home_float img{width:100%;display:block;}

.h5 .bottom{position:fixed;right:0;left:0;bottom:0;padding: 0.2rem;background: #061431;}
.h5 .bottom .pic .go{width:30%;height:30%;left:71%;top:8%;}
.h5 .bottom img{width:100%;display:block;}




.bg{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);display:none;}
.layer.rule{position:fixed;width:80%;left:10%;top:15%;color:#fff;display:none;}
.layer.rule h5{text-align:center;font-size:18px;margin-bottom:20px;}
.layer.rule p{text-align:justify;line-height:180%;font-size:14px;}
.layer.rule .close{width:80px;margin:20px auto 0;cursor:pointer;}
.layer.rule .close img{width:100%;display:block;}

.footer-info{color:#fff;padding:20px 0;}
.footer-info a{color:#fff;}

.mobilefooter{color:#fff;padding:20px 0;}
.mobilefooter a{color:#fff;}

.float{position:fixed;right:0;top:50%;margin-top:-96px;cursor:pointer;display:none;}
.float.on{display:block}

@keyframes bounceinleft {
	0% {opacity: 0;transform: translate3d(-3000px, 0, 0);}
	60% {opacity: 1;transform: translate3d(25px, 0, 0);}
	75% {transform: translate3d(-10px, 0, 0);}
	90% {transform: translate3d(5px, 0, 0);}
	100% {opacity: 1;transform: none;}
}

@keyframes bounceinright {
	0% {opacity: 0;transform: translate3d(3000px, 0, 0);}
	60% {opacity: 1;transform: translate3d(-25px, 0, 0);}
	75% {transform: translate3d(10px, 0, 0);}
	90% {transform: translate3d(-5px, 0, 0);}
	100% {opacity: 1;transform: none;}
}

@keyframes scaledraw {
	0% {transform:scale(1);}
	25% {transform:scale(1.1);margin-left:-0.05%}
	50% {transform:scale(1);}
	75% {transform:scale(1.1);margin-left:-0.05%}
}
@-webkit-keyframes scaleani{
	0%{transform: scale(1);}
	100%{transform: scale(1.06);}
}
@-webkit-keyframes fire{
	0%{transform: scale(1);}
	100%{transform: scale(1.16);}
}



html{
	font-size: 100px;
}
.h5{
	padding-top: 0.6rem;
}
.mobilenav {

    position: fixed;
    width: 100%;
    left: 0;
    height: 0.6rem;
    top: 0;
    z-index: 15;
    background: #000;
}
.mobilenav .menu{
    width: 0.6rem;
    height: 0.6rem;
    background: url(/uploads/image/s2images/derucci_m_icon_common_navbar_menu_white-3x.png) no-repeat center center;
    background-size: 0.18rem;
    right: 0;
    position: absolute;
    transition: background 0.3s;
}
.mobilenav .search{
    width: 0.25rem;
    height: 0.6rem;
    background: url(/uploads/image/s2images/derucci_m_icon_common_navbar_search-3x.png) no-repeat center center;
    background-size: 0.18rem;
    right: 0.95rem;
    position: absolute;
    transition: background 0.3s;
}
.mobilenav .kefu{
    width: 0.3rem;
    height: 0.6rem;
    background: url(/uploads/image/s2images/derucci_m_icon_common_navbar_kefu_white-3x.png) no-repeat center center;
    background-size: 0.18rem;
    right: 0.55rem;
    position: absolute;
    transition: background 0.3s;
}
.mobilenav .logo{
    width: 0.6rem;
    height: 0.6rem;
    background: url(/uploads/image/s2images/derucci_pc_logo_index_menu_big_golden.png) no-repeat center center;
    background-size: auto 0.37rem;
    position: absolute;
    left: 0.15rem;
    top: 0;
}
.mobilenav.open{
    height: 100%;
    background: rgba(22,24,29,0.95)
}
.mobilenav.open::after{
    content: '';
    position: absolute;
    width: 100%;
    top: 0.6rem;
    left: 0;
    border-top: 1px solid #726554;
}
.mobilenav.open .menu{
    background-image: url(/uploads/image/s2images/derucci_m_icon_common_navbar_close-3x.png)
}
.mobilenav.open .kefu,.mobilenav.open .search{
    display: none;
}
.mobilenav .m-nav{
    text-align: left;
    position: absolute;
    left: 0;
    top: 0.8rem;
    width: 100%;
    padding: 0 0.3rem 0;
    bottom: 1.6rem;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    display: none;
    height: auto;box-sizing:border-box;
}

/*pc*/
.pc{
	padding-top: 30px;
}
.service .nav {
    background: #000;
    height: 80px;
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    min-width: 1200px;
    /*border-bottom: 1px solid #eed8ab;*/
}

.service .nav{
    background: #000;
    height: 80px;
    position: fixed;
    z-index: 10;
    top:0;
    left: 0;
    width: 100%;
    min-width: 1200px;
    /*border-bottom: 1px solid #eed8ab;*/
}
.service .nav:hover{
    background: #000 !important;
}
.home-page .service .nav{
    border-bottom: none;
}
.service .nav .w{
    display: flex;
    align-items: center;
    width: 1420px;
    margin: 0 auto;
}
.service .nav:after{
    content:'';
    display: table;
    clear:both;
}
.service .nav .logo{
    width: 93px;
    height: 80px;
    background: url(/uploads/image/s2images/derucci_logo_common_glod_default.png) no-repeat center center;
    display:inline-block;
    background-size: contain;
}
.service .nav-col, .plugins.service .nav .nav-col {
    margin-left: 100px;
    width: auto;
    margin: auto;
    display: block;
    height: 80px;
    text-align: center;
}

.service .nav .nav-col li{
    height: 80px;
    margin-right: 48px;
    padding: 0;
    font-size: 0;
    display:inline-flex;
    align-items: center;
}
.service .nav .nav-col li.dropdown>a,
.plugins .nav .nav-col li.dropdown>a{
    /* padding-right: 14px; */
    /* background:  right center no-repeat; */
}
.nav .dropdown{
    position: relative;
}
.nav .dropdown .subcontent{
    min-width: 100%;
    padding: 0;
    top: 80px;
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
    height: 0;
    overflow: hidden;
    text-align: center;
    display: none !important;
   }
.nav .dropdown .subcontent .subinner{
    margin-top: 10px;
    background: #eed8ab;
    opacity: 0;
    height: auto;
    transition: opacity .5s;
    overflow: hidden;
}
.nav .dropdown .subcontent .subinner.txt{
    padding-top: 20px;
}
.nav .dropdown:hover .subcontent .subinner{
    opacity: 1;
}
.plugins .nav .dropdown .subcontent{
    top: 76.8rem;
}
.plugins.service .nav .dropdown .subcontent{
    top: 79px;
}
.service .nav .dropdown .subcontent .subinner{
    margin-top: 0;
    position: relative;
}
.service .nav .dropdown .subcontent .subinner::after{
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    transform: translatex(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #000;
}
.service .nav .dropdown .subcontent .subinner a{
    color: #000;
    text-align: center;
    transition: all .25s;
}
.service .nav .dropdown .subcontent .subinner a:hover{
    font-weight: bold;
}
.nav .dropdown:hover .subcontent{
    height: auto;
    /*    padding: 20px 12px 20px 12px;*/
}
.nav .dropdown .subcontent a{
    display: block;
    min-width: 100px;
    /*    overflow: hidden;*/
    /*    text-overflow: ellipsis;*/
    white-space: nowrap;
    padding:0 20px;
    font-size: 14px !important;
    line-height: 20px;
    margin-bottom: 20px;
    color: #fff;
    text-align: left;
    transition: transform 1s,opacity 1s;
    transform: translate3d(0,-40px,0);
    opacity: 0;
}
.nav .dropdown .subcontent a img{
    display: block;
    margin: 8px auto 4px;
}
.nav .dropdown:hover .subcontent a{
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.nav .dropdown .subcontent a:hover{
    color: #eed8ab;
}
.service .nav .nav-col li a{
    font-size: 15.6px;
    color:#eed8ab;
}
.service .nav .nav-col li a.cur{
    color: #eed8ab;
}
.service .nav-icon{
    width: 93px;
    text-align: right;
    display: flex;
    justify-content: flex-end;
}
.plugins .nav-icon i, .service .nav-icon i {
    width: 24px;
    height: 24px;
    display: block;
    -webkit-transition: backgroud 0.3s;
    transition: backgroud 0.3s;
    background-size: 100%;
}

.nav-icon .icon-search {
    background-image: url(/uploads/image/s2images/derucci_pc_icon_index_search_default-1x.png);
}