@charset 'UTF-8';

/* container */
.expo-container {
	margin-top: 45px !important;
	padding: 0 !important;
}

.expo-container #wrapper {
	margin: 0 !important;
	padding: 0 !important;
}

.colwrap {
	padding-top: 20px !important;
}
.top-cont1wrap {
	margin-bottom: 0 !important;
}

.standard-cont1 {
	padding: 20px 3% !important;
}

.search-colwrap {
	margin-top: 65px;
}

.leftcol {
	padding-top: 15px !important;
}

.rightcol {
	padding-top: 0 !important;
}

.side_search_form {
	margin-top: 15px !important;
}

/* TOP Page */
.top-flex-box {
    display: block !important;
	text-align: center !important;
}

.top_maps {
    margin: auto;
    /*width: 100%;*/
}

/* Booth */
.standard-cont2 .wrap .detail {
    margin: 20px;
    padding-bottom: 40px;
    font-size: 1.2rem;
    text-align: left;
}

ul.tag {
    color: #000 !important;
}

/* Product */
.product-cont .wrap div.detail p,
.product-cont .wrap div.detail {
    margin: 0 20px !important;
    padding-bottom: 30px;
    font-size: 16px;
    text-align: left;
}

.product-cont .wrap div.detail {
    margin-top: 30px !important;
}

p.link-underline a {
    text-decoration: underline;
}

/* Spec */
.spec-area .spec .spec-title {
    padding: 8px 8px;
}

/* =========================
   EXPO 自由コンテンツ pattern2（2カラム固定）
   ========================= */
.pattern2{
	clear: both;
}

.pattern2 > div{
	/* float衝突を避けるため、floatを無効化してレイアウトはflexで作る */
	float: none !important;
	width: auto !important;
	clear: none !important;
	border: none;
	box-shadow: none;
	padding: 0;
	margin: 0;
}

.pattern2{
	display: flex;
	flex-wrap: wrap;
	gap: 4%;
	align-items: flex-start;
}

.pattern2 > h3{
	width: 100%;
}

.pattern2 > div{
	width: 48% !important;
}

/* スマホは縦積み */
@media (max-width: 768px){
	.pattern2{
		gap: 0;
	}
	.pattern2 > div{
		width: 100% !important;
	}
}

/* information */
.information p {
	margin: 30px 0;
}


/* Swiper */
/* 1. 外側のコンテナ：高さを自動にして、はみ出しを許可する */
.arrow_slide {
    height: auto !important;
    overflow: visible !important;
    padding-bottom: 0 !important; /* ドットのための余白 */
}

/* 2. Swiper本体：ここもはみ出しを許可し、内側にスペースを作る */
.arrow_slide .expo-news-swiper,
.arrow_slide .expo-feature-swiper {
    overflow: hidden !important; /* 左右のはみ出しを防ぐ（標準設定に戻す） */
    height: auto !important;
    /* 下側にドットを表示するための「部屋」を15px追加（計25px〜30px） */
    padding-bottom: 30px !important; 
    margin-bottom: 10px !important;
}

/* 3. 画像とテキストを包むスライド：ここが高さの基準になる */
.expo-news-swiper .swiper-slide,
.expo-feature-swiper .swiper-slide {
    height: auto !important;
    padding-bottom: 10px; /* スライド内の余白 */
}

/* 4. ドット（Pagination）：paddingで作ったスペースに絶対配置する */
.expo-news-swiper .swiper-pagination-bullets,
.expo-news-swiper .swiper-pagination,
.expo-feature-swiper .swiper-pagination-bullets,
.expo-feature-swiper .swiper-pagination {
    bottom: -10px !important; /* コンテナの底辺よりさらに下へ */
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100% !important;
}

/* 1. すべてのドットの基本設定（非活性：#d2d7dd） */
.arrow_slide .swiper-pagination-bullet {
    width: 14px !important;
    height: 14px !important;
    /* ドットの間隔を広げる（左右10pxずつ。合計20pxの間隔になります） */
    margin: 0 10px !important; 
    
    background: #d2d7dd !important;
    opacity: 1 !important;
    transform: scale(1) !important;
    display: inline-block !important;
    border: 1px solid transparent !important;
}

/* 2. アクティブなドットの設定（活性：白＋枠線） */
.arrow_slide .swiper-pagination-bullet-active {
    width: 14px !important;
    height: 14px !important;
	background: #fff !important;
    border: 1px solid #d2d7dd !important;
    
    /* 念のためアクティブ時も縮小させない */
    transform: scale(1) !important; 
}

.arrow_slide .swiper-pagination-bullets {
    /* padding-bottom で作った「部屋」の中に収まるよう、下からの位置を微調整 */
    bottom: 8px !important; 
    left: 50% !important;
    transform: translateX(-50%) !important;
    line-height: 1 !important;
}

/* PDF Swiper */
.pdf-swiper .cat_title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 13px;
    line-height: 1.4;
    height: 2.8em;
    margin-top: 8px;
    word-break: break-all;
    color: #333;
}
