html {
  background-color: #c5ccd3;
}

body {
  -webkit-text-size-adjust: none;
  font-family: HiraKakuProN-W3;
  line-height: 1.25;
}

/**
 * iPhoneらしいグレーの背景を利用するには、このクラスを使います。
 */
.iPhoneBody {
  background-color: #c5ccd3;
}

/**
 * iPhoneアプリのタイトルなどで使われています
 * h1要素などに使うとよいでしょう。挿入バーからも利用できます。
 */
.iPhoneHead {
  height: 45px;
  padding: 8px 3px 0;
  border-top: 1px solid #cdd5df;
  border-bottom: 1px solid #2d3642;
  background-color: #fff;
}
.iPhoneHead h1 {
  font-family: HiraKakuProN-W6;
  font-size: 18px;
		font-weight: bold;
  color: #0000D5;
		padding: 6px 0px; /* （上下、左右） */
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/**
 * アドレス帳などで「A」「B」などのインデックスに使われる見出しです。
 * h2要素などに使うとよいでしょう。挿入バーからも利用できます
 */
.iPhoneListTitle {
  height: 20px;
  line-height: 20px;
  padding: 0px 0px;
  font-family: HiraKakuProN-W6;
  font-size: 14px;
  text-align: center;
  color: #000040;
  border-top: 1px solid #a5b1ba;
  border-bottom: 1px solid #989ea4;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#D7FFFF), to(#B5FFFF));
  background-color: #D7FFFF;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

/**
 * アドレス帳のようなリストや、設定画面などの定義リストを構築できます
 * 文字数に制限があるので気をつけましょう
 */
.iPhoneUL,
.iPhoneDL {
  margin: 9px 9px 16px;
  border: solid 1px #a9abae;
  -webkit-border-radius: 8px;
  background-color: #fff;
}

.iPhoneUL li,
.iPhoneDL dd {
  list-style-type: none;
  height: 43px;
  border-bottom: solid 1px #a9abae;
  line-height: 43px;
}


.iPhoneUL li:last-child,
.iPhoneDL dd:last-child {
  border-bottom: none;
}

.iPhoneUL li {
  padding: 0 10px;
}

.iPhoneULIndex li {
  border-bottom: solid 1px #d9d9d9;
  overflow: hidden;
  background-color: #fff;
}

.iPhoneDL dt {
  font-family: HiraKakuProN-W6;
  width: 70px;
  padding: 12px 5px 0 10px;
  font-size: 14px;
  clear: both;
  width: 6em;
}

.iPhoneDL dd {
  padding: 0 10px 0 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  white-space: nowrap;
  margin-top: -30px;
  text-align: right;
  color: #385387;
}


.iPhoneUL a,
.iPhoneULIndex a,
.iPhoneDL a {
  text-decoration: none;
  color: black;
  -webkit-tap-highlight-color: rgba(2, 109, 236, 0.9);
  display: block;
  padding: 15px 0;
}

a {
  -webkit-tap-highlight-color: rgba(2, 109, 236, 0.9);  // タップ時の反転色
}

/* ボタンスタイル */
.iPhoneButton,
.iPhoneButtonBlack {
  margin: 0 auto;
  width: 300px;

  border: solid 1px #2d3137;
  -webkit-border-radius: 10px;
  box-shadow: 0 1px 2px rgba(0,0,0,.2);
  padding: 2px;
  text-align: center;
}
.iPhoneButton {
  background: -webkit-gradient(linear, left top, left bottom, from(#FF7533), to(#CE4300));
  background-color: #FF7533;
}
.iPhoneButtonBlack {
  background: -webkit-gradient(linear, left top, left bottom, from(#6b6e74), to(#282e37));
  background: #282e37;
}
.iPhoneButton a,
.iPhoneButtonBlack a {
  -webkit-border-radius: 5px;
  display: inline-block;
  text-align: center;
  padding: .5em 0;
  text-decoration: none;
  font-weight: bold;
  width: 300px;
}
.iPhoneButton a {
  color: #fff;
		text-shadow: -1px -1px 0 rgba(150, 150, 150, 0.3);

}
.iPhoneButtonBlack a {
  color: #fff;
}

/*
戻るボタン
*/
.btnBack {
  padding-right: 5px;
  height: 31px;
  float: left;
  margin-right: 5px;
}
.btnBackInner {
  background: url(images/bg_button_back.png) left center no-repeat;
  height: 28px;
  padding-left: 17px;
  padding-top: 3px;
}
.btnBack a {
  color: #fff;
  font-size: 80%;
  text-decoration: none;
  text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0;
}


/* ========メインメニュー======== */


/* --- ナビゲーションバー --- */
div.nav01 {
width: 100%; /* ナビゲーションの幅 */
background-color: #C40000;
background: -webkit-gradient(linear, left top, left bottom, from(#F00000), to(#8C0000));/* グラデーション */
font-size: 14px;
}

/* --- メニューエリア --- */
div.nav01 ul.nl {
width: 320px; /* メニューの幅 */
margin: 0 auto; /* センターに配置 */
padding: 0;
background-color: #C40000;
background: -webkit-gradient(linear, left top, left bottom, from(#F00000), to(#8C0000));/* グラデーション */
border-right: 1px #fff solid; /* メニューの右境界線 */
list-style-type: none;
text-align: center;
font-weight: bold;
text-shadow: -1px -1px 0 rgba(150, 150, 150, 0.3);

}

/* --- メニュー項目 --- */
div.nav01 ul.nl li {
width: 33%; /* 項目の幅 */
float: left;
}

/* --- リンク --- */
div.nav01 ul.nl li a {
display: block;
width: 99px;
padding: 8px 2px; /* リンクエリアのパディング（上下、左右） */
position: relative; /* IE6用 */
border-left: 1px #fff solid; /* リンクエリアの左境界線 */
text-decoration: none; /* テキストの下線（なし） */
color: #fff;
}
/* --- ポイント時の設定 --- */
div.nav ul.nl li a:hover {
background-color: #f0ffff; /* ポイント時の背景色 */
text-decoration: underline; /* テキストの下線（あり） */
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}


/* ========その他ＣＳＳ======== */

/* --- リストエリア --- */
ul.list {
margin: 0;
padding: 0 0 15px 0px;
list-style-type: none;
}

/* --- リスト項目 --- */
ul.list li {
padding: 0 0 5px 18px; /* 項目のパディング（上右下左） */
background: url(images/disc.gif) no-repeat 5px 0.4em; /* マーカー画像 */
font-size:0.88em;
line-height: 130%;
}


.fun-button{ float:right; vertical-align:middle; }

hr { display:none; overflow:hidden; line-height:0; }

div#pan-url       { width:650px; display:block; overflow:hidden; margin:12px auto 0; }
div#pan-list      { float:left; margin:3px 0; }
div#pan-list  ul  { margin:0; padding:0; font-size:13px; }
div#pan-list  li  { 	display:inline; line-height:120%; list-style-type:none; }
div#pan-list  li a{ 	padding-right:10px; background:url(images/topicpath.gif) no-repeat right; }

.strong{ font-weight:bold; }
.white  { color : #ffffff ; }
.black  { color : #000000 ; }
.blue   { color : #000094 ; }
.green  { color : #008000 ; }
.red    { color : #FF0F0F; }	 

.text10 {font-size: 10px; line-height : 150% ; }
.text10w {font-size: 10px; line-height : 150% ; }
.text12 {font-size: 12px; line-height : 150% ; }
.text12w {font-size: 12px; line-height : 160% ; }
.text14 {font-size: 14px; line-height : 150% ; }
.text14w {font-size: 14px; line-height : 200% ; }
.text16 {font-size: 16px; line-height : 150% ; }
.text18 {font-size: 18px; line-height : 150% ; }
.text20 {font-size: 20px; line-height : 150% ; }
.text26 {font-size: 26px; line-height : 150% ; }
.text30 {font-size: 30px; line-height : 150% ; }

.float-left  { float:left; }
.float-center{ float:center; }
.float-right { float:right; }
.align-center { text-align:center; }
.align-right  { text-align:right; margin-right:10px ; }


.padding-6px{ padding:6px; }
.padding6   { padding:6px; }
.padding12  { padding:12px; }
.padding16  { padding:16px; }
.padding20  { padding:20px; }
.padding30  { padding:30px; }
.padding-b6 { padding-bottom:6px; }
.padding-b12{ padding-bottom:12px; }
.padding-b20{ padding-bottom:20px; }
.padding-b30{ padding-bottom:30px; }
.padding-t6 { padding-top:6px; }
.padding-t12{ padding-top:12px; }
.padding-t20{ padding-top:20px; }
.padding-t30{ padding-top:30px; }
.margin6   { margin:6px; }
.margin12  { margin:12px; }
.margin20  { margin:20px; }
.margin30  { margin:30px; }
.margin-b6 { margin-bottom:6px; }
.margin-b12{ margin-bottom:12px; }
.margin-b20{ margin-bottom:20px; }
.margin-b30{ margin-bottom:30px; }
.margin-t6 { margin-top:6px; }
.margin-t12{ margin-top:12px; }
.margin-t20{ margin-top:20px; }
.margin-t30{ margin-top:30px; }