:root {
     --container-max: 1280px;
     --about-max: var(--container-max);
     --gap-x: 40px;
     --gap-y: 12px;
     --row-min: 120px;
     --label-w: 120px;
     --blue: #004bff;
     --card: #f2f4f7;
}
/* Base */
 body {
     margin: 0;
     font-family: 'Noto Sans JP', sans-serif;
     text-align: center;
     background-color: #004bff;
     color: white;
     font-size: 20px;
}
 html {
     scroll-behavior: smooth;
}
 header {
     position: fixed;
     top: 0;
     width: 100%;
     z-index: 1000;
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 10px 0;
     height: 80px;
     background: linear-gradient(to bottom, #01206d, #004cff00);
     box-sizing: border-box;
}
 main {
     padding-top: 80px;
     min-height: calc(100vh - 300px);
}
 .logo {
     max-width: 165px;
     height: auto;
     margin-left: 40px;
}
 .fixed-button {
     position: fixed;
     top: 20px;
     right: 20px;
     background-color: #23EBFF;
     color: #000000;
     border: none;
     border-radius: 32px;
     cursor: pointer;
     width: 180px;
     height: 48px;
     font-weight: bold;
     display: inline-block;
     text-decoration: none;
     text-align: center;
     line-height: 48px;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
     transition: background-color 0.3s, transform 0.3s;
     z-index: 2000;
}
 .fixed-button:hover {
     transform: translateY(-2px);
     background-color: #23EBFF;
}
 #entry-button {
     background-color: #ff4632;
     color: #012a8b;
     border: none;
     border-radius: 32px;
     cursor: pointer;
     width: 240px;
     height: 48px;
     font-weight: bold;
     margin: 40px;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
     transition: background-color 0.3s, transform 0.3s;
}
 #entry-button:hover {
     transform: translateY(-2px);
     box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15), 0 2px 4px rgba(0, 0, 0, 0.12);
}
 .arrow img {
     display: none;
}
/* MV */
 .mv-container {
     margin-left: 10%;
     position: relative;
}
 .custom-image {
     position: absolute;
     width: 100%;
     height: auto;
     display: block;
     margin: 0 auto;
}
 .custom-image.image1 {
     position: absolute;
     width: 100%;
     height: auto;
     top: 45%;
     right: 0%;
     max-width: 787px;
     z-index: -1;
}
 .image2 {
     top: 10%;
     right: 15%;
     height: 465px;
     width: 67px;
     z-index: -1;
}
 .image3 {
     top: 120%;
     left: 0%;
     height: auto;
     width: 60px;
     z-index: -1;
}
 .image4 {
     width: 320px;
     left: 50%;
     transform: translate(-50%, -50%);
     z-index: -1;
}
 .image5 {
     width: 620px;
     right: 0;
     z-index: -1;
}
 .intro {
     padding: 20px;
     text-align: left;
}
 .intro h1 {
     font-size: 32px;
     font-weight: 500;
}
 .event-logo {
     width: 100%;
     max-width: 660px;
     height: auto;
     display: block;
     margin: 0;
}
 .event-info {
     margin-top: 20px;
}
 .info-box {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     gap: 10px;
}
 .date-box, .location-box {
     background-color: #fff;
     display: flex;
     padding: 5px 10px;
     font-size: 26px;
     font-weight: 900;
     text-align: left;
}
 .date-label, .location-label {
     color: #004BFF;
     margin-right: 5px;
}
 .date-time, .location-name {
     color: #231815;
     margin: 0;
}
 .special-guest-container {
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 20px 0;
}
 .special-guest-icon {
     margin: 0 10px;
}
 .special-guest h2 {
     font-family: 'Roboto', sans-serif;
     font-size: 74px;
     font-weight: 900;
     color: #8C3CFF;
     text-shadow: -1px -1px 0 #2EEBC6, 1px -1px 0 #2EEBC6, -1px 1px 0 #2EEBC6, 1px 1px 0 #2EEBC6;
     margin: 5px 0 0 0;
     text-align: center;
}
 .guest-profiles {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     margin-top: 20px;
     list-style-type: none;
     padding: 0;
}
 .company-name-1, .company-name-2 {
     font-size: 30px;
     font-weight: bold;
     display: inline-block;
     padding: 5px;
     border: 2px solid #ff4632;
     color: white;
}
 .company-name-1 {
     margin-bottom: 3px;
}
 .profile:nth-child(2) .company-name-1, .profile:nth-child(2) .company-name-2 {
     border-color: #2eebc6;
}
 .company-name {
     text-align: left;
     list-style-type: none;
}
 .sg-job-title {
     font-size: 18px;
     margin: 0;
     color: white;
     display: block;
}
 .sg-guest-name {
     font-size: 26px;
     font-weight: 900;
     margin: 0;
     color: white;
     display: block;
}
 .profile {
     text-align: center;
     color: #fff;
     width: 260px;
}
 .sg-profile-info {
     margin-left: 70px;
     position: relative;
     top: -30px;
}
 .profile h3 {
     text-align: left;
     font-size: 32px;
     color: #fff;
     padding: 5px;
     margin-bottom: 10px;
}
 .profile:nth-child(2) h3 {
     border-color: #2eebc6;
}
 .profile-image {
     width: 168px;
     height: 168px;
     border-radius: 50%;
     margin: 10px 0;
     overflow: hidden;
}
 .profile-img {
     width: 100%;
     height: 100%;
     display: block;
}
 .profile:nth-child(1) .profile-image {
     box-shadow: -10px 10px 0px 0px #ff4632;
     background-color: #fff;
     margin-left: auto;
}
 .profile:nth-child(2) .profile-image {
     box-shadow: -10px 10px 0px 0px #2eebc6;
     background-color: #fff;
     margin-left: auto;
}
 .profile:nth-child(3) .profile-image {
     box-shadow: -10px 10px 0px 0px #ff4632;
     background-color: #fff;
     margin-left: auto;
}
 .profile p {
     font-size: 18px;
     color: #fff;
     margin: 0;
}
 .visually-hidden {
     position: absolute;
     width: 1px;
     height: 1px;
     margin: -1px;
     padding: 0;
     overflow: hidden;
     clip: rect(0, 0, 0, 0);
     border: 0;
}
/* Theme */
 .theme-wrapper {
     width: 95%;
     max-width: var(--container-max);
     margin: 0 auto;
}
 .theme {
     background-color: rgba(255, 255, 255, 0.7);
     margin: 3px auto;
     padding: 10px 20px;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
     border-radius: 40px 40px 0 0;
     backdrop-filter: blur(5px);
     overflow: hidden;
}
 .theme-title, .organizer-title {
     font-family: 'Roboto';
     font-weight: 600;
     font-size: 36px;
     color: #004bff;
     margin-bottom: 20px;
     text-align: left;
}
 .theme-description {
     font-size: 18px;
     color: #000;
     line-height: 1.5;
     text-align: left;
}
 .banner {
     text-align: center;
}
 .banner-img {
     width: 100%;
     max-width: inherit;
     display: block;
     margin: 0 auto;
}
 .organizer-section {
     display: flex;
     align-items: center;
     margin-bottom: 20px;
}
 .organizer-logo {
     width: 100%;
     max-width: 290px;
     height: auto;
     display: block;
     margin: 0 40px;
}
 .theme-content {
     margin: 0 20px;
}
/* AfterParty */
 .AfterParty-bg {
     background-color: #004bff;
     background-image: url("image/20250814-184026.webp");
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     position: relative;
     padding: 48px 0;
}
 .AfterParty-bg::before {
     content: "";
     position: absolute;
     inset: 0;
     background: rgba(0, 51, 204, 0.15);
     pointer-events: none;
}
 .AfterParty-wrapper {
     width: min(90%, var(--container-max));
     margin: 0 auto;
}
 .AfterParty {
     position: relative;
     background: rgba(255, 255, 255, 0.72);
     backdrop-filter: blur(6px);
     -webkit-backdrop-filter: blur(6px);
     border-radius: 40px 40px 0 0;
     box-shadow: 0 0 10px rgba(0,0,0,0.1);
     padding: clamp(24px, 4vw, 48px) clamp(16px, 3vw, 32px);
     overflow: hidden;
}
 .AfterParty-title {
     font-family: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
     font-weight: 700;
     font-size: clamp(30px, 4vw, 38px);
     color: #004bff;
     margin: 0 0 16px;
     text-align: left;
}
 .AfterParty-description {
     font-size: clamp(16px, 1.8vw, 18px);
     color: #000;
     line-height: 1.7;
     text-align: left;
     margin: 0 0 24px;
}
 .ap_organizer-logo {
     width: min(100%, 420px);
     height: auto;
     display: block;
     margin: 40px 40px 0 40px;
}
/* Schedule */
 .schedule-section {
     position: relative;
     background-color: #fff;
     width: 100%;
     padding: 20px 0;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
     margin-top: 30px;
}
 .bg-shape {
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
     max-width: 850px;
     height: auto;
     z-index: 0;
     object-fit: cover;
     max-height: 100%;
     object-position: bottom;
}
 .schedule-header {
     background-color: #004bff;
     color: #fff;
     width: 100%;
     max-width: var(--container-max);
     height: 104px;
     display: flex;
     align-items: center;
     justify-content: flex-start;
     margin: 0 auto;
     border-radius: 0 40px 0 0;
     position: relative;
     z-index: 1;
}
 .schedule-image {
     margin-left: auto;
     margin-right: 30px;
}
 .schedule-note {
     position: relative;
     z-index: 1;
     margin: 20px auto 0;
     padding: 12px 16px;
     border-radius: 8px;
     background: rgba(255,255,255,0.9);
     font-size: clamp(14px, 1.6vw, 18px);
     line-height: 1.8;
     color: #334155;
     text-align: left;
     max-width: var(--container-max);
}
 .schedule-title {
     font-family: 'Roboto';
     font-size: 52px;
     margin: 0 20px;
     text-align: left;
}
 .schedule-subtitle {
     font-size: 32px;
     text-align: left;
}
 .schedule-content {
     position: relative;
     z-index: 1;
     display: flex;
     flex-wrap: wrap;
     width: 100%;
     max-width: var(--container-max);
     margin: auto;
     gap: 20px;
     margin-top: 20px;
     background-color: rgba(255, 255, 255, 0.7);
     backdrop-filter: blur(3px);
}
 .schedule-column {
     flex: 1;
     display: flex;
     flex-direction: column;
}
 .schedule-column dl {
     border-left: 7px solid rgba(0, 75, 255, 0.4);
     margin: 0;
     padding: 0 20px;
     display: grid;
     grid-template-columns: 160px 1fr;
     column-gap: 18px;
     row-gap: 14px;
     grid-auto-rows: 200px;
}
 .schedule-column dl dt, .schedule-column dl dd {
     margin: 0;
     padding: 8px 0;
}
 .schedule-time {
     font-size: 26px;
     font-weight: bold;
     color: #004bff;
     text-align: left;
     width: auto;
     padding-left: 8px;
     white-space: nowrap;
}
 .schedule-info {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     gap: 6px;
     min-height: 88px;
     text-align: left;
     min-width: 0;
}
 .schedule-info > * {
     margin: 0;
     padding: 0;
     text-indent: 0;
}
 .schedule-detail {
     font-size: 26px;
     font-weight: 900;
     color: #000;
}
 .schedule-detail-sub {
     font-size: 18px;
     font-weight: 900;
     color: #000;
     line-height: 1.4;
}
 .schedule-speaker {
     font-size: 16px;
     color: #004BFF;
     gap: 2px;
     line-height: 1.5;
}
 .schedule-speaker .company {
     font-size: 16px;
     color: #004BFF;
     font-weight: bold;
     margin-bottom: 2px;
}
 .schedule-speaker .name {
     font-weight: normal;
}
 .schedule-time.is-break, .schedule-detail.is-break {
     background: rgba(255, 223, 186, 0.45);
     border-radius: 8px;
     padding: 8px 12px;
}
 .schedule-info.is-break .schedule-detail {
     color: #000;
}
 .schedule-time.is-break {
     color: #0a45ff;
}
 .schedule-info.is-break .schedule-detail::before {
     content: "☕ ";
     font-size: 18px;
}
/* Speakers */
 .speakers {
     position: relative;
     background-color: #0F1B36;
     overflow: hidden;
     padding-bottom: 60px;
}
 .speakers::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-image: url('image/bg-decoration07.webp');
     background-size: cover;
     background-position: center;
     opacity: 0.1;
     z-index: 1;
     pointer-events: none;
}
 .speakers-title-wrapper {
     text-align: left;
}
 .speakers-title {
     font-family: 'Roboto';
     font-size: 52px;
     font-weight: bold;
     color: #f2f2f2;
     max-width: var(--container-max);
     margin: 30px auto;
}
 .subtitle {
     font-size: 32px;
     margin-left: 20px;
     font-weight: normal;
     font-family: 'Noto Sans JP';
}
 .speaker-container {
     width: 95%;
     max-width: var(--container-max);
     margin: 0 auto;
     display: flex;
     flex-wrap: wrap;
     gap: 30px;
     justify-content: space-between;
     box-sizing: border-box;
}
 .speaker-profile {
     max-width: none;
     width: auto;
     flex: 0 1 calc((100% - 30px) / 2);
     box-sizing: border-box;
     position: relative;
     z-index: 2;
     border-radius: 10px;
     overflow: hidden;
     margin-bottom: 20px;
     color: white;
     text-align: left;
     justify-self: start;
     background-color: rgba(255, 253, 253, 0.096);
     padding: 16px;
}
 .profile-header {
     display: flex;
     align-items: center;
}
 .profile-photo {
     width: 120px;
     height: 120px;
     margin-right: 20px;
     position: relative;
     border-radius: 50%;
     filter: drop-shadow(5px 5px 0 #8C3CFF);
}
 .profile-mask {
     position: relative;
     width: 120px;
     height: 120px;
     overflow: hidden;
}
 .profile-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     mask-image: url('image/profile-outline-b.svg');
     -webkit-mask-image: url('image/profile-outline-b.svg');
     mask-size: cover;
     -webkit-mask-size: cover;
     mask-repeat: no-repeat;
     -webkit-mask-repeat: no-repeat;
}
 .mask-img {
     display: none;
}
 .profile-info {
     display: flex;
     flex-direction: column;
}
 .company-name {
     font-size: 18px;
     font-weight: 900;
     color: #fff;
     background-color: #004bff;
     padding: 5px;
     margin-bottom: 5px;
     display: inline-block;
}
 .job-title {
     font-size: 18px;
     font-weight: 900;
     margin: 0;
     color: white;
}
 .guest-name {
     font-size: 32px;
     margin: 0;
     color: white;
}
 .description {
     font-size: 18px;
     margin-top: 10px;
     color: white;
}
 .speakers-decoration {
     width: 100%;
}
 .image6 {
     position: absolute;
     top: 90%;
     right: 40%;
     z-index: 0;
}
/* About */
 .about {
     background: #f5f5f5;
     padding: 10px 0 40px;
}
 .about-title {
     max-width: var(--about-max);
     margin: 30px auto;
     text-align: left;
     font: 800 50px/1 "Roboto", system-ui, sans-serif;
     color: var(--blue);
}
 .about-title .subtitle {
     margin-left: 12px;
     font: 400 32px/1 "Noto Sans JP", sans-serif;
     color: #111;
}
 .about-container {
     max-width: var(--about-max);
     margin: 0 auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: var(--gap-y) var(--gap-x);
     align-items: start;
}
 .about-list {
     margin: 0;
     padding: 0;
     display: grid;
     grid-template-columns: var(--label-w) 1fr;
     grid-auto-rows: minmax(var(--row-min), auto);
     row-gap: var(--gap-y);
     column-gap: 6px;
}
 .about-list dt, .location-list dt {
     background: var(--blue);
     color: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     font: 600 18px/1 "Noto Sans JP", sans-serif;
     border-radius: 2px;
     padding: 6px 6px;
}
 .about-list dd, .location-list .address {
     margin: 0;
     flex: 1;
     display: flex;
     align-items: center;
     text-align: left;
     font: 400 16px/1.6 "Noto Sans JP", sans-serif;
     color: #000;
     background-color: #ddd;
     padding: 6px 0 6px 14px;
     border-radius: 2px;
}
 .location-list {
     margin: 0;
     padding: 0;
     display: grid;
     grid-template-columns: var(--label-w) 1fr;
     grid-auto-rows: minmax(var(--row-min), auto);
     gap: var(--gap-y) var(--gap-x);
     align-items: stretch;
     column-gap: 6px;
}
 .location-list .map-card {
     margin-right: 0;
     grid-column: 1 / -1;
     background: #eef3ff;
     padding: 0;
     border-radius: 14px;
     box-shadow: 0 6px 20px rgba(0,0,0,.08);
     overflow: hidden;
     display: flex;
     flex-direction: column;
}
 .location-list .map-card iframe {
     display: block;
     width: 100%;
     aspect-ratio: 16/9;
     min-height: 420px;
     border: 0;
     background: #eef3ff;
}
 .location-list .map-note {
     text-align: left;
     font: 700 15px/1.8 "Noto Sans JP", sans-serif;
     color: #0a0a0a;
     padding: 0;
}
 .about-decoration {
     grid-column: 1 / -1;
     display: flex;
     justify-content: space-between;
     align-items: flex-end;
     margin-top: 16px;
}
 .image7, .image8 {
     height: auto;
     max-width: 48%;
}
/* Entry form */
 .entry-form .subtitle {
     margin-left: 12px;
     font: 400 32px/1 "Noto Sans JP", sans-serif;
     color: #111;
}
 .form-banner {
     position: relative;
}
 .about-book {
     position: absolute;
     bottom: -40px;
     right: 30px;
     color: #8C3CFF;
     font-size: 18px;
}
 .entry-form {
     background-color: #fff;
     padding: 20px;
}
 .form-container {
     max-width: var(--container-max);
     width: 100%;
     margin: 50px auto;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
     border-radius: 40px;
}
 .banner-container img, .form-banner img {
     width: 100%;
}
 .form-banner img {
     border-radius: 40px 40px 0 0;
}
 .form-group {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin: 20px 40px;
}
 .form {
     width: 95%;
     max-width: var(--container-max);
     margin: 60px auto;
}
 label {
     font-weight: bold;
     margin-right: 10px;
     width: 100px;
     text-align: left;
     color: #000;
}
 .form-container input[type="text"] {
     background-color: #f5f5f5;
     border: 0 solid #ffffff;
     outline: none;
}
 input[type="text"] {
     width: 875px;
     padding: 8px;
     box-sizing: border-box;
     border-radius: 5px;
}
 button[type="submit"] {
     border-radius: 32px;
     width: 240px;
     margin: 30px 0;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
     transition: background-color 0.3s, transform 0.3s;
}
 button {
     background-color: #004bff;
     color: #fff;
     border: none;
     padding: 10px 20px;
     cursor: pointer;
     font-size: 18px;
}
 button:hover {
     background-color: #003bb5;
     box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15), 0 2px 4px rgba(0, 0, 0, 0.12);
}
/* FAQ */
 .faq .about-title, .faq .sub-title, .faq .subtitle {
     color: #fff;
}
 .faq-container {
     width: 95%;
     max-width: var(--container-max);
     margin: 0 auto;
}
 .archive-heading {
     text-align: left;
     font-size: 26px;
     margin-bottom: 20px;
}
 .accordion-item {
     margin-bottom: 10px;
     border-radius: 40px;
}
 button.accordion-button {
     border-radius: 40px;
}
 button.accordion-button.active {
     border-radius: 40px 40px 0 0;
}
 .accordion-button {
     display: flex;
     align-items: center;
     background-color: #f1f1f1;
     border: none;
     cursor: pointer;
     outline: none;
     transition: background-color 0.3s;
     padding: 10px;
     width: 100%;
     text-align: left;
}
 .accordion-button:hover {
     background-color: #ddd;
}
 .accordion-button.active {
     background-color: #f5f5f5;
}
 .accordion-button .text-q {
     color: #4178fe;
     font-size: 36px;
     font-weight: 600;
     margin-left: 50px;
}
 .accordion-button .text-question {
     color: #004BFF;
     font-size: 20px;
     font-weight: 600;
     margin-left: 30px;
}
 .accordion-content {
     display: none;
     background-color: #4178fe;
     padding: 20px 80px;
     color: #fff;
     text-align: left;
     border-radius: 0 0 40px 40px;
     border: 4px solid #f5f5f5;
     max-height: 0;
     overflow: hidden;
     transition: max-height 0.5s ease;
}
 .accordion-content.active {
     display: block;
}
 .accordion-button::after {
     content: url('image/triangle.webp');
     width: 16px;
     height: 16px;
     margin-left: auto;
     margin-right: 30px;
     transform-origin: center;
     display: flex;
     align-items: flex-start;
}
 .accordion-button.active::after {
     transform: rotate(60deg);
}
 .accordion-content .text-a {
     color: #004bff;
     font-size: 26px;
     font-weight: 900;
     margin-right: 10px;
}
 .accordion-content .text-answer, .accordion-content .text-answer a {
     color: #fff;
     font-size: 18px;
     text-align: left;
}
 .banner-container {
     text-align: center;
     max-width: var(--container-max);
     margin: 30px auto;
}
 .banner-container img {
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
     transition: background-color 0.3s, transform 0.3s;
}
 .banner-container img:hover {
     transform: translateY(-2px);
     box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15), 0 2px 4px rgba(0, 0, 0, 0.12);
}
 .faq {
     position: relative;
}
 .faq-bg-shape {
     position: absolute;
     top: 10px;
     left: 0;
     width: 100%;
     max-width: 850px;
     height: auto;
     z-index: -1;
}
 #hubspot-form-container .actions {
     display: flex !important;
     justify-content: center !important;
     width: 100% !important;
}
 #hubspot-form-container p {
     color: #000 !important;
}
/* Footer */
 .footer {
     margin: 0;
     background-color: #0f1b36;
     color: white;
     padding: 30px;
     text-align: center;
}
 .footer-content {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 40px;
}
 .footer-logo img {
     max-width: 260px;
     width: 100%;
}
 .footer-info {
     text-align: left;
}
 .footer-info p {
     margin: 15px 0;
     font-size: 16px;
}
 .footer-info a {
     color: white;
}
 .footer-info a:hover {
     text-decoration: underline;
}
 .footer-copyright {
     font-size: 16px;
}
/* Responsive */
 @media screen and (max-width: 430px) {
     header {
         padding: 5px;
         height: 60px;
    }
     .logo {
         max-width: 167px;
         margin-left: 20px;
    }
     #entry-button {
         width: 132px;
         height: 48px;
         font-size: 18px;
         margin: 0;
         display: flex;
         align-items: center;
    }
     .arrow img {
         display: block;
         width: 18px;
         margin-left: 10px;
    }
     .mv-container {
         margin: 0 auto;
    }
     .intro {
         padding: 0 20px;
    }
     .intro h1 {
         font-size: 26px;
    }
     .image1 {
         width: 100%;
         height: auto;
         top: 120% !important;
         left: 0%;
    }
     .image2 {
         top: 75%;
         right: 0%;
         height: auto;
         width: 40px;
    }
     .image3 {
         top: 101%;
         left: 0%;
         height: auto;
         width: 90px;
         z-index: -1;
    }
     .date-box, .location-box {
         font-size: 18px;
         font-weight: 900;
         padding: 3px;
    }
     dt {
         font-size: 18px;
         font-weight: 900;
    }
     .special-guest-container {
         justify-content: flex-start;
         margin-top: 45%;
         margin-left: 20px;
    }
     .special-guest h2 {
         font-size: 40px;
         text-align: left;
         width: 50%;
    }
     .special-guest .company-name {
         display: block;
         margin-left: 20px;
    }
     .profile {
         max-width: 350px;
         width: 100%;
    }
     .sg-profile-info {
         display: flex;
         flex-direction: row-reverse;
         align-items: center;
         text-align: left;
         margin-left: 55px;
    }
     .profile-image {
         height: auto;
    }
     .profile:nth-child(1) .profile-image {
         box-shadow: -7px 7px 0px 0px #ff4632;
         max-width: 128px;
    }
     .profile:nth-child(2) .profile-image {
         box-shadow: -7px 7px 0px 0px #2eebc6;
         max-width: 128px;
    }
     .profile:nth-child(3) .profile-image {
         box-shadow: -7px 7px 0px 0px #ff4632;
         max-width: 128px;
    }
     .text-container {
         display: flex;
    }
     .sg-job-title {
         font-size: 16px;
    }
     .sg-guest-name {
         font-size: 26px;
         font-weight: 500;
    }
     .guest-profiles {
         display: block;
    }
     .theme-content {
         margin: 0;
    }
     .theme-title, .organizer-title {
         font-size: 25px;
    }
     .theme-description {
         font-size: 18px;
    }
     .organizer-section {
         flex-direction: column;
         align-items: flex-start;
    }
     .banner-img {
         width: 100%;
         max-width: inherit;
    }
     .organizer-logo {
         margin: 0;
    }
     .schedule-header {
         width: 95%;
    }
     .schedule-content {
         width: 95%;
    }
     .schedule-title {
         font-size: 32px;
    }
     .schedule-subtitle {
         font-size: 26px;
         margin-left: 20px;
    }
     .schedule-title-subtitle {
         display: flex;
         flex-direction: column;
         align-items: flex-start;
    }
     .schedule-image {
         width: 77px;
    }
     .schedule-column dl {
         border-left: none;
         margin: 0 !important;
         margin-inline-start: 0 !important;
         padding-left: 0 !important;
    }
     .schedule-time {
         font-size: 18px;
         width: 120px;
    }
     .schedule-detail {
         font-size: 18px;
    }
     .bg-shape {
         width: 100%;
         height: auto;
    }
     .speakers-title {
         font-size: 32px;
         margin-left: 5%;
    }
     .subtitle {
         display: flex;
         font-size: 26px;
         margin-left: 0;
    }
     .speakers-title-wrapper {
         text-align: left;
    }
     .speaker-container {
         flex-direction: column;
         align-items: center;
    }
     .speaker-profile {
         width: 90%;
         max-width: none;
    }
     .company-name {
         font-size: 16px;
    }
     .job-title {
         font-size: 16px;
    }
     .guest-name {
         font-size: 26px;
    }
     .about-title {
         font-size: 32px;
         margin-left: 5%;
    }
     .about-container {
         width: 95%;
         padding: 0;
    }
     .about-item {
         width: 100%;
         margin-bottom: 10px;
    }
     .event-details {
         flex-direction: column;
         align-items: center;
    }
     .event-details dl {
         width: 100%;
    }
     .about dt {
         font-size: 16px;
         width: 96px;
    }
     .about dd {
         font-size: 18px;
    }
     .location-text {
         font-size: 16px;
    }
     .about dd iframe {
         width: 100%;
         height: 280px;
    }
     .image6 {
         display: none;
    }
     .image7 {
         max-width: 100%;
    }
     .image8 {
         display: none;
    }
     .entry-form .subtitle {
         display: block;
    }
     .entry-form .about-title {
         margin: 0;
    }
     .form-container {
         margin: 20px auto;
         width: 100%;
    }
     .form-banner img {
         width: 100%;
         height: auto;
    }
     label {
         width: 100%;
         margin: 0;
    }
     .form-group {
         margin: 20px;
    }
     .accordion-button .text-q {
         font-size: 26px;
         margin-left: 25px;
    }
     .accordion-button .text-question {
         font-size: 18px;
         margin-left: 15px;
    }
     .faq-container {
         width: 95%;
    }
     .accordion-content .text-a {
         font-size: 18px;
    }
     .accordion-content .text-answer {
         font-size: 16px;
    }
     .accordion-content {
         padding: 20px 20px;
    }
     #banner-image {
         width: 100%;
         height: auto;
    }
     .faq-bg-shape {
         width: 100%;
    }
     .footer-logo {
         width: 215px;
    }
     .footer-content {
         flex-direction: column;
         align-items: center;
         gap: 20px;
    }
     .footer-copyright {
         margin-top: 10px;
         font-size: 12px;
    }
}
/* Speakers responsive (tablet and below) */
 @media (max-width: 767px) {
     .speaker-container {
         justify-content: center;
    }
     .speaker-profile {
         flex: 0 1 100%;
    }
}
/* === iPhone SEなど幅430px以下でセクションを中央寄せにする === */
@media screen and (max-width: 430px) {
    /* セクションのコンテナを中央へ */
    .hero-section,
    .banner-section,
    .topics-section,
    .program-section,
    .organizer-section,
    .sponsor-section,
    .join-section,
    .cta-section {
      align-items: center !important; /* 左寄せ指定を上書き */
    }
  
    /* 中身のブロックは幅そのままで中央配置（テキスト揃えは変えない） */
    .hero-content,
    .topics-content,
    .program-content,
    .organizer-content,
    .sponsor-content,
    .join-content,
    .cta-content,
    .program-timeline,
    .topics-cards,
    .sponsor-logos {
      margin-left: auto;
      margin-right: auto;
    }
  
    /* 画像ブロックが左に寄る場合の保険 */
    .hero-visual img,
    .topics-cards img,
    .sponsor-logos img {
      display: block;
      margin-left: auto;
      margin-right: auto;
    }
  }

  /* スマホ幅（430px以下）の場合に左へ寄せる */
@media screen and (max-width: 430px) {
    .fixed-button {
      right: 10px; /* 例: 今より内側に */
      /* 必要に応じて幅を小さくする */
      max-width: 40vw;
    }
  }

  /* スマホでは about-container を 1カラム化 */
@media (max-width: 430px) {
    /* どこかで grid-template-columns: repeat(2, …) 等が効いている想定 */
    .about-container {
      display: grid !important;
      grid-template-columns: 1fr !important; /* 1列 */
      column-gap: 0 !important;
      row-gap: 16px; /* 必要に応じて */
    }
  
    /* location-list を全幅の行に配置 */
    .location-list {
      grid-column: 1 / -1 !important; /* グリッドをまたいで全幅 */
      display: block !important;       /* 内部を縦並びに */
    }
  
    /* 会場ラベルと住所を about-list の dt/dd と同じ“縦並び・全幅”に */
    .location-list > dt,
    .location-list > dd.address {
      display: block !important;
      width: 100% !important;
      margin: 0 0 8px 0 !important;
      text-align: left !important;
    }
  
    /* 地図カードは注意書きと同じく全幅行 */
    .location-list > dd.map-card {
      display: block !important;
      width: 100% !important;
      margin: 12px 0 0 0 !important;
    }
  
    /* iframe は可変で収まるように */
    .location-list > dd.map-card iframe {
      display: block;
      width: 100% !important;
      height: 220px; /* お好みで */
      border: 0;
    }
  }

  @media (max-width: 430px) {
    /* 会場ラベル */
    .location-list > dt {
      display: block;
      width: 100% !important;
      box-sizing: border-box;
      overflow-wrap: break-word; /* 長いテキストを折り返す */
      word-break: break-word;
    }
  
    /* 会場住所 */
    .location-list > dd.address {
      display: block;
      width: 100% !important;
      box-sizing: border-box;
      overflow-wrap: break-word;
      word-break: break-word;
      margin: 0 0 12px 0 !important;
    }
  
    /* pタグも念のため幅調整 */
    .location-list > dd.address p {
      margin: 0;
      width: 100%;
    }
  }

  /* PCはそのまま。スマホ（〜430px）だけ安全に上書き */
@media (max-width: 430px) {

    /* 列ごとに縦積み（1カラム） */
    .schedule-content {
      display: grid;                 /* 念のため */
      grid-template-columns: 1fr;    /* 1列 */
      gap: 16px;                     /* 列間余白（お好みで） */
    }
  
    /* 各列（カラム）内のdlを2カラムの行ベースにする：
       左に時間(dt)、右に内容(dd)  */
    .schedule-column dl {
      display: grid;
      grid-template-columns: 96px 1fr;  /* 時間幅 / 内容幅（必要なら80〜110pxで調整） */
      grid-auto-rows: auto;             /* 行高は中身に合わせる */
      column-gap: 12px;
      row-gap: 12px;
    }
  
    /* 時間（左カラム） */
    .schedule-time {
      margin: 0;
      align-self: start;               /* 上詰め */
      white-space: nowrap;             /* 折り返さない（横幅は左カラムに収める） */
      line-height: 1.2;
    }
  
    /* 内容（右カラム） */
    .schedule-info {
      margin: 0;
      height: auto !important;         /* 固定高さがあれば打ち消す */
      min-width: 0;                    /* はみ出し防止 */
      align-self: start;               /* 上詰め */
      overflow: visible;
    }
  
    /* テキストが長い行の折り返しと行間 */
    .schedule-info,
    .schedule-info * {
      white-space: normal !important;  /* nowrap を打ち消す保険 */
      overflow-wrap: break-word;
      word-break: break-word;
      line-height: 1.5;
    }
  
    /* 画像が入る場合の保険 */
    .schedule-info img {
      max-width: 100%;
      height: auto;
      object-fit: contain;
    }
  }
  @media (max-width: 430px) {

    /* グリッド行の縦位置を「上」に統一 */
    .schedule-column dl {
      align-items: start;              /* これで dt も dd も行の上端で揃う */
    }
  
    /* 時間（左）を上に吸着＆余白差をなくす */
    .schedule-time {
      margin: 0;
      line-height: 1.2;
      display: flex;
      align-items: flex-start;         /* テキストの先頭を上に */
    }
  
    /* 内容（右）も上に吸着。先頭の余白を打消し */
    .schedule-info {
      margin: 0;
      display: flex;                   /* 中身を縦積み */
      flex-direction: column;
      justify-content: flex-start;
    }
    .schedule-info > .schedule-detail {
      margin-top: 0;                   /* もし既定で余白があれば打消し */
    }
  
    /* 視覚的な段差が残る場合の最終微調整（お好みで 0〜2px） */
    /* .schedule-time { padding-top: 1px; } */
  }  

  @media (max-width: 430px) {
    .schedule-time {
      padding: 0 !important;   /* 余白を消す */
      margin: 0 !important;    /* 万が一の外側余白もリセット */
      line-height: 1.4;        /* 読みやすさ確保（必要なら調整） */
      display: block;          /* 確実にブロック表示 */
    }
  
    .schedule-info {
      padding: 0 !important;
      margin-top: 0;           /* detail とのズレを消す */
    }
  }

  .spacer {
    display: block;
    height: 8px;  /* ←ここで縦幅を調整 */
  }
  