@charset "utf-8";

/* reset css start */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, code, img, q, s,
small, strong, sub, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{ margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}
ol, ul { list-style: none;}
table { border-collapse: collapse; border-spacing: 0;}
button { border: none; background-color: transparent; outline: none;}
/* reset css end */

/* for Javascript start */
@keyframes show { 0% { opacity: 0;} 1% { display: block; opacity: 0;} 100% { opacity: 1;}}
@keyframes hide { 0% { opacity: 1;} 99% { display: none; opacity: 0;} 100% { opacity: 0;}}
/* for Javascript end */

@keyframes to_down { 0% { transform:translateY(-10px);} 100% { transform:translateY(10px);}}
@keyframes bound { from, to { transform: scale(1, 1)} 25%{ transform: scale(0.85, 1.05)} 50%{ transform: scale(1.05, 0.9)} 75%{ transform: scale(0.9, 1.1)}}

html, body { height: 100%; -webkit-overflow-scrolling: auto;}
body {}
body * {box-sizing: border-box;-webkit-overflow-scrolling: touch;font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3", sans-serif;}

[class^=js-] {-webkit-tap-highlight-color:rgba(0,0,0,0);}

header { height: 80px; border-bottom: solid 2px #e5e5e5; padding-right: 180px;  display: flex; position:relative;}
header .header-page-title {color:#656565; font-size: 11px; margin-top: auto; margin-bottom: 8px; margin-left: 20px;}
header .jobsatisfaction-logo{width:151px; height:100%; position:absolute; top:0; right : 25px; display:flex; align-items: center; justify-content: center;}
header .jobsatisfaction-logo img{height:23px; width:auto; display: block;}

#logo,
#logo a { display: inline-block; height: 100%; }
#logo img.top-logo-pc { line-height: 1.3em; padding: 13px 0 0 15px; }
#logo img.top-logo-sp { display: none; }
h1 { font-size: 20px; margin-bottom: 10px; }
h1 .large { display: block; font-size: 60px;}
h1 .large .line { display: inline-block; padding: 0 15px; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff100), color-stop(50%, transparent)); background-image: linear-gradient(to right, #fff100 50%, transparent 50%); background-position: 0% 80%; background-repeat: no-repeat; background-size: 200% 12px; }
p.caption { color: #008ecd; font-size: 14px; }
p.regist_caption { color: #656565; font-size: 12px; }
span.regist_caption { color: #656565; font-size: 12px; }

div.main { width: 100%; overflow-x: hidden; background-image: url(https://doda.jp/jobsatisfaction/img/diagonal-lines.svg); background-size: 8px; position:relative;}
/*div.main * { user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none;}*/

div.main div.step_pages_subtitle { overflow: hidden; width: 400px; margin: 40px auto 0;}
div.main div.step_pages_subtitle div.step_pages_subtitle_icon { float: left; width: 62px; height: 62px; background-size: 62px auto; background-repeat: no-repeat;}
div.main div.step_pages_subtitle div.step_pages_subtitle_info_1 { float: right; width: 338px; height: 62px; background-size: 275px auto; background-repeat: no-repeat; background-position: center;}
div.main div.step_pages_subtitle div.step_pages_subtitle_info_2 { clear: both; width: 400px; height: 30px; margin-top: 84px; border-radius: 15px; background-color: #ffffff; background-repeat: no-repeat; background-position: center;}

div.main div.step1_page div.step_pages_subtitle div.step_pages_subtitle_icon { background-image: url(../img/step1_1.svg); background-size: 62px auto;}
div.main div.step1_page div.step_pages_subtitle div.step_pages_subtitle_info_1 { background-image: url(../img/step1_2.svg); background-size: 275px auto;}
div.main div.step1_page div.step_pages_subtitle div.step_pages_subtitle_info_2 { background-image: url(../img/step1_3.svg); background-size: 255px auto;}

div.main div.step2_page div.step_pages_subtitle div.step_pages_subtitle_icon { background-image: url(../img/step2_1.svg); background-size: 62px auto;}
div.main div.step2_page div.step_pages_subtitle div.step_pages_subtitle_info_1 { background-image: url(../img/step2_2.svg); background-size: 275px auto;}
div.main div.step2_page div.step_pages_subtitle div.step_pages_subtitle_info_2 { background-image: url(../img/step2_text_pc.svg); background-size: auto 11px;}

div.main div.step3_page div.step_pages_subtitle div.step_pages_subtitle_icon { background-image: url(../img/step3_1.svg); background-size: 62px auto;}
div.main div.step3_page div.step_pages_subtitle div.step_pages_subtitle_info_1 { background-image: url(../img/step3_2.svg); background-size: 275px auto;}
div.main div.step3_page div.step_pages_subtitle div.step_pages_subtitle_info_2 { background-image: url(../img/step3_3.svg); background-size: 340px auto;}

div.main div.finish_page div.step_pages_subtitle div.step_pages_subtitle_icon { background-image: url(../img/finish.svg); background-size: 62px auto;}
div.main div.finish_page div.step_pages_subtitle div.step_pages_subtitle_info_1 { background-image: url(../img/step4_2.svg); background-size: 275px auto;}
div.main div.finish_page div.step_pages_subtitle div.step_pages_subtitle_info_2 { background-image: url(../img/step4_3.svg); background-size: 300px auto;}

div.main div.first_page {padding:35px 15px; position:relative;}
div.main div.first-page-back {width:100%; min-width:1819px; position:absolute; z-index:1; top:104px; left:0; opacity:0;}
div.main div.first-page-back.visible {opacity:1;}
div.main div.first-page-back.visible.hasRestart {top:145px;}
div.main div.first-page-back img {width: 1819px;}
div.main div.first_page div.first-page-titleBox {max-width:640px; width:100%; padding:45px 0 40px; text-align: center; margin:auto; background-color: #fff; border: 4px solid #A1D7F4; border-radius: 20px; position:relative; z-index:2;}
div.main div.first_page div.first-page-copy {background-color: #EBF9FF; width:400px; height:67px; margin:auto; border-radius: 5px; margin-bottom: 14px; position:relative; overflow: visible; padding-top: 4px;}
div.main div.first_page div.first-page-copy p {color:#008FD6; font-size: 18px; font-weight:700;}
div.main div.first_page div.first-page-copy:after {content: ""; position: absolute; right: 0; left: 50%; transform: translateX(-50%); width: 0; height: 0; bottom: -9px; border-style: solid; border-color: #EBF9FF transparent transparent transparent; border-width: 12px 10px 0 10px;}
div.main div.first_page div.first-page-copy p br.pc_none {display:none;}
div.main div.first_page div.first-page-copy p span {font-size: 34px; transform: translateY(2px); display: inline-block;}
div.main div.first_page .first-page-caption {font-size: 18px; line-height:1.5; font-weight:700; margin-bottom: 25px; color:#333;}
div.main div.first_page div.first_page_subtitle { width: 460px; height: 136px; margin: 0 auto; background-image: url(../img/title.svg); background-size: auto 120px; background-position: center; background-repeat: no-repeat;}
div.main .jobsatisfaction-copy {font-size: 20px; font-weight:700; line-height:39px; color:#008FD6; margin:auto; width:fit-content; position:relative;}
div.main .jobsatisfaction-copy:before {content: ""; position: absolute; width:28px;  height:38px; left:-38px; top:0; background-image: url('https://doda.jp/cmn_web/img/type/title_img_left_pc.webp'); background-size:contain; background-repeat: no-repeat;} 
div.main .jobsatisfaction-copy:after {content: ""; position: absolute; width:28px;  height:38px; right:-38px; top:0; background-image: url('https://doda.jp/cmn_web/img/type/title_img_right_pc.webp'); background-size:contain; background-repeat: no-repeat;} 
div.main .jobsatisfaction-copy span {font-size: 30px;}
div.main .jobsatisfaction-title {width:430px; margin:15px auto 25px; padding-bottom:4px; line-height: 0; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff100), color-stop(50%, transparent)); background-image: linear-gradient(to right, #fff100 50%, transparent 50%); background-position: 0% 100%; background-repeat: no-repeat; background-size: 200% 16px; }
div.main .jobsatisfaction-title img {width:100%;}
.first_page_start_btn {width:400px; height:70px; border:solid 3px #008FD6; background-color:#FFF100; border-radius:35px; padding:15px 0 16px; text-align: center; margin:auto; position:relative;}
.first_page_start_btn:after {content:''; position:absolute; width:21px; height:21px; top:21px; right:20px; background-image:url('https://doda.jp/cmn_web/img/type/arrow_right_L_blue.svg'); background-size:contain; background-repeat: no-repeat;}
.first_page_start_btn:hover {cursor: pointer; animation: bound 0.5s 1; background-color: #FFF880;}
.first_page_start_btn span {font-size: 22px; color:#008FD6; font-weight:700; line-height:1.5;}
.first_page_restart_btn { width:400px; height:70px; border:solid 3px #008FD6; background-color:#FFF; border-radius:35px; padding:19px 0 18px; text-align: center; margin:12px auto 0; position:relative;}
.first_page_restart_btn:after {content:''; position:absolute; width:21px; height:21px; top:21px; right:20px; background-image:url('https://doda.jp/cmn_web/img/type/arrow_right_L_blue.svg'); background-size:contain; background-repeat: no-repeat;}
.first_page_restart_btn:hover {cursor: pointer; animation: bound 0.5s 1; background-color: #F2FCFF;}
.first_page_restart_btn span {font-size: 18px; color:#008FD6; font-weight:700; line-height:1.5; display:block;}
.first_page_restart_btn br {display:none;}
div.main div.first_page .regist_caption {margin-top: 15px; line-height:1.4; color:#808080; font-weight:500;}

div.main div.first-feature { padding:60px 15px; background-color: #fff;}
div.main div.first-feature-content {max-width:1000px; margin:auto;}
div.main div.first-information .first-information-title {font-size: 30px; line-height:1.5; font-weight:700; color:#008FD6; text-align: center; margin-bottom: 40px;}
div.main div.first-information .first-feature-box {display:flex; justify-content: space-between; margin-bottom: 80px;}
div.main div.first-information .first-feature-item {width:calc(50% - 15px); box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.15); display:flex; flex-direction: column;}
div.main div.first-information .first-feature-item .feature-title {width:100%; height:62px; background-color: #008FD6; text-align: center; font-size: 18px; font-weight:700; color:#fff; border-radius:5px 5px 0 0; padding-top: 10px;}
div.main div.first-information .first-feature-item .feature-title .large {font-size: 28px; margin-left: 5px;}
div.main div.first-information .first-feature-item .feature-title .num {font-size: 24px; margin-right: 10px;}
div.main div.first-information .first-feature-item .feature-content {padding:25px 35px 30px; display:flex; flex-direction: column; justify-content: space-between; flex-grow: 1; border: 2px solid #008FD6; border-radius:0 0 5px 5px; background-color: #fff;}
div.main div.first-information .first-feature-item .feature-content .feature-text {font-size: 14px; line-height:1.5; margin-bottom: 30px;}
div.main div.first-information .first-feature-item .feature-content .feature-content-lower {overflow: visible;}
div.main div.first-information .first-feature-item .feature-content .feature-img {width:100%; margin-bottom: 30px;}
div.main div.first-information .first-feature-item .feature-content .feature-point {padding:25px 25px 20px; border-radius: 3px; background: #F5F5F5; border-radius:3px; position:relative; overflow:visible;}
div.main div.first-information .first-feature-item .feature-content .feature-point:before {content: ""; position: absolute; width:71px; height:65px; left:45px; top:-11px; background-image: url('https://doda.jp/cmn_web/img/type/icon_point.webp'); background-size:contain; background-repeat: no-repeat;}
div.main div.first-information .first-feature-item .feature-content .feature-point h4 {font-size: 18px; font-weight:700; margin-bottom: 15px; line-height:1.5; text-align: center;}
div.main div.first-information .first-feature-item .feature-content .feature-point p {font-size: 14px; line-height: 1.5;}
div.main div.first-information .first-feature-btn .btn-wrapper {overflow: visible;}
div.main div.first-information .jobsatisfaction-copy {margin-bottom: 20px;}
div.main div.first-information .regist_caption {text-align: center; margin-top: 15px;}
div.main div.first-qa {padding:60px 15px 70px;}
div.main div.first-qa .qa-content {max-width:1000px; margin:auto;}
div.main div.first-qa .qa-item {padding: 25px 0; border-top:2px solid #fff; font-size: 16px; line-height:1.5;}
div.main div.first-qa .qa-item:last-child {border-bottom:2px solid #fff;}
div.main div.first-qa .qa-item .qa-question {font-weight:700; margin-bottom: 15px; display:flex; align-items:center;}
div.main div.first-qa .qa-item .qa-question .qa-question-icon {content: ""; width:50px; height:50px; margin-right: 20px; background-image: url('https://doda.jp/cmn_web/img/type/icon_question_pc.webp'); background-size:contain; background-repeat: no-repeat;}
div.main div.first-qa .qa-item .qa-question p {width:calc(100% - 70px);}
div.main div.first-qa .qa-item .qa-answer {display:flex; align-items:center;}
div.main div.first-qa .qa-item .qa-answer .qa-answer-icon {content: ""; width:50px; height:50px; margin-right: 20px; background-image: url('https://doda.jp/cmn_web/img/type/icon_answer_pc.webp'); background-size:contain; background-repeat: no-repeat;}
div.main div.first-qa .qa-item .qa-answer p {width:calc(100% - 70px);}

div.main div.first-information div.first-information-box-ie { background-color: #fff; margin: 20px 5%; box-shadow: 0 1px 2px #e0e0e0; border-radius: 1px; max-width: 1000px; padding: 8px 55px 8px 88px; font-size: larger; font-weight: bold; text-align: center;}
.nav-area {
  position: fixed !important;
  position: -webkit-fixed !important;
  bottom: 0;
  width: 100%;
  background-color: rgba(0,0,0,.5);
  padding-bottom: 10px;
  z-index: 2147483647;
  text-align: center;
  transform:translateZ(1px);
}

.nav-area__description {
  padding: 15px 15px;
  margin: 15px auto 20px;
  text-align: left;
  line-height: 1.5;
  background-color: #fff;
  color: #707070;
  background-repeat: no-repeat;
  max-width: 700px;
}

.nav-area__descriptio-notice {
  padding-top: 10px;
  font-size: 14px;
  color: #707070;
}

.nav-area__to-doda-btn {
  width: 400px;
  height: 74px!important;
  margin-bottom: 15px;
  color: #fff !important;
  border-radius: 10px;
  font-weight: 700 !important;
  transition: .4s;
  background-color: rgb(253, 121, 49);
  border-color: rgb(253, 121, 49);
  position: relative;
  overflow: hidden;
}

.nav-area__to-doda-btn:hover {
  background-color:rgb(253, 132, 65);
  border-color: rgb(253, 132, 65);
}

.ripple {
position: absolute;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.7);
  animation: ripple 700ms ease-out;
}

@keyframes ripple {
  from {
    transform: scale(0);
      opacity: 1;
    }
    to {
      transform: scale(2);
      opacity: 0;
  }
}

.nav-area__to-doda-btn .v-btn__content {
    display: block;
    cursor: pointer;
    line-height: 25px;
}

.nav-area__text01 {
    font-size: 17px;
  pointer-events: none;
}

.nav-area__text02 {
    font-size: 11px;
    pointer-events: none;
}


/*設問ページ改修*/
.step_pages_title{
  width:100%;
  max-width:640px;
  padding:60px 80px 50px;
  background-color: #fff;
  border-radius:20px;
  margin:50px auto;
}

.step_pages_title_head img{
  width:auto;
  height:44px;
}

.step_pages_title_head{
  width:fit-content;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff100), color-stop(50%, transparent)); background-image: linear-gradient(to right, #fff100 50%, transparent 50%); background-position: 0% 100%; background-repeat: no-repeat; background-size: 200% 16px;
  padding-bottom: 8px;
  margin:0 auto 15px;
}

.step_pages_title_total{
  background-color: #EBF9FF;
  border-radius:8px;
  margin:0 auto 16px;
  font-size: 20px;
  line-height:48px;
  font-weight:700;
  color:#008FD6;
  padding:0 16px;
  width:fit-content;
  text-align: center;
  position:relative;
  overflow: visible!important;
}

.step_pages_title_total span{
  font-size: 32px;
  line-height:48px;
  margin-right: 2px;
  transform:translateY(2px);
  display:inline-block;
}

.step_pages_title_total::after{
  content: "";
  position: absolute!important;
  bottom:-10px;
  left:50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-top: 10px solid #EBF9FF;
  border-bottom: 0;
}

.step_pages_title_text{
  font-size: 20px;
  line-height:1.5;
  font-weight:700;
  text-align: center;
  margin-bottom: 20px;
}

.step_pages_title_note{
  color:#808080;
  text-align: center;
  font-size: 12px;
}

/*STEP1 改修*/
div.main .question-page-back {width:100%; min-width:1732px; position:absolute; z-index:1; top:50px; left:0; pointer-events: none; opacity:0;}

div.main .question-page-back img{
  width:1732px;
  opacity:0.5;
}

.step1_qandas{
  width:100%;
  max-width:830px;
  margin:auto;
  overflow:visible!important;
}

.step1_qandas .step1_item{
  display:flex;
  background-color:#fff;
  align-items: center;
  justify-content: space-between;
  border-radius:6px;
  position:relative;
  padding:20px 22px 20px 26px;
  margin-bottom: 14px;
  overflow:visible!important;
}
.step1_qandas .step1_item:before{
  content:'';
  width:6px;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  background-color: #008FD6;
  border-radius: 6px 0 0 6px;
  display:block;
}

.step1_qandas .step1_item.next:after{
  content:'';
  left:-45px;
  top:50%;
  transform: translateY(-50%);
  position:absolute;
  display:block;
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 14px solid #007FC3;
  border-right: 0;
}

.step1_qandas .step1_item .step1_question{
  width:calc(100% - 385px);
  display:flex;
  justify-content: space-between;
  align-items: center;
}

.step1_qandas .step1_item .itemNum{
  font-size: 16px;
  color:#008FD6;
  font-weight:700;
}

.step1_qandas .step1_item h5{
  font-size:18px;
  font-weight: 700;
  line-height:1.5;
  width:calc(100% - 100px);
}


.step1_qandas .step1_item .step1_answer{
  width:360px;
}

.step1_qandas .step1_item .step1_answer ul{
  width:100%;
  display:flex;
  justify-content: space-between;
} 

.step1_qandas .step1_item .js-step1_a{
  width:170px;
  border:solid 2px #008FD6;
  border-radius:35px;
  font-size:20px;
  font-weight:700;
  line-height:66px;
  text-align: center;
  cursor: pointer;
  text-shadow:1px 1px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff;
  background-size:auto 49px;
  background-position: center;
  background-repeat: no-repeat;
}

.step1_qandas .step1_item .js-step1_a:hover{
  opacity:0.7;
}

.step1_qandas .step1_item .js-step1_a:nth-child(1){
  color:#FF4000;
  background-image:url('https://doda.jp/cmn_web/img/type/circle.webp');
}

.step1_qandas .step1_item .js-step1_a:nth-child(1).selected{
  border: 2px solid #F4E96D;
  background-color: #FFFBCF;
  pointer-events: none;
  background-image: none;
}

.step1_qandas .step1_item .js-step1_a:nth-child(2){
  color:#00788C;
  background-image:url('https://doda.jp/cmn_web/img/type/cross.webp');
}

.step1_qandas .step1_item .js-step1_a:nth-child(2).selected{
  border: 2px solid #9ACFD7;
  background-color: #CFECF0;
  pointer-events: none;
  background-image: none;
}

#step1_fixed{
  width:100%;
  height:0;
  overflow: visible!important;
  position:fixed!important;
  bottom:0;
  left:0;
  z-index:100;
  display:none;
}

.question_count{
  width:120px;
  height:120px;
  border-radius:60px;
  padding-top: 14px;
  background-color: #008FD6;
  position:absolute!important;
  right:25px;
  bottom:150px;
  display:block;
  text-align:center;
  color:#fff;
  font-size: 24px;
  font-weight:700;
  line-height:1.5;
}

.question_count span{
  display: inline-block;
}

.question_count .count_origin{
  font-size: 14px;
  line-height: 40px;
  transform: translateX(5px);
}

.question_count .count_origin .num{
  font-size: 40px;
  color:#FFF100;
  margin-right: 2px;
}

.question_count .count_incomplete{
  display:block;
}

.question_count .count_complete{
  display:none;
}

.question_count .count_progress{
  display:none;
  font-size: 14px;
  line-height:40px;
}

.question_count .count_progress .num{
  font-size: 30px;
  margin-right: 2px;
}

.question_count .count_progress #js-step1_count_num{
  font-size: 40px;
  color:#FFF100;
}

.question_count .count_progress #js-step3_count_num{
  font-size: 40px;
  color:#FFF100;
}

.question_count.in-progress .count_origin{
  display:none;
}

.question_count.in-progress .count_progress{
  display:block;
}

.question_count.completed .count_complete{
  display:block;
}

.question_count.completed .count_incomplete{
  display:none;
}

.next_btn_yellow{
  width:400px; 
  height:70px; 
  border:solid 3px #ccc; 
  background-color:#e5e5e5; 
  border-radius:35px; 
  padding:15px 0 16px; 
  text-align: center; 
  margin:auto; 
  position:relative;
}

.next_btn_yellow:after {content:''; position:absolute; width:21px; height:21px; top:21px; right:20px; background-image:url('https://doda.jp/cmn_web/img/cm/icon/arrow_right_L_grey.svg'); background-size:contain; background-repeat: no-repeat;}

.next_btn_yellow.active{
  border:solid 3px #008FD6; 
  background-color:#FFF100; 
  pointer-events: auto;
  cursor:pointer;
}

.next_btn_yellow.active:after {content:''; position:absolute; width:21px; height:21px; top:21px; right:20px; background-image:url('https://doda.jp/cmn_web/img/type/arrow_right_L_blue.svg'); background-size:contain; background-repeat: no-repeat;}

.next_btn_yellow.active:hover{
  background-color:#FFF880;
}

.next_btn_yellow > span{
  font-size: 22px; color:#AAAAAA; font-weight:700; line-height:1.5;
  display:block;
}

.next_btn_yellow.active:hover > span{
  color:#008FD6;
}

.next_btn_yellow.active > span{
  color:#008FD6;
}

#js-step1_page.invisible{
  height:50vh;
}

.fixed_btn_wrapper{
  width:100%;
  height:140px;
  background-color:rgba(255,255,255,0.9);
  display:flex;
  justify-content: center;
  align-items: center;
  position:absolute!important;
  left:0;
  bottom:0;
  transition:.3s;
  transform:translateY(100%);
}

.completed.show .fixed_btn_wrapper{
  transform: translateY(0);
}

.btn_wrapper{
  margin:50px auto;
  position:relative;
}

.btn_notice{
  width:100%;
  text-align: center;
  position:absolute;
  left:0;
  bottom:-28px;
  display:none;
  display:flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  display:none;
}

.btn_notice span{
  font-size: 12px;
  line-height:20px;
  font-weight:500;
  color:#ff0000;
}

.btn_notice img{
  width:20px;
  margin-right: 2px;
}

.notice .btn_notice{
  display: flex;
}

/*STEP2 ランキング並べ替え_改修*/
.sort_rankSelect{
  position:absolute!important;
  top:57px;
  left:-80px;
  display:none;
  z-index:5;
  padding-top: 10px;
  overflow: visible!important;
}

.sort_rankSelect ul{
  width:100px;
  background-color:#fff;
  border-radius: 4px;
  box-sizing: border-box;
  box-shadow: 0 2px 6px rgb(0 0 0 / 15%);
  position:relative;
}

.sort_rankSelect::after{
  content: "";
  position: absolute!important;
  top: 1px;
  left:8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 9px solid transparent;
  border-left: 9px solid transparent;
  border-bottom: 9px solid #ffffff;
  border-top: 0;
}

.sort_rankSelect ul li{
  text-align: center;
  font-size: 14px;
  line-height:1.5;
  font-weight:700;
  padding:5px 0;
  height:31px;
  border-bottom: 1px solid #E8E8E8;
  color:#333333;
  cursor: pointer;
  position:relative;
}

.sort_rankSelect ul li.clear{
  display:none;
}

#js-step2_page_sort_list > li.rank-selected .sort_rankSelect ul li.clear{
  display:block;
}

.sort_rankSelect ul li.disabled{
  color:#AAAAAA;
  pointer-events: none;
}

.simplebar-track.simplebar-vertical{
  background-color: transparent;
  width:7px;
}


.simplebar-track .simplebar-scrollbar::before{
  background-color: #878787;
  width:4px;
  right:3px;
  left:0;
}

.simplebar-content-wrapper{
  scroll-behavior: smooth;
}

.sort_rankingNum{
  position:absolute;
  top:5px;
  left:-80px;
  display: flex;
  align-items: flex-end;
  z-index:1;
  font-size: 12px;
  color:#008FD6;
}

.sort_rankingNum .num{
  display: inline-block;
  width:50px;
  height:50px;
  box-sizing: border-box;
  border-radius: 25px;
  border:solid 3px #ccc;
  background-color: #fff;
  color:#008FD6;
  font-size:31px;
  font-weight:700;
  text-align:center;
  line-height:46px;
}

#js-step2_page_sort_list > li.menuOpen .sort_rankSelect{
  display:block;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li { 
  display: flex; 
  align-items: center; 
  position: relative; 
  height: 60px; 
  margin: 25px 0; 
  box-sizing: border-box;
  width:100%;
  padding: 0 16px; 
  font-weight: bold;
  background-color: #ffffff; 
  border-radius: 6px 8px 8px 6px;
  cursor: pointer;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li::before{
  content:'';
  width:6px;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  background-color: #008FD6;
  border-radius: 6px 0 0 6px;
  display:block;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .sort_listText{
  display:flex;
  align-items: center;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .sort_listId{
  font-size: 16px;
  line-height:27px;
  color:#008FD6;
  width:80px;
  display: block;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .sort_listTitle{
  font-size: 18px;
  line-height:1.5;
  width:calc(100% - 80px);
  display: block;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li.rank-selected{
  background-color: #FFFCD1;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li.rank-selected::after{
  content:'';
  width:100%;
  height:100%;
  border:solid 1px #008FD6;
  border-radius:6px 8px 8px 6px;
  position:absolute;
  top:0;
  left:0;
}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li.rank-selected .sort_rankingNum .num{
  background-color: #FFFCD1;
  border:solid 3px #008FD6;
}

.js-step2_clear_btn{
  width:200px; 
  height:70px; 
  border:solid 3px #ccc; 
  background-color:#e5e5e5; 
  border-radius:35px; 
  padding:15px 0 16px; 
  text-align: center; 
  margin:auto; 
  position:relative;
  pointer-events: none;
}

.js-step2_clear_btn span{
  font-size: 22px; color:#AAAAAA; font-weight:700; line-height:1.5;
}

.js-step2_clear_btn.active{
  border:solid 3px #008FD6;
  background-color:#fff; 
  pointer-events: auto;
  cursor:pointer;
}

.js-step2_clear_btn.active:hover{
  background-color:#F2FCFF;
}

.js-step2_clear_btn.active span{
  color:#008FD6;
}

#step2_fixed{
  width:100%;
  height:0;
  overflow: visible!important;
  position:fixed!important;
  z-index:10;
  bottom:0;
  left:0;
  display:none;
  z-index:100;
}

.step2_fixed_btn{
  height:120px;
  width:100%;
  background-color:rgba(255,255,255,0.9);
  position:absolute!important;
  left:0;
  bottom:0;
  padding-top: 20px;
  transition:.3s;
  transform:translateY(100%);
}

.step2_btn_wrapper{
  display:flex;
  justify-content: space-between;
  height:70px;
  width:620px;
  margin:100px auto;
}

.show .step2_fixed_btn{
  transform:translateY(0);
}

.step2_fixed_btn .step2_btn_wrapper{
  margin:auto;
}

.step2_clear_modal{
  width:100%;
  height:100vh;
  position:fixed!important;
  z-index:100;
  top:0;
  left:0;
  background-color:rgba(0,0,0,0.8);
  justify-content: center;
  align-items: center;
  display:none;
  opacity:0;
  transition:.3s;
}

.step2_clear_modal_content{
  padding:40px 24px;
  background-color: #fff;
  border-radius:5px;
  width:fit-content;
}

.step2_clear_modal_baloon{
  background-color: #EBF9FF;
  border-radius:8px;
  margin:0 auto 16px;
  font-size: 20px;
  line-height:48px;
  font-weight:700;
  color:#008FD6;
  padding:0 16px;
  width:fit-content;
  text-align: center;
  position:relative;
  overflow: visible!important;
}

.step2_clear_modal_baloon::after{
  content: "";
  position: absolute!important;
  bottom:-10px;
  left:50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-top: 10px solid #EBF9FF;
  border-bottom: 0;
}

.step2_clear_modal_text{
  font-size: 20px;
  line-height:1.5;
  text-align:center;
  width:224px;
  font-weight:700;
  margin:0 auto 24px;
}

.step2_clear_modal_btn{
  width:356px;
  display:flex;
  justify-content: space-between;
}

.step2_clear_modal_btn > div{
  width:170px; 
  height:70px; 
  border:solid 3px #008FD6; 
  background-color:#fff; 
  border-radius:35px; 
  padding:19px 0; 
  text-align: center; 
  margin:auto; 
  position:relative;
  cursor:pointer;
}

.step2_clear_modal_btn > div:hover{
  background-color:#F2FCFF;
}

.step2_clear_modal_btn > div span{
  font-size: 20px; color:#333333; font-weight:700; line-height:26px;
}

#js-step2_page.invisible{
  height:50vh;
}

/*STEP3*/
.step3_qandas{
  width:100%;
  max-width:830px;
  margin:auto;
  overflow:visible!important;
}

.step3_qandas .step3_item{
  background-color:#fff;
  border-radius:6px;
  position:relative;
  padding:14px 20px 26px;
  margin-bottom: 20px;
  overflow:visible!important;
}
.step3_qandas .step3_item:before{
  content:'';
  width:6px;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  background-color: #008FD6;
  border-radius: 6px 0 0 6px;
  display:block;
}

.step3_qandas .step3_item.next:after{
  content:'';
  left:-45px;
  top:50%;
  transform: translateY(-50%);
  position:absolute;
  display:block;
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 14px solid #007FC3;
  border-right: 0;
}

.step3_qandas .step3_item .itemNum{
  font-size: 16px;
  color:#008FD6;
  font-weight:700;
}

.step3_qandas .step3_item h5{
  font-size:18px;
  font-weight: 700;
  line-height:1.5;
  text-align: center;
  margin-bottom: 20px;
}

.step3_qandas .step3_item .step3_answer{
  width:550px;
  margin:auto;
}

.step3_qandas .step3_item .step3_answer ul{
  width:100%;
  display:flex;
  justify-content: space-between;
} 

.step3_qandas .step3_item .js-step3_a{
  width:170px;
  border:solid 2px #008FD6;
  border-radius:35px;
  font-size:20px;
  font-weight:700;
  line-height:66px;
  text-align: center;
  cursor: pointer;
  text-shadow:1px 1px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff;
  background-size:auto 49px;
  background-position: center;
  background-repeat: no-repeat;
}

.step3_qandas .step3_item .js-step3_a br.pc_none{
  display:none;
}

.step3_qandas .step3_item .js-step3_a:hover{
  opacity:0.7;
}

.step3_qandas .step3_item .js-step3_a:nth-child(1){
  color:#FF4000;
  background-image: url('https://doda.jp/cmn_web/img/type/circle.webp');
}

.step3_qandas .step3_item .js-step3_a:nth-child(1).selected{
  border: 2px solid #F4E96D;
  background-color: #FFFBCF;
  pointer-events: none;
  background-image: none;
}

.step3_qandas .step3_item .js-step3_a:nth-child(2){
  color:#797979;
  background-image: url('https://doda.jp/cmn_web/img/type/question.webp');
}

.step3_qandas .step3_item .js-step3_a:nth-child(2).selected{
  border: 2px solid #8E8E8E;
  background-color: #8E8E8E;
  color:#fff;
  pointer-events: none;
  text-shadow:none;
  background-image: none;
}

.step3_qandas .step3_item .js-step3_a:nth-child(3){
  color:#00788C;
  background-image: url('https://doda.jp/cmn_web/img/type/cross.webp');
}

.step3_qandas .step3_item .js-step3_a:nth-child(3).selected{
  border: 2px solid #9ACFD7;
  background-color: #CFECF0;
  pointer-events: none;
  background-image: none;
}

#step3_fixed{
  width:100%;
  height:0;
  position:fixed!important;
  overflow:visible!important;
  bottom:0;
  left:0;
  display:none;
  z-index:100;
}

#js-step3_page.invisible{
  height:50vh;
}

/*基本情報入力*/
.finish_page_select_wrapper { 
  width:100%;
  max-width:700px;
  margin:0 auto 20px;
  height:80px;
  border-radius:8px;
  box-shadow: 0 2px 5px 0 rgba(0, 127, 195, 0.15);
  overflow:visible!important;
  position:relative;
}

.finish_page_select_wrapper .select_trigger{
  font-size: 20px;
    line-height:1.5;
    padding:23px 20px;
    font-weight:700;
    cursor: pointer;
    position: relative;
    background-color: #fff;
    border: 2px solid #A1D7F4;
    border-radius:8px;
}

.finish_page_select_wrapper .select_trigger::after{
  content:'';
  display:block;
  width:24px;
  height:24px;
  background-image:url('https://doda.jp/cmn_web/img/type/arrow_down_L_black.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position:absolute;
  top:28px;
  right:20px;
}

.finish_page_select_wrapper.selected .select_trigger{
  background-color: #fffcd1
}

.finish_page_select_wrapper .select_trigger:hover{
  background-color: #F0F9FF;
}

.custom_options{
  top: 86px;
  left: 0;
  width: 100%;
  border-radius: 8px;
  box-sizing: border-box;
  border:solid 1px #e5e5e5;
  box-shadow: 0 2px 6px rgb(0 0 0 / 15%);
  background: #fff;
  display:none;
  position:absolute!important;
  z-index:3;
  max-height:220px;
}

.custom_scroll{
  overflow-y: scroll;
  scrollbar-width: none;
  height:100%;
  max-height:220px;
}

.custom_option{
  font-size: 16px;
  line-height:1.5;
  font-weight:500;
  padding:10px 16px;
  color:#333333;
  cursor: pointer;
  position:relative;
}

.custom_option:hover{
  background-color: #F0F9FF;
}

.simplebar-track.simplebar-vertical{
  background-color: transparent;
  width:7px;
}


.simplebar-track .simplebar-scrollbar::before{
  background-color: #878787;
  width:4px;
  right:3px;
  left:0;
}

.simplebar-content-wrapper{
  scroll-behavior: smooth;
}

.opened .custom_options{
  display:block;
}

.finish_page .btn_wrapper{
  margin:30px auto 200px;
}

#js-finish_page.invisible{
  height:50vh;
}




@media screen and (max-width: 980px) {
    div.main div.first-information .first-feature-box { display:block;}
    div.main div.first-information .first-feature-item {width:100%; max-width:485px; margin:0 auto 20px;}
    div.main div.first-information .first-feature-item .feature-content .feature-point:before {left:-6px;}
    .step1_qandas .step1_item{
      display:block;
      padding:16px 9px 16px 15px;
      margin-bottom: 20px;
    }

    .step1_qandas .step1_item.next:after{
      left:-20px;
      border-top: 5px solid transparent;
      border-bottom: 5px solid transparent;
      border-left: 8px solid #007FC3;
      border-right: 0;
    }
    
    .step1_qandas .step1_item .step1_question{
      width:100%;
      margin-bottom: 14px;
      justify-content: center;
    }

    .step1_qandas .step1_item .itemNum{
      font-size: 12px;
      width:68px;
    }
    
    .step1_qandas .step1_item h5{
      font-size:14px;
      max-width:calc(100% - 68px);
      width:fit-content;
    }

    .step1_qandas .step1_item .step1_answer{
      width:296px;
      margin:auto;
    }
    
    .step1_qandas .step1_item .step1_answer ul{
      width:100%;
      display:flex;
      justify-content: space-between;
    } 
    
    .step1_qandas .step1_item .js-step1_a{
      width:144px;
      border-radius:25px;
      font-size:18px;
      line-height:46px;
      background-size:auto 40px;
    }

    /*STEP3*/
    .step3_qandas .step3_item{
      position:relative;
      padding:15px 11px 15px 15px;
    }

    .step3_qandas .step3_item.next:after{
      left:-20px;
      border-top: 5px solid transparent;
      border-bottom: 5px solid transparent;
      border-left: 8px solid #007FC3;
      border-right: 0;
    }

    .step3_qandas .step3_item .step3_question{
      display:flex;
      justify-content: center;
      margin-bottom: 16px;
    }

    .step3_qandas .step3_item .itemNum{
      font-size: 12px;
      width:68px;
    }

    .step3_qandas .step3_item .itemNum .sp_none{
      display:none;
    }
    
    .step3_qandas .step3_item h5{
      font-size:14px;
      max-width:calc(100% - 68px);
      width:fit-content;
      margin-bottom: 0;
      text-align: left;
    }

    .step3_qandas .step3_item .step3_answer{
      width:450px;
      margin:auto;
    }
    
    .step3_qandas .step3_item .step3_answer ul{
      width:100%;
      display:flex;
      justify-content: space-between;
    } 
    
    .step3_qandas .step3_item .js-step3_a{
      width:144px;
      border-radius:25px;
      font-size:14px;
      line-height:46px;
      background-size:auto 32px;
    }
    
}
@media screen and (max-width: 630px) {
header {padding-right: 10px;}
header .header-page-title {margin-left: 10px;}
header .jobsatisfaction-logo {display:none;}
div.main div.first_page {padding:30px 15px 235px;}
div.main div.first_page div.first-page-back {width:943px; min-width:100%; top:auto; bottom:25px;}
div.main div.first_page div.first-page-back.visible.hasRestart {top:auto;};
div.main div.first_page div.first-page-back img {width: 943px;}
div.main div.first_page div.first-page-titleBox {padding:30px 0 20px; border-radius: 5px;}
div.main div.first_page div.first-page-copy { max-width:284px; width:100%; height:70px; padding-top: 4px; margin-bottom: 20px;}
div.main div.first_page div.first-page-copy p {font-size: 14px; line-height:1.3;}
div.main div.first_page div.first-page-copy p br.pc_none {display:block;}
div.main div.first_page div.first-page-copy p span {font-size: 26px; transform: translateY(2px);}
div.main div.first_page .first-page-caption {font-size: 14px; line-height:1.5; margin-bottom: 20px;}
div.main .jobsatisfaction-copy {font-size:15px; line-height:23px;}
div.main .jobsatisfaction-copy:before {width:19px;  height:24px; left:-23px; background-image: url('https://doda.jp/cmn_web/img/type/title_img_left_sp.webp');} 
div.main .jobsatisfaction-copy:after {width:19px;  height:24px; right:-23px; background-image: url('https://doda.jp/cmn_web/img/type/title_img_right_sp.webp');} 
div.main .jobsatisfaction-copy span {font-size: 18px;}
div.main div.first_page .jobsatisfaction-title {width:270px; margin:12px auto 20px; padding-bottom:4px;}
div.main div.first_page .jobsatisfaction-title {background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff100), color-stop(50%, transparent)); background-image: linear-gradient(to right, #fff100 50%, transparent 50%); background-position: 0% 100%; background-repeat: no-repeat; background-size: 200% 14px; }
.first_page_start_btn {max-width:285px; width:100%; height:55px;  border-radius:35px; padding:11px 0 16px; position:relative;}
.first_page_start_btn:after {width:18px; height:18px; top:15px; right:13px;}
.first_page_start_btn span {font-size: 18px;}
.first_page_restart_btn { max-width:285px; width:100%; height:55px; padding:14px 0; position:relative;}
.first_page_restart_btn:after {width:18px; height:18px; top:15px; right:13px;}
.first_page_restart_btn span {font-size: 14px;}
div.main div.first_page .regist_caption {margin-top: 10px; font-size: 10px; padding:0 25px; text-align: left;}
div.main div.first_page .regist_caption br {display:none;}

div.main div.first-feature { padding:30px 15px 40px;}
div.main div.first-information .first-information-title {font-size: 22px; margin-bottom: 25px;}
div.main div.first-information .first-feature-box {margin-bottom: 0;}
div.main div.first-information .first-feature-item .feature-title {height:57px;}
div.main div.first-information .first-feature-item .feature-title .large {font-size: 24px; margin-left: 5px;}
div.main div.first-information .first-feature-item .feature-title .num {font-size: 24px; margin-right: 10px;}
div.main div.first-information .first-feature-item .feature-content {padding:20px 15px 25px;}
div.main div.first-information .first-feature-item .feature-content .feature-text {margin-bottom: 20px;}
div.main div.first-information .first-feature-item .feature-content .feature-point {padding:25px 15px 20px;}
div.main div.first-information .first-feature-item .feature-content .feature-point h4 {font-size: 16px; margin-bottom: 10px;}
div.main div.first-information .first-feature-btn {position:fixed; top:100%; left:0; z-index:3; width:100%; background-color: rgba(108, 108, 108, 0.80); backdrop-filter: blur(2px); padding:12px 15px; transition:transform .3s;}
div.main div.first-information .first-feature-btn.show {transform:translateY(-100%);}
div.main div.first-information .first-feature-btn .btn-wrapper {display:flex; align-items: center; justify-content: center; column-gap: 5px; flex-direction: row-reverse;}
div.main div.first-information .first-feature-btn .first_page_start_btn {height:45px; padding:9px 0; border:solid 2px #008FD6;}
div.main div.first-information .first-feature-btn .first_page_start_btn:after {width:15px; height:15px; top:13px; right:13px;}
div.main div.first-information .first-feature-btn .first_page_start_btn span {font-size: 16px;}
div.main div.first-information .first-feature-btn .first_page_restart_btn {height:45px; padding:6px 0 7px; border:solid 2px #008FD6; margin-top: 0;}
div.main div.first-information .first-feature-btn .first_page_restart_btn br {display:block;}
div.main div.first-information .first-feature-btn .first_page_restart_btn:after {width:15px; height:15px; top:13px; right:13px;}
div.main div.first-information .first-feature-btn .first_page_restart_btn span {font-size: 12px; line-height:1.2;}
div.main div.first-information .first-feature-btn .regist_caption {font-size: 10px; color:#fff; margin-top: 5px;}
div.main div.first-information .first-feature-btn .jobsatisfaction-title {display:none;}
div.main div.first-information .first-feature-btn .jobsatisfaction-copy {display:none;}
div.main div.first-qa {padding:30px 15px 60px;}
div.main div.first-qa .qa-item {padding: 20px 0; border-top:3px solid #fff; font-size: 14px;}
div.main div.first-qa .qa-item:last-child {border-bottom:3px solid #fff;}
div.main div.first-qa .qa-item .qa-question {padding-top: 0; margin-bottom: 10px; min-height:none; align-items: flex-start;}
div.main div.first-qa .qa-item .qa-question .qa-question-icon {width:38px; height:38px; margin-right: 10px; background-image: url('https://doda.jp/cmn_web/img/type/icon_question_sp.webp');}
div.main div.first-qa .qa-item .qa-answer {padding-top: 0; min-height:none; align-items: flex-start;}
div.main div.first-qa .qa-item .qa-answer .qa-answer-icon {width:38px; height:38px; margin-right: 10px; background-image: url('https://doda.jp/cmn_web/img/type/icon_answer_sp.webp');}







}
div.main div.steps_finish_result_wrapper { min-height: 100%; opacity: 0; position:relative; z-index:3;}
div.main div.steps_finish_result_wrapper > div {}

div.main div.steps_finish_result_wrapper div.step1_page {padding:0 60px;}
div.main div.steps_finish_result_wrapper div.step1_3_page_s_q { position: relative; width: 100%; height: 254px; margin-top: 28px; background-color: #ffffff; border-top: solid 10px #a1d7f4; border-bottom: solid 10px #a1d7f4;}
div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_s { position: absolute; top: 1em; right: 0; bottom: 0; left: 90px; margin: auto; width: 400px; font-size: 20px; font-weight: bold; color: #5dbaec; text-decoration: underline;}
div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q { overflow: hidden; height: 234px; line-height: 234px; text-align: center; font-size: 20px; font-weight: bold;}
div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q div { overflow: hidden;}
div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q h5 { overflow: hidden;}
div.main div.steps_finish_result_wrapper div.step1_3_page_a { height: 230px;}
div.main div.steps_finish_result_wrapper div.step1_3_page_a div > ul { overflow: hidden; margin: 27px auto 0;}
div.main div.steps_finish_result_wrapper div.step1_3_page_a div > ul li { width: 150px; height: 90px; border-radius: 10px; background-color: #ffffff; background-position: center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.step1_3_page_a div > ul li:hover { cursor: pointer; animation: bound 0.5s 1;}
div.main div.steps_finish_result_wrapper div.btns_wrapper { position: relative; width: 550px; height: 50px; margin: 36px auto; overflow: hidden;}
div.main div.steps_finish_result_wrapper div.btns_wrapper div.before_btn { position: absolute; top: 5px; left: 5px; width: 80px; height: 18px; margin: 11px 0; background-image: url(../img/modoru.svg); background-size: auto 18px; background-position: left center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.btns_wrapper div.before_btn:hover { cursor: pointer; animation: bound 0.5s 1;}
div.main div.steps_finish_result_wrapper div.btns_wrapper div.step2_next_btn { position: absolute; top: 5px; right: 5px; width: 266px; height: 40px; background-image: url(../img/button_yellow_02.svg); background-size: auto 40px; background-position: left center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.btns_wrapper div.step2_next_btn:hover { cursor: pointer; animation: bound 0.5s 1;}

div.main div.steps_finish_result_wrapper div.step1_page div.step1_3_page_a div > ul { width: 315px;}
div.main div.steps_finish_result_wrapper div.step1_page div.step1_3_page_a div > ul li:first-child { float: left; background-image: url(../img/jyuyo.svg); background-size: 27px auto;}
div.main div.steps_finish_result_wrapper div.step1_page div.step1_3_page_a div > ul li:last-child { float: right; background-image: url(../img/kinishinai.svg); background-size: 69px auto;}

div.main div.steps_finish_result_wrapper div.step2_page {padding:0 60px;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sorts_wrapper { height: auto; margin-top: 28px; overflow: visible!important;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_nav { position: relative; overflow: visible; width: 550px; height: 0; margin: 0 auto; padding-left: 74px; font-size: 12px; line-height: 35px;}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_nav:before { position: absolute; content: ""; top: 6px; left: 0; width: 64px; height: 35px; background-image: url(../img/pc_yusen.svg); background-size: auto 35px; z-index: 1;}

div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort { position: relative; width: 807px; margin: 0 auto; overflow:visible!important}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol { position: absolute; left: 0; top: 0; width: 80px; display:none;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li { width: 64px; height: 50px; margin: 12px 0; background-repeat: no-repeat, no-repeat, no-repeat;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(-n+9) { background-position: 17px 10px, 38px 21px; background-size: 14px auto, 16px auto;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(n+10) { background-position: left 10px, 17px 10px, 38px 21px; background-size: 14px auto, 14px auto, 16px auto;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(1) { background-image: url(../img/1_gold.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(2) { background-image: url(../img/2_silver.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(3) { background-image: url(../img/3_blond.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(4) { background-image: url(../img/4.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(5) { background-image: url(../img/5.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(6) { background-image: url(../img/6.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(7) { background-image: url(../img/7.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(8) { background-image: url(../img/8.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(9) { background-image: url(../img/9.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(10) { background-image: url(../img/1.svg), url(../img/0.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(11) { background-image: url(../img/1.svg), url(../img/1.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(12) { background-image: url(../img/1.svg), url(../img/2.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(13) { background-image: url(../img/1.svg), url(../img/3.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(14) { background-image: url(../img/1.svg), url(../img/4.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(15) { background-image: url(../img/1.svg), url(../img/5.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(16) { background-image: url(../img/1.svg), url(../img/6.svg), url(../img/i.svg); background-size: 14px auto, 16px auto, 16px auto;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(17) { background-image: url(../img/1.svg), url(../img/7.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(18) { background-image: url(../img/1.svg), url(../img/8.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(19) { background-image: url(../img/1.svg), url(../img/9.svg), url(../img/i.svg); background-size: 14px auto, 16px auto, 16px auto;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(20) { background-image: url(../img/2.svg), url(../img/0.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(21) { background-image: url(../img/2.svg), url(../img/1.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(22) { background-image: url(../img/2.svg), url(../img/2.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(23) { background-image: url(../img/2.svg), url(../img/3.svg), url(../img/i.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list { padding-left: 80px; overflow:visible!important}
/*div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li { display: flex; align-items: center; position: relative; height: 50px; margin: 12px 0; padding: 0 20px 0 15px; border: solid 3px #5dbaec; font-size: 16px; font-weight: bold; line-height: 18px; background-color: #ffffff; cursor: pointer;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .js-sort_by_drag_and_drops_up_btn { position: absolute; right: 0; width: 25px; height: 19px; background-size: 10px auto; background-position: center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li span.sort_up_btn { top: 0; background-image: url(../img/arrowblue_top.svg);}
div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li span.sort_down_btn { bottom: 0; background-image: url(../img/arrowblue_under.svg);}*/

div.main div.steps_finish_result_wrapper div.step3_page {padding:0 60px;}
div.main div.steps_finish_result_wrapper div.step3_page div.step1_3_page_a div > ul { width: 480px;}
div.main div.steps_finish_result_wrapper div.step3_page div.step1_3_page_a div > ul li:nth-child(1) { float: left; background-image: url(../img/maru.svg); background-size: 27px auto;}
div.main div.steps_finish_result_wrapper div.step3_page div.step1_3_page_a div > ul li:nth-child(2) { float: left; background-image: url(../img/sankaku.svg); background-size: 88px auto; margin-left: 15px;}
div.main div.steps_finish_result_wrapper div.step3_page div.step1_3_page_a div > ul li:nth-child(3) { float: right; background-image: url(../img/batu.svg); background-size: 40px auto; margin-left: 15px;}

div.main div.steps_finish_result_wrapper div.finish_page{padding:0 60px;}
div.main div.steps_finish_result_wrapper div.finish_page div.finish_page_selects { width:100%; max-width: 700px; margin: 20px auto 0; overflow:visible!important;}
/*div.main div.steps_finish_result_wrapper div.finish_page div.finish_page_selects div.finish_page_select_wrapper { position: relative height: 42px; margin-bottom: 10px; padding: 0 42px; border: solid 4px #5dbaec; background-color: #ffffff;}
div.main div.steps_finish_result_wrapper div.finish_page div.finish_page_selects div.finish_page_select_wrapper:before { position: absolute; width: 20px; right: 10px; top: 0; bottom: 0; content: ""; z-index: 1; background-image: url(../img/arrowblue_under.svg); background-repeat: no-repeat; background-position: center; background-size: auto 10px;}
div.main div.steps_finish_result_wrapper div.finish_page div.finish_page_selects div.finish_page_select_wrapper select { position: relative; left: -42px; width: 400px; height: 46px; padding-left: 15px; text-overflow: ellipsis; border: none; outline: none; background: transparent; background-image: none; box-shadow: none; -webkit-appearance: none; appearance: none; line-height: 42px; font-size: 12px; font-weight: bold;}*/
/*div.main div.steps_finish_result_wrapper div.finish_page div.final_next_btn { width: 264px; height: 40px; margin: 52px auto 0; background-image: url(../img/button_grayout_03.svg); background-size: auto 40px; background-position: left center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.finish_page div.final_next_btn:hover { cursor: not-allowed;}
div.main div.steps_finish_result_wrapper div.finish_page div.final_next_btn.inputed { background-image: url(../img/button_yellow_03.svg);}
div.main div.steps_finish_result_wrapper div.finish_page div.final_next_btn.inputed:hover { cursor: pointer; animation: bound 0.5s 1;}*/

div.main div.steps_finish_result_wrapper div.result_page {}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_subtitle { height: 100px; padding: 30px 0; background-color: #ffffff; background-image: url(../img/kekka01.svg); background-size: auto 40px; background-position: center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper { overflow: hidden; width: 650px; margin: 25px auto 0; background-color: #ffffff; border: solid 4px #5dbaec; }
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4 { position: relative; height: 70px; border-bottom: solid 4px #5dbaec; text-align: center; font-weight: bold;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4:before { content: ""; position: absolute; bottom: -20px; left: 50%; margin-left: -13px; border: 10px solid transparent; border-top: 10px solid #FFF; z-index: 2;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4:after { content: ""; position: absolute; bottom: -30px; left: 50%; margin-left: -17px; border: 14px solid transparent; border-top: 14px solid #5dbaec; z-index: 1;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4 div.result_page_supplement { position: relative; top: 3px; font-size: 14px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4 div.result_page_type_name { font-size: 26px; color: #007fc3;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic { float: left; width: 50%; height: 400px; background-size: auto 400px; background-position: center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_1 { background-image: url(../img/1_2_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_1 { background-image: url(../img/1_2_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_2 { background-image: url(../img/1_2_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_2 { background-image: url(../img/1_2_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_3 { background-image: url(../img/3_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_3 { background-image: url(../img/3_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_4 { background-image: url(../img/4_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_4 { background-image: url(../img/4_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_5 { background-image: url(../img/5_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_5 { background-image: url(../img/5_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_6 { background-image: url(../img/6_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_6 { background-image: url(../img/6_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.male_7 { background-image: url(../img/7_male.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic.female_7 { background-image: url(../img/7_female.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_hint {/* filter: blur(6px); */float: right;width: 50%;padding: 60px 10px 0 0;background-image: url(../img/kekka02.svg);background-size: auto 24px;background-repeat: no-repeat;background-position: center 24px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_hint h5 { position: relative; padding-left: 12px; font-size: 14px; font-weight: bold;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_hint h5:before { position: absolute; top: 0; left: 0; width: 6px; height: 100%; border-radius: 3px; content: ""; background-color: #007fc3;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_hint > div { margin-top: 20px; font-size: 14px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_hint > div p { padding-bottom: 20px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent { float: left; width: 50%; height: 240px; padding: 77px 80px 20px 0; background-image: url(../img/kekka07.svg), url(../img/kekka08.svg); background-size: auto 30px, auto 40px; background-position: center 30px, 249px 145px; background-repeat: no-repeat; text-align: right;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span { display: inline-block; width: 80px; height: 110px; background-repeat: no-repeat; background-size: auto 110px; background-position: center;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_0 { background-image: url(../img/kekka_0.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_1 { background-image: url(../img/kekka_1.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_2 { background-image: url(../img/kekka_2.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_3 { background-image: url(../img/kekka_3.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_4 { background-image: url(../img/kekka_4.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_5 { background-image: url(../img/kekka_5.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_6 { background-image: url(../img/kekka_6.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_7 { background-image: url(../img/kekka_7.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_8 { background-image: url(../img/kekka_8.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent span.num_9 { background-image: url(../img/kekka_9.svg);}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_graf { float: right; overflow: hidden; position: relative; width: 50%; height: 240px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_graf:after { position: absolute; top: 0; left: 0; width: 100%; height: 10px; content: ""; background-color: #ffffff;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_graf canvas { position: relative; top: -20px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer { clear: both; overflow: hidden; padding: 20px 0 20px; background-color: #fffcd1;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer.output_title { padding: 52px 0 20px; background-image: url(../img/kekka_text05_pc.svg); background-size: auto 12px; background-repeat: no-repeat; background-position: center 20px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer a { position: relative; display: block; float: left; width: 287px; height: 30px; margin-left: 23px; line-height: 29px; font-size: 12px; text-align: center; background-color: #ffffff; color: #007fc3; text-decoration: none; border: solid 1px #007fc3; border-radius: 4px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer a:after { position: absolute; content: ""; top: 0; right: 0; width: 30px; height: 30px; background-image: url(../img/arrowblue_right.svg); background-size: auto 10px; background-position: center; background-repeat: no-repeat;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer h5 { text-align: center; font-size: 14px; font-weight: bold;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer p { font-size: 14px; padding: 20px 20px 0;}
div.main div.steps_finish_result_wrapper div.result_page h4.result_page_subtitle_1 { height: 20px; margin: 40px auto; background-image: url(../img/kekka_text06_pc.svg); background-size: auto 20px; background-repeat: no-repeat; background-position: center;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature { width: 650px; margin: 20px auto 0;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature h5 { color: #007fc3; text-align: center; font-weight: bold; font-size: 20px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature ul { overflow: hidden; margin-top: 20px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature ul li { float: left; margin: 0 10px 10px 0; padding-left: 17px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature ul li a { display: block; position: relative; font-size: 13px; color: #007fc3; text-decoration: none; height: 30px; line-height: 30px; padding: 0 8px 0 5px; background: #b9e2f8; border-radius: 0 4px 4px 0;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature ul li a:before { display: block; position: absolute; top: 0; bottom: 0; left: -17px; width: 17px; content: ""; background: url(../img/icon_tag.png) no-repeat 0 0;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links { margin-bottom: 20px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_top_links { width: 650px; margin: 0 auto; text-align: right;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_top_links > div { position: relative; display: inline-block;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_top_links > div:nth-child(1) { top: -2px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_top_links > div:nth-child(3) { top: -2px;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_btn_link_green { width: 20em; margin: 20px auto 0;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_btn_link_green a { background: linear-gradient(#7dba3c, #60ab0f); color: #fff; font-weight: bold; text-decoration: none; border-radius: 5px; cursor: pointer; display: block; font-size: 16px; min-height: 47px; padding-top: 12px; padding-bottom: 12px; text-align: center; width: 100%;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_btn_link_orange { width: 20em; margin: 20px auto 0;}
div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_btn_link_orange a { background: linear-gradient(#fd8331, #f60); color: #fff; font-weight: bold; text-decoration: none; border-radius: 5px; cursor: pointer; display: block; font-size: 16px; min-height: 47px; padding-top: 12px; padding-bottom: 12px; text-align: center; width: 100%;}

div.footer_sns_links {width: 100%;padding: 10px 10px 3px;text-align: right;border-top: 1px solid #e6f1f5;position: relative;z-index: -1;transform:translateZ(1px);}
div.footer_sns_links > div {position: relative;display: inline-block;}
div.footer_sns_links > div:nth-child(1) { top: -1px; margin-right: 15px;}
div.footer_sns_links > div:nth-child(2) { margin-right: 5px;}
div.footer_sns_links > div:nth-child(3) { top: -1px;}
.footerUnder {height: 74px;border-top: 1px solid #e6f1f5;position: relative;z-index: -1;transform:translateZ(1px);}
#footer.footerSimple .footerUnder { border-top: none; }
.footerUnder .pmark {width: 55px;height: 54px;position: absolute;left: 10px;top: 9px;overflow: hidden;/* z-index: 0; */}
.footerUnder .pmark img { position: absolute; left: -650px; top: -1200px; }
.footerUnder .pmark02 { width: 295px; height: 12px; position: absolute; left: 69px; top: 21px; overflow: hidden; }
.footerUnder .pmark02 img { position: absolute; left: -450px; top: -1299px; }
.footerUnder .pmark03 { width: 289px; height: 12px; position: absolute; left: 70px; top: 39px; }
.footerUnder .pmark03 a { display: block; font-size: 11px; text-decoration: none; line-height: 1em; color:#007fc3 !important; }
.footerUnder .logo { width: 230px; height: 43px; position: absolute; right: 10px; top:18px; overflow: hidden; }
.footerUnder .logo img { position: absolute; left: -176px; top: -1299px; }
.footerUnder .logo_persol { display: none; }
.footerUnder .copy { font-size: 11px; color:#4c4c4c; width: 200px; height: 10px; text-align: right; position: absolute; right: 243px; top: 45px;}

/* IE11 start */
@media all and (-ms-high-contrast: none) {
    *::-ms-backdrop, div.main { background-image: url(../img/diagonal-lines.png);}
    *::-ms-backdrop, div.main div.steps_finish_result_wrapper div.step3_page div.step1_3_page_a div > ul li:nth-child(3) { float: right; background-image: url(../img/batu.png);}
    *::-ms-backdrop, div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(-n+9) { background-position: 15px 10px, 45px 21px; background-size: 34px auto, 16px auto;}
    *::-ms-backdrop, div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort ol li:nth-child(n+10) { background-position: left 10px, 17px 10px, 45px 21px; background-size: 34px auto, 34px auto, 16px auto;}
    *::-ms-backdrop, div.main div.steps_finish_result_wrapper select::-ms-expand { display: none;}
}
/* IE11 end */

@media screen and (max-width:980px){
  div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort{
    width:100%;
  }

  div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list { padding-left: 55px;}

  .sort_rankSelect{
    top:50px;
    left:-55px;
    padding-top: 10px;
  }

  .sort_rankingNum{
    top:8px;
    left:-55px;
  }
  
  .sort_rankingNum .num{
    width:40px;
    height:40px;
    border-radius: 20px;
    font-size:24px;
    font-weight:700;
    text-align:center;
    line-height:34px;
  }

  div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li { 
    height: auto;
    min-height:56px;
    margin: 20px 0; 
    padding: 6px 16px 6px 14px; 
  }

  div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .sort_listText{
    display:block;
  }

  div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .sort_listId{
    font-size: 12px;
    line-height:1.5;
    width:auto;
    margin-bottom: 5px;
  }

  div.main div.steps_finish_result_wrapper div.step2_page div.step2_sort #js-step2_page_sort_list > li .sort_listTitle{
    font-size: 14px;
    width:100%;
  }

  .js-step2_clear_btn{
    width:400px;
    margin-bottom: 20px;
  }

  .step2_btn_wrapper{
    display:block;
    height:auto;
    width:100%;
    margin:30px auto 100px;
  }

  .step2_fixed_btn .step2_btn_wrapper{
    margin:auto;
    display:flex;
    width:620px;
  }

  .step2_fixed_btn .step2_btn_wrapper .js-step2_clear_btn{
    margin-bottom: 0;
    width:200px;
  }
}

@media screen and (max-width:630px){
  div.main .question-page-back {min-width:720px; top:363px;}

div.main .question-page-back img{width:720px; opacity:1;}
  .step_pages_title{
    padding:48px 24px 28px;
    border-radius:20px;
    margin:30px auto 190px;
  }

  .step_pages_title_text{
    font-size: 16px;
    margin-bottom: 16px;
  }



  div.main div.steps_finish_result_wrapper div.step1_page {padding:0 28px;}
  .question_count{
    width:100px;
    height:100px;
    border-radius:50px;
    padding-top: 14px;
    right:16px;
    bottom:80px;
    font-size: 18px;
  }
  .question_count .count_origin{
    font-size: 14px;
    line-height: 34px;
    transform: translateX(5px);
  }
  .question_count .count_origin .num{
    font-size: 34px;
  }
  .question_count .count_progress{
    font-size: 14px;
    line-height:34px;
  }
  .question_count .count_progress .num{
    font-size: 18px;
    margin-right: 2px;
  }
  .question_count .count_progress #js-step1_count_num{
    font-size: 30px;
  }
  .question_count .count_progress #js-step3_count_num{
    font-size: 30px;
  }

  .next_btn_yellow{max-width:285px; width:100%; height:55px;  border-radius:35px; padding:11px 0 16px;}

  .next_btn_yellow:after {width:18px; height:18px; top:15px; right:13px;}

  .next_btn_yellow.active:after {width:18px; height:18px; top:15px; right:13px;}

  .next_btn_yellow > span{
    font-size: 18px;
  }

  .fixed_btn_wrapper{
    height:100px;
  }

  /*STEP2*/

  div.main div.steps_finish_result_wrapper div.step2_page {padding:0 28px;}

  .js-step2_clear_btn{
    max-width:285px; width:100%; height:55px;  border-radius:35px; padding:11px 0 16px;
  }
  
  .js-step2_clear_btn span{
    font-size: 18px;
  }

  .step2_fixed_btn{
    height:90px;
    padding:12px 15px 0;
  }

  .step2_fixed_btn .step2_btn_wrapper{
    width:100%;
  }

  .step2_fixed_btn .step2_btn_wrapper .js-step2_clear_btn{
    width:calc(50% - 3px);
    height:45px;
    padding:11px 0 14px;
  }

  .step2_fixed_btn .step2_btn_wrapper .js-step2_clear_btn span{
    font-size: 12px;
    display:block;
  }

  .step2_fixed_btn .step2_btn_wrapper .next_btn_yellow{
    width:calc(50% - 3px);
    height:45px;
    padding:11px 0 14px;
  }

  .step2_fixed_btn .step2_btn_wrapper .next_btn_yellow > span{
    font-size: 12px;
  }

  .step2_fixed_btn .step2_btn_wrapper .next_btn_yellow:after {width:14px; height:14px; top:13px; right:10px;}

  .step2_fixed_btn .step2_btn_wrapper .next_btn_yellow.active:after {width:14px; height:14px; top:13px; right:10px;}

  .step2_clear_modal_content{
    padding:24px 16px;
    width:100%;
    max-width:340px;
  }

  .step2_clear_modal_text{
    font-size: 18px;
    margin:0 auto 16px;
  }
  
  .step2_clear_modal_btn{
    width:308px;
  }

  .step2_clear_modal_btn > div{
    width:150px; 
    height:56px; 
    border-radius:28px; 
    padding:13px 0 11px; 
  }

  .step2_clear_modal_btn > div span{
    font-size: 14px; line-height:22px; display:block;
  }

  /*STEP3*/
  div.main div.steps_finish_result_wrapper div.step3_page {padding:0 28px;}

  .step3_qandas .step3_item .js-step3_a br.pc_none{
    display:block;
  }

  .step3_qandas .step3_item .step3_answer{
    width:100%;
  }

  .step3_qandas .step3_item .js-step3_a{
    height:50px;
    width:calc(33.33% - 7px);
    border-radius:25px;
    font-size:14px;
    line-height:1.5;
    display:flex;
    align-items: center;
    justify-content: center;
  }

  /*finish page*/
  div.main div.steps_finish_result_wrapper div.finish_page {padding:0 28px;}
  .finish_page_select_wrapper .select_trigger{
    font-size: 18px;
    line-height:26px;
    padding:25px 20px;
  }
  .custom_options{
    max-height:185px;
  }
  .custom_scroll{
    max-height:185px;
  }
  .custom_option{
    font-size: 14px;
    padding:8px 16px;
  }

  .finish_page .btn_wrapper{
    margin:30px auto 160px;
  }
  
}

/* sp start */
@media screen and (max-width:415px) {
    header { height: 52px; background-size:auto 17px; background-position: right 16px center;}

    #logo img.top-logo-pc { display: none; }
    #logo img.top-logo-sp { display: inline-block; height: 100%; }
    h1 { font-size: 16px; margin-bottom: 10px; }
    h1 .large { font-size: 40px; }
    h1 .large .line { padding: 0 10px; background-position: 0% 86%; background-size: 200% 10px; }
    p.caption { font-size: 10px; }

    div.main div.step_pages_subtitle { width: 360px; }
    div.main div.step2_page div.step_pages_subtitle { overflow: visible;}
    div.main div.step_pages_subtitle div.step_pages_subtitle_info_1 { width: 298px;}
    div.main div.step_pages_subtitle div.step_pages_subtitle_info_2 { width: 360px; }

    div.main div.step2_page div.step_pages_subtitle div.step_pages_subtitle_info_1 { background-size: auto 25px; margin-bottom: 20px;}
    div.main div.step2_page div.step_pages_subtitle div.step_pages_subtitle_info_2 { height: 60px; margin-top: 20px; background-image: url(../img/sp_step2text.svg); background-size: auto 40px;}

    div.main div.finish_page div.step_pages_subtitle div.step_pages_subtitle_info_1 { background-size: auto 25px;}

    div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_s { left: 40px;}
    div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q { overflow: hidden; height: 100%; font-size: 16px;}
    div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q > div { height: 100%;}
    div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q > div > div { display: flex; align-items: center; height: 100%;}
    div.main div.steps_finish_result_wrapper div.step1_3_page_s_q div.step1_3_page_q > div > div > h5 { width: 100%; line-height: 1; }
    div.main div.steps_finish_result_wrapper div.btns_wrapper { width: 360px; margin-top: 17px;}

    div.main div.steps_finish_result_wrapper div.result_page {}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_subtitle { background-size: auto 30px; }
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper { width: auto; margin: 25px 10px 0;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4 div.result_page_supplement { position: absolute; width: 100%; top: 5px; height: 24px; line-height: 24px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4 div.result_page_type_name { position: absolute; width: 100%; bottom: 5px; height: 40px; line-height: 40px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_pic { float: none; width: 100%;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_hint { float: none; width: 100%; padding: 70px 10px 0 10px; background-size: auto 30px; background-position: center 20px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent { float: none; width: 100%; padding: 80px 0 0; text-align: center; background-image: url(../img/kekka07.svg); border-bottom: solid 1px #5dbaec;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_percent:after { content: ""; display: inline-block; position: relative; right: -10px; width: 30px; height: 30px; background-image: url(../img/kekka08.svg); background-size: auto 30px; background-repeat: no-repeat;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_graf { float: none; width: 100%; height: 290px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer.output_title { padding: 52px 20px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer a { float: none; width: 100%; margin: 0 0 20px; font-size: 12px; line-height: 29px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer a:last-child { margin: 0;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper div.result_page_blue_wrapper_footer h5 { padding: 0 10px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_feature { width: 100%; padding: 0 20px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_links div.result_page_links_top_links { width: 100%; padding: 0 20px;}
    div.main div.steps_finish_result_wrapper div.result_page div.result_page_blue_wrapper > h4 div:last-child.over_text { font-size: 22px; line-height: 40px;}
    .footerUnder { width: 100%; height: 150px;}
    .footerUnder .pmark02 img { display: none; }
    .footerUnder .pmark03 { top: 25px;}
    .footerUnder .pmark03 a { width: 96px; line-height: 1.5;}
    .footerUnder .logo img { display: none; }
    .footerUnder .logo_persol { display: block; text-align: center; padding: 10px; position: absolute; width: 100%; top: 70px;}
    .footerUnder .copy { position: relative; width: 100%; top: 115px; right: 0; text-align: center;}


    .step1_qandas .step1_item .step1_answer{
      width:100%;
    }

    .step1_qandas .step1_item .js-step1_a{
      width:calc(50% - 4px);
    }

    .step2_fixed_btn .btn_notice{
      bottom:-24px;
    }

    .step2_fixed_btn .btn_notice span{
      font-size: 10px;
      line-height:16px;
      white-space: nowrap;
    }

    .step2_fixed_btn .btn_notice img{
      width:16px;
      margin-right: 2px;
    }
    
    

}
/* sp end */