@charset "UTF-8";

/* =========================================================
   Design 04 | Visual / Dynamic
========================================================= */
.kks-webinar04{
  --v04-navy:#55252b;
  --v04-blue:#8b3037;
  --v04-cyan:#c86b52;
  --v04-sky:#ead8cf;
  --v04-cream:#f2eadc;
  --v04-red:#a43e35;
  --v04-text:#342a28;
  --v04-line:#ded2c7;
  overflow:hidden;
  color:var(--v04-text);
  background:#fffaf4;
}
.kks-webinar04 *{box-sizing:border-box}
.kks-webinar04 img{max-width:100%;height:auto}
.kks-webinar04-wide{width:min(1380px,calc(100% - 64px));margin:0 auto}
.kks-webinar04-inner{width:min(1040px,calc(100% - 64px));margin:0 auto}

/* HERO */
.kks-webinar04-hero{position:relative;display:grid;grid-template-columns:44% 56%;min-height:690px;background:var(--v04-navy)}
.kks-webinar04-hero-copy{position:relative;z-index:3;display:flex;align-items:center;padding:80px 6vw;color:#fff;background:linear-gradient(135deg,#55252b 0%,#713238 100%)}
.kks-webinar04-hero-copy::after{position:absolute;top:0;right:-90px;width:180px;height:100%;background:#713238;content:"";clip-path:polygon(0 0,50% 0,100% 100%,50% 100%)}
.kks-webinar04-hero-copy-inner{position:relative;z-index:2;max-width:610px;margin-left:auto}
.kks-webinar04-kicker{margin:0 0 25px;color:var(--v04-cyan);font-size:16px;font-weight:700;letter-spacing:.16em}
.kks-webinar04-subtitle{margin:0 0 17px;font-size:18px;font-weight:700;line-height:1.7}
.kks-webinar04-hero h1{margin:0;font-size:230%;line-height:1.38;color:#fff;letter-spacing:.01em}
.kks-webinar04-catch{margin:28px 0 0;color:#f2e6de;font-size:17px;line-height:1.95}
.kks-webinar04-cta{display:flex;align-items:center;justify-content:space-between;width:min(410px,100%);min-height:68px;margin-top:38px;padding:16px 25px;color:var(--v04-navy)!important;background:#fff;text-decoration:none!important;font-size:17px;font-weight:700;box-shadow:12px 12px 0 rgba(200,107,82,.72);transition:.25s}
.kks-webinar04-cta:hover{transform:translate(3px,3px);box-shadow:7px 7px 0 rgba(200,107,82,.72)}
.kks-webinar04-cta b{font-size:24px}
.kks-webinar04-cta.is-closed{justify-content:center;background:#dce3e7;box-shadow:none;color:#526674!important}
.kks-webinar04-hero-image{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;padding:58px 5vw 58px 8vw;background:#eee5d8}
.kks-webinar04-hero-image::before{position:absolute;top:0;right:0;width:44%;height:100%;background:rgba(255,255,255,.28);content:"";clip-path:polygon(55% 0,100% 0,100% 100%,0 100%)}
.kks-webinar04-hero-image img{position:relative;z-index:2;display:block;width:100%;height:auto;box-shadow:0 25px 60px rgba(85,37,43,.14)}
.kks-webinar04-hero-word{position:absolute;right:-10px;bottom:-42px;z-index:2;color:rgba(85,37,43,.07);font-size:clamp(90px,13vw,190px);font-weight:900;line-height:1;letter-spacing:-.06em;pointer-events:none}

/* INFORMATION */
.kks-webinar04-info{position:relative;z-index:5;background:#fff}
.kks-webinar04-info .kks-webinar04-wide{display:grid;grid-template-columns:1.05fr 1.7fr repeat(3,.75fr);min-height:140px}
.kks-webinar04-info-title,.kks-webinar04-info-date,.kks-webinar04-info-cell{display:flex;flex-direction:column;justify-content:center;padding:24px 28px;border-right:1px solid var(--v04-line)}
.kks-webinar04-info-title{padding-left:0}
.kks-webinar04-info-title span,.kks-webinar04-info-date>.label,.kks-webinar04-info-cell>span{margin-bottom:9px;color:var(--v04-blue);font-size:14px;font-weight:700;letter-spacing:.13em}
.kks-webinar04-info-title strong{font-size:22px}
.kks-webinar04-info-date p{display:flex;align-items:center;gap:10px;margin:2px 0}
.kks-webinar04-info-date p strong{color:var(--v04-navy);font-size:28px}
.kks-webinar04-info-date p small{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;color:#fff;background:var(--v04-blue);border-radius:50%;font-size:13px}
.kks-webinar04-info-date p span{font-size:16px}
.kks-webinar04-info-cell strong{font-size:17px;line-height:1.6}

/* SECTION INDEX */
.kks-webinar04-section-index{padding-top:7px}
.kks-webinar04-section-index span{display:block;color:var(--v04-cyan);font-size:76px;font-weight:800;line-height:1}
.kks-webinar04-section-index p{margin:8px 0 0;color:var(--v04-blue);font-size:15px;font-weight:700;letter-spacing:.13em}
.kks-webinar04-section-index.is-light span{color:#fff}
.kks-webinar04-section-index.is-light p{color:#fff}
.kks-webinar04-section-en,.kks-webinar04-heading>p{margin:0 0 12px;color:var(--v04-blue);font-size:15px;font-weight:700;letter-spacing:.14em}
.kks-webinar04-heading h2{margin:0;color:var(--v04-navy);font-size:38px;line-height:1.45}
.kks-webinar04-heading.is-light>p{color:var(--v04-cyan)}
.kks-webinar04-heading.is-light h2{color:#fff}

/* ABOUT */
.kks-webinar04-about{padding:120px 0 130px;background:#fffaf4}
.kks-webinar04-about .kks-webinar04-wide{display:grid;grid-template-columns:180px minmax(0,1fr);gap:70px}
.kks-webinar04-about-main{max-width:920px}
.kks-webinar04-about-main h2{margin:0 0 40px;color:var(--v04-navy);font-size:42px}
.kks-webinar04-leadtext p{margin:0 0 1.4em;color:#5e514c;font-size:18px;line-height:2.05}
.kks-webinar04-target{display:grid;grid-template-columns:130px 1fr;gap:28px;margin-top:48px;padding:28px 32px;background:var(--v04-cream)}
.kks-webinar04-target span{color:var(--v04-red);font-size:15px;font-weight:800;letter-spacing:.12em}
.kks-webinar04-target p{margin:0;font-size:17px;line-height:1.8}

/* CONTENTS */
.kks-webinar04-contents{position:relative;padding:120px 0 140px;color:#fff;background:linear-gradient(135deg,#6d3438,#4d252a)}
.kks-webinar04-contents::before{position:absolute;top:0;right:-15%;width:55%;height:100%;background:rgba(151,82,70,.22);content:"";clip-path:polygon(35% 0,100% 0,100% 100%,0 100%)}
.kks-webinar04-contents .kks-webinar04-wide{position:relative;z-index:1;display:grid;grid-template-columns:180px 1fr;gap:70px}
.kks-webinar04-content-list{margin-top:55px}
.kks-webinar04-content-list article{position:relative;display:grid;grid-template-columns:130px minmax(0,1fr) 220px;gap:35px;align-items:center;min-height:260px;padding:45px 0;border-top:1px solid rgba(255,255,255,.24)}
.kks-webinar04-content-list article:last-child{border-bottom:1px solid rgba(255,255,255,.24)}
.kks-webinar04-content-list .number{color:var(--v04-cyan);font-size:76px;font-weight:800;line-height:1}
.kks-webinar04-content-list h3{margin:0 0 16px;font-size:25px;color:#fff;line-height:1.55}
.kks-webinar04-content-list .copy p{margin:0 0 1em;color:#d8e4ee;font-size:15px;line-height:1.9}
.kks-webinar04-content-list .graphic{position:relative;height:130px}
.kks-webinar04-content-list .graphic i{position:absolute;display:block;background:rgba(200,107,82,.78)}
.kks-webinar04-content-list .graphic i:nth-child(1){top:15px;left:20px;width:85px;height:85px;border-radius:50%}
.kks-webinar04-content-list .graphic i:nth-child(2){right:12px;bottom:12px;width:105px;height:55px;background:rgba(255,255,255,.12)}
.kks-webinar04-content-list .graphic i:nth-child(3){top:4px;right:35px;width:2px;height:115px;background:#fff;transform:rotate(35deg);opacity:.45}

/* PROGRAM */
.kks-webinar04-program{padding:120px 0 135px;background:#f3eee5}
.kks-webinar04-program .kks-webinar04-wide{display:grid;grid-template-columns:180px 1fr;gap:70px}
.kks-webinar04-program-main .kks-webinar04-heading{margin-bottom:55px}
.kks-webinar04-timeline{position:relative}
.kks-webinar04-timeline::before{position:absolute;top:0;bottom:0;left:180px;width:2px;background:#d8bdb0;content:""}
.kks-webinar04-timeline article{position:relative;display:grid;grid-template-columns:150px 60px 1fr;gap:0;min-height:150px}
.kks-webinar04-timeline .time{padding-top:0px;color:var(--v04-blue);font-size:17px;font-weight:800}
.kks-webinar04-timeline .dot{position:relative}
.kks-webinar04-timeline .dot::before{position:absolute;top:9px;left:24px;width:14px;height:14px;background:var(--v04-cyan);border:5px solid #f3eee5;border-radius:50%;box-shadow:0 0 0 2px var(--v04-cyan);content:""}
.kks-webinar04-timeline .copy{padding:0 0 45px 20px}
.kks-webinar04-timeline .copy>span{color:var(--v04-cyan);font-size:14px;font-weight:800;letter-spacing:.12em}
.kks-webinar04-timeline h3{margin:8px 0 10px;color:var(--v04-navy);font-size:22px}
.kks-webinar04-timeline p{margin:0;color:#74645e;font-size:16px;line-height:1.85}
.kks-webinar04-agenda{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin-top:45px}
.kks-webinar04-agenda article{display:grid;grid-template-columns:55px 1fr;gap:15px;padding:28px;background:#fff}
.kks-webinar04-agenda article>span{color:var(--v04-cyan);font-size:24px;font-weight:800}
.kks-webinar04-agenda h3{margin:0;color:var(--v04-navy);font-size:18px}
.kks-webinar04-agenda p{margin:7px 0 0;color:#786a64;font-size:15px;line-height:1.8}

/* RECOMMENDED */
.kks-webinar04-recommend{position:relative;padding:120px 0 135px;overflow:hidden;color:#fff;background:#8a3a3e}
.kks-webinar04-recommend-shape{position:absolute;top:0;right:0;width:52%;height:100%;background:#55252b;clip-path:polygon(24% 0,100% 0,100% 100%,0 100%)}
.kks-webinar04-recommend-shape::after{position:absolute;right:-70px;bottom:-150px;color:rgba(255,255,255,.045);content:"04";font-size:420px;font-weight:900;line-height:1}
.kks-webinar04-recommend .kks-webinar04-wide{position:relative;z-index:1;display:grid;grid-template-columns:180px 1fr;gap:70px}
.kks-webinar04-recommend-main{max-width:920px}
.kks-webinar04-recommend-main .kks-webinar04-section-en{color:var(--v04-cyan)}
.kks-webinar04-recommend-main h2{margin:0 0 28px;color:#fff;font-size:40px}
.kks-webinar04-recommend-main .lead p{margin:0 0 1em;color:#dfe9f2;font-size:15px;line-height:1.9}
.kks-webinar04-recommend .list{margin-top:38px;border-top:1px solid rgba(255,255,255,.3)}
.kks-webinar04-recommend .list p{display:grid;grid-template-columns:70px 1fr;align-items:center;margin:0;padding:19px 8px;border-bottom:1px solid rgba(255,255,255,.3)}
.kks-webinar04-recommend .list b{color:var(--v04-cyan);font-size:24px}
.kks-webinar04-recommend .list span{font-size:18px;line-height:1.7}

/* SPEAKERS */
.kks-webinar04-speakers{padding:120px 0 140px;background:#fffaf4}
.kks-webinar04-speakers .kks-webinar04-wide{display:grid;grid-template-columns:180px 1fr;gap:70px}
.kks-webinar04-speakers-main>.kks-webinar04-heading{margin-bottom:55px}
.kks-webinar04-speaker-list article{display:grid;grid-template-columns:minmax(300px,.82fr) minmax(0,1.18fr);gap:70px;align-items:center;margin-bottom:90px}
.kks-webinar04-speaker-list article.is-reverse .image{order:2}
.kks-webinar04-speaker-list article.is-reverse .copy{order:1}
.kks-webinar04-speaker-list .image{position:relative}
.kks-webinar04-speaker-list .image::before{position:absolute;right:-18px;bottom:-18px;z-index:0;width:70%;height:75%;background:var(--v04-sky);content:""}
.kks-webinar04-speaker-list .image img{position:relative;z-index:1;display:block;width:100%;height:auto}
.kks-webinar04-speaker-list .image span{position:absolute;right:-12px;top:-42px;z-index:2;color:var(--v04-cyan);font-size:72px;font-weight:900}
.kks-webinar04-speaker-list .speaker-no{margin:0 0 20px;color:var(--v04-blue);font-size:15px;font-weight:800;letter-spacing:.13em}
.kks-webinar04-speaker-list .company,.kks-webinar04-speaker-list .position{margin:0 0 6px;color:#766762;font-size:16px}
.kks-webinar04-speaker-list h3{margin:18px 0 24px;color:var(--v04-navy);font-size:28px;padding-bottom: 10px;border-bottom: solid 1px #ddd}
.kks-webinar04-speaker-list .profile p{margin:0 0 1em;color:#675954;font-size:16px;line-height:1.95}

/* NOTE */
.kks-webinar04-note{padding:48px 0;background:var(--v04-cream)}
.kks-webinar04-note .kks-webinar04-inner{display:grid;grid-template-columns:150px 1fr;gap:30px}
.kks-webinar04-note>div>span{color:var(--v04-red);font-size:15px;font-weight:800;letter-spacing:.12em}
.kks-webinar04-note p{margin:0 0 8px;color:#665f59;font-size:15px;line-height:1.8}

/* FORM */
.kks-webinar04-form{padding:115px 0 130px;background:#f3eee6}
.kks-webinar04-form-title{text-align:center}
.kks-webinar04-form-title>span{display:block;color:var(--v04-cyan);font-size:70px;font-weight:900;line-height:1}
.kks-webinar04-form-title>p{margin:10px 0 7px;color:var(--v04-blue);font-size:15px;font-weight:800;letter-spacing:.15em}
.kks-webinar04-form-title h2{margin:0;color:var(--v04-navy);font-size:38px}
.kks-webinar04-form-inner{width:min(900px,calc(100% - 64px));margin:50px auto 0;padding:0px;background:#fffdf9;box-shadow:0 18px 45px rgba(85,37,43,.08)}

@media screen and (max-width:767px){
  .kks-webinar04-wide,.kks-webinar04-inner,.kks-webinar04-form-inner{width:calc(100% - 30px)}
  .kks-webinar04-hero{display:flex;flex-direction:column;min-height:0}
  .kks-webinar04-hero-copy{padding:55px 20px 62px}
  .kks-webinar04-hero-copy::after{display:none}
  .kks-webinar04-hero-copy-inner{max-width:none;margin:0}
  .kks-webinar04-kicker{font-size:13px}
  .kks-webinar04-subtitle{font-size:16px}
  .kks-webinar04-hero h1{font-size:22px}
  .kks-webinar04-catch{font-size:15px}
  .kks-webinar04-hero-image{padding:35px 20px 50px}
  .kks-webinar04-hero-word{bottom:-12px;font-size:72px}
  .kks-webinar04-info-date p strong{font-size: 20px}
  .kks-webinar04-info .kks-webinar04-wide{grid-template-columns:1fr 1fr 1fr;padding: 32px 0}
  .kks-webinar04-info-title{grid-column:1/-1;padding:22px 0;border-bottom:1px solid var(--v04-line)}
  .kks-webinar04-info-date{grid-column:1/-1;padding-left:0;border-bottom:1px solid var(--v04-line)}
  .kks-webinar04-info-cell{padding:20px 14px}
  .kks-webinar04-about,.kks-webinar04-contents,.kks-webinar04-program,.kks-webinar04-recommend,.kks-webinar04-speakers{padding:75px 0 85px}
  .kks-webinar04-about .kks-webinar04-wide,.kks-webinar04-contents .kks-webinar04-wide,.kks-webinar04-program .kks-webinar04-wide,.kks-webinar04-recommend .kks-webinar04-wide,.kks-webinar04-speakers .kks-webinar04-wide{grid-template-columns:1fr;gap:38px}
  .kks-webinar04-section-index{display:flex;align-items:baseline;gap:15px}
  .kks-webinar04-section-index span{font-size:54px}
  .kks-webinar04-about-main h2,.kks-webinar04-heading h2,.kks-webinar04-recommend-main h2{font-size:29px}
  .kks-webinar04-leadtext p{font-size:15px;line-height:1.9}
  .kks-webinar04-target{grid-template-columns:1fr;gap:8px;padding:22px}
  .kks-webinar04-content-list{margin-top:35px;padding: 0 8px}
  .kks-webinar04-content-list article{grid-template-columns:1fr;gap:18px;min-height:0;padding:32px 0}
  .kks-webinar04-content-list .number{font-size:50px}
  .kks-webinar04-content-list h3{font-size:20px}
  .kks-webinar04-content-list .graphic{display:none}
  .kks-webinar04-timeline::before{left:95px}
  .kks-webinar04-timeline article{grid-template-columns:75px 40px 1fr}
  .kks-webinar04-timeline .time{font-size:16px}
  .kks-webinar04-timeline .dot::before{left:14px}
  .kks-webinar04-timeline .copy{padding-left:10px}
  .kks-webinar04-timeline h3{font-size:18px}
  .kks-webinar04-timeline p{font-size: 13px}
  .kks-webinar04-agenda{grid-template-columns:1fr}
  .kks-webinar04-recommend-shape{width:78%}
  .kks-webinar04-recommend .list p{grid-template-columns:50px 1fr}
  .kks-webinar04-recommend .list span{font-size:16px}
  .kks-webinar04-speaker-list article,.kks-webinar04-speaker-list article.is-reverse{display:flex;flex-direction:column;gap:35px;margin-bottom:70px}
  .kks-webinar04-speaker-list article.is-reverse .image,.kks-webinar04-speaker-list article.is-reverse .copy{order:initial}
  .kks-webinar04-speaker-list .image span{top:-25px;font-size:55px}
  .kks-webinar04-speaker-list h3{font-size:24px}
  .kks-webinar04-speaker-list .profile p{font-size: 15px}
  .kks-webinar04-note .kks-webinar04-inner{grid-template-columns:1fr;gap:12px}
  .kks-webinar04-form{padding:75px 0 85px}
  .kks-webinar04-form-title>span{font-size:55px}
  .kks-webinar04-form-title h2{font-size:29px}
  .kks-webinar04-form-inner{margin-top:35px;padding:25px 18px}
  .kks-webinar-lp .kks-webinar04-form .kks-webinar-form,
  .single-webinar_lp .kks-webinar04-form .kks-webinar-form {
    padding: 0px 0px 36px;
  }
  .kks-webinar-lp .kks-webinar04-form .kks-webinar-form,
  .single-webinar_lp .kks-webinar04-form .kks-webinar-form {
    border: none;
  }
}