.en-title {
  font-family: "a-otf-ud-reimin-pr6n", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-weight: bold;
  color: #009d8a;
  text-align: center;
  font-size: 2rem;
  letter-spacing: 0.04em; }
  .en-title::after {
    background-color: currentColor;
    content: '';
    display: block;
    width: 7rem;
    height: 4px;
    margin-inline: auto;
    margin-top: 2rem;
    margin-bottom: 3rem; }

#ober-brand .taisei-yuraku {
  margin-top: 3rem; }
  #ober-brand .taisei-yuraku .logo {
    max-width: 386px;
    width: 80%;
    margin-inline: auto; }
  #ober-brand .taisei-yuraku .lead {
    margin-top: 4rem; }
  #ober-brand .taisei-yuraku .note {
    text-align: center;
    margin-top: 2rem; }
#ober-brand .about-ober {
  margin-top: 6rem; }
  #ober-brand .about-ober .logo {
    max-width: 296px;
    width: 80%;
    margin-inline: auto;
    margin-top: 4rem; }
  #ober-brand .about-ober .lead {
    margin-top: 4rem; }
#ober-brand .work-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 5rem; }
  #ober-brand .work-list .img {
    position: relative; }
    #ober-brand .work-list .img .name {
      background-color: #009d8a;
      color: #ffffff;
      display: inline-block;
      font-size: 11px;
      font-feature-settings: "palt";
      padding: 3px;
      position: absolute;
      left: 0;
      bottom: 0;
      letter-spacing: 0.02em; }
  #ober-brand .work-list .roka,
  #ober-brand .work-list .hirai {
    grid-column: span 2; }

#haseko .white-inner {
  padding: 6rem 0 7rem; }
#haseko .logo {
  max-width: 411px;
  width: 80%;
  margin-inline: auto; }
#haseko .lead {
  margin-top: 4rem; }
#haseko .note {
  text-align: center;
  margin-top: 2rem; }
#haseko .appeal-list {
  display: flex;
  justify-content: center;
  gap: 60px;
  max-width: 680px;
  margin-inline: auto;
  margin-top: 6rem; }

.about {
  margin-top: 4rem; }
  .about > .title {
    background-color: #009d8a;
    /**border-radius: calc(infinity * 1px);**/
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    font-feature-settings: "palt";
    letter-spacing: 0.02em;
    margin-inline: auto;
    width: max-content;
    padding: 5px 20px;
    translate: 0 50%;
    position: relative;
    z-index: 1; }
  .about .inner {
    border: 2px solid #009d8a;
    border-radius: 0.2rem;
    padding: 3rem 4.3rem 5rem;
    position: relative; }
  .about .overview .lead {
    font-size: 1.5rem; }

#oqc .logo {
  max-width: 189px;
  width: 80%;
  margin-inline: auto;
  margin-top: 4rem; }
#oqc .overview .img {
  margin-top: 4rem; }
#oqc .flow {
  margin-top: 6rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 6rem; }
  #oqc .flow > .title {
    color: #009d8a;
    font-size: 2.8rem;
    font-feature-settings: "palt";
    letter-spacing: 0.02em;
    text-align: center;
    grid-column: span 2; }
    #oqc .flow > .title::after {
      background-color: currentColor;
      content: '';
      display: block;
      width: 10rem;
      height: 4px;
      margin-inline: auto;
      margin-top: 2rem; }
  #oqc .flow:not(:last-child)::after {
    display: block;
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 31px 31px 0 31px;
    border-color: #009d8a transparent transparent transparent;
    grid-column: span 2;
    margin-inline: auto;
    margin-top: 6rem; }
  #oqc .flow > .img {
    margin-top: 3rem; }
  #oqc .flow .copy {
    margin-top: 3rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    #oqc .flow .copy .catch-copy {
      font-size: 3.8rem;
      color: #009d8a;
      font-feature-settings: "palt";
      letter-spacing: 0.02em; }
    #oqc .flow .copy .text {
      font-size: 16px;
      line-height: 1.6;
      margin-top: 1.5rem; }
#oqc .flow01 {
  margin-top: 8rem; }
#oqc .flow02 > .title {
  order: 1; }
#oqc .flow02 .copy {
  order: 2; }
#oqc .flow02 > .img {
  order: 3; }
#oqc .flow02 .image-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-top: 2rem; }
#oqc .flow02::after {
  order: 4; }
#oqc .flow03 .factory {
  grid-column: span 2;
  margin-top: 6rem; }
  #oqc .flow03 .factory .title {
    text-align: center;
    font-size: 1.8rem;
    font-feature-settings: "palt";
    letter-spacing: 0.02em; }
  #oqc .flow03 .factory .img {
    margin-top: 1.5rem; }

#owners-club .logo {
  max-width: 308px;
  width: 80%;
  margin-inline: auto;
  margin-top: 4rem; }
#owners-club .overview .note {
  margin-top: 2rem;
  text-align: center; }
#owners-club .overview .badge {
  position: absolute;
  right: 0px;
  top: -6rem;
  width: clamp(8rem, 40%, 18rem); }
#owners-club .benefit {
  margin-top: 6rem; }
  #owners-club .benefit > .title {
    color: #009d8a;
    text-align: center;
    font-size: 3.8rem;
    font-feature-settings: "palt";
    letter-spacing: 0.02em; }
#owners-club .partnership {
  margin-top: 4rem; }
  #owners-club .partnership .title {
    font-size: 16px;
    text-align: center;
    background-color: #e9ecea;
    padding: 5px; }
  #owners-club .partnership .list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-top: 12px; }

@media screen and (max-width: 1024px) {
  #haseko .appeal-list {
    gap: 40px; }

  #oqc .flow {
    column-gap: 3rem; }
    #oqc .flow:not(:last-child)::after {
      border-width: 24px 25px 0 25px; }

  #owners-club .overview .badge {
    top: -6rem;
    right: -4rem; } }
@media screen and (max-width: 599px) {
  #ober-brand .work-list {
    grid-template-columns: repeat(2, 1fr); }

  #haseko .white-inner {
    padding: 6rem 0 5rem; }
  #haseko .appeal-list {
    gap: 20px; }

  #oqc .flow {
    display: block; }
    #oqc .flow .copy .catch-copy {
      font-size: 3.4rem; }
    #oqc .flow .copy .text {
      font-size: 14px; }

  #owners-club .overview {
    display: flex;
    flex-direction: column; }
    #owners-club .overview .lead {
      order: 1; }
    #owners-club .overview .note {
      order: 3; }
    #owners-club .overview .badge {
      position: static;
      margin-inline: auto;
      margin-top: 2rem;
      order: 2; }
  #owners-club .partnership .title {
    font-size: 14px; }
  #owners-club .partnership .list {
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    margin-top: 8px; } }