.ui-article {
  font-size: clamp(14px, 1.6vw, 16px);
}

#mainimgs {
  padding: 140px 1em 0.5em;
  background: url(/new_departments/images/kv-bg.jpg) no-repeat top 20px center/auto 120%;
}
#mainimgs::before {
  content: none;
}
#mainimgs h1 {
  text-align: center;
  margin-bottom: 1em;
}
#mainimgs h1 img {
  display: block;
  width: 100%;
  max-width: 815px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
#mainimgs small {
  display: block;
  width: 100%;
  font-size: clamp(16px, 2vw, 20px);
  text-align: center;
  line-height: 1.8;
  font-weight: bold;
  color: #333;
}
@media screen and (min-width: 768px) {
  #mainimgs {
    padding: min(4vw, 40px) min(4vw, 40px) min(5vw, 50px);
    background-position: top -20px center;
    background-size: 120% auto;
  }
}

.lead-area p.lead {
  font-size: clamp(16px, 2vw, 20px);
  text-align: center;
  line-height: 1.8;
  font-weight: bold;
  color: #333;
}

.departments_plan {
  text-align: center;
}
.departments_plan h2 {
  font-size: clamp(24px, 3.2vw, 32px);
  font-weight: 700;
  text-align: center;
  margin-bottom: 0.75em;
}
.departments_plan h2::after {
  content: "";
  display: block;
  width: 14em;
  border-bottom: 1px solid #009fc6;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.25em;
}
.departments_plan .list-departments {
  font-size: clamp(20px, 2.4vw, 24px);
  font-weight: 700;
  line-height: 1;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5em;
}
.departments_plan .list-departments li {
  display: block;
  width: 90%;
  padding: 0.2em 0.75em;
  position: relative;
  text-align: center;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
}
.departments_plan .list-departments li::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: skew(-30deg, 0);
          transform: skew(-30deg, 0);
  z-index: 0;
}
.departments_plan .list-departments li span {
  position: relative;
}
.departments_plan .list-departments li:nth-child(1)::before {
  background: #da5d98;
}
.departments_plan .list-departments li:nth-child(2)::before {
  background: #7fbe41;
}
.departments_plan .list-departments li:nth-child(3)::before {
  background: #e5a500;
}
.departments_plan .gakucho {
  display: inline-block;
  border: solid 1px #009fc6;
  padding: 0.75em 1em 1em;
  text-align: center;
}
.departments_plan .gakucho h4 {
  color: #009fc6;
  margin-bottom: 0.5em;
}
@media screen and (min-width: 768px) {
  .departments_plan .list-departments {
    flex-direction: row;
  }
}

.topics-area {
  background-color: #eeeff1;
  overflow: hidden;
  padding: clamp(10px, 2vw, 20px) clamp(20px, 4vw, 40px) clamp(20px, 4vw, 40px);
}
.topics-area h2 {
  font-size: clamp(24px, 3.2vw, 32px);
  font-weight: 700;
  text-align: left;
  margin-bottom: 0.2em;
  color: #009fc6;
}
.topics-area h2 span {
  display: inline-block;
  color: #000;
  font-weight: 400;
  font-size: 0.6em;
  vertical-align: middle;
}
.topics-area h3 {
  font-size: clamp(16px, 2vw, 20px);
  font-weight: 700;
  margin-bottom: 0.5em;
  border: none;
  padding: 0;
}
.topics-area p {
  line-height: 1.8;
}
.topics-area h4 {
  color: #273166;
}
.topics-area .box {
  padding: clamp(1em, 4vw, 40px);
  background-color: #fff;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
}

.access-area {
  position: relative;
}
.access-area h4 {
  color: #273166;
}
.access-area h2 {
  font-size: clamp(24px, 3.2vw, 32px);
  font-weight: 700;
  text-align: left;
  margin-bottom: 0.75em;
  color: #009fc6;
}
.access-area h2 span {
  display: inline-block;
  color: #000;
  font-weight: 400;
  font-size: 0.6em;
  vertical-align: middle;
}
.access-area .campus-k hgroup {
  padding-left: 0.75em;
  border-left: 0.5em solid #009fc6;
  line-height: 1.2;
}
.access-area .campus-k h3 {
  font-size: clamp(20px, 2.4vw, 24px);
  border: none;
  padding: 0;
  margin: 0 0 0.25em;
  color: #000;
}
.access-area .campus-k h4 {
  font-size: 1em;
  margin-bottom: 0.25em;
  padding-left: 0.5em;
  border-left: 0.3em solid #a0a8b3;
  line-height: 1.2;
  color: #000;
}
.access-area .campus-k h5 {
  font-weight: 700;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  margin-bottom: 0.25em;
}
.access-area .campus-k p + h5 {
  margin-top: 1em;
}