@charset "UTF-8";

ul.event-ca,ul.event-sub {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4列 */
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
  align-items: start;
}
ul.event-ca::after {
  content: "▼";
  position: absolute;
  bottom: -1.5em;
  left: 50%;
  transform: translateX(-50%);
  font-size: 3em;
  color: #999;
  display: none;
}
ul.event-ca.show-arrow::after {
  display: block;
}
ul.event-ca li,ul.event-sub li {
  aspect-ratio: 1.5 / 1;
  text-align: center;
  border-radius: 5px;
  cursor: pointer;
  border: none;
  color: #fff;
  overflow: hidden;
  position: relative;
  padding: 0;
  margin: 0 0 1.5em 0;
  height: 5em;
  width: 100%;
}
ul.event-sub {
  margin-top:5em;
}
ul.event-sub li {
  background: #888;
  height: 3em;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
}
ul.event-sub li.active {
  background: #c34049;
}
ul.event-ca li div.bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  transform-origin: center;
  transform: scaleY(1);
}
ul.event-ca li::before,ul.event-sub li::before {
  display:none;
}
ul.event-ca li.active {
  transform: scaleY(1.3);
}
ul.event-ca li span.li-inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scaleY(1); /* ←スケールしない */
  font-size: 1em;
  line-height: 1.4;
  transition: none;
  pointer-events: none;
  width: 100%;
}
ul.event-ca li.active span.li-inner {
  transform: translate(-50%, -50%) scaleY(0.8);
}
ul.event-ca li:hover,ul.event-sub li:hover {
  opacity: 0.6;
  transition: opacity 0.3s ease;
}
ul.event-sub li:hover {
    background: #c34049;
}
ul.event-ca li.active:hover {
  opacity: 1;
  transition: opacity 0.3s ease;
}

ul.event-ca li:nth-child(1) div.bg { background: #fcc6ca; }
ul.event-ca li.active:nth-child(1) div.bg { background: #c34049; }

ul.event-ca li:nth-child(2) div.bg { background: #98eda2; }
ul.event-ca li.active:nth-child(2) div.bg { background: #3c9d47; }

ul.event-ca li:nth-child(3) div.bg { background: #93DBEF; }
ul.event-ca li.active:nth-child(3) div.bg { background: #62B9D3; }

ul.event-ca li:nth-child(4) div.bg { background: #fae579; }
ul.event-ca li.active:nth-child(4) div.bg { background: #b69b09; }

ul.event-ca li:nth-child(5) div.bg{ background: #FFC58A; }
ul.event-ca li.active:nth-child(5) div.bg { background: #EE7800; }

ul.event-ca li:nth-child(6) div.bg { background: #D6BBF6; }
ul.event-ca li.active:nth-child(6) div.bg { background: #7065A3; }

ul.event-ca li:nth-child(7) div.bg { background: #dbed00; }
ul.event-ca li.active:nth-child(7) div.bg { background: #96a304;}

ul.event-ca li:nth-child(8) div.bg { background: #A7B5FF; }
ul.event-ca li.active:nth-child(8) div.bg { background: #4B65F1; }

#event-results {
  display: block;
  overflow:hidden;
  width:100%;
}
#event-results .event-results-link {
  display: block;
  overflow: hidden;
  width: 90%;
  margin: 0 auto 3em auto !important;
  background: #fafafa;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  color:#333;
}
.event-results-link .event_item {
  display: flex !important;
  padding: 1em;
}
.event_item .samimg {
  width: 27%;
  margin-right: 3%;
}
.event_item .event_listin {
  width:70%;
}
.event_listin span {
  padding: 0.2em 1em;
  font-size: 0.8em;
  border-radius: 15px;
  color: #fff;
  margin-right: 0.5em;
}
.event_listin span.ev_set,
.event_listin span.ev_ko,
.event_listin span.ev_oc,
.event_listin span.ev_pre{ 
  background: #777;
}

span.camp_on{ background: rgb(239, 68, 68); }
span.camp_sui{ background: #62B9D3; }
span.camp_aki{ background: #ffd700; color: #555 !important; }
span.camp_ike{ background: #EE7800; }
span.camp_ta{ background: #7065A3; }
span.camp_omi{ background: #b4c400; }
span.camp_yo{ background: #4B65F1; }

.event_listin b {
  font-size: 1.2em;
  display: block;
  margin-top: 0.5em;
}

/********* グラビティフォームのテンプレート側設定 *********/
.event-info {
  display: block;
  overflow: hidden;
  width: 90%;
  margin: 2em auto !important;
  background: #fafafa;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  color: #333;
  padding: 1.5em 2em;
  line-height: 1.8em;
  font-size: 1.2em;
}
.ev_free {
  display:block;
  overflow:hidden;
  all: revert;
  margin-top: 1.5em;
}
.ev_free h1,
.ev_free h2,
.ev_free h3,
.ev_free p,
.ev_free b,
.ev_free span,
.ev_free div,
.ev_free strong,
.ev_free em {
  all: revert;
}

/********* グラビティフォームの表示調整 *********/
.gform-page-footer #gform_submit_button_41, .gform-page-footer #gform_submit_button_42,
.gform-page-footer #gform_next_button_41_41, .gform-page-footer #gform_submit_button_42_42,
.gform-page-footer #gform_previous_button_41, .gform-page-footer #gform_previous_button_42{
  text-align: center;
  margin: 0 auto;
  background: #e60012;
  border-radius: 5px;
  color: #fff;
  padding: 0.8em 2.5em;
  font-weight: bold;
}
.gform-page-footer #gform_previous_button_41, .gform-page-footer #gform_previous_button_42{
  background: #fff;
  color: #555;
}
#gf_progressbar_wrapper_41,#gf_progressbar_wrapper_42{
  margin:2em auto;
}
#gform_wrapper_41 h2.gform_title,#gform_wrapper_42 h2.gform_title{
  display:none;
}
h2.gform_submission_error{
  background: transparent;
  border-bottom: none;
}