section {
 position: relative;
 width: 100%;
}

.bg {
 position: relative;
 padding: 0 0 140px;
 background: url(/common/img/common_bg.webp) center top;
}
@media screen and (max-width: 1024px) {
 .bg {
  padding-bottom: 70px;
 }
}
@media screen and (max-width: 600px) {
 .bg {
  padding-top: 0;
 }
}

.bg2 {
 padding-bottom: 90px;
 background: url(/common/img/common_bg.webp) center top;
}
@media screen and (max-width: 1024px) {
 .bg2 {
  padding-bottom: 45px;
 }
}

.message {
 margin-top: 150px;
 background: linear-gradient(to top, #ffffff, transparent 30%) bottom center/100% 100%;
}
@media screen and (max-width: 1024px) {
 .message {
  margin-top: 100px;
 }
}
@media screen and (max-width: 600px) {
 .message {
  margin-top: 70px;
  padding-bottom: 40px;
 }
}
.message >.inner {
 width: 90%;
 max-width: 1100px;
 margin: 0 auto;
}
.message--wrap {
 display: grid;
 align-items: flex-end;
 grid-template-columns: 41% 1fr;
 gap: 7%;
}
@media screen and (max-width: 1024px) {
 .message--wrap {
  align-items: flex-start;
 }
}
@media screen and (max-width: 600px) {
 .message--wrap {
  grid-template-columns: 1fr;
  gap: 30px;
 }
}
.message--ceo {
 position: relative;
}
@media screen and (max-width: 600px) {
 .message--ceo {
  width: 80%;
  margin: 0 auto;
 }
}
.message--ceo h2 {
 position: absolute;
 top: -55px;
 right: 30px;
 writing-mode: vertical-rl;
 text-orientation: upright;
 line-height: 1;
 padding: 20px 10px 10px;
 background: var(--white);
 font-weight: 500;
 font-size: 40px;
 font-feature-settings: normal;
 letter-spacing: 0.18em;
}
@media screen and (max-width: 1024px) {
 .message--ceo h2 {
  top: -40px;
  right: 20px;
  padding: 10px;
  font-size: 24px;
 }
}
.message--ceo img {
 border-radius: 10px;
}
.message--text {
 padding-right: 4%;
}
@media screen and (max-width: 600px) {
 .message--text {
  padding: 0;
 }
}
.message--text p {
 line-height: 2;
 font-size: 16px;
 letter-spacing: 0.14em;
}
@media screen and (max-width: 1024px) {
 .message--text p {
  font-size: 14px;
 }
}
.message--text p.signature {
 display: flex;
 align-items: center;
 gap: 10px;
 margin-top: 2em;
}
.message--img {
 margin-top: 135px;
 text-align: center;
}
@media screen and (max-width: 1024px) {
 .message--img {
  margin-top: 70px;
 }
}
.message--img img {
 width: 80%;
 max-width: 842.5px;
}
@media screen and (max-width: 600px) {
 .message--img img {
  width: 90%;
 }
}

.purpose {
 padding-top: calc(100vw / var(--aspect-ratio) + 90px);

 --width: 1500;
 --height: 110;
 --aspect-ratio: calc(var(--width) / var(--height));
}
.purpose .arch {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
}
.purpose .arch img {
 width: 100%;
}
.purpose >.inner {
 width: 90%;
 max-width: 900px;
 margin: 0 auto;
}
.purpose .ttl_bl {
 display: inline-block;
 line-height: 1;
 padding: 10px 20px 12px;
 color: var(--white);
 background: var(--c_bl);
 font-weight: bold;
 font-size: 24px;
 letter-spacing: -0.01em;
}
@media screen and (max-width: 1024px) {
 .purpose .ttl_bl {
  padding: 10px 10px 12px;
  font-size: 18px;
 }
}
.purpose hgroup {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 gap: 30px;
}
@media screen and (max-width: 1024px) {
 .purpose hgroup {
  gap: 15px;
 }
}
.purpose hgroup p {
 line-height: 1.4166666667;
 font-weight: 600;
 font-size: 60px;
 letter-spacing: 0.06em;
}
@media screen and (max-width: 1024px) {
 .purpose hgroup p {
  font-size: 40px;
 }
}
@media screen and (max-width: 600px) {
 .purpose hgroup p {
  font-size: 30px;
 }
}
.purpose--lead {
 display: grid;
 position: relative;
 align-items: center;
 grid-template-rows: auto;
 grid-template-columns: auto;
 margin-bottom: 30px;
}
.purpose--lead_base,.purpose--lead_text {
 position: relative;
 grid-column: 1/1;
 grid-row: 1/1;
}
.purpose--lead_base {
 text-align: right;
}
.purpose--lead_base img {
 width: 80%;
 max-width: 725.5px;
 translate: 7% 0;
}
@media screen and (max-width: 1024px) {
 .purpose--lead_base img {
  width: 70%;
 }
}
@media screen and (max-width: 600px) {
 .purpose--lead_base img {
  translate: 5.5% 0;
 }
}
.purpose--lead_text p.lead {
 line-height: 1.5384615385;
 margin-top: 40px;
 font-weight: 500;
 font-size: 26px;
 letter-spacing: 0.1em;
}
@media screen and (max-width: 1024px) {
 .purpose--lead_text p.lead {
  margin-top: 25px;
  font-size: 20px;
 }
}
@media screen and (max-width: 600px) {
 .purpose--lead_text p.lead {
  font-size: 16px;
 }
}
.purpose--lists {
 display: flex;
 width: 100%;
 flex-direction: column;
 gap: 20px;
}
.purpose--lists li {
 padding: 50px 10%;
 background: var(--white);
}
@media screen and (max-width: 1024px) {
 .purpose--lists li {
  padding: 30px 5%;
 }
}
.purpose--lists .ttl_bl {
 margin-bottom: 15px;
 font-size: 20px;
}
@media screen and (max-width: 1024px) {
 .purpose--lists .ttl_bl {
  font-size: 18px;
 }
}
.purpose--lists h4 {
 line-height: 1.5625;
 font-weight: 600;
 font-size: 32px;
 letter-spacing: 0.1em;
}
@media screen and (max-width: 1024px) {
 .purpose--lists h4 {
  font-size: 22px;
  letter-spacing: 0.06em;
 }
}
.purpose--lists dl {
 display: grid;
 align-items: center;
 grid-template-columns: 240px 1fr;
 gap: 10px 30px;
 margin-top: 30px;
}
@media screen and (max-width: 1024px) {
 .purpose--lists dl {
  grid-template-columns: 180px 1fr;
  gap: 10px 20px;
 }
}
@media screen and (max-width: 600px) {
 .purpose--lists dl {
  grid-template-columns: 1fr;
  gap: 0;
  margin-top: 20px;
 }
}
.purpose--lists dl dt {
 line-height: 1;
 padding: 15px 0;
 border-radius: 50px;
 color: var(--c_bl);
 background: #f1f1f1;
 font-weight: 600;
 font-size: 22px;
 text-align: center;
 letter-spacing: 0.1em;
}
@media screen and (max-width: 1024px) {
 .purpose--lists dl dt {
  font-size: 18px;
 }
}
@media screen and (max-width: 600px) {
 .purpose--lists dl dt {
  margin-bottom: 10px;
 }
}
.purpose--lists dl dd {
 line-height: 2;
 font-size: 16px;
 letter-spacing: 0.1em;
}
@media screen and (max-width: 1024px) {
 .purpose--lists dl dd {
  font-size: 14px;
 }
}
@media screen and (max-width: 600px) {
 .purpose--lists dl dd:not(:last-child) {
  margin-bottom: 30px;
 }
}
.purpose--lists_items {
 display: grid;
 align-items: center;
 grid-template-columns: 46.5% 1fr;
}
@media screen and (max-width: 1024px) {
 .purpose--lists_items {
  grid-template-columns: 38% 1fr;
 }
}
@media screen and (max-width: 600px) {
 .purpose--lists_items {
  grid-template-columns: 1fr;
  gap: 20px;
 }
}
.purpose--lists_items p.txt {
 line-height: 2;
 font-size: 16px;
 letter-spacing: 0.14em;
}
@media screen and (max-width: 1024px) {
 .purpose--lists_items p.txt {
  font-size: 14px;
 }
}
/*# sourceMappingURL=layout.css.map */