html, body { height: 100%; }
html{
scroll-behavior: smooth;
opacity:0;
}
html.wf-active {
animation-name:fadeInAnime;
animation-duration:1s;
animation-fill-mode:forwards;
}
@keyframes fadeInAnime{
from {
opacity: 0;
}
to {
opacity: 1;
}
}
body {
margin: 0 auto;
text-align: center;
font-family:   'fot-tsukubrdgothic-std', "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO", sans-serif;
color:#6a3906;
font-size: 0.9rem;
line-height: 180%; 
padding:0px;
margin:0px;
word-wrap: break-word ; 
-webkit-text-size-adjust: 100%;
font-feature-settings: "palt";
overflow-x: hidden;
background: url(//nanohana-en.com/images/back.jpg) no-repeat;
background-size: 100% auto;
}
body#home {
background: url(//nanohana-en.com/images/homeback.jpg) no-repeat;
background-size: 100% auto;
}
@font-face {
font-family: 'antrf'; 
src: url(//nanohana-en.com/fonts/antrf___.woff) format('woff');
}
input[type="search"],input[type="image"],input[type="button"]{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
outline: none;
margin:0px;
padding: 0px;
}
img {
border: 0px;
vertical-align:bottom;
}
a:hover img
{
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
-moz-transition:0.15s ease-in-out;
-webkit-transition:0.15s ease-in-out;
-o-transition:0.15s ease-in-out;
-ms-transition:0.15s ease-in-out;
}
ul,ol {
margin-top:0px
padding-top: 0px;
}
li {
margin:0px;
padding: 0px;
}
dl,dt,dd {
margin:0px;
padding: 0px;
}
table {
border: 0px;
border-collapse: separate;
border-spacing: 0px;
padding: 0px 0px 0px 0px;
margin: 0px 0px 20px 0px;
font-size: 100%;
}
table.kyosai{
width:50%;
font-size: 80%;
margin:auto;
}
table.kyosai td:first-child {
padding: 0px 5px 0px 0;
}
td {
text-align:left;
margin:0px;
vertical-align: top; 
}
td:first-child {
padding: 0px 15px 0px 0;
white-space: nowrap
}
table.colon td:first-child {
padding: 0px 15px 0px 0;
white-space: nowrap;
position: relative;
}
table.colon td:first-child:after{ 
content:"：";
display: inline-block;
position: absolute;
top: 0;
right: 5px;
}
@media only screen and (max-width: 767px) {
th,td {
display: block;
width: 100%;
}
td:first-child {
padding: 0px;
}
td:last-child {
padding: 0 0 15px 0;
}
table.colon td:first-child {
display: block !important;
width: 100% !important;
padding: 0px;
}
table.colon td:first-child:after{ 
content:"：";
display: inline-block;
position: relative;
top: 0;
left: 0;
}
table.colon td:last-child {
padding: 0 0 15px 0;
}
} a {
color:#6a3906;
text-decoration: none;
padding:0;
margin:0;
}
a:hover {
color: #999;
text-decoration: none;
padding:0;
margin:0;
-moz-transition:0.15s ease-in-out;
-webkit-transition:0.15s ease-in-out;
-o-transition:0.15s ease-in-out;
-ms-transition:0.15s ease-in-out;
}
h2{
font-size: 180%; 
line-height: 130%;
text-align:center;
padding: 20px 0px 20px 0px;
margin: 0px;
font-weight: bold;
font-family: 'antrf','fot-tsukubrdgothic-std';
}
h2.t01{
font-size: 200%; 
color: #ef8a8b;
}
h2.t02{
color: #609dd5;
}
h2.t03{
color: #b3c83d;
}
h2.t04{
color: #f39800;
}
h2.t05{
color: #4ab9a1;
}
h2.t06{
color: #915da3;
}
h2.t07{
color: #ef8a8b;
}
h2.t08{
color: #ef8a8b;
}
h3{
font-size: 130%; 
line-height: 130%;
text-align:center;
padding: 0px;
margin: 0px;
font-weight: bold;
}
h3.t02{
color:#609dd5;
}
h4{
font-size: 120%; 
font-weight: bold;
text-align:center;
}
h5{
font-size: 100%; 
font-weight: bold;
text-align:left;
padding: 0px;
margin: 0px;
}
.font110{
font-size: 110%;
}
.font120{
font-size: 120%;
}
.font130{
font-size: 130%;
}
.font140{
font-size: 140%;
}
.font150{
font-size: 150%;
}
.font200{
font-size: 200%;
}
.font300{
font-size: 300%;
}
.blue{
color:#005ead; 
}
.sky{
color:#0098CB; 
}
.orage{
color: #f5a200;
}
.green{
color: #13ae67;
}
.pink
color:#f0908a;
}
.red{
color: #e60012;
}
.purple{
color:#915da3;
}
.yellow{
color:#B2C83E;
}
.brown{
color:#b29a84; 
}
.magenta{
color: #D52558;
}
.gray{
color: #3E3D3D;
}
big{
font-size: 120%;
line-height:160%;
font-weight: bold;
} .contents {
width: 100%;
margin: 30px auto 0px auto;
font-size: 120%;
line-height: 200%; 
color:#343434;
}
.contents h2{
position: relative;
font-size: 200%; 
line-height: 130%;
letter-spacing: 5px;
}
@media screen and (max-width: 767px) {
.contents h2{
font-size: 165%; 
letter-spacing: 1px;
}
}
.contents h2.nom{
margin: 0 !important;
padding: 0 !important;
}
.contents h2 img{
width: 100%;
height: auto;
}
.contents h2 span{
position: absolute;
top: 50px;
left: 0;
right: 0;
color:#fff;
}
@media screen and (max-width: 767px) {
.contents h2 span{
top: 30px;
}
}
.contents h2 span.gray{
color: #3E3D3D;
}
.contents h3{
font-size: 180%; 
line-height: 200%;
letter-spacing: 5px;
text-align:center;
padding: 15px 0px 15px 0px;
margin: 15px 10% 15px 10%;
font-weight: bold;
background-size: 100% auto;
background-repeat: no-repeat;
background-position: center bottom;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
color:#609dd5;
}
@media screen and (max-width: 767px) {
.contents h3{
font-size: 130%; 
line-height: 160%;
letter-spacing: 0px;
padding: 10px 0px 10px 0px;
margin: 15px auto 15px auto;
}
}
.contents h3.line01{
background-image: url(//nanohana-en.com/images/line-blue.jpg);
}
.contents h3.line02{
color:#F39800;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-orange.jpg);
}
@media screen and (max-width: 767px) {
.contents h3.line02{
font-size: 130%; 
}
}
.contents h3.noline02{
color:#F39800;
}
.contents h3.line03{
color:#EF8B8E;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-red.jpg);
}
@media screen and (max-width: 767px) {
.contents h3.line03{
font-size: 130%; 
}
}
.contents h3.line04{
color:#42BAA0;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-green.jpg);
}
@media screen and (max-width: 767px) {
.contents h3.line04{
font-size: 130%; 
}
}
.contents h3.line05{
color:#B2C83E;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-yellow.jpg);
}
@media screen and (max-width: 767px) {
.contents h3.line05{
font-size: 130%; 
}
}
.contents h4{
font-size: 160%; 
line-height: 200%;
letter-spacing: 5px;
text-align:center;
font-weight: bold;
}
@media screen and (max-width: 767px) {
.contents h4{
font-size: 120%; 
letter-spacing: 1px;
line-height: 150%;
}
}
.contents h4.t02{
color: #609dd5;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
}
.contents a{
color: #609dd5;
text-decoration: underline;
}
.contents a:hover{
color: #ccc;
text-decoration: underline;
}
#prekindergarten01 .contents a{
color:#F39800;
text-decoration: underline;
}
#prekindergarten01 .contents a:hover{
color: #ccc;
text-decoration: underline;
}
#junior01 .contents a{
color: #4ab9a1;
text-decoration: underline;
}
#junior01 .contents a:hover{
color: #ccc;
text-decoration: underline;
}
#contact01 .contents a{
color: #915da3;
text-decoration: underline;
}
#contact01 .contents a:hover{
color: #ccc;
text-decoration: underline;
}
#catalog01 .contents a{
color: #b3c83d;
text-decoration: underline;
}
#catalog01 .contents a:hover{
color: #ccc;
text-decoration: underline;
}
.pan{
width: 80%;
max-width: 1000px;
margin: 5px auto 5px auto;
font-size: 75%; 
line-height: 130%;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
text-align:left;
color:#3E3D3D;
font-weight: bold;
letter-spacing: 1px;
}
.pan a{
color:#3E3D3D !important;
text-decoration: none !important;
}
@media only screen and (max-width: 767px) {
.pan{
display:none;
}
}
.box100 {
width: 100%;
padding: 35px 0 35px 0;
margin: auto;
text-align: justify;
text-justify: inter-ideograph;
}
.box80 {
width: 80%;
max-width: 1000px;
padding: 35px 0 35px 0;
margin: auto;
text-align: justify;
text-justify: inter-ideograph;
}
.box50{
width:50% !important;
margin:auto !important;  
text-align: left;
}
.box60 {
width: 60%;
max-width: 800px;
text-align: left;
margin: auto;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.box80 {
width: 85%;
text-align: left;
padding: 20px 0 20px 0px;
margin: auto;
}
.box50{
width:80% !important;
margin:auto !important;  
padding: 20px 0 20px 0px;
text-align: left;
}
.box60 {
width: 80%;
text-align: left;
padding: 20px 0 20px 0px;
margin: auto;
}
}
@media only screen and (max-width: 767px) {	
.box {
width: 95%;
text-align: left;
padding: 20px 0 20px 0px;
margin: auto;
}
.box50{
width:90% !important;
margin:auto !important;  
padding: 20px 0 20px 0px;
text-align: left;
}
.contents-bottom.box50{
width:100% !important;
}
.box60 {
width: 90%;
text-align: left;
padding: 20px 0 20px 0px;
margin: auto;
}
}
.box-blue {
padding: 5%;
margin:30px auto 30px auto ; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#E1E9F0;
}
.box-blue h4{
font-size: 200%; 
line-height: 100%;
letter-spacing: 5px;
text-align:center;
vertical-align:middle;
padding: 20px 0px 20px 0px;
margin: 0 auto 0 auto;
font-weight: bold;
}
@media screen and (max-width: 767px) {
.box-blue h4{
font-size: 150%;
letter-spacing: 1px;
}
}
.box-blue h4 span{
display: inline-block;
font-size: 300%; 
color:#609dd5;
padding: 0px 20px 0px 0px;
margin: 15px auto 15px auto;
font-family: 'antrf';
vertical-align:middle;
}
@media screen and (max-width: 767px) {
.box-blue h4 span{
font-size: 200%; 
}
}
.box-white {
padding: 5%;
margin:30px auto 30px auto ; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#fff;
}
.box-white h4{
font-size: 200%; 
line-height: 100%;
letter-spacing: 5px;
text-align:center;
vertical-align:middle;
padding: 20px 0px 20px 0px;
margin: 0 auto 0 auto;
font-weight: bold;
}
@media screen and (max-width: 767px) {
.box-white h4{
font-size: 150%; 
letter-spacing: 1px;
}
}
.box-white h4 span{
display: inline-block;
font-size: 300%; 
color:#609dd5;
padding: 0px 20px 0px 0px;
margin: 15px auto 15px auto;
font-family: 'antrf';
vertical-align:middle;
}
@media screen and (max-width: 767px) {
.box-white h4 span{
font-size: 200%; 
}
}
.box-orange {
padding: 5%;
margin:30px auto 30px auto ; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#FEEACE;
}
.box-orange .box80{
width: 80%;
max-width: 800px;
text-align: left;
padding: 0px;
margin: auto;
}
@media only screen and (max-width: 767px) {	
.box-orange .box80{
width:100%;
}
}
.box-orange h4{
font-size: 150%; 
line-height: 100%;
letter-spacing: 5px;
text-align:center;
vertical-align:middle;
padding: 20px 0px 20px 0px;
margin: 0 auto 0 auto;
font-weight: bold;
}
@media only screen and (max-width: 767px) {	
.box-orange h4{
font-size: 120%; 
letter-spacing: 1px;
text-align:left;
}
}
.about01-back01 {
background: url(//nanohana-en.com/images/about01-back01.gif) no-repeat center top #FFFCE1;
background-size: 100% auto;
padding-top: 50px;
}
.about01-back01 .box80{
text-align:center;
}
.about01-back01 h3{
color:#609dd5;
}
.about01-back01 h3 span{
display: inline-block;
font-size: 300%; 
color:#609dd5;
padding: 0px 0px 0px 0px;
margin: 15px auto 15px auto;
font-family: 'antrf';
vertical-align:middle;
}
.contents .about01-back01 h4{
line-height: 160%;
padding-bottom: 30px auto 0px auto;
margin-bottom: 0px;
}
.about01-back01 h4 span{
display: inline-block;
font-size: 300%; 
color:#609dd5;
padding: 0px 20px 0px 0px;
margin: 15px auto 15px auto;
font-family: 'antrf';
vertical-align:middle;
}
.about01-back01 img{
width:300px;
max-width:80%;
height:auto;
margin: 0px auto 35px auto;
}
.about01-back01 .box-white {
margin: 0px 0px 70px 0px;
padding: 0px;
background:none;
position: relative;
z-index: 1; 
text-align: center;
}
.about01-back01 .box-white label{
color: #fff;
background:#609dd5;
display:inline-block;
cursor: pointer;
position: absolute;
top: -35px;
right: 0;
left: 0;
border-radius: 5px 5px 0 0;
-moz-border-image: border-radius: 5px 5px 0 0;
-webkit-border-image: border-radius:  5px 5px 0 0;
width:120px;
margin: 0 auto;
text-align: center;
z-index: 2; 
}
.about01-back01 .box-white label:after{
display: inline-block;
content: '▶';
color: #fff;
text-decoration: none;
padding:0px 0px 0px 10px;
font-size: 80%;
}
.about01-back01 .box-white input:checked ~ label:after {
display: inline-block;
content: '▼';
color: #fff;
text-decoration: none;
padding:0px 0px 0px 10px;
font-size: 80%;
}
.about01-back01 .box-white input{
display: none;
margin: 0px;
padding: 0px;
}
.about01-back01 .box-white div.ac-small{
height: 0;
margin-top: 0;
overflow: hidden;
opacity: 0;
padding: 30px;
transition: all .2s ease-out;
text-align: left;
}
.about01-back01 .box-white input:checked ~ div.ac-small{
height: auto;
margin-top: 16px;
opacity: 1;
transition: all .2s ease-out;
padding: 30px;
background: #fff;
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
} .about01-back01 .box-white:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.about01-back01 .img-left{
float:left;
width: 30%;	
height:auto;
display:block;
padding-top:24px; 
}
.about01-back01 .txt-left{
float:left;
width: 64%;	
height:auto;
display:block;
padding:0 0 0 3%; 
}
.about01-back01 .img-right{
float:right;
width: 30%;	
height:auto;
padding-top:24px; 
}
.about01-back01 .txt-right{
float:right;
width: 64%;	
height:auto;
padding:0 3% 0 0; 
}
@media only screen and (max-width: 767px) {	
.about01-back01 .img-left{
float:none;
width: 80%;	
height:auto;
padding:0 10% 15px 10%; 
}
.about01-back01 .txt-left{
float:none;
width: 100%;	
height:auto;
padding:0 ; 
}
.about01-back01 .img-right{
float:none;
width: 80%;	
height:auto;
padding:0 10% 15px 10%; 
}
.about01-back01 .txt-right{
float:none;
width: 100%;	
height:auto;
padding:0 ; 
}
}
.about01-back02 {
background: url(//nanohana-en.com/images/about01-back02.jpg) no-repeat center top #FFFCE1;
background-size: 100% 100%;
padding-top: 50px;
}
@media screen and (max-width: 767px) {
.about01-back02 {
background: url(//nanohana-en.com/images/about01-back02.jpg) no-repeat center top #FFFCE1;
background-size: auto 100%;
}
}
.about01-back02 h3{
color:#fff;
padding-bottom: 60px;
}
.about01-back02 dl{
display: flex;
flex-wrap: wrap;
align-items: stretch;
padding: 0px!important;
margin: 0px!important;
}
.about01-back02 dt{
width: 110px;
vertical-align:top;
text-align:center;
padding:0 30px 30px 0; 
position: relative;
}
.about01-back02 dt:after {
position: absolute;
top: 45px;
left: 0;
width: 110px;
height: calc(100% - 45px);
background-image: url(//nanohana-en.com/images/time-back.png);
background-position: 0 0;
background-repeat: repeat;
background-size: 100% auto;
content: '';
display: block;
}
.about01-back02 dt:last-of-type:after {
background-image: none;
}
.about01-back02 dt img{
width: 100%;
height:auto; 
}
.about01-back02 dd{
width: calc(100% - 202px);
vertical-align:top;
text-align:left;
padding: 30px;
margin:-30px 0 60px 0; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#fff;
border: 1px solid #609dd5;
font-size: 110%; 
font-weight: bold;
}
.about01-back02 dd big{
color: #609dd5;
}
.about01-back02 .txt-left{
float:left;
width: 65%;	
height:auto;
display:block;
padding:0; 
}
.about01-back02 .img-right{
float:right;
width: 30%;	
height:auto;
padding:0; 
}
@media only screen and (max-width: 767px) {
.about01-back02 dt{
width: 70px;
vertical-align:top;
text-align:center;
padding:0 10px 10px 0; 
position: relative;
}
.about01-back02 dt:after {
position: absolute;
top: 30px;
left: 0;
width: 70px;
height: calc(100% - 30px);
background-image: url(//nanohana-en.com/images/time-back.png);
background-position: 0 0;
background-repeat: repeat;
background-size: 100% auto;
content: '';
display: block;
}
.about01-back02 dd{
width: calc(100% - 132px);
vertical-align:top;
text-align:left;
padding: 15px;
margin:-15px 0 60px 0; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#fff;
border: 1px solid #609dd5;
font-size: 100%; 
font-weight: normal;
}	
.about01-back02 .txt-left{
float:none;
width: 100%;	
height:auto;
padding:0 ; 
}
.about01-back02 .img-right{
float:none;
width: 80%;	
height:auto;
padding:0 10% 15px 10%; 
}
}
.about01-back01 dl{
display: flex;
flex-wrap: wrap;
align-items: stretch;
padding: 0px!important;
margin: 0px!important;
}
.about01-back01 dt{
width: 175px;
vertical-align:top;
text-align:center;
padding:0 30px 30px 0; 
position: relative;
}
.about01-back01 dt img{
width: 100%;
height:auto; 
}
.about01-back01 dd{
width: calc(100% - 205px);
vertical-align:top;
text-align:left;
padding: 0 0 30px 0; 
}
.about01-back01 dd div{
text-align:left;
padding: 20px;
margin:0; 
border-radius: 20px;
-moz-border-image: border-radius:20px;
-webkit-border-image: border-radius: 20px;
}
.about01-back01 dd big{
font-size: 150%;
}
.about01-back01 dd:nth-of-type(1) div{
background:#e6dded;
}
.about01-back01 dd:nth-of-type(1) big{
color: #915da3;
}
.about01-back01 dd:nth-of-type(2) div{
background:#e2f1ec;
}
.about01-back01 dd:nth-of-type(2) big{
color: #4ab9a1;
}
.about01-back01 dd:nth-of-type(3) div{
background:#fef0db;
}
.about01-back01 dd:nth-of-type(3) big{
color: #f39800;
}
@media only screen and (max-width: 767px) {
.about01-back01 dl{
display: block;
}
.about01-back01 dt{
width: 80%;
vertical-align:top;
text-align:center;
padding:0 10% 15px 10%; 
}
.about01-back01 dd{
width: 100%;
vertical-align:top;
text-align:left;
padding: 0 0 50px 0; 
}
}
.about02-back01 .txt-left{
float:left;
width: calc(100% - 230px);	
height:auto;
display:block;
padding:0 0 0 30px; 
}
.about02-back01 .img-right{
float:right;
width: 170px;	
height:auto;
}
.about02-back01 .img-right div{
padding:0; 
margin:0; 
text-align: center;
}
.about02-back01 .img-right img{
width: 100%;	
height:auto;
}
@media only screen and (max-width: 767px) {	
.about02-back01 .txt-left{
float:none;
width: 100%;	
height:auto;
padding:0 ; 
}
.about02-back01 .img-right{
float:none;
width: 80%;	
height:auto;
padding:0 10% 15px 10%; 
}
}
.mori-back {
background: url(//nanohana-en.com/images/mori-back.jpg) no-repeat center center;
background-size: 100% 100%;
padding: 20px;
margin: 30px auto 0px auto;
}
.mori-back h4{
padding: 10px 0px 10px 0px;
margin: 0px;
}
.mori-back ul{
display: flex;
align-items: stretch;
list-style: none;
padding: 0px;
margin:0px;
}
.mori-back li{
text-align:center;
margin:20px;
}
.mori-back li:nth-child(1){
width:30%;
}
.mori-back li:nth-child(2){
width:40%;
}
.mori-back li:nth-child(3){
width:30%;
}
.mori-back li img{
width: 100%;
height:auto;
}
@media only screen and (max-width: 767px) {	
.mori-back ul{
display: block;
}
.mori-back li{
text-align:center;
margin:0px auto 30px auto;
}
.mori-back li:nth-child(1){
width:80%;
}
.mori-back li:nth-child(2){
width:80%;
}
.mori-back li:nth-child(3){
width:80%;
}
}
.about02-back02 .txt-left{
float:left;
width: calc(100% - 230px);	
height:auto;
display:block;
padding:0 0 30px 30px; 
}
.about02-back02 .img-right{
float:right;
width: 170px;	
height:auto;
padding:0 0 30px 0; 
}
.about02-back02 .img-right img{
width: 100%;	
height:auto;
}
.about02-back02 h4{
font-size: 110%; 
line-height: 160%;
letter-spacing: 0px;
text-align:left;
font-weight: bold;
color: #609dd5;
font-family:   'fot-tsukubrdgothic-std';
padding:0 ;
margin:0 ;  
}
@media only screen and (max-width: 767px) {	
.about02-back02 .txt-left{
float:none;
width: 100%;	
height:auto;
padding:0 ; 
}
.about02-back02 .img-right{
float:none;
width: 80%;	
height:auto;
padding:0 10% 15px 10%; 
}
}
.table01 {
width: 100%;
}
.table01 th{
background:#E1E9F0;
text-align:center;
font-weight: normal;
border-top: 1px solid #ccc;
padding:15px 30px 15px 30px; 
}
.table01 td{
border-top: 1px solid #ccc;
padding:15px; 
}
.table01 tr:last-of-type th, .table01 tr:last-of-type td {
border-bottom: 1px solid #ccc;
}
@media only screen and (max-width: 767px) {	
.table01 th{
padding:5px; 
}
.table01 td{
padding:5px; 
}
.table01 tr:last-of-type th{
border-bottom: none;
}
}
.contents .about03-back01 h3.line01{
color:#609dd5;	
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-blue.jpg);
}
@media screen and (max-width: 767px) {
.contents .about03-back01 h3.line01{
font-size: 110%; 
text-align:left;
}
}
.about03-back01 h4{
color:#609dd5;
font-size: 200%; 
line-height: 100%;
text-align:left;
padding: 0px;
margin: 0px;
font-weight: bold;
font-family: 'antrf','fot-tsukubrdgothic-std';
}
@media screen and (max-width: 767px) {
.about03-back01 h4{
font-size: 150%; 
text-align:left;
}
}
.contents .about03-back02 h3.line02{
color:#F39800;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-orange.jpg);
}
@media screen and (max-width: 767px) {
.contents .about03-back02 h3.line02{
font-size: 110%; 
text-align:left;
}
}
.about03-back02 h4{
color:#F39800;
font-size: 200%; 
line-height: 100%;
text-align:left;
padding: 0px;
margin: 0px;
font-weight: bold;
font-family: 'antrf','fot-tsukubrdgothic-std';
}
@media screen and (max-width: 767px) {
.about03-back02 h4{
font-size: 150%; 
text-align:left;
}
}
.contents .about03-back03 h3.line03{
color:#EF8B8E;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-red.jpg);
}
@media screen and (max-width: 767px) {
.contents .about03-back03 h3.line03{
font-size: 110%; 
text-align:left;
}
}
.about03-back03 h4{
color:#EF8B8E;
font-size: 200%; 
line-height: 100%;
text-align:left;
padding: 0px;
margin: 0px;
font-weight: bold;
font-family: 'antrf','fot-tsukubrdgothic-std';
}
@media screen and (max-width: 767px) {
.about03-back03 h4{
font-size: 150%; 
text-align:left;
}
}
.contents .about03-back04 h3.line04{
color:#42BAA0;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-green.jpg);
}
@media screen and (max-width: 767px) {
.contents .about03-back04 h3.line04{
font-size: 110%; 
text-align:left;
}
}
.about03-back04 h4{
color:#42BAA0;
font-size: 200%; 
line-height: 100%;
text-align:left;
padding: 0px;
margin: 0px;
font-weight: bold;
font-family: 'antrf','fot-tsukubrdgothic-std';
}
@media screen and (max-width: 767px) {
.about03-back04 h4{
font-size: 150%; 
text-align:left;
}
}
.contents .about03-back05 h3.line05{
color:#B2C83E;
font-size: 160%; 
background-image: url(//nanohana-en.com/images/line-yellow.jpg);
}
@media screen and (max-width: 767px) {
.contents .about03-back05 h3.line05{
font-size: 110%; 
text-align:left;
}
}
.about03-back05 h4{
color:#B2C83E;
font-size: 200%; 
line-height: 100%;
text-align:left;
padding: 0px;
margin: 0px;
font-weight: bold;
font-family: 'antrf','fot-tsukubrdgothic-std';
}
@media screen and (max-width: 767px) {
.about03-back05 h4{
font-size: 150%; 
text-align:left;
}
}
.contents .about03-back01 h3.line01 img,.contents .about03-back02 h3.line02 img,.contents .about03-back03 h3.line03 img,.contents .about03-back04 h3.line04 img,.contents .about03-back05 h3.line05 img{
width:auto;
height: 56px;
padding: 5px 15px 0 0;
}
@media screen and (max-width: 767px) {
.contents .about03-back01 h3.line01 img,.contents .about03-back02 h3.line02 img,.contents .about03-back03 h3.line03 img,.contents .about03-back04 h3.line04 img,.contents .about03-back05 h3.line05 img{
width:auto;
height: 25px;
padding: 2px 2px 2px 0;
}
}
.grid-sizer,
.grid-item {
width: 40%;
padding: 2.5%;
margin-top: 2.5%;
margin-bottom: 2.5%;
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
}
.grid-item img {
width: 100%;
height: auto;
}
.gutter-sizer {
width: 4%;
}
@media screen and (max-width: 767px) {
.grid-sizer,
.grid-item {
width: 90%;
padding: 5%;
margin-top: 15px;
margin-bottom: 15px;
}
}
.about03-back01 .grid-item {
background:#E1E9F0;
}
.about03-back02 .grid-item {
background:#FEEFDB
}
.about03-back03 .grid-item {
background:#FCE3DC
}
.about03-back04 .grid-item {
background:#E0F0E7
}
.about03-back05 .grid-item {
background:#F2F4DE
}
.shop-list {
padding: 5%;
margin:30px auto 30px auto ; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
border:2px solid #609dd5;
text-align: center;
}
.shop-list h3{
padding: 0;
margin:0; 
}
.book-list{
padding-top:0;
}
.book-list:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.book-list .grid-item {
width: 40%;
padding: 0 4%;
margin-top: 2% auto 0 auto;
display:inline-block;
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
vertical-align:top;
}
@media screen and (max-width: 767px) {
.book-list .grid-item {
display:block;
width: 90%;
margin: 30px auto 60px auto;
}
}
.book-img{
text-align: center;
margin: auto;
}
.book-list .grid-item img {
width: auto;
max-width: 100%;
height: auto;
max-height: 300px;
margin: auto;
}
.book-list .gutter-sizer {
width: 4%;
}
.contents .book-list h4{
font-size: 140%; 
letter-spacing: 1px;
color:#609dd5;
padding: 0;
margin:0; 
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
}
@media screen and (max-width: 767px) {
.contents .book-list h4{
font-size: 120%; 
letter-spacing: 0px;
}
}
.book-more {
padding: 15px;
background:#E1E9F0;
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
position: relative;
z-index: 1; 
}
.book-more label{
color: #609dd5;
display:block;
cursor: pointer;
position: relative;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
}
.book-more label:after{
display: inline-block;
content: '▶';
color: #609dd5;
text-decoration: none;
position: absolute;
top: 0px;
right: 5px;
}
.book-more input:checked ~ label:after {
display: inline-block;
content: '▼';
color: #609dd5;
text-decoration: none;
position: absolute;
top: 0px;
right: 5px;
}
.book-more input{
display: none;
margin: 0px;
padding: 0px;
}
.book-more div.ac-small{
height: 0;
margin-top: 0;
overflow: hidden;
opacity: 0;
transition: all .2s ease-out;
}
.book-more input:checked ~ div.ac-small{
height: auto;
margin-top: 10px;
opacity: 1;
transition: all .2s ease-out;
}
.box-bank{
padding: 5%;
margin:30px auto 30px auto ; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
border:2px solid #F39800;
text-align: center;
background:#fff;
}
.box-bank table {
width: 100%;
}
.box-bank table td{
border-bottom: 1px solid #999;
padding:15px; 
font-size: 120%;
line-height: 120%; 
font-weight: bold;
}
.box-bank table td small{
font-weight: normal;
}
@media only screen and (max-width: 767px) {	
.box-bank table td{
font-size: 100%;
padding:5px; 
display: block;
width: auto;
}
.box-bank table tr td:first-child {
border-bottom: none;
}
}
.square-orange {
padding: 5%;
margin:30px auto 30px auto ; 
border: 2px solid #F39800;
}
.contents .admission01-back01 h3.line05{
font-family:   'fot-tsukubrdgothic-std';
font-size: 140%; 
}
.niji-back {
background: url(//nanohana-en.com/images/niji-back.jpg) no-repeat center center;
background-size: 100% 100%;
padding: 20px;
margin: 30px auto 30px auto;
font-size: 160%; 
font-weight: bold;
text-align: center;
line-height: 200%; 
letter-spacing: 2px;
}
@media screen and (max-width: 767px) {
.niji-back {
font-size: 120%; 
}
}
.niji-back big{
font-size: 140%;
letter-spacing: 5px;
}
.niji-back small{
font-size: 70%;
font-weight: normal;
}
.admission01-back02 {
background: url(//nanohana-en.com/images/admission01-back02.jpg) no-repeat center top;
background-size: 100% 100%;
padding-top: 50px;
}
@media screen and (max-width: 767px) {
.admission01-back02 {
background: url(//nanohana-en.com/images/admission01-back02.jpg) no-repeat center top;
background-size: auto 100%;
}
}
.admission01-back02 h3{
color: #3E3D3D;
}
.admission01-back02 h4{
font-size: 200%; 
color: #B2C83E;
padding: 0px;
margin: 0px;
letter-spacing: 0px;
}
@media screen and (max-width: 767px) {
.admission01-back02 h4{
font-size: 130%; 
}
}
.admission01-back02 h4 span{
font-size: 250%; 
font-family: 'antrf','fot-tsukubrdgothic-std';
position: absolute;
top: 20px;
left: 20px;
}
@media screen and (max-width: 767px) {
.admission01-back02 h4 span{
font-size: 180%; 
font-family: 'antrf','fot-tsukubrdgothic-std';
position: relative;
top: 5px;
left: -5px;
}
}
.admission01-back02 h4 small{
font-weight: normal;
}
.admission01-back02 h4 sup{
font-size: 50%; 
color: #3E3D3D;
}
.box-flow {
padding: 15px;
background: rgba(255,255,255,0.6);
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
position: relative;
text-align: center;
margin: 0px auto 80px auto;
}
.box-flow:after {
position: absolute;
bottom: -69px;
left: 0px;
right: 0px;
width: 48px;
height: 63px;
background-image: url(//nanohana-en.com/images/yaji.png);
background-repeat: no-repeat;
background-size: 48px 63px;
content: '';
display: block;
margin:auto;
text-align: center; 
}
.box-flow.last:after {
background-image: none;
}
.admission01-back03 h3{
font-size: 130%; 
color: #B2C83E;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
letter-spacing: 0px;
}
.wpcf7 label{
font-size: 110%; 
color: #B2C83E;
font-weight: bold;
}
span.wpcf7-list-item {
display: block !important;
}
span.wpcf7-list-item input {
height: 15px !important;
}
.wpcf7 input,.wpcf7 textarea {
border: 1px solid #b5b5b6!important;
color: #3E3D3D;
line-height:200%;
border-radius: 10px;       
-webkit-border-radius: 10px;  
-moz-border-radius: 10px; 
width: 95%;
padding:1% 2%;
margin:1% 0;
font-size: 100%; 
}
span[data-name="your-schedule"],span[data-name="your-number"]{
border: 1px solid #b5b5b6!important;
color: #3E3D3D;
border-radius: 10px;       
-webkit-border-radius: 10px;  
-moz-border-radius: 10px; 
width: 95%;
padding:2%;
margin:4% 0;
text-align: center;
position: relative;
background: #ffffff;
line-height:400%;
}
span[data-name="your-schedule"]::before,span[data-name="your-number"]::before {
position: absolute;
top: 45%;
right: 2%;
width: 0;
height: 0;
padding: 0;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 8px solid  #B2C83E;
pointer-events: none;
}
span[data-name="your-schedule"] select,span[data-name="your-number"] select {
width: 95%;
padding:0;
margin:0;
cursor: pointer;
text-overflow: ellipsis;
border: none;
outline: none;
background: transparent;
background-image: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
line-height:200%;
font-size: 100%; 
}
span[data-name="your-schedule"] select::-ms-expand,span[data-name="your-number"] select::-ms-expand {
display: none;
}
.wpcf7 input.wpcf7-submit {
width:auto;
display: inline-block!important;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #B2C83E!important;
color: #B2C83E;
line-height:300%;
border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; font-weight: bold;
padding:0px 30px 0px 30px;
margin:auto;
cursor: pointer;
}
.wpcf7 input.wpcf7-submit:hover {
background-color: #B2C83E;
color: #fff;
}
.wpcf7-spinner{
display: block!important;
}
.wpcf7-list-item {
margin: 0;
}
.wpcf7-list-item-label {
cursor: pointer;
display: flex;
color: #3E3D3D;
font-weight: normal;
}
.wpcf7 input[type="radio"],.wpcf7 input[type="checkbox"] {
opacity: 0; 
position: absolute;
}
.wpcf7-list-item-label::before {
background: #fff;
border: 1px solid #333;
border-radius: 100%; 
content: "";
height: 1em;
margin-bottom: auto;
margin-right: .5em;
margin-top: auto;
transition: background-color .5s; 
width: 1em;
}
.wpcf7 input[type="radio"]:checked + .wpcf7-list-item-label::before {
background-color: #3E3D3D; 
box-shadow: inset 0 0 0 3px #fff; 
}
.wpcf7 input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
background-color: #3E3D3D; 
box-shadow: inset 0 0 0 3px #fff; 
}
span[data-name="your-check"] {
position: relative;
width: 100%;
display:block;
}
.admission02-back01 .qa-list {
padding: 15px;
background:#fff;
position: relative;
z-index: 1; 
padding:30px 0px 30px 0px;
}
.admission02-back01 .qa-list label{
display:block;
cursor: pointer;
position: relative;
text-align: left;
font-size: 130%;
font-weight: bold;
line-height: 200%; 
vertical-align:middle;
padding:0px 30px 0px 90px;
}
@media screen and (max-width: 767px) {
.admission02-back01 .qa-list label{
font-size: 110%;
padding:0px 30px 0px 60px;
}
}
.admission02-back01 .qa-list label span{
position: absolute;
top: 0px;
left: 0px;
font-size: 240%;
color: #B2C83E;
display: inline-block;
font-family: 'antrf';
}
@media screen and (max-width: 767px) {
.admission02-back01 .qa-list label span{
font-size: 160%;
}
}
.admission02-back01 .qa-list label:before{
content: '';
display: block;
width:100%;
height: 24px;
background-image: url(//nanohana-en.com/images/line-yellow.jpg);
background-size:  100% auto;
background-repeat:  no-repeat;
position: absolute;
top: -40px;
left: 0px;
margin:auto;
}
.admission02-back01 .qa-list label:after{
display: inline-block;
content: '▶';
color: #B2C83E;
text-decoration: none;
padding:0px 0px 0px 10px;
font-size: 80%;
position: absolute;
top: 0;
right: 3%;
}
.admission02-back01 .qa-list input:checked ~ label:after {
display: inline-block;
content: '▼';
color: #B2C83E;
text-decoration: none;
padding:0px 0px 0px 10px;
font-size: 80%;
}
.admission02-back01 .qa-list input{
display: none;
margin: 0px;
padding: 0px;
}
.admission02-back01 .qa-list div.ac-small{
margin: 0;
padding: 0px;
overflow: hidden;
height: 0px;
position: relative;
z-index: 0;
transition: 
height 0.3s ease-in-out, 
box-shadow 0.6s linear;
}
.admission02-back01 .qa-list input:checked ~ div{
transition: 
height 0.5s ease-in-out, 
}
.admission02-back01 .qa-list input:checked ~ div.ac-small{
height:auto;
background-color: #E4EAC5;
border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; padding: 20px;
}
.admission02-back01 .qa-list:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.wpcf7-not-valid-tip {
position: absolute;
top:0;
right: 4%;
z-index: 100;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border: none; 
color:#dc3232;
text-align: center;
}
.prekindergarten01-back01 {
background: url(//nanohana-en.com/images/prekindergarten01-back01.jpg) no-repeat center top;
background-size: 100% 100%;
padding-top: 50px;
}
@media screen and (max-width: 767px) {
.prekindergarten01-back01 {
background: url(//nanohana-en.com/images/prekindergarten01-back01.jpg) no-repeat center top;
background-size: auto 100%;
}
}
.prekindergarten02-back01 {
background: url(//nanohana-en.com/images/prekindergarten02-back01.jpg) no-repeat center top;
background-size: 100% 100%;
padding-top: 50px;
}
@media screen and (max-width: 767px) {
.prekindergarten02-back01 {
background: url(//nanohana-en.com/images/prekindergarten02-back01.jpg) no-repeat center top;
background-size: auto 100%;
}
}
.prekindergarten01-back01 h3,.prekindergarten02-back01 h3{
color: #3E3D3D;
padding-bottom: 60px;
}
.prekindergarten01-back01 dl,.prekindergarten02-back01 dl{
display: flex;
flex-wrap: wrap;
align-items: stretch;
padding: 0px!important;
margin: 0px!important;
}
.prekindergarten01-back01 dt,.prekindergarten02-back01 dt{
width: 110px;
vertical-align:top;
text-align:center;
padding:0 30px 30px 0; 
position: relative;
}
.prekindergarten01-back01 dt:after,.prekindergarten02-back01 dt:after {
position: absolute;
top: 45px;
left: 0;
width: 110px;
height: calc(100% - 45px);
background-image: url(//nanohana-en.com/images/otime-back.png);
background-position: 0 0;
background-repeat: repeat;
background-size: 100% auto;
content: '';
display: block;
}
.prekindergarten01-back01 dt:last-of-type:after,.prekindergarten02-back01 dt:last-of-type:after {
background-image: none;
}
.prekindergarten01-back01 dt img,.prekindergarten02-back01 dt img{
width: 100%;
height:auto; 
}
.prekindergarten01-back01 dd,.prekindergarten02-back01 dd{
width: calc(100% - 202px);
vertical-align:top;
text-align:left;
padding: 30px;
margin:-30px 0 60px 0; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#fff;
border: 1px solid #F39800;
font-size: 110%; 
font-weight: normal;
}
.prekindergarten01-back01 dd big,.prekindergarten02-back01 dd big{
color: #F39800
}
.prekindergarten01-back01 .txt-left,.prekindergarten02-back01 .txt-left{
float:left;
width: 65%;	
height:auto;
display:block;
padding:0; 
}
.prekindergarten01-back01 .img-right,.prekindergarten02-back01 .img-right{
float:right;
width: 30%;	
height:auto;
padding:0; 
}
@media only screen and (max-width: 767px) {
.prekindergarten01-back01 dt,.prekindergarten02-back01 dt{
width: 70px;
vertical-align:top;
text-align:center;
padding:0 10px 10px 0; 
position: relative;
}
.prekindergarten01-back01 dt:after,.prekindergarten02-back01 dt:after {
position: absolute;
top: 30px;
left: 0;
width: 70px;
height: calc(100% - 30px);
background-image: url(//nanohana-en.com/images/otime-back.png);
background-position: 0 0;
background-repeat: repeat;
background-size: 100% auto;
content: '';
display: block;
}
.prekindergarten01-back01 dd,.prekindergarten02-back01 dd{
width: calc(100% - 132px);
vertical-align:top;
text-align:left;
padding: 15px;
margin:-15px 0 60px 0; 
border-radius: 30px;
-moz-border-image: border-radius:30px;
-webkit-border-image: border-radius: 30px;
background:#fff;
border: 1px solid #F39800;
font-size: 100%; 
font-weight: normal;
}	
.prekindergarten01-back01 .txt-left,.prekindergarten02-back01 .txt-left{
float:none;
width: 100%;	
height:auto;
padding:0 ; 
}
.prekindergarten01-back01 .img-right,.prekindergarten02-back01 .img-right{
float:none;
width: 80%;	
height:auto;
padding:0 10% 15px 10%; 
}
}
.grid-item.voice0101{
background: url(//nanohana-en.com/images/prekindergarten01-back02.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0102{
background: url(//nanohana-en.com/images/prekindergarten01-back03.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0103{
background: url(//nanohana-en.com/images/prekindergarten01-back04.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0104{
background: url(//nanohana-en.com/images/prekindergarten01-back05.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0201{
background: url(//nanohana-en.com/images/prekindergarten02-back02.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0202{
background: url(//nanohana-en.com/images/prekindergarten02-back03.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0203{
background: url(//nanohana-en.com/images/prekindergarten02-back04.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0204{
background: url(//nanohana-en.com/images/prekindergarten02-back05.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0205{
background: url(//nanohana-en.com/images/prekindergarten02-back06.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0206{
background: url(//nanohana-en.com/images/prekindergarten02-back07.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.prekindergarten01-back02 big,.prekindergarten02-back02 big{
font-size: 150%; 
color: #F39800;
font-weight: bold;
}
.prekindergarten01-back02 table,.prekindergarten02-back02 table {
width: 100%;
}
.prekindergarten01-back02 th,.prekindergarten01-back02 td,.prekindergarten02-back02 th,.prekindergarten02-back02 td{
border-top: 1px solid #595757;
padding:15px; 
font-size: 110%;
}
.prekindergarten01-back02 tr:last-of-type th, .prekindergarten01-back02 tr:last-of-type td ,.prekindergarten02-back02 tr:last-of-type th, .prekindergarten02-back02 tr:last-of-type td {
border-bottom: 1px solid #595757;
}
.prekindergarten01-back02 table th,.prekindergarten02-back02 table th{
background: #FFF0DD;
width:25%;
text-align: center;
font-weight: normal;
}
@media only screen and (max-width: 767px) {
.prekindergarten01-back02 table th,.prekindergarten02-back02 table th {
display: block;
width: 100%;
}
.prekindergarten01-back02 th,.prekindergarten01-back02 td,.prekindergarten02-back02 th,.prekindergarten02-back02 td{
padding:10px 0; 
}
.prekindergarten01-back02 tr:last-of-type th, .prekindergarten02-back02 tr:last-of-type th {
border-bottom: none;
}
}
.junior01-back01{
background: url(//nanohana-en.com/images/junior01-back01.jpg) no-repeat center top;
background-size: 100% 100%;
padding-top: 50px;
}
.junior01-back01 h3{
color: #4ab9a1 !important;
font-family:   'fot-tsukubrdgothic-std';
font-size: 165%;
}
@media screen and (max-width: 767px) {
.junior01-back01 h3{
font-size: 130%;
}
}
.junior01-back01 h4{
font-family:   'fot-tsukubrdgothic-std';
font-size: 150% !important;
}
@media screen and (max-width: 767px) {
.junior01-back01 h4{
font-size: 120% !important;
}
}
.junior02-back01 .qa-list {
padding: 15px;
background:#fff;
position: relative;
z-index: 1; 
padding:30px 0px 30px 0px;
}
.junior02-back01 .qa-list label{
display:block;
cursor: pointer;
position: relative;
text-align: left;
font-size: 130%;
font-weight: bold;
line-height: 200%; 
vertical-align:middle;
padding:0px 30px 0px 90px;
}
@media screen and (max-width: 767px) {
.junior02-back01 .qa-list label{
font-size: 110%;
padding:0px 30px 0px 60px;
}
}
.junior02-back01 .qa-list label span{
position: absolute;
top: 0px;
left: 0px;
font-size: 240%;
color: #4ab9a1;
display: inline-block;
font-family: 'antrf';
}
@media screen and (max-width: 767px) {
.junior02-back01 .qa-list label span{
font-size: 160%;
}
}
.junior02-back01 .qa-list label:before{
content: '';
display: block;
width:100%;
height: 24px;
background-image: url(//nanohana-en.com/images/line-green.jpg);
background-size:  100% auto;
background-repeat:  no-repeat;
position: absolute;
top: -40px;
left: 0px;
margin:auto;
}
.junior02-back01 .qa-list label:after{
display: inline-block;
content: '▶';
color: #4ab9a1;
text-decoration: none;
padding:0px 0px 0px 10px;
font-size: 80%;
position: absolute;
top: 0;
right: 3%;
}
.junior02-back01 .qa-list input:checked ~ label:after {
display: inline-block;
content: '▼';
color: #4ab9a1;
text-decoration: none;
padding:0px 0px 0px 10px;
font-size: 80%;
}
.junior02-back01 .qa-list input{
display: none;
margin: 0px;
padding: 0px;
}
.junior02-back01 .qa-list div.ac-small{
margin: 0;
padding: 0px;
overflow: hidden;
height: 0px;
position: relative;
z-index: 0;
transition: 
height 0.3s ease-in-out, 
box-shadow 0.6s linear;
}
.junior02-back01 .qa-list input:checked ~ div{
transition: 
height 0.5s ease-in-out, 
}
.junior02-back01 .qa-list input:checked ~ div.ac-small{
height:auto;
background-color: #BFE0D0;
border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; padding: 20px;
}
.junior02-back01 .qa-list:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.junior03-back01 h4{
color: #4ab9a1;
font-size: 160%;
font-family: 'fot-tsukubrdgothic-std';
letter-spacing: 0px;
}
@media screen and (max-width: 767px) {
.junior03-back01 h4{
font-size: 120%;
}
}
.junior03-back02 h4{
color: #4ab9a1;
font-size: 150%;
line-height: 120%;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
letter-spacing: 2px;
}
@media screen and (max-width: 767px) {
.junior03-back02 h4{
font-size: 120%;
}
}
.junior03-back03 .button05{
margin:15px auto 15px auto;
letter-spacing: 2px;
}
.junior03-back03 .button05:hover {
margin:15px auto 15px auto;
letter-spacing: 2px;
}
.grid-item.voice0301{
background: url(//nanohana-en.com/images/junior04-back01.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0302{
background: url(//nanohana-en.com/images/junior04-back02.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0303{
background: url(//nanohana-en.com/images/junior04-back03.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0304{
background: url(//nanohana-en.com/images/junior04-back04.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0305{
background: url(//nanohana-en.com/images/junior04-back05.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0306{
background: url(//nanohana-en.com/images/junior04-back06.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.grid-item.voice0307{
background: url(//nanohana-en.com/images/junior04-back07.jpg) no-repeat center top;
background-size: 100% 100%;
font-weight: bold;
}
.junior04-back01 h3{
color: #3E3D3D;
font-size: 150%;
font-family: 'fot-tsukubrdgothic-std';
letter-spacing: 2px;
background: url(//nanohana-en.com/images/junior04-title-back.jpg) no-repeat;
background-size: 100% 100%;
display: inline-block;
padding:2.5px 50px 2.5px 50px;
margin-bottom:0px
}
@media screen and (max-width: 767px) {
.junior04-back01 h3{
font-size: 120%;
padding:2.5px 15px 2.5px 15px;
letter-spacing: 0px;
}
}
.junior04-back01 h4{
color: #4ab9a1;
font-size: 150%;
line-height: 120%;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
letter-spacing: 2px;
}
@media screen and (max-width: 767px) {
.junior04-back01 h4{
font-size: 120%;
letter-spacing: 0px;
}
}
#junior01 .grid-sizer,
#junior01 .grid-item {
width: 40%;
padding: 2.5%;
margin-top: 2.5%;
margin-bottom: 2.5%;
border-radius: 0px;
-moz-border-image: border-radius:0px;
-webkit-border-image: border-radius: 0px;
}
@media screen and (max-width: 767px) {
#junior01 .grid-sizer,
#junior01 .grid-item {
width: 90%;
margin-top: 15px;
margin-bottom: 15px;
}
}
#contact01 .contents h2 {
font-size: 200%;
line-height: 120%;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
letter-spacing: 5px;
color: #915da3;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#contact01 .contents h2 {
font-size: 165%; 
letter-spacing: 1px;
}
}
#contact01 .contents h3 {
font-size: 110%;
line-height: 110%;
font-family: 'fot-tsukubrdgothic-std';
letter-spacing: 0px;
color: #915da3;
padding: 0px;
margin: 0px;
}
.maps {
position: relative;
padding-bottom: 50%; 
height: 0;
overflow: hidden;
}
.maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
#contact01 .wpcf7 label{
font-size: 110%; 
color: #915da3;
font-weight: bold;
}
#contact01 span[data-name="your-type"]{
border: 1px solid #b5b5b6!important;
color: #3E3D3D;
border-radius: 10px;       
-webkit-border-radius: 10px;  
-moz-border-radius: 10px; 
width: 95%;
padding:2%;
margin:4% 0;
text-align: center;
position: relative;
background: #ffffff;
line-height:400%;
}
#contact01 span[data-name="your-type"]::before {
position: absolute;
top: 45%;
right: 2%;
width: 0;
height: 0;
padding: 0;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 8px solid  #915da3;
pointer-events: none;
}
#contact01 span[data-name="your-type"] select {
width: 95%;
padding:0;
margin:0;
cursor: pointer;
text-overflow: ellipsis;
border: none;
outline: none;
background: transparent;
background-image: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
line-height:200%;
font-size: 100%; 
}
#contact01 span[data-name="your-type"] select::-ms-expand {
display: none;
}
#contact01 .wpcf7 input.wpcf7-submit {
display: inline-block;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #915da3!important;
color: #915da3;
line-height:300%;
border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; font-weight: bold;
padding:0px 30px 0px 30px;
margin:0;
cursor: pointer;
}
#contact01 .wpcf7 input.wpcf7-submit:hover {
background-color: #915da3;
color: #fff;
}
#contact01 .wpcf7-list-item-label {
cursor: pointer;
display: flex;
color: #3E3D3D;
font-weight: normal;
}
#catalog01 .contents h2 {
font-size: 200%;
line-height: 120%;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
letter-spacing: 5px;
color: #b3c83d;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#catalog01 .contents h2 {
font-size: 165%; 
letter-spacing: 1px;
}
}
#catalog01 .contents h3 {
font-size: 130%;
line-height: 110%;
font-family: 'fot-tsukubrdgothic-std';
letter-spacing: 0px;
color: #b3c83d;
padding: 0px;
margin: 0px;
}
@media screen and (max-width: 767px) {
#catalog01 .contents h3 {
font-size: 120%; 
}
}
#catalog01 .box-bank{
border:2px solid #b3c83d;
}
#letter .contents h3{
font-family:   'fot-tsukubrdgothic-std'; 
color:#ef8a8b;
margin:0;
padding:5px 0;
font-size: 150%;
text-align:left;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
#letter .contents h3{
font-size: 130%; 
letter-spacing: 0px;
}
}
#topics .contents strong,#letter .contents strong{
display: inline-block;
font-family:   'fot-tsukubrdgothic-std'; 	
margin:0;
padding:2px 0;
font-size: 120%;
text-align:left;
letter-spacing: 1px;
}
#letter .post a{
text-decoration: none;
}
#letter .post a p{
color:#ef8a8b;
margin:0;
padding:2px 0;
font-size: 110%;
}
#letter .post a span{
color:#343434;
font-size: 80%;
}
#letter .post a:hover{
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
-moz-transition:0.15s ease-in-out;
-webkit-transition:0.15s ease-in-out;
-o-transition:0.15s ease-in-out;
-ms-transition:0.15s ease-in-out;
}
.postWrap{
display: flex;
flex-wrap: wrap;
align-items: stretch;
list-style: none;
padding: 0px;
margin:0px;
}
.post{
text-align:left;
margin:3%;
width:27%;
line-height: 150%; 
}
.post img{
width: 100%;
height:200px !important;
object-fit: cover; 
border-radius: 20px;
-moz-border-image: border-radius:20px;
-webkit-border-image: border-radius: 20px;
}
@media only screen and (max-width: 767px) {	
.postWrap{
display: block;
}
.post{
text-align:center;
margin:0px auto 30px auto;
width:80%;
}
}
.post-link{
margin:30px auto 30px auto;
display: flex;
justify-content: space-between;
}
.post-link a{
display: block;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #ef8a8b;
color: #ef8a8b;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 100%;
font-weight: bold;
letter-spacing: 1px;
}
.contents .post-link a{
text-decoration: none;
}
.post-link a:hover{
display: inline-block;
background-color: #ef8a8b;
border: 2px solid #ef8a8b;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
#p01,#p02 {
padding-top: 60px;
margin-top:-60px;
}
.contents-top {
width: 100%;
padding: 0px 0px 0px 0px;
position: relative;
text-align: justify;
text-justify: inter-ideograph;
}
.contents-left {
width: 48%;
text-align: justify;
text-justify: inter-ideograph;
padding: 10px 0px 0px 0px;
margin: 0px 1% 0px 0px;
float:left;
}
.contents-right {
width: 48%;
text-align: justify;
text-justify: inter-ideograph;
padding: 10px 0px 0px 0px;
margin: 0px 0 0px 1%;
float:right;
}
.contents-left h3,.contents-right h3{
font-size: 150%; 
}
@media only screen and (max-width: 767px) {
.contents {
width: 100%;
margin: 150px auto 0px auto
}
.contents-left,.contents-right {
width: 100%;
margin: 0;
float:none;
}
}
.contents-bottom {
clear: both;
width: 100%;
padding: 10px 0px 0px 0px;
position: relative;
text-align:left;
}
.contents-top:before,.contents-bottom:before,.contents-top:after,.contents-bottom:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.contents-top img,.contents-left img,.contents-right img,.contents-bottom img{
max-width: 100%;
height:auto;
}
.contents-menu {
text-align: center;
padding: 0px 0px 10px 0px;
}
.contents-img {
width: 100%;
text-align: center;
padding-bottom: 20px;
}
.contents-img img{
max-width: 60%;
height:auto;
text-align: center;
margin: auto;
}
@media only screen and (max-width: 767px) {
.contents-img img{
max-width: 100%;
}
}
.contents-img-txt {
text-align: right;
font-size: 80%; 
line-height: 140%;
}
.links{
margin-top:-105px;
padding-top:105px;
}
#download .links{
margin-top:-125px;
padding-top:125px;
}
@media only screen and (max-width: 767px) {
.links{
margin-top:-55px;
padding-top:55px;
}
#download .links{
margin-top:-75px;
padding-top:75px;
}
}
.menu-box {
position: relative;
margin: 0 0 0 0;
text-align: left;
color: #231815;
}
.menu-txt {
width: 40%;
position: absolute;
top: 350px;
right: 0px;
text-align: left;
}
.menu-img {
width: 40%;
text-align: left;
}
.menu-img img{
width: 100%;
height:auto;
padding: 0 0 10px 0;
}
#gallery-1 {
margin: auto;
border: 0px !important;
}
#gallery-1 .gallery-item {
float: left;
padding-top: 4%;
text-align: center !important;
width: 25% !important;
border: 0px !important;
}
#gallery-1 img {
width: 98% !important;
height:auto !important;
border: 0px !important;
}
#gallery-1 .gallery-caption {
margin-left: 0 !important;
}
#gallery-1 dt {
font-weight: bold;
white-space: nowrap;
padding-bottom: 0px;
border-bottom:0px;
}
.wp-caption-text {
font-size: 80%;
line-height: 130%; 
padding-bottom: 0;
margin-bottom: 0;
}
.clear {
clear: both;
font: 0pt/0pt sans-serif;
}
.line {
width: 100%;
margin: 5px 0px 5px 0px;
padding: 5px 0px 5px 0px;
border-bottom: 1px solid #595757;
clear: both;
}
.triangle {
padding: 0 0 0 0;
width: 0;
height: 0;
border-style: solid;
border-width: 6.0px 0 6.0px 10.0px;
border-color: transparent transparent transparent #924898;
display: inline-block;
}
.indent{
margin-left: 0.8rem; 
}
.space{
clear: both;
height: 1rem; 
}
#caption{
position: relative;
}
#caption:after{
content:attr(title);
display:block;
text-align:center;
position: absolute;
bottom:-20px;
}
.img-left{
float:left;
margin-right: 15px;
}
.img-right{
float:right;
margin-left: 15px;
}
.btn-left{
float:left;
margin: 15px 15px 0 0;
}
.btn-right{
float:right;
margin: 15px 0 15px 0;
}
@media only screen and (max-width: 767px) {
.img-left{
float: none;
margin: 10px 0px 10px 0px;
}
.img-right{
float: none;
margin: 10px 0px 10px 0px;
}
.btn-left{
float: none;
margin: 10px 0px 10px 0px;
}
.btn-right{
float: none;
margin: 10px 0px 10px 0px;
}
}
.time {
color: #666;
font-size: 90%;
}
@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
button.c-btn{
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
color: #1d7faa;
}
.c-btn:hover,
.c-btn.is-active {
color: #31b6a3;
}
img.mail{
zoom: 0.5;
padding: 12px 0 0 0;
}
img.pmail{
zoom: 0.4;
padding: 0 0 14px 0;
}
@media only screen and (max-width: 767px) {
img.mail{
zoom: 0.5;
padding: 0 0 10px 0;
}
}
.navigation {
margin-top: 15px;
margin-bottom: 15px;
}
.navigation a{
text-decoration: none;
margin: 0px;
padding: 0px;
border-bottom-width: 0px
}
.navigation:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.alignright {
width:49%;
float: right;
padding: 0px 0px 15px 0;
text-align: right;
}
.alignleft {
width:49%;
float: left;
padding: 0px 0 15px 0px;
text-align: left;
}
.alignright a,.alignleft a,.topics-left .alignright a,.topics-left .alignleft a{
text-decoration: none;
}
img.alignright { display: block; margin: 0 0 0 auto; }
img.alignleft { display: block; margin: 0 auto 0 0; }
img.aligncenter { display: block; margin: 0 auto; }
@media only screen and (max-width: 767px) {
.alignright img,.alignleft img{
width: 100%;
height: auto;
}
}
dl.flow{
width:50%;
margin:auto;
text-align:center;
}
.flow dt{
color:#fff;
background: #595757;
padding:5px;
text-align:center;
display:block;
font-weight: normal;
}
.flow dd{
border: 2px solid #595757;
margin-bottom:30px;
padding:10px 10px 10px 10px;
text-align:center;
position: relative;
display:block;
}
.flow dd:after{
content:"";
display: block;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-top: 15px solid #595757;
position: absolute;
bottom: -15px;
left: 0;
right: 0;
margin:auto;
}
.flow dd:last-of-type:after{
content:"";
display: none;
}
.flow dd ul{
text-align:left;
}
@media only screen and (max-width: 480px) {
dl.flow{
width:100%;
margin:auto;
text-align:center;
}
}
.border-box {
border: 1px solid #005ead;
padding:10px;
margin: 10px auto 10px auto
}
.border-box-b{
border: solid 1px #333;
padding:10px;
margin: 10px auto 10px auto
}
.color-box {
color:#fff;
background: #005ead;
padding:10px;
margin: 10px auto 10px auto
}
a.btn{
display:inline-block;
padding: 9px 12px 9px 12px;
margin:0px 9px 0px 9px;
background-color: #fff;
color: #231815;
border-radius: 4px;
-moz-border-image: border-radius: 4px;
-webkit-border-image: border-radius: 4px;
border: 1px solid #595757;
text-align:center;
text-decoration: none;
}
a.btn:hover{
display:inline-block;
padding: 9px 12px 9px 12px;
margin:0px 9px 0px 9px;
background-color: #595757;
color:#fff;
border-radius: 4px;
-moz-border-image: border-radius: 4px;
-webkit-border-image: border-radius: 4px;
border: 1px solid #595757;
text-align:center;
text-decoration: none;
}
ul.disc {
list-style: none;
padding: 0;
margin:0;
}
ul.disc li {
position: relative;
padding: 0 0 0 10px;
}
ul.disc li:before {
content: '';
position: absolute;
top: 10px;
left: 0;
transform: translateY(-50%);
width: 0.5em;
height: 0.5em;
background: #333;
border-radius: 50%;
}
ul.point{
list-style: none;
padding: 0;
margin:0;
}
ul.point li {
position: relative;
padding: 0 0 0 10px;
}
ul.point li:before {
content: '・';
position: absolute;
top: 0;
left: 0;
width: 0.5em;
height: 0.5em;
background: none;
}
ul.kome{
list-style: none;
padding: 0;
margin:0;
}
ul.kome li {
position: relative;
padding: 0 0 0 10px;
}
ul.kome li:before {
content: '※';
position: absolute;
top: 0;
left: 0;
width: 0.5em;
height: 0.5em;
background: none;
}
ul.circle {
list-style: none;
padding: 0;
margin:0;
}
ul.circle li {
position: relative;
padding: 0 0 0 10px;
}
ul.circle li:before {
content: '';
position: absolute;
top: 10px;
left: 0;
transform: translateY(-50%);
width: 0.5em;
height: 0.5em;
border: 1px solid #333;
border-radius: 50%;
}
ul.number {
list-style-type: decimal;
padding: 0;
margin:0;
}
ul.number li {
margin-left: 19px;
}
ul.number-b {
counter-reset: my-counter;
list-style: none;
padding: 0;
margin:0;
}
ul.number-b li {
position: relative;
padding-left: 17px;
}
ul.number-b li:before {
content: '';
position: absolute;
display: block;
top: 2px;
left: 0;
width: 1em;
height: 1em;
border: 1px solid #333;
border-radius: 50%;
text-align: center;
background:#333;
}
ul.number-b li:after{
position: absolute;
top: 0px;
left: 4px;
content: counter(my-counter);
counter-increment: my-counter;
color:#fff;
}
ul.number-w {
counter-reset: my-counter;
list-style: none;
padding: 0;
margin:0;
}
ul.number-w li {
position: relative;
padding-left: 17px;
}
ul.number-w li:before {
content: '';
position: absolute;
display: block;
top: 2px;
left: 0;
width: 1em;
height: 1em;
border: 1px solid #333;
border-radius: 50%;
text-align: center;
}
ul.number-w li:after{
position: absolute;
top: 0px;
left: 4px;
content: counter(my-counter);
counter-increment: my-counter;
color:#333;
}
ul.number-r {
list-style-type: upper-roman;
padding: 0;
margin:0;
}
ul.number-r li {
margin-left: 21px;
}
ul.number-r-s {
list-style-type: lower-roman;
padding: 0;
margin:0;
}
ul.number-r-s li {
margin-left: 21px;
}
ul.alpha {
counter-reset: my-counter;
list-style: none;
padding: 0;
margin:0;
}
ul.alpha li {
position: relative;
padding-left: 17px;
}
ul.alpha li:before {
content: '';
position: absolute;
display: block;
top: 0.8em;
left: 0;
transform: translateY(-50%);
width: 1em;
height: 1em;
border-radius: 50%;
text-align: center;
}
ul.alpha li:after{
position: absolute;
top: 0;
left: 0;
content:counter(my-counter, upper-alpha) ".";
counter-increment: my-counter;
color:#333;
}
ul.alpha-s {
counter-reset: my-counter;
list-style: none;
padding: 0;
margin:0;
}
ul.alpha-s li {
position: relative;
padding-left: 17px;
}
ul.alpha-s li:before {
content: '';
position: absolute;
display: block;
top: 0.8em;
left: 0;
transform: translateY(-50%);
width: 1em;
height: 1em;
border-radius: 50%;
text-align: center;
}
ul.alpha-s li:after{
position: absolute;
top: 0;
left: 0;
content:counter(my-counter, lower-alpha) ".";
counter-increment: my-counter;
color:#333;
}
ul.number li ul,ul.number-w li ul,ul.number-b li ul,ul.number-r li ul,ul.number-r-s li ul{
margin-left:-18px!important;
}
ul.alpha li ul,ul.alpha-s li ul{
margin-left:-18px!important;
}
.explain dt{
display:block;
float:left;
font-weight: bold;
white-space: nowrap;
width:40px;
vertical-align:top;
}
.explain dd {
display:block;
float:left;
padding: 0 0 0 10px;
width: calc(100% - 55px);
width:-webkit-calc(100% - 55px);
vertical-align:top;
}
.explain:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.icon dt{
display:block;
float:left;
font-weight: bold;
white-space: nowrap;
width:10px;
vertical-align:top;
}
.icon dd {
display:block;
float:left;
padding: 0 0 0 5px;
width: calc(100% - 20px);
width:-webkit-calc(100% - 20px);
vertical-align:top;
}
.icon:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
@keyframes fadein{
from{
opacity: 0;
}
to{
opacity: 1;
}
} header ul, header li {
padding:0;
margin:0;
list-style: none;
}
#header {
margin:auto;
padding: 30px 0px 20px 0px;
z-index: 9999; 
font-weight: bold;
}
header {
padding:0px 0px 0px 0px;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic, futura, myriad pro, arial, movement, sans-serif;
}
#sp-header {
display: none;
}
#sp-menu{
display: none;
}
.sticky {
position: -webkit-sticky; 
position: sticky;
top: 0px;　
transform: translate3d(0px,0px,0px)!important;
-webkit-transform: translate3d(0px, 0px, 0px)!important;
padding: 0 8% 0 8%;
margin:auto;
z-index: 9999; 
font-weight: bold;
}
.sticky.isSmall {
background: url(//nanohana-en.com/images/back.jpg) no-repeat left 0 top -50px;
background-size: 100% auto;
}
#header img{
height: 53px;
}
#header .sns-img img{
padding-top: 10px;
height: 30px;
}
header h1{
width: 200px;
height:78px;
background: url(//nanohana-en.com/images/logo.png) no-repeat;
background-size: 200px 78px;
display:block;
text-indent:-9999em;
text-decoration:none;
overflow:hidden;
z-index: 10;
padding:0;
margin:7px 20px 0 20px;
transition: all 0.4s ease;
}
.isSmall header h1{
width: 160px;
height:62px;
background: url(//nanohana-en.com/images/logo.png) no-repeat;
background-size: 160px 62px;
display:block;
text-indent:-9999em;
text-decoration:none;
overflow:hidden;
z-index: 10;
padding:0;
margin:7px 20px 0 20px;
transition: all 0.4s ease;
}
#sns-menu{
position: absolute;
top: 30px;
right: 0;
padding:0;
margin:auto;
}
#sns-menu img{
width:auto;
height: 30px;
padding:0 10px 0 10px;
}
.luxbar-default {
width: 100%;
position: relative; }
.luxbar-static {
width: 100%;
position: absolute;
top: 0;
left: 0; }
.luxbar-static .luxbar-checkbox:checked ~ .luxbar-menu {
position: absolute; }
.luxbar-hamburger span, .luxbar-hamburger span::before, .luxbar-hamburger span::after {
display: block;
height: 2px;
width: 26px;
transition: 0.6s ease; }
.luxbar-checkbox:checked ~ .luxbar-menu li .luxbar-hamburger span {
background-color: transparent; }
.luxbar-checkbox:checked ~ .luxbar-menu li .luxbar-hamburger span::before, .luxbar-checkbox:checked ~ .luxbar-menu li .luxbar-hamburger span::after {
margin-top: 0; }
.luxbar-header {
max-width: 1000px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;}
.luxbar-brand {
padding: 0px 24px 0px 24px; }
.luxbar-menu {
min-height: 100px;
transition: 0.6s ease;
width: 100%;
}
.luxbar-navigation {
display: flex;
flex-direction: column;
list-style: none;
margin: 0 0 0 0; }
.luxbar-item {
flex-basis: 100%;
}
.cat-title{
white-space: nowrap;
}
.luxbar-menu a,
.luxbar-item a {
cursor: pointer;
letter-spacing: 2px;}
@media screen and (min-width:768px) and ( max-width:1024px) {
.luxbar-menu a,
.luxbar-item a {
cursor: pointer;
letter-spacing: 0px;
}
}
#luxbar #luxbar-footer{
max-width: 400px;
}
#luxbar-footer{	
display: block;
padding:7px 5% 5% 5%;
font-weight: normal;
font-size: 80%;
width: 90%;
margin: 0px auto 0 auto;
background:#e6e6e6;
}
#luxbar-footer h3{
letter-spacing: 5px;
text-align: left;
}
#luxbar-footer div{
text-align: left;
}
#luxbar-footer img{
width:auto !important;
height: 30px !important;
padding:0 15px 15px 15px !important;
}
#luxbar-footer img.footer-mail{
width:auto !important;
height: 13px !important;
padding:2px 0 2px 0!important;
}
#luxbar-hamburger{
color: #000;
padding: 0px 0px 0px 0px;
position: fixed;
right: 0px;
top: 0px; 
cursor: pointer; 
width:80px !important;
height: 80px !important;
}
.luxbar-checkbox:not(:checked)  ~ .luxbar-menu .luxbar-hamburger{
background: url(//nanohana-en.com/images/hamburger01.png) no-repeat center;
background-size: 50px auto;
}
.luxbar-checkbox:checked ~ .luxbar-menu .luxbar-hamburger{
background: url(//nanohana-en.com/images/hamburger02.png) no-repeat center;
background-size: 50px auto;
}
.luxbar-checkbox {
display: none; }
.dropdown {
position: relative;
height: auto;
cursor: pointer;
}
.dropdown:hover > ul {
position: relative;
display: block;
min-width: 100%;
}
.dropdown > a::after {
position: absolute;
content: '';
right: 10px;
top: 25px; }
.dropdown > ul {
font-weight: normal;
display: block;
list-style: none;
padding: 0; 
font-size: 90%;}
.dropdown > ul .luxbar-item {
min-width: 100%;
height: 19px;
padding: 5px 10px 5px 40px; }
.dropdown > ul .luxbar-item a {
min-height: 29px;
line-height: 29px;
padding: 0; }
.bd {
display: none; }
img#m_m1,img#m_m2,img#m_m3{
width: 100%;
height: auto;
}
.luxbar-menu-light,
.luxbar-menu-light .dropdown ul {}
.luxbar-menu-light .active,
.luxbar-menu-light .luxbar-item:hover {}
.sub-menu{
display:none;
text-align: left;
margin:0px;
padding: 0px;
}
@media print, screen and (min-width: 768px) {
.luxbar-item {
color: #000;
line-height: 160%; 
padding:  0;
-webkit-flex-grow: 1;
flex-grow: 1;
}
#luxbar-footer{
display: none;
}
#menu01 a,#menu02 a,#menu03 a,#menu04 a,#menu05 a,#menu06 a,#menu07 a,#menu08 a{
display:block;
text-decoration:none;
padding:5px 0 5px 0;
}
#menu01.dropdown:hover > ul:before,#menu02.dropdown:hover > ul:before,#menu03.dropdown:hover > ul:before,#menu04.dropdown:hover > ul:before,#menu05.dropdown:hover > ul:before,#menu06.dropdown:hover > ul:before,#menu07.dropdown:hover > ul:before,#menu08.dropdown:hover > ul:before {
content: "";
position: absolute;
top: -9px;
left: calc(50% - 5px);
left:-webkit-calc(50% - 5px);
border: 5px solid transparent;
border-top: 0px;
}
#menu01.dropdown:hover > ul,#menu02.dropdown:hover > ul,#menu03.dropdown:hover > ul,#menu04.dropdown:hover > ul,#menu05.dropdown:hover > ul,#menu06.dropdown:hover > ul,#menu07.dropdown:hover > ul,#menu08.dropdown:hover > ul {
border-radius: 6px;
-moz-border-image: border-radius: 6px;
-webkit-border-image: border-radius: 6px;
white-space: nowrap;
}
#menu01 a,#menu01 span{
color:#609dd5;
}	
#menu01.dropdown:hover > ul:before {
border-bottom: 9px solid #609dd5;
}
#menu01.dropdown:hover > ul {
background: rgba(224,234,246,0.9);
}
#menu02 a,#menu02 span{
color:#b3c83d;
}	
#menu02.dropdown:hover > ul:before {
border-bottom: 9px solid #b3c83d;
}
#menu02.dropdown:hover > ul {
background: rgba(238,243,216,0.9);
}
#menu03 a,#menu03 span{
color:#f39800;
}	
#menu03.dropdown:hover > ul:before {
border-bottom: 9px solid #f39800;
}
#menu03.dropdown:hover > ul {
background: rgba(253,233,206,0.9);
}
#menu04 a,#menu04 span{
color:#4ab9a1;
}	
#menu04.dropdown:hover > ul:before {
border-bottom: 9px solid #4ab9a1;
}
#menu04.dropdown:hover > ul {
background: rgba(220,237,229,0.9);
}
#menu05 a,#menu05{
color:#ef8a8b;
}	
#menu05.dropdown:hover > ul:before {
border-bottom: 9px solid #ef8a8b;
}
#menu05.dropdown:hover > ul {
background: rgba(251,225,223,0.9);
}
#menu06 a,#menu06{
color:#915da3;
}	
#menu06.dropdown:hover > ul:before {
border-bottom: 9px solid #915da3;
}
#menu06.dropdown:hover > ul {
background: rgba(231,216,227,0.9);
}
#menu07 a,#menu07{
color:#ef825a;
}	
#menu07.dropdown:hover > ul:before {
border-bottom: 9px solid #ef825a;
}
#menu07.dropdown:hover > ul {
background: rgba(250,223,217,0.9);
}
#menu08 a,#menu08{
color:#e9b800;
}	
#menu08.dropdown:hover > ul:before {
border-bottom: 9px solid #e9b800;
}
#menu08.dropdown:hover > ul {
background: rgba(251,245,231,0.9);
}
#menu01 li a,#menu02 li a,#menu03 li a,#menu04 li a,#menu05 li a,#menu06 li a,#menu07 li a,#menu08 li a{
border:0px;
padding: 5px;
margin:0px;
color:#6a3906;
letter-spacing: 0px;
}	
#menu01 li a:hover,#menu02 li a:hover,#menu03 li a:hover,#menu04 li a:hover,#menu05 li a:hover,#menu06 li a:hover,#menu07 li a:hover,#menu08 li a:hover{
border:0px;
padding: 5px;
margin:0px;
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
-moz-transition:0.15s ease-in-out;
-webkit-transition:0.15s ease-in-out;
-o-transition:0.15s ease-in-out;
-ms-transition:0.15s ease-in-out;
letter-spacing: 0px;
}
.bd {
display: inline; }
.luxbar-navigation {
flex-flow: row;
-webkit-justify-content: space-around;
justify-content: space-around;
margin:0px;
padding: 0px;
}
.luxbar-hamburger {
display: none; }
.luxbar-checkbox:not(:checked) ~ .luxbar-menu {
overflow: visible; }
.luxbar-checkbox:checked ~ .luxbar-menu {
height: 58px; }
.luxbar-menu .luxbar-item {
border-top: 0; }
.dropdown {
height: 1px; }
.dropdown:hover > ul {
position: absolute;
left: 0;
top: 35px;
padding: 0 0 0 0;
opacity:1;
filter: alpha(opacity=100);
-ms-filter: "alpha( opacity=100 )";
visibility: visible;
}
.dropdown > ul {
-webkit-transition: all 0.15s;
transition: all 0.15s;
opacity:0;
filter: alpha(opacity=0);
-ms-filter: "alpha( opacity=0 )";
visibility: hidden;
}
.dropdown > ul .luxbar-item {
padding: 5px 10px; }
.dropdown > ul .luxbar-item a {
white-space: nowrap; }
}
.dropdown > ul li {
border-bottom:#fff dotted 1px; }
.dropdown > ul li:last-child {
border-bottom:0px;
}
#sp-menu-footer{
display:none;
}
@media only screen and (max-width: 767px) {
.bottom01,.bottom02{
display:none;
}
.luxbar-checkbox:not(:checked) ~ .luxbar-menu {
overflow: hidden}
.luxbar-checkbox:not(:checked) ~ .luxbar-menu .luxbar-item,.luxbar-checkbox:not(:checked) ~ .luxbar-menu #sp-menu {
display: none; }
.luxbar-menu .luxbar-item {
display: none; }
.luxbar-header {
display: block;
width:100%;
position: fixed;
top: 0;
left: 0;
z-index: 1;
}
.luxbar-checkbox:checked ~ .luxbar-menu {
background: url(//nanohana-en.com/images/sp-back.jpg) no-repeat;
background-size: cover;
animation-name: fadein;
animation-duration: 1s;
width:100%;
height: 100vh;
overflow: scroll; 
position: fixed;
top: 0px;
left: 0;
}
.dropdown ul, .dropdown:hover > ul{
display: none;
}
#header {
display: none;
}
.luxbar-checkbox:checked ~ .luxbar-menu {
overflow: scroll; }
.sticky,#home .sticky,#mailnews .sticky,#normal .sticky,#topics .sticky,#fellows .sticky,.header {
position: fixed;
top: 0px;
left: 0;
width: 100%;
margin: 0px;
padding: 0px;
height: 55px;
overflow: visible; 
}
#sp-header {
width: 250px;
height: 87px;
display: block;
z-index: 1000;
position:absolute;
top:0px;
left:0;
right:0;
margin:auto;
}
#sp-header h1{
width: 160px;
height:62px;
background: url(//nanohana-en.com/images/logo.png) no-repeat;
background-size: 160px 62px;
display:block;
text-indent:-9999em;
text-decoration:none;
overflow:hidden;
padding:0;
margin:auto;
}
#sp-header a h2{
font-size: 1.0rem;
color:#6a3906;
}
#menu01 a{
color:  #fff;
display:block;
background: #005ead;
padding:5px;
border-bottom: 1px solid #fff;
}	
#menu02 a{
color:  #fff;
display:block;
background: #0098CB;
padding:5px;
border-bottom: 1px solid #fff;
}	
#menu03 a{
color:  #fff;
display:block;
background: #13ae67;
padding:5px;
border-bottom: 1px solid #fff;
}	
#menu04 a{
color:  #fff;
display:block;
background: #f5a200;
padding:5px;
border-bottom: 1px solid #fff;
}	
#menu01 a:hover, #menu02 a:hover, #menu03 a:hover, #menu04 a:hover{
color:  #000;
}
#menu01, #menu02, #menu03, #menu04{
display:none;
}
#sp-menu{
display:block;
position: absolute;
top: 0px;
left: 0px;
display:block;
width: 100%;
height: 100%;
}
#sp-menu-header{
width: 240px;
height:auto;
margin:auto;
clear: both;
}
#sp-menu-header h1{
width: 160px;
height:62px;
background: url(//nanohana-en.com/images/logo.png) no-repeat;
background-size: 160px 62px;
text-indent:-9999em;
text-decoration:none;
overflow:hidden;
padding:0;
margin:0 auto 15px auto;
}
#sp-menu-header a h2{
color:#6a3906;
font-size: 1.0rem;
}
#sp-menu-header h2{
font-family:   'fot-tsukubrdgothic-std'; 
letter-spacing: 0px;
}
#sp-menu-left{
width:48%;
float: left;
}
#sp-menu-right{
width:48%;
float: right;
}
#sp-menu a{
color:#6a3906;
}
#sp-menu dl{
padding: 10px 0;
}
#sp-menu dt{
font-size: 110%;
line-height: 180%; 
}
#sp-menu dd{
font-size: 100%;
line-height: 140%; 
font-weight: normal;
}
#sp-menu-footer{
display:block;
clear: both;
}
#sp-menu-footer div{
font-size: 100%;
padding: 10px 0 10px 0;
}
#sp-menu-footer small{
font-size:80%;
}
#sp-menu-footer img{
width: 35px;
height: auto;
padding:0 15px;
}
#header .sns-img img{
padding: 5px 0px 5px 0px;
height: 30px;
}
}
.menu-line {
display: flex;
align-items: center;
}
.menu-line:before,
.menu-line:after {
content: "";
flex-grow: 1;
height: 1px; 
background: #fff; 
margin:0 0.5em; 
} #top-hero {
width: 80%;
margin:30px 10% 30px 10%;
position: relative;
}
#top-hero img, #top-hero img.attachment-large, #top-hero img.size-large{
height: auto;
width: 100%;
}
.top-txt01 {
position: absolute;
top: 12%;
left: 0;
right: 0;
z-index: 2;
font-size: 200%;
color:#6a3906;
line-height: 180%;
}
.top-txt02 {
font-size: 120%;
font-weight: bold;
line-height: 180%;
padding: 10px 0 30px 0; 
}
.top-news {
width: 50%;
text-align: left;
margin:auto;
font-size: 120%;
padding: 0 0 30px 0; 
}
.top-news div{
padding: 5px 0 5px 0; 
}
.top-button01 {
display: block;
width: 100px;
margin:auto auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #ef8a8b;
color: #ef8a8b;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
.top-button01:hover {
display: block;
width: 100px;
margin:auto auto 30px auto;
background-color: #ef8a8b;
border: 2px solid #ef8a8b;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
.top-button02 {
display: block;
width: 130px;
margin:auto auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #f8b62d;
color: #f8b62d;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
font-family:   'fot-tsukubrdgothic-std'; 
}
.top-button02:hover {
display: block;
width: 130px;
margin:auto auto 30px auto;
background-color: #f8b62d;
border: 2px solid #f8b62d;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
.button01 {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #609dd5;
color: #609dd5;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
.button01{
white-space: normal;
}
}
.contents a.button01{
text-decoration: none;
}
.button01:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #609dd5;
border: 2px solid #609dd5;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
@media screen and (max-width: 767px) {
.button01:hover {
white-space: normal;
}
}
.contents a.button01:hover{
color: #fff;
}
.button02 {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #F39800;
color: #F39800;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
.button02{
white-space: normal;
}
}
.contents a.button02{
text-decoration: none;
color: #F39800;
}
.button02:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #F39800;
border: 2px solid #F39800;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
@media screen and (max-width: 767px) {
.button02:hover {
white-space: normal;
}
}
.contents a.button02:hover{
color: #fff;
}
.button03 {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #B2C83E;
color: #B2C83E;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
.button03{
white-space: normal;
}
}
.contents a.button03{
text-decoration: none;
color: #B2C83E;
}
.button03:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #B2C83E;
border: 2px solid #B2C83E;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
@media screen and (max-width: 767px) {
.button03:hover {
white-space: normal;
}
}
.contents a.button03:hover{
color: #fff;
}
.button04 {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #F39800;
color: #F39800;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
.button04{
white-space: normal;
}
}
#prekindergarten01 .contents a.button04{
text-decoration: none;
}
.button04:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #F39800;
border: 2px solid #F39800;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
@media screen and (max-width: 767px) {
.button04:hover{
white-space: normal;
}
}
#prekindergarten01 .contents a.button04:hover{
color: #fff;
}
.button05 {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #4ab9a1;
color: #4ab9a1;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
.button05{
white-space: normal;
}
}
#junior01 .contents a.button05{
color: #4ab9a1;
text-decoration: none;
}
.button05:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #4ab9a1;
border: 2px solid #4ab9a1;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
@media screen and (max-width: 767px) {
.button05:hover {
white-space: normal;
}
}
#junior01 .contents a.button05:hover{
color: #fff;
}
.button06 {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #915da3;
color: #915da3;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
.button06{
white-space: normal;
}
}
#contact01 .contents a.button06{
color: #915da3;
text-decoration: none;
}
.button06:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #915da3;
border: 2px solid #915da3;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
@media screen and (max-width: 767px) {
.button06:hover {
white-space: normal;
}
}
#contact01 .contents a.button06:hover{
color: #fff;
}
.top-news-title {
text-align: center;
color:#727171;
position: absolute;
top: 0;
left: 0;
right: 0;
font-size: 0.8rem;
letter-spacing: 1px;
display: block;
}
.top-news-title a {
display: block;
text-align: center;
color:#fff;
position:absolute;
top: 0;
right: 0;
background:#727171;
padding: 0px 5px 0px 5px;
font-size: 0.7rem;
}
.top-news .top-news-list {
padding: 10px 0px 10px 0px;
margin:0 20px 0 20px;
border-bottom:1px solid #727171;
font-size: 0.7rem;
text-align: left;
}
.top-news .top-news-list:last-child {
border-bottom:0px;
}
.top-news-list h3 {
padding:  1px 0px 1px 0px;
margin:  0px;
font-size: 0.8rem;
text-align: left;
}
.top-news-list a{
color:#3e3a39;
text-decoration: underline;
}
.top-news-list a:hover{
color: #ccc;
text-decoration: underline;
}
.top-news-time {
display: inline-block;
margin:  0px 10px 0px 0px;
font-size: 0.8rem;
color: #343434;
}
.top-news-cat {
display: inline-block;
padding:  0 20px 0 20px;
margin:  0 10px 0 0px;
background-size: 100% auto;
background-repeat: no-repeat ;
line-height: 230%; 
font-size: 90%;
white-space: nowrap;
}
.top-news-list .top-news-cat {
margin: 2px;
}
.top-news-list p {
margin: 2px 0 2px 0;
}
.top-box {
width: 80%;
margin:30px 10% 30px 10%;
text-align: center;
}
.top-box:after {
content: "";
clear: both;
display: block;
}
.top-box img{
width: 100%;
height: auto;
}
.top-left {
width: 45%;
float:left;
margin: 0;
padding: 0;
}
.top-right {
width: 45%;
float:right;
margin: 0;
padding: 0;
}
.top-left img,.top-right img{
width: 100%;
height: auto;
}
.top-footer {
width: 80%;
margin:30px auto;
text-align: center;
}
.top-footer:after {
content: "";
clear: both;
display: block;
}
.top-footer img{
width: 100%;
height: auto;
}
.top-footer01,.top-footer02, .top-footer03 {
width: 100%;
margin:30px 0 30px 0;
text-align: center;
display: flex;
color:#3e3a39;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
}
.top-footer01:after,.top-footer02:after, .top-footer03:after {
content: "";
clear: both;
display: block;
}
.top-footer01 {
justify-content: space-between;
}
.top-footer01 div {
width: 32%;
text-align:left;
}
.top-footer01 div:first-child{
padding-right: 2%;
}
.top-footer01 div:last-child{
padding-left: 2%;
}
.movie{
position: relative;
padding-bottom: 56.25%; 
height: 0;
overflow: hidden;
}
.movie iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.top-footer02 {
justify-content: center;
}
.top-footer02 div {
width: 40%;
text-align:center;
padding-right: 5%;
padding-left: 5%;
}
.top-footer02 div img{
width: 200px;
height:auto;
}
.top-footer03 {
justify-content: space-between;
}
.top-footer03 div {
width: 48%;
text-align:left;
}
.top-footer03 div:first-child{
padding-right: 2%;
}
.top-footer03 div:nth-child(2){
padding-left: 2%;
}
.top-footer03 h3{
font-size: 150%; 
line-height: 150%;
color:#f8b62d;
text-align: left;
}
@media screen and ( max-width: 767px) {
#top-hero {
width: 90%;
margin:170px auto 30px auto;
display: block;
}
.top-txt01 {
font-size: 130%;
}
.top-txt02 {
width: 90%;
margin:auto;
font-size: 110%;
line-height: 180%;
padding: 10px 0 30px 0; 
}
.top-news {
width: 90%;
margin:auto;	
display: block;
vertical-align:top;
}
.top-left {
width: 100%;
float:none;
margin: 0 0 30px 0;
padding: 0;
}
.top-right {
width: 100%;
float:none;
margin: 30px 0 0 0;
padding: 0;
}
.top-footer {
width: 90%;
}
.top-footer01,.top-footer02, .top-footer03 {
display: block;
}
.top-footer01 div {
width: 90%;
margin:0 auto 15px auto;
text-align:left;
}
.top-footer01 div:first-child{
width: 80%;
padding:0;
}
.top-footer01 div:last-child{
width: 90%;
padding:0;
}
.top-footer01 div img{
width: 100%;
height:auto;
}
.top-footer02 div {
width: 80%;
margin:0 auto 15px auto;
padding:0;
}
.top-footer02 div img{
width: 100%;
height:auto;
}
.top-footer03 div {
width: 90%;
margin:0 auto 15px auto;
text-align:left;
}
.top-footer03 div:first-child{
padding:0;
}
.top-footer03 div:nth-child(2){
padding:0;
}
.top-footer03 h3{
font-size: 120%; 
line-height: 150%;
text-align: center;
}
.top-button01 {
font-size: 100%;
}
.top-button02 {
font-size: 100%;
}
} #topics .contents h3{
margin: 10px auto 10px auto;
padding: 3px;
font-size: 120%; 
line-height: 140%;
text-align:left;
font-weight: normal;
color: #3E3D3D;
}
#topics .border-box {
border: 1px solid #005ead;
padding:10px;
margin: 10px auto 10px auto
}
#topics .color-box {
color:#fff;
background: #005ead;
padding:10px;
margin: 10px auto 10px auto
}
.topics-left {
width: 74%;
text-align: justify;
text-justify: inter-ideograph;
padding: 0px 0px 0px 0px;
margin: 0px 0 0px 0px;
float:left;
}
.topics-left .top-news-cat {
margin:  15px 10px 0 -5px;
}
.topics-left a{
color:#3e3a39;
text-decoration: underline;
}
.topics-left a .top-news-cat{
color:#6a3906;
}
.topics-left a:hover{
color: #ccc;
text-decoration: underline;
}
.topics-left .sen {
width: 100%;
height:50px;
margin: 50px 0px 0px 0px;
background: url(//nanohana-en.com/images/line03.jpg) no-repeat left top;
background-size: 100% auto;
clear: both;
}
.topics-left .sen:last-of-type {
background: none;
}
.topics-left h2{
margin: 0px auto 0px auto;
padding: 3px;
background: #595757;
color: #fff;
font-size: 120%; 
line-height: 140%;
text-align:center;
font-weight: bold;
letter-spacing: 2px;
display:block;
}
.topics-right {
width: 23%;
text-align: justify;
text-justify: inter-ideograph;
padding: 0px 0px 0px 0px;
margin: 0px 0 0px 0;
float:right;
}
.topics-right a .top-news-cat{
color:#6a3906;
}
.topics-right h2{
margin: 0px auto 0px auto;
padding: 20px 10px 10px 10px;
font-size: 120%; 
line-height: 140%;
font-family: 'antrf', "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
text-align:left;
font-weight: normal;
letter-spacing: 2px;
display:block;
background: url(//nanohana-en.com/images/line04.jpg) no-repeat left top;
background-size: 100% auto;
}
.topics-right-list {
padding: 20px 0px 0px 0px;
}
.topics-right-list span{
margin: 2px;
}
.topics-right-list p{
margin: 0px 0px 0px 10px;
}
.topics-right-list a {
color:#3e3a39;
text-decoration: none;
padding:0;
margin:0;
}
.topics-right-list a .topics-cat{
color:#6a3906;
}
.topics-right-list a:hover {
color: #999;
text-decoration: none;
padding:0;
margin:0;
-moz-transition:0.15s ease-in-out;
-webkit-transition:0.15s ease-in-out;
-o-transition:0.15s ease-in-out;
-ms-transition:0.15s ease-in-out;
}
.topics-cat {
text-align: center;
color:#fff;
font-weight: bold;
padding: 5px 15px 5px 15px;
font-size: 0.8rem;
display:inline-block;
width: 150px;
}
a .topics-cat {
color:#6a3906;
}
.topics-time {
padding:  5px 5px 0px 5px;
letter-spacing: 1px;
font-size: 0.8rem;
float:right;
}
.topics-time:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.topics-right .topics-cat {
text-align: center;
color:#fff;
font-weight: bold;
padding: 3px 15px 3px 15px;
font-size: 0.8rem;
display:inline-block;
width: auto;
}
.topics-right .topics-cat a{
color:#fff;
}
.topics-right .topics-cat-list {
text-align: left;
margin-bottom: 30px;
}
.topics-right .topics-cat-list .topics-cat {
text-align: center;
color:#fff;
font-weight: bold;
padding: 3px 15px 3px 15px;
margin: 10px auto 0 0;
font-size: 0.8rem;
display:block;
width: 50%;
}
.topics-right .topics-time {
padding:  5px 0 0 0;
margin:0;
letter-spacing: 0px;
font-size: 0.8rem;
float:none;
}
.topics-archives {
padding:  10px 0 0 0;
letter-spacing: 0px;
list-style-type:none;
}
.topics-archives li{
padding:  0 0 0 10px;
}
.topics-archives li a{
color:#3e3a39;
}
.topics-archives li a:hover{
color: #ccc;
}
@media only screen and (max-width: 767px) {
.topics-left {
width: 100%;
text-align: justify;
text-justify: inter-ideograph;
padding: 0px 0px 0px 0px;
margin: 0px 0 30px 0px;
float:none;
}
.topics-right {
width: 100%;
text-align: justify;
text-justify: inter-ideograph;
padding: 0px 0px 0px 0px;
margin: 0px 0 0px 0;
float:none;
}
.topics-right .topics-cat-list .topics-cat {
padding: 3px 5% 3px 5%;
display:block;
width: 90%;
}
} .footer {
width:100%;
list-style:none;
z-index: 1000;
margin: 30px 0 0 0;
background: url(//nanohana-en.com/images/bottom.jpg) no-repeat;
background-size: cover;
font-size: 80%;
font-family:  "A1ゴシック M","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","Hiragino Kaku Gothic ProN", MS Gothic; 
position: relative;
z-index:0;
}
#about01 .footer {
background: url(//nanohana-en.com/images/bottom-a.jpg) no-repeat #FFFCE1;
margin:  0;
}
.footer .footer-button01,.footer .footer-button02{
font-family:   'fot-tsukubrdgothic-std'; 
}
.footer a{
color:#6a3906;
}
.footer-box{
width:90%;
padding: 50px 0 0px 0;
margin: auto;
text-align: center;
}
.footer01{
width:21%;
margin: auto;
text-align: center;
vertical-align:top; 
float: left;
padding:15px 4% 0 0;
white-space: nowrap;
}
.footer01 img{
width:100%;
height: auto;
margin:10px 0;
}
.footer01 h2{
font-size: 120%;   
margin: 0;
padding:0;
text-align: center;
font-family:   'fot-tsukubrdgothic-std'; 
}
.footer02{
width:75%;
margin: auto;
text-align: center;
display: table;
border-collapse: separate; 
border-spacing: 10px 5px; 
float: right;
line-height: 160%; 
}
.footer02 dl {
display: table-cell;
vertical-align:top;   
}
.footer02 dt{
font-size: 110%;   
font-weight: bold;
white-space: nowrap;
padding-top: 15px;
}
.footer02 dd{
padding: 2px 0;
}
.footer-button01 {
display: block;
width: 100px;
margin:auto auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #6a3906;
color: #6a3906;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
.footer-button01:hover {
display: block;
width: 100px;
margin:auto auto 30px auto;
background-color: #6a3906;
border: 2px solid #6a3906;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
.footer-button02 {
display: block;
width: 100px;
margin:auto auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: absolute;
right:-20px;
bottom:0px;
z-index: 2;
background-color: #fff;
border: 2px solid #ef8a8b;
color: #ef8a8b;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 120%;
font-weight: bold;
letter-spacing: 1px;
}
.footer-button02:hover {
display: block;
width: 100px;
margin:auto auto 30px auto;
background-color: #ef8a8b;
border: 2px solid #ef8a8b;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
.footer a.footer-button02{
color: #ef8a8b;
}
.footer a.footer-button02:hover{
color: #fff;
}
.copy {
position: absolute;
left:0;
right:0;
bottom:25px;
font-size: 80%;
}
.bottom01 {
width:120px;
position: fixed;
right:0px;
bottom:150px;
z-index: 99999;
text-align: center;
}
.bottom01 img{
width:45%;
height: auto;
padding:0 2%;
}
.bottom02 {
width:120px;
position: fixed;
right:0px;
bottom:90px;
z-index: 99999;
text-align: right;
}
.bottom02 img{
width:100%;
height: auto;
}
.sp-menu01{
color:#609dd5;
}	
.sp-menu02{
color:#b3c83d;
}	
.sp-menu03{
color:#f39800;
}	
.sp-menu04{
color:#4ab9a1;
}	
.sp-menu05{
color:#ef8a8b;
}	
.sp-menu06{
color:#915da3;
letter-spacing: -1px;
}	
.sp-menu07{
color:#ef825a;
}	
.sp-menu08{
color:#e9b800;
}	
.sp-menu09{
color:#6a3906;
}	
@media only screen and (max-width: 767px) {
.footer,.sponcer {
display: none;
}
}
.pcbr {
display: block;
}
.spbr {
display: none;
}
@media only screen and (max-width: 767px) {
.pcbr {
display: none;
}
.spbr {
display: block;
}
} @media only screen and (max-width: 767px) {
iframe {
max-width: 100%;
height: auto;
}
} @media only screen and (max-width: 767px) {
#fancybox-right span{left:auto;right:20px !important;}
.rtl #fancybox-right span{right:auto;left:20px !important;}
} .ss{
visibility: hidden;
}
.ss.slick-initialized{
visibility: visible;
} .moreButton{
text-align: center;
}
#more-button {
display: inline-block;
margin:30px auto 30px auto;
clear: both;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #ef8a8b;
color: #ef8a8b;
line-height:200%;
overflow: hidden;
border-radius: 30px;       
-webkit-border-radius: 30px;    
-moz-border-radius: 30px;   
padding:5px 20px 5px 20px;
white-space: nowrap;
font-size: 100%;
font-weight: bold;
letter-spacing: 1px;
}
#more-button:hover {
display: inline-block;
margin:30px auto 30px auto;
background-color: #ef8a8b;
border: 2px solid #ef8a8b;
color: #fff;
padding:5px 20px 5px 20px;
clear: both;
text-align: center;
white-space: nowrap;
}
.scroller-status {
display: none;
margin-top: 40px;
}
.infinite-scroll-request {
animation: scroll-request 1.1s infinite linear;
border: 2px solid #ef8a8b;
border-left: 2px solid #fff;
border-radius: 50%;
height: 30px;
margin: auto;
width: 30px;
}
@keyframes scroll-request {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.infinite-scroll-last,
.infinite-scroll-error {
color: #757575;
text-align: center;
}
.grecaptcha-badge { visibility: hidden; }