@charset "UTF-8";
/*!
	Theme Name: 
	Theme URI: 
	Author: 
	Author URI: 
	Description: 

	Version: 0.0.1
*/
/************************/
html {
   font-size: 62.5%;
}
body {
   color: #000;
   font-size: 16px;
   font-size: 1.6rem;
   line-height: 1.7;
   background: url("../../common/img/1x/bg.webp") center top;
   font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
html.fixed {
   height: 100%;
   overflow: hidden;
}
.youtube {
   width: 100%;
   aspect-ratio: 16 / 9;
}
.youtube iframe {
   width: 100%;
   height: 100%;
}
.kvslider {
   opacity: 0;
   transition: opacity .3s linear;
}
.kvslider.slick-initialized {
   opacity: 1;
}

.home .rightbg{
    height: 5800px;
    overflow: hidden;
}
.license .rightbg {
    height: 4920px;
    overflow: hidden;
}
.home .leftbg{
    height: 5900px;
    overflow: hidden;
}
.license .leftbg {
    height: 4950px;
    overflow: hidden;
}

.rightbg,.leftbg{
     position: absolute;
    z-index: -1;
    mix-blend-mode: multiply;
}
.rightbg {
    top: 300px;
    right: -138px;

}
.leftbg {
    top: 148px;
    left: -212px;

}


.bglr {
   top: 0;
   right: 0;
   left: 0;
   overflow: hidden;
   position: relative;
   transition:0s!important;
}

.leftbg {
   top: 148px;
   left: -212px;
   height: 100%;
}
.bgw {
   position: relative;
}
/* font  
-----------------------------------*/
h2 {
   font-size: 4.6rem;
}
h3 {
   font-size: 3rem;
}
h4 {
   font-size: 1.8rem;
}
h5 {
   font-size: 2.4rem;
   color: #c2996b;
   line-height: 1.4;
   margin: 3rem auto 2rem;
}
h6 {
   font-size: 1.8rem;
}
.text-center {
   text-align: center;
}
.text-right {
   text-align: right;
}
.text-left {
   text-align: left;
}
.text-i {
   font-style: italic;
}
small {
   font-size: 1rem;
   letter-spacing: 0px;
}
.trajan {
   font-family: trajan-pro-3, serif;
   font-weight: 400;
   font-style: normal;
}
/* link  
-----------------------------------*/
a, a img, button {
   text-decoration: none;
   -webkit-transition: ease 0.7s;
   -moz-transition: ease 0.7s;
   -o-transition: ease 0.7s;
   -ms-transition: ease 0.7s;
   transition: ease 0.7s;
   color: #000;
   -webkit-backface-visibility: hidden; /* 追加 */
   backface-visibility: hidden; /* 追加 */
}
a:hover {
   opacity: .8;
}
.row {
   padding-right: 15px;
   padding-left: 15px;
}
/* container width
-----------------------------------*/
.container {
   margin: auto;
   max-width: 1000px;
   padding: 0px;
   box-sizing: border-box;
}
.containerflat {
   margin: auto 4%;
}
/* w750
-----------------------------------*/
.w750 {
   max-width: 830px;
   margin: auto;
   padding: 0px 40px;
}
.w750inner {}
.row {
   padding-right: 15px;
   padding-left: 15px;
}
/* w900
-----------------------------------*/
.w900 {
   max-width: 900px;
   margin: auto;
   padding: 0px 40px;
}
/* colum
-----------------------------------*/
/*530colum*/
.wid530 {
   width: 530px;
}
/* flex 
-----------------------------------*/
.d-flex {
   display: flex;
   flex-direction: row;
}
@keyframes arrow {
   0% {
      transform: translate(-50%, 0)
   }
   100% {
      transform: translate(-50%, 125px)
   }
}
/* img responsiv 
-----------------------------------*/
main div > img, img.img_responsive {
   max-width: 100%;
   width: 100%;
   display: inherit;
}
img.noresponsive310 {
   width: 100%;
   max-width: 100%;
   display: block;
}
.nolink {
   pointer-events: none;
   cursor: none;
}
/* btn
-----------------------------------*/
/*parts
-----------------------------------*/
/* content base64 tmp
-----------------------------------
::before {
    content: url("data:image/svg+xml;base64,");
}
*/
/* table 
-----------------------------------*/
/* pagetop 
-----------------------------------*/
.pagetop {
   display: none;
   position: fixed;
   bottom: 20px;
   right: 10px;
   z-index: 110;
}
.pagetop a::before {
   content: '';
   width: 10px;
   height: 10px;
   border: 0px;
   border-top: solid 2px #000;
   border-right: solid 2px #000;
   -ms-transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
   transform: rotate(-45deg);
   position: absolute;
   left: 0;
   right: 0;
   margin: auto;
   top: 1px;
   bottom: 0px;
   opacity: 1;
}
.pagetop a {
   display: block;
   border-radius: 50px;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   zoom: 1;
   width: 40px;
   height: 40px;
   text-align: center;
   /* font-size: 24px; */
   text-decoration: none;
   line-height: 50px;
   /* border: 1px solid #fbfbfb; */
   -webkit-transition: all 0.7s;
   -moz-transition: all 0.7s;
   -ms-transition: all 0.7s;
   -o-transition: all 0.7s;
   transition: all 0.7s;
   opacity: 1;
   color: #1d1d1c;
   background: #fff;
}
.pagetop a span {
   top: 22px;
   position: relative;
   font-size: 0.1rem;
}
.pagetop a:hover {
   opacity: 0.6;
}
/* header
-----------------------------------*/
.header_h2 {
   font-size: 1.5rem;
   color: #111;
   margin-left: 3%;
   font-weight: normal;
}
/* google map responsive
-----------------------------------*/
.gmapres {
   position: relative;
   padding-bottom: 30.842%;
   padding-top: 30px;
   height: 400px;
   overflow: hidden;
   min-width: 100%;
   margin-right: 0;
   margin-bottom: 2rem;
}
.gmapres iframe, .gmapres object, .gmapres embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
/* wp Alignments
-----------------------------------*/
.alignleft {
   display: inline;
   float: left;
   margin-right: 1.5em;
}
.alignright {
   display: inline;
   float: right;
   margin-left: 1.5em;
}
.aligncenter {
   clear: both;
   display: block;
   margin-left: auto;
   margin-right: auto;
}
.itemlist ul {
   display: flex;
   flex-wrap: wrap;
}
.itemlist ul li {
   width: calc(100% / 6);
   box-sizing: border-box;
   line-height: 0;
}
.itemlist ul li img {
   width: 100%;
}
h2 {
   position: relative;
   padding-left: 70px;
   font-family: trajan-pro-3, serif;
   font-weight: 400;
   font-style: normal;
   line-height: 1;
}
h2::before {
   content: '';
   background: url(../../common/img/2x/icon_logo@2x.png) no-repeat 0 0;
   width: 49px;
   height: 53px;
   position: absolute;
   display: block;
   background-size: 100%;
   top: 0;
   bottom: 0;
   margin: auto;
   left: 0;
}
/* kvslider
-----------------------------------*/
.kv {
   position: relative;
   padding-bottom: 1rem;
}
.kvslider img {
   max-width: 100%;
}
.kv h2 {
   padding: 0;
   margin: 2rem auto;
   text-align: center;
   color: #c2996b;
   position: relative;
   top: 0;
   left: 0;
   right: 0;
   font-size: 4.7rem;
   z-index: 2;
}
.kv h2::before {
   content: none;
}
.kvtxt {
   padding-bottom: 1rem;
   text-align: center;
}
.kvtxt p {
   font-size: 1.4rem;
   line-height: 1.6;
}
.kvtxt a {
   font-weight: bold;
   color: #a27a51;
   text-decoration: underline;
}
.kvqr {
   text-align: center;
}
.kvqr img {
   width: 97px;
   height: 97px;
}
/* brand
-----------------------------------*/
#brand {
   background: rgb(194, 153, 107);
   background: none;
   padding-bottom: 0rem;
}
#brand h2 {
   text-align: center;
   margin: auto auto 5.5rem;
   padding: 0;
   font-size: 4.6rem;
}
#brand h2::before {
   content: none;
}
#brand .brandin {
   background: transparent;
   color: #000;
   padding: 3rem 0 12rem;
   position: relative;
}
#brand .brandin .d-flex {
   justify-content: space-between;
   flex-wrap: wrap;
}
#brand .brandin dl {
   background: #000;
   width: calc(97% /3);
   margin-bottom: 3%;
   display: flex;
   flex-direction: column;
   height: auto;
}
.bgwhite {
   background: none !important;
}
.jpmap {
   text-align: center;
   margin-top: 40px;
}
.jpmap img {
   height: 407px;
}
.jpmaptxt {
   margin-top: 40px;
}
.jpmaptxt dd {
   padding: 0;
}
#brand .brandin dl img {
   max-width: 100%;
}
#brand .brandin dd {
   padding: 20px 26px;
   display: flex;
   flex-direction: column;
   height: 100%;
}
#brand .brandin h3 {
   color: #fff;
   font-size: 2.7rem;
   line-height: 1;
   margin-bottom: 7px;
   font-family: trajan-pro-3, serif;
   font-weight: 400;
   font-style: normal;
}
#brand .brandin h4 {
   color: #c2996b;
   line-height: 1.2;
   margin-bottom: 10px;
   font-weight: 500;
}
#brand .brandin p {
   font-size: 1.1rem;
   color: #fff;
   line-height: 1.5;
   margin-bottom: 1rem;
}
#brand .brandin ul {
   display: flex;
   margin-top: auto;
}
#brand .brandin ul li {
   font-size: 1.7rem;
   display: block;
   justify-content: space-between;
   align-items: center;
}
#brand .brandin ul li.tokyo a {
   border: 1px solid #c2996b;
   color: #c2996b;
   font-weight: 500;
   width: 117px;
   display: block;
   text-align: center;
   height: 29px;
   margin-right: 16px;
   letter-spacing: .6px;
}
#brand .brandin ul li.blandsie a {
   background: #fff;
   color: #000;
   font-weight: bold;
   width: 117px;
   display: block;
   border: 1px solid #fff;
   position: relative;
   font-size: 1.1rem;
   height: 29px;
   line-height: 2.3;
}
#brand .brandin ul li.blandsie a::before {
   content: '';
   background: url("../../common/img/1x/btn_icon_bs.png")no-repeat;
   width: 15px;
   height: 16px;
   background-size: 100%;
   display: inline-block;
   position: relative;
   top: 5px;
   margin-right: 12px;
   margin-left: 8px;
}
#brand .brandin ul li.blandsie a::after {
   content: '';
   display: inline-block;
   position: absolute;
   top: 50%;
   right: 0;
   width: 0;
   height: 0;
   margin-top: -6px;
   border-top: 5px solid transparent;
   border-right: 7px solid transparent;
   border-bottom: 5px solid transparent;
   border-left: 7px solid #000000;
}
/* recipes
-----------------------------------*/
#recipes {
   padding-bottom: 14rem;
}
#recipes .container {
   padding: 0 15px;
}
#recipes h2 {
   color: #000;
   margin-top: 14rem;
   margin-bottom: 4rem;
}
#recipes .d-flex {
   justify-content: space-between;
   color: #000;
}
#recipes .d-flex > div {
   width: calc(96.5%/2);
   letter-spacing: .3px;
}
/* delivery
-----------------------------------*/
#delivery {
   background: none;
   padding: 14rem 0 6rem;
}
#delivery h2 {
   margin-bottom: 0;
   width: 100%;
}
.sidbox {
   display: flex;
   margin-left: auto;
   align-items: center;
   margin-right: 0 !important;
}
.sidbox .btn_contacmail {
   margin: 0 30px 0 auto;
}
.sidbox img {
   width: 97px;
   display: block;
}
#delivery .d-flex > div {
   width: 478px;
   margin-right: 40px;
}
#delivery .d-flex > ul {
   width: 480px;
   display: flex;
   flex-wrap: wrap;
   margin-left: auto;
   height: max-content;
}
#delivery .d-flex > ul li {
   width: calc(100% / 3);
   background: #fff;
   color: #000;
   text-align: center;
   padding: 0;
   border: 1px solid #999;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 158px;
   z-index: 2;
   position: relative;
   margin: 0 -1px -1px 0;
}
#delivery .d-flex > ul li a {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   overflow: hidden;
   width: 100%;
   height: 158px;
   padding: 15px;
}
#delivery .d-flex > ul li img {
   display: block;
   text-align: center;
   margin-bottom: 10px;
}
#delivery .d-flex > ul span {
   display: block;
   color: #000;
   line-height: 1;
   font-size: 1.8rem;
   font-family: trajan-pro-3, serif;
   font-weight: 400;
   font-style: normal;
}
#delivery .d-flex > ul li.sr {}
#delivery .d-flex > ul li.orf {}
#delivery .d-flex > ul li.kg {}
#delivery .d-flex > ul li.kcy {}
#delivery .d-flex > ul li.kb {}
#delivery .d-flex > ul li.jb {}
#delivery .d-flex > ul li.fy {}
#delivery .d-flex > ul li.bcg {}
#delivery .d-flex > ul li.as a {
   justify-content: end;
}
.sid-head {
   align-items: center;
   margin-bottom: 4rem;
}
#brand_sp {
   margin-top: 6rem;
}
#brand_sp dl {
   width: calc(98% / 2);
}
#brand_sp h2.noiconhead {
   text-align: center;
   margin: auto;
   padding: 1.5rem 0;
   font-size: 4rem;
   border-top: 1px solid #000;
   border-bottom: 1px solid #000;
   color: #c1996b;
}
#brand_sp h2.noiconhead::before {
   content: none;
}
.btn_contactbk a {
   display: block;
   text-align: center;
   margin: auto;
   background: #000;
   color: #c2996b;
   width: 117px;
   height: 29px;
   font-size: 1.1rem;
   padding: 5px 22px;
   letter-spacing: 1px;
   font-weight: bold;
}
/* contact
-----------------------------------*/
#contact {
   background: none;
}
#contact .btn_contact {
   display: block;
   text-align: center;
   margin: auto;
}
#contact a {
   background: #000;
   padding: 5px 2px;
   color: #fff;
   font-size: 1.1rem;
   width: 117px;
   height: 29px;
   display: inline-block;
   letter-spacing: 1px;
   font-weight: bold;
}
/* footer
-----------------------------------*/
footer .footnav{
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    display: flex;
    align-items: center;
}
footer .footerinner .nav {
     display: flex;
    align-items: center;
    width: 1000px;
    margin: auto;
}
footer .footerinner .nav li {
   padding: 15px 3.5%;
   font-family: 'Roboto', sans-serif;
   letter-spacing: 1px;
   text-align: center;
   line-height: 1.2;
   font-size: clamp(11px, 1.5vw, 1.6rem);
}
footer {
   background: none;
   padding-bottom: 20px;
   padding-top: 16rem;
}
footer .footerinner > ul.nav {
   border-top: 1px solid #000;
   border-bottom: 1px solid #000;
   align-items: center;
}
footer ul.logoul {
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 3rem auto 2rem;
}
footer ul.logoul li {
   margin: auto 25px;
}
footer ul.logoul li:first-child {
   text-align: center;
   width: 196px;
}
footer ul.logoul li:last-child {
   text-align: center;
   width: 86px;
}
footer ul.logoul img {
   width: 100%;
}
footer .copy {
   text-align: center;
   font-size: 1.1rem;
   font-weight: bold;
}
/* contact
-----------------------------------*/
.contact {}
.errorblock {
   text-align: center;
   margin: 2rem auto;
}
.errorblock input {
   margin: 3rem auto;
}
.contact main form ul li {
   margin-bottom: 3rem;
}
.contact input[type="text"] {
   border: 1px solid #fff;
   background: #fff;
   padding: 15px 23px;
   width: 100%;
   color: #000;
}
::placeholder {
   color: #000;
}
.formTable {
   border: 1px solid #3c3c3c;
   border-collapse: collapse;
   margin: 3rem auto;
   width: 100%;
}
.formTable th {
   width: 15%;
}
.formTable th, .formTable td {
   border: 1px solid #3c3c3c;
   text-align: left;
   padding: 10px;
}
.contact input[type="button"] {
   background: transparent;
   width: 117px;
   padding: 2px;
   font-size: 11px;
   height: 30px;
   color: #fff;
   font-weight: 500;
   letter-spacing: 1px;
   opacity: 1;
   transition: .3s ease;
   border: 1px solid #fff;
}
.contact input[type="submit"] {
   background: #c2996b;
   width: 117px;
   border: 1px solid #c2996b;
   padding: 2px;
   font-size: 11px;
   height: 30px;
   color: #000;
   font-weight: 500;
   letter-spacing: 1px;
   opacity: 1;
   transition: .3s ease;
}
.contact input[type="submit"]:hover {
   opacity: 0.8;
}
.contact main h2 {
   text-align: center;
   color: #c2996b;
   padding: 0;
   margin: 0 auto 40px;
}
.contact main h2::before {
   content: none;
   margin: auto;
   padding: a
}
.contact main h4 {
   text-align: center;
   color: #c2996b;
}
.contact main .add h2 + p {
   text-align: center;
   margin-bottom: 11rem;
}
.contact main h4 + p {
   margin-bottom: 3rem;
   text-align: center;
}
.contact #contact {
   background: #000;
   margin-bottom: 125px;
}
.contact_btn_contact {
   display: block;
   text-align: center;
   margin: 50px auto 0px;
}
.contact main .add h2 {
   margin-bottom: 1.5rem;
}
.contact .time {
   margin: auto;
   text-align: center;
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
}
.contact .time dl {
   display: flex;
   width: auto;
}
.contact .time dl dt {
   width: 77px;
   text-align: right;
   margin-right: 10px;
   display: block;
}
.contact .time dl dd {
   text-align: left;
   width: 203px;
   margin-left: 10px;
}
.btn_access {
   display: block;
   text-align: center;
   margin: auto;
   background: #c2996b;
   color: #fff;
   width: 117px;
   height: 29px;
   font-size: 1.1rem;
   padding: 5px;
   letter-spacing: 0.6px;
   font-weight: bold;
}
.btn_contacmail {
   display: block;
   text-align: center;
   margin: auto;
   background: #000;
   color: #fff;
   width: 117px;
   height: 29px;
   font-size: 1.1rem;
   padding: 5px;
   letter-spacing: 0.6px;
   font-weight: bold;
}
/*
license oprtunities
-----------------------------------*/
.license{
    height: 100%;
}
.linkstyleunder {
   position: relative;
}
.linkstyleunder::before {
   content: '';
   width: 100%;
   display: inline;
   height: 1px;
   border-bottom: 1px solid #c2996b;
   position: absolute;
   bottom: -3px;
}
.license .contentinner {
   width: 750px;
   margin: auto;
}
.license .contentinner h1 {
   letter-spacing: 0.02em;
   font-family: trajan-pro-3, serif;
   text-align: center;
   margin: 40px auto 0;
   font-size: clamp(2.5rem, 4vw, 4.7rem);
   color: #c1996b;
   font-weight: normal;
}
.license .contentinner h2 {
   color: #c1996b;
   padding: 0;
   text-align: center;
   margin: 25px 0;
   font-size: clamp(2rem, 4vw, 4.5rem);
}
.license .contentinner h2::before {
   content: none;
}
.license h3.lo-head3 {
   color: #c1996b;
   font-size: clamp(2rem, 3vw, 3.3rem);
   text-align: center;
   border-top: 1px solid #030000;
   border-bottom: 1px solid #030000;
   letter-spacing: 0.02em;
   font-family: trajan-pro-3, serif;
   padding: 20px 0;
   line-height: 1.2;
   margin-bottom: 45px;
}
.license .contentinner h4 {
   color: #c1996b;
   font-size: clamp(1.8rem, 2.5vw, 3.3rem);
   letter-spacing: 0.02em;
   margin-top: 45px;
   line-height: 1.2;
   margin-bottom: 15px;
}
.license .contentinner p {
   margin-bottom: 2em;
   letter-spacing: 0.04em;
   line-height: 1.7;
   font-size: clamp(1.2rem, 1.5vw, 1.7rem);
   text-align: justify;
}
#lotop {
   margin-bottom: 65px;
   margin-top: 65px;
}
#lotop dl {
   display: flex;
   font-size: clamp(1.4rem, 1.8vw, 2rem);
    margin-bottom: 20px;
    line-height: 1.3;
}
#lotop dl dt {
   width: 50%;
   text-align: right;
   font-weight: 700;
}
#lotop dl dt dd {
   font-weight: normal;
}
.conceptp {
   font-size: clamp(1.2rem, 1.9vw, 1.9rem) !important;
   line-height: 1.2 !important;
}
.blandlist {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(124px, 1fr));
   grid-gap: 1px;
   margin: 30px 0 70px;
}
.blandlist li {
   height: 100%;
}
.blandlist li a {
    cursor: none;
    pointer-events: none;
   display: flex;
   justify-content: center;
   flex-direction: column;
   align-items: center;
   background: #fff;
   height: 100%;
   padding: 15px;
}
.blandlist li a img {
   height: auto;
}
.blandlist li a span {
   display: none;
}
.listimg {
   margin-bottom: 100px;
}
.listimg li {
   margin-bottom: 1em;
}
.listimg li img {
   max-width: 100%;
}
.offerlo-list {
   margin-left: 20px;
}
.offerlo-list li {
   position: relative;
   font-size: clamp(1.5rem, 2vw, 2.4rem);
   line-height: 2;
}
.offerlo-list li::before {
   content: '';
   width: 7px;
   height: 1px;
   background: #000;
   position: absolute;
   display: block;
   margin-left: -20px;
   top: 50%;
   bottom: 0;
}
.offerlo-list-a {
   margin-left: 20px;
}
.offerlo-list-a li {
   position: relative;
   letter-spacing: 0.04em;
   line-height: 2.1;
   font-size: clamp(1.2rem, 1.6vw, 1.9rem);
}
.offerlo-list-a li a {
   border-bottom: 1px solid #c1996b;
   transition: ease .2s;
}
.offerlo-list-a li a::before {
   content: '';
   width: 9px;
   height: 13px;
   clip-path: polygon(0 0, 0% 100%, 100% 50%);
   display: inline-block;
   background: #c1996b;
   margin-right: 9px;
   font-size: clamp(1.2rem, 1.5vw, 1.9rem);
}
.offerlo-list-a li a:hover {
   color: #c1996b;
}
.dlmfs {
   font-size: clamp(1.2rem, 1.5vw, 1.9rem);
}
.list-mfs {
   position: relative;
   letter-spacing: 0.04em;
   line-height: 1.5;
}
.list-mfs li a {}
.list-mfs li a::before {
   content: '';
   width: 9px;
   height: 13px;
   clip-path: polygon(0 0, 0% 100%, 100% 50%);
   display: inline-block;
   background: #c1996b;
   margin-right: 9px;
   font-size: clamp(1.2rem, 1.9vw, 1.9rem);
}
.list-sep {
   font-size: clamp(1.2rem, 1.9vw, 1.9rem);
   line-height: 1.5;
}
.list-sep li {
   display: flex;
   line-height: 1.5;
}
/*---------------------------------*/
.mb-0 {
   margin-bottom: 0 !important;
}
.mb-30 {
   margin-bottom: 30px;
}
.mb-40 {
   margin-bottom: 40px;
}
.mb-55 {
   margin-bottom: 50px !important;
}
.mt-30 {
   margin-top: 30px !important;
}
.mt-50 {
   margin-top: 50px !important;
}
.mt-70 {
   margin-top: 70px !important;
}
.mt-0 {
   margin-top: 0 !important;
}
.add {
   text-align: center;
}
.sp_visible {
   display: none;
}
.sp_hidden {
   display: inherit;
}
/* medhia query 
-----------------------------------*/
@media (max-width: 1024px) {
   /* footer
    -----------------------------------*/
   .contact .container {
      padding: 0 15px;
   }
}
@media (max-width: 820px) {
    
    footer .footnav{
        display: none;
    }
   .container {
      padding: 0 10px;
   }
     .bglr::after,
   .rightbg {
      right: -330px;
           background-size: contain;
   }
    .bglr::before,
   .leftbg {
      left: -200px;
           background-size: contain;
   }
   .rightbg img, .leftbg img {
      width: 25vh;
   }
   .container {
      margin: auto;
      max-width: 100%;
      box-sizing: border-box;
   }
   .sp_visible {
      display: inherit;
   }
   .sp_hidden {
      display: none
   }
   /* kv
    -----------------------------------*/
   .kvtxt {
      padding-bottom: 3rem;
      padding-left: 15px;
      padding-right: 15px;
      text-align: left;
   }
   .kv h2 {
      padding: 0;
      margin: auto;
      text-align: center;
      color: #c2996b;
      position: absolute;
      top: -57px;
      left: 0;
      right: 0;
      font-size: 3.7rem;
   }
   /* brand
    -----------------------------------*/
   #brand .brandin {
      padding: 3rem 15px 4rem;
      position: relative;
      top: 0;
   }
   #brand .brandin .d-flex {
      justify-content: space-between;
      flex-wrap: wrap;
   }
   #brand h2 {
      text-align: center;
      margin: auto auto 3.5rem;
      padding: 0;
      font-size: 4.6rem;
   }
   #brand .brandin dd {
      padding: 20px 16px;
      display: flex;
      flex-direction: column;
      height: 100%;
   }
   #brand .brandin ul li.blandsie {
      font-size: 1.7rem;
      display: block;
      justify-content: space-between;
      align-items: center;
      width: 100%;
   }
   #brand .brandin ul li.tokyo a {
      border: 1px solid #c2996b;
      color: #c2996b;
      font-weight: 500;
      width: auto;
      display: block;
      text-align: center;
      margin-right: 16px;
      font-size: 1.2rem;
      height: auto;
      padding: 3.4px 10px;
   }
   #brand .brandin ul li.blandsie a::before {
      content: '';
      background: url("../../common/img/1x/btn_icon_bs.png")no-repeat;
      width: 15px;
      height: 16px;
      background-size: 100%;
      display: inline-block;
      position: relative;
      top: 5px;
      margin-right: 2px;
      margin-left: 3px;
   }
   #brand .brandin ul li.blandsie a {
      background: #fff;
      color: #000;
      font-weight: bold;
      width: 90px;
      display: block;
      border: 1px solid #fff;
      position: relative;
      font-size: 1.1rem;
      height: 29px;
      line-height: 2.3;
   }
   #brand_sp .d-flex {
      flex-direction: column;
   }
   #brand_sp dl {
      width: 100%;
   }
   #brand .brandin ul li.blandsie a::after {
      content: '';
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 0;
      width: 0;
      height: 0;
      margin-top: -5px;
      border-top: 5px solid transparent;
      border-right: 4px solid transparent;
      border-bottom: 4px solid transparent;
      border-left: 4px solid #000000;
   }
   /* recipes
    -----------------------------------*/
   #recipes {
      padding-bottom: 7rem;
   }
   #recipes h2 {
      color: #000;
      margin-top: 5rem;
      margin-bottom: 4rem;
   }
   /* delivery
    -----------------------------------*/
   .sidbox {
      padding-top: 5rem;
   }
   .sidbox {
      display: flex;
      margin-left: auto;
      align-items: center;
      margin-right: auto;
      flex-direction: column;
      justify-content: center;
      margin: auto !important;
   }
   .sidbox .btn_contacmail {
      margin: auto;
   }
   #delivery .container {
      padding: 0 15px;
   }
   #delivery .container span.arrow {
      transform: rotate(90deg);
      display: inline-block;
   }
   #delivery {
      padding: 6rem 0 9rem;
   }
   #delivery p {
      margin-bottom: 1.5em;
   }
   #delivery .d-flex {
      display: flex;
      flex-direction: column;
   }
   #delivery .d-flex > div {
      width: 100%;
      margin-right: 40px;
   }
   #delivery .d-flex > ul {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
   }
   #delivery .d-flex > ul li {
      width: calc(100% / 3);
      background: #fff;
      color: #000;
      text-align: center;
      padding: 0;
      border: 1px solid #999;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 158px;
      z-index: 2;
      position: relative;
      margin: 0 -3px 1px 0;
   }
   .jpmaptxt dd {
      padding: 15px;
   }
   .contact .time, .contact .container p {
      font-size: 12px;
   }
   .contact .time dl dt {
      margin-right: 5px;
      width: 58px;
   }
   .contact .time dl dd {
      margin-left: 5px;
      width: 152px;
   }
   /* LICENSE */
   .license .contentinner {
      width: 100%;
   }
   .license .contentinner h1 {
      margin-bottom: 10px;
   }
   .license .contentinner h2 {
      margin: 45px 0 20px;
      line-height: 1.2;
   }
   #lotop {
      margin: auto;
   }
   #lotop dl {
      margin-bottom: 14px;
      flex-direction: column;
      align-items: center;
   }
   #lotop dl dt {
      text-align: center;
      width: 100%;
   }
   .blandlist {
      grid-template-columns: repeat(auto-fill, minmax(101px, 1fr));
      grid-gap: 1px;
      margin: 30px 0 70px;
   }
   .blandlist li {
      height: 101px;
   }
   .blandlist li a img {
      height: auto;
      max-width: 100%;
      padding: 5px;
   }
   .blandlist li:nth-child(2) img {
      padding: 0;
   }
   .blandlist li:nth-child(9) a, .blandlist li:nth-child(9) img {
      padding: 0;
   }
   .blandlist li:nth-child(10) img, .blandlist li:nth-child(17) img {
      padding: 10px;
   }
   .offerlo-list {
      margin-top: 10px;
   }
   .offerlo-list li {
      position: relative;
      font-size: clamp(1.5rem, 2vw, 2.4rem);
      line-height: 1.3;
      margin-bottom: 10px;
   }
   .offerlo-list-a li a::before {
      width: 5px;
      height: 9px;
      margin-right: 4px;
   }
   .offerlo-list-a li {
      line-height: 1.4;
      margin: 10px 0;
   }
   .offerlo-list-a li:first-child {
      margin-top: 10px;
   }
   .listimg {
      margin-bottom: 50px;
   }
   .license .contentinner h4, .mt-0, .mt-70 {
      margin-top: 40px !important;
      margin-bottom: 5px;
   }
   .mb-30.dlmfs, .list-sep.mb-40 {
      margin-bottom: 20px;
   }
}
@media (max-width: 480px) {
   .container {
      padding: 0 15px;
   }
   h2 {
      font-size: 2.6rem;
      padding-left: 40px;
   }
   h4 {
      font-size: 2rem;
   }
   h5 {
      font-size: 1.4rem;
      color: #c2996b;
      line-height: 1.4;
      margin: 2rem auto 1rem;
   }
   h2::before {
      content: '';
      background: url(../../common/img/2x/icon_logo@2x.png) no-repeat 0 0;
      width: 29px;
      height: 33px;
      position: absolute;
      display: block;
      background-size: 100%;
      top: 0;
      bottom: 0;
      margin: auto;
      left: 0;
   }
   /* header
    -----------------------------------*/
   header#navArea > p {
      color: #c2996b;
      font-size: 1.5rem;
      visibility: hidden;
   }
   .kv h2 {
      padding: 0;
      margin: auto;
      text-align: center;
      color: #c2996b;
      position: absolute;
      top: -38px;
      left: 0;
      right: 0;
      font-size: 2.5rem;
   }
   .kvtxt p {
      font-size: 1.2rem;
   }
   .kvtxt {
      padding-bottom: 3rem;
      padding-left: 25px;
      padding-right: 25px;
      text-align: left;
   }
   /* brand
    -----------------------------------*/
   #brand .brandin dl {
      background: #000;
      width: 100%;
      margin-bottom: 6%;
      display: flex;
      flex-direction: column;
      height: auto;
   }
   #brand .brandin {
      padding: 2rem 25px 4rem;
      position: relative;
      top: 0;
   }
   #brand h2 {
      text-align: center;
      margin: auto auto 2.5rem;
      padding: 0;
      font-size: 2.4rem;
   }
   #brand .brandin h3 {
      color: #fff;
      font-size: 2.7rem;
      line-height: 1;
      margin-bottom: 7px;
      font-family: trajan-pro-3, serif;
      font-weight: 400;
      font-style: normal;
   }
   #brand .brandin p {
      font-size: 1.2rem;
      color: #fff;
      line-height: 1.5;
      margin-bottom: 3rem;
   }
   #brand .brandin ul li {
      font-size: 1.2rem;
      display: block;
      justify-content: space-between;
      align-items: center;
   }
   #brand .brandin ul li.tokyo a {
      border: 1px solid #c2996b;
      color: #c2996b;
      font-weight: bold;
      width: 85px;
      display: block;
      text-align: center;
      height: auto;
      margin-right: 16px;
      padding: 4px;
   }
   #brand .brandin ul li.blandsie a::after {
      content: '';
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 0;
      width: 0;
      height: 0;
      margin-top: -6px;
      border-top: 5px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 5px solid transparent;
      border-left: 6px solid #000000;
   }
   #brand .brandin dd {
      padding: 20px 15px;
      display: flex;
      flex-direction: column;
      height: 100%;
   }
   .jpmap {
      display: none !important;
   }
   .jpmaptxt {
      margin-top: 0;
      font-size: 1.2rem;
   }
   #brand + .itemlist ul li:nth-child(2), #brand + .itemlist ul li:nth-child(6) {
      display: none;
   }
   #brand + .itemlist ul li {
      width: calc(100% / 4);
      box-sizing: border-box;
      line-height: 0;
   }
   #brand + .itemlist ul li:nth-child(2) {
      order: 1;
   }
   #brand + .itemlist ul li:nth-child(5) {
      order: 4;
   }
   #brand + .itemlist ul li:nth-child(3) {
      order: 1;
   }
   #brand + .itemlist ul li:nth-child(4) {
      order: 1;
   }
   #brand_sp h2.noiconhead {
      text-align: center;
      margin: auto;
      padding: 1.5rem 0;
      font-size: 2.6rem;
      border-top: 1px solid #000;
      border-bottom: 1px solid #000;
   }
   .jpmaptxt dd {
      padding: 25px;
      margin-top: 1rem;
   }
   /* recipes
    -----------------------------------*/
   #recipes .d-flex {
      flex-direction: column;
   }
   #recipes .d-flex > div {
      width: 100%;
      letter-spacing: .3px;
      font-size: 1.2rem;
      padding: 0 10px;
   }
   #recipes + .itemlist ul li {
      width: calc(100% / 3);
      box-sizing: border-box;
      line-height: 0;
   }
   #recipes + .itemlist ul li img {
      width: 100%;
      object-fit: cover;
      height: 125px;
   }
   /* delivery
    -----------------------------------*/
   #delivery {
      padding: 3rem 0 4rem;
   }
   #delivery h2 {
      margin-bottom: 3rem;
   }
   #delivery .d-flex > div {
      width: 100%;
      margin-right: 0;
   }
   #delivery p {
      margin-bottom: 1.5em;
      font-size: 1.2rem;
      padding: 0 10px;
   }
   #delivery .d-flex > ul li a {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      overflow: hidden;
      width: 100%;
      height: 158px;
      padding: 30px;
   }
   #delivery .d-flex > ul li img {
      width: 100%;
      height: auto;
   }
   #delivery .d-flex > ul li.as a {
      justify-content: center;
   }
   /* footer
    -----------------------------------*/
   footer ul.logoul {
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 3rem auto 2rem;
   }
   footer .footerinner > ul.nav {
      border-top: 1px solid #c2996b;
      border-bottom: 1px solid #c2996b;
      display: none;
   }
   footer ul.logoul li {
      margin: auto 5px;
   }
   footer ul.logoul img {
      width: 80%;
   }
   /*LICENCE*/
   .offerlo-list li:nth-child(-n+2)::before {
      top: 24%;
   }
    .bglr::after,
    .bglr::before {
        background: none;
    }
    .leftbg,.rightbg{
       display: none;
    }
}
@media(max-width:375px) {
   /* delivery
    -----------------------------------*/
   #delivery .d-flex > ul span {
      display: block;
      color: #000;
      font-size: 1.3rem;
      font-family: trajan-pro-3, serif;
      font-weight: 400;
      font-style: normal;
      line-height: 1.2;
   }
   #delivery .d-flex > ul li a {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      overflow: hidden;
      width: 100%;
      height: 158px;
      padding: 25px;
   }
}