@charset "utf-8";

.l-pgttl { background-image: url("../image/pgttl.jpg"); background-position: center bottom; }

/*--------------------------------------------------------------------------------
  社訓
--------------------------------------------------------------------------------*/
.sec-motto {
  padding: var(--space-l) var(--side-space);
  font-family: var(--ff-wf);
}
.motto-hd {
  line-height: 1;
  padding-bottom: clamp(40px, (100 / 1200 * 100vw), 80px);
}
.motto-hd span {
  position: relative;
  font-weight: 500;
  padding: 0.4em 2em;
  color: #FFF;
  font-size: var(--fs-m);
}
.motto-hd span:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  background-color: var(--blue);
  transform: skewX(-24deg);
}
.motto {
  display: inline-grid;
  grid-template-columns: repeat(2,auto);
  position: relative;
  line-height: 1.7;
  font-size: var(--fs-4l);
  color: var(--bnavy);
  font-weight: 700;
  padding: var(--space-2s) var(--space-s);
}
.motto:before,
.motto:after {
  content: "";
  width: clamp(15px, (30 / 1200 * 100vw), 30px);
  height: 100%;
  position: absolute;
  top: 0;
  border: 2px solid var(--bnavy);
}
.motto:before { left: 0; border-right: 0; }
.motto:after { right: 0; border-left: 0; }
.motto span { padding: 0 0.5em; }
.motto span:last-of-type { grid-column: 1 / 4; font-size: 130%; }
@media print, screen and (max-width:640px) {
  .motto {
    font-size: max(4.5vw, 1.3em);
  }
}

/*--------------------------------------------------------------------------------
  理念
--------------------------------------------------------------------------------*/
.sec-mission {
  position: relative;
  padding-left: var(--side-space);
  padding-right: var(--side-space);
  padding-top: var(--space-m);
  overflow: hidden;
}
.sec-mission:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: var(--bg-blue);
  z-index: -1;
}
.mission-container {
  max-width: var(--base-width);
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  display: grid;
}
.mission {
  padding: var(--space-s) 0 var(--space-s) var(--space-s);
  position: relative;
}
.mission:before {
  content: "";
  width: 100vw;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: #FFF;
  z-index: -1;
}
.mission dt {
  font-family: var(--ff-wf);
  font-weight: 700;
  color: var(--blue);
  font-size: var(--fs-2l);
  line-height: 1.6;
  margin-left: 1.8em;
  text-indent: -1.8em;
}
.mission dd {
  padding-top: 0.8em;
}
.mission dt:not(:first-of-type) {
  padding-top: calc(var(--space-2s) * 1.8);
}
.mission dd:not(:last-of-type) {
  padding-bottom: calc(var(--space-2s) * 1.8);
  border-bottom: 1px solid rgba(var(--blue-rgba),0.1);
}
@media print, screen and (min-width:961px) {
  .mission-container {
    grid-template-columns: auto 1fr;
  }
  .mission {
    margin-top: 3em;
  }
  .mission-hd {
    padding-right: var(--space-m);
  }
}
@media print, screen and (max-width:960px) {
  .mission-hd {
    padding-bottom: var(--space-m);
  }
}

/*--------------------------------------------------------------------------------
  概要
--------------------------------------------------------------------------------*/
.sec-outline {
  padding-left: var(--side-space);
  padding-right: var(--side-space);
  padding-bottom: var(--space-l);
}
.outline {
  max-width: var(--base-width);
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}
.outlineTbl {
  width: 100%;
  border: 0;
  border-collapse: collapse;
  line-height: 1.6;
  margin-top: var(--space-s);
}
.outlineTbl th,
.outlineTbl td {
  text-align: left;
}
.outlineTbl th {
  font-size: 1.1em;
  font-weight: bold;
  white-space: nowrap;
  width: 20%;
  padding-left: 1.5em;
  padding-right: 1.5em;
  border-bottom: 1px solid rgba(var(--black-rgba),1);
}
.outlineTbl td {
  padding-left: 3em;
  border-bottom: 1px solid rgba(var(--black-rgba),0.15);
}
.outlineTbl_shiten {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--space-m);
  grid-row-gap: 1.25em;
}
.outlineTbl_shiten dt {
  font-weight: bold;
}
.outlineTbl_shiten dd {
  padding-top: 0.5em;
}
.outlineTbl_shikakusha {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--space-l);
}
@media print, screen and (min-width:961px) {
  .sec-outline {
    padding-top: var(--space-m);
  }
  .outlineTbl th,
  .outlineTbl td {
    padding-bottom: 1.8em;
  }
  .outlineTbl th {
    padding-top: 1.7em;
  }
  .outlineTbl td {
    padding-top: 1.8em;
  }
}
@media print, screen and (max-width:960px) {
  .sec-outline {
    padding-top: var(--space-l);
  }
  .outlineTbl th,
  .outlineTbl td {
    padding-bottom: 1.5em;
  }
  .outlineTbl th {
    padding-top: 1.4em;
  }
  .outlineTbl td {
    padding-top: 1.5em;
  }
}
@media print, screen and (max-width:640px) {
  .outlineTbl {
    font-size: 95%;
  }
  .outlineTbl td {
    padding-left: 2em;
  }
  .outlineTbl th {
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}
