@charset "UTF-8";



/* =============================
   一覧
============================= */
.faq_panelList.row {
  margin-top: 1.5em;
  margin-right: -0.5em;
  margin-left: -0.5em;
  line-height: 1.25;
}
.faq_panelList li {
  padding-right: 0.5em !important;
  padding-left: 0.5em !important;
  margin-bottom: 1em !important;
}
.faq_panelList li a {
  display: block;
  height: 100%;
  border: 1px solid #CCC;
  border-radius: .5em;
  padding: 1.5em .25em 1.75em;
  text-align: center;
  position: relative;
}
.faq_panelList li a:hover {
  text-decoration: none;
  background-color: #f8f8f8;
}
.faq_panelList li a .icon {
  width: 3em;
  margin: 0 auto;
}
.faq_panelList li a span {
  display: block;
  margin-top: 1em;
}



.faq_btnList.row {
  margin-top: 1.5em;
  margin-right: -0.5em;
  margin-left: -0.5em;
  line-height: 1.25;
}
.faq_btnList li {
  padding-right: 0.5em !important;
  padding-left: 0.5em !important;
  margin-bottom: 1em !important;
}
.faq_btnList li a {
  display: flex;
  align-items: center;
  height: 100%;
  border: 1px solid #CCC;
  padding: .75em 2.5em .75em 1em;
  position: relative;
}
.faq_btnList li a::after {
  content: '';
  position: absolute;
  width: .8em;
  height: .8em;
  top: 50%;
  right: 1rem;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  transform-origin: center center;
  transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, 45deg);
}
.faq_btnList li a:hover {
  text-decoration: none;
  background-color: #f8f8f8;
}
.faq_btnList li a .icon {
  flex: 0 0 3em;
  margin-right: 1em;
}
.faq_btnList li a span {
  display: block;
}



.faq_list {
  margin-top: 1.5em;
  margin-bottom: 1em;
  line-height: 1.5;
}
.faq_list li {
  border-bottom: 1px solid #CCC;
}
.faq_list li:first-child {
  border-top: 1px solid #CCC;
}
.faq_list li a {
  display: block;
  align-items: center;
  height: 100%;
  padding: 1.75em 2.5em 1.75em 1em;
  position: relative;
}
.faq_list li a::after {
  content: '';
  position: absolute;
  width: .8em;
  height: .8em;
  top: 50%;
  right: 1rem;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  transform-origin: center center;
  transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, 45deg);
}
.faq_list li a:hover {
  text-decoration: none;
  background-color: #f8f8f8;
}
.faq_list li a .faq_Q,
.faq_list li a .faq_A {
  height: 100%;
  min-height: 2.5em;
  position: relative;
}
.faq_list li a .icon_Q,
.faq_list li a .icon_A {
  width: 3rem;
  margin-right: 1.25rem;
  text-align: center;
  font-family: 'Sulphur Point', sans-serif;
  border: 1px solid #222;
  position: absolute;
}
.faq_list li a .icon_Q {
  background: #222;
  color: #fff;
}
.faq_list li a .icon_A {
  color: #222;
}
.faq_list li a .faq_Q > p,
.faq_list li a .faq_A > p {
  padding-top: .5rem;
  padding-left: 4.25rem;
}

.faq_list li a span {
  display: block;
}
.faq_list li a .icon_Q span,
.faq_list li a .icon_A span {
  font-size: 1.25em;
  line-height: calc(2em - 2px);
}

@media (max-width: 768px) {
  .faq_list li a {
    padding: 1.5em 1em;
  }
  .faq_list li a::after {
    display: none;
  }
}





.faq_list2 {
  margin-top: 1.5em;
  margin-bottom: 1em;
  line-height: 1.5;
}
.faq_list2 li {
  border-bottom: 1px solid #CCC;
}
.faq_list2 li:first-child {
  border-top: 1px solid #CCC;
}
.faq_list2 li a {
  display: block;
  align-items: center;
  height: 100%;
  padding: 1.75em 2.5em 1.75em 1em;
  position: relative;
}
.faq_list2 li a::after {
  content: '';
  position: absolute;
  width: .8em;
  height: .8em;
  top: 50%;
  right: 1rem;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  transform-origin: center center;
  transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, 45deg);
}
.faq_list2 li a:hover {
  text-decoration: none;
  background-color: #f8f8f8;
}
.faq_list2 li a .faq_item {
  display: flex;
  align-items: center;
  height: 100%;
  min-height: 2.5em;
}
.faq_list2 li a span {
  display: block;
}

@media (max-width: 768px) {
  .faq_list2 li {
    border: 1px solid #CCC;
  }
  .faq_list2 li a {
    padding: 1.25em 2.5em 1.25em 1em;
  }
}



/* =============================
   Search
============================= */
#search .searchBox {
  padding-top: 1em;
  padding-bottom: 1em;
}
#search form {
  max-width: 692px;
}
#search form .search-field {
  position: relative;
}
#search form .form_field {
  height: calc(5em + 2px);
  border-radius: 3em;
  padding: 1em 4.5em 1em 2em;
  margin: 0;
  border-color: transparent;
  background: #f8f8f8;
}
#search form .form_field:focus {
  border-color: #bfbfbf;
}
#search form .search-field button {
  text-align: center;
  width: calc(4.65em + 2px);
  height: calc(4.65em + 2px);
  border-radius: 100%;
  border: none;
  background: none;
  outline: none;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  transition: .1s ease-in-out;
}
#search form .search-field button:hover {
  background-color: #f8f8f8;
}
#search form .search-field button img {
  width: 2em;
}
#search .popular-words {
  font-size: .875em;
  display: flex;
  flex-wrap: wrap;
}
#search .popular-words dt {
  flex: 0 0 9em;
  margin-top: 1.5em;
  font-weight: 700;
}
#search .popular-words dd {
  margin-top: 1.5em;
  flex: 0 0 calc(100% - 9em);
}
#search .popular-words dd a {
  text-decoration: underline;
  margin-right: 1em;
}
#search .popular-words dd a:hover {
  text-decoration: none;
}

@media (max-width: 960px) {
  #search .popular-words {
    display: block;
    padding: 0 1.5em;
  }
  #search .popular-words dt {
    margin-top: 1em;
  }
  #search .popular-words dd {
    margin-top: 0;
  }
}



/* =============================
   一覧
============================= */
.faq_list_header {
  height: 105px;
  border-bottom: 1px solid #CCC;
  display: flex;
  align-items: center;
}
.faq_list_header .ttl {
  margin: 0;
  padding-top: .8rem;
  padding-bottom: .75rem;
  padding-left: 6rem;
  font-size: 1.625rem;
}
.faq_list_header .icon {
  width: 4.5rem;
  position: absolute;
}

@media (max-width: 960px) {
 .faq_list_header .ttl {
    padding-top: .6rem;
    padding-bottom: .55rem;
    padding-left: 4.5rem;
    font-size: 1.25em;
  }
  faq_list_header .icon {
    width: 3.25rem;
  }
}
@media (max-width: 768px) {
  .faq_list_header {
    height: 6rem;
    padding-top: 1rem;
  }
  .faq_list_header .ttl {
    padding-top: .6rem;
    padding-bottom: .55rem;
    padding-left: 3.5rem;
    font-size: .875em;
  }
  .faq_list_header .icon {
    width: 2.5rem;
  }
}



/* -------------
   リスト
------------- */
#faq_list .faq_list li a {
  padding: 2em 2.5em 2em 1em;
}
#faq_list .faq_list li a .faq_Q {
  align-items: flex-start;
}
#faq_list .faq_list li a .faq_A {
  align-items: flex-start;
  margin-top: 1.5em;
}

#faq_list .faq_list li a .faq_Q > p {
  font-size: 1.125em;
  padding-top: .25rem;
}
#faq_list .faq_list li a .faq_A > p {
  padding-top: .25rem;
}
@media (max-width: 768px) {
  #faq_list .faq_list li a {
    padding: 1.5em 1em;
  }
}


/* -------------
   詳細
------------- */
.faq_detail_contents .faq_Q,
.faq_detail_contents .faq_A {
  height: 100%;
  min-height: 2.5rem;
  position: relative;
}
.faq_detail_contents .icon_Q,
.faq_detail_contents .icon_A {
  width: 3rem;
  text-align: center;
  font-family: 'Sulphur Point', sans-serif;
  border: 1px solid #222;
  position: absolute;
}
.faq_detail_contents .icon_Q {
  background: #222;
  color: #fff;
}
.faq_detail_contents .icon_A {
  color: #222;
}
.faq_detail_contents span {
  display: block;
  line-height: 1.5;
}
.faq_detail_contents .icon_Q span,
.faq_detail_contents .icon_A span {
  font-size: 1.25em;
  line-height: calc(2em - 2px);
}
.faq_detail_contents .faq_Q > .ttl {
  font-size: 1.25em;
  margin: 0;
  padding-top: .25rem;
  padding-left: 4.25rem;
}
.faq_detail_contents .faq_A > p {
  padding-top: .25rem;
  padding-left: 4.25rem;
}
.faq_detail_contents .entry_content > * {
  margin-top: 1.5em;
}


.pane-topic-path.faq_topic-path {
  margin-top: 4rem;
  padding: 1.42rem 2.84rem;
  border-radius: 4rem;
  font-size: .857em;
  line-height: 1.5;
}
.pane-topic-path.faq_topic-path .block-topic-path {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
.pane-topic-path.faq_topic-path .block-topic-path .faq_topic-path_ttl {
  display: block;
  white-space: nowrap;
  margin-right: .5em;
  position: absolute;
}
.pane-topic-path.faq_topic-path .block-topic-path .block-topic-path--list{
  line-height: 1.5;
}
.faq_topic-path .block-topic-path--list > li:first-child {
  padding-left: 6.5em;
}
.faq_topic-path .block-topic-path--list > li:nth-child(n + 2) {
  margin-left: 0.5em;
}


/* -------------
   ページネーション
------------- */
#faq_list .pager {
  text-align: left;
  margin: 0;
}
#faq_list .pager-total {
  padding: 0;
  margin-right: .5em;
}
#faq_list .faq_list {
  margin-top: 1em;
  margin-bottom: 1em;
}


#faq_list ul.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style-type: none;
  text-align: center;
  margin: 1.5rem 0 0;
  padding: 0;
}
#faq_list ul.pagination > * {
  list-style-type: none;
  float: left;
  margin-left: 0;
  padding: 0;
  background-color: transparent;
  border: none;
}
#faq_list ul.pagination > li > a,
#faq_list ul.pagination > li > span {
  display: block;
  text-align: center;
  font-size: .875em;
  min-width: 2rem;
  height: 2rem;
  margin: 0 8px;
  line-height: calc(2rem - 2px);
  border-radius: 0;
  border: 1px solid #EEE;
  background-color: transparent;
  color: inherit;
  outline: none;
}
#faq_list ul.pagination > li.dot span {
    border-color: transparent;
    color: #555;
}
#faq_list ul.pagination > li.pager-current > * {
  background-color: #555;
  border-color: #555;
  color: #FFF;
}



/* -------------
   メニュー
------------- */
.faq-menu-btn {
  background: #222;
  color: #fff;
  padding: .75em;
  border-radius: .5em 0 0 .5em;
  text-align: center;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  cursor: pointer;

  position: fixed;
  right: 83px;
  bottom: 5vh;
  z-index: 998;
}
.faq-menu-btn span {
  display: block;
  font-size: .875em;
  font-weight: 700;
  line-height: 1.2;
}

@media (max-width: 768px) {
  .faq-menu-btn {
    right: 0;
  }
}


#faq-menu {
  width: 400px;
  background: #fff;
  padding: 2.5em 1.5em 2em 2em;
  box-shadow: 0 0 12px rgba(0,0,0,0.2);

  position: fixed;
  right: 83px;
  bottom: 0;
  z-index: 999;

  opacity: 0;

  transform: translate3d(0, 100%, 0);
  transition: .3s;
}
#faq-menu.is-show {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

#faq-menu .nav_ttl {
  display: block;
  font-size: 1.25em;
  margin-bottom: .75em;
}
#faq-menu nav {
  padding-right: .5em;
  height: 50vh;
  overflow-y: auto;
}
#faq-menu nav .nav-parent {
  line-height: 1.5;
  padding: 1rem .5rem;
  margin: 0;
  border-top: 1px solid #CCC;
}
#faq-menu nav ul li {
  border-top: 1px solid #CCC;
}
#faq-menu nav ul li > a,
#faq-menu nav ul li > span {
  display: block;
  font-size: .875em;
  line-height: 1.5;
  padding: 1.1rem .5rem;
  position: relative;
}

#faq-menu .faq-menu-close {
  display: block;
  font-size: inherit;
  width: 3em;
  height: 3em;
  color: inherit;
  position: absolute;
  top: 1em;
  right: 1em;
  cursor: pointer;
}
#faq-menu .faq-menu-close::before,
#faq-menu .faq-menu-close::after {
  content: '';
  display: block;
  width: 2em;
  height: 1px;
  background: currentColor;
  position: absolute;
  top: 50%;
  left: .5em;
  cursor: pointer;
  transform: rotate(45deg);
}
#faq-menu .faq-menu-close::after {
  transform: rotate(-45deg);
}


@media (max-width: 768px) {
  #faq-menu {
    width: 100%;
    padding: 2.5em 6% 2em;
    right: 0;
  }
}






#faq-menu .has-children {
  cursor: pointer;
  position: relative;
}
#faq-menu .js-toggle-open::before,
#faq-menu .js-toggle-open::after {
  content: '';
  position: absolute;
  width: 1rem;
  height: 2px;
  top: 1.75rem;
  right: .5rem;
  margin-top: -1px;
  background: #AAA;
  transition: transform .3s, opacity .3s;
}
#faq-menu .js-toggle-open::after {
  transform: rotate(-90deg);
}
#faq-menu .js-toggle-open.is-open {
  font-weight: 700;
}
#faq-menu .js-toggle-open.is-open::after {
  opacity: 0;
  transform: rotate(0);
}
#faq-menu .js-toggle-open,
#faq-menu li a:hover {
  transition: .2s ease-in-out;
}
#faq-menu .js-toggle-open:hover,
#faq-menu li a:hover {
  background: #f8f8f8;
}
#faq-menu .sub-menu {
  margin-left: 1.25em;
  display: none;
}