@charset "utf-8";
/* CSS Document */
/*==============================================================================*/
/* mainimg
============================================================================== */
/**/
#main{ background-repeat:no-repeat; background-position: center top; background-size: cover; width:100%; height: 0;
}

#mainWrap{ margin:0 auto 6%; }


#circleBtn a{ border-radius: 100%; height:150px; width:150px; 
	display: block;text-align: center; float: right; background:#ca2a24;
color:#fff;  position: relative; border:4px solid #fff; }

#circleBtn a span{ display: block; padding-top: 29px;	font-size: 1.3em; line-height: 1.2em; }
#circleBtn a:before{ 
	background: url("../img/externalIcon.svg") 96px 4px no-repeat;
    background-size: 9px 10px; right: 20%; bottom: 33%; height: 20px; width: 105px; }

#circleBtn a:before,
#circleBtn a:after{  position:absolute; content:""; display: block;}
/*>*/
#circleBtn a:after{ 
	bottom: 16%;
	right: 50%;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
}

#circleBtn a:hover{ background:#a52e2a;
	 color:#fff; text-shadow: 1px 2px 3px #867c7b;}




/*maintxt*/
main #maintxt{ background:url(../img/top/mainTitle.svg) center center no-repeat;  text-indent: 100%;  display:block;
white-space: nowrap; overflow: hidden;  background-size:contain; box-sizing:border-box; height: 0; padding-top: 36.1477572559%;
}


#mainInfo{ padding-top: 4%; }
#infoTitle{ background:#efefef; text-align:center; color:#a52e2a;  margin-bottom:20px;font-size:2.66em; width: 92%;}



#mainBox{ width:840px; margin:0 auto;}

/*会期*/
#mainSession{ margin:0 4% 3%; /*width: 92%;*/ }
#mainSession dt,#mainSession dd,
#mainChairman li{ display: inline-block; }
#mainSession dt,#mainSession dd{  vertical-align: middle; }
#mainChairman li{ vertical-align:top; }

#mainSession dt{ margin-right: 1%; }

/**/
#mainChairman li dt { margin-bottom:5%;}



/*==============================================================================*/
/*新着情報
============================================================================== */
/*title*/
.maintitle{ font-size:3em; text-align:center; color:#a52e2a;}

.maintitle span{ display:block; font-size: 0.35em; line-height: 1em;  }


#newsCont{ background:#efefef; padding:2% 0;  }

#infoBox {  padding:3% 2% 30px 4%; overflow:auto; height:200px;}
#infoBox dl{ border-bottom: 1px dotted #555; margin-bottom:1.5%; padding-bottom:1.5%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
letter-spacing: 0.04em;
}
#infoBox dt,#infoBox dd{ display:inline; }



#infoBox dl:last-child{border-bottom:none;}
#infoBox dt{ color:#a52e2a; }
#infoBox dd a{ color:#a52e2a; }
#infoBox dd a:hover{ text-decoration: underline}

/* IE10以降 */
@media all and (-ms-high-contrast: none) { /* ハイコントラストモードが「オフ」の場合 */
#infoBox dt{  margin-top: -3px; }
}


/*sp*/
@media screen and (max-width: 1059px) {
#main{background-image:url(../img/top/mainimgsp.jpg); padding-top:50.9433962264%; }
main #maintxt{ width:92%; margin:0 4% 20px; }
#infoTitle{ margin:0 4% 20px; font-size: 2.5em;}
	
#mainChairman{ margin:0 4%; }
#mainChairman li:first-child{ margin-right:2% }
#mainChairman li{ width:48%; }

#infoBox dt,#infoBox dd{ width:100%; display:block; }
.maintitle{font-size: 2.5em;}
}

@media screen and (max-width: 837px) {
#mainSession dt{ width:21%;  }
#mainSession dd{ width: 76%; }
#mainChairman dt{ width: 45%; }
}

@media screen and (max-width: 667px) {
#mainSession{ margin-bottom: 2%; }
#mainChairman li dt{  margin-bottom: 0; }
/*firefox*/
@-moz-document url-prefix() {
#mainChairman li dt{  margin-bottom: 5%; }
#mainSession{ margin-bottom: 3%; }
}
}

@media screen and (max-width: 570px) {
#mainChairman{ margin-top:-2%; }
#mainChairman li:last-child dd{ margin-top:-2.5%; }
#hybrid{ margin-top: -8% !important;  }
/*firefox*/
@-moz-document url-prefix() {
#mainChairman, #mainChairman li:last-child dd{ margin-top:0 !important;; }
}

}


 
@media screen and (max-width: 480px) {
#infoTitle { font-size: 2em; margin-bottom: 2%; }
.maintitle { font-size: 2.6em;}
#mainChairman dd{margin-top:-5%;  }
#mainChairman li:last-child dd{ margin-top:-21%; }
#hybrid{ margin-top: -18% !important;  }

/*firefox*/
@-moz-document url-prefix() {
 #mainChairman dd,#mainChairman li:last-child dd{ margin-top: 0 !important;;}
}

}

@media screen and (max-width: 469px) {
#mainSession dd{ width: 76%; }
}

@media screen and (max-width: 414px) {
#mainSession{ margin-bottom: 0; }
#mainSession dd{ margin-top: -5px; }
#mainChairman dd{ margin-top:-8%; }
#mainChairman li:last-child dd{ margin-top:-27%; }
#hybrid{ margin-top: -27% !important;  }
/*firefox*/
@-moz-document url-prefix() {
#mainSession dd, #mainChairman dd, #mainChairman li:last-child dd{ margin-top: 0 !important;; }
}
#infoTitle, .maintitle { font-size: 1.8em;  }

}

@media screen and (max-width: 375px) {
#mainChairman dd{ margin-top:-11%; }
#mainChairman li:last-child dd{ margin-top:-30%; /*margin-bottom:-50px*/ }
#hybrid{ margin-top: -32% !important; }
/**/
@-moz-document url-prefix() {
	#mainChairman dd, #mainChairman li:last-child dd{ margin-top:0 !important;; margin-bottom:0}	
	}
}

@media screen and (max-width: 320px) {
#hybrid{ margin-top: -42% !important; }
/**/
@-moz-document url-prefix() {
	#mainChairman dd, #mainChairman li:last-child dd{ margin-top:0 !important;; margin-bottom:0}	
	}
}

/*pc-----------------------------------------------------*/
@media screen and (min-width: 750px) {
#hybrid{ padding-top:10px }
}

@media screen and (min-width: 1060px) {
#main{background-image:url(../img/top/mainimg.jpg); padding-top:43%;  }
#mainWrap{ margin-top: /*-8%*/ -17%; }
main #maintxt{ width:98%; margin:0 0 20px; }

/*会期*/
#mainSession{ margin:0 0 3%; }

/**/
#mainChairman li:first-child{ margin-right:10%; }

#infoTitle{ width:98%;}

#infoBox {  padding:3% 10px 30px;  height:310px;}
#infoBox dt{ margin-right:2%; width:12%; }
#infoBox dd{ width:86%;  }
}



@media screen and (max-width: 1059px) {
#circleBtn{ margin: -28% 2% 10% 0; }
#circleBtn a { height: 120px;  width: 120px;}
#circleBtn a span {padding-top: 19%; font-size: 100%;}
}


@media screen and (max-width: 480px) {
#circleBtn{ margin-bottom: 0; margin-top:-33%;}
}


@media screen and (max-width: 350px) {
#circleBtn{ margin-top: -38%; }
#circleBtn a { height: 110px; width: 110px;}
}