/* -----------------------------------------------------------
©PFU Limited
----------------------------------------------------------- */
:root {
  --font-color-white: #ffffff;
  --font-color-black: #000000;
  --font-color-red: #b11d1d;

  --background-color-black: #000000;
  --background-color-white: #ffffff;
  --background-color-red: #b11d1d;
  --background-color-gray: #d0d0d0;
  --background-color-lightGray: #f6f6f6;

  --button-color-red: #b11d1d;

  --accent-color-black: #000000;
  --accent-color-gray: #343434;
  --accent-color-white: #ffffff;
}

.section {
  padding-block: 32px;

  @media screen and (min-width: 769px) {
    padding-block: 40px;
  }

  &.-paddingTop2x {
    padding-top: 64px;

    @media screen and (min-width: 769px) {
      padding-top: 80px;
    }
  }
  &.-paddingTop3x {
    padding-top: 96px;

    @media screen and (min-width: 769px) {
      padding-top: 120px;
    }
  }
  &.-paddingBottom2x {
    padding-bottom: 64px;

    @media screen and (min-width: 769px) {
      padding-bottom: 80px;
    }
  }
  &.-paddingBottom3x {
    padding-bottom: 92px;

    @media screen and (min-width: 769px) {
      padding-bottom: 120px;
    }
  }
  /* &.-paddingBlock0 {
    padding-block: 0;
  } */
  /* &.-paddingBlock0Pc {
    @media screen and (min-width: 769px) {
      padding-block: 0;
    }
  } */
  &.-paddingBlock64 {
    padding-block: 48px;

    @media screen and (min-width: 769px) {
      padding-block: 64px;
    }
  }
  &.-paddingBlock2x {
    padding-block: 64px;

    @media screen and (min-width: 769px) {
      padding-block: 80px;
    }
  }

  &.-lightGray {
    background-color: var(--background-color-lightGray);
  }
}

.categoryLabel {
  width: fit-content;
  padding: 6px 10px;
  margin-inline: auto;
  background-color: var(--background-color-red);
  font-size: 1.6rem;
  color: var(--font-color-white);
  text-align: center;

  h2 + & {
    margin-top: 40px;
  }
}

.h5 {
  font-weight: bold;
  font-size: 2rem;
  text-align: center;

  @media screen and (min-width: 769px) {
    font-size: 2.4rem;
  }
}

/* -----------------------------------------------------------
ttlArea
----------------------------------------------------------- */
.ttlArea {
  display: block;
}

.ttlArea_inner {
  background-image: url(../images/common/seinan_mv_sp.webp) !important;

  @media screen and (min-width: 561px) {
    background-image: url(../images/common/seinan_mv.webp) !important;
  }
}

/* -----------------------------------------------------------
list
----------------------------------------------------------- */
.list {
  font-size: 1.6rem;
  line-height: 1.875em;

  @media screen and (min-width: 769px) {
    font-size: 1.8rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2rem;
  }

  &.-disc {
    > .list_item {
      padding-left: 1.2em;
      text-indent: -1.2em;

      &::before {
        content: "・ ";
      }
    }
  }
}

/* -----------------------------------------------------------
contentsTable
----------------------------------------------------------- */
.contentsTable {
}

.contentsTable_list {
  list-style: none;
  margin-top: 16px;

  @media screen and (min-width: 769px) {
    margin-top: 24px;
  }
}

.contentsTable_item {
  position: relative;
  padding-left: 1em;
  font-size: 1.6rem;

  @media screen and (min-width: 769px) {
    font-size: 1.8rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2rem;
  }

  &::before {
    position: absolute;
    top: 0.4em;
    left: 0;
    width: 0.6em;
    height: calc(0.6em * sqrt(3) / 2);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    background-color: var(--background-color-black);
    content: "";
  }

  & + & {
    margin-top: 16px;
  }
}

.contentTables_link {
  &:hover {
    text-decoration: underline;
  }
}

.contentsTable_link {
  &:hover {
    text-decoration: underline;
  }
}

/* -----------------------------------------------------------
articleTtl
----------------------------------------------------------- */
.articleTtl {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  font-weight: bold;

  @media screen and (min-width: 769px) {
    gap: 24px;
  }
}

.articleTtl_main {
  font-size: 2.4rem;
  color: var(--font-color-black);

  @media screen and (min-width: 769px) {
    font-size: 3.2rem;
  }
}

.articleTtl_sub {
  font-size: 1.8rem;

  @media screen and (min-width: 769px) {
    font-size: 2.4rem;
  }
}

/* -----------------------------------------------------------
media
----------------------------------------------------------- */
.media {
  display: flex;
  flex-direction: column;
  gap: 16px;

  @media screen and (min-width: 769px) {
    flex-direction: row;
    justify-content: space-between;
    gap: 40px;
  }
}

.media_txtArea {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 16px;

  @media screen and (min-width: 769px) {
    gap: 24px;
    max-width: 566px;
  }
}

.media_logo {
}

.media_name {
  font-weight: bold;
  font-size: 1.8rem;

  @media screen and (min-width: 769px) {
    font-size: 2rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2.4rem;
  }
}

.media_description {
  margin-top: 0;
  font-size: 1.6rem;

  @media screen and (min-width: 769px) {
    font-size: 1.8rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2rem;
  }
}

.media_imgArea {
  flex: 1;

  @media screen and (min-width: 769px) {
    max-width: 580px;
  }
}

/* -----------------------------------------------------------
articleHeading
----------------------------------------------------------- */
.articleContent {
  display: flex;
  flex-direction: column;
  gap: 64px;

  @media screen and (min-width: 769px) {
    gap: 80px;
  }
}

.articleContent_section {
  display: flex;
  flex-direction: column;
  gap: 24px;

  @media screen and (min-width: 769px) {
    gap: 32px;
  }
}

.articleHeading {
  padding: 0.85em;
  background-color: var(--background-color-lightGray);
  font-size: 2rem;
  color: var(--font-color-black);

  @media screen and (min-width: 769px) {
    font-size: 2.4rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2.8rem;
  }
}

.article_img {
  max-width: 100%;
}

.article_txt {
  font-size: 1.6rem;
  margin-top: 0;

  @media screen and (min-width: 769px) {
    font-size: 1.8rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2rem;
  }
}

/* -----------------------------------------------------------
dataList
----------------------------------------------------------- */
.dataList {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 2em;
  font-size: 1.6rem;
  line-height: 1.875em;

  @media screen and (min-width: 561px) {
    grid-template-columns: max-content 1fr;
  }
  @media screen and (min-width: 769px) {
    font-size: 1.8rem;
  }
  @media screen and (min-width: 1024px) {
    font-size: 2rem;
  }
}

.corpInfo_dataList {
  @media screen and (min-width: 769px) {
    min-width: 362px;
  }
}

.dataList_term {
  font-weight: bold;

  &:not(:first-child) {
    margin-top: 8px;

    @media screen and (min-width: 561px) {
      margin-top: 0;
    }
  }
}

/* -----------------------------------------------------------
corpInfo
----------------------------------------------------------- */
.corpInfo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  max-width: 1122px;
  margin-inline: auto;

  @media screen and (min-width: 769px) {
    flex-direction: row;
  }
}

.corpInfo_imgArea {
  @media screen and (min-width: 561px) {
    max-width: 80%;
  }
  @media screen and (min-width: 769px) {
    max-width: 580px;
  }
}
