/* === Responsive === */

/* --- Tablet (1024px) --- */
@media (max-width: 1024px) {

    /* Header */
    .header__nav {
        display: none;
    }

    .header__cta {
        display: none;
    }

    .header__hamburger {
        display: flex;
        margin-left: auto;
    }

    .mobile-menu {
        display: block;
    }

    /* Typography */
    .sec-title {
        font-size: 2.8rem;
    }

    /* Hero */
    .hero__inner {
        padding: 100px 24px 60px;
        gap: 32px;
    }

    .hero__heading {
        font-size: 3.6rem;
    }

    .hero__image {
        max-width: 50%;
    }

    /* Services */
    .sec-services__cards {
        gap: 20px;
    }

    .service-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .service-card__illust {
        width: 100%;
        height: 160px;
    }

    /* Reason */
    .sec-reason__cards {
        gap: 20px;
    }

    .reason-card__number {
        font-size: 6rem;
    }

    /* Case Study / Seminar carousel */
    .cs-card {
        flex: 0 0 calc(33.333% - 22px);
    }

    /* CTA */
    .sec-cta-banner__stats {
        flex-wrap: wrap;
        gap: 16px;
        justify-content: center;
    }

    .sec-cta-banner__buttons {
        flex-direction: column;
        align-items: center;
    }

    .cta-card {
        max-width: 100%;
    }

    /* Function grid */
    .sec-function__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Problem cards */
    .sec-ps__cards {
        gap: 36px;
    }

    /* Overview */
    .sec-overview__catch {
        font-size: 2.0rem;
    }

    .overview-col__image img {
        width: 150px;
    }

    .overview-col__title {
        font-size: 1.7rem;
    }

    .overview-col__point {
        font-size: 1.3rem;
        padding: 10px 12px;
    }

    /* FAQ */
    .sec-faq__inner {
        flex-direction: column;
        gap: 32px;
    }

    .sec-faq__head {
        width: 100%;
    }

    /* Hero Stripe */
    .hero__stripe {
        width: 800px;
        left: 20%;
        bottom: -100px;
    }

    .sec-top-hero__stripe {
        width: 800px;
        top: 30%;
        left: 40%;
    }

    /* Top Page Blobs */
    .top-hero-blob--1 {
        width: 300px;
        height: 300px;
        right: -100px;
    }

    .top-hero-blob--2 {
        width: 250px;
        height: 250px;
        left: -100px;
    }

    .top-bg-blob--1 {
        width: 400px;
        height: 400px;
        top: 400px;
        left: -150px;
    }

    .top-bg-blob--2 {
        width: 350px;
        height: 350px;
        top: 1200px;
        right: -100px;
    }

    .top-bg-blob--3 {
        width: 300px;
        height: 300px;
        top: 2000px;
    }

    .top-bg-blob--4 {
        width: 350px;
        height: 350px;
        top: 3000px;
    }

    .top-bg-blob--5 {
        width: 300px;
        height: 300px;
        top: 4000px;
    }

    /* Features (image + list) */
    .sec-features__content {
        flex-direction: column;
    }

    .sec-features__list {
        flex: none;
        width: 100%;
    }

    .sec-features__media {
        flex: none;
        width: 100%;
    }

    .sec-features__slide {
        flex: 0 0 calc(100vw - 48px);
    }

    .sec-features__slide-caption {
        font-size: 1.8rem;
    }

    /* Detail pages */
    .cs-detail__inner,
    .seminar-detail__inner,
    .document-detail__inner,
    .page-detail__inner {
        flex-direction: column;
    }

    .journal-detail__columns {
        flex-direction: column;
    }

    .cs-detail__sidebar,
    .seminar-detail__sidebar,
    .document-detail__sidebar,
    .page-detail__sidebar,
    .journal-detail__sidebar {
        width: 100%;
        flex: none;
        position: static;
    }

    .cs-detail__main,
    .seminar-detail__main,
    .document-detail__main,
    .journal-detail__main {
        padding: 24px;
    }

    .cs-detail__title,
    .journal-detail__title {
        font-size: 2.0rem;
    }

    .seminar-detail__title,
    .document-detail__title {
        font-size: 1.8rem;
    }

    .cs-detail__company {
        font-size: 1.3rem;
    }

    .cs-detail__meta {
        font-size: 1.2rem;
    }

    .cs-detail__table th,
    .cs-detail__table td,
    .seminar-detail__table th,
    .seminar-detail__table td {
        font-size: 1.3rem;
    }

    .entry-content {
        font-size: 1.4rem;
    }

    .entry-content h2 {
        font-size: 1.8rem;
    }

    .entry-content h3 {
        font-size: 1.6rem;
    }

    .journal-detail__cat,
    .journal-detail__date {
        font-size: 1.2rem;
    }

    .journal-detail__related-title {
        font-size: 1.6rem;
    }

    .journal-sidebar__title {
        font-size: 1.4rem;
    }

    .journal-sidebar__post-title {
        font-size: 1.2rem;
    }

    .journal-detail__related .sec-journal__grid {
        grid-template-columns: 1fr;
    }

    /* LP Hero */
    .sec-lp-hero__inner {
        padding: 150px 24px 60px;
    }

    .sec-lp-hero__illust img {
        width: 120px;
    }

    .sec-lp-hero__catch {
        font-size: 1.3rem;
    }

    .sec-lp-hero__logo-img {
        height: 28px;
    }

    .sec-lp-hero__logo-label {
        font-size: 1.4rem;
    }

    .sec-lp-hero__desc {
        font-size: 1.3rem;
    }

    .sec-lp-hero__btn {
        width: 100%;
        max-width: 300px;
        font-size: 1.6rem;
        padding: 14px 32px;
    }

    /* Top Hero */
    .sec-top-hero__heading {
        font-size: 3.2rem;
    }

    .sec-top-hero__buttons {
        flex-direction: column;
        gap: 12px;
    }

    .sec-top-hero__card {
        width: 100%;
        padding: 16px 16px 16px 20px;
    }

    .sec-top-hero__card-label {
        font-size: 1.6rem;
    }

    .sec-top-hero__photos-track {
        gap: 12px;
        animation-duration: 30s;
    }

    .sec-top-hero__photo {
        width: 260px;
    }

    .sec-top-hero__photo img {
        height: 160px;
    }

    .sec-top-hero__photo:nth-child(odd) {
        transform: translateY(12px);
    }

    /* Mission */
    .sec-mission__inner {
        flex-direction: column;
        padding: 0 24px 56px;
        overflow: hidden;
    }

    .sec-mission__heading {
        font-size: 3.2rem;
    }

    .sec-mission__sub {
        font-size: 1.8rem;
    }

    .sec-mission__body p {
        font-size: 1.5rem;
    }

    .sec-mission__image {
        transform: none;
        width: 100%;
        max-width: 240px;
        margin: 0 auto;
    }

    /* Top Services */
    .sec-top-services__inner {
        padding: 56px 24px;
    }

    .sec-top-services__cards {
        flex-direction: column;
        gap: 24px;
    }

    .top-service-card__body {
        padding: 24px;
    }

    .top-service-card__title {
        font-size: 1.8rem;
    }

    .top-service-card__desc {
        font-size: 1.4rem;
    }

    /* News */
    .sec-news__inner {
        flex-direction: column;
        gap: 32px;
        padding: 56px 24px;
    }

    .sec-news__head {
        width: 100%;
    }

    .sec-news__desc {
        margin-bottom: 24px;
    }

    .sec-news__desc br {
        display: none;
    }

    .sec-news__item {
        flex-wrap: wrap;
        gap: 8px 12px;
        padding: 16px 0;
    }

    .sec-news__title {
        flex: 0 0 100%;
        font-size: 1.4rem;
    }

    .sec-news__arrow {
        display: none;
    }

    /* News Detail */
    .news-detail {
        padding: 120px 24px 60px;
    }

    .news-detail__inner {
        padding: 40px 24px;
    }

    .news-detail__title {
        font-size: 2.0rem;
    }

    /* Company */
    .sec-company__inner {
        padding: 56px 24px;
    }

    .sec-company__table,
    .sec-company__table thead,
    .sec-company__table tbody,
    .sec-company__table tr,
    .sec-company__table th,
    .sec-company__table td {
        display: block;
        width: 100%;
    }

    .sec-company__table th {
        text-align: left;
        padding: 12px 16px;
    }

    .sec-company__table td {
        padding: 12px 16px;
    }

    /* News Archive */
    .sec-news-archive {
        padding-top: 120px;
    }

    .sec-news-archive__list {
        padding: 8px 24px;
    }

    /* Manga Preview */
    .sec-manga-preview__inner {
        padding: 48px 24px;
    }

    .sec-manga-preview__grid {
        max-width: 100%;
    }

    /* Manga CTA */
    .sec-manga-cta__inner {
        padding: 0 24px;
    }

    .sec-manga-cta__box {
        padding: 40px 24px;
    }

    .sec-manga-cta__title {
        font-size: 1.8rem;
    }

    .sec-manga-cta__cover img {
        max-width: 220px;
    }

    .sec-manga-cta__btn {
        font-size: 1.4rem;
        padding: 14px 32px;
    }

    /* Manga Form */
    .sec-manga-form__inner {
        padding: 56px 24px;
    }

    .sec-manga-form__body {
        padding: 24px;
    }

    .sec-manga-form__header .sec-title {
        font-size: 2.2rem;
    }

    /* Footer */
    .footer__main .footer__inner {
        flex-wrap: wrap;
        gap: 32px;
    }

    .footer__company {
        width: 100%;
    }

    .footer__badges {
        width: 100%;
    }
}

/* --- Mobile (768px) --- */
@media (max-width: 768px) {

    /* Header */
    .site-header {
        top: 0;
        background: var(--color-white);
    }

    .header__inner {
        padding: 12px 16px;
    }

    .header__logo-img {
        height: 24px;
    }

    /* LP: スマホ時はロゴをカラーに */
    .page-lp-dark-header .header__logo-img {
        filter: none;
    }

    /* Inner padding 上下縮小 */
    .sec-services__inner {
        padding: 24px 24px 56px;
    }

    .sec-reason__inner {
        padding: 56px 24px;
    }

    .sec-cta-banner__inner {
        padding: 48px 24px;
    }

    .sec-faq__inner {
        padding: 56px 24px;
    }

    .sec-casestudy__inner {
        padding: 56px 24px;
    }

    .sec-overview__inner,
    .sec-ps__inner,
    .sec-function__inner,
    .sec-features__inner,
    .sec-problem__inner,
    .sec-process__inner {
        padding: 56px 24px;
    }

    .sec-thanks__inner {
        padding: 40px 24px;
    }

    .feature-card__title {
        font-size: 1.5rem;
    }

    .ps-card__title {
        font-size: 1.5rem;
    }

    .ps-card__list li {
        font-size: 1.3rem;
    }

    .ps-solution__category {
        font-size: 1.2rem;
    }

    .ps-solution__title {
        font-size: 1.8rem;
    }

    .ps-solution__desc {
        font-size: 1.3rem;
    }

    .ps-solution__point {
        font-size: 1.3rem;
    }

    .func-card__title {
        font-size: 1.6rem;
    }

    .faq-item__icon {
        width: 28px;
        height: 28px;
        font-size: 1.4rem;
    }

    .faq-item__question {
        font-size: 1.4rem;
    }

    .cs-detail__table,
    .cs-detail__table thead,
    .cs-detail__table tbody,
    .cs-detail__table tr,
    .cs-detail__table th,
    .cs-detail__table td,
    .seminar-detail__table,
    .seminar-detail__table thead,
    .seminar-detail__table tbody,
    .seminar-detail__table tr,
    .seminar-detail__table th,
    .seminar-detail__table td {
        display: block;
        width: 100%;
    }

    .cs-detail__table th,
    .seminar-detail__table th {
        text-align: left;
        padding: 12px 16px;
    }

    .cs-detail__table td,
    .seminar-detail__table td {
        padding: 12px 16px;
    }

    .faq-item__answer {
        font-size: 1.3rem;
    }

    .sec-archive,
    .cs-detail,
    .seminar-detail,
    .document-detail,
    .page-detail,
    .journal-detail,
    .sec-contact,
    .sec-page {
        padding-top: 100px;
    }

    .cs-detail,
    .seminar-detail,
    .document-detail {
        padding: 100px 16px 60px;
    }

    .journal-detail__inner {
        padding: 100px 16px 60px;
    }

    .sec-label {
        font-size: 1.4rem;
    }

    .sec-label::before {
        width: 8px;
        height: 8px;
    }

    .footer__main {
        padding: 48px 0 32px;
    }

    .footer__inner {
        padding: 0 16px;
    }

    /* Typography */
    .sec-title {
        font-size: 3.2rem;
    }

    .sec-desc {
        font-size: 1.4rem;
    }

    .page-title,
    .archive-title,
    .entry-title,
    .cs-detail__title,
    .seminar-detail__title,
    .document-detail__title {
        font-size: 2.0rem;
    }

    /* Hero: テキスト→ボタン→画像 の順 */
    .hero__inner {
        flex-direction: column;
        padding: 100px 20px 40px;
        gap: 24px;
    }

    .hero__text {
        order: 1;
    }

    .hero__image {
        order: 2;
        max-width: 100%;
    }

    .hero__heading {
        font-size: 3.0rem;
        width: 100%;
    }

    .hero__logo-img {
        height: 22px;
    }

    .hero__logo-label {
        font-size: 1.3rem;
    }

    .hero__btn {
        width: 100%;
        max-width: 320px;
        font-size: 1.4rem;
        height: 64px;
    }

    .hero__btn-sub {
        font-size: 1.0rem;
    }

    .hero__btn-main {
        font-size: 1.5rem;
    }

    /* Services */
    .sec-services__cards {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }

    .service-card {
        width: 100%;
        max-width: 500px;
        align-items: center;
    }

    .service-card__illust {
        height: 100px;
    }

    .service-card__title {
        font-size: 1.6rem;
    }

    .service-card__arrow {
        display: none;
    }

    /* Reason */
    .sec-reason__cards {
        flex-direction: column;
    }

    .reason-card__title {
        font-size: 1.6rem;
    }

    .reason-card__number {
        font-size: 5rem;
    }

    /* Carousel */
    .cs-card {
        flex: 0 0 calc(100vw - 80px);
    }

    .sec-casestudy__header-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .sec-casestudy__nav {
        display: none;
    }


    /* CTA */
    .sec-cta-banner__title {
        font-size: 1.8rem;
    }

    .sec-cta-banner__stats {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .cta-stat {
        justify-content: center;
    }

    .cta-stat__content {
        flex: 1;
        flex-direction: column;
        align-items: center;
        gap: 4px;
    }

    .cta-stat__label {
        font-size: 1.1rem;
    }

    .cta-stat__label br {
        display: none;
    }

    .cta-stat__numbers {
        display: flex;
        align-items: baseline;
        gap: 4px;
    }

    .cta-stat__value {
        font-size: 2.4rem;
    }

    .sec-cta-banner__buttons {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
    }

    .cta-card {
        flex-direction: row;
        max-width: 100%;
    }

    .cta-card__image {
        display: none;
    }

    .cta-card__title {
        font-size: 1.6rem;
    }

    .cta-card__desc {
        font-size: 1.3rem;
    }

    .cta-card__arrow {
        position: static;
        align-self: center;
        flex-shrink: 0;
        width: 32px;
        height: 32px;
    }

    .cta-card__arrow svg {
        width: 14px;
        height: 14px;
    }

    /* Function grid */
    .sec-function__grid {
        grid-template-columns: 1fr;
    }

    .func-card {
        flex: 1 1 100%;
    }

    /* Problem & Solution */
    .sec-ps__cards {
        flex-direction: column;
    }

    .ps-solution {
        flex-direction: column;
        padding: 24px;
        gap: 24px;
    }

    .ps-solution__image {
        width: 100%;
        max-width: 240px;
        margin: 0 auto;
    }

    .ps-solution__points {
        grid-template-columns: 1fr;
    }

    .ps-solution__point {
        flex: 1 1 100%;
    }

    /* Overview */
    .sec-overview__columns {
        flex-direction: column;
        align-items: center;
    }

    .overview-col {
        border-radius: 24px;
        aspect-ratio: auto;
        width: 100%;
        max-width: 320px;
    }

    .sec-overview__catch {
        font-size: 1.8rem;
    }

    .overview-center {
        flex: 0 0 auto;
    }

    /* Process */
    .process-step__number {
        font-size: 3.2rem;
    }

    /* Archive grid */
    .sec-archive__grid .cs-card,
    .doc-card {
        flex: 0 1 calc(50% - 16px);
    }

    /* Footer */
    .footer__main .footer__inner {
        flex-direction: column;
        gap: 40px;
    }

    .footer__nav {
        flex-direction: column;
        gap: 24px;
    }

    .footer__bottom .footer__inner {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
    }

    .footer__bottom-nav {
        flex-wrap: wrap;
        gap: 16px;
    }

    /* News */
    .news-list .news-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    /* Form pages */
    .sec-contact__form {
        padding: 24px;
    }

    .sec-contact__cards {
        flex-direction: column;
        gap: 16px;
    }

    .contact-guide-card {
        padding: 32px 24px;
    }

    .sec-thanks__inner {
        padding: 40px 20px;
    }

    .sec-thanks__title {
        font-size: 2.4rem;
    }

    /* Journal */
    .sec-journal-hero__title {
        font-size: 2.4rem;
    }

    .sec-journal-hero__inner {
        padding: 120px 24px 56px;
    }

    .sec-journal__grid {
        grid-template-columns: 1fr;
    }

    .journal-detail__columns {
        flex-direction: column;
    }

    .journal-detail__sidebar {
        flex: none;
        width: 100%;
    }

    .journal-detail__related .sec-journal__grid {
        grid-template-columns: 1fr;
    }

    .sec-journal-archive__tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .sec-journal-archive__tabs::-webkit-scrollbar {
        display: none;
    }

    .journal-tab {
        white-space: nowrap;
    }
}

/* --- Small Mobile (480px) --- */
@media (max-width: 480px) {
    .sec-title {
        font-size: 2.4rem;
    }

    .hero__heading {
        font-size: 3.6rem;
        line-height: 1.4;
    }

    .hero__inner {
        padding: 120px 24px 32px;
    }

    /* Carousel: narrower cards */
    .cs-card {
        flex: 0 0 320px;
    }

    /* CTA */
    .sec-cta-banner__title {
        font-size: 1.8rem;
    }

    .cta-stat__value {
        font-size: 2.2rem;
    }

    /* Archive grid: 1 column */
    .sec-archive__grid .cs-card,
    .doc-card {
        flex: 0 1 100%;
    }

    /* Overview */
    .overview-col {
        padding: 32px 24px 40px;
    }

    .overview-col__image img {
        width: 120px;
    }

    /* Process */
    .process-step {
        gap: 16px;
    }

    .process-step__number {
        font-size: 2.4rem;
        min-width: 40px;
    }

    /* Breadcrumb */
    .breadcrumb__list {
        font-size: 1.1rem;
    }

    /* LP Hero */
    .sec-lp-hero__illust {
        display: none;
    }

    .sec-lp-hero__illusts-sp {
        display: flex;
        justify-content: center;
        gap: 16px;
        margin-top: 24px;
    }

    .sec-lp-hero__illusts-sp img {
        width: 120px;
        height: auto;
    }

    .sec-lp-hero__inner {
        padding: 120px 16px 0;
        overflow: hidden;
    }

    .sec-lp-hero__catch {
        font-size: 1.2rem;
    }

    .sec-lp-hero__text {
        text-align: center;
    }

    .sec-lp-hero__logo {
        justify-content: center;
        gap: 12px;
    }

    .sec-lp-hero__logo-img {
        height: 32px;
    }

    .sec-lp-hero__logo-label {
        font-size: 1.3rem;
        padding-top: 8px;
    }

    /* Manga CTA */
    .sec-manga-cta__box {
        padding: 32px 16px;
    }

    .sec-manga-cta__title {
        font-size: 1.6rem;
    }

    .sec-manga-cta__cover img {
        max-width: 180px;
    }

    /* Manga Form */
    .sec-manga-form__inner {
        padding: 40px 16px;
    }

    .sec-manga-form__body {
        padding: 16px;
    }

    /* Footer */
    .footer__logo-img {
        height: 28px;
    }
}