@charset "utf-8";

.p-cheer-hdg {

  background-color: #B7D14B;

}

.p-cheer-hdg img {

  width: 100%;

  max-width: 100%;

  vertical-align: top;

}

.p-cheer-desc {

  background-color: #FEFFE3;

  text-align: center;

  box-sizing: border-box;

}

.p-cheer-desc__text {

  margin: 0;

  font-weight: 600;

  color: #57350F;

}

.p-cheer-desc__item img {

  width: 100%;

  max-width: 100%;

}

.p-cheer-introduce__hdg {

  margin: 0 auto;

  font-weight: 700;

  text-align: center;

  line-height: 1.5;

  color: #fff;

}

.p-cheer-school__name {

  height: 0;

  margin: 0;

  text-align: center;

}

.p-cheer-school__name em {

  display: inline-block;

  background-color: #A0C746;

  font-weight: 700;

  line-height: 1;

  color: #fff;

  border: solid #fff;

  transform: translateY(-50%);

}

.p-cheer-player + .p-cheer-player {

  position: relative;

}

.p-cheer-player + .p-cheer-player::before {

  position: absolute;

  top: 0;

  height: 0;

  content: '';

}

.p-cheer-player__catch img {

  width: 100%;

  max-width: 100%;

}

.p-cheer-illust__car {

  display: flex;

  align-items: flex-start;

  justify-content: flex-start;

}

.p-cheer-illust__item {

  flex: 0 0 auto;

}

.p-cheer-illust__item img {

  width: 100%;

  max-width: 100%;

}

.p-cheer-illust__pic {

  position: relative;

}

.p-cheer-illust__pic span {

  position: absolute;

  right: 0;

  bottom: 0;

  background-color: #8B653B;

}

.p-cheer-illust__pic span::before,

.p-cheer-illust__pic span::after {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  margin: auto;

  background-color: #fff;

  content: '';

}

.p-cheer-illust__text {

  font-weight: 600;

  text-align: center;

  color: #fff;

}

.p-cheer-illust__dot .swiper-pagination-bullet-active {

  background-color: #F36A21;

}

.p-cheer-illust__dot {

  display: flex;

  align-items: center;

  justify-content: center;

}

.p-cheer-illust__dot span {

  background-color: #fff;

  border-radius: 100%;

}



.p-cheer-modal {

  position: fixed;

  top: 0;

  left: 0;

  z-index: 1000;

  width: 100%;

  height: 100%;

  background-color: #A0C746;

  box-sizing: border-box;

}

.p-cheer-modal.is-hide {

  display: none;

}

.p-cheer-modal__inner {

  width: 100%;

}

.p-cheer-modal__car {

  display: flex;

  align-items: flex-start;

  justify-content: flex-start;

}

.p-cheer-modal__item {

  flex: 0 0 auto;

}

.p-cheer-modal__fig img {

  width: 100%;

  max-width: 100%;

}

.p-cheer-modal__info {

  color: #fff;

}

.p-cheer-modal__player,

.p-cheer-modal__grade {

  font-weight: 700;

  line-height: 1.5;

}

.p-cheer-modal__close::before,

.p-cheer-modal__close::after {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  margin: auto;

  background-color: #fff;

  content: '';

}

.p-cheer-modal__close::before {

  transform: rotate(45deg);

}

.p-cheer-modal__close::after {

  transform: rotate(-45deg);

}



.p-cheer-sns__head {

  margin: 0 auto;

}

.p-cheer-sns__head img {

  width: 100%;

  max-width: 100%;

}

.p-cheer-sns__items {

  display: flex;

  align-items: center;

  justify-content: center;

}

.p-cheer-sns__item {

  flex: 0 0 auto;

  margin: 0;

}

.p-cheer-sns__item img {

  width: 100%;

  max-width: 100%;

}

@media screen and (max-width: 768px) {

  .p-cheer-pc {

    display: none;

  }

  .p-cheer-container {

    background: #B7D14B url("/about/svltc/cheeringart/52/images/bg_container_sp.png") no-repeat center top;

    background-size: 100% auto;

  }

  .p-cheer-desc {

    width: 84vw;

    margin: 0 auto;

    padding: 8vw 5.3333vw;

    border-radius: 2.666vw;

  }

  .p-cheer-desc__text {

    margin-top: 8vw;

    font-size: 4vw;

  }

  .p-cheer-desc__text:first-child {

    margin-top: 0;

  }

  .p-cheer-desc__items {

    margin: 8vw 0 0;

  }

  .p-cheer-desc__item + .p-cheer-desc__item {

    margin-top: 3.2vw;

  }

  .p-cheer-introduce {

    width: 88.2666vw;

    margin: 21.3333vw auto 18.6666vw;

    padding-bottom: 21.3333vw;

  }

  .p-cheer-introduce__hdg {

    width: 72vw;

    height: 34.9333vw;

    padding-top: 4.8vw;

    background: url("/about/svltc/cheeringart/52/images/bg_introduce_sp.svg") no-repeat center top;

    background-size: contain;

    font-size: 7.4666vw;

  }

  .p-cheer-school {

    margin-top: 15.4666vw;

    padding-bottom: 9.6vw;

    border: 1.0666vw solid #fff;

  }

  .p-cheer-school + .p-cheer-school {

    margin-top: 16.8vw;

  }

  .p-cheer-school__name em {

    padding: 4.2666vw 7.4666vw;

    border-width: 1.0666vw;

    border-radius: 9.7333vw;

    /*4 4 20 32.97 20 4 4 */

  }

  .p-cheer-school__name em img {

    width: auto;

    height: 8.792vw;

  }

  .p-cheer-player {

    margin: 17.6vw 0 0;

  }

  .p-cheer-player + .p-cheer-player {

    margin-top: 10.6666vw;

    padding-top: 10.6666vw;

  }

  .p-cheer-player + .p-cheer-player::before {

    left: 6.3271%;

    width: 87.3456%;

    border-bottom: 1.0666vw solid #fff;

  }

  .p-cheer-player__head {

    width: 73.3333vw;

    margin: 0 auto;

  }

  .p-cheer-player__fig {

    width: 41.0666vw;

    margin: 0;

  }

  .p-cheer-player__fig > img {

    width: 100%;

  }

  .p-cheer-player__catch {

    width: 51.52vw;

    margin: -17.056vw 0 0 21.8666vw;

  }

  .p-cheer-illust-pc {

    display: none;

  }

  .p-cheer-illust-sp {

    overflow: hidden;

    margin: 8vw 0.8vw 0;

  }

  .p-cheer-illust__grid {

    display: flex;

    align-items: flex-start;

    justify-content: flex-start;

    flex-wrap: wrap;

    flex: 0 0 auto;

    width: 100%;

    margin-top: -8vw;

  }

  .p-cheer-illust__item {

    width: 35.4666vw;

    margin: 8vw 0 0 4.5333vw;

  }

  .p-cheer-illust__pic {

    box-shadow: 2.1333vw 2.1333vw 0px rgba(0, 0, 0, 0.1);

  }

  .p-cheer-illust__pic span {

    width: 8vw;

    height: 8vw;

  }

  .p-cheer-illust__pic span::before,

  .p-cheer-illust__pic span::after {

    border-radius: 0.5333vw;

  }

  .p-cheer-illust__pic span::before {

    width: 4vw;

    height: 1.0666vw;

  }

  .p-cheer-illust__pic span::after {

    width: 1.0666vw;

    height: 4vw;

  }

  .p-cheer-illust__text {

    margin: 3.7333vw 0 0;

    font-size: 3.7333vw;

  }

  .p-cheer-illust__dot {

    margin-top: 8vw;

  }

  .p-cheer-illust__dot span {

    width: 2.1333vw;

    height: 2.1333vw;

  }

  .p-cheer-illust__dot span + span {

    margin-left: 4.2666vw;

  }



  .p-cheer-modal {

    overflow: auto;

  }

  .p-cheer-modal__inner {

    padding: 10.6666vw 0;

  }

  .p-cheer-modal__contentinner {

    overflow: hidden;

  }

  .p-cheer-modal__item {

    width: 100vw;

  }

  .p-cheer-modal__fig {

    width: 77.6vw;

    margin: 0 auto;

    box-shadow: 2.1333vw 2.1333vw 0px rgba(0, 0, 0, 0.1);

  }

  .p-cheer-modal__info {

    margin: 4.8vw 0 0;

    text-align: center;

  }

  .p-cheer-modal__player {

    margin: 0;

    font-size: 5.6vw;

  }

  .p-cheer-modal__grade {

    margin: 1.6vw;

    font-size: 4vw;

  }

  .p-cheer-modal__close {

    position: relative;

    margin: 9.0666vw auto 0;

    width: 16vw;

    height: 16vw;

    border: 1.0666vw solid #fff;

    border-radius: 100%;

  }

  .p-cheer-modal__close::before,

  .p-cheer-modal__close::after {

    width: 1.0666vw;

    height: 6.1333vw;

    border-radius: 1.0666vw;

  }



  .p-cheer-sns {

    margin: 18.6666vw 0;

  }

  .p-cheer-sns__head {

    width: 32.5333vw;

  }

  .p-cheer-sns__items {

    margin: 8vw 0 0;

  }

  .p-cheer-sns__item {

    width: 11.7333vw;

  }

  .p-cheer-sns__item + .p-cheer-sns__item {

    margin-left: 6.1333vw;

  }

}

@media screen and (min-width: 769px) {

  #container {

    width: 100%;

    min-width: 1120px;

    max-width: none;

  }

  .p-cheer-sp {

    display: none;

  }

  .p-cheer-container {

    padding-top: 18px;

    background: #B7D14B url("/about/svltc/cheeringart/52/images/bg_container_pc.png") no-repeat center 33px;

    background-size: 1324px auto;

  }

  .p-cheer-desc {

    width: 960px;

    margin: 0 auto;

    padding: 50px 65px;

    border-radius: 10px;

  }

  .p-cheer-desc__text {

    margin-top: 50px;

    font-size: 121.4285%;

  }

  .p-cheer-desc__text:first-child {

    margin-top: 0;

  }

  .p-cheer-desc__items {

    display: flex;

    justify-content: space-between;

    margin: 50px 0 0;

  }

  .p-cheer-desc__item {

    width: 380px;

  }

  .p-cheer-introduce {

    width: 1120px;

    margin: 80px auto 120px;

    padding-bottom: 100px;

  }

  .p-cheer-introduce__hdg {

    width: 464px;

    height: 104px;

    padding-top: 14px;

    background: url("/about/svltc/cheeringart/52/images/bg_introduce_pc.svg") no-repeat center top;

    background-size: contain;

    font-size: 32px;

  }

  .p-cheer-school {

    margin-top: 72px;

    padding-bottom: 50px;

    border: 4px solid #fff;

  }

  .p-cheer-school + .p-cheer-school {

    margin-top: 89px;

  }

  .p-cheer-school__name em {

    padding: 17px 56px;

    border-width: 4px;

    border-radius: 41px;

  }

  .p-cheer-player {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    overflow: hidden;

    margin: 89px 41px 0 42px;

  }

  .p-cheer-player + .p-cheer-player {

    margin-top: 50px;

    padding-top: 50px;

  }

  .p-cheer-player + .p-cheer-player::before {

    left: 15px;

    width: 998px;

    border-bottom: 4px solid #fff;

  }

  .p-cheer-player__fig {

    flex: 0 0 auto;

    width: 236px;

    margin: 14px 0 0 0;

    text-align: center;

  }

  .p-cheer-player__fig > img {

    width: 200px;

  }

  .p-cheer-player__catch {

    margin-top: -30px;

  }

  .p-cheer-illust__car-wrapper {

    width: 746px;

  }

  .p-cheer-illust-pc {

    flex: 0 0 auto;

    overflow: hidden;

    width: 754px;

  }

  .p-cheer-illust-sp {

    display: none;

  }

  .p-cheer-illust__item {

    width: 226px;

    margin-right: 34px;

  }

  .p-cheer-illust__item + .p-cheer-illust__item {

    /* margin-left: 34px; */

  }

  .p-cheer-illust__pic {

    box-shadow: 8px 8px 0px rgba(0, 0, 0, 0.1);

    cursor: pointer;

  }

  .p-cheer-illust__pic span {

    width: 35px;

    height: 35px;

  }

  .p-cheer-illust__pic span::before,

  .p-cheer-illust__pic span::after {

    border-radius: 1.5px;

  }

  .p-cheer-illust__pic span::before {

    width: 19px;

    height: 3px;

  }

  .p-cheer-illust__pic span::after {

    width: 3px;

    height: 19px;

  }

  .p-cheer-illust__text {

    margin: 20px 0 0;

    font-size: 114.2857%;

  }

  .p-cheer-illust__dot {

    margin-top: 32px;

  }

  .p-cheer-illust__dot span {

    width: 8px;

    height: 8px;

    cursor: pointer;

  }

  .p-cheer-illust__dot span + span {

    margin-left: 16px;

  }



  .p-cheer-modal {

    overflow: auto;

    padding: 50px 0 76px;

  }

  .p-cheer-modal__inner {

    position: relative;

    max-width: 1266px;

    margin: 0 auto;

    padding: 8px 0;

  }

  .p-cheer-modal__contentinner {

    overflow: hidden;

    width: 666px;

    margin: 0 auto;

  }

  .p-cheer-modal__item {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    width: 666px;

  }

  .p-cheer-modal__fig {

    width: 452px;

    box-shadow: 8px 8px 0px rgba(0, 0, 0, 0.1);

  }

  .p-cheer-modal__info {

    margin: 0;

  }

  .p-cheer-modal__player {

    margin: 0;

    font-size: 171.4285%;

  }

  .p-cheer-modal__grade {

    margin: 7px 0 0;

    font-size: 121.4285%;

  }

  .p-cheer-modal__close {

    position: absolute;

    top: 0;

    right: 0;

    width: 68px;

    height: 68px;

    border: 5px solid #fff;

    border-radius: 100%;

    cursor: pointer;

  }

  .p-cheer-modal__close::before,

  .p-cheer-modal__close::after {

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    margin: auto;

    background-color: #fff;

    content: '';

  }

  .p-cheer-modal__close::before,

  .p-cheer-modal__close::after {

    width: 6px;

    height: 30px;

    border-radius: 3px;

  }



  .p-cheer-sns {

    margin: 120px 0 60px;

  }

  .p-cheer-sns__head {

    width: 200px;

  }

  .p-cheer-sns__items {

    margin: 30px 0 0;

  }

  .p-cheer-sns__item {

    width: 44px;

  }

  .p-cheer-sns__item + .p-cheer-sns__item {

    margin-left: 43px;

  }

}

