@charset "utf-8";
.dot-list li {text-indent: -.8em; padding-left: .8em;}
.dot-list li:before {content: '•'; margin-right: 8px; color: var(--primary-color);}
.deco-tit {display: flex; align-items: center;}
.deco-tit.type2 {flex-direction: column; align-items: flex-start; gap: var(--space-30);}
.deco-tit:before {content: ''; display: block; width: 32px; height: 32px; margin-right: var(--space-15); background: url('/images/sub/deco-tit.png') no-repeat center center / contain;}

.greeting-head .contain {position: relative;}
.greeting-logo {position: absolute; right: var(--container-space); bottom: 0; width: 16.5%; max-width: 245px;}
.greeting-body {padding: var(--space-60) 0; background: var(--secondary-color);}
.greeting-body .contain {gap: 25px 35px;}
.greeting-img {width:44.43%; max-width:622px;}

.history-head {padding: var(--space-100) 0; background: var(--secondary-color);}
.history-head .contain {gap: 30px clamp(35px, calc(100 / var(--inner) * 100vw), 100px); max-width: calc(50% + 730px); margin-right: 0;}
.history-head-title {width: 23%;}
.history-arrows {display: flex; gap: 8px; margin-top: clamp(25px, calc(90 / var(--inner) * 100vw), 90px);}
.history-arrows .btn-arrow {display: flex; align-items: center; justify-content: center; width: clamp(40px, calc(48 / var(--inner) * 100vw), 48px); height: clamp(40px, calc(48 / var(--inner) * 100vw), 48px); background: transparent; border-radius: 100%; border: 1px solid var(--primary-color); transition: .2s; color: var(--primary-color); font-weight: 600;}
.history-arrows .btn-arrow:hover {background: var(--primary-color); color: #fff;}
.history-slide-items .slick-list {margin:0 calc(clamp(5px, calc(12 / var(--inner) * 100vw), 12px) * -1);}
.history-slide-items .slick-slide {padding: 0 clamp(5px, calc(12 / var(--inner) * 100vw), 12px);}
.history-slide-txt {opacity: .5; transition: .2s;}
.slick-current .history-slide-txt {opacity: 1;}
.history-slide-item {width: clamp(260px, calc(360 / var(--inner) * 100vw), 360px) !important;}
.history-slide-thumb {position: relative; width: 100%; padding-bottom: 68.8889%; overflow: hidden;}
.history-slide-thumb img {position: absolute; top:0; left:0; width:100%; height:100%; object-fit: cover;}
.history-slide-txt h4:before {content: ''; display: block; width: 24px; height: 24px; margin-bottom: var(--space-15); border: 8px solid #FBE7DE; background: var(--primary-color); border-radius: 100%;}
.history-slide-txt li {text-indent: -1em; padding-left: 1em;}
.history-slide-txt li:before {content: '•'; margin-right: 8px; color: var(--primary-color);}

.history-wrap {padding-top:var(--space-100); position:relative;}
.history-wrap:before {top:0; bottom:0; position:absolute; left:21.43%; width:1px; background-color:#ddd; content:"";}
.history-item {padding-bottom:var(--space-80); display:flex; align-items:initial;}
.history-item:last-child {padding-bottom:0;}
.history-year {position:relative; top:0; left:0; width:21.43%; color:#999; font-size:var(--font-size-36); line-height:1.38889em; letter-spacing:-.03em; padding-right:0; display:flex; justify-content:space-between;}
.history-year strong {line-height:1em; display:inline-block; transition:all 0.5s ease; font-weight:600; flex:1;}
.history-month-box {padding-left:clamp(40px, calc(160 / var(--inner) * 100vw), 160px); flex:1;}
.history-detail {margin-bottom:15px; display:flex; gap: var(--space-40); transition:all 0.5s ease;}
.history-detail:last-child {margin-bottom:0;}
.history-detail .month {display:block; width: clamp(12px, calc(16 / var(--inner) * 100vw), 16px); height: clamp(12px, calc(16 / var(--inner) * 100vw), 16px); margin-top: 0.4em; border-radius: 100%; border: clamp(3px, calc(4 / var(--inner) * 100vw), 4px) solid #999;}
.history-detail ul {flex:1; list-style:none;}
.history-detail ul li {margin-bottom:var(--space-15);}
.history-detail ul li:last-child {margin-bottom:0;}

.history-item .dots {width:10px; height:10px; top:9px; right:-5px; margin:0; position:relative; border:2px solid #000; background:#fff; border-radius:50%; transition:all 0.3s; z-index:0;}
.history-item .dots .inner-dots {width:clamp(30px, calc(48 / var(--inner) * 100vw), 48px); height:clamp(30px, calc(48 / var(--inner) * 100vw), 48px); border: clamp(8px, calc(16 / var(--inner) * 100vw), 16px) solid #F9F9F9; position:absolute; background:#999; border-radius:100%; top:50%; left:50%; transform:translate(-50%,-50%); z-index:-1; transition:all 0.3s;}
.history-item.active .history-year {font-size:var(--font-size-56); color: var(--primary-color);}
.history-item.active .history-year strong {font-weight:700;}
.history-item.active .month {border-color:#CE2A1F;}
.history-item.active .dots .inner-dots {background: var(--primary-color); border-color: var(--secondary-color);}
.history-item.active .history-year strong {line-height:.6em;}

.patent-list ul {display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-40);}
.customer-list ul {display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-45) var(--space-20);}
.location-cnt strong {gap: 10px;}
.location-cnt strong:after {content: ''; display: block; width: 1px; height: 10px; background: #ddd; margin: 0 10px;}
.location-cnt ul {display: flex; flex-wrap: wrap; gap: var(--space-20) clamp(35px, calc(160 / var(--inner) * 100vw), 160px);}
.location-cnt ul li:first-child {width: 100%;}
.location-map {height: clamp(270px, calc(600 / var(--inner) * 100vw), 600px);}
.location-map iframe {width: 100% !important; height: 100% !important;}

.page-technology .sec {padding: var(--space-100) 0;}
.page-technology .sec.sec-tech-welcome {padding-top: 0;}
.page-technology .sec:nth-child(odd) {background: var(--secondary-color);}
.technology-welcome {gap: 25px 35px;}
.technology-welcome-txt {gap: var(--space-60);}
.technology-welcome-txt>*:not(.sub-title) {letter-spacing: -0.05em;}
.technology-welcome-img {position: relative; max-width: 674px; width: 48.215%; height: fit-content;}
.technology-welcome-img:before {content: ''; display: block; width: 100%; padding-bottom: 71.217%;}
.technology-welcome-img.business-welcome-img:before {padding-bottom: 54.4515%;}
.technology-welcome-img img {position: absolute; top:0; left:0; width:100%; height:100%; object-fit: contain;}

.page-business .sec {margin-bottom: var(--space-100);}
.page-business .sec.sec-welcome {padding: var(--space-100) 0; background: var(--secondary-color);}

.tech-boxes {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-25);}
.tech-boxes.four-items {grid-template-columns: repeat(4, 1fr);}
.tech-box {padding: var(--space-40); background: #fff; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.08);}
.tech-boxes.four-items .tech-box {padding: var(--space-40) var(--space-30);}
.tech-boxes.type1 h4:before {content: ''; display: block; width: 8px; height: 8px; margin-bottom: var(--space-15); border-radius: 100%; background: var(--primary-color);}
.tech-boxes.type3 {grid-template-columns: repeat(2, 1fr);}
.tech-boxes.type4 {grid-template-columns: repeat(4, 1fr); gap: 12px;}
.tech-boxes.type4 .tech-box {padding: var(--space-30); background: var(--secondary-color);}
.tech-boxes.type4 h4 {width: fit-content; padding: 6px var(--space-20); background:  var(--primary-color);}

.table-wrap table {width: 100%; border-collapse: collapse; border-top: 2px solid var(--primary-color);}
.table-wrap table th, .table-wrap table td {padding: 6px var(--space-25); border-bottom: 1px solid #ddd;}
.table-wrap table th {font-weight: 600; color: var(--dark-color); background: var(--secondary-color); border-bottom: 1px solid var(--primary-color);}
.table-wrap table th.type2 {border-color: #ddd}
.table-wrap table thead th {color: var(--primary-color);}
.table-wrap table td {border-left: 1px solid #ddd;}
.table-wrap table .border-bottom td {border-bottom:1px solid var(--primary-color);}

.page-equipment .sec .contain {display: flex; align-items: center; gap: 30px var(--space-100);}
.page-equipment .sec:nth-child(even) .contain {flex-direction: row-reverse;}
.equipment-img {position: relative;width: 51.39%; max-width: 740px;}
.equipment-img:before {content: ''; display: block; width: 100%; padding-bottom: 61.892%;}
.equipment-img img {position: absolute; top:0; left:0; width:100%; height:100%; object-fit: cover;}