﻿@charset "utf-8";

/* Reset CSS */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td {
	margin:0;
	padding:0;
}   
table {
	border-collapse:collapse;
	border-spacing:0;
}   
fieldset,img {
	border:0;
}   
	address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}   
ol,ul {
	list-style:none;
}   
caption,th {
	text-align:left;
}   
q:before,q:after {
	content:"";
}
div.layouttable{
	margin: 0 -8px;
}
div.layouttable div{
	width: 100%;
}
div.layouttable td{
	vertical-align: top;
	padding: 0 8px;
}
div.layouttable table{
	width: 100%;
}


/* h1-h6 Base-88%
	10px  72% 
	11px  79% 
	12px  86% 
	13px  93% 
	14px 100% 
	15px 108% 
	16px 115% 
	17px 122% 
	18px 129% 
	19px 136% 
	20px 143% 
	21px 150% 
	22px 158% 
	23px 165% 
	24px 172% 
	25px 179% 
	26px 186% 
*/
h1 {
	font-size: 186%;
}
h2 {
	font-size: 129%;
}
h3 {
	font-size: 122%;
}
h4 {
	font-size: 115%;
}
h5 {
	font-size: 108%;
}
h6 {
	font-size: 100%;
}
td {
	vertical-align:top
}

/* PAGE/GENERAL */
html {
	height: 100%;
}
h1, h2, h3, h4, h5, h6 
{
	margin-top: 10px;
}
li {
    list-style:disc;
    margin-left: 1.1em;
    margin-bottom: 0.3em;
}
a {
	text-decoration: none;
}
p a, dd a, li a {
	text-decoration: underline;
}
a:link {
	color: #286EB5;
}
a:visited {
	color: #7C1C9C;
}
a:hover {
	color: #CD0E0E;
}
p {
	text-indent: 1em;
}
p.noindent {
	text-indent: 0;
}
body {
	height: 100%;
	color: #202020;
	line-height: 1.6;
	font-family: MeiryoKe_PGothic, "メイリオ", "MS P Gothic", sans-serif;
	font-size: 88%;
}
body.leftborder{
	background:url(img/contents.left.bg.png) repeat-y;
}
body div.leftborder-top {
	margin: 0 -30px -400px 0;
	height: 400px;
	width: 30px;

}
body div.leftborder-bottom {
	margin:-135px -30px 35px 0;
	height: 100px;
	width: 30px;
}
body.leftborder div.leftborder-top {
	background:url(img/contents.top.left.png) no-repeat;
}

body.leftborder div.leftborder-bottom {
	background:url(img/contents.bottom.left.png) no-repeat;
}
#page {
	width: 100%;
	margin: 0 auto;
	min-height: 100%;
	text-align: left;
	min-width: 750px;
	max-width: 1260px;
}

* html #page {	/* IE */
	height: 100%;
	width:expression(document.body.clientWidth < 752? "750px" : document.body.clientWidth > 1262? "1260px" : "auto");
}

.clearer {
	clear: both;
	display: block;
	height: 1px;
	margin-bottom: -1px;
	font-size: 1px;
	line-height: 1px;
}


#footer {
	width: 100%;
	color: #505050;
	position: relative;
	margin: -35px auto 0 auto;
	min-width: 750px;
	background:#060569 url('img/foot.bg.png') repeat-x bottom;
}

* html #footer {	/* IE */
	margin-top: -35px;
	width:expression(document.body.clientWidth < 752? "750px" : "100%");
}

.singlecol-content{
	position: relative;
	padding: 10px 10px 100px 10px;
}
/**************************
CONTENT AND COLUMNS
**************************/
.multicol-outer {
	padding-left: 205px; /*** Same width as margin-left for the float-wrap div ***/
	padding-right: 125px; /*** Our right column width ***/
}
.multicol-inner {
	width: 100%;
	padding-bottom: 100px; /*** Padding-bottom value is the same value as the total height of the footer ***/
}
/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid 
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout.
***/
.float-wrap {
	float: left;
	width: 100%;
	margin-left: -205px; /*** Same length as .multicol-outer padding-left but with negative value ***/
}
.multicol-content {
	float: right;
	margin-right: -205px; /*** Same length as .multicol-outer padding-left but with negative value ***/
	width: 100%;
	position: relative; /*** IE needs this  ***/
}
.multicol-contentWrap{
	padding: 15px 10px 10px 15px;
}

/**************************
LEFT COLUMN
**************************/
/*** div.left is in div.float-wrap, and when div.float-wrap is neg margined to the left, 
div.left is carried over into the proper position. 
***/
div.left {
	float: left;
	width: 180px;
	padding: 10px 10px 10px 10px;
	position: relative; /*** IE needs this  ***/
}
/*************************
RIGHT COLUMN
**************************/
div.right {
	float: right; 
	width: 120px;
	padding: 15px 5px 5px 5px;
	position: relative; /*** IE needs this  ***/
	margin-right: -120px; /** This negative margin-right value is the same as the right column width (width + padding). ***/
}



#title .titlemark {
	width: 500px;
	height: 200px;
	margin: -30px -370px -170px -130px;
	background: url('img/title.mark.png') no-repeat;
}
* html #title .titlemark {
	background: url('img/title.mark.gif') no-repeat;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/doc/themes/mcdoc/img/title.mark.png);
}
#title{
	margin: 0 10px 10px 100px;
	padding: 0px 0 0 50px;
}
#title span{
	color: #808080;
	display: block;
	margin-top: 3px;
}
#title h1 {
	margin:0 10px 5px 0;
	color: #505050;
	border-bottom: 1px solid #CD0E0E;
	line-height: 1.1;
	padding-top: 10px;
}






#footer div {
	height: 35px;
	overflow: hidden;
	background:url('img/foot.logo.png') no-repeat 100% 100%;
}
#footer span.copy{
	display: block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	color:#FFFFFF;
	padding: 0 0 5px 10px;
	position: absolute;
	bottom: 0;
}
#footer span.footermessage{
	font-size: 75%;
	line-height: 130%;
	display: block;
	position: absolute;
	bottom: 40px;
}
#footer a {
	color: White !important; 
	text-decoration: underline;
}
body.leftborder span.footermessage{
	padding: 0 5px 0 20px;
}
body span.footermessage{
	padding: 0 5px 0 10px;
}



/*ヘッダー*/
#header{
	position:relative;
	height:125px;
	width: 100%;
	overflow:hidden;
	background:url(img/header.bg.png) repeat-x 250px -75px #001169;

}
#logo{
	height:200px;
	width:270px;
	background:url(img/header.logo.png) no-repeat;
	z-index: 99;
	position:relative;
}
* html #logo{
	background:url(img/header.logo.gif) no-repeat;
}

#outerlink{
	margin:0;
	position:absolute;
	right: 0px;
	top: 0px;
	text-align: right;
	font-size: 12px;
}
#outerlink a{
	float:right;
	border-top: 7px solid #DDDDEE;
	padding: 0 10px 5px 10px;
	text-decoration:none;
	color: #DDDDEE;
	display: block;
}
#outerlink a:hover{
	border-color: white;
	color: white;
}

#topmenu 
{
	height:90px;
	margin:0;
	padding:0 0 0 250px;
	position:absolute;
	width:10000px;
	bottom: 0px;
	border-color:black;
	border-style:solid;
	border-width:0;
}

#topmenu ul 
{
	list-style:none;
	margin:0 10000px 0 0;
	padding:0px 0 0px 20px;
	width:10000px;
	position:absolute;
	bottom: 0px;
	border-top:1px solid gray;
	background:url(img/header.bg.blur.png) repeat-x left bottom;
}

#topmenu li 
{
	display:block;
	float:left;
    margin-left: 0;
    margin-bottom: 0;
}
#topmenu a {
	margin:0 1px;
	padding:6px;
	display:block;
	float:left;
	color:#bdc5cd;
	text-transform:uppercase;
	text-decoration:none;
	font-weight:bold;
	line-height: 1.2;
	height: 3.5em;
	overflow: hidden;
	font-size: 110%;
}
#topmenu a span {
	color:#bdc5cd;
	font-size:66%;
	text-transform:lowercase;
	font-weight:normal;
	line-height: 1.2;
	display:block;
	margin-top: 5px;
}
#topmenu a:hover {
	background: #020D46;
	padding:5px;
	border:1px solid #ffffff;
	color:#ffffff;
	text-decoration:none;
}
#topmenu a:hover span {
	color:#ffffff;
}

#topmenu li.current a {
	padding:5px !important;
	background:#DEDEDE url(img/topmenu.bg.png) no-repeat !important;
	border-top:1px solid white !important;
	border-left:1px solid white !important;
	border-right:1px solid gray !important;
	border-bottom:1px solid gray !important;
	color:#2b61a1 !important;
}
#topmenu li.current a span {
	color:#636363 !important;
}

.sidemenu {
	width:100%;
	margin: 0 -6px 15px;
	padding: 0 6px;
}
.sidemenu ul {
	color: #006; 
	padding-bottom: 12px;
}
div.left .sidemenu ul {
	border-right: 1px #004080 solid;
}
div.right .sidemenu ul {
	border-left: 1px #004080 solid;
}

.sidemenu li {
	list-style: none;
	margin: 0;
	border-bottom: 1px #E1E1F8 solid;
}
div.left .sidemenu li {
	text-align: right;
}
div.right .sidemenu li {
	text-align: left;
}
* html div.right .sidemenu a{
	width: 105px;
}

.sidemenu li a {
	display: block;
	padding: 0.2em 6px;
	text-decoration: none;
}
* html div.left .sidemenu li a{
	width: 160px;
}
.sidemenu li a:link { color: #000; }
.sidemenu li a:visited { color: #006; }
.sidemenu li a:hover {
	color: #CD0E0E;
}
div.left .sidemenu li a:hover {
	border-right: 6px #CD0E0E solid;
	margin-right: -6px;
}
div.right .sidemenu li a:hover {
	border-left: 6px #CD0E0E solid;
	margin-left: -6px;
}
.sidemenu li.current a {
	color: black !important;
	border-right: 6px #004080 solid;
	margin-right: -6px;
}
.sidemenu h3 {
	margin-bottom: 0px;
	font-size: 100%;
	border-bottom: 1px #004080 solid;
}

.widget .content{
	border-top: 1px #004080 solid;
	border-right: 1px #004080 solid;
	margin: 0 0 20px 0;
	padding: 5px 0 0 0;
}
.search .content{
	border-top: 0;
	border-right: 0;
}
#searchcomments, .search label {
	display: none;
}
#searchbutton {
	float:right;
}
#searchfield {
	width: 97%;
	margin-bottom:5px;
}
.widget li {
    list-style: none;
    margin-left: 0;
    margin-bottom: 0;
}
.widget li li{
    margin-left: 1em;
}
.widget a{
	text-decoration:none;
}
table.calendar {
	width: 90%;
}
table.calendar a{
	font-weight: bold ;
}
table.calendar .weekend{
	background: #E0E0E0 ;
}
table.calendar .other{
	color: #C0C0C0 ;
}
.post h1,
#archive h1 {
	margin-top: 0;
	font-size: 143%;
	border-bottom: 1px solid #004080;
}
.postcontent {
	margin-top: 10px;
}

#postnavigation {
	font-size:93%;
	text-align:center;
}
#contentsholder-background-top{
	background:url('img/contents.top.bg.png') repeat-x;
	height: 400px;
	margin:0 0 -400px 0;
}
#contentsholder-background-bottom{
	background:url('img/contents.bottom.bg.png') repeat-x;
	height: 100px;
	margin:-135px 0 35px 0;
}
body.leftborder div.contentsholder{
	margin-left: 20px;
}
#topsubmenu {
	margin: 2px 0 10px 200px;
	padding:0 0 0 10em;
	height: 1.5em;
	position: relative;
}
#topsubmenu ul 
{
	list-style:none;
	padding:0;
	width:100%;
}
#topsubmenu li 
{
	display:inline;
	float:left;
	padding:0;
}
#topsubmenu li a
{
	border-top: 6px solid #B0B0B0;
	padding: 0 9px 5px 8px;
	text-decoration:none;
	color: #909090;
	display: block;
	text-decoration: none;
	font-weight:bold;
}
#topsubmenu li a:hover {
	border-top: 6px solid #CD0E0E;
	color: #CD0E0E;
}

#topsubmenu li a span
{
	font-weight:700;
	display: block;
	border-color:black;
	border-style:solid;
	border-width:0 1px 0 0;
	padding: 0.1em 0.5em 0 0;
	line-height:100%;
}
.start {
	margin-top: 0;
}
a.photo {
	padding-right: 17px;
	background: transparent url(img/linkimg.photo.gif) no-repeat center right;
}
a.rapidcontact {
	padding-right: 17px;
	background: transparent url(img/linkimg.contact.gif) no-repeat center right;
}