@charset "UTF-8";

#company {
  .outer {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    .inr {
      position: relative;
      .txt_area {
        position: relative;
        z-index: 2;
        margin-bottom: 5rem;
        h1 {
          margin-bottom: 7.5rem;
          font-family: var(--roboto);
          font-size: 5rem;
          color: var(--maincolor);
          line-height: 1.5;
          letter-spacing: 0.03em;
        }
        p {
          line-height: 2.4;
          letter-spacing: 0.1em;
          font-size: 1.6rem;
          margin-bottom: 3rem;
        }
        .txtWrap {
          dl {
            display: flex;
            border-bottom: 1px solid var(--maincolor);
            dt {
              font-weight: 700;
              font-size: 1.6rem;
              padding: 1rem 1.2rem;
              border-bottom: 3px solid var(--maincolor);
              width: 12rem;
            }
            dd {
              padding: 1rem 1.2rem;
              font-size: 1.6rem;
              line-height: 1.8;
            }
          }
          &:nth-child(3) {
            dl {
              dd {
                font-family: var(--roboto);
                font-weight: 700;
              }
            }
          }
        }
      }
      .map iframe {
        filter: grayscale(1);
        transition: all 0.3s ease-in-out;
        &:hover {
          filter: grayscale(0);
        }
      }
    }
  }
  @media screen and (max-width: 743px) {
    padding: 5rem 2.5rem;
    .outer {
      padding: 0;
      .inr {
        position: relative;
        .txt_area {
          margin-bottom: 4.5rem;
          h1 {
            font-size: 2.3rem;
            line-height: 1.5;
            letter-spacing: 0.19em;
            margin-bottom: 2rem;
            text-align: center;
          }
          p {
            line-height: 1.8;
            font-size: 1.3rem;
            margin-bottom: 3rem;
          }
          .txtWrap {
            dl {
              display: block;
              dt {
                font-size: 1.3rem;
                padding: 1rem 0;
                border-bottom: 2px solid var(--maincolor);
                width: 11.2rem;
              }
              dd {
                padding: 1rem 0;
                font-size: 1.2rem;
                line-height: 1.8;
              }
            }
          }
        }
        .map iframe {
          height: 25rem;
          filter: none;
        }
      }
    }
  }
}
