@charset "UTF-8";
html, body {
  height: 100%;
}

body {
  color: #404040;
  font-size: 13px;
}

* {
  font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  color: #000000;
}

h3 {
  font-size: 2rem;
}

h4 {
  font-size: 1.4rem;
}

p {
  margin: 0 0　20px;
}
p .header {
  display: inline-block;
  margin-bottom: 10px;
  font-size: 1.5rem;
  line-height: 15px;
}
p .header:before {
  content: "";
  position: relative;
  display: inline-block;
  width: 15px;
  height: 15px;
  top: 2px;
  background-color: #989898;
  margin-right: 4px;
}

.normal-col {
  color: #404040;
}

.red-col {
  color: #ff0000 !important;
}

strong {
  color: #ff0072;
}

.bold {
  font-weight: bold;
}

.bg-grey {
  display: inline-block;
  color: #ffffff;
  background-color: #524e46;
  position: relative;
  top: 1px;
  min-width: 66px;
  height: 24px;
  line-height: 24px;
  font-size: 1.1rem;
  padding: 0 16px;
  margin-right: 14px;
}

a {
  color: #6d6d6d;
}
a:hover {
  color: #b44747;
}
a.item-name {
  color: #5d60cf;
  text-decoration: underline;
}
a.item-name:hover {
  color: #9b9def;
}

a, a::before, a:after,
.btn, .btn:before, .btn:after {
  -moz-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

a:hover img,
input[type=image]:hover {
  opacity: 0.7;
  -ms-filter: "alpha(opacity=70)";
  filter: alpha(opacity=70);
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

img.border {
  border: 1px solid #808080;
}

@media only screen and (max-width: 768px) {
  /* スマホのみ */
  img {
    max-width: 100%;
    height: auto;
  }
}
hr {
  border-top: 1px solid #989898;
}

.btn.btn-del, .btn.btn-search {
  width: 28px;
  height: 28px;
  padding: 0;
  line-height: 28px;
  font-size: 18px;
  color: #ffffff;
}

.btn {
  font-size: 1.3rem;
}
.btn.btn-grey {
  color: #ffffff;
  background-color: #524e46;
  border-color: #524e46;
  border-radius: 0;
}
.btn.btn-grey:hover {
  color: #524e46;
  background-color: #e0e0e0;
  border-color: #524e46;
}
.btn.btn-lightgrey {
  color: #524e46;
  background-color: #e0e0e0;
  border-color: #e0e0e0;
  border-radius: 0;
}
.btn.btn-lightgrey:hover {
  color: #524e46;
  background-color: #8c8787;
  border-color: #e0e0e0;
}
.btn.btn-red {
  color: #ffffff;
  background-color: #ff0000;
  border-color: #ff0000;
  border-radius: 0;
}
.btn.btn-red:hover {
  color: #ff0000;
  background-color: #ffe5e6;
  border-color: #ff0000;
}
.btn.btn-blue {
  color: #ffffff;
  background-color: #0aa6ff;
  border-color: #0aa6ff;
  border-radius: 0;
}
.btn.btn-blue:hover {
  color: #0aa6ff;
  background-color: #def3ff;
  border-color: #0aa6ff;
}
.btn.btn-border-green {
  color: #4b8044;
  background-color: #ffffff;
  border: 2px solid #4b8044;
  border-radius: 0;
  font-weight: bold;
}
.btn.btn-border-green:hover {
  color: #4b8044;
  background-color: #e3ede1;
  border-color: #4b8044;
}
.btn.btn-border-green.btn-lg {
  line-height: 38px !important;
}
.btn.btn-border-red {
  color: #ff0000;
  background-color: #ffffff;
  border: 2px solid #ff0000;
  border-radius: 0;
  font-weight: bold;
}
.btn.btn-border-red:hover {
  color: #ff0000;
  background-color: #ffe5e6;
  border-color: #ff0000;
}
.btn.btn-border-red.btn-lg {
  line-height: 38px !important;
}
.btn.btn-flat-grey {
  color: #ffffff;
  background-color: #a5a5a5;
  border-radius: 0;
  -moz-box-shadow: 0px -2px 2px 1px #7a7a7a inset;
  -webkit-box-shadow: 0px -2px 2px 1px #7a7a7a inset;
  box-shadow: 0px -2px 2px 1px #7a7a7a inset;
}
.btn.btn-flat-grey:hover {
  background-color: #c0c0c0;
  -moz-box-shadow: 0px -2px 2px 1px #a3a3a3 inset;
  -webkit-box-shadow: 0px -2px 2px 1px #a3a3a3 inset;
  box-shadow: 0px -2px 2px 1px #a3a3a3 inset;
}
.btn.btn-flat-blue {
  color: #ffffff;
  background-color: #0272f1;
  border-radius: 0;
  -moz-box-shadow: 0px -2px 2px 1px #0148e8 inset;
  -webkit-box-shadow: 0px -2px 2px 1px #0148e8 inset;
  box-shadow: 0px -2px 2px 1px #0148e8 inset;
}
.btn.btn-flat-blue:hover {
  background-color: #4d9cf5;
  -moz-box-shadow: 0px -2px 2px 1px #4d7bee inset;
  -webkit-box-shadow: 0px -2px 2px 1px #4d7bee inset;
  box-shadow: 0px -2px 2px 1px #4d7bee inset;
}
.btn.btn-flat-red {
  color: #ffffff;
  background-color: #f7424e;
  border-radius: 0;
  -moz-box-shadow: 0px -2px 2px 1px #f11d26 inset;
  -webkit-box-shadow: 0px -2px 2px 1px #f11d26 inset;
  box-shadow: 0px -2px 2px 1px #f11d26 inset;
}
.btn.btn-flat-red:hover {
  background-color: #f97a83;
  -moz-box-shadow: 0px -2px 2px 1px #f56067 inset;
  -webkit-box-shadow: 0px -2px 2px 1px #f56067 inset;
  box-shadow: 0px -2px 2px 1px #f56067 inset;
}
.btn.btn-flat-green {
  color: #ffffff;
  background-color: #376a30;
  border-radius: 0;
  -moz-box-shadow: 0px -2px 2px 1px #1a4216 inset;
  -webkit-box-shadow: 0px -2px 2px 1px #1a4216 inset;
  box-shadow: 0px -2px 2px 1px #1a4216 inset;
}
.btn.btn-flat-green:hover {
  background-color: #73966e;
  -moz-box-shadow: 0px -2px 2px 1px #607c5c inset;
  -webkit-box-shadow: 0px -2px 2px 1px #607c5c inset;
  box-shadow: 0px -2px 2px 1px #607c5c inset;
}
.btn.btn-del {
  background-color: #ff0000;
  -moz-box-shadow: 0px -2px 2px 1px #e90000 inset;
  -webkit-box-shadow: 0px -2px 2px 1px #e90000 inset;
  box-shadow: 0px -2px 2px 1px #e90000 inset;
}
.btn.btn-del:hover {
  background-color: #ff5e5e;
}
.btn.btn-search {
  background-color: #8d8d8d;
  -moz-box-shadow: 0px -2px 2px 1px #5e5e5e inset;
  -webkit-box-shadow: 0px -2px 2px 1px #5e5e5e inset;
  box-shadow: 0px -2px 2px 1px #5e5e5e inset;
}
.btn.btn-search:hover {
  background-color: #bab9b9;
}
.btn.btn-lg {
  height: 40px;
  line-height: 40px;
  font-size: 1.5rem;
  margin: 20px 0;
  padding: 0 20px;
}
.btn.btn-lg + .btn {
  margin-left: 20px;
}
.btn.btn-xs {
  min-width: 66px;
  height: 24px;
  line-height: 20px;
  font-size: 1.1rem;
  margin: 0;
  padding: 0 16px;
}
.btn.btn-xs + .btn {
  margin-left: 14px;
}

input, textarea {
  border-radius: 0 !important;
}

label {
  font-weight: normal;
}

.help-block {
  margin-top: 5px;
  margin-bottom: 0;
  color: #404040;
}

.error-block {
  color: #ff0000;
  margin-top: 5px;
  display: none;
}

.has-error .form-control {
  border-color: #a94442;
  -moz-box-shadow: 0px 0px 8px -3px #a94442 inset;
  -webkit-box-shadow: 0px 0px 8px -3px #a94442 inset;
  box-shadow: 0px 0px 8px -3px #a94442 inset;
}
.has-error .error-block {
  display: block;
}

/*input[type="radio"],*/
/*input[type="checkbox"] {*/
  /*display: none;*/
/*}*/

.radio {
  position: relative;
  vertical-align: top;
  padding: 13px 0 13px 45px;
}
.radio input[type="radio"] + .radio-icon {
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -15px;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 15px;
  -moz-box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
  -webkit-box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
  box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
}
.radio input[type="radio"] + .radio-icon:before {
  content: "";
}
.radio input[type="radio"]:checked + .radio-icon:before {
  content: "\f111";
  position: absolute;
  left: 4px;
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  display: inline-block;
  font-size: 20px;
  line-height: 30px;
}

.checkbox {
  position: relative;
  vertical-align: top;
  padding: 13px 0 13px 45px;
}
.checkbox input[type="checkbox"] + .checkbox-icon {
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -15px;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  -moz-box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
  -webkit-box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
  box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
}
.checkbox input[type="checkbox"] + .checkbox-icon:before {
  content: "";
}
.checkbox input[type="checkbox"]:checked + .checkbox-icon:before {
  content: "\f00c";
  position: absolute;
  left: 4px;
  font-family: FontAwesome;
  display: inline-block;
  font-size: 20px;
  line-height: 30px;
}

.form-inline .radio + .radio {
  margin-left: 10px;
}

input.round,
select.round {
  border-radius: 5px !important;
  -moz-box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
  -webkit-box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
  box-shadow: 0px 0px 8px -3px #d1d1d1 inset;
}

.select-group {
  position: relative;
  display: inline-block;
  width: 100%;
}
/*
.select-group:after {
  display: block;
  content: "▼";
  position: absolute;
  top: 0;
  right: 4px;
  line-height: 34px;
  pointer-events: none;
}
*/
.select-group select.simple {
  position: relative;
  width: 100%;
  padding: 3px 18px 3px 4px;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid #D9D9D9;
  background: #ffffff;
  border-radius: 0;
  font-weight: normal;
  font-size: 1.3rem;
}

.search-group {
  position: relative;
}
.search-group input {
  height: 40px;
}
.search-group .input-group-btn {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
}
.search-group .input-group-btn .btn {
  width: 32px;
  height: 32px;
  top: 4px;
  left: 4px;
}
.search-group .input-group-btn .btn .glyphicon {
  font-size: 16px;
  top: 2px;
  left: -5px;
}

.panel {
  border: none;
  box-shadow: none;
}
.panel.panel-default {
  border: 1px solid #D9D9D9;
  border-radius: 0;
}
.panel.panel-default > .panel-heading {
  background: none;
  height: 44px;
  padding: 0 15px;
  font-size: 1.5rem;
  line-height: 44px;
}
.panel.panel-default > .panel-heading .sub-header {
  color: #1d76be;
  margin-right: 12px;
  font-size: 1.3rem;
}
.panel.panel-default > .panel-body {
  padding: 10px 30px;
}
.panel.panel-simple {
  border: 1px solid #989898;
  border-radius: 0;
}
.panel.panel-simple > .panel-heading {
  height: 44px;
  padding: 0 15px;
  font-size: 1.5rem;
  border-color: #989898;
  line-height: 44px;
  font-weight: bold;
}
.panel.panel-simple > .panel-heading .btn {
  margin-top: -2px;
  min-width: 140px;
}
.panel.panel-simple > .panel-body {
  padding: 0;
}
.panel.panel-simple > .panel-body .panel-item {
  padding: 16px 30px;
}
@media only screen and (max-width: 768px) {
  .panel.panel-simple > .panel-body .panel-item {
    /* スマホのみ */
    padding: 10px;
  }
}
.panel.panel-simple > .panel-body .panel-item:not(:last-child) {
  border-bottom: 1px solid #989898;
}
.panel.panel-accordion > .panel-heading {
  height: 52px;
  padding: 0;
  border-radius: 0;
  border: 1px solid #989898;
  background-color: #f8f7f7;
}
.panel.panel-accordion > .panel-heading a {
  color: #404040;
  text-decoration: none;
}
.panel.panel-accordion > .panel-heading a.accordion-toggle {
  display: block;
  padding: 0 30px;
  font-size: 1.9rem;
  line-height: 52px;
}
@media only screen and (max-width: 768px) {
  .panel.panel-accordion > .panel-heading a.accordion-toggle {
    /* スマホのみ */
    padding: 0 10px;
    font-size: 1.5rem;
  }
}
.panel.panel-accordion > .panel-heading a .glyphicon:before {
  content: "\e114";
  color: #858585;
}
.panel.panel-accordion > .panel-heading a.collapsed .glyphicon:before {
  content: "\e080";
}
.panel.panel-accordion .panel-collapse .glyphicon:before {
  content: "\e080";
}
.panel.panel-accordion .panel-collapse.in .glyphicon:before {
  content: "\e114";
}
.panel.panel-accordion .panel-collapse > .panel-body {
  border: none;
}
.panel.panel-accordion .panel-collapse.fade {
  -moz-transition: opacity 0.5s linear;
  -webkit-transition: opacity 0.5s linear;
  transition: opacity 0.5s linear;
}
.panel.panel-accordion .panel-collapse.collapsing {
  -moz-transition: height 0.35s linear;
  -webkit-transition: height 0.35s linear;
  transition: height 0.35s linear;
}

.attention-box {
  margin: 20px 12px;
  padding: 10px;
  border: 2px solid #ff0000;
  color: #ff0000;
  text-align: center;
}
.attention-box .header {
  font-size: 1.8rem;
  margin-bottom: 5px;
  font-weight: bold;
}

table {
  width: 100%;
}
table th, table td {
  border: 1px solid #989898;
  padding: 17px;
}
table.light-col th, table.light-col td {
  border: 1px solid #d6d6d6;
}
table th {
  background-color: #f8f7f7;
  font-weight: normal;
  width: 28%;
}
table + .table-footer {
  margin-top: 5px;
  margin-bottom: 10px;
}

.table-header {
  margin-top: 10px;
  margin-bottom: 5px;
}

.header-type1 {
  position: relative;
  font-size: 1.6rem;
  height: 24px;
  padding-left: 27px;
}
@media only screen and (max-width: 768px) {
  .header-type1 {
    /* スマホのみ */
    margin-left: 10px;
  }
}
.header-type1:before {
  content: "＞";
  display: block;
  position: absolute;
  top: 2px;
  left: 0;
  width: 15px;
  height: 15px;
  line-height: 15px;
  text-align: center;
  color: #ffffff;
  font-size: 9px;
  background-color: #000000;
  margin-right: 14px;
}

.header-type2 {
  position: relative;
  height: 25px;
  line-height: 25px;
  padding-left: 25px;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        transform: rotate(.03deg);
}
@media only screen and (max-width: 768px) {
  .header-type2 {
    /* スマホのみ */
    font-size: 1.8rem;
  }
}
.header-type2:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 13px;
  height: 25px;
  background-color: #524e46;
}

.row.row-margin0 {
  margin-right: -0px;
  margin-left: -0px;
}
.row.row-margin0 > [class^="col-"] {
  padding: 0px;
}
.row.row-margin6 {
  margin-right: -3px;
  margin-left: -3px;
}
.row.row-margin6 > [class^="col-"] {
  padding: 3px;
}
.row.row-margin15 {
  margin-right: -7.5px;
  margin-left: -7.5px;
}
.row.row-margin15 > [class^="col-"] {
  padding: 7.5px;
}
.row .col-custom5 {
  width: 20%;
  float: left;
  position: relative;
  min-height: 1px;
  padding-right: 10px;
  padding-left: 10px;
}

.breadcrumb {
  background: none;
  border-radius: none;
  padding: 15px;
  margin: 0;
}
.breadcrumb > li.active {
  color: #404040;
}
.breadcrumb > li + li:before {
  content: "＞";
  padding: 0 14px;
  color: #404040;
}
.breadcrumb > li a {
  color: #404040;
}
.label-list.list-inline.text-right{
    margin-bottom:0;
}

.label-list .label-icon {
  display: inline-block;
  padding: 1px 5px;
  color: #ffffff;
  border-radius: 4px;
  font-size: 11px;
}
.label-list .label-icon.new {
  background: #c98f85;
}
.label-list .label-icon.new:before {
  content: "NEW!";
}
.label-list .label-icon.shipping {
  background: #c98f85;
  background: -moz-linear-gradient(45deg, #c98f85 8%, #c7381d 9%, #c7381d 14%, #c98f85 15%, #c98f85 85%, #c7381d 86%, #c7381d 91%, #c98f85 92%);
  background: -webkit-linear-gradient(45deg, #c98f85 8%, #c7381d 9%, #c7381d 14%, #c98f85 15%, #c98f85 85%, #c7381d 86%, #c7381d 91%, #c98f85 92%);
  background: linear-gradient(45deg, #c98f85 8%, #c7381d 9%, #c7381d 14%, #c98f85 15%, #c98f85 85%, #c7381d 86%, #c7381d 91%, #c98f85 92%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c98f85', endColorstr='#c98f85',GradientType=1 );
}
.label-list .label-icon.shipping:before {
  content: "送料込";
}
.label-list .label-icon.cool {
  background: #79adc5;
}
.label-list .label-icon.cool:before {
  content: "クール便";
}
.label-list .label-icon.cod-free {
  background: #68c395;
}
.label-list .label-icon.cod-free:before {
  content: "代引手数料無料";
}
.label-list .label-icon.cannot-enclose {
  background: #7189b7;
}
.label-list .label-icon.cannot-enclose:before {
  content: "同梱不可";
}
.label-list .label-icon.delivery-fixed {
  background: #FF9A08;
}
.label-list .label-icon.delivery-fixed:before {
  content: "予約商品";
}
.nav-tabs {
  margin-top: 25px;
  margin-bottom: 16px;
  border-bottom: 1px solid #524e46;
  width: 100%;
}
.nav-tabs li + li {
  margin-left: 10px;
}
.nav-tabs li a {
  width: 175px;
  margin: 0;
  padding: 7px;
  text-align: center;
  border-radius: 0;
}
@media only screen and (max-width: 768px) {
  .nav-tabs li a {
    /* スマホのみ */
    width: auto;
    min-width: 140px;
  }
}
.nav-tabs li.active a, .nav-tabs li.active a:active, .nav-tabs li.active a:focus, .nav-tabs li.active a:hover, .nav-tabs li.active a:visited {
  color: #ffffff;
  background-color: #524e46;
  border: 1px solid #524e46;
}
.nav-tabs li:not(.active) a {
  color: #524e46;
  border: 1px solid #524e46;
}
.nav-tabs li:not(.active) a:hover {
  background-color: #f8f7f7;
  border: 1px solid #524e46;
}

.tab-content {
  margin: 0;
  padding: 0 12px;
}

@media only screen and (min-width: 769px) {
  /* PCのみ */
  .container {
    width: 100%;
  /*  max-width: 1008px;*/
  }

  .sp-only {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  /* スマホのみ */
  .container {
    width: 100%;
  }

  .pc-only {
    display: none;
  }
}