@charset "utf-8";
/* CSS Document */

body { font-family: YakuHanJP, 'Noto Sans JP', 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", sans-serif!important; background-color: #fff; position: relative; font-size: 13px; }
html,body { padding: 0; margin: 0; }
/*
nav:not(.mm-menu) { display: none; }
*/
a { text-decoration: none; }
h1 { margin: 0; }
xmp { overflow: hidden; }




header { backdrop-filter: blur(10px); background-color: rgba(255, 255, 255, 0.8); }
/*
header.header-slide-active:not(.header-content-active) { backdrop-filter: blur(0); background-color: rgba(255, 255, 255, 0); color: white; }
header.header-slide-active:not(.header-content-active) .global_menu { border: none; }
header.header-slide-active:not(.header-content-active) .global_menu .container .menu a { color: white; }
header.header-slide-active:not(.header-content-active) svg .c,
header.header-slide-active:not(.header-content-active) svg .d { stroke: white !important; }
header.header-slide-active:not(.header-content-active) svg.cart circle { fill: white; }
header.header-slide-active:not(.header-content-active) .global_menu .content-wrapper li a { color: white; text-align: center; }
header.header-slide-active:not(.header-content-active) .global_menu .content-wrapper li a:hover { color: white; }
*/
header .global_menu { border-bottom: 1px solid #F5F5F7; }
header .global_menu > .container { margin: 0 auto; padding: 0 15px; display: flex; justify-content: space-between; align-items: center; height: 60px; column-gap: 25px; }
/*
header.smart .global_menu > .container { max-width: 1140px; }
*/
header .global_menu a.top:hover { opacity: 0.7; }
header .global_menu .logo { font-size: 24px; font-weight: 900; line-height: 1; }
header .global_menu .logo a { text-decoration: none; color: black; }

header .global_menu .container ul { margin: 0; padding: 0; line-height: 1; list-style-type: none; display: flex; line-height: 1; }

header .global_menu .container .menu { display: flex; align-items: center; column-gap: 25px; }
header .global_menu .container .m_icon { width: 24px; height: auto; }
header .global_menu .container .hover-trigger { height: 60px; display: flex; justify-content: center; align-items: center; cursor: pointer; }
header .global_menu .container .menu a { color: black; display: flex; justify-content: center; align-items: center; }
header .global_menu .container .menu .faq a { height: 60px; display: flex; justify-content: center; align-items: center; cursor: pointer; }
header .global_menu .container .menu .guide a { height: 60px; display: flex; justify-content: center; align-items: center; cursor: pointer; }
header .global_menu .container .navi { display: flex; align-items: center; column-gap: 25px; }

header .global_menu .content-wrapper { padding: 20px 0 60px; text-align: center; }
header .global_menu .content-wrapper span.mp_badge { width: 4.5rem; margin: 0 auto 5px; font-size: 11px; display: inline-block; padding: 1px 10px 2px; border-radius: 4px; }
header .global_menu .content-wrapper span.mp_badge.rental { color: green; background: #c8e8c8; }
header .global_menu .content-wrapper span.mp_badge.sell { color: #d87716; background: #ffe2aa; }
/*
header .global_menu .content-wrapper span.mp_badge.rental { color: #00c700; background: #00c700; color: white; }
header .global_menu .content-wrapper span.mp_badge.sell { color: #fc2ab4; background: #fc2ab4; color: white; }
*/
header .global_menu .content-wrapper ul { margin: 0 0 20px; display: flex; justify-content: center; flex-wrap: wrap; column-gap: 30px; }
header .global_menu .content-wrapper li a { color: #333; text-align: center; }
header .global_menu .content-wrapper li a:hover { color: #000; }
header .global_menu .content-wrapper li a:hover .image { opacity: 0.7; }
header .global_menu .content-wrapper li { width: 100px; }
header .global_menu .content-wrapper li .image { }
header .global_menu .content-wrapper li .image img { width: 70px; height: 70px; }
header .global_menu .content-wrapper li .maker { margin: 0; font-size: 13px; font-weight: 500; line-height: 1.5; }
header .global_menu .content-wrapper li .name { margin: 0 0 5px; font-size: 13px; font-weight: 500; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
header .global_menu .content-wrapper li .mp_badge.new { color: red; font-weight: 500; }
header .global_menu .content-wrapper .category_link { margin-top: 40px; text-align: center; }

header .global_menu .content-wrapper .container { max-width: 800px; }

@media (max-width: 1184px) {
  header .global_menu .menu .faq { display: none!important; }
  header .global_menu .menu .guide { display: none!important; }
}
@media (max-width: 1020px) {
  ul.menu { display: none!important; }
}
@media (min-width: 1020px) {
  header .global_menu .navbar { display: none!important; }
}


header .global_menu .navbar-collapse .container-sm { padding: 20px 20px 60px; }
header .global_menu .navbar-collapse ul { margin: 0; padding: 0; line-height: 2.5; list-style-type: none; font-weight: 700; font-size: 16px; }
header .global_menu .navbar-collapse li a { color: black; display: flex; align-items: center; grid-column-gap: 7px; justify-content: space-between; }
header .global_menu .navbar-collapse li a:hover { color: #0d6efd; }
header .global_menu .navbar-collapse span.mp_badge { margin-top: 3px; font-size: 9px; padding: 1px 5px 2px; border-radius: 4px; line-height: 1.5; font-weight: 400; width: 3.8rem; text-align: center; }
header .global_menu .navbar-collapse span.mp_badge.rental { color: green; background: #c8e8c8; }
header .global_menu .navbar-collapse span.mp_badge.sell { color: #d87716; background: #ffe2aa; }
header .global_menu .navbar-toggler:focus {  box-shadow: none; }


.pulse_base {
  z-index: 9;
  line-height: .999rem;
  letter-spacing:0;
}
@keyframes pulsate {
  0% {transform: scale(0.6, 0.6); opacity: 0.0;}
  50% {opacity: 1.0;}
  100% {transform: scale(1, 1); opacity: 0.0;}
}
.pulse_base:before {
  content: "";
  border: 15px solid rgba(255, 0, 0, 0.3);
  border-radius: 50%;
  height: 4px;
  width: 4px;
  position: absolute;
  left: -7.5px;
  bottom: -7.5px;
  animation: pulsate 1.6s ease-out;
  animation-iteration-count: infinite;
  opacity: 0.0;
  z-index: 99;
}
header .global_menu .badge {
  padding-left: 0;
  padding-right: 0;
  min-width: 0.9rem;
  height: 0.9rem;
  line-height: 1.0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
}


section.key_visual { margin: 0; padding: 30px 15px 50px; background: url('https://www.netage.ne.jp/oshikatsu/common/images/key_visual_back.jpg') top center no-repeat; background-size: auto 100%; }




#page { padding: 58px 0 0; }



section.announce { background: #F5F5F7; border-bottom: 2px solid #FFF; text-align: center; padding: 15px 15px; letter-spacing: 0.1em; font-size: 13px; line-height: 1.5!important; }
section.announce .title { margin: 0 0 1px; color: red; font-weight: normal; }
section.announce p { margin: 0; font-size: 12px; line-height: 1.3; }
section.announce .carousel-control-next-icon, .carousel-control-prev-icon { width: 13px; height: 13px; }
section.announce .carousel-control-prev, .announce .carousel-control-next { background: #F7F7F7; opacity: 1; }









section h2 { font-size: 32px; line-height: 1.3; text-align: center; font-weight: 900; }
section h2 + p { margin: 0 0 40px; font-size: 18px; font-weight: 400; text-align: center; }

@media (max-width: 768px) {
section h2 { font-size: 22px; line-height: 1.4; text-align: left; font-weight: 900; }
section h2 + p { margin: 0 0 40px; font-size: 15px; font-weight: 400; text-align: left; line-height: 1.6; }
}







.slide-section { height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.slide-section .in { position: relative; z-index: 2; }
.slide-section .in > * { opacity: 0; transform: translateY(60px); transition: opacity 0.8s ease-out, transform 0.8s ease-out; }
.slide-section.active .in > * { opacity: 1; transform: translateY(0); }
.slide-section.active .in > *:nth-child(2) { transition-delay: 0.2s; }
.slide-section.active .in > *:nth-child(3) { transition-delay: 0.4s; }
.slide-section.active .in > *:nth-child(4) { transition-delay: 0.6s; }
.slide-section.active .in > *:nth-child(5) { transition-delay: 0.8s; }
.fullscreen-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }

.slide-section .in { padding: 5%; /*color: white;*/ margin-right: auto; }
.slide-section.galaxy .in { margin-top: auto; padding-bottom: 10%; color: #f3a5d5; }
.slide-section.xiaomi .in { margin-top: auto; padding-bottom: 10%; color: #d199f0; }


.slide-section .in .new { margin: 0; font-size: 16px; font-weight: 400; color: red; color: black; }
.slide-section .in .name { margin: 0 0 15px; font-size: 64px; font-weight: 700; line-height: 1.15; }
.slide-section .in .name span { display: block; font-size: 30px; }
.slide-section .in .copy { margin: 0 0 30px; font-size: 18px; font-weight: 400; line-height: 1.7; }
.slide-section .in a { color: white; }

@media screen and (max-width:768px) {
.slide-section .in .new { margin: 0 0 5px; font-size: 14px; font-weight: 400; }
.slide-section .in .name { margin: 0 0 10px; font-size: 44px; font-weight: 700; line-height: 1.2; }
.slide-section .in .copy { margin: 0 0 30px; font-size: 16px; font-weight: 400; line-height: 1.7; }
}

section.sale { padding: 7px 15px; background: #E02C38; background: red; background: #F7F7F7; margin: 0 auto; /*max-width: 2107px; max-width: 2092px; max-width: 1932px;*/ }
section.sale ul { display: flex; justify-content: center; align-items: center; list-style-type: none; margin: 0; padding: 0; }
section.sale ul li { display: flex; justify-content: center; align-items: center; line-height: 1; margin: 0px 5px; }

section.sale .name { color: #010741; font-size: 22px; font-weight: 900; color: black; }
section.sale .benefit { /*color: white;*/ font-size: 20px; font-weight: 500; font-size: 14px; font-weight: 500; }
section.sale .benefit b { font-size: 36px; margin: 0 2px 0 4px; font-family: "din-2014",sans-serif; }
section.sale .deadline { color: #010741; font-size: 20px; font-weight: 900; color: black; display: block; }
section.sale .deadline small { font-size: 14px; display: block; margin: 0 0 3px; }
@media screen and (max-width:768px) {
section.sale ul { flex-wrap: wrap; }
	section.sale { padding: 10px 15px; }
	section.sale .name { font-size: 18px; }
	section.sale .benefit { font-size: 14px; }
	section.sale .deadline { padding-top: 5px; font-size: 18px; text-align: center; }
}











section.latest_news {  }
section.latest_news .container { max-width: 1020px; padding: 30px 15px; }
section.latest_news ul { margin: 0; padding: 0; line-height: 1; list-style-type: none; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: 700; gap: 0 20px; }
section.latest_news ul li:first-of-type { margin-right: 30px; padding-right: 40px; border-right: 1px solid #ccc; }
section.latest_news ul li a { text-decoration: none; }
section.latest_news ul li a:hover { text-decoration: underline; }
@media (max-width: 768px) {
section.latest_news .container { padding: 20px 15px; }
section.latest_news ul { flex-wrap: wrap; display: block; }
section.latest_news ul li { line-height: 1.5; }
section.latest_news ul li:first-of-type { border: none; }
}







.topics { background-color: #f5f5f7; }
.topics .container { max-width: 1320px; padding-left: 15px; padding-right: 15px; }
.topics .row { justify-content: center; }
.topics .card { box-shadow: 2px 4px 12px #00000014; border-radius: 10px; height: 100%; }
.topics .card-body { padding: 10px 30px; }
.topics .text-body-secondary { color: #aaa!important; }
.topics h5 { margin-bottom: 12px; font-size: 20px; font-weight: 900; }
.topics p { line-height: 1.7; }
.topics img { border-radius: 10px 0 0 10px; width: 100%; height: auto; object-fit: cover; }
.topics .topics_shipping_deadline_extension .col-md-4 { border-right: 1px solid #eee; }

@media (max-width: 768px) {
.topics .topics_shipping_deadline_extension .col-md-4 { border-right: none; border-bottom: 1px solid #eee; }
}
@media (max-width: 768px) {
.topics > .container > .row { --bs-gutter-x: 10px; }
.topics .card-body { padding: 1rem; }
.topics img { width: 100%; height: auto; /*aspect-ratio: 5/7;*/ }
.topics h5 { margin-bottom: 0.5rem; font-size: 16px; font-weight: 900; }
.topics p { line-height: 1.5; }
}







section.top_merit { }
section.top_merit h2 { font-size: 46px; line-height: 1.2; }
section.top_merit .container { max-width: 1140px; margin: 0 auto; padding: 80px 15px 60px; }
section.top_merit h2 + p { font-size: 24px; font-weight: 700; }
/*
section.top_merit h2 { margin: 0 0 40px; font-size: 36px; line-height: 1.3; text-align: center; font-weight: 900; }
section.top_merit h2 small { display: block; margin-top: 15px; font-size: 20px; line-height: 1.5; text-align: center; font-weight: 600; }
section.top_merit h2 + p { margin: -20px 0 30px; font-size: 24px; font-weight: 700; text-align: center; }
*/

section.top_merit .row { margin-bottom: 20px; }
section.top_merit .row > div[class^="col"] { padding: 0 25px 20px; }
section.top_merit .row > div[class^="col"] .icon { margin: 0 0 15px; text-align: center; }
section.top_merit h3 { margin: 10px 0 10px; text-align: center; font-weight: 900; font-size: 22px; line-height: 1.3; }
section.top_merit h3 small { display: block; color: black; font-weight: 900; font-size: 16px; text-align: center; }
section.top_merit p { font-size: 16px; line-height: 1.5; }
section.top_merit .row p { margin: 0 0 10px; line-height: 1.6; }


@media screen and (max-width:768px) {
section.top_merit .container { padding: 50px 15px 40px; }
section.top_merit h2 { margin: 0 0 30px; font-size: 22px; }
section.top_merit h2 + p { font-size: 16px; }
section.top_merit .row > div[class^="col"] { padding: 0 15px 0px; }
section.top_merit h3 { margin: 10px 0 10px; font-size: 18px; line-height: 1.3;  }
section.top_merit h3 small { font-size: 15px; }
section.top_merit .row p { margin: 0 0 10px; line-height: 1.5; font-size: 14px; }
}





section.products_section > .container { max-width: 1140px; padding: 80px 15px 0; /*border-bottom: 1px solid #e8e8e8;*/ }
@media screen and (max-width:768px) {
section.products_section > .container { padding: 60px 15px 0; }
}


/* 商品の陳列（横4列）*/
section.collection { padding: 0 0 80px; }
@media screen and (max-width:768px) {
section.collection { padding: 0 0 40px; }
}

section.collection .container { /*max-width: 1140px;*/ }
section.collection a { display: block; /*padding: 0 0 30px;*/ color: #333; text-decoration: none; }
section.collection a:hover { color: black; }
section.collection a:hover img { opacity: 0.7; }

section.collection .col-6 { /*padding: 3px;*/ }
section.collection .card_inner { position: relative; }
section.collection .card_media { margin: 0 0 1rem; }
section.collection .card_media img { border-radius: 4px; }
section.collection .preface { margin: 0 0 3px; font-size: 13px; display: none; }

section.collection .card_infomation .fee .type { font-size: 11px; }

section.collection .card_inner .card_content .badge { display: flex; flex-direction: column; grid-row-gap: 1rem; position: absolute; top: 1rem; left: 1rem; z-index: 2; max-width: 50%; pointer-events: none; border-radius: 2px; font-weight: 400; line-height: 1; }
section.collection .card_inner .card_content .badge.right { left: inherit; right: 1rem; }
section.collection .card_inner .card_content .badge.bottom { top: inherit; bottom: 1rem; }
section.collection .card_inner .card_content .badge.sale { color: red; font-size: 12px; padding: 5px 15px 6px; border-radius: 100px; letter-spacing: 0.1rem; }
section.collection .card_inner .card_content .badge.new { color: #b64400!important; background: none!important; padding: 0; font-weight: 700; letter-spacing: 0.1rem; font-size: 13px; }

section.collection .name { margin: 0 0 10px; font-size: 14px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; width: 100%; }
section.collection .name .mp_badge.new { color: red; font-size: 12px; }

section.collection .detail { margin: 0 0 20px; font-size: 14px; line-height: 1.7; display: none; }
section.collection .fee { margin: 0 0 10px; font-size: 14px; line-height: 1.2; letter-spacing: 0.05rem; }
section.collection .fee .basic { margin: 0 0 1px; padding: 0; }
section.collection .fee .basic span { font-family: "din-2014",sans-serif; }
section.collection .fee .extension { margin: 0 0 10px; padding: 0; font-size: 13px; }
section.collection .fee.sale .basic { color: red; }
section.collection .fee.sale .info { color: red; }

section.collection .fee s { color: #bbb; font-weight: 400; }
section.collection .fee b { font-weight: 500; margin-left: 3px; }
section.collection .fee span { font-size: 16px; margin-right: 1px; font-weight: 700; }
section.collection .fee small { padding-bottom: 3px; font-size: 12px; display: block; }

section.collection .product_type { display: flex; }

@media (max-width: 768px) {
section.collection .preface { font-size: 11px; display: none; }
section.collection .name { font-size: 14px; }
section.collection .detail { margin: 0 0 15px; font-size: 12px; color: #999; }
section.collection .fee { margin: 0 0 10px; font-size: 13px; }
section.collection .fee span { font-size: 18px; }
section.collection .fee .extension { font-size: 12px; }
section.collection .product_type { /*flex-direction: column;*/ }
section.collection .product_type span { width: fit-content; font-size: 10px!important; }
}









section.items { /*background-color: #E6F7FF; background-image: linear-gradient(0deg, #f7f7f7 20%, #E6F7FF 80%);*/ }
section.items .container:not(.products .container) { padding: 80px 15px 40px; }

section.products#binoculars { }

section.products h2 small { display: block; margin-top: 15px; font-size: 20px; line-height: 1.5; text-align: center; font-weight: 600; }
section.products h3 { margin: 0 0 15px; font-size: 24px; }

section.products .row { margin-bottom: 20px; }
section.products .row#binoculars { margin-bottom: 40px; border-bottom: 1px solid #ddd; padding-bottom: 40px; }
section.products .row#smartphone { margin-bottom: 40px; border-bottom: 1px solid #ddd; padding-bottom: 40px; }

section.products .row:last-of-type { margin-bottom: 30px; }
section.products .row > div[class^="col"] { text-align: center; }
section.products .row > div[class^="col"] { margin: 0 0 30px; }
section.products .row > div[class^="col"] .wrapper { text-decoration: none; color: black; }
section.products .row > div[class^="col"] .wrapper { position: relative; display: flex; align-items: flex-start; /*justify-content: center;*/ align-items: center; flex-direction: column; background: white; border-radius: 12px; padding: 30px 15px 25px; /*border: 1px solid #E6E6E6;*/ box-shadow: 2px 4px 12px rgba(0,0,0,.08); height: 100%; }
section.products .row > div[class^="col"] .wrapper.line { border: 1px solid #E6E6E6; }

section.products .row > div[class^="col"] .wrapper .wish { flex-direction: inherit; gap: 0 30px; text-align: left; line-height: 1.7; }

section.products .row > div[class^="col"] .wrapper.galaxy { background: black url("https://www.netage.ne.jp/oshikatsu/samsung/galaxy_s24_ultra/images/galaxy-s24-ultra-highlights-camera-overview.jpg") no-repeat center center; border-radius: 14px; color: white; background-size: 80% auto; }
section.products .row > div[class^="col"] .wrapper.galaxy .fee { color: white; }
@media (max-width: 768px) {
section.products .row > div[class^="col"] .wrapper.galaxy { background-size: 100% auto; }
}

section.products .row > div[class^="col"] p { margin: 0 0 10px; line-height: 1.7; font-size: 15px; }

section.products .row > div[class^="col"] .name { margin: 0; padding: 0 0 15px; font-size: 22px; line-height: 1; font-weight: 900; letter-spacing: 0.00em; text-align: center; }
section.products .row > div[class^="col"] .name a { color: black; }
section.products .row > div[class^="col"] .name .spec { padding: 0 0 5px; font-size: 14px; display: block; background: linear-gradient(51deg,#FF0000,#FF6400 15%,#FFA816 35%,#FF9A87 55%,#F747D1 80%,#AD5DF1); background-clip: text; -webkit-text-fill-color: transparent; }

section.products .row > div[class^="col"] .name .category { padding: 0 0 10px; font-size: 14px; display: block; }


section.products #smartphone.row > div[class^="col"] .name { font-size: 40px; padding: 0 0 20px; }
section.products #smartphone.row > div[class^="col"] .name .spec { font-size: 18px; }

@media screen and (max-width: 767px) {
section.products #smartphone.row > div[class^="col"] .name { font-size: 26px; }
section.products #smartphone.row > div[class^="col"] .name .spec { font-size: 16px; }
}



section.products .row > div[class^="col"] .detail { position: absolute; right: 0; left: 0; margin: 0; padding: 0; font-size: 15px; line-height: 1.5; font-weight: 400; letter-spacing: 0.05em;  text-align: center; z-index: 3; }

section.products .row > div[class^="col"] figure { margin: 30px 0 0; text-align: center; }
section.products .row > div[class^="col"] .fee { margin: auto 0 25px; font-size: 14px; font-weight: 400; color: black; line-height: 1.1; text-align: center; letter-spacing: 0.05em; position: inherit; }
section.products .row > div[class^="col"] .fee .basic { margin: 0 0 1px; padding: 0; font-family: "din-2014",sans-serif; }
section.products .row > div[class^="col"] .fee .extension { margin: 0 0 10px; padding: 0; font-size: 14px; }
section.products .row > div[class^="col"] .fee .delivery { color: red; line-height: 1.3; }
section.products .row > div[class^="col"] .fee .announce { margin: 0; padding: 0; font-size: 14px; }
section.products .row > div[class^="col"] .fee .sale { color: red; }

section.products .row > div[class^="col"] .fee b { font-weight: 900; margin-left: 3px; }
section.products .row > div[class^="col"] .fee span { font-size: 36px; }
section.products .row > div[class^="col"] .fee small { padding-bottom: 3px; font-size: 12px; display: block; }
@media screen and (max-width: 767px) {
section.products .row > div[class^="col"] .fee small { font-size: 10px; }
}

section.products	figure { position: relative; }
section.products	figure .batch { position: absolute; width: 60px; height: 60px;  border-radius: 100px; display: flex; justify-content: center; align-items: center; }
section.products	figure .batch.popular { background: yellow; right: 40px; bottom: 40px; font-weight: 900; font-size: 15px; }

section.products .p_spec { margin: -10px 0 20px; /*position: absolute; bottom: 0; width: 100%; */display: flex; justify-content: center; align-items: center; position: relative; }
section.products .p_spec div { border: 1px solid #E6E6E6; padding: 0; border-radius: 6px; width: 50px; height: 50px; text-align: center; font-size: 12px; font-weight: 400; line-height: 1.4; margin: 0 4px; display: flex; justify-content:center; align-items:center; }
section.products .p_spec div.none { border: none; }
section.products .p_spec div.not_support { color: #ccc; }




section.products .p_spec div { /*background: #f7f7f7;*/ }
/*
section.products .p_spec .n1 { color: #2997ff; }
section.products .p_spec .n2 { color: #43b989; }
section.products .p_spec .n3 { color: #a972ff; }
section.products .p_spec .n4 { color: #A58942; }
*/

 section.products .btn__ {
  margin: 3px 4px;
  padding: 15px 20px 17px 25px;
  padding: 10px 15px 12px 20px;
  border-radius: 100px;
  color: white;
  line-height: 1;
  font-weight: 900;
  display: flex;
  align-items: center;
  text-decoration: none;
  justify-content: space-between;
  column-gap: 5px;
	 font-size: 14px;
}

 section.products .btn_here {
  background-color: #006DD9;
	 border: 1px solid #006DD9;
	 background: white;
	 color: #006DD9;
}
 section.products .btn_order {
		 border: 1px solid red;
  background-color: red;
}




/*
section.products2 .container { max-width: 1140px; padding: 60px 30px 60px; border-bottom: 1px solid #e8e8e8; }
section.products2 h2 { font-size: 28px; margin: 0 0 30px; font-weight: 700; }
@media screen and (max-width:768px) {
section.products2 { font-size: 24px; margin: 0 0 20px; }
}
*/











@media screen and (max-width:768px) {
#binoculars.row > * { padding-right: calc(var(--bs-gutter-x) * .2); padding-left: calc(var(--bs-gutter-x) * .2); }
#binoculars.row { margin-right: calc(-.2 * var(--bs-gutter-x)); margin-left: calc(-.2 * var(--bs-gutter-x)); }
#option.row > * { padding-right: calc(var(--bs-gutter-x) * .2); padding-left: calc(var(--bs-gutter-x) * .2); }
#option.row { margin-right: calc(-.2 * var(--bs-gutter-x)); margin-left: calc(-.2 * var(--bs-gutter-x)); }

section.products .container { padding: 0; }
section.products h2 small { font-size: 18px; line-height: 1.5;  }
section.products h3 { font-size: 20px; }
section.products .row > div[class^="col"] { margin: 0 0 20px; }
section.products .row > div[class^="col"] a { /*padding: 15px 0;*/ }
section.products .row > div[class^="col"] a img { }
section.products .row > div[class^="col"] a.wish { gap: 0; line-height: 1.5; }
section.products .row > div[class^="col"] a.wish img { display: none; }

section.products .row > div[class^="col"] .wrapper { padding: 20px 5px 20px;  }
section.products .row > div[class^="col"] .name .spec { font-size: 11px; }
section.products .row > div[class^="col"] .name { font-size: 16px; }
section.products .row > div[class^="col"] .detail { font-size: 13px; }
section.products .p_spec { display: none; }
section.products .row > div[class^="col"] .fee { font-size: 12px; }
section.products .row > div[class^="col"] .fee span { font-size: 26px; }
section.products .row > div[class^="col"] .fee .extension { font-size: 12px; }
section.products	figure .batch.popular { right: 20px; }

section.products .btn__ { margin: 3px 2px; padding: 10px 5px 12px 10px; font-size: 11px; }
section.products .btn__ i { display: none; }

}




section.products .p_batch { position: absolute; left: 0; top: 0; width: 100%; display: flex; justify-content: center; align-items: center; /*z-index: 10000;*/ }
section.products .p_batch .flag { line-height: 1.0; font-size: 10px; width: 70px; text-align: center; color: #fff; background: #CACACA; padding: 3px 0 5px; border-radius: 0 0 6px 6px; font-weight: 700; }
section.products .p_batch .flag.new { background: #FEEA34; background: yellow; color: black; }
section.products .p_batch.sale { left: inherit; right: 15px; top: 15px; justify-content: flex-end; }
section.products .p_batch .flag.sale { background: red; color: white; border-radius: 100px; padding: 15px 20px; flex-direction: row; min-width: 110px; font-size: 15px; font-weight: 900; letter-spacing: 0.1em; }

section.products a.soldout img { opacity: 0.2; }
section.products a.soldout .p_batch .flag { background: #444649; color: white; }













/* 商品一覧ページ タイトル周り */
.product_list .page_visual { padding: 40px 0 40px; }
.product_list .page_visual h1 small { display: block; margin: 0 0 10px; font-size: 20px; }
.product_list .page_visual h1 { margin: 0 0 20px; font-size: 40px; line-height: 1.1; font-weight: 700; }
.product_list .page_visual p { margin: 0; font-size: 20px; line-height: 1.4; }
.product_list .page_visual .container { /*max-width: 1140px;*/ display: flex; align-items: center; padding: 30px 15px; }

@media screen and (max-width: 768px) {
.product_list .page_visual .container { align-items: center; }
.product_list .page_visual h1 small { font-size: 16px; }
.product_list .page_visual h1 { font-size: 34px; }
.product_list .page_visual p { font-size: 16px; line-height: 1.5; }
}

/* 商品一覧ページ 双眼鏡の選び方 */
.product_list section.how_to_choose { display: none; }
.product_list section.how_to_choose .container { padding: 60px 15px 60px; border-bottom: 1px solid #e8e8e8; }
.product_list section.how_to_choose .title { margin: 20px 0 10px; font-size: 22px; font-weight: 900; }
@media screen and (max-width:768px) {
.product_list section.how_to_choose .container { padding: 40px 25px; }
}













section.flow { }
section.flow .container { /*max-width: 1020px;*/ margin: 0 auto; padding: 60px 15px 60px; border-bottom: 1px solid #e8e8e8; }
/*
section.flow h2 { margin: 0 0 30px; font-size: 36px; line-height: 1.3; text-align: center; font-weight: 900; }
*/
section.flow h2 small { display: block; margin-top: 15px; font-size: 20px; line-height: 1.5; text-align: center; font-weight: 600; }
section.flow .row { margin: 0 auto 20px; padding: 0; max-width: 1020px; }
section.flow .row > div[class^="col"] { padding-right: 25px; padding-left: 25px; position: relative; }
section.flow .row > div[class^="col"]:not(:last-child)::after { display: block; width: 40px; height: 40px; position: absolute; right: -50px; top: 40px; font-size: 40px; line-height: 60px; content: "\f105"; font-family: FontAwesome; color: #e6e6e6; }

section.flow .row > div[class^="col"] .flow_icon { margin: 0 auto 15px; text-align: center; }
section.flow .row > div[class^="col"].used .icon { padding-top: 21px; }
section.flow h3 { margin: 0 0 15px; font-size: 22px; font-weight: 900; text-align: center; line-height: 1.1; }
section.flow h3 small { display: block; font-size: 16px; padding: 0 0 5px; color: #bbb; display: none; }
section.flow p { margin: 0 0 15px; font-size: 14px; line-height: 1.6; }




@media screen and (max-width: 767px) {
section.flow .container { padding: 50px 15px 40px; }
section.flow h2 small { font-size: 18px; line-height: 1.5;  }
section.flow .row > div[class^="col"]:not(:last-child)::after { display: none; }
section.flow .row > div[class^="col"] { padding-right: 15px; padding-left: 15px; position: relative; }
section.flow h3 { font-size: 18px; }
section.flow p { font-size: 14px;  line-height: 1.6; }

}






section.faq { }
section.faq .container { /*max-width: 840px;*/ margin: 0 auto; padding: 60px 15px 40px; border-bottom: 1px solid #e8e8e8; }
/*
section.faq h2 { margin: 0 0 50px; font-size: 36px; line-height: 1.3; text-align: center; font-weight: 900; }
*/
section.faq h2 small { display: block; margin-top: 15px; font-size: 20px; line-height: 1.5; text-align: center; font-weight: 600; }
section.faq .q { position: relative; margin: 0 0 15px; padding: 0 40px 10px 34px; font-size: 14px; line-height: 1.6; border-bottom: 1px solid #e8e8e8; font-weight: 900; }
section.faq .q:hover { cursor: pointer; }
section.faq .a { position: relative; margin: 0 0 15px; padding: 0 40px 30px 34px; font-size: 14px; line-height: 1.6; border-bottom: 1px solid #e8e8e8; display: none; }
section.faq h3 { margin: 30px 0 15px; text-align: left; font-size: 16px; padding: 12px 15px 12px; background-color: #f6f6f6; border-radius: 4px; }
section.faq .row { margin: 0 auto; padding: 15px 20px 0; max-width: 1020px; }
section.faq .row .col-sm-12:last-child .a { border: none; padding-bottom: 0; }
section.faq .row:last-of-type { margin-bottom: 40px; }

section.faq .q::before	{
    position: absolute;
    top: 0;
    left: 0;

    content: '';
    background: url("/assets/images/ic_q_200x200.png") no-repeat left top;
        background-size: auto;
    background-size: 24px;
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
}
section.faq .q::after { position: absolute; top: 0; right: 10px; font-family: FontAwesome; content: '\f107';
	text-align: center;
	width: 24px; height: 24px;
	display: inline-block;
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease, -webkit-transform .3s ease;
	font-size: 18px;
}

section.faq .q.active::after {
    -webkit-transform: rotate(180deg) scale(1.08);
    -ms-transform: rotate(180deg) scale(1.08);
    transform: rotate(180deg) scale(1.08);
}

section.faq .a::before	{
    position: absolute;
    top: 0;
    left: 0;
    content: '';

    background: url("/assets/images/ic_a_200x200.png") no-repeat left top;

        background-size: auto;
    background-size: 24px;
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
}


@media screen and (max-width: 767px) {
section.faq .container { padding: 50px 15px 40px; }
section.faq .row { margin: 0px; padding: 15px 0 0; }
section.faq h2 small { font-size: 18px; line-height: 1.5;  }
section.faq .q { font-size: 14px; line-height: 1.4; }
section.faq .a { font-size: 14px; line-height: 1.6; }

}


























section.oshikura_merit { background: #F7F7F7;  }
section.oshikura_merit .container { max-width: 1020px; margin: 0 auto; padding: 100px 15px 0px; }

section.oshikura_merit .row { margin-bottom: 0px; }
section.oshikura_merit .row > div[class^="col"] { padding: 0 25px 20px; }
section.oshikura_merit .row > div[class^="col"] .icon { margin: 0 0 0px; text-align: center; }
section.oshikura_merit h3 { margin: 10px 0 10px; text-align: center; font-weight: 900; font-size: 18px; line-height: 1.3; }
section.oshikura_merit h3 small { display: block; color: black; font-size: 16px; text-align: center; }
section.oshikura_merit p { font-size: 14px; line-height: 1.5; }
section.oshikura_merit .row p { margin: 0 0 10px; line-height: 1.6; }
section.oshikura_merit .icon img { width: 60px; height: auto; }

@media screen and (max-width:768px) {
section.oshikura_merit .container { padding: 50px 15px 0px; }
section.oshikura_merit h2 { margin: 0 0 30px; font-size: 24px; }
section.oshikura_merit h2 small { font-size: 18px; line-height: 1.5;  }
section.oshikura_merit .row > div[class^="col"] { padding: 0 15px 0px; }
section.oshikura_merit h3 { margin: 10px 0 10px; font-size: 16px; line-height: 1.3;  }
section.oshikura_merit h3 small { font-size: 14px; }
section.oshikura_merit .row p { margin: 0 0 10px; line-height: 1.5; font-size: 14px; }
}
























section.cta { margin: 0; background: #F7F7F7; }
section.cta > .container { max-width: 1020px; margin: 0 auto; padding: 50px 15px 50px; }
section.cta .in { padding: 60px 0px; border-radius: 14px; /*border: 1px solid #ddd;*/ background-color: #fbf3ec; }

section.cta .in p:first-child { color: #ff8800; font-size: 20px; font-weight: bold; margin-bottom: 25px; }
section.cta .in>p:first-child { color: #ff8800; font-size: 20px; font-weight: bold; margin-bottom: 5px; }

section.cta .in h3 { margin: 0 0 40px; font-size: 26px; line-height: 1.3; font-weight: 900; }
section.cta .tel { margin: 0 0 20px; font-size: 27px; /*color: #FF8800;*/ font-weight: bold; line-height: 1.5; }
section.cta .tel i { margin: 0 3px 0 6px; }    
section.cta .tel span { display: block; font-size: 14px; font-weight: normal; }
section.cta .tel span small { font-size: 12px; }

section.cta .btn_order { width: 100%; width: 320px; }


.btn { padding: 13px 20px; border-radius: 100px; font-size: 15px; font-weight: 500; /*min-height: 50px;*/ text-wrap: nowrap; text-decoration: none!important; }
.btn.disabled, .btn:disabled { opacity: 0.3; }
.btn.btn_sm { padding: 5px 15px; font-size: 13px; min-height: 36px; }

@media screen and (max-width:768px) {
.btn { /*padding: 10px 15px; font-size: 13px;*/ }
}

.btn.btn_order { /*width: 100%;*/ /*padding-left: 34px;*/ padding-top: 13px; padding-bottom: 13px; color: #FFF; background-color: red; border-color: red; font-size: 15px; /*font-weight: bold;*/ border-radius: 100px; }
/*
.btn.btn_order::before { content: "\f105"; font-family: FontAwesome; font-weight: normal; float: right; }
*/
.btn.btn_order:hover { opacity: 0.8; background-color: red; border-color: red; }
.btn.btn_order.disabled { opacity: 0.3; }

.btn.btn_cont { background: white; border-color: #0d6efd; color: #0d6efd;  }
.btn.btn_cont:hover { opacity: 0.8; }

.btn.btn_next { background: #0d6efd; border-color: #0d6efd; color: white; }
.btn.btn_next:hover { opacity: 0.8; }

.btn.btn_back { background: #999; border-color: #999; color: white; }
.btn.btn_back:hover { opacity: 0.8; }

select:disabled { cursor: default; }

/*
section.cta .mp_btn { padding: 15px 50px; max-width: 300px; border-radius: 100px; font-size: 22px; font-weight: bold; line-height: 1.2; display: flex; justify-content: center; align-items: center; color: white; text-decoration: none; }
section.cta .mp_btn small { font-size: 16px; font-weight: normal; }
section.cta .mp_btn i { margin-left: auto; }

section.cta .mp_btn.contact { background-color: red; box-shadow: 0 8px 0 #A00000; }
section.cta .mp_btn.contact:hover { box-shadow: none; box-shadow: 0 4px 0 #A00000; }

section.cta .mp_btn.order { background-color: red; box-shadow: 0 8px 0 #A00000; }
section.cta .mp_btn.order:hover { box-shadow: none; box-shadow: 0 4px 0 #A00000; }

section.cta .mp_btn:hover { text-decoration: none; color: white; box-shadow: none; transform: translateY(4px); opacity: 1; }
section.cta .mp_btn:active .btn:visited { color: #fff; text-decoration: none; }

.btn-order { background: red; border-color: red; font-weight: 900; }
.btn-order:hover { background: red; border-color: red; opacity: 0.7; }
*/






@media screen and (max-width: 767px) {
section.cta .in { padding: 40px 20px; }
section.cta .in p:first-child { font-size: 16px; }
section.cta .in h3 { margin: 0 0 20px; font-size: 20px; }
section.cta .row > div[class^="col"] { margin-bottom: 20px; }
}



section.cta .logo { margin: 5px 0 10px; text-align: center; }
section.cta .logo img { width: 120px; }

section.cta .support_you { margin: 0 0 15px; line-height: 1.5; font-weight: normal; text-align: center; }
@media screen and (max-width:768px) {
section.cta .support_you { font-size: 13px; font-weight: normal; line-height: 1.5; }
}

section.cta ul { margin: 0; padding: 0; list-style-type: none; display: flex; justify-content: center; align-items: center; column-gap: 20px; }

.list_notice { margin-left: 16px; padding: 0; }
.list_notice li { margin: 0; padding: 0; list-style-type: none; font-size: 14px; line-height: 1.6; }
.list_notice li::before { margin-left: -16px; content: "※"; padding-right: 4px; font-size: 14px; }

.list_notice.s { margin-left: 14px; padding: 0; }
.list_notice.s li { margin: 0; padding: 0; list-style-type: none; font-size: 12px; line-height: 1.3; }
.list_notice.s li::before { margin-left: -16px; content: "※"; padding-right: 4px; font-size: 12px; }

section.cta .btn-order { font-size: 22px; }

section.pr .container { max-width: 1020px; margin: 0 auto; padding: 0 15px 30px; }
section.pr ul { margin: 0 auto; padding: 0; list-style-type: none; display: flex; justify-content: center; align-items: center; column-gap: 20px; }
section.pr figure img { border-radius: 4px; }
@media screen and (max-width:768px) {
section.pr ul { flex-wrap: wrap; }
section.cta .btn-order { font-size: 16px; }
}













footer { padding: 40px 15px 60px; text-align: center; /*background-color: #eee;*/ background: #F7F7F7; }
footer .mp_logo { margin-bottom: 20px; }
footer .company { margin-bottom: 3px; font-size: 13px; }
footer .address { margin-bottom: 15px; font-size: 13px; }
footer .mp_logo img { width: 220px; }
footer .bj_logo { margin-bottom: 40px; font-size: 13px; }
footer .bj_logo img { margin: 0 5px; }
footer .link { margin-bottom: 20px; padding: 0; list-style-type: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
footer .link li { display: inline-block; padding: 0 10px; }
footer .link a { text-decoration: none; color: #333; font-size: 13px; }
footer .link a:hover { color: #0d6efd; text-decoration: underline; }
footer .copyright { font-size: 11px; letter-spacing: 0.1rem; }

footer .sns { margin: 0 0 20px; }
footer .sns p { margin: 0 0 8px; font-size: 12px; }
footer .sns p:last-of-type { display: flex; justify-content: center; align-items: center; column-gap: 13px; }
footer .sns img { height: 20px; width: auto; }
footer .sns a { color: black; font-size: 16px; }

@media screen and (max-width:768px) {
footer { padding: 50px 15px; }
footer .mp_logo img { width: 220px; }
footer .link { display: block; border-top: 1px solid #ccc; }
footer .link li { display: block; border-bottom: 1px solid #ccc; text-align: left; }
footer .link a { display: block; padding: 15px 0; }
}



#gotop { position: fixed; right: 30px; bottom: 50px; /*display: none;*/ z-index: 1000; }
#gotop a { display: block; background: url("/assets/images/ic_goto_top.png") no-repeat left top; background-size: 100%; width: 60px; height: 60px; text-indent: -99em; overflow: hidden; transition: all .25s ease; }
#gotop a:hover { opacity: 0.7; }


@media (max-width: 768px) {
#gotop { position: fixed; right: 20px; bottom: 20px; }
#gotop a { display: block; background: url("/assets/images/ic_goto_top.png") no-repeat left top; background-size: 100%; width: 40px; height: 40px; text-indent: -99em; overflow: hidden; transition: all .25s ease; }
}





.br-pc {display: block; }
.br-sp {display: none; }
._pc_none { display: none; }
._sp_none { display: initial; }
@media screen and (max-width:768px) {
.br-pc {display: none; }
.br-sp {display: block; }
._pc_none { display: block; }
._sp_none { display: none; }
}

.annotation { margin-left: 1.5rem; padding: 0; }
.annotation li { margin: 0; padding: 0 0 3px; list-style-type: none; line-height: 1.4; font-size: 14px; }
.annotation li::before { margin-left: -1.6rem; content: "※"; padding-right: 0.2rem; }


.btn-outline-primary { border-radius: 100px; padding: 8px 30px 10px; background-color: white; }
.btn-primary { /*border-radius: 100px; padding: 8px 30px 10px;*/ }












.g-menu__link { }
.g-menu__item { position: relative; }
.g-menu__dropdown-menu { opacity: 0; pointer-events: none; position: absolute; top: 100%; left: -150px;  }

.g-menu__item:hover .g-menu__dropdown-menu { opacity: 1; pointer-events: auto; transition: .5s; }

/*
.g-menu__dropdown-menu .in { background: white; width: auto; list-style-type: none; display: block!important; padding: 20px 20px 20px 20px; border-radius:  10px 10px; border: 3px solid #1F65A8; white-space: nowrap; margin-top: 16px; box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .5); }
*/
.g-menu__dropdown-menu .in { background: white; width: auto; list-style-type: none; display: flex; /*justify-content: center;*/
/*  align-items: center;*/ gap: 30px; padding: 50px 60px 60px 60px; border-radius: 10px; /*white-space: nowrap;*/ margin-top: 35px; 
	box-shadow: 0 0px 10px 0 rgba(0, 0, 0, .5); 
	box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1); 
	box-shadow: 2px 4px 12px rgba(0,0,0,.08); 
	box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1); 
	flex-wrap:wrap; }

.g-menu__dropdown-menu .in > div { display: flex; }

.g-menu__dropdown-menu a { display: block; padding: 10px 40px 10px 0; }
.g-menu__dropdown-menu a:hover { border: none!important; }
.g-menu__dropdown-menu a.scd { padding-left: 1rem!important; }
.g-menu__dropdown-menu i { color: #1F65A8; margin-right: 5px; }

header .global_menu ul.menu .dd_items { line-height: 1.5; }
header .global_menu ul.menu .dd_items li div { background: #fafafc; background: #f6f6f6; border-radius: 7px; text-align: center; }
header .global_menu ul.menu .dd_items li div a { padding: 10px 0 15px; width: 130px; color: #006DD9; color: black; line-height: 1.4; }
header .global_menu ul.menu .dd_items li div a:hover { opacity: 0.7; text-decoration: underline; }
header .global_menu ul.menu .dd_items li div a img { width: 70px; height: auto; }
header .global_menu ul.menu p.title { font-size: 16px!important; font-weight: 900; margin: 0 0 15px!important; padding: 0!important; }
header .global_menu ul.menu p.title a { font-size: 16px!important; font-weight: 900; margin: 0 0 15px!important; padding: 0!important; }

/*
section.key_visual .video { width: 100%; height: 800px; position: absolute; top: 0; left: 0; overflow: hidden; z-index: -1; }
section.key_visual .video video { min-width: 100%; min-height: 100%; width: auto; height: auto; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); }
section.key_visual .in { height: 800px; }
section.key_visual .in .container-fluid { text-align: center; padding: 30px 15px; }
*/
/*
background: url('/oshikatsu/common/images/key_visual_logo.png') top 50px center no-repeat;
background-size: auto;
background-size: auto 400px;*/













	.kando_point { margin: 0 auto 40px; max-width: 860px; /*background: url('/oshikatsu/common/images/key_visual_back.jpeg') 0px top no-repeat;*/ border-radius: 14px; /* color: white; */ background: white; background: #fdf2f3; /*url('/oshikatsu/binoculars/images/AdobeStock_258747917_Preview.jpeg') no-repeat center bottom;*/ background: #07256c; }

	.kando_point { margin: 0 auto 80px; max-width: 860px; background: url('https://www.netage.ne.jp/oshikatsu/common/images/key_visual_back.jpeg') center center no-repeat; border-radius: 4px; }

	.kando_point .in { /*background-color: #FFFEDE; background: white;*/ padding: 20px 0 10px; border-radius: 20px; text-align: center; }
	.kando_point .head { margin: 0 0 15px; font-size: 20px; font-weight: 900; text-align: center; /*color: #ffafa2;*/ color: black; 
		/*background: linear-gradient(51deg,#FF0000,#FF6400 15%,#FFA816 35%,#FF9A87 55%,#F747D1 80%,#AD5DF1); display: inline-block; background-clip: text; -webkit-text-fill-color: transparent; */ }
	.kando_point ul { margin: 0; padding: 0; text-align: center; list-style-type: none; display: flex; justify-content: center; }
	.kando_point ul li { display: inline-block; margin: 0 15px 15px; padding: 10px 25px 10px; /*background-color: #F7F7F7;*/ background: white; border-radius: 4px; font-weight: 900; font-size: 18px; display: flex; /*border: 1px solid #fff;*/ color: black; }
	.kando_point ul li img { margin-right: 2px; }

@media screen and (max-width:768px) {
    .kando_point { background-position-y: -160px; background-position: center right; }
	.kando_point .in { padding: 15px 0; }
	.kando_point .head { margin: 0 0 10px; font-size: 18px; color: black; }
	.kando_point ul li { font-size: 15px; margin: 0 5px; padding: 5px 10px 5px; }
	.kando_point ul li img { display: none; }
}




section.rental_days {  }
section.rental_days .container { /* max-width: 1020px;*/ margin: 0 auto; padding: 60px 15px 60px; border-bottom: 1px solid #E6E6E6; }
/*
section.rental_days h2 { margin: 0 0 30px; font-size: 36px; line-height: 1.3; text-align: center; font-weight: 900; }
section.rental_days h2 + p { margin: -20px 0 40px; font-size: 24px; font-weight: 700; text-align: center; }
*/

section.rental_days ul { margin: 0; padding: 0; list-style-type: none; display: flex; justify-content: center; align-items: center; column-gap: 20px; }
section.rental_days ul li { margin-bottom: 20px; }
section.rental_days ul li:last-of-type { border: 5px solid #f6f6f6; padding: 20px; display: flex; justify-content: center; align-items: center; border-radius: 14px; }

@media screen and (max-width:768px) {
section.rental_days ul { flex-flow: column; }
}






section.guide { }
section.guide .container { max-width: 1520px; margin: 0 auto; padding: 60px 15px 20px; }
/*
section.guide h2 { margin: 0 0 30px; font-size: 36px; line-height: 1.3; text-align: center; font-weight: 900; }
*/
section.guide h3 { margin: 30px 0 0px; text-align: center; font-size: 30px; font-weight: 800; }
section.guide .row { margin: -30px 0 0; padding-bottom: 60px; overflow: hidden; }

section.guide .row .col-sm-4 { /*float: left; width: 33.33333333%;*/ padding: 0 30px; }
@media screen and (max-width:768px) {
section.guide .row .col-sm-4 { padding: 0; }
}


section.guide h4 { margin: 30px 0 15px; padding: 0 0 15px; text-align: left; font-size: 18px; border-bottom: 1px solid #EAECEE; font-weight: 900; }

@media screen and (max-width:768px) {
section.guide h4+div { padding-bottom: 30px; }
}

section.guide h5 { margin: 0 0 5px; font-size: 14px; line-height: 1.6; font-weight: 600; }
section.guide p { font-size: 13px; line-height: 1.6; }
section.guide .btm_0 { margin-bottom: 0; }
section.guide img { margin-bottom: 10px; }
section.guide .ccard { margin-right: 5px; }
section.guide .ccard:last-child { margin-right: 0; }
section.guide .list_notice li { padding-bottom: 3px; font-size: 12px; line-height: 1.5; }
section.guide .list_notice li::before { margin-left: -16px; content: "※"; padding-right: 4px; font-size: 12px; }

@media screen and (max-width:768px) {
section.guide h4 { text-align: left; }
}


@media screen and (max-width:768px) {
section.guide .row { margin: 0; }
section.guide h4+div { display: none; }

section.guide h4 { position: relative; margin: 0px 0 15px; padding: 0 0 10px; font-size: 16px; font-weight: normal; }

section.guide h4::after {
  position: absolute;
  right: 10px;
  font-family: FontAwesome;
  content: '\f107';
  text-align: center;
  width: 24px;
  height: 24px;
  display: inline-block;
  -webkit-transition: -webkit-transform .3s ease;
  transition: -webkit-transform .3s ease;
  transition: transform .3s ease;
  transition: transform .3s ease, -webkit-transform .3s ease;
  font-size: 18px;
}
section.guide h4.active::after {
    -webkit-transform: rotate(180deg) scale(1.0);
    -ms-transform: rotate(180deg) scale(1.0);
    transform: rotate(180deg) scale(1.0);
}
}













/* 推し活 癒しセット */
section.collection.option_set .lineup .card_media figure:first-of-type { margin-bottom: 10px; }
section.collection.option_set .lineup .card_media figure:first-of-type img { max-height: 30px; border-radius: 0; }
section.collection.option_set .lineup .card_media figure:last-of-type img { max-height: 65px; border-radius: 0; }
section.collection.option_set .lineup .card_infomation .name { font-size: 14px; margin-bottom: 10px; font-weight: 500; }
section.collection.option_set .lineup .card_infomation .read { font-size: 12px; line-height: 1.5; color: #989898; }
section.collection.option_set .lineup .card_infomation .read b { font-weight: 500; color: black; }

















.modal.fade.show { /*display: flex!important; justify-content: center; align-items: center;*/ }
/*
.modal-backdrop.fade { opacity: 0.6; }
*/
.modal-backdrop { background-color: rgba(0, 0, 0, 0.48) !important; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.modal-backdrop.show { opacity: 1 !important; }
.modal-content { border-radius: 14px; color: black; }
.modal-header { padding: 20px 30px 20px; }
.modal-title { font-size: 16px; }
.modal .modal-body { line-height: 1.7; padding: 25px 30px; }
@media screen and (max-width:768px) {
.modal .modal-body { padding: 25px 20px; }
}

.modal h4 { text-align: center; font-weight: bold; font-size: 15px; }
.modal .modal-body figure { text-align: center; }
.modal .modal-body p { font-size: 14px; line-height: 1.5; }
.modal .modal-body .image { width: 100%; height: 80px; background: #eee; border-radius: 4px; text-align: center; }
.modal .modal-body .image img { max-width: 80px; height: auto; }
.modal .modal-body table { margin: 0 0 30px; font-size: 14px; line-height: 1.5; border-top: 1px solid #ddd; }
.modal .modal-body table th { padding: 5px 10px; border-bottom: 1px solid #ddd; }
.modal .modal-body table td { padding: 5px 10px; border-bottom: 1px solid #ddd; }


.modal .modal-body table.anshin { margin: 0 0 30px; font-size: 14px; line-height: 1.5; }
.modal .modal-body table.anshin th { padding: 5px 10px; border: 1px solid #ddd; text-align: center; font-weight: normal; background: #eee; }
.modal .modal-body table.anshin td { padding: 5px 10px; border: 1px solid #ddd; }

.modal .modal-body p:last-of-type { margin-bottom: 2rem; display: -webkit-box; -webkit-box-orient: vertical; }

.modal .modal-body .name { margin-bottom: 2rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; /*height: 39px;*/ }

.modal .btn-default { width: 100%; padding: 10px; color: #0066CC; border-color: #0066CC; border-radius: 100px; }
.modal .btn-default:hover { color: white; background-color: #0066CC; }
.modal .marker { background: linear-gradient(transparent 60%, #ff6 60%); }
.modal .label { background: none; border: 1px solid #333; border-radius: 2px; color: black; }
.modal .waku { margin-bottom: 20px; }
.modal .waku .waku_header { padding: 8px 15px 6px; text-align: center; background-color: #ddd; border-radius: 14px 14px 0 0; }
.modal .waku .waku_body { padding: 15px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 14px 14px; }
.modal .waku p:last-of-type { margin-bottom: 0; }
.modal .waku ul { margin-bottom: 0; padding-left: 20px; }




.modal.feature_img .modal-body { padding: 0; }





.nuri { background: #f5f5f7; padding: 20px; margin: 0 0 20px; border-radius: 14px; }
.nuri p:last-of-type { margin: 0; }




.next_show { position: relative; }
.next_show::before { content: "さらに表示"; }
.next_show::after { position: absolute; font-family: FontAwesome; content: '\f107'; text-align: center; display: inline-block;
  -webkit-transition: -webkit-transform .3s ease; transition: -webkit-transform .3s ease; transition: transform .3s ease; transition: transform .3s ease, -webkit transform .3s ease; font-size: 18px; color: black; right: -16px; top: -4px; }
.next_show.active::before { content: "閉じる"; }
.next_show.active::after { -webkit-transform: rotate(180deg) scale(1.0); -ms-transform: rotate(180deg) scale(1.0); transform: rotate(180deg) scale(1.0); }






.confirmation { margin: 0 0 25px; padding: 0; /*background: #fdf2f3; border-radius: 14px;*/ }
.confirmation { margin: 30px 0 20px; }
.confirmation .header { padding: 10px 13px; /*border: 1px solid #f9cdd2;*/ background-color: #f9cdd2; background: #eee; text-align: center; border-radius: 14px 14px 0 0; color: red; font-weight: 700; font-size: 15px; }
.confirmation .body { padding: 20px; /*border: 1px solid #f9cdd2; border-top: none;*/ border-radius: 0 0 14px 14px; background-color: #fff3f3; background: #f7f7f7; }
.confirmation ul { padding-left: 1rem; }
.confirmation ul:last-of-type { margin-bottom: 0; }
.confirmation ul li { font-size: 13px; line-height: 1.6; }







.show_hide { transition: 0.5s; }
.show_hide.hide { transform:translateY(-60px); }




section.staff_review h2 { margin: 20px 0 0; padding: 15px 0; font-size: 18px!important; font-weight: 400!important; }
section.staff_review .staff_info { margin-bottom: 10px; display: flex; column-gap: 10px; align-items: center; }
section.staff_review .staff_info span { padding-left: 10px; color: #888; font-size: 12px; }
section.staff_review .staff_info img { width: 40px; height: auto; }
section.staff_review .staff_review p { font-size: 13px; line-height: 1.5; }



section.user_review h2 { margin: 20px 0 0; padding: 15px 0; font-size: 18px!important; font-weight: 400!important; }
section.user_review .user_review p { margin: 0 0 10px; font-size: 13px; line-height: 1.5; }
section.user_review .user_review p.read { margin: 0 0 10px; font-size: 15px; line-height: 1.5; }
section.user_review .user_info { margin-bottom: 30px; color: #999; }
section.user_review .col-12 .user_info { padding-bottom: 30px; border-bottom: 1px solid #dadada; }
section.user_review .col-12:last-of-type .user_info { border: none; }



section.tag { margin: 0; background: #F7F7F7; padding: 15px 15px; border-radius: 8px; }
section.tag .title { margin: 0 0 8px; font-size: 13px; }
section.tag > div { display: flex; gap: 5px; flex-wrap: wrap; }
section.tag label a { display: inline-block; background: white; padding: 8px 13px; border-radius: 100px; font-size: 13px; white-space: nowrap; line-height: 1; }
section.tag label a:hover { background: #0d6efd; color: white; }

section.sns_share { margin: 0 0 20px; }
section.sns_share p { margin: 0 0 8px; font-size: 13px; text-align: center; }
section.sns_share p:last-of-type { display: flex; justify-content: center; align-items: center; column-gap: 13px; }
section.sns_share img { height: 20px; width: auto; }
section.sns_share a { color: black; font-size: 16px; }






/* お客様の声で改善しましたコーナー（最初の画面用） */
section.user_voice { background: #FCF8EF; margin-bottom: 2px; }
section.user_voice .container { max-width: 1020px; margin: 0 auto; padding: 60px 15px 20px; }
section.user_voice h2 img { margin: 0 0 15px; width: 100%; height: auto; max-width: 160px; }
/*
section.user_voice h2 + p { font-size: 14px; line-height: 1.7; font-weight: 500; }
section.user_voice .container > p { font-size: 14px; text-align: center; line-height: 1.7; font-weight: 500; }
*/
@media (max-width: 768px) {
/*
section.user_voice .container { padding: 30px 25px 30px; }
*/
section.user_voice h2 img { margin: 0 0 5px; max-width: 160px; }
/*
section.user_voice h2 + p { text-align: left; font-size: 14px; font-weight: 500; }
section.user_voice .container > p { text-align: left; font-size: 14px; font-weight: 500; }
section.user_voice .container > p:nth-of-type(2) { font-size: 14px; text-align: left; }
*/
}

section.user_voice .swiper-slide { margin: 0 0 5px; }
section.user_voice .swiper-slide .wrapper { margin: 0; padding: 20px; text-decoration: none; color: black; background: white; border-radius: 8px; /*box-shadow: 2px 4px 12px rgba(0,0,0,.08);*/ height: 100%; }

section.user_voice .swiper-slide .wrapper .number { background: white; border-radius: 9999px; font-size: 24px; font-weight: 900; line-height: 1; }
section.user_voice .swiper-slide .wrapper .image { margin-bottom: 10px; z-index: 20; }
section.user_voice .swiper-slide .wrapper .text { line-height: 1.7; font-size: 14px; font-weight: 400; color: #989898; }
section.user_voice .swiper-slide .wrapper .text strong { font-weight: 800; color: black; padding-right: 2px; }
@media (max-width: 768px) {
section.user_voice .swiper-slide .wrapper .text { line-height: 1.5; }
}
/*
.modal-trigger { position: absolute; bottom: 0; right: 0; z-index: 999; border-radius: 9999px; padding: 10px; margin: 15px; display: block; width: 36px; overflow:visible; background: none; border: 0; box-sizing: initial; color: inherit; cursor: pointer; vertical-align: inherit; }
*/
.modal-trigger { border-radius: 9999px; width: 36px; background: none; border: 0; box-sizing: initial; color: inherit; cursor: pointer; }
.modal-trigger:hover { opacity: 0.7; }

section.user_voice .batch { position: absolute; top: 30px; right: 30px; z-index: 999; }
section.user_voice .batch img { max-width: 60px; }

/* お客様の声で改善しましたコーナー（モーダル用） */
.modal.user_voice .modal-header { padding: 40px 80px 40px 35px; background: #FCF8EF; border: none; }
.modal.user_voice .modal-title { display: flex; align-items: left; font-weight: 900; flex-direction: column; gap: 5px; font-size: 18px; }
.modal.user_voice .modal-title span:first-of-type { margin-bottom: 10px; font-size: 14px; }
.modal.user_voice .modal-title img { max-width: 100px; }
.modal.user_voice .modal-body { padding: 20px 50px 50px; }
.modal.user_voice .modal-body p { line-height: 1.8; }
.modal.user_voice .btn-default { width: inherit; padding: 10px 20px; font-size: 14px; }
.modal.user_voice .modal-header { padding: 40px 50px 35px; }
@media (max-width: 768px) {
.modal.user_voice .modal-body { padding: 20px 20px 20px; }
.modal.user_voice .modal-header { padding: 40px 30px 25px; }
}

.modal.user_voice .modal-close-button { position: absolute; top: 0px; right: 0px; z-index: 999; border-radius: 9999px; padding: 10px; margin: 10px; display: block; width: 40px; overflow:visible; background: none; border: 0; box-sizing: initial; color: inherit; cursor: pointer; vertical-align: inherit;  align-self: flex-end; }
.modal.user_voice .modal-close-button .modal-close-icon { background: #e8e8ed; border-radius: 50%; color: black; display: flex; align-items: center; height: 40px; width: 40px; outline: none; transition: color 100ms linear,background 100ms linear; position: relative; }
.modal.user_voice .modal-close-button .modal-close-icon svg { fill: currentColor; position: absolute; left: 50%; transform: translateX(-50%); height: 20px; width: 20px; }
.modal.user_voice ul.dd_items { margin: 0 0 20px; padding: 0; line-height: 1; list-style-type: none; display: flex; line-height: 1.5; grid-column-gap: 10px; }
.modal.user_voice ul.dd_items li { width: 25%; }
.modal.user_voice ul.dd_items li div { background: none; text-align: center; }
.modal.user_voice ul.dd_items li div a { display: block; background: #f6f6f6; padding: 5px 0 15px; line-height: 1.5; font-size: 12px; border-radius: 7px; }
.modal.user_voice ul.dd_items li div a:hover { opacity: 0.7; text-decoration: underline; }
.modal.user_voice ul.dd_items li div a img { width: 80%; height: auto; }
@media (max-width: 768px) {
.modal.user_voice ul.dd_items { grid-column-gap: 5px; }
}


/* カレンダー（空き状況の確認） */
.reserv_check .title { margin: 0 0 8px; font-size: 13px; }
.reserv_check .in { margin: 0 0 10px; display: flex; width: 100%; }
.reserv_check .navi { padding: 0 10px; background: #f3f3f3; display: flex; justify-content: center; align-items: center; font-size: 14px; color: #0d6efd; cursor: default; }
.reserv_check .navi.left { border-radius: 4px 0 0 4px; }
.reserv_check .navi.right { border-radius: 0 4px 4px 0; }
.reserv_check .navi:hover:not(.disabled) { background: #eee; cursor: pointer; }
.reserv_check .navi.disabled { color: #ddd; cursor: not-allowed; /* 操作不可であることを示すカーソル */ pointer-events: none; /* クリックイベント自体を無効化 */ }

.reserv_check .week { display: flex; display: grid; flex: 1 1 0%; grid-template-columns: repeat(7, 1fr); border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; }

.reserv_check .week > div { padding: 3px 0; text-align: center; font-size: 10px; }
.reserv_check .week > div:first-of-type { color: red; }
.reserv_check .week > div:last-of-type { color: blue; }

.reserv_check .days { border-bottom: 1px solid #eaeaea; }
.reserv_check .days .in { margin: 0; display: flex; display: grid; flex: 1 1 0%; grid-template-columns: repeat(7, 1fr); }

.reserv_check .days button { display: block; padding: 10px 0 8px; background: white; border: none; }
.reserv_check .days button { font-family: YakuHanJP, 'Noto Sans JP', 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", sans-serif !important; cursor: default; }
.reserv_check .days button:hover:not([aria-selected="false"]) { cursor: pointer; background: #0d6efd; color: white; background: #976F11; }
.reserv_check .days button:hover:not([aria-selected="false"]) span { color: white!important; }
.reserv_check .days button:hover:not([aria-selected="false"]) div { color: white!important; }
.reserv_check .days span { display: block; font-size: 10px; padding: 0 0 5px; line-height: 1; }
.reserv_check .days button div { font-size: 10px; }
.reserv_check .days button:nth-of-type(7n) span { color: blue; }
.reserv_check .days button:nth-of-type(7n-6) span { color: red; }
.reserv_check .days button[aria-selected="false"] * { color: #ddd!important; }
.reserv_check .days button.inPeriod { background: #fcf1f1; background: #0d6efd; color: white; }
.reserv_check .guide { margin: 0 0 30px; font-size: 13px; text-align: center; color: #333; }

/* お届け日・返却日の選択状態（青） */
.reserv_check .in button.selected-startpoint { background-color: #0d6efd !important; color: #fff !important; opacity: 1 !important; border-radius: 7px 0 0 7px; }
.reserv_check .in button.selected-endpoint { background-color: #0d6efd !important; color: #fff !important; opacity: 1 !important; border-radius: 0 7px 7px 0; }
.reserv_check .in button.selected-startpoint.selected-endpoint { border-radius: 7px !important; }
/* 期間中の日付 */
.reserv_check .in button.in-range { background-color: #e7f1ff; color: #333 !important; }

/* カレンダー：お届け日より前の日付をグレーアウト（クリックは可能） */
.reserv_check .in button.date-before-start {
    opacity: 0.4;
    cursor: pointer !important;
}

.reserv_check .in button.date-before-start:hover {
   /* background-color: #f8f9fa;*/
   /* opacity: 0.4; */
}

.reserv_check .in button.date-before-start span,
.reserv_check .in button.date-before-start div {
    color: #aaa !important;
}
/* 押せない状態のスタイル調整 */
.reserv_check .in button:disabled span { color: #ddd!important; }
.reserv_check .in button:disabled div { color: #ddd!important; }
.reserv_check .in button:disabled:hover span { color: #ddd!important; }
.reserv_check .in button:disabled:hover div { color: #ddd!important; }
.reserv_check .in button:disabled:hover { background-color: white!important;}

@media (max-width: 768px) {
  .reserv_check .days button { padding: 5px 0 2px; }
  .reserv_check .days span { padding: 0 0 1px; }
}





.fee .mp_badge { margin-top: 3px; font-size: 9px; padding: 3px 7px 4px; border-radius: 4px; text-align: center; font-weight: 700!important; font-size: 9px!important; color: #aaa; background: #eee; white-space: nowrap; }
.fee .mp_badge.rental { color: green; background: #c8e8c8; }
.fee .mp_badge.sell { color: #d87716; background: #ffe2aa; }
@media (max-width: 768px) {
  .fee .mp_badge { font-size: 9px!important; }
}

.rating {
  display: flex;
  align-items: center;
}
.rating-star {
  /* Calculate the filled percentage based on the rating values */
  --percent: calc(var(--rating) / var(--rating-max) * 100%);
  
  display: inline-block;
  font-family: Times, serif; /* Using a common font for the star symbols */
  letter-spacing: 0.1rem;
  line-height: 1;
  margin: 0;
  font-size: 16px;
}
.rating-star::before {
  content: "\2605\2605\2605\2605\2605";
  background: linear-gradient(90deg, #ffb503 var(--percent), #eee var(--percent));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.rating-value {
  margin-left: 5px; /* Space between stars and number */
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
}






/* Swiper用カスタマイズ */
.swiper-slide {
  height: auto; /* 高さを揃える */
  /* カードのスタイル調整（必要に応じて） */
  background: #fff;
  border-radius: 8px;
}

/* リンクエリアを親要素いっぱいに広げる */
.swiper-slide a {
  display: block;
  height: 100%;
}

/* ボタンを包むコンテナ（右寄せ用） */
.swiper-controls-wrapper {
  display: flex;
  justify-content: flex-end; /* 右寄せ */
  align-items: center;
  gap: 12px; /* ボタン同士の間隔 */
  margin-top: 25px; /* 商品カードとの隙間 */
  padding-right: 5px; /* 右端の微調整 */
  width: 87.5%;
}

/* 矢印ボタンの共通スタイル */
.swiper-button-next,
.swiper-button-prev {
  position: static !important; /* デフォルトの絶対配置を解除 */
  margin: 0 !important;        /* デフォルトのマージンを解除 */
  width: 32px !important;      /* 横幅（Apple風に小さく） */
  height: 32px !important;     /* 高さ */
  background-color: #e8e8ed;   /* 背景色（薄いグレー） */
  border-radius: 50%;          /* 完全な丸にする */
  color: #1d1d1f;              /* 矢印の色（濃いグレー/黒） */
  transition: opacity 0.3s;    /* ホバー時のアニメーション */
  color: black !important;
}

/* ホバー時の挙動 */
.swiper-button-next:hover,
.swiper-button-prev:hover {
  opacity: 0.7;
  cursor: pointer;
}

/* 矢印アイコン自体のサイズ調整 */
.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 14px !important; /* 矢印アイコンを小さく */
  font-weight: bold;
}

/* ボタンが無効（端に到達）な場合 */
.swiper-button-disabled {
  opacity: 0.3 !important;
  cursor: default !important;
}

/* ページネーション（ドット）は不要であれば非表示にする */
.swiper-pagination {
  display: none; 
}




/* サービス改善セクション（#icon_user_voice）専用設定 */

/* コンテナの幅制限を解除し、画面いっぱい（フルワイド）にする */
section.user_voice .container {
  max-width: 100% !important; /* 既存の1020px制限を解除 */
  width: 100%;
}

/* Swiper本体の調整 */
#icon_user_voice {
  padding: 0 0 40px; /* 左右に少し余白、下にページネーション用余白 */
}

/* --- カードの高さを揃える設定（PC/SP共通） --- */
#icon_user_voice .swiper-slide {
  height: auto;
  display: flex;
}

#icon_user_voice .wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#icon_user_voice .wrapper .text {
  flex-grow: 1;
}

/* --- PC表示（768px以上）: 幅250px設定 --- */
@media (min-width: 768px) {
  /* PCではスライドの幅を250pxに固定する */
  /* JS側の slidesPerView: 'auto' と組み合わせることで、
     画面幅に入るだけ並ぶようになります */
  #icon_user_voice .swiper-slide {
    width: 250px !important; 
  }
  
  /* PCのときはコンテナの左右余白を少し増やす（見栄え調整） */
  section.user_voice .container {
    padding-left: 30px;
    padding-right: 30px;
    
    /* フルHDクラスの画面までは横幅いっぱい使い、それ以上は中央に寄せる */
    max-width: 1800px !important; 
    margin-left: auto;
    margin-right: auto;
  }
}


section.top_carousel .container { padding: 30px 15px 20px; overflow: hidden; }
/* --- PC表示（768px以上）: 幅250px設定 --- */
@media (min-width: 768px) {
  /* PCではスライドの幅を250pxに固定する */
  /* JS側の slidesPerView: 'auto' と組み合わせることで、
     画面幅に入るだけ並ぶようになります */
  #top_carousel .swiper-slide {
    width: 250px !important; 
  }
  
  /* PCのときはコンテナの左右余白を少し増やす（見栄え調整） */
  section.top_carousel .container {
    padding-left: 30px;
    padding-right: 30px;
    
    /* フルHDクラスの画面までは横幅いっぱい使い、それ以上は中央に寄せる */
    max-width: 1800px !important; 
    margin-left: auto;
    margin-right: auto;
  }
}
#top_carousel .swiper-slide img { border-radius: 10px; /*filter: drop-shadow(0 0px 6px rgba(225, 225, 225, 1));*/ }

/* Swiper 初期ロード時の縦並び防止用 CSS */

/* コンテナからはみ出した部分を隠す（横スクロールバー防止） */
#top_carousel {
  overflow: hidden;
}

/* ラッパーを強制的にFlexボックス（横並び）にする */
#top_carousel .swiper-wrapper {
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
  gap: 15px;
}
@media screen and (min-width: 768px) {
  #top_carousel .swiper-wrapper {
    gap: 25px;
  }
}
#top_carousel.swiper-initialized .swiper-wrapper {
  gap: 0;
}

/* スライドが潰れないようにする */
#top_carousel .swiper-slide {
  flex-shrink: 0;
  /* スマホ等で幅が未指定の場合に100%になってしまうのを防ぐための暫定幅設定 */
  /* 必要に応じて調整必要。PCはmedia queryで250pxが効きます */
  width: 60%; 
  position: relative;
}

/* --- 商品一覧＆最近チェックした商品のワイド表示設定 --- */

/* コンテナの幅制限を解除して広げる（PC/SP共通） */
section.products_section > .container,
section.products2 .container {
  max-width: 1800px !important; /* フルHD以上の画面で広がりすぎないよう上限を設定 */
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px; /* スマホ用初期値 */
  padding-right: 15px;
}

/* --- PC表示（768px以上）の設定 --- */
@media (min-width: 768px) {
  /* 左右の余白を少し広めに確保 */
  section.products_section > .container,
  section.products2 .container {
    padding-left: 30px;
    padding-right: 30px;
  }

  /* * スライド（商品カード）の幅を固定する
   */
  section.products_section .swiper-slide,
  section.products2 .swiper-slide,
  section.collection .swiper-slide {
    width: 250px !important; 
  }
}

/* カード番号マスク用のスタイル */
.card-mask { font-size: 6px; letter-spacing: 2px; vertical-align: 2px; margin: 0 0 0 5px; color: #6c757d; }

