@charset "UTF-8";
/*
//背景画像
$img-path: "../img/";
$bgimg: "";

//上部ヘッダー
$info_bg_color:transparent;
$info_shadow_color:transparent;
$info_bdr_color:transparent;
$info_hover_color:transparent;

//上部右ディスプレイ切替え
$display_bg_color:transparent;
$display_hover_color:transparent;

//検索パネル
$widget_bg_color:transparent;
$widget_shadow_color:transparent;
$widget_bdr_color:transparent;

//メニュー(1階層)
$menu_bg_color:transparent;
$menu_shadow_color:transparent;
$menu_hover_color:transparent;
$menu_bdr_top_color:transparent;
$menu_bdr_btm_color:transparent;

//メニュー(2階層)
$menu2_bg_color:transparent;
$menu2_hover_color:transparent;
$menu2_bdr_top_color:transparent;
$menu2_bdr_btm_color:transparent;

//メニュー(3階層)
$menu3_bg_color:transparent;
$menu3_hover_color:transparent;
$menu3_bdr_btm_color:transparent;

//ツールボタン
$operation_bg_color:transparent;
$operation_bdr_color:transparent;
$operation_em_color:inherit;

//詳細画面
$detail_head_bg_color:transparent;
$detail_head_bdr_color:transparent;
$detail_h3_bg_color:transparent;
$detail_h2_bdr_color:inherit;
$detail_infoarea_bg_color:transparent;
$detail_infoarea_bdr_color:transparent;

//詳細画面(タブ)
$detail_tab_bg_color:transparent;
$detail_tab_default_color:transparent;
$detail_tab_active_color:transparent;

//テーブル(simple)
$table_simple_th_color:transparent;
$table_simple_bg_title:transparent;
$table_simple_bg_checked_title:transparent;
$table_simple_bdr_color:inherit;
$table_simple_mobile_bdr_color:inherit;
$table_simple_odd_color:transparent;
$table_simple_even_color:transparent;

//テーブル(regular)
$table_regular_th_color:transparent;
$table_regular_bdr_color:transparent;

//テーブル(共通)
$table_count_bdr_color:transparent;
$table_tr_hover:transparent;

//ボタン関連
$btn_font_color_light:transparent;
$btn_reg_bggradient_a:transparent;
$btn_reg_bggradient_b:transparent;
$btn_reg_bordercolor:transparent;
$btn_default_bgcolor:transparent;
$btn_default_bordercolor:transparent;
$btn_cancel_bgcolor:transparent;
$btn_cancel_bordercolor:transparent;
$btn_agree_bgcolor:transparent;
$btn_agree_bordercolor:transparent;
$btn_warning_bgcolor:transparent;
$btn_warning_bordercolor:transparent;

//0829追加

//ボタン関連
$btn_sort_bg_color:transparent;

//スクロールバー
$scrollbar_bg_color:transparent;
$scrollbar_bg_hover_color:transparent;

//検索パネルの予約開始時間・修了時間
$timepicker_bg_color:transparent;
$timepicker_arw_bg_color:transparent;

//検索パネルの予約開始日・修了日
$datepicker_bg_color:transparent;
$datepicker_bdr_color:transparent;

//検索パネルを引き出すボタン（背景）　スマホ
$shrink_bg_color:transparent;

//検索パネルのソート順
$sort_target_bg_color:transparent;
$sort_items_bg_color:transparent;

//テーブル(simple)　スマホ
$table_simple_mobile_bdr_color:transparent;
$table_simple_mobile_bdr_checked_color:transparent;
$table_simple_mobile_td_font_color:transparent;
$table_simple_mobile_th_font_color:transparent;

//ナビアイコン　スマホ
$toggle_bg_color:transparent;

//ローディング
$loading_bgcolor:transparent;
$loader_bgcolor:#fff;
$loader_bdrstyle:2px solid #c1ddff;
*/
@media screen and (max-width: 750px) {
  #container {
    margin: 56px 0 20px 0;
    padding: 20px 15px;
  }
}

#auth {
  max-width: 500px;
  margin: 100px auto 0px auto;
}
@media screen and (max-width: 750px) {
  #auth {
    margin: 0 auto;
  }
}
#auth h2 {
  width: 100%;
  text-align: center;
  margin: 40px auto;
}
@media screen and (max-width: 750px) {
  #auth h2 {
    margin: 30px auto;
  }
  #auth h2 img {
    width: 50%;
  }
}
#auth .mCustomScrollBox {
  height: auto;
}
#auth .notice_info {
  overflow: hidden;
  border-bottom: solid 1px #dddddd;
  margin-bottom: 20px;
  padding: 3px 0 3px 0;
  max-height: 5.5em;
}
@media screen and (max-width: 750px) {
  #auth .notice_info {
    padding: 0;
    font-size: 86%;
  }
}
#auth .notice_info dt {
  width: 90px;
  clear: left;
  float: left;
}
@media screen and (max-width: 750px) {
  #auth .notice_info dt {
    width: 78px;
    padding: 2px 0;
  }
}
#auth .notice_info dd {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#auth .notice_info dd a {
  text-decoration: underline;
}
@media screen and (max-width: 750px) {
  #auth .notice_info dd {
    margin: 0 0 3px 0;
  }
  #auth .notice_info dd a {
    display: inline-block;
    padding: 1px 0;
  }
}
#auth .notice_info dd .important {
  font-weight: normal;
  padding-top: 0px;
}
@media screen and (max-width: 750px) {
  #auth .notice_info dd .important {
    padding-top: 1px;
    margin-top: 4px;
    font-size: 80%;
  }
}
#auth .box {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: #f2f2f2;
  border: solid 1px #dddddd;
  padding: 20px 15px 10px 15px;
  text-align: center;
  overflow: auto;
}
#auth .box h3 {
  margin-top: 10px;
}
#auth .box select.user_switching {
  height: 3em;
  margin: 5px 0;
  padding-left: 7px !important;
}
#auth .box select.user_switching option {
  font-size: 1.25em;
}
#auth .box dl.loginbox {
  overflow: hidden;
}
#auth .box dl.loginbox dt,
#auth .box dl.loginbox dd {
  height: 42px;
  padding: 0 !important;
  margin-bottom: 10px;
}
#auth .box dl.loginbox dt {
  width: 25%;
  float: left;
  background-color: #dddddd;
  line-height: 3.3;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
@media screen and (max-width: 750px) {
  #auth .box dl.loginbox dt {
    font-size: 0.75em;
    width: 35%;
    line-height: 3.6;
  }
}
#auth .box dl.loginbox dd {
  width: 75%;
  float: left;
  border: solid 1px #dddddd;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  background: #ffffff;
}
@media screen and (max-width: 750px) {
  #auth .box dl.loginbox dd {
    width: 65%;
  }
}
#auth .box dl.loginbox dd input {
  border: none;
  width: 100%;
  padding-left: 10px !important;
  font-size: 20px;
  height: 40px;
}
#auth .box dl.loginbox dd:after {
  clear: both;
}
#auth .box ul.opt {
  padding-top: 10px;
  padding-bottom: 3px;
  border-bottom: solid 1px #dddddd;
  color: #999;
  overflow: hidden;
}
#auth .box ul.opt a {
  color: #999;
}
#auth .box ul.opt .lft {
  float: left;
  padding-left: 5px;
}
#auth .box ul.opt .rgt {
  float: right;
  padding-right: 5px;
}
#auth .btns {
  margin-top: 15px;
  text-align: center;
}
#auth .btns a.btn {
  padding: 0.8em 0;
  margin: 0 auto 20px;
  height: 3em;
  font-size: 1.25em;
}
@media screen and (max-width: 750px) {
  #auth .btns a.btn {
    padding: 10px 0 12px 0;
    height: auto;
    width: 80%;
  }
}
#auth .btns a.btn label.i-next,
#auth .btns a.btn label.i-cancel {
  background-position: left 50%;
}
@media screen and (max-width: 750px) {
  #auth .btns a.btn label.i-next,
  #auth .btns a.btn label.i-cancel {
    line-height: 1;
  }
}
#auth p.remind {
  margin: 25px auto 20px;
}
@media screen and (max-width: 750px) {
  #auth p.remind.len50per {
    width: 80%;
  }
}
#auth p.remind a:link,
#auth p.remind a:visited,
#auth p.remind a:hover {
  color: #3399dd;
  text-align: center;
  text-decoration: underline;
  display: block;
  padding: 3px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.3);
}

.popup .desc {
  margin: 20px 20px 40px 20px;
}
@media screen and (max-width: 750px) {
  .popup .desc {
    margin: 20px 10px 70px 10px;
  }
}
.popup .desc p {
  margin-bottom: 15px;
}
@media screen and (max-width: 750px) {
  .popup #contents .mCSB_inside > .mCSB_container {
    margin-right: 5px;
  }
}

@media screen and (max-width: 750px) {
  #auth_switching h2 {
    text-align: left;
  }
}

/*BIND.note誘導リンクここから*/
#auth_login #container {
    padding-bottom: 140px;
}

#ite_link {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: rgba(48,72,151,0.6);
    text-align: center;
}

#ite_link .bindnote_detail {
    padding: 15px 0 20px 0;
    margin: 0 auto;
    color: #fff;
    width: 650px;
    text-align: left;
}

#ite_link .bindnote_detail p {
    display: inline-block;
    margin: 0 0 12px 95px;
    position: relative;
    font-size: 14px;
}

#ite_link .bindnote_detail p:before {
    content: "";
    position: absolute;
    top: -55px;
    left: -95px;
    background-image: url("../img/ico/ico_bind_notice.png");
    background-repeat: no-repeat;
    background-size: 85px;
    width: 85px;
    height: 85px;
}


#ite_link .bindnote_detail p.poyopoyo:before {
  animation: poyopoyo 3s infinite;
  opacity: 1;
}

@keyframes poyopoyo {
  0%, 20%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: scale(0.8);
  }
}

#ite_link .bindnote_detail a {
    display: inline-block;
    margin-left: 90px;
    background-color: #263e8d;
    color: #fff;
    text-align: center;
    padding: 8px;
    border-radius: 4px;
    width: 200px;
    font-size: 16px;
    -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
}

/*BIND.note誘導リンク スマホ表示*/
@media screen and (max-width: 750px) {
    #ite_link .bindnote_detail {
        width: 100%;
    }
}

#notice {
  max-width: 500px;
  margin: 0px auto 30px;
  padding: 10px;
  border-radius: 10px;
  color: #333333;
  background: #ffffff;
  border: solid 1px #f2f2f2;
  line-height: 1.4;
}
#notice h3 {
  margin: 0 0 10px 0;
  padding: 4px 8px;
  font-size: 110%;
  font-weight: bold;
  background: #f2f2f2;
}
#notice .schedule {
  margin: 10px 10px 20px 10px;
}
#notice .schedule li {
  margin: 0 0 5px 0;
  padding: 2px 0 2px 7.6em;
  position: relative;
}
#notice .schedule li .day {
  width: 7em;
  padding: 2px 5px;
  position: absolute;
  left: 0;
  top: 0;
  text-align: center;
  border: 1px solid #c1ddff;
  background: rgba(193, 221, 255, 0.1);
  display: block;
}
#notice p {
  margin: 0 10px 5px;
}
#notice a.i-window {
  display: inline-block;
  margin: 5px 0 0 0;
  padding: 0 0 0 20px;
  cursor: pointer;
  background: transparent url(../img/ico/window.png) 0 0 no-repeat;
  background-size: auto 16px;
  vertical-align: top;
}
#notice a:link,
#notice a:hover,
#notice a:visited {
  color: #3399dd;
  text-decoration: underline;
}

#auth_login #container #head #switch_lang {
    position: absolute;
    right: 12px;
    top: 50px;
}
#auth_login #container #head #switch_lang li {
    display: inline-block;
    margin: 0;
}
#auth_login #container #head #switch_lang li a {
    padding: 8px 10px 8px 40px;
    color: #aaa;
    background-color: #fff;
    position: relative;
    white-space: nowrap;
}
#auth_login #container #head #switch_lang li a.langJa {
    border-radius: 4px 0 0 4px;
    margin-right: -5px;
}
#auth_login #container #head #switch_lang li a.langEn {
    border-radius: 0 4px 4px 0;
}
#auth_login #container #head #switch_lang li a:before {
    display: inline-block;
    position: absolute;
    left: 6px;
    top: 6px;
    padding: 3px 5px;
    font-size: 0.9em;
    line-height: 1em;
    font-weight: bold;
    border-radius: 3px;
    color: #fff;
    background: #ddd;
}
#auth_login #container #head #switch_lang li .langJa:before {
    content: "JA";
}
#auth_login #container #head #switch_lang li .langEn:before {
    content: "EN";
}
#auth_login #container #head #switch_lang li .langJa.displaying {
    background-color: #79b4f7;
    color: #fff;
}
#auth_login #container #head #switch_lang li .langJa.displaying:before {
    color: #79b4f7;
    background: #fff;
}
#auth_login #container #head #switch_lang li .langEn.displaying {
    background-color: #ff9999;
    color: #fff;
}
#auth_login #container #head #switch_lang li .langEn.displaying:before {
    color: #ff9999;
    background: #fff;
}

#auth_login #head {
    padding-left: 0px;
}

#auth_login #head h2 {
    text-align:center;
    position: relative;
    padding: 14px 0 0 0px;
}

/* 20220930 #8921: パスワードリセット関連画面スマホ表示時の表示崩れ */
@media screen and (max-width: 750px) {
    #auth_login #container #head #switch_lang {
        right: 8px;
        top: 65px;
    }
    #auth_login #container #head #switch_lang li a {
        font-size: 11px;
        padding: 8px 8px 8px 32px;
    }
    #auth_login #container #head #switch_lang li a:before {
        padding: 3px 4px;
    }
/* 20220930 #8921: パスワードリセット関連画面スマホ表示時の表示崩れ */
    #auth_login #head {
        position: relative;
        margin-top: 0;
        height: 40px;
    }
    #auth_login #head h2 {
        padding: 0;
    }
}
/* 20230317 #8573_START_WEB多言語表示対応 */
@media screen and (max-width: 750px) {
    #auth_login #container #head #switch_lang {
        right: 0;
        top: 0;
    }
}
#auth_login #passwordResetRequestBean #auth .btns .view_text a {
    min-width: 50%;
    width: auto;
    display: inline-block;
    padding: 0.8em;
}