.btn, .btn .hover{
    background: #e9e9e9;
    border-radius: 3px;
    height: auto;
    padding: 3px 0;
    border: 1px solid #999;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.14);
    transition:.3s;
 }

 /*form fillup steps style*/
 div.oubo-application-steps {
   max-width: 980px;
   margin: 0px auto;
   display: flex;
   justify-content: center;
 }
 .form_steps_ul{
   display:flex;
 }
 li.form_step {
   padding: 8px;
   background:#eaeaea;
   color:#333;
   position:relative;
   padding-left:20px;
   padding-right:10px;
}
li.form_step.page-on{
   background:#619bff;
   color:#fff;
}

 li.form_step:before{
   content:"";
   border:14px transparent solid;
   border-left:10px #fff solid;
   width:0;
   height:0;
   display:block;
   position:absolute;
   right:-24px;
   top:0;
   z-index:3;
}
li.form_step:after{
   content:"";
   border:14px transparent solid;
   border-left:10px #eaeaea solid;
   width:0;
   height:0;
   display:block;
   position:absolute;
   right:-22px;
   top:0;
   z-index:3;
}
li.form_step.page-on:after,li.form_step.page-on:before{
   border-left:10px #619bff solid;
}

#form_steps_ul > li:nth-last-child(1):after,#form_steps_ul > li:nth-last-child(1):before{
    content:none;
}
 
 #body{
    border: none;
 }
 #webmypage #mainTitle,#webmypage #mainTitle a {
    display: block;
    box-sizing: border-box;
    width: 100%;
    background: none;
    text-indent: 0;
 }
 #mainTitle{
    border: none;
 }
 #mainTitle{
    padding: 15px 0 10px;
 }
 #mainTitle a {
    height: auto;
    width: auto;
    background: none;
    text-indent: 0;
    font-size: 24px;
    padding: 0 0 0 15px;
    height: auto;
    line-height: 1.2;
    color:#333;
 }
 fieldset{
    margin: 0;
    padding: 0;
    border: none;
 }
 legend{
    display: none;
 }
 fieldset input[type="text"],fieldset input[type="email"],fieldset input[type="tel"],fieldset input[type="number"], fieldset textarea {
    margin: 0;
    border-radius: 3px;
    box-sizing: border-box;
    min-width: 100px;
    background: #ffffff;
 }
 fieldset input[type="file"]{
    background: #fff;
 }
 fieldset input[type="text"].hasDatepicker{
   margin-right: 5px;
 }

 fieldset input, fieldset select, fieldset textarea{
    border-radius: 2px;
 }
 fieldset select{
   min-height: 30px;
   line-height: 1.8;
   border-radius: 4px;
   background: #ffffff;
 }
 
 
 input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="url"]:focus, input[type="email"]:focus,fieldset input[type="tel"]:focus, textarea:focus{
    box-shadow: none;
 }
 textarea{
    width: 100%;
 }
 body.compact.min nav.tab ul, body.compact nav.tab ul, nav.tab ul {
    border-bottom: solid 2px #142645;
    position: relative;
    z-index: 2;
 }
 
 div.alerts h2{
    background: none;
 }
 fieldset input[type="text"].auto_age{
    margin-right: 5px;
 }
 
 div.alerts{
    margin-bottom: 15px;
    margin-top: 35px;
 }
 nav.tab{
    transform-origin: right top;
 }
 nav.tab:after{
    content: "";
    position: relative;
    display: block;
    width: 100%;
    height: 2px;
    background: #142645;
    position: absolute;
    bottom: 0;
    z-index: 0;
 }

span.required{
   border-radius: 5px;
    top: -1px;
    font-size: 11px;
    padding: 0px 5px;
    margin-left: 8px;
    display: inline-block;
    line-height: 1.8;
}
.displayTable{
   display: table-row !important;
}
.requiredElementCount{
   z-index: 300;
}
.formError{
   opacity: 1 ;
   transition: none !important;
}
.formError .formErrorArrow > div,.formErrorArrow{
   display: none;
}
.formError .formErrorContent{
   position: relative;
}
.formError .formErrorContent:before{
   content: "";
   display: block;
   width: 0;
   height: 0;
   border: 7px solid transparent;
   border-top: 7px solid #ffffff;
   position: absolute;
   bottom: -14px;
   z-index: 1;
}
.formError .formErrorContent:after{
   content: "";
   display: block;
   width: 0;
   height: 0;
   border: 7px solid transparent;
   border-top: 7px solid #cc3333;
   position: absolute;
   bottom: -15px;
   z-index: 0;
}
.formError .formErrorContent{
   background: #ffffff;
   border: none;
   box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.2);
   color: #cc3333;
   font-weight: bold;
   border: 1px solid #cc3333;
   box-sizing: border-box;
}
.inputwrapper,.inputwrapper label{
   position: relative;
}
input[type="radio"],input[type="checkbox"]{
   display:block;
   opacity: 0;
   line-height: 1.2;
   position: absolute;
   top:0;
   left: 0;
}
input[type="radio"] + span{
   position: relative;
   display: flex;
   align-items: center;
   line-height: 1.2;
}
input[type="radio"] + span:before{
   content: "";
   display: inline-block;
   width: 16px;
   height: 16px;
   border: 1px solid #d4d2d2;
   border-radius: 20px;
   margin-right:5px;
   background: #fff;

}
input[type="radio"]:checked + span:after{
   content: "";
   display: inline-block;
   width: 10px;
   height: 10px;
   border: none;
   border-radius: 20px;
   background: #619bff;
   position: absolute;
   left: 4px;
   top: 4px;
   
}
input[type="checkbox"] + span{
      position: relative;
      align-items: center;
      display: inline-block;
      padding-left: 30px;
}
input[type="checkbox"] + span:before,input[type="checkbox"] + label:before{
content:"";
display:inline-block;
width:15px;
height:15px;
border:1px solid  #d4d2d2;
margin-right:5px;
background: #fff;
position: absolute;
top: 2px;
left: 5px;
border-radius: 4px;
}
input[type="checkbox"]:checked + span:after,input[type="checkbox"]:checked + label:after{
   content: "";
   display: block;
   position: absolute;
   left: 8px;
   top: 7px;
   font-weight: bold;
   font-size: 16px;
   color: #484e9e;
   border-left: 2px solid #619bff;
   border-bottom: 2px solid #619bff;
   width: 9px;
   height: 3px;
   transform: rotate(-45deg);
}
input[type="text"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"], input[type="email"], textarea{
   font-size: 14px;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="email"]:focus, textarea:focus{
   transition:none;
   background-color: #fff;
   border-color:#619bff;
}
fieldset select:hover,td label:hover{
   background: initial;
}

#web{
   max-width: 980px;
   margin: 0 auto;
}

fieldset *{
   box-sizing: border-box;
}

.formblockbtn strong{
   font-weight: normal;
}

.privacy_policy_wrapper{
   position: relative;
}
.privacy_policy_wrapper label{
   padding-left: 27px;
   display: block;
   margin-top: 10px;
}
.privacy_policy_wrapper input[type="checkbox"] + label:before{
   top: 9px;
   left: 8px;
}
.privacy_policy_wrapper input[type="checkbox"] + label:after{
   top: 13px;
   left: 11px;
}
#requiredText{
   font-size: 13px;
}
.downarrow{
   position: absolute;
   top: 4px;
   right: 5px;
   color: #1b4181;
   background: #fff;
   font-size: 14px;
   cursor: pointer;
   padding: 0 30px 0 18px;
   border-radius: 35px;
   font-size: 0;
   box-sizing: border-box;
   height: 26px;
}
.downarrow:before{
   content: "OPEN";
   font-size: 12px;
}
.downarrow.arrowopen:before{
   content: "CLOSE";
}
.downarrow:after{
   content: "";
   display: block;
   position: absolute;
   right: 10px;
   top: 6px;
   width: 5px;
   height: 5px;
   border-left: 2px solid #1b4181;
   border-bottom: 2px solid #1b4181;
   transform: rotate(-45deg);
   line-height: 26px;
   transition: 1s;
}
.downarrow.arrowopen:after{
   transform: rotate(-225deg);
   transform-origin: center center;
   top: 10px;
}
table.detail .formblockbtn{
   cursor: pointer;
   background: #e6e6e6;
   padding-right: 35px;
}
[type="file"] + span{
   display: block;
   margin-top: 5px;
}
[type="file"] + span + br{
   display: none;
}
.inputwrapper{
   padding: 10px;
}
/*Error alert show*/
.labelerrorstyle{
   position:relative;   
}
.inputerrorstyle{
   display:block !important;
   position:absolute; 
   top:0; 
   left:0; 
   opacity: 0;
}
/*when error 0*/
.requiredElement{
   transition: .3s;
}
.requiredElementCountnone{
   animation : popnone .3s forwards;
}
/*validation active and inactive*/
.validation-inactive{
   background: #ffffff !important;
   transition: .3s;
}
.validation-active{
  background: #fffddf !important;
  transition: .3s;
}

.pc-none {
   display: none;
}
.name-sei-sp,.name-mei-sp{
   margin-right: 5px;
}
.nami{
   padding: 0 7px;
}
.infomessage{
   text-align:center;   
}
#button-to-submit{
   background: #458af9;
   border:none;
 }
 #button-to-submit b,.btn.text b{
   color:#fff;
 }
 #button-to-back{
    width:25%;
    max-width: 120px;
    background: #c1bebe;
    border: none;
 }
 #button-to-submit{
    width:70%;
    max-width: 260px;
 }
 .btnWrap .btn{
    margin: 5px;
    padding: 10px 0;
 }

@keyframes popnone{ 
   0% { 
       opacity: 1; 
   } 
   100% { 
      opacity: 0;
      display: none; 
   } 
}

 @keyframes tabscroll {
    0% {
        transform: translate(-40%,0);
    }
    50% {
        transform: translate(1%,0);
    }
    100% {
        transform: translate(0,0);
    }
 }

 @media screen and (min-width:768px) {

    .btn:hover{
        background: #ccc;
    }
    table.detail{
      border: 1px solid #ddd;
    }
    table.detail th {
        box-sizing: border-box;
        font-weight:bold;
        font-size: 13px;
        min-width: 230px;
    }   
   body.compact.min nav.tab li,
   body.compact.min nav.tab li a,
   body.compact nav.tab,
   nav.tab,
   body.compact nav.tab ul,
   nav.tab ul,
   body.compact nav.tab ul li,
   nav.tab ul li{
      width: auto;
      height: auto;
      font-size: 11px;
      position: relative;
   }
   
   
   body.compact.min nav.tab ul,body.compact nav.tab ul,nav.tab ul{
      display: flex;
   }
   body.compact.min nav.tab li,body.compact nav.tab li,nav.tab li{
      overflow: inherit;
      position: relative;
      transition:1s;
      width: auto;
   }
   
   body.compact.min nav.tab li a,body.compact nav.tab li a,nav.tab li a{
      width:100%;
      height: 100%;
      box-sizing: border-box;
      border-radius: 8px 8px 0px 0;
      font-size: 12px;
      padding: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #fff;
      border-bottom: none;
   }
   table.detail td{
      background: #fff;
      padding: 0;
      margin: 0;
      box-sizing: border-box;
      border-right: 1px solid #ddd;
   }
   
   table.detail th{
      background: #f7f7f7;
      color: #333;
      font-size: 14px;
      font-weight: normal;
   }
   table.detail th.formblockbtn{
      padding-right: 115px;
   }
   input[type="text"], input[type="password"], input[type="number"], input[type="url"], input[type="email"],input[type="tel"], textarea{
   font-size: 15px;
   padding: 5px;
   }
   fieldset input, fieldset textarea{
      font-size: 14px;
      padding: 5px;
      margin-right: 5px;
      margin-left: 5px;
   }
   table.detail .formblockbtn{
      position: relative;
      background: #e6e6e6;
   }
   .tableOpen:before{
      content: "CLOSE";
   }

 }
 @media screen and (min-width:768px) {
   .btn:hover{
       background: #ccc;
   }
   body.compact.min nav.tab li,
   body.compact.min nav.tab li a,
   body.compact nav.tab,
   nav.tab,
   body.compact nav.tab ul,
   nav.tab ul,
   body.compact nav.tab ul li,
   nav.tab ul li{
      width: auto;
      height: auto;
      font-size: 11px;
      position: relative;
   }


   body.compact.min nav.tab ul,body.compact nav.tab ul,nav.tab ul{
      display: flex;
   }
   body.compact.min nav.tab li,body.compact nav.tab li,nav.tab li{
      overflow: inherit;
      position: relative;
      transition:1s;
      width: auto;
   }

   body.compact.min nav.tab li a,body.compact nav.tab li a,nav.tab li a{
      width:100%;
      height: 100%;
      box-sizing: border-box;
      border-radius: 8px 8px 0px 0;
      font-size: 12px;
      padding: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #fff;
      border-bottom: none;
   }

   input[type="text"], input[type="password"], input[type="number"], input[type="url"], input[type="email"],input[type="tel"], textarea{
   font-size: 14px;
   padding: 5px;
   }
   fieldset input, fieldset textarea{
      font-size: 14px;
      padding: 5px;
      margin-right: 5px;
      margin-left: 5px;
   }
   .downarrow{
   position: absolute;
   top: 4px;
   right: 15px;
   line-height: 2.2;
   }
   table.detail .formblockTH{
   background: #999;
   }
}
@media screen and (max-width:768px) {
   .pc-none {
      display: block;
   }
   .name-sei-sp{
      display: inline-block;
      margin-bottom: 10px;
   }
   .nami{
      padding: 0 2px;
   }
   /*date picer*/
   #ui-datepicker-div{
      z-index: 999!important;
   }
   #body{
      border-top:none;
   }
   fieldset legend{
      display: none;
   }
   .btnWrap .btn, .btn .hover{
      background: #1f2577;
      border: none;
      box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.14);
      letter-spacing: 0.2em;
      margin-top: 14px;
      margin-bottom:5px;
      width: 80%;
      padding: 7px 0;
   }
   .mypageupdatebutton{
      margin-bottom: 0px!important;
   }
   /* Added 20190405 sticky update button in webmypage application */
   .mypageupdatebutton{    
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   z-index: 2;
   background: rgba(0,0,0,0.3);
   margin: 5px auto 5px auto!important;
   padding:10px 0px;
   }
   .btnWrap .btn b{
      color:#fff;
   }
   .btnWrap{
      margin-bottom:80px;
      height:auto;
   }
   #body #contents div.info{
      margin: 0;
   }
   body.compact.min nav.tab li a.active{
   background: #fff;
      color: #142645;
      z-index: 2;
      position: relative;
      top: 2px;
      border: 2px solid #142645;
      border-bottom: none;
   }

   fieldset input[type="text"],fieldset input[type="email"],fieldset input[type="number"],fieldset input[type="tel"],fieldset input[type="file"],fieldset textarea{
      width: auto;
      background:#ffffff;
      margin:0;
      font-size: 16px;
   }
   [type="file"] + span{
      display: block;
      margin-top: 10px;
   }
   textarea,input[type="text"],textarea, input[type="email"],input[type="tel"],input[type="number"] {
      box-sizing: border-box;
      font-size:16px;
      padding:5px;
      padding: 5px;
   }
   select{
      font-size:16px;
   }

   table.detail tbody > tr{
      display: flex;
      flex-direction:column;
   }
   body.compact.min .ui-datepicker-calendar td {
      padding: 1px;
   }

   nav.tab{
      height: auto;
      margin: 0;
      width: 100vw;
      overflow: auto;
      position: relative;
   }
   nav.tab ul.tab-animate{
      animation: tabscroll .6s ease-in-out;
   }
   body.compact.min nav.tab li{
      width: auto;
      overflow:unset;
   }
   body.compact.min nav.tab li a{
      border: 1px solid #fff;
      border-bottom:0;
      border-radius: 8px 8px 0 0;
      font-size: 10px;
      width: auto;
      height: 100%;
      box-sizing: border-box;
      padding: 0 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: inherit;
      background: #eee;
      color: #555;
   }

   fieldset legend{
      margin-bottom: 0;
   }
   .ui-datepicker-trigger{
      margin: 0 0 0 10px;
   }
   fieldset select{
      font-size: 16px;
      padding: 3px 3px 7px;
      margin-bottom: 5px;
      margin-left: 0;
      margin-right: 0;
      max-width: 100%;
   }
   input[size="15"]{
      width: 40%;
      margin-right: 5px;
   }

   table.detail th {
      box-sizing: border-box;
      width: 100%;
      font-weight:normal;
      font-size:16px;
      border-top: #dcdcdc 1px solid;
      border-bottom: #dcdcdc 1px solid;
      padding: 5px 10px;
      background-color: #f0f0f0;
      margin:0;
      position: relative;
   }
   table.detail td{
      border: none;
      background: none;
      margin: 10px 0;
      padding-top:0;
   }
   span.required{
   top: -2px;
   border-radius: 5px;
   padding: 2px 7px 3px 5px;
   font-size: 11px;
   background-color:#e25151;
   }
   body.compact.min td{
      margin: 0;
      padding: 0;
   }
   nav.tab ul{
      display: flex;
      flex-direction: row;
      height: auto;
      justify-content: flex-start;
      width: max-content;
   }
   input[type="text"].w30{
      width:30%;
      margin-right:5px;
   }
   input[type="text"].w40{
      width:30%;
      margin-left:5px;
   }
   input[type="radio"] + span{
      padding: 3px;
   }
   div.alerts {
      margin: 30px 10px 10px;
   }
   div.alerts h2{
      text-indent: 0;
      padding-left: 56px;
      padding-top: 5px;
      padding-bottom: 4px;
      line-height: 1.2;
      height: auto;
      box-sizing: border-box;
   }   
   .w500{
      width:100%;
   }
   fieldset{
      width: auto;
      margin:0;
      border:none;
      padding:0;
   }
   .requiredElementCount{
   left: 0;
   z-index: 100; 
   }
   label{
      box-sizing: border-box;
      position: relative;
   }
   td label{
      padding: 0;
   }
   textarea{
      width: 100% !important;
   }
   .requiredElementCount{
      background: rgba(42, 101, 202, 0.6);
      color: #ffffff;
      padding: 5px;
      right: 0;
      width: 100%;
      position: fixed;
      top: 0;
      border-radius: 0;
      font-size: 12px;
      z-index: 999;
      text-align: center;
      box-sizing: border-box;

   }
   .privacyreq{
      padding-left: 30px;
   }
   #mainTitle, #mainTitle a{
   margin-right: 0;
   margin-top: 0;
   text-align: center;
   padding-left: 0;
   }
   .displayTable{
   display: flex !important;
   }
   .formError{
   /*transform: translate(-300px,0px) !important;*/
   /*display: table !important;*/
   position: relative !important;
   top:0 !important;
   left:0 !important;
   }
   .downarrow{
   position: absolute;
   top: 6px;
   right: 7px;
   }
   [name="sei_nen"], [name="sei_tuki"], [name="sei_nichi"], [name="ken_jis"]{
   width:30%;
   }
   [name="city_cd"]{
   width:50%;
   }
   #zip_fst3{
   width:30%;
   }
   #zip_snd4{
   width:40%;
   margin-left:10px;
   }
   table.detail .one-third {
   width: 30%;
   margin-right: 0;
   min-width:0;
   }
   .confirm_footer{
   display: none;
   }
   input[type="radio"] + span,input[type="checkbox"] + span{
      font-size: 14px;
      line-height: 1.3;
   }
   input[type="checkbox"] + span{
      font-size: 14px;
      line-height: 1.3;
      padding: 3px 5px 2px 27px;
   }
   input[type="radio"]:checked + span:after {
      top: 7px;
      left: 7px;
  }
  .downarrow:before,.downarrow.arrowopen:before{
     content:none;
  }
  .downarrow{
      width: 25px;
      height: 25px;
      padding: 0;
  }
  .downarrow:after{
      right: 9px;
      top: 8px;
  }
  .privacy_policy_wrapper label{
      font-size: 16px;
      padding: 7px 4px 10px 30px;
  }
  fieldset input[type="text"].seikanji,fieldset input[type="text"].seikana{
     margin-bottom: 10px;
  }
  li.form_step{
   font-size: 11px;
   padding: 7px 10px 7px 15px;
   display: flex;
   align-items: center;
   text-align: center;
   height: 30px;
}
li.form_step:after{
   border: 18px transparent solid;
   border-left: 7px #eaeaea solid;
   right: -22px;
   top:50%;
   transform: translate(0,-50%);
}
li.form_step:before{
   border: 18px transparent solid;
   border-left: 7px #fff solid;
   right: -24px;
   top:50%;
   transform: translate(0,-50%);
}
li.form_step.page-on:after, li.form_step.page-on:before {
   border-left: 7px #619bff solid;
}
.inputwrapper {
    padding: 10px;
    max-width: 100vw;
}
#body #contents.webmypage_confirm{
   margin-bottom: 80px;
}
.infomessage{
   text-align:center;
   margin: 10px 0;
}
#mainTitle{
   margin-top: 25px;
}
.btnWrap{
   display:flex;
   justify-content: center;
}
}