@charset "UTF-8";
.mfp-bg {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1042;
overflow: hidden;
position: fixed;
background: #0b0b0b;
opacity: 0.8; }
.mfp-wrap {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1043;
position: fixed;
outline: none !important;
-webkit-backface-visibility: hidden; }
.mfp-container {
text-align: center;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
padding: 0 8px;
box-sizing: border-box; }
.mfp-container:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle; }
.mfp-align-top .mfp-container:before {
display: none; }
.mfp-content {
position: relative;
display: inline-block;
vertical-align: middle;
margin: 0 auto;
text-align: left;
z-index: 1045; }
.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
width: 100%;
cursor: auto; }
.mfp-ajax-cur {
cursor: progress; }
.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
cursor: -moz-zoom-out;
cursor: -webkit-zoom-out;
cursor: zoom-out; }
.mfp-zoom {
cursor: pointer;
cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
cursor: zoom-in; }
.mfp-auto-cursor .mfp-content {
cursor: auto; }
.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none; }
.mfp-loading.mfp-figure {
display: none; }
.mfp-hide {
display: none !important; }
.mfp-preloader {
color: #CCC;
position: absolute;
top: 50%;
width: auto;
text-align: center;
margin-top: -0.8em;
left: 8px;
right: 8px;
z-index: 1044; }
.mfp-preloader a {
color: #CCC; }
.mfp-preloader a:hover {
color: #FFF; }
.mfp-s-ready .mfp-preloader {
display: none; }
.mfp-s-error .mfp-content {
display: none; }
button.mfp-close,
button.mfp-arrow {
overflow: visible;
cursor: pointer;
background: transparent;
border: 0;
-webkit-appearance: none;
display: block;
outline: none;
padding: 0;
z-index: 1046;
box-shadow: none;
touch-action: manipulation; }
button::-moz-focus-inner {
padding: 0;
border: 0; }
.mfp-close {
width: 44px;
height: 44px;
line-height: 44px;
position: absolute;
right: 0;
top: 0;
text-decoration: none;
text-align: center;
opacity: 0.65;
padding: 0 0 18px 10px;
color: #FFF;
font-style: normal;
font-size: 28px;
font-family: Arial, Baskerville, monospace; }
.mfp-close:hover,
.mfp-close:focus {
opacity: 1; }
.mfp-close:active {
top: 1px; }
.mfp-close-btn-in .mfp-close {
color: #333; }
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
color: #FFF;
right: -6px;
text-align: right;
padding-right: 6px;
width: 100%; }
.mfp-counter {
position: absolute;
top: 0;
right: 0;
color: #CCC;
font-size: 12px;
line-height: 18px;
white-space: nowrap; }
.mfp-arrow {
position: absolute;
opacity: 0.65;
margin: 0;
top: 50%;
margin-top: -55px;
padding: 0;
width: 90px;
height: 110px;
-webkit-tap-highlight-color: transparent; }
.mfp-arrow:active {
margin-top: -54px; }
.mfp-arrow:hover,
.mfp-arrow:focus {
opacity: 1; }
.mfp-arrow:before,
.mfp-arrow:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 0;
top: 0;
margin-top: 35px;
margin-left: 35px;
border: medium inset transparent; }
.mfp-arrow:after {
border-top-width: 13px;
border-bottom-width: 13px;
top: 8px; }
.mfp-arrow:before {
border-top-width: 21px;
border-bottom-width: 21px;
opacity: 0.7; }
.mfp-arrow-left {
left: 0; }
.mfp-arrow-left:after {
border-right: 17px solid #FFF;
margin-left: 31px; }
.mfp-arrow-left:before {
margin-left: 25px;
border-right: 27px solid #3F3F3F; }
.mfp-arrow-right {
right: 0; }
.mfp-arrow-right:after {
border-left: 17px solid #FFF;
margin-left: 39px; }
.mfp-arrow-right:before {
border-left: 27px solid #3F3F3F; }
.mfp-iframe-holder {
padding-top: 40px;
padding-bottom: 40px; }
.mfp-iframe-holder .mfp-content {
line-height: 0;
width: 100%;
max-width: 900px; }
.mfp-iframe-holder .mfp-close {
top: -40px; }
.mfp-iframe-scaler {
width: 100%;
height: 0;
overflow: hidden;
padding-top: 56.25%; }
.mfp-iframe-scaler iframe {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: #000; } img.mfp-img {
width: auto;
max-width: 100%;
height: auto;
display: block;
line-height: 0;
box-sizing: border-box;
padding: 40px 0 40px;
margin: 0 auto; } .mfp-figure {
line-height: 0; }
.mfp-figure:after {
content: '';
position: absolute;
left: 0;
top: 40px;
bottom: 40px;
display: block;
right: 0;
width: auto;
height: auto;
z-index: -1;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: #444; }
.mfp-figure small {
color: #BDBDBD;
display: block;
font-size: 12px;
line-height: 14px; }
.mfp-figure figure {
margin: 0; }
.mfp-bottom-bar {
margin-top: -36px;
position: absolute;
top: 100%;
left: 0;
width: 100%;
cursor: auto; }
.mfp-title {
text-align: left;
line-height: 18px;
color: #F3F3F3;
word-wrap: break-word;
padding-right: 36px; }
.mfp-image-holder .mfp-content {
max-width: 100%; }
.mfp-gallery .mfp-image-holder .mfp-figure {
cursor: pointer; }
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { .mfp-img-mobile .mfp-image-holder {
padding-left: 0;
padding-right: 0; }
.mfp-img-mobile img.mfp-img {
padding: 0; }
.mfp-img-mobile .mfp-figure:after {
top: 0;
bottom: 0; }
.mfp-img-mobile .mfp-figure small {
display: inline;
margin-left: 5px; }
.mfp-img-mobile .mfp-bottom-bar {
background: rgba(0, 0, 0, 0.6);
bottom: 0;
margin: 0;
top: auto;
padding: 3px 5px;
position: fixed;
box-sizing: border-box; }
.mfp-img-mobile .mfp-bottom-bar:empty {
padding: 0; }
.mfp-img-mobile .mfp-counter {
right: 5px;
top: 3px; }
.mfp-img-mobile .mfp-close {
top: 0;
right: 0;
width: 35px;
height: 35px;
line-height: 35px;
background: rgba(0, 0, 0, 0.6);
position: fixed;
text-align: center;
padding: 0; } }
@media all and (max-width: 900px) {
.mfp-arrow {
-webkit-transform: scale(0.75);
transform: scale(0.75); }
.mfp-arrow-left {
-webkit-transform-origin: 0;
transform-origin: 0; }
.mfp-arrow-right {
-webkit-transform-origin: 100%;
transform-origin: 100%; }
.mfp-container {
padding-left: 6px;
padding-right: 6px; } }.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
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;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
width: 100%;
height: auto;
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;
}

body {
font-family: 'Noto Sans JP', sans-serif;
}
b,
strong,
.bold {
font-family: 'Noto Sans JP', sans-serif;
}
a {
text-decoration: none;
color: #000;
}
.default-text {
letter-spacing: 0.2em;
line-height: 2.3em;
font-weight: bold;
}
.default-box {
text-align: center;
}
.fluid-image {
padding-top: 90px;
margin: 0 auto;
}
.fluid-image img {
width: 100%;
height: auto;
display: block;
}
.concept-top-image {
padding-top: 90px;
margin: 0 auto;
width: 1250px;
}
@media screen and (max-width: 1250px) {
.concept-top-image {
padding-top: 90px;
margin: 0 auto;
width: auto;
}
}
@media screen and (max-width: 480px) {
.concept-image {
width: 100%;
}
}
.concept-list {
display: flex;
margin-bottom: 70px;
justify-content: space-around;
}
@media screen and (max-width: 480px) {
.concept-list {
box-sizing: border-box;
max-width: 100%;
padding: 0;
padding-bottom: 35px;
display: block;
}
}
.concept-list-image {
width: 100%;
height: auto;
display: block;
}
.concept-item {
width: 40%;
}
@media screen and (max-width: 480px) {
.concept-item {
width: 90%;
margin: 37px auto 0;
}
}
.top-concept-title {
color: #3E3E3E !important;
}
.concept-title {
font-size: 1.25rem;
line-height: 1.65;
letter-spacing: 0.025em;
padding-bottom: 17px;
}
.top-concept-subtitle {
color: #3E3E3E !important;
line-height: 2;
letter-spacing: 0.08em;
}
.top-concept-subtitle {
color: #3E3E3E !important;
line-height: 2;
letter-spacing: 0.08em;
}
.concept-subtitle {
color: #3E3E3E !important;
line-height: 2;
letter-spacing: 0.08em;
}
@media screen and (max-width: 480px) {
.fluid-image {
padding-top: 29px;
width: auto;
}
.default-text {
line-height: 2em;
}
}
.white {
color: #fff;
}
.description {
font-size: 0.9rem;
line-height: 2.3em;
}
.description-box {
width: 90%;
margin: 37px auto 0;
}
.description-box-title {
padding-bottom: 22px;
font-size: 1.3rem;
}
.topicpath {
display: flex;
}
.topicpath-item {
font-size: 1rem;
margin-right: 30px;
margin-left: 20px;
}
.topicpath-link {
position: relative;
}
.topicpath-link::after {
content: "";
display: inline-block;
width: 10px;
height: 10px;
position: absolute;
top: 50%;
right: -25px;
margin-top: -6px;
border-top: 1px solid #8c8c8f;
transform: rotate(45deg);
border-right: 1px solid #8c8c8f;
}
@media screen and (max-width: 480px) {
.topicpath-link::after {
right: -12px;
}
.topicpath-item {
font-size: 0.87rem;
margin-right: 20px;
margin-left: 0;
}
.under-news-image {
width: 50%;
}
} .sp_only {
display: none !important;
}
.pc_only {
display: block !important;
}
@media screen and (max-width: 760px) { .sp_only {
display: block !important;
}
.pc_only {
display: none !important;
}
}  *,
::before,
::after {
box-sizing: border-box;
} ::before,
::after {
text-decoration: inherit; vertical-align: inherit; } html {
cursor: default; line-height: 1.5; -moz-tab-size: 4; tab-size: 4; -webkit-tap-highlight-color: transparent;
-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; word-break: break-word; }  body {
margin: 0;
} h1 {
font-size: 2em;
margin: 0.67em 0;
}  dl dl,
dl ol,
dl ul,
ol dl,
ul dl {
margin: 0;
} ol ol,
ol ul,
ul ol,
ul ul {
margin: 0;
} hr {
height: 0; overflow: visible; } main {
display: block;
} nav ol,
nav ul {
list-style: none;
padding: 0;
} pre {
font-family: monospace, monospace; font-size: 1em; }  a {
background-color: transparent;
} abbr[title] {
text-decoration: underline;
text-decoration: underline dotted;
} b,
strong {
font-weight: bolder;
} code,
kbd,
samp {
font-family: monospace, monospace; font-size: 1em; } small {
font-size: 80%;
}  audio,
canvas,
iframe,
img,
svg,
video {
vertical-align: middle;
} audio,
video {
display: inline-block;
} audio:not([controls]) {
display: none;
height: 0;
} iframe {
border-style: none;
} img {
border-style: none;
width: 100%;
} svg:not([fill]) {
fill: currentColor;
} svg:not(:root) {
overflow: hidden;
}  table {
border-collapse: collapse;
}  button,
input,
select {
margin: 0;
} button {
overflow: visible; text-transform: none; } button,
[type="button"],
[type="reset"],
[type="submit"] {
appearance: button;
-webkit-appearance: button;
} fieldset {
border: 1px solid #a0a0a0; padding: 0.35em 0.75em 0.625em; } input {
overflow: visible;
} legend {
color: inherit; display: table; max-width: 100%; white-space: normal; } progress {
display: inline-block; vertical-align: baseline; } select {
text-transform: none;
} textarea {
margin: 0; overflow: auto; resize: vertical; } [type="checkbox"],
[type="radio"] {
padding: 0;
} [type="search"] {
-webkit-appearance: textfield;
appearance: textfield; outline-offset: -2px; } ::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
} ::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
} ::-webkit-search-decoration {
-webkit-appearance: none;
} ::-webkit-file-upload-button {
-webkit-appearance: button; font: inherit; } ::-moz-focus-inner {
border-style: none;
padding: 0;
} :-moz-focusring {
outline: 1px dotted ButtonText;
} :-moz-ui-invalid {
box-shadow: none;
}  details {
display: block;
} dialog {
background-color: white;
border: solid;
color: black;
display: block;
height: -moz-fit-content;
height: -webkit-fit-content;
height: fit-content;
left: 0;
margin: auto;
padding: 1em;
position: absolute;
right: 0;
width: -moz-fit-content;
width: -webkit-fit-content;
width: fit-content;
}
dialog:not([open]) {
display: none;
} summary {
display: list-item;
}  canvas {
display: inline-block;
} template {
display: none;
}  a,
area,
button,
input,
label,
select,
summary,
textarea,
[tabindex] {
-ms-touch-action: manipulation; touch-action: manipulation; } [hidden] {
display: none;
}  [aria-busy="true"] {
cursor: progress;
} [aria-controls] {
cursor: pointer;
} [aria-disabled="true"],
[disabled] {
cursor: not-allowed;
} [aria-hidden="false"][hidden] {
display: initial;
}
[aria-hidden="false"][hidden]:not(:focus) {
clip: rect(0, 0, 0, 0);
position: absolute;
} html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
color: #3E3E3E;
} article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
overflow-x: hidden;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.row {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.col-lg-1 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 8.3333333333%;
flex-basis: 8.3333333333%;
padding: 0 20px;
}
.col-lg-2 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 16.6666666667%;
flex-basis: 16.6666666667%;
padding: 0 20px;
}
.col-lg-3 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 25%;
flex-basis: 25%;
padding: 0 20px;
}
.col-lg-4 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 33.3333333333%;
flex-basis: 33.3333333333%;
padding: 0 20px;
}
.col-lg-5 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 41.6666666667%;
flex-basis: 41.6666666667%;
padding: 0 20px;
}
.col-lg-6 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 50%;
flex-basis: 50%;
padding: 0 20px;
}
.col-lg-7 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 58.3333333333%;
flex-basis: 58.3333333333%;
padding: 0 20px;
}
.col-lg-8 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 66.6666666667%;
flex-basis: 66.6666666667%;
padding: 0 20px;
}
.col-lg-9 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 75%;
flex-basis: 75%;
padding: 0 20px;
}
.col-lg-10 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 83.3333333333%;
flex-basis: 83.3333333333%;
padding: 0 20px;
}
.col-lg-11 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 91.6666666667%;
flex-basis: 91.6666666667%;
padding: 0 20px;
}
.col-lg-12 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 100%;
flex-basis: 100%;
padding: 0 20px;
}
@media screen and (max-width: 760px) {
.col-sm-1 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 8.3333333333%;
flex-basis: 8.3333333333%;
padding: 0;
}
.col-sm-2 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 16.6666666667%;
flex-basis: 16.6666666667%;
padding: 0;
}
.col-sm-3 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 25%;
flex-basis: 25%;
padding: 0;
}
.col-sm-4 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 33.3333333333%;
flex-basis: 33.3333333333%;
padding: 0;
}
.col-sm-5 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 41.6666666667%;
flex-basis: 41.6666666667%;
padding: 0;
}
.col-sm-6 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 50%;
flex-basis: 50%;
padding: 0;
}
.col-sm-7 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 58.3333333333%;
flex-basis: 58.3333333333%;
padding: 0;
}
.col-sm-8 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 66.6666666667%;
flex-basis: 66.6666666667%;
padding: 0;
}
.col-sm-9 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 75%;
flex-basis: 75%;
padding: 0;
}
.col-sm-10 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 83.3333333333%;
flex-basis: 83.3333333333%;
padding: 0;
}
.col-sm-11 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 91.6666666667%;
flex-basis: 91.6666666667%;
padding: 0;
}
.col-sm-12 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 100%;
flex-basis: 100%;
padding: 0;
}
}
@media screen and (max-width: 480px) {
.col-xm-1 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 8.3333333333%;
flex-basis: 8.3333333333%;
}
.col-xm-2 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 16.6666666667%;
flex-basis: 16.6666666667%;
}
.col-xm-3 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 25%;
flex-basis: 25%;
}
.col-xm-4 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 33.3333333333%;
flex-basis: 33.3333333333%;
}
.col-xm-5 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 41.6666666667%;
flex-basis: 41.6666666667%;
}
.col-xm-6 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 50%;
flex-basis: 50%;
}
.col-xm-7 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 58.3333333333%;
flex-basis: 58.3333333333%;
}
.col-xm-8 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 66.6666666667%;
flex-basis: 66.6666666667%;
}
.col-xm-9 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 75%;
flex-basis: 75%;
}
.col-xm-10 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 83.3333333333%;
flex-basis: 83.3333333333%;
}
.col-xm-11 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 91.6666666667%;
flex-basis: 91.6666666667%;
}
.col-xm-12 {
box-sizing: border-box;
flex: 0 0 auto;
max-width: 100%;
flex-basis: 100%;
}
}
.headding-wrapper {
text-align: center;
margin-bottom: 41px;
}
.headding-title {
font-family: 'Zen Old Mincho', serif;
font-size: 1.875rem;
color: #3E3E3E !important;
position: relative;
letter-spacing: 0.1em;
padding: 34px 66px;
font-weight: 700;
display: inline-block;
}
.headding-title_black {
font-family: 'Zen Old Mincho', serif;
font-size: 1.875rem;
color: #3E3E3E !important;
position: relative;
letter-spacing: 0.1em;
padding: 34px 66px 14px;
font-weight: 700;
display: inline-block;
}
.subtitle {
font-family: 'Red Rose', cursive;
color: #198B45 !important;
font-size: 1rem;
letter-spacing: 0.1em;
} .under-header-wrapper {
margin-top: 41px;
}
@media screen and (max-width: 760px) {
.headding-title {
font-size: 1.8rem;
padding: 28px 43px;
}
.headding-title_black {
font-size: 1.8rem;
padding: 28px 43px 14px;
}
.subtitle {
font-size: 0.8rem;
}
.under-header-wrapper {
margin-top: 0;
} }
@media screen and (max-width: 480px) {
.headding-title {
padding: 22px 39px;
}
.headding-title_black {
padding: 22px 39px 14px;
}
}
.section {
padding: 89px 0 97px;
}
.section-keyvisual {
padding-bottom: 30px;
background-size: cover;
background-position: center;
}
.section-keyvisual.top-space {
background-image: var(--bg-image-top-space);
}
.section-keyvisual.top-about {
background-image: var(--bg-image-top-about);
}
.container {
max-width: 1250px;
position: relative;
margin: 0 auto;
}
.section-icon {
text-align: center;
padding-bottom: 5px;
}
.section-icon-image {
width: 80%;
}
.primary-container {
padding-top: 27px;
}
@media screen and (max-width: 1280px) {
.container {
max-width: 960px;
}
.section-keyvisual {
padding: 89px 0 115px;
background-position: center;
}
}
@media screen and (max-width: 980px) {
.container {
max-width: 720px;
}
.section-keyvisual {
padding: 89px 0 89px;
background-position: center;
}
}
@media screen and (max-width: 760px) {
.container {
width: 100%;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.section {
padding: 30px 0 79px;
}
.section-keyvisual {
padding: 65px 0 40px;
background-position: center;
}
.section-icon-image {
width: 60%;
}
.concept-item {
margin-left: 10px;
}
}
@media screen and (max-width: 480px) {
.section {
padding: 30px 0 52px;
}
.section-icon-image {
width: 60%;
}
}
.btn {
text-align: center;
margin-top: 85px;
}
.btn-menu {
margin-top: 12px;
}
.btn-link {
display: inline-block;
position: relative;
letter-spacing: 0.1em;
font-size: 1rem;
font-weight: 700;
color: #ae5b2a;
padding: 0 69px 22px 6px;
transition: 0.5s;
}
.btn-link::before {
content: "";
position: absolute;
top: 11px;
right: 5px;
width: 51px;
height: 2px;
background-color: #B18B4F;
transition: 0.5s;
}
.btn-link::after {
content: "";
position: absolute;
top: 5px;
right: 7px;
width: 12px;
height: 13px;
border-top: 2px solid #B18B4F;
transform: rotate(45deg);
transition: 0.5s;
}
.btn-link:hover {
color: #400908;
}
.btn-link:hover::before {
background-color: #a5a3a3;
}
.btn-link:hover::after {
border-top: 2px solid #a5a3a3;
}
.btn-border {
position: absolute;
left: 4px;
bottom: -1px;
width: 239px;
height: 1px;
background-color: #B18B4F;
transition: 0.5s;
}
.btn-link:hover .btn-border {
background-color: #400908;
} .brand-btn {
padding: 30px 0;
margin: 0 auto;
border: 1px solid #000;
color: #000;
text-decoration: none;
position: relative;
transition: 0.3s;
margin-top: 70px;
display: block;
width: 70%;
text-align: center;
}
.brand-btn::before {
content: "";
width: 8px;
height: 8px;
transform: rotate(45deg) scale(1);
-webkit-transform: rotate(45deg) scale(1);
-moz-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
border-top: 1px solid #000;
border-right: 1px solid #000;
position: absolute;
top: 45%;
right: 16%;
}
.brandtop-footer {
padding: 40px 0;
}
.brandtop-footer p {
text-align: center;
}
@media screen and (max-width: 480px) {
.btn {
margin-top: 43px;
}
#content {
margin-top: 0;
padding-top: 0;
}
}
#header {
position: fixed;
top: 0;
width: 100%;
z-index: 100;
font-weight: 500;
}
.header-logo-link {
display: block;
width: 95px;
margin: 19px auto 0;
}
.header-logo-name {
display: block;
text-align: center;
}
.header-link {
display: block;
padding: 16px;
transition: 0.3s;
text-align: center;
width: 160px;
font-weight: bold;
color: #3E3E3E;
}
.header-image {
width: 100%;
}
.header-nav-list {
display: flex;
justify-content: center;
padding: 20px;
}
.header-nav-item {
width: 10%;
}
.header-nav-link {
display: block;
text-decoration: none;
color: #3E3E3E;
text-align: center;
transition: 0.3s;
}
.header-button {
display: flex;
position: absolute;
top: 0;
right: 0;
}
.header-button-image { width: 15px;
height: 15px;
margin-right: 6px;
vertical-align: top;
}
.h-spnavi_btn {
display: none;
top: 7px;
right: 16px;
width: 40px;
height: 50px;
position: absolute;
cursor: pointer;
}
.h-spnavi_btn span {
display: block;
width: 100%;
height: 1px;
background-color: #B18B4F;
position: absolute;
top: 50%;
transition: 0.3s;
}
.h-spnavi_btn span:after,
.h-spnavi_btn span:before {
content: " ";
width: 100%;
height: 1px;
background-color: #B18B4F;
position: absolute;
transition: 0.3s;
}
.h-spnavi_btn span:before {
top: -15px;
}
.h-spnavi_btn span:after {
top: 15px;
}
.h-spnavi_btn.close span {
background: none;
}
.h-spnavi_btn.close span:before {
top: 0;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
}
.h-spnavi_btn.close span:after {
top: 0;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
}
.h-navi_btn {
display: none;
}
@media screen and (max-width: 980px) {
#content {
margin-top: 78px;
padding-top: -78px;
}
.h-spnavi_btn {
display: block;
}
.header-button {
display: none;
}
.header-nav-container {
float: inherit;
display: none;
padding: 0;
overflow: auto;
margin: 30px 0 !important;
background-color: #fff;
}
.header-logo {
width: 65px;
height: auto;
display: block;
}
.header-link {
width: 100%;
}
.header-logo-link {
margin: 0;
width: fit-content;
padding: 5px 0px 10px 16px;
}
.header-logo-wrap {
display: flex;
align-items: center;
}
.header-logo-name {
text-align: left;
margin: 0 0 0 10px;
padding: 5px 40px 10px 0;
}
.header-nav-list {
display: block;
padding: 30px 0 20px;
}
.header-nav-link {
font-size: 1.3rem;
}
.header-nav-item {
width: 100%;
padding-bottom: 30px;
}
.h-navi_btn {
display: block;
}
.topicpath {
display: none;
}
}
footer {
position: relative;
}
.footer-nav {
display: flex;
justify-content: center;
padding: 50px 0 40px;
flex-wrap: wrap;
font-weight: 500;
}
.footer-nav-list {
padding: 0 20px;
border-right: 1px solid #3E3E3E;
}
.footer-nav-link {
color: #3E3E3E;
transition: 0.3s;
}
.footer-logo-image {
width: 10%;
margin: 0 auto;
height: auto;
display: block;
}
.footer-logo {
text-align: center;
}
.sns {
padding-top: 30px;
display: flex;
justify-content: center;
}
.sns-icon {
width: 3%;
margin: 0 7px;
}
.sns-icon img {
width: 100%;
height: auto;
display: block;
}
.footer-copyright {
padding: 10px 0;
}
.copyright {
display: block;
text-align: center;
color: #3E3E3E;
}
.footer-button {
display: none;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 10;
background-color: #a5986f;
}
.footer-item {
width: 50%;
text-align: center;
padding: 20px;
display: flex;
justify-content: center;
align-items: center;
}
.footer-item-image {
width: 20px;
height: 20px;
padding-right: 13px;
}
.footer-item-text {
font-size: 1rem;
font-weight: bold;
color: #111;
}
.modal-container {
padding: 20px;
width: 100%;
max-width: 600px;
box-sizing: border-box;
position: fixed;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #fff;
}
.modal-title {
padding: 50px 0 15px;
font-size: 22px;
line-height: 1.3;
text-align: center;
}
.modal-box {
border-bottom: 1px solid #ddd4b5;
border-top: 1px solid #ddd4b5;
padding: 10px 0;
}
.modal-text {
margin-bottom: 5px;
}
.modal-button {
display: flex;
}
.modal-button-list {
width: 50%;
text-align: center;
padding: 8px;
}
.footer-pagetop { transition: 0.3s;
position: absolute;
right: 80px;
top: 0;
width: 50px;
height: 50px;
z-index: 50;
cursor: pointer;
}  @media screen and (max-width: 980px) {
.footer-button {
display: flex;
}
footer {
margin-bottom: 70px;
padding-bottom: 70px;
}
}
@media screen and (max-width: 760px) {
.footer-nav-list {
margin: 9px 0px;
}
.footer-item-image {
width: 25px;
height: 25px;
margin-right: 9px;
padding-right: 0px;
}
.footer-item-text {
font-size: 0.9rem;
}
.footer-logo-image {
width: 20%;
}
.sns-icon {
width: 7%;
margin: 0 7px;
}
.modal-container {
padding: 10px 15px 0 15px;
width: 80%;
}
.modal-title {
padding: 38px 0 8px;
margin-bottom: 10px;
font-size: 18px;
background-size: 28px auto;
}
.modal-text {
margin-bottom: 3px;
}
}
@media screen and (max-width: 480px) {
.footer-logo-image {
width: 87px;
}
.footer-nav {
padding: 30px 0;
}
.footer-copyright {
padding: 10px 0 0 0;
}
}
.nav-list {
margin-bottom: 30px;
display: flex;
padding-top: 50px;
}
.nav-item {
width: 25%;
}
.nav-link {
position: relative;
display: block;
padding: 12px 5px;
text-align: center;
font-weight: bold;
color: #198B45;
z-index: 2;
}
.nav-link:hover {
color: #198B45;
}
.nav-link.cur:hover {
color: #198B45;
}
.nav-link.cur {
background-color: #198B45; color: #FFFFFF;
}
.nav-link::before {
content: "";
position: absolute;
z-index: -1;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #E3E3E3;
transform: scaleX(0);
transition: transform 0.3s ease-out;
transform-origin: 0 50%;
}
.nav-link:hover::before {
transform: scaleX(1);
}
.slide_show div { width: 100%;
padding: 0 .2vw;
}
.hero {
position: relative;
height: 36vw;
margin-top: 2vw;
}
@media screen and (max-width: 1280px) {
.hero {
position: relative;
height: 36.5vw;
}
}
@media screen and (max-width: 760px) {
.hero {
position: relative;
height: 56.5vw;
}
.slide_show div {
padding: 0;
}
}
@media screen and (max-width: 480px) {
.hero {
height: 145.46vw;
}
.hero-wrapper {
width: 100%;
}
.nav-list {
padding-top: 35px;
}
.nav-link {
font-size: 13px;
}
.slide_show div {
padding: 0;
}
}
#slide_show_sp {
display: none;
}
#slide_show_pc {
display: block;
margin: 0 auto 40px; }
.slide_thumb {
width: 80%;
margin: 0 auto;
text-align: center;
}
.slide_thumb .slick-current .thumb_img {
filter: none;
}
.slide_thumb .slick-track {
-webkit-transform: none !important;
-ms-transform: none !important;
transform: none !important;
}
.thumb_img {
width: 95% !important;
filter: brightness(60%);
}
.thumb_img img {
width: 100%;
}
@media screen and (max-width: 480px) {
#slide_show_sp {
display: block;
margin: 0 auto 20px;
}
#slide_show_pc {
display: none;
}
.slide_thumb {
display: none;
}
}
.space-item {
padding-bottom: 35px;
}
.space-item img {
width: 100%;
height: auto;
display: block;
}
.menu-container {
width: 83%;
margin: 74px auto 0;
padding-bottom: 66px;
}
.menu-wrapper {
width: 90%;
margin: 0 auto;
}
.menu-category {
display: flex;
align-items: center;
font-size: 1.8rem;
padding: 96px 0 65px;
}
.menu-category::before,
.menu-category::after {
border-top: 1px solid;
content: "";
flex-grow: 1;
}
.menu-category::before {
margin-right: 65px;
}
.menu-category::after {
margin-left: 65px;
}
.menu-content {
justify-content: space-between;
padding-bottom: 50px;
}
.menu-image {
width: 39%;
}
.menu-image img {
width: 100%;
height: auto;
display: block;
}
.menu-detail {
width: 58%;
align-self: center;
}
.menu-title {
font-size: 1.25rem;
line-height: 2;
padding-bottom: 12px;
}
.menu-description {
font-size: 0.9375rem;
line-height: 1.6;
padding: 10px 0;
}
.menu-interpolate {
font-size: 15px;
display: inline-block;
margin-top: 35px;
}
.menu-interpolate2 {
font-size: 0.9rem;
display: inline-block;
padding: 15px;
margin-top: 20px;
font-size: 18px;
font-weight: bold;
}
.menu-price {
color: #3E3E3E;
font-size: 20px;
margin: 35px 0;
line-height: 1.6;
}
.bgblack {
background-color: #b18b4f; color: #FFFFFF;
padding: 10px;
}
.about_h3 {
padding: 30px 0;
}
@media screen and (max-width: 760px) {
.menu-category {
padding: 66px 0 51px;
}
.menu-content {
display: block;
}
.menu-image {
width: 100%;
padding-bottom: 30px;
}
.menu-detail {
width: 100%;
}
}
@media screen and (max-width: 480px) {
.menu-content {
padding-bottom: 30px;
}
.menu-container {
width: 100%;
}
.menu-category::before {
margin-right: 34px;
}
.menu-category::after {
margin-left: 34px;
}
.menu-category {
padding: 46px 0 38px;
font-size: 1.6rem;
}
.menu-interpolate2 {
padding: 15px 0;
margin-top: 0;
}
.menu-price {
margin: 0 0 20px;
}
}
.about-item {
padding-bottom: 35px;
}
.about-item img {
width: 100%;
height: auto;
display: block;
}
.news-date {
padding-bottom: 24px;
}
.news-wrapper {
position: relative;
}
.news-wrapper img {
width: 100%;
height: auto;
display: block;
}
.news-title {
position: absolute;
text-align: center;
width: 90%;
bottom: -22px;
right: 18px;
background-color: #F3EDE6;
font-weight: normal;
color: #3E3E3E;
padding: 14px 10px;
line-height: 1.5;
}
@media screen and (max-width: 480px) {
.news-item {
margin-bottom: 50px;
}
}
.coupon-container {
width: 75%;
margin: 0 auto;
}
.coupon-wrapper {
position: relative;
display: flex;
background-color: #F8F8F8;
padding: 46px 41px;
align-items: center;
margin-bottom: 31px;
}
.coupon-wrapper::before {
content: "";
position: absolute;
border-color: #FF564A;
border-style: solid;
border-width: 30px;
border-left-color: transparent;
border-top-color: transparent;
border-right-color: transparent;
top: -30px;
left: -30px;
transform: rotate(-45deg);
}
.coupon-primary {
width: 50%;
padding-right: 49px;
}
.coupon-detail {
width: 50%;
padding: 12px 0 12px 49px;
border-left: 1px solid #000;
}
.coupon-title {
font-size: 135%;
vertical-align: baseline;
color: #000 !important;
}
.coupon-text {
line-height: 2.2em;
letter-spacing: 0.2em;
color: #000 !important;
}
.access-container {
display: flex;
width: 90%;
padding-top: 27px;
margin: 0 auto;
}
.access-detail {
color: #3E3E3E;
width: 50%;
margin: 0 30px;
}
.access-map {
height: 400px;
width: 50%;
margin: 0 30px;
}
.access-map iframe {
width: 100%;
height: 100%;
}
.access-shop-name {
font-size: 1.7rem;
border-bottom: 1px solid #3E3E3E;
padding-bottom: 8px;
}
.access-wrapper {
width: 100%;
}
.access-wrapper a {
color: #3E3E3E;
}
.access-wrapper tbody {
display: block;
}
.access-wrapper tr {
border-bottom: 1px solid #3E3E3E;
padding: 32px 0 3px;
display: flex;
text-align: left;
line-height: 1.4em;
justify-content: space-between;
}
.access-wrapper th {
width: 20%;
}
.access-wrapper td {
width: 70%;
}
@media screen and (max-width: 760px) {
.access-container {
display: block;
width: 100%;
}
.access-detail {
width: 100%;
margin: 0;
padding-bottom: 35px;
}
.access-map {
width: 100%;
margin: 0;
}
}
@media screen and (max-width: 480px) {
.coupon-wrapper {
display: block;
padding: 40px 30px;
}
.coupon-primary {
width: 100%;
padding: 0;
margin-bottom: 18px;
}
.coupon-detail {
width: 100%;
padding: 0;
border-left: none;
}
}
@media screen and (max-width: 760px) {
.under-space-image {
padding-bottom: 30px;
}
}
.under-menu-container {
width: 83%;
margin: 0 auto;
padding-bottom: 66px;
}
.under-menu-wrapper {
margin-top: 80px;
padding: 0 43px 60px;
}
.under-menu-box {
display: flex;
justify-content: space-between;
padding-bottom: 33px;
}
.under-menu-content {
width: 30%;
margin-right: 5%;
}
.under-menu-content:nth-child(3n) {
margin-right: 0;
}
.under-course-wrapper {
margin-top: 84px;
}
.under-course-item {
display: flex;
justify-content: space-between;
}
.under-course-img {
width: 48%;
}
.under-course-detail {
width: 48%;
}
.under-corse-container {
display: flex;
justify-content: space-between;
margin-bottom: 70px;
}
.under-course-interpolate {
display: flex;
border-bottom: 1px solid #b18b4f;
justify-content: space-between;
padding: 20px 15px;
}
.under-course-title {
width: 30%;
}
.under-course-text {
width: 60%;
line-height: 1.6;
}
.under-course-explain {
width: 48%;
margin-top: 20px;
}
.under-course-content {
width: 48%;
}
.under-food-wrapper {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
padding: 30px 40px 0 30px;
}
.under-food-detail {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.under-menu-detail {
padding: 25px 0;
}
.under-menu-detail-heading {
font-size: 1.2rem;
padding-bottom: 30px;
}
.under-menu-detail-price {
color: #FF564A;
}
.under-course-box {
padding: 20px;
border: solid 1px #b18b4f;
}
.under-course-box p {
line-height: 1.6;
}
.under-food-item-heading {
font-size: 22px;
border-left: solid 8px #b18b4f;
border-bottom: solid 1px #b18b4f;
padding: 0 0 5px 23px;
}
.under-food-list {
color: #400908;
padding: 20px 50px;
}
.under-food-item {
margin: 30px 0 100px 0;
}
.under-food-detail-item {
padding: 15px 0;
border-bottom: solid 1px;
width: 48%;
}
.under-food-name {
font-size: 18px;
font-weight: bold;
padding: 8px 0;
}
.under-food-price {
font-size: 14px;
margin-top: 2px;
color: #d33c33;
}
@media screen and (max-width: 760px) {
.under-menu-box {
display: block;
}
.under-menu-content {
width: 100%;
margin-right: 0;
}
.under-menu-container {
width: 100%;
}
.under-menu-wrapper {
padding: 0 15px 60px;
width: 100%;
}
.under-course-item {
display: block;
}
.under-corse-container {
display: block;
}
.under-course-img {
width: 100%;
}
.under-course-detail {
width: 100%;
}
.under-course-explain {
width: 100%;
}
.under-course-content {
width: 100%;
}
.under-food-wrapper {
display: block;
padding: 25px 25px 0;
}
.under-food-detail {
display: block;
}
.under-food-detail-item {
width: 100%;
}
.under-menu-detail-heading {
padding-bottom: 30px;
}
.under-food-list {
padding: 1px 25px;
}
.under-menu-detail-heading {
padding-bottom: 15px;
}
.under-food-item {
margin: 30px 0 60px 0;
}
}
.access-under-wrapper {
width: 50%;
margin: 0 auto;
padding-top: 54px;
}
.access-under-title {
font-size: 1.7rem;
padding-bottom: 17px;
border-bottom: 1px solid #3E3E3E;
}
.access-under-item {
padding: 20px 0;
border-bottom: 1px solid #3E3E3E;
}
.access-under-name {
width: 20%;
line-height: 1.5;
}
.access-under-detail {
width: 80%;
line-height: 1.5;
}
.m-access_map {
height: 400px;
}
.m-access_map iframe {
width: 100%;
height: 100%;
}
@media screen and (max-width: 760px) {
.access-under-wrapper {
width: 100%;
}
.single-news-image {
width: 80% !important;
}
.single-news-container {
width: 80% !important;
}
}
.under-news-wrapper {
margin-top: 20px;
}
.under-news-link {
display: flex;
margin-top: 60px;
}
.under-news-image {
width: 15%;
}
.under-news-content {
width: 85%;
padding: 24px 34px;
}
.under-news-date {
color: #3E3E3E;
padding-bottom: 16px;
}
.under-news-title {
font-size: 1.6rem;
padding-bottom: 8px;
line-height: 1.5;
}
.under-news-text {
line-height: 1.5em;
}
.m-pager {
margin-top: 10px;
}
.pagenation {
margin-top: 40px;
text-align: center;
}
.pagenation li {
display: inline-block;
}
.pagenation-prev {
width: 40px;
height: 40px;
}
.single-news-image {
width: 50%;
margin: 0 auto;
}
.single-news-container {
width: 50%;
margin: 0 auto;
}
.single-news-container p {
line-height: 1.5;
}
.single-news-title {
font-size: 1.6rem;
padding-top: 15px;
line-height: 1.5;
}
.single-news-date {
font-size: 1.6rem;
padding: 15px 0;
}
@media screen and (max-width: 760px) {
.under-news-link {
display: block;
}
.under-news-image {
width: 50%;
margin: 0px auto;
padding-top: 10px;
}
.under-news-content {
width: 100%;
}
}
.brand-logo {
max-width: 300px;
margin: 0 auto;
width: 70%;
}
.brand-logo img {
width: 100%;
height: auto;
display: block;
}
.brand-shopname {
font-size: 1.5rem;
font-weight: 700;
border-bottom: 2px solid #000000;
padding-bottom: 10px;
margin-top: 20px;
color: #000;
}
.brand-access {
margin-top: 20px;
}
.brand-access dl {
width: 100%;
font-size: 16px;
margin-top: 20px;
display: flex;
justify-content: space-between;
}
.brand-access dt {
width: 20%;
color: #000;
}
.brand-access dd {
width: 70%;
line-height: 1.4em;
color: #000;
}
.brand-access dd div {
color: #000;
}
.undifine-wrappewr {
padding: 100px 0;
text-align: center;
}
.undifine-wrappewr p {
color: #000;
}
.undifine-wrappewr h1 {
padding: 40px 0;
font-size: 2rem;
color: #000;
} .footer_bnr_wrap {
display: flex;
justify-content: center;
align-items: center;
padding-top: 70px;
}
.footer_bnr_wrap>a {
margin: 0 10px;
}
#video_btn.playActive {
display: none;
}
@media screen and (max-width: 760px) {
.footer_bnr_wrap {
flex-direction: column;
}
.footer_bnr_wrap>a {
width: 80%;
margin: 10px 0;
}
} .video_wrap {
margin: 30px auto 100px;
text-align: center;
width: 40%;
height: auto;
position: relative;
}
.video {
width: 100%;
height: auto;
}
.video_btn {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 40px;
cursor: pointer;
z-index: 2;
}
#video_btn img {
width: 16%;
top: 0;
bottom: 0;
position: absolute;
right: 0;
left: 0;
margin: auto;
}
.banner-wrap {
width: 100%;
margin: 0 auto;
text-align: center;
}
.link-banner {
display: inline-block;
padding-top: 30px;
}
@media screen and (max-width: 760px) {
.video_wrap {
width: 90%;
}
.video {
width: 90%;
height: auto;
}
#video_btn img {
width: 15%;
}
.banner-wrap {
width: 90%;
}
.link-banner {
display: inline-block;
padding-top: 15px;
}
} .food-at {
text-align: right;
font-size: 14px;
line-height: 1.5;
}
@media screen and (max-width: 760px) {
.food-at {
text-align: left;
}
} .mv-movie {
position: relative;
height: 55.55vw;
overflow: hidden;
text-align: center;
color: #fff;
} .mv-movie #youtubeMV {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
z-index: 1;
} .movie-sub-wrap {
padding: 0 15px;
margin-top: 60px;
}
.movie-sub {
margin: 0 auto;
max-width: 850px;
position: relative;
height: 52vw;
max-height: 480px;
overflow: hidden;
text-align: center;
color: #fff;
} #movieSubMV {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
z-index: 1;
}
@media screen and (max-width: 760px) {
.movie-sub-wrap {
margin-top: 30px;
}
} .shop-wrapper {
flex-wrap: wrap;
display: flex;
gap: 20px;
justify-content: space-between;
width: 95%;
margin: 0 auto;
}
.shop-list {
width: 48%;
padding-bottom: 70px;
}
@media screen and (max-width: 760px) {
.shop-list {
width: 100%;
}
}