@charset "utf-8";

/*=================================================================================================================================*/
/** 個別指定 for スマートフォン
/*=================================================================================================================================*/

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

/*---------------------------------------------
	body
---------------------------------------------*/
html { scroll-behavior: smooth; }
body { font-size: 15px; line-height: 1.8;
}
p    {font-size: 15px;}

.only_pc_none {display:block!important; }
.only_sp_none {display:none!important; }
.sp_br{display: inline;}

/*画像*/
img{max-width:100%; height:auto;}

/*---------------------------------------------
 ** ヘッダー記述
---------------------------------------------*/

#header{
  height:71px;
}
#header h1 a{
  width:80%;
  height:71px;
  background:url(../img/logo.png) no-repeat top left ;
  background-size:100% auto;
  top:15px;
  left:0;
}

.nav_btn{
  width:100%;
  position: static;
  display: block;
  float: none;
  margin-top:20px;
  font-size:110%;
}
.nav_btn a{
  width:90%;
  margin:0 auto 10px;
  padding:10px 0;
  border-radius: 30px;
}

.home #main > div{
  width:60%;
}
.home #main div div h2{
  font-size:2.0rem;
}


.home #content h3{
  font-size:220%;
  padding:10px 0 20px 20px;
}
.home #content h3 span{
  margin-top:10px;
  font-size:1.6rem;
}

.top_flow{
  width:100%;
  background:url(../img/top_about.png) no-repeat center bottom;
  background-size:auto 300px;
  padding:0 0 320px;
  margin-bottom:60px;
}
.top_flow p{
  width:100%;
  padding:5% 0;
  background:#fff;
  margin:0;
}

.top_course{
  width:100%;
  background:url(../img/top_course.png) no-repeat center bottom;
  background-size:auto 300px;
  padding:0 0 320px;
  margin-bottom:60px;
}
.top_course p{
  width:100%;
  padding:3% 0;
  background:#fff;
}
.access_img dl{
  width:100%;
}


#content{
  margin:0 auto 40px;
}
#content .top_course h3{
  border-left:8px solid #339EDB;
  border-right:0;
  padding-left:20px;
  padding-right:0;
  text-align: left;
}
.top_course h3 + div{
  width:100%;
  padding:5% 0;
}

.top_news{
  margin-bottom:30px;
}
.top_news dl{
  display: block;
}
.top_news dl dt{
  width:90%;
}
.top_news dl dd{
  width:90%;
  padding:0 5%;
}


.top_movie iframe{
  height:400px;
}
@media screen and (max-width: 370px) {
  .top_movie iframe{
    height:300px;
  }
}

#con_ttl{
  background:url(../img/con_title_bg.jpg) no-repeat top right 20% #d7e9f5;
  background-size:auto 100%;
}
#con_ttl h2{
  font-size:2.4rem;
  padding:30px 0;
}
@media screen and (max-width: 370px) {
  #con_ttl h2{
    font-size:2.0rem;
  }
}
#flow h3, #entry h3, #access h3{
  font-size:2.0rem;
  margin:30px auto;
  line-height: 1.6;
  padding-bottom:5%;
}
#flow h3::after, #entry h3::after, #access h3::after{
  width:160px;
  height:4px;
  border-radius: 4px;
}
#flow h4 span{
  padding:0 10px;
  margin-right:10px;
}


.flow_box{
  padding:5% 3% 3%;
  margin-bottom:55px;
}
.flow_box::after{
  border-width: 26px 15px 0 15px;
  bottom:-40px;
}
#flow h4{
  margin-bottom:10px;
}

.course_box{
  padding:10% 0;
}

.course_box h3{
  font-size:120%;
}
.course_box > div p{
  width:100%;
}

.course_box > div dl{
  width:100%;
}

.course_box > div dl dt{
  width:100%;
  padding:5px 0;
  font-size:110%;
}
.course_box > div dl dd{
  width:100%;
  padding:5px 0;
  text-align: center;
  margin-bottom:25px;
}

.schedule_box{
  width:100%;
  border:1px solid #339EDB;
  padding:3% 3% 0;
  position:relative;
  margin-bottom:30px;
}


.schedule_box h3{
  font-size:130%;
  margin:10px auto;
  padding:5px 0 5px 10px;
}

.schedule_box dl{
  border-bottom:none;
}
.schedule_box dl dt{
  width:96%;
  padding:5px 2%;
  margin-right:0;
}
.schedule_box dl dd{
  width:100%;
}
.schedule_box .dd_btn{
  text-align: center;
  padding-bottom:80px;
}

.schedule_box .dd_btn .btn{
  top:auto;
  right:0;
  left:0;
  bottom:15px;
  margin:0 auto;
}

.info_data h3,
.privacy_block h3{
  padding:3% 0 3% 2%;
}

.info_data h3 span,
.privacy_block h3 span{
  padding-left:10px;
  padding-right:10px;
}
.info_data h3 span span{
  padding-left:0;
}

.dl_btn .btn{
  width:90%;
  margin:0 5% 50px;
}

.faq_block{
  border-radius: 5px;
  padding:3% 3%;
}

.q-txt{
  padding:5px 0px 8px 0;
  width:1.6em;
  font-size:110%;
}

.a-txt{
padding:5px 0px 8px 0;
width:1.6em;
font-size:110%;
}
.q-bun{
margin-left:2.2em;
margin-right:20px;
font-size:16px;
padding-top:0;
}
.a-box{
padding:5px;
}

.a-bun p{
margin-left:2.8em !important;
margin-bottom:10px;
padding-top:3px;
}


.article-title:after {
  right: 5px;
}

.article-title.open:after {
  right: 5px;
  top: 25%;
}

.info_list .info_box{
  padding:5% 1%;
}
.info_list .info_box > div{
  width:100%;
}
.info_list .info_box > div p:nth-child(1) span{
  margin-right:5px;
}


.info_list .info_box > a{
  width:70%;
  height:140px;
  overflow: hidden;
  position:relative;
  display: block;
  margin:0 auto;
}

.info_list .info_box > a.noimg{
  display: none;
}


.contact h3{
  font-size:1.7rem;
}

.contact h3 br{
  display: none;
}
.contact_info p span{
  font-size:2.8rem;
}

.contact-dl dt{
width:100%;
display:inline-block;
margin-right:0;
margin-bottom:5px;
}

.contact-dl dd{
  width:100%;
}

input[type="text"],
input[type="email"],
textarea {
  width:calc(100% - 1.2em);
  font-size:16px;
}




footer{
  padding-bottom:88px;
}

footer .column_3 li{
  width:48%;
  margin-bottom:15px;
}
footer .column_3 li:nth-child(3){
  width:100%;
}
footer .column_3 li.f_access a{
  width:50%;
  background-image: url(../img/logo_foot03.png);
  background-position: center left 25%;
  background-repeat: no-repeat;
  background-size: 57px auto;
  padding: 30px 15% 30px 35%;
}
@media screen and (max-width: 370px) {
  footer .column_3 li{
    width:100%;
    margin-bottom:15px;
  }
  footer .column_3 li.f_about a{
    width:50%;
    background-image: url(../img/logo_foot01.png);
    background-position: center left 15%;
    background-repeat: no-repeat;
    background-size: 57px auto;
    padding: 30px 15% 30px 35%;
  }
  footer .column_3 li.f_course a{
    width:50%;
    background-image: url(../img/logo_foot02.png);
    background-position: center left 15%;
    background-repeat: no-repeat;
    background-size: 45px auto;
    padding: 30px 15% 30px 35%;
  }
  footer .column_3 li.f_access a{
    width:50%;
    background-image: url(../img/logo_foot03.png);
    background-position: center left 15%;
    background-repeat: no-repeat;
    background-size: 50px auto;
    padding: 30px 15% 30px 35%;
  }

}



.foot_data{
  text-align: center;
}
.foot_data01 a{
  width:85%;
  margin:20px auto 10px;
  padding-right:8%;
}
.foot_data01 a::before{
  width:20%;
  right:-25px;
  top:-3px;
}

.foot_data02 p{
  text-align: center;
  float:none;
}
.foot_data02 p a{
  font-size:3.6rem;
}
.foot_data02 p a:link,
.foot_data02 p a:visited{
  text-decoration: none!important;
}


.foot_data01, .foot_data02{
  width:100%;
}
.foot_contact .btn{
  display: none;
}

.foot_copy ul, .foot_copy p{
  width:100%;
  text-align: center;
}
.foot_copy ul{
  justify-content: center;
  margin-bottom:30px;
}



.sp_tel{
  display: flex;
  justify-content:space-between;
  width:100%;
  background:rgba(0, 0, 0, 0.7);
  text-align: center;
  position: fixed;
  bottom:0;
  padding-top:3%;
  z-index:999;
}
.sp_tel p.btn{
  width:50%;
  margin-bottom:20px;
}
.sp_tel p.btn a{
  width:95%;
  padding:0 5%;
  min-width:100px;
}
.sp_tel p.btn:nth-child(1) a{
  background:#3EBFB2!important;
  border: 3px solid #3EBFB2!important;
}
.sp_tel p.btn:nth-child(1) a::before,
.sp_tel p.btn:nth-child(1) a::after {
  background-color: #3EBFB2;
}

@media screen and (max-width: 370px) {
  .sp_tel p.btn a{
    font-size:90%;
  }
}



/*---------------------------------------------
 **  ページトップ
---------------------------------------------*/

#pageTop {
  position: fixed;
  bottom: 88px;
  right: 0px;
  z-index: 999;
}
#pageTop a {
  width: 50px;
  height: 50px;
  opacity: 0.9;
}
#pageTop a:hover {
  opacity: 0.9;
}

}





/* スマホのときのみ電話をかける */
@media (min-width: 770px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}