/* body */
body {
	background-color : #fff;
	color : #333;
	font-family : 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', verdana, 'ＭＳ Ｐゴシック', 'MS P Gothic', sans-serif, Tahoma, Arial;
}

/* a */
a { color : #333; text-decoration : none; }
a:hover   { color : #333; text-decoration : underline; }
a:link{ color : #333; }
a:visited { color : #333; }

/* align */
.al { text-align : left; }
.ac { text-align : center; }
.ar { text-align : right; }
.vt { vertical-align : top; }
.vm { vertical-align : middle; }
.vb { vertical-align : bottom; }

/* font-size */
.fs10 { font-size : 10px; }
.fs12 { font-size : 12px; }
.fs14 { font-size : 14px; }
.fs16 { font-size : 16px; }
.fs20 { font-size : 20px; }
.bld  { font-weight : bold; }

h3 {
	font-size : 100%;
	font-weight : normal;
}

/* color */
/** fc_bl */
.fc_bl {
	color: #00F;
}
/** fc_g6 */
.fc_g6 {
	color: #666;
}

/* #e9bc00 */
/* #f0d35b */
/* #f0f3ab */

/* padding */
.p2, .p2 td, .p2 th { padding : 2px; }
.p5, .p5 td, .p5 th { padding : 5px; }
/* margin */
.m2  { margin :  2px; }
.m5  { margin :  5px; }
.m0a { margin : 0 auto; }
.m1a { margin : 1em auto; }
.m1em{ margin : 1em; }
.ml2p { margin-left : 1.5%; }

/* float */
.fl { float : left; }
.fr { float : right; }
.cb { clear : both; }

/* width */
.w015 { width :  15px; }
.w020 { width :  20px; }
.w050 { width :  50px; }
.w200 { width : 200px; }
.w300 { width : 300px; }
.w10p { width :  10%; }
.w20p { width :  20%; }
.w30p { width :  30%; }
.w40p { width :  40%; }
.w90p { width :  90%; }
.w1hp { width : 100%; }

/* height */
.h050 { height :  50px; }
.h080 { height :  80px; }
.h150 { height : 150px; }

.wsnw {
	white-space : nowrap;
}

tr.nw td, tr.nw th {
	white-space : nowrap;
}

/* display */
.dis_b { display : block; }

/* div */
/** wrap **/
div#wrap {
	margin : 0 auto;
	width : 100%;
	max-width : 320px;
	border : 0px;
	text-align : center;
	/**
	border : 1px solid #000;
	*/
}
/** footer **/
div#footer {
	clear : both;
	text-align : center;
}

/* waiting */
/** h1.waiting */
h1.waiting {
	background-color : #e9bc00;
	font-size : 120%;
	font-weight : bold;
	padding : 10px 0;
	width : 100%;
	margin : 0.5em auto;
	border-radius : 10px;
}

/** h2.waiting */
h2.waiting {
	background-color : #f0d35b;
	font-size : 100%;
	font-weight : normal;
	padding : 5px 0;
	margin : 0 auto;
	width : 100%;
	border-radius : 5px;
}

/** p.disp */
p.disp {
	text-align : center;
	font-size : 150%;
	margin : 0.5em;
}

/** hr.waiting */
hr.waiting {
	border : 0;
	border-bottom : 2px #e9bc00 solid;
	width : 100%;
	margin : 0.5em auto;
}

/* admin */
/** adm_h1 */
#adm_h1 {
	margin : 0;
	padding : 0;
	font-size : 150%;
	font-weight : bold;
	float : left;
	margin-right : 0.5em;
}
/** adm_h2 */
#adm_h2 {
	margin : 0;
	padding : 0;
	font-size : 150%;
	font-weight : normal;
	float : left;
	margin-right : 0.5em;
}
/** adm_h3 */
#adm_h3 {
	margin : 0;
	padding : 0;
	font-size : 150%;
	font-weight : normal;
	float : left;
	margin-right : 0.5em;
}
/** adm_header */
#adm_header {
	width : 100%;
	max-width : 960px;
	text-align : center;
	margin : 0.5em auto;
	border-bottom : 2px solid #e9bc00;
}

/** adm_cont */
#adm_cont {
	width : 100%;
	max-width : 960px;
	text-align : center;
	margin : 0 auto;
}

/** adm_footer */
#adm_footer {
	width : 100%;
	max-width : 960px;
	text-align : center;
	margin : 0.5em auto;
	border-top : 2px solid #e9bc00;
}

/** adm_view */
.adm_view {
	width : 32%;
	border : 1px solid #e9bc00;
	margin-bottom : 5px;
	border-radius : 5px;
}

.adm_view h3, .adm_cmd h3 {
	background-color : #e9bc00;
	color : #fff;
	font-size : 100%;
	font-weight : normal;
	padding : 0.5em 0;
	margin : 0;
}

.adm_view p.adm_disp {
	padding : 0;
	margin : 1em;
	font-size : 200%;
}

.adm_view p.adm_msg {
	padding : 0;
	margin : 0.5em;
	font-size : 150%;
}

/** adm_cmd */
div.adm_cmd {
	width : 100%;
	border : 1px solid #e9bc00;
	border-radius : 5px;
	background-color : #f0f3ab;
	margin-bottom : 0.5em;
}

/** adm_login */
.adm_login {
	width : 100%;
	max-width : 320px;
	border : 1px solid #e9bc00;
	margin : 1em auto;
	border-radius : 5px;
	padding : 0;
}

.adm_login h3 {
	background-color : #e9bc00;
	color : #fff;
	font-size : 100%;
	font-weight : normal;
	padding : 0.5em 0;
	margin : 0;
}

/** adm_of */
div.adm_of {
	width : 100%;
	height : 1.4em;
	overflow : hidden;
}

/** cmd_list */
ul.cmd_list {
	margin : 0;
	padding : 0;
	list-style : none;
}

ul.cmd_list li {
	margin : 1.5%;
	padding : 0;
	width : 30%;
	float : left;
}

ul.cmd_list4 {
	margin : 0;
	padding : 0;
	list-style : none;
}

ul.cmd_list4 li {
	margin : 1.5%;
	padding : 0;
	width : 22%;
	float : left;
}

/** treat_txt */
.treat_txt {
	width : 300px;
	font-size : 20px;
}

/** sel */
.sel {
	position : relative;
	overflow : hidden;
	white-space : nowrap;
	/**
	text-overflow: ellipsis;
*/
}

/**
.sel input {
	display : inline-block;
}
*/

.sel input:checked + label {
	background : #f0d35b;
}

.sel label {
	width : 100%;
/**
	overflow : hidden;
	white-space : nowrap;
	text-overflow: ellipsis;
*/
}

/** treat_crs */
ul.treat_crs {
	width : 100%;
	margin : 0 auto;
	padding : 0;
}

ul.treat_crs:after {
	clear : both;
	display: table;
	content: " ";
	margin-bottom : 1em;
}

ul.treat_crs li {
	width : 31%;
	float : left;
	list-style : none;
	text-align : left;
	display : block;
	padding : 0;
	margin : 0.5em;
	border : 1px solid #ddd;
	border-radius : 5px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fff), color-stop(1, #ccc));
	background:-moz-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-webkit-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-o-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-ms-linear-gradient(top, #fff 5%, #ccc 100%);
	background:linear-gradient(to bottom, #fff 5%, #ccc 100%);
}

ul.treat_crs li:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ccc), color-stop(1, #fff));
	background:-moz-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-webkit-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-o-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-ms-linear-gradient(top, #ccc 5%, #fff 100%);
	background:linear-gradient(to bottom, #ccc 5%, #fff 100%);
}

ul.treat_crs li input {
	display : none;
}

ul.treat_crs li label {
	display : block;
	white-space : nowrap;
	overflow : hidden;
	text-overflow: ellipsis;
	padding : 4px 0.5em;
	height : 2em;
	line-height : 2em;
}

ul.treat_crs li input:checked + label {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffb), color-stop(1, #db0));
	background:-moz-linear-gradient(top, #ffb 5%, #db0 100%);
	background:-webkit-linear-gradient(top, #ffb 5%, #db0 100%);
	background:-o-linear-gradient(top, #ffb 5%, #db0 100%);
	background:-ms-linear-gradient(top, #ffb 5%, #db0 100%);
	background:linear-gradient(to bottom, #ffb 5%, #db0 100%);
	border-radius : 5px;
}

/** treat_staff */
.treat_staff input{
	display: none;
}

.treat_staff label{
	display: block;
	float: left;
	cursor: pointer;
	margin: 0;
	padding: 1em 1em;
	border-right: 1px solid #abb2b7;
	background: #ccc;
	text-align: center;
	line-height: 1;
	white-space : nowrap;
	transition: .2s;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fff), color-stop(1, #ccc));
	background:-moz-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-webkit-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-o-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-ms-linear-gradient(top, #fff 5%, #ccc 100%);
	background:linear-gradient(to bottom, #fff 5%, #ccc 100%);
}

.treat_staff label:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ccc), color-stop(1, #fff));
	background:-moz-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-webkit-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-o-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-ms-linear-gradient(top, #ccc 5%, #fff 100%);
	background:linear-gradient(to bottom, #ccc 5%, #fff 100%);
}

.treat_staff label:first-of-type{
	border-radius: 3px 0 0 3px;
}

.treat_staff label:last-of-type{
	border-right: 0px;
	border-radius: 0 3px 3px 0;
}

.treat_staff input[type="radio"]:checked + label {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffb), color-stop(1, #db0));
	background:-moz-linear-gradient(top, #ffb 5%, #db0 100%);
	background:-webkit-linear-gradient(top, #ffb 5%, #db0 100%);
	background:-o-linear-gradient(top, #ffb 5%, #db0 100%);
	background:-ms-linear-gradient(top, #ffb 5%, #db0 100%);
	background:linear-gradient(to bottom, #ffb 5%, #db0 100%);
}

/* table */
table {
	border-collapse : collapse;
	empty-cells : show;
	margin : 0 auto;
}
/** th */
th {
	font-weight : normal;
	text-align : center;
}

/** table.b1 */
table.b1 {
	border-top : 1px solid #555;
	border-left : 1px solid #555;
}
table.b1 th, table.b1 td {
	border-right : 1px solid #555;
	border-bottom : 1px solid #555;
}

/** table.adm */
table.adm {
	border-top : 1px solid #e9bc00;
	border-left : 1px solid #e9bc00;
	margin-bottom : 1em;
}

table.adm th {
	border-right : 1px solid #fff;
	border-bottom : 1px solid #fff;
	padding : 5px;
	background-color : #e9bc00;
	color : #fff;
}

table.adm td {
	border-right : 1px solid #e9bc00;
	border-bottom : 1px solid #e9bc00;
	padding : 5px;
}

/* img_logo */
#img_logo {
	width : 90%;
	margin : 0.5em auto;
}

/** odd */
.odd {
	background : #fff;
	
}
/** evn */
.evn {
	background : #f0f3ab;
}

/** ime */
.ioff {
	ime-mode : disabled;
}

/* copyright */
#copyright {
	padding : 0.5em 0 1em;
	text-align : center;
	font-family : "Verdana", "Helvetica";
	font-size : 10px;
}

/** alert_msg */
#alert_msg {
	display : none;
}
/** now_mode */
#now_mode {
	display : none;
}

/* adm_btn */
a.adm_btn {
	width : 100%;
	-moz-box-shadow:inset 0px 1px 0px 0px #fff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fff;
	box-shadow:inset 0px 1px 0px 0px #fff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fff), color-stop(1, #ccc));
	background:-moz-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-webkit-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-o-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-ms-linear-gradient(top, #fff 5%, #ccc 100%);
	background:linear-gradient(to bottom, #fff 5%, #ccc 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#ccc',GradientType=0);
	background-color:#fff;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	border:1px solid #ddd;
	display:inline-block;
	cursor:pointer;
	color:#333;
	font-size:16px;
	padding:20px 0;
	text-decoration:none;
	text-shadow:0px 1px 0px #fff;
}

a.adm_btn:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ccc), color-stop(1, #fff));
	background:-moz-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-webkit-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-o-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-ms-linear-gradient(top, #ccc 5%, #fff 100%);
	background:linear-gradient(to bottom, #ccc 5%, #fff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ccc', endColorstr='#fff',GradientType=0);
	background-color:#ccc;
	text-decoration:none;
}

a.adm_btn:active {
	position:relative;
	top:1px;
}

/* cmd_btn */
a.cmd_btn {
	width : 100%;
	-moz-box-shadow:inset 0px 1px 0px 0px #f5978e;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f5978e;
	box-shadow:inset 0px 1px 0px 0px #f5978e;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24537), color-stop(1, #c62d1f));
	background:-moz-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:-webkit-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:-o-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:-ms-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:linear-gradient(to bottom, #f24537 5%, #c62d1f 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#c62d1f',GradientType=0);
	background-color:#f24537;
	-moz-border-radius:30px;
	-webkit-border-radius:30px;
	border-radius:30px;
	border:1px solid #d02718;
	display:inline-block;
	cursor:pointer;
	color:#fff;
	font-size:20px;
	padding:20px 0;
	text-decoration:none;
	text-shadow:0px 1px 0px #810e05;
}

a.cmd_btn:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c62d1f), color-stop(1, #f24537));
	background:-moz-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:-webkit-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:-o-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:-ms-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:linear-gradient(to bottom, #c62d1f 5%, #f24537 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', endColorstr='#f24537',GradientType=0);
	background-color:#c62d1f;
}

a.cmd_button:active {
	position:relative;
	top:1px;
}

a.cmd_btn_disabled {
	width : 100%;
	-moz-box-shadow:inset 0px 1px 0px 0px #fff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fff;
	box-shadow:inset 0px 1px 0px 0px #fff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fff), color-stop(1, #ccc));
	background:-moz-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-webkit-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-o-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-ms-linear-gradient(top, #fff 5%, #ccc 100%);
	background:linear-gradient(to bottom, #fff 5%, #ccc 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#ccc',GradientType=0);
	background-color:#fff;
	-moz-border-radius:30px;
	-webkit-border-radius:30px;
	border-radius:30px;
	border:1px solid #ddd;
	display:inline-block;
	cursor:not-allowed;
	color:#bbb;
	font-size:20px;
	padding:20px 0;
	text-decoration:none;
	text-shadow:0px 1px 0px #fff;
}

/* input.btn */
input.btn {
	padding : 1em;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fff), color-stop(1, #ccc));
	background:-moz-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-webkit-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-o-linear-gradient(top, #fff 5%, #ccc 100%);
	background:-ms-linear-gradient(top, #fff 5%, #ccc 100%);
	background:linear-gradient(to bottom, #fff 5%, #ccc 100%);
	border : 1px solid #ddd;
	border-radius : 5px;
}

input.btn:hover {
	padding : 1em;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ccc), color-stop(1, #fff));
	background:-moz-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-webkit-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-o-linear-gradient(top, #ccc 5%, #fff 100%);
	background:-ms-linear-gradient(top, #ccc 5%, #fff 100%);
	background:linear-gradient(to bottom, #ccc 5%, #fff 100%);
	border : 1px solid #ddd;
	border-radius : 5px;
}

/* color btn */
.gr_btn {
	background: -moz-linear-gradient(top, #cfc, #9f9);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #cfc), color-stop(1, #9f9));
	background:-ms-linear-gradient(top, #cfc 0%, #9f9 100%);
	color: #393;
	text-shadow: 0 -1px #fff;
	padding: 10px 20px;
	border: 1px solid #999;
	border-radius : 10px;
	font-weight : bold;
	cursor:pointer;
}

.bl_btn {
	background: -moz-linear-gradient(top, #cff, #9cf);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #cff), color-stop(1, #9cf));
	background:-ms-linear-gradient(top, #cff 0%, #9cf 100%);
	color: #339;
	text-shadow: 0 -1px #fff;
	padding: 10px 20px;
	border: 1px solid #999;
	border-radius : 10px;
	font-weight : bold;
	cursor:pointer;
}

.re_btn {
	background: -moz-linear-gradient(top, #fcc, #f99);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fcc), color-stop(1, #f99));
	background:-ms-linear-gradient(top, #fcc 0%, #f99 100%);
	color: #933;
	text-shadow: 0 -1px #fff;
	padding: 10px 20px;
	border: 1px solid #999;
	border-radius : 10px;
	font-weight : bold;
	cursor:pointer;
}

input[disabled] {
	cursor:not-allowed;
}

/* step_bar */
/** html
<div id="step_bar_box">
<ul class="step_bar">
<li>Step 1</li>
<li class="current">Step 2</li>
<li>Step 3</li>
</ul></div> 
*/

#step_bar_box {
	text-align: center;
	overflow: hidden;
	margin-bottom: 30px;
}

.step_bar {
	list-style: none;
	white-space : nowrap;
	margin : 0 auto;
	padding : 0;
	width : 100%;
	max-width : 480px;
}

.step_bar li {
	line-height: 46px;
	color: #a6a6a6;
	text-decoration: none;
	padding: 0 20px;
	background: #eee;
	display: inline-block;
	width : 33%;
	box-sizing: border-box;
}

.step_bar li small {
	font-size: 80%;
}

.step_bar li::after {
	position: relative;
	display: block;
	margin-top: -25px;
	margin-left: auto;
	margin-right: -25px;
	height: 22px;
	width: 20px;
	content: " ";
	-webkit-transform: skew(-30deg);
	-moz-transform: skew(-30deg);
	-ms-transform: skew(-30deg);
	-o-transform: skew(-30deg);
	transform: skew(-30deg);
	background: #eee;
	border-right: 1px solid white;
}

.step_bar li::before {
	float: right;
	display: block;
	margin-bottom: -25px;
	margin-left: auto;
	margin-right: -25px;
	height: 21px;
	width: 20px;
	content: " ";
	-webkit-transform: skew(30deg);
	-moz-transform: skew(30deg);
	-ms-transform: skew(30deg);
	-o-transform: skew(30deg);
	transform: skew(30deg);
	background: #eee;
	border-right: 1px solid white;
}

.step_bar li:first-child {
	padding-left: 10px;
	-webkit-border-radius: 5px 0 0 5px;
	-moz-border-radius: 5px 0 0 5px;
	-ms-border-radius: 5px 0 0 5px;
	-o-border-radius: 5px 0 0 5px;
	border-radius: 5px 0 0 5px;
}

.step_bar li:last-child {
	padding-left: 20px;
	padding-right: 10px;
	-webkit-border-radius: 0 5px 5px 0;
	-moz-border-radius: 0 5px 5px 0;
	-ms-border-radius: 0 5px 5px 0;
	-o-border-radius: 0 5px 5px 0;
	border-radius: 0 5px 5px 0;
}

.step_bar li:last-child::before {
	border: 0;
	background: transparent !important;
}

.step_bar li:last-child::after {
	border: 0;
	background: transparent !important;
}

.step_bar li.current {
/**	background: #F97C78; */
	background : #e9bc00;
	color: #fff;
}

.step_bar li.current::before {
/**	background: #F97C78; */
	background : #e9bc00;
}

.step_bar li.current::after {
/**	background: #F97C78; */
	background : #e9bc00;
}

.step_bar li.current:last-child {
	margin-right: 0;
}

.step_bar li.current:last-child::before {
	border: 0;
	background: transparent !important;
}

.step_bar li.current:last-child::after {
	border: 0;
	background: transparent !important;
}

/* radios */
/** html
<ul class="radios">
	<li>
		<input type="radio" name="radio1" value="on" id="radio1-1" checked="checked" />
		<label for="radio1-1">ON</label>
	</li>
	<li>
		<input type="radio" name="radio1" value="off" id="radio1-2" />
		<label for="radio1-2">OFF</label>
	</li>
</ul>
*/

.radios {
	display:inline-block;
	margin:0;
	padding:0;
	clear:both;
}
.radios li {
	display:inline-block;
	position:relative;
	float:left;
	list-style:none;
	border:solid 1px #ddd;
	border-right:none;
	overflow:hidden;
}
.radios li:first-child {
	border-radius:5px 0 0 5px;
}
.radios li:last-child {
	border-right:solid 1px #ddd;
	border-radius:0 5px 5px 0;
}
.radios label {
	display:block;
	min-width:3em;
	text-align:center;
	background:#eee;
	background:-webkit-gradient(linear, left top, left bottom, from(#FFF),to(#EEE));
	background:-moz-linear-gradient(top, #fff, #eee);
	border:solid 1px rgba(255,255,255,0.2);
	padding:5px;
	text-shadow:0 1px 0 rgba(255,255,255,0.5);
	color : #ccc;
}
.radios li:first-child label {
	border-radius:3px 0 0 3px;
}
.radios li:last-child label {
	border-radius:0 3px 3px 0;
}
.radios input[type=radio] {
	position:absolute;
	opacity:0;
	width:100%;
	height:100%;
	margin:0;
	cursor:pointer;
}
.radios input[type=radio]:checked {
	cursor:auto;
}
.radios input[type=radio]:checked + label {
	color:#fff;
	text-shadow:0 -1px 0 rgba(0,0,0,0.2);
	border:solid 1px rgba(0,0,0,0.1);
	background:#e9bc00;
	background:-webkit-gradient(linear, left top, left bottom, from(#f0d35b),to(#e9bc00));
	background:-moz-linear-gradient(top, #f0d35b, #e9bc00);
}

/* ColorRadio */
/** html
<ul class="ColorRadio">
	<li><input type="radio" name="sex" id="bl" /><label for="male">男性</label></li>
	<li><input type="radio" name="sex" id="re" /><label for="female">女性</label></li>
</ul>
<ul class="ColorRadio">
	<li><input type="radio" name="age" id="0" /><label for="0">0〜19</label></li>
	<li><input type="radio" name="age" id="20" /><label for="20">20〜59</label></li>
	<li><input type="radio" name="age" id="60" /><label for="60">60〜</label></li>
</ul>
*/

ul.ColorRadio {
	white-space: nowrap;
	margin : 0.5em auto;
}
ul.ColorRadio li {
/**
	left: -50px;
	top: 10px;
*/
	position: relative;
	list-style: none;
	float: left;
}

/** 選択項目の基本的なデザイン */
ul.ColorRadio label {
	background: -moz-linear-gradient(top, #fff, #ccc);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #ccc));
	padding: 10px 20px;
	border: 1px solid #999;
	border-radius: 0 0px 0px 0;
	-moz-box-shadow: 0 0 5px #ccc;
	-webkit-box-shadow: 0 0 5px #ccc;
	color: #aaa;
	font-weight: bold;
	text-shadow: 0 1px #fff;
	text-align: center;
}

/** フォームの左端の角を丸くする */
ul.ColorRadio li:first-child label {  
	border-radius: 10px 0 0 10px;  
}

/** フォームの右端の角を丸くする */
ul.ColorRadio li:last-child label {  
	border-radius: 0 10px 10px 0;  
}

ul.ColorRadio li input[type="radio"] {
	opacity : 0;  
	position: absolute;

	/** iPhoneで押せる範囲を指定するためにinputの範囲をliタグ内全体にする */
	width: 100%;  
	height: 100%;   
	padding: 0;  
}

/** 項目を選択したとき色を変える */
ul.ColorRadio li input:checked + label {  
	/***背景色*/
	background: -moz-linear-gradient(top, #cfc, #9f9);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #cfc), color-stop(1, #9f9));  
	/***文字色*/
	color: #393;  
	/***文字の影*/
	text-shadow: 0 -1px #fff;  
}

/** 以下はラジオボタンのid属性によって色変えたい場合に記述する
* セレクタでinputの後に＃id名を入れるとそのidの選択肢を選択した時の色を変更できます。
*/

/** 「id="bl"」の項目を選択したときは青にする */
ul.ColorRadio li input#bl:checked + label {  
	background: -moz-linear-gradient(top, #cff, #9cf);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #cff), color-stop(1, #9cf));  
	color: #339;  
	text-shadow: 0 -1px #fff;  
}

/** 「id="re"」項目を選択したときは赤にする */
ul.ColorRadio li input#re:checked + label {  
	background: -moz-linear-gradient(top, #fcc, #f99);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fcc), color-stop(1, #f99));  
	color: #933;  
	text-shadow: 0 -1px #fff;
}

/* iphone_radio */
/** html
<ul>
<li>
<input type="radio" id="male" name="sex" value="男性" />
	<label for="male">男性</label>
</li>
<li>
<input type="radio" id="female" name="sex" value="女性" />
<label for="female">女性</label>
</li>
</ul>
*/

.iphone_radio li{
float: left;
position: relative;
width: 70px;
}
.iphone_radio li input {
height: 100%;
width: 100%;
opacity: 0;
position: absolute;
top: 0;
left: 0;
}

.iphone_radio li input + label{
color:#333;
display:block;
text-align:center;
padding:5px 0;
border: 1px solid #ddd;
background-image:-webkit-gradient(linear,left top,left bottom,from(#F9F9F9),to(#EEEEEE));
background:-moz-linear-gradient(#F9F9F9,#EEEEEE);
}
.iphone_radio li:first-child input + label{
border-radius:4px 0 0 4px;
}
.iphone_radio li:last-child input + label{
border-radius:0 4px 4px 0;
border-left:none;
}
.iphone_radio li input:checked + label{
background-image:-webkit-gradient(linear,left top,left bottom,from(#5393C5),to(#6FACD5));
background: -moz-linear-gradient(#5393C5, #6FACD5);
border: 1px solid #2373A5;
color:#fff;
}

/* vrl */
.vrl {
	width : 30px;
	height : 150px;
	-webkit-writing-mode: vertical-rl;
	-moz-writing-mode   : vertical-rl;
	-ms-writing-mode    : vertical-rl;
	-o-writing-mode     : vertical-rl;
	writing-mode        : vertical-rl;
	-webkit-text-orientation : upright;
	overflow : hidden;
	margin : 0 auto;
}

/* slideDown */
#sd_note {
	margin : 0 auto;
	width : 100%;
	max-width : 360px;
	border-radius : 10px;
	position: absolute;
	z-index: 6001;
	top: 0;
	left: 0;
	right: 0;
	text-align: center;
	line-height: 2.5em;
	-webkit-box-shadow: 0 0 5px black;
	-moz-box-shadow   : 0 0 5px black;
	box-shadow        : 0 0 5px black;
	-webkit-transform: translateY(-50px);
	-moz-transform   : translateY(-50px);
	-o-transform     : translateY(-50px);
	-ms-transform    : translateY(-50px);
	transform        : translateY(-50px);
	-webkit-animation: slideDown 8s 0.5s 1 ease forwards;
	-moz-animation   : slideDown 8s 0.5s 1 ease forwards;
	-o-animation     : slideDown 8s 0.5s 1 ease forwards;
	-ms-animation    : slideDown 8s 0.5s 1 ease forwards;
	animation        : slideDown 8s 0.5s 1 ease forwards;
}
@-webkit-keyframes slideDown {
	0%   { opacity: 0; -webkit-transform: translateY(-50px); }
	20%  { opacity: 1; -webkit-transform: translateY(30px); }
	70%  { opacity: 1; -webkit-transform: translateY(30px); }
	100% { opacity: 0; -webkit-transform: translateY(0px); }
}
@-moz-keyframes slideDown {
	0%   { opacity: 0; -moz-transform: translateY(-50px); }
	20%  { opacity: 1; -moz-transform: translateY(30px); }
	70%  { opacity: 1; -moz-transform: translateY(30px); }
	100% { opacity: 0; -moz-transform: translateY(0px); }
}
@-o-keyframes slideDown {
	0%   { opacity: 0; -o-transform: translateY(-50px); }
	20%  { opacity: 1; -o-transform: translateY(30px); }
	70%  { opacity: 1; -o-transform: translateY(30px); }
	100% { opacity: 0; -o-transform: translateY(0px); }
}
@-ms-keyframes slideDown {
	0%   { opacity: 0; -ms-transform: translateY(-50px); }
	20%  { opacity: 1; -ms-transform: translateY(30px); }
	70%  { opacity: 1; -ms-transform: translateY(30px); }
	100% { opacity: 0; -ms-transform: translateY(0px); }
}
@keyframes slideDown {
	0%   { opacity: 0; transform: translateY(-50px); }
	20%  { opacity: 1; transform: translateY(30px); }
	70%  { opacity: 1; transform: translateY(30px); }
	100% { opacity: 0; transform: translateY(0px); }
}
.label_success {
	background:#efd;
	color:#374;
}
.label_error {
	background:#fee;
	color:#a44;
}
.label_info {
	background:#ffd;
	color:#874;
}

/* responsive 735 - 910 */
@media only screen and (min-width:735px) and (max-width:910px) {
	.adm_view p.adm_disp {
		font-size : 100%;
	}
	.adm_view p.adm_msg {
		font-size : 100%;
	}
	.sel {
		line-height : 1.4em;
	}
}

/* responsive - 734 */
@media only screen and (max-width:734px) {
/** adm_h1 */
	#adm_h1 {
		width : 100%;
		margin : 0;
		clear : both;
	}
	/** adm_h2 */
	#adm_h2 {
		width : 100%;
		margin : 0;
		font-size : 120%;
		clear : both;
	}
	/** adm_h3 */
	#adm_h3 {
		width : 100%;
		margin : 0;
		font-size : 120%;
		clear : both;
	}
	.adm_view {
		clear : both;
		width : 100%;
		margin : 0 0 5px 0;
		height : auto;
	}
	.adm_view p.adm_disp {
		font-size : 100%;
	}
	.adm_view p.adm_msg {
		font-size : 100%;
	}
	ul.cmd_list li {
		margin : 2% auto;
		width : 70%;
		padding-left : 15%;
		clear : both;
	}
	ul.cmd_list4 li {
		margin : 2% auto;
		width : 70%;
		padding-left : 15%;
		clear : both;
	}
	.sel {
		line-height : 2em;
	}
	.treat_txt {
		width : 200px;
	}
	div.adm_of {
		font-size : 80%;
	}
	.step_bar {
		width : 100%;
	}
	.sp1hp {
		width : 90%;
	}
	ul.treat_crs li {
		width : 80%;
		margin : 0.5em auto;
		float : none;
	}
}
