body{zoom: 1;}
/* ---------------------------- cutting-type ---------------------------- */
.e-catalog-cont{width: 100%;}
.e-catalog-cont-m{display: none;}
.e-catalog-inner{
  padding-top: 70px;
  display: flex;
}
.cutting-type{
  position: relative;
  width: calc(25% - 16px);
  margin-right: 24px;
}
.cutting-type-list{
  width: 100%;
}
.cutting-type-tit{
  padding: 8px;
  display: flex;
  align-items: center;
  align-items: center;
  background: #F4F4F4 url(../../images/util-menu/more-arrow.png) no-repeat center right 10px / 20px;
  cursor: pointer;
  font-size: 20px;
  color: #656565;
}
.e-catalog-cont-pc .cutting-type-list li:not(:first-child){margin-top: 10px;}
.e-catalog-cont-pc .cutting-type-list li .cutting-type-tit:hover,
.e-catalog-cont-pc .cutting-type-list li.active .cutting-type-tit{background: #ED1C24 url(../../images/util-menu/more-arrow-active.png) no-repeat center right 10px / 20px;}
.e-catalog-cont-pc .cutting-type-list li:hover .cutting-type-tit,
.e-catalog-cont-pc .cutting-type-list li.active .cutting-type-tit{
  color: #fff;
  font-weight: 600;
}
.e-catalog-cont-pc .cutting-type-list .list-img{
  width: 64px;
  height: 64px;
  display: block;
  margin-right: 10px;
}
.cutting-type-list li .list-tit{
  font-size: 20px;
  color: #656565;
  margin-left: 15px;
}
.cutting-type-list li.active .list-tit, .cutting-type-list li:hover .list-tit{
  color: #fff;
  font-weight: bold;
}
.e-catalog-arrow{
  width: 24px;
  height: 24px;
  text-indent: -9999em;
  background: url(../../images/util-menu/more-arrow.png) no-repeat center/ 80%;
}
.option-list{
  width: 100%;
  display: none;
}
.option-list.active{display: block;}
.option-list > li{
  border: 1px solid #000;
  position: relative;
}
.option-list > li.active{width: 708px;}
.option-list > li > .option-list-item{
  width: 342px;
  min-height: 48px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #656565;
  background: #F4F4F4 url(../../images/util-menu/more-arrow.png) no-repeat center right 10px/ 20px;
}
.option-list > li > .option-list-item:hover,
.option-list > li.active > .option-list-item {
  color: #fff;
  font-weight: bold;
  background: #222 url(../../images/util-menu/more-arrow-active.png) no-repeat center right 10px/ 20px;
}
.option-list > li:not(:first-child){margin-top: 5px;}
.select-brand{
  position: absolute;
  right: 0;
  top: 0;
  width: 342px;
  border: 1px solid red;
  display: none;
  z-index: 99;
}
.option-list > li.active > .select-brand {display: block;}
.select-brand > li{
  max-height: 48px;
  background: #F4F4F4 url(../../images/util-menu/more-arrow.png) no-repeat center right 10px/ 20px;
}
.select-brand > li a{
  padding: 0 20px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}
.select-brand li a img{
  display: block;
  margin-right: 10px;
} 
.select-brand > li:hover, .select-brand > li.active{
  background: #222 url(../../images/util-menu/more-arrow-active.png) no-repeat center right 10px/ 20px;
}
.select-brand > li:not(:first-child) {margin-top: 5px;}
.select-brand > li:hover a, .select-brand > li.active a {
  color: #fff;
  font-weight: bold;
}
/* ------------------ e-catalog-cont-mobile ------------------ */
.e-catalog-cont-m{width: 100%;}
.e-catalog-cont-m .e-catalog-inner{
  display: block;
  padding-top: 55px;
}
.e-catalog-cont-m .e-catalog-inner > div{
  width: 100%;
  display: none;
}
.e-catalog-cont-m .e-catalog-inner > div.active{display: block;}
.e-catalog-cont-m .cutting-type-list{
  width: calc(100% - 40px);
  margin: 0 auto;
}
.e-catalog-cont-m .cutting-type-list .cutting-type-item{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px;
  background: #F4F4F4;
  cursor: pointer;
}
.e-catalog-cont-m .cutting-type-list > li.active > .cutting-type-item{background: #ED1C24;}
.e-catalog-cont-m .cutting-type-list .cutting-type-item:hover{background: #ED1C24;}
.e-catalog-cont-m .cutting-type-list li.active .list-tit{color: #fff;}
li:hover > .e-catalog-arrow, li.active > .e-catalog-arrow{
  background: url(../../images/util-menu/more-arrow-active.png) no-repeat center/ 80%;
}
.e-catalog-cont-m > .cutting-type{width: 100%;}
.e-catalog-cont-m .cutting-type-list > li .option-wrap{display: none;}
.e-catalog-cont-m .cutting-type-list > li.active .option-wrap{display: block;}
.e-catalog-cont-m .option-list{
  display: block;
  padding: 10px 0;
}
.e-catalog-cont-m .cutting-type-list li:not(:first-child){margin-top: 5px;}
.e-catalog-cont-m .cutting-type-list li .option-wrap{
  width: 80%;
  margin-left: auto;
}
.e-catalog-cont-m .select-brand::after, .e-catalog-cont-m .cutting-type::after{font-size: 20px;}
.e-catalog-arrow_m{background: url(../../images/util-menu/more-arrow.png) no-repeat center/ contain;}

.e-catalog-cont-m .cutting-type-list li.active .cutting-type-item .e-catalog-arrow,
.e-catalog-cont-m .cutting-type-list li:hover .cutting-type-item .e-catalog-arrow{
  background: url(../../images/util-menu/more-arrow-active.png) no-repeat center/ cover;
}
.e-catalog-cont-m .select-brand{
  display: none;
  width: 100%;
}
.e-catalog-cont-m .select-brand.active{display: block;}
.e-catalog-cont-m .select-brand-list{
  height: auto;
  /* display: none; */
}
.e-catalog-cont-m .select-brand-list > ul > li{
  position: relative;
  padding-top: 20px;
}
.e-catalog-cont-m .select-brand-list > ul > li:last-child{padding-bottom: 25px;}
.e-catalog-cont-m .select-brand-btn{
  margin: 12px 0 0 auto;
  position: static;
}
.e-catalog-cont-m .select-brand::after, .e-catalog-cont-m .cutting-type::after{left: 20px;}
.e-catalog-cont-m .select-brand-wrap{background: #F4F4F4;}
.e-catalog-cont-m .select-brand-tit .list-tit .icon-wrap{
  margin-top: 30px;
  height: 35px;
}
.option-list-m{display: none;}
.option-list-m.active {
  display: block;
}
@media (max-width: 786px){
  .cutting-type{
    width: 100%;
    margin-right: 0;
  }
  .option-list > li.active{
    width: 100%;
  }
  .option-list > li{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }
  .select-brand{position: static;}
  .e-catalog-cont-pc .cutting-type-list li{margin-top: 10px;}
  .option-list > li > .option-list-item,
  .select-brand{width: 90%;}
}
/* ---------------------------- //cutting-type ---------------------------- */
/* ---------------------------- series ---------------------------- */
.e-catalog_series {width: 100%; max-width: 1800px; display: flex; margin: 40px auto 0;}
.e-catalog_series .cutting-type-wrap {margin-right: 3.5%;}
.e-catalog_series-wrap {max-width: 1440px; width: calc(100% - 40px);}
.e-catalog_series-info p.emphasis{font-weight: bold;}
.e-catalog_series-info p{font-size: 14px;}
.e-catalog_series-cont{margin-top: 24px;}
.e-catalog_series-list{
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 36px 24px;
}
.series-procuct{
  border: 1px solid #eee;
  width: 100%;
  min-height: 380px;
  padding: 16px 16px 76px;
  cursor: pointer;
}
.series-procuct > strong{
  font-size: 20px;
  font-weight: bold;
  font-family: 'Play', sans-serif;
}
.series-procuct-img{width: 100%; margin-bottom: 20px;}
.series-procuct-img img{
  width: 80%;
  max-height: 140px;
  min-height: 140px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}
.series-icons{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}
.series-icons img {display: block; width: 60px; max-height: 60px;}
@media (max-width: 768px){
  .e-catalog_series-list {
    grid-template-columns: repeat(1, 1fr);
    gap: 36px;
  }
  .series-icons {gap: 8px;}
}
/* ---------------------------- //series ---------------------------- */
/* ---------------------------- series-details ---------------------------- */
.e-catalog-wrap {width: calc(100% - 40px);max-width: 1800px; display: flex; margin: 40px auto 0;}
.e-catalog-wrap .cutting-type-wrap {margin-right: 3.5%;}
.e-catalog-box {max-width: 1440px; width: calc(100% - 110px - 3.5%);}
.e-catalog-box > .con-box{width: 100%;}

.series-details-top{
  display: flex;
  justify-content: space-between;
}
.series-details-img{
  width: calc(45% - 15px);
  text-align: center;
}
.series-details-img img{
  max-width: 100%;
}
/* 20231018 툴링시스템 이미지 사이즈조정 */
.con-wrap.tooling-system .series-details-img{width: calc(60% - 15px);}
.con-wrap.tooling-system .series-details-info{width: calc(40% - 15px);}
.con-wrap.tooling-system .series-details-img img{
  width: 50%;
}
.con-wrap.tooling-system .series-details-img{
  display: flex;
  align-items: center;
}
.series-details-info{
  width: calc(55% - 15px);
  position: relative;
}
.series-details-info > span{
  font-weight: 600;
  color: #656565;
}
.series-details-maintit{
  font-family: 'Play', sans-serif;
  font-size: 28px;
  line-height:1.15;
  margin-bottom:10px;
  font-weight: bold; 
   padding-right:5%;
}
.series-details-icons{display: flex;flex-wrap: wrap;}
.series-details-icons li{
  margin-right: 4px;
}
.series-details-icons li img {width: 60px; max-height: 60px;}
.series-details-icons li:last-child{margin-right:0;}
.series-details-subtit{
  border-top: 1px solid #ddd;
  margin-top: 10px;
  padding-top: 10px;
}
.series-details-subtit > span{
  font-size: 20px;
  font-weight: 600;
}
.series-details-option{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 24px;
}
.series-details-option li{
  margin-right: 24px;
}
.series-details-option li img{max-width: 80px;width: 100%; height: auto;}
.series-details-info .share-btn{
  width: 36px;
  height: 36px;
  border: 1px solid #656565;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0;
  top: -6px;
  position: absolute;
}
.series-detail-btns{
  display: flex;
  justify-content: flex-end;
  margin-top: 85px;
}
.series-detail-btns a.common-btn{
  min-width: 140px;
  display: flex;
  align-items: center;
}
.series-detail-btns a.common-btn:not(:last-child){margin-right: 10px;}
.series-detail-btns a.common-btn .more-btn{
  margin-left: 5px;
  width: 14px;
  height: 14px;
  background: url(../../images/util-menu/more-arrow.png) no-repeat center/ contain;
}
.series-detail-btns a.common-btn:hover .more-btn {
  background: url(../../images/util-menu/more-arrow-active.png) no-repeat center/ contain;
}
.series-details-bottom{
  border-top: 1px solid #ddd;
  margin-top: 40px;
  padding-top: 24px;
}
.series-details-table-info{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.series-details-table-info .select-custom{
  margin-top: 0;
  margin-right: 8px;
  width: calc(30% - 4px);
}
.series-details-table-info .select-custom .select_tit{height: 44px;}
.series-details-table-info .select-custom .select-custom-list{top: 44px;}
.series-details-table-info > div:first-child{
  display: flex;
  width: 50%;
}
.series-details-table-info > div:first-child form{
  width: calc(70% - 4px);
  height: 44px;
  position: relative;
  display: block;
}
.series-details-table-info > div:first-child form input{
  width: 100%;
  height: 100%;
  border: 1px solid #eee;
  padding-left: 10px;
  padding-right: 40px;
  outline: none;
}
.series-details-table-info > div:first-child form button{
  width: 24px;
  height: 24px;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}
.series-details-bottom .table-info-tit{text-align: right;}
.series-details-bottom .table-info-tit > p{font-size: 14px;}
.series-details-bottom .table-info-tit > p.emphasis{font-weight: bold;}
.series-details-bottom .table-info-tit .switch-wrap {border-bottom: 0;}
.series-details-bottom .table-info-tit .switch-wrap .switch-wrap-inner {width: 100%;}
.series-details-table{
  margin-top: 24px;
  padding-bottom: 24px;
  overflow: auto;
  border-top: 2px solid #000;
  /* -ms-overflow-style: none; */
}

/* ec holemaking table */
.series-details-table.holemaking{border-top-color: #762594;}
.series-details-table.holemaking th{background-color: #F5EFF7;}
.series-details-table.holemaking thead tr:first-child th:not(:first-child, :nth-child(2)){background-color: #E9DBEE;}

/* ec threading table */
.series-details-table.threading{border-top-color: #00B2B2;}
.series-details-table.threading th{background-color: #E2FAFB;}
.series-details-table.threading thead tr:first-child th:not(:first-child, :nth-child(2)){background-color: #CBF3F4;}

/* ec milling table */
.series-details-table.milling{border-top-color: #1254B5;}
.series-details-table.milling th{background-color: #E1E9F6;}
.series-details-table.milling thead tr:first-child th:not(:first-child, :nth-child(2)){background-color: #CBD9F0}

/* ec tooling table */
.series-details-table.tooling-system{border-top-color: #C11D20;}
.series-details-table.tooling-system th{background-color: #F8E8E8;}
.series-details-table.tooling-system thead tr:first-child th:not(:first-child, :nth-child(2)){background-color: #F3D3D3;}

/* ec turning table */
.series-details-table.turning{border-top-color: #F28E00;}
.series-details-table.turning th{background-color: #FFEFD9;}
.series-details-table.turning thead tr:first-child th:not(:first-child){background-color: #FEE5C3;}

.series-details-table .table-body::-webkit-scrollbar {height: 10px; width: 10px;}
.series-details-table .table-body::-webkit-scrollbar-thumb {background-color: #aaa; border-top: 4px solid transparent;}
.series-details-table .table-body::-webkit-scrollbar-track {background-color: #E6E6E6;}
.series-details-table > div {
  white-space: nowrap;
}
.series-details-table .table-body {overflow: auto; max-height: 870px;}
.series-details-table .table-type01 {min-width: 1440px; max-height: 350px;}
.series-details-table .table-type01 thead {border-top: 0; position: sticky; top: 0; left: 0; z-index: 2;}
.series-details-table .table-type01 th {
  border-right: 1px solid #DBDBDB;
  padding: 14px 12px;
  /* width: 220px; */
  white-space: nowrap;
  word-break: break-all;
}
.series-details-table .table-type01 th:last-child {border-right: 0;}
.series-details-table .table-type01 thead tr:first-child th:first-child {width: 150px;}
/* .series-details-table .table-type01 thead tr:first-child th:nth-child(2) {width: 150px;} */
.series-details-table .table-type01 td {border-right: 1px solid #DBDBDB;white-space: nowrap;padding: 7px;}
.series-details-table .table-type01 td.first {font-weight: 600; width: 150px;}
.series-details-table .table-type01 td:last-child {border-right: 0;}
.series-details-table .table-num{cursor: pointer;}
.series-details-table .table-num .table-num-list span{
  width: 14px;
  height: 14px;
  margin-left: 10px;
  display: inline-block;
  background: url(../../images/util-menu/arrow.png) no-repeat center;
  transition: all .35s;
}
.series-details-table .table-num .table-num-list.on span {transform: rotate(180deg);}
/*20230130 테이블 가로 고정 추가*/
/* 20240402 테이블 가로 고정 수정 */
.series-details-table .table-type01 .table-info {/*width:100vw;*/ height: 56px; display: table-cell; position: sticky; left: 0; border-bottom: 0;}
.series-details-table .table-type01 td.table-info-inner{width: auto; padding: 10px 30px; display: block; position: absolute; top: 0; left: 0;}
.table-info-inner{
  background: #ddd;
  justify-content: space-between;
  overflow: hidden;
}
.table-info-inner .table-info-box {width: calc(100vw - 270px); max-width:1380px; display: flex; align-items: center; justify-content: space-between;}
.table-info-inner .table-info-box div {display: flex; align-items: center;}
.table-info-inner .table-info-box div > span{
  font-weight: 600;
  margin-right: 20px;
}
.table-info-inner > div > a.common-btn{margin-right: 0px;}
.table-info-inner a.common-btn{
  min-width: 104px;
  max-width: 104px;
  height: 36px;
  background: #222;
  color: #fff;
}
.table-info-inner a.common-btn:hover{background: #ed1c24;}
.table-info-inner > a.common-btn{
  float: right;
}
.series-cont{margin-top: 138px;}
.series-cont-tit{
  font-family: 'Play', sans-serif;
  font-size: 24px;
  font-weight: bold;
}
.series-cont-tit .tab-list{
    display: flex;
}
.series-cont-tit .tab-list a{
    padding: 0 20px;
    position: relative;
}
.series-cont-tit .tab-list a:first-child{padding-left: 0;}
.series-cont-tit .tab-list a span{
    color: #aaa;
    font-weight: 600;
    transition: .15s;
}
.series-cont-tit .tab-list a.on span, .series-cont-tit .tab-list a:hover span{
    color: #ED1C24;
    border-bottom: 1px solid #ED1C24;
}
.series-cont-tit .tab-list a:not(:last-child)::after{
    content: '';
    width: 1px;
    height: 60%;
    background: #666;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.related-product-slide-wrap{
  width: 100%;
  margin-top: 24px;
  position: relative;
}
.related-product-info{
  /* min-height: 380px; */
  height: 440px;
  border: 1px solid #eee;
  padding: 26px 16px 76px;
  cursor: pointer;
}
.related-product-info .related-product-img{
  width: 100%;
  height: 200px;
  min-height: 200px;
  max-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.related-product-info > h3{
  font-family: 'Play', sans-serif;
  font-size: 20px;
  font-weight: bold;
  margin-top: 40px;
}
.related-product-info > p{
  font-size: 14px;
  display:-webkit-box;
  overflow:hidden;
  text-overflow:ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient:vertical;
}
.related-product-img img{
  width: 90%;
  height: 90%;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}
.related-product-icons{
  padding: 4px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
}
.related-product-icons li img{width: 100%;}
.related-product-slide{width: 90%;}
.related-product-controls{
  width: 100%;
  height: 36px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.related-product-controls .swiper-button-next,
.related-product-controls .swiper-button-prev{
  width: 36px;
  height: 100%;
  border-radius: 50%;
  margin-top: 0;
  transform: translateY(-50%);
  background: #F4F4F4 url(../../images/util-menu/icon-arrow.png) no-repeat center;
}
.related-product-controls .swiper-button-prev{transform: translateY(-50%) rotate(180deg);}
.related-product-controls .swiper-button-next::after,
.related-product-controls .swiper-button-prev::after {display: none;}
.contact-popup{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  display: none;
}
.contact-popup.active{
  display: block;
  z-index: 99;
}
.contact-popup-dim{
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
}
.contact-popup-cont{
  width: calc(100% - 40px);
  max-width: 464px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 10px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 24px 16px;
  max-height: 87vh;
  overflow-y: auto;
}
.contact-popup-cont::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.contact-popup-cont::-webkit-scrollbar-button {
  background: transparent;
}
.contact-popup-cont::-webkit-scrollbar-thumb {
  background-color: #aaa;
}
.contact-popup-cont::-webkit-scrollbar-track {
  background-color: #E6E6E6;
}
.contact-popup-tit {text-align: center;}
.contact-popup-tit > h3{
  margin: 0 auto;
  font-size: 24px;
  display: inline-block;
  font-weight: 600;
  position: relative;
}
.contact-popup-tit > h3::after{
  content: '';
  width: 60%;
  height: 3px;
  background: #ed1c24;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.contact-popup-tit > p{
  font-size: 14px;
  color: #656565;
  margin-top: 10px;
}
.contact-popup-inner{margin-top: 20px;}
.contact-popup-select > li:not(:first-child){margin-top: 16px;}
.contact-popup-select > li{
  display: flex;
  flex-direction: column;
}
.contact-popup-select > li .essential-tit{font-weight: 600;}
.contact-popup-select > li .essential-tit.emphasis{
  position: relative;
  padding-left: 10px;
}
.contact-popup-select > li .essential-tit.emphasis::after{
  content: '*';
  color: #ed1c24;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.contact-popup-select > li input, .contact-popup-select > li textarea{
  width: 100%;
  display: block;
  border: 1px solid #eee;
  outline: none;
  padding: 4px 10px;
}
.contact-popup-select > li input{
  height: 36px;
  padding-left: 10px;
}
.contact-popup-select > li #content-txt{
  min-height: 120px;
  max-height: 120px;
  width: 100%!important;
  padding: 5px 10px;
}
.contact-popup-select > li .select-custom{margin-top: 0;}
.contact-popup-select > li .select-custom .select_tit,
.contact-popup-select .select-custom-list > li{
  height: 36px;
  white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.contact-popup-select .select-custom-list{top: 36px;}
.contant-input-wrap{margin-top: 4px;}
.contant-input-wrap > input{display: none!important;}
.contant-input-wrap > input.active{display: block!important;}
.popup-close{
  width: 36px;
  height: 36px;
  position: absolute;
  right: 0;
  top: -48px;
}
.popup-close img{width: 100%;height: 100%;}
.contact-popup-cont .popup-close{
  top: 10px;
  right: 10px;
}
.send-mail-btn{
  width: 120px;
  margin: 24px auto 0;
  background: #ddd;
  padding: 0 15px;
  color: #656565;
  border: 0;
}
/* progress bar */
.work-material-list{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.work-material-list > li{width: calc(100% / 2 - 12px);}
.work-material-list > li:nth-child(n + 3){margin-top: 40px;}
.work-material-info{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.work-material-info > h3{
  font-size: 20px;
  color: #ED1C24;
  font-weight: bold;
  font-family: 'Play', sans-serif;
}
.graph-table{
  display: flex;
  width: 100%;
}
.graph-table > li{width: calc(100% / 3);}
.graph-table > li:first-child{text-align-last: left;}
.graph-table > li:nth-child(2){text-align-last: center;}
.graph-table > li:last-child{text-align-last: right;}
.graph-name{
  font-weight: 600;
  display: flex;
  align-items: center;
}
.graph-name .graph-icon{
  width: 36px;
  height: 36px;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.steel-progress .graph-icon, .steel-progress .progress-wrap{background: #3399CC;}
.stainless-progress .graph-icon, .stainless-progress .progress-wrap{background: #FFCC00;}
.cast-progress .graph-icon, .cast-progress .progress-wrap{background: #FF0000;}
.non-progress .graph-icon, .non-progress .progress-wrap{background: #66CC33;}
.super-progress .graph-icon, .super-progress .progress-wrap{background: #FF6600;}
.high-progress .graph-icon, .high-progress .progress-wrap{background: #666666;}
.progress {
  width: 100%;
  height: 20px;
}
 
.progress-wrap {
  background: #f80;
  margin: 20px 0;
  overflow: hidden;
  position: relative;
  border-radius: 30px;
}
.progress-bar {
  background: #f4f4f4;
  left: 0;
  position: absolute;
  top: 0;
  transition: left 2s ease-in-out;
}
.work-material-list.active .progress-wrap.excellent .progress-bar {left: 100%;}
.work-material-list.active .progress-wrap.good .progress-bar {left: 50%;}
/* //progress bar */
@media (max-width: 1440px){
  .series-details-table::-webkit-scrollbar {display: block;}
}
@media (max-width: 768px){
  .table-info-inner .table-info-box {justify-content: center;}
  .series-details-top{flex-direction: column;}
  .series-details-info > span{font-size: 14px;}
  .series-details-maintit{font-size: 24px; margin-bottom: 12px; line-height: 1.34; padding-right:8%;}
  .series-detail-btns{
    margin-top: 50px;
    justify-content: space-between;
  }
  .series-detail-btns a.common-btn{width: calc(50% - 12px);}
  .series-details-bottom{margin-top: 22px;padding-top: 22px;}
  .series-details-img, .series-details-info{width: 100%;}
  .series-details-info{margin-top: 12px;}
  .series-details-table-info > div:first-child{
    width: 100%;
    flex-direction: column;
  }
  .series-details-table-info .select-custom,
  .series-details-table-info>div:first-child form{width: 100%;}
  .series-details-table-info>div:first-child form{margin-top: 4px;}
  .series-details-bottom .table-info-tit {margin-top: 12px;}
  .related-product-controls {display: none;}
  .related-product-slide {width: 100%}
  .table-info-inner .table-info-box div > span {display: none;}

  .contact-popup-cont {
    height: 80%;
    padding: 25px 12px;
  }
  .contact-popup-inner{
    height: 65%;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }  
  .contact-popup-inner::-webkit-scrollbar {display: none}
  .contact-popup-tit > p{width: 60%;text-align: center;margin: 10px auto 0;}
  /* progress bar */
  .work-material-list {flex-direction: column;}
  .work-material-list > li {width: 100%;}
  .work-material-list > li:nth-child(n + 3) {margin-top: 0;}
  .work-material-list > li:not(:first-child) {margin-top: 22px;}
  /* //progress bar */
}
/* ---------------------------- //series-details ---------------------------- */
/* ---------------------------- brand ---------------------------- */
.e-catalog-brand{width: calc(100% - 40px); max-width:1620px;display: flex; margin: 40px auto 0; gap: 3%;}

.e-catalog-brand-info{width: 100%;display: flex;align-items: flex-end;}
.e-catalog-brand-info .search-btn.common-btn{background: #222;color: #fff;}
.e-catalog-brand-info .search-btn.common-btn:hover{border-color: #ed1c24;background: #ed1c24;}
.e-catalog-brand-info .brand-select{display: flex;align-items: center;}
.e-catalog-brand-info .brand-select > li{width: 280px;margin-right: 8px;}
.e-catalog-brand-info .brand-select > li .select-custom{margin: 10px auto 0;}
.e-catalog-brand-info .brand-select > li .select-custom .select_tit{height: 44px;}
.e-catalog-brand-info .brand-select > li .select-custom .select-custom-list{top: 44px;}
.e-catalog-brand-info .brand-select > li .brand-select-tit{font-weight: 600;}
.e-catalog-brand-cont{margin-top: 24px;}
.empty-con{min-height: 500px;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.empty-con span{font-size: 20px;text-align: center;}
.e-catalog-brand-list{display: grid;grid-template-columns: repeat(2, 1fr);gap: 24px;}
.e-catalog-brand-list > li{border: 1px solid #eee;padding: 15px;display: flex;justify-content: space-between;position: relative; }
.e-catalog-brand-list > li .tag {border: 1px solid #C11C0F;background: #ED1C24;color: #fff;padding: 5px 10px;position: absolute;left: 0;top: 0;display: none;}
.e-catalog-brand-list > li.brand-list-new .tag{display: block;}
.e-catalog-brand-list > li .brand-list-img{width: calc(40% - 8px);max-width: 240px;margin-right: 16px;}
.e-catalog-brand-list>li .brand-list-img img{width: 100%; max-height: 260px;display: block;}
.e-catalog-brand-list > li .brand-list-info{display: flex;justify-content: space-between;flex-direction: column;width: calc(60% - 8px);}
.e-catalog-brand-list > li .brand-list-info-top {height: 100%; cursor: pointer;}
.e-catalog-brand-list > li .brand-list-info-top > h3{font-family: 'Play', sans-serif;font-size: 24px;font-weight: bold;}
.e-catalog-brand-list > li .brand-list-info-top > p{font-size: 14px;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden; -webkit-line-clamp:5}
.e-catalog-brand-list > li .brand-list-info-top > p .emphasis{font-size: 14px;font-weight: 600;display: block;}
.e-catalog-brand-list > li .brand-list-info-bottom{display: flex;justify-content: space-between;align-items: flex-end;}
.series-icon-list{display: flex;}
.series-icon-list > li{width: 36px;height: 36px;border-radius: 5px;background: #ddd;color: #fff;font-size: 20px;font-weight: 600;display: flex;align-items: center;justify-content: center;}
.add-explanation{display: flex;}
.series-icon-list > li:not(:last-child), .add-explanation li:not(:last-child){margin-right: 4px;}
.series-icon-list > li.active.icon-p{background: #3399CC;}
.series-icon-list > li.active.icon-m{background: #FFCC00;}
.series-icon-list > li.active.icon-k{background: #FF0000;}
.series-icon-list > li.active.icon-n{background: #66CC33;}
.series-icon-list > li.active.icon-s{background: #FF6600;}
.series-icon-list > li.active.icon-h{background: #666666;}
.add-explanation li{width: 36px;height: 36px;}
.add-explanation li .active-icon{display: none;}
.add-explanation li.active img{display: none;}
.add-explanation li.active img.active-icon{display: block;}

.e-catalog-brand-wrap {max-width: 1440px; width: 100%;margin: 0 auto; }
.cutting-type-wrap{
  position: sticky;
  top: 60px;
  left: 2%;
  height: 632px;
  width: 110px;
  min-width: 110px;
  z-index: 10;
  /* width: auto; */
}
.cutting-type-list-item{position: relative;}
.cutting-type-list-item:not(:first-child){margin-top: 8px;}

.depth-item{
  background: #F4F4F4;
  transition: all .35s;
}
.depth-item img {max-width: 120px; width: 100%; height: auto;}
.depth-item:hover, .depth-item.active{background-color: #222;}
.depth-item.active + .depth-2-wrap {display: block;}
.depth-2-wrap .depth-2.active + .depth-3-wrap{display: block;}

.cutting-type-list-item .depth-3:hover, 
.cutting-type-list-item .depth-3.active{font-weight: 600;}
/* Holemaking */
.cutting-type-list-item:nth-child(1) .depth-1:hover, 
.cutting-type-list-item:nth-child(1) .depth-1.active,
.cutting-type-list-item:nth-child(1) .depth-2:hover, 
.cutting-type-list-item:nth-child(1) .depth-2.active
{background-color: #812A9E;}

.cutting-type-list-item:nth-child(1) .depth-3:hover, 
.cutting-type-list-item:nth-child(1) .depth-3.active{
    background-color: #F5EFF7 !important;
    color: #812A9E !important;
}
/* Threading */
.cutting-type-list-item:nth-child(2) .depth-1:hover,
.cutting-type-list-item:nth-child(2) .depth-1.active,
.cutting-type-list-item:nth-child(2) .depth-2:hover,
.cutting-type-list-item:nth-child(2) .depth-2.active
{background-color: #00B2B2;}

.cutting-type-list-item:nth-child(2) .depth-2 > img,
.cutting-type-list-item:nth-child(2) .depth-2 > img{ 
    filter: invert(0);
}

.cutting-type-list-item:nth-child(2) .depth-3:hover,
.cutting-type-list-item:nth-child(2) .depth-3.active{
    background-color: #E2FAFB !important;
    color: #00B2B2 !important;
}
/* Milling */
.depth-slide-wrap .depth-slide .swiper-slide > a:hover,
.depth-slide-wrap .depth-slide .swiper-slide > a.active{
    background-color: #E1E9F6 !important;
    color: #1254B5 !important;
}

.depth-slide-wrap .depth-slide .swiper-slide > a:hover span:not(.list-item),
.depth-slide-wrap .depth-slide .swiper-slide > a.active span:not(.list-item){
    font-weight: 600;
    color: #1254B5 !important;
}

.cutting-type-list-item:nth-child(3) .depth-1:hover,
.cutting-type-list-item:nth-child(3) .depth-1.active{background-color: #1254B5;}

.cutting-type-list-item:nth-child(3) .depth-2:hover,
.cutting-type-list-item:nth-child(3) .depth-2.active,
.cutting-type-list-item:nth-child(3) .depth-3:hover,
.cutting-type-list-item:nth-child(3) .depth-3.active{
    background-color: #E1E9F6 !important;
    color: #1254B5 !important;
}
.cutting-type-list-item:nth-child(3) .depth-2:hover span,
.cutting-type-list-item:nth-child(3) .depth-2.active span{color: #1254B5;}
/* Turning */
.turning .work-material{display: none;}
.cutting-type-list-item:nth-child(4) .depth-1:hover,
.cutting-type-list-item:nth-child(4) .depth-1.active,
.cutting-type-list-item:nth-child(4) .depth-2:hover,
.cutting-type-list-item:nth-child(4) .depth-2.active{background-color: #F28E00;}

.cutting-type-list-item:nth-child(4) .depth-3:hover,
.cutting-type-list-item:nth-child(4) .depth-3.active{
    background-color: #FFEFD9 !important;
    color: #F28E00 !important;
}
/* Tooling System */
.cutting-type-list-item:nth-child(5) .depth-1:hover,
.cutting-type-list-item:nth-child(5) .depth-1.active,
.cutting-type-list-item:nth-child(5) .depth-2:hover,
.cutting-type-list-item:nth-child(5) .depth-2.active{background-color: #C11D20;}

.cutting-type-list-item:nth-child(5) .depth-3:hover,
.cutting-type-list-item:nth-child(5) .depth-3.active{
    background-color: #F8E8E8 !important;
    color: #C11D20 !important;
}

.depth-item:not(.no-filter) img{
  max-width: 120px; width: 100%; height: auto;
  filter: invert(100%);
  transition: all .35s;
}
.depth-1 > img {
  max-width: 88px !important; display: block; margin: 0 auto;
}
.depth-item:hover img, .depth-item.active img{filter: invert(0%);}
.contact-item .depth-item img.contact-active{display: none;}

.contact-item .depth-item:hover img.contact-inactive,
.contact-item .depth-item.active img.contact-inactive{display: none;}

.contact-item .depth-item:hover img.contact-active,
.contact-item .depth-item.active img.contact-active{display: block;}
.depth-item > span{
  font-size: 12px;
  color: #656565;
  display: block;
  transition: all .35s;
}
.depth-item:hover > span, .depth-item.active > span{
  font-weight: 600;
  color: #fff;
}
.depth-1{
  width: 110px;
  height: 110px;
  padding: 4px;
}
.depth-1 > span.depth-img{
  width: 80%;
  min-height: 70%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.depth-1 > span.depth-img > img{width: 100%;}
.depth-1 > span{
  text-align: center;
  margin-top: 8px;
}
.depth-2-wrap{
  position: absolute;
  left: 126px;
  top: 0;
  display: none;
}
.tooling-item .depth-2-wrap{
  top: auto;
  bottom: 0;
}
.depth-2-wrap.active, .depth-3-wrap.active{display: block;}
.depth-2-list, .depth-3-list{
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  gap: 6px;
}
.depth-2-list > li, .depth-3-list > li{
  position: relative;
} 
.depth-2, .depth-3{
    max-width: 250px;
    min-width: 250px;
    min-height: 52px;
    height: 52px;
    padding: 4px;
    display: flex;
    align-items: center;
    box-shadow: 5px 5px 5px 2px rgba(0,0,0,0.1);
  }
.depth-2 > img{height: 100%; max-width: 48px !important;}
.depth-2 > img, .depth-3 > img{
  display: block;
  margin-right: 12px;
}
.depth-2 > span, .depth-3 > span{color: #656565;}
.depth-2 > span{font-size: 14px;}
.depth-3 > span{font-size: 12px;}
.depth-3-wrap{
    position: absolute;
    left: 260px;
    top: 0;
    display: none;
}
.depth-3-wrap .depth-3{
    padding: 16px 26px;
}
.depth-slide-wrap{
  height: 284px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow-y:clip;
}
.depth-slide-wrap .swiper {overflow:unset;}
.depth-slide{
  height: 284px;
}
.depth-slide-wrap .depth-slide .swiper-slide{
  transition: background 0.35s;
}
.depth-slide-wrap .depth-slide .swiper-slide > a{
  background: #f4f4f4;
  width: 100%;
  min-width: 250px;
  height: 52px;
  min-height: 52px;
  padding: 4px;
  display: flex;
  align-items: center ;
  transition: background 0.35s;
}

.depth-slide-wrap .depth-slide .swiper-slide > a span:not(.list-item){
  font-size: 12px;
  color: #656565;
  transition: all .35s;
}
.depth-slide-wrap .depth-slide .swiper-slide:hover > a span:not(.list-item){
  font-weight: 600;
  /* color: #fff; */
}
.depth-slide-wrap .depth-slide .swiper-slide > a span.list-item,
.depth-slide-wrap .depth-slide .swiper-slide > a span.list-item img{
  display: block;
  height: 100%;
}
.depth-slide-wrap .depth-slide .swiper-slide > a span.list-item img{
  margin-right: 12px;
}
.depth-slide-wrap .swiper-button-next,
.depth-slide-wrap .swiper-button-prev{
  width: 36px;
  height: 36px;
  margin-top: 0;
  background: #F4F4F4 url(../../images/util-menu/slide-arrow.png) no-repeat center;
  border-radius: 50%;
  position: absolute;
}
.depth-slide-wrap .swiper-button-next::after,
.depth-slide-wrap .swiper-button-prev::after{display: none;}
.depth-slide-wrap .swiper-button-prev{
  top: -45px;
  /* left: 50%; */
  left: 108px;
  transform: rotate(180deg);
}
.depth-slide-wrap .swiper-button-next{
  top: auto;
  right: auto;
  bottom: -45px;
  left: 108px;
}

.cutting-type-controls{
    width: 70px;
    height: 20px;
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    background: url(../../images/util-menu/controls-shapes.png) no-repeat center top;
    text-indent: -9999em;
    cursor: pointer;
    display: none;
  }
  .cutting-type-controls::after{
    content: '';
    width: 24px;
    height: 24px;
    background: url(../../images/select-arrow-active.png) no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(180deg);
  }
 .cutting-type-controls.active::after{transform: translate(-50%, -50%);}
 .cutting-type-controls + span{
    font-size: 14px;
    text-align: center;
    display: none;
    margin-bottom: 10px;
    color: #656565;
 }

@media (max-width: 1280px){
  .e-catalog_series-wrap {margin: 0 auto;}
  .e-catalog-box{width: 100%;}
  .table-info-inner .table-info-box {width: calc(100vw - 100px);}

  .result-cont{
    position: static;
  }
  .depth-1 > span.depth-img{
    min-height: auto;
    height: 100%;
    width: 120px;
    margin: 0;
    margin-right: 12px;
  }
  .depth-1 > span.depth-img > img{
    width: auto;
    height: 100%;
  }
  .contact-item .depth-1 > span.depth-img > img{height: auto;}
  .cutting-type-controls{display: block;}
  .cutting-type-controls + span{display: block;}
  .str-wrap{height: auto;}
  .cutting-type-wrap{
    position: fixed;
    bottom: 16px;
    top: auto;
    left: 0;
    z-index: 99;
    width: 100%;
    height: 70vh;
    background: #fff;
    padding: 10px 0 22px;
    box-shadow: 5px 5px 5px 5px rgb(0 0 0 / 20%);
    transform: translateY(96%);
    transition: transform .35s; 
  }
  .mobile-quick-bg{
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    position: absolute;
    top: 0;
    left: 0;
    display: none;
  }
  .mobile-quick-bg.active{display: block;}
  .cutting-type-wrap.active{transform: translateY(0);bottom: 0;}
  .depth-2-wrap, .depth-3-wrap{position: static;}
  .depth-2-wrap{
    width: 95%;
    margin: 4px 0 0 auto;
  }
  .depth-slide-wrap{
    height: auto;
  }
  .depth-slide-wrap .swiper-wrapper {display:block;transform: translate3d(0px, 0px, 0px) !important;}
  .depth-slide-wrap .swiper-wrapper .swiper-slide {margin-bottom: 7px;}
  .depth-slide-wrap .swiper-wrapper .swiper-slide:last-child {margin-bottom:0;}
  .depth-slide-wrap .swiper-button-prev, .depth-slide-wrap .swiper-button-next{display: none;}
  .depth-2-list, .depth-3-list{height: auto;gap: 4px;}
  .depth-2, .depth-3{
    box-shadow: none;
    max-width: 100%;
    height: 60px;
  }
  .depth-2.icon-depth{height: 80px;}
  .depth-3-wrap .depth-3{padding: 18px 12px;}
  .depth-1{
    width: 100%;
    height: 110px;
    display: flex;
    align-items: center;
  }
  .depth-item {
    background-image: url(../../images/e-catalog_arrow.png);
    background-repeat: no-repeat;
    background-position: 98% center;
    background-size: 20px 20px;
  }
  .depth-item.active, .depth-item:hover {
    background-image: url(../../images/e-catalog_arrow-active.png);
  }
  .depth-1 > img{
    width: auto;
    height: 100%;
    margin: 0;
    margin-right: 12px;
  }
  .depth-3-wrap{
    margin: 4px 0 0 auto;
    width: 95%;
  }
  /* .depth-2-list > li:not(:first-child), .depth-3-list > li:not(:first-child){margin-top: 4px;} */
  .depth-slide{
    width: 100%;
    height: auto;
  }
  .depth-slide-wrap .depth-slide .swiper-slide{
    width: 100%;
    height: auto !important;
  }
  .depth-slide-wrap .depth-slide .swiper-slide .depth-3-list > li:not(:first-child){margin-top: 0;}
  .depth-slide-wrap .depth-slide .swiper-slide > a{
    height: 60px;
    gap: 4px;
  }
  .cutting-type-list{
    width: calc(100% - 40px);
    height: 95%;
    margin: 0 auto;
    overflow-x: auto;
  }
  .cutting-type-list::-webkit-scrollbar {width: 5px;}
  .cutting-type-list::-webkit-scrollbar-thumb {
    background-color: #e6e6e6;
  }
  .cutting-type-list::-webkit-scrollbar-track {background-color: #aaa;}
}

@media (max-width: 1200px){
  .e-catalog-brand-info, .e-catalog-brand-info .brand-select{ width: 100%; flex-direction: column; margin: 0 auto;}
  .e-catalog-brand-info .brand-select{width: 100%;}
  .e-catalog-brand-info .brand-select > li{width: 100%;margin-right: 0;}
  .e-catalog-brand-info .brand-select > li:not(:first-child), .e-catalog-brand-info .search-btn.common-btn{margin-top: 10px;}
  .e-catalog-brand-list > li{flex-direction: column;}
  .e-catalog-brand-list > li .brand-list-info{width: 100%;min-height: 290px;margin-top: 16px;}
  .e-catalog-brand-list > li .brand-list-info-bottom{flex-direction: column;align-items: flex-start;}
  .add-explanation{margin-top: 4px;}
  .e-catalog-brand-list > li .brand-list-img{width: 100%;max-width: 100%;margin-right: 0;}
}
@media (max-width: 768px){
  .e-catalog-brand-list{grid-template-columns: repeat(1, 1fr);}
  .empty-con{min-height: 274px;}
  .empty-con span{font-size: 14px;}
}
/* ---------------------------- //brand ---------------------------- */
/* ---------------------------- series cont ---------------------------- */
.series-cont .logo{
    max-width: 182px;
    margin: 0 auto;
    display: block;
}
.series-cont .logo img{width: 100%;}
.series-cont .series-list{
    margin-top: 80px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.series-cont .series-list > li{  
    width: calc(100% / 3 - 24px);
    /*flex: 1 1 33%;*/
    padding: 28px 24px;
    min-height: 480px;
}
.series-cont .series-list > li:first-child{
    background: #ED1C24 url(/resources/front/images/resources/e-catalog-img.png) no-repeat center bottom / 60%;
}
.series-cont .series-list > li:nth-child(2){
    background: #1976BC url(/resources/front/images/resources/str-img.png) no-repeat center bottom -30px / 60%;
}
.series-cont .series-list > li:last-child{
    background: #00AEA4 url(/resources/front/images/resources/xpert-img.png) no-repeat center bottom / 60%;
}
.series-cont .series-list > li a{
    width: 100%;
    height: 100%;
    color: #fff;
    text-align: center;
}
.series-cont .series-list .series-tit{
    min-height: 96px;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.series-cont .series-list .series-tit strong{
    font-family: 'Play',sans-serif;
    width: 100%;
    font-size: 40px;
    font-weight: bold;
    line-height: 1;
    letter-spacing: -0.02em;
    word-break: break-word;
}
.series-cont .series-list > li a > p{
    font-size: 14px;
    line-height: 20px;
}
.series-cont .sns-list{
    display: flex;
    justify-content: center;
    gap: 10px;
    margin: 80px 0 10px;
}
.series-cont .sns-list + span{
    font-size: 14px;
    letter-spacing: -0.02em;
    line-height: 32px;
    text-align: center;
    display: block;
}
.series-cont .sns-list li{
    width: 42px;
    height: 42px;
}
.series-cont .sns-list li a{
    width: 100%;
    height: 100%;
}
@media (max-width: 920px){
    .series-cont .series-list{
        flex-direction: row;
    }
    .series-cont .series-list > li{
        width: 100%;
        min-height: 362px;
        padding: 36px 20px;
    }
    .series-cont .series-list > li:first-child{
        background: #ED1C24 url(/resources/front/images/resources/e-catalog-img.png) no-repeat center bottom -10px/ 204px 204px;
    }
    .series-cont .series-list > li:nth-child(2){
        background: #1976BC url(/resources/front/images/resources/str-img.png) no-repeat center bottom -28px / 230px 230px;
    }
    .series-cont .series-list > li:last-child{
        background: #00AEA4 url(/resources/front/images/resources/xpert-img.png) no-repeat center bottom / 204px 206px;
    }
    .series-cont .series-list .series-tit{
        margin-bottom: 10px;
        min-height: 70px;
    }
    .series-cont .series-list .series-tit strong{
        font-size: 30px;
        line-height: 1;   
    }
}
/* ---------------------------- //series cont ---------------------------- */