@charset "UTF-8";
/**************************************
							共 通 項 目
**************************************/
/**************************************
						      大 枠
**************************************/
.wrapper { width: 100%; margin: 0; padding: 0; font-size: 0; display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; }
.wrapper .naviArea { width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; background-color: #FFF; }
.wrapper .naviArea .header { width: 100%; display: flex; align-items: center; justify-content: space-between; }
.wrapper .naviArea .header .logo { height: 80px; width: 153px; position: relative; }
.wrapper .naviArea .header .logo a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
.wrapper .naviArea .header .logo img { height: 100%; width: auto; max-width: 180px; }
.wrapper .naviArea .globalNavi { display: none; position: absolute; top: 80px; }
.wrapper .mainContent { width: 100%; margin-top: 80px; }
.wrapper .anchor-point { padding-top: 80px; margin-top: -80px; }
@media (min-width: 992px) { .wrapper .naviArea { width: 24%; height: 100vh; overflow-y: auto; justify-content: flex-start; flex-direction: column; border-bottom: none; scrollbar-color: #AAA transparent; scrollbar-width: thin; }
  .wrapper .naviArea::-webkit-scrollbar { width: 7px; background-color: transparent; }
  .wrapper .naviArea::-webkit-scrollbar-thumb { background-color: #AAA; border-radius: 7px; }
  .wrapper .naviArea .header .logo { width: 100%; height: auto; display: flex; align-items: center; justify-content: center; }
  .wrapper .naviArea .header .gnav_btn { display: none; }
  .wrapper .naviArea .globalNavi { display: block; position: relative; top: 0; }
  .wrapper .mainContent { width: 76%; max-width: 1920px; position: absolute; top: 0; left: 24%; margin-top: 0; }
  .wrapper .anchor-point { margin-top: 0; padding-top: 0; } }

/************************************* ナ ビ ゲ ー シ ョ ン エ リ ア
**************************************/
/***SP用ナビ開閉ボタン***/
.gnav_btn { font-size: 0px; display: flex; justify-content: space-between; align-items: center; padding: 0; }

#panel-btn { display: inline-block; position: relative; width: 80px; height: 80px; background-color: #9B133F; transition: 0.6s; }
#panel-btn:hover { background: #9B133F; }

#panel-btn-icon { display: block; position: absolute; top: 50%; left: 50%; width: 15px; height: 2px; margin: -1px 0 0 -7.5px; background: #FEFEFE; transition: .2s; }
#panel-btn-icon:before, #panel-btn-icon:after { display: block; content: ""; position: absolute; top: 50%; left: 0; width: 15px; height: 2px; background: #FEFEFE; transition: .3s; }
#panel-btn-icon:before { margin-top: -7.5px; }
#panel-btn-icon:after { margin-top: 5px; }

#panel-btn #panel-btn-icon.close { background-color: transparent; }

#panel-btn.close #panel-btn-icon:before, #panel-btn.close #panel-btn-icon:after { background: #FEFEFE; }

#panel-btn .close:before, #panel-btn .close:after { margin-top: 0; }

#panel-btn .close:before { transform: rotate(-45deg); }

#panel-btn .close:after { transform: rotate(-135deg); }

/***グローバルナビ***/
.globalNavi { width: 100%; display: flex; flex-wrap: wrap; background-color: #9B133F; z-index: 9999; height: calc(100vh - 80px); overflow-y: auto; color: #FBFACE; }
.globalNavi li { font-size: initial; font-weight: 400; line-height: 1.1; border-top: dashed 1px #E16A79; position: relative; }
.globalNavi li:first-child { border-top: none; }
.globalNavi li span { font-size: 0.8em; color: #FEFEFE; }
.globalNavi li img { width: 100%; height: auto; }
.globalNavi li a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
.globalNavi li:hover { background-color: #850D40; }
@media (min-width: 992px) { .globalNavi { height: auto; } }

/**************************************
				メ イ ン コ ン テ ン ツ
**************************************/
.content-box { background: #f9f9f9; /* Old browsers */ background: -moz-linear-gradient(top, #f9f9f9 1%, #DDDDDD 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #f9f9f9 1%, #DDDDDD 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #f9f9f9 1%, #DDDDDD 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#DDDDDD',GradientType=0 ); /* IE6-9 */ }

.content-box h2 { font-family: serif; text-align: center; font-weight: 700; font-size: 2.4rem; font-size: clamp(2.4rem, calc(2.4rem + ((1vw - 0.48rem) * 5.9259)), 4rem); line-height: 1.6; }
.content-box h3 { font-family: serif; text-align: center; font-weight: 500; font-size: initial; }
.content-box .summary { font-size: initial; }
.content-box .newArrival h4 { font-size: 2.8rem; font-size: clamp(2.4rem, calc(2.4rem + ((1vw - 0.48rem) * 0.7407)), 2.6rem); font-weight: 300; border-bottom: solid 1px #FFCD00; }
.content-box .newArrival h4 span { font-size: 0.4em; color: #666; }
.content-box .newArrival .model { font-size: initial; border-bottom: dashed 1px #BBB; display: flex; align-items: center; flex-wrap: wrap; }
.content-box .newArrival .model p { display: inline-block; font-size: 0.8em; }
.content-box .newArrival .model p:first-child { font-size: initial; font-weight: 500; width: 100%; }
.content-box .newArrival .cart { margin-right: 0; background-color: #FFCD00; color: #FEFEFE; font-size: initial; position: relative; width: 100%; text-align: center; display: inline-block; }
.content-box .newArrival .cart span { letter-spacing: 0.1rem; font-size: 0.8em; }
.content-box .newArrival .cart:hover { color: #00B8BF; }
.content-box .newArrival .cart a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
@media (min-width: 576px) { .content-box .newArrival .model p:first-child { width: auto; } }
@media (min-width: 1200px) { .content-box .newArrival .cart { width: auto; } }
.content-box .newArrival .movie { position: relative; background-color: #000; }
.content-box .newArrival .movie .tbn { transition: .4s; }
.content-box .newArrival .movie .start { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 15%; max-width: 213px; height: auto; }
.content-box .newArrival .movie a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
.content-box .newArrival .movie:hover .tbn { opacity: .6; }

/**************************************
							店 舗 情 報
**************************************/
.footer { background-color: #333; color: #FEFEFE; }

.shopinfo { text-align: center; }
.shopinfo .shopinfo-txt1 { font-size: 3.6rem; font-size: clamp(3.6rem, 4.6vw, 5rem); font-weight: 700; letter-spacing: -0.1rem; line-height: 1.0; }
.shopinfo .shopinfo-txt2 { /*font-size: 1.8rem; font-size: clamp(1.8rem, 2.35vw, 2.55rem);*/ font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.48rem) * 1.4815)), 1.8rem); font-weight: 700; }
.shopinfo p.shopelement { margin: auto; border-top: 1px dashed #FEFEFE; font-size: 1.4rem; font-size: clamp(1.4rem, 1.6vw, 1.6rem); text-align: left; width: 80%; }
.shopinfo p.shopelement span { display: block; font-size: 1.8rem; font-size: clamp(1.8rem, 2vw, 2rem); font-weight: 700; letter-spacing: -0.1rem; }
.shopinfo a { color: #FEFEFE; transition: color .3s ease-out; }
@media (min-width: 1200px) { .shopinfo { text-align: left; }
  .shopinfo p.shopelement { width: 100%; } }

.shopelement a { color: #FEFEFE; transition: color .3s ease-out; }

.shopinfo a:hover, .shopelement a:hover { color: #B1E76F; }

.mapimg { text-align: center; }
.mapimg img { width: 90%; height: auto; max-width: 600px; }

.copyright { color: #CCC; width: 100%; font-size: 1.2rem; text-align: center; }
