@charset "utf-8";
:root {
	--box-shadow: 0 0 16px rgba(0, 0, 0, .05);
}

@keyframes fadeIn {0% {opacity: 0;} 100% {opacity: 1;}}
@keyframes fadeOut {0% {opacity: 1;} 100% {opacity: 0;}}
@keyframes widthMove {100% {width: 100%;}}

.container .tab_wrap .tab_box {display: none;}
.container .tab_wrap .tab_box.active {display: block; animation: upMove 1s ease both;}
.container .tab_list {position: relative;}
.container .tab_list .list {display: flex; position: relative; z-index: 1;}
.container .tab_list .bg {position: absolute; opacity: 0; transition: .5s ease;}
.container .tab_list.type1 .bg {left: 0; width: 20px; height: 20px;}
.container .tab_list.type1 .bg:before, .container .tab_list.type1 .bg:after {content: ""; position: absolute; width: 8px; height: 8px; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; background: var(--color-primary);}
.container .tab_list.type1 .bg:after {width: 100%; height: 100%; filter: blur(7px); animation: tab_list_bg 1s ease both infinite alternate;}
@keyframes tab_list_bg {50% {transform: translate(-50%, -50%); opacity: 1;} 100% {transform: scale(.8) translate(-50%, -50%); opacity: .5;}}
.container .tab_list.type1 > ul {display: flex; flex-direction: column; margin-top: -.45rem;}
.container .tab_list.type1 > ul > li {padding-left: 1.5rem; position: relative; transition: .5s ease;}
.container .tab_list.type1 > ul > li > a {color: #ffffff60; font-weight: 500; width: 100%; padding: .45rem 0;}
.container .tab_list.type1 > ul > li.active > a {color: var(--color-secondary);}
.container .tab_list.type2 > ul {gap: .5rem 1.35rem; flex-wrap: wrap; justify-content: center;}
.container .tab_list.type2 > ul li:not(.active) a {color: #ffffff60; font-weight: 300;}

.container .arrow-btn {cursor: pointer;} 
.container .arrow-btn .icon {width: 12px; height: 30px; background: url(../../images/ico-slide-arrow.svg) no-repeat center / contain; transition: .5s ease;}
.container .arrow-btn .icon:after {content: ""; position: absolute; width: 2.4rem; height: 2.4rem; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); border: 1px solid var(--color-primary); border-radius: 50%; z-index: -1;}
.container .arrow-btn.next-btn .icon{background-image: url(../../images/ico-slide-arrow-right.svg)}
.container .swiper-pagination {position: static; transform: none; display: flex; flex-wrap: wrap; gap: .3rem .55rem; align-items: center; justify-content: center;}
.container .swiper-pagination-bullet {background: #ffffff60; border: 2px solid transparent; width: 8px; height: 8px; box-sizing: border-box; margin: 0px !important; transition: .5s ease;}
.container .swiper-pagination-bullet-active {width: 12px; height: 12px; border-color: #fff; background: transparent;}



/* 메인 --------------------------------------- */
.main {overflow-x: hidden;}
.main .more-btn {position: relative; padding: 1.35rem 2.2rem; border-radius: 6rem; border: 1px solid #ffffff; display: flex; align-items: center; justify-content: center; overflow: hidden;}
.main .more-btn:after {content: ""; position: absolute; width: 26rem; height: 26rem; border-radius: 50%; left: -13rem; bottom: -13rem; background: #fff; transform: scale(0); opacity: 0; z-index: -1; transition: .6s ease;}
.main .more-btn span {transition: .5s ease;}
.main .section {opacity: 0; transition: .5s ease;}
.main .section.show {opacity: 1;}
.main .main_navigation {position: fixed; top: 50%; right: 1.6%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; gap: 2.2rem; z-index: 40;}
.main .main_navigation .list {display: flex; flex-direction: column; gap: .55rem; align-items: center;}
.main .main_navigation .list li {position: relative; width: 8px; height: 8px; transition: .5s ease; background: #ffffff60; border: 2px solid transparent; border-radius: 50%; box-sizing: border-box; width: 8px; height: 8px; transition: .5s ease;}
.main .main_navigation .list li.active {width: 12px; height: 12px; border-color: #fff; background: transparent;}
.main .main_navigation .list li a {position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 3px;}
.main .main_navigation .page-name-box {display: flex; align-items: center; writing-mode: vertical-rl; gap: .2rem; pointer-events: none;}
.main .main_navigation .page-name-box .page-name {text-transform: uppercase;}

.main .section01 {position: relative; height: calc(100 * var(--vh)); min-height: 47rem;}
.main .section01 .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1;}
.main .section01 .bg div.circle {position: absolute; height: clamp(0px, 60vw, 100vh); width: clamp(0px, 60vw, 100vh); border-radius: 50%; transform: rotate(45deg) translateY(-50%); animation: clip_path_width 2s cubic-bezier(0.52, -0.02, 0.51, 1.07) both; top: 50%; transform-origin: center 0;}
.main .section01 .bg div.circle1 {left: 0;}
.main .section01 .bg div.circle1:before, .main .section01 .bg div.circle1:after {content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; border-radius: 50%;}
.main .section01 .bg div.circle1:before {background: radial-gradient(circle at 66% 37%, #f25c05 0%, #f25c0530 39%, #f25c0500 100%); opacity: .6;}
.main .section01 .bg div.circle1:after {border: 1px solid transparent; background-image: linear-gradient(var(--black), var(--black)), linear-gradient(270deg, #F25C05 0%, #F25C0500 100%); background-origin: border-box; background-clip: content-box, border-box; z-index: -1; box-sizing: border-box;}
.main .section01 .bg div.circle2 {border-radius: 50%; border: 1px solid #f25c05; left: 28%; box-sizing: border-box; animation-delay: .7s; animation-duration: 1.5s;}
.main .section01 .inner {display: flex; align-items: center; height: 100%; gap: 6.5%; padding-left: calc(30px + 6%); padding-right: calc(30px + 6%);}
.main .section01 .inner .img-box {display: flex; align-items: flex-end; width: clamp(300px, 37vw, 680px); flex: none;}
.main .section01 .inner .img-box figure {position: relative;}
.main .section01 .inner .img-box figure:after {content: ""; position: absolute; width: 100%; height: 19px; background: var(--black); bottom: -7%; left: 50%; transform: translateX(-50%) scale(0); border-radius: 50%; filter: blur(12px); z-index: -1;}
.main .section01 .inner .img-box .img1 {margin-bottom: 2%; position: relative; max-width: 245px; width: 40%; z-index: 1;}
.main .section01 .inner .img-box .img2 {position: relative; left: -11%; max-width: 515px; width: 71%;}
.main .section01 .inner .text-box {display: flex; flex-direction: column; gap: 1.35rem; max-width: 30rem; width: 100%; line-height: 1.6;}
.main .section01 .inner .text-box .top {display: flex; flex-direction: column; gap: .5rem;}
.main .section01 .inner .text-box .top .top-small {font-size: clamp(1rem, 2vw, 1.35rem); color: var(--color-primary); font-weight: 700;}
.main .section01 .inner .text-box .top .logo {max-width: 70%;}
.main .section01 .inner .text-box .top .title {font-weight: 200; font-size: clamp(1.6rem, 4.5vw, 3.5rem); max-width: 9em;}
.main .section01 .inner .text-box .bot-small {font-size: .9rem; font-weight: 300; color: #ffffff80; letter-spacing: 0;}
.main .section01 .scroll-down {position: fixed; bottom: clamp(1rem, 5.5vw, 2.5rem); left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: .8rem; text-align: center; transition: 1s ease; z-index: 5;}
.main .section01 .scroll-down:after {content: ""; position: absolute; width: 100vw; min-width: 320px; left: 50%; transform: translateX(-50%); bottom: calc(-1 * clamp(1rem, 5.5vw, 2.5rem)); height: 9rem; background: linear-gradient(transparent, var(--black) 80%); z-index: -1; pointer-events: none;}
.main .section01 .scroll-down .text {font-weight: 300; text-transform: uppercase;}
.main .section01 .scroll-down .text span {animation: main_scrolldown_text 4s ease both infinite;}
@keyframes main_scrolldown_text {15% {opacity: .2} 30%, 100% {opacity: 1;}}
.main .section01 .scroll-down .icon {animation: main_scrolldown_icon 4s ease both infinite;}
@keyframes main_scrolldown_icon {15%, 45% {transform: translateY(10px); opacity: .4;} 30%, 60%, 100% {transform: none; opacity: 1;}}
.main:has(.section02.show) .section01 .scroll-down {opacity: 0; z-index: -10000; pointer-events: none;}
.main .section01 .inner .img-box figure img {animation: scaleMove 1s .1s ease both}
.main .section01 .inner .img-box figure.img2 img {animation-delay: .25s;}
.main .section01 .inner .text-box .top > * {animation: rightMove 1s ease both;}
.main .section01 .inner .text-box .bot-small {animation: rightMove 1s .4s ease both;}
.main .section01 .inner .img-box figure {animation: main_sec01_img_move 5s 2s ease both infinite;}
.main .section01 .inner .img-box .img2 {animation-delay: 3.5s;}
@keyframes main_sec01_img_move {35% {transform: translateY(-20px);} 10%, 60%, 100% {transform: none;}}
.main .section01 .inner .img-box figure:after {animation: main_sec01_img_move_shadow 5s 2s ease both infinite;}
.main .section01 .inner .img-box .img2:after {animation-delay: 3.5s;}
@keyframes main_sec01_img_move_shadow {35% {transform: translate(-50%, 20px) scale(1); opacity: .5;} 10%, 60%, 100% {transform: translateX(-50%) scale(0); opacity: 0;}}

.main .section02 .tab_wrap {display: flex; gap: 3%; align-items: center;}
.main .section02 .tab_wrap .left-box {position: relative; padding-top: 6.6rem; padding-bottom: 6.6rem; padding-left: 5.2%; padding-right: 1.6%; width: clamp(13rem, 25vw, 305px); flex: none; box-sizing: border-box;}
.main .section02 .tab_wrap .left-box:after {content: ""; position: absolute; width: 1px; height: 100%; right: 0; top: 0; background: linear-gradient(#F25C0510 0%, #F25C05 40%, #fff, #F25C05 60%, #F25C0510 100%); animation: clip_path_height 2s ease both;}
.main .section02 .tab_wrap .center-box .tab_box {flex-direction: column; gap: 3.3rem;}
.main .section02 .tab_wrap .center-box .tab_box.active {display: flex;}
.main .section02 .tab_wrap .center-box .tab_box .title-box {display: flex; flex-direction: column; gap: .5rem;}
.main .section02 .tab_wrap .center-box .tab_box .title-box .cate {color: #F25C05; font-size: 1.1rem;}
.main .section02 .tab_wrap .center-box .tab_box .title-box .title {font-size: clamp(1.6rem, 2vw, 2rem);}
.main .section02 .tab_wrap .center-box .tab_box .text-box {color: #ffffff60; line-height: 1.7;}
.main .section02 .tab_wrap .center-box .tab_box .list {display: flex; gap: 5%; align-items: flex-end;}
.main .section02 .tab_wrap .center-box .tab_box .list li {width: calc(100% / 4  - (5% / 4) * 3); display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: .9rem; text-align: center; height: clamp(6rem, 14vw, 13.8rem);}
.main .section02 .tab_wrap .right-box {width: clamp(200px, 43vw, 815px); flex: none; border-radius: 15rem 0 0 15rem; overflow: hidden; height: clamp(200px, 42vw, 580px)}
.main .section02 .tab_wrap .right-box figure {height: 100%;}
.main .section02 .tab_wrap .right-box figure img {height: 100%; width: 100%; object-fit: cover;}
.main .section02.show .tab_wrap .left-box .bg {animation: opacityMove 1s 1s ease both;}
.main .section02.show .tab_wrap .center-box .tab_box .title-box > * {animation: upMove 1s ease both;}
.main .section02.show .tab_wrap .center-box .tab_box .title-box .title {animation-delay: .1s;}
.main .section02.show .tab_wrap .center-box .tab_box .text-box {animation: upMove 1s .2s ease both;}
.main .section02.show .tab_wrap .center-box .tab_box .list {animation: upMove 1s .3s ease both;}
.main .section02.show .tab_wrap .right-box {animation: clip_path_circle_right_bottom 2s .1s ease both}

.main .section03 {position: relative; overflow: hidden;}
.main .section03 .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; background: url(../../images/main_sec03_bg.jpg) no-repeat center / cover; background-attachment: fixed;}
.main .section03 .bg:after {content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #11111130;}
.main .section03 .list {display: flex;}
.main .section03 .list li {position: relative; width: 100%; display: flex; flex-direction: column; gap: 3.3rem; align-items: center; justify-content: center; height: clamp(26rem, 45vw, 33rem); padding: 1rem; box-sizing: border-box; transition: .5s ease;}
.main .section03 .list li:not(:last-child) {border-right: 1px solid #fff;}
.main .section03 .list li:before, .main .section03 .list li:after {content: ""; position: absolute; width: 100%; height: 100%; background: #11111130; transition: 1s ease; z-index: -1;}
.main .section03 .list li:before {top: 0; left: 0;}
.main .section03 .list li:after {bottom: 0; right: 0;}
.main .section03 .list li .text-box {display: flex; flex-direction: column; gap: .55rem; text-align: center;}
.main .section03 .list li .text-box .title {font-size: 2rem;}
.main .section03 .list li .text-box .text {font-size: 1.1rem; display: none;}
.main .section03 .list li .more-btn {display: none;}
.main .section03 .list li:before {clip-path: polygon(0 0, 0 0, 0 0);}
.main .section03 .list li:after {clip-path: polygon(100% 100%, 100% 100%, 100% 100%);}
.main .section03.show .bg {animation: main_section03_bg 2s ease both;}
@keyframes main_section03_bg {0% {filter: blur(15px); clip-path: circle(0% at 50% 0);} 100% {filter: blur(0px); clip-path: circle(100% at 50% 0);}}
.main .section03.show .list li {animation: opacityMove 1s .5s ease both;}

.main .section04 .tab_wrap {padding: clamp(4.4rem, 15vw, 6.6rem) 0; display: flex; flex-direction: column; gap: 2.2rem;}
.main .section04 .top-box {display: flex; flex-direction: column; gap: 1.35rem; text-align: center; padding: 0 30px;}
.main .section04 .top-box .title-box {display: flex; flex-direction: column; gap: 4px;}
.main .section04 .top-box .title-box .cate {font-weight: 900;}
.main .section04 .top-box .title-box .title {font-size: clamp(1.75rem, 4.5vw, 2rem);}
.main .section04 .top-box .title-box .title strong {color: var(--color-primary);}
.main .section04 .tab_box {flex-direction: column; gap: 2.2rem;}
.main .section04 .tab_box.active {display: flex;}
.main .section04 .tab_box > * {opacity: 0;}
.main .section04 .product-swiper {position: relative; padding: 0 5.2%;}
.main .section04 .product-swiper .swiper {width: 100%; padding: 2rem 0; margin: -2rem 0;}
.main .section04 .product-swiper .swiper .swiper-slide a {display: flex; flex-direction: column; align-items: center; gap: 1.35rem;}
.main .section04 .product-swiper .swiper .swiper-slide .img img {transition: .5s ease;}
.main .section04 .product-swiper .swiper .swiper-slide .item-name {position: relative; text-align: center;}
.main .section04 .product-swiper .swiper .swiper-slide .item-name:after {content: ""; position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); padding: .2rem .4rem; border-radius: 5px; background: var(--color-secondary); opacity: 0; z-index: -1; transition: .5s ease;}
.main .section04 .product-swiper .arrow-btn {position: absolute; top: 50%; transform: translateY(-50%);}
.main .section04 .product-swiper .arrow-btn.prev-btn {left: 4%;}
.main .section04 .product-swiper .arrow-btn.next-btn {right: 4%;}
.main .section04 .more-btn {display: inline-flex; margin: 0 auto;}
.main .section04.show .top-box .title-box > * {animation: upMove 1s ease both;}
.main .section04.show .top-box .title-box .title {animation-delay: .1s; animation-name: rotateXMove;}
.main .section04.show .top-box .list li {animation: clip_path_width 1s ease both;}
.main .section04.show .tab_box.active > * {animation: upMove 1s ease both;}
.main .section04.show .tab_box.active .more-btn {animation-name: scaleMove;}

.main .section05 {position: relative;}
.main .section05 .inner {padding-top: 4.4rem; padding-bottom: 4.4rem;}
.main .section05 .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; transition: .5s ease; overflow: hidden;}
.main .section05 .bg img {width: 100%; height: 100%; object-fit: cover;}
.main .section05 .inner {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.35rem;}
.main .section05 .inner .title {font-size: 1.5rem; font-weight: 300; overflow: hidden;}
.main .section05 .inner .title > p {transform: translateY(100%);}
.main .section05 .inner .contact {display: flex; align-items: center; gap: 1.6rem; font-size: 1.1rem;}
.main .section05 .inner .contact li {display: flex; align-items: center; gap: .5rem; padding: 0 5px; margin: 0 -5px;}
.main .section05 .inner .contact li .cate {font-weight: 900;}
.main .section05 .inner .contact li .detail {font-weight: 300; position: relative;}
.main .section05 .inner .contact li a.detail:after {content: ""; position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); padding: 3px 5px; background: var(--color-secondary); opacity: 0; z-index: -1; transition: .5s ease;}
.main .section05.show .bg {animation: clip_path_circle_center 2s ease both;}
.main .section05.show .bg img {animation: imgBlurMove 2s ease both;}
.main .section05.show .inner .title > p {animation: upMove100 1s .1s ease both;}
.main .section05.show .inner .contact li {animation: clip_path_width 1.2s .2s ease both;}


/* 서브 --------------------------------------- */
.subTop {position: relative; padding-top: calc(var(--header-height) + var(--header-top)); height: 18rem; box-sizing: border-box; transition: .5s ease;}
.subTop .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.subTop .bg img {width: 100%; height: 100%; object-fit: cover;}
.subTop .bg:before, .subTop .bg:after {content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #00000030; animation: heightMove0 1s ease both;}
.subTop .bg:after {animation-delay: .1s;}
.subTop .inner {height: 100%; display: flex; align-items: center; justify-content: center; position: relative; z-index: 1;}
.subTop .inner .sub-title {position: relative; font-size: 2.2rem; text-align: center; font-weight: 600; background: linear-gradient(#ffffff60 0%, transparent 100%); background-clip: text; -webkit-background-clip: text; color: transparent; overflow: hidden;}
.subTop .inner .sub-title:after {content: attr(data-text); position: absolute; width: 100%; height: 100%; color: #fff; text-align: center; top: 100%; left: 50%; transform: translateX(-50%); animation: sub_title_after 1s cubic-bezier(0.68, 0.01, 0.25, 1) both;}
@keyframes sub_title_after {0% {top: 100%;} 100% {top: 0;}}
header.scroll + .container .subTop {filter: blur(15px)} 

.subPage {padding: 5.3rem 0;}
.subPage .inner:has(.local_navigation-wrap) {display: flex; gap: 2.6rem;}
.subPage .inner .local_navigation-wrap {position: relative; width: clamp(200px, 17vw, 240px); flex: none;}
.subPage .inner .local_navigation-wrap:after {content: ""; position: absolute; width: 1px; height: 100%; right: 0; top: 0; background: linear-gradient(#F25C0510 0%, #F25C05 40%, #fff, #F25C05 60%, #F25C0510 100%); animation: clip_path_height 2s ease both;}
.subPage .inner .local_navigation-wrap .bg {animation: opacityMove 1s 1s ease both;}

.subPage .text-type1 {display: flex; flex-direction: column; gap: .5rem;}
.subPage .text-type1 .small {font-size: 1.1rem;}
.subPage .text-type1 .big {font-size: clamp(1.75rem, 4.5vw, 2rem); line-height: 1.3;}
.subPage .text-type1 .big span {display: inline;}
.subPage .text-type1 .point {color: var(--color-secondary);}
.subPage .text-type1.show > * {animation: upMove 1s ease both;}
.subPage .text-type1.show:after {animation: clip_path_width_center 1s .1s ease both;}
.subPage .title-point {margin-bottom: 1.7rem;}
.subPage .title-point h3 {overflow: hidden; position: relative; display: inline-block; color: #ffffff01; font-size: 1.35rem; font-weight: 700;}
.subPage .title-point h3:after {content: attr(data-text); position: absolute; top: 0; left: 0; color: var(--color-point); text-align: center; transform: translateY(100%); transition: 1s ease;}
.subPage .title-point:after {content: ""; display: block; width: 20px; height: 4px; background: url(../../images/title-point-circle.svg) no-repeat center / contain; margin: .5rem auto 0;}
.subPage .show .title-point h3:after {transform: none;}
.subPage .show .title-point:after {animation: clip_path_width_center 1s .1s ease both;}

.sub .content {width: 100%; display: flex; flex-direction: column; gap: 3.5rem;}
.sub .content .sub-title {background: var(--color-primary); color: #fff; width: 100%; font-size: clamp(1.35rem, 2vw, 2.0rem); font-weight: 700; padding: .6em clamp(1.0rem, 4%, 4%); box-sizing: border-box; border-radius: 5rem; animation: clip_path_width 2s cubic-bezier(0.85, 0.44, 0.11, 0.99) both;}
.sub .content > .box-wrap {display: flex; flex-direction: column; gap: 3.3rem;}
.sub .content > .inner2 {max-width: 960px; width: 100%; margin: 0 auto; display: flex; flex-direction: column; gap: 3.5rem; text-align: center;}
.sub .content > .box-wrap > *, .sub .content > .inner2 > * {opacity: 0; transition: 1s ease;}
.sub .content > .box-wrap > *.show, .sub .content > .inner2 > *.show {opacity: 1;}

.sub .table-box {border-radius: 8px; border: 1px solid #ffffff60;}
.sub .table-box.scroll {overflow-x: auto;}
.sub .table-box table thead, .sub .table-box table tr:not(:last-child) {border-bottom: 1px solid #ffffff60;}
.sub .table-box table tr > * {padding: .46rem; box-sizing: border-box; border-left: 1px solid #ffffff60; vertical-align: middle;}
.sub .table-box table tr > *:first-child {border-left: none;}
.sub .table-box table tbody tr th {border-right: 1px solid #ffffff60;}
.sub .table-box table tbody td .mo-th {display: none;}

.sub .dot-list {display: flex; flex-direction: column; gap: .3rem;}
.sub .dot-list p {display: flex; gap: .7rem;}
.sub .dot-list p:before {content: ""; display: inline-block; width: .3rem; height: .3rem; border-radius: 50%; background: #fff; transform: translateY(.65rem);}

/* CEO 인사말 */
.ceo_greetings .box-wrap {gap: 3.5rem; align-items: center;}
.ceo_greetings .text-box {display: flex; flex-direction: column; gap: 1.7rem; line-height: 1.5; max-width: 960px; width: 100%;}
.ceo_greetings .logo {width: clamp(180px, 35vw, 640px);}
.ceo_greetings .name-box {display: flex; flex-direction: column; gap: .5rem;}
.ceo_greetings .name-box .name {font-size: 1.35rem;}
.ceo_greetings .text-box.show > p {animation: upMove 1s .1s ease both;}
.ceo_greetings .logo.show {animation: scaleMove 1s .1s ease both;}

/* 회사 연혁 */
.history .box-wrap .text-type1:after {content: ""; display: block; width: 100%; height: 1px; background: linear-gradient(90deg, #ffffff00 0%, #ffffff 40%, #ffffff00 100%); margin-top: 3.3rem;}
.history .box-wrap .year-box {display: flex; flex-direction: column; gap: 3.3rem;}
.history .box-wrap .year-box > li {display: flex; flex-direction: column; gap: 1.7rem; opacity: 0; transition: .5s ease;}
.history .box-wrap .year-box > li .year {font-size: clamp(1.75rem, 4.5vw, 2rem); font-weight: 800;}
.history .box-wrap .year-box > li .list-box {display: flex; gap: 1rem;}
.history .box-wrap .year-box > li .list-box ul {width: 100%; display: flex; flex-direction: column; gap: .9rem;}
.history .box-wrap .year-box > li .list-box ul li {display: flex; gap: 5%;}
.history .box-wrap .year-box > li .list-box ul li .date {color: var(--color-secondary); width: 4rem; flex: none;}
.history .box-wrap .year-box > li .list-box ul li .detail {width: 100%; display: flex; flex-direction: column; gap: .9rem;}
.history .box-wrap .year-box > li.show {opacity: 1;}
.history .box-wrap .year-box > li.show .year {animation: rotateXMove 1s .1s ease both;}
.history .box-wrap .year-box > li.show .list-box ul li {animation: clip_path_width 1.5s .1s ease both;}

/* 인증 및 수상 */
.certifications .box-wrap .img-list {display: flex; gap: 2.6%;}
.certifications .box-wrap .img-list li {width: 100%;}
.certifications .box-wrap .img-list li figure {padding-bottom: 100%; position: relative; background: #fff; border-radius: 1.6rem;}
.certifications .box-wrap .img-list li img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: contain; max-width: 65%; max-height: 65%;}
.certifications .box-wrap .license-list:before {content: ""; display: block; width: 100%; height: 1px; background: linear-gradient(90deg, #ffffff00 0%, #ffffff 40%, #ffffff00 100%); margin-bottom: 3.3rem;}
.certifications .box-wrap .license-list {display: flex; flex-wrap: wrap; gap: 1.7rem 1.1rem;}
.certifications .box-wrap .license-list > li {width: calc(100% / 3 - (1.1rem / 3) * 2); display: flex; flex-direction: column; gap: .9rem; cursor: pointer;}
.certifications .box-wrap .license-list > li > .license-title {display: flex; align-items: center; justify-content: center; gap: .4rem; border-radius: 8px; color: var(--color-secondary); border: 1px solid; padding: .5rem; height: 3.3rem; box-sizing: border-box; text-align: center; line-height: 1.2;}
.certifications .box-wrap .license-list > li > .license-title:before {content: ""; display: inline-block; width: 1.1rem; height: 1.1rem; background: url(../../images/ico-license.svg) no-repeat center / contain;}
/*.certifications .box-wrap .license-list > li:nth-child(2) {margin-right: 5%;}*/
.certifications .box-wrap .license-list .list-text {display: flex; flex-wrap: wrap; gap: .9rem;}
.certifications .box-wrap .license-list .list-text li {width: calc(50% - .45rem); font-size: .9rem; border: 1px solid; border-radius: 8px; text-align: center; padding: .65rem .5rem; box-sizing: border-box;}
.certifications .box-wrap .img-list.show li {animation: rotateXMove 1s ease both;}
.certifications .box-wrap .license-list.show > li {animation: clip_path_width 1s ease both;}

/* 조직도 */
.organization .box-wrap .text-type1:after {content: ""; display: block; width: 100%; height: 1px; background: linear-gradient(90deg, #ffffff00 0%, #ffffff 40%, #ffffff00 100%); margin-top: 3.3rem;}
.organization .box-wrap .organization-list {max-width: 996px; width: 100%; margin: 0 auto;}
.organization .box-wrap .organization-list > li {display: flex; flex-direction: column; gap: 2.6rem; align-items: center;}
.organization .box-wrap .organization-list .name {display: flex; align-items: center; justify-content: center; font-size: 1.35rem; box-sizing: border-box; text-align: center}
.organization .box-wrap .organization-list .name1 {max-width: 16.6rem; width: 100%; height: 4.2rem; border-radius: 1.35rem; border: 1px solid; padding: .5rem;;}
.organization .box-wrap .organization-list .name.ceo {color: var(--color-primary);}
.organization .box-wrap .organization-list .team {width: 100%; display: flex; gap: 2.6rem 4.6%;}
.organization .box-wrap .organization-list .team > li {width: 100%; display: flex; flex-direction: column; gap: 1.72rem;}
.organization .box-wrap .organization-list .team > li > .name {color: var(--color-secondary);}
.organization .box-wrap .organization-list .team2 {display: flex; flex-direction: column; gap: 1.35rem;}
.organization .box-wrap .organization-list .team2 > li:has(.team3) {padding: 1.35rem .9rem; border-radius: 1.35rem; border: 1px solid; font-size: 1.35rem; display: flex; flex-direction: column; gap: 1.35rem;}
.organization .box-wrap .organization-list .team2 > li:has(.team3) > .name {border: none; height: auto; padding: 0;}
.organization .box-wrap .organization-list .team3 {display: flex; flex-direction: column; border-top: 1px solid;}
.organization .box-wrap .organization-list .team3 > li .name2 {height: 4.5rem; }
.organization .box-wrap .organization-list.show .name.ceo {animation: scaleMove 1s ease both;}
.organization .box-wrap .organization-list.show .team > li > .name {animation: scaleMove 1s .2s ease both;}
.organization .box-wrap .organization-list.show .team2 li {animation: scaleMove 1s .4s ease both;}

/* 본사 & 지점 */
.location .box-wrap > li {display: flex; flex-direction: column; gap: 3.3rem;}
.location .box-wrap > li .text-type1 > * {opacity: 0; transform: translateY(20px); transition: 1s ease;}
.location .box-wrap > li .text-type1 > *:nth-child(2) {transition-delay: .1s;}
.location .box-wrap > li .text-type1 > *:nth-child(3) {transition-delay: .2s;}
.location .box-wrap > li .text-type1 .contact {display: flex; flex-wrap: wrap; gap: .4rem .9rem;}
.location .box-wrap > li .text-type1 .contact > li {display: flex; flex: none; gap: .5rem;}
.location .box-wrap > li .text-type1 .contact .title {color: var(--color-secondary);}
.location .box-wrap > li .text-type1 .contact div.detail span {margin-right: .3rem;}
.location .box-wrap > li .map-box {display: flex; flex-direction: column; gap: 3.3rem;}
.location .box-wrap > li .map-box > * {width: 100%; border-radius: 1.35rem; height: clamp(15rem, 35vw, 986px); opacity: 0; transform: translateY(20px); transition: .5s .1s ease;}
.location .box-wrap > li.overseas {gap: 3.5rem;}
.location .box-wrap > li.overseas .map-img {opacity: 0; transform: translateY(20px); transition: .5s .1s ease;}
.location .box-wrap > li .text-type1.show > * {transform: none; opacity: 1;}
.location .box-wrap > li .map-box > *.show {transform: none; opacity: 1;}
.location .box-wrap > li.overseas .map-img.show {transform: none; opacity: 1;}

/* 제품소개 */
.product {}
.product .item-name {font-size: 2.2rem; font-weight: 700; color: var(--color-secondary);}
.product .img img {max-width: 70%;}
.product .img.full img {max-width: none;}
.product .img.half img {max-width: 50%;}
.product.list-page-type1 .item-list {display: flex; flex-wrap: wrap; gap: 3.5rem 2.2%; align-items: flex-end;}
.product.list-page-type1 .item-list > li {width: calc(100% / 4 - (2.2% / 4) * 3);}
.product.list-page-type1 .item-list > li a {display: flex; flex-direction: column; align-items: center; gap: 1.35rem;}
.product.list-page-type1 .item-list > li a figure {display: flex; align-items: flex-end; justify-content: center;}
.product.list-page-type1 .item-list > li a figure img {max-width: 90%; transition: .5s ease;}
.product.list-page-type1 .item-list > li a .name {position: relative; text-align: center;}
.product.list-page-type1 .item-list > li a .name:after {content: ""; position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); padding: .2rem .4rem; border-radius: 5px; background: var(--color-secondary); opacity: 0; z-index: -1; transition: .5s ease;}
.product.list-page-type2 .box {display: flex; flex-direction: column; gap: 1.7rem;}
.product.list-page-type2 .box:not(.no-line):not(:last-child):after {content: ""; display: block; width: 100%; height: 1px; background: linear-gradient(90deg, #ffffff00 0%, #ffffff 40%, #ffffff00 100%); margin-top: calc(3.5rem - 1.7rem);}
.product.list-page-type2 .box .title-point {margin: 0;}
.product.list-page-type2 .box .detail {line-height: 1.6;}
.product.list-page-type2 .box .text-list {display: flex; gap: .6rem;}
.product.list-page-type2 .box .text-list.column {flex-direction: column; gap: .5rem;}
.product.list-page-type2 .box .text-list li {padding: .5rem .9rem; border-radius: .5rem; border: 1px solid #ffffff60; text-align: left; box-sizing: border-box;}
.product.list-page-type2 .box .text-list:has(li[class*="width"]) {flex-wrap: wrap;}
.product.list-page-type2 .box .text-list li.width2 {width: calc(100% / 2 - (.6rem / 2));}
.product.list-page-type2 .box .text-list li.width3 {width: calc(100% / 3 - (.6rem / 3) * 2);}
.product.list-page-type2 .box .text-list li.width4 {width: calc(100% / 4 - (.6rem / 4) * 3);}
.product.list-page-type2 .box .table-box tbody th:first-child {width: clamp(6rem, 10vw, 160px)}
.product.list-page-type2 .box .table-box tbody tr > * {text-align: left; padding: .5rem .9rem;}
.product.view-page .cate-wrap {display: flex; flex-direction: column; gap: 1.35rem;}
.product.view-page .cate-list {display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center;}
.product.view-page .cate-list li a {position: relative; border-radius: 5rem; border: 1px solid #ffffff40; padding: .5rem 1.35rem; text-align: center; color: #ffffff40; overflow: hidden;}
.product.view-page .cate-list li a:after {content: ""; position: absolute; width: 0%; height: 100%; background: var(--color-primary); opacity: .2; left: 0; top: 0; z-index: -1; transition: .5s ease;}
.product.view-page .cate-list li.active a {border-color: transparent; color: #fff; background: var(--color-primary);}
.product.view-page .item-list {display: flex; gap: 1.75rem; justify-content: center; color: #777;}
.product.view-page .logo {display: flex; align-items: flex-start; flex-direction: column; gap: .5rem; max-width: 80%; margin: 0 auto;}
.product .show .item-name {animation: rotateXMove 1s .1s ease both;}
.product .box.show > *:not(.title-point) {animation: upMove 1s .1s ease both;}
.product.list-page-type2 .box.show .text-list li {animation: clip_path_width 1s .3s ease both;}
.product.list-page-type2 .box.show .text-list.column li {animation-name: clip_path_height;}
.product.list-page-type2 .box:not(.no-line).show:not(:last-child):after {animation: clip_path_width_center 1.5s .1s ease both;}
.product.view-page .cate-wrap {animation: upMove 1s ease both;}
.product.view-page .cate-wrap li {animation: clip_path_width 1s .1s ease both;}

/* 핫멜트 소개  */
.hotmelt .inner2 .list {display: flex;}
.hotmelt .inner2 .box03 .list {flex-direction: column; gap: .5rem;}
.hotmelt .inner2 .box03 .list li {border: 1px solid #fff; border-radius: 10px; text-align: left; padding: .5rem .9rem; display: flex; gap: .6rem;}
.hotmelt .inner2 .box03 .list li .num {flex: none; line-height: 1; margin-top: .15rem;}
.hotmelt .inner2 .box04 .list {gap: 3%;}
.hotmelt .inner2 .box04 .list li {width: 100%; display: flex; flex-direction: column; gap: .6rem;}
.hotmelt .inner2 .box04 .list li .title {padding: .6rem .9rem; border-radius: .5rem; font-weight: 700; border: 1px solid #fff; color: var(--color-secondary);}
.hotmelt .inner2 .box04 .list li .text {line-height: 1.6;}
.hotmelt .inner2 .box04 .list li .text {text-align: left;}
.hotmelt .inner2 .show > *:not(.title-point) {animation: upMove 1s .1s ease both;}
.hotmelt .inner2 .box03.show li {animation: clip_path_height 1s .1s ease both;}
.hotmelt .inner2 .box04.show li {animation: upMove 1s ease both;}

/* 어플리케이터  */
.applicator .inner2 .box02 {line-height: 1.6; opacity: 0;}
.applicator .inner2 .box03 .list {display: flex; flex-wrap: wrap; gap: clamp(1.6rem, 3vw, 2.6rem);}
.applicator .inner2 .box03 .list li {width: calc(50% - (clamp(1.6rem, 3vw, 2.6rem) / 2)); padding: 1.7rem; border-radius: 1.35rem; box-sizing: border-box; border: 1px solid var(--color-point); display: flex; flex-direction: column; gap: .9rem; align-items: center; opacity: 0;}
.applicator .inner2 .box03 .list li .num {width: 2.7rem; height: 2.7rem; font-size: 1.35rem; display: flex; align-items: center; justify-content: center; color: var(--color-point);}
.applicator .inner2 .box03 .list li .text {width: 100%; line-height: 1.6; word-break: break-all;}
.applicator .inner2 .box01.show {animation: scaleMove 1s ease both;}
.applicator .inner2 .box02.show {animation: upMove 1s ease both;}
.applicator .inner2 .box03.show .list li {animation: upMove 1s ease both;}

/* 접착제 상식 */
.glue .inner2 > div {display: flex; flex-direction: column; gap: 1.7rem;}
.glue .inner2 > div .title-point {margin: 0;}
.glue .inner2 .box04 .list {display: flex; gap: 3.1rem;}
.glue .inner2 .box04 .list li {position: relative; display: flex; align-items: center; justify-content: center; border: 1px solid #ffffff60; padding: .9rem; box-sizing: border-box; border-radius: 8px;}
.glue .inner2 .box04 .list li:not(:last-child) {width: 16.7%; flex: none;}
.glue .inner2 .box04 .list li:not(:last-child):after {content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: -2.3rem; width: 1.35rem; height: 1.35rem; background: url(../../images/ico-arrow-pink.svg) no-repeat center / contain;}
.glue .inner2 .box04 .list li:last-child {width: 100%;}
.glue .inner2 .box04 .table-box th {width: clamp(6rem, 20vw, 16rem);}
.glue .inner2 .box05 .table-box td {text-align: left; padding: .5rem .9rem; width: 50%;}
.glue .inner2 .box05 .table-box td .dot-list {padding: .5rem;}
.glue .inner2 .show > *:not(.title-point) {animation: upMove 1s .1s ease both;}

/* 분사 규격 */
.calculation .inner2 .box01 {display: flex; flex-direction: column; gap: 1.7rem;}
.calculation .inner2 .box01 .table-box table {min-width: 320px;}
.calculation .inner2 .box01 .table-box .line-wrap {max-width: 163px; width: 80%; margin: 0 auto; display: flex; align-items: center; gap: 8px;}
.calculation .inner2 .box01 .table-box .line-wrap > div {background: var(--color-point);}
.calculation .inner2 .box01 .table-box .line-wrap .line1 {width: 5px; border-radius: 10rem 0 0 10rem;}
.calculation .inner2 .box01 .table-box .line-wrap .line2 {width: 100%; border-radius: 10rem;}
.calculation .inner2 .box01.show > *:not(.title-point) {animation: upMove 1s .1s ease both;}
.calculation .inner2 .box02.show {animation: scaleMove 1s ease both;}

/* 자료실 */
.dataroom.content > .inner2 {flex-wrap: wrap; flex-direction: row;}
.dataroom .inner2 > div.width2 {width: calc(50% - (3.5rem / 2));}
.dataroom .inner2 .img-box {border-radius: 1.35rem; border: 1px solid var(--color-point); overflow: hidden; transform: scale(.9); opacity: 0; transition: 1s ease; height: clamp(200px, 15vw, 300px);}
.dataroom .inner2 .img-box iframe {width: 100%; height: 100%; object-fit: cover;}
.dataroom .inner2 .show .img-box {transform: none; opacity: 1;}

/* 매뉴얼 다운로드 */
.download .inner2 .list-wrap {display: flex; flex-direction: column; gap: 1.7rem;}
.download .inner2 .list-wrap > li {display: flex; flex-wrap: wrap; gap: 1.7rem 1.35rem; opacity: 0;}
.download .inner2 .list-wrap .list-name {text-align: center; width: 100%; overflow: hidden; position: relative; color: transparent;}
.download .inner2 .list-wrap .list-name:after {content: attr(data-text); position: absolute; width: 100%; left: 0; top: 0; text-align: center; color: #fff; transform: translateY(100%); transition: 1s .1s ease;}
.download .inner2 .list-wrap .list {width: calc(50% - (1.35rem / 2)); display: flex; flex-direction: column; gap: 1.35rem; opacity: 0; transition: .5s ease;}
.download .inner2 .list-wrap .list > li {padding: .9rem; width: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 5%; border-radius: .5rem; border:  1px solid #fff; transition: .5s ease;}
.download .inner2 .list-wrap .list > li:has(a[href="javascript:;"]):not(:has(a:not([href="javascript:;"]))) .name {opacity: .4;}
.download .inner2 .list-wrap .list > li .name {line-height: 1.2; text-align: left; transition: .5s ease;}
.download .inner2 .list-wrap .list > li .link-btn {display: flex; gap: .9rem; font-size: .9rem;}
.download .inner2 .list-wrap .list > li .link-btn a {position: relative;}
.download .inner2 .list-wrap .list > li .link-btn a:before {content: ""; position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); padding: .2rem .4rem; border-radius: 5px; background: var(--color-secondary); opacity: 0; z-index: -1; transition: .5s ease;}
.download .inner2 .list-wrap .list > li .link-btn a[href="javascript:;"] {opacity: .4; cursor: no-drop;}
.download .inner2 .list-wrap > li.show {opacity: 1;}
.download .inner2 .list-wrap > li.show .list-name:after {transform: none;}
.download .inner2 .list-wrap .list.show {opacity: 1;}
.download .inner2 .list-wrap .list.show > li {animation: clip_path_width 1s ease both;}

/* 적용분야 */
.application_field .list {display: flex; flex-direction: column; gap: 3.5rem;}
.application_field .list > li {display: flex; flex-direction: column; gap: 1.7rem; opacity: 0; transform: translateY(20px); transition: 1s ease}
.application_field .list > li .img {position: relative; border-radius: 1.35rem; overflow: hidden; display: flex; align-items: center; justify-content: center; height: 10rem;}
.application_field .list > li .img figure {position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1;}
.application_field .list > li .img figure:after {content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #00000060;}
.application_field .list > li .img figure img {width: 100%; height: 100%; object-fit: cover; transform: scale(1.2); transition: 1s ease;}
.application_field .list > li .img .title {font-size: 1.5rem; font-weight: 700; overflow: hidden;}
.application_field .list > li .img .title h3 {transform: translateY(100%); transition: 1s ease;}
.application_field .list > li .item-list {display: flex; flex-wrap: wrap; gap: clamp(.6rem, .6vw, .9rem);;}
.application_field .list > li .item-list li {padding: .45em .9em; border: 1px solid #ffffff60; border-radius: .5rem; font-size: clamp(.9rem, 3.3vw, 1rem)}
.application_field .list > li.show {transform: none; opacity: 1;}
.application_field .list > li.show .img figure img {transform: none;}
.application_field .list > li.show .item-list li {animation: clip_path_width 1s ease both;}
.application_field .list > li.show .img .title h3 {transform: none;}




@media screen and (min-width: 1921px) {
	.main .section02 .tab_wrap {margin: 0 auto; max-width: 1920px;}
}

@media screen and (min-width: 1025px) {
	.more-btn:hover {color: var(--color-primary)}
	.more-btn:hover:after {transform: none; opacity: 1;}
  .more-btn:hover span {text-shadow: 1px 1px #FFEDE3, 2px 2px #FFEDE3, 3px 3px #FFEDE3, 4px 4px #FFEDE3, 5px 5px #FFEDE3, 6px 6px #FFEDE3, 7px 7px #FFEDE3, 8px 8px #FFEDE3, 9px 9px #FFEDE3, 10px 10px #FFEDE3, 11px 11px #FFEDE3, 12px 12px #FFEDE3, 13px 13px #FFEDE3, 14px 14px #FFEDE3, 15px 15px #FFEDE3, 16px 16px #FFEDE3, 17px 17px #FFEDE3, 18px 18px #FFEDE3, 19px 19px #FFEDE3, 20px 20px #FFEDE3, 21px 21px #FFEDE3, 22px 22px #FFEDE3, 23px 23px #FFEDE3, 24px 24px #FFEDE3, 25px 25px #FFEDE3, 26px 26px #FFEDE3, 27px 27px #FFEDE3, 28px 28px #FFEDE3, 29px 29px #FFEDE3, 30px 30px #FFEDE3, 31px 31px #FFEDE3, 32px 32px #FFEDE3, 33px 33px #FFEDE3, 34px 34px #FFEDE3, 35px 35px #FFEDE3, 36px 36px #FFEDE3, 37px 37px #FFEDE3, 38px 38px #FFEDE3, 39px 39px #FFEDE3;}
	.container .tab_list.type1 > ul > li:not(.active):hover > a {color: #fb9a3a4f;}
	.container .arrow-btn:hover .icon {transform: scale(1.1); filter: drop-shadow(0 0 10px var(--color-primary));}
	.container .arrow-btn:hover .icon:after {transform: translate(-50%, -50%);}
  .container .tab_list.type1 > ul > li:nth-child(2) > a {animation-delay: .2s !important;}
  .container .tab_list.type1 > ul > li:nth-child(3) > a {animation-delay: .3s !important;}
  .container .tab_list.type1 > ul > li:nth-child(4) > a {animation-delay: .4s !important;}
  .container .tab_list.type1 > ul > li:nth-child(5) > a {animation-delay: .5s !important;}
  .container .tab_list.type1 > ul > li:nth-child(6) > a {animation-delay: .6s !important;}
  .container .tab_list.type1 > ul > li:nth-child(7) > a {animation-delay: .7s !important;}
  .container .tab_list.type1 > ul > li:nth-child(8) > a {animation-delay: .8s !important;}
  .container .tab_list.type1 > ul > li:nth-child(9) > a {animation-delay: .9s !important;}

  .main .section02 .tab_wrap .left-box .tab_list.type1 > ul {margin-top: 1.4rem;}
  .main .section02 .tab_wrap .left-box .tab_list.type1 > ul > li > a {padding: 1.4rem 0;} 
  .main .section02.show .tab_wrap .left-box .tab_list.type1 > ul > li > a {animation: upMove 1s .1s ease both;}
	.main .section03 .list li:hover .text-box .title {animation: clip_path_width_center 1s ease both;}
	.main .section03 .list li:hover .text-box .text {display: block; animation: clip_path_height_bottom 1s ease both;}
	.main .section03 .list li:hover .more-btn {display: block; animation: scaleMove 1s ease both;}
	.main .section03 .list li:hover:before {clip-path: polygon(0 0, 0% 100%, 100% 0);}
	.main .section03 .list li:hover:after {clip-path: polygon(100% 0, 0% 100%, 100% 100%);}
  .main .section04 .product-swiper .swiper:has(.swiper-slide:hover) .swiper-slide:not(:hover) a {opacity: .4;}
	.main .section04 .product-swiper .swiper:has(.swiper-slide:hover) .swiper-slide:not(:hover) .img img {filter: grayscale(1);}
	.main .section04 .product-swiper .swiper .swiper-slide:hover .img img {filter: drop-shadow(3px 3px 10px #fb9a3a73);}
	.main .section04 .product-swiper .swiper .swiper-slide:hover .item-name:after {opacity: 1; transform: translate(-50%, -50%);}
  .main .section05 .inner .contact li:hover a.detail:after {opacity: 1; transform: translate(-50%, -50%);}

  .subPage .inner .local_navigation-wrap .local_navigation {position: sticky; top: calc(var(--header-top) + var(--header-height) + 1.5rem); left: 0;}
  .subPage .inner .local_navigation-wrap .local_navigation > ul > li > a {animation: upMove 1s .1s ease both;}
  
	.location .box-wrap > li .text-type1 .contact > li a:hover {color: var(--color-secondary);}

	.product.list-page-type1 .item-list:has(li:hover) li:not(:hover) a {opacity: .4;}
	.product.list-page-type1 .item-list:has(li:hover) li:not(:hover) .img img {filter: grayscale(1);}
	.product.list-page-type1 .item-list > li a:hover .img img {filter: drop-shadow(3px 3px 10px #fb9a3a73);}
	.product.list-page-type1 .item-list > li a:hover .name:after {opacity: 1; transform: translate(-50%, -50%);}

	.download .inner2 .list-wrap .list > li:hover {box-shadow: 0 0 15px #fb9a3a6e; border-color: var(--color-secondary)}
	.download .inner2 .list-wrap .list > li:hover .name {opacity: 1 !important; color: var(--color-secondary);}
	.download .inner2 .list-wrap .list > li .link-btn a:not([href="javascript:;"]):hover:before {opacity: 1; transform: translate(-50%, -50%);}

	.product.list-page-type1 .item-list > li {animation: upMove 1s ease both;}
	.product.view-page .cate-list li:not(.active):hover a {color: var(--color-primary); border-color: #ff640a8a; box-shadow: 0 0 10px #ff640a47;}
	.product.view-page .cate-list li:not(.active):hover a:after {width: 100%;}

}

@media screen and (max-width: 1200px) { 
  .main .section02 .tab_wrap .left-box {padding-left: 3.2%; width: clamp(13rem, 23vw, 305px);}
  .main .section02 .tab_wrap .right-box {width: 32%;}
}
@media screen and (max-width: 1024px) { 
  .container .tab_list .bg {display: none;}
  .container .tab_list.type1 > ul > li {padding-left: 0;}
  .container .tab_list.type1 > ul > li.active > a {padding-left: 1.5rem;}
  .container .tab_list.type1 > ul > li > a:before, .container .tab_list.type1 > ul > li > a:after {content: ""; position: absolute; width: 8px; height: 8px; top: 50%; left: .5rem; transform: translateY(-50%); border-radius: 50%; background: var(--color-primary); opacity: 0; transition: .5s ease;}
  .container .tab_list.type1 > ul > li > a:after {width: 16px; height: 16px; left: .3rem; filter: blur(5px);}
  .container .tab_list.type1 > ul > li.active > a:before, .container .tab_list.type1 > ul > li.active > a:after {opacity: 1;}

  .main .section01 {min-height: calc(70vw + 28rem); padding-top: calc(var(--header-height) + var(--header-top)); box-sizing: border-box;}
  .main .section01 .bg div.circle {height: clamp(0px, 120vw, 100vh); width: clamp(0px, 120vw, 100vh); opacity: .6;}
  .main .section01 .inner {flex-direction: column; align-items: flex-start; justify-content: center; gap: 3rem; padding: 3rem clamp(30px, 6vw, 6vw);}
  .main .section01 .inner .img-box {width: clamp(200px, 70vw, 680px)}
  .main .section02 .tab_wrap {flex-wrap: wrap; padding: 0 30px 7rem; gap: 5rem 4%;}
  .main .section02 .tab_wrap .left-box {width: 100%; padding: 0; }
  .main .section02 .tab_wrap .left-box:after {width: 100%; height: 1px; background: linear-gradient(90deg, #F25C0510 0%, #F25C05 40%, #fff, #F25C05 60%, #F25C0510 100%); animation-name: clip_path_width_center; position: static; display: block; margin-top: 3rem;}
  .main .section02 .tab_wrap .left-box .tab_list ul {flex-direction: row; flex-wrap: wrap; gap: .3rem 5%;}
  .main .section02.show .tab_wrap .left-box .tab_list.type1 > ul > li {animation: clip_path_width 1s ease both;}
  .main .section02 .tab_wrap .center-box .tab_box .list li {height: auto;}
  .main .section02 .tab_wrap .center-box {width: 60%;}
  .main .section02 .tab_wrap .right-box {width: calc(100% - 60% - 4% + 30px); margin-right: -30px;}
  .main .section03.show .bg {animation-name: clip_path_height;}
  .main .section03 .list {flex-direction: column;}
  .main .section03 .list li {padding: 3rem 1rem; height: auto; gap: 2.5rem}
  .main .section03 .list li:not(:last-child) {border-right: none; border-bottom: 1px solid #fff;}
  .main .section03 .list li .text-box .text, .main .section03 .list li .more-btn {display: block;}

	.subPage .inner:has(.local_navigation-wrap) {flex-direction: column; gap: 4rem;}
	.subPage .inner .local_navigation-wrap {width: 100%;}
	.subPage .inner .local_navigation-wrap:after {width: 100%; height: 1px; background: linear-gradient(90deg, #F25C0510 0%, #F25C05 40%, #fff, #F25C05 60%, #F25C0510 100%); animation-name: clip_path_width_center; position: absolute; left: 50%; transform: translateX(-50%); top: auto; bottom: -2rem}
	.subPage .inner .local_navigation-wrap ul {flex-direction: row; flex-wrap: wrap; gap: .5rem 3%; align-items: center;}
  .subPage .inner .local_navigation-wrap .local_navigation > ul > li {animation: clip_path_width 1s ease both;}

	.glue .inner2 .box04 .list {gap: 2.5rem;}
	.glue .inner2 .box04 .list li:not(:last-child):after {right: -2rem;}

	.product.list-page-type1 .item-list {animation: upMove 1s ease both;}

}

@media screen and (max-width: 900px) {
	.certifications .img-list {flex-wrap: wrap; gap: 1.1rem 2.6%;}
	.certifications .img-list li {width: calc(100% / 4 - (2.6% / 4) * 3);}
	.certifications .license-list > li {width: calc(50% - (1.1rem / 2));}
	.certifications .license-list > li:nth-child(2) {margin-right: 0;}

	.organization .box-wrap .organization-list .name {font-size: 1.1rem;}
	.organization .box-wrap .organization-list .name1 {height: 3.7rem;}
	.organization .box-wrap .organization-list .team3 > li .name2 {height: 4rem;}

	.product.list-page-type1 .item-list {gap: 3.5rem 1rem;}
	.product.list-page-type1 .item-list > li {width: calc(100% / 3 - (1rem / 3) * 2);}
}

@media screen and (max-width: 768px) {
  .main .main_navigation {display: none;}
  .main .section02 .tab_wrap {position: relative;}
  .main .section02 .tab_wrap .center-box {width: 100%;}
  .main .section02 .tab_wrap .center-box .tab_box .text-box {color: #ffffff90}
  .main .section02 .tab_wrap .right-box {position: absolute; width: 60%; margin: 0; top: 20%; right: 0; opacity: .2; height: clamp(200px, 68vw, 580px)}

	.history .box-wrap .year-box > li .list-box {flex-direction: column; gap: .9rem;}

	.hotmelt .inner2 .box04 .list {flex-direction: column; gap: 2rem;}

	.applicator .inner2 .box03 .list {flex-direction: column; gap: 1.6rem;}
	.applicator .inner2 .box03 .list li {width: 100%;}

	.product.list-page-type2 .box .text-list li.width4 {width: calc(100% / 3 - (.6rem / 3) * 2);}
}

@media screen and (max-width: 640px) {
	.certifications .img-list li {width: calc(100% / 3 - (2.6% / 3) * 2);}
	.certifications .license-list > li {width: 100%;}

	.sub .table-box:not(.scroll) {border: none;}
	.sub .table-box:not(.scroll) table colgroup, .sub .table-box:not(.scroll) table thead {display: none;}
	.sub .table-box:not(.scroll) table tbody tr th {border-right: none;}
	.sub .table-box:not(.scroll) table tr {display: flex; flex-wrap: wrap;}
	.sub .table-box:not(.scroll) table tr > * {width: 100%; display: block; border: none;}
	.sub .table-box:not(.scroll) table tbody tr:has(.mo-th) {flex-direction: column; gap: 1rem;}
	.sub .table-box:not(.scroll) table tbody td:has(.mo-th) {width: 100%; border: 1px solid #ffffff60; border-radius: .5rem; padding: 0 1rem .5rem;}
	.sub .table-box:not(.scroll) table tbody td .mo-th {border-bottom: 1px solid #ffffff40; height: 3rem; display: flex; align-items: center; justify-content: center;}
	.sub .table-box:not(.scroll) table tbody td:has(.mo-th) > *:not(.mo-th) {min-height: 3rem; display: flex; align-items: center; justify-content: center;}
	.sub .table-box:not(.scroll) table tbody:has(tr th) {display: flex; flex-direction: column; gap: 1rem;}
	.sub .table-box:not(.scroll) table tr:has(th) {padding: 0 1rem .5rem; border: 1px solid #ffffff60; border-radius: .5rem;}
	.sub .table-box:not(.scroll) table tr:has(th) > * {width: 100% !important;}
	.sub .table-box:not(.scroll) table tr:has(th) th {border-bottom: 1px solid #ffffff40; height: 3rem; display: flex; align-items: center; justify-content: center;}
	.sub .table-box:not(.scroll) table tr:has(th) td {padding: 1rem;}
	.sub .table-box:not(.scroll) table tr:has(th) td br {display: none;}

	.product.list-page-type1 .item-list > li {width: calc(100% / 2 - (1rem / 2) * 1);}
	.product.list-page-type2 .box .text-list li.width3, .product.list-page-type2 .box .text-list li.width4 {width: calc(100% / 2 - (.6rem / 2));}

	.glue .inner2 > div p br {display: none;}
	.glue .inner2 .box04 .list {flex-wrap: wrap; gap: 2rem;}
	.glue .inner2 .box04 .list li {width: calc(50% - 1rem) !important;}
	.glue .inner2 .box04 .list li:nth-child(2):after {transform: rotate(90deg) translateX(-50%); transform-origin: 0 center; top: calc(100% + .4rem); left: 50%}
	.glue .inner2 .box04 .list li:nth-child(3) {order: 2}
	.glue .inner2 .box04 .list li:nth-child(3):after {transform: rotateY(-180deg) translateY(-50%); right: auto; left: -1.8rem;}
	.glue .inner2 .box04 .list li:not(:last-child):after {right: -1.8rem;}

	.download .inner2 .list-wrap .list {width: 100%;}

  .dataroom.content > .inner2 {flex-direction: column;}
  .dataroom.content > .inner2 > div {width: 100% !important;}
  .dataroom .inner2 .img-box {height: clamp(150px, 48vw, 300px);}
}
@media screen and (max-width: 480px) {
  .main .section04 .product-swiper {padding: 0 5rem;}
  .main .section04 .product-swiper .arrow-btn.prev-btn {left: 2.6rem;}
  .main .section04 .product-swiper .arrow-btn.next-btn {right: 2.6rem;}
}
@media screen and (max-width: 400px) {
  .main .section02 .tab_wrap .center-box .tab_box .list:has(li:nth-child(4)) {flex-wrap: wrap; gap: 1.5rem 3rem; max-width: 80%; margin: 0 auto;}
  .main .section02 .tab_wrap .center-box .tab_box .list:has(li:nth-child(4)) li {width: calc(50% - (3rem / 2))}

	.product.list-page-type1 .item-list > li {width: 100%;}
	.product.list-page-type1 .item-list > li a figure img {max-width: 80%;}
	.product.list-page-type2 .box .text-list li {width: 100% !important;}
}