@charset 'utf-8';
/*	Cascading Style Sheets: style.css 5.2	*/

/*共通*/
.CONTENTS{width: 1170px;margin: 0 auto;}
.back_blue{background: #E7F1FA;}
.back_white{background: #FFF;}
.back_yellow{background: #FFFBCC;}

/* トップ */
.TOP{position: relative;background-image: url(../img/top_background.png);background-size: cover;}
.TOP_IMG{width: 1170px;margin: 0 auto;position: relative;padding-top: 20px;}
.TOP_TIME{width: 230px;position: absolute;top: 60px;right: -120px;}
.TOP_PEOPLE{width: 940px;position: absolute;right: 0;left: 0;margin: 0 auto;bottom: -260px;}

/* 数学に特化した授業から個別指導、電子工作まで幅広い「学び」を提供します。 */
.BACK_SELECT{background-image: url(../img/select_background.png);background-size: cover;}
.CONTENTS1{padding: 70px 0;margin-top: 0px;padding-top: 100px;}
.SELECTS{width: 1000px;display: flex;flex-direction: row;margin: 0 auto;justify-content: space-between;}
.SELECT_TYTLE{margin-bottom: 30px;}
.SELECT{width: 315px;filter: drop-shadow(5px 5px 5px #D1D1D1);position: relative;}
.JISHU{font-size: 14px;width: 1000px;margin: 50px auto;color: #707070;}
.JISHU a{color: #ED6064;display: inline-block; text-decoration: underline;font-weight: bold;}
.TEACHER_WRAP {width: 840px;margin: 0 auto;padding: 45px 80px;border-radius: 10px 100px 10px 100px;}
.TEACHER_TYTLE{width: 840px;margin: 0 auto;margin-bottom: 35px;}
.TEACHER_DETAIL{display: flex;flex-direction: row;justify-content: space-between;}
.TEACHER_PHOTO{width: 360px;}
.TEACHER_TEXT_TEXT{width: 430px;}

/* ボタン */
.btn{position: relative;overflow: hidden;text-decoration: none;display: inline-block;border: 1px solid #ED6064;padding: 10px 30px;text-align: center;outline: none;transition: ease .2s;position: absolute;bottom: 30px;margin: 0 auto;right: 0;left: 0;width: 150px;border-radius: 20px;}
.btn span {position: relative;z-index: 3;color:#ED6064;font-size: 17px;letter-spacing: 1px;}
.CONTENTS .SELECT a:hover{opacity: 1;}
.btn:hover span{color:#fff;}
.bgskew::before {content: '';position: absolute;top: 0;left: -130%;background:#ED6064;width:120%;height: 100%;transform: skewX(-25deg);}
.bgskew:hover::before {animation: skewanime .5s forwards;}
@keyframes skewanime {100% {left:-10%;/*画面の見えていない左から右へ移動する終了地点*/}}

/* 数学に特化した授業 */
.BACK_MATH{background-image: url(../img/math_background.png);background-size: cover;}
.MATH_BUTTON {width: 475px;margin: 0 auto;margin-bottom: 100px;margin-top: 50px;filter: drop-shadow(5px 5px 5px #D1D1D1);}
.CONTENTS a:hover{opacity: 0.7;}

/* 個別指導 */
.BACK_KOBETSU{background-image: url(../img/kobetsu_background.png);background-size: cover;}

/* 勉強の枠にとらわれない学習活動 */
.BACK_ACTIVE{background-image: url(../img/active_background.png);background-size: cover;}

/* 駅近の、通いやすい立地！ */
.CONTENTS3{padding-bottom: 55px;}
.CONTENTS3_LINK{width: 900px;margin: 0 auto;margin-top: 10px;}

/* 固定バー */
.FIX{background: #ED6064;position: fixed;bottom: 0px;width: 100vw;padding: 11px 0;}
.FIX_TEL{width: 275px;}
.FIX_FORM{width: 430px;}
.FIX_CONTENTS{width: 650px;margin: 0 auto;display: flex;align-items: center;justify-content: space-between;}

/*PC・SP*/
.pc {	display: block;}
.sp {	display: none;}






@media screen and (max-width: 1000px) {
  .CONTENTS{width: 100vw;}
}





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

/*共通*/
.CONTENTS{width: 100vw;margin: 0;padding-top: 0px;}

/* トップ */
.TOP{background-image: none;}
.TOP_IMG{padding: 0;width: 100vw;}
.TOP_TIME{width: 100vw;position: initial;}

/* 数学に特化した授業から個別指導、電子工作まで幅広い「学び」を提供します。 */
.SELECTS{flex-direction: column;width: 100vw;}
.SELECT{width: 90vw;margin: 0 auto;margin-bottom: 40px;}
.SELECT_TYTLE{padding-top: 60px;}
.TEACHER_WRAP{width: 100vw;padding: 0;border-radius: 0;margin: 0 auto;}
.TEACHER_TYTLE{width: 100vw;margin-bottom: 0;}
.JISHU{width: 90vw;text-align: justify;margin: 0px auto;margin-bottom: 30px;}
.btn{bottom: 40px;}
.FB{width: 90vw;margin: 0 auto;background: white;}
.FB_IMG {width: 80vw;margin: 0 auto;padding-bottom: 30px;}
/* 数学に特化した授業 */
.BACK_MATH{background-image: none;}
.MATH_BUTTON{width: 100vw;margin-bottom: 80px;margin-top: 10px;}

/* 個別指導 */
.BACK_KOBETSU{background-image: none;}

/* 勉強の枠にとらわれない学習活動 */
.BACK_ACTIVE{background-image: none;}

/* 駅近の、通いやすい立地！ */
.CONTENTS3{padding-top: 0px;}
.CONTENTS3_LINK{width: 90vw;}

/* 固定バー */
.FIX{width: 100vw;padding: 0;}
.FIX_CONTENTS{width: 100vw;}
.FIX_TEL{width: 50vw;}
.FIX_FORM{width: 50vw;}

/* フッター */
#footer{padding: 25px 5vw;padding-bottom: 82px;}

/*PC・SP*/
.pc {display: none;}
.sp {display: block;}



}