@charset "UTF-8";

#container {
  width: 100%;
  margin: 0 auto 0 0;
  position: relative;
}

#contentArea {
  position: relative;
  min-height: 100vh;
  /*padding-bottom: 56.5vw;*/
  box-sizing: border-box;
}

/* --------------------------------------------------------------------
  共通ヘッダー 共通フッター
-------------------------------------------------------------------- */

div.wrapper_ {
  padding: 0 10px 10px 10px;
}

/*.header_ {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  height: 47.66vw;
  background: #606060;
  box-sizing: border-box;
}

.header_ .logo_area_ {
  color: #fff;
  padding-left: 4.8vw;
  padding-top: 2.933vw;
}

.header_ .logo_area_ .catch2 {
  font-size: 2.93vw;
}

.header_ .logo_area_ .catch {
  font-size: 3.2vw;
}

div.header_ .welcomemessage_ {
  background-color: white;
  color: #333;
  text-align: left;
  padding: 4px 10px;
  width: 100%;
  font-size: 3.2vw;
}

div.header_ .welcomemessage_.assistlogin_ {
  background-color: #f00;
}

div.header_ .welcomemessage_ span {
  padding-right: 4px;
  font-weight: bold;
  display: inline-block;
  margin-top: 2.666vw;
}

div.header_ p {
  clear: both;
  padding: 0;
}

div.header_ div.logo_ {
  padding-right: 10px;
}

div.header_ div.logo_ img {
  width: 39.46vw !important;
  height: auto !important;
  margin-top: 0 !important;
}

div.header_ div.icon_ {
  text-align: center;
  display: flex;
}

div.header_ div.icon_#gnav_quick {
  margin-left: auto;
  display: flex;
  align-items: center;
  position: relative;
}

div#gnav_quick::before {
  content: "";
  background: #8b8b8b;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 50px;
  left: -1.6vw;
}

div.header_ div.icon_#gnav_quick a {
  width: 15.2vw;
  background: transparent;
}

div.header_ div.icon_#gnav_quick a img {
  width: 12.26vw;
}

div.header_ div.icon_#gnav_cart {
  width: 10.2vw;
  background: transparent;
  margin-right: 3.466vw;
}

div.header_ div.icon_ p {
  font-size: 10px;
  line-height: 1.1;
  text-align: center;
}

div.header_ ul.exp_btns_ {
  display: flex;
  background: #fff;
  padding: 2.667vw 0;
}

div.header_ ul.exp_btns_ li {
  position: relative;
  width: 30vw;
}

div.header_ ul.exp_btns_ li:last-child {
  width: 40vw;
}

div.header_ ul.exp_btns_ li::after {
  content: "";
  width: 1px;
  height: 20px;
  background: #333;
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

div.header_ ul.exp_btns_ li:first-child:after {
  content: none;
}

div.header_ ul.exp_btns_ li a {
  color: #606060;
  background: #fff;
  font-size: 3.46vw;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 6.66vw;
  font-weight: bold;
}

div.header_ ul.exp_btns_ li a::before {
  content: "";
  background: url(../../img/usr/header/sp/icon_mypage.png);
  width: 4.8vw;
  height: 5.6vw;
  background-size: contain;
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  top: 50%;
  transform: translateY(-50%);
  left: 3vw;
}

div.header_ ul.exp_btns_ li:nth-of-type(2) a::before {
  background: url(../../img/usr/header/sp/icon_history.png);
  background-size: contain;
  background-repeat: no-repeat;
}

div.header_ ul.exp_btns_ li:nth-of-type(3) a::before {
  background: url(../../img/usr/header/sp/icon_precart.png);
  background-size: contain;
  background-repeat: no-repeat;
}

div.header_ ul.exp_btns_ li:last-child a::before {
  left: 5vw;
}

div.header_ #gnav_cart a {
  position: relative;
  width: 10.2vw;
  background: transparent;
}

div.header_ #gnav_cart a img {
  margin-top: 8.66vw;
  width: 8vw;
}

div.header_ .head_content .js-cart-count {
  display: none;
  position: absolute;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 11px;
  font-weight: normal;
  background-color: #e61d50;
  color: #fff;
  border-radius: 9px;
  right: -1.2vw;
  z-index: 2;
  margin-top: -5px;
}*/

/*div.footer_ {
  position: absolute;
  bottom: 0;
  background: #e9e9e9;
  padding: 20px 0 8px 0;
}

div.footer_ .footer_btns_ {
  display: flex;
  flex-wrap: wrap;
  margin-top: 5.6vw;
  margin-bottom: 2.4vw;
}

div.footer_ .footer_btns_ li {
  font-size: 3.2vw;
  border: 1px solid #cbcbcb;
  box-sizing: border-box;
  width: 100%;
  position: relative;
}

div.footer_ .footer_btns_ li:nth-of-type(1),
div.footer_ .footer_btns_ li:nth-of-type(2),
div.footer_ .footer_btns_ li:nth-of-type(3),
div.footer_ .footer_btns_ li:nth-of-type(4) {
  width: 50%;
  display: flex;
  align-items: center;
}

div.footer_ .footer_btns_ li:first-child {
  border-right: none;
  border-left: none;
}

div.footer_ .footer_btns_ li:nth-of-type(2) {
  border-right: none;
}

div.footer_ .footer_btns_ li:nth-of-type(3) {
  border-top: none;
  border-left: none;
  border-right: none;
}

div.footer_ .footer_btns_ li:last-child {
  border-top: none;
  border-right: none;
}

div.footer_ .footer_btns_ li a {
  display: block;
  font-size: 3.2vw;
  color: #333;
  padding: 2.933vw 0 2.933vw 9.333vw;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0;
  padding-left: 9.333vw;
  padding-right: 2.933vw;
  min-height: 42px;
}

div.footer_ .footer_btns_ li a::before {
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 1px solid #656565;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 4.8vw;
  margin: auto;
  content: "";
  vertical-align: middle;
}

div.footer_ .footer_btns_ li a::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  left: calc(4.8vw + 5px);
  box-sizing: border-box;
  width: 3px;
  height: 3px;
  border: 3px solid transparent;
  border-left: 3px solid #656565;
}

div.footer_ #copyright {
  font-size: 11px;
  width: 300px;
  text-align: center;
  margin: 0 auto;
}*/

div.change_mode_ {
  width: 81.86vw;
  text-align: center;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

div.change_mode_ span,
div.change_mode_ a {
  font-weight: bold;
  text-decoration: none;
  width: 50%;
}

div.change_mode_ .change_sp_ {
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2.133vw 0;
  color: #aaa;
}

div.change_mode_ .change_pc_ {
  background: #4cae8d;
  color: #fff;
  padding: 2.133vw 0;
}

#contentArea > div > div > h1 {
  text-align: left;
}

/* ---------------------------------------------------
  ヘッダー
  -----------------------------------------------------*/

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
}

/*.header_ {
  width: 100%;
  height: 70px;
  display: block;
}*/

/*.header_ .head_content {
  text-align: center;
  position: relative;
}

.header_ .head_content img {
  height: 25px;
  width: auto;
}

.header_ .head_content span {
  display: block;
  color: #fff;
  font-size: 11px;
  margin-top: 5px;
}*/

.head_content_img {
  position: absolute;
  top: 15px;
}

.head_content_img.head_login {
  left: 55px;
  width: 55px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
}

.head_content_img.head_reload {
  right: 60px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
}

.head_content_img.head_login.active,
.head_content_img.head_reload.active {
  opacity: 1;
  pointer-events: all;
}

/*.head_content_img.head_cart {
  right: 14px;
}*/

.head_content_ttl {
  /*padding: 18px 0;*/
  margin: 0;
}

/*.header_ .head_content_ttl img {
  height: 34px;
}*/

.header_inner {
  /*height: 100%;*/
}

.head_wrapper {
  /*height: 100%;*/
}

div.wrapper_ {
  padding-top: 80px;
}

.gnavi__sp-style {
  display: block;
  pointer-events: none;
  position: fixed;
  overflow: auto;
  z-index: 2;
  top: 70px;
  left: 0;
  background-color: #f2f2f2;
  text-align: center;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

.gnavi__pc-style {
  display: none;
}

/*メニューボタン　展開前*/
/*.menu-btn {
  display: block;
  position: fixed;
  z-index: 3;
  left: 10px;
  top: 15px;
  width: 42px;
  height: 42px;
  cursor: pointer;
  text-align: center;
}*/

/*.menu-btn span {
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 6px;
  background: #fff;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.menu-btn span:nth-of-type(1) {
  top: 10px;
}

.menu-btn span:nth-of-type(2) {
  top: 20px;
}

.menu-btn span:nth-of-type(3) {
  top: 30px;
}*/

/*メニューボタン　展開後*/
/*.menu-btn.active span:nth-child(1) {
  top: 20px;
  left: 6px;
  background: #fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.menu-btn.active span:nth-child(2),
.menu-btn.active span:nth-child(3) {
  top: 20px;
  background: #fff;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}*/

.gnavi__sp-style ul.nav_link_under {
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

.gnavi__sp-style ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: 0.4s all;
}

.gnavi__sp-style ul.nav_link_under li:last-of-type {
  padding-bottom: 0;
  width: 300px;
  margin: 0 auto;
}

.gnavi__sp-style ul li:hover {
  background: #ddd;
}

.gnavi__sp-style ul li a {
  display: block;
  color: #282828;
  padding: 1em 0;
  text-align: left;
  text-decoration: none;
}

.gnavi__sp-style.active {
  opacity: 1;
  pointer-events: all;
}

.gnavi_inner {
  overflow: auto;
  margin: 0 15px;
  padding-top: 0;
  padding-bottom: 150px;
}

.gnavi_top {
  background-color: #fff;
}

.gnavi__sp-style .search_ {
  border-top: solid 1px #ccc;
}

.head_account span {
  padding: 0 0.5em;
}

.gnavi__sp-style .gnavi_content {
  display: flex;
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  margin-top: 10px;
  margin-bottom: 10px;
  background-color: #fff;
  margin-top: 0;
}

.gnavi__sp-style .gnavi_content li {
  width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-right: solid 1px #ccc;
}

.gnavi__sp-style .gnavi_content li:last-child {
  border: none;
}

.gnavi__sp-style .gnavi_content li a {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 100%;
}

.gnavi__sp-style .gnavi_content li a img {
  height: 20px;
  width: auto;
}

.gnavi__sp-style div.CategoryStyleG_ div.name_ {
  border-top: none;
  font-weight: normal;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block0_ > div.link_ {
  border-bottom: solid 1px #ccc;
  text-align: left;
  gap: 10px;
  display: flex;
  align-items: center;
  padding: 4vw 0 4vw 10px;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block0_ > div.link_ a {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #000;
  font-weight: 400;
}

.gnavi__sp-style div.CategoryStyleG_ {
  border: none;
  margin-bottom: 12.333vw;
}

.gnavi__sp-style .CategoryStyleG_nav_img {
  height: 6vw;
  width: 6vw;
  object-fit: contain;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block1_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.category_list_block2_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.category_list_block3_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.category_list_block4_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block1_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block2_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block3_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block4_ > div.name_ {
  padding: 4vw 0;
  border: none;
  border-bottom: solid 1px #ccc;
  text-align: left;
  background-color: inherit;
  position: relative;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block1_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block1_ > div.name_ {
  padding-left: 30px;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block2_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block2_ > div.name_ {
  padding-left: 50px;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block3_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block3_ > div.name_ {
  padding-left: 70px;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block4_ > div.name_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block4_ > div.name_ {
  padding-left: 90px;
}

.gnavi__sp-style div.CategoryStyleG_ div.category_list_block1_,
.gnavi__sp-style div.CategoryStyleG_ div.genre_list_block1_ {
  display: none;
}

.gnavi__sp-style .nav_link_under li a {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 700;
}

.gnavi__sp-style .nav_link_under li.nav_link_under_contact {
  width: 300px;
  margin: 0 auto 10px;
}

.gnavi__sp-style .nav_link_under li.nav_link_under_contact a {
  padding: 15px 20px;
  background-color: #fff;
}

.gnavi__sp-style .nav_link_under li.nav_link_under_tel a {
  gap: 6px;
  background-color: #fff;
}

.gnavi__sp-style .nav_link_under li a img {
  height: 25px;
  width: auto;
}

form.search_form_ input.keyword_ {
  border-radius: 5px;
}

/* 検索ボックス */
.gnavi__sp-style .search_ .search1 {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}

.gnavi__sp-style form.search_form_ input.keyword_ {
  background-color: #fff;
  width: 83.4vw;
  padding: 2.5vw 0 2vw 3vw;
  border-radius: 5px;
}

.gnavi__sp-style form.search_form_ {
  padding: 0;
}

.gnavi__sp-style .search_ .search1 dd button {
  background-color: #fff;
  border: none;
  padding-right: 20px;
}

.gnavi__sp-style .search_ .search1 dd button img {
  height: 23px;
  width: auto;
}