@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
/* tag */
*{margin:0;padding:0;font-family: 'Noto Sans Japanese', sans-serif;}
html{height:100%;}
.clearfix:after{
    content:".";display: block;clear: both;
    height:0;visibility: hidden;
}
input{-webkit-appearance: none;}
input[type="checkbox"]{width:18px;height:18px;border:1px solid #000000;-webkit-appearance:checkbox;}
input[type="radio"]{width:18px;height:18px;border:1px solid #000000;-webkit-appearance:radio;}
ul{list-style:none;}
p{text-align:left;}
h2{line-height:2.4em;color:#ffffff;background:rgba(255,136,0,0.6);text-align:center;border-radius:2px;margin-bottom:6px;}
h3{line-height:1.8em;color:#ffffff;background:rgba(137,160,44,0.6);text-align:center;border-radius:2px;margin-bottom:6px;}
textarea{resize: vertical;}
a{color:#ffa500;}

/* common class */
.fl_l{float:left;}
.fl_r{float:right;}
.ta_l{text-align:left;}
.ta_r{text-align:right;}
.inner2p{padding:10px;}
.inner10{padding:10px;}
.red{color:#ff0000;}

.success{color:#0000ff;font-size:12px;}
.error{color:#ff0000;font-size:12px;}
.msg{background:rgba(255,255,255,0.6);border-radius:8px;padding:10px;margin-bottom:20px;}
.msg.success{border:2px solid #0000ff;}
.msg.error{border:2px solid #ff0000;}

.sp_view{display:none;}

#mordal_lock{display:none;width:100%;height:100%;position:fixed;top:0px;left:0px;background:rgba(0,0,0,0.6);z-index:5;}
#mordal{display:none;width:80%;height:100%;position:fixed;left:0px;right:0px;top:0px;margin:auto;background:rgba(0,0,0,0.6);z-index:7;}
#mordal > div{display:none;}
#mordal div.load{width:100%;height:200px;margin:auto;position:absolute;top:0px;bottom:0px;left:0px;right:0px;}
#mordal div.load.ing{color:#ffffff;text-align:center;font-size:26px;line-height:160px;
background:url('../img/system/loading.gif') center center no-repeat;background-size:contain;}
#mordal div.load.complete{color:#ffffff;text-align:center;font-size:26px;line-height:160px;
background:url('../img/system/load_complete.png') center center no-repeat;background-size:contain;}
#mordal div.load.error{color:#ffffff;text-align:center;font-size:26px;line-height:160px;
background:url('../img/system/load_error.png') center center no-repeat;background-size:contain;}
#mordal div.load div.text{width:80%;height:40px;color:#ffffff;font-size:12px;line-height:1.6em;
position:absolute;margin:auto;left:0px;right:0px;bottom:-40px;}
#mordal div.load input[type="button"]{width:50px;height:50px;color:#ffffff;background:rgba(0,0,0,0);
line-height:30px;font-size:30px;padding:10px 0px;margin:auto;text-align:center;
border:4px solid #ffffff;border-radius:25px;position:absolute;left:0px;right:0px;bottom:-100px;display:block;}

ul.page_navi{width:100%;height:40px;}
ul.page_navi li{width:13%;height:30px;border:1px solid #ffa500;box-sizing:border-box;float:left;margin:5px 0.5%;border-radius:2px;line-height:30px;text-align:center;}
ul.page_navi li.left{width:13%;margin:5px 2% 5px 0px;}
ul.page_navi li.right{width:13%;margin:5px 0% 5px 2%;}
ul.page_navi li.current{font-weight:bold;color:#ffffff;background:#ffa500;}
ul.page_navi li a{width:100%;height:100%;display:block;margin:0px;padding:0px;border-radius:2px;color:#ff8800;background:rgba(255,255,255,0.4);text-decoration:none;}
ul.page_navi li a:hover{background:rgba(255,255,255,0.6);}

.skip_change{text-align:right;}
.skip_change select{width:60px;padding:2px;border-radius:4px;text-align:center;}
.skip_change input{width:60px;padding:4px;border-radius:4px;text-align:center;color:#ffffff;background:#ffa500;border:none;}


/* frame */
body{font-size:14px;line-height:20px;z-index:0;background:url('../img/template/bgi.jpg') no-repeat center center fixed;background-size:cover;height:100%;}
#wrap{width:800px;position:relative;margin:auto;z-index:1;}
#header{color:#ffffff;background:rgba(0,0,0,0.6);padding-top:120px;margin-bottom:20px;}
#body{color:#111111;background:rgba(255,255,255,0.8);}
#footer{text-align:right;font-size:10px;line-height:28px;color:#fff;}

/* header */
#title{width:350px;margin:auto 20px;float:left;}
#title #logo{width:100%;height:85px;background:url('../img/template/logo.png') no-repeat center center;background-size:contain;}
#title #description{text-align:right;}
#title #description .company{font-size:12px;}

#top_navi{width:50%;float:right;}
#top_navi dd{width:46%;height:36x;line-height:36px;text-align:center;float:left;margin:2%;}
#top_navi dd a{width:100%;height:100%;color:#ffffff;background:#ff6600;text-decoration:none;display:block;}

#tool_navi{width:400px;float:left;}
#tool_navi dt{width:50%;height:40px;margin:2%;float:left;position:relative;}
#tool_navi dd{width:10%;height:40px;margin:2.5%;float:left;position:relative;}
#tool_navi dd a{display:block;width:100%;height:100%;position:absolute;top:0px;left:0px;}
#tool_navi dd.navi1 a{background:url('../img/template/tool_navi1.png') no-repeat center center;background-size:contain;}
#tool_navi dd.navi2 a{background:url('../img/template/tool_navi2.png') no-repeat center center;background-size:contain;}
#tool_navi dd.navi3 a{background:url('../img/template/tool_navi3.png') no-repeat center center;background-size:contain;}

#main_navi{width:400px;float:left;}
#main_navi li{width:20%;height:80px;margin:2.5%;float:left;position:relative;}
#main_navi li a{display:block;width:100%;height:100%;border-radius:40px;position:absolute;top:0px;left:0px;cursor:crosshair;}
#main_navi li.navi1 a{background:url('../img/template/main_navi1.png') no-repeat center center;background-size:contain;}
#main_navi li.navi2 a{background:url('../img/template/main_navi2.png') no-repeat center center;background-size:contain;}
#main_navi li.navi3 a{background:url('../img/template/main_navi3.png') no-repeat center center;background-size:contain;}
#main_navi li.navi4 a{background:url('../img/template/main_navi4.png') no-repeat center center;background-size:contain;}

#add_navi{width:400px;float:right;display:none;margin-bottom:10px;}
#add_navi dt{width:97%;margin:1%;text-align:center;background:rgba(0,0,0,0.6);}
#add_navi dd{width:31%;height:50px;line-height:50px;margin:1%;float:left;position:relative;}
#add_navi dd a{display:block;width:100%;height:100%;position:absolute;top:0px;left:0px;background:rgba(255,255,255,0.8);text-decoration:none;text-align:center;}
#add_navi dd a:hover{background:rgba(255,255,255,0.4);}


/* body */
    /* mypage */
.top_main_list{width:25%;float:left;}
.top_main_list > dt{text-align:center;}
.top_main_list.task{color:#ffffff;background:rgba(137,160,44,1);}
.top_main_list.status{color:#ffffff;background:rgba(44,137,160,1);}
.top_main_list.draft{color:#ffffff;background:rgba(255,165,0,1);}
.top_main_list.done{color:#ffffff;background:rgba(200,55,55,1);}
.top_main_list dd.total{background:rgba(255,255,255,0.2);}
.top_main_list dd.secondary_num{color:#333333;}
.top_main_list > dd{text-align:center}
.top_main_list dd.total .num{font-size:36px;line-height:40px;}
.top_main_list dd.secondary_num .num{font-size:30px;line-height:36px;}

.top_report_list{width:73%;float:right;line-height:2.4em;}
.top_report_list thead th{border-bottom:dashed 1px #999999;text-align:center;}
.top_report_list tbody tr:hover{background:rgba(0,0,0,0.2);}
.top_report_list tbody td{border-bottom:dashed 1px #cccccc;padding:2px;overflow:hidden;}
.top_report_list tbody td.tag{text-align:center;}
.top_report_list tbody td.tag > span{display:block;height:20px;font-size:12px;line-height:20px;text-align:center;border-radius:8px;margin:auto;}
.top_report_list tbody td.tag > span.usual{width:40px;color:#ffffff;background:#2c89a0;}
.top_report_list tbody td.tag > span.important{width:40px;color:#222222;background:#ffcc00;}
.top_report_list tbody td.tag > span.urgent{width:40px;color:#ffffff;background:#c83737;}
.top_report_list tbody td.tag > span.status{color:#ffffff;background:#89a02c;}

.top_report_list.setting{width:100%;float:initial;line-height:2.4em;}
.top_report_list.setting input[type="checkbox"]{width:20px;height:20px;border-radius:4px;}
.top_report_list.setting tbody td.delete,.top_report_list.setting tbody td.return{text-align:center;}
.top_report_list.setting tbody td.delete:hover{background:#c83737;}
.top_report_list.setting tbody td.return:hover{background:#37abc8;}

    /* detail & edit */
.report_detail dt{width:20%;float:left;clear:both;padding:3px 0px;color:#ffffff;background:#555555;text-align:center;margin-bottom:6px;border-bottom:1px dashed #555555;position:relative;}
.report_detail dt .description{position:absolute;top:3px;right:3px;width:16px;height:16px;
background:url('../img/template/tool_navi3.png') no-repeat center center;background-size:contain;}
.report_detail dt .description .text{position:absolute;left:-206px;top:-28px;width:200px;height:60px;background:rgba(255,255,255,0.6);border-radius:6px;color:#000000;padding:3px;overflow:auto;display:none;}
.report_detail dd{width:76%;float:left;padding:3px 2%;border-bottom:1px dashed #555555;margin-bottom:6px;position:relative;}
.report_detail dd span.tag{display:block;width:40px;height:20px;font-size:12px;line-height:20px;text-align:center;border-radius:8px;float:left;margin:0px 2px;}
.report_detail dd span.tag.urgent{color:#ffffff;background:#c83737;}
.report_detail dd span.tag.important{color:#222222;background:#ffcc00;}
.report_detail dd span.belong_to{display:block;width:45%;background:rgba(255,255,255,0.4);padding:6px 2%;margin:0.5%;border-radius:6px;float:left;}
.report_detail dd span.checked_val{display:block;width:45%;background:rgba(255,255,255,0.4);padding:6px 2%;margin:0.5%;border-radius:6px;float:left;position:relative;}
.report_detail dd span.checked_val input{width:20px;height:20px;border-radius:4px;}
.report_detail dd span.checked_val label{width:100%;height:100%;position:absolute;}

.report_detail dt.error{background:#c83737;}
.report_detail dd.error input,.report_detail dd.error select,.report_detail dd.error textarea{background:#ffeeaa;}

.report_detail input[type="text"],.report_detail input[type="date"],.report_detail select,.report_detail textarea{padding:4px;width:100%;border-radius:6px;line-height:1.6em;}
.report_detail .units > div{position:relative;}
.report_detail .units input.url{width:80%;}
.report_detail .units input.bt{width:20px;height:20px;position:absolute;border-radius:10px;color:#ffffff;font-size:16px;line-height:20px;}
.report_detail .units input.add{right:30px;top:0px;background:#ff8800;}
.report_detail .units input.delete{right:00px;top:0px;background:#2c89a0;display:none;}
.report_detail textarea{height:4.8em;}
.report_detail label.flgs{display:inline-block;width:16%;text-align:right;}
.report_detail select.flgs{width:30%;}
/*
.report_detail select.flgs option.usual{color:#ffffff;background:#2c89a0;}
.report_detail select.flgs option.urgent{color:#ffffff;background:#c83737;}
.report_detail select.flgs option.important{color:#222222;background:#ffcc00;}
*/
.report_detail dd span.tag select{width:30%;}

input.edit_submit{display:block;width:90%;padding:8px 0px;margin:auto;color:#ffffff;border-radius:8px;background:#abc837;}

.price_tb{width:100%;}
.price_tb thead tr th div,.price_tb tbody tr.price_row td div{line-height:1.8em;}
.price_tb.detail thead tr th div,.price_tb.detail tbody tr.price_row td div{display:none;}
.price_tb thead tr th.date{width:12%;}
.price_tb thead tr th.object{width:25%;}
.price_tb thead tr th.detail{width:27%;}
.price_tb thead tr th.price{width:12%;}
.price_tb thead tr th.number{width:8%;}
.price_tb thead tr th.total{width:16%;}
.price_tb tbody tr.price_row:hover{background:rgba(255,255,255,0.6);}
.price_tb tbody tr.price_row td{padding:0px 2px;border-left:1px dashed #ffffff;position:relative;}
.price_tb tbody tr.price_row td.total div{text-align:center;}
.price_tb tbody tr td.detail_toggle{text-align:center;}
.price_tb tbody tr td input.price_tb_toggle_bt{border-radius:6px;color:#ffffff;background:#ff8800;padding:6px;text-align:center;}
.price_tb tbody tr.price_row td .price_tb_del_bt{display:none;padding:0px;width:30px;height:20px;font-size:10px;line-height:20px;border-radius:10px;color:#ffffff;background:#33aadd;text-align:center;position:absolute;margin:auto;top:0px;bottom:0px;right:-12px;}

.price_tb tbody tr.price_row input{width:90%;}
.price_tb tbody tr.price_row .date input{font-size:10px;line-height:2.0em;}

.report_comment{width:100%;}
.report_comment caption{line-height:1.8em;color:#ffffff;background:#ffaa00;border-radius:6px 6px 0px 0px;border:1px solid #ffffff;}
.report_comment thead th{color:#ffffff;background:#ff8800;border:1px solid #ffffff;}
.report_comment tbody tr{border-bottom:1px solid #ffffff;}
.report_comment tbody tr:hover{background:rgba(2555,2555,255,0.4);}
.report_comment tbody tr td{padding:4px;}
.report_comment .date{width:20%;}
.report_comment .name{width:20%;}
.report_comment .value{width:60%;}

.next_flow_section dt{width:20%;float:left;padding:3px 0px;color:#ffffff;background:#555555;text-align:center;margin-bottom:6px;}
.next_flow_section dd.select{width:28%;float:left;padding:0px 1%;margin-bottom:6px;position:relative;}
.next_flow_section dd select{width:96%;padding:3px 2%;border-radius:6px;position:absolute;}
.next_flow_section dd.button{padding:6px 1%;margin-bottom:6px;text-align:center;}
.next_flow_section dd.submit{width:98%;clear:both;border-bottom:1px dashed #555555;}
.next_flow_section dd.ng,.next_flow_section dd.return{width:48%;float:left;}
.next_flow_section dd input[type="button"]{width:90%;padding:8px 0px;color:#ffffff;border-radius:8px;}
.next_flow_section dd input[type="button"].submit{background:#abc837;}
.next_flow_section dd input[type="button"].ng{background:#c83737;}
.next_flow_section dd input[type="button"].return{background:#37abc8;}
.next_flow_section dd input[type="button"].edit{background:#ffa500;}
.next_flow_section dd select.next_account{display:none;}
.next_flow_section dt.comment{clear:both;float:left;}
.next_flow_section dd.comment{width:78%;padding:6px 1%;float:left;}
.next_flow_section dd.comment textarea{width:96%;padding:3px 2%;border-radius:6px;}

#search_form dd{width:50%;float:left;}
#search_form dd label{display:block;width:30%;padding:3px 0px;color:#ffffff;background:#555555;text-align:center;margin-bottom:6px;float:left;margin:2px auto;}
#search_form dd input,#search_form dd select{padding:4px 0.5%;margin:0px 1%;width:64%;border-radius:6px;line-height:1.6em;margin:2px auto;}
#search_form dd.date input{width:26%;}
#search_form dd.submit{width:100%;text-align:center;padding:12px 0px;}
#search_form dd.submit input{color:#ffffff;background:#ffa500;}

.setting_list dt{width:40%;clear:both;float:left;padding:6px 0px;color:#ffffff;background:#555555;text-align:center;margin-bottom:6px;line-height:1.6em;}
.setting_list dd{width:25%;float:left;}
.setting_list dd input,.setting_list dd select{padding:4px 0.5%;margin:0px 1%;width:97%;border-radius:6px;line-height:1.6em;margin:2px 1%;}
.setting_list dd input[type="checkbox"]{width:20px;height:20px;margin-left:5%;}
.setting_list dd.password{width:100%;margin-bottom:10px;display:none;}
.setting_list dd.password label{display:block;width:48%;padding:0px 1%;text-align:right;float:left;}
.setting_list dd.password input{width:46%;float:left;}
.setting_list dd.submit{width:100%;text-align:center;padding:12px 0px;}
.setting_list dd.submit input{color:#ffffff;background:#ffa500;width:68%;}

.setting_report_list input[type="submit"]{width:48%;padding:8px 0px;color:#ffffff;border-radius:8px;margin:1%;float:left;}
.setting_report_list input[type="submit"].ng{background:#c83737;}
.setting_report_list input[type="submit"].return{background:#37abc8;}

.setting_comment_list .comment{background:rgba(255,255,255,0.6);}
.setting_comment_list .report{color:#ffffff;background:rgba(0,0,0,0.6);font-size:12px;}
.setting_comment_list tbody tr td a{color:#ff8800;}
.setting_comment_list input[type="submit"]{width:48%;padding:8px 0px;color:#ffffff;border-radius:8px;margin:10px auto;display:block;}
.setting_comment_list input[type="submit"].ng{background:#c83737;}

.template_edit_list > dd{border:2px solid rgba(0,0,0,0.2);border-radius:8px;padding:6px;position:relative;}
.template_edit_list > dd.error{border:2px solid rgba(255,0,0,0.4);background:rgba(255,120,0,0.2);}
.template_edit_list > dd.error .error{border:2px solid rgba(255,0,0,0.4);background:rgba(255,200,0,0.6);}
.template_edit_list > dd:hover{border:2px solid rgba(0,0,0,0.4);background:rgba(255,255,255,0.6);}
.template_edit_list input[type="text"],.template_edit_list select{padding:6px;border-radius:6px;border:none;background:rgba(255,120,0,0.4);margin:4px;}
.template_edit_list input[type="text"]:hover,.template_edit_list select:hover{background:rgba(255,255,255,1);}
.template_edit_list input[type="checkbox"]、.template_edit_list input[type="radio"]{width:24px;height:24px;}
.template_edit_list textarea{width:78%;height:30px;border-radius:10px;padding:1%;}
.template_edit_list .value{display:none;}
.template_edit_list .value > div{position:relative;}
.template_edit_list .value > div input[type="text"]{width:80%;}
.template_edit_list input.bt{width:20px;height:20px;position:absolute;
    border-radius:10px;color:#ffffff;font-size:16px;line-height:20px;margin:2px;border:none;}
.template_edit_list input.add{background:#ff8800;right:30px;top:0px;}
.template_edit_list input.delete{background:#2c89a0;display:none;right:0px;top:0px;}
.template_edit_list .tool{width:10px;height:20px;position:absolute;right:6px;top:4px;}
.template_edit_list .tool .tool_bt{width:10px;height:20px;background:url('../img/template/tool_bt.png') no-repeat center center;background-size:contain;border:none;}
.setting_template_list input[type="submit"]{width:48%;padding:8px 0px;color:#ffffff;border-radius:8px;margin:10px auto;display:block;background:#c83737;}

#tool_bt_menu{position:absolute;display:none;background:rgba(0,0,0,0.6);padding:8px;width:200px;z-index:5;border-radius:8px;}
#tool_bt_menu li{color:#ffffff;padding:4px;}
#tool_bt_menu li:hover{background:rgba(255,255,255,0.4);}
#tool_bt_menu li.inactive{color:#555555;}
#tool_bt_menu li.inactive:hover{background:rgba(255,255,255,0.0);}
#default_part{display:none;}

.setting_template_list .template_edit_main{margin-bottom:20px;padding:6px;background:rgba(255,255,255,0.4);border-radius:6px;}
.setting_template_list .template_edit_main dd{width:96%;padding:1%;background:rgba(255,255,255,0.6);border-radius:6px;
margin:1%;position:relative;}
.setting_template_list .template_edit_main dd input[type="text"]{padding:1%;border-radius:6px;border:none;background:rgba(255,120,0,0.4);margin:1%;width:96%;}
.setting_template_list .template_edit_main dd input[type="text"]:hover{background:rgba(255,255,255,1);}
.setting_template_list .template_edit_main.error{border:2px solid rgba(255,0,0,0.4);background:rgba(255,120,0,0.2);}

.setting_template_list .companies_select{margin-bottom:20px;padding:6px;background:rgba(255,255,255,0.4);border-radius:6px;}
.setting_template_list .companies_select dd{width:46%;padding:1%;float:left;background:rgba(255,255,255,0.6);border-radius:6px;
margin:1%;position:relative;}
.setting_template_list .companies_select dd input[type="checkbox"]{width:20px;height:20px;border-radius:4px;}
.setting_template_list .companies_select dd label{width:100%;height:100%;position:absolute;}
.setting_template_list .companies_select.error{border:2px solid rgba(255,0,0,0.4);background:rgba(255,120,0,0.2);}

.template_edit_list.flow .accounts{width:98%;padding:1%;background:rgba(255,255,255,0.4);border-radius:6px;}
.template_edit_list.flow .accounts span{display:block;width:29%;padding:1%;margin:1%;float:left;background:rgba(255,255,255,0.4);border-radius:6px;}

#accounts_select_menu{width:80%;position:absolute;margin:auto;left:0px;right:0px;background:rgba(0,0,0,0.6);padding:10px;border-radius:6px;display:none;}
#accounts_select_menu li{width:29%;float:left;background:rgba(255,255,255,0.8);padding:1%;margin:1%;border-radius:6px;position:relative;}
#accounts_select_menu li.caption,#accounts_select_menu li.submit{width:96%;color:#ffa500;background:rgba(0,0,0,0.4);}
#accounts_select_menu li input[type="checkbox"]{width:20px;height:20px;border-radius:4px;}
#accounts_select_menu li label{width:100%;height:100%;position:absolute;}

.help_index dt{padding:4px;margin:4px;color:#ffffff;background:rgba(255,120,0,0.8);}
.help_index dd{padding:8px;margin:4px;color:#ffffff;background:rgba(0,0,0,0.7);border-radius:8px;margin-bottom:20px;display:none;}
.help_index dd a{color:#ff8800;}
.help_index dd img{width:60px;margin:6px;}
.help_index dd .alert{color:#ffa500;font-size:12px;padding:4px;}

.common_table{width:100%;margin-bottom:20px;}
.common_table > caption{color:#fff;background:#f80;text-align:center;border-radius:4px;margin-bottom:10px;padding:4px;}
.common_table > thead > tr > th{color:#fff;background:#555;text-align:center;padding:4px;}
.common_table > tbody > tr{border-bottom:1px dashed #555;}
.common_table > tbody > tr:hover{background:rgba(255,255,255,0.6);}
.common_table > tbody > tr > td{text-align:center;padding:4px;}

@media screen and (min-width: 830px){
}
@media screen and (max-width: 830px){
/* common class */
    .inner2p{padding:2vw;}
    
/* frame */
    #wrap{width:96%;}
    #header{padding-top:60px;}
    
/* header */
    #title{width:40%;}
    #tool_navi{width:50%;}
    #main_navi{width:50%;}
    #add_navi{width:99%;clear:both;margin:auto auto 10px auto;}
}
@media screen and (max-width: 700px){
/* common class */
    .pc_view{display:none;}
    .sp_view{display:initial;}
/* header */
    #tool_navi dt{font-size:12px;}
    
/* body */
    /* mypage */
    .top_main_list{width:initial;float:initial;margin-bottom:8px;}
    .top_report_list{width:100%;float:initial;}
    .top_main_list{width:initial;float:initial;}
    .top_main_list dt{width:46%;float:left;line-height:30px;padding:2%;}
    .top_main_list dd.total{width:46%;float:right;text-align:right;padding:2%;}
    .top_main_list dd.total .num{font-size:30px;line-height:30px;}
    .top_main_list dd.secondary_num{width:96%;float:right;text-align:right;padding:0px 2%;}
    .top_main_list dd.secondary_num .num{font-size:initial;line-height:initial;}
    
    /* detail */
    .price_tb{display:block;width:initial;}
    .price_tb thead,.price_tb tbody{display:block;width:initial;}
    .price_tb thead tr{display:block;width:initial;background:rgba(255,255,255,0.4);border-radius:4px;margin:4px;}
    .price_tb thead tr:after{
        content:".";display: block;clear: both;
        height:0;visibility: hidden;
    }
    .price_tb tbody tr.price_row{display:block;width:initial;background:rgba(255,255,255,0.4);border-radius:4px;margin:4px;border-left:6px solid #555555;}
    .price_tb tbody tr.price_row:after{
        content:".";display: block;clear: both;
        height:0;visibility: hidden;
    }
    .price_tb tbody tr.total_row{display:block;width:initial;margin:4px;}
    .price_tb tbody tr.total_row:after{
        content:".";display: block;clear: both;
        height:0;visibility: hidden;
    }
    .price_tb thead tr th{display:block;float:left;padding:0px;margin:0px;text-align:center;border:none;}
    .price_tb tbody tr.price_row td{display:block;float:left;padding:0px;margin:0px;text-align:center;border:none;}
    .price_tb thead tr th.date{width:40%;}
    .price_tb thead tr th.object{width:60%;}
    .price_tb thead tr th.detail{width:100%;}
    .price_tb thead tr th.price{width:33.3%;}
    .price_tb thead tr th.number{width:33.3%;}
    .price_tb thead tr th.total{width:33.3%;}
    .price_tb tbody tr td.date{width:40%;}
    .price_tb tbody tr td.object{width:60%;}
    .price_tb tbody tr td.detail{width:100%;}
    .price_tb tbody tr td.price{width:33.3%;}
    .price_tb tbody tr td.number{width:33.3%;}
    .price_tb tbody tr td.total{width:33.3%;}
    .price_tb thead tr th div{border-radius:4px;margin:1%;color:#ffffff;background:rgba(0,0,0,0.4);line-height:1.2em;}
    .price_tb tbody tr.price_row td div{border-radius:4px;margin:1%;background:rgba(255,255,255,0.4);}
    .price_tb tbody tr.total_row th,.price_tb tbody tr.total_row td{display:block;width:33%;float:left;}
    
    .price_tb tbody tr.price_row .date input{font-size:14px;line-height:1.8em;}
    
    .next_flow_section dt{padding:8px 0px;margin-bottom:10px;}
    .next_flow_section dd.select{margin-bottom:10px;}
    .next_flow_section dd select{padding:8px 2%;}
    .next_flow_section dd input[type="button"]{padding:12px 0px;margin:10px auto;border:none;}
    
    #search_form dd.value{width:100%;}
    #search_form dd.date{width:100%;}
}
@media screen and (max-width: 500px){
    #wrap{width:96vw;}
    #title{width:90%;float:initial;margin:auto;}
    #title #logo{width:100%;height:50px;}
    #title #description{font-size:12px;}
    #title #description .company{font-size:10px;}
    #top_navi{width:90%;float:initial;margin:auto;}
    #tool_navi{width:100%;float:initial;margin:auto;}
    #main_navi{width:100%;float:initial;margin:auto;}
    
    #add_navi{width:96vw;}
    #add_navi dt{width:94vw;margin:1vw;}
    #add_navi dd{width:30vw;height:50px;margin:1vw;}
    
/* body */
    /* mypage */
    
    .top_report_list{display:block;}
    .top_report_list tbody{display:block;}
    .top_report_list thead{display:none;}
    .top_report_list tbody tr{display:block;border:1px solid #999999;padding:6px;border-radius:10px;margin-bottom:10px;position:relative;padding-top:30px;}
    .top_report_list tbody tr:after{
        content:".";display: block;clear: both;
        height:0;visibility: hidden;
    }
    .top_report_list tbody tr td{border-bottom:none;display:block;float:left;font-size:12px;}
    .top_report_list tbody tr td a{display:block;width:94%;height:100%;line-height:24px;padding:0% 3%;position:absolute;top:0px;left:0px;z-index:5;text-decoration:none;}
    .top_report_list tbody tr td.date{width:44%;}
    .top_report_list tbody tr td.type{width:44%;}
    .top_report_list tbody tr td.subject{width:96%;}
    .top_report_list tbody tr td.author{width:24%;}
    .top_report_list tbody tr td.tag{width:24%;}
    .top_report_list tbody td.tag > span{width:90%;line-height:16px;height:16px;font-size:10px;}
    .top_report_list tbody td.tag > span.usual{display:none;}
    .top_report_list tfoot{display:block;}
    .top_report_list tfoot tr{display:block;}
    .top_report_list tfoot td{display:block;}
    
    /* detail */
    .report_detail dt{width:initial;float:initial;text-align:left;padding:2px;}
    .report_detail dd{width:initial;float:initial;}
    .report_detail dd span.belong_to{width:95%;}
    .report_detail dd span.checked_val{width:95%;}
    
    .report_detail label.flgs{width:26%;}
    .report_detail select.flgs{width:56%;margin-bottom:8px;}
    
    .report_comment thead{display:none;}
    .report_comment{display:block;}
    .report_comment caption{display:block;border:none;border-radius:6px;}
    .report_comment tbody{display:block;}
    .report_comment tbody tr{display:block;border-radius:4px;margin:1%;padding:6px;background:rgba(255,255,255,0.4);border:none;}
    .report_comment tbody tr:after{
        content:".";display: block;clear: both;
        height:0;visibility: hidden;
    }
    .report_comment tbody tr td{display:block;}
    .report_comment tbody tr td.date,.report_comment tbody tr td.name{width:28%;padding:1%;float:left;}
    .report_comment tbody tr td.date{font-size:80%;}
    .report_comment tbody tr td.value{width:68%;padding:1%;float:right;}
    
    .next_flow_section dt{width:40%;clear:both;}
    .next_flow_section dd.select{width:58%;}
    .next_flow_section dd.comment{width:58%;}
    .next_flow_section dd.comment textarea{height:60px;}

    #search_form dd.account{width:100%;}
    #search_form dd.template{width:100%;}
    
    .setting_list dt{width:50%;}
    .setting_list dd{width:50%;}
    .setting_list dd.password label{width:98%;text-align:left;float:initial;}
    .setting_list dd.password input{width:96%;float:initial;}
    
    .setting_comment_list tbody tr{padding-top:6px;}
    .setting_comment_list tbody tr td{width:100%;}
    .setting_comment_list tbody tr td a{display:initial;width:initial;height:initial;position:initial;color:#ff8800;}

    .setting_template_list tbody tr{padding-top:6px;}
    .setting_template_list tbody tr td.name{width:48%;}
    .setting_template_list tbody tr td.date{width:48%;}
    .setting_template_list tbody tr td.edit{width:48%;}
    .setting_template_list tbody tr td.flow{width:48%;}
    .setting_template_list tbody tr td a{display:block;width:100%;border-radius:6px;color:#ffffff;position:initial;line-height:36px;text-align:center;}
    .setting_template_list tbody tr td.edit a{background:#ffa500;}
    .setting_template_list tbody tr td.flow a{background:#ff8800;}
    .report_detail .units input.bt{border:none;}
    
    .template_edit_list.flow .accounts span{display:block;width:46%;padding:1%;margin:1%;float:left;background:rgba(255,255,255,0.4);border-radius:6px;}
    
    #accounts_select_menu li{width:46%;float:left;background:rgba(255,255,255,0.8);padding:1%;margin:1%;border-radius:6px;position:relative;}
}
@media screen and (max-height: 470px){
}