@charset "UTF-8";

body {
    background-color: #C1DB81;  /*背景色*/
    color: #302833;	/*文字の色*/
}
td.title {
    font-size: 28px;	/*文字の大きさ*/
    color: #302833;	/*文字の色*/
    text-align: left;	/*左揃え*/
}
div.hd {	/*見出し*/
    text-align: center;	/*中央揃え*/
    width:150px;
    height:35px;
    line-height:35px;
    display:block;
    width:100%;
    height:100%;
    text-decoration: none;
    background:#391908;
    color:#FFFFFF;
    font-size:20px;
    box-shadow:3px 3px 0px 0px #FFB72A;
}
div.cent {	/*見出し*/
    text-align: center;	/*中央揃え*/
}
td.va {
    vertical-align:top;	/*上寄せ*/
}
td.lmenu {
    width: 200px;	/*横幅*/
    white-space: nowrap; /*改行しない*/
    font-size: 18px;	/*文字の大きさ*/
    color: #302833;	/*文字の色*/
    text-align: left;	/*左揃え*/
}
table.title {
    width: 600px;	/*横幅*/
}
table.menu {
    margin:auto;	/*中央に表示*/
}
table.main {
    margin:auto;	/*中央に表示*/
}
table.cont {
    margin:auto;	/*中央に表示*/
    background-color: #f4c87e;	/*背景色*/
    width: 800px;	/*横幅*/
}
p.menu {
    padding: 10px;
    margin-bottom: 10px;
    border: 5px
    double #302833;
    border-radius: 10px;
    background-color: #f4c87e;	/*背景色*/
}
td {
    font-weight: bold;	/*太字*/
}
th.brown {
    background-color: #391908;	/*背景色*/
    font-weight: bold;	/*太字*/
    font-size: 21px;	/*文字の大きさ*/
    color: #ffffff;	/*文字の色*/
    text-align: left;	/*左寄せ*/
}
td.ym {
    font-weight: bold;	/*太字*/
    width: 105px;	/*横幅*/
}
img {
    vertical-align: bottom
}
img.jiko {
    width: 100px;
    padding: 2px;	/*間を開けて*/
    border: 2px solid #391908;	/*枠線*/
}
img.rad{	/*画像を丸形にして表示*/
    border-radius: 50%;
    width: 50px;
    height: 50px;
    padding: 2px;	/*間を開けて*/
    border: 2px solid #391908;	/*枠線*/
}
img.mc{	/*画像を縮小して表示*/
    width: 500px;
    height: 300px;
}
em.hi {
    background-color: #ff97d8;	/*背景色*/
}
.btn{	/*メニューボタン*/
    width:180px;
    height:40px;
    line-height:40px;
}
.btn a{	/*メニューボタン*/
    display:block;
    width:100%;
    height:100%;
    text-decoration: none;
    background:#391908;
    text-align:center;
    border:1px solid #FFFFFF;
    color:#FFFFFF;
    font-size:20px;
    font-weight:bold;
    border-radius:50px;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    box-shadow:0px 0px 0px 4px #391908 ;
}
.btn a:hover{	/*メニューボタン*/
    background:#FFB72A;
    color:#391908;
    margin-left:0px;
    margin-top:0px;
    border:1px solid #FFFFFF;
    box-shadow:0px 0px 0px 4px #391908 ;
}
div.tweet {	/*つぶやき用*/
    overflow:auto;
    width: 653px;	/*横幅*/
    height: 300px;	/*縦幅*/
}
td.tweet {
    vertical-align:top;	/*上寄せ*/
    background-color: #9CC738;  /*背景色*/
}
td.tc {
    border-bottom: 1px solid #9CC738;  /*下線色*/
}
table.list {
    border-collapse: collapse;	/*枠線の隙間なし*/

}
table.list thead th {	/*ヘッダ固定*/
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1;	/*手前に表示*/
    background-color: #9CC738;  /*背景色*/
    white-space: nowrap;	/*折り返さない*/
    border: 1px solid #391908;	/*枠線*/
    text-align: left;	/*左寄せ*/
}
table.list th:first-child {    /* 横スクロール時に左端固定 */
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    background-color: #9CC738;  /*背景色*/
    white-space: nowrap;	/*折り返さない*/
    border: 1px solid #391908;	/*枠線*/
    text-align: left;	/*左寄せ*/
}
table.list thead th:first-child {    /* ヘッダー行内の他のセルより手前に表示する */
  z-index: 2;
}
table.list td {
    white-space: nowrap;	/*折り返さない*/
    border: 1px solid #391908;	/*枠線*/
}
div.list {    /*スクロール設定*/
  overflow: scroll;
  width: calc(100vw - 1rem);
  height: 75vh;
}
table.mform {
    border: 1px solid #391908;	/*枠線*/
}
th.mform {
    text-align: left;
    background-color: #9CC738;	/*背景色*/
}
input[type=text] {
	padding: 5px 10px;
	font-size: 86%;
	border: none;
	border-radius: 3px;
}

input[name=btn_confirm],
input[name=btn_submit],
input[name=btn_back] {
	margin-top: 10px;
	padding: 5px 20px;
	font-size: 100%;
	color: #000000;
	cursor: pointer;
	border: none;
	border-radius: 3px;
	box-shadow: 0 3px 0 #391908;
	background: #FFB72A;
}

input[name=btn_back] {
	margin-right: 20px;
	box-shadow: 0 3px 0 #777;
	background: #999;
}

.element_wrap {
	margin-bottom: 10px;
	padding: 10px 0;
	border-bottom: 1px solid #ccc;
	text-align: left;
}

label {
	display: inline-block;
	margin-bottom: 10px;
	font-weight: bold;
	width: 150px;
	vertical-align: top;
}

.element_wrap p {
	display: inline-block;
	margin:  0;
	text-align: left;
}
textarea.message {
    width: 300px;
    height: 150px;
}
.error_list {
	padding: 10px 30px;
	color: #ff2e5a;
	font-size: 86%;
	text-align: left;
	border: 1px solid #ff2e5a;
	border-radius: 5px;
}

table.link {
	margin: auto;
}
td.link {
	border: 1px solid #391908;	/*枠線*/
    text-align: center;
}
img.link {
	height: 64px;
}

table.vf {
  border-collapse: collapse;
  border-spacing: 0;
  width: 600px;
}
th.vf {
	border: 1px solid #391908;	/*枠線*/
	font-size:24px;
	background: #FFB72A;
}
td.vf {
	border: 1px solid #391908;	/*枠線*/
}

/*予定表*/
.osare4-table {
 border-collapse: separate;
 border: none;
 border-spacing: 0px 2px ;
 margin: auto;
 background-image: url(../img/kani3ds.png);
}

.osare4-table tbody td, 
.osare4-table tfoot td {
 text-align: left;
}

/* 上部ヘッダー（背景：パステルカラー） */
.osare4-table thead th {
 color: #FFF; 
 font-weight: bold;
 background:#E91E63;
}

/* 上部ヘッダーの丸み */
.osare4-table tr:first-child th:nth-child(2) {
 border-radius: 10px 10px 0 0;
}

/* 左列の丸み */
.osare4-table tr:nth-child(2) th:first-child {
 border-radius: 10px 0 0 0;
}
.osare4-table tr:last-child th:first-child {
 border-radius: 0 0 0 10px;
}

.osare4-table th,
.osare4-table td {
 border: 0 none !important;
}

/* １行ずつ色変更 even:奇数行　odd:偶数行 */
.osare4-table tr:nth-child(even) td { 
 background: rgba(255,255,159,0.7); /*rgbaで透過色にしている*/
} 
.osare4-table tr:nth-child(odd) td {
 background: rgba(255,249,255,0.7); /*rgbaで透過色にしている*/
}

/* ヘッダーセル先頭・ボディ項目・フッター項目 */
.osare4-table tbody th,
.osare4-table tfoot th,
.osare4-table thead th:first-child {
 background:#E91E63;
 color:#FFF;
 font-weight: bold;
 line-height:3em;
 text-align:center;
 table-layout: fixed
}

.osare4-table tr:first-child th:nth-child(2) {
 text-align:center;
 width: 500;
}

/* 左上のセル背景を削除 */
.osare4-table tr:first-child th:first-child {
 background: #C1DB81;
 color: #000;
}

/*（共通）　項目の多いテーブルの幅を調整*/
/* @media (max-width: 767px) {
 .col6t th,
 .col6t td{
 font-size:0.4em;
 padding: 10px 0px;
 }
 .col5t th,
 .col5t td{
 font-size:0.5em;
 padding: 10px 0px;
 }
 .col4t th,
 .col4t td{
 font-size:0.7em;
 padding: 10px 5px;
 }
 .col3t th,
 .col3t td{
 font-size:0.8em;
 padding: 10px 10px;
 }
}*/