@charset "utf-8";
/* Bタイプ 1カラム 幅  800px ( さとる型 ) */

/* スマホCSS */
@media screen and (max-width:899px){ 
	* html .clearfix { height:1%; }
	.clearfix { display:block; }
	.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
	body{ margin:0px; padding:0px; text-align:center; font-family:Verdana,Arial,"メイリオ",Meiryo,"ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif; color:#333333; background:#FFFAFA fixed; font-size:14px; }
	img { border:0; margin:0; padding:0; }
	a { margin:0; padding:0; font-weight:bold; color:#0033FF; }
	a:visited { color:#0033FF; }
	a:hover { color:#FF0000; }
	a img { text-decoration:none; }
	p { margin:0; padding:0; }
	.textleft{ text-align:left; color:#666; margin:0 20px; padding:0 0 15px 0;clear:both;  font-size:14px; }
	.textright{ text-align:right; color:#666; margin:0 20px; padding:0 0 15px 0;clear:both;  font-size:14px; }
	.line_y { background: linear-gradient(transparent 60%, #FFFF66 60%); font-weight:bold; }
	.line_b { background: linear-gradient(transparent 60%, #66FFFF 60%); font-weight:bold; }
	.line_p { background: linear-gradient(transparent 60%, #FF66FF 60%); font-weight:bold; }
	.line_g { background: linear-gradient(transparent 60%, #FF66FF 60%); font-weight:bold; }
	.line_o { background: linear-gradient(transparent 60%, #FFAA66 60%); font-weight:bold; }
	.mg_t2 { margin-top:30px; }
	.mg_t { margin-top:15px; }
	.mg_b2 { margin-bottom:30px; }
	.mg_b { margin-bottom:15px; }
	.mg_l { margin-left:15px; }
	.mg_r { margin-right:15px; }
	.basepage { margin:8px 2%; padding:0; width:96%; margin-right:auto; margin-left:auto; position:relative; background-color:#FFF; border:#D3D3D3 solid 1px; font-size:16px; color:#666; }
	h2 { font-size:16px;font-weight:normal; text-align:left; line-height:1.6em; color:#666; margin:0; padding:0; }
	.headertop { height:80px; width:100%; background:url("./") 0% 50% no-repeat #C7FFEA; background-size:cover; border-bottom:1px solid #C3C3C3; }
	.header { width:100%; margin:0; padding:0; font-size:16px; color:#666; text-align:left; clear:both; }
	.header h1 { width:96%; font-size:22px; text-align:left; line-height:30px; margin:8px 2%; padding:0; position:relative; }
	.header h1 a, .header h1 { color:#000000; text-decoration:none; }
	.header h2 { display:none; }
	.setting { margin:0px; padding:0px; width:100%; position:relative; overflow:hidden; }
	.setting h2 { font-size:16px; }
	.navi { background-color:#EAEAEA; background:linear-gradient(to bottom, #D3D3D3, #EAEAEA, 80%, #D3D3D3); float:left; width:100%; padding:0; margin:0; font-size:16px; text-align:left; line-height:1.6em; }
	.navi ul { margin:0; padding:0; text-decoration:none; }
	.navi ul a { text-decoration:none; }
	.navi ul a li { margin:0; padding:0; text-decoration:none; list-style-type:none; font-size:16px; color:#666666; border-bottom:1px solid #C3C3C3; text-align:left; display:block; padding:20px 10px; clear:both; }
	.navi ul a li:hover { background-color:#D3D3D3; background:linear-gradient(to bottom, #EAEAEA, #D3D3D3, 80%, #EAEAEA); }
	.navititle { margin:0; padding:0; height:30px; text-align:left; background-color:#FFFFFF; overflow:hidden; clear:both; display: block; position: relative; }
	.navititle:before { display:block; content:""; position:absolute; top:50%; right:5px; width:50px; height:30px; margin-top:-10px; background:#666666; }
	.navititle:after { display:block; content:"MENU"; position:absolute; top:8px; right:10px; color:#FFFFFF; font-size:14px; }
	label { display: block; cursor: pointer; }
	input[type="checkbox"].on-off{ display: none; }
	input[type="checkbox"].on-off + div{ display: none; }
	input[type="checkbox"].on-off:checked + div{ display: block; }
	.breadcrumbs { display:none; }
	.important { width:94%; margin:20px 3% 10px; padding:0; font-size:16px; float:left; text-align:left; }
	.submenu { width:94%; margin:10px 3% 10px 3%; padding:0; font-size:16px; float:left; text-align:center; }
	.caption { margin:0; padding:0; text-align:left; border-left:5px solid #C7FFEA; border-bottom:2px solid #C7FFEA; background-color:#F5F5F5; clear:both; }
	.caption h2 { margin:0; padding:0 5px 0 12px; font-size:16px; font-weight:bold; line-height:40px; color:#666; }
	.caption h3 { margin:0; padding:0 5px 0 12px; font-size:16px; font-weight:bold; line-height:40px; color:#666; }
	.caption p { margin:0; padding:0 5px 0 12px; font-size:16px; font-weight:bold; line-height:40px; color:#666; }
	h4 { padding:0 5px 0 12px; margin:30px 0 10px; font-size:16px; font-weight:bold; line-height:35px; text-align:left; border-left:3px solid #C7FFEA; background:linear-gradient(transparent 93%, #C7FFEA 0%); clear:both; }
	.message { display:none; }
	.free { margin:0; padding:20px 0 20px 0; font-size:16px; color:#666; text-align:center; }
	.contents { margin:0; padding:20px 10px 30px; font-size:16px; color:#666; text-align:left; line-height:1.8em; }
	.contents p { margin:0 0 40px 0px; text-align:left; }
	.contents .icenter { margin:0 0 15px 0; text-align:center; }
	.contents .ileft { margin:0 0 15px 0; text-align:center; }
	.contents .iright { margin:0 0 15px 0; text-align:center; }
	.important ul { margin:0; padding:0; text-decoration:none; }
	.important ul li{ margin:0; padding:0 0 20px 0; text-decoration:none; list-style-type:none; border-bottom:1px dashed #999; text-align:left; clear:both; }
	.important ul li a { text-decoration:none; display:block; padding:10px 10px; }
	.menu { margin:0; padding:0 0 20px; font-size:16px; color:#666; text-align:left; line-height:1.8em; }
	.menu ul { margin:0; padding:0; text-decoration:none; }
	.menu ul li{ margin:0; padding:0; text-decoration:none; list-style-type:none; border-bottom:1px dashed #999; text-align:left; clear:both; }
	.menu ul li a { text-decoration:none; display:block; padding:20px 10px; }
	.menu p { padding:20px 10px; text-align:left; }
	.endpage { width:100%; height:60px; margin:10px 0; padding:5px 0; background-color:#C7FFEA; text-align:center; color:#666; border-top:1px solid #999; clear:both; font-size:12px; }
	.endpage a { display:block; }
	.display-pc { display:none; }
	img { max-width:95%; height:auto; }
	#fixed_footer{ z-index: 1; position: fixed; bottom: 0; left: 0; right:0; max-width:100%; }
	.fixed_footer_space{ height:100px; }
	.tomoki { display:none; }
}
/* スマホCSS */

/* パソコンCSS */
@media screen and (min-width: 900px) { 
	* html .clearfix { height:1%; }
	.clearfix { display:block; }
	.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
	body{ margin:0px; padding:0px; text-align:center; font-family:Verdana,Arial,"メイリオ",Meiryo,"ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif; color:#333333; background:#FFFAFA fixed; font-size:14px; }
	img { border:0; margin:0; padding:0; }
	a { margin:0; padding:0; font-weight:bold; color:#0033FF; }
	a:visited { color:#0033FF; }
	a:hover { color:#FF0000; }
	a img { text-decoration:none; }
	p { margin:0; padding:0; }
	.textleft{ text-align:left; color:#666; margin:0 20px; padding:0 0 15px 0;clear:both;  font-size:14px; }
	.textright{ text-align:right; color:#666; margin:0 20px; padding:0 0 15px 0;clear:both;  font-size:14px; }
	.line_y { background: linear-gradient(transparent 60%, #FFFF66 60%); font-weight:bold; }
	.line_b { background: linear-gradient(transparent 60%, #66FFFF 60%); font-weight:bold; }
	.line_p { background: linear-gradient(transparent 60%, #FF66FF 60%); font-weight:bold; }
	.line_g { background: linear-gradient(transparent 60%, #FF66FF 60%); font-weight:bold; }
	.line_o { background: linear-gradient(transparent 60%, #FFAA66 60%); font-weight:bold; }
.mg_t2 { margin-top:30px; }
.mg_t { margin-top:15px; }
.mg_b2 { margin-bottom:30px; }
.mg_b { margin-bottom:15px; }
.mg_l { margin-left:15px; }
.mg_r { margin-right:15px; }
	.basepage { margin:8px 0; padding:0; width:800px; margin-right:auto; margin-left:auto; position:relative; background-color:#FFF; border:#D3D3D3 solid 1px; border-radius:15px 15px 0 0; font-size:14px; color:#666; }
	.headertop { height:150px; width:800px; background:url("./") 0% 50% no-repeat #C7FFEA; background-size:cover; border-bottom:1px solid #C3C3C3; }
	.header { width:800px; border-bottom:1px solid #C3C3C3; margin:0; padding:0; font-size:14px; color:#666; text-align:left; clear:both; }
	.header h1 { width:760px; font-size:24px; text-align:left; line-height:30px; margin:0 20px; padding-top:10px; position:relative; }
	.header h1 a, .header h1 { color:#000000; text-decoration:none; }
	.header h2 { width:760px; font-size:12px; font-weight:normal; text-align:left; line-height:18px; color:#000000; margin:10px 20px; position:relative; }
	.setting { margin:0px; padding:0px 10px; width:780px; position:relative; overflow:hidden; }
	.navi { background-color:#EAEAEA; background:linear-gradient(to bottom, #D3D3D3, #EAEAEA, 80%, #D3D3D3); float:left; width:800px; border-bottom:1px solid #C3C3C3; padding:0; margin:0; font-size:14px; text-align:left; }
	.navi ul { margin:0; padding:0; height:40px; text-decoration:none; display:table; }
	.navi ul a { height:40px; text-decoration:none; display: table-cell; vertical-align: middle; }
	.navi ul a li { margin:0; padding:0 5px; width:149px; height:40px; border-right:1px solid #C3C3C3; text-decoration:none; list-style-type:none; display: table-cell; text-align:center; vertical-align:middle; font-size:14px; line-height:1em; color:#666666; }
	.navi ul a li:hover { background-color:#D3D3D3; background:linear-gradient(to bottom, #EAEAEA, #D3D3D3, 80%, #EAEAEA); }
	.breadcrumbs { float:left; width:760px; height:30px; padding:0; margin:10px 10px 0; font-size:11px; text-align:left; }
	.important { width:760px; margin:10px 10px; padding:0; font-size:14px; float:right; text-align:left; }
	.submenu { width:760px; margin:10px 10px; padding:0; font-size:14px; float:left; text-align:center; }
	.caption { margin:0; padding:0; text-align:left; border-left:5px solid #C7FFEA; border-bottom:2px solid #C7FFEA; background-color:#F5F5F5; clear:both; }
	.caption h2 { margin:0; padding:0 5px 0 12px; font-size:16px; font-weight:bold; line-height:40px; color:#666; }
	.caption h3 { margin:0; padding:0 5px 0 12px; font-size:16px; font-weight:bold; line-height:40px; color:#666; }
	.caption p { margin:0; padding:0 5px 0 12px; font-size:16px; font-weight:bold; line-height:40px; color:#666; }
	h4 { 	padding:0 5px 0 12px; margin:30px 0 10px; font-size:16px; font-weight:bold; line-height:35px; text-align:left; border-left:3px solid #C7FFEA; background:linear-gradient(transparent 93%, #C7FFEA 0%); clear:both; }
	.message { font-size: 11px; line-height: 1.1em; color: #787878; margin: 20px 10px; padding: 10px; border: 1px solid #cccccc; border-radius: 0.5em; }
	.free { margin:0; padding:0 0 15px 0; font-size:14px; color:#666; text-align:center; clear:both; }
	.contents { margin:0; padding:10px 10px 20px; font-size:14px; color:#666; text-align:left; line-height:1.6em; }
	.contents p { margin:0 0 30px 0px; text-align:left; }
	.contents .icenter { margin:7px 0 15px 0; text-align:center; }
	.contents .ileft { margin:7px 15px 15px 0; max-width:345px; float:left; text-align:center; }
	.contents .iright { margin:7px 0 15px 15px; max-width:345px; float:right; text-align:center; }
	.important ul { margin:0; padding:0; text-decoration:none; }
	.important ul li{ margin:0; padding:0 0 20px 0; text-decoration:none; list-style-type:none; border-bottom:1px dashed #999; text-align:left; clear:both; }
	.important ul li a { text-decoration:none; display:block; padding:10px 10px; }
	.menu { margin:0; padding:0 0 20px; font-size:14px; color:#666; text-align:left; line-height:1.6em; }
	.menu ul { margin:0; padding:0; text-decoration:none; }
	.menu ul li{ margin:0; padding:0; text-decoration:none; list-style-type:none; text-align:left; display: inline-block; }
	.menu ul li a { text-decoration:none; display:block; padding:10px 15px; }
	.menu p { padding:10px 10px; text-align:left; }
	.endpage { width:800px; height:45px; margin:0px; padding:15px 0 0 0; background-color:#C7FFEA; text-align:center; color:#666; border-top:1px solid #999; clear:both; font-size:12px; }
	.display-pc { }
	.display-sp { display:none; }
	.tomoki { padding:0 30px; height:56px; overflow:hidden; font-size:11px; line-height:14px; }
}
/* パソコンCSS */