@charset "utf-8";
/*
 * 深圳市智慧联播科技有限公司
 * 请尊重他人劳动成果，你可以模仿页面，但是请自己写代码！
 * 技术支持：QQ2863868475
 * 2024-05-13
 * coyright@tengcee.com
*/
@import url("public.css");
html,body {height: 100%;margin: 0;padding: 0;border: 0; background-color: #ebf1f5}
.body{ overflow-x:hidden; /*background-image: url('../images/bg.jpg');*/ background-size: cover; background-repeat: no-repeat; background-position: center;background:linear-gradient(-155deg, rgb(113,35,179) 0,rgb(0,0,0) 60%,rgb(0,0,0) 70%, rgb(50,5,78) 100%);}
.container{ width: 100%;float: left; position: relative;}
.wrapper{ height: 100%; position: relative;display: flex;align-content:space-between;justify-content:space-between;flex-wrap: nowrap; flex-direction: column;}

.w100{ width: 100%; position: relative;float: left}
.header{ width: 100%;float: left;position: relative;}
.header .headerbox{ width: 100%;float: left;position: relative;display: flex;align-content: flex-start;justify-content: space-between; flex-wrap: nowrap; padding:30px 50px 10px 50px;box-sizing: border-box;}
.header .headerbox .logo{ width: 200px;flex:0 0 200px; float: left; line-height:35px;height: 35px;color:#fff;font-size:25px; font-weight:800;}
.header .headerbox .logo a{ color:#fff; float: left; border-bottom:dashed 1px rgba(255,255,255,.2);}
.header .headerbox .toptext{float: right; line-height:35px;height: 35px;color:#fff;font-size:15px; white-space: nowrap;margin-top: 5px;}
.header .headerbox .nav{ width: 100%;float: left; position: relative; padding-left:10px;margin-top: 3px;}
.header .headerbox .nav li{ float: left;margin-right: 10px;position: relative;line-height:35px; font-size: 16px;}
.header .headerbox .nav li a{color: #fff;padding:0 20px; display:inline-block;}
.header .headerbox .nav li.on a{background-color: #8a2be1; border-radius: 30px}
.header .headerbox .nav li a:hover{background-color: #8a2be1; border-radius: 30px}

.mainbox{ width: 100%;float: left;padding:0px 100px 0px 100px;box-sizing: border-box; position: relative; flex: 1;}
.mainbox .title{ width: 100%;float: left;text-align: center;line-height:2em; font-size: 45px; color:#fff;}
.daohang{ width: 100%;float: left; position:relative;display: flex;align-content: flex-start;justify-content: space-between; flex-wrap: nowrap;margin-top: 140px;padding:0 100px; box-sizing: border-box;  perspective: 1500px;}
.daohang .item{ width: 16vw;margin:0 10px; position: relative;text-align: center; box-sizing: border-box;transition: all .3s ease;-webkit-animation: all .5s ease;animation: all .5s ease;display:inline-block;}
.daohang .item .itemin{ width: 100%;box-sizing: border-box; float: left;height: 100%; padding:40px 0;position: relative;}
.daohang .item .icon{ width: 100%;float: left;text-align: center;margin: 10px 0;}
.daohang .item .icon img{ width: 60px;height: 60px;}
.daohang .item .tit{ width: 100%;float: left;text-align: center;margin: 10px 0; font-size:20px; color:#fff;line-height:2em;}
.daohang .item:hover{border-radius: 8px;transform: translateY(-10px) !important;box-shadow:0 0 7px #fff, 0 0 10px #228dff, 0 0 8px #228dff, 0 0 6px #228dff, 0 0 9px #228dff, 0 0 11px #228dff, 0 0 9px #228dff, 0 0 130px #228dff;transition: all .3s ease;}

/*.item1{background:linear-gradient(-125deg, rgb(52, 180, 233), rgb(74, 8, 112));transform: translateX(25px) translateZ(78px) rotateY(26deg);}
.item2{background: linear-gradient(-125deg, rgba(122, 208, 185, 0.7), rgba(14, 37, 173, 0.7));transform: translateX(7px) translateZ(14px) rotateY(8deg);}
.item3{background:linear-gradient(-125deg, rgba(140, 71, 212, 0.7), rgba(27, 52, 179, 0.7));}
.item4{background: linear-gradient(-125deg, rgba(141, 136, 255, 0.7), rgba(57, 15, 143, 0.7)); transform: translateX(-8px) translateZ(15px) rotateY(-10deg);}
.item5{background: linear-gradient(-125deg, rgba(172, 75, 145, 0.7), rgba(68, 17, 173, 0.7));transform: translateX(-20px) translateZ(61px) rotateY(-15deg);}*/
.item1{background:linear-gradient(-125deg, rgb(40, 102, 153), rgb(138,43,225));transform: translateX(25px) translateZ(78px) rotateY(26deg);}
.item2{background: linear-gradient(-125deg, rgba(70, 123, 131,1), rgba(13, 27, 126,1));transform: translateX(7px) translateZ(14px) rotateY(8deg);}
.item3{background:linear-gradient(-125deg, rgba(89, 41,150,1), rgba(31,37,133,1));}
.item4{background: linear-gradient(-125deg, rgba(91, 75,173,1), rgba(42, 11, 104, 1)); transform: translateX(-8px) translateZ(15px) rotateY(-10deg);}
.item5{background: linear-gradient(-125deg, rgba(114,38,113,1), rgba(54, 13, 133,1));transform: translateX(-20px) translateZ(61px) rotateY(-15deg);}
.item1:hover{box-shadow: 0 0 7px #fff, 0 0 10px #ffdd1b, 0 0 8px #ffdd1b, 0 0 6px #ffdd1b, 0 0 9px #ffdd1b, 0 0 10px #ffdd1b, 0 0 9px #ffdd1b, 0 0 130px #ffdd1b !important;}
.item2:hover{box-shadow: 0 0 7px #fff, 0 0 10px #f17, 0 0 8px #f17, 0 0 6px #f17, 0 0 9px #f17, 0 0 10px #f17, 0 0 9px #f17, 0 0 130px #f17 !important;}
.item4:hover{box-shadow: 0 0 7px #fff, 0 0 10px #ba01ff, 0 0 8px #ba01ff, 0 0 6px #ba01ff, 0 0 9px #ba01ff, 0 0 10px #ba01ff, 0 0 9px #ba01ff, 0 0 130px #ba01ff !important;}
.item5:hover{box-shadow: 0 0 7px #fff, 0 0 10px #f90, 0 0 8px #f90, 0 0 6px #f90, 0 0 9px #f90, 0 0 10px #f90, 0 0 9px #f90, 0 0 130px #f90 !important;}

.footer{ width: 100%;float: left;position: relative; padding:25px 0; border-top:dashed 1px #3a3a3a;}
.footer .copyright{ width: 100%;text-align: center;line-height:2em; font-size: 15px;color:#666; }

@media screen and (max-width:1400px){
    .mainbox{padding:0px 50px;}
    .daohang{padding:0 50px; }
}
@media screen and (max-width:1000px){
    .mainbox{padding:0px 20px;}
    .daohang{padding:0 20px; }
    .mainbox .title{line-height:2em; font-size:30px;}
}
@media screen and (max-width:750px){
    .mainbox{padding:80px 20px;}
    .header .headerbox{padding:10px; flex-direction: column;}
    .header .headerbox .logo{ width: 100%;flex:0 0 100%;font-size:25px; text-align: center;}
    .header .headerbox .toptext{ display:none }
    .header .headerbox .nav{padding-left:0px;margin-top: 10px;display: flex;align-content: flex-start;justify-content: space-between; flex-wrap: nowrap;}
    .header .headerbox .nav li{ font-size: 15px;margin-right: 0;opacity: .8}
    .header .headerbox .nav li.on{ opacity: 1;}
    .mainbox .title{line-height:2em; font-size: 20px;}

    .daohang{padding:0px; }
    .daohang .item{margin:0 1px;}
    .daohang .item .itemin{padding:10px 0;}
    .daohang .item .icon img{ width: 30px;height: 30px;}
    .daohang .item .tit{margin: 5px 0; font-size:14px;}

    .item1{transform: translateX(10px) translateZ(78px) rotateY(26deg);}
    .item2{transform: translateX(2px) translateZ(14px) rotateY(8deg);}
    .item4{transform: translateX(-2px) translateZ(15px) rotateY(-10deg);}
    .item5{transform: translateX(-10px) translateZ(61px) rotateY(-26deg);}
}