@media screen and (max-width: 767px) {
  header {
    padding: 10px 3% 10px 5%;
    height: 75px;
  }
}
header .header-logo {
  display: flex;
  align-items: center;
  gap: 25px;
}
header .header-logo h1 {
  line-height: 0;
}
@media screen and (max-width: 767px) {
  header .header-logo h1 {
    max-width: 112px;
  }
}
@media screen and (max-width: 767px) {
  header .header-logo .txtlink {
    font-size: 1.1rem;
  }
}
header .header-nav a {
  position: relative;
}
@media screen and (max-width: 767px) {
  header .header-nav a {
    font-size: 1.4rem;
  }
}
header .header-nav a::after {
  content: url(/assets/image/common/blank.svg);
  display: inline-block;
  margin-left: 5px;
  line-height: 0;
  vertical-align: 1px;
  width: 15px;
  height: 12px;
}

footer {
  padding: 0 0;
}
footer .layout {
  display: flex;
  justify-content: space-between;
}
footer .layout .copyright {
  font-size: clamp(1.2rem, 0.968rem + 0.3vw, 1.4rem);
}

.bg {
  background-color: #F6F6F4;
}

@media screen and (max-width: 767px) {
  main {
    padding-top: 75px;
  }
}

#hero {
  position: relative;
}
#hero .hero_txt {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
}
#hero .hero_txt h1 {
  color: #fff;
  font-size: clamp(3.2rem, 2.272rem + 1.2vw, 4rem);
}
#hero .hero_txt p {
  color: #fff;
  font-size: clamp(2.6rem, 2.136rem + 0.6vw, 3rem);
  margin-top: 16px;
}
#hero #visual {
  line-height: 0;
}

#portal_nav {
  padding-block: 80px 120px;
}
@media screen and (max-width: 767px) {
  #portal_nav {
    padding-block: 50px 60px;
  }
}
#portal_nav ul {
  display: flex;
  gap: 20px;
}
@media screen and (max-width: 767px) {
  #portal_nav ul {
    flex-direction: column;
  }
}
#portal_nav ul li {
  width: 33.333%;
}
@media screen and (max-width: 767px) {
  #portal_nav ul li {
    width: 100%;
  }
}
#portal_nav ul li a {
  position: relative;
  display: block;
  width: 100%;
  padding: 50px 8rem;
  background-color: #E5E4DF;
}
@media screen and (max-width: 767px) {
  #portal_nav ul li a {
    padding: 30px 5rem;
  }
}
#portal_nav ul li a.group-btn {
  background-color: #fff;
}
#portal_nav ul li a::after {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  top: 50%;
  right: 5rem;
  transform: translateY(-50%) rotate(45deg);
}
#portal_nav ul li a:hover {
  filter: brightness(0.9);
}

#outline {
  max-width: 870px;
  margin: auto;
  padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
  #outline {
    padding-bottom: 50px;
  }
}
#outline h2 {
  font-weight: 500;
  font-size: clamp(2.2rem, 1.272rem + 1.2vw, 3rem);
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  #outline h2 {
    margin-bottom: 30px;
  }
}
#outline p.lead {
  margin-bottom: 60px;
}
#outline .image {
  margin-bottom: 80px;
}
#outline .sankou {
  display: flex;
  gap: 3%;
  margin: 1rem;
}
@media screen and (max-width: 767px) {
  #outline .sankou {
    flex-direction: column;
  }
}
#outline .sankou .box {
  width: 33.333%;
  border-top: 1px solid #E5E4DF;
  border-bottom: 1px solid #E5E4DF;
  padding-block: 45px 35px;
}
@media screen and (max-width: 767px) {
  #outline .sankou .box {
    width: 100%;
    padding: 25px 0;
  }
}
#outline .sankou .box .title {
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  #outline .sankou .box .title {
    margin-bottom: 10px;
  }
}
#outline .sankou .box .title ruby {
  font-weight: 600;
  font-size: clamp(3rem, 2.072rem + 1.2vw, 3.8rem);
}
@media screen and (max-width: 767px) {
  #outline .sankou .box .title ruby {
    font-size: 5vw;
  }
}
#outline .sankou .box .title rt {
  font-weight: 600;
  font-size: clamp(1.2rem, 0.736rem + 0.6vw, 1.6rem);
  margin-bottom: 15px;
}
#outline .note {
  font-size: clamp(1rem, 0.768rem + 0.3vw, 1.2rem);
}

#require_detail {
  position: relative;
  background-color: #fff;
  padding: 80px 0;
}
@media screen and (max-width: 767px) {
  #require_detail {
    padding: 50px 0;
  }
}
#require_detail .layout {
  position: relative;
  z-index: 1;
  display: flex;
  max-width: 1240px;
  gap: 5%;
}
@media screen and (max-width: 767px) {
  #require_detail .layout {
    display: block;
  }
}
#require_detail .layout .col {
  width: 50%;
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col {
    width: 100%;
    margin-bottom: 5rem;
  }
}
#require_detail .layout .col h2 {
  font-size: clamp(2rem, 1.536rem + 0.6vw, 2.4rem);
  font-weight: 500;
  padding-bottom: 20px;
  border-bottom: 1px solid #101010;
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col h2 {
    margin-bottom: 30px;
  }
}
#require_detail .layout .col .lead {
  margin-bottom: 50px;
  font-size: clamp(1.6rem, 1.136rem + 0.6vw, 2rem);
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col .lead {
    margin-bottom: 20px;
  }
}
#require_detail .layout .col p {
  margin-bottom: 60px;
}
#require_detail .layout .col h3 {
  font-size: clamp(1.2rem, 0.968rem + 0.3vw, 1.4rem);
}
#require_detail .layout .col table {
  width: 100%;
  margin-bottom: 45px;
}
#require_detail .layout .col table.nb {
  margin-bottom: 30px;
}
#require_detail .layout .col table thead th {
  font-size: clamp(1.2rem, 0.968rem + 0.3vw, 1.4rem);
  text-align: right;
  padding: 10px 40px 10px 0;
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col table thead th {
    padding-right: 20px;
  }
}
#require_detail .layout .col table thead td {
  font-size: clamp(3rem, 2.536rem + 0.6vw, 3.4rem);
  font-weight: 500;
  text-align: right;
  line-height: 1;
  padding: 0px 40px 25px 0;
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col table thead td {
    padding-right: 20px;
  }
}
#require_detail .layout .col table tbody {
  border-top: 2px solid #C8C8C8;
  border-bottom: 2px solid #C8C8C8;
}
#require_detail .layout .col table tbody th {
  font-size: clamp(1.2rem, 0.968rem + 0.3vw, 1.4rem);
  border-bottom: 1px solid #C8C8C8;
  padding: 10px 0;
}
#require_detail .layout .col table tbody td {
  font-size: clamp(1.2rem, 0.968rem + 0.3vw, 1.4rem);
  text-align: right;
  border-bottom: 1px solid #C8C8C8;
  padding: 10px 40px 10px 0;
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col table tbody td {
    padding-right: 20px;
  }
}
#require_detail .layout .col table tbody.nodata {
  border-color: transparent;
}
@media screen and (max-width: 767px) {
  #require_detail .layout .col table tbody.nodata {
    display: none;
  }
}
#require_detail .layout .col table tbody.nodata th {
  border-color: transparent;
}
#require_detail .layout .col table tbody.nodata td {
  border-color: transparent;
}
#require_detail .layout .col .note {
  font-size: clamp(1rem, 0.724rem + 0.4vw, 1.3rem);
}
#require_detail .layout .col .links a {
  position: relative;
  display: block;
  background-color: #E5E4DF;
  line-height: 1;
  padding: 50px 8rem;
  font-size: clamp(1.4rem, 0.936rem + 0.6vw, 1.8rem);
  transition: all 0.3s;
}
#require_detail .layout .col .links a::after {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  top: 50%;
  right: 5rem;
  transform: translateY(-50%) rotate(45deg);
}
#require_detail .layout .col .links a:hover {
  filter: brightness(0.9);
}

#link-banner {
  max-width: 868px;
  margin: auto;
  padding-bottom: 100px;
  padding-inline: 3vw;
}
#link-banner .txt::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  margin-left: 10px;
  margin-bottom: 1px;
  transform: rotate(45deg);
}