@charset "utf-8";

.key-visual[data-v-2ceb6bbf] { height: 352px; position: relative; }

.key-visual[data-v-2ceb6bbf]::after { background-image: linear-gradient(90deg,transparent 0,var(--line-color) 50%,transparent 100%); bottom: -1px; content: ""; height: 2px; left: 0px; position: absolute; right: 0px; }

.key-visual h2[data-v-2ceb6bbf] { font-size: 36px; letter-spacing: 0.36px; line-height: 40px; text-transform: uppercase; }

@media screen and (min-width: 768px) {
  .key-visual h2[data-v-2ceb6bbf] { font-size: 60px; letter-spacing: 0.6px; line-height: 64px; }
}

@media screen and (min-width: 1244px) {
  .key-visual h2[data-v-2ceb6bbf] { font-size: 68px; letter-spacing: 0.68px; line-height: 72px; }
}

.key-visual .bg-holder[data-v-2ceb6bbf] { height: 100%; left: 0px; overflow: hidden; position: absolute; top: 0px; width: 100%; }

.key-visual .bg-holder[data-v-2ceb6bbf]::before { background-image: linear-gradient(rgb(0, 0, 0) -28.25%, rgba(102, 102, 102, 0)); content: ""; height: 128px; left: 0px; position: absolute; right: 0px; top: 0px; }

.key-visual .bg-holder[data-v-2ceb6bbf]::after { background-image: linear-gradient(0deg, rgb(6, 6, 6) -33.5%, transparent 68.25%); bottom: 0px; content: ""; height: 128px; left: 0px; position: absolute; right: 0px; }

.key-visual .bg-holder img[data-v-2ceb6bbf] { height: 100%; object-fit: cover; width: 100%; }

.key-visual .contents[data-v-2ceb6bbf] { height: 100%; }

.key-visual .contents h2[data-v-2ceb6bbf] { color: rgb(255, 255, 255); }

.key-visual .contents .inner[data-v-2ceb6bbf] { display: flex; flex-direction: column; height: 100%; justify-content: flex-end; padding: 0px 24px 30px; position: relative; }

@media screen and (min-width: 768px) {
  .key-visual[data-v-2ceb6bbf] { height: 528px; }
  .key-visual .contents .inner[data-v-2ceb6bbf] { padding-bottom: 72px; }
}

@media screen and (min-width: 1244px) {
  .key-visual[data-v-2ceb6bbf] { height: 544px; }
  .key-visual .contents .inner[data-v-2ceb6bbf] { padding-bottom: 112px; }
}