@charset "UTF-8";
.stepBar {
    width: 90%;
    height: 30px;
    margin: 0 auto;
    padding: 0;
    margin-bottom: 20px;
    margin-top: 5px;
}
.stepBar li {
    width: 32%;
    height: 32px;
    line-height: 30px;
    list-style: none;
    float: left;
    border: 1px solid #fff;
    position: relative;
    text-align: center;
    background-color: #d0d0d0;
    font-size: 1em;
}
.stepBar li.active {
    background-color: #ff9090;
    color: #000;
}
.stepBar li span.before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 20px;
    border-color: transparent transparent transparent #fff;
    line-height: 0px;
    _border-color: #000000 #000000 #000000 #fff;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
    position: absolute;
    left: 0px;
    z-index: 10;
}
.stepBar li.first span.before {
    border: none;
}
.stepBar li span.after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 19px;
    border-color: transparent transparent transparent #d0d0d0;
    line-height: 0px;
    _border-color: #000000 #000000 #000000 #007bff;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#007bff');
    position: absolute;
    right: -19px;
    z-index: 50;
}
.stepBar li.active span.after {
    border-color: transparent transparent transparent #ff9090;
}

.span_step{
    color: #000;
    font-size: 1.2em;
}

.head_area {
    position: relative;
    width: 100%;
    height: 100px;
}

.mark_frame {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100px;
    height: 100%;
}

.mark_img {
    width: 100%;
    height: auto;
    top: 0;
    bottom: 0;
    position: absolute;
    margin: auto;
}

.title_frame {
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    text-align:center;
    padding:40px 0px 40px 30px;
}

.form_row {
    display: table;
    width: 100%;
    table-layout: auto;
    margin-bottom: 20px;
    height: 100%;
}

.form_qno {
    display: table-cell;
}

.form_qco {
    padding:5px 10px 0 10px;
    display: table-cell;
    float:left;
}

.form_title_area {
    display: table-cell;
    width: 25%;
    background-color: #E8E8E8;
    font-weight: bold;
    height: 100%;
    vertical-align: middle;
}

fieldset.title_area {
    height: 300px;
    max-width:1200px;
}

legend.title_area {
    display: table-cell;
    width: 25%;
    background-color: #E8E8E8;
    font-weight: bold;
    height: 100%;
    vertical-align: middle;
    padding:120px 10px 0 10px;
    float:left;
}

.form_title_area_s {
    display: table-cell;
    width: 50%;
    background-color: #E8E8E8;
    font-weight: bold;
    height: 100%;
    border-width: 1px;
    border-top-style: solid;
    border-color: #A0A0A0;
}

.form_body_area {
    display: table-cell;
    background-color: #F8F8F8;
    vertical-align: middle;
    padding: 5px;
}

.fieldset_form_body_area {
    display: block;
    background-color: #F8F8F8;
    vertical-align: middle;
    padding: 5px;
    width:100%;
    height:100%;
}

.form_table{
    display: table;
    width: 100%;
    table-layout: auto;
}

.form_table_l{
    display: table-cell;
    width: 50%;
}

.form_table_r{
    display: table-cell;
    width: 50%;
}

.form_area{
    display: table;
    width: 100%;
    table-layout: auto;
    padding:0 0 0 5px;
}

.form_area_l{
    display: table-cell;
    width: 30px;
}

.form_area_r{
    display: table-cell;
    vertical-align:  middle;
    padding:4px 0;
}

.form_title_table{
    border:0px;
    width:100%;
}

.form_title_table .form_td{
    vertical-align: top;
    width:30px;
    display: table-cell;
}

.form_body_table{
    border:0px;
    width:100%;
}

.form_body_table .form_td{
    vertical-align:  middle;
    width:30px;
    display: table-cell;
}

.form_sub_table {
    width: 100%;
    padding:0 0 0 5px;
}

.form_sub_table2 {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.form_sub_table .form_td{
    vertical-align: middle;
    width:18px;
    display: table-cell;
}

.form_sub_table_n {
    display: table-cell;
    padding:5px 5px;
}


.form_sub_table_t {
    vertical-align: center;
    display: table-cell;
    padding:4px 0;
}

.form_sub_table_tn {
    vertical-align: center;
    display: table-cell;
    padding:4px 6px 0 0;
}

.form_sub_table_tm {
    vertical-align: center;
    display: table-cell;
    padding:0 6px 0 0;
}

.form_sub_table_ts {
    display: table-cell;
    vertical-align: center;
}

.form_sub_table_tt {
    vertical-align: center;
    display: table-cell;
    padding:4px 16px 4px 0;
}

.form_sub_table_tt2 {
    vertical-align: center;
    display: table-cell;
}

.form_sub_table_sf {
    display: table-cell;
    vertical-align: center;
    padding:8px 0;
}

.form_sub_table textarea {
   display: table-cell;
   width:85%;
   margin:0 0 0 30px;

}

.form_sub_table_s{
    display: table-cell;
    vertical-align: top;
    width:200px;
}
.form_sub_table_s img{
    vertical-align: top;
}

.form_sub_table_t2 {
    vertical-align: top;
}
.form_sub_table_s2{
    vertical-align: top;
}
.form_sub_table_s2 img{
    vertical-align: top;
}

.form_sub_table_b {
    display: table-cell;
    padding: 12.5px;
}

textarea {
  width:90%;
  height: 120px;
  margin-left:5px;
}

.textbox {
  padding:3px;
  width:95%;
}

.textbox2 {
  padding:3px;
  width:90%;
}

.textbox2-valid {
  padding:3px;
  width:90%;
  background-color:#F0A0A0;
}

.textbox2a {
  float:left;
  margin-right:7px;
}

.textbox2a-valid {
  float:left;
  margin-right:7px;
  background-color:#F0A0A0;
}
.textbox3 {
  padding:3px;
  width:7em;
}

.textbox3-valid {
  padding:3px;
  width:7em;
  background-color:#F0A0A0;
}

.textbox4 {
  padding:3px;
  width:5em;
}

.textbox4-valid {
  padding:3px;
  width:5em;
  background-color:#F0A0A0;
}

.textbox5 {
  padding:3px;
  width:3em;
}

.textbox6 {
  padding:3px;
  width:4em;
}

.textbox7 {
  padding:3px;
  width:90%;
}

.textbox7-valid {
  padding:3px;
  width:90%;
  background-color:#F0A0A0;
}

.listbox-valid {
  background-color:#E6B9B8!important;
}

.listbox2 {
    margin:0 10px 10px 0;
    float:left;
}

.listbox2-valid {
  background-color:#F0A0A0;
}

.radio {
    width: 18px;
    height: 18px;
    vertical-align:middle;
    border-width: 1px;
    appearance: auto;
    margin: 0px 10px;
}
.checkbox {
    width: 18px;
    height: 18px;
    vertical-align:middle;
    border-width: 1px;
    appearance: auto;
}

.checkbox_step {
    width: 18px;
    height: 18px;
    vertical-align:text-bottom;
    border-width: 1px;
    appearance: auto;
    pointer-events:none;
}

.button{
    width:120px;
}

.button2{
    width:280px;
    height:40px;
    color:black;
    font-size:1.2em;
    background: #EFEFEF;
}

.button3{
    width:200px;
    height:40px;
    color:black;
    font-size:1.2em;
    background: #EFEFEF;
}

.img {
    width: auto;
    height: auto;
    top: 0;
    bottom: 0;
    margin: auto;
}

.submit_area {
    width: 100%;
    margin: 30px 0px 30px 0px;
    text-align: center;
}

.submit_area_frame {
    margin-left: 20px;
    margin-right: 20px;
}

.submit_area img {
    max-width: 400px;
    height: auto;
}

.confirm_text {
    padding: 12.5px;
}

.confirm_text2 {
    padding: 12.5px;
}

.message {
    text-align: center;
    padding: 0px 28px 28px 28px;
}

.message_complete {
    text-align: left;
    padding: 20px 10% 40px 10%;
}

.errmessage_lesslength {
   color:#C00000;
}

.errmessage {
   color:#C00000;
   margin: 5px 0 0 2px;
}

.fieldset_errmessage {
   color:#C00000;
   margin: 5px 0 0 12px;
}

.logo {
    padding-left: 20px;
}

.linkArea {
    width:100%;
    text-align:right;
}
.required {
   color:#C00000;
   font-size:0.9rem;
   font-weight: normal;
   padding:3px;
   margin:2px;
   float:left
}

.legend_required {
   color:#C00000;
   font-size:0.9rem;
   font-weight: normal;
   padding-left:10px;
}

.optional {
   display:table-cell;
   border-radius: 7px;
   color:white;
   font-size:0.9em;
   font-weight: normal;
   padding:3px;
   margin:2px;
   text-align:center;
   border: 5px white double;
   background-color: #404070;
   width:40px;
   float:right;
}

.required2 {
   margin:0;
}

.optional2 {
   margin:0;
   float:none;
}

.carmodel_first {
   color:#3070FF;
   text-decoration:underline;
}

.kiyaku_frame {
    width: 100%;
    height: 300px;
    overflow: scroll;
    border-color: #afafaf;
    border-style: solid;
    border-width: 1px;
    margin: 80px 0px 20px 0px;
}

.kiyaku_frame2 {
    width: 100%;
    height: auto;
    overflow: auto;
    border-color: #afafaf;
    border-style: solid;
    border-width: 1px;
    margin: 10px 0px 10px 0px;
}
.kiyaku_body {
    max-width: 960px;
    margin: 30px;
}

.kiyaku_check {
    width: 100%;
    margin: 30px 0px 30px 0px;
    font-size: 1rem;
    text-align: center;
}

.kiyaku_check input {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    border-width: 1px;
}



@media ( max-width:770px )
{
    .stepBar {
        width: 100%;
    }
}

@media ( max-width:767px )
{
    .stepBar {
        width: 100%;
    }
    .stepBar li {
        width: 32%;
        font-size: 0.8em;
    }

    #main
    {
        width: 95%;
        max-width: 767px;
    }

    .head_area {
        height: 100px;
    }

    .form_row {
        display: initial;
    }


    .form_title_area {
        display: block;
        width: 100%;
    }
    
    fieldset.title_area {
        height:100%;
        width:100%;
    }
    
    legend.title_area {
        display: table-cell;
        width: 100%;
        background-color: #E8E8E8;
        font-weight: bold;
        padding:5px 10px 0 10px;
        float:left;
        height:43px;
        margin-bottom:5px;
    }
    
    .fieldset_errmessage {
        color:#C00000;
        margin: 5px 0 0 5px;
    }

    .form_title_area_s {
        display: block;
        width: 100%;
        border-top-style: none;
    }

    .form_body_area {
        display: block;
    }

    .form_table{
        display: block;
    }

    .form_table_l{
        display: block;
        width: 100%
    }

    .form_table_r{
        display: block;
        width: 100%
    }

    .confirm_text2 {
        padding-left: 22.5px;
    }

    .confirm_text3 {
        padding-left: 12.5px;
    }

    .form_sub_table {
        display: block;
    }

    .form_sub_table_t {
        display: table-cell;
    }

    .form_sub_table_tn {
        display: table-cell;
    }

    .form_sub_table_ts {
        display: block;
    }
    .form_sub_table_b {
        display: table-cell;
    }

    .form_sub_table_i {
        display: table-cell;
    }

    .form_sub_table_tt2 {
        display: block;
    }

    .form_title_table{
        display:table;
    }

    .footer_body {
        max-width: 767px;
    }

    textarea {
        width:90%;
        height: 200px;
    }

    .textbox2a {
        width:80%;
    }

    .button2 {
        margin-bottom: 20px;
        background: #EFEFEF;
    }
    
    .button3 {
        margin-bottom: 20px;
        background: #EFEFEF;
    }

    .required {
        padding:1px 3px;
    }

    .optional {
        padding:1px 3px;
    }

    .message_complete {
        padding: 10px 10% 10px 10%;
    }

    .linkArea {
        font-size:0.8em;
    }

    .textbox4 {
      width:4em;
    }

    .textbox4-valid {
      width:4em;
}


}