@charset 'UTF-8';

/*-- Questionnaire START --*/
#flow_area { position:relative; text-align:center; border:1px solid #ddd; color: #333; padding:0; margin:30px 0 40px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color:#efefef;}
#flow_area p { text-align:center; padding-top:30px; margin:0;}
#flow_area .thanks p { padding:60px 0;}
#flow_area .btns { text-align:center; padding:30px 0;}
#flow_area a { display:inline-block; background: #fff; border: 1px solid #bbb; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; width:100%; color: #333; text-decoration: none;}
#flow_area .btns a { padding: 15px 20px; margin:0 10px; max-width:220px; border:1px solid #bbb;}
#flow_area .btns-reason { padding: 30px 10px 0; margin:0 50px 10px; text-align:center;}
#flow_area .btns-reason a { padding: 15px 20px; margin:0 10px 20px; max-width:220px;}
#flow_area .btns a, #flow_area .btns-reason a { cursor:pointer;}
#flow_area .q1 .btns a:active,
#flow_area .q1 .btns a:focus,
#flow_area .q2 .btns-reason a:active,
#flow_area .q2 .btns-reason a:focus{ background:#5b5b5b; color:#fff; border:1px solid #555;}
.pc #flow_area .q1 .btns a:hover,
.pc #flow_area .q2 .btns-reason a:hover{ background:#5b5b5b; color:#fff; border:1px solid #555; transition:all .7s cubic-bezier(.23,1,.32,1);}
.sp #flow_area .q1 .btns a:hover,
.sp #flow_area .q2 .btns-reason a:hover{ background:#5b5b5b; color:#fff; border:1px solid #555;}
#flow_area .q1, #flow_area .q2, #flow_area .thanks{display:block;}
#flow_area .q2, #flow_area .thanks{display:none;}
#flow_area .spbr{ display:block;}
@media only screen and (max-width:994px){
#flow_area .vline{left:145px;}
}
@media only screen and (max-width:767px){
#flow_area {padding:0 20px 10px;margin:25px 0 0;}
#flow_area p {font-size:1.4rem;padding-top:20px;}
#flow_area .thanks p { padding:80px 0;}
#flow_area .q1 .btns { padding:30px 0 10px;}
#flow_area a { display:block;}
#flow_area .btns a { padding: 12px 0; margin:0 0 15px; max-width:100%;}
#flow_area .btns-reason { display:block; margin:25px 0; padding: 0;}
#flow_area .btns-reason a { display:block; padding: 10px 0; margin:0 auto 15px; max-width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#flow_area .btns-reason #errorTxt { color:#C00; }
#flow_area .spbr { display:none;}
}
/*-- Questionnaire END --*/