@charset "UTF-8";
/**************************************************************************************************
 * MENU CSS
 * -------------------------------------------------------------------------------------------------
 * @author      N.K
 * @package     モバイル連絡帳
 * @subpackage  メニューCSS
 * @copyright
 * @since       2017/10/26
 * @link
 **************************************************************************************************/
/*==================================================================================================
 * PC・SP共通
 *================================================================================================*/
/* ヘッダメニュー全体 */
header {
  position: fixed !important;
  top : 0px;
  width : 100%;
  height : 46px;
  /*overflow: hidden;*/
  /*  ちらつき防止  */
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  z-index : 1001;
}
/* ヘッダメニュー全体 */
header.header_back {
  background-color : rgba(0,0,0,0.9);
}
header.us_header_back {
  background-color : #00b1b8;
 /*
 background-color : rgba(0,0,0,0.9);
 */
}

#main_menu {
  height : 100%;
  z-index: 1049;
}

/* トグルメニュー */
#toggle_menu {
  display : none;
  overflow-y: auto;
  width: 25%;
  height: 85%;
  position: fixed;
  right: 0;
  top: 3em;
  margin: 0;
  padding : 10px;
  background-color: rgba(29,45,53,0.9);
  border-radius: 8px;
  -webkit-transform: translate3d(5%,0,0)scale(.97);
  -moz-transform: translate3d(5%,0,0)scale(.97);
  transform: translate3d(5%,0,0)scale(.97);
  z-index : 100;
}

#toggle_menu ul {
  overflow-y: auto;
  float : none;
}
#toggle_menu li:not(.menu_no_border) {
  float: none;
  padding : 15px;
  border-bottom: 1px solid #d9dde1;
  border-radius: 3px;
  box-shadow: 2px 3px 2px rgba(0,0,0,.2);
}
#toggle_menu a {
  color: #ffffff;
  padding: 10px 8px;
  letter-spacing: 3px;
  font-size: 1.0em;
  text-decoration : none;
}

#toggle_menu .menu_layer_1 { margin-left : 0px; }
#toggle_menu .menu_layer_2 { margin-left : 20px; }
#toggle_menu .menu_layer_3 { margin-left : 40px; }
#toggle_menu .menu_layer_4 { margin-left : 60px; }

/* 親メニュー記号表示 */
#toggle_menu .close_menu:before {
  display: block;
  content: "";
  float: left;
  width: 0;
  height: 0;
  border-top: 5px solid #FFFFFF;
  border-right: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid transparent;
  margin-top: 10px;
  margin-right: 2px;

}
/* サブメニュー矢印 */
#toggle_menu .open_menu:before {
  display: block;
  content: "";
  float: left;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #FFFFFF;
  border-left: 5px solid transparent;
  margin-top: 10px;
  margin-right: 2px;
}

.menu_layer_1_row {
  display : none;
}
.inst_info {
  color : #FFFFFF;
}

/*==================================================================================================
 * PCメニュー
 *================================================================================================*/
#pc_header_menu_area { display : block; }
#sp_header_menu_area { display : none; }
#pc_inst_info {  display : block; }
#sp_inst_info {  display : none; }
#sp_main_logo {  display : none; }
.detail_menu_other { display : none; }
#pc_header_logo {
  position    : relative;
  width       : 28px;
  margin-top  : 5px;
  margin-left : 5px;
}

#sp_main_logo {
  padding-top : 2px !important;
  padding-bottom : 2px !important;

}
.sp_main_logo {
  background: rgba(10,10,10,0.8);
}
.us_sp_main_logo {
  background: rgba(154,220,224,0.8);
}

#sp_main_logo img.toggle_menu_logo_size {
  width : 35%;
  max-width : 100px;
}

#pc_header_menu_area {
  position : relative;
  padding-top : 0.2em;
}

/* メニューリンク */
#pc_header_menu_wrap {
  /*
  position : absolute;
  bottom : -1.0em;
  right : 10px;
  */
  z-index : 2;
}

/* 施設名 */
#pc_inst_info {
  /*
  position : relative;
  padding-left : 15px;
  padding-right : 25px;
  font-size : 1.0em !important;
  opacity : 0.7;
  */
}
/* タイトル「ようこそ〇〇さん」 */
/*
#pc_header_user_name_area {
  position : relative;
  padding-left : 20px;
  padding-right : 20px;
  font-size : 1.0em !important;
  vertical-align : middle;
}
*/
#pc_header_menu_wrap {
  margin-top : 12px;
  height :18px;
}

#pc_header_user_name_area .header_user_name {
  white-space      : nowrap;    /* 改行無 */
  text-overflow    : ellipsis;  /* 三点リーダー */
  overflow         : hidden;    /* 範囲外非表示 */
}
#pc_header_menu_area li {
  float: left;
  display: inline-block;
  height : 26px;
}
#pc_header_menu_area li a {
  font-size : 1.0em;
  padding: 0px 13px;
  display: block;
}

/* 通常サイト設定 */
.pc_header_menu_area li a {
 /*color: #9aa6af;*/
  color: #ffffff;

}
.pc_header_menu_area li a:hover {
  color: #FFFFFF;
  text-shadow: -1px 1px 5px #F8E243, 1px -1px 5px #F8E243;
}
.head_special_menu {
  color : #FFFFFF !important;
}
.head_special_menu:hover {
  color: #ffffff !important;
  /*text-shadow: -1px 1px 5px #0033cc, 1px -1px 5px #0033cc !important;*/
  text-shadow: -1px 1px 5px #F8E243, 1px -1px 5px #F8E243;
}

/* システム管理者用メニューデザイン調整 */
/* 施設変更・ログアウト */
#system_admin_other_menu {
  height : 38px;
  min-height : 38px;
  margin-top : -8px;
}
#system_admin_other_menu .change_inst_area,
#system_admin_other_menu .logout_kick_area {
  display : block;
  height : 50%;
  font-size : 0.875em !important;
}
#system_admin_other_menu .change_inst_area a,
#system_admin_other_menu .logout_kick_area a {
  font-size : 0.875em;
}

#system_admin_other_menu .logout_kick_area:hover,
#system_admin_other_menu .logout_kick_area:active {
  color : #FFFFFF;
}

/* USサイト設定 */
.us_header_menu_area li a {
  color: #FFFFFF;
}
.us_header_menu_area li a:hover {
  color: #ffffff;
  text-shadow: -1px 1px 5px #0033cc, 1px -1px 5px #0033cc;
}
.us_head_special_menu {
  /*color : #fef263 !important;*/
  color : #FFFFFF !important;
}
.us_head_special_menu:hover {
  /*
  color: #ffffff;
  text-shadow: -1px 1px 5px #F2712A, 1px -1px 5px #F2712A !important;
  */
  color: #ffffff !important;
  text-shadow: -1px 1px 5px #F8E243, 1px -1px 5px #F8E243;
}
.us_sp_menu {
  color: #ffffff;
  text-shadow: -1px 1px 5px #F2712A, 1px -1px 5px #F2712A !important;
}


#sp_other_menu {
  display : none;
}

/* 印刷関連の画面内ボタン・フッターメニュー制御 */
/* ユーザ一覧 - 画面内：CSV登録ボタン・CSV更新ボタン・フッター：出力ボタン */
#csv_import_export,
#csv_regist,
#csv_update,
#csv_regist_btn,
#footer_csv_output_area,
#pc_footer_print_btn {
  display : inline-block;
}
#sp_footer_print_btn {
  display : none !important;
}
/* 連絡帳一覧 */
#footer_print_btn_area {
  display : inline-block;
}
/* 連絡帳一覧（保護者） */
.footer_SmileyNoteGuardian_index {
  display : inline-block;
}
/* SIDS */
#footer_print_btn_area,
.footer_SidsCheck_index {
  display : inline-block;
}
/* 法人一覧 ・施設一覧*/
#csv_download_btn,
.csv_download_btn_area,
#passage_download_btn,
#passage_csv_download_btn {
  display : block;
}
/* 組織設定 */
.layer_menu_csv_area {
  display : block;
}
/* 組織設定 */
.layer_menu_area {
  display : block;
}
/* 一括更新（組織）・一括更新（グループ） */
#help_button {
  display : block;
}

/*==================================================================================================
 * PC（トグルメニューの幅調整）
 *================================================================================================*/
@media only screen and (max-width: 1690px) {
  /* トグルメニュー */
  #toggle_menu {
    width: 30%;
  }
}
@media only screen and (max-width: 1450px) {
  /* トグルメニュー */
  #toggle_menu {
    width: 35%;
  }
}
@media only screen and (max-width: 1200px) {
  /* トグルメニュー */
  #toggle_menu {
    width: 40%;
  }
}

/*==================================================================================================
 * SP+TABLET(～1199px)
 *================================================================================================*/
@media only screen and (max-width: 1199px) {

  #pc_header_menu_area { display : none; }
  #sp_header_menu_area { display : block; }
  #pc_inst_info {  display : none; }
  #sp_inst_info {  display : block; }
  #sp_main_logo {  display : block; }
  .detail_menu_other { display : block; }

  #sp_header_menu_area {
    position : relative;
    padding : 2px;
  }

  .menu_hamburger_btn,
  .us_menu_hamburger_btn {
    float: left;
    display : inline-block;
    margin: 0.6em 0.7em !important;
    width: 30px;
    height : 30px;
    z-index : 10000;
  }
  .menu_hamburger_btn a,
  .us_menu_hamburger_btn a {
      position: relative;
      display: block;
      height: 25px;
      -webkit-transition: all .4s;
      transition: all .4s;
      box-sizing: border-box;
  }
  .menu_hamburger_btn span {
      position: absolute;
      display: inline-block;
      background-color: #FFFFFF;
      box-shadow: -1px 1px 3px #0033cc, 1px -1px 3px #0033cc;
      left: 0;
      width: 100%;
      height: 1px;
      border-radius: 1px;
      -webkit-transition: all .4s;
      transition: all .4s;
      box-sizing: border-box;
  }
  .us_menu_hamburger_btn span {
      position: absolute;
      display: inline-block;
      background-color : #FFFFFF;
      text-shadow: -1px 1px 5px #139825, 1px -1px 5px #139825;
      left: 0;
      width: 100%;
      height: 1px;
      border-radius: 1px;
      -webkit-transition: all .4s;
      transition: all .4s;
      box-sizing: border-box;
  }

  /* バーガー：上 */
  .menu_hamburger_btn span:nth-of-type(1),
  .us_menu_hamburger_btn span:nth-of-type(1) {
      top: 0;
  }
  /* バーガー：中 */
  .menu_hamburger_btn span:nth-of-type(2),
  .us_menu_hamburger_btn span:nth-of-type(2) {
      top: 12px;
  }
  /* バーガー：下 */
  .menu_hamburger_btn span:nth-of-type(3),
  .us_menu_hamburger_btn span:nth-of-type(3) {
      bottom: 0;
  }
  .menu_hamburger_btn span:nth-of-type(2)::after {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 100%;
      height: 1px;
      background-color: #FFFFFF;
      box-shadow: -1px 1px 5px #0033cc, 1px -1px 5px #0033cc;
      border-radius: 2px;
      -webkit-transition: all .4s;
      transition: all .4s;
  }
  .us_menu_hamburger_btn span:nth-of-type(2)::after {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 100%;
      height: 1px;
      background-color : #FFFFFF;
      border-radius: 2px;
      -webkit-transition: all .4s;
      transition: all .4s;
  }

  /* メニューが開いているときのバーガー：中 */
  .menu_hamburger_btn .active span:nth-of-type(2),
  .us_menu_hamburger_btn .active span:nth-of-type(2) {
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg);
  }
  /* メニューが開いているときのバーガー：中 */
  .menu_hamburger_btn .active span:nth-of-type(2)::after,
  .us_menu_hamburger_btn .active span:nth-of-type(2)::after {
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
  }
  /* メニューが開いているときのバーガー：上 */
  .menu_hamburger_btn .active span:nth-of-type(1),
  .us_menu_hamburger_btn .active span:nth-of-type(1) {
      -webkit-transform: translateY(20px) scale(0);
      -ms-transform: translateY(20px) scale(0);
      transform: translateY(20px) scale(0);
  }
  /* メニューが開いているときのバーガー：下 */
  .menu_hamburger_btn .active span:nth-of-type(3),
  .us_menu_hamburger_btn .active span:nth-of-type(3) {
      -webkit-transform: translateY(-20px) scale(0);
      -ms-transform: translateY(-20px) scale(0);
      transform: translateY(-20px) scale(0);
  }

  /* 施設変更・ログアウト */
  #sp_other_menu {
    position : absolute;
    top : 2px;
    right : 10px;
    z-index : 2;
  }
  #sp_other_menu li {
    float: left;
    display: inline-block;
  }
  #toggle_menu {
    left : 0px;
    width : 100%;
    padding : 0px;
    margin-left : -15px;
  }
  #toggle_menu img.toggle_menu_logo_size  {
    margin-right : 5px;
  }
  #toggle_menu .menu_title {
    display : none;
  }

  /* タイトル「ようこそ〇〇さん」 */
  #sp_header_user_name_area {
    display : block;
    margin : 0px;
    margin-left : 60px;
    font-size : 0.875em;;
    position : relative;
    background : #FFFFFF;
  }

  #sp_header_user_name_text {
    white-space      : nowrap;    /* 改行無 */
    text-overflow    : ellipsis;  /* 三点リーダー */
    overflow         : hidden;    /* 範囲外非表示 */
    padding-top : 4px;
    font-size : 0.875em;
  }
  #sp_header_user_name_text .header_user_name {

  }

  #sp_other_menu #sp_header_menu_wrap {
    padding : 4px;
  }
  #sp_other_menu #sp_header_menu_wrap li {
    font-size : 1.1rem;
    clear : both;
  }

  #sp_header_menu_wrap li.logout_kick_area {
    margin-top : 5px;
  }

  #sp_header_menu_wrap li.logout_kick_area:hover,
  #sp_header_menu_wrap li.logout_kick_area:active {
    color : #FFFFFF;
  }

  /* タイトル「ようこそ〇〇さん」（サブメニュー） */
  .menu_title {
    padding-bottom : 2px;
    border : none;
    border-bottom : 1px solid #FFFFFF;
  }

  .menu_layer_1_row {
    display : block;
  }

  #sp_other_menu {
    display : block;
  }

  /* 印刷関連の画面内ボタン・フッターメニュー制御 */
  /* ユーザ一覧 */
  #csv_import_export,
  #csv_regist,
  #csv_update,
  #csv_regist_btn,
  #footer_csv_output_area,
  #pc_footer_print_btn {
    display : none !important;
  }
  #sp_footer_print_btn {
    display : inline-block !important;
  }
  /* 連絡帳一覧 */
  #footer_print_btn_area {
    display : none !important;
  }
  /* 連絡帳一覧（保護者） */
  .footer_SmileyNoteGuardian_index {
    display : none !important;
  }
  /* SIDS */
  #footer_print_btn_area,
  .footer_SidsCheck_index {
    display : none !important;
  }
  /* 法人一覧・施設一覧 */
  #csv_download_btn,
  .csv_download_btn_area,
  #passage_download_btn,
  #passage_csv_download_btn {
    display : none !important;
  }
  #corp_regist_btn_area {
    width : 100%;
  }
  #inst_regist_btn_area {
    width : 100%;
  }
  /* 組織設定 */
  .layer_menu_csv_area {
    display : none !important;
  }
  /* 組織設定 */
  .layer_menu_area {
    display : none !important;
  }
  /* 一括更新（組織）・一括更新（グループ） */
  #help_button {
    display : none !important;
  }
}

@media screen and (max-device-width: 991px) {
  /* 印刷関連の画面内ボタン・フッターメニュー制御 */
  /* ユーザ一覧 */
  #csv_import_export,
  #csv_regist,
  #csv_update,
  #footer_csv_output_area,
  #pc_footer_print_btn {
    display : none !important;
  }
  #sp_footer_print_btn {
    display : inline-block !important;
  }
  /* 連絡帳一覧 */
  #footer_print_btn_area {
    display : none !important;
  }
  /* 連絡帳一覧（保護者） */
  .footer_SmileyNoteGuardian_index {
    display : none !important;
  }
  /* SIDS */
  #footer_print_btn_area,
  .footer_SidsCheck_index {
    display : none !important;
  }
  /* 法人一覧・施設一覧 */
  #csv_download_btn,
  .csv_download_btn_area,
  #passage_download_btn,
  #passage_csv_download_btn {
    display : none !important;
  }
  #corp_regist_btn_area {
    width : 100%;
  }
  #inst_regist_btn_area {
    width : 100%;
  }
  /* 組織設定 */
  .layer_menu_csv_area {
    display : none !important;
  }
  /* 組織設定 */
  .layer_menu_area {
    display : none !important;
  }
  /* 一括更新（組織）・一括更新（グループ） */
  #help_button {
    display : none !important;
  }
}

/*==================================================================================================
 * 自動ログイン用メニュー
 *================================================================================================*/
#auto_login_header_menu_area { display : block; }
#auto_login_header_logo {
  position    : relative;
  width       : 28px;
  margin-top  : 5px;
  margin-left : 5px;
}

#auto_login_header_menu_area {
  position : relative;
  padding-top : 0.2em;
}

/* メニューリンク */
#auto_login_header_menu_wrap {
  z-index : 2;
}
#auto_login_header_menu_wrap {
  margin-top : 12px;
  height :18px;
}
#auto_login_header_menu_area li {
  float: left;
  display: inline-block;
  height : 26px;
}
#auto_login_header_menu_area li a {
  font-size : 1.0em;
  padding: 0px 10px;
  display: block;
}

/* 通常サイト設定 */
.auto_login_header_menu_area li a {
  color: #ffffff;

}
.auto_login_header_menu_area li a:hover {
  color: #FFFFFF;
  text-shadow: -1px 1px 5px #F8E243, 1px -1px 5px #F8E243;
}
.auto_login_head_special_menu {
  color : #FFFFFF !important;
}
.auto_login_head_special_menu:hover {
  color: #ffffff !important;
  text-shadow: -1px 1px 5px #F8E243, 1px -1px 5px #F8E243;
}

/* USサイト設定 */
.auto_login_us_header_menu_area li a {
  color: #FFFFFF;
}
.auto_login_us_header_menu_area li a:hover {
  color: #ffffff;
  text-shadow: -1px 1px 5px #0033cc, 1px -1px 5px #0033cc;
}
.auto_login_us_head_special_menu {
  color : #FFFFFF !important;
}
.auto_login_us_head_special_menu:hover {
  color: #ffffff !important;
  text-shadow: -1px 1px 5px #F8E243, 1px -1px 5px #F8E243;
}

/*==================================================================================================
 * MAIN CONTENTS
 *================================================================================================*/
.nav_slide h1 {
  margin : 0px 10px;
}
.page_content {
  height : 100%;
}
#page_content,
.cake-error {
  position : relative;
  top : 50px;
}

.page_content_footer {
  padding-bottom : 50px;
}
.page_content_copyright_footer {
  margin-bottom : 20px;
}
.page_content_no_footer {
  padding-bottom : 0px;
}


/*==================================================================================================
 * FOOTER
 *================================================================================================*/
.list_margin {
  margin-bottom : 10px  !important;
}

footer#footer {
  position: fixed !important;
  bottom : 0px;
  display : block;
  height : 50px;
  z-index : 3;
}
footer#no_adjust_footer {
  position: fixed !important;
  bottom : 0px;
  display : block;
  height : 50px;
  margin-top : 0px;
  z-index : 3;
}

#footer_menu {
  position: fixed !important;
  bottom : 0px;
  width : 100%;
  height : 42px;
  background-color : rgba(0,0,0,0.8);
  overflow: hidden;
  /*  ちらつき防止  */
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  /*z-index : 1000;*/
  z-index : 1002;
  padding : 2px;
}
#footer {
  z-index : 1002;
}

#footer_copyright {
  display : block;
  position : fixed !important;
  bottom : 0px;
  width : 100%;
  height : 18px;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  z-index: 1000;
  color : #FFFFFF;
}
.footer_copyright {
  background-color:rgba(0,0,0,0.9);
}
.us_footer_copyright {
  background-color:#00b1b8;
}

/*---------------SMALL_SP(0～400px)----------*/
@media screen and (min-width: 0px) and (max-width: 400px) {
  #footer_copyright {
    font-size : 0.68em;
  }
}

/*==================================================================================================
 * フッタスクロールメニュー
 *================================================================================================*/
.horizontal_scroll_wrap{
  height: 42px;
  overflow-y: hidden;
}
.scroll_lst {
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  /* スクロールバーを出さない場合、padding-bottomで調整 */
  padding-bottom: 42px;
  margin: 2px 0 0;
  -webkit-overflow-scrolling: touch;
}
.scroll_item {
  margin-right: 10px;
  display: inline-block;
  width: 200px;
}
.scroll_item .btn-footer_menu  {
  height : 34px;
  line-height : 34px;
  vertical-align : middle;
  display : inline-block;
  padding : 0px;
}
.scroll_item .btn-footer_menu.font-size_S {
  position : relative;
  top : 0px;
}

/*---------------SMALL_SP(0～400px)----------*/
@media screen and (min-width: 0px) and (max-width: 400px) {
  /* スクロールバーを出す */
  .scroll_lst {
    padding-bottom: 5px;
  }
  .scroll_item {
      margin-right: 8px;
      display: inline-block;
      width: 90px;
  }
}
/*---------------SMALL_SP(401px～550px)----------*/
@media screen and (min-width: 401px) and (max-width: 550px) {
  /* スクロールバーを出す */
  .scroll_lst {
    padding-bottom: 10px;
  }
  .scroll_item {
      margin-right: 10px;
      display: inline-block;
      width: 120px;
  }
}
/*---------------SMALL_SP(551px～850px)----------*/
@media screen and (min-width: 551px) and (max-width: 850px) {
  /* スクロールバーを出す */
  .scroll_lst {
    padding-bottom: 10px;
  }
  .scroll_item {
      margin-right: 10px;
      display: inline-block;
      width: 160px;
  }
}
.scroll_item:first-child {
    margin-left: 10px;
}

.scroll_item_inr {
    display: block;
}
.scroll_item_info {
    white-space: normal;
    padding: 8px;
}
.scroll_item_ttl {
    font-size: 12px;
    color: #484848;
    line-height: 1.4;
    margin-bottom: 0;
}