@charset "UTF-8";

/* --------------------------------
  .header
------------------------------------- */
.header {
  width: 100%;
  height: 70px;
}
.header_box {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translate(-50%,0);
  display: flex;
  width: 100%;
  height: 70px;
  z-index: 9999;
  background-color: #9f9f9d;
}
.header_box .inner {
  position: relative;
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* .top_content .metaslider */
.top_content .metaslider .flex-control-nav {
  bottom: -45px;
}

.header_box .txt_small {
  display: block;
  margin: 1px 0 0 -8px;
  font-weight: 500;
  font-size: 12px;
  text-align: left;
  color: #fff;
  white-space: nowrap;
}
.top_heading {
  width: 47.7333%;
  max-width: 173px;
  height: 100%;
  margin: 10px 0 0 26px;
}
.top_heading .toplogo_pc {
  display: none;
}
.top_heading a {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(../images/common/toplogo_white.svg);
  background-size: contain;
  background-position: left top 20px;
  background-repeat: no-repeat;
}

/* .btn_wrap */
.btn_wrap {
  display: flex;
  height: 70px;
}
.btn_wrap >div {
  width: 70px;
  height: 70px;
  flex-shrink: 0;
  font-size: 10px;
}
.btn_wrap .nav_books_sp a {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  background-color:#2764AF;
  color: #fff;
  font-size: 10px;
  letter-spacing: .06em;
  justify-content: center;
}
.btn_wrap .nav_books_sp a img {
  margin: 18px auto 6px;
}

/* .btn_wrap .btn */
.btn_wrap .btn {
  width: 70px;
  height: 100%;
  cursor: pointer;
  color: #fff;
  text-align: center;
  z-index: 100;
}
.btn_wrap .btn .txt {
  color: #fff;
  font-size: 10px;
}

.btn_wrap .btn_box {
  position: relative;
  display: block;
  margin: 13px auto 0;
  width: 33px;
  height: 33px;
}
.btn_wrap .btn_box span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #fff;
}

.btn_wrap .btn_box,
.btn_wrap .btn_box span {
  transition: .5s;
}

/* .btn_wrap .btn.close */
.btn_wrap .btn.close {
  background-color: #000;
}
.btn_wrap .btn.close .txt {
  color: #fff;
}
.btn_wrap .btn_box.close {
  width: 40px;
}
.btn_wrap .btn_box.close span {
  background-color: #fff;
}

/* .btn_wrap .btn_box span */
.btn_wrap .btn_box span:nth-of-type(1) {
  top: 0px;
}
.btn_wrap .btn_box span:nth-of-type(2) {
  top: 15px;
}
.btn_wrap .btn_box span:nth-of-type(3) {
  bottom: 0px;
}
.btn_wrap .btn_box.close span:nth-of-type(1) {
  transform: translateY(15px) rotate(-40deg);
}
.btn_wrap .btn_box.close span:nth-of-type(2) {
  left: 50%;
  opacity: 0;
}
.btn_wrap .btn_box.close span:nth-of-type(3) {
  transform: translateY(-15px) rotate(40deg);
}

/* .google_search_wrap */
.google_search_wrap {
  width: 100%;
  max-width: 86.6666%;
  margin: 25px auto 5px;
  order: 2;
}
.google_search_wrap .gsc-control-cse {
  padding: 0;
}
.google_search_wrap form.gsc-search-box {
  margin-bottom: 0;
}

/* Selector for entire element. */
.google_search_wrap .gsc-control-cse {
  background-color: transparent;
  border: 0;
}

/* Search input */
.google_search_wrap .gsc-input {
  font-size: 16px;
}

.google_search_wrap .gsc-input-box {
  width: 243px;
  width: 100%;
  height: 34px;
  padding: 0;
  border: 1px solid #9f9f9d;
  border-radius: 0;
  background: #fff;
}
.google_search_wrap .gsib_a {
  width: 216px;
  width: 88%;
  padding: .25em 0 .25em .5em;
}
.google_search_wrap table.gsc-search-box {
  width: 250px;
  width: calc(100% - 76px);
  margin: 0;
}
.google_search_wrap .gsc-search-box td.gsc-input {
  padding-right: 5px;
  margin: 0;
}
.google_search_wrap .gsc-search-button-v2 {
  font-size: 0;
  padding: 9.5px 31.5px;
  width: auto;
  vertical-align: middle;
  border: 0;
  border-radius: 3px;
  border-color: #fff;
  background-color: #fff;
  background-image: linear-gradient(top, #fff, #fff);
}
.google_search_wrap .gsc-results-wrapper-overlay {
  width: 90%;
  top: 80px;
  left: 50%;
  transform: translate(-50%,0);
  height: calc(80vh - 80px)!important;
}
.google_search_wrap .gsc-modal-background-image-visible {
  height: 100vh;
  background: #9f9f9d;
}

/* Search button */
.google_search_wrap .gsc-search-button-v2 {
  width: 76px;
  height: 34px;
  font-size: 0;
  padding: 0;
  vertical-align: middle;
  border: 1px solid #9f9f9d;
  border-radius: 3px;
  background-color: #9f9f9d;
  background-image: linear-gradient(top, #9f9f9d, #9f9f9d);
  transition: .25s;
}
.google_search_wrap .gsc-search-button-v2:hover {
  opacity: .7;
  border: 1px solid #9f9f9d;
  background-color: #9f9f9d;
  background-image: linear-gradient(top, #9f9f9d, #9f9f9d);
}
.google_search_wrap .gsc-search-button-v2 svg {
  fill: #fff;
}
.google_search_wrap .gsst_a {
  padding: 0 2px;
}
.google_search_wrap .gsib_b {
  display: block;
  width: 1.5em;
  height: 100%;
  margin-left: auto;
}
.google_search_wrap .gsst_b {
  top: 2px;
  right: 0;
}
.google_search_wrap .gsst_a .gscb_a {
  color: #9f9f9d;
}
.google_search_wrap .gsst_a:hover .gscb_a,
.google_search_wrap .gsst_a:focus .gscb_a {
  color: #9f9f9d;
}

/* .top_nav_wrap .nav_item */
.top_nav_wrap .nav_item {
  color: #000;
  font-size: 18px;
}

/* .top_nav_wrap .sns_wrap */
.top_nav_wrap .sns_wrap {
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
  width: 100%;
}
.top_nav_wrap .sns_wrap .nav_sns {
  display: flex;
  justify-content: center;
  height: 70px;
  padding-right: 50px;
  background: #9f9f9d;
  align-items: center;
}
.top_nav_wrap .sns_wrap li {
  width: 70px;
  text-align: center;
}
.top_nav_wrap .sns_wrap li a {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.nav_sns .nav_sns_txt {
  display: block;
  margin: 4px auto 0;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
.nav_sns .img_box {
  display: flex;
  align-items: center;
  margin-top: 2px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  justify-content: center;
}
.nav_sns .twitter img {
  width: 28px;
}

/* .top_nav_wrap */
.top_nav_wrap {
  position: fixed;
  top: 0;
  left: -100%;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  height: 100vh;
  padding-bottom: 60px;
  background-color: #fff;
  overflow-y: auto;
  transition: left ease-in-out .3s;
}
.top_nav_wrap.active {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  height: 100vh;
  padding-bottom: 60px;
  color: #000;
  overflow-y: auto;
}
.top_nav_wrap.nav_slideIn {
  width: 100%;
  left: -100%;
  right: 100%;
}
.top_nav_wrap.nav_slideOut {
  width: 100%;
  left: 100%;
  right: -100%;
}
.top_nav_wrap.active a {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-weight: 500;
  color: #000;
}

/* .nav_global */
.nav_global ul.nav_main {
  display: block;
  width: 100%;
  max-width: 86.6666%;
  margin: 13px auto 18px;
  text-align: center;
  background-color: #fff;
  border-top: 1px solid #000;
}
.nav_global ul.nav_main li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 77px;
  margin: 0 auto;
  font-size: 18px;
  border-bottom: 1px solid #000;
  line-height: 1.25;
}
.nav_global ul.nav_main li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  -webkit-tap-highlight-color: #9F9F9D;
}

/* .nav_global ul.sub_menu */
.nav_global.active ul.sub_menu.active {
  display: block;
  height: 100%;
}

.nav_global ul.sub_menu li {
  position: relative;
  z-index: 9;
  color: #fff;
  background: #B7B7B5;
}
.nav_global ul.sub_menu li a {
  color: #fff;
}

/* .has_children */
.has_children {
  position: relative;
}
.has_children.open li {
  background: #9F9F9D;
  color: #fff;
}
.has_children.open a {
  color: #fff;
}

.has_children .sub_menu {
  display: none;
}
.has_children .menu_open {
  position: absolute;
  top: 38px;
  transform: translate(0,-50%);
  right: 9px;
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/common/ico_open_sp.svg);
  background-size: 22px;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 99;
}
.has_children .menu_open.active {
  background-image: url(../images/common/ico_close_sp.svg);
  background-size: 22px;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #fff;
}
.has_children .menu_open .txt {
  display: none;
}

/* .nav_other_wrap */
.nav_other_wrap {
  display: flex;
  align-items: center;
  flex-direction: column;
  height: 100%;
  padding: 5px 0 40px;
}
.nav_other_wrap li {
  margin-right: 17px;
  margin-bottom: 9px;
  font-weight: 500;
  text-align: center;
}
.nav_other_wrap .nav_other_01 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}
.nav_other_wrap .nav_other_01 li {
  margin-right: 17px;
  font-weight: 500;
}
.nav_other_wrap .nav_other_01 li:nth-of-type(3n) {
  margin-right: 0;
}
.nav_other_wrap a.underline::after {
  background-color: #000;
}

/* .top_content */
.top_content .fv {
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.top_content .fv .metaslider {
  height: auto;
}
