@charset "utf-8";
img {
 vertical-align: bottom;
}
.link-button.p3p5p {
 padding: 3% 0 5%;
}
.w386 {
 width: calc(100% - 2rem);
 margin: 0 auto;
}
section img {
 width: 100%;
}
h1 {
 font-size: clamp(16px, calc(1vw + 16px), 26px);
}
h2 {
 margin-bottom: 2%;
 font-size: clamp(16px, calc(1vw + 16px), 24px)
}
section.pfas h2 {
 max-width: 228px;
}
section.water-quality h2 {
 max-width: 412px;
}
section.award-winner h2 {
 max-width: 320px;
}
section.conducting-inspection h2 {
 max-width: 314px;
}
section.content .badge {
 padding: 0 2% .5rem;
 font-size: 150%;
 font-weight: bold;
 font-family: YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
 line-height: 38px;
}
section.content .badge.c18205 {
 padding: 0 2%;
}
section.content .badge.c324997 {
 font-size: 140%;
}
.badge.border2s {
 border-bottom: 2px solid #ededed;
}
section.content .badge img {
 width: auto;
 margin-right: 1rem;
 max-height: 38px;
}
.flex-container.top-nav {
 flex-direction: row;
}
.flex-container {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 gap: 5%;
}
.zone.text .flex-container {
 margin-bottom: 2%;
}
.zone.text .flex-container img {
 margin-bottom: 1rem;
 flex-shrink: 0;
}
.zone.text .flex-container p {
 margin-bottom: 0;
 font-size: 115%;
}
.zone.text .flex-container .txtbox {
 padding: 0 2%;
}
.zone.text .flex-container p.small {
 font-size: 90%;
}
.header4 {
 color: #bf272d;
 font-weight: bold;
 display: block;
}
section.international-certification,
section.award-winner,
section.conducting-inspection {
 margin: 0 auto 5%;
}
.flex-container.index {
 margin: 2% 2% 4%;
 flex-wrap: wrap;
 justify-content: flex-start;
 gap: 1%;
}
.another-link {
 max-width: max-content;
 margin: 0 auto 1rem;
 /* ページが出来たら復活 */
 display: none;
}
.another-link p {

}
.another-link a {
 padding: .5rem 1rem;
 color: #fff;
 text-align: center;
 display: block;
 border-radius: 60px;
 text-decoration: none;
 background: linear-gradient(90deg, rgba(140,164,255,1) 0%, rgba(152,215,255,1) 50%, rgba(25,112,255,1) 100%);
 background-size: 200% 100%;
 border: none;
 transition: .3s cubic-bezier(0.45, 0, 0.55, 1);
}
.another-link a:hover {
 background-position: 100% 0;
}
.design {
 margin: 0 2% 4%;
}
.design .header:before {
 content: "■";
 margin-right: .5rem;
}
.design .header + p {
 margin-bottom: 2%;
 color: #194EAC;
 font-size: clamp(16px, calc(1vw + 16px), 26px);
 font-weight: bold;
 letter-spacing: -.5px;
}
.design-block {
 margin-bottom: 2%;
}
.design-block h3 {
 margin-bottom: 2%;
 font-weight: bold;
}
.design-block  p {
 margin: 0 auto 2%;
 line-height: 1.6;
}
.design-block ol {
 margin: 0 2%;
}
.design-block ol li {
 margin-bottom: 2%;
}
.design-block p.indent1 {
 margin-left: 1rem;
 text-indent: -1rem;
}
.design-block p.indent2 {
 margin-left: 2rem;
 text-indent: -2rem;
}
.design-block p.parentheses {
 margin: 0 auto 2%;
 padding-left: 2.3rem;
 text-indent: 0;
 position: relative;
}
.design-block p.parentheses:before {
 position: absolute;
 left: 0;
 top: 0;
}
.design-block p.parentheses.one:before {
 content:"（1）";
}
.design-block p.parentheses.two:before {
 content:"（2）";
}
.design-block p.parentheses.three:before {
 content:"（3）";
}
.design-block p.parentheses.four:before {
 content:"（4）";
}
.design-block p.parentheses.five:before {
 content:"（5）";
}
.design-block p.parentheses.six:before {
 content:"（6）";
}
.design-block p.parentheses.seven:before {
 content:"（7）";
}
.design-block p.circle {
 width: 92%;
 margin: 0 auto 2%;
 padding-left: 1.3rem;
 text-indent: 0;
 position: relative;
}
.design-block p.circle:before {
 position: absolute;
 left: 0;
 top: 0;
}
.design-block p.circle.one:before {
 content:"①";
}
.design-block p.circle.two:before {
 content:"②";
}
.design-block p.circle.three:before {
 content:"③";
}
.design-block p.circle.four:before {
 content:"④";
}
.design-block p.circle.five:before {
 content:"⑤";
}
.design-block p.circle.six:before {
 content:"⑥";
}
.design-block p.circle.seven:before {
 content:"⑦";
}
.design-block p.circle.w95p {
 width: 95%;
}
.design-block p.indent0 {
 text-indent: 0;
}
.bk-ebf6f7 {
 background: #ebf6f7;
}
.bk-fbfaf5 {
 background: #fbfaf5;
}
.design-block.bk-fbfaf5 {
 padding: 3%;
}
.independence {
 margin: 0 auto 3%;
 padding: 3%;
}
.independence h1,
.independence h2 {
 font-weight: bold;
}
.independence header + p {
 margin-bottom: 1%;
}
img.delevery-time {
 max-width: 720px;
 margin: 0 auto;
 display: block;
}
ol {
 margin: 2% auto;
}
ol li {
 margin-bottom: 1%;
}
.caution.fc-red {
 color: #f00;
}
p.fw-bold {
 font-weight: bold;
 text-decoration: underline;
 text-indent: -1rem;
 margin-left: 1rem;
}
.select-member {
 margin-bottom: 2%;
 display: flex;
 justify-content: center;
 gap: 3%;
}
.member {
 padding: 2%;
 border: 3px solid #0099ff;
 background: #fff;
 border-radius: 20px;
 flex-basis: 41%;
}
.non {
 border: 3px solid #009900;
}
.design-block p.title {
 font-weight: bold;
}
.step.block {
 width: 94%;
 margin: 0 auto;
 border: 2px solid #37baec;
 border-top: none;
 background: #fff;
}
.design-block p.step {
 padding: 0 2%;
 color: #fff;
 background: #37baec;
}
.design-block .step.block p {
 margin-bottom: 0;
 padding: 1% 2%;
}
@media screen and (min-width:800px) {
 section.international-certification,
 section.award-winner,
 section.conducting-inspection {
  max-width: calc(960px - 6%);
  margin: 0 auto 2%;
 }
 section.conducting-inspection {
  margin-bottom: 5%;
 }
 section.content .badge img {
  width: auto;
 }
 section.content .badge {
  font-size: 180%;
 }
 .flex-container {
  flex-direction: row;
 }
 .flex-container.reverse {
  flex-direction: row-reverse;
 }
 .zone.text .flex-container img {
  max-width: 332px;
 }
 .w386 {
  max-width: 386px;
 }
 .flex-container.index {
  width: 90%;
  margin: 2% auto;
 }
 .index div {
  width: calc((100% - 4%) / 3 )
 }
 .design {
  margin: 0 auto 5%;
 }
}