[v-cloak] {
  display: none;
}

@media screen and (max-width: 767px) {
  .u-mobile {
    display: block;
  }

  .u-desktop {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .u-mobile {
    display: none;
  }

  .u-desktop {
    display: block;
  }
}

/* topページ */


.kc-pic {
  margin-bottom: 30px;
  position: relative;
}

.kc-pic::before {
  content: "";
  display: block;
  padding-top: 66.666666%;
}

.kc-pic img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kc-format p {
  width: 77px!important;
  height: 70px!important;
  line-height: 70px;
  font-size: 14px;
  background-color: #ffd504;
  color: #333;
  font-weight: bold;
  text-align: center;
}

.kc-name {
  
}

.kc-name h3{
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  padding-bottom: 0!important;
}

.kc-btn::before{
  right: 40px!important;
}

.kc-address {
  margin-bottom: 13px;
}





@media screen and (min-width: 831px) and (max-width: 1024px) {
  .kc-format {
    /* right: 20%!important; */
  }
}

@media screen and (max-width: 1024px) {
  .kc-format p {
    margin-left: auto;
  }
}
@media screen and (max-width: 498px) {
  .kc-format p {
    margin-left: auto;
    width: 54px!important;
    height: 50px!important;
    line-height: 50px;
    font-size: 1.4vw;
  }
}


/* イベント一覧 */

.kc-card-event {
  width: calc(25% - 2% * 3/4)!important;
  margin-right: 2%!important;
}

.kc-card-event:nth-child(4n) {
  margin-right: 0!important;
}

.kc-format-event p {
  width: 77px!important;
  height: 70px!important;
  line-height: 70px;
  font-size: 14px;
  background-color: #ffd504;
  color: #333;
  font-weight: bold;
  text-align: center;
  margin-left: auto;
}

.kc-pic-event {
  margin-bottom: 30px;
  position: relative;
}

.kc-pic-event::before {
  content: "";
  display: block;
  padding-top: 66.666666%;
}

.kc-pic-event img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}



.kc-name-event h3{
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  padding-bottom: 0!important;
}

.kc-address-event {
  margin-bottom: 13px;
  font-size: 12px!important;
}

.kc-date-event {
  font-size: 12px!important;
}

@media screen and (max-width: 1024px) {
  .kc-card-event {
    width: calc(50% - 2% * 1/2)!important;
    margin-right: 2%!important;
  }

  .kc-card-event:nth-child(2n) {
    margin-right: 0!important;
  }

  .kc-type-event {
    font-size: 16px!important;
  }
}

@media screen and (max-width: 565px) {
  .kc-cards-event {
    display: block!important;
  }

  .kc-card-event {
   width: 100%!important;
   margin-right: 0!important;
   padding: 5% 5% 10%!important;
  } 

  .kc-pic-event::before {
    content: "";
    display: block;
    padding-top: 75%;
  }



  .kc-format-event p {
      width: 77px!important;
      height: 70px!important;
      line-height: 70px;
      font-size: 14px;
      background-color: #ffd504;
      color: #333;
      font-weight: bold;
      text-align: center;
      margin-left: auto;
  }

  .kc-name-event {
    padding-top: 0!important;
    margin-bottom: 5%!important;
  }

  .kc-date-event {
    margin-bottom: 3%!important;
  }

  .kc-name-event h3 {
    font-size: 18px!important;
  }

  .kc-address-event {
    font-size: 16px!important;
  }
  
  .kc-date-event {
    font-size: 16px!important;
  }

}