@charset "UTF-8";

/* ----------------------------------
 Reset
---------------------------------- */
/*
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {*/
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, img, ins, kbd, q, samp, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size: 100%;
  vertical-align:baseline;
  background:transparent;
}
body {
  line-height:1;
  -webkit-text-size-adjust: none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
  display:block;
}
ul {
  list-style:none;
}
blockquote, q {
  quotes:none;
}
blockquote:before, blockquote:after,q:before, q:after {
  content:'';
  content:none;
}
a {
  margin:0;
  padding:0;
  vertical-align:baseline;
  background:transparent;
}
/* change colours to suit your needs */
ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}
/* change colours to suit your needs */
mark {
  background-color:#ff9;
  color:#000;
  font-style:italic;
  font-weight:bold;
}
del {
  text-decoration: line-through;
}
abbr[title], dfn[title] {
  border-bottom:1px dotted inherit;
  cursor:help;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
/* change border colour to suit your needs */
hr {
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0;
}
input, select {
  vertical-align:middle;
  margin:0px;
}

input, select, button {
  color: #000;
}

/* ----------------------------------
 Base
---------------------------------- */
body {
	margin: 0;
	padding: 0;
	border: none;
  min-width: 100vw;
	max-width: 100%;
  font-size: 14px;
	font-family: 'IBM Plex Sans JP', "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.5;
	color: #15181C;
	overflow-x: hidden;
}

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

a { text-decoration: none; color: #15181C;}
a:hover,
a:focus { text-decoration: underline;}
a:focus-visible { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px;}

img { max-width: 100%; height: auto; vertical-align: bottom;}
address { font-style: normal;}

h1, .h1,
h1[class$="--header"] { padding: 0; margin: 20px 0 15px; border: none; font-size: 22px; font-weight: 600; text-align: center; background: none; color: #0047BA;}
h2, .h2 { padding: 0; margin: 0 0 15px; border: none; font-size: 20px; font-weight: 600; background: none;}
h3, .h3 { padding: 0; margin: 0 0 10px; border: none; font-size: 18px; font-weight: 600; background: none;}
h4, .h4 { padding: 0; margin: 0 0 10px; border: none; font-size: 16px; font-weight: 600; background: none;}
h5, .h5 { padding: 0; margin: 0 0 10px; border: none; font-size: 14px; font-weight: 600; background: none;}
h6, .h6 { padding: 0; margin: 0 0 10px; border: none; font-size: 14px; font-weight: 600; background: none;}

.img-center { display: flex; justify-content: center; align-items: center;}
.img-center img { font-size: 8px;}
.legend { width: 100%; padding: 5px 10px; margin: 10px 0; border-bottom: #0047BA 2px solid; font-size: 16px; font-weight: 600; color: #0047BA;}
  
/* ----------------------------------
 Design
---------------------------------- */
.font-Roc { font-family: "roc-grotesk", sans-serif; font-weight: 800; font-style: normal;}

.design-headerline { margin: 0 0 15px 0; text-align: center; line-height: 1.0; display: flex; align-items: flex-end;}
.design-headerline h2 { padding: 0; margin: 0 2vw 0 0; border: none; text-align: center; font-size: 7vw; font-weight: 600; line-height: 1.0; color: #0047BA;}
.design-headerline .sub { font-size: 3.2vw; font-weight: 600; text-align: center; line-height: 1.0; position: relative; top: -2vw;}

.link-more         { width: 300px; margin: 20px auto 0;}
.link-more a       { width: 100%; height: 45px; border: #0047BA 2px solid; border-radius: 45px; font-size: 14px; font-weight: 600; text-decoration: none; line-height: 1.0; color: #0047BA; display: flex; justify-content: center; align-items: center; background: #fff; transition: 0.3s;}
.link-more a:hover { background: #0047BA; color: #fff; box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.3);}

/* ----------------------------------
 Form Parts
---------------------------------- */
/* input */
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="search"],
input[type="password"],
input[type="url"],
input[type="number"],
textarea { -webkit-appearance: none; -moz-appearance: none; min-height: 42px; padding: 4px 10px; border: #E9EEF0 1px solid; background-color: #fff;}
select   { -webkit-appearance: none; -moz-appearance: none; height: 42px; padding: 4px; border: #E9EEF0 1px solid; background-color: #fff; line-height: 34px;}
input[type="number"] { min-width: 50px; min-height: 42px; padding: 4px; border: #E9EEF0 1px solid; background-color: #fff; box-sizing: border-box;}

/* radio */
input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; width: 20px; height: 20px; margin-bottom: 3px; margin-right: 5px; border: #E9EEF0 1px solid; border-radius: 10px; background: #fff; position: relative; outline: 0; transition: 0.3s;}
input[type="radio"]:before { transition: 0.3s;}
input[type="radio"]:checked { border: #1846BA 1px solid;}
input[type="radio"]:checked:before { content: ""; width: 10px; height: 10px; margin: 0; border: #1846BA 1px solid; border-radius: 10px; position: absolute; left: calc(50% - 6px); top: calc(50% - 6px); display: block; background: #1846BA;}
input[type="radio"]:checked + label { color: #1846BA; font-weight: 700;}

/* checkbox */
input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; width: 20px; height: 20px; margin-bottom: 3px; margin-right: 5px; border: #E9EEF0 1px solid; background: #fff; position: relative; outline: 0; transition: 0.3s;}
input[type="checkbox"]:before { transition: 0.3s;}
input[type="checkbox"]:checked { border: #1846BA 1px solid; background: #1846BA;}
input[type="checkbox"]:checked:before { content: ""; width: 10px; height: 6px; margin: 0; border-right: 2px solid #fff; border-top: 2px solid #fff; transform: rotate(135deg); position: absolute; left: calc(50% - 5px); top: calc(50% - 5px); display: block;}
input[type="checkbox"]:checked + label { font-weight: 700;}

/* ----------------------------------
 Icon
---------------------------------- */
div.block-icon { display: flex; flex-wrap: wrap;}
div.block-icon .text-icon { padding: 1px 4px 0; margin: 0 4px 4px 0; height: 15px; border: #0047BA 1px solid; border-radius: 3px; font-size: 9px; font-weight: 400; color: #0047BA; display: flex; justify-content: center; align-items: center;}
div.block-icon .image-icon { max-height: 15px; margin: 0 4px 4px 0; display: flex; justify-content: center; align-items: center;}
div.block-icon .image-icon img { width: auto; height: 15px; vertical-align: top;}
div.block-icon .block-icon--auto-soldout   { border-color: #9DA3A6; color: #9DA3A6;}
div.block-icon .block-icon--auto-on-sales  { border-color: #FF0000; color: #FF0000;}
div.block-icon .block-icon--auto-new       { border-color: #0047BA; color: #0047BA;}
div.block-icon .icon-name-new              { border-color: #0047BA; color: #0047BA;}
div.block-icon .icon-name-sale             { border-color: #FF0000; color: #FF0000;}
div.block-icon .icon-name-importan         { border-color: #000000; color: #000000;}
div.block-icon .icon-name-presale          { border-color: #FF0091; color: #FF0091;}
div.block-icon .icon-name-prerese          { border-color: #6A0DA1; color: #6A0DA1;}
div.block-icon .icon-name-arrival          { border-color: #FF8000; color: #FF8000;}

div.block-icon *[class*="_icon_important"] { border-color: #000000; color: #000000;}
div.block-icon *[class*="_icon_sale"]      { border-color: #FF0000; color: #FF0000;}
div.block-icon *[class*="_icon_presale"]   { border-color: #FF0091; color: #FF0091;}
div.block-icon *[class*="_icon_prereserve"]{ border-color: #6A0DA1; color: #6A0DA1;}
div.block-icon *[class*="_icon_rearrival"] { border-color: #FF8000; color: #FF8000;}

div.block-icon .image-icon.block-icon--receipt_store_src { padding: 1px 4px 0; margin: 0 4px 4px 0; height: 15px; border: #0047BA 1px solid; border-radius: 3px; font-size: 9px; font-weight: 400; color: #0047BA; display: flex; justify-content: center; align-items: center;}
div.block-icon .image-icon.block-icon--receipt_store_src::before { content: "店舗受取"; font-size: 9px; font-weight: 400; color: #0047BA; display: inline;}
div.block-icon .image-icon.block-icon--receipt_store_src img { display: none !important;}