@import url("//fonts.googleapis.com/css2?family=Barlow:wght@200;400&family=Gilda+Display&family=Noto+Sans+JP:wght@100..900&family=Shippori+Mincho:wght@400;500&display=swap");
/*
font-family: $font-gothic;
300 400 500 700
*/
/*
font-family: $font-min;
300 400 500 600 700
*/
/*
.gilda-display-regular {
  font-family: "Gilda Display", serif;
  font-weight: 400;
  font-style: normal;
}
*/
/*
font-family: "Barlow", sans-serif;
  font-weight: 200;
  font-style: normal;
*/
/*@include font-gothic();*/
/*@include font-min();*/
/*@include font-en();*/
/*
$c_primary:#1C4B96;
*/
/*@include incImg100();*/
/*@include incSmooth();*/
/*@include dropshadow;*/
/*@include boxshadow;*/
/*@include fs();*/
/*@include btm();*/
.contents {
  background: url("/assets/img/faq/bg.webp") center center no-repeat fixed;
  background-size: cover;
  padding: 80px 0 160px; }

section:last-child {
  margin-bottom: 0; }

.faqArea {
  padding: 0;
  margin: 0 auto;
  max-width: 1000px; }
  .faqArea dl {
    background: #FFF;
    border-radius: 16px;
    margin-top: 24px; }
    .faqArea dl dt {
      cursor: pointer;
      padding: 36px 15px 32px 100px;
      font-size: 18px;
      font-size: 1.8rem;
      line-height: 2;
      letter-spacing: 0.06em;
      position: relative;
      transition: 0.2s; }
      @media only screen and (max-width: 960px) {
        .faqArea dl dt {
          font-size: 15px;
          font-size: 1.5rem; } }
      .faqArea dl dt::before {
        color: #806b59;
        content: 'Q.';
        display: inline-block;
        font-family: "Gilda Display", serif;
        font-size: 36px;
        font-size: 3.6rem;
        line-height: 2;
        line-height: 1.8;
        line-height: 1;
        position: absolute;
        top: calc(50% - 18px);
        left: 45px; }
        @media only screen and (max-width: 960px) {
          .faqArea dl dt::before {
            font-size: 31px;
            font-size: 3.1rem; } }
      .faqArea dl dt::after {
        border-top: 1px solid #806b59;
        border-right: 1px solid #806b59;
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
        content: '';
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 40px;
        margin-top: -8px;
        width: 16px;
        height: 16px;
        transition: 0.2s; }
      .faqArea dl dt:hover {
        color: #806b59; }
    .faqArea dl dt.arrow::after {
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      border-color: #806b59; }
    .faqArea dl dd {
      padding: 36px 40px 32px 100px;
      font-size: 16px;
      font-size: 1.6rem;
      line-height: 2;
      position: relative; }
      @media only screen and (max-width: 960px) {
        .faqArea dl dd {
          font-size: 14px;
          font-size: 1.4rem; } }
      .faqArea dl dd::before {
        color: #806b59;
        content: 'A.';
        display: inline-block;
        font-family: "Gilda Display", serif;
        font-size: 36px;
        font-size: 3.6rem;
        line-height: 2;
        line-height: 1.8;
        line-height: 1;
        position: absolute;
        top: 36px;
        left: 45px; }
        @media only screen and (max-width: 960px) {
          .faqArea dl dd::before {
            font-size: 31px;
            font-size: 3.1rem; } }
      .faqArea dl dd::after {
        background: rgba(0, 0, 0, 0.2);
        content: '';
        display: block;
        line-height: 1;
        position: absolute;
        top: 0;
        left: 30px;
        height: 1px;
        width: calc(100% - 60px); }

/*  /////////////////////////////////////////////////
Responsive Start 
*/
@media only screen and (max-width: 960px) {
  .contents {
    padding: 48px 0 40px; }

  .faqArea {
    padding: 0;
    margin: 0; }
    .faqArea dl {
      border-radius: 8px;
      margin-top: 16px; }
      .faqArea dl dt {
        cursor: pointer;
        line-height: 1.6 !important;
        letter-spacing: 0;
        padding: 20px 42px 20px 50px;
        font-size: 14px;
        letter-spacing: 0; }
        .faqArea dl dt::before {
          content: 'Q.';
          display: inline-block;
          font-size: 28px;
          font-size: 2.8rem;
          line-height: 2;
          line-height: 1.8;
          line-height: 1;
          position: absolute;
          top: 20px;
          left: 16px; } }
        @media only screen and (max-width: 960px) and (max-width: 960px) {
          .faqArea dl dt::before {
            font-size: 24px;
            font-size: 2.4rem; } }
@media only screen and (max-width: 960px) {
        .faqArea dl dt::after {
          -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
          content: '';
          display: inline-block;
          position: absolute;
          top: 50%;
          right: 20px;
          margin-top: -4px;
          width: 10px;
          height: 10px;
          transition: 0.2s; }
        .faqArea dl dt:hover {
          opacity: 0.7; }
      .faqArea dl dd {
        padding: 20px 20px 28px 50px;
        font-size: 15px;
        font-size: 1.5rem;
        line-height: 2;
        line-height: 1.6 !important;
        position: relative; } }
      @media only screen and (max-width: 960px) and (max-width: 960px) {
        .faqArea dl dd {
          font-size: 13px;
          font-size: 1.3rem; } }
@media only screen and (max-width: 960px) {
        .faqArea dl dd::before {
          content: 'A.';
          display: inline-block;
          font-size: 28px;
          font-size: 2.8rem;
          line-height: 2;
          line-height: 1.8;
          line-height: 1;
          position: absolute;
          top: 20px;
          left: 16px; } }
        @media only screen and (max-width: 960px) and (max-width: 960px) {
          .faqArea dl dd::before {
            font-size: 24px;
            font-size: 2.4rem; } }
@media only screen and (max-width: 960px) {
        .faqArea dl dd::after {
          left: 5vw;
          height: 1px;
          width: calc(100% - 10vw); } }