
/*■■■ Datepicker Custom ■■■*/





/*-------------------大枠-----------------------*/

.ui-datepicker{
	width: 90%; 
	max-width: 500px; 
	font-family: "Mplus 1p" !important;
	text-align: center; 
	background: #FAFAFA; 
	margin: 0 0 10px 0;
	border:solid 2px #CCCCCC;
	box-shadow:1px 1px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.2);
}

/* 年月表示タイトル部 */
.ui-widget-header{
	background:#FAFAFA;
	border:none;
}
.ui-datepicker-title{
	letter-spacing:0;
	color:#3D3D3D;
	font-weight:600;
}

/* 前へ次へ */
.ui-datepicker-prev-hover,.ui-datepicker-next-hover{
	background:none !important;
	border:none !important;
}
.ui-datepicker .ui-datepicker-next{
	top:2px !important;
	right:2px !important;
	cursor:pointer;
}
.ui-datepicker .ui-datepicker-prev{
	top:2px !important;
	left:2px !important;
	cursor:pointer;
}
.ui-datepicker .ui-datepicker-next span{
	background: url(../_img/next.png) no-repeat left top !important;
}
.ui-datepicker .ui-datepicker-prev span{
	background: url(../_img/prev.png) no-repeat left top !important;
} 






/*-------------------日付-----------------------*/

/* 曜日表示箇所 */
.ui-datepicker-calendar thead th{
	color:#434343;
	font-size:17px;
	font-weight:400 !important;
}
.ui-datepicker-week-end span[title*="日"]{
	color:#DD0000 !important;
}
.ui-datepicker-week-end span[title*="土"]{
	color:#284DC3 !important;
}


/* 各日付 */
a.ui-state-default,span.ui-state-default{
	font-weight:400 !important;
	display: block;
	padding:13px 5px;
	text-align:center !important;
	font-size:16px !important;
}
.ui-state-default{
	background:#EAEAEA !important;
	border:solid 1px #E7E7E7 !important;
	color:#333333 !important;
	font-size:16px !important;
}

/* 選択中の日付 */
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
	border:solid 3px #3360A7 !important;
}

/* 土曜日 */
.saturday .ui-state-default {
	color:#284DC3 !important;
	background:#CAD4E9 !important;
}

/* 日曜日 */
.sunday .ui-state-default {
	color:#DD0000 !important;
	background:#EBD5D6 !important;	
}



/* 各日付 hover */
.ui-state-default:hover{
	background:#fff1b6 !important;
	color:#513C19 !important;
}
span.ui-state-default:hover{
	background:#EAEAEA !important;
	color:#333333 !important;
}
.saturday span.ui-state-default:hover{
	color:#284DC3 !important;
	background:#CAD4E9 !important;
}
.sunday span.ui-state-default:hover{
	color:#DD0000 !important;
	background:#EBD5D6 !important;	
}





/*-------------------閉じるボタン-----------------------*/

.ui-datepicker .ui-datepicker-buttonpane{
	border:dotted 1px #CCCCCC !important;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{
	display:none;
}
.ui-datepicker .ui-datepicker-buttonpane button{
	font-size:13px !important;
	font-weight:300 !important;
}






















































/*-------------------- 
  width  - 960px
--------------------*/
@media screen and (max-width:960px) {





/*-------------------大枠-----------------------*/

.ui-datepicker{
	width: 84%; 
	max-width: 460px; 
	font-family: "Mplus 1p" !important;
	text-align: center; 
	background: #FAFAFA; 
	margin: 0 0 10px 0;
	border:solid 2px #CCCCCC;
	box-shadow:1px 1px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.2);
}

/* 年月表示タイトル部 */
.ui-widget-header{
	background:#FAFAFA;
	border:none;
	padding:3px 0 !important;
}
.ui-datepicker-title{
	letter-spacing:0;
	color:#3D3D3D;
	font-weight:600;
}

/* 前へ次へ */
.ui-datepicker-prev-hover,.ui-datepicker-next-hover{
	background:none !important;
	border:none !important;
}
.ui-datepicker .ui-datepicker-next{
	top:2px !important;
	right:2px !important;
	cursor:pointer;
}
.ui-datepicker .ui-datepicker-prev{
	top:2px !important;
	left:2px !important;
	cursor:pointer;
}
.ui-datepicker .ui-datepicker-next span{
	background: url(../_img/next.png) no-repeat left top !important;
}
.ui-datepicker .ui-datepicker-prev span{
	background: url(../_img/prev.png) no-repeat left top !important;
} 






/*-------------------日付-----------------------*/

/* 曜日表示箇所 */
.ui-datepicker-calendar thead th{
	font-size:16px;
	padding:3px 0;
}
.ui-datepicker-week-end span[title*="日"]{
	color:#DD0000 !important;
}
.ui-datepicker-week-end span[title*="土"]{
	color:#284DC3 !important;
}


/* 各日付 */
a.ui-state-default,span.ui-state-default{
	font-weight:400 !important;
	display: block;
	padding:3px;
	text-align:center !important;
	font-size:15px !important;
}
.ui-state-default{
	background:#EAEAEA !important;
	border:solid 1px #E7E7E7 !important;
	color:#333333 !important;
	font-size:15px !important;
}

/* 選択中の日付 */
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
	border:solid 3px #3360A7 !important;
}

/* 土曜日 */
.saturday .ui-state-default {
	color:#284DC3 !important;
	background:#CAD4E9 !important;
}

/* 日曜日 */
.sunday .ui-state-default {
	color:#DD0000 !important;
	background:#EBD5D6 !important;	
}



/* 各日付 hover */
.ui-state-default:hover{
	background:#fff1b6 !important;
	color:#513C19 !important;
}
span.ui-state-default:hover{
	background:#EAEAEA !important;
	color:#333333 !important;
}
.saturday span.ui-state-default:hover{
	color:#284DC3 !important;
	background:#CAD4E9 !important;
}
.sunday span.ui-state-default:hover{
	color:#DD0000 !important;
	background:#EBD5D6 !important;	
}





/*-------------------閉じるボタン-----------------------*/

.ui-datepicker .ui-datepicker-buttonpane{
	border:dotted 1px #CCCCCC !important;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{
	display:none;
}
.ui-datepicker .ui-datepicker-buttonpane button{
	font-size:13px !important;
	font-weight:300 !important;
}






























	
}























































/*-------------------- 
  width  - 480px
--------------------*/
@media screen and (max-width:480px) {





/*-------------------大枠-----------------------*/

.ui-datepicker{
	width: 84%; 
	max-width: auto; 
	font-family: "Mplus 1p" !important;
	text-align: center; 
	background: #FAFAFA; 
	margin: 0 0 10px 0;
	border:solid 2px #CCCCCC;
	box-shadow:1px 1px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.2);
}

/* 年月表示タイトル部 */
.ui-widget-header{
	background:#FAFAFA;
	border:none;
	padding:2px 0 !important;
}
.ui-datepicker-title{
	letter-spacing:0;
	color:#3D3D3D;
	font-weight:600;
}

/* 前へ次へ */
.ui-datepicker-prev-hover,.ui-datepicker-next-hover{
	background:none !important;
	border:none !important;
}
.ui-datepicker .ui-datepicker-next{
	top:2px !important;
	right:2px !important;
	cursor:pointer;
}
.ui-datepicker .ui-datepicker-prev{
	top:2px !important;
	left:2px !important;
	cursor:pointer;
}
.ui-datepicker .ui-datepicker-next span{
	background: url(../_img/next.png) no-repeat left top !important;
}
.ui-datepicker .ui-datepicker-prev span{
	background: url(../_img/prev.png) no-repeat left top !important;
} 






/*-------------------日付-----------------------*/

/* 曜日表示箇所 */
.ui-datepicker-calendar thead th{
	font-size:14px !important;
	padding:2px 0;
}
.ui-datepicker-week-end span[title*="日"]{
	color:#DD0000 !important;
}
.ui-datepicker-week-end span[title*="土"]{
	color:#284DC3 !important;
}


/* 各日付 */
a.ui-state-default,span.ui-state-default{
	font-weight:400 !important;
	display: block;
	padding:3px;
	text-align:center !important;
	font-size:14px !important;
}
.ui-state-default{
	background:#EAEAEA !important;
	border:solid 1px #E7E7E7 !important;
	color:#333333 !important;
	font-size:14px !important;
}

/* 選択中の日付 */
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
	border:solid 3px #3360A7 !important;
}

/* 土曜日 */
.saturday .ui-state-default {
	color:#284DC3 !important;
	background:#CAD4E9 !important;
}

/* 日曜日 */
.sunday .ui-state-default {
	color:#DD0000 !important;
	background:#EBD5D6 !important;	
}



/* 各日付 hover */
.ui-state-default:hover{
	background:#fff1b6 !important;
	color:#513C19 !important;
}
span.ui-state-default:hover{
	background:#EAEAEA !important;
	color:#333333 !important;
}
.saturday span.ui-state-default:hover{
	color:#284DC3 !important;
	background:#CAD4E9 !important;
}
.sunday span.ui-state-default:hover{
	color:#DD0000 !important;
	background:#EBD5D6 !important;	
}





/*-------------------閉じるボタン-----------------------*/

.ui-datepicker .ui-datepicker-buttonpane{
	border:dotted 1px #CCCCCC !important;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{
	display:none;
}
.ui-datepicker .ui-datepicker-buttonpane button{
	font-size:13px !important;
	font-weight:300 !important;
}






























	
}

