﻿@charset "UTF-8";

/* タグの初期化 */
body, h1, h2, h3, h4, p, form, hr, blockquote, ul, ol, li, dl, dt, dd 
{
	margin: 0px;
	padding: 0px;
}

/* ----------------------------------------------
	タグの置き換え
   ---------------------------------------------- */
body 
{
	font-size: 84%;
	font-family: メイリオ, ヒラギノ角ゴ Pro W3, sans-serif;
	padding: 0px 0px 0px 0px;
	text-align: center;
	background: #FFF;
}

/* ----------------------------------------------
	リンクタグの置き換え
   ---------------------------------------------- */
a
{
	color: #656565;
	font-size: 90%;
	line-height: 1.7;

}

a:link
{
	color: #555;
	text-decoration: underline;
}
a:visited	{ color: #337777;								}
a:hover		{ color: #FF2200;	text-decoration: none;		}

strong
{
	font-weight: normal;
	font-size: 113%;	
}

/* ----------------------------------------------
	hrの置き換え
   ---------------------------------------------- */
hr 
{
	margin: 8px 0;
	border: 0;
	border-top: 2px dotted #E5E5E5;
	color: #FFF;
	clear: both;
}

/* ----------------------------------------------
	ul, ul li, a imgの置き換え
   ---------------------------------------------- */
ul, ul li	{ list-style: none;	}

a img		{ border: none;	vertical-align: bottom;	}

/* ----------------------------------------------
	h1の置き換え
   ---------------------------------------------- */
h1 {
	font-size: 170%;
}

h2 {
	font-size: 113%;
}

/* ----------------------------------------------
	トップのスペース
   ---------------------------------------------- */
#top-space
{
	background-color: #FAFAFA;
	font-size: 80%;
	text-align: left;
	clear: both;
	margin: 0px 0px 0px 0px;
	padding: 2px 0px 0px 2px;
	width: 100%;
	height: 23px;
/*	border: dotted 1px #000000;*/
}

/* ----------------------------------------------
	トップのバー
   ---------------------------------------------- */
#top-bar
{
	background-color: #83BF02;
	font-size: 80%;
	clear: both;
	margin: 0px 0px 0px 0px;
	width: 100%;
	height: 20px;
/*	border: 1px green solid;*/
	border-top: 1px green solid;
	border-bottom: 1px green solid;

}


/* ----------------------------------------------
	一番下のバー
   ---------------------------------------------- */
#under-bar
{
	background-color: #83BF02;
	text-align: left;
	clear: both;
	margin: 0px 0px 0px 0px;
	padding: 2px 2px 2px 2px;
	width: 100%;
	height: 75px;
	border-top: 1px green solid;
	border-bottom: 1px green solid;

}

/* ----------------------------------------------
	一番下のスペース
   ---------------------------------------------- */
#under-space
{
	background-color: #FAFAFA;
	font-size: 80%;
	clear: both;
	margin: 0px 0px 0px 0px;
	width: 100%;
	height: 50px;
}

/* ----------------------------------------------
	全てを囲むエリア
   ---------------------------------------------- */
#all
{
	background: #FFFFFF url('../img/background.jpg') repeat-x;
	clear: both;
	float: none;
	margin: 0px 0px 0px 0px;
	width: 100%;
	height: 100%;
}

/* ----------------------------------------------
	主にいじる場所
   ---------------------------------------------- */
#main
{
	background: #FFFFFF url('../img/background.jpg') repeat-x;
	clear: both;
	float: left;
	margin: 0px 0px 0px 5px;
	width: 760px;
	height: 100%;
/*	border: dotted 1px #000000;*/

}

/* ----------------------------------------------
	アプリケーションタイトル
   ---------------------------------------------- */
#app-name
{
	background: #FFFFFF url('../img/background.jpg') repeat-x;
	text-align: left;
	margin: 0px 10px 0px 10px;
	padding: 10px 0px 5px 0px;
	float: left;
	width: 517px;
	height: 50px;
}



/* ----------------------------------------------
	アプリケーション体験版ダウンロード
   ---------------------------------------------- */
#app-trial-dl
{
	background-color: #FFFFFF;
	text-align: center;
	margin: 5px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	float: left;
	width: 750px;
	height: 75px;
	border: 1px green solid;
}

/* ----------------------------------------------
	アプリケーションの機能紹介イメージ
   ---------------------------------------------- */
#app-func-img
{
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	float: left;
	width: 400px;
	height: 180px;
	border: 1px green solid;
}

/* ----------------------------------------------
	アプリケーションの機能紹介情報
   ---------------------------------------------- */
#app-func-info
{
	font-weight: bold;
	font-size: 100%;
	line-height: 140%;
	color: #666666;
	margin: 0px 0px 0px 0px;
	padding: 5px 10px 10px 10px;
	text-align: left;
	float: left;
	width: 328px;
	height: 165px;
	border: 1px green solid;
}

/* -------------------------------------------------------------------------------
	左側のリンクボックス
   ------------------------------------------------------------------------------- */

/* ----------------------------------------------
	左側のボックス
   ---------------------------------------------- */
#left-box
{
	background-color: #FFFFFF;
	margin: 5px 0px 0px 0px;
	float: left;
	width: 150px;
	height: auto;
	clear: both;
/*	border-right: 1px green solid;*/
}

/* ----------------------------------------------
	左側のボックスのトップタイトル
   ---------------------------------------------- */
#left-box .title-top
{
	background: #EEEEEE url('../img/MenuTop.jpg') no-repeat;
	margin: 0px 0px 1px 0px;
	padding: 1px 2px 0px 23px;
	text-align: right;
	float: left;
	width: 125px;
	height: 19px;
	border-bottom: 1px black solid;
}

/* ----------------------------------------------
	左側のボックスのミドルタイトル
   ---------------------------------------------- */
#left-box .title-middle
{
	background: #EEEEEE url('../img/MenuMiddle.jpg') no-repeat;
	margin: 0px 0px 0px 0px;
	padding: 1px 2px 0px 23px;
	text-align: right;
	float: left;
	width: 125px;
	height: 17px;
}

/* ----------------------------------------------
	左側のボックスのボトムタイトル
   ---------------------------------------------- */
#left-box .title-bottom
{
	background: #EEEEEE url('../img/MenuBottom.jpg') no-repeat;
	margin: 0px 0px 0px 0px;
	padding: 1px 2px 0px 23px;
	text-align: right;
	float: left;
	width: 125px;
	height: 19px;
	border-top: 1px black solid;

}

/* ----------------------------------------------
	左側のボックスのリンクのタイトル
   ---------------------------------------------- */
#left-box .link-area-title
{
	background-color: #FFFFFF;
	margin: 0px 0px 0px 20px;
	padding: 1px 3px 0px 0px;
	text-align: right;
	font-size: 90%;
	float: right;
	width: 127px;
	height: auto;
	border-bottom: 1px black solid;
}

/* ----------------------------------------------
	左側のボックスのリンク
   ---------------------------------------------- */
#left-box .link-area
{
	background-color: #FFFFFF;
	margin: 0px 0px 5px 0px;
	padding: 1px 3px 0px 0px;
	text-align: right;
	font-size: 90%;
	float: left;
	width: 147px;
	height: auto;
}

/* -------------------------------------------------------------------------------
	内容を書くボックス
   ------------------------------------------------------------------------------- */

/* ----------------------------------------------
	内容を書くボックス
   ---------------------------------------------- */
#main-box
{
	background-color: #FFFFFF;
	text-align: left;
	margin: 5px 0px 0px 0px;
	padding: 5px 5px 5px 7px;
	float: left;
	width: 588px;
	height: auto;
	border: 1px green solid;
/*	border-top: 1px green solid;
	border-right: 1px green solid;
	border-bottom: 1px green solid;*/
}

/* ----------------------------------------------
	ボックスのタイトル
   ---------------------------------------------- */
#main-box .main-box-title
{
	background-color: #A3DF22;
	color: #333333;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 10px;
	float: left;
	width: 567px;
	height: auto;
	border-top: 1px black solid;
}
#main-box .func-title
{
	background-color: #FFFFFF;
	font-size: 120%;
	text-align: left;
	color: #000000;
	margin: 0px 0px 10px 10px;
	float: none;
	width: 567px;
	height: auto;
}

/* ----------------------------------------------
	ボックスのサブタイトル
   ---------------------------------------------- */
#main-box .main-box-subtitle
{
	background-color: #EFF7E2;
	font-size: 95%;
	text-align: left;
	color: #333333;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 10px;
	float: left;
	width: 567px;
	height: auto;
	border-top: 1px black solid;
	clear: both;
}

/* ----------------------------------------------
	メインボックス内のトップ
   ---------------------------------------------- */
#main-box .page-overview
{
	background-color: #FFFFFF;
	font-size: 100%;
	text-align: left;
	color: #000000;
	margin: 0px 0px 10px 10px;
	float: none;
	width: 567px;
	height: auto;
}

/* ----------------------------------------------
	機能のタイトル
   ---------------------------------------------- */

/* ----------------------------------------------
	ボックス内のコメント
   ---------------------------------------------- */
#main-box .func-comment
{
	background-color: #FFFFFF;
	font-size: 90%;
	text-align: left;
	color: #777777;
	margin: 0px 0px 10px 20px;
	float: none;
	width: 557px;
	height: auto;
}

/* ----------------------------------------------
	ボックス内のイメージ
   ---------------------------------------------- */
#main-box .func-image
{
	background-color: #FFFFFF;
	font-size: 90%;
	text-align: left;
	margin: 0px 0px 10px 20px;
	float: none;
	width: 557px;
	height: auto;
}

/* ----------------------------------------------
	ボックス内のトップへ飛ぶジャンプボックス
   ---------------------------------------------- */
#main-box .jump-top
{
	font-size: 90%;
	text-align: right;
	color: #777777;
	margin: 0px 0px 10px 0px;
	float: left;
	width: 100%;
	height: auto;
}

/* -------------------------------------------------------------------------------
	説明ボックス
   ------------------------------------------------------------------------------- */
#main-box .navi-box
{
	font-size: 90%;
	text-align: left;
	color: #777777;
	background-color: #666666;
	margin: 0px 0px 0px 10px;
	padding: 2px 2px 2px 2px;
	float: none;
	width: 557px;
/*	height: 100%;*/
	border: 1px green solid;
}

/* ----------------------------------------------
	説明ボックスの囲い
   ---------------------------------------------- */
#main-box .navi-box-round
{
	color: #777777;
	background-color: #F1F1F1;
	margin: 0px 0px 0px 10px;
	padding: 0px 0px 0px 0px;
	float: left;
	clear: both;
	width: 553px;
	height: auto;
}

/* ----------------------------------------------
	説明ボックスの番号
   ---------------------------------------------- */
#main-box .navi-box-index
{
	font-size: 150%;
	text-align: left;
	font-weight: bold;
	color: #777777;
	background-color: #BBBBBB;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 4px;
	float: left;
	clear: both;
	width: 17px;
	height: 100%;
/*	border-top: 1px green solid;
	border-left: 1px green solid;
	border-bottom: 1px green solid;*/
	border: 1px green solid;
}

/* ----------------------------------------------
	説明ボックスのスクリーンショット
   ---------------------------------------------- */
#main-box .navi-box-screen
{
	font-size: 100%;
	text-align: center;
	color: #666666;
	background-color: #FFFFFF;
	margin: 0px 0px 0px 0px;
	float: left;
	width: 266px;
	height: 100%;
/*	border-top: 1px green solid;
	border-left: 1px green solid;
	border-bottom: 1px green solid;*/
	border: 1px green solid;

}

/* ----------------------------------------------
	説明ボックスの説明
   ---------------------------------------------- */
#main-box .navi-box-info
{
	font-size: 100%;
	text-align: left;
	color: #777777;
	background-color: #DDDDDD;
	margin: 0px 0px 0px 0px;
	padding: 2px 2px 2px 2px;
	float: left;
	width: 256px;
	height: 100%;
	border: 1px green solid;
}


/* ----------------------------------------------
	メインボックス内の機能イメージが入る場所
   ---------------------------------------------- */
#main-box .func-img-box
{
/*	background-color: #A3DF22;*/
	font-size: 90%;
	text-align: right;
	color: #777777;
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 0px 0px;
	float: left;
	width: 128px;
	height: auto;
}

/* ----------------------------------------------
	メインボックス内の機能イメージが入る場所
   ---------------------------------------------- */
#main-box .func-img
{
	font-size: 90%;
	text-align: center;
	color: #777777;
	margin: 0px 0px 0px 0px;
	padding: 1px 1px 1px 1px;
	float: left;
	width: 128px;
	height: 96px;
	border: 1px black solid;

}

/* ----------------------------------------------
	メインボックス内の機能情報
   ---------------------------------------------- */
#main-box .func-info
{
	font-size: 98%;
	text-align: left;
	color: #666666;
	margin: 0px 0px 0px 5px;
	padding: 5px 1px 1px 5px;
	float: left;
	width: 431px;
	height: 100%;
/*	border: 1px black solid;*/

}


/* -------------------------------------------------------------------------------
	フッター
   ------------------------------------------------------------------------------- */

/* ----------------------------------------------
	フッター
   ---------------------------------------------- */
#footer
{
	background-color: #EEEEEE;
	margin: 0px 0px 5px 0px;
	float: left;
	width: 752px;
	height: auto;
}

/* ----------------------------------------------
	お支払いボックス
   ---------------------------------------------- */
div.pay-box
{
	text-align: left;
	margin: 0px 0px 10px 0px;
	padding: 2px 2px 2px 2px;
	float: none;
	width: 553px;
	height: 48px;
	border: 1px orange solid;
}

/* ----------------------------------------------
	お支払いボックスイメージ
   ---------------------------------------------- */
div.pay-box-img-box
{
	font-size: 100%;
	text-align: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	float: left;
	width: 90px;
	height: 48px;
	border-right: 1px orange solid;
}

/* ----------------------------------------------
	お支払いボックスイメージ
   ---------------------------------------------- */
div.pay-box-img
{
	font-size: 100%;
	text-align: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	float: left;
	width: 90px;
	height: 32px;
}

/* ----------------------------------------------
	お支払いボックスイメージ
   ---------------------------------------------- */
div.pay-box-img-title
{
	font-size: 92%;
	text-align: center;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	clear: both;
	float: none;
	width: 90px;
	height: 16px;
}

/* ----------------------------------------------
	お支払いボックスイメージ
   ---------------------------------------------- */
div.pay-box-name
{
	text-align: left;
	font-size: 120%;
	margin: 0px 0px 0px 3px;
	padding: 0px 0px 0px 0px;
	float: left;
	width: 458px;
	height: 24px;
}

/* ----------------------------------------------
	お支払いボックスイメージ
   ---------------------------------------------- */
div.pay-box-price
{
	text-align: left;
	font-weight: bold;
	font-size: 120%;
	margin: 0px 0px 0px 3px;
	padding: 0px 0px 0px 0px;
	float: left;
	width: 458px;
	height: 24px;
}

