/*============================
TOP
============================*/
.p-hero__top {
  overflow: hidden;
}

/*============================
TOP seriesBnr
============================*/
.p-hero__bnr {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.p-hero__bnr img {
  margin: auto;
}

.p-hero__bnr .p-in-sub {
  position: absolute;
  z-index: 49;
  left: 70px;
  top: 0;
  width: 100%;
  width: calc(100vw - 70px);
  width: 210px;
  height: 100%;
  display: block;
  -webkit-transition: opacity 0.5s ease, visibility 0.5s ease;
  transition: opacity 0.5s ease, visibility 0.5s ease;
  visibility: hidden;
  opacity: 0;
}

.p-hero__bnr .p-in-sub .p-in-sub__inner {
  height: 100%;
}

.p-hero__bnr .p-in-sub__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  height: 100%;
}

.p-hero__bnr .p-in-sub__list .p-hero__bnr-item {
  width: 70px;
}

.p-hero__bnr .p-in-sub__list .p-hero__bnr-item:nth-of-type(1) {
  background: #eef8ff;
}

.p-hero__bnr .p-in-sub__list .p-hero__bnr-item:nth-of-type(2) {
  background: #fff1f8;
}

.p-hero__bnr .p-in-sub__list .p-hero__bnr-item:nth-of-type(3) {
  background: #f7ecfa;
}

.p-hero__bnr .p-in-sub__list a {
  padding: 100px 0;
}

.p-hero__bnr:hover {
  opacity: 1;
}

.p-hero__bnr:hover .p-in-sub {
  visibility: visible;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  opacity: 1;
  -webkit-transition: opacity 0.5s ease, visibility 0.5s ease;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

/*============================
nav add
============================*/
.l-nav, .l-hamburger {
  z-index: 999;
}

.l-nav__menu-link {
  font-size: 20px;
}
@media screen and (max-width: 1800px) and (min-width: 769px) {
  .l-nav__menu-link {
    font-size: 18px;
  }
}

.l-nav__menu-item.--orange .l-nav__menu-link {
  color: #f06441;
}
.l-nav__menu-item.--orange .l-nav__menu-link::before, .l-nav__menu-item.--orange .l-nav__menu-link::after {
  background-color: #f06441;
}

@media screen and (min-width: 768px) {
  .l-nav__menu-item {
    margin-left: 20px;
  }
}
@media screen and (max-width: 1800px) and (min-width: 769px) {
  .l-nav__menu-item {
    margin: 5px 0 5px 20px;
  }
}

@media screen and (max-width: 1800px) and (min-width: 769px) {
  .l-nav__menu-list {
    margin-right: 120px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

/*============================
TOP nav
============================*/
@media screen and (max-width: 767px) {
  .l-nav__menu-odekake,
  .l-nav__menu-knapsack {
    text-align: center;
  }
}
@media screen and (min-width: 768px) {
  .l-nav__menu-odekake,
  .l-nav__menu-knapsack {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: fixed;
    top: 0;
    right: 0;
    width: 154px;
    height: 68px;
    background: -webkit-gradient(linear, left top, right top, from(#e6f3ff), to(#fff));
    background: linear-gradient(to right, #e6f3ff, #fff);
  }
  .l-nav__menu-odekake a,
  .l-nav__menu-knapsack a {
    -webkit-transition: opacity 0.5s ease, visibility 0.5s ease;
    transition: opacity 0.5s ease, visibility 0.5s ease;
  }
  .l-nav__menu-odekake a:hover,
  .l-nav__menu-knapsack a:hover {
    opacity: 0.5;
  }
  .l-nav__menu-odekake:hover,
  .l-nav__menu-knapsack:hover {
    opacity: 1;
  }
}
.l-nav__menu-odekake img,
.l-nav__menu-knapsack img {
  width: 120px;
  height: auto;
  margin: auto;
}

@media screen and (min-width: 768px) {
  .l-nav__menu-odekake .p-in-sub_nav,
  .l-nav__menu-knapsack .p-in-sub_nav {
    display: block;
    position: fixed;
    top: 69px;
    left: 0;
    width: 100%;
    -webkit-transition: opacity 0.5s ease, visibility 0.5s ease;
    transition: opacity 0.5s ease, visibility 0.5s ease;
    visibility: hidden;
    opacity: 0;
  }
  .l-nav__menu-odekake .p-in-sub_nav .p-in-sub__inner,
  .l-nav__menu-knapsack .p-in-sub_nav .p-in-sub__inner {
    width: 100%;
  }
  .l-nav__menu-odekake .p-in-sub_nav .p-in-sub__inner .p-in-sub__content,
  .l-nav__menu-knapsack .p-in-sub_nav .p-in-sub__inner .p-in-sub__content {
    width: 100%;
  }
  .l-nav__menu-odekake .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---odekake,
  .l-nav__menu-odekake .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---knapsack,
  .l-nav__menu-knapsack .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---odekake,
  .l-nav__menu-knapsack .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---knapsack {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 70px;
    background: rgba(247, 236, 250, 0.9);
  }
  .l-nav__menu-odekake .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---odekake .l-nav__menu-item,
  .l-nav__menu-odekake .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---knapsack .l-nav__menu-item,
  .l-nav__menu-knapsack .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---odekake .l-nav__menu-item,
  .l-nav__menu-knapsack .p-in-sub_nav .p-in-sub__inner .p-in-sub__content .l-nav__menu-list---knapsack .l-nav__menu-item {
    margin-left: 2.5%;
  }
}
/*============================
nav SP
============================*/
@media screen and (max-width: 767px) {
  .l-nav__bnr {
    position: relative;
    top: 0;
  }
}
@media screen and (max-width: 767px) {
  .is-menu-open .l-nav__bnr {
    -webkit-transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 1.4s, -webkit-transform 0.5s cubic-bezier(0.5, 1, 0.89, 1) 1.4s;
    transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 1.4s, -webkit-transform 0.5s cubic-bezier(0.5, 1, 0.89, 1) 1.4s;
    transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 1.4s, transform 0.5s cubic-bezier(0.5, 1, 0.89, 1) 1.4s;
    transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 1.4s, transform 0.5s cubic-bezier(0.5, 1, 0.89, 1) 1.4s, -webkit-transform 0.5s cubic-bezier(0.5, 1, 0.89, 1) 1.4s;
  }
}
.l-nav__bnr-list {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .l-nav__block {
    padding: 5vw 0 10.4vw;
  }
}
@media screen and (max-width: 767px) {
  .l-nav__block .l-nav__menu-odekake,
  .l-nav__block .l-nav__menu-knapsack,
  .l-nav__block .l-nav__menu-list {
    width: 100vw;
  }
}
@media screen and (max-width: 767px) {
  .l-nav__block .l-nav__menu-odekake .-logo.is-sp img,
  .l-nav__block .l-nav__menu-knapsack .-logo.is-sp img,
  .l-nav__block .l-nav__menu-list .-logo.is-sp img {
    height: 80px;
    width: auto;
    margin: auto;
  }
}
@media screen and (max-width: 767px) {
  .l-nav__block .l-nav__menu-odekake .l-nav__menu-link,
  .l-nav__block .l-nav__menu-knapsack .l-nav__menu-link,
  .l-nav__block .l-nav__menu-list .l-nav__menu-link {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  .l-nav__block .l-nav__menu-odekake .l-nav__menu-item,
  .l-nav__block .l-nav__menu-knapsack .l-nav__menu-item,
  .l-nav__block .l-nav__menu-list .l-nav__menu-item {
    margin-top: 4.2vw;
  }
}
@media screen and (max-width: 767px) {
  .l-nav__menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

/*============================
footer
============================*/
@media screen and (min-width: 768px) {
  .l-footer__outer {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
}

.l-footer__bnr-item + .l-footer__bnr-item {
  margin-top: 10px;
}