html,body{/*font-family:Verdana,sans-serif;*/font-size:12px;line-height:1.5}

html{overflow-x:hidden}

/*h1,h2,h3,h4,h5,h6,.w3-slim,.w3-wide{font-family:"Segoe UI",Arial,sans-serif}*/





#main{

    color: #fff!important;

    background-color: #2c2c2c!important;

    margin: 0;

    font-family: "Arial", "メイリオ";

}





.container{

    max-width: 640px;

    width:80%;

    margin:0 auto;

    text-align: center;

}



.logo_top{

    padding-top: 50px!important;

    padding-bottom: 80px!important;

    width:60%;

}



a:link { color: #ffffff; text-decoration-line: none; }

a:visited { color: #ffffff; text-decoration-line: none; }





.txt_ye{

    color: #eeff00;

}



.txt_red{

    color: #ff2b2b;

}



.txt_red2{

    color: #ff5623;

}



.txt_blue{

    color: #7499ff;

}



.txt_bluegreen {

    color: #74ffe5;

}



.txt_green{

    color: #94ff74;

}



.txt_purple{

    color: #ce52ff;

}



.txt_gray{

    color: #b3b3b3;

}





.txt_gold{

    background: linear-gradient(45deg, #8c7537 0%, #dbb00b 45%, #fde79d 70%, #dbb10c 85%, #bc7f04 90% 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}

  





.txt_gray{

    color: #b3b3b3;

}



.txt_s{

    font-size: 13px;

    margin: -3% 0 6% 18%;

}



.txt_ss{

    font-size: 13px;

}







/*======new=====*/



.new{

    position: relative;

    text-align: center;

    margin-bottom: 30px;

}



.new .caution{

    color: #fff;

    background-color: #e70000;

    width:15%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 15%;

    transform: translate( 40%,-50%);

 }



 .new .caution_DeNA{

    color: #fff;

    background-color: #2c19f8;

    width:15%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 15%;

    transform: translate( 40%,-50%);

 }



 .new .caution_softbank{

    color: #4e4e4e;

    font-weight: 600;

    font-size: 80%;

    background-color: #caaf01;

    width:15%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 15%;

    transform: translate( 40%,-50%);

 }



 .new .caution_reiwa{

    color: #ffffff;

    font-weight: 600;

    background-color: #008209;

    width:15%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 15%;

    transform: translate( 40%,-50%);

 }







.new p{

    margin:7% auto 5%;

}



.new .news{

    margin: 4% 0 0 18%;

    font-size: 20px;

}



.new .news_s{

    margin: 4% 0 0 18%;

    font-size: 16px;

}





/*======new2=====*/



.under_news{

    margin-top: 40px;

}



.new2{

    position: relative;

    text-align: center;

    margin-bottom: 15px;

}



.new2 .caution{

    color: #fff;

    background-color: #008a2e;

    width:15%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 15%;

    transform: translate( 40%,-50%);

 }





 .new2 .caution2{

    color: #fff;

    background-color: #006a8a;

    width:15%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 15%;

    transform: translate( 40%,-50%);

 }





.new2 p{

    margin:7% auto 5%;

}



.new2 .news{

    margin: 2% 0 0 18%;

    font-size: 16px;

}



.new2 .news_s{

    margin: 4% 0 0 18%;

    font-size: 16px;

}













/*======schedule=====*/



.schedule{

    background-color: #2f2f2f;

}





.schedule .title{

    font-size: 18px;

    font-weight: 700;

}



.schedule .day{

    position: relative;

    margin: 17px 0;

}



.schedule .date{

    color: #fff;

    background-color: #3200bb;

    width:23%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(60%,-50%);

}



.schedule .date p{

    margin:7% auto ;

    font-size: 12.8px;

}





.schedule .date_b{

    color: #fff;

    background-color: #315481;

    width:21%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(12%,-50%);

}



.schedule .date_b p{

    margin:7% auto ;

    font-size: 12.8px;

}



.schedule .date_b p{

    margin:7% auto ;

    font-size: 12.8px;

}









.schedule .date_s{

    color: #fff;

    background-color: #0f1cd1;

    width:21%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(12%,-50%);

}



.schedule .date_sp{

    color: #fff;

    background-color: #2f91b8;

    width:21%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(12%,-50%);

}



.schedule .date_s p{

    margin:7% auto ;

    font-size: 12.8px;

}



.schedule .date_sp p{

    margin:7% auto ;

    font-size: 12.8px;

}



.schedule .date_ev{

    color: #fff;

    background-color: #00b14d;

    width:21%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(12%,-50%);

}



.schedule .date_ev p{

    margin:7% auto ;

    font-size: 12.8px;

}



.schedule .date_ev .place3{

    font-size: 10.8px;

}





.schedule .date_z{

    color: #fff;

    background-color: #1d5bb8;

    width:21%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(12%,-50%);

}



.schedule .date_z p{

    margin:7% auto ;

    font-size: 12.8px;

}









.schedule .place{

    margin: 0 0 0 18%;

    font-size: 18px;

    letter-spacing: 0.08rem;

}



.schedule .place3{

    margin: 0 0 0 18%;

    font-size: 18px;

    letter-spacing: -0.05rem;

    color: #bebebe !important;



}





.schedule .place p{

    font-size: 9.5px;

}



.schedule .calender{

    font-size: 12px;

}









/*======event=====*/



.event{

    padding:7% 0;

    margin-top:0%;

}





.event .title{

    font-size: 23px;

    margin:3% auto 7%;

    font-weight: 700;

    letter-spacing: 0.1rem;

}



.event .day{

    position: relative;

    margin-bottom: 20px;

}



.event .date{

    color: #fff;

    background-color: #00643e;

    width:23%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(60%,-50%);



}



.event .date p{

    margin:7% auto ;

    font-size: 12.8px;

}



.event .place{

    margin: 0 0 0 13%;

    font-size: 19.5px;

    letter-spacing: 0.08rem;

}



.event .party{

    margin: 0 0 0 13%;

    font-size: 17px;

}





.event .place p{

    font-size: 9.5px;

}













/*======club=====*/



.club{

    background-color: #2f2f2f;

}





.club .title{

    font-size: 18px;

    font-weight: 700;

    letter-spacing: 0.25rem;

}







.club .day{

    position: relative;

}



.club .date{

    color: #fff;

    background-color: #00643e;

    width:23%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(60%,-50%);



}



.club .date p{

    font-size: 12.8px;

}



.club .place{

    margin: 0 0 0 13%;

    font-size: 19.5px;

    letter-spacing: 0.08rem;

}



.club .party{

    margin: 0 0 0 13%;

    font-size: 17px;

}



.club .team{

    margin: 0 auto 3%;

    font-size: 17px;

}





.club .place p{

    font-size: 9.5px;

}



.club .sauna{

    background: rgb(255,53,106);

    background: linear-gradient(0deg, rgb(255, 154, 87) 0%, rgba(255,213,49,1) 100%);

    background: -webkit-linear-gradient(0deg, rgba(255, 154, 87) 0%, rgba(255,213,49,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    font-weight: 900;

}





.club .dior{

    background: rgb(139,255,214);

    background: linear-gradient(0deg, rgba(139,255,214,1) 0%, rgba(154,230,255,1) 100%);

    background: -webkit-linear-gradient(0deg, rgba(139,255,214,1) 0%, rgba(154,230,255,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}





.club .anime{

    background: rgb(228,255,16);

    background: linear-gradient(0deg, rgba(228,255,16,1) 0%, rgba(49,255,161,1) 100%);

    background: -webkit-linear-gradient(0deg, rgba(228,255,16,1) 0%, rgba(49,255,161,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.club .karaoke{

    background: rgb(255, 235, 13);

    background: linear-gradient(180deg, rgb(255, 215, 69) 0%, rgb(251, 255, 14) 100%);

    background: -webkit-linear-gradient(180deg, rgba(255, 215, 69,1) 0%, rgba(251, 255, 14,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.club .sweets{

    background: rgb(255,83,134);

    background: linear-gradient(180deg, rgba(255,83,134,1) 0%, rgba(255,94,236,1) 100%);

    background: -webkit-linear-gradient(180deg, rgba(255,83,134,1) 0%, rgba(255,94,236,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}





.club .training{

    background: rgb(19, 157, 255);

    background: linear-gradient(180deg, rgb(56, 247, 244) 0%, rgb(19, 157, 255) 100%);

    background: -webkit-linear-gradient(180deg, rgba(56, 247, 244,1) 0%, rgba(19, 157, 255,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.club .child{

    background: rgb(255, 187, 196);

    background: linear-gradient(180deg, rgb(255, 187, 196) 0%, rgb(255, 250, 187) 100%);

    background: -webkit-linear-gradient(180deg, rgba(255, 187, 196,1) 0%, rgba(255, 250, 187,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}









/*======document=====*/



.document{

    background-color: #2f2f2f;

}





.document .title{

    font-size: 18px;

    font-weight: 700;

    letter-spacing: 0.25rem;

}



.title_s{

    font-size: 17px;

    font-weight: 700;

    letter-spacing: 0.25rem;

    margin-left: 10%;

}





.document .title2{

    font-size: 18px;

    font-weight: 700;

}





.document .file{

    margin: 2% 0 0 0;

    font-size: 18px;

    letter-spacing: 0.08rem;

}



.document .WQ_t1{

    margin: 0 0 5% 0;

    font-size: 20px;

    letter-spacing: 0.08rem;

    font-weight: 800;

}





.document .file2{

    font-size: 18px;

    letter-spacing: 0.25rem;

}





/*======DAO=====*/



.dao{

    /*background-color: #2f2f2f;*/

}





.dao .title{

    font-size: 18px;

    font-weight: 700;

    letter-spacing: 0.25rem;

}



.dao .line{

    font-size: 18px;

    letter-spacing: 0.15rem;

    margin: 5px 0;

}





.dao .line2{

    font-size: 18px;

    letter-spacing: 0.15rem;

    margin-bottom: 0px !important;

}



.dao p{

    font-size: 14px;

    letter-spacing: 0rem;

    margin-top: 0px !important;

}











/*======insta=====*/



.insta{

    padding:7% 0 3%;

    font-size: 18px;

    /*background-color: #2f2f2f;*/

}



.insta-up{

    padding:3% 0 3%;

    font-size: 18px;

    /*background-color: #2f2f2f;*/

}



.insta .title{

    font-weight: 700;

    letter-spacing: 0.25rem;



}



.insta .ico{

    margin: 0 1% 0 0;

    font-size: 120%;

    background: rgb(255,189,17);

    background: linear-gradient(45deg, rgba(255,189,17,1) 0%, rgba(255,100,77,1) 29%, rgba(255,77,132,1) 63%, rgba(197,12,255,1) 100%);

    background: -webkit-linear-gradient(45deg, rgba(255,189,17,1) 0%, rgba(255,100,77,1) 29%, rgba(255,77,132,1) 63%, rgba(197,12,255,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.insta-up .ico{

    margin: 0 1% 0 0;

    font-size: 120%;

    background: rgb(255,189,17);

    background: linear-gradient(45deg, rgba(255,189,17,1) 0%, rgba(255,100,77,1) 29%, rgba(255,77,132,1) 63%, rgba(197,12,255,1) 100%);

    background: -webkit-linear-gradient(45deg, rgba(255,189,17,1) 0%, rgba(255,100,77,1) 29%, rgba(255,77,132,1) 63%, rgba(197,12,255,1) 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.insta .gen{

    margin: 2% 0 0 0;

    letter-spacing: 0.15rem;

}



.insta .has{

    margin: 2% 0 0 0;

    letter-spacing: 0.15rem;

}



.insta .tak{

    margin: 2% 0 0 0;

    letter-spacing: 0.15rem;

}









/*======calender=====*/



.calender{

    max-width: 800px;

    width:95%;

    margin: 3% auto 15%;

    text-align: center;

}



































#sp-fixed-menu{

    display: none;

}















/*====================================================

====================================================*/



@media (max-width: 640px) {







.container{

    width: 100%;

    margin:0 auto;

}

.logo_top{

    padding-top: 32px!important;

    padding-bottom: 30px!important;

    width:80%;

}



.new .caution{

    color: #fff;

    background-color: #e70000;

    width:22%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(25%,-50%);

 }



 .new .caution_DeNA{

    color: #fff;

    background-color: #2c19f8;

    width:22%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(25%,-50%);

 }



 .new .caution_softbank{

    color: #4e4e4e;

    font-weight: 600;

    font-size: 80%;

    background-color: #e3c91d;

    width:22%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(25%,-50%);

 }



 .new .caution_reiwa{

    color: #ffffff;

    font-weight: 600;

    background-color: #008209;

    width:22%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(25%,-50%);

 }



 .new2 .caution{

    width:22%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(25%,-50%);

 }



 .new2 .caution2{

    width:22%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 0%;

    transform: translate(25%,-50%);

 }



 .new .news{

    line-height: 21px;

 }



 .schedule .date{

    color: #fff;

    background-color: #3200bb;

    width:23%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 4.5%;

    transform: translate(-0%,-50%);



}



.event .date{

    color: #fff;

    background-color: #00643e;

    width:23%;

    border-radius: 5px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 4.5%;

    transform: translate(0%,-50%);



}







/*======btn SP=====*/







/*メニューをページ下部に固定*/

#sp-fixed-menu{

    display: block !important;

    position: fixed;

    width: 100%;

    bottom: 0px;

    font-size: 0;

    opacity: 0.95;

    z-index: 99;

    margin:0;

 }

 

 /*メニューを横並びにする*/

 #sp-fixed-menu ul{

    display: flex;

    list-style: none;

    padding:0;

    margin:0;

    width:100%;

 }

 

 #sp-fixed-menu li{

    justify-content: center;

    align-items: center;

    width: 50%;

    padding:0;

    margin:0;

    font-size: 21px;

    border-top: 1px solid #757575;

}

 

 /*左側メニュー*/

 #sp-fixed-menu li:first-child{

    background: rgb(27, 27, 27);

    /*background: linear-gradient(45deg, rgba(41,41,41,1) 0%, rgba(99,99,99,1) 100%); */

    border-right: 1px solid #fff;

}



 /*左側メニュー*/

 #sp-fixed-menu li:last-child{

    background: rgb(27, 27, 27);

    /*background: linear-gradient(45deg, rgba(41,41,41,1) 0%, rgba(99,99,99,1) 100%); */

}





 /*ボタンを調整*/

 #sp-fixed-menu li a{

    color: #ffffff;

    text-align: center;

    display:block;

    width: 100%;

    padding:4% 0 4%;

    letter-spacing: 0.08rem;

    text-decoration: none;

 }

 







}







/*======btn PC=====*/





@media (min-width: 641px) {



 #pc-fixed-btn{

    display: block !important;

    position: fixed;

    bottom:20px;

    right:5%;

    width:20%;

    max-width:200px;

 }



 #pc-fixed-btn .btn{

  color: #fff;

  background-color: #4b4b4b;

  border-radius: 15px;

  border-color: #a7a7a7;

  font-size: 150%;

  padding: 5% 20%;

 }

}













/*アコーディオン全体*/

.accordion-area{

    list-style: none;

    width: calc(96% - 20px );

    max-width: 900px;

    margin:0 auto;

    padding:0px;

}



.accordion-area li{

    margin: 7% 0 2%;

}



.accordion-area section {

  border: 1px solid #4e4e4e;

}



/*アコーディオンタイトル*/

.title {

    position: relative;/*+マークの位置基準とするためrelative指定*/

    cursor: pointer;

    font-size:1rem;

    font-weight: normal;

    padding: 0%;

    transition: all .5s ease;

}



/*アイコンの＋と×*/

.title::before,

.title::after{

    position: absolute;

    content:'';

    width: 15px;

    height: 3px;

    background-color: #ffffff;

    

}

.title::before{

    top:48%;

    left: 45px;

    transform: rotate(0deg);

    

}

.title::after{    

    top:48%;

    left: 45px;

    transform: rotate(90deg);



}



/*　closeというクラスがついたら形状変化　*/



.title.close::before{

  transform: rotate(45deg);

}



.title.close::after{

  transform: rotate(-45deg);

}



/*アコーディオンで現れるエリア*/

.box {

    display: none;/*はじめは非表示*/

    background: #303030;

    margin:3%;

    padding: 3%;

}





.WQ_1 {

    display: none;/*はじめは非表示*/

    background: #454545;

}







/*========= レイアウトのためのCSS ===============*/



h2{

    text-align: center;

    margin: 30px 0;

    font-size:1rem;

}







html { scroll-behavior: smooth;}