/* CSS convention */

#convention{
	padding-top: 0;
	overflow: hidden;
	}
	#convention header{
		padding-top: 0;
		}
	#convention h2{
		position: relative;
		padding: 1em 0;
		color: #F38D00;
		font-size: 2.25em;
		font-weight: bold;
		text-align: center;
		line-height: 1.5em;
		z-index: 1;
		}
		#convention h2:before{
			content: "";
			position: absolute;
			top: 0;
			left: calc(50% - 50vw);
			width: 100vw;
			height: 100%;
			background: #fff;
			border-bottom: 5px solid currentColor;
			z-index: -1;
			}
	#convention h2+div{}
		#convention h2+div p{
			line-height: 1.7em;
			}
		#convention h2+div li{
			position: relative;
			margin-top: 2em;
			padding-left: 1.2em;
			line-height: 1.7em;
			}
			#convention h2+div li:before{
				content: "■";
				position: absolute;
				top: 0;
				left: 0;
				}
		#convention h2+div a{
			color: #0096BA;
			text-decoration: underline;
			}
	#convention h3{
		padding: 1em;
		background: #27344D;
		border-radius: 12px 12px 0 0;
		color: #fff;
		font-size: 1.5em;
		font-weight: bold;
		}
	#convention dl{
		margin-top: 1em;
		background: #fff;
		border-radius: 12px;
		}
	#convention dt{
		color: #0096BA;
		font-size: 1.25em;
		font-weight: bold;
		line-height: 1.5em;
		}
	#convention dd{}
		#convention dd:empty{
			display: none;
			}
		#convention dd:nth-of-type(1){
			font-weight: bold;
			}
		#convention dd:nth-of-type(2){
			color: #666;
			line-height: 1.7em;
			}
		#convention dd:nth-of-type(3){
			margin-top: 1em;
			text-align: right;
			}
			#convention dd:nth-of-type(3) a{
				position: relative;
				display: inline-block;
				padding-left: 1.5em;
				color: #0096BA;
				}
			#convention dd:nth-of-type(3) i{
				position: absolute;
				top: 0;
				left: 0;
				}
		#convention dd:nth-of-type(4){}
			#convention dd:nth-of-type(4) a{
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				padding: 1em;
				padding-right: 3em;
				background: #fff;
				border: 1px solid #b2b6bc;
				border-radius: 6px;
				color: inherit;
				font-weight: bold;
				text-align: center;
				line-height: 1.5em;
				text-decoration: none;
				}
			#convention dd:nth-of-type(4) a:hover{
				border-color: currentColor;
				color: #F38D00;
				}
			#convention dd:nth-of-type(4) i{
				position: absolute;
				top: calc(50% - 0.5em);
				right: 1em;
				}
		#convention dd:nth-of-type(5){
			color: #666;
			line-height: 1.7em;
			text-align: center;
			border: 0px solid #B0B4BA;
			}




/* for all */
@media (max-width: 1199.98px) {
/*1199px以下*/
}
@media (max-width: 991.98px) {
/*991px以下*/
#convention{}
	#convention h3+div{
		display: none;
		}
	#convention dl{
		display: flex;
		flex-direction: column;
		}
	#convention dd{
		margin-top: 1em;
		}
		#convention dd:nth-of-type(1){
			position: relative;
			margin: 0.25em;
			padding-left: calc(4px + 0.5em);
			font-weight: bold;
			margin-top: 1em;
			}
			#convention dd:nth-of-type(1):before {
				content: "";
				position: absolute;
				top: 0;
				left: 0;
				width: 4px;
				height: 1em;
				background: #F38D00;
				}
		#convention dd:nth-of-type(4){
			display: flex;
			justify-content: center;
			order: 1;
			}
			#convention dd:nth-of-type(4) a{
				max-width: 270px;
				}
		#convention dd:nth-of-type(5){
			padding-top: 1em;
			border-top-width: 1px;
			}
}


/* for mobile */
@media (max-width: 767.98px) {
/*767以下px*/
}
@media (max-width: 767.98px) and (orientation:portrait) {
/*767px以下 縦向き*/
#convention{}
	#convention dl{
		padding: 1em;
		}
}
@media (max-width: 767.98px) and (orientation:landscape) {
/*767px以下 横向き*/
}
@media (max-width: 767.98px) and (orientation:landscape), (min-width: 768px) {
/*767px以下 横向き, 768px以上,*/
#convention{}
	#convention dl{
		padding: 1.5em;
		}
}
@media (max-width: 767.98px) and (orientation:landscape), (min-width: 768px) and (max-width: 991.98px) {
/*767px以下 横向き, 768px～991px*/
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/





}
@media (min-width: 768px) and (max-width: 1199.98px) {
/*768px～1199px*/
}
@media (min-width: 768px) and (max-width: 991.98px) {
/*768px～991px*/
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
#convention{}
	#convention h3+div{
		background: #4D596A;
		color: #fff;
		}
		#convention h3+div ul{
			display: -ms-grid;
			-ms-grid-columns: 7em 1.5em 2fr 250px 1fr;
			display: grid;
			grid-template-columns: 7em 1.5em 2fr 250px 1fr;
			padding: 1.5em;
			}
		#convention h3+div li{
			text-align: center;
			}
			#convention h3+div li:nth-of-type(1){
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
				grid-column: 1;
				}
			#convention h3+div li:nth-of-type(2){
				-ms-grid-column: 2;
				grid-column: 2 / 4;
				}
			#convention h3+div li:nth-of-type(3){
				-ms-grid-column: 4;
				grid-column: 4;
				}
			#convention h3+div li:nth-of-type(4){
				-ms-grid-column: 5;
				grid-column: 5;
				}
		#convention h3+div li+li{
			border-left: 1px solid rgba(255,255,255,0.3);
			}
#convention{}
	#convention dl{
		display: -ms-grid;
		-ms-grid-columns: 7em 1.5em 2fr 250px 1fr;
		display: grid;
		grid-template-columns: 7em 1.5em 2fr 250px 1fr;
		}
	#convention dt{
		-ms-grid-column: 3;
		-ms-grid-row: 1;
		grid-column: 3;
		grid-row: 1;
		}
	#convention dd{}
		#convention dd:nth-of-type(1){
			-ms-grid-column: 1;
			-ms-grid-row: 1;
			-ms-grid-row-span: 5;
			grid-column: 1;
			grid-row: 1 / 5;
			display: flex;
			align-items: center;
			justify-content: center;
			border-right: 2px solid #F38D00;
			text-align: center;
			padding-right: 1.5em;
			}
		#convention dd:nth-of-type(2){
			-ms-grid-column: 3;
			-ms-grid-row: 2;
			grid-column: 3;
			grid-row: 2;
			}
		#convention dd:nth-of-type(3){
			-ms-grid-column: 3;
			-ms-grid-row: 3;
			grid-column: 3;
			grid-row: 3;
			}
		#convention dd:nth-of-type(4){
			-ms-grid-column: 4;
			-ms-grid-row-span: 5;
			grid-column: 4;
			grid-row: 1 / 5;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 0 1.5em;
			}
		#convention dd:nth-of-type(5){
			-ms-grid-column: 5;
			-ms-grid-row-span: 5;
			grid-column: 5;
			grid-row: 1 / 5;
			display: flex;
			align-items: center;
			justify-content: center;
			padding-left: 1.5em;
			border-left-width: 1px;
			}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
/*992px～1199px*/
}
@media (min-width: 1200px) {
/*1200px以上*/
}



