@charset "UTF-8";

@media (orientation: landscape) {
  .renew{
    .TB_sec01{
      > .bg{
        img.mob{
          display: none;
        }
        img:not(.mob){
          display: block;
        }
      }
    }
  }
}
@media (orientation: portrait) {
  .renew{
    .TB_sec01{
      > .bg{
        img.mob{
          display: block;
        }
        img:not(.mob){
          display: none;
        }
      }

      &.slide02{
        > .bg{
          img.mob{
            width: auto;
            left: auto;
            right: -40%;
          }
        }
      }
    }
  }
}

@keyframes iconAni {
  0%{
    bottom: 37px;
  }
  70% {
    bottom: 22px;
  }
  95%{
    bottom: 37px;
  }
  100%{
    bottom: 37px;
  }
}

.renew{
  .en_tit{
    font-family: "bebas-neue-pro", sans-serif;
    font-weight: 600;
  }

  .fullpage{
    position: relative;
    height: 100vh;
  }

  .TB_sec01{
    position: absolute;
    top: 0;
    left: 0;

    > span{
      position: absolute;
      bottom: 37px;
      left: 50%;
      transform: translateX(-50%);
      color: #fff;
      font-family: "bebas-neue-pro", sans-serif;
      font-size: 16px;
      font-weight: 600;

      &::after{
        content: "";
        position: absolute;
        width: 19px;
        height: 28px;
        bottom: 28px;
        left: 50%;
        transform: translateX(-50%);
        background: url('../images/new2609/ico_scroll_down.png') no-repeat center top;
        animation: iconAni 1s infinite ease-in-out;
      }
    }

    > .bg{
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;

      img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    .main_tit_wrap{
      top: 40%;
    }

    .main_tit{
      margin-top: 0;

      img{
        display: block;
        margin: 0 auto;
        width: 330px;
      }
      span{
        display: block;
        font-size: 63px;
      }
    }
    .main_txt{
      font-size: 20px;
      font-weight: 300;
      margin: 5px 0 0;
    }

    &.slide02, &.slide03 {
      > .bg {
        img {
          height: calc(100% + 150px);
        }
      }
      .main_tit_wrap{
        top: 120px;
        left: 0;
        transform: none;
        text-align: left;
        padding-left: 20px;
      }

      .main_tit{
        padding: 0;

        span{
          font-size: 32px;
        }
        img{
          margin: -30px 0 0;
        }
      }

      .main_txt{
        font-size: 18px;
        line-height: 1.6;
        margin: 30px 0 0;
      }
    }

    &.slide02 {
      z-index: 2;

      *{
        color: #F26529;
      }

      .main_tit{
        img {
          width: 100%;
          max-width: 575px;
        }
      }
    }

    &.slide03{
      z-index: 3;

      .main_tit{
        img{
          width: 466px;
        }
      }
    }

  }

  .TB_sec_02{
    padding-top: 110px;

    .h3_TB03{
      margin-top: 0;
      font-size: 40px;
      font-family: "bebas-neue-pro", sans-serif;
    }
    .tbex_desc{
      margin-top: 50px;
      font-weight: 300;
    }

    .visions{
      display: flex;
      margin: 70px 0 200px;
      gap: 40px;

      > li{
        margin-top: 0;
        flex: 1;

        .en_tit{
          margin: 0 0 12px;
          font-size: 20px;
          color: #ACACAC;
        }
      }

      .vision_row{
        width: auto;
        height: calc(100% - 30px);
        padding-left: 0;
        padding-bottom: 17px;
        border-top: 2px solid #000;
        border-bottom: 1px solid #000;

        .vision_desc03{
          font-size: 24px;
          font-family: 'Pretendard';
          font-weight: 600;
          margin-top: 14px;
        }
        .vision_desc04{
          font-size: 15px;
          margin-top: 12px;
        }
      }
    }

    .original_partners{
      padding: 60px 0 100px;
    }

    .tbex_original{
      margin-top: 100px;

      .ori_tinting_list > li > p{
        font-weight: 700;
      }
      .ori_logo_list span{
        font-size: 13px;
      }

      .btn_square03{
        width: 200px;
        border-radius: 4px 0 0 0;
      }

      .ppf_list{
        display: flex;
        gap: 43px;

        > li{
          max-width: 240px;
          flex-shrink: 0;

          .title{
            img{
              display: block;
              width: auto;
              height: 30px;
              margin: 0 0 7px;
              object-fit: none;
              object-position: left;
            }

            strong{
              font-weight: 600;
            }
          }

          > img {
            width: 100%;
            margin: 13px 0 12px;
          }
          > span{
            font-size: 14px;
          }
        }
      }

      .beast_box{
        display: flex;
        width: 100%;
        max-width: 810px;
        flex-wrap: wrap;
        align-items: stretch;
        gap: 5px 10px;

        > *{
          border-radius: 4px;
        }

        .title{
          width: 100%;
          padding: 12px 13px 11px;
          font-weight: 700;
          color: #fff;
          background: #2E2E2E;
        }

        >img {
          width: 166px;
          height: auto;
          object-fit: cover;

          &.mob{
            display: none;
          }
        }

        .ori_glass_list{
          width: calc(100% - 176px);
          margin-top: 0;

          li{
            display: flex;
            width: 100%;
            padding: 11.5px 14px;
            border-radius: 4px;
            align-items: center;
            gap: 13px;

            > span{
              display: inline-block;
              position: relative;
              width: 47px;
              font-size: 16px;
              font-weight: 600;
              line-height: 1;
              text-align: left;
              flex-shrink: 0;
              color: #000;
              background: #fff !important;
            }
            > p{
              line-height: 16px;
            }
          }

          &.leather{
            li{
              padding: 33px 14px;
              gap: 19px;
              > span{
                width: 120px;
              }
            }
          }
        }
      }
    }

    .history{
      margin: 230px 0 200px;

      .h3_TB03{
        text-align: left;
        margin: 0 0 20px;
        padding: 0 0 0 8px;
      }

      .IBM_sb{
        font-family: 'Pretendard';
        font-weight: 600;
      }
    }
  }
}

.renew_tint{
  .full_wrapper {
    width: 100%;
    margin: 0 auto;
    padding: 192px 70px 0;
    border-bottom: 1px solid #EBEBEB;
  }
  .title_section{
    padding: 100px 0 0;
    border-left: 1px solid #EBEBEB;
    border-right: 1px solid #EBEBEB;
    position: relative;

    &::after{
      content: "";
      position: absolute;
      bottom: 0;
      left: -70px;
      right: -70px;
      height: 1px;
      background: #EBEBEB;
    }
  }
  .full_half {
    display: flex;
    margin: 0 auto;
    padding: 180px calc(calc(100% - 1920px) * 0.5);
    gap: 100px;
    top: 30px;
    opacity: 0;
    animation: moveUp 0.5s ease-out 0.7s forwards;
    position: relative;
  }
  .has_plus {
    position: relative;
  }
  .has_plus:before {
    content: '';
    position: absolute;
    top: -12px;
    left: -12px;
    width: 24px;
    height: 24px;
    background: url(../images/new26/ico_plus.png) no-repeat left top/100%;
  }
  .has_plus:after {
    content: '';
    position: absolute;
    top: -12px;
    right: -12px;
    width: 24px;
    height: 24px;
    background: url(../images/new26/ico_plus.png) no-repeat left top/100%;
  }
  .full_half>div:first-of-type {
    width: 60%;
    max-width: 919px;

    svg{
      width: 100%;
    }
  }
  .full_half_right {
    max-width: 510px;
    min-width: 400px;
    align-content: center;
    flex-shrink: 0;
  }
  .full_half_right>div {
    width: 100%;
  }
  .text_16_16 {
    font-size: 1.6rem;
    line-height: 1.7;
    text-wrap: balance;
  }
  .premium_original{
    border: 1px solid #EBEBEB;
    border-top: none;
    border-bottom: none;
    padding: 123px 0 101px;
  }
  .fz30_28{
    font-size: 30px;
    font-weight: 300;
    line-height: 1.5;
    position: relative;

    strong{
      font-weight: 600;
    }

    /* &::after{
      content: "";
      position: absolute;
      top: calc(100% + 30px);
      left: 50%;
      width: 1px;
      height: 100px;
      background-color: #000;
      transform: translateX(-50%);
    } */
  }
  .ori_brand{
    background-position: right top;
  }
  .ori_brand,
  .ori_series,
  .ori_model{
    border-radius: 5px 0 0 5px;
    overflow: hidden;
  }
  .ori_brand_logo img{
    width: 184px;
  }
  .ori_trans_text{
    font-size: 25px;
    -webkit-text-stroke: 0;
    -webkit-text-fill-color: #fff;
  }

  h3:has(+ .pro_desc) {
    font-size: 30px;
    font-weight: 600;
    margin-top: 75px;
  }
  .pro_desc{
    margin-top: 50px;
    padding-left: 0;
    font-weight: 300;

    .gray{
      margin-top: 40px;
      font-size: 16px;
      color: #ACACAC;
    }
  }

  .pro_cont{
    padding: 0;
  }
  .page_area{
    padding: 210px 0 150px;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .inner:has(+ .page_area) {
    height: 930px;
    padding: 210px 20px 0;
  }
  .h3_pro.h3_premium{
    margin-top: 25px;
  }

  .rimacSC .h3_pro span:not(.add_ori_text){
    color: #000;
  }
  .rimacSC .links li a{
    -webkit-text-stroke-color: #000;
  }
  .rimacSC .links li a .rimac_dot span{
    border-color: #000;
  }
  .rimacSC .links li{
    &::before, &::after{
      filter: brightness(0);
    }
  }
  .rimacSC .links li:hover a{
    color: #000;
  }


  .links li{
    margin-bottom: 60px;

    &::before{
      bottom: -25px;
    }
    &::after{
      bottom: 10px;
    }
  }

  .pro_link_rimac{
    .links li{
      height: 110px;
      padding: 35px 0 0;
      margin: 0;

      &.links_rimacSC{
        height: 85px;
        padding: 0;
      }

      &::before{
        bottom: 0;
      }

      &::after{
        bottom: 35px;
      }
    }
  }
  .links li a,
  .h3_pro span,
  .black_pro_desc{
    font-family: 'Pretendard';
  }
  .black_pro_desc{
    min-width: 425px;
  }

  .links li a,
  .h3_pro span:not(.add_ori_text){
    font-weight: 700;
  }
  .h3_pro span:not(.add_ori_text){
    margin: 0 6px 0 0;
    transform: translateY(6px);
  }

  .add_ori_text{
    font-size: 31px;
  }

  .genefit_link_wrap{
    &.pro_link_wrap>ul{
      min-width: 430px;
    }
  }

  /* 사이드 내비게이션*/
  .pro_cont_nav{
    position: fixed;
    top: 50%;
    left: 70px;
    transform: translateY(-50%);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 1;

    &.on{
      opacity: 1;
      visibility: visible;
    }

    ul{
      li{
        margin: 0 0 15px;

        &:last-of-type{
          margin: 0;
        }

        a{
          display: inline-block;
          padding: 0 0 0 5px;
          font-family: "bebas-neue-pro", sans-serif;
          font-size: 18px;
          font-weight: 500;
          letter-spacing: 0.5px;
          white-space: nowrap;
          transition: .3s;
        }

        &.active{
          a{
            color: #F26529 !important;
            font-weight: 600;
            position: relative;

            &::before{
              content: "";
              position: absolute;
              left: 0;
              top: 50%;
              width: 1px;
              height: 14px;
              background-color: #F26529;
              transform: translateY(-50%);
            }
          }
        }
        &:hover{
          a{
            color: #F26529;
          }
        }
      }
    }

    &.white{
      ul li a{
        color: #fff;
      }
    }
  }
}

@media screen and (max-width: 1640px) {
  .renew_tint{
    .pro_cont{
      .inner{
        padding-left: 220px;
        padding-right: 70px;
      }
    }
  }
}

@media screen and (max-width: 1280px) {
  .renew{
    .TB_sec_02{
      .visions{
        > li{
          .en_tit{
            font-size: 19px;
          }
        }
      }

      .tbex_original{
        .ori_list_cont{
          padding: 30px 50px;
        }
        .ppf_list{
          gap: 8px;
        }
      }
    }
  }

  .renew_tint{
    .title_section{
      .full_half{
        padding: 110px 0 200px;
        flex-direction: column;
        gap: 0;

        .full_half_right{
          margin: 0 0 0 auto;
          padding: 0 20px 0 0;
        }
      }
      .full_half>div:first-of-type{
        min-width: 583px;
      }
    }
    .ori_lineup_tit_box{
      width: 220px;
      background-size: cover;
    }
    .ori_brand_logo,
    .ori_series_list,
    .ori_model_list{
      width: calc(100% - 220px);
    }
    .ori_trans_text{
      font-size: 20px;
    }
    .ori_series_rayno img,
    .ori_series_genefit img{
      width: 90px;
      height: 40px;
      object-fit: contain;
    }
    .ori_model_vkool img{
      width: 80%;
    }
  }
}

@media screen and (max-width: 1080px) {
  .renew_tint{
    .full_wrapper{
      padding-top: 130px;
    }

    .page_bg{
      display: block;
    }
    .page_area.active {
      .pro_link_wrap, .h3_pro{
        color: #fff;
      }
    }
    .links li{
      a{
        height: 50px;
        font-size: 4rem;
      }
    }

    .pro_link_rimac{
      .links li{
        &.links_rimacSC{
          height: 75px;
        }
      }
    }

    .genefit_link_wrap{
      &.pro_link_wrap>ul{
        min-width: 350px;
      }
    }
  }
}

@media screen and (max-width: 960px) {
  .renew{
    .TB_sec_02{
      .visions{
        flex-wrap: wrap;
        justify-content: center;
        gap: 50px 43px;

        > li{
          flex: none;
          width: calc(50% - 25px);
          max-width: 340px;

          .en_tit{
            font-size: 22px;
          }

          .vision_row{
            padding-top: 0 !important;
            padding-bottom: 38px;
            text-align: left;

            .vision_desc03{
              margin-top: 16px;
            }

          }
        }
      }

      .tbex_original{
        .ori_list_cont{
          padding: 30px;
        }
        .ppf_list{
          > li{
            width: 219px;
          }
        }
        .beast_box{
          align-items: flex-start;

          .ori_glass_list{
            li {
              > span{
                font-size: 15px;
              }
              > p{
                font-size: 13px;
              }
            }

            &.leather{
              li{
                gap: 12px;
              }
            }
          }
        }
      }
    }
  }

  .renew_tint{
    .full_wrapper{
      padding: 130px 40px 0;
    }
    .title_section{
      padding: 40px 0 0;

      &::after{
        left: -40px;
        right: -40px;
      }

      .full_half{
        padding: 100px 0 180px;
        gap: 50px;

        >div:first-of-type{
          min-width: 0;
          max-width: none;
          width: calc(100% - 110px);
          margin: 0 auto;
        }
        .full_half_right{
          margin: 0 55px;
          padding: 0;
        }
      }
    }

    .black_pro_desc{
      font-size: 18px;
    }
    .premium_original .inner{
      padding: 0;
    }

    .ori_lineup{
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 80px;

      .img_pc_only{
        display: block;
      }
      .img_tablet{
        display: none;
      }

      .ori_series_list li,
      .ori_model_vkool{
        padding: 0;
      }
    }
    .ori_lineup > div{
      padding: 37px 30px 40px;
    }

    .ori_brand{
      width: 100%;
      flex-direction: column;
      flex-wrap: nowrap;
      align-items: center;
      gap: 55px;
      border-radius: 0;
      background-image: url(../images/new2609/bg_brand_tab.png);
      background-position: bottom right;

      .ori_lineup_tit_box{
        text-align: center;
      }
      .ori_brand_logo{
        width: auto;
        padding: 0;

        img{
          width: 144px;
        }
      }
    }

    .ori_series,
    .ori_model{
      width: calc(50% - 5px);
      margin-top: 0;
      border-radius: 0;
      flex-direction: column;
      justify-content: space-between;
    }
    .ori_series_list, 
    .ori_model_list{
      width: 100%;
      margin: 40px 0 12px;

      li, .ori_model_vkool{
        justify-content: space-between;
      }
      .ori_model_vkool{
        width: 100%;
      }
    }

    .ori_series{
      .ori_series_list{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 24px 0;
      }
      .ori_series_solar{
        &:nth-of-type(1){
          width: calc(100% - 55px);
          position: relative;

          &::after{
            content: "";
            position: absolute;
            top: 50%;
            right: -11px;
            width: 1px;
            height: 15px;
            background: #fff;
            transform: translateY(-50%);
          }
        }
        &:nth-of-type(2){
          width: auto;
          img{
            display: none;
          }
        }
        img{
          width: 45px;
        }
      }
      .ori_series_rayno{
        img{
          width: 78px;
          height: 16px;
        }
      }
      .ori_series_genefit{
        img{
          width: 82px;
          height: 20px;
        }
        &::before{
          content: "";
          position: absolute;
          bottom: -12px;
          left: 0;
          width: 100%;
          height: 1px;
          background: rgba(255,255,255,.5);
        }
      }
      .ori_series_rayno,
      .ori_series_genefit{
        position: relative;

        &::after{
          content: "";
          position: absolute;
          top: -12px;
          left: 0;
          width: 100%;
          height: 1px;
          background: rgba(255,255,255,.5);
        }
      }
    }

    .ori_model{
      .ori_model_vkool{
        position: relative;

        img{
          width: 95px;
          height: 18px;
        }

        &::after{
          content: "";
          position: absolute;
          bottom: -12px;
          left: 0;
          width: 100%;
          height: 1px;
          background: rgba(255,255,255,.5);
        }
      }
    }

    .ori_lineup_tit_box{
      height: auto;
      padding: 0;
    }

    .ori_lineup_tit_en{
      font-size: 42px;
    }
    .ori_lineup_tit_kr{
      font-size: 24px;
    }
    .ori_trans_text{
      font-size: 18px;
    }

    .pro_cont{
      .inner{
        height: auto;
        padding: 0 40px;
      }
      .inner:has(+ .page_area){
        padding-top: 180px;
        padding-bottom: 50px;
        text-align: center;

        h3:has(+ .pro_desc){
          margin: 40px 0 0;
          font-size: 28px;
        }
        .pro_desc{
          padding: 0;
          margin-top: 25px;
          font-size: 18px;
          text-wrap: balance;

          .gray{
            margin-top: 30px;
          }
        }

        &::after{
          content: "";
          position: absolute;
          bottom: 0;
          left: 50%;
          width: 70px;
          height: 1px;
          background: #000;
          transform: translateX(-50%);
        }
      }

      .page_area{
        min-height: 0;
        padding: 130px 0 80px;
        border-bottom: 1px solid #e6e6e6;
        
        .page_bg{
          display: none;
        }

        &.solar_page_area{
          padding-bottom: 0;
          border-bottom: none;
        }
        &.neo_page_area{
          background: none;
        }
        &.genefit_page_area{
          padding-bottom: 160px;
        }
      }

      /* 로고들 */
      .gwf_logo_black img{
        width: 132px;
        padding: 10px 0;
      }
      .rayno_logo img{
        width: 186px;
        padding: 30px 0 10px;
      }
      .rayno_logo02,
      .solar_logo02,
      .vkool_logo02,
      .genefit_logo02{
        display: none;
      }
      .solar_logo{
        margin-top: 0;
        
        img{
          width: 108px;
          padding: 18px 0 0;
        }
      }
      .vkool_logo{
        margin-top: 0;

        img{
          width: 186px;
          padding: 30px 0 10px;
        }
      }
      .genefit_logo img{
        width: 190px;
        padding: 24px 0 4px;
      }
      /*  */

      .h3_pro.h3_premium{
        margin-top: 0;

        .add_ori_text{
          display: none;
        }
        span:not(.add_ori_text){
          margin: 0;
          color: #000 !important;
        }
      }
      .add_ori_text_m{
        display: block;
        font-size: 28px;
        margin-top: 10px;
        color: #000 !important;
      }

      .pro_link_wrap{
        display: block;
        margin-top: 45px;

        .links{
          margin-top: 40px;
          width: 100%;

          li{
            height: 200px !important;
            padding: 0;
            margin: 0 0 5px;

            &:last-of-type{
              margin: 0;
            }

            a{
              display: flex;
              height: 200px;
              padding: 0 75px 0 0;
              font-size: 32px;
              align-items: center;
              justify-content: flex-end;
              color: #fff;
              -webkit-text-stroke: 0;
            }

            &::before{
              display: none;
            }
            &::after{
              display: block;
              width: 26px;
              height: 26px;
              right: 30px;
              top: calc(50% - 14px);
              bottom: auto;
              transform: none;
              opacity: 1;
            }
          }

          .links_rimacSC{
            a{
              color: #000;
            }
            &::after{
              filter: brightness(0);
            }
          }
        }
      }
      .pro_link_desc{
        width: 100% !important;
        color: #000 !important;

        p{
          margin-bottom: 25px;
          text-wrap: balance;

          &:last-of-type{
            margin-bottom: 0;
          }
        }
      }

      .presto_page_area .links li{
        &:nth-of-type(1){
          background: url(../images/new2609/bg_con_prestoD1_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(2){
          background: url(../images/new2609/bg_con_prestoR2_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(3){
          background: url(../images/new2609/bg_con_prestoR1_m.jpg) no-repeat center / cover;
        }
      }
      .solar_page_area .links li{
        &:nth-of-type(1){
          background: url(../images/new2609/bg_con_vx_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(2){
          background: url(../images/new2609/bg_con_berylX_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(3){
          background: url(../images/new2609/bg_con_berylG_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(4){
          background: url(../images/new2609/bg_con_topaz_m.jpg) no-repeat center / cover;
        }
      }
      .neo_page_area .links li{
        &:nth-of-type(1){
          background: url(../images/new2609/bg_con_neoZ_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(2){
          background: url(../images/new2609/bg_con_neoY_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(3){
          background: url(../images/new2609/bg_con_neoX_m.jpg) no-repeat center / cover;
        }
      }
      .vcool_page_area .links li{
        &:nth-of-type(1){
          background: url(../images/new2609/bg_con_vr_m.jpg) no-repeat center / cover;
        }
        &:nth-of-type(2){
          background: url(../images/new2609/bg_con_vn_m.jpg) no-repeat center / cover;
        }
      }
      .genefit_page_area .links li{
        &:nth-of-type(1){
          background: url(../images/new2609/bg_con_genefit_m.jpg) no-repeat center / cover;
        }
      }
    }
    .genefit_link_wrap{
      &.pro_link_wrap>ul{
        min-width: 0;
      }
    }

    .pro_cont_nav{
      top: 170px;
      left: 50%;
      transform: translateX(-50%);
      transition: 0.2s ease-in-out;

      ul{
        display: flex;
        padding: 10px 11px;
        gap: 10px;
        background: rgba(33,33,33,.9);
        border-radius: 4px;
        box-shadow: 0 6px 12px rgba(0,0,0,.27);

        li{
          margin: 0;

          a{
            padding: 6px 10px;
            color: #fff !important;
            border-radius: 2px;
          }
          &.active{
            background: #F26529;

            a{
              color: #fff !important;

              &::before{
                display: none;
              }
            }
          }
        }
      }
    }
  }

  .sub_menu_wrap.up ~ .renew_tint{
    .pro_cont_nav{
      top: 100px;
    }
  }
}

@media screen and (max-width: 768px) {
  .renew{
    .tbex_desc{
      word-break: keep-all;
      text-wrap: balance;
    }

    .TB_sec_02{
      .tbex_original{

        .tac > img{
          width: 321px;
          height: auto;
        }

        .ppf_list{
          flex-direction: column;
          gap: 30px;

          > li{
            width: 100%;
            max-width: 382px;

            > img{
              aspect-ratio: 3.82 / 1.5;
              object-fit: cover;
              object-position: center;
            }
          }
        }

        .beast_box{
          > *{
            width: 100% !important;
          }

          > img{
            display: none;
            aspect-ratio: 3.82 / 1.3;

            &.mob{
              display: block;
            }
          }

          .ori_glass_list{
            li {
              padding: 20px 14px !important;
            }
            &.leather{
              li{
                gap: 20px;

                > span{
                  width: 55px;
                  line-height: 22px;
                }
              }
            }
          }
        }

        .ori_btn_row{
          margin-top: 40px;

          > a{
            width: 100%;
          }
          
          .btn_square03{
            width: 100%;
          }
        }
      }
    }
    
    
    .year_row{
      flex-wrap: wrap;

      .year{
        width: 100%;
      }

      ul li{
        flex-wrap: nowrap;

        .month{
          width: max-content;
          font-size: 36px;
          align-content: center;

          span{
            font-size: 50px;
          }
        }
      }
    }
  }

  .renew_tint{
    .full_wrapper{
      padding-top: 120px;
    }

    .pro_cont{
      .pro_link_wrap{
        .pro_link_desc{
          p{
            width: 90%;
          }
        }
      }
    }

    .pro_cont_nav{
      top: 150px;
    }
  }
  .sub_menu_wrap.up ~ .renew_tint{
    .pro_cont_nav{
      top: 80px;
    }
  }
}

@media screen and (max-width: 640px) {
  .renew_tint{
    .ori_brand{
      align-items: flex-start;
      background-image: url(../images/new2609/bg_brand_m.png);

      .ori_lineup_tit_box{
        text-align: left
      }
      .ori_brand_logo{
        width: 100%;
        justify-content: flex-end;
      }
    }
    .ori_series, 
    .ori_model{
      width: 100%;
      min-height: 240px;
      flex-direction: row;
      flex-wrap: wrap;

      .ori_lineup_tit_box{
        width: 200px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
      }
    }
    .ori_series_list, 
    .ori_model_list{
      width: 223px;
      margin-left: auto;
    }
    .ori_model_list{
      min-height: 111px;
      align-items: flex-end;
    }
    .ori_lineup_tit_en{
      font-size: 36px;
    }
    .ori_lineup_tit_kr{
      font-size: 20px;
    }
    .ori_model_vkool{
      height: 18px;
    }
  }
}

@media screen and (max-width: 580px) {
  .renew{
    .TB_sec01{
      &.slide02, &.slide03{
        .main_tit{
          span{
            font-size: 28px;
          }
        }
        .main_txt{
          font-size: 16px;
        }
      }

      &.slide02{
        .main_tit{
          img{
            max-width: 418px;
          }
        }
        > .bg{
          img.mob{
            right: -55%;
          }
        }
      }

      &.slide03{
        .main_tit{
          img{
            width: 100%;
            max-width: 347px;
          }
        }
      }
    }
    .TB_sec_02{
      .visions{
        gap: 53px;

        > li{
          width: 100%;
          max-width: 284px;
          text-align: center;

          .vision_row{
            padding-bottom: 0;
            text-align: center;
            border: none;

            .vision_desc03{
              width: 115px;
              margin: 0 auto;
              padding: 13px 0;
              border-top: 1px solid #000;
            }

            .vision_desc04{
              margin-top: 0;
              text-wrap: balance;
            }
          }
        }
      }

      .original_partners{
        width: 100%;
        max-width: 400px;
        margin: 0 auto 60px;
        justify-content: space-between;
        transform: none;
        overflow-x: hidden;

        img{
          max-width: 55px;
          max-height: 30px;
          margin: 0;
          object-fit: contain;
        }
      }

      .ori_list_tit{
        padding: 23px 10px;

        &::after{
          top: 22px;
          right: 13px;
        }
      }

      .ori_tinting_list>li{
        flex-direction: column;
        gap: 10px;
      }
      .tbex_original{
        .ori_list_cont{
          padding: 20px;
        }
        .ppf_list{
          > li{
            > img{
              aspect-ratio: 3.1 / 1.5;
            }
          }
        }
      }

      .year_row ul li{
        flex-direction: column;

        .month{
          font-size: 26px;
          span{
            font-size: 40px;
          }
        }
        .his_cont{
          padding: 0;
        }
      }
    }
  }

  .renew_tint{
    .full_wrapper{
      padding: 110px 24px 0;
    }

    .title_section{
      &::after{
        left: -24px;
        right: -24px;
      }

      .full_half{
        >div{
          width: calc(100% - 40px) !important;
        }
        .full_half_right{
          max-width: none;
          min-width: 0;
          margin: 0 auto;
        }
      }
    }
    .fz30_28{
      padding: 0 10px;
      font-size: 26px;
    }
    .pre_ori_tit img{
      width: calc(100% - 24px);
      max-width: 330px;
    }
    .black_pro_desc{
      min-width: 0;
      padding: 0 5px;
      font-size: 15px;
    }
    .ori_lineup{
      margin-top: 60px;
    }

    .pro_cont{
      .inner{
        padding: 0 24px;
      }
      .inner:has(+ .page_area){
        text-align: left;
        padding: 180px 24px 60px;

        &::after{
          left: 24px;
          transform: none;
        }

        .pro_desc{
          /* text-wrap: auto; */

          .gray{
            text-wrap: auto;
          }
          .hide-580{
            display: none;
          }
        }
      }
      .page_area{
        padding: 80px 0;
      }
      .h3_pro.h3_premium{
        font-size: 40px;
      }
      .pro_link_desc{
        font-size: 16px;
        font-weight: 300;
      }

      .pro_link_wrap{
        .links{
          li{
            height: 164px !important;
            
            a{
              height: 164px;
            }
          }
        }
        .pro_link_desc{
          p{
            width: 100%;
          }
        }
      }
    }
  }
}

@media screen and (max-width: 425px) {
  .renew{
    .TB_sec01{
      .main_txt{
        font-size: 18px;
      }

      &.slide01{
        .main_tit{
          img{
            width: 294px;
          }
        }
      }

      &.slide02, &.slide03{
        .main_txt{
          font-size: 14px;
        }
      }
      
    }
  }

  .renew_tint{
    .pro_cont{
      .pro_link_wrap{
        .links{
          li{
            a{
              padding: 0 60px 0 0;
              font-size: 26px;
            }

            &::after{
              width: 24px;
              height: 24px;
              right: 20px;
              top: calc(50% - 12px);
            }
          }
        }
      }
    }
    .pro_cont_nav{
      ul{
        gap: 0;
      }
    }
  }
}

@media screen and (max-height: 768px) {
  .renew{
    .TB_sec01{
      &.slide02, &.slide03 {
        .main_tit_wrap{
          top: 75px;
        }
      }
    }
  }
}