@charset "utf-8";

@font-face {
	font-family: 'Typicons';
	src: url('../fonts/typicons-regular-webfont.eot');
	src: url('../fonts/typicons-regular-webfont.eot?#iefix') format('embedded-opentype'),
		url('../fonts/typicons-regular-webfont.woff') format('woff'),
		url('../fonts/typicons-regular-webfont.ttf') format('truetype'),
		url('../fonts/typicons-regular-webfont.svg#TypiconsRegular') format('svg');
	font-weight: normal;
	ont-style: normal;
}

.comp {
vertical-align: middle;
width:140px;
font-weight:bold;/*太字にする*/
font-family:sans-serif;/*ゴシック体の（ような）フォント*/
background-color:"#BEE6DE"
}


/***** css reset *****/

/* html5doctor.com Reset v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

/**********/

html, body{height:100%;}

body {
    font:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",'メイリオ',Meiryo,Helvetica,Arial,Sans-Serif;
    color:#505050;
    text-align:center;
	background:url(../images/bg.gif);
}

img {
	text-align:left;
	padding:0;
	font-size:0;
	line-height:0;
}

a{color:#1b76ff;}

.textRed{color:#ff3232;}
.textS{font-size:small;}

/***** header *****/

#header{
	width:100%;
	height:160px;
	margin:0 auto;
	overflow:hidden;
	background:#fff;
}

#headerMargin{
	width:980px;
	height:100px;
	margin:0 auto;
}

h1{
	width:234px;
	height:59px;
	float:left;
	padding:20px 0;
}

h1 a{
	width:234px;
	height:59px;
    text-indent:100%;
    white-space:nowrap;
    overflow: hidden;
	display:block;
	text-decoration:none;
	background:url(../images/logo.png);
	background-repeat:no-repeat;
}


/*** nav ***/

#nav{
	/* width:288px; */
	width:432px;
	height:30px;
	float:right;
	padding:35px 0;
}

#nav ul{
	list-style-type:none;
	overflow:hidden;
}

#nav li{
	text-indent:100%;
    white-space:nowrap;
    overflow:hidden;
	float:left;
	margin-left:14px;
}

#nav ul li a{
	display:block;
	outline:none;
	width:130px;
	height:30px;
}

#nav0{background:url(../images/btn_mail2.png) 0 0 no-repeat;}
#nav1{background:url(../images/nav.png) 0 0 no-repeat;}
#nav2{background:url(../images/nav.png) -130px 0 no-repeat;}
#nav1 a:hover{background:url(../images/nav.png) 0 -30px no-repeat;}
#nav2 a:hover{background:url(../images/nav.png) -130px -30px no-repeat;}


/*** gNav ***/

#gNavBg{
	width:100%;
	height:60px;
	background:url(../images/gnav_bg.gif);
	background-repeat:repeat-x;
}

#gNav{
	width:980px;
	height:60px;
	margin:0 auto;
}

#gNav ul{
	list-style-type:none;
	overflow:hidden;
	margin:0;
	padding:0;
}

#gNav li{
	text-indent:100%;
    white-space:nowrap;
    overflow:hidden;
	float:left;
}

#gNav ul li a{
	display:block;
	outline:none;
	height:60px;
	width:245px;
}

#gNav1{background:url(../images/gnav.png) 0 0 no-repeat;}
#gNav2{background:url(../images/gnav.png) -245px 0 no-repeat;}
#gNav3{background:url(../images/gnav.png) -490px 0 no-repeat;}
#gNav4{background:url(../images/gnav.png) -735px 0 no-repeat;}
#gNav1 a:hover{background:url(../images/gnav.png) 0 -60px no-repeat;}
#gNav2 a:hover{background:url(../images/gnav.png) -245px -60px no-repeat;}
#gNav3 a:hover{background:url(../images/gnav.png) -490px -60px no-repeat;}
#gNav4 a:hover{background:url(../images/gnav.png) -735px -60px no-repeat;}




/***** side *****/
#side{
	width:200px;
	float:left;
	margin-left:10px;
}

#sideCategory{
	list-style-type:none;
	width:200px;
	height:auto;
	font-size:18px;
	line-height:1;
	background:#fff;
	border:#37639a solid 1px;
}


#sideCategory li a{
	display:block;
	position:relative;
	text-decoration:none;
	color:#fff;
	font-weight:bold;
	padding:10px;
	background:url(../images/side_bg.gif);
	background-repeat:repeat-x;
	background-image: -moz-linear-gradient(top, #83b5f3 0%, #6aa8f4 50%, #569cf3 50%, #569cf3 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #83b5f3), color-stop(0.50, #6aa8f4), color-stop(0.50, #569cf3), color-stop(1, #569cf3));
	border-bottom:#7cb2f6 solid 1px;
	border-top:#37639a solid 1px;
}

#sideCategory li:first-child a{border-top:0;}

#sideCategory li a:hover{
	opacity:0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha( opacity=80 )";
	background: #569cf3;

}

.arrow{
	position:absolute;
	top:50%;
	right: 10px;
	margin-top:-6px;
	color: #fff;
}


.arrow:before{
	font: 18px 'Typicons';
	content: "7";
}

.rotate {
transform: rotate(90deg);
}


#sideCategory li > a:hover .arrow{
color: #37639a;
}

#sideCategory li ul{
	list-style:none;
	background:#fff;
	margin:0;
	padding:0;
}


#sideCategory li ul li a{
	color:#505050;
	font-weight:normal;
	font-size:16px;
	position:relative;
	background:none;
	padding:10px 20px;
	border-top:0;
	border-right:0;
	border-left:0;
	border-bottom:#969696 solid 1px;
}

#sideCategory li ul li a:hover{
	color:#969696;
	background:#fff;
}

#sideCategory li ul li:last-child a{border-bottom:0;}






/***** main *****/

#main{
	width:980px;
	margin:0 auto;
	position:relative;
	padding-top:20px;
	background:#fff;
	text-align:left;
}

#main img{padding:0 10px;}

#pankuzu{
	font-size:12px;
	margin:20px 0 20px 10px;
}

#goTop{clear:both; position:absolute; bottom:100px; right:0;}




/***** footer *****/

#footer{
	width:960px;
	margin:0 auto;
	padding:40px 0;
	clear:both;
}

#footer hr{
	height:1px;
	border:none;
	border-top:solid #969696 1px;
}

#footer p{
	color:#969696;
	font-size:small;
	text-align:center;
	margin-top:20px;
}