@charset "utf-8";

/* ======================================================
 * layout_sp.css
 * ------------------------------------------------------
 * @media only screen and (max-width: 767px)
 * - Common
 * - Header
 * - Gnav
 * - Main
 * - Assist
 * - Footer
 * - Other
 * - Clearfix
 * Media Queries
====================================================== */

@media only screen and (max-width: 767px) {
	
	.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
	.boldFonts { font-weight: bold!important; }
	.pc_Only { display: none!important; }
	.mt10 { margin-top: 10px; }
	.mt20 { margin-top: 20px; }
	.mt30 { margin-top: 30px; }
	.mt60 { margin-top: 60px; }
	.mb10 { margin-bottom: 10px; }
	.mb20 { margin-bottom: 20px; }
	.mb30 { margin-bottom: 30px; }
	.mb60 { margin-bottom: 60px; }
	
	.sp_space_30 { height: 30px; }
	.sp_space_60 { height: 60px; }
	
	.subCopy {
		background-color: #3aabc6;
		padding: 10px 20px;
		font-size: 20px;
		font-weight: bold;
		line-height: 1.2em;
		color: #fff;
		text-align: center;
	}
	.backGround01 {
		/*background: linear-gradient(#3eb7d4 56.8%, #3aabc6 43.2%);*/
		position: relative;
	}
	.backGround01 .arrowBox {
		text-align: center;
		background-color: #3aabc6;
	}
	.backGround01 a i {
		display: inline-block;
		color: #fff;
		font-size: 3rem;
	}
	.backGround01 img {
		display: block;
		margin: 0 auto;
	}
	.lib_inner {
		width: 100%;
		max-width: 767px;
		margin: 0 auto;
	}

	.lib_inner2 {
		width: 100%;
		max-width: 767px;
		margin: 0 auto 60px;
		padding: 20px 20px 0px 20px;
	}
	
	.con_Set, .con_Set2 {
		display:-webkit-box;
display:-ms-flexbox;
		display:flex;
justify-content: center;
		width: 100%;
		margin: 0 auto;
		background-color: #f0a32f;
	}
		.con_Set2 {
		margin: 0!important;
	}
	.yellowBox, .yellowBox_last, .yellowBox_last2 {
		position: relative;
		background-color: #f0a32f;
		color: #fff;
		text-align: center;
		padding: 20px 20px 20px 20px;
		width: calc(100% / 3);
		height: 160px;
		/*display: -webkit-box;
  display: -ms-flexbox;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;*/
	}
	.yellowBox .eventIcon, .yellowBox_last .eventIcon {
		position: relative;
		text-align: center;
		
	}
	.yellowBox .eventIcon img, .yellowBox_last .eventIcon img {
		display: block;
		width: 36px;
		height: 36px;
		margin: 0 auto 8px;
	}
	.yellowBox i, .yellowBox_last i {
		display: inline-block;
		position: absolute;
		bottom: 10px;
		right: 46%;
		font-size: 3rem;
	}
	.yellowBox .eventName, .yellowBox_last .eventName {
		font-weight: bold;
		font-size: 1.5rem;
	}
	.yellowBox .eventName span, .yellowBox_last .eventName span {
		display: block;
		font-size: 1.3rem!important;
	}
	a.pageJump {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		
	}
	
	.eventText {
		margin-bottom: 20px;
		padding-bottom: 20px;
	}
	.yellowContents, .grayContents, .whiteContents { padding-bottom: 60px; }
	.yellowContents { background-color: #ffedcf; }
	.grayContents { background-color: #eee; }
	.whiteContents2 { padding-bottom: 20px; padding-top: 20px; }
	.whiteContents3 { margin: 0; padding: 0; }
	.orangeContents { background-color: #f0a32f; }
	.blueContents { 
		background-color: #074685; 
		padding-bottom: 40px; 
		padding-top: 20px;
		margin-bottom: -40px;
	}

	
	.SetTit {
		font-size: 16px;
		text-align: center;
		padding-top: 60px;
		padding-bottom: 50px;
	}
	.SetTit img {
		width: 320px;
		height: auto;
		margin-bottom: 20px;
	}
	.SetTit p {
		text-align: left;
	}
	.kityouBox {
		text-align: center;
		margin: 0px auto 50px;
	}
	.kityou {
		display: inline-block;
		margin: 0 auto;
		font-size: 24px;
		font-weight: bold;
		border: 1px solid #000;
		padding: 3px 10px;	
	}
	.exh_Box, .event_Box { width: 100%; }
	.exh_Piece, .event_Piece, .exh_Piece2, .event_Piece2, .exh_Piece3 { width: 100%; }
	/*.exh_Piece p.eventIMG { width: 100%; text-align: center; }*/
	.exh_Piece p.eventIMG img { display: block; width: 80%; margin: 0 auto; text-align: center; }
	
	
	.exh_Piece img, .exh_Piece2 img { display: block; width: 100%; max-width: 474px!important; margin: 0 auto; text-align: center; }
	.exh_Piece, .exh_Piece2, .exh_Piece3, .kityou, .event_Piece, .event_Piece2 { color: #333; }
	.exh_Tit, .event_Tit {
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
		font-size: 24px;
		line-height: 1.2em;
		color: #000;
		padding-bottom: 10px;
	}
	
	.sub_exh_Tit { display: block; font-size: 22px; color: #000; padding-top: 5px; line-height: 1.2em; }
	.titAtt { padding-left: 1em; text-indent: -1em; }
	.date_forum {
		padding-top: 20px;
		font-size: 18px;
		font-weight: bold;
		border-bottom: 1px solid #000;
		padding-bottom: 10px;
	}
	.date_forum span.seeMore {
		display: block;
		font-size: 20px;
		font-weight: bold;
		/*color: #d82f2f;*/
	}
	.exh_Txt {
		margin-top: 15px;
		line-height: 1.8em;
	}
	.ban_Link {
		position: relative;
		text-align: center;
		font-size: 17px;
		font-weight: bold;
		color: #fff;
		background-color: #f0a32f;
		border-radius: 80px;
		padding: 20px;
		margin-bottom: 30px;
	}
	.ban_Link i {
		position: absolute;
		top: 30%;
		right: 40px;
		font-size: 2.6rem;
	}
	.ban_Link a {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		
	}
	.ban_Link:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		Zoom: 1;
	}
	.ban_Link_cut {
		position: relative;
		text-align: center;
		font-size: 17px;
		font-weight: bold;
		color: #fff;
		background-color: #5d5b58;
		border-radius: 8px;
		padding: 10px;
		margin-bottom: 30px;
	}
	.ban_Link_cut i {
		padding-right: 5px;
	
	}
	.middle img { display: block; width: 65%; max-width: 380px; height: auto; margin: 40px auto 10px; }
	.namePub {
		font-weight: bold;
		margin: 20px 0px 30px 0px;
	}
	.add { display: block; text-indent: 3em; }
	
	.exh_Piece img.chart, .exh_Piece2 img.chart {  
		display: block; 
		width: 70%;
		margin: 20px auto;
	}
	
	.event_Box {
		background-color: #fff;
		padding: 30px 30px 60px 30px;
		margin-bottom: 60px;
	}
	.expoImg {
		margin: 0 auto;
		text-align: center;
	}
	.event_Tit {
		padding-top: 30px;
	}
	.event_Txt_ind {
		display: block;
		padding-left: 3em;
		text-indent: -3em;
	}
	
	.ban_Link_Txt {
		display: inline;
		float: right;
		font-size: 14px;
		font-weight: bold;
		color: #f0a32f;
		margin-top: 10px;
	}
	.ban_Link_Txt i {
		padding-right: 5px;
	
	}
	.ban_Link_Txt a {
		text-align: right;
		color: #f0a32f!important;
		
	}
	.ban_Link_Txt:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		Zoom: 1;
	}
	.logo_Area {
		position: relative;
		text-align: center;
		padding-top: 20px;
	}
	.logo_Area a {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.logo_Area:hover {
		opacity: 0.7;
	}
	
	/*--2021---*/
	.leftIMG_set {
		box-sizing: border-box;
	}
	.radius_img, .radius_img2, .radius_img3, .radius_img4, .radius_img5 {
		float: none;
		width: 94%;
		max-width: 727px;
		height: 300px;
		border-radius: 30px;
		margin: 0 auto 20px;
		
	}
	.radius_img {
		background: url("../img_2021/image01.jpg") right center / cover;
	}
	.radius_img2 {
		background: url("../img_2021/image02.jpg") right center / cover;
	}
	.radius_img3 {
		background: url("../img_2022/image03.jpg") right center / cover;
	}
	.radius_img4 {
		background: url("../img_2022/image04.jpg") right center / cover;
	}
	.radius_img5 {
		background: url("../img_2022/image05.jpg") left center / cover;
	}
	
	.SetTitAjust {
		padding-bottom: 0px!important;
	}
	
	.text_set, .text_set2 {
		float: none;
		width: 100%;
		padding: 20px;
	}
	.namePub_2021 {
		margin: 20px 0px 30px 0px;
	}
	.namePub_2021 span {
		font-weight: bold;
		font-size: 1.7rem;
	}
	.att {
		padding-left: 1em;
		text-indent: -1em;
	}
	
	/*--2022---*/
	table.OneColumn { 
		max-width: 747px; 
		margin: 0 auto;
	}
	
	table.OneColumn th {
		padding: 10px;
		display: block;
		width: 100%; 
		vertical-align: middle;
		background-color: #3884a3;
		color: #fff;
		border-bottom-left-radius: 0px;
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
	}
	table.OneColumn th span { color: #fff; }
	table.OneColumn th span.number { 
		font-family: 'Heebo', sans-serif;
		font-size: 40px;
		color: #4ab7e4;
		margin: 0 auto;
	}
	table.OneColumn td {
		display: block;
		width: 100%; 
		padding: 20px;
		border-bottom: 1px solid #3884a3;
		border-top: none;
		border-right: 1px solid #3884a3;
		border-left: 1px solid #3884a3;
	}
	table.OneColumn td.exh_Tit { 
		font-size: 24px;
	}
	table.OneColumn td.mid_td {
		vertical-align: middle;
		border-bottom: 1px dashed #3884a3!important;
	}
	table.OneColumn td img {
		display: block;
		margin: 0 auto;
	}
	.center_90, .center_80, .center_80_100, .center_70, .center_60, .center_50_sp70, .center_200org, .center_pc100_sp60 {
		display: block;
		margin: 0 auto;
	}
	.center_90 { width: 100%!important; }
	.center_80 { width: 100%!important; }
	.center_80_100 { width: 100%!important; }
	.center_70 { width: 100%!important; }
	.center_60, .center_pc100_sp60 { width: 100%!important; }
	.center_200org { width: 50%!important; max-width: 200px; } 
	.center_50_sp70 { width: 70%!important; }
	
	
.floatDiv { position: relative; width: 100%; }
.floatDiv p { float: left; width: 50%; padding-right: 5%; }
.floatDiv p.thuFour { width: 66%; }
.floatDiv p.oneCol { width: 100%; }
	
.steelblue { color: #3b84a3; }
.spMar_top { margin-top: -80px!important; }
	
}

/*----イベント終了-----*/
.backGround01_close {
		background: linear-gradient(#3eb7d4 94.3%, #3aabc6 5.7%);
		position: relative;
	}
	.backGround01_close img {
		display: block;
		margin: 0 auto;
	}
.backBlue_close {
	background-color: #3aabc6;
	text-align: center;
	padding: 0px 20px 60px;
}	
.backBlue_close .close_Tit {
	color: #fff;
	font-weight: bold;
	font-size: 2.5rem;
}
.backBlue_close .close_Txt {
	font-size: 1.5rem;
}
.backBlue_close .close_btn {
	position: relative;
	display: inline-block;
	background-color: #367f9a;
	margin-top: 20px;
	padding: 20px 60px;
	border-radius: 10px;
}
.backBlue_close .close_btn p {
	color: #fff;
	font-size: 2rem;
	font-weight: bold;
}
.backBlue_close .close_btn a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


@media only screen and (max-width: 549px) {
	
	.subCopy {
		font-size: 18px;
	}
	.middle img { display: block; width: 80%; max-width: 380px; height: auto; margin: 0 auto; }
	.exh_Piece img, .exh_Piece2 img { display: block; width: 100%; margin: 40px auto 0px; }
	.exh_Piece img.chart, .exh_Piece2 img.chart {  
		display: block; 
		width: 85%;
		margin: 20px auto;
	}
	.dis550max { display: none;}
	
}