@charset "utf-8";
/* CSS Document */


/********** company **********/

main.company {
  .p-body {

    #sec01 {
      .p-chapter__inner {
        display: flex;
        gap: 6rem;
        .textArea {
          width: calc(100% - 320px - 6rem);
          p + p {
            margin: 1em 0 0;
          }
        }
        .imgArea {
          width: 320px;
          p {
            margin: .5em 0 0;
          }
        }
      }
    }

    #sec02 {
      .p-chapter__inner {
        dl {
          display: flex;
          border-top: 1px solid var(--text);
          border-right: 1px solid var(--text);
          border-left: 1px solid var(--text);
          &:last-child {
            border-bottom: 1px solid var(--text);
          }
          dt, dd {
            padding: 1.5rem 2rem;
          }
          dt {
            width: 280px;
            min-width: 280px;
            font-weight: 700;
            border-right: 1px solid var(--text);
            background: var(--yellow);
          }
        }
      }
    }

  }
}

@media (max-width: 768px) {
  main.company {
    .p-body {
      #sec01 {
        .p-chapter__inner {
          flex-direction: column;
          gap: 6rem;
          .textArea {
            width: 100%;
            p + p {
              margin: 1em 0 0;
            }
          }
          .imgArea {
            width: 100%;
            max-width: 320px;
            margin: 0 auto;
            p {
              margin: .5em 0 0;
            }
          }
        }
      }

      #sec02 {
        .p-chapter__inner {
          dl {
            display: block;
            border-top: 1px solid var(--text);
            border-right: 1px solid var(--text);
            border-left: 1px solid var(--text);
            &:last-child {
              border-bottom: 1px solid var(--text);
            }
            dt {
              width: 100%;
              min-width: 100%;
              border-right: none;
              border-bottom: 1px solid var(--text);
            }
          }
        }
      }
    }
  }
}

@media (max-width: 480px) {
  main.company {
    .p-body {
      #sec01 {
        .p-chapter__inner {
          gap: 4rem;
        }
      }

      #sec02 {
        .p-chapter__inner {
          dl {
            dt, dd {
              padding: 1rem 2rem;
            }
          }
        }
      }
    }
  }
}