﻿@media (max-width: 1200px) {
			.hero-copy {
				min-height: 52vw;
				padding: 8vw 24px 7vw;
			}

			.hero-heading {
				font-size: clamp(30px, 3.8vw, 36px);
			}

			.hero-label {
				font-size: clamp(16px, 1.8vw, 20px);
				height: clamp(40px, 4.4vw, 56px);
			}

			.hero-description {
				font-size: clamp(14px, 1.5vw, 16px);
			}

			.hero-cta {
				margin-top: 48px;
			}

			.hero-cta img {
				width: 564px;
				height: 98px;
			}
		}

@media (min-width: 769px) {
			.kadai-card-head {
				height: 64px;
			}
}


@media (max-width: 1060px) and (min-width: 769px) {
			.kadai-grid-bottom {
							grid-template-columns: repeat(2, minmax(0, 1fr));
				row-gap: 42px;
			}

			.kadai-solution-card {
							width: 100%;
							max-width: 560px;
				height: auto;
				min-height: 411px;
				padding-bottom: 185px;
			}

			.kadai-solution-image {
							width: calc(100% - 32px);
							max-width: 352px;
							left: 50%;
							transform: translateX(-50%);
				background-size: 384px 411px;
				background-position: -16px -235px;
			}

			.how_to_use-steps {
				width: 384px;
				grid-template-columns: 384px;
				row-gap: 48px;
			}

			.how_to_use-steps-line {
				top: 24px;
				bottom: 24px;
				left: 50%;
				right: auto;
				height: auto;
				width: 3px;
				transform: translateX(-50%);
			}

			.onboarding-steps {
				width: 384px;
				grid-template-columns: 384px;
				row-gap: 48px;
			}

			.onboarding-steps-line {
				top: 24px;
				bottom: 24px;
				left: 50%;
				right: auto;
				height: auto;
				width: 3px;
				transform: translateX(-50%);
			}
}

@media (max-width: 1200px) {
			.section.solution-section,
			.section.function-section,
			.section.voice-section,
			.section.why-brainco-section,
			.section.how_to_use-section,
			.section.faq-section {
				height: auto;
				min-height: 0;
			}

			.how_to_use-section,
			.comparison-section {
				width: 100%;
				max-width: 100%;
				padding-left: 24px;
				padding-right: 24px;
				overflow-x: clip;
			}

			.overview-section {
				width: 100%;
				padding: 40px 24px 24px;
			}

			.overview-title {
				margin-bottom: 24px;
			}

			.overview-title img {
				width: min(411px, 100%);
			}

			.overview-card {
				width: 100%;
				min-height: clamp(280px, 36vw, 424px);
				padding: clamp(40px, 6vw, 72px) clamp(28px, 8vw, 120px) clamp(36px, 5vw, 58px);
				background-size: 100% 100%;
			}

			.overview-heading {
				font-size: clamp(18px, 2.2vw, 24px);
			}

			.overview-description {
				margin-top: 24px;
				font-size: clamp(10px, 1.1vw, 12px);
			}

			.kadai-section {
				width: 100%;
				padding: 36px 24px 16px;
			}

			.kadai-title {
				margin-bottom: 28px;
			}

			.kadai-title img,
			.kadai-summary img {
				width: min(100%, 760px);
			}

			.kadai-grid-top {
				grid-template-columns: repeat(2, minmax(0, 282px));
				gap: 16px;
			}

			.kadai-grid-bottom {
				grid-template-columns: repeat(2, minmax(0, 1fr));
				gap: 24px;
				margin-top: 28px;
			}

			.kadai-grid-bottom > .kadai-solution-card:last-child:nth-child(odd) {
				grid-column: 1 / -1;
				justify-self: center;
			}

			.kadai-card,
			.kadai-solution-card {
				width: 100%;
				max-width: 384px;
				min-width: 0;
				height: auto;
				min-height: 411px;
				padding-bottom: 185px;
				margin: 0 auto;
			}

			.kadai-solution-card {
				min-height: 0;
				padding: 16px;
				justify-content: flex-start;
				align-items: stretch;
			}

			.kadai-solution-image {
				position: static;
				width: min(100%, 352px);
				height: 160px;
				max-width: 352px;
				left: auto;
				transform: none;
				align-self: center;
				margin-top: 0;
				background-size: 109.1% auto;
				background-position: center 93.6%;
			}

			.kadai-summary {
				margin-top: 40px;
			}

			.function-section {
				padding-top: 18px;
			}

			.function-section .headline img {
				width: min(531px, 100%);
			}

			.dekirukoto-wrap {
				width: 100%;
				padding: 0 24px;
			}

			.program-carousel {
				padding-inline: clamp(40px, 6vw, 64px);
			}

			.program-nav {
				width: clamp(40px, 5vw, 52px);
				height: clamp(40px, 5vw, 52px);
			}

			.program-nav img {
				width: 100%;
				height: 100%;
			}

			.dekirukoto-cards,
			.function-feature {
				width: 100%;
			}

			.function-feature {
				grid-template-columns: minmax(0, 44%) minmax(0, 56%);
				gap: 16px;
			}

			.function-feature-image,
			.function-feature-text {
				width: 100%;
				height: auto;
			}

			.function-feature-image {
				max-width: 528px;
				justify-self: start;
			}

			.function-feature-image img {
				height: auto;
			}

			.function-feature-title {
				font-size: clamp(22px, 2.8vw, 32px);
			}

			.function-feature-description {
				font-size: clamp(15px, 1.8vw, 20px);
			}

			.how_to_use-title img {
				width: 100%;
				height: auto;
			}

			.onboarding-step-image {
				width: calc(100% - 32px);
				max-width: 352px;
			}

			.why-brainco-section .senmonka-cards {
				width: 100%;
				max-width: 1180px;
				grid-template-columns: repeat(2, minmax(0, 1fr));
				gap: 16px;
			}

			.why-brainco-section .senmonka-card {
				width: 100%;
				max-width: 580px;
			}

			.comparison-table-wrap {
				overflow-x: hidden;
			}

			.comparison-table {
				max-width: 100%;
			}

			.comparison-table th,
			.comparison-table td {
				word-break: break-word;
				overflow-wrap: anywhere;
			}
		}

@media (max-width: 850px) and (min-width: 769px) {
			.kadai-grid-bottom {
				width: 100%;
				max-width: 384px;
				grid-template-columns: minmax(0, 1fr);
				row-gap: 42px;
				margin-left: auto;
				margin-right: auto;
			}

			.kadai-solution-card {
				width: 100%;
				max-width: 384px;
				height: auto;
			}

			.kadai-solution-image {
				position: static;
				width: min(100%, 352px);
				height: 160px;
				max-width: 352px;
				left: auto;
				transform: none;
				align-self: center;
				background-size: 384px 411px;
				background-position: -16px -235px;
			}
}

@media (max-width: 1200px) and (min-width: 769px) {
			.how_to_use-stack,
			.step-section-stack {
				width: 100%;
				max-width: 1200px;
				min-width: 0;
				box-sizing: border-box;
			}

			.how_to_use-title {
				width: 100%;
				height: auto;
			}

			.how_to_use-title .sp-section-title {
				width: 100%;
				grid-template-columns: 64px minmax(0, 1fr);
				padding-right: clamp(16px, 7.3vw, 80px);
				box-sizing: border-box;
			}

			.how_to_use-title .sp-section-title-text {
				font-size: clamp(24px, 3.4vw, 40px);
				white-space: normal;
			}

			.how_to_use-step,
			.step-section-image {
				width: 100%;
			}

			.header-inner {
				gap: clamp(8px, 1.3vw, 14px);
				padding-right: clamp(12px, 3.67vw, 40px);
				padding-left: clamp(12px, 3.67vw, 40px);
			}

			.logo img {
				width: clamp(104px, 14vw, 153px);
				height: auto;
			}

			.header-links {
				gap: clamp(8px, 1.3vw, 16px);
			}

			.header-btn {
				gap: clamp(4px, 0.67vw, 8px);
				padding-right: clamp(10px, 2.67vw, 32px);
				padding-left: clamp(10px, 2.67vw, 32px);
				font-size: clamp(12px, 1.33vw, 16px);
			}

			.header-pc-nav {
				width: 100%;
				max-width: 100%;
				gap: clamp(6px, 1vw, 12px);
				padding: 4px clamp(8px, 1.3vw, 16px);
				box-sizing: border-box;
			}

			.header-pc-nav a {
				font-size: clamp(12px, 1.35vw, 16px);
				letter-spacing: 0;
			}

			.plan-stack {
				width: 100%;
				max-width: 1200px;
				box-sizing: border-box;
			}

			.plan-cards {
				--plan-card-gap: clamp(16px, 2.7vw, 32px);
				width: 100%;
				max-width: 960px;
				gap: var(--plan-card-gap);
				box-sizing: border-box;
			}

			.plan-cards .plan-card {
				width: calc((100% - var(--plan-card-gap)) / 2) !important;
				min-width: 0;
			}

			.price-note-box {
				width: 100%;
				max-width: 960px;
				box-sizing: border-box;
			}

			.contact-cta {
				width: 100%;
				max-width: 1200px;
				box-sizing: border-box;
			}

			.contact-form-block {
				width: 100%;
				max-width: 960px;
				padding-right: clamp(24px, calc((100% - 720px) / 2), 120px);
				padding-left: clamp(24px, calc((100% - 720px) / 2), 120px);
				box-sizing: border-box;
			}

			.contact-form {
				width: min(720px, 100%);
				max-width: 100%;
				box-sizing: border-box;
			}

			.contact-form > * {
				min-width: 0;
			}
}

@media (max-width: 1200px) and (min-width: 1061px) {
			.how_to_use-steps,
			.onboarding-steps {
				width: 100%;
				max-width: 1200px;
				grid-template-columns: repeat(3, minmax(0, 1fr));
				box-sizing: border-box;
			}

			.how_to_use-step-card,
			.onboarding-step-card {
				width: 100%;
				min-width: 0;
			}
}

@media (min-width: 1201px) and (max-width: 1230px) {
			.section.solution-section,
			.section.function-section,
			.section.how_to_use-section,
			.section.step-section {
				height: auto;
				min-height: 0;
			}

			.kadai-grid-top {
				width: 100%;
				grid-template-columns: repeat(2, 282px);
				gap: 16px;
			}

			.kadai-grid-bottom {
				width: 100%;
				grid-template-columns: repeat(2, minmax(0, 1fr));
				gap: 24px;
				margin-top: 28px;
			}

			.kadai-grid-bottom > .kadai-solution-card:last-child:nth-child(odd) {
				grid-column: 1 / -1;
				justify-self: center;
			}

			.kadai-solution-card {
				width: 100%;
				max-width: 384px;
				min-width: 0;
				margin: 0 auto;
			}

			.dekirukoto-wrap {
				width: 100%;
				max-width: 1200px;
				padding: 0 24px;
				box-sizing: border-box;
			}

			.dekirukoto-cards,
			.function-feature {
				width: 100%;
				min-width: 0;
				box-sizing: border-box;
			}

			.function-feature {
				grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
				gap: 16px;
			}

			.function-feature-image,
			.function-feature-text {
				width: 100%;
				min-width: 0;
				height: auto;
				box-sizing: border-box;
			}

			.function-feature-image img {
				height: auto;
			}

			.how_to_use-section,
			.step-section {
				padding-right: 24px;
				padding-left: 24px;
				box-sizing: border-box;
				overflow-x: clip;
			}

			.how_to_use-stack,
			.step-section-stack {
				width: 100%;
				max-width: 1200px;
				min-width: 0;
				box-sizing: border-box;
			}

			.how_to_use-title {
				width: 100%;
				height: auto;
			}

			.how_to_use-title .sp-section-title,
			.step-section-title .sp-section-title {
				width: 100%;
				grid-template-columns: 64px minmax(0, 1fr);
				padding-right: clamp(16px, 6.5vw, 80px);
				box-sizing: border-box;
			}

			.how_to_use-title .sp-section-title-text {
				font-size: clamp(24px, 3.4vw, 40px);
				white-space: normal;
			}

			.how_to_use-step,
			.step-section-image {
				width: 100%;
			}

			.how_to_use-steps,
			.onboarding-steps {
				width: 100%;
				grid-template-columns: repeat(3, minmax(0, 1fr));
				gap: 24px;
				box-sizing: border-box;
			}

			.how_to_use-step-card,
			.onboarding-step-card {
				width: 100%;
				min-width: 0;
				box-sizing: border-box;
			}

			.how_to_use-steps-line,
			.onboarding-steps-line {
				left: 16.67%;
				right: 16.67%;
			}
}
