@charset "UTF-8";

html,
body {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ ProN", apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Meiryo, sans-serif;
}

body {
    font-size: 16px;
    line-height: 1.5;
    color: #1a1a1a;
    background: #fff;
    /*背景画像*/
    background-image: url(../images/hero/hero_bg.jpg);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/*段落・フォント*/

p {
    font-size: 16px;
    line-height: 1.5;
    font-weight: 400;
    color: #1a1a1a;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ ProN", apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Meiryo, sans-serif;
}

.font-gothic {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ ProN", apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Meiryo, sans-serif;
}

.font-mincho,
#tca_sec6 strong {
    font-family: 'tegaki','Noto Serif JP', Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}

.font-roboto {
    font-family: 'Roboto Condensed', sans-serif;
}

@font-face {
    font-family: 'tegaki';
    src: url('../font/HOKKORI.otf') format('opentype');
}

/******************************************************************************
*
* [共通]基本設定
*
******************************************************************************/

/*---------------------
* コンテナ関係
---------------------*/

/*全体*/

article.content_article {
    padding: 50px 0;
}

article.content_article.none_pt {
    padding-top: 0;
}

article.content_article.none_pb {
    padding-bottom: 0;
}

/*内包*/

.wrap {
    width: 960px;
    box-sizing: border-box;
    margin: 0 auto;
}

.middle_wrap {
    width: 1400px;
    box-sizing: border-box;
    margin: 0 auto;
}

.full_wrap {
    width: 96%;
    width: -webkit-calc(100% - 100px);
    width: calc(100% - 100px);
    box-sizing: border-box;
    margin: 0 auto;
}

.wrap_w {
    background: #fff;
}

/*---------------------
* 背景
---------------------*/

/*ドット背景*/

.lp_bg_dot {
    background: #f1f1f1;
    background-image: radial-gradient(#e3e3e3 6%, transparent 12%),
        radial-gradient(#e3e3e3 6%, transparent 12%);
    background-position: 0 0, 11px 11px;
    background-size: 22px 22px;
}

/*ライン背景*/

.lp_bg_line {
    background: #000;
    background-image:
        linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0, transparent 1%, transparent 100%);
    background-size: 100px;
}

/*---------------------
* 見出し
---------------------*/

/*見出し(2)*/

.common_h2 {
    text-align: center;
    margin-bottom: 30px;
}

.common_h2 .sub {
    font-size: 16px;
    letter-spacing: 2px;
    color: #999;
}

.common_h2 h2 {
    font-size: 36px;
    font-weight: bold;
}

.common_h2.cw h2 {
    color: #fff;
}

/*見出し(3)*/

.common_h3 {
    width: 100%;
    min-height: 340px;
    box-sizing: border-box;
    position: relative;
    background-image: url(../images/banner_bg.jpg);
    background-size: cover;
    background-position: center;
    display: table;
}

.common_h3::before,
.common_h3::after,
.common_h3 h3::before,
.common_h3 h3::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    background: #fff;
    opacity: 0.2;
}

.common_h3::before {
    height: 2px;
    top: 5px;
}

.common_h3::after {
    height: 1px;
    top: 10px;
}

.common_h3 h3::before {
    height: 2px;
    bottom: 5px;
}

.common_h3 h3::after {
    height: 1px;
    bottom: 10px;
}

.common_h3 .banner_icon {
    position: absolute;
    top: 0;
    right: 20px;
    width: 40px;
}

.common_h3 h3 {
    font-family: 'Noto Sans JP', sans-serif;
    text-align: center;
    font-size: 40px;
    line-height: 1.7;
    color: #fff;
    font-weight: 900;
    width: 100%;
    box-sizing: border-box;
    padding: 30px 15px;
    display: table-cell;
    vertical-align: middle;
    filter: drop-shadow(0 0 8px rgba(0, 0, 0, 1));
    /*テキスト切り抜き*/
    background: -moz-linear-gradient(0% 50% 0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    background: -webkit-linear-gradient(0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0, rgba(231, 203, 117, 1)), color-stop(0.2113, rgba(236, 213, 148, 1)), color-stop(0.3793, rgba(240, 209, 98, 1)), color-stop(0.6771, rgba(252, 241, 204, 1)), color-stop(0.9985, rgba(230, 197, 93, 1)));
    background: -o-linear-gradient(0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    background: -ms-linear-gradient(0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#E7CB75', endColorstr='#E6C55D' ,GradientType=0)";
    background: linear-gradient(90deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E7CB75', endColorstr='#E6C55D', GradientType=1);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/*---------------------
* テキスト関係
---------------------*/

/*一般*/

small {
    font-size: 80%;
}

strong {
    font-weight: 900;
    font-size: 115%;
}

/*文字サイズ*/

.fsb {
    font-size: 150% !important;
}

.fsb_l {
    font-size: 160%;
}

/*カラー*/

.tc1 {
    color: #980000;
}

.tc2 {
    color: #0065ad;
}

.tc3 {
    color: #ce9b2f;
}

.tc4 {
    color: #6e3a87;
}

.tc5 {
    color: #e1003a;
}

.tm3 {
    background: linear-gradient(transparent 60%, #ffeab0 60%);
}

/*改行(SP時のみ改行)*/

.brSp {
    display: none;
}

/*---------------------
* 余白調整
---------------------*/

/*縦*/

.lp_m {
    margin: 50px 0;
}

.lp_m_auto {
    margin: 50px auto;
}

/*横*/

.lp_p {
    padding: 0 50px;
}

/*上のみ*/

.lp_mt {
    margin-top: 50px;
}

.lp_pt {
    padding-top: 50px;
}

/*下のみ*/

.lp_mb {
    margin-bottom: 50px;
}

.lp_pb {
    padding-bottom: 50px;
}

/*---------------------
* 画像関係
---------------------*/

.lp_img img {
    display: block;
}

/*テキスト右に配置*/

img.fr {
    display: block;
    float: right;
    max-width: 300px;
    margin-left: 15px;
    margin-bottom: 15px;
}

/*画像補足情報*/

figure figcaption {
    text-align: right;
    font-size: 11px;
    line-height: 2;
    color: #666;
}

/*---------------------
* 2カラム
---------------------*/

.lp2c {
    display: flex;
    justify-content: space-between;
}

.lp2c > div {
    width: 48%;
}

/*左右の入れ替え*/

.lp2c.lp2c_r {
    flex-flow: row-reverse;
}

/*---------------------
* 動画(埋め込み用)
---------------------*/

.mov {
    width: 100%;
    height: auto;
    position: relative;
}

.mov::before {
    content: "";
    display: block;
    padding-top: 56.2%;
}

.mov iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/******************************************************************************
*
* [共通]ヘッダー
*
******************************************************************************/

/*---------------------
* トップスライダー
---------------------*/

/*スライダー*/

.hero_area .top_slide {
    padding: 14px 0;
    /*背景*/
    background: -moz-linear-gradient(0% 50% 0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    background: -webkit-linear-gradient(0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0, rgba(231, 203, 117, 1)), color-stop(0.2113, rgba(236, 213, 148, 1)), color-stop(0.3793, rgba(240, 209, 98, 1)), color-stop(0.6771, rgba(252, 241, 204, 1)), color-stop(0.9985, rgba(230, 197, 93, 1)));
    background: -o-linear-gradient(0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    background: -ms-linear-gradient(0deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#E7CB75', endColorstr='#E6C55D' ,GradientType=0)";
    background: linear-gradient(90deg, rgba(231, 203, 117, 1) 0%, rgba(236, 213, 148, 1) 21.13%, rgba(240, 209, 98, 1) 37.93%, rgba(252, 241, 204, 1) 67.71%, rgba(230, 197, 93, 1) 99.85%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E7CB75', endColorstr='#E6C55D', GradientType=1);
}

.hero_area .top_slide .slider li {
    box-sizing: border-box;
    padding: 0 5px;
}

/*---------------------
* メイン
---------------------*/

/*背景*/

.hero_area .ha_main {
    background-image: url(../images/hero/hero_bg.jpg);
    background-size: cover;
    background-position: center;
    position: relative;
    padding: 50px 0 0;
    z-index: 10;
}

.hero_area .ha_sp_p0 {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 10;
}

.hero_area .ha_sp_p0::before {
    content: "";
    display: block;
    padding-top: 24.2%;
    background-image: url(../images/hero/hero_bg_p0.jpg);
    background-size: cover;
}

/*スクロールアイコン*/

.hero_area .ha_main .ha_scroll_icon {
    width: 15px;
    position: absolute;
    bottom: 15px;
    right: 15px;
}

/*テキスト*/

.hero_area .ha_main .ha_t1 {
    width: 50%;
    margin: 0 auto 20px;
}

.hero_area .ha_main .ha_t2 {
    width: 80%;
    margin: 0 auto 50px;
}
@media only screen and (max-width: 644px) {
    .hero_area .ha_main .ha_t2 {
        margin: 0 auto;
    }
}
.hero_area .ha_main .ha_title {
    width: 85%;
    margin: 0 auto 20px;
    position: relative;
}

/*LINE*/

.line_ss {
    background: #111;
    padding: 30px;
    position: relative;
    z-index: 10;
}

.line_ss .line_ss_slide li {
    box-sizing: border-box;
    padding: 0 10px;
}

.line_ss .line_ss_slide li img {
    border-radius: 7px;
}

.line_ss .wrap {
    position: relative;
}

.line_ss .wrap::before,
.line_ss .wrap::after {
    content: "";
    display: block;
    width: 50px;
    height: 100%;
    position: absolute;
    top: 0;
}

.line_ss .wrap::before {
    right: 0;
    background: -moz-linear-gradient(0% 50% 0deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0, rgba(26, 26, 26, 0)), color-stop(1, rgba(17, 17, 17, 1)));
    background: -o-linear-gradient(0deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    background: -ms-linear-gradient(0deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1A1A1A', endColorstr='#111111' ,GradientType=0)";
    background: linear-gradient(90deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1A1A1A', endColorstr='#111111', GradientType=1);
    z-index: 9;
}

.line_ss .wrap::after {
    left: 0;
    background: -moz-linear-gradient(100% 50% 180deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    background: -webkit-gradient(linear, 100% 50%, 0% 50%, color-stop(0, rgba(26, 26, 26, 0)), color-stop(1, rgba(17, 17, 17, 1)));
    background: -o-linear-gradient(180deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    background: -ms-linear-gradient(180deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1A1A1A', endColorstr='#111111' ,GradientType=0)";
    background: linear-gradient(-90deg, rgba(26, 26, 26, 0) 0%, rgba(17, 17, 17, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#111111', endColorstr='#1A1A1A', GradientType=1);
}

/******************************************************************************
*
* [共通]CTA
*
******************************************************************************/

.cta {
    position: relative;
    z-index: 10;
}

/*共通*/

.cta .cta_main {
    padding: 50px 0 0;
    position: relative;
    background-image: url(../images/cta/cta_bg.jpg);
    background-size: cover;
}

.cta .cta_main::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.4);
    position: absolute;
    top: 0;
    left: 0;
}

.cta .cta_main .wrap {
    position: relative;
}

/*ボタン*/

.cta_btn {
    text-align: center;
}

.cta_btn a {
    display: inline-block;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    padding: 15px 60px;
    border-radius: 50px;
    position: relative;
    filter: drop-shadow(0 4px 0 #07562f);
    /*背景*/
    background: -moz-linear-gradient(0% 50% 0deg, rgba(140, 198, 63, 1) 0%, rgba(0, 169, 157, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(140, 198, 63, 1) 0%, rgba(0, 169, 157, 1) 100%);
    background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0, rgba(140, 198, 63, 1)), color-stop(1, rgba(0, 169, 157, 1)));
    background: -o-linear-gradient(0deg, rgba(140, 198, 63, 1) 0%, rgba(0, 169, 157, 1) 100%);
    background: -ms-linear-gradient(0deg, rgba(140, 198, 63, 1) 0%, rgba(0, 169, 157, 1) 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#8CC63F', endColorstr='#00A99D' ,GradientType=0)";
    background: linear-gradient(90deg, rgba(140, 198, 63, 1) 0%, rgba(0, 169, 157, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8CC63F', endColorstr='#00A99D', GradientType=1);
}

.cta_btn a .txt {
    position: relative;
    z-index: 2;
}

.cta_btn a .cta_btn_finger {
    display: block;
    width: 50px;
    position: absolute;
    top: 20px;
    right: -10px;
    z-index: 2;
}

.cta_btn a:hover {
    filter: none;
    top: 4px;
    background: -moz-linear-gradient(100% 50% 180deg, rgba(174, 121, 0, 1) 0%, rgba(251, 198, 0, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(174, 121, 0, 1) 0%, rgba(251, 198, 0, 1) 100%);
    background: -webkit-gradient(linear, 100% 50%, 0% 50%, color-stop(0, rgba(174, 121, 0, 1)), color-stop(1, rgba(251, 198, 0, 1)));
    background: -o-linear-gradient(180deg, rgba(174, 121, 0, 1) 0%, rgba(251, 198, 0, 1) 100%);
    background: -ms-linear-gradient(180deg, rgba(174, 121, 0, 1) 0%, rgba(251, 198, 0, 1) 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#AE7900', endColorstr='#FBC600' ,GradientType=0)";
    background: linear-gradient(-90deg, rgba(174, 121, 0, 1) 0%, rgba(251, 198, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FBC600', endColorstr='#AE7900', GradientType=1);
}

.cta_btn .cta_btn_line {
    width: 1px;
    height: 50px;
    margin: auto;
    background: #07562f;
}

/*V1*/

.cta .cta_main .cta_title.cta_title1 {
    width: 70%;
    margin: 0 auto 30px;
}

/*V2*/

.cta .cta_main .cta_title.cta_title2 {
    width: 80%;
    margin: 0 auto 30px;
}

.cta .cta_main .cta_arrow {
    width: 300px;
    margin: 0 auto 40px;
}

/*各挿入CTAの調整*/

.addtc_btn {
    box-sizing: border-box;
}

.addtc_btn .ab_arrow {
    width: 50%;
    margin: 30px auto 40px;
}

.addtc_btn.aba1 {
    padding: 0 15px 50px;
    background: #e6e6e6;
}

.addtc_btn.aba1 .ab_arrow {
    margin: 0 auto 40px;
}

.addtc_btn.aba2 {
    margin-bottom: 50px;
}

.addtc_btn.aba2 .ab_arrow {
    margin-top: 0;
}

.addtc_btn.aba3 {
    padding: 0 15px 50px;
    background: #e1f1f0;
}

.addtc_btn.aba3 .ab_arrow {
    margin: 0 auto 40px;
}

.addtc_btn.aba4 {
    padding-bottom: 50px;
}

.addtc_btn.aba2 .ab_arrow {
    margin-top: 0;
}


/******************************************************************************
*
* [共通]全幅コンテンツ
*
******************************************************************************/

/*---------------------
* 講座風景
---------------------*/

#landscape {
    background-image: url(../images/top/mov_bg.jpg);
    background-size: cover;
    background-position: center;
}

#landscape .landscape_aside_img {
    width: 70%;
    margin: 30px auto;
}

/*動画*/

#landscape .mov {
    border-radius: 8px;
    overflow: hidden;
    filter: drop-shadow(6px 6px 10px rgba(0, 0, 0, 0.5));
}

/*ボタン*/

.cta_btn.mov_area_btn {
    margin: 30px 0 60px;
}

/*ギャラリー*/

#landscape .landscape_gallery {
    margin-top: 30px;
}

#landscape .landscape_gallery ul {
    display: flex;
    flex-wrap: wrap;
}

#landscape .landscape_gallery ul li {
    width: 24%;
    margin-bottom: 30px;
    margin-right: 1.3%;
    border-radius: 5px;
    overflow: hidden;
    filter: drop-shadow(6px 6px 10px rgba(0, 0, 0, 0.5));
}

#landscape .landscape_gallery ul li:nth-child(4n) {
    margin-right: 0;
}

#landscape .landscape_gallery ul li:nth-child(n+5) {
    margin-bottom: 0;
}

#landscape .landscape_gallery ul li img {
    display: block;
}

/*---------------------
* 悩み
---------------------*/

#trouble {
    width: 100%;
    height: auto;
    position: relative;
}

#trouble::before {
    content: "";
    display: block;
    padding-top: 61.1%;
}

#trouble .trouble_inner {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/top/trouble_bg.jpg);
    background-size: cover;
    background-position: center;
}

/*---------------------
* 講座の感想
---------------------*/

#impressions2 {
    background-image: url(../images/top/uv_bg2.jpg);
    background-size: cover;
    position: relative;
    overflow: hidden;
}

#impressions2::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: radial-gradient(#ffffff 6%, transparent 12%),
        radial-gradient(#ffffff 6%, transparent 12%);
    background-position: 0 0, 5px 5px;
    background-size: 10px 10px;
    opacity: 0.6;
    z-index: 2;
}

#impressions2::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.5);
    z-index: 1;
}

#impressions2 .wrap {
    position: relative;
    z-index: 3;
}

#impressions2 .common_h2 .sub {
    color: #fff;
}

#impressions2 .user_voice_list {
    display: flex;
    justify-content: space-between;
}

#impressions2 .user_voice_list ul {
    width: 32%;
}

#impressions2 .user_voice_list ul li {
    margin-bottom: 25px;
}

#impressions2 .user_voice_list ul li:last-child {
    margin-bottom: 0;
}

#impressions2 .user_voice_list ul li img {
    display: block;
    filter: drop-shadow(6px 6px 10px rgba(0, 0, 0, 0.3));
}

#impressions2 .uv_img4 {
    width: 75%;
    margin: auto;
}

/*---------------------
* プロフィール
---------------------*/

#profile {
    background: #f5f2eb;
    background: #fff;
}

#profile .profile_title {
    margin-bottom: 50px;
    text-align: center;
}

#profile .profile_title h2 {
    font-size: 60px;
    line-height: 1.5;
    letter-spacing: .1em;
    font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    font-weight: 900;
}

#profile .profile_title .sub {
    letter-spacing: .1em;
    font-size: 20px;
}

/*コンテナ*/

#profile .profile_box dl {
    margin-top: 50px;
}

#profile .profile_box dl dt.title {
    font-size: 24px;
    font-weight: bold;
    padding: 10px 0 10px 15px;
    border-left: solid 10px #e53c21;
    margin-bottom: 30px;
}

#profile .profile_box dl dd {
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: .1em;
}

#profile .profile_box dl dd img {
    display: block;
    width: 100%;
}

/******************************************************************************
*
* [共通]テキストコンテンツ
*
******************************************************************************/

#add_tc1 {
    position: relative;
    margin-bottom: 30px;
}

#add_tc1::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0 25px;
    border-color: #e5e6e5 transparent transparent transparent;
    position: absolute;
    bottom: -24px;
    left: 0;
    right: 0;
    margin: auto;
}

/*---------------------
* セクションの基本設定
---------------------*/

/*セクション内の段落*/

article.content_article.text_ca section.ca_sec > p {
    padding: 50px;
    font-size: 20px;
}

/*strong*/

article.content_article.text_ca strong {
    font-weight: 900;
    font-size: 118%;
    font-family: 'Noto Sans JP', sans-serif;
}

/*---------------------
* 文字・画像サイズ調整
---------------------*/

.tuv_box {
    padding: 30px;
    background: #e1f1f0;
}

.tuv_box .tc2_6 {
    filter: drop-shadow(5px 5px 7px rgba(0, 0, 0, 0.2));
}

.tuv_box .tc2_7 {
    width: 70%;
}

.tc2_8 {
    width: 150px;
}

#tca_sec2 {
    overflow: hidden;
}

#tca_sec6 .name {
    width: 250px;
    margin-left: auto;
}

/*文字の余白調整*/

p.ts1_p {
    padding-bottom: 0 !important;
}

/*---------------------
* 表
---------------------*/

.s13_table table {
    width: 100%;
    box-sizing: border-box;
}

.s13_table table th,
.s13_table table td {
    width: 20%;
    box-sizing: border-box;
    padding: 15px 10px;
    border: solid 2px #fff;
    text-align: center;
    vertical-align: middle;
}

.s13_table table thead th {
    background: #333;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
}

.s13_table table thead th.none {
    background: #fff;
}

.s13_table table thead th.highlight {
    background: #c6b50b;
}

.s13_table table tbody th {
    background: #980000;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
}

.s13_table table tbody th span {
    display: inline-block;
    background: #fff;
    color: #980000;
    font-size: 15px;
    padding: 0 7px;
    border-radius: 3px;
}

.s13_table table tbody td {
    background: #f1f1f1;
    font-size: 20px;
    font-weight: bold;
}

.s13_table table tbody td.highlight {
    background: #f8eea7;
    color: #980000;
}

/*---------------------
* 特典
---------------------*/

#sec16-lead {
    background: #980000;
    padding: 15px 0 20px;
    position: relative;
}

#sec16-lead::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 25px 0 25px;
    border-color: #980000 transparent transparent transparent;
    position: absolute;
    bottom: -19px;
    left: 0;
    right: 0;
    margin: auto;
}

#sec16-lead .s16_0 {
    width: 50%;
    margin: auto;
}

/*sec16*/

#sec16 {
    background-image: url(../images/sec/s9_bg.jpg);
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

#sec16 .s16_1 {
    margin-bottom: 30px;
}

#sec16 .s16_3 img {
    width: 50%;
    margin: 25px auto 40px;
}

#sec16 p {
    color: #386069;
    text-align: center;
    font-weight: bold;
    margin-top: 30px;
}

/*---------------------
* 未来・ベネフィット
---------------------*/

#sec17 {
    background-image: url(../images/sec/s17_bg.jpg);
    background-size: contain;
    position: relative;
    overflow: hidden;
}

#sec17::before {
    content: "";
    display: block;
    width: 100%;
    height: 500px;
    position: absolute;
    bottom: 0;
    left: 0;
    /*背景*/
    background: -moz-linear-gradient(50% 100% 90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
    background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
    background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.9991, rgba(0, 0, 0, 0)));
    background: -o-linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
    background: -ms-linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000' ,GradientType=0)";
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
}

#sec17 .wrap {
    position: relative;
}

#sec17 .s17_1 {
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.8));
}

#sec17 .s17_2 {
    width: 70%;
    margin: 0 auto;
    position: relative;
}

#sec17 .s17_4 {
    width: 80%;
    margin: auto;
    position: relative;
    margin-top: 50px;
}

/*---------------------
* FAQ
---------------------*/

#sec20 {
    background: #fff;
}

.qa-list dl {
    position: relative;
    margin: 30px 0 0;
    cursor: pointer;
    border: 1px solid #DDD;
    border-radius: 10px;
    overflow: hidden;
}

.qa-list dl:first-child {
    margin-top: 0;
}

.qa-list dl::after {
    position: absolute;
    top: 27px;
    right: 26px;
    display: block;
    width: 7px;
    height: 7px;
    margin: auto;
    content: '';
    transform: rotate(135deg);
    border-top: 2px solid #000;
    border-right: 2px solid #000;
}

.qa-list .open::after {
    transform: rotate(-45deg);
}

.qa-list dl dt {
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 60px;
    font-weight: bold;
    background: #ddd;
}

.qa-list dl dt::before {
    font-size: 22px;
    line-height: 1;
    position: absolute;
    top: 20px;
    left: 20px;
    display: block;
    content: 'Q.';
    color: #3285bf;
}

.qa-list dl dd::before {
    font-size: 22px;
    line-height: 1;
    position: absolute;
    left: 20px;
    display: block;
    content: 'A.';
    font-weight: bold;
    color: #3285bf;
}

.qa-list dl dd {
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 60px;
}

.qa-list dl dd p {
    margin: 30px 0 0;
}

.qa-list dl dd p:first-child {
    margin-top: 0;
}

/******************************************************************************
*
* [共通]フッター
*
******************************************************************************/

/*フッター*/

footer {
    background: #000;
    padding: 30px 0;
    text-align: center;
    position: relative;
    z-index: 10;
}

footer .foot_inner {
    width: 98%;
    width: -webkit-calc(100% - 50px);
    width: calc(100% - 50px);
    margin: 0 auto;
}

footer p.copy {
    color: #eee;
    font-size: 16px;
    font-weight: 300;
    line-height: 2.5;
}

footer p.copy a.tokushoho {
    font-size: 18px;
    text-decoration: none;
    color: #eee;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
}

footer p.copy a.tokushoho:hover {
    opacity: 0.7;
}


/******************************************************************************
*
* [共通]レスポンシブ対応
*
******************************************************************************/

/*1920px以下*/

@media only screen and (max-width: 1920px) {

    /*---------------------
    * 悩み
    ---------------------*/

    #trouble::before {
        padding-top: 1174px;
    }

}

/*1400px以下*/

@media only screen and (max-width: 1400px) {

    /*---------------------
    * [共通]基本設定
    ---------------------*/

    .full_wrap,
    .middle_wrap {
        width: 92%;
    }

}

/*960px以下*/

@media only screen and (max-width: 960px) {

    /*---------------------
    * [共通]基本設定
    ---------------------*/

    .wrap {
        width: 92%;
    }

}

/*644px以下*/

@media only screen and (max-width: 644px) {

    /*---------------------
    * [共通]背景/全体テキスト
    ---------------------*/

    body {
        background: none;
        font-size: 15px;
        line-height: 1.6;
    }

    body::after {
        content: "";
        display: block;
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        background-image: url(../images/hero/hero_bg.jpg);
        background-size: cover;
        background-position: center;
        z-index: -1;
    }

    p {
        font-size: 15px;
    }

    .fsb {
        font-size: 120% !important;
    }

    /*---------------------
    * [共通]基本設定
    ---------------------*/

    /*コンテナ関係*/

    article.content_article {
        padding: 30px 0;
    }

    /*背景*/

    .lp_bg_dot {
        background-position: 0 0, 9px 9px;
        background-size: 18px 18px;
    }

    .lp_bg_line {
        background-image:
            background-size: 80px;
    }

    /*見出し(2)*/

    .common_h2 .sub {
        font-size: 12px;
        margin-bottom: 10px;
    }

    .common_h2 h2 {
        font-size: 6.9vw;
        line-height: 1.4;
    }

    /*見出し(3)*/

    .common_h3 {
        height: auto;
        min-height: 180px;
    }

    .common_h3 h3 {
        font-size: 4.43vw;
        letter-spacing: -0.4px;
        line-height: 1.7;
        padding: 40px 10px;
    }

    .common_h3 .banner_icon {
        right: 5px;
        width: 25px;
    }

    /*テキスト関係*/

    .brRes {
        display: none;
    }

    .brSp {
        display: block;
    }

    /*余白調整*/

    .lp_m {
        margin: 30px 0;
    }

    .lp_m_auto {
        margin: 30px auto;
    }

    .lp_p {
        padding: 0 16px;
    }

    .lp_mt {
        margin-top: 30px;
    }

    .lp_pt {
        padding-top: 30px;
    }

    .lp_mb {
        margin-bottom: 30px;
    }

    .lp_pb {
        padding-bottom: 30px;
    }

    /*画像関係*/

    img.fr {
        max-width: 120px;
        margin-left: 10px;
        margin-bottom: 10px;
    }

    figure figcaption {
        text-align: left;
        font-size: 10px;
        line-height: 1.5;
        margin-top: 5px;
    }

    /*2カラム共通*/

    .lp2c {
        display: block;
    }

    .lp2c > div {
        width: 100%;
    }

    .lp2c > div:last-child {
        margin-top: 30px;
    }

    /*---------------------
    * ヒーローエリア
    ---------------------*/

    /*スライダー*/

    .hero_area .top_slide {
        padding: 0;
        background: #000;
    }

    .hero_area .top_slide .wrap {
        width: 100%;
    }

    .hero_area .top_slide .slider li {
        padding: 0 3px;
    }

    /*背景*/

    .hero_area .ha_main {
        padding: 30px 0 0;
        overflow: hidden;
    }

    .hero_area .ha_sp_p0 {
        display: none;
    }

    .hero_area .ha_sp_p3 {
        width: 100%;
        height: auto;
        position: relative;
    }

    .hero_area .ha_sp_p3::before {
        content: "";
        display: block;
        padding-top: 38.5%;
        background-image: url(../images/hero/hero_bg_p3.jpg);
        background-size: cover;
    }

    /*スクロールアイコン*/

    .hero_area .ha_main .ha_scroll_icon {
        width: 0;
        height: 0;
        overflow: hidden;
        opacity: 0;
    }

    /*テキスト*/

    .hero_area .ha_main .ha_t1 {
        width: 75%;
        margin: 0 auto 20px;
    }

    .hero_area .ha_main .ha_title {
        width: 90%;
        margin: 0 auto 20px;
    }

    .hero_area .ha_main .ha_title .hero_free {
        right: -10%;
    }

    /*LINE*/

    .line_ss {
        padding: 15px 0;
    }

    .line_ss .line_ss_slide li {
        padding: 0 7px;
    }

    .line_ss .line_ss_slide li img {
        border-radius: 5px;
    }

    .line_ss .wrap::before,
    .line_ss .wrap::after {
        width: 20px;
    }

    /*---------------------
    * [共通]CTA
    ---------------------*/

    /*メイン共通*/

    .cta .cta_main {
        padding: 50px 0 0;
        background-image: url(../images/cta/cta_bg.jpg);
        overflow: hidden;
    }

    .cta .cta_main::before {
        background: rgba(255, 255, 255, 0.55);
    }

    /*V1*/

    .cta .cta_main .cta_title.cta_title1 {
        width: 100%;
        margin: 0 auto 30px;
    }

    /*V2*/

    .cta .cta_main .cta_title.cta_title2 {
        width: 100%;
        margin: 0 auto 20px;
    }

    .cta .cta_main .cta_arrow {
        width: 260px;
        margin: 0 auto 30px;
    }

    /*ボタン*/

    .cta_btn a {
        font-size: 24px;
        padding: 15px 50px;
    }

    .cta_btn a .cta_btn_finger {
        width: 45px;
        top: 20px;
        right: -5px;
    }

    .cta_btn .cta_btn_line {
        height: 35px;
    }

    /*各挿入CTAの調整*/

    .addtc_btn .ab_arrow {
        width: 80%;
        margin: 20px auto 20px;
    }

    .addtc_btn .cta_btn a {
        width: 90%;
        font-size: 23px;
        letter-spacing: -0.01em;
        padding: 15px 0;
    }

    .addtc_btn .cta_btn a .cta_btn_finger {
        width: 40px;
        top: 22px;
        right: -8px;
    }

    .addtc_btn.aba1 {
        padding: 0 0 30px;
    }

    .addtc_btn.aba1 .ab_arrow {
        margin: 0 auto 30px;
    }

    .addtc_btn.aba2 {
        margin-bottom: 30px;
    }

    .addtc_btn.aba3 {
        padding: 0 0 30px;
    }

    .addtc_btn.aba3 .ab_arrow {
        margin: 0 auto 30px;
    }

    .addtc_btn.aba4 {
        padding-bottom: 30px;
    }

    /*---------------------
    * 講座風景
    ---------------------*/

    #landscape {
        overflow: hidden;
    }

    .cta_btn.mov_area_btn {
        margin: 30px 0 40px;
    }


    #landscape .landscape_aside_img {
        width: 70%;
        margin: 30px auto;
    }

    /*ギャラリー*/

    #landscape .landscape_gallery ul li {
        width: 48%;
        margin-bottom: 15px;
        margin-right: 4%;
    }

    #landscape .landscape_gallery ul li:nth-child(2n) {
        margin-right: 0;
    }

    #landscape .landscape_gallery ul li:nth-child(4n) {
        margin-right: 0;
    }

    #landscape .landscape_gallery ul li:nth-child(n+5) {
        margin-bottom: 15px;
    }

    #landscape .landscape_gallery ul li:nth-child(n+7) {
        margin-bottom: 0;
    }

    /*---------------------
    * 悩み
    ---------------------*/

    #trouble::before {
        padding-top: 115%;
    }

    /*---------------------
    * 講座の感想
    ---------------------*/

    #impressions2 {
        background-image: url(../images/top/uv_bg2.jpg);
    }

    #impressions2 .user_voice_list {
        display: block;
    }

    #impressions2 .user_voice_list ul {
        width: 100%;
    }

    #impressions2 .user_voice_list ul li {
        margin-bottom: 25px;
    }

    #impressions2 .user_voice_list ul li:last-child {
        margin-bottom: 25px;
    }

    #impressions2 .uv_img4 {
        width: 100%;
    }

    /*---------------------
    *  プロフィール
    ---------------------*/

    #profile .profile_title {
        margin-bottom: 30px;
    }

    #profile .profile_title h2 {
        font-size: 13vw;
    }

    #profile .profile_title .sub {
        font-size: 12px;
    }

    /*コンテナ*/

    #profile .profile_box dl {
        margin-top: 30px;
    }

    #profile .profile_box dl dt.title {
        font-size: 22px;
        margin-bottom: 15px;
    }

    /*---------------------
    * テキストコンテンツ
    ---------------------*/

    /*コンテナ*/

    article.content_article.text_ca {
        padding: 30px 0;
    }

    article.content_article.text_ca section.ca_sec {
        /*overflow: hidden;*/
    }

    article.content_article.text_ca section.ca_sec > p {
        padding: 30px 16px;
        font-size: 16px;
    }

    /*1*/

    #add_tc1 {
        margin-bottom: 10px;
    }

    #add_tc1::before {
        bottom: -19px;
        border-width: 20px 20px 0 20px;
    }

    /*strong*/

    article.content_article.text_ca strong {
        font-size: 100%;
    }

    /*画像サイズ*/

    .tuv_box {
        padding: 15px;
    }

    .tuv_box .tc2_7 {
        width: 100%;
    }

    .tc2_8 {
        width: 90px;
    }

    #tca_sec6 .name {
        width: 150px;
    }

    /*---------------------
    * 表
    ---------------------*/

    .s13_table table th,
    .s13_table table td {
        padding: 10px 5px;
        border: solid 1px #fff;
    }

    .s13_table table thead th {
        font-size: 12px;
    }

    .s13_table table tbody th {
        font-size: 12px;
    }

    .s13_table table tbody th span {
        font-size: 12px;
        padding: 0 5px;
        margin-top: 3px;
    }

    .s13_table table tbody td {
        font-size: 14px;
    }

    /*---------------------
    * 特典
    ---------------------*/

    #sec16 .s16_3 img {
        width: 80%;
        margin: 15px auto 30px;
    }

    #sec16 p {
        text-align: left;
        font-size: 14px;
    }

    #sec16-lead .s16_0 {
        width: 100%;
    }

    /*---------------------
    * 未来・ベネフィット
    ---------------------*/

    #sec17 {
        padding: 30px 0;
    }

    #sec17 .wrap {
        z-index: 3;
    }

    #sec17::before {
        height: 150px;
    }

    #sec17::after {
        content: "";
        display: block;
        width: 100%;
        height: 150px;
        position: absolute;
        top: 0;
        left: 0;
        /*背景*/
        background: -moz-linear-gradient(50% 100% 90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
        background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
        background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.9991, rgba(0, 0, 0, 0)));
        background: -o-linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
        background: -ms-linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000' ,GradientType=0)";
        background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 99.91%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
        z-index: 2;
        transform: rotate(180deg)
    }


    #sec17 .s17_2 {
        width: 100%;
    }

    #sec17 .s17_4 {
        width: 100%;
        margin-top: 20px;
    }

    /*---------------------
    * FAQ
    ---------------------*/

    .qa-list dl {
        margin: 10px 0 0;
    }

    .qa-list dl:after {
        top: 20px;
        right: 15px;
        width: 7px;
        height: 7px;
        opacity: 0.2;
    }

    .qa-list dl dt {
        padding: 16px 32px 16px 45px;
        font-size: 14px;
    }

    .qa-list dl dt::before {
        font-size: 14px;
        top: 20px;
        left: 20px;
    }

    .qa-list dl dd::before {
        font-size: 14px;
        left: 20px;
        margin-top: 5px;
    }

    .qa-list dl dd {
        margin: 0;
        padding: 16px 16px 16px 45px;
        font-size: 14px;
    }

    .qa-list dl dd p {
        margin: 30px 0 0;
    }

    .qa-list dl dd p:first-child {
        margin-top: 0;
    }

    /*---------------------
    * [共通]フッター
    ---------------------*/

    /*フッター*/

    footer .foot_inner {
        width: 95%;
        width: -webkit-calc(95%);
        width: calc(95%);
    }

    footer p.copy {
        font-size: 16px;
        line-height: 1.5;
    }

}

/*375px以下*/

@media only screen and (max-width: 375px) {}

/*360px以下*/

@media only screen and (max-width: 360px) {
    /*ボタン*/

    .cta_btn a {
        font-size: 22px;
        padding: 15px 50px;
    }

}

/*330px以下*/

@media only screen and (max-width: 330px) {
    /*ボタン*/

    .cta_btn a {
        font-size: 19px;
        padding: 15px 45px;
    }

}
