@charset "utf-8";

.sub-visual {height: 100%; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; overflow: hidden;}
.sub-visual01 {background-image: url('../img/sub/sub-visual01.jpg');} 
.sub-visual02 {background-image: url('../img/sub/sub-visual02.jpg');} 
.sub-visual03 {background-image: url('../img/sub/sub-visual03.jpg');} 
.sub-visual05 {background-image: url('../img/sub/sub-visual05.jpg');} 
.sub-visual06 {background-image: url('../img/sub/sub-visual06.jpg');} 

.sub-visual-title {height: calc(100vh - 130px);}
.sub-visual-title .container {display: flex; flex-direction: column; justify-content: flex-end;}
.breadcrumb {display: flex; align-items: center; margin: 0 -16px 30px;}
.breadcrumb li {position: relative; padding: 0 16px; font-size: 20px; line-height: 1.7em; letter-spacing: -1.2px; color: #fff;}
.breadcrumb li:after {position: absolute; top: 50%; right: -5px; transform: translateY(-50%); content: ''; width: 9px; height: 15px; background: url('../img/sub/icon-breadcrumb-arrow.png') no-repeat center center;}
.breadcrumb li:last-child:after {display: none;}
.breadcrumb li img {display: block;}

.sub-visual .title {font-size: 72px; font-weight: 700; line-height: 1.27em; letter-spacing: -5.76px; color: #fff; margin-bottom: 90px;}

.lnb {height: 130px; border-top: 4px solid rgba(255,255,255,0.3);}
.sub-visual05 .lnb,
.sub-visual06 .lnb {border: none;}
.lnb ul {display: flex; height: 100%;}
.lnb ul li {flex: 1;}
.lnb ul li a {position: relative; height: 100%; align-content: center; font-size: 24px; font-weight: 700; letter-spacing: -0.72px; color: rgba(255,255,255,0.5); text-align: center; transition: all 0.5s;}
.lnb ul li a:hover {color: #fff;}
.lnb ul li.active a {color: #fff;}
.lnb ul li a:before {position: absolute; top: -4px; left: 50%; transform: translateX(-50%); content: ''; width: 0; height: 4px; background: #fff;}
.lnb ul li.active a:before {width: 100%;}

.sub-cont {padding: 130px 0 180px;}

/* S101 */
.page-company .overview {background: url('../img/sub/company-overview-bg.jpg') no-repeat 50% 50%/cover;}
.page-company .overview .overview-text {max-width: 738px;}
.overview-heading {opacity: 0; margin-bottom: 40px;}
.overview-heading-en {font-size: 22px; font-weight: 500; line-height: 1.63em; letter-spacing: -1.32px; color: rgba(255,255,255,0.7); margin-bottom: 8px;}
.overview-heading-ko {font-size: 56px; font-weight: 700; line-height: 1.53em; letter-spacing: -3.36px; color: #fff;}
.overview-desc {opacity: 0; display: flex; flex-direction: column; gap: 20px;}
.overview-desc p {font-size: 20px; font-weight: 400; line-height: 1.7em; letter-spacing: -1.2px; color: rgba(255,255,255,0.7);}
.overview-desc p b {font-weight: 500; color: #fff;}
.overview-desc .signature {font-size: 24px; font-weight: 500; line-height: 1.58em; letter-spacing: -1.44px; color: rgba(255,255,255,0.7); margin-top: 20px;}

.section.on .overview-heading {animation: fadeUp 1.2s 0.3s forwards;}
.section.on .overview-desc {animation: fadeUp 1.2s 0.5s forwards;}

/* S102 */
.page-philosophy .intro {background: url('../img/sub/philosophy-intro-bg.jpg') no-repeat 50% 50%/cover;}
.intro-text {text-align: center;}
.intro-heading {position: relative; padding-bottom: 285px; margin-bottom: 37px;}
.intro-heading:before {opacity: 0; position: absolute; top: 158px; left: 50%; content: ''; width: 1px; height: 250px; background: rgba(255,255,255,0.5);}
.intro-heading:after {opacity: 0; position: absolute; bottom: 0; left: 50%; margin-left: -3px; content: ''; width: 7px; height: 7px; background: rgba(255,255,255,0.5); border-radius: 50%;}
.intro-heading-en {opacity: 0; font-size: 22px; font-weight: 500; line-height: 1.63em; letter-spacing: -1.32px; color: rgba(255,255,255,0.7); margin-bottom: 8px;}
.intro-heading-ko {opacity: 0; font-size: 56px; font-weight: 700; line-height: 1.53em; letter-spacing: -3.36px; color: #fff;}
.intro-desc {opacity: 0;}
.intro-sub-title {font-size: 40px; font-weight: 600; line-height: 1.3em; letter-spacing: -1.2px; color: #fff; margin-bottom: 10px;}
.intro-sub-desc {font-size: 24px; font-weight: 500; line-height: 1.58em; letter-spacing: -1.44px; color: rgba(255,255,255,0.7); margin-bottom: 30px;}
.intro-desc-text {font-size: 20px; line-height: 1.7em; letter-spacing: -1.2px; color: rgba(255,255,255,0.7);}
.intro-desc-text b {font-weight: 500; color: #fff;}

.section.on .intro-heading-en {animation: fadeDown 1.2s 0.3s forwards;}
.section.on .intro-heading-ko {animation: fadeDown 1.2s 0.3s forwards;}
.section.on .intro-heading:before {animation: line 0.8s 0.7s forwards;}
.section.on .intro-heading:after {animation: opacity 0.8s 1.3s forwards;}
.section.on .intro-desc {animation: fadeDown 1.2s 1.3s forwards;}

.page-philosophy .policy-cont {display: flex; justify-content: space-between; gap: 80px;}
.page-philosophy .policy-cont.reverse {flex-direction: row-reverse;}
.page-philosophy .policy-img {max-width: 650px; width: 100%; border-radius: 4px; overflow: hidden;}
.page-philosophy .policy-img img {height: 100%; object-fit: cover;}
.page-philosophy .policy-text {opacity: 0; display:flex; flex-direction:column; justify-content:center;}
.page-philosophy .policy-text .num {font-family: "Poppins", sans-serif; font-size: 36px; font-weight: 600; line-height: 1.38em; letter-spacing: -1.08px; color: #ddd; margin-bottom: 10px;} 
.page-philosophy .policy-text .cate {font-size: 22px; font-weight: 700; line-height: 1.54em; letter-spacing: -1.32px; color: #0F367A; margin-bottom: 4px;}
.page-philosophy .policy-text .title {font-size: 48px; font-weight: 700; line-height: 1.37em; letter-spacing: -2.88px; color: #111; margin-bottom: 40px;}
.page-philosophy .policy-text .title span {font-size: 36px; font-weight: 600; line-height: 1.38em; letter-spacing: -1.08px; color: #ddd;}
.page-philosophy .policy-text .text-list {margin-bottom: 8px;}
.page-philosophy .policy-text .text-list li {position: relative; font-size: 20px; line-height: 1.7em; letter-spacing: -1.2px; color: #666; padding-left: 16px;}
.page-philosophy .policy-text .text-list li:before {position: absolute; top: 15px; left: 0; content: '';  width: 4px; height: 4px; background: #0F367A;}
.page-philosophy .policy-text .manual-title {position: relative; font-size: 20px; font-weight: 500; line-height: 1.7em; letter-spacing: -1.2px; color: #333; padding-left: 16px; margin-bottom: 10px;}
.page-philosophy .policy-text .manual-title:before {position: absolute; top: 15px; left: 0; content: '';  width: 4px; height: 4px; background: #0F367A;}
.page-philosophy .policy-text .manual-items {display: flex; margin: -5px;}
.page-philosophy .policy-text .manual-item {width: 33.3333%; padding: 5px;}
.page-philosophy .policy-text .manual-item .inner {height: 100%; border-radius: 4px; border: 1px solid #DDD; padding: 40px 35px 50px; text-align: center;}
.page-philosophy .policy-text .manual-item .icon {margin-bottom: 24px;} 
.page-philosophy .policy-text .manual-item p {font-size: 18px; line-height: 1.55em; letter-spacing: -1.08px; color: #666;}
.page-philosophy .policy-text .manual-item b {font-weight: 500; color: #111;}

.page-philosophy .announce-cont {display: flex; flex-direction: column; height: 100%;}
.page-philosophy .announce-text {opacity: 0; display: flex; justify-content: center; align-items: center; max-width: 780px; height: calc(100% - 408px); text-align: center; margin: 0 auto;}
.page-philosophy .announce-text .cate {font-size: 22px; font-weight: 700; line-height: 1.54em; letter-spacing: -1.32px; color: #0F367A; margin-bottom: 50px;}
.page-philosophy .announce-text .title {font-size: 48px; font-weight: 700; line-height: 1.37em; letter-spacing: -2.88px; color: #111; margin-bottom: 20px;}
.page-philosophy .announce-text .title span {color: #0F367A;}
.page-philosophy .announce-text .desc {font-size: 22px; line-height: 1.54em; letter-spacing: -1.32px; color: #666;}
.page-philosophy .announce-img {height: 408px; background: url('../img/sub/philosophy-announce-img.jpg') no-repeat 50% 50%/cover;}

.page-philosophy .section.on .policy-text {animation: fadeUp 1.2s 0.3s forwards;}
.page-philosophy .section.on .announce-text {animation: fadeUp 1.2s 0.3s forwards;}

/* S103 */
.page-history .history {padding-bottom: 0;}
.sub-section-title {margin-bottom: 70px; text-align: center;}
.sub-section-title-en {font-size: 22px; font-weight: 500; line-height: 1.63em; letter-spacing: -1.32px; color: #0F367A; margin-bottom: 8px;}
.sub-section-title-ko {font-size: 56px; font-weight: 700; line-height: 1.53em; letter-spacing: -3.36px; color: #111;}

.page-history .history-cont {position: relative; display: flex; align-items: flex-start;}
.page-history .history-cont > div {width: 50%; padding-bottom: 180px;}
.page-history .history-heading {position: sticky; top: 180px; padding-top: 9px; padding-right: 108px; text-align: right;}
.page-history .history-heading .company {font-family: "Poppins", sans-serif; font-size: 36px; font-weight: 600; line-height: 1.38em; letter-spacing: -1.08px; color: #0F367A; margin-bottom: 4px;}
.page-history .history-heading .title {font-family: "Poppins", sans-serif; font-size: 68px; font-weight: 600; line-height: 1.2em; letter-spacing: -2.04px; color: #EAEAEA; margin-bottom: 20px;}
.page-history .history-desc {position: relative; padding-left: 130px;}
.page-history .history-desc:before {position: absolute; bottom: 0; left: 0; content: ''; width: 3px; height: calc(100% - 22px); background: #0F367A;}
.page-history .history-desc:after {position: absolute; top: 22px; left: -8px; content: ''; width: 18px; height: 18px; border-radius: 50%; border: 4px solid #CFD7E4; background: #0F367A;}
.page-history .history-item:not(:last-child) {margin-bottom: 80px;}
.page-history .history-item-title {font-size: 46px; font-weight: 700; line-height: 1.3em; letter-spacing: -2.76px; color: #0F367A; margin-bottom: 26px;}
.page-history .history-item-row {display: flex; margin-bottom: 12px;}
.page-history .history-item-row .date {max-width: 84px; width: 100%; font-size: 20px; font-weight: 500; line-height: 1.5em;	letter-spacing: -1.2px; color: #333;}
.page-history .history-item-row .details {width: 1%; flex: 1 1 auto; font-size: 20px; line-height: 1.5em; letter-spacing: -1.2px; color: #666;}

/* S104 */
.certificate .none {text-align: center; font-size: 18px; color: #666; padding: 60px 0;}
.certificate .gallery-list ul li a {border-radius: 4px;}
.certificate .gallery-list ul li a .thumb .pic {padding-bottom:141.03%;}
.certificate .gallery-list ul li a .tit {margin-bottom: 0; text-align: center;}

/* S105 */
.location-item {display: flex; gap: 40px;}
.location-item > div {flex: 1;}
.location-map {border-radius: 4px; overflow: hidden;}
.location-map iframe {height: 450px;}
.location-map .root_daum_roughmap {width:100% !important; height:450px !important;}
.location-map .root_daum_roughmap .wrap_map {height:450px !important;}
.location-map .root_daum_roughmap .border1,
.location-map .root_daum_roughmap .border2 {border: none;}
.location-map .root_daum_roughmap .border3, 
.location-map .root_daum_roughmap .border4 {background-color: transparent;}
.location-tab ul {display: flex; gap: 4px; margin-bottom: 36px;}
.location-tab ul li {flex: 1;}
.location-tab ul li a {font-size: 18px; font-weight: 500; line-height: 1.3em; letter-spacing: -1.08px; color: #0F367A; border-radius: 4px; border: 1px solid rgba(15, 54, 122, 0.30); background: #FFF; padding: 18px 10px; text-align: center; transition: all 0.5s;}
.location-tab ul li.active a {color: #fff; background: #0F367A;}
.location-info {display: flex; flex-direction: column; gap: 10px; padding: 0 10px;}
.location-info dl {display: flex; align-items: flex-start; gap: 20px;}
.location-info dt {max-width: 86px; width: 100%; border-radius: 4px; background: #F8F8F8; font-size: 16px; font-weight: 500; line-height: 1.5em; color: #333; padding: 10px; text-align: center;}
.location-info dd {width: 1%; flex: 1 1 auto; font-size: 20px; line-height: 1.7em; letter-spacing: -1.2px; color: #666; margin-top: 6px;}

/* S201 */
.page-envi .intro {background: url('../img/sub/envi-intro-bg.jpg') no-repeat 50% 50%/cover;}
.esg-cont {display: flex; height: 100%;}
.esg-cont.reverse {flex-direction: row-reverse;}
.esg-cont > div {width: 50%;}
.esg-text {opacity: 0 ;display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 20px;}
.esg-text-inner {max-width: 620px;}
.esg-text .esg-num {display: inline-block; padding: 5px 14px; font-family: "Poppins", sans-serif; font-size: 16px; font-weight: 600; line-height: 1.87em; letter-spacing: -0.48px; border-radius: 4px; background: #0F367A; margin-bottom: 8px;}
.esg-text .esg-num .en {color: #fff; margin-right: 4px;}
.esg-text .esg-num .num {color: rgba(255,255,255,0.5);}
.esg-text .esg-title {font-size: 56px; font-weight: 700; line-height: 1.53em; letter-spacing: -3.36px; color: #111; margin-bottom: 40px;}
.esg-text .esg-desc-list li {position: relative; font-size: 22px; line-height: 1.72em; letter-spacing: -1.32px; color: #666; padding-left: 18px;}
.esg-text .esg-desc-list li:before {position: absolute; top: 16px; left: 0; content: ''; width: 4px; height: 4px; background: #0F367A;}
.esg-img img {width: 100%; height: 100%; object-fit: cover;}

.section.on .esg-text {animation: fadeUp 1.2s 0.3s forwards;}

/* S202 */
.page-social .intro {background: url('../img/sub/social-intro-bg.jpg') no-repeat 50% 50%/cover;}

/* S203 */
.page-governance .intro {background: url('../img/sub/governance-intro-bg.jpg') no-repeat 50% 50%/cover;}

/* S301 */
.page-rnd .overview {background: url('../img/sub/rnd-overview-bg.jpg') no-repeat 50% 50%/cover;}
.page-rnd .overview .overview-text {max-width: 610px;}
.page-rnd .strategy .sub-section-title {opacity: 0; margin-bottom: 20px;}
.page-rnd .strategy-items {opacity: 0; display: flex; margin: -10px;}
.page-rnd .strategy-item {width: 35%; padding: 10px;}
.page-rnd .strategy-item:nth-child(odd) {width: 32.5%;}
.page-rnd .strategy-item:nth-child(even) {transform: translateY(50px);}
.page-rnd .strategy-inner {height: 100%; border-radius: 4px; background: #F8F8F8; padding: 20px 20px 38px;}
.page-rnd .strategy-img {position: relative; margin-bottom: 24px;}
.page-rnd .strategy-img img {width: 100%; height: 100%; object-fit: cover;}
.page-rnd .strategy-img p {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; font-size: 30px; font-weight: 700; line-height: 1.66em; letter-spacing: -0.9px; color: #fff; text-align: center;} 
.page-rnd .strategy-text {padding: 0 10px;}
.page-rnd .strategy-text p {font-size: 18px; line-height: 1.77em; letter-spacing: -1.08px; color: #666;}

.page-rnd .strategy.on .sub-section-title {animation: fadeUp 1.2s 0.3s forwards;}
.page-rnd .section.on .strategy-items {animation: fadeUp 1.2s 0.5s forwards;}

/* S302 */
.field .sub-section-title {/* opacity: 0; */}
.field-tab {/* opacity: 0; */ display: flex; justify-content: center; margin-bottom: 70px;}
.field-tab ul {display: flex; justify-content: center; gap: 10px; background: #f8f8f8; border-radius: 100px; padding: 8px;}
.field-tab ul li a {font-size: 20px; font-weight: 500; line-height: 1.7em; letter-spacing: -1.2px; color: #666; text-align: center; border-radius: 100px; padding: 8px 24px; transition: all 0.5s;}
.field-tab ul li a:hover {color: #0F367A;}
.field-tab ul li.active a {color: #fff; background: #0F367A;}
.field-intro { display: flex; justify-content: center; align-items: center; min-height: 315px; padding: 50px 20px; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; border-radius: 4px; overflow: hidden; margin-bottom: 120px;}
#field-tab-design .field-intro {background-image: url('../img/sub/field-design-bg.jpg');}
#field-tab-analysis .field-intro {background-image: url('../img/sub/field-analysis-bg.jpg');}
#field-tab-reliability .field-intro {background-image: url('../img/sub/field-reliability-bg.jpg');}
#field-tab-simulation .field-intro {background-image: url('../img/sub/field-simulation-bg.jpg');}
.field-intro .field-text {/* opacity: 0; */ text-align: center;}
.field-intro .field-text h4 {font-size: 48px; font-weight: 700; line-height: 1.37em; letter-spacing: -2.88px; color: #fff; margin-bottom: 16px;}
.field-intro .field-text p {font-size: 20px; line-height: 1.7em; letter-spacing: -1.2px; color: #fff;}
.field-list .btn {/* opacity: 0; */ display: flex; justify-content: flex-end; margin-bottom: 20px;}
.btn-test-method {display: flex; justify-content: space-between; align-items: center; max-width: 240px; width: 100%; border-radius: 50px; background: #F8F8F8; padding: 10px 26px 10px 30px; border: none; transition: all 0.5s;}
.btn-test-method span {font-size: 16px; font-weight: 600; line-height: 1.87em; letter-spacing: -0.48px; color: #888; transition: all 0.5s;}
.btn-test-method .icon {width: 24px; height: 24px; background: url('../img/sub/btn-test-method.png') no-repeat 50% 50%; transition: all 0.5s;}
.btn-test-method:hover {background: #0F367A;}
.btn-test-method:hover span {color: #fff;}
.btn-test-method:hover .icon {background-image: url('../img/sub/btn-test-method-hover.png')} 
.field-list .field-items {/* opacity: 0; */ display: flex; flex-wrap: wrap; margin: -19px -10px;}
.field-list .field-item {width: 25%; padding: 19px 10px; cursor: pointer;}
#field-tab-reliability .field-list .field-item {cursor: default;}
.field-list .field-item-img {margin-bottom: 20px; border-radius: 4px; overflow: hidden;}
.field-list .field-item-img img {width: 100%; transition: all 0.5s;}
.field-list .field-item:hover .field-item-img img {transform: scale(1.05);}
.page-field-reliability .field-list .field-item:hover .field-item-img img {transform: scale(1);}
.field-list .field-item-text p {font-size: 22px; font-weight: 500; line-height: 1.63em; letter-spacing: -1.32px; color: #333; text-align: center; transition: all 0.5s;}
.field-list .field-item:hover .field-item-text p {color: #0F367A;}
.page-field-reliability .field-list .field-item:hover .field-item-text p {color: #333;}

.field.on .sub-section-title {animation: fadeUp 1.2s 0.3s forwards;}
.section.on .field-tab {animation: fadeUp 1.2s 0.5s forwards;}
.section.on .field-intro .field-text {animation: fadeUp 1.2s 0.7s forwards;}
.field-list.on .btn {animation: fadeUp 1.2s 0.3s forwards;}
.field-list.on .field-items {animation: fadeUp 1.2s 0.3s forwards;}

.test-method-modal {display: none; z-index: 100; position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 730px; width: 90vw; max-height: 90vh; border-radius: 4px; box-shadow: 0 2px 15px 4px rgba(132, 132, 132, 0.20); overflow: hidden;}
.test-method-modal.active {display: block;}
.test-method-modal .modal-header {position: relative; background: #0F367A; padding: 12px 30px;}
.test-method-modal .modal-header p {font-size: 16px; font-weight: 600; line-height: 1.87em; letter-spacing: -0.48px; color: #fff;}
.test-method-modal .modal-header .btn-modal-close {position: absolute; top: 20px; right: 20px; background: transparent; border: none; transition: all 0.5s;}
.test-method-modal .modal-header .btn-modal-close:hover {opacity:0.7;}
.test-method-modal .modal-body {background: #F8F8F8; padding: 30px; overflow-y: auto; max-height: calc(88vh - 80px);}
.test-method-modal .modal-body::-webkit-scrollbar {width: 6px; height: 6px;}
.test-method-modal .modal-body::-webkit-scrollbar-thumb {background: #ddd; border-radius: 6px; cursor: pointer;}
.test-method-modal .modal-body::-webkit-scrollbar-track {background: #f8f8f8; border-radius: 6px;}

.test-method-modal .test-tab-cont {display:none;}
.test-method-modal .test-tab-cont.active {display:block;}
.test-method-modal .test-title {font-family: "Poppins", sans-serif; font-size: 22px; font-weight: 600; line-height: 1.63em; letter-spacing: -0.66px; color: #333; text-align: center; margin-bottom: 16px;}
.test-method-modal .test-img {display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 20px;}
.test-method-modal .test-img figure {width: calc(50% - 10px);}
.test-method-modal .test-img img {width: 100%;}
.test-method-modal .test-tab-menu {display: flex; flex-wrap: wrap; margin: -4px;}
.test-method-modal .test-tab-menu li {width: 33.333%; padding: 4px;}
.test-method-modal .test-tab-menu li a {display: flex; justify-content: center; align-items: center; height: 100%; border-radius: 4px; border: 1px solid #DDD; font-family: "Poppins", sans-serif; font-size: 14px; line-height: 1.6em; letter-spacing: -0.42px; color: #666; text-align: center; padding: 8px; transition: all 0.5s;}
.test-method-modal .test-tab-menu li a:hover {border: 1px solid #0F367A; color: #0F367A;}
.test-method-modal .test-tab-menu li.active a {background: #0F367A; color: #fff;}
.test-method-modal-overlay {display: none; z-index: 90; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7);}

.video-modal {display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 1100px; max-width: 86vw; z-index: 999;}
.video-modal video {width: 100%;}
.video-modal .video-close {position: absolute; top: 5px; right: -24px; background: transparent; border: none; transition: all 0.5s;}
.video-modal .video-close:hover {opacity: 0.7;}
.video-modal-overlay {display: none; z-index: 90; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7);}

/* S401 */
.product-overview {background: url('../img/sub/product-display-overview-bg.jpg') no-repeat 50% 50%/cover;}
.product-overview-text {text-align: center;}
.product-overview-heading {opacity: 0; margin-bottom: 60px;}
.product-overview-heading-ko {font-size: 26px; font-weight: 500; line-height: normal; letter-spacing: -1.56px; color: rgba(255,255,255,0.7); margin-bottom: 18px;}
.product-overview-heading-en {font-family: "Poppins", sans-serif; font-size: 68px; font-weight: 600; line-height: 1.2em; letter-spacing: -2.04px; color: #fff;}
.product-overview-desc {opacity: 0; display: flex; flex-direction: column; gap: 20px;}
.product-overview-desc p {font-size: 20px; font-weight: 400; line-height: 1.7em; letter-spacing: -1.2px; color: rgba(255,255,255,0.7);}

.display-items {opacity: 0; display: flex; flex-wrap: wrap; margin: -20px;}
.display-item {width: 33.3333%; padding: 20px;}
.display-item-img {border-radius: 4px; margin-bottom: 20px; overflow: hidden;}
.display-item-img img {width: 100%; transition: all 0.5s;}
.display-item a:hover .display-item-img img {transform: scale(1.05);}
.display-item-text p {font-size: 22px; font-weight: 500; line-height: 1.63em; letter-spacing: -1.32px; color: #333; text-align: center; transition: all 0.5s;}
.display-item a:hover .display-item-text p {color: #0F367A;}

.section.on .product-overview-heading {animation: fadeUp 1.2s 0.3s forwards;}
.section.on .product-overview-desc {animation: fadeUp 1.2s 0.5s forwards;}
.section.on .display-items {animation: fadeUp 1.2s 0.3s forwards;}

.page-product-display .product-new-items:hover .product-new-item:not(:hover) {flex: 0.5;}
.page-product-display .product-new-item:hover {flex: 6;}
.page-product-display .product-new-item:nth-child(1) .backdrop {background-image: url('../img/sub/product-display-item01.jpg');}
.page-product-display .product-new-item:nth-child(2) .backdrop {background-image: url('../img/sub/product-display-item02.jpg');}
.page-product-display .product-new-item:nth-child(3) .backdrop {background-image: url('../img/sub/product-display-item03.jpg');}
.page-product-display .product-new-item:nth-child(4) .backdrop {background-image: url('../img/sub/product-display-item04.jpg');}
.page-product-display .product-new-item:nth-child(5) .backdrop {background-image: url('../img/sub/product-display-item05.jpg');}
.page-product-display .product-new-item:nth-child(6) .backdrop {background-image: url('../img/sub/product-display-item06.jpg');}
.page-product-display .product-new-item .content .title .en {margin-bottom: 0;}
.page-product-display .product-new-item .intro-title span {font-family:'Noto Sans KR';}
.page-product-display .product-new-list:hover .product-new-item:not(:hover) .intro-title span br {display: none;}

/* S402 */
.product-slide-item {position: relative;}
.product-slide-item-inner {position: relative;}
.product-slide-img {position: relative;}
.product-slide-img img {width: 100%;}
.product-slide-hotspots .hotspot {position: absolute; cursor: pointer; z-index: 20;}

.product-slide-item-living .hotspot[data-target="01"] {left:18.7%; top:27.4%; width:4.1%; height:6.5%;}
.product-slide-item-living .hotspot[data-target="02"] {left:10.2%; top:34.9%; width:10.5%; height:31.8%;}
.product-slide-item-living .hotspot[data-target="03"] {left:23.4%; top:46.5%; width:16.6%; height:14.1%;}
.product-slide-item-living .hotspot[data-target="04"] {left:20.1%; top:74.1%; width:2.7%; height:3.8%;}
.product-slide-item-living .hotspot[data-target="05"] {left:13.5%; top:76.4%; width:5.1%; height:12.8%;}
.product-slide-item-living .hotspot[data-target="06"] {left:24.8%; top:89.9%; width:8.6%; height:9.8%;}
.product-slide-item-living .hotspot[data-target="07"] {left:54.8%; top:16.4%; width:15.5%; height:7.9%;}
.product-slide-item-living .hotspot[data-target="08"] {left:57.3%; top:32.7%; width:3.0%; height:4.2%;}
.product-slide-item-living .hotspot[data-target="09"] {left:53.2%; top:40.9%; width:6.3%; height:23.5%;}
.product-slide-item-living .hotspot[data-target="10"] {left:61.6%; top:51.2%; width:4.2%; height:9.4%;}
.product-slide-item-living .hotspot[data-target="11"] {left:61.6%; top:59.2%; width:4.1%; height:12.9%;}
.product-slide-item-living .hotspot[data-target="12"] {left:50.8%; top:71.4%; width:22.0%; height:8.6%;}
.product-slide-item-living .hotspot[data-target="13"] {left:47.7%; top:75.3%; width:14.0%; height:24.1%;}
.product-slide-item-living .hotspot[data-target="14"] {left:68.8%; top:57.9%; width:4.0%; height:6.1%;}
.product-slide-item-living .hotspot[data-target="15"] {left:77.7%; top:67.6%; width:6.3%; height:22.4%;}
.product-slide-item-living .hotspot[data-target="16"] {left:84.3%; top:38.7%; width:11.1%; height:58.7%;}

.product-slide-item-bath .hotspot[data-target="01"] {left:5.9%; top:11.9%; width:24.2%; height:82.2%;}
.product-slide-item-bath .hotspot[data-target="02"] {left:35.1%; top:10.0%; width:34.4%; height:15.4%;}
.product-slide-item-bath .hotspot[data-target="03"] {left:31.3%; top:42.9%; width:4.1%; height:19.3%;}
.product-slide-item-bath .hotspot[data-target="04"] {left:51.6%; top:65.1%; width:14.0%; height:33.7%;}
.product-slide-item-bath .hotspot[data-target="05"] {left:72.7%; top:30.7%; width:17.2%; height:37.5%;}
.product-slide-item-bath .hotspot[data-target="06"] {left:72.7%; top:69.1%; width:17.2%; height:30.0%;}

.product-slide-title-eng {position: absolute; bottom: 180px; left: 80px; font-size: 26px; font-weight: 500; line-height: normal; letter-spacing: -1.56px; color: #fff; opacity: 0.7;}
.product-slide-title-kor {position: absolute; bottom: 80px; left: 80px; font-size: 68px; font-weight: 700; line-height: 1.26em; letter-spacing: -4.08px; color: #fff;}

.product-slide-dots .dot {position: absolute; z-index: 10; width: 14px; height: 14px; border: 2px solid #888; border-radius: 50%; background: #fff; box-shadow: 0 0 8px #fff; transform: translate(-50%, -50%); transition: all 0.3s ease;}
.product-slide-item-living .product-slide-dots .dot[data-target="01"] {left:20.75%; top:30.65%;}
.product-slide-item-living .product-slide-dots .dot[data-target="02"] {left:15.45%; top:50.80%;}
.product-slide-item-living .product-slide-dots .dot[data-target="03"] {left:31.70%; top:53.55%;}
.product-slide-item-living .product-slide-dots .dot[data-target="04"] {left:21.45%; top:76.00%;}
.product-slide-item-living .product-slide-dots .dot[data-target="05"] {left:16.05%; top:82.80%;}
.product-slide-item-living .product-slide-dots .dot[data-target="06"] {left:29.10%; top:94.80%;}
.product-slide-item-living .product-slide-dots .dot[data-target="07"] {left:62.55%; top:20.35%;}
.product-slide-item-living .product-slide-dots .dot[data-target="08"] {left:58.80%; top:34.80%;}
.product-slide-item-living .product-slide-dots .dot[data-target="09"] {left:56.35%; top:52.65%;}
.product-slide-item-living .product-slide-dots .dot[data-target="10"] {left:63.70%; top:55.90%;}
.product-slide-item-living .product-slide-dots .dot[data-target="11"] {left:63.65%; top:65.65%;}
.product-slide-item-living .product-slide-dots .dot[data-target="12"] {left:61.80%; top:75.70%;}
.product-slide-item-living .product-slide-dots .dot[data-target="13"] {left:54.70%; top:87.35%;}
.product-slide-item-living .product-slide-dots .dot[data-target="14"] {left:70.80%; top:60.95%;}
.product-slide-item-living .product-slide-dots .dot[data-target="15"] {left:80.85%; top:78.80%;}
.product-slide-item-living .product-slide-dots .dot[data-target="16"] {left:89.85%; top:68.05%;}

.product-slide-item-bath .product-slide-dots .dot[data-target="01"] {left:18.0%; top:52.9%;}
.product-slide-item-bath .product-slide-dots .dot[data-target="02"] {left:52.2%; top:17.7%;}
.product-slide-item-bath .product-slide-dots .dot[data-target="03"] {left:33.6%; top:53.6%;}
.product-slide-item-bath .product-slide-dots .dot[data-target="04"] {left:58.6%; top:81.9%;}
.product-slide-item-bath .product-slide-dots .dot[data-target="05"] {left:81.3%; top:49.5%;}
.product-slide-item-bath .product-slide-dots .dot[data-target="06"] {left:81.3%; top:84.1%;}

.product-slide-dots .dot::after {content: ''; position: absolute; top: 50%; left: 50%; width: 14px; height: 14px; border-radius: 50%; background: rgba(255,255,255,0.7); transform: translate(-50%, -50%) scale(1); opacity: 0;}
.product-slide-dots .dot.active {opacity: 1; width: 14px; height: 14px;}
.product-slide-dots .dot.active::after {animation: ripple 1s ease-out infinite;}
@keyframes ripple {
    0% {transform: translate(-50%, -50%) scale(1);
        opacity: 0.7;
    }
    100% {
        transform: translate(-50%, -50%) scale(5.8);
        opacity: 0;
    }
}

.product-slide-modals .modal {display: none; position: absolute; z-index: 30; background: #111; padding: 36px 30px 30px; width: 260px; max-width: 90%; border-radius: 4px; border: 1px solid rgba(255, 255, 255, 0.20); opacity: 0.85;}
.product-slide-modals .modal.active {display: block;}
.product-slide-modals .modal-inner {max-height: 80vh; display: flex; flex-direction: column;}
.product-slide-modals .modal-header {padding-bottom: 7px; border-bottom: 1px solid #fff;}
.product-slide-modals .modal-header h4 {font-size: 16px; font-weight: 500; line-height: 1.5em; letter-spacing: -0.96px; color: #fff;}
.product-slide-modals .modal-body {overflow-y: auto; flex: 1; max-height: 380px;} 
.product-slide-modals .modal-body::-webkit-scrollbar {width: 4px; height: 6px;}
.product-slide-modals .modal-body::-webkit-scrollbar-thumb {background: rgba(255,255,255,0.2); border-radius: 4px; cursor: pointer;}
.product-slide-modals .modal-body::-webkit-scrollbar-track {background: #000; border-radius: 4px;}
.product-slide-modals .modal-body a {position: relative; padding: 12px 13px 12px 0; border-bottom: 1px dashed rgba(255, 255, 255, 0.20); font-size: 16px; line-height: 1.8em; letter-spacing: -0.96px; color: rgba(255, 255, 255, 0.50); transition: all 0.3s;}
.product-slide-modals .modal-body a:after {content: ''; position: absolute; top: 50%; right: 5px; transform: translateY(-50%); width: 8px; height: 10px; background: url('../img/sub/btn-product-modal-view.png') no-repeat center center; opacity: 0.3; transition: all 0.3s;}
.product-slide-modals .modal-body a:hover {border-bottom: 1px dashed rgba(255, 255, 255, 1); color: #fff;}
.product-slide-modals .modal-body a:hover:after {opacity: 1;}
.product-slide-modals .btn-modal-close {position: absolute; top: 20px; right: 20px; background: transparent; border: none; opacity: 0.3; transition: all 0.5s;}
.product-slide-modals .btn-modal-close:hover {opacity: 0.8;}

.product-slide-items .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; display: flex; justify-content: center; align-items: center; width: 44px; height: 56px; border-radius: 10px; background: rgba(255, 255, 255, 0.20); background-repeat: no-repeat; background-position: 50% 50%; border: none; font-size: 0; transition: all 0.5s;}
.product-slide-items .slick-arrow:hover {background-color: rgba(255,255,255,0.3);}
.product-slide-items .slick-prev {left: 80px; background-image: url('../img/sub/btn-product-slide-prev.png');}
.product-slide-items .slick-next {right: 80px; background-image: url('../img/sub/btn-product-slide-next.png');}
.product-slide-items .slick-dots {position: absolute; bottom: 80px; right: 80px; display: flex; gap: 10px; padding: 8px; border-radius: 100px; background: rgba(255, 255, 255, 0.20);}
.product-slide-items .slick-dots button {font-size: 20px; font-weight: 700; line-height: 1.7em; letter-spacing: -1.2px; color: #fff; text-align: center; padding: 8px 24px; border-radius: 60px; background: transparent; transition: all 0.5s; border: none;}
.product-slide-items .slick-dots .slick-active button {background: #0F367A;}

/* S403 */
.product-slide-item-front .hotspot[data-target="01"] {left:30.31%; top:16.19%; width:24.17%; height:10%;}
.product-slide-item-front .hotspot[data-target="02"] {left:25.63%; top:40.62%; width:4.84%; height:19.59%;}
.product-slide-item-front .hotspot[data-target="03"] {left:32.14%; top:27.01%; width:8.54%; height:43.81%;}
.product-slide-item-front .hotspot[data-target="04"] {left:41.15%; top:27.22%; width:23.18%; height:23.92%;}
.product-slide-item-front .hotspot[data-target="05"] {left:44.95%; top:65.26%; width:7.76%; height:18.97%;}
.product-slide-item-front .hotspot[data-target="06"] {left:60.36%; top:60.52%; width:6.46%; height:8.56%;}
.product-slide-item-front .product-slide-dots .dot[data-target="01"] {left:42.40%; top:21.19%;}
.product-slide-item-front .product-slide-dots .dot[data-target="02"] {left:28.05%; top:50.42%;}
.product-slide-item-front .product-slide-dots .dot[data-target="03"] {left:36.41%; top:48.92%;}
.product-slide-item-front .product-slide-dots .dot[data-target="04"] {left:52.74%; top:39.18%;}
.product-slide-item-front .product-slide-dots .dot[data-target="05"] {left:48.83%; top:74.75%;}
.product-slide-item-front .product-slide-dots .dot[data-target="06"] {left:63.59%; top:64.80%;}

.product-slide-item-back .hotspot[data-target="01"] {left:24.74%; top:32.58%; width:5.63%; height:9.59%;}
.product-slide-item-back .hotspot[data-target="02"] {left:43.70%; top:41.86%; width:3.96%; height:8.56%;}
.product-slide-item-back .hotspot[data-target="03"] {left:56.82%; top:20.41%; width:5.05%; height:4.02%;}
.product-slide-item-back .hotspot[data-target="04"] {left:49.32%; top:24.95%; width:21.88%; height:2.27%;}
.product-slide-item-back .hotspot[data-target="05"] {left:49.95%; top:27.84%; width:26.20%; height:11.03%;}
.product-slide-item-back .hotspot[data-target="06"] {left:48.39%; top:40.62%; width:31.98%; height:5.26%;}
.product-slide-item-back .hotspot[data-target="07"] {left:57.08%; top:47.84%; width:20.94%; height:7.84%;}
.product-slide-item-back .product-slide-dots .dot[data-target="01"] {left:27.56%; top:37.38%;}
.product-slide-item-back .product-slide-dots .dot[data-target="02"] {left:45.68%; top:46.14%;}
.product-slide-item-back .product-slide-dots .dot[data-target="03"] {left:59.35%; top:22.42%;}
.product-slide-item-back .product-slide-dots .dot[data-target="04"] {left:60.26%; top:26.08%;}
.product-slide-item-back .product-slide-dots .dot[data-target="05"] {left:63.05%; top:33.36%;}
.product-slide-item-back .product-slide-dots .dot[data-target="06"] {left:64.38%; top:43.25%;}
.product-slide-item-back .product-slide-dots .dot[data-target="07"] {left:67.55%; top:51.76%;}

.product-slide-item-inside .hotspot[data-target="01"] {left:46.46%; top:15.36%; width:13.39%; height:8.14%;}
.product-slide-item-inside .hotspot[data-target="02"] {left:28.91%; top:33.09%; width:48.23%; height:12.27%;}
.product-slide-item-inside .hotspot[data-target="03"] {left:46.46%; top:45.88%; width:13.49%; height:16.70%;}
.product-slide-item-inside .hotspot[data-target="04"] {left:49.40%; top:65.77%; width:7.67%; height:12.58%;}
.product-slide-item-inside .hotspot[data-target="05"] {left:46.77%; top:81.34%; width:12.71%; height:14.64%;}
.product-slide-item-inside .hotspot[data-target="06"] {left:3.91%; top:40.82%; width:25.68%; height:12.68%;}
.product-slide-item-inside .hotspot[data-target="07"] {left:76.30%; top:40.62%; width:23.28%; height:12.37%;}
.product-slide-item-inside .hotspot[data-target="08"] {left:46.40%; top:65.77%; width:2.40%; height:12.58%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="01"] {left:53.15%; top:19.43%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="02"] {left:53.03%; top:39.23%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="03"] {left:53.21%; top:54.23%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="04"] {left:53.24%; top:72.06%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="05"] {left:53.13%; top:88.66%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="06"] {left:16.75%; top:47.16%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="07"] {left:87.94%; top:46.80%;}
.product-slide-item-inside .product-slide-dots .dot[data-target="08"] {left:48.2%; top:72.06%;}

.product-slide-item-inside02 .hotspot[data-target="01"] {left:28.91%; top:34.02%; width:47.50%; height:65.46%; clip-path: polygon(0.66% 0.46%, 0% 15.27%, 37.50% 17.00%, 33.55% 96.11%, 70.39% 100%, 65.57% 16.54%, 100% 16.15%, 96.00% 0%);}
.product-slide-item-inside02 .product-slide-dots .dot[data-target="01"] {left:53.2%; top:66.75%;}

.product-slide-item-battery .hotspot[data-target="01"] {left:62.03%; top:38.87%; width:5.57%; height:16.08%;}
.product-slide-item-battery .product-slide-dots .dot[data-target="01"] {left:64.82%; top:46.91%;}

/* S404 */
.product-new-items {display: flex; width: 100%; height: 100%;}
.product-new-item {flex: 1; min-width: 0; transition: all 0.8s;}
.product-new-items:hover .product-new-item:not(:hover) {flex: 0.6;}
.product-new-item:hover {flex: 5.3;}
.product-new-item > a {position: relative; display: block; height: 100%; overflow: hidden; cursor: default;}
.product-new-item-inner {position: relative; display: block; height: 100%; overflow: hidden;}
.product-new-item .backdrop {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; overflow: hidden; transition: all 0.8s;}
.product-new-item:nth-child(1) .backdrop {background-image: url('../img/sub/product-new-item01.jpg');}
.product-new-item:nth-child(2) .backdrop {background-image: url('../img/sub/product-new-item02.jpg');}
.product-new-item:nth-child(3) .backdrop {background-image: url('../img/sub/product-new-item03.jpg');}
.product-new-item:nth-child(4) .backdrop {background-image: url('../img/sub/product-new-item04.jpg');}
.product-new-item .content {position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; padding: 100px 80px; z-index: 5;}
.product-new-item .content .title {opacity: 0; transform: translateY(40px);}
.product-new-item:hover .content .title {opacity: 1; transform: translateY(0); transition: all 0.8s 0.5s;}
.product-new-item .content .title .en {font-family: "Poppins", sans-serif; font-size: 40px; font-weight: 600; line-height: 1.3em; letter-spacing: -1.2px; color: #fff; margin-bottom: 24px;}
.product-new-item .content .title .ko {font-size: 20px; line-height: 1.7em; letter-spacing: -1.2px; color: rgba(255, 255, 255, 0.70);}
.product-new-item .intro-title {z-index: 10; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: auto; height: auto;}
.product-new-item .intro-title span {display: inline-block; white-space: nowrap; font-family: "Poppins", sans-serif; font-size: 40px; font-weight: 600; line-height: 1.3em; letter-spacing: -1.2px; color: #fff; text-align: center; transition: all 0.6s;}
.product-new-item:hover .intro-title span {opacity: 0;}
.product-new-item .intro-title span .mob-only {display: none;}
.product-new-list:hover .product-new-item:not(:hover) .intro-title span {font-size: 32px; transform: rotate(-90deg);}

/* DISPLAY, NEW PRODUCTS 제품 리스트 팝업 추가 */
.product-slide-modals-expand .modal {display: block; opacity: 0; top: 50%; transform: translateY(-34%); right: 80px; transition: all 0.8s;}
.product-new-item:hover .product-slide-modals-expand .modal {opacity: 1; transform: translateY(-50%); transition-delay: 0.5s;}
.product-slide-modals-expand .modal-body {max-height: 380px;} 

/* S501 */
.product-search-bar {display: flex; justify-content: space-between; gap: 10px; margin-bottom: 70px;}
.search-bar_left {width: 1%; flex: 1 1 auto; display: flex; flex-direction: column; gap: 10px;}
.search-bar_category {display: flex; gap: 8px;}
.search-bar_category select {flex: 1; height: 54px; padding: 0 25px; border-radius: 4px; border: 1px solid #DDD; background: #FFF; font-size: 16px; font-weight: 500; line-height: 1.5em; letter-spacing: -0.96px; color: #888; -webkit-appearance : none; -moz-appearance: none; appearance: none;  background: url('../img/sub/icon-select.png') no-repeat 92% 52%;}
.search-bar_category select:focus {border: 1px solid #666; outline: none; color: #333;}
.search-bar_category option {background: #F8F8F8; font-size: 16px; color: #333;}
.search-bar_keyword input {width: 100%; height: 54px; padding: 0 25px; border-radius: 4px; border: 1px solid #DDD; font-size: 16px; font-weight: 500; line-height: 1.5em; letter-spacing: -0.96px; color: #333;}
.search-bar_keyword input::placeholder {color: #ddd;}
.search-bar_keyword input:focus {border: 1px solid #666; outline: none;}
.search-bar_right {max-width: 144px; width: 100%;}
.product-search-bar .btn-search {width: 100%; height: 100%; border-radius: 4px; background: #0F367A; font-size: 18px; font-weight: 500; line-height: 1.33em; letter-spacing: -1.08px; color: #fff; text-align: center; border: none;}
.page-product-search .product-list-table {margin-top: 50px; margin-bottom: 100px;}

/* 제품검색 기본 카테고리 */
.product-cate-list .product-items {display: flex; flex-wrap: wrap; margin: -5px;}
.product-cate-list .product-item {width: 20%; padding: 5px;}
.product-cate-list .product-item-inner {position: relative; height: 100%;}
.product-cate-list .product-item-inner:before {position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 100%; border: 1px solid #ddd; z-index: -1;}
.product-cate-list .product-depth1-title {display: flex; justify-content: center; align-items: center; min-height: 88px; font-size: 20px; font-weight: 500; line-height: 1.7em; letter-spacing: -1.2px; color: #fff; text-align: center; padding: 10px; background: #0F367A;}
.product-cate-list .product-depth2-title {font-size: 18px; font-weight: 500; line-height: 1.33em; letter-spacing: -1.08px; color: #333; text-align: center; padding: 12px 10px; background: #F8F8F8; border-left: 1px solid #ddd; border-right: 1px solid #ddd;}
.product-cate-list .product-depth3-items {padding: 20px 11px 30px;}
.product-cate-list .product-depth3-item > a {font-size: 18px; line-height: 1.5em; letter-spacing: -1.08px; color: #666; text-align: center; padding: 5px 0; transition: all 0.5s;}
.product-cate-list .product-depth3-item > a:hover {color: #0F367A; text-decoration-line: underline; text-underline-offset: 2px;}
.product-cate-list .product-depth4-items {padding: 16px 10px; border-radius: 4px; background: rgba(15, 54, 122, 0.05); margin-top: 16px;}
.product-cate-list .product-depth4-item > a {font-size: 16px; line-height: 1.5em; letter-spacing: -0.96px; color: #888; text-align: center; padding: 2px 0; transition: all 0.5s;}
.product-cate-list .product-depth4-item > a:hover {color: #0F367A;}

/* 제품검색 리스트 */
.product-list-table table {table-layout: fixed; width: 100%; border-radius: 4px 4px 0 0; overflow: hidden;}
.product-list-table table thead {}
.product-list-table table thead th {font-size: 20px; font-weight: 500; line-height: 1.7em; letter-spacing: -1.2px; color: #fff; text-align: center; background: #0F367A; padding: 10px;}
.product-list-table table thead th:not(:last-child) {border-right: 1px solid rgba(221, 221, 221, 0.30);}
.product-list-table table tbody tr {border-bottom: 1px solid #ddd; transition: all 0.5s;}
.product-list-table table tbody tr:hover {background: #f9f9f9;}
.product-list-table table tbody td {font-size: 18px; font-weight: 500; line-height: 1.33em; letter-spacing: -1.08px; color: #666; text-align: center; padding: 20px 10px;}
.product-list-table table tbody td:not(:last-child) {border-right: 1px solid #DDD;}
.product-list-table table tbody td a {display: inline-block; transition: all 0.5s;}
.product-list-table table tbody td a:hover {color: #0F367A; text-decoration-line: underline; text-underline-offset: 2px;}
.product-list-table table tbody td .table-item-title {display: none;}

/* 제품검색 뷰 */
.product-view-nav ul {display: flex; flex-wrap: wrap;}
.product-view-nav ul li {width: 16.66666666%; min-height: 80px; margin-bottom: -1px;}
.product-view-nav ul li a {display: flex; justify-content: center; align-items: center; height: 100%; font-size: 20px; font-weight: 400; line-height: 1.5em; color: #666; text-align: center; padding: 10px 5px; border: 1px solid #ddd; margin-left: -1px; transition: all 0.4s;}
.product-view-nav ul li a:hover {color: #0F367A;}
.product-view-nav ul li.is-active a {font-weight: 500; background: #0F367A; color: #fff; border: 1px solid #0F367A;}
.product-view-wrap {border-radius: 4px; border: 1px solid #DDD; /* padding: 80px 70px 90px; */}
.product-view-item:not(:last-child) {margin-bottom: 50px;}
.product-view-item-title {padding-bottom: 30px; margin-bottom: 36px; border-bottom: 1px solid #ddd;}
.product-view-item-title h4 {position: relative; font-size: 36px; font-weight: 700; line-height: 1.38em; letter-spacing: -1.08px; color: #000; padding-left: 22px;}
.product-view-item-title h4:before {position: absolute; top: 10px; left: 0; content: ''; width: 6px; height: 31px; border-radius: 6px; opacity: 0.5; background: #0F367A;}
.product-view-item-title h4:after {position: absolute; top: 17px; left: 0; content: ''; width: 6px; height: 24px; border-radius: 6px; background: #0F367A;}
.product-view-item-desc {font-size: 22px; line-height: 1.72em; letter-spacing: -1.32px; color: #666;}
.product-view-item-desc .dot-list {position: relative; padding-left: 18px;}
.product-view-item-desc .dot-list:before {content: ''; position: absolute; top: 18px; left: 0; width: 4px; height: 4px; background: #0F367A;}

@keyframes fadeDown {
    0% {
        opacity: 0;
		transform: translateY(-40px);
    }

    100% {
        opacity: 1;
		transform: translateY(0);
    }
}

@keyframes fadeUp {
    0% {
        opacity: 0;
		transform: translateY(40px);
    }

    100% {
        opacity: 1;
		transform: translateY(0);
    }
}

@keyframes line {
    0% {
        opacity: 0;
		height: 0;
		transform: translateY(-40px);
    }

    100% {
        opacity: 1;
		height: 250px;
		transform: translateY(0);
    }
}

@keyframes opacity {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}