@charset "UTF-8";
/* style.cssにて 1rem = 10px 設定*/
/*==============================================
インナー
===============================================*/
.contents-inner {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

/*==============================================
ヘッダーメニュー トップページ以外
===============================================*/
@media screen and (max-width: 767px) {
  .header_logo img {
    width: 200px;
  }
}
@media screen and (min-width: 768px) {
  .header_logo img {
    width: calc((100vw - 375px) * 0.0103559871 + 200px);
  }
}
@media screen and (min-width: 1920px) {
  .header_logo img {
    width: 11.25vw;
  }
}

/*==============================================
ハンバーガーメニュー
===============================================*/
.openbtn {
  position: fixed;
  background: #0084CC;
  cursor: pointer;
  width: 110px;
  height: 110px;
  z-index: 99999;
}
@media screen and (min-width: 768px) {
  .openbtn {
    width: calc((100vw - 375px) * 0.0388349515 + 50px);
    height: calc((100vw - 375px) * 0.0388349515 + 50px);
  }
}
@media screen and (min-width: 1920px) {
  .openbtn {
    width: 5.7291666667vw;
    height: 5.7291666667vw;
  }
}
@media screen and (max-width: 767px) {
  .openbtn {
    width: 50px;
    height: 50px;
  }
}

/*ボタン内側*/
.openbtn span {
  display: inline-block;
  transition: all 0.4s; /*アニメーションの設定*/
  position: absolute;
  left: 50%;
  height: 1px;
  background: #fff;
  width: 40%;
  transform: translateX(-50%);
}

.openbtn span:nth-of-type(1) {
  top: 35%;
}

.openbtn span:nth-of-type(2) {
  top: 45%;
}

.openbtn span:nth-of-type(3) {
  top: 55%;
}

.openbtn.active span:nth-of-type(1) {
  top: 40%;
  left: 50%;
  transform: translate(-50%, 20%) rotate(-45deg);
  width: 50%;
}
@media screen and (max-width: 767px) {
  .openbtn.active span:nth-of-type(1) {
    top: 50%;
  }
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0; /*真ん中の線は透過*/
}

.openbtn.active span:nth-of-type(3) {
  top: 40%;
  left: 50%;
  transform: translate(-50%, -20%) rotate(45deg);
  width: 50%;
}
@media screen and (max-width: 767px) {
  .openbtn.active span:nth-of-type(3) {
    top: 50%;
  }
}

.openbtn::after {
  content: "MENU";
  color: #fff;
  position: absolute;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -20%);
  -webkit-transform: translate(-50%, -20%);
  -ms-transform: translate(-50%, -20%);
}
@media screen and (max-width: 767px) {
  .openbtn::after {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .openbtn::after {
    font-size: calc((100vw - 375px) * 0.0025889968 + 9px);
  }
}
@media screen and (min-width: 1920px) {
  .openbtn::after {
    font-size: 0.6770833333vw;
  }
}

.openbtn.active::after {
  content: "CLOSE";
  color: #fff;
  position: absolute;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -20%);
  -webkit-transform: translate(-50%, -20%);
  -ms-transform: translate(-50%, -20%);
}
@media screen and (max-width: 767px) {
  .openbtn.active::after {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .openbtn.active::after {
    font-size: calc((100vw - 375px) * 0.0025889968 + 9px);
  }
}
@media screen and (min-width: 1920px) {
  .openbtn.active::after {
    font-size: 0.6770833333vw;
  }
}

/*メニュー左寄せ ==============================================*/
.openbtn.leftBtn {
  top: 0;
  right: 0;
}

/*==============================================
OPENメニュー
===============================================*/
#menu {
  position: fixed;
  width: 100%;
  height: 100vh;
  background: #fff;
  overflow: auto;
  /* IE, Edge 対応 */
  -ms-overflow-style: none;
  /* Firefox 対応 */
  scrollbar-width: none;
}

#menu.panelactive::-webkit-scrollbar {
  display: none;
}

#menu.panelactive {
  z-index: 999;
}

#menu.panelactive #menu-list {
  position: fixed;
  z-index: 999;
  height: 100vh;
  overflow: auto;
  /* -webkit-overflow-scrolling: touch; */
  /* IE, Edge 対応 */
  -ms-overflow-style: none;
  /* Firefox 対応 */
  scrollbar-width: none;
}

#menu.panelactive #menu-list::-webkit-scrollbar {
  display: none;
}

/*メニュー右から左に ==============================================*/
#menu.slieRight {
  z-index: 999;
  top: 0;
  right: -120%;
  transition: all 0.6s;
}

#menu.slieRight #menu-list {
  /* width: 80%; */
  position: absolute;
  /* right: 0; */
  margin-top: 100px;
}

#menu.slieRight.panelactive {
  right: 0;
}

#menu.slieRight.panelactive #menu-list {
  position: absolute;
  right: 0;
  margin-top: 5.2083333333vw;
}

/*ナビゲーション ====================================================*/
#menu .menu-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#menu .menu-top .contact-btn {
  /* margin-right: 5%; */
}

#menu .menu-top .contact-btn a {
  /* background-color: #0084CC;
  color: #fff;
  font-size: 1.6rem;
  font-family: 'Padauk', sans-serif;
  font-weight: 700;
  padding: 0.5em 3em;
  border-radius: 50px;
  position: relative; */
}

#menu .menu-top .contact-btn a::before {
  content: "";
  background: url("../img/mail-icon.svg") no-repeat center center/cover;
  width: 17px;
  height: 12px;
  display: inline-block;
  margin-right: 10px;
  vertical-align: -0.05em;
}

#menu ul {
  /* padding: 50px 0 200px; */
  /* padding: 50px 0 0px; */
  box-sizing: border-box;
}

/* #menu ul.menu-panel {
    display: none;
    z-index: 999;
} */
@media screen and (min-width: 768px) {
  #menu ul.menu-panel li {
    margin-bottom: 1.5625vw;
  }
}
#menu ul.menu-panel .menu-item-en {
  font-family: "Montserrat", sans-serif;
  /* font-size: 1.5rem;
  font-weight: 700;
  color: #0084CC;
  margin-bottom: 0em; */
}

#menu ul.menu-panel dt .menu-item-ja {
  font-family: "Noto Sans JP", sans-serif;
  /* color: #C3C3C3; */
  /* margin-left: 1em; */
  font-size: 1.5rem;
  font-weight: 400;
  color: #0084CC;
}
@media screen and (min-width: 768px) {
  #menu ul.menu-panel dt .menu-item-ja {
    font-size: calc((100vw - 375px) * 0.0025889968 + 11px);
  }
}
@media screen and (min-width: 1920px) {
  #menu ul.menu-panel dt .menu-item-ja {
    font-size: 0.78125vw;
  }
}

#menu ul.menu-panel dd {
  font-size: 1.6rem;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  #menu ul.menu-panel dd {
    font-size: calc((100vw - 375px) * 0.0012944984 + 14px);
  }
}
@media screen and (min-width: 1920px) {
  #menu ul.menu-panel dd {
    font-size: 0.8333333333vw;
  }
}

#menu.panelactive ul.menu-panel {
  display: block;
  /* display: flex; */
  /* flex-flow: column; */
  /* flex-wrap: wrap; */
}

/*リストのレイアウト設定 ==============================================*/
#menu li {
  list-style: none;
  text-align: left;
  width: 90%;
}

/*==============================================
style.cssより移動
===============================================*/
ul.menu-panel li dl dt a .menu-item-en {
  color: #000;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  ul.menu-panel li dl dt a .menu-item-en {
    font-size: calc((100vw - 375px) * 0.0122977346 + 17px);
  }
}
@media screen and (min-width: 1920px) {
  ul.menu-panel li dl dt a .menu-item-en {
    font-size: 1.875vw;
  }
}

ul.menu-panel li dl dt a span .menu-item-ja {
  color: #0084CC;
  font-weight: normal;
}
@media screen and (min-width: 768px) {
  ul.menu-panel li dl dt a span .menu-item-ja {
    font-size: calc((100vw - 375px) * 0.0006472492 + 11px);
  }
}

/*==============================================
2022年09月　追記
===============================================*/
#menu {
  background: #fff url(../img/nav-bg-pc.png) no-repeat;
  background-size: 90%;
  background-position: top -50% right;
}
@media screen and (max-width: 767px) {
  #menu {
    background-size: cover;
    background-position: top 0% right 20%;
  }
}

.menu-panel-wrap {
  display: flex;
}

.menu-panel-wrap .menu-panel {
  width: 48%;
}

ul.menu-panel li dl dt {
  border-bottom: 1px solid #848484;
}
@media screen and (min-width: 768px) {
  ul.menu-panel li dl dt {
    margin-bottom: 1.5625vw;
    margin-top: 2.6041666667vw;
  }
}

ul.menu-panel li dl dd a {
  color: #303030;
  position: relative;
}
@media screen and (min-width: 768px) {
  ul.menu-panel li dl dd a {
    padding-left: 1.0416666667vw;
  }
}

@media screen and (min-width: 768px) {
  ul.menu-panel li dl dd {
    margin-bottom: 0.5208333333vw;
    margin-left: 1.5625vw;
  }
}

ul.menu-panel li dl dt a span {
  display: block;
}

ul.menu-panel li dl dt a {
  display: flex;
  align-items: center;
  /* padding-bottom: 2rem; */
}

ul.menu-panel li dl dt a .menu-item-en {
  /* padding-bottom: 2.8rem; */
}
@media screen and (min-width: 768px) {
  ul.menu-panel li dl dt a .menu-item-en {
    padding-left: 0.7291666667vw;
  }
}

ul.menu-panel li dl dt a .menu-item-ja {
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  ul.menu-panel li dl dt a .menu-item-ja {
    padding: 0px 3.125vw;
  }
}

ul.menu-panel li dl dd a::before {
  color: #303030;
  position: absolute;
  content: "-";
  left: 0;
}

#menu.slieRight.panelactive #menu-list {
  width: 80%;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 1920px) {
  #menu.slieRight.panelactive #menu-list {
    width: 58.3333333333%;
  }
}

#menu .menu-panel .contact-btn .btn {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .menu-footer-txt {
    font-size: calc((100vw - 375px) * 0.0006472492 + 12px);
  }
}
@media screen and (min-width: 1920px) {
  .menu-footer-txt {
    font-size: 0.6770833333vw;
  }
}

@media screen and (min-width: 768px) {
  .menu-footer {
    padding-bottom: 4.53125vw;
  }
}

/*==============================================
スマホ用
===============================================*/
#menu-list-sp .menu-panel-sp {
  /*矢印の位置と向き*/
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp {
    display: block;
    padding: 8rem 3.4rem 2rem;
  }
}
#menu-list-sp .menu-panel-sp > li {
  width: 100%;
  position: relative;
}
#menu-list-sp .menu-panel-sp > li:not([class])::after {
  position: absolute;
  content: "";
  right: 2rem;
  top: 50%;
  width: 4px;
  height: 4px;
  border-top: 1px solid #0084CC;
  border-right: 1px solid #0084CC;
  transform: rotate(45deg) translateY(-50%);
  vertical-align: middle;
}
#menu-list-sp .menu-panel-sp > li a {
  display: flex;
  align-items: center;
}
#menu-list-sp .menu-panel-sp > li a span {
  display: block;
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp li.has-child ul,
#menu-list-sp .menu-panel-sp li.has-child ul ul {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    visibility: visible; /*JSで制御するため一旦表示*/
    opacity: 1; /*JSで制御するため一旦表示*/
    display: none; /*JSのslidetoggleで表示させるため非表示に*/
    transition: none; /*JSで制御するためCSSのアニメーションを切る*/
  }
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp .menu-link-main {
    border-bottom: 1px solid #848484;
    padding: 20px 8px 12px;
  }
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp li.has-child {
    position: relative;
  }
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp li.has-child::before, #menu-list-sp .menu-panel-sp li.has-child::after {
    position: absolute;
    content: "";
    width: 8px;
    height: 1px;
    background-color: #0B84CC;
  }
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp li.has-child::before {
    top: 34px;
    transform: rotate(0deg);
    right: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp li.has-child::after {
    top: 34px;
    right: 1.5rem;
    transform: rotate(90deg);
  }
}
@media screen and (max-width: 767px) {
  #menu-list-sp .menu-panel-sp li.has-child.active::before {
    transform: rotate(0deg);
    top: 34px;
  }
}
#menu-list-sp .menu-panel-sp li.has-child.active::after {
  display: none;
}
#menu-list-sp .menu-panel-sp .child-link {
  margin-top: 1rem;
}
#menu-list-sp .menu-panel-sp .child-link li {
  font-size: 11px;
  padding: 1.6rem 1.4rem;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 80%;
  border-bottom: 1px solid #848484;
}
#menu-list-sp .menu-panel-sp .child-link li a {
  color: #0084CC;
}
#menu-list-sp .menu-panel-sp .child-link li::before {
  position: absolute;
  content: "";
  left: 0rem;
  top: 50%;
  width: 4px;
  height: 1px;
  border-top: 1px solid #0084CC;
  transform: translateY(-50%);
  vertical-align: middle;
}
#menu-list-sp .menu-panel-sp .child-link li::after {
  position: absolute;
  content: "";
  right: 2rem;
  top: 50%;
  width: 4px;
  height: 4px;
  border-top: 1px solid #0084CC;
  border-right: 1px solid #0084CC;
  transform: rotate(45deg) translateY(-50%);
  vertical-align: middle;
}
#menu-list-sp .menu-panel-sp .menu-item-en {
  font-size: 1.7rem;
  color: #000;
  font-family: "Montserrat", "Padauk", sans-serif;
  font-weight: bold;
  width: 40.625%;
}
#menu-list-sp .menu-panel-sp .menu-item-ja {
  font-size: 1.1rem;
  color: #0084CC;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  #menu-list-sp .contact-btn-sp {
    padding: 1rem 3.4rem 2rem;
  }
}
#menu-list-sp .btn-contact::before {
  position: absolute;
  top: 6px;
  left: 40px;
  /* transform: translateY(-50%); */
  content: "";
  background: url(../img/top/top-btn-contact.svg) no-repeat;
  background-size: contain;
  width: 70px;
  height: 43px;
}
@media screen and (max-width: 767px) {
  #menu-list-sp .btn-contact::before {
    top: 16px;
    left: 54px;
    width: 40px;
    height: 26px;
  }
}
#menu-list-sp .menu-footer-sp {
  padding: 1rem 3.4rem 3.6rem;
}
#menu-list-sp .menu-footer-sp img {
  max-width: 206px;
}
#menu-list-sp .menu-footer-txt {
  margin-top: 16px;
}
#menu-list-sp .menu-footer-txt-wrap a {
  display: block;
}
#menu-list-sp .menu-footer-txt-wrap .menu-footer-img-pin {
  margin-bottom: -2px;
  margin-left: 2px;
}
#menu-list-sp .menu-footer-txt-wrap .menu-footer-img-tel {
  margin-bottom: -2px;
  margin-right: 2px;
}

#menu #menu-list-sp .has-child .child-link {
  text-align: right;
}
/*# sourceMappingURL=open.css.map */