@charset "utf-8";

@media screen and (max-width: 767px) {
/*
============================================================
2019年度0次募集　コンテンツ　スマホ上書き
============================================================
*/	
.sp {
    display: block;
}	
.sp_none {
    display: none;
}	
.pc {
    display: none;
}
	
body {
	font-size: 13px;
	line-height: 1.6;
}
    
.left,.right {
    float: none;
} 
    
/* ---------------------------------------------------------
■ トップへ戻るボタン
--------------------------------------------------------- */
#page-top {
    bottom: 5px;
    right: 5px;
}    
	
/* ---------------------------------------------------------
■ ヘッダー
--------------------------------------------------------- */
header {
	background-size: 48px 13px;
}
	
header #head_btnbox_tb {
    height: 50px;
}	
	
header #head_btnbox_tb img {
    max-width: 50px;
}
	
header #head_logo {
	height: 50px;
	top: 5px;
}	
	
header #head_logo img {
    max-width: 154px;
}

	
/*ヘッダーgif*/	
header #head_img {
	width: 90%;
	max-width: 458px;
}
header #head_img img{
	width: 100%;
}
header #head_img img.head_tx{
	z-index: 3;
	position: absolute;
	width: 41%;
	top :3%;
	right :25%;
}
	
/* ---------------------------------------------------------
■ フッター
--------------------------------------------------------- */	
footer {
	padding:0;
	font-size:100%;
}
	
/* ---------------------------------------------------------
■ mvエリア
--------------------------------------------------------- */
#mv_area {
    margin-top: 50px;
}
#mv_area .mv_contents .youtubeMovie,
#mv_area .mv_contents .youtubeMovie iframe {
	position: static;
	width: 100%;
	height: 240px;
	background-color: rgba(255,255,255,0.8);
}

    
/* ---------------------------------------------------------
■ 公開説明会
--------------------------------------------------------- */
#open {
    padding: 4% 5px 0; 
}
#open img {
	margin: 0 auto;
}
	
#open:before {
    height: 10%;
}

#open:after {
    height: 4%;
    bottom: -4%;
}    
    
#open .schedule {
	display: block;
	background: #FFF;
	padding: 5px;
	margin: 0 5px 20px;
}  
#open .tokuten {
	margin: 30px 5px;
}	
 
/* ---------------------------------------------------------
■ 学力向上へのこだわり
--------------------------------------------------------- */ 
/*共通*/       
.ability_base {
    padding: 20px;
 }
    
.ability_base .layout_box{
   display: flex;
   flex-wrap:wrap;
}

.ability_base .layout_box .left{order:2; margin-top: 10px;}     
.ability_base .layout_box .right{order:1;}

#ability .box_wrap{
    width: 100%;
}
    
#ability .tx_btn{
    width: 100%;
    height: 60px;
    border-radius: 30px;
    font-size: 18px;
    margin: 20px auto;
}

#ability .tx_btn p{
    background-size: 12px auto;
    padding-left: 20px;
}    
    
    
/*seebe*/
#seebe{
    background: none;
}    
    
#seebe .left{width: 100%;}
#seebe .left p{margin-top: 0;}
#seebe .right{
    width: 70%;
    margin: 5px auto 0;
}
 
/*ヴィーナレット*/
#venulet{
    background: none;
	padding: 50px 0;
}
    
#venulet .left{width: 100%;}
#venulet .left p{margin-top: 0;}
#venulet .right{
    width: 60%;
    margin: 5px auto 0;
}
       
/* ---------------------------------------------------------
■ 教師へのこだわり
--------------------------------------------------------- */
#teacher {
    background-size: 300px auto;
	padding: 50px 0;
}    
/*1列3人に*/
#teacher ul li{
    width: 33%;
}

#teacher ul li:nth-child(4n){
	margin-right: 0.5%;
}  
    
#teacher ul li:nth-child(3n){
	margin-right: 0;
}     
        
    
/* ---------------------------------------------------------
■ 価格へのこだわり
--------------------------------------------------------- */    
#price {
	padding: 50px 0;
}
	
.price_img{
    margin-top: 0;
    padding: 20px;
}
	
.price_img img {
	max-width: none;
	width: 100%;
}
 
 .price_img .left,.price_img .right{
    width: 100%;
}

.price_img p:nth-child(2){
    margin: 10px auto 0;
}    
/* ---------------------------------------------------------
■ 同時受付中・教室紹介
--------------------------------------------------------- */
.andmore {
	padding: 50px 0;
}
	
.andmore  img {
	width: 100%;
	max-width: none;
}	
	
.andmore .more_logo img {
	width: auto;
	max-width: 100%;
}
	
.andmore .layout_box {
	display: block;		
}
	
.andmore .left,.andmore .right{
    width: 100%;
	margin-bottom: 40px;
	background: none;
}
    
.andmore .tx_btn {
	width: 80%;	
}
	
.school .sub_tit{
    width: 100%;
    margin-top: 5px;
}
    
/*教室紹介*/   
.school_box{
    display: flex;
    flex-wrap: wrap;
}    
    
.school_box .right{
    padding-top: 0;
    width: 145px;
    order: 1;
    margin: 0 auto;
}
    
.school_box .tel{
    width: 100%;
    order: 2;
}     

.school_box .left{
    padding-top: 0;
    margin: 0;
    width: 100%;
    order: 3;
}      
    
/* ---------------------------------------------------------
■ フッター
--------------------------------------------------------- */
.foot_contents .left,.foot_contents .right{
	width: 90%;
    margin: 0 auto 10px;
}
    
footer .bnr{
    width: 98%;
}    
    
}


/* ---------------------------------------------------------
■ アイフォン対応
--------------------------------------------------------- */
@media screen and (max-width: 570px) {
    
h2{ font-size: 24px;}    
    
.tx_btn p{
    width: 95%;
    background-size: 4px auto;
    background-position: 4px 50%;
    padding-left: 6px;
    font-size: 16px;
} 
  
.lightbox .name{ 
    font-size: 22px;
}    
.lightbox .name .ruby{ 
    width: 100%;
    display: block;
    font-size: 14px;
}    
/* ---------------------------------------------------------
■ 学力向上へのこだわり
--------------------------------------------------------- */
    
#ability .box_wrap .box{
    width: 100%;
    border: none;
    margin-bottom: 5px;
}
    
#ability .box_wrap figure{
    width: 30%;
} 
    
#ability .box_wrap figure img{
    float: left;
}     

#ability .box_wrap .box .box_tx{
    background: rgba(255,255,255,0.7);
    width: 70%;
    float: right;
    padding: 3px 5px;
}

#ability .box_wrap .box .box_tx p{
    font-size: 12px;
}
    
#ability .box_wrap .box .box_tx:after{
    display: none;
}     

/* ---------------------------------------------------------
■ 教師へのこだわり
--------------------------------------------------------- */
#teacher {
    background-size: 250px auto;
}     
    
/*1列2人に*/
#teacher ul li{
    width: 49.7%;
}

#teacher ul li:nth-child(3n){
	margin-right: 0.5%;
}  
    
#teacher ul li:nth-child(even){
	margin-right: 0;
}      

#teacher ul li .tx .more{
    font-size: 14px;
} 
    
#teacher ul li .tx .more:after{
    background-size: auto 8px;
    background-position: right 60%;
    padding-right: 8px;
}    
/* ---------------------------------------------------------
■ 価格へのこだわり
--------------------------------------------------------- */
#price {
    background-size: 250px auto;
} 
    

/* ---------------------------------------------------------
■ フッター
--------------------------------------------------------- */    
.foot_tx{
	font-size: 16px;
}    
}

@media screen and (max-width:481px){
	footer .floatR .telLink {
		font-size:200%;
	}
}	


