@charset "UTF-8";

/* form.css
********************************************************************************


00.Set Up
01.Text Field
02.Text Area
03.Privacy Policy Text
100.Button Area


********************************************************************************/


/*==================================================

00.Set Up

--------------------------------------------------*/
/*ラベル右スペース*/
.form label{ margin:0 15px 0 0}

/*必須用*/
.form .must{
 background:url(../../images/form-ic01.gif) right center no-repeat;
}

.form .form-notice{
 padding:0 0 15px 35px !important;
 background:url(../../images/form-ic01.gif) 0 0.1em no-repeat;
}

.form table th{
 padding:1em !important;
 padding-right:40px !important;
 background-color:#e5f0f8 !important;
 white-space:nowrap;
}

.form table td{
 padding:1em !important;
}

/*エラー表示用*/
.form label.error,
.form td strong.error,
.form span.error{
 display:block;
 padding:0 0 0 20px;
 background:url(../../images/ic00.gif) 0 1px no-repeat;
 color:#b01f24;
 font-weight:bold;
}

/*==================================================

01.Text Field

--------------------------------------------------*/
/*IE7、8用調整*/
.form .tf-input-text[type="text"]{ height:1.5em; line-height:2em;}

/*テキストフィールド設定 IE6ハックあり*/
.form .tf-width025{ padding:0.2em; width:25px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width050{ padding:0.2em; width:50px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width100{ padding:0.2em; width:100px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width150{ padding:0.2em; width:150px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width200{ padding:0.2em; width:200px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width300{ padding:0.2em; width:300px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width400{ padding:0.2em; width:400px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width500{ padding:0.2em; width:500px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}
.form .tf-width600{ padding:0.2em; width:600px; height:1.5em; border:1px solid #999; vertical-align:middle; _padding-top:0.25em; _height:1em;}


/*==================================================

02.Text Area

--------------------------------------------------*/
.form .ta-width300{ padding:0.2em; width:300px; border:1px solid #999;}
.form .ta-width400{ padding:0.2em; width:400px; border:1px solid #999;}
.form .ta-width450{ padding:0.2em; width:450px; border:1px solid #999;}
.form .ta-width500{ padding:0.2em; width:500px; border:1px solid #999;}
.form .ta-width600{ padding:0.2em; width:600px; border:1px solid #999;}


/*==================================================

03.Privacy Policy Text

--------------------------------------------------*/
#pptx{
margin:10px 0;
background-color:#efefef;
border:1px solid #666;
height:150px;
overflow:auto;
padding:20px 20px 0 20px;
font-size:85%;
}

#pptx h2{
 margin:0 0 10px;
}
#pptx h2 span{
 padding:3px 7px;
}
#pptx div.article,
#pptx div.article p{
 padding:0 0 10px;
}


/*==================================================

100.Count

--------------------------------------------------*/
form div.count-wrapper{
 position:relative;
 width:500px;
}
form .counter{
	position:absolute;
	right:0;
	top:0;
	font-weight:bold;
	color:#888;
	}
form .warning{color:#600;}
form .exceeded{color:#B01F24;}


/*==================================================

100.Button Area

--------------------------------------------------*/
.f-btnarea-back{
 margin:20px 0 0;
 text-align:left;
}

.f-btnarea{
 margin:40px 0 0;
 text-align:center;
}

.f-btnarea .lr-sp015{
 margin:0 15px;
}


/*==================================================

1000.Copyright

--------------------------------------------------*/
.wtn_copyright{
 display:none;
}



/*==================================================

2000.MW WP FORM 用

--------------------------------------------------*/
.aytr-form th{width:25%; background-color: #e5f0f8 !important;}
.aytr-form input[type="text"],
.aytr-form input[type="email"],
.aytr-form textarea{
  -webkit-border-radius: 2px;/* for Safari and Chrome */
  -moz-border-radius: 2px; /* for Firefox */
  -o-border-radius: 2px; /* for opera */
  border-radius: 2px;
  background-color: #efefef;
  padding: .5em;
  border: 1px solid #ccc;
}
/*確認画面で説明文非表示*/
.aytr-confirm span.note,
.mw_wp_form_confirm span.note{ display: none; color:#666;}
/*エラー*/
.aytr-form span.error{ display:block; margin:0.5em 0 0 0; padding:0 0 0 20px; background:url(../../images/form-ic02.gif) 0 center no-repeat; color:#b01f24;}
span.note{ color:#666;}
span.req{ color:#b01f24; font-weight:normal;}

/************************************************************************************
フォームステップ表示
*************************************************************************************/
.formstep {
    margin: 0 auto 2em;
    padding: 0 0 2em;
    list-style: none!important;
    text-align: center;
    font-size: 85%;
    display: -webkit-flex!important;
    display: -moz-flex!important;
    display: -ms-flex!important;
    display: -o-flex!important;
    display: flex!important;
    flex-direction: row;
    justify-content: center;
}

.formstep li {
    margin: 0!important;
    padding: 0 10px!important;
    list-style: none!important;
    position: relative;
    width: 30%;
    box-sizing: border-box;
}

.formstep li span {
    padding: .25em 1em;
    display: block;
    background: #ccc;
    color: #222;
    box-sizing: border-box;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

.formstep li.current span {
    background: #177ccc;
    color: #fff;
}

.formstep li:before {
    list-style: none;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -2px;
    content: "";
    display: block;
    box-sizing: border-box;
    width: 4px;
    height: 4px;
    border: 4px solid transparent;
    border-left: 4px solid #ccc!important;
}

.formstep li:first-child:before {
    width: 0;
    height: 0;
    border: none!important;
}