@charset "UTF-8";
/* CSS Document */

.main-color {
	color: rgba(0,113,188,1);
}
.con-1 {
	max-width: 960px;
	margin: 0 auto;
	padding: 0 10px;
}

/* ヘッダー */
header {
	background: rgba(29,33,132,1);
}
header .head {
}
header .head h1 {
	max-width: 200px;
	padding: 1rem 0;
}

/* メインビジュアル */
#mainvisual {
	margin: 0 0 3em 0;
}
.mainvisual {
	text-align: center;
}
.mainvisual h2 {
}

/* メイン */
#service {
	margin-bottom: 3em;
}
.service {
}
.service h3 {
	font-size: 1.5em;
	font-weight: bold;
	color: rgba(0,113,188,1);
	margin-bottom: 1em;
}
.service p {
	margin-bottom: 1em;
}
.service .attention {
	background: rgba(255,255,0,0.3);
	padding: 1em;
	margin: 2em 0;
	border-radius: 12px;
}
.service .attention .list {
}
.service .attention .list li {
	text-indent: -1em;
	padding-left: 1em;
	font-weight: bold;
}
.service .attention .list li .circle {
	color: rgba(0,113,188,1);
}
.service .attention .box {
	border: solid 1px rgba(220,0,0,1);
	padding: 0.5em 1em;
	margin: 1em 0;
}
.service .attention .code {
}
.service .attention .code li {
	margin: 0 auto 1em;
	max-width: 540px;
}
.service .attention .code li dl {
}
.service .attention .code li dl dt {
	text-align: center;
	margin-bottom: 0.3em;
}
.service .attention .code li dl dd {
}
@media (min-width: 770px) {
	.service .attention .code {
		display: flex;
	}
	.service .attention .code li {
		margin: 0 1em 1em;
	}
}
.service .guide-page {
	padding: 1em;
	background: #DDD;
	margin-bottom: 2em;
}
.btn-entry {
	text-align: center;
	margin: 2em 0;
}
.btn-entry a {
	font-weight: bold;
	color: #FFF;
	background-color: rgba(220,0,0,1);
	text-decoration: none;
	display: block;
	margin: auto;
	padding: 0.7em;
	max-width: 400px;
	border-radius: 10px;
	transition: all 0.2s linear;
}
.btn-entry a:hover {
	opacity: 0.75;
}
@media (min-width: 768px) {
	.service .guide-page {
		padding: 2.5em;
	}
}

/* フッター */
footer {
	color: #FFF;
	text-align: center;
	background-color: rgba(29,33,132,1);
	padding: 0.4rem;
	font-size: 0.9rem;
}