/* ==============================
conference LP専用CSS
このLP配下(conference/)で完結させ、他ページのスタイルに影響を与えない
クラス名は全て「conference」プレフィックスを付与する
フォントサイズ・余白は原則clamp()で画面幅に応じて連続的にスケールさせ、
レイアウトの組み方自体が変わる箇所(縦積み化・ハンバーガー化など)のみメディアクエリで切り替える
=============================== */

.conferencePage {
    font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
    color: #333;
}

.conferenceWrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* KV(mainBg)
----------------------------------- */
.conferenceKv {
    position: relative;
    padding: 0;
    /* common.cssのsection{padding:40px 0 100px}を明示的に打ち消す */
    line-height: 0;
}

.conferenceKv picture {
    display: block;
}

.conferenceKvImage {
    display: block;
    width: 100vw;
    height: auto;
    background: #fcf5eb;
}

.conferenceKvForm {
    /* 1023px以下はKV画像の下に通常配置されるカードとして表示 */
    line-height: normal;
    width: min(480px, calc(100% - 32px));
    margin: 20px auto 0;
    background: #fff;
    border-radius: 8px;
    padding: clamp(16px, 4vw, 24px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

@media (min-width: 1024px) {

    /* kv_bg.png右側の余白部分にフォームを配置。
       ヘッダー/フッターの「無料で申し込む」がここへのアンカーリンクなので、
       画面に追従させると押しても何も起きず遷移の意味がなくなるため、追従はさせずKV内に留める */
    .conferenceKvForm {
        position: absolute;
        top: 24px;
        bottom: 24px;
        right: 4%;
        width: clamp(260px, 24vw, 400px);
        margin: 0;
        overflow-y: auto;
        z-index: 2;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    }
}

/* header
----------------------------------- */
/* アンカー移動時、sticky固定の.conferenceHeaderに隠れないための仕掛け。
   各アンカー先の直前に置いた.conferenceAnchorOffsetにscroll-margin-topでヘッダー高さぶんの
   余白を持たせ、アンカー移動時の停止位置だけをヘッダー分ずらす（レイアウトには影響しない）。
   conference.jsでヘッダーの実高さを計測して--conferenceHeaderHeightに反映するので、
   固定px値のように折り返し崩れ等で実際の高さとズレることがない。 */
.conferenceAnchorOffset {
    display: block;
    scroll-margin-top: calc(var(--conferenceHeaderHeight, 150px) + 20px);
}

/* common.cssのheader{height:50px;display:flex...}という要素セレクタと衝突するため、意図的に<header>タグではなくdivで実装している */
.conferenceHeader {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
}

.conferenceHeaderInner {
    max-width: 1920px;
    margin: 0 auto;
    padding: 20px clamp(20px, 1.6vw, 30px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(16px, 1.3vw, 24px);
    flex-wrap: wrap;
}

.conferenceHeaderBrand {
    display: flex;
    align-items: center;
    gap: 8px;
}

.conferenceHeaderA8Logo {
    width: clamp(70px, 6vw, 100px);
    height: clamp(34px, 3vw, 48px);
}

.conferenceHeaderCross {
    font-size: clamp(20px, 2.5vw, 40px);
    font-weight: 700;
    color: #000;
    line-height: 1;
}

.conferenceHeaderEcnoproLogo {
    width: clamp(120px, 10vw, 180px);
    height: clamp(24px, 2vw, 35px);
}

.conferenceHeaderRight {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2.6vw, 48px);
    flex-wrap: wrap;
}

.conferenceHeaderMenuToggle {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
    flex: 0 0 auto;
}

.conferenceHeaderMenuToggleBar {
    display: block;
    width: 26px;
    height: 3px;
    background: #221a14;
    transition: transform .3s ease, opacity .3s ease;
}

.conferenceHeaderMenuToggle[aria-expanded="true"] .conferenceHeaderMenuToggleBar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.conferenceHeaderMenuToggle[aria-expanded="true"] .conferenceHeaderMenuToggleBar:nth-child(2) {
    opacity: 0;
}

.conferenceHeaderMenuToggle[aria-expanded="true"] .conferenceHeaderMenuToggleBar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

.conferenceHeaderMenuToggleText {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.conferenceHeaderNavList {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2.6vw, 48px);
    margin: 0;
    padding: 0;
    list-style: none;
    flex-wrap: wrap;
}

.conferenceHeaderNavList a {
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(14px, 1.05vw, 20px);
    font-weight: 700;
    color: #333;
    text-decoration: none;
    white-space: nowrap;
}

.conferenceHeaderNavList a:hover {
    opacity: .6;
}

.conferenceHeaderCta {
    display: inline-flex;
    position: relative;
    align-items: center;
    justify-content: center;
    height: clamp(44px, 4.2vw, 80px);
    padding: 0 clamp(14px, 3vw, 40px);
    border-radius: 100px;
    background: linear-gradient(90deg, #f31b1f 0%, #e01243 100%);
    box-shadow: 0 4px 10px #ffabab;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 1.25vw, 24px);
    font-weight: 500;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    flex: 0 0 auto;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
}

.conferenceHeaderCta::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 45%;
    height: 100%;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, .65) 50%, transparent 100%);
    transform: skewX(-20deg);
    pointer-events: none;
}

.conferenceHeaderCta:hover {
    transform: scale(1.03);
    box-shadow: 0 6px 18px #ffabab;
}

.conferenceHeaderCta:hover::before {
    animation: conferenceCtaShine .85s ease forwards;
}

/* 1024px以下は「ロゴ+CTAは常時表示、ナビはハンバーガーに格納」に切り替え(960pxだと1000px前後で折り返す隙間が生じるため1024pxに設定) */
@media (max-width: 1024px) {
    .conferenceHeaderMenuToggle {
        display: flex;
    }

    .conferenceHeaderNav {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        max-height: 0;
        overflow: hidden;
        background: #fff;
        box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
        transition: max-height .3s ease;
    }

    .conferenceHeaderNav.is-open {
        max-height: 400px;
    }

    .conferenceHeaderNavList {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        padding: 10px 30px 20px;
    }

    .conferenceHeaderNavList li {
        width: 100%;
        border-top: 1px solid #eee;
    }

    .conferenceHeaderNavList a {
        display: block;
        padding: 16px 0;
    }
}

/* 560px以下は、ブランドロゴ行+CTA行の2段組みに変更。ハンバーガーはブランド行に対して右上固定 */
@media (max-width: 560px) {
    .conferenceHeaderInner {
        position: relative;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .conferenceHeaderBrand {
        padding-right: 56px;
        /* ハンバーガーと重ならないよう右側に余白を確保 */
    }

    .conferenceHeaderMenuToggle {
        position: absolute;
        top: 20px;
        right: 20px;
    }

    .conferenceHeaderRight {
        width: 100%;
        justify-content: center;
    }

    .conferenceHeaderCta {
        width: 80%;
    }
}

/* topspeakers(トップスピーカー)
----------------------------------- */
.conferenceTopSpeakers {
    padding: clamp(40px, 6vw, 100px) 20px;
    background: url("/ec/conference/image/contents_top_bg.png") calc(50% + 1px) -2px no-repeat, #fcf5eb;
    background-size: 100% auto, auto;
}

@media (max-width: 767px) {
    .conferenceTopSpeakers {
        /* SPはヘッダー(白背景)との繋ぎ目が不自然になるため、装飾背景を外してクリーム色のみに */
        background: #fcf5eb;
    }
}

.conferenceTopSpeakersTit {
    margin: 0 0 clamp(20px, 3vw, 44px);
    text-align: center;
}

.conferenceTopSpeakersTit .conferenceSectionTit {
    text-shadow:
        1px 1px 0 #fcf5eb,
        -1px 1px 0 #fcf5eb,
        1px -1px 0 #fcf5eb,
        -1px -1px 0 #fcf5eb,
        0 2px 0 #fcf5eb,
        0 -2px 0 #fcf5eb,
        2px 0 0 #fcf5eb,
        -2px 0 0 #fcf5eb;
}

.conferenceSpeakerLogoGrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: clamp(16px, 3vw, 50px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.conferenceSpeakerLogo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: clamp(60px, 6vw, 90px);
    /*padding: clamp(8px, 1vw, 14px) clamp(12px, 1.5vw, 20px);*/
    background: #fff;
}

.conferenceSpeakerLogo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* about(EC NEXTとは)
----------------------------------- */
.conferenceAbout {
    padding: clamp(40px, 6vw, 100px) 20px;
    background: #fcf5eb;
}

.conferenceAboutTit {
    max-width: 840px;
    margin: 0 auto clamp(16px, 3vw, 34px);
    text-align: center;
}

.conferenceAboutBody {
    max-width: 1195px;
    margin: 0 auto;
}

.conferenceAboutBody p {
    margin: 0 0 clamp(20px, 3vw, 40px);
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(14px, 0.85vw, 16px);
    font-weight: 500;
    line-height: 1.9;
    color: #000;
}

.conferenceAboutBody p:last-child {
    margin-bottom: 0;
}

/* sessions(セッション)
----------------------------------- */
.conferenceSessions {
    padding: clamp(40px, 5vw, 80px) 20px clamp(40px, 5vw, 78px);
    background: #221a14;
}

.conferenceSessionsTit {
    max-width: 840px;
    margin: 0 auto clamp(16px, 2vw, 31px);
    text-align: center;
}

.conferenceSessionsTit .conferenceSectionTit {
    color: #fff;
}

.conferenceSessionsTable {
    display: flex;
    flex-direction: column;
    gap: clamp(16px, 2vw, 31px);
}

.conferenceSessionCard {
    background: #2d231f;
    border: 2px solid #3e322b;
    border-radius: 8px;
    color: #fff;
}

.conferenceSessionRow {
    display: flex;
    align-items: flex-start;
    gap: clamp(12px, 2vw, 30px);
    padding: clamp(16px, 2vw, 30px);
}

.conferenceSessionTime {
    flex: 0 0 auto;
    min-width: clamp(70px, 7vw, 104px);
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(16px, 1.25vw, 24px);
    font-weight: 700;
    white-space: nowrap;
}

.conferenceSessionRowTitle {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(15px, 1.25vw, 24px);
    font-weight: 700;
}

.conferenceSessionDetail {
    padding: clamp(16px, 2vw, 30px);
}

.conferenceSessionLayout {
    display: flex;
    align-items: flex-start;
    gap: clamp(12px, 2vw, 30px);
}

.conferenceSessionDetailTime {
    flex: 0 0 auto;
    min-width: clamp(70px, 7vw, 104px);
}

.conferenceSessionTimeMain {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(16px, 1.25vw, 24px);
    font-weight: 700;
    white-space: nowrap;
}

.conferenceSessionTimeSub {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 1vw, 20px);
    font-weight: 500;
    white-space: nowrap;
}

.conferenceSessionContent {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 3vw, 40px);
    flex: 1;
    min-width: 0;
}

.conferenceSessionMain {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: clamp(16px, 2vw, 25px);
}

.conferenceSessionTextContent {
    flex: 1;
    min-width: 0;
}

.conferenceSessionCardTitle {
    margin: 0 0 clamp(10px, 1.5vw, 20px);
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(18px, 1.25vw, 24px);
    font-weight: 700;
    line-height: 1.4;
}

.conferenceSessionDesc {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(14px, 1.05vw, 20px);
    font-weight: 500;
    line-height: 1.8;
    color: #ccbcaa;
}

.conferenceSessionPhaseIcon {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: clamp(110px, 9vw, 155px);
    height: clamp(110px, 9vw, 155px);
    border-radius: 50%;
    background: #ff5300;
    text-align: center;
}

.conferenceSessionPhaseLabel {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(15px, 1.25vw, 24px);
    font-weight: 700;
    line-height: 1.25;
    /* 長い金額レンジ(例: 100万〜1,000万)は<br>で改行される想定のためnowrapは付けない */
}

.conferenceSessionPhaseUnit {
    font-size: clamp(11px, 0.7vw, 14px);
}

.conferenceSessionPhaseSub {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(11px, 0.7vw, 14px);
    line-height: 1.2;
    white-space: nowrap;
}

.conferenceSessionDivider {
    height: 1px;
    background: rgba(255, 255, 255, .15);
}

.conferenceSessionSpeaker {
    display: flex;
    /* トグル開閉で高さが変わっても写真・ロゴの位置が下がらないよう上揃えにする */
    align-items: flex-start;
    justify-content: space-between;
    gap: clamp(16px, 2vw, 24px);
}

.conferenceSessionSpeakerProfile {
    display: flex;
    align-items: flex-start;
    gap: clamp(12px, 1.5vw, 20px);
    /* conferenceSessionSpeakerBio追加で幅が伸び、ロゴが次の行に落ちてしまうため、
       残り幅いっぱいまで伸縮させてこの中で文章を折り返させる */
    flex: 1 1 auto;
    min-width: 0;
}

.conferenceSessionSpeakerInfo {
    min-width: 0;
}

.conferenceSessionSpeakerPhoto {
    flex: 0 0 auto;
    width: clamp(90px, 8vw, 140px);
    height: clamp(90px, 8vw, 140px);
    border-radius: 50%;
    background: #d9d9d9;
    object-fit: cover;
}

.conferenceSessionSpeakerCompany {
    margin: 0 0 8px;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(14px, 1.05vw, 20px);
    font-weight: 500;
    line-height: 1.8;
    color: #ccbcaa;
}

.conferenceSessionSpeakerName {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(16px, 1.15vw, 22px);
    font-weight: 700;
}

.conferenceSessionSpeakerBioToggle {
    margin-top: 8px;
}

.conferenceSessionSpeakerBioSummary {
    position: relative;
    display: block;
    width: fit-content;
    margin: 0;
    padding: 0 20px 0 0;
    border: none;
    background: none;
    appearance: none;
    text-align: left;
    cursor: pointer;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 0.95vw, 16px);
    font-weight: 700;
    color: #ff5300;
}

.conferenceSessionSpeakerBioIcon {
    position: absolute;
    top: 50%;
    right: 0;
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    /* この線2本の形状は、45deg回した状態が「下向き」の基準になる */
    transform: translateY(-50%) rotate(45deg);
    transition: transform .4s ease-out;
}

.conferenceSessionSpeakerBioToggle.is-open .conferenceSessionSpeakerBioIcon {
    /* 基準の45degからさらに180deg回して(45+180=225deg)真上向きにする */
    transform: translateY(-50%) rotate(225deg);
}

/* <details>標準のopen属性は、ブラウザが閉じている間コンテンツを内部的に
   非表示扱いにする実装差から開閉を繰り返すとtransitionが機能しないことがあったため、
   通常のbutton+divとし、conference.jsでis-openクラスとgrid-template-rowsを
   直接制御して高さの開閉をアニメーションさせる */
.conferenceSessionSpeakerBio {
    display: grid;
    grid-template-rows: 0fr;
    margin-top: 8px;
    transition: all .4s ease-out;
}

.conferenceSessionSpeakerBioText {
    margin: 0;
    overflow: hidden;
    min-height: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 0.95vw, 16px);
    font-weight: 500;
    line-height: 1.8;
    color: #ccbcaa;
}

.conferenceSessionCompanyLogo {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: clamp(140px, 14vw, 190px);
    height: clamp(70px, 7vw, 90px);
    padding: 10px;
    background: #fcf5eb;
}

.conferenceSessionCompanyLogo img {
    max-width: 100%;
    height: auto;
}

/* 560px以下はレイアウトの組み方自体が変わる箇所のみ切り替え(サイズは上記clamp()で連続スケール済み) */
@media (max-width: 560px) {
    .conferenceSessionRow {
        flex-direction: column;
        align-items: flex-start;
    }

    .conferenceSessionLayout {
        flex-direction: column;
    }

    .conferenceSessionDetailTime {
        display: flex;
        align-items: baseline;
        gap: 8px;
    }

    .conferenceSessionMain {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .conferenceSessionCardTitle {
        text-align: left;
    }

    .conferenceSessionDesc {
        text-align: left;
    }

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

    .conferenceSessionSpeakerProfile {
        display: block;
    }

    .conferenceSessionSpeakerPhoto {
        display: block;
        margin: 0 auto 8px;
    }

    .conferenceSessionCompanyLogo {
        align-self: center;
    }
}

/* outlineInner(開催概要)
----------------------------------- */
.conferenceOutline {
    padding: clamp(40px, 6vw, 100px) 20px;
    background: #fcf5eb;
}

.conferenceOutlineTit {
    max-width: 840px;
    margin: 0 auto clamp(16px, 2vw, 30px);
    text-align: center;
}

.conferenceSectionLabel {
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 1.05vw, 20px);
    font-weight: 700;
    color: #ff5300;
}

.conferenceSectionTit {
    margin: 8px 0 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(20px, 2.6vw, 40px);
    font-weight: 700;
    color: #000;
}

.conferenceOutlineTable {
    margin: 0;
}

.conferenceOutlineRow {
    display: flex;
    align-items: center;
    gap: clamp(24px, 5vw, 92px);
    padding: clamp(14px, 2vw, 24px) 0;
    border-top: 1px solid #ccc;
}

.conferenceOutlineRow:first-child {
    border-top: none;
}

.conferenceOutlineLabel {
    flex: 0 0 auto;
    min-width: clamp(70px, 8vw, 100px);
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(14px, 1.05vw, 20px);
    font-weight: 700;
    color: #8e7a6a;
    white-space: nowrap;
}

.conferenceOutlineValue {
    flex: 1;
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(14px, 1.05vw, 20px);
    font-weight: 700;
    color: #221a14;
}

.conferenceOutlineNote {
    color: #d00000;
}

@media (max-width: 560px) {
    .conferenceOutlineRow {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .conferenceOutlineLabel {
        flex: none;
    }
}

/* btmCtaArea
----------------------------------- */
.conferenceBtmCta {
    padding: clamp(30px, 5vw, 50px) 20px clamp(40px, 7vw, 83px);
    background: linear-gradient(90deg, #f34804 0%, #fe9839 100%);
    text-align: center;
}

.conferenceBtmCtaInner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(30px, 7vw, 100px);
    max-width: 550px;
    margin: 0 auto;
}

.conferenceCtaHeading {
    width: 100%;
}

.conferenceCtaTitle {
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(32px, 7vw, 100px);
    font-weight: 700;
    line-height: 1.36;
    color: #fff;
    white-space: nowrap;
}

.conferenceCtaMeta {
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(12px, 1vw, 16px);
    font-weight: 500;
    color: #fff;
}

.conferenceCtaAction {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 19px;
    width: 100%;
    max-width: 524px;
    margin: 0 auto;
}

.conferenceCtaButton {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: clamp(16px, 2vw, 26px) clamp(16px, 2.5vw, 30px);
    border-radius: 100px;
    background: #fff;
    box-shadow: 5px 5px 5px rgba(244, 79, 9, .6);
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(16px, 2.2vw, 32px);
    font-weight: 700;
    color: #221a14;
    text-decoration: none;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
}

.conferenceCtaButton::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 45%;
    height: 100%;
    background: linear-gradient(115deg, transparent 0%, rgba(244, 79, 9, .18) 50%, transparent 100%);
    transform: skewX(-20deg);
    pointer-events: none;
}

.conferenceCtaButton:hover {
    transform: scale(1.03);
    box-shadow: 8px 8px 12px rgba(244, 79, 9, .7);
}

.conferenceCtaButton:hover::before {
    animation: conferenceCtaShine .85s ease forwards;
}

@keyframes conferenceCtaShine {
    to {
        left: 125%;
    }
}

.conferenceCtaNote {
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(12px, 1vw, 16px);
    font-weight: 500;
    color: #fff;
}

@media (max-width: 560px) {
    .conferenceCtaButton {
        width: 80%;
    }
}

/* footer
----------------------------------- */
.conferenceFooter {
    padding: 0;
    background: #2d231f;
    border-top: none;
    /* common.cssのfooter{padding-top:30px;border-top:1px solid #ededed}を明示的に打ち消す */
}

.conferenceFooterInner {
    max-width: 1920px;
    margin: 0 auto;
    padding: clamp(24px, 4vw, 59px) clamp(20px, 2vw, 30px) clamp(24px, 4vw, 50px) clamp(20px, 3vw, 50px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
}

.conferenceCopyright {
    margin: 0;
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 1vw, 16px);
    font-weight: 500;
    color: #ccbcaa;
}

.conferenceLinkList {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2vw, 25px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.conferenceLinkList a {
    font-family: "Noto Sans", "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-size: clamp(13px, 1vw, 16px);
    font-weight: 500;
    color: #ccbcaa;
    text-decoration: underline;
}

.conferenceLinkList a:hover {
    opacity: .7;
    transition: .5s;
}

@media (max-width: 560px) {
    .conferenceFooterInner {
        flex-direction: column;
        align-items: flex-start;
    }
}