*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

#wrap #contents section {
  position: relative; }
  #wrap #contents section .sectionInner h2 {
    font-size: 1em;
    opacity: 0;
    transition: all 1s; }
    #wrap #contents section .sectionInner h2.active, #wrap #contents section .sectionInner h2.is-show {
      opacity: 1; }
    @media screen and (max-width: 599px) {
      #wrap #contents section .sectionInner h2 {
        font-size: 1.125em; } }
  #wrap #contents section .sectionInner .headingBlock {
    margin: 35px 0 0 40px; }
    @media screen and (max-width: 1024px) {
      #wrap #contents section .sectionInner .headingBlock {
        text-align: center;
        margin: 20px 0; } }
    #wrap #contents section .sectionInner .headingBlock h3 {
      font-size: 2.4375em;
      line-height: 1.6;
      letter-spacing: 0.18em;
      text-align: left;
      opacity: 0;
      transition: opacity 1.5s ease; }
      #wrap #contents section .sectionInner .headingBlock h3.active {
        opacity: 1; }
        #wrap #contents section .sectionInner .headingBlock h3.active span {
          background-position-x: 0%; }
      @media screen and (max-width: 1024px) {
        #wrap #contents section .sectionInner .headingBlock h3 {
          display: inline-block; } }
      @media screen and (max-width: 599px) {
        #wrap #contents section .sectionInner .headingBlock h3 {
          font-size: 2em;
          /*font-size: 1.5em;*/ } }
      #wrap #contents section .sectionInner .headingBlock h3 span {
        display: block;
        color: transparent;
        transition: background-position 2.5s ease-in-out;
        background: url(/assets/img/philosophy/text_bg.webp) no-repeat 50%/800% 100%;
        background-clip: text;
        -webkit-background-clip: text;
        background-position-x: 100%; }
  #wrap #contents section .sectionInner .linkBlock {
    margin: 40px 0 0;
    text-align: right; }
    @media screen and (max-width: 599px) {
      #wrap #contents section .sectionInner .linkBlock {
        text-align: center; } }
    #wrap #contents section .sectionInner .linkBlock a {
      display: inline-block;
      width: 100%;
      max-width: 240px;
      background-color: transparent;
      padding: 0;
      text-align: center;
      line-height: 40px;
      border: solid 1px #707070;
      font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
      font-weight: 300;
      font-style: normal; }
      @media screen and (max-width: 599px) {
        #wrap #contents section .sectionInner .linkBlock a {
          margin: 0 auto; } }
  @media screen and (min-width: 1025px) {
    #wrap #contents section#philosophy {
      margin: 0 0 270px; } }
  @media screen and (max-width: 1024px) {
    #wrap #contents section#philosophy {
      margin: 0 0 60px; } }
  #wrap #contents section#philosophy .pc_line #line_01 {
    width: 100%;
    position: absolute;
    top: 0; }
    @media screen and (max-width: 1024px) {
      #wrap #contents section#philosophy .pc_line #line_01 {
        top: 60px; } }
  #wrap #contents section#philosophy .pc_line #line_02 {
    width: 100%;
    position: absolute;
    bottom: -75%; }
  #wrap #contents section#philosophy .sp_line {
    position: absolute;
    width: 100%;
    height: 100%; }
    #wrap #contents section#philosophy .sp_line #line_01_sp {
      width: 100%;
      position: absolute;
      top: 60px; }
  #wrap #contents section#philosophy #bubble {
    width: 500px;
    height: 500px;
    position: absolute;
    top: 750px;
    background-image: linear-gradient(45deg, rgba(225, 226, 253, 0.5), rgba(236, 231, 252, 0.5));
    animation: bubble_00 20s infinite;
    mix-blend-mode: multiply;
    z-index: 1;
    pointer-events: none; }
    @media screen and (max-width: 599px) {
      #wrap #contents section#philosophy #bubble {
        width: 250px;
        height: 250px;
        background-image: linear-gradient(45deg, rgba(225, 226, 253, 0.6), rgba(236, 231, 252, 0.6));
        top: auto;
        bottom: 100px;
        animation: bubble_00_sp 20s infinite; } }
  #wrap #contents section#philosophy .headingBlock h3 span:nth-child(2) {
    margin-left: 2.5em; }
  #wrap #contents section#philosophy .headingBlock h3 span:nth-child(3) {
    margin-left: 1.75em; }
  #wrap #contents section#philosophy .headingBlock h3 span:last-child {
    margin-left: 6em; }
  @media screen and (min-width: 1025px) {
    #wrap #contents section#philosophy .textBlock_01 {
      margin: 90px 0 0 270px; } }
  #wrap #contents section#philosophy .textBlock_01 p {
    font-weight: 500;
    line-height: 2;
    letter-spacing: 0.04em;
    opacity: 0;
    transform: translateY(20px);
    transition: all 1s; }
    @media screen and (max-width: 599px) {
      #wrap #contents section#philosophy .textBlock_01 p {
        line-height: 1.8; } }
    #wrap #contents section#philosophy .textBlock_01 p.active {
      opacity: 1;
      transform: translateY(0); }
  #wrap #contents section#philosophy .textBlock_01.fv p {
    transition: all 1s 1s; }
  #wrap #contents section#philosophy .textBlock_02 {
    display: inline-block;
    position: relative;
    opacity: 0;
    transform: translateY(20px);
    transition: all 1s; }
    #wrap #contents section#philosophy .textBlock_02.active {
      opacity: 1;
      transform: translateY(0); }
    #wrap #contents section#philosophy .textBlock_02.fv {
      transition: all 1s 1s; }
    @media screen and (min-width: 1025px) {
      #wrap #contents section#philosophy .textBlock_02 {
        max-width: 640px;
        margin: 70px 0 0 460px; } }
    @media screen and (max-width: 1024px) {
      #wrap #contents section#philosophy .textBlock_02 {
        margin: 30px 0 0; } }
    #wrap #contents section#philosophy .textBlock_02 p {
      font-weight: 400;
      line-height: 2;
      letter-spacing: 0.04em; }
      @media screen and (max-width: 599px) {
        #wrap #contents section#philosophy .textBlock_02 p {
          line-height: 1.8; } }
      #wrap #contents section#philosophy .textBlock_02 p:last-of-type {
        margin: 40px 0 0; }
        @media screen and (max-width: 1024px) {
          #wrap #contents section#philosophy .textBlock_02 p:last-of-type {
            margin: 20px 0 0; } }
  #wrap #contents section#solution .pc_line #line_03 {
    width: 100%;
    position: absolute;
    bottom: 0; }
    @media screen and (max-width: 1024px) {
      #wrap #contents section#solution .pc_line #line_03 {
        bottom: 250px; } }
  #wrap #contents section#solution .sp_line {
    position: absolute;
    width: 100%;
    height: 100%; }
    #wrap #contents section#solution .sp_line #line_02_sp {
      width: 100%;
      position: absolute;
      top: 0;
      bottom: auto; }
    #wrap #contents section#solution .sp_line #line_03_sp {
      width: 100%;
      position: absolute;
      bottom: 250px; }
  @media screen and (max-width: 599px) {
    #wrap #contents section#solution h3 {
      display: block; } }
  #wrap #contents section#solution h3.is-show {
    opacity: 1; }
    #wrap #contents section#solution h3.is-show span {
      background-position-x: 0%; }
  #wrap #contents section#solution h3 span {
    display: block;
    color: transparent;
    transition: background-position 2.5s ease-in-out;
    background: url(/assets/img/philosophy/text_bg.webp) no-repeat 50%/800% 100%;
    background-clip: text;
    -webkit-background-clip: text;
    background-position-x: 100%; }
    @media screen and (max-width: 599px) {
      #wrap #contents section#solution h3 span:first-child {
        /*margin-left: 0.9em;*/ } }
    #wrap #contents section#solution h3 span:nth-child(2) {
      margin-left: 2.7em; }
      @media screen and (max-width: 599px) {
        #wrap #contents section#solution h3 span:nth-child(2) {
          margin-left: 0.6em;
          /*margin-left: 0;*/ } }
    #wrap #contents section#solution h3 span:last-child {
      margin-left: 14.5em; }
      @media screen and (max-width: 1024px) {
        #wrap #contents section#solution h3 span:last-child {
          margin-left: 6.5em; } }
      @media screen and (max-width: 599px) {
        #wrap #contents section#solution h3 span:last-child {
          text-align: right;
          margin-left: 0;
          /*margin-left: 5em;*/ } }
  #wrap #contents section#solution h3 .join {
    display: inline-grid;
    grid-template-columns: auto auto; }
    @media screen and (max-width: 599px) {
      #wrap #contents section#solution h3 .join {
        display: block; } }
    #wrap #contents section#solution h3 .join span {
      margin: 0; }
      @media screen and (max-width: 599px) {
        #wrap #contents section#solution h3 .join span:first-child {
          margin-left: 1.4em; } }
      @media screen and (max-width: 599px) {
        #wrap #contents section#solution h3 .join span:last-child {
          text-align: left;
          margin-left: 0.5em; } }
  @media screen and (min-width: 1025px) {
    #wrap #contents section#solution .textBlock_01 {
      max-width: 640px;
      margin: 90px 0 0 460px; } }
  #wrap #contents section#solution .textBlock_01 p {
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.04em;
    opacity: 0;
    transform: translateY(20px);
    transition: all 1s; }
    @media screen and (max-width: 599px) {
      #wrap #contents section#solution .textBlock_01 p {
        line-height: 1.8; } }
    #wrap #contents section#solution .textBlock_01 p.is-show {
      opacity: 1;
      transform: translateY(0); }
    #wrap #contents section#solution .textBlock_01 p:last-of-type {
      margin: 40px 0 0; }
      @media screen and (max-width: 1024px) {
        #wrap #contents section#solution .textBlock_01 p:last-of-type {
          margin: 20px 0 0; } }
  #wrap #contents section#solution #anchorBlock_01 {
    margin: 80px 0 0; }
    @media screen and (max-width: 599px) {
      #wrap #contents section#solution #anchorBlock_01 {
        margin: 50px 0 0; } }
    #wrap #contents section#solution #anchorBlock_01 ul {
      display: grid;
      grid-template-columns: 170px 170px 170px 170px 170px 170px;
      grid-template-rows: 255px;
      justify-content: center; }
      @media screen and (max-width: 1024px) {
        #wrap #contents section#solution #anchorBlock_01 ul {
          grid-template-columns: 1fr 1fr 1fr;
          grid-template-rows: 1fr 1fr;
          gap: 30px 0;
          justify-items: center; } }
      #wrap #contents section#solution #anchorBlock_01 ul li {
        width: 170px;
        height: 170px;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: linear-gradient(45deg, rgba(225, 226, 253, 0.5), rgba(236, 231, 252, 0.5));
        mix-blend-mode: multiply;
        font-size: 1.125em;
        text-align: center;
        font-family: "fot-tsukuaoldmin-pr6n", "serif";
        font-weight: 300;
        font-style: normal;
        font-size: 1.125em;
        line-height: 1.3;
        opacity: 0;
        transform: translateY(20px);
        transition: all 1s;
        z-index: 1; }
        @media screen and (max-width: 599px) {
          #wrap #contents section#solution #anchorBlock_01 ul li {
            width: 115px;
            height: 105px;
            background-image: linear-gradient(45deg, rgba(225, 226, 253, 0.6), rgba(236, 231, 252, 0.6));
            font-size: 0.75em; } }
        #wrap #contents section#solution #anchorBlock_01 ul li.is-show {
          opacity: 1;
          transform: translateY(0); }
        @media screen and (min-width: 1025px) {
          #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(even) {
            margin-top: 50%; } }
        #wrap #contents section#solution #anchorBlock_01 ul li:first-child {
          animation: bubble_01 10s infinite; }
        #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(2) {
          animation: bubble_02 10s infinite; }
          @media screen and (max-width: 1024px) {
            #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(2) {
              margin-top: -50px; } }
        #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(3) {
          animation: bubble_03 10s infinite; }
        #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(4) {
          animation: bubble_04 10s infinite; }
        #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(5) {
          animation: bubble_05 10s infinite; }
          @media screen and (max-width: 1024px) {
            #wrap #contents section#solution #anchorBlock_01 ul li:nth-child(5) {
              margin-top: -50px; } }
        #wrap #contents section#solution #anchorBlock_01 ul li:last-child {
          animation: bubble_06 10s infinite; }
  #wrap #contents section#solution .linkBlock {
    max-width: 1020px;
    margin: 100px auto 0;
    text-align: right; }
    @media screen and (max-width: 1024px) {
      #wrap #contents section#solution .linkBlock {
        margin: 50px 0;
        text-align: center; } }
    #wrap #contents section#solution .linkBlock a {
      display: inline-block;
      width: 100%;
      max-width: 240px;
      background-color: transparent;
      padding: 0;
      text-align: center;
      line-height: 40px;
      border: solid 1px #707070;
      font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
      font-weight: 300;
      font-style: normal; }
      @media screen and (max-width: 599px) {
        #wrap #contents section#solution .linkBlock a {
          margin: 0 auto; } }

@keyframes bubble_01 {
  0% {
    border-radius: 36% 64% 68% 32% / 40% 41% 59% 60%; }
  25% {
    border-radius: 41% 59% 33% 67% / 44% 52% 48% 56%; }
  50% {
    border-radius: 64% 36% 44% 56% / 47% 61% 39% 53%; }
  75% {
    border-radius: 41% 59% 62% 38% / 56% 30% 70% 44%; }
  100% {
    border-radius: 36% 64% 68% 32% / 40% 41% 59% 60%; } }
@keyframes bubble_02 {
  0% {
    border-radius: 41% 59% 33% 67% / 44% 52% 48% 56%; }
  25% {
    border-radius: 58% 42% 59% 41% / 34% 65% 35% 66%; }
  50% {
    border-radius: 64% 36% 60% 40% / 27% 68% 32% 73%; }
  75% {
    border-radius: 51% 49% 36% 64% / 58% 56% 44% 42%; }
  100% {
    border-radius: 41% 59% 33% 67% / 44% 52% 48% 56%; } }
@keyframes bubble_03 {
  0% {
    border-radius: 53% 47% 61% 39% / 46% 39% 61% 54%; }
  25% {
    border-radius: 68% 32% 72% 28% / 47% 50% 50% 53%; }
  50% {
    border-radius: 57% 43% 60% 40% / 58% 63% 37% 42%; }
  75% {
    border-radius: 37% 63% 60% 40% / 58% 32% 68% 42%; }
  100% {
    border-radius: 53% 47% 61% 39% / 46% 39% 61% 54%; } }
@keyframes bubble_04 {
  0% {
    border-radius: 65% 35% 74% 26% / 58% 60% 40% 42%; }
  25% {
    border-radius: 58% 42% 55% 45% / 69% 44% 56% 31%; }
  50% {
    border-radius: 64% 36% 44% 56% / 47% 61% 39% 53%; }
  75% {
    border-radius: 43% 57% 40% 60% / 45% 56% 44% 55%; }
  100% {
    border-radius: 65% 35% 74% 26% / 58% 60% 40% 42%; } }
@keyframes bubble_05 {
  0% {
    border-radius: 41% 59% 33% 67% / 44% 52% 48% 56%; }
  25% {
    border-radius: 58% 42% 59% 41% / 34% 65% 35% 66%; }
  50% {
    border-radius: 64% 36% 60% 40% / 27% 68% 32% 73%; }
  75% {
    border-radius: 51% 49% 36% 64% / 58% 56% 44% 42%; }
  100% {
    border-radius: 41% 59% 33% 67% / 44% 52% 48% 56%; } }
@keyframes bubble_06 {
  0% {
    border-radius: 36% 64% 68% 32% / 40% 41% 59% 60%; }
  25% {
    border-radius: 41% 59% 33% 67% / 44% 52% 48% 56%; }
  50% {
    border-radius: 64% 36% 44% 56% / 47% 61% 39% 53%; }
  75% {
    border-radius: 41% 59% 62% 38% / 56% 30% 70% 44%; }
  100% {
    border-radius: 36% 64% 68% 32% / 40% 41% 59% 60%; } }