html {
  background-color: #ecf2fb;
}

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

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


/**
 * iPhoneアプリのタイトルなどで使われています!important;
 * h1要素などに使うとよいでしょう。挿入バーからも利用できます。
 */
.iPhoneHead h1 {
   font-family: HiraKakuProN-W6;
   font-size: 21px;
   color: white;
   text-align: center;     /*  これを取ると左に寄る */
   vertical-align:middle;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   white-space: nowrap;
   text-overflow: ellipsis;
   text-decoration: none;
   height: 36px;
   padding: 12px 4px 0;

   display:block;
   border-top: 1px solid #aaccff;
   background: #8aacdf;
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#375786', endColorstr='#8aafe4'); /* for IE */
   background: -webkit-gradient(linear, left top, left bottom, from(#375786), to(#8aafe4));
   background: -webkit-linear-gradient(top, #375786, #8aafe4);
   background: -moz-linear-gradient(top, #375786, #8aafe4);
   background: -ms-linear-gradient(top, #375786, #8aafe4);
   background: -o-linear-gradient(top, #375786, #8aafe4);

   -webkit-border-radius: 0px;
   -moz-border-radius: 0px;
   border-radius: 0px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;

}




/**
 * アドレス帳などで「A」「B」などのインデックスに使われる見出しです。
 * h2要素などに使うとよいでしょう。挿入バーからも利用できますHiraKakuProN-W6
 */
.iPhoneListTitle {
  height: 25px;
  line-height: 25px;
  padding:5px 5px;
  font-family: ;
  font-size: 10px;
  color: #fff;
  text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0;
  border-top: 1px solid #28597a;        /**トップと次の境目の色*/
  border-bottom: 1px solid #989ea4;

   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#8aafe4', endColorstr='#aacff4'); /* for IE *//* #909faa #b8c1c8 */
   background: -webkit-gradient(linear, left top, left bottom, from(#8aafe4), to(#aacff4));
   background: -webkit-linear-gradient(top, #8aafe4, #aacff4);
   background: -moz-linear-gradient(top, #8aafe4, #aacff4);
   background: -ms-linear-gradient(top, #8aafe4, #aacff4);
   background: -o-linear-gradient(top, #8aafe4, #aacff4);
  background-color: #aacff4;　　　/**次の色*/
  text-align: center;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}