@media screen and (min-width: 768px) {
}
/* ===============================
company
================================ */
#company {
}

/* ===============================
company : hero
================================ */
#company .company-hero {
 padding: 120px 0 0px;
 background: #ffffff;
 text-align: center;
}

#company .company-hero__title {
 font-size: 48px;
 font-weight: 700;
 text-align: center;
 letter-spacing: 0.12em;
 color: #0a1a2a;
}

/* ===============================
company : info
================================ */
#company .company-info {
 padding: 60px 0;
 background: #fff;
}

#company .company-info__list {
 max-width: 900px;
 margin: 0 auto;
 border-top: 1px solid #e5e5e5;
}

#company .company-info__row {
 display: grid;
 grid-template-columns: 240px 1fr;
 padding: 28px 0;
 border-bottom: 1px solid #e5e5e5;
}

#company .company-info__row dt {
 font-size: 18px;
 font-weight: 700;
 color: #0a1a2a;
}

#company .company-info__row dd {
 font-size: 18px;
 line-height: 1.8;
 color: #333;
}

/* ===============================
SP
================================ */
@media screen and (max-width: 767px) {
 #company .company-hero {
  padding: 120px 0 60px;
 }

 #company .company-hero__title {
  font-size: 32px;
 }

 #company .company-info {
  padding: 20px 0;
 }

 #company .company-info__row {
  grid-template-columns: 1fr;
  gap: 12px;
 }

 #company .company-info__row dt {
  font-size: 16px;
 }

 #company .company-info__row dd {
  font-size: 16px;
 }
}
/* ===============================
company : role
================================ */
#company .company-role {
 padding: 60px 0;
 background: #f2f4f6;
}

#company .company-role-inner {
 max-width: 900px;
 margin: 0 auto;
}

#company .company-role-title {
 margin-bottom: 48px;
 font-size: 32px;
 font-weight: 700;
 color: #004a9f;
}

#company .company-role-text {
 display: grid;
 gap: 32px;
}

#company .company-role-text p {
 font-size: 18px;
 line-height: 1.9;
 color: #333;
}

/* box */
#company .company-role-box {
 margin-top: 32px;
 background: #fff;
 padding: 48px;
}

#company .company-role-box h3 {
 margin-bottom: 28px;
 font-size: 20px;
 font-weight: 700;
 color: #0a1a2a;
}

#company .company-role-box ul {
 display: grid;
 gap: 16px;
}

#company .company-role-box li {
 position: relative;
 padding-left: 20px;
 font-size: 18px;
 line-height: 1.8;
 color: #333;
}

#company .company-role-box li::before {
 content: "・";
 position: absolute;
 left: 0;
 top: 0;
}

/* ===============================
SP
================================ */
@media screen and (max-width: 767px) {
 #company .company-role {
  padding: 60px 0;
 }

 #company .company-role-title {
  font-size: 24px;
 }

 #company .company-role-text p {
  font-size: 16px;
 }

 #company .company-role-box {
  padding: 32px;
 }

 #company .company-role-box li {
  font-size: 16px;
 }
}