@charset "utf-8";
@media screen and (max-width : 767.9999px ){
/*--------------------------------------------

	 BASE

--------------------------------------------*/
body {
	min-width:inherit;
    font-size: 14px;
}
.secInner{
    max-width: 100%;
    padding:0 4%;
}
#wrapper{
    overflow: hidden;
    width: 100%;
    position: relative;
	}

/*--------------------------------------------

	drawer

--------------------------------------------*/
.drawer-hamburger{
    width: 28px;
    top: 0;
    padding:18px 16px 40px 18px;
    background-color: #e4007f;
    }
    .drawer-open .drawer-hamburger{
        display: none;
    }
.drawer-hamburger:hover{
    background-color: #e4007f;
}
.drawer-hamburger:after {
    content: "MENU";
    display: block;
    position: absolute;
    bottom: 14px;
    left: 17px;
    font-size: 10px;
    letter-spacing: 0.05em;
    color: #fff;;
    }
.drawer-open .drawer-hamburger:after {
    content: ""
    }
.drawer-hamburger-icon{
    margin-top: 5px;
}
.drawer-hamburger-icon:before{
    top: -8px;
 }
.drawer-hamburger-icon:after{
    top: 8px;
}
.drawer-hamburger-icon, .drawer-hamburger-icon:before, .drawer-hamburger-icon:after{
    background-color: #fff;
    height: 3px;
}
.drawer--top .drawer-nav{
    transition: 0.7s;
    background: rgba(228,0,127,0.75);
}
.drawer-open .drawer-nav{
    transition: 0.7s;
    height: 100%;
    background: rgba(228,0,127,0.75);
}
.drawer-menu{
    padding: 7rem 1.4rem 11rem;
}
.dw-ttl{
    text-align: center;
    margin-bottom: 25px;
}
.dw-ttl img{
    width: 95px;
}
.drawer_container{
    padding: 53px 15px 40px;
}
.drawer-list{
    margin-bottom: 38px;
}
.drawer-menu li{
    border-bottom: 0;
    margin-bottom: 0;
}
.drawer-menu .close{
    text-align: center;
}
.drawer-menu .close img{
    width: 185px;
}
/*--------------------------------------------

	HEADER

--------------------------------------------*/
#mv{
    padding-bottom: 11rem;
}
.mv-textBox{
    padding: 1rem 4% 0;
}
#header {
    top: 15px;
    left: 15px;
    transform:none;
}
#header .hdInner {
    padding: 18px 0;
}
#header .header_nav{
    padding:0;
    background-color: transparent;
    justify-content: space-between;
    align-items: center;
    margin-right: 0;
}
#header .nav_list{
    display: none;
}
.header_nav .logo{
    margin-right: 0;
}
.navi-contact{
    display: none;
}
/*--------------------------------------------

	about

--------------------------------------------*/
#about:before{
    height: 80px;
    top: -79px;
    background-image: url("../image/SP/about-topimg-sp.png");
}
#about .object{
    padding: 5rem 0 8.5rem;
    overflow: hidden;
}
#about .object:before,#about .object:after{
    width: 90px;
    height: 90px;
    overflow: hidden;
}
#about .object:before{
    top: 0;
    right: -20px;
}
#about.object:after{
    bottom:-30px;
    left: -30px;
}
#about .ttlbox{
    margin-bottom: 26px;
}
#about .ttl img{
    width: 188px;
}
/*--------------------------------------------

	belief

--------------------------------------------*/
#belief:before{
    height: 28px;
    top: -28px;
    background-image: url("../image/SP/belief-topimg-sp.png");
}
#belief .secInner{
    flex-direction: column;
}
.belief-leftBox,.belief-rightBox{
    padding: 5.5rem 4% 4em;
    width: 100%;
    text-align: center;
}
.belief-leftBox{
    position: relative;
    padding-bottom: 6rem;
}
.belief-leftBox:after{
    content: "";
    display: block;
    width: 100%;
    height: 30px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: url("../image/SP/belief-bottomimg.png")repeat center top;
    background-size: cover;
    }
.belief-rightBox{
    padding-bottom: 7em;
}
.belief-leftBox img,.belief-rightBox img{
    width: 250px;
}
/*--------------------------------------------

	introduction

--------------------------------------------*/
#introduction{
    padding: 8rem 0 8rem;
}
#introduction:before{

    height: 45%;
}
#introduction .ttlbox{
    margin-bottom: 57px;
}
#introduction .school:not(:first-child){
    margin-top: 13px;
}
/*--------------------------------------------

	introduction

--------------------------------------------*/
#coach{
    padding: 4.5rem 0 6em;
}
#coach .ttlbox{
    margin-bottom: 40px;
}
#coach .ttl img{
    width: 175px;
}
/*--------------------------------------------

	contact

--------------------------------------------*/
#contact {
    padding: 6.8rem 0 6.6rem;
}
#contact:before{
    height: 112px;
    top: -112px;
    left: 0;
    background-image: url(../image/SP/contact-topimg-sp.png);
}
#contact .ttlbox{
    margin-bottom: 36px;
}
#contact .ttl img{
    width: 98px;
}
#contact .formbox{
    padding: 2.2rem 7.8%;
    border-width: 4px;
    border-radius: 16px;
    }
#contact .form_list .item{
    font-size: 1.3rem;
    flex-direction: column;
}
#contact .item:last-child{
    margin-bottom: 25px;
}
#contact .label{
    position: relative;
    width: 100%;
    background-color: inherit;
    color: #e4007f;
    padding: 0 0 0 1.2em;
    margin-right: 0;
    margin-bottom: 10px;
}
#contact .label:before{
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #e4007f;
    border-radius: 50%;
}
#contact .field{
    width: 100%;
}
#contact input[type="text"],
#contact input[type="tel"],
#contact input[type="email"],
#contact textarea{
    font-size: 1.2rem;	
    padding: 0.6em 1em;
}
#contact textarea{
    height: 90px;
}
	#contact [type="submit"]{
    width:182px;
    height:40px;
}
/*--------------------------------------------

	FOOTER

--------------------------------------------*/
#footer .secInner{
    padding:4.6rem 0 2.8rem;
}
    #footer .ft-image img{
        width: 250px;
    } 
}
/*=========== M E D I A Q U E R Y ==========*/