@charset "UTF-8";


/**/
#container {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#container * {
  box-sizing: border-box;
}
.questionList a:link,.questionList a:visited {
  color: #fff;
}
.questionList a:hover {
  text-decoration: none;
}
/*
main, aside {
  display: block; }
*/
/*
.pagetop, #footer * {
  box-sizing: content-box; }
*/

/* PC共通スタイル */
@media print, screen and (min-width: 769px) {
  .pc-only {
    display: block; }

  .sp-only {
    display: none; }

  .slick-track {
    display: flex;
    justify-content: space-between; } }
/* SP共通スタイル */
@media only screen and (max-width: 768px) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: block;
  }
    #container {
      margin-bottom: 40px;
    }
  #container img {
    max-width: 100%; }
  }
@media print, screen and (min-width: 769px) {
  .button {
    font-weight: normal;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: 5px;
    cursor: pointer;
    border: none; }
    .button.orange {
      color: #fff;
      background: #ee551b;
      box-shadow: 0px 5px 0px #76360f; }
    .button.blue {
      color: #fff !important;
      background: #0234a2;
      box-shadow: 0px 5px 0px #011a51; }
    .button.yellow {
      color: #000;
      background: #ffca0e;
      box-shadow: 0px 5px 0px #7f6507;
      min-width: 360px; }
    .button.g-search, .button.copyclip {
      background: none;
      border: 1px solid #dadada;
      padding: 5px;
      border-radius: 5px;
      color: #1a48a6;
      cursor: pointer;
      position: relative;
      width: 100%;
      display: block;
      margin-top: 16px;
      padding: 8px;
      font-size: .875rem; }
    .button.g-search > .icon-external_bk::after, .button.copyclip > .icon-external_bk::after {
      margin-left: 0.4em;
      content: '';
      left: 50px;
      vertical-align: -0.1em;
      display: inline-block;
      width: 16px;
      height: 14px;
      background: url("../images/icon_external_bk.png") no-repeat;
      background-size: 100%; }
    .button.white-arrow::after {
      position: absolute;
      right: 33px;
      top: 50%;
      transform: translateY(-50%) rotate(-45deg);
      content: '';
      width: 20px;
      height: 20px;
      border-right: 1px solid #fff;
      border-bottom: 1px solid #fff; }
    .button.white-arrow-s::after {
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%) rotate(-45deg);
      content: '';
      width: 11px;
      height: 11px;
      border-right: 1px solid #fff;
      border-bottom: 1px solid #fff; }
    .button.black-arrow::after {
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%) rotate(-45deg);
      content: '';
      width: 20px;
      height: 20px;
      border-right: 1px solid #000;
      border-bottom: 1px solid #000; }
    .button:hover {
      opacity: 0.7;
      text-decoration: none; }

  .icon-external::after {
    content: '';
    display: inline-block;
    top: 50%;
    width: 16px;
    height: 14px;
    margin-left: 0.8em;
    background: url("../images/icon_external.png") no-repeat;
    background-size: 100% auto; } }
@media only screen and (max-width: 768px) {
  .button {
    font-weight: normal;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 4.167vw;
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: 5px; }
    .button.orange {
      color: #fff;
      background: #ee551b;
      box-shadow: 0px 5px 0px #76360f; }
    .button.blue {
      color: #fff !important;
      background: #0234a2;
      box-shadow: 0px 5px 0px #011a51; }
    .button.yellow {
      color: #000;
      background: #ffca0e;
      box-shadow: 0px 5px 0px #7f6507; }
    .button.g-search, .button.copyclip {
      background: none;
      border: 1px solid #dadada;
      padding: 5px;
      border-radius: 5px;
      color: #1a48a6;
      cursor: pointer;
      position: relative;
      width: 100%;
      display: block;
      padding: 8px;
      font-size: 3.333vw; }
    .button.g-search > .icon-external_bk::after, .button.copyclip > .icon-external_bk::after {
      content: '';
      margin-left: 0.3em;
      vertical-align: -0.1em;
      display: inline-block;
      width: 3.611vw;
      height: 3.333vw;
      background: url("../images/icon_external_bk.png") no-repeat;
      background-size: 100%; }
    .button.white-arrow::after {
      position: absolute;
      right: 33px;
      top: 50%;
      transform: translateY(-50%) rotate(-45deg);
      content: '';
      width: 20px;
      height: 20px;
      border-right: 1px solid #fff;
      border-bottom: 1px solid #fff; }
    .button.black-arrow::after {
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%) rotate(-45deg);
      content: '';
      width: 20px;
      height: 20px;
      border-right: 1px solid #000;
      border-bottom: 1px solid #000; }
    .button:hover {
      opacity: 0.7;
      text-decoration: none; }

  .icon-external::after {
    content: '';
    display: inline-block;
    top: 50%;
    width: 20px;
    height: 18px;
    margin-left: 0.5em;
    background: url("../images/icon_external.png") no-repeat; } }
@media only screen and (max-width: 768px) {
  .button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 4.167vw;
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: 5px; }
    .button.orange {
      color: #fff;
      background: #ee551b;
      box-shadow: 0px 5px 0px #76360f; }
    .button.yellow {
      color: #000;
      background: #ffca0e;
      box-shadow: 0px 5px 0px #7f6507; }
    .button.white-arrow {
      padding-left: 1em;
      padding-right: 1em; }
      .button.white-arrow::after {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%) rotate(-45deg);
        content: '';
        width: 10px;
        height: 10px;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff; }
    .button.black-arrow {
      padding-left: 1em;
      padding-right: 1em; }
      .button.black-arrow::after {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%) rotate(-45deg);
        content: '';
        width: 10px;
        height: 10px;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000; }
    .button:hover {
      opacity: 0.7;
      text-decoration: none; } }
/* ------------------------------------
    診断コンテンツトップ
------------------------------------ */
@media print, screen and (min-width: 769px) {
  main .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
  }

  .contentsHeader {
    width: 100%;
    height: 650px;
    display: flex; }

  .contentsHeaderImage {
    width: calc(100vw - 586px);
    background: url("../images/main_visual.jpg") no-repeat center center;
    background-size: cover; }

  .contentsHeaderFrame {
    width: 586px;
    height: 100%;
    padding-top: 30px;
    background: #fff;
    position: relative;
    align-self: center; }
    .contentsHeaderFrame::after {
      position: absolute;
      right: 20px;
      bottom: -30px;
      content: '';
      display: block;
      width: 176px;
      height: 416px;
 }

  .contentsHeader .titleLogo {
    margin-left: -30px;
    margin-bottom: 30px;
    width: 346px; }

  .contentsHeaderDescription {
    text-align: left;
    font-size: 1.0rem;
    line-height: 1.625;
    margin-left: 56px;
    margin-bottom: 60px; }

  .contentsHeader .button {
    margin-left: 56px;
    font-size: 2.125rem;
    width: 380px;
    padding: 17px 0; }

  .contentsFooter .button {
    margin: 60px auto;
    display: block;
    text-align: center;
    font-size: 2.125rem;
    width: 380px;
    padding: 17px 0; }

  .userData {
    display: flex;
    border-bottom: 1px solid #dddddd; }

  .userDataTitle {
    font-size: 1.375rem;
    text-align: center;
    line-height: 1.455;
    margin-bottom: 25px; }
    .userDataTitle .brown {
      font-size: 2.25rem;
      color: #50351e;
      border-bottom: 1px dotted #000; }
    .userDataTitle .orange {
      font-size: 2.25rem;
      color: #ff8000; }

  .userData .graph {
    width: 50%;
    padding-top: 60px;
    padding-bottom: 70px;
    border-right: 1px solid #dddddd; }
  .userData .graphImage {
    max-width: 540px;
    margin: 0 auto; }
    .userData .graphImage img {
      max-width: 100%; }
  .userData .graphNote {
    font-size: .8125rem;
    padding-left: 75px; }
  .userData .voice {
    width: 50%;
    padding-top: 60px;
    padding-left: 50px;
    padding-bottom: 70px; }
  .userData .voiceList {
    border-top: 2px dotted #666666; }
    .userData .voiceList li {
      font-size: 1.0rem;
      line-height: 1.625;
      border-bottom: 2px dotted #666666;
      padding: 18px 0; }
      .userData .voiceList li .author {
        text-align: right;
        padding-top: 5px; }

  .takitate {
    padding-top: 70px;
    padding-bottom: 70px; }

  .takitateTitle {
    text-align: center;
    font-size: 1.875rem;
    margin-bottom: 30px; }

  .takitateContent {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 60px; }

  .takitateDescription {
    max-width: 480px; }
    .takitateDescription p {
      font-size: 1.0rem;
      line-height: 1.813; }
    .takitateDescription a:link, .takitateDescription a:visited {
      color: #1a48a6; }

  .takitateImage {
    max-width: 724px;
    text-align: right; }
    .takitateImage img {
      max-width: 110px; }

  .takitateLink {
    cursor: pointer;
    display: block;
    width: 400px;
    text-align: center;
    font-size: 1.625rem;
    padding: 20px 0;
    border-radius: 7px;
    border: 1px solid #000;
    margin: 0 auto;
    border-radius: 7px;
    position: relative; }
    .takitateLink::after {
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%);
      content: '';
      display: block;
      width: 10%;
      height: 0;
      padding-top: 10%;
      background: #000;
      border-radius: 50%; }
    .takitateLink::before {
      position: absolute;
      z-index: 2;
      right: 35px;
      top: 50%;
      transform: translateY(-50%) rotate(-45deg);
      content: '';
      display: block;
      width: 12px;
      height: 12px;
      border-right: 1px solid #fff;
      border-bottom: 1px solid #fff; }
    .takitateLink:hover {
      text-decoration: none;
      opacity: 0.7; }

  /* おすすめ コンテンツ */
  .recommendContents {
    background: #f5f6f8;
    padding: 50px 0; }

  .recommendContentsList {
    max-width: 1200px;
    position: relative; }

  .recommendContentsItem {
    margin-left: 20px; }
    .recommendContentsItem:first-child {
      margin-left: 0; }
    .recommendContentsItem a {
      display: block; }
      .recommendContentsItem a:hover {
        opacity: 0.7; }
    .recommendContentsItem * {
      outline: none; }

  .recommendContents .slick-prev, .recommendContents .slick-next {
    position: absolute;
    top: 56px;
    width: 27px;
    height: 27px;
    border-top: 0;
    border-right: 3px solid #333333;
    border-bottom: 3px solid #333333;
    transition: opacity 0.5s; }
  .recommendContents .slick-prev::before, .recommendContents .slick-prev::after {
    display: none; }
  .recommendContents .slick-next::before, .recommendContents .slick-next::after {
    display: none; }
  .recommendContents .slick-prev:hover, .recommendContents .slick-next:hover {
    opacity: 0.7; }
  .recommendContents .slick-prev {
    left: -50px;
    transform: rotate(135deg); }
  .recommendContents .slick-next {
    right: -30px;
    transform: rotate(-45deg); }
  .recommendContents .slick-dots {
    padding-top: 10px; }
    .recommendContents .slick-dots li {
      margin: 0 8px; }
    .recommendContents .slick-dots button {
      background: #cccccc;
      width: 12px;
      height: 12px; }
      .recommendContents .slick-dots button:hover {
        opacity: 0.7; }
      .recommendContents .slick-dots button::before, .recommendContents .slick-dots button::after {
        display: none; }
    .recommendContents .slick-dots .slick-active button {
      background: #ff9c00; }
      .recommendContents .slick-dots .slick-active button[aria-label="1 of 1"] {
        display: none; }

  .recommendContentsTitle {
    text-align: center;
    font-size: 1.875rem;
    margin-bottom: 50px; }

  .recommendContentsImage {
    margin-bottom: 15px; }
    .recommendContentsImage img {
      max-width: 100%; }

  .recommendContentsCaption {
    width: 100%;
    text-align: center;
    text-decoration: underline;
    font-size: 1.0rem; } }
@media only screen and (max-width: 768px) {
  .main {
    overflow-x: hidden; }

  .container {
    margin: 0 auto; }

  .contentsHeader {
    width: 100%; }

  .contentsHeader .titleLogo {
    width: 78.2666666667%;
    margin: 0 auto;
    padding-top: 5.3333333333%;
    padding-bottom: 5.3333333333%; }

  .contentsHeaderImage {
    width: 100%;
    height: 59.7333333333vw;
    background: url("../images/main_visual.jpg") no-repeat;
    background-size: cover; }

  .contentsHeaderFrame {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    position: relative;
    padding-bottom: 4.839%;
    border-radius: 10px; }
    .contentsHeaderFrame::after {
      position: absolute;
      right: 0px;
      bottom: 0px;
      transform: translateY(-4vw);
      content: '';
      display: block;
      width: 21.0666666667vw;
      padding-top: 52.9333333333vw;
      height: 0px;
      background-size: 100%; }

  .contentsHeaderDescription {
    font-size: 2.9333333333vw;
    line-height: 1.625;
    text-align: center;
    margin-bottom: 3.226%;
    padding: 6.6666666667vw 10.4vw; }

  .contentsHeader .button {
    display: block;
    font-size: 5.556vw;
    max-width: 53.3333333333vw;
    margin: 0 auto;
    padding: 2% 50px; }

  .contentsFooter .button {
    display: block;
    font-size: 5.556vw;
    max-width: 53.3333333333vw;
    margin: 10px auto;
    padding: 2% 50px; }

  .userDataTitle {
    font-size: 3.651vw;
    text-align: center;
    line-height: 1.455;
    margin-bottom: 25px; }
    .userDataTitle .brown {
      font-size: 5.997vw;
      color: #50351e;
      border-bottom: 1px dotted #000; }
    .userDataTitle .orange {
      font-size: 5.997vw;
      color: #ff8000; }

  .userData .graph {
    padding-top: 11.111%;
    border-right: 1px solid #dddddd;
    margin-bottom: 13.889%; }
  .userData .graphImage {
    margin: 0 5.556%;
    text-align: center; }
    .userData .graphImage img {
      max-width: 100%; }
  .userData .graphNote {
    font-size: 2.608vw;
    padding-left: 5.556%; }
  .userData .voice {
    margin-bottom: 13.889%; }
  .userData .voiceList {
    width: 88.889%;
    margin: 0 auto;
    border-top: 2px dotted #666666; }
    .userData .voiceList li {
      font-size: 3.39vw;
      line-height: 1.462;
      border-bottom: 2px dotted #666666;
      padding: 3.906% 0; }
      .userData .voiceList li .author {
        text-align: right;
        padding-top: 1.563%; }

  .takitate {
    padding-top: 9.722%;
    padding-bottom: 9.722%; }

  .takitateTitle {
    text-align: center;
    font-size: 5.215vw;
    margin-bottom: 4.167%; }

  .takitateContent {
    align-items: center;
    margin-bottom: 60px; }

  .takitateDescription {
    text-align: center;
    margin-bottom: 4.167%; }
    .takitateDescription p {
      font-size: 3.129vw;
      line-height: 1.417; }
    .takitateDescription a:link, .takitateDescription a:visited {
      color: #1a48a6; }

  .takitateImage {
    width: 94.444%;
    text-align: center;
    margin: 0 auto; }
    .takitateImage::after {
      content: '';
      display: table;
      clear: both; }
    .takitateImage img {
      width: 17.778vw;
      height: 17.778vw; }

  .takitateLink {
    cursor: pointer;
    display: block;
    width: 69.444%;
    text-align: center;
    font-size: 3.611vw;
    padding: 20px 0;
    border-radius: 7px;
    border: 1px solid #000;
    margin: 0 auto;
    border-radius: 7px;
    position: relative; }
    .takitateLink span {
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%);
      content: '';
      display: block;
      width: 10%;
      height: 0;
      padding-top: 10%;
      background: #000;
      border-radius: 50%; }
      .takitateLink span::before {
        position: absolute;
        z-index: 2;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%) rotate(-45deg);
        content: '';
        display: block;
        width: 30%;
        height: 0px;
        padding-top: 30%;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff; }
    .takitateLink:hover {
      text-decoration: none;
      opacity: 0.7; }

  /* おすすめ コンテンツ */
  .recommendContents {
    background: #f5f6f8;
    padding: 11.111% 6.944%; }

  .recommendContentsList {
    position: relative;
    margin: 0 -5px; }

  .recommendContentsItem {
    padding: 0 5px; }
    .recommendContentsItem:first-child {
      margin-left: 0; }
    .recommendContentsItem a {
      display: block; }
      .recommendContentsItem a:hover {
        opacity: 0.7; }
    .recommendContentsItem * {
      outline: none; }

  .recommendContents .slick-prev, .recommendContents .slick-next {
    position: absolute;
    top: 25%;
    width: 15px;
    height: 15px;
    border-top: 0;
    border-right: 3px solid #333333;
    border-bottom: 3px solid #333333;
    transition: opacity 0.5s; }
  .recommendContents .slick-prev::before, .recommendContents .slick-prev::after {
    display: none; }
  .recommendContents .slick-next::before, .recommendContents .slick-next::after {
    display: none; }
  .recommendContents .slick-prev:hover, .recommendContents .slick-next:hover {
    opacity: 0.7; }
  .recommendContents .slick-prev {
    left: -15px;
    transform: rotate(135deg); }
  .recommendContents .slick-next {
    right: -15px;
    transform: rotate(-45deg); }
  .recommendContents .slick-dots {
    padding-top: 10px;
    bottom: -40px; }
    .recommendContents .slick-dots button {
      background: #cccccc;
      border-radius: 50%;
      width: 12px;
      height: 12px; }
      .recommendContents .slick-dots button::before, .recommendContents .slick-dots button::after {
        display: none; }
      .recommendContents .slick-dots button:hover {
        opacity: 0.7; }
    .recommendContents .slick-dots .slick-active button {
      background: #ff9c00; }
      .recommendContents .slick-dots .slick-active button[aria-label="1 of 1"] {
        display: none; }

  .recommendContentsTitle {
    text-align: center;
    font-size: 5.556vw;
    margin-bottom: 5.556%; }

  .recommendContentsImage {
    margin-bottom: 3.333%; }
    .recommendContentsImage img {
      max-width: 100%; }

  .recommendContentsCaption {
    width: 100%;
    text-align: center;
    text-decoration: underline;
    font-size: 3.333vw; } }
/* ------------------------------------
   質問ページ
------------------------------------ */
/* ステップバー
------------------------------- */
.questionProgress {
  position: absolute;
  top: 36px;
  left: 28.8333333333%;
  list-style-type: none;
  display: flex;
  width: auto;
  padding: 0;
  margin: 0;
  height: 44px;
  overflow: hidden;
  padding-right: 20px; }

.questionProgress li {
  position: relative;
  width: 90px;
  height: 100%;
  background: #cccccc;
  padding: 1em 2.5em 1em 2em;
  color: #fff; }

.questionProgress li:before,
.questionProgress li:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto; }

.questionProgress li:before {
  top: -22px;
  right: -1em;
  border-style: solid;
  border-color: transparent transparent transparent #fff;
  border-width: 44px 0 44px 1em;
  z-index: 10; }

.questionProgress li:after {
  top: -22px;
  right: -0.5em;
  border-style: solid;
  border-color: transparent transparent transparent #cccccc;
  border-width: 44px 0 44px 1em;
  z-index: 10; }

.questionProgress li.is-current {
  background: #f3981b;
  font-weight: bold; }

.questionProgress li.is-current:after {
  border-color: transparent transparent transparent #f3981b; }

@media only screen and (max-width: 768px) {
  .questionProgress {
    top: 14.6666666667vw;
    left: 50%;
    transform: translateX(-48%);
    padding: 0;
    height: 5.8666666667vw;
    overflow: hidden;
    padding-right: 20px; }

  .questionProgress li {
    position: relative;
    width: 12vw;
    height: 5.8666666667vw;
    background: #cccccc;
    padding: 0;
    color: #fff; }
    .questionProgress li:first-child {
      width: 10.6666666667vw; }

  .questionProgress li:before {
    top: -2.9333333333vw;
    right: -1em;
    border-style: solid;
    border-color: transparent transparent transparent #fff;
    border-width: 5.8666666667vw 0 5.8666666667vw 1em;
    z-index: 10; }

  .questionProgress li:after {
    top: -2.9333333333vw;
    right: -0.5em;
    border-style: solid;
    border-color: transparent transparent transparent #cccccc;
    border-width: 5.8666666667vw 0 5.8666666667vw 1em;
    z-index: 10; } }
/* 戻るリンク
------------------------------- */
.prev-links {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 80px 20px;
  display: flex;
  justify-content: space-between; }
  .prev-links a {
    display: block;
    border: 1px solid #000000;
    padding: 28px 0;
    text-align: center;
    background: #fff;
    width: 48.0769230769%;
    font-size: 26px;
    border-radius: 8px; }
    .prev-links a.prev {
      background: #fff url("../images/icon_arrow_prev.png") no-repeat left 20px center; }
    .prev-links a.first {
      background: #fff url("../images/icon_arrow_first.png") no-repeat left 20px center; }

@media only screen and (max-width: 768px) {
  .prev-links {
    width: 66.6666666667vw;
    padding: 6.6666666667vw 0 2.6666666667vw;
    display: block; }
    .prev-links a {
      width: 100%;
      display: block;
      padding: 3.4666666667vw 0;
      text-align: center;
      background: #fff;
      font-size: 3.4666666667vw;
      border-radius: 8px; }
      .prev-links a.prev {
        background: #fff url("../images/icon_arrow_prev.png") no-repeat left 20px center;
        background-size: 5.3333333333vw auto;
        margin-bottom: 4vw; }
      .prev-links a.first {
        background: #fff url("../images/icon_arrow_first.png") no-repeat left 20px center;
        background-size: 5.3333333333vw auto; } }
@media print, screen and (min-width: 769px) {
  .questionContainer {
    display: block;
    background: #e6e6e6;
    padding: 70px 0 50px; }

  .question {
    max-width: 1200px;
    margin: 0 auto;
    padding: 140px 80px 60px;
    background: #fff;
    position: relative; }
    .questionLogo {
      top: -38px;
      left: 0;
      margin-left: 6.6666666667%;
      position: absolute;
      width: 20.25%; }
      .questionLogo img {
        width: 100%; }
    .questionNumber {
      text-align: center;
      color: #ff9c00;
      margin-bottom: 55px; }
      .questionNumber small {
        display: block;
        font-size: .875rem;
        margin-bottom: 0.3em; }
      .questionNumberText {
        font-size: 4.125rem;
        letter-spacing: -0.05em; }
    .questionTitle {
      text-align: center;
      font-size: 1.875rem;
      line-height: 1.5;
      font-weight: normal;
      margin-bottom: 60px; }
    .questionList {
      display: flex;
      flex-wrap: wrap;
      max-width: 1040px;
      margin: 0 auto 30px;
      position: relative; }
      .questionList::before {
        content: "";
        width: 14.9038461538%;
        padding-top: 19.1346153846%;
        height: 0px;
        position: absolute;
        right: 52px;
        top: 0;
        transform: translateY(-100%);
        background-size: cover; }
      .questionList li {
        width: 48.0769230769%;
        margin-left: 3.8461538462%; }
        .questionList li::after {
          content: "";
          display: block;
          margin-bottom: 4%; }
        .questionList li:nth-child(2n + 1) {
          margin-left: 0; }
        .questionList li a {
          display: flex;
          line-height: 1.3;
          align-items: center;
          height: 65px;
          background: #ee551b;
          border-radius: 7px;
          color: #fff;
          font-size: 1.25rem;
          padding: 0 50px 0 32px;
          box-shadow: 0px 5px 0px #772a0d;
          text-decoration: none;
          position: relative; }
          .questionList li a::after {
            position: absolute;
            right: 33px;
            top: 50%;
            transform: translateY(-50%) rotate(-45deg);
            content: "";
            width: 27px;
            height: 27px;
            border-right: 1px solid #fff;
            border-bottom: 1px solid #fff; }
          .questionList li a:hover {
            opacity: 0.7; }

  .survayGreeting {
    text-align: center;
    color: #ff9c00;
    margin-bottom: 55px;
    font-size: 2.25rem;
    line-height: 1.5;
    letter-spacing: -0.05em; }
  .survayTitle {
    text-align: center;
    font-size: 1.875rem;
    line-height: 1.5;
    font-weight: normal;
    margin-bottom: 40px; }
  .survayList {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px; }
    .survayList li {
      width: 25%;
      font-size: 1.25rem;
      vertical-align: middle; }
      .survayList li > div {
        display: flex;
        height: 100%;
        align-items: center; }
      .survayList li label {
        display: inline-block;
        cursor: pointer;
        padding-left: 0.5em; }
      .survayList li#other {
        width: 50%; }
        .survayList li#other input[type="text"] {
          padding: 8px;
          margin-left: 1em;
          font-size: 1.0rem;
          width: calc(100% - 10em); }
      .survayList li::after {
        content: "";
        display: block;
        margin-bottom: 7.6923076923%; }
  .survayThanks {
    text-align: center;
    font-size: 1.0rem;
    color: #ff9c00;
    margin-bottom: 10px; }
  .survaySubmit {
    width: 400px;
    margin: 0 auto;
    display: flex; }

  .furtherInfo {
    border: 2px dotted #000000;
    border-radius: 10px;
    padding: 30px 28px;
    text-align: center; }
    .furtherInfo::after {
      display: table;
      content: "";
      clear: both; }
    .furtherInfo.small {
      width: 740px;
      margin: 0 auto; }
    .furtherInfoTitle {
      color: #000;
      font-size: 1.25rem;
      text-decoration: none;
      display: inline-block;
      text-align: center;
      margin-bottom: 30px;
      position: relative;
      border: none; }
      .furtherInfoTitle::before {
        position: absolute;
        left: -50px;
        top: 50%;
        transform: translateY(-50%);
        width: 38px;
        height: 40px;
        content: "";
        display: block;
        background: url("../images/icon_rice.png") no-repeat left center; }

  .donabePoint {
    display: flex; }
    .donabePoint li {
      width: 31.25%;
      font-size: 1.125rem;
      text-align: left;
      margin-left: 3.125%; }
      .donabePoint li:nth-child(1) {
        margin-left: 0; }
      .donabePoint li img {
        max-width: 100%;
        height: auto; }
      .donabePoint li .number {
        vertical-align: -2px;
        display: inline-flex;
        font-family: "Arial";
        font-weight: normal;
        width: 40px;
        height: 40px;
        align-items: center;
        justify-content: center;
        border: 1px solid #ff9c00;
        color: #ff9c00;
        border-radius: 50%;
        font-size: 1.875rem; }
      .donabePoint li p {
        font-size: 1.0rem;
        line-height: 1.8125; }
    .donabePointImage {
      margin: 10px 0 20px; }

  .donabeBlock {
    float: left;
    width: 48.9795918367%; }
    .donabeBlock:last-child {
      float: right; }
    .donabeBlock .furtherInfoTitle {
      margin-bottom: 30px; }

  .donabeCoating {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 0 auto;
    flex-wrap: wrap;
    align-items: center;
    position: relative; }
    .donabeCoatingImage {
      width: 59.5833333333%; }
      .donabeCoatingImage img {
        max-width: 100%; }
    .donabeCoatingDescription {
      height: 100%;
      text-align: left;
      width: 38.3333333333%; }
    .donabeCoatingNote {
      position: absolute;
      bottom: 0; } }
@media only screen and (max-width: 768px) {
  .questionContainer {
    background: #e6e6e6;
    padding: 20.8333333333% 0 5.5555555556%; }

  .question {
    max-width: 88.8888888889%;
    margin: auto;
    padding: 28% 7.03125% 7.03125%;
    background: #fff;
    position: relative; }
    .questionLogo {
      width: 37.3333333333vw;
      left: 50%;
      top: 0;
      transform: translateX(-50%);
      margin-top: -17.1875%;
      position: absolute; }
    .questionNumber {
      text-align: center;
      color: #ff9c00;
      margin-bottom: 9.375%; }
      .questionNumber small {
        display: block;
        font-size: 2.7777777778vw;
        margin-bottom: 0.3em; }
      .questionNumberText {
        font-size: 12.5vw;
        letter-spacing: -0.05em; }
    .questionTitle {
      text-align: center;
      font-size: 5.5555555556vw;
      line-height: 1.5;
      font-weight: normal;
      margin-bottom: 10.9375%; }
    .questionList {
      width: 100%;
      margin: 0 auto 9.375%; }
      .questionList li {
        width: 100%; }
        .questionList li::after {
          content: "";
          display: block;
          margin-bottom: 5.3571428571%; }
        .questionList li a {
          display: flex;
          align-items: center;
          padding: 5.3571428571% 8.9285714286% 5.3571428571% 7.1428571429%;
          background: #ee551b;
          border-radius: 7px;
          color: #fff;
          font-size: 4.1666666667vw;
          box-shadow: 0px 5px 0px #772a0d;
          text-decoration: none;
          position: relative; }
          .questionList li a::after {
            position: absolute;
            right: 20px;
            top: 50%;
            transform: translateY(-50%) rotate(-45deg);
            content: "";
            width: 4.8214285714%;
            height: 0px;
            padding-top: 4.8214285714%;
            border-right: 1px solid #fff;
            border-bottom: 1px solid #fff; }
          .questionList li a:hover {
            opacity: 0.7; }

  .survayGreeting {
    text-align: center;
    color: #ff9c00;
    margin-bottom: 9.375%;
    line-height: 1.5;
    font-size: 5.5555555556vw;
    letter-spacing: -0.05em; }
  .survayTitle {
    text-align: center;
    font-size: 5.5555555556vw;
    line-height: 1.5;
    font-weight: normal;
    margin-bottom: 10.9375%; }
  .survayList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 4.6875%; }
    .survayList li {
      width: 46.875%;
      font-size: 3.8888888889vw;
      vertical-align: middle;
      margin-bottom: 4.6875%; }
      .survayList li > div {
        display: flex;
        height: 100%;
        align-items: center; }
      .survayList li label {
        cursor: pointer;
        padding-left: 0.5em; }
      .survayList li#other {
        width: 100%; }
        .survayList li#other input[type="text"] {
          padding: 8px;
          margin-left: 1em;
          font-size: 1.0rem;
          width: 12em;
          border: 1px solid #ccc; }
      .survayList li::after {
        content: "";
        display: block;
        margin-bottom: 7.6923076923%; }
  .survayThanks {
    text-align: center;
    font-size: 3.3333333333vw;
    color: #ff9c00;
    margin-bottom: 3.125%; }
  .survaySubmit {
    width: 78.125%;
    border: none;
    margin: 0 auto;
    display: flex; }

  .sp_device .furtherInfo {
    border: 1px dotted #000000;
    border-radius: 10px;
    padding: 25px 4.6875%;
    text-align: center; }
    .sp_device .furtherInfoTitle {
      color: #000;
      text-decoration: none;
      border: none;
      padding: 0 0 0 calc(14 / 720 * 100vw);
      font-size: 3.9113428944vw;
      display: inline-block;
      text-align: center;
      margin-bottom: 30px;
      line-height: 1.15;
      position: relative; }
      .sp_device .furtherInfoTitle::before {
        position: absolute;
        top: 50%;
        transform: translate(-130%, -50%);
        width: calc(28 / 720 * 100vw);
        height: 0px;
        padding-top: 8.9285714286%;
        content: "";
        display: block;
        background: url("../images/icon_rice.png") no-repeat left center;
        background-size: 100% auto; }

  .donabePoint li {
    width: 100%;
    font-size: 3.3898305085vw;
    text-align: left;
    margin-bottom: 5.3571428571%; }
    .donabePoint li .number {
      vertical-align: -2px;
      display: inline-flex;
      font-family: "Arial";
      font-weight: normal;
      padding: 10px 14px;
      align-items: center;
      justify-content: center;
      border: 1px solid #ff9c00;
      color: #ff9c00;
      border-radius: 50%;
      font-size: 3.9113428944vw; }
    .donabePoint li p {
      font-size: 3.1290743155vw;
      line-height: 1.8125; }
  .donabePointImage {
    margin: 10px 0 20px; }

  .donabeCoating {
    display: block;
    width: auto;
    margin: 0 auto; }
    .donabeCoatingImage {
      max-width: 100%;
      margin-bottom: 4.6875%; }
      .donabeCoatingImage img {
        max-width: 100%; }
    .donabeCoatingDescription {
      text-align: left;
      margin-bottom: 4.6875%;
      font-size: 3.1290743155vw; }
    .donabeCoatingNote {
      font-size: 2.6075619296vw;
      width: 100%;
      text-align: right; } }

@media only screen and (max-width: 768px) {
  .ichigouPoint {
    font-size: 3.1290743155vw;
    text-align: left;
    line-height: 1.8125; } }


/* ------------------------------------
   結果ページ
------------------------------------ */
@media print, screen and (min-width: 769px) {
  .resultContainer {
    display: block;
    background: #e6e6e6;
    padding: 70px 0 30px; }

  .printButton {
    position: absolute;
    right: 100px;
    top: 30px;
    font-size: 1.0rem;
    color: #1a48a6;
    cursor: pointer;
    text-decoration: none !important; }
    .printButton:hover {
      opacity: 0.7; }
    .printButton .icon-printer {
      background: #fff;
      margin-bottom: 10px;
      border: 1px solid #dddddd;
      border-radius: 50%;
      width: 70px;
      height: 70px;
      position: relative;
      display: block; }
    .printButton .icon-printer::before {
      position: absolute;
      top: 50%;
      left: 19px;
      content: "";
      width: 30px;
      height: 26px;
      transform: translateY(-50%);
      background: url("../images/icon_printer.png") no-repeat;
      background-size: 100%; }

  .urlButton {
    position: absolute;
    right: 200px;
    top: 30px;
    font-size: 1.0rem;
    color: #1a48a6;
    cursor: pointer;
    text-decoration: none !important;
    text-align: center; }
    .urlButton:hover {
      opacity: 0.7; }
    .urlButton .icon-url {
      background: #fff;
      margin: 0 auto 10px;
      border: 1px solid #dddddd;
      border-radius: 50%;
      width: 70px;
      height: 70px;
      position: relative;
      display: block; }
    .urlButton .icon-url::before {
      position: absolute;
      top: 50%;
      left: 21px;
      content: "";
      width: 24px;
      height: 28px;
      transform: translateY(-50%);
      background: url("../images/icon_url.png") no-repeat;
      background-size: contain; }

  .footButtons {
    position: relative;
    width: auto;
    display: flex;
    width: 220px;
    margin: 0 auto 50px; }
    .footButtons .urlButton {
      position: static;
      display: block;
      margin-right: 50px; }
    .footButtons .printButton {
      position: static;
      display: block; }

  .result {
    max-width: 1200px;
    margin: 0 auto 40px;
    padding: 45px 0px 70px;
    background: #fff;
    position: relative; }

  .resultLogo {
    top: -38px;
    left: 0;
    margin-left: 6.667%;
    position: absolute;
    width: 243px; }
    .resultLogo img {
      width: 100%; }

  .resultTitle {
    color: #ff9a00;
    font-size: 3.75rem;
    text-align: center;
    margin-bottom: 40px; }
    .resultTitle span {
      display: inline-block;
      padding-bottom: 23px;
      border-bottom: 2px dotted #181818; }

  .productPersona {
    text-align: center;
    margin-bottom: 40px;
    font-size: 30px; }
    .productPersona strong {
      font-size: 40px; }

  .resultNote {
    text-align: center; }

  .otherRecommend {
    max-width: 1200px;
    margin: 0 auto 30px;
    position: relative; }

  .otherRecommendTitle {
    color: #ff9a00;
    font-size: 1.875rem;
    margin-bottom: 10px; }

  .otherRecommendBalloon {
    max-width: 1000px;
    margin: 0 auto;
    font-size: 1.0rem;
    line-height: 1.813;
    border-radius: 10px;
    padding: 33px;
    text-align: center;
    border: 2px dotted #000;
    position: relative;
    background: #fff; }

  .otherRecommendContent {
    display: flex;
    justify-content: space-between; }
    .otherRecommendContent > div {
      width: 440px; }

  .otherRecommendItem {
    width: 100%; }
    .otherRecommendItem:nth-child(1) {
      margin-left: 0; }

  .otherRecommendItemImage {
    float: left;
    width: 38.636%;
    min-height: 105px;
    margin-right: 2.273%; }
    .otherRecommendItemImage img {
      max-width: 100%;
      height: auto; }

  .otherRecommendItemName {
    float: right;
    width: 59.091%;
    text-align: left;
    margin-bottom: 22px; }
    .otherRecommendItemName a:link, .otherRecommendItemName a:visited {
      color: #1a48a6; }

  .otherRecommendItemLink {
    float: right;
    width: 59.091%;
    text-align: left; }
    .otherRecommendItemLink .button {
      display: block;
      width: 100%;
      font-size: 1.0rem;
      margin-bottom: 10px; }
      .otherRecommendItemLink .button.blue {
        padding: 18px 0 18px 0; }
      .otherRecommendItemLink .button.orange {
        padding: 18px 0 18px 0; }
      .otherRecommendItemLink .button::after {
        right: 18px;
        width: 10px;
        height: 10px;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff; }

  .otherRecommend .g-search,
  .otherRecommend .copyclip {
    clear: both;
    display: block;
    font-size: .875rem;
    width: 100%; }
  .otherRecommend .g-search:hover,
  .otherRecommend .copyclip:hover {
    color: #1a48a6; }

  .otherRecommendIllust {
    position: absolute;
    left: 50%;
    transform: translateX(415px);
    bottom: 0; }

  .reselection {
    padding-top: 60px;
    margin-bottom: 50px; }

  .reselectionButton {
    max-width: 1200px;
    background: #fff;
    margin: 0 auto;
    border: 2px dotted #000;
    padding: 25px;
    font-size: 1.625rem;
    text-align: center;
    position: relative;
    cursor: pointer; }
    .reselectionButton::after {
      transition: 0.3s;
      position: absolute;
      top: 50%;
      transform-origin: center;
      transform: translateY(-60%) rotate(45deg);
      right: 60px;
      content: "";
      display: block;
      width: 27px;
      height: 27px;
      border-right: 2px solid #333333;
      border-bottom: 2px solid #333333; }
    .reselectionButton.open::after {
      transform: translateY(-30%) rotate(-135deg); }

  .reselectionOptions {
    border: 1px solid #dadada;
    border-top: none;
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 40px;
    background: #fff; }

  .reselection .question {
    padding-bottom: 0; }
  .reselection .questionList {
    margin-bottom: 20px; }

  .retryButton {
    width: 500px;
    margin: 0 auto; }
    .retryButton .button {
      background: #fff;
      color: #000;
      width: 100%;
      display: flex;
      border-radius: 10px;
      border: 1px solid #000000;
      font-size: 1.625rem; }
      .retryButton .button::after {
        content: "";
        display: block;
        width: 40px;
        height: 40px;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
        background: url("../images/icon_retry.png") no-repeat; }

  .compareButton {
    width: 500px;
    margin: 0 auto; }
    .compareButton .button {
      background: #fff;
      color: #000;
      width: 100%;
      display: flex;
      border-radius: 10px;
      border: 1px solid #000000;
      font-size: 1.625rem; }
      .compareButton .button::after {
        content: "";
        display: block;
        width: 40px;
        height: 40px;
        position: absolute;
        top: 50%;
        left: 20px;
        transform: translateY(-50%);
        background: url("../images/icon_compare.png") no-repeat; }

  .takikata {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 0 60px;
    text-align: center;
    font-size: 1.0rem; }

  .takikataTitle {
    font-size: 1.875rem;
    margin-bottom: 30px; }

  .takikataImage {
    display: flex;
    justify-content: space-between;
    max-width: 1000px;
    margin: 0 auto 20px; }
    .takikataImage a {
      display: block;
      text-decoration: none; }

  .takikata .printButton {
    top: 0;
    right: 0; }
  .takikata a {
    text-decoration: underline; }

  .resultFooter {
    background: #fff; }

  .resultFooterContainer {
    position: relative;
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 20px;
    padding-bottom: 100px; }

  .productCopy {
    font-size: 1.25rem;
    text-align: center;
    line-height: 1.8;
    margin-bottom: 30px;
    font-weight: normal; }

  .productImage {
    width: 700px;
    text-align: center;
    margin: 0 auto 30px; }
    .productImage::after {
      content: "";
      display: table;
      clear: both; }
    .productImage img {
      max-width: 100%;
      height: auto; }
    .productImage a {
      display: block; }

  .productImageMain {
    float: left;
    width: 340px; }
    .productImageMain.center {
      margin: 0 auto;
      float: none; }

  .productImageDemo {
    margin-bottom: 20px;
    float: right;
    width: 300px; }

  .productImageMenu {
    float: right;
    width: 300px; }

  .productName {
    text-align: center;
    color: #1a48a6;
    line-height: 1.8;
    font-size: 1.25rem;
    margin-bottom: 20px;
    font-weight: normal; }
    .productName a:link, .productName a:visited {
      color: #1a48a6; }

  .productDescription {
    font-weight: normal;
    text-align: center;
    font-size: 1.0rem;
    width: 860px;
    margin: 0 auto 26px;
    line-height: 1.813; }

  .productNote {
    font-weight: normal;
    text-align: center;
    font-size: .875rem;
    margin: 15px auto 0;
    line-height: 1.513; }

  .productRecommendPoint {
    border: 2px dotted #000;
    border-radius: 10px;
    max-width: 1000px;
    margin: 50px auto 70px;
    padding: 45px 50px 50px; }
    .productRecommendPointTitle {
      text-align: center;
      font-weight: bold;
      font-size: 30px;
      margin-bottom: 40px; }
    .productRecommendPoint ul {
      display: flex;
      justify-content: space-between; }
      .productRecommendPoint ul li {
        width: 27%;
        text-align: center; }
        .productRecommendPoint ul li img {
          max-width: 100%; }
        .productRecommendPoint ul li h4 {
          color: #ff9a00;
          font-size: 20px;
          font-weight: bold;
          margin-bottom: 20px; }
          .productRecommendPoint ul li h4 strong {
            font-size: 30px; }
        .productRecommendPoint ul li p {
          text-align: center;
          margin-bottom: 24px;
          font-size: 16px; }

  .productLink {
    display: flex;
    justify-content: space-between;
    max-width: 740px;
    margin: 0 auto; }

  .productLinkItem {
    width: 47.297%;
  }
    .productLinkItem .button {
      font-size: 1.25rem;
      width: 100%;
    }
      .productLinkItem .button.blue {
        padding: 25px 0;
      }
      .productLinkItem .button.orange {
        padding: 25px 0;
      }
      .productLinkItem .button.g-search, .productLinkItem .button.copyclip {
        margin-top: 0;
        font-size: .875rem; } }
@media only screen and (max-width: 768px) {
  .resultContainer {
    background: #e6e6e6;
    padding: 20.833% 0 6.6666666667vw; }

  .printButton {
    display: none; }

  .urlButton {
    position: absolute;
    right: 5.3333333333vw;
    top: -30px;
    font-size: 2.6666666667vw;
    color: #1a48a6;
    cursor: pointer;
    text-decoration: none !important;
    text-align: center; }
    .urlButton:hover {
      opacity: 0.7; }
    .urlButton .icon-url {
      background: #fff;
      margin: 0 auto 10px;
      border: 1px solid #dcdcdc;
      border-radius: 50%;
      width: 13.3333333333vw;
      height: 13.3333333333vw;
      position: relative;
      display: block; }
    .urlButton .icon-url::before {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      content: "";
      width: 4.8vw;
      height: 5.6vw;
      background: url("../images/icon_url.png") no-repeat;
      background-size: contain; }

  .footButtons {
    position: relative;
    text-align: center; }
    .footButtons .urlButton {
      position: static; }

  .result {
    max-width: 88.889%;
    margin: 0 auto 8.333vw;
    padding: 12.5% 3.125% 1.563%;
    background: #fff;
    position: relative; }

  .resultLogo {
    width: 37.3333333333vw;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    margin-top: -17.188%;
    position: absolute; }

  .resultTitle {
    color: #ff9a00;
    font-size: 8.333vw;
    text-align: center;
    margin-bottom: 6.25%; }

  .productPersona {
    text-align: center;
    font-size: 4vw;
    padding: 1.3333333333vw; }
    .productPersona strong {
      font-size: 5.3333333333vw; }

  .result .button.g-search, .result .button.copyclip {
    margin-top: 4.167vw; }

  .resultNote {
    text-align: center;
    font-size: 2.778vw;
    max-width: 83.333%;
    margin: 0 auto; }

  .otherRecommend {
    max-width: 88.889%;
    margin: 0 auto;
    position: relative; }

  .otherRecommendTitle {
    color: #ff9a00;
    font-size: 3.911vw;
    margin-bottom: 4.688%; }

  .otherRecommendItem {
    align-items: center;
    margin-bottom: 10.345%; }
    .otherRecommendItem:last-child {
      margin-bottom: 0; }

  .otherRecommendItemImage {
    float: left;
    width: 29.31%; }
    .otherRecommendItemImage img {
      max-width: 100%;
      height: auto; }

  .otherRecommendItemName {
    float: right;
    width: 65.517%;
    text-align: left;
    margin-bottom: 22px; }
    .otherRecommendItemName a:link, .otherRecommendItemName a:visited {
      color: #1a48a6; }

  .otherRecommendItemLink {
    clear: both;
    width: 100%;
    width: 100%;
    padding: 8px 0;
    font-size: 3.911vw; }
    .otherRecommendItemLink .button {
      display: block;
    }
      .otherRecommendItemLink .button.blue {
        padding: 18px 0 18px 1.5em;
        margin-bottom: 4.167vw; }
      .otherRecommendItemLink .button.orange {
        padding: 18px 0 18px 1.5em;
      }
    .otherRecommendItemLink::after {
      width: 10px;
      height: 10px;
      border-right: 1px solid #fff;
      border-bottom: 1px solid #fff; }

  .otherRecommendBalloon {
    margin: 0 auto 4.167%;
    font-size: 3.333vw;
    line-height: 1.813;
    border-radius: 10px;
    padding: 20px;
    text-align: center;
    border: 2px dotted #000;
    position: relative;
    background: #fff; }

  .otherRecommendIllust {
    width: 30.517%;
    margin: -13.103% auto 0; }

  .otherRecommend {
    width: 100%;
    margin: 0 auto;
    position: relative; }

  .reselection {
    padding-top: 8vw;
    margin-bottom: 50px; }

  .reselectionButton {
    background: #fff;
    max-width: 88.889%;
    margin: 0 auto;
    border: 2px dotted #000;
    padding: 6.944vw;
    font-size: 4.167vw;
    text-align: left;
    position: relative;
    cursor: pointer; }
    .reselectionButton::after {
      transition: 0.3s;
      position: absolute;
      top: 50%;
      transform-origin: center;
      transform: translateY(-70%) rotate(45deg);
      right: 5.556vw;
      content: "";
      display: block;
      width: 3.75vw;
      height: 3.75vw;
      border-right: 2px solid #333333;
      border-bottom: 2px solid #333333; }
    .reselectionButton.open::after {
      transform: translateY(-30%) rotate(-135deg); }

  .reselectionOptions {
    background: #fff;
    display: none;
    max-width: 88.889%;
    border: 1px solid #dadada;
    border-top: none;
    margin: 0 auto;
    padding-bottom: 40px; }

  .reselection .question {
    padding: 4.167vw 0 0; }
  .reselection .questionList {
    margin-bottom: 20px; }

  .retryButton {
    max-width: 88.889%;
    margin: 0 auto; }
    .retryButton .button {
      margin-top: 12.5%;
      width: 100%;
      display: flex;
      border-radius: 10px;
      background: #fff;
      color: #000;
      border: 1px solid #000000;
      font-size: 3.611vw; }
      .retryButton .button::after {
        content: "";
        display: block;
        width: 8%;
        padding-top: 8%;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
        background: url("../images/icon_retry.png") no-repeat;
        background-size: 100% auto; }

  .compareButton {
    max-width: 88.889%;
    margin: 0 auto; }
    .compareButton .button {
      margin-top: 12.5%;
      width: 100%;
      display: flex;
      border-radius: 10px;
      background: #fff;
      color: #000;
      border: 1px solid #000000;
      font-size: 3.611vw; }
      .compareButton .button::after {
        content: "";
        display: block;
        width: 8%;
        padding-top: 8%;
        position: absolute;
        top: 50%;
        left: 20px;
        transform: translateY(-50%);
        background: url("../images/icon_compare.png") no-repeat;
        background-size: 100% auto; }

  .printButton {
    top: 125px;
    right: 0; }

  .takikata {
    position: relative;
    max-width: 88.889%;
    margin: 0 auto;
    padding: 13.3333333333vw 0 60px;
    text-align: center;
    font-size: 3.333vw; }

  .takikataTitle {
    font-size: 5.556vw;
    margin-bottom: 30px; }

  .takikataImage {
    width: 100%;
    margin: 0 auto 2.604vw; }
    .takikataImage a {
      display: block;
      margin-bottom: 2.604vw; }

  .takikata .printButton {
    top: 0;
    right: 0; }
  .takikata a {
    text-decoration: underline; }

  .productCopy {
    font-size: 4.167vw;
    text-align: center;
    line-height: 1.8;
    margin-bottom: 7.167%;
    font-weight: normal; }

  .productImage {
    text-align: center;
    margin-bottom: 7%; }
    .productImage a {
      display: block;
      margin: 0 auto; }
      .productImage a::after {
        content: "";
        display: table;
        clear: both; }
      .productImage a img {
        max-width: 100%;
        height: auto; }

  .productImageMain {
    width: 56.667%;
    margin: 0 auto 20px; }

  .productImageDemo {
    float: left;
    width: 46.667%; }

  .productImageMenu {
    float: right;
    width: 46.667%; }

  .productName {
    text-align: center;
    font-weight: normal;
    line-height: 1.8;
    font-size: 4.167vw;
    margin-bottom: 3.833%; }
    .productName a:link, .productName a:visited {
      color: #1a48a6; }

  .productDescription {
    text-align: center;
    font-size: 3.611vw;
    line-height: 1.692;
    margin-bottom: 5.556%; }

  .productNote {
    font-weight: normal;
    text-align: left;
    font-size: .8125rem;
    margin: 15px auto 0;
    padding-left:1em;
    text-indent:-1em;
    line-height: 1.513; }

  .productRecommendPoint {
    border: 2px dotted #000;
    border-radius: 10px;
    width: 100%;
    margin: 8vw auto 6.6666666667vw;
    padding: 6.6666666667vw 10.4vw 6.6666666667vw; }
    .productRecommendPointTitle {
      text-align: center;
      font-weight: bold;
      font-size: 4vw;
      color: #ff9a00;
      margin-bottom: 5.3333333333vw; }
    .productRecommendPoint ul {
      display: block; }
      .productRecommendPoint ul li {
        width: 100%;
        text-align: center;
        margin-bottom: 6.6666666667vw; }
        .productRecommendPoint ul li:last-child {
          margin-bottom: 0; }
        .productRecommendPoint ul li h4 {
          color: #ff9a00;
          font-size: 4vw;
          font-weight: bold;
          margin-bottom: 2.6666666667vw; }
          .productRecommendPoint ul li h4 strong {
            font-size: 5.3333333333vw; }
        .productRecommendPoint ul li p {
          text-align: center;
          margin-bottom: 4.6666666667vw;
          font-size: 3.7333333333vw; }

  .productLink {
    margin: 0 auto; }

  .productLinkItem {
    margin-bottom: 4.167vw; }
    .productLinkItem .button {
      width: 100%; } }
@media print {
  .resultContainer {
    padding-top: 20px; }

  .result {
    padding-bottom: 20px; } }