@CHARSET "utf-8";

/****************************************
 * Table of Contents
 *
 * 1. Basic Elements Styles
 * 2. Common Styles
 * 3. Layouts
 * 17. Ajax
 *
 ****************************************/

/* ------------------------------------------------------------
    1. Basic Elements Styles
------------------------------------------------------------ */
body {background: #fff;}
a:link,a:visited,a:active,a:hover {color: #06c; text-decoration: underline; outline: none;}
a:hover, a:active {color: #08e;}
img {vertical-align: bottom;}
li {list-style-type: none;}
input, select, textarea {padding: 5px; border: 1px solid #ccc; font-size: 12px; font-family: inherit; vertical-align: middle;}
input:focus, select:focus, textarea:focus {border: 1px solid #359aff;}
select {padding: 4px;}
th, td {vertical-align: middle;}
h1, h2 {margin-bottom: 10px;}
h3, h4, h5 {margin-bottom: 5px;}

/* ------------------------------------------------------------
    2. Common Styles
------------------------------------------------------------ */
.btn {padding: 2px 5px 0px 5px; color: #fff; cursor: pointer; border: 1px solid #359aff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #0066cc), color-stop(0.20, #359aff)); background: -webkit-linear-gradient(top, #359aff 20%, #0066cc 80%); background: -moz-linear-gradient(top, #359aff 20%, #0066cc 80%); background: -o-linear-gradient(top, #359aff 20%, #0066cc 80%); background: -ms-linear-gradient(top, #359aff 20%, #0066cc 80%); background: linear-gradient(to bottom, #359aff 20%, #0066cc 80%); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.btn:hover {background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #0077dd), color-stop(0.20, #35aaff)); background: -webkit-linear-gradient(top, #35aaff 20%, #0077dd 80%); background: -moz-linear-gradient(top, #35aaff 20%, #0077dd 80%); background: -o-linear-gradient(top, #35aaff 20%, #0077dd 80%); background: -ms-linear-gradient(top, #35aaff 20%, #0077dd 80%); background: linear-gradient(to bottom, #35aaff 20%, #0077dd 80%);}
a.btn {color: #fff; text-decoration: none; line-height: 200%; white-space: nowrap;}
a.btn:hover {color: #fff;}
.btn2 {padding: 2px 5px 0px 5px; cursor: pointer; border: 1px solid #ccc; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #ddd), color-stop(0.20, #f6f6f6)); background: -webkit-linear-gradient(top, #f6f6f6 20%, #ddd 80%); background: -moz-linear-gradient(top, #f6f6f6 20%, #ddd 80%); background: -o-linear-gradient(top, #f6f6f6 20%, #ddd 80%); background: -ms-linear-gradient(top, #f6f6f6 20%, #ddd 80%); background: linear-gradient(to bottom, #f6f6f6 20%, #ddd 80%); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.btn2:hover {color: #333; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #e6e6e6), color-stop(0.20, #fafafa)); background: -webkit-linear-gradient(top, #fafafa 20%, #e6e6e6 80%); background: -moz-linear-gradient(top, #fafafa 20%, #e6e6e6 80%); background: -o-linear-gradient(top, #fafafa 20%, #e6e6e6 80%); background: -ms-linear-gradient(top, #fafafa 20%, #e6e6e6 80%); background: linear-gradient(to bottom, #fafafa 20%, #e6e6e6 80%); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.btn2:focus {border: 1px solid #ccc;}
.btn2.current {background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #f6f6f6), color-stop(0.20, #ddd)); background: -webkit-linear-gradient(top, #ddd 20%, #f6f6f6 80%); background: -moz-linear-gradient(top, #ddd 20%, #f6f6f6 80%); background: -o-linear-gradient(top, #ddd 20%, #f6f6f6 80%); background: -ms-linear-gradient(top, #ddd 20%, #f6f6f6 80%); background: linear-gradient(to bottom, #ddd 20%, #f6f6f6 80%);}
a.btn2 {text-decoration: none; line-height: 200%; white-space: nowrap;}
a.btn2:hover {color: #08e;}
.btn3 {padding: 2px 5px 0px 5px; cursor: pointer; color: #fff; border: 1px solid #c00; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #c00), color-stop(0.20, #f66)); background: -webkit-linear-gradient(top, #f66 20%, #c00 80%); background: -moz-linear-gradient(top, #f66 20%, #c00 80%); background: -o-linear-gradient(top, #f66 20%, #c00 80%); background: -ms-linear-gradient(top, #f66 20%, #c00 80%); background: linear-gradient(to bottom, #f66 20%, #c00 80%); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.btn3:hover {color: #fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #d00), color-stop(0.20, #f99)); background: -webkit-linear-gradient(top, #f99 20%, #d00 80%); background: -moz-linear-gradient(top, #f99 20%, #d00 80%); background: -o-linear-gradient(top, #f99 20%, #d00 80%); background: -ms-linear-gradient(top, #f99 20%, #d00 80%); background: linear-gradient(to bottom, #f99 20%, #d00 80%); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.btn3:focus {border: 1px solid #ccc;}
a.btn3 {color: #fff; text-decoration: none; line-height: 200%; white-space: nowrap;}
a.btn3:hover {color: #fff;}

input.submit {padding: 5px; color: #fff; cursor: pointer; border: 1px solid #21c301; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #31b311), color-stop(0.20, #77d01d)); background: -webkit-linear-gradient(top, #77d01d 20%, #31b311 80%); background: -moz-linear-gradient(top, #77d01d 20%, #31b311 80%); background: -o-linear-gradient(top, #77d01d 20%, #31b311 80%); background: -ms-linear-gradient(top, #77d01d 20%, #31b311 80%); background: linear-gradient(to bottom, #77d01d 20%, #31b311 80%); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
input.submit:hover {background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #41c321), color-stop(0.20, #87e02d)); background: -webkit-linear-gradient(top, #87e02d 20%, #41c321 80%); background: -moz-linear-gradient(top, #87e02d 20%, #41c321 80%); background: -o-linear-gradient(top, #87e02d 20%, #41c321 80%); background: -ms-linear-gradient(top, #87e02d 20%, #41c321 80%); background: linear-gradient(to bottom, #87e02d 20%, #41c321 80%);}

.important {color: #13599a; font-weight: bold;}
.notice {color: #0000ff;}
.safety {color: #0000ff;}
.care {color: #00aa00;}
.attention {color: #ff0000;}
.na {color: #999; text-decoration: line-through;}
.searching {background-color: #ccf6ff; border: 1px solid #359aff;}
.hidden {display: none;}

.message {margin-bottom: 10px; padding: 5px 10px; background-color: #f5f5f8; border: 1px solid #ddd;}
.message.notice {background-color: #e0f5ff; border: 1px solid #9cd;}
.message.attention {background-color: #f5f5e0; border: 1px solid #ffdd66;}

.breadcrumb {margin-bottom: 10px;}
.breadcrumb li {margin-right: 5px; float:left;}
.breadcrumb li:after {content: ' >';}
.breadcrumb:after {clear: both; display: block; content: '';}

.tabNav {margin-bottom: 20px; height: 30px; border-bottom: 1px solid #D0D0E0;}
.tabNav li {height: 29px; float: left; background-color: #E0E0F0; border-top: 1px solid #D0D0E0; border-right: 1px solid #D0D0E0;}
.tabNav li.first {border-left: 1px solid #D0D0E0;}
.tabNav li.current {height: 30px; background-color: #FFFFFF;}
.tabNav li a {padding: 5px 15px; display: block;}

ul.actions {margin-bottom: 10px;}
ul.actions:after {clear: both; display: block; content: '';}
ul.actions li {margin-right: 5px; float:left;}

.errorMessage {padding: 8px; color: #f00; background-color: #ffffdd;}

.explanation {margin-bottom: 20px;}
.explanation li {margin-bottom: 5px; padding-left: 15px; list-style-type: disc;}
.form-error {border: 1px solid #f66; background-color: #ffe;}

.paging {margin-bottom: 10px;}
.paging span {margin-right: 5px;}

/* ------------------------------------------------------------
	3. ログイン.
------------------------------------------------------------ */
#login {margin: 30px auto; padding: 30px; width: 400px; background-color: #fff; -moz-box-shadow: 1px 1px 2px #aaa; -webkit-box-shadow: 1px 1px 2px #aaa; box-shadow: 1px 1px 2px #aaa;}
#login label {color: #06c;}
#login td {padding: 5px 10px;}
#login #authMessage {margin-bottom: 10px; padding: 5px 10px; background-color: #fff3ce; border: 1px solid #fc3;}

/* ------------------------------------------------------------
    2. Header
------------------------------------------------------------ */
#menu {padding: 15px; position: fixed; width: 140px; height: 100%; z-index: 1000; background-color: #fff; -moz-box-shadow: 1px 1px 2px #aaa; -webkit-box-shadow: 1px 1px 2px #aaa; box-shadow: 1px 1px 2px #aaa;}
#menu > ul > li {margin-bottom: 10px;}
#menu > ul > li.current a {color: #ff0000; text-decoration: none;}

#subMenu {padding: 15px 15px 15px 190px; position: fixed; width: 110px; height: 100%; z-index: 800; background-color: #f5f5f9; -moz-box-shadow: 1px 1px 2px #aaa; -webkit-box-shadow: 1px 1px 2px #aaa; box-shadow: 1px 1px 2px #aaa;}
#subMenu > ul > li {margin-bottom: 10px;}
#subMenu > ul > li.current a {color: #ff0000; text-decoration: none;}

#content {padding: 15px 15px 15px 340px; background-color: #fff;}
#content .section {margin-bottom: 20px;}



#flashMessage {position: fixed; padding: 5px 8px; top: 20px; left: 40%; z-index: 1100; background-color: #fff3ce; border: 1px solid #fc3; -moz-box-shadow: 1px 1px 2px #aaa; -webkit-box-shadow: 1px 1px 2px #aaa; box-shadow: 1px 1px 2px #aaa;}
#flashMessage.message {}

#headerBar {position: fixed; margin: 0; padding: 5px; width: 100%; background-color: #fff; border-top: 3px solid #0066cc; z-index: 1000; -moz-box-shadow: 1px 1px 2px #aaa; -webkit-box-shadow: 1px 1px 2px #aaa; box-shadow: 1px 1px 2px #aaa;}
#headerBar h1 {margin: 2px 5px 0 0; color: #0066cc; font-size: 12px; font-weight: bold; float: left;}
#headerBar .dials {margin: 3px 5px 0 0; font-size: 11px; float: left;}
#headerBar .dials dt {color: #393; float: left;}
#headerBar .dials  dd {margin-right: 5px; float: left;}
#headerBar .buttons {margin-right: 5px; float: left;}
#headerBar .quickSearch {margin-right: 5px; float: left;}
#headerBar .links {margin-top: 3px; margin-right: 5px; float: left;}
#headerBar .logout {float: left;}
#headerBar li {margin-right: 3px; float: left;}
#headerBar input[type=text] {padding: 2px; width: 85px;}

#mainNav {position: fixed; width: 120px; z-index: 800; background-color: #f0f0f5; -moz-box-shadow: 1px 1px 2px #aaa; -webkit-box-shadow: 1px 1px 2px #aaa; box-shadow: 1px 1px 2px #aaa;}
#mainNav li {position: relative;}
#mainNav li a {padding: 10px; display: block; text-decoration: none; color: #000; border-bottom: 1px solid #e5e5e5; background-color: #f0f0f5;}
#mainNav li a:hover {background-color: #f6f6f9;}
#mainNav li.current a {color: #fff; font-weight: bold; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.80, #0066cc), color-stop(0.20, #359aff)); background: -webkit-linear-gradient(top, #359aff 20%, #0066cc 80%); background: -moz-linear-gradient(top, #359aff 20%, #0066cc 80%); background: -o-linear-gradient(top, #359aff 20%, #0066cc 80%); background: -ms-linear-gradient(top, #359aff 20%, #0066cc 80%); background: linear-gradient(to bottom, #359aff 20%, #0066cc 80%);}
#mainNav li .counter {position: absolute; top: 10px; right: 8px;}

#regulations nav {margin-bottom: 20px;}
#regulations li {margin-left: 20px; list-style-type: disc;}
#regulations ol li {margin-left: 20px; list-style-type: decimal;}
#regulations li li {margin-left: 20px; list-style-type: disc;}
#regulations table {border: 1px solid #999; border-collapse: collapse;}
#regulations td {padding: 3px; border: 1px solid #999;}

/* ------------------------------------------------------------
    3. List Style Table Design
------------------------------------------------------------ */
/* リスト形式の表 */
table.list {margin-bottom: 20px; width: 100%; border-bottom: 1px solid #e5e5e5;}
table.list tr {width: 100%; border-top: 1px solid #e5e5e5; background-color: #fff;}
table.list th {padding: 8px; color: #13599a; border-bottom: 1px solid #06c; font-size: 11px;}
table.list td {padding: 8px; font-size: 11px;}
table.list tr.current {border-top: 1px solid #359aff; border-bottom: 1px solid #359aff; background-color: #e5eff9;}
table.list td.text {font-size: 11px;}

/* 詳細形式の表 */
table.fieldset {margin-bottom: 20px; border-collapse: collapse;}
table.fieldset tr {background-color: #fff;}
table.fieldset th {padding: 7px 10px; background-color: #f5f5fa; color: #06C; border: 1px solid #e5e5e5;}
table.fieldset td {padding: 7px 10px; background-color: #fff; border: 1px solid #e5e5e5;}
table.fieldset .field {margin: 5px 20px 5px 0; float: left;}
table.fieldset .fields {margin-bottom: 10px; clear: both;}
table.fieldset .field.first {clear: both;}

/* カレンダー形式の表 */
table.calendar {margin-bottom: 20px; border-collapse: collapse;}
table.calendar tr {background-color: #fff;}
table.calendar tr th {padding: 3px; color: #13599a; background-color: #f5f5fa; border: 1px solid #e5e5e5; font-size: 11px;}
table.calendar tr.day td {padding: 3px; width: 100px; height: 20px; background-color: #f5f5fa; border: 1px solid #e5e5e5; border-bottom: none; color: #13599a; font-size: 11px;}
table.calendar tr.shift td {padding: 3px; width: 100px; height: 20px; background-color: #fff; border: 1px solid #e5e5e5; color: #13599a; font-size: 11px;}
table.calendar tr.shift td .day {background-color: #f0f0f5;}
table.calendar tr.content td {padding: 10px; width: 100px; height: 80px; background-color: #fff; border: 1px solid #e5e5e5; border-top: none; font-size: 11px;}
table.calendar tr.content td:hover {background-color: #fffff0;}

/* ------------------------------------------------------------
    9. Hacks
------------------------------------------------------------ */
.clearfix {display: inline-block;}
.clearfix:after {clear: both; display: block; content: '';}