@charset "UTF-8";

/* ==========================================================
   スマートフォン用スタイル (max-width: 768px)
========================================================== */
@media screen and (max-width: 768px) {

	body {
		font-size: 1.4rem;
		/* スマホ用サイズ */
	}

	.pc_hide {
		display: block !important;
	}

	.sp_hide {
		display: none !important;
	}

	a:hover,
	a:focus {
		opacity: 1;
	}

	a.tel-link {
		pointer-events: auto;
	}

	/* Container */
	.container {
		padding: 0 15px;
	}

	section {
		padding: 50px 0;
	}

	.section-title {
		font-size: 22px;
		margin-bottom: 25px;
	}

	/* ==========================================================
   グローバルヘッダー
========================================================== */

	.header {
		top: 0;
		z-index: 1000;
	}

	.global-nav {
		display: none;
		/* スマホではハンバーガーメニュー内に移動するため非表示 */
	}

	.main-nav {
		align-items: flex-start;
		width: 80%;
		height: 100vh;
		padding-top: 100px;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		right: -100%;
		transition: 0.4s;
		z-index: 990;
	}

	.main-nav-list {
		flex-direction: column;
	}

	.main-nav-list li {
		width: 100%;
	}

	.main-nav-list li a {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 1.25em 0 1.25em 1.5em;
		box-sizing: border-box;
		border-bottom: 1px solid #fff;
		font-size: 1.5rem;
		position: relative;
	}

	.main-nav-list li a::before {
		content: '';
		background: #fff;
		width: 5px;
		height: auto;
		aspect-ratio: 1 / 1;
		border-radius: 50%;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 5px;
		z-index: 1;
	}

	/* 開いた状態 */
	.main-nav.active {
		flex-direction: column;
		justify-content: flex-start;
		right: 0;
	}

	/* Hamburger Menu - 画面右上に固定表示 */
	.hamburger {
		display: block;
		width: 50px;
		height: auto;
		aspect-ratio: 1 / 1;
		background: var(--orange);
		border-radius: 4px;
		position: fixed;
		top: 10px;
		right: 10px;
		cursor: pointer;
		z-index: 1000;
	}

	.hamburger span {
		display: block;
		width: 38.46%;
		/*50*/
		height: 2px;
		background: var(--white-bg);
		margin: 0 auto;
		position: absolute;
		left: 0;
		right: 0;
		transition: 0.3s;
	}

	.hamburger span:nth-child(1) {
		top: 32.31%;
		/*42*/
	}

	.hamburger span:nth-child(2) {
		top: 50%;
		/*65*/
	}

	.hamburger span:nth-child(3) {
		top: 67.69%;
		/*88*/
	}

	/* 開いたとき */

	.hamburger.active span:nth-child(1) {
		top: 50%;
		transform: rotate(45deg);
	}

	.hamburger.active span:nth-child(2) {
		opacity: 0;
	}

	.hamburger.active span:nth-child(3) {
		top: 50%;
		transform: rotate(-45deg);
	}

	/* Floating Button */
	.floating-btn {
		display: none;
	}

	/* Hero Section */
	.main_container {
		height: auto;
		background: url("../images/bg_sky.webp")no-repeat;
		background-size: cover;
		background-position: center top;
		padding: 0;
	}

	.main_container .main_inner {
		width: 100%;
		max-width: 1200px;
		margin: 0 auto;
		height: 100%;
		position: relative;
	}

	.main_container .main_inner .main_parts01 {
		width: 85.14%;
		/*613*/
		margin: 0 auto;
		padding-top: 25px;
		position: relative;
		top: 0;
		left: 0;
		z-index: 1;
	}

	.main_container .main_inner .main_parts02 {
		width: 80.56%;
		/*580*/
		margin: 1.75rem auto 0;
		position: relative;
		top: 0;
		left: 0;
		z-index: 2;
	}

	.main_container .main_inner .main_parts02 .kaijo_wrap {
		width: 100%;
	}

	.main_container .main_inner .main_parts02 .kaijo_wrap+.kaijo_wrap {
		margin-top: 1.25rem;
	}

	.main_container .main_inner .main_parts03 {
		width: 100%;
		position: absolute;
		bottom: 530px;
		left: 50%;
		transform: translateX(-50%);
		z-index: 1;
	}

	.main_container .main_inner .main_parts04 {
		width: 100%;
		background: #004192;
		padding: 51px 0 27px;
		margin-top: 250px;
		position: relative;
		top: 0;
		left: 0;
		z-index: 2;
	}

	.main_container .main_inner .main_parts04 p.main_txt {
		width: fit-content;
		margin: 0 auto;
		font-size: 1.5rem;
		color: #fff;
		padding-left: 0;
	}

	.main_container .main_inner .main_parts04 p.main_txt::before {
		content: '';
		background: url("../images/main_parts05-new02.svg")no-repeat;
		background-size: 100% auto;
		width: 317px;
		height: auto;
		aspect-ratio: 300 / 65;
		position: absolute;
		top: -1.05rem;
		;
		transform: translateY(-100%);
		left: 0;
		z-index: 1;
	}

	.main_container .main_inner .main_parts04 .flex_area {
		width: 83.33%;
		/*600*/
		flex-direction: column;
		align-items: center;
		margin: 17px auto 0;
	}

	.main_container .main_inner .main_parts04 .flex_area .bnr01 {
		width: 100%;
		/*290*/
	}

	.main_container .main_inner .main_parts04 .flex_area .bnr02 {
		width: 100%;
		/*261*/
		margin-top: 1.65rem;
	}
	


	/* ==========================================================
   イントロダクションセクション
========================================================== */

	section.intro {
		padding: 60px 0 3.35rem;
	}

	.intro .sec_inner {
		width: 83.33%;
		/*600*/
	}

	.intro .sec_inner::before {
		background: url("../images/sp-body_parts01.webp")no-repeat;
		background-size: 100% auto;
		width: 37.0%;
		/*222*/
		aspect-ratio: 222 / 237;
		top: 5px;
		left: -23.67%;
		/*-142*/
	}

	.intro .sec_inner::after {
		content: none;
	}


	.intro .sec_inner .flex_area {
		width: 100%;
		flex-direction: column;
	}

	.intro .sec_inner .flex_area .left_area {
		width: 100%;
		margin-left: 0;
	}

	.intro .sec_inner .flex_area .left_area h2.section-title {
		font-size: 1.9rem;
		line-height: 1.13;
		-webkit-text-stroke: 0.38px var(--primary-blue);
		text-align: center;
	}

	.intro .sec_inner .flex_area .left_area p.intro-lead {
		margin-top: 21px;
		font-size: 1.3rem;
		line-height: 1.27;
		text-align: center;
	}

	.intro-checks {
		width: 100%;
		margin-top: 28px;
	}

	.intro-checks ul {
		padding: 18px 0;
	}

	.intro-checks li {
		padding-left: 12.0%;
		/*72*/
		font-size: 1.4rem;
	}

	.intro-checks li::before {
		width: 4.83%;
		/*29*/
		left: 5.0%;
		/*30*/
	}

	.intro-checks li+li {
		margin-top: 13px;
	}

	.target-text {
		font-size: 1.3rem;
		margin-top: 10px;
		text-align: center;
	}

	.intro .sec_inner .flex_area .right_area {
		display: none;
	}

	.intro-gallery {
		margin-top: 75px;
	}

	.intro-gallery::before {
		width: 21.45%;
		/*197*/
		bottom: 154px;
		transform: translateY(0);
		right: -23.5%;
		/*-141*/
	}

	.intro-gallery::after {
		content: '';
		background: url("../images/sp-body_parts02.webp")no-repeat;
		background-size: 100% auto;
		width: 40.17%;
		/*241*/
		height: auto;
		aspect-ratio: 241 / 227;
		position: absolute;
		bottom: 66px;
		transform: translateY(100%);
		left: -27.33%;
		/*-164*/
		z-index: -1;
	}

	.intro-gallery h3.gallery-title {
		width: 92.17%;
		/*553*/
		height: 32px;
		border-radius: 16px;
		font-size: 1.6rem;
		margin: 0 auto;
		top: 3px;
		transform: translate(0, -100%);
		left: 0;
		right: 0;
	}

	.intro-gallery h3.gallery-title::before {
		width: 4.52%;
		/*25*/
	}

	.gallery-set img {
		height: 175px;
	}

	/* ==========================================================
   イベント詳細 (開催場所・日時)
========================================================== */

	.event-details {
		padding: 3.35rem 0 4.45rem;
	}

	.event-details .sec_inner {
		width: 83.33%;
		/*600*/
	}

	.event-details .sec_inner::before {
		content: none;
	}

	.event-details .sec_inner .section-title {
		width: 100%;
		padding-bottom: 1.55rem;
		border-bottom: 2px solid #0a44a0;
		font-size: 2.0rem;
		-webkit-text-stroke: 0.38px var(--primary-blue);
	}

	.venue-info-wrap {
		width: 100%;
		margin-top: 30px;
		flex-direction: column;
		gap: 40px 0;
	}

	.venue-info {
		width: 100%;
	}

	.venue-info:nth-child(1) {
		margin-left: 0;
	}

	.venue-badge {
		width: 7.67%;
		/*46*/
		height: 8.75rem;
		border-radius: 1.15rem;
		font-size: 1.4rem;
	}

	.venue-info .detail_area {
		width: 91.0%;
		/*546*/
	}

	.venue-info .detail_area .datetime {
		font-size: 1.56em;
		/*25*/
		line-height: 1;
		color: var(--primary-blue);
		align-items: center;
		gap: 7px;
	}

	.venue-info .detail_area .datetime .date {
		flex-shrink: 0;
		font-size: 5.75rem;
		top: 0;
	}

	.venue-info .detail_area .datetime .right {
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 4px 0;
	}

	.venue-info .detail_area .datetime .day {
		font-size: 1.5rem;
		font-weight: 700;
	}

	.venue-info .detail_area .datetime .time {
		font-size: 1.9rem;
		font-weight: 700;
	}

	.venue-info .detail_area .place-name {
		font-size: 1.65rem;
		margin: 1.05rem 0 0 1.94%;
	}

	.venue-info .detail_area .place-address {
		font-size: 1.35rem;
		margin: 7px 0 0 1.94%;
		/*10*/
	}

	.map-placeholder {
		width: 96.67%;
		/*580*/
		margin: 18px auto 0;
	}

	.venue-notes {
		width: 100%;
		margin: 38px auto 0;
	}

	.venue-notes p {
		font-size: 1.3rem;
		line-height: 1.31;
	}

	/* ==========================================================
   参加企業一覧 (タブ切り替え・絞り込みフィルタ)
========================================================== */

	.companies {
		padding: 4.45rem 0;
	}

	.companies .sec_inner {
		width: 83.33%;
		/*600*/
	}

	.companies .sec_inner::before {
		width: 49.5%;
		/*297*/
		top: 8.45rem;
		right: -32.67%;
		/*-196*/
	}

	.companies .sec_inner::after {
		content: none;
	}

	.companies .sec_inner h2.section-title {
		padding-bottom: 1.55rem;
		border-bottom: 2px solid #0a44a0;
		font-size: 2.0rem;
		-webkit-text-stroke: 0.38px var(--primary-blue);
	}

	.companies .sec_inner p {
		margin-top: 25px;
		font-size: 1.4rem;
		line-height: 1.32;
	}

	.tabs {
		flex-direction: column;
		gap: 11px 0;
		margin-top: 31px;
	}

	.tab-btn {
		width: 100%;
		height: 45px;
		border-radius: 3px;
		padding-left: 17.5%;
		/*105*/
		font-size: 1.6rem;
		-webkit-text-stroke: 0.38px var(--primary-blue);
	}

	/* □チェックボックス */
	.tab-btn::before {
		width: 7.5%;
		/*45*/
		border-radius: 3px;
		left: 6.0%;
		/*36*/
	}

	/* ☑チェックマーク */
	.tab-btn.active::after {
		left: calc(6.0% + 1.0%);
	}

	/* アコーディオントグルボタン（SPのみ表示） */
	.filter-toggle {
		display: flex;
		align-items: center;
		width: 100%;
		height: 45px;
		margin-top: 20px;
		border: 1px solid #d1d1d1;
		border-radius: 25px;
		background: #f8f8f8;
		padding: 0 18px;
		box-sizing: border-box;
		font-family: "Noto Sans JP", sans-serif;
		font-weight: 500;
		font-size: 1.3rem;
		line-height: 1;
		color: #333;
		cursor: pointer;
		position: relative;
	}

	/* 左側のフィルターアイコン */
	.filter-toggle::before {
		content: "\25BC";
		font-size: 1.2rem;
		color: #3a8ad4;
		margin-right: 8px;
	}

	.filter-toggle-icon {
		display: inline-block;
		width: 8px;
		height: 8px;
		border-right: 2px solid #999;
		border-bottom: 2px solid #999;
		transform: rotate(45deg);
		transition: transform 0.3s;
		position: absolute;
		right: 18px;
		top: calc(50% - 6px);
	}

	.filter-toggle.is-open .filter-toggle-icon {
		transform: rotate(-135deg);
		top: calc(50% - 2px);
	}

	.filter-wrap {
		width: 100%;
		margin-top: 0;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease;
	}

	.filter-wrap.is-open {
		margin-top: 16px;
		max-height: 500px;
	}

	.filter-list {
		gap: 18px 0;
	}

	.filter-list li {
		width: 47.5%;
		/*285*/
	}

	.filter-list label {
		height: 45px;
		border: 1px solid #d1d1d1;
		border-radius: 3px;
		font-size: 1.3rem;
		padding-left: 21.05%;
		/*60*/
	}

	/* □チェックボックス */
	.filter-list label::before {
		width: 10.53%;
		/*30*/
		border: 1px solid #777777;
		border-radius: 3px;
		left: 7.02%;
		/*20*/
	}

	/* ☑チェックマーク */
	.filter-list label:has(input[type="checkbox"]:checked)::after {
		left: calc(7.02% + 0.75%);
		font-size: 1.15rem;
		-webkit-text-stroke: 0.38px #fff;
	}


	.company-grid {
		margin-top: 25px;
		padding: 0;
		border: none;
		background: none;
		border-radius: 0;
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 1.2rem 0;
	}

	.company-grid::before {
		content: none;
	}

	.company-grid::after {
		content: '';
		background: url("../images/sp-body_parts03.webp")no-repeat;
		background-size: 100% auto;
		width: 48.33%;
		/*290*/
		height: auto;
		aspect-ratio: 290 / 293;
		position: absolute;
		bottom: 8.65rem;
		transform: translateY(100%);
		left: -26.67%;
		/*-160*/
		z-index: -1;
	}

	.company-card {
		display: grid;
		grid-template-columns: 80px 1fr;
		grid-template-rows: auto auto auto;
		gap: 0 12px;
		align-items: start;
		border: 2px solid #ffab4b;
		border-radius: 8px;
		background: #ffdbb2;
		padding: 8px 12px;
		box-sizing: border-box;
	}

	.card-logo {
		grid-row: 1 / 4;
		align-self: start;
	}

	.card-category {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
	}

	.card-name {
		grid-column: 2;
		grid-row: 2;
		align-self: start;
	}

	.company-card:hover {
		opacity: 1;
	}

	.card-logo {
		aspect-ratio: 1 / 1;
		background: #fff;
		border-radius: 4px;
		padding: 4px;
		box-sizing: border-box;
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.card-logo img {
		max-width: 100%;
		max-height: 100%;
		width: auto;
		height: auto;
		object-fit: contain;
	}

	.card-category {
		margin-top: 0;
		width: auto;
	}

	.card-industry {
		padding: 0 8px;
		height: 20px;
		border-radius: 3px;
		font-size: 0.9rem;
		background: #fffae1;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #333333;
	}

	.card-venues {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 4px;
		margin-top: 6px;
	}

	.card-venue {
		background-color: #00a0e9;
		color: #fff;
		padding: 0 6px;
		border-radius: 3px;
		font-size: 0.9rem;
		height: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.card-name {
		margin-top: 4px;
		font-size: 1.25rem;
		line-height: 1.2;
		text-align: left;
	}

	/* ==========================================================
   特典情報
========================================================== */
	.benefits {
		padding: 4.45rem 0 3.15rem;
	}

	.benefits .sec_inner {
		width: 83.33%;
		/*600*/
	}

	.benefits .sec_inner::before {
		content: none;
	}

	.benefits .sec_inner::after {
		width: 46.0%;
		/*276*/
		bottom: 82px;
		right: -26.67%;
		/*-160*/
	}


	.benefits .sec_inner .section-title {
		padding-bottom: 1.55rem;
		border-bottom: 2px solid #0a44a0;
		font-size: 2.0rem;
		line-height: 1.13;
		-webkit-text-stroke: 0.38px var(--primary-blue);
	}

	.benefits .sec_inner p {
		margin-top: 26px;
		font-size: 1.4rem;
		line-height: 1.32;
	}

	.benefits-banners {
		width: 100%;
		margin: 34px auto 0;
	}

	.benefits-banners+.benefits-banners {
		margin-top: 18px;
	}
	
	.benefits-banners button{
		width: 100%;
	}


	.benefits-banners img {
		width: 100%;
		height: auto;
	}

	.benefits-banners+.benefits-banners img {
		width: 102.83%;
		max-width: 102.83%;
		right: 2.83%;
	}

	.benefits-banners img:hover {
		transform: translateY(0);
	}

	/* ==========================================================
   事前予約
========================================================== */

	.pre-registration {
		display: none;
	}


	/* Fixed Bottom Button (SP only) */
	.fixed_btn_wrap {
		width: 100%;
		height: 75px;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 950;
	}

	.fixed_btn_wrap .fixed-booking-btn {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 2px 0;
		width: 83.33%;
		/*600*/
		height: 54px;
		border-radius: 27px;
		background: var(--orange);
		position: relative;
	}

	.fixed-booking-btn .main-text {
		font-family: "BIZ UDGothic", sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 1.9rem;
		line-height: 1;
		letter-spacing: 0.1em;
		color: #fff;
	}

	.fixed-booking-btn .sub-text {
		font-family: "BIZ UDGothic", sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 1.1rem;
		line-height: 1;
		letter-spacing: 0.1em;
		color: #fff;
	}

	.fixed-booking-btn::after {
		content: '';
		background: url("../images/btn_ico.webp")no-repeat;
		background-size: 100% auto;
		width: 6.0%;
		/*36*/
		height: auto;
		aspect-ratio: 36 / 20;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		right: 5.5%;
		/*33*/
		z-index: 1;
	}

	/* ==========================================================
   フッター
========================================================== */

	.footer {
		padding-bottom: 75px;
	}

	.footer .foot_inner {
		padding: 15px 0 2.25rem;
	}

	.footer .foot_inner .foot_area {
		width: 83.33%;
		/*600*/
	}

	.sponsors {
		flex-direction: column;
		gap: 14px 0;
	}

	.sponsor-label {
		width: 18.0%;
		/*108*/
		height: 23px;
		border: 1px solid #fff;
		font-size: 1.5rem;
	}

	.sponsors ul {
		width: 79.33%;
		/*476*/
		margin: 0 auto;
		flex-wrap: wrap;
		justify-content: center;
		gap: 0 4.0%;
		/*24*/
	}

	.sponsors ul li {
		font-size: 1.4rem;
		line-height: 1.43;
		color: #fff;
	}

	.contact-info {
		margin-top: 1.65rem;
	}

	.contact-info p {
		font-size: 1.4rem;
		line-height: 1.43;
	}
	
	.sp_sns_link{
		list-style: none;
		display: flex !important;
		justify-content: center;
		gap: 0 1.5em;
		margin-top: 1.65rem;
	}
	
		.sp_sns_link li{
			width: 12.5%;
	}

	.copyright {
		height: 51px;
	}

	.copyright p {
		font-size: 1.1rem;
	}

	/* ==========================================================
   モーダル (企業詳細画面)
========================================================== */

	.modal-content {
		width: 83.33%;
		/*600*/
		border-radius: 5px;
		padding: 42px 0 3.35rem;
	}

	.modal-close {
		top: 1.45rem;
	}

	.modal-logo {
		border-radius: 3px;
		padding: 13px 0;
	}

	.modal-company-name {
		font-size: 1.4rem;
	}

	.modal-category-wrap {
		margin-top: 12px;
	}

	.modal-category {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 8px;
		border-radius: 3px;
		font-size: 1.2rem;
	}

	.modal-industry {
		width: 100%;
		padding: 0 8px;
		height: 25px; /* height adjusted for better visibility */
		border-radius: 3px;
		font-size: 1.0rem;
		background: #fffae1; /* Re-added background color */
		display: flex;
		justify-content: center;
		align-items: center;
		color: #333333;
	}

	.modal-venues {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 4px;
	}

	.modal-venue {
		background-color: #00a0e9;
		color: #fff;
		padding: 0 6px;
		border-radius: 3px;
		font-size: 0.9rem;
		height: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.modal-info-table {
		margin: 13px auto 0;
	}

	.modal-info-table th,
	.modal-info-table td {
		font-size: 1.2rem;

	}

	.modal-info-table tr+tr {
		padding-top: 12px;
	}

	.modal-action {
		margin: 18px auto 0;
	}

	.modal-action a {
		font-size: 1.5rem;
		height: 50px;
		border-radius: 8px;
	}

	.company-card .card-name br {
		display: none;
	}

	/* 予約選択モーダル（スマホ用） */
	.reservation-modal-content {
		padding: 36px 20px 30px;
		width: 88%;
	}

	.reservation-modal-body {
		gap: 20px;
	}

	.reservation-modal-title {
		font-size: 1.7rem;
	}

	.btn-reservation {
		height: 52px;
		font-size: 1.5rem;
		border-radius: 8px;
	}

	.reservation-btn-wrap {
		gap: 12px;
	}

}