/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */#kbc-introduction { .introduction-ideal.grid-col-left-pc { gap: var(--gap5); } }

@media (48rem <= width) { #kbc-introduction { .introduction-ideal.grid-col-left-pc { gap: var(--gap10); } } }
#kbc-introduction { .introduction-ideal .grid-area_img-left { order: 3; } }

@media (48rem <= width) { #kbc-introduction { .introduction-ideal .grid-area_img-left { order: 0; width: 31.75rem; } } }
#kbc-introduction { .introduction-ideal_title { letter-spacing: var(--letterspacing-l); font-size: var(--font-heading-s); font-weight: var(--font-weight-bold); } }

@media (48rem <= width) { #kbc-introduction { .introduction-ideal_title { font-size: var(--font-heading-m); } } }
#kbc-introduction { .introduction-bg-area > .bg-area { display: grid; gap: var(--gap2); } }

@media (48rem <= width) { #kbc-introduction { .introduction-bg-area > .bg-area { gap: var(--gap4); } } }
#kbc-introduction { .introduction-container-medium { gap: var(--gap5); margin: 0 auto var(--gap5); } }

@media (48rem <= width) { #kbc-introduction { .introduction-container-medium { width: 88%; margin: 0 auto var(--gap10); } } }
#kbc-introduction { .introduction-banner { margin: var(--gap5) auto; } }

@media (48rem <= width) { #kbc-introduction { .introduction-banner { margin: var(--gap10) auto; } } }
#kbc-introduction { .introduction-banner img { border-radius: var(--radius-l); } }

@media (48rem <= width) { #kbc-introduction { .introduction-sec01_img { width: 10.75rem; height: auto; margin-left: var(--gap4); } } }
#kbc-introduction { .introduction-sec02 .section-container-medium,
  .introduction-sec03 .section-container-medium { margin-bottom: var(--gap4); } }

@media (48rem <= width) { #kbc-introduction { .introduction-sec02 .section-container-medium,
    .introduction-sec03 .section-container-medium { margin-bottom: var(--gap5); } } }
#kbc-introduction { .introduction-sec03 .introduction-brand-info { gap: var(--gap4); } }

@media (48rem <= width) { #kbc-introduction { .introduction-sec03 .introduction-brand-info { gap: var(--gap3); } } }