@charset "utf-8";

/*		Contents
---------------------------------------------------------------------------

	TOPページ

------------------------------------------------------------------------ */



/* メインビジュアル
-------------------------------------------------------  */

.home-mv-outer {
  display: flex;
  justify-content: center;
  gap: 60px;
  background-color: var(--right-gray);
}

.home-mv-wrapper {
  position: relative;
  padding-bottom: 116px;
  margin-bottom: 132px;
  background: url(../../img/top/bg-mv-wave.png) no-repeat;
  background-position: bottom center;
  background-size: auto;
  overflow-x: clip;
}

.home-mv-wrapper::before {
  content: '';
  position: absolute;
  top: -300px;
  right: -170px;
  background: url(../../img/common/bg-brush-orange.png) no-repeat;
  background-position: bottom center;
  background-size: cover;
  width: clamp(553px, 38vw, 730px);
  height: clamp(553px, 38vw, 730px);
}

.home-mv-wrapper::after {
  content: '';
  position: absolute;
  bottom: -130px;
  left: -170px;
  background: url(../../img/common/bg-brush-green.png) no-repeat;
  background-position: bottom center;
  background-size: cover;
  width: clamp(553px, 38vw, 730px);
  height: clamp(553px, 38vw, 730px);
}

.home-mv-title {
  font-family: var(--font-en);
  font-size: 8.8rem;
  font-style: normal;
  font-weight: 700;
  line-height: 120%;
  margin-bottom: 24px;
}

.home-mv-name-block {
  margin-left: 100px;
}

.home-mv-txt {
  color: var(--aqua-green);
  font-family: var(--font-en);
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}




@media screen and (max-width: 768px) {

  .home-mv-bg {
  background: url(../../img/top/bg-mv-sp.png);
  background-size: 100%;
  }

  .home-mv-wrapper {
    background: url(../../img/top/bg-mv-wave-sp.png) no-repeat;
    background-position: bottom center;
    background-size: 100%;
    padding-bottom: 31px;
    margin-bottom: 100px;
  }

  .home-mv-wrapper::before {
    width: clamp(320px, 85vw, 650px);
    height: clamp(320px, 85vw, 650px);
    top: -230px;
    right: -100px;
  }

  .home-mv-wrapper::after {
    width: clamp(320px, 85vw, 650px);
    height: clamp(320px, 85vw, 650px);
    bottom: -80px;
    left: -100px;
  }


  .home-mv-outer {
    flex-direction: column;
    align-items: center;
    padding: 0 15px 36px 15px;
  }

  .home-mv-title {
    font-size: 6rem;
  }

  .home-mv-name-block {
    margin-left: 60px;
  }
}




/* About
-------------------------------------------------------  */

.about-wrapper {
  overflow: hidden;
  padding-top: 132px;
}

.about-enclose {
  position: relative;
}

.about-enclose::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -100px;
  background: url(../../img/common/bg-blur.png) no-repeat center;
  width: 290px;
  height: 379px;
}

.about-outer {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-bottom: 68px;
}

.about-txt-content {
  display: grid;
  gap: 32px;
  max-width: 632px;
}

.pr-title {
  font-size: 2.0rem;
  font-weight: 600;
}

.about-txt-block {
  display: grid;
  gap: 28px;
}


@media screen and (max-width: 768px) {

  .about-enclose::before {
    top: -30px;
    right: -20px;
    width: 180px;
    height: 235px;
    background-size: 100%;
  }

  .about-outer {
    display: flex;
    align-items: center;
    gap: 40px;
    margin-bottom: 68px;
    flex-direction: column;
  }
}