@import url('common.css');
html {
    height:100%;
    -webkit-text-size-adjust: 100%;
}
body {

    font-family:"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","Meiryo UI","メイリオ",Meiryo,sans-serif!important;
    font-size:16px;
    line-height:1.42857;
    height:100%;
    color: rgba(0, 0, 0, .84)!important; 
}
.allcontents {
    position: relative;
    min-height: 100%;
    padding-bottom: 3.0em;
    overflow-y:hidden;
}
/*コンテンツ改善
@media screen and (max-width:767px) {
.allcontents {
    padding-bottom: 12.0em;
}    
    
}*/
.content {
    margin-top:3.0em;
    padding-bottom: 13em; 
}


.header{
    background-color:#fff!important;
}
/*
@media screen and (max-width:767px) {
    .header{
    position:fixed;
    z-index:9999;
    top:0em;
}    
    
} */

.title{
/*    color:#fff;

    font-weight:bold;
    */
vertical-align:middle;
font-size:24px;
font-weight:normal;

}

.title_2{
/*    color:#fff;

    font-weight:bold;
    font-size:28px;
*/
vertical-align:middle;
}
.title_2:after {
    content:'平成29年9月編　実施結果';
}
@media screen and (max-width: 768px){	
  .title_2{font-size:20px!important;}
 
}

/*======================================
 ナビメニュー
======================================*/

.fixed {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 1000;
}

.navbar-success {
    width:100%;
    margin:0,1em,0,-1em;
  color: #fff;
  background-color: #006428;
  /*color:#9d9d9d;*/
}

@media screen  and (max-width:767px) {
    .navbar-success {  
  background-color: #fff;
  color: #006428;
   /*background-color: #fff!important;
  color: #006428!important;*/
}
}

.navbar-success .navbar-brand {
  color: #fff;  
  background-color: #006428;
  /*color:#9d9d9d;*/
}
.navbar-success .navbar-brand:hover,
.navbar-success .navbar-brand:focus {
  color: #9d9d9d;
  background-color: #fff;
}
.navbar-success .navbar-text {
  color: #fff;
}

  /*PC・iPadメニュー横幅揃え;*/
@media screen and (min-width:768px) {

.navbar-success ul {       
    display: flex;
    width:100%
}

.navbar-success ul li  {
    flex: 1 0 auto;
    text-align:center
}
}
.navbar-success .navbar-nav > li > a {
  color: #fff    ;
  /*color:#696969;*/
}
.navbar-success .navbar-nav > li > a:hover,
.navbar-success .navbar-nav > li > a:focus {  
  color: #fff;
  background-color: #287b48;/* #006428*/
  /*opacity: .54; ナビゲーションの透明度 .84*/
}
.navbar-success .navbar-nav > .active > a,
.navbar-success .navbar-nav > .active > a:hover,
.navbar-success .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color:#287b48!important;/* #006428*/
}
.navbar-success .navbar-nav > .disabled > a,
.navbar-success .navbar-nav > .disabled > a:hover,
.navbar-success .navbar-nav > .disabled > a:focus {
  color: #444444;
  background-color: #dcf3e4;
}
.navbar-success .navbar-toggle {
  border-color: #287b48;
}
.navbar-success .navbar-toggle:hover,
.navbar-success .navbar-toggle:focus {
  background-color: #287b48;  
  opacity: .84; /*ナビゲーションの透明度*/
}
.navbar-success .navbar-toggle .icon-bar {
  background-color: #006428;
}
.navbar-success .navbar-collapse,
.navbar-success .navbar-form {
  border-color: #006428;
}
.navbar-success .navbar-nav > .open > a,
.navbar-success .navbar-nav > .open > a:hover,
.navbar-success .navbar-nav > .open > a:focus {
  background-color: #006428;
  color: #ffffff;
}


.navbar-success .navbar-nav .open .dropdown-menu {
    background-color: #006428!important;/* #287b48*/
  }

.navbar-success .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #fff;
    background-color: #006428;/* #287b48*/
  }
  .navbar-success .navbar-nav .open .dropdown-menu .divider {
    background-color: #fff;
  }
  .navbar-success .navbar-nav .open .dropdown-menu > li > a {
    color: #fff;
    background-color: #006428;/* #287b48*/
  }
  .navbar-success .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-success .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
    background-color: #287b48;/* #006428*/
  }
  .navbar-success .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-success .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-success .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #287b48;/* #006428*/
  }
  .navbar-success .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-success .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-success .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #ffffff;
  background-color: #287b48;/* #006428*/
  }

@media (max-width: 767px) {
  .navbar-success .navbar-nav > li > a {
    color: #006428;
    font-weight:bold;
    background-color: #fff!important;
    border-bottom: 0.4px solid #287b48;    
  }
.navbar-success .navbar-nav > li > .active > a {
  color: #fff!important;
  background-color:#287b48!important;/* #006428*/
}
  .navbar-success .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #fff;
  }
  .navbar-success .navbar-nav .open .dropdown-menu .divider {
    background-color: #fff;
  }
  .navbar-success .navbar-nav .open .dropdown-menu > li > a {
    color: #fff!important;
    background-color: #006428!important;
  }
  .navbar-success .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-success .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
    background-color: #287b48!important;
  }
  .navbar-success .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-success .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-success .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color:#287b48!important;
  }
  .navbar-success .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-success .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-success .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #ffffff;
  background-color: #287b48;
  }
}
.navbar-success .navbar-link {
  color: #fff;
}
.navbar-success .navbar-link:hover {
  color: #ffffff;
}
.navbar-success .btn-link {
  color: #9d9d9d;
}
.navbar-success .btn-link:hover,
.navbar-success .btn-link:focus {
  color: #ffffff;
}
.navbar-success .btn-link[disabled]:hover,
fieldset[disabled] .navbar-success .btn-link:hover,
.navbar-success .btn-link[disabled]:focus,
fieldset[disabled] .navbar-success .btn-link:focus {
  color: #444444;
}


/*======================================
 スマホ向けメニュー　ヘッダ
======================================*/

#nav-drawer {
  position: fixed;
  width: 100%;
  top: 10px;
  z-index: 2000;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width:80px;
  height: 10px;
  vertical-align: middle;
  margin-bottom:0.5em;
  padding-left:3.0em;
}

@media only screen and (max-width: 320px) {
#nav-open {
      padding-left:2.0em;
      margin-top:0.5em;
}}

day_posi
{margin-top:0.5em!important;

}
@media only screen and (max-width: 320px) {
.day_posi {
      margin-top:0.0em;
}}

@media only screen and (min-width: 321px) and (max-width: 767px) {
.day_posi {
      margin-top:1.0em!important;
}}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}

@media only screen and (min-width:768px) and (max-width: 1365px) {
#nav-open span, #nav-open span:before, #nav-open span:after {
    margin-top:3.0em!important;
}

}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}


/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 270px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示・成績表*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}


/*チェックが入ったらもろもろ表示・ナビゲーション*/
#navvar-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#navvar-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}



/*======================================
 判例情報
======================================*/

/*判例情報 見出し*/
.h_title1 {
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  margin-left:0.5em;
  margin-top:0.5em;
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #006428;/*左線*/
}


/*新着公開へボタンの位置*/
.new_posi {
 margin-left:0.5em;
 background-color:#FF8400!important;

      
}

/*判例情報 演習ボタン見出し*/
.btn-ensyu{
    background-color: #004D45;    
    border-radius:15px;
}

.ac_btn{
    background-color:#e6f9e6;
    color:#259b24;
}

.text_line {
    text-indent:-2em;
    margin-left:2em;
}


.htext_posi1 {
margin-top:-0.5em; 
      
}

@media screen and (min-width:1024px)and (max-width:1365px){	
  .htext_posi1{
     margin-top:-0.5em; 
  }
  }


@media screen and (max-width: 767px){	
  .htext_posi1{
margin-top:0.2em; 
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
  .htext_posi1{
     margin-top:-0.5em; 
  }
  }

.htext_posi2 {
margin-top:0.8em; 
      
}

@media screen and (min-width:1024px)and (max-width:1365px){	
  .htext_posi2{
     margin-top:0.0em; 
  }
  }


@media screen and (max-width: 767px){	
  .htext_posi2{
margin-top:0.3em; 
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
  .htext_posi2{
     margin-top:0.3em; 
  }
  }


.htext_posi3 {
margin-left:0.5em; 
      
}

@media screen and (min-width:1024px)and (max-width:1365px){	
  .htext_posi3{
     margin-left:0.0em; 
  }
  }

@media screen and (max-width: 374px){	
  .htext_posi3{
margin-left:2.5em; 
  }
  }

@media screen  and (min-width: 375px) and (max-width: 413px){	
  .htext_posi3{ 
margin-right:2.5em!important;
  }
  }


@media screen  and (min-width: 414px) and (max-width: 767px){	
  .htext_posi3{
margin-left:3.5em; 
  }
  }

@media screen and (min-width: 768px)and (max-width:1023px){	
  .htext_posi3{
     margin-left:2.0em; 
  }
  }





@media screen and (max-width: 374px){	
  .htext_posi4{
margin-left:0.2em; 
  }
    .icon_size{
font-size:0.75em; 
  }
      .htitle_size{
font-size:1.0em!important;
  }
  }

@media screen  and (min-width: 375px) and (max-width: 413px){	
  .htext_posi4{ 
margin-right:0.55em!important;
  }
        .htitle_size{
font-size:19px!important
  }
  }


@media screen  and (min-width: 414px) and (max-width: 767px){	
  .htext_posi4{
margin-left:1.85em; 
  }
  .htitle_size{
font-size:21px!important
  }
  }

@media screen and (max-width: 768px){	
  .ktext_posi{
margin-left:0.5em; 
  }
  }

.label_posi {
margin-top:0em; 
      
}


@media screen and (max-width: 374px){	
  .label_posi{
margin-right:5.5em;
  }
  }

@media screen  and (min-width: 375px) and (max-width: 413px){	
  .label_posi{
margin-right:8.5em;
  }
  }


@media screen  and (min-width: 414px) and (max-width: 767px){	
  .label_posi{
margin-right:10.5em;
  }
  }




.modalt_posi {
padding-top: 0.5em;
      
}

@media screen and (min-width:1024px)and (max-width:1365px){	
  .modalt_posi{
     padding-top:0.0em; 
  }
  }


@media screen and (max-width: 767px){	
  .modalt_posi{
padding-top:0.0em; 
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
  .modalt_posi{
     padding-top:0.0em; 
  }
  }

/*行　ポジ*/
.gyo_posi {
margin-left:-2.0em;
      
}
@media screen and (max-width: 767px){	
  .gyo_posi {
margin-left:0.5em;
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
 .gyo_posi {
     margin-left:-1.0em;
  }
  }

.gyo_posi2 {
margin-left:-2.0em;
      
}
@media screen and (max-width: 767px){	
  .gyo_posi2 {
margin-left:0.5em;
margin-top:-1.0em;
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
 .gyo_posi2 {
     margin-left:-1.0em;
     margin-top:-1.0em;
  }
  }


.gyo_posi3 {
margin-left:-2.0em;
      
}
@media screen and (max-width: 767px){	
  .gyo_posi3 {
margin-left:0.5em;
margin-top:-1.0em;
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
 .gyo_posi3 {
     margin-left:-1.0em;
  }
  }
@media screen and (min-width:1024px)and (max-width:1365px){	
 .gyo_posi3 {
     margin-left:-2.0em;
  }
  }

.gyo_posi4 {
margin-left:-0.5em;
      
}
@media screen and (max-width: 320px){	
  .gyo_posi4 {
margin-left:-1.0em!important;
  }
  }
@media screen and (max-width: 321px) and (max-width: 413px){	
  .gyo_posi4 {
margin-left:0.5em;
  }
  }
@media screen and (min-width: 414px) and (max-width: 767px){	
  .gyo_posi4 {
margin-left:1.8em;
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
 .gyo_posi4 {
     margin-left:0.5em;
  }
  }
@media screen and (min-width:1024px)and (max-width:1365px){	
 .gyo_posi4 {
     margin-left:-1.5em;
  }
  }


@media screen and (max-width: 320px){	
  .gyo_posi5 {
margin-left:-3.0em!important;
  }
  }
@media screen and (max-width: 321px) and (max-width: 413px){	
  .gyo_posi5 {
margin-left:1.8em!important;
  }
  }
@media screen and (min-width: 414px) and (max-width: 767px){	
  .gyo_posi5 {
margin-left:1.5em!important;
  }
  }

/*modal 高さ*/
.modal_posi {
height: 50vh;
      
}

@media screen and (min-width:1024px)and (max-width:1365px){	
  .modal_posi{
height: 40vh; 
  }
  }


@media screen and (max-width: 767px){	
  .modal_posi{
height: 30vh; 
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
  .modal_posi{
height: 25vh; 
  }
  }

/*演習ボタンの大きさ*/
.ensyu_icon {
font-size:1.2em;
text-align:center
      
}


.ensyu_text {
font-size:0.7em;
margin-top:0.2em;
      
}

@media screen  and (min-width: 321px) and (max-width: 767px){	
  .ensyu_icon{
font-size:1.5em;
  }
  .ensyu_text {
font-size:0.6em;
margin-top:0.5em;
      
}
  }

@media screen and (max-width: 320px){	
  .ensyu_icon{
font-size:0.8em;
  }
  .ensyu_text {
font-size:0.6em;
margin-top:0.5em;
      
}
  }

.acbox input:checked ~ label::after {
  background-color:aquamarine!important;
}

/*解説内　タイトル*/
.kai_title {
 color: #004D45;
 font-size:1.5em;
      
}
@media screen and (max-width: 667px){	
  .kai_title {
 font-size:1.2em;
  }
  }

/*表示位置*/
@media screen and (max-width: 768px){	
  .panel_posi {
 padding-top:1.0em;
  }
  }

/*======================================
 コンバージョン情報
======================================*/

/*CV バナー上記載のコメント*/
.title_3{
margin-bottom:0;
margin-top:-1.5em;
}
.title_3:after {
    font-family: "FontAwesome";
 /*  content:'司法試験学習から合格後までずっとサポート';/*修サポ用*/
 /* content:'受験者数最大級の模試で、総仕上げ \f12a';/*テスト用*/
  /*  content:'司法試験当日まで直前学習を徹底サポート';/*応援キャンペーン用*/  
 /* content:'直前期に慌てないためにも、\A 今から短答対策 \f12a';テスト用*/
  white-space: pre ;

}

@media screen and (max-width: 768px){	
  .title_3{font-size:12px!important;}
  .title_3:after {
       font-family: "FontAwesome";
    /* content:'受験者数最大級の模試で最後の総仕上げ \f12a';/*テスト用*/
  /* content:'司法試験学習から合格後までずっとサポート';/*修サポ用*/
  /*  content:'直前期の短答式・論文式対策を徹底サポート \f12a';/*応援キャンペーン用*/  
  content:'';/*テスト用*/
  background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #70a6ff 0%) repeat scroll 0 0;
}
 
}

@media screen and (max-width: 768px){	
  .title_3_1{font-size:12px!important;
             margin-bottom:-0.1em;
  }
  .title_3_1:after {      
     font-family: "FontAwesome";
     /*content:'受験者数最大級の模試で最後の総仕上げ \f12a';/*テスト用*/
     /*content:'司法試験学習から合格後までずっとサポート';/*修サポ用*/
}
 
}

.title_4{
/*    color:#fff;

    font-weight:bold;
    font-size:28px;
*/
vertical-align:middle;
}
.title_4:after {
    content:'司法試験模試チャレンジとは';
}
@media screen and (max-width: 768px){	
  .title_4{font-size:20px!important;}
 
}

/*スマホ用CV修サポ　毎年5月合格発表後修正*/
/*スマホ用CV3月テスト*/
.title_3_2{
margin-bottom:0;
font-size:0.8em;
}
.title_3_2:after {
    font-family: "FontAwesome";
    content:'直前期に慌てないためにも、今から短答対策 \f12a';
}
.title_3_3{
color:#fff;
font-weight:600;
font-size:1.8em!important;
}
.title_3_3:after {
    content:'';}
@media screen and (max-width: 768px){	
  .title_3_3{font-size:1.5em!important;}
}
.title_3_4{
color:#fff;
font-weight:600;
font-size:1.8em!important;
}
.title_3_4:after {
    content:'あと5ヶ月';}
@media screen and (max-width: 768px){	
  .title_3_4{font-size:1.2em!important;}
  }

.title_3_5{
color:#fff;
font-weight:600;
font-size:1.8em!important;
}
.title_3_5:after {
    content:'16,000';}
@media screen and (max-width: 768px){	
  .title_3_5{font-size:1.5em!important;}
  }

.title_3_6{
color:#fff;
font-weight:600;
font-size:1.8em!important;
}
.title_3_6:after {
    content:'受験者数最大規模';}
@media screen and (max-width: 768px){	
  .title_3_6{font-size:1.5em!important;}
  }


.title_3_7{
margin-bottom:0;
font-size:0.9em;
}
.title_3_7:after {
    content:'司法試験まで';
}

.title_3_8{
margin-bottom:0;
font-size:0.9em;
}
.title_3_8:after {
    content:'';
}
/*スマホ用CV修サポ　毎年5月合格発表後修正おわり*/


/*CV 期間限定用*/
.title_7_1{
margin-bottom:0;
}
.title_7_1:after {
    content:'';
}
@media screen and (max-width: 768px){	
  .title_7_1{
margin-bottom:0;
}
.title_7_1:after {
    content:'';
}
  }

.title_7_2{
color:#fff;
font-weight:600;
font-size:1.8em!important;
}
.title_7_2:after {    
    content:'司法試験学習から合格後まで';}/*本試験直前期も*/

@media screen and (max-width: 768px){	
.title_7_2{
color:#fff;
font-weight:600;
font-size:1.4em!important;
}
.title_7_2:after {
    content:'司法試験学習から合格後まで';}/*本試験直前期も*/
  }

.title_7_3{
margin-bottom:0;
font-size:1.5em;
}
.title_7_3:after {    
     font-family: "FontAwesome";
    content:' \f12a';
}
@media screen and (max-width:1024px){	
.title_7_3{
margin-bottom:0;
font-size:1.0em;
}
.title_7_3:after {    
    content:'ずっとサポート';
}
}

/*CV 期間限定用終わり*/

/*CV用　メイン画像アニメーションあり*/
.main_img {
    background: url('../images/banner1912.png');
     width: 82.5%;
     height: 110px;
      background-size:cover;
     background-position: 0% 25%;
     margin-bottom:0.5em;
     margin-left:0.5em;
}
@media only screen and (min-width: 376px)  and (max-width: 767px){
  .main_img{
     background: url('../images/banner2003.png');
     width: 90%;
     height: 90.5px;
     margin-left:0.2em;
     margin-top:-0.5em;
     background-size:cover;     
     background-position: 10% 10%;
  }
  }
@media screen and (max-width: 375px){	
  .main_img{
     background: url('../images/banner2003.png');
     width: 90%;
     height: 83.0px;
     margin-left:0.2em;
     background-size:cover;     
     background-position: 10% 10%;
  }
  }

@media screen and (max-width: 320px){	
  .main_img{
     background: url('../images/banner1912.png');
     width: 86%;
     height:66.0px;
     margin-top:1em;
     margin-left:0.2em;
     background-size:cover;     
     background-position: 10% 10%;
  }
  }

/*CV用　修サポバナー画像*/
.bn_img {
    background: url('../images/banner05.png');
     width:95.5%;
     height: 60.8px;
      background-size:cover;
     background-position: 10% 20%;
     margin-right:1em;

}
@media screen and (max-width: 768px){	
  .bn_img{
     background: url('../images/test2006_2.png');
     width: 95%;
     height: 45.5px;
     background-size:cover;
     background-position: 20% 15%;
  }
  }

/*CV用　期間限定バナー画像*/
.bn_img2 {
    background: url('../images/banner2206.png');/*修サポ/campaign.png*/
     width:100%;
     height: 47px; /*height: 60.8px*/
      background-size:cover;
     background-position: 10% 20%;
     margin-right:1em;

}
@media screen and (max-width: 767px){	
  .bn_img2{
     background: url('../images/banner2206.png');/*修サポ/campaign.png*/
     width: 95%;
     height: 60px;
     background-size:cover;
     background-position: 5% 15%;
     margin-left:4em;
     margin-top:1.5em;
  }
  }
@media screen and (min-width: 768px)and (max-width:1023px){	
  .bn_img2{
     background: url('../images/banner2206.png');/*修サポ/campaign.png*/
     width: 90%;
     height: 120px;
     background-size:cover;
     background-position: 5% 15%;
     margin-left:8em;
     margin-top:1.5em;
  }
  }

@media screen and (min-width:1024px)and (max-width:1365px){	
  .bn_img2{
     background: url('../images/banner2206.png');/*修サポ/campaign.png*/
     width: 70%;
     height: 125px;
     background-size:cover;
     background-position: 5% 15%;
     margin-left:15em;
     margin-top:2.5em;
     margin-bottom:1.0em;
  }
  }

/*右側バナー画像*/
/*修サポ
.bn_img3 {
  /*  background: url('../images/banner2106.png');修サポ/campaign.png
    width:100%;
     height: 74px;
      background-size:cover; 
     /* margin-bottom:-0.2em!important;模試/0.3em!important
}*/

/*修サポ(位置変更）*/
.bn_img4 {
    background: url('../images/test2209.png');/*修サポ/campaign.png test2209.png*/
    width:100%;
   /*  margin-top:0.5em;
    height: 65px;    テスト表示時65pxにする*/
      background-size:cover; 
      /*模試/0.3em!important*/
     visibility:hidden;       /*  テスト終了時表示*/
}




/*模試*/
.bn_img3 {
    background: url('../images/banner2206.png');/*修サポ/campaign.png*/
     width:100%;
     height: 74px;  
      background-size:cover;  
      margin-bottom:-0.2em!important;
      
}
/*模試
.bn_img4 {
    background: url('../images/test2209.png');修サポ/test2103.png user.png*/
    /* width:100%;
     margin-top:0.5em;
     height: 135px; /*テスト表示時65pxにする*/
      /*background-size:cover;  
 visibility:hidden;       テスト終了時表示
      
}*/
/*提携会社
*/
.bn_img5 {
    background: url('../images/webnipyo.png');
     width:100%;
     height: 78.5px;
      background-size:cover;
    margin-top:0.2em;  /* テスト終了時表示*/
  /*  margin-top:0.2em;     テスト時表示*/  
      
}
.bn_img6 {
    background: url('../images/oasis.png');
     width:100%;
     height: 63.5px;
      background-size:cover;

}
.bn_img7 {
    background: url('../images/3mtest.png');
     width:100%;
     height: 78.5px;
      background-size:cover;
      visibility:hidden;

}

/*新テストバナー
*/
.bn_img8 {
    background: url('../images/test3.png');
     width:150%;
     height: 75px;
      background-size:cover;
    margin-top:-0.2em;  /* テスト終了時表示-2.0em;*/
     /* margin-top:0.2em;   テスト時表示*/  
      
}


@media screen and (min-width: 376px) and (max-width: 767px){	
  .bn_img8{
     background: url('../images/test3.png');
     width: 100%;
     height: 80px;
     background-size:cover;
     background-position: 5% 15%;
     margin-left:0em;
     margin-top:0.2em;
  }
  }



/*修習生版*/
.bn_img9 {
    background: url('../images/shushusei76.png');
    width:100%;
    margin-top:0.5em;
    height: 65px;   /*  表示時65pxにする*/
      background-size:cover; 
      /*模試/0.3em!important*/
   /*   visibility:hidden;        終了時表示*/
}




/*修習生セミナー*/
.bn_img10 {
    background: url('../images/seminar202210_lgs.png');/*修サポ/campaign.png test2209.png*/
    width:100%;
    margin-top:0.5em;
    height: 65px;   /*  テスト表示時65pxにする*/
      background-size:cover; 
      /*模試/0.3em!important*/
   /*   visibility:hidden;        テスト終了時表示*/
}

/*更新と同時に修正*/
/*更新日*/
.day{
    font-size:12px;
}
.day:after{
    content:'更新：2022/09/30'
}

/*随時修正*/
.mainimg{
    background-image:url('../images/banner08_2.png');
    background-size:cover;
}


.footer {
    bottom:0;
    position:absolute;
    text-align:center;
    margin: auto; 
    width:100%;
    font-size:0.7rem;
    background-color:transparent;
    z-index:1000;
}
/*コンテンツ改善
@media screen and (max-width:767px) {
.footer {
    bottom:12em;
}    
    
}*/

.footer:after{
    content:'Copyright (C) TKC All Rights Reserved.';
}

.linkc{
    color:black;
}
.bold{
    font-weight:bold;
}
.fuchi05 {
    text-shadow: 0.5px 0.5px 0.5px rgba(0, 0, 0, .54),0.5px -0.5px 0.5px rgba(0, 0, 0, .54),-0.5px 0.5px 0.5px rgba(0, 0, 0, .54),-0.5px -0.5px 0.5px rgba(0, 0, 0, .54);
    color:#fff;
}

.dispitem {
    padding: 6px 12px;
}


.shape{	
	border-style: solid; border-width: 0 50px 30px 0; float:right; height: 0px; width: 0px;
	-ms-transform:rotate(360deg); /* IE 9 */
	-o-transform: rotate(360deg);  /* Opera 10.5 */
	-webkit-transform:rotate(360deg); /* Safari and Chrome */
	transform:rotate(360deg);
}

.offer-shiho .shape{
	border-color: transparent #FF8400;/* #00a34f */
}
.shape-text{
	color:#fff; font-size:12px; font-weight:bold; position:relative; right:-25px; top:-3px; white-space: nowrap;
	-ms-transform:rotate(30deg); /* IE 9 */
	-o-transform: rotate(360deg);  /* Opera 10.5 */
	-webkit-transform:rotate(30deg); /* Safari and Chrome */
	transform:rotate(30deg);
}	


.keyBgColor{
    background-color:#ffffff;
}

.BgColor{
/*    background:linear-gradient(180deg,#ededed 0%,#ededed 50%,#ffffff 50%,#ffffff 100%);
background-color:rgb(255,255,255);*/
}
.banner08{
    background-image:url('../images/banner08.png');
background-size:cover;
}

/*見出し*/
.text1 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
background: transparent;/*背景透明に*/
border-left: solid 5px #7db4e6;/*左線*/
font-size:26px;
font-weight:bold;
}

.text2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
margin-left:1em;
background: transparent;/*背景透明に*/
font-size:22px;
font-weight:bold;
}
@media screen and (max-width: 768px){	
  .text2 { font-size:20px; 
  }
}

.text3 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
margin-left:1em;
background: transparent;/*背景透明に*/
font-size:18px;
border-left: solid 5px #7db4e6;/*左線*/
font-weight:bold;
}

  .text6 { font-size:18px!important;
  }
   .text6_2 { font-size:1.8em!important;
           
  }
   
  .text10 { font-size:1.25rem!important;
            font-weight:bold;
  }
  .text10_2 { font-size:1.25rem!important;
            font-weight:bold;
  }
  .text11 { font-size:1.20rem!important;
            
  }
  .text12 { font-size:2.0rem!important;
            
  }
  
  .ranking_text1 { font-size:0.8rem!important;
                   margin-top:-1.5em!important;
            
  }

/*文字の大きさ*/
@media screen and (max-width: 768px){	
  .text4 { font-size:22px!important;}
  .text5 { font-size:18px!important;}
  .text5_2 { font-size:16px!important;}
  .text5_3 { font-size:16px!important;
             margin-top:2em;
  }
  .text6 { font-size:14px!important;
           margin-top:0.5em;
  } 
   .text6_2 { font-size:1.5em!important;
  }
  .text7 { font-size:12px!important;
  }
  .text7_2 { font-size:10px!important;
             margin-left:-1em;
             padding-top:0.3em;
  }
  .text8 { font-size:14px!important;
  }
  .text9 { font-size:20px!important;
  }
    .text10 { font-size:18px!important;}
  .text10_2 { font-size:16px!important;}
  .text11 { font-size:16px!important;
          
  }
  .text12 { font-size:22px!important;
          
  }  
  .ranking_text1 { font-size:0.6rem!important;
                   margin-top:-2em!important;
            
  }
}

/*画像の大きさ */
@media screen and (max-width: 768px){
  .photo { width: 100%;
           margin-right:-8em;
  }
}

.position3 { margin-top:1em;
  }
.position6 { margin-top:-1.5em;
  }
/*位置 */
@media screen and (max-width: 768px) {
    .position2 {
        padding-bottom: 40em;
    }

    .position3 {
        margin-top: 0.5em;
        margin-bottom: 0.5em;
    }

    .position4 {
        margin-top: 1.5em;
    }

    .position5 {
        margin-bottom: 0.5em;
    }

    .position6 {
        margin-top: -2.0em;
    }
}



/*見出し文字の位置*/
.position1{
    margin-top:0.5em;
}
@media screen and (max-width: 768px){	
  .position1 { margin-top:0em; }
}

/*1行目下げる*/
.indent1{
  text-indent:1em;
}

/*2行目以降下げる*/
.indentback{
  text-indent: -1em;
  padding-left: 2em;
}

/*吹き出し*/
.balloon-right-btm {
 	position: relative;
	display: inline-block;
	margin:  0 15px 0 0 ;
	padding: 0 5px;
	width: 60px;
	height: 60px;
	line-height: 60px;
	vertical-align: middle;
	text-align: center;
	color: #FFF;
	font-size: 16px;
	font-weight: bold;    
/*	background: #70a6ff #43994D; */
	background: #006428;
	border-radius: 50%;
	box-sizing: border-box;
}

.balloon-right-btm:before{
	content: "";
	position: absolute;
	bottom: -12px;
	right: -8px;
	margin-top: -15px;
	border: 15px solid transparent;
	border-left: 15px solid #006428;
	z-index: 0;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc_only { display: block !important; }
.sp_only { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 768px) {
.pc_only { display: none !important; }
.sp_only { display: block !important; }
}
/* 改行位置 */
@media screen and (min-width: 767px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
}
@media screen and (max-width: 767px){	
  .br-pc { display:none; }
  .br-sp { display:block; }
}


/* 記事掲載関連*/
.commentpanel{
    padding:0.5em;
    margin-top:0.5em;
    background-color:#f6f6f6;
    border-radius:0.3em;
    border:1px solid #ccc;
    line-height:1.6em;
}

.pc_only_posi{ margin-top:2em !important;}
@media only screen and (max-width: 768px) {
.pc_only_posi{ margin-top:0em !important;}
}

/* Font Awesomeの大きさ*/
.my-small {
  font-size: 1.5em 
  /*1.5倍の大きさに*/}
.my-small1 {
  font-size: 2.0em 
  /*1.5倍の大きさに*/}
.icon_color1{
    color:#dd4b39;
}
.icon_color2{
    color:#00b900;
}
.icon_color3{
    color:#3b5998;
}
.icon_color4{
    color:#337ab7;
}
.icon_color5{
    color:#00a4de;
}

/* Font Awesome hatena bookmark */
.fa-hatena:before {
    content: "B!";
    font-family: Verdana;
    font-weight: bold
}


/*ボタン*/
.square_btn{
    display: inline-block;
    margin-top:2em;
    padding: 0.5em 3em;
    text-decoration: none;
    background: #449d44;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #429942;
    border-radius: 3px;
    font-size:1.2em;
}
.square_btn:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

/*修サポ用CV*/
.square_btn2{
    display: inline-block;
    margin-top:0.5em;
    padding: 0.5em 0.5em ;
    text-decoration: none;
    background: #449d44;/*ボタン色　#88C888*/
    color: #FFF;
    border-bottom: solid 4px #429942;
    border-radius: 3px;
    font-size:1.12em;
    box-shadow: 0 5px 0 #147114;
}
.square_btn2::before{    
    font-family: "FontAwesome"; 
  /* content:  "修了予定の方限定！無料ｷｬﾝﾍﾟｰﾝ詳細はこちら \f105";*/
     content:  "｢修了生ｻﾎﾟｰﾄｼｽﾃﾑ｣の詳細はこちら　\f105";
    font-weight:bold;
}

.square_btn2 ::after {
  width: 5px;
  height: 5px;
  border-top: 3px solid #147114;
  border-right: 3px solid #147114;
  transform: rotate(45deg);
}
.square_btn2:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/   
    box-shadow:0 2px 0 #147114;
}
 /*

.square_btn2:hover,
.square_btn2:focus {
  color: #88C888;
}*/ 
    


/*修サポ用CV*/
a.square_btn2_2{    
    margin:0.5em 0em;
    padding: 0.5em 0.5em ;
    color: #ffffff;
    background-color: #449d44;
    border: solid 1px #449d44;
    display: inline-block;
    text-decoration: none;
    border-radius: 3px;
    font-size:1.2em;
    box-shadow: 0 5px 0 #147114;
}

a.square_btn2_2:hover{    
   color: #fff;
  background: #00a349;
}

a.square_btn2_2 ::after {
  width: 5px;
  height: 5px;
  border-top: 3px solid #147114;
  border-right: 3px solid #147114;
  transform: rotate(45deg);
}

@media only screen and (max-width: 768px) {
a.square_btn2_2{ font-size:1.0em;}
}

a.square_btn2_2::before{   
   /*  content:  "修了予定の方限定！無料キャンペーンの詳細はこちら　\f105";  */ 
    font-family: "FontAwesome";
   content:  "「ＴＫＣ法科大学院修了生サポートシステム」の詳細はこちら　\f105 ";
    font-weight:bold;
}
@media only screen and (max-width: 768px) {
a.square_btn2_2::before{
    font-family: "FontAwesome";
     white-space: pre;
     content:  "「TKC法科大学院修了生ｻﾎﾟｰﾄｼｽﾃﾑ」\A詳細はこちら　\f105 ";
    /* content: "修了予定の方限定！\A無料ｷｬﾝﾍﾟｰﾝの詳細はこちら \f105";*/}
}
 /*
.square_btn2_2:hover{
    margin-top:0.5em;
    padding: 0.5em 0.5em ;
    color: #449d44;
    background-color: #ffffff;
    border: solid 1px #449d44;
    display: inline-block;
    text-decoration: none;
    border-radius: 3px;
    font-size:1.12em;
}*/
 a.square_btn2_2:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/    
    box-shadow:0 2px 0 #147114;
}
 

/*修サポ用長い文字CV*/
.square_btn4{
    display: inline-block;
    margin-top:0.5em;
    padding: 0.5em 1em;
    text-decoration: none;
    background: #449d44;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #429942;
    border-radius: 3px;
    font-size:1.1em;
}

.square_btn4:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}


/*テスト用CV*/
.square_btn3{
    display: inline-block;
    margin-top:0.5em;
    padding: 0.5em 2em;
    text-decoration: none;
    background: #70a6ff;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #70a6ff;
    border-radius: 3px;
    font-size:1.2em;
    box-shadow: 0 5px 0 #4F75B3;
}

.square_btn3 ::after {
  width: 5px;
  height: 5px;
  border-top: 3px solid #4F75B3;
  border-right: 3px solid #4F75B3;
  transform: rotate(45deg);
}

.square_btn3:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く
    border-bottom: none;/*線を消す*/
    box-shadow:0 2px 0 #4F75B3;
}


/*解説閉じる用ボタン*/
a.square_greenbtn{
    display: inline-block;
    margin-top:0.5em;
    padding: 0.5em 1.5em;
    text-decoration: none;
    background: #094;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #094;
    border-radius: 5px;
    font-size:1.2em;
    box-shadow: 0 5px 0 #00662d;
}

a.square_greenbtn :hover{
    color: #fff;
  background: #00a349;
}
/*ボタンを押したとき
.square_greenbtn ::after {
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
}*/

a.square_greenbtn:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く
    border-bottom: none;/*線を消す*/
    box-shadow:0 2px 0 #00662d;
}


/*slickset*/
/*左右の矢印の色を変える*/
.slick-prev:before,
.slick-next:before {
    color: #9FA0A0;
}
/*左右の矢印の位置を変える*/
.slick-next {
    right: 20px;
    z-index: 99;
}
.slick-prev {
     left: 15px;
    z-index: 100;
}
/*スライド数のドットの色を変える*/
.slick-dots li.slick-active button:before,
.slick-dots li button:before {
    color: #fff;
}
/*スライド画像の横幅可変*/
img {
    max-width: 100%;
     height: auto;
}

/*見出し*/

.midashi {
padding: 0.5em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 6px #006428;/*左線 #7db4e6*/
}

.midashi2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #ffc107;/*左線*/
font-size:18px;
margin-bottom:-0.5em;
}

@media screen and (max-width: 767px){
.pconly{display:none;}}

/* マーカー */
.pink_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #FFDFEF 0%) repeat scroll 0 0;}
.blue_line{background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #70a6ff 0%) repeat scroll 0 0;}
.yellow_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 10%, #ffff7f   0%) repeat scroll 0 0;}
.yellow_line_2 {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffff7f   0%) repeat scroll 0 0;}

/* pagetopスクロール */
#page-top {
/*    position: fixed;
    bottom: 20px;*/
	 bottom: 4.0em; 
     position: fixed;

}

.circle{
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #70a6ff;
  text-align:center;
  line-height: 80px;
  vertical-align: middle;
  margin-left:74em;
}
@media screen and (max-width: 768px){	
  .circle { margin-left:19em;
            width: 50px;
            height: 50px;
            line-height: 60px;


  }
}


/* タブタイトル */
@media screen and (max-width: 768px){
    .title1{font-size:0px;
            }
    .title1:before {font-size:16px;
       content:"短答"; 
    }
    .title1_2{font-size:0px;}
    .title1_2:before {
        font-size:16px;
       content:"短答"; 
       color:#ffffff
    }
    .title2{font-size:0px;
            }
    .title2:before {
        font-size:16px;
       content:"論文"; 
    }
    .title2_2{font-size:0px;}
    .title2_2:before {
        font-size:16px;
       content:"論文"; 
       color:#ffffff
    }
    .title3{font-size:0px;
            }
    .title3:before {
        font-size:16px;
       content:"計画"; 
    }
    .title3_2{font-size:0px;}
    .title3_2:before {
        font-size:16px;
       content:"計画"; 
       color:#ffffff
    }
       
    .title4{font-size:0px;
            }
    .title4:before {
        font-size:16px;
       content:"直前"; 
    }
    .title4_2{font-size:0px;}
    .title4_2:before {
        font-size:16px;
       content:"直前"; 
       color:#ffffff
    }
   .title5{font-size:0px;
            }
    .title5:before {
       font-size:16px;
       content:"模試"; 
    }
    .title5_2{font-size:0px;}
    .title5_2:before {
        font-size:16px;
       content:"模試"; 
       color:#ffffff
    }
       .title6{font-size:0px;
            }
    .title6:before {
        font-size:16px;
       font-family: 'FontAwesome';
       content:"TOP"; 
    }
    .title6_2{font-size:0px}
    .title6_2:before {
        font-size:16px;
       content:"TOP"; 
       color:#ffffff
    }
.title7{font-size:0px;
            }
    .title7:before {
        font-size:16px;
       content:"コラム"; 
    }
    .title7_2{font-size:0px;}
    .title7_2:before {font-size:16px;
       content:"コラム"; 
       color:#ffffff
    }
    }
    

/* タブタイトル */

@media screen and (max-width:767px){
    .title10{font-size:0px!important;
            }
    .title10:before {
        font-size:16px;
       content:"短答"; 
    }
    .title10_2{font-size:0px!important;}
    .title10_2:before {
        font-size:16px;
       content:"短答"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title12{font-size:0px!important;
            }
    .title12:before {
        font-size:16px;
       content:"論文"; 
    }
    .title12_2{font-size:0px!important;}
    .title12_2:before {
        font-size:16px;
       content:"論文"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title13{font-size:0px!important;
            }
    .title13:before {
        font-size:16px;
       content:"計画"; 
    }
    .title13_2{font-size:0px!important;}
    .title13_2:before {
        font-size:16px;
       content:"計画"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title14{font-size:0px!important;
            }
    .title14:before {
        font-size:16px;
       content:"直前"; 
    }
    .title14_2{font-size:0px!important;}
    .title14_2:before {
        font-size:16px;
       content:"直前"; 
       color:#ffffff;
       background-color: #006428!important;
    }
   .title15{font-size:0px!important;
            }
    .title15:before {
        font-size:16px;
       content:"模試"; 
    }
    .title15_2{font-size:0px!important;}
    .title15_2:before {
        font-size:16px;
       content:"模試"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title16{font-size:0px!important;
            }
        .title16:before {
        font-size:16px;
       content:"TOP"; 
    }
    .title16_2{font-size:0px!important;}
    .title16_2:before {
        font-size:16px;
       content:"TOP"; 
       color:#ffffff;
       background-color: #006428!important;
    }

.title17{font-size:0px!important;
            }
    .title17:before {
       font-size:16px;
       content:"コラム"; 
    }
    .title17_2{font-size:0px!important;}
    .title17_2:before {
       font-size:16px;
       content:"コラム"; 
       color:#ffffff;
         background-color: #006428!important;
    }
   

.title18{font-size:0px!important;
            }
    .title18:before {
       font-size:16px;
       content:"判例"; 
    }
    .title18_2{font-size:0px!important;}
    .title18_2:before {
       font-size:16px;
       content:"判例"; 
       color:#ffffff;
         background-color: #006428!important;
    }
    }

@media screen and (min-width:768px) and (max-width:1365px){
    .title10{font-size:0px!important;
            }
    .title10:before {
        font-size:18px;
       content:"短答式"; 
    }
    .title10_2{font-size:0px!important;}
    .title10_2:before {
        font-size:18px;
       content:"短答式"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title12{font-size:0px!important;
            }
    .title12:before {
        font-size:18px;
       content:"論文式"; 
    }
    .title12_2{font-size:0px!important;}
    .title12_2:before {
        font-size:20px;
       content:"論文式"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title13{font-size:0px!important;
            }
    .title13:before {
        font-size:18px;
       content:"計画"; 
    }
    .title13_2{font-size:0px!important;}
    .title13_2:before {
        font-size:18px;
       content:"計画"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title14{font-size:0px!important;
            }
    .title14:before {
        font-size:18px;
       content:"直前"; 
    }
    .title14_2{font-size:0px!important;}
    .title14_2:before {
        font-size:18px;
       content:"直前"; 
       color:#ffffff;
       background-color: #006428!important;
    }
   .title15{font-size:0px!important;
            }
    .title15:before {
        font-size:18px;
       content:"模試"; 
    }
    .title15_2{font-size:0px!important;}
    .title15_2:before {
        font-size:18px;
       content:"模試"; 
       color:#ffffff;
       background-color: #006428!important;
    }
    .title16{font-size:0px!important;
            }
        .title16:before {
        font-size:18px;
       content:"TOP"; 
    }
    .title16_2{font-size:0px!important;}
    .title16_2:before {
        font-size:18px;
       content:"TOP"; 
       color:#ffffff;
       background-color: #006428!important;
    }

.title17{font-size:0px!important;
            }
    .title17:before {
       font-size:18px;
       content:"コラム"; 
    }
    .title17_2{font-size:0px!important;}
    .title17_2:before {
       font-size:18px;
       content:"コラム"; 
       color:#ffffff;
         background-color: #006428!important;
    }
   

.title18{font-size:0px!important;
            }
    .title18:before {
       font-size:18px;
       content:"判例"; 
    }
    .title18_2{font-size:0px!important;}
    .title18_2:before {
       font-size:18px;
       content:"判例"; 
       color:#ffffff;
         background-color: #006428!important;
    }

    
.title19{font-size:0px!important;
            }
    .title19:before {
       font-size:18px;
       font-family: "FontAwesome";
       content:"判例学習　\f0d7\A"; 
       margin-bottom:-0.5em;
    }
    .title19_2{font-size:0px!important;}
    .title19_2:before {
       font-size:18px;
       font-family: "FontAwesome";
       content:"判例学習 \f0d7\A"; 
       color:#ffffff;
         background-color: #006428!important;
    }
    }

 /*ナビゲーション仮*/
#menu{
  list-style-type: none;
  height: 40px;
  margin: 0 auto;
  padding: 8px 0;
   background: #006428;
  opacity: .84;
}
#menu li{
  position: relative;
  width: 10%;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
#menu li a{
  display: block;
  margin: 0;
  padding: 5px 0;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  text-decoration: none;
}
#menu li ul{
  list-style: none;
  position: absolute;
  top: 100%;
  left: 0;
  margin: 0;
    padding: 0;
}
#menu li:last-child ul{
  left: -100%;
  width: 100%
}
#menu li ul li{
  overflow: hidden;
  width: 200%;
  height: 0;
  color: #fff;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;
}
#menu li ul li a{
  padding: 13px 15px;
  background-color:#006428;
    color:#fff;
    opacity: .84;
  text-align: left;
  font-size: 12px;
  font-weight: bold;
}
#menu li:hover > a{
  background-color:#006428;
    color:#fff;
    opacity: .84;
}
#menu li:hover ul li{
  overflow: visible;
  height: 38px;
  border-bottom: 1px solid #fff;
}
#menu li:hover ul li:first-child{
  border-top: 0;
}
#menu li:hover ul li:last-child{
  border-bottom: 0;
}

    
  /*ナビゲーションスクロール*/
  .nav-horizontal{
    width:100%;
    /* overflow: hidden;*/
       }

      .mask {       
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;         
      border-bottom: 0.8px solid #006428;    
   /*  height:10em; ドロップダウンメニュー高さ*/
}
@media screen and (max-width: 768px) {
    .mask {             
      border-bottom: 1px solid #006428;
}
}

   .list{
     display: inline-table;
     max-width: 100%;
	text-align: center;
	margin:0;
	padding:0;

}
   .list li{
    display: table-cell;    
	white-space: nowrap;
}
   .list li:hover{   
       opacity: 0.54 ;
       font-weight: 500;
       color: #000;
}

   .list-tabs > li > a:hover {
  background-color: transparent;
  border-color: transparent;

}
   .list-tabs > li > a{       
       font-weight: 500;
       color: #000;       
       opacity: .84;
       }

.list-tabs > li > a{
   margin-right: 0;
  line-height: 1;
  text-transform: uppercase;
  border: none;
  border-radius: 0;
		display: block;
		}
   ::-webkit-scrollbar{
			display: none;
		  }

   
.list-tabs > li > ul{
  list-style: none;
  position: absolute;
  top: 100%;
  left: 0;
  margin: 0;
    padding: 0;
}
.list-tabs > li :last-child ul{
  left: -100%;
  width: 100%
}
.list-tabs > li > ul > li{
  overflow: hidden;
  width: 200%;
  height: 0;
  color: #fff;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;
}

.list > a,
.list > a:hover,
.list > a:focus,
.list > li > a:hover, 
.list > li > a:focus {
    
  background-color: transparent;
  border-color: transparent;
}

   .list-tabs > li {
  margin-bottom: 0;
}

   .list-tabs {
  border-bottom: none;
}

   .list > li > a {
  padding: 14px 16px 13px;
  font-size: 16px;
}

.list-tabs > li.active > a,
.list-tabs > li.active > a:hover,
.list-tabs> li.active > a:focus {
  color: inherit;
  cursor: default;
  background-color: transparent;
  border: none;
  border-bottom-color: transparent;
  opacity: 1;
}

.list-tabs > li > a {
  border-radius: 0;
}

.list-tabs > .active > a,
.list-tabs > .active > a:hover,
.list-tabs > .active > a:focus {
  border: none;
}
.list-tabs > li > a {
  border: none;
  border-radius: 0;
}

.list-tabs > li.active > a,
.list-tabs > li.active > a:hover,
.list-tabs > li.active > a:focus {
  color: #fff;
  background-color: #006428!important;
  opacity: .84; /*ナビゲーションの透明度*/
}
.box_outer{
    height:14em;
}
.box_inner{
    height:11em;
  margin-top: 4px;
  margin-bottom: 0px;
}
.box_item{
    white-space:nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
}
.box_footer {
    height:1em;
}
.box_title{
    font-weight:600;
  /* opacity:.7; */
    opacity:.9;
    margin-top:0.25rem;
    margin-bottom:0.25rem;
}

.box_title2{
  /* opacity:.7; */
    opacity:.9;
    margin-top:0.25rem;
    margin-bottom:0.25rem;
    font-size:1.125rem;
}

.box_title3{
  /* opacity:.7; */
    opacity:.9;
    margin-top:0.25rem;
    margin-bottom:0.25rem;
    font-size:1.025rem;
}

.box_title4{
  /* opacity:.7; */
    opacity:.9;
    margin-top:0.25rem;
    margin-bottom:0.25rem;
    font-size:0.90rem;
}

.box_outer_main{
    height:13em;
}
@media screen and (max-width: 768px) {
 .box_outer_main{
     height:12em;
}
}

.box_info{
    height:13em;
}
@media screen and (max-width: 768px) {
 .box_info{
     height:13em;
}
}


.box_outer_ranking{
    height:6.0em;
}
@media screen and (max-width: 768px) {
 .box_outer_ranking{
     height:4.5em;
}
}

.box_outer_trial{
    height:3.5em;
}
@media screen and (max-width: 768px) {
 .box_outer_trial{
     height:4.5em;
}
}




.box_inner_main{
    max-height:4.1em;
    min-height:4em;
    
    overflow-y:hidden;
  margin-top: 4px;
  margin-bottom: 0px;
  padding-bottom:4px;
}
.box_item_main{
    overflow:hidden;
}
.box_footer_main {
    height:1em;
}
.box_footer_main1 {
    
    margin-bottom:0.3em;
    margin-top:-2.0em;
}
.box_title_main{
/*    font-weight:600;*/
    margin-top:0.5rem;
    margin-bottom:0.5rem;
/*
    height:9em;
*/
}

.box_footer_main2 {
    margin-top:-2.8em;
    height:2em;
}


@media screen and (max-width: 768px) {
 .box_footer_main2{     
    margin-top:-3.5em;
    height:2em;
}
}

.fixed-bottom{
      bottom: 2.5em;
position:fixed;
}

.conversion{
    background-color:rgba(207,216,220,.84);
}
.conversion1{
    background-color:rgba(207,216,220,.84);
    margin-top:1em;
  /*  position:fixed;
    width: 100%; 
    z-index: 1500;
    bottom: 0em　コンテンツ改善*/
}

.label_success {
    background-color:#5cb85c;
    margin-right:0.25em;
/*    display:inline-block;*/
}
.label_danger {
    background-color:#f44336;
    margin-right:0.25em;
/*    display:inline-block;*/
}
.label_info {
    background-color: #FF8400; 
    color:#0c5460;
    margin-right:0.25em;
/*    display:inline-block;　#17a2b8*/
}
.fuchi05 {
    text-shadow: 0.5px 0.5px 0.5px #263238,0.5px -0.5px 0.5px #263238,-0.5px 0.5px 0.5px #263238,-0.5px -0.5px 0.5px #263238;
    color:#fff;
}

.progress{
    height:1.15em;
    vertical-align:middle;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
    display: block;/*カバーを表示*/
    opacity: .5;
}

#nav-input:checked ~ .sidebar {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);/*中身を表示*/
}
/*閉じる用の薄黒カバー*/
#nav-close {
    display: none;/*はじめは隠しておく*/
    position: fixed;
    z-index: 99;
    top: 0;/*全体に広がるように*/
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0;
    transition: .3s ease-in-out;
}
.sidebar {
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    display:block;
    overflow-x:hidden;
    overflow-y:hidden;
    z-index:9999; /*z-index:100;*/
    min-height:100%;
        transition: .3s ease-in-out;
        /*滑らかに表示*/
        -webkit-transform: translateX(-105%);
        transform: translateX(-105%);/*左に隠しておく*/
overflow-y:scroll;
background-color:#fff;
}

.nav-unshown{
    display:none;
}

.nav .nav-divider {
  margin: 5px 0;
}
.pmd-list .list-group-item {
  padding-top: 5px;
  padding-bottom: 5px;
}
.list-group {
  margin-bottom: 0px;
  padding-left: 0;
}
.pmd-card-list {
  padding-top: 4px;
  padding-bottom: 4px;
}
.pmd-card-body {
  margin-top: 8px;
  margin-bottom: 8px;
  color: rgba(0, 0, 0, .84);
}

.pmd-card-footer {
  padding: 5px 5px;
  bottom:0;
}

.pmd-card-title {
  padding: 5px 16px 0 16px;
  margin-bottom: 5px;
}


label {
  display: inline;
  margin-bottom: 0px;
}
.modal .modal-body {
  height:60vh;
  overflow-y:scroll;
  overflow-x:hidden;
}

.modal .modal-hanreibody {
  height:60vh;
  overflow-y:scroll;
  overflow-x:hidden;
}
@media screen and (min-width: 768px)  and (max-width:1024px){
    .modal .modal-hanreibody {
  height:30vh;
}
}

.modal.fade .modal-dialog {
    -webkit-transition: -webkit-transform .025s ease-out;
    -o-transition: -o-transform .025s ease-out;
    transition: transform .025s ease-out;
}
.modal.in {
  transition-duration: .025s;
}

.modal-open {
    overflow: visible;
    position:static;

}
.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
  height: 100%;
}

.overflow_auto {
    overflow: hidden;
}
.meiryo {
    font-family:'Meiryo UI';
    font-weight:bold;
}
.labelLarge {
    font-style:normal;
    border-radius:2px; 
    padding: 4px 15px;
    margin: 5px 1px;
    font-size:24px;
    color:#fff;
}

.pagetop {
	 bottom: 4.0em;   
     position: fixed;
}
/*コンテンツ改善（CV)
@media screen and (max-width: 768px)  {
.pagetop {
	 bottom: 10.0em;   
}
}*/
.pagetop a {
	opacity: 0.5;
}
.pagetop a:hover {
	opacity: 0.5;
}

.label_yellow{
   color: #505050;
    background-color:#fff9c4;
}
.label_amber{
   color: #505050;
    background-color:#ffe082;
}
.label_deepOrange{
   color: #505050;
    background-color:#ffab91;
}
.label_indigo{
   color: #505050;
    background-color:#c5cae9;
}
.label_pink{
   color: #505050;
    background-color:#f8bbd0;
}
.label_seihakuji{
   color: #505050;
    background-color:#BFE3E3;
}

.label_green{
   color: #505050;
    background-color:#bfe3bf;
}


/*「もっと見る」*/
.grad-btn {
    line-height: 2.5rem;
	position: absolute;
	z-index: 2;
    margin-top:5px;
	left: 50%;
	width: 10rem;
    margin-bottom:2em;
	transform: translate(-50%, 0);
	border-radius: 20px;
	background-color:#006428;
    opacity: .84;
     /*    #2D8F59;*/
}
.grad-btn::before {    
	font-family: FontAwesome;
    content:  "\f13a"" もっと解く";  
	letter-spacing: 0.05em;
    margin-left:2em;
    color: #ffffff;
      
}
.grad-item {
  position: relative;
  overflow: hidden;
  height: 0px; /*隠した状態の高さ*/  
  margin-bottom:2em;
}
.grad-item::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70px; /*グラデーションで隠す高さ*/
  background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%);
  content: "";
}
.grad-trigger {
  display: none; 
  /*チェックボックスは常に非表示*/
}
.grad-trigger:checked ~ .grad-btn::before {
  font-family: FontAwesome;
  content: "\f139"" 閉じる" ;
  letter-spacing: 0.05em;
    margin-left:2.5em;
    color: #ffffff; 
    top:10px;     
  /*チェックされていたら、文言を変更する*/
}
.grad-trigger:checked ~ .grad-item {
  height: auto; /*チェックされていたら、高さを戻す*/  
  top:3.5em; 
  margin-bottom:2em;
}
.grad-trigger:checked ~ .grad-item::before {
  display: none; /*チェックされていたら、grad-itemのbeforeを非表示にする*/
}

/* ヘルプ */
      .help-number1 {       
      font-size:1.2em;  
}
            .help-number1:after {
    content:'③設問の正解率について';}
@media screen and (max-width: 768px) {
      .help-number1 {       
      font-size:1.2em;  
}
            .help-number1:after {
    content:'④設問の正解率について';}
}



.icon_btn {
  display: inline-block;
  background-image: none;
  background-color: #004D45;
  margin-bottom:-0.2em;
  color: #fff;
  text-decoration: none;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  -webkit-appearance: none;
  box-shadow: 1px 1px 3px 0 rgba(0,0,0,.2);
}
.icon_btn:hover,
.icon_btn:focus {
  outline: none;
 /* background: #00bcd4;
  color: white;*/
}

/* マウスオーバー */
.btn-opacity:hover {
  opacity: .4;
}


div.seminar_info {   /* セミナー情報 */
 width: 100%;
 background-color: #ffffff;
border: 1px #cccccc solid;
box-shadow: 0px 0px 5px 5px #e6ebf2;
line-height: 35px;
 }

div.seminar_info header {
  border-left :solid 5px #006428;
  margin:0.3em;
  /*余白をつけておきます*/
  padding: 1px 5px;
  font-weight:bold;
  font-size:0.9em;
  line-height: 25px;
 }

div.seminar_info p {
 margin: 0; 
 line-height: 15px;  
 font-size: 0.8em;
 color:#416bbf;
 font-weight:bold;
  padding-left: 2.5em;
 }


div.seminar_info span {
 margin: 2em 1em;
 line-height: 15px;
 color: #505050;
    background-color:#BFE3E3;
    font-size:0.7em;
    text-align:center;
    padding:0.2em 5em 0.2em 5em;
 }





/* ページ送り */
.pager {
    overflow: hidden;
}
 
.pager ul {
    list-style: none;
    position: relative;
    left: 50%;
    float: left;
}
 
.pager ul li {
    margin: 0 1px;
    position: relative;
    left: -50%;
    float: left;
}
 
.pager ul li span,
.pager ul li a {
    display: block;
    font-size: 14px;
    padding: 0.6em 1em;
    border-radius: 3px;
}
 
.pager ul li a {
    background: #EAF5EF;
    color: #000;
    text-decoration: none;

}
 
.pager ul li a:hover {
    color: #fff;
  background-color: #006428!important;
  opacity: .84;
}

@media screen and (max-width: 768px) {
    .pager ul {
    list-style: none;
    position: relative;
    left: 10%;
    float: left;
}
 
.pager ul li {
    margin: 0 1px;
    position: relative;
    left: -10%;
    float: left;
}

.pager ul li span,
.pager ul li a {
    display: block;
    font-size: 11px;
    padding: 0.6em 1em;
    border-radius: 3px;
}
 
.pager ul li a {
    background: #EAF5EF;
    color: #000;
    text-decoration: none;

}
 
.pager ul li a:hover {
    color: #fff;
  background-color: #006428!important;
  opacity: .84;
}
}


div.ranking {   /* 人気記事ランキング */
 width: 100%;
 background-color: #ffffff;
border: 1px #cccccc solid;
line-height: 50px;
padding:5px;
margin-top:0.5em;
 }



div.ranking p {
 margin: 0; 
 line-height: 15px;  
 font-size: 0.85em;
 font-weight:bold;
  padding-left: 1.5em;
  margin-bottom:0.5em;
 }


div.ranking span {    
  padding-top:-2.0em;
    font-size:1.2em;
    font-weight:bold;
 }


 .rank1{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.9em */
 }
 .rank1:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'答えを覚える"繰り返し"は意味がない \f128\f12a\A 「択一六法」を使った足切り回避策';}

  .rank1_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .rank1_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2021年度 上智大学･既修 2017年';}

@media screen and (max-width: 768px) {
    .rank1_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .rank1_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .rank1_label:after{     
    content:'短答式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#fff9c4;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .rank1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .rank1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .rank1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}


  .rank2{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
   font-size:0.90em; /* 0.90emへ修正 */
 }
 .rank2:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'｢肢別本｣は、解いた方がいい \f128\A  ｢短答過去問パーフェクト｣との使い分け';}


 
  .rank2_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .rank2_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2018年度 予備試験合格';}

@media screen and (max-width: 768px) {
    .rank2_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .rank2_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .rank2_label:after{     
    content:'短答式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#fff9c4;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .rank2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .rank2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .rank2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



   .rank3{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
   font-size:0.9em;
 }
 .rank3:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'【最新版】2021年度合格者が選んだ \f12a\A おすすめ参考書と選び方・使い方のポイント';}

  
  .rank3_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .rank3_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2021年度 慶應義塾大学･既修 2021年';}

@media screen and (max-width: 768px) {
    .rank3_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .rank3_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .rank3_label:after{     
    content:'論文式試験';        /* 短答式試験　論文式試験　学習計画　 本試験直前*/
    height:2em;
    background-color:#ffe082;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .rank3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .rank3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .rank3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



    .rank4{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
   font-size: 0.9em;
 }
 .rank4:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'過去問題を解いた後の復習は \f128\A 本試験当日まで使える、まとめﾉｰﾄの作り方';}

  
  .rank4_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .rank4_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2020年度 京都大学･既修 2020年';}

@media screen and (max-width: 768px) {
    .rank4_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .rank4_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .rank4_label:after{     
    content:'論文式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#ffe082;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .rank4_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .rank4_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .rank4_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}


 .rank5{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
   font-size:0.9em;
 }
 .rank5:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'「判例百選」を使い倒せ \f12a\A アウトプットできるまでが勝負のカギ';}

   
  .rank5_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .rank5_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2017年度 大阪市立大学･既修 2013年';}

@media screen and (max-width: 768px) {
    .rank5_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .rank5_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .rank5_label:after{     
    content:'論文式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#ffe082;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .rank5_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .rank5_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .rank5_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}


.guide {
    background: url('../images/banner2206.png');/* campaign2003.png　 */
    width:50%;
     height: 80px;
     margin-left:-7em;
     margin-top:1em;
      background-size:cover; 
}

@media only screen and (min-width:1024px) and (max-width: 1365px) {
     .guide { 
 width:60%;
     height: 100px;
     margin-left:1.5em;
     margin-top:1.5em;

}
}


@media only screen and (min-width: 768px) and (max-width: 1023px) {
     .guide { 
 width:65%;
     height: 100px;
     margin-left:1.5em;
     margin-top:1.5em;

}
}

@media only screen and (min-width:321px) and (max-width: 767px) {
     .guide { 
 width:100%;
     height: 100px;
     margin-left:0.2em;
     margin-top:0.5em;

}
}

 @media screen and (min-width: 320px) {
     .guide { 
 width:100%;
     height: 50px;
     margin-left:0.2em;
     margin-top:0.5em;

}
}





 div.guide { /* 記事内CV　修サポガイド */
FONT-SIZE:10%;/* 修サポガイド 100% */
BORDER: #191970 1px solid;
WIDTH:  70%;
margin:1.5em 0 -1.5em 0;
background: #FFFFFF url("../images/title-2.png") no-repeat right;
}

 
 @media screen and (max-width: 767px) {
     div.guide { 
WIDTH:  100%;

}
}

  .title_left03_posi { 
      margin-left:5.0em;
      margin-top: 1.5em
}
 @media screen and (max-width: 767px) {
   .title_left03_posi { 
       margin-left:0.2em;
}
}

 /* 模試チャレンジ解説・参考記事 */

div.trial {   
 width: 100%;
 background-color: #ffffff;
border: 1px #cccccc solid;
line-height: 50px;
padding:5px;
margin-top:0.5em;
text-align:left!important;
 }



div.trial p {
 margin: 0; 
 line-height: 15px;  
 font-size: 0.85em;
 font-weight:bold;
  padding-left: 1.5em;
  margin-bottom:0.5em;
 }


div.trial span {    
  padding-top:-2.0em;
    font-size:1.2em;
    font-weight:bold;
 }


.box_footer_moshi {
    margin-top:-4.5em;
    text-align:right;
    height:2em;
}


@media screen and (max-width: 768px) {
 .box_footer_moshi{     
    margin-top:-3.5em;
    height:2em;
}
}

 /* 解説掲載・記事 */

 /* 判例．Ver　1 */
 .hanrei1{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }
 .hanrei1:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' 試験時間内に答案を書ききれない \f128\f12a\ まだ間に合う、「途中答案」を防ぐ訓練法';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.hanrei1:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' 試験時間内に答案を書ききれない \f128\f12a\A まだ間に合う、「途中答案」を防ぐ訓練法';}
}


  .hanrei1_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .hanrei1_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2021年度 立命館大学･既修 2021年';}

@media screen and (max-width: 768px) {
    .hanrei1_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .h1_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .h1_label:after{     
    content:'論文式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#ffe082;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .h1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .h1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .h1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}


 /* 判例．Ver　2 */
 .hanrei2{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .hanrei2:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' これさえできれば1500位以内 \f128\f12a\ 盤石な基礎固めこそ合格への近道';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.hanrei2:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' これさえできれば1500位以内 \f128\f12a\A 盤石な基礎固めこそ合格への近道';}
}


  .hanrei2_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .hanrei2_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2016年度 中央大学･既修 2016年';}

@media screen and (max-width: 768px) {
    .hanrei2_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .h2_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .h2_label:after{     
    content:'論文式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#ffe082;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .h2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .h2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .h2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



 /* 判例．Ver　3 */
 .hanrei3{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .hanrei3:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'"繰り返す"からこそ意味がある \f12a\ 過去問＆模試の"繰り返し"学習のコツ';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.hanrei3:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'"繰り返す"からこそ意味がある \f12a\A 過去問＆模試の"繰り返し"学習のコツ';}
}


  .hanrei3_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .hanrei3_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2020年度 明治大学･既修 2020年';}

@media screen and (max-width: 768px) {
    .hanrei3_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .h3_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .h3_label:after{     
    content:'短答式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#fff9c4;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .h3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .h3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .h3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



 /* 判例．Ver　4 */
 .hanrei4{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .hanrei4:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'社会人でも働きながら合格できる \f128\　「選択と集中」で、勉強時間を作り出そう';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.hanrei4:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'社会人でも働きながら合格できる \f128\A 「選択と集中」で、勉強時間を作り出そう ';}
}


  .hanrei4_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .hanrei4_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2018年度 予備試験合格';}

@media screen and (max-width: 768px) {
    .hanrei4_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .h4_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .h4_label:after{     
    content:'学習計画';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#c5cae9;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .h4_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .h4_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .h4_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



 /* 判例．Ver　5 */
 .hanrei5{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .hanrei5:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'過去問の使い方、実は間違えているかも \f128\　短答試験を突破する、効果的な取り組み方';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.hanrei5:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'過去問の使い方、実は間違えているかも \f128\A 短答試験を突破する、効果的な取り組み方';}
}


  .hanrei5_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .hanrei5_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2020年度 明治大学･既修 2020年';}

@media screen and (max-width: 768px) {
    .hanrei5_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .h5_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .h5_label:after{     
    content:'短答式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#fff9c4;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .h5_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .h5_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .h5_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



 /* 判例．Ver　6 */
 .hanrei6{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .hanrei6:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' 肢別本を解くなら、どう使う \f128\ 過去問との使い分け＆学習ツール活用法';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.hanrei6:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'肢別本を解くなら、どう使う \f128\A 過去問との使い分け＆学習ツール活用法 ';}
}


  .hanrei6_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .hanrei6_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2019年度 立教大学･未修 2019年';}

@media screen and (max-width: 768px) {
    .hanrei6_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .h6_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .h6_label:after{     
    content:'短答式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#fff9c4;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .h6_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .h6_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .h6_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}

 /* 条文．Ver　1 */
 .jobun1{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .jobun1:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' 過去問題から始めることが、本当に正解 \f128\ 短答式試験を突破できない、意外な原因とは';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.jobun1:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' 過去問題から始めることが、本当に正解 \f128\A 短答式試験を突破できない、意外な原因とは';}
}


  .jobun1_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .jobun1_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2020年度 上智大学･既修 2018年';}

@media screen and (max-width: 768px) {
    .jobun1_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .j1_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .j1_label:after{     
    content:'短答式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#fff9c4;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .j1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .j1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .j1_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}


 /* 条文．Ver　2 */
 .jobun2{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .jobun2:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'12月にやっておくべき勉強とは \f128\ "やりたくない"苦手なことは、年内に克服しよう';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.jobun2:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:'12月にやっておくべき勉強とは \f128\A "やりたくない"苦手なことは、年内に克服しよう';}
}


  .jobun2_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .jobun2_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2019年度 早稲田大学･既修 2018年';}

@media screen and (max-width: 768px) {
    .jobun2_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .j2_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .j2_label:after{     
    content:'学習計画';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#c5cae9;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .j2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .j2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .j2_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}



 /* 条文．Ver　3 */
 .jobun3{
 color:#287b48;
 font-weight:bold;
  padding-left: 0.5em;
  font-size:0.9em; /* 0.85em */
 }

 .jobun3:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' ｢司法試験｣を難しく捉えていませんか \f128\ 受験生が陥りやすい学習方法とは';}/* !（f12a\）？（\f128\A） */
 @media screen and (max-width: 768px) {
.jobun3:after {
 font-family: "FontAwesome";
 white-space: pre ;
 content:' ｢司法試験｣を難しく捉えていませんか \f128\A 受験生が陥りやすい学習方法とは';}
}


  .jobun3_name{
    font-size:0.8rem!important;
    margin-top:-1.5em!important;
    padding-bottom:-1.0em!important;
 }

 .jobun3_name:after{     
 font-family: "FontAwesome";
 content:'\f118\A 2016年度 京都大学･既修 2016年';}

@media screen and (max-width: 768px) {
    .jobun3_name {
        font-size: 0.6rem !important;
        margin-top: -2.0em !important;
    }
}

  .j3_label{      
    font-size:0.65rem!important; 
    font-weight:bold;  
    margin-top:-3.5em!important; 
 }  
    .j3_label:after{     
    content:'論文式試験';        /* 短答式試験　論文式試験　学習計画　本試験直前 */
    height:2em;
    background-color:#ffe082;   /* 短答#fff9c4　論文#ffe082　計画#c5cae9　直前#f8bbd0　 */
    padding:0.5em 1.0em;
    text-align:left;
    }

    
@media screen and (max-width: 767px) {
    .j3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;
        float:right!important;
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .j3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;      
        margin-left:20em;    
    }
}

@media screen and (min-width:1024px) and (max-width:1024px) {
    .j3_label {
    margin-top:0.2em!important;
        font-size: 0.6rem !important;
        height:2.5em;        
    }
}

ol {
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  padding:0.5em;
  background: #f5faff;
}
ol li {
  position: relative;
  padding-left: 30px;
  line-height: 1.5em;
  padding: 0.5em 0.5em 0.5em 30px;
}

ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display:inline-block;
  background: #006428;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*以下 上下中央寄せのため  
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);*/
}

.number{
  /*以下数字のデザイン変える*/
  display:inline-block;
  background: #006428;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*以下 上下中央寄せのため*/
  margin-right:0.5em;
}