@charset "UTF-8";
/* CSS Document */
.billboard-style-02 {background: url("../img/quality/quality_mv01_img01_pc.webp") no-repeat center/cover;}
.billboard-style-02::after {color: #000;}
.billboard-style-02 h2 {color: #000;}
.block-quality-01 {padding: 3em 0 5em;}
.block-quality-01 .container + .container {margin-top: 6em;}
.block-quality-01 nav ul {display: flex;flex-wrap: wrap;justify-content: space-between;}
.block-quality-01 nav ul li {text-align: center;width: 24%;}
.block-quality-01 nav ul li a {color: var(--color-05);font-size: 200%;line-height: 2;background: #f0f2f4;position: relative;}
.block-quality-01 nav ul li a::before,
.block-quality-01 nav ul li a::after {display: block;content: '';width: calc(100% - 8px);height: 1px;background: var(--color-05);position: absolute;left: 4px;}
.block-quality-01 nav ul li a::before {top: 4px;}
.block-quality-01 nav ul li a::after {bottom: 4px;}
.block-quality-01 nav ul li.active a {color: #fff;background: var(--color-05);}
.block-quality-01 nav ul li.active a::before,
.block-quality-01 nav ul li.active a::after {background: #fff;}
.block-quality-01 h3 {margin-top: 1em;}
.block-quality-01 .container > ul {display: flex;flex-wrap: wrap;justify-content: flex-start;margin: 4em -1.75em 0;}
.block-quality-01 .container > ul li {width: calc(33.33% - 3.5em);margin: 0 1.75em 2em;}
.block-quality-01 .container > ul li p:nth-of-type(1) {font-size: 125%;text-align: center;padding: 0.3em 0;margin-top: 0.4em;background: #e3ecef;}
.block-quality-01 .container > ul li p:nth-of-type(2) {font-size: 106.25%;}
.block-quality-01 .container > ul li p:nth-of-type(2)::before {display: block;content: '';width: 100%;height: 1px;background: #000;margin: 0.4em 0 0.5em;}
.block-quality-01 .container > ul li p:nth-of-type(2) small {display: block;font-size: 10px;}
.block-quality-01 .container > ul li.column45 {display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;}
.block-quality-01 .container > ul li.column45 figure {width: 41%;padding-bottom: 1.5em;}
.block-quality-01 .container > ul li.column45 figure figcaption {color: #000;right: 0;}
.block-quality-01 .container > ul li.column45 div {width: 53%;}
.block-quality-01 .container > ul li.column45 div p:nth-of-type(1) {margin-top: 0;}
.block-quality-01 .container > ul li.column54 {display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;}
.block-quality-01 .container > ul li.column54 figure {width: 52%;}
.block-quality-01 .container > ul li.column54 figure figcaption {text-align: right;left: 0;}
.block-quality-01 .container > ul li.column54 figure figcaption span {text-shadow: 0 0 6px #000,0 0 6px #000,0 0 6px #000;}
.block-quality-01 .container > ul li.column54 figure figcaption span:nth-child(2) {position: absolute;right: calc(50% + 0.75em);bottom: 0;}
.block-quality-01 .container > ul li.column54 div {width: 42%;}
.block-quality-01 .container > ul li.column54 div p:nth-of-type(1) {margin-top: 0;}
.block-quality-01 .container > ul li.column553 figure figcaption {text-align: right;left: 0;}
.block-quality-01 .container > ul li.column553 figure figcaption span {text-shadow: 0 0 6px #000,0 0 6px #000,0 0 6px #000;white-space: nowrap;position: absolute;right: 0;bottom: 1.5em;}
.block-quality-01 .container > ul li.column553 figure figcaption span:nth-child(2) {right: 50%;bottom: 0;}
.block-quality-01 .container > ul li.column553 figure figcaption span:nth-child(3) {bottom: 16.5em;}
@media only screen and (max-width: 1450px) {
  .block-quality-01 nav ul li a {font-size: 150%;}
  .block-quality-01 .container > ul li.column553 figure figcaption span:nth-child(3) {bottom: 11.5vw;}
}
@media only screen and (min-width: 1000px) and (max-width: 1200px) {
  #contentsWrap {font-size: 1.3vw;}
}
@media only screen and (max-width: 1000px) {
  .ttl-style-02 + p {font-size: 150%;}
  .block-quality-01 {padding-bottom: 3em;}
  .block-quality-01 nav ul li {width: 49%;margin-bottom: 1%;}
  .block-quality-01 nav ul li a {font-size: 137.5%;}
  .block-quality-01 .container > ul {margin: 2em -1em 0;}
  .block-quality-01 .container > ul li {width: calc(50% - 2em);margin: 0 1em 1em;}
  .block-quality-01 .container > ul li.column553 figure figcaption span:nth-child(3) {bottom: 18.5vw;}
}
@media only screen and (min-width: 768px) {}
@media only screen and (max-width: 767px) {
  .ttl-style-02 + p {font-size: 125%;margin-top: 0.5em;}
  .billboard-style-02 {background: url("../img/quality/quality_mv01_img01_sp.webp") no-repeat center bottom/cover;}
  .block-quality-01 {padding: 2em 0 0;}
  .block-quality-01 nav ul li a {font-size: 118.75%;line-height: 2.5;}
  .block-quality-01 h3 {margin-top: 0.5em;}
  .block-quality-01 .container + .container {margin-top: 1em;}
  .block-quality-01 .container > ul {margin-top: 1em;}
  .block-quality-01 .container > ul li {width: calc(100% - 2em);margin-bottom: 2em;}
  .block-quality-01 .container > ul li.column45 div {width: 55%;}
  .block-quality-01 .container > ul li.column54 div {width: 44%;}
  .block-quality-01 .container > ul li.column553 figure figcaption span:nth-child(3) {bottom: 38vw;}
  .block-quality-01 .container > ul li p:nth-of-type(1) {font-size: 112.5%;}
  .block-quality-01 .container > ul li p:nth-of-type(2) {font-size: 100%;}
}
@media only screen and (max-width: 768px) and (orientation: landscape) {}