@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap');

@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 100;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 200;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 300;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 400;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Bold");
font-weight: bold;
}


html {
font-family: -apple-system, BlinkMacSystemFont, "Yu Gothic", YuGothic, Meiryo, メイリオ, sans-serif;
}
@media all and (-ms-high-contrast: none) {
	html {
	font-family: Verdana, Meiryo, sans-serif;
	}
}
@media all and (-ms-high-contrast: active) {
	html {
	font-family: Verdana, Meiryo, sans-serif;
	}
}


body {
position: relative;
margin: 0;
padding: 0px;
font-size: 16px;
font-weight: normal;
line-height: 1.6;
word-break: break-all;
color: #000;
}
@media screen and (max-width: 1920px) {
	body {
	}
}
@media screen and (max-width: 1280px) {
	body {
	}
}
@media screen and (max-width: 767px) {
	body {
	overflow-x: hidden;
	width: 100%;
	font-size: 15px;
	line-height: 1.5;
	}
}
.font1 {
font-family: Futura,'Century Gothic','Noto Sans JP',Meiryo,メイリオ,sans-serif;
}


/* リセット */
* {
margin: 0px;
padding: 0px;
border: 0;
outline: 0;
word-break: normal !important;
word-wrap: break-word;
line-break:normal ;
box-sizing: border-box;
-webkit-text-size-adjust:none;/*iPhone対策*/
}


table {
border-collapse: collapse;
border-spacing: 0;
}

ol, ul {
list-style: none;
}

h1, h2, h3, h4, h5, h6 {
line-height: 1.3;
}

a {
text-decoration: none;
color: inherit;
}
a:hover {
text-decoration: none;
}
a[href^="tel:"] {
pointer-events: none;
}
@media screen and (max-width: 767px) {
	a[href^="tel:"] {
	pointer-events: auto;
	}
}

/*ie
@media all and (-ms-high-contrast: none){ 
	img {
	width: 100%;
	}
}*/

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}

/* Lightbox避け */
.body_wrap img:not(#lightboxImage) {
display: block;
max-width: 100%;
height: auto;
margin-right: auto;
margin-left: auto;
}

.clearfix:after {
content:" ";
display:block;
clear:both;
}

section:after {
content:" ";
display:block;
clear:both;
}



/*---------------------------------------------------------------------
 共通設定
---------------------------------------------------------------------*/
.body_wrap {
overflow-x: hidden;
padding-top: 0;
}
@media screen and (max-width: 1280px) {
	.body_wrap {
	}
}
@media screen and (max-width: 1100px) {
	.body_wrap {
	}
}
@media screen and (max-width: 767px) {
	.body_wrap {
	}
}

/* ページ内リンク */
.anc {
z-index: -1 !important;
position: relative;
display: block;
padding-top: 150px;
margin-top: -150px;
}
@media screen and (max-width: 1000px) {
	.anc {
	padding-top: 120px;
	margin-top: -120px;
	}
}
@media screen and (max-width: 767px) {
	.anc {
	padding-top: 70px;
	margin-top: -70px;
	}
}

.clearfix:after {
content:" ";
display:block;
clear:both;
}

.wrap {
overflow-x: hidden;
position: relative;
margin-right: auto;
margin-left: auto;
}
.wrap:after {
content:" ";
display:block;
clear:both;
}

.pcNone {
display: none;
}
.sp2br {
display: none;
}
@media screen and (max-width: 767px) {
	.spNone {
	display: none !important;
	}
	.pcNone {
	display: inline-block !important;
	}
}
@media screen and (max-width: 400px) {
	.sp2br {
	display: inline-block;
	}
}


.full { /*画像をフル表示*/
width: 100% !important;
}

/* スクロールすると画像を表示 */
/*
.imgArea,
.sa {
opacity: 0;
transform: translate(0,60px); 
-webkit-transform: translate(0,60px); 
}
.scroll_anime_move {
opacity: 1.0;
transition: .8s;
}
*/

.link a {
display: block;
width: 100%;
height: 100%;
}



/*---------------------------------------------------------------------
 TOPページ
---------------------------------------------------------------------*/
#top {
}


/* ヘッダー */
header {
overflow: hidden;
height: 160px;
}
header .wrap {
overflow: hidden;
max-width: 1920px;
margin-right: auto;
margin-left: auto;
}
header .box {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
align-items: flex-end;
-webkit-box-align: end;
-ms-flex-align: end;
}
header .in1,
header .in2,
header .in3,
header .in4 {
}
header .in1 {
width: 605px;
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
align-items: flex-end;
-webkit-box-align: end;
-ms-flex-align: end;
padding-bottom: 25px;
padding-left: 45px;
padding-right: 24px;
}
header .in1>div {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
align-items: flex-end;
-webkit-box-align: end;
-ms-flex-align: end;
}
header .in1 p {
}
header h1 {
margin-left: 30px;
padding: 10px 8px;
font-size: 16px;
border: 2px solid #000;
border-radius: 5px;
}
header .logo {
}
header .in2 {
/*width: calc(100% - ( 605px + 270px + 250px ));*/
width: calc(100% - ( 605px + 270px ));
padding-bottom: 25px;
padding-right: 24px;
}
header .nav {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
justify-content: flex-end;
-webkit-box-pack: end;
-ms-flex-pack: end;
}
header .nav li {
position: relative;
padding: 0 8px;
font-weight: bold;
line-height: 1.3;
}
header .nav li::after {
position: absolute;
content: "/";
top: 50%;
transform: translateY(-50%);
-webkit- transform: translateY(-50%);
right: -4px;
}
header .nav li:last-of-type::after {
display: none;
}
header .nav li a {
}
header .nav li a:hover {
color: #9c0429;
transition: all 0.3s;
}
header .in3 {
width: 270px;
padding-top: 9px;
padding-bottom: 9px;
padding-right: 24px;
}
header .in3 p {
font-size: 20px;
font-weight: bold;
text-align: center;
line-height: 1.3;
color: #9c0429;
border: 2px solid #9c0429;
border-radius: 5px;
}
header .in3 p:hover {
color: #fff;
background-color: #9c0429;
transition: all 0.5s;
}
header .in3 p:nth-of-type(2) {
margin-top: 9px;
}
header .in3 p a {
display: block;
width: 100%;
height: 100%;
padding: 18px 5px;
}
header .in3 p:nth-of-type(1) {
}
header .in3 p:nth-of-type(2) {
}
header .in4 {
display: none;
width: 250px;
}
header .in4 a {
display: block;
width: 100%;
}
header .in4 p {
height: 160px;
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
justify-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
font-size: 20px;
font-weight: bold;
text-align: center;
line-height: 1.3;
color: #fff;
background-color: #9c0429;
}
header .in4 p:hover {
background-color: #002e73;
transition: all 0.5s;
}
.toggle,
.sp_menu {
display: none;
}
@media screen and (max-width: 1700px) {
	header .in1 {
	width: 510px;
	padding-left: 20px;
	padding-right: 10px;
	}
	header h1 {
	margin-left: 20px;
	}
	header .in1 p {
	width: 280px;
	}
	header .in2 {
	/*width: calc(100% - ( 510px + 180px + 180px ));*/
	width: calc(100% - ( 510px + 180px ));
	padding-right: 10px;
	}
	header .in3 {
	width: 180px;
	padding-right: 10px;
	}
	header .in3 p {
	font-size: 18px;
	}
	header .in3 p a {
	padding: 18px 2px;
	}
	header .in4 {
	width: 180px;
	}
}
@media screen and (max-width: 1400px) {
	header {
	height: 130px;
	}
	header .in1 {
	width: 390px;
	}
	header h1 {
	margin-left: 10px;
	padding: 10px 5px;
	font-size: 13px;
	}
	header .in1 p {
	width: 200px;
	}
	header .in2 {
	/*width: calc(100% - ( 390px + 150px + 150px ));*/
	width: calc(100% - ( 390px + 150px ));
	}
	header .in3 {
	width: 150px;
	}
	header .in3 p {
	font-size: 15px;
	}
	header .in3 p a {
	padding: 13px 2px;
	}
	header .in4 {
	width: 150px;
	}
	header .in4 p {
	height: 130px;
	font-size: 17px;
	}
}
@media screen and (max-width: 1200px) {
	header .in1 {
	display: block;
	width: 240px;
	text-align: center;
	}
	header .in1 > div {
	display: block;
	}
	header h1 {
	display: inline-block;
	margin-top: 10px;
	margin-left: 0;
	padding: 5px;
	}
	header .in1 p {
	width: 200px;
	}
	header .in2 {
	width: calc(100% - ( 240px + 150px ));
	/*width: calc(100% - ( 240px + 150px + 150px ));*/
	}
	header .nav li {
	font-size: 14px;
	}
	header .in3 {
	width: 150px;
	}
	header .in3 p {
	font-size: 13px;
	}
	header .in3 p a {
	}
	header .in4 {
	width: 150px;
	}
	header .in4 p {
	font-size: 14px;
	}
}
@media screen and (max-width: 1000px) {
	header {
	height: 100px;
	}
	header .box {
	align-items: flex-start;
	-webkit-box-align: start;
	-ms-flex-align: start;
	}
	header .in1 {
	/*width: calc(100% - ( 150px + 150px ));*/
	width: calc(100% - 150px);
	padding-left: 10px;
	padding-bottom: 0;
	text-align: left;
	}
	header .in1 > div {
	display: inline-block;
	margin-top: 10px;
	text-align: center;
	}
	header .logo {
	width: 170px;
	}
	header .in2 {
	display: none;
	}
	header .in3 {
	padding-top: 5px;
	padding-bottom: 0;
	}
	header .in3 p a {
	padding: 10px 2px;
	}
	header .in3 p:nth-of-type(2) {
	margin-top: 5px;
	}
	header .in4 p {
	height: 85px;
	margin-top: 5px;
	margin-right: 10px;
	border-radius: 5px;
	}
}
@media screen and (max-width: 767px) {
	header {
	height: 70px;
	}
	header .wrap {
	position: relative;
	height: 70px;
	}
	header .box {
	display: block;
	}
	header .in1 {
	width: inherit;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	left: 10px;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	}
	header .in1 > div {
	margin-top: 0;
	}
	header .in1 p {
	width: 150px;
	padding: 3px;
	}
	header h1 {
	margin-top: 4px;
	padding: 2px 5px;
	font-size: 11px;
	border: 1px solid #000;
	}
	header .in3 {
	width: 130px;
	position: absolute;
	/*right: 120px;*/
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	padding-top: 0;
	padding-bottom: 0;
	}
	header .in3 p {
	font-size: 13px;
	}
	header .in3 p a {
	padding: 2px 2px;
	}
	header .in4 {
	position: absolute;
	width: inherit;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	right: 10px;
	}
	header .in4 p {
	display: inline-block;
	width: inherit;
	height: inherit;
	font-size: 12px;
	margin-top: 0;
	padding: 19px 10px;
	border-radius: 5px;
	}
}
/*@media screen and (max-width: 450px) {*/
@media screen and (max-width: 320px) {
	header .in3 {
	display: none;
	}
}



/* スライド */
#bx-bg {
position: relative;
background-color: #f4f2e6;
}
.slide_wrap {
max-width: 100%;
}
.bx-wrapper {
}
.bx-viewport {
}
#slider {
}
#slider li {
}
@media screen and (max-width: 767px) {
}



/* TOPコンテンツ */
#top01,
#top02,
#top03 {
position: relative;
}
#top01 .wrap,
#top02 .wrap,
#top03 .wrap1,
#top03 .wrap2,
#top03 .wrap3 {
margin-right: auto;
margin-left: auto;
}

.link {
text-align: center;
}
.link>p {
position: relative;
display: inline-block;
width: 250px;
padding-right: 20px;
font-weight: bold;
line-height: 1.3;
color: #fff;
background-color: #002e73;
border-radius: 20px;
}
.link>p::after {
position: absolute;
content: "";
width: 11px;
height: 18px;
top: 50%;
transform: translateY(-50%);
-webkit- transform: translateY(-50%);
right: 40px;
background-image: url(../img/arrow02.png);
background-repeat: no-repeat;
background-size: cover;
}
.link>p:hover {
background-color: #3a6cb7;
transition: all 0.5s;
}
.link>p>a {
display: block;
width: 100%;
height: 100%;
padding: 15px 5px;
}
@media screen and (max-width: 767px) {
	.link>p {
	width: 200px;
	font-size: 14px;
	border-radius: 10px;
	}
	.link > p::after {
	right: 15px;
	}
	.link>p>a {
	padding: 10px 5px;
	}
}



/* 特徴 */
#top01 {
padding-top: 142px;
background-color: #eaeaec;
background-image: url(../img/bg01.jpg);
background-repeat: no-repeat;
background-size: 1920px auto;
background-position: bottom center;
}
#top01::before,
#top01::after {
z-index: +1;
position: absolute;
content: "";
width: 1920px;
height: 890px;
bottom: -263px;
left: 0;
right: 0;
margin: auto;
background-repeat: no-repeat;
}
#top01::before {
background-image: url(../img/top/about_before.png);
background-position: left bottom;
background-size: 712px auto;
}
#top01::after {
background-image: url(../img/top/about_after.png);
background-position: right bottom;
background-size: 400px auto;
}
#top01 .wrap1 {
z-index: +2;
position: relative;
max-width: 1500px;
margin-right: auto;
margin-left: auto;
}
#top01 .box1 {
position: relative;
padding-top: 143px;
padding-bottom: 103px;
padding-right: 20px;
padding-left: 20px;
text-align: center;
border: 2px solid #950120;
box-shadow: 0 0 2px #e4e5e7;
}
#top01 .box1 .ttl {
position: absolute;
width: 689px;
top: -40px;
right: 0;
left: 0;
margin-right: auto;
margin-left: auto;
background-color: #e7e9ea;
background-image: url(../img/top/about_ttl_bg.jpg);
background-size: 100% auto;
}
#top01 .box1 .ttl .sub {
margin-bottom: 10px;
font-size: 22px;
font-weight: bold;
line-height: 1.3;
}
#top01 .box1 .ttl h2 {
font-size: 30px;
}
#top01 .box1 .point {
max-width: 1260px;
margin-right: auto;
margin-left: auto;
}
#top01 .box1 .point ul {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
justify-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
margin: 0 -12px;
}
#top01 .box1 .point li {
width: 404px;
padding: 0 12px;
}
#top01 .box1 .point li img {
}
#top01 .box1 .point li h3 {
margin-top: 40px;
font-size: 20px;
font-weight: bold;
}
#top01 .box1 .point li .sub {
margin-top: 14px;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 1.3;
letter-spacing: 1px;
color: #eb6100;
}
#top01 .box1 .point li:nth-of-type(2) .sub {
color: #8fc31f;
}
#top01 .box1 .point li:nth-of-type(3) .sub {
color: #448aca;
}
#top01 .box1 .point .txt {
display: inline-block;
margin-right: auto;
margin-left: auto;
margin-top: 22px;
text-align: left;
}
#top01 .wrap2 {
max-width: 1260px;
margin-right: auto;
margin-left: auto;
padding-top: 180px;
padding-bottom: 97px;
}
#top01 .box2 {
max-width: 622px;
margin-left: auto;
text-align: center;
}
#top01 .box2 .ttl {
z-index: +2;
position: relative;
position: relative;
padding-top: 150px;
}
#top01 .box2 .ttl::before {
position: absolute;
content: "";
width: 151px;
height: 114px;
top: 0;
right: 0;
left: 0;
margin: auto;
background-image: url(../img/check01.png);
background-size: cover;
}
#top01 .box2 .ttl h2 {
margin-bottom: 25px;
font-size: 30px;
text-align: center;
line-height: 1.6;
color: #fff;
}
#top01 .box2 .txt {
z-index: +2;
position: relative;
display: inline-block;
max-width: 560px;
margin-right: auto;
margin-left: auto;
text-align: left;
color: #fff;
}
#top01 .link {
z-index: +2;
position: relative;
margin-top: 35px;
}
@media screen and (max-width: 1920px) {
	#top01 {
	background-size: 100% auto;
	}
	#top01::before,
	#top01::after {
	width: 100%;
	bottom: -180px;
	}
	#top01::before {
	background-size: 550px auto;
	}
	#top01::after {
	background-size: 308px auto;
	}
}
@media screen and (max-width: 1600px) {
	#top01 {
	}
	#top01::before,
	#top01::after {
	bottom: -120px;
	}
	#top01::before {
	background-size: 320px auto;
	}
	#top01::after {
	background-size: 180px auto;
	}
}
@media screen and (max-width: 1560px) {
	#top01 .wrap1 {
	max-width: inherit;
	padding-right: 30px;
	padding-left: 30px;
	}
	#top01 .box1 {
	padding-top: 100px;
	padding-bottom: 53px;
	}
	#top01 .box1 .ttl {
	width: 500px;
	}
	#top01 .box1 .ttl h2 {
	font-size: 25px;
	}
	#top01 .box1 .point ul {
	flex-wrap: wrap;
	-webkit-flex-wrap:wrap
	-ms-flex-wrap: wrap;
	}
	#top01 .box1 .point li {
	width: 350px;
	margin-bottom: 50px;
	}
}
@media screen and (max-width: 1320px) {
	#top01 {
	}
	#top01 .wrap1 {
	}
	#top01 .wrap2 {
	padding-top: 100px;
	padding-right: 30px;
	padding-left: 30px;
	}
	#top01 .box2 {
	margin-right: auto;
	}
	#top01 .box2 .ttl h2 {
	text-shadow: 0 0 10px #000;
	}
	#top01 .box2 .txt {
	text-shadow: #fff 1px 0px 1px, #fff -1px 0px 1px,#fff 0px -1px 1px, #fff -1px 0px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px;
	color: #000;
	}
}
@media screen and (max-width: 1200px) {
	#top01 {
	background-image: inherit;
	}
	#top01::before,
	#top01::after {
	bottom: -120px;
	}
	#top01::before {
	background-size: 320px auto;
	}
	#top01::after {
	background-size: 180px auto;
	}
	#top01 .box1 .ttl {
	background-color: #eaeaec;
	}
	#top01 .wrap2 {
	padding-bottom: 200px;
	background-image: url(../img/bg01.jpg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: bottom center;
	}
}
@media screen and (max-width: 1000px) {
	#top01 {
	}
	#top01::before,
	#top01::after {
	bottom: -100px;
	}
	#top01::before {
	background-size: 250px auto;
	}
	#top01::after {
	background-size: 140px auto;
	}
}
@media screen and (max-width: 790px) {
	#top01 {
	padding-top: 80px;
	}
	#top01::before,
	#top01::after {
	bottom: -50px;
	}
	#top01::before {
	background-size: 150px auto;
	}
	#top01::after {
	background-size: 84px auto;
	}
	#top01 .wrap1 {
	padding-right: 15px;
	padding-left: 15px;
	}
	#top01 .box1 .ttl .sub {
	margin-bottom: 5px;
	font-size: 18px;
	}
	#top01 .box1 .ttl {
	width: 300px;
	}
	#top01 .box1 .ttl .sub br {
	display: inline-block !important;
	}
	#top01 .box2 .ttl h2 {
	font-size: 22px;
	line-height: 1.3;
	color: #000;
	text-shadow: inherit;
	}
	#top01 .box1 {
	margin-right: auto;
	margin-left: auto;
	padding-top: 70px;
	padding-bottom: 0px;
	padding-right: 15px;
	padding-left: 15px;
	}
	#top01 .box1 .point ul {
	}
	#top01 .box1 .point li {
	width: inherit;
	max-width: 300px;
	margin-bottom: 40px;
	margin-right: auto;
	margin-left: auto;
	}
	#top01 .box1 .point li h3 {
	margin-top: 10px;
	font-size: 20px;
	}
	#top01 .box1 .point li .sub {
	margin-top: 5px;
	font-size: 14px;
	}
	#top01 .wrap2 {
	padding-top: 40px;
	padding-bottom: 130px;
	padding-right: 15px;
	padding-left: 15px;
	}
	#top01 .box2 {
	max-width: 400px;
	}
	#top01 .box2 .ttl {
	padding-top: 90px;
	}
	#top01 .box2 .ttl::before {
	width: 100px;
	height: 76px;
	}
	#top01 .box2 .ttl h2 {
	font-size: 22px;
	line-height: 1.3;
	}
	#top01 .box1 .point .txt .pcNone {
	display: inline-block !important;
	}
}
@media screen and (max-width: 400px) {
	#top01 .box1 {
	padding-top: 80px;
	}
	#top01 .box1 .ttl {
	width: 200px;
	}
	#top01 .box1 .ttl .sub {
	font-size: 16px;
	}
	#top01 .box1 .ttl h2 {
	font-size: 20px;
	}
}



/* 保護者の声 */
#top02 {
padding-top: 124px;
padding-bottom: 166px;
background-image: url(../img/bg02.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: 1920px auto;
}
#top02::before,
#top02::after {
z-index: +1;
position: absolute;
content: "";
width: 1920px;
left: 0;
right: 0;
margin: auto;
background-repeat: no-repeat;
}
#top02::before {
height: 932px;
top: 172px;
background-image: url(../img/top/voice_before.png);
background-position: left bottom;
background-size: 375px auto;
}
#top02::after {
height: 951px;
bottom: 45px;
background-image: url(../img/top/voice_after.png);
background-position: right bottom;
background-size: 495px auto;
}
#top02 .wrap {
max-width: 832px;
margin-right: auto;
margin-left: auto;
}
#top02 .ttl {
z-index: +2;
position: relative;
margin-bottom: 90px;
}
#top02 .ttl .sub {
margin-bottom: 5px;
font-size: 30px;
font-weight: 900;
text-align: center;
line-height: 1.3;
letter-spacing: 4px;
color: #f2d472;
}
#top02 .ttl h2 {
font-size: 24px;
text-align: center;
}
#top02 .box_wrap {
z-index: +2;
position: relative;
}
#top02 .box {
max-width: 703px;
margin-bottom: 65px;
}
#top02 .box:nth-of-type(even) {
margin-left: auto;
}
#top02 .box:last-of-type {
margin-bottom: 0;
}
#top02 .box h3 {
position: relative;
padding-top: 20px;
padding-bottom: 16px;
padding-left: 90px;
font-size: 20px;
border-bottom: 1px dotted #000;
}
#top02 .box h3::before {
position: absolute;
content: "";
width: 58px;
height: 56px;
top: 0;
left: 8px;
background-image: url(../img/voice_balloon01.png);
background-repeat: no-repeat;
background-position: left center;
}
#top02 .box:nth-child(2) h3::before {
background-image: url(../img/voice_balloon02.png);
}
#top02 .box:nth-child(3) h3::before {
background-image: url(../img/voice_balloon03.png);
}
#top02 .box .txt {
margin-top: 20px;
padding: 0 5px;
}
#top02 .link {
z-index: +2;
position: relative;
margin-top: 110px;
}
@media screen and (max-width: 1920px) {
	#top02 {
	background-size: 100% auto;
	}
	#top02::before,
	#top02::after {
	width: 100%;
	}
	#top02::before {
	height: 717px;
	background-size: 288px auto;
	}
	#top02::after {
	height: 716px;
	background-size: 381px auto;
	}
}
@media screen and (max-width: 1600px) {
	#top02::before {
	height: 410px;
	background-size: 165px auto;
	}
	#top02::after {
	height: 409px;
	background-size: 217px auto;
	}
}
@media screen and (max-width: 1200px) {
	#top02 .box {
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
	}
	#top02::before {
	height: 326px;
	top: 80px;
	background-size: 131px auto;
	}
	#top02::after {
	height: 325px;
	bottom: 10px;
	background-size: 173px auto;
	}
}
@media screen and (max-width: 1000px) {
}
@media screen and (max-width: 767px) {
	#top02 {
	padding-top: 40px;
	padding-bottom: 40px;
	}
	#top02::before {
	height: 77px;
	top: 30px;
	background-size: 70px auto;
	background-image: url(../img/top/voice_spbg1.png);
	}
	#top02::after {
	height: 125px;
	bottom: 80px;
	background-size: 98px auto;
	background-image: url(../img/top/voice_spbg5.png);
	}
	#top02 .ttl {
	margin-bottom: 20px;
	}
	#top02 .ttl .sub {
	font-size: 22px;
	}
	#top02 .ttl h2 {
	font-size: 22px;
	}
	#top02 .box {
	position: relative;
	max-width: inherit;
	margin-bottom: 90px;
	padding-right: 15px;
	padding-left: 15px;
	}
	#top02 .box::after {
	position: absolute;
	content: "";
	z-index: -1;
	}
	#top02 .box:last-of-type {
	margin-bottom: 130px;
	}
	#top02 .box:nth-of-type(1)::after {
	width: 71px;
	height: 77px;
	bottom: -80px;
	left: -60px;
	background-size: 71px auto;
	background-image: url(../img/top/voice_spbg2.png);
	}
	#top02 .box:nth-of-type(2)::after {
	width: 71px;
	height: 77px;
	bottom: -80px;
	right: -60px;
	background-size: 71px auto;
	background-image: url(../img/top/voice_spbg3.png);
	}
	#top02 .box:nth-of-type(3)::after {
	}
	#top02 .box h3 {
	max-width: 400px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 5px;
	padding-bottom: 10px;
	padding-left: 45px;
	font-size: 18px;
	}
	#top02 .box .txt {
	max-width: 400px;
	margin-right: auto;
	margin-left: auto;
	}
	#top02 .box h3::before {
	width: 30px;
	height: 29px;
	top: 0;
	left: 3px;
	background-size: cover;
	}
	#top02 .box:nth-of-type(1)::after {
	left: 0;
	}
	#top02 .box:nth-of-type(2)::after {
	right: 0;
	}
	#top02 .box:nth-of-type(3)::after {
	right: 0;
	}
	#top02 .link {
	z-index: +2;
	position: relative;
	margin-top: 50px;
	}
}



/* 無料体験レッスン */
#top03 {
}
#top03 .wrap1 {
padding-top: 30px;
padding-bottom: 30px;
background-color: #8e001b;
}
#top03 .wrap1 .ttl {
text-align: center;
border-top: 6px dashed #a60035;
border-bottom: 6px dashed #a60035;
}
#top03 .wrap1 h2 {
position: relative;
display: inline-block;
padding-top: 60px;
padding-bottom: 60px;
font-size: 50px;
font-weight: 900;
letter-spacing: 4px;
color: #fff;
}
#top03 .wrap1 h2::after {
position: absolute;
content: "";
width: 327px;
height: 247px;
top: 50%;
transform: translateY(-50%);
-webkit- transform: translateY(-50%);
left: -280px;
background-image: url(../img/check01.png);
background-repeat: no-repeat;
background-position: left center;
background-size: cover;
}
#top03 .wrap2 {
padding-top: 85px;
padding-bottom: 75px;
text-align: center;
background-image: url(../img/top/youtube_bg.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
#top03 .wrap2 iframe,
#top03 .wrap2 video {
width: 802px;
/*height: 602px;*/
margin-right: auto;
margin-left: auto;
border: 0 !important;
}
#top03 .wrap3 {
padding-top: 103px;
padding-bottom: 107px;
background-image: url(../img/bg02.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: 1920px auto;
}
#top03 .wrap3 .box {
max-width: 1124px;
margin-right: auto;
margin-left: auto;
}
#top03 .wrap3 .ttl {
margin-bottom: 60px;
}
#top03 .wrap3 .sub {
margin-bottom: 5px;
font-size: 30px;
font-weight: 900;
text-align: center;
line-height: 1.3;
letter-spacing: 4px;
color: #f2d472;
}
#top03 .wrap3 h2 {
font-size: 24px;
text-align: center;
}
#top03 .wrap3 .txt {
margin-bottom: 55px;
font-size: 30px;
font-weight: 900;
text-align: center;
}
#top03 .wrap3 .linkbnr {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
justify-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
margin: 0 -12px;
text-align: center;
line-height: 1.3;
}
#top03 .wrap3 .linkbnr li {
width: 550px;
padding: 0 12px;
}
#top03 .wrap3 .linkbnr li a {
display: block;
width: 100%;
height: 100%;
}
#top03 .wrap3 .linkbnr li div {
padding: 50px 10px;
border: 3px solid #9c0429;
border-radius: 15px;
}
#top03 .wrap3 .linkbnr li div p {
}
#top03 .wrap3 .linkbnr li div p:nth-of-type(1) {
position: relative;
padding-top: 90px;
padding-bottom: 50px;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
}
#top03 .wrap3 .linkbnr li div p:nth-of-type(1)::before {
position: absolute;
content: "";
width: 65px;
height: 65px;
top: 0;
right: 0;
left: 0;
margin: auto;
background-image: url(../img/ico_tel.png);
background-repeat: no-repeat;
background-size: cover;
}
#top03 .wrap3 .linkbnr li:nth-of-type(2) div p:nth-of-type(1)::before {
background-image: url(../img/ico_mail.png);
}
#top03 .wrap3 .linkbnr li div p:nth-of-type(1)::after {
position: absolute;
content: "";
width: 38px;
height: 23px;
bottom: 0;
right: 0;
left: 0;
margin: auto;
background-image: url(../img/arrow01.png);
background-repeat: no-repeat;
background-size: cover;
}
#top03 .wrap3 .linkbnr li div p:nth-of-type(2) {
padding-top: 26px;
font-size: 42px;
font-weight: 900;
letter-spacing: 3px;
color: #7d0022;
}
#top03 .wrap3 .linkbnr li div p:nth-of-type(3) {
padding-top: 15px;
}
#top03 .wrap3 .linkbnr a:hover div {
background-color: rgba(0,0,0,0.1);
border: 3px solid #002e73;
transition: all 0.5s;
}
#top03 .wrap3 .linkbnr a:hover div p:nth-of-type(2) {
color: #002e73;
transition: all 0.5s;
}
#top03 .wrap3 .linkbnr li a:hover div p:nth-of-type(1)::before {
background-image: url(../img/ico_tel_hover.png);
}
#top03 .wrap3 .linkbnr li:nth-of-type(2) a:hover div p:nth-of-type(1)::before {
background-image: url(../img/ico_mail_hover.png);
}
#top03 .wrap3 .linkbnr li a:hover div p:nth-of-type(1)::after {
background-image: url(../img/arrow01_hover.png);
}
@media screen and (max-width: 1920px) {
	#top03 .wrap3 {
	background-size: 100% auto;
	}

}
@media screen and (max-width: 1500px) {
	#top03 .wrap1 h2 {
	padding-left: 200px;
	}
	#top03 .wrap1 h2::after {
	width: 280px;
	height: 211px;
	left: -60px;
	}
	#top03 .wrap3 .box {
	padding-right: 30px;
	padding-left: 30px;
	}
}
@media screen and (max-width: 1200px) {
	#top03 .wrap1 h2 {
	padding-left: 150px;
	font-size: 40px;
	}
	#top03 .wrap1 h2::after {
	width: 200px;
	height: 151px;
	left: -60px;
	}
}
@media screen and (max-width: 1200px) {
	#top03 .wrap1 h2 {
	padding-left: 100px;
	font-size: 35px;
	}
	#top03 .wrap1 h2::after {
	width: 150px;
	height: 113px;
	left: -40px;
	}
	#top03 .wrap3 .linkbnr li div p:nth-of-type(2) {
	font-size: 40px;
	letter-spacing: 1px;
	}
}
@media screen and (max-width: 900px) {
	#top03 .wrap1 h2 {
	padding-left: 80px;
	font-size: 30px;
	}
	#top03 .wrap1 h2::after {
	width: 100px;
	height: 76px;
	left: -30px;
	}
	#top03 .wrap2 {
	padding-right: 30px;
	padding-left: 30px;
	}
	#top03 .wrap2 iframe,
	#top03 .wrap2 video {
	width: 100%;
	height: 500px;
	}
}
@media screen and (max-width: 767px) {
	#top03 .wrap1 {
	padding-top: 20px;
	padding-bottom: 20px;
	}
	#top03 .wrap1 .ttl {
	text-align: center;
	border-top: 4px dashed #a60035;
	border-bottom: 4px dashed #a60035;
	}
	#top03 .wrap1 h2 {
	padding-left: 0;
	font-size: 28px;
	letter-spacing: 0;
	display: block;
	padding-right: 0;
	padding-top: 60px;
	padding-bottom: 20px;
	padding-right: 15px;
	padding-left: 15px;
	}
	#top03 .wrap1 h2::after {
	width: 70px;
	height: 53px;
	top: 5px;
	transform: inherit;
	-webkit- transform: inherit;
	right: 0;
	left: 0;
	margin: auto;
	}
	#top03 .wrap2 {
	padding-top: 40px;
	padding-bottom: 40px;
	padding-right: 15px;
	padding-left: 15px;
	}
	#top03 .wrap2 iframe {
	max-width: 400px;
	/*height: 300px;*/
	}
	#top03 .wrap3 {
	padding-top: 40px;
	padding-bottom: 30px;
	}
	#top03 .wrap3 .box {
	padding-right: 15px;
	padding-left: 15px;
	}
	#top03 .wrap3 .ttl {
	margin-bottom: 20px
	}
	#top03 .wrap3 .ttl .sub {
	font-size: 22px;
	}
	#top03 .wrap3 .ttl h2 {
	font-size: 22px;
	}
	#top03 .wrap3 .txt {
	margin-bottom: 30px;
	font-size: 18px;
	}
	#top03 .wrap3 .linkbnr {
	display: block;
	margin: 0;
	}
	#top03 .wrap3 .linkbnr li {
	width: inherit;
	max-width: 400px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
	padding: 0;
	}
	#top03 .wrap3 .linkbnr li div {
	padding: 20px 10px;
	border-radius: 10px;
	}
	#top03 .wrap3 .linkbnr li div p:nth-of-type(1)::before {
	width: 40px;
	height: 40px;
	}
	#top03 .wrap3 .linkbnr li div p:nth-of-type(1) {
	padding-top: 50px;
	padding-bottom: 30px;
	font-size: 18px;
	letter-spacing: 0;
	}
	#top03 .wrap3 .linkbnr li div p:nth-of-type(1)::after {
	width: 30px;
	height: 18px;
	}
	#top03 .wrap3 .linkbnr li div p:nth-of-type(2) {
	padding-top: 10px;
	font-size: 30px;
	letter-spacing: 0;
	}
	#top03 .wrap3 .linkbnr li div p:nth-of-type(3) {
	padding-top: 5px;
	}
	#top03 .wrap3 .linkbnr li:nth-of-type(2) div p:nth-of-type(3) img {
	width: 150px;
	}
}
@media screen and (max-width: 400px) {
	#top03 .wrap3 .txt {
	font-size: 16px;
	}
}



/*フッター*/
footer {
text-align: center;
}
footer .wrap1 {
padding-top: 50px;
padding-bottom: 70px;
background-color: #8e001b;
}
footer .wrap1 .box {
max-width: 918px;
margin-right: auto;
margin-left: auto;
padding-right: 30px;
padding-left: 30px;
}
footer .nav {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
justify-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
flex-wrap: wrap;
-webkit-flex-wrap:wrap
-ms-flex-wrap: wrap;
margin-bottom: 112px;
}
footer .nav li {
position: relative;
margin-bottom: 10px;
padding: 0 10px;
color: #fff;
line-height: 1;
}
footer .nav li::after {
position: absolute;
content: "/";
right: -5px;
top: 50%;
transform: translateY(-50%);
-webkit- transform: translateY(-50%);
}
footer .nav li:last-child::after {
display: none;
}
footer .nav li p {
}
footer .nav li p a {
}
footer .nav li p a:hover {
color: rgba(255,255,255,0.6);
transition: all 0.3s;
}
footer .nav li p img {
}
footer .info {
}
footer .info a {
display: inline-block;
}
footer .info img {
display: inline-block !important;
}
footer .name {
margin-top: 47px;
margin-bottom: 67px;
color: #fff;
}
footer .name span {
display: block;
}
footer .name a:hover {
text-decoration: underline;
transition: all 0.3s;
}
footer .nav .link {
}
footer .linkbnr {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
justify-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
}
footer .linkbnr li {
width: 50%;
padding: 0 20px;
border-left: 1px solid #000;
}
footer .linkbnr li:hover {
opacity: 0.6;
transition: all 0.3s;
}
footer .linkbnr li:nth-of-type(2) {
border-right: 1px solid #000;
}
footer .linkbnr li a {
display: block;
width: 100%;
height: 100%;
}
footer .linkbnr li .txt {
margin-bottom: 15px;
}
footer .linkbnr li img {
margin-bottom: 20px;
}
footer .wrap2 {
padding-top: 60px;
padding-bottom: 60px;
}
.copyright {
}
.copyright small {
font-size: 14px;
}
@media screen and (max-width: 767px) {
	footer .wrap1 {
	padding-top: 40px;
	padding-bottom: 40px;
	}
	footer .wrap1 .box {
	padding-right: 15px;
	padding-left: 15px;
	}
	footer .nav {
	margin-bottom: 30px;
	}
	footer .info img {
	width: 180px;
	}
	footer .name {
	margin-top: 20px;
	margin-bottom: 40px;
	}
	footer .linkbnr li {
	padding: 0 10px;
	}
	footer .linkbnr li .txt {
	margin-bottom: 10px;
	font-size: 12px;
	line-height: 1.3;
	}
	footer .linkbnr li img {
	margin-bottom: 0;
	}
	footer .wrap2 {
	padding: 20px 15px;
	}
	.copyright small {
	font-size: 11px;
	}
}



/*---------------------------------------------------------------------
 下層共通
---------------------------------------------------------------------*/
#lower {
}
#lower .wrap {
margin-right: auto;
margin-left: auto;
}
@media screen and (max-width: 1920px) {
	#lower {
	}
	#lower .wrap {
	}
}
@media screen and (max-width: 767px) {
	#lower {
	}
	#lower .wrap {
	}
}
@media screen and (max-width: 500px) {
}


.main {
}
@media screen and (max-width: 767px) {
	.main {
	}
}


/* ライトボックス用 */
#lower .imgArea a {
display: block;
}


/* ページタイトル */
#page_ttl {
height: 400px;
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
background-color: #eee;
background-image: url(../img/page_ttl.jpg);
background-size: 1920px auto;
background-repeat: no-repeat;
background-position: top center;
}
#page_ttl .wrap {
width: 1420px;
margin-right: auto;
margin-left: auto;
}
#page_ttl .box {
}
#page_ttl h2 {
margin-bottom: 10px;
font-size: 40px;
text-align: center;
text-shadow: #fff 2px 0px 2px, #fff -2px 0px 2px,#fff 0px -2px 2px, #fff -2px 0px 2px,#fff 2px 2px 2px, #fff -2px 2px 2px,#fff 2px -2px 2px, #fff -2px -2px 2px,#fff 1px 2px 2px, #fff -1px 2px 2px,#fff 1px -2px 2px, #fff -1px -2px 2px,#fff 2px 1px 2px, #fff -2px 1px 2px,#fff 2px -1px 2px, #fff -2px -1px 2px,#fff 1px 1px 2px, #fff -1px 1px 2px,#fff 1px -1px 2px, #fff -1px -1px 2px;
color: #7d0022;
}
#page_ttl .sub {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
font-weight: bold;
text-align: center;
text-shadow: #fff 2px 0px 2px, #fff -2px 0px 2px,#fff 0px -2px 2px, #fff -2px 0px 2px,#fff 2px 2px 2px, #fff -2px 2px 2px,#fff 2px -2px 2px, #fff -2px -2px 2px,#fff 1px 2px 2px, #fff -1px 2px 2px,#fff 1px -2px 2px, #fff -1px -2px 2px,#fff 2px 1px 2px, #fff -2px 1px 2px,#fff 2px -1px 2px, #fff -2px -1px 2px,#fff 1px 1px 2px, #fff -1px 1px 2px,#fff 1px -1px 2px, #fff -1px -1px 2px;
line-height: 1.3;
letter-spacing: 2px;
color: #002e73;
}
@media screen and (max-width: 1920px) {
	#page_ttl {
	height: 300px;
	background-size: cover;
	}
}
@media screen and (max-width: 1460px) {
	#page_ttl .wrap {
	padding-right: 20px;
	padding-left: 20px;
	}
}
@media screen and (max-width: 1200px) {
	#page_ttl {
	height: 250px;
	background-size: cover;
	}
}
@media screen and (max-width: 767px) {
	#page_ttl {
	height: 150px;
	background-size: cover;
	}
	#page_ttl h2 {
	font-size: 24px;
	}



}
@media screen and (max-width: 400px) {
	#page_ttl {
	height: 120px;
	background-size: cover;
	}
	#page_ttl h2 {
	font-size: 20px;
	}
}


/* h3タイトル */
#lower .ttl {
z-index: +2;
position: relative;
margin-bottom: 90px;
}
#lower .ttl .sub {
margin-bottom: 5px;
font-size: 30px;
font-weight: 900;
text-align: center;
line-height: 1.3;
letter-spacing: 4px;
color: #f2d472;
}
#lower .ttl h3 {
font-size: 24px;
text-align: center;
}
@media screen and (max-width: 767px) {
	#lower .ttl {
	margin-bottom: 20px;
	}
	#lower .ttl .sub {
	font-size: 22px;
	}
	#lower .ttl h3 {
	font-size: 22px;
	}
}


/* 背景1 */
.bg01 {
background-image: url(../img/bg03.jpg),url(../img/bg04.jpg);
background-repeat: no-repeat;
/*background-size: 588px auto,1260px auto;*/
background-size: 400px auto,857px auto;
background-position: top left,bottom right;
}
@media screen and (max-width: 1200px) {
	.bg01 {
	background-size: 250px auto,536px auto;
	}
}
@media screen and (max-width: 1000px) {
}
@media screen and (max-width: 767px) {
	.bg01 {
	background-size: 150px auto,321px auto;
	}
}


/* お問い合わせバナー */
.lowinfo#top03 {
box-shadow: 0 0 15px rgba(0,0,0,0.2);
}



/*---------------------------------------------------------------------
Academia Jr.が選ばれる理由
---------------------------------------------------------------------*/
.about_ttl#page_ttl {
background-image: url(../img/about/page_ttl.jpg);
}


#about01,
#about02,
#about03,
#about04,
#about05 {
}
#about01 .wrap,
#about02 .wrap,
#about03 .wrap,
#about04 .wrap,
#about05 .wrap,
#audio01 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#about01 .wrap,
	#about02 .wrap,
	#about03 .wrap,
	#about04 .wrap,
	#about05 .wrap,
	#audio01 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


#about01 {
padding-top: 150px;
padding-bottom: 100px;
}
#about01 .wrap {
text-align: center;
}
#about01 .wrap .box {
padding: 150px 200px 150px 50px;
border: 3px solid #9c0429;
background-color: #fff;
background-image: url(../img/about/bg01.jpg);
background-size: 100% auto;
background-repeat: no-repeat;
background-position: bottom center;
}
#about01 .wrap p {
font-size: 20px;
font-weight: bold;
text-align: left;
line-height: 2;
}
#about01 .wrap p:nth-of-type(2) {
margin-top: 20px;
}
#about01 .wrap p span {
display: inline-block;
}
@media screen and (max-width: 1200px) {
	#about01 .wrap .box {
	padding: 50px 200px 150px 50px;
	}
	#about01 .wrap .box br {
	display: none;
	}
}
@media screen and (max-width: 1000px) {
	#about01 .wrap .box {
	padding: 50px 50px 300px 50px;
	background-size: 100% auto;
	background-position: right bottom;
	}
}
@media screen and (max-width: 767px) {
	#about01 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#about01 .wrap .box {
	padding: 20px 20px 250px 20px;
	background-size: 800px auto;
	border: 2px solid #9c0429;
	}
	#about01 .wrap p {
	font-size: 16px;
	line-height: 1.8;
	}
	#about01 .wrap p:nth-of-type(2) {
	margin-top: 10px;
	}
}


#about02 {
padding-top: 80px;
padding-bottom: 80px;
background-color: #eee;
}
#about02 .ttl {
margin-bottom: 100px;
}
#about02 .box1 {
margin-bottom: 100px;
}
#about02 .box1 .in {
position: relative;
min-height: 380px;
margin-bottom: 30px;
padding: 40px;
background-color: #fff;
background-repeat: no-repeat;
box-shadow: 0 0 20px rgba(0,0,0,0.2);
}
#about02 .box1 .in:last-of-type {
margin-bottom: 0;
}
#about02 .box1 .in:nth-of-type(1),
#about02 .box1 .in:nth-of-type(3) {
padding-right: 500px;
background-position: right 40px center;
}
#about02 .box1 .in:nth-of-type(2),
#about02 .box1 .in:nth-of-type(4) {
padding-left: 500px;
background-position: left 40px center;
}
#about02 .box1 .in:nth-of-type(1) {
background-image: url(../img/about/img01.png);
}
#about02 .box1 .in:nth-of-type(2) {
background-image: url(../img/about/img02.png);
}
#about02 .box1 .in:nth-of-type(3) {
background-image: url(../img/about/img04.png);
}
/*
#about02 .box1 .in:nth-of-type(4) {
background-image: url(../img/about/img04.png);
}
*/
#about02 .box1 .subttl {
margin-bottom: 40px;
text-align: center;
}
#about02 .box1 .subttl h4 {
margin-bottom: 10px;
font-size: 20px;
}
#about02 .box1 .subttl p {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 1.3;
letter-spacing: 2px;
color: #eb6100;
}
#about02 .box1 .in:nth-of-type(2) .subttl p {
color: #8fc31f;
}
#about02 .box1 .in:nth-of-type(3) .subttl p {
color: #e64984e6;
}
#about02 .box1 .in:nth-of-type(3) .subttl p {
color: #448aca;
}
#about02 .box1 h5 {
margin-bottom: 5px;
font-size: 18px;
color: #eb6100;
}
#about02 .box1 h5:nth-of-type(2) {
margin-top: 40px;
}
#about02 .box1 .txt {
font-size: 17px;
line-height: 2;
}
#about02 .box1 .link {
margin-top: 30px;
}
#about02 .box2 {
max-width: 800px;
margin-right: auto;
margin-left: auto;
padding: 30px 30px 250px 30px;
text-align: center;
border: 3px solid #002e73;
border-radius: 30px;
background-color: #fff;
background-image: url(../img/about/img05.png),url(../img/bg05.jpg),url(../img/bg06.jpg);
background-size: 400px auto,700px auto,700px auto;
background-repeat: no-repeat;
background-position: bottom center,left top,right bottom;
}
#about02 .box2 .catch {
margin-bottom: 20px;
}
#about02 .box2 .subttl {
}
#about02 .box2 .subttl h4 {
margin-bottom: 5px;
font-size: 34px;
font-weight: bold;
letter-spacing: 2px;
color: #9c0429;
}
#about02 .box2 .subttl p {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 1.3;
letter-spacing: 2px;
color: #9c0429;
}
#about02 .box2 .txt {
margin-top: 40px;
}
#about02 .box2 .txt p:nth-of-type(1) {
margin-bottom: 20px;
font-size: 20px;
font-weight: bold;
color: #002e73;
}
#about02 .box2 .txt p:nth-of-type(2) {
line-height: 2;
}
@media screen and (max-width: 1000px) {
	#about02 .box1 .in {
	background-size: 330px auto;
	}
	#about02 .box1 .in:nth-of-type(1),
	#about02 .box1 .in:nth-of-type(3) {
	padding-right: 400px;
	}
	#about02 .box1 .in:nth-of-type(2),
	#about02 .box1 .in:nth-of-type(4) {
	padding-left: 400px;
	}
}
@media screen and (max-width: 800px) {
	#about02 .box1 .in {
	background-size: 280px auto;
	}
	#about02 .box1 .in:nth-of-type(1),
	#about02 .box1 .in:nth-of-type(3) {
	padding-right: 350px;
	}
	#about02 .box1 .in:nth-of-type(2),
	#about02 .box1 .in:nth-of-type(4) {
	padding-left: 350px;
	}
}
@media screen and (max-width: 767px) {
	#about02 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#about02 .ttl {
	margin-bottom: 40px;
	}
	#about02 .box1 {
	margin-bottom: 60px;
	}
	#about02 .box1 .in {
	min-height: 300px;
	margin-bottom: 20px;
	padding: 20px;
	background-size: 200px auto;
	box-shadow: 0 0 10px rgba(0,0,0,0.2);
	}
	#about02 .box1 .in:nth-of-type(1),
	#about02 .box1 .in:nth-of-type(3) {
	padding-right: 270px;
	}
	#about02 .box1 .in:nth-of-type(2),
	#about02 .box1 .in:nth-of-type(4) {
	padding-left: 270px;
	}
	#about02 .box1 .subttl {
	margin-bottom: 30px;
	}
	#about02 .box1 .subttl h4 {
	font-size: 18px;
	}
	#about02 .box1 .subttl p {
	font-size: 15px;
	letter-spacing: 1px;
	}
	#about02 .box1 .txt {
	font-size: 16px;
	line-height: 1.5;
	}
	#about02 .box2 {
	padding: 20px 20px 180px 20px;
	border: 2px solid #002e73;
	border-radius: 20px;
	background-size: 300px auto,400px auto,400px auto;
	}
	#about02 .box2 .catch {
	margin-bottom: 10px;
	}
	#about02 .box2 .subttl h4 {
	margin-bottom: 5px;
	font-size: 24px;
	letter-spacing: 1px;
	}
	#about02 .box2 .subttl p {
	font-size: 14px;
	letter-spacing: 1px;
	}
	#about02 .box2 .txt {
	margin-top: 30px;
	}
	#about02 .box2 .txt p:nth-of-type(1) {
	margin-bottom: 13px;
	font-size: 17px;
	line-height: 1.3;
	}
	#about02 .box2 .txt p:nth-of-type(2) {
	line-height: 1.5;
	text-align: left;
	}
}
@media screen and (max-width: 550px) {
	#about02 .box1 .in {
	padding: 20px !important;
	padding-bottom: 200px !important;
	background-position: bottom 20px center !important;
	}
}


#about03 {
padding-top: 80px;
padding-bottom: 80px;
}
#about03 .wrap {
}
#about03 .ttl {
margin-bottom: 40px;
}
#about03 h4 {
margin-bottom: 10px;
font-size: 18px;
font-weight: bold;
text-align: center;
}
#about03 .tbl {
}
#about03 .tbl table {
max-width: 800px;
margin-right: auto;
margin-left: auto;
}
#about03 th:nth-of-type(1) {
width: 20%;
}
#about03 th:nth-of-type(2) {
width: 30%;
}
#about03 th:nth-of-type(3),
#about03 th:nth-of-type(4) {
width: 25%;
}
#about03 th {
padding: 10px;
text-align: center;
color: #fff;
background-color: #9c0429;
border: 2px solid #fff;
}
#about03 td {
padding: 10px;
text-align: center;
background-color: #eee;
border: 2px solid #fff;
}
#about03 .txt1 {
margin-top: 5px;
margin-bottom: 100px;
font-size: 15px;
text-align: center;
}
#about03 .txt2 {
padding-top: 220px;
font-size: 30px;
font-weight: bold;
text-align: center;
color: #9c0429;
background-image: url(../img/about/img06.png);
background-repeat: no-repeat;
background-position: top center;
background-size: auto 200px;
}
#about03 .txt2 span {
font-size: 18px;
}
@media screen and (max-width: 900px) {
	#about03 .txt2 {
	font-size: 24px;
	}
}
@media screen and (max-width: 767px) {
	#about03 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#about03 h4 {
	font-size: 16px;
	}
	#about03 .tbl {
	overflow-x: auto;
	max-width: 600px;
	margin-right: auto;
	margin-left: auto;
	font-size: 14px;
	}
	#about03 .tbl::-webkit-scrollbar{
	width: 5px;
	background: #ccc;
	}
	#about03 .tbl::-webkit-scrollbar:horizontal{
	height: 5px;
	background: #ccc;
	}
	#about03 .tbl::-webkit-scrollbar-thumb{
	background: #888;
	border-radius: 2px;
	}
	#about03 .tbl::-webkit-scrollbar-thumb:horizontal{
	background: #888;
	border-radius: 2px;
	}
	#about03 .tbl table {
	width: 600px;
	}
	#about03 th {
	padding: 5px;
	}
	#about03 td {
	padding: 5px;
	}
	#about03 .txt1 {
	margin-bottom: 40px;
	font-size: 14px;
	}
	#about03 .txt2 {
	font-size: 18px;
	padding-top: 150px;
	text-align: left;
	background-size: auto 130px;
	}
}
@media screen and (max-width: 550px) {
	#about03 .txt1 {
	text-align: left;
	}
}
@media screen and (max-width: 400px) {
	#about03 .txt2 {
	padding-top: 220px;
	background-size: auto 200px;
	}
}



/*---------------------------------------------------------------------
フォニックス・発音
---------------------------------------------------------------------*/
.phonics_ttl#page_ttl {
background-image: url(../img/phonics/page_ttl.jpg);
}


#phonics01,
#phonics02,
#phonics03,
#phonics04,
#phonics05 {
}
#phonics01 .wrap,
#phonics02 .wrap,
#phonics03 .wrap,
#phonics04 .wrap,
#phonics05 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#phonics01 .wrap,
	#phonics02 .wrap,
	#phonics03 .wrap,
	#phonics04 .wrap,
	#phonics05 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


#phonics01 {
padding-top: 150px;
padding-bottom: 100px;
}
#phonics01 .wrap {
overflow: inherit;
text-align: center;
}
#phonics01 .box {
padding: 50px 50px 150px 50px;
background-color: #efe4d5;
background-image: url(../img/phonics/bg01.jpg);
background-size: 100% auto;
background-repeat: no-repeat;
background-position: bottom center;
border-radius: 10px;
}
#phonics01 h3 {
margin-bottom: 80px;
font-family: 'Open Sans', sans-serif;
font-size: 24px;
font-weight: bold;
text-align: center;
line-height: 1.3;
letter-spacing: 1px;
color: #eb6100;
}
#phonics01 h4 {
margin-bottom: 5px;
font-size: 22px;
text-align: left;
color: #eb6100;
}
#phonics01 h4:nth-of-type(2) {
margin-top: 60px;
}
#phonics01 p {
padding-right: 200px;
font-size: 20px;
font-weight: bold;
text-align: left;
line-height: 2;
}
@media screen and (max-width: 1200px) {
	#phonics01 .wrap .box {
	padding: 50px 50px 150px 50px;
	}
	#phonics01 .wrap .box br {
	display: none;
	}
	#phonics01 p {
	padding-right: 300px;
	}
}
@media screen and (max-width: 1000px) {
	#phonics01 .wrap .box {
	padding: 50px 50px 250px 50px;
	background-size: 600px auto;
	background-position: right bottom;
	}
	#phonics01 p {
	padding-right: 0;
	}
}
@media screen and (max-width: 767px) {
	#phonics01 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#phonics01 .wrap .box {
	padding: 20px 20px 230px 20px;
	background-size: 500px auto;
	}
	#phonics01 h3 {
	margin-bottom: 30px;
	font-size: 20px;
	letter-spacing: 1px;
	}
	#phonics01 h4 {
	margin-top: 30px;
	font-size: 17px;
	}
	#phonics01 h4:nth-of-type(2) {
	margin-top: 30px;
	}
	#phonics01 .wrap p {
	font-size: 16px;
	line-height: 1.8;
	}
	#phonics01 .wrap p:nth-of-type(2) {
	margin-top: 10px;
	}
}
@media screen and (max-width: 767px) {
	#phonics01 h3 {
	font-size: 18px;
	letter-spacing: 0;
	}
}


#phonics02 {
padding-top: 85px;
padding-bottom: 75px;
text-align: center;
background-image: url(../img/phonics/youtube_bg.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
#phonics02 .wrap {
}
#phonics02 h3 {
margin-bottom: 10px;
font-size: 20px;
font-weight: bold;
text-shadow: 0 0 5px #000;
color: #fff;
}
#phonics02 h3:nth-of-type(2) {
margin-top: 60px;
}
#phonics02 iframe {
width: 802px;
height: 602px;
margin-right: auto;
margin-left: auto;
border: 0 !important;
}
@media screen and (max-width: 900px) {
	#phonics02 .wrap iframe {
	width: 100%;
	height: 500px;
	}
}
@media screen and (max-width: 767px) {
	#phonics02 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#phonics02 h3 {
	font-size: 18px;
	}
	#phonics02 h3:nth-of-type(2) {
	margin-top: 40px;
	}
	#phonics02 .wrap iframe {
	max-width: 400px;
	height: 300px;
	}
}



/*---------------------------------------------------------------------
読解力・音読力
---------------------------------------------------------------------*/
.story_reading_ttl#page_ttl {
background-image: url(../img/story_reading/page_ttl.jpg);
}


#story_reading01,
#story_reading02 {
}
#story_reading01 .wrap,
#story_reading02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#story_reading01 .wrap,
	#story_reading02 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


.story_reading01#phonics01 .box {
text-align: right;
box-shadow: 0 0 20px rgba(0,0,0,0.2);
background-color: #fff;
background-image: url(../img/story_reading/bg01.jpg);
}
.story_reading01#phonics01 h3 {
color: #8fc31f;
}
.story_reading01#phonics01 p {
display: inline-block;
padding-right: 100px;
padding-left: 200px;
text-shadow: #fff 1px 0px 1px, #fff -1px 0px 1px,#fff 0px -1px 1px, #fff -1px 0px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px;
}
@media screen and (max-width: 1000px) {
	.story_reading01#phonics01 .box {
	background-size: 100% auto;
	background-position: left bottom;
	}
	.story_reading01#phonics01 p {
	padding-right: 50px;
	padding-left: 50px;
	}
}
@media screen and (max-width: 767px) {
	.story_reading01#phonics01 .box {
	background-position: bottom;
	background-size: 100% auto;
	}
	.story_reading01#phonics01 p {
	display: block;
	padding-right: 0;
	padding-left: 0;
	}
}
@media screen and (max-width: 600px) {
	.story_reading01#phonics01 .box {
	background-position: bottom left;
	background-size: 600px auto;
	}
}


.story_reading02#phonics02 {
background-image: url(../img/story_reading/youtube_bg.jpg);
}



/*---------------------------------------------------------------------
読書を支える単語力
---------------------------------------------------------------------*/
.vocabulary_ttl#page_ttl {
background-image: url(../img/vocabulary/page_ttl.jpg);
}


#vocabulary01,
#vocabulary02 {
}
#vocabulary01 .wrap,
#vocabulary02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#vocabulary01 .wrap,
	#vocabulary02 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


.vocabulary01#phonics01 .box {
box-shadow: 0 0 20px rgba(0,0,0,0.2);
background-color: #45564b;
background-image: url(../img/vocabulary/bg01.jpg);
}
.vocabulary01#phonics01 h3 {
color: #fff;
}
.vocabulary01#phonics01 p {
padding-right: 400px;
color: #fff;
}
@media screen and (max-width: 1200px) {
	.vocabulary01#phonics01 .box {
	padding: 50px 50px 200px 50px;
	}
	.vocabulary01#phonics01 p {
	padding-right: 0;
	}
	.vocabulary01#phonics01 p:nth-of-type(2) {
	padding-right: 300px;
	}
}
@media screen and (max-width: 1000px) {
	.vocabulary01#phonics01 .box {
	padding: 50px 50px 150px 50px;
	background-size: 100% auto;
	}
	.vocabulary01#phonics01 p:nth-of-type(2) {
	padding-right: 0;
	}
}
@media screen and (max-width: 767px) {
	.vocabulary01#phonics01 .box {
	padding: 20px 20px 150px 20px;
	}
}
@media screen and (max-width: 500px) {
	.vocabulary01#phonics01 .box {
	background-size: 700px auto;
	background-position: right bottom;
	}
}


.vocabulary02#phonics02 {
background-image: url(../img/vocabulary/youtube_bg.jpg);
}



/*---------------------------------------------------------------------
多読・多聴
---------------------------------------------------------------------*/
.extensive_ttl#page_ttl {
background-image: url(../img/extensive/page_ttl.jpg);
}


#extensive01,
#extensive02 {
}
#extensive01 .wrap,
#extensive02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#extensive01 .wrap,
	#extensive02 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


.extensive01#phonics01 .box {
box-shadow: 0 0 20px rgba(0,0,0,0.2);
background-color: #fff;
background-image: url(../img/extensive/bg01.jpg);
}
.extensive01#phonics01 h3 {
color: #448aca;
}
.extensive01#phonics01 p {
padding-right: 200px;
padding-left: 200px;
text-shadow: #fff 1px 0px 1px, #fff -1px 0px 1px,#fff 0px -1px 1px, #fff -1px 0px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px,#fff 1px 1px 1px, #fff -1px 1px 1px,#fff 1px -1px 1px, #fff -1px -1px 1px;
}
@media screen and (max-width: 1200px) {
	.extensive01#phonics01 .box {
	padding: 50px 50px 200px 50px;
	}
	.extensive01#phonics01 p {
	padding-right: 50px;
	padding-left: 50px;
	}
}
@media screen and (max-width: 1000px) {
	.extensive01#phonics01 .box {
	padding: 50px 50px 150px 50px;
	background-size: 100% auto;
	}
}
@media screen and (max-width: 767px) {
	.extensive01#phonics01 .box {
	padding: 20px 20px 150px 20px;
	}
	.extensive01#phonics01 p {
	padding-right: 0;
	padding-left: 0;
	}
}
@media screen and (max-width: 500px) {
	.extensive01#phonics01 .box {
	background-size: 700px auto;
	background-position: right bottom;
	}
}


.extensive02#phonics02 {
background-image: url(../img/extensive/youtube_bg.jpg);
}



/*---------------------------------------------------------------------
保護者の声
---------------------------------------------------------------------*/
.voice_ttl#page_ttl {
background-image: url(../img/voice/page_ttl.jpg);
}


#voice01,
#voice02 {
}
#voice01 .wrap,
#voice02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#voice01 .wrap,
	#voice02 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


#voice01 {
padding-top: 150px;
padding-bottom: 100px;
}
#voice01 .wrap {
overflow-x: inherit;
}
#voice01 .wrap .ttl {
}
#voice01 .wrap .box {
padding: 50px 50px;
box-shadow: 0 0 20px rgba(0,0,0,0.2);
background-color: #fff;
}
#voice01 .wrap .box .txt {
min-height: 245px;
padding-right: 250px;
text-align: left;
line-height: 2;
background-image: url(../img/voice/bg01.jpg);
background-repeat: no-repeat;
background-position: right center;
background-size: 200px auto;
}
#voice01 .wrap .box .txt p:nth-of-type(2) {
margin-top: 20px; 
}
#voice01 .wrap .box .name {
margin-top: 50px;
font-weight: bold;
font-size: 18px;
text-align: right;
}
#voice01 .wrap .box .name span {
display: inline-block;
}
#voice01 .wrap .box .name span:nth-of-type(1),
#voice01 .wrap .box .name span:nth-of-type(2) {
margin-right: 0.5em;
}
#voice01 .wrap .box .name span:nth-of-type(3) {
margin-right: 1em;
}
@media screen and (max-width: 1000px) {
	#voice01 .wrap .box {
	padding: 30px;
	}
	#voice01 .wrap .box .txt {
	min-height: 221px;
	padding-right: 200px;
	background-size: 180px auto;
	}
}
@media screen and (max-width: 767px) {
	#voice01 .wrap .box {
	padding: 30px;
	}
	#voice01 .wrap .box .txt {
	min-height: 184px;
	padding-right: 190px;
	background-size: 150px auto;
	}
	#voice01 .wrap .box .txt p:nth-of-type(2) {
	margin-top: 10px;
	}
	#voice01 .wrap .box .name {
	margin-top: 30px;
	font-size: 16px;
	}
}
@media screen and (max-width: 600px) {
	#voice01 .wrap .box .txt {
	min-height: inherit;
	padding-right: 0;
	padding-bottom: 210px;
	background-size: 150px auto;
	background-position: bottom center;
	}
	#voice01 .wrap .box .name span:nth-of-type(2),
	#voice01 .wrap .box .name span:nth-of-type(3) {
	margin-right: 0;
	}
	#voice01 .wrap .box .name span:nth-of-type(3),
	#voice01 .wrap .box .name span:nth-of-type(4) {
	display: block;
	}
}
@media screen and (max-width: 400px) {
	#voice01 .wrap .box .name span:nth-of-type(1) {
	margin-right: 0;
	}
	#voice01 .wrap .box .name span:nth-of-type(2) {
	display: block;
	}
}


#voice02 {
padding-top: 80px;
padding-bottom: 150px;
background-color: #eee;
}
#voice02 .ttl {
margin-bottom: 100px;
}
#voice02 .box1 {
}
#voice02 .box1 .in {
position: relative;
min-height: 300px;
display: flex;
display: box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: -moz-box;
align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
width: 100%;
flex-wrap: wrap;
-webkit-flex-wrap: wrap -ms-flex-wrap: wrap;
margin-bottom: 30px;
padding: 40px;
background-color: #fff;
background-repeat: no-repeat;
background-size: 280px auto,500px auto,500px auto;
box-shadow: 0 0 20px rgba(0,0,0,0.2);
}
#voice02 .box1 .in:last-of-type {
margin-bottom: 0;
}
#voice02 .box1 .in:nth-of-type(1),
#voice02 .box1 .in:nth-of-type(3),
#voice02 .box1 .in:nth-of-type(5) {
padding-right: 350px;
background-position: right 30px center;
background-position: right 30px center,top left,bottom left;
}
#voice02 .box1 .in:nth-of-type(2),
#voice02 .box1 .in:nth-of-type(4) {
padding-left: 350px;
background-position: left 30px center;
background-position: left 30px center,top right,bottom right;
}
#voice02 .box1 .in:nth-of-type(1) {
background-image: url(../img/voice/img01.png),url(../img/bg05.jpg),url(../img/bg06.jpg);
}
#voice02 .box1 .in:nth-of-type(2) {
background-image: url(../img/voice/img02.png),url(../img/bg05.jpg),url(../img/bg06.jpg);
}
#voice02 .box1 .in:nth-of-type(3) {
background-image: url(../img/voice/img03.png),url(../img/bg05.jpg),url(../img/bg06.jpg);
}
#voice02 .box1 .in:nth-of-type(4) {
background-image: url(../img/voice/img04.png),url(../img/bg05.jpg),url(../img/bg06.jpg);
}
#voice02 .box1 .in:nth-of-type(5) {
background-image: url(../img/voice/img05.png),url(../img/bg05.jpg),url(../img/bg06.jpg);
}
#voice02 .box1 .in .name {
margin-bottom: 20px;
font-size: 18px;
font-weight: bold;
color: #002e73;
}
#voice02 .box1 .in:nth-of-type(2) .name,
#voice02 .box1 .in:nth-of-type(4) .name {
text-align: right;
}
#voice02 .box1 .in .txt {
line-height: 2;
}
@media screen and (max-width: 1000px) {
	#voice02 .box1 .in {
	padding: 30px;
	background-size: 250px auto,400px auto,400px auto;
	}
	#voice02 .box1 .in:nth-of-type(1),
	#voice02 .box1 .in:nth-of-type(3),
	#voice02 .box1 .in:nth-of-type(5) {
	padding-right: 280px;
	background-position: right 10px center,top left,bottom left;
	}
	#voice02 .box1 .in:nth-of-type(2),
	#voice02 .box1 .in:nth-of-type(4) {
	padding-left: 280px;
	background-position: left 10px center,top right,bottom right;
	}
}
@media screen and (max-width: 767px) {
	#voice02 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#voice02 .ttl {
	margin-bottom: 40px;
	}
	#voice02 .box1 .in {
	padding: 20px;
	background-size: 180px auto,300px auto,300px auto;
	}
	#voice02 .box1 .in:nth-of-type(1),
	#voice02 .box1 .in:nth-of-type(3),
	#voice02 .box1 .in:nth-of-type(5) {
	padding-right: 200px;
	background-position: right 5px center,top left,bottom left;
	}
	#voice02 .box1 .in:nth-of-type(2),
	#voice02 .box1 .in:nth-of-type(4) {
	padding-left: 200px;
	background-position: left 5px center,top right,bottom right;
	}
	#voice02 .box1 .in .name {
	margin-bottom: 15px;
	font-size: 17px;
	}
	#voice02 .box1 .in .txt {
	line-height: 1.5;
	}
}
@media screen and (max-width: 550px) {
	#voice02 .box1 .in {
	display: block;
	background-size: 180px auto,300px auto,300px auto;
	}
	#voice02 .box1 .in:nth-of-type(1),
	#voice02 .box1 .in:nth-of-type(3),
	#voice02 .box1 .in:nth-of-type(5) {
	padding-right: 20px;
	padding-bottom: 200px;
	background-position: bottom 10px center,top left,bottom left;
	}
	#voice02 .box1 .in:nth-of-type(2),
	#voice02 .box1 .in:nth-of-type(4) {
	padding-left: 20px;
	padding-bottom: 200px;
	background-position: bottom 10px center,top right,bottom right;
	}
	#voice02 .box1 .in:nth-of-type(2) .name,
	#voice02 .box1 .in:nth-of-type(4) .name {
	text-align: left;
	}
}


/*---------------------------------------------------------------------
授業イメージご紹介
---------------------------------------------------------------------*/
.class_ttl#page_ttl {
background-image: url(../img/class/page_ttl.jpg);
}


#class01,
#class02 {
}
#class01 .wrap,
#class02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#class01 .wrap,
	#class02 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


#class01 {
padding-top: 150px;
padding-bottom: 100px;
}
#class01 .wrap {
}
#class01 iframe,
#class01 video {
display: block;
width: 802px;
/*height: 602px;*/
margin-right: auto;
margin-left: auto;
border: 0 !important;
}
@media screen and (max-width: 900px) {
	#class01 .wrap iframe {
	width: 100%;
	height: 500px;
	}
}
@media screen and (max-width: 767px) {
	#class01 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#class01 iframe,
	#class01 video {
	max-width: 400px;
	/*height: 300px;*/
	}
}

/*
#class01 h3 {
margin-bottom: 30px;
font-size: 20px;
font-weight: bold;
color: #fff;
}
#class01 .box {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
flex-wrap: wrap;
-webkit-flex-wrap:wrap
-ms-flex-wrap: wrap;
align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
margin: 0 -20px;
}
#class01 .box li {
width: 50%;
margin-bottom: 80px;
padding: 0 20px;
}
#class01 .box li .in {
padding: 30px;
background-color: rgba(0,46,115,0.1);
border-radius: 20px;
}
#class01 .txt {
margin-bottom: 20px;
font-weight: bold;
text-align: center;
line-height: 1.3;
}
#class01 iframe {
width: 100%;
height: 400px;
margin-right: auto;
margin-left: auto;
border: 0 !important;
}
@media screen and (max-width: 1200px) {
	#class01 iframe {
	width: 100%;
	height: 300px;
	}
}
@media screen and (max-width: 767px) {
	#class01 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#class01 .box {
	display: block;
	}
	#class01 .box li {
	width: 100%;
	max-width: 400px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 30px;
	}
	#class01 .box li .in {
	padding: 20px;
	border-radius: 10px;
	}
	#class01 iframe {
	height: 300px;
	}
}
*/






/*---------------------------------------------------------------------
お問い合わせ（塾・学校の方）
---------------------------------------------------------------------*/
.biz_ttl#page_ttl {
background-image: url(../img/biz/page_ttl.jpg);
}


/* iOSでのsubmit, buttonのデザインをリセット */
input[type="submit"],
input[type="reset"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="reset"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}


#biz01,
#biz02 {
}
#biz01 .wrap,
#biz02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
@media screen and (max-width: 767px) {
	#biz01 .wrap,
	#biz02 .wrap {
	padding-right: 15px;
	padding-left: 15px;
	}
}


#biz01 {
padding-top: 150px;
padding-bottom: 100px;
}
#biz01 .wrap {
overflow-x: inherit;
max-width: 1000px;
margin-right: auto;
margin-left: auto;
}
#biz01 .wrap .ttl {
}
#biz01 .txt {
margin-bottom: 80px;
}
#biz01 form {
}
#biz01 h4 {
margin-bottom: 10px;
font-size: 18px;
color: #9c0429;
}
#biz01 .box2,
#biz01 .box3 {
margin-top: 50px;
}
#biz01 dl {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
flex-wrap: wrap;
-webkit-flex-wrap:wrap
-ms-flex-wrap: wrap;
align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
margin-bottom: 10px;
padding: 15px 20px;
background-color: #eee;
}
#biz01 dt {
width: 300px;
padding-right: 10px;
font-weight: bold;
font-size: 17px;
line-height: 1.3;
}
#biz01 dd {
width: calc(100% - 300px);
}
input[type="text"],
input[type="date"],
input[type="mail"],
input[type="email"] {
font-family: inherit;
line-height: 1.3;
}
input[type="text"],
input[type="date"],
input[type="email"],
input[type="mail"] {
width: 100%;
padding: 10px;
}
input[type="radio"],
input[type="checkbox"] {
background-color: #fff;
border-radius: 0;
border: 1px solid #888;
}
select {
width: 200px;
padding: 5px;
font-family: inherit;
border: none;
}
select option {
}
textarea {
width: 100%;
padding: 10px;
font-family: inherit;
}
.formBtn {
margin-top: 50px;
font-family: inherit;
text-align: center;
}
input[type="submit"],
input[type="button"] {
padding: 10px 50px;
font-family: inherit;
font-size: 18px;
line-height: 1.3;
letter-spacing: 2px;
color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.3);
background-color: #9c0429;
border-radius: 5px;
}
input[type="submit"]:hover,
input[type="button"]:hover {
background-color: #d7486a;
transition: all 0.5s;
}
.address p:nth-of-type(2),
.address p:nth-of-type(3) {
margin-top: 8px;
}
.setsumeikai {
margin-bottom: 100px;
}
#biz01 .setsumeikai .sub {
letter-spacing: 0 !important;
}
#biz01 .setsumeikai h4 {
margin-bottom: 10px;
text-align: center;
}
.setsumeikai h5 {
    margin-top: 20px;
    margin-bottom: 5px;
    font-size: 16px;
}
.setsumeikai h5::before {
content: "＜";
}
.setsumeikai h5::after {
content: "＞";
}
.setsumeikai .campaign {
margin-bottom: 20px;
text-align: center;
}
.setsumeikai .campaign p {
z-index: +1;
display: inline-block;
position: relative;
font-size: 18px;
font-weight: bold;
color: #f10f38;
}
.setsumeikai .campaign p::after {
z-index: -1;
position: absolute;
content: "";
width: 100%;
height: 50%;
bottom: 0;
left: 50%;
transform: translateX(-50%);
-webkit- transform: translateX(-50%);
background-color: #ffefbb;
}
.setsumeikai .txt1 {
margin-bottom: 30px;
}
.setsumeikai .txt3 {
}
.setsumeikai .txt3 p {
}
.setsumeikai .txt3 p:nth-child(1) {
margin-bottom: 10px;
}
.setsumeikai .txt3 p:nth-child(2) {
text-align: right;
}
.setsumeikai .box1 {
max-width: 500px;
margin: 0 auto 30px auto;
}
.setsumeikai table {
width: 100%;
table-layout: fixed;
text-align: center;
}
.setsumeikai tr {
border-bottom: 4px solid #fff;
}
.setsumeikai th {
padding: 5px 10px;
background-color: #f9e8e8;
}
.setsumeikai td {
padding: 5px 10px;
background-color: #eee;
}
.setsumeikai .box1 .txt {
margin-bottom: 0 !important;
}
@media screen and (max-width: 767px) {
	#biz01 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#biz01 .txt {
	margin-bottom: 40px;
	}
	#biz01 h4 {
	font-size: 16px;
	}
	#biz01 dl {
	display: block;
	padding: 10px 10px;
	}
	#biz01 dt {
	width: 100%;
	padding-right: 0;
	padding-bottom: 10px;
	font-size: 15px;
	}
	#biz01 dd {
	width: 100%;
	}
	input[type="text"],
	input[type="date"],
	input[type="mail"],
	input[type="email"],
	select,
	textarea,
	.formBtn {
	}
	input[type="text"],
	input[type="date"],
	input[type="email"],
	input[type="mail"] {
	width: 100%;
	padding: 5px 10px;
	}
	select {
	width: 200px;
	padding: 0px 5px;
	}
	textarea {
	width: 100%;
	padding: 10px;
	}
	.formBtn {
	margin-top: 30px;
	}
	input[type="submit"],
	input[type="button"] {
	padding: 10px 50px;
	font-size: 16px;
	line-height: 1.3;
	letter-spacing: 2px;
	color: #fff;
	box-shadow: 0 0 10px rgba(0,0,0,0.3);
	background-color: #9c0429;
	border-radius: 5px;
	}
	.setsumeikai .campaign p {
	}
	.setsumeikai .campaign p::after {
	height: 10px;
	}
	.setsumeikai .box1 {
	max-width: 400px;
	}
	.setsumeikai tr {
	display: block;
	width: 100%;
	}
	.setsumeikai th {
	display: block;
	width: 100%;
	padding: 5px;
	}
	.setsumeikai td {
	display: inline-block;
	width: 50%;
	padding: 5px;
	}
}


#biz02 {
padding-top: 80px;
padding-bottom: 80px;
background-color: #eee;
}
#biz02 .wrap {
}
#biz02 h3 {
margin-bottom: 40px;
text-align: center;
}
#biz02 h4 {
margin-top: 30px;
margin-bottom: 10px;
}
#biz02 p {
}
@media screen and (max-width: 767px) {
	#biz02 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#biz02 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	#biz02 h3 {
	margin-bottom: 30px;
	text-align: center;
	}
	#biz02 h4 {
	margin-top: 20px;
	margin-bottom: 5px;
	}

}



/*---------------------------------------------------------------------
無料体験のお申し込み
---------------------------------------------------------------------*/
.trial_ttl#page_ttl {
background-image: url(../img/trial/page_ttl.jpg);
}


#trial01,
#trial02 {
}
#trial01 .wrap,
#trial02 .wrap {
max-width: 1280px;
padding-right: 30px;
padding-left: 30px;
}
.year {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
flex-wrap: wrap;
-webkit-flex-wrap:wrap
-ms-flex-wrap: wrap;
}
.year p:nth-of-type(2) {
padding-left: 10px;
}
.year p:nth-of-type(2) select {
width: 100px !important;
}
.sex {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
flex-wrap: wrap;
-webkit-flex-wrap:wrap
-ms-flex-wrap: wrap;
}
.sex p {
}
.sex p:nth-of-type(2) {
margin-left: 20px;
}
.sex p span {
margin-left: 5px;
}
.know {
display:flex;
display:box;
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:-moz-box;
flex-wrap: wrap;
-webkit-flex-wrap:wrap
-ms-flex-wrap: wrap;
}
.know p {
margin-right: 20px;
}
.know p span {
margin-left: 5px;
}
@media screen and (max-width: 767px) {
	#trial01 {
	padding-top: 60px;
	padding-bottom: 60px;
	}
	.year {
	display:block;
	}
	.year p:nth-of-type(2) {
	padding-left: 0;
	padding-top: 10px;
	}
}



/*---------------------------------------------------------------------
音源ダウンロード
---------------------------------------------------------------------*/
#audio01 {
padding-top: 150px;
padding-bottom: 100px;
}
#audio01 .wrap {
overflow: inherit;
text-align: center;
}
#audio01 h4 {
margin-bottom: 5px;
font-size: 22px;
text-align: left;
color: #ffffff;
}
#audio01 h4:nth-of-type(2) {
margin-top: 60px;
}
#audio01 p {
font-size: 20px;
font-weight: bold;
text-align: left;
line-height: 2;
}

.audio_1 {
position: relative;
padding: 10px 20px 10px 20px;
margin: 0 0 40px 0;
font-size: 24px;
line-height: 1.3em;
background: #7d0022;
overflow: hidden;
clear: both;
}
.audio_2 {
position: relative;
padding: 10px 20px 10px 20px;
margin: 0 0 40px 0;
color: #ffffff;
font-size: 24px;
line-height: 1.3em;
background: #7d0022;
overflow: hidden;
clear: both;
}
.audio_3 {
position: relative;
padding: 10px 20px 10px 20px;
margin: 0 0 40px 0;
color: #ffffff;
font-size: 24px;
line-height: 1.3em;
background: #7d0022;
overflow: hidden;
clear: both;
}
.audio_4 {
position: relative;
padding: 10px 20px 10px 20px;
margin: 0 0 40px 0;
font-size: 24px;
line-height: 1.3em;
background: #7d0022;
overflow: hidden;
clear: both;
}

.box_line {
padding: 2em;
background: #ffffff;
}



/*---------------------------------------------------------------------
学校導入に関するご案内
---------------------------------------------------------------------*/
#biz01 .setsumeikai .programfee h4 {
margin-bottom: 10px;
text-align: left;
}
.setsumeikai .box99 {
max-width: 640px;
}
.school_ttl#page_ttl {
background-image: url(../img/school/page_ttl.jpg);
}
@media screen and (max-width: 767px) {
	.setsumeikai .box99 td {
	display:block;
	width: 100%;
	}
}

/* youtube埋め込み */
.school_movie {
}
.school_movie iframe {
display: block;
width: 100%;
height: 530px;
}
@media screen and (max-width: 767px) {
	.school_movie iframe {
	height: 320px;
	}
}
@media screen and (max-width: 400px) {
	.school_movie iframe {
	height: 250px;
	}
}



.is-fixed {
z-index: 9999;
width: 100%;
position: fixed;
top: 0;
left: 0;
background-color: rgba(255,255,255,0.9);
border-bottom: 1px solid #8e001b;
}