@charset "UTF-8";

@media screen and (max-width: 767px){
	body {
		padding-top: 66px;
	}
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	
	.container{
		width:100%;
	}
	
	.sp-header-group {
		height: 66px;
        width: 100%;
		background-color: #161616;
        position: fixed;
		top: 0;
		left:0;
		z-index:99999;
	}
	header .logo {
		display:block;
		left:9px;
	}
	header .logo img{
		height:66px;
	}
	header .h1 {
		margin:0;
	}
	header h1 {
		font-size: 10px;
		width: auto;
		height: auto;
		left: 60px;
		top: 10px;
		color: #fff;
		background: none;
	}

	.menu_btn{
		position:fixed;
		top:1px;
		right:0px;
		width:61px;
		height:57px;
		z-index:99999;
	}
	.menu_btn img{
		max-width:100%;
	}
	.gloval_nav_sm{
		display:none;
		background-color:rgba(255,255,255,0.86);
		margin:0;
		position:fixed;
		top:68px;
		left:0;
		right:0;
		z-index: 99999999999;
	}
	.gloval_nav_sm ul{
		display:block;
		margin:0;
		padding:0;
	}
	.gloval_nav_sm ul li{
		display:block;
		font-size: 16px;
		border-bottom:1px solid #000000;
		padding:15px;
		text-align:center;
	}
	.gloval_nav_sm ul li a{
		color:#000000;
		font-family: FlopDesignFont;
		font-weight:bold;
		display:inline-block;
		text-align:left;
		width:180px;
	}
	.navi_icon{
		width:40px;
		display:inline-block;
	}
	.navi_icon img{
		max-width:100%;
	}

	.sns-btns {
		width: 100%;
		font-size: 0;
		text-align: center;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 9999;
	}
	.sns-btns-in {
		display: table;
		margin:auto;
	}
	.sns-btns a {
		position: unset;
		display: table-cell
	}

/*------------------------------

下層ページ

-------------------------------*/
	header {
		height:auto;
		background:none;
	}

	.container-fluid {
		padding:0;
	}
	.back01 {
		background: #fff;
	}

	.sp-fv {
		color: #fff;
		height: 146px;
		padding-top: 70px;
		margin-bottom: 30px;
		text-align: center;
	}
	.sp-fv h2 {
		font-size: 30px;
		font-family: BebasNeue;
		line-height: 1;
		margin: 0 0 5px;
	}
	.sp-fv h3 {
		font-size: 11px;
		font-weight: bold;
		line-height: 1;
		margin: 0;
	}
    .sp-table {
		display: table;
	}
	.sp-text-group {
		display: table-cell;
		padding: 0;
		vertical-align: top;
	}
	.sp-fig {
		display: table-cell;
		width: 50%;
	}
    .sp-border-box {
		padding: 10px;
		border: solid 1px #000;
		border-radius:10px;
	}
    .sp-aligCenter {
		text-align:center;
	}

	.title-area {
		width: 100%;
	}
	.area01 {
		width: auto;
		border:none;
	}
	.area01 h3 {
		font-size: 21px;
	}
	.area01 h3:before {
		height: 20px;
		margin-right: 5px;
	}
	.area01 h3 span {
		font-size: 10px;
	}

	.area01 p.p1,
	.area01 p.p01,
	.area01 p.p02,
	.area02 p {
		font-size: 10px;
	}
	.area01 p.p1 {
		line-height: 1.5;
	}

	.area02 {
		width: auto;
		margin-top: 0;
	}
	.area02 p {
		text-align:center;
	}
	.area02 p.p1 {
		font-size: 10px;
	}
	.area02 p.p1 .arrow {
		width: 15px;
	}
	.area02 h3 {
		line-height: 30px;
		padding: 0 6px;
		overflow: hidden;
	}
	.area02 h3 .pull-left {
		font-size: 13px;
		vertical-align: middle;
	}
	.area02 h3 .pull-right {
		font-size: 10px !important;
	}
	.area03 {
		padding: 10px;
		font-size: 13px;
		max-width: 80%;
		margin: 0 auto 20px;
	}
	.area03 h4 {
		font-size: 12px;
		font-weight: bold;
	}
	.area03 big {
		margin-left: 10px;
	}
	.area03 p {
		font-size: 10px;
	}
	.area03 p span {
		font-size: 18px;
		font-weight: bold;
	}

	.col-sm-6,
	.col-sm-7,
	.col-sm-8,
	.col-sm-10,
	.col-sm-12 {
		padding: 0
	}

	.table01 th {
		font-size: 12px;
	}
	.table01 td {
		font-size: 10px;
	}

	.table02 th {
		font-size: 10px;
	}
	.table02 td {
		font-size: 10px;
		text-align: center;
	}

/* lesson */
    #lesson .sp-fv {
		background: url(../images/lesson/fv.jpg);
		background-size:cover;
	}
	.lesson-group {
		margin-bottom: 20px;
		padding-bottom: 20px;
		position: relative;
	}
	.lesson-group:after {
		content: '';
		display: block;
		width: calc(100% + 32px);
		height: 9px;
		background: #ccc;
		position: absolute;
		left: -16px;
		bottom: -9px;
	}
    #lessonGroup01 p.p2 {
		text-align: left;
	}
	#lessonGroup01 .sp-fig img {
		margin-top: -20px;
	}
	#lessonGroup02 .sp-fig img {
		margin-top: 30px;
	}
	#lessonGroup03:after {
		display:none;
	}

/* circle */
    #circle .sp-fv {
		background: url(../images/circle/fv.jpg);
		background-size:cover;
	}
	.sp-copy01 {
		font-size: 12px;
		border: none !important;
		width: calc(100% + 30px);
		margin-left: -15px !important;
		background: rgba(227,0,127,0.2);
	}

/* price */
    #price .sp-fv {
		background: url(../images/price/fv.jpg);
		background-size:cover;
	}
	
	.sp-mb20 {
		margin-bottom: 20px;
	}
	.sp-b_b-none,
	.sp-b_b-none tr:last-child td{
		border-bottom: none;
	}
	.sp-w30per {
		width: 30% !important;
	}

/* access */
    #access .sp-fv {
		background: url(../images/access/fv.jpg);
		background-size:cover;
	}

	#map-frame {
		margin-left: -15px;
		width: calc(100% + 30px);
	}

}

@media screen and (max-width: 360px){

	.gloval_nav_sm ul li {
		padding: 10px;
	}


}