/* h9Coder type A  */
/* yyyy/mm/dd UPDATE */

/******************************************************/
/* XXXXXX */
/******************************************************/
#container #main{
	float:left;
	width:673px;
	margin-left:5px;
}

#container #side{
	float:right;
	width:260px;
	margin-right:5px;
}

@media only screen and (max-width:640px){
	#container #main{
		float:none;
		width:auto;
		margin-left:0;
	}
	#container #side{
		float:none;
		width:auto;
		margin-right:10px;
		margin-left:10px;
	}
}


/******************************************************/
/* イメージローテーション */
/******************************************************/
div.imageRotation{
	display:none;/* 編集不可 */
	position:relative;/* サイドボタン実装の時は必須 */
	/*height:350px;*//* IE6でサイドボタン実装の時は必須 */
	/* 追記可 */
	width:769px;
	height:270px;
	margin:0 auto;
	float:left;
}
@media only screen and (max-width:640px){
	div.imageRotation{
		height:auto;
		width:auto;
		margin:0 0 30px 0;
	}
}
	div.imageRotation div.imageRotationMain{
		position:relative;/* 編集不可 */
		overflow:hidden;/* 編集不可 */
		zoom:1;/* IE6でリキッドの時に必要 */
		/* 追記可 */
		width:769px;
	}
@media only screen and (max-width:640px){
	div.imageRotation div.imageRotationMain{
		width:auto;
		height:auto;
	}
}
		/* 編集不可 */
		div.imageRotation div.imageRotationTop{
			position:relative;
			z-index:100;
		}
		/* 編集不可 */
		div.imageRotation div.imageRotationBottom{
			position:absolute;
			top:0;
			width:100%;
		}
			/*リキッド時に必須*/
			div.imageRotation div.imageRotationMain img{
				width:100%;
				height:auto;
			}

/* サイドボタン 変更可 */
div.imageRotation ul{
	position:absolute;
	z-index:101;
	top:50%;
	width:769px;
}
@media only screen and (max-width:640px){
	div.imageRotation ul{
		width:100%;
	}
}
	div.imageRotation ul li{
		position:absolute;
		top:-20px;
		cursor:pointer;
	}
	div.imageRotation ul li.navLeft{left:-20px;}
	div.imageRotation ul li.navRight{right:-20px;}

	@media only screen and (max-width:640px){
	div.imageRotation ul li.navLeft{left:-5px;width:20px;}
	div.imageRotation ul li.navRight{right:-5px;text-align:right;width:20px;}
		div.imageRotation ul li.navLeft img{width:100%;height:auto;}
		div.imageRotation ul li.navRight img{width:100%;height:auto;}
	}

/* サークルボタン 変更可 */
div.imageRotation div.circleNav{
	padding-top:10px;
	text-align:center;
	position:absolute;
	width:100%;
	text-align:right;
	bottom:10px;
	z-index:100;
}
	div.imageRotation div.circleNav span{
		cursor:pointer;
		padding:0 10px 0 0;
	}
		div.imageRotation div.circleNav span img{padding:0 3px;vertical-align:top;}

	@media only screen and (max-width:640px){
		div.imageRotation div.circleNav{
			padding-top:10px;
			text-align:center;
			position:absolute;
			width:100%;
			text-align:center;
			bottom:-25px;
			z-index:100;
		}
			div.imageRotation div.circleNav span{
				cursor:pointer;
				padding:0 0 0 0;
			}
				div.imageRotation div.circleNav span img{padding:0 3px;vertical-align:top;}
	}



/******************************************************/
/* div.mainImgArea */
/******************************************************/
#container div.mainImgArea{
	background:url(/library/common/images/cont_login_bg.gif) no-repeat bottom left;
	margin:0 0 30px 5px;
}

#container  div.mainImgArea .loginArea{
	float:left;
	text-align:center;
}
#container  div.mainImgArea .loginArea h2{
	margin:0 0 17px;
}

#container  div.mainImgArea .loginArea p{
	margin:0 0 10px;
}
#container  div.mainImgArea .loginArea ul li{
	margin:0 0 4px;
}


@media only screen and (max-width:640px){

#container div.mainImgArea{
	background:none;
	margin:0 0 10px;
}

	#container  div.mainImgArea .loginArea{
		clear:both;
		background:#e6e6d9;
		border:1px solid #ceceb8;
		float:none;
		text-align:center;
		padding:5px;
		margin:10px;
	}
		#container  div.mainImgArea .loginArea h2{
			float:left;
			margin:0 0 5px;
			padding-top:8px;
		}
		#container  div.mainImgArea .loginArea p{
			float:right;
			margin:0 0 5px;
		}
			#container  div.mainImgArea .loginArea p img{
				width:120px;
				height:auto;
			}
		#container  div.mainImgArea .loginArea p.copy{
			float:left;
			margin:0 0 5px 5px;
		}
		#container  div.mainImgArea .loginArea ul{
			clear:both;
		}
			#container  div.mainImgArea .loginArea ul li{
				text-align:left;
				margin:0 0 0 5px;
			}
				#container  div.mainImgArea .loginArea ul li a{

				}

}




/******************************************************/
/* div.searchArea */
/******************************************************/
#container div.searchArea{
	background:url(/library/common/images/cont_search_bg_t.gif) no-repeat top left;
	margin:0 0 20px;
	padding:20px 0 0;
}
#container div.searchArea .Inner{
	background:url(/library/common/images/cont_search_bg_b.gif) no-repeat bottom left;
	padding:0 18px 20px;
}

#container div.searchArea h2{
	float:left;
	padding:6px 13px 0 5px;
}

@media only screen and (max-width:640px){
	#container div.searchArea{
		background:#dadac4;
		border:1px solid #ceceb8;
		margin:0 10px 10px 10px;
		padding:10px 10px 10px 10px;
	}
	#container div.searchArea .Inner{
		background:#ffffff;
		padding:10px 10px 10px 10px;
	}
	#container div.searchArea h2{
		float:none;
		padding:0 0 10px 0;
	}
}


#container div.searchArea ul{
	float:left;
}

#container div.searchArea ul li{
	float:left;
	cursor:pointer;
	margin:0 2px 0 0;
	width:117px;
	height:38px;
	text-indent:-9999px;
	overflow:hideen;
}
	#container div.searchArea ul li.tab01{
		background:url(/library/common/images/cont_search_tab01.gif) no-repeat left top;
	}
	#container div.searchArea ul li.tab01.current{
		background:url(/library/common/images/cont_search_tab01.gif) no-repeat left bottom;
	}
	#container div.searchArea ul li.tab02{
		background:url(/library/common/images/cont_search_tab02.gif) no-repeat left top;
	}
	#container div.searchArea ul li.tab02.current{
		background:url(/library/common/images/cont_search_tab02.gif) no-repeat left bottom;
	}
	#container div.searchArea ul li.tab03{
		width:158px;
		background:url(/library/common/images/cont_search_tab03.gif) no-repeat left top;
	}
	#container div.searchArea ul li.tab03.current{
		background:url(/library/common/images/cont_search_tab03.gif) no-repeat left bottom;
	}


#container div.searchArea .box{
	clear:both;
	border:1px solid #f0e26b;
	background:#fff3b7;
	padding:10px;
	margin-top:-1px;
}
#container div.searchArea input{
	vertical-align:middle;
}
#container div.searchArea .searchFormText{
	padding:3px 3px 3px 25px;
	background:#f8f8f8  url(/library/common/images/icn_search.gif) no-repeat 5px 50%;
	border:1px solid #cfceb1;
	color:#ababab;
	width:65%;
}
#container div.searchArea .searchFormText.focus{
	padding:3px 3px 3px 25px;
	background:#fff  url(/library/common/images/icn_search.gif) no-repeat 5px 50%;
	color:#000;
}

#container div.searchArea #form2{ }
#container div.searchArea #form2 p{
	float:left;
	padding:0 10px 0 0;
}

	/* clear */
	#container div.searchArea #form2{display:inline-block;}
	#container div.searchArea #form2:after{content:"";display:block;height:0;visibility:hidden;clear:both;}
	/* Hides MacIE5 \*/
	* html #container div.searchArea #form2{height:1%;}
	#container div.searchArea #form2{display:block;}
	/* Hides MacIE5 */

#container div.searchArea .select{
	padding:3px;
}

@media only screen and (max-width:640px){
	#container div.searchArea .searchFormText{
		width:90%;
		margin-bottom:5px;
	}
}


/******************************************************/
/* div.newsArea */
/******************************************************/
div#container div.newsArea{
	border:1px solid #cfceb1;
	margin:0 0 20px;
}

div#container div.newsArea .title{
	padding:6px 0 0;
	background:url(/library/common/images/top_news_bg_ttl.gif) repeat-x top left;
	border-bottom:1px solid #cfceb1;
}
div#container div.newsArea .title h2{
	float:left;
	padding:10px 0 0 10px;
}
div#container div.newsArea .title p{
	float:right;
}
div#container div.newsArea .title p.rss{
	padding:7px 7px 0 0;
}

div#container div.newsArea dl {
	padding:10px 10px 0;
}
div#container div.newsArea dl dt {
	float:left;
	margin:0 10px 10px 0;
}
div#container div.newsArea dl dd {
	overflow:hidden;
	_display:inline-block;
	padding:0 0 0 10px;
	margin:0 0 10px 0px;
	background:url(/library/common/images/line_01.gif) repeat-y top left;
}
div#container div.newsArea dl.iconNews dd.icon {
	float:left;
	margin-top:0;
	background:url(/library/common/images/line_01.gif) repeat-y top left;
	padding-left:10px;
}

div#container div.newsArea dl.iconNews  dd{
	background:none;
	padding:0;
}

div#container div.newsArea dl dd img{
	vertical-align:middle;
	padding:0 10px 0 0;
}
div#container div.newsArea dl dd a{
	padding:0 0 0 10px;
	background:url(/library/common/images/arrow_03.gif) no-repeat 0 0.4em;
}


@media only screen and (max-width:640px){
	div#container div.newsArea{
		border:1px solid #cfceb1;
		margin:0 10px 10px 10px;
	}

		div#container div.newsArea dl dt {
			float:none;
			margin:0 10px 0 0;
		}

		div#container div.newsArea dl dd {
			overflow:hidden;
			_display:inline-block;
			padding:0 0 10px 0;
			margin:0 0 0 0px;
			background:none;
		}


}


/******************************************************/
/* div.pickUpArea */
/******************************************************/
div#container div.pickUpArea{
}

div#container div.pickUpArea h2{
	margin:0 0 10px;
}
div#container div.pickUpArea ul li{
	float:left;
	margin:0 0 10px 10px;
}
div#container div.pickUpArea ul li.first{
	margin-left:0;
}

@media only screen and (max-width:640px){

	div#container div.pickUpArea ul{
		margin:0 0 0 10px;
	}

	div#container div.pickUpArea ul li.first,
	div#container div.pickUpArea ul li{
		margin:0 0 10px 0;
		width:50%;
	}
	div#container div.pickUpArea ul li a{
		display:block;
		margin:0 10px 0 0;
	}
	div#container div.pickUpArea ul li img{
		width:100%;
		height:auto;
	}

}


/******************************************************/
/* side bnr */
/******************************************************/
div#container #side .bnr li{
	margin:0 0 10px 0;
}
@media only screen and (max-width:640px){
	div#container #side .bnr li img{
		width:100%;
		height:auto;
	}
}


/******************************************************/
/* side calender */
/******************************************************/
div#container #side .side_calender{
	background:url(/library/common/images/side_calender_bg.gif) no-repeat 0 bottom;
	padding:0 0 1px 0;
	margin:0 0 10px 0;
}
div#container #side .colorList{
	font-size:80%;
	text-align:left;
	padding:9px 10px 5px 10px;
}

div#container #side .colorList li{
	display:inline-block;
	padding:0 2px 4px;
}
div#container #side .colorList li img{
	border:1px solid #fff;
	vertical-align:middle;
}
div#container #side .colorList li.type01 img{background:#947fc6;}
div#container #side .colorList li.type02 img{background:#d6e69f;}
div#container #side .colorList li.type03 img{background:#cecece;}
div#container #side .colorList li.type04 img{background:#ffe184;}

div#container #side .calender{
	background:#fff;
	width:234px;
	margin:0 auto 10px;
	border:1px solid #dad9c2;
	padding:0 0 6px;
}
div#container #side .calender .title{
	padding:6px;
	background:#fff url(/library/common/images/side_ttl_bg.gif) repeat-x bottom left;
}

div#container #side .calender .title h3{
	float:left;
	padding:2px 0 0;
}
div#container #side .calender .title p{
	float:right;
}
div#container #side .calender .calenderArea2,
div#container #side .calender .calenderArea1{
	padding:15px 15px 0;
}
div#container #side .calender .calenderAreaInner{
	position:relative;
}

div#container #side .calender .calenderArea2 .calenderNav,
div#container #side .calender .calenderArea1 .calenderNav{
	position:absolute;
	z-index:10;
	width:100%;
}

div#container #side .calender .calenderArea2 .calenderNav .navLeft,
div#container #side .calender .calenderArea1 .calenderNav .navLeft{
	float:left;
	cursor:pointer;
	padding-top:2px;
}
div#container #side .calender .calenderArea2 .calenderNav .navRight,
div#container #side .calender .calenderArea1 .calenderNav .navRight{
	float:right;
	cursor:pointer;
	padding-top:2px;
}


div#container #side .calender .calenderBlock table{
	width:100%;
	margin:0 auto;
	clear:both;
}


div#container #side .calender .calenderBlock table th,
div#container #side .calender .calenderBlock table td{
	border:1px solid #cfceb1;
	text-align:center;
	padding:0 3px 0 3px;
}
div#container #side .calender .calenderBlock table caption{
	text-align:center;
	margin:0 0 5px;
	font-weight:bold;
}


div#container #side .calender .calenderBlock table .holiday{
	color:#f37d00;
}
div#container #side .calender .calenderBlock table .weekend{
	color:#379b8a;
}
div#container #side .calender .detail{
	padding:5px 5px 0 15px;
	font-size:85%;
}



@media only screen and (max-width:640px){

	div#container #side .side_calender{
		background:none;
		padding:0 0 1px 0;
		border:1px solid #b6b67b;
		margin-bottom:10px;
	}
		div#container #side .side_calender h2{
			background:url(/library/common/images/sp_side_calender_bg.gif) repeat-x bottom left;
			padding:0 0 0 5px;
		}

		div#container #side .title{
			padding:6px;
			background:#fff url(/library/common/images/side_ttl_bg.gif) repeat-x bottom left;
		}
		/* clear */
		div#container #side .title{display:inline-block;}
		div#container #side .title:after{content:"";display:block;height:0;visibility:hidden;clear:both;}
		/* Hides MacIE5 \*/
		* html div#container #side .title{height:1%;}
		div#container #side .title{display:block;}
		/* Hides MacIE5 */


		div#container #side .title h3{
			float:left;
			padding:2px 0 0;
		}
		div#container #side .title p{
			float:right;
		}

}


/*------------------------------------------------------------------

	■CLEAR

------------------------------------------------------------------*/



div#container #side .calender .title,
div#container div.pickUpArea ul,
div#container div.newsArea .title,
#container  div.mainImgArea{
	display: inline-block;
}



div#container #side .calender .title:after,
div#container div.pickUpArea ul:after,
div#container div.newsArea .title:after,
#container  div.mainImgArea:after{
	content:"";display: block;height: 0;visibility:hidden;clear: both;
}



/* Hides MacIE5 \*/
* html div#container #side .calender .title,
* html div#container div.pickUpArea ul,
* html div#container div.newsArea .title,
* html #container  div.mainImgArea{
	height:1%;
}



div#container #side .calender .title,
div#container div.pickUpArea ul,
div#container div.newsArea .title,
#container  div.mainImgArea{
	display:block;
}
/* Hides MacIE5 */