@charset "utf-8";

.box {position: relative;}
.box:after {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd;}
.pb120-40 {padding-bottom: var(--padding-120-40);}
.pt120-40 {padding-top: var(--padding-120-40);}
.pb100-40 {padding-bottom: var(--padding-100-40);}
.pt100-40 {padding-top: var(--padding-100-40);}
.position-center {margin: 0 auto;}
.indent17 {padding-left: 17px;}
.dot-tit {position: relative;}
.dot-tit:before {position: absolute; content: ''; top: 50%; margin-top: -2px; left: -17px; width: 5px; height: 5px; border-radius: 100%; background: #ccc;}

.w560 {max-width: 560px;}
.w520 {max-width: 520px;}

.desc p:not(:last-child) {margin-bottom: 12px;}
.why .sec-welcome strong {display: block;}
.why .sec-advantage h3 {margin-bottom:5px;}
.why .sec-advantage p {line-height: 1.625em;}
.why .sec-world h2 {margin-bottom:clamp(0.9375rem, -0.3125rem + 3.125vw, 3.4375rem); letter-spacing: -.04em;}
.why .sec-world .world-top {gap: 30px;}
.why .sec-world .world-top .img {flex: 1;}
.why .world-workflow .box {padding: 18px 30px 30px; background: #fff;}

.overview .sec-welcome {position: relative; padding-top: 40px;}
.overview .sec-welcome .flex-wrap {padding:clamp(1.25rem, 0.3125rem + 2.3438vw, 3.125rem) clamp(1.25rem, 0rem + 3.125vw, 3.75rem) clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem); margin-bottom:clamp(1.875rem, 0.4063rem + 3.6719vw, 4.8125rem);}
.overview .sec-welcome .img {position: absolute; top: 0; width: 31%; height: 100%; max-width: 371px; padding: 0 clamp(0.9375rem, 0rem + 2.3438vw, 2.8125rem);}
.overview .sec-welcome .txt-box {width: 61%; max-width: 650px; height: fit-content; margin-left: auto; padding:clamp(1.25rem, 0.4688rem + 1.9531vw, 2.8125rem) clamp(1.25rem, 0.3125rem + 2.3438vw, 3.125rem); background:var(--primary-color);}
.overview .sec-welcome h2 {line-height: 1.5em;}
.overview .sec-welcome .txt-box p {opacity: .7;}

.overview .sec-vision {position: relative;}
.overview .sec-vision:before, .overview .sec-vision:after {position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 55px; background: linear-gradient(to bottom, #fff, transparent);}
.overview .sec-vision:after {top: auto; bottom: 0; background: linear-gradient(to top, #fff, transparent);}
.overview .vision-item {padding:clamp(1.25rem, 0.3125rem + 2.3438vw, 3.125rem) 15px; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.1);}
.overview .vision-item p {opacity: .7;}

.overview .sec-shortcut .sec-top {gap: 40px;}
.overview .sec-shortcut .sec-top .img {box-shadow: 5px 5px 10px rgba(0,0,0,.16)}
.overview .shortcut-item .txt {width: 50%;}
.overview .shortcut-item .img {flex:1; padding-right: 30px;}
.overview .shortcut-item:last-child .img {padding-right: 0; padding-left: 30px;}

.greetings {letter-spacing: -.01em;}
.greetings h2 {font-size: clamp(1.625rem, -0.6875rem + 5.7813vw, 6.25rem); line-height: 1em; margin-top: 20px;}
.greetings .sec-top {position: relative; padding-top: clamp(1.25rem, 0rem + 3.125vw, 3.75rem); padding-bottom:clamp(0.9375rem, 0rem + 2.3438vw, 2.8125rem);}
.greetings .sec-top .flex-wrap {align-items: flex-end; justify-content: space-between; gap: 60px; background: url('/images/sub/bg-greetings.jpg') no-repeat center center; background-size: cover; border-radius: 0 120px 0 0; padding: 0 clamp(1.25rem, 0.625rem + 1.5625vw, 2.5rem);;}
.greetings .sec-top .img {margin-top: calc(clamp(1.25rem, 0rem + 3.125vw, 3.75rem) * -1); padding-right: 30px;}
.greetings .sec-top .txt {margin-bottom: calc(clamp(0.9375rem, 0rem + 2.3438vw, 2.8125rem) * -1);}
.greetings .desc {line-height: 1.4444em;}
.greetings .desc p:not(:last-child) {margin-bottom: 22px;}
.greetings .writer-wrap {justify-content: flex-end; text-align: right;}
.greetings .writer-wrap .img {margin-top:17px;}

.history .sec-top {padding:clamp(1.5625rem, 0.1563rem + 3.5156vw, 4.375rem) clamp(0.9375rem, -0.4688rem + 3.5156vw, 3.75rem); margin-bottom:clamp(1.25rem, 0.1563rem + 2.7344vw, 3.4375rem); background: url('/images/sub/bg-history.jpg') no-repeat center center; background-size: cover;}
.history .sec-top .txt {background: var(--primary-color); width: fit-content; padding: 17px 25px;}
.history .item {display: flex; gap: 40px;}
.history-year {display: flex; align-items: center; justify-content: center; width: 20.83333%; text-align: center; font-weight: 700; color: var(--primary-color); font-size: clamp(1.125rem, 1rem + 0.3125vw, 1.375rem);border-bottom: 1px solid #ddd;}
.history-cnt {flex: 1; padding:clamp(0.75rem, 0.1875rem + 1.4063vw, 1.875rem) 0; border-bottom: 1px solid #ddd;}
.history-cnt li {display: flex;}
.history-cnt li:not(:last-child) {margin-bottom: 14px;}
.history-month {position: relative; min-width: 92px; height: fit-content; padding-left: 30px; font-weight: 700; color: var(--dark-color);}
.history-month:before {position: absolute; content: ''; top: 50%; left: 0; margin-top: -3px; width: 6px; height: 6px; border-radius: 100%; background: var(--primary-color); opacity: .7;}
.history .item:first-child .history-year,
.history .item:first-child .history-cnt {border-top: 2px solid #242424;}

.cert-list ul {display: flex; flex-wrap: wrap; margin: -25px -15px; text-align: center;}
.cert-list li {padding: 25px 15px; width: 25%;}
.cert-list .thumb {position: relative; margin-bottom:clamp(0.75rem, 0.1875rem + 1.4063vw, 1.875rem);}
.cert-list .thumb:after {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd;}
.cert-list .date {color: #878787;}

.product-all-list ul {display: flex; flex-wrap: wrap; margin: -20px; padding-bottom: 50px;}
.product-all-list li {width: 33.33335%; padding: 20px;}
.product-all-list .txt {padding: 18px 15px 28px; border-bottom: 3px solid #eee; transition: .1s;}
.product-all-list li:hover .txt {border-color: var(--primary-color);}

.product .sec {background: #fff;}
.product .sec-welcome .flex-mid {position: relative; z-index:1; justify-content: space-between; height: 100vh; max-height: 832px; padding: clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem) 0;}
.product .sec-welcome .img {position: absolute; right: 0; z-index: -1;}
.product .sec-welcome .img.timaxilla-img:after {position: absolute; content: ''; height: 100%; top: 0; right: 0; width: 10%; background: linear-gradient(to right, transparent, #fff);}
.product .sec-welcome .img.timaxilla-img:before {position: absolute; content: ''; width: 100%; height: 10%; top: 0; right: 0; background: linear-gradient(to top, transparent, #fff);}
.product .sec-fixed {position: relative; background: unset; padding: 10vh 0; overflow: hidden;}
.product .sec-fixed:before, .product .sec-fixed:after, .product .sec-download:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height:10vh; background: linear-gradient(to top,rgba(47,47,47,0) 0%, #fff 100%);}
.product .sec-fixed:after {top: auto; bottom: 0;  background: linear-gradient(to bottom,rgba(47,47,47,0) 0%, #fff 100%);}
.sec-fixed .flex-mid {min-height: 80vh; padding: calc(clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem)) 15px;}
.sec-fixed .bg img {width: 100%;height: auto;min-width: 100%;min-height: 100%;position: fixed;z-index: -1;top: 50%;left: 50%;transform: translate(-50%, -50%);object-fit: cover}
.product .sec-fixed .txt {flex: 1; padding-right: 35px;}

.sec-fixed .dot-list li {position: relative; padding-left: 17px; font-weight: 700;}
.sec-fixed .dot-list li:before {position: absolute; content: ''; top: 50%; margin-top: -2px; left: 0; width: 5px; height: 5px; border-radius: 100%; background: #ccc;}
.sec-fixed .dot-list li:not(:last-child) {margin-bottom: 14px;}
.product .sec-fixed .img {width: 33.33335%; text-align: right;}
.product .sec-fixed .double-imgs {width: 50%; gap: 10px; justify-content: space-between;}
.product .sec-fixed .double-imgs .photo {position: relative; }
.product .sec-fixed .double-imgs .thumb-tit {position: absolute; margin-top:clamp(0.625rem, 0rem + 1.5625vw, 1.875rem); width: 100%;}
.product .sec-fixed .number-items {margin: 0 -15px;}
.product .sec-fixed .number-items .item {padding: 0 15px;}
.product .sec-fixed .number-items .thumb {border-radius: 30px; overflow: hidden;}
.product .sec-fixed .number-items .txt {padding: 0;}
.product .sec-fixed .number-items p {padding: 0 12px;}
.product .sec-fixed.active {position: fixed; top: var(--header-height); left: 0; width: 100%; z-index: 1;}
html.fixed {overflow: hidden;}
.product .sec-circles {padding: clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem) 0;}
.product .sec-circles .circle-items {margin: -27px 0;}
.product .sec-circles .circle-items.eight-items {flex-wrap: wrap; max-width: 800px; margin: 0 auto;}
.product .sec-circles .circle-items.five-items {max-width: 1000px; margin: 0 auto;}
.product .sec-circles .circle-items.four-items {max-width: 800px; margin: 0 auto;}
.product .sec-circles .circle-items .item {flex: 1; padding: 27px 15px;}
.product .sec-circles .circle-items.eight-items .item {width: 25%; flex: none;}
.product .sec-circles .circle {width: 114px; height: 114px; margin: 0 auto clamp(0.9375rem, 0.625rem + 0.7813vw, 1.5625rem); background: rgba(0,72,146,.05);border: 2px solid var(--primary-color); border-radius: 100%;}
.product .sec-download {position: relative; padding: calc(10vh + clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem)) 0 clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem); background: url('/images/sub/bg-product-download.jpg') no-repeat center center; background-size: cover;}
.product .sec-download .flex-wrap {justify-content: space-between; gap: 14px;}
.product .sec-download .left .txt {min-height: 310px; padding-bottom: clamp(1.5625rem, 1.0938rem + 1.1719vw, 2.5rem);}
.product .sec-download h2 {line-height: 1.25em;}
.product .sec-download .left {flex: 1;}
.product .sec-download .left p {line-height: 1.33333em;}
.product .download-cnt .items {justify-content: flex-start; gap:clamp(1.25rem, -1.25rem + 6.25vw, 6.25rem);}
.product .download-cnt .circle {width: 114px; height: 114px; margin-left: auto; margin-right: auto; background: #fff; border-radius: 100%;}
.product .download-cnt .btn-down {gap: 15px; padding: 11px 25px; background: #fff; border-radius: 24px; color: #000; font-weight: 600; font-size: 18px; transition: all .2s;}
.product .download-cnt .item:hover .btn-down {background: var(--primary-color); color: #fff;}
.product .download-cnt .item:hover .btn-down .icon img {filter: brightness(10) invert(1);}
.product .sec-download .right {width: 33.333335%;}
.product .sec-download .right-tit {margin-top: clamp(0.9375rem, 0.7813rem + 0.3906vw, 1.25rem); text-align: center;}

.technology .sec {background: #fff;}
.technology .world-workflow {position: relative;}
.technology .world-workflow:before {position: absolute; content: ''; top: calc(clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem) * -1); width: 100%; height: clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem); background: #fff;}
.technology .sec-fixed {background: unset;}
.technology .sec-fixed .flex-mid {min-height: auto;}
.technology .sec-fixed .dot-list li {font-weight: 400;}
.technology .sec-fixed .dot-list li:before {top: 10px; margin: 0;}
.technology .sec-fixed .dot-list li:not(:last-child) {margin-bottom: 7px;}
.technology .sec-facility .flex-wrap {position: relative; max-width: 1000px; margin: 0 auto; background: #f6f6f6; border-radius: var(--radius40);}
.technology .sec-facility .img {flex: 1; border-radius: var(--radius40); overflow: hidden;}
.technology .sec-facility .circle {position: absolute; top: 50%; left: 50%; padding: 15px; margin-left: calc(var(--facility-circle) / -2); margin-top: calc(var(--facility-circle) / -2); width: var(--facility-circle); height: var(--facility-circle); border-radius: 100%; text-align: center; font-size: 20px; font-weight: 700; color: #fff;}
.technology .sec-facility .txt {display: flex; align-items: center; width: 50%; padding:clamp(1.25rem, 0.9375rem + 0.7813vw, 1.875rem) clamp(0.9375rem, 0.7813rem + 0.3906vw, 1.25rem) clamp(1.25rem, 0.9375rem + 0.7813vw, 1.875rem) 100px;}
.technology .sec-facility .txt ul li {position: relative; padding-left: 15px; line-height: 2.25em;}
.technology .sec-facility .txt ul li:before {position: absolute; content: ''; top: 15px; left: 0; width: 6px; height: 6px; border-radius: 100%; background: #ccc;}
.technology .facility-slider {position: relative; margin-bottom: 45px;}
.technology .facility-slider .slick-arrow {position: absolute; top: 50%; right: 0; margin-top: -20px; width: 41px; height: 41px;overflow: hidden; text-indent: -9999em; border: 0; background: url('/images/sub/facility-arrow.png') no-repeat center center; background-size: contain; transition: .2s; z-index: 1;}
.technology .facility-slider .slick-prev {right: auto; left: 0; transform: rotate(180deg);}
.technology .facility-slider .slick-arrow:hover {background: url('/images/sub/facility-arrow-hover.png') no-repeat center center; background-size: contain;}
.technology .facility-slider .slick-dots {position: absolute; bottom: -38px; display: flex; justify-content: center; gap: 8px; line-height: 0; width: 100%;}
.technology .facility-slider .slick-dots button {width: 8px; height: 8px; border-radius: 100%; background: #ddd; border: 0; overflow: hidden; text-indent: -9999em;}
.technology .facility-slider .slick-dots .slick-active button {background: var(--primary-color);}
.technology .sec-feature {padding-bottom:clamp(3.75rem, -1.7188rem + 13.6719vw, 14.6875rem);}
.technology .dot-tit:before {background: var(--dark-color);}
.cert-logos {gap: clamp(0.9375rem, -1.9063rem + 7.1094vw, 6.625rem);}
.delivery-wrap {position: relative;}
.delivery-wrap:before {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd; pointer-events: none;}
.delivery-wrap .img {flex: 1;}
.delivery-wrap .txt {width: 50%; padding:clamp(1.25rem, 0.9375rem + 0.7813vw, 1.875rem) clamp(0.9375rem, -0.4688rem + 3.5156vw, 3.75rem);}

.contact .directions {gap: 60px;}
.contact .direction {flex: 1;}
.contact .direction li {display: flex; gap: 8px;}
.contact .direction li:not(:last-child) {margin-bottom:clamp(0.625rem, 0.3125rem + 0.7813vw, 1.25rem);}
.contact .direction .icon {min-width: 24px;}
.contact iframe {width: 100% !important;}
.contact .file-upload {display:flex; height:44px; max-width: 530px; gap: 5px;}
.contact .file-button {display:flex; justify-content:center; align-items:center; height:100%; padding:0 20px; border:0; background:#fff; color:var(--primary-color); border: 1px solid var(--primary-color); cursor:pointer;}
.contact .file-add {display:flex; justify-content:center; align-items:center; height:100%; padding:0 20px; border:0; background:#fafafa; border: 1px solid #ddd; color:#2c2c2c; cursor:pointer;}
.contact .file-button:hover {background:var(--primary-color); color: #fff;}
.contact .file-add:hover {background: #eee;}
.contact .file-name {flex:1 1 auto; min-width:0; width:1%; display:flex; align-items:center; height:100%; padding:0 14px; border:1px solid #ddd;}