@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Shippori+Mincho:wght@500;700&display=swap');
html {
 font-size: 62.5%;
}
body {
 font-family: "Helvetica Neue", "Noto Sans JP", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
 letter-spacing: 0.05em;
 font-weight: 400;
 color: #241C1C;
 font-size: 1.6rem;
 line-height: 1.7;
 overflow-x: clip;
}
a {
 display: block;
 transition: .2s;
 text-decoration: none;
 color: #e62310;
}
img {
 display: block;
 width: 100%;
 height: auto;
 /*pointer-events: none;*/
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -moz-touch-callout: none;
 -moz-user-select: none;
 user-select: none;
 /*image-rendering: -webkit-optimize-contrast;*/
}
em {
 display: inline-block;
 font-size: 80%;
 font-weight: inherit;
}
span {
 font-weight: inherit;
}
.rTxt {
 text-align: right;
}
.caution {
 padding-top: 1em;
 font-size: 1.2rem;
 line-height: 1.5;
}
ul.caution li {
 text-indent: -1em;
 padding-left: 1em;
}
.tCenter {
 text-align: center;
}
.sp {
 display: none !important;
}
.pc {
 display: block;
}
#wrapper {
 position: relative;
 overflow: hidden;
 height: 100%;
}
#wrapper.filter:after {
 content: "";
 display: block;
 height: 100%;
 width: 100%;
 position: fixed;
 top: 0;
 left: 0;
 background: rgba(0, 0, 0, 0.25);
 z-index: 49;
}
aside {
 position: fixed;
 width: 30rem;
 height: 100%;
 background: #fff100;
 background-image: linear-gradient(0deg, rgba(0, 173, 236, 1) 0%, rgba(255, 244, 85, 1) 60%);
 z-index: 101;
 overflow-y: scroll;
 -ms-overflow-style: none;
 scrollbar-width: none;
 left: 0;
 top: 0;
 padding-bottom: 2rem;
 transition: .3s;
}
aside:-webkit-scrollbar {
 display: none;
}
aside:before {
 content: "";
 display: block;
 background: url("../images/texture.jpg") repeat;
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: calc(100% + 3.5em);
 mix-blend-mode: multiply;
 pointer-events: none;
}
main {
 position: relative;
 width: calc(100% - 30rem);
 margin-left: 30rem;
 overflow: hidden;
}
aside .logo {
 padding: 1rem;
 position: relative;
 z-index: 5;
}
aside h1 {
 border-radius: 1.0rem;
 position: relative;
}
aside h1:before {
 content: "";
 display: block;
 padding-top: 100%;
}
aside h1 img {
 width: 74%;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
}
aside .utilityArea {
 padding: 0 2rem 0 0;
 position: relative;
 z-index: 5;
}
aside .utilityArea .box {
 background: #fff;
 border-radius: 0 1.2rem 1.2rem 0;
 padding: 2rem 1.5rem 2rem 2.5rem;
 max-height: 66.666vh;
 overflow-y: scroll;
 -ms-overflow-style: none;
 scrollbar-width: none;
}
aside .utilityArea .box:-webkit-scrollbar {
 display: none;
}
aside .utilityArea .box .date {
 display: flex;
 align-items: center;
 justify-content: space-between;
}
aside .utilityArea .box .date .today {
 line-height: 1;
 letter-spacing: 0.025em;
 font-size: 1.8rem;
 font-family: Arial, Helvetica, "sans-serif";
 white-space: nowrap;
}
aside .utilityArea .box .date .today small {
 font-size: 90%;
 position: relative;
 display: block;
 color: #636363;
 padding-bottom: 0.2em;
}
aside .utilityArea .box .date .today small:after {
 content: "年";
 font-size: 60%;
 font-weight: bold;
}
aside .utilityArea .box .date .today span {
 font-size: 200%;
 font-weight: bold;
 white-space: nowrap;
 position: relative;
 letter-spacing: 0;
}
aside .utilityArea .box .date .today span.m:after {
 content: "月";
 font-size: 40%;
 padding-right: 0.075em;
}
aside .utilityArea .box .date .today span.d:after {
 content: "日";
 font-size: 40%;
}
aside .utilityArea .box .date .today em {
 font-size: 50%;
 color: #636363;
 position: relative;
 transform: translateX(-0.25em)translateY(-0.15em);
}
aside .utilityArea .box .date .today em:before {
 content: "(";
}
aside .utilityArea .box .date .today em:after {
 content: ")";
}
aside .utilityArea .box .date .weather {
 display: block;
 text-align: center;
 flex: 1 0 60px;
 max-width: 60px;
 transform: translateY(-0.2em);
}
aside .utilityArea .box .date .weather .icon {}
aside .utilityArea .box .date .weather .temp {
 position: relative;
 color: #DE4527;
 line-height: 1;
 display: block;
 font-size: 1.5rem;
}
aside .utilityArea .box .date .weather .temp:after {
 content: "℃";
 font-size: 80%;
}
aside .utilityArea .box .newsTopics {
 font-size: 1.3rem;
}
aside .utilityArea .box .newsTopics h3 {
 font-weight: 500;
 font-size: 1.3rem;
 letter-spacing: 0.05em;
 margin: 0.75em 0 0.5em;
 background: #efefef;
 background: #e62310;
 color: #fff;
 line-height: 1.2;
 padding: 0.5em 0.75em;
}
aside .utilityArea .box .newsTopics ul {
 font-size: 1.3rem;
}
aside .utilityArea .box .newsTopics ul li {
 font-size: 1.3rem;
 font-weight: 800;
 margin-top: 0.25em;
 position: relative;
}
aside .utilityArea .box .newsTopics ul li a {
 color: #1c1c1c;
 position: relative;
 font-weight: 500;
}
aside .utilityArea .box .newsTopics ul li a:before {
 content: "";
 display: block;
 width: 0;
 height: 0.75em;
 background: #FFD667;
 position: absolute;
 bottom: 0;
 left: 0;
 transition: 0.2s;
}
aside .utilityArea .box .newsTopics ul li a:hover:before {
 width: 100%;
}
aside .utilityArea .box .newsTopics ul.newsList li {
 line-height: 1.4;
 display: block;
 position: relative;
 padding: 0.25em 0;
}
aside .utilityArea .box .newsTopics ul.newsList li:after {
 content: "";
 display: block;
 width: 100%;
 height: 1px;
 background: #cecece;
 position: absolute;
 left: 0;
 right: 0;
 bottom: 0;
}
aside .utilityArea .box .newsTopics ul.newsList li:last-child:after {
 display: none;
}
aside .utilityArea .box .newsTopics ul.newsList li a {
 pointer-events: none;
 display: inline-block;
 vertical-align: bottom;
}
aside .utilityArea .box .newsTopics ul li dl {
 display: flex;
 position: relative;
 z-index: 5;
}
aside .utilityArea .box .newsTopics ul li dl dt {
 white-space: nowrap;
 padding-right: 0.75em;
}
aside .utilityArea .box .newsTopics ul li dl dd {
 font-weight: 500;
}
aside .utilityArea .box .newsTopics .link {
 padding-top: 0.5em;
}
aside .utilityArea .box .newsTopics .link div {
 font-size: 1.3rem;
 font-weight: bold;
 white-space: nowrap;
 text-align: center;
 margin-bottom: 2px;
}
aside .utilityArea .box .newsTopics .link div a {
 color: #fff;
 background-color: #1B73AD;
 display: block;
 padding: 0.25em 1em 0.25em 0;
 letter-spacing: 0.025em;
 position: relative;
 font-size: 90%;
}
aside .utilityArea .box .newsTopics .link div.shops a {
 background-color: #7DCA16;
}
aside .utilityArea .box .newsTopics .link div a:before {
 content: "";
 display: inline-block;
 width: 5px;
 height: 5px;
 border-top: 2px solid #fff;
 border-right: 2px solid #fff;
 transform: rotate(45deg)translateY(-50%);
 position: absolute;
 top: calc(50% - 1px);
 right: 1.25em;
}
section {
 position: relative;
 z-index: 5;
 padding: calc(7.5vw + 10rem) 5% 7.5vw;
}
.inner {
 position: relative;
 z-index: 5;
 max-width: 1280px;
 margin: 0 auto;
}
.pageHeader {
 width: 100vw;
 margin: 10rem calc(50% - 50vw) 0;
 position: relative;
 padding: 10vw 5vw;
 text-align: center;
 background: #e62310;
 color: #fff;
 z-index: 6;
}
.pageHeader:before {
 content: "";
 display: block;
 background: url(../images/texture.jpg) repeat;
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 mix-blend-mode: multiply;
 pointer-events: none;
 opacity: 0.5;
}
.pageHeader:after {
 content: "";
 display: block;
 background: rgba(0, 0, 0, 0.4);
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 pointer-events: none;
 z-index: 1;
}
.pageHeader .pageTtl {
 font-size: 4rem;
 font-weight: 800;
 line-height: 1;
 position: relative;
 z-index: 5;
}
.bgGradation {
 position: relative;
 width: 100vw;
 height: 100vh;
 overflow: hidden;
}
.bgGradation > video {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translateX(-50%) translateY(-50%);
 min-width: 100%;
 min-height: 100%;
}
.breadcrumbs {
 margin-top: -2rem;
 padding: 0 0 4rem;
 position: relative;
}
.breadcrumbs ul.breadcrumb {
 display: flex;
 white-space: nowrap;
 overflow-x: scroll;
 -ms-overflow-style: none;
 scrollbar-width: none;
}
.breadcrumbs ul.breadcrumb:-webkit-scrollbar {
 display: none;
}
.breadcrumbs ul.breadcrumb li {
 display: inline-block;
}
.breadcrumbs ul.breadcrumb li a {
 color: rgba(0, 0, 0, 0.55);
 padding: 0 0.5em;
 box-sizing: border-box;
 display: inline-block;
 white-space: nowrap;
}
.breadcrumbs ul.breadcrumb li:last-child {
 padding: 0 0 0 0.5em;
}
.breadcrumbs ul.breadcrumb li:first-child a {
 padding: 0 0.5em 0 0;
}
.breadcrumbs .breadInner a:hover {
 color: #b72a2a;
}
.waku {
 display: none;
}
.secTtl {
 font-weight: 400;
 font-style: normal;
 font-size: 4rem;
}
.secTtl span {
 display: block;
 font-weight: 700;
 font-size: 60%;
 line-height: 1;
 letter-spacing: 0.1em;
 white-space: nowrap;
}
.secTtl em {
 display: block;
 font-size: 100%;
 letter-spacing: 0.025em;
 font-weight: 700;
 white-space: nowrap;
}
.wideTtl {
 width: 100vw;
 text-align: center;
 display: block;
 margin: 5vw calc(50% - 50vw) 2.5em;
 position: relative;
 z-index: 10;
}
.wideTtl span {
 font-size: 2.3rem;
 font-weight: bold;
 line-height: 1.2;
 padding: 1em 1.5rem;
 background: #e62310;
 color: #fff;
 display: block;
 position: relative;
}
.wideTtl span:after {
 content: "";
 display: block;
 background: url(../images/texture.jpg) repeat;
 background-size: 100% auto;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 mix-blend-mode: color-burn;
 pointer-events: none;
 opacity: 0.7;
}
header {
 /*background: #fef102;*/
 background: #fff;
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 z-index: 100;
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 0 5%;
 height: 10rem;
 box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
 /*border-bottom: solid 2px #000723;*/
}
header .sns {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 z-index: 2;
}
header .sns li {
 position: relative;
 margin-left: 1.2em;
}
header .sns li.tiktok {
 margin-left: 0.8em;
}
header .sns li:first-child {
 margin-left: 0;
}
header .sns li a {
 position: relative;
 height: 1.8em;
 width: 1.8em;
 display: block;
}
header .sns li.x a {
 background: url("../images/sns/icon_x_bk.svg") no-repeat center center;
 background-size: 90% auto;
}
header .sns li.instagram a {
 background: url("../images/sns/icon_istg_bk.svg") no-repeat center center;
 background-size: 100% auto;
}
header .sns li.facebook a {
 background: url("../images/sns/icon_facebook_bk.svg") no-repeat center center;
 background-size: 100% auto;
}
header .sns li.tiktok a {
 background: url("../images/sns/icon_tt_bk.svg") no-repeat center center;
 background-size: auto 100%;
}
header .utility .sns li.x a {
 background: url("../images/sns/icon_x.svg") no-repeat center center;
 background-size: 90% auto;
}
header .utility .sns li.instagram a {
 background: url("../images/sns/icon_istg.svg") no-repeat center center;
 background-size: 100% auto;
}
header .utility .sns li.facebook a {
 background: url("../images/sns/icon_facebook.svg") no-repeat center center;
 background-size: 100% auto;
}
header .utility .sns li.tiktok a {
 background: url("../images/sns/icon_tt.svg") no-repeat center center;
 background-size: auto 100%;
}
header h1 {
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
 z-index: 1;
 text-align: center;
 display: block;
 height: 8rem;
}
header h1 a {
 display: inline-block;
 height: 100%;
 width: auto;
}
header h1 img {
 height: 100%;
 width: auto;
 display: inline-block;
}
header .utility {
 position: relative;
 display: flex;
 align-items: center;
 justify-content: flex-end;
 z-index: 2;
}
header .utility #language {
 width: 1.6em;
 background: url("../images/icon_language_bk.svg?0502") no-repeat center center #fff;
 background-size: auto 100%;
 padding-top: calc(1.6em * 1.293);
 margin-right: 1.4em;
 display: block;
 cursor: pointer;
 position: relative;
}
header #langSelect {
 position: fixed;
 z-index: 2000;
 text-align: right;
 right: -100%;
 transition: .3s;
 top: 8rem;
}
header #langSelect.open {
 display: block;
 right: 0;
}
header #langSelect ul {
 background: #fff;
 padding: 1em 1.5em 0.5em;
 display: inline-block;
 position: relative;
 border-radius: 1.0rem 0 0 1.0rem;
 overflow: hidden;
 border-top: solid 2px #e62310;
 border-left: solid 2px #e62310;
 border-bottom: solid 2px #e62310;
}
header #langSelect ul li {
 display: inline-block;
 position: relative;
}
header #langSelect ul li a {
 font-size: 1.5rem;
 color: #e62310;
 font-weight: 500;
 line-height: 1.2;
}
header #langSelect ul li a:after {
 content: "/";
 display: inline-block;
 padding: 0 0.5em;
}
header #langSelect ul li:last-child a:after {
 display: none;
}
header .utility .hamburger {
 position: relative;
 cursor: pointer;
 width: 32px;
 height: 26px;
 z-index: 2001;
 display: block;
}
header .utility .hamburger span {
 transition: all .3s;
 position: absolute;
 height: 3px;
 background-color: #000;
 width: 100%;
 z-index: 10;
}
header .utility .hamburger span:nth-of-type(1) {
 top: 3px;
}
header .utility .hamburger span:nth-of-type(2) {
 top: 12px;
}
header .utility .hamburger span:nth-of-type(3) {
 top: 21px;
}
header .utility .hamburger.open span:nth-of-type(1) {
 top: 6px;
 transform: translateY(6px) rotate(-42deg);
}
header .utility .hamburger.open span:nth-of-type(2) {
 opacity: 0;
}
header .utility .hamburger.open span:nth-of-type(3) {
 top: 18px;
 transform: translateY(-6px) rotate(42deg);
}
header nav#header-menu {
 position: fixed;
 z-index: 2000;
 text-align: right;
 right: -100%;
 transition: .3s;
 top: 11rem;
}
header nav#header-menu.open {
 display: block;
 right: 0;
}
header nav#header-menu .menu {
 background: #e62310;
 padding: 3em;
 display: inline-block;
 position: relative;
 border-radius: 1.0rem 0 0 1.0rem;
 overflow: hidden;
}
header nav#header-menu .menu:before {
 content: "";
 display: block;
 background: url("../images/texture.jpg") repeat;
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 mix-blend-mode: multiply;
 pointer-events: none;
 opacity: 0.5;
}
header nav#header-menu .menu ul {
 position: relative;
 z-index: 5;
}
header nav#header-menu .menu ul li {
 margin-bottom: 1.25em;
}
/*header nav#header-menu .menu ul li:nth-child(6) {
 display: none;
}*/
header nav#header-menu .menu ul li:last-child {
 margin-bottom: 0;
}
header nav#header-menu .menu ul li a {
 font-size: 1.8rem;
 font-weight: 800;
 color: #fff;
}
header nav#header-menu .menu ul li a img {
 max-width: 20rem;
}
header nav#header-menu .menu ul.sns {
 justify-content: flex-end;
 padding-top: 2em;
}
header nav#header-menu .menu ul.sns li {
 margin-bottom: 0;
}
header nav#header-menu .menu ul.sns li:last-child {
 margin-left: 0.8em;
}
#news {
 background: #119BCD;
 color: #fff;
 padding: 5vw;
 overflow: hidden;
}
#news:before {
 content: "";
 display: block;
 background: url("../images/texture.jpg") repeat;
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 mix-blend-mode: multiply;
 pointer-events: none;
 opacity: 0.5;
}
#news .inner {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
}
#news .inner .secTtl {
 flex: 1 0 24rem;
 max-width: 24rem;
 text-align: left;
}
#news .inner .secTtl span {
 color: #119BCD;
 text-shadow: 2px 2px 0 #fff, -2px -2px 0 #fff, -2px 2px 0 #fff, 2px -2px 0 #fff, 0px 2px 0 #fff, 0-2px 0 #fff, -2px 0 0 #fff, 2px 0 0 #fff;
}
#news .inner .secTtl em {
 text-shadow: 2px 3px 0 rgba(8, 103, 118, 0.70);
}
#news .inner .newsList {
 flex: 1 0 calc(100% - 24rem);
 max-width: calc(100% - 24rem);
 padding-left: 5rem;
}
#news .inner .newsList ul li {
 margin-bottom: 1em;
}
#news .inner .newsList ul li:last-child {
 margin-bottom: 0;
}
#news .inner .newsList ul li dl {
 position: relative;
}
#news .inner .newsList ul li dl dt {
 letter-spacing: 0.1em;
 line-height: 1.6;
 position: relative;
 font-weight: 500;
 font-size: 1.7rem;
}
#news .inner .newsList ul li dl dt .new, #news .postArea .postInfo .date .new {
 display: block;
 position: absolute;
 left: -4.5em;
 top: 0;
 color: #fff;
 background: #e62310;
 line-height: 1.2;
 font-size: 80%;
 padding: 0.15em 0.45em;
 transform: translateY(3px);
}
#news .postArea .postInfo .date .new {
 position: relative;
 left: 0;
 display: inline-block;
 transform: translateY(-2px);
 margin-right: 0.75em;
 padding: 0.15em 0.45em 0.1em;
}
#news .inner .newsList ul li dl dt span {
 display: inline-block;
 margin-left: 0.5em;
 transform: translateY(-2px);
}
#news .inner .newsList ul li dl dt span em.cate {
 display: inline-block;
 font-weight: 700;
 font-size: 1.2rem;
 line-height: 1;
 padding: 0.4em 0.5em 0.25em;
 border-radius: 4px;
 margin: 0 0.5em 0.25em 0;
 color: #119BCD;
 background: #fff;
}
#news .inner .newsList ul li dl dd {
 font-size: 1.5rem;
 border-bottom: dashed 1px rgba(255, 255, 225, 0.3);
 padding-bottom: 1em;
}
#news .inner .newsList ul li:last-child dl dd {
 border-bottom: none;
 padding-bottom: 0;
}
#news .inner .newsList ul li dl dd strong {
 font-weight: 800;
 display: inline-block;
 font-size: 110%;
}
#news .inner .newsList ul li dl dd a {
 display: inline-block;
 vertical-align: bottom;
 color: #fff;
 position: relative;
 text-decoration: underline;
}
#news .inner .newsList ul li dl dd a:hover {
 text-decoration: none;
}
#news .inner .newsList ul li dl dd a[target="_blank"]:after {
 content: "";
 display: inline-block;
 background: url("../images/icon_blank.svg") no-repeat;
 background-size: auto 100%;
 height: 1.3em;
 width: 1.3em;
 transform: translateY(2px);
 margin-left: 0.25em;
 opacity: 0.85;
 transition: .2s;
}
#news .inner .newsList ul li dl dd a[target="_blank"]:hover:after {
 opacity: 1;
}
#news .inner .toBtn {
 position: relative;
 text-align: right;
 margin: 2em auto -2em;
}
#payment {
 margin: 5vw auto;
}
#payment > h3 {
 font-size: 2.2rem;
 font-weight: bold;
 background: #0972C9;
 color: rgba(255, 244, 85, 1);
 text-align: center;
 line-height: 1.5;
 padding: 1.5em;
 border-radius: 1rem 1rem 0 0;
}
#payment .box {
 background: #fff;
 background: rgba(255, 255, 255, 1);
 padding: 4vw;
 border-radius: 0 0 1rem 1rem;
 position: relative;
 text-align: center;
}
#payment .box p {
 line-height: 2;
}
#payment .box p strong {
 text-decoration: rgba(255, 144, 85, 1) wavy underline;
}
#payment .box h4 {
 font-weight: bold;
 font-size: 2rem;
 margin: 2.0em 0 0;
}
#payment .box h5 {
 font-weight: bold;
 margin: 1.85em 0 1.75em;
 font-size: 2rem;
 padding: 1em 1.5rem;
 border: solid 1px #cfcfcf;
 background: rgba(150, 150, 170, 0.1);
 line-height: 1.2;
}
#payment .box .possible {
 display: flex;
 align-items: center;
 justify-content: center;
 flex-wrap: wrap;
 margin-bottom: 1em;
}
#payment .box .possible li {
 margin: 0 0.75em;
 height: 5rem;
 display: block;
 text-align: center;
}
#payment .box .possible li.visa {
 height: 3.2rem;
}
#payment .box .possible li.amex {
 height: 6.0rem;
}
#payment .box .possible li.unionpay {
 height: 6.0rem;
}
#payment .box .possible li.dpay {
 height: 6.0rem;
}
#payment .box .possible li.paypay {
 margin: 0;
}
#payment .box .possible li.applepay {
 height: 4.5rem;
}
#payment .box .possible li.googlepay {
 height: 4.5rem;
}
#payment .box .possible li.merupay {
 height: 7.0rem;
}
#payment .box .possible li.yuchopay {
 height: 7.0rem;
}
#payment .box .possible li.bankpay {
 height: 4.5rem;
}
#payment .box .possible li.wecahtpay {
 height: 4.5rem;
}
#payment .box .possible li.trafic {
 height: auto;
 width: 100%;
 margin: 1em auto 0;
}
#payment .box .possible li img {
 height: 100%;
 width: auto;
 display: inline-block;
}
#payment .box .possible li.trafic img {
 width: 30em;
 height: auto;
}
#payment .box dl {
 margin: 2.5em 0 0;
}
#payment .box dl dt {
 font-size: 1.7rem;
 min-width: 25em;
 font-weight: bold;
 position: relative;
 padding: 1em 2.4em;
 line-height: 1.2;
 margin-bottom: 1.25em;
 display: inline-block;
 background: #ecf2e7;
 color: #2d4b41;
 border-radius: 20rem;
}
#payment .box .caution {
 font-size: 1.2rem;
 padding: 0.75em 0 1em;
}
#payment .box .note {
 color: #6c6c6e;
 font-size: 1.4rem;
 background: rgba(235, 235, 238, 0.8);
 display: block;
 padding: 2em;
 border-radius: 1rem;
 margin: 2.5em auto 0;
 text-align: center;
}
#payment .box .note > ul {
 display: inline-block;
 text-align: left;
}
#payment .box .note > ul > li {
 text-indent: -0.7em;
 padding-left: 0.7em;
 line-height: 1.5;
 margin-bottom: 0.5em;
}
#payment .box .note > ul > li:last-child {
 margin-bottom: 0;
}
.btnBack a {
 color: rgb(255, 255, 255);
 display: inline-block;
 text-align: center;
 font-size: 1.7rem;
 line-height: 1.2;
 position: relative;
 box-shadow: rgba(0, 0, 0, 0.3) 5px 5px 0px;
 background: rgb(54, 54, 56);
 padding: 0.75em 3.5em 0.75em 2.5em;
}
.btnBack a:before {
 content: "";
 display: inline-block;
 width: 6px;
 height: 6px;
 transform: rotate(45deg) translateY(-50%);
 position: absolute;
 top: calc(50% - 1px);
 right: 1.25em;
 border-top: 3px solid rgb(255, 255, 255);
 border-right: 3px solid rgb(255, 255, 255);
 transition: 0.2s;
}
.btnBack a:hover {
 box-shadow: 0px 0px 0 rgba(0, 0, 0, 0.3);
 background-color: #FF811F;
}
.btnBack a:hover:before {
 right: 1em;
}
#support {
 position: relative;
 z-index: 6;
 background: #fff;
 padding: 5vw;
 text-align: center;
}
#support:before {
 content: "";
 display: block;
 background: url("../images/line.png") repeat-x;
 background-size: auto 100%;
 height: 4px;
 width: 100vw;
 position: absolute;
 top: -4px;
 left: 0;
 z-index: 3;
}
#support h3 {
 font-size: 1.7rem;
 font-weight: 800;
 margin: 2.5em 0 0;
}
#support h3:first-of-type {
 margin: 0;
}
#support ul {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 justify-content: center;
 text-align: center;
 font-size: 0;
 letter-spacing: -0.4em;
}
#support ul li {
 margin: 3.0rem 1.75rem 0;
 color: #4c4c4c;
 font-size: 2.7rem;
}
#support ul .osakashi {
 font-size: 5.5rem;
}
#support ul.txt li a {
 color: #4c4c4c;
 height: auto;
 display: block;
}
#support ul li a {
 display: block;
 height: 5.5rem;
 width: auto;
}
#support ul li.suntory a {
 height: 5.5rem;
}
#support ul li.ajinomoto a {
 height: 8.75rem;
 margin: 3.5rem 2.5rem 0;
}
#support ul li.nishiorent a {
 height: 6rem;
 margin: 3.5rem 2.5rem 0;
}
#support ul li.withal a {
 height: 7.0rem;
}
#support ul li.lbb a {
 height: 3.2rem;
}
#support ul li.saraya a {
 height: 4.5rem;
}
#support ul li.bsk a {
 height: 7.0rem;
}
#support ul li.premiumwater a {
 height: 4.5rem;
}
#support ul li.okura a {
 height: 4.0rem;
}
#support ul li.smbc a {
 height: 3.0rem;
}
#support ul li.technics a {
 height: 4.5rem;
 transform: translateY(-0.15em);
}
#support ul li img {
 height: 100%;
 width: auto;
}
footer {
 position: relative;
 z-index: 6;
 padding: 5vw 5vw 3.5vw;
 background: #b72a2a;
 color: #fff;
 text-align: center;
 font-size: 1.4rem;
}
footer:before {
 content: "";
 display: block;
 background: url("../images/line.png") repeat-x;
 background-size: auto 100%;
 height: 4px;
 width: 100vw;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 3;
}
footer:after {
 content: "";
 display: block;
 background: url("../images/zara.png") no-repeat;
 background-size: cover;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 opacity: 0.5;
 pointer-events: none;
 mix-blend-mode: overlay;
}
footer .contact ul.flex {
 display: flex;
 align-items: stretch;
 justify-content: center;
 flex-wrap: wrap;
 text-align: center;
}
footer .contact ul.flex > li {
 padding: 0 1.5em 1.5em;
 position: relative;
 flex: 1 0 25%;
}
footer .contact h3 {
 font-weight: 800;
 margin-bottom: 1em;
 font-size: 110%;
 display: inline-block;
}
footer .contact h3:before {
 content: "■";
 padding-right: 0.35em;
}
footer .contact > ul {
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 1.3rem;
}
footer .contact > ul > li ul li {
 margin: 0.25em 0 0;
 opacity: 0.8;
}
footer .contact > ul > li ul li a {
 color: #fff;
 text-decoration: none;
 display: inline-block;
 vertical-align: bottom;
 font-weight: bold;
}
footer .contact > ul > li ul li a:hover {
 color: #ffbc46;
}
footer .sns ul {
 display: flex;
 align-items: center;
 justify-content: center;
 margin-top: 4.5rem;
}
footer .sns ul li {
 flex: 1 0 2.4rem;
 max-width: 2.4rem;
 margin: 0 0.75em;
}
footer .cr {
 margin-top: 2.5em;
 font-size: 1.2rem;
}
.spNav {
 display: none;
}
.mfp-bg {
 opacity: 0;
 -webkit-transition: all 0.15s ease-out;
 -moz-transition: all 0.15s ease-out;
 transition: all 0.15s ease-out;
 overscroll-behavior: contain !important;
 overscroll-behavior-y: contain !important;
}
.mfp-bg.mfp-ready {
 opacity: 0.8;
}
.mfp-bg.mfp-removing {
 opacity: 0;
}
.mfp-wrap .mfp-content {
 opacity: 0;
 -webkit-transition: all 0.15s ease-out;
 -moz-transition: all 0.15s ease-out;
 transition: all 0.15s ease-out;
}
.mfp-wrap.mfp-ready .mfp-content {
 opacity: 1;
 max-width: 80rem;
 margin: 0 auto;
}
.mfp-wrap.mfp-removing .mfp-content {
 opacity: 0;
}
.mfp-content {
 box-sizing: border-box;
 padding: 2% 5%;
 max-width: 100rem;
 position: relative;
}
.mfp-close {
 color: #fff !important;
 font-size: 4rem !important;
}
.mfp-content .popup a {
 display: block;
 width: 100%;
 height: 100%;
 position: relative;
 top: 0;
 left: 0;
 z-index: 2;
}
@media screen and (max-width: 999px) {
 .sp {
  display: block !important;
 }
 .pc {
  display: none !important;
 }
 .caution {
  font-size: 1.1rem;
 }
 br.sp {
  display: block !important;
 }
 br.pc {
  display: none !important;
 }
 aside {
  width: 60%;
  background: none;
  z-index: 50;
  left: -100%;
  padding-bottom: 1rem;
 }
 aside.open {
  left: 0 !important;
 }
 aside:before {
  display: none;
 }
 main {
  width: 100%;
  margin-left: 0;
 }
 aside .logo {
  display: none;
 }
 aside .utilityArea {
  padding: 0;
  position: absolute;
  bottom: 6.6rem;
  left: 0;
  width: 100%;
 }
 aside .utilityArea .box {
  border-radius: 0 1.2rem 0 0;
  padding: 2rem;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
 }
 .pageHeader {
  margin: 5rem calc(50% - 50vw) 0;
  padding: 3.5em 1.5rem;
 }
 .pageHeader .pageTtl {
  font-size: 2.7rem;
 }
 .breadcrumbs {
  padding: 0;
  position: absolute;
  left: 0;
  top: 5.5rem;
  width: 100vw;
  margin: 0 calc(50% - 50vw);
  font-size: 1.3rem;
 }
 .breadcrumbs ul.breadcrumb {
  padding: 0 1.5rem;
 }
 header {
  padding: 0 1.5rem;
  height: 5rem;
 }
 header > .sns {
  display: none;
 }
 header .sns li a {
  height: 1.4em;
  width: 1.4em;
 }
 header h1 {
  height: 4rem;
 }
 header .utility {
  padding-left: 0;
  flex: none;
  max-width: auto;
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
 }
 header #langSelect {
  top: 8rem;
 }
 header #langSelect ul {
  background: #fff;
  padding: 1em 1.5em 0.5em;
  border-radius: 1.0rem 0 0 1.0rem;
 }
 header #langSelect ul li {
  display: block;
 }
 header #langSelect ul li a {
  font-size: 1.6rem;
  padding: 0.75em 0;
 }
 header #langSelect ul li a:after {
  display: none;
 }
 header #langSelect ul li:last-child a:after {
  display: none;
 }
 header nav#header-menu {
  top: auto;
  bottom: 6.6rem;
  width: 50%;
 }
 header nav#header-menu .menu {
  padding: 1.5em 1em;
  display: block;
  border-radius: 1.2rem 0 0 0;
 }
 header nav#header-menu .menu ul li {
  margin-bottom: 1em;
 }
 header nav#header-menu .menu ul li a {
  font-size: 1.5rem;
  font-weight: 700;
 }
 header nav#header-menu .menu ul.sns {
  padding-top: 1.5em;
 }
 header .utility .hamburger {
  display: none;
 }
 header .utility #language {
  margin-right: 0;
  transform: translateY(-5px);
 }
 #news {
  padding: 2.5em 1.5rem;
 }
 #news .inner {
  display: block;
 }
 #news .inner .secTtl {
  flex: none;
  max-width: 100%;
  text-align: center;
  font-size: 2.7rem;
 }
 #news .inner .secTtl span {
  font-size: 60%;
 }
 #news .inner .secTtl em {
  font-size: 100%;
 }
 #news .inner .newsList {
  flex: none;
  max-width: 100%;
  padding: 1em 0 0;
 }
 #news .inner .newsList ul li {
  margin-bottom: 1em;
 }
 #news .inner .newsList ul li dl {
  display: block;
 }
 #news .inner .newsList ul li dl dt {
  padding-right: 2em;
  font-size: 1.5rem;
  padding: 0 0 0.5em;
 }
 #news .inner .newsList ul li dl dt .new {
  position: relative;
  display: block;
  left: 0;
  transform: translateY(0);
  width: 3.5em;
  text-align: center;
 }
 #news .inner .newsList ul li dl dt span {
  display: inline-block;
  padding-left: 0.5em;
 }
 #news .inner .newsList ul li dl dd {
  font-size: 1.5rem;
 }
 #news .inner .toBtn {
  text-align: center;
  margin: 1em auto 0;
 }
 #payment {
  margin: 2.5em auto;
 }
 #payment > h3 {
  font-size: 1.8rem;
  padding: 1em 1.5rem;
 }
 #payment .box {
  padding: 1.5em 1.5rem;
 }
 #payment .box p {
  font-size: 1.4rem;
  line-height: 1.5;
 }
 #payment .box h4 {
  font-size: 1.7rem;
  margin: 1.0em 0 0;
 }
 #payment .box h5 {
  margin: 1em 0 0.75em;
  font-size: 1.6rem;
  padding: 0.75em 1.5rem;
 }
 #payment .box .possible {
  margin-bottom: 0;
 }
 #payment .box .possible li {
  margin: 0 0.5em 0.5em;
  height: 4rem;
 }
 #payment .box .possible li.visa {
  height: 2.6rem;
 }
 #payment .box .possible li.amex {
  height: 4.0rem;
 }
 #payment .box .possible li.unionpay {
  height: 4.0rem;
 }
 #payment .box .possible li.dpay {
  height: 4.0rem;
 }
 #payment .box .possible li.applepay {
  height: 3.5rem;
 }
 #payment .box .possible li.googlepay {
  height: 3.5rem;
 }
 #payment .box .possible li.merupay {
  height: 5.0rem;
 }
 #payment .box .possible li.yuchopay {
  height: 5.0rem;
 }
 #payment .box .possible li.bankpay {
  height: 3rem;
 }
 #payment .box .possible li.wecahtpay {
  height: 3rem;
 }
 #payment .box .possible li.trafic img {
  width: 100%;
 }
 #payment .box dl {
  margin: 1.0em 0 0;
 }
 #payment .box dl dt {
  font-size: 1.4rem;
  min-width: auto;
  display: block;
  padding: 1em 2.4em;
  margin-bottom: 1.5em;
 }
 #payment .box dl dt em {
  display: block;
 }
 #payment .box .note {
  font-size: 1.3rem;
  padding: 1.25em;
  border-radius: 0.8rem;
  margin: 1.5em 0 0;
 }
 .btnBack a {
  font-size: 1.5rem;
  padding: 0.75em 2.5em 0.75em 1.5em;
 }
 #support {
  padding: 2.5rem 1.5rem 4rem;
 }
 #support h3 {
  font-size: 1.5rem;
  margin: 2.5em 0 0;
 }
 #support ul {
  flex-wrap: wrap;
 }
 #support ul li {
  margin: 1.75rem 1rem 0;
  font-size: 2.2rem;
 }
 #support ul .osakashi {
  font-size: 4.5rem;
 }
 #support ul li a {
  height: 3.5rem;
 }
 #support ul li.suntory a {
  height: 2.8rem;
 }
 #support ul li.ajinomoto a {
  height: 5.0rem;
  margin: 0 1rem 0 0;
 }
 #support ul li.nishiorent a {
  height: 4.0rem;
  margin: 0;
 }
 #support ul li.withal a {
  height: 5rem;
 }
 #support ul li.saraya a {
  height: 3.6rem;
 }
 #support ul li.lbb a {
  height: 2.5rem;
 }
 #support ul li.bsk a {
  height: 4.0rem;
 }
 #support ul li.premiumwater a {
  height: 3.5rem;
 }
 #support ul li.okura a {
  height: 3.2rem;
 }
 #support ul li.smbc a {
  height: 2.2rem;
  margin-top: 1rem;
 }
 #support ul li.technics a {
 height: 3.5rem;
}
 footer {
  padding: 2.5rem 1.5rem 7.5rem;
  font-size: 1.4rem;
 }
 footer .contact ul.flex {
  display: block;
 }
 footer .contact ul.flex > li {
  flex: none !important;
  max-width: 100% !important;
  padding: 1.5em 0 !important;
 }
 footer .contact ul.flex > li:last-child {
  padding-bottom: 0 !important;
 }
 footer .contact ul.flex > li:after {
  content: "";
  display: block;
  height: 1px;
  width: 10em;
  background: rgba(255, 255, 255, 0.3);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
 }
 footer .contact ul.flex > li:last-child:after {
  display: none;
 }
 footer .contact h3 {
  font-size: 100%;
 }
 .spNav {
  position: fixed;
  display: block;
  width: 100%;
  height: 6.6rem;
  bottom: 0;
  left: 0;
  background: #b72a2a;
  color: #fff;
  z-index: 999;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  border-top: solid 1px rgba(255, 255, 255, 0.3);
 }
 .spNav > ul {
  display: flex;
  align-items: stretch;
  /*max-width: 300px;*/
  margin: 0 auto;
  height: 100%;
  position: relative;
 }
 .spNav > ul > li {
  flex: 1 0 50%;
  max-width: 50%;
  position: relative;
  padding: 0 1rem;
 }
 .spNav > ul > li:before {
  content: "";
  display: block;
  height: calc(100% - 20px);
  width: 1px;
  background: #fff;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  opacity: 0.8;
 }
 .spNav > ul > li:last-child:before {
  display: none;
 }
 .spNav > ul > li.open {
  background: rgba(0, 0, 0, 0.4);
 }
 .spNav > ul > li#spNav01:after {
  content: "本日のグルメEXPO";
  display: block;
  white-space: nowrap;
  font-size: 10px;
  position: absolute;
  bottom: 0.35rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
 }
 .spNav.mobil > ul > li#spNav01:after {
  display: none;
 }
 .spNav > ul > li#spNav01 span {
  background: url("../images/icon_sun.svg") no-repeat center center;
  background-size: cover;
  height: 30px;
  width: 30px;
  text-align: center;
  display: block;
  position: relative;
  position: absolute;
  left: 0;
  right: 0;
  top: 1rem;
  margin: 0 auto;
  transition: all .3s;
 }
 .spNav > ul > li#spNav01.open span {
  background: none;
 }
 .spNav > ul > li#spNav01 span:before, .spNav > ul > li#spNav01 span:after {
  content: "";
  transition: all .3s;
  position: absolute;
  height: 3px;
  z-index: 10;
  background: #fff;
  width: 30px;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 18px;
  opacity: 0;
 }
 .spNav > ul > li#spNav01.open span:before {
  transform: translateY(-6px) rotate(42deg);
  opacity: 1;
 }
 .spNav > ul > li#spNav01.open span:after {
  transform: translateY(-6px) rotate(-42deg);
  opacity: 1;
 }
 .spNav > ul > li#spNav02, .spNav > ul > li#spNav03 {
  display: none;
 }
  .spNav.mobil > ul > li#spNav02, .spNav.mobil > ul > li#spNav03 {
  display: block;
 }
 .spNav > ul > li#spNav02 span {
  background: url("../images/icon_foods.svg") no-repeat center center;
  background-size: auto 57%;
  height: 100%;
  width: 100%;
  display: block;
 }
 .spNav > ul > li#spNav03 span {
  background: url("../images/icon_pin.svg") no-repeat center center;
  background-size: auto 60%;
  height: 100%;
  width: 100%;
  display: block;
 }
 .spNav > ul > li a {
  display: block;
  width: 100%;
  height: 100%;
 }
 .spNav > ul > li#spNav04:after {
  content: "メニュー";
  display: block;
  white-space: nowrap;
  font-size: 10px;
  position: absolute;
  bottom: 0.35rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
 }
 .spNav > ul > li#spNav04 .hamburger {
  cursor: pointer;
  width: 30px;
  height: 27px;
  z-index: 2001;
  position: absolute;
  margin: 0 auto;
  top: 1.2rem;
  left: 0;
  right: 0;
 }
 .spNav .hamburger span {
  transition: all .3s;
  position: absolute;
  height: 3px;
  background-color: #fff;
  width: 100%;
  z-index: 10;
 }
 .spNav .hamburger span:nth-of-type(1) {
  top: 3px;
 }
 .spNav .hamburger span:nth-of-type(2) {
  top: 12px;
 }
 .spNav .hamburger span:nth-of-type(3) {
  top: 21px;
 }
 .spNav .hamburger.open span:nth-of-type(1) {
  top: 6px;
  transform: translateY(6px) rotate(-42deg);
 }
 .spNav .hamburger.open span:nth-of-type(2) {
  opacity: 0;
 }
 .spNav .hamburger.open span:nth-of-type(3) {
  top: 18px;
  transform: translateY(-6px) rotate(42deg);
 }
 .mfp-container {
  padding: 0 !important;
 }
 .mfp-content {
  box-sizing: border-box;
  padding: 2% 1rem;
 }
 .mfp-close {
  top: -34px !important;
 }

}