* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: 
        url('../images/bg-top.jpg') top / 100% auto no-repeat,
        url('../images/bg-bottom.jpg') bottom / 100% auto no-repeat,
        linear-gradient(0deg,#fec87e 30%, #ffe293 70%);
    font-family: "微软雅黑",Arial, sans-serif;
    font-size: 0.9vw;
    color: #333;
    padding-top:42vw;
}
a {
    color: #333;
    text-decoration: none;
}
ul,li,p{list-style-type: none;margin: 0;padding: 0;}

.dy{width: 66vw;border-radius: 0.4vw;background: #aa00003b;padding: 1vw;font-size:1vw;color: #fff7df;line-height: 2vw;margin: 0 auto;}

.nav{width: 66vw;height:5.5vw;margin:3vw auto;}
.nav li{width:15vw;margin-right:2vw;height:5vw;background:linear-gradient(0deg,#fb8a4d, #e71f1f);float: left;cursor: pointer;color: #fcffe8;border-radius:0.8vw 0.8vw 0 0;border-bottom: 0.4vw solid #dd2a2a;text-align: center;font-weight: bold;font-size: 1.2vw;}
.nav li:nth-last-child(1){margin-right: 0;}
.nav li:hover,.nav li.active {background:linear-gradient(0deg,#fffcef, #ffefc2);color:#f31808;border-bottom: 0.4vw solid #fb911f;}
.nav li p{line-height:1.5vw;font-size:1.6vw;}
.nav li:nth-child(1),.nav li:nth-child(5){line-height: 5vw;font-size:1.6vw;}
.nav li:nth-child(2),.nav li:nth-child(3),.nav li:nth-child(4){padding-top:1vw;}

.mm {display: none;opacity: 0;transition: opacity 0.5s ease-in-out;width: 66vw;margin: 0 auto;overflow: hidden;}
.mm.active {display: block;opacity: 1;}

.zyz li{float: left;width:15vw;text-align: center;height:21vw;font-size: 0.9vw;margin-right:2vw;background:linear-gradient(0deg,#fffcef, #ffefc200);border-radius: 0 0 0.6vw 0.6vw;margin-bottom:2.5vw;}
.zyz li:nth-child(4n){margin-right: 0;}
.zyz li img{width:14vw;height:14vw;border:0.4vw solid #f3180886;border-radius: 50%;}
.zyz li p{padding:0.5vw 1vw;line-height: 1.2vw;}
.zyz li p span{font-size:1.2vw;font-weight: bold;color: #e71f1f;line-height:2vw;}

.zz li{float: left;width:15vw;text-align: center;height:20vw;margin-right:2vw;background:linear-gradient(0deg,#fffcef, #ffefc29f);border-radius: 0 0 0.6vw 0.6vw;margin-bottom:2.5vw;}
.zz li:nth-child(4n){margin-right: 0;}
.zz li img{width:15vw;height:15vw;border:0.3vw solid #f3180886;border-radius:0.6vw;}
.zz li p{padding:0.5vw 1vw;font-size:1vw;font-weight: bold;line-height:1.3vw;}


.foot{height:24vw;text-align: center;font-size:1vw;color: #fff;padding-top:17vw;}

@media (max-width: 1024px){
html{transform: none;overflow-x: hidden;min-height: 100vh;}
body{
    font-size:clamp(3.4vw, 3.7vw, 4.2vw);
    padding-top:40vw;
    background:
        url('../images/bg-top.jpg') top center / 100% auto no-repeat,
        linear-gradient(0deg,#fec87e 30%, #ffe293 70%);
}


.mm,.nav,.dy{width:92vw;margin:0 auto;}
.dy{font-size:clamp(3vw, 3.2vw, 3.8vw);line-height:4.4vw;padding:1.2vw;}
.nav{display:flex;align-items:stretch;gap:2.4vw;height:auto;margin:4vw auto;}
.nav li{
    flex:1 1 calc(50% - 2.4vw);
    margin-right:0;
    min-height:14vw;
    padding:1.5vw 1vw;
    border-radius:2vw 2vw 0 0;
    border-bottom-width:1.2vw;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:1vw;
    text-align:center;
    font-size:clamp(2.4vw, 3vw, 3.6vw) !important;
    line-height:1.2;
}
.nav li:nth-child(2),.nav li:nth-child(3),.nav li:nth-child(4){padding-top:0;}
.nav li p{
    margin:0;
    line-height:1.1;
    font-size:clamp(1.2vw, 3vw, 3.8vw);
}
.mm{width:92vw;}
.zyz,.zz{display:grid;grid-template-columns:repeat(3,1fr);gap:3vw;}
.zyz li,.zz li{float:none;width:auto;height:auto;margin-right:0;border-radius:0 0 2vw 2vw;font-size:clamp(1.8vw, 2vw, 2.4vw);}
.zyz li img{width:100%;height:auto;border-width:1.2vw;}
.zz li img{width:100%;height:auto;border-width:1vw;border-radius:2vw;}
.zyz li p,.zz li p{padding:2vw;line-height:1.6;font-size:clamp(1.8vw, 2vw, 2.4vw);word-break:break-word;}
.zyz li p span{font-size:clamp(1.9vw, 2.1vw, 2.4vw);line-height:1.8;}
.foot{height:auto;padding-top:10vw;font-size:clamp(1.6vw, 1.8vw, 2.2vw);}
}

@media (max-width: 480px){
.dy{font-size:clamp(3vw, 3.2vw, 3.8vw);line-height:4.4vw;padding:1.2vw;}
body{font-size:clamp(3.4vw, 3.7vw, 4.2vw);padding-top:40vw;}
.nav{gap:3vw;}
.nav li{
    flex:1 1 100%;
    min-height:16vw;
    padding:2vw 0.5vw 0;
    line-height:1.2;
    border-bottom-width:1.5vw;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:1.2vw;
}
.nav li p{
    margin:0;
    line-height:1.1;
    font-size:clamp(1.2vw, 3vw, 3.8vw);
}
.zyz,.zz{grid-template-columns:repeat(3,1fr);}
.zyz li,.zz li{font-size:clamp(3.2vw, 3.6vw, 4.2vw);}
.zyz li p,.zz li p{font-size:clamp(3.2vw, 3.6vw, 4.2vw);}
.zyz li p span{font-size:clamp(3.8vw, 4.2vw, 4.8vw);}
.foot{font-size:clamp(3.2vw, 3.6vw, 4.2vw);}
.zyz li img{border-width:1.5vw;}
.zz li img{border-width:1vw;}
}