.marker {
  background: linear-gradient(transparent 65%, #F2CFEE 65%);
}

.details {
	max-width: 100%;
	heigt: auto;
	/* transition: .3s; */
	overflow: hidden;
	/* margin-top: -10px; */
	padding-bottom: 20px;
	/* &:last-of-type {
		margin-bottom: 0;
	} */
	margin: -15px 0px 0px 0px;
	transition: transform 0.5s;
}

.details[open] {
	/* max-width: 100%; */
	/* heigt: auto; */
	/* margin-top: 0; */
	/*padding-bottom: 10px; */
	margin-top: -15px;
	padding-bottom: 20px;
} 
.details-summary {
	max-width: 100%;
	heigt: auto;
	display: block;
	/* padding: 15px; */
	padding: 8px;
	/* transition: .3s; */
	transform: translateY(10px);
	background-color: #009999;
	/* font-size: 25px; */
	font-size: 14pt;
	font-weight: bold;
	color: #fff;
	background-image: url(/cgakusan/hint05/img/bg_summary.png);
	background-position: top right;
	background-repeat: repeat-y;
	
	&:hover {
		cursor: pointer;
	}
	/* 「＋」「－」の装飾*/
	&::before,
	&::after {
		position: absolute;
		top: 50%;
		display: block;
		width: 16px;
		height: 2px;
		content: "";
		background-color: currentColor;
		right: 10px;
	}
	&::before {
		transform: translateY(-50%);
	}
	&::after {
		transition: transform 0.5s;
		transform: translateY(-50%) rotate(-90deg);
	}
		.details[open]:not([data-accordion-before-close]) &::after {
		transform: translateY(-50%);
	}
}
.details-summary span.tap {
	margin: 0.5em 2.5em 0.5em 0px;
	font-size: 9pt;
	color: #CCFEFE;
	font-weight: lighter;
	float: right;
}
/* .details-summary img {
	height: 18px;
} */
.details-summary::-webkit-details-marker {
	display: none;
}
.details[open] .details-summary {
	/* transform: translateY(0); */
}
.details-content {
	max-width: 100%;
	heigt: auto;
	/* padding: 5px; */
	padding: 24px 12px 12px 12px;
	background-color: #fff;
	/*
	border-bottom: 2px solid #009999;
	border-left: 2px solid #009999;
	border-right: 2px solid #009999;
	*/
	border-bottom: 2px solid #afdfdf;
	border-left: 2px solid #afdfdf;
	border-right: 2px solid #afdfdf;
	margin: 10px 0px 0px 0px;
}
.details[open] .details-content {
	animation: fadeIn 1s ease;
}
@keyframes fadeIn {
	0% {
		opacity: 0; /* 透明 */
		transform: translateY(10px);/*下から表示 */
	}
	100% {
		opacity: 1;
		transform: none;
	}
}

.img {
	max-width: 100%;
	heigt: auto;
}


h2 {
	margin-top: 45px;
	font-size: 10.5pt;
}
span.wakuNo {
	color: #fff;
	background-color: #00b0ec;
	padding: 1px 5px 0px 5px;
	border: 0px solid #00b0ec;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 0.75em;
}





/* 以下の記述は不要です */
/*body {
	margin: 20px;
}*/