

html {
  font-size: 54.7%; /* @media (width < 1024px) { font-size: 54.7%; } */
}
body {
  font-size: 1rem;
}
@media (max-width: 1280px) {
  /* footer */
  .footer {
    .copyright {
      padding: 0 2.5rem;
    }
  }


  /* sub */
  /* sub °øÅë */
  .sub_visual {
    .sub_info {
      padding: 0 2.5rem;
    }
  }
  .container {
    padding: 0 2.5rem;
  }
}


@media (max-width: 1023px) {
  .header {
    position: relative;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .9);
    .header__nav {
      .nav {
        .gnb {
          position: absolute;
          top: 9rem;
          transform: translateX(100%);
          left: 0;
          transition: 0.8s ease;
          width: 100%;
          height: calc(100vh - 6.5rem);
          background: #fff;
          overflow-y: auto;
          display: block;
          & li {
            & a {
              text-align: left;
              padding: 2rem;
            }
          }
          &.depth {
            transform: translateX(0%);
          }
          .sub {
            opacity: 1;
            visibility: visible;
            display: none;
            position: relative;
            padding-top: 0px;
            width: 100%;
            transition: 0s;
            transform: translateY(0px);
            & li {
              & a {
                padding-left: 3rem;
                & br {
                  display: none;
                }
              }
            }
          }
          .active {
            &::after {
              display: none;
            }
          }
        }
      }
      .menu_btn {
        display: inline-block;
        top: 50%;
        transform: translateY(-50%);
        &.allmenu {
          top: 35%;
        }
      }
    }
    .gnb_bg {
      display: none !important;
    }
  }
  .main {
    top: 9rem;
    position: relative;
    /* z-index: -1; */
  }


  /* main visual */
  .visual {
    .visual__bg1,
    .visual__bg2,
    .visual__bg3,
    .visual__bg4 {
      height: 50rem !important;
    }
    & .visual__bg1 {
      background-image: url(/base/img/images/main/visual_01_mobile.png);
    }
    & .visual__bg2 {
      background-image: url(/base/img/images/main/visual_02_mobile.png);
    }
    & .visual__bg3 {
      background-image: url(/base/img/images/main/visual_03_mobile.png);
    }
    & .visual__bg4 {
      background-image: url(/base/img/images/main/visual_04_mobile.png);
    }
    button {
      display: none !important;
    }
    p {
      font-size: 2.4rem;
      padding: 0 2.5rem;
      & span {
        font-size: 2.8rem;
      }
    }
    & .slick-active {
      & .visual__txt1 {
        padding-top: 18rem;
      }
    }
  }


  /* main ½Ã°ø»ç·Ê */
  .section01 {
    .case { 
      flex-wrap: wrap;
      gap: 2rem;
      li {
        width: calc(50% - 1rem);
        &:last-child { 
          width: 100%;
        }
      }
      li:hover {
        flex: unset;
      }
      li:not(:hover){
        flex: unset;
        width: calc(50% - 1rem);
        &:last-child { 
          width: 100%;
        }
      }
      .case__title {
        font-size: 4rem;
        span { 
          font-size: 2.4rem;
        }
      }


    }
  }


  /* main »ç¾÷ºÐ¾ß */
  .section02 {
    .block {
      flex-direction: column;
      align-items: flex-start;
      img {
        width: 100%;
      }
      & div {
        padding-left: 3rem;
      }
      &:nth-of-type(even) { 
        flex-direction: column;
        & div{
          text-align: left;
          padding-left: 3rem;
        }
      }
    }
  }


  /* main °øÁö»çÇ× */


  .section03 {
    padding: 0 2.5rem;
    flex-direction: column;
    .h2_wrap {
      margin-bottom: 4rem;
      width: 100%;
    }
    .notice__list {
      width: 100%;
    }
  }



  /* ÀÎ»ç¸» */
  .about { 
    flex-direction: column;
    gap: 4rem;
    & img {
      width: 100%;
    }
  }


  /* ¿¬Çõ */
  .history {
    .history__txt{ 
      & br {
        display: none;
      }
    }
    .history__list {
      & h3 {
        position: unset;
      }
      & dl {
        margin-left: .5rem;
        margin-top: .5rem;
      }
      .history__2000,
      .history__1990 {
        &::after {
          width: 70%;
        }
      }
    }
  }


  /* ÁÖ°Å·¡Ã³ */
  .partner {
    & ul {
      grid-template-columns: 1fr;
    }
  }


  /* ¿À½Ã´Â±æ */
  .way {
    display: block;
    .way__office02 {
      margin-top: 4rem;
    }
  }


  /* removable insulation cover */
  .removable {
    .removable__block {
      display: block;
      & ul {
        padding-left: 0;
        margin-bottom: 4rem;
      }
      .removable__blockimg {
        img {
          width: 100%;
        }
      }
    }
    .removable__img {
      flex-wrap: wrap;
      gap: 2rem;
      & li {
        width: calc(50% - 1rem);
      }
    }
    .removable__fomula { 
      flex-direction: column;
    }
  }


  /* º¸¿Â´Ü¿­Àç */
  .insulation {
    display: block;
    .insulation__img {
      margin-top: 4rem;
      & img { 
        width: 100%;
      }
    }
  }
/* ÇÃ·£Æ®º¸¿Â */
.plant {
  & ul {
    gap: 2rem;
    grid-template-columns: repeat(2, 1fr);
  }
}


}


@media (max-width:767px) {


  /* ÀÎÁõ¼­ */ 
  .certificate {
    display: block;
    & li ~ li {
      margin-top: 4rem;
    }
    & img {
      width: 100%;
    }
  }


  /* ¾Ë·ç¹Ì´½ */
  .aluminium {
    .aluminium__block {
      display: block;
      & img {
        width: 100%;
        margin-top: 4rem;
      }
      &:nth-of-type(even) {
        & div {
          padding-left: unset;
        }
      }
    }
  } 


}


@media (max-width: 481px) {
  /* visual */
  .visual {
    .visual__bg1,
    .visual__bg2,
    .visual__bg3,
    .visual__bg4 {
      height: 40rem !important;
    }
    p {
      font-size: 2rem;
      & span {
        font-size: 2.4rem;
      }
    }
    & .slick-active {
      & .visual__txt1 {
        padding-top: 12rem;
      }
    }
  }


  /* ÁÖ°Å·¡Ã³ */
  .partner {
    & li {
      a {
        .partner__logo {
          float: unset;
        }
        & p {
          position: relative;
          top: unset;
          transform: unset;
          margin-top: 1.8rem;
          padding-left: 1rem;
        }
      }
    }
  }
  
  /* ÇÃ·£Æ®º¸¿Â */
  .plant {
    & ul {
      display: block;
      & li ~ li {
        margin-top: 2rem;
      }
    }
  }
}

