#main {
    	max-width: 1000px;
    	margin: 0 auto;
    	padding: 20px;
    }

    #main * {
    	box-sizing: border-box;
    }

    h2 {
    	text-align: center;
    	font-size: 24px;
    	margin-bottom: 30px;
    	color: #555;
    	position: relative;
    	padding-bottom: 15px;
    }

    h2:after {
    	content: '';
    	position: absolute;
    	bottom: 0;
    	left: 50%;
    	transform: translateX(-50%);
    	width: 80px;
    	height: 4px;
    	background: #54917F;
    }

    /* バス情報カード共通スタイル */
    .bus-cards-container {
    	display: flex;
    	flex-wrap: wrap;
    	justify-content: space-between;
    	margin-bottom: 50px;
    }

    .bus-card {
    	width: calc(50% - 10px);
    	border-radius: 10px;
    	overflow: hidden;
    	margin-bottom: 20px;
    	background-color: #fff;
    }

    .bus-card-header {
    	color: white;
    	padding: 8px 20px;
    	text-align: center;
    	font-weight: bold;
    	font-size: 18px;
    	display: flex;
    	align-items: center;
    	justify-content: center;
    }

    .bus-card-header span {
    	font-size: 22px;
    }

    .bus-card-body {
    	background-color: white;
    	padding: 20px;
    }

    /* 新しいレイアウトのスタイル */
    .info-container {
    	display: flex;
    	justify-content: space-between;
    }

    .info-block {
    	flex: 1;
    	width: 60%;
    }

    .bus-image-block {
    	display: flex;
    	flex-direction: column;
    	align-items: center;
    	margin-left: 15px;
    	width: 40%;
    }

    .bus-info-row {
    	display: flex;
    	margin-bottom: 6px;
    	padding-bottom: 4px;
    	align-items: flex-start;
    	border-bottom: 1px solid #E4E4E4;
    }

    .bus-info-label {
    	width: 90px;
    	font-weight: bold;
    	color: #666;
    }

    .bus-info-value {
    	flex: 1;
    }

    .bus-image {
    	margin: 1rem 0 25px;
    	width: 100%;
    	max-width: 280px;
    	height: auto;
    }

    .gurutto-bus .bus-image {
    	width: 70%;
    	max-width: 200px;
    }

    .detail-btn {
    	display: block;
    	background-color: #999;
    	color: white;
    	text-align: center;
    	padding: 8px 15px;
    	border-radius: 20px;
    	text-decoration: none;
    	width: 150px;
    	font-size: 14px;
    	transition: background-color 0.3s;
    }

    .detail-btn:hover {
    	background-color: #777;
    }

    /* 注釈スタイル */
    .note {
    	margin: 0;
    	font-size: 14px;
    	color: #777;
    }

    /* 各カードのヘッダー色とラベル色 */
    .bus-card.city-loop {
    	border: 2px solid #FBA731;
    }

    .bus-card.gurutto-bus {
    	border: 2px solid #a22041;
    }

    .bus-card.route-97-98 {
    	border: 2px solid #907DC2;
    }

    .bus-card.route-77-78 {
    	border: 2px solid #F77542;
    }

    .bus-card.route-163 {
    	border: 2px solid #4F76AC;
    }

    .bus-card.shuttle-bus {
    	border: 2px solid #52B3A8;
    }

    .bus-card.city-loop .bus-card-header {
    	background-color: #FBA731;
    }

    .bus-card.city-loop .bus-info-label {
    	color: #FBA731;
    }

    .bus-card.gurutto-bus .bus-card-header {
    	background-color: #a22041;
    }

    .bus-card.gurutto-bus .bus-info-label {
    	color: #a22041;
    }

    .bus-card.route-163 .bus-card-header {
    	background-color: #4F76AC;
    }

    .bus-card.route-163 .bus-info-label {
    	color: #4F76AC;
    }

    .bus-card.route-97-98 .bus-card-header {
    	background-color: #907DC2;
    }

    .bus-card.route-97-98 .bus-info-label {
    	color: #907DC2;
    }

    .bus-card.route-77-78 .bus-card-header {
    	background-color: #F77542;
    }

    .bus-card.route-77-78 .bus-info-label {
    	color: #F77542;
    }

    .bus-card.shuttle-bus .bus-card-header {
    	background-color: #52B3A8;
    }

    .bus-card.shuttle-bus .bus-info-label {
    	color: #52B3A8;
    }

    /* アクセス方法セクション */
    .access-container {
    	display: flex;
    	flex-wrap: wrap;
    	justify-content: space-between;
    	gap: 20px;
    	margin-bottom: 50px;
    }

    .access-card {
    	width: calc(50% - 10px);
    	background-color: #5F9EA0;
    	border-radius: 10px;
    	overflow: hidden;
    	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    	margin-bottom: 20px;
    	padding: 20px;
    	color: white;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	transition: background-color 0.3s;
    	text-decoration: none;
    	position: relative;
    }

    .access-card:after {
    	content: '';
    	position: absolute;
    	right: 20px;
    	top: 50%;
    	transform: translateY(-50%);
    	width: 10px;
    	height: 10px;
    	border-top: 2px solid white;
    	border-right: 2px solid white;
    	transform: translateY(-50%) rotate(45deg);
    }

    .access-card:hover {
    	background-color: #4f8a8b;
    }

    .access-icon {
    	display: flex;
    	align-items: center;
    }

    .access-icon img {
    	width: auto;
    	height: 40px;
    	margin-right: 15px;
    }

    .access-text {
    	font-size: 18px;
    	font-weight: bold;
    	margin-right: 20px;
    }

    .access-arrow {
    	font-size: 24px;
    }

    /* 全国からのアクセスセクション */
    .nationwide-access {
    	text-align: center;
    	margin: 70px 0;
    }

    .nationwide-access h2 {
    	margin-bottom: 50px;
    }

    .nationwide-access-container {
    	display: flex;
    	justify-content: space-between;
    	gap: 20px;
    }

    .nationwide-card {
    	width: calc(50% - 10px);
    	background-color: #5BA3CF;
    	border-radius: 10px;
    	overflow: hidden;
    	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    	padding: 20px;
    	color: white;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	transition: background-color 0.3s;
    	text-decoration: none;
    	position: relative;
    }

    .nationwide-card:after {
    	content: '';
    	position: absolute;
    	right: 20px;
    	top: 50%;
    	transform: translateY(-50%);
    	width: 10px;
    	height: 10px;
    	border-top: 2px solid white;
    	border-right: 2px solid white;
    	transform: translateY(-50%) rotate(45deg);
    }

    .nationwide-card:hover {
    	background-color: #4a92be;
    }

    /* レスポンシブデザイン */
    @media screen and (max-width: 768px) {
    	.bus-card {
    		width: 100%;
    	}

    	.access-container,
    	.nationwide-access-container {
    		display: block;
    	}

    	.access-card,
    	.nationwide-card {
    		width: 100%;
    		margin-bottom: 20px;
    	}

    	.info-container {

    		flex-direction: column;
    	}

    	.info-block {
    		width: 100%;
    	}

    	.bus-image-block {
    		width: 100%;
    		justify-content: space-between;
    		align-items: center;
    		margin-left: 0;
    		margin-top: 15px;
    	}


    }

    /* バスルートマップセクションのスタイル */
    .route-map-section {
    	margin-bottom: 40px;
    }

    .route-map-container {
    	width: 100%;
    	margin: 60px auto;
    	border-radius: 10px;

    }

    .route-tabs {
    	display: flex;
    	width: 100%;
    	max-width: 820px;
    	gap: 10px;
    	margin: 0 auto;
    }

    .route-tab {
    	flex: 1;
    	font-size: 18px;
    	border-radius: 10px 10px 0 0;
    	text-align: center;
    	padding: 15px 0;
    	font-weight: bold;
    	cursor: pointer;
    	position: relative;
    }

    .route-tab:last-child:hover {
    	opacity: 0.7;
    }

    .route-tab:last-child span {
    	position: relative;
    	padding-right: 20px;
    }

    .route-tab:last-child span:after {
    	content: "";
    	width: 16px;
    	height: 21px;
    	position: absolute;
    	right: 0;
    	top: 3px;
    	background: url("/img/pdf_icon.png") no-repeat;
    }

    .route-tab:first-child {
    	background-color: #a22041;
    	color: white;
    }

    .route-tab:last-child {
    	background-color: ##fff;
    	color: #54917F;
    	border-left: 2px solid #54917F;
    	border-right: 2px solid #54917F;
    	border-top: 2px solid #54917F;
    }

    .route-map-content {
    	border-top: 5px solid #a22041;
    }

    .route-map {
    	width: 100%;
    	height: auto;
    	display: block;
    }

    @media screen and (max-width: 768px) {
    	.route-tab {
    		padding: 10px 0;
    		font-size: 14px;
    	}
    }