@charset "UTF-8";

/* ==========================================================================
   Theme Name:JIMM 2026 Theme
   Theme URI:
   Author:k-art Co., Ltd.
   Author URI:https://www.k-art-design.co.jp/
   Description:JIMM向けオリジナルテーマ（ブロックエディタ対応）
   Version:     1.0.0
   License:     GNU General Public License v2 or later
   License URI: http://www.gnu.org/licenses/gpl-2.0.html
   Text Domain:jimm2026
   ========================================================================== */

:root {
    /* ==========================================================================
     1. テキスト・基本カラー（Text & Base Colors）
     ========================================================================== */
    --color-text-main: #333333;
    /* 本文テキスト */
    --color-text-primary: #103675;
    /* ヘッダーテキスト（footer_hg開始） */
    --color-text-muted: #707070;
    /* サブナビ・検索・パンくずリンク共通グレー */
    --color-text-dark: #000000;
    /* tdテキスト・協賛テキスト */
    --color-text-link: #6c9ad1;
    /* 本文リンク・装飾文字の一部・form必須・QA_Q */
    --color-caution: #ec1c24;
    /* 警告・注意（caution） */
    --color-white: #fff;
    /* スマホメニューサブナビ */
    --color-text-light-blue: #cfddeb;

    /* ==========================================================================
     2. 背景・パーツカラー（Background & Component Colors）
     ========================================================================== */
    --color-body-bg: transparent;
    /* body背景 */
    --color-bg-light: #edf2f8;
    /* h1・フォーム背景 */
    --color-bg-gray: #e1e4ec;
    /* th背景・footer協賛背景 */
    --color-search-bg: #f2f2f2;
    /* サイト内検索背景 */
    --color-td-bg: #eff2f4;
    /* td背景 */
    --color-passive-bg: #cedcea;
    /* タブ・ボタンパッシブ背景、トップ交通規制枠・装飾文字 */
    --color-meaningless-light-gray: #e5e5e5;
    /* スマホメニュー罫線 */
    --color-sp-menu-ruled-line: #3f5e91;
    /* ==========================================================================
     3. カテゴリ・テーマカラー（Category Colors）
     ========================================================================== */
    --color-category-runner: #4ea5cc;
    /* ランナー */
    --color-category-volunteer: #4bb498;
    /* ボランティア */
    --color-category-cheer: #e9b569;
    /* 応援 */
    --color-category-enjoy: #e67c87;
    /* +FUN（旧お楽しみ）・answer（※座布団/ボタン背景用） */
    --color-category-enjoy-bg: #ffd5dc;
    /* +FUN（旧お楽しみ）背景用 */
    --color-qa-a-text: #c34956;
    /* 白地テキスト用の濃いQA_A */
    /* ==========================================================================
     4. グラデーション構成パーツ（Gradient Components）
     ========================================================================== */
    --color-grad-blue-start: #0093f5;
    /* カウントダウン・タブ・ボタンアクティブ開始色 */
    --color-grad-green-end: #8cc63f;
    /* 各種グラデーション終了色 */
    --color-grad-navy-start: #0f369a;
    /* トップh2文字・他h1文字グラデーション開始色 */
    --color-grad-blue-end: #6c9ad1;
    /* footer_hgグラデーション終了色 */
    --color-grad-toc-start: #f6faf0;
    /* 目次背景開始色 */
    --color-grad-toc-end: #dcedf5;
    /* 目次背景終了色 */

    /* ==========================================================================
     5. シンプルグラデーション一括指定（0% → 100% のみ）
     ========================================================================== */
    /* カウントダウン・タブ・ボタンアクティブ背景 */
    --gradient-active: linear-gradient(to right, var(--color-grad-blue-start), var(--color-grad-green-end));

    /* トップh2文字・他h1文字グラデーション */
    --gradient-heading: linear-gradient(to right, var(--color-grad-navy-start), var(--color-grad-green-end));

    /* footer_hgグラデーション（ヘッダーテキスト色 #103675 から開始） */
    --gradient-footer: linear-gradient(to right, var(--color-text-primary), var(--color-grad-blue-end));

    /* 目次背景グラデーション（45度傾斜） */
    --gradient-toc: linear-gradient(45deg, var(--color-grad-toc-start), var(--color-grad-toc-end));

    /* ==========================================================================
     6. コンテンツ幅/高さ
     ========================================================================== */
    /* 全体 */

    /* PCコンテンツ＋目次 */
    --content-max-width: 1240px;
    /* PCコンテンツ-目次 */
    --content-left-excluded-width: 940px;
    /* PCサイドバー（スポンサー） */

    /* PCヘッダーの高さ */
    --header-height-pc: 180px;
    /* SPヘッダーの高さ */
    --header-height-sp: 150px;
    /* SPメニューの最大幅 */
    --sp-menu-max-width: 500px;
    /* SPハンバーガーボタン高さ */
    --hamburger-button-height: 72px;

    /* ==========================================================================
     7. フォントファミリー/サイズ
     ========================================================================== */
    /* 通常フォント */
    --font-body: "Noto Sans JP", sans-serif;
    /* カウントダウン用フォント */
    --font-countdown: "Montserrat", "Noto Sans JP", sans-serif;
    /* PC本文サイズ */
    --font-size-pc: 15px;
    /* SP本文サイズ */
    --font-size-sp: 14px;
}


/* initial */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    font-size: var(--font-size-pc);

    @media screen and (max-width:599px) {
        font-size: var(--font-size-sp);
    }
}

body {
    position: relative;
    background-color: var(--color-body-bg);
    color: var(--color-text-main);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 2;
    margin: 0;
    padding: 0;
    --contents-left-padding: 70px;
    --contents-right-padding: 60px;
    --overall-maximum-width: 1920px;
    --main-content-max-width: calc(1080px + 480px);
    --sidebar-width: 200px;
    --toc-container-width: 270px;
    --h1-span-main-font-size: 2.93rem;
    --h1-span-sub-font-size: 1.33rem;
    --h2-font-size: 2.13rem;
    --h3-font-size: 1.6rem;
    --h4-font-size: 1.4rem;
    --larger-than-main-text-font-size: 1.2rem;
    --form-font-size: 1.06rem;
    --breadcrumbs-font-size: .8rem;
    --header-logo-width: 300px;
    --pc-menu-inner-height: 113px;

    @media screen and (max-width:1023px) {
        --header-logo-width: 260px;
        --h1-span-main-font-size: 2.13rem;
        --h1-span-sub-font-size: 1rem;
        --h2-font-size: 1.6rem;
        --h3-font-size: 1.33rem;
        --h4-font-size: 1.2rem;
        --contents-left-padding: 40px;
        --contents-right-padding: 40px;
        --pc-menu-inner-height: 76px;
    }

    @media screen and (max-width:599px) {
        --h1-span-main-font-size: 1.71rem;
        --h1-span-sub-font-size: 0.857rem;
        --h2-font-size: 1.428rem;
        --h3-font-size: 1.14rem;
        --h4-font-size: 1.07rem;
        --contents-left-padding: 20px;
        --contents-right-padding: 20px;
        --pc-menu-inner-height: 0;
    }
}

ul {
    list-style-type: none;
}

a {
    transition: .3s ease;
}

@media (hover: hover) {
    a:hover {
        background-color: var(--color-search-bg);
        color: var(--color-text-dark);
    }
}

a img {
    transition: .3s ease;
}

@media (hover: hover) {
    a img:hover {
        opacity: .7;
    }
}

a img:active {
    opacity: .7;
}

.sp_only {
    display: none;

    @media screen and (max-width:599px) {
        display: inherit;
    }
}


/* ios android */

form {

    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="password"],
    textarea,
    select,
    button {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border-radius: 0;
        box-sizing: border-box;
        font-size: 16px;
        /* iOSの勝手ズーム防止 */
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }

    button,
    input[type="submit"],
    input[type="button"] {
        cursor: pointer;
        background: none;
        border: none;
        padding: 0;
    }
}

a[href^="tel"] {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

.hero {
    min-height: 100dvh;
}


/* relative */

section,
.l-section,
article,
.sidebar,
.main-content {
    position: relative;
}

h1,
h2,
h3,
.c-btn,
.c-list {
    position: relative;
}


/* scroll-margin-top */

h1,
h2,
h3,
[id] {
    scroll-margin-top: calc(var(--pc-menu-inner-height) + 1.5rem);

    @media screen and (max-width:599px) {
        scroll-margin-top: 1.5rem;
    }
}

/* basic structure */

.for_reader {
    display: none;
}

header,
.contents_wrapper,
footer,
#sponsor_list {
    width: 100%;
    max-width: var(--overall-maximum-width);
    margin: auto;
}

.contents_wrapper {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
}

.left_area {
    width: 100%;
}

.home .left_area {
    padding-top: 40px;
}

.left_area_inner {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-end;
    align-items: flex-start;
}

aside.sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
}

.left_area_inner {
    padding-right: var(--contents-right-padding);
    padding-left: var(--contents-left-padding);
    padding-bottom: 2rem;
    position: relative;
}

#main-content {
    width: 100%;
    /*
    max-width: var(--main-content-max-width);
    */
    flex: 1;
    min-width: 0;
}

@media screen and (max-width:1199px) {
    .contents_wrapper {
        flex-flow: column nowrap;
    }

    aside.sidebar {
        width: 100%;
    }

    aside.sidebar .recruitment_links {
        display: none;
    }
}


/* heading */

.contents_wrapper h1 {
    background: var(--color-bg-light);
}

h1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 0;
    line-height: 1.3;
}

h1 span.main_jp {
    font-size: var(--h1-span-main-font-size);
    background: var(--gradient-heading);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding-left: var(--contents-left-padding);
    margin: .4em 0;
}

h1 span.sub_en {
    background: none;
    -webkit-background-clip: initial;
    -webkit-text-fill-color: initial;
    font-size: var(--h1-span-sub-font-size);
    color: var(--color-text-primary);
    margin: 0 1rem;
}

h2 {
    font-size: var(--h2-font-size);
    color: var(--color-text-primary);
}

h3 {
    font-size: var(--h3-font-size);
    color: var(--color-text-primary);
}

h4 {
    font-size: var(--h4-font-size);
    color: var(--color-text-primary);
    text-decoration: underline;
    text-underline-offset: 0.6em;
}

form {
    font-size: var(--form-font-size);
}


/* header */

header {
    box-shadow: 0 10px 5px -4px rgba(0, 0, 0, .1);
    position: relative;
    z-index: 10;
}

header p {
    margin: 0;
}

header ul {
    margin: 0;
    padding: 0;
}

#header_inner {
    display: flex;
    justify-content: space-between;
    border-bottom: 4px solid var(--color-text-primary);
    position: fixed;
    top: 0;
    width: 100%;
    max-width: var(--overall-maximum-width);
    background-color: rgba(255, 255, 255, .8);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    @media screen and (max-width:599px) {
        position: relative;
    }
}

header #header_logo {
    display: block;
    width: var(--header-logo-width);
    /*height: 110px;*/
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-indent: -9999px;
    flex: none;
}

#header_logo img {
    display: block;
    width: 100%;
    height: auto;
    padding: 24px 20px;

    @media screen and (max-width: 1023px) {
        padding: 10px 20px;
    }
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    border: 0;
}


/* PCメニュー */

#header_navs_pc {
    width: 100%;
    max-width: 1140px;
    border-left: 1px solid var(--color-meaningless-light-gray);
}

#header_navs_pc_top {
    display: flex;
    justify-content: flex-end;
    height: 50px;
    padding: 8px 0;
}

.sub_menu_pc ul {
    display: flex;
    height: 100%;
}

.sub_menu_pc li a {
    color: var(--color-text-muted);
    text-decoration: none;
    padding: 0 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

header .search_pc {
    padding: 10px;
    border-left: 1px solid var(--color-meaningless-light-gray);
    display: flex;
    justify-content: center;
    align-items: center;
}

header .social {
    border-left: 1px solid var(--color-meaningless-light-gray);
}

.social ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    height: 100%;
}

header .social ul {
    width: 185px;
}

.social a {
    display: flex;
    place-items: center;
    height: 100%;
    transition: .3s ease;
}

@media (hover: hover) {
    .social a:hover {
        background: none;
        transform: scale(1.1);
    }
}

.social a:active {
    background: none;
    transform: scale(1.1);
}

header .social img {
    height: 25px;
    width: auto;
}

.main_menu_pc ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 60px;
}

.main_menu_pc li {
    flex: auto;
    height: 100%;
    border-left: 1px solid var(--color-meaningless-light-gray);
}

.main_menu_pc li:first-child {
    border: none;
}

.main_menu_pc li.enjoy {
    background-color: var(--color-category-enjoy-bg);
}

.main_menu_pc li a {
    border-top-style: solid;
    border-top-width: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: var(--larger-than-main-text-font-size);
    font-weight: 700;
    text-decoration: none;
    color: var(--color-text-main);
    transition: .3s ease;
}

@media (hover: hover) {
    .main_menu_pc li a:hover {
        background-color: rgba(0, 0, 0, 0.07);
    }
}

.main_menu_pc li.current-menu-item a,
.main_menu_pc li a:active {
    background-color: rgba(0, 0, 0, 0.07);
}

.main_menu_pc li.runner a {
    border-top-color: var(--color-category-runner);
}

.main_menu_pc li.volunteer a {
    border-top-color: var(--color-category-volunteer);
}

.main_menu_pc li.cheer a {
    border-top-color: var(--color-category-cheer);
}

.main_menu_pc li.enjoy a {
    border-top-color: var(--color-category-enjoy);
}

.main_menu_pc li a::after {
    content: "\203A";
    display: inline-block;
    transform: rotate(90deg);
    line-height: 0;
    font-size: var(--h3-font-size);
    height: 100%;
}

.main_menu_pc li.runner a::after {
    color: var(--color-category-runner);
}

.main_menu_pc li.volunteer a::after {
    color: var(--color-category-volunteer);
}

.main_menu_pc li.cheer a::after {
    color: var(--color-category-cheer);
}

.main_menu_pc li.enjoy a::after {
    color: var(--color-category-enjoy);
}


/* Search (サイト内検索) */

.p-header-search {
    position: relative;
    width: 218px;

    @media screen and (max-width: 599px) {
        width: 100%;
        margin-block: 15px;
    }
}

.p-header-search__inner {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

.p-header-search__input {
    width: 100%;
    height: 30px;
    padding: 0 15px 0 45px;
    color: var(--color-text-muted);
    background-color: var(--color-search-bg);
    border: none;
    border-radius: 15px;
    outline: none;
    transition: background-color 0.3s;

    &::-webkit-search-decoration,
    &::-webkit-search-cancel-button,
    &::-webkit-search-results-button,
    &::-webkit-search-results-decoration {
        display: none;
    }
}

.p-header-search__input:focus {
    outline: 2px solid var(--color-text-link);
    outline-offset: -2px;
}

.p-header-search__submit {
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    padding: 0;
    background: none;
    border: none;
    color: var(--color-text-link);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.3s;
}

@media (hover: hover) {
    .p-header-search__submit:hover {
        color: var(--color-text-primary);
    }
}

.p-header-search__submit:active {
    color: var(--color-text-primary);
}

#navs_sp_btn,
#header_navs_sp {
    display: none;
}

@media screen and (max-width:1199px) {
    .sub_menu_pc li a {
        font-size: .8em;
        padding: 0 .5rem;
    }
}

@media screen and (max-width:1023px) {
    #header_navs_pc {
        display: none;
    }

    #navs_sp_btn,
    #header_navs_sp {
        display: inherit;
    }

    #header_inner {
        height: 76px;
    }


    /* ハンバーガーボタン */

    #navs_sp_btn {
        display: block;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 9999;
        width: var(--hamburger-button-height);
        height: var(--hamburger-button-height);
        background-color: var(--color-text-primary);
        border: none;
        cursor: pointer;
        padding: 0;
        box-sizing: border-box;
    }

    #navs_sp_btn span {
        display: block;
        position: absolute;
        left: 21px;
        height: 3px;
        background-color: var(--color-white);
        transition: all 0.3s ease;
        /*border-radius: 2px;*/
    }

    #navs_sp_btn span:nth-child(1) {
        top: 21px;
        width: 30px;
    }

    #navs_sp_btn span:nth-child(2) {
        top: 34.5px;
        width: 30px;
    }

    #navs_sp_btn span:nth-child(3) {
        top: 48px;
        width: 12px;
        margin-right: 18px;
    }

    body.nav-open #navs_sp_btn span:nth-child(1) {
        top: 34px;
        transform: rotate(45deg);
        width: 30px;
    }

    body.nav-open #navs_sp_btn span:nth-child(2) {
        opacity: 0;
    }

    body.nav-open #navs_sp_btn span:nth-child(3) {
        top: 34px;
        transform: rotate(-45deg);
        width: 30px;
        margin-left: 0;
    }


    /* タブレット・スマホメニュー本体 */

    #header_navs_sp {
        position: fixed;
        top: var(--hamburger-button-height);
        right: -100%;
        width: 100%;
        max-width: var(--sp-menu-max-width);
        height: calc(100vh - var(--hamburger-button-height));
        z-index: 9998;
        background-color: var(--color-white);
        box-shadow: -4px 0 10px rgba(0, 0, 0, 0.1);
        transition: right 0.4s ease;
        overflow-y: auto;
        color: var(--color-white);
        background-color: var(--color-text-primary);
    }

    body.nav-open #header_navs_sp {
        right: 0;
    }

    #navs_sp_inner {
        width: 100%;
        padding: 1.42rem 2rem;
    }

    #header_navs_sp ul {
        padding: 0;
    }

    #main_menu_sp_top > ul > li,
    #main_menu_sp_bottom > ul > li {
        position: relative;
        font-size: 1.28rem;
    }

    #main_menu_sp_top > ul > li > a,
    #main_menu_sp_bottom > ul > li > a {
        display: flex;
        align-items: center;
        height: 60px;
        padding: 0 40px 0 15px;
        color: var(--color-white);
        background-color: transparent;
        text-decoration: none;
        font-weight: 700;
        border-bottom: 1px solid var(--color-sp-menu-ruled-line);
    }

    #main_menu_sp_top > ul > .menu-item-has-children::after,
    #main_menu_sp_bottom > ul > .menu-item-has-children::after {
        content: "\203A";
        position: absolute;
        right: 20px;
        top: 18px;
        font-size: var(--font-size-sp);
        color: var(--color-white);
        transition: transform 0.3s ease;
        pointer-events: none;
    }

    #main_menu_sp_top > ul > .menu-item-has-children.is-open::after,
    #main_menu_sp_bottom > ul > .menu-item-has-children.is-open::after {
        transform: rotate(90deg);
        color: var(--color-text-link);
    }

    #main_menu_sp_top .sub-menu,
    #main_menu_sp_bottom .sub-menu {
        display: none;
        margin-top: .5rem;
        padding-bottom: 10px;
        padding-left: 0;
        list-style: none;
    }

    #main_menu_sp_top .sub-menu > li,
    #main_menu_sp_bottom .sub-menu > li {
        position: relative;
        height: 36px;
    }

    #main_menu_sp_top .sub-menu > li > a,
    #main_menu_sp_bottom .sub-menu > li > a {
        display: flex;
        align-items: center;
        height: 36px;
        padding-left: 35px;
        color: var(--color-text-light-blue);
        text-decoration: none;
        font-size: 1.14rem;
    }

    #main_menu_sp_top .sub-menu > li::before,
    #main_menu_sp_bottom .sub-menu > li::before {
        content: "";
        display: block;
        position: absolute;
        left: 20px;
        top: 50%;
        transform: translateY(-50%);
        width: 8px;
        height: 3px;
        background-color: var(--color-text-link);
    }

    #main_menu_sp_bottom {
        border-top: 1px solid var(--color-sp-menu-ruled-line);
    }

    #main_menu_sp_middle ul {
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
        gap: 12px;
    }

    #main_menu_sp_middle li {
        width: 40%;
        font-size: var(--larger-than-main-text-font-size);
        font-weight: bold;
        color: var(--color-white);
        flex: auto;
        border-radius: 8px;
        position: relative;
        transition: .3s ease;
    }

    @media (hover: hover) {
        #main_menu_sp_middle li:hover {
            opacity: .8;
        }
    }

    #main_menu_sp_middle li:active {
        opacity: .8;
    }

    #main_menu_sp_middle li.runner {
        background-color: var(--color-category-runner);
    }

    #main_menu_sp_middle li.volunteer {
        background-color: var(--color-category-volunteer);
    }

    #main_menu_sp_middle li.cheer {
        background-color: var(--color-category-cheer);
    }

    #main_menu_sp_middle li.enjoy {
        background-color: var(--color-category-enjoy);
    }

    #main_menu_sp_middle li a {
        display: block;
        text-align: center;
        color: var(--color-white);
        text-decoration: none;
        padding: 2.775rem 1rem;
        transition: .3s ease;
    }

    @media (hover: hover) {
        #main_menu_sp_middle li a:hover {
            color: var(--color-white);
            background-color: transparent;
        }
    }

    #main_menu_sp_middle li a:active {
        color: var(--color-white);
        background-color: transparent;
    }

    #main_menu_sp_middle li::after {
        content: "\2192";
        display: flex;
        justify-content: center;
        align-items: center;
        width: 16px;
        height: 16px;
        border-radius: 8px;
        color: var(--color-text-primary);
        background-color: var(--color-white);
        overflow: hidden;
        font-size: 12px;
        line-height: 1;
        position: absolute;
        right: 6px;
        bottom: 6px;
    }

    #navs_sp_overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: rgba(255, 255, 255, 0.7);
        backdrop-filter: blur(4px);
        z-index: 9997;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.4s ease, visibility 0.4s ease;
    }

    body.nav-open #navs_sp_overlay {
        opacity: 1;
        visibility: visible;
    }

    .p-header-search {
        width: 100%;
    }
    
    #header_navs_sp .social li{
        height: 44px;
    }
    #header_navs_sp .social img{
        height: 100%;
        width: auto;
    }
}


/* #countdown */

#countdown {
    color: #fff;
    background: var(--gradient-active);
    font-family: var(--font-countdown);
    font-size: var(--larger-than-main-text-font-size);
    font-weight: bold;
    line-height: 1.2;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 67px;
    margin-top: var(--pc-menu-inner-height);
}

#countdown p {
    height: 100%;
}

#countdown .date {
    display: flex;
    justify-content: center;
    align-items: center;
}

#countdown .event_date {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.73rem;
}

#countdown .event_date em {
    font-size: 3.33rem;
}

#countdown .event_date span {
    font-size: 1.46rem;
    width: 2.12rem;
    height: 2.12rem;
    color: var(--color-caution);
    background-color: #fff;
    border-radius: 1.06rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 1rem;
}

#countdown .remaining_days p {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.73rem;
}

#countdown .remaining_days span {
    font-size: var(--larger-than-main-text-font-size);
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    margin: 0 1rem;
}

#countdown .remaining_days strong {
    font-size: 3.33rem;
}

@media screen and (max-width:1023px) {
    #countdown {
        width: 100%;
        height: 50px;
    }

    #countdown .event_title {
        font-size: 14px;
        line-height: 1.1;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #countdown .event_date {
        font-size: 18px;
    }

    #countdown .event_date em {
        font-size: 34px;
    }

    #countdown .event_date span {
        font-size: 18px;
        width: 26px;
        height: 26px;
        border-radius: 13px;
        margin: 0 .5rem;
    }

    #countdown .remaining_days p {
        font-size: 20px;
    }

    #countdown .remaining_days span {
        font-size: 14px;
    }

    #countdown .remaining_days strong {
        font-size: 34px;
    }
}

@media screen and (max-width:599px) {
    #countdown {
        height: 75px;
        flex-flow: column nowrap;
    }

    #countdown .date {
        border-bottom: 1px solid #fff;
    }

    #countdown .event_title {
        font-size: 12px;
    }

    #countdown .event_date {
        font-size: 16px;
    }

    #countdown .event_date em {
        font-size: 30px;
    }

    #countdown .event_date span {
        font-size: 16px;
        width: 24px;
        height: 24px;
        border-radius: 12px;
    }

    #countdown .remaining_days p {
        font-size: 18px;
    }

    #countdown .remaining_days span {
        font-size: 12px;
    }

    #countdown .remaining_days strong {
        font-size: 30px;
    }
}


/* .breadcrumbs */

.breadcrumbs {
    padding-left: var(--contents-left-padding);
    margin: .5rem 0 1rem;
}

.breadcrumbs a {
    font-size: var(--breadcrumbs-font-size);
    color: var(--color-text-muted);
    text-decoration: none;
}

.breadcrumbs span span {
    padding: .5rem;
}

.breadcrumbs span:first-child span {
    padding: .5rem .5rem .5rem 0;
}

.breadcrumbs .current-item {
    color: var(--color-text-primary);
    font-weight: bold;
}


/* toc（目次） */

#toc_wrapper {
    position: sticky;
    top: calc(var(--pc-menu-inner-height) + 40px);
    width: var(--toc-container-width);
    margin: 1rem 2.66rem 2rem 0;
    padding: var(--h3-font-size);
    flex-shrink: 0;
    background: var(--gradient-toc);
    border-radius: var(--h3-font-size);
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
}

#toc_container ul {
    margin: 0;
    padding: 0;
}

#toc_container::before {
    content: "";
    display: block;
    width: 70px;
    height: 15px;
    background-image: url(images/parts/toc_menu.svg);
    background-repeat: no-repeat;
    background-size: contain;
    margin-bottom: 1rem;
}

#toc_container li li {
    padding-left: 1rem;
}

#toc_container li a {
    color: var(--color-text-main);
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    padding-left: 1.5em;
    text-indent: -1.5em;
    transition: .3s ease;
}

#toc_container li a::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: .7rem;
    height: 3px;
    background-color: var(--color-grad-blue-end);
    margin-right: .5rem;
}

@media (hover: hover) {
    #toc_container li a:hover {
        color: var(--color-text-primary);
        background-color: transparent;
    }
}

#toc_container li a:active {
    color: var(--color-text-primary);
    background-color: transparent;
}

#toc_container li a.is-active {
    color: var(--color-text-primary);
}

.toc_toggle_tab,
#toc_overlay {
    display: none;
}

@media screen and (max-width: 1023px) {

    #toc_wrapper {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding: 0;
        box-sizing: border-box;
        background: none;
        box-shadow: none;
        transform: translateY(100%);
        transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
        z-index: 100;
    }

    #toc_wrapper.is-open {
        transform: translateY(0);
    }

    #toc_container {
        display: block;
        width: 100%;
        margin: 0;
        padding: var(--h3-font-size);
        background: var(--gradient-toc);
        border-radius: var(--h3-font-size) var(--h3-font-size) 0 0;
        box-shadow: 0 -4px 15px rgba(0, 0, 0, .15);
        max-height: 75vh;
        overflow-y: auto;
        box-sizing: border-box;
    }

    #toc_container::before {
        display: none;
    }

    .toc_toggle_tab {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: -40px;
        left: 50%;
        transform: translateX(-50%);
        width: 150px;
        height: 40px;
        background: var(--color-grad-blue-end);
        color: #fff;
        font-weight: bold;
        border-radius: 10px 10px 0 0;
        cursor: pointer;
        font-size: 14px;
        box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.1);
        z-index: 101;
    }

    #toc_wrapper.is-open .toc_toggle_tab {
        background: #333;
    }

    #toc_overlay {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        height: 100vh;
        background-color: rgba(255, 255, 255, .4);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.4s ease;
        z-index: 99;
    }

    #toc_overlay.is-active {
        opacity: 1;
        pointer-events: auto;
    }

    #toc_container li {
        margin: 0;
        padding: 0;
    }

    #toc_container li a {
        display: flex;
        align-items: center;
        min-height: 48px;
        padding: 6px 12px;
        width: 100%;
        box-sizing: border-box;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        text-indent: 0;
    }

    #toc_container li li {
        padding-left: 1.5rem;
    }

    #toc_container li a::before {
        content: "";
        flex-shrink: 0;
        width: .7rem;
        height: 3px;
        background-color: var(--color-grad-blue-end);
        margin-right: .75rem;
        text-indent: 0;
    }
}


/* .sidebar */

.sidebar {
    box-shadow: -10px 0 5px -4px rgba(0, 0, 0, .1);
    position: relative;
    z-index: 5;
    padding: 0 14px;
}

.sidebar ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 0;
}

.sidebar .recruitment_links ul {
    gap: 5px;
}

.sidebar .sponsored_links ul {
    margin-top: 0;
    gap: 5px;
}

.sidebar li {
    width: 170px;
}

.sidebar li a {
    display: block;
}

.sidebar li a img {
    width: 100%;
    height: auto;
    display: block;
}

.sponsored_links {
    text-align: center;
    border-top: 1px solid var(--color-meaningless-light-gray);
    margin-bottom: 1.5rem;

    @media screen and (max-width:1199px) {
        padding-top: 2rem;
        margin-bottom: 2.5rem;
    }

}

.sponsored_links h2 {
    display: inline-block;
    font-size: 18px;
    font-weight: bold;
    background: var(--gradient-heading);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-style: italic;
    margin-bottom: .5rem;
}

.sponsored_links li a img{
    border: 1px solid var(--color-meaningless-light-gray);
}

/* #sponsor_list */

#sponsor_list {
    background-color: var(--color-bg-gray);
    padding: 1rem 2rem;
}

#sponsor_list dl {
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    width: 80%;

    @media screen and (max-width: 1023px) {
        width: 90%;
    }

    @media screen and (max-width: 599px) {
        width: 100%;
    }
}

#sponsor_list .sponsor-row {
    display: flex;
    align-items: flex-start;
    border-bottom: 1px solid var(--color-text-muted);
    margin-bottom: 1rem;

    @media screen and (max-width: 599px) {
        flex-direction: column;
    }
}

#sponsor_list .sponsor-row:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

#sponsor_list dt {
    flex: none;
    width: 4em;
    letter-spacing: .8rem;
    font-size: var(--larger-than-main-text-font-size);
    font-weight: bold;
    color: var(--color-text-primary);
    margin-bottom: .5rem;
    margin-left: 1.5rem;

    @media screen and (max-width: 599px) {
        width: 2em;
        letter-spacing: 0;
        margin-bottom: 0;
        margin-left: 0;
    }
}

#sponsor_list dd {
    color: var(--color-text-dark);
    padding-bottom: 1rem;
    margin: 0 0 1rem;
    line-height: 2.5;
    border-bottom: 1px solid var(--color-passive-bg);

    @media screen and (max-width: 599px) {
        line-height: 1.5;
    }
}

#sponsor_list dd:last-child {
    border: none;
    margin: 0;
}

#sponsor_list span {
    display: inline-block;
    white-space: nowrap;
    padding: 0 1rem 0 0;

    @media screen and (max-width: 599px) {
        padding: 0 .5rem 0 0;
    }
}

.translated-ltr #sponsor_list span {
    white-space: inherit;
}

#sponsor_list span::after {
    content: "／";
    display: inline-block;
    margin-left: 1rem;

    @media screen and (max-width: 599px) {
        margin-left: .5rem;
    }
}

#sponsor_list span:last-child::after {
    content: none;
}

#sponsor_list p {
    text-align: center;
    margin-top: 0;
}

@media screen and (max-width:1023px) {
    #sponsor_list {
        padding: 2rem 1.5rem;
    }

}

@media screen and (max-width:599px) {
    #sponsor_list {
        padding: 1rem 1.5rem 2rem;
    }

    #sponsor_list dl {
        margin-top: 0;
    }

    #sponsor_list dd {
        margin: 0 0 .5rem;
    }
}


/* footer */

footer {
    text-align: center;
    border-top: 4px solid transparent;
    border-image: var(--gradient-footer);
    border-image-slice: 1 0 0 0;
    padding: 1.5rem 1rem .5rem;
}

footer p {
    margin: 0;
}

footer .committee_name {
    color: var(--color-text-primary);
    font-size: var(--h3-font-size);
    font-weight: bold;

    @media screen and (max-width:599px) {
        font-size: 1.57rem;
        line-height: 1.5;
    }
}

footer address {
    font-size: var(--form-font-size);
    font-style: normal;
    line-height: 1.6;
    color: var(--color-text-dark);
    margin: 1rem;
}

footer ul {
    margin: 0;
    padding: 0;
}

footer .social_language {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
}

footer .social ul {
    justify-content: center;
    gap: 1.5rem;
    width: 100%;
    max-width: 210px;
    margin: 0 auto;
}

/*
footer .select_language{
    margin-left: 3rem;
}
*/
footer .select_language a {
    color: inherit;
}

footer .select_language .gt_switcher-popup span {
    display: inline-block;
    padding-top: .5rem;
    padding-bottom: .5rem;
}

footer .social img {
    height: 35px;
    width: auto;
}

footer .footer_nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 3rem;
}

footer .footer_nav li a {
    padding: .5rem 1.5rem;
    color: var(--color-text-muted);
    text-decoration: underline;

    @media screen and (max-width:599px) {
        font-size: .85rem;
        padding: .5rem 1rem;
    }
}

.copyright {
    font-size: var(--font-size-sp);
    color: var(--color-text-primary);

    @media screen and (max-width:599px) {
        font-size: 12px;
        margin: 0;
    }
}

@media screen and (max-width:1023px) {
    body.has-toc-tab .copyright {
        margin-bottom: 40px !important;
    }
}


/* Coming Soonへの対応 */
/* メニューURLに #coming-soon と打ち込むことで.is-coming-soon自動付与 */

.is-coming-soon {
    cursor: not-allowed;
    position: relative;
}

.is-coming-soon::before {
    content: "COMING SOON";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 5;
    color: var(--color-white);
    background-color: rgba(150, 150, 150, .7);
    font-weight: bold;
    font-size: 1.2em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.is-coming-soon a {
    cursor: not-allowed;
    /* 文字を薄くするなど書く */
}

@media (hover: hover) {
    .is-coming-soon a:hover {
        /* ここにホバー時のスタイルを書く（通常、色を変えないように指定） */
    }
}

.is-coming-soon a:active {}


/* 共通ページネーションスタイル */

.p-pagination {
    margin-top: 4rem;
    display: flex;
    justify-content: center;

    ul.page-numbers {
        display: flex;
        gap: 0.5rem;
        list-style: none;
        padding: 0;
        margin: 0;

        li {
            margin: 0;
            padding: 0;
        }

        .page-numbers {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 40px;
            height: 40px;
            padding: 0 0.5rem;
            border: 1px solid #ddd;
            background-color: #fff;
            color: #333;
            text-decoration: none;
            font-weight: bold;
            font-size: 0.95rem;
            border-radius: 4px;
            box-sizing: border-box;
            transition: all 0.2s;


            @media (hover: hover) {
                &:hover {
                    background-color: #005bac;
                    border-color: #005bac;
                    color: #fff;
                }
            }

            &.current {
                background-color: #333;
                border-color: #333;
                color: #fff;
                cursor: default;
            }

            &.dots {
                border: none;
                background: transparent;
                color: #999;
                cursor: default;
            }

            .prev,
            .next {
                font-size: 1.2rem;
                line-height: 1;
            }
        }
    }
}


/* ブロックの表示調整 */
.wp-block-heading {
    margin-top: 0;
}

.wp-block-image img {
    width: 100%;
    height: auto;
}

.wp-block-paragraph {
    margin-top: 1rem;
    margin-bottom: 2rem;
}

.p-entry-content {

    /* ブロック リスト */
    ul {
        list-style-type: circle;
    }

    ol {
        list-style-type: decimal;
    }

    /* ブロック テーブル */

    .wp-block-table,
    figure.wp-block-flexible-table-block-table {
        margin: 0;
        margin-block: var(--wp--style--block-gap, 2rem);

        table {
            border-collapse: separate;
            border-spacing: 2px;
            margin-bottom: 2rem;
        }

        table th,
        table td {
            border: none;
            padding: 1.5rem;
        }

        table th {
            color: var(--color-text-primary);
            background-color: var(--color-bg-gray);
        }

        table td {
            color: var(--color-text-dark);
            background-color: var(--color-td-bg);
        }

        @media screen and (max-width: 940px) {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;

            table {
                width: 100%;
                min-width: 600px;
            }
        }
    }


    figure.wp-block-flexible-table-block-table {
        margin-top: 0;
    }

    /* .in_record_table内のtableのみ */
    .in_record_table figure.wp-block-flexible-table-block-table table {
        width: 100%;
        min-width: 100%;
    }

    .in_record_table figure.wp-block-flexible-table-block-table th,
    .in_record_table figure.wp-block-flexible-table-block-table td {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* .u-table-stack 付加時の個別上書き */
    .wp-block-flexible-table-block-table.u-table-stack > table {
        width: auto;
    }

    @media screen and (max-width: 940px) {

        figure.wp-block-table.u-table-stack table,
        .wp-block-flexible-table-block-table.u-table-stack > table {
            min-width: 100%;
        }
    }

    @media screen and (max-width: 599px) {
        .u-table-stack table {
            display: flex;
            flex-direction: column;
            min-width: 100%;
            gap: 2px;
        }

        .u-table-stack tr {
            display: flex;
            flex-direction: column;
            width: 100%;
            gap: 2px;
        }

        .u-table-stack th {
            width: 100%;
            display: block;
            order: 1;
        }

        .u-table-stack td {
            width: 100%;
            display: block;
            order: 2;
        }

        /* .in_record_table内のtableのみ */
        .in_record_table figure.wp-block-flexible-table-block-table table {
            min-width: 100%;
        }

        .in_record_table figure.wp-block-flexible-table-block-table th,
        .in_record_table figure.wp-block-flexible-table-block-table td {
            padding-left: .5rem;
            padding-right: .5rem;
        }
    }
}

/* ボタン */
.wp-block-button__link {
    transition: .3s ease;
    margin-bottom: 2rem;
}

@media (hover: hover) {
    .wp-block-button__link:hover {
        opacity: .7;
    }
}

.wp-block-button__link:active {
    opacity: .7;
}

.wp-block-group,
.wp-block-columns {
    max-width: 100%;
    overflow: hidden;
}

/* カスタムアコーディオン（JS制御） */
.js-accordion {
    border-radius: 4px;
    margin-bottom: 15px;
    background: var(--color-white);
    overflow: hidden;
}

h3.js-accordion-title {
    margin: 0 !important;
    padding: .4rem 1.5rem;
    color: var(--color-white);
    background: var(--color-text-link);
    cursor: pointer;
    position: relative;
    font-size: 1.53rem;
    line-height: 1.5;
    padding-right: 45px;
    width: 100%;
    box-sizing: border-box;
    border-radius: .6rem;
}

h3.js-accordion-title::after {
    content: '\02227';
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--color-white);
    transition: transform 0.3s ease;
}

.js-accordion.is-open h3.js-accordion-title::after {
    content: '\02228';
}

div.js-accordion-content {
    display: none;
    padding: 20px;
    background: var(--color-white);
    margin: 0 !important;
    line-height: 1.6;
    box-sizing: border-box;
}

/* ケイ線 */
.wp-block-separator {
    border: 1px solid var(--color-text-light-blue);
    margin: 1rem 0;
}
