@charset "UTF-8";

 /* CSS Document */
 
  
 /*------------------------------------------------------------
      Browser Default Initialization seo_responsive_white
 ------------------------------------------------------------*/
  * {margin:0;padding:0;}
  html {
      /*overflow-y: scroll;*/
      height: 100vh;
      background:#FAFAFA;
  }
  body {
      margin: 0;
      padding: 0;
      font-family: 'Noto Sans JP', sans-serif;
      
      color: #333;
      font-size: 16px;
      line-height: 125%;
      text-align: left;
      -webkit-text-size-adjust: 100%;
      background-color: #FFF;
      height: 100%;
      word-wrap: break-word;
	  font-family: verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
  }
  div, dl, dt, dd, ul, ul li, ol, ol li, h1, h2, h3, h4, h5, h6,
  pre, form, fieldset, p, blockquote, th, td,
  section, nav, article, aside, hgroup, header, address,
  figure, figcaption {
      margin: 0;
      padding: 0;
  }
  address, caption, cite, code, dfn, em, strong, th, var {
      font-style: normal;
      font-weight: normal;
  }
  table {
      border-collapse: collapse;
      border-spacing: 0;
      width: 100%;
  }
  caption, th {text-align: left;}
  q::before, q::after {content: '';}
  object, embed {
      vertical-align: top;
  }
  hr {
      display: none;
  }
  h1, h2, h3, h4, h5, h6 {
      font-size: 100%;
  }
  img, abbr, acronym, fieldset {
      border: 0;
  }
  img {
      -ms-interpolation-mode: bicubic;
      border: none;
  }
  ul li, ol li {list-style-type: none;}
  input[type="text"], input[type="password"] {
      border: 1px solid #A9A9A9;
      box-sizing: border-box;
      font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
      padding: 0 2%;
  }
  select {
      background-color: #FFF;
      border: 1px solid #A9A9A9;
      box-sizing: border-box;
  }
  textarea {
      border: 1px solid #A9A9A9;
      box-sizing: border-box;
      padding: 2%;
  }
  a {
     outline: none;
     text-decoration: none;
  }
  a:link {
      color: #333;
      text-decoration: none;
  }
  a:visited {
      color: #333;
      text-decoration: none;
  }
  a:hover {
      color: #666;
      text-decoration: none;
  }
  a:hover img {
      opacity: .70;
      filter: alpha(opacity=70);
      -ms-filter: "alpha(opacity=70)";
      -khtml-opacity: .70;
      -moz-opacity: .70;
      cursor: pointer;
  }
  a:active {
      text-decoration: none;
      color: #c00;
  }
  img {
      max-width: 100%;
      height: auto;
      width: auto;
  }
  
  
  
  
  
  input[type="button"], input[type="submit"], input[type="image"] {
     -webkit-appearance: none;
     border-radius: 0;
     box-sizing: border-box;
  }
  input[type="text"], input[type="password"] {
     padding: 0 2%;
  }
  input[type="radio"], input[type="checkbox"] {
     position: relative;
     top: 3px;
  }
  #wrapper {
      width: 100%;
      background-color: #fff;
      min-height: 100%;
  }
  article h1 {
      border-top: 3px solid #333;
      color: #333;
      font-size: 90%;
      font-weight: bold;
      letter-spacing: 0.05em;
      padding: 19px 0;
      margin-bottom: 15px;
  }
  article h2 {
      background: none repeat scroll 0 0 transparent;
      border-top: 3px solid #333;
      font-size: 80%;
  }
  .w100 {
      width: 100%;
  }
  .bold {
      font-weight: bold;
  }
  #contents-pop {
      width: auto;
  }
  div#wrapper div#enquete-header,
  div#wrapper > div#cart-header,
  header {
      width:100%;
      margin:0 auto;
      background-color: #FFF;
  }
  #header-inner {
      width: 1200px;
      margin: 0 auto;
      *zoom: 1;
  }
  header #header-inner{
        }
  #header-inner #logo, #hNav {
      display: table-cell;
      vertical-align: middle;
      padding: 5px 0;
  }
  #header-inner #hNav {
      text-align: right;
      vertical-align: top;
      width: 860px;
  }
  * html #header-inner div {
    display: inline;
    zoom: 1;
  }
  *:first-child+html #header-inner div {
    display: inline;
    zoom: 1;
  }
  #header-inner #logo {width: 340px;}
  #header-inner h1 {
      max-width: 340px;
      background: none;
      margin: 0;
      padding: 0;
  }
  #header-inner h1 a img:hover, #header-inner h2 a img:hover {
      opacity: 1;
      filter: alpha(opacity=100);
      -ms-filter: "alpha(opacity=70)";
      -khtml-opacity: 1;
      -moz-opacity: 1;
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  }
  #hNav #searchbox_wrap {
      overflow: hidden;
      margin: 10px 0;
  }
  #hNav #searchbox {
      line-height: 160%;
      font-size: 65%;
      color: #999;
      text-align:right;
      float: right;
      overflow: hidden;
  }
  #hNav #searchbox p {
      float: left;
      margin: 3px 5px 0 0;
  }
  #hNav #searchbox p img {
      vertical-align: bottom;
  }
  #hNav #searchbox form {
      border: 1px solid #272727;
      box-sizing: border-box;
      float: left;
      height: 30px;
      width: 230px;
  }
  #hNav #searchbox input.searchbox {
      border: none;
      box-sizing: border-box;
      float: left;
      height: 28px;
      padding: 0 5px;
      width: 82%;
  }
  #hNav #searchbox input.searchSubmit {
      border: 0;
      padding: 0;
      width: 18%;
 }
  #hNav ul#keyword {
      line-height: 80%;
      color: #333;
      text-align: right;
      margin-top: 5px;
      overflow: hidden;
  }
  #hNav ul#keyword li {
      display: inline;
  }
  #hNav ul#keyword li a {
       background-color: #F5F5F5;
       border-radius: 3px;
       display: inline-block;
       font-size: 60%;
       margin: 0 0 1%;
       padding: 1% 2%;
  }
  #hNav ul#header-nav {
      color: #999;
      line-height: 100%;
  }
  #hNav ul#header-nav li {
      display: inline-block;
      *display: inline;
      *zoom: 1;
      font-size: 80%;
      line-height: 120%;
      padding: 15px 0 15px 15px;
      text-align: center;
  }
  #hNav ul#header-nav li a:hover {
      opacity: .70;
      filter: alpha(opacity=70);
      -ms-filter: "alpha(opacity=70)";
      -khtml-opacity: .70;
      -moz-opacity: .70;
  }
  #hNav ul#header-nav li#header-nav-mypage a::before {
      content: '';
      background: url(../img/rps_mypage_icon.png);
      background-size: contain;
      display: inline-block;
      height: 20px;
      margin-right: 5px;
      position: relative;
      top: 5px;
      width: 20px;
  }
  #hNav ul#header-nav li#header-nav-cart a::before {
      content: '';
      background: url(../img/rps_cart_icon.png);
      background-size: contain;
      display: inline-block;
      height: 20px;
      margin-right: 5px;
      position: relative;
      top: 5px;
      width: 20px;
  }
 
  #gnav {
      width: 100%;
      background-color: #444;
	  display: none;
  }
  #gnav div.cart-nav,
  #gnav nav {
      width: 1200px;
      margin: 0 auto;
      overflow: hidden;
      *zoom: 1;
  }
  #gnav div.cart-nav ul,
  #gnav nav ul {
      background-color: #333;
      display: table;
      table-layout: fixed;
      margin-bottom: 0;
      width: 100%;
  }
  #gnav div.cart-nav ul li,
  #gnav nav ul li {
      background-color: #333;
      display: table-cell;
      font-size: 85%;
      text-align: center;
      vertical-align: middle;
  }
  #gnav div.cart-nav ul li a,
  #gnav nav ul li a {
      display: block;
      padding: 18px 1px;
  }
  #gnav div.cart-nav ul li a:link,
  #gnav div.cart-nav ul li a:visited,
  #gnav nav ul li a:link,
  #gnav nav ul li a:visited {
      color: #FFF;
  }
  #gnav div.cart-nav ul li a:hover,
  #gnav div.cart-nav ul li a:active,
  #gnav nav ul li a:hover,
  #gnav nav ul li a:active {
      color: #FFF;
      background-color: #4e4e4e;
      text-decoration: none;
  }
  #contents {
	  width: 100%;
      max-width: 1200px;
      margin: 0 auto;
      padding-top: 20px;
      overflow: inherit;
      *zoom: 1;
      padding-bottom: 57px;
  }
  #sub-column {
      box-sizing: border-box;
      float: left;
      margin-right: 40px;
      padding-bottom: 60px;
      *zoom: 1;
      word-break:break-all;
      width: 260px;
  }
  #main-column {
      box-sizing: border-box;
      float: right;
      width:100%;
      margin-bottom: 60px;
      background-color: #fff;
  }
  #main-column-full {
      width: 100%;
      margin: 0 auto 60px;
  }
  #main-column h2 {
     border-top: 3px solid #333;
     letter-spacing: 0.05em;
     padding: 21px 0;
  }
  article section,
  div#wrapper div#enquete-section,
  div.cart-article div.cart-section {
      padding: 0;
  }
  article section:first-child, div#wrapper div#enquete-section:first-child, div.cart-article div.cart-section:first-child {
      border-top: none;
  }
   article p {
      color: #333;
      font-size: 100%;
  }
  div.cart-article p {
      color: #333;
      font-size: 110%;
  }
  article a:hover p, div.cart-article a:hover p {
      color: #666;
  }
  article section ul, div#wrapper div#enquete-section ul, div.cart-article div.cart-section ul {
      font-size: 85%;
      line-height: 160%;
      color: #333;
  }
  #mainVisual { width: 100%; }
  
  
  
 
/*ハンバーガーメニュー　検索*/
  
  .leftSearch {
      background-color: #F5F5F5;
      margin-bottom: 20px;
      overflow: hidden;
  }
  .leftSearch #searchbox_wrap {
      margin: 10px 2% 15px;
      overflow: hidden;
  }
  .leftSearch searchbox {
      color: #999;
      float: right;
      font-size: 65%;
      line-height: 160%;
      overflow: hidden;
      text-align: right;
  }
  .leftSearch #searchbox form {
      border: 1px solid #777777;
      box-sizing: border-box;
      float: left;
      height: 35px;
      width: 100%;
  }
  .leftSearch #searchbox input.searchbox {
      border: none;
      box-sizing: border-box;
      float: left;
      height: 100%;
      padding: 0 5px;
      width: 80%;
	  
  }
  
    /* WebKit系（Chrome, Safariなど）の検索窓の装飾をリセット */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
  -webkit-appearance: none;
}

/* 全体の見た目リセット */
input[type="search"] {
  appearance: textfield;
  -webkit-appearance: textfield;
  outline: none;
  border: none;
}
  .leftSearch #searchbox input.searchSubmit {
      padding: 0;
      width: 20%;
  }
  .leftSearch #searchbox p {
  }
  
 /*ハンバーガーメニュー　検索*/ 
  
  #header-inner h2 {max-width : 340px;}
  .siteName {
      margin:0px;
      padding:10px 10px 5px 10px;
      font-size:100%;
      line-height:1em;
  }
  .siteName a {color:black ;}
  .siteName a:hover {
      color: blue;
      opacity: .70;
      filter: alpha(opacity=70);
      -ms-filter: "alpha(opacity=70)";
      -khtml-opacity: .70;
      -moz-opacity: .70;
  }
  .sitecopy{
      padding:10px 10px 5px 5px;
      margin:0px;
      color:#999;
      font-size:80%;
      line-height:1em;
  }
  .sitecopy a {color:black;}
  .sitecopy a:hover {
      color: blue;
      opacity: .70;
      filter: alpha(opacity=70);
      -ms-filter: "alpha(opacity=70)";
      -khtml-opacity: .70;
      -moz-opacity: .70;
  }
  .header_area {
      box-sizing: border-box;
      text-align:left;
      width: 100%;
      margin: 0 0 30px;
      padding: 0;
  }
  .footer_area {
      box-sizing: border-box;
      text-align:left;
      width: 100%;
      margin: 0;
      padding: 0;
  }
  .cart-section .header_area {
      margin: 0 auto;
  }
  .cart-section .footer_area {
      margin: 0 auto;
  }
  #contents #main-column .footer_area{padding-top:5px;}
  .pageNav form img{float:right;}
  #sub-column .category .fukidashi nav,
  #sub-column .category .tatenarabi nav,
  #sub-column .category #sps-itemListAllCategory nav {margin-bottom:0;}
  #sub-column .category .fukidashi nav:last-child,
  #sub-column .category .tatenarabi nav:last-child,
  #sub-column .category #sps-itemListAllCategory section nav:last-child {margin-bottom:20px;}
  #sub-column .category #sps-itemListAllCategory section nav:first-child {margin-bottom:0;}
  #sub-column .category .fukidashi ul {zoom:1;}
  #sub-column .category .fukidashi nav {position:relative;}
  #sub-column .category .fukidashi nav .sps-itemCategorySub {
      width:100%;
      position:absolute;
      top:0;
      left:100%;
      display:none;
  }
  #sub-column .category .fukidashi nav:hover .sps-itemCategorySub {
      display:block;
      z-index:999;
  }
  #sub-column .category .fukidashi nav .sps-itemCategorySub {
      padding: 5px;
      border-top:1px solid #DDD;
      border-left:1px solid #DDD;
      border-right:1px solid #aaa;
      border-bottom:1px solid #aaa;
      background:#fff;
  }
  #sub-column .category .fukidashi nav .sps-itemCategorySub .cat2 a {
      color:#333;
      font-weight:normal;
  }
  #sub-column .category .fukidashi nav .sps-itemCategorySub .cat2 a:hover {
      color:#333;
      font-weight:normal;
  }
  #sub-column .category nav ul li.listcat2 a {
      zoom: 1;
      display: block;
      padding: 15px 12px 15px 2%;
      margin:0px 0;
      line-height: 100%;
      color:#000;
      font-weight:bold;
  }
  #sub-column .category nav ul li.listcat3 a {
      zoom: 1;
      display: block;
      padding: 15px 12px 15px 6%;
      margin:0px 0;
      line-height: 100%;
      color:#000;
  }
  #sub-column .category nav ul li.child a {color:#000;}
  section.half-cont div.category section {
      margin: 0 0 23px;
  }
  section.half-cont div.category section:last-child {
      margin: 0;
  }
  section.half-cont div.category section nav ul {
      font-size: 100%;
  }
  section.half-cont div.category section nav ul li {
      font-size: 85%;
      line-height: 150%;
  }
  #sub-column .category .sps-allList {margin-bottom:20px;}
  #sub-column .category .sps-allList+#sps-itemListAllCategory {
      display:none;
      margin-top:-20px;
  }
  #center1 .centerbox .mainCont h3 {
      border-top: 3px solid #333;
      color: #333;
      font-size: 130%;
      font-weight: bold;
      margin: 0;
      padding: 21px 0;
  }
  #contact #center1 .centerbox h3.title1 {
      border-top: 3px solid #333;
      color: #333;
      font-size: 130%;
      font-weight: bold;
      margin: 30px 0 0 0;
      padding: 21px 0;
  }
  #center1 .centerbox .mainCont .column-set .column5 h3,
  #center1 .centerbox .mainCont .column-set .column5 h3 {
      border-top: none;
      font-weight: bold !important;
      margin: 0 0 7px !important;
  }
  .mainCont p.no2 {
     font-size: 130%;
     width: 900px !important;
  }
 


/*メニュー*/
   #hNav nav, #hNav .cart-nav {
       position: absolute;
       top: 20px;
       right: 2%;
   }
   #hNav ul#header-nav li {
       color: #333;
       font-size: 80%;
       margin-right: 62px;
       padding: 0 5px;
   }
   #hNav ul#header-nav li#header-nav-mypage a::before,
   #hNav ul#header-nav li#header-nav-cart a::before {
       display: block;
       height: 28px;
       margin: 0 auto 3px;
       top: 0;
       width: 28px;
   }
   #hNav ul#header-nav li#header-nav-cart {
       margin-left: -62px;
   }
 
#hNav ul#header-nav li#header-nav-drawer {
       background: #FFF;
       border: 1px solid #888;
       border-radius: 5px;
       box-sizing: border-box;
       cursor: pointer;
       display: inline-block;
       height: 46px;
       margin: 0;
       padding: 0;
       position: fixed;
       right: 2%;
       top: 20px;
       white-space: nowrap;
       width: 46px;
       z-index: 150;
   }
   #header-nav-drawer span {
       display: block;
       position: absolute;
       top: 50%;
       left: 50%;
       width: 24px;
       height: 3px;
       margin: -3px 0 0 -12px;
       background: #777;
       transition: .2s;
   }
   #header-nav-drawer span::before, #header-nav-drawer span::after{
       display: block;
       content: "";
       position: absolute;
       top: 50%;
       left: 0;
       width: 24px;
       height: 3px;
       background: #777;
       transition: .3s;
   }
   #header-nav-drawer span::before{
       margin-top: -10px;
   }
   #header-nav-drawer span::after{
       margin-top: 7px;
   }
   #header-nav-drawer.spsDrawerOpen span {
       background: transparent;
   }
   #header-nav-drawer.spsDrawerOpen span::before, #header-nav-drawer.spsDrawerOpen span::after{
       margin-top: 0;
   }
   #header-nav-drawer.spsDrawerOpen span::before{
       -webkit-transform: rotate(-45deg);
       transform: rotate(-45deg);
   }
   #header-nav-drawer.spsDrawerOpen span::after{
       transform: rotate(-135deg);
       -webkit-transform: rotate(-135deg);
   }
/* サイドメニューオープン(768px) */
   #sub-column.spsDrawerOpen {
       transition: .5s transform ease-in-out;
       transform: translateX( -100% );
       -webkit-overflow-scrolling: touch;
       z-index: 100;
   }
   #wrapper.spsDrawerOpen::before {
       background: rgba(0,0,0,.6);
       content: "";
       height: 100%;
       left: 0;
       position: fixed;
       top: 0;
       width: 100%;
       z-index: 50;
   }
   #sub-column.spsDrawerClose {
       transition: .5s transform ease-in-out;
       transform: translateX( 0 );
       -webkit-overflow-scrolling: touch;
       z-index: 100;
   }
   #sub-column .group, #sub-column .category, #sub-column #followUs, #sub-column .newItem, #sub-column .link {
       margin-bottom: 20px;
   }
   #sub-column h2 {
       background-color: #F5F5F5;
       padding: 19px 2%;
   }
   #sub-column .group nav ul li a, #sub-column .category nav ul li a, #sub-column .link nav ul li a {
       font-size: 100%;
   }
   #sub-column .freeArea2 .free-contents {
       background-color: #FFF;
       font-size: 80%;
       padding: 2%;
   }
   .freeArea2.shopDiary p {
     font-size: 100%;
   }
 /*-----------------------------------------------------*/
 /*	for -960px					*/
 /*-----------------------------------------------------*/
 @media screen and (max-width: 960px) {
   #header-inner {
       box-sizing: border-box;
       padding: 0 2%;
   }
   input[type="text"] {
       display: block;
   }
   .column-set .quantityArea input[type="text"],  div.enquete-section input[type="text"], #center1 input[name="RECV_NGDAY"], #center3 input[name="RECV_NGDAY"],
   h2.sps-add-to-cart-together input[type="text"], section#itemDetail-wrap table.spec td input, .column4 h2 input, .column5 h2 input {
      display: inline;
   }
 }
 
 /*-----------------------------------------------------*/
 /*	for -768px					*/
 /*-----------------------------------------------------*/
 @media screen and (max-width: 768px) {
   #wrapper {
       width: 100%;
       min-width: 100%;
 	}
   #header-inner {
       background-size: cover !important;
       box-sizing: border-box;
       padding: 0 2%;
       position: relative;
       width: 100%;
   }
 	#header-inner #logo {
       display: block;
       margin-bottom: 10px;
       min-height: 46px;
       padding: 20px 0 0;
       text-align: left;
       width: 33%;
   }
 	#header-inner #hNav {
       display: block;
       overflow: hidden;
       margin: 15px 0 0;
       width: 100%;
   }
 	#hNav ul#keyword li a {
       background-color: #EFEFEF;
       border-radius: 3px;
       display: inline-block;
       float: none;
       margin: 0 0 2%;
       padding: 2%;
   }
 
   
   
 
   /*-- 検索ボックス(768px) --*/
   #hNav #searchbox_wrap {
       margin: 0 0 10px;
       width: 100%;
 	}
   #hNav #searchbox {
       float: none;
       overflow: hidden;
       margin: 0px auto;
       width: 100%;
 	}
   #hNav #searchbox p {
       display: none;
       margin: 0;
 	}
   #hNav #searchbox form {
       height: 50px;
       position: relative;
       width: 100%;
 	}
   #hNav #searchbox input.searchbox {
 	    height: 48px !important;
       padding: 0 70px 0 5px;
       width: 100%;
   }
   #hNav #searchbox input.searchSubmit {
       background-color: #777;
       height: 48px;
       position: absolute;
       right: 0;
       top: 0;
       width: 70px;
 	}
   input[type="text"], input[type="password"] {
       border-radius: 0;
       height: 40px !important;
       box-sizing: border-box;
   }
   input[type="button"], input[type="submit"] {
       height: 40px;
       box-sizing: border-box;
   }
   input[type="image"] {
       border-radius: 0;
       height: auto;
       box-sizing: border-box;
   }
   select {
       background-color: #FFF;
       border: 1px solid #A9A9A9;
       border-radius: 0;
       box-sizing: border-box;
       height: 40px;
   }
 
   /*グローバルナビ(768px)*/
   #gnav div.cart-nav, #gnav nav {
       width: 100%;
   }
 
   #contents {
 	    width: 100%;
 	}
 	#main-column {
       box-sizing: border-box;
 	    float: none;
       margin-bottom: 0;
       padding: 0 5%;
       width: 100%;
       background-color: #fff;
 	}
   .w100, article section, section {
       box-sizing: border-box;
   }
   section section {
       padding: 0;
   }
 

 
 
   /*フッター(768px)
   div#cart-footer, footer {
       min-width: 100%;
       width: 100%;
 	}
	*/
 	#footer-inner {
       background-color: #333;
       width: 100%;
   }
   div#cart-footer #footer-inner .footer_gnavi, footer #footer-inner .footer_gnavi {
       float: none;
   }
   div#cart-footer div.cart-nav, footer nav, #copyright {
       float: none;
   }
   #contents #main-column .footer_area {
      margin: 0;
   }
   #subc_freeArea {
      margin: 0;
      padding: 5px 2% 20px;
   }
   #subc_freeArea img {
      margin: 0;
   }
   div.enquete-section #contact #center1 .centerbox .mainCont .mainFrame .mainCont form[name=ENQ] table {
      width: 100%;
   }
   
   
 }
 

 /*ハンバーガーメニュー*/
.widget ul {
   margin: 0;
}
.widget li {
   position: relative;
}
.widget li a {
   font-size: 14px;
   text-decoration: none;
   padding: 17px 55px 17px 20px;
   border-bottom: 1px dotted #ddd;
   display: block;
   position: relative;
	background: #fff;
}

.widget li a {
    font-size: 14px;
    text-decoration: none;
    padding: 17px 55px 17px 20px;
    border-bottom: 1px dotted #ddd;
    display: block;
    position: relative;
    background: #fff;
}


.widget li a:hover {
   color: #000;
}
/*開閉ボタン*/
.widget .accodionBtn {
   display: block;
	  width: 100%;
	  height: 55px;
	  position: absolute;
	  top: 0;
	  right: 0;
	  padding: 17px 15px 15px 17px;
	  text-align: right;
	  box-sizing: border-box;
	cursor:pointer;
}
.widget .accodionBtn:before {
   content: "＋";
   color: #888;
   font-size: 25px;
}
.widget .active .accodionBtn:before {
   content: "－";
color: #fff;
}
.widget .active .parent_link{
  background: #000000;
  color: #fff;
}
/* 子カテゴリー */
.widget li ul {
   margin: 0;
}
.widget li ul a {
   padding-left: 2em;
}
.sns_side_area{
	padding-bottom: 125px;	
}
.sns_side_area a{
	width: 100%;
	display: block;
	padding: 17px 0 17px 37px;
	text-align: left;
	font-size: 14px;	
	box-sizing: border-box;
}
.sns_side_area a.ins{
	background: url(/hpgen/HPB/img/common/Instagram_icon.svg) no-repeat;
	  background-size: 24px;
	  background-position: center left;			
}
.sns_side_area a.line{
	background: url(/hpgen/HPB/img/common/line_icon.svg) no-repeat;
	  background-size: 25px;
	  background-position: center left;			
}
.link_side_area a{
	width: 100%;
	display: block;
	padding: 17px 0;
	text-align: left;
	background: url(/hpgen/HPB/img/common/arrow.svg) no-repeat;
  background-size: 10px;
  background-position: center right;
	border-bottom: 1px solid #EFEFEF;
	font-size: 12px;
	box-sizing: border-box;
}
.member_side_box{
background: #fff;
padding: 17px 15px;
/***デフォルト設定　margin-top: -18px;*/
margin-top: 50px;
}
.member_side_box p{
	text-align: center;
	font-size: 12px; 
}
.login_side_area{
	display: flex;
	margin-bottom: 20px;
}
.login_side_area a{
	width: 50%;
	display: block;
	padding: 20px 20px;
	text-align: left;
	background: url(/hpgen/HPB/img/common/arrow.svg) no-repeat;
  background-size: 10px;
  background-position: center right 20px;
	border: 1px solid #EFEFEF;
	font-size: 12px;
	
}

/*--ヘッダ　画像あり------------------------------------------------------------*/
.icon_list ul{
		display: flex;
  		justify-content: flex-end;
	}
	.icon_list ul li{
		width: 44px;
		height: 44px;
		background: #000;
		margin-left: 5px;
		
	}
	.header_top{
		height: 160px;
	}
	#header-inner_th{
		width: 100%;
		height: 120px;
		background: #fff;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100;
		transition: 1s;
	}
	@media print, screen and (max-width: 767px) {
		.header_top{
			height: 100px;
		}
		#header-inner_th{
			height: 80px;
			background: #FAFAFA;
			position: fixed;
			top: 0;
			left: 0;
		}
	}
	#header-inner_th .hamburger_menu{
		width: 90px;
		position: absolute;
		top: 50%;
		left: 0;
		z-index: 2;
	}
	
	#header-inner_th .logo_area{
		width: 100%;
		height: 100%;
		display: table;
		text-align: center;
		border-bottom: solid 1px #ddd;
	}
	@media print, screen and (max-width: 767px) {
		#header-inner_th .logo_area{
			padding: 0 100px;
  			box-sizing: border-box;
		}
	}
	#header-inner_th .logo_area .inner{
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
	#header-inner_th .logo_area .inner h1{
		display: inline-block;
	}
	#header-inner_th .logo_area .inner h1 a{
		display: table;
  		margin: 0 auto;
	}
	#header-inner_th .logo_area .inner h1 a img{
		display: block;
		margin: 0 0 8px;
	}
	#header-inner_th .logo_area .inner h1 a img.logo_suyunn-suyunn{ /*ロゴエリア*/
		width: 60px;
	}
	#header-inner_th .logo_area .inner h1 a img.logo_tocco-tocco{
		width: 230px;
	}
	@media print, screen and (max-width: 767px) {
		#header-inner_th .logo_area .inner h1 a img.logo_suyunn-suyunn{
			width: 30px;
		}
		#header-inner_th .logo_area .inner h1 a img.logo_tocco-tocco{
			width: 120px;
		}
	}
	#header-inner_th .icon_list{
		width: 250px;
		height: 60px;
		position: absolute;
		top: 37px;
		right: 16px;
	}
	#header-inner_th .icon_list a{
		width: 100%;
		height: 60px;
		display: block;
	}
	#header-inner_th .icon_list .search_icon{
		background: url("search.svg") no-repeat;/*虫メガネ画像*/
		background-size: 20px;
		background-position: center;
	}
	@media print, screen and (max-width: 1200px) {
		#header-inner_th .icon_list .search_icon{
			display: none;
		}
	}
	#header-inner_th  .search_icon2{
		background: url("search.svg") no-repeat;/*虫メガネ画像*/
		background-size: 20px;
		background-position: center;
		position: absolute;
		top: 40px;
  		left: 78px;
		display: none;
		width: 44px;
		height: 44px;
	}
	@media print, screen and (max-width: 1200px) {
		#header-inner_th  .search_icon2{
			display: block;
		}
	}
	@media print, screen and (max-width: 767px) {
		#header-inner_th .hamburger_menu {
			width: 60px;
		}
		#header-inner_th .search_icon2{
			top: 10px;
  			left: 53px;
		}
		#header-inner_th .icon_list{
			top: 9px;
			width: 90px;
			height: 44px;
		}
		#header-inner_th .icon_list ul li a{
			height: 46px;
		}
		#header-inner_th .information_icon{
			display: none;
		}
		#header-inner_th .favorite_icon {
			display: none;
		}
		
	}
	#header-inner_th  .search_icon2 a{
		width: 44px;
		height: 44px;
		display: block;
	}
	#header-inner_th .icon_list .information_icon{
			background: url("../img/info.svg") no-repeat;/*インフォ画像*/
		background-size: 20px;
		background-position: center;
		
		
	}
	
	#header-inner_th .icon_list .favorite_icon{
			background: url("../img/fav.svg") no-repeat;/*お気に入り画像*/
		background-size: 22px;
		background-position: center;
		
	}
	#header-inner_th .icon_list .login_icon{
			background: url("../img/menber.svg") no-repeat;/*ログイン画像メンバー*/
		background-size: 20px;
		background-position: center;
		
	}
	#header-inner_th .icon_list .cart_icon{
			background: url("../img/cart.svg") no-repeat;/*カート画像*/
		background-size: 21px;
		background-position: center;
		
	}
	#header-inner_th .icon_list #cart_info .item_cnt {
		background: #000;
		  color: #fff;
		  font-size: 10px;
		  position: absolute;
		  top: 0;
		  right: 0;
		  display: block;
		  width: 18px;
		  height: 18px;
		  border-radius: 18px;
		  text-align: center;
		  line-height: 18px;
	}
	#header-inner_th #header-nav-drawer{
		width: 36px;
		height: 34px;
		margin: -15px auto 0;
		position: relative;
		cursor: pointer;
		
	}
	#header-inner_th #header-nav-drawer span{
		margin: -3px 0 0 0;
	  left: 0;
	  width: 36px;
		height: 1px;
	}
	#header-inner_th #header-nav-drawer span::before{
		left: 0;
		width: 36px;
		height: 1px;
		margin-top: -13px;
	}
	#header-inner_th #header-nav-drawer span::after{
		content: "Menu";
		width: 39px;
		height: 1px;
		left: 0;
		background: none;
		font-size: 13px;
	}
	#header-inner_th #header-nav-drawer.spsDrawerOpen {
		position: fixed;
	}
	#header-inner_th #header-nav-drawer.spsDrawerOpen span::after{
		content: "";
		background: #777;
		margin-top: -12px;
	}
	#sub-column {
		   background-color: #FAFAFA;
		   box-sizing: border-box;
		   float: none;
		   height: 100%;
		   margin: 0;
		   overflow-y: auto;
		   padding: 20px 15px 0;
		   position: fixed;
		   left: -375px;
		   top: 0;
		   width: 375px;
	}
	#sub-column.spsDrawerOpen{
		transform: translateX( 100% );
	}
	
	
	
  /* ----------------------------------- */
/* 検索ポップアップ　画像あり
/* ----------------------------------- */
.popup {
    opacity: 0;
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: -1;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
}
.popup .popup-inner {
    background: #fff;
    padding: 30px;
    width: 50%;
    min-width: 500px;
    border-radius: 8px;
    opacity: 1;
    z-index: 1;
}
.popup .black-background {
    background: #333;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100%;
    opacity: 0;
}
.popup input[type="text"] {
    max-width: 100%;
    width: 100%;
    padding: 5px;
    box-shadow: none;
    border: 1px solid #ccc;
    font-size: 16px;
    height: 40px;
}
.popup .btn {
    width: 100%;
    clear: both;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 50px;
    margin: 30px auto 0;
    font-size: 16px;
    padding: 5px 20px;
    line-height: 1.5;
    font-weight: bold;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    text-decoration: none;
    transition: .3s ease-in;
    user-select: none;
    position: relative;
    color: #fff;
    max-width: 290px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    box-shadow: none;
    border: 1px solid #111;
    background: #111;
}
.popup .btn:hover,
.popup .btn:focus {
    text-decoration: none;
    color: #111;
    background: #fff;
    -webkit-transform: none;
    transform: none;
    margin-bottom: 0;
}
.popup .btn .icon-lg-b.icon-search {
    background: #fff;
}
.popup #searchClose {
    text-align: right;
    color: #666;
	margin-bottom: 10px;
}
.popup #searchClose p {
    display: inline-block;
    width: auto;
	cursor: pointer;
}
.popup #searchClose p:hover {
    color: #555;
    cursor: pointer;
}
.popup.show {
    opacity: 1;
    z-index: 15;
    display: flex;
}
.popup.show .black-background {
    opacity: 0.6;
    z-index: 0;
}
@media (max-width: 767px) {
    .popup .popup-inner {
        background: #fff;
        padding: 30px;
        width: 80%;
        min-width: inherit;
        opacity: 1;
    }
}
@media print, screen and (min-width: 768px) {
#header-inner_th.fixed{
	height: 80px;
}
#header-inner_th.fixed .icon_list{
	top: 20px;
}
#header-inner_th.fixed .search_icon2{
	top: 20px;	
	}
}
	
	
	
	
	#contents{
		overflow: initial;
	}
	
	.brand_btn{
		position: absolute;
		bottom: -40px;
		left: 0;
		width: 100%;
		height: 50px;
		background: #fff;
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;;
	}
	.brand_btn .inner{
		margin: 0 auto;
		max-width: 940px;
		width: 100%;
		display: flex;
	}
	.brand_btn .inner a{
		width: 50%;
		height: 50px;
		display: block;
	}
	.brand_btn .inner a.tocco-tocco{
		background: url("../img/logo-toccocloset.svg") no-repeat;/*ヘッダーブランドミニロゴ*/
		background-size: 100px;
		background-position: center;
	}
	@media print, screen and (max-width: 767px) {
	.brand_btn .inner a.tocco-tocco{
		background: url("../img/logo-toccocloset.svg") no-repeat;/*ヘッダーブランドミニロゴ*/
		background-size: 100px;
		background-position: center;
	}
	}
	
	
	.brand_btn .inner a.suyunn-suyunn {
		background: url("../img/logo-suyunn.svg") no-repeat;/*ヘッダーブランドミニロゴ*/
		background-size: 100px;
		background-position: center;
		border-left: 1px solid #ddd;
	}
	
	
	/*ヘッダーブランドミニロゴ　バックグラウンド変更 tocco*/
	.brand_btn .inner a.tocco-tocco-pink{
		background: url("../img/logo-toccocloset.svg") no-repeat;
		background-size: 100px;
		background-position: center;
		border-bottom: solid 5px #ffd4dc;
    	box-sizing: border-box;
	}
	@media print, screen and (max-width: 767px) {
	.brand_btn .inner a.tocco-tocco-pink{
		background: url("../img/logo-toccocloset.svg") no-repeat;
		background-size: 100px;
		background-position: center;
	}
	}
	
	#header-inner_th .logo_area .inner h1 a img.logo_tocco-tocco-pink{
		width: 230px;
	}
	@media print, screen and (max-width: 767px) {
		#header-inner_th .logo_area .inner h1 a img.logo_suyunn-suyunn{
			width: 30px;
		}
		#header-inner_th .logo_area .inner h1 a img.logo_tocco-tocco-pink{
			width: 120px;
		}
	}
	/*ヘッダーブランドミニロゴ　バックグラウンド変更 tocco*/
	
	
	
	.brand_btn .inner a.suyunn-suyunn-blue {
		background: url("../img/logo-suyunn.svg") no-repeat;/*ヘッダーブランドミニロゴ*/
		background-size: 100px;
		background-position: center;
		border-left: 1px solid #ddd;
		border-bottom: solid 5px #d6f3ff;
    	box-sizing: border-box;
	}
	
	
	
	
/* ハンバーガーメニューの中　*/
#sub-column .free-contents{
	background: none !important;
}
#sub-column .header-mypage{
  width: 46px;
  height: 43px;
  display: block;
  background: #000;
  position: absolute;
  top: 9px;
  right: 24px;
  background: url(/hpgen/HPB/img/common/favorite.svg) no-repeat;/*お気に入り♡画像*/
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
  background-size: 22px;
  background-position: center;
}
#sub-column .drawer_logo_area img{
	width: 120px;
	margin: 0 auto;
	display: block;	
}
#sub-column .freeArea2 .free-contents {
  background-color: none;
  font-size: 12px;
  padding: 0;
}
#header-nav-drawer-close {
  position: absolute;
  top: 10px;
  left: 15px;
  width: 34px;
  height: 37px;
  cursor: pointer;
	
}
#header-nav-drawer-close .menuBtn::after {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}
#header-nav-drawer-close span.menuBtn::before {
  display: block;
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 34px;
  height: 2px;
  border-radius: 2px;
  background: #111;
  transition: .3s;
  transform: rotate(-45deg);
}
#header-nav-drawer-close span.menuBtn::after {
  display: block;
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 34px;
  height: 2px;
  border-radius: 2px;
  background: #111;
  transition: .3s;
  -webkit-transform: rotate(-135deg);
}
#header-nav-drawer-close .drawerClose {
  display: block;
  position: absolute;
  bottom: 6px;
  left: 57px;
  transform: translateX(-50%);
  width: 100%;
  height: auto;
  transition: .2s;
  font-size: 11px;
}
#sub-column .leftSearch{
  background: none;
}
#sub-column .leftSearch #searchbox form{
	border: none;
	position: relative;
	height: 50px;
	background: #fff;
}
#sub-column .leftSearch #searchbox input.searchbox{
	padding: 0 17px;	
}
#sub-column .leftSearch #searchbox input.searchSubmit{
height: 50px;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
	padding: 0 0 0 50px;
	background-color: #fff;
	}
#sub-column #searchbox_wrap{
	position: relative;
	margin: 10px 0 15px;
	overflow: hidden;
  border-radius: 25px;
}
#sub-column #searchbox_wrap #searchbox p{
	display: none;
}
#sub-column #searchbox_wrap::after{
	content: '';
	position: absolute;
	z-index: 2;
	top: 0;
	right: 0;
	width: 50px;
	height: 50px;
	background: #fff url(../img/search.svg) no-repeat;/*虫メガネ画像*/
    background-size: 20px;
    background-position: center;
	pointer-events: none;
}