@charset "euc-jp";

/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
html{color:#000;background:none}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
body {
/*  background:#fff;
  background-image: url(<{$page_bgimg}>);*/
  color: #000;
  -webkit-font-smoothing: antialiased;
font-family:'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}
a {
  color: #000;
}
a:hover {
  color: #888;
  text-decoration: none;
}

.btn {
  border-radius: 0;
}

ul, ol, form, p {
  margin: 0;
}
li{list-style:none}
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

/*-------------------------------------------
デフォルトスタイルをリセット
-------------------------------------------*/

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

body {
  margin: 0;
  font-family:'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

a {
  background-color: transparent;
}

a:active,
a:hover {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,
strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 40px;
}

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
  color: inherit; /* 1 */
  font: inherit; /* 2 */
  margin: 0; /* 3 */
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}


/*-------------------------------------------
共通
-------------------------------------------*/

body {
  background-color: #fff;
  color: #212121;
  font-size: 14px;
  font-family: "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, Meiryo, sans-serif;
}

a {
  text-decoration: none;
  color: #2196f3;
  -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
}
a:active {
  background: rgba(0, 0, 0, 0.1);
}

p {
  line-height: 1.2rem;
  margin: 0;
}
h1.hd_catch{position:absolute;top:0px;width:94%;height:15px;font-size:10px;font-weight:100;overflow:hidden;margin:0 3%}

h2 {
  padding: 0 20px;
  margin: 20px 0 0.5rem;
  font-size: 142.85714%;
  font-weight: normal;
}

h3 {
  font-size: 114.28571%;
  font-weight: normal;
  margin: 20px 0 .5rem;
  padding: 0 20px;
}

h4 {
  font-size: 100%;
  font-weight: normal;
  margin: 20px 0 .5rem;
}

img {
  max-width: 100%;
  height: auto;
}

.wrap {
  text-align: center;
  vertical-align: middle;
  zoom: 1;
}
.wrap img {
  vertical-align: bottom;
}

.cf:before,
.cf:after {
  content: "";
  display: table;
}

.cf:after {
  clear: both;
}

/*
 * layout
 */
#outer {
  overflow-x: hidden;
  max-width: 100%;
  height: auto;
}

#wrapper {
  position: relative;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}

#wrapper.open {
  -moz-transform: translate3d(280px, 0, 0);
  -webkit-transform: translate3d(280px, 0, 0);
  transform: translate3d(280px, 0, 0);
}

.section {
  border-bottom: solid 1px #e0e0e0;
}

.section-inner {
  padding: 0 20px 20px;
}

/* ヘッダー */
.shopname {
  padding: 10px 20px 0px;
  text-align:center;
  position:relative;
  font-size:10px;
}
.shopname img{max-width:120px;height:auto;}
.head_menu{position:absolute;left:10px;top:20px;color:#888}
.shopname-text {
  text-align: center;
  margin: 0;
  font-size: 142.85714%;
}
.shopname-text a {
  font-weight: bold;
  color: #212121;
  display: block;
}

/* ツールバー */
.toolbar {
  background: #eee;
  -moz-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.3);
}

.toolbar-inner {
  margin: 0;
  padding: 0;
}

.toolbar-item {
  list-style: none;
  float: left;
  width: 50%;
  border-bottom:#888;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  padding:5px 0;
  font-size:10px;
}
.toolbar--name{width:40%;font-size:16px;text-align:left;padding-left:10px;}
.toolbar--cart{width:15%;}
.toolbar-item a {
  font-size: 114.28571%;
  display: block;
  padding: 18px 0 19px;
  color: #888;
  line-height: 1.3;
}
.toolbar-item a:active {
  background: rgba(255, 255, 255, 0.1);
}
.toolbar-item a .icon {
  width: 20px;
  margin: 0 10px 0 0;
}
#header{ background: #fff;}
#header--sticky {
  background: #fff;
  position: fixed;
  z-index: 2000;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  color:#000;
  height:60px;
  overflow:hidden;
  border-bottom:0.5px solid #000;
}
#header--sticky .toolbar-item {
  list-style: none;
}
#header--sticky .toolbar-item .icon {
  margin: 0;
}
#header--sticky .toolbar--menu {
  float: left;
  width: 15%;
  text-align:center;
  font-size:10px;
  padding:15px 0 5px;}
@media screen and (orientation: portrait){
  .toolbar-news{line-height:98%}
}
#header--sticky .toolbar--logo {
  float: left;
  width: 55%;
  text-align:left;
  padding:5px 10px;
}
.toolbar--logo img{width:100%;height:auto;max-width:120px;}
#header--sticky .toolbar--cart {
  float: right;
  width: 9%;
}
a#totop{position:fixed;bottom:110px;right:0px;background:#fff;opacity:0.7;color:#000;border:solid 0.5px #000;padding:0 5px;text-align:center;font-family:Muli;font-weight:800;font-size:10px;z-index:7777}

.toolbar--totop {
  width: 64%;
  border: none;
}
.toolbar--totop a {
  font-size: 100%;
  width: 100%;
  padding: 22px 0 20px;
  line-height: 1;
}
.toolbar--totop a .icon--up_w {
  width: 16px;
}

/* フッター */
.footer-nav {
  padding: 0;
  margin: 0;
}

.footer-nav-item {
  border-bottom: solid 1px #e0e0e0;
  list-style: none;
}
.footer-nav-item a {
  display: table;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: auto;
  padding: 20px;
  color: #212121;
}
.footer-nav-item a span {
  display: table-cell;
  vertical-align: middle;
}

.footer-nav-item-text {
  width: 80%;
  height: auto;
}

.footer-nav-item-icon {
  width: 10%;
  height: auto;
  text-align: right;
}
.footer-nav-item-icon .icon {
  width: 16px;
}

.section--address {
  background: #ddd;
  text-align: center;
}
.section--address .section-inner {
  padding: 20px 20px 30px;
}

.switch {
  margin: 0 0 10px;
}

.section--sns {
  padding: 20px 0 0;
  text-align: center;
  background:#eee
}
.moromoro{font-size:10px;text-align:center;background:#eee}

.sns-link {
  text-align: center;
  margin: 0 3px 0;
  padding: 10px 11px;
  color: #fff;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  display: inline-block;
}
.sns-link .icon {
  width: 20px;
}

.sns-link--twitter {
  background: #00acee;
}

.sns-link--x {
  background: #000000;
}

.sns-link--facebook {
  background: #3b579d;
}

.sns-link--instagram {
background: -webkit-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -webkit-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
    background: -moz-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -moz-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
    background: -ms-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -ms-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
    background: -o-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -o-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
    background: radial-gradient(circle farthest-corner at 32% 106%, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
}
.sns-link--ameblo {
  background: #28833a;
}
.sns-link--line {
  background: #3aae37;
}

.sns-link--google {
  background: #d95333;
}

.sns-link--pinterest {
  background: #c9232d;
}

.copyright {
  margin: 0 0 20px;
  font-size:8px
}

.powered {
  font-size: 85.71429%;
  color: #212121;
}
.powered img {
  width: 195px;
  margin: 0 0 -3px 3px;
}

/* ドロワー */
#drawer {
  position: fixed;
  top: 0;
  left: -280px;
  overflow-x: hidden;
  overflow-y: scroll;
  width: 280px;
  height: 100%;
  color: #000;
  background: #fff;
  -webkit-overflow-scrolling: touch;
  -moz-box-shadow: rgba(0, 0, 0, 0.3) -2px 0px 5px inset;
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) -2px 0px 5px inset;
  box-shadow: rgba(0, 0, 0, 0.3) -2px 0px 5px inset;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  padding-bottom:60px;
}

#drawer.open {
  -moz-transform: translate3d(280px, 0, 0);
  -webkit-transform: translate3d(280px, 0, 0);
  transform: translate3d(280px, 0, 0);
}

.drawer-item {
  border-bottom: 1px solid #ccc;
}
.dw_title {
  font-size: 100%;
  font-weight: normal;
  display: inline-block;
  clear: both;
  width: 100%;
  margin: 0;
  padding:5px 15px;
  background:#eee;
  color: #000;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.drawer-item-name {
  font-size: 114%;
  font-weight: normal;
  display: inline-block;
  clear: both;
  width: 100%;
  margin: 0;
  padding:10px 20px;
  color: #000;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.drawer-item-name .icon {
  width: 24px;
  margin: 0 10px 0 0;
}

.drawer-item-name-text {
  display: inline-block;
  width: 85%;
  margin: 0 5% 0 0;
  vertical-align: middle;
}

.drawer-item-name-icon {
  width: 10%;
  height: auto;
  text-align: right;
}
.drawer-item-name-icon .icon {
  width: 16px;
  margin: 0;
}

.drawer-accordion {
  border-bottom: 1px solid #ccc;
}
.drawer-accordion ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.drawer-accordion-name,.drawer-item-name {
  font-size: 100%;
  font-weight: normal;
  display: inline-block;
  clear: both;
  width: 100%;
  margin: 0;
  padding:10px 20px;
  color: #000;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.drawer-accordion-name .icon {
  width: 24px;
  margin: 0 10px 0 0;
}

.drawer-accordion-name-text {
  display: inline-block;
  width: 85%;
  margin: 0 5% 0 0;
  vertical-align: middle;
}

.drawer-accordion-name-icon {
  width: 10%;
  height: auto;
  text-align: right;
}
.drawer-accordion-name-icon .icon {
  width: 16px;
  margin: 0;
}

.drawer-accordion-item {
  border-bottom: 1px solid #ccc;
  background: none;
}
.drawer-accordion-item:nth-child(1) {
  border:solid #ccc;
  border-width:1px 0;
}
.drawer-accordion-item:last-child {
  border: none;
}
.drawer-accordion-item a {
  position: relative;
  display: inline-block;
  width: 100%;
  padding: 10px 20px;
  color: #000;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.drawer-accordion-item a:active {
  background: rgba(255, 255, 255, 0.1);
}
.drawer-accordion-item a img {
  vertical-align: middle;
}
.drawer-accordion-item .icon {
  width: 24px;
  margin: 0 10px 0 0;
}

.drawer-accordion-item-text {
  display: inline-block;
  width: 87%;
  margin: 0 8px 0 0;
  vertical-align: middle;
}

.drawer-accordion-item-icon {
  width: 10%;
  height: auto;
  text-align: right;
}
.drawer-accordion-item-icon .icon {
  width: 16px;
  margin: 0;
}

.drawer--search {
  border-bottom: 1px solid #ccc;
  padding:10px 20px;
}

/*
 * product
 */
.regular {
/*  text-decoration: line-through;
  color: #aaa;*/
font-family:'Muli';font-weight:800}
.price{
/*  font-size: 142.85714%;
  font-weight: bold;*/
  font-family:'Muli';font-weight:800;font-size:20px;}
}
span.zk{font-size:8px;margin-left:5px;}

.rate {
  color: #f44336;
}

.breadcrumblist {
  padding: 10px 20px;
  margin:5px 0;
  overflow-x: scroll;
  background-color: #FFF;
  border: solid #eee;
  border-width:0.5px 0
}
.breadcrumblist ol {
  list-style: none;
  display: table;
}
.breadcrumblist ol li {
  padding: 5px;
  display: table-cell;
  white-space: nowrap;
}

.taglist {
  padding: 20px 0 0;
}
.taglist p {
  margin: 0 0 10px;
}
.taglist a {
  margin: 0 6px 8px 0;
}

.productform-inner {
  margin: 0 0 15px;
}

.stock_error {
  font-weight: bold;
  text-align: center;
  color: #f44336;
}

.table {
  width: 100%;
  height: auto;
}

.table--bordered {
  font-size: 85.71429%;
  border-top: 1px solid #ddd;
}
.table--bordered th {
  font-weight: normal;
  width: 30%;
  padding: 10px 10px;
  text-align: center;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.table--bordered td {
  padding: 10px 10px 10px 15px;
  border-bottom: 1px solid #ddd;
}

.otherlist {
  padding: 0;
  list-style: none;
}
.social {
  width: 110px;
  float: left;
  margin: 10px 0 0;
}

.imagelist.slick-slider {
  margin: 0 0 50px;
}
.imagelist.slick-slider .slick-slide {
  padding: 0 40px;
  text-align: center;
}

/*
 * product-list
 */
.boxlist {
  list-style: none;
  padding: 0 10px;
  margin: 0;
}
.box {
  display: block;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.box .box-inner {
  display: block;
  padding: 10px 10px 6px;
}
.box .box-image {
  display: block;
  margin: 0 0 10px;
  text-align: center;
}
.box .box-title {
  margin: 0 0 5px;
  height:35px;
  overflow:hidden;
  color: #000;
  font-size:11px;
}
.box .box-price {
  font-weight: bold;
  margin: 0 0 5px;
  color: #000;
}
.box .box-price--soldout {
  margin: 0 0 5px;
  color: #F00;
}
.box .box-caption {
  width:80%;
  height:30px;
  font-size: 9px;
  overflow-y:scroll;
  color: #888;
  line-height: 0.8rem;
}
@media screen and (orientation: portrait) {
.box--half {
  width: 50%;
}
}
@media screen and (orientation: landscape) {
.box--half {
  width: 25%;
}
}

.box--full {
  float: none;
  width: 100%;
}

.slidelist {
  margin: -10px 0 10px !important;
}
.slidelist .slick-track {
  padding: 0 10px;
}
.slidelist .slick-slide {
  padding: 0;
}
.slidelist .slide-inner {
  display: block;
  padding: 10px 10px 5px;
}
.slidelist .slide-image {
  display: block;
  margin: 0 0 5px;
  text-align: center;
}
.slidelist .slide-title {
  font-size: 85.71429%;
  margin: 0 0 5px;
  color: #212121;
}
.slidelist .slide-price {
  font-weight: bold;
  margin: 0 0 5px;
  color: #212121;
}
.slidelist .slide-price--soldout {
  font-size: 85.71429%;
  color: #f44336;
}

.result {
  margin: 10px 0;
}
.result span {
  font-size: 128.57143%;
  font-weight: bold;
}

.sort {
  text-align: center;
}

.pager {
  padding: 0 20px 20px;
}

.rest {
  text-align: center;
  margin: 15px 0;
}
.rest span {
  font-size: 114.28571%;
  font-weight: bold;
}

.pager-prev {
  float: left;
  line-height: 1;
}
.pager-prev .icon {
  width: 14px;
}

.pager-next {
  float: right;
  line-height: 1;
}
.pager-next .icon {
  width: 14px;
}

.section--list .boxlist {
  padding: 20px 10px 0;
  margin: 0;
}

.section--list--sub .section-inner {
  padding: 0 20px 10px;
}

.subcategorylist {
  margin: 0;
  padding: 0;
  list-style: none;
}

.subcategorylist-item {
  float: left;
  margin: 0 20px 10px 0;
}
.subcategorylist-item a {
  font-size: 85.71429%;
}

.freespace01 {
  margin: 0 0 20px;
}

.freespace02 {
  padding: 20px 0 0;
}

.freespace-item {
  font-size: 85.71429%;
}

/*
 * 特商法・その他
 */
.deflist {
  margin: 0;
}

.deflist-title {
  font-size: 128.57143%;
  margin: 0 0 0.5rem;
}

.deflist-body {
  margin: 0 0 20px;
}

.section--search .section-inner,
.section--free .section-inner,
.section--push .section-inner {
  padding: 20px;
}
.section--main {
  padding: 0 0 20px;
}

.section--search--detail {
  background: #212121;
}
.section--search--detail h2 {
  margin: 0 0 .5rem;
  padding: 20px 20px 0;
  color: #fff;
  font-size:13px
}
.section--search--detail .section-inner {
  padding: 0 20px 30px;
}

.section--push ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/*
 * パーツ
 */

.slick-slide img {
  margin: 0 auto;
}

.icon {
  display: inline-block;
  vertical-align: middle;
}

.icon-open--flip {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.button {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  border: none;
  display: inline-block;
}

.button--red {
  background: #f44336;
  color: #fff;
}

.button--blue {
  background: #2196f3;
  color: #fff;
}

.button--orange {
  background: #ff6f00;
  color: #fff;
}

.button--line {
  border: 1px solid #2196f3;
  color: #2196f3;
}

.button--sort {
  font-size: 100%;
  padding: 5px 0;
  width: 28%;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.button--tag {
  font-size: 85.71429%;
  padding: 4px 4px 2px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.button--small {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  font-size: 114.28571%;
  padding: 11px 0 12px;
  width: 25%;
  line-height: 1;
}

.button--medium {
  font-size: 100%;
  padding: 10px;
  margin: 8px 0;
  width: 100%;
  line-height: 1;
}
.button--medium .icon {
  width: 14px;
  margin: 0 0 0 5px;
}

.button--large {
  font-size: 128.57143%;
  font-weight: bold;
  padding: 20px 0;
  width: 100%;
  margin: 0 0 10px;
}

.button--disabled {
  background: #bdbdbd;
  color: #fff;
}

input[type="text"].keyword {
  font-size: 85.71429%;
  padding: 0 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

input[type="text"].keyword--small {
  width: 68%;
  margin: 0 10px 0 0;
  height: 40px;
}

input[type="text"].keyword--white {
  background: #fff;
  color: #212121;
}

input[type="text"].keyword--black {
  background: #000;
  color: #fff;
  border: none;
}

input[type="number"].productnum {
  padding: 8px 10px;
  width: 15%;
}

input[type="text"].productnum {
  padding: 8px 10px;
  width: 15%;
}

.pulldown {
  width: 100%;
  height: 40px;
  background: #fff;
  margin: 0 0 15px;
  border: 1px solid #bdbdbd;
}

input[type="text"].name-title {
  padding: 8px 10px;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/*
 * モーダル
 */
#modal-content {
  position: absolute;
  z-index: 9999;
  display: none;
  width: 75%;
  margin: 0;
  padding: 10px 20px;
  background: #fff;
}

#modal-overlay {
  position: fixed;
  z-index: 2000;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 120%;
  background-color: rgba(0, 0, 0, 0.75);
}

#modal-close {
  font-size: 28px;
  position: absolute;
  top: -20px;
  right: -5%;
  padding: 10px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}

#modal-close .icon{
  width: 20px;
  vertical-align: initial;
}

ul.bottom_line{width:100%;height:60px;position:fixed;bottom:0;left:0;background:#eee;border-top:0.5px solid #888;z-index:99999;}
ul.bottom_line li{width:20%;height:50px;text-align:center;font-size:9px;color:#888;border-right:1px solid #888;float:left;padding:5px 0 15px}
ul.bottom_line li:last-child{border-right:0}

ul.my_area{background:#fff;color:#888;width:100%}
ul.my_area li{float:left;text-align:left;font-size:16px;padding:10px 10px 0}
ul.my_area li.info_bt{width:15%;float:right;text-align:center;font-size:10px;padding:10px 0 0;position:relative}
.info_count{width:15px;height:15px;color:#fff;background:#F00;border-radius:15px;text-align:center;font-size:10px;position:absolute;top:4px;right:4px}
ul.my_area a,#header--sticky a{color:#888}
.info_area{background:#eee;opacity:0.9;width:100%;height:100%;position:fixed;bottom:0;left:0;padding:10px;text-align:left;z-index:9997;animation-duration: 0.5s;animation-name: slide-hidari;font-size:14px;}
@keyframes slide-hidari {
	from{
		margin-top:150%;
		height:300%;
		}      
	to	{
		margin-bottom:-10%;
		height:100%;
		}
	}
.close{border:solid 0.5px #888;padding:5px;width:70px;border-radius:2px;text-align:center;cursor:pointer}
.src_key{background:#fff;border:solid 0.5px #777;width:100%;text-align:center;padding:5px;margin:5px 0;color:#000}
dl.src dt{width:40%;padding-right:10px;float:left;margin:5px 0}
dl.src dd{width:60%;float:left;margin;5px 0}
dl.src dd .pulldown{background:#fff;border:solid 0.5px #777;width:100%;text-align:center;padding:5px;color:#000}
dl.src dd .price{background:#fff;border:solid 0.5px #777;width:40%;text-align:center;padding:5px;color:#000;font-size:11px;height:35px;margin-bottom:10px}
.src_zaiko{width:100%;background:#fff;border:solid 0.5px #777;text-align:center;padding:5px;color:#000;margin-bottom:10px}
.src_bt{width:70%;border-radius:2px;text-align:center;padding:5px;float:left;border:0}
.src_clear{width:28%;margin-right:2%;float:left;border:solid 0.5px #000;background:#fff;padding:5px;border-radius:2px;text-align:center}
.login_area{width:100%;background:#eee;font-size:11px;color:#000;padding:5px 20px;}
.login_area a{color:#000}
.lognew{text-align:center}
.logname{text-align:right}
.form_box{width:100%;border:solid 0.5px #000;padding:5px;}
.form_keyword{width:80%;float:left;font-size:12px;border:0;background:#fff}
.form_button{width:10%;float:right;border:0;background:#fff}
.kaiin_p{font-size:9px;line-height:9px;}