@charset "utf-8";
/* CSS Document */
@media all {	
	button.nextlink{
		font-family: "Sawarabi Mincho", serif;
		font-weight: 400;
		font-style: normal;
	}
	#formarea{
		padding: 20px;
	}
	#formarea .h2sub,
	#thanksarea .h2sub{
		font-size: 1.1rem;
		text-align: center;
		margin: 1em;
	}
	#formarea h2,
	#thanksarea h2{
		font-size: 2.6rem;
		text-align: center;
		margin-bottom: 40px;
	}
	.attention{
		font-size: 1.2rem;
		line-height: 1.7;
		text-align: center;
		margin-bottom: 60px;
	}
	#mailformpro{
		width: 100%;
		max-width: 740px;
		margin: 0 auto;
	}
	dl.mailform{
		display: flex;
		flex-wrap: wrap;
		font-size: 1.1rem;
		margin-bottom: 40px;
	}
	dl.mailform dt{
		width: 16em;
		padding: 10px 0;
	}
	dl.mailform dt span{
		display: block;
		width: fit-content;
		position: relative;
	}
	dl.mailform dt span::after{
		position: absolute;
		content: "必須";
		font-size: 0.8em;
		width: 2.5rem;
		height: 1.3rem;
		text-align: center;
		top: 50%;
		transform: translateY(-50%);
		right: -3rem;
		color: #f00;
		border: solid 1px #f00;
		border-radius: 0.7rem;
	}
	dl.mailform dt.nini span::after{
		content: "任意";
		color: #555;
		border: solid 1px #555;
	}
	dl.mailform dd{
		width: calc(100% - 16em);
		position: relative;
		padding: 10px 0;
	}
	dl.mailform dd::after{
		content: "";
		position: absolute;
		bottom: 0;
		right: 0;
		width: calc(100% + 16em);
		height: 1px;
		background: #ccc;
	}
	#formarea form#mailformpro label{
		display: block;
		padding: 0.5em 0;
		background-color: unset;
		box-shadow: none;
	}
	dl.mailform dd input,
	dl.mailform dd textarea{
		padding: 1em;
		background: #f8f8f8;
		border: solid #ccc;
		border-width: 2px 1px 1px 1px;
	}
	dl.mailform dd textarea{
		width: 100%;
	}
	div.mfp_buttons{
		padding-top: 10px;
		text-align: right;
	}
	
	#thanksarea{
		padding: 40px 0;
		min-height: calc(100vh - 250px);
	}
	#thanksarea .thanks{
		font-size: 1.2rem;
		text-align: center;
		margin-bottom: 60px;
	}
	
}

@media screen and (max-width: 768px){
	
	#formarea .h2sub,
	#thanksarea .h2sub{
		margin: 0.5em;
	}
	#formarea h2,
	#thanksarea h2{
		font-size: 2rem;
	}
	.attention{
		margin-bottom: 40px;
	}
	
	dl.mailform dt{
		width: 100%;
		padding: 0;
	}
	dl.mailform dd{
		width: 100%;
		margin-bottom: 20px;
	}
	dl.mailform dd::after{
		width: 100%;
	}
	dl.mailform dd input:not([type="radio"]){
		width: 100%;
	}
	
	#thanksarea{
		min-height: calc(100vh - 380px);
	}
}

@media screen and (min-width: 769px) and (max-width: 1024px){

}

@media screen and (min-width: 1025px), print{

}