.banner__container, .news__container, .friends__container, .intro__container, .anchor__container, .menu__container, .header__trigger, .cont__center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.banner__container > *, .news__container > *, .friends__container > *, .intro__container > *, .anchor__container > *, .menu__container > *, .header__trigger > *, .cont__center > * {
  min-height: 0%;
}

.banner__container, .news__container, .friends__container, .intro__container, .anchor__container, .header__container, .cont__container, .cont__container--small {
  box-sizing: content-box !important;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  .banner__container, .news__container, .friends__container, .intro__container, .anchor__container, .header__container, .cont__container, .cont__container--small {
    max-width: 92vw;
    padding-left: 0;
    padding-right: 0;
  }
}

.cont__container--small {
  max-width: 990px;
}
@media screen and (max-width: 767px) {
  .cont__container--small {
    max-width: 89.3333333333vw;
  }
}

.banner__link, .menu__link, .link {
  color: inherit;
  transition: opacity 0.3s;
  cursor: pointer;
}
.banner__link:hover, .menu__link:hover, .link:hover {
  opacity: 0.7;
}

/* common:start */
[v-cloak] {
  display: none;
}

@media screen and (max-width: 767px) {
  .pcOnly {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .spOnly {
    display: none !important;
  }
}

.cont__main {
  font-family: "Noto Sans JP", serif;
}
.fadeIn {
  transform: translate3d(0, 50px, 0);
  transition: 1s;
  opacity: 0;
}

.fadeIn.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

html {
  font-size: 62.5%;
}

*, *::before, *::after {
  box-sizing: border-box;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

#main {
  border-left: none;
}

.foot_design_soyora {
  padding-top: 0;
}

#footer .footer_content {
  font-size: 1.4rem;
}

.swiper__friends-container {
  width: 860px;
  overflow: hidden;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .swiper__friends-container {
    width: 69.3333333333vw;
  }
}
.swiper-slide {
  text-align: left;
}
.swiper-button-prev::after, .swiper-button-next::after {
  content: "";
  position: absolute;
  background-image: url(/sc/lp/soyora-soyoran/img/slider_arrow.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 31px;
  height: 51px;
  top: -20px;
}
@media screen and (max-width: 767px) {
  .swiper-button-prev::after, .swiper-button-next::after {
    width: 4.1333333333vw;
    height: 6.8vw;
    top: 2.6666666667vw;
  }
}
.swiper-button-prev {
  left: 0;
}
.swiper-button-next {
  right: 0;
}
.swiper-button-next::after {
  transform: rotate(180deg);
}
.swiper-pagination-bullet {
  width: 15px;
  height: 15px;
  background-color: transparent;
  border: 2px solid #0058ab;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .swiper-pagination-bullet {
    width: 2.6666666667vw;
    height: 2.6666666667vw;
    border-width: 1px;
  }
}
.swiper-pagination-bullet-active {
  background-color: #0058ab;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 10px;
}
@media screen and (max-width: 767px) {
  .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 6px;
  }
}
.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-container-horizontal .swiper-pagination-custom, .swiper-container-horizontal .swiper-pagination-fraction {
  bottom: 0;
}

.Sns-Linked {
  width: 100%;
}

/* common:end */
/* header:start */
.header {
  height: 121px;
  border-bottom: 4px solid #0058ab;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .header {
    height: 89px;
    border-width: 3px;
  }
}
.header__container {
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 24px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .header__container {
    max-width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .header__logo {
    width: 91px;
    margin-left: 23px;
  }
}
.header__trigger {
  border: none;
  background-color: transparent;
  appearance: none;
  margin-left: auto;
  margin-right: 30px;
}
.header__menu-icon {
  display: block;
  width: 30px;
  height: 20px;
  position: relative;
}
.header__menu-icon span {
  display: inline-block;
  position: absolute;
  left: 0;
  background: #0058ab;
  width: 100%;
  height: 2px;
  transition: transform 0.3s;
}
.header__menu-icon span:nth-child(1) {
  top: 0;
}
.header__menu-icon span:nth-child(2) {
  top: 9px;
}
.header__menu-icon span:nth-child(3) {
  top: 18px;
}

/* header:end */
/* menu:start */
@media screen and (max-width: 767px) {
  .menu {
    position: absolute;
    width: 100%;
    top: 0;
  }
}
@media screen and (max-width: 767px) {
  .menu__container {
    position: relative;
    z-index: 2;
    background-color: #fafafa;
    padding-top: 100px;
    padding-left: 48px;
    padding-right: 48px;
  }
}
@media screen and (max-width: 767px) {
  .menu__logo {
    width: 128px;
    margin-bottom: 30px;
  }
}
.menu__list {
  display: flex;
  justify-content: space-between;
  width: 605px;
  flex-wrap: nowrap;
  align-items: stretch;
}
@media screen and (max-width: 767px) {
  .menu__list {
    flex-direction: column;
    width: 100%;
    margin-left: auto;
    height: auto;
    padding-top: 50px;
    padding-bottom: 115px;
    border-top: 2px solid #00a0e9;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .menu__list li:not(:first-child) {
    margin-top: 30px;
  }
}
.menu__link {
  font-size: 1.8rem;
  color: #0058ab;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .menu__link {
    font-size: 1.7rem;
  }
}
.menu__bg {
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .menu__bg {
    display: none;
  }
}
.menu__close {
  border: none;
  background-color: transparent;
  appearance: none;
  margin-left: auto;
  position: absolute;
  top: 20px;
  right: 15px;
}
.menu__close-icon {
  display: block;
  width: 30px;
  height: 20px;
  position: relative;
}
.menu__close-icon span {
  display: inline-block;
  position: absolute;
  left: 0;
  background: #0058ab;
  width: 100%;
  height: 2px;
  transition: transform 0.3s;
}
.menu__close-icon span:nth-child(1) {
  top: 50%;
  transform: rotate(135deg);
}
.menu__close-icon span:nth-child(2) {
  top: 50%;
  transform: rotate(45deg);
}

/* menu:end */
/* kv:start */
.kv {
  min-width: 1024px;
  border-top: 4px solid #00a0e9;
  height: 31.1979166667vw;
  min-height: 320px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .kv {
    border-width: 3px;
    min-width: auto;
    height: 138.6666666667vw;
    min-height: none;
  }
}
.kv__items {
  width: 100%;
  height: 100%;
  min-width: 1024px;
}
@media screen and (max-width: 767px) {
  .kv__items {
    min-width: auto;
    height: 138.6666666667vw;
  }
}
.kv__image-01, .kv__image-02, .kv__image-03, .kv__image-04, .kv__image-05, .kv__image-06, .kv__soyora {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100%;
}
.kv__image-01.isFvShow {
  animation: fade-in 1s ease-in both;
}
.kv__image-02.isFvShow {
  animation: fade-in 0.5s ease-in both;
  animation-delay: 1.5s;
}
.kv__image-03.isFvShow {
  animation: fade-in 0.5s ease-in both;
  animation-delay: 2.5s;
}
.kv__image-04.isFvShow {
  animation: fade-in 0.5s ease-in both;
  animation-delay: 3.5s;
}
.kv__image-05.isFvShow {
  animation: fade-in 0.5s ease-in both;
  animation-delay: 4.5s;
}
.kv__image-06.isFvShow {
  animation: fade-in 1s ease-in both;
  animation-delay: 5.5s;
}
.kv__soyora.isFvShow {
  animation: fade-in 1.5s ease-in both, fuwafuwa 3s linear infinite;
  animation-delay: 6.5s;
}
@media screen and (max-width: 767px) {
  .kv__soyora.isFvShow {
    width: 57.6vw !important;
    position: absolute;
    top: 68.9333333333vw;
    left: 21.3333333333vw;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 100%;
  }
}
@keyframes fuwafuwa {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5%);
  }
  100% {
    transform: translateY(0);
  }
}
/* kv:end */
/* anchor:start */
.anchor {
  background-image: url(../img/pc/anchor_bg_02.png), url(../img/pc/anchor_bg_01.png);
  background-position: bottom center, top center;
  background-repeat: repeat-x, no-repeat;
  background-size: 1920px;
  background-color: #79d7fe;
  height: 1114px;
  min-width: 1024px;
  padding-top: 40px;
  padding-bottom: 240px;
}
@media screen and (max-width: 767px) {
  .anchor {
    background-image: url(../img/sp/anchor_bg_02.png), url(../img/sp/anchor_bg_01.png);
    background-size: contain;
    min-width: auto;
    height: auto;
    padding-top: 6.6666666667vw;
    padding-bottom: 28vw;
  }
}
@media screen and (min-width: 1921px) {
  .anchor {
    background-size: contain, cover;
  }
}
.anchor__items {
  width: 910px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .anchor__items {
    width: 92vw;
    flex-wrap: wrap;
  }
}
.anchor__items li {
  width: 290px;
  height: 100px;
  background-color: #fff;
  border-radius: 50px;
  position: relative;
  box-shadow: 9px 8px 11.28px 0.72px rgba(80, 188, 233, 0.43);
  transition: transform 0.6s;
}
.anchor__items li:hover {
  transform: scale(1.1);
}
.anchor__items li:hover .anchor__link, .anchor__items li:hover .anchor__link--news, .anchor__items li:hover .anchor__link--friends, .anchor__items li:hover .anchor__link--intro {
  color: #00a0e9;
}
@media screen and (max-width: 767px) {
  .anchor__items li {
    width: 44vw;
    height: 16vw;
    border-radius: 8vw;
    box-shadow: 2.4vw 2.1333333333vw 3.008vw 0.192vw rgba(80, 188, 233, 0.43);
  }
  .anchor__items li:nth-child(3) {
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
  }
}
.anchor__link, .anchor__link--news, .anchor__link--friends, .anchor__link--intro {
  display: block;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.3333333333;
  color: #0058ab;
  width: 100%;
  height: 100%;
  position: relative;
  transition: all 0.3s;
}
.anchor__link::after, .anchor__link--news::after, .anchor__link--friends::after, .anchor__link--intro::after {
  content: "";
  position: absolute;
  display: block;
  background-image: url(../img/pc/anchor_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 25px;
  height: 15px;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  .anchor__link::after, .anchor__link--news::after, .anchor__link--friends::after, .anchor__link--intro::after {
    background-image: url(../img/sp/anchor_arrow.png);
    width: 3.7333333333vw;
    height: 2.2666666667vw;
    bottom: 1.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .anchor__link, .anchor__link--news, .anchor__link--friends, .anchor__link--intro {
    font-size: 3.2vw;
    line-height: 1.4166666667;
  }
}
.anchor__link::before, .anchor__link--news::before, .anchor__link--friends::before, .anchor__link--intro::before {
  content: "";
  position: absolute;
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  top: 22px;
}
@media screen and (max-width: 767px) {
  .anchor__link::before, .anchor__link--news::before, .anchor__link--friends::before, .anchor__link--intro::before {
    top: 4.9333333333vw;
  }
}
.anchor__link--intro {
  padding-left: 110px;
  padding-top: 35px;
}
@media screen and (max-width: 767px) {
  .anchor__link--intro {
    padding-left: 14.6666666667vw;
    padding-top: 5.3333333333vw;
  }
}
.anchor__link--intro::before {
  background-image: url(../img/pc/anchor_icon01.png);
  width: 45px;
  height: 42px;
  left: 47px;
}
@media screen and (max-width: 767px) {
  .anchor__link--intro::before {
    background-image: url(../img/sp/anchor_icon01.png);
    width: 5.4666666667vw;
    height: 4.9333333333vw;
    left: 6.2666666667vw;
  }
}
.anchor__link--friends {
  text-align: center;
  padding-left: 50px;
  padding-top: 18px;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 767px) {
  .anchor__link--friends {
    padding-left: 8vw;
    padding-top: 2vw;
  }
}
.anchor__link--friends::before {
  background-image: url(../img/pc/anchor_icon02.png);
  width: 40px;
  height: 43px;
  left: 24px;
}
@media screen and (max-width: 767px) {
  .anchor__link--friends::before {
    background-image: url(../img/sp/anchor_icon02.png);
    width: 5.4666666667vw;
    height: 5.8666666667vw;
    left: 2.6666666667vw;
  }
}
.anchor__link--news {
  padding-left: 110px;
  padding-top: 35px;
}
@media screen and (max-width: 767px) {
  .anchor__link--news {
    padding-left: 14.6666666667vw;
    padding-top: 5.3333333333vw;
  }
}
.anchor__link--news::before {
  background-image: url(../img/pc/anchor_icon03.png);
  width: 43px;
  height: 43px;
  left: 48px;
}
@media screen and (max-width: 767px) {
  .anchor__link--news::before {
    background-image: url(../img/sp/anchor_icon03.png);
    width: 5.3333333333vw;
    height: 5.3333333333vw;
    left: 8vw;
  }
}

/* anchor:end */
/* intro:start */
.intro__container {
  padding-top: 80px;
}
@media screen and (max-width: 767px) {
  .intro__container {
    padding-top: 13.3333333333vw;
  }
}
.intro__lead {
  width: 408px;
}
@media screen and (max-width: 767px) {
  .intro__lead {
    width: 81.0666666667vw !important;
  }
}
.intro__title {
  margin-top: 27px;
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .intro__title {
    margin-top: 4.6666666667vw;
    margin-bottom: 10.6666666667vw;
  }
}
.intro__title-image {
  width: 372px;
}
@media screen and (max-width: 767px) {
  .intro__title-image {
    width: 61.8666666667vw !important;
  }
}
.intro__content {
  background-image: url(../img/pc/intro_bg.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 483px;
  padding-top: 62px;
  padding-left: 40px;
  padding-right: 42px;
  padding-bottom: 61px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .intro__content {
    background-image: url(../img/sp/intro_bg.png);
    width: 92.1333333333vw;
    height: auto;
    padding-top: 12.5333333333vw;
    padding-left: 6vw;
    padding-right: 6vw;
    padding-bottom: 10.9333333333vw;
    flex-direction: column;
  }
}
.intro__sorayon {
  width: 351px !important;
  height: 307px !important;
  margin-top: 25px !important;
}
@media screen and (max-width: 767px) {
  .intro__sorayon {
    width: 46.8vw !important;
    height: auto !important;
    margin-top: 0 !important;
    margin-bottom: 2.6666666667vw !important;
  }
}
.intro__fukidasi {
  background-image: url(../img/pc/intro_fukidasi.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 561px;
  height: 361px;
}
@media screen and (max-width: 767px) {
  .intro__fukidasi {
    background-image: url(../img/sp/intro_fukidasi.png);
    width: 80.1333333333vw;
    height: auto;
  }
}
.intro__fukidasi-text {
  font-size: 2.2rem;
  font-weight: 500;
  line-height: 1.4545454545;
  letter-spacing: 0.05em;
  text-align: center;
  color: #000;
  padding-top: 53px;
  padding-left: 80px;
  padding-right: 35px;
  padding-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .intro__fukidasi-text {
    font-size: 3.7333333333vw;
    line-height: 1.3571428571;
    padding-top: 13.3333333333vw;
    padding-left: 4vw;
    padding-right: 1.3333333333vw;
    padding-bottom: 10vw;
  }
}

/* intro:end */
/* friends:start */
.friends {
  background-image: url(../img/pc/friends_bg_01.png);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 1046px;
  min-width: 1024px;
  background-color: #f3fbfe;
  padding-top: 55px;
  padding-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .friends {
    background-image: url(../img/sp/friends_bg_01.png);
    background-size: contain;
    height: auto;
    min-width: auto;
    padding-top: 9.3333333333vw;
    padding-bottom: 13.3333333333vw;
  }
}
.friends__title {
  margin-top: 27px;
  display: flex;
  position: relative;
}
@media screen and (max-width: 767px) {
  .friends__title {
    margin-top: 4vw;
  }
}
.friends__title-image {
  width: 782px !important;
  height: 50px !important;
}
@media screen and (max-width: 767px) {
  .friends__title-image {
    width: 82.8vw !important;
    height: auto !important;
  }
}
.friends__family {
  width: 1024px;
  position: relative;
  padding-bottom: 55px;
}
@media screen and (max-width: 767px) {
  .friends__family {
    width: 92vw;
    padding-bottom: 9.3333333333vw;
  }
}
.friends__block {
  width: 860px !important;
  display: flex;
  justify-content: space-between;
  margin-top: 60px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 767px) {
  .friends__block {
    width: 69.3333333333vw !important;
    margin-top: 10.6666666667vw;
  }
}
.friends__content {
  width: 400px !important;
  height: 600px;
  background-image: url(../img/pc/friends_border.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #fff;
  padding-top: 17px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .friends__content {
    width: 69.3333333333vw !important;
    height: 104vw;
    background-image: url(../img/sp/friends_border.png);
    padding-top: 2.9333333333vw;
  }
}
.friends__content::before {
  content: "";
  display: block;
  position: absolute;
  background-image: url(../img/pc/friends_sorayon_02.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 89px;
  height: 78px;
  bottom: 160px;
  right: 23px;
}
@media screen and (max-width: 767px) {
  .friends__content::before {
    background-image: url(../img/sp/friends_sorayon_02.png);
    width: 15.4666666667vw;
    height: 13.7333333333vw;
    bottom: 32.8vw;
    right: 4vw;
  }
}
.friends__name {
  font-size: 2rem;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: #000;
  width: 300px;
  height: 50px;
  border: 3px solid #00a0e9;
  border-radius: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .friends__name {
    font-size: 1.4rem;
    width: 195px;
    height: 33px;
    border-width: 2px;
    border-radius: 17px;
  }
}
@media screen and (max-width: 767px) {
  .friends__chara {
    width: 68.2666666667vw !important;
    height: 57.8666666667vw !important;
  }
}
.friends__comment {
  font-size: 2rem;
  line-height: 1.3;
  font-weight: 500;
  color: #fff;
  margin-top: 20px;
  padding-top: 25px;
  padding-left: 20px;
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  .friends__comment {
    font-size: 3.7333333333vw;
    line-height: 1.2857142857;
    height: 25.4666666667vw;
    margin-top: 0;
    padding-top: 1.3333333333vw;
    padding-left: 4vw;
    padding-right: 4vw;
    position: absolute;
    bottom: 3.3333333333vw;
  }
}

/* friends:end */
/* news:start */
.news {
  background-color: #79d7fe;
  height: auto;
  min-width: 1024px;
  padding-top: 60px;
  padding-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .news {
    min-width: auto;
    height: auto;
    padding-top: 10.6666666667vw;
    padding-bottom: 10.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .news__container {
    height: auto;
  }
}
.news__lead {
  width: 422px !important;
  height: 32px !important;
}
@media screen and (max-width: 767px) {
  .news__lead {
    width: 83.8666666667vw !important;
    height: auto !important;
  }
}
.news__title {
  margin-top: 27px;
  display: flex;
  position: relative;
}
@media screen and (max-width: 767px) {
  .news__title {
    margin-top: 4.6666666667vw;
  }
}
.news__title-image {
  width: 272px !important;
  height: 51px !important;
}
@media screen and (max-width: 767px) {
  .news__title-image {
    width: 45.3333333333vw !important;
    height: auto !important;
  }
}

/* news:end */
/* banner:start */
.banner {
  background-image: url(../img/pc/banner_bg.png);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #f3fbfe;
  height: 636px;
  min-width: 1024px;
  padding-top: 80px;
  margin-bottom: -173px;
}
@media screen and (max-width: 767px) {
  .banner {
    background-image: url(../img/sp/banner_bg.png);
    height: 168vw;
    min-width: auto;
    margin-bottom: -10.6666666667vw;
    padding-top: 13.3333333333vw;
    margin-bottom: -30.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .banner__container {
    max-width: none;
  }
}
.banner__items {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .banner__items {
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  .banner__title-01 {
    width: 90.6666666667vw !important;
  }
}
@media screen and (max-width: 767px) {
  .banner__title-02 {
    width: 77.6vw !important;
    margin-top: 10vw !important;
  }
}
.banner__link {
  margin-top: 30px !important;
  box-shadow: 9px 8px 11.28px 0.72px rgba(141, 213, 245, 0.43);
}
@media screen and (max-width: 767px) {
  .banner__link {
    width: 92vw !important;
    margin-top: 7.4666666667vw !important;
    margin-left: 4vw !important;
    box-shadow: 2.4vw 2.1333333333vw 3.008vw 0.192vw rgba(141, 213, 245, 0.43);
  }
}

/* banner:end */