@charset "shift-jis";
* { margin:0; padding:0;}
body { color:#333; background:#fff; font-family: Helvetica; margin: 0; padding: 0; -webkit-user-select: none; -webkit-text-size-adjust: none; }
img { border:0; }
a { color: #324f85; text-decoration:none; }
input[type="submit"] {font: 15px Helvetica; color: #555555; border: 1px solid #444444; display: inline-block; padding: 2px 12px; margin: 5px; -webkit-border-radius: 20px; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#CCCCCC))}
input,select {font-size: 15px; margin: 5px; color: #555555}
input[type="text"],input[type="password"] {font-size: 20px; margin: 5px; color: #555555}

ul + p, ul.data + p + p, ul.form + p + p { color:#4c566c; font: 14px Helvetica; text-align: center; text-shadow: white 0 1px 0; margin: 0 10px 17px 0; }

div#logo { display:block; width:100%; padding: 0; margin:0; text-align:center; }
div#header { display:block; width:100%; padding: 0; margin:0; min-height: 44px; text-align:center; -webkit-box-sizing: border-box; }


h1 {color: #fff; font: bold 15px/30px Helvetica; vertical-align:central; min-height:35px; background: -webkit-gradient(linear, 0% 0%, 0% 54%, from(#ADBBCC), to(#6D85A3), color-stop(.9,#7A90AB)); text-shadow: #2D3642 0 -1px 0; background-color:#06C;}

h4 {text-align: center; color:#fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EDEDED), color-stop(3%,#CCC), color-stop(51%,#959593), color-stop(51%,#848481), color-stop(100%,#666)); border-top: 1px solid #999; text-shadow: #666 0 1px 0; margin: 0; padding: 2px 10px; background-color:#06C;}

h4.news {text-align: center; color:#fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#CBE1EF), color-stop(50%,#abd3ee), color-stop(51%,#89c3eb), color-stop(100%,#D4E3F7)); border-top: 1px solid #ccc; text-shadow: #666 0 1px 0; margin: 0; padding: 2px 10px;}

div#header a { color: #FFF; background: none; font: bold 12px/30px Helvetica; border-width: 0 5px; margin: 0; padding: 0 3px; width: auto; height: 30px; text-shadow: #2e3744 0 -1px 0; text-overflow: ellipsis; text-decoration: none; white-space: nowrap; position: absolute; overflow: hidden; top: 7px; right: 6px; -webkit-border-image: url(../images/toolButton.png) 0 5 0 5; }
div#header #backButton { left: 6px; right: auto; padding: 0; max-width: 55px; border-width: 0 8px 0 14px; -webkit-border-image: url(../images/backButton.png) 0 8 0 14; }


/***** section (base) ******/
div.data { background: #fff; border: 1px solid #B4B4B4; font: bold 15px Helvetica; text-align:center; padding: 10px; margin: 15px 10px 17px 0; -webkit-border-radius: 8px; }
div.data a { color: #324f85; text-decoration:none; }

/***** List (base) ******/
ul { color: black; background: #fff; border: 1px solid #B4B4B4; font: bold 14px Helvetica; padding: 0; margin: 5px 10px 5px 0; -webkit-border-radius: 8px; }
ul li { color: #666; border-top: 1px solid #B4B4B4; list-style-type: none; padding: 10px 10px 10px 10px; }
ul li p { font:14px Helvetica; font-weight:normal; color:#4c566c; margin:0; line-height:1.6; }

li:first-child { border-top: 0; -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; }
li:last-child { -webkit-border-bottom-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; }

/* universal arrows */
ul li.arrow { background-image: url(../images/chevron.png); background-position: right center; background-repeat: no-repeat; }

/* bg blue */
ul.news { background:#f7f9fa; }

/*  li 一覧を見る */
li.round a { display:block; background:#CFE8F5; border-top: 0; -webkit-border-radius: 6px; text-align:center; margin:1px 0;text-shadow: #aaa 0 1px 0; }

/* universal links on list */
ul li a, li.img a + a { color: #000; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; padding: 12px 10px 12px 10px; margin: -10px; -webkit-tap-highlight-color:rgba(0,0,0,0); }
ul li.img a + a { margin: -10px 10px -20px -5px; font-size: 15px; font-weight: bold; }
ul li.img a + a + a { font-size: 14px; font-weight: normal; margin-left: -10px; margin-bottom: -10px; margin-top: 0; }
ul li.img a + small + a { margin-left: -5px; }
ul li.img a + small + a + a { margin-left: -10px; margin-top: -20px; margin-bottom: -10px; font-size: 14px; font-weight: normal; }
ul li.img a + small + a + a + a { margin-left: 0px !important; margin-bottom: 0; }
ul li a + a { color: #000; font: 14px Helvetica; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; margin: 0; padding: 0; }
ul li a + a + a, ul li.img a + a + a + a, ul li.img a + small + a + a + a { color: #666; font: 13px Helvetica; margin: 0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; padding: 0; }

/* resize without labels */
ul li.arrow a { width: 95%; }

/* Normal lists  */
body#normal { margin: 0; padding: 0; background-color: #fff; }
body#normal ul { -webkit-border-radius: 0; margin: 0; border-left: 0; border-right: 0; border-top: 0; }
body#normal ul li { font-size: 16px; }
body#normal ul li small { font-size: 16px; line-height: 28px; }
body#normal li { -webkit-border-radius: 0; }
body#normal li em { font-weight: normal; font-style: normal; }
body#normal h4 + ul { border-top: 1px solid #989ea4; border-bottom: 1px solid #989ea4; }
body#normal div.data { margin-left:10px;}

/* option  */
ul.option { background: #eee; border: 1px solid #B4B4B4; padding: 0; margin: 15px 10px 17px 0; -webkit-border-radius: 8px; !important}
ul.option li a { color: #324f85; font:normal 13px Helvetica; list-style-type: none; padding: 10px; line-height:1.8; !important}
ul.option li p { font:13px Helvetica; font-weight:normal; color:#4c566c; margin:0; line-height:1.6; !important}

/***** FORMS *****/

/* fields list */
ul.form { }
ul.form li { padding: 7px 10px; }
ul.form li.center { text-align: center; }
ul.form li.error { border: 2px solid red; }
ul.form li.error + li.error { border-top: 0; }
ul.form li:hover { background: #fff; }
ul li input[type="text"], ul li input[type="password"], ul li textarea, ul li select { color: #777; background: #fff url(../.png); /* this is a hack due the default input shadow that iphones uses on textfields */ 
border: 0; font: normal 17px Helvetica; padding: 0; display: inline-block; margin-left: 0px; width: 100%; -webkit-appearance: textarea; }

ul li textarea { height: 120px; padding: 0; text-indent: -2px; }
ul li select { text-indent: 0px; background: transparent url(../images/chevron.png) no-repeat 103% 3px; -webkit-appearance:textfield; margin-left: -6px; width: 103%; }
ul li input[type="checkbox"], ul li input[type="radio"] { margin: 0; color: #324f85; padding: 10px 10px; }
ul li input[type="checkbox"]:after, ul li input[type="radio"]:after { content: attr(title); font: 17px Helvetica; display: block; width: 246px; margin: -12px 0 0 17px; }

/**** Info  ****/
ul.data li h4 { margin: 10px 0 5px 0; }
ul.data li p { text-align: left; font-size: 14px; line-height: 1.6; font-weight: normal; margin: 0; }
ul.data li p + p { margin-top: 5px; }
ul.data li { background: none; padding: 10px ; color: #222; }
ul.data li a { display: inline; color: #2E3744; text-decoration: underline; white-space:normal; !important}
		
ul li a img.ico, ul li img.ico { margin: 0 0 0 6px; }

/***** button bg *****/
.button { color: #fff; font: bold 20px/46px Helvetica; text-decoration: none; text-align: center; text-shadow: #000 0 1px 0; border-width: 0px 14px 0px 14px; display: block; margin: 3px 0; }
.green { -webkit-border-image: url(../images/greenButton.png) 0 14 0 14; color:#fff; }
.red { -webkit-border-image: url(../images/redButton.png) 0 14 0 14; color:#fff; }
.white { color: #000; text-shadow: #fff 0px 1px 0; -webkit-border-image: url(../images/whiteButton.png) 0 14 0 14; }
.black { -webkit-border-image: url(../images/grayButton.png) 0 14 0 14; color:#fff; }
.lime { -webkit-border-image: url(../images/chat_bubbles_lime_l.png) 10 10 13 19; }
.lemon { -webkit-border-image: url(../images/chat_bubbles_lemon_l.png) 10 10 13 19; background-color:#F9E128;}
.orange { -webkit-border-image: url(../images/chat_bubbles_orange_l.png) 10 10 13 19;  color:#fff;}
.aqua { -webkit-border-image: url(../images/chat_bubbles_aqua_l.png) 10 10 13 19;  color:#fff;}
.purple { -webkit-border-image: url(../images/chat_bubbles_purple_l.png) 10 10 13 19; }
.pink { -webkit-border-image: url(../images/chat_bubbles_pink_l.png) 10 10 13 19; color:#fff; background-color:#E68CBD;}
.graphite { -webkit-border-image: url(../images/chat_bubbles_graphite_l.png) 10 10 13 19; }
.clear { -webkit-border-image: url(../images/chat_bubbles_clear_l.png) 10 10 13 19; }

table.menu {border-collapse: collapse}
table.menu td {padding: 5px; height: 26px; border-collapse: collapse; border: 1px solid #EEEEEE;-webkit-tap-highlight-color:#BBB;}

/***** for mobile classses *****/
body.m {font-size: 20px; line-height: 1.3; font-family: Helvetica}
table.hf td {width: 50%}
table.qt td {width: 25%}
div.p {margin: 0 5px}
table.t {font-size: 20px; line-height: 1.1}
table.t td {padding: 5px}
table.h2 {color: #fff; font: bold 16px/30px Helvetica; background: -webkit-gradient(linear, 0% 0%, 0% 54%, from(#ADBBCC), to(#6D85A3), color-stop(.9,#7A90AB)); text-shadow: #2D3642 0 -1px 0}
table.h3 {color: #fff; font: bold 15px/26px Helvetica; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EDEDED), color-stop(3%,#CCC), color-stop(51%,#959593), color-stop(51%,#848481), color-stop(100%,#666)); text-shadow: #666 0 1px 0}
a.abtn {font: 15px Helvetica; color: #555555; border: 1px solid #444444; display: inline-block; padding: 2px 12px; margin: 5px; -webkit-border-radius: 20px; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#CCCCCC))}
select.w150px {width: 150px;}
input[type="submit"].w70px {width: 70px;}
input[type="submit"].w150px {width: 150px;}
input[type="submit"].w200px {width: 200px;}

.m .tb22 .open-eye,
.m .tb22 .close-eye {
	width: 18px;
	height: 18px;
	padding: 0 0 0 5px;
	cursor: pointer;
	margin-left: 260px;
	margin-top: -27px;
}
.m .tb22 .open-eye {
	content: url("../images/eye_open.svg");
}
.m .tb22 .close-eye {
	content: url("../images/eye_close.svg");
}