@charset "UTF-8";
/*　↓↓↓↓↓　リセットCSSここから　↓↓↓↓↓　*/
body, div,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea,
p, blockquote, th, td {
	margin:0;
	padding:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}
ol, ul {
	list-style:none;
}
caption, th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
}

/*　fotmのリセットCSS　*/
input,
button,
select,
/*textarea*/ {
	-webkit-appearance: none; 
	-moz-appearance: none;
	appearance: none;
	background: transparent;
	border: none;
	border-radius: 0;
	font: inherit;
	outline: none;
}

textarea {
	resize: vertical;
}

/*input[type='checkbox'],
input[type='radio'] {
	display: none;
}*/

input[type='submit'],
input[type='button'],
label,
button,
select {
	cursor: pointer;
}


select::-ms-expand {
	display: none;
}




/*　↑↑↑↑↑　リセットCSSここまで　↑↑↑↑↑　*/
html {
	font-size: 62.5%;
	box-sizing: border-box;
}
body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#main-contents {
	width: 65%;
	max-width: 1020px;
	margin: 0 auto;
	font-size: 1.8rem;
	/*border: solid 1px #ff0000;*/
}
h1 {
	font-size: 3.2rem;
	font-weight: bold;
	text-align: center;
	margin-top: 10px;
	/*border: solid 1px #ff00ff;*/
}

/*****　↓↓　ロゴ・ダイナくん　↓↓　*****/
#pco-logo {
	/*width: 18%;*/
	width: 36%;
	display: flex;
	justify-content: flex-start;
	/*border: solid 1px #00ff00;*/
}
#dammy {
	width: 4%;
}
#pco-dyna {
	width: 60%;
	/*border: solid 1px #aa00dd;*/
}
#pco-content1 img {
	width: 100%;
	height: auto;
}
#pco-content2 {
	width: 100%;
	margin-left: 5px;
}
#pco-content2 p {
	font-family: serif;
	color:  #0A1475;
	/*border: solid 1px #555555;*/
}
#pco-title1 {
	font-size: 1.7rem;
	height: 20px;
}
#pco-title2 {
	font-size: 2.2rem;
	height: 30px;
	font-weight: bold;
}
#pco-content1 {
	/*width: 70%;*/
	/*height: auto;*/
	/*border: solid 1px #bbbb00;*/
}

#pco-dyna img {
	width: 100%;
	height: auto;
}
#pco-container {
	height: 91px;
	display: flex;
	justify-content: flex-start;
	/*border: solid 3px #0000ff;*/
}



/*****　↓↓　表の一番外側のライン　↓↓　*****/
.outline{
	border-top: solid 2px #303030;
	border-right: solid 2px #303030;
	border-left: solid 2px #303030;
}


/*****　↓↓　共通レイアウト　↓↓　*****/
.main-title {
	width: 20%;
	max-width: 200px;
	min-width: 150px;
	height: auto;
	height: 54px;
	font-weight: bold;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: solid 2px #303030;
	border-right: solid 2px #303030;
}
.main-title p {
	margin: 3% 0 3% 0;
}
.content {
	width: 80%;
	max-width: 810px;
	height: 54px;
	display: flex;
	align-items: center;
	border-bottom: solid 2px #303030;
}
.container {
	display: flex;
	justify-content: flex-start;
}


/*****　↓↓　学校名　↓↓　*****/
.school-container {
	display: flex;
	justify-content: flex-start;
}
.title-multiple {
	font-size: 1.5rem;
}

/*****　↓↓　人数・担当先生　↓↓　*****/
.sub-container {
	width: 100%;
	height: 108px;
}
.sub-title-1 {
	/*width: 9.8%;*/
	width: 10%;
	max-width: 100px;
	min-width: 75px;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: solid 2px #303030;
	position: relative;
}
.sub-title-1:after {
	position: absolute;
	border-right: solid 2px #303030;
	content: "";
	top: 0px;
	bottom: 0px;
	right: 0px;
	left: 0px;
}
.sub-title-2 {
	/*width: 9.8%;*/
	width: 10%;
	max-width: 100px;
	min-width: 75px;
	font-weight: bold;
	border-bottom: solid 2px #303030;
}
.sub-title-2 div:first-child {
	border-bottom: solid 2px #303030;
}
.sub-title-2 div {
	height: 54px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sub-content {
	width: 80%;
	border-left: solid 2px #303030;
	border-bottom: solid 2px #303030;
}
.sub-content div:first-child {
	border-bottom: solid 2px #303030;
}
.sub-container {
	display: flex;
	justify-content: flex-start;
}
.sub-content div {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	height: 54px;
}



/*****　連絡先　*****/
.phoneNumberInput {
	margin-right: 10px;
	margin-left: 10px;
	width: 10%;
	min-width: 42px;
	height: 15px;
	margin-right: 20px;
	margin-left: 20px;
}



/*****　↓↓　行動範囲　↓↓　*****/
	/*注意自王の文字サイズ設定*/
.range-container {
	display: flex;
	justify-content: flex-start;
}
.notes{
	font-size: 1.2rem;
	margin-left: 50px;
}



/*****　↓↓　体験日（予定）　↓↓　*****/
.schedule-container {
	display: flex;
	justify-content: flex-start;
}
.schedule-container .content div {
	display: flex;
	justify-content: flex-start;
}
.ex {
	margin-left: 30px;
}



/*****　↓↓　区分　↓↓　*****/
.section-container {
	display: flex;
	justify-content: flex-start;
}
.section-container label {
	width: 180px;
}

.section-container .content {
	display: flex;
	flex-wrap: wrap;
}
#jsdfCheck {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}




/*****　↓↓　プラン　↓↓　*****/
.choice-container {
	display: flex;
	justify-content: flex-start;
}
.choice-container .main-title {
	width: 20%;
	height: 108px;
}
.choice-container label {
	width: 180px;
}
.choice-container .content {
	/*width: 90%;
	height: 54px;*/
	width: 80%;
	height: 108px;
	display: flex;
	flex-wrap: wrap;
}
#planCheck {
	height: 108px;
	display: flex;
	flex-wrap: wrap;
	align-content: space-around;
}


/*****　↓↓　プラン（詳細）　↓↓　*****/
.plan-container {
	display: flex;
	justify-content: flex-start;
	height: auto;
}
.plan-container .main-title {
	height: auto;
	flex-direction: column;
}
.plan-container .content {
	height: auto;
	flex-direction: column;
}
.plan-container .content-inner p {
	width: 100%;
	margin-left: 20px; 
}
.plan-container label {
	width: 180px;
}
.plan-container .content-inner {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	font-size: 1.5rem;
	border-bottom: dotted 2px #303030;
	/*box-sizing: border-box;*/
}
.plan-container input {
	padding-left: 3%;
}
.plan-container .content-inner:last-child{
	border-bottom: 0;
}
/*　リセットボタン　*/
#resetBtn {
	/*width: 100%;*/
	position: relative;
	top: 100px;
	/*border: 1px solid #00ffff;*/
}
/*
#kari1 {
	border: 1px solid #ff0000;
}
#kari2 {
	border: 1px solid #00ff00;
}
#kari3 {
	border: 1px solid #0000ff;
}
#kari4 {
	border: 1px solid #ff00ff;
}
*/


/*****　↓↓　質問事項　↓↓　*****/
#text1 {
	width: 100%;
    height: 108px;
	padding: 1px 20px 1px 20px;
}
textarea {
	width: 100%;
	height: 95%;
	font-size: 1.8rem;
	color: #000000;
}



/*
.RikuColor {
	color: #aaaaaa;
}
.UmiColor {
	color: #aaaaaa;
}
.SoraColor {
	color: #aaaaaa;
}
.MogiColor {
	color: #aaaaaa;
}
*/



/*****　↓↓　インプットタグの設定　↓↓　*****/
input {
	margin-right: 10px;
}
.school-input {
	margin-left: 20px;
}
.long {
	width: 100%;
	height: 15px;
	margin-left: 20px;
	margin-right: 20px;
}
.short {
	width: 10%;
	min-width: 42px;
	height: 15px;
	margin-right: 20px;
	margin-left: 20px;
}
input[type="date"] {
	margin-left: 20px;
	min-width: 125px;
}
label {
	margin-left: 20px;
}



/*****　↓↓　※の文字色設定　↓↓　*****/
.red {
	color: #ee0000;
}



/*****　↓↓　送信ボタン　↓↓　*****/
.submit-summary {
	width: 100%;
	margin-top: 4%;
	margin-bottom: 2%;
	text-align: center;
}
.btn {
	width: 100%;
	margin-bottom: 10%;
	display: flex;
	justify-content: center;
	/*border: solid 1px #ee0088;
	box-sizing: border-box;*/
}
button {
	background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
	width: 180px;
	height: 50px;
	font-size: 2rem;
	font-weight: bold;
	color: #ffffff;
	background-color: #00a350;
	border: solid 3px #00a350;
	border-radius: 30px;
}
button:hover {
	background-color: #ffffff;
	color: #00a350;

}







/*	↓↓　レスポンシブ　↓↓*/
/*　↓↓↓↓↓　max-with 1470pxまで（行動範囲対応）　↓↓↓↓↓　*/
@media screen and (max-width: 1470px){
	.range-container .content {
		flex-wrap: wrap;
	}
	.notes {
		margin-left: 20px;
	}
}

/*　↓↓↓↓↓　max-width 1160pxまで　（学校名・体験予定・プラン詳細対応）　↓↓↓↓↓　*/
@media screen and (max-width: 1160px){
	/*　ロゴ　*/
	#pco-container {
		height: 67px;
	}
	#pco-content1 img {
		width: 100%;
	}
	#pco-content2 {
		margin-left: 5px;
	}
	#pco-title1 {
		font-size: 80%;
	}
	#pco-title2 {
		font-size: 80%;
	}

	/*　学校名　*/
	.school-input {
		width: 300px;
	}
	.school-container label {
		width: 200px;
	}
	.school-container .main-title {
		height: 70px;
	}
	.school-container .content {
		height: 70px;
		flex-wrap: wrap;
	}
	/*　体験予定*/
	.schedule-container .content {
		flex-wrap: wrap;
		height: 70px;
	}
	.schedule-container .main-title {
		height: 70px;
	}
	/*　行動範囲　*/
	.range-container .main-title {
		height: 70px;
	}
	.range-container .content {
		height: 70px;
	}
	#jsdfCheck {
		justify-content: flex-start;
	}
	/*　プラン（詳細）　*/
	#resetBtn {
	/*position: relative;*/
	top:200px;
	}
}



/*　↓↓↓↓↓　max-width 860px以降 ↓↓↓↓↓　*/
@media screen and (max-width: 860px){
	/*　ロゴ　*/
	#pco-container {
		flex-direction: column;
		height: auto;
	}
	#pco-logo {
		width: 100%;
		height: 52px;
	}
	#pco-content1 {
		width: auto;
		height: auto;
	}
	#dammy {
		height: 0;
	}
	#pco-content2 p {
		font-size: 100%;
	}
	#pco-dyna {
		width: 100%;
		display: flex;
		justify-content: flex-end;
	}
	#pco-dyna img {
		width: 70%;
	}
	/*　共通　*/
	#main-contents {
		width: 80%;
		max-width: none;
		margin: 0 auto;
		font-size: 1.8rem;
	}
	.container {
		flex-wrap: wrap;
	}
	.container .content {
		justify-content: center;
	}
	.main-title br {
		display: none;
	}
	.main-title {
		width: 100%;
		max-width: none;
		height: auto;
		border-right: none;
		border-bottom: dotted 2px #303030;
	}
	.main-title p {
		margin: 0.5rem 0;
	}
	.content {
		width: 100%;
		height: auto;
	}
	/*　学校名　*/
	.school-container {
		flex-wrap: wrap;
	}
	.school-container .main-title {
		height: auto;
	}
	.school-input {
		width: 80%;
		margin: 0 auto;
	}
	.school-container .content {
		height: auto;
	}
	.school-container .content div {
		margin: 0 auto;
	}
	#schoolCheck {
		margin: 0 auto;
	}
	/*　人数・担当先生　*/
	.sub-container {
		height: auto;
	}
	.sub-title-1:after {
		border-right: none;
	}
	.sub-title-1 {
		/*position: static;*/
		max-width: none;
		min-width: none;
		width: 100%;
		border-bottom: dotted 2px #303030;
	}
	.sub-title-1 p {
		margin: 0.5rem 0;
	}
	.sub-title-1 p br {
		display: none;
	}
	.sub-title-2 {
		max-width: none;
		min-width: none;
		width: 50%;
		height: auto;
		padding: 1rem 0;
	}
	.sub-title-2 div {
		height: 27px;
		margin-right: 5%;
		justify-content: flex-end;
	}
	.sub-title-2 div:first-child {
		border: none;
	}
	.sub-content {
		width: 50%;
		height: auto;
		padding: 1rem 0;
		border-left: none;	
	}
	.sub-content div {
		height: 27px;
	}
	.sub-content div:first-child{
		border-bottom: none;
	}
	.sub-container {
		flex-wrap: wrap;
	}
	/*　行動範囲　*/
	.range-container {
		flex-wrap: wrap;
	}
	.range-container .main-title {
		height: auto;
	}
	.range-container .content {
		height: auto;
	}
	.range-container .content div {
		margin: 0 auto;
	}
	#movementCheck {
		margin: 0 auto;
	}	
	.range-container .content p {
		margin: 0 auto;
	}
	/*　体験日（予定）*/
	.schedule-container {
		flex-wrap: wrap;
	}
	.schedule-container .main-title {
		height: auto;
	}
	.schedule-container .content {
		height: auto;
	}
	.schedule-container .content div {
		width: 100%;
		justify-content: center;
	}
	.schedule-container .content input {
		margin-bottom: 10px;
	}
	/*　区分　*/
	.section-container {
		flex-wrap: wrap;
	}
	.section-container .main-title {
		height: auto;
	}
	.section-container label {
		width: auto;
	}
	.section-container .content {
		justify-content: center;
	}
	/*　プラン*/
	.choice-container {
		flex-wrap: wrap;
	}
	.choice-container .main-title {
		max-width: none;
		width: 100%;
		height: auto;
	}
	.choice-container .content {
		width: 100%;
		height: auto;
		justify-content: center;
	}
	#planCheck {
		width: 100%;
		height: auto;
		justify-content: center;
	}
	.choice-container .content label {
		width: auto;
	}
	/*　プラン（詳細）*/
	.plan-container {
		flex-wrap: wrap;
		height: auto;
	}
	.plan-container .main-title p {
		margin: 0 0;
	}
	.plan-container .main-title{
		height: auto;
	}
	.plan-container .content {
		height: auto;
	}
	.plan-container label {
		width: 175px;
	}
	#resetBtn {
	/*position: relative;*/
	top:0px;
	}
	/*　共通　*/
	.content {
		padding: 1rem 0;
	}
	/*　質問事項　*/
	.choice-container .content textarea {
		height: 100%;
	}
}



/*　↓↓↓↓↓　max-width 500px以降 ↓↓↓↓↓　*/
@media screen and (max-width: 500px){
	#main-contents {
		font-size: 1.5rem;
	}
	h1 {
		font-size: 2rem;
	}
	/*　ロゴ　*/
	#pco-logo {
		height: auto;
	}
	#pco-content1 {
		width: 65px;
	}
	#pco-content2 p {
		font-size: 80%;
	}
	#pco-title1 {
		height: auto;
	}
	#pco-title2 {
		height: auto;
	}
	#pco-dyna img {
		width: 100%;
	}
	
	/*　共通　*/
	.container label {
		width: auto;
	}
	.container .content {
		display: flex;
		flex-wrap: wrap;
	}
	.short {
		margin-right: 10px;
		margin-left: 10px;
	}
	/*　学校名　*/
	.school-container label {
		width: auto;
	}
	.school-container .content form {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	/*　学年　*/
	#gradeCheck {
		display: flex;
		flex-wrap: wrap;
	}
	/*　人数　*/
	.sub-title-2 {
		width: 30%;
		min-width: 0px;
	}
	.sub-content {
		width: 70%;
	}
	/*　行動範囲　*/
	#movementCheck {
		display: flex;
		flex-wrap: wrap;
	}
	/*　体験日　*/
	.schedule-container .content div {
		display: flex;
		flex-wrap: wrap;
	}
	/*　区分　*/
	#jsdfCheck {
		flex-wrap: wrap;
		justify-content: center;
	}
	/*　プラン（詳細）　*/
	#detailPlanCheck label {
		width: 100%;
	}
	textarea {
	font-size: 1.5rem;
	}
}

/*　↓↓↓↓↓　max-width 350px以降 ↓↓↓↓↓　*/
@media screen and (max-width: 350px){
	h1 {
		font-size: 1.7rem;
	}
	.sub-title-2 {
		width: 30%;
		font-size: 1.3rem;
	}
	.sub-title div {
		width: auto;
	}
	.sub-title p {
		width: auto;
	}
	.sub-content {
		width: 70%;
	}
}