@charset "UTF-8";
/* 
---------------------------------------
WEBフォント追加
---------------------------------------
*/
@font-face {
  font-family: 'Unbounded';
  /*要素に指定するときに使うフォント名*/
  src: url("../fonts/unbounded.woff2") format("woff2"), url("../fonts/unbounded.woff") format("woff");
  font-display: swap; }
@font-face {
  font-family: 'HankenGrotesk';
  /*要素に指定するときに使うフォント名*/
  src: url("../fonts/HankenGrotesk.woff2") format("woff2"), url("../fontsHankenGrotesk.woff") format("woff");
  font-display: swap; }
/* Reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  margin-top: 0 !important; }

.under .vision__content {
  background: linear-gradient(rgba(93, 102, 109, 0.95), rgba(93, 102, 109, 0.95)), url(../img/common/noise.png), #8a8e93;
  position: relative; }
.under .vision .vision-hero__img img {
  width: 100%; }
.under .vision__item {
  padding: 10rem 0 9rem;
  position: relative; }
  @media screen and (max-width: 834px) {
    .under .vision__item {
      padding: 4rem 0; } }
.under .vision .item__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between; }
  @media screen and (max-width: 834px) {
    .under .vision .item__inner {
      flex-direction: column;
      gap: 2rem 0; } }
.under .vision .item__title {
  width: 50%;
  padding-left: 2%; }
  @media screen and (max-width: 834px) {
    .under .vision .item__title {
      width: 100%;
      padding-left: 0%; } }
.under .vision span.item__title-en {
  display: block;
  font-size: 12px; }
.under .vision span.item__title-ja {
  font-size: clamp(3rem, 7vw, 6rem); }
.under .vision .item__main {
  width: 50%; }
  @media screen and (max-width: 834px) {
    .under .vision .item__main {
      width: 100%; } }
.under .vision .item__sub-title {
  padding: 0 2.5rem 0;
  font-size: 32px;
  font-weight: 400; }
  @media screen and (max-width: 834px) {
    .under .vision .item__sub-title {
      font-size: 20px;
      padding: 0; } }
.under .vision .section__text {
  padding: 0 2.5rem 0;
  margin-top: 4rem; }
  @media screen and (max-width: 834px) {
    .under .vision .section__text {
      margin-top: 2rem;
      padding: 0; } }
.under .vision .item__child--list {
  margin-top: 7rem; }
  @media screen and (max-width: 834px) {
    .under .vision .item__child--list {
      margin-top: 3rem; } }
.under .vision .item__child--item {
  padding: 2.5rem 0;
  position: relative;
  display: flex;
  flex-direction: column; }
  @media screen and (max-width: 834px) {
    .under .vision .item__child--item {
      padding: 2rem 2% 3rem; } }
.under .vision .item__child--item--line {
  top: 0;
  bottom: auto; }
.under .vision .item__child--item--title {
  font-size: 2.1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0 1.5rem;
  margin: 0 0 0 2.5rem; }
  @media screen and (max-width: 834px) {
    .under .vision .item__child--item--title {
      margin: 0 auto 0 0;
      gap: 0 1rem;
      font-size: 1.5rem; } }
  .under .vision .item__child--item--title span {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #030303;
    border-radius: 15px;
    padding: 0.76rem 2rem;
    font-size: 1.2rem;
    line-height: 1; }
    @media screen and (max-width: 834px) {
      .under .vision .item__child--item--title span {
        padding: 0.7rem 1.5rem; } }
.under .vision .item__child--item--text {
  width: 61%;
  margin: 5rem 2rem 0 auto; }
  @media screen and (max-width: 834px) {
    .under .vision .item__child--item--text {
      width: 100%;
      margin: 2rem auto 0; } }
