@charset "UTF-8";

#top_main {
  position: relative;
  margin-bottom: 2rem;
}

#top_main h2 {
  padding: 2rem 1rem;
  font-size: 1.5rem;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  color: #fff;
  text-align: center;
	line-height: 1.25;
}

.page-header {
	background: url("../img/common/bg_page_header.png") no-repeat center;
	background-size:cover;
}

.ma-guideline-contents {
	max-width: 85%;
	margin: 0 auto 4rem;
	padding: 1rem;
	background-color: #fff;
	color: #444;
	font-size: 0.875rem;
}

.ma-guideline-contents p {
	line-height: 1.25;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.ma-guideline-contents h3 {
	margin-top: 3rem;
	margin-bottom: 1rem;
	border-bottom: 1px solid #ccc;
}

.ma-guideline-contents h4 {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.ma-guideline-contents ol {
	margin-top: 1rem;
	margin-bottom: 1rem;
	padding-left: 2rem;
}

.ma-guideline-contents li {
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.ma-guideline-contents li {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

.ma-guideline-contents ul {
	list-style-type: disc;
	margin-top: 1rem;
	margin-bottom: 1rem;
	padding-left: 1rem;
}

.ma-guideline-contents ul > li {
	list-style-type: disc;
}

.ma-guideline-contents ol.list-circle {  /* list-style の代わりに丸数字を明記 */
	padding-left: 0;
}

.ma-guideline-contents ol.list-circle > li {
	list-style-type: none;
	text-indent: -1.375em;
	padding-left: 1.375em;
}

.ma-guideline-contents ol.list-circle > li li {
	text-indent: 0;
	padding-left: 0;
}

.ma-guideline-contents ol.list-bracket > li {
  position: relative;
  list-style-type: none;
}

.ma-guideline-contents ol.list-bracket > li:before {
  position: absolute;
  right: calc(100% + 0.5rem);  /* 0.5remは連番とテキストとの余白 */
  content: "(" counter(list-item) ")";
}

.ma-guideline-contents .remarks {
	display: inline-block;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
	text-indent: -1em;
	padding-left: 1em;
	font-size: 0.875rem;
}

@media screen and (min-width: 768px) {
	#top_main {
		margin-bottom: 8rem;
	}

	#top_main h2 {
		padding: 5rem;
		font-size: 2.5rem;
	}

	.ma-guideline-contents {
		max-width: 1100px;
		margin: 0 auto 8rem;
		padding: 2rem 4rem;
		font-size: 1rem;
	}
}
