﻿/*================================================
 *  CSSリセット
 ================================================*/
html, body,p, div, span, img, a, table, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: normal;
	font-size: 100%;
	vertical-align:baseline;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;	
}

body {
  line-height: 1;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
/*================================================*/

html {
	font-size: 62.5%;/* -> 10px; */
}
body {
	font-size: 1.4em;/* -> 14px; */
	line-height: 1.2em;/* -> 12px; */
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	background:#fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/*================================================
 *  コンテンツ全体
 ================================================*/
#contents {
	position:relative;
	overflow:hidden;
	margin:0 auto;
    padding: 0px 0 0 0;
	box-sizing: border-box;
	max-width: 767px;
	}
	
@media screen and (max-width:290px) {/*PCサイドバーからの場合*/
#contents {
	max-width: 290px;
	padding: 0;

}
}
	

p{
	margin-bottom:10px;
	text-align: center; 
	white-space: nowrap;
}

table{
	margin: 0 auto;
	margin-bottom:10px;
	border-collapse:collapse;
	font-size: 1.2rem;	
	table-layout: fixed;

}
td,
th{
	padding:0.2rem 0.5rem;
	border:1px solid #9a9a9a;	
	vertical-align:middle;
	}
	

.red1{
		color:#d45451;
}

	
/*================================================
 *  見出し
 ================================================*/
 h1 {
    text-align: center;
    margin: 1.7rem;
    font-size: 1.6rem;
	font-weight:normal;
	line-height: 1.8em;
	margin-top: 0;
}

h1 {
border-bottom: dotted 4px #6587b5;
}


/*================================================
 *  カレンダー
 ================================================*/
#calenderbox {
    margin: 0 auto;
	width: 43%;
    float: left;
	padding-left: 0.9rem;
}

@media screen and (max-width:290px) {/*PCサイドバーからの場合*/
#calenderbox {
	width: 100%;
	padding: 0 1.5rem;
	margin-bottom:1rem;
}
}


/*================================================
 *  色別
 ================================================*/
#color{
	width:57%;
	float: right;
    padding-top: 0.5rem;
	margin: 0 auto;
}


@media screen and (max-width:290px) {/*PCサイドバーからの場合*/
#color{
	width:100%;
	padding: 0;
	margin: 0;
}
}


/*================================================
 *  カレンダーテーブル
 ================================================*/
.calender {
	width: 100%;
	margin-bottom:1rem;
	font-size: 1.2rem;	
	filter: drop-shadow(0.2rem 0.2rem 0.4rem #999);
	text-align:center; 
	float: left;
}

.calender td,
.calender th{
	background-color: #FFFFFF;
	padding:0.2rem;
	border:1px solid #9a9a9a;	
	vertical-align:middle
	}
.calender .month{
	background-color: #fbe5ba;
	font-weight: bold;
	color: #006633;
}
.calender .week{
	width: 14.2857%;
	color: #000000;
	background-color: #fbe5ba;
	}
.calender .white{
	background-color: #FFFFFF;
	}	
.calender .blue{
	background-color: #00FFFF;
	}
.calender .red{
	background-color: #FF0000;
	}
.calender .pink{
	background-color: #fed9e3;
	}
.calender .green{
	background-color: #66FF00;
	}
.calender .nextmonth{
	color: #999999
	}
.calender .nextmonth_white{
	background-color: #FFFFFF;
	color: #999999
	}	
.calender .nextmonth_blue{
	background-color: #00FFFF;
	color: #999999
	}
.calender .nextmonth_red{
	background-color: #FF0000;
	color: #999999
	}
.calender .nextmonth_pink{
	background-color: #fed9e3;
	color: #999999
	}
