.tab_btn.nogiImg::after{background-color: #b07b9d99;}
.tab_btn.sakuImg::after{background-color: #eaabc399;}
.tab_btn.hinaImg::after{background-color: #aee4ff99;}
.tab_nav .nogiImg{
    background-image: url(../images/sakaPhoto85/nogi_al5.jpg);
    background-position: 50% 90%;
}
.tab_nav .sakuImg{
    background-image: url(../images/sakaPhoto85/saku14.jpg);
    background-position: 50% 90%;
}
.tab_nav .hinaImg{
    background-image: url(../images/sakaPhoto85/hina16.jpg);
    background-position: 50% 80%;
}
.tab_cont.nogiTop_bg,.tab_cont.sakuTop_bg,.tab_cont.hinaTop_bg{
    background-attachment: fixed;
    min-height: 100vh;
}
.nogiTop_bg{background: linear-gradient(#b07b9d, #e1e3e5);}
.sakuTop_bg{background: linear-gradient(#eaabc3, #e1e3e5);}
.hinaTop_bg{background: linear-gradient(#aee4ff, #e1e3e5);}



/*top*/
.topG_name{
    font-family: "Modak", system-ui;
    font-size: 5.5rem;
    color: #fff;
    font-weight: normal;
    letter-spacing: 1.5px;
    text-align: center;
    transform: translateY(-10px);
}
.topG_sns{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    column-gap: 1em;
}
.topG_sns a{
    display: block;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #fff;
    font-size: 18px;
    color: #514663;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s;
}
@media (hover: hover) {
    .topG_sns a:hover{
        background-color: #e1e3e5;
        color: #111;
        transform: translateY(1px);
    }
}
.topSec_ttl{
    font-family: "Dangrek", sans-serif;
    font-size: 2rem;
    font-weight: normal;
    letter-spacing: 1.5px;
    text-align: center;
    margin-bottom: 25px;
    background: linear-gradient(-5deg, #111 40%, #666 50%, #111 60%);
    background-clip:text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.topSlide_wrap{
    background-color: #514663;
    width: 100%;
    border-top: solid 8px #514663;
    border-bottom: solid 3px #514663;
    margin-bottom: 10px;
}

.topNewsList{margin-bottom: 25px;}
.topNewsList li{
    font-family: "Roboto Condensed", sans-serif;
    font-size: 12px;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    padding: 1.5em 5px;
    border-bottom: solid 1px #99999999;
}
.topNews_date{width: 11em;}
.topNews_date span{
    background-color: #333;
    padding: 0.25em 2em;
    border-radius: 20px;
    color: #fff;
    text-transform: uppercase;
}
.topNewsList li article{width: calc(100% - 11em);}
.topNewsList li article a{
    display: inline-block;
    font-size: 16px;
    color: #333;
    transition: 0.2s;
}
@media (hover: hover) {
    .topNewsList li article a:hover{
        transform: translateY(-1px);
        text-decoration: underline;
        text-underline-offset: 2px;
        color: #111;
    }
}
.top_more{
    text-align: center;
}
.top_more a{
    display: inline-block;
    font-family: "Quantico", sans-serif;
    font-size: 16px;
    color: #111;
    background-color: #ffffffaa;
    width: 30%;
    padding: 0.5em 0;
    margin-top: 30px;
    border-radius: 20px;
    border: solid 1px #66666699;
    box-shadow: 3px 3px 5px #333;
    transition: 0.3s;
}
@media (hover: hover) {
    .top_more a:hover{
        transform: translate(1px, 1px);
        box-shadow: 1px 1px 3px #333;
    }
}
.swiper{height: calc(240px + 2em);}
.swiper-slide{
    height: 240px !important;
    min-width: 120px;
}
.swipeTxt{
    font-family: "Roboto Condensed", sans-serif;
    font-size: 14px;
    color: #111;
    text-align: center;    
}
.swipeTube i{    
    font-size: 36px;
    color: red;
    position: absolute;
    top: 50%; left: 50%;
    z-index: 6;
    transform: translate(-50%, -50%);
}
.swipeTube::after{
    display: block;
    content: "";
    width: 20px;
    height: 20px;
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%; left: 50%;
    z-index: 5;
    transform: translate(-50%, -50%);
}

.topMem_grid{
    box-sizing: border-box;
    width: 100%;
    display: grid;
    grid-template-columns: 12% auto;
    row-gap: 10px;    
    font-family: "Oswald", sans-serif;
    margin-bottom: 25px;
}
.topMem_gen{
    font-size: 18px;
    color: #fff;
    font-weight: normal;
    text-transform: uppercase;
    padding: 0.5em 1em;
    display: flex;
    justify-content: center;
    align-items: center;
}
.topMem_gen span{
    display: block;
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    line-height: 1.0em;
    text-transform: lowercase;
    transform: translateY(-6px);
}
.topMem_list{
    box-sizing: border-box;
    background-color: #fff;
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 8px;
    padding: 8px;
}
#topMem_nogi .topMem_gen{background-color: purple;}
#topMem_nogi .topMem_list{border: solid 5px purple;}
#topMem_saku .topMem_gen{background-color: palevioletred;}
#topMem_saku .topMem_list{border: solid 5px palevioletred;}
#topMem_hina .topMem_gen{background-color: dodgerblue;}
#topMem_hina .topMem_list{border: solid 5px dodgerblue;}
.topMem_list li{
    font-size: 12px;
    letter-spacing: 0.5px;
    color: #111;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.2em;
}
.topMem_list li a{
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
}
.topMem_list li a img{
    width: 100%;
    transform: scale(1.0);
    box-shadow: 0 0 0px #333;
    transition: 0.3s;
}
@media (hover: hover) {
    .topMem_list li a:hover img{
        transform: scale(1.05);
        box-shadow: 0 0 5px #333;
    }
}
.lazy-image {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.lazy-image.loaded {opacity: 1;}
.topBan_list{
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    gap: 10px;
}
.topBan_list li{
    display: block;
    width: calc((100% - 30px) / 4);
    aspect-ratio: 26 / 9;
    background-color: #444;
    border-radius: 15px;
    position: relative;   
}
.topBan_list li a{
    width: 100%;
    aspect-ratio: 26 / 9;
    position: absolute;
    top: 0; left: 0;
    line-height: 0;
}
.topBan_list li a img{
    width: 100%;
    border-radius: 12px;
    transition: 0.3s;
}



/*news*/
#news_list{
    background-color: #fff;
    border-radius: 5px;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 12.5px;
    padding: 15px 30px;
}
#news_list li{
    padding: 1.5em 0.5em;
    border-bottom: dashed 1px #aaa;
}
#news_list li:last-child{border-bottom: none;}
.news_head{
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    margin-bottom: 1em;
}
.news_date{color: #999;}
.news_grp, .news_op{
    display: block;    
    text-transform: uppercase;
    margin-left: 1em;    
}
.news_grp{
    width: 7.5em;
    font-size: 11px;
    color: #fff;
    text-align: center;
}
.news_grp.nogizaka{background-color: purple;}
.news_grp.sakurazaka{background-color: palevioletred;}
.news_grp.hinatazaka{background-color: dodgerblue;}
.news_op{
    width: 8em;
    font-size: 10.5px;
    letter-spacing: 0.5px;
    text-align: center;
    border-radius: 15px;
    border: solid 1px;
}
.news_op.event{color: darkorange; border-color: darkorange;}
.news_op.release{color:violet;border-color: violet;}
.news_op.member{color:steelblue;border-color: steelblue;}
.news_op.media{color:plum;border-color: plum;}
.news_op.merch{color:orangered;border-color: orangered;}
.news_op.books{color:seagreen;border-color: seagreen;}
.news_op.others{color: #666;border-color: #666;}
#news_list li article{
    padding-left: 2em;
    line-height: 1.6em;
}
#news_list li article a{
    color: #666;
    font-size: 14px;
    letter-spacing: 0.25px;
}
@media (hover: hover) {
    #news_list li article a:hover{
        color: #0e77d0;
        text-decoration: underline;
    }
}
.filter-btn{font-size: 12px;}



/*schedule*/
.sche_year_jump{
    display: flex;
    flex-flow: row wrap;
    gap: 1em;
    margin: 0 0 50px;
}
.sche_jump a{
    display: block;
    font-family: "Play", sans-serif;
    font-size: 10.5px;
    color: #0e77d0;
    font-weight: bold;
    letter-spacing: 0.5px;
    background-color: #e9f3fa;
    padding: 0.25em 1.5em;
    border-radius: 15px;
    box-shadow: 0 0 3px #333333aa;
    transition: 0.3s;
}
.sche_jump a::before{
    content: "▶";
    margin-right: 0.25em;
}
@media (hover: hover) {
    .sche_jump a:hover{
        transform: translateY(-1px);
    }
    .sche_jump a:hover::before{
        content: "▼";
    }
}
.sche_year{
    font-family: "Quantico", sans-serif;
    font-size: 45px;
    font-weight: bold;
    font-style: italic;
    text-align: right;
    padding: 75px 15px 0;
    margin-top: -75px;    
    margin-bottom: 30px;
    border-bottom: solid 3px #111;
}
.sche_wrap{
    background-color: #fff;
    box-shadow: 0 0 3px #333333aa;
    margin: 0 15% 30px 0;
    padding-bottom: 10px;
    border-radius: 2px;    
}
.sche_ttl{
    font-family: "Play", sans-serif;    
    color: #fff;
    font-size: 18px;
    font-style: italic;
    padding: 0.25em 1em;
    border-radius: 2px 2px 0 0;
    margin-bottom: 11px;
    display: flex;
    align-items: center;
    position: relative;
}
#nogi_box .sche_ttl{background-color: purple;}
#nogi_box .sche_ttl::after{border-top-color: purple;}
#saku_box .sche_ttl{background-color: palevioletred;}
#saku_box .sche_ttl::after{border-top-color: palevioletred;}
#hina_box .sche_ttl{background-color: dodgerblue;}
#hina_box .sche_ttl::after{border-top-color: dodgerblue;}
.sche_ttl::before{
    font-family: 'Font Awesome 6 Free';
    content: "\f152";
    font-weight: 900;
    font-style: normal;
    margin-right: 0.5em;
}
.sche_ttl::after{
    content: '';
    position: absolute;
    top: 100%; left: 30px;
    width: 0;
    height: 0;
    border: 11px solid transparent;
    border-top: 11px solid;
}
.sche_data{
    padding: 0 1em;
    font-family: "Oswald", sans-serif;
    font-size: 14px;
    display: flex;
    align-items: center;
    position: relative;
}
.sche_day{
    font-size: 10.5px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background-color: #2f2921;
    width: 8em;
    padding: 0.25em 0;
    text-align: center;
    border-radius: 20px;
}
.sche_ad{
    border-left: solid 2px #2f2921;
    margin-left: 1em;
    padding: 10px 0 10px 1em;
    width: 5em;
    color: #888;
    text-transform: capitalize;
    position: relative;
}
.sche_ad::before{
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    background-color: #2f2921;
    border-radius: 50%;
    position: absolute;
    top: 50%; left: -5px;
    transform: translateY(-50%);
}
.sche_place{text-transform: uppercase;}
.sche_sl{
    content: "";
    flex-grow: 2;
    margin-left: 1em;
    position: relative;
}
.sche_sl::before{
    content: "";
    display: block;
    width: calc(100% - 70px);
    border-bottom: dashed 1px #aaa;
    position: absolute;
    top: 50%; right: 70px;
}
.sche_sl::after{
    content: "SetList";
    font-family: "Play", sans-serif;
    font-size: 10.5px;
    color: #fff;
    letter-spacing: 0.1em;
    background: linear-gradient(to bottom, #b57722 50%, #9f681a 50%);
    padding: 0.5em 1em;
    border-radius: 5px;
    position: absolute;
    top: 50%; right: 0;
    transform: translateY(-50%);
    transition: 0.5s;
}
.sche_sl[href="xxx"]{display: none;}
@media (hover: hover) {
    .sche_sl:hover::after{background: linear-gradient(to bottom, #f89925 50%, #ff8c00 50%);}
}



/*discography*/
.dsc_head{
    width: 100%;
    height: 320px;
    background-color: #fff;
    box-shadow: 0 0 3px rgba(20, 25, 28, 0.1);
}
.dscSlide_no{
    font-family: "Play", sans-serif;    
    font-size: 12px;
    color: #7E7E7E;    
    font-weight: 700;
    text-transform: capitalize;
    letter-spacing: 3px;
}
.dscSlide_ttl{
    font-family: 'Times New Roman', serif;
    font-size: 36px;
    font-weight: 700;
    color: #2C2C2C;
    line-height: 1.0em;
    letter-spacing: 2px;
    margin: 15px 0 25px;
}
.dscSlide_infoList{
    font-family: "Karla", sans-serif;
    font-size: 12px;
    color: #7e7e7e;
    margin-bottom: 15px;
}
.dscSlide_infoList dt{
    font-size: 10.5px;
    color: #eee;
}

.dscPage_jump{
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
    margin-top: 50px;
    padding-bottom: 20px;
    display: flex;
    justify-content: center;
}
.dscPage_jump a{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1em 2em;
    border: 1px solid #e7e7e7;
    border-radius: 5px;
    box-shadow: 6px 6px 12px #c5c5c5, -6px -6px 12px #ffffff66;
    background-color: #e1e3e5;
    color: #555;
    transition: 0.5s;
}
@media (hover: hover) {
    .dscPage_jump a:hover{
        color: #777;
        background-color: #d8dadb;
        box-shadow: inset 4px 4px 12px #c5c5c5, inset -4px -4px 12px #ffffff66;
    }
}
.dscPage_jump a span{
    color: #0e77d0;
    margin: 0 0.5em;
}
.dscPage_jump a span::before,.dscPage_jump a span::after{content: "\"";}

.dsc_filter{
    margin-top: 30px;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
}
.dsc_filter-btn{
    background-color: #ccc;
    font-family: "Karla", sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.25px;
    padding: 0.75em 2em;
    border: none;
    transition: 0.3s;
}
@media (hover: hover) {
    .dsc_filter-btn:hover {background-color: #e9ecef;}
}
.dsc_filter-btn.active{
    background-color: #666;
    color: white;
    pointer-events: none;
}

.dsc_search {
    margin: 20px 0;
    padding: 0 20px;
}
.dsc_search-form {
    position: relative;
    max-width: 500px;
    margin: 0 auto;
}
.dsc_search-input {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 1.5em;
    border: 2px solid #ddd;
    border-radius: 25px;
    font-size: 14px;
    color: #333;
    transition: border-color 0.3s;
}
.dsc_search-input:focus {
    outline: none;
    border-color: #666;
}

.dsc_tbl{
    width: 70%;
    margin: 30px auto 0;
    padding-bottom: 50px;
    border-collapse: separate;
    border-spacing: 2px;
    font-family: "Karla", sans-serif;
    font-size: 12px;
}
.dscTbl_hd{
    position: sticky;
    top: 64px;
}
.dscTbl_hd th{
    background-color: #111;
    font-size: 10.5px;
    color: #fff;
    letter-spacing: 0.25px;
    padding: 0.75em 0.5em;
    transition: 0.3s;
}
@media (hover: hover) {
    .dscTbl_hd th:hover{background-color: #333;}
}
.dscTbl_hd th.noAct{padding: 0;}
.dsc_tbl tbody tr{background-color: #eee;}
.dsc_tbl tbody tr.dscTbl_b{font-weight: bold;}
.dsc_tbl tbody tr.dscTbl_k{color: darkgreen;}
.dsc_tbl tbody tr:nth-child(even){background-color: #ddd;}
.dsc_tbl tbody td{    
    padding: 0.5em;
    text-align: center;
}
.dsc_gen{
    font-size: 10.5px;
    text-transform: capitalize;
}
.dsc_tbl tbody td.dsc_ttl{
    box-sizing: border-box;
    width: 70%;
    padding: 0.5em 1em;
    text-align: left;
    font-size: 14px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis; /* Safari */
	-o-text-overflow: ellipsis; /* Opera */
}
.dsc_tbl tbody td.dsc_ttl span{
    width: 100%;
    display: block;
    font-family: "游ゴシック Medium", "Yu Gothic Medium", "YuGothicM", "游ゴシック体", "YuGothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    font-size: 10px;
    color: #666;
    letter-spacing: 0.25em;
    text-indent: 1em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis; /* Safari */
	-o-text-overflow: ellipsis; /* Opera */
}
.dsc_tbl tbody tr.dscTbl_b td.dsc_ttl span{font-weight: normal;}
.dsc_link{
    color: #0e77d0;
    text-decoration: underline;
    text-underline-offset: 2px;
}
@media (hover: hover) {
    .dsc_link:hover{color: #0b67b6;}
}




/*member*/
.memPage_jump{
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
    margin-top: 50px;
    padding-bottom: 20px;
    display: flex;
    justify-content: center;
}
.memPage_jump a{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1em 2em;
    border: 1px solid #e7e7e7;
    border-radius: 5px;
    box-shadow: 6px 6px 12px #c5c5c5, -6px -6px 12px #fff;
    background-color: #e1e3e5;
    color: #555;
    transition: 0.5s;
}
@media (hover: hover) {
    .memPage_jump a:hover{
        color: #777;
        background-color: #d8dadb;
        box-shadow: inset 4px 4px 12px #c5c5c5, inset -4px -4px 12px #fff;
    }
}
.memPage_jump a span{
    color: #0e77d0;
    margin: 0 0.5em;
}
.memPage_jump a span::before,.memPage_jump a span::after{content: "\"";}


#mem_nav, .memNav_list{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
}
#mem_nav{gap: 15px;}
.memNav_list button{font-size: 12px;}
.sortReset_btn{margin-left: 15px;}
.sortReset_btn button{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    padding: 8px;
    border: none;
    border-radius: 50%;
    box-shadow: 0 10px 10px rgb(0 0 0 / 20%);
    background-image: linear-gradient(0, #ddd, #fff);    
    transition: transform .3s, box-shadow .3s;
}
.sortReset_btn button span {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-image: linear-gradient(0, #fff, #ddd);
    font-family: "Karla", sans-serif;
    color: #111;
    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.2em;
    display: flex;
    align-items: center;
}

.mem_search {
    margin: -20px 0 20px;
    padding: 0 20px;
}
.mem_search-form {
    position: relative;
    max-width: 500px;
    margin: 0 auto;
}
.mem_search-input {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 1.5em;
    border: 2px solid #ddd;
    border-radius: 25px;
    font-size: 14px;
    color: #333;
    transition: border-color 0.3s;
}
.mem_search-input:focus {
    outline: none;
    border-color: #666;
}

#mem_tbl{
    font-family: "Karla", sans-serif;
    border-collapse: separate;
    border-spacing: 2px;
}
#mem_tbl tr{cursor: pointer;}
@media (hover: hover) {
    #mem_tbl tr:hover{
        box-shadow: 0 0 5px #111;
        position: relative;
        z-index: 10;
        transform: translateY(-1px);
    }
    #mem_tbl tr.mem_tbl_hd:hover{
        box-shadow: none;
        position: relative;
        z-index: 1;
        transform: translateY(0);
    }
    #mem_tbl tr.mem_tbl_hd th:hover{background-color: #444;}
    #mem_tbl tr:hover .mem_img img{
        transform: scale(1.2);
        box-shadow: 0 0 5px #111;        
    }
    .sortReset_btn button:hover {box-shadow: 0 5px 5px rgb(0 0 0 / 20%);}
}
#mem_tbl tr.nogizaka{background-color: thistle;}
#mem_tbl tr.sakurazaka{background-color: lightpink;}
#mem_tbl tr.keyakizaka{background-color: #6dd26d;}
#mem_tbl tr.hinatazaka{background-color: lightblue;}
#mem_tbl tr.former{color: #666;}
#mem_tbl thead{
    position: sticky;
    top: 64px;
    z-index: 45;    
}
#mem_tbl th{
    background-color: #111;
    color: #fff;
    font-size: 10.5px;
    text-align: center;
    line-height: 1.0em;
    padding: 0.5em 0.25em;  
    border-bottom: solid 2px #eee;
}
#mem_tbl td{
    padding: 6px;
    font-size: 12px;
    text-transform: capitalize;
    text-align: center;
}
#mem_tbl td.mem_w5{width: 5%;}
#mem_tbl td.mem_img{
    box-sizing: border-box;
    line-height: 0;
    padding: 0;
    aspect-ratio: 4 / 5;
    background-color: #444;
}
.mem_img img{
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}
.mem_group::after{content: "46";}
.mem_name h3,.mem_name h4{
    text-align: left;
    text-indent: 10px;
}
.mem_name h3{
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 20px;
    font-weight: normal;    
}
.mem_name h4{
    font-family: "游ゴシック Medium", "Yu Gothic Medium", "YuGothicM", "游ゴシック体", "YuGothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    font-size: 10px;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.25em;
    margin-top: -3px;
}
.mem_age{font-weight: bold;}
.mem_height::after{content: "cm";}
.mem_pl{line-height: 1.0em;}
.mem_pl::after{
    font-size: 9px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px #111;
}
#profCard{
    width: 320px;
    font-family: "Karla", sans-serif;
    font-size: 12px;
    box-shadow: 0 0 5px #111;
}
.card_hd{
    background: linear-gradient(135deg, #667eea, #764ba2);
    padding: 15px;
    border-radius: 5px 5px 0 0;
    text-align: center;
    color: #fff;
    position: relative;
}
.card_img{
    width: 45%;
    aspect-ratio: 1 / 1;
    background: rgba(255,255,255,0.2);
    border: 2px solid rgba(255,255,255,0.3);
    margin: 0 auto 1em;
    padding: 2px;
    line-height: 0;
}
.card_img img{width: 100%;}
.card_group{
    font-size: 10.5px;
}
.card_name h3{
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 24px;
    font-weight: normal;
    letter-spacing: 0.5px;
}
.card_name h4{
    font-size: 10.5px;
    color: #ccc;
    font-weight: normal;
    letter-spacing: 0.5px;
}
.card_opt{
    background-color: #fff;
    font-family: "Roboto Condensed", sans-serif;
    color: #667eea;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.25em 1.5em;
    border-radius: 20px;
    position: absolute;
    top: 8px; right: 8px;
}
.card_box{
    background-color: #fff;
    padding: 15px;
    border-radius: 0 0 5px 5px;
}
.card_sns{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    column-gap: 10px;
}
.card_sns li{
    font-size: 9px;
    text-align: center;
}
.card_sns li a{
    font-size: 14px;
    color: #fff;
    width: 32px;
    height: 32px;
    background-color: #0e77d0;
    border-radius: 50%;
    margin: 0 auto 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s;
}
@media (hover: hover) {
    .card_sns li a:hover{
        background-color: #0b67b6;
        transform: translateY(-1px);
    }
}
.card_info{
    margin: 1em 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.card_info li{
    font-size: 10.5px;
    color: #666;
    text-align: center;
}
.card_info li span{
    display: block;
    font-size: 12px;
    color: #111;
    font-weight: bold;
}
.card_height::after{content: "cm";}
.card_run::after{
    content: "seconds";
    font-size: 8.5px;
    color: #666;
    display: block;
    line-height: 0.5em;
}
.card_mid{
    background: #e8f4f8;
    padding: 8px;
    border-radius: 5px;
    color: #0e77d0;
    margin-bottom: 1em;
}
.card_per_ttl{
    font-weight: bold;
    text-align: center;
}
.card_period{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    font-size: 10.5px;
}
.card_period li{
    color: #666;
    text-align: center;
}
.card_period li span{
    display: block;
    color: #0e77d0;
    font-weight: bold;
}
.card_per_ymd{letter-spacing: 1px;}
.card_pb_ttl{
    font-weight: bold;
    text-align: center;
    margin-bottom: 5px;
}
.card_pb{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    gap: 10px;
}
.card_pb li{width: calc((100% - 20px) / 4);}
.card_pb li a{
    display: block;
    font-size: 9.5px;
    color: #666;
    line-height: 1.2em;
    transition: 0.3s;
}
.card_pb li a p{
    width: 100%;
    aspect-ratio: 1 / 1;
    background-color: #ccc;
    margin-bottom: 3px;
    border-radius: 5px;
    line-height: 0;    
}
.card_pb li a img{
    display: block;
    width: 100%;
    border-radius: 5px;
    transition: 0.3s;
}
@media (hover: hover) {
    .card_pb li a:hover{
        color: #0e77d0;
        text-decoration: underline;
    }
    .card_pb li a:hover p img{filter: saturate(1.5);}
}



/*photobook*/
#pb_head{
    width: 100%;
    height: 320px;
    background-color: #fff;
    box-shadow: 0 0 3px rgba(20, 25, 28, 0.1);
}
.pbSlide_info{
    padding: 15px 40px 15px 0;
}
.pbSlide_name{
    font-family: "Play", sans-serif;    
    font-size: 12px;
    color: #7E7E7E;    
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
}
.pbSlide_ttl{
    font-family: 'Times New Roman', serif;
    font-size: 36px;
    font-weight: 700;
    color: #2C2C2C;
    line-height: 1.0em;
    letter-spacing: 2px;
    margin: 15px 0 25px;
}
.pbSlide_infoList{
    font-family: "Karla", sans-serif;
    font-size: 12px;
    color: #7e7e7e;
    margin-bottom: 15px;
}
.pbSlide_infoList dt{
    font-size: 10.5px;
    color: #eee;
}

#pb_tbl{
    font-family: "Karla", sans-serif;
    font-size: 12px;    
    border-collapse: separate;
    border-spacing: 2px;
    margin-top: -20px;
}
#pb_tbl caption{
    font-size: 14px;
    font-weight: bold;
    text-align: right;
    margin-right: 1em;
    margin-bottom: 5px;
}
#pb_tbl thead tr{
    position: sticky;
    top: 64px;
}
#pb_tbl thead tr th{
    font-size: 10.5px;
    color: #fff;
    line-height: 1.2em;
    background-color: maroon;
    padding: 1em;
    border-bottom: solid 2px #eee;
    cursor: pointer;
    transition: 0.3s;
}
@media (hover: hover) {
    #pb_tbl thead tr th:hover{background-color: firebrick;}
}
#pb_tbl thead tr th.w10{width: 10%;}
#pb_tbl thead tr th.w15{width: 15%;}
#pb_tbl thead tr th.w20{width: 20%;}
#pb_tbl thead tr th.w25{width: 25%;}
#pb_tbl tr.nogizaka .pb_group::after{content: "N";}
#pb_tbl tr.ex-nogizaka .pb_group::after{content: "Ex-N";}
#pb_tbl tr.sakurazaka .pb_group::after{content: "S";}
#pb_tbl tr.ex-sakurazaka .pb_group::after{content: "Ex-S";}
#pb_tbl tr.keyakizaka .pb_group::after{content: "K";}
#pb_tbl tr.ex-keyakizaka .pb_group::after{content: "Ex-K";}
#pb_tbl tr.hinatazaka .pb_group::after{content: "H";}
#pb_tbl tr.ex-hinatazaka .pb_group::after{content: "Ex-H";}
#pb_tbl tr.hiraganakeyaki .pb_group::after{content: "HK";}
#pb_tbl tr.nogizaka,#pb_tbl tr.ex-nogizaka{background-color: thistle;}
#pb_tbl tr.sakurazaka,#pb_tbl tr.ex-sakurazaka{background-color: lightpink;}
#pb_tbl tr.keyakizaka,#pb_tbl tr.ex-keyakizaka{background-color: #6dd26d;}
#pb_tbl tr.hinatazaka,#pb_tbl tr.ex-hinatazaka{background-color: lightblue;}
#pb_tbl tr.hiraganakeyaki{background-color: lightgreen;}
#pb_tbl td{    
    font-weight: 600;
    text-align: center;
    line-height: 1.2em;
    padding: 0.75em 1em;
}
#pb_tbl td span{
    display: block;
    font-family: "游ゴシック Medium", "Yu Gothic Medium", "YuGothicM", "游ゴシック体", "YuGothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    font-size: 9.5px;
    color: #33333395;
    letter-spacing: 0.5px;
    margin-top: 0.25em;
}
.pb_img{width: 6%;}
.pb_img a{
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    line-height: 0;
}
.pb_img a img{
    width: 100%;
    box-shadow: 0 0 5px #111;
}
@media (hover: hover) {
    .pb_img a:hover img{transform: scale(2.4);}
}
#pb_tbl td.pb_bold h3, #pb_tbl td.pb_bold h4{
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    text-align: left;    
}
.pb_x{width: 28px;}
.pb_x a{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    color: #fff;
    background-color: #111;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    transition: 0.3s;
}
@media (hover: hover) {
    .pb_x a:hover{
        background-color: #444;
        transform: translateY(-1px);
    }
}
.pb_num{
    font-family: "Quantico", sans-serif;
    font-size: 12px;
    color: #33333395;
    font-weight: normal;
    font-style: italic;
}
.pb_ttl::after{content: "k";}
.pb_ttl[href="xxx"]::after{content: "";}



/*history*/
.hst_nav{
    width: 100%;
    padding-top: 30px;
    margin-bottom: 30px;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
}
.hst_nav .hst_btn{
    padding: 0.75em 2em;    
    border: none;
    background-color: #ccc;
    box-shadow: 0 0 6px #111 inset;
    font-family: "Karla", sans-serif;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
}
#select_n_cur{margin-right: 5px;}
.hst_nav .hst_btn.hst_check{
    box-shadow: none;
    transform: scale(1.1);
    background-color: #666;
    color: lightgoldenrodyellow;    
    text-shadow: 0 0 8px lightgoldenrodyellow;
}
.hst_list{
    width: 70%;
    margin: 0 auto;
    padding: 30px 0 50px;
    font-family: 'Jost', sans-serif;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}
.hst_sort{
    box-sizing: border-box;
    width: 100%;
    padding-right: 5px;
    display: flex;
    flex-flow: row wrap;
    justify-content: right; 
    gap: 5px;    
}
.hst_sort_btn{
    box-sizing: border-box;
    padding: 0.5em 1.5em;
    font-size: 10.5px;
    color: #fff;
    letter-spacing: 0.5px;
    background-color: #444;
    border-radius: 15px;
    cursor: pointer;
    transition: 0.3s;
}
@media (hover: hover) {
    .hst_sort_btn:hover{background-color: #666;}
}
.hst_Box{
    box-sizing: border-box;
    width: 100%;
    padding: 10px 15px;
    background-color: #222;
    border: solid 10px #fff;
    box-shadow: 0 0 10px #111;
}
.hst_Box.former{background-color: #444;}
.hstList_hd{
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    border-bottom: solid 1px #999;
    padding: 0 5px 10px;
    margin-bottom: 10px;
}
.hstList_info{
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    column-gap: 10px;
}
.nogizaka .hstList_info{color: thistle;}
.sakurazaka .hstList_info{color: lightpink;}
.keyakizaka .hstList_info{color: #6dd26d;}
.hinatazaka .hstList_info{color: lightblue;}
.hst_gen{
    border: solid 3px;
    padding: 0.25em 0.5em;
    font-family: 'Impact', sans-serif;
    font-size: 16px;
}
.hst_img{
    box-sizing: border-box;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-size: cover;
    border: solid 4px #aaa;
    box-shadow: 0 0 6px #111;
}
.hst_name{
    font-family: "Calistoga", serif;
    font-size: 24px;
    font-weight: normal;
    letter-spacing: 0.25px;
    line-height: 1.4em;
}
.hst_name span{
    display: block;
    font-family: "游ゴシック Medium", "Yu Gothic Medium", "YuGothicM", "游ゴシック体", "YuGothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    font-size: 10px;
    color: #cccccccc;
    letter-spacing: 0.25em;
}
.hstList_sum{
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    column-gap: 10px;
}
.hstList_sum li{
    background-color: #fff;
    border: ridge 4px #aaa;
    border-radius: 5px;
    box-shadow: 0 0 3px #111 inset;
}
.hst_sum_hd{
    font-size: 10.5px;    
    color: #333;
    font-weight: 600;
    background-color: #aaa;
    padding: 0.25em 5px;
}
.hst_sum_d{
    text-align: center;
    font-family: 'Impact', sans-serif;
    font-size: 18px;
    color: #b57722;
    letter-spacing: 0.5px;
    padding: 2px 0;
}
.hst_rslt{
    display: flex;
    flex-flow: row wrap;
    gap: 10px 5px;
    padding: 0 5px;
}
.hst_rslt dd{
    box-sizing: border-box;
    width: 4.5%;
    padding: 1em 0 0;
    font-size: 9.5px;
    text-align: center;
    line-height: 1.0em;
    background-color: #000;
    color: #fff;
}
.hst_rslt dd a{
    display: block;
    color: #fff;
    letter-spacing: 1px;
    line-height: 1.0em;
    padding-bottom: 5px;
}
.hst_rslt dd.keyakiSG a{
    color: #6dd26d;
    letter-spacing: 0;
}
.hst_rslt dd a span{
    display: block;
    font-size: 10.5px;
    letter-spacing: 0.5px;
}
.hst_rslt dd.keyakiSG a span{color: #fff;}
@media (hover: hover) {
    .hst_rslt dd a:hover,.hst_rslt dd.keyakiSG a:hover span{color: #f89925;}
}
.hst_rslt dd b{
    display: block;
    box-sizing: border-box;
    padding: 0.25em 0;
    text-transform: uppercase;
    font-size: 14px;
    color: #111;
    border: solid 3px #111;
    background-color: #fff;
}
.hst_rslt dd.keyakiSG b{background-color: #6dd26d;}
.hst_rslt dd b.pos_c, .hst_rslt dd.keyakiSG b.pos_c{background-color: lightcoral;}
.hst_rslt dd b.pos_g{background-color: #aaa;}
.hst_rslt dd b.pos_u{background-color: lightblue;}
.hstList_btm{
    width: 100%;
    font-size: 9.5px;
    color: yellow;
    text-align: right;
    letter-spacing: 0.1em;
    margin-top: 1em;
}
/* データ読み込み中のスタイル */
.loading-message {
    text-align: center;
    padding: 20px;
    font-size: 16px;
    color: #666;
}
/* エラー表示用のスタイル */
.error-message {
    text-align: center;
    padding: 20px;
    font-size: 16px;
    color: #ff0000;
}



/*academic*/
.tesSlide_wrap{
    width: 100%;
    background-color: #fff;
}
.tesCar_img{
    width: 320px;
    aspect-ratio: 1 / 1;
    background-color: #444;
    line-height: 0;
}
.tesCar_img img{width: 100%;}
.tesCar_r{
    display: flex;
    flex-direction: column;
}
.tesCar_r_hd{
    box-sizing: border-box;
    width: 100%;
    height: calc(100% - 120px);
    padding: 15px;
    background-color: #182937;
    color: #fff;
    position: relative;
}
.tesCar_r_hd p{
    font-family: "Play", sans-serif;
    font-size: 12px;
    color: #ccc;
    letter-spacing: 1.5px;
    text-transform: capitalize;
    padding: 0 15px;
}
.tesCar_r_hd p span{
    margin-left: 0.5em;
    font-family: "Oswald", sans-serif;
    color: #182937;
    letter-spacing: 1px;
    font-weight: 600;
    letter-spacing: 3px;
    padding-left: 1.75em;
    position: relative; 
    z-index: 5;
}
.tesCar_r_hd p span::before{
    font-family: 'Font Awesome 6 Free';
    content: "\f091";
    color: goldenrod;
    font-weight: 900;
    font-style: normal;
    position: absolute;
    top: 1px; left: 0;
}
.tesCar_r_hd p span::after{
    content: "TOP 1";
    -webkit-text-stroke: 3px goldenrod;
    text-stroke: 3px goldenrod;
    position: absolute;
    top: 0; right: 0;
    z-index: -1;
}
.tesCar_r_hd p span.worst::before{color: #ff2969;}
.tesCar_r_hd p span.worst::after{
    content: "WORST 1";
    -webkit-text-stroke: 3px #ff2969;
    text-stroke: 3px #ff2969;
}
.tesCar_r_hd h3{
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 42px;
    font-weight: normal;
    letter-spacing: 1px;
    text-indent: 1em;
    transform: translateY(-5px);
}
.tesCar_r_img{
    box-sizing: border-box;
    width: 120px;
    aspect-ratio: 1 / 1;
    background-color: #444;
    line-height: 0;
    border: solid 8px #fff;
}
.tesCar_r_img img{width: 100%;}
.tesCar_list{
    width: calc(100% - 30px);
    display: grid;
    gap: 4px;
    position: absolute;
    bottom: 15px; left: 15px;
}
.tesCarList-5{grid-template-columns: repeat(5, 1fr) 2fr;}
.tesCarList-6{grid-template-columns: repeat(6, 1fr) 2fr;}
.tesCar_list dt, .tesCar_subList dt{
    font-family: "Karla", sans-serif;
    letter-spacing: 0.5px;
    line-height: 1.0em;
    text-align: center;
    padding: 0.5em 1em;
    background-color: #313c47;
    border-radius: 2px 2px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tesCar_list dt{font-size: 10.5px;}
.tesCar_subList dt{
    font-size: 7.5px;
    color: #fff;
    font-weight: 600;
}
.tesCar_list dt.total,.tesCar_subList dt.total{color: gold;}
.tesCar_list dd, .tesCar_subList dd{
    font-family: "Dangrek", sans-serif;    
    color: #111;
    background-color: #e1e3e5;
    padding: 0.25em 0;
    border-radius: 0 0 2px 2px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tesCar_list dd{font-size: 24px;}
.tesCar_subList dd{font-size: 12px;}
.tesCar_list dd.tesCar_ttl{
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 28px;
}
.tesCar_subList dd.tesCar_ttl{
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 16px;
}
.tesCar_list dd.pt_t, .tesCar_subList dd.pt_t{color: blue;}
.tesCar_list dd.pt_w, .tesCar_subList dd.pt_w{color: red;}
.tesCar_r_ft{
    height: 120px;
    display: grid;
    grid-template-columns: 120px auto 120px auto;
}
.tesCar_subBox{
    padding: 8px 0;
    position: relative;
}
.tesCar_subBox p{
    font-family: "Oswald", sans-serif;
    font-size: 10.5px;
    letter-spacing: 1px;
    font-weight: 600;
}
.tesCar_subBox p.tesCar_gold{color: darkgoldenrod;}
.tesCar_subBox p.tesCar_silver{color: #7e7e7e;}
.tesCar_subBox p.tesCar_bronds{color:firebrick;}
.tesCar_subBox h3{
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 24px;
    font-weight: normal;
    text-indent: 0.5em;
}
.tesCar_subList{
    width: 100%;
    display: grid;
    gap: 2px;
    position: absolute;
    bottom: 8px; left: 0;
}

.tesJump{
    display: flex;
    justify-content: center;
    margin-top: 30px;
    font-family: "Karla", sans-serif;
    font-size: 14px;
    font-weight: 600;
    column-gap: 2em;
}
.tesJump a{
    position: relative;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    color: #0e77d0;
    padding: 0.25em 1em;
    transition: 0.3s;
    border: 1px solid #ddd;
    border-radius: 100vh;
    background: #fbfbfc;
    background: -webkit-gradient(linear,left top,left bottom,from(#fbfbfccc),to(#dcddde99));
    background: -webkit-linear-gradient(top, #fbfbfccc 0%, #dcddde99 100%);
    background: linear-gradient(180deg, #fbfbfccc 0%, #dcddde99 100%);
    -webkit-box-shadow: -1px -5px 6px #00000033, 3px 3px 5px #ffffff66,
        0 10px 10px #0000001a, inset 0 -4px 5px #0000001a;
    box-shadow: -1px -5px 6px rgba(0, 0, 0, 0.2), 3px 3px 5px #ffffff66,
        0 10px 10px #0000001a, inset 0 -4px 5px #0000001a;
}
.tesJump a span{
    display: inline-block;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.tesJump a span::before{
    display: inline-block;
    font-family: 'Font Awesome 6 Free';
    content: "\f0da";
    font-weight: 900;
    font-style: normal;
    margin-right: 0.5em;
    transition: 0.3s;
}
@media (hover: hover) {
    .tesJump a:hover{
        box-shadow: -1px -5px 6px rgba(0, 0, 0, 0.2), 3px 3px 5px #ffffff66,
        0 10px 10px #0000001a, inset 0 -4px 5px #0000001a,
        inset 0 3px 3px #0000002e;
    }
    .tesJump a:hover span {transform: scale(0.96);}
    .tesJump a:hover span::before{transform: rotate(90deg);}
}

.tes_hd_wrap{
    box-sizing: border-box;
    width: 50%;
    background-color: #fff;
    padding: 0.5em 1em;
    border: solid 1px #333333aa;
    box-shadow: 5px 5px 2px #11111166;
}
.tes_head{
    border-left: solid 8px;
    padding-left: 1em;
}
.nogichu .tes_head{border-color: purple;}
.sokosaku .tes_head{border-color: palevioletred;}
.hinaai .tes_head{border-color: dodgerblue;}
.keyakake .tes_head{border-color: forestgreen;}
.ganaoshi .tes_head{border-color:seagreen;}
.tes_head h6{
    font-family: "Oswald", sans-serif;
    font-size: 24px;
    font-weight: 600;
    margin-top: -5px;
}
.tes_head span{
    display: block;
    font-family: "Play", sans-serif;
    font-size: 12px;
    color: red;
    font-weight: 600;
    text-transform: capitalize;
}
.tes_head span.tes_hd_date{
    color: #666;
    text-align: right;
}
.tes_tbl{
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 60px;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 0 3px #111;
    border-collapse: separate;
    border-spacing: 3px;
}
.tes_tbl caption{
    text-align: right;
    padding-right: 5px;
    padding-bottom: 15px;
    font-family: "Play", sans-serif;
    font-size: 12px;
    color: #8b0000cc;
    font-weight: 600;
    letter-spacing: 0.5px;
    font-style: italic;
    text-decoration: underline 1.5px #8b0000cc;
    text-underline-offset: 6px;
}
.tesTbl_btn{
    display: inline-block;
    font-family: "Oswald", sans-serif;
    font-size: 12px;
    color: #eee;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-left: 1.5em;
    padding: 0.75em 2em;
    border-radius: 15px;
    background-color: #333333aa;
    box-shadow: 0 0 8px #333333aa;
    cursor: pointer;
    transition: 0.3s;
}
@media (hover: hover) {
    .tesTbl_btn:hover{
        transform: translateY(1px);
        background-color:#333333dd;
        box-shadow: 0 0 3px #333333aa;
    }
}
.tes_tbl thead{
    position: sticky;
    top: 64px;
    z-index: 11;
}
.tes_tbl th{
    font-family: "Karla", sans-serif;
    font-size: 10.5px;
    color: #fff;
    line-height: 1.0em;
    background-color: maroon;
    text-align: center;
    box-sizing: border-box;
    padding: 1em 5px;
    width: 8%;
    transition: 0.3s;
}
.tes_tbl th.tesTbl_mem_w{
    width: 40%;
    background-color: #111;
    pointer-events: none;
}
.tes_tbl th.testbl_ttl_w{
    width: auto;
    color: gold;
    letter-spacing: 1px;
}
.tes_tbl th:hover{background-color:firebrick;}
.tes_tbl tbody tr{cursor: pointer;}
.tes_tbl tbody td{
    background-color: #c5c5c5;
    font-family: "Dangrek", sans-serif;
    font-size: 18px;
    text-align: center;
}
.tes_tbl tbody tr:nth-child(odd) td{background-color: #e1e3e5;}
.tes_tbl tbody td.pt_t{color: blue;}
.tes_tbl tbody td.pt_w{color: red;}
.tes_tbl tbody td.tesTbl_mem{
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    padding: 5px 1em;
    font-weight: bold;
}
.testTbl_rank{
    box-sizing: border-box;
    width: 32px; height: 32px;
    border: solid 4px #444;
    border-radius: 50%;
    font-family: "Calistoga", serif;
    font-size: 14px;
    color: #444;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tesTbl_mem h3{
    font-family: "Calistoga", serif;
    font-size: 18px;
    letter-spacing: 0.5px;
    line-height: 1.2em;
}
.tesTbl_mem h3 i{
    font-size: 12px;
    color: #11111199;
    letter-spacing: 1px;
    font-style: normal;
    margin-left: 0.5em;
}
.tesTbl_mem h3 span{
    display: block;
    font-family: "游ゴシック Medium", "Yu Gothic Medium", "YuGothicM", "游ゴシック体", "YuGothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    font-size: 10px;
    color: #11111199;
    letter-spacing: 0.25em;
    text-align: center;
}
.testbl_img{
    box-sizing: border-box;
    display: block;
    width: 36px; height: 36px;
    border-radius: 50%;
    box-shadow: 0 0 5px #111;    
    transition: 0.3s;
}
.testbl_img img{
    width: 100%;
    object-fit: cover;
    border-radius: 50%;
}
@media (hover: hover) {
    .tes_tbl tbody tr:hover .testbl_img{
        transform: scale(1.8);
        position: relative;
        z-index: 10;
    }
}
.testbl_ttl span{
    display: inline-block;
    font-family: Impact, 'Haettenschweiler', 'Arial Narrow Bold', sans-serif;
    font-size: 24px;
}



/*video*/
#bdTab1, #bdTab2, #bdTab3{padding-bottom: 30px;}
.bd_head{
    width: 100%;
    background-color: #111;
    padding: 30px 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: start;
}
.bd_head li{
    width: calc(100% / 4);
}
.bd_head li a{
    display: inline-block;
    width: 70%;
    aspect-ratio: 45 / 11;
    margin: 0 15%;
    overflow: hidden;
}
.bd_head li a img{
    width: 100%;
    transform: scale(1.0);
    transition: 0.5s;
}
@media (hover: hover) {
    .bd_head li a:hover img{transform: scale(1.2);}
}
.bd_head .bd_hd_txt{
    font-family: "Roboto Condensed", sans-serif;
    font-size: 14px;
    color: #e1e3e5;
    letter-spacing: 0.5px;
    line-height: 1.8em;
    width: 70%;
    margin: 0 15%;
}
.bd_filter{
    padding-top: 60px;
    width: calc(70% - 30px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    align-items: center;
    column-gap: 3px;    
}
.bd_filter li .bd_fil_btn{
    display: block;
    font-family: "Oswald", sans-serif;
    font-size: 14px;
    color: #fff;
    letter-spacing: 1px;
    text-align: center;
    background-color: #495057;
    padding: 1em 2em;
    border-radius: 15px 15px 0 0;
    cursor: pointer;
    position: relative;
    z-index: 3;
    transition: 0.3s;
}
.bd_filter li .bd_fil_btn.active{    
    color: #495057;
    background-color: #fff;
    transform: translateY(5px);
    pointer-events: none;
}
.bdList{
    display: flex;
    flex-direction: column;
    row-gap: 60px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 3px #11111166;
    padding: 60px 30px;
    margin: 0 15%;
}
.bd_ttl{
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    color: #fff;
    background-color: #111;
    border-radius: 5px;
    border-left: solid 45px orangered;
    padding: 0.75em 1em;
}
.bd_hd{
    font-family: "Roboto Condensed", sans-serif;
    font-size: 12px;
    font-weight: 600;
    padding: 15px 30px 0;
    display: flex;
    justify-content: space-between;
}
.bd_genre::after{
    background-color: #ccc;
    padding: 0.25em 1.5em;
    border-radius: 20px;
    font-size: 10.5px;
}
.bdList_box.concert .bd_genre::after{content: "LIVE / CONCERT";}
.bdList_box.tvprogram .bd_genre::after{content: "TV PROGRAM";}
.bdList_box.mv .bd_genre::after{content: "MUSIC VIDEO";}
.bdList_box.documentary .bd_genre::after{content: "DOCUMENTARY";}
.bdList_box.movie .bd_genre::after{content: "MOVIE";}
.bdList_box.tvdrama .bd_genre::after{content: "TV DRAMA";}
.bdList_box.stage .bd_genre::after{content: "STAGE";}
.bdList_box.others .bd_genre::after{content: "OTHERS";}
.bd_date{
    color: #11111199;
    font-style: italic;
}
.bd_date::before{content: "RELEASE : ";}
.bd_coverlist{
    padding: 15px 30px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    align-items: start;
    gap: 10px;
}
.bd_coverlist li{
    font-family: "Roboto Condensed", sans-serif;
    font-size: 12px;
    text-align: center;
    line-height: 1.2em;
}
.bd_coverlist li a{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background-size: cover;
    background-size: 30%;
    line-height: 0;
    border: solid 1px #11111166;
    margin-bottom: 1em;
    transition: 0.3s;
}
.bd_coverlist li a img{
    width: 100%;
    height: 100%;
    object-fit:contain;
    transform: scale(1.0);
    transition: 1.0s;
}
.bd_coverlist li b{
    display: block;
    font-size: 10.5px;
    color: #fff;
    font-weight: normal;
    background-color: #333;
    padding: 1px;
    margin-bottom: 0.25em;
}
.bd_ft{
    background-color: #d8dadb;
    padding: 15px;
    border-radius: 5px;
    margin: 0 15px;
    font-family: "Oswald", sans-serif;
    font-size: 12px;
    display: flex;
    column-gap: 2em;
}
.bd_tube{
    color: #0e77d0;
    letter-spacing: 1px;
}
.bd_tube i{
    color: red;
    font-size: 14px;
    margin-right: 0.25em;
}
@media (hover: hover) {
    .bd_filter li .bd_fil_btn:hover{
        background-color: #7e7e7e;
    }
    .bd_coverlist li a:hover{
        border: solid 3px #0e77d0;
    }
    .bd_coverlist li a:hover img{
        transform: scale(1.5);
    }
    .bd_tube:hover{
        color: #0b67b6;
        text-decoration: underline;
    }
}