/*! Writen  by SCSS */
sub {
  font-size: 0.5em;
  vertical-align: baseline; }

.quality_wrap {
  position: relative;
  z-index: 1;
  padding-top: clamp(60px, 12.5%, 120px);
  padding-bottom: clamp(40px, 8.34%, 80px);
  font-feature-settings: "palt"; }
  .quality_wrap::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background: url("../images/quality/bg_fix.jpg") center/cover no-repeat; }

.quality_head_wrap {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 1200px;
  width: calc(100% - 40px);
  margin-left: auto;
  margin-right: auto; }
  .quality_head_wrap .quality_head {
    font-size: clamp(20px, 6.8vw, 70px);
    line-height: 1.15;
    letter-spacing: 0.3em;
    color: #008195;
    margin-bottom: 0.51em; }
  .quality_head_wrap hr {
    width: 100%;
    height: 1px;
    background: #000; }
  .quality_head_wrap .lead {
    margin-top: 0.52em;
    line-height: 1; }
    @media screen and (max-width: 480px) {
      .quality_head_wrap .lead {
        font-size: 18px;
        line-height: 1.4; } }

.inner {
  position: relative;
  z-index: 2; }

.sec01 {
  padding-top: clamp(40px, 12.5%, 120px); }

.sec02 {
  padding-top: clamp(40px, 8.34%, 80px);
  padding-bottom: clamp(30px, 6.25%, 60px); }

.sec_head {
  text-align: center;
  line-height: 1;
  font-size: clamp(24px, 3.8vw, 39px);
  letter-spacing: 0.2em;
  color: #fff;
  padding: 0.38em 0.5em;
  margin-bottom: clamp(20px, 3.65%, 35px); }
  .sec01 .sec_head {
    background: #ec6c00; }
  .sec02 .sec_head {
    background: #fc5b81; }

.sec_list {
  align-items: flex-start;
  margin-bottom: -60px; }
  @media screen and (max-width: 768px) {
    .sec_list {
      margin-bottom: -40px; } }
  @media screen and (max-width: 480px) {
    .sec_list {
      max-width: 440px;
      margin-left: auto;
      margin-right: auto;
      margin-bottom: -30px; } }
  .sec_list .item {
    max-width: 440px;
    width: 45.84%;
    margin-bottom: 60px; }
    @media screen and (max-width: 768px) {
      .sec_list .item {
        width: 48%;
        margin-bottom: 40px; } }
    @media screen and (max-width: 480px) {
      .sec_list .item {
        width: 100%;
        margin-bottom: 30px; } }
    .sec_list .item .item_head {
      display: flex;
      align-items: baseline;
      font-size: clamp(32px, 5.8vw, 60px);
      line-height: 1; }
      .sec_list .item .item_head .text {
        font-size: 0.75em; }
        .sec_list .item .item_head .text .text_min {
          font-size: 0.5em;
          letter-spacing: -0.1em; }
      .sec01 .sec_list .item .item_head {
        color: #ec6c00; }
        .sec01 .sec_list .item .item_head .text_min {
          color: #333; }
      .sec02 .sec_list .item .item_head {
        color: #ea607c; }
    .sec_list .item .item_image {
      margin: 20px 0;
      line-height: 0; }
      @media screen and (max-width: 480px) {
        .sec_list .item .item_image {
          margin: 15px 0; } }
    .sec_list .item .item_text {
      font-size: clamp(16px, 2.1vw, 22px);
      line-height: 1.4; }
    .sec_list .item .item_cap {
      font-size: clamp(12px, 1.7vw, 18px);
      margin-top: 1.2em;
      line-height: 1.25;
      padding-left: 1em;
      text-indent: -1em; }
      @media screen and (max-width: 480px) {
        .sec_list .item .item_cap {
          margin-top: 0.2em; } }

.button_wrap {
  max-width: 580px; }
  @media screen and (max-width: 480px) {
    .button_wrap {
      max-width: 280px;
      margin-left: auto;
      margin-right: auto;
      display: block; } }
  .button_wrap .item {
    width: 48.28%; }
    @media screen and (max-width: 480px) {
      .button_wrap .item {
        width: 100%; }
        .button_wrap .item:first-child {
          margin-bottom: 15px; } }
    .button_wrap .item a {
      text-align: center;
      display: block;
      width: 100%;
      height: 100%;
      line-height: 1;
      font-size: clamp(16px, 3.22vw, 21px);
      border: 1px solid #000000;
      padding: 0.71em 0.5em;
      transition: opacity 0.3s ease-in-out; }
      body:not(.mobile) .button_wrap .item a:hover {
        opacity: 0.7; }
  .button_wrap.button_wrap_col1 {
    justify-content: center;
    padding-top: 60px; }
    @media screen and (max-width: 480px) {
      .button_wrap.button_wrap_col1 {
        padding-top: 40px; } }

footer {
  position: relative;
  z-index: 2;
  background: #fff; }

/*# sourceMappingURL=quality.css.map */