/* CSS Document */

#service{
	overflow: hidden;
	}
	#service nav{
		padding-top: 0;
		}
		#service nav ul{
			display: flex;
			flex-wrap: wrap;
			margin: -0.5em;
			list-style: none;
			}
		#service nav li{
			margin: 0.5em;
			}
		#service nav a{
			position: relative;
			display: block;
			padding: 1em 0.3em;
			padding-left: 2em;
			background: #eee;
			border-radius: 4px;
			text-decoration: none;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
			}
			#service nav a:before{
				content: "●";
				position: absolute;
				top: calc(50% - 0.5em);
				left: 0.5em;
				color: var(--theme-color);
				transform: scale(0.6);
				}
			#service nav a:hover{
				color: inherit;
				opacity: 0.8;
				}
	#service section{
		padding-top: 0;
		}

#applicationPeriod{}
	#applicationPeriod h4{
		color: var(--theme-color);
		}
	#applicationPeriod strong{
		font-weight: bold;
		text-decoration: underline;
		}
	#applicationPeriod thead{
		text-align: center;
		}

#application{}
	#application h4{
		color: var(--theme-color);
		}
	#application strong{
		font-weight: bold;
		text-decoration: underline;
		}
	#application thead{
		text-align: center;
		}

#reception{}
	#reception table{
		table-layout: fixed;
		text-align: center;
		}

#cancel{}
	#cancel td{
		text-align: center;
		white-space: nowrap;
		}
	#cancel thead {
		text-align: center;
		}
	#cancel strong {
		font-weight: bold;
		}

#tariff{}
	#tariff h3+div{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		}
	#tariff dd{}
		#tariff dd a{
			display: block;
			border: 1px solid #ddd;
			}
			#tariff dd a:hover{
				opacity: 0.8;
				}
		#tariff dd img{
			width: 100%;
			height: auto;
			}
	#tariff dl{}
		#tariff dl:nth-of-type(n+3){
			margin-top: 2em;
			}

#faq{}
	#faq dl{
		display: grid;
		grid-gap: 1em;
		padding: 1.5em 0 1em 0;
		border-bottom: 1px solid #ccc;
		}
	#faq dt,
	#faq dd{
		display: grid;
		grid-template-columns: 2em auto;
		grid-gap: 0.5em;
		line-height: 1.4em;
		}
		#faq dt:before,
		#faq dd:before{
			content: "Q";
			align-self: start;
			display: grid;
			place-items: center;
			width: 2em;
			height: 2em;
			padding-bottom: 0.25em;
			background: #eee;
			border-radius: 4px;
			font-weight: bold;
			line-height: 1em;
			transform: translateY(-0.3em);
			}
	#faq dt{}
		#faq dt:before{
			content: "Q";
			color: var(--theme-color);
			}
	#faq dd{}
		#faq dd:before{
			content: "A";
			}




/* for all */
@media (max-width: 1199px) {
/*1199px以下*/
}
@media (max-width: 991px) {
/*991px以下*/
#service{}
	#service nav{}
		#service nav li{
			width: calc(50% - 1em);
			}
}


/* for mobile */
@media (max-width: 767px) {
/*767px以下*/
#tariff{}
	#tariff dl{
		width: calc(50% - 0.5em);
		}
#applicationPeriod{}
		#applicationPeriod figure {
			width: 50%;
		}
}
@media (max-width: 767px) and (orientation:portrait) {
/*767px以下縦向き*/
}
@media (max-width: 767px) and (orientation:landscape) {
/*767px以下横向き*/
}
@media (max-width: 767px) and (orientation:portrait), (max-width: 575px) and (orientation:landscape) {
/*767px以下縦向き, 575px以下横向き*/
}
@media (min-width: 768px), (min-width: 576px) and (max-width: 767px) and (orientation:landscape) {
/*576px～767px横向き, 768px以上,*/
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px) and (orientation:landscape) {
/*576px～767px横向き, 768px～991px*/
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/
}
@media (min-width: 768px) and (max-width: 1199px) {
/*768px～1199px*/
}
@media (min-width: 768px) and (max-width: 991px) {
/*768px～991px*/
#tariff{}
	#tariff dl{
		width: calc(50% - 0.75em);
		}
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
#service{}
	#service nav{}
		#service nav li{
			width: calc(33.33% - 1em);
			}
#tariff{}
	#tariff dl{
		width: calc(50% - 1em);
		}
}
@media (min-width: 992px) and (max-width: 1199px) {
/*992px～1199px*/
}
@media (min-width: 1200px) {
/*1200px以上*/
}


/* ie */
@media all and (-ms-high-contrast: none) {
}