@charset "UTF-8";
:root {
/* SVG */
--icon-cart: url('data:image/svg+xml;utf8,');
--icon-receipt: url('data:image/svg+xml;utf8,');
--icon-phone-touch: url('data:image/svg+xml;utf8,');
--icon-phone-complete: url('data:image/svg+xml;utf8,');
}
/* Type: YakuHanJP_Noto - Based on Noto Sans CJK JP */
@font-face {
font-family: "YakuHanJP_Noto";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/YakuHanJP/YakuHanJP-Regular.woff2") format("woff2"), url("../fonts/YakuHanJP/YakuHanJP-Regular.woff") format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP_Noto";
font-style: normal;
font-weight: 500;
font-display: swap;
src: url("../fonts/YakuHanJP/YakuHanJP-Medium.woff2") format("woff2"), url("../fonts/YakuHanJP/YakuHanJP-Medium.woff") format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP_Noto";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url("../fonts/YakuHanJP/YakuHanJP-Bold.woff2") format("woff2"), url("../fonts/YakuHanJP/YakuHanJP-Bold.woff") format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "icomoon";
src: url("../fonts/icons/icomoon.ttf?ue1mqn") format("truetype"), url("../fonts/icons/icomoon.woff?ue1mqn") format("woff"), url("../fonts/icons/icomoon.svg?ue1mqn#icomoon") format("svg");
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^=icon-], [class*=" icon-"] {
font-family: "icomoon" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-search02:before {
content: "\e906";
}
.icon-stairs:before {
content: "\e907";
}
.icon-arrow-bottom:before {
content: "\e900";
}
.icon-arrow-right:before {
content: "\e901";
}
.icon-note:before {
content: "\e902";
}
.icon-pen:before {
content: "\e903";
}
.icon-search:before {
content: "\e904";
}
.icon-time:before {
content: "\e905";
}
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, dialog, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-o-text-size-adjust: 100%;
text-size-adjust: 100%;
}
section, article, aside, main, dialog, figure, footer, header, hgroup, nav, section {
display: block;
}
address {
font-style: normal;
}
ul, ol {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
ins {
background-color: #ff9;
color: #000;
text-decoration: none;
}
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 #000;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #cccccc;
margin: 1em 0;
padding: 0;
}
input,
button,
select,
option,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
border: none;
border-radius: 0;
font: inherit;
outline: none;
}
input,
select {
vertical-align: middle;
}
select::-ms-expand {
display: none;
}
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
}
input[type=text],
input[type=tel],
input[type=email],
input[type=radio],
input[type=submit],
button,
textarea,
select {
font-family: inherit;
margin: 0;
padding: 0;
background: none;
border: none;
-webkit-border-radius: 0;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
button {
cursor: pointer;
}
* {
-webkit-appearance: none;
}
*:after,
*:before {
font-family: inherit;
color: inherit;
}
*,
*:after,
*:before {
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
outline: none;
}
a, area, button, [role=button], input:not([type=range]),
label, select, summary, textarea {
-ms-touch-action: manipulation;
touch-action: manipulation;
}
:root {
-ms-overflow-style: -ms-autohiding-scrollbar;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%;
cursor: default;
text-rendering: optimizeLegibility;
}
html {
font-size: 14px;
font-weight: 500;
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
}
html.is-locked {
overflow: hidden;
}
@media screen and (max-width: 991px) {
html.is-locked {
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
}
}
body {
color: #333;
font-family: "YakuHanJP_Noto", "M PLUS 2", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
letter-spacing: 0.04em;
font-feature-settings: "palt";
word-break: break-word;
line-break: strict;
overflow-wrap: break-word;
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto;
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
background-color: #fff;
}
a {
color: #333;
text-decoration: none;
}
a[href^="tel:"] {
pointer-events: all;
}
@media screen and (min-width: 992px) {
a[href^="tel:"] {
pointer-events: none;
}
}
span {
font-weight: inherit;
line-height: inherit;
letter-spacing: inherit;
}
img, svg {
width: auto;
max-width: 100%;
vertical-align: bottom;
}
img {
height: auto;
}
picture {
display: block;
}
strong,
em {
font-weight: 700;
}
pre {
white-space: pre-wrap;
}
table {
max-width: 100%;
width: 100%;
}
table th,
table td {
word-break: break-all;
}
sup {
font-size: 0.75em;
vertical-align: super;
}
sub {
font-size: 0.75em;
vertical-align: sub;
}
.u-font-en {
font-family: "Rubik", sans-serif !important;
}
.u-visible-sp {
display: none !important;
}
@media screen and (max-width: 991px) {
.u-visible-sp {
display: block !important;
}
}
@media screen and (max-width: 991px) {
.u-hidden-sp {
display: none !important;
}
}
.u-hidden-txt {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
visibility: hidden;
opacity: 0;
pointer-events: none;
}
.u-icon {
display: inline-block;
flex: 0 0 auto;
width: 1em;
height: 1em;
color: currentColor;
vertical-align: middle;
background-color: currentColor;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-size: contain;
mask-size: contain;
}
.u-icon--cart {
-webkit-mask-image: var(--icon-cart);
mask-image: var(--icon-cart);
}
.u-icon--phone-complete {
-webkit-mask-image: var(--icon-phone-complete);
mask-image: var(--icon-phone-complete);
}
.u-icon--phone-touch {
-webkit-mask-image: var(--icon-phone-touch);
mask-image: var(--icon-phone-touch);
}
.js-fadein-up {
opacity: 0;
transform: translate(0, 10px);
}
body.is-loaded .js-fadein-up.is-scrollin {
animation: fadein-up 1.5s forwards;
}
@keyframes fadein-up {
25% {
opacity: 0;
transform: translate(0, 10px);
}
100% {
opacity: 1;
transform: translate(0, 0);
}
}
/* Slider */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
display: none;
}
[dir=rtl] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
/*
* Remodal - v1.1.1
* Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
* http://vodkabears.github.io/remodal/
*
* Made by Ilya Makarov
* Under MIT License
*/
/* ==========================================================================
Remodal's necessary styles
========================================================================== */
/* Hide scroll bar */
html.remodal-is-locked {
overflow: hidden;
-ms-touch-action: none;
touch-action: none;
}
/* Anti FOUC */
.remodal,
[data-remodal-id] {
display: none;
}
/* Necessary styles of the overlay */
.remodal-overlay {
position: fixed;
z-index: 9999;
top: -5000px;
right: -5000px;
bottom: -5000px;
left: -5000px;
display: none;
}
/* Necessary styles of the wrapper */
.remodal-wrapper {
position: fixed;
z-index: 10000;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: none;
overflow: auto;
text-align: center;
-webkit-overflow-scrolling: touch;
}
.remodal-wrapper:after {
display: inline-block;
height: 100%;
margin-left: -0.05em;
content: "";
}
/* Fix iPad, iPhone glitches */
.remodal-overlay,
.remodal-wrapper {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
/* Necessary styles of the modal dialog */
.remodal {
position: relative;
outline: none;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%;
}
.remodal-is-initialized {
/* Disable Anti-FOUC */
display: inline-block;
}
/*
* Remodal - v1.1.1
* Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
* http://vodkabears.github.io/remodal/
*
* Made by Ilya Makarov
* Under MIT License
*/
/* ==========================================================================
Remodal's default mobile first theme
========================================================================== */
/* Default theme styles for the background */
.remodal-bg.remodal-is-opening,
.remodal-bg.remodal-is-opened {
-webkit-filter: blur(3px);
filter: blur(3px);
}
/* Default theme styles of the overlay */
.remodal-overlay {
background: rgba(43, 46, 56, 0.9);
}
.remodal-overlay.remodal-is-opening,
.remodal-overlay.remodal-is-closing {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.remodal-overlay.remodal-is-opening {
-webkit-animation-name: remodal-overlay-opening-keyframes;
animation-name: remodal-overlay-opening-keyframes;
}
.remodal-overlay.remodal-is-closing {
-webkit-animation-name: remodal-overlay-closing-keyframes;
animation-name: remodal-overlay-closing-keyframes;
}
/* Default theme styles of the wrapper */
.remodal-wrapper {
padding: 10px 10px 0;
}
/* Default theme styles of the modal dialog */
.remodal {
box-sizing: border-box;
width: 100%;
margin-bottom: 10px;
padding: 35px;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
color: #2b2e38;
background: #fff;
}
.remodal.remodal-is-opening,
.remodal.remodal-is-closing {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.remodal.remodal-is-opening {
-webkit-animation-name: remodal-opening-keyframes;
animation-name: remodal-opening-keyframes;
}
.remodal.remodal-is-closing {
-webkit-animation-name: remodal-closing-keyframes;
animation-name: remodal-closing-keyframes;
}
/* Vertical align of the modal dialog */
.remodal,
.remodal-wrapper:after {
vertical-align: middle;
}
/* Close button */
.remodal-close {
position: absolute;
top: 0;
left: 0;
display: block;
overflow: visible;
width: 35px;
height: 35px;
margin: 0;
padding: 0;
cursor: pointer;
-webkit-transition: color 0.2s;
transition: color 0.2s;
text-decoration: none;
color: #95979c;
border: 0;
outline: 0;
background: transparent;
}
.remodal-close:hover,
.remodal-close:focus {
color: #2b2e38;
}
.remodal-close:before {
font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important;
font-size: 25px;
line-height: 35px;
position: absolute;
top: 0;
left: 0;
display: block;
width: 35px;
content: "×";
text-align: center;
}
/* Dialog buttons */
.remodal-confirm,
.remodal-cancel {
font: inherit;
display: inline-block;
overflow: visible;
min-width: 110px;
margin: 0;
padding: 12px 0;
cursor: pointer;
-webkit-transition: background 0.2s;
transition: background 0.2s;
text-align: center;
vertical-align: middle;
text-decoration: none;
border: 0;
outline: 0;
}
.remodal-confirm {
color: #fff;
background: #81c784;
}
.remodal-confirm:hover,
.remodal-confirm:focus {
background: #66bb6a;
}
.remodal-cancel {
color: #fff;
background: #e57373;
}
.remodal-cancel:hover,
.remodal-cancel:focus {
background: #ef5350;
}
/* Remove inner padding and border in Firefox 4+ for the button tag. */
.remodal-confirm::-moz-focus-inner,
.remodal-cancel::-moz-focus-inner,
.remodal-close::-moz-focus-inner {
padding: 0;
border: 0;
}
/* Keyframes
========================================================================== */
@-webkit-keyframes remodal-opening-keyframes {
from {
-webkit-transform: scale(1.05);
transform: scale(1.05);
opacity: 0;
}
to {
-webkit-transform: none;
transform: none;
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
}
@keyframes remodal-opening-keyframes {
from {
-webkit-transform: scale(1.05);
transform: scale(1.05);
opacity: 0;
}
to {
-webkit-transform: none;
transform: none;
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
}
@-webkit-keyframes remodal-closing-keyframes {
from {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
to {
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0;
-webkit-filter: blur(0);
filter: blur(0);
}
}
@keyframes remodal-closing-keyframes {
from {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
to {
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0;
-webkit-filter: blur(0);
filter: blur(0);
}
}
@-webkit-keyframes remodal-overlay-opening-keyframes {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes remodal-overlay-opening-keyframes {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes remodal-overlay-closing-keyframes {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes remodal-overlay-closing-keyframes {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
/* Media queries
========================================================================== */
@media only screen and (min-width: 641px) {
.remodal {
max-width: 700px;
}
}
/* IE8
========================================================================== */
.lt-ie9 .remodal-overlay {
background: #2b2e38;
}
.lt-ie9 .remodal {
width: 700px;
}
.l-wrapper {
overflow: hidden;
}
.l-container {
width: 100%;
margin: 0 auto;
padding: 0 calc(20 / var(--cw-base, 500) * 100cqw);
}
.l-inner {
position: relative;
}
.l-content {
--cw-base: 375;
width: 100%;
margin: auto;
max-width: 100%;
min-height: 100vh;
z-index: 200;
container-type: inline-size;
}
@media screen and (min-width: 992px) {
.l-content {
--cw-base: 500;
width: 500px;
max-width: 500px;
}
}
.l-header {
z-index: 999;
}
@media screen and (min-width: 992px) {
.l-header {
width: calc((100vw - 500px) / 2);
height: 100%;
top: 0;
right: 0;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
}
}
@media screen and (max-width: 991px) {
.l-header {
width: 100%;
position: fixed;
top: 0;
left: 0;
height: 0;
}
}
@media screen and (min-width: 992px) {
.l-header__inner {
width: 100%;
height: 100%;
}
}
@media screen and (min-width: 992px) {
.l-header__logo {
display: none;
}
}
@media screen and (max-width: 991px) {
.l-header__logo {
display: inline-block;
}
.l-header__logo img {
margin: 0 auto;
aspect-ratio: 545/481;
width: calc(150 / var(--cw-base, 500) * 100cqw);
height: auto;
}
}
@media screen and (min-width: 992px) {
.l-header__nav {
height: 100%;
padding: min(35px, 2.5vw) min(25px, 1.7857142857vw);
display: grid;
grid-auto-columns: 1fr;
grid-template-columns: 1fr;
grid-template-rows: 1fr auto;
gap: 0px 0px;
grid-template-areas: "top" "bottom";
overflow-y: auto;
}
}
@media screen and (max-width: 991px) {
.l-header__nav {
position: fixed;
inset: 0;
padding: calc(env(safe-area-inset-top) + 30 / var(--cw-base, 500) * 100cqw) calc(20 / var(--cw-base, 500) * 100cqw) calc(env(safe-area-inset-bottom) + 30 / var(--cw-base, 500) * 100cqw);
height: 100dvh;
min-height: 100svh;
display: none;
background: #efffc1;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
}
@media screen and (min-width: 992px) {
.l-header__nav__top {
grid-area: top;
align-self: center;
}
}
@media screen and (max-width: 991px) {
.l-header__nav__top {
text-align: center;
}
}
.l-header__nav__content {
text-align: center;
}
.l-header__nav__main {
text-align-last: left;
}
@media screen and (min-width: 992px) {
.l-header__nav__main {
display: inline-flex;
flex-direction: column;
}
}
@media screen and (max-width: 991px) {
.l-header__nav__main {
margin-top: calc(30 / var(--cw-base, 500) * 100cqw);
}
}
@media screen and (min-width: 992px) {
.l-header__nav__main__item:not(:first-child) {
margin-top: min(16px, 1.1428571429vw);
}
}
@media screen and (max-width: 991px) {
.l-header__nav__main__item {
border-bottom: 1px solid #e91c25;
}
.l-header__nav__main__item:first-child {
border-top: 1px solid #e91c25;
}
}
.l-header__nav__main__link {
font-size: min(18px, 1.2857142857vw);
color: #e91c25;
padding: min(5px, 0.3571428571vw) min(5px, 0.3571428571vw) min(5px, 0.3571428571vw) 0.8em;
position: relative;
display: inline-block;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 991px) {
.l-header__nav__main__link {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
padding: calc(15 / var(--cw-base, 500) * 100cqw) calc(15 / var(--cw-base, 500) * 100cqw) calc(15 / var(--cw-base, 500) * 100cqw) 1.2em;
display: block;
}
}
.l-header__nav__main__link::before {
content: "";
background: #e91c25;
border-radius: 100%;
width: min(5px, 0.3571428571vw);
aspect-ratio: 1/1;
display: block;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-30%);
}
@media screen and (max-width: 991px) {
.l-header__nav__main__link::before {
width: calc(5 / var(--cw-base, 500) * 100cqw);
left: 0.5em;
}
}
@media screen and (min-width: 992px) {
.l-header__nav__main__link:hover {
opacity: 0.6;
}
}
.l-header__nav__button {
margin-top: min(48px, 3.4285714286vw);
width: auto;
}
@media screen and (max-width: 991px) {
.l-header__nav__button {
margin-top: calc(30 / var(--cw-base, 500) * 100cqw);
}
}
@media screen and (min-width: 992px) {
.l-header__nav__bottom {
grid-area: bottom;
}
}
@media screen and (max-width: 991px) {
.l-header__nav__bottom {
text-align: center;
width: 100%;
}
}
@media screen and (min-width: 992px) {
.l-header__nav__bottom__inner {
margin-top: min(35px, 2.5vw);
}
}
.l-header__specialsite {
margin-top: calc(40 / var(--cw-base, 500) * 100cqw);
}
@media screen and (min-width: 992px) {
.l-header__specialsite {
display: none;
}
}
.l-header__specialsite__logo {
max-width: calc(200 / var(--cw-base, 500) * 100cqw);
margin: 0 auto;
}
.l-header__specialsite__button {
margin-top: calc(16 / var(--cw-base, 500) * 100cqw);
}
.l-header__social {
display: flex;
justify-content: flex-end;
gap: 0 min(20px, 1.4285714286vw);
}
@media screen and (max-width: 991px) {
.l-header__social {
gap: 0 calc(10 / var(--cw-base, 500) * 100cqw);
margin-top: calc(40 / var(--cw-base, 500) * 100cqw);
}
}
@media screen and (max-width: 991px) {
.l-header__social {
justify-content: center;
}
}
.l-header__social__link {
display: block;
}
.l-header__social__item {
aspect-ratio: 88/97;
}
@media screen and (min-width: 992px) {
.l-header__social__item {
width: min(44px, 3.1428571429vw);
}
}
@media screen and (max-width: 991px) {
.l-header__social__item {
width: calc(44 / var(--cw-base, 500) * 100cqw);
}
}
.l-header__corporate {
margin-top: calc(40 / var(--cw-base, 500) * 100cqw);
}
@media screen and (min-width: 992px) {
.l-header__corporate {
display: none;
}
}
.l-header__corporate__logo img {
width: calc(100 / var(--cw-base, 500) * 100cqw);
}
.l-header__corporate__logo span {
font-size: calc(14 / var(--cw-base, 500) * 100cqw);
margin-top: calc(5 / var(--cw-base, 500) * 100cqw);
display: block;
}
.l-header__copy {
font-family: "Rubik", sans-serif;
font-weight: 400;
font-size: calc(12 / var(--cw-base, 500) * 100cqw);
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
@media screen and (min-width: 992px) {
.l-header__copy {
font-size: min(12px, 0.8571428571vw);
text-align: right;
margin-top: min(24px, 1.7142857143vw);
}
}
@media screen and (max-width: 991px) {
.l-header__copy {
display: none;
}
}
.l-header__btn {
border: 1px solid #e91c25;
background: #fff;
border-radius: 100%;
width: calc(45 / var(--cw-base, 500) * 100cqw);
height: calc(45 / var(--cw-base, 500) * 100cqw);
position: fixed;
top: calc(env(safe-area-inset-top) + 5 / var(--cw-base, 500) * 100cqw);
right: calc(5 / var(--cw-base, 500) * 100cqw);
z-index: 999;
transition: transform 0.4s ease;
display: none;
}
@media screen and (max-width: 991px) {
.l-header__btn {
display: block;
}
}
.l-header__btn.is-active .l-header__btn__bar:nth-of-type(1) {
transform: translateY(calc(6 / var(--cw-base, 500) * 100cqw)) rotate(-45deg);
}
.l-header__btn.is-active .l-header__btn__bar:nth-of-type(2) {
opacity: 0;
transform: translateX(calc(20 / var(--cw-base, 500) * 100cqw));
}
.l-header__btn.is-active .l-header__btn__bar:nth-of-type(3) {
transform: translateY(calc(-6 / var(--cw-base, 500) * 100cqw)) rotate(45deg);
}
.l-header__btn__inner,
.l-header__btn__bar {
display: inline-block;
}
.l-header__btn__inner {
width: 100%;
height: calc(26 / var(--cw-base, 500) * 100cqw);
position: relative;
}
@media screen and (max-width: 991px) {
.l-header__btn__inner {
height: calc(16 / var(--cw-base, 500) * 100cqw);
}
}
.l-header__btn__bar {
background-color: #e91c25;
border-radius: 999em;
width: calc(20 / var(--cw-base, 500) * 100cqw);
height: calc(2 / var(--cw-base, 500) * 100cqw);
margin: 0 auto;
position: absolute;
left: 0;
right: 0;
transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1), 0.4s background-color ease;
}
.l-header__btn__bar:nth-of-type(1) {
top: calc(50% - 6 / var(--cw-base, 500) * 100cqw);
}
.l-header__btn__bar:nth-of-type(2) {
top: 50%;
}
.l-header__btn__bar:nth-of-type(3) {
top: calc(50% + 6 / var(--cw-base, 500) * 100cqw);
}
.l-footer {
background: rgba(255, 255, 255, 0.5);
padding-block: calc(64 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.l-footer {
background: url(../img/bg-fixed_sp.webp) no-repeat center center/cover, rgba(255, 255, 255, 0.5);
}
}
.l-footer__70thlogo {
max-width: calc(200 / var(--cw-base, 500) * 100cqw);
margin: 0 auto;
}
.l-footer__social {
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
display: flex;
justify-content: center;
gap: 0 calc(10 / var(--cw-base, 500) * 100cqw);
}
.l-footer__social__item {
width: calc(44 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 1/1;
}
.l-footer__social__link {
display: block;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 992px) {
.l-footer__social__link:hover {
opacity: 0.6;
}
}
.l-footer__specialsiteWrapper {
text-align: center;
margin-top: calc(40 / var(--cw-base, 500) * 100cqw);
}
.l-footer__specialsite {
border-radius: calc(47 / var(--cw-base, 500) * 100cqw);
overflow: hidden;
box-shadow: 0 calc(8 / var(--cw-base, 500) * 100cqw) #f08906;
transition: transform 0.4s ease, box-shadow 0.4s ease;
display: inline-block;
}
@media screen and (min-width: 992px) {
.l-footer__specialsite:hover {
transform: translateY(calc(-2 / var(--cw-base, 500) * 100cqw));
transform-origin: bottom center;
box-shadow: 0 calc(10 / var(--cw-base, 500) * 100cqw) 0 #f08906;
}
.l-footer__specialsite:hover::before {
opacity: 0;
}
}
.l-footer__specialsite:active {
transform: translateY(calc(10 / var(--cw-base, 500) * 100cqw));
box-shadow: none;
}
.l-footer__specialsite__link {
border-radius: calc(45 / var(--cw-base, 500) * 100cqw);
overflow: hidden;
max-width: calc(294 / var(--cw-base, 500) * 100cqw);
display: block;
}
@media screen and (min-width: 992px) {
.l-footer__specialsite__link {
max-width: min(294px, 21vw);
}
}
.l-footer__bnrList {
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: calc(10 / var(--cw-base, 500) * 100cqw);
}
.l-footer__bnrList__link {
display: block;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 992px) {
.l-footer__bnrList__link:hover {
opacity: 0.6;
}
}
.l-footer__corp {
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
text-align: center;
}
.l-footer__corp__link {
display: block;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 992px) {
.l-footer__corp__link:hover {
opacity: 0.6;
}
}
.l-footer__corp__logo {
width: calc(160 / var(--cw-base, 500) * 100cqw);
display: inline-block;
}
.l-footer__corp__name {
font-size: calc(14 / var(--cw-base, 500) * 100cqw);
font-weight: 400;
margin-top: calc(13 / var(--cw-base, 500) * 100cqw);
display: block;
}
.l-footer__copy {
font-family: "Rubik", sans-serif;
font-size: calc(12 / var(--cw-base, 500) * 100cqw);
font-weight: 400;
text-align: center;
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
}
@media screen and (min-width: 992px) {
.l-footer__copy {
display: none;
}
}
.l-pt {
width: calc(80 / var(--cw-base, 500) * 100cqw);
height: calc(80 / var(--cw-base, 500) * 100cqw);
position: fixed;
right: 0;
bottom: 0;
z-index: 10;
}
@media screen and (max-width: 991px) {
.l-pt {
width: calc(50 / var(--cw-base, 500) * 100cqw);
height: calc(50 / var(--cw-base, 500) * 100cqw);
}
}
.l-pt__btn {
background-color: #000;
width: 100%;
height: 100%;
display: block;
background: #fff;
overflow: hidden;
opacity: 0;
pointer-events: none;
transition: opacity 0.4s;
}
.l-pt__btn img {
width: 100%;
height: auto;
}
.l-pt__btn.is-show {
opacity: 1;
pointer-events: auto;
}
.c-bg {
background: url(../img/bg-fixed_pc.webp) no-repeat center center/cover;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
overflow: hidden;
z-index: -1;
}
.c-button__ctaWrapper {
text-align-last: left;
width: calc(452 / var(--cw-base, 500) * 100cqw);
position: relative;
z-index: 0;
}
@media screen and (max-width: 991px) {
.c-button__ctaWrapper {
width: calc(335 / var(--cw-base, 500) * 100cqw);
}
}
@media screen and (min-width: 992px) {
.c-button__ctaWrapper.--header {
width: min(300px, 21.4285714286vw);
margin: 0 auto;
}
.c-button__ctaWrapper.--header .c-button__cta__inner {
padding: min(16px, 1.1428571429vw);
}
.c-button__ctaWrapper.--header .c-button__cta__text {
width: min(160px, 12.8571428571vw);
}
.c-button__ctaWrapper.--header .c-button__cta__kanpychan {
width: min(90px, 6.4285714286vw);
aspect-ratio: 112/92;
top: calc(7 / var(--cw-base, 500) * 100cqw);
right: calc(5 / var(--cw-base, 500) * 100cqw);
z-index: -1;
}
}
.c-button__cta {
border-radius: 999em;
border: calc(6 / var(--cw-base, 500) * 100cqw) solid #fa3544;
outline: calc(2 / var(--cw-base, 500) * 100cqw) solid #fff;
outline-offset: calc(-6 / var(--cw-base, 500) * 100cqw);
box-shadow: 0 calc(8 / var(--cw-base, 500) * 100cqw) 0 #aa000d;
overflow: hidden;
display: block;
position: relative;
transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.c-button__cta::before, .c-button__cta::after {
content: "";
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.c-button__cta::before {
background: linear-gradient(-45deg, #ffd798 0%, #ff7e46 40%, #fa3544 90%);
z-index: -1;
transition: opacity 0.4s ease;
}
.c-button__cta::after {
background: linear-gradient(-45deg, #fa3544 0%, #ff7e46 60%, #ffd798 90%);
z-index: -2;
}
@media screen and (min-width: 992px) {
.c-button__cta:hover {
transform: translateY(calc(-2 / var(--cw-base, 500) * 100cqw));
transform-origin: bottom center;
box-shadow: 0 calc(10 / var(--cw-base, 500) * 100cqw) 0 #aa000d;
}
.c-button__cta:hover::before {
opacity: 0;
}
}
.c-button__cta:active {
transform: translateY(calc(10 / var(--cw-base, 500) * 100cqw));
box-shadow: none;
}
.c-button__cta__inner {
width: 100%;
padding: calc(25 / var(--cw-base, 500) * 100cqw);
position: relative;
display: block;
}
@media screen and (max-width: 991px) {
.c-button__cta__inner {
padding: calc(15 / var(--cw-base, 500) * 100cqw);
}
}
.c-button__cta__inner:before, .c-button__cta__inner::after {
content: "";
border-radius: 100%;
aspect-ratio: 1/1;
position: absolute;
opacity: 0.6;
}
.c-button__cta__inner::before {
background: radial-gradient(#fff, rgba(255, 255, 255, 0) 70%);
width: calc(206 / var(--cw-base, 500) * 100cqw);
bottom: calc(30 / var(--cw-base, 500) * 100cqw);
left: calc(-70 / var(--cw-base, 500) * 100cqw);
}
.c-button__cta__inner::after {
background: radial-gradient(#eded12, rgba(237, 237, 18, 0) 70%);
width: calc(150 / var(--cw-base, 500) * 100cqw);
bottom: calc(10 / var(--cw-base, 500) * 100cqw);
right: calc(-26 / var(--cw-base, 500) * 100cqw);
}
.c-button__cta__text {
width: calc(250 / var(--cw-base, 500) * 100cqw);
position: relative;
}
@media screen and (max-width: 991px) {
.c-button__cta__text {
width: calc(200 / var(--cw-base, 500) * 100cqw);
}
}
.c-button__cta__kanpychan {
width: calc(146 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 146/120;
position: absolute;
top: calc(7 / var(--cw-base, 500) * 100cqw);
right: calc(15 / var(--cw-base, 500) * 100cqw);
z-index: 10;
}
@media screen and (max-width: 991px) {
.c-button__cta__kanpychan {
width: calc(90 / var(--cw-base, 500) * 100cqw);
top: calc(3 / var(--cw-base, 500) * 100cqw);
right: calc(5 / var(--cw-base, 500) * 100cqw);
}
}
.c-secTtl {
font-weight: 700;
display: grid;
justify-content: center;
justify-items: center;
row-gap: calc(30 / var(--cw-base, 500) * 100cqw);
position: relative;
}
.c-secTtl .main {
font-size: calc(50 / var(--cw-base, 500) * 100cqw);
color: #e91c25;
text-align: center;
position: relative;
}
.c-secTtl .main::before, .c-secTtl .main::after {
content: "";
--r:2px; /* border radius */
height: calc(12 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 0.8660254038;
--_g:calc(tan(60deg)*var(--r)) left var(--r),#000 98%,#0000 101%;
-webkit-mask: conic-gradient(from 60deg at calc(3 * var(--r) / 2 - 100%), #000 60deg, rgba(0, 0, 0, 0) 0) 0 0/calc(100% - 3 * var(--r) / 2) 100% no-repeat, radial-gradient(var(--r) at calc(100% - 2 * var(--r)) 50%, #000 98%, rgba(0, 0, 0, 0) 101%), radial-gradient(var(--r) at top var(--_g)), radial-gradient(var(--r) at bottom var(--_g));
clip-path: polygon(100% 50%, 0 100%, 0 0);
position: absolute;
bottom: calc(-24 / var(--cw-base, 500) * 100cqw);
left: 48.5%;
transform: translateX(-60%);
}
.c-secTtl .main::before {
background: #e91c25;
}
.c-secTtl .main::after {
background: #20734b;
transform: scale(-1, 1);
}
.c-secTtl .sub {
font-size: calc(20 / var(--cw-base, 500) * 100cqw);
color: #20734b;
}
.c-sectionTtl__kanpychan {
display: flex;
gap: 0 calc(15 / var(--cw-base, 500) * 100cqw);
position: absolute;
bottom: calc(100% + 14 / var(--cw-base, 500) * 100cqw);
}
.c-sectionTtl__kanpychan__item img {
aspect-ratio: 36/70;
width: auto;
height: calc(70 / var(--cw-base, 500) * 100cqw);
}
.--bg__circle {
margin-top: calc(-83 / var(--cw-base, 500) * 100cqw);
padding-top: calc(83 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.--bg__circle {
margin-top: calc(-51 / var(--cw-base, 500) * 100cqw);
padding-top: calc(51 / var(--cw-base, 500) * 100cqw);
}
}
.--bg__green {
background: linear-gradient(to bottom, #efffc1, #f8ffe3);
padding-bottom: calc(200 / var(--cw-base, 500) * 100cqw);
position: relative;
}
.--bg__green::before {
content: "";
width: 100%;
aspect-ratio: 500/69;
position: absolute;
left: 0;
bottom: 100%;
z-index: 0;
background-color: #efffc1;
display: block;
-webkit-mask: url("../img/bg-sectionTop.svg") no-repeat center bottom/100% 100%;
mask: url("../img/bg-sectionTop.svg") no-repeat center bottom/100% 100%;
}
.--bg__red {
background: linear-gradient(to bottom, #fff2f2, #fff7f7);
padding-bottom: calc(200 / var(--cw-base, 500) * 100cqw);
position: relative;
}
.--bg__red::before {
content: "";
width: 100%;
aspect-ratio: 500/69;
position: absolute;
left: 0;
bottom: 100%;
z-index: 0;
background-color: #fff2f2;
display: block;
-webkit-mask: url("../img/bg-sectionTop.svg") no-repeat center bottom/100% 100%;
mask: url("../img/bg-sectionTop.svg") no-repeat center bottom/100% 100%;
}
.p-index__hero {
background: url(../img/bg-fv.webp) no-repeat center center/cover;
min-height: calc(800 / var(--cw-base, 500) * 100cqw);
}
@media screen and (min-width: 992px) {
.p-index__hero {
min-height: max(800px, 100vh);
}
}
@media screen and (max-width: 991px) {
.p-index__hero {
height: auto;
}
}
.p-index__hero__inner {
padding: calc(20 / var(--cw-base, 500) * 100cqw) 0 0;
}
.p-index__hero__ribbon {
text-align: center;
}
.p-index__hero__ribbon p {
font-size: calc(17 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
letter-spacing: 0.05em;
color: #fff;
background: #20734b;
padding: calc(6 / var(--cw-base, 500) * 100cqw) calc(15 / var(--cw-base, 500) * 100cqw);
display: inline-block;
position: relative;
}
.p-index__hero__ribbon p::before, .p-index__hero__ribbon p::after {
content: "";
border: 10px solid #20734b;
border-right-color: transparent;
border-width: calc(15 / var(--cw-base, 500) * 100cqw) calc(7 / var(--cw-base, 500) * 100cqw) calc(14 / var(--cw-base, 500) * 100cqw);
width: calc(10 / var(--cw-base, 500) * 100cqw);
position: absolute;
top: 0;
z-index: 1;
}
.p-index__hero__ribbon p::before {
transform: scale(-1, 1);
right: 100%;
}
.p-index__hero__ribbon p::after {
left: 100%;
}
.p-index__hero__lead {
text-align: center;
position: relative;
z-index: 10;
}
.p-index__hero__lead__sub {
max-width: calc(250 / var(--cw-base, 500) * 100cqw);
margin: 0 auto;
display: block;
}
.p-index__hero__lead__main {
margin-top: calc(-6 / var(--cw-base, 500) * 100cqw);
display: inline-block;
position: relative;
z-index: 0;
}
.p-index__hero__lead__main::after {
content: "";
position: absolute;
left: calc(-5 / var(--cw-base, 500) * 100cqw);
right: calc(-5 / var(--cw-base, 500) * 100cqw);
bottom: calc(-3 / var(--cw-base, 500) * 100cqw);
height: calc(12 / var(--cw-base, 500) * 100cqw);
background: #e91c25;
border-radius: 999px;
z-index: -1;
}
.p-index__hero__lead__main img {
max-width: calc(262 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__lead__main__bbl {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #fff;
background: #e91c25;
border-radius: 100%;
width: calc(50 / var(--cw-base, 500) * 100cqw);
height: calc(50 / var(--cw-base, 500) * 100cqw);
display: block;
aspect-ratio: 1/1;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: calc(-15 / var(--cw-base, 500) * 100cqw);
left: calc(-50 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__lead__main__bbl::before {
content: "";
background: #e91c25;
width: calc(8 / var(--cw-base, 500) * 100cqw);
height: calc(7 / var(--cw-base, 500) * 100cqw);
clip-path: polygon(50% 0, 100% 100%, 0 100%);
position: absolute;
right: calc(3 / var(--cw-base, 500) * 100cqw);
bottom: calc(6 / var(--cw-base, 500) * 100cqw);
z-index: -1;
}
.p-index__hero__title {
max-width: calc(290 / var(--cw-base, 500) * 100cqw);
margin: calc(20 / var(--cw-base, 500) * 100cqw) auto 0;
filter: drop-shadow(0 0 40px rgba(252, 237, 207, 0.8));
position: relative;
}
@media screen and (max-width: 991px) {
.p-index__hero__title {
max-width: calc(250 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__hero__title::before {
content: "";
background: url(../img/img-kanpychan_01.webp) no-repeat center center/contain;
width: calc(156 / var(--cw-base, 500) * 100cqw);
height: calc(128 / var(--cw-base, 500) * 100cqw);
position: absolute;
bottom: calc(10 / var(--cw-base, 500) * 100cqw);
left: calc(-138 / var(--cw-base, 500) * 100cqw);
z-index: -1;
}
@media screen and (max-width: 991px) {
.p-index__hero__title::before {
width: calc(110 / var(--cw-base, 500) * 100cqw);
height: calc(90 / var(--cw-base, 500) * 100cqw);
bottom: calc(40 / var(--cw-base, 500) * 100cqw);
left: calc(-68 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__hero__title::after {
content: "";
background: url(../img/img-kanpychan_02.webp) no-repeat center center/contain;
width: calc(110 / var(--cw-base, 500) * 100cqw);
height: calc(128 / var(--cw-base, 500) * 100cqw);
position: absolute;
bottom: calc(10 / var(--cw-base, 500) * 100cqw);
right: calc(-95 / var(--cw-base, 500) * 100cqw);
z-index: -1;
}
@media screen and (max-width: 991px) {
.p-index__hero__title::after {
width: calc(110 / var(--cw-base, 500) * 100cqw);
height: calc(90 / var(--cw-base, 500) * 100cqw);
bottom: calc(40 / var(--cw-base, 500) * 100cqw);
right: calc(-75 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__hero__img {
width: 100%;
aspect-ratio: 375/531;
}
.p-index__hero__prize {
width: 100%;
margin-top: calc(-5 / var(--cw-base, 500) * 100cqw);
position: relative;
overflow: hidden;
}
.p-index__hero__prize .slick-list {
overflow: visible;
}
.p-index__hero__prize .slick-track {
display: flex;
align-items: center;
}
.p-index__hero__prize .slick-center,
.p-index__hero__prize .is-loop-target {
z-index: 10;
}
.p-index__hero__prize .slick-center .p-index__hero__prize__list__item__inner,
.p-index__hero__prize .is-loop-target .p-index__hero__prize__list__item__inner {
transform: scale(1);
}
.p-index__hero__prize__list__item {
width: calc(350 / var(--cw-base, 500) * 100cqw) !important;
transform-origin: center center;
transition: transform 0.4s ease;
z-index: 0;
position: relative;
margin: 0 calc(-50 / var(--cw-base, 500) * 100cqw);
padding-top: calc(10 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__prize__list__item__inner {
transform: scale(0.8);
transition: transform 0.4s ease;
will-change: transform;
}
.p-index__hero__prize__list__item__ribbon {
width: calc(180 / var(--cw-base, 500) * 100cqw);
position: absolute;
top: 0;
left: 0;
left: 50%;
transform: translate(-50%, -18%);
z-index: 10;
}
.p-index__hero__prize__list__item__detail {
display: block;
width: 100%;
}
.p-index__hero__applicationPeriod {
font-weight: 700;
margin-top: calc(10 / var(--cw-base, 500) * 100cqw);
display: flex;
justify-content: center;
gap: 0 calc(15 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__applicationPeriod dt {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
color: #fff;
letter-spacing: 0.05em;
line-height: 1.17;
background: #b18147;
padding: calc(4 / var(--cw-base, 500) * 100cqw) calc(10 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 1/1;
display: flex;
align-items: center;
justify-content: center;
}
.p-index__hero__applicationPeriod dd {
display: flex;
align-items: center;
gap: 0 calc(12 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__applicationPeriod dd .schedule {
color: #b18147;
display: grid;
grid-template-columns: auto;
grid-template-rows: auto auto;
gap: 0px 0px;
grid-template-areas: "year year year year" "month slash day dow";
align-items: end;
}
.p-index__hero__applicationPeriod dd .schedule .year {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
grid-area: year;
}
.p-index__hero__applicationPeriod dd .schedule .date {
font-size: calc(40 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__applicationPeriod dd .schedule .date.month {
grid-area: month;
}
.p-index__hero__applicationPeriod dd .schedule .date.day {
grid-area: day;
}
.p-index__hero__applicationPeriod dd .schedule .slash {
font-size: calc(30 / var(--cw-base, 500) * 100cqw);
grid-area: slash;
margin-bottom: calc(2 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__applicationPeriod dd .schedule .dow {
font-size: calc(13 / var(--cw-base, 500) * 100cqw);
color: #fff;
background: #b18147;
border-radius: 100%;
width: calc(20 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 1/1;
grid-area: dow;
display: flex;
align-items: center;
justify-content: center;
}
.p-index__hero__applicationPeriod dd .tilde {
font-size: calc(20 / var(--cw-base, 500) * 100cqw);
color: #b18147;
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__products {
overflow: hidden;
width: 100%;
margin-top: calc(20 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__products .p-index__hero__products__list {
display: flex;
flex-wrap: nowrap;
align-items: flex-end;
width: max-content;
will-change: transform;
pointer-events: none;
}
.p-index__hero__products .p-index__hero__products__list.slick-initialized {
display: block;
width: 100%;
}
.p-index__hero__products .p-index__hero__products__list .slick-list {
overflow: visible;
}
.p-index__hero__products .p-index__hero__products__list .slick-track {
display: flex;
align-items: flex-end;
}
.p-index__hero__products .p-index__hero__products__list .slick-slide {
height: auto;
}
.p-index__hero__products .p-index__hero__products__list__item {
flex: 0 0 auto;
margin-right: calc(6 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__products .p-index__hero__products__list__item.jam01 img {
width: calc(58 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__products .p-index__hero__products__list__item.jam02 img {
width: calc(57 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__products .p-index__hero__products__list__item.anko img {
width: calc(42 / var(--cw-base, 500) * 100cqw);
}
.p-index__hero__products .p-index__hero__products__list__item.nori img {
width: calc(60 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__trailer {
display: none;
}
}
@media screen and (min-width: 992px) {
.p-index__trailer__message {
width: calc((100vw - 500px) / 2);
height: 100%;
position: absolute;
top: 0;
right: 0;
display: flex;
align-items: center;
justify-content: center;
}
}
@media screen and (max-width: 991px) {
.p-index__trailer__message {
padding: calc(50 / var(--cw-base, 500) * 100cqw) 0 0;
}
}
.p-index__trailer__message__text {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
line-height: 2.5;
letter-spacing: 0.05em;
color: #e91c25;
text-align: center;
}
@media screen and (min-width: 992px) {
.p-index__trailer__message__text {
font-size: min(18px, 1.2857142857vw);
}
}
.p-index__trailer__specialsite {
display: flex;
flex-direction: column;
}
@media screen and (min-width: 992px) {
.p-index__trailer__specialsite {
padding: min(35px, 2.5vw) min(25px, 1.7857142857vw);
width: calc((100vw - 500px) / 2);
height: 100%;
position: absolute;
top: 0;
left: 0;
align-items: center;
justify-content: center;
position: fixed;
overflow-y: auto;
}
}
@media screen and (max-width: 991px) {
.p-index__trailer__specialsite {
padding: calc(50 / var(--cw-base, 500) * 100cqw) 0 0;
align-items: center;
}
}
.p-index__trailer__specialsite__logo {
width: calc(237 / var(--cw-base, 500) * 100cqw);
}
@media screen and (min-width: 992px) {
.p-index__trailer__specialsite__logo {
width: min(237px, 16.9285714286vw);
}
}
.p-index__trailer__specialsite__button {
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
box-shadow: 0 calc(8 / var(--cw-base, 500) * 100cqw) #f08906;
transition: transform 0.4s ease, box-shadow 0.4s ease;
}
@media screen and (min-width: 992px) {
.p-index__trailer__specialsite__button {
border-radius: min(47px, 3.3571428571vw);
margin-top: min(24px, 1.7142857143vw);
}
}
@media screen and (min-width: 992px) {
.p-index__trailer__specialsite__button:hover {
transform: translateY(calc(-2 / var(--cw-base, 500) * 100cqw));
transform-origin: bottom center;
box-shadow: 0 calc(10 / var(--cw-base, 500) * 100cqw) 0 #f08906;
}
.p-index__trailer__specialsite__button:hover::before {
opacity: 0;
}
}
.p-index__trailer__specialsite__button:active {
transform: translateY(calc(10 / var(--cw-base, 500) * 100cqw));
box-shadow: none;
}
.p-index__trailer__specialsite__button__link {
border-radius: calc(45 / var(--cw-base, 500) * 100cqw);
overflow: hidden;
max-width: calc(294 / var(--cw-base, 500) * 100cqw);
display: block;
}
@media screen and (min-width: 992px) {
.p-index__trailer__specialsite__button__link {
max-width: min(294px, 21vw);
}
}
.p-index__intro {
background: url(../img/bg-intro.webp) no-repeat center center/cover;
padding: calc(64 / var(--cw-base, 500) * 100cqw) 0 calc(172 / var(--cw-base, 500) * 100cqw);
color: #e91c25;
text-align: center;
}
.p-index__intro__ttl {
font-size: calc(22 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
line-height: 1.55;
}
.p-index__intro__txt {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 500;
line-height: 2;
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
.p-index__intro__button {
margin-top: calc(56 / var(--cw-base, 500) * 100cqw);
}
.p-index__prize__list {
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
}
.p-index__prize__list__item:not(:first-child) {
margin-top: calc(56 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__prize__list__item:not(:first-child) {
margin-top: calc(32 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__prize__list__quantity {
font-size: calc(20 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #e91c25;
text-align: center;
}
.p-index__prize__list__quantity span {
font-size: calc(30 / var(--cw-base, 500) * 100cqw);
}
.p-index__prize__list__detail {
margin-top: calc(10 / var(--cw-base, 500) * 100cqw);
padding-top: calc(30 / var(--cw-base, 500) * 100cqw);
position: relative;
}
.p-index__prize__list__detail__name {
width: calc(300 / var(--cw-base, 500) * 100cqw);
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
@media screen and (max-width: 991px) {
.p-index__prize__list__detail__name {
width: calc(250 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__prize__list__detail__img {
margin: 0 auto;
width: calc(400 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__prize__list__detail__img {
width: calc(335 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__prize__note {
margin-top: calc(40 / var(--cw-base, 500) * 100cqw);
}
.p-index__prize__note__item {
font-size: calc(14 / var(--cw-base, 500) * 100cqw);
line-height: 1.2;
padding-left: 1em;
text-indent: -1em;
position: relative;
}
.p-index__prize__note__item::before {
content: "※";
}
.p-index__prize__note__item:not(:first-child) {
margin-top: calc(5 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list {
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__item:not(:first-child) {
margin-top: calc(40 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__top {
background: #20734b;
border-top-right-radius: calc(20 / var(--cw-base, 500) * 100cqw);
border-top-left-radius: calc(20 / var(--cw-base, 500) * 100cqw);
padding: calc(15 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__name {
font-size: calc(24 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #fff;
line-height: 1.2;
text-align: center;
}
.p-index__products__list__img {
background: #fff;
margin-top: calc(15 / var(--cw-base, 500) * 100cqw);
padding: calc(20 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__img__inner {
margin: 0 auto;
display: flex;
flex-wrap: wrap;
gap: calc(16 / var(--cw-base, 500) * 100cqw);
justify-content: center;
}
.p-index__products__list__img__inner.--jam01 {
max-width: calc(80 / var(--cw-base, 500) * 100cqw * 3 + 32 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__products__list__img__inner.--jam01 {
max-width: calc(70 / var(--cw-base, 500) * 100cqw * 3 + 32 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__products__list__img__inner.--jam01 img {
width: calc(80 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__products__list__img__inner.--jam01 img {
width: calc(70 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__products__list__img__inner.--jam02 {
max-width: calc(90 / var(--cw-base, 500) * 100cqw * 3 + 16 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__img__inner.--jam02 img {
width: calc(90 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__img__inner.--anko {
max-width: calc(90 / var(--cw-base, 500) * 100cqw * 3 + 16 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__img__inner.--anko img {
width: calc(90 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__img__inner.--nori01 img {
width: calc(100 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__img__inner.--nori02 img {
width: calc(100 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__bottom {
background: #e91c25;
border-bottom-right-radius: calc(20 / var(--cw-base, 500) * 100cqw);
border-bottom-left-radius: calc(20 / var(--cw-base, 500) * 100cqw);
padding: calc(8 / var(--cw-base, 500) * 100cqw) calc(14 / var(--cw-base, 500) * 100cqw) calc(14 / var(--cw-base, 500) * 100cqw);
}
.p-index__products__list__detail {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 500;
color: #fff;
line-height: 1.4;
text-align: center;
}
.p-index__products__cta {
margin-top: calc(72 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtoapply__lead {
font-size: calc(24 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #20734b;
text-align: center;
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtoapply__list {
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
counter-reset: howtoapply-step;
}
.p-index__howtoapply__list__item {
counter-increment: howtoapply-step;
border: 2px solid #20734b;
border-radius: calc(20 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtoapply__list__item:not(:last-child) {
margin-bottom: calc(40 / var(--cw-base, 500) * 100cqw);
position: relative;
}
.p-index__howtoapply__list__item:not(:last-child)::after {
content: "";
--r:2px; /* border radius */
height: calc(16 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 0.8660254038;
--_g:calc(tan(60deg)*var(--r)) left var(--r),#000 98%,#0000 101%;
-webkit-mask: conic-gradient(from 60deg at calc(3 * var(--r) / 2 - 100%), #000 60deg, rgba(0, 0, 0, 0) 0) 0 0/calc(100% - 3 * var(--r) / 2) 100% no-repeat, radial-gradient(var(--r) at calc(100% - 2 * var(--r)) 50%, #000 98%, rgba(0, 0, 0, 0) 101%), radial-gradient(var(--r) at top var(--_g)), radial-gradient(var(--r) at bottom var(--_g));
clip-path: polygon(100% 50%, 0 100%, 0 0);
background: #e91c25;
position: absolute;
top: calc(100% + 40 / var(--cw-base, 500) * 100cqw / 2);
left: 50%;
transform: translate(-50%, -50%) rotate(90deg);
}
.p-index__howtoapply__list__step {
font-family: "Rubik", sans-serif;
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #fff;
text-align: center;
background: #20734b;
border-top-right-radius: calc(17 / var(--cw-base, 500) * 100cqw);
border-top-left-radius: calc(17 / var(--cw-base, 500) * 100cqw);
padding: calc(3 / var(--cw-base, 500) * 100cqw);
position: relative;
}
.p-index__howtoapply__list__step::after {
content: counter(howtoapply-step, decimal-leading-zero);
font-size: calc(30 / var(--cw-base, 500) * 100cqw);
display: inline-block;
}
.p-index__howtoapply__list__step.--conpleted {
padding: calc(10 / var(--cw-base, 500) * 100cqw) calc(3 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtoapply__list__step.--conpleted::after {
content: "";
}
.p-index__howtoapply__list__cont {
background: #fff;
padding: calc(24 / var(--cw-base, 500) * 100cqw) calc(20 / var(--cw-base, 500) * 100cqw);
display: grid;
align-items: center;
grid-template-columns: calc(64 / var(--cw-base, 500) * 100cqw) 1fr;
gap: 0 calc(20 / var(--cw-base, 500) * 100cqw);
border-bottom-right-radius: calc(17 / var(--cw-base, 500) * 100cqw);
border-bottom-left-radius: calc(17 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__howtoapply__list__cont {
padding: calc(15 / var(--cw-base, 500) * 100cqw) calc(15 / var(--cw-base, 500) * 100cqw);
gap: 0 calc(10 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__howtoapply__list__icon {
background: #20734b;
justify-self: center;
}
.p-index__howtoapply__list__icon.--cart {
width: calc(64 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 64/56;
mask: var(--icon-cart) no-repeat center/contain;
}
.p-index__howtoapply__list__icon.--receipt {
width: calc(52 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 52/48;
mask: var(--icon-receipt) no-repeat center/contain;
}
.p-index__howtoapply__list__icon.--phonetouch {
width: calc(45 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 45/58;
mask: var(--icon-phone-touch) no-repeat center/contain;
}
.p-index__howtoapply__list__icon.--phoneconplete {
width: calc(53 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 53/71;
mask: var(--icon-phone-complete) no-repeat center/contain;
}
.p-index__howtoapply__list__detail {
font-size: calc(20 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
line-height: 1.7;
}
@media screen and (max-width: 991px) {
.p-index__howtoapply__list__detail {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__howtoapply__notes {
background: #fff;
border-radius: calc(20 / var(--cw-base, 500) * 100cqw);
margin-top: calc(56 / var(--cw-base, 500) * 100cqw);
padding: calc(32 / var(--cw-base, 500) * 100cqw) calc(30 / var(--cw-base, 500) * 100cqw) calc(40 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtoapply__notes__ttl {
font-size: calc(26 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #20734b;
line-height: 1.2;
text-align: center;
}
.p-index__howtoapply__notes__announcing {
font-size: calc(22 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
text-align: center;
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
@media screen and (max-width: 991px) {
.p-index__howtoapply__notes__announcing {
font-size: calc(20 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__howtoapply__notes__announcing p {
background: linear-gradient(transparent 60%, #efffc1 0%);
padding-inline: 0.5em;
display: inline;
}
.p-index__howtoapply__notes__detail {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 400;
line-height: 1.6;
margin-top: calc(27 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__lead {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 500;
line-height: 2;
text-align: center;
margin-top: calc(32 / var(--cw-base, 500) * 100cqw);
display: block;
}
.p-index__howtophotograph__example {
border-radius: calc(20 / var(--cw-base, 500) * 100cqw);
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
padding: calc(15 / var(--cw-base, 500) * 100cqw) calc(15 / var(--cw-base, 500) * 100cqw) calc(30 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__example.--good {
background: #e91c25;
}
.p-index__howtophotograph__example.--bad {
background: #5a2fba;
}
.p-index__howtophotograph__example__ttl {
font-size: calc(26 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #fff;
display: flex;
justify-content: center;
column-gap: calc(8 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__example__goodImg {
background: #fff;
margin-top: calc(15 / var(--cw-base, 500) * 100cqw);
padding: calc(20 / var(--cw-base, 500) * 100cqw);
display: flex;
align-items: center;
justify-content: center;
}
.p-index__howtophotograph__example__goodImg img {
width: calc(277 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__example__conditions {
margin-top: calc(20 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__example__conditions__item {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 500;
color: #fff;
line-height: 1.75;
padding-left: 1em;
position: relative;
}
.p-index__howtophotograph__example__conditions__item::before {
content: "・";
position: absolute;
left: 0;
}
.p-index__howtophotograph__example__conditions__item:not(:first-child) {
margin-top: calc(8 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__example__badImg {
margin-top: calc(15 / var(--cw-base, 500) * 100cqw);
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: calc(24 / var(--cw-base, 500) * 100cqw) calc(10 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__example__badImg__ttl {
font-size: 16px;
font-weight: 700;
line-height: 1.3;
color: #fff;
text-align: center;
margin-top: calc(10 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__notes {
background: #fff;
border-radius: calc(20 / var(--cw-base, 500) * 100cqw);
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
padding: calc(24 / var(--cw-base, 500) * 100cqw) calc(20 / var(--cw-base, 500) * 100cqw) calc(20 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__notes__ttl {
font-size: calc(26 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #e91c25;
text-align: center;
}
.p-index__howtophotograph__notes__list {
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__notes__list__item:not(:first-child) {
margin-top: calc(32 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__notes__list__ttl {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
line-height: 1.3;
position: relative;
padding-left: 1em;
}
.p-index__howtophotograph__notes__list__ttl::before {
content: "";
background: #e91c25;
border-radius: 100%;
width: calc(8 / var(--cw-base, 500) * 100cqw);
aspect-ratio: 1/1;
position: absolute;
top: 0.5em;
left: 0;
}
.p-index__howtophotograph__notes__list__detail {
font-size: calc(16 / var(--cw-base, 500) * 100cqw);
font-weight: 400;
line-height: 1.5;
margin-top: calc(8 / var(--cw-base, 500) * 100cqw);
display: block;
}
.p-index__howtophotograph__notes__list__detail span {
font-weight: 700;
background: linear-gradient(transparent 60%, #efffc1 0%);
}
.p-index__howtophotograph__notes__example {
margin-top: calc(16 / var(--cw-base, 500) * 100cqw);
display: flex;
column-gap: calc(10 / var(--cw-base, 500) * 100cqw);
}
.p-index__howtophotograph__notes__example__item {
width: 100%;
background: #d3d3d3;
padding: calc(18 / var(--cw-base, 500) * 100cqw);
display: flex;
justify-content: center;
}
@media screen and (max-width: 991px) {
.p-index__howtophotograph__notes__example__item {
padding: calc(10 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__howtophotograph__notes__example__item .long {
max-width: calc(191 / var(--cw-base, 500) * 100cqw);
}
.p-index__period__cont {
line-height: 1.3;
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
text-align: center;
}
.p-index__period__cont__ttl {
font-size: calc(26 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
color: #20734b;
}
.p-index__period__cont__detail {
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
.p-index__period__cont__detail__main {
font-size: calc(18 / var(--cw-base, 500) * 100cqw);
font-weight: 500;
}
.p-index__period__cta {
margin-top: calc(72 / var(--cw-base, 500) * 100cqw);
}
.p-index__guidelines__cont {
background: #fff;
max-height: calc(750 / var(--cw-base, 500) * 100cqw);
border-radius: calc(20 / var(--cw-base, 500) * 100cqw);
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
overflow-y: auto;
}
@media screen and (max-width: 991px) {
.p-index__guidelines__cont {
max-height: calc(500 / var(--cw-base, 500) * 100cqw);
}
}
.p-index__guidelines__cont__inner {
font-size: 16px;
font-weight: 400;
line-height: 1.5;
padding: calc(24 / var(--cw-base, 500) * 100cqw) calc(20 / var(--cw-base, 500) * 100cqw);
}
.p-index__guidelines__cont__inner dl:not(:first-child) {
margin-top: 1em;
}
.p-index__guidelines__cont__inner dl dt {
position: relative;
padding-left: 1em;
}
.p-index__guidelines__cont__inner dl dt::before {
content: "■";
position: absolute;
left: 0;
}
.p-index__guidelines__cont__inner dd > *:not(:first-child) {
margin-top: 0.5em;
}
.p-index__guidelines__cont__inner ul li {
position: relative;
padding-left: 1em;
}
.p-index__guidelines__cont__inner ul li::before {
position: absolute;
left: 0;
}
.p-index__guidelines__cont__inner ul.dot li::before {
content: "・";
}
.p-index__guidelines__cont__inner ul.note li::before {
content: "※";
}
.p-index__guidelines__cont__inner a {
text-decoration: underline;
}
@media screen and (min-width: 992px) {
.p-index__guidelines__cont__inner a:hover {
text-decoration: none;
}
}
.p-index__contact__inner {
padding-bottom: calc(80 / var(--cw-base, 500) * 100cqw);
}
.p-index__contact__cont {
line-height: 1.3;
margin-top: calc(48 / var(--cw-base, 500) * 100cqw);
text-align: center;
}
.p-index__contact__cont__ttl {
font-size: calc(26 / var(--cw-base, 500) * 100cqw);
font-weight: 700;
}
.p-index__contact__cont__detail {
margin-top: calc(24 / var(--cw-base, 500) * 100cqw);
}
.p-index__contact__cont__detail__main {
font-size: 16px;
font-weight: 500;
}
.p-index__contact__cont__detail__main[href] {
text-decoration: underline;
}
@media screen and (min-width: 992px) {
.p-index__contact__cont__detail__main[href]:hover {
text-decoration: none;
}
}
.p-index__contact__cont__detail__note {
margin-top: calc(16 / var(--cw-base, 500) * 100cqw);
display: inline-flex;
flex-direction: column;
}
.p-index__contact__cont__detail__note__item {
font-weight: 400;
position: relative;
padding-left: 1em;
display: inline-block;
}
.p-index__contact__cont__detail__note__item::before {
content: "※";
position: absolute;
text-indent: -1em;
}