@charset "utf-8";

.navList > li.event span::before,
.navList > li.event span::after { width: 50%; }

#loading { background:#fff; width:100vw; height:100vh; transition:0.2s; position:fixed; top:0; left:0; z-index:9999; display:flex; align-items:center; justify-content:center;}
#loading img { width:40px;}
.loaded { opacity:0; visibility:hidden;}

.searchCont { padding: 0 0 50px; }

.event .pageTit { background: url(/static/images/event/bg_event.jpg) no-repeat center center; background-size: cover; }
.monthSlider { padding: 0 50px; margin: 0 auto 20px; }
.monthSlider li { width: calc( 100% / 6 ); }
.monthSlider li input { display: none; }
.monthSlider li label { display: block; border: 1px solid #026EB8; text-align: center; padding: 15px; font-size: 1.6em; line-height: 25px; font-weight: 700; color: #026EB8; transition: all 0.3s; }
.monthSlider li label span { display: block; text-align: center; font-weight: 700; color: #026EB8; transition: all 0.3s; }
.monthSlider li label:hover { background: #026EB8; color: #fff; cursor: pointer; }
.monthSlider li label:hover span { color: #fff; }
.monthSlider li input:checked + label { background: #026EB8; color: #fff; }
.monthSlider li input:checked + label span { color: #fff; }

.categoryCont ol { display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; margin: 0 auto 20px; }
.categoryCont li { width: calc(( 100% - 50px ) / 6 ); margin: 0 10px 0 0; }
.categoryCont li:last-child { margin: 0; }
.categoryCont li input { display: none; }
.categoryCont li label { display: block; height: 100%; border-radius: 4px; border: 1px solid #ccc; padding: 10px; text-align: center; font-size: 1.6em; line-height: 1.2; font-weight: 700; transition: all 0.3s; }
.categoryCont li label i { font-size: 20px; line-height: 20px; color: #8D8D8D; margin: 0 0 5px; transition: all 0.3s; }
.categoryCont li label:hover { background: #026EB8; color: #fff; cursor: pointer; }
.categoryCont li label:hover i { color: #fff; }
.categoryCont li input:checked + label { background: #026EB8; color: #fff; }
.categoryCont li input:checked + label i { color: #fff; }

.otherSearch .contInr { display: flex; justify-content: flex-start; flex-wrap: wrap; }
.otherSearch .freeword { width: 60%; background: #F0F0F0; padding: 10px; vertical-align: middle; box-sizing: border-box; font-size: 0; line-height: 40px; }
.otherSearch .freeword label { display: inline-block; vertical-align: middle; width: 150px; font-size: 16px; line-height: 40px; font-weight: 700; color: #026EB8; padding: 0 10px 0 0; text-align: center; box-sizing: border-box; }
.otherSearch .freeword label i { color: #026EB8; margin: 0 5px 0 0; }
.otherSearch .freeword .textBox { display: inline-block; vertical-align: middle; width: calc( 100% - 260px ); height: 40px; font-size: 16px; line-height: 40px; border-radius: 4px; border: 1px solid #8D8D8D; appearance: none; box-sizing: border-box; margin: 0 10px 0 0; padding: 0; outline: none; background: #fff; }
.otherSearch .freeword .submitBtn { display: inline-block; vertical-align: middle; width: 100px; height: 40px; border-radius: 4px; background: #026EB8; color: #fff; text-align: center; font-size: 16px; font-weight: 700; appearance: none; border: 1px solid #026EB8; margin: 0; padding: 0; box-sizing: border-box; outline: none; }
.otherSearch .reset { width: 20%; }
.otherSearch .reset button { display: block; width: 100%; background: #8D8D8D; padding: 10px; text-align: center; border: 0; outline: none; margin: 0; }
.otherSearch .reset button:hover { opacity: 0.8; }
.otherSearch .reset button i { display: inline-block; color: #fff; font-size: 20px; line-height: 30px; padding: 5px;  }
.otherSearch .reset button span { display: inline-block; color: #fff; font-size: 16px; line-height: 20px; font-weight: 700; text-align: left; }
.otherSearch .print { width: 20%; }
.otherSearch .print a { display: block; width: 100%; background: #026EB8; padding: 10px; text-align: center; }
.otherSearch .print.disabled a { pointer-events:none; background:#666;}
.otherSearch .print.disabled a:hover { opacity:unset;}
.otherSearch .print a:hover { opacity: 0.8; }
.otherSearch .print a i { display: inline-block; color: #fff; font-size: 20px; line-height: 30px; padding: 5px;  }
.otherSearch .print a span { display: inline-block; color: #fff; font-size: 16px; line-height: 20px; font-weight: 700; text-align: left; }

.eventInfo { padding: 0 0 50px; }
.eventInfo ul { padding: 15px; background: #E3E8F5; border: 1px solid #026EB8; }
.eventInfo ul li { font-size: 1.6em; line-height: 1.5; padding: 2px 0; }

.eventList { border-top: 1px solid #026EB8; }
.eventList .eventInr { padding: 20px 0; border-bottom: 1px solid #026EB8; }
.eventList .eventInr a { display: flex; transition: all 0.3s; }
.eventList .eventInr a:hover { opacity: 0.8; }
.eventList .leftCont { position: relative;  width: 220px; }
.eventList .rightCont { width: calc( 100% - 220px ); padding: 0 0 0 30px; display:flex; flex-wrap:wrap; align-content:center; }
.eventList .today { position: absolute; top: 0; left: 0; background: #026EB8; color: #fff; font-size: 1.4em; font-weight: 700; line-height: 20px; padding: 5px 20px; border-radius: 0 0 10px 0; }
.eventList .today i { color: #fff; margin-right: 5px; }
.eventList .thumb { height:220px; display:flex; align-items: center; justify-content:center;}
.eventList .thumb img { max-width:100%; max-height:100%;}
.eventList .category { width: 200px; border: 1px solid #DEDEDE; border-radius: 4px; text-align: center; font-size: 1.6em; font-weight: 700; line-height: 30px; }
.eventList .category i { color: #8D8D8D; margin-right: 5px; }
.eventList .date { color: #026EB8; font-size: 1.6em; font-weight: 500; line-height: 1.5; padding: 10px 0; width:100%; }
.eventList .eventTit { font-size: 2.4em; font-weight: 700; line-height: 1.5; width:100%;}
.eventList .target { font-size: 1.4em; display:flex; align-items:center; margin-top:15px;}
.eventList .target span { line-height:1; display:inline-block; margin-right:10px; font-size: 1.2rem; color:#fff; background:#aaa; padding:3px 8px;}

.pagenation { text-align: center; }
.pagenation ul { text-align: center; padding: 50px 0 0; }
.pagenation ul li { display: inline-block; width: 50px; font-size: 1.6em; line-height: 50px; vertical-align: middle; border: 1px solid #026EB8; color: #026EB8; text-align: center; border-radius: 4px; margin: 0 10px 0 0; }
.pagenation ul li.disabled { border: 1px solid #8D8D8D; color: #8D8D8D; }
.pagenation ul li:last-child; { margin: 0; }
.pagenation ul li a { text-align: center; display: block; color: #026EB8; padding: 0; line-height: 50px; font-weight: 700; vertical-align: middle; text-decoration: none; transition: all 0.3s; }
.pagenation ul li a:hover { background: #026EB8; color: #fff; }
.pagenation ul li em { text-align: center; display: block; background: #026EB8; color: #fff; padding: 0; line-height: 50px; font-weight: 700; vertical-align: middle; font-style: normal; }

/* slick Arrows */
.slick-prev,
.slick-next { font-size: 0; line-height: 1; position: absolute; top: 50%; display: block; width: 50px; height: 80px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: #DEDEDE; padding: 30px 19px; text-align: center; }
.slick-prev { left: 0; border-radius: 4px 0 0 4px; }
.slick-next { right: 0; border-radius: 0 4px 4px 0; }
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus { color: transparent; outline: none; }
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before { opacity: 1; }
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before { opacity: .25; }
.slick-prev:before { line-height: 1; display: block; content: ''; width: 12px; height: 20px; background: url(/static/images/common/arrow_left_b.svg) no-repeat center center; background-size: cover; margin: 0; }
.slick-next:before { line-height: 1; display: block; content: ''; width: 12px; height: 20px; background: url(/static/images/common/arrow_right_b.svg) no-repeat center center; background-size: cover; margin: 0; }

.eventDetail { padding: 0 0 10px; }
.eventDetail .category { width: 200px; border: 1px solid #DEDEDE; border-radius: 4px; text-align: center; font-size: 1.6em; font-weight: 700; line-height: 30px; }
.eventDetail .category i { color: #8D8D8D; margin-right: 5px; }
.eventDetail .eventTit { font-size: 2.4em; font-weight: 700; line-height: 1.2; padding: 20px 0; }
.eventDetail .leftCont { position: relative; float: left; width: 68%; padding: 0 20px 0 0; }
.eventDetail .rightCont { float: right; width: 32%; }
.eventDetail .disc { background: #F0F0F0; font-size: 1.6em; line-height: 1.5; padding: 10px; margin: 0 0 20px; }
.eventDetail .leftCont dl { padding: 20px 0; border-bottom: 1px solid #DEDEDE; display: flex; }
.eventDetail .leftCont dt { width: 150px; font-size: 1.6em; font-weight: 700; line-height: 1.5; color: #026EB8; }
.eventDetail .leftCont dd { width: calc( 100% - 150px ); }
.eventDetail .leftCont .date { border-top: 1px solid #DEDEDE; }
.eventDetail .leftCont .date .main { font-size: 1.8em; font-weight: 700; line-height: 1.5; }
.eventDetail .leftCont .date .note { font-size: 1.6em; line-height: 1.5; }
.eventDetail .leftCont .time .main { font-size: 1.8em; font-weight: 700; line-height: 1.5; }
.eventDetail .leftCont .time .note { font-size: 1.6em; line-height: 1.5; }
.eventDetail .leftCont .person .personInr { padding: 0 0 10px; }
.eventDetail .leftCont .person .personInr:last-child { padding: 0; }
.eventDetail .leftCont .person .target { display: inline-block; font-size: 1.6em; font-weight: 700; line-height: 1.5; width: 100px; border: 1px solid #DEDEDE; border-radius: 4px; text-align: center; padding: 2px; margin: 0 10px 10px 0; }
.eventDetail .leftCont .person .price { display: inline-block; font-size: 1.6em; line-height: 1.5; }
.eventDetail .leftCont .facility .hall { padding: 0 0 10px; }
.eventDetail .leftCont .facility .hall:last-child { padding: 0; }
.eventDetail .leftCont .facility .hallName { display: inline-block; font-size: 1.6em; font-weight: 700; line-height: 1.5; width: 11em; border-radius: 4px; text-align: center; padding: 2px; margin: 0 10px 10px 0; }
.eventDetail .leftCont .facility .hallNo { display: inline-block; font-size: 1.6em; font-weight: 700; line-height: 1.5; }
.eventDetail .leftCont .facility .eh1_8 .hallName { background: #e3e8f5; color: #026EB8; }
.eventDetail .leftCont .facility .eh9_11 .hallName { background: #fce3d6; color: #e60012; }
.eventDetail .leftCont .facility .conference .hallName { background: #e0f0e2; color: #009944; }
.eventDetail .leftCont .facility .eventhall .hallName { background: #fff8e0; color: #fcc800; }
.eventDetail .leftCont .organizer dd { font-size: 1.6em; line-height: 1.5; }
.eventDetail .leftCont .contact dd { font-size: 1.6em; line-height: 1.5; }
.eventDetail .leftCont .contact dd a { text-decoration: underline; }
.eventDetail .leftCont .contact dd a:hover { text-decoration: none; }
.eventDetail .thumb { border: 1px solid #ccc; }
.eventDetail .thumb img { width: 100%; }
.eventCalendar .backBtn {  }
.eventCalendar .backBtn a { position: relative; display: block; width: 235px; text-align: center; font-size: 1.6em; font-weight: 500; line-height: 30px; padding: 10px 20px 10px 10px; border: 1px solid #026EB8; border-radius: 4px; box-sizing: border-box; transition: all 0.3s; }
.eventCalendar .backBtn a:before { position: absolute; top: 10px; right: 10px; color: #026EB8; font-weight: 900; content: "\f105"; transition: all 0.3s; }
.eventCalendar .backBtn a:hover { background: #026EB8; color: #fff; font-weight: 700; }
.eventCalendar .backBtn a:hover:before { color: #fff; }

.en .otherSearch .print a span { font-size:13px; }
.en .otherSearch .print a i { padding:5px 5px 5px 0; }

/* ───────────────────────────────────────────────────────────────────────────
 1200px以下の動作
─────────────────────────────────────────────────────────────────────────── */

@media screen and (max-width:1200px){
  .otherSearch .reset button span { font-size: 14px; }
  .otherSearch .print a span { font-size: 14px; }
  .eventDetail .category { font-size: 1.5em; }
  .eventDetail .eventTit { font-size: 2.2em; }
}

/* ───────────────────────────────────────────────────────────────────────────
 1023px以下の動作
─────────────────────────────────────────────────────────────────────────── */

@media screen and (max-width:1023px){
  .searchCont { padding: 0 0 50px; }
  .pageTit h1 { font-size: 2.8em; }
  .monthSlider { padding: 0 40px; }
  .monthSlider li label { padding: 10px; font-size: 1.4em; }
  .categoryCont li { width: calc(( 100% - 25px ) / 6 ); margin: 0 5px 0 0; }
  .categoryCont li label { font-size: 1.4em; }
  .otherSearch .freeword { width: 100%; margin: 0 auto 20px; }
  .otherSearch .reset { width: 50%; }
  .otherSearch .reset button { padding: 5px; }
  .otherSearch .print { width: 50%; }
  .otherSearch .print a { padding: 5px; }
  .eventInfo { padding: 0 0 50px; }
  .eventList .leftCont { width: 250px; }
  .eventList .rightCont { width: calc( 100% - 250px ); padding: 0 0 0 20px; }
  .eventList .eventTit { font-size: 2.0em; }
  .eventList .category { font-size: 1.4em; }
  .slick-prev,
  .slick-next { width: 40px; height: 70px; padding: 25px 14px; }
  .pagenation ul { padding: 50px 0; }
  .eventDetail .category { font-size: 1.4em; }
  .eventDetail .eventTit { font-size: 2.0em; }
  .eventDetail .disc { font-size: 1.4em; }
  .eventDetail .leftCont { float: none; width: 100%; padding: 0; }
  .eventDetail .rightCont { float: none; width: 100%; }
  .eventDetail .thumb { margin: 0 auto 20px; max-width: 500px; }
  .eventDetail .leftCont dt { font-size: 1.5em; width: 120px; }
  .eventDetail .leftCont .date .main { font-size: 1.6em; }
  .eventDetail .leftCont .date .note { font-size: 1.4em; }
  .eventDetail .leftCont .time .main { font-size: 1.6em; }
  .eventDetail .leftCont .time .note { font-size: 1.4em; }
  .eventDetail .leftCont .person .target { font-size: 1.4em; }
  .eventDetail .leftCont .person .price { font-size: 1.4em; }
  .eventDetail .leftCont .facility .hallName { font-size: 1.4em; }
  .eventDetail .leftCont .facility .hallNo { font-size: 1.4em; }
  .eventDetail .leftCont .organizer dd { font-size: 1.4em; }
  .eventDetail .leftCont .contact dd { font-size: 1.4em; }
  .eventCalendar .backBtn a { font-size: 1.5em; }


}

/* ───────────────────────────────────────────────────────────────────────────
 767px以下の動作
─────────────────────────────────────────────────────────────────────────── */

@media screen and (max-width:767px){
  .searchCont { padding: 0 0 40px; }
  .monthSlider { padding: 0 23px; }
  .monthSlider li label { padding: 5px; font-size: 14px; line-height: 20px; }
  .monthSlider li label span { font-size: 12px; }
  .categoryCont ol { margin: 0 0 15px; }
  .categoryCont li { width: calc(( 100% - 15px ) / 3 ); margin: 0 5px 5px 0; }
  .categoryCont li:nth-child(3n) { margin: 0 0 5px; }
  .categoryCont li label { padding: 10px 0; font-size: 12px; }
  .otherSearch .freeword label { display: block; width: 100%; font-size: 14px; line-height: 25px; text-align: left; }
  .otherSearch .freeword .textBox { width: calc( 100% - 90px ); }
  .otherSearch .freeword .submitBtn { width: 80px; }
  .eventInfo { padding: 0 0 40px; }
  .eventInfo ul { padding: 10px; }
  .eventInfo ul li { font-size: 1.5em; padding: 5px 0; }
  .eventList .slide { padding: 15px 0; border-bottom: 1px solid #DEDEDE; }
  .eventList .leftCont { width: 120px; position:relative;}
  .eventList .leftCont .thumb { height:120px;}
  .eventList .rightCont { width: calc( 100% - 120px ); padding: 0 0 0 10px; }
  .eventList .today { position: absolute; left: 0; font-size: 13px; border-radius: 0; text-align: center; line-height: 17px; padding: 4px; }
  .eventList .date { font-size: 1.3em; line-height: 1.2; padding: 8px 0; }
  .eventList .eventTit { font-size: 1.6em; line-height: 1.2; }
  .eventList .category { font-size: 1.2em; line-height: 1.5; width: 150px; }
  .eventList .target { font-size: 1.2em; margin-top:10px;}
  .eventList .target span { font-size: 1.0rem; padding:3px 5px; margin-right:5px;}

  .slick-prev,
  .slick-next { width: 23px; height: 49px; padding: 17px 7px; }
  .slick-prev:before { width: 9px; height: 15px; }
  .slick-next:before { width: 9px; height: 15px; }
  .pagenation ul { padding: 40px 0; }
  .pagenation ul li { width: 35px; font-size: 1.3em; line-height: 35px; margin: 0 5px 0 0; }
  .pagenation ul li a { line-height: 35px; }
  .pagenation ul li em { line-height: 35px; }
  .eventDetail .category { font-size: 1.2em; line-height: 25px; }
  .eventDetail .eventTit { font-size: 1.8em; }
  .eventDetail .leftCont dl { padding: 15px 0; display: block; }
  .eventDetail .leftCont dt { width: 100%; padding: 0 0 10px; }
  .eventDetail .leftCont dd { width: 100%; }
  .eventDetail .leftCont .person .price { display: block; }
  .eventCalendar .backBtn a { margin: 0 auto; }

}