@charset "UTF-8";
/*! ==================================================
 * レイヤー名: foundation
 * 説明: 全体のリセット設定
 * ================================================== */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{
  line-height:1.15;
  -webkit-text-size-adjust:100%;
}
body{
  margin:0;
}
main{
  display:block;
}
h1{
  font-size:2em;
  margin:.67em 0;
}
hr{
  box-sizing:content-box;
  height:0;
  overflow:visible;
}
pre{
  font-family:monospace,monospace;
  font-size:1em;
}
a{
  background-color:transparent;
}
abbr[title]{
  border-bottom:none;
  text-decoration:underline;
  -webkit-text-decoration:underline dotted;
          text-decoration:underline dotted;
}
b,strong{
  font-weight:bolder;
}
code,kbd,samp{
  font-family:monospace,monospace;
  font-size:1em;
}
small{
  font-size:80%;
}
sub,sup{
  font-size:75%;
  line-height:0;
  position:relative;
  vertical-align:baseline;
}

sub{
  bottom:-.25em;
}

sup{
  top:-.5em;
}
img{
  border-style:none;
}
button,input,optgroup,select,textarea{
  font-family:inherit;
  font-size:100%;
  line-height:1.15;
  margin:0;
}
button,input{
  overflow:visible;
}
button,select{
  text-transform:none;
}
[type=button],[type=reset],[type=submit],button{
  -webkit-appearance:button;
}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{
  border-style:none;
  padding:0;
}
[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{
  outline:1px dotted ButtonText;
}
fieldset{
  padding:.35em .75em .625em;
}
legend{
  box-sizing:border-box;
  color:inherit;
  display:table;
  max-width:100%;
  padding:0;
  white-space:normal;
}
progress{
  vertical-align:baseline;
}
textarea{
  overflow:auto;
}
[type=checkbox],[type=radio]{
  box-sizing:border-box;
  padding:0;
}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{
  height:auto;
}
[type=search]{
  -webkit-appearance:textfield;
  outline-offset:-2px;
}
[type=search]::-webkit-search-decoration{
  -webkit-appearance:none;
}
::-webkit-file-upload-button{
  -webkit-appearance:button;
  font:inherit;
}
details{
  display:block;
}
summary{
  display:list-item;
}
[hidden],template{
  display:none;
}

/*! 追加リセット */
html{
  box-sizing:border-box;
  overscroll-behavior:none;
}

*,:after,:before{
  box-sizing:inherit;
}

h1,h2,h3,h4,h5,h6{
  font-size:inherit;
  font-weight:inherit;
  margin:0;
}

dd,li,ol,ul{
  list-style:none;
  margin:0;
  padding:0;
}

dl,p{
  margin:0;
}

a{
  color:inherit;
  cursor:pointer;
  text-decoration:none;
}

strong{
  font-weight:inherit;
}

hr{
  margin:0;
}

hr,iframe{
  border:none;
}

button{
  background-color:transparent;
  border-width:0;
  color:inherit;
  cursor:pointer;
  font-weight:inherit;
  line-height:inherit;
  padding:0;
}

/*! ==================================================
 * レイヤー名: Foundation
 * 説明: 全体のベース設定
 * ================================================== */
html{
  font-size:62.5%;
}

body{
  word-wrap:break-word;
}

aside,body,footer,main{
  position:relative;
  z-index:1;
}

img,svg{
  height:auto;
  max-width:100%;
  vertical-align:middle;
}

/*! カスタムcss変数  */
:root{
  --c-icon-cart:#000;
  --easing-cart:all 0.3s ease-in-out;
  --c-button-cart:#000;
  --bc-button-cart:#05409a;
  --c-button-detail:#000;
  --bc-button-detail:#fff;
  --c-close:#fff;
  --bc-close:#eb0000;
  --c-disabled:#fff;
  --bc-disabled:#737373;
  --slick-icon-play:#000;
  --slick-icon-pause:#000;
  --select2-color:#000;
  --select2-background-color:#f7f7f7;
  --select2-border-color:#000;
  --select2-arrow-color:#000;
}

/*! ==================================================
 * レイヤー名: Component
 * 説明:
 * A-onSTORE在庫連携カート共通スタイル
 * （セレクトボタン・個別ボタン・まとめてボタン）
 * ================================================== */
/*! セレクトボタン ※全般 */

.add_check,.cartadd.cartadd--no-single .add_label[for^=checkbox_]{
  display:none;
}

/*! 在庫なし（非活性化）ボタン ※シンブルカートのみ　 */
.cart_btn{
  position:relative;
}

.cart_btn.cart_disabled,.cart_btn[disabled]{
  pointer-events:none;
}
.cart_btn.cart_disabled:after,.cart_btn[disabled]:after{
  align-items:center;
  background-color:var(--bc-disabled);
  color:var(--c-disabled);
  content:"購入できません";
  display:flex;
  height:100%;
  inset:0;
  justify-content:center;
  position:absolute;
  width:100%;
  z-index:1;
}

/*! まとめてカートボタンスタイル */
.button-all{
  align-items:center;
  background-color:var(--bc-button-cart);
  border:2px solid;
  color:var(--c-button-cart);
  display:flex;
  gap:.25em;
  justify-content:center;
  margin-left:auto;
  margin-right:auto;
  padding:1em;
  transition:var(--easing-cart);
  width:min(400px, 100%);
}

.button-all:before{
  background-color:var(--c-icon-cart);
  content:"";
  display:inline-block;
  height:1em;
  -webkit-mask-image:url(../img/cart.svg);
          mask-image:url(../img/cart.svg);
  -webkit-mask-position:center;
          mask-position:center;
  -webkit-mask-repeat:no-repeat;
          mask-repeat:no-repeat;
  vertical-align:middle;
  width:1em;
  z-index:1;
}

/*! シングルカートボタンスタイル */
.button-single{
  align-items:center;
  background-color:var(--bc-button-cart);
  color:var(--c-button-cart);
  display:flex;
  gap:.25em;
  justify-content:center;
  margin-left:auto;
  margin-right:auto;
  padding:1em;
  transition:var(--easing-cart);
  width:min(400px, 100%);
}

.button-single:before{
  background-color:var(--c-icon-cart);
  content:"";
  display:inline-block;
  height:1em;
  -webkit-mask-image:url(../img/cart.svg);
          mask-image:url(../img/cart.svg);
  -webkit-mask-position:center;
          mask-position:center;
  -webkit-mask-repeat:no-repeat;
          mask-repeat:no-repeat;
  vertical-align:middle;
  width:1em;
}

/*! 商品詳細ボタン */
.button-detail{
  align-items:center;
  background-color:var(--bc-button-detail);
  border:1px solid;
  color:var(--c-button-detail);
  display:flex;
  gap:.25em;
  justify-content:center;
  margin-left:auto;
  margin-right:auto;
  padding:1em;
  transition:var(--easing-cart);
  width:min(400px, 100%);
}

/*! 連続購入防止 */
.js-button.is-disabled{
  --c-icon-cart:var(--c-disabled);
  background-color:var(--bc-disabled);
  color:var(--c-disabled);
  opacity:.85;
  pointer-events:none;
}
.display_none{
  display:none;
}

.strikethrough{
  text-decoration:line-through;
}

.text-close{
  background-color:var(--bc-close);
  color:var(--c-close);
  padding:.25em;
  text-align:center;
}

/*! ==================================================
 * レイヤー名: Component
 * 説明:slick.jsスライダーの共通スタイル
 * ================================================== */
/*!  */
/*! ボタンフォーカス調整 */
.slick-active a{
  display:inline-block;
  outline-offset:-1px;
  position:relative;
  z-index:1;
}

/*! 自動再生ボタンアイコン */
.slick-autoplay-toggle-button{
  display:flex;
  height:min(1em, 20px);
  width:min(1em, 20px);
}

.slick-pause-icon,.slick-play-icon{
  height:100%;
  inset:0;
  -webkit-mask-position:center;
          mask-position:center;
  -webkit-mask-repeat:no-repeat;
          mask-repeat:no-repeat;
  position:absolute;
  width:100%;
}

.slick-pause-icon{
  background-color:var(--slick-icon-pause);
  -webkit-mask-image:url(../img/pause.svg);
          mask-image:url(../img/pause.svg);
}

.slick-play-icon{
  background-color:var(--slick-icon-play);
  -webkit-mask-image:url(../img/play.svg);
          mask-image:url(../img/play.svg);
}

/*! 自動再生ボタン配置 */
.slick-autoplay-toggle-button{
  position:relative;
  z-index:1;
}

/*! ドットイージケーター */
.slick-dots{
  line-height:1;
  text-align:center;
}
.slick-dots li{
  display:inline-block;
  margin:min(5px, .5vw);
}
.slick-dots li:only-child{
  display:none;
}
.slick-dots .slick-sr-only{
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  width:1px;
  clip:rect(0, 0, 0, 0);
  border:0;
  white-space:nowrap;
}

.slick-dots button{
  display:block;
  height:1rem;
  pointer-events:all;
  position:relative;
  width:1rem;
}

.slick-dots button .slick-dot-icon{
  background-color:var(--slick-dot-color);
  border-radius:50%;
  display:block;
  height:100%;
  inset:0;
  position:absolute;
  width:100%;
}

.slick-dots .slick-active button .slick-dot-icon{
  background-color:var(--slick-dot-color-active);
}

/*! スクリーンリーダー用 */
.slick-sr-only{
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  width:1px;
  clip:rect(0, 0, 0, 0);
  border:0;
  white-space:nowrap;
}

/*! 商品スライドスタイル専用 */
.js-slick-product-slide .slick-slide img{
  width:100%;
}

.js-slick-product-slide .slick-autoplay-toggle-button{
  inset:min(8px, .8vw);
  position:absolute;
}

/*! ==================================================
 * レイヤー名: Component
 * 説明:select2.jsのプルダウンボタン共通スタイル
 * ================================================== */
/*! セレクトボックス */
.select2-container--default .select2-selection--single .select2-selection__rendered{
  color:var(--select2-color);
}

.select2-container{
  display:block;
  max-width:100%;
}

.select2-selection{
  background-color:var(--select2-background-color) !important;
  border-radius:inherit !important;
  height:auto !important;
}

.select2-selection__rendered{
  padding-bottom:.5em;
  padding-top:.5em;
  text-align:center;
}

.select2-container--default .select2-selection--single{
  border:1px solid var(--select2-border-color);
}

/*! 矢印 */
.select2-selection__arrow{
  height:100% !important;
  top:0 !important;
  width:2em !important;
}

.select2-selection__arrow b{
  bottom:0;
  left:0 !important;
  margin:auto !important;
  right:0;
  top:0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b{
  border-color:var(--select2-arrow-color) transparent transparent transparent !important;
  border-width:.5em .4em 0 !important;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{
  border-color:transparent transparent var(--select2-arrow-color) transparent !important;
  border-width:0 .4em .5em !important;
}

/*! プルダウンカラー */
.select2-results{
  color:var(--select2-color);
}