@charset "utf-8";
/*
Theme Name:TEDxMarunouchi
Description:responsive design
version： 0.0.1
*/

/* ----------------------------------------------------------------------
 共通 1rem=16px
---------------------------------------------------------------------- */
:root{ --main-color1:#eb0028; --main-color2:#c71c39; --sub-color1:#222; --sub-color2:#555; --sub-color3:#ddd; --sub-color4:#f3f3f3; --sub-color5:#888; }

@font-face{
    font-family:'Inter';
    src: url('fonts/Inter-VariableFont_opsz,wght.ttf') format('truetype');
    font-weight:100 900; 
    font-display:swap; 
}
body{
    font-family:'Inter', "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", "Yu Gothic", "Meiryo", sans-serif; font-weight:500; line-height:1.8; font-size:16px; color:var(--sub-color1);
}
h1, h2, h3, h4, h5, h6, .logotext, .title, .catch{ 
    font-family:'Inter', "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック Bold", "游ゴシック体", "Yu Gothic Bold", "Yu Gothic", "Meiryo", sans-serif; font-weight:700; line-height:1.3;
}
footer{ z-index:5; background:#fff; }
#main{ flex:1; position:relative; }
#container{ position:relative; display:flex; flex-direction:column; min-height:100vh; min-height:calc(var(--vh, 1vh) * 100); }
img{ display:block; max-width:100%; height:auto; }

/* textdeco */
h1{ font-size:3.5rem; font-size:clamp(2rem, calc(1.5rem + 2.5vw), 3.5rem); }
h2{ font-size:2.8rem; font-size:clamp(1.625rem, calc(1.233rem + 1.96vw), 2.8rem); }
#posttitle-area .title, 
.speaker-profile .title{ /* font-size:2.8rem !important; */ margin-top:0; }
h3{ font-size:2rem; font-size:clamp(1.25rem, calc(1rem + 1.25vw), 2rem); }
#page-header p.title{ font-size:2rem; font-size:clamp(1.25rem, calc(1rem + 1.25vw), 2rem); color:var(--sub-color5); }
h4{ font-size:1.4rem; font-size:clamp(1.05rem, calc(0.933rem + 0.58vw), 1.4rem); }
h2.wp-block-heading{ color:var(--main-color2); }
h3.wp-block-heading{ color:var(--sub-color2); }
.post-content h3.wp-block-heading{ width:fit-content; border-bottom:1px solid var(--main-color1); }
.post-content h4.wp-block-heading{ border-left:3px solid var(--main-color2); padding-left:.5em; }
a{ color:var(--sub-color2); text-decoration:none; transition:all .3s ease; }
a.tap{ position:relative; display:block; }
a.tap:active{ background:var(--sub-color4); transform:scale(.95); }
a.line{ position:relative; display:inline-block; }
a.line::after{ content:""; position:absolute; bottom:0; left:0; width:0; height:1px; background:var(--sub-color2); transition:all .3s ease; }
a.line:hover::after{ width:100%; }
.article p a{ text-decoration:underline; }
.article p a:hover{ color:var(--main-color2); }
dl.col2{ display:flex; flex-wrap:wrap; width:100%; }
dl.col2 dt{ font-weight:bold; width:25%; margin:0; padding:1.25em 0; display:flex; align-items:center; }
dl.col2 dd{ width:75%; margin:0; padding:1.25em 0; }
:where(dl.col2 dt, dl.col2 dd) p{ margin:0; }
.wpcf7 dl.col2 dt{ width:33.34%; }
.wpcf7 dl.col2 dd{ width:66.66%; }
@media screen and (max-width:479px) {
    dl.col2 dt{ width:100%; padding:1.25em 0 0; }
    dl.col2 dd{ width:100%; padding:.5em 0 1.25em; border-bottom:1px solid var(--sub-color3); }
    dl.col2 dt:first-of-type{ border-top:1px solid var(--sub-color3); }
    .wpcf7 dl.col2 dt, .wpcf7 dl.col2 dd{ width:100%; }
}
@media screen and (min-width:480px) and (max-width:767px) {
    dl.col2 dt, dl.col2 dd{ border-bottom:1px solid var(--sub-color3); }
    :where(dl.col2 dt, dl.col2 dd):first-of-type{ border-top:1px solid var(--sub-color3); }
}
@media screen and (min-width:768px) {
    :where(dl.col2 dt, dl.col2 dd):not(:first-of-type){ border-top:1px solid var(--sub-color3); }
}

/* フワッと表示 jsとセットで使う */
.scroll-block{ opacity:0; transform:translateY(20px); transition:all 1.5s; }
.scroll-block.blockIn{ opacity:1; transform:translateY(0); }

/* レイアウト */
.inner{ position:relative; padding:clamp(3.125rem, calc(1.534rem + 7.95vw), 7.5rem) clamp(1rem, calc(0.292rem + 3.54vw), 3.125rem); }
.inner2{ position:relative; max-width:1200px; margin:0 auto; }
.inner.pT0em{ padding-top:0; }
.inner.pB0em{ padding-bottom:0; }
.inner.pLR0em{ padding-right:0; padding-left:0; }
.img-cover, .img-contain{ position:relative; overflow:hidden; z-index:0; }
.img-cover img, .img-contain img{ position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:-1; }
.img-contain img{ object-fit:contain; }
/* header */
#header{ position:fixed; top:0; left:0; width:100%; height:clamp(3.75rem, calc(2.917rem + 4.17vw), 6.25rem); background:rgba(255,255,255,1); z-index:100; transition:height .3s ease, padding .3s ease; }
#header.scrolled{ height:60px; box-shadow:rgba(100, 100, 100, 0.2) 0px 7px 29px 0px; }
.nav-open #header{ background:rgba(255,255,255,0); }
.nav-open #header.scrolled{ box-shadow:none; }
#header .inner{ display:flex; justify-content:space-between; position:relative; width:100%; height:100%; }
#header-logo{ position:relative; width:clamp(12.5rem, calc(10.417rem + 10.42vw), 18.75rem); height:100%; }
#header-logo h1, #header-logo p{ position:relative; width:100%; height:100%; margin:0; }
#header-logo a{ display:flex; align-items:center; position:relative; width:100%; height:100%; }
#header-logo img{ width:100%; height:auto; }
#header-nav{ position:relative; display:flex; height:100%; }
#header-icons{ display:none; }
/* footer */
#copyright{ text-align:center; font-size:.8em; }
/* ブロックエディタ */
:where(.wp-block-columns.is-layout-flex.no-gap){ gap:0; border-bottom:1px solid var(--sub-color3); }
:where(.wp-block-columns.is-layout-flex.no-gap):first-of-type{ border-top:1px solid var(--sub-color3); }
:where(.wp-block-columns){ margin-bottom:0; }
.wp-block-image{ max-width:1000px !important; margin:0 auto !important; }
.wp-block-separator{ border-top:1px solid #ddd; }
@media screen and (min-width:768px) {
    #header-icons{ display:flex; align-items:center; }
}
@media screen and (min-width:1280px) {
    .inner{ padding:clamp(3.125rem, calc(1.534rem + 7.95vw), 7.5rem) clamp(3.125rem, calc(-9.375rem + 15.63vw), 6.25rem); }
}

/* nav */
/* drawer */
.hamburger{ position:absolute; top:50%; transform:translateY(-50%); right:clamp(1rem, calc(0.292rem + 3.54vw), 3.125rem); width:3.75em; height:3.75em; display:flex; flex-direction:column; justify-content:center; align-items:center; cursor:pointer; transition:all .3s ease; z-index:2; }
.hamburger-border{ display:inline-block; width:1.5em; height:2px; background:var(--sub-color1); margin:3px 0; transition:all .3s ease; }
.h-sp-menu{ display:inline-block; text-transform:uppercase; margin:3px 0 0; padding:0; line-height:1; font-size:.75em; transition:all .3s ease; }
.hamburger:hover .hamburger-border{ background:var(--main-color1); }
.hamburger:hover .h-sp-menu{ color:var(--main-color1); }
.nav-open .hamburger-border-top{ transform:translateY(8px) rotate(45deg); }
.nav-open .hamburger-border-center{ width:0; }
.nav-open .hamburger-border-bottom{ transform:translateY(-8px) rotate(-45deg); }
#drawer-menu{ position:fixed; left:-20px; top:0; width:100%; height:100vh; height:calc(var(--vh, 1vh) * 100); display:flex; align-items:center; transition:all .3s ease; z-index:99; overflow-y:auto; backdrop-filter:blur(8px); opacity:0; visibility:hidden; pointer-events:none; }
.drawer-inner{ position:relative; width:100%; padding:0 clamp(1rem, calc(0.19rem + 4.05vw), 3.125rem); transition:opacity .3s .3s ease; opacity:0; z-index:1; }
.black-bg{ position:fixed; right:0; top:0; width:100%; height:100vh; height:calc(var(--vh, 1vh) * 100); z-index:-1; opacity:0; visibility:hidden; cursor:pointer; background:rgba(255,255,255,.9); transition:all .3s ease; }
.nav-open .black-bg{ opacity:1; visibility:visible; }
#drawer-menu ul.menu{ width:100%; }
#drawer-menu ul.menu a{ position:relative; display:block; padding:.5em 0; }
#drawer-menu ul.menu a::after{ display:block; content:""; position:absolute; top:50%; right:1em; transform:translateY(-50%) rotate(45deg); width:.5em; height:.5em; border-top:2px solid var(--main-color1); border-right:2px solid var(--main-color1); z-index:1; transition:all .3s ease; }
#drawer-menu ul.menu a:hover::after{ right:.5em; }
#drawer-icons{ display:flex; justify-content:center; align-items:center; margin-bottom:2em; }
#global-menu{ position:relative; height:100%; }
#global-menu ul.menu{ display:none; }
@media screen and (min-width:480px) {
    .drawer-inner{ width:320px; height:100vh; height:calc(var(--vh, 1vh) * 100); margin:0 auto 0 0; display:flex; flex-direction:column; justify-content:center; background:rgba(255,255,255,1); }
    .black-bg{ background:rgba(200,200,200,.75); }
    .drawer-inner nav,
    #drawer-menu ul.menu{ position:relative; width:100%; }
}
@media screen and (max-width:767px) {
    .nav-open {
    /* ページのスクロールを禁止 */
    overflow:hidden; }
    .nav-open #drawer-menu{ left:0; opacity:1; visibility:visible; pointer-events:auto; }
    .nav-open .drawer-inner{ opacity:1; }
}
@media screen and (min-width:768px) {
    .hamburger{ display:none; }
    #drawer-menu{ visibility:hidden !important; pointer-events:none !important; right:-100vw !important; opacity:0 !important; }
    /* グロナビ */
    #global-menu ul.menu{ position:relative; height:100%; display:flex; align-items:center; margin:0; padding:0; }
    #global-menu ul.menu a{ display:block; padding:1em; font-size:1.125em; color:transparent; text-decoration:none; background:linear-gradient(to right, var(--main-color1) 50%, var(--sub-color2) 50%) 100%; background-clip:text; background-size:200% 100%; transition:all .5s ease; }
    #global-menu ul.menu a:hover{ background-position:0 100%; }
}

/* フッター */
#footer{ padding-bottom:60px; }
#footer ul.menu{ list-style:none; margin:0 0 30px; padding:0; display:flex; flex-wrap:wrap; justify-content:center; }
#footer ul.menu a{ padding:.25em 1em; }
.footerlogo,
.footericons{ display:flex; justify-content:center; margin-bottom:20px; padding:1em 0; }
.footerlogo img{ width:240px; height:auto; }
/* フッター linkbuttonの装飾 */
#footer .linkbutton{ margin:1em auto; }
#footer .linkbutton:first-of-type{ margin-top:0; }
#footer .linkbutton:last-of-type{ margin-bottom:3em; }
#footer .linkbutton a{ max-width:800px; }
/* TOPへ戻るボタン */
#back-to-top{ position:fixed; bottom:0; right:0; width:3.75em; height:3.75em; opacity:0; visibility:hidden; border:0; transition:opacity .3s, visibility .3s; background:var(--sub-color3); z-index:10; }
#back-to-top.is-active{ opacity:1; visibility:visible; }
@media screen and (min-width:768px) {
    #footer{ padding-bottom:0; }
}

/* SNSアイコン */
.instagram{ width:28px; aspect-ratio:1; }
#header-icons a,
#drawer-icons a,
.footericons a{ display:inline-block; padding:.5em; border-radius:50px; }
#header-icons a:hover,
#drawer-icons a:hover,
.footericons a:hover{ background:rgba(34,34,34,.1); }

/* ボタン */
.linkbutton,
.wp-block-buttons{ margin:1em auto; }
.linkbutton:first-of-type{ margin-top:3em; }
.linkbutton a, .wpcf7 .wpcf7-submit{ cursor:pointer; position:relative; display:block; width:90%; text-align:center; font-weight:bold; padding:.75rem 1rem; margin:0 auto; font-size:1.125em; user-select:none; transition:all .3s ease; color:#fff; background:linear-gradient(to right, var(--sub-color1) 50%, var(--main-color2) 50%) 100%; background-size:200% 100%; overflow:hidden; border:none; }
.wp-block-button__link{ border-radius:0; color:#fff; font-weight:bold; min-width:240px; background:linear-gradient(to right, var(--sub-color1) 50%, var(--main-color2) 50%) 100%; background-size:200% 100%; }
.wpcf7 .wpcf7-submit{ margin:1em auto; padding:1rem; }
.linkbutton a:hover,
.wp-block-button__link:hover,
.wpcf7 .wpcf7-submit:hover{ background-position:0 100%; }
:root :where(.wp-block-button.is-style-outline--1 .wp-block-button__link):hover{ border-color:var(--main-color2); color:var(--main-color2); }
@media screen and (min-width:480px) {
    .linkbutton a{ width:80%; }
}

/* パンクズ */
.breadcrumb{ margin-top:1rem; }
.breadcrumb ul{ display:flex; flex-wrap:wrap; align-items:center; list-style:none; margin:0; padding:0; }
.breadcrumb li{ display:flex; align-items:center; font-size:.9em; }
.breadcrumb li a{ display:inline-block; padding:.25em 0; text-decoration:underline; color:#606060; }
.breadcrumb li a span{ display:flex; align-items:center; }
.breadcrumb li span{ display:inline-block; padding:.25em 0; }
.breadcrumb .icon-color{ fill:var(--sub-color1) !important; }

/* アイコン */
.icon-color, button .icon-color{ width:1.25em; height:1.25em; fill:var(--sub-color1); }
.locationbox .icon-color{ width:2em; height:2em; }
.video-card .icon-color{ width:4em; height:4em; fill:var(--main-color1); }
.modal-close-button .icon-color{ width:3em; height:3em; fill:#fff; }

/* ページネーション */
.pagination{ margin:3em 0 0; }
ul.page-numbers{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; }
ul.page-numbers li{ margin:0 .125em; }
ul.page-numbers a, ul.page-numbers .current{ display:flex; justify-content:center; align-items:center; width:30px; height:30px; border:1px solid var(--sub-color3); }
ul.page-numbers .current{ background:var(--sub-color3); }
ul.page-numbers a:hover{ background:var(--main-color2); border:1px solid var(--main-color2); color:#fff; }
ul.page-numbers a:active{ transform:scale(.95); }
@media screen and (min-width:480px) {
    ul.page-numbers a, ul.page-numbers .current{ width:2.5em; height:2.5em; }
}
@media screen and (min-width:640px) {
    ul.page-numbers li{ margin:0 .25em; }
}

/* wpcf7 */
.wpcf7{ position:relative; }
.wpcf7 p{ margin-bottom:0 !important; }
.wpcf7 input, .wpcf7 textarea{ width:100%; padding:1em .5em; border:1px solid var(--sub-color2); border-radius:4px; line-height:1.3; }
.wpcf7 select, .wpcf7 input[type=checkbox], .wpcf7 input[type=radio] { width:auto; max-width:97%; padding:8px; border:1px solid var(--sub-color2); border-radius:4px; }
.wpcf7 select, .wpcf7 .wpcf7-list-item-label{ line-height:1.3; }
.wpcf7 .wpcf7-list-item{ display:block; }
.wpcf7 textarea{ height:300px; }
.hissu{ display:inline-block; background:var(--main-color2); color:#fff; font-size:.9em; font-weight:bold; padding:.1em .5em 0; margin:0 0 0 .5em; border-radius:4px; }

/* google Map */
.gmap{ position:relative; width:100%; aspect-ratio:1; margin:1em auto 0; }
.gmap iframe{ position:absolute; width:100%; height:100%; top:0; left:0; z-index:0; }

/* 記事リスト */
.bloglist{ position:relative; display:flex; flex-wrap:wrap; }
.blog .bloglist, .category .bloglist{ align-items:center; }
.item{ position:relative; width:100%; margin:0 0 3em; }
.item a{ position:relative; display:flex; }
.item a:hover{ transform:translateY(-.5em); }
.item a:active{ background:var(--sub-color4); transform:scale(.95); }
.item a .titlearea{ position:relative; padding:1em 2em 1em 1em; }
.item a .titlearea::after{ display:block; content:""; position:absolute; top:50%; right:1em; transform:translateY(-50%) rotate(45deg); width:.5em; height:.5em; border-top:2px solid var(--main-color1); border-right:2px solid var(--main-color1); z-index:1; transition:all .3s ease; }
.item a:hover .titlearea::after{ right:.5em; }
.item a .titlearea .date{ font-size:.9em; color:var(--sub-color2); margin:0; }
.item a .titlearea .title{ font-size:1.125em !important; margin:0; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2;
    color:transparent; text-decoration:none; background:linear-gradient(to right, var(--main-color1) 50%, var(--sub-color1) 50%) 100%; background-clip:text; background-size:200% 100%; transition:background-position .5s; }
.item a:hover .titlearea .title{ background-position:0 100%; }
.item a .img-cover{ width:100px; aspect-ratio:1; transition:all .3s ease; background:rgba(0,0,255,.1); }
.item a:hover .img-cover{ box-shadow:rgba(100, 100, 100, 0.2) 0px 7px 29px 0px; }
/* 通常 */
:where(.item.information, .item.news) a{ align-items:center; }
:where(.item.information, .item.news) a .titlearea{ width:calc(100% - 100px); }
/* Partner */
.item.partner{ margin:0 0 1em; }
.item.partner a{ align-items:center; border:1px solid var(--sub-color3); }
.item.partner a::after{ content:''; position:absolute; inset:0; background:linear-gradient(135deg, var(--sub-color3) 50%, var(--sub-color4) 50% 100%); background-size:200% 100%; background-position:75% 50%; z-index:-1; transition:all .3s ease; }
.item.partner a:hover::after{ background-position:25% 50%; }
.item.partner a .titlearea{ width:100%; padding:2em 2em 2em 1em; }
/* Speaker */
.item.speaker a{ flex-direction:column; }
.item.speaker a .img-cover{ width:100%; aspect-ratio:2 / 3; }
.item.speaker a .img-cover .titlename{ position:absolute; left:0; bottom:0; padding:1em; z-index:1; }
.item.speaker a .img-cover .titlename::after{ display:none; }
.item.speaker a .img-cover .titlename .title{ font-size:1.25em !important; }
.item.speaker a .img-cover .titlename .title span{ display:block; line-height:1.2; color:#fff; }
.item.speaker a .img-cover .titlename .title span:first-of-type{ font-size:.8em; margin-bottom:.5em; }
.item.speaker a .img-cover .titlename .title span:last-of-type{ background:var(--sub-color1); padding:.25em 1em; }
.item.speaker a .img-cover .overlay{ position:absolute; inset:0; z-index:-1; transition:all .5s ease; }
.item.speaker a:hover .img-cover .overlay{ background:rgba(0,0,0,.4); }
.item.speaker a .img-cover img{ z-index:-2; }
/* Top Speaker */
.card1 .item a:hover .img-cover{ box-shadow:rgba(0, 0, 0, 0.5) 0px 7px 29px 0px; }
.card1 .item.speaker a .img-cover .titlename .title span:first-of-type{ font-size:.75em; }
@media screen and (min-width:480px) and (max-width:767px) {
    .item.speaker,
    .item.partner{ width:48%; }
    .item.speaker:nth-of-type(2n),
    .item.partner:nth-of-type(2n){ margin-left:4%; }
    .card1 .item.speaker:nth-of-type(2n){ margin:0; }
    .item.information a .img-cover,
    .item.news a .img-cover{ width:120px; }
    .item.information a .titlearea,
    .item.news a .titlearea{ width:calc(100% - 120px); }
}
@media screen and (min-width:768px) {
    .item.partner{ width:23.5%; }
    .item.partner:not(:nth-of-type(4n+1)){ margin-left:2%; }
    .item.speaker{ width:32%; }
    .item.speaker:not(:nth-of-type(3n+1)){ margin-left:2%; }
    .card1 .item.speaker:not(:nth-of-type(3n+1)){ margin:0; }
    .item.information,
    .item.news{ width:48%; }
    .item.information:nth-of-type(2n),
    .item.news:nth-of-type(2n){ margin-left:4%; }
}
@media screen and (min-width:1280px) {
    .item.information a .img-cover,
    .item.news a .img-cover{ width:120px; }
    .item.information a .titlearea,
    .item.news a .titlearea{ width:calc(100% - 120px); }
}

/* splide */
.splide{ z-index:0; }
.splide__pagination{ font-size:0; }
/* 前へ / 次へボタン */
.splide__arrow--prev, .splide__arrow--next{ display:grid; place-content:center; width:50px; height:50px; margin:0 .125rem; cursor:pointer; background:var(--sub-color1); border-radius:50%; border:none; transition:all .3s ease; }
.splide__arrow--prev:hover, .splide__arrow--next:hover{ background:var(--main-color2); }
.splide__arrow--prev::after, .splide__arrow--next::after{ width:1rem; height:1rem; content:""; border:2px solid #fff; border-width:2px 2px 0 0; }
.splide__arrow--prev::after{ margin-left:.4rem; transform:rotate(-135deg); }
.splide__arrow--next::after{ margin-right:.4rem; transform:rotate(45deg); }
.splide__arrow>svg{ display:none; }
.splide__arrow:disabled{ pointer-events:none; opacity:0; }
.splide__arrow:focus-visible{ outline:3px solid var(--main-color2); outline-offset:3px; z-index:1; transition:none; }
.splide__pagination__page{ border:none; }
.splide__pagination__page:focus-visible{ outline:3px solid var(--main-color2); outline-offset:3px; z-index:1; transition:none; }
.splide__slide:focus-visible{ outline:3px solid var(--main-color2); outline-offset:3px; z-index:1; transition:none; }
/* firefoxちらつき防止（クロームも） */
@-moz-document url-prefix(){
    .slide{ outline:1px solid transparent; border:1px solid rgba(255,255,255,.1); }
}
.splide-wrapper{ position:relative; }
.card{ overflow:hidden; }
.card .splide{ position:relative; }
.card .splide .splide__arrows{ position:absolute; top:0; right:0; display:flex; }
.card .splide__track{ overflow:visible; }
.card .splide__slide{ display:block; width:max-content; transition:all .3s ease; }
.card .slide{ overflow:hidden; transition:all .3s ease; }

/* 投稿・固定ページ */
.overlay{ position:absolute; inset:0; background:rgba(0,0,0,.3); z-index:1; }
#page-header{ position:relative; width:100%; padding:0 clamp(1rem, calc(0.292rem + 3.54vw), 3.125rem); overflow:hidden; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; margin-top:clamp(3.75rem, calc(2.917rem + 4.17vw), 6.25rem); }
#page-header .title{ margin-bottom:0; }
#page-header .title span{ display:block; line-height:1.2; }
#page-header .title span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
ul.metatop{ display:flex; flex-wrap:wrap; align-items:center; list-style:none; padding:0; margin:0; color:var(--sub-color5); }
ul.metatop li{ margin:5px .5em 5px 0; display:flex; align-items:center; }
ul.metatop li.single-cat a{ display:inline-block; padding:.125em 1em; border:1px solid var(--sub-color2); color:var(--sub-color2); }
ul.metatop li.single-cat a:hover{ border:1px solid var(--main-color2); color:var(--main-color2); }
#posttitle-area .img-cover{ max-width:800px; aspect-ratio:16 / 9; margin:clamp(3.125rem, calc(2.292rem + 4.17vw), 5.625rem) auto; }
/* Speaker */
.speaker-profile{ position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; }
.speaker-profile .titlearea{ width:100%; }
.speaker-profile .img-cover{ width:100%; max-width:300px; aspect-ratio:2 / 3; margin:0 auto; }
.speaker-profile .title span{ display:block; line-height:1.2; }
.speaker-profile .title span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
.speaker-profile .career{ font-size:1.125em; font-weight:bold; color:var(--sub-color2); }
.speaker-event-info{ font-size:1.125em; font-weight:bold; color:var(--sub-color2); text-align:center; }
/* Partner */
#past-partner h2 span{ display:block; line-height:1.2; color:#fff; }
/* Event_round */
#event-partner h2 span{ color:#fff; }
#event-speaker h2 span,
#event-partner h2 span{ display:block; line-height:1.2; }
#event-speaker h2 span:first-of-type,
#event-partner h2 span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
@media screen and (min-width:768px){
    .speaker-profile .titlearea{ width:60%; }
    .speaker-profile .img-cover{ width:35%; max-width:360px; margin:0; }
}

/* 他斜めライン背景 */
.naname-line,
#archive-blog,
#top-video,
#main-content{ position:relative; overflow:hidden; min-height:500px; }
:where(.naname-line, #archive-blog, #top-video, #main-content)::before{ content:""; position:absolute; background-color:var(--sub-color4); width:500%; height:50vw; /* ラインの太さ */ z-index:-1;
    /* ラインの位置調整 */
    top:0; left:0; transform:rotate(60deg); transform-origin:top left; }
:where(#top-video)::before{ left:auto; right:0; transform-origin:top right; transform:rotate(-60deg); background-color:rgba(100,100,100,.05); z-index:1; }
/* 斜めライン画像 */
:where(#top-program)::before{ background-color:transparent; width:150%; }
/* 背景濃いグレー */
#event-partner,
#past-partner{ background:rgba(34,34,34,.9); }
#top-speaker{ background:rgba(34,34,34,1); }

/* TOPページ */
#venue-fixed-bg{ display:none; position:fixed; left:0; bottom:0; z-index:-1; }
.home #page-header{ height:calc(100vh - clamp(3.75rem, calc(2.917rem + 4.17vw), 6.25rem)); height:calc(calc(var(--vh, 1vh) * 100) - clamp(3.75rem, calc(2.917rem + 4.17vw), 6.25rem)); align-items:stretch; background:#fff; }
.home #page-header .catch span{ display:block; }
.home #page-header .catch span:last-of-type{ font-size:.65em; }
.home #page-header .linkbutton:first-of-type{ margin-top:2em; }
.home #page-header .linkbutton a{ width:240px; margin:0; }
.titletext{ display:flex; justify-content:space-between; z-index:2; }
#eventinfo{ position:relative; margin:0 0 0 auto; }
#eventinfo p{ margin:0; line-height:1.4; font-weight:bold; }
.date-box{ position:relative; display:flex; flex-direction:column; align-items:flex-start; }
.date-box .year{ font-size:3.5em; line-height:1 !important; margin-bottom:5px !important; }
.date-box .dateother{ text-align:right; padding-right:1em; border-right:1px solid var(--sub-color1); }
.date-box .month-day{ display:inline-block; font-size:5em; line-height:1; }
.date-box .day-of-week{ display:inline-block; font-size:2em; margin-top:3px; }
.date-box .time{ display:inline-block; font-size:1.2em; margin-top:3px; }
.date-box .event-title{ position:absolute; top:.25em; right:0; font-size:1.35em; letter-spacing:.1em;
    writing-mode:vertical-rl; text-orientation:mixed;
    padding-left:1em;
    height:100%; /* 縦幅を親要素に合わせる */
    background-color:inherit; /* 背景色を日付ボックスと同じ高さにする */
}
.locationbox{ display:flex; align-items:center; margin-top:1em; }
.locationbox .locationtext{ font-size:.9em; letter-spacing:-.05em; }
/* TOP Video メッセージ */
#top-video{ background:var(--sub-color4); z-index:2; }
#top-video h2 span{ display:block; line-height:1.2; }
#top-video h2 span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
#top-video > div{ display:flex; flex-wrap:wrap; justify-content:space-between; }
#top-video > div > div{ position:relative; width:100%; }
.video-card{ position:relative; width:100%; aspect-ratio:16 / 9; overflow:hidden; z-index:1; cursor:pointer; transition:all .3s ease; }
.video-card:hover{ transform:translateY(-.5em); box-shadow:rgba(100, 100, 100, 0.2) 0px 7px 29px 0px; }
.video-card img{ position:absolute; left:0; top:0; width:100%; height:auto; z-index:-2; }
.video-card .card-title{ position:absolute; left:1em; bottom:0; background:var(--sub-color1); color:#fff; padding:.25em 1em; font-weight:bold; z-index:-1; }
.video-card .icon-color{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index:0; }
#top-video blockquote{ margin-inline-start:0; margin-inline-end:0; font-weight:bold; }
/* TOP About */
#top-about{ background:#fff; z-index:2; }
#top-about .inner2 > div{ display:flex; flex-wrap:wrap; }
#top-about h2 span{ display:block; line-height:1.2; }
#top-about h2 span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
#top-about h2 span:nth-of-type(2){ font-size:2em; }
#top-about .inner2 > div p{ font-size:1.125em; font-weight:bold; line-height:3; }
/* TOP Program */
#top-program{ background:rgba(255,255,255,.5); z-index:2; }
#top-program h2 span{ display:block; line-height:1.2; }
#top-program h2 span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
.program-content{ position:relative; display:flex; flex-wrap:wrap; z-index:1; }
/* TOP Speaker */
#top-speaker{ z-index:2; }
#top-speaker h2 span{ display:block; line-height:1.2; color:#fff; }
#top-speaker h2 span:first-of-type{ font-size:.55em; margin-bottom:.5em; }
.card1 .splide__list,
.card1 .splide__slide,
.card1 .slide{ position:relative; width:100%; height:100%; }
.card1 .splide-wrapper{ width:80%; margin:0 auto; }
.card1 .splide__slide.is-active{ transform:translateY(-.5em); }
.card1 .splide .splide__arrows{ top:-80px; }
.card1 .splide .splide__pagination{ display:none; }
/* TOP linkbuttonの装飾 */
#top-program .linkbutton{ margin:1em auto; }
#top-program .linkbutton:first-of-type{ margin-top:1em; }
#top-program .linkbutton:last-of-type{ margin-bottom:0; }
@media screen and (max-width:479px) {
    #top-about .inner2 > div p br{ display:none; }
}
@media screen and (max-width:767px) {
    .titletext{ flex-direction:column; padding:clamp(3.125rem, calc(1.534rem + 7.95vw), 7.5rem) 0; width:100%; }
    #top-video > div > div:first-of-type{ margin:0 0 3em; }
}
@media screen and (min-width:480px) {
    .card1 .splide-wrapper{ width:60%; }
    .video-card .card-title{ bottom:1em; }
}
@media screen and (min-width:768px) {
    #venue-fixed-bg{ width:60%; height:auto; }
    #venue-fixed-bg.scrolled{ display:block; }
    .home #page-header{ height:calc(100vh - clamp(3.75rem, calc(2.917rem + 4.17vw), 6.25rem)); height:calc(calc(var(--vh, 1vh) * 100) - clamp(3.75rem, calc(2.917rem + 4.17vw), 6.25rem)); }
    .titletext{ position:absolute; left:clamp(1rem, calc(0.292rem + 3.54vw), 3.125rem); top:50%; transform:translateY(-50%); width:calc(100% - calc(clamp(1rem, calc(0.292rem + 3.54vw), 3.125rem) * 2));  flex-wrap:wrap; align-items:center; }
    #top-video > div > div{ width:48%; }
    #top-about .inner2 > div > *{ width:50%; }
    .program-content{ border-top:1px solid var(--sub-color3); border-bottom:1px solid var(--sub-color3); }
    .program-content > h2{ width:40%; }
    .program-content > dl{ width:60%; }
    .card1 .splide-wrapper{ width:100%; }
    .card1 .splide__slide.is-active{ transform:none; }
}
@media screen and (min-width:900px) {
    #venue-fixed-bg{ width:auto; max-height:100%; }
}
@media screen and (min-width:1280px) {
    #page-header{ padding:0 clamp(3.125rem, calc(-9.375rem + 15.63vw), 6.25rem); }
    .home #page-header{ height:auto; aspect-ratio:16 / 9; max-height:calc(100vh - 100px); max-height:calc(calc(var(--vh, 1vh) * 100) - 100px); }
    .titletext{ left:clamp(3.125rem, calc(-9.375rem + 15.63vw), 6.25rem); width:calc(100% - calc(clamp(3.125rem, calc(-9.375rem + 15.63vw), 6.25rem) * 2)); }
    .home #page-header .catch span:not(:last-of-type){ display:inline-block; }
    .home #page-header .catch span:first-of-type{ margin-right:.25em; }
}

/* 動画モーダル */
.modal-wrapper{ position:fixed; top:0; left:0; width:100%; height:100%;
    display:flex; justify-content:center; align-items:center;
    background:rgba(34,34,34,.9); z-index:1000;
    /* JSで表示/非表示 */
    opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; }
.modal-wrapper.is-active{ opacity:1; visibility:visible; }
.modal-content{ max-width:1280px; /*padding:clamp(1rem, calc(0.708rem + 1.46vw), 1.875rem);*/ text-align:right; position:relative; transform:scale(.95); transition:transform .3s; }
.is-active .modal-content{
    transform:scale(1); /* 開いたときに少し拡大するアニメーション */
}
.modal-close-button{ width:50px; aspect-ratio:1; border:0; background:none; cursor:pointer; }
.video-container{ cursor:pointer; }