@charset "utf-8";

body {
    font-family: "メイリオ", "小塚ゴシック Pr6N R", "游ゴシック", sans-serif;
/*	font-family: 'Noto Sans JP', sans-serif;*/
    font-size: 100%;/* 100% = 16px */
    color: #2E2E2E;
	font-weight:300;
}
#wrapper {
    width: 800px;
    margin: 0px auto;
 /*   background-color: #DEB887;*/
/*    background: url("../images/grade2000.jpg") repeat-x;*/
/*    background: #deb887 url("../images/cross.png");*/
    background:url("../images/naname.png"), url("../images/grade2000.jpg") repeat-x;
    position: relative;
}
#header {
    width: 800px;
    height: 280px;
    background-color: #333333;
}
#header h1 {
    height: 50px;
    padding-left: 20px;
    color: #FFFFFF;
    font-size: 180%;/* 28.8px=16px*180% */
    line-height: 50px;
	font-weight:bold;/*700*/
}
#gnav {
    width: 800px;
    height: 35px;
 /*   background-color: #3399CC; とりあえず色 */
}
#gnav ul li {
    float: left;
    width: 112px;
    height: 35px;
    border-right: 2px solid #006600;
    overflow: hidden; /*くるりで使用*/
}
#gnav ul li:first-child {
    border-left: 2px solid #006600;
}
#gnav ul li a {
    display: block;
    width: 100%;
    height: 100%;
/*    background-color: #2E8B57;
ここから以下は、gnavくるり使用でコメントした。
    background: url("../images/gnavi70.png") no-repeat 0 0;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 35px;
    letter-spacing: 3px;
    transition:all .2s;*/
}
nav#breadcrumb {
    width: 800px;
    height: 25px;
/*    background-color: #FFFF00; とりあえず色 */
}
nav#breadcrumb ol li {
    float: left;
    padding-right: 14px;
    padding-left: 20px;
    background-image: url(../images/arrowHead.gif);
    background-repeat: no-repeat;
    background-position: 0% 50%;
    color: #444444;
    font-size: 70%;/* 11.2px=16px*0.7 */
    line-height: 25px;
}
nav#breadcrumb ol li:first-child {
    background: none;
}
nav#breadcrumb ol li a{
    color:#444;
}

/* -----ここからコンテンツエリア----- */

#contents{
    width: 800px;
/*    background-color: #0f6; とりあえず色 */
}
#contents main{
    float: right;   
    width: 600px;
    padding: 0 10px;
/*    background-color:#0f6;*/
}
#contents main section h2{
    margin: 10px 0;
    padding-left: 0.5em;
    border-left: 6px solid #f60;
    border-bottom: 1px solid #222;
    font-size: 20px;
    font-weight: bold;
}
#contents main section:first-child h2{
    margin-top: 0;
}
#contents main section .ac p:last-child{
    background-color: #fff;
    border: 1px solid #000;
    font-size: 85%;/*　13.6px=16px*0.85　*/
    padding: 1em;
    line-height: 1.5;
    color: #222;
    text-align: justify;
/*    text-justify:distribute;        IE専用⇒現在はほぼ未使用　*/
}
/*#contents main section h2 + p{    jsを入れる前のセレクタ設定*/
#contents main section .ac p:first-child{
    float: right;
    width: 232px;
    height: 230px;
    padding: 1.2em 0.5em 0.5em 1em;
}


#side{
    float: left;
    width: 180px;
    background-color: #BDB76B;
}
#side section h3{
    width: 180px;
    height: 35px;
    background-color:#444;
    color: #fff;
    font-weight: bold;
    font-size: 90%;/* 14.4px=16px*0.9 */
    text-align: center;
    line-height: 35px;
}
#side section ul li a{
    display: block;
    width: 160px;
    padding-left: 20px;
    border-bottom: 2px solid #777;
    background-color: #ccc;
    color: #444;
    font-size: 80%;/* 12.8px=16px*0.8 */
    line-height: 32px;
}
#side section ul li a:hover{
    padding-left: 14px;
    border-left: 6px solid #f60;
    background-color: #fff;
}

#banner ul li{
    margin-bottom: 5px;
}
#banner ul li:last-child{
    margin-bottom: 0;
}



/* #subエリア */
#sub{
    position: absolute;
    top: 30px;
    right: 30px;
    width: 170px;
    font-size: 10px;
}
#sub ul li{
    float: left;
    padding-right: 1em;
}
#sub ul li a{
    color: #fff;
}



/* FOOTER エリア */
#footer{
    width: 800px;
    height: 30px;
    background-color: #ddd;
}
#footer p{
    height: 30px;
    padding-left: 20px;
    color: #555;
    font-size: 80%;/* 12.8px=16px*0.8 */
    line-height: 30px;
}

nav#breadcrumb ol li a:hover{
    color:#f00;
}

#gnav ul li a:hover{
/*    background-color: #3cd371;*/
    background: url("../images/gnavi70.png") no-repeat 0 -35px;
    color: #FFE436;
}


/*pageTop エリア*/
#pageTop{
/*	display: none; */
	position: fixed;
	bottom: 30px;
	/*fadeIn/Outの場合は下記設定でOK*/
/*	left: 51%;
	margin-left: 400px;*/
	
	/*showの場合は以下の書き方*/
	right: calc((100% - 800px) /2); /*コンテンツ内 */
/*	right: calc((100% - 800px) /2 - 80px);*/ /*コンテンツ外*/
}

#pageTop a{
	display: block;
	background-color: rgba(204,204,204,0.70);
	text-align: center;
	color: #222;
	font-size: 12px;
	padding: 20px 15px;
	border-radius: 5px;
	outline: none;
}

#pageTop a:hover{
	color: #fff;
	background-color: rgba(51,170,170,.7);
}