/* =============================================================
　
【 第2階層以下のタブレット,スマートフォン レイアウト(sp.css) 】
　

============================================================= */

/*===============================================
●タブレット  画面の横幅が959pxまで
===============================================*/

	body {
		min-width: 100%;
	}
	h2 {
		width: 98%;
	}
	
	.contents_area {
		margin: 0 auto;
		width: 98%;
	}
	.tablet_none {
		display: none;
	}

	/* margin (余白)
	===================================================== */
	.mb50:last-of-type {
		margin-bottom: 20px;
	}
	.photo_col_3 figure,
	.photo_col_3 figure:nth-of-type(3n),
	.photo_col_4 figure,
	.photo_col_4 figure:nth-of-type(2n){
		margin-bottom: 10px;
	}

	/* outline
	---------------------------------------------------- */
	
	.outline table th,
	.outline table td {
		display: block;
		width: auto;
	}
	
	/* テーマ */
	.outline .theme dl dt {
		float: none;
		text-align: center;
		margin: 0 0 0.5em;
		width: 100%;
	}
	
	/* 出展エリア ----------------------   */
	.exhibition_area ol li {
		width: 32.333333%;
	}

	/* レイアウト */
	.col {
		width: 100%;	
	}
	.col_l20 {
		float: none;
		margin: 0;
		width: 100%;		
	}
	.col_l55 {
		float: none;
		margin-right: 0; 
		width: 100%;
	}
	.col_r40 {
		float: none;
		width: 100%;
	}
	.col_r40 figure {
		text-align: center;
	}
	.col_r80 {
		float: none;
		margin: 0;
		width: 100%;		
	}
	.col_map_l {
		float: none;
		margin-right: 0;
		width: 100%;
	}
	.col_map_l figure img {
		width: 100%;
	}
	.col_map_r {
		float: none;
		width: 100%;
	}

	.includes {
		margin: 0 0 20px;
	}

	/* list
	------------------------------------------------------------- */
	.list .company_list ul li {
		float: none;
		width: 100%;
	}
	
	.start .target ul li {
	width: 32%;
	}
		
	
	/* access
	---------------------------------------------------- */
	.bus_stop {
		margin: 0 0 30px;
		width: 100%;
	}
	
	
	
	/* buyersguidebook
	---------------------------------------------------- */
	/* 広告掲載プラン例 */
	.buyers .ad,
	.buyers .ad:last-of-type {
		float: left;
		margin: 0 2% 2% 0;
		width: 49%;
	}
	.buyers .ad:nth-of-type(2n) {
		float: left;
		margin: 0 0 2% 0;
		width: 49%;
	}

	dl.fuki_box dd span { width: 75%;}
	.opi1 dt span,
	.opi1 dd span {
		width: 30%;
		float: none;
		display: block;
		margin-bottom:0.2em;
	}
	.opi1 dt { margin-bottom:0.5em;}

/* ===============================================
●スマートフォン  画面の横幅が640pxまで
=============================================== */
@media screen and (max-width:640px){
	.inner {
		margin: 0 0 20px;
	}
	
	h2 {
		width: 100%;
	}
	.subt p {
		margin-bottom: 0;
	}
	.sp_none {
		display: none;
	}
	.pc_none {
		display: block;
	}
	.sp_l {
		text-align: left !important;
	}
	

	/* レイアウト 	
	---------------------------------------------------- */
	.contents_not_area {
		width: 95%;
	}

	/* float */	
	.col_l60 {
		float: none;
		margin: 0;
		width: 100%;
	}
	.col_l50 {
		float: none;
		width: 100%;
	}
	.col_r50 {
		float: none;
		width: 100%;
	}
	.col_r35 {
		float: none;
		width: 100%;
	}
	.col_l60 p {
		margin: 0 0 10px;
	}
	
	/* linkボタン
	---------------------------------------------------- */
	.btn_link p {
		width: 90%;
	}
	
	.preparation {
		text-align: left;
	}
	
	.faq_menu ul li {
		font-size: 12px;
	}
	.photo_img li {
		margin: 0 2% 5px 0;
		width: 49%;
	}
	.photo_img li:nth-of-type(2n) {
		margin: 0;
	}
	.photo_col_3 .photo_img li:last-of-type {
		display: none;
	}	
	
	
	/* outline
	---------------------------------------------------- */
	.outline_date_tt {
		font-size: 16px;
	}
	.outline_date_tt:before,
	.outline_date_tt:after {
		content: "";
		padding: 0;
	}
	
	/* 出展エリア ----------------------   */
	.exhibition_area ol li {
		width: 49%;
	}

	
	/* speech
	---------------------------------------------------- */
	.theme dl dt {
		float: none;
	}
	.catch_copy {
		font-size: 16px;
		line-height: 28px;
		padding: 10px;
	}
	
	/* buyersguidebook
	---------------------------------------------------- */
	/* 広告掲載プラン例 */
	.buyers .ad,
	.buyers .ad:last-of-type {
		float: none;
		margin: 0 0 2% 0;
		width: 100%;
	}
	.buyers .ad:nth-of-type(2n) {
		float: none;
		margin: 0 0 2% 0;
		width: 100%;
	}
	.buyers .example figure p {
		font-size: 12px;
	}
	
	/* event
	---------------------------------------------------- */
	.hall_a {
		position: static;
		padding: 0 10px 0 0;
	}
	
	/* topics
	------------------------------------------------------------- */	
	.topics h3 {
		font-size: 16px;
		padding: 0.3em 0.5em;
		text-indent: -1.5em;
		padding-left: 2em;
	}
	.topics .innner dl dt {
		float: none;
		margin: 0 0 0.5em;
		width: 100%;
	}
	.topics .innner dl dt img {
		width: 100%;
	}
	.topics .innner dl dd {
		float: none;
		margin: 0;
		width: 100%;
	}
	
	/* contest */
	.topics .contest .contest_list p {
		padding: 8px 10px;
		position: static;
		text-align: center;
	}
	.topics .contest .contest_list p:after {
		border-top: none;
		border-left: none;
	}

	/* fair
	----------------------------------------------------- */
	.drawing thead {
		display: none;
	}
	.drawing thead tr th {
		  width: 100%;
	}
	.drawing tr:first-child {
		border-top: 3px solid #ddd;
	}
	.drawing tr {
		border-bottom: 3px solid #ddd;
		display: block;
	}
	.drawing td {
		border-bottom: 1px solid #ddd;
		display: block;
	}
	.drawing tr td:first-child {
		border-left: none;
	}
	.drawing tr td:last-child {
		border-right: none;
	}
	.drawing  td:before {
		content: attr(aria-label);
		float: left;
	}
	
	/* sametime、highlight
	----------------------------------------------------- */
	.hall_info dl {
		margin: 0 0 20px;
	}
	.hall_info dl dt {
		float: none;
		margin: 0 0 10px;
		width: 100%;
	}
	.hall_info dl dd {
		float: none;
		margin: 0;
		width: 100%;
	}
	
	/* attention
---------------------------------------------------- */

		/* 20200603追記　コロナ注意事項↓ */
		.corona_boxred .box-title {
			top: -25px;
			padding: 0 20px;
		}
	
	
	/* genre
	---------------------------------------------------- */	
	.boxarea dl dt {
		float: none;
		margin: 0 auto 20px;
		text-align: center;
		display: inline;
		vertical-align: middle;
	}
	
	
	/* visitors
	---------------------------------------------------- */	
	/* 来場者プロモーション */
	.visitors .promotion dl dt {
		float: none;
		text-align: center;
		margin: 0 0 10px;
	}
	
	
	/* contest
	---------------------------------------------------- */	
	.contest_pre .award figure {
		display: block;
	}
	.contest_pre .award figure figcaption {
		display: block;
		margin: 8px 0 0;
	}	
	.meeting .explanation .explan_box:first-of-type:after {
		text-align: center;
		margin: 0 0 10px 0;
		width: 100%;
	}
	.meeting .explanation .explan_box dl dt {
		float: none;
		margin: 0 0 10px;
		width: 100%;
	}
	.meeting .explanation .explan_box dl dd {
		margin: 0 0 10px;
		width: 100%;
	}
	
	
	/* nextshow
	---------------------------------------------------- */
	.nextshow table {
		margin: 0;
	}
	.nextshow table th,
	.nextshow table td {
		display: block;
		width: auto;
	}
	.nextshow table tr th {
		width: 100%;
	}
	.nextshow table tr th:after {
		border: none;
		border-color: none;
		border-left-color: none;
		border-width: 0;
		margin-top: 0;
	}
	.nextshow table tr td {
		padding: 5px 3px;
	}
	.nextshow table {
		width: 100%;
	}
	.nextshow .show .week {
		display: block;
		text-align: center;
		margin: 0;
	}
	
	
	/* access (アクセス）
	---------------------------------------------------- */
	.access .map_sunshine figure {
		width: 100%;
	}
	

	/* p 装飾
	---------------------------------------------------- */
	p.explanation {
		font-size: 16px;
	}
	
	/* figure
	---------------------------------------------------- */
	figure img {
		width: 100%;
	}
	
	
	/* BOX (.item_box)
	---------------------------------------------------- */
	.item_box {
		margin: 2em 0;
	}
	
	/* merit
	---------------------------------------------------- */
	.merit p.point {
		font-size: 16px;
	}
	

	/* アコーディオン
	----------------------------------------------------- */
	div.accordion > ul > li > ul > li {
		margin: 20px 5px 20px 40px;
	}
	div.accordion span a {
		padding: 0 5px;
		text-indent: 0;
	}
	.hotel_map .col_map_r ul li {
		display: inline-block;
		width: 100%;
	}
	.hotel_map .col_map_r > ul > li {
		text-indent: -2em;
		padding-left: 2em;
	}
	
	/* 動画
	----------------------------------------------------- */
	iframe {
		width: 100%;
		height: auto;
	}
	
	.voice dl.dl1 dt {
		width:96%;
		float:none;
	}
	
	.voice dl.dl1 dt img {
		display: block;
		margin:5px auto 20px;
		text-align: center;
	}
	
	ul.fuki_box li.wh50{ width: 63%;}
	dl.fuki_box dt img {
		width: 20%;
		margin:0;
	}
	.qanda dd span.em {
		display: block;
		margin:0 auto 10px;
	}
	
	/* ルート案内ムービー
	----------------------------------------------------- */
	
	.movie,
	.guide_txt{
		float: none;
		width:100%;
	}
    
    
	/* -----------------------------------------------------
	 要素固定
	----------------------------------------------------- */

	.header_fixed{
		background: rgba(250,250,250,0.9);
		border-top: 1px solid #d3d2d2;
		display: none;
		padding: 15px 20px;
		left: 0;
		z-index: 3;
	}
	.header_fixed .btn_fixed{
		display: block;
		font-weight: bold;
		color:#444;
		font-size:15px;
	}
	.header_fixed p:nth-of-type(1){
		text-align: center;
	}
	.header_fixed p:nth-of-type(1) img{
		width: 200px;
	}
	.header_fixed p:nth-of-type(2){
		text-align: center;

		position: absolute;
		bottom: 10px;
		right: 20px;
	}
	
	.header_fixed .btn_fixed span {
		background: linear-gradient(transparent 60%, #FF6 60%);
	}
	
	.header_fixed p a{
		display: inline-block;
	}
	.header_fixed p:nth-of-type(2) a{
		background: #404040;
		border-radius: 50%;
			-webkit-border-radius: 50%;
			-ms-border-radius: 50%;
			-moz-border-radius: 50%;
		color: #ffffff;
		font-size: 12px;
		padding: 10px 15px;
	}
	.header_fixed p:nth-of-type(2) a:before{
		content: "\e900";
		display: block;
		font-family: "icomoon";
		text-align: center;
		margin-right: 0.2em;
	}

	
/*
###########################################################
　
【 ここから来場者サイト向けcss ↓ 】

########################################################### 
*/

	/* topics
	-------------------------------------------------------- */	
	.topics h3 {
		font-size: 16px;
		padding: 0.3em 0.5em;
		text-indent: -1.5em;
		padding-left: 2em;
	}
	.topics .innner dl dt {
		float: none;
		margin: 0 0 0.5em;
		width: 100%;
	}
	.topics .innner dl dt img {
		width: 100%;
	}
	.topics .innner dl dd {
		float: none;
		margin: 0;
		width: 100%;
	}
	
	/* contest */
	.topics .contest .contest_list p {
		padding: 8px 10px;
		position: static;
		text-align: center;
	}
	.topics .contest .contest_list p:after {
		border-top: none;
		border-left: none;
	}

	/* リテールプロモーションアワード*/
	.retail_lasttime {
    padding: 15px 6px 0 6px;
	}
	
	.btn_retail {
	text-align: center;

}
	.retail .title dt,
	.topics .title dt{
    float: none;
    margin: 0 0 10px;
    width: 100%;
}
	.retail .title dd,
	.topics .title  dd{
    font-size: 16px;
}
	.retail .title span,
	.topics .title span{
    font-size: 24px;
}
	
	.topics .title p.tpcttl {
		font-size: 20px;
	}
	
/* 販促キーワード*/
	.keywordphoto {
    padding: 0 ;
}
	
	/* contest */
	.topics .contest .contest_list p {
		padding: 8px 10px;
		position: static;
		text-align: center;
	}
	.topics .contest .contest_list p:after {
		border-top: none;
		border-left: none;
	}
	.retail_info dl dt {
		float: none;
		text-align: center;
		width: 100%;
	}
	.retail_info dl dd {
		width: 100%;
	}
	
	/* promocon
	------------------------------------------------------------- */
	.promocon .title dt {
		float: none;
		margin: 0 0 10px;
		width: 100%;
	}
	.promocon .title dd {
		font-size: 14px;
	}
	.promocon .title dd span {
		font-size: 18px;
	}
	.promocon .vote {
		padding: 10px;
	}
	.promocon .vote ul li {
		margin: 0 5px 10px;
		width: 100%;
	}

	/* seminar
	----------------------------------------------------- */
	.seminar .seminar_item .prologue .explanation dl dt {
		float: none;
		text-align: center;
		margin: 0 0 10px;
		width: 100%;
	}
	.seminar .seminar_item .prologue .explanation dl dt figure img {
		width: auto;
	}
	.seminar .seminar_item .btn_seminar_request {
		position: static;
		text-align: center;
		margin: 0 0 20px;
	}
	.seminar .seminar_item .pay p,
	.seminar .seminar_item .pay p:last-of-type {
		float: none;
	}
	.seminar .seminar_item .pay p:first-of-type {
		padding: 10px 15px 0;
	}
	.seminar .seminar_item .pay p:last-of-type {
		padding: 3px 15px 15px;
	}
	.seminar .seminar_item .btn_seminar_request p a,
	.seminar .seminar_item .close p {
		padding: 10px 15px;
		width: 90%;
	}	
	.seminar_btn_date ul li {
		float: left;
		margin: 0 2% 2% 0;
		width: 48%;
	}
	
	/* ------ セミナーイベントPDFボタン ------ */

	.pdfbtn{
	width: 95%;
	font-size: 16px;
	
}
	
	
}