@charset "UTF-8";
/* CSS Document */
.site-main {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
}

.entry-header {
  width: 100vw;
  margin-right: auto;
  margin-left: auto;
  padding-right: 5vw;
  padding-left: 5vw;
}
@media only screen and (min-width: 768px) {
  .entry-header {
    width: 1080px;
    padding-right: 20px;
    padding-left: 20px;
  }
}

.section-body {
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.section-bar {
  padding-top: 20px;
  padding-bottom: 20px;
}
.section-bar-title {
  padding-right: 10px;
  padding-left: 10px;
}
.section-bar-small {
  margin-left: 8px;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.5em;
}
@media only screen and (min-width: 768px) {
  .section-bar {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .section-bar-title {
    padding-right: 25px;
    padding-left: 25px;
  }
  .section-bar-small {
    margin-left: 10px;
    font-size: 24px;
  }
}

.section-element {
  margin-left: 1.5em;
  text-indent: -1.5em;
}
.section-element::before {
  content: "●";
  display: inline;
  margin-right: 0.5em;
}
.section-subitem {
  margin-left: 1em;
  text-indent: -1em;
}
.section-subitem::before {
  content: "・";
  display: inline;
  margin-right: 0;
}
.section-reminder {
  margin-left: 1em;
  text-indent: -1em;
}
.section-reminder::before {
  content: "※";
  display: inline;
  margin-right: 0;
}

/** @deprecated */
.site-main {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
}

.entry-header {
  width: 100vw;
  margin-right: auto;
  margin-left: auto;
  padding-right: 5vw;
  padding-left: 5vw;
}
@media only screen and (min-width: 768px) {
  .entry-header {
    width: 1080px;
    padding-right: 20px;
    padding-left: 20px;
  }
}

.section-body {
  width: 100%;
  margin-right: 0;
  margin-left: 0;
  color: #333333;
}
@media only screen and (min-width: 768px) {
  .section-body {
    font-size: 18px;
  }
}

.strength-outer {
  margin-bottom: 60px;
}
@media only screen and (min-width: 768px) {
  .strength-outer {
    margin-bottom: 100px;
  }
}

.swiper-wrapper:is(ul, ol), .image-grid-container:is(ul, ol) {
  list-style: none;
}
.swiper-wrapper:is(ul, ol) li, .image-grid-container:is(ul, ol) li {
  margin-left: 0;
}
.swiper-wrapper:is(ul, ol) li::before, .swiper-wrapper:is(ul, ol) li::after, .image-grid-container:is(ul, ol) li::before, .image-grid-container:is(ul, ol) li::after {
  display: none;
}
.swiper-wrapper:is(ul, ol) li img, .image-grid-container:is(ul, ol) li img {
  margin-top: 0;
  margin-bottom: 0;
}

.strength-top .main-swiper {
  height: auto;
}
.strength-top .main-swiper .swiper-slide img {
  width: auto;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 20 / 13;
  min-width: 100%;
  min-height: 100%;
}
@media only screen and (min-width: 768px) {
  .strength-top .main-swiper {
    height: 600px;
  }
  .strength-top .main-swiper .swiper-slide img {
    height: 600px;
    aspect-ratio: unset;
  }
}
@media only screen and (min-width: 2000px) {
  .strength-top .main-swiper {
    height: auto;
  }
  .strength-top .main-swiper .swiper-slide img {
    height: auto;
    aspect-ratio: 10 / 3;
  }
}
.strength-page-title {
  margin-top: 2em;
  margin-bottom: 2em;
  color: #4d4d4d;
  font-size: clamp(20px, calc(3vw + 8px), 32px);
  font-weight: bold;
  text-align: center;
  line-height: 1.75em;
}
.strength-page-title-small {
  font-size: clamp(14px, calc(1vw + 10px), 18px);
  font-weight: bold;
  text-align: center;
}
.strength-top .strength-page-title {
  margin-top: clamp(90px, 22.5vw, 180px);
  margin-bottom: clamp(90px, 22.5vw, 180px);
}
.strength-main {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  row-gap: clamp(100px, 25vw, 200px);
  margin-bottom: clamp(100px, 25vw, 200px);
  counter-reset: section;
}
.strength-section {
  --section-color: #4d4d4d;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  counter-increment: section;
}
.strength-section-title {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  font-size: clamp(28px, calc(3.5vw + 14px), 42px);
  font-weight: bold;
  line-height: 2em;
}
.strength-section-title-outer {
  margin-bottom: clamp(25px, 12.5vw, 50px);
  border-bottom: 2px solid var(--section-color);
  padding-bottom: clamp(24px, calc(3vw + 12px), 36px);
  color: var(--section-color);
}
.strength-section-title::before {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  content: counters(section,"-");
  margin-top: -0.25em;
  margin-right: 0.5em;
  font-size: 2em;
  line-height: 1.25em;
}
.strength-section:nth-of-type(-n + 9) .strength-section-title::before {
  content: "0" counters(section,"-");
}
.strength-section-subtitle {
  margin-bottom: 2em;
  color: color-mix(in srgb, var(--section-color) 60%, #fff);
  font-size: clamp(20px, calc(1vw + 16px), 24px);
  font-weight: bold;
}
.strength-section-text {
  margin-bottom: 2em;
  font-size: clamp(14px, calc(1vw + 10px), 18px);
}
.strength-section-text a {
  color: var(--section-color);
}
.strength-section-columns {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  gap: 1.5em;
}
.strength-section-distribution {
  --section-color: #1f6fb1;
}
.strength-section-quality {
  --section-color: #0da29a;
}
.strength-section-data-entry {
  --section-color: #8abd42;
}
.strength-section-seamlessness {
  --section-color: #ed9026;
}
.strength-section-design {
  --section-color: #e14136;
}
.strength-section-3d-printing {
  --section-color: #9e529c;
}
@media only screen and (min-width: 768px) {
  .strength-section .section-inner {
    width: 920px;
  }
  .strength-section-columns {
    -webkit-flex-direction: row;
    flex-direction: row;
  }
}

/*!
.strength {
	&-top {
		$url_bg: 'strength/strength_head_bg_rev2.jpg';
		$url_bg_sp: 'strength/strength_head_bg_sp.jpg';
		$show_mask: true;
		$mask_color: rgba($dark, 0.2);
		//masked_with_gray3
		margin-bottom: 60px;
		@include officeTop($url_bg_sp, $url_bg, $page_color);
		@if $show_mask == true {
			&-text {
				background-color: $mask_color;
			}
		}
		&-text {
			@include display-flex;
			@include flex-direction(column);
			@include justify-content(center);
			position: absolute;
			width: 100%;
			height: 100%;
			font-weight: bold;
			color: $white;
			text-align: center;
			&-point {
				font-size: 20px;
				color: #f00;
			}
		}
		&-reminder {
			position: absolute;
			width: 100%;
			bottom: 0.5em;
			text-align: right;
		}
		@media not screen, (max-width: 767px) {
			@if $show_mask == true {
				&-bg {
					min-height: 48vw;
					background-size: 120vw;
				}
			}
		}
		@media only screen and (min-width: 768px) {
			margin-bottom: 80px;
			&-title {
				padding-top: 80px;
				padding-bottom: 40px;
				font-size: 42px;
			}
			&-bg {
				min-height: image-height($url_bg);
				background-size: auto;
			}
			&-text {
				@include paddingV(40px);
				font-size: 42px;
				font-weight: bold;
			}
		}
		@media only screen and (min-width: image-width($url_bg) + 1px) {
			&-bg {
				background-size: cover;
			}
		}
	}

}*/