/*LIVEカレンダーキャンペーン*/

.calendar {
  width:100%;
  text-align:center;
  margin:0;
  padding:0;
} 

.slick img{
  width:200px;
}


.tile-inner .calendar {
  margin:0;
  padding:0;
}

.box-wrapper{
padding:0;
}

.calendar h1{
    text-align:left;
}

.calendar h2{
    padding: 10px 0;
    font-size: 22px;
    margin-bottom: 30px;
    color: #71519f;
    font-weight: normal;
    border-top: 2px solid #71519f;
    border-bottom: 2px solid #71519f;
}

.calendar h3{
    font-weight:bold;
    color:#674498;
    text-align:left;
    font-family: "Arial", "メイリオ";

}
.live_day{
    text-align:left;
    font-family: "Arial", "メイリオ";
    font-size:90%;
}

.live_name{
    text-align:left;
    font-family: "Arial", "メイリオ";
    font-size:80%;
    margin:0 0 30px 0;
}

.carousel {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  /* その他のスタイル */
}

.carousel-item {
  scroll-snap-align: start;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  /* その他のスタイル */
}

.carousel img{
  width:350px;
}

.slider-group {
  position: relative;
  width: 100%;
  min-height: 200px;
  height: auto;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
}
.slider-card {
  flex: 0 0 auto;
  max-width: 350px;
  height: 100%;
  margin-right: 20px;
}
.slider-card-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.calendar_btn{
    width:90%;
    text-align:center;
    margin: 40px auto;
    padding:20px;
    background-color:#333;
    color:#fff;
}

.calendar_btn a{
    color:#fff;
}

@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
.slider-card {
  flex: 0 0 auto;
  max-width: 300px;
  height: 100%;
  margin: 0 20px 0 10px;
  
}
.calendar h3{
    font-weight:bold;
    color:#674498;
    text-align:left;
    font-family: "Arial", "メイリオ";
    font-size:110%;

}