@CHARSET "UTF-8";

/* ====================================== */
/* 基本BOX */
/* ====================================== */

    .box00{padding: 1.0em;}
.box00_bs{padding: 1.0em;  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);}
.tabbox00{padding: 0.2em 0.5em;border-radius: 999px;background-color: #009944;color: #FFF;text-align: center;}
.btn00 { display: inline-block; text-align: center; font-weight: bold;width: 100%; margin: auto; padding: 0.8em; border: 3px solid #FFFFFF; cursor: pointer; background-color: #F84D4D;color: #FFF;border-radius: 999px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);}



/* ====================================== */
/* タイトル */
/* ====================================== */

.ttl_bdb{
    display: block;
    font-size: 1.4em;
    width: fit-content;
    color: #374034;
    border-bottom: solid 3px #12903E;
    padding: 0 0.3em 0.3em;
    margin: auto;} 


/* ====================================== */
/* flexbox */
/* ====================================== */
.flexbox01{display:flex;justify-content:start;flex-wrap:wrap;width:100%;margin:0 auto}
.flexbox02{display:flex;text-align: center;align-items: flex-end;}

    .ai_c{align-items: center;}
    .jc_spbt{justify-content: space-between;}
    
/* ---------- sp(ベース) ---------- */
.flex-w-1-1  { flex: 0 0 100%;     max-width: 100%; } /*1/1*/
.flex-w-1-2  { flex: 0 0 50%;      max-width: 50%; } /*1/2*/
.flex-w-1-3  { flex: 0 0 33.3333%; max-width: 33.3333%; } /*1/3*/
.flex-w-2-3  { flex: 0 0 66.6666%; max-width: 66.6666%; } /*2/3*/
.flex-w-1-4  { flex: 0 0 25%;      max-width: 25%; } /*1/4*/
.flex-w-3-4  { flex: 0 0 75%;      max-width: 75%; } /*3/4*/
.flex-w-auto { flex: 0 0 auto;     max-width: none; } /*auto*/

/* ---------- pc(768px以上) ---------- */
@media (min-width: 768px) {
  .flex-pc-w-1-1  { flex: 0 0 100%;     max-width: 100%; }
  .flex-pc-w-1-2  { flex: 0 0 50%;      max-width: 50%; }
  .flex-pc-w-1-3  { flex: 0 0 33.3333%; max-width: 33.3333%; }
  .flex-pc-w-2-3  { flex: 0 0 66.6666%; max-width: 66.6666%; }
  .flex-pc-w-1-4  { flex: 0 0 25%;      max-width: 25%; }
  .flex-pc-w-3-4  { flex: 0 0 75%;      max-width: 75%; }
  .flex-pc-w-auto { flex: 0 0 auto;     max-width: none; }
}

/* ====================================== */
/* 重なりよう背景グラデ */
/* ====================================== */
    /*変数*/
    :root {
        --bg-color: #FFFFEE; /*基本の背景色*/
        --color-h01: #E8FFE2; /* 高校生の薄色 */
        --color-h02: #019f5e; /* 高校生の濃色 */
        --color-rbg01: #FEE6D8;/*赤色の薄色*/
}
    .bg_overlap_gra_h01-bg{
        background: linear-gradient(to bottom,var(--color-h01) 50%,var(--bg-color) 50%)        
    }
    .bg_overlap_gra_h02-bg{
        background: linear-gradient(to bottom,var(--color-h02) 50%,var(--bg-color) 50%)        
    }
    .bg_overlap_gra_bg-r01{
        background: linear-gradient(to bottom,var(--bg-color) 50%,var(--color-rbg01) 50%)        
    }
    .bg_overlap_gra_bg-h01{
        background: linear-gradient(to bottom,var(--bg-color) 50%,var(--color-h01) 50%)        
    }


/* ====================================== */
/* ドロップシャドウ */
/* ====================================== */

.boxsh{box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);}


/* ====================================== */
/* 枠線 */
/* ====================================== */
    
    .bd{border: 2px solid #009944;}
    .bdb{border-bottom: 2px solid #009944;}
    .bds_da{border-style: dashed;}
    .bdbs_da{border-bottom-style: dashed;}

    .bdw_3{border-width: 3px;}
.bdc_infant{border-color: #FF536F;}
.bdc_elem{border-color:#FC8328;}
.bdc_junior{border-color:#2A9BE6;}
.bdc_high{border-color:#019f5e;}
.bdc_kousotsu{border-color: #1134A9;}
.bdc_red{border-color: #F84D4D;}
.bdc_white{border-color: #FFF;}
.bdc_bl{border-color: #374034;}
    

/* ====================================== */
/* 角丸 */
/* ====================================== */

    .bdr_0{border-radius: 0px;}
    .bdr_10{border-radius: 10px;}
    .bdr_tab{border-radius: 15px 15px 0 0;}
    

/* ====================================== */
/* width */
/* ====================================== */

    .w_40{width: 40%;margin: auto;}
    .w_s{width: 95%;margin: auto;}
    .w_m{width: 95%;margin: auto;}
    .w_l{width: 95%;margin: auto;}
    .w_xl{width: 95%;margin: auto;}
    .w_xs_sp{width: 90%;margin: auto;}
    .w_fitc{width: fit-content;margin: auto;}
    
    /*PCサイズ*/
    @media only screen and (min-width:900px){
        .w_s{width: 720px;}
        .w_m{width: 760px;}
        .w_l{width: 800px;}
        .w_xl{width: 900px;}
        .w_xs_sp{width: 720px;}
    }

/* ====================================== */
/* margin*/
/* ====================================== */
 
.m_auto{margin: auto;}
.mt_1{margin-top: 1.0em;}
.mt_2{margin-top: 2.0em;}
.mt_4{margin-top: 4.0em;}
.mb_1{margin-bottom: 1.0em;}
.mlr_05{margin-right: 0.5em;margin-left: 0.5em;}
.mtb_05{margin: 0.5em auto;}
.mtb_1{margin: 1.0em auto;}
.mtb_2{margin: 2.0em auto;}

/* ====================================== */
/* padding */
/* ====================================== */

.p_03{padding: 0.3em;}
.p_05{padding: 0.5em;}
.p_08{padding: 0.8em;}
.p_1{padding: 1.0em;}
.p_051{padding: 0.5em 1.0em;}
.p_105{padding: 1.0em 0.5em;}

.pl_03{padding-left: 0.3em;}
.pl_05{padding-left: 0.5em;}
.plr_05{padding-left: 0.5em;padding-right: 0.5em;}
  

/* ====================================== */
/* 共通ユーティリティースタイル */
/* ====================================== */
.tx_c{
	/* 中央揃え */
	text-align:center;
}
.margin-top-2em{
	/* 上部マージン（会社情報などで使用） */
	margin-top:2.0em;
}
    /*フォントウェイトノーマル*/
.fw-n{font-weight: normal;}
    /*太字*/
.fw-b{font-weight: bold;}


/* ====================================== */
/* フォントサイズ */
/* ====================================== */

/*フォントサイズ大 pc:1.5 sp:1.3*/
.cttl01{font-size:1.3em;}
/*フォントサイズ中 pc:1.3 sp:1.15*/
.cttl02{font-size:1.15em;}
/*フォントサイズ小 pc:0.8 sp:0.8*/
.cttl03{font-size: 0.8em;}


/* ====================================== */
/* フォントカラー */
/* ====================================== */

    .c-white{color:#FFFFFF;}
.c-red{color:#F84D4D;}
.c-infant{color:#FF536F;}
.c-elem{color:#FC8328;}
.c-junior{color:#2A9BE6;}
.c-high{color:#019f5e;}
.c-kousotsu{color:#1134A9;}


/* -------------------------------------- */
/* 背景色/ヘッダー色 (講座ごと) */
/* -------------------------------------- */
.ebg01{	background-color:#FFF0DB;}
.ebg02{	background-color:#FC8328;}
.jbg01{	background-color:#DEF2F6;}
.jbg02{	background-color:#2A9BE6;}
.hbg01{	background-color:#E8FFE2;}
.hbg02{	background-color:#019f5e;}
.kbg01{	background-color:#ECF4FE;}
.kbg02{	background-color:#1134A9;}
.nbg01{	background-color:#4FB878;}
.rbg01{	background-color:#FEE6D8;}
.rbg02{	background-color:#F84D4D;}
.ibg02{background-color: #FF536F;}
.wbg02{background-color: #FFF;}
.ygbg01{background-color: #EBFFDF;}
.lgbg02{background-color: #4FB878}
.blbg02{background-color: #374034}
.bg01{background-color: #FFFFEE}/*基本の背景色*/
      
/* ====================================== */
/* 科目カラー */
/* ====================================== */

.jap_bg{background-color: #D16C15;}/* 国語 */
.ari_bg{background-color: #2D79C0;}/* 算数 */
.sci_bg{background-color: #009944;}/* 理科 */
.soc_bg{background-color: #6B1784;}/* 社会 */
.mat_bg{background-color: #4B62A9;}/* 数学 */
.eng_bg{background-color: #C6376D;}/* 英語 */
.phy_bg{background-color: #66B8ED;}/* 物理 */
.che_bg{background-color: #00994B;}/* 化学 */
.bio_bg{background-color: #BDD12B;}/* 生物 */
.geo_bg{background-color: #814A94;}/* 地歴 */
.civ_bg{background-color: #A66EA6;}/* 公民 */
.inf_bg{background-color: #21A397;}/* 情報 */


