@charset "UTF-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■pagetitle
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.pagetitle.is-index {
	text-align: left;
	padding: 0;
	margin-top: 0;
	background-size: cover;
	background-position: center top;
	overflow: hidden;
	height: auto;
	padding: 10px 0;
	margin-bottom: 100px;
	@media only screen and (max-width: 767px) {
		margin-bottom: 70px;
	}
}
.pagetitle.is-index .expo-map-index-h1 {
	text-align: left;
	line-height: 1;
	padding-bottom: 10px;
}
.pagetitle.is-index .expo-map-index-h1 .text-en {
	font-size: clamp(40px, 96px, 9vw);
}
.pagetitle.is-index .expo-map-index-h1 .text-ja {
	font-size: clamp(20px, 24px, 2.5vw);
	color: var(--expo-blue);
	display: block;
	margin-top: 15px;
}
@media only screen and (min-width: 768px) {
	.pagetitle.is-index.is-bottom {
		height: 470px;
	}
}

.pagetitle.small{
	.container{
		display: flex;
		align-items: center;
		position: relative;
		height: 100%;
		min-height: 170px;
		@media only screen and (max-width: 767px) {
			min-height: 135px;
		}
	}
	img{
		position: absolute;
		bottom: -18px;
		right: 0;
		@media only screen and (max-width: 767px) {
			width: 130px;
			bottom: -17px;
		}
	}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■共通
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#page_pamphlet{
	.vi_hd02{
		small{
			color: inherit;
			font-size: 60%;
			font-weight: 700;
			display: block;
			margin-top: -8px;
			@media only screen and (max-width: 767px) {
				margin-top: 3px;
			}
		}
	}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■read_txt
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#page_pamphlet{
	.read_txt {
		text-align: center;
		max-width: 920px;
		margin: 0 auto;
	}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■pamphlet_list
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#page_pamphlet{
	.pamphlet_list {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		max-width: 1000px;
		margin: 0 auto;
		@media only screen and (max-width: 767px) {
			display: block;
		}
		li{
			width: 48%;
			margin-bottom: 40px;
			text-align: center;
			@media only screen and (max-width: 767px) {
				width: 100%;
			}
		}
		.img{
			margin-bottom: 20px;
			img{
				width: 80%;
				height: auto;
				border: 1px solid #ccc;
			}
		}
	}
	a{
		word-break: normal;
	}
	.vi_btn01 small.small{
		@media only screen and (min-width: 768px) {
			font-size: 75%;
		}
	}
}