@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Noto+Serif+JP:wght@400;600&family=Open+Sans:wght@400;700&display=swap');

html {
	font-family:'Open Sans', 'Noto Sans JP', "メイリオ", Meiryo, sans-serif;
	font-size: 62.5%;
	background: #FFFFFF;
	color: #000000;
}
body {
	font-size: 1.4rem;
	min-width: 1000px;
	min-height: 100vh;
	text-align: justify;
	line-height: 1.4;
	background: #FEF6E4;
}
body.color01 ,
body.color02 ,
body.color03 ,
body.color04 ,
body.color05 ,
body.color06 {
	background: #FFFFFF;
}
/* SP */
@media only screen and (max-width: 768px) {
	html {
		font-size: 2vmin;
	}
	body {
		min-width: auto;
	}
	h2 {
		font-size: 2rem;
	}
}
h1 {
	padding: 2rem;
	background: #FFFFFF;
}
h2 {
	font-size: 3.5rem;
	color: #FFFFFF;
	padding: 1rem;
	text-align: center;
}
h2 span {
	display: block;
	font-size: 1.8rem;
}
h2 {
	background: #8A6035;
}
@media only screen and (max-width: 768px) {
	h2 {
		font-size: 3rem;
	}
}
.content-inner h3 {
	text-align: center;
	font-weight: bold;
	margin-bottom: 2rem;
	font-size: 2rem;
}
.content-inner form h3 {
	text-align: left;
	font-size: 1.6rem;
	margin: 2rem 0 0 0;
}
body.color06 .content-inner form h3 {
	color: #008000;
}
body.color01 h2 {
	background: #0082CF;
}
body.color02 h2 {
	background: #FF7F50;
}
body.color03 h2 {
	background: #306FAB;
}
body.color04 h2 {
	background: #008899;
}
body.color05 h2 {
	background: #EB6EA5;
}
body.color06 h2 {
	background: #330000;
}
.content {
	padding: 2rem;
}
.content .content-inner {
	width: 700px;
	margin: auto;
}
.content .notice {
	position: relative;
	padding-left: 2rem;
}
.content .notice::before {
	content: '※';
	position: absolute;
	color: #FF0000;
	left: 0;
}
.content p.required {
	position: relative;
	padding-left: 1rem;
}
.content p.required::before {
	content: '*';
	position: absolute;
	color: #FF0000;
	left: 0;
	top: 0.3rem;
}
.content form {
	padding: 1rem 0;
}
/* SP */
@media only screen and (max-width: 768px) {
	.content .content-inner {
		width: 	100%;
		margin: auto;
	}
	.content-inner form h3 {
		font-size: 2.2rem;
	}
}

.input-area {
	padding-top: 1rem;
	border-bottom: 1px solid #989898;
}
.input-area.no-border {
	border: none;
}
.input-area dl {
	display: flex;
}
.input-area dl dt {
	width: 28%;
	background: #F8F5F2;
	padding: 0.8rem 0.5rem;
	border: 1px solid #989898;
	border-width: 1px 1px 0 1px;
}
.input-area dl dd {
	flex: 1;
	background: #FFFFFF;
	padding: 0.5rem;
	border: 1px solid #989898;
	border-width: 1px 1px 0 0;
}

.input-area .required dt {
	position: relative;
	padding-left: 1.7rem;
}
.input-area .required dt::before {
	content: '*';
	position: absolute;
	color: #FF0000;
	left: 0.5rem;
	top: 1rem;
}
/* SP */
@media only screen and (max-width: 768px) {
	.input-area {
		border: none;
	}
	.input-area dl {
		display: block;
		margin-bottom: 1rem;
	}
	.input-area dl dt {
		width: 100%;
		border-width: 1px 1px 0 1px;
	}
	.input-area dl dd {
		flex: 1;
		background: #FFFFFF;
		padding: 0.5rem;
		border: 1px solid #989898;
		border-width: 1px 1px 1px 1px;
	}

	.input-area .required dt {
		position: relative;
		padding-left: 1.7rem;
	}
	.input-area .required dt::before {
		content: '*';
		position: absolute;
		color: #FF0000;
		left: 0.5rem;
		top: 1rem;
	}
}

.input-area input[type="text"] {
	padding: 0.4rem;
	border: #c0c0c0 1px solid;
	width: 100%;
}
.input-area input[name="name"] ,
.input-area input[name="kana"] ,
.input-area input[name="school_name"] ,
.input-area input[name="work_place"] ,
.input-area input.wp60 {
	width: 60%!important;
}
.input-area input[name="tel"] {
	width: 40%!important;
}
.input-area input[name="age"] ,
.input-area input[name="school_year"],
.input-area input[name="experience"],
.input-area input.wp20 {
	width: 20%!important;
}
.input-area input[name="practical_date"],
.input-area input[name="practical_date1"],
.input-area input[name="practical_date2"],
.input-area input[name="permission_number"] {
	width: 30%!important;
}
.input-area .required input[type="text"] {
	background: #FFEEEE;
}
.input-area label {
	padding: 0.4rem 1rem 0.4rem 0;
	display: inline-block;
}
.input-area label input {
	margin-right: 0.5rem;
	position: relative;
	top: 0.15rem;
}
.input-area .required label {
	background: #FFEEEE;
}
.input-area select {
	padding: 0.4rem;
	border: #c0c0c0 1px solid;
}
.input-area .required select {
	background: #FFEEEE;
}

.input-area textarea {
	width: 100%;
	height: 10rem;
	border: #c0c0c0 1px solid;
	padding: 1rem;
}

/* SP */
@media only screen and (max-width: 768px) {
	.input-area * {
		font-size: 2rem;
	}

	
}
.btn{
	width:10rem;
	padding: 0.5rem;
	border: #C0C0C0 1px solid;
	background-color:#EEEEEE;
	-webkit-appearance: none;
	border-radius: 4px;
	box-shadow: 1px 1px 2px 1px rgba(150,150,150,0.1);
	margin: 0 1rem;
	cursor: pointer;
	font-size: 1.4rem;
    font-weight: bold;
	color: #000000;
}
.btn:hover {
	background-color:#b0c7f0;
}

form dd .error {
	background: #FFEEEEEE;
	color: #FF0000;
	padding: 0.5rem;
	margin-top: 0.5rem;
}

.center {
	text-align: center;
}

.list01 {
	list-style: inherit;
	padding-left: 2rem;
}
.list01 li {
	padding: 1rem 0 0 0;
}
.red {
	color: #FF0000;
}
body.color06 .content-inner form ol {
	margin: 1rem 0 0 2rem;
}
body.color06 .content-inner form ol > li {
	list-style-type: none;
	counter-increment: cnt;
	position: relative;
	margin-bottom: 1rem;
}
body.color06 .content-inner form ol > li:before {
	content: counter(cnt) ")";
	display: inline-block;
	margin-left: -3.5em; /* サイトに合せて調整 */
	width: 3em; /* サイトに合せて調整 */
	text-align: right;
	position: absolute;
	top: 0;
	left: 0;
}
body.color06 .content-inner form ul {
	margin: 1rem 0 0 2rem;
}
body.color06 .content-inner form ul > li {
	list-style-type: disc;
	list-style-position: outside;
	margin-bottom: 0.5rem;
}
.flex-box {
	display: flex;
	margin-bottom: 0.5rem;
}
.flex-box div:first-child {
	width: 10rem;
	padding-top: 0.5rem;
}
.conf .flex-box div:first-child {
	padding-top: 0;
}
.flex-box div:last-child {
	flex: 1;
}

.sub-ttl01 {
	border-left: #0082CF 1rem solid;
	padding-left: 1rem;
}
.mt-05 {
	margin-top: 0.5rem;
}
.mt-2 {
	margin-top: 2rem;
}
.mb-1 {
	margin-bottom: 1rem;
}
.wp50 {
	width: 50%!important;
}

.result {
	position: relative;
	height: 2.6rem;
	background: #C7EEFF;
	margin: 0.5rem 0;
}
.result p {
	position: absolute;
	top: 50%;
	left: 0.5rem;
	transform: translate(0, -50%);
}
.file-box a {
	display: inline-block;
	margin-bottom: 0.5rem;
}
.btn-box {
	text-align: center;
	padding: 2rem;
}

.file-label input {
	display: none;
}

.file-label {
	display: inline-block!important;
	padding: 0.5rem 2rem!important;
	border: #C0C0C0 1px solid;
	background-color:#EEEEEE;
	-webkit-appearance: none;
	border-radius: 4px;
	box-shadow: 1px 1px 2px 1px rgba(150,150,150,0.1);
	margin: 0!important;
	cursor: pointer;
	font-size: 1.4rem;
    font-weight: bold;
	color: #000000;
	background: #EEEEEE!important;
}

.add-companion {
	margin-top: 1rem;
}
.add-companion a {
	text-decoration: none;
}
