@charset "UTF-8";

/* ===================================================================

	Setting

=================================================================== */
html { color:#000; background:#FFF; line-height:1.6; text-align:left; font-size:65.5%; }
body { font-size:1.3rem; font-family:'メイリオ',Meiryo,'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro'; overflow-x:hidden; }
img { max-width:100%; height:auto; }

	/* ===================================================================
	
	#	Responsive
	
	=================================================================== */

	/* Link set
	------------------------------------------------------------------- */
	a { color:#000; text-decoration:none; transition:0.3s ease-in-out; }
	a img { transition:0.3s ease-in-out; }
	a:hover { color:#666; }

	/* Block set
	------------------------------------------------------------------- */
	main { margin:0 auto; }
	main section { margin:0 auto; position:relative; }
	main,
	main section:after { content:""; display:block; clear:both; }
	
	/* JS set
	------------------------------------------------------------------- */
	.fadein { opacity:0.1; transform:translate(0, 50px); transition:all 500ms; } 
	.fadein.scrollin { opacity:1; transform:translate(0, 0); }
		
		.m { display:none; }
		@media screen and (max-width:768px) {
			
			body { font-size:1.2rem; }
			.containar { width:100%; }
			.m { display:block; }
			
		}
		


/* ===================================================================

	Header

=================================================================== */
.hd_bg { border-bottom: 3px solid #021774; display: flex; justify-content: center; }
.hd { display: flex; justify-content: space-between; align-items: center; height: 90px; width: 900px; margin: auto; }
.hd_logo {width: 240px; }
.hd_logo img { height: auto; width: 100%; }
.hd_text { margin-left: 20px; width: calc(100% - 440px); font-size: 10px; }
.hd_bnr { width: 200px; }


	@media screen and (max-width:768px) {
		
		header { text-align:center; padding:1em; }
		header * { font-size:2rem; }
		.hd { display: flex; justify-content: space-between; align-items: center; height: 40px; width: 90%; margin: auto; }
		.hd_logo { width: 100%; }
		.hd_text { display:none; margin-left: 20px; width: calc(100% - 440px); font-size: 10px; }
.hd_bnr { display:none; width: 200px; }
		header h2 { float:none; }
		
	}
	
/* ===================================================================

	form

=================================================================== */
.form__wrap{
	width: 900px;
	margin: auto;
}
.form_text {
	width: fit-content;
	margin: auto;
	padding: 0 6% 15px;
}
.form .form_top { width:900px; margin:auto; }
/* .form .form_top > h1 { margin:auto; font-size:1.5rem; padding:40px 0 10px; border-bottom: 1px solid #021774; margin-bottom:20px; } */
.form .form_top > h1 { margin:auto; font-size:1.5rem; padding:40px 0 10px; border-bottom: 1px solid #021774; margin-bottom:40px; }
.form .form_top > h1 span { display:block; font-size:2rem; font-weight:bold; border-left:8px solid #021774; padding-left: 20px; color: #021774;line-height: 1.4; }
.form .form_top >p.gw{font-size:130%;line-height: 1.8;}
.form .form_top >p.gw>a{
    color: blue;
}
.form > p:first-of-type { text-align:center; padding:0 2em; }
.form > footer { background:#021774; color:#FFF; text-align:center; padding:20px 0; }
.form > footer small { font-size:1.1rem; }
.form .box { width:50%; padding:50px 30px; border:3px solid #021774; background:#FAFAFA; text-align:center; margin:60px auto 60px; }
.form .box h2 { font-weight:bold; font-size:1.6rem; margin-bottom:20px; }
.form .box > a { display:block; width:60%; border:1px solid #021774; height:40px; line-height:40px; text-align:center; margin:50px auto 0; text-transform:uppercase; }
.form .box > a:hover { background:#021774; color:#FFF; }
.form .box > a:after { content:">"; margin-left:10px; font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace; font-weight:bold; }

	@media screen and (max-width:990px) {
		.form__wrap{
			width: 100%;
			padding: 0 6%;
		}
        .form .form_top{
            width: 100%;
        }
		.form .form_top > h1 { width:100%; margin:auto; font-size:1.5rem; padding:20px 0 10px; margin-bottom:20px; }
        .form .form_top >p.gw{
            width:90%;
            margin: 0 auto;
            font-size: 100%;
        }
		.form .box { width:90%; padding: 10% 5%; border:3px solid #021774; background:#FAFAFA; text-align:center; margin:60px auto 60px; }
	}