/* ===== Nextcom⁺ page specific styles (consolidated for top & detail) ===== */
/* Shared rules for listing items used on both views via .nextcom-list */
.nextcom-list .archive-list {
    list-style: none;
    margin-top: 20px;
    padding: 0;
}

.nextcom-list .archive-item {
    display: flex;
    gap: 16px;
    margin-top: 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    align-items: stretch;
    border-bottom: 2px solid #e0e1e3;
}

.nextcom-list .archive-item .thumb {
    /* 非先頭記事（デフォルト）: 横幅を小さくして縦幅を短く見せる */
    flex: 0 0 36%;
    max-width: 36%;
    position: relative;
    overflow: hidden;
    align-self: flex-start;
    aspect-ratio: 4/3;
}

/* 先頭記事用（featured）: 画像は記事スペース横幅の1/2にする */
.nextcom-list .archive-item.featured .thumb {
    flex: 0 0 50%;
    max-width: 50%;
}

.nextcom-list .archive-item .thumb img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.nextcom-list .archive-item .thumb .no-thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f0f0;
    color: #888;
}

.nextcom-list .archive-item .nc-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    flex: 1 1 auto;
    margin: 0px 10px;
    min-width: 0;
}

.nextcom-list .archive-item .nc-content .nc-main {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
}

.nextcom-list .archive-item .nc-content .title {
    font-size: 1.15em;
    margin: 0 0 6px;
}

.nextcom-list .archive-item .nc-content .meta-category {
    color: #666;
    font-size: 0.9em;
    margin-bottom: 4px;
}

.nextcom-list .archive-item .nc-content .meta-date,
.nextcom-list .archive-item .nc-content .meta-author {
    color: #666;
    font-size: 0.85em;
    margin-bottom: 4px;
}

.nextcom-list .archive-item .nc-content .excerpt {
    margin-top: 8px;
    color: #333;
}

.nextcom-list .archive-item .nc-content .body {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.nextcom-list .archive-item .nc-content .body p {
    margin: 0;
}

.nextcom-list .archive-item .nc-content .body {
    flex: 1 1 auto;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    /* 非先頭記事は要約を短めに（4行目以降は非表示） */
    -webkit-line-clamp: 4;
    line-clamp: 4;
    overflow: hidden;
}

/* 先頭記事は要約を2倍に（表示行数を増やす） */
.nextcom-list .archive-item.featured .nc-content .body {
    -webkit-line-clamp: 8;
    line-clamp: 8;
}

.nextcom-list .nc-pagination {
    display: flex;
    justify-content: space-between;
    position: relative;
}

.nextcom-list .event-meta-list {
    width: 100%;
    max-width: 100%;
    margin-bottom: 6px;
}

.nextcom-top .widget.header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20px;
    border-bottom: 2px solid #e0e1e3;
}

.nextcom-top .header-left .latest-label {
    margin: 0;
}

.nextcom-list .button.gray.disabled {
    opacity: 0.45;
    pointer-events: none;
    cursor: default;
}

/* Detail-specific rules (still scoped to detail where needed) */
.nextcom-detail #inner-content>.archive-item {
    border-bottom: none;
    margin-bottom: 0;
}

.nextcom-detail #inner-content>.body {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e0e1e3;
}

.nextcom-detail #inner-content>.body>.nc-content {
    margin: 0px 10px;
}

.nextcom-detail .archive-item .nc-content .nc-main {
    box-sizing: border-box;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.nextcom-detail .archive-item .nc-content .event-table,
.nextcom-detail .archive-item .nc-content table {
    width: 100%;
    max-width: 100%;
    table-layout: auto;
    word-break: break-word;
}

.nextcom-detail .archive-item .nc-content .event-table td {
    word-break: break-word;
}

.nextcom-detail .nc-pagination .button {
    line-height: 11px;
    vertical-align: middle;
}

/* === Detail: increase font sizes as requested ===
   - Article title: 2 steps larger (detail only)
   - Author / Category / Date: 1 step larger
   - Article body: 1 step larger
*/
.nextcom-detail .archive-item .nc-content .title {
    font-size: 1.6em; /* was 1.15em (increase visibly for detail view) */
}

.nextcom-detail .archive-item .nc-content .event-meta-list td,
.nextcom-detail .archive-item .nc-content .event-meta-list .event-table {
    font-size: 1.1em; /* increase metadata (author/category/date) */
}

/**
    Nextcom plus 詳細本文用のスタイル。
    基本的には、WPのrestAPIで返されるCSSをベースに、Nextcomのデザインに合わせて調整する形で記述。
     - フォントサイズや行間は、研究員コラムと同じサイズ感になるように調整。
     - WPのブロックエディタで生成されるクラス（例: .wp-block-image, .wp-block-quote）を利用して、画像や引用ブロックのスタイルを調整。
*/
/* bodyのベース書式より優先して、Nextcom詳細本文の文字組みを固定 */
.nextcom-detail #inner-content > .body {
    /* 研究員コラムと同じサイズに調整(文字色が薄いため、line-heightは、調査レポートに合わせて設定) */
    font-size: 16px;
    line-height: 1.6em;
    letter-spacing: 1.6px;
}

.nextcom-detail #inner-content > .body p,
.nextcom-detail #inner-content > .body div,
.nextcom-detail #inner-content > .body li,
.nextcom-detail #inner-content > .body figcaption,
.nextcom-detail #inner-content > .body blockquote {
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
}

/* h1のサイズをアトリエのcommon.scssと同じに調整 */
.nextcom-detail #inner-content > .body h1 {
    font-size: 42px;
    line-height: 1.6;
    letter-spacing: 3px;
}

/* WP本文内の img が本文幅を超えないように調整 */
.nextcom-detail #inner-content > .body .wp-block-image img {
    width: 100%;
}

/* WP引用ブロックの装飾クォートを非表示 */
.nextcom-detail #inner-content > .body blockquote::before,
.nextcom-detail #inner-content > .body blockquote::after {
    content: none;
}

/* ===== End Nextcom⁺ page specific styles ===== */


/* ===== Nextcom Header (Top bar menu) =====
	 Centralized color variables and simplified rules for maintainability.
	 --nc-default: default background (dark blue)
	 --nc-focus:  ultra-light focus background
	 --nc-current: mid-light background for current/parent-hover
	 --nc-text:   main blue text for active/hover
	 --nc-on-default: text color on default bg
*/
.nextcom-menu {
    margin: -20px -50px 20px -50px;
    box-sizing: border-box;
    background: none;
    --nc-default: #003f98;
    --nc-focus: #b9caf9;
    --nc-current: #91abf5;
    --nc-text: #0a287f;
    --nc-text-default: #fff;
    /* Ensure the menu establishes a stacking context above page content
	   so dropdowns are not hidden behind articles or other elements. */
    position: relative;
    /* ヘッダーよりは下に表示させる */
    z-index: 8;
}

.nextcom-menu .nc-sp-grid-wrapper {
    display: none;
}

.nextcom-menu-inner.contentWidth {
    width: 100%;
    max-width: none;
    padding: 0;
    display: flex;
    align-items: stretch;
}

.nextcom-menu .nc-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: stretch;
    background: none;
    flex: 1;
    width: 100%;
}

.nextcom-menu .nc-nav>li {
    position: relative;
    flex: 1 1 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
    min-height: 48px;
}

/* Base (default) */
.nextcom-menu .nc-nav>li>a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 8px 0;
    text-decoration: none;
    text-align: center;
    font-size: 16px;
    background: var(--nc-default);
    height: 100%;
    box-sizing: border-box;
}

.nextcom-menu .nc-nav>li>a .nc-title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
}

.nextcom-menu .nc-nav>li>a:focus,
.nextcom-menu .nc-nav>li:focus-within>a {
    background: var(--nc-focus);
}

.nextcom-menu .nc-nav>li>a:focus *,
.nextcom-menu .nc-nav>li>a:hover *,
.nextcom-menu .nc-nav>li>a:active *,
.nextcom-menu .nc-nav>li:focus-within>a * {
    color: var(--nc-text);
}

/* Ensure anchors and their inner elements inherit the intended text color
   Target the `.nc-title` container used inside the anchor (matches actual markup). */
.nextcom-menu .nc-nav>li>a .nc-title * {
    color: var(--nc-text-default);
}

/* Divider between top-level menu items placed on the anchors so it can
   be hidden when either adjacent item is active/hovered/selected. */
.nextcom-menu .nc-nav>li+li>a {
    border-left: 1px solid var(--nc-text-default);
}

/* Hide divider when left or right item is active/hovered/focused/current */
.nextcom-menu .nc-nav>li:hover+li>a,
.nextcom-menu .nc-nav>li:focus-within+li>a,
.nextcom-menu .nc-nav>li:active+li>a,
.nextcom-menu .nc-nav>li+li>a:hover,
.nextcom-menu .nc-nav>li+li>a:active,
.nextcom-menu .nc-nav>li+li>a:focus,
.nextcom-menu .nc-nav>li+li>a.current {
    border-left-color: transparent;
}

/* Optional: for browsers supporting :has(), also hide when previous item
   is marked current via its anchor. */
.nextcom-menu .nc-nav>li:has(> a.current)+li>a {
    border-left-color: transparent;
}

/* Submenu */
.nextcom-menu .nc-nav .nc-sub {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 100%;
    width: 100%;
}

/* Border between the main menu bar and its dropdown submenu. Use the
   submenu text color so the divider matches the visible submenu text. */
.nextcom-menu .nc-nav .nc-sub {
    border-top: 1px solid var(--nc-text);
}

.nextcom-menu .nc-nav li.has-sub:hover .nc-sub {
    display: block;
}

.nextcom-menu .nc-nav .nc-sub li a {
    background: var(--nc-current);
    color: var(--nc-text);
    padding: 8px 12px;
    display: block;
    text-align: center;
}

.nextcom-menu .nc-nav .nc-sub li a:hover {
    background: var(--nc-focus);
    color: var(--nc-text);
}

/* Divider between submenu items: use the submenu text color so the line
   matches the visible text color (currentColor resolves to var(--nc-text)). */
.nextcom-menu .nc-nav .nc-sub li+li a {
    border-top: 1px solid currentColor;
}

/* Hide the mobile select by default on desktop; show via media query below */
.nextcom-menu .nc-select-mobile {
    display: none;
    padding: 10px;
}

/* Mobile adjustments kept (no visual changes) */
/* Hide mobile toggle by default on desktop */
.nextcom-menu .nc-mobile-toggle {
    display: none;
}

/* current や子のhoverのときに親の背景色を変える */
.nextcom-menu .nc-nav li.has-sub:hover>a,
.nextcom-menu .nc-nav>li>a.current {
    background: var(--nc-current);
}

/* current や子のhoverのときに親の span の文字色を変える */
.nextcom-menu .nc-nav li.has-sub:hover>a .nc-title *,
.nextcom-menu .nc-nav li.has-sub:focus-within>a .nc-title *,
.nextcom-menu .nc-nav li.has-sub:active>a .nc-title *,
.nextcom-menu .nc-nav>li>a.current span {
    color: var(--nc-text);
}

/* hover のときに親の背景色を変える */
.nextcom-menu .nc-nav li.has-sub:hover>a:hover,
.nextcom-menu .nc-nav>li>a:hover {
    background: var(--nc-focus);
}

/* hover のときに親の span の文字色を変える */
.nextcom-menu .nc-nav li.has-sub:hover>a:hover .nc-title *,
.nextcom-menu .nc-nav>li>a:hover span {
    color: var(--nc-text);
}

/* .nextcom-sidebarのタイトルは大文字にしない */
.nextcom-sidebar .widget-title {
    text-transform: none;
}

/* nextcomサイドバーのウィジェットの幅を調整 */
.nextcom-list #sidebar {
    width: 180px;
}

/* nextcomサイドバーのウィジェットの幅をもとにコンテンツの幅を調整 */
.nextcom-list #content {
    width: 640px;
}

/*////// FOR SMART PHONE ///////*/
@media screen and (max-width: 767px) {

    /* Nextcom mobile select styling: visible only on SP and styled to match site design */
    .nextcom-menu {
        margin: 0 0 20px 0;
        width: 100%;
    }

    .nextcom-menu .nc-nav {
        display: none;
    }

    .nextcom-menu .nc-sp-grid-wrapper {
        display: block;
    }

    /* SP grid menu: 2列表示、サブメニューは折りたたみ */
    .nextcom-menu .nc-sp-grid {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0;
        box-sizing: border-box;
        border: none;
    }

    /* 外枠の罫線は描かず、各セルの右・下だけに1px罫線を入れる。右列のセルと最終行のセルでは該当する罫線を消して両端に線が出ないようにする */
    .nextcom-menu .nc-sp-grid>li {
        background: #003f98;
        position: relative;
        min-width: 0;
        border-bottom: 1px solid var(--nc-text-default, #fff);
        border-right: 1px solid var(--nc-text-default, #fff);
        overflow: visible;
    }

    /* 2列目（右列）は右罫線を消す */
    .nextcom-menu .nc-sp-grid>li:nth-child(2n) {
        border-right: none;
    }

    /* 最後の行にあるアイテム（下から数えて2つまで）は下罫線を消す */
    .nextcom-menu .nc-sp-grid>li:nth-last-child(-n+2) {
        border-bottom: none;
    }

    /* 基本文字色は白 */
    .nextcom-menu .nc-sp-grid>li .nc-title span {
        color: #fff;
    }

    .nextcom-menu .nc-sp-grid>li>a {
        text-decoration: none;
        display: flex;
        align-items: center;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        padding: 12px 44px 12px 12px;
        z-index: 20;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* If the tile has no submenu, remove the extra right padding reserved for the toggle */
    .nextcom-menu .nc-sp-grid>li:not(.has-sub)>a {
        padding: 12px;
    }

    .nextcom-menu .nc-sp-grid>li .nc-title {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 6px;
    }

    /* 各spanを横並びに（改行させない） */
    .nextcom-menu .nc-sp-grid li .nc-title span {
        display: inline-block;
        white-space: nowrap;
    }

    /* トグル（矢印） */
    .nextcom-menu .nc-sp-toggle {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(calc(-50% - 3px));
        background: transparent;
        border: none;
        color: #fff;
        font-size: 24px;
        line-height: 1;
        padding: 10px;
        z-index: 90;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* サブメニューは絶対配置にしてオーバーレイ表示（メニュー全体の高さは変えない） */
    .nextcom-menu .nc-sub-sp {
        list-style: none;
        margin: 0;
        padding: 0;
        background: var(--nc-current);
        color: var(--nc-text);
        display: none;
        position: absolute;
        left: 0;
        top: calc(100% - 1px);
        width: 100%;
        box-shadow: none;
        z-index: 80;
        border-radius: 0;
    }

    /* open時はdisplay:blockだがflowに影響しない（絶対配置のため） */
    .nextcom-menu .nc-sub-sp li a {
        background: var(--nc-current);
        color: var(--nc-text);
        padding: 8px 12px;
        display: block;
        text-align: center;
        text-decoration: none;
    }

    /* 区切り線は青にする */
    .nextcom-menu .nc-sub-sp li+li a {
        border-top: 1px solid var(--nc-blue, #003f98);
    }

    /* open時は親タイルをサブメニューと同じ背景/文字色にする */
    .nextcom-menu .nc-sp-grid>li.open {
        background: var(--nc-current);
        border-bottom: none;
        border-right: none;
        z-index: 70;
    }

    /* currentの時も色を変更する */
    .nextcom-menu .nc-sp-grid>li.current {
        background: var(--nc-current);
    }

    .nextcom-menu .nc-sp-grid>li.current .nc-title span,
    .nextcom-menu .nc-sp-grid>li.current .nc-sp-toggle,
    .nextcom-menu .nc-sp-grid>li.open .nc-title,
    .nextcom-menu .nc-sp-grid>li.open .nc-title span {
        color: var(--nc-text);
    }

    /* 開いたときは矢印を反転かつ色を青くする */
    .nextcom-menu .nc-sp-grid>li.open .nc-sp-toggle {
        transform: translateY(calc(-50% + 3px)) rotate(180deg);
        color: var(--nc-blue, #003f98);
    }

    /* 親タイトルとサブメニューの間に青線を入れる（開いているとき） */
    .nextcom-menu .nc-sp-grid>li.open .nc-sub-sp {
        border-top: 1px solid var(--nc-blue, #003f98);
    }

    /* nextcomサイドバーのウィジェットの幅を調整 */
    .nextcom-list #content,
    .nextcom-list #sidebar {
        width: 100%;
        padding: 0;
    }

    /* nextcom-plusページのデザイン調整 */
    .nextcom-list #sidebar .widget-container,
    .nextcom-list #inner-content {
        margin: 0 auto;
        max-width: min(500px, 85%);
    }

    .nextcom-list .archive-item {
        flex-direction: column;
    }

    .nextcom-list .archive-item .thumb,
    .nextcom-list .archive-item .nc-content {
        max-width: 100%;
        flex-basis: auto;
        margin: 10px 0;
    }

    .nextcom-list .archive-item .thumb {
        overflow: hidden;
        width: 100%;
        max-width: 100%;
        flex: none;
        position: relative;
    }

    /* 先頭記事のデザインを通常に戻す */
    .nextcom-list .archive-item.featured .nc-content .body {
        -webkit-line-clamp: 4;
        line-clamp: 4;
    }
    .nextcom-list .archive-item.featured .thumb {
        flex: none;
        max-width: 100%;
    }

    /* === Detail: increase font sizes as requested ===
        - Article body: normal font on mobile
    */
    .nextcom-detail #inner-content > .body p {
        font-size: 1em; /* slightly larger body text */
        line-height: 1.6;
        letter-spacing: 1.2px;
    }
}

/*////// FOR TABLET ///////*/
@media only screen and (min-width : 768px) and (max-width : 1024px) {

    /* タブレットモードの時のネクストコムメニューのサイズ調整 */
    .nextcom-menu {
        margin: -20px -20px 20px -20px;
    }

    /* nextcomサイドバーのウィジェットの幅を調整 */
    .nextcom-list #content {
        width: 450px;
    }
}