@charset "utf-8";
body {
	margin: 0;
	padding: 0;
    font-family: "Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo",sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    word-break: break-all;
	color: #000;
}
div, p, ul, ul li, dl, dt, dd {
	margin: 0;
	padding: 0;
	font-size: 100%;
	list-style:none;
}
img, video, object {
    max-width: 100%;
    height: auto;
    border: none;
}
img{ image-rendering: -webkit-optimize-contrast; }

h1, h2, h3, h4, h5 {
	margin: 0;
	padding: 0;
	font-size: 100%;
	line-height: 1.5;
}

a:link {color:blue; text-decoration: none; }
a:hover img { opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7;}
a[href^="tel:"] { text-decoration:none; pointer-events:none ; text-emphasis: none !important;}
a[href^="fax:"] { text-decoration:none; pointer-events:none ;}

#wrapper {
    position:relative;
    margin:0;
    padding:0;
}


/* パソコン */
.pc { display: block !important; }
.tb { display: none !important; }
.sp { display: none !important; }
 
/* スマートフォン */
@media only screen and (max-width: 768px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

/* =========================================================================================
  HEADER
=========================================================================================*/
#header { display: flex; padding: 10px 0px 5px; align-items: center; max-width: 1200px; margin: 0 auto; min-height: 40px;}
#header::after { display: block; clear: both; content:"";}
#header h1 { width: 30%; justify-content: flex-start;  padding: 0px 20px;}
#header h1 img { width: 140px; height: auto;}
#header .login_user { width: 70%; justify-content: flex-end; text-align: right; position: relative;}
#header .login_user span+span {   padding-left: 10px;}
#header #user_name { display: flex; flex-wrap: wrap; justify-content: flex-end; position: relative; cursor: pointer; padding-right: 30px;}
#header span {text-wrap: nowrap;}
#header #user_name::after { display: block; clear: both; content:""; position: absolute; right: 0px; width: 30px; height: 30px; background:url("../img/login_user.png") no-repeat center center; background-size: 20px auto; transition: .3s;}
#header #user_name.active::after { transform: rotate(180deg);}
#header .head_nav { display: none; position: absolute; top: 39px; right: 0%; width: 235px; text-align: left; border: 1px solid #47A487; border-radius: 5px; background: #63CABB ;overflow: hidden; z-index: 1000;}
#header .head_nav p + p { border-top:1px solid #47A487;}
#header .head_nav a { display: block; padding:10px 20px; color: #000000; box-sizing: border-box; color: #fff;}
#header .head_nav a:hover { background:#fff; text-decoration: none; color: #000;}



/* =========================================================================================
  LAYOUT
=========================================================================================*/
#container { min-height:calc(100vh - 0px); background: url("../img/bg.jpg") repeat-x center bottom; padding-bottom: 10px; padding: 1%;}
section{ padding-left: 30px; padding-right: 30px;}
.inner {position: relative;margin: 0 auto; padding: 1vw; background: #fff;box-shadow:0px 3px 30px 0px rgba(0, 0, 0, 0.15);border-radius: 10px;box-sizing:border-box;max-width: 1200px;}
.sub_inner { margin: 0 auto; width: 550px;}

/* 2分割のクラス */
.split-container { display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1200px; margin: 0 auto;}
.left-panel { width: 49%; height: 100%;}
.right-panel { width: 49%; height: 100%;}

@media only screen and (max-width:768px){
.split-container { flex-flow: column; }
.left-panel { width: 100%; min-width: initial;}
.right-panel { width: 100%; min-width: initial;}
}

/* ---------------------------------------------------------------------------------------------------
    COMMON ITEM
---------------------------------------------------------------------------------------------------*/

/* Page title */
h2.sbtit { background: #81BFAA;}
h2.sbtit span { display: block; margin: auto;  padding: 0px 20px; max-width: 1200px; color: #fff; font-size: 1.3rem; background-image: linear-gradient(90deg, #108B65, #81BFAA); box-sizing: border-box;}
h2.sbtit small { display: inline; font-size: 70%; margin-left: 50px; vertical-align: middle;}

/* Content title */
h3 { font-size: 187.5%; color:#108B65;}
h4 { font-size: 137%; color:#108B65;}
h5 { font-size: 125%; color:#474747;}
h4.fs26 { font-size: 162.5%;}
.fs100 { font-size: 100% !important; color: #000 !important;}

/* Input, Textarea, Select */
input,textarea,select,button { }
input[type="text"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="week"],
input[type="date"],
textarea,
select { color: #000; width: 100%; min-width: 100px; padding: 0 15px; font-size: 1rem; background: #FFF; border: 1px solid #47A487; border-radius: 10px; box-sizing: border-box; height: 45px; box-shadow: 1px 1px 1px 0px rgb(71, 164, 135);}
input:focus { background:#F1FBEE; outline: none;}
input.txt_number { text-align: center;}
input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; width: 100%; height: 100%; opacity: 0;}
input[type="date"]:disabled  { background-color: #EEEEEE; border: 1px solid #a9a9a9; box-shadow: 1px 1px 1px 0px #a9a9a9; }input[type="date"]:disabled::after { content: none;}
input[type="number"]:disabled { background-color: #EEEEEE; border: 1px solid #a9a9a9; box-shadow: 1px 1px 1px 0px #a9a9a9;}


/* custom checkbox */
input[type="checkbox"] { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
input[type="checkbox"] { cursor: pointer; padding-right: 35px; vertical-align: middle; position: relative;}
input[type="checkbox"]::before,input[type="checkbox"]::after { content: ""; display: block; position: absolute;  }
input[type="checkbox"]::before { background-color: #fff; width: 20px; height: 20px; border-radius: 5px; border: 1px solid #47A487; box-shadow: 1px 1px 1px 0px rgb(71, 164, 135); top: -2px; right: 0; bottom: 0; left: 0; margin: auto;}
input[type="checkbox"]::after {  opacity: 0; width: 10px; height: 5px; border-left: 2px solid #474747; border-bottom: 2px solid #474747; transform: rotate(-45deg); top: -2px; right: 0; bottom: 0; left: 0; margin: auto;}
input[type="checkbox"]:checked::after { opacity: 1;  }

/* error */
.error_message_account {
  display: block;
  font-size: 0.8em;
  color: #ff0000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: absolute;
  bottom: -22px;
  left: 20px;
}

.error_message {
  display: block;
  width: 100%;
  font-size: 0.8em;
  color: #ff0000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* custom select */
select{
  appearance: none;
}
.select_edit_top{
  width: 100%;
}
.select_edit { position: relative; display:block; border-radius:10px; box-sizing:border-box;}
.select_edit select {}
.select_edit select::-ms-expand { display: none;}
.select_edit::before { display: block; content: ""; position: absolute; width: 7px; height: 7px; border-left: 2px solid #474747; border-bottom: 2px solid #474747; transform: rotate(-45deg); top: 0; right: 15px; bottom: 0; margin: auto;}
.select_allow ::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: orange transparent transparent transparent; position: absolute; top: 50%; right: 5px; transform: translateY(-50%); pointer-events: none;}

/* 上下の矢印ボタン）をCSSで非表示にする */
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {  -webkit-appearance: none;   margin: 0; } 
input[type="number"] { -moz-appearance:textfield; } 

/* custom date */
input[type="date"] { width: 170px;  position: relative;  appearance: none; text-align: left;}
input[type="date"]::-webkit-date-and-time-value { text-align: left;}
input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: auto; height: auto; background: transparent; z-index: 1;}
input[type="date"]::after { content: ''; background-image: url(../img/icon_calendar_e.png); background-repeat: no-repeat; background-size: contain; background-position: 0 0; width: 18px; height: 18px; position: absolute; top: 50%; right: 10px; transform: translateY(-50%);}


/* Button */
button {cursor: pointer; border: none;}
button:hover { opacity: 0.7;}
.btn {font-size: 1rem; min-width: 170px; max-width: 300px; height: 2rem; color: #fff; text-align: center; border-radius: 60px;box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.7);}
.btn.b_arrow_r { background: url("../img/icon_arrow1_right_w.png") no-repeat 94% 58%; background-size: 13px auto;}
.btn.b_arrow_l { background: url("../img/icon_arrow1_left_w.png") no-repeat 6% center; background-size: 13px auto; padding-left: 30px;}
.btn.b_plus { background: url("../img/icon_plus_w.png") no-repeat 6% 10px; background-size: 13px auto;}
.btn.b_copy { background: url("../img/icon_copy_w.png") no-repeat 90% center; background-size: 13px auto;}
.btn.b_save { background: url("../img/icon_save_w.png") no-repeat 90% center; background-size: 13px auto;}
.btn.b_setting { background: url("../img/icon_settings_w.png") no-repeat 90% center; background-size: 13px auto;}
.btn.b_dl1 { background: url("../img/icon_dl1_w.png") no-repeat 90% center; background-size: 13px auto;}
.btn.b_dl2 { background: url("../img/icon_dl2_w.png") no-repeat 90% center; background-size: 13px auto;}
.btn.b_txt {padding: 0 30px;}
.btn.blue { background-color:#10218B !important;}
.btn.green { background-color:#108B65 !important;}
.btn.black { background-color:#000000 !important;}
.relative_cont { position:relative;}

.btn2 { width:100%; height:18px;}
.btn2.b_copy { background: url("../img/icon_copy_k.png") no-repeat center center; background-size: 21px auto;}
.btn2.b_delete { background: url("../img/icon_delete_k.png") no-repeat center center; background-size: contain; }

.btn_cont  { padding: 1rem 0px; gap: 1rem;}
.btn_cont div { gap:20px;}
.btn_cont .w280 { min-width: 280px;}

.btn_update { gap:20px; }



/* Result */
.result_number { display: flex; flex-wrap: wrap; justify-content:flex-end; align-items: flex-end; margin-top: 20px; margin-bottom: 20px;}
.result_number p { margin: 0 10px; line-height: 30px;}
.pagination { display: flex; flex-wrap: wrap; justify-content:center;}
.pagination li a { display: block; width: 30px; height: 30px;}
.pagination li a.prev,
.pagination li a.next { width: 50px; text-indent: -9999px;}
.pagination li a.prev { background: url("../img/icon_page_prev.png") no-repeat center center; background-size:auto 20px;}
.pagination li a.next { background: url("../img/icon_page_next.png") no-repeat center center; background-size:auto 20px;}
.pagination li a.prev:hover,
.pagination li a.next:hover { opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7;}
.pagination li a.page-numbers { color: #000; text-align: center;}
.pagination li a.page-numbers:hover { color: #47A487; text-decoration: none;}
.pagination li a.page-numbers.current { pointer-events: none; color: #fff; background:#47A487; border-radius: 30px;}


/* Modal contents */
.modal-span { cursor: pointer;}
.modal-outer {  position: fixed; top: 0; left: 0;  display: none;  width: 100%; height: 100%;  background: rgba(0, 0, 0, 0.8);  z-index: 10000;}
.modal_table { height: 65vh;}
table thead { position: sticky; top: 0; z-index: 1;}
.modal-outer.show { display: block; }
.modal-inner-container { height: 100%;}
.modal-inner-container form {overflow: scroll; }
/* .modal-inner-container form::-webkit-scrollbar:horizontal { display: none;} */
.modal-inner { position: absolute; margin: auto; padding: 2%; background: #fff; border-radius: 20px; max-width: 1200px;}
.modal-inner-head { padding-bottom: 10px; font-size: 1.2rem; font-weight: 600; color:#108B65; display: flex; align-items: center; gap: 10px; flex-wrap:wrap;}
.modal-inner-head div { width: 400px;}
.close-btn-top {cursor: pointer;position: absolute; right: 3%;width: 40px; height: 40px;text-indent: -9999px;background: url("../img/icon_close_e.png") no-repeat;background-size: 40px auto;}
.modal-option { top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%;  max-width: 1100px;}
.modal-option .mb-3 { max-width: 350px;  width: 350px; margin: 0 auto;}
.modal-option.max_w900 { max-width:900px;}
.modal-option .scroll_cont { height: 60vh; overflow: auto;}
.modal-option .btn_update { right: 30px; bottom: 30px;}
.modal-option input[type="text"] { }
.modal-option table.green thead { background:#108B65;}
.modal-option table.green .t_option { }
.modal-option .photoBox { text-align:center; margin: 0 auto; max-width: 400px;}
.modal-option .comeBox { background: #F1FBEE;}
.modal-ladder { max-width: 1460px;}
.modal-ladder .scroll_cont { height:calc(80vh - 130px); overflow: auto ;}
.modal-ladder .btn_update { right:0; bottom:20px;}
.modal-ladder .container_l { width: calc(100% - 480px); min-width: 300px;}
.modal-ladder .container_l .col2 { flex-basis: 49% !important; margin-bottom: 2%;}
.modal-ladder .container_r { width:450px; position:relative;}
.modal-ladder .container_r .btn_update { position: absolute; bottom: 20px; width: 100%; text-align: right;}


/*  Line */
hr { margin:20px 0; height: 1px; background:#47A487; border: none;}

/* Flex contents */
.flex { display: flex; align-items: center; }
.flex_cont { display: flex; flex-wrap: wrap;}
.flex_cont label { padding-top: 10px; padding-bottom: 10px;}
.flex_cont .col1 { flex-basis: 100%;}
.flex_cont .col2 { width: 49%;}
.flex_cont .col3 { display: flex; text-align: center; align-items: center;}
.flex_cont .col3 span:nth-child(1) {min-width: 110px; font-size: 0.8rem;}
.flex_cont .col3 span:nth-child(2) {width: 120px;}
.flex_cont .col3 span:nth-child(3) {width: 30px; font-size: 0.8rem; text-wrap: nowrap;}
.flex_cont .col4 { flex-basis: 23%;}
.flex_cont .col5 { flex-basis: 18%;}
.flex_cont .col6 { flex-basis: 14.66%;}

.flex_left { display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.flex_center { display: flex; justify-content:center;}
.flex_right { display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.flex_between { display: flex; justify-content:space-between;}
.flex_around { display: flex; justify-content:space-around;}
.flex_align_end { align-self: flex-end;}
.flex_dir_col { flex-direction: column;}


/* Set contents */
.set_cont { padding: 20px 0 0;}
.set_cont + hr { margin-top: 40px;}
.set_cont button.btn { }

select:focus { border: red;}




/* Form contents */
.form_cont dl { width: 100%;}
.form_cont dt { font-weight: 500;}
.form_cont dd { width: 100%; align-items: center;}
.form_cont dd p + p { margin-top: 10px;}
.form_cont dd span { white-space: nowrap; text-align: center;}
.form_cont dl.type_t { padding-bottom: 15px;}
.form_cont dl.type_t dt { display: flex; align-items: center;}
.form_cont dl.type_t dt:after {content: "";height:1px;flex-grow: 1;background-color:#47A487; margin-left: 30px;}
.form_cont dl.type_t dt:before { content: ""; position: relative; top: 0px; left: 0px; width: 7px; height: 7px; background: #000; transform: rotate(45deg); margin-right: 10px;}
.form_cont dl.type_g { padding-top: 10px;}
.form_cont dl.type_g dt:after {content: "";height:1px;flex-grow: 1;background-color:#47A487; margin-left: 30px;}
.form_cont dl.type_g dt:before { content: ""; position: relative; top: 0px; left: 0px; width: 7px; height: 7px; background: #000; transform: rotate(45deg); margin-right: 10px;}
.form_cont dl.type_g dt { color: #108B65; display: flex; align-items: center;}
.form_cont dl.type_g dd { background: #F1FBEE; border-radius: 20px; border: 1px solid #47A487; margin-top: 5px; box-shadow: 1px 1px 1px 0px rgb(71,164,135); display: inline-flex; box-sizing: border-box; padding: 5px 0px; width: initial;}
.form_cont dl.type_y { display: flex; align-items: center; gap: 5px; padding-bottom: 10px;}
.form_cont dl.type_y dt { min-width: 110px; font-weight: 500; line-height: normal; text-align: center;}
.form_cont dl.type_y dd { align-items: center; justify-content: space-between;}
.form_cont dl.type_y2 { display: flex; flex-wrap: wrap; min-width: 350px;}
.form_cont dl.type_y2 dt { width: 400px; line-height: 60px;}
.form_cont dl.type_y2 dd { width:calc(100% -  400px); min-width: 450px; display: flex; justify-content: flex-start;}
.StartDate { width: 50%; min-width: 285px;}
.FormBox {width: 120px !important; margin-left: auto; text-align: center;}
.SystemCol3 {gap: 5px;}
.SystemCol3 span:nth-child(2){font-size: 0.8rem;}
.SystemCol3 span:nth-child(3){width: 100%;}
.form_cont .col2 .col2 { min-width: 350px;}
.form_cont .col2 dl.type_t .col2 { }
.form_cont dl.type_t dd label.col2 { min-width: 360px;}
.form_cont dl.type_t dd label.col2.col2_r {}
.form_cont label { gap: 5px; align-items: center;}
.green-box { min-width: 120px; background: #F1FBEE; height: 45px; display: flex; align-items: center; justify-content: center; border-radius: 10px; text-align: center; flex-wrap: wrap;border: 1px solid #47A487;  box-shadow: 1px 1px 1px 0px rgb(71,164,135); display: inline-flex; box-sizing: border-box;}
.green-box label span:nth-child(1){ width: 100px; text-align: center;}
.green-box label span:nth-child(2){ width: 100px; text-align: center;}
.green-box label span:nth-child(3){ width: 30px; }
.green-box span { text-align: center !important;}
.green-bk { background: #F1FBEE!important;}

.green-box-modified{ height: auto; padding: 10px 10px; margin-top: 10px; width: initial !important; max-width: initial !important;}
.green-box-L { justify-content: flex-start; padding-left: 20px;}


/* ---------------------------------------------------------------------------------------------------
    アカウント設定
---------------------------------------------------------------------------------------------------*/
.account { margin:0 auto; max-width: 560px;}
.account dl { display: flex; align-items: center; justify-content:space-between; padding-bottom: 2%; border-bottom: thin #47A487 solid;  margin-bottom: 2%;}
.account dt { width: 30%;}
.account dd { width: 70%; display: flex; justify-content: end; position: relative; align-items: center; min-height: 50px;}
.account dd span {  width: 100%;}
.account dd .btn { background: #47A487;  margin: 0 10px;  width: 100px;} 




/* ---------------------------------------------------------------------------------------------------
    ログイン
---------------------------------------------------------------------------------------------------*/
#login {}
#login_container { min-height:100vh; background-image: linear-gradient( #68CFC3 50%, #DAFFDB 90%); padding: 1%; position: relative;}
#login_container button { box-shadow:0px 3px 6px 0px rgba(0, 0, 0, 0.15); margin: 0 auto;}

/* login before */
.login { max-width: 1200px; display: flex; margin: 0 auto; padding-top: 100px; flex-wrap: wrap; justify-content: center;}
.login .container_l , .login .container_r { display: flex; justify-content: center;  width: 600px;}
.login .site_name { align-self:center; color:#fff; font-size: 1.8rem; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);}

#login .login .box { width: 100%; padding: 5%; background: #fff; box-shadow:0px 3px 30px 0px rgba(0, 0, 0, 0.15); border-radius: 5px;  margin: 0 auto;}
#login .login .box p  { margin-bottom: 40px;}
#login .login .box span { color: #10218B; font-weight: 600;}
#login .login .box input { line-height: 50px; height: 50px; border: none; border-bottom:1px solid #8F8F8F; border-radius: 0;}
#login .login .box button { max-width: inherit;}
#login .login .box .txt_link { padding-top:25px; text-align: center;}
#login .login .box .txt_link a { color:#000;}

/* login after */
#login .login2 { text-align: center; background: #fff; box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.15); border-radius: 5px; box-sizing: border-box; max-width: 1200px; margin: 0 auto; padding: 1%; min-height: 60vh;}
#login .login2 hr { margin:20px 0;}


/* password */
#login .password { align-self:center; width: 90%; max-width: 600px !important; margin: auto; padding: 5%; background: #fff; box-shadow:0px 3px 30px 0px rgba(0, 0, 0, 0.15); border-radius: 5px; box-sizing:border-box; margin: 0 auto;  gap: 25px; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%);}
#login .password .come { }
#login .password p  { margin: 0 0 40px;}
#login .password span { color: #10218B; font-weight: 600;}
#login .password input { line-height: 50px; height: 50px; border: none; border-bottom:1px solid #8F8F8F; border-radius: 0;}
#login .password button { max-width: inherit;}


/* email */
#login .email { align-self: center; width: 100%; max-width: 600px !important; min-height: 460px; margin: auto; padding: 50px 50px 35px; background: #fff; box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.15); border-radius: 5px; box-sizing: border-box;}
#login .email .come { }
#login .email p  { margin: 0 0 40px;}
#login .email span.title { color: #10218B; font-weight: 600;}
#login .email span.address { display: block; line-height: 50px; height: 50px; position: relative;}
#login .email input { border: none; border-bottom: 1px solid #8F8F8F; border-radius: 0; width: 100%; display: block; font-size: 100%; line-height: inherit; height: auto;}
#login .email button { max-width: inherit;}



/* Tab contents */
.tab_cont .tab { display: flex; flex-wrap: wrap;}
.tab_cont .tab p {cursor: pointer; flex: 1; padding: 5px; text-align: center; border: 1px solid #D4D4D4; text-wrap: nowrap; min-width: 170px;   padding: 0.3em 0.3em 0.3em 0.3em; margin-bottom: -1px;  margin-right: -1px;}
.tab_cont .tab p.tb10 { padding:10px 10px;}
.tab_cont .tab p:hover { color: #108B65;}
.tab_cont .tab p.active { color: #fff; background: #108B65; pointer-events: none;}
.tab_cont .category { display: flex;  border-top: none;}
.tab_cont .category p {  flex:1; padding:5px; text-align: center; color: #108B65; border: 1px solid #D4D4D4;   padding: 0.3em 0.3em 0.3em 0.3em; margin-bottom: -1px;  margin-right: -1px;}
.tab_cont .category p.active {  background: #F1FBEE; pointer-events: none;}
.tab_cont .disnon { display: none;}
.tab_cont .content_wrap { clear:both; }

/* Table contents */
table { width: 100%; border-spacing:0; margin: 0 auto; text-wrap: nowrap; border-collapse: collapse; border: 1px solid rgba(187, 187, 187, 0.2);}
.modal_table table tbody tr { height: 50px;}
.modal_table input[type="number"] { height: 35px;}
table tr th { padding: 1px 10px; border: 1px solid #ffffff;}
table tr td { padding: 1px 10px; border: 1px solid rgba(187, 187, 187, 0.5); }
table.green thead { color: #000; background: #F1FBEE;}
table.green tr {text-align: left; position: relative;}
table.green tbody tr:nth-child(even) { background:#F1FBEE;}
table.green tbody tr.simulation_summary_table2_body { background: #fff;}
table.green tbody .bg_white { background:#fff !important;}
table.green tbody .bg_green { background:#F1FBEE !important;}
table.gray thead { color: #fff; background: #8F8F8F;}
table.gray tbody tr:nth-child(even) { background:#F1F1F1;}
table.gray tr  {text-align: left;}
table select {  line-height: 40px;}
table a { color: #000 !important; text-decoration: none !important; display: inline-block; width: 100%;}
table tbody tr:hover {opacity: 0.7; cursor : pointer;}
.simulation_summary_table tr:hover{ opacity: 1 !important; cursor: default;}



table .t_edit1 { width: 30px !important; }
table .t_edit2 { width: 30px !important; }
table .t_company { } /*会社名*/
table .t_post { } /*部署名*/
table .t_name { white-space: nowrap; min-width: 280px;} /*提案名・既存機種名・機種名*/
table .t_plan { } /*プラン*/
table .t_day { text-align: center;} /*提案日*/
table .t_period { text-align: center;} /*リプレース期間*/
table .t_quantity { text-align: center;  width: 80px;} /*台数*/
table .t_quantity input[type="number"] { min-width: 80px;}
table .t_quantity_2 {width: 100px; text-align: center;}
table .t_number {  text-align: center;} /*品番*/
table .t_type { white-space: nowrap; width: 200px;} /*種別*/
table .t_print {  text-align: right !important;} /*推定月間印刷枚数*/
table .t_color {  text-align: center !important;} /*カラー比率*/
table .t_model { } /*提案機種*/
table .t_option {} /*オプション*/
table .t_come { } /*内容*/
table .t_check {text-align: center !important; text-wrap: nowrap;} /*チェック*/
table .t_fee1 { text-align: center !important; text-wrap: nowrap;} /*標準価格*/
table .t_fee2 { text-align: center !important; text-wrap: nowrap;} /*提案価格*/
table .t_fee3 { text-align: center !important; text-wrap: nowrap;} /*標準価格(税別)*/
table .t_fee4 {} /*提案価格（入力用）*/
table .t_fee5 {  text-align: right !important; text-wrap: nowrap;} /*基本使用料金*/
table .t_fee6 {  text-align: right !important; text-wrap: nowrap;} /*月額基本金額*/
table .t_fee7 {  text-align: right !important; text-wrap: nowrap;} /*追加構成金額*/

table .t_now { text-align: center !important;} /*現状*/
table .t_now.green { color: #108B65;}
table .t_color { text-align: center !important;} /*カラー*/
table .t_suitei {text-align: right !important;} /*月間推定枚数*/
table .t_max-print {  text-align: right !important;} /*最大出力枚数*/
table .t_time-min {  text-align: right !important;} /*印刷時間（分）*/
table .t_improve { text-align: right !important;} /*印刷時間（時間）*/
table .t_improve2 {  text-align: right !important} /*印刷時間（時間）*/
table .t_machine-now { text-align: center; font-weight: bold;} /*現在の出力機*/
table .t_machine-proposal { text-align: center; font-weight: bold;} /*提案機器構成*/
table .t_machine-reduction { text-align: center; font-weight: bold;} /*削減効果*/
table .t_print-month {   text-align: right !important;} /*月間推定枚数*/
table .t_print-job {   text-align: right !important;} /*1JOB平均印刷枚数*/
table .t_time-first {   text-align: right !important;} /*ファーストプリント時間*/
table .t_cost {  text-align: right !important;} /*1枚あたり印刷コスト*/
table .t_electricity {  text-align: right !important;} /*電気料金*/
table .t_machine-rate {  text-align: center; font-weight: bold; background: #fff;} /*電気料金の削減効果*/
table .t_sheet { width: 50%; padding: 2%} /*シート名*/
table .t_display { width: 25%; text-align:center!important;} /*表示*/
table .t_pptx { width: 25%; text-align:center!important;} /*パワーポイント*/

table th.center { text-align: center !important;}
table .txt_green { color: #108B65;}
table.max_w700 { max-width:700px !important;}
table.max_w800 { max-width:800px !important;}
table.max_w1000 { max-width:1000px !important;}
table.max_w1100 { max-width:1100px !important;}
table.min_w610 { min-width:610px !important;}
table.min_w720 { min-width:720px !important;}
table.min_w800 { min-width:800px !important;}
table.min_w1000 { min-width:1000px !important;}
table.min_w1100 { min-width:1100px !important;}
table.min_w1400 { min-width:1400px !important;}


/* Contract contents */
.contract { display: flex; flex-wrap: wrap; background:#F1FBEE; border-radius: 10px; justify-content: center;}
.contract p { padding: 3px;}
.contract .col1 { flex-basis: 100%; border-bottom: 2px solid #fff;}
.contract .col2 { width: 50%; border: 1px solid #fff; box-sizing: border-box;}
.contract .col2:last-child { padding-right: 1%;}
.contract .icon_open { background: url(../img/icon_open_spreadsheet.svg) no-repeat 10% 5px;  background-size: 20px auto;  padding-left: 35px; color: #000 !important;}
.contract span  { display: inline-block;}
.contract span:nth-child(1)  { min-width: 100px; text-align: right;color: #47A487;  font-size: 0.8rem;}

/* Property contents */
.property { margin-bottom: 20px; background:#F1FBEE; border-radius: 10px; }
.property h4 { padding:15px 20px; border-bottom: 2px solid #fff;}
.property .come { padding: 20px 20px 60px;}
.property dl {}
.property dl+dl { margin-top:15px;}
.property dt { display: inline-block; width: 140px; text-align: right;}
.property dd { display: inline-block; padding-left: 10px; width:calc(100% -  140px);}


/* Ladder contents */
/* unitcost */
.ladder_unitcost { padding:20px; background:#F1FBEE; border-radius: 10px;}
.ladder_unitcost .come { display: flex; flex-wrap: wrap; padding:0; gap:10px 0; }
.ladder_unitcost p { display: inline-block; width:50%; min-width: 205px;}
.ladder_unitcost p span { display: inline-block; height: 45px; line-height: 50px;}
.ladder_unitcost input { margin: 0 10px; padding: 0 10px; width: 95px; height: 45px; line-height: 45px;}
.ladder_unitcost span:nth-child(1) { width:45px; text-align: right;}
.ladder_unitcost span:nth-child(2) { width:115px; }
.ladder_unitcost span:nth-child(3) { width:45px;}
/* unitcost */
.ladder_print { padding:20px; background:#F1FBEE; border-radius: 10px;}
.ladder_print .come { padding:10px 0 0; }
.ladder_print p { margin: 10px 0; width: 100%;}
.ladder_print p span { display: inline-block; height: 45px; line-height: 50px;}
.ladder_print input { margin: 0 10px; padding: 0 10px; width: 95px; height: 45px; line-height: 45px;}
.ladder_print span:nth-child(1) { width:145px;}
.ladder_print span:nth-child(2) { width:115px;}
.ladder_print span:nth-child(3) { width: 30px;}
.ladder_print span:nth-child(4) { width: calc(100% - 290px); text-align: right;}

/* total */
.ladder_total { border: 2px solid #10218B; border-radius: 10px;}
.ladder_total h5 { padding:10px 20px; color: #10218B;}
.ladder_total .come { padding:10px 20px 15px; border-top:2px solid #10218B;}
.ladder_total p + p { margin-top: 10px;}
.ladder_total p span { display: inline-block;}
.ladder_total input { margin: 0 10px; padding: 0 10px; width: 95px; height: 45px; line-height: 45px;}
.ladder_total span:nth-child(1) { width:100%; font-weight: 600;}
.ladder_total span:nth-child(2) { width:50%;}
.ladder_total span:nth-child(3) { width:50%;}


/* Simulation summary*/
.simulation_summary { justify-content: space-between;}
.simulation_summary div { border: 1px solid #47A487; border-radius: 10px; margin-top: 10px;  height: 100%; width: 33%;box-sizing: border-box;}
.simulation_summary .mid { padding: 5px; color: #fff; text-align: center; font-size: 1rem; font-weight: 600; background:#47A487; vertical-align: middle; border-radius: 7px 7px 0 0;}
.simulation_summary .mid img { margin-right: 10px; width: 30px; height: 30px; border-radius: 50px; vertical-align: middle;}
.simulation_summary dl { padding: 3%;}
.simulation_summary dl .disabled { pointer-events: none;}
.simulation_summary dt { position: relative;}
.simulation_summary dt::before { position: absolute; top: 11px; left: 0; display: block; clear: both; content:""; width: 100%; height: 1px; background:#47A487;}
.simulation_summary dt span { position: relative; z-index: 99; padding: 0 10px 0 35px; line-height: 26px; background:#fff url("../img/icon_arrow1_right_e.png") no-repeat left center; background-size: contain;}
.simulation_summary dd { text-align:  center; color: #47A487;}
.simulation_summary dd span { font-weight: bold;}
.simulation_summary dd span:hover { opacity: 0.8;}
.simulation_summary dd span:nth-child(1) { font-size: 2rem;}
.simulation_summary dd span:nth-child(2) { font-size: 1rem; text-wrap: nowrap;}
.simulation_summary dd .gray {color: #C0C0C0 !important; text-decoration: none;}
.simulation_summary dd .gray u { text-decoration: none;}
.simulation_summary dd u { text-decoration: none; cursor: pointer; background: linear-gradient(transparent 60%, #ff6 60%);}
.simulation_summary dt.minus::before { background:#D4D4D4;}
.simulation_summary dt.minus span { background:#fff url("../img/icon_arrow1_right_g.png") no-repeat left center; background-size: 26px auto;}
.simulation_summary dd.minus { color: #D4D4D4;}
.simulation_summary_table th, .simulation_summary_table td { border-right:1px solid #D4D4D4; border-bottom: 1px solid #D4D4D4; border-top: 1px solid #D4D4D4; border-left: 1px solid #D4D4D4; cursor: default;}
.simulation_summary_table2 { position: relative; overflow: auto;}
.simulation_summary_table2 th, .simulation_summary_table2 td { border-right:1px solid #D4D4D4; border-bottom: 1px solid #D4D4D4; border-top: 1px solid #D4D4D4; border-left: 1px solid #D4D4D4; cursor: default;}
.simulation_summary_table2 th:hover, .simulation_summary_table2 td:hover { opacity: 1;}
.simulation_summary_table2 th { width: 25%;}

/* Graph contents */
.graph_cont { padding-top: 20px; }
.graph_cont div {padding-bottom: 10px;}
.graph_cont .mid { text-align: center;}
.graph_cont .mid span.green { position: relative; margin: 0 15px; color: #108B65;}
.graph_cont .mid span.green b, .graph_cont .mid span.green small {position: relative;}
.graph_cont .mid span.green b { font-size: 2.6rem;  background:linear-gradient(transparent 60%, #ff6 60%);}
.graph_cont_move { }
.graph_cont h4+.zu { max-width: 500px; margin: 0 auto;}
.eco_example div { width:30%; margin: 30px 0px; min-width: 300px;}
.eco_example div p:nth-child(1) {font-weight: bold; font-size: 1rem;}
.eco_example div span { font-weight: bold;  font-size: 2rem;} 
.eco_example div small { color: #108B65;}
.eco_example div p {color: #108B65; letter-spacing: 3px; line-height: 2rem; font-size: 0.8rem;}
.eco_example div.sugi { background: url("../img/bg_sugi.png") no-repeat center center; background-size: contain; text-align: center;}
.eco_example div.regi { background: url("../img/bg_regi.png") no-repeat center center; background-size: contain; text-align: center;}
.eco_example div.led { background: url("../img/bg_led.png") no-repeat center center; background-size: contain; text-align: center;}

/* admin */
.admin-panel {width: 100%;}
.admin-panel dt { width: 30%;}
.admin-panel dd { width: 100%; max-width: 100%; display: flex;}
.admin-panel dd label:nth-child(1) { width: 25%;}
.admin-panel dd label:nth-child(2) { width: 75%;}
.admin-panel dd span {font-size: 0.8rem;}
.admin_inner{ margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; gap: 25px;}
.admin_inner div{  display: flex; gap: 15px; flex-wrap: wrap; max-width: 540px; top: 50%; padding: 10% 0%; width: 100%;}
.admin_inner div .btn { width: 260px; height: 50px;}


/* 共通スタイル */
/* Align */
.left { text-align: left;}
.center { text-align: center;}
.right { text-align: right;}
.alC { align-items: center;}
.center-block { margin: 0 auto;}

/* font */
.fd { font-weight: bold;}
.f_nomal { font-size: 100% !important;}
.fl{ font-weight: lighter; font-size: 12px;}
.noWrap{ white-space: nowrap}
.sub_info {font-size: 12px}
.sub_info span {white-space: pre-wrap;}

/* Width */
.w50  { width: 50px !important;}
.w80  { width: 80px !important;}
.w100 { width: 100px !important;}
.w170 { width: 170px !important;}
.w100p { width: 100% !important;}
.w500 { width: 500px !important;}
.winitial{ width: initial !important;}


/* Paddng */
.mt0 { margin-top:0;}
.mt15 { margin-top: 15px;}
.mt20 { margin-top: 20px;}

.padding-left-10 { padding-left: 10px;}
.padding-top-20 { padding-top: 20px;}

.pt15 { padding: 15px 0 0;}
.pt20 { padding: 20px 0 0;}

.pb15 { padding: 0 0 15px;}
.pb20 { padding: 0 0 20px;}
.pb60 { padding: 0 0 60px;}

.pl20 { padding-left: 20px 0;}

.ptb10 { padding: 10px 0;}
.ptb15 { padding: 15px 0;}
.ptb20 { padding: 20px 0;}
.ptb30 { padding: 30px 0;}
.ptb40 { padding: 40px 0;}



@media only screen and (max-width:768px){
    .sub_inner {width: 100%;}
    .col2 .form_cont dl.col2.type_t { min-width: inherit;}
    .form_cont dl.type_t .col2 input { max-width: 100%;}
    .form_cont .tb_type_t span { display: block; width: 100%; margin: 0 !important;}
    .tb_w150 { width: 100%; max-width: 150px !important;}
    .tb_w100p { width: 100%; max-width:none !important;}
    .tb_flexnone {display: flex; flex-direction: column;}
    .flex_cont .col2 { width: 100%;}
    .contract .col2 { flex-basis: 100%;}
    .flex_wrap {flex-wrap: wrap;}
    .mobile-margin-bottom { margin-bottom: 10px; }
    .form_cont dl.type_y { display: block; min-width: initial; width: 100%;}
    .form_cont dl.type_y dt { width: 100%; text-align: left; line-height: 1.5;}
    .form_cont dl.type_y dd { width: 100%;}
    .form_cont dl.type_t dt { margin-top: 10px; margin-bottom: 5px;}
    .w94vw{width: 90vw; margin: 0 auto;}
    input[type="text"], input[type="tel"], input[type="number"], input[type="password"], input[type="search"], input[type="url"], input[type="week"], input[type="date"], textarea, select {height: 50px;}
    .graph_cont .mid { text-align: center; display: flex; flex-direction: column; }
    .StartDate {width: initial; min-width: 200px;}
    .btn_cont { display: flex; justify-content: center;}
    table .t_edit1 { min-width: 30px !important;}
    table .t_edit2 { min-width: 30px !important;}
    .simulation_summary div { width: 100%;}
    .account dl { display:block;}
    .account dt { width: 100%;}
    .account dd { width: 100%; display: flex; justify-content: end; position: relative; align-items: center; flex-wrap: wrap;}
    .modal-option .scroll_cont { height: 60vh;}
    .modal_table { height: 60dvh;}

} 

@media only screen and (max-width:533px){
  .spacer { width: initial;}   
  .eco_example div { width: 100%;}
}



/* ---------------------------------------------------------------------------------------------------
    ログイン
---------------------------------------------------------------------------------------------------*/

/* email */
#login .email { align-self: center; width: 100%; max-width: 600px !important; min-height: 460px; margin: auto; padding: 50px 50px 35px; background: #fff; box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.15); border-radius: 5px; box-sizing: border-box;}
#login .email .come { }
#login .email p  { margin: 0 0 40px;}
#login .email span.title { color: #10218B; font-weight: 600;}
#login .email span.address { display: block; line-height: 50px; height: 50px; position: relative;}
#login .email input { border: none; border-bottom: 1px solid #8F8F8F; border-radius: 0; width: 100%; display: block; font-size: 100%; line-height: inherit; height: auto;}
#login .email button { max-width: inherit;}





/*====================================================================================================
  Scroll hint
====================================================================================================*/
@keyframes scroll-hint-appear {
  0% {
    transform: translateX(40px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  50%,
  100% {
    transform: translateX(-40px);
    opacity: 0;
  }
}

.scroll-hint.is-right-scrollable {
  background: linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}
.scroll-hint.is-right-scrollable.is-left-scrollable {
  background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0)), linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}
.scroll-hint.is-left-scrollable {
  background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}
.scroll-hint-icon {
  position: absolute;
  top: 0; bottom: 0;
  left: 0; right: 0;
  margin: auto;
  box-sizing: border-box;
  width: 200px;
  height: 100px;
  border-radius: 5px;
  transition: opacity .3s;
  opacity: 0;
  background: rgba(0, 0, 0, .7);
  text-align: center;
  padding: 20px 10px 10px 10px;
}
.table_cont { -ms-overflow-style: none; overscroll-behavior: none; position: relative; overflow: auto; }
.table_cont .scroll-hint-text-new { font-size:15px; font-weight:500; line-height: 120%; color: #fff !important; margin-top:10px; color: #fff !important;}
.scroll-hint-icon-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 100%;
  pointer-events: none;
  z-index: 100;
}
.scroll-hint-text {
  font-size: 10px;
  color: #FFF;
  margin-top: 5px;
}
.scroll-hint-icon-wrap.is-active .scroll-hint-icon {
  opacity: .8;
}
.scroll-hint-icon:before {
  display: inline-block;
  width: 40px;
  height: 40px;
  color: #FFF;
  vertical-align: middle;
  text-align: center;
  content: "";
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDM8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIiBmaWxsPSIjZmZmIi8+PC9nPjwvZz48L3N2Zz4=);
}
.scroll-hint-icon:after {
  content: "";
  width: 34px;
  height: 14px;
  display: block;
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: -20px;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDE8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIgZmlsbD0iI2ZmZiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiIGZpbGw9IiNmZmYiLz48L2c+PC9nPjwvc3ZnPg==);
  opacity: 0;
  transition-delay: 2.4s;
}
.scroll-hint-icon-wrap.is-active .scroll-hint-icon:after {
  opacity: 1;
}
.scroll-hint-icon-wrap.is-active .scroll-hint-icon:before {
  animation: scroll-hint-appear 1.2s linear;
  animation-iteration-count: 2;
}
.scroll-hint-icon-white {
  background-color: #FFF;
  box-shadow: 0 4px 5px rgba(0, 0, 0, .4);
}
.scroll-hint-icon-white:before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDQ8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIi8+PC9nPjwvZz48L3N2Zz4=);
}
.scroll-hint-icon-white:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDI8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiLz48L2c+PC9nPjwvc3ZnPg==);
}
.scroll-hint-icon-white .scroll-hint-text {
  color: #000;
}

/* パスワード設定完了画面 */
.password a.back-btn {
  display: block;
  text-align: center;
}

/* フラッシュメッセージ */
.toast {
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background-color: #10218B;
  color: #fff;
  text-align: center;
  border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 1;
  left: 50%;
  bottom: 30px;
  font-size: 17px;
}

.toast.show {
  visibility: visible;
  animation: fadein 0.5s, fadeout 0.5s 5s;
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

/* シミュレーション画面の表組 */
.icon-container {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 4px;
}

.icon_print_container {
  background: #8ABDE8;
}

.icon_electric_container {
  background: #B8D881;
}

.icon_productivity_container {
  background: #FDD13E;
}
.icon_reduction_container {
  background: #0E8B65;
}