@charset "utf-8";


.hash_wrap{position:relative; z-index:99; width:100%; background:#fff;z-index: 10;}
.hash_wrap.fixed{position:fixed; top:161px; left:0; width:100%; z-index:100; background:#fff; border-bottom:1px solid #dedede; padding:10px 0;}

.hash_bx{margin:0 auto; width:100%; text-align:center; box-sizing:border-box; display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; overflow:hidden;}
.hash_bx::-webkit-scrollbar{width:5px; height:5px; border:5px solid #fff;}
.hash_bx::-webkit-scrollbar-track{background:#f9f9f9;}
.hash_bx::-webkit-scrollbar-thumb{background:#ddd;}

.hash_bx li{font-size:1.8rem; position:relative;}
.hash_bx.w5 li{width:calc(100%/5 - 4rem/5);}
.hash_bx.w6 li{width:calc(100%/6 - 5rem/6);}

.hash_bx li a{text-decoration:none; width:100%; height:7rem; line-height:7rem; display:block; background:#fff; color:var(--color1); font-size:2.5rem; border:1px solid var(--color1); box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; border-radius:5px;}
.hash_bx li a.on{color:#fff; background:var(--color1); border:1px solid var(--color1); font-weight:bold;}

.hash_wrap.fixed .hash_bx li a{height:5rem; line-height:5rem;}

@media screen and (max-width:1480px){
.hash_bx.w6 li{width:calc(100%/3 - 2rem/3);}
}

@media screen and (max-width:1280px){
    .hash_wrap.fixed{top:151px;}
.hash_bx li a{height:6rem; line-height:6rem; font-size:2rem;}
}
@media screen and (max-width:1024px){
    .hash_wrap.fixed{top:76px;}
}

@media all and (max-width:976px){
.hash_bx.w5 li{width:calc(100%/3 - 2rem/3);}
}

@media screen and (max-width:768px){
.hash_wrap.fixed{top:61px;}
.hash_bx li a{height:5rem; line-height:5rem; font-size:1.8rem;}
}

@media screen and (max-width:480px){
    .hash_bx{gap:.5rem;}
    .hash_wrap.fixed{top:56px;}
    .hash_bx li a{height:4rem; line-height:4rem; font-size:1.5rem;}
    .hash_bx.w5 li{width:calc(100%/3 - 1rem/3);}
    .hash_bx.w6 li{width:calc(100%/3 - 1rem/3);}
}