@charset "utf-8";

.dots-list li {position: relative; padding-left: 30px; margin-bottom:20px; font-size: var(--font-size-20); color: #505050; letter-spacing: -.04em;}
.dots-list li:last-child {margin: 0;}
.dots-list li::before {content: ''; position: absolute; left: 0; top: 11px; width: 14px; height: 5px; background-image: url(/images/sub/biz-ico.png); background-repeat: no-repeat; background-size: contain;}

.doc-tit h2 {margin-bottom: clamp(50px, calc( 180 / var(--inner) * 100vw ), 180px); text-align: center; font-size: var(--font-size-38); letter-spacing: -.04em; line-height: 1.37em; color: #2c2c2c; font-weight: 600;}
.doc-tit h2 span {color: var(--color-primary);}
.doc-tit.ty2 h2 {margin-bottom: 90px;}

.greetings h2 {font-size: var(--font-size-38); letter-spacing: -.04em; line-height: 1.37em; font-weight: 600; color: #2c2c2c;}
.greetings h2 span:first-child {color: var(--color-primary);}
.greetings h2 span:last-child {color: var(--color-secondary);}
.greetings>img {margin: 100px 0 85px;}
.greetings .cnt {display: flex;}
.greetings .cnt .tit {width: 30%;}
.greetings .cnt .txt { flex:1 1 auto; min-width:0; width:1%;}
.greetings .cnt .txt h3 {margin-bottom: 60px; font-size: var(--font-size-38); letter-spacing: -.04em; line-height: 1.37em; color: #2c2c2c;}
.greetings .cnt .txt .tt {margin-bottom: 35px; font-size: var(--font-size-20); letter-spacing: -.04em; line-height: 1.7em; color: #505050;}
.greetings .cnt .txt>img {margin-bottom: 35px;}
.greetings .ceo {display: flex; align-items: center;}
.greetings .ceo p {margin-right: 30px; font-size: var(--font-size-20); letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c; font-weight: 700;}
.greetings .cnt01 .tit {font-size: var(--font-size-30); letter-spacing: -.04em; line-height: 1.47em; font-weight: 600; color: #2c2c2c;}
.greetings .cnt01 .tit span {color: var(--color-primary);}
.greetings .cnt02 {padding-top: 95px; margin-top: 95px; border-top: 1px solid #dfdfdf;}
.greetings .cnt02 .tit {font-size: var(--font-size-38); letter-spacing: -.04em; line-height: 1.37em; color: #2c2c2c; font-weight: 700;}
.greetings .cnt .txt h4 {margin-bottom: 45px; display: inline-flex; align-items: center; font-size: var(--font-size-28); letter-spacing: .2em; font-weight: 600; color: #2c2c2c; line-height: 1.2em;}
.greetings .cnt .txt h4 span {font-weight: 600; font-size: var(--font-size-18); letter-spacing: -.04em; color: #a8a8a8;}

.philo {position: relative; padding-bottom: 200px;}
.philo::before {content: ''; position: absolute; right: 0; bottom: 0; background-image: url(/images/sub/biz-bg.png); background-position: 0; background-repeat: no-repeat; background-size: contain; width: 80%; height: 590px;}
.philo h2 {margin-bottom: 110px; text-align: center; font-size: var(--font-size-48); font-weight: 500; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}
.philo h2 span:first-child {color: var(--color-primary);}
.philo h2 span:last-child {color: var(--color-secondary);}
.philo .img {text-align: center;}

.history h2 {text-align: center; font-size: var(--font-size-48); font-weight: 600; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}
.history>p {text-align: center; margin: 20px 0 clamp(50px, calc( 110 / var(--inner) * 100vw ), 110px); font-size: var(--font-size-24); letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}
.history>h3 {margin: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px) 0; text-align: center; font-size: var(--font-size-48); font-weight: 600; letter-spacing: -.04em; line-height: 1.2em; color: var(--color-secondary);}
.history-cnt {position:relative; overflow:hidden;}
.history-cnt .group {position:relative; padding-bottom:75px;}
.history-cnt .group:before {content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; height: 100%; border: 1px dashed #ccc;}
.history-cnt .group:last-child {margin-bottom:0;}
.history-cnt .group:last-child::before {display:none;}
.history-cnt .group h3 {position:relative; font-size: 36px; font-weight: 600;  line-height: 1.2em;  margin-bottom: 40px; z-index:2;}
.history-cnt .group h3:before {content:""; position:absolute; top:0; width:28px; height:28px; background:#fff; border:6px solid #e7f1f1; background-color: var(--color-primary); border-radius:100%;}
.history-cnt .group ul {padding: 35px 40px; border-radius: 24px; background-color: #f8f8f8;}
.history-cnt .group ul li {position:relative; margin-bottom:.5em; color:#505050; font-size:20px; line-height:1.5em; letter-spacing:-.04em;}
.history-cnt .group ul li:last-child {margin-bottom:0;}
.history-cnt .group ul li .month {position:absolute; top:0; color:var(--color-secondary); font-weight:600;}
.history-cnt .group ul li p span {color: #a8a8a8; font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.2em; position: relative;}
.history-cnt .group ul li p span::before {content: '-'; position: absolute; top: 0; color: #a8a8a8; font-size: 16px; letter-spacing: -.03em; line-height: 1.2em;}
.history-cnt .group ul li p:nth-child(n + 3) {margin-top: 20px;}
.history-cnt .group:nth-child(odd) {padding-left:50%;}
.history-cnt .group:nth-child(odd) h3 {padding-left:60px;}
.history-cnt .group:nth-child(odd) h3:before {left:-14px;}
.history-cnt .group:nth-child(odd) ul {margin-left:60px;}
.history-cnt .group:nth-child(odd) ul li {padding-left:50px;}
.history-cnt .group:nth-child(odd) ul li .month {left:0;}
.history-cnt .group:nth-child(odd) ul li p span {padding-left: 10px; left: 10px; margin-left: -10px;}
.history-cnt .group:nth-child(odd) ul li p span::before {left: 0;}
.history-cnt .group:nth-child(even) {padding-right:50%; text-align:right;}
.history-cnt .group:nth-child(even) h3 {padding-right:60px;}
.history-cnt .group:nth-child(even) h3:before {right:-20px;}
.history-cnt .group:nth-child(even) ul {margin-right:60px;}
.history-cnt .group:nth-child(even) ul li {padding-right:50px;}
.history-cnt .group:nth-child(even) ul li .month {right:0;}
.history-cnt .group:nth-child(even) ul li p span {padding-right: 10px; right: 10px; margin-right: -10px;}
.history-cnt .group:nth-child(even) ul li p span::before {right: 0;}

@media (max-width: 1024px) {
	.history-cnt .group h3 {font-size:32px; line-height:54px;}
	.history-cnt .group h3:before {width:54px; height:54px; border-width:15px;}
	.history-cnt .group ul li {font-size:16px;}
	.history-cnt .group:nth-child(odd) h3 {padding-left:50px;}
	.history-cnt .group:nth-child(odd) h3:before {left:-27px}
	.history-cnt .group:nth-child(even) h3 {padding-right:50px;}
	.history-cnt .group:nth-child(even) h3:before {right:-27px}
    .history-cnt .group:nth-child(even) ul {
        margin-right: 20px;
    }
    .history-cnt .group:nth-child(odd) ul {
        margin-left: 20px;
    }
}

@media (max-width: 640px) {
	.history-cnt .group {padding:0 0 40px 0 !important; text-align:left !important;}
	.history-cnt .group:before {left:13px;}
	.history-cnt .group h3 {font-size:21px; line-height:27px; padding:0 0 0 50px !important; margin-bottom:10px;}
	.history-cnt .group h3:before {left:0px !important; margin:0 !important; right:auto !important; width:27px; height:27px; border-width:9px;}
	.history-cnt .group ul li {padding:00!important; font-size:15px;}
	.history-cnt .group ul li .month {left:0 !important; right:auto !important;}
    .history-cnt .group:nth-child(odd) ul {
        margin-left: 40px;
    }
    .history-cnt .group:nth-child(even) ul {margin: 0 0 0 40px;}
    .history-cnt .group ul li .month {position: static;}
    .history-cnt .group:nth-child(even) ul li p span {
        padding-right: 0;
        right: 0;
        margin-right: 0;
    }
    .history-cnt .group:nth-child(odd) ul li p span {    padding-left: 0;
        left: 0;
        margin-left: 0;}
    .history-cnt .group ul li p span::before {display: none;}
}

.cert ul {display: flex; flex-wrap: wrap; margin: 0 -50px -95px;}
.cert ul li {width: 25%; padding: 0 50px; margin-bottom: 95px;}
.cert ul li .box {text-align: center;}
.cert ul li .box .img {position:relative; padding-bottom:140.36%; border-radius:16px; overflow:hidden;}
.cert ul li .box .img::after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #eee; border-radius: 16px;}
.cert ul li .box .img img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.cert ul li .box p {margin-top: 30px; font-size: var(--font-size-20); letter-spacing: -.04em; line-height: 1.5em; color: #2c2c2c; font-weight: 500;}


.business .item {display: flex; margin-bottom: 100px;}
.business .item:last-child {margin-bottom: 0;}
.business .item .img {width: 45%;}
.business .item .txt {padding:45px 0 0  70px; flex:1 1 auto; min-width:0; width:1%;}
.business .item .txt h3 {margin-bottom: 50px; font-size: var(--font-size-38); letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}
.business .item .txt .tt {margin-bottom:20px; padding-bottom: 10px; border-bottom: 1px solid #ddd; font-size: var(--font-size-20); letter-spacing: 0em; line-height: 1.2em; color: var(--color-secondary); font-weight: 600;}
.business .item .txt .tt.ty2 {margin-top: 45px;}
.business .dots-list li {font-size: var(--font-size-22);}
.business .dots-list.ty2 li {font-size: var(--font-size-18);}
.business .dots-list.ty2 li span {font-weight: 600; color: #2c2c2c;}
.business .dots-list.ty2 li span.sub-list {padding-left: 10px; font-weight: 400; color: #505050; font-size: var(--font-size-16);}
.business .item .txt .other {padding: 45px 0 0 35px; font-size: var(--font-size-16); letter-spacing: -.04em; line-height: 1.2em; color: #a8a8a8;}
.business .dots-list.ty3 {display: flex; flex-wrap: wrap;}
.business .dots-list.ty3 li {width: 50%;}

.laboratory {display: flex; justify-content: space-between; margin-top: 80px;}
.laboratory h2 {font-size: var(--font-size-48); letter-spacing: -.04em; line-height: 1.54em; color: #222; font-weight: 600;}
.laboratory p {font-size: var(--font-size-20); letter-spacing: -.04em; line-height: 1.7em; color: #505050;}

.rnd .cnt.bg {background-color: #f5f5f5; padding: clamp(50px, calc( 110 / var(--inner) * 100vw ), 110px) 0 clamp(50px, calc( 200 / var(--inner) * 100vw ), 200px);}
.rnd .imgs ul {display: flex; flex-wrap: wrap;}

.material .top-img {display: flex; align-items: center;  border-radius: 32px; overflow: hidden;}
.material .top-img .txt {margin-left: 100px;}
.material .top-img .txt h3 {margin-bottom: 40px; font-size: var(--font-size-38); letter-spacing: -.04em; line-height: 1.54em; color: #2c2c2c;}
.material .top-img .txt p {margin-top: 40px; padding-left: 30px; font-size: var(--font-size-16); color: #a8a8a8; letter-spacing: -.04em; line-height: 1.63em;}
.material .dots-list.ty4 li {font-size: var(--font-size-22);}
.material .dots-list.ty4 li strong {color: var(--color-secondary);}
.material .imgs {margin: 95px 0 120px;}
.material .imgs.ty2 {margin-bottom: 0;}
.material .imgs p {margin-bottom: 45px; font-size: var(--font-size-28); letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c; font-weight: 700;}
.material .imgs ul {margin: -9px;}
.material .imgs ul li {padding: 9px;}

.material .cnt01 .top-img {background-color: #f5f5f5;}
.material .cnt02 .top-img {background-color: #fff;}
.material .point {margin-top: 50px; display: flex; justify-content: space-between; padding: 50px; background-color: var(--color-primary); border-radius: 32px;}
.material .point .tit {font-size: var(--font-size-28); letter-spacing: -.04em; line-height: 1.2em; color: #fff; font-weight: 700;}
.material .point .items {margin: 0 -9px; display: flex;}
.material .point .items .item {padding:0 9px ;}
.material .point .items .item .box {background-color: #fff; border-radius: 32px; width: 298px; height: 208px; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.material .point .items .item .box p {margin: 25px 0 0 0; font-size: var(--font-size-18); letter-spacing: -.04em; font-weight: 600; line-height: 1.2em; color: #2c2c2c;}

.material .table-list {display: flex;}
.material .table-list .col {width: 25%; text-align: center; padding: 0 3px;}
.material .table-list ul {flex-direction: column; margin: 3px 0 0 0;}
.material .table-list ul li {padding:3px 0;}
.material .table-list ul li .box {display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 64px; color: #505050;  font-size: var(--font-size-18); letter-spacing: -.04em; line-height: 1.2em;  background-color: #dae3e3; border-radius: 12px;}
.material .table-list .col .head {display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 64px; color: #fff;  font-size: var(--font-size-18); letter-spacing: -.04em; line-height: 1.2em; background-color: var(--color-primary); border-radius: 12px;}
.material .table-list .col.ty2 .head {background-color: var(--color-secondary);}
.material .table-list .col.ty2 ul li .box {background-color: #f4ebd5;}

.manuf-tab {margin-bottom:95px;}
.manuf-tab ul {display: flex; flex-wrap: wrap; justify-content: center; margin:-3px;}
.manuf-tab ul li {width: 20%; padding:3px;}
.manuf-tab ul li a {display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 66px; border: 1px solid #ddd; border-radius: 8px; background-color: #fff; font-size: var(--font-size-20); font-weight: 600; letter-spacing: -.04em; line-height: 1.2em; color: #a8a8a8;}
.manuf-tab ul li.active a {background-color:var(--color-primary); color:#fff; border: 1px solid var(--color-primary);}
.manuf .cnt01 {margin-bottom: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px);}
.manuf .imgs ul {margin: 0 -10px -60px; justify-content: center;}
.manuf .imgs ul li {padding: 0 10px; width: 33.33%; text-align: center; margin-bottom: 60px;}
.manuf .imgs ul li .img {position:relative; padding-bottom:99.34%;border-radius:32px; overflow:hidden;}
.manuf .imgs ul li .img img {position:absolute; top:0; left:0; width:100%; height:100%; transition:.4s ease-in-out; object-fit:cover;}
.manuf .imgs ul li.w100 {width: 100%; margin-top: 85px;}
.manuf .imgs ul li p {margin-top: 30px; font-size: var(--font-size-26); font-weight: 600; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}

.property ul {display: flex; flex-wrap: wrap; margin: 0 -50px -95px;}
.property ul li {width: 25%; padding: 0 50px; margin-bottom: 95px;}
.property ul li .box {text-align: center;}
.property ul li .box .img {position:relative; padding-bottom:140.36%; border-radius:16px; overflow:hidden;}
.property ul li .box .img::after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #eee; border-radius: 16px;}
.property ul li .box .img img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.property ul li .box .tt {margin-top: 30px; font-size: var(--font-size-20); letter-spacing: -.04em; line-height: 1.5em; color: #2c2c2c; font-weight: 500;}
.property ul li .box .tt2 {margin-top: 10px; font-size: var(--font-size-18); letter-spacing: -.04em; line-height: 1.5em; color: #878787; font-weight: 500;}

.contact-top {margin-bottom: 95px; padding-left: 100px; display: flex; flex-direction: column; justify-content: center;background-image: url(/images/sub/biz-img50.jpg); width: 100%; height:440px; background-position: 50%; background-repeat: no-repeat; background-size: cover; border-radius: 32px;}
.contact-top h2 {font-size: var(--font-size-58); font-weight: 500; letter-spacing: -.04em; line-height: 1.28em; color: #2c2c2c;}
.contact-top h2 span {color: var(--color-primary);}
.contact-top p {margin-top: 30px; font-size: var(--font-size-22); font-weight: 500; letter-spacing: -.04em; line-height: 1.64em; color: #505050;}
.contact-tit h3 {margin-bottom: 45px; font-size: var(--font-size-28); font-weight: 600; letter-spacing: -.04em; line-height: 1.28em; color: #2c2c2c;}


.directions {display: flex;}
.directions .map-wrap {margin-right: 19px; width: 65.7%;}
.directions .map-wrap iframe {border-radius: 32px; width: 100%;}
.directions .map-info {border-radius: 32px; overflow: hidden; padding: 0 9px;}
.directions .map-info {padding: 50px 30px; flex:1 1 auto; min-width:0; width:1%; background-color: #fcf7f1;}
.directions .map-info .items {display: flex; margin: 0 -3px;}
.directions .map-info .item {padding: 0 3px;}
.directions .map-info .item a {display: inline-flex; align-items: center; justify-content: center; font-size:var(--font-size-16); font-weight: 500; letter-spacing: -.04em; color: #505050; padding: 0 10px; min-width: 75px; height: 39px; border-radius: 19.5px; border: 1px solid #dfdfdf; background-color: #fff;}
.directions .map-info .item.active a {color: #fff; border: 1px solid var(--color-primary); background-color: var(--color-primary);}
.directions .map-info h3 {margin: 45px 0 25px; font-size:var(--font-size-38); letter-spacing: -.04em; color: #2c2c2c; line-height: 1.2em;}
.directions .map-info>p {margin-bottom: 55px; font-size:var(--font-size-18); letter-spacing: -.04em; color: #505050; line-height: 1.78em; font-weight: 500;}
.directions .biz-info .box {display: flex; align-items: center; margin-bottom: 15px;}
.directions .biz-info .box p {margin-left: 10px; font-size:var(--font-size-20); letter-spacing: -.04em; color: #2c2c2c; line-height: 1.2em; font-weight: 600;}
