@charset "utf-8";
/* =========================================================================
   about-custom.css  ― SHINEについて
   ========================================================================= */

/* ==========================================================================
   1. SHINEの想い
   ========================================================================== */
.shine-sec-thoughts {
  padding-top: 72px;
}
.shine-grid-thoughts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 26px;
  margin-top: 42px;
}
.shine-thought-card {
  padding: 30px 28px 34px;
  background: #fff;
  border-radius: 26px;
  box-shadow: 0 6px 18px rgba(127, 184, 193, 0.18);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.shine-thought-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 26px rgba(127, 184, 193, 0.3);
}
.shine-thought-card__deco {
  display: block;
  width: 62px;
  height: auto;
  margin: 0 auto;
}
.shine-thought-card__title {
  margin: 18px 0 12px;
  font-size: 1.9rem;
  font-weight: 400;
  line-height: 1.7;
  color: #3E7F8B;
}
/* PC時のみ中央配置（改行は本文中の <br class="pc-only"> で制御） */
@media screen and (min-width: 897px) {
  .shine-thought-card__title {
    text-align: center;
  }
}
.shine-thought-card__text {
  margin: 0;
  font-size: 1.5rem;
  color: #5F6C71;
}

/* ==========================================================================
   2. 代表挨拶
   ========================================================================== */
.shine-sec-greeting {
  padding-top: 72px;
}
.shine-greeting {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 36px;
  align-items: center;
  padding: 44px;
  background: #fff;
  border-radius: 30px;
}
/* 代表画像は 500×500 の正方形。比率どおり表示してトリミングしない */
.shine-greeting__img {
  width: 100%;
  max-width: 320px;
  margin-inline: auto;
  aspect-ratio: 1/1;
  border-radius: 22px;
  overflow: hidden;
}
.shine-greeting__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.shine-greeting__en {
  display: block;
  font-family: "Josefin Sans", sans-serif;
  font-size: 1.2rem;
  letter-spacing: 0.3em;
  color: #9FBFC6;
}
.shine-greeting__ttl {
  margin: 6px 0 18px;
  font-size: 2.7rem;
  font-weight: 400;
  color: #3E7F8B;
}
.shine-greeting__text p {
  margin: 0;
  font-size: 1.55rem;
  color: #5F6C71;
}
.shine-greeting__text p + p {
  margin-top: 16px;
}
.shine-greeting__sign {
  margin: 20px 0 0;
  font-size: 1.5rem;
  color: #414C50;
}
.shine-greeting__sign span {
  font-size: 1.9rem;
}

@media screen and (max-width: 639px) {
  .shine-sec-thoughts,
  .shine-sec-greeting { padding-top: 44px; }
  .shine-greeting { padding: 26px; gap: 24px; border-radius: 24px; }
  .shine-greeting__img { max-width: 240px; }
  .shine-greeting__ttl { font-size: 2.2rem; }
}

/* ==========================================================================
   3. 企業理念
   ========================================================================== */
.shine-sec-mission {
  position: relative;
  margin-top: 76px;
  padding: 110px 20px;
  overflow: hidden;
}
.shine-sec-mission__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.shine-sec-mission__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(62, 127, 139, 0.18), rgba(62, 127, 139, 0.34));
}
.shine-sec-mission__inner {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
}
.shine-sec-mission__en {
  display: block;
  font-family: "Josefin Sans", sans-serif;
  font-size: 1.2rem;
  letter-spacing: 0.34em;
  text-shadow: 0 2px 10px rgba(40, 80, 90, 0.5);
}
.shine-sec-mission__ttl {
  margin: 6px 0 28px;
  font-size: 2.7rem;
  font-weight: 400;
  text-shadow: 0 2px 12px rgba(40, 80, 90, 0.5);
}
.shine-sec-mission__text {
  margin: 0;
  font-size: 2.6rem;
  line-height: 2.1;
  text-shadow: 0 3px 14px rgba(40, 80, 90, 0.55);
}

@media screen and (max-width: 639px) {
  .shine-sec-mission { margin-top: 44px; padding: 60px 20px; }
  .shine-sec-mission__ttl { font-size: 2.2rem; margin-bottom: 20px; }
  .shine-sec-mission__text { font-size: 1.8rem; line-height: 1.9; }
}

/* ==========================================================================
   4. 年間行事
   ========================================================================== */
.shine-sec-event {
  padding-top: 72px;
  padding-bottom: 90px;
}
/* 見出し「年間行事」の下に余白を追加 */
.shine-sec-event .shine-sec-head {
  margin-bottom: 50px;
}
.shine-grid-event {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 22px;
  margin-top: 38px;
}
.shine-event-card {
  position: relative;
  margin-top: 110px;
  padding: 26px 24px 30px;
  background: #fff;
  border-radius: 24px;
  border-top: 6px solid #7FB8C1;
}
.shine-event-card--spring { border-top-color: #F2A0BE; }
.shine-event-card--summer { border-top-color: #8FBF7A; }
.shine-event-card--autumn { border-top-color: #F5A623; }
.shine-event-card--winter { border-top-color: #9FCBE0; }

.shine-event-card__img {
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translateX(-50%);
  width: 130px;
  height: auto;
  display: block;
}
.shine-event-card__en {
  margin: 0;
  font-family: "Josefin Sans", sans-serif;
  font-size: 1.2rem;
  letter-spacing: 0.2em;
  color: #B9C6CA;
}
.shine-event-card__ja {
  margin: 4px 0 14px;
  font-size: 2rem;
  font-weight: 400;
  color: #3E7F8B;
}
.shine-event-card__text {
  margin: 0;
  font-size: 1.5rem;
  color: #5F6C71;
}

@media screen and (max-width: 639px) {
  .shine-sec-event { padding-top: 44px; padding-bottom: 50px; }
  .shine-event-card { margin-top: 100px; }
}