/**********************************************************


SMARTPHONE & TABLET


***********************************************************/
@media screen and (max-width: 768px) {
  
  .section_inner{
    padding: 10px 0;
  }
  /* #q_kobetsu,
  #super_kids{
    margin-top: -55px;
    padding-top: 55px;
  } */
  /*--class_list--*/
  .class_list{
    display: block;
    margin: 0 auto 40px;
    border-top: none;
  }
  .class_list li{
    width: 100%;
    display: block;
    /* border-top: 4px solid #6e1f19; */
  }
  /* .class_list li img{
    height: 50px;
  } */
  /* main_ttl */
  .main_ttl{
    display: block;
  }
  .main_ttl h2{
    margin: 0 0 10px;
    padding: 0 0 10px;
    position: relative;
  }
  .main_ttl h2 img{
    width: auto;
    height: 40px;
  }
  .main_ttl .sub_img{
    display: block;
  }
  .main_ttl .sub_img img{
    display: inline-block;
    margin: 0 0 10px;
  }
  /* lead common */
  .lead_txt{
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.05em;
  }
  
  /* ttl_point common */
  .ttl_point span{
    padding: 8px 10px;
    font-size: 16px;
    text-align: left;
    line-height: 1.4;
    letter-spacing: 0.1em;
  }
  .ttl_point.point_img {
    padding: 0 0 0 22px;
  }
  .ttl_point.point_img span{
    padding: 10px 0 10px 25px;
  }
  .ttl_point.point_img img{
    width: 45px;
  }
  
  /* button_big common */
  .button_big{
    font-size: 15px;
  }
  .button_big:hover{
  }
  .button_big:after{
    vertical-align: middle;
  }
  /*--------------------------------------------

  KOBETSU

  ----------------------------------------------*/
  #q_kobetsu {
    margin-bottom: 50px;
  }
  #q_kobetsu .main_ttl .sub_img{
    display: grid;
    grid-template-columns: auto 1fr;
  }
  #q_kobetsu .main_ttl .sub_img img:nth-child(3){
    grid-area: 2 / 1 / 3 / 3;
  }
  /* box_point01
  ----------------------------------------------*/
  #q_kobetsu .box_point01 .ttl_point{
    margin-bottom: 15px;
  }
  #q_kobetsu .box_point01 .img_area_01{
    margin: 15px auto 20px;
  }
  #q_kobetsu .box_point01 .img_area_02{
    margin: 15px 0 55px;
  }
  /* box_point02
  ----------------------------------------------*/
  #q_kobetsu .box_point02 .ttl_point{
    margin: 0 0 15px;
  }
  /*-- item_area --*/
  #q_kobetsu .box_point02 .item_ttl{
    padding: 0px 10px;
    font-size: 17px;
    border-width: 10px;
    line-height: 1.3;

  }
  
  /* shidou */
  #q_kobetsu .box_point02 .item_area.shidou dl,
  #q_kobetsu .box_point02 .item_area.shidou dt,
  #q_kobetsu .box_point02 .item_area.shidou dd{
    display: block;
  }
  #q_kobetsu .box_point02 .item_area.shidou dt{
    padding: 2px 5px;
    width: 100%;
    font-size: 15px;
    font-weight: normal;
  }
  #q_kobetsu .box_point02 .item_area.shidou dd{
    padding: 5px 5px 0;
  }
  
  /* flow */
  #q_kobetsu .box_point02 .item_area.flow{
    margin: 0;
  }
  #q_kobetsu .box_point02 .item_area.flow li{
    margin: 0 0 20px 0;
    float: none;
    width: 100%;
  }
  #q_kobetsu .box_point02 .item_area.flow li:after{
    right: 0;
    left: 0;
    top: auto;
    bottom: -15px;
    border-width: 10px 7px 0 7px;
    border-color: #6e1f19 transparent transparent transparent;
  }
  #q_kobetsu .box_point02 .item_area.flow li .txt{
    font-size: 13px;
  }
  #q_kobetsu .box_point02 .item_area.flow .ttl{
    padding: 2px 5px;
    width: 100%;
    font-size: 15px;
    font-weight: normal;
  }

  /* declaration
  ----------------------------------------------*/
  /* box_room
  ----------------------------------------------*/
  #q_kobetsu .box_room{
    margin: 0 0 70px;
    padding: 5px 10px 10px;
  }
  #q_kobetsu .box_room .inner{
    width: 100%;
    float: none;
  }
  #q_kobetsu .box_room .inner p{
    margin: 0 0 15px;
    padding: 0;
    font-size: 14px;
  }
  #q_kobetsu .box_room .inner .list{
    margin-bottom: 30px;
    padding-left: 0;
  }
  #q_kobetsu .box_room .inner .list dt{
    font-size: 15px;
  }
  #q_kobetsu .box_room .photo{
    width: 100%;
    max-width: 100%;
    float: none;
  }
  
  /* box_timetable
  ----------------------------------------------*/
  #q_kobetsu .box_timetable{
    margin: 0 0 10px;
  }
  #q_kobetsu .box_timetable .ttl{
    padding: 5px 10px;
    font-size: 18px;
  }
  #q_kobetsu .box_timetable .table_wrap{
    margin: 0 0 30px;
  }
  /* table */
  #q_kobetsu .box_timetable table.table01{
    margin-bottom: 0;
  }
  
  /*--------------------------------------------

  飛び級コース

  ----------------------------------------------*/
  #skip{
    margin-bottom: 50px;
  }
  #skip .ttl_sec{
    font-size: 16px;
  }
  /* box_flow
  ----------------------------------------------*/
  #skip .box_flow_in{
    display: block;
    max-width: max-content;
    margin: 0 auto;
  }
  #skip .box_flow_txt_wrap{
    padding: 20px 0 0;
  }
  #skip .box_flow_txt_wrap::before {
    display: none;
  }
  /* box_timetable
  ----------------------------------------------*/
  #skip .box_timetable{
    margin: 0 0 10px;
  }
  #skip .box_timetable .ttl{
    padding: 5px 10px;
    font-size: 18px;
  }
  #skip .box_timetable .table_wrap{
    margin: 0 0 30px;
  }
  /* table */
  #skip .box_timetable table.table01{
    margin-bottom: 0;
  }
  /*--------------------------------------------

  学校テスト満点コース

  ----------------------------------------------*/
  #manten{
    margin-bottom: 50px;
  }
  /* box_timetable
  ----------------------------------------------*/
  #manten .box_timetable table.table01{
    margin-bottom: 0;
  }
  /*--------------------------------------------

  学力UPコース

  ----------------------------------------------*/
  #up{
    margin-bottom: 50px;
  }

  /* box_timetable
  ----------------------------------------------*/

  /*--------------------------------------------

  INFORMATION

  ----------------------------------------------*/
  #information{
    margin-bottom: 70px;
  }
  /* box_intro
  ----------------------------------------------*/
  #information .box_intro{
    margin-bottom: 20px;
  }
  /* box_outline
----------------------------------------------*/
  #information .box_outline{
    margin-bottom: 25px;
  }
  /* 学習内容 */
  #information .box_outline .sec_contents_in{
    padding: 10px;
  }
  #information .box_outline .sec_contents .txt_main{
    margin-bottom: 5px;
    font-size: 16px;
  }
  /* 学習内容-単元 */
  #information .box_outline .sec_contents .unit_wrap{
    display: block;
  }
  #information .box_outline .sec_contents .unit{
    width: 100%;
    margin-bottom: 10px;
  }
  #information .box_outline .sec_contents .unit dt{
    font-size: 16px;
  }
  #information .box_outline .sec_contents .unit dd ul{
    display: block;
  }
  #information .box_outline .sec_contents .unit dd li{
    font-size: 14px;
  }
  #information .box_outline .sec_contents .unit dd li:nth-child(1),
  #information .box_outline .sec_contents .unit dd li:nth-child(4){
    width: 100%;
  }
  #information .box_outline .sec_contents .balloon{
    width: 100%;
    padding: 5px;
    font-size: 16px;
  }
  #information .box_outline .sec_contents .balloon::before{
    transform: rotate(90deg);
    top: -10px;
    bottom: auto;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
  /* box_flow
  ----------------------------------------------*/
  #information .box_flow{
    margin-bottom: 30px;
  }
  #information .box_flow .card_col{
    display: block;
  }
  #information .box_flow .card{
    margin: 0 auto;
    width: 100%;
    max-width: 480px;
  }
  #information .box_flow .card + .card{
    margin-top: 20px;
  }
  #information .box_flow .card .img{
    display: block;
    margin: 0 auto 10px;
    width: 100%;
  }
  #information .box_flow .card .txt{
    max-width: max-content;
  }
  /* box_workbook
  ----------------------------------------------*/
  #information .box_workbook .ttl_point{
    margin-bottom: 20px;
  }
  /* sec_logo */
  #information .box_workbook .sec_logo{
    margin-bottom: 30px;
    text-align: left;
  }
  #information .box_workbook .sec_logo .img_logo{
    max-width: 100%;
    max-width: 300px;
  }

  /* sec_point */
  #information .box_workbook .sec_point_wrap > div + div{
    margin-top: 40px;
  }
  #information .box_workbook .sec_point{
    display: block;
  }
  #information .box_workbook .sec_point > .illust{
    display: block;
    margin: 0 auto 10px;
    width: 50%;
    max-width: 160px;
  }
  #information .box_workbook .sec_point .box{
    max-width: calc(100% - 20px);
    margin: 0 0 0 auto;
    padding: 15px;
  }
  #information .box_workbook .sec_point .box .num{
    width: 50px;
    height: 50px;
    left: -25px;
    top: -25px;
  }
  #information .box_workbook .sec_point .box .ttl{
    font-size: 16px;
  }
  /* box_curriculum
  ----------------------------------------------*/
  #information .box_curriculum .ttl_point{
    margin-bottom: 10px;
  }
  #information .box_curriculum .sec_note{
    display: block;
  }
  #information .box_curriculum .sec_note .note{
    margin: 0 0 15px;
  }
  #information .box_curriculum .sec_note .balloon{
    width: 100%;
    padding: 5px 5px 10px;
    font-size: 14px;
  }
  #information .box_curriculum .sec_note .balloon:before{
    left: 0;
    right: 0;
    margin: 0 auto;
  }

  /* sec_flow */
  #information .box_curriculum .sec_flow .list{
    margin: 0 auto;
    flex-direction: column;
    gap: 20px 0;
    max-width: 480px;
  }
  #information .box_curriculum .sec_flow .list li{
    position: relative;
    display: block;
    width: 100%;
    min-height: auto;
  }
  #information .box_curriculum .sec_flow .list .normal:after{
    position: absolute;
    left: 0;
    right: 0;
    bottom: -14px;
    width: 50px;
    height: 15px;
    margin: 0 auto;
    clip-path: polygon(0 0, 100% 0%, 50% 100%);
    background:none;
    background-color: #1792cc;
  }
  #information .box_curriculum .sec_flow .list .normal dl{
    padding: 10px;
  }
  #information .box_curriculum .sec_flow .list .normal dt{
    font-size: 16px;
  }
  #information .box_curriculum .sec_flow .list .last{
    margin: 0 0 20px;
    padding: 20px 10px;
    width: 100%;
  }
  #information .box_curriculum .sec_flow .list .last p{
    font-size: 15px;
  }
  #information .box_curriculum .sec_flow .txt_period{
    max-width: 480px;
    margin: 0 auto;
  }
  #information .box_curriculum .sec_flow .txt_period span{
    font-size: 13px;
  }
  #information .box_curriculum .sec_flow .txt_period span::after{
    display: none;
  }
  /* sec_txt */
  #information .box_curriculum .sec_txt p{
    font-size: 16px;
    text-align: left;
  }
  /* box_timetable
  ----------------------------------------------*/
  #information .box_timetable{
    margin: 0 0 10px;
  }
  #information .box_timetable .ttl{
    padding: 5px 10px;
    font-size: 18px;
  }
  #information .box_timetable .table_wrap{
    margin: 0 0 30px;
  }
  /* table */
  #information .box_timetable table.table01{
    margin-bottom: 0;
  }


  /*--------------------------------------------

  Q NET

  ----------------------------------------------*/
  /* main_ttl */
  #q_net .main_ttl .sub_img img{
    margin: 0 5px 0 0;
  }
  #q_net .main_ttl .sub_img img.subject{
    max-width: 160px;
  }
  /* box_intro
  ----------------------------------------------*/
  #q_net .box_intro .lead_txt{
    margin: 0 0 10px;
  }
  /* box_point01
  ----------------------------------------------*/
  #q_net .box_point01 .ttl_point,
  #q_net .box_point02 .ttl_point {
      margin-bottom: 15px;
  }
  #q_net .box_point01 .txt_01,
  #q_net .box_point02 .txt_01 {
    margin-bottom: 15px;
  }
  
  /* box_point02
  ----------------------------------------------*/
  #q_net .box_point02{
    margin-bottom: 60px;
  }
  /*-- item_area --*/
  #q_net .box_point02 .item_ttl{
    margin-bottom: 10px;
    font-size: 17px;
    border-width: 10px;
    line-height: 1.3;
  }
  /* flow */
  #q_net .box_point02 .item_area.flow{
    margin: 0 0 50px;
  }
  #q_net .box_point02 .item_area.flow li{
    margin: 0 0 20px 0;
    width: 100%;
    float: none;
  }
  #q_net .box_point02 .item_area.flow li:after{
    right: 0;
    left: 0;
    top: auto;
    bottom: -15px;
    border-width: 10px 7px 0 7px;
    border-color: #182987 transparent transparent transparent;
  }
  #q_net .box_point02 .item_area.flow li .txt{
    font-size: 13px;
  }
  #q_net .box_point02 .item_area.flow .ttl{
    padding: 2px 5px;
    font-size: 15px;
    font-weight: 500;
  }
  
  
  /* course_area */
  #q_net .course_ttl{
    border:none;
  }
  #q_net .course_ttl .main{
    padding: 10px 5px;
    margin: 0 0 5px;
    width: 100%;
  }
  #q_net .course_ttl .sub{
    display: block;
  }
  #q_net .course_area .check_list{
    padding: 10px;
  }
  #q_net .course_area .check_list .lead{
    padding: 8px;
    letter-spacing: 0;
    line-height: 1.3;
    text-align: left;
    font-size: 14px;
  }
  #q_net .course_area .check_list li{
    font-weight: normal;
    font-size: 13px;
    line-height: 1.5;
  }
  
  /*--course01--*/
  #q_net .course_area.course01{
    margin-bottom: 60px;
  }
  /*--course02--*/
  #q_net .course_area.course02{
    margin-bottom: 75px;
  }
  #q_net .course_area.course02 .check_list{
    margin-bottom: 15px;
  }
  /*select_course*/
  #q_net .select_course{
  }
  #q_net .select_course dl{
    padding: 10px 10px 0;
    width: 100%;
    float: none;
    background: #fff;
  }
  #q_net .select_course dt{
    padding: 2px 5px;
    font-size: 14px;
  }
  #q_net .select_course dd img{
    height: 30px;
  }
  
  /* box_subject
  ----------------------------------------------*/
  #q_net .box_subject{
    margin: 0 auto 60px;
  }
  #q_net .box_subject .inner{
    padding: 15px 10px 0px;
  }
  #q_net .box_subject .inner .subject_ttl{
    margin-bottom: 10px;
    height: 20px;
    width: auto;
  }

  /* box_timetable
  ----------------------------------------------*/
  #q_net .box_timetable{
    margin-bottom: 30px;
  }
  #q_net .box_timetable .ttl{
    margin: 0 0 15px;
    padding: 10px 5px;
    font-size: 17px;
  }
  /*--------------------------------------------

  SUPER KIDS

  ----------------------------------------------*/
  #super_kids{
    margin-bottom: 70px;
  }
  #super_kids .main_ttl img{
    max-height: 35px;
  }
  #super_kids .main_ttl .sub_img{
    margin-bottom: 0;
  }
  #super_kids .main_ttl .sub_img img{
    max-width: 100%;
  }
  #super_kids .ttl_sub_box{
  }
  #super_kids .ttl_sub_box .main{
    width: 100%;
    padding: 5px;
  }
  #super_kids .ttl_sub_box .sub{
    padding: 5px 0;
    display: block;
    font-size: 16px;
    text-align: center;
  }
  /* list */
  #super_kids .list_effect{
    padding: 10px;
  }
  #super_kids .list_effect li{
    font-weight: normal;
    font-size: 13px;
  }
  /* box_point_sokudoku
----------------------------------------------*/
  #super_kids .box_point_sokudoku .ttl_point{
    margin-bottom: 20px;
  }
  /* box_point_shikouryoku
  ----------------------------------------------*/
  #super_kids .box_point_shikouryoku .ttl_point{
    margin-bottom: 20px;
  }
  /* area_01 */
  /* list-skills */
  #super_kids .box_point_shikouryoku .area_01 .list-skills dt{
    font-size: 22px;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li:nth-child(1) img{
    width: 60%;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li:nth-child(2) img{
    width: 60%;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li:nth-child(3) img{
    width: 80%;
  }
  /* box_content
  ----------------------------------------------*/
  #super_kids .box_content{
    margin-bottom: 30px;
  }
  #super_kids .box_content .ttl{
    margin: 0 0 10px;
    padding: 0px 10px;
    font-size: 17px;
    border-width: 10px;
    line-height: 1.3;
  }
  #super_kids .box_content .box{
    display: block;
  }
  #super_kids .box_content .box .txt_main{
    margin: 0 0 5px;
    font-size: 16px;
  }
  /* box_timetable
  ----------------------------------------------*/
  #super_kids .box_timetable .ttl{
    margin: 0 0 15px;
    padding: 10px 5px;
    font-size: 17px;
  }
  #super_kids .box_timetable table{
    min-width: 900px;
  }
  #super_kids .box_timetable table tr:first-child th:last-child{
    width: 260px;
  }
}

/**********************************************************


SMARTPHONE ONLY


***********************************************************/
@media screen and (max-width: 480px) {

  .class_list_nav + .class_list_nav{
    margin-top: 0;
  }
  .class_list_nav{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .class_list_nav .col03,
  .class_list_nav .col04{
    width: 100%;
  }
  .class_list_nav .col04 img{
    width: 70%;
  }
  .class_list_nav li:nth-child(even){
    border-left: 1px solid #efeee3;
  }

  /*--------------------------------------------

  INFORMATION

  ----------------------------------------------*/
  /* box_workbook
  ----------------------------------------------*/
  #information .box_workbook .sec_point .box{
    display: block;
  }
  #information .box_workbook .sec_point .box .contents{
    margin: 0 0 15px;
    width: 100%;
  }
  #information .box_workbook .sec_point .box .img{
    width: 100%;
  }
  /* box_curriculum
  ----------------------------------------------*/
  #information .box_curriculum{
    margin-bottom: 30px;
  }
  /* sec_flow */
  #information .box_curriculum .sec_flow .list .normal dl{
    display: flex;
  }
  #information .box_curriculum .sec_flow .list .normal dt{
    margin: 0 10px 0 0;
  }
  /*--------------------------------------------

  SUPER KIDS

  ----------------------------------------------*/
  /* box_point_sokudoku
  ----------------------------------------------*/
  #super_kids .box_point_sokudoku .area_01 .list dl{
    display: block;
  }
  #super_kids .box_point_sokudoku .area_01 .list dl + dl{
    margin-top: 20px;
  }
  #super_kids .box_point_sokudoku .area_01 .list dt{
    margin: 0 0 8px;
    display: block;
    width: 100%;
  }
  #super_kids .box_point_sokudoku .area_01 .list dd{
    display: block;
    padding: 0;
  }
  /* box_point_shikouryoku
  ----------------------------------------------*/
  #super_kids .box_point_shikouryoku .area_01 .list-skills dt{
    font-size: 18px;
  }
  /* area_01 */
  #super_kids .box_point_shikouryoku .area_01 .list-skills ul{
    display: block;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li{
    width: 100%;
    height: auto;
    min-height: 120px;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li:nth-child(1) img{
    width: 40%;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li:nth-child(2) img{
    width: 40%;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li:nth-child(3) img{
    width: 50%;
  }
  #super_kids .box_point_shikouryoku .area_01 .list-skills li + li{
    margin-top: 10px;
  }

  /*--------------------------------------------

  飛び級コース

  ----------------------------------------------*/
  /* box_overview
  ----------------------------------------------*/
  #skip .box_overview_list{
    gap: 8px;
    grid-template-columns: repeat(2, 1fr);
  }
  /* box_flow
  ----------------------------------------------*/
  #skip .box_flow{
    margin-bottom: 30px;
  }
  #skip .box_flow_ttl{
    font-size: 20px;
  }

  /*--------------------------------------------

  学校テスト満点コース

  ----------------------------------------------*/
  /* box_content
  ----------------------------------------------*/
  #manten .box_content_txt01{
    font-size: 16px;
  }
  #manten .box_content_txt01 .small{
    font-size: 13px;
  }

  /*--------------------------------------------

  学力UPコース

  ----------------------------------------------*/
  /* box_content
  ----------------------------------------------*/
  #up .box_content_txt01{
    font-size: 16px;
  }
  #up .box_content_txt02 {
    font-size: 13px;
  }

}