@import url(icon.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@900&display=swap');

.jtb-nav-breadcrumb { margin-bottom: 25px; max-width: 1236px; }
.l-page { font-size: 16px; line-height: 1.6; text-align: center; }
.l-page * { -ms-box-sizing: border-box; box-sizing: border-box; }
.l-page h1 { font-size: 18px; font-weight: bold; line-height: 1; margin: 0 auto 25px; max-width: 1236px; text-align: left; }
.l-page a, .l-page a img { transition: all .3s ease; transform: rotate(0.0001deg); }
.l-page em, .l-page .font-noto { font-family: 'Noto Sans JP', sans-serif; }
.l-page img, .l-page svg { display: block; margin: 0 auto; max-width: 100%; }
.l-page .btn { align-items: center; border-radius: .75em; color: #000; display: flex; margin: 0 auto; position: relative; width: 90%; }
.l-page .btn::after { content: "\f006"; display: inline-block; font-family: "icon"; font-size: 2.5em; position: absolute; right: 3%; top: 50%; transform: translateY(-50%); }
.l-page .btn:hover { box-shadow: none; transform: translateY(.5em); }
.l-content { margin: 0 auto; max-width: 1236px; width: 100%; }
.l-section + .l-section { margin-top: 2.5em; }
.js-btn-page-top { bottom: 50px; cursor: pointer; display: none; position: fixed; right: 50px; z-index: 100; }
.js-btn-page-top a { display: block; height: 17px; position: relative; width: 35px; }
.js-btn-page-top a::before { color: #000; content: "\e802"; display: inline-block; font-family: "icon"; font-size: 17px; height: 17px; width: 35px; }
.js-btn-page-top a:hover { opacity: .8; }

.l-box { background-color: #fff; border-radius: .5em; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .2)); }
.l-mv { border-top: .5em solid #c81428; padding: 3em; }
.l-catch__wrap { align-items: flex-end; background-color: #c81528; background-image: linear-gradient(-45deg, #cd1e34 25%, transparent 25%, transparent 50%, #cd1e34 50%, #cd1e34 75%, transparent 75%, transparent); background-size: 12px 12px; color: #fff; display: flex; justify-content: center; padding: 1.5em 0; }
.l-catch__head { padding-right: 2.4%; width: 36%; }
.l-catch__head img { margin: 0; }
.l-catch__bottom { align-items: center; display: flex; line-height: 1.4; text-align: left; }
.l-catch__bottom .txt-column { border: 2px solid #fff; border-radius: 6px; font-size: 1.125em; padding: .5em 1em; white-space: nowrap; }
.l-catch__bottom .txt-main { font-size: 2em; padding-left: 4%; white-space: nowrap; }
.l-catch__cap { font-size: .8125em; margin-top: .6em; }
.l-coupon__list { display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; }
.l-coupon__item { overflow: hidden; width: calc(50% - 6px); }
.l-coupon__item:nth-child(n+3) { margin-top: 1.25em; }
.l-coupon__item.l-box { background-color: transparent; }
.l-coupon__item .bar, .l-coupon__item .bar::before, .l-coupon__item .bar::after { background-color: #ccc;background-size: 12px 12px; display: block; height: .5em; position: absolute; top: 0; width: calc(100% / 6); }
.l-coupon__item .bar::before, .l-coupon__item .bar::after { content: ""; width: 100%; }
.l-coupon__item .bar::before { left: -100%; }
.l-coupon__item .bar::after { right: -100%; }
.l-coupon__item .bar:first-of-type { background-color: #e61673; background-image: linear-gradient(-45deg, #e81f7e 25%, transparent 25%, transparent 50%, #e81f7e 50%, #e81f7e 75%, transparent 75%, transparent); left: calc(100% / 6); }
.l-coupon__item .bar:first-of-type::before { background-color: #2ea7e0; background-image: linear-gradient(-45deg, #3aafe3 25%, transparent 25%, transparent 50%, #3aafe3 50%, #3aafe3 75%, transparent 75%, transparent); }
.l-coupon__item .bar:first-of-type::after { background-color: #22ac38; background-image: linear-gradient(-45deg, #2db345 25%, transparent 25%, transparent 50%, #2db345 50%, #2db345 75%, transparent 75%, transparent); }
.l-coupon__item .bar:nth-of-type(2) { background-color: #920783; background-image: linear-gradient(-45deg, #9b0b8d 25%, transparent 25%, transparent 50%, #9b0b8d 50%, #9b0b8d 75%, transparent 75%, transparent); left: calc(100% / 3 *2); }
.l-coupon__item .bar:nth-of-type(2)::before { background-color: #c81528; background-image: linear-gradient(-45deg, #cd1e34 25%, transparent 25%, transparent 50%, #cd1e34 50%, #cd1e34 75%, transparent 75%, transparent); }
.l-coupon__item .bar:nth-of-type(2)::after { background-color: #f39700; background-image: linear-gradient(-45deg, #f4a000 25%, transparent 25%, transparent 50%, #f4a000 50%, #f4a000 75%, transparent 75%, transparent); }
.coupon-head { background-color: #fff; border-radius: .5em .5em 0 0; overflow: hidden; padding: 3em 2em 1em; position: relative; }
.coupon-head__txt { font-size: 1.5em; }
.coupon-head__txt span { font-size: 1.25em; }
.coupon-head__price { color: #c81528; font-size: 3.75em; line-height: 1; }
.coupon-head__price .coupon-price { font-size: 1.5em; }
.coupon-bottom { background-color: #fff; border-radius: 0 0 .5em .5em; padding: .5em 2em 2em; }
.coupon-data { background-color: #d8d8d8; display: flex; justify-content: space-between; padding: 1px; }
.coupon-data__item { width: 50%; }
.coupon-data__item:first-of-type { border-right: 1px solid #d8d8d8; color: #2ea7e0; }
.coupon-data__item:nth-of-type(2) { color: #22ac38; }
.coupon-data__name { background-color: #ebebeb; line-height: 2.5; }
.coupon-data__value { background-color: #fff; font-size: 1.5em; line-height: 2; }
.coupon-term { background-color: #d8d8d8; display: flex; flex-wrap: wrap; justify-content: space-between; line-height: 2.75; margin-top: 1.25em; padding: 1px; }
.coupon-term__name { background-color: #ebebeb; width: calc(29% - 1px) }
.coupon-term__value { background-color: #fff; width: 71%; }
.coupon-term__name:first-of-type, .coupon-term__value:first-of-type { margin-bottom: 1px; }
.coupon-term__name:first-of-type { color: #920783; }
.coupon-term__name:nth-of-type(2) { color: #e61673; }
.l-coupon__item.finish { position: relative; }
.l-coupon__item.finish .coupon-head, .l-coupon__item.finish .coupon-middle, .l-coupon__item.finish .coupon-bottom { opacity: .5; user-select: none; }
.l-coupon__item.finish::after { background-color: rgba(0,0,0,.75); border-radius: .125em; color: #fff; content: "配布終了"; display: block; font-family: 'Noto Sans JP', sans-serif; font-size: 3em; left: 50%; line-height: 1; padding: .5em 2em; position: absolute; top: 50%; transform: translate(-50%, -50%) rotate(-10deg); white-space: nowrap; z-index: 2; }
.l-link { padding-bottom: .5em; }
.l-link .btn { background-color: #f3bd00; box-shadow: 0 .5em #9f7025; padding: 1em; }
.l-link .btn br { display: none; }
.l-link .btn::after { color: #c81528; }
.l-link .btn img { margin: 0; width: 17.8%; }
.l-link .btn p { font-size: 2.25em; padding-left: 3%; }
.l-link .btn p span { display: block; font-size: .6667em; }
.l-link .btn:hover { background-color: #fece24; }
.l-guideline { padding: 4em 5em; }
.l-guideline__title { color: #c81528; font-size: 2.75em; line-height: 1; margin-bottom: 1em; }
.l-guideline__list { text-align: left; }
.l-guideline__item { clear: left; color: #c81528; float: left; font-weight: bold; padding: 1em 0; width: 20%; }
.l-guideline__txt { font-size: .875em; line-height: 1.8; padding: 1em 1em 1em 22%; }
.l-guideline__txt li { display: list-item; list-style: disc; list-style-position: outside; margin-left: 1em; }
.l-guideline__txt li + li { padding-top: .5em; }
.l-more .btn { background-color: #c81528; box-shadow: 0 .5em #a52936; color: #fff; line-height: 3; text-align: center; }
.l-more .btn::after { color: #ffde00; }
.l-more .btn em {  font-size: 2.25em; margin: 0 auto; }
.l-more .btn:hover { background-color: #ec1f35; }
.l-more p + p { margin-top: 2em; }
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, .l-box { box-shadow: 0 1px 5px rgba(0,0,0,.3); }
}

@media screen and (min-width:601px) and ( max-width:1236px) {
	.l-page { font-size: 1.294498vw; margin: 0 3%; }
	_:-ms-fullscreen, :root .l-page .btn::after { font-size: 1.5em; }
}
@media screen and (max-width:768px){
	.l-catch__wrap { display: block; }
	.l-catch__head { margin: 0 auto 1em; padding-right: 0; width: 50%; }
	.l-catch__bottom { justify-content: center; }
	.l-catch__cap { text-align: left; }
}
@media screen and (max-width:600px){
	.jtb-nav-breadcrumb { display: none; }
	.js-btn-page-top { bottom: 20px; right: 20px; }
	.js-btn-page-top a { background-color: #999; border-radius: 6px; display: block; height: 30px; width: 30px; }
	.js-btn-page-top a::before { color: #fff; content: "\f106"; display: inline-block; font-family: "icon"; line-height: 29px; width: auto; }
	.l-page { font-size: 3.2vw; padding: 20px 3% 0; }
	.l-page h1 { margin-bottom: 20px; }
	.l-page .btn { width: 100%; }
	.l-page .btn::after { font-size: 1.6em; }
	.l-mv { padding: 1em 1em; }
	.l-section + .l-section { margin-top: 1em; }
	.l-catch__bottom { display: block; padding: 0 6%; text-align: center; }
	.l-catch__bottom .txt-main { font-size: 1.5em; padding-left: 0; }
	.l-catch__bottom .txt-column br { display: none; }
	.l-coupon__list { display: block; }
	.l-coupon__item { width: 100%; }
	.l-coupon__item:nth-child(n+3) { margin-top: 0; }
	.l-coupon__item + .l-coupon__item { margin-top: 1.25em; }
	.coupon-head { padding: 2em 2em 1em; }
	.coupon-head__price { font-size: 3.333333em; }
	.coupon-term, .coupon-term__name, .coupon-term__value { display: block; line-height: 2.333333; }
	.coupon-term__name, .coupon-term__value { width: 100%; }
	.coupon-term__name { margin-bottom: 1px; }
	.l-link .btn { box-shadow: 0 .3em #9f7025; }
	.l-link .btn img { width: 22%; }
	.l-link .btn p { font-size: 1.333333em; line-height: 1.3; text-align: left; }
	.l-link .btn br { display: block; }
	.l-guideline { padding: 2em; }
	.l-guideline__title { font-size: 2em; }
	.l-guideline__item { display: block; float: none; padding: 0; width: 100%; }
	.l-guideline__txt { font-size: 1em; padding: .3em 0 1em; }
	.l-more .btn { box-shadow: 0 .3em #a52936; line-height: 1; padding: 1.6em 0; }
	.l-more .btn em { font-size: 1.5em; }
	.l-more p + p { margin-top: 1em; }
}