@charset "UTF-8";
@font-face {
  font-family: "NotoSansJP-Black";
  src: url(../fonts/NotoSansJP-Black.ttf);
}
@font-face {
  font-family: "NotoSansJP-Bold";
  src: url(../fonts/NotoSansJP-Bold.ttf);
}
@font-face {
  font-family: "NotoSansJP-ExtraBold";
  src: url(../fonts/NotoSansJP-ExtraBold.ttf);
}
@font-face {
  font-family: "NotoSansJP-Medium";
  src: url(../fonts/NotoSansJP-Medium.ttf);
}
@font-face {
  font-family: "NotoSansJP-Regular";
  src: url(../fonts/NotoSansJP-Regular.ttf);
}
@font-face {
  font-family: "NotoSansJP-SemiBold";
  src: url(../fonts/NotoSansJP-SemiBold.ttf);
}
@font-face {
  font-family: "Noto sansCJK Black";
  src: url(../fonts/NotoSansCJKjp-Black.otf);
}
@font-face {
  font-family: "Noto sansCJK Bold";
  src: url(../fonts/NotoSansCJKjp-Bold.otf);
}
@font-face {
  font-family: "Noto sansCJK Medium";
  src: url(../fonts/NotoSansCJKjp-Medium.otf);
}
@font-face {
  font-family: "Noto sansCJK Regular";
  src: url(../fonts/NotoSansCJKjp-Regular.otf);
}
@font-face {
  font-family: "Poppins-Black";
  src: url(../fonts/Poppins-Black.ttf);
}
@font-face {
  font-family: "Poppins-Bold";
  src: url(../fonts/Poppins-Bold.ttf);
}
@font-face {
  font-family: "Poppins-BoldItalic";
  src: url(../fonts/Poppins-BoldItalic.ttf);
}
@font-face {
  font-family: "Poppins-Light";
  src: url(../fonts/Poppins-Light.ttf);
}
@font-face {
  font-family: "Poppins-Italic";
  src: url(../fonts/Poppins-Italic.ttf);
}
@font-face {
  font-family: "Poppins-Medium";
  src: url(../fonts/Poppins-Medium.ttf);
}
@font-face {
  font-family: "Poppins-Regular";
  src: url(../fonts/Poppins-Regular.ttf);
}
@font-face {
  font-family: "Poppins-SemiBold";
  src: url(../fonts/Poppins-SemiBold.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Black";
  src: url(../fonts/ZenMaruGothic-Black.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Bold";
  src: url(../fonts/ZenMaruGothic-Bold.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Medium";
  src: url(../fonts/ZenMaruGothic-Medium.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Regular";
  src: url(../fonts/ZenMaruGothic-Regular.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Light";
  src: url(../fonts/ZenMaruGothic-Light.ttf);
}
@font-face {
  font-family: "HostGrotesk-Bold";
  src: url(../fonts/HostGrotesk-Bold.ttf);
}
@font-face {
  font-family: "HostGrotesk-Light";
  src: url(../fonts/HostGrotesk-Light.ttf);
}
@font-face {
  font-family: "HostGrotesk-ExtraBold";
  src: url(../fonts/HostGrotesk-ExtraBold.ttf);
}
@font-face {
  font-family: "HostGrotesk-Medium";
  src: url(../fonts/HostGrotesk-Medium.ttf);
}
@font-face {
  font-family: "HostGrotesk-Regular";
  src: url(../fonts/HostGrotesk-Regular.ttf);
}
@font-face {
  font-family: "HostGrotesk-SemiBold";
  src: url(../fonts/HostGrotesk-SemiBold.ttf);
}
@font-face {
  font-family: "GildaDisplay-Regular";
  src: url(../fonts/GildaDisplay-Regular.ttf);
}
@font-face {
  font-family: "FunnelSans-Bold";
  src: url(../fonts/FunnelSans-Bold.ttf);
}
@font-face {
  font-family: "FunnelSans-ExtraBold";
  src: url(../fonts/FunnelSans-ExtraBold.ttf);
}
@font-face {
  font-family: "FunnelSans-Light";
  src: url(../fonts/FunnelSans-Light.ttf);
}
@font-face {
  font-family: "FunnelSans-Medium";
  src: url(../fonts/FunnelSans-Medium.ttf);
}
@font-face {
  font-family: "FunnelSans-Regular";
  src: url(../fonts/FunnelSans-Regular.ttf);
}
@font-face {
  font-family: "FunnelSans-SemiBold";
  src: url(../fonts/FunnelSans-SemiBold.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Black";
  src: url(../fonts/FiraSansCondensed-Black.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Bold";
  src: url(../fonts/FiraSansCondensed-Bold.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-ExtraBold";
  src: url(../fonts/FiraSansCondensed-ExtraBold.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Medium";
  src: url(../fonts/FiraSansCondensed-Medium.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Regular";
  src: url(../fonts/FiraSansCondensed-Regular.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-SemiBold";
  src: url(../fonts/FiraSansCondensed-SemiBold.ttf);
}
/*	com-color
サイト内で主に使用する色の変数
------------------------------------ */
/*	transition,hover
ホバー時のtransition秒数を統一、ホバーアクション
------------------------------------ */
/*	media-screen
画面サイズごとのcss設定に使用
------------------------------------ */
@media screen and (min-width: 768px) {
  .sp-only {
    display: none !important;
  }
}
/*	layout
その他パーツ
------------------------------------ */
@font-face {
  font-family: "NotoSansJP-Black";
  src: url(../fonts/NotoSansJP-Black.ttf);
}
@font-face {
  font-family: "NotoSansJP-Bold";
  src: url(../fonts/NotoSansJP-Bold.ttf);
}
@font-face {
  font-family: "NotoSansJP-ExtraBold";
  src: url(../fonts/NotoSansJP-ExtraBold.ttf);
}
@font-face {
  font-family: "NotoSansJP-Medium";
  src: url(../fonts/NotoSansJP-Medium.ttf);
}
@font-face {
  font-family: "NotoSansJP-Regular";
  src: url(../fonts/NotoSansJP-Regular.ttf);
}
@font-face {
  font-family: "NotoSansJP-SemiBold";
  src: url(../fonts/NotoSansJP-SemiBold.ttf);
}
@font-face {
  font-family: "Noto sansCJK Black";
  src: url(../fonts/NotoSansCJKjp-Black.otf);
}
@font-face {
  font-family: "Noto sansCJK Bold";
  src: url(../fonts/NotoSansCJKjp-Bold.otf);
}
@font-face {
  font-family: "Noto sansCJK Medium";
  src: url(../fonts/NotoSansCJKjp-Medium.otf);
}
@font-face {
  font-family: "Noto sansCJK Regular";
  src: url(../fonts/NotoSansCJKjp-Regular.otf);
}
@font-face {
  font-family: "Poppins-Black";
  src: url(../fonts/Poppins-Black.ttf);
}
@font-face {
  font-family: "Poppins-Bold";
  src: url(../fonts/Poppins-Bold.ttf);
}
@font-face {
  font-family: "Poppins-BoldItalic";
  src: url(../fonts/Poppins-BoldItalic.ttf);
}
@font-face {
  font-family: "Poppins-Light";
  src: url(../fonts/Poppins-Light.ttf);
}
@font-face {
  font-family: "Poppins-Italic";
  src: url(../fonts/Poppins-Italic.ttf);
}
@font-face {
  font-family: "Poppins-Medium";
  src: url(../fonts/Poppins-Medium.ttf);
}
@font-face {
  font-family: "Poppins-Regular";
  src: url(../fonts/Poppins-Regular.ttf);
}
@font-face {
  font-family: "Poppins-SemiBold";
  src: url(../fonts/Poppins-SemiBold.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Black";
  src: url(../fonts/ZenMaruGothic-Black.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Bold";
  src: url(../fonts/ZenMaruGothic-Bold.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Medium";
  src: url(../fonts/ZenMaruGothic-Medium.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Regular";
  src: url(../fonts/ZenMaruGothic-Regular.ttf);
}
@font-face {
  font-family: "ZenMaruGothic-Light";
  src: url(../fonts/ZenMaruGothic-Light.ttf);
}
@font-face {
  font-family: "HostGrotesk-Bold";
  src: url(../fonts/HostGrotesk-Bold.ttf);
}
@font-face {
  font-family: "HostGrotesk-Light";
  src: url(../fonts/HostGrotesk-Light.ttf);
}
@font-face {
  font-family: "HostGrotesk-ExtraBold";
  src: url(../fonts/HostGrotesk-ExtraBold.ttf);
}
@font-face {
  font-family: "HostGrotesk-Medium";
  src: url(../fonts/HostGrotesk-Medium.ttf);
}
@font-face {
  font-family: "HostGrotesk-Regular";
  src: url(../fonts/HostGrotesk-Regular.ttf);
}
@font-face {
  font-family: "HostGrotesk-SemiBold";
  src: url(../fonts/HostGrotesk-SemiBold.ttf);
}
@font-face {
  font-family: "GildaDisplay-Regular";
  src: url(../fonts/GildaDisplay-Regular.ttf);
}
@font-face {
  font-family: "FunnelSans-Bold";
  src: url(../fonts/FunnelSans-Bold.ttf);
}
@font-face {
  font-family: "FunnelSans-ExtraBold";
  src: url(../fonts/FunnelSans-ExtraBold.ttf);
}
@font-face {
  font-family: "FunnelSans-Light";
  src: url(../fonts/FunnelSans-Light.ttf);
}
@font-face {
  font-family: "FunnelSans-Medium";
  src: url(../fonts/FunnelSans-Medium.ttf);
}
@font-face {
  font-family: "FunnelSans-Regular";
  src: url(../fonts/FunnelSans-Regular.ttf);
}
@font-face {
  font-family: "FunnelSans-SemiBold";
  src: url(../fonts/FunnelSans-SemiBold.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Black";
  src: url(../fonts/FiraSansCondensed-Black.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Bold";
  src: url(../fonts/FiraSansCondensed-Bold.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-ExtraBold";
  src: url(../fonts/FiraSansCondensed-ExtraBold.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Medium";
  src: url(../fonts/FiraSansCondensed-Medium.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-Regular";
  src: url(../fonts/FiraSansCondensed-Regular.ttf);
}
@font-face {
  font-family: "FiraSansCondensed-SemiBold";
  src: url(../fonts/FiraSansCondensed-SemiBold.ttf);
}
/*	com-color
サイト内で主に使用する色の変数
------------------------------------ */
/*	transition,hover
ホバー時のtransition秒数を統一、ホバーアクション
------------------------------------ */
/*	media-screen
画面サイズごとのcss設定に使用
------------------------------------ */
@media screen and (min-width: 768px) {
  .sp-only {
    display: none !important;
  }
}
/*	layout
その他パーツ
------------------------------------ */
/*	font-size
スマホ時にフォントサイズを自動で変更
※13px以下は文字が読めないためPC/SP同じサイズ
------------------------------------ */
/* =========================================

    main layout  all
    PC時のみ反映させるcss

========================================= */
/*	cmn parts
------------------------------------ */
@media screen and (min-width: 768px) {
  .sp-only {
    display: none !important;
  }
}
/*	pc inner
------------------------------------ */
/* =========================================
    top  PC
    top-season
========================================= */
#top-season .inner {
  padding: 100px 0 85px;
}

/* =========================================
    top  PC
    top-about
========================================= */
#top-about .inner {
  padding-bottom: 165px;
}

/* =========================================
    top  PC
    top-course
========================================= */
#top-course .inner {
  padding: 90px 0 220px;
}

/* =========================================
    top  PC
    top-teacher
========================================= */
#top-teacher .inner {
  padding: 80px 0 220px;
}

/* =========================================
    top  PC
    link-list
========================================= */
#link-list .inner {
  padding-bottom: 222px;
}

/* =========================================
    top  PC
    top-news
========================================= */
#top-news .inner {
  padding: 85px 0;
}

/* =========================================
    top  PC
    com-contact
========================================= */
#com-contact .inner {
  padding: 100px 0;
}

/* =========================================
    top  PC
    footer
========================================= */
#footer .inner {
  padding: 80px 0;
}

/* =========================================
    top  PC
    sub-cram
========================================= */
#sub-cram .inner {
  padding: 80px 0 160px;
}

#sub-learn .inner {
  padding: 80px 0 200px;
}

#sub-merit .inner {
  padding: 80px 0 200px;
}

#sub-voice .inner {
  padding-bottom: 100px;
}

#sub-voice-detail .inner {
  padding: 80px 0 160px;
}

/* =========================================
    top  PC
    sub-classroom
========================================= */
#sub-classroom-learn .inner {
  padding: 80px 0 160px;
}

/* =========================================
    top  PC
    sub-teacher
========================================= */
#btn-link .inner {
  padding: 100px 0 80px;
}

#sub-teacher .inner {
  padding-bottom: 155px;
}

#sub-movie .inner {
  padding: 100px 0 200px;
}

#sub-interview .inner {
  padding: 80px 0 100px;
}

/* =========================================
    top  PC
    sub-about
========================================= */
#sub-flow .inner {
  padding-bottom: 160px;
}

#sub-comics .inner {
  padding: 85px 0 160px;
}

#sub-about .inner {
  padding: 80px 0 100px;
}