@charset "UTF-8";
/*
design&cording: Kanako 
t-u-l-i-p.com
*/
li {
  list-style: none;
}

a {
  text-decoration: none;
}

p.small {
  color: #B9B9B9;
  font-size: 25px;
  letter-spacing: 3px;
}

.title {
  color: #3E3E3E;
  font-size: 43px;
  letter-spacing: 4px;
  font-weight: bolder;
}

.mobile-menu {
  display: none;
}

/*------------------ふわっ---------------*/
.fadeUp {
  -webkit-animation-name: fadeUpAnime;
          animation-name: fadeUpAnime;
  -webkit-animation-duration: .8s;
          animation-duration: .8s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeUpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(150px);
            transform: translateY(150px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(150px);
            transform: translateY(150px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

/* アニメーションスタートの遅延時間を決めるCSS*/
.delay-time01 {
  -webkit-animation-delay: 0.05s;
          animation-delay: 0.05s;
}

.delay-time02 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

.delay-time03 {
  -webkit-animation-delay: .9s;
          animation-delay: .9s;
}

/*------------------じわっ---------------*/
.blur {
  -webkit-animation-name: blurAnime;
          animation-name: blurAnime;
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes blurAnime {
  from {
    -webkit-filter: blur(10px);
            filter: blur(10px);
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
  to {
    -webkit-filter: blur(0);
            filter: blur(0);
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes blurAnime {
  from {
    -webkit-filter: blur(10px);
            filter: blur(10px);
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
  to {
    -webkit-filter: blur(0);
            filter: blur(0);
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

/*------------------wrapper4/左から---------------*/
.fadeLeft {
  -webkit-animation-name: fadeLeftAnime;
          animation-name: fadeLeftAnime;
  -webkit-animation-duration: 1.0s;
          animation-duration: 1.0s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeLeftAnime {
  from {
    opacity: 0;
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

header .row .content {
  background: #071e128f;
  position: fixed;
  z-index: 10;
  width: 100%;
  overflow-x: hidden;
}

header .row .content ul {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 11% 86%;
      grid-template-columns: 11% 86%;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  margin: .3rem 0;
}

header .row .content ul .logo img {
  width: 70%;
  max-width: 64px;
  height: 100%;
}

header .row .content ul .items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

header .row .content ul .items li {
  width: 100%;
}

header .row .content ul .items li a {
  color: #fff;
  display: block;
}

header .row .content ul .items li a p.read-small-oil {
  text-align: center;
  margin: 0;
  font-size: .8rem;
  letter-spacing: 5px;
  margin-left: .8rem;
}

header .row .content ul .items li a p.read-small-cream {
  text-align: center;
  margin: 0;
  font-size: .8rem;
  letter-spacing: 5px;
}

header .row .content ul .items li a p.read-main-oil {
  font-size: 2rem;
  letter-spacing: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: .5rem;
}

header .row .content ul .items li a p.read-main-oil img {
  height: 100%;
  max-width: 45px;
}

header .row .content ul .items li a p.read-main-cream {
  font-size: 2rem;
  letter-spacing: 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  gap: .3rem;
}

header .row .content ul .items li a p.read-main-cream img {
  height: 100%;
  max-width: 48px;
  margin-right: .3rem;
}

header .row .content ul .items li.oil {
  border-right: solid 1px #d2ffd2c7;
}

header .row .content ul .items li.oil p.alfides {
  font-size: 3.3rem;
  letter-spacing: 14px;
  margin: 0;
  color: #fff;
  font-family: serif;
  text-align: center;
}

.wrapper1 {
  padding-top: 102px;
  z-index: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(#16181c), color-stop(11%, #324764), color-stop(12%, #646464), color-stop(17%, #ecfbda), color-stop(23%, #fff), to(#fff));
  background: linear-gradient(180deg, #16181c 0%, #324764 11%, #646464 12%, #ecfbda 17%, #fff 23%, #fff 100%);
}

.wrapper1 .row {
  margin: 9rem 0 4rem;
}

.wrapper1 .row .content {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 66% 33%;
      grid-template-columns: 66% 33%;
  width: 80%;
  margin: 0 auto;
}

.wrapper1 .row .content .top-slide {
  width: 100%;
}

.wrapper1 .row .content .top-slide img {
  width: 100%;
}

.wrapper1 .row .content .img-items img {
  width: 100%;
}

.wrapper2 .row {
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(24%, #b9d1b973), color-stop(28%, #b9d1b987), to(#dfecf991));
  background: linear-gradient(180deg, #fff 0%, #b9d1b973 24%, #b9d1b987 28%, #dfecf991 100%);
  display: block;
  z-index: 2;
}

.wrapper2 .row .content {
  z-index: 5;
}

.wrapper2 .row .content ul {
  padding: 0;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr;
      grid-template-columns: 1fr 1fr 1fr;
  justify-items: center;
  width: 64%;
  min-width: 700px;
  margin: 0 auto;
}

.wrapper2 .row .content ul li {
  text-align: center;
  background: #fff;
  width: 19vw;
  height: 19vw;
  min-width: 220px;
  min-height: 220px;
  -webkit-box-shadow: 0px -9px 18px 10px #cad9cac7;
          box-shadow: 0px -9px 18px 10px #cad9cac7;
  border-radius: 50%;
  position: relative;
}

.wrapper2 .row .content ul li a {
  position: absolute;
  top: 57%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 80%;
  font-size: 1.9rem;
  font-weight: bolder;
  letter-spacing: 3px;
  color: #a5bfc7;
}

.wrapper2 .row .content ul li a p {
  color: #ababab;
  margin: 0;
}

.wrapper2 .row .content ul li a .fa-caret-down {
  font-size: 4rem;
}

.wrapper2 .row .content ul .box {
  opacity: 0;
}

.wrapper3 .row {
  background: -webkit-gradient(linear, left top, left bottom, from(#dfecf994), color-stop(4%, #dfecf96e), to(#fff));
  background: linear-gradient(180deg, #dfecf994 0%, #dfecf96e 4%, #fff 100%);
}

.wrapper3 .row .bg-hexagon {
  background-image: url(../img/shape-6-bg3.png);
  top: 0;
  right: 0;
  background-size: cover;
  background-repeat: no-repeat;
}

.wrapper3 .row .bg-hexagon .content {
  width: 100%;
  max-width: 1200px;
  margin: 6rem auto 8rem;
  text-align: center;
}

.wrapper3 .row .bg-hexagon .content h1.title {
  margin-bottom: 3rem;
}

.wrapper3 .row .bg-hexagon .content p.text-top {
  color: #9B9B9B;
  font-size: 24px;
  letter-spacing: 2px;
  font-weight: bolder;
}

.wrapper3 .row .bg-hexagon .content .text-wrap {
  width: 100%;
  max-width: 1100px;
  margin: 3rem auto;
  text-align: justify;
  line-height: 2.2rem;
  font-size: 1.25rem;
  font-weight: normal;
}

.wrapper3 .row .bg-hexagon .content .text-wrap p {
  margin-bottom: 3rem;
}

.wrapper3 .row .bg-hexagon .content .small {
  position: relative;
}

.wrapper3 .row .bg-hexagon .content .small::before {
  content: '';
  position: absolute;
  top: 40px;
  width: 160px;
  height: 3px;
  background: linear-gradient(135deg, #1feb7a 0, #18252c 49%, #ffb819 100%);
}

.wrapper4 {
  position: relative;
}

.wrapper4 .row .content {
  padding: 0;
  padding-bottom: 4rem;
}

.wrapper4 .row .content .bg {
  background: -webkit-gradient(linear, left bottom, left top, from(#feffff), to(#c0c7cb73)), url(../img/cream-big/004.jpg);
  background: linear-gradient(360deg, #feffff, #c0c7cb73), url(../img/cream-big/004.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 30rem;
  background-position-y: 47%;
  z-index: 3;
}

.wrapper4 .row .content .text-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}

.wrapper4 .row .content .text-wrap .small {
  position: relative;
}

.wrapper4 .row .content .text-wrap .small::before {
  content: '';
  position: absolute;
  top: 40px;
  width: 80px;
  height: 3px;
  background: linear-gradient(135deg, #1feb7a 0, #18252c 49%, #ffb819 100%);
}

.wrapper4 .row .content .topic {
  color: #767676;
  font-size: 25px;
  font-weight: bolder;
  letter-spacing: 2px;
  padding: 6rem 0 3rem;
}

.wrapper4 .row .content .item-1 {
  max-width: 1300px;
  margin: 0 auto;
}

.wrapper4 .row .content .item-1 .wrap {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 65% 32%;
      grid-template-columns: 65% 32%;
  width: 94%;
  gap: 2rem;
  margin: 0 auto;
}

.wrapper4 .row .content .item-1 .wrap img {
  width: 100%;
}

.wrapper4 .row .content .item-1 p.text {
  margin: auto 0;
  text-align: justify;
  line-height: 1.8;
  font-size: 1.18rem;
}

.wrapper4 .row .content .item-2 {
  position: relative;
}

.wrapper4 .row .content .item-2 .content {
  max-width: 1300px;
  margin: 0 auto;
}

.wrapper4 .row .content .item-2 .content .wrap-graph {
  width: 94%;
  margin: 0 auto;
}

.wrapper4 .row .content .item-2 .content .wrap-graph p {
  text-align: justify;
  line-height: 1.8;
  font-size: 1.18rem;
}

.wrapper4 .row .content .item-2 .content .wrap-graph .graphs {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  margin: 2rem auto;
  gap: 1rem;
  width: 74%;
}

.wrapper4 .row .content .item-2 .content .wrap-graph .graphs img {
  width: 100%;
}

.wrapper4 .row .content .item-2 .content .wrap-graph .graphs img.graph-1 {
  width: 94%;
}

.wrapper4 .row .content .item-2::before {
  background-color: #dbe3db69;
  bottom: -20px;
  content: "";
  display: block;
  height: 36%;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: -1;
}

.wrapper4 .row .content .item-3 {
  position: relative;
  padding-bottom: 6rem;
  z-index: 0;
}

.wrapper4 .row .content .item-3 .content {
  max-width: 1300px;
  margin: 0 auto;
}

.wrapper4 .row .content .item-3 .content p.sub {
  color: #809072;
  font-weight: bolder;
  font-size: 1.3rem;
  width: 94%;
  margin: 0 auto 2rem;
}

.wrapper4 .row .content .item-3 .content p.text-main {
  text-align: justify;
  line-height: 1.8;
  font-size: 1.18rem;
  width: 94%;
  margin: 0 auto;
}

.wrapper4 .row .content .item-3 .content .figure {
  width: 33rem;
}

.wrapper4 .row .content .item-3 .content .figure img {
  width: 100%;
}

.wrapper4 .row .content .item-3::before {
  background-color: #F0F3F0;
  content: "";
  display: block;
  height: 111%;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: -1;
  -webkit-clip-path: polygon(-3% 0%, 100% 0%, 100% 100%, 23% 100%);
          clip-path: polygon(-3% 0%, 100% 0%, 100% 100%, 23% 100%);
}

.wrapper4 .row .content .item-3::after {
  content: url(../img/model-3.png);
  position: absolute;
  top: 205px;
  right: 126px;
  opacity: 0.3;
  z-index: -1;
  -webkit-transform: scale(1.4);
          transform: scale(1.4);
  overflow-x: hidden;
}

.wrapper5 .row .content {
  width: 100%;
  margin: 0 auto;
  position: relative;
  text-align: center;
}

.wrapper5 .row .content .small {
  position: relative;
}

.wrapper5 .row .content .small::before {
  content: '';
  position: absolute;
  top: 40px;
  width: 133px;
  height: 3px;
  background: linear-gradient(135deg, #1feb7a 0, #18252c 49%, #ffb819 100%);
}

.wrapper5 .row .content h3 {
  margin-bottom: 3rem;
}

.wrapper5 .row .content .wrap {
  max-width: 1300px;
  margin: 0 auto;
}

.wrapper5 .row .content .wrap .img-professor {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 43% 57%;
      grid-template-columns: 43% 57%;
  justify-items: center;
  width: 82%;
  margin: 0 0 0 auto;
  padding: 2rem 0 1rem;
  white-space: nowrap;
}

.wrapper5 .row .content .wrap .img-professor img {
  width: 84%;
  min-width: 310px;
  max-width: 500px;
}

.wrapper5 .row .content .wrap .img-professor p.introduction-top {
  margin: auto 0;
  font-size: calc(1.125rem + ((1vw - 7.69px) * 1.8832));
  color: #8d8d8d;
  font-weight: bolder;
}

.wrapper5 .row .content .wrap .img-professor p.introduction-top span {
  color: #557461;
  font-size: 2.2rem;
  line-height: 5rem;
}

.wrapper5 .row .content .wrap p.introduction-text {
  text-align: justify;
  width: 62%;
  margin: 3rem auto 3rem 7rem;
  line-height: 1.8;
  font-size: 1.18rem;
}

.wrapper5 .row .content::before {
  background-color: #F0F3F0;
  content: "";
  display: block;
  height: 111%;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: -1;
  -webkit-clip-path: polygon(23% 0%, 100% 0%, 100% 90%, 0% 100%);
          clip-path: polygon(23% 0%, 100% 0%, 100% 90%, 0% 100%);
}

.wrapper5-2 .row {
  position: relative;
}

.wrapper5-2 .row .content {
  max-width: 1300px;
  margin: 3rem auto 0;
  text-align: center;
}

.wrapper5-2 .row .content ul.wrap1 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
      grid-template-columns: 1fr 1fr 1fr 1fr;
  width: 97%;
  margin: 0 auto;
  justify-items: center;
  padding: 0;
}

.wrapper5-2 .row .content ul.wrap2 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr;
      grid-template-columns: 1fr 1fr 1fr;
  width: 74%;
  margin: 0 auto;
  justify-items: center;
  padding: 0;
}

.wrapper5-2 .row .content li.item {
  width: 100%;
  height: 27vw;
  min-height: 193px;
  max-width: 310px;
  max-height: 350px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  background-image: url(../img/stripe-hexagon2.png);
  background-size: cover;
  background-repeat: no-repeat;
  color: #5c786d;
  font-weight: bolder;
  font-size: calc(1.375rem + ((1vw - 7.69px) * 0.565));
  letter-spacing: 2px;
}

.wrapper5-2 .row .content li.item img {
  width: 10rem;
  height: 10rem;
  padding: 1rem;
  -o-object-fit: contain;
     object-fit: contain;
}

.wrapper5-2 .row .content li.item-logo {
  background-image: url(../img/shape-6-single-2.png);
}

.wrapper6 .row .content {
  max-width: 1300px;
  margin: 5rem auto;
  text-align: center;
}

.wrapper6 .row .content ul.users {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  gap: 3rem 1rem;
  margin: 4rem auto;
  padding: 0;
}

.wrapper6 .row .content ul.users li.item {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 30% 70%;
      grid-template-columns: 30% 70%;
  width: 95%;
}

.wrapper6 .row .content ul.users li.item .wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto;
}

.wrapper6 .row .content ul.users li.item .wrap img {
  width: 110px;
  margin-top: 2rem;
}

.wrapper6 .row .content ul.users li.item .wrap p.name {
  color: #637c63;
  font-size: 18px;
  font-weight: bolder;
  text-align: center;
  margin-top: 5px;
}

.wrapper6 .row .content ul.users li.item p.voice {
  margin: auto 0;
  border: solid 2px #a6b9a6;
  padding: 2rem;
  border-radius: 20px;
  font-size: 1.2rem;
  line-height: 1.6;
  text-align: justify;
}

.wrapper7 .row .content {
  max-width: 1300px;
  margin: 0 auto 4rem;
  text-align: center;
}

.wrapper7 .row .content ul.items {
  width: 100%;
  margin: 5rem auto;
  padding: 0;
}

.wrapper7 .row .content ul.items li.item {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 50% 50%;
      grid-template-columns: 50% 50%;
  justify-items: center;
  width: 80%;
  margin: 0 auto;
}

.wrapper7 .row .content ul.items li.item img {
  width: 100%;
  height: 37vw;
  max-width: 450px;
  max-height: 450px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 40% 0%;
     object-position: 40% 0%;
  border-radius: 15%;
}

.wrapper7 .row .content ul.items li.item .text {
  width: 90%;
  margin: auto;
  color: #8b8b8b;
  font-weight: bolder;
  font-size: 18px;
  line-height: 3rem;
}

.wrapper7 .row .content ul.items li.item .text p.name {
  font-size: 21px;
  white-space: nowrap;
}

.wrapper7 .row .content ul.items li.item .text p.name span {
  font-size: 1.8rem;
  letter-spacing: 2px;
}

.wrapper7 .row .content ul.items .reverse img {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}

.wrapper7 .row .content ul.items .reverse .img-2 {
  -o-object-position: 51% 0%;
     object-position: 51% 0%;
}

.wrapper7 .row .content ul.items .reverse .detail {
  text-align: justify;
  line-height: 1.9;
  margin: 2rem 0;
}

.wrapper7 .row .content ul.items .reverse .detail span {
  font-size: 14px;
}

footer .row {
  background-color: #151c15de;
  padding: 3rem 0 1rem;
}

footer .row .content {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
}

footer .row .content ul.items {
  margin: 2rem auto;
  padding: 0;
}

footer .row .content ul.items li a {
  color: #7f837e;
  font-size: 1rem;
  line-height: 2.2rem;
}

footer .row .content .sns {
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
}

footer .row .content .sns i.facebook {
  font-size: 60px;
  color: #a2afa7;
}

footer .row .content .sns i.twitter {
  font-size: 41px;
  background-color: #a2afa7;
  color: #151c15c7;
  border-radius: 50%;
  padding: .6rem;
}

footer .row p.bottom {
  text-align: center;
  color: #fff;
  font-size: 18px;
}

.banner-wrap {
  width: 11rem;
  max-width: 200px;
  min-width: 150px;
  position: fixed;
  bottom: 8px;
  right: 8px;
}

.banner-wrap img {
  width: 100%;
}

/*------------------------スマホ--------------------------*/
@media only screen and (max-width: 768px) {
  .title {
    font-size: calc(1.875rem + ((1vw - 3.2px) * 2.2321));
  }
  header .row .content {
    position: absolute;
    height: 11%;
    padding: 0;
  }
  header .row .content ul {
    display: block;
    text-align: center;
    padding: 0;
  }
  header .row .content ul .logo {
    position: fixed;
    padding: 0.5rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
  }
  header .row .content ul .logo a {
    display: inline-block;
  }
  header .row .content ul .logo a img {
    max-width: 56px;
  }
  header .row .content ul .items {
    display: none;
  }
  .wrapper1 {
    padding-right: 0;
    padding-left: 0;
    padding-top: 100px;
    background: -webkit-gradient(linear, left top, left bottom, from(#16181c), color-stop(12%, #324764), color-stop(16%, #646464), color-stop(35%, #ecfbda), color-stop(38%, #fff), to(#fff));
    background: linear-gradient(180deg, #16181c 0%, #324764 12%, #646464 16%, #ecfbda 35%, #fff 38%, #fff 100%);
  }
  .wrapper1 .row {
    margin: 0;
  }
  .wrapper1 .row .content {
    width: 100%;
    padding: 0;
    -ms-grid-columns: 66.7% 33.3%;
        grid-template-columns: 66.7% 33.3%;
  }
  .wrapper2 {
    position: relative;
  }
  .wrapper2 .row .content {
    padding: 0;
    position: absolute;
    top: -1.8rem;
  }
  .wrapper2 .row .content ul {
    min-width: 307px;
    width: 100%;
  }
  .wrapper2 .row .content ul li {
    width: 28vw;
    height: 28vw;
    min-width: 100px;
    min-height: 100px;
  }
  .wrapper2 .row .content ul li a {
    font-size: calc(0.8125rem + ((1vw - 3.2px) * 2.6786));
  }
  .wrapper2 .row .content ul li a p {
    white-space: nowrap;
  }
  .wrapper2 .row .content ul li a .fa-caret-down {
    font-size: 33px;
  }
  .wrapper3 .row .bg-hexagon {
    background-size: inherit;
  }
  .wrapper3 .row .bg-hexagon .content {
    margin: 35vw auto 8vw;
  }
  .wrapper3 .row .bg-hexagon .content h1.title {
    margin-bottom: 3vw;
    font-size: calc(1.875rem + ((1vw - 3.2px) * 2.2321));
  }
  .wrapper3 .row .bg-hexagon .content p.text-top {
    font-size: calc(1.1875rem + ((1vw - 3.2px) * 1.1161));
    white-space: nowrap;
  }
  .wrapper3 .row .bg-hexagon .content .text-wrap {
    font-size: calc(1rem + ((1vw - 3.2px) * 0.6696));
    line-height: 1.9;
  }
  .wrapper3 .row .bg-hexagon .content .text-wrap p {
    margin-bottom: 2rem;
  }
  .wrapper3 .row .bg-hexagon .content .small {
    position: relative;
    font-size: 21px;
  }
  .wrapper3 .row .bg-hexagon .content .small::before {
    top: 2rem;
    width: 9rem;
  }
  .wrapper4 .row .content .text-wrap {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .wrapper4 .row .content .text-wrap .small {
    font-size: 21px;
  }
  .wrapper4 .row .content .text-wrap .small::before {
    top: 2rem;
    width: 4.5rem;
  }
  .wrapper4 .row .content .topic {
    text-align: center;
    font-size: calc(1.25rem + ((1vw - 3.2px) * 1.3393));
    padding: 3rem 0 1rem;
  }
  .wrapper4 .row .content .item-1 .wrap {
    display: block;
  }
  .wrapper4 .row .content .item-1 .wrap img {
    width: 100%;
  }
  .wrapper4 .row .content .item-1 p.text {
    font-size: calc(1rem + ((1vw - 3.2px) * 0.6696));
    line-height: 1.9;
  }
  .wrapper4 .row .content .item-2 .content .wrap-graph p {
    font-size: calc(1rem + ((1vw - 3.2px) * 0.6696));
    line-height: 1.9;
  }
  .wrapper4 .row .content .item-2 .content .wrap-graph .graphs {
    width: 100%;
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    gap: 2rem;
    margin: 2rem auto 0;
    justify-items: center;
  }
  .wrapper4 .row .content .item-2 .content .wrap-graph .graphs img {
    max-width: 400px;
  }
  .wrapper4 .row .content .item-2 .content .wrap-graph .graphs img.graph-1 {
    width: 100%;
    max-width: 400px;
  }
  .wrapper4 .row .content .item-2::before {
    background-color: #dbe3db69;
    bottom: -20px;
    content: "";
    display: block;
    height: 50%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1;
  }
  .wrapper4 .row .content .item-3 {
    padding-bottom: 6vw;
  }
  .wrapper4 .row .content .item-3 .content p.sub {
    font-size: calc(1.125rem + ((1vw - 3.2px) * 0.8929));
  }
  .wrapper4 .row .content .item-3 .content p.text-main {
    font-size: calc(1rem + ((1vw - 3.2px) * 0.6696));
    line-height: 1.9;
  }
  .wrapper4 .row .content .item-3 .content .figure {
    max-width: 350px;
    width: 20rem;
  }
  .wrapper4 .row .content .item-3::before {
    background-color: #F0F3F0;
    content: "";
    display: block;
    height: 111%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1;
    -webkit-clip-path: polygon(-3% 0%, 100% 0%, 100% 100%, 43% 100%);
            clip-path: polygon(-3% 0%, 100% 0%, 100% 100%, 43% 100%);
  }
  .wrapper4 .row .content .item-3::after {
    content: url(../img/model-3.png);
    position: absolute;
    top: 260px;
    right: -31px;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
    overflow-x: hidden;
  }
  .wrapper5 .row {
    padding: 0 0 8vw 0;
  }
  .wrapper5 .row .content .small {
    font-size: 21px;
  }
  .wrapper5 .row .content .small::before {
    content: '';
    position: absolute;
    top: 36px;
    width: 121px;
    height: 3px;
    background: linear-gradient(135deg, #1feb7a 0, #18252c 49%, #ffb819 100%);
  }
  .wrapper5 .row .content h3 {
    margin-bottom: 3rem;
  }
  .wrapper5 .row .content .wrap .img-professor {
    display: block;
    margin: 0 auto;
  }
  .wrapper5 .row .content .wrap .img-professor img {
    width: 84%;
    min-width: 278px;
    max-width: 400px;
  }
  .wrapper5 .row .content .wrap .img-professor p.introduction-top {
    font-size: calc(1.0625rem + ((1vw - 3.2px) * 1.7857));
  }
  .wrapper5 .row .content .wrap .img-professor p.introduction-top span {
    font-size: calc(1.625rem + ((1vw - 3.2px) * 1.5625));
  }
  .wrapper5 .row .content .wrap p.introduction-text {
    font-size: calc(1rem + ((1vw - 3.2px) * 0.6696));
    line-height: 1.9;
    margin: 2rem auto;
    width: 80%;
  }
  .wrapper5 .row .content::before {
    -webkit-clip-path: polygon(43% 0%, 100% 0%, 100% 90%, 0% 100%);
            clip-path: polygon(43% 0%, 100% 0%, 100% 90%, 0% 100%);
  }
  .wrapper5-2 .row .content {
    padding: 0;
    margin: 1rem auto;
  }
  .wrapper5-2 .row .content ul.wrap1 {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
        grid-template-columns: 1fr 1fr 1fr 1fr;
    width: 97%;
    margin: 0 auto;
    justify-items: center;
    padding: 0;
  }
  .wrapper5-2 .row .content ul.wrap2 {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
        grid-template-columns: 1fr 1fr 1fr;
    width: 74%;
    margin: 0 auto;
    justify-items: center;
    padding: 0;
  }
  .wrapper5-2 .row .content li.item {
    font-size: calc(0.75rem + ((1vw - 3.2px) * 2.2321));
    width: 100%;
    height: 28vw;
    min-height: 86px;
    max-width: 200px;
    max-height: 250px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    background-image: url(../img/stripe-hexagon2.png);
    background-size: cover;
    background-repeat: no-repeat;
    color: #5c786d;
    font-weight: bolder;
    font-size: calc(0.75rem + ((1vw - 3.2px) * 2.2321));
    letter-spacing: 2px;
  }
  .wrapper5-2 .row .content li.item img {
    max-width: 100px;
    max-height: 100px;
    padding: 0;
    width: 17vw;
  }
  .wrapper5-2 .row .content li.item-logo {
    background-image: url(../img/shape-6-single-2.png);
  }
  .wrapper6 .row .content {
    margin: 3rem auto;
  }
  .wrapper6 .row .content ul.users {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    gap: 10px;
  }
  .wrapper6 .row .content ul.users li.item .wrap img {
    max-width: 90px;
    min-width: 50px;
    width: 11vw;
  }
  .wrapper6 .row .content ul.users li.item .wrap p.name {
    font-size: calc(0.9375rem + ((1vw - 3.2px) * 0.6696));
  }
  .wrapper6 .row .content ul.users li.item p.voice {
    font-size: calc(1rem + ((1vw - 3.2px) * 0.6696));
    line-height: 1.5;
    padding: 1rem;
  }
  .wrapper7 .row .content ul.items li.item {
    display: block;
    width: 90%;
    height: 100%;
  }
  .wrapper7 .row .content ul.items li.item img {
    height: 100%;
    border-radius: 10%;
  }
  .wrapper7 .row .content ul.items li.item .text {
    width: 100%;
  }
  .wrapper7 .row .content ul.items li.item .text p.name {
    font-size: 15px;
    line-height: 1.6;
    margin: 2rem auto;
  }
  .wrapper7 .row .content ul.items li.item .text p.name span {
    font-size: 1.8rem;
    letter-spacing: 2px;
  }
  .wrapper7 .row .content ul.items .reverse img {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .wrapper7 .row .content ul.items .reverse .img-2 {
    -o-object-position: 51% 0%;
       object-position: 51% 0%;
  }
  .wrapper7 .row .content ul.items .reverse .detail {
    text-align: justify;
    line-height: 1.9;
    margin: 2rem 0;
  }
  .wrapper7 .row .content ul.items .reverse .detail span {
    font-size: 14px;
  }
  footer .row .content ul.items li a {
    color: #7f837e;
    font-size: 1rem;
    line-height: 2.2rem;
  }
  footer .row .content .sns {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 1rem;
  }
  footer .row .content .sns i.facebook {
    font-size: 3.2rem;
    color: #a2afa7;
  }
  footer .row .content .sns i.twitter {
    font-size: 2.1rem;
    background-color: #a2afa7;
    color: #151c15c7;
    border-radius: 50%;
    padding: .6rem;
  }
  footer .row p.bottom {
    font-size: calc(0.9375rem + ((1vw - 3.2px) * 0.6696));
  }
  .banner-wrap {
    display: none;
  }
  .mobile-menu {
    display: block;
  }
}
/*# sourceMappingURL=styles.min.css.map */