@charset "UTF-8";

.u-ff-en {
  font-family: "Jost", sans-serif;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
section,
article,
aside,
hgroup,
header,
footer,
nav,
dialog,
figure,
menu,
video,
audio,
mark,
time,
canvas,
details {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: transparent;
  font-size: 100%;
}

section,
article,
aside,
hgroup,
header,
footer,
main,
nav,
dialog,
figure,
figcaption {
  display: block;
}

html {
  font-size: 62.5%;
}

@media screen and (max-width:767px) {
  html {
    font-size: 100%;
  }
}

body {
  line-height: 1;
  -webkit-text-size-adjust: 100%;
  -webkit-print-color-adjust: exact;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

:focus {
  outline-color: #aaa;
}

ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  -webkit-backface-visibility: hidden;
  vertical-align: bottom;
}

b,
strong,
em {
  font-weight: inherit;
  font-style: inherit;
}

html {
  font-size: 10px;
}

@media screen and (max-width:374px) {
  html {
    font-size: 2.6666666667vw;
  }
}

body {
  width: 100%;
  color: #333;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.4rem;
  font-weight: 400;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
}

@media screen and (max-width:767px) {
  body.is-locked {
    position: fixed;
    width: 100%;
    height: 100%;
  }
}

@media screen and (max-width:767px) {
  body {
    min-width: 320px;
  }
}

html,
body {
  font-size: 16px;
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  word-break: break-all;
  font-family: inherit;
  font-size: inherit;
}

a {
  text-decoration: none;
  color: inherit;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

a img,
a i {
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

iframe {
  vertical-align: bottom;
}

.hover-alpha a:hover img {
  opacity: 0.7;
}

::-webkit-input-placeholder {
  color: #ccc;
  padding-top: 0.2em;
}

:-moz-placeholder {
  color: #ccc;
  opacity: 1;
}

::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}

:-ms-input-placeholder {
  color: #ccc;
}

select,
textarea,
input[type=text],
input[type=email],
input[type=number],
input[type=tel],
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 0;
  line-height: 1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 0;
  border: none;
  background: none;
  font-size: 14px;
  font-family: "Noto Sans JP", sans-serif;
}

input[type=number] {
  -moz-appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=text],
input[type=email],
input[type=tel] {
  width: 100%;
  border: 1px solid #6168C0;
  background: #fff;
  padding: 0 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 44px;
  line-height: 44px;
  font-size: 1.6rem;
}

select {
  cursor: pointer;
  width: 100%;
  padding: 0 15px 0 15px;
  border: 1px solid #6168C0;
  background: #fff;
  color: #000;
  text-align: left;
  height: 42px;
  font-size: 1.6rem;
  border-radius: 10px;
  font-weight: bold;
}

select optgroup {
  text-align: left;
}

select::-ms-expand {
  display: none;
}

textarea {
  resize: none;
  width: 100%;
  line-height: 1.5;
  border: 1px solid #eee;
  background: #fff;
  font-size: 1.6rem;
  padding: 15px;
  font: inherit;
}

input[type=button],
input[type=submit] {
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  line-height: 1;
  cursor: pointer;
}

button {
  cursor: pointer;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

@media screen and (max-width:767px) {

  select,
  textarea,
  input[type=text],
  input[type=email],
  input[type=number],
  input[type=tel] {
    font-size: 1.6rem;
  }
}

.c-form-input {
  display: inline-block;
  width: 100%;
}

.c-form-radio {
  display: inline-block;
  cursor: pointer;
  min-height: 16px;
}

.c-form-radio span {
  display: block;
  padding: 1px 0 0 30px;
  position: relative;
  line-height: 1.3;
}

.c-form-radio span:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  border: 1px solid #eee;
  background: #fff;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.c-form-radio span:after {
  content: "";
  position: absolute;
  left: 6px;
  top: 6px;
  z-index: 1;
  background: #000;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  visibility: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.c-form-radio input[type=radio] {
  opacity: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
}

.c-form-radio input[type=radio]:focus+span:before {
  border: 1px solid #aaa;
}

.c-form-radio input[type=radio]:checked+span:after {
  visibility: visible;
}

.c-form-checkbox {
  display: inline-block;
  cursor: pointer;
  min-height: 16px;
}

.c-form-checkbox span {
  display: block;
  padding: 1px 0 0 23px;
  position: relative;
  line-height: 1.3;
}

.c-form-checkbox span:before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  z-index: 0;
  border: 1px solid #A0A0A0;
  background: #fff;
  width: 16px;
  height: 16px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 2px;
}

.c-form-checkbox span:after {
  content: "";
  display: block;
  width: 11px;
  height: 6px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  top: 7px;
  left: 3px;
  z-index: 1;
  visibility: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.c-form-checkbox input[type=checkbox] {
  opacity: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
}

.c-form-checkbox input[type=checkbox]:focus+span:before {
  border: 1px solid #aaa;
}

.c-form-checkbox input[type=checkbox]:checked+span:after {
  visibility: visible;
}

.c-form-select {
  position: relative;
}

.c-form-select:after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background-image: url("data:image/svg+xml,%3Csvg width='13' height='9' viewBox='0 0 13 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.24615 8.16375C6.84853 8.60939 6.15147 8.60939 5.75384 8.16375L0.625099 2.41577C0.0500447 1.77129 0.507514 0.750001 1.37125 0.750001L11.6287 0.750002C12.4925 0.750002 12.95 1.77129 12.3749 2.41577L7.24615 8.16375Z' fill='%236168C0'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -3px;
  pointer-events: none;
}

.c-form-textarea {
  display: inline-block;
  width: 100%;
  vertical-align: bottom;
}

.p-form-step {
  font-size: 1.8rem;
  font-weight: 700;
  margin: 0 0 50px;
}

@media screen and (max-width:767px) {
  .p-form-step {
    font-size: 1.6rem;
    margin: 0 0 20px;
  }
}

.p-form-step ul {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  text-align: center;
  margin: -3px 0;
  overflow: hidden;
}

.p-form-step ul li {
  position: relative;
  padding: 0;
  margin: 3px 3px 3px 0;
  width: 100%;
}

.p-form-step ul li div {
  position: relative;
  padding: 0 0.8em 0 1.6em;
  background-color: #f2f3f6;
  border-color: #f2f3f6;
  display: block;
  height: 60px;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media screen and (max-width:767px) {
  .p-form-step ul li div {
    padding: 0 0.2em 0 1em;
    height: 50px;
  }
}

.p-form-step ul li:after,
.p-form-step ul li div:after {
  content: "";
  position: absolute;
  top: 0;
  left: 100%;
  content: "";
  height: 0;
  width: 0;
  border: 30px solid transparent;
  border-right-width: 0;
  border-left-width: 20px;
  z-index: 2;
  border-left-color: inherit;
}

@media screen and (max-width:767px) {

  .p-form-step ul li:after,
  .p-form-step ul li div:after {
    border-width: 25px;
    border-right-width: 0;
    border-left-width: 10px;
  }
}

.p-form-step ul li:after {
  z-index: 1;
  -webkit-transform: translateX(3px);
  transform: translateX(3px);
  border-left-color: #fff;
  margin: 0;
}

.p-form-step ul li:first-of-type div {
  padding-left: 1.6em;
}

@media screen and (max-width:767px) {
  .p-form-step ul li:first-of-type div {
    padding-left: 1em;
  }
}

.p-form-step ul li:last-of-type {
  margin-right: 0;
}

.p-form-step ul li.is-current div {
  color: #fff;
  background-color: #000;
  border-color: #000;
}

.p-form-step ul li.is-finished div {
  color: #fff;
  background-color: #a1a1a1;
  border-color: #a1a1a1;
}

.p-form-table {
  border-top: 1px solid #eee;
  word-break: break-all;
  font-size: 1.6rem;
}

.p-form-table__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  border-bottom: 1px solid #eee;
}

/* @media screen and (max-width:1024px) {
  .p-form-table__item {
    display: block;
  }
} */

.p-form-table__required {
  display: inline-block;
  width: 42px;
  font-size: 1.4rem;
  text-align: center;
  background: #000;
  color: #fff;
  font-weight: 700;
  margin-left: 10px;
  vertical-align: middle;
}

.p-form-table__head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 320px;
  background: #f2f3f6;
  padding: 30px;
  font-size: 1.6rem;
  position: relative;
  font-weight: bold;
}

/* @media screen and (max-width:1024px) {
  .p-form-table__head {
    width: auto;
    padding: 20px 15px;
    font-size: 1.7rem;
  }
} */

.p-form-table__body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: calc(100% - 320px);
  padding: 25px 30px;
}

/* @media screen and (max-width:1024px) {
  .p-form-table__body {
    width: auto;
    padding: 25px 15px;
  }
} */

.p-form-table__body input {
  max-width: 700px;
}

.p-form-table__body textarea {
  max-width: 700px;
  min-height: 170px;
}

.p-form-table__body-inner {
  width: 100%;
}

.p-form-table .is-error .c-form-input,
.p-form-table .is-error .c-form-radio span:before,
.p-form-table .is-error .c-form-checkbox span:before,
.p-form-table .is-error .c-form-select select,
.p-form-table .is-error .c-form-textarea {
  background-color: #ffeeee;
}

.p-form-input-small {
  max-width: 200px !important;
}

@media print,
screen and (min-width:768px) {
  .p-form-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.p-form-name li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media print,
screen and (min-width:768px) {
  .p-form-name li:nth-child(n+2) {
    margin-left: 7%;
  }
}

@media screen and (max-width:767px) {
  .p-form-name li:nth-child(n+2) {
    margin-top: 20px;
  }
}

.p-form-name li span {
  display: inline-block;
  min-width: 45px;
  padding-right: 5px;
}

@media print,
screen and (min-width:768px) {
  .p-form-name li input {
    max-width: 240px;
  }
}

.p-form-postcode {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media screen and (max-width:767px) {
  .p-form-postcode {
    position: relative;
    padding-bottom: 65px;
  }
}

.p-form-postcode__zip1 {
  max-width: 100px !important;
}

.p-form-postcode__zip2 {
  max-width: 120px !important;
}

.p-form-postcode__symbol {
  display: inline-block;
  min-width: 45px;
  padding-right: 5px;
}

@media screen and (max-width:767px) {
  .p-form-postcode__symbol {
    min-width: 30px;
  }
}

.p-form-postcode__bar {
  padding: 0 13px;
  text-align: center;
  min-width: 43px;
}

@media screen and (max-width:767px) {
  .p-form-postcode__bar {
    padding: 0 10px;
    min-width: 35px;
  }
}

.p-form-postcode__btn {
  width: 100%;
  max-width: 140px;
  min-width: 100px;
  height: 50px;
  font-weight: 700;
  font-size: 1.6rem;
  text-align: center;
  color: #fff;
  margin-left: 20px;
  background: #000;
  border-radius: 50px;
}

@media screen and (max-width:767px) {
  .p-form-postcode__btn {
    max-width: 155px;
    height: 45px;
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0;
  }
}

.p-form-address *+* {
  margin-top: 10px;
}

@media screen and (max-width:767px) {
  .p-form-address *+* {
    margin-top: 20px;
  }
}

.p-form-address__pref {
  width: 240px;
}

@media screen and (max-width:767px) {
  .p-form-address__pref {
    width: 210px;
  }
}

.p-form-address__txt {
  font-size: 1.5rem;
}

@media screen and (max-width:767px) {
  .p-form-address__txt {
    font-size: 1.4rem;
  }
}

@media print,
screen and (min-width:768px) {
  .p-form-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media print,
screen and (min-width:768px) {
  .p-form-list li:nth-child(n+2) {
    margin-left: 50px;
  }
}

@media screen and (max-width:767px) {
  .p-form-list li:nth-child(n+2) {
    margin-top: 20px;
  }
}

.p-form-privacy {
  margin-top: 50px;
  border: 1px solid #eee;
  padding: 30px;
  text-align: center;
  font-weight: 700;
}

@media screen and (max-width:767px) {
  .p-form-privacy {
    margin-top: 30px;
    padding: 15px;
  }
}

.p-form-privacy__check {
  font-size: 1.6rem;
}

@media screen and (max-width:767px) {
  .p-form-privacy__check {
    font-size: 1.5rem;
  }
}

@media print,
screen and (min-width:768px) {
  .p-form-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    margin-top: 50px;
  }
}

@media screen and (max-width:767px) {
  .p-form-btn {
    max-width: 300px;
    margin: 30px auto 0;
  }
}

.p-form-btn__item {
  width: 100%;
}

@media print,
screen and (min-width:768px) {
  .p-form-btn__item {
    width: 300px;
  }
}

@media screen and (max-width:767px) {
  .p-form-btn__item {
    margin-left: auto;
    margin-right: auto;
  }
}

@media print,
screen and (min-width:768px) {
  .p-form-btn__item:nth-child(n+2) {
    margin-right: 30px;
  }
}

@media screen and (max-width:767px) {
  .p-form-btn__item:nth-child(n+2) {
    margin-top: 20px;
  }
}

@media screen and (max-width:767px) {
  .p-form-btn__submit {
    max-width: 345px;
    height: 55px;
  }
}

.p-form-thanks {
  text-align: center;
}

@media screen and (max-width:767px) {
  .p-form-thanks {
    text-align: left;
  }
}

.p-form-thanks__lead {
  font-weight: 700;
  font-size: 3rem;
  margin-bottom: 30px;
}

@media screen and (max-width:767px) {
  .p-form-thanks__lead {
    font-size: 2.6rem;
    text-align: center;
    margin-bottom: 20px;
  }
}

.p-form-thanks__notes {
  margin-top: 20px;
}

@media screen and (max-width:767px) {
  .p-form-thanks__notes {
    margin-top: 15px;
  }
}

.p-form-error-txt {
  color: #cc0000;
  margin-top: 10px;
}

.p-form-error-txt+.p-form-error-txt {
  margin-top: 0;
}

.u-clr:after {
  content: "";
  display: block;
  clear: both;
  height: 0;
}

@media screen and (max-width:374px) {
  .u-xs-min {
    display: none !important;
  }
}

@media print,
screen and (min-width:375px) {
  .u-xs-max {
    display: none !important;
  }
}

@media screen and (max-width:767px) {
  .u-sm-min {
    display: none !important;
  }
}

@media print,
screen and (min-width:768px) {
  .u-sm-max {
    display: none !important;
  }
}

/* @media screen and (max-width:1024px) {
  .u-md-min {
    display: none !important;
  }
} */

@media print,
screen and (min-width:1025px) {
  .u-md-max {
    display: none !important;
  }
}

@media screen and (max-width:1239px) {
  .u-lg-min {
    display: none !important;
  }
}

@media print,
screen and (min-width:1240px) {
  .u-lg-max {
    display: none !important;
  }
}

.u-ff-jp {
  font-family: "Noto Sans JP", sans-serif;
}

.u-ff-en {
  font-family: "Jost", sans-serif;
}

.u-fz-20 {
  font-size: 2rem !important;
}

.u-fz-19 {
  font-size: 1.9rem !important;
}

.u-fz-18 {
  font-size: 1.8rem !important;
}

.u-fz-17 {
  font-size: 1.7rem !important;
}

.u-fz-16 {
  font-size: 1.6rem !important;
}

.u-fz-15 {
  font-size: 1.5rem !important;
}

.u-fz-14 {
  font-size: 1.4rem !important;
}

.u-fz-13 {
  font-size: 1.3rem !important;
}

.u-fz-12 {
  font-size: 1.2rem !important;
}

.u-fz-11 {
  font-size: 1.1rem !important;
}

.u-fz-10 {
  font-size: 1rem !important;
}

.u-fw-400 {
  font-weight: 400 !important;
}

.u-fw-700 {
  font-weight: 700 !important;
}

.u-td-ul {
  text-decoration: underline !important;
}

.u-td-none {
  text-decoration: none !important;
}

.u-ta-l {
  text-align: left !important;
}

.u-ta-r {
  text-align: right !important;
}

.u-ta-c {
  text-align: center !important;
}

.u-va-t {
  vertical-align: top !important;
}

.u-va-m {
  vertical-align: middle !important;
}

.u-va-b {
  vertical-align: bottom !important;
}

.u-c-main {
  color: #000 !important;
}

.u-c-plain {
  color: #333 !important;
}

.u-c-white {
  color: #fff !important;
}

.u-bg-alpha {
  background-color: transparent !important;
}

.u-bg-main {
  background-color: #000 !important;
}

.u-bg-plain {
  background-color: #333 !important;
}

.u-bg-focus {
  background-color: #aaa !important;
}

.u-bg-border {
  background-color: #eee !important;
}

.u-bg-white {
  background-color: #fff !important;
}

.u-bg-gray01 {
  background-color: #eee !important;
}

.u-bg-gray02 {
  background-color: #ccc !important;
}

.u-bd {
  border: 1px solid #eee !important;
}

.u-bd-t {
  border-top: 1px solid #eee !important;
}

.u-bd-l {
  border-left: 1px solid #eee !important;
}

.u-bd-b {
  border-bottom: 1px solid #eee !important;
}

.u-bd-r {
  border-right: 1px solid #eee !important;
}

.u-bd-main {
  border-color: #000 !important;
}

.u-bd-white {
  border-color: #fff !important;
}

.u-w-100 {
  width: 100% !important;
}

.u-w-90 {
  width: 90% !important;
}

.u-w-80 {
  width: 80% !important;
}

.u-w-70 {
  width: 70% !important;
}

.u-w-60 {
  width: 60% !important;
}

.u-w-50 {
  width: 50% !important;
}

.u-w-40 {
  width: 40% !important;
}

.u-w-30 {
  width: 30% !important;
}

.u-w-20 {
  width: 20% !important;
}

.u-w-10 {
  width: 10% !important;
}

.u-m-0 {
  margin: 0 !important;
}

.u-m-auto {
  margin: auto !important;
}

.u-mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.u-my-auto {
  margin-top: auto !important;
  margin-bottom: auto !important;
}

.u-mt-0 {
  margin-top: 0 !important;
}

.u-mt-5 {
  margin-top: 5px !important;
}

.u-mt-10 {
  margin-top: 10px !important;
}

.u-mt-15 {
  margin-top: 15px !important;
}

.u-mt-20 {
  margin-top: 20px !important;
}

.u-mt-25 {
  margin-top: 25px !important;
}

.u-mt-30 {
  margin-top: 30px !important;
}

.u-mt-35 {
  margin-top: 35px !important;
}

.u-mt-40 {
  margin-top: 40px !important;
}

.u-mt-45 {
  margin-top: 45px !important;
}

.u-mt-50 {
  margin-top: 50px !important;
}

.u-mt-xs {
  margin-top: 20px !important;
}

@media screen and (max-width:767px) {
  .u-mt-xs {
    margin-top: 10px !important;
  }
}

.u-mt-sm {
  margin-top: 40px !important;
}

@media screen and (max-width:767px) {
  .u-mt-sm {
    margin-top: 20px !important;
  }
}

.u-mt-md {
  margin-top: 60px !important;
}

@media screen and (max-width:767px) {
  .u-mt-md {
    margin-top: 30px !important;
  }
}

.u-mt-lg {
  margin-top: 80px !important;
}

@media screen and (max-width:767px) {
  .u-mt-lg {
    margin-top: 40px !important;
  }
}

.u-mt-xl {
  margin-top: 100px !important;
}

@media screen and (max-width:767px) {
  .u-mt-xl {
    margin-top: 50px !important;
  }
}

.u-mb-0 {
  margin-bottom: 0 !important;
}

.u-mb-5 {
  margin-bottom: 5px !important;
}

.u-mb-10 {
  margin-bottom: 10px !important;
}

.u-mb-15 {
  margin-bottom: 15px !important;
}

.u-mb-20 {
  margin-bottom: 20px !important;
}

.u-mb-25 {
  margin-bottom: 25px !important;
}

.u-mb-30 {
  margin-bottom: 30px !important;
}

.u-mb-35 {
  margin-bottom: 35px !important;
}

.u-mb-40 {
  margin-bottom: 40px !important;
}

.u-mb-45 {
  margin-bottom: 45px !important;
}

.u-mb-50 {
  margin-bottom: 50px !important;
}

.u-mb-xs {
  margin-bottom: 20px !important;
}

@media screen and (max-width:767px) {
  .u-mb-xs {
    margin-bottom: 10px !important;
  }
}

.u-mb-sm {
  margin-bottom: 40px !important;
}

@media screen and (max-width:767px) {
  .u-mb-sm {
    margin-bottom: 20px !important;
  }
}

.u-mb-md {
  margin-bottom: 60px !important;
}

@media screen and (max-width:767px) {
  .u-mb-md {
    margin-bottom: 30px !important;
  }
}

.u-mb-lg {
  margin-bottom: 80px !important;
}

@media screen and (max-width:767px) {
  .u-mb-lg {
    margin-bottom: 40px !important;
  }
}

.u-mb-xl {
  margin-bottom: 100px !important;
}

@media screen and (max-width:767px) {
  .u-mb-xl {
    margin-bottom: 50px !important;
  }
}

.u-p-0 {
  padding: 0 !important;
}

.u-p-5 {
  padding: 5px !important;
}

.u-p-10 {
  padding: 10px !important;
}

.u-p-15 {
  padding: 15px !important;
}

.u-p-20 {
  padding: 20px !important;
}

.u-p-25 {
  padding: 25px !important;
}

.u-p-30 {
  padding: 30px !important;
}

.u-p-35 {
  padding: 35px !important;
}

.u-p-40 {
  padding: 40px !important;
}

.u-p-45 {
  padding: 45px !important;
}

.u-p-50 {
  padding: 50px !important;
}

.u-pt-0 {
  padding-top: 0 !important;
}

.u-pt-5 {
  padding-top: 5px !important;
}

.u-pt-10 {
  padding-top: 10px !important;
}

.u-pt-15 {
  padding-top: 15px !important;
}

.u-pt-20 {
  padding-top: 20px !important;
}

.u-pt-25 {
  padding-top: 25px !important;
}

.u-pt-30 {
  padding-top: 30px !important;
}

.u-pt-35 {
  padding-top: 35px !important;
}

.u-pt-40 {
  padding-top: 40px !important;
}

.u-pt-45 {
  padding-top: 45px !important;
}

.u-pt-50 {
  padding-top: 50px !important;
}

.u-pt-xs {
  padding-top: 20px !important;
}

@media screen and (max-width:767px) {
  .u-pt-xs {
    padding-top: 10px !important;
  }
}

.u-pt-sm {
  padding-top: 40px !important;
}

@media screen and (max-width:767px) {
  .u-pt-sm {
    padding-top: 20px !important;
  }
}

.u-pt-md {
  padding-top: 60px !important;
}

@media screen and (max-width:767px) {
  .u-pt-md {
    padding-top: 30px !important;
  }
}

.u-pt-lg {
  padding-top: 80px !important;
}

@media screen and (max-width:767px) {
  .u-pt-lg {
    padding-top: 40px !important;
  }
}

.u-pt-xl {
  padding-top: 100px !important;
}

@media screen and (max-width:767px) {
  .u-pt-xl {
    padding-top: 50px !important;
  }
}

.u-pb-0 {
  padding-bottom: 0 !important;
}

.u-pb-5 {
  padding-bottom: 5px !important;
}

.u-pb-10 {
  padding-bottom: 10px !important;
}

.u-pb-15 {
  padding-bottom: 15px !important;
}

.u-pb-20 {
  padding-bottom: 20px !important;
}

.u-pb-25 {
  padding-bottom: 25px !important;
}

.u-pb-30 {
  padding-bottom: 30px !important;
}

.u-pb-35 {
  padding-bottom: 35px !important;
}

.u-pb-40 {
  padding-bottom: 40px !important;
}

.u-pb-45 {
  padding-bottom: 45px !important;
}

.u-pb-50 {
  padding-bottom: 50px !important;
}

.u-pb-xs {
  padding-bottom: 20px !important;
}

@media screen and (max-width:767px) {
  .u-pb-xs {
    padding-bottom: 10px !important;
  }
}

.u-pb-sm {
  padding-bottom: 40px !important;
}

@media screen and (max-width:767px) {
  .u-pb-sm {
    padding-bottom: 20px !important;
  }
}

.u-pb-md {
  padding-bottom: 60px !important;
}

@media screen and (max-width:767px) {
  .u-pb-md {
    padding-bottom: 30px !important;
  }
}

.u-pb-lg {
  padding-bottom: 80px !important;
}

@media screen and (max-width:767px) {
  .u-pb-lg {
    padding-bottom: 40px !important;
  }
}

.u-pb-xl {
  padding-bottom: 100px !important;
}

@media screen and (max-width:767px) {
  .u-pb-xl {
    padding-bottom: 50px !important;
  }
}

.l-inner {
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  max-width: 1240px;
}

@media print,
screen and (min-width:768px) {
  .l-container {
    padding: 100px 0;
  }
}

@media screen and (max-width:767px) {
  .l-container {
    padding: 50px 0;
  }
}

@media print,
screen and (min-width:768px) {
  .l-container:last-child {
    padding-bottom: 150px;
  }
}

@media screen and (max-width:767px) {
  .l-container:last-child {
    padding-bottom: 80px;
  }
}

.l-container.l-container--gray {
  background: #eee;
}

.l-page {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100vh;
  margin: 0 auto;
}

.l-page__heading {
  position: absolute;
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  border: 0;
}

.l-header {
  background: #fff;
  -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.05);
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9000;
}

.l-header__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@media screen and (max-width:767px) {
  .l-header__inner {
    height: 60px;
    background: #fff;
    z-index: 8500;
    position: relative;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header__bg {
    display: none;
  }
}

@media screen and (max-width:767px) {
  .l-header__bg {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 8000;
    background: rgba(0, 0, 0, 0.7);
    visibility: hidden;
  }

  .l-header__bg.is-open {
    visibility: visible;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-logo {
    width: 100px;
  }
}

@media screen and (max-width:767px) {
  .l-header-logo {
    width: 70px;
  }
}

.l-header-logo__link {
  display: block;
}

@media print,
screen and (min-width:768px) {
  .l-header-menu {
    display: none;
  }
}

@media screen and (max-width:767px) {
  .l-header-menu {
    color: transparent;
    overflow: hidden;
    cursor: pointer;
    display: block;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    z-index: 9001;
    background: #000;
    outline: none;
  }

  .l-header-menu span {
    display: block;
    background: #fff;
    width: 24px;
    height: 2px;
    position: absolute;
    left: 50%;
    margin: -1px 0 0 -12px;
    top: 50%;
    -webkit-transition: background-color 100ms;
    transition: background-color 100ms;
  }

  .l-header-menu span:before,
  .l-header-menu span:after {
    content: "";
    display: block;
    background: #fff;
    width: 24px;
    height: 2px;
    position: absolute;
    left: 0;
    -webkit-transition: top 200ms, -webkit-transform 200ms;
    transition: top 200ms, -webkit-transform 200ms;
    transition: transform 200ms, top 200ms;
    transition: transform 200ms, top 200ms, -webkit-transform 200ms;
  }

  .l-header-menu span:before {
    top: -8px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  .l-header-menu span:after {
    top: 8px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  .l-header-menu.is-open span {
    background: #000;
  }

  .l-header-menu.is-open span:before,
  .l-header-menu.is-open span:after {
    top: 0;
  }

  .l-header-menu.is-open span:before {
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
  }

  .l-header-menu.is-open span:after {
    -webkit-transform: rotate(-225deg);
    transform: rotate(-225deg);
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-nav {
    display: block;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav {
    visibility: hidden;
    position: fixed;
    width: 100%;
    max-width: 320px;
    min-width: 320px;
    height: calc(100% - 60px);
    background: #fff;
    top: 60px;
    right: 0;
    z-index: 9000;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}

@media screen and (max-width:767px) {
  .l-header-nav__inner {
    position: relative;
    height: 100%;
    overflow: auto;
    padding: 0 0 60px;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-nav__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav__items {
    border-top: 1px solid #eee;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav__item {
    border-bottom: 1px solid #eee;
  }
}

.l-header-nav__link {
  cursor: pointer;
  position: relative;
  font-weight: 700;
}

@media print,
screen and (min-width:768px) {
  .l-header-nav__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 60px;
    font-size: 1.6rem;
    padding: 0 13px;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav__link {
    display: block;
    padding: 20px 15px;
  }
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .l-header-nav__link:hover {
    background: #000;
    color: #fff;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav.is-open {
    visibility: visible;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.l-header-nav-drop {
  text-align: left;
}

@media print,
screen and (min-width:768px) {
  .l-header-nav-drop {
    width: 100%;
    position: fixed;
    left: 0;
    color: #fff;
    padding: 10px 0;
    display: none;
    background: rgba(0, 0, 0, 0.85);
  }
}

@media screen and (max-width:767px) {
  .l-header-nav-drop {
    padding: 0 0 20px 30px;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-nav-drop__inner {
    position: relative;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav-drop__inner {
    padding: 0;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-nav-drop__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-left: 1px solid #eee;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-nav-drop__item {
    width: 100%;
    border-right: 1px solid #eee;
  }
}

@media screen and (max-width:767px) {
  .l-header-nav-drop__item:nth-child(n+2) {
    margin-top: 15px;
  }
}

@media print,
screen and (min-width:768px) {
  .l-header-nav-drop__link {
    display: block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 40px;
  }
}

@media print,
screen and (min-width:768px) {
  .is-drop-nav-active .l-header-nav-drop {
    display: block;
  }

  .is-view-tab .is-drop-nav-active .l-header-nav-drop {
    display: none;
  }
}

.sub .l-header-nav__item--sub .l-header-nav__link,
.news .l-header-nav__item--news .l-header-nav__link,
.contact .l-header-nav__item--contact .l-header-nav__link {
  background: #000;
  color: #fff;
}

.l-footer {
  color: #000;
  line-height: 1;
  position: relative;
  text-align: center;
  background: #000;
  padding: 20px;
  margin-top: auto;
  padding-top: 48px;
  color: #fff;
}

@media screen and (max-width:767px) {
  .l-footer {
    padding-top: 38px;
  }
}

@media screen and (max-width:767px) {
  .l-footer h3 {
    width: 19vw;
    margin: 0 auto;
  }
}

.l-footer a {
  opacity: 1;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .l-footer a:hover {
    opacity: 0.6;
  }
}

.share {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 20px;
  margin-bottom: 44px;
}

@media screen and (max-width:767px) {
  .share {
    margin-top: 25px;
    margin-bottom: 62px;
  }
}

.share li {
  margin: 2px 18px;
}

@media screen and (max-width:767px) {
  .share li {
    margin: 2px 15px;
  }
}

.share li a {
  max-width: 37px;
  display: block;
}

.share li a.icon-fb {
  max-width: 34px;
  position: relative;
  top: -3px;
}

@media screen and (max-width:767px) {
  .share li a.icon-fb {
    top: 0;
  }
}

.share li a.icon-tw {
  max-width: 27px;
}

.logo-footer {
  text-align: center;
}

.logo-footer img {
  max-width: 300px;
}

@media screen and (max-width:767px) {
  .logo-footer img {
    max-width: 67vw;
  }
}

.menu-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 38px;
}

@media screen and (max-width:767px) {
  .menu-footer {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 13px;
  }
}

@media screen and (max-width:767px) {
  .menu-footer li {
    margin-bottom: 17px;
  }
}

.menu-footer li:first-child::before {
  display: none;
}

@media screen and (max-width:767px) {
  .menu-footer li:last-child::before {
    display: none;
  }
}

.menu-footer li:before {
  margin: 0 19px;
  content: "|";
  font-size: 10px;
  font-weight: bold;
  position: relative;
  top: -1px;
}

.menu-footer a {
  color: #fff;
}

.copyright {
  margin-top: 27px;
  font-size: 15px;
  color: gray;
  font-weight: 600;
  padding-bottom: 32px;
}

@media screen and (max-width:767px) {
  .copyright {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 32px;
  }
}

.l-main {
  display: block;
  font-size: 1.4rem;
  line-height: 1.5;
  position: relative;
}

.l-main:after,
.l-main:before {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  content: "";
}

@media screen and (min-width: 2000px) {

  .l-main:after,
  .l-main:before {
    background-size: 100%;
  }
}

.l-main:before {
  background-image: url(../images/bg-left.jpg);
  background-position: left top;
  background-size: 100%;
}

@media screen and (max-width:767px) {
  .l-main:before {
    background-size: 440px;
  }
}

.l-main:after {
  left: 50%;
  background-image: url(../images/bg-right.jpg);
  background-position: left top;
}

@media screen and (max-width:767px) {
  .l-main:after {
    background-size: 100% auto;
    background-size: 300px;
  }
}

.l-main>* {
  position: relative;
  z-index: 6;
}

.question-page.question-page-a .l-main {
  display: block;
  font-size: 1.4rem;
  line-height: 1.5;
  position: relative;
  background-image: url(../images/bg_a.jpg);
  background-repeat: repeat;
  background-position: top left;
  background-size: cover;
  padding-bottom: 20px;
  min-height: 100vh;
}

@media screen and (max-width:767px) {
  .question-page.question-page-a .l-main {
    padding-bottom: 64px;
    background-size: contain;
    background-image: url(../images/bg_a_sp.jpg);
  }
}

.question-page.question-page-a .l-main:before,
.question-page.question-page-a .l-main:after {
  display: none;
}

.question-page.question-page-b .l-main:before,
.question-page.question-page-b .l-main:after {
  display: none;
}

.question-page.question-page-b .l-main {
  display: block;
  font-size: 1.4rem;
  line-height: 1.5;
  position: relative;
  background-image: url(../images/bg_b.jpg);
  background-repeat: repeat;
  background-position: top left;
  padding-bottom: 20px;
  min-height: 100vh;
  background-size: inherit;
}

@media screen and (max-width:767px) {
  .question-page.question-page-b .l-main {
    padding-bottom: 64px;
  }
}

.question-page.question-page-b .l-main .comment-form {
  background-color: #ffbfeb;
}

.l-main-a {
  display: block;
  font-size: 1.4rem;
  line-height: 1.5;
  position: relative;
  background-image: url(../images/bg_a.jpg);
  background-repeat: repeat;
  background-position: top;
  background-position: top left;
  padding-bottom: 20px;
  min-height: 100vh;
}

@media screen and (max-width:767px) {
  .l-main-a {
    padding-bottom: 64px;
    background-size: contain;
    background-image: url(../images/bg_a_sp.jpg);
  }
}

.l-main-b {
  display: block;
  font-size: 1.4rem;
  line-height: 1.5;
  position: relative;
  background-image: url(../images/bg_b.jpg);
  background-repeat: repeat;
  background-position: top left;
  padding-bottom: 20px;
  min-height: 100vh;
}

@media screen and (max-width:767px) {
  .l-main-b {
    padding-bottom: 64px;
  }
}

.l-main-b .comment-form {
  background-color: #ffbfeb;
}

/* width */
::-webkit-scrollbar {
  width: 0px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.u-ff-en {
  font-family: "Jost", sans-serif;
}

img {
  max-width: 100%;
  width: auto;
}

.mv-top {
  padding-top: 185px;
  padding-bottom: 190px;
  color: #171c61;
  text-align: center;
}

/* @media screen and (max-width:1024px) {
  .mv-top {
    padding-top: 25vw;
    padding-bottom: 34vw;
  }
} */

.mv-top h1 {
  max-width: 540px;
  margin: 0 auto;
  padding-bottom: 126px;
  position: relative;
}

/* @media screen and (max-width:1024px) {
  .mv-top h1 {
    width: 72vw;
    padding-bottom: 14.6vw;
  }
} */

.mv-top p {
  font-size: 24px;
  letter-spacing: 0.04em;
  line-height: 2.0833333333;
  font-weight: bold;
}

/* @media screen and (max-width:1024px) {
  .mv-top p {
    font-size: 4.8vw;
    line-height: 1.8055555556;
  }
} */

.sect-topic {
  padding-bottom: 5.5vw;
  position: relative;
}

@media screen and (max-width:1239px) {
  .sect-topic {
    padding-bottom: 23vw;
  }
}

/* @media screen and (max-width:1024px) {
  .sect-topic {
    padding-bottom: 32vw;
  }
} */

@media screen and (max-width:767px) {
  .sect-topic {
    padding-bottom: 26.6666666667vw;
  }
}

.sect-topic:after {
  position: absolute;
  top: -6.9vw;
  left: 0;
  right: 0;
  content: "";
  background-image: url(../images/bg_01.png);
  background-position: top center;
  background-repeat: no-repeat;
  bottom: 0;
}

@media screen and (min-width: 1921px) {
  .sect-topic:after {
    background-size: cover;
  }
}

@media screen and (min-width: 1400px) {
  .sect-topic:after {
    top: -5.1vw;
  }
}

/* @media screen and (max-width:1024px) {
  .sect-topic:after {
    background-image: url(../images/bg_01_sp.png);
    background-position: top;
    background-size: cover;
    top: -12.9vw;
  }
} */

.topic {
  position: relative;
  z-index: 3;
}

.topic__ttl {
  max-width: 205px;
  margin: 0 auto;
  padding-bottom: 32px;
  position: relative;
  top: 8px;
}

/* @media screen and (max-width:1024px) {
  .topic__ttl {
    top: -6vw;
  }
} */

@media screen and (max-width:767px) {
  .topic__ttl {
    width: 22.7vw;
    max-width: inherit;
    left: -3.6vw;
    padding-bottom: 0;
  }
}

/* @media screen and (max-width:1024px) {
  .topic__ttl--02 {
    width: 15vw;
    left: 0.3vw;
    text-align: center;
  }
} */

.topic-subttl {
  margin: 0 auto;
  width: 601px;
  position: relative;
  margin-top: -43px;
  left: -11px;
  margin-bottom: 300px;
}

/* @media screen and (max-width:1024px) {
  .topic-subttl {
    width: 79vw;
    left: 4vw;
    margin-top: -30px;
    text-align: center;
    top: -9vw;
    margin-bottom: 7vw;
  }
} */

@media screen and (max-width:767px) {
  .topic-subttl {
    top: -5vw;
  }
}

.topic .date {
  text-align: center;
  color: #fff;
}

.topic .date p {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.2em;
}

/* @media screen and (max-width:1024px) {
  .topic .date p {
    font-size: 3.2vw;
    margin-top: -5px;
  }
} */

.topic .date-week {
  margin-top: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #fff;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 33px;
}

/* @media screen and (max-width:1024px) {
  .topic .date-week {
    font-size: 3.4666666667vw;
    margin-top: 9px;
    margin-bottom: 35px;
  }
} */

.topic .date-week .midle {
  font-size: 33px;
  margin: 0 14px;
}

/* @media screen and (max-width:1024px) {
  .topic .date-week .midle {
    font-size: 5.8666666667vw;
    margin: 0 8px;
  }
} */

.topic .date-week .item {
  border-radius: 40px;
  border: 1px solid #fff;
  padding: 2px 18px;
  letter-spacing: 0.04em;
}

/* @media screen and (max-width:1024px) {
  .topic .date-week .item {
    padding: 2px 3px;
    width: 43vw;
    text-align: center;
  }
} */

.topic .date-week .item span {
  font-size: 28px;
}

/* @media screen and (max-width:1024px) {
  .topic .date-week .item span {
    font-size: 5.8666666667vw;
  }
} */

.topic .date-week .item span.time {
  font-size: 20px;
  opacity: 0.6;
}

@media screen and (max-width:767px) {
  .topic .date-week .item span.time {
    font-size: 3.4666666667vw;
  }
}

.topic .date-week .item span.time small {
  font-size: 12px;
}

@media screen and (max-width:767px) {
  .topic .date-week .item span.time small {
    font-size: 2.6666666667vw;
  }
}

.topic-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 21px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-right: 86px;
  padding-left: 86px;
  padding-bottom: 40px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media screen and (max-width:1239px) {
  .topic-list {
    padding-left: 0;
    padding-right: 0;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }
}

/* @media screen and (max-width:1024px) {
  .topic-list {
    display: block;
    padding-left: 0;
    padding-right: 0;
    padding-top: 5vw;
  }
} */

.topic .card {
  background: none;
  width: 457px;
}

/* @media screen and (max-width:1024px) {
  .topic .card {
    width: 74.5vw;
    height: 74.5vw;
    margin-left: auto;
    right: 26px;
  }
} */

.topic .card-img {
  position: absolute;
  top: -58px;
  left: -18px;
  right: -74px;
  bottom: 7px;
}

/* @media screen and (max-width:1024px) {
  .topic .card-img {
    top: -9vw;
    left: -9vw;
    right: -9vw;
    bottom: 0px;
  }

  .topic .card-img img {
    width: 100%;
  }
} */

@media screen and (max-width:767px) {
  .topic .card-img {
    left: -50px;
    right: -50px;
    bottom: 7px;
    top: -58px;
  }
}

.topic .card .card-info {
  padding-left: 65px;
  padding-top: 22px;
  letter-spacing: 0.04em;
  width: 100%;
}

/* @media screen and (max-width:1024px) {
  .topic .card .card-info {
    padding-left: 35px;
    padding-top: 0;
    padding-bottom: 20px;
    padding-right: 35px;
  }
} */

.topic .card.topic-card-02,
.topic .card+.topic-card {
  position: relative;
  top: -24px;
  left: -26px;
  width: 435px;
  background: none;
}

/* @media screen and (max-width:1024px) {

  .topic .card.topic-card-02,
  .topic .card+.topic-card {
    position: relative;
    top: 0;
    left: 0;
    margin-top: 15vw;
    margin-right: auto;
    right: 0;
    left: 2vw;
    width: 74vw;
    height: 74vw;
  }
} */

.topic .card.topic-card-02 .card-number,
.topic .card+.topic-card .card-number {
  left: unset;
  right: -28px;
  top: 5px;
}

/* @media screen and (max-width:1024px) {

  .topic .card.topic-card-02 .card-number,
  .topic .card+.topic-card .card-number {
    left: -43px;
    right: auto;
    top: 26px;
  }
} */

@media print,
screen and (min-width:1025px) {

  .topic .card.topic-card-02 .card-info,
  .topic .card+.topic-card .card-info {
    padding-left: 0;
    padding-bottom: 17px;
    padding-top: 0;
    padding-right: 14px;
  }
}

.topic .card.topic-card-02 .card-img,
.topic .card+.topic-card .card-img {
  left: -66px;
  right: -52px;
}

/* 
@media screen and (max-width:1024px) {

  .topic .card.topic-card-02 .card-img,
  .topic .card+.topic-card .card-img {
    left: -50px;
    right: -50px;
  }
} */

.topic-btn {
  margin-top: 21px;
  text-align: center;
  margin-bottom: 190px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* @media screen and (max-width:1024px) {
  .topic-btn {
    margin-top: 4.5vw;
    margin-bottom: 8vw;
  }
} */

.topic-btn h3 {
  max-width: 296px;
  margin: 0 auto;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  margin-bottom: 12px;
}

/* @media screen and (max-width:1024px) {
  .topic-btn h3 {
    max-width: 65vw;
    margin-bottom: 2.4vw;
  }
} */

.topic-btn-02 {
  margin-top: 21px;
  text-align: center;
  margin-bottom: 190px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media screen and (max-width:767px) {
  .topic-btn-02 {
    margin-top: 4.5vw;
    margin-bottom: 8vw;
    height: auto !important;
    margin-left: auto;
    margin-right: auto;
  }
}

.topic-btn-02 h3 {
  max-width: 296px;
  margin: 0 auto;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  margin-bottom: 12px;
}

/* @media screen and (max-width:1024px) {
  .topic-btn-02 h3 {
    max-width: 65vw;
    margin-bottom: 2.4vw;
  }
} */

.topic-btnend {
  text-align: center;
  margin-bottom: 180px;
  margin-top: 71px;
  margin-right: 90px;
}

/* @media screen and (max-width:1024px) {
  .topic-btnend {
    margin-bottom: 5vw;
    width: 27vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10vw;
  }
} */

@media print,
screen and (min-width:768px) {
  .is-view-pc .topic-btnend a:hover {
    opacity: 0.8;
  }
}

.card {
  position: relative;
  color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 420px;
  height: 420px;
  background-repeat: no-repeat;
  background-size: contain;
  text-align: center;
  background-image: url(../images/bg_ques01.png);
}

.card-icon {
  position: absolute;
  top: -12px;
  left: 14px;
  width: 136px;
}

/* @media screen and (max-width:1024px) {
  .card-icon {
    width: 24vw;
    left: 3px;
    top: 4px;
  }

  .card-icon img {
    width: 100%;
  }
} */

.card-number {
  background-color: #171c61;
  border: 1px solid #fff;
  border-radius: 50%;
  width: 118px;
  height: 118px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  top: 10px;
  left: 0px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* @media screen and (max-width:1024px) {
  .card-number {
    width: 19.4666666667vw;
    height: 19.4666666667vw;
    top: -25px;
    left: inherit;
    right: -9px;
    padding: 15px;
  }
} */

.card-number-02 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  width: 100%;
  padding-top: 25px;
  -ms-flex-item-align: start;
  align-self: flex-start;
  margin-bottom: 5px;
}

/* @media screen and (max-width:1024px) {
  .card-number-02 {
    padding-top: 0vw;
  }
}

@media screen and (max-width:1024px) {
  .card-number-02 img {
    width: 6vw;
  }
} */

.card-date {
  font-family: "Jost", sans-serif;
  color: #6168c0;
  font-size: 18px;
  font-weight: 500;
  margin-top: 14px;
}

/* @media screen and (max-width:1024px) {
  .card-date {
    font-size: 3.2vw;
    margin-top: 5px;
  }
} */

.card-date small {
  font-size: 12px;
}

/* @media screen and (max-width:1024px) {
  .card-date small {
    font-size: 2.6666666667vw;
  }
} */

.card-info {
  position: relative;
  z-index: 3;
  width: 100%;
  padding-bottom: 40px;
}

.card-q {
  font-weight: 800;
  line-height: 1.2666666667;
  margin-bottom: 26px;
  color: #171c61;
  position: relative;
}

@media screen and (max-width:767px) {
  .card {
    margin-bottom: 3vw;
  }
}

.card p {
  font-size: 26px;
  font-weight: 800;
}

/* @media screen and (max-width:1024px) {
  .card p {
    font-size: 4vw;
    letter-spacing: -0.03em;
  }
} */

@media screen and (max-width:767px) {
  .card p {
    font-size: 4.5333333333vw;
  }
}

.card-a {
  font-size: 34px;
  font-weight: 900;
  letter-spacing: 0.04em;
}

/* @media screen and (max-width:1024px) {
  .card-a {
    font-size: 6.1333333333vw;
  }
} */

.card-a .txt-or {
  font-size: 26px;
  line-height: 1;
  display: block;
  font-weight: 700;
  letter-spacing: 0.04em;
  position: relative;
}

/* @media screen and (max-width:1024px) {
  .card-a .txt-or {
    font-size: 4.8vw;
  }
} */

.card-a p span {
  background-image: url(../images/bg_yellow.png);
  background-repeat: repeat-x;
  background-position: bottom;
  font-size: 30px;
  font-weight: 900;
}

/* @media screen and (max-width:1024px) {
  .card-a p span {
    font-size: 4vw;
  }
} */

@media screen and (max-width:767px) {
  .card-a p span {
    font-size: 5.0666666667vw;
    line-height: 1;
  }
}

/* @media screen and (max-width:1024px) {
  .card-a p span {
    background-size: 5px 12px;
  }
} */

.card-a .card-a--02 span {
  background-image: url(../images/bg_pink.png);
}

@media print,
screen and (min-width:1025px) {
  .card-a .card-a--02 span {
    padding-bottom: 6px;
    background-position: 0 98%;
  }
}

.card-medium,
.card-small {
  width: 363px;
  height: 363px;
}

/* @media screen and (max-width:1024px) {

  .card-medium,
  .card-small {
    width: 60vw;
    height: 60vw;
  }
} */

.card-medium .card-q,
.card-small .card-q {
  line-height: 1.4285714286;
  margin-bottom: 5px;
}

.card-medium .card-q p,
.card-small .card-q p {
  font-size: 23px;
}

/* @media screen and (max-width:1024px) {

  .card-medium .card-q p,
  .card-small .card-q p {
    font-size: 4.2666666667vw;
  }
} */

.card-medium .card-a,
.card-small .card-a {
  font-size: 31px;
}

.card-medium .card-a p,
.card-small .card-a p {
  font-size: 31px;
}

/* @media screen and (max-width:1024px) {

  .card-medium .card-a p,
  .card-small .card-a p {
    font-size: 4.8vw;
  }
}

@media screen and (max-width:1024px) {

  .card-medium .card-a,
  .card-small .card-a {
    font-size: 4.8vw;
  }
} */

.card-medium .card-a .txt-or,
.card-small .card-a .txt-or {
  font-size: 26px;
  top: 3px;
}

/* @media screen and (max-width:1024px) {

  .card-medium .card-a .txt-or,
  .card-small .card-a .txt-or {
    font-size: 4.1333333333vw;
    left: -2px;
    top: 1px;
  }
} */

.card-medium .card-a p span,
.card-small .card-a p span {
  padding-bottom: 4px;
}

/* @media screen and (max-width:1024px) {

  .card-medium .card-a p span,
  .card-small .card-a p span {
    padding-bottom: 0;
  }
} */

.card-medium .card-info,
.card-small .card-info {
  padding-bottom: 26px;
}

/* @media screen and (max-width:1024px) {

  .card-medium .card-info,
  .card-small .card-info {
    padding-bottom: 0vw;
  }
} */

.card-medium .card-number,
.card-small .card-number {
  top: -41px;
  width: 109px;
  height: 109px;
  left: 0;
}

/* @media screen and (max-width:1024px) {

  .card-medium .card-number,
  .card-small .card-number {
    width: 19.7333333333vw;
    height: 19.7333333333vw;
    left: -1vw;
    top: -8vw;
  }
} */

.card-medium.card-medium-02,
.card-small.card-medium-02 {
  margin-top: 73px;
}

/* @media screen and (max-width:1024px) {

  .card-medium.card-medium-02,
  .card-small.card-medium-02 {
    margin-top: 1vw;
    margin-left: auto;
    margin-right: 7vw;
    width: 61.333333vw;
    height: 61.333333vw;
  }
} */

.card-medium.card-medium-02 .card-number,
.card-small.card-medium-02 .card-number {
  left: inherit;
  right: -2px;
  top: -9px;
}

/* @media screen and (max-width:1024px) {

  .card-medium.card-medium-02 .card-number,
  .card-small.card-medium-02 .card-number {
    right: 6px;
    top: -18px;
  }
}

@media screen and (max-width:1024px) {

  .card-medium.card-medium-02 .link-next,
  .card-small.card-medium-02 .link-next {
    right: 43px;
    bottom: 8px;
  }
} */

.card-medium:nth-child(2n) {
  margin-top: 73px;
}

/* @media screen and (max-width:1024px) {
  .card-medium:nth-child(2n) {
    margin-top: 1vw;
    margin-left: auto;
    margin-right: 7vw;
    width: 61.333333vw;
    height: 61.333333vw;
  }
} */

.card-medium:nth-child(2n) .card-number {
  left: inherit;
  right: -5px;
  top: -33px;
}

/* @media screen and (max-width:1024px) {
  .card-medium:nth-child(2n) .card-number {
    right: -1vw;
    top: -6vw;
  }
}

@media screen and (max-width:1024px) {
  .card-medium:nth-child(2n) .link-next {
    right: 43px;
    bottom: 8px;
  }
} */

.card.card-small {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.card.card-small .card-q {
  margin-bottom: 4px;
}

.card.card-small .link-next {
  bottom: 14px;
}

@media screen and (max-width:767px) {
  .card.card-small .link-next {
    bottom: 6vw;
    right: 4vw;
  }
}

.card.card-small .card:nth-child(2) .link-next {
  bottom: 24px;
  right: 47px;
}

.card:nth-child(2n) {
  background-image: url(../images/bg_ques02.png);
}

.card:nth-child(2n) .link-next {
  bottom: 11px;
  right: 41px;
}

/* @media screen and (max-width:1024px) {
  .card:nth-child(2n) .link-next {
    bottom: 1vw;
    right: 9vw;
  }
} */

.card .link-next {
  width: 58px;
  height: 58px;
  background-size: contain;
  position: absolute;
  bottom: 18px;
  right: 49px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='58px' height='58px'%3E%3Cdefs%3E%3Cfilter id='Filter_0'%3E%3CfeFlood flood-color='rgb(255, 255, 255)' flood-opacity='1' result='floodOut' /%3E%3CfeComposite operator='atop' in='floodOut' in2='SourceGraphic' result='compOut' /%3E%3CfeBlend mode='normal' in='compOut' in2='SourceGraphic' /%3E%3C/filter%3E%3C/defs%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M29.000,0.000 C45.016,0.000 57.1000,12.984 57.1000,29.000 C57.1000,45.016 45.016,58.000 29.000,58.000 C12.984,58.000 -0.000,45.016 -0.000,29.000 C-0.000,12.984 12.984,0.000 29.000,0.000 Z'/%3E%3Cg filter='url(%23Filter_0)'%3E%3Cpath fill-rule='evenodd' fill='rgb(23, 28, 97)' d='M21.000,28.000 L37.1000,28.000 L37.1000,30.000 L21.000,30.000 L21.000,28.000 Z'/%3E%3Cpath fill-rule='evenodd' fill='rgb(23, 28, 97)' d='M32.172,21.757 L39.243,28.829 L37.828,30.243 L30.757,23.171 L32.172,21.757 Z'/%3E%3Cpath fill-rule='evenodd' fill='rgb(23, 28, 97)' d='M32.172,36.243 L39.243,29.172 L37.828,27.758 L30.757,34.829 L32.172,36.243 Z'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/* @media screen and (max-width:1024px) {
  .card .link-next {
    width: 9.3333333333vw;
    height: 9.3333333333vw;
    right: 25px;
  }
} */

a.card {
  cursor: pointer;
}

@media print,
screen and (min-width:768px) {
  .is-view-pc a.card:hover .link-next {
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
  }
}

.c-btn {
  text-align: center;
  margin: 0 auto;
  position: relative;
  width: 340px;
  display: block;
  padding-bottom: 6px;
  border-radius: 60px;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .c-btn:hover span {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

/* @media screen and (max-width:1024px) {
  .c-btn {
    max-width: 260px;
  }
} */

.c-btn:after,
.c-btn:before {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 50%;
  bottom: 0px;
  content: "";
}

.c-btn:after {
  background-color: #fffe01;
  border-bottom-left-radius: 60px;
}

.c-btn:before {
  background-color: #ff00ca;
  left: 50%;
  border-bottom-right-radius: 60px;
}

.c-btn span {
  z-index: 3;
  position: relative;
  height: 120px;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border: 1px solid #fff;
  padding: 20px;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  border-radius: 60px;
}

/* @media screen and (max-width:1024px) {
  .c-btn span {
    height: 90px;
  }
} */

.c-btn span img {
  max-width: 249px;
  position: relative;
  left: 0px;
}

/* @media screen and (max-width:1024px) {
  .c-btn span img {
    width: 49vw;
    left: -1px;
    max-width: 100%;
  }
} */

.c-btn-02 {
  text-align: center;
  margin: 0 auto;
  position: relative;
  width: 300px;
  display: block;
  padding-bottom: 6px;
  border-radius: 60px;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .c-btn-02:hover span {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

/* @media screen and (max-width:1024px) {
  .c-btn-02 {
    max-width: 260px;
  }
} */

.c-btn-02:after,
.c-btn-02:before {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 50%;
  bottom: 0px;
  content: "";
}

.c-btn-02:after {
  background-color: #fffe01;
  border-bottom-left-radius: 60px;
}

.c-btn-02:before {
  background-color: #ff00ca;
  left: 50%;
  border-bottom-right-radius: 60px;
}

.c-btn-02 span {
  z-index: 3;
  position: relative;
  height: 87px;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border: 1px solid #fff;
  padding: 20px;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  border-radius: 60px;
}

/* @media screen and (max-width:1024px) {
  .c-btn-02 span {
    height: 90px;
  }
} */

.c-btn-02 span img {
  max-width: 249px;
  position: relative;
  left: 0px;
}

/* @media screen and (max-width:1024px) {
  .c-btn-02 span img {
    width: 49vw;
    left: -1px;
    max-width: 100%;
  }
} */

.c-btn-03 {
  text-align: center;
  margin: 0 auto;
  position: relative;
  width: 190px;
  display: block;
  padding-bottom: 6px;
  border-radius: 60px;
  height: 100%;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .c-btn-03:hover span {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

/* @media screen and (max-width:1024px) {
  .c-btn-03 {
    height: 96px !important;
    width: 190px !important;
    min-width: unset !important;
    padding: 0 !important;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    margin: 0 auto !important;
  }
} */

.c-btn-03:after,
.c-btn-03:before {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 50%;
  bottom: 0px;
  content: "";
}

.c-btn-03:after {
  background-color: #fffe01;
  border-bottom-left-radius: 60px;
}

.c-btn-03:before {
  background-color: #ff00ca;
  left: 50%;
  border-bottom-right-radius: 60px;
}

.c-btn-03 span {
  z-index: 3;
  position: relative;
  height: 87px;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border: 1px solid #fff;
  padding: 20px;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  border-radius: 60px;
}

/* @media screen and (max-width:1024px) {
  .c-btn-03 span {
    height: 90px;
    width: 100%;
  }
} */

.c-btn-03 span img {
  max-width: 249px;
  position: relative;
  left: 0px;
}

/* @media screen and (max-width:1024px) {
  .c-btn-03 span img {
    width: 30vw;
    left: -1px;
    max-width: 100%;
  }
} */

.sect-results {
  position: relative;
  padding-bottom: 87px;
}

/* 
@media screen and (max-width:1024px) {
  .sect-results {
    padding-bottom: 97px;
  }
} */

.sect-results:before {
  position: absolute;
  left: 0;
  right: 0;
  content: "";
  bottom: -2.5vw;
  height: 68%;
  z-index: 9;
  background-image: url(../images/pat.png);
  background-position: bottom;
  background-repeat: repeat-x;
  background-size: auto 100%;
}

/* @media screen and (max-width:1024px) {
  .sect-results:before {
    background-color: #faf2c4;
  }
} */

.sect-results:after {
  position: absolute;
  top: -20vw;
  left: 0;
  right: 0;
  content: "";
  background-image: url(../images/bg_02.png);
  background-position: top center;
  background-repeat: no-repeat;
  bottom: 0;
}

@media screen and (min-width: 1921px) {
  .sect-results:after {
    background-size: cover;
  }
}

@media screen and (min-width: 1400px) {
  .sect-results:after {
    top: -15.1vw;
  }
}

@media screen and (max-width: 1279px) {
  .sect-results:after {
    top: -20vw;
  }
}

/* @media screen and (max-width:1024px) {
  .sect-results:after {
    background-size: 100% auto;
    top: -37vw;
    background-image: url(../images/bg_02_sp.png);
  }
} */

@media screen and (max-width:767px) {
  .sect-results:after {
    top: -33vw;
  }
}

.sect-past {
  position: relative;
  padding-bottom: 1px;
}

/* @media screen and (max-width:1024px) {
  .sect-past {
    padding-bottom: 5vw;
  }
} */

.sect-past:after {
  position: absolute;
  top: 3vw;
  left: 0;
  right: 0;
  content: "";
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-image: url(../images/bg_05.png);
  bottom: 0;
}

/* @media screen and (max-width:1024px) {
  .sect-past:after {
    background-image: url(../images/bg_03_m_sp.png);
    background-repeat: repeat-y;
    top: 19vw;
    bottom: 32vw;
  }
} */

.sect-past-02 {
  padding-bottom: 0;
  margin-bottom: 111px;
}

/* @media screen and (max-width:1024px) {
  .sect-past-02 {
    padding-bottom: 21vw;
    margin-bottom: 27vw;
  }
} */

.sect-past-02:before {
  background-image: url(../images/bg_03_t.png);
  position: absolute;
  top: 54px;
  left: 0;
  right: 0;
  content: "";
  height: 295px;
  background-position: center;
}

@media screen and (min-width: 1921px) {
  .sect-past-02:before {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

@media screen and (max-width: 1600px) {
  .sect-past-02:before {
    top: 30px;
  }
}

@media screen and (max-width: 1300px) {
  .sect-past-02:before {
    top: 39px;
  }
}

/* @media screen and (max-width:1024px) {
  .sect-past-02:before {
    background-image: url(../images/bg_03_t_sp.png);
    height: 20vw;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    top: 3px;
  }
} */

@media print,
screen and (min-width:1025px) {
  .sect-past-02:after {
    background-image: url(../images/bg_03_m.png);
    background-repeat: repeat-y;
    top: 295px;
    bottom: 190px;
  }
}

/* @media screen and (min-width:1025px) and (max-width:1024px) {
  .sect-past-02:after {
    background-image: url(../images/bg_03_m_sp.png);
  }
} */

.sect-past-02.close-event:before {
  top: 0;
}

.sect-past .btn-top {
  position: relative;
}

.sect-past .btn-top:after {
  position: absolute;
  bottom: 21px;
  left: 0;
  height: 190px;
  right: 0;
  position: absolute;
  background: url(../images/bg_03_b.png) no-repeat bottom center;
  background-size: 100% 100%;
  content: "";
}

/* @media screen and (max-width:1024px) {
  .sect-past .btn-top:after {
    background-image: url(../images/bg_03_b_sp.png);
    height: 14vw;
    bottom: 3vw;
  }
} */

.sect-past .btn-top>* {
  position: relative;
  z-index: 9;
}

@media screen and (max-width:767px) {
  .sect-past .btn-top {
    margin-bottom: 0;
    padding-bottom: 0;
  }
}

.results {
  position: relative;
  z-index: 99;
  top: -10.8vw;
}

@media screen and (min-width: 1400px) {
  .results {
    top: -9vw;
  }
}

.results__ttl {
  max-width: 229px;
  margin: 0 auto;
  position: relative;
  left: 59px;
  top: 21px;
}

/* @media screen and (max-width:1024px) {
  .results__ttl {
    left: 1px;
    width: 15vw;
    top: -3vw;
    max-width: 114px;
  }
} */

.results-subttl {
  margin: 0 auto;
  width: 316px;
  position: relative;
  margin-top: 5px;
  left: 31px;
}

/* @media screen and (max-width:1024px) {
  .results-subttl {
    width: 51vw;
    left: 4vw;
    margin-top: -5vw;
    text-align: center;
  }
} */

.results__ttl02 {
  max-width: 248px;
  margin: 0 auto;
  position: relative;
  left: 2px;
  top: 28px;
}

/* @media screen and (max-width:1024px) {
  .results__ttl02 {
    left: 15px;
    width: 22vw;
    top: -1vw;
  }
} */

.results-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 29px;
  padding-left: 216px;
  padding-right: 230px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@media screen and (max-width:1239px) {
  .results-list {
    padding-left: 0;
    padding-right: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}

/* @media screen and (max-width:1024px) {
  .results-list {
    display: block;
    padding: 0;
    margin-top: -1vw;
    padding-left: 18px;
  }
} */

.past {
  position: relative;
  z-index: 99;
  margin-top: -12vw;
  padding-bottom: 109px;
}

/* @media screen and (max-width:1024px) {
  .past {
    margin-top: -17vw;
    padding-bottom: 3vw;
  }
} */

.past__ttl {
  max-width: 116px;
  margin: 0 auto;
  position: relative;
  left: 0px;
  top: 45px;
}

/* @media screen and (max-width:1024px) {
  .past__ttl {
    width: 15.3vw;
    left: 0;
    top: 0vw;
  }
} */

.past__ttl02 {
  max-width: 190px;
  margin: 0 auto;
  position: relative;
  top: 1vw;
  left: 36px;
  margin-bottom: 0px;
}

@media screen and (min-width: 1400px) {
  .past__ttl02 {
    top: 3vw;
    margin-bottom: 44px;
  }
}

/* @media screen and (max-width:1024px) {
  .past__ttl02 {
    left: 23px;
    width: 28vw;
    top: -2vw;
    margin-bottom: 12.2666666667vw;
  }
} */

.past-subttl {
  margin: 0 auto;
  width: 317px;
  position: relative;
  margin-top: 27px;
  left: -15px;
  margin-bottom: 45px;
}

/* @media screen and (max-width:1024px) {
  .past-subttl {
    text-align: center;
    width: 51vw;
    margin-top: -11px;
    left: -2.1333333333vw;
    margin-bottom: 30vw;
  }
} */

.past-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 71px;
  padding-right: 40px;
  margin-top: -10px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

@media screen and (max-width: 1279px) {
  .past-list {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width:1239px) {
  .past-list {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 980px;
    margin: 0 auto;
  }
}

/* @media screen and (max-width:1024px) {
  .past-list {
    display: block;
    padding-left: 11px;
    padding-right: 0;
    margin-bottom: -57px;
    max-width: 750px;
    margin: 0 auto;
    margin-top: -12vw;
  }
} */

.past-list .card {
  margin-bottom: 30px;
}

@media screen and (max-width:767px) {
  .past-list .card {
    margin-bottom: 0;
  }
}

/* @media screen and (max-width:1024px) {
  .past-list .card:nth-child(2n) {
    margin-left: auto;
    width: 62vw;
    height: 62vw;
  }
}

@media screen and (max-width:1024px) {
  .past-list .card:nth-child(2n) .link-next {
    right: 5vw;
    bottom: 6vw;
  }
} */

.past-list .card:nth-child(2) {
  margin-top: 78px;
  left: -5px;
}

/* @media screen and (max-width:1024px) {
  .past-list .card:nth-child(2) {
    margin-top: -17px;
    left: 0px;
    margin-right: -8px;
  }
} */

.past-list .card:nth-child(3) {
  margin-top: 78px !important;
}

/* @media screen and (max-width:1024px) {
  .past-list .card:nth-child(3) {
    margin-top: -30px !important;
    margin-left: -9px;
  }
}

@media screen and (max-width:1024px) {
  .past-list .card:nth-child(2n+1) {
    margin-left: 0;
  }
}

@media screen and (max-width:1024px) {
  .past-list .card:nth-child(2n) {
    margin-left: auto !important;
  }
} */

.past-list .card:nth-child(3n+1) {
  margin-top: -70px;
  margin-left: -5px;
}

@media screen and (max-width: 1279px) {
  .past-list .card:nth-child(3n+1) {
    margin-top: 0;
  }
}

/* @media screen and (max-width:1024px) {
  .past-list .card:nth-child(3n+1) {
    margin-top: -20px;
  }
} */

.past-list .card:nth-child(3n+2) {
  margin-top: 70px;
  left: -26px;
}

/* @media screen and (max-width:1024px) {
  .past-list .card:nth-child(3n+2) {
    margin-top: -20px;
    left: -5px;
  }
} */

.past-list .card:nth-child(3n+3) {
  margin-top: 0px;
  left: -32px;
}

/* @media screen and (max-width:1024px) {
  .past-list .card:nth-child(3n+3) {
    margin-top: -13px;
    left: -11px;
  }
} */

.btn-top {
  text-align: center;
  z-index: 999;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -20px;
}

/* @media screen and (max-width:1024px) and (max-width:767px) {
  .btn-top {
    bottom: -22px;
  }
} */

.btn-top a {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 176px;
  margin: 0 auto;
  border-radius: 31px;
  padding: 12px;
  height: 59px;
  position: relative;
  -webkit-box-shadow: 0 5px 0px #6168c0;
  box-shadow: 0 5px 0px #6168c0;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .btn-top a:hover {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
  }
}

/* @media screen and (max-width:1024px) {
  .btn-top a {
    width: 38vw;
    height: 13vw;
    border-radius: 60px;
  }
} */

.btn-top a img {
  width: 70px;
  position: relative;
  top: 1px;
}

/* @media screen and (max-width:1024px) {
  .btn-top a img {
    width: 15vw;
    top: 2px;
  }
} */

.btn-top--other {
  position: relative;
  bottom: auto;
  padding-bottom: 88px;
}

.page-no-login .card-icon {
  display: none;
}

.topic-btn-02 button,
.c-btn-login button {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  background: none;
  height: 100%;
  border: none;
  background: none;
  color: inherit;
  font: inherit;
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  cursor: pointer;
}

#endEvent {
  display: none;
}

.btn-share-bot {
  text-align: center;
  padding-bottom: 45px;
  margin-top: -55px;
}

.btn-share-bot-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.btn-share-bot__ttl {
  margin-bottom: 26px;
}

/* @media screen and (max-width:1024px) {
  .btn-share-bot__ttl {
    width: 57vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 14px;
  }

  .btn-share-bot__ttl img {
    width: 100%;
  }
}

@media screen and (max-width:1024px) {
  .btn-share-bot {
    padding-bottom: 11vw;
    margin-top: -31vw;
  }
} */

.btn-share-bot--result {
  margin-top: 0 !important;
}

.btn-share-bot--answer {
  margin-top: -100px;
}

/* @media screen and (max-width:1024px) {
  .btn-share-bot--answer {
    margin-top: -19vw;
  }
} */

.btn-share-bot a {
  margin: 0 20px;
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .btn-share-bot a:hover {
    opacity: 0.8;
  }
}

.topic-close {
  text-align: center;
  color: #fff;
  padding-top: 12vw;
  padding-bottom: 200px;
}

@media screen and (min-width: 1400px) {
  .topic-close {
    padding-bottom: 10vw;
  }
}

@media screen and (max-width:1239px) {
  .topic-close {
    padding-bottom: 10px;
    padding-top: 19vw;
  }
}

@media screen and (max-width:767px) {
  .topic-close {
    padding-top: 8vw;
    padding-bottom: 0vw;
  }
}

.topic-close p {
  font-weight: bold;
  font-size: 28px;
  letter-spacing: 0.04em;
  line-height: 1.4285714286;
}

@media screen and (max-width:767px) {
  .topic-close p {
    font-size: 4vw;
    line-height: 1.5666666667;
  }
}

.topic-close .btn-share-bot-wrap {
  position: relative;
  z-index: 100;
  margin-top: 52px;
}

@media screen and (max-width:767px) {
  .topic-close .btn-share-bot-wrap {
    margin-top: 4vw;
  }
}

.topic-close .btn-share-bot-wrap a {
  margin: 0 20px;
}

@media screen and (max-width:767px) {
  .topic-close .btn-share-bot-wrap a {
    margin: 0px 14px;
    max-width: 27px;
  }
}

.u-ff-en {
  font-family: "Jost", sans-serif;
}

.survey {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(15%, #fbf2c3), to(#feb78d));
  background: linear-gradient(to bottom, #fbf2c3 15%, #feb78d 100%);
}

@media screen and (max-width:767px) {
  .survey {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(15%, #fbf2c3), to(#feca9e));
    background: linear-gradient(to bottom, #fbf2c3 15%, #feca9e 100%);
  }
}

.survey-content {
  max-width: 810px;
  margin: 0 auto;
}

.survey-ttl {
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  line-height: 175%;
  color: #171c61;
  background-image: url(../images/bg_04.png);
  background-repeat: no-repeat;
  background-position: center;
  height: 198px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 78px;
  letter-spacing: 0.1em;
}

@media screen and (max-width:767px) {
  .survey-ttl {
    background-image: url(../images/bg_04_sp.png);
    margin-bottom: 6px;
    background-size: 100% 100%;
    margin-left: -24px;
    margin-right: -24px;
  }
}

.survey-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: -33px;
  margin-right: -33px;
}

@media screen and (max-width:767px) {
  .survey-list {
    display: block;
    margin-left: 0;
    margin-right: 0;
  }
}

.survey-col {
  width: 50%;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  padding: 0 33px;
}

@media screen and (max-width:767px) {
  .survey-col {
    padding: 0 20px;
    width: 100%;
  }
}

.survey .c-form-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: -7px;
}

.survey .c-form-button .button-01 {
  background-color: white;
  border: 1px solid #6666cc;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 16px;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  font-weight: bold;
  margin: 6px;
  letter-spacing: 0.1em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.survey .c-form-button .button-01 span {
  position: relative;
  display: inline-block;
}

.survey .c-form-button .button-01.is-active {
  background-color: #171c61;
  color: #fff;
}

.survey .c-form-button .button-01.is-active span:before {
  display: inline-block;
}

.survey-item {
  margin-bottom: 50px;
}

.survey-item__ttl {
  font-size: 16px;
  font-weight: 600;
  overflow: hidden;
  color: #171c61;
  text-align: center;
  position: relative;
  margin-bottom: 20px;
}

.survey-item__ttl span {
  display: inline-block;
  padding: 0 15px;
  position: relative;
  letter-spacing: 0.1em;
}

.survey-item__ttl span:after,
.survey-item__ttl span:before {
  content: "";
  height: 1px;
  width: 200px;
  border-bottom: 1px dashed #6168c0;
  top: 50%;
  position: absolute;
}

.survey-item__ttl span:before {
  left: 100%;
}

.survey-item__ttl span:after {
  right: 100%;
  left: initial;
}

.survey-item__content {
  padding-left: 17px;
  padding-right: 17px;
}

@media screen and (max-width:767px) {
  .survey-item__content {
    padding-left: 6px;
    padding-right: 6px;
  }
}

.survey-item__content .c-form-select {
  max-width: 160px;
  margin: 0 auto;
}

.survey-item__content .c-form-select select {
  font-size: 14px;
}

.survey-note {
  font-size: 13px;
  line-height: 1.75;
  margin-top: 88px;
  max-width: 588px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  margin-bottom: 58px;
}

@media screen and (max-width:767px) {
  .survey-note {
    margin-top: 109px;
  }
}

.survey-note ul {
  text-indent: -1em;
  padding-left: 1em;
  padding-top: 29px;
  letter-spacing: 0.1em;
  font-weight: bold;
  color: #171c61;
}

@media screen and (max-width:767px) {
  .survey-note ul {
    padding-top: 7px;
    margin-left: 32px;
    margin-right: 32px;
  }
}

.survey-note-img {
  position: absolute;
  bottom: 100%;
  left: 0;
  text-align: center;
  right: 0;
}

.survey-checkbox {
  text-align: center;
  font-size: 15px;
  letter-spacing: 0.1em;
  color: #171c61;
}

.survey-error {
  color: #ff2121;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-align: center;
  margin-bottom: 13px;
  display: none;
}

.survey-error:before {
  content: "";
  position: relative;
  width: 15px;
  height: 15px;
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='7.5' cy='7.5' r='7.5' fill='%23FF2121'/%3E%3Cpath d='M6.644 8.976L6.392 4.548L6.332 2.868H8.108L8.048 4.548L7.796 8.976H6.644ZM7.22 12.168C6.9 12.168 6.636 12.056 6.428 11.832C6.228 11.608 6.128 11.336 6.128 11.016C6.128 10.68 6.228 10.404 6.428 10.188C6.636 9.972 6.9 9.864 7.22 9.864C7.54 9.864 7.8 9.972 8 10.188C8.208 10.404 8.312 10.68 8.312 11.016C8.312 11.336 8.208 11.608 8 11.832C7.8 12.056 7.54 12.168 7.22 12.168Z' fill='white'/%3E%3C/svg%3E%0A");
}

.survey-btn {
  margin-top: 47px;
  text-align: center;
  margin-bottom: 76px;
}

@media screen and (max-width:767px) {
  .survey-btn {
    margin-bottom: 131px;
  }
}

.c-bnt-02 {
  margin: 0 auto;
  border-radius: 60px;
  background-color: #6b6b6b;
  pointer-events: none;
  border: 1px solid #fff;
  height: 87px;
  width: 263px;
  -webkit-box-shadow: 0 8px 0px #6168c0;
  box-shadow: 0 8px 0px #6168c0;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.c-bnt-02.is-active {
  background-color: #000;
  pointer-events: inherit;
}

.c-bnt-02.is-active:hover {
  pointer-events: inherit;
  -webkit-box-shadow: 0 0px 0px #6168c0;
  box-shadow: 0 0px 0px #6168c0;
  -webkit-transform: translateY(8px);
  transform: translateY(8px);
}

.btn-loading {
  margin-left: 8px;
  font-size: 14px;
  color: #999;
}

@-webkit-keyframes shake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  25% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }

  50% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }

  75% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes shake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  25% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }

  50% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }

  75% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* ----------------------------------------------
 * Generated by Animista on 2025-5-5 8:21:31
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
 * ----------------------------------------
 * animation shake-vertical
 * ----------------------------------------
 */
@-webkit-keyframes shake-vertical {

  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }

  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }

  80% {
    -webkit-transform: translateY(6.4px);
    transform: translateY(6.4px);
  }

  90% {
    -webkit-transform: translateY(-6.4px);
    transform: translateY(-6.4px);
  }
}

.shake-vertical {
  -webkit-animation: shake-vertical 9s linear infinite both;
  animation: shake-vertical 9s linear infinite both;
}

@keyframes shake-vertical {

  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }

  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }

  80% {
    -webkit-transform: translateY(6.4px);
    transform: translateY(6.4px);
  }

  90% {
    -webkit-transform: translateY(-6.4px);
    transform: translateY(-6.4px);
  }
}

.u-ff-en {
  font-family: "Jost", sans-serif;
}

.question-page-main .l-inner {
  position: relative;
  z-index: 99;
}

.question-page .l-main {
  min-height: 100vh;
}

.question-page .l-inner {
  position: relative;
  z-index: 99;
}

@media screen and (max-width:767px) {
  .question-page .l-inner {
    margin-left: -20px;
    margin-right: -20px;
  }
}

@media screen and (max-width:767px) {

  .question-page-a .l-inner,
  .question-page-b .l-inner {
    margin-left: 0px;
    margin-right: 0px;
  }
}

.question-page-a .comment,
.question-page-b .comment {
  top: 30%;
}

/* @media screen and (max-width:1024px) {

  .question-page-a .comment,
  .question-page-b .comment {
    top: inherit;
    margin-top: 28px;
    margin-left: -15px;
    margin-right: -15px;
    position: relative;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
  }
}

@media screen and (max-width:1024px) {

  .question-page-a .comment-col:nth-child(2n),
  .question-page-b .comment-col:nth-child(2n) {
    padding-top: 40px;
  }
} */

.question-ttl {
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  line-height: 175%;
  color: #171c61;
  background-image: url(../images/bg-05.png);
  background-repeat: no-repeat;
  background-position: center;
  height: 455px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  letter-spacing: 0.1em;
  text-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 64px;
  padding-left: 25px;
  padding-right: 25px;
}

@media screen and (max-width:767px) {
  .question-ttl {
    background-image: url(../images/bg-05-sp.png);
    margin-bottom: 6px;
    margin-left: -20px;
    margin-right: -20px;
    background-size: 100% 100%;
    background-position: top;
    padding-top: 48px;
  }
}

.question-ttl .number {
  width: 80px;
  height: 80px;
  background-color: #171c61;
  border: 1px solid #fff;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 17px;
  margin: 0 auto;
}

@media screen and (max-width:767px) {
  .question-ttl .number {
    width: 106px;
    height: 106px;
    padding: 21px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

.question-ttl h2 {
  line-height: 1.7;
  font-size: 24px;
  font-weight: bold;
  margin-top: 12px;
  max-width: 600px;
}

@media screen and (max-width:767px) {
  .question-ttl h2 {
    margin-top: 19px;
    line-height: 1.5;
  }
}

.question-ttl h3 {
  margin-top: 12px;
}

.question-ttl h3 span {
  display: block;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.5;
}

.question-ttl h3 span.txt-hightlight {
  display: inline-block;
  font-size: 24px;
  letter-spacing: 0.09em;
  background-image: url(../images/bg_yellow.png);
  background-repeat: repeat-x;
  background-position: bottom;
  background-size: 10px;
}

@media screen and (max-width:767px) {
  .question-ttl h3 span.txt-hightlight {
    background-size: 5px 12px;
  }
}

.question-ttl h3 span.txt-hightlight-b {
  background-image: url(../images/bg_pink.png);
}

.question-ttl-comment {
  height: 290px;
  background-size: contain;
  background-image: url(../images/bg-06.png);
  background-repeat: no-repeat;
  background-position: center;
  padding-top: 24px;
}

@media screen and (max-width:767px) {
  .question-ttl-comment {
    background-image: url(../images/bg-06-sp.png);
    padding-top: 20px;
    background-size: 100% 100%;
  }
}

.question-ttl-comment .number {
  width: 64px;
  height: 64px;
  padding: 13px;
}

@media screen and (max-width:767px) {
  .question-ttl-comment .number {
    width: 70px;
    height: 70px;
  }
}

.question-ttl-comment h2 {
  font-size: 18px;
  margin-top: 4px;
  padding-left: 52px;
  padding-right: 52px;
  word-break: initial;
  max-width: 531px;
}

@media screen and (max-width:767px) {
  .question-ttl-comment h2 {
    margin-top: 10px;
    padding-left: 0;
    padding-right: 0;
  }
}

.question-list {
  max-width: 470px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: -157px;
  position: relative;
  z-index: 99;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media screen and (max-width:767px) {
  .question-list {
    margin-top: -132px;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    margin-left: -3px;
    margin-right: -3px;
    max-width: inherit;
  }
}

.question-item {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #fffe01;
  font-size: 23px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  position: relative;
  letter-spacing: 0.02em;
}

@media screen and (max-width:767px) {
  .question-item {
    font-size: 20px;
    width: 148px;
    height: 148px;
  }
}

.question-item__txt {
  position: relative;
  color: black;
  -webkit-text-stroke: 3px white;
  paint-order: stroke fill;
  font-size: 23px;
  font-weight: bold;
  line-height: 1.2;
}

@media screen and (max-width:767px) {
  .question-item__txt {
    font-size: 20px;
  }
}

@-moz-document url-prefix() {
  .question-item__txt {
    /* Fallback cho Firefox */
    text-shadow: 1px 0 white, -1px 0 white, 0 1px white, 0 -1px white, 1px 1px white, -1px 1px white, 1px -1px white, -1px -1px white;
    -webkit-text-stroke: 0;
  }
}

.question-item.question-b {
  background-color: #ff00ca;
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .question-item:hover .question-btn {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 3px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 3px 0px rgba(97, 103, 192, 0);
  }
}

.question-or {
  margin: 0 15px;
}

@media screen and (max-width:767px) {
  .question-or {
    margin: 0 5px;
    position: relative;
    top: 7px;
    width: 36px;
  }
}

.question-btn {
  position: absolute;
  bottom: -5px;
  left: 0;
  right: 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 93px;
  margin: 0 auto;
  border-radius: 20px;
  padding: 12px;
  height: 40px;
  -webkit-box-shadow: 0 3px 0px #6168c0;
  box-shadow: 0 3px 0px #6168c0;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/* @media screen and (max-width:1024px) {
  .question-btn {
    height: 36px;
    bottom: -11px;
  }
}

@media screen and (max-width:1024px) {
  .comment {
    position: relative;
    margin-top: 56px;
    padding-left: 12px;
    padding-right: 12px;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
  }
} */

.comment-col {
  width: 258px;
  position: relative;
}

/* @media screen and (max-width:1024px) {
  .comment-col {
    width: auto;
  }
} */

.comment-col:nth-child(2n) .comment-item {
  margin-left: auto;
}

.comment-col:nth-child(2n) .comment-item:nth-child(2n) {
  margin-left: 0;
  margin-right: auto;
}

.comment-col .shake-vertical:nth-child(1) {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

.comment-col .shake-vertical:nth-child(2) {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

.comment-col .shake-vertical:nth-child(3) {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

.comment-col .shake-vertical:nth-child(4) {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

.comment-col .shake-vertical:nth-child(5) {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

.comment-col .shake-vertical:nth-child(6) {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

/* @media screen and (max-width:1024px) {
  .comment-col.comment-col-sp {
    height: 114px;
    width: 180px;
    margin-bottom: 50px;
  }
} */

.comment-col.comment-select .comment-item {
  width: 220px !important;
  height: 142px;
}

@media screen and (max-width:767px) {
  .comment-col.comment-select .comment-item {
    width: 180px !important;
    height: 110px;
  }
}

.comment-col.comment-select .comment-item:nth-child(1),
.comment-col.comment-select .comment-item:nth-child(3) {
  margin-left: 0;
}

.comment-col.comment-select .comment-item:nth-child(2) {
  margin-left: auto;
}

.comment-col~.comment-col .comment-item {
  margin-left: 0;
}

.comment-col~.comment-col.comment-select .comment-item:nth-child(1),
.comment-col~.comment-col.comment-select .comment-item:nth-child(3) {
  margin-left: auto;
}

.comment-col~.comment-col.comment-select .comment-item:nth-child(2) {
  margin-left: 0;
}

.comment-item {
  background-image: url(../images/fuki_bg.svg);
  width: 180px !important;
  height: 114px;
  background-size: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 23px;
  color: #171c61;
}

.comment-item span {
  padding: 0 27px;
  word-break: inherit;
  font-size: 14px;
  color: #171c61;
  font-weight: 500;
  line-height: 1.4;
}

@media screen and (max-width:374px) {
  .comment-item {
    width: 150px;
  }
}

.comment-item:nth-child(1) {
  margin-left: auto;
}

.comment-item.comment-b,
.comment-item.comment-B {
  background-image: url(../images/fuki_bg_02.svg);
}

.comment-item.comment-fadein {
  opacity: 0;
  width: 100%;
  will-change: opacity, transform;
  -webkit-transition: opacity 0.8s ease, -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  transition: opacity 0.8s ease, -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.comment-item.comment-fadein.comment-a {
  left: 0;
  -webkit-transform: translateX(-80px);
  transform: translateX(-80px);
}

.comment-item.comment-fadein.comment-a.exit {
  opacity: 0;
  -webkit-transform: translateX(-40px);
  transform: translateX(-40px);
  /* slide nhẹ hơn khi thoát */
}

.comment-item.comment-fadein.comment-b {
  right: 0;
  -webkit-transform: translateX(80px);
  transform: translateX(80px);
}

.comment-item.comment-fadein.comment-b.exit {
  opacity: 0;
  -webkit-transform: translateX(40px);
  transform: translateX(40px);
  /* slide nhẹ hơn khi thoát */
}

.comment-item.comment-fadein.active {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  z-index: 2;
}

/* @media screen and (max-width:1024px) {
  .comment-item.comment-fadein {
    position: absolute;
    top: 0;
  }
} */

.comment-inner {
  padding-left: 258px;
  padding-right: 258px;
}

/* @media screen and (max-width:1024px) {
  .comment-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
} */

.comment-form {
  background-color: #ffffb0;
  border-radius: 24px;
  padding: 39px;
  max-width: 610px;
  margin: 0 auto;
  text-align: center;
  margin-top: 50px;
  z-index: 99;
  position: relative;
  background-image: url(../images/pat_01.png);
  background-size: cover;
  background-position: top left;
}

@media screen and (max-width:767px) {
  .comment-form {
    padding: 35px 29px 28px 29px;
    text-align: left;
    margin-top: 49px;
    border-radius: 20px;
  }
}

.comment-form p {
  font-size: 15px;
  font-weight: bold;
  color: #171c61;
  margin-bottom: 18px;
}

.comment-form .from-control {
  border-radius: 16px;
  font-weight: 500;
  font-size: 15px;
  padding: 25px 28px;
  min-height: 80px;
  border-color: #b5b5b5;
  outline: none;
}

@media screen and (max-width:767px) {
  .comment-form .from-control {
    padding: 11px 26px;
    border-radius: 10px;
  }
}

.comment-form .from-control.is-error {
  border-color: red;
}

.comment-form-ttl {
  margin-top: -57px;
  margin-bottom: 14px;
  text-align: center;
}

@media screen and (max-width:767px) {
  .comment-form-ttl img {
    width: 162px;
  }
}

.btn-next {
  margin-top: 33px;
  margin-bottom: 19px;
}

@media screen and (max-width:767px) {
  .btn-next {
    margin-top: 6px;
    margin-bottom: 27px;
  }
}

.btn-next a {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 144px;
  margin: 0 auto;
  border-radius: 31px;
  padding: 12px;
  height: 49px;
  position: relative;
  -webkit-box-shadow: 0 5px 0px #6168c0;
  box-shadow: 0 5px 0px #6168c0;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .btn-next a:hover {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
  }
}

/* @media screen and (max-width:1024px) {
  .btn-next a {
    width: 160px;
    height: 55px;
  }
} */

.btn-preview {
  text-align: center;
  padding-bottom: 30px;
  position: relative;
  z-index: 99;
}

@-webkit-keyframes slideInFade {
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
  }
}

@keyframes slideInFade {
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
  }
}

.loading-comment {
  text-align: center;
}

@-webkit-keyframes floatX {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }

  50% {
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  to {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@keyframes floatX {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }

  50% {
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  to {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@-webkit-keyframes floatY {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }

  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  to {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes floatY {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }

  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  to {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@-webkit-keyframes zoom-heart-breath {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }

  to {
    -webkit-transform: scale(3);
    transform: scale(3);
    opacity: 0;
  }
}

@keyframes zoom-heart-breath {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }

  to {
    -webkit-transform: scale(3);
    transform: scale(3);
    opacity: 0;
  }
}

.ico-check {
  display: inline-block;
  width: 38px;
  height: 38px;
  background: url(../images/ico_check.svg) no-repeat center/100% 100%;
}

/* @media screen and (max-width:1024px) {
  .ico-check {
    width: 8.2051282051vw;
    height: 8.2051282051vw;
  }
} */

.ico-line {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../images/line_logo.svg) no-repeat center/100% 100%;
}

/* @media screen and (max-width:1024px) {
  .ico-line {
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
} */

.ico-social-twitter {
  display: inline-block;
  width: 28px;
  height: 28px;
  background: url(../images/icon_twitter.png) no-repeat center/100% 100%;
}

@media screen and (max-width:767px) {
  .ico-social-twitter {
    width: 7.1794871795vw;
    height: 7.1794871795vw;
  }
}

.ico-arrow-down {
  display: inline-block;
  width: 12px;
  height: 15px;
  background: url(../images/more_comment_arr.svg) no-repeat center/100% 100%;
}

/* @media screen and (max-width:1024px) {
  .ico-arrow-down {
    width: 3.0769230769vw;
    height: 3.8461538462vw;
  }
} */

.ico-arrow-left {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #000;
}

/* @media screen and (max-width:1024px) {
  .ico-arrow-left {
    width: 7.6923076923vw;
    height: 7.6923076923vw;
  }
} */

.ico-arrow-left::before {
  content: "";
  display: block;
  width: 15px;
  height: 13px;
  background: url('data:image/svg+xml,<svg width="15" height="13" viewBox="0 0 15 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 12L1 6.5L7 1" stroke="white"/><path d="M15 6.5L1 6.5" stroke="white"/></svg>') no-repeat center/100% 100%;
}

/* @media screen and (max-width:1024px) {
  .ico-arrow-left::before {
    width: 3.8461538462vw;
    height: 3.3333333333vw;
  }
} */

.ico-arrow-right {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #000;
}

/* 
@media screen and (max-width:1024px) {
  .ico-arrow-right {
    width: 7.6923076923vw;
    height: 7.6923076923vw;
  }
} */

.ico-arrow-right::before {
  content: "";
  display: block;
  width: 15px;
  height: 13px;
  background: url('data:image/svg+xml,<svg width="15" height="13" viewBox="0 0 15 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 1L14 6.5L8 12" stroke="white"/><path d="M0 6.5H14" stroke="white"/></svg>') no-repeat center/100% 100%;
}

/* @media screen and (max-width:1024px) {
  .ico-arrow-right::before {
    width: 3.8461538462vw;
    height: 3.3333333333vw;
  }
} */

.sect-publish {
  position: relative;
}

/* @media screen and (max-width:1024px) {
  .sect-publish {
    padding-top: 44px;
  }
} */

.sect-publish::after {
  content: "";
  pointer-events: none;
  left: 0;
  right: 0;
  top: -102px;
  bottom: 0;
  position: absolute;
  background-image: url(../images/bg_01.png);
  background-position: top center;
  background-repeat: no-repeat;
}

@media screen and (min-width: 1921px) {
  .sect-publish::after {
    background-size: cover;
  }
}

/* @media screen and (max-width:1024px) {
  .sect-publish::after {
    background-image: url(../images/bg_01_sp.png);
    background-size: 100% auto;
    top: 44px;
  }
} */

.sect-publish__inner {
  position: relative;
  z-index: 1;
  padding-bottom: 162px;
}

/* @media screen and (max-width:1024px) {
  .sect-publish__inner {
    padding-bottom: 25.1282051282vw;
  }
} */

.sect-publish__inner:after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  min-height: 256px;
  background-image: url(../images/bg_02_top.png);
  background-position: bottom center;
  background-repeat: no-repeat;
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .sect-publish__inner:after {
    background-size: 100% 100%;
  }
}

/* @media screen and (max-width:1024px) {
  .sect-publish__inner:after {
    background-size: 100% auto;
  }
} */

.publish-date {
  padding-top: 127px;
  padding-bottom: 0;
  text-align: center;
  color: #fff;
  position: relative;
  z-index: 2;
}

/* @media screen and (max-width:1024px) {
  .publish-date {
    padding-top: 19.2307692308vw;
  }
} */

.publish-date__thank {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 51px;
}

/* @media screen and (max-width:1024px) {
  .publish-date__thank {
    margin-bottom: 13.5897435897vw;
  }
} */

.publish-date__thank span {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.3;
}

/* @media screen and (max-width:1024px) {
  .publish-date__thank span {
    font-size: 5.641025641vw;
  }
}

@media screen and (max-width:1024px) {
  .publish-date__thank {
    font-size: 5.641025641vw;
    margin-bottom: 13.5897435897vw;
  }
} */

.publish-date__thank .ico-check {
  margin-right: 15px;
  margin-left: -5px;
}

/* @media screen and (max-width:1024px) {
  .publish-date__thank .ico-check {
    margin-left: 0;
  }
} */

.publish-date__box {
  width: 80%;
  max-width: 468px;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
  border-radius: 25px;
  color: #171c61;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  padding: 20px 10px 23px;
}

/* @media screen and (max-width:1024px) {
  .publish-date__box {
    width: 100%;
    max-width: 100%;
    border-radius: 6.4102564103vw;
    padding: 3.8461538462vw 2.5641025641vw 3.8461538462vw;
  }
} */

.publish-date__box .note {
  position: absolute;
  width: 169px;
  height: 60px;
  right: -30px;
  margin-bottom: -30px;
  bottom: 100%;
}

/* @media screen and (max-width:1024px) {
  .publish-date__box .note {
    width: 43.3333333333vw;
    height: 15.3846153846vw;
    right: 0vw;
    margin-bottom: -5.1282051282vw;
  }
} */

.publish-date__box .note img {
  width: 100%;
}

.publish-date__box .text {
  font-size: 22px;
  font-weight: 500;
}

/* @media screen and (max-width:1024px) {
  .publish-date__box .text {
    font-size: 3.5897435897vw;
  }
} */

.publish-date__box .text-01 {
  margin-right: 10px;
}

.publish-date__box .text-02 {
  margin-left: 10px;
}

.publish-date__box .date {
  font-family: "Inter", sans-serif;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.publish-date__box .date strong {
  font-size: 48px;
  font-weight: bold;
  color: #ff00ca;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-top: -3px;
  margin-bottom: -2px;
}

@media screen and (max-width:1024px) {
  .publish-date__box .date strong {
    font-size: 8.2051282051vw;
    margin-bottom: 0;
  }
}

.publish-date__box .date strong small {
  font-size: 50%;
  margin-left: 0.1em;
}

.publish-date__box .date span {
  font-size: 12px;
  color: #fff;
  background-color: #6168c0;
  border-radius: 16px;
  line-height: 1.15;
}

@media screen and (max-width:1024px) {
  .publish-date__box .date span {
    font-size: 3.0769230769vw;
  }
}

.publish-date__share {
  margin-top: 30px;
}

@media screen and (max-width:1024px) {
  .publish-date__share {
    margin-top: 6.1538461538vw;
  }
}

.publish-date__share-ttl {
  margin-bottom: 8px;
}

@media screen and (max-width:1024px) {
  .publish-date__share-ttl {
    margin-bottom: 2.0512820513vw;
  }
}

.publish-date__share-ttl img {
  width: 254px;
}

@media screen and (max-width:1024px) {
  .publish-date__share-ttl img {
    width: 65.1282051282vw;
  }
}

.btn-line-01 {
  text-align: center;
}

.btn-line-01 a {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 144px;
  margin: 0 auto;
  border-radius: 27px;
  padding: 0 15px 0 12px;
  height: 49px;
  position: relative;
  -webkit-box-shadow: 0 5px 0px #4cc764;
  box-shadow: 0 5px 0px #4cc764;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .btn-line-01 a:hover {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
  }
}

@media screen and (max-width:1024px) {
  .btn-line-01 a {
    border-radius: 6.9230769231vw;
    width: 36.9230769231vw;
    height: 12.5641025641vw;
  }
}

.btn-line-01 a .ico-line {
  margin-right: 6px;
}

.btn-line-01 a img {
  width: 80px;
}

@media screen and (max-width:1024px) {
  .btn-line-01 a img {
    width: 20.5128205128vw;
  }
}

.sect-comment {
  position: relative;
}

.sect-comment::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../images/bg_02_center.png) repeat-y top center;
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .sect-comment::before {
    background-size: 100% auto;
  }
}

@media screen and (max-width:1024px) {
  .sect-comment::before {
    background-size: 100% auto;
  }
}

.sect-comment>* {
  position: relative;
  z-index: 1;
}

.sect-comment .comment-top {
  text-align: center;
  -webkit-transform: translateY(-87px);
  transform: translateY(-87px);
  margin-bottom: -42px;
  position: relative;
  z-index: 1;
}

@media screen and (max-width:1024px) {
  .sect-comment .comment-top {
    margin-bottom: -5.1282051282vw;
    -webkit-transform: translateY(-12.3076923077vw);
    transform: translateY(-12.3076923077vw);
  }
}

@media screen and (max-width:1024px) {
  .sect-comment .comment-top__ttl01 img {
    width: 53.3333333333vw;
  }
}

.sect-comment .comment-top__ttl02 {
  margin-top: 16px;
  padding-left: 14px;
}

@media screen and (max-width:1024px) {
  .sect-comment .comment-top__ttl02 {
    margin-top: 2.5641025641vw;
    padding-left: 0;
  }
}

@media screen and (max-width:1024px) {
  .sect-comment .comment-top__ttl02 img {
    width: 49.7435897436vw;
  }
}

.sect-comment .tab-menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
}

.sect-comment .tab-menu__item {
  width: calc(50% - 15px);
  height: 62px;
  border-radius: 10px 10px 0 0;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 6px;
  cursor: pointer;
}

.sect-comment .tab-menu__item:nth-child(1) {
  background-color: #fdc78b;
}

.sect-comment .tab-menu__item:nth-child(2) {
  background-color: #ffafe6;
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-menu__item {
    width: calc(50% - 10px);
    height: 12.1717948718vw;
  }

  .sect-comment .tab-menu__item img {
    width: 13.3333333333vw;
  }
}

.sect-comment .tab-container {
  position: relative;
  padding-bottom: 214px;
  overflow: hidden;
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-container {
    padding-bottom: 27.1794871795vw;
  }
}

.sect-comment .tab-container::before {
  content: "";
  display: block;
  position: absolute;
  top: 121px;
  bottom: 0;
  left: 0;
  right: 0;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: top center;
  -webkit-animation: floatY 5s ease-in-out infinite;
  animation: floatY 5s ease-in-out infinite;
}

@media screen and (min-width: 1280px) {
  .sect-comment .tab-container::before {
    background-size: 100% auto;
  }
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-container::before {
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    top: 0;
  }
}

.sect-comment .tab-container:after {
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  content: "";
  height: 190px;
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-image: url(../images/bg_03_top.png);
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .sect-comment .tab-container:after {
    background-size: 100% 190px;
  }
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-container:after {
    background-size: 100% auto;
    height: 18.5365853659vw;
  }
}

.sect-comment .tab-container[data-active=tabContent01] {
  background: -webkit-gradient(linear, left top, left bottom, from(#fdc78b), color-stop(30%, #fbf2c3), color-stop(70%, #fbf2c3), to(#f2aeae));
  background: linear-gradient(to bottom, #fdc78b 0%, #fbf2c3 30%, #fbf2c3 70%, #f2aeae 100%);
}

.sect-comment .tab-container[data-active=tabContent01]::before {
  background-image: url(../images/tab_bg.png);
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-container[data-active=tabContent01]::before {
    background-image: url(../images/tab_bg_02_sp_y.png);
  }
}

.sect-comment .tab-container[data-active=tabContent02] {
  background: -webkit-gradient(linear, left top, left bottom, from(#ffafe6), color-stop(30%, #fdb0e5), color-stop(70%, #ff9fdd), to(#ffa0de));
  background: linear-gradient(to bottom, #ffafe6 0%, #fdb0e5 30%, #ff9fdd 70%, #ffa0de 100%);
}

.sect-comment .tab-container[data-active=tabContent02]::before {
  background-image: url(../images/tab_bg_02.png);
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-container[data-active=tabContent02]::before {
    background-image: url(../images/tab_bg_sp.png);
  }
}

.sect-comment .tab-contents {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding-top: 44px;
}

@media screen and (max-width:1024px) {
  .sect-comment .tab-contents {
    padding-top: 9.2307692308vw;
  }
}

.sect-comment .tab-content {
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  pointer-events: none;
  position: absolute;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s ease-out;
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s ease-out;
  transition: transform 0.5s ease-out, opacity 0.5s ease-out;
  transition: transform 0.5s ease-out, opacity 0.5s ease-out, -webkit-transform 0.5s ease-out;
  -webkit-transform: translateY(20px);
  transform: translateY(20px);
}

.sect-comment .tab-content.is-active {
  visibility: visible;
  opacity: 1;
  z-index: 1;
  pointer-events: all;
  position: relative;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.comment-lead {
  text-align: center;
}

.comment-lead__txt01 {
  font-weight: bold;
  font-size: 24px;
  color: #171c61;
  letter-spacing: 0.05em;
  margin-bottom: 0.58em;
}

@media screen and (max-width:1024px) {
  .comment-lead__txt01 {
    font-size: 4.6153846154vw;
    margin-bottom: 0.9em;
  }
}

.comment-lead__txt02,
.comment-lead__txt03 {
  font-weight: 900;
  font-size: 24px;
  color: #171c61;
  line-height: 1.15;
  letter-spacing: 0.09em;
}

.comment-lead__txt02 span,
.comment-lead__txt03 span {
  font-weight: 900;
  font-size: 24px;
  line-height: 1.15;
}

@media screen and (max-width:1024px) {

  .comment-lead__txt02 span,
  .comment-lead__txt03 span {
    font-size: 3.5897435897vw;
  }
}

@media screen and (max-width:1024px) {

  .comment-lead__txt02,
  .comment-lead__txt03 {
    font-size: 3.5897435897vw;
  }
}

.comment-lead__txt02 .text01 {
  color: #000;
  display: inline-block;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fffe01), color-stop(35%, #fffe01), color-stop(35%, transparent), to(transparent));
  background: linear-gradient(to top, #fffe01 0, #fffe01 35%, transparent 35%, transparent 100%);
}

.comment-lead__txt02 .text-or {
  color: #000;
  font-family: "Inter", sans-serif;
  margin-left: 0.15em;
  margin-right: 0.15em;
  font-size: 120%;
}

.comment-lead__txt02 .text02 {
  color: #000;
  display: inline-block;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ff79e3), color-stop(30%, #ff79e3), color-stop(30%, transparent), to(transparent));
  background: linear-gradient(to top, #ff79e3 0, #ff79e3 30%, transparent 30%, transparent 100%);
}

.comment-lead__txt03 {
  margin-top: 32px;
}

@media screen and (max-width:1024px) {
  .comment-lead__txt03 {
    margin-top: 6.4102564103vw;
  }
}

.comment-lead__txt03 .text03 {
  color: #000;
  font-size: 32px;
  margin: 0 0.35em;
  display: inline-block;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fffe01), color-stop(50%, #fffe01), color-stop(50%, transparent), to(transparent));
  background: linear-gradient(to top, #fffe01 0, #fffe01 50%, transparent 50%, transparent 100%);
}

@media screen and (max-width:1024px) {
  .comment-lead__txt03 .text03 {
    font-size: 6.1538461538vw;
  }
}

.comment-lead__txt03 .text03--pink {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ff79e3), color-stop(50%, #ff79e3), color-stop(50%, transparent), to(transparent));
  background: linear-gradient(to top, #ff79e3 0, #ff79e3 50%, transparent 50%, transparent 100%);
}

.after-answer .comment-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 560px;
  padding-bottom: 65px;
  margin-top: 75px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width:1024px) {
  .after-answer .comment-list {
    display: block;
    max-width: 100%;
    padding-bottom: 0;
    padding-top: 12.8205128205vw;
    margin-top: 16.6666666667vw;
  }
}

.after-answer .comment-list__item {
  width: 274px;
  margin-bottom: 16px;
  display: none;
}

@media print,
screen and (min-width:1025px) {
  .after-answer .comment-list__item:nth-child(2n+2) {
    margin-top: 80px;
    margin-bottom: -80px;
  }
}

@media screen and (max-width:1024px) {
  .after-answer .comment-list__item {
    width: 50%;
    margin-bottom: 0;
    margin-top: -12.8205128205vw;
  }

  .after-answer .comment-list__item:nth-child(4n-1) {
    margin-left: 16%;
    margin-top: -2.5641025641vw;
    margin-bottom: 10.2564102564vw;
  }
}

.after-answer .comment-list__item:nth-child(-n+5) {
  display: block;
}

.after-answer .comment-list__item:nth-child(2n) {
  margin-left: auto;
}

.after-answer .comment-list__item.is-animate {
  opacity: 0;
}

.after-answer .comment-list__item.is-animated {
  opacity: 1;
  -webkit-transition: opacity 0.6s ease-in-out 0.5s, -webkit-transform 0.8s ease-in-out 0.8s;
  transition: opacity 0.6s ease-in-out 0.5s, -webkit-transform 0.8s ease-in-out 0.8s;
  transition: opacity 0.6s ease-in-out 0.5s, transform 0.8s ease-in-out 0.8s;
  transition: opacity 0.6s ease-in-out 0.5s, transform 0.8s ease-in-out 0.8s, -webkit-transform 0.8s ease-in-out 0.8s;
}

.after-answer .comment-list__item.item-comment-a.is-animate,
.after-answer .comment-list__item.item-comment-A.is-animate {
  -webkit-transform: translate(-600px, 0);
  transform: translate(-600px, 0);
}

.after-answer .comment-list__item.item-comment-a.is-animated,
.after-answer .comment-list__item.item-comment-A.is-animated {
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}

.after-answer .comment-list__item.item-comment-b.is-animate,
.after-answer .comment-list__item.item-comment-B.is-animate {
  -webkit-transform: translate(600px, 0);
  transform: translate(600px, 0);
}

.after-answer .comment-list__item.item-comment-b.is-animated,
.after-answer .comment-list__item.item-comment-B.is-animated {
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}

.after-answer .comment-list__item.is-hide {
  opacity: 0;
  -webkit-transform: translate(0, 30px);
  transform: translate(0, 30px);
}

.after-answer .comment-list__item.is-show {
  opacity: 1;
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
  -webkit-transition: opacity 0.45s ease-in 0s, -webkit-transform 0.45s ease-in 0s;
  transition: opacity 0.45s ease-in 0s, -webkit-transform 0.45s ease-in 0s;
  transition: opacity 0.45s ease-in 0s, transform 0.45s ease-in 0s;
  transition: opacity 0.45s ease-in 0s, transform 0.45s ease-in 0s, -webkit-transform 0.45s ease-in 0s;
}

.after-answer .comment-list .comment-item {
  width: 274px !important;
  height: 174px;
  color: #171c61;
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 0.4em;
  position: relative;
  -webkit-animation: floatX 6s ease-in-out infinite;
  animation: floatX 6s ease-in-out infinite;
}

@media screen and (max-width:1024px) {
  .after-answer .comment-list .comment-item {
    width: 43.8461538462vw !important;
    height: 28.2051282051vw;
    font-size: 3.5897435897vw;
    margin-bottom: 0;
  }
}

.after-answer .comment-list .comment-item p {
  padding: 0 20px;
  word-break: break-word;
  color: #171c61;
}

.after-answer .comment-list .comment-item.comment-b,
.after-answer .comment-list .comment-item.comment-B {
  margin-left: auto;
}

.after-answer .comment-list .comment-item__heart {
  position: absolute;
  bottom: 8px;
  right: 13px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 5px;
}

@media screen and (max-width:1024px) {
  .after-answer .comment-list .comment-item__heart {
    bottom: 2.0512820513vw;
    right: 3.3333333333vw;
  }
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .after-answer .comment-list .comment-item__heart:hover svg {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}

.after-answer .comment-list .comment-item__heart svg {
  fill: #fff;
  stroke: #bbbbbb;
  display: block;
  width: 36px;
  height: 32px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

@media screen and (max-width:1024px) {
  .after-answer .comment-list .comment-item__heart svg {
    width: 4.6153846154vw;
    height: 4.1025641026vw;
  }
}

.after-answer .comment-list .comment-item__heart::before,
.after-answer .comment-list .comment-item__heart::after {
  content: "";
  display: block;
  width: 46px;
  height: 46px;
  position: absolute;
  top: -2px;
  left: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  visibility: hidden;
}

.after-answer .comment-list .comment-item__heart::before {
  border: 2px solid #ff007b;
  opacity: 1;
  border-radius: 50%;
  z-index: 2;
}

.after-answer .comment-list .comment-item__heart::after {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33.16 30"><path d="M18,9.81C18-1.58,34.58-2.71,34.58,11.09,34.58,19.57,25.39,26.42,18,31,10.61,26.42,1.42,19.57,1.42,11.09,1.42-2.71,18-1.59,18,9.81Z" transform="translate(-1.42 -1)" fill="%23ff007b"/></svg>') no-repeat center/36px 32px;
  z-index: 1;
}

.after-answer .comment-list .comment-item__heart.is-active {
  pointer-events: none;
  cursor: default;
}

.after-answer .comment-list .comment-item__heart.is-active svg {
  -webkit-transform: scale(0);
  transform: scale(0);
  opacity: 0;
}

.after-answer .comment-list .comment-item__heart.is-active::before {
  visibility: visible;
  -webkit-animation: 0.2s ease 0s 1 normal both running zoom-heart-breath;
  animation: 0.2s ease 0s 1 normal both running zoom-heart-breath;
}

.after-answer .comment-list .comment-item__heart.is-active::after {
  visibility: visible;
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: -webkit-transform 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: transform 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: transform 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -webkit-transform: scale(1);
  transform: scale(1);
}

.more-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  width: 144px;
  margin: 0 auto;
  border-radius: 27px;
  padding: 0 12px;
  height: 49px;
  -webkit-box-shadow: 0 3px 0px #6168c0;
  box-shadow: 0 3px 0px #6168c0;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .more-btn:hover {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 3px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 3px 0px rgba(97, 103, 192, 0);
  }
}

@media screen and (max-width:1024px) {
  .more-btn {
    margin-top: 5.1282051282vw;
    width: 36.9230769231vw;
    height: 12.5641025641vw;
    border-radius: 6.9230769231vw;
  }
}

.more-btn img {
  width: 80px;
}

@media screen and (max-width:1024px) {
  .more-btn img {
    width: 20.5128205128vw;
  }
}

.more-btn .ico-arrow-down {
  margin-left: 10px;
}

.sect-trivia {
  position: relative;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  padding-bottom: 1px;
  z-index: 2;
  margin-top: -1px;
}

.trivia {
  position: relative;
  z-index: 1;
  padding-top: 34px;
  padding-bottom: 60px;
}

@media screen and (max-width:1024px) {
  .trivia {
    padding-top: 6.4102564103vw;
    padding-bottom: 4.6153846154vw;
  }
}

.trivia:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-position: top center;
  background-repeat: repeat-y;
  background-image: url(../images/bg_03_center.png);
  pointer-events: none;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

@media screen and (min-width: 1280px) {
  .trivia:before {
    background-size: 100% auto;
  }
}

@media screen and (max-width:1024px) {
  .trivia:before {
    background-size: 100% auto;
    bottom: 0;
  }
}

.trivia .trivia-box {
  position: relative;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}

.trivia .trivia-box__txt {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  font-weight: bold;
  font-size: 34px;
  line-height: 1.3512723018;
  letter-spacing: 0.05em;
  padding-top: 1em;
  color: #171c61;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media screen and (max-width:767px) {
  .trivia .trivia-box__txt {
    font-size: 4.6153846154vw;
    padding-top: 0;
  }
}

@media screen and (max-width:374px) {
  .trivia .trivia-box__txt {
    font-size: 4.358974359vw;
  }
}

.trivia .trivia-box__txt p {
  width: 55%;
}

.trivia-box-btn {
  position: relative;
  margin-top: 64px;
  margin-bottom: -199px;
  z-index: 99;
}

@media screen and (max-width:767px) {
  .trivia-box-btn {
    margin-top: 20px;
    margin-bottom: -160px;
  }
}

.trivia-box-btn h3 {
  text-align: center;
  margin-bottom: 17px;
}

@media screen and (max-width:767px) {
  .trivia-box-btn h3 {
    margin-bottom: 4.358974359vw;
  }
}

.trivia-box-btn h3 img {
  width: 366px;
}

@media screen and (max-width:767px) {
  .trivia-box-btn h3 img {
    width: 65.1282051282vw;
  }
}

.trivia-box-btn .c-btn {
  width: 290px;
  max-width: 290px;
}

@media screen and (max-width:767px) {
  .trivia-box-btn .c-btn {
    width: 74.358974359vw;
    max-width: 74.358974359vw;
  }
}

.trivia-box-btn .c-btn span {
  height: 88px;
}

@media screen and (max-width:767px) {
  .trivia-box-btn .c-btn span {
    height: 22.5641025641vw;
    border-radius: 11.2820512821vw;
  }
}

.trivia-box-btn .c-btn span img {
  width: 192px;
}

@media screen and (max-width:767px) {
  .trivia-box-btn .c-btn span img {
    width: 49.2307692308vw;
  }
}

.trivia-box-btn .c-btn span .ico-social-twitter {
  margin-left: 5px;
}

.trivia-box-tab {
  display: none;
}

.trivia-box-tab.is-active {
  display: block;
}

.trivia-btn {
  position: relative;
  height: 235px;
}

@media screen and (max-width:767px) {
  .trivia-btn {
    height: 47.6923076923vw;
  }
}

.trivia-btn:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: -1px;
  background-position: bottom center;
  background-repeat: no-repeat;
  background-image: url(../images/bg_03_bottom.png);
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .trivia-btn:after {
    background-size: 100% 100%;
  }
}

@media screen and (max-width:767px) {
  .trivia-btn:after {
    background-image: url(../images/bg_03_bottom_sp.png);
    background-size: 100% 100%;
  }
}

.trivia-btn>* {
  position: relative;
  z-index: 1;
}

.trivia-btn h3 {
  text-align: center;
  margin-bottom: 17px;
}

@media screen and (max-width:767px) {
  .trivia-btn h3 {
    margin-bottom: 4.358974359vw;
  }
}

.trivia-btn h3 img {
  width: 366px;
}

@media screen and (max-width:767px) {
  .trivia-btn h3 img {
    width: 65.1282051282vw;
  }
}

.trivia-btn .c-btn {
  width: 290px;
  max-width: 290px;
}

@media screen and (max-width:767px) {
  .trivia-btn .c-btn {
    width: 74.358974359vw;
    max-width: 74.358974359vw;
  }
}

.trivia-btn .c-btn span {
  height: 88px;
}

@media screen and (max-width:767px) {
  .trivia-btn .c-btn span {
    height: 22.5641025641vw;
    border-radius: 11.2820512821vw;
  }
}

.trivia-btn .c-btn span img {
  width: 192px;
}

@media screen and (max-width:767px) {
  .trivia-btn .c-btn span img {
    width: 49.2307692308vw;
  }
}

.trivia-btn .c-btn span .ico-social-twitter {
  margin-left: 5px;
}

.sect-backhome {
  padding-top: 96px;
  padding-bottom: 178px;
  position: relative;
  z-index: 1;
}

@media screen and (max-width:1024px) {
  .sect-backhome {
    padding-top: 17.9487179487vw;
    padding-bottom: 28.2051282051vw;
  }
}

.btn-backhome {
  text-align: center;
  position: relative;
  width: 144px;
  margin: 0 auto;
}

@media screen and (max-width:1024px) {
  .btn-backhome {
    width: 36.9230769231vw;
  }
}

.btn-backhome__txt {
  position: absolute;
  bottom: 100%;
  right: -30px;
  width: 199px;
  right: -29px;
  margin-bottom: -6px;
}

@media screen and (max-width:1024px) {
  .btn-backhome__txt {
    right: -7.6923076923vw;
    width: 51.0256410256vw;
    right: -7.4358974359vw;
    margin-bottom: -0.5128205128vw;
  }
}

.btn-backhome__txt img {
  width: 100%;
}

.btn-backhome__link {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 144px;
  height: 49px;
  border-radius: 27px;
  margin: 0 auto;
  padding: 0 15px 0 12px;
  position: relative;
  -webkit-box-shadow: 0 5px 0px #6168c0;
  box-shadow: 0 5px 0px #6168c0;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .btn-backhome__link:hover {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
  }
}

@media screen and (max-width:1024px) {
  .btn-backhome__link {
    border-radius: 60px;
    width: 36.9230769231vw;
    height: 12.5641025641vw;
    border-radius: 6.9230769231vw;
  }
}

.btn-backhome__link .ico-line {
  margin-right: 6px;
}

.btn-backhome__link img {
  width: 80px;
}

@media screen and (max-width:1024px) {
  .btn-backhome__link img {
    width: 20.5128205128vw;
  }
}

@-webkit-keyframes slide-fwd-center {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    -webkit-transform: translateZ(160px);
    transform: translateZ(160px);
  }
}

@keyframes slide-fwd-center {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    -webkit-transform: translateZ(160px);
    transform: translateZ(160px);
  }
}

@-webkit-keyframes scale-in-bl {
  0% {
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0;
  }

  10% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes scale-in-bl {
  0% {
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0;
  }

  10% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes scale-heart-breath {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }

  50% {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
    opacity: 1;
  }

  60% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }

  80% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 1;
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes scale-heart-breath {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }

  50% {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
    opacity: 1;
  }

  60% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }

  80% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 1;
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes shake-br {

  0%,
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }

  10%,
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }

  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }

  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }

  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@keyframes shake-br {

  0%,
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }

  10%,
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }

  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }

  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }

  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@-webkit-keyframes shake-bl {

  0%,
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
  }

  10%,
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }

  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }

  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }

  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@keyframes shake-bl {

  0%,
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
  }

  10%,
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }

  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }

  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }

  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@-webkit-keyframes stampAnimation {
  0% {
    -webkit-transform: scale(10);
    transform: scale(10);
    opacity: 0.2;
  }

  85% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.9;
  }

  92% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 1;
  }

  96% {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes stampAnimation {
  0% {
    -webkit-transform: scale(10);
    transform: scale(10);
    opacity: 0.2;
  }

  85% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.9;
  }

  92% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 1;
  }

  96% {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

body.is-body-loading .page-results {
  display: none;
}

body.is-body-loading * {
  -webkit-transition: none !important;
  transition: none !important;
}

body.is-body-loaded .page-results-loading {
  display: none;
}

body.is-body-loaded .page-results {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.page-results-loading {
  min-height: 100vh;
}

.page-results-loading .sect-results-question {
  height: 100%;
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.page-results-loading .sect-results-question .results-question__cont {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

@media screen and (min-width: 0px) {
  .page-results-loading .sect-results-question .results-question__cont {
    padding-bottom: 0;
  }
}

@media screen and (max-width:767px) {
  .page-results .l-main::before {
    background-position: right top;
  }
}

.page-results .topic-btn-02.have_btn_login {
  margin-bottom: 0;
}

.sect-results-question .results-question__top {
  position: relative;
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top {
    padding-bottom: 28.4615384615vw;
  }
}

@media screen and (max-width:1024px) {
  .sect-results-question .results-question__top .l-inner {
    padding-left: 0;
    padding-right: 0;
  }
}

.sect-results-question .results-question__top::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: -1px;
  background: url(../images/bg_results_02_top.png) no-repeat bottom center;
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .sect-results-question .results-question__top::after {
    background-size: 100% auto;
  }
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top::after {
    background-size: 100% auto;
  }
}

.sect-results-question .results-question__top>.l-inner {
  position: relative;
  z-index: 1;
}

.sect-results-question .results-question__top .question-ttl {
  height: 420px;
  padding-top: 44px;
  background-image: url(../images/bg_result_deco.png);
  background-position: bottom center;
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top .question-ttl {
    height: 112.8205128205vw;
    padding-top: 12.3076923077vw;
    padding-left: 20px;
    padding-right: 20px;
    margin-left: 0;
    margin-right: 0;
    background-image: url(../images/bg_result_deco_sp.png);
    background-size: 100% auto;
  }
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top .question-ttl .number {
    width: 27.1794871795vw;
    height: 27.1794871795vw;
    padding: 4.358974359vw;
  }

  .sect-results-question .results-question__top .question-ttl .number img {
    width: 100%;
  }
}

.sect-results-question .results-question__top .question-ttl h2 {
  margin-top: 12px;
  margin-bottom: 40px;
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top .question-ttl h2 {
    font-size: 6.1538461538vw;
    line-height: 1.5;
    margin-top: 5.641025641vw;
    margin-bottom: 10.2564102564vw;
  }
}

.sect-results-question .results-question__top .question-ttl .comment-lead__txt02 span {
  font-size: 24px;
  font-weight: 900;
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top .question-ttl .comment-lead__txt02 span {
    font-size: 5.1282051282vw;
  }
}

@media screen and (max-width:1024px) {
  .sect-results-question .results-question__top .question-ttl .comment-lead__txt02 {
    font-size: 24px;
  }
}

@media screen and (max-width:767px) {
  .sect-results-question .results-question__top .question-ttl .comment-lead__txt02 {
    font-size: 5.1282051282vw;
  }

  .sect-results-question .results-question__top .question-ttl .comment-lead__txt02 .text-or {
    display: block;
  }
}

.sect-results-question .results-question__cont {
  position: relative;
  padding-top: 28px;
  padding-bottom: 100px;
  text-align: center;
  background: url(../images/bg_02_center.png) repeat-y top center;
}

@media screen and (min-width: 1280px) {
  .sect-results-question .results-question__cont {
    background-size: 100% auto;
  }
}

@media screen and (max-width:1024px) {
  .sect-results-question .results-question__cont {
    background-size: 100% auto;
    padding-top: 4.358974359vw;
    padding-bottom: 23.0769230769vw;
  }
}

.sect-results-question .results-question__cont::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(254, 183, 141, 0.6)), color-stop(62%, rgba(254, 183, 141, 0)), to(rgba(254, 183, 141, 0)));
  background: linear-gradient(to top, rgba(254, 183, 141, 0.6) 0%, rgba(254, 183, 141, 0) 62%, rgba(254, 183, 141, 0) 100%);
}

.sect-results-question .results-question__cont>* {
  position: relative;
  z-index: 1;
}

.chart-ttl--drrr {
  margin-top: -126px;
}

@media screen and (max-width:767px) {
  .chart-ttl--drrr {
    margin-top: -78px;
  }
}

.chart-ttl--drrr img {
  width: 486px;
  height: auto;
}

@media screen and (max-width:767px) {
  .chart-ttl--baan {
    margin-left: -4vw;
    margin-bottom: 55px;
  }
}

.chart-ttl--baan img.baan-txt1 {
  width: 273px;
  height: auto;
}

@media screen and (max-width:767px) {
  .chart-ttl--baan img.baan-txt1 {
    width: 206px;
  }
}

.chart-ttl--baan img.baan-txt2 {
  width: 74px;
  height: auto;
}

@media screen and (max-width:767px) {
  .chart-ttl--baan img.baan-txt2 {
    width: 56px;
  }
}

.chart-ttl--baan.is-animate {
  opacity: 0;
}

.chart-ttl--baan.is-animated {
  opacity: 1;
}

.chart-ttl--baan.is-animated img.baan-txt1 {
  -webkit-animation: 0.45s ease-out 0s 1 normal both running scale-heart-breath;
  animation: 0.45s ease-out 0s 1 normal both running scale-heart-breath;
  -webkit-animation-delay: 0;
  animation-delay: 0;
}

.chart-ttl--baan.is-animated img.baan-txt2 {
  -webkit-animation: 0.45s ease-out 0s 1 normal both running scale-heart-breath;
  animation: 0.45s ease-out 0s 1 normal both running scale-heart-breath;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

.chart-cont {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media screen and (max-width:1024px) {
  .chart-cont {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

.chart-cont__pie {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  width: 440px;
}

@media screen and (max-width:1024px) {
  .chart-cont__pie {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
  }
}

@media screen and (max-width:767px) {
  .chart-cont__pie {
    margin-bottom: 7.6923076923vw;
  }
}

.chart-cont__pie .chart-pie {
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.chart-cont__pie.is-animate {
  opacity: 0;
}

.chart-cont__pie.is-animated {
  opacity: 1;
}

.chart-cont__item {
  width: calc(50% - 220px);
  padding-bottom: 20px;
}

@media screen and (max-width:1024px) {
  .chart-cont__item {
    width: calc(50% - 2.5641025641vw);
    padding-bottom: 0;
  }
}

.chart-cont__item.item-yellow {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

@media screen and (max-width:1024px) {
  .chart-cont__item.item-yellow {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin-bottom: 0;
    margin-right: 2.5641025641vw;
  }
}

.chart-cont__item.item-pink {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
  padding-left: 20px;
}

@media screen and (min-width:768px) and (max-width: 1100px) {
  .chart-cont__item.item-pink {
    padding-left: 0;
  }
}

@media screen and (max-width:1024px) {
  .chart-cont__item.item-pink {
    margin-left: 2.5641025641vw;
    padding-left: 0;
  }
}

.chart-cont__item.is-animate {
  opacity: 0;
}

.chart-cont__item.is-animated {
  opacity: 1;
  -webkit-animation: 5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s 1 normal both running scale-in-bl;
  animation: 5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s 1 normal both running scale-in-bl;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

.chart-cont #chartdiv {
  padding: 0;
  margin-left: auto;
  margin-right: auto;
  pointer-events: none;
}

.chart-cont #chartdiv>div {
  margin-left: auto;
  margin-right: auto;
}

.chart-cont .chart-pie {
  position: relative;
}

.chart-cont .chart-pie__txt {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding-left: 23%;
  padding-right: 23%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-weight: 900;
  color: #171c61;
  font-size: 22px;
  letter-spacing: 0.09em;
  line-height: 1.15;
}

@media screen and (max-width: 640px) {
  .chart-cont .chart-pie__txt {
    font-size: 4.1025641026vw;
  }
}

.chart-cont .chart-pie__txt span {
  display: block;
  line-height: 1.15;
  font-weight: 900;
  font-size: 22px;
}

@media screen and (max-width: 640px) {
  .chart-cont .chart-pie__txt span {
    font-size: 4.1025641026vw;
  }
}

.chart-cont .chart-pie__txt strong {
  display: inline-block;
  font-size: 128%;
  color: #171c61;
  padding-bottom: 0.05em;
  margin: 0.35em 0;
  font-weight: 900;
}

@media screen and (max-width: 640px) {
  .chart-cont .chart-pie__txt strong {
    font-size: 6.6205128205vw;
    letter-spacing: 0;
  }
}

.chart-cont .chart-pie__txt strong.choice-b-label {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ff79e3), color-stop(46%, #ff79e3), color-stop(46%, transparent), to(transparent));
  background: linear-gradient(to top, #ff79e3 0, #ff79e3 46%, transparent 46%, transparent 100%);
}

.chart-cont .chart-pie__txt strong.choice-a-label {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fffe01), color-stop(55%, #fffe01), color-stop(55%, transparent), to(transparent));
  background: linear-gradient(to top, #fffe01 0, #fffe01 55%, transparent 55%, transparent 100%);
}

.chart-cont .chart-pie__txt .text02--result {
  background: none;
}

.chart-cont .chart-percent {
  line-height: 1;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.chart-cont .chart-percent .chart-percent__lbl span {
  background-color: #171c61;
  display: inline-block;
  font-weight: bold;
  color: #fff;
  padding: 0.15em 0.5em 0.25em;
}

.chart-cont .chart-percent .chart-percent__lbl span:empty {
  display: none;
}

.chart-cont .chart-percent--yellow {
  background: url(../images/chart_deco_yellow.svg) no-repeat center/100% 100%;
  color: #171c61;
  margin-left: auto;
  margin-right: 45px;
}

@media screen and (min-width:768px) and (max-width: 1100px) {
  .chart-cont .chart-percent--yellow {
    margin-right: 25px;
  }
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent--yellow {
    margin-right: 0;
  }
}

.chart-cont .chart-percent--yellow .chart-percent__lbl {
  position: absolute;
  bottom: 97%;
  left: -37px;
  right: 41px;
  -webkit-transform-origin: 100% 50%;
  transform-origin: 100% 50%;
  -webkit-transform: rotate(-15.14deg);
  transform: rotate(-15.14deg);
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent--yellow .chart-percent__lbl {
    left: -14.820513vw;
    right: -2.8205128205vw;
  }
}

.chart-cont .chart-percent--yellow .chart-percent__lbl span {
  font-size: 26.28px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent--yellow .chart-percent__lbl span {
    font-size: 4.358974359vw;
  }
}

.chart-cont .chart-percent--yellow .chart-percent__num strong {
  text-shadow: 0 0.063em #eed700;
  color: #171c61 !important;
}

.chart-cont .chart-percent--pink {
  background: url(../images/chart_deco_pink.svg) no-repeat center/100% 100%;
  color: #fff;
  margin-left: 30px;
  margin-top: 30px;
}

@media screen and (min-width:768px) and (max-width: 1100px) {
  .chart-cont .chart-percent--pink {
    margin-top: 20px;
    margin-left: 10px;
  }
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent--pink {
    margin-right: 0;
    margin-top: 0;
    margin-left: 0;
  }
}

.chart-cont .chart-percent--pink .chart-percent__lbl {
  position: absolute;
  bottom: 94%;
  right: -24px;
  left: 73px;
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transform: rotate(19.51deg);
  transform: rotate(19.51deg);
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent--pink .chart-percent__lbl {
    right: -5.974359vw;
    left: 5.974359vw;
  }
}

.chart-cont .chart-percent--pink .chart-percent__lbl span {
  font-size: 21.45px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent--pink .chart-percent__lbl span {
    font-size: 4.6564102564vw;
  }
}

.chart-cont .chart-percent--pink .chart-percent__num strong {
  text-shadow: 0 0.063em #d100a5;
  color: #fff !important;
}

.chart-cont .chart-percent.is-smaller {
  width: 190px;
  height: 190px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-smaller {
    width: 33.3333333333vw;
    height: 33.3333333333vw;
  }
}

.chart-cont .chart-percent.is-smaller .chart-percent__num strong {
  font-size: 75.26px;
  padding-right: 0.1em;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-smaller .chart-percent__num strong {
    font-size: 13.2205128205vw;
  }
}

.chart-cont .chart-percent.is-smaller .chart-percent__num small {
  font-size: 35px;
  margin-top: 6px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-smaller .chart-percent__num small {
    margin-top: 1.5384615385vw;
    font-size: 6.1538461538vw;
  }
}

.chart-cont .chart-percent.is-smaller.chart-percent--pink .chart-percent__lbl {
  position: absolute;
  bottom: 100%;
  right: -41px;
  left: 27px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-smaller.chart-percent--pink .chart-percent__lbl {
    left: 5.974359vw;
    width: 32.8205128205vw;
    -webkit-transform: rotate(15.14deg);
    transform: rotate(15.14deg);
  }
}

.chart-cont .chart-percent.is-bigger {
  width: 253px;
  height: 253px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-bigger {
    width: 42.8205128205vw;
    height: 42.8205128205vw;
  }
}

.chart-cont .chart-percent.is-bigger .chart-percent__num strong {
  font-size: 115.62px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-bigger .chart-percent__num strong {
    font-size: 18.5974358974vw;
  }
}

.chart-cont .chart-percent.is-bigger .chart-percent__num small {
  font-size: 59.6px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-bigger .chart-percent__num small {
    font-size: 6.3615384615vw;
  }
}

@media print,
screen and (min-width:768px) {
  .chart-cont .chart-percent.is-bigger .chart-percent__lbl {
    bottom: 97%;
    right: -46px;
  }
}

.chart-cont .chart-percent.is-bigger .chart-percent__lbl span {
  font-size: 26.28px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-bigger .chart-percent__lbl span {
    font-size: 5.5vw;
  }
}

@media print,
screen and (min-width:768px) {
  .chart-cont .chart-percent.is-bigger.chart-percent--yellow .chart-percent__lbl {
    left: -49px;
    right: 0;
  }
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-bigger.chart-percent--pink .chart-percent__lbl {
    left: 8.974359vw;
    right: -5vw;
  }
}

.chart-cont .chart-percent.is-equal {
  width: 224px;
  height: 224px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-equal {
    width: 37.1794871795vw;
    height: 37.1794871795vw;
  }
}

.chart-cont .chart-percent.is-equal .chart-percent__lbl span {
  font-size: 24px;
  font-weight: bold;
  line-height: 1;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-equal .chart-percent__lbl span {
    font-size: 4.5076923077vw;
  }
}

.chart-cont .chart-percent.is-equal .chart-percent__num strong {
  font-size: 112px;
  color: inherit;
  color: #171c61;
  line-height: 1;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-equal .chart-percent__num strong {
    font-size: 15.8974358974vw;
  }
}

.chart-cont .chart-percent.is-equal .chart-percent__num small {
  font-size: 40.6px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-equal .chart-percent__num small {
    font-size: 6.3615384615vw;
  }
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent.is-equal.chart-percent--pink .chart-percent__lbl {
    -webkit-transform: rotate(15.14deg);
    transform: rotate(15.14deg);
  }
}

.chart-cont .chart-percent__lbl {
  display: inline-block;
}

.chart-cont .chart-percent__num {
  font-family: "Inter", sans-serif;
  padding-top: 34px;
}

@media screen and (max-width:767px) {
  .chart-cont .chart-percent__num {
    padding-top: 7.1794871795vw;
  }
}

.chart-cont .chart-percent__num strong {
  font-weight: 900;
  display: block;
  line-height: 1 !important;
}

.chart-cont .chart-percent__num small {
  font-weight: bold;
  letter-spacing: 0.03em;
  display: block;
  line-height: 1 !important;
}

.sect-results-null {
  line-height: 1.7;
  font-size: 24px;
  font-weight: bold;
  margin-top: 12px;
  text-align: center;
  color: #171c61;
  padding-top: 50px;
  padding-bottom: 50px;
}

.results-comment-ttl {
  text-align: center;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media screen and (max-width:1024px) {
  .results-comment-ttl img {
    width: 53.3333333333vw;
  }
}

.results-comment-lead {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 53px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    padding-top: 32px;
  }
}

.results-comment-lead__item {
  width: 405px;
  margin: 0 20px;
  position: relative;
  -webkit-transform: scale(3);
  transform: scale(3);
  opacity: 0;
  -webkit-transform-origin: 60% 70%;
  transform-origin: 60% 70%;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__item {
    width: 76.9230769231vw;
    margin: 0;
  }

  .results-comment-lead__item:nth-child(2) {
    margin-left: auto;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
  }

  .results-comment-lead__item:nth-child(1) {
    margin-right: auto;
  }
}

@media screen and (max-width:1024px) {
  .results-comment-lead__item.lead-item-a {
    margin-top: 5.1282051282vw;
  }
}

.results-comment-lead__item.lead-item-a .results-comment-lead__badge {
  width: 284px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__item.lead-item-a .results-comment-lead__badge {
    width: 49.4871794872vw;
  }
}

.results-comment-lead__item.lead-item-a .results-comment-lead__badge::before {
  background-image: url(../images/results_comment_badge_yellow_bg.svg);
}

.results-comment-lead__item.lead-item-a .results-comment-lead__badge>img {
  right: -5px;
  margin-bottom: -48px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__item.lead-item-a .results-comment-lead__badge>img {
    right: -1.2820512821vw;
    margin-bottom: -8.9743589744vw;
  }
}

.results-comment-lead__item.lead-item-a .results-comment-lead__badge-ttl span {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fffe01), color-stop(46%, #fffe01), color-stop(46%, transparent), to(transparent));
  background: linear-gradient(to top, #fffe01 0, #fffe01 46%, transparent 46%, transparent 100%);
}

.results-comment-lead__item.lead-item-a.is-animated {
  -webkit-animation: stampAnimation 350ms forwards;
  animation: stampAnimation 350ms forwards;
}

.results-comment-lead__item.lead-item-b {
  -webkit-transform-origin: 70% 60%;
  transform-origin: 70% 60%;
}

.results-comment-lead__item.lead-item-b .results-comment-lead__badge {
  width: 288px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__item.lead-item-b .results-comment-lead__badge {
    width: 53.3333333333vw;
  }
}

.results-comment-lead__item.lead-item-b .results-comment-lead__badge::before {
  background-image: url(../images/results_comment_badge_pink_bg.svg);
}

.results-comment-lead__item.lead-item-b .results-comment-lead__badge>img {
  right: -13px;
  margin-bottom: -48px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__item.lead-item-b .results-comment-lead__badge>img {
    right: -3.3333333333vw;
    margin-bottom: -8.9743589744vw;
  }
}

.results-comment-lead__item.lead-item-b .results-comment-lead__badge-ttl span {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ff79e3), color-stop(46%, #ff79e3), color-stop(46%, transparent), to(transparent));
  background: linear-gradient(to top, #ff79e3 0, #ff79e3 46%, transparent 46%, transparent 100%);
}

.results-comment-lead__item.lead-item-b.is-animated {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-animation: stampAnimation 350ms 300ms forwards;
  animation: stampAnimation 350ms 300ms forwards;
}

.results-comment-lead__badge {
  text-align: center;
  margin: 0 auto -60px;
  position: relative;
  height: 68px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__badge {
    margin-bottom: -10.2564102564vw;
    height: 12.0512820513vw;
  }
}

.results-comment-lead__badge>img {
  width: 88px;
  height: 100px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  display: block;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__badge>img {
    width: 15.641025641vw;
    height: 17.6923076923vw;
  }
}

.results-comment-lead__badge::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.results-comment-lead__badge-ttl {
  display: inline-block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 16px;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 2;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__badge-ttl {
    bottom: 4.1025641026vw;
  }
}

.results-comment-lead__badge-ttl span {
  font-weight: bold;
  font-size: 21.81px;
  font-weight: 900;
  letter-spacing: 0.09em;
  color: #000;
  padding: 0 0.1em;
  display: inline-block;
  text-shadow: 0.035em 0.035em 0 #fff, 0.035em -0.035em 0 #fff, -0.035em 0.035em 0 #fff, -0.035em -0.035em 0 #fff, 0.035em 0px 0 #fff, 0px 0.035em 0 #fff, -0.035em 0px 0 #fff, 0px -0.035em 0 #fff;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__badge-ttl span {
    font-size: 3.8435897436vw;
  }
}

.results-comment-lead__body {
  background-image: url(../images/fuki_bg.svg);
  width: 405px;
  height: 251px;
  background-size: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 30px;
  font-weight: bold;
  line-height: 1.4;
  color: #171c61;
}

.results-comment-lead__body p {
  padding: 0 30px;
  word-break: break-word;
  font-weight: bold;
  font-size: 30px;
}

@media screen and (max-width:1024px) {
  .results-comment-lead__body p {
    font-size: 5.6974358974vw;
  }
}

.results-comment-lead__body.comment-b,
.results-comment-lead__body.comment-B {
  background-image: url(../images/fuki_bg_02.svg);
}

@media screen and (max-width:1024px) {
  .results-comment-lead__body {
    width: 76.9230769231vw;
    height: 46.9230769231vw;
    font-size: 5.6974358974vw;
  }
}

.comment02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 60px;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media print,
screen and (min-width:1025px) {
  .comment02 {
    margin-bottom: 40px;
  }
}

@media screen and (max-width:1024px) {
  .comment02 {
    padding-top: 2.5641025641vw;
    padding-bottom: 0;
    margin-left: -20px;
    margin-right: -20px;
  }
}

.comment02__group {
  width: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media screen and (min-width:1025px) and (max-width: 1160px) {
  .comment02__group .comment02__cell {
    max-width: 33.33%;
  }
}

.comment02__cell {
  margin-bottom: 15px;
  display: none;
}

@media screen and (max-width:1024px) {
  .comment02__cell {
    margin-bottom: 1.2820512821vw;
  }
}

.comment02 .comment-item {
  -webkit-animation: floatX 6s ease-in-out infinite;
  animation: floatX 6s ease-in-out infinite;
  color: #171c61;
}

@media print,
screen and (min-width:1025px) {
  .comment02 .group-a {
    padding-right: 10px;
  }
}

@media screen and (max-width:1024px) {
  .comment02 .group-a {
    padding-top: 12.8205128205vw;
  }
}

@media print,
screen and (min-width:1025px) {
  .comment02 .group-a .comment02__cell:nth-child(3n+2) {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }

  .comment02 .group-a .comment02__cell:nth-child(3n+3) {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }
}

@media screen and (max-width:1024px) {
  .comment02 .group-a .comment02__cell {
    margin-left: auto;
  }
}

@media print,
screen and (min-width:1025px) {
  .comment02 .group-b {
    padding-left: 30px;
  }
}

@media screen and (max-width:1024px) {
  .comment02 .group-b {
    padding-left: 15px;
  }
}

.comment02 .group-b .comment-item.comment-b {
  margin-left: 0;
}

@media print,
screen and (min-width:1025px) {
  .comment02 .group-b .comment02__cell:nth-child(3n+2) {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
}

.comment02__more {
  margin-top: 100px;
}

@media screen and (max-width:767px) {
  .comment02__more {
    margin-top: 0px;
  }
}

.results-comment-btn__link {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 203px;
  height: 49px;
  border-radius: 27px;
  margin: 0 auto;
  padding: 0 15px 0 12px;
  position: relative;
  -webkit-box-shadow: 0 5px 0px #6168c0;
  box-shadow: 0 5px 0px #6168c0;
  cursor: pointer;
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .results-comment-btn__link:hover {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
    box-shadow: 0 5px 0px rgba(97, 103, 192, 0);
  }
}

@media screen and (max-width:1024px) {
  .results-comment-btn__link {
    border-radius: 60px;
    width: 36.9230769231vw;
    height: 12.5641025641vw;
    border-radius: 6.9230769231vw;
  }
}

.results-comment-btn__link .ico-line {
  margin-right: 6px;
}

.results-comment-btn__link img {
  width: 144px;
}

@media screen and (max-width:1024px) {
  .results-comment-btn__link img {
    width: 36.9230769231vw;
  }
}

.sect-results-trivia {
  position: relative;
  margin-top: 215px;
  padding-bottom: 140px;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia {
    margin-top: 30.2564102564vw;
    padding-bottom: 37.1794871795vw;
  }
}

.sect-results-trivia::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: -300px;
  background-position: top center;
  background-repeat: repeat-y;
  background-image: url(../images/bg_03_center.png);
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .sect-results-trivia::before {
    background-size: 100% auto;
  }
}

@media screen and (max-width:1024px) {
  .sect-results-trivia::before {
    background-size: 100% auto;
  }
}

.sect-results-trivia::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  height: 190px;
  margin-bottom: -2px;
  background-position: bottom center;
  background-repeat: no-repeat;
  background-image: url(../images/bg_03_top.png);
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .sect-results-trivia::after {
    background-size: 100% 190px;
  }
}

@media screen and (max-width:1024px) {
  .sect-results-trivia::after {
    height: 15.3846153846vw;
    background-size: 100% auto;
  }
}

.sect-results-trivia .trivia {
  padding-top: 47px;
  padding-bottom: 25px;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia {
    padding-top: 12.0512820513vw;
    padding-bottom: 4.6153846154vw;
  }
}

.sect-results-trivia .trivia::before {
  display: none;
}

.sect-results-trivia .trivia .trivia-box__txt {
  text-align: center;
  padding-top: 0;
  padding-bottom: 0.75em;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia .trivia-box__txt {
    padding-bottom: 0;
  }
}

.sect-results-trivia .trivia .trivia-box__txt p {
  width: 65%;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia .trivia-box__txt p {
    width: 70%;
  }
}

.sect-results-trivia .trivia-btn {
  height: auto;
  margin-bottom: 70px;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia-btn {
    margin-bottom: 15.3846153846vw;
  }
}

.sect-results-trivia .trivia-btn::after {
  display: none;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia-btn h3 {
    margin-bottom: 2.5641025641vw;
  }
}

.sect-results-trivia .trivia-btn h3 img {
  width: 296px;
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia-btn h3 img {
    width: 53.3333333333vw;
  }
}

@media screen and (max-width:1024px) {
  .sect-results-trivia .trivia-btn .c-btn img {
    width: 56.6666666667vw;
  }
}

.trivia-pager {
  position: relative;
  line-height: 1;
}

.trivia-pager::after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.trivia-pager::before {
  content: "";
  display: block;
  width: 1px;
  height: 24px;
  background-color: #171c61;
  position: absolute;
  top: 0;
  left: 50%;
}

@media screen and (max-width:1024px) {
  .trivia-pager::before {
    height: 6.1538461538vw;
  }
}

.trivia-pager__item {
  width: 50%;
  display: inline-block;
}

.trivia-pager__link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

.trivia-pager__ico {
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.trivia-pager__ico.ico-arrow-left {
  margin-right: 10px;
}

.trivia-pager__ico.ico-arrow-right {
  margin-left: 10px;
}

@media screen and (max-width:1024px) {
  .trivia-pager__txt img {
    height: 4.6153846154vw;
    width: auto;
  }
}

.trivia-pager .item-prev {
  float: left;
}

.trivia-pager .item-prev .trivia-pager__link {
  float: right;
  margin-right: 36px;
}

@media screen and (max-width:1024px) {
  .trivia-pager .item-prev .trivia-pager__link {
    margin-right: 4.6153846154vw;
  }
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .trivia-pager .item-prev .trivia-pager__link:hover .ico-arrow-left {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
}

.trivia-pager .item-next {
  float: right;
}

.trivia-pager .item-next .trivia-pager__link {
  float: left;
  margin-left: 36px;
}

@media screen and (max-width:1024px) {
  .trivia-pager .item-next .trivia-pager__link {
    margin-left: 4.6153846154vw;
  }
}

@media print,
screen and (min-width:768px) {
  .is-view-pc .trivia-pager .item-next .trivia-pager__link:hover .ico-arrow-right {
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
  }
}

.page-results .sect-topic {
  padding-bottom: 0;
}

@media screen and (max-width:1024px) {
  .page-results .sect-topic {
    padding-bottom: 12.8205128205vw;
  }
}

.page-results .sect-topic .topic__balloon {
  text-align: center;
  position: absolute;
  left: 50%;
  top: -60px;
  margin-left: -100px;
}

@media screen and (max-width:1024px) {
  .page-results .sect-topic .topic__balloon {
    top: -26.9230769231vw;
    margin-left: -33.8461538462vw;
  }

  .page-results .sect-topic .topic__balloon img {
    width: 65.3846153846vw;
  }
}

.page-results .sect-topic .topic-btn {
  margin-bottom: 0;
}

@media print,
screen and (min-width:1025px) {
  .page-results .sect-topic .topic-btn .c-btn {
    width: 263px;
    height: 94px;
  }

  .page-results .sect-topic .topic-btn .c-btn span {
    height: 88px;
  }
}

.page-results .sect-backhome {
  position: relative;
  padding-top: 225px;
  padding-bottom: 48px;
}

@media screen and (max-width:1024px) {
  .page-results .sect-backhome {
    padding-top: 23.0769230769vw;
    padding-bottom: 12.3076923077vw;
  }
}

.page-results .sect-backhome::before {
  content: "";
  display: block;
  position: absolute;
  top: -1px;
  height: 190px;
  left: 0;
  right: 0;
  background: url(../images/bg_01_bottom.png) no-repeat top center;
  pointer-events: none;
}

@media screen and (min-width: 1280px) {
  .page-results .sect-backhome::before {
    background-size: 100% 100%;
  }
}

@media screen and (max-width:1024px) {
  .page-results .sect-backhome::before {
    height: 15.3846153846vw;
    background-size: 100% auto;
  }
}

.page-results .topic-subttl {
  padding-bottom: 150px;
  margin-bottom: 0;
}

@media screen and (max-width:767px) {
  .page-results .topic-subttl {
    padding-bottom: 0;
  }
}

/*# sourceMappingURL=style.css.map */