@charset "utf-8";
/* CSS Document */

*{
	
	box-sizing: border-box;
}


.education_top .thumbnail div{
	overflow:hidden;
	height: 180px;
	width: 320px;
	border-radius: 10px 10px 0 0;
}


.education_top .thumbnail a:hover img{
	transform:scale(1.1,1.1);
  transition:1s all;
}


/* Small Desktops */
@media (min-width: 768px) and (max-width: 1096px) {

	.education_top .thumbnail div{
	height: 180px;
	width: 100%;
}
}

/* Small Desktops */
@media  (max-width: 765px) {
	.education_top .thumbnail div{
	height: auto;
	width: 100%;
}
	.education_top .thumbnail a:hover img{
		transform:scale(1,1);
	
	}
	
	
}


.quiz .quiz_course {
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	margin: 24px 0;
}

.quiz .quiz_course div{
	margin: 0 0 0 8px;
}

.quiz .quiz_course div a{
	display: inline-block;
	width: 280px;
	border: solid 1px #05870D;
	border-radius: 50px;
	padding: 16px 0;
	text-decoration: none;
	color: #05870D;
	font-weight: 1em;
	font-weight: bold;
}

.quiz .quiz_course div .ruby{
	padding-top: 4px;
}


.quiz .quiz_course div a:hover{
	background-color: #05870D;
	color: #fff;
}

.quiz .quiz_course .active a{
	background-color: #05870D;
	color: #fff;
}

.quiz_start{
	padding: 20px 0;
	text-align: center;
}

.quiz_start button{
	display: inline-block;
	width: 280px;
	border: solid 2px #05870D;
	border-radius: 50px;
	padding: 16px 0;
	text-decoration: none;
	color: #05870D;
	font-weight: 1em;
	font-weight: bold;
}

.quiz_start button:hover{
	background-color: #05870D;
	color: #fff;
}


.quiz .quiz_content{
	margin-bottom: 60px;
}



#quiz_block{
	background-color: #D5F2D6;
	border-radius: 25px;
	padding: 30px 15px 20px;
}
.quiz .answer{
	background-color:#FAEBD7;
	border-radius: 25px;
	padding: 30px 15px 20px;
}
#result_block{
	background-color: #D5F2D6;
	border-radius: 25px;
	padding: 30px;
}
#result_guide{
	background-color:#fff;
	border-radius: 25px;
	padding: 60px 15px;
}

#result_block h6{
	border-bottom: none !important;
	font-size: 2em !important;
	margin: 1em 0;
}

.quiz .quiz_content dl {
	margin: 0 0 15pt;
	padding-bottom: 15px;
	font-size: 1.8em;
	line-height: 1.5em;
	font-weight: bold;
	border-bottom: dashed 2px #6EC873;
	text-align: left;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
}

.quiz .quiz_content dl dt{
	width: 8%;
}

.quiz .quiz_content dl dt span{
	background-color: #fff;
	border-radius: 50%;
	color: #05870D;
	display: inline-block;
	line-height: 60px;
	text-align: center;
	height: 60px;
	width: 60px;
}

.quiz .quiz_content dl dd {
	width: 92%;
}




.wavy{
	text-decoration: #05870D wavy underline;
	text-underline-offset: 5px;
}


.quiz .answer dl {
	border-bottom: dashed 2px #E8A853;
}


.quiz .answer dl dt span{
	color: #E8A853;
}


.quiz .answer dl dd {
	line-height: 2em;
}



.quiz .quiz_content .choice{
	margin: 20px 0;
}

.quiz .quiz_content .choice div{
	margin: 10px 0;
    display: flex;
    position: relative;
}

.quiz .quiz_content .choice input[type=radio] {
	display: none;
}
.quiz .quiz_content .choice label {
	background-color: #fff;
	width: 100%;
	border-radius: 25px;
	margin: 0;
	display: block;
	text-decoration: none;
	border: solid 2px #fff;
	box-sizing: border-box;
	font-weight: bold;
	padding: 15px;
	text-align: left;
	font-size: 1.5em;
	cursor: pointer;
}


.quiz .quiz_content .choice input[type=radio]:checked + label, .quiz .quiz_content .choice label:hover {
	border:solid 2px #05870D;
	background-color:#FAEBD7;
}

.choice label:has([id^="answer_text"]:hover) {
	border:solid 2px #05870D;
	background-color:#FAEBD7;
}

.quiz .quiz_content .choice label span{
	color: #05870D;
	font-weight: bold;
	width: 80px;
	display: inline-block;
}

.quiz .quiz_content .choice label p{
	display: inline-block;
}

.quiz .quiz_content ol{
	list-style-type: decimal;
	margin: 8px 0 8px 1em;
}

.quiz .quiz_content ul{
	list-style-type: disc;
	margin: 8px 0 8px 1em;
}

/*
.quiz .quiz_content .choice div a{
	background-color: #fff;
	width: 100%;
	border-radius: 25px;
	margin: 0;
	display: block;
	text-decoration: none;
	border: solid 2px #fff;
	box-sizing: border-box;
	font-weight: bold;
	padding: 8px 0;
}

.quiz .quiz_content .choice div a:hover{
	border:solid 2px #05870D;
}

.quiz .quiz_content .choice div a span{
	color: #05870D;
	font-weight: bold;
	width: 80px;
	display: inline-block;
}*/

.quiz .quiz_content .answer_detail{
	background-color: #fff;
	margin: 10px 0;
	width: 100%;
	border-radius: 25px;
	padding: 15px;
	box-sizing: border-box;
	text-decoration: none;
	border: solid 2px #fff;
	line-height: 2.5em;
	text-align: left;
	font-weight: bold;
}

.quiz .quiz_content .answer_detail p .check{
	display: block;
	font-size: 1.5em;
	text-indent: 0em;
	margin-bottom: 16px;
}

.quiz .quiz_content .answer_detail p .correct{
	color: #E64E69;
}

.quiz .quiz_content .answer_detail p .incorrect{
	color: #4DA5E6;
}


.quiz .quiz_content .answer_detail div{
	text-align: center;
}

.quiz .quiz_content .answer_detail div img{
	max-width: 800px;
	margin: 0 auto;
}

.quiz .quiz_content .next{
	text-align: right;
	margin: 20px 0;
}

.quiz .quiz_content .next button{
	display: inline-block;
	width: 280px;
	border: solid 2px #05870D;
	border-radius: 50px;
	padding: 16px 0;
	text-decoration: none;
	background-color: #fff;
	color: #05870D;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
	line-height: 1em;
}

.quiz .quiz_content .next button:hover{
	background-color: #05870D;
	color: #fff;
}


.quiz .quiz_content .hint{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	width: 100%;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}


.quiz .quiz_content .hint .balloon1-right {
  	position: relative;
  	display: inline-block;
 	max-width: 100%;
 	background: #fff;
	border-radius: 30px;
	margin: 24px;
	padding: 16px;
}

.quiz .quiz_content .hint .balloon1-right:before {
  	content: "";
  	position: absolute;
  	top: 30%;
  	left: 100%;
  	margin-top: -15px;
  	border: 15px solid transparent;
  	border-left: 15px solid #fff;
}

.quiz .quiz_content .hint .balloon1-right p {
 	line-height: 1.5em;
	text-indent: 0 !important;
}

.quiz .quiz_content .hint .balloon1-right p a{
	color: #05870D ;
}

.quiz .quiz_content .hint div img{
	height: 200px;
}



.stepBar {
  display: flex;
  width: 100%;
  position: relative;
  margin: 20px 0;
  text-align: center;
}
.stepBar li {
  font-size: 12px;
  list-style: none;
  position: relative;
  width: 20%;
}
.stepBar li:after {
  background: #D5F2D6;
  content: "";
  width: calc(100% - 24px);
  height: 4px;
  position: absolute;
  left: calc(-50% + 12px);
  top: 18px;
}
.stepBar li:first-child:after {
  display: none;
}
.stepBar li span {
  background: #D5F2D6;
  color: #ffffff;
  display: inline-block;
  height: 24px;
  margin-bottom: 5px;
  line-height: 24px;
  width: 24px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}
.stepBar .visited:after {
  background: #05870D;
}
.stepBar .visited span {
  background: #05870D;
}



.education section div img{
	margin-bottom: 20px;
	padding: 0;
}

.education section .p10{
	font-size: 1.3em !important;
}

.education section .edu_list{
	font-size: 1.3em !important;
	text-align: left !important;
	margin: 1em 0 1em 1.5em !important;
	list-style-type: circle !important;
}

.education .link_next ul{
	list-style-type: none;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}

.education .link_next ul li{
	width: 49%;
	margin-bottom: 10px;
}




.education .link_next ul li a{
    padding: 25px 20px;
    background-color: #05870D;
    color: #fff;
    border: solid 1px #05870D;
    font-weight: bold;
    border-radius: 25px;
    text-align: center;
    line-height: 0;
	text-decoration: none;
	font-size: clamp(5px, 4.5vw, 1.2em);
	width: 100%;
	display: block;
}


.education .link_next ul .active span{
    padding: 25px 20px;
    background-color: #fff;
    color: #05870D;
    border: solid 1px #05870D;
    font-weight: bold;
    border-radius: 25px;
    text-align: center;
    line-height: 0;
	text-decoration: none;
	font-size: 1.2em;
	width: 100%;
	display: block;
}




.education .link_next a:hover {
    background-color: #fff;
    color: #05870D;
    transition: all .3s;
}

.education .link_next li:first-child a span{
	position: relative;
	padding-left:   10px;
}

.education .link_next li:last-child a span{
	position: relative;
	padding-right: 10px;
}

.education .link_next li:first-child a span:before {
    content: "";
    position: absolute;
    top: 0.35em;
    left: -5px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
  	border-right: 5px solid #fff;
  	border-bottom: 5px solid transparent;
}
.education .link_next li:first-child a:hover span:before{
	border-right: 5px solid #05870D;
}



.education .link_next li:last-child a span:before {
    content: "";
    position: absolute;
    top: 0.35em;
    right: -5px;
    width: 0;
    height: 0;
   border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #fff;
}

.education .link_next li:last-child a:hover span:before {
  	 border-color: transparent transparent transparent #05870D;
}

.education .share{
	margin: 30px 0 60px;
	text-align: center;
}



.education .share p{
  position: relative;
  display: inline-block;
  padding: 0 55px;
	font-size: 1.2em;
	font-weight: bold;
}

.education .share p:before, .education .share p:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: black;
}

.education .share p:before {
  left:0;
}
.education .share p:after {
  right: 0;
}

.education .share ul{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
	padding: 0;
}

.education .share ul li{
	margin: 5px;
	width: 200px;
	border: none;
	display: block;
}

.education .share ul li a{
	width: 100%;
	display: inline-block;
	text-align: center;
	border-radius: 30px;
	padding: 8px 0;
	color: #fff;
	margin: 0;
	font-weight: bold;
	text-decoration: none;
}

.education .share ul li a:hover{
	opacity: 0.8;
}


.education .share ul .e_twitter a{
	background-color: #1DA1F2;
}

.education .share ul .facebook a{
	background-color: #1877f2;
}

.education .share ul .instagram a{
	background: #f09433; 
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
}

.education .back_button, .q_back_button{
	margin: 20px 0;
}

.education .back_button a, .q_back_button a{
    padding: 20px 20px;
	width: 240px;
	display: block;
    background-color: #05870D;
    color: #fff;
    border: solid 1px #05870D;
    font-weight: bold;
    border-radius: 25px;
    text-align: center;
    line-height: 0;
	text-decoration: none;
	font-size: 1.2em;
	margin: 0 auto;
}



.education .elementary_top{
	width: 100%;
}
	
.education_map_sp{
	display: none;
}

.education .elementary_top .education_map{
	position: relative;
}


.education .elementary_top .education_map img{
	width: 100% !important;
}

.education .elementary_top .education_map a{
	text-decoration: none;
	font-size: 1.3em;
	font-weight: bold;
	box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
	padding: 10px 24px 8px;
	border-radius: 30px;
}

.education .elementary_top .education_map .fukidashi {
    display: none;
	padding: 0;
	margin: 0;
	position: absolute;
	box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
	width: 150px;
	height: 150px;
	border-radius: 5px;
}

.education .elementary_top .education_map .fukidashi:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -30px;
  margin-top: -15px;
  border: 15px solid transparent;
  border-right: 15px solid #fff;
}
.education .elementary_top .education_map .fukidashi img{
	width: 150px;
	height: 150px;
	border-radius: 5px;
	border:solid 2px #fff;
	object-fit: cover;
}

.education .elementary_top .education_map a:hover + div {
      display: block;
}


.education .elementary_top .education_map .elementary1 a{
	position: absolute;
	top: 40%;
	right: 40%;
	background-color: #EFF7FD;
	border:solid 3px #68B3EA;

}

.education .elementary_top .education_map .elementary1 a:hover{
	color: #68B3EA;
}


.education .elementary_top .education_map .elementary1 .fukidashi{
	top: 35%;
	right: 30%;
}

.education .elementary_top .education_map .elementary2 a{
	position: absolute;
	top: 70%;
	right: 50%;
	background-color: #CEEDD7;
	border:solid 3px #3EA85C;

}

.education .elementary_top .education_map .elementary2 a:hover{
	color: #3EA85C;
}

.education .elementary_top .education_map .elementary2 .fukidashi{
	top: 62%;
	right: 40%;
}



.education .elementary_top .education_map .elementary3 a{
	position: absolute;
	top: 20%;
	right: 20%;
	background-color: #FDF2E5;
	border:solid 3px #F7A74E;

}

.education .elementary_top .education_map .elementary3 a:hover{
	color: #F7A74E;
}

.education .elementary_top .education_map .elementary3 .fukidashi{
	top: 15%;
	right: 10%;
}


.education .elementary_top .education_map .elementary4 a{
	position: absolute;
	top: 15%;
	right: 65%;
	background-color: #F0EEFD;
	border:solid 3px #7968EC;

}

.education .elementary_top .education_map .elementary4 a:hover{
	color: #7968EC;
}

.education .elementary_top .education_map .elementary4 .fukidashi{
	top: 10%;
	right:55%;
}




.education .elementary_top .education_map .elementary5 a{
	position: absolute;
	bottom: 15%;
	right: 15%;
	background-color: #FCF1F0;
	border:solid 3px #E5634F;

}

.education .elementary_top .education_map .elementary5 a:hover{
	color: #E5634F;
}

.education .elementary_top .education_map .elementary5 .fukidashi{
	bottom: 10%;
	right: 5%;
}


.education .elementary_top .education_map a:hover{
	background-color: #fff;
}

#page-inner_edu{
	background-repeat: repeat;
	margin:  0;
	padding: 20px 0;
}

.education .elementary_lower1, .education .middlehigh_lower{
	width: 100%;
	max-width: 1010px;
	margin: 0 auto;
	padding: 20px 20px;
}

.education .adult_lower{
	width: 100%;
	max-width: 1010px;
	margin: 0 auto;
	padding: 20px 20px;
	background-color: #fff;
}




.education .elementary_lower1 .elementary1_map img{
	width: 100%;
	margin: 20px 0;
	border-radius: 15px;
	border: solid 5px #fff;
}


.education .middlehigh_lower .elementary1_map img{
	margin: 20px 0;
	border-radius: 15px;
	border: solid 5px #fff;
}

.education .elementary_lower1 .elementary1_map{
	position: relative;
}

.education .elementary_lower1 .elementary1_map .map_sp{
	display: none;
}



.education .elementary_lower1 .elementary1_map .pin #park{
	position: absolute;
	bottom: 15%;
	right: 48%;
}

.education .elementary_lower1 .elementary1_map .pin #library{
	position: absolute;
	top: 12%;
	right: 25%;
}

.education .elementary_lower1 .elementary1_map .pin #restaurant{
	position: absolute;
	top: 20%;
	right: 8%;
}

.education .elementary_lower1 .elementary1_map .pin #school{
	position: absolute;
	top: 20%;
	left: 10%;
}

.education .elementary_lower1 .elementary1_map .pin #hospital{
	position: absolute;
	top: 30%;
	left: 50%;
}

.education .elementary_lower1 .elementary1_map .pin #living{
	position: absolute;
	top: 65%;
	left: 40%;
}

.education .elementary_lower1 .elementary1_map .pin #kitchen{
	position: absolute;
	top: 65%;
	right: 20%;
}

.education .elementary_lower1 .elementary1_map .pin #kidsroom{
	position: absolute;
	top: 35%;
	left: 35%;
}

.education .elementary_lower1 .elementary1_map .pin #bedroom{
	position: absolute;
	top:40%;
	right: 20%;
}

.education .elementary_lower1 .elementary1_map .pin #roof{
	position: absolute;
	top:10%;
	left: 40%;
}




.cls-1{stroke-width:5px;}
.cls-1,.cls-2,.cls-3{stroke:#fff;stroke-miterlimit:10;}
.cls-1,.cls-3{fill:#fff;}
.cls-2{fill:#FFA000;stroke-width:10px;}
.cls-3{stroke-width:4.32px;}

.education .elementary_lower1 .elementary1_map .pin svg:hover .cls-2{
	fill:#FF7F72;
}

#living_box, #kitchen_box, #kidsroom_box, #bedroom_box, #roof_box{
	max-width: 600px; 
	background-color: #fff;
	box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
}

#living_box img, #kitchen_box img, #kidsroom_box img, #bedroom_box img, #roof_box img{
	width: 100%;
}

#living_box h4, #kitchen_box h4, #kidsroom_box h4, #bedroom_box h4, #roof_box h4{
	padding: 10px;
	font-size:1.4em;
	border-left: solid 5px #ffaf58;
	margin:20px;
	text-align: left !important;
}

#living_box p, #kitchen_box p, #kidsroom_box p, #bedroom_box p, #roof_box p{
	text-align: left;
	padding: 0.5em;
	font-size: 1.3em;
}

.balloon5 {
  width: 100%;
  margin:20px 0;
  display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
}

.balloon5 .faceicon {
  width: 20%
}

.balloon5 .faceicon img{
	margin:0;
	padding: 0;
}

.balloon5 .faceicon p{
	margin: 0;
	font-weight: bold;
	font-size: 0.9em;
	background-color: #fff;
	display: inline-block;
	padding: 5px;
}


.balloon5 .chatting {
  width: 80%;
}

.says, .says2 {
  width: 100%;
  padding: 15px 40px;
  border-radius: 120px;
box-sizing: border-box;
  background: #FFFCFA;
	border: solid 3px #Fff;
	box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
	position: relative;
}

.says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 45%; 
  left: -24px;
  border: 12px solid transparent;
  border-right: 12px solid #fff;
}

.says2:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 45%; 
  right: -24px !important;
  border: 12px solid transparent;
  border-left: 12px solid #fff;
}


.balloon5 .chatting p{
	text-align: left;
	font-family: 'Zen Maru Gothic', sans-serif;
	line-height: 2em;
    font-size: 1.5rem;
    margin: 0;
}


.education .summary{
	position: relative;
	border:1px solid #FEBA6A;
	padding: 20px;
	background-color: #fff;
    font-size: 1.5rem;
    margin: 0;
}

.education .summary p{
	text-align:left; 
    margin: 0;
}

.education .summary:before{
border-bottom:30px solid transparent;
border-left:30px solid #FEBA6A;
content: '';
display: block;
position: absolute;
top: 0px;
left: 0px;
}

.education .summary:after{
border-left:30px solid transparent;
border-bottom:30px solid #FEBA6A;
content: '';
display: block;
position: absolute;
bottom: 0px;
right: 0px;
}

.box74{
margin: 1em auto; 
background-color: #fafafa; 
padding:3em 2em 2em; 
position:relative;
border: 1px solid #4682B4;	
	font-size: 1.5em;
	line-height: 2em;
	font-weight: 500;
	text-align: left;
}
.box74 .box-title {
background-color: #4682B4; 
color: #fff ; 
padding: 7px 10px;
line-height: 1;
position:absolute;	
top: -10px; 
left: 20px; 
	
}

.box74 p{
	text-align: left;
	margin: 0;
	padding: 0;
}

.box74 .intro{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	margin: 5px 0 0 0;
	padding: 0;
	background-color: #fafafa; 
}

.box74 .intro img{
	width: 120px;
	padding-right: 10px;
}

.box74 .intro h4{
	margin: 0;
	padding: 0;
}

.box74 .intro h4 span{
	font-size: 0.8em;
	margin-left: 1em;
}

.box74 ol{
	list-style-type: decimal;
	margin-left: 1em;
}

.box74 .button{
	text-align: center;
	margin: 20px 0;
}

.box74 .button a{
	padding: 25px 20px;
    background-color: #05870D;
    color: #fff;
    border: solid 1px #05870D;
    font-weight: bold;
    border-radius: 25px;
	font-size: 0.9em;
    text-align: center;
    line-height: 0;
	margin: 0 auto;
	text-decoration: none;
	width: 400px;
	display: block;
}

.box74 .button a:hover {
    background-color: #fff;
    color: #05870D;
    transition: all .3s;
}



.education .reference{
	text-align: right;
	font-size: 0.9em;
	font-weight: bold;
}

#page-inner_edu  .link_tab ul{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin: 20px 0;
}

#page-inner_edu  .link_tab ul li{
	width: 49%;
	border: solid 3px #05870d;
	padding: 10px;
	box-sizing: border-box;
	border-radius: 50px;
	font-size: 1.5em;
	font-weight: bold;
}

#page-inner_edu .link_tab ul li:first-child{
	color: #05870d;
}

#page-inner_edu .link_tab ul li:last-child{
	background-color: #05870d;
	
}

#page-inner_edu .link_tab ul li a{
	width: 100%;
	height: 100%;
	display: block;
	text-decoration: none;
	color: #fff;
	
}


#page-inner_edu .middlehigh_lower .box74 p{
	font-size: 0.9em;
}

 #page-inner_edu .middlehigh_lower .balloon5 .chatting p{
	font-size: 1em;
    margin: 0;
}


#page-inner_edu .middlehigh_lower h3 {
  position: relative;
  text-align: center;
  border: 2px solid #4682B4; 
  background: #4682B4;
	margin: 80px 0;
	font-size: 2em;
	color: #fff;
}

#page-inner_edu .middlehigh_lower h3:before,
#page-inner_edu .middlehigh_lower h3:after {
  position: absolute;
  content: '';
}

#page-inner_edu .middlehigh_lower h3:before {
  top: -40px;
  left: calc(50% - 40px);
  width: 80px;
  height: 80px;
  border: 2px solid #4682B4; 
  border-radius: 50%;
  background: #4682B4; ;
}

#page-inner_edu .middlehigh_lower h3:after {
  top: 4px;
  left: 4px;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 2px dashed #fff; 
  background: #4682B4;
}

#page-inner_edu .middlehigh_lower h3 i {
  font-size: 1.5rem;
  line-height: 60px;
  position: absolute;
  z-index: 2;
  top: -40px;
  left: calc(50% - 40px);
  width: 80px;
  height: 60px;
  text-align: center;
}

#page-inner_edu .middlehigh_lower h3 span {
  position: relative;
  z-index: 1;
  display: block;
  padding: 1.5rem;
}

#page-inner_edu .middlehigh_lower h3 span:before,
#page-inner_edu .middlehigh_lower h3 span:after {
  position: absolute;
  content: '';
}

#page-inner_edu .middlehigh_lower h3 span:before {
  top: -34px;
  left: calc(50% - 34px);
  width: 68px;
  height: 40px;
  border: 2px dashed #fff; 
  border-radius: 50vw 50vw 0 0;
}

#page-inner_edu .middlehigh_lower h3 span:after {
  position: absolute;
  top: 4px;
  left: calc(50% - 32px);
  width: 64px;
  height: 10px;
  background:#4682B4;
}

#page-inner_edu .middlehigh_lower .sitelink{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}


#page-inner_edu .middlehigh_lower .sitelink li{
	width: 50%;
	text-align: left;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 10px;
}

#page-inner_edu .middlehigh_lower .sitelink li a{
	text-align: left;
	text-decoration: none;
	margin-left: 20px;
	font-size: 0.9em;
}


#page-inner_edu .middlehigh_lower .sitelink li a:hover{
	text-decoration: underline;
}

#page-inner_edu .middlehigh_lower .sitelink li:before {
    content: '';
    width: 0;
    height: 0;
    border: solid 7px transparent;
    border-left: solid 7px #4682B4;
    position: absolute;
}

.middlehigh_top{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}


#page-inner_edu .middlehigh_top li{
	width:  49%;
	margin: 0;
	position: relative;
	overflow:hidden;
	border-radius: 5px;
	height: 180px;
	border: solid 1px #fff;
}

.middlehigh_top li a{
	height: 100%;
	border-radius: 5px;
	padding: 0;
	margin: 0;
}

.middlehigh_top li a img{
	border-radius: 5px;
}

.middlehigh_top li a:hover img{
	transform:scale(1.1,1.1);
  transition:1s all;
}

.middlehigh_top li span{
	position: absolute;
	display: inline-block;
	font-weight: bold;
	 top: 50%;
	font-size: 1.8em;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
              -2px 2px 0 #FFF, 2px -2px 0 #FFF,
              0px 2px 0 #FFF,  0-2px 0 #FFF,
              -2px 0 0 #FFF, 2px 0 0 #FFF;
}



#page-inner_edu .adult_lower h4{
	margin: 1.5em 0 1em 0.5em;
    padding-left: 7px;
    border-left: 8px solid #6EC873;
    line-height: 1.3em;
    font-size: 1.5em;
	text-align: left;
}

#page-inner_edu .adult_lower p{
	text-align: left;
	font-size: 1.2em;
	margin: 1em 0.5em;
}

.quiz_top li{
	width:  33%;
	margin: 0;
	position: relative;
	overflow:hidden;
	border-radius: 5px;
	height: 180px;
	border: solid 1px #fff;
}




#quiz{
	background-repeat: repeat;
	margin:  0;
	border: solid 1px #eee;
	padding: 20px 0;
	
}

#quiz section{
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding: 50px 0;
}


@media (max-width: 800px) {
	
	.quiz .quiz_course {
		-ms-flex-wrap: wrap;
  		flex-wrap: wrap;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}


	.quiz .quiz_course div a{
		margin-bottom: 10px;
		width: 180px;
	}
	

	.quiz{
		margin: 20px;
		font-size: 0.9em;
	}
	

	
	.quiz .quiz_content dl dt{
		width: 80px;
	}



	.quiz .quiz_content dl dd {
		width: 70%;
	}

	.quiz .quiz_content .choice div a{
		margin: 0;
	}
	
	.quiz .quiz_content .choice label span{
		display: inline;
		margin: 0 5px 0 0;	
	}
	
	

	
	.quiz .quiz_content .answer_detail div img{
		width: 80%;
		margin: 0 auto;
	}

	
	.quiz .quiz_content .hint{
		display: block;
		text-align: left;
		margin-bottom: 50px;
	}

	.quiz .quiz_content .hint .balloon1-right{
		margin: 0 0 30px 0;
		width: 100%;
	}
	
	.quiz .quiz_content .hint .balloon1-right:before {
  		top: 100%;
  		left: 25%;
	}


	.quiz .quiz_content  .next{
		text-align: center;
	}

	.quiz .quiz_content .next button{
		width: 200px;
	}
	
	.education section div img{
		width: 100% !important;
		margin-bottom: 10px;
}

	
	.education_map{
		display: none;
	}
	
	.education_map_sp{
		display: block;
	}
	
	
	.education_map_sp .map{
	position: relative;
}

.elementary_top_sp #link1{
	position: absolute;
	bottom: 70%;
	right: 50%;
}

.elementary_top_sp #link2{
	position: absolute;
	bottom: 30%;
	left: 10%;
}

.elementary_top_sp #link3{
	position: absolute;
	top: 20%;
	right: 8%;
}

.elementary_top_sp #link4{
	position: absolute;
	top: 15%;
	left: 15%;
}
.elementary_top_sp #link5{
	position: absolute;
	bottom: 10%;
	right: 20%;
}
	
	#link1_box, #link2_box, #link3_box, #link4_box, #link5_box{
		width: 90%;
		margin: 0 auto;
		background-color: #fff;
		text-align: center;
		padding-bottom: 50px;
		  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
	}
	
	#living_box, #kitchen_box, #kidsroom_box, #bedroom_box, #roof_box{
	width: 90%;
		margin: 0 auto;
		background-color: #fff;
		text-align: center;
		  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
	
	
	
	
	#link1_box img, #link2_box img, #link3_box img, #link4_box img, #link5_box img{
		width: 100%;
		padding-bottom: 20px;
	}

	#link1_box a{
		background-color: #EFF7FD;
		border:solid 3px #68B3EA;
		width: 100%;
		box-sizing: border-box;
		text-decoration: none;
		font-size:clamp(5px, 3vw, 1.3em);
        white-space: nowrap;
		font-weight: bold;
		padding: 10px 24px 8px;
		border-radius: 30px;
	}
	
	#link2_box a{
	background-color: #CEEDD7;
	border:solid 3px #3EA85C;
		width: 100%;
		box-sizing: border-box;
		text-decoration: none;
		font-size:clamp(5px, 3vw, 1.3em);
        white-space: nowrap;
		font-weight: bold;
		padding: 10px 24px 8px;
		border-radius: 30px;

}


#link3_box a{
	background-color: #FDF2E5;
	border:solid 3px #F7A74E;
	width: 100%;
		box-sizing: border-box;
		text-decoration: none;
		font-size:clamp(5px, 3vw, 1.3em);
        white-space: nowrap;
		font-weight: bold;
		padding: 10px 24px 8px;
		border-radius: 30px;

}


#link4_box a{
	background-color: #F0EEFD;
	border:solid 3px #7968EC;
	box-sizing: border-box;
		text-decoration: none;
		font-size:clamp(5px, 3vw, 1.3em);
        white-space: nowrap;
		font-weight: bold;
		padding: 10px 24px 8px;
		border-radius: 30px;

}

#link5_box a{
	background-color: #FCF1F0;
	border:solid 3px #E5634F;
	box-sizing: border-box;
		text-decoration: none;
		font-size:clamp(5px, 3vw, 1.3em);
        white-space: nowrap;
		font-weight: bold;
		padding: 10px 24px 8px;
		border-radius: 30px;

}

	.education .elementary_lower1{
	width: 100%;
	margin: 0 auto;
	padding: 20px 0px;
}

	
	
	.education .elementary_lower1 .elementary1_map .map_pc{
	display: none;
}
	
	.education .elementary_lower1 .elementary1_map .map_sp{
	display: block;
}
	.education .elementary_lower1 .elementary1_map .map_sp img {
		border: none;
		border-radius: 0px;
	}
	
	.education .elementary_lower1 .elementary1_map img {
		border: none;
		border-radius: 0px;
}
	
	
	
	
	.education .link_next ul {
	padding: 0 20px;
}

	.elementary_lower1 .balloon5 {
		padding: 0 20px;
		
	}
	
	.elementary_lower1 .says2 p, .elementary_lower1 .says p {
		font-size: 1.4em;
	}
	
	.elementary_lower1 .summary{
		width: calc(100% - 40px);
		margin: 0 auto;
	}

	.elementary_lower1 .summary p{
		font-size: 1.2em;
	}
	
	#page-inner_edu .middlehigh_lower .sitelink {
	display:block; 
}


#page-inner_edu .middlehigh_lower .sitelink li {
	width: 100%;
}

	.box74{
padding:3em 1.5em 1.5em; 
	font-size: 1.2em;
	line-height: 1.8em;
}
	
	.quiz_top li{
	width:  100% ;
	margin-bottom: 10px;

}

	
	
}



@media (max-width: 600px) {
	
	#page-title_quiz h3{
		font-size: 2.5em;
		padding: 0 5px;
		box-sizing: border-box;
	}	
	
	
	
	.quiz .quiz_course {
		-ms-flex-wrap: wrap;
  		flex-wrap: wrap;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
	
	.quiz .quiz_course div a{
		margin-bottom: 10px;
		width: 180px;
	}
	
	
	
	.quiz .quiz_content .choice {
		padding: 0;
		margin: 0;
	}
	
	.quiz .quiz_content .choice div a {
		padding: 8px 0;
	}
	


	.quiz .quiz_content dl dd {
		width: 80%;
	}



	.quiz .quiz_content .answer_detail div img {
		width: 80%;
		margin: 0 auto;
	}

	
	.quiz .quiz_content .hint{
		display: block;
		text-align: left;
		margin-bottom: 50px;
	}

	.quiz .quiz_content .hint .balloon1-right {
		margin: 0 0 30px 0;
		width: 100%;
	}

	.quiz .quiz_content .hint .balloon1-right:before {
  		top: 100%;
  		left: 25%;
	}

.quiz .quiz_content .choice label p{
	display: block;
	width: 100%;
	text-indent: inherit;
	padding: 0;
	margin: 0;
}

	.quiz .quiz_content .next{
		text-align: center;
	}

	.quiz .quiz_content .next button{
		width:90%;
	}

	#sumaito-f .inner{
		display: block !important;
	}
	
	
	#sumaito-f div.logo-left {
	display: block;
		width: 100% !important;
	}
		
	#sumaito-f div.logo-left a img {
    max-width: 375px;
	min-width: 120px;
    width: 70%;
}

#sumaito-f div.menu-right {
	display: block;
	width: 100% !important;
	padding: 0;
	text-align: left;
	margin-top: 5px;
    vertical-align: top;
}
	
	.education .link_next ul{
		display: block;
		margin: 0;
		padding: 0;
}
	
	.education .link_next ul li{
		display: block;
	}
	
	
	.education .link_next ul li:last-child{
		margin-top:30px;
	}
	
	
	
.education　section div img{
	width: 100% !important;
	margin-bottom: 10px;
	max-width: 100%;
}

	.elementary_top_sp #link1{
	position: absolute;
	bottom: 70%;
	right: 50%;
}

.elementary_top_sp #link2{
	position: absolute;
	bottom: 35%;
	left: 10%;
}

.elementary_top_sp #link3{
	position: absolute;
	top: 5%;
	right: 8%;
}

.elementary_top_sp #link4{
	position: absolute;
	top: 0%;
	left: 15%;
}
.elementary_top_sp #link5{
	position: absolute;
	bottom: 10%;
	right: 20%;
}
	
	.elementary1_map svg{
		width: 30px;
		height: 60px;
	}
	
	
	
.education .elementary_lower1 .elementary1_map .pin #library{
	position: absolute;
	top: 5%;
	right: 25%;
}

.education .elementary_lower1 .elementary1_map .pin #restaurant{
	position: absolute;
	top: 20%;
	right: 8%;
}

.education .elementary_lower1 .elementary1_map .pin #school{
	position: absolute;
	top: 20%;
	left: 10%;
}

.education .elementary_lower1 .elementary1_map .pin #hospital{
	position: absolute;
	top: 30%;
	left: 50%;
}

.education .elementary_lower1 .elementary1_map .pin #living{
	position: absolute;
	top: 65%;
	left: 40%;
}

.education .elementary_lower1 .elementary1_map .pin #kitchen{
	position: absolute;
	top: 65%;
	right: 20%;
}

.education .elementary_lower1 .elementary1_map .pin #kidsroom{
	position: absolute;
	top: 35%;
	left: 35%;
}

.education .elementary_lower1 .elementary1_map .pin #bedroom{
	position: absolute;
	top:40%;
	right: 20%;
}

.education .elementary_lower1 .elementary1_map .pin #roof{
	position: absolute;
	top:10%;
	left: 40%;
}

.education .link_next ul{
	display: block;
	padding: 0 20px;
}

.education .link_next ul li{
	width: 100%;
}


	.balloon5{
		display: block;
	}
	
	.reverse{
		display:-webkit-box;
  		display:-ms-flexbox;
  		display:flex;
		-ms-flex-wrap: wrap-reverse;
	flex-wrap: wrap-reverse;
	}
	
	.balloon5 .faceicon{
		width: 100%;
		display: block;
		text-align:right;
	}
	
	.reverse .faceicon{
		width: 100%;
		display: block;
		text-align: left;
	}
	
	
.balloon5 .faceicon img{
	width: 150px !important;
	
}

.balloon5 .faceicon p{
	display: block;
	background-color: transparent;
	text-align: right;
	padding: 0 10px;
}

	.reverse .faceicon p{
		text-align: left;
	}
	

.balloon5 .chatting {
  width: 100%;
}

.says, .says2 {
  width: 100%;
  padding: 10px;
  border-radius: 10px;
	box-sizing: border-box;
  background: #FFFCFA;
	border: solid 3px #Fff;
	box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
	position: relative;
	font-size: 1.2em;
}

.says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 100%;
  left: 10%;
  border: 15px solid transparent;
	border-top: 15px solid #fff;
}

.says2:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 100%;
  right: 10% !important;
  border: 15px solid transparent;
	border-top: 15px solid #fff;
}
	
	
	
	
	
	.elementary_lower1 .says2 p, .elementary_lower1 .says p{
		font-size: 1.2em;
	}
	
	
	
	
		.middlehigh_top{
	display: block;
			margin: 0 20px;
}

	.middlehigh_lower h3{
		font-size: 1.5em !important;
	}
	
	
#page-inner_edu .middlehigh_top li{
	width: 100%;
	margin-bottom: 10px;
	height: 150px;
}
	
	#page-inner_edu .middlehigh_top li img{
		min-height: 150px;
	}	
	
	.middlehigh_top li span{
	position: absolute;
	display: inline-block;
		width: 100%;
	font-weight: bold;
	 top: 50%;
	font-size: 1.6em;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
              -2px 2px 0 #FFF, 2px -2px 0 #FFF,
              0px 2px 0 #FFF,  0-2px 0 #FFF,
              -2px 0 0 #FFF, 2px 0 0 #FFF;
}
	
	
	
	.middlehigh_lower .says2 p, .middlehigh_lower .says p{
		font-size: 0.9em !important;
		font-family: 'sans-serif';

	}
	

	
}


[id^="answer_text"] {
  position:absolute;
    top: 50%;
    left: 50px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    font-weight: bold !important;
}