@charset "utf-8";

.mfCulture20260722 { width: 100%; padding: calc(70px * var(--gw-transform-scale, 1)) 0; box-sizing: border-box; background-color: rgb(248, 251, 255); font-family: system-ui, -apple-system, sans-serif; }

.mfCultureInner { max-width: calc(1200px * var(--gw-transform-scale, 1)); margin: 0px auto; padding: 0 calc(20px * var(--gw-transform-scale, 1)); }

.mfSectionHead { text-align: center; margin-bottom: calc(50px * var(--gw-transform-scale, 1)); }

.mfSectionHead .top-tag { display: inline-block; background-color: rgba(45, 141, 240, 0.1); color: rgb(45, 141, 240); font-size: calc(14px * var(--gw-transform-scale, 1)); padding: calc(6px * var(--gw-transform-scale, 1)) calc(18px * var(--gw-transform-scale, 1)); border-radius: 999px; margin-bottom: calc(12px * var(--gw-transform-scale, 1)); }

.mfSectionHead h2 { font-size: calc(32px * var(--gw-transform-scale, 1)); font-weight: 700; color: rgb(26, 26, 46); margin: 0 0 calc(12px * var(--gw-transform-scale, 1)); }

.mfSectionHead p { font-size: calc(15px * var(--gw-transform-scale, 1)); color: rgb(96, 107, 124); line-height: 1.6; max-width: calc(600px * var(--gw-transform-scale, 1)); margin: 0px auto; }

.mfCultureGrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(24px * var(--gw-transform-scale, 1)); }

.mfCultureCard { background-color: rgb(255, 255, 255); border: 1px solid rgb(228, 235, 245); border-radius: calc(16px * var(--gw-transform-scale, 1)); padding: calc(36px * var(--gw-transform-scale, 1)) calc(24px * var(--gw-transform-scale, 1)); text-align: center; transition: 0.3s; }

.mfCultureCard:hover { transform: translateY(calc(-6px * var(--gw-transform-scale, 1))); box-shadow: 0 calc(10px * var(--gw-transform-scale, 1)) calc(30px * var(--gw-transform-scale, 1)) rgba(45, 141, 240, 0.12); border-color: rgb(198, 224, 255); }

.mfCultureIcon { width: calc(64px * var(--gw-transform-scale, 1)); height: calc(64px * var(--gw-transform-scale, 1)); background-color: rgb(45, 141, 240); border-radius: calc(14px * var(--gw-transform-scale, 1)); display: flex; align-items: center; justify-content: center; margin: 0 auto calc(20px * var(--gw-transform-scale, 1)); transition: transform 0.3s; }

.mfCultureCard:hover .mfCultureIcon { transform: scale(1.08); }

.mfCultureIcon svg { width: calc(32px * var(--gw-transform-scale, 1)); height: calc(32px * var(--gw-transform-scale, 1)); fill: rgb(255, 255, 255); }

.mfCultureCard h4 { font-size: calc(20px * var(--gw-transform-scale, 1)); font-weight: 600; color: rgb(26, 26, 46); margin: 0 0 calc(12px * var(--gw-transform-scale, 1)); }

.mfCultureCard p { font-size: calc(14px * var(--gw-transform-scale, 1)); color: rgb(96, 107, 124); line-height: 1.65; margin: 0px; }

@media (max-width: calc(992px * var(--gw-transform-scale, 1))) {
  .mfCultureGrid { grid-template-columns: repeat(2, 1fr); }
  .mfSectionHead h2 { font-size: calc(28px * var(--gw-transform-scale, 1)); }
}

@media (max-width: calc(576px * var(--gw-transform-scale, 1))) {
  .mfCultureGrid { grid-template-columns: 1fr; }
  .mfSectionHead h2 { font-size: calc(24px * var(--gw-transform-scale, 1)); }
}