@charset "utf-8";

.spNone{ display:none!important;}
.pcNone{ display:block!important;}
p,li,dt,dd{ font-size: 100%;}

.dispFlex{ display:block;}
img{width:100%;height: auto;}

#pageHeader {padding-bottom: 0.4em; padding-top: 0.2em;}
#pageHeader .headerInner{padding: 0.5em;}
#pageHeader .headerInner h1 img{height:auto; width:100%; padding: 0; padding-right: 3%;}
#pageHeader .headerInner h1 { width:50%;padding:0.5em 0;}
#pageHeader .headerInner h1 img{ width:100%; height:auto;}
#pageHeader .header_btn{width: 40%;margin: 0.5em 0.5em 0;}
header .headerInner nav.naviBox{width:100%;height:100%;margin:0 auto;padding:20px 0 0 0;position:fixed;top:0;right:0;background:rgba(255,255,255,0.95);text-align:center;transform:translateX(100%);z-index: 9999;transition:all .6s;}
header .headerInner #menuBtn{display:block;width:60px;height: 40px;cursor:pointer;z-index:10000;background: url("/files/user/_/d_flare/img/menu_open.png")no-repeat;background-size: contain;max-width: 11vw;max-height: 7vw;}
header #menuBtn.active{top: 10px;background: url("/files/user/_/d_flare/img/menu_close.png")no-repeat;background-size: contain;}
header .headerInner nav.naviBox.active{transform: translateX(0%);overflow-y:scroll;-ms-overflow-style:none;/* IE, Edge 対応 */scrollbar-width:none;}
header .headerInner nav.naviBox.active::-webkit-scrollbar{ display:none;}

#pageHeader .header_link{float: none;flex-wrap: wrap;margin: 2vw;}
#pageHeader .header_link p{color: #fff;width: 100%;font-size: 7vw;margin: 1em auto;}

/*----------------------------------------------------------------------------
 ***                                                                  section
----------------------------------------------------------------------------*/

.contentsBox .sectionInner{margin: 4em auto;padding: 0 5%;}
h3{margin-bottom: 0.5em;}
h3 img{width: 5vw;margin: 0 auto 0.1em;}
h3.font_Lato{font-size: 12vw;}

/*----------------------------------------------------------------------------
 ***                                                                 mainBox
----------------------------------------------------------------------------*/

#aboutSec h3{width: 60%;margin: 2em auto;}
#aboutSec h3 img{width: 40vw;}
#aboutSec .aboutTxt{font-size:4vw;line-height: 1.5; }
#aboutSec .aboutTxt .L_font{font-size: 160%;}
#aboutSec .sub_txtBox{padding: 1em; }
#aboutSec .sub_txtBox h4{font-size: 5.5vw;}
#aboutSec .sub_txtBox .sub_txt{font-size: 3.2vw;margin-top: 1em;}
#aboutSec .sub_txtBox.concept .concept_txt{font-size: 4vw;}
#aboutSec .sub_txtBox.concept .concept_txt span{font-size: 80%;}
#aboutSec .sub_txtBox.concept::before,
#aboutSec .sub_txtBox.origin::before{font-size:300%; }


#memberSec .flex_inner{gap:1em;}
#memberSec .flex_inner li{width: 45%;}
#memberSec .flex_inner li:nth-child(odd) img{border:5px solid #e94709; }
#memberSec .flex_inner li:nth-child(even) img{border: 5px solid #00afad;}
#memberSec .flex_inner li button .name{margin-top:0.2em;font-size: 5vw; }
#memberSec .modal-window{height: 70%;}
#memberSec .modal-window .img{padding: 0.5em;}
#memberSec .modal-window p img{width: 70%;}
#memberSec .modal-window .name{font-size:7vw;margin-top: 0.5em; }
#memberSec .modal-window .profile{margin:1em 1em 1em;display: flex;flex-wrap: wrap;justify-content: center;gap:0.5em;}
#memberSec .modal-window .profile dl{display: block;width: 100%;padding: 0.5em;}
#memberSec .modal-window .profile dl dt{width: 100%;margin-bottom: 0.5em;text-align: center;font-size: 3.5vw;}
#memberSec .modal-window .profile dl dd{width: 100%;text-align: center;font-size: 3.5vw;}
#memberSec .modal-window .profile dl dd.sp_left{text-align: left;}
#memberSec .modal-window .profile dl.message{width: 100%;}

#memberSec .directorSec{padding:1em; }
#memberSec .directorSec ul .logo{width: 50%;margin: auto;}
#memberSec .directorSec ul .directorBox{width: 100%;}
#memberSec .directorSec ul .directorBox .director{font-size:5vw;line-height: 1;margin-top: 1em; }
#memberSec .directorSec ul .directorBox .btn a{font-size:4vw; }
#memberSec .directorSec ul .directorBox .comment{font-size:3.5vw;}

#staffSec .staffBox{display: block;border: 5px solid #b2e7e6;}
#staffSec .staffBox .imgBox{width: 45%;margin: auto;}
#staffSec .staffBox .txtBox{width: 100%;}
#staffSec .staffBox .txtBox h4{font-size:5vw;padding:0 0.5em 0.2em;  }
#staffSec .staffBox .txtBox h4 .sub{padding-left: 0;font-size: 70%;}
#staffSec .staffBox .txtBox .staff_content{margin: 1em 0 0;}
#staffSec .staffBox .txtBox .staff_content h5{font-size:3.5vw; }
#staffSec .staffBox .txtBox .staff_content p{font-size: 3vw;line-height: 1.5;margin-bottom: 0.5em;}


#uniformSec .uniform_photo{margin-bottom: 1em;}
#uniformSec .subTtl{font-size: 7vw;}
#uniformSec .uniform_txt{font-size: 3.5vw;width: 100%;}
#uniformSec .uniform_photo li{width: 80%;}
#uniformSec .uniform_photo li span{font-size:5vw; }
#uniformSec .btn a{font-size:5vw; }


#scheduleSec #scheduleList{max-height: 350px;}
#scheduleSec #scheduleList .schedule-item{display: block;margin-right:1em;margin-bottom: 2em;border-bottom: none;}
#scheduleSec #scheduleList .schedule-item .date{width:  100%;padding: 0.5em 0 0.5em 0.5em;border-bottom: 2px #e94709 dotted;border-right: none;}
#scheduleSec #scheduleList .schedule-item .date .year{display: inline-block;font-size: 4vw;}
#scheduleSec #scheduleList .schedule-item .date .day{font-size: 5vw;}
#scheduleSec #scheduleList .schedule-item .content{width: 100%;padding: 1em 0.5em;}
#scheduleSec #scheduleList .schedule-item .content h4{font-size: 5vw;}
#scheduleSec #scheduleList .schedule-item .content p{font-size: 3.5vw;}

#snsSec h4{font-size:8vw; }
#snsSec iframe{height: 60vw;}
#snsSec .btn a{font-size:5vw; }

#otherSec .otherBox h4{font-size: 5vw;}
#otherSec .otherBox .txtBox{margin-top: 1em;}
#otherSec .otherBox .txtBox .txt{font-size:4vw; text-align: left;}
#otherSec .otherBox .txtBox .subtxtBox{width: 90%;margin: 1em auto 0;}
#otherSec .otherBox .txtBox .subtxtBox p{font-size:3.5vw; }

#otherSec .otherBox h4.orange{border-right: 10px solid #e94709;border-left: 10px solid #e94709;}
#otherSec .otherBox h4.blue{border-right: 10px solid #00afad;border-left: 10px solid #00afad;}
#otherSec .otherBox .event_btn a,
#otherSec .otherBox .gift_btn a{font-size:4.5vw; }
#otherSec .otherBox .event_btn a::after,
#otherSec .otherBox .gift_btn a::after{width: 12px;height: 12px;}


/*----------------------------------------------------------------------------
 ***                                                                 footer
----------------------------------------------------------------------------*/
/* linkbox */
#linkBox{padding:5% 0;margin: 0 auto 00px;}
#linkBox dt{ width:85.5%; margin:0 auto 1em;}
#linkBox dd{ font-weight:bold; line-height:2em; text-align:center; color:#FFF; font-size:80%;}
#linkBox dd img{ width:15%; padding:0 2%; height:auto;}


/* footer */
#pageFooter{ background:#E9470B;}
#pageFooter .footerInner{ padding:1% 1%;}
#pageFooter dl{ float:none; width:100%; text-align:center;}
#pageFooter dt{ width:15%; float:none; display:block;margin: auto}
#pageFooter dd{ float:none; display:inline-block; font-size:70%; color:#FFF; padding:2% 0 0 2%;}
#pageFooter  p{ float:none; font-size:70%; color:#FFF; padding-top:2.3%; text-align:center;}


@media screen and (max-width: 950px) and (min-width: 500px){
	#sponsor ul:nth-of-type(2) li img{width: 100%;}
}