@media only screen and (min-width: 769px) and (min-width: 769px) and (max-width: 1399px) {
  .wrapper {
    width: 94%;
  }
}
@media only screen and (min-width: 769px) {
  .nav_tab {
    padding-bottom: 30px;
    top: 80px;
    position: fixed;
    left: 0;
    width: 100%;
    z-index: 7;
    background: #fff;
  }
  .nav_tab ul {
    display: flex;
    align-items: center;
    margin-top: 40px;
  }
  .nav_tab ul li {
    font-family: Slussen Expanded, var(--fallback-fonts);
    padding: 14px 40px;
    text-align: center;
    color: #000;
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.48px;
    text-transform: uppercase;
    border: 1px solid #d3d3d3;
    cursor: pointer;
    transition: all 0.3s;
    width: 30%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .nav_tab ul li.active {
    background-color: #222 !important;
    border: 1px solid #222 !important;
    color: #fff;
    transition: all 0.3s;
  }
  .nav_tab ul li:hover {
    border: 1px solid #d3d3d3;
    background: #d3d3d3;
    transition: all 0.3s;
  }
}
@media only screen and (min-width: 769px) {
  .content_wrapper {
    padding-top: 200px;
  }
}
@media only screen and (min-width: 769px) {
  .content {
    margin-top: 60px;
    padding-bottom: 120px;
    display: none;
  }
  .content.active {
    display: block;
  }
  .content_title {
    font-family: Slussen Expanded, var(--fallback-fonts);
    color: #000;
    text-transform: uppercase;
    font-size: 52px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -1.04px;
    margin-bottom: 60px;
  }
  .content_container {
    display: flex;
    flex-wrap: wrap;
/*    justify-content: center;*/
    gap: 60px 4%;
  }
  .content_item {
    width: 48%;
    cursor: pointer;
  }
  .content_item_image img {
    width: 56%;
  }
  .content_item:hover .content_item_image img {
    transform: scale(1.2);
    transition: all 0.4s;
  }
  .content_item_image {
    border-radius: 20px;
    background: url(../img/product_bg.png) no-repeat top center/100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 90%;
    width: 100%;
    overflow: hidden;
  }
  .content_item_image img {
    transform: scale(1);
    transition: all 0.4s;
  }
  .content_item_title {
    font-family: Slussen Expanded, var(--fallback-fonts);
    margin-top: 20px;
    color: #000;
    font-size: 91%;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: -0.64px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media only screen and (min-width: 769px) and (min-width: 1399px) {
  .content_item_title {
    font-family: Slussen Expanded, var(--fallback-fonts);
    margin-top: 20px;
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: -0.64px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media only screen and (max-width: 768px) {
  .nav_tab_dropdown {
    padding-top: 20px;
    padding-bottom: 20px;
    top: 68px;
    position: fixed;
    left: 0;
    width: 100%;
    z-index: 7;
    background: #fff;
  }
  .nav_tab_dropdown_btn {
    padding: 8px 12px 8px 20px;
    border: 1px solid #d3d3d3;
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.44px;
    text-transform: uppercase;
    position: relative;
    cursor: pointer;
  }
  .nav_tab_dropdown_btn::after {
    content: "";
    position: absolute;
    background: url(../img/arrow_down_dark.png) no-repeat top center/100%;
    width: 13px;
    height: 9px;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
  }
  .nav_tab_dropdown_content {
    position: absolute;
    width: calc(100% - 42px);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    border: 1px solid #000;
    background: #fff;
    left: 0;
    top: 52px;
    transition: all 0.3s;
    z-index: 8;
  }
  .nav_tab_dropdown_content li {
    text-transform: uppercase;
    cursor: pointer;
    width: fit-content;
    color: #808080;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.36px;
    text-transform: uppercase;
  }
  .nav_tab_dropdown_content li a {
    color: #808080;
  }
  .nav_tab_dropdown_content li.active {
    color: #000;
  }
  .content_wrapper {
    padding-top: 178px;
  }
  .content {
    padding-bottom: 120px;
    display: none;
  }
  .content.active {
    display: block;
  }
  .content_title {
    text-transform: uppercase;
    margin-bottom: 20px;
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    letter-spacing: -0.48px;
  }
  .content_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px 8%;
  }
  .content_item {
    width: 46%;
    cursor: pointer;
  }
  .content_item:hover .content_item_image img {
    transform: scale(1.2);
    transition: all 0.4s;
  }
  .content_item_image {
    border-radius: 8px;
    background: url(../img/product_bg.png) no-repeat top center/100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80%;
    width: 100%;
    overflow: hidden;
  }
  .content_item_image img {
    transform: scale(1);
    transition: all 0.4s;
    width: 56%;
  }
  .content_item_title {
    margin-top: 12px;
    color: #000;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media only screen and (max-width: 768px) and (max-width: 689px) {
  .content_item_title {
    margin-top: 12px;
    color: #000;
    text-align: center;
    font-size: 8px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media only screen and (max-width: 768px) and (orientation: landscape) {
  .nav_tab_dropdown {
    top: 70px;
  }
  .content_wrapper {
    padding-top: 180px;
  }
}
@media only screen and (max-width: 768px) and (min-width: 380px) and (max-width: 768px) {
  .wrapper {
    width: 84%;
  }
}
@media only screen and (max-width: 768px) and (max-width: 359px) {
  .wrapper {
    width: 88.8889vw;
    margin: 0 auto;
    position: relative;
  }
  .nav_tab_dropdown {
    padding-top: 5.5556vw;
    padding-bottom: 5.5556vw;
    top: 18.8889vw;
  }
  .nav_tab_dropdown_btn {
    padding: 2.2222vw 3.3333vw 2.2222vw 5.5556vw;
    border: 0.2778vw solid #d3d3d3;
    font-size: 6.1111vw;
    line-height: 8.8889vw;
    letter-spacing: -0.1222vw;
  }
  .nav_tab_dropdown_btn::after {
    width: 3.6111vw;
    height: 2.5vw;
    top: 50%;
    right: 4.1667vw;
  }
  .nav_tab_dropdown_content {
    width: 73.3333vw;
    padding: 5.5556vw 7.5vw;
    gap: 5.5556vw;
    border: 0.2778vw solid #000;
    top: 14.4444vw;
  }
  .nav_tab_dropdown_content li {
    text-transform: uppercase;
    font-size: 5vw;
    line-height: 8.8889vw;
  }
  .content_wrapper {
    padding-top: 49.4444vw;
  }
  .content {
    padding-bottom: 33.3333vw;
  }
  .content_title {
    margin-bottom: 5.5556vw;
    font-size: 6.6667vw;
    line-height: 8.8889vw;
    letter-spacing: -0.1333vw;
  }
  .content_container {
    gap: 5.5556vw;
  }
  .content_item {
    width: 41.6667vw;
  }
  .content_item_image {
    border-radius: 2.2222vw;
    height: 30vw;
  }
  .content_item_title {
    margin-top: 3.3333vw;
    font-size: 2.2889vw;
    line-height: 5.5556vw;
    letter-spacing: -0.0778vw;
  }
}

/*다운로드 버튼 추가 :: 241205*/
.pdf_list {display: flex; flex-wrap: wrap; gap:2%; width: 100%;}
.pdf_list > * {width: 32%; }
.pdf_list .pdf_btn {margin-bottom: 15px;}
.pdf_list .pdf_image {display: flex; align-items: center; justify-content: center; height: 300px; border: 1px solid #000;}
.pdf_list .pdf_image img {max-width: 100%; max-height: 100%;}
.pdf_list .pdf_image + .pdf_btn {max-width: 90%; margin: 15px auto 60px;}

@media only screen and (min-width: 769px) {
  .content_container.none {gap : 0;}
  .content_title.fz {margin-bottom: 30px; width: 100%;}
  .content_title.fz span {font-size: .8em; line-height: 1.2; display: inline-block;}
  .pdf_list .pdf_btn span::after {width: 30px; height: 34px; right: 20px;}
  .pdf_list.ty2 > * {width: 49%; margin-bottom: 1%;}

  br.view-m {display: none;}
}


@media only screen and (max-width: 768px) {
  .content_container.none {gap : 0;}
  .content_title.fz {width: 100%; margin-bottom: .5em;}
  .content_title.fz span {font-size: .9em; line-height: 1.2; display: inline-block;}
  .pdf_list {display: block;}
  .pdf_list > * {width: 100%;}
  .pdf_list .pdf_btn {margin-bottom: 10px;}
  .pdf_list .pdf_image {height: 200px;}
  .pdf_list .pdf_image + .pdf_btn {margin-bottom: 30px;}
}


/*메인 4단으로 변경 : 241222*/
.content_item_image {position: relative; background: #f5f8fa; height: 0 !important; padding-bottom: 90%; border-radius: 5px; transition: all 0.4s;}
.content_item_image img {position: absolute; left: 50%; top: 50%; width:65%; transform:translate(-50%,-50%) scale(1);}
.content_item_image:hover {background: #c3cfd7;}

@media only screen and (min-width: 769px) {
  .container {overflow-x: hidden;}
  .content_container {gap: 60px 2%; width: 102%;}
  .content_item {width: 31.33%;}
  .content_item_title {
    margin-top: 20px;
    font-size: 18px;
    line-height: 1.3;
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .content_item:hover .content_item_image img {transform:translate(-50%,-50%) scale(1);}
}

@media only screen and (min-width: 769px) and (min-width: 1399px) {
  .content_container {gap: 60px 2%;}
  .content_item {width: 23%;}
}
@media only screen and (max-width: 768px) {
  .content_item_image img {transform: translate(-50%,-50%) scale(1);  width:83%;}
  .content_item:hover .content_item_image img {transform: translate(-50%,-50%) scale(1);}
}
@media only screen and (max-width: 768px) and (max-width: 689px) {
  .content_item_title {
      font-size: 14px;
      line-height: 20px;
      white-space: normal;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      text-align: left;
  }
}