﻿
body
{
    margin-left: 0;
    margin-top: 0;
    padding: 0;
    font-size: 10pt;
    font-family: "ＭＳ　Ｐゴシック" , "ＭＳ　ゴシック" , "Osaka" , "sans-serif";

}
a{
   background:none;
      
}

#global_header
{
    background-image: url("../img/title.jpg" );
    background-repeat: no-repeat;
    width: 1000px;
    height: 65px;
}

.mini_menu div
{
	float: right;
    padding: 2px 2px;
    border-right: dotted 1px #6666FF;
    font-size:x-small;
}

.menu div
{
    float: right;
    padding: 3px 6px;
    border-right: dotted 1px #666666;
}

.menu div.menu1
{
    border-left: dotted 1px #666666;
}

.menu a
{
    vertical-align: middle;
    font-size: 9pt;
}
/*
a:visited { color:#0000ff; text-decoration:none }
*/

.menu a:hover
{
    color: #DD0000;
}


#maincontent
{
    clear: right;
    margin-top: 0;
    margin-left: 0;
}

#footer
{
    padding: 4px 0 4px 0;
}

hr#line1
{
    height: 1px;
    width: 1000px;
}

hr#line2
{
    height: 1px;
    width: 1000px;
}

table#buttonLine1
{
    padding: 4px 10px 4px 10px;
}
table#buttonLine2
{
    padding-left: 10px;
    padding-right: 10px;
}
table#buttonLine3
{
    padding: 4px 10px 4px 10px;
}



/* :n]]~i */
.button
{
    position: relative;
    left: 25px;
    border: solid 1px;
    border-spacing: 7px;
    padding: 0;
}
.message
{
    position: relative;
    left: 25px;
    margin: 7px 0px 5px 0px;
}
.entity
{
    position: relative;
    left: 25px;
    border-spacing: 1px;
    padding: 4px;
}
table.entity
{
    margin: 2px;
    border-collapse: separate;
}
table
{
	font-size:10pt;
}
textarea.entity
{
    font-size: 9pt;
    font-family: "ＭＳ Ｐゴシック" , "ＭＳ ゴシック" , "Osaka" , "sans-serif";
    font-style: normal;    
}
/* gh]i]|]a]]]|gx */
.input_error
{
    margin: 5px 0px 5px 0px;
}
/* ][g */
.master_list_table
{
    border: solid 1px;
}
.master_list_header
{
    background-color: #dddddd;
}
.master_list_item_id
{
    width: 60px;
    text-align: center;
}
.master_list_item_name
{
    width: 160px;
    text-align: left;
}
.master_list_item_address
{
    width: 200px;
    text-align: left;
}
.master_list_item_tel
{
    width: 120px;
    text-align: left;
}
.master_list_item_time
{
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
.master_list_item_description
{
    width: 200px;
    text-align: left;
}
.entity_name
{
    width: 160px;
    height: 24px;
    background-color: #D3D7EA;
    line-height: 100%;
    font-weight: bold;
    color: #333333;
}
.entity_name_nowidth
{
    height: 24px;
    background-color: #D3D7EA;
    line-height: 100%;
    font-weight: bold;
    color: #333333;
}
.entity_name_body
{
    margin-left: 8px;
}
.entity_name_shifted
{
    width: 160px;
    height: 24px;
    background-color: #D3EAD7;
    line-height: 100%;
    font-weight: bold;
    color: #333333;
    padding-left: 12px;
}
.entity_value
{
}
.entity_value_button
{
    margin: 0px 0px 0px 10px;
}
.input_default
{
    width: 180px;
}
.input_name
{
    width: 440px;
}
.input_address
{
    width: 440px;
}
.input_comment
{
    width: 440px;
    height: 100px;
    font-size: 10pt;
    font-family: 'MS UI Gothic' , 'ＭＳ Ｐゴシック' , Osaka, sans-serif;
    font-style: normal;
    ime-mode: active;
}
.input_unitprice
{
    text-align: right;
    ime-mode: disabled;
    width: 110px;
}
.input_number
{
    text-align: right;
    ime-mode: disabled;
    width: 40px;
}
.input_pc_password
{
    ime-mode: disabled;
    width: 110px;
}
.input_mobile_password
{
    ime-mode: disabled;
    width: 110px;
}
.select_resource_list
{
    width: 180px;
    height: 200px;
}

/* q*/
.report_input_name
{
    background-color: #dddddd;
    width: 80px;
}
.report_assign_count
{
    text-align: right;
    width: 60px;
}
.report_reserve_time
{
    text-align: right;
    width: 60px;
}
.report_price
{
    text-align: right;
    width: 80px;
}

/* ]m]|]k */
.role_table
{
    border: solid 0px;
}
.role_name
{
    width: 160px;
}
.role_name_dummy
{
    border: solid 0px;
    background-color: #FFFFFF;
    color: #000000;
    width: 160px;
}
.role_value_input
{
    width: 100px;
}
.role_value_input_dummy
{
    text-align: center;
    border: solid 0px;
    background-color: #FFFFFF;
    color: #000000;
    width: 100px;
}
.role_value
{
    text-align: center;
    width: 100px;
}

/* gw] */
.shift_table
{
    border: solid 1px;
    border-spacing: 1px;
    background-color: #000000;
    border-bottom: solid 0px;
    border-left: solid 0px;
    border-right: solid 0px;
    border-top: solid 0px;
}
.shift_datetime_yyyymm
{
    font-weight: bold;
}
.shift_table_title_dummy
{
    text-align: center;
    background-color: #FFFFFF;
    height: 30px;
}
.shift_table_datetime_dd
{
    background-color: #FFFFFF;
    text-align: center;
    width: 30px;
}
.shift_table_datetime_sunday
{
    color: #FF0000;
    background-color: #FFFFFF;
    text-align: center;
    width: 30px;
}
.shift_table_datetime_suturday
{
    color: #0000FF;
    background-color: #FFFFFF;
    text-align: center;
    width: 30px;
}
.shift_table_datetime_otherday
{
    color: #000000;
    background-color: #FFFFFF;
    text-align: center;
    width: 30px;
}
.shift_table_notes
{
    background-color: #FFFFFF;
    width: 240px;
}
.shift_notes_input
{
    width: 200px;
    border: solid 0px;
    background-color: #FFFFFF;
    color: #000000;
}
.shift_table_holiday
{
    background-color: #FFFFFF;
    text-align: center;
    width: 30px;
}
.shift_table_shifttype
{
    background-color: #FFFFFF;
    width: 400px;
    text-align: center;
}
.shift_table_input
{
    background-color: #FFFFFF;
    width: 220px;
    text-align: center;
}
/* Rz*/
.passed_table
{
    border: solid 0px;
}
/* tqeAt */
.reserve_log_table
{
    width: 980px;
}
.reserve_log_header
{
    background-color: #dddddd;
}
.reserve_log_item_date
{
    width: 120px;
    text-align: center;
}
.reserve_log_item_user
{
    width: 120px;
    text-align: center;
}
.reserve_log_item_version
{
    width: 40px;
    text-align: center;
}
.reserve_log_item_reason
{
    width: 80px;
    text-align: center;
}
.reserve_log_item_notes
{
    width: 300px;
}

/* modal */
/*Modal Popup*/
.modalBackground
{
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopup
{
    background-color: #ffffdd;
    border-width: 3px;
    border-style: solid;
    border-color: Gray;
    padding: 3px;
    width: 250px;
}


.FortaskDetail
{
    background-color: #ffffdd;
    border-width: 2px;
    border-style: solid;
    border-color: Gray;
    padding: 3px;   
}

/*CollapsiblePanel*/
.collapsePanel
{
    background-color: white;
    overflow: hidden;
}

.collapsePanelHeader
{
    width: 100%;
    height: 30px;
    background-image: url(../img/atlas/bg-menu-main.png);
    background-repeat: repeat-x;
    color: #FFF;
    font-weight: bold;
}

#master_content .collapsePanelHeader a
{
    color: #FFF;
}
#master_content .collapsePanelHeader a:hover
{
    text-decoration: none;
    background: none;
}

/* 受付画面 */
.info1
{
    font-size: 11pt;
    line-height: 100%;
    font-weight: bold;
    color: #555555;
    font-family: "ＭＳ Ｐゴシック" , "ＭＳ ゴシック" , "Osaka" , "sans-serif";
}
.info2
{
    font-size: 11pt;
    line-height: 100%;
    font-weight: bold;
    color: #2DA10C;
    font-family: "ＭＳ Ｐゴシック" , "ＭＳ ゴシック" , "Osaka" , "sans-serif";
}
.info3
{
    font-size: 11pt;
    line-height: 100%;
    font-weight: bold;
    color: #A10C1B;
    font-family: "ＭＳ Ｐゴシック" , "ＭＳ ゴシック" , "Osaka" , "sans-serif";
}
.info4
{
    font-size: 11pt;
    line-height: 100%;
    font-weight: bold;
    color: #2DA10C;
    font-family: "ＭＳ Ｐゴシック" , "ＭＳ ゴシック" , "Osaka" , "sans-serif";
}
/*Popup Control*/
.popupControl
{
    background-color: White;
    position: absolute;
    visibility: hidden;
    z-index: 2;
}

.DeletedImage
{
    position: absolute;
    top: 160px;
    left: 520px;
    z-index: 2;
    clear: left;
}

a.warning_msg
{
	font-size: 8pt;
    line-height: 100%;
    color: #FF0000;
}

.warning_item
{
    line-height: 100%;
    color: #FF0000;
}
a:active a:hover a:link
{
}
.input_tagname
{
    ime-mode: active;
}

.gr_selected_res
{
	
	font-weight: bold;
}

.gr_other_res
{
	
	font-weight:normal;
}
input.hidden
{
	width: 0px;
	height: 0px;
	background-color: Transparent;
	border: none 0px Transparent;
}



       .MyTabStyle .ajax__tab_header
        {
            font-family: "Helvetica Neue" , Arial, Sans-Serif;
            font-size: 14px;
            font-weight:bold;
            display: block;

        }
        .MyTabStyle .ajax__tab_header .ajax__tab_outer
        {
            border-color: #222;
            color: #222;
            padding-left: 10px;
            margin-right: 3px;
            border:solid 1px #d7d7d7;
        }
        .MyTabStyle .ajax__tab_header .ajax__tab_inner
        {
            border-color: #666;
            color: #666;
            padding: 3px 10px 2px 0px;
        }
        .MyTabStyle .ajax__tab_hover .ajax__tab_outer
        {
            background-color:#9acd32;/*ホバーしたときのタブの背景色*/
        }
        .MyTabStyle .ajax__tab_hover .ajax__tab_inner
        {
            color: #fff;
        }
        .MyTabStyle .ajax__tab_active .ajax__tab_outer
        {
            border-bottom-color: #0022ff;/*選択中のタブの背景色*/
            background-color: #0022ff;/*選択中のタブの背景色*/
        }
        .MyTabStyle .ajax__tab_active .ajax__tab_inner
        {
            color: #ffffff;/*選択中の文字の色*/
            border-color: #333;
        }
        .MyTabStyle .ajax__tab_body
        {
            font-family: verdana,tahoma,helvetica;
            font-size: 10pt;
            background-color: #ffffff;
            border-top-width: 0;
            border: solid 1px #d7d7d7;
            border-top-color: #ffffff;
        }
        
        .mytesttable
        {
			margin-left:7px; 
			margin-top:7px; 
			font-weight:bold; 
			text-align:center; 
			border-color:#eeeeee;
			border-style:solid;
		    
			
			
        }

      
table.jissekidate 
{
	width:130px;
	
	/* border:1px solid #663300; */
   
    border-collapse:collapse;
    /* table-layout:fixed; */
}
table.jissekidate  td
{
	/* border:1px solid #663300; */
	 table-layout: fixed;
}
table.jissekidate .topwid
{
	 width:65px;/* 2spanWid */
	 /*  border:2px solid #FF0000; */
}
table.jissekidate .l_side
{

 width:50px;
 /* border:2px solid #663300; */
}
table.jissekidate .r_side
{

 width:15px;
 /*  border:2px solid #00ff00; */
}


.work-confirmed-status {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    color: #dc3545; /* テキストの色を赤に */
    font-weight: bold; /* テキストを太字に */

    font-size: 14px;
    cursor: default; /* クリック不可のためdefaultカーソル */
}

    /* アイコンの表示（確定済みのアイコン） */
    .work-confirmed-status::before {
        content: ''; /* テキスト内容は空にする */

        background-image: url('../img/bookmark-check.png');
        background-size: contain; /* アイコンのサイズに合わせて調整 */
        background-repeat: no-repeat;
        background-position: left;
        /* アイコンの表示サイズを指定 */
        width: 20px;
        height: 20px;
        position: absolute;
        left: 5px; /* ボタン左端からの距離 */
        top: 50%;
        transform: translateY(-50%); /* 上下中央揃え */
    }

    .work-confirmed-status.fixed-amount::before {
        /* 金額確定のアイコン画像を使用する場合 */
        background-image: url('../img/calculator.png');
    }

/* 作業確定ボタンのベースクラス */
.conform {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    overflow: hidden;
}

    .conform:hover {
        filter: brightness(1.2); /* マウスオーバー時に明るくする */
    }

    .conform:disabled {
        filter: grayscale(100%) opacity(0.3); /* 非活性時にグレーアウト */
        cursor: default;
    }

    /* 作業確定ボタン */
    .conform.finish-operate {
        background-image: url('../img/finish-operate.png');
        width: 180px;
        height: 42px;
    }

    /* 作業確定取り消しボタン */
    .conform.operate-cancel {
        background-image: url('../img/finish-operate-cancel.png');
        width: 180px;
        height: 42px;
    }

    /* 金額確定ボタン */
    .conform.fix-charge {
        background-image: url('../img/fix-charge.png');
    }

    /* 金額確定取り消しボタン */
    .conform.fix-charge-cancel {
        background-image: url('../img/fix-charge-cancel.png');
    }

.modern-icon-button {
    position: relative; /* アイコンを絶対配置するための基準 */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    padding: 0 25px 0 45px; /* テキストの左右の余白を調整 */


    border-radius: 50px; /* 角を強く丸め、ピル形状に */
    border: 2px solid #007bff; /* 枠線を2pxの水色に */
    background-color: #fff; /* 背景を白に */
    font-weight: bold; /* テキストを太字に */
    color: #007bff;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease-in-out; /* アニメーション効果 */
    z-index: 0;
}

    /* ホバー（マウスが乗った時）の効果 */
    .modern-icon-button:hover {
        background-color: #e9f4ff; /* 背景を薄い水色に */
        border-color: #0056b3;
        color: #0056b3;
    }

    /* アクティブ（クリック中）の効果 */
    .modern-icon-button:active {
        transform: translateY(1px); /* 少し沈むアニメーション */
    }

    
    .modern-icon-button.move {
        color: #007bff; /* テキストの色を水色に */
        background-color: #fff; /* 背景を白に */
        border: 2px solid #007bff; /* 枠線を2pxの水色に */
        margin-right: 10px;
    }

        .modern-icon-button.move::before {
            content: '';
            background-image: url('../img/chevron-left.png');
            background-size: contain; /* アイコンのサイズに合わせて調整 */
            background-repeat: no-repeat;
            background-position: center;
            width: 20px;
            height: 20px;
            position: absolute;
            left: 10px; /* ボタン左端からの距離 */
            top: 50%;
            transform: translateY(-50%); /* 上下中央揃え */
        }

        .modern-icon-button.move:hover {
            background-color: #e9f4ff; /* 背景を薄い水色に */
            border-color: #0056b3;
            color: #0056b3;
        }

    .modern-icon-button.no-icon {
        padding: 0 25px; /* 左右対称のパディングに変更 */
        margin-right: 10px;
        height: 35px !important;
        border: 2px solid #cc8c00;
        color: #cc8c00; /* テキストの色を濃い黄色系に変更 */
    }

        .modern-icon-button.no-icon::before {
            display: none;
        }

        .modern-icon-button.no-icon:not(:disabled):hover {
            background-color: #fff3cd; /* ホバー時の背景を少し濃い薄黄色に */
            border-color: #b8860b; 
            color: #b8860b; 
        }

    .modern-icon-button:disabled {
        background-color: #f5f5f5; /* 背景をグレーに */
        color: #999999; 
        border: 2px solid #cccccc; /* 枠線をグレーに */
        cursor: default; /* カーソルを通常の矢印に */
        opacity: 0.6;
        box-shadow: none; 
    }
    /*汎用色付きボタン*/
    .modern-btn {
        display: inline-block;
        padding: 6px 14px;
        border-radius: 20px;
        border: 1px solid transparent;
        font-weight: bold;
        color: #fff;
        background-color: #1f6feb; /* プライマリ（青） */
        box-shadow: 0 1px 2px rgba(0,0,0,.08);
        transition: background-color .15s ease, box-shadow .15s ease, transform .02s ease;
    }

        .modern-btn:hover {
            background-color: #1a5fd0;
            box-shadow: 0 2px 6px rgba(0,0,0,.12);
        }

        .modern-btn:active {
            transform: translateY(1px);
        }

    .modern-btn--danger {
        color: #fff;
        background-color: #e03131;
        border-color: #e03131;
    }

        .modern-btn--danger:hover {
            background-color: #c92a2a;
            border-color: #c92a2a;
        }