@charset "UTF-8";
/* ----------------------------------------------------
	sassを使用しています。css編集の際はご注意ください。
	compass/scss
---------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&family=Zen+Maru+Gothic:wght@300;400;500;700;900&display=swap");
/* ----------------------------------------------------
base
---------------------------------------------------- */
html, body {
  padding: 0;
  margin: 0;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 400;
  color: #232323;
}
@media (max-width: 1024px) {
  html, body {
    font-size: 1.758vw;
  }
}
@media (max-width: 820px) {
  html, body {
    font-size: 2.083vw;
  }
}
@media (max-width: 599px) {
  html, body {
    font-size: 4.103vw;
  }
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
}

ul {
  list-style: none;
  box-sizing: border-box;
}
ul li {
  box-sizing: border-box;
}

/* ----------------------------------------------------
selection
---------------------------------------------------- */
::selection {
  background: #ddd;
  color: #fff;
}

::-moz-selection {
  background: #ddd;
  color: #fff;
}

/* ----------------------------------------------------
link
---------------------------------------------------- */
a {
  color: #232323;
  text-decoration: none;
  transition: 0.2s ease-in-out;
}
@media (max-width: 599px) {
  a {
    transition: none;
  }
}
a:visited {
  text-decoration: none;
  color: #232323;
}
a:hover {
  color: #232323;
  opacity: 0.6;
}
a:active {
  color: #232323;
}
a.link {
  color: #004f84;
}
a.underline {
  border-bottom: 1px solid #004f84;
}

/* ----------------------------------------------------
flex
---------------------------------------------------- */
.flex {
  display: flex;
}

.flex-btw {
  display: flex;
  justify-content: space-between;
}

.flex-center {
  display: flex;
  justify-content: center;
}
.flex-center .btn01 {
  margin-left: 20px;
  margin-right: 20px;
  width: 32% !important;
}
@media (max-width: 820px) {
  .flex-center .btn01 {
    margin-left: 2.604vw;
    margin-right: 2.604vw;
  }
}
@media (max-width: 599px) {
  .flex-center .btn01 {
    margin: 25px 0 0 0;
    width: 100% !important;
  }
}

.wrap {
  flex-wrap: wrap;
}

@media (max-width: 599px) {
  .sp-wrap {
    flex-wrap: wrap;
  }
}

/* ----------------------------------------------------
font
---------------------------------------------------- */
.fs26 {
  font-size: 26px;
}
@media (max-width: 1024px) {
  .fs26 {
    font-size: 3.385vw;
  }
}
@media (max-width: 820px) {
  .fs26 {
    font-size: 3.385vw;
    line-height: 1.5;
  }
}

.fs30 {
  font-size: 30px;
}
@media (max-width: 1024px) {
  .fs30 {
    font-size: 2.93vw;
  }
}
@media (max-width: 820px) {
  .fs30 {
    font-size: 3.906vw;
  }
}
@media (max-width: 599px) {
  .fs30 {
    font-size: 5.128vw;
    line-height: 1.3;
  }
}

.fs24 {
  font-size: 24px;
}
@media (max-width: 1024px) {
  .fs24 {
    font-size: 2.344vw;
  }
}
@media (max-width: 820px) {
  .fs24 {
    font-size: 3.125vw;
  }
}
@media (max-width: 599px) {
  .fs24 {
    font-size: 5.128vw;
  }
}

.fs22 {
  font-size: 22px;
}
@media (max-width: 1024px) {
  .fs22 {
    font-size: 2.148vw;
  }
}
@media (max-width: 820px) {
  .fs22 {
    font-size: 2.865vw;
  }
}
@media (max-width: 599px) {
  .fs22 {
    font-size: 5.128vw;
  }
}

.fs20 {
  font-size: 20px;
}
@media (max-width: 1024px) {
  .fs20 {
    font-size: 1.953vw;
  }
}
@media (max-width: 820px) {
  .fs20 {
    font-size: 2.604vw;
  }
}
@media (max-width: 599px) {
  .fs20 {
    font-size: 4.615vw;
    line-height: 1.5;
  }
}

.fs18 {
  font-size: 18px;
}
@media (max-width: 1024px) {
  .fs18 {
    font-size: 1.758vw;
  }
}
@media (max-width: 820px) {
  .fs18 {
    font-size: 2.344vw;
  }
}
@media (max-width: 599px) {
  .fs18 {
    font-size: 4.103vw;
  }
}

.fs16 {
  font-size: 16px;
}
@media (max-width: 1024px) {
  .fs16 {
    font-size: 1.563vw;
  }
}
@media (max-width: 820px) {
  .fs16 {
    font-size: 2.083vw;
  }
}
@media (max-width: 599px) {
  .fs16 {
    font-size: 3.846vw;
  }
}

.text-bold {
  font-weight: bold;
}

.f_weight_400 {
  font-weight: 400;
}

.f_weight_500 {
  font-weight: 500;
}

.f_weight_700 {
  font-weight: 700;
}

.f_weight_900 {
  font-weight: 900;
}

/* ----------------------------------------------------
other set
---------------------------------------------------- */
@media (max-width: 820px) {
  .pc-view {
    display: none;
  }
}

.tb-view {
  display: none;
}
@media (max-width: 1024px) {
  .tb-view {
    display: block;
  }
}

@media (max-width: 1024px) {
  .tb-none {
    display: none;
  }
}

.sp-view {
  display: none;
}
@media (max-width: 599px) {
  .sp-view {
    display: block;
  }
}

.mt0 {
  margin-top: 0 !important;
}

.mt100 {
  margin-top: 100px !important;
}
@media (max-width: 1024px) {
  .mt100 {
    margin-top: 9.766vw !important;
  }
}
@media (max-width: 820px) {
  .mt100 {
    margin-top: 13.021vw !important;
  }
}

.mt0 {
  margin-top: 0 !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.indent-01 {
  margin-bottom: 0;
  padding-left: -16px;
  text-indent: 16px;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.red {
  color: #dd4536;
}

/* ----------------------------------------------------
title
---------------------------------------------------- */
h2 {
  margin-bottom: 20px;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: 40px;
  line-height: 1.5;
  font-weight: 700;
}
@media (max-width: 1024px) {
  h2 {
    margin-bottom: 1.953vw;
    font-size: 3.906vw;
  }
}
@media (max-width: 820px) {
  h2 {
    margin-bottom: 2.439vw;
    font-size: 4.688vw;
  }
}
@media (max-width: 599px) {
  h2 {
    font-size: 5.641vw;
  }
}

h3 {
  margin-bottom: 20px;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: 30px;
  line-height: 1.5;
  font-weight: 700;
}
@media (max-width: 1024px) {
  h3 {
    margin-bottom: 1.953vw;
    font-size: 2.93vw;
  }
}
@media (max-width: 820px) {
  h3 {
    margin-bottom: 2.439vw;
    font-size: 3.646vw;
  }
}
@media (max-width: 599px) {
  h3 {
    font-size: 5.128vw;
  }
}

h4 {
  margin-bottom: 20px;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: 26px;
  line-height: 1.5;
  font-weight: 700;
}
@media (max-width: 1024px) {
  h4 {
    margin-bottom: 1.953vw;
    font-size: 2.539vw;
  }
}
@media (max-width: 820px) {
  h4 {
    margin-bottom: 2.439vw;
    font-size: 3.125vw;
  }
}
@media (max-width: 599px) {
  h4 {
    font-size: 4.615vw;
  }
}

h5 {
  margin-bottom: 20px;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: 24px;
  line-height: 1.5;
  font-weight: 900;
}
@media (max-width: 1024px) {
  h5 {
    margin-bottom: 1.953vw;
    font-size: 2.344vw;
  }
}
@media (max-width: 820px) {
  h5 {
    margin-bottom: 2.439vw;
    font-size: 2.865vw;
  }
}
@media (max-width: 599px) {
  h5 {
    font-size: 4.359vw;
  }
}

h6 {
  margin-bottom: 20px;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: 20px;
  line-height: 1.5;
  font-weight: 900;
}
@media (max-width: 1024px) {
  h6 {
    margin-bottom: 1.953vw;
    font-size: 1.953vw;
  }
}
@media (max-width: 820px) {
  h6 {
    margin-bottom: 2.439vw;
    font-size: 2.344vw;
  }
}
@media (max-width: 599px) {
  h6 {
    font-size: 4.359vw;
  }
}

p {
  margin-bottom: 25px;
}
@media (max-width: 1024px) {
  p {
    margin-bottom: 2.441vw;
  }
}
@media (max-width: 820px) {
  p {
    margin-bottom: 3.255vw;
  }
}
@media (max-width: 599px) {
  p {
    margin-bottom: 5.128vw;
  }
}
p + h2,
p + h3,
p + h4,
p + h5,
p + h6 {
  margin-top: calc(100px - 25px);
}
@media (max-width: 1024px) {
  p + h2,
  p + h3,
  p + h4,
  p + h5,
  p + h6 {
    margin-top: calc(9.766vw - 2.441vw);
  }
}
@media (max-width: 820px) {
  p + h2,
  p + h3,
  p + h4,
  p + h5,
  p + h6 {
    margin-top: calc(13.021vw - 3.255vw);
  }
}
@media (max-width: 599px) {
  p + h2,
  p + h3,
  p + h4,
  p + h5,
  p + h6 {
    margin-top: calc(25.641vw - 12.821vw);
  }
}

.title_underline {
  padding-bottom: 14px;
  margin-bottom: 50px;
  border-bottom: 1px solid #232323;
}
@media (max-width: 1024px) {
  .title_underline {
    padding-bottom: 1.367vw;
    margin-bottom: 4.883vw;
  }
}
@media (max-width: 820px) {
  .title_underline {
    padding-bottom: 1.707vw;
    margin-bottom: 6.51vw;
  }
}
@media (max-width: 599px) {
  .title_underline {
    margin-bottom: 6.41vw;
  }
}

/* ----------------------------------------------------
header
---------------------------------------------------- */
header {
  height: 100px;
  background: #fff;
  border-bottom: 1px solid #ddd;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100;
}
@media (max-width: 599px) {
  header {
    height: 60px;
  }
}
header .header_inner {
  margin: 0 auto;
  max-width: 1920px;
  height: 100%;
  display: flex;
  align-items: center;
}
@media (max-width: 1024px) {
  header .header_inner .search {
    display: none;
  }
}
header .header_inner.sp-navi-open {
  display: block;
}
header .header_inner.sp-navi-open h1 {
  display: none;
}
header.UpMove {
  animation: UpAnime 0.5s forwards;
}
header.DownMove {
  animation: DownAnime 0.5s forwards;
}

@keyframes UpAnime {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(-100px);
  }
}
@keyframes DownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
h1 {
  padding: 0 40px;
  line-height: 0;
}
@media (max-width: 1920px) {
  h1 {
    padding: 0 1.042vw 0 2.083vw;
  }
}
@media (max-width: 1024px) {
  h1 {
    padding: 0 3.906vw;
  }
}
@media (max-width: 820px) {
  h1 {
    padding: 0 4.878vw;
  }
}
@media (max-width: 599px) {
  h1 {
    padding: 0 0 0 3.077vw;
    width: 33.846vw;
  }
}
h1 img {
  width: 214px;
  height: 55px;
}
@media (max-width: 1024px) {
  h1 img {
    width: 20.898vw;
    height: 5.371vw;
  }
}
@media (max-width: 820px) {
  h1 img {
    width: 26.098vw;
    height: 6.707vw;
  }
}
@media (max-width: 599px) {
  h1 img {
    width: 100%;
    height: auto;
  }
}
@media (max-width: 599px) {
  h1 .pcver {
    display: none;
  }
}
h1 .spver {
  display: none;
}
@media (max-width: 599px) {
  h1 .spver {
    display: block;
  }
}

.fixed {
  overflow: hidden;
  width: 100%;
  height: 100%;
}

/* search
----------------------------------- */
.search {
  margin: 0 30px;
}
.search-inr {
  display: flex;
}
@media (max-width: 1920px) {
  .search {
    margin: 0 1.563vw;
  }
}
@media (max-width: 1024px) {
  .search {
    margin: 0 3.255vw 4.883vw 3.255vw;
  }
}
@media (max-width: 820px) {
  .search {
    margin: 0 3.255vw 3.255vw 3.255vw;
  }
}
@media (max-width: 599px) {
  .search {
    margin: 5.128vw;
  }
}
.search input {
  border: 0;
  box-sizing: border-box;
}
.search input[type="text"] {
  padding: 0 10px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  width: 753px;
  height: 48px;
  border: 1px solid #ddd;
}
@media (max-width: 1920px) {
  .search input[type="text"] {
    width: 39.219vw;
  }
}
@media (max-width: 1440px) {
  .search input[type="text"] {
    width: 32.639vw;
  }
}
@media (max-width: 820px) {
  .search input[type="text"] {
    width: 80.469vw;
    font-size: 1.951vw;
  }
}
@media (max-width: 599px) {
  .search input[type="text"] {
    font-size: 3.846vw;
    width: 74.359vw;
    height: 44px;
  }
}
.search input[type="text"]::placeholder {
  color: #969696;
}
.search input[type="submit"] {
  width: 100px;
  height: 48px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  background: #004f84;
}
@media (max-width: 1920px) {
  .search input[type="submit"] {
    width: 5.208vw;
  }
}
@media (max-width: 820px) {
  .search input[type="submit"] {
    width: 12.195vw;
    font-size: 1.951vw;
  }
}
@media (max-width: 599px) {
  .search input[type="submit"] {
    font-size: 3.846vw;
    width: 15.385vw;
    height: 44px;
  }
}

/* nav
----------------------------------- */
.gnavi_overlay {
  display: none;
}
@media (max-width: 599px) {
  .gnavi_overlay {
    width: 100%;
    height: 100vh;
    background: #fff;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 20;
  }
}
.gnavi_overlay.open {
  display: block;
}

nav {
  display: flex;
  justify-content: flex-end;
  flex-grow: 3;
}
@media (max-width: 599px) {
  nav {
    margin-right: 60px;
  }
}
nav .nav_item {
  width: 120px;
  height: 100px;
  font-weight: 500;
}
@media (max-width: 1024px) {
  nav .nav_item {
    width: 11.719vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item {
    width: 14.634vw;
  }
}
@media (max-width: 599px) {
  nav .nav_item {
    width: auto;
    height: 60px;
  }
}
nav .nav_item a {
  padding-bottom: 22px;
  font-size: 14px;
  line-height: 1.0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  border-left: 1px solid #ddd;
}
@media (max-width: 1024px) {
  nav .nav_item a {
    padding-bottom: 2.148vw;
    font-size: 1.367vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item a {
    padding-bottom: 2.683vw;
    font-size: 1.707vw;
  }
}
@media (max-width: 599px) {
  nav .nav_item a {
    padding-left: 2.133vw;
    padding-right: 2.133vw;
    border-left: 0;
    font-size: 2.667vw;
  }
}
@media (max-width: 599px) {
  nav .nav_item.menu01 {
    display: none;
  }
}
nav .nav_item.menu01 a:before {
  content: "";
  display: block;
  background: url(../images/cmn/icon_guide.svg) center center/100% no-repeat;
  width: 30px;
  height: 35px;
  margin-bottom: 4px;
}
@media (max-width: 1024px) {
  nav .nav_item.menu01 a:before {
    width: 2.93vw;
    height: 3.418vw;
    margin-bottom: 0.391vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item.menu01 a:before {
    width: 3.659vw;
    height: 4.268vw;
    margin-bottom: 0.488vw;
  }
}
nav .nav_item.menu02 a:before {
  content: "";
  display: block;
  background: url(../images/cmn/icon_login.svg) center center/100% no-repeat;
  width: 28px;
  height: 35px;
  margin-bottom: 4px;
}
@media (max-width: 1024px) {
  nav .nav_item.menu02 a:before {
    width: 2.734vw;
    height: 3.418vw;
    margin-bottom: 0.391vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item.menu02 a:before {
    width: 3.415vw;
    height: 4.268vw;
    margin-bottom: 0.488vw;
  }
}
@media (max-width: 599px) {
  nav .nav_item.menu02 a:before {
    width: 5.385vw;
    height: 6.154vw;
  }
}
nav .nav_item.menu03 a:before {
  content: "";
  display: block;
  background: url(../images/cmn/icon_cart.svg) center center/100% no-repeat;
  width: 34px;
  height: 35px;
  margin-bottom: 4px;
}
@media (max-width: 1024px) {
  nav .nav_item.menu03 a:before {
    width: 3.32vw;
    height: 3.418vw;
    margin-bottom: 0.391vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item.menu03 a:before {
    width: 4.146vw;
    height: 4.268vw;
    margin-bottom: 0.488vw;
  }
}
@media (max-width: 599px) {
  nav .nav_item.menu03 a:before {
    width: 6.41vw;
    height: 6.667vw;
  }
}
@media (min-width: 1920px) {
  nav .nav_item.menu04 a {
    border-right: 1px solid #ddd;
  }
}
@media (max-width: 599px) {
  nav .nav_item.menu04 {
    display: none;
  }
}
nav .nav_item.menu04 a:before {
  content: "";
  display: block;
  background: url(../images/cmn/icon_contact.svg) center center/100% no-repeat;
  width: 34px;
  height: 35px;
  margin-bottom: 4px;
}
@media (max-width: 1024px) {
  nav .nav_item.menu04 a:before {
    width: 3.32vw;
    height: 3.418vw;
    margin-bottom: 0.391vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item.menu04 a:before {
    width: 4.146vw;
    height: 4.268vw;
    margin-bottom: 0.488vw;
  }
}
nav .nav_item.mypage a:before {
  content: "";
  display: block;
  background: url(../images/cmn/icon_mypage.svg) center center/100% no-repeat;
  width: 35px;
  height: 35px;
  margin-bottom: 4px;
}
@media (max-width: 1024px) {
  nav .nav_item.mypage a:before {
    width: 3.418vw;
    height: 3.418vw;
    margin-bottom: 0.391vw;
  }
}
@media (max-width: 820px) {
  nav .nav_item.mypage a:before {
    width: 4.268vw;
    height: 4.268vw;
    margin-bottom: 0.488vw;
  }
}
@media (max-width: 599px) {
  nav .nav_item.mypage a:before {
    width: 6.154vw;
    height: 6.154vw;
  }
}
nav .sp_navi_item {
  display: none;
}
nav.open-menu {
  padding: 80px 20px 100px 20px;
  display: block;
  width: 100%;
  height: 100vh;
  position: relative;
  z-index: 40;
  overflow-y: scroll;
}
nav.open-menu .nav_item {
  margin-bottom: 5px;
  width: 100%;
  height: 56px;
  border: 1px solid #ddd;
}
nav.open-menu .nav_item a {
  padding: 0 4.615vw;
  font-size: 4.103vw;
  font-weight: 400;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
nav.open-menu .nav_item a:before {
  position: relative;
  top: 2px;
  margin-right: 14px;
}
nav.open-menu .menu01 {
  display: block;
}
nav.open-menu .menu01 a:before {
  width: 5.128vw;
  height: 5.128vw;
}
nav.open-menu .menu02 a:before {
  width: 4.615vw;
  height: 5.128vw;
}
nav.open-menu .menu03 a:before {
  width: 5.385vw;
  height: 5.641vw;
}
nav.open-menu .menu04 {
  display: block;
}
nav.open-menu .menu04 a:before {
  width: 5.128vw;
  height: 3.846vw;
}
nav.open-menu .sp_navi_item {
  margin-top: 50px;
  display: block;
}
nav.open-menu .sp_navi_item ul + ul {
  margin-top: 100px;
}
nav.open-menu .sp_navi_item ul > li > span {
  height: 56px;
  display: flex;
  align-items: center;
  border-top: 1px solid #ddd;
  order: 1;
  position: relative;
}
nav.open-menu .sp_navi_item ul > li > span:before {
  content: "";
  display: block;
  width: 2px;
  height: 16px;
  position: absolute;
  right: 7px;
  background: #232323;
  order: 2;
  transition: 0.2s ease-in-out;
}
nav.open-menu .sp_navi_item ul > li > span:after {
  content: "";
  display: block;
  width: 16px;
  height: 2px;
  background: #232323;
  order: 3;
  margin-left: auto;
  transition: 0.2s ease-in-out;
}
nav.open-menu .sp_navi_item ul > li > span.open:before {
  transform: rotate(-90deg);
}
nav.open-menu .sp_navi_item ul > li > a {
  height: 56px;
  display: flex;
  align-items: center;
  border-top: 1px solid #ddd;
}
nav.open-menu .sp_navi_item ul > li:last-child span {
  border-bottom: 1px solid #ddd;
}
nav.open-menu .sp_navi_item ul > li:last-child a {
  border-bottom: 1px solid #ddd;
}
nav.open-menu .sp_navi_item .subnavi {
  font-size: 3.846vw;
  display: none;
  border-top: 1px solid #ddd;
}
nav.open-menu .sp_navi_item .subnavi > li {
  margin: 0 18px;
}
nav.open-menu .sp_navi_item .subnavi > li:first-child a {
  border-top: 0;
}
nav.open-menu .sp_navi_item .subnavi > li:last-child a {
  border-bottom: 0;
}

/* sp-navi
----------------------------------- */
#gnavibtn {
  display: none;
}
@media (max-width: 599px) {
  #gnavibtn {
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 50;
  }
}
#gnavibtn .btn-inr {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
}
#gnavibtn .btn-inr span {
  margin: 0 auto;
  width: 25px;
  height: 2px;
  text-align: center;
  position: absolute;
  left: 0;
  right: 0;
  background: #232323;
  transition: 0.2s ease-in-out;
}
#gnavibtn .btn-inr span:first-child {
  top: 16px;
}
#gnavibtn .btn-inr span:nth-child(2) {
  top: 24px;
}
#gnavibtn .btn-inr span:nth-child(3) {
  top: 32px;
}
@media (max-width: 599px) {
  #gnavibtn .btn-inr p {
    margin-bottom: 0;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 2.133vw;
    text-align: center;
    font-size: 2.821vw;
  }
}
#gnavibtn.open .btn-inr span:first-child {
  top: 24px;
  transform: rotate(45deg);
}
#gnavibtn.open .btn-inr span:nth-child(2) {
  left: 50%;
  width: 0;
}
#gnavibtn.open .btn-inr span:nth-child(3) {
  top: 24px;
  transform: rotate(-45deg);
}

/* ----------------------------------------------------
tb-top-navi
---------------------------------------------------- */
.tb-top-navi {
  display: none;
}
@media (max-width: 820px) {
  .tb-top-navi {
    margin-bottom: 3.255vw;
    display: flex;
    justify-content: space-between;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  .tb-top-navi {
    margin-bottom: 6.41vw;
  }
}
@media (max-width: 820px) {
  .tb-top-navi div {
    width: 49.74vw;
    height: 11.719vw;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  .tb-top-navi div {
    height: 15.385vw;
  }
}
@media (max-width: 820px) {
  .tb-top-navi div a {
    padding: 0 4.146vw;
    font-size: 2.439vw;
    display: flex;
    align-items: center;
    height: 100%;
    background: #f1f1f1;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  .tb-top-navi div a {
    font-size: 3.846vw;
  }
}
@media (max-width: 820px) {
  .tb-top-navi .guide a:before {
    content: "";
    display: inline-block;
    background: url(../images/cmn/icon_guide_dark.svg) center center/100% no-repeat;
    width: 3.646vw;
    height: 3.646vw;
    margin-right: 1.302vw;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  .tb-top-navi .guide a:before {
    width: 5.128vw;
    height: 5.128vw;
  }
}
@media (max-width: 820px) {
  .tb-top-navi .tag a:before {
    content: "";
    display: inline-block;
    background: url(../images/cmn/icon_tag_dark.svg) center center/100% no-repeat;
    width: 3.646vw;
    height: 3.646vw;
    margin-right: 1.302vw;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  .tb-top-navi .tag a:before {
    width: 4.872vw;
    height: 4.872vw;
  }
}

.tb-top-navi.cart .guide {
  width: 100%;
}
.tb-top-navi.cart .guide a {
  justify-content: center;
}
.tb-top-navi.cart .tag {
  display: none;
}

/* ----------------------------------------------------
main
---------------------------------------------------- */
main {
  margin: 150px 0 200px 0;
}
@media (max-width: 1024px) {
  main {
    margin: 14.648vw 0 19.531vw 0;
  }
}
@media (max-width: 820px) {
  main {
    margin: 16.276vw 0 26.042vw 0;
  }
}
@media (max-width: 599px) {
  main {
    margin: 20.513vw 0 25.641vw 0;
  }
}
main p {
  line-height: 1.8;
}
main .search {
  display: none;
}
@media (max-width: 820px) {
  main .search {
    display: block;
  }
}

.contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (max-width: 1024px) {
  .contents {
    justify-content: center;
  }
}
.contents .main {
  width: 1016px;
}
@media (max-width: 1280px) {
  .contents .main {
    width: 52.917vw;
  }
}
@media (max-width: 1024px) {
  .contents .main {
    padding: 0 2.441vw;
    width: 100%;
  }
}
@media (max-width: 820px) {
  .contents .main {
    padding: 0 3.255vw;
  }
}
@media (max-width: 599px) {
  .contents .main {
    padding: 0 5.128vw;
  }
}
.contents .main.wide {
  width: 100%;
}
.contents .side {
  width: 224px;
}
@media (max-width: 1280px) {
  .contents .side {
    width: 11.667vw;
  }
}
@media (max-width: 1024px) {
  .contents .side {
    margin-top: 9.766vw;
    width: 100%;
  }
}
@media (max-width: 820px) {
  .contents .side .cart_area {
    display: none;
  }
}
@media (max-width: 599px) {
  .contents .side {
    margin-top: 25.641vw;
  }
}
@media (max-width: 1024px) {
  .contents .side-inr {
    padding: 0 25px;
  }
}
@media (max-width: 599px) {
  .contents .side-inr {
    padding: 0 20px;
  }
}
.contents .side-title {
  padding: 14px 0;
  font-size: 15px;
  font-weight: 500;
  background: #f1f1f1;
}
@media (max-width: 1024px) {
  .contents .side-title {
    font-size: 20px;
  }
}
@media (max-width: 820px) {
  .contents .side-title {
    padding: 20px 0;
  }
}
@media (max-width: 599px) {
  .contents .side-title {
    font-size: 16px;
  }
}
.contents .side-title#tag_search {
  padding-left: 46px;
  background: url(../images/cmn/icon_tag_dark.svg) left 14px center/20px no-repeat #f1f1f1;
}
.contents .side-title#mypage {
  padding-left: 25px;
}
.contents .side-title + .side-inr .side-navi li:first-child {
  border-top: 0;
}
.contents .side-navi {
  margin-bottom: 70px;
  font-size: 18px;
}
@media (max-width: 1024px) {
  .contents .side-navi {
    font-size: 16px;
  }
}
.contents .side-navi li {
  border-top: 1px solid #ddd;
}
.contents .side-navi li:last-child {
  border-bottom: 1px solid #ddd;
}
.contents .side-navi li a {
  padding: 20px 4px;
  display: block;
}
.contents .side-subnavi li:last-child {
  border-bottom: none;
}
.contents .side-subnavi li a {
  padding: 10px 16px;
  font-size: 15px;
}
@media (max-width: 599px) {
  .contents .side-subnavi li a {
    font-size: 3.846vw;
  }
}
.contents .side-bnr {
  margin-bottom: 50px;
}
@media (max-width: 1024px) {
  .contents .side-bnr {
    text-align: center;
  }
}
.contents .side-bnr-item {
  line-height: 0;
}
.contents .side-bnr-item img {
  max-width: 100%;
  height: auto;
}
@media (max-width: 1024px) {
  .contents .side-bnr-item img {
    width: 21.875vw;
  }
}
@media (max-width: 820px) {
  .contents .side-bnr-item img {
    width: 224px;
  }
}
.contents .side-bnr-item + .side-bnr-item {
  margin-top: 20px;
}
@media (max-width: 1024px) {
  .contents .side .widget {
    text-align: center;
  }
  .contents .side .widget .twitter-timeline {
    margin: 0 auto;
  }
}

.inner {
  margin: 0 auto;
  width: 1280px;
}
@media (max-width: 1280px) {
  .inner {
    margin: 0 25px;
    width: auto;
  }
}
@media (max-width: 1024px) {
  .inner {
    margin: 0;
  }
}

section + section {
  margin-top: 100px;
}
@media (max-width: 1024px) {
  section + section {
    margin-top: 9.766vw;
  }
}
@media (max-width: 820px) {
  section + section {
    margin-top: 13.021vw;
  }
}
@media (max-width: 599px) {
  section + section {
    margin-top: 12.821vw;
  }
}

small {
  font-size: 80%;
}

/* ----------------------------------------------------
book
---------------------------------------------------- */
.booklist {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.booklist:after {
  content: "";
  display: block;
  width: 224px;
}
@media (max-width: 1024px) {
  .booklist:after {
    width: 21.875vw;
  }
}
@media (max-width: 599px) {
  .booklist:after {
    content: none;
  }
}
.booklist:before {
  content: "";
  display: block;
  width: 224px;
  order: 1;
}
@media (max-width: 1024px) {
  .booklist:before {
    width: 21.875vw;
  }
}
@media (max-width: 599px) {
  .booklist:before {
    content: none;
  }
}
.booklist .book_item {
  width: 224px;
}
@media (max-width: 1024px) {
  .booklist .book_item {
    width: 21.875vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_item {
    margin-top: 12.821vw;
    width: 41.026vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_item:nth-child(-n+2) {
    margin-top: 0;
  }
}
.booklist .book_item:nth-child(n+5) {
  margin-top: 100px;
}
@media (max-width: 1024px) {
  .booklist .book_item:nth-child(n+5) {
    margin-top: 9.766vw;
  }
}
@media (max-width: 820px) {
  .booklist .book_item:nth-child(n+5) {
    margin-top: 13.021vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_item:nth-child(n+5) {
    margin-top: 12.821vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_container {
    padding-top: 6.4vw;
  }
}
.booklist .book_thumb {
  margin-bottom: 20px;
  text-align: center;
  line-height: 0;
  height: 220px;
}
@media (max-width: 1024px) {
  .booklist .book_thumb {
    height: 21.484vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_thumb {
    height: 52.564vw;
  }
}
.booklist .book_thumb img {
  min-width: 150px;
  max-width: 220px;
  max-height: 220px;
  object-fit: contain;
  border: 1px solid #ccc;
}
@media (max-width: 1024px) {
  .booklist .book_thumb img {
    min-width: 14.648vw;
    max-width: 21.484vw;
    max-height: 21.484vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_thumb img {
    width: 40vw;
    height: auto;
    min-width: initial;
    max-width: initial;
    max-height: initial;
    object-fit: fill;
  }
}
.booklist .copy {
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
}
@media (max-width: 820px) {
  .booklist .copy {
    margin-bottom: 0.977vw;
    font-size: 1.563vw;
  }
}
@media (max-width: 599px) {
  .booklist .copy {
    margin-bottom: 2.564vw;
    font-size: 2.083vw;
  }
}
.booklist .book_title {
  margin-bottom: 10px;
  font-size: 18px;
  line-height: 1.4;
  font-weight: bold;
}
@media (max-width: 820px) {
  .booklist .book_title {
    margin-bottom: 1.302vw;
    font-size: 2.344vw;
  }
}
@media (max-width: 599px) {
  .booklist .book_title {
    margin-bottom: 1.538vw;
    font-size: 4.103vw;
  }
}
.booklist .book_author {
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 1.3;
}
@media (max-width: 820px) {
  .booklist .book_author {
    font-size: 1.953vw;
    text-align: center;
  }
}
@media (max-width: 599px) {
  .booklist .book_author {
    margin-bottom: 1.538vw;
    font-size: 3.846vw;
  }
}
.booklist .amount {
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.4;
}
@media (max-width: 820px) {
  .booklist .amount {
    font-size: 1.953vw;
    text-align: center;
  }
}
@media (max-width: 599px) {
  .booklist .amount {
    font-size: 3.846vw;
  }
}
.booklist .amount br {
  display: none;
}
@media (max-width: 820px) {
  .booklist .amount br {
    display: block;
  }
}
@media (max-width: 599px) {
  .booklist .release_date {
    text-align: center;
  }
}

/* ----------------------------------------------------
breadcrumbs
---------------------------------------------------- */
.breadcrumbs {
  margin-top: 100px;
  display: flex;
  align-items: center;
  height: 60px;
  font-size: 13px;
  background: #fcf7f2;
}
@media (max-width: 1024px) {
  .breadcrumbs {
    padding-left: 25px;
    padding-right: 25px;
  }
}
@media (max-width: 820px) {
  .breadcrumbs {
    display: none;
  }
}
.breadcrumbs + main {
  margin-top: 100px;
}
@media (max-width: 1024px) {
  .breadcrumbs + main {
    margin-top: 14.648vw;
  }
}
@media (max-width: 820px) {
  .breadcrumbs + main {
    margin-top: 16.276vw;
  }
}
@media (max-width: 599px) {
  .breadcrumbs + main {
    margin-top: 20.513vw;
  }
}
.breadcrumbs ul {
  display: flex;
  align-items: center;
}
.breadcrumbs ul li:after {
  content: "＞";
  margin: 0 10px;
}
.breadcrumbs ul li:last-child:after {
  content: none;
}

/* ----------------------------------------------------
dl
---------------------------------------------------- */
.dl01 {
  padding: 15px 0;
  display: flex;
  align-items: center;
  border-top: 1px solid #ddd;
}
.dl01:last-child {
  border-bottom: 1px solid #ddd;
}
@media (max-width: 599px) {
  .dl01 {
    padding: 2.564vw 0;
  }
}
.dl01 dt.w_125 {
  width: 125px;
}
@media (max-width: 599px) {
  .dl01 dt.w_125 {
    width: 32.051vw;
  }
}
.dl01 dt.w_90 {
  width: 70px;
}
@media (max-width: 599px) {
  .dl01 dt.w_90 {
    width: 17.949vw;
  }
}

/* ----------------------------------------------------
list
---------------------------------------------------- */
ul.list01 {
  padding-left: 14px;
  margin-bottom: 50px;
  line-height: 1.7;
}
@media (max-width: 1024px) {
  ul.list01 {
    margin-bottom: 4.883vw;
  }
}
@media (max-width: 820px) {
  ul.list01 {
    margin-bottom: 6.51vw;
  }
}
@media (max-width: 599px) {
  ul.list01 {
    margin-bottom: 12.821vw;
  }
}
ul.list01 li {
  margin-bottom: 10px;
  text-indent: -7px;
}
ul.list01 li:before {
  content: "●";
  font-size: 10px;
  color: #dd4536;
  position: relative;
  top: -3px;
  display: inline-block;
  margin-right: 4px;
}
ul.list02 {
  margin-left: 25px;
  margin-bottom: 50px;
  list-style-type: circle;
}
@media (max-width: 1024px) {
  ul.list02 {
    margin-left: 2.441vw;
    margin-bottom: 4.883vw;
  }
}
@media (max-width: 820px) {
  ul.list02 {
    margin-left: 3.255vw;
    margin-bottom: 6.51vw;
  }
}
@media (max-width: 599px) {
  ul.list02 {
    margin-left: 6.41vw;
    margin-bottom: 12.821vw;
  }
}
ul.list02 li {
  margin-bottom: 10px;
}

/* ----------------------------------------------------
point
---------------------------------------------------- */
.point-01 {
  padding-left: 14px;
  text-indent: -7px;
}
.point-01:before {
  content: "●";
  font-size: 10px;
  color: #dd4536;
  position: relative;
  top: -3px;
  display: inline-block;
  margin-right: 4px;
}

.point-02 {
  padding-left: 14px;
  text-indent: -7px;
}
.point-02:before {
  content: "●";
  font-size: 10px;
  color: #004f84;
  position: relative;
  top: -3px;
  display: inline-block;
  margin-right: 4px;
}

/* ----------------------------------------------------
table
---------------------------------------------------- */
table {
  margin-bottom: 50px;
  width: 100%;
  box-sizing: border-box;
}
table th, table td {
  padding: 14px 20px;
  font-weight: 400;
}
@media (max-width: 1024px) {
  table th, table td {
    padding: 1.367vw 1.953vw;
  }
}
@media (max-width: 820px) {
  table th, table td {
    padding: 1.823vw 2.604vw;
  }
}
@media (max-width: 599px) {
  table th, table td {
    padding: 3.077vw 4.103vw;
    font-size: 15px;
  }
}
@media (max-width: 599px) {
  table.sp-block th {
    display: block;
    width: 100%;
  }
  table.sp-block td {
    display: block;
    width: 100%;
  }
}

.table-01 {
  border-collapse: separate;
  border-spacing: 1px;
  background: #ddd;
}
.table-01 th {
  background: #f1f1f1;
}
.table-01 td {
  background: #fff;
}
@media (max-width: 599px) {
  .table-01 .pcver {
    display: none;
  }
}
@media (max-width: 599px) {
  .table-01 .keizai-search:after {
    content: "";
    display: block;
    width: 102%;
    height: 10.667vw;
    background: #fff;
    margin-left: -1px;
  }
}
@media (max-width: 599px) {
  .table-01 .keizai-search td {
    padding: 2.667vw 3.2vw;
    display: flex;
    width: 100%;
    border-bottom: 1px solid #ddd;
  }
  .table-01 .keizai-search td:first-child {
    background: #f1f1f1;
  }
  .table-01 .keizai-search td:last-child {
    border-bottom: 0;
  }
  .table-01 .keizai-search td div {
    padding-left: 3.2vw;
    width: 78%;
  }
}
.table-01 .keizai-search .sp-title {
  display: none;
}
@media (max-width: 599px) {
  .table-01 .keizai-search .sp-title {
    margin-bottom: 0;
    display: inline-block;
    width: 22%;
    font-size: 13px;
    font-weight: bold;
    border-right: 1px solid #ddd;
  }
}

.table-02 {
  border-collapse: collapse;
  border: 0;
}
.table-02.space-none th, .table-02.space-none td {
  padding: 5px 0;
}
@media (max-width: 599px) {
  .table-02.space-none th, .table-02.space-none td {
    padding: 2px 0;
  }
}

.middle {
  margin-left: auto;
  margin-right: auto;
  width: 1016px;
}
@media (max-width: 1280px) {
  .middle {
    width: 52.917vw;
  }
}
@media (max-width: 1024px) {
  .middle {
    width: 100%;
  }
}

.wid10 {
  width: 10%;
}

.wid20 {
  width: 20%;
}

.wid30 {
  width: 30%;
}

.wid40 {
  width: 40%;
}

.wid50 {
  width: 50%;
}

.wid60 {
  width: 60%;
}

.wid70 {
  width: 70%;
}

.wid80 {
  width: 80%;
}

.wid90 {
  width: 90%;
}

/* ----------------------------------------------------
btn
---------------------------------------------------- */
.btn01 {
  margin: 50px auto 0 auto;
  width: 488px;
  height: 66px;
}
@media (max-width: 1024px) {
  .btn01 {
    margin-top: 4.883vw;
    width: 47.656vw;
    height: 6.445vw;
  }
}
@media (max-width: 820px) {
  .btn01 {
    margin-top: 6.51vw;
    width: 100%;
    height: 8.594vw;
  }
}
@media (max-width: 599px) {
  .btn01 {
    margin-top: 12.821vw;
    height: 16.923vw;
  }
}
.btn01 a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: url(../images/cmn/icon_arrow_white_r.svg) center right 40px/10px no-repeat #dd4536;
}
.btn01.blue a {
  background: url(../images/cmn/icon_arrow_white_r.svg) center right 40px/10px no-repeat #004f84;
}
.btn01 + .section01 {
  margin-top: 100px;
}
@media (max-width: 1024px) {
  .btn01 + .section01 {
    margin-top: 9.766vw;
  }
}
@media (max-width: 820px) {
  .btn01 + .section01 {
    margin-top: 13.021vw;
  }
}
.btn01 + h4 {
  margin-top: 100px;
}
@media (max-width: 820px) {
  .btn01 + h4 {
    margin-top: 13.021vw;
  }
}
@media (max-width: 599px) {
  .btn01 + h4 {
    margin-top: 18.667vw;
  }
}

.btn02 {
  margin: 50px auto 0 auto;
  width: 224px;
  height: 66px;
}
@media (max-width: 1024px) {
  .btn02 {
    margin-top: 4.883vw;
    width: 21.875vw;
    height: 6.445vw;
  }
}
@media (max-width: 820px) {
  .btn02 {
    margin-top: 6.51vw;
    width: 29.167vw;
    height: 8.594vw;
  }
}
@media (max-width: 599px) {
  .btn02 {
    margin-top: 12.821vw;
    width: 57.436vw;
    height: 16.923vw;
  }
}
.btn02 a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: url(../images/cmn/icon_arrow_white_r.svg) center right 40px/10px no-repeat #dd4536;
}
.btn02.blue a {
  background: url(../images/cmn/icon_arrow_white_r.svg) center right 40px/10px no-repeat #004f84;
}

.btn03 {
  margin: 50px auto 0 auto;
  width: 360px;
  height: 66px;
}
@media (max-width: 1024px) {
  .btn03 {
    margin-top: 4.883vw;
    width: 35.156vw;
    height: 6.445vw;
  }
}
@media (max-width: 820px) {
  .btn03 {
    margin-top: 6.51vw;
    width: 46.875vw;
    height: 8.594vw;
  }
}
@media (max-width: 599px) {
  .btn03 {
    margin-top: 12.821vw;
    width: 100%;
    height: 16.923vw;
  }
}
.btn03 a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: url(../images/cmn/icon_arrow_white_r.svg) center right 40px/10px no-repeat #dd4536;
}
.btn03.blue a {
  background: url(../images/cmn/icon_arrow_white_r.svg) center right 40px/10px no-repeat #004f84;
}

/* ----------------------------------------------------
pager
---------------------------------------------------- */
.pager {
  margin: 40px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
@media (max-width: 1024px) {
  .pager {
    margin: 3.906vw 0;
    font-size: 1.563vw;
  }
}
@media (max-width: 820px) {
  .pager {
    margin: 5.208vw 0;
    font-size: 2.083vw;
  }
}
@media (max-width: 599px) {
  .pager {
    margin: 8vw 0;
    flex-wrap: wrap;
    font-size: 4.103vw;
  }
}
.pager .page {
  margin-right: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
}
.pager .page.current {
  color: #fff;
  background: #dd4536;
}
@media (max-width: 599px) {
  .pager .page {
    margin-top: 4px;
  }
}
.pager .page a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f1f1f1;
}

/* ----------------------------------------------------
pageup
---------------------------------------------------- */
#pageup {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 10;
  display: none;
}
#pageup img {
  width: 50px;
  height: auto;
  cursor: pointer;
}
@media (max-width: 599px) {
  #pageup img {
    width: 12.821vw;
  }
}

/* ----------------------------------------------------
footer
---------------------------------------------------- */
footer {
  border-top: 1px solid #ddd;
}
footer .footer_inner {
  padding: 50px 0;
}
@media (max-width: 1024px) {
  footer .footer_inner {
    padding: 4.883vw 25px;
  }
}
@media (max-width: 820px) {
  footer .footer_inner {
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
  }
}
footer .f_logo {
  margin-right: 40px;
  width: 224px;
  line-height: 0;
}
@media (max-width: 1024px) {
  footer .f_logo {
    margin-right: 3.906vw;
    width: 21.875vw;
  }
}
@media (max-width: 820px) {
  footer .f_logo {
    padding: 13.021vw 3.255vw;
    margin-right: 0;
    width: 48%;
    order: 2;
  }
}
@media (max-width: 599px) {
  footer .f_logo {
    padding: 19.231vw 5.128vw 0 5.128vw;
    width: 100%;
  }
}
footer .f_logo img {
  width: 190px;
  height: auto;
}
@media (max-width: 1024px) {
  footer .f_logo img {
    width: 18.555vw;
  }
}
@media (max-width: 820px) {
  footer .f_logo img {
    width: 24.74vw;
  }
}
@media (max-width: 599px) {
  footer .f_logo img {
    width: 48.718vw;
    height: 13.077vw;
  }
}
footer .address {
  width: 264px;
  flex-grow: 2;
}
@media (max-width: 1024px) {
  footer .address {
    width: 25.781vw;
  }
}
@media (max-width: 820px) {
  footer .address {
    padding: 13.021vw 3.255vw;
    width: 48%;
    order: 3;
  }
}
@media (max-width: 599px) {
  footer .address {
    padding: 0 5.128vw 19.231vw 5.128vw;
    margin-top: 6.41vw;
    width: 100%;
  }
}
footer .address p {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.8;
}
@media (max-width: 1024px) {
  footer .address p {
    font-size: 1.367vw;
  }
}
@media (max-width: 820px) {
  footer .address p {
    font-size: 1.953vw;
  }
}
@media (max-width: 599px) {
  footer .address p {
    font-size: 3.59vw;
  }
}
footer .f_nav {
  width: 224px;
}
@media (max-width: 1024px) {
  footer .f_nav {
    width: 21.875vw;
  }
}
@media (max-width: 820px) {
  footer .f_nav {
    width: 100%;
    order: 1;
  }
}
footer .f_nav ul {
  font-size: 14px;
  font-weight: 500;
}
@media (max-width: 1024px) {
  footer .f_nav ul {
    font-size: 1.367vw;
  }
}
@media (max-width: 820px) {
  footer .f_nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    font-size: 2.344vw;
  }
}
@media (max-width: 599px) {
  footer .f_nav ul {
    font-size: 4.103vw;
  }
}
footer .f_nav ul li {
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  footer .f_nav ul li {
    margin-bottom: 0.977vw;
  }
}
@media (max-width: 820px) {
  footer .f_nav ul li {
    margin-bottom: 0;
    width: 100%;
    height: 70px;
    border-bottom: 1px solid #ddd;
  }
  footer .f_nav ul li a {
    padding: 0 3.255vw;
    display: flex;
    align-items: center;
    height: 100%;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  footer .f_nav ul li a {
    padding: 0 5.128vw;
  }
}
@media (max-width: 820px) {
  footer .f_nav ul li:first-child {
    border-right: 1px solid #ddd;
    width: 50%;
  }
  footer .f_nav ul li:first-child a:before {
    content: "";
    display: inline-block;
    background: url(../images/cmn/icon_login.svg) center center/100% no-repeat;
    width: 3.255vw;
    height: 3.646vw;
    position: relative;
    top: 0.26vw;
    margin-right: 2.083vw;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  footer .f_nav ul li:first-child a:before {
    width: 6.41vw;
    height: 7.179vw;
    margin-right: 3.846vw;
  }
}
@media (max-width: 820px) {
  footer .f_nav ul li:nth-child(2) {
    width: 50%;
  }
  footer .f_nav ul li:nth-child(2) a:before {
    content: "";
    display: inline-block;
    background: url(../images/cmn/icon_cart.svg) center center/100% no-repeat;
    width: 3.516vw;
    height: 3.646vw;
    position: relative;
    top: 0.26vw;
    margin-right: 2.083vw;
  }
}
@media (max-width: 820px) and (max-width: 599px) {
  footer .f_nav ul li:nth-child(2) a:before {
    width: 6.923vw;
    height: 7.179vw;
    margin-right: 2.564vw;
  }
}

/* ----------------------------------------------------
error
---------------------------------------------------- */
.errormessage {
  padding: 20px 30px;
  margin-bottom: 40px;
  border: 2px solid #dd4536;
}
@media (max-width: 820px) {
  .errormessage {
    padding: 2.604vw 3.906vw;
    margin-bottom: 5.208vw;
  }
}
@media (max-width: 599px) {
  .errormessage {
    padding: 4.267vw 5.333vw;
    margin-bottom: 8vw;
  }
}
.errormessage p {
  margin-bottom: 0;
  font-weight: bold;
  color: #dd4536;
}

