/* CSS Document */
#detail{
	position: relative;
	}
	#detail header{
		padding: 0;
		}
	#detail section{
		padding-bottom: 0;
		}
	#detail footer{
		padding-bottom: 0;
		}
	#detail h3{
		color: #223a70;
		fill: #223a70;
		line-height: 1.6em;
		}
	#detail .detailWrap{
		margin-top: 0;
		}

#detailTitle{}
	#detailTitle h2{
		color: #1a1a1a;
		font-weight: bold;
		line-height: 1.4em;
		}
	#detailTitle time{
		display: block;
		margin-top: 0.5em;
		color: #1a1a1a;
		line-height: 1em;
		}
	#detailTitle time+div{
		border-top: 2px solid #223a70;
		}
	#detailTitle figure{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		overflow: hidden;
		}
	#detailTitle ul{
		display: flex;
		flex-wrap: wrap;
		width: calc(100% + 1px);
		background: #fff;
		list-style: none;
		}
	#detailTitle li{
		width: calc(25% - 1px);
		margin-right: 1px;
		}
		#detailTitle li:nth-child(n+5){
			margin-top: 1px;
			}

#detailMap{}
	#detailMap ul{
		counter-reset: count;
		margin: 1em 0;
		list-style: none;
		}
	#detailMap li{
		position: relative;
		padding: 0.2em 0;
		padding-left: 2em;
		color: #1a1a1a;
		line-height: 1.4em;
		cursor: pointer;
		}
		#detailMap li:before{
			counter-increment: count;
			content: counter(count);
			position: absolute;
			left: 0;
			top: 0;
			width: 1.8em;
			height: 1.8em;
			background: #223a70;
			border-radius: 100%;
			color: #fff;
			font-weight: bold;
			line-height: 1.8em;
			text-align: center;
			}
	#detailMap > img{
		width: 30px;
		height: auto
		}

#detailMapOpen button{
	background: #223a70;
	font-size: 1em;
	font-family: inherit;
	}
	#detailMapOpen button:hover{
		background: #e50012;
		}

#contentsBox{
	margin-top: 0;
	}

#ranking{
	position: relative;
	overflow: hidden;
	counter-reset: count;
	border-bottom: 1px solid #ccc;
	}
	#ranking h4{
		color: #1a1a1a;
		fill: #1a1a1a;
		}
	#ranking dl{
		position: relative;
		display: flex;
		flex-direction: row-reverse;
		border-top: 1px solid #ccc;
		padding: 0.8em 0;
		}
		#ranking dl:before,
		#ranking dl:after{
			margin-top: 0.8em;
			z-index: 1;
			}
		#ranking dl:before{
			content: "";
			position: absolute;
			top: 0;
			left: -1.5em;
			width: 2.4em;
			height: 2.4em;
			background: #000;
			transform: skew(-45deg,0);
			opacity: 0.8;
			}
		#ranking dl:after{
			counter-increment: count;
			content: counter(count);
			position: absolute;
			top: 0.2em;
			left: 0;
			width: 1em;
			color: #fff;
			line-height: 1em;
			font-weight: bold;
			font-style: italic;
			text-align: center;
			transform: scale(0.7,0.7);
			}
		#ranking dl:nth-of-type(1){
			border-top: 2px solid #223a70;
			}
		#ranking dl:nth-of-type(-n+3){}
			#ranking dl:nth-of-type(-n+3):before{
				background: #223a70;
				}
	#ranking dt{
		line-height: 1.4em;
		}
	#ranking dd{}
		#ranking dd a{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			color: transparent;
			}
	#ranking dt+dd{
		margin-right: 1em;
		}
	#ranking dd+dd{
		width: 0;
		}
	#ranking .thumb{
		padding-top: 66.66%;
		}

.default{}
	.default .thumb{
		padding-top: 66.66%;
		}

.documents{
	border: 1px solid #223a70;
	}
	.documents dt,
	.documents dd{
		line-height: 1em;
		}
	.documents dt{
		padding-left: 0.5em;
		border-left: 4px solid #223a70;
		color: #1a1a1a;
		font-weight: bold;
		}
	.documents dt+dd{
		margin-top: 1em;
		}
	.documents dd+dd{
		margin-top: 0.5em;
		}
	.documents .linkBut{
		min-width: 10em;
		}

.contentsMenu{
	margin-top: 2em;
	text-align: center;
	}
	.contentsMenu .linkBut{
		min-width: 15em;
		background: #ed7700;
		cursor: pointer;
		}
		.contentsMenu .linkBut i{
			transition: transform 0.2s ease-out;
			}

.column{}
	.column h4{
		position: relative;
		display: inline-block;
		padding: 1em 4em;
		background: #223a70;
		border-radius: 0.4em;
		color: #fff;
		font-weight: bold;
		line-height: 1em;
		z-index: 1;
		}
		.column h4:before{
			content: "";
			position: absolute;
			left: 40%;
			bottom: -2em;
			border: 1em solid transparent;
			border-top-color: #223a70;
			transform: scale(0.6,1) skewX(60deg);
			}
	.column h4+div{
		margin-top: -1.5em;
		background: #f2ece8;
		border: 1px solid #223a70;
		}
	.column h5{
		color: #223a70;
		font-weight: bold;
		line-height: 1.4em;
		}
	.column h5+div{
		margin-top: 0.5em;
		}
	.column .thumb{
		padding-top: 66.66%;
		}

.gMap{
	padding-top: 75%;
	}
	.gMap div+div{
		margin-top: 0;
		}


/* for all */
@media (max-width: 1199px) {
/*1199px以下*/
}
@media (max-width: 991px) {
/*991px以下*/
#detailTitle{}
	#detailTitle time+div{
		margin-top: 1em;
		padding-top: 1em;
		}
#ranking{}
	#ranking dt{
		width: 70%;
		}
	#ranking dt+dd{
		width: 30%;
		}
}


/* for mobile */
@media (max-width: 767px) {
/*767以下px*/
#detailTitle{}
	#detailTitle h2{
		font-size: 1.6em;
		}
#detailMap{}
	#detailMap .buttonSet{
		flex-direction: column-reverse;
		}
.documents{}
	.documents dl{
		padding: 1em;
		}
.column{}
	.column h4{
		margin-left: 1em;
		}
	.column h4+div{
		padding: 1em;
		}
	.default figure+div{
		margin-top: 1em;
		}
}
@media (max-width: 767px) and (orientation:portrait) {
/*767px以下 縦向き*/
#detail{
	padding-top: 50%;
	}
#detailTitle{}
	#detailTitle .thumb{
		padding-top: 50%;
		}
	#detailTitle li{}
		#detailTitle li .thumb{
			padding-top: 100%;
			}
#detailMap{}
	#detailMap li+li{
		margin-top: 1em;
		}
.gMap{
	padding-top: 100%;
	}
}
@media (max-width: 767px) and (orientation:landscape) {
/*767px以下 横向き*/
#detail{
	padding-top: 50%;
	}
#detailTitle{}
	#detailTitle .thumb{
		padding-top: 50%;
		}
	#detailTitle li{}
		#detailTitle li .thumb{
			padding-top: 100%;
			}
#detailMap{}
	#detailMap ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		}
	#detailMap li{
		width: calc(50% - 0.5em);
		}
		#detailMap li:nth-child(n+3){
			margin-top: 1em;
			}
.column{}
	.column h4+div{
		display: flex;
		justify-content: space-between;
		padding-top: 3em;
		}
	.column figure,
	.column figure+div{
		width: calc(50% - 0.5em);
		}
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/
#detailTitle{}
	#detailTitle h2{
		font-size: 2em;
		}
#detailMap{}
	#detailMap ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom: 2em;
		}
	#detailMap li{
		width: calc(50% - 0.5em);
		}
		#detailMap li:nth-child(n+3){
			margin-top: 1em;
			}
.documents{}
	.documents dl{
		padding: 1.5em;
		}
.column{}
	.column h4{
		margin-left: 1.5em;
		}
	.column h4+div{
		display: flex;
		justify-content: space-between;
		padding: 1.5em;
		padding-top: 3.5em;
		}
	.column figure,
	.column figure+div{
		width: calc(50% - 0.5em);
		}
	.default figure+div{
		margin-top: 1.5em;
		}
}
@media (min-width: 768px) and (max-width: 991px) {
/*768px～991px*/
#detail{
	padding-top: 50%;
	}
#detailTitle{}
	#detailTitle .thumb{
		padding-top: 50%;
		}
	#detailTitle li{}
		#detailTitle li .thumb{
			padding-top: 100%;
			}
}
@media (min-width: 768px) and (max-width: 1199px) {
/*768px～1199px*/
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
#col2{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	}
	#col2 #mainContents{
		padding-bottom: 0;
		}

#mainContents{
	background: #fff;
	border-top: 4px solid #223a70;
	}
	#col2:has(#sideContents) #mainContents {
		width: 70%;
	}	
#sideContents{
	position: -webkit-sticky;
	position: sticky;
	top: 5em;
	}
#detailTitle{}
	#detailTitle time+div{
		margin-top: 1.5em;
		padding-top: 1.5em;
		}
	#detailTitle figure{
		z-index: -1;
		}
#ranking{}
	#ranking dt{
		width: 65%;
		font-size: 0.875em;
		}
	#ranking dt+dd{
		width: 35%;
		}
}
@media (min-width: 992px) and (max-width: 1199px) {
/*992px～1199px*/
#detail{
	padding-top: 50%;
	}
#mainContents{
	margin-top: -2em;
	padding: 1.5em;
	}
#sideContents{
	width: calc(30% - 1em);
	padding-top: 2em;
	}
#detailTitle{}
	#detailTitle .thumb{
		padding-top: 50%;
		}
	#detailTitle li{}
		#detailTitle li .thumb{
			padding-top: 100%;
			}
}
@media (min-width: 1200px) {

/*1200px以上*/
#detail{
	padding-top: 33.33%;
	}
#mainContents{
	margin-top: -3em;
	padding: 2em;
	}
#sideContents{
	width: calc(30% - 2em);
	padding-top: 3em;
	}
#detailTitle{}
	#detailTitle .thumb{
		padding-top: 33.33%;
		}
	#detailTitle li{}
		#detailTitle li .thumb{
			padding-top: 66.66%;
			}
}


/* Edge */
@supports (-ms-ime-align:auto) {
}


/* ie */
@media all and (-ms-high-contrast: none) {
}


