@font-face {
    font-family: 'iconfont';
    src: url('../fonts/iconfont.eot');
    src: url('../fonts/iconfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/iconfont.woff2') format('woff2'),
        url('../fonts/iconfont.woff') format('woff'),
        url('../fonts/iconfont.ttf') format('truetype'),
        url('../fonts/iconfont.svg#iconfont') format('svg');
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
a { 
    color:#fff;
    text-decoration: none;
}
a:hover { 
    text-decoration: none;
}
ul,li { 
    list-style: none;
}
html,body{
    width: 100%;
    height: 100%;
}
.kdb_environment_carousel {
    max-width: 800px; 
    position: relative;
    margin: 0 auto;
}
#kdb_environment_slide {
    width: 100%;
    height: 420px;
    position: relative;
    /* overflow: hidden; */
}
#kdb_environment_slide .pic { 
    position: absolute; 
    text-align: center;
}
#kdb_environment_slide .pic img {
    width: calc(100% - 14px);
    height: calc(100% - 14px);
}
#kdb_environment_slide .p1 { 
    z-index: 3;
    width: 40%;
    height: 40%;
    left: -25%;
    top: 30%;
}
#kdb_environment_slide .p2 { 
    z-index: 4;
    width: 60%;
    height: 60%;
    left: -8%;
    top: 20%;
}
#kdb_environment_slide .p3 {
    z-index: 5; 
    width: 80%;
    height: 80%; 
    left: 50%;
    top: 10%;
    transform: translateX(-50%);
}
#kdb_environment_slide .p4 { 
    z-index: 4; 
    width: 60%; 
    height: 60%; 
    left: 48%; 
    top: 20%;
}
#kdb_environment_slide .p5 { 
    z-index: 3; 
    width: 40%;
    height: 40%; 
    left: 85%; 
    top: 30%;
}
#kdb_environment_slide .btn {
    position: absolute;
    z-index: 6;
    bottom: 20%;
    width: 180px;  /* 计算得出 5*30+5*6=180 */
    margin-left: -90px;
    left: 50%;
}

#kdb_environment_slide .btn span {
    width: 24px;
    height: 8px;
    border-radius: 3px;
    float: left;
    background-color: #dedede;
    margin: 0 3px;
}
#kdb_environment_slide .btn .on {
    background-color: #ffd200; 
}
.kdb_environment_carousel > button{
    z-index: 999;
    position: absolute;
    border: none;
    font-size: 36px;
    background-color: rgba(0,0,0,.4);
}
.kdb_environment_carousel > .btn-prev {
    top: 50%;
    left: 50px;
    transform: translateY(-50%);
}
.kdb_environment_carousel > .btn-next {
    top: 50%;
    right: 50px;
    transform: translateY(-50%);
}