@charset "UTF-8";

/****************************************
 * top専用スタイル
****************************************/
#p-top-activity{
  background-color: #f7cd0c;
  padding: 70px 0 78px;
}
#p-top-activity .c-ttl__en {
  margin-bottom: 100px;
}
@media screen and (max-width:560px){
  #p-top-activity{
    padding: 42px 0 41px;
  }
  #p-top-activity .c-ttl__en {
    margin-bottom: 70px;
  }
}

/*カーブ上（黄色）*/
#p-top-activity:before {
  background-image: url(../img/top/curve_top_yellow.png);
}

/*カーブ下（黄色）*/
#p-top-activity:after {
  background-image: url(../img/top/curve_bottom_yellow.png);
}

/*リスト*/
.p-top-activity__list ul{
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(3, 1fr);
}
@media screen and (max-width: 830px) {
  .p-top-activity__list ul{
    grid-template-columns: repeat(1, 1fr);
    gap: 7rem;
  }
}

.p-top-activity__list ul li{
  background-color: #fff;
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  padding: 4.65rem 4.25rem 4.25rem 4.25rem;
  border-radius: 12px;
  box-shadow: 0px 2px rgba(0, 0, 0, 0.1);
  position: relative; 
}
@media screen and (max-width: 1024px)  {
  .p-top-activity__list ul li{
    gap: 2rem;
  }
}
@media screen and (max-width: 830px) {
  .p-top-activity__list ul li{
    padding: 4rem 2.5rem;
    gap: 1.8rem;
  }
}

/*赤円形装飾*/
.p-top-activity__list ul li img{
  position: absolute;
  width: 100%;
  height: 71px;
  top: -7%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 320px;
}
@media screen and (max-width: 830px) {
  .p-top-activity__list ul li img{
    max-width: 350px;
    width: 65%;
  }
}

/*h3見出し*/
.p-top-activity__list h3{
  text-align: center;
  font-family: "FOT-筑紫ゴシック Pro B";
  color: #e84466;
  text-align: center;
  letter-spacing: 0.1em;
  line-height: 1.2;
  font-size: 2.4rem;
}
@media screen and (max-width: 1024px)  {
  .p-top-activity__list h3 {
      font-size: 1.8rem;
  }
}


/* activityセクション：スライダー */
.p-top-activity-slide{
  position:relative;
  z-index:-1;
  background-image:url("../img/top/side_slide-activity.jpg");
  background-repeat:repeat-x;
  -webkit-transform:translate3d(0, 0, 0);
  transform:translate3d(0, 0, 0);
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden
}
@media screen and (min-width:561px){
  .p-top-activity-slide{
    height:250px;
    background-size:1360px auto;
    background-position:1360px 0;
    -webkit-animation:side-slide-animation__pc-activity 30s linear infinite;
    animation:side-slide-animation__pc-activity 30s linear infinite
  }
}
@media screen and (max-width:560px){
  .p-top-activity-slide{
    height:100px;
    background-size:544px auto;
    background-position:544px 0;
    -webkit-animation:side-slide-animation__sp-activity 20s linear infinite;
    animation:side-slide-animation__sp-activity 20s linear infinite
  }
}

/*activityスライダー：PC用*/
@keyframes side-slide-animation__pc-activity{
  0%{background-position:1360px 0}
  to{background-position:0 0}
}

/*activityスライダー：スマホ用*/
@keyframes side-slide-animation__sp-activity{
  0%{background-position:544px 0}
  to{background-position:0 0}
}


/****************************************
 * scheduleセクション
****************************************/
#p-top-schedule:before {
  background-image: url(../img/top/curve_top_white.png);
}

@media screen and (min-width: 561px) {
  #p-top-schedule {
      padding-top: 95px;
  }
}
@media screen and (max-width: 560px) {
  #p-top-schedule {
      padding-top: 45px;
  }
}


/****************************************
 * readセクション
****************************************/
.p-top-read__point {
  padding-bottom: 120px;
}

@media screen and (max-width:560px){
  .p-top-read__point {
    padding-bottom: 56px;
  }
  
}