/* スマートフォンにあわせた設定 */
body {    
    font:14px/1.231 "ヒラギノ角ゴ Pro W3";
    line-height: 1.4;
}

#wrap {
    padding: 7px;
    overflow: hidden;
}

section, nav {
    margin-bottom: 1em;
}

footer {
	text-align: center;
}

p {
    margin-bottom: 1em;
}

/* clearfix */
.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
}

/* ここから通常のスタイル設定 */
b {
    color: #C32C2E;
    font-weight: bold;
}

h1 {
	text-align: center;
	text-shadow: 1px 1px 3px #000;
	font-size: 15pt;
	color: #3A3AAF;
}

h2 {
	font-size: 12pt;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#1e5799)); /* Chrome,Safari4+ */
	margin:0 0 0 0;
	padding:6px 6px;
	color:#FFF;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	text-shadow:1px 1px 2px #333;
	-webkit-box-shadow:inset 0 0 50px rgba(0,0,0, 0.1);
}

h3 {
	font-weight: bold;
	margin-bottom: 10px;
}


/*各項目の設定*/
#introduction p{
	text-align: center;
	font-style: italic;
}

#about a:before {
	content:url(../img/icon_mail.gif);
}

p.mail-add{
    background: url(../img/icon_mail.gif) no-repeat 0 50%;
    width: 226px;
    padding-left: 20px;
    cursor: pointer;
}

#download {
	text-align: center;
	margin: 3em 1em;
}

#download a{
	text-decoration: none;
}

.caption {
	font-weight: bold;
	float: inherit;
}

.caution {
	font-size: 12px;
}

.backToTop {
	float: right;
	color: #AAA;
	text-decoration: underline;
}


/*各リスト部の設定*/
dl {
	margin: 0 0 15px;
	padding: 0 10px 10px;
	border: 7px #EEEEEE solid;
}

#feature dl dt {
	float: left;
	width: 3em;
	padding: 10px 0;
	font-weight: bold;
	text-indent: 1em;
	line-height: 150%;
	color: #FFAA00
}

#feature dl dd {
	padding: 10px 0 0 3em;
	line-height: 140%;
	border-bottom: 1px #CCCCCC solid;
}

#faq dl dt:before {
	content:url(../img/icon_q.gif);
}

#faq dl dt {
	padding: 5px 0;
	font-weight: bold;
	line-height: 150%;
}

#faq dl dd:before {
	content:url(../img/icon_a.gif);
}

#faq dl dd {
	padding: 5px 0 10px 0;
	line-height: 140%;
	border-bottom: 1px #CCCCCC solid;
}

#faq a {
	font-weight: bold;
}

#manual dl dd {
	padding: 10px 0 0 0;
	line-height: 140%;
	border-bottom: 1px #CCCCCC solid;
}


/*スクリーンショット用*/
.screenshot {
    margin-bottom: 6px;
    margin-right: 3px !important;
    max-height: 190px;
    max-width: 128px !important;
    width: auto;
    border: 1px #777777 solid;
}

.center_img {
	text-align: center;
}


/* globalNavはメニューの表示用 */
.globalNav{
	clear:both;
}

.globalNav ul{
	padding:10px 0;
	list-style:none;
	display:block;
}
.globalNav li{
	margin:0;
    float:none;
	clear:both;
	width:100%;
	text-align:left;
	padding:0;
	border:1px #AAA solid;
	border-bottom:0px;
    background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#FFF),
		to(#EEEEFF));
	-webkit-box-shadow:
		0px 3px 3px rgba(000,000,000,0.1),
		inset 0px 0px 3px rgba(255,255,255,0.7);
    display:block;
}
.globalNav li:last-child{
	border-bottom:1px #AAA solid;
}
.globalNav li>a>img{
	display:none;
}

.globalNav li>a{
	color:#333;
	display:block;
	width:100%;
	height:auto;
	padding:20px 0;
	padding-left:10px;
	text-align:left;
	text-decoration:none;
	font-size:14px;
	font-weight:bold;
	vertical-align:middle;
	text-shadow:
		0px 1px 1px rgba(0,0,255,0.2),
		0px -1px 0px rgba(255,255,255,0.7);
}
.globalNav li>a:after{
	content:url(../img/arrowR.png);
	font-size:18px;
	font-weight:bold;
	padding-right:20px;
	color:#FFF;
	display:table-cell;
	float:right;
	vertical-align:middle;
}




/* toolbarはiPhoneのバーに似せて作るため用 */
.toolbarBox {
  position: relative;
}
.toolbarBox div li {
  position: absolute;
  list-style: none;
}
.toolbarBox div .toolBtn {
  display: block;
  padding: 2px 10px;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #8ea3c0), color-stop(0.5, #5776a2), color-stop(0.5, #49699a), color-stop(1, #4a6b9a));
  border-top-color: #2f363e;
  border-left-color: #435a79;
  border-right-color: #435a79;
  border-bottom-color: #385074;
  border-width: 1px;
  border-style: solid;
  border-radius: 4px;
  color: #fff;
  font-size: 13px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
  text-decoration: none;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}
.toolbarBox div .toolBtnTypeA {
  left: 4px;
  top: 12px;
}
.toolbarBox div .toolBtnTypeB {
  right: 4px;
  top: 12px;
}
.toolbarBox div .toolBtnArr {
  position: relative;
  margin: 0 0 0 2px ;
  padding: 5px 10px 3px;
  color: #fff;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
  z-index: 5;
}
.toolbarBox div .toolBtnArr:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #8ea3c0), color-stop(0.5, #5776a2), color-stop(0.5, #49699a), color-stop(1, #4a6b9a));
  border-top-color: #2f363e;
  border-right-color: #435a79;
  border-bottom-color: #385074;
  border-width: 1px;
  border-style: solid;
  border-radius: 7px;
  border-left: none;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  z-index: -1;
}
/*
.toolbarBox div .toolBtnArr:after {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: 0;
  width: 17px;
  height: 17px;
  -webkit-transform-origin: left top;
  -webkit-transform: rotate(45deg);
  background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #8ea3c0), color-stop(0.5, #5776a2), color-stop(0.5, #49699a), color-stop(1, #4a6b9a));
  border-left-color: #2f363e;
  border-bottom-color: #385074;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px;
  border-right: none;
  border-top: none;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  z-index: -2;
}
*/
.toolbar {
  padding: 10px 0;
  border-top: solid 1px #bec5cf;
  border-bottom: solid 1px #3f4e63;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #acb9c9), color-stop(0.5, #8395af), color-stop(0.5, #7388a5), color-stop(1, #7488a1));
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-shadow: -1px -1px 0 #434b57;
  text-align: center;
}

.toolbar a {
  color: #fff;
  text-decoration:none;
}

.toolbarB {
  padding: 1px 12px;
  border-top: solid 1px #99a7b2;
  border-bottom: solid 1px #999ea4;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #919fa8), color-stop(1, #b7c0c9));
  color: #fff;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}

/* iPhone用アプリダウンロードボタン */
.iphone_btn {
	font-size: 11pt;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#A3A3A3), color-stop(50%,#3B3B3B), color-stop(51%,#242424), color-stop(100%,#000)); /* Chrome,Safari4+ */
	margin:0 0 0 0;
	padding:15px 5px;
	color:#FFF;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	text-shadow:1px 1px 2px #333;
	-webkit-box-shadow:inset 0 0 50px rgba(0,0,0, 0.1);
	text-decoration: none;
}

/* Android用アプリダウンロードボタン */
.android_btn {
	font-size: 11pt;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#99CC00), color-stop(100%,#339900)); /* Chrome,Safari4+ */
	margin:0 0 0 0;
	padding:15px 5px;
	color:#FFF;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	text-shadow:1px 1px 2px #333;
	-webkit-box-shadow:inset 0 0 50px rgba(0,0,0, 0.1);
	text-decoration: none;
}