@charset "UTF-8";
body {
  height: auto; }

section {
  height: auto; }

#about {
  display: grid;
  font-size: 1em;
  min-width: 600px;
  padding: 10px 0 0 10px;
  color: #333;
  grid-row-gap: 20px;
  overflow-y: auto !important; }

@media screen and (min-width: 577px) {
  .subMenu {
    min-height: 100vh;
    position: sticky;
    top: 0; } }

#about {
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 30vw 10vw 11.5vw 20vw 20vw; }
  #about #sec1 {
    grid-column: 1/7;
    grid-row: 1/2;
    position: relative;
    width: 100%;
    height: 30vw; }
    #about #sec1 h2 {
      font-size: 1.8vw;
      font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
      font-weight: 700;
      letter-spacing: 1px;
      display: block;
      text-align: right;
      white-space: nowrap;
      position: absolute;
      bottom: 9vw;
      right: -20px; }
    #about #sec1 br {
      display: none; }
  #about #sec2 {
    grid-column: 8/13;
    grid-row: 1/3; }
    #about #sec2 img {
      max-width: 100%;
      max-height: 100%;
      object-fit: cover;
      object-position: center center; }
  #about #sec3 {
    grid-column: 1/7;
    grid-row: 2/4; }
    #about #sec3 img {
      max-width: 100%;
      max-height: 100%;
      object-fit: cover;
      object-position: center center; }
  #about #sec4 {
    grid-column: 1/13;
    grid-row: 4;
    padding: 30px 0; }
    #about #sec4 p {
      white-space: nowrap;
      font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
      font-weight: 600;
      width: fit-content;
      block-size: fit-content;
      font-size: max(1.05vw, 12px);
      line-height: 190%;
      margin-left: 55%; }
      @media screen and (max-width: 1100px) {
        #about #sec4 p {
          margin-left: 52%; } }
  #about #sec5 {
    grid-column: 3/8;
    grid-row: 5; }
    #about #sec5 img {
      max-width: 100%;
      max-height: 100%;
      object-fit: cover;
      object-position: center center; }
  #about #sec6 {
    grid-column: 8/13;
    grid-row: 5; }
    #about #sec6 img {
      max-width: 100%;
      max-height: 100%;
      object-fit: cover;
      object-position: center center; }

@media screen and (max-width: 576px) {
  body {
    overflow-x: hidden; }

  #about {
    padding: 10px 0;
    min-width: 100vw;
    width: 100vw;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 500px 230px 200px 180px;
    gap: 0px;
    grid-row-gap: 20px; }
    #about #sec1 {
      grid-column: 1;
      grid-row: 1;
      position: relative;
      width: 100%; }
      #about #sec1 h2 {
        font-size: 24px;
        font-weight: 500;
        letter-spacing: 1px;
        line-height: 150%;
        display: block;
        text-align: left;
        white-space: nowrap;
        position: absolute;
        top: 80px;
        left: 40px; }
      #about #sec1 br {
        display: block; }
    #about #sec2 {
      grid-column: 2/5;
      grid-row: 1; }
      #about #sec2 img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center; }
    #about #sec3 {
      grid-column: 1/4;
      grid-row: 2; }
      #about #sec3 img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center; }
    #about #sec4 {
      grid-column: 1/5;
      grid-row: 3;
      padding: 40px 0; }
      #about #sec4 p {
        white-space: nowrap;
        width: 90%;
        font-size: 14px;
        line-height: 150%;
        margin-left: 10%; } }
      @media screen and (max-width: 576px) and (max-width: 400px) {
        #about #sec4 p {
          width: calc(100% - 20px);
          white-space: normal;
          margin-left: 20px;
          font-size: 13px; } }
@media screen and (max-width: 576px) {
    #about #sec5 {
      grid-column: 1/3;
      grid-row: 4; }
      #about #sec5 img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center; }
    #about #sec6 {
      grid-column: 3/5;
      grid-row: 4; }
      #about #sec6 img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center; } }