/*  リセット */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, ead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/*  リセットここまで */


body{
	background-color: black;
	}

.center {
	text-align: center;
}

span.red{
	color:#ff0000;
	}


td{
	font-size:0.8em;
}

/* content
------------------------------------------------------------- */

.container{
	width:100%;	
	}

#content-form {
		padding:20px;
		padding-top:10px;
		width:90%;
		margin:20px auto;
}

@media screen and (max-width:640px) { 
    /*　画面サイズが640pxまではここを読み込む　*/
	#content-form {
		padding:2%;
		width:95%;
		margin: auto;
}
}


#content-form h1 {
	margin-top:40px;
	margin-bottom: 20px;
	font-size: 116%;
	font-weight: bold;
	line-height: 1.5;
	padding:10px;
	padding-top: 15px;
	padding-bottom: 15px;
    background-color:#000;
    color:#fff;
	border-radius:0.5em;
	-moz-border-radius:0.5em;
	-webkit-border-radius:0.5em;
}

#content-form h2 {	
	margin-bottom: 1em;
	font-size: 100%;
	font-weight: bold;
	line-height: 1.5;
	line-height: 25px;
	padding: 10px;
	padding-left:10px;
	margin-top: 10px;
	background-color: #666;
	color: #fff;
}



/* paragraph */
#content-form p {
	margin-bottom: 1em;
}


/* table */
#content-form table {
	margin-bottom: 1em;
	
}

#content-form table {
	border-top: 1px solid #999;
	border-left: 1px solid #999;
	margin-bottom:30px;
	
}

table.alpha{
    width:100%;
	margin:0;	
}



#content-form table th {
	padding: 6px;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	font-weight: bold;
	line-height: 1.2;
	width:30%;
	background-color: #ddd;
	vertical-align: middle;
}

#content-form table td {
	padding: 6px;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	vertical-align: top;
	background-color: #fff;
	width:70%;
}

#content-form table td ul {
	margin-bottom: 0;
}

#content-form table td img {
	margin: 0.5em 0;
}


/* form */
#content-form form.inline {
	display: inline;
}

#content-form .area-wide {
	width: 100%;
	height:45px;
}

@media screen and (max-width:640px) { 
	#content-form .area-wide {
		width: 90%;
		height:80px;
	}
}

#content-form .area-wide-l {
	width: 80%;
	height:150px;
}

#content-form .wide {
	width: 75%;
}

#content-form .middle {
	width: 60%;
}

#content-form .narrow {
	width: 75%;
}

#content-form .mini {
	width: 40%;
}

#content-form .error {
	margin-top: 6px;
}

#content-form .subtitle{
	color:#ffffff;
	}

#content-form .btn {
	font-size:116%;
	font-weight: bold;
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    background: #999;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #666;
    border-radius: 3px;
    cursor:pointer;
}

#content-form .btn:hover {/*ボタンを押したとき*/
    background: #666;
    border-bottom: solid 4px #444;
}

#content-form .back{
	margin:20px auto;
	width:50%;
	cursor:pointer;
	}


/* popup
------------------------------------------------------------- */
.popup .container {
	width: 580px;
}

.popup #header {
	padding-top: 1em;
}

.popup #header h1 {
	margin-bottom: 0.5em;
	border-bottom: 3px solid #333;
	font-size: 146.5%;
	font-weight: bold;
}



/* font size
-------------------------------------------------------------

	10px = 77%
	11px = 85%
	12px = 93%
	
	13px = 100% (default)
	
	14px = 108%
	15px = 116%
	16px = 123.1%
	17px = 131%
	18px = 138.5%
	19px = 146.5%
	20px = 153.9%
	21px = 161.6%
	22px = 167%
	23px = 174%
	24px = 182%
	25px = 189%
	26px = 197%
*/


/* 必須 */
.require {color: #CC0000;}


/* １段階小さい文字 */
.small {font-size:85%;}


/* ボタンの親 */
.btn {
	margin:0 auto;
	text-align:center;
	
}

/* Table
--------------------------------------------------*/

.zeromail table {
	width:100%;
    margin-bottom:10px;
}

.zeromail caption {
    margin:10px 0;
    padding:0.5em;
    ground-color:#c9d9f0;
    color:#3762a8;
    font-weight:bold;
}

.zeromail thead th,
.zeromail tfoot th {
	background-color:#dbe5f3;
    text-align:center;
}
.zeromail thead td,
.zeromail tfoot td {
	background-color:#dbe5f3;
    text-align:center;
}

.zeromail tbody th {
    width:25%;
    padding:0.5em;
	background-color:#ebf1f9;
	font-weight:normal;
    text-align:center;
}

.zeromail td {
    padding:0.5em;
	text-align:left;
}

/* Form
--------------------------------------------------*/
.zeromail legend {
	display:none;
}

.zeromail label{
    margin:0 3px;
}

.zeromail input[type=radio],
.zeromail input[type=checkbox] {
    margin-right:0.3em;
}

.zeromail button,
.zeromail input[type=checkbox],
.zeromail input[type=radio],
.zeromail input[type=reset],
.zeromail input[type=submit] {
    padding:1px;
}

.zeromail [type=check],
.zeromail [type=radio],
.zeromail [type=submit] {
    cursor: pointer;
}

.zeromail [type=check] + label,
.zeromail [type=radio] + label {
    display: inline-block;
    cursor: pointer;
}

.zeromail [type=text],
.zeromail [type=password],
.zeromail textarea {
    padding: 1px;
    border: 1px solid #aaa;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.zeromail input[type=text]:hover,
.zeromail [type=password]:hover,
.zeromail textarea:hover,
.zeromail input[type=text]:focus,
.zeromail [type=password]:focus,
.zeromail textarea:focus {
	background-color: #ECFBFF;
}

/* Button
--------------------------------------------------*/
.zeromail .button {
    text-align:center;
    margin-top:20px;
}

.zeromail .button button {
    min-width:100px;
	_width:100px;
}

.zeromail button[type],
.zeromail button[id]{
    margin:0 5px;
	padding:0 5px;
    border:solid 2px;
    border-color:#ddd #aaa #aaa #ddd;
	border-radius:5px;
    background-color:#ccc;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
    line-height:1.4;
    cursor:pointer;
}

.zeromail button[type]:hover,
.zeromail button[id]:hover{
    background-color:#efefef;
}
.zeromail button[id=submit] {
}
.zeromail button[id=submit]:hover {
  
}

.zeromail button[id=myreset],
.zeromail button[id=close]{
	
}

#myreset,#close,#submit{
	font-size:100%;
	font-weight: bold;
    display: inline-block;
    padding: 0.3em 1em;
    text-decoration: none;
    background: #999;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #666;
    border-radius: 3px;
    margin:20px 30% 0px;
	width:40%;
	font-size:0.8em;
	
}

#submit{
	font-size:116%;
    padding: 0.5em 1em;
    text-decoration: none;
    margin:20px 25% 0px;
	width:50%;
	font-size:0.9em;	
}

#myreset:hover,#close:hover,#submit:hover{
	background: #666;
    border-bottom: solid 4px #444;
}

/* 確認・エラー画面(check,error)
--------------------------------------------------*/
.zeromail #confirm td  {
    padding:1em;
}

/*入力エラー*/
.zeromail strong.error {
	display:inline;
	padding:0;
	margin:0;
	border:0;
	background:none;
    color:#A82B2B;
}

/* Message()のメッセージ */
.message {
	text-align:center;
}

/*エラー*/
.zeromail span.error{ 
	display:block;
	margin:1.5em 50px;
	padding:1.5em 0;
	background-color:#ffffff;
	border:solid 1px #ff0000;
	text-align:center;
	color:#ff0000;
}

/*エラーなし*/
.zeromail span.confirm{
	display:block;
	color:#ff0000;
	border:solid 1px;
	background-color:#ffffff;
	padding:10px;
}


/* 送信完了(completion.html)
--------------------------------------------------*/
#completion{
	background-color:#FFFFFF;
	padding:20px;
	width:90%;
}

#completion .success {
	display:block;
	margin: ;
	padding:1.5em 0;
	background-color:#666666;
	text-align:center;
	color:#ffffff;
}

#completion .btn{
	margin:20px 30% 0px;
	width:40%;
	font-size:0.9em;
}

#completion .btn a{
	color:#ffffff;
	text-decoration: none;
}




/*-----------------------------------------------------
  copyright
-----------------------------------------------------*/
.wtn_copyright {
	clear:both;
    margin-top:30px;
    font-size:10px;
	text-align:center;
}
.wtn_copyright a{
    color:#AABCE8;
	text-decoration:none;
}

/*-----------------------------------------------------
  for Ajax
------------------------------------------------------*/
/*住所検索メッセージ*/
.zeromail .zipcode-message {
	font-size:85%;
	margin-left:0.5em;
}
/* Address Search */
.zeromail .zipcode-btn {
}
.zeromail .zipcode-message {
	color:#999;
}

/* Over Text Label */
.zeromail .overTxtLabel {
    color: #888888;
}

/* Validator Advice */
.zeromail input[type=text].validation-failed,
.zeromail textarea.validation-failed {
    border-color: #ff0000;
    background-color: #ffdddd;
}
.zeromail .validation-failed:hover,
.zeromail .validation-failed:focus {
	border-color: #FF6A6A;
	background-color: #FEE;
}
.zeromail .validation-advice {
    padding-bottom: 5px;
    font-weight: bold;
    color: #ff0000;
}

/* ローディング */
.spinner {
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    background-color: #ffffff;
}

/* [Ajax] Result
--------------------------------------------------*/
/* 結果 */
#result {
	margin:10px 0;
	background-color: #DFE6FD;
	text-align:center;
}

#result div {
	border: 1px solid;
	border-color:#5082EB;
	padding:10px;
}

#result:empty {
	margin:0;
    padding:0;
    border-width: 0;
}​

/* 完了メッセージ */
#result .success{
}


/* [ADMIN] Logout Button
--------------------------------------------------*/
.logout {
	position:absolute;
	top:1.2em;
	right:0.2em;
}

button#logout{
    border:solid 2px;
    border-color:#aaa #777 #555 #999;
    background-color:#888;
    line-height:1.4;
    margin:0;
	color:#fff;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	cursor:pointer;
}
button#logout:hover {
	background-color:#a00;
	border-color:#d00 #900 #700 #c00;
}


/* INPUT
--------------------------------------------------*/
.label {
  display: block;
  margin-bottom: 5px;
}
select,
textarea,
.section input[type="text"],
.section input[type="email"],
.section input[type="url"],
.section input[type="search"],
.section input[type="tel"],
.uneditable-input {
  display: inline-block;
  height: 30px;
  padding: 4px 6px;
 /* margin-bottom: 9px;*/
  font-size: 14px;
  line-height: 20px;
  color: #555555;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  -webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.5);
  -moz-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.5)
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.5);
  -webkit-transition: border linear .2s, box-shadow linear .2s;
  -moz-transition: border linear .2s, box-shadow linear .2s;
  -o-transition: border linear .2s, box-shadow linear .2s;
  transition: border linear .2s, box-shadow linear .2s;
}

