@charset "utf-8";
/* ===================================================================
CSS information
 file name  :  common.css
 style info :  サイト全体共通css
=================================================================== */
.clearfix {
  *zoom: 1;
}
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

html, body {
  height: 100%;
}

/* fontsize YUI
10px = 77% 11px = 85% 12px = 93% 13px = 100%
14px = 108% 15px = 116% 16px = 123.1% 17px = 131%
18px = 138.5% 19px = 146.5% 20px = 153.9% 21px = 161.6%
22px = 167% 23px = 174% 24px = 182% 25px = 189% 26px = 197% */
/*

/*----------------------------------------------------------------------------------
		 								body、リンク色設定 
------------------------------------------------------------------------------------*/
body {
  color: #222222;
  font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro W3', 'メイリオ',Meiryo, 'ＭＳ Ｐゴシック', Arial, verdana, sans-serif;
  word-wrap: break-word;
}

* html body {
  /* for IF6 */
  font-family: "ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}

/* 基本リンク色 */
a {
  color: #094079;
  text-decoration: none;
}

a:hover {
  color: #094079;
  text-decoration: underline;
}

.bold { font-weight:bold; }
.gray { color: #666666; }
.red { color: #cc0000; }




/*----------------------------------------------------------------------------------
		 								Loader
------------------------------------------------------------------------------------*/
.QOverlay {
	background-color: #000000;
	z-index: 9999;
}

.QLoader {
	background-color: #CCCCCC;
	height: 1px;
}


/*----------------------------------------------------------------------------------
		 								wrapper
------------------------------------------------------------------------------------*/
div#wrapper {
	min-height: 100%;
	display:none;
	background: url(../images/common/bg_body.png) 0 0 repeat-y;
	*background: url(../images/common/bg_circle_ie.png) 0 0 no-repeat;
	padding: 0 0 0 22px;
}

/*----------------------------------------------------------------------------------
		 								container
------------------------------------------------------------------------------------*/
div#container {
	min-width: 1056px;
	position: relative;
}

div#container p#pagetop-bottom {
	position:absolute;
	bottom: 212px;
	left: 933px;
}

/*----------------------------------------------------------------------------------
		 								left-side 
------------------------------------------------------------------------------------*/
div#left-side {
	width: 315px;
	float: left;
	position: relative;
	padding: 165px 18px 23px 18px;
}

div#left-side h1#logo {
	position:absolute;
	top: 20px;
	left: 11px;
}

div#left-side div#nav {
	padding-bottom: 13px;
}

div#left-side div#change-bnr {
	margin-bottom: 8px;
}

div#left-side ul.side-bnr {
	padding-bottom: 10px;
}

div#left-side ul.side-bnr li {
	margin-bottom: 3px;
}

div#left-side ul.side-bnr li.left {
	float: left;
}

div#left-side ul.side-bnr li.right {
	float: right;
}

div#left-side h2.side-title {
	padding-bottom: 3px;
	border-bottom: 1px solid #000;
	margin-bottom: 5px;
}

div#left-side div#scroll-wrapper {
	padding-bottom: 4px;
	margin-bottom: 8px;
	border-bottom: 1px solid #000;
}

div#left-side div#news-box {
	height:52px;
	overflow: hidden;
}

div#left-side div#news-box dl.news-list {
	padding: 0 0 0 5px;
}

div#left-side div#news-box dl.news-list dt,
div#left-side div#news-box dl.news-list dd {
	font-size:77%;
	line-height: 1.3;
	padding-bottom: 4px;
}
div#left-side div#news-box dl.news-list dt {
	float: left;
	margin-right: 10px;
}

div#left-side div#news-box dl.news-list dd {
	overflow: hidden;
	*zoom:1;
}



div#left-side div#twitter-box {
	height:120px;
	overflow: hidden;
}

ul#twitter_update_list{
	font-size:8pt;
}
ul#twitter_update_list li{
	margin:5px 0;
	border-bottom:1px dotted #666666;
	line-height:1.2em;
	color:#333;
}


/*----------------------------------------------------------------------------------
		 								navigation
------------------------------------------------------------------------------------*/

div#left-side div#nav ul{
	padding:0 0 15px 0;
}
div#left-side div#nav ul li{
	display:inline-block;
	padding:2px 0;
	float:left;
	margin:0 2px 0 0;
}

/*
div#left-side div#nav ul li.new{
	background:url(../images/common/icon_new.gif) no-repeat 120px 10px;
}
*/

div#left-side div#nav ul li.new{
	background:url(../images/common/icon_new2.png) no-repeat 113px 0;
}


div#left-side div#nav a{
	display:block;
	width:154px;
	height:28px;
	text-indent:-9999px;
	background:#c0c0c0;
	border-bottom:1px solid #333;
}
div#left-side div#nav ul li a.n01{background:url(../images/common/menu.png) no-repeat -10px -5px;}
div#left-side div#nav ul li a.n01:hover{background:url(../images/common/menu.png) no-repeat -200px -5px;}
div#left-side div#nav ul li a.n02{background:url(../images/common/menu.png) no-repeat -10px -36px;}
div#left-side div#nav ul li a.n02:hover{background:url(../images/common/menu.png) no-repeat -200px -36px;}
div#left-side div#nav ul li a.n03{background: url(../images/common/menu.png) no-repeat -10px -68px;}
div#left-side div#nav ul li a.n03:hover{background:url(../images/common/menu.png) no-repeat -200px -68px;}
div#left-side div#nav ul li a.n04{background:url(../images/common/menu.png) no-repeat -10px -100px;}
div#left-side div#nav ul li a.n04:hover{background:url(../images/common/menu.png) no-repeat -200px -100px;}
div#left-side div#nav ul li a.n05{background:url(../images/common/menu.png) no-repeat -10px -131px;}
div#left-side div#nav ul li a.n05:hover{background:url(../images/common/menu.png) no-repeat -200px -131px;}
div#left-side div#nav ul li a.n06{background:url(../images/common/menu.png) no-repeat -10px -163px;}
div#left-side div#nav ul li a.n06:hover{background:url(../images/common/menu.png) no-repeat -200px -163px;}
div#left-side div#nav ul li a.n07{background:url(../images/common/menu.png) no-repeat -10px -194px;}
div#left-side div#nav ul li a.n07:hover{background:url(../images/common/menu.png) no-repeat -200px -194px;}
div#left-side div#nav ul li a.n08{background:url(../images/common/menu.png) no-repeat -10px -225px;}
div#left-side div#nav ul li a.n08:hover{background:url(../images/common/menu.png) no-repeat -200px -225px;}
div#left-side div#nav ul li a.n09{background:url(../images/common/menu.png) no-repeat -10px -256px;}
div#left-side div#nav ul li a.n09:hover{background:url(../images/common/menu.png) no-repeat -200px -256px;}
div#left-side div#nav ul li a.n10{background:url(../images/common/menu.png) no-repeat -10px -288px;}
div#left-side div#nav ul li a.n10:hover{background:url(../images/common/menu.png) no-repeat -200px -288px;}
div#left-side div#nav ul li a.n11{background:url(../images/common/menu.png) no-repeat -10px -319px;}
div#left-side div#nav ul li a.n11:hover{background:url(../images/common/menu.png) no-repeat -200px -319px;}
div#left-side div#nav ul li a.n12{background:url(../images/common/menu.png) no-repeat -10px -351px;}
div#left-side div#nav ul li a.n12:hover{background:url(../images/common/menu.png) no-repeat -200px -351px;}
div#left-side div#nav ul li a.n13{background:url(../images/common/menu.png) no-repeat -10px -351px;}
div#left-side div#nav ul li a.n13:hover{background:url(../images/common/menu.png) no-repeat -200px -351px;}
div#left-side div#nav ul li a.n14{background:url(../images/common/menu.png) no-repeat -10px -382px;}
div#left-side div#nav ul li a.n14:hover{background:url(../images/common/menu.png) no-repeat -200px -382px;}
div#left-side div#nav ul li a.n15{background:url(../images/common/menu.png) no-repeat -10px -413px;}
div#left-side div#nav ul li a.n15:hover{background:url(../images/common/menu.png) no-repeat -200px -413px;}


div#left-side div#nav ul li a.n16{background:url(../images/common/menu2.png) no-repeat -10px -6px;}
div#left-side div#nav ul li a.n16:hover{background:url(../images/common/menu2.png) no-repeat -200px -6px;}
div#left-side div#nav ul li a.n17{background:url(../images/common/menu2.png) no-repeat -10px -37px;}
div#left-side div#nav ul li a.n17:hover{background:url(../images/common/menu2.png) no-repeat -200px -37px;}
div#left-side div#nav ul li a.n18{background: url(../images/common/menu2.png) no-repeat -10px -68px;}
div#left-side div#nav ul li a.n18:hover{background:url(../images/common/menu2.png) no-repeat -200px -68px;}
div#left-side div#nav ul li a.n19{background:url(../images/common/menu2.png) no-repeat -10px -100px;}
div#left-side div#nav ul li a.n19:hover{background:url(../images/common/menu2.png) no-repeat -200px -100px;}
div#left-side div#nav ul li a.n20{background:url(../images/common/menu2.png) no-repeat -10px -131px;}
div#left-side div#nav ul li a.n20:hover{background:url(../images/common/menu2.png) no-repeat -200px -131px;}
div#left-side div#nav ul li a.n21{background:url(../images/common/menu2.png) no-repeat -10px -162px;}
div#left-side div#nav ul li a.n21:hover{background:url(../images/common/menu2.png) no-repeat -200px -162px;}










/*----------------------------------------------------------------------------------
		 								contents
------------------------------------------------------------------------------------*/
div#contents {
	width: 620px;
	float: left;
	padding: 24px 0 23px 30px;
	line-height: 1.5;
}

.hidden{display:none;}

/*----------------------------------------------------------------------------------
		 								footer
------------------------------------------------------------------------------------*/
div#footer {
	clear: both;
	padding: 0 22px 40px 18px;
}

div#footer-inner {
	padding-top: 18px;
	border-top: 1px solid #000;
	min-height: 150px;
	_height: 150px;
}

div#footer ul.footer-bnr {
	padding: 0 0 10px;
    float: left;
}

div#footer ul.footer-bnr li {
	float: left;
	margin-right: 8px;
}

div#footer p.footer-text-01 {
	font-size:77%;
	padding-bottom: 10px;
    clear:left;
}

div#footer ul.footer-nav {
	padding: 0;
	margin: 0 0 10px;
	border-left: 1px solid #222;
}

div#footer ul.footer-nav li {
	float: left;
	padding: 0 7px;
	border-right: 1px solid #222;
	font-size:77%;
}

div#footer p.copyright {
	font-size:77%;
}

img.footer_qr { margin:18px 8px 5px 0; float:right; border:1px #cccccc solid; }


/*----------------------------------------------------------------------------------
		 								動く背景
------------------------------------------------------------------------------------*/
@-webkit-keyframes circle {
	0%		{ -webkit-transform: translateY(0px); opacity: 0;}
	5%		{ -webkit-transform: translateY(100px); opacity: 1;}
	90%		{ -webkit-transform: translateY(1800px); opacity: 1;}
	98%		{ -webkit-transform: translateY(1960px); opacity: 0;}
	100%	{ -webkit-transform: translateY(-20px); opacity: 0;}
}

@-moz-keyframes circle {
	0%		{ -moz-transform: translateY(0px); opacity: 0;}
	5%		{ -moz-transform: translateY(100px); opacity: 1;}
	90%		{ -moz-transform: translateY(1800px); opacity: 1;}
	98%		{ -moz-transform: translateY(1960px); opacity: 0;}
	100%	{ -moz-transform: translateY(-20px); opacity: 0;}
}

@-ms-keyframes circle {
	0%		{ -ms-transform: translateY(0px); opacity: 0;}
	5%		{ -ms-transform: translateY(100px); opacity: 1;}
	90%		{ -ms-transform: translateY(1800px); opacity: 1;}
	98%		{ -ms-transform: translateY(1960px); opacity: 0;}
	100%	{ -ms-transform: translateY(-20px); opacity: 0;}
}

#bg-wrapper {
	position: fixed;
	z-index:	-10;
	width:		100%;
	height:		100%;
	*display: none;
}

#move-bg01,
#move-bg02 {
	z-index:	-10;
	width:		1500px;
	height:		100%;
	position: relative;
	*display: none;
}

.bg-circle {
	position: fixed;
	z-index:	-10;
	border-radius: 100px;
	-moz-border-radius: 100px;
	-webkit-border-radius: 100px;
	behavior: url(/js/PIE.htc);
}

/*
.bg-circle-color-01 {
	background-color: rgba(76, 76, 76, 0.9);
}

.bg-circle-color-02 {
	background-color: rgba(254, 255, 86, 0.9);
}

.bg-circle-color-03 {
	background-color: rgba(93, 207, 255, 0.9);
}

.bg-circle-color-04 {
	background-color: rgba(255, 97, 89, 0.9);
}

.bg-circle-color-05 {
	background-color: rgba(95, 255, 91, 0.9);
}
*/

/*
.bg-circle-color-01 {
	background-color: #5dcfff;
}

.bg-circle-color-02 {
	background-color: #feff56;
}

.bg-circle-color-03 {
	background-color: #ff6159;
}

.bg-circle-color-04 {
	background-color: #5fff5b;
}

.bg-circle-color-05 {
	background-color: #4c4c4c;
}
*/


.bg-circle-color-01 {
	background-color: #76E2FF;
}

.bg-circle-color-02 {
	background-color: #FFF876;
}

.bg-circle-color-03 {
	background-color: #FF6E6E;
}

.bg-circle-color-04 {
	background-color: #9FFC92;
}

.bg-circle-color-05 {
	background-color: #828282;
}



.bg-circle-width-01 {
	width: 10px;
	height: 10px;
}

.bg-circle-width-02 {
	width: 30px;
	height: 30px;
}

.bg-circle-width-03 {
	width: 50px;
	height: 50px;
}

.bg-circle-width-04 {
	width: 70px;
	height: 70px;
}


.circle01 {
	animation: circle 95s infinite linear;
	-moz-animation: circle 95s infinite linear;
	-webkit-animation: circle 95s infinite linear;
}

.circle02 {
	animation: circle 150s infinite linear;
	-moz-animation: circle 150s infinite linear;
	-webkit-animation: circle 150s infinite linear;
}




/*==========pagetop==========*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 77%;
}
#page-top a {
	text-decoration: none;
	color: #fff;
	width: 100px;
	padding: 30px 0;
	text-align: center;
	display: block;
	border-radius: 5px;
}
#page-top a:hover {
	text-decoration: none;
}

.circle03 {
	animation: circle 190s infinite linear;
	-moz-animation: circle 190s infinite linear;
	-webkit-animation: circle 190s infinite linear;
}

.circle04 {
	animation: circle 210s infinite linear;
	-moz-animation: circle 210s infinite linear;
	-webkit-animation: circle 210s infinite linear;
}