@charset "UTF-8";
/*note: INDEXの表示は、コメントの「 index: 」でハイライト表示してください。*/
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: 外部ファイルの読み込み */
/*note: INDEXの表示は、コメントの「 index: 」でハイライト表示してください。*/
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: 外部フォントCSSファイルの読み込み*/
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP&display=swap");
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: リセットCSS と body要素の文字（色・書体）と背景色*/
/* Body要素の背景色 */
/* Body要素の文字色 */
/* Body要素の書体 */
/* リセット用のプレイスフォルダ */
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: メディアクエリー*/
/* 切り替えポイントの設定 */
/* 処理 */
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: クリアフィックス*/
/* Class と ステークホルダー の名称設定 */
/* 処理 */
.clearfix:after {
  content: "";
  display: block;
  clear: both; }

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: スクリーンリーダー*/
/* スクリーンリーダーテキスト の名称設定 */
/* 処理 */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  overflow: hidden;
  width: 0;
  height: 0; }

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/*index: リセットCSS と サイトの初期設定 */
@font-face {
  font-family: 'HuiFontP109';
  src: url("../font/HuiFontP109.eot");
  src: url("../font/HuiFontP109.eot?#iefix") format("embedded-opentype"), url("../font/HuiFontP109.woff") format("woff"), url("../font/HuiFontP109.ttf") format("truetype"), url("../font/HuiFontP109.svg#HuiFontP109") format("svg"); }
.f_font {
  font-family: 'HuiFontP109'; }

#main-wrapper img {
  width: 100%;
  height: auto;
  vertical-align: middle; }
#main-wrapper .nopc {
  display: none; }
#main-wrapper .visual {
  background: #fff100; }
  #main-wrapper .visual img {
    max-width: 1400px;
    margin: 0 auto; }
#main-wrapper .bg1,
#main-wrapper .bg3,
#main-wrapper .bg5 {
  background: #fff100; }
#main-wrapper .bg1 .container, #main-wrapper .bg2 .container, #main-wrapper .bg3 .container, #main-wrapper .bg4 .container, #main-wrapper .bg5 .container {
  position: relative;
  z-index: 0; }
  #main-wrapper .bg1 .container:before, #main-wrapper .bg2 .container:before, #main-wrapper .bg3 .container:before, #main-wrapper .bg4 .container:before, #main-wrapper .bg5 .container:before, #main-wrapper .bg1 .container:after, #main-wrapper .bg2 .container:after, #main-wrapper .bg3 .container:after, #main-wrapper .bg4 .container:after, #main-wrapper .bg5 .container:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    background-size: 1280px auto !important;
    background-repeat: no-repeat !important; }
    @media only screen and (max-width: 1023px) {
      #main-wrapper .bg1 .container:before, #main-wrapper .bg2 .container:before, #main-wrapper .bg3 .container:before, #main-wrapper .bg4 .container:before, #main-wrapper .bg5 .container:before, #main-wrapper .bg1 .container:after, #main-wrapper .bg2 .container:after, #main-wrapper .bg3 .container:after, #main-wrapper .bg4 .container:after, #main-wrapper .bg5 .container:after {
        background-size: 960px auto !important; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg1 .container:before, #main-wrapper .bg2 .container:before, #main-wrapper .bg3 .container:before, #main-wrapper .bg4 .container:before, #main-wrapper .bg5 .container:before, #main-wrapper .bg1 .container:after, #main-wrapper .bg2 .container:after, #main-wrapper .bg3 .container:after, #main-wrapper .bg4 .container:after, #main-wrapper .bg5 .container:after {
        background-size: 100% auto !important; } }
  #main-wrapper .bg1 .container:before, #main-wrapper .bg2 .container:before, #main-wrapper .bg3 .container:before, #main-wrapper .bg4 .container:before, #main-wrapper .bg5 .container:before {
    height: 320px;
    top: 0;
    background-position: top center !important; }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg1 .container:before, #main-wrapper .bg2 .container:before, #main-wrapper .bg3 .container:before, #main-wrapper .bg4 .container:before, #main-wrapper .bg5 .container:before {
        height: 20%; } }
  #main-wrapper .bg1 .container:after, #main-wrapper .bg2 .container:after, #main-wrapper .bg3 .container:after, #main-wrapper .bg4 .container:after, #main-wrapper .bg5 .container:after {
    height: 400px;
    bottom: 0;
    z-index: -1;
    background-position: bottom center !important; }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg1 .container:after, #main-wrapper .bg2 .container:after, #main-wrapper .bg3 .container:after, #main-wrapper .bg4 .container:after, #main-wrapper .bg5 .container:after {
        height: 20%; } }
@media only screen and (max-width: 767px) {
  #main-wrapper .bg1 .container:after {
    height: 10%; } }
@media only screen and (max-width: 767px) {
  #main-wrapper .bg2 .container:after {
    height: 8%; } }
@media only screen and (max-width: 767px) {
  #main-wrapper .bg3 .container:after {
    height: 8%; } }
@media only screen and (max-width: 767px) {
  #main-wrapper .bg4 .container:after {
    height: 13%; } }
#main-wrapper .bg1 {
  position: relative; }
  #main-wrapper .bg1 .container:before {
    background-image: url(../images/bg1_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg1 .container:before {
        background-image: url(../images/bg1_sp.png); } }
  #main-wrapper .bg1 .container:after {
    background-image: url(../images/bg1_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg1 .container:after {
        background-image: url(../images/bg1_sp.png); } }
#main-wrapper .bg2 {
  position: relative; }
  #main-wrapper .bg2 .container:before {
    background-image: url(../images/bg2_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg2 .container:before {
        background-image: url(../images/bg2_sp.png); } }
  #main-wrapper .bg2 .container:after {
    background-image: url(../images/bg2_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg2 .container:after {
        background-image: url(../images/bg2_sp.png); } }
#main-wrapper .bg3 {
  position: relative; }
  #main-wrapper .bg3 .container:before {
    background-image: url(../images/bg3_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg3 .container:before {
        background-image: url(../images/bg3_sp.png); } }
  #main-wrapper .bg3 .container:after {
    background-image: url(../images/bg3_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg3 .container:after {
        background-image: url(../images/bg3_sp.png); } }
#main-wrapper .bg4 {
  position: relative; }
  #main-wrapper .bg4 .container:before {
    background-image: url(../images/bg4_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg4 .container:before {
        background-image: url(../images/bg4_sp.png); } }
  #main-wrapper .bg4 .container:after {
    background-image: url(../images/bg4_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg4 .container:after {
        background-image: url(../images/bg4_sp.png); } }
#main-wrapper .bg5 {
  position: relative; }
  #main-wrapper .bg5 .container:before {
    background-image: url(../images/bg5_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg5 .container:before {
        background-image: url(../images/bg5_sp.png); } }
  #main-wrapper .bg5 .container:after {
    background-image: url(../images/bg5_pc.png); }
    @media only screen and (max-width: 767px) {
      #main-wrapper .bg5 .container:after {
        background-image: url(../images/bg5_sp.png); } }
#main-wrapper #contents-wrapper {
  margin: auto; }
  @media only screen and (max-width: 767px) {
    #main-wrapper #contents-wrapper {
      width: 100%; } }
  #main-wrapper #contents-wrapper .container {
    max-width: 1280px;
    margin: auto;
    padding: 60px 5% 150px;
    overflow: hidden;
    width: 100%; }
    @media only screen and (max-width: 1023px) {
      #main-wrapper #contents-wrapper .container {
        padding: 60px 5% 120px; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .container {
        padding: 60px 5% 160px; } }
  #main-wrapper #contents-wrapper .lead {
    padding: 60px 5%; }
    #main-wrapper #contents-wrapper .lead p {
      font-size: 20px;
      text-align: center; }
      @media only screen and (max-width: 767px) {
        #main-wrapper #contents-wrapper .lead p {
          font-size: 15px;
          text-align: left; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .lead {
        padding: 40px 5%; } }
    #main-wrapper #contents-wrapper .lead span {
      font-size: 1.5em; }
  #main-wrapper #contents-wrapper h2 {
    margin-bottom: 20px; }
  #main-wrapper #contents-wrapper .question {
    font-size: 52px;
    text-align: left;
    margin-bottom: 30px; }
    @media only screen and (max-width: 1023px) {
      #main-wrapper #contents-wrapper .question {
        font-size: 36px;
        text-align: center; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .question {
        font-size: 20px;
        font-size: 5vw;
        margin-bottom: 0;
        text-align: center; } }
    #main-wrapper #contents-wrapper .question .number {
      width: 102px;
      height: 93px;
      padding-right: 10px;
      vertical-align: top; }
      @media only screen and (max-width: 1023px) {
        #main-wrapper #contents-wrapper .question .number {
          width: 70px;
          height: 60px; } }
      @media only screen and (max-width: 767px) {
        #main-wrapper #contents-wrapper .question .number {
          width: 60px;
          height: 50px;
          display: block;
          margin: auto; } }
    #main-wrapper #contents-wrapper .question span {
      display: inline-block; }
    #main-wrapper #contents-wrapper .question small {
      font-size: 0.3em;
      line-height: 1;
      display: block;
      text-align: left; }
      @media only screen and (max-width: 767px) {
        #main-wrapper #contents-wrapper .question small {
          font-size: 3vw;
          text-align: center; } }
  #main-wrapper #contents-wrapper .imgage {
    float: left;
    width: 40%; }
    @media only screen and (max-width: 1023px) {
      #main-wrapper #contents-wrapper .imgage {
        width: 53%; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .imgage {
        float: none;
        width: 100%;
        margin: auto;
        text-align: center; }
        #main-wrapper #contents-wrapper .imgage img {
          max-width: 600px; } }
  #main-wrapper #contents-wrapper .anser {
    float: right;
    width: 60%; }
    @media only screen and (max-width: 1023px) {
      #main-wrapper #contents-wrapper .anser {
        width: 47%; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .anser {
        float: none;
        width: 100%;
        margin: auto; } }
    #main-wrapper #contents-wrapper .anser .title {
      border-bottom: 3px solid #000;
      font-size: 30px;
      text-align: left;
      margin-top: 30px; }
      @media only screen and (max-width: 767px) {
        #main-wrapper #contents-wrapper .anser .title {
          font-size: 18px; } }
    #main-wrapper #contents-wrapper .anser .text {
      font-family: 'HuiFontP109';
      font-size: 25px;
      margin-top: 15px; }
      @media only screen and (max-width: 767px) {
        #main-wrapper #contents-wrapper .anser .text {
          font-size: 16px; } }
  #main-wrapper #contents-wrapper .otherqa {
    background: #fff100; }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .otherqa .container {
        padding: 60px 5%; } }
    #main-wrapper #contents-wrapper .otherqa .question {
      text-align: center; }
    #main-wrapper #contents-wrapper .otherqa .anser {
      width: 100%;
      float: none;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      #main-wrapper #contents-wrapper .otherqa .anser li {
        width: 47%;
        display: inline-block; }
        @media only screen and (max-width: 767px) {
          #main-wrapper #contents-wrapper .otherqa .anser li {
            width: 100%;
            margin: auto; } }
  #main-wrapper #contents-wrapper .btn-wrapper {
    margin: 100px auto; }
    @media only screen and (max-width: 1023px) {
      #main-wrapper #contents-wrapper .btn-wrapper {
        margin: 80px auto; } }
    @media only screen and (max-width: 767px) {
      #main-wrapper #contents-wrapper .btn-wrapper {
        margin: 50px auto; } }
    #main-wrapper #contents-wrapper .btn-wrapper .btn {
      background: #231815;
      border-radius: 15px 15px;
      border: 2px solid #231815;
      color: #fff100;
      font-size: 30px;
      margin: 0 auto;
      width: 80%; }
      @media only screen and (max-width: 1023px) {
        #main-wrapper #contents-wrapper .btn-wrapper .btn {
          font-size: 20px; } }
      @media only screen and (max-width: 767px) {
        #main-wrapper #contents-wrapper .btn-wrapper .btn {
          width: 90%;
          font-size: 3.6vw; } }
  #main-wrapper #contents-wrapper .last-btn .container {
    padding: 0; }
@media only screen and (max-width: 767px) {
  #main-wrapper .nosp {
    display: none; }
  #main-wrapper .nopc {
    display: block; } }
#main-wrapper .fsg_comment_btn {
  text-align: left;
  font-size: 1.2em;
  font-weight: bold;
  margin: 10px 0;
  padding: 10px;
  border-radius: 5px 5px;
  background: #333;
  color: #fff; }
#main-wrapper .fsg_comment {
  padding: 1em;
  background: #f2f2f2;
  border-radius: 5px 5px;
  margin-bottom: 15px; }
#main-wrapper #contents-wrapper .anser li {
  display: none; }
#main-wrapper #contents-wrapper .otherqa .anser05 li {
  display: none; }
#main-wrapper #contents-wrapper .anser li:nth-child(1), #main-wrapper #contents-wrapper .anser li:nth-child(2), #main-wrapper #contents-wrapper .anser li:nth-child(3) {
  display: block; }
#main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(1), #main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(2),
#main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(3), #main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(4),
#main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(5), #main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(6),
#main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(7), #main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(8),
#main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(9), #main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(10),
#main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(11), #main-wrapper #contents-wrapper .otherqa .anser05 li:nth-child(12) {
  display: block; }
#main-wrapper #contents-wrapper .anser01.open_list li {
  display: block; }
#main-wrapper #contents-wrapper .anser02.open_list li {
  display: block; }
#main-wrapper #contents-wrapper .anser03.open_list li {
  display: block; }
#main-wrapper #contents-wrapper .anser04.open_list li {
  display: block; }
#main-wrapper #contents-wrapper .otherqa .anser05.open_list li {
  display: block; }
#main-wrapper #contents-wrapper .anser li.more-btn {
  margin: 3em auto 1em;
  display: block; }
  #main-wrapper #contents-wrapper .anser li.more-btn p {
    text-decoration: none;
    border: 2px solid #000;
    padding: .5em;
    text-align: center; }
  #main-wrapper #contents-wrapper .anser li.more-btn p:hover {
    background-color: #000;
    color: #fff; }
#main-wrapper #contents-wrapper .anser li.more-btn.last {
  width: 60% !important; }
#main-wrapper #contents-wrapper .anser01 li.more-btn.delete_btn {
  display: none; }
#main-wrapper #contents-wrapper .anser02 li.more-btn.delete_btn {
  display: none; }
#main-wrapper #contents-wrapper .anser03 li.more-btn.delete_btn {
  display: none; }
#main-wrapper #contents-wrapper .anser04 li.more-btn.delete_btn {
  display: none; }
#main-wrapper #contents-wrapper .otherqa .anser05 li.more-btn.delete_btn {
  display: none !important; }
#main-wrapper #contents-wrapper .anser01.open_list .more-btn {
  display: none; }
#main-wrapper #contents-wrapper .anser02.open_list .more-btn {
  display: none; }
#main-wrapper #contents-wrapper .anser03.open_list .more-btn {
  display: none; }
#main-wrapper #contents-wrapper .anser04.open_list .more-btn {
  display: none; }
#main-wrapper #contents-wrapper .otherqa .anser05.open_list .more-btn {
  display: none !important; }