@charset "UTF-8";
/* =================================
mixin
================================= */
/* =================================
base
================================= */
html > body {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ＭＳ ゴシック", "MS Gothic", sans-serif; }
  html > body .min {
    font-family: "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    font-weight: 600; }

html {
  font-size: 62.5%; }

button {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ＭＳ ゴシック", "MS Gothic", sans-serif; }

a {
  text-decoration: none; }

#contents .path {
  height: auto;
  padding: 15px 0; }

#introduce_top {
  width: auto;
  margin: 0 auto;
  border-top: 1px solid #c7c5c2;
  border-bottom: 1px solid #c7c5c2;
  padding-top: 0; }

.contents-wrapper {
  margin: 0 auto; }

input[type=checkbox] {
  display: none !important; }

label {
  display: inline-block;
  padding: 5px 10px;
  text-decoration: none;
  cursor: pointer; }

input[type=checkbox]:checked + label {
  color: #de4c2f;
  font-weight: bold; }

.read-btn {
  text-align: center;
  background: #463d3c;
  color: #FFF;
  border: 1px solid #463d3c;
  border-radius: 0 0 10px 10px;
  font-family: 'Spinnaker', sans-serif;
  font-size: 1rem;
  padding: 4px 0; }

.flexBox {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .flexBox--3col .flexBox__item {
    margin: 0 25px 25px 0;
    width: calc(33.3333333% - 25px * 2 / 3); }
    .flexBox--3col .flexBox__item:nth-child(3n+3) {
      margin-right: 0; }

.flexBox {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .flexBox--6col .flexBox__item {
    margin: 0 8px 0 0;
    width: calc(16.666666% - 8px * 5 / 6); }
    .flexBox--6col .flexBox__item:nth-child(6n) {
      margin-right: 0; }

.leftBorder__ttl {
  vertical-align: middle;
  line-height: 1.3; }
  .leftBorder__ttl:before {
    content: " ";
    border-left: 6px solid #463d3c;
    padding-right: 14px; }

.result-area {
  margin: 30px 0 60px 0; }
  .result-area .contents-wrapper {
    width: 980px; }
  .result-area .post-date {
    color: #463d3c;
    text-align: right; }
  .result-area h2,
  .result-area .lead {
    width: 820px;
    margin: 0 0 20px;
    font-size: 24px;
    color: #e17777;
    margin-left: 16%; }
    .result-area h2 strong,
    .result-area h2 span,
    .result-area .lead strong,
    .result-area .lead span {
      background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(0%, #fff2cf));
      background: -webkit-linear-gradient(transparent 50%, #fff2cf 0%);
      background: -o-linear-gradient(transparent 50%, #fff2cf 0%);
      background: linear-gradient(transparent 50%, #fff2cf 0%); }
  .result-area.gender-m h2,
  .result-area.gender-m .lead {
    color: #208abb; }
  .result-area.gender-m .target {
    border-color: #e17777; }
    .result-area.gender-m .target .title {
      color: #e17777; }
    .result-area.gender-m .target .icon {
      border-color: #e17777; }
  .result-area .profile {
    position: relative;
    padding: 0;
    border-bottom: none; }
    .result-area .profile-cont {
      margin-top: 30px; }
      .result-area .profile-cont .img-area {
        float: left;
        margin-right: 30px;
        width: 126px; }
      .result-area .profile-cont .txt-area {
        width: calc(70% - 100px); }
        .result-area .profile-cont .txt-area p {
          display: inline-block; }
        .result-area .profile-cont .txt-area .type {
          color: #463d3c;
          font-weight: bold;
          position: relative;
          background-repeat: no-repeat;
          text-align: center;
          line-height: 50px;
          margin-bottom: 0px; }
          .result-area .profile-cont .txt-area .type:before {
            width: 134px;
            height: 50px;
            position: absolute;
            top: -2px;
            left: -15px; }
    .result-area .profile-info:after {
      content: "";
      display: block;
      clear: both; }
    .result-area .profile-info__name {
      color: #463d3c;
      margin-left: 47px;
      margin-right: 10px;
      font-weight: bold; }
      .result-area .profile-info__name span {
        font-size: 20px; }
    .result-area .profile-info__age {
      color: #463d3c;
      font-weight: bold; }
      .result-area .profile-info__age span {
        font-size: 18px; }
    .result-area .profile-info__other {
      margin-top: 0;
      color: #463d3c;
      vertical-align: middle;
      display: inline-block; }
      .result-area .profile-info__other li {
        display: inline-block;
        margin-right: 15px; }
        .result-area .profile-info__other li:last-child {
          margin-right: 0; }
    .result-area .profile-info__tag {
      display: inline-block;
      font-weight: bold;
      color: #463d3c;
      margin-top: 5px;
      font-size: 0; }
      .result-area .profile-info__tag li {
        font-size: 1.2rem;
        display: inline-block;
        margin-right: 10px;
        background: #f7f7f7;
        padding: 0 6px; }
        .result-area .profile-info__tag li:last-child {
          margin-right: 0; }
    .result-area .profile-before .title, .result-area .profile-after .title {
      color: #463d3c;
      font-size: 1.5rem;
      font-weight: bold;
      padding-left: 4px;
      border-bottom: solid 1px #463d3c;
      border-top: solid 1px #463d3c; }
    .result-area .profile-before {
      float: left;
      display: inline-block;
      margin-right: 25px;
      width: 370px; }
      .result-area .profile-before .list {
        color: #463d3c;
        margin-top: 15px;
        padding-left: 9px;
        font-size: 14px; }
        .result-area .profile-before .list :before {
          content: '';
          width: 2px;
          height: 2px;
          display: inline-block;
          border-radius: 100%;
          background: #463d3c;
          position: relative;
          left: -8px;
          top: -3px; }
    .result-area .profile-after {
      display: inline-block;
      width: 320px; }
  .result-area .number-list__ttl {
    font-weight: bold; }
  .result-area .number-list__cont {
    color: #463d3c;
    position: relative;
    font-size: 1.4rem;
    display: inline-block;
    text-align: center; }
    .result-area .number-list__cont .lg {
      font-size: 25px;
      font-weight: bold; }
  .result-area .number-list {
    color: #463d3c;
    padding-top: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: auto;
    font-size: 1.3rem;
    font-weight: bold; }
    .result-area .number-list .list_item {
      width: 33.33%;
      text-align: center;
      border-left: 1px dashed #463d3c; }
      .result-area .number-list .list_item:first-child {
        border-left: none; }
      .result-area .number-list .list_item .number-list__cont {
        position: relative;
        font-size: 1.4rem;
        display: inline-block; }
        .result-area .number-list .list_item .number-list__cont .lg {
          font-size: 25px; }
      .result-area .number-list .list_item--number .number-list__ttl, .result-area .number-list .list_item--contact .number-list__ttl, .result-area .number-list .list_item--period .number-list__ttl {
        position: relative;
        padding-top: 24px; }
        .result-area .number-list .list_item--number .number-list__ttl:before, .result-area .number-list .list_item--contact .number-list__ttl:before, .result-area .number-list .list_item--period .number-list__ttl:before {
          content: "";
          display: inline-block;
          position: absolute;
          background-repeat: no-repeat;
          background-position: center;
          width: 23px;
          height: 22px;
          margin-bottom: 6px;
          top: 0;
          left: 40px; }
      .result-area .number-list .list_item--number .number-list__ttl:before {
        content: "";
        background-image: url(/introduce/images/experience/stories-list_icon_number01.png); }
      .result-area .number-list .list_item--contact .number-list__ttl:before {
        content: "";
        background-image: url(/introduce/images/experience/stories-list_icon_contact01.png); }
      .result-area .number-list .list_item--period .number-list__ttl:before {
        content: "";
        background-image: url(/introduce/images/experience/stories-list_icon_period01.png); }
  .result-area .beaf-cont {
    margin-top: 44px; }
    .result-area .beaf-cont:after {
      content: "";
      display: block;
      clear: both; }
  .result-area .target {
    position: absolute;
    display: inline-block;
    padding: 20px;
    background: #fff;
    border: 1px solid #208abb;
    bottom: 10px;
    right: 0; }
    .result-area .target .title {
      font-size: 16px;
      font-weight: bold;
      text-align: center;
      color: #208abb; }
    .result-area .target .icon {
      display: block;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      background-size: 50px auto;
      margin: 15px auto 5px;
      border: 1px solid #208abb; }
      .result-area .target .icon--type-man-a {
        background-image: url(/introduce/images/top/top_case_man-a_img.jpg); }
      .result-area .target .icon--type-man-b {
        background-image: url(/introduce/images/top/top_case_man-b_img.jpg); }
      .result-area .target .icon--type-man-c {
        background-image: url(/introduce/images/top/top_case_man-c_img.jpg); }
      .result-area .target .icon--type-man-d {
        background-image: url(/introduce/images/top/top_case_man-d_img.jpg); }
      .result-area .target .icon--type-man-e {
        background-image: url(/introduce/images/top/top_case_man-e_img.jpg); }
      .result-area .target .icon--type-man-f {
        background-image: url(/introduce/images/top/top_case_man-f_img.jpg); }
      .result-area .target .icon--type-man-g {
        background-image: url(/introduce/images/top/top_case_man-g_img.jpg); }
      .result-area .target .icon--type-man-h {
        background-image: url(/introduce/images/top/top_case_man-h_img.jpg); }
      .result-area .target .icon--type-woman-a {
        background-image: url(/introduce/images/top/top_case_woman-a_img.jpg); }
      .result-area .target .icon--type-woman-b {
        background-image: url(/introduce/images/top/top_case_woman-b_img.jpg); }
      .result-area .target .icon--type-woman-c {
        background-image: url(/introduce/images/top/top_case_woman-c_img.jpg); }
      .result-area .target .icon--type-woman-d {
        background-image: url(/introduce/images/top/top_case_woman-d_img.jpg); }
      .result-area .target .icon--type-woman-e {
        background-image: url(/introduce/images/top/top_case_woman-e_img.jpg); }
      .result-area .target .icon--type-woman-f {
        background-image: url(/introduce/images/top/top_case_woman-f_img.jpg); }
      .result-area .target .icon--type-woman-g {
        background-image: url(/introduce/images/top/top_case_woman-g_img.jpg); }
      .result-area .target .icon--type-woman-h {
        background-image: url(/introduce/images/top/top_case_woman-h_img.jpg); }
    .result-area .target p {
      font-size: 15px;
      font-weight: bold;
      display: block;
      color: #463d3c; }
      .result-area .target p span {
        font-size: 13px;
        margin-right: 10px; }

.anchor-area {
  background-color: #f7f7f5; }
  .anchor-area ul {
    margin: 0 auto !important;
    text-align: center; }
    .anchor-area ul li {
      border-left: 1px solid #c7c5c2;
      display: inline; }
      .anchor-area ul li:last-child {
        border-right: 1px solid #c7c5c2; }
      .anchor-area ul li a {
        padding: 0 28px 0 44px; }
      .anchor-area ul li span {
        color: #463d3c;
        font-size: 16px;
        position: relative; }
        .anchor-area ul li span:before {
          content: "";
          position: absolute;
          top: 50%;
          left: -15px;
          -ms-transform: translateY(-50%) translateX(0);
          transform: translateY(-50%) translateX(0);
          -webkit-transform: translateY(-50%) translateX(0);
          width: 0;
          height: 0;
          border-left: 3px solid transparent;
          border-right: 3px solid transparent;
          border-top: 5px solid #463d3c; }

.question-area .contents-wrapper {
  width: 980px; }

.question-area h4 {
  font-size: 22px;
  color: #463d3c;
  display: inline-block;
  background: transparent;
  border-left: solid 5px #463d3c;
  padding: 0 20px; }

.question-area .callout-box {
  margin-top: 40px;
  margin-left: 0; }
  .question-area .callout-box .yes {
    margin-left: 17%; }

.question-area .question-cont {
  margin-top: 50px; }
  .question-area .question-cont .pagetop {
    clear: both;
    display: block;
    padding-top: 50px; }
    .question-area .question-cont .pagetop .Sc-btn {
      width: 458px;
      font-size: 1.3rem;
      color: #463d3c;
      border-bottom: solid 1px #463d3c;
      border-top: solid 1px #463d3c;
      padding: 15px 0; }

.question-area .question-text {
  position: relative;
  font-size: 15px;
  font-weight: bold;
  color: #463d3c;
  display: inline-block;
  margin-bottom: 10px;
  margin-left: 30px; }
  .question-area .question-text:before {
    content: "";
    display: inline-block;
    position: absolute;
    left: -30px;
    top: -4px;
    width: 100%;
    height: 39px;
    background-repeat: no-repeat;
    background-size: 20px;
    background-image: url(/introduce/images/experience/question_img01.png); }

.question-area li {
  width: 786px;
  margin-bottom: 20px; }
  .question-area li:last-child {
    margin-bottom: 0; }
  .question-area li .btn {
    font-size: 12px;
    color: #463d3c;
    margin-top: 8px;
    margin-left: 83%;
    display: inline-block;
    position: relative; }
    .question-area li .btn-yes {
      margin-left: 80%; }
    .question-area li .btn-no {
      margin-left: 76%; }
    .question-area li .btn:before {
      content: "";
      position: absolute;
      display: inline-block;
      -ms-transform: translateY(-50%) translateX(0);
      transform: translateY(-50%) translateX(0);
      -webkit-transform: translateY(-50%) translateX(0);
      top: 10px;
      left: -18px;
      width: 14px;
      height: 14px;
      border-radius: 50%;
      background-color: #463d3c; }
    .question-area li .btn:after {
      content: "";
      position: absolute;
      top: 6px;
      left: -12px;
      width: 0;
      height: 0;
      border-left: 4px solid #fff;
      border-top: 4px solid transparent;
      border-bottom: 4px solid transparent; }

.question-area .answer {
  background: #fff;
  border: 1px solid #bbb1b0;
  padding: 30px;
  border-radius: 20px; }
  .question-area .answer p {
    font-size: 14px; }
  .question-area .answer-heading {
    font-size: 16px !important;
    font-weight: bold;
    color: #e17777;
    margin-bottom: 15px; }
  .question-area .answer-callout {
    margin-bottom: 20px; }
    .question-area .answer-callout a {
      margin-left: 30px; }
    .question-area .answer-callout p {
      font-size: 14px; }

.question-area.gender-m .answer-heading {
  color: #208abb; }

#recommended_stories {
  margin-top: 150px; }
  #recommended_stories .l-contents {
    text-align: center;
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 0 80px;
    background: #f1f7e8;
    z-index: -3; }
  #recommended_stories .contents-wrapper {
    position: relative;
    width: auto; }
  #recommended_stories .headding {
    margin-top: -70px;
    margin-bottom: 60px;
    text-align: center; }
  #recommended_stories .stories-list {
    width: 1100px;
    margin: 0 auto; }

#special-contents .title_ {
  position: relative; }
  #special-contents .title__area {
    text-align: center; }

#special-contents .sub-ttl {
  position: absolute;
  font-size: 1.4rem;
  font-weight: bold;
  left: 43%;
  top: 13%; }

#special-contents .heading-lead {
  padding-top: 45px;
  text-align: center !important; }
  #special-contents .heading-lead__ttl {
    padding: 0 !important;
    border-right: none !important;
    color: #000; }