@charset "utf-8";
/*--------------------------------------------------------

	style

	01. forPC Layout

	02. forSP Layout

--------------------------------------------------------*/




/********************************************************************************

	01. forPC Layout

********************************************************************************/


/* ============================================================ firstview */
/* 書目を追加する時に供給本コードを使ってclass名を設定／追加する .firstview_wrap_*****  */
.firstview_wrap_16650{
  background: url(../../assets/img/16650/bg_firstview_wrap.jpg) center center;
  background-size: cover;
}
.firstview_wrap_16651{
  background: url(../../assets/img/16651/bg_firstview_wrap.jpg) center center;
  background-size: cover;
}
.firstview_wrap_16652{
  background: url(../../assets/img/16652/bg_firstview_wrap.jpg) center center;
  background-size: cover;
}

.firstview_wrap_16773{
  background: url(../../assets/img/16773/bg_firstview_wrap.jpg) center center;
  background-size: cover;
}
.firstview_wrap_16774{
  background: url(../../assets/img/16774/bg_firstview_wrap.jpg) center center;
  background-size: cover;
}

/* ============================================================ cat_content */
.nav_subject_menu_ttl {
    background-color: #37a514;
}
.nav_subject_menu .contents_list_item {
    background-color: #ecf6e8;
    border: 1px solid #37a514;
}
.nav_subject_menu .contents_list_item a {
    color: #37a514;
}
.nav_subject_menu .contents_list_item:before {
    border-bottom: 5px solid #8bc679;
}
.nav_subject_menu .contents_list_item:hover:before {
    border-bottom: 5px solid #8bc679;
    border-color: #8bc679;
}

.tab_area li{background:#ecf6e8;}

.tab_area li:hover {
  background: #37a514;
}
.tab_area li.select{
  /*アクティブタブの装飾*/
  /*border-left: 1px solid #37a514;
  border-right: 1px solid #37a514;*/
}
.tab_area li.select:before{
    border-color: #37a514;
}
.tab_area li.select:hover {
  background: #37a514;
}
.tab_area li.select:hover:before {
/*    background: #8bc679;*/
}

.tab_area_active .tab_area li.select{
/*  background-color:#37a514;*/
}
.tab_area_active .tab_area li.select:before {
/*    background: #8bc679;*/
}

#sub_cat h2.head_2_01:after {
    background: #37a514;
}
#sub_cat h2.head_2_02:after {
    background: #37a514;
}
#sub_cat h2.head_2_03:after {
    background: #8bc679;
}
#sub_cat h3.head_3_01 {
  background: #d2e9cb;
  border-bottom: 2px solid #37a514;
}
#sub_cat h3.head_3_02 {
  background: #d2e9cb;
}
#sub_cat h3.head_3_03:after {
  background: #8bc679;
}

#sub_cat h3.head_04:after {
    background: #8bc679;
}

#sub_cat h4.head_4_01 {
  background: #d2e9cb;
}

.feature_panel .feature_panel_head .text{
  background: #37a514;
}
.feature_panel .feature_panel_head .number{
  border: 2px solid #37a514;
  color: #37a514;
}
.feature_panel .feature_panel_inner {
  box-shadow: 15px 15px 0 #d2e9cb;
}
.feature_panel .feature_panel_main .text {
  margin-top: 8px;
}
.feature_panel .feature_panel_main .text li:before {
  background: #8bc679;
  /* display: none; */
}
.feature_panel .feature_panel_main .text li {
  /* padding: 0 0 0 0; */
}
.feature_panel .feature_panel_link .head{
  background: #37a514;
}

.download_panel_01 .download_panel_head:after {
    background: #37a514;
}
.download_panel_02 .download_panel_inner {
  background: #d2e9cb;
}
.download_panel_02 .download_panel_main li:before {
    border-bottom: 1px solid #37a514;
}

.movie_panel_01 a{
    position: relative;
    display: block;
}
.movie_panel_01 a:after {
    content: "";
    height: 60px;
    width: 60px;
    background: url(../img/common/icon_play.svg) no-repeat;
    background-size: 60px 60px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: .9;
}

.list_panel_main li:after {
    background: #8bc679;
}

.nav_panel_02_dmaster .nav_panel_main li a:before {
  background: url(../img/common/icon_disc_dmaster.svg) no-repeat;
}
.nav_panel_02_digitalbook .nav_panel_main li a:before {
  background: url(../img/common/icon_book_digital.svg) no-repeat;
}

.text_panel_01 .text_panel_inner {
  border-top: 5px solid #d2e9cb;
  box-shadow: 15px 15px 0 #d2e9cb;
}
.text_panel_02 .text_panel_inner {
  border-top: 5px solid #d2e9cb;
}
.text_panel_04 .text_panel_main li:before {
    background: #8bc679;
}

/* ============================================================ btn */
.btn_wrap .btn span:before {
    border-bottom: 5px solid #8bc679;
}
.btn_wrap .btn span:hover:before {
    border-bottom: 5px solid #37a514;
    border-color: #37a514;
}
.btn_wrap .btn span:after {
    background-color: #37a514;
}
/* ============================================================ toggle_btn */
.toggle_btn_wrap .btn .text:after {
    background-color: #37a514;
}
.toggle_btn_wrap .btn .icon:after {
    border-top: 2px solid #37a514;
    border-right: 2px solid #37a514;
}





/* ============================================================== ■■■ リンクボタン 追加クラスここから　*/
.btn_link {
  margin : 15px auto 65px auto ;
  width: 540px;
  height: 72px;
  text-align: center;
}
a.btn_link_on {
  text-align: center;
  transition: all  0.25s ease;
}
.btn_link a.btn_link_on:link{
  display :block ;
  width: 540px;
  height: 72px;
  border: 1px solid #ccc;
  background: url(../../assets/img/common/arr_link.svg) 488px center rgba(255, 255, 255, 0.6) ;
  background-size : 20px 20px ;
  background-repeat : no-repeat ;
  background-blend-mode:lighten;
  font-size : 17px; 
  line-height : 72px ;
  color:#333 ;
}
@media all and (-ms-high-contrast: none) {
  .btn_link a.btn_link_on:link {
    background: url(../../assets/img/common/arr_link_off.svg) 488px center ;
    background-size : 20px 20px ;
    background-repeat : no-repeat ;
  }
}
.btn_link a.btn_link_on:visited {
  border: 1px solid #ccc;
  color:#333 ;
} 
.btn_link a.btn_link_on:hover {
  border: 1px solid #379214;
  background: url(../../assets/img/common/arr_link.svg) 488px center rgba(255, 255, 255, 0);
  background-size : 20px 20px ;
  background-repeat : no-repeat ;
  color:#379214 ;
}
@media all and (-ms-high-contrast: none) {
  .btn_link a.btn_link_on:hover {
    background: url(../../assets/img/common/arr_link.svg) 488px center ;
    background-size : 20px 20px ;
    background-repeat : no-repeat ;
  }
}
.hp_mab {
  margin-bottom: 100px !important; 
}
/* ============================================================== ■■■ リンクボタン 追加クラスここまで　*/
/* ============================================================== ■■■ 学習者用デジタル教科書 追加クラスここから　*/
.list_panel_02 .list_panel_main {
    display: flex;
    flex-wrap: wrap;
    font-size: 18px;
}
.list_panel_02 .list_panel_main li {
    width: 100%;
    padding: 0 0 10px .7em;
}
.list_panel_02 .list_panel_main li:after {
    top: 13px;
}
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, 
.list_panel_02 .list_panel_main li:after {
    top: 10px;
}
/* IE11 */
}
.image_panel_01 .image_panel_main {
    display: flex;
    flex-wrap: wrap;
}
.image_panel_inner{
}
.image_panel_01 .image_panel_main {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 814px;
    margin: 0 auto;
    padding: 25px;
    border: 1px solid #e6e6e6;
}
.btn_wrap .btn .text_01 {
    font-size: 19px;
}
/* ============================================================== ■■■ 学習者用デジタル教科書 追加クラスここまで　*/
/* ============================================================== ■■■ 関連資料 追加クラスここから　*/
.text_panel_inner__wd {
  width :100%  !important;
}
.kanrenshiryou {
  width : 100% ;
}
.kanrenshiryou .th_1 {
  padding : 20px 15px 20px 10px ;
  width : 60% ;
/*border :1px #f4f4f4 dotted ;*/
  border-bottom :1px #e1e1e1 solid ;
  vertical-align : middle ;
  font-size :19px ;
}
.kanrenshiryou tr:last-child .th_1 {
  border:none ;
}
.kanrenshiryou .td_1 {
  padding : 13px 10px ;
  width : 18% ;
/*border :1px #f4f4f4 dotted ;*/
  border-bottom :1px #e1e1e1 solid ;
  font-size :13px ;
  text-align : center ;
  vertical-align : middle ;
}
.kanrenshiryou tr:last-child .td_1 {
  border:none ;
}
.kanrenshiryou .td_1 .date {
  padding: 0 0 0 5px ;
  font-size :16px ;
  color: #4b68af;
}
.kanrenshiryou .td_2 {
  padding : 13px 5px ;
  width : 19% ;
/*border :1px #f4f4f4 dotted ;*/
  border-bottom :1px #e1e1e1 solid ;
  text-align :center ;
  vertical-align : middle ;
}
.kanrenshiryou .td_2 img{
  margin : 6px 10px 0 10px ;
  height: auto;
}
.kanrenshiryou tr:last-child .td_2 {
  border:none ;
}
/* ============================================================== ■■■ 関連資料 追加クラスここまで　*/
/* ============================================================== ■■■ その他 追加クラスここから　*/
.title__2 {
  margin : 0 0 0 -25px ;
}
.tag_nado1 img {
  position:relative; top: -3px;
  vertical-align : bottom !important;
  width: 14px !important;
  height:14px !important;
}
@media all and (-ms-high-contrast: none) {
  .tag_nado1 img {
    position:relative; top: -5px;
  }
}
.tag_nado2 img {
  position:relative; top: -4px;
  vertical-align: bottom !important;
  width: 16px !important;
  height:16px !important;
}
@media all and (-ms-high-contrast: none) {
  .tag_nado2 img {
    position:relative; top: -10px;
  }
}
.pc {
  display:block ;
}
.sp {
  display:none ;
}


#sub_cat .text_sample {
  width: 315px;
}







.hp_txt50p { font-size: 50% !important; }
.hp_txt60p { font-size: 60% !important; }
.hp_txt70p { font-size: 70% !important; }
.hp_txt75p { font-size: 75% !important; }
.hp_txt80p { font-size: 80% !important; }
.hp_txt85p { font-size: 85% !important; }
.hp_txt90p { font-size: 90% !important; }
.hp_txt95p { font-size: 95% !important; }
.hp_txt97p { font-size: 97% !important; }
.hp_txt110p { font-size: 110% !important; }
.hp_txt120p { font-size: 120% !important; }
.hp_txt130p { font-size: 130% !important; }

.hp_mat30p { margin-top: 30px !important; }
.pc_txtnowrap { white-space: nowrap; }
/* ============================================================== ■■■ その他 追加クラスここまで　*/







/********************************************************************************

	02. forSP Layout
    *横幅が1025px以下の場合


********************************************************************************/

@media screen and (min-width: 0px) and (max-width: 1026px) {



/* ============================================================ firstview */
/* 書目を追加する時に供給本コードを使ってclass名を設定／追加する .firstview_wrap_*****  */
.firstview_wrap_16650 {
    background: url(../../assets/img/16650/bg_firstview_wrap_sp.jpg) center 40px no-repeat;
    background-size: cover;
}
.firstview_wrap_16651{
    background: url(../../assets/img/16651/bg_firstview_wrap_sp.jpg) center 40px no-repeat;
    background-size: cover;
}
.firstview_wrap_16652{
    background: url(../../assets/img/16652/bg_firstview_wrap_sp.jpg) center 40px no-repeat;
    background-size: cover;
}

.firstview_wrap_16773 {
    background: url(../../assets/img/16773/bg_firstview_wrap_sp.jpg) center 40px no-repeat;
    background-size: cover;
}
.firstview_wrap_16774{
    background: url(../../assets/img/16774/bg_firstview_wrap_sp.jpg) center 40px no-repeat;
    background-size: cover;
}

.feature_panel .feature_panel_inner {
    box-shadow: 12px 12px 0 #d2e9cb;
}

.text_panel_01 .text_panel_inner {
    box-shadow: 12px 12px 0 #d2e9cb;
}

.tab_area_active .tab_area li.select{
  background-color:#fff;
}
.tab_area_active .tab_area li.select:before {
/*  background: #37a514;*/
}

.tab_area_active_sp .tab_area li.select{
/*  background-color:#37a514;*/
}
.tab_area_active_sp .tab_area li.select:before {
/*  background: #8bc679;*/
}

/* ============================================================ btn */
.btn_wrap .btn span:before {
    border-bottom: 4px solid #8bc679;
}
.btn_wrap .btn span:hover:before {
    border-bottom: 4px solid #37a514;
}






/* ============================================================== ■■■ リンクボタン 追加クラスここから　*/
.btn_link {
  margin : 8px auto 50px auto ;
  width: 350px;
  height: 42px;
  background-color: #fff;
  text-align: center;
}
a.btn_link_on {
  background-color: #fff;
  text-align: center;
  border: 10px solid #ccc;
  transition: none;
}
.btn_link a.btn_link_on:link {
  display :block ;
  width: 350px;
  height: 42px;
  border: 1px solid #ccc;
  background: url(../../assets/img/common/arr_link.svg) 321px center rgba(255, 255, 255, 0.6) ;
  background-size : 13px 13px ;
  background-repeat : no-repeat ;
  background-blend-mode:lighten;
  font-size : 12px; 
  line-height : 42px ;
}
.btn_link a.btn_link_on:visited {
  border: 1px solid #ccc;
  color: #333 ;
} 
.btn_link a.btn_link_on:hover {
  border: 1px solid #379214;
  background: url(../../assets/img/common/arr_link.svg) 321px center rgba(255, 255, 255, 0);
  background-size : 13px 13px ;
  background-repeat : no-repeat ;
  color:#379214 ;
}
.hp_mab {
  margin-bottom: 60px !important; 
}
/* ============================================================== ■■■ リンクボタン 追加クラスここまで　*/
/* ============================================================== ■■■ 学習者用デジタル教科書 追加クラスここから　*/
.list_panel_02 .list_panel_main {
    font-size: 14px;
}
.list_panel_02 .list_panel_main li:after {
    top: 10px;
}

.image_panel_01 .image_panel_main {
    width: 100%;
}
.btn_wrap .btn .text_01 {
  padding: 10px 24px;
  font-size: 13px;
}
/* ============================================================== ■■■ 学習者用デジタル教科書 追加クラスここまで　*/
/* ============================================================== ■■■ 関連資料 追加クラスここから　*/
.text_panel_inner__wd {
  width: 96% !important;
}
.kanrenshiryou {
  margin : 0 0 ;
  width : 100% ;
}
.kanrenshiryou .th_1 {
  display :block !important;
  padding :15px 8px 8px 8px ;
  width : 100% ;
/*border :1px #f4f4f4 dotted ;*/
  border:none ;
  vertical-align : middle ;
  font-size :15px ;
}
.kanrenshiryou .td_1 {
  display : inline-block ;
  display : none ; / *更新日が入る時は消す */
  padding : 0px 10px 12px 10px ;
  width : 52% ;
  height :50px;
/*border :1px #f4f4f4 dotted ;*/
  border-bottom :1px #e1e1e1 solid ;
  font-size: min(2.5vw, 13px);
  text-align : right ;
}
.kanrenshiryou tr:last-child .td_1 {
  border:none ;
}
.kanrenshiryou .td_1 .date {
  padding: 0 0 0 5px ;
  font-size: min(2.6vw, 12px);
  color: #4b68af;
}
.kanrenshiryou .td_2 {
  display : inline-block ;
  padding : 0px 10px 12px 10px ;
  width : 47% ;
  width : 100% ; / *更新日が入る時は消す */
  height :50px;
/*border :1px #f4f4f4 dotted ;*/
  border-bottom :1px #e1e1e1 solid ;
  text-align :center ;
}
.kanrenshiryou .td_2 img{
  margin : 0 10px ;
  width : 25px !important;
  height:30px !important;
}
.kanrenshiryou tr:last-child .td_2 {
  border:none ;
}
/* ============================================================== ■■■ 関連資料 追加クラスここまで　*/
/* ============================================================== ■■■ その他 追加クラスここから　*/
.title__2 {
  margin : 0 ;
}
.pc {
  display:none ;
}
.sp {
  display:block ;
}
.tag_nado1 img {
  position:relative; top: 1px;left:-1px;
  vertical-align : bottom !important;
  width: 10px !important;
  height:10px !important;
  transform: scale(0.8)!important;
}
.tag_nado2 img {
  position:relative; top: -2px;
  width: 13px !important;
  height:13px !important;
  vertical-align: bottom !important;
}

#sub_cat .text_sample {
  width: 215px;
}


.hp_txt50p { font-size: 50% !important; }
.hp_txt60p { font-size: 60% !important; }
.hp_txt70p { font-size: 70% !important; }
.hp_txt75p { font-size: 75% !important; }
.hp_txt80p { font-size: 80% !important; }
.hp_txt85p { font-size: 85% !important; }
.hp_txt90p { font-size: 90% !important; }
.hp_txt95p { font-size: 95% !important; }
.hp_txt97p { font-size: 97% !important; }
.hp_txt110p { font-size: 110% !important; }
.hp_txt120p { font-size: 120% !important; }
.hp_txt130p { font-size: 130% !important; }

.hp_txtm33vw { font-size: min(3.3vw, 14px) !important;}
.hp_txtm28vw { font-size: min(2.8vw, 14px) !important;}

.hp_mat30p { margin-top: 30px !important; }
.pc_txtnowrap { white-space: wrap;}

/* ============================================================== ■■■ その他 追加クラスここまで　*/



}
