@charset "UTF-8";

/* ------------------------------- */
/* 全体                            */
/* ------------------------------- */
* { 
        margin: 0;
        padding: 0;
        /* box-sizing: border-box; */
}

body{
        width: 1200px;
        background-color: #fffdeb;
        
        border: solid 2px;
}

a{
	text-decoration: underline blue;
	color: blue;

}
/* ------------------------------- */
/* ヘッダー部                      */
/* ------------------------------- */
header{
	display: grid;
	grid-template-columns: 70px 1130px;
	grid-template-rows: 120px;
	background: #6666ff;
	
	/* background: #55aaff; */
}

header div#main_title_box{
	grid-column: 2 / 3;
}

header div#main_title_box_2{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 120px;
}

header h1#main_title{
       grid-column: 1 / 2;
       grid-row:    1 / 2;
       /* margin: 20px 0; */
       font-size: 57px;
       font-weight: bold;
       
       justify-self: start;
       align-self:   center;
       
       /* text-align: left; */
       
       color: #ffffff;
       
       /* border: solid 2px; */
       
}

/* ------------------------------- */
/* main grid定義と配置             */
/* ------------------------------- */
main{
	display: grid;
	grid-template-columns: 250px 700px 250px;
	grid-template-rows: 80px auto;
}

main div#before_link_box{
       grid-column: 2 / 3;
       grid-row:    1 / 2;
       
       /* border: solid 2px; */
}

main div#main_contents_wrapper{
       grid-column: 2 / 3;
       grid-row:    2 / 3;
       /* border: solid; */
}

main div#left_menu{
       grid-column: 1 / 2;
       grid-row:    1 / 3;
       
       background: #ccff66;

       /* border: solid; */
}

main div#right_menu{
       grid-column: 3 / 4;
       grid-row:    1 / 3;
       
       background: #ccff66;

       /* border: solid; */
}

/* ------------------------------- */
/* 前画面へのリンクボタン定義      */
/* ------------------------------- */

main div#before_link_box_2{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 80px;

	/* border: solid 2px; */
}

main a.button_link_top{
        grid-column: 1 / 2;
        grid-row:    1 / 2;
        
        font-size:   28px;
        font-weight: bold;
        
        justify-self: end;
        align-self:   center;
        
        margin: 0 20px 5px 0;
        
}


/* ------------------------------- */
/* 左右メニューのリンクボタン      */
/* ------------------------------- */
a.button_link_side{
        font-size:   28px;
        font-weight: bold;
	text-align:  center;
	line-height: 1.2;
}

/* ------------------------------- */
/* 左メニューリスト（#left_menu）  */
/*  #left_menu_list grid定義と配置 */
/* ------------------------------- */
main div#left_menu_list{
	display: grid;
	grid-template-columns: 20px 220px 10px;
	grid-template-rows:    50px repeat(8, 60px 50px) auto;
}

main div#left_menu_list div#exp_01{
	grid-column: 2 / 3;
	grid-row:    2 / 3;
}

main div#left_menu_list div#exp_02{
	grid-column: 2 / 3;
	grid-row:    4 / 5;
}

main div#left_menu_list div#exp_03{
	grid-column: 2 / 3;
	grid-row:    6 / 7;
}

main div#left_menu_list div#exp_04{
	grid-column: 2 / 3;
	grid-row:    8 / 9;
}

main div#left_menu_list div#exp_05{
	grid-column:  2 /  3;
	grid-row:    10 / 11;
}

main div#left_menu_list div#exp_06{
	grid-column:  2 /  3;
	grid-row:    12 / 13;
}

/* ------------------------------- */
/* 右メニューリスト（#left_menu）  */
/*  #right_menu_list grid定義と配置 */
/* ------------------------------- */

main div#right_menu_list{
	display: grid;
	grid-template-columns: 20px 220px 10px;
	grid-template-rows:    50px repeat(8, 60px 50px) auto;
}

main div#right_menu_list div#exp_51{
	grid-column: 2 / 3;
	grid-row:    2 / 3;
}

main div#right_menu_list div#exp_52{
	grid-column: 2 / 3;
	grid-row:    4 / 5;
}

main div#right_menu_list div#exp_53{
	grid-column: 2 / 3;
	grid-row:    6 / 7;
}

main div#right_menu_list div#exp_54{
	grid-column: 2 / 3;
	grid-row:    8 / 9;
}

main div#right_menu_list div#exp_55{
	grid-column:  2 /  3;
	grid-row:    10 / 11;
}

main div#right_menu_list div#exp_56{
	grid-column:  2 /  3;
	grid-row:    12 / 13;
}


/* ------------------------------- */
/* フッター部                      */
/* ------------------------------- */
footer{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 50px;
	background: #6666ff;
	
	font-size: 18px;
	color: #ffffff;
	padding: 5px 15px 0 0;
	text-align: right;
	
	
}


/* ------------------------------------------- */
/* ------------------------------------------- */
/*  これ以降で「御用留トップ」と「御用留一覧」 */
/*  の定義を分ける。これ以前は共通定義を守る   */
/* ------------------------------------------- */
/* ------------------------------------------- */

/* ------------------------------------------ */
/* ------------------------------------------ */
/* 「御用留トップ画面」の定義                 */
/* ------------------------------------------ */
/* ------------------------------------------ */
main div#main_contents_wrapper div#main_contents{
	display: grid;
	grid-template-columns: 50px 650px;
	grid-template-rows:    10px repeat(10, 35px 50px 25px);
	
       /* margin: auto; */
       
       /* background: hotpink; */
}


main div#main_contents h2.menu_title{
        font-size:   24px;
        font-weight: normal;
	text-align:  left;
}

main div#main_contents a.menu_btn{
        font-size:   36px;
        font-weight: bold;
	text-align:  left;
	margin: 0 0 0 30px;
}


main div#main_contents h2#menu_01{
	grid-column: 2 / 3;
	grid-row:    2 / 3;
	
	/* border: solid; */
}

main div#main_contents a#menu_01_btn{
	grid-column: 2 / 3;
	grid-row:    3 / 4;
	
	/* border: solid; */
}


main div#main_contents h2#menu_02{
	grid-column: 2 / 3;
	grid-row:    5 / 6;
}

main div#main_contents a#menu_02_btn{
	grid-column: 2 / 3;
	grid-row:    6 / 7;
}


main div#main_contents h2#menu_03{
	grid-column: 2 / 3;
	grid-row:    8 / 9;
}

main div#main_contents a#menu_03_btn{
	grid-column: 2 / 3;
	grid-row:    9 / 10;
}


main div#main_contents h2#menu_04{
	grid-column:   2 /  3;
	grid-row:     11 / 12;
}

main div#main_contents a#menu_04_btn{
	grid-column:   2 /  3;
	grid-row:     12 / 13;
}


main div#main_contents h2#menu_05{
	grid-column:   2 /  3;
	grid-row:     14 / 15;
}

main div#main_contents a#menu_05_btn{
	grid-column:   2 /  3;
	grid-row:     15 / 16;
}


main div#main_contents h2#menu_06{
	grid-column:   2 /  3;
	grid-row:     17 / 18;
}

main div#main_contents a#menu_06_btn{
	grid-column:   2 /  3;
	grid-row:     18 / 19;
}


main div#main_contents h2#menu_07{
	grid-column:  2 /  3;
	grid-row:    20 / 21;
}

main div#main_contents a#menu_07_btn{
	grid-column:  2 /  3;
	grid-row:    21 / 22;
}

main div#main_contents h2#menu_08{
	grid-column:  2 /  3;
	grid-row:    23 / 24;
}

main div#main_contents a#menu_08_btn{
	grid-column:  2 /  3;
	grid-row:    24 / 25;
}

main div#main_contents h2#menu_09{
	grid-column:  2 /  3;
	grid-row:    26 / 27;
}

main div#main_contents a#menu_09_btn{
	grid-column:  2 /  3;
	grid-row:    27 / 28;
}

main div#main_contents h2#menu_10{
	grid-column:  2 /  3;
	grid-row:    29 / 30;
}

main div#main_contents a#menu_10_btn{
	grid-column:  2 /  3;
	grid-row:    30 / 31;
}



/* ------------------------------------------ */
/* ------------------------------------------ */
/* 「御用留一覧画面」の定義                   */
/* ------------------------------------------ */
/* ------------------------------------------ */
main div#main_contents_list{
	display: grid;
	grid-template-columns: 10px 680px 10px;
	grid-template-rows:    10px 30px 5px 30px 5px auto;
 }

main div#main_contents_list h2#list_title{
	grid-column: 2 / 3;
	grid-row:    2 / 3;
}

main div#main_contents_list h3#list_count_msg{
	grid-column: 2 / 3;
	grid-row:    4 / 5;
}

main div#main_contents_list div#list_table{
	grid-column: 2 / 3;
	grid-row:    6 / 7;
}

/* ------------------------------------------ */
/* 一覧テーブルの装飾                         */
/* ------------------------------------------ */

h2#list_title{
	font-size: 36px;
	font-weight: bold;
}

h3#list_count_msg{
	font-size: 28px;
	font-weight: normal;
	
	margin: 15px 0 5px 20px;
}

table{
	border: solid;
	
	margin: 25px 0 35px 0;
	
	font-size: 22px;
}

table th{
	border-right: solid;
}

table td{
	border-top:   solid;
	border-right: solid;
}

table td.list_index{
	text-align: right;
	padding: 0 2px 0 0;

}