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


/*************block01*******************/
#block01{
margin: 10% auto ;
width: 100%;
}

#block01 img{
margin: 20px auto;
width: 50px;
}

#block01 h3{
margin: 0 auto;
font-size: 24px;
letter-spacing: 0.1em;
line-height: 2.0em;
}

#block01 p{
margin: 20px auto;;
font-size: 18px;
letter-spacing: 0.1em;
line-height: 1.5em;
}

#block01 .taiken-lesson{
margin: 100px auto;
width: 100%;
padding: 0 20%;
}


#block01 .taiken-lesson img{
width: 900px;
}


#block01 .waribiki{
margin: 6% auto;
padding: 0 20%;
position: relative;
}

#block01 .waribiki::before{
content: "";
width: 2px;
height: 170px;
position: absolute;
top: 0px ;
left: 26%;
background-color: #fd9827;
}

#block01 .waribiki::after{
content: "";
width: 2px;
height: 170px;
position: absolute;
top: 0px ;
right: 26%;
background-color: #fd9827;

}


#block01 .waribiki h4{
margin: 10px auto;
font-size:24px;
letter-spacing: 0.05em;
line-height: 1.0em;
color: #fd9827;
}
#block01 .waribiki span{
margin: 10px auto;
font-size:30px;
letter-spacing: 0.05em;
line-height: 1.5em;
color: #fd9827;
}

#block01 .waribiki .small{
margin: 10px auto;
font-size:24px;
}

/* ******************************************* */
@media screen and (max-width: 1700px) {
 /* ---------------------------------- */
#block01 .waribiki::before{
left: 20%;
}

#block01 .waribiki::after{
right: 20%;
}




}

/* ******************************************* */
@media screen and (max-width: 1400px) {
 /* ---------------------------------- */

#block01 img{
margin: 20px auto;
width: 40px;
}

#block01 h3{
margin: 0 auto;
font-size: 22px;
}

#block01 p{
margin: 20px auto;;
font-size: 17px;
}

#block01 .waribiki h4{
font-size:22px;
}
#block01 .waribiki span{
font-size:26px;
}

#block01 .waribiki .small{
font-size:17px;
}

}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

#block01 h3{
margin: 0 auto;
font-size: 20px;
}

#block01 p{
margin: 20px auto;;
font-size: 16px;
}

#block01 .waribiki::before{
height: 150px;
}

#block01 .waribiki::after{
height: 150px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */

#block01 h3{
margin: 0 auto;
font-size: 19px;
line-height:  1.5em;
}

#block01 p{
margin: 30px auto;;
font-size: 15px;
line-height: 1.5em;
}


#block01 .waribiki p{
margin: 10px auto;
font-size: 15px;
}


#block01 .taiken-lesson{
padding: 0 17%;
}

#block01 .waribiki::before{
height: 130px;
left: 17%;
}

#block01 .waribiki::after{
height: 130px;
right: 17%;
}

#block01 .waribiki{
padding: 0 17%;
}

#block01 .waribiki h4{
font-size:20px;
}
#block01 .waribiki span{
font-size:23px;
}

#block01 .waribiki .small{
font-size:15px;
}



 /* ---------------------------------- */
}


/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#block01{
margin: 15% auto;
}


#block01 img{
margin: 20px auto 10px;
width: 35px;
}
#block01 h3{
margin: 0 auto;
font-size: 17px;
}

#block01 p{
margin: 30px auto 20px;
font-size: 14px;
}
#block01 .waribiki p{
margin: 10px auto;
font-size: 14px;
}


#block01 .waribiki::before{
height: 130px;
left: 17%;
}

#block01 .waribiki::after{
height: 130px;
right: 17%;
}

#block01 .waribiki{
padding: 0 17%;
}

#block01 .waribiki h4{
font-size:18px;
}
#block01 .waribiki span{
font-size:21px;
}

#block01 .waribiki .small{
font-size:14px;
}

 
 /* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 648px) {
 /* ---------------------------------- */

#block01 .taiken-lesson{
margin: 70px auto;
padding: 0 10%;
}


#block01 .waribiki h4{
font-size:18px;
}
#block01 .waribiki span{
font-size:21px;
}

#block01 .waribiki .small{
font-size:14px;
}

#block01 .waribiki::before{
height: 130px;
left: 10%;
}

#block01 .waribiki::after{
height: 130px;
right: 10%;
}

#block01 .waribiki{
padding: 0 10%;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

 #block01 h3{
margin: 0 auto;
font-size: 15px;
}

#block01 p{
margin: 30px auto 20px;
font-size: 12px;
}
#block01 .taiken-lesson{
margin: 70px auto;
padding: 0 6%;
}

#block01 .waribiki h4{
font-size:16px;
}
#block01 .waribiki span{
font-size:18px;
}

#block01 .waribiki p{
margin: 10px auto;
font-size: 13px;
}

#block01 .waribiki .small{
font-size:13px;
}

#block01 .waribiki::before{
height: 150px;
left: 6%;
}

#block01 .waribiki::after{
height: 130px;
right: 6%;
}


 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */

 #block01 h3{
margin: 0 auto;
font-size: 14px;
}

#block01 .waribiki p{
margin: 10px auto;
font-size: 12px;
}

#block01 p{
margin: 30px auto 20px;
font-size: 12px;
letter-spacing: 0.05em;
}


 /* ---------------------------------- */
}


 /* ---------------------------------- */
 /* ----------------block02------------------ */
#block02{
margin: 10% auto;
}

#block02 div{
padding: 0 15% 0 15%;
width: 100%;
}

#block02 .pic01{
padding: 0 10% 0 15%;	
}

#block02 article{
margin: 1% auto;
border-top:#f4f4f4 solid 5px;
border-bottom:#f4f4f4 solid 5px;
}

#block02 article .course-setumei{
margin: 14% auto;
}

#block02 article #banner202501{
padding-top: 6vh;
margin-top: -6vh;
}

#block02 article .course-setumei:first-of-type{
margin: 7% auto;
}

#block02 article .course-setumei h4{
margin: 1% auto;
color: #fd9827;
font-size: 28px;
font-weight: 700;
letter-spacing: 0.05em;
}

#block02 article .course-setumei .h4-sub{
font-size: 22px;
font-weight:bold;
text-align: center;
}

#block02 article .course-setumei p{
margin: 0% auto;
font-size: 18px;
letter-spacing: 0.05em;
line-height: 2.5em;
text-align: center;
padding: 3% 7% 0;
}

#block02 article ul{
margin: 3% auto;
padding: 0 0%;
}

#block02 article ul li{
margin: 1% auto;
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
flex-flow: row nowrap;
position: relative;
}

#block02 article ul .orange_line::before{
content: "";
position: absolute;
width: 100%;
height: 1px;
bottom:-70px;
left: 1%;
background-color: #fd9827;
}


#block02 article ul li .price{
margin:  0 auto;
padding: 0 4% 0;
width:63%;
font-size: 18px;
letter-spacing: 0.05em;
line-height: 2.5em;
text-align: center;
}

#block02 article ul li .price img{
margin: 17px auto 0;
}



#block02 article ul li .price-big{
font-size: 30px;
font-weight: 700;
}

#block02 article ul li .block02-text{
text-align: justify;
text-justify: inter-character;
}

/* ******************************************* */
@media screen and (max-width: 1600px) {
 /* ---------------------------------- */

#block02 article ul li .price{
width:65%;
font-size: 17px;
}

#block02 article ul li .price img{
margin: 13px auto 0;
}



#block02 article ul li .price-big{
font-size: 27px;
}


 /* ---------------------------------- */
}


 /* ---------------------------------- */
@media screen and (max-width: 1400px) {
 /* ---------------------------------- */
#block02 div{
padding: 0 10% 0 10%;
}
#block02 article ul li .price{
width:65%;
font-size: 16px;
}

#block02 article ul li .price img{
margin: 13px auto 0;
}



#block02 article ul li .price-big{
font-size: 25px;
}

#block02 article ul{
margin: 8% auto;
padding: 0 8%;
}

#block02 article .course-setumei h4{
font-size: 22px;
}

#block02 article .course-setumei .h4-sub {
font-size: 20px;
}
	
#block02 article .course-setumei p{
margin: 0% auto;
font-size: 16px;
}

 /* ---------------------------------- */
}

 /* ---------------------------------- */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

#block02 article ul li .price{
width:67%;
font-size: 16px;
}

#block02 article ul li .price img{
margin: 10px auto 0;
}



#block02 article ul li .price-big{
font-size: 20px;
}

#block02 article ul{
margin: 5% auto;
padding: 0 7%;
}

#block02 article .course-setumei h4{
font-size: 20px;
}

#block02 article .course-setumei p{
margin: 0% auto;
font-size: 16px;
padding: 1% 5% 0;
}

 /* ---------------------------------- */
}

 /* ---------------------------------- */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#block02 article ul li{
display: block;
margin: 10% auto;
position: relative;
}

#block02 article ul li .price{
margin: 0 auto;
width:70%;
font-size: 16px;
}

#block02 article ul li .price img{
display: none;
}



#block02 article ul li .icon-1024{
position: absolute;
top:165px;
right: 130px;
}

#block02 article .course-setumei .h4-sub {
font-size: 17px;
}

 /* ---------------------------------- */
}

 /* ---------------------------------- */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

#block02 article ul li .price{
margin: 0 auto;
width: 75%;
font-size: 15px;
}

#block02 article ul li .price-big{
font-size: 19px;
}

#block02 article ul li .icon-1024{
position: absolute;
top:156px;
right: 110px;
margin:  0 0 0 30px;
}

#block02 article .course-setumei p{
margin: 0% auto;
font-size: 15px;
padding: 3% 4% 0;
line-height: 2.0em;
}


#block02 article .course-setumei h4{
font-size: 18px;
}

 /* ---------------------------------- */
}

 /* ---------------------------------- */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#block02 div{
padding: 0 5% 0 5%;
}

#block02 article ul li .price{
margin: 0 auto;
width:100%;
font-size: 14px;
}

#block02 article ul li .price-big{
font-size: 18px;
}




#block02 article ul li .icon-1024{
position: absolute;
top:148px;
right: 5%;
margin:  0 0 0 30px;
}

#block02 article .course-setumei p{
margin: 0% auto;
font-size: 14px;
padding: 3% 4% 0;
}

#block02 article .course-setumei{
margin: 25% auto 5%;
}




 /* ---------------------------------- */
}
 /* ---------------------------------- */
@media screen and (max-width: 720px) {
 /* ---------------------------------- */
 /* ---------------------------------- */
}
 /* ---------------------------------- */
@media screen and (max-width: 648px) {
 /* ---------------------------------- */


#block02 article ul li .course-01{
font-size: 16px;
}

#block02 article ul li .price{
margin: 0 auto;
width:94%;
font-size: 13px;
}

#block02 article ul li .price-big{
font-size: 16px;
}




#block02 article ul li .icon-1024{
position: absolute;
top:139px;
right: 0%;
}

#block02 article ul li .icon-1024 img{
max-width: 35px;
}

#block02 article .course-setumei p{
margin: 0% auto;
font-size: 13px;
}

#block02 article .course-setumei h4 {
font-size: 15px;
}
#block02 article .course-setumei .h4-sub {
font-size: 13px;
}
 /* ---------------------------------- */
}

 /* ---------------------------------- */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */
 
#block02{
margin: 20% auto;
}
 #block02 div{
padding:0 4%;  
 }


#block02 article ul li .course-01{
font-size: 16px;
letter-spacing: 0.03em;
}

#block02 article ul li .price{
line-height: 2.0em;
width:94%;
font-size: 12px;
}

#block02 article ul li .price-big{
font-size: 13px;
letter-spacing: 0.03em;
}

#block02 article ul li .icon-1024{
position: absolute;
top:110px;
right: 0%;
}

#block02 article ul li .icon-1024 img{
max-width: 25px;
}


#block02 article .course-setumei p{
margin: 0% auto;
font-size: 12px;
letter-spacing: 0.02em;
}
	
#block02 article .course-setumei {
margin: 28% auto 5%;
}

/*---------------------------------- */
}

@media screen and (max-width: 420px) {
 /* ---------------------------------- */
 #block02 div{
padding:0 2%;  
 }

#block02 article ul li .course-01{
font-size: 15px;
letter-spacing: 0.01em;
}

#block02 article ul li .price{
line-height: 2.0em;
width:100%;
font-size: 12px;
}

#block02 article ul li .price-big{
font-size: 12px;
letter-spacing: 0.01em;
}




#block02 article ul li .icon-1024{
position: absolute;
top:113px;
right: 0%;
}

#block02 article ul li .icon-1024 img{
max-width: 20px;
}

#block02 article ul{
margin: 8% auto;
padding: 0 5%;
}
	
#block02 article .course-setumei {
margin: 28% auto 5%;
}



 /* ---------------------------------- */
}

@media screen and (max-width: 380px) {
 /* ---------------------------------- */


#block02 article ul li .course-01{
font-size: 14px;
letter-spacing: 0.01em;
}

#block02 article ul li .price{
line-height: 2.0em;
width:90%;
font-size: 12px;
}

#block02 article ul li .price-big{
font-size: 14px;
letter-spacing: 0.01em;
margin: 0 0 0 -2px;
}




#block02 article ul li .icon-1024{
position: absolute;
top:160px;
right: 15%;
}

#block02 article ul li .icon-1024 img{
max-width: 25px;
}

#block02 article ul{
margin: 8% auto;
padding: 0 6%;
}


 /* ---------------------------------- */
}

 /* ---------------------------------- 
 block03
 ---------------------------------- */
 #block03{
 margin: 10% auto;
 width: 100%;
 }
 
#block03 .icon img{
margin: 20px auto;
width: 50px;
}
 
#block03 .gray-kazari{
margin: 0 auto;
padding: 0 20% ;
}

#block03 h3{
font-size: 24px;
letter-spacing: 0.05em;
line-height: 2.0em;
}


#block03 .text-01{
margin: 50px auto;
font-size:18px;
line-height: 1.8em;
letter-spacing: 0.05em;
}

#block03 .text-01 span{
border: 1px solid #fd9827;
padding: 1px 8px;
}

#block03 article{
margin: 8% auto;
width: 70%;
display: flex;
align-items: top;
justify-content: space-between;
flex-flow: row nowrap;
}

#block03 .left-box{
width: 50%;
}

#block03 .left-box div{
margin: 0 auto 150px;
position:relative;
}

#block03 .left-box div::after{
content: "";
position: absolute;
background: #fd9827;
width: 30px;
height: 30px;
clip-path: polygon(51% 74%, 0 0, 100% 0);
bottom:-50%;
left: 50%;
  transform: translateY(-50%) translateX(-50%);
}

#block03 .left-box div:nth-child(5)::after{
content: "";
position: absolute;
display: none;
}

#block03 .left-box div h5{
font-size: 24px;
letter-spacing: 0.05em;
line-height: 2.0em;
color: #fd9827;
border: solid 1px #fd9827;
padding: 10px 20px;
}

#block03 .left-box div p{
margin: 30px auto 0;
font-size: 18px;
letter-spacing: 0.05em;
line-height: 1.5em;
text-align: left;
position: relative;
}

#block03 .left-box div p span{
text-align: center;
margin: 0 auto;
position: absolute;
left: 50%;
  transform: translateY(-50%) translateX(-50%);
top:-21px;
}
 
 #block03 .left-box div h4{
 font-size: 24px;
letter-spacing: 0.05em;
line-height: 2.0em;
color: #fff;
background: #fd9827;
padding: 10px 20px;
 }
 
 

 
#block03 .right-box{
width: 40%;
}

#block03 .right-box p:nth-child(1),
#block03 .right-box p:nth-child(2),
#block03 .right-box p:nth-child(3){
margin: 0 auto 38px;
width: 100%;
height: 450px;
}


#block03 .right-box p:nth-child(1){
background: url("../img/course/membership01.jpg")no-repeat;
}

#block03 .right-box p:nth-child(2){
background: url("../img/course/membership02.jpg")no-repeat;

} 
 #block03 .right-box p:nth-child(3){
background: url("../img/course/membership03.jpg")no-repeat;

}
 
 
  /* ---------------------------------- */
@media screen and (max-width: 1700px) {
 /* ---------------------------------- */
#block03 h3{
font-size: 22px;
}

 #block03 .left-box div h4{
 font-size: 22px;
 }
 /* ---------------------------------- */
}
 
 
   /* ---------------------------------- */
@media screen and (max-width: 1600px) {
 /* ---------------------------------- */
 
#block03 article{
margin: 8% auto;
width: 80%;
display: flex;
align-items: top;
justify-content: space-between;
flex-flow: row nowrap;
}
#block03 h3{
font-size: 20px;
}
#block03 .text-01{
margin: 50px auto;
font-size:17px;
}
#block03 .left-box div p{
font-size:17px;
}

 #block03 .left-box div h5,
  #block03 .left-box div h4{
 font-size: 20px;
 }

 /* ---------------------------------- */
}
 
    /* ---------------------------------- */
@media screen and (max-width: 1400px) {
 /* ---------------------------------- */
#block03 h3{
font-size: 19px;
}

#block03 .text-01{
margin: 50px auto;
font-size:16px;
}


#block03 .left-box div p{
font-size:16px;
}

 #block03 .left-box div h5,
 #block03 .left-box div h4{
 font-size: 19px;
 }
 /* ---------------------------------- */
}
 
     /* ---------------------------------- */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */
#block03 .right-box p:nth-child(1){
background: url("../img/course/membership01.jpg") 40% no-repeat;
}

#block03 .right-box p:nth-child(2){
background: url("../img/course/membership02.jpg") 40% no-repeat;

} 
 #block03 .right-box p:nth-child(3){
background: url("../img/course/membership03.jpg")40% no-repeat;

}
 

 /* ---------------------------------- */
}

     /* ---------------------------------- */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
 
#block03 article{
margin: 8% auto;
width: 100%;
display: block;
}

#block03 article .left-box{
width: 100%;
padding:0 15%;
}

#block03 article .right-box{
width: 100%;
}

#block03 .right-box p:nth-child(1),
#block03 .right-box p:nth-child(2),
#block03 .right-box p:nth-child(3){
margin: 20px auto;
width: 100%;
height: 400px;
background-size: cover;
background-position: top;
}

 





#block03 .text-01{
margin: 50px auto;
font-size:15px;
}



#block03 .left-box div p{
font-size:15px;
}

 /* ---------------------------------- */
}
 
      /* ---------------------------------- */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

 

 /* ---------------------------------- */
}

     /* ---------------------------------- */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#block03 h3{
font-size: 17px;
}

#block03 .text-01{
margin: 50px auto;
font-size:14px;
}

#block03 .left-box div p{
font-size:14px;
}
 #block03 .left-box div h5,
 #block03 .left-box div h4{
 font-size: 17px;
 }
 

 /* ---------------------------------- */
}

     /* ---------------------------------- */
@media screen and (max-width: 648px) {
 /* ---------------------------------- */

#block03 article .left-box{
width: 100%;
padding:0 10%;
}

 /* ---------------------------------- */
}


     /* ---------------------------------- */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */
#block03 h3{
font-size: 15px;
}
#block03 .text-01{
margin: 50px auto;
font-size:12px;
line-height: 1.8em;
letter-spacing: 0.02em;
}


#block03 .left-box div p{
font-size:13px;
}
 #block03 .left-box div h5,
 #block03 .left-box div h4{
 font-size: 14px;
 }
 
 
#block03 .left-box div h5{
padding: 10px 0px;
}
 
 #block03 .right-box p:nth-child(1),
#block03 .right-box p:nth-child(2),
#block03 .right-box p:nth-child(3){
margin: 20px auto;
width: 100%;
height: 330px;
background-position:top;
background-size: 480px;
}

#block03 .text-01 span{
padding: 0px 7px;
}

#block03 .left-box div{
margin: 0 auto 110px;
}

#block03 .left-box div::after{
width: 30px;
height: 30px;
bottom:-40%;
}
 


 /* ---------------------------------- */
}
     /* ---------------------------------- */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */
#block03 h3{
font-size: 14px;
}
#block03 .text-01{
margin: 50px auto;
font-size:12px;
}

#block03 .left-box div p{
font-size:12px;
}
 #block03 .left-box div h5,
 #block03 .left-box div h4{
 font-size: 14px;
 }
 
  #block03 .right-box p:nth-child(1),
#block03 .right-box p:nth-child(2),
#block03 .right-box p:nth-child(3){
margin: 20px auto;
width: 100%;
height: 230px;
background-position:top;
background-size: 380px;
}


 /* ---------------------------------- */
}