#check .check_bg {
  padding: 50px 0;
  text-align: center; }
  @media screen and (max-width: 768px) {
    #check .check_bg {
      padding: 30px 10px; } }
  #check .check_bg .bg_inner {
    margin: auto;
    width: 100%;
    max-width: 600px; }
#check .check_title {
  background-color: #fff;
  border-radius: 30px;
  padding: 10px 0; }

.question_inner {
  padding: 120px 0; }
  .question_inner > h3 {
    background-color: #E6E6E6;
    border-radius: 10px;
    font-size: 22px;
    letter-spacing: 0.01em;
    line-height: 1.6em;
    margin: auto;
    padding: 40px 0;
    text-align: center;
    width: 100%;
    max-width: 700px; }
    @media screen and (max-width: 768px) {
      .question_inner > h3 {
        font-size: 18px;
        padding: 20px 0; } }
  .question_inner ul {
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    .question_inner ul > li {
      display: -webkit-flex;
      display: flex;
      position: relative; }
      .question_inner ul > li input:checked + label {
        background-color: #22801A; }
        .question_inner ul > li input:checked + label::before {
          background-color: #FCDD21; }
      .question_inner ul > li > label {
        background-color: #B3B3B3;
        border-radius: 10px;
        color: #fff;
        display: block;
        font-size: 22px;
        letter-spacing: 0.01em;
        line-height: 1.6em;
        margin-top: 80px;
        padding: 30px 0;
        text-align: center;
        width: 100%;
        transition: all .2s ease; }
        @media screen and (max-width: 768px) {
          .question_inner ul > li > label {
            font-size: 16px;
            padding: 15px 0; } }
        .question_inner ul > li > label:hover {
          background-color: #22801A;
          cursor: pointer;
          transition: all .2s ease; }
          .question_inner ul > li > label:hover::before {
            background-color: #FCDD21;
            transition: all .2s ease; }
        .question_inner ul > li > label::before {
          content: '';
          background-color: #B3B3B3;
          width: 50px;
          height: 26px;
          margin: auto;
          position: absolute;
          top: 25px;
          right: 0;
          left: 0;
          transition: all .2s ease; }
        .question_inner ul > li > label::after {
          content: '';
          width: 10px;
          height: 10px;
          border: 0px;
          border-top: solid 2px #000;
          border-right: solid 2px #000;
          -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
          margin: auto;
          position: absolute;
          top: 30px;
          right: 0;
          left: 0; }

.choice_2_pieces > li {
  margin-right: 2%;
  width: 49%; }
  .choice_2_pieces > li:nth-child(2n) {
    margin-right: 0; }

.choice_3_pieces > li {
  margin-right: 2%;
  width: 32%; }
  .choice_3_pieces > li:nth-child(3n) {
    margin-right: 0; }
  @media screen and (max-width: 640px) {
    .choice_3_pieces > li {
      width: 49%; }
      .choice_3_pieces > li:nth-child(3n) {
        margin-right: 2%; }
      .choice_3_pieces > li:nth-child(2n) {
        margin-right: 0; } }

input {
  display: none; }

.stage1,
.stage2,
.stage3 {
  position: relative; }
  .stage1::before,
  .stage2::before,
  .stage3::before {
    content: '';
    background-color: #FCDD21;
    width: 50px;
    height: 26px;
    margin: auto;
    position: absolute;
    top: 25px;
    right: 0;
    left: 0;
    transition: all .2s ease; }
  .stage1::after,
  .stage2::after,
  .stage3::after {
    content: '';
    width: 10px;
    height: 10px;
    border: 0px;
    border-top: solid 2px #000;
    border-right: solid 2px #000;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    margin: auto;
    position: absolute;
    top: 30px;
    right: 0;
    left: 0; }

.stage4 {
  padding-top: 120px;
  margin-bottom: 100px; }

.result .result_inner .result_title {
  padding: 5px 0;
  text-align: center; }
.result .result_inner .result_area {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 30px auto; }
  .result .result_inner .result_area .left_area .result_type {
    border-bottom: 1px solid #CCCCCC;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4em;
    padding: 20px 20px 10px; }
  .result .result_inner .result_area .left_area .result_name {
    font-size: 28px;
    font-weight: 600;
    line-height: 1.4em;
    padding: 20px 20px 30px; }
    @media screen and (max-width: 768px) {
      .result .result_inner .result_area .left_area .result_name {
        font-size: 22px;
        padding: 20px 10px 0; } }
  .result .result_inner .result_area .left_area .result_note {
    font-size: 15px;
    line-height: 2em; }
    @media screen and (max-width: 768px) {
      .result .result_inner .result_area .left_area .result_note {
        padding: 20px 10px;
        line-height: 1.4em; } }
  .result .result_inner .result_area .image_on {
    margin-right: 4%;
    width: 40%; }
    @media screen and (max-width: 768px) {
      .result .result_inner .result_area .image_on {
        margin-right: 0;
        width: 100%; } }
  .result .result_inner .result_area .text_only {
    width: 100%; }
  .result .result_inner .result_area .right_area {
    width: 50%; }
    @media screen and (max-width: 768px) {
      .result .result_inner .result_area .right_area {
        margin-right: 0;
        width: 100%; } }
    .result .result_inner .result_area .right_area img {
      width: 100%; }
.result .result_inner .result_link a {
  background-color: #E6E6E6;
  border-radius: 5px;
  display: block;
  font-size: 23px;
  line-height: 1.6em;
  margin: 50px auto;
  padding: 30px 0;
  position: relative;
  text-align: center;
  width: 70%;
  max-width: 700px; }
  .result .result_inner .result_link a:hover {
    background-color: #999;
    color: #fff;
    transition: all .2s ease; }
    .result .result_inner .result_link a:hover::before {
      background-color: #FCDD21;
      transition: all .2s ease; }
  .result .result_inner .result_link a::before {
    content: '';
    background-color: #B3B3B3;
    width: 26px;
    height: 50px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    transition: all .2s ease; }
  .result .result_inner .result_link a::after {
    content: '';
    width: 10px;
    height: 10px;
    border: 0px;
    border-top: solid 2px #000;
    border-right: solid 2px #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin: auto;
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0; }