@charset "utf-8";
/* CSS Document */


/* reset */
*{
margin:0;
padding:0;
border:none;
}
/* general params*/
h1, h2, h3, h4, h5, h6,
div, p, pre, ul, ol, dl, dt, dd,
address, blockquote{
margin: 0px;
padding: 0;/* margin&padding reset */
}
table {
margin : 0;
empty-cells: show; 
font-size:12px;
}
.areaAnchor,.anchor { display : none; }
img {
border: none;/* img do not want a border */
}

html {
  scroll-behavior: smooth;
}

.flex{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
	gap: 20px;
}
.sp{
    display: none;
}
.right{
    text-align: right;
}
.text_bold {
    font-weight: bold;
}
@media only screen and (max-width:980px){
	.sp{
		display: block;
	}
	.pc-tab{
		display: none;
	}
}

/* 全体の器 */
article {
    max-width: 980px;
    margin: 0 auto;
    padding: 0 10px; /* スマホ時の余白 */
    box-sizing: border-box;
}

@media only screen and (max-width:980px){
	article{
		max-width: 100%;
	}
}
/* ヘッダー/フッターの設定 */
header{
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
}
footer p{
	text-align: center;
	font-size: 14px;
}
header h1 img{
	width: 215px;
	margin-bottom: -25px;
}
nav#page-top-navigation{
	padding: 50px 0 0 0;
}
nav#page-top-navigation ul{
	display: flex;
	list-style-type: none;
}
nav#page-top-navigation ul li{
	margin-right: 15px;
	padding: 17px 10px 0 10px;
    height: 22px;
    font-size: 12px;
    line-height: 130%;
}
nav#page-top-navigation ul li a{
	text-decoration: none;
    display: block;
    padding-bottom: 8px;
	color: #000;
}

nav#page-top-navigation ul li:first-child{
	background: url(../images/navigation-meta-current.gif) no-repeat center bottom;
}
nav#page-top-navigation ul li:nth-child(2){
	background: url(../images/flagge_en.gif) left 20px no-repeat;
    padding-left: 22px;
}
.menu-btn {
	display: none;
}
@media only screen and (max-width:980px){
	header{
		flex-direction:row;
		padding: 0 5px 0 0;
		position: fixed;
		width: 95%;
		height:75px;
		background: #fff;
	}
	nav#page-top-navigation{
		padding: 25px 0 0 0;
		
	}
	nav#page-top-navigation ul.top_menu{
		display: none;
	}
	
}

/* 3カラムを包む親要素 */
.layout-wrapper{
    display: flex;
    gap: 0; /* カラム間の隙間 */
    margin:0;	
}
/* サイドバーの設定 */
.sidebar {
    flex: 0 0 200px; /* 幅を200pxで固定（伸び縮みさせない） */
    background-color: #d7d8da;
    padding:0 5px;
	font-size: 12px;
	line-height: 120%;
}
/* 左メニューの設定 */
nav#page-leftbox-navigation {
	border:solid 1px #a2a4a6;
	border-top:none;
	width:185px;
	margin:1em auto 10px auto;
	text-align:left;
	color:#000;
}
nav#page-leftbox-navigation ul{
	list-style-type: none;
}
nav#page-leftbox-navigation ul li{
	background-color:#fff;
	border:solid 1px #a2a4a6;
}

nav#page-leftbox-navigation ul li a{
	display:block;
	background-color:#fff;
	color:#000;
	text-decoration:none;
	font-size:11px;
	padding:7px 0 7px 12px;
}
nav#page-leftbox-navigation ul.innernav{
	list-style-type: none;
	margin: 0 0 5px 1em;
    padding: 0;
}
nav#page-leftbox-navigation ul.innernav li{
	border: 1px solid #fff;
    font-size: 12px;
}
div#add{
	background-color:#fff;
	width:170px;
	margin:30px auto 10px auto;
	padding:5px 5px 5px 10px;
	font-size:11.5px;
	line-height:130%;
	border:solid 1px #a2a4a6
}

#page-leftboxtop-navigation{
	display: none;
}
/* 右メニューの設定 */
#page-rightbox{
	margin: 1em 0 0 0;
}
#page-rightbox p{
	margin:0 0 10px 0;
	padding:0;
}

#page-rightbox a.speziallink {
	display: block;
	text-decoration: none;
	margin:0 0 1em 0;
	line-height:26px;
	font-size:11px;
	border-color:#a2a4a6;
	color:#000;
}
a.downloadcenter{
	background:url(../images/link-speziallink-downloadcenter.gif) no-repeat top left #fff;
}   
a.ticket{
	background:url(../images/link-speziallink-onlineticket.gif) no-repeat top left #fff;
} 
a.speziallink:hover {
	border-color:#a2a4a6;
}
a.downloadcenter,
a.ticket{
	margin:0 2px 5px 2px;
	padding:0 0 0 35px;
	color:#999;
} 
div.banner {
    margin: 1em auto;
    padding: 0;
    text-align: center;
}

@media only screen and (max-width:980px){
	.menu-btn {
        display: block; /* ボタンを表示 */
        cursor: pointer;
        z-index: 100;
    }
    .menu-btn span {
        display: block;
        width: 50px; height: 5px;
        background: #1f5b9f; 
		margin-bottom: 6px;
		transition: all 0.4s; /* 変化を滑らかにする */
    }
		/* 1本目：45度回転して右下がりに */
	.menu-btn.active span:nth-child(1) {
		transform: translateY(11px) rotate(-45deg);
	}

	/* 2本目：透明にして消す */
	.menu-btn.active span:nth-child(2) {
		opacity: 0;
	}

	/* 3本目：45度回転して右上がりに（1本目と交差） */
	.menu-btn.active span:nth-child(3) {
		transform: translateY(-11px) rotate(45deg);
	}
	
	.overlay {
    display: none; /* 通常は隠す */
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5); /* 黒の50%透明 */
    z-index: 98; /* メニュー(99)より下、コンテンツより上 */
		/* 初期状態は非表示（透明かつクリック不可） */
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s;
	}

	/* メニューが開いている時だけ表示 */
	.overlay.active {
		display: block;
		opacity: 1;
    visibility: visible;
	}
	.sidebar{
		padding: 0;
	}
	.side-left{
		position: fixed;
		width: 250px;
        top: 0; 
		left:-100%; /* 左側に隠しておく */
        height: 100vh;
        background: #f4f4f4;
        transition: 0.4s; /* スライドのアニメーション */
		z-index: 101;
	}
	
	/* メニューが開いた時の状態 */
    .side-left.active {
        left:0;
    }
	
	nav#page-leftbox-navigation{
		width: 100%;
		border: 0;
	}
	nav#page-leftbox-navigation ul{
		border: 0;
	}
	nav#page-leftbox-navigation ul li{
		border: 0;
	}
	nav#page-leftbox-navigation ul li a{
		padding:10px 5px;
		border-bottom: 1px solid #ccc;
		font-size: 4vw;
		line-height: 120%;
	}
	
	/*スマホ表示用ヘッダーナビ */
	#page-leftboxtop-navigation{
	display: block;
	}
	#page-leftboxtop-navigation ul.lefttop_menu{
		list-style-type: none;
		margin: 0 1em 0 1em;
		background-color:#fff;
	}
	#page-leftboxtop-navigation ul.lefttop_menu li{
		border-bottom: 1px dotted #ccc;
	}
	#page-leftboxtop-navigation ul.lefttop_menu a{
		display: block;
		
	color:#000;
	text-decoration:none;
	font-size:4vw;
	padding:7px 0 7px 12px;
	}
	#page-leftboxtop-navigation ul.lefttop_menu li:nth-child(2) {
    background: url(../images/flagge_en.gif) 2px center no-repeat;
    padding-left: 22px;
}
}


/* 3カラム上下 */
#page-headerarea {
/*	padding-top: 200px;*/
	height: 202px;
    background: url(../images/background-head3.jpg) no-repeat 0 0 #d6d8da;
	border-radius: 10px 10px 0 0 ; 
	border-top: 1px solid #ffffff; 
}
#page-footerarea{
	padding: 10px 1em 5px 0;
	background-color: #ccc;
	border-radius:  0 0 10px 10px; 
	text-align: right;
	font-size: 14px;
}
.privacy a{
	color: #fff;
	text-decoration: none;
}
#page-headerarea-breadcrump {
/*	height: 24px;*/
    margin: 168px 0 0 194px;
    padding:10px 0 0 0;
    font-size: 12px;
    line-height: 26px;
    text-align: center;
	border-radius: 10px 10px 0 0 ;
	background-color: rgba(255,255,255,0.5);
}
#page-headerarea-breadcrump h2{
	margin: 0 auto;
    text-align: center;
	color: #ffffff;
    font-size: 14px;
	background-color: #a3a4a6;
}
#page-headerarea-breadcrump p,
#page-headerarea-breadcrump p a{
	margin: 0 5px;
	font-size: 14px;
	background-color: #a3a4a6;
	text-align: left;
	color: #fff;
}

@media only screen and (max-width:980px){
	#page-headerarea {
	padding-top: 200px;
	height: 50px; 
	background: url(../images/background-head3.jpg) no-repeat center bottom #d6d8da;
}
	#page-headerarea p{
		padding: 0;
		margin: 0;
	}
	#page-headerarea-breadcrump {
		margin: 0 auto;
		border-radius: 0 0 0 0;
	}
	#page-headerarea-breadcrump h2{
		width: 100%;
	}
}


/* メインコンテンツの設定 */
.main-content {
    flex: 1; /* 残りのスペースをすべて使う */
    background-color: #ffffff;
    border: 1px solid #ddd;
    padding:2em 5px;
	font-size: 12px;
	line-height: 150%;
}

.main-wrapper{
	margin: 1em auto;
}
.mainBox{
	padding: 0 10px;
}
figure img{
	max-width: 250px;
}

.main-wrapper h3{
	margin: 5px 0 1em 0;
    padding: 0;
    font-size: 14px;
    color: #0e4a98;
}
.main-wrapper h3.aural img{
	float: right;
}
.jtitle {
    margin: 0;
    padding: 0 0 0 12px;
    font-size: 12px;
    font-weight: normal;
    color: #000;
}
.up{
	text-align: right;
}
/* レスポンシブ対応：画面が狭くなったら縦に並べる */
@media only screen and (max-width:980px){
    .layout-wrapper,
	.main-wrapper{
        flex-direction: column;
    }
    .sidebar {
        flex: auto; /* スマホ時は幅いっぱいに */
    }
	figure{
		text-align: center;
	}
	figure img{
		max-width: 100%;
	}
}

/* トピックス */
div.main-wrapper dl.topix{
margin:1em 0;
padding:0;
border-left:1px solid #999;
border-right:1px solid #999;
border-bottom:1px solid #999;
}
div.main-wrapper dl.topix dt{
background-color: #e8edfd;
margin:0;
padding:3px ;
font-size:12px;
text-align:left;
border-top:1px solid #999;
border-bottom:1px solid #999;
}
div.main-wrapper dl.topix dd{
margin:0 0 1em 0;
padding:3px 3px 3px 10px;
font-size:12px;
line-height:150%;
}
div.main-wrapper dl.topix dd p{
margin:0 0 1em 0;
}

div.main-wrapper form.access{
text-align:center;
}

/* 見本市カレンダー */
nav.tab-menu{
	margin: 0;
}
.tab-menu ul{
	list-style-type: none;
	gap: 0;
}
.tab-menu ul li{
	width: 100px; 
	text-align: center;
}
.tab-menu ul li a {
  display: block;         /* クリック範囲を広げる */
  padding: 5px 0;
  text-decoration: none;  /* 下線を消す */
  color: #333;
  transition: 0.3s;       /* 変化をなめらかに */
	border:1px solid #d8e1f0;
	border-radius: 15px 15px 0 0;
}
.tab-menu ul li.active a{
	background-color: #d8e1f0;
	border:1px solid #d8e1f0;
}
.tab-menu a:hover{
  background-color: #f0f0f0;
  color: #007bff;
}

table#table_cal{
width:500px;
margin:-1.5em 0 0 0;
padding:0;
}
#table_cal th,
#table_cal td{
height:95px;
margin:0;
padding:3px;
font-size:12px;
}
#table_cal th{
background-color: #d8e1f0;
width:125px;
color: #777;
font-weight:normal;
text-align:right;
border-bottom:1px dotted #fff;
}
#table_cal td{
border-bottom:1px dotted #999;
}
#table_cal .year{
background-color: #86a2d0;
color:#fff;
font-size:14px;
}
#table_cal th .arrow_cal{
color:#ff0000;
}

/* 見本市詳細*/

div#page-mainbox p {
    margin: 0 0 1em 0;
    padding: 0;
}

div#page-mainbox h3.aural{
font-size:14px;
color:#0e4a98;
}
div#page-mainbox h3.aural img{
float:right;
}
div#page-mainbox h3.aural .jtitle{
margin:0;
padding:0 0 0 12px;
font-size:12px;
font-weight:normal;
color:#000;
}

div#page-mainbox h4{
margin:5px 0 1em 0;
padding:0;
font-size:14px;
color:#0e4a98;
}

dl.place{
margin:1em 0;
padding:0;
}
dl.place dt{
float:left;
width:6em;
font-size:12px;
color:#0e4a98;
}
dl.place dd{
margin:0;
padding:0 0 0 6.5em;
font-size:12px;
}

#messe_data{
background-color:#EFF7FF;
margin:0 0 1em 0;
padding:5px 10px;
font-size:12px;
line-height:150%;
}

#messe_data table{
margin:0 0 0 1em;
padding:0;
font-weight:normal;
}
#messe_data table th{
width:250px;
font-size:12px;
line-height:150%;
text-align:left;
}
#messe_data table td{
font-size:12px;
line-height:150%;
}
#messe_data table sup{
font-size:9px;
}

#messe_photo{
float:right;
margin:0 0 1em 0;
padding:0 0 0 20px;
font-size:12px;
}
#messe_photo img{
margin-right:5px ;
}

div#page-mainbox table.tenji,
div#page-mainbox dl.tenji3{
margin:1em 0;
padding:0;
font-size:12px;
}
div#page-mainbox table.tenji th{
width:150px;
margin:0 0 1em 0;
padding:2px;
font-size:12px;
font-weight:bold;
text-align:left;
}
div#page-mainbox table.tenji td{
font-size:12px;
margin:0 ;
padding:2px;
}

div#page-mainbox dl.tenji3 dt{
margin:0 0 3px 0;
padding:0;
font-weight:bold;
font-size:12px;
}
div#page-mainbox dl.tenji3 dd{
margin:0 0 1em 0;
padding:0;
font-size:12px;
}

div#page-mainbox ul{
margin:0 0 0 20px;
padding:0;
}
div#page-mainbox ul li{
margin:0 0 10px 0;
padding:0;
}

div#page-mainbox .table1, 
div#page-mainbox .table2 {
    width: 500px;
    margin: 0;
    padding: 0;
}
div#page-mainbox .table1 th, 
div#page-mainbox .table1 td {
    margin: 0;
    padding: 3px;
    font-size: 12px;
    text-align: center;
    border: 1px solid #999;
}
.td1 {
    background-color: #EFF7FF;
}
@media only screen and (max-width:980px){
	table#table_cal{
	width:100%;
	margin:-1.5em 0 0 0;
	padding:0;
	}
	table#table_cal, table#table_cal thead, table#table_cal tbody, table#table_cal th, table#table_cal td, table#table_cal tr {
    display: block;
  }
	table#table_cal th{
		height: auto;
		padding: 5px 0;
		width: 100%;
		text-align: left;
	}
	table#table_cal tr {
    margin-bottom: 15px;
    border: 1px solid #ccc;
		clear: both;
  }
/*スマホ表示のテーブル横スクロール*/
  table#table_cal td {
    padding-right: 30%;     /* 左側にラベルを表示するスペースを作る */
    border-bottom: 1px solid #eee;
	  height: auto;
	  text-align: left;
  }

	table#table_cal td:nth-child(2) {
	  float: right;
		padding-right: 5px;
	}
	
	.table-container {
	  width: 100%;           /* 親要素（画面幅）いっぱいに広げる */
	  overflow-x: auto;      /* 横方向にはみ出た場合にスクロールを表示 */
	  -webkit-overflow-scrolling: touch; /* スマホでの操作を滑らかにする */
	  margin-bottom: 20px;
		padding: 10px 0;
	}
}

/*メッセベルリン社*/
dl.company{
	margin: 1em 10px;
}
dl.company dt{
margin:5px 0 0 0;
padding:0;
font-size:14px;
color:#0e4a98;
	font-weight: bold;
}
dl.company dd{
	margin: 0 0 1em 1.5em;
}

/* サイトマップ */
div.main-wrapper ul.map{
margin:0 0 0 5px;
padding:0;
list-style-type:none;
}
div.main-wrapper ol{
	margin:0 0 0 1em;
padding:0;
}
div.main-wrapper ul.map li,
div.main-wrapper ol li{
margin:0 0 1em 0;
padding:0;
}
div.main-wrapper ul.map li ul{
margin:0 0 0 10px;
padding:0;
}
div.main-wrapper ul.map li ul li{
background:url(../images/arrow-u-list.gif) no-repeat 0 5px #fff;
margin:0 ;
padding:0 0 0 8px;
list-style-type:none;
}
div.main-wrapper ul.map a:link,
div.main-wrapper ul.map a:visited{
color: #0066CC;
}

/* メールフォーム */

div.main-wrapper dl.form{
margin:1em 0;
padding:0;
border-left:1px solid #999;
border-right:1px solid #999;
border-bottom:1px solid #999;
}
div.main-wrapper dl.form dt{
background-color: #e8edfd;
margin:0;
padding:3px ;
font-size:12px;
border-top:1px solid #999;
border-bottom:1px solid #999;
}
div.main-wrapper dl.form dd{
margin:0 0 1em 0;
padding:5px 0 0 1em;
font-size:12px;
}
div.main-wrapper input,
div.main-wrapper select{
	border: 1px solid #ccc;
	padding: 5px;
}