@charset "UTF-8" ;

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

レスポンシブルwebテスト用

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

body {
	max-width:1100px;
	color: #000000; /* テキストの文字色 */
	background-color: #FEFEFE;
	background-attachment: fixed;
	background-image: url("./image/background.jpg");
}

/* フッターリンク部分の色の設定 */
A.footer:link		{ color: #FFFFFF }   /* 普通のリンク色 */
A.footer:visited	{ color: #FFFFFF }   /* すでに見たリンク色 */
A.footer:active		{ color: #FFFFFF }   /* クリックしたときのリンク色 */
A.footer:hover		{ color: #FFFFFF }   /* カーソルが乗ったときのリンク色 */

A:link, A:visited, A:hover { text-decoration: none } /*リンクの下線を消す */

/*ボタンブルー メニュートップ用*/

.menutopblue {
	line-height:2em;
	display:inline-block;
	width:150px;
	text-align:center;
	vertical-align: middle;
	font-size:16px;
	margin:5px;
	text-decoration:none;
	border-top:1px solid #A9A9A9;
	border-left:1px solid #828282;
	border-right:1px solid #ABCDEFG;
	border-bottom:1px solid #323232;
	border-radius:5px;
	clear:both;
}

.menutopblue a {
	background-color:#0033FF;	/*デフォルトのボタン色*/
	text-decoration:none;
	border-color:#336699;
	border-width:0px 0px 0px 0px;
	border-style:double;
	color:#FFFFFF;
	display:block;
	width:100%;
	border-radius:5px;
	clear:both;
}

.menutopblue a:hover {
	border-color:#FF3333;
	border-width:0px 0px 0px 0px;
	border-style:double;
	background-color:#00CCFF;	/*カーソルを載せたときのボタン色*/
	text-decoration:none;
	color:#FFFFFF;
	width:100%;
	display:block;
	border-radius:5px;
	clear:both;
}

.menutopblue a:visited {	/*訪問済みのリンク*/
	color:#FFFFFF;	/*ボタン文字の色*/
	width:100%;
	display:block;
	clear:both;
}

/*ボタンピンク メニュートップ用*/

.menutoppink {
	line-height:2em;
	display:inline-block;
	width:150px;
	text-align:center;
	vertical-align: middle;
	font-size:16px;
	margin:5px;
	text-decoration:none;
	border-top:1px solid #A9A9A9;
	border-left:1px solid #828282;
	border-right:1px solid #ABCDEFG;
	border-bottom:1px solid #323232;
	border-radius:5px;
	clear:both;
}

.menutoppink a {
	background-color:#FF1493;	/*デフォルトのボタン色*/
	text-decoration:none;
	border-color:#336699;
	border-width:0px 0px 0px 0px;
	border-style:double;
	color:#FFFFFF;
	display:block;
	width:100%;
	border-radius:5px;
	clear:both;
}

.menutoppink a:hover {
	border-color:#FF3333;
	border-width:0px 0px 0px 0px;
	border-style:double;
	background-color:#FF83FA;	/*カーソルを載せたときのボタン色*/
	text-decoration:none;
	color:#FFFFFF;
	width:100%;
	display:block;
	border-radius:5px;
	clear:both;
}

.menutoppink a:visited {	/*訪問済みのリンク*/
	color:#FFFFFF;	/*ボタン文字の色*/
	width:100%;
	display:block;
	clear:both;
}

/*ボタンブルー メニューサイド用*/

.menusideblue {
	line-height:2em;
	display:block;
	margin:10px;
	text-align:left;
	vertical-align: middle;
	font-size:12px;
	text-decoration:none;
	border-top:1px solid #A9A9A9;
	border-left:1px solid #828282;
	border-right:1px solid #ABCDEFG;
	border-bottom:1px solid #323232;
	border-radius:3px;
	clear:both;
}

.menusideblue a {
	background-color:#0033FF;	/*デフォルトのボタン色*/
	text-decoration:none;
	border-color:#336699;
	border-width:0px 0px 0px 0px;
	border-style:double;
	color:#FFFFFF;
	display:block;
	width:100%;
	border-radius:3px;
	clear:both;
}

.menusideblue a:hover {
	border-color:#FF3333;
	border-width:0px 0px 0px 0px;
	border-style:double;
	background-color:#00CCFF;	/*カーソルを載せたときのボタン色*/
	text-decoration:none;
	color:#FFFFFF;
	width:100%;
	display:block;
	border-radius:3px;
	clear:both;
}

.menusideblue a:visited {	/*訪問済みのリンク*/
	color:#FFFFFF;	/*ボタン文字の色*/
	width:100%;
	display:block;
	clear:both;
}

.table-01 {
	padding: 0;
	border: #E3E3E3 solid;
	border-width: 0 0 1px 1px;
	background: #6495ED;
	width: 100%;
}

.table-01 th {
	padding: 1px;
	border: #98DCDC solid;
	border-width: 0 0 1px 1px;
	background: #FF6699 ;
	color: #FFFFFF;
	font-size:16px;
	font-weight: bold;
	line-height: 120%;
	text-align: center;
}

.table-01 td {
	padding: 0;
	border-style: solid;
	border-width: 1px;
	background: #F8FBFF ;
	border-color: #FFFFFF #8ED9D9 #8ED9D9 #FFFFFF;
	color: #1A4444;
	text-align: left;
}

div.left {
    text-align: left; 
}
div.center {
    text-align: center; 
}
div.right {
    text-align: right; 
}



/* ボディ */
body
{
	margin: 0 ;		/* スペース */
	padding: 0 ;		/* 余白 */
	font-size: 15px ;	/* 文字サイズ */
	line-height: 1.618 ;	/* 行の高さ */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
	/* ボディ */
	body
	{
		font-size: 13px ;	/* 文字サイズ */
	}
}


/* ヘッダー */
.header
{
	border-bottom: 1px solid #888 ;		/* 枠線 */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
	padding: 0 ;			/* 上下の余白 */
	margin-bottom: 0 ;			/* 他のブロックとのスペース */
	width: 1100px ;
}

.topmenu
{
	border-bottom: 1px solid #888 ;		/* 枠線 */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
	padding:  1em 0 ;			/* 上下の余白 */
	margin-bottom: 1em ;			/* 他のブロックとのスペース */
	width: 1100px ;
	clear: both;
}

/* ロゴ画像 */
.logo
{
	width: 600px ;
	height: auto ;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
	/* ロゴ画像 */
	.logo
	{
		width: 300px ;
	}
}

/* フッター */
.footer
{
	border-top: 1px solid #888 ;		/* 枠線 */
	text-align: center ;			/* テキスト、画像の左寄せ */
	margin-top: 1em ;			/* 他のブロックとのスペース */
	padding: 1em 0 ;			/* 上下の余白 */
	clear: both;
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.wrapper
{
	display:inline-block;
	width: 880px ;
	margin: 0  ;		/* 左右に[auto]を指定することで、真ん中に寄る */
	padding: 0 ;			/* 上下左右の余白を0にしておく */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
	.wrapper
	{
		width: auto ;
		padding: 0 10px ;
	}
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
{
	width: 650px ;
	padding: 10px ;					/* 上下左右に20pxの余白 */
	border: 0px solid rgba(0,0,0,.1) ;		/* 枠線 */
}

.sidemenu_L
{
	width: 200px ;
	margin-right: auto;
}

.sidemenu_R
{
	width: 200px ;
	margin-left: 20px;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{

	.table-01 th, .table-01 td{
		padding: 5px;
		border-style: solid;
		border-width: 1px;
		background: #F8FBFF ;
		border-color: #FFFFFF #8ED9D9 #8ED9D9 #FFFFFF;
		color: #1A4444;
		text-align: left;
	}

	.header
	{
		width: auto ;
	}

	.main
	{
		width: auto ;
		padding: 0 ;		/* 余白 */
		border: none ;		/* 枠線 */
		padding-bottom:20px;
	}

	.topmenu
	{
		width: auto ;
	}

	.sidemenu_L
	{
		width: 100% ;
		text-align: center ;
	}

	.hide {
		display: none;
	}

	.sidemenu_R
	{
		display: none;
	}

}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.header
{
	float: left ;
}
.topmenu
{
	float: left ;
}
.wrapper
{
	float: left ;		/* 左に寄せる */
}
.main
{
	float: right ;		/* 右に寄せる */
}

.sidemenu_L
{
	float: left ;		/* 左に寄せる */
}

.sidemenu_R
{
	float: right ;		/* 右に寄せる */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
	.main , .side
	{
		float: none ;
	}
}

.wrapper
{
	overflow: hidden ;
}

/* パソコンで見たときは"pc"のclassが表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassが表示される */
@media only screen and (max-width: 479px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}


