@charset "utf-8";
/* CSS Document */

/* =================================================

LAYOUT

==================================================*/
html {
  background-color: #fff;
}

body {
  font-family:
    "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
    "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
  color: #878787;
  background-color: #fff;
  font-feature-settings: "palt";
}

#wrap {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}
#wrap li {
  list-style: none;
}
#wrap li img {
  vertical-align: bottom;
}

img {
  width: 100%;
  vertical-align: bottom;
  display: block;
}
a:link,
a:visited {
  color: #acc8e4;
  text-decoration: underline;
}

.btnList {
  text-align: center;
  margin-bottom: 8px;
}

.btnList li {
  display: block;
  margin-bottom: 20px;
}

.cv_area .tel {
  font-size: 18px;
  line-height: 1.6em;
}
.ta_c {
  text-align: center;
}
.customer_link {
  width: 600px;
  margin: 5px auto 0;
  font-size: 22px;
  font-weight: bold;
}
.customer_link a {
  color: #0864a9;
  text-decoration: underline;
}

#head {
  max-width: 640px;
  width: 100%;
  height: 80px;
  background: #fff;
  position: fixed;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  z-index: 100;
}

#head .logo {
  width: 40%;
  margin: 0 0 0 2%;
}

#head .head_box {
  display: flex;
  flex-wrap: nowrap;
  justify-content: right;
  align-items: center;
  margin: 1.5% 1% 0 5%;
}

#head .login {
  width: 75%;
}

#button {
  background: url("../img/btn_menu_2.png") 0 0 no-repeat;
  cursor: pointer;
  margin-left: 4%;
}

#button {
  background: url("../img/btn_menu_2.png") 0 0 no-repeat;
  height: 60px;
  width: 60px;
  cursor: pointer;
  background-size: contain;
}

@media (max-width: 640px) {
  #button {
    height: 12vw;
    width: 12vw;
  }
}

.on#button {
  background-image: url("../img/btn_menu_on.png");
}
.off#button {
  background-image: url("../img/btn_menu.png");
}

.main {
  padding-top: 80px;
}

#menu {
  margin: 0 auto;
  max-width: 640px;
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 80px;
  z-index: 2001;
  left: calc(50% - 320px);
  position: fixed;
}

#close {
  cursor: pointer;
}

@media (max-width: 640px) {
  #menu {
    left: 0;
  }
  #menu ul li {
    margin-top: -1px;
  }
  #close {
    margin-top: -1px;
  }
}

.qa {
  background: #bcd7ec;
  padding-bottom: 50px;
}
.qa a img {
  transition: 0.3s;
  cursor: pointer;
}
.qa a:hover img {
  opacity: 0.6;
  transition: 0.3s;
}

@media (max-width: 640px) {
  .qa a:hover img {
    opacity: 1;
  }
}

.qa_indicator {
  position: relative;
  z-index: 1;
}
.indicator {
  position: absolute;
  top: 33%;
  left: 22.5%;
}
.indicator img {
  width: 20%;
}

.q1 {
  position: relative;
  z-index: 1;
}
.q1 .q_yes {
  position: absolute;
  top: 44%;
  right: 13%;
  width: 66%;
}
.q1 .q_no {
  position: absolute;
  top: 68%;
  right: 13%;
  width: 66%;
}
.q2 {
  position: relative;
  z-index: 1;
}
.q2 .q_yes {
  position: absolute;
  top: 49.5%;
  right: 13%;
  width: 66%;
}
.q2 .q_no {
  position: absolute;
  top: 71.5%;
  right: 13%;
  width: 66%;
}
.q3 {
  position: relative;
  z-index: 1;
}
.q3 .q_01 {
  position: absolute;
  top: 35%;
  right: 13%;
  width: 66%;
}
.q3 .q_02 {
  position: absolute;
  top: 55.5%;
  right: 13%;
  width: 66%;
}
.q3 .q_03 {
  position: absolute;
  top: 76%;
  right: 13%;
  width: 66%;
}

.caution,
.caution_off {
  cursor: pointer;
}
.caution_off {
  display: block;
  width: 216px;
  height: 50px;
  text-indent: -9999px;
  overflow: hidden;
  outline: none;
  background: url("../img/close2.png") 0 0 no-repeat;
  margin: 20px auto;
}
#txt_caution {
  display: none;
  width: 640px;
  height: 100%;
  position: fixed;
  top: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.9);
  left: 0;
}
#cautionIn {
  width: 80%;
  margin: 0 auto;
}
#cautionArea {
  background-color: #fff;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  padding: 40px 40px 20px;
  word-wrap: break-word;
}
#cautionArea p {
  margin-bottom: 1em;
}

.btn_wrap {
  margin: 40px 0 30px;
  padding: 22px 0;
  background: url("../img/bg_top.png");
  border-top: #dfdfdf 1px solid;
  border-bottom: #dfdfdf 1px solid;
}
.btn_wrap_inner {
  width: 100%;
  margin: 0 auto;
}

h2 {
  margin-bottom: 18px;
  padding-left: 20px;
}

.btnList {
  text-align: center;
  margin-bottom: 8px;
}
.btnList li {
  display: block;
  margin-bottom: 20px;
}

#footArea #btn_L {
  margin-bottom: 25px;
}
#footArea #btn_L li {
  text-align: center;
  margin-bottom: 2px;
}
#footArea #about {
  padding: 20px;
  border-top: #e0e0e0 2px solid;
  color: #333;
}
#foot_note {
  text-align: justify;
  margin: 100px 20px 10px;
  color: #333;
  text-indent: -15px;
  padding-left: 15px;
  font-size: 90%;
  line-height: 2em;
  display: none;
}
#code {
  text-align: right;
  padding-right: 20px;
  margin-bottom: 40px;
  color: #333;
  display: none;
}
#foot {
  text-align: center;
  background-color: #113961;
  padding: 33px 0 190px;
  display: none;
}
#foot li {
  border-right: 1px solid #acc8e4;
  display: inline;
  padding: 0 0.5em;
  white-space: nowrap;
}
#foot li.noBD {
  border-right: none;
  padding-right: 0;
}
#copyright {
  font-size: 70%;
  padding-top: 20px;
  color: #acc8e4;
}

@media (max-width: 640px) {
  #foot {
    text-align: center;
    background-color: #113961;
    padding: 8% 0 28%;
  }
  #copyright {
    font-size: 60%;
  }
}

.mt15 {
  margin-top: 15px;
}

/* ===== Link ===== */
a {
  outline: none;
}
a:link,
a:visited {
  color: #acc8e4;
  text-decoration: underline;
}
a:active,
a:hover {
  color: #acc8e4;
  text-decoration: none;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  display: inline-block;
}

* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}

.clearfix + * {
  clear: both;
}

#rise {
  background: #fff;
  margin: 0 0 20px;
  padding: 10px 20px;
}

#rise a {
  color: #ee7838;
}

#left {
  float: left;
}

#right {
  float: right;
}

.internet,
.tel {
  color: #333;
  width: 600px;
  margin: 10px auto 30px;
}

.mb20 {
  margin-bottom: 20px;
}

#back {
  width: 100%;
  padding: 103px 20px 20px;
  border-top: #efefef 2px solid;
  text-align: right;
}

.inner {
  width: 100%;
}
.inner * {
  margin-left: 0;
  padding-left: 0;
}
.inner p {
  color: #333;
  font-size: 24px;
}

.pagetop {
  width: 100%;
  padding: 0 5%;
  margin-bottom: 90px;
  text-align: right;
}
.txt_more {
  width: 100%;
  padding: 0 5%;
  margin-bottom: 34px;
  text-align: right;
}

.btnList_about {
  overflow: hidden;
  margin-bottom: 90px;
}
.btnList_about li {
}

.cont {
  margin-top: -103px;
  /* 固定ナビの高さ分のネガティブマージン */
  padding-top: 103px;
  /* 打ち消し用のパディング */
}
.cont h2 {
  margin-bottom: 28px;
  padding-left: 0;
}

.cont a {
  color: #0864a9;
}

.note {
  font-size: 20px !important;
}

.lineup_list h3 {
}

#foot_cont {
  border-top: solid 2px #e0e0e0;
  padding-bottom: 42px;
  color: #333;
  background: #f2f2f2 url("../img/foot_cont_bg.png") left top repeat;
}
#foot_cont dl {
  text-align: center;
  padding-top: 42px;
}
#foot_cont dl dt {
  padding-bottom: 31px;
}
#foot_cont dl dd {
  padding-bottom: 21px;
}
#foot_cont .foot_cont_txt {
  font-size: 0.8em;
}
#foot_cont .foot_cont_txt_inner {
  width: 23em;
  margin: 0 auto;
  display: block;
}

.mb10 {
  margin-bottom: 10px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb40 {
  margin-bottom: 40px;
}
.mb50 {
  margin-bottom: 50px;
}
.mb70 {
  margin-bottom: 70px;
}
.mt10 {
  margin-top: 10px;
}
.mt30 {
  margin-top: 30px;
}
.mt40 {
  margin-top: 40px;
}
.mt50 {
  margin-top: 50px;
}

.ta_c {
  text-align: center;
}
.tl {
  text-align: left;
}
.tr {
  text-align: right;
}

sup {
  font-size: 10px;
}

.ichiji_btn {
  text-align: right;
  padding: 18px 0;
  background: #0068b7;
  margin-bottom: 50px;
}

.fade {
  opacity: 0;
  visibility: hidden;
  page-break-inside: avoid;
}

@media print {
  .fade {
    opacity: 1;
    visibility: visible;
  }
}

.fadein {
  visibility: visible;
  -webkit-animation: fade-in;
  animation: fade-in;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  -webkit-animation-delay: 0;
  animation-delay: 0;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-direction: "normal";
  animation-direction: "normal";
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
    -webkit-transform: translateX(0) translateY(40px);
    transform: translateX(0) translateY(40px);
  }

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

@keyframes fade-in {
  0% {
    opacity: 0;
    -webkit-transform: translateX(0) translateY(40px);
    transform: translateX(0) translateY(40px);
  }

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

/* 初期非表示の設定 */
.qa .a1,
.qa .a1_next,
.qa .q2_indicator,
.qa .q2,
.qa .a2,
.qa .a2_next,
.qa .q3_indicator,
.qa .q3,
.qa .a3,
.qa .a_yes,
.qa .a_no,
.qa .a_01,
.qa .a_02,
.qa .a_03,
.qa .qa_end,
.rise,
.encan {
  display: none;
}
/* アコーディオンの開閉コンテナ */
.point-accordion {
  display: grid;
  grid-template-rows: 0fr; /* 初期状態: 高さ0 */
  transition: grid-template-rows 0.3s ease; /* スルッと動く速度設定 */
}

/* 開いた状態 */
.point-accordion.is-open {
  grid-template-rows: 1fr; /* 開いた状態: コンテンツに合わせた高さ */
}

/* アコーディオンの内部コンテンツ */
.point-accordion-inner {
  overflow: hidden; /* はみ出しを隠す */
  background-color: #f9f9f9;
}

/* カーソルと画像の調整 */
.point-trigger {
  cursor: pointer;
}
.point-trigger img {
  display: block;
}

.rise_point01_note {
  display: flex;
  justify-content: center;
  width: 100%;
  flex-wrap: nowrap;
}

.encan_btn {
  background: #fff8a0;
  padding: 7% 5%;
}

.encan_note {
  display: flex;
  justify-content: center;
  width: 100%;
  flex-wrap: nowrap;
  padding-top: 2%;
}
.encan_note {
  display: flex;
  justify-content: center;
  width: 100%;
  flex-wrap: nowrap;
  padding-top: 2%;
}

.encan_note a img {
  cursor: pointer;
}

.encan_btn_link a img {
  transition: 0.3s;
}

.encan_btn_link a:hover img {
  opacity: 0.6;
  transition: 0.3s;
}

@media (max-width: 640px) {
  .encan_btn_link a:hover img {
    opacity: 1;
  }
}

.question_other {
  display: flex;
  justify-content: right;
  width: 100%;
  flex-wrap: nowrap;
}
.question_other img {
  width: 80%;
  padding: 5% 10% 10% 0;
}
.question_other_list {
  padding: 0 10%!important;
}

@media (max-width: 640px) {
.question_other img {
  max-width: 170px;
}
}

#fix_btn {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%); /* 追加 */
  width: 100%; /* max-widthを適用させるために幅を100%指定 */
  max-width: 640px;
  background: #fff8a0;
  text-align: center;
  z-index: 100;
  display: none;
}
#fix_btn ul {
  width: 86%;
  display: flex;
  list-style: none;
  margin: 0 auto;
  text-align: center;
  padding: 10px 7% 15px;
}
#fix_btn ul {
  display: flex;
}

#fix_btn ul a img {
  transition: 0.3s;
}

#fix_btn ul a:hover img {
  opacity: 0.6;
  transition: 0.3s;
}


@media (max-width: 640px) {
  #fix_btn ul {
    padding: 1.5% 7% 2%;
  }
  #fix_btn ul a:hover img {
    opacity: 1;
  }
}
