@charset "utf-8";

#header-new {  
  width:100%;
  position:fixed;
  top:0;
  background:#fff;
  z-index:9999;
}
#header-new .inner {
  max-width:128rem;
  padding:0 2rem;
  display:flex; 
  align-items:center;
  justify-content:space-between;
  margin:0 auto 1rem;
}

#header-new .menu-area { width:100%; }

/* サブメニュー */
#header-new .menu-area .sub { display:table; font-size:1.4rem; margin-left:auto; margin-top:1rem; }
#header-new .menu-area .sub p { display:inline-block; margin:0; }
#header-new .menu-area .sub p a { color:#333; padding:0 1rem; border-right:solid 1px #333; }
#header-new .menu-area .sub p.last a{ border-right:none; }
#header-new .menu-area .sub input { width:150px; color:#333; }
#header-new .menu-area .sub .fs-p-searchForm__button { background:no-repeat; border:none; }
#header-new .menu-area .sub div { display:inline-block; }
#header-new .menu-area .sub .fs-icon--cart:before { content:url(../_img/common/ec_menu02.png); vertical-align:sub; }
#header-new .menu-area .sub .fs-p-scrollingCartButton { margin:0 5px; }

/* メインメニュー */
#header-new .menu {
  display:flex;
  position: relative;
  width: 100%;
  height: 50px;
  max-width: 90rem;
  margin-left:auto;
}
#header-new .menu > li { width:calc(100% / 6); height: 50px; line-height: 50px; }
#header-new .menu > li a { display:block; align-items:center; width:100%; color: #333; text-align:center; }

#header-new .menu > li a:hover {  }
#header-new .menu > li:hover { -webkit-transition: all .5s; transition: all .5s; }

#header-new ul.menu-sub { visibility: hidden; opacity: 0; z-index: 1; }
#header-new ul.menu-sub li { border-top: 1px solid #111; }
#header-new ul.menu-sub li a { transition:.2s; border:solid 1px transparent; font-size:1.6rem; }
#header-new ul.menu-sub li a:hover { color:#707070; border:solid 1px; }
#header-new ul.menu-sub li a img { margin-right:5px; width:40px; }


/* メインメニュー　サブ */
#header-new li.menu-mega > a { font-weight: bold; }
#header-new li.menu-mega ul.menu-sub {
  position: absolute;
  top: 50px;
  left: 0;
  box-sizing: border-box;
  width: 100%;
  padding: 20px 2%;
  background: #fff;
  display:flex;
  flex-wrap:wrap;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
}

#header-new li.menu-mega ul.menu-sub a { display:flex; justify-content:center; align-items:center;　}
#header-new li.menu-mega:hover ul.menu-sub {　top: 50px; visibility: visible; opacity: 1; }
#header-new li.menu-mega ul.menu-sub > li { width:calc((100% / 3) - 0.6666rem); margin-right:1rem; border:none; }
#header-new li.menu-mega ul.menu-sub > li:nth-child(3n) { margin-right:0; }
#header-new li.menu-mega ul.menu-sub > li:nth-child(n+4) { margin-top:1px; }

/* Brand */
#header-new li.menu-mega ul.menu-sub.brand > li { width:48%; }

/* Category */
#header-new li.menu-mega ul.menu-sub.cate > li { width:calc((100% / 4) - 0.75rem); margin-right:1rem; }
#header-new li.menu-mega ul.menu-sub.cate > li.cate { width:49%; margin-right:1.5rem; margin-top:2rem; border:solid 1px #630; }
#header-new li.menu-mega ul.menu-sub.cate > li.cate a { color:#630!important; font-weight: bold; }
#header-new li.menu-mega ul.menu-sub.cate > li.cate.last { margin-right:0; }
#header-new li.menu-mega ul.menu-sub.cate > li:nth-child(3n) { margin-right:1rem; }
#header-new li.menu-mega ul.menu-sub.cate > li:nth-child(4n) { margin-right:0; }

/* 下矢印 */
#header-new .init-bottom:after {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 0 0 15px;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.head_under { display:none; }

@media screen and (max-width:940px){
  #header-new .menu-area .sub { font-size:1.2rem; }
  #header-new .menu-area .sub input { width:100px; }
  #header-new .menu-area .menu { font-size: 1.3rem; }
}
@media screen and (max-width:840px){
  #header-new .menu-area .sub { font-size:1rem; }
}
@media screen and (max-width:768px){
  #header-new .inner { height:8rem; margin:0 auto; }
  #header-new .menu-area { display:none; }
  /* sp */
  .head_under { display:block; padding:0; width:100%; }
  .head_left ul { align-items:center; }
}
@media screen and (max-width:414px){
  #header-new h1.logo { max-width:50%; }
}

/* SNSボタン */
#sns { position:fixed; right:0; top:30%; z-index:10000; }
#sns > ul > li { 
  color:#fff;
  background:#630;  
  position:relative;
  border-radius:5px 0 0 5px;
  margin-bottom:0.5rem;
  transform:translateX(12rem);
  transition:ease .3s;
  height:4rem;
}
#sns > ul > li:hover {
  background:#fff;
  border:solid 1px #630;
  border-right:none;
  color:#630;
}
#sns > ul > li:nth-child(4) { z-index:10; }
#sns > ul > li:nth-child(4):hover {
  border-bottom:none;
  border-radius:5px 0 0 0;
}
#sns > ul > li:nth-child(5) { z-index:1; }
#sns > ul > li:nth-child(5):hover {
  border-bottom:none;
  border-radius:5px 0 0 0;
}
#sns > ul > li > a { color:#fff; display:flex; align-items:center; width:12rem; display:flex; align-items:center; font-weight: bold; padding:5px 1rem; float:left; }
#sns ul li:hover a { color:#630; }
#sns ul li i { display:block; font-size:3rem; width:4rem; height:4rem; line-height:4rem; text-align:center; float:left; }
#sns ul li:hover , #sns > ul > li.active { transform:translateX(0); }

#sns ul li ul.sub { height:0; max-height:0; overflow:hidden; transition:all .2s ease-out; opacity:0; position:absolute; top:100%; left:-1px; z-index:10; background:rgba(255,255,255,.9); width:101%; border:solid 1px #630; border-top:none; border-right:none; border-radius:0 0 0 5px; }
#sns ul li:hover ul.sub { height:auto; max-height:40rem; opacity:1; overflow:visible; z-index:10; }
#sns ul li ul.sub li { height:auto; overflow:hidden; }

@media screen and (max-width:768px){
  #sns { display:none; }
}

/* sp */
#nav .under_menu { padding-bottom:0; }
#nav .under_menu li:last-child { border:none; }
#nav ul.sns { background:rgba(255,255,255,.9); }
#nav ul.sns li {  }
#nav ul.sns li:last-child { border:none; }
#nav ul.sns li a { display:flex; align-items:center; }
#nav ul.sns li i { font-size:4rem; margin-right:2rem; }
#nav ul.sns li:nth-child(1) i { color:#1877f2; }
#nav ul.sns li:nth-child(2) i { color:#1DA1F2; }
#nav ul.sns li:nth-child(3) i { color:#DA1725; }
#nav ul.sns li:nth-child(4) i { color:#D93177; }
#nav ul.sns li:nth-child(5) i { color:#06c755; }
#nav ul.sns li.insta input { display:none; }
#nav ul.sns li.insta label{ position:relative; display:flex; align-items:center; }
#nav ul.sns li.insta label:after { 
  font-family:"Font Awesome 5 Pro";
  content:"\f107";
  width:auto;
  height:auto;
  display:block;
  position:absolute;
  right:2rem;
  top:50%;
  transform:translateY(-50%);
  font-size:3rem;
}
#nav ul.sns li.line input { display:none; }
#nav ul.sns li.line label{ position:relative; display:flex; align-items:center; }
#nav ul.sns li.line label:after { 
  font-family:"Font Awesome 5 Pro";
  content:"\f107";
  width:auto;
  height:auto;
  display:block;
  position:absolute;
  right:2rem;
  top:50%;
  transform:translateY(-50%);
  font-size:3rem;
}
#nav ul.sns li .accshow { height:0; padding:0; opacity:0; overflow:hidden; transition:0.8s;  }
#nav ul.sns li .accshow p:last-child a { border:none; }
#nav ul.sns li .accshow p a img { width:6rem; }
#nav ul.sns li .cssacc:checked + .accshow { height:auto; padding:5px; opacity:1; }

@media screen and (max-width:768px){
  #nav { height:calc(100% - 8rem)!important; }
}

.sample { height:100vh; }
#header-new .fs-p-scrollingCartButton__label, #header-new .fs-p-cartItemNumber { display:none; }
div.fs-l-page { margin-top:9.5rem; }
main.fs-l-main { margin:0 auto; }

@media screen and (max-width:768px){
  div.fs-l-page { margin-top:8rem; }
}

/* 営業時間 20250326 ----------*/
#header-new .inner {margin: 1rem auto 1rem;}
#header-new .inner .businesshours{font-size: 1.2rem; letter-spacing: -0.05rem; text-align: left;}
@media screen and (max-width: 768px) {
	#header-new .logo.header-logo {max-width: 40%;}
}