@charset "UTF-8";

/* color
---------------------------------------------------------------------------- */
/*==================================================================*/
/* style css　*/
/*==================================================================*/
.guide-menu {
  margin-bottom: 2em;
}
.guide-menu ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.guide-menu ul li {
  margin: 0.5em 6px;
}
.guide-menu ul li a {
  padding: 0.5em 2em;
  border: 1px solid #000;
  display: block;
  font-size: 14px;
}
.guide-menu ul li a:before {
  content: "\f105";
  font-family: "FontAwesome";
  padding: 0 7px 0 0;
}
.guide-menu ul li a:hover {
  text-decoration: none;
  background: #ff5f2f;
  color: #fff;
  border: 1px solid #ff5f2f;
}
.inblock-s{
  max-width: 1040px;
}
.in-box {
  margin-bottom: 4em;
  font-size:15px;
}
.in-box .sub-t{
  margin-bottom: 20px;
}
.in-box a{
  text-decoration: underline;
}
.in-box a:hover{
  text-decoration: none;
}
.in-box .box{
  width: 100%;
}
.in-box .box .txt{
  width: 50%;
  float:left;
}
.in-box .box .img{
  width: 50%;
  float:right;
  padding-left:50px;
}
.in-box .box .img img{
  border:1px solid #ccc;
}

/* ご注文方法　*/
#index .guide-menu ul li a.m-index {
  background: #1c1c3a;
  color: #fff;
}

/* お支払方法 */
#payment .guide-menu ul li a.m-payment {
  background: #1c1c3a;
  color: #fff;
}
#payment .in-box ul {
  margin: 1em 0;
  list-style-type: disc;
  margin-left: 1.5em;
}
#payment .in-box table {
  max-width: 280px;
  margin: 1em auto 0 0;
  border: 1px solid #ccc;
}
#payment .in-box table th, #payment .in-box table td {
  padding: 0.5em;
  border-right: 1px solid #ccc;
  text-align: center;
}
#payment .in-box table td {
  text-align: right;
}
#payment .furikomi {
  margin-top: 1em;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  border: 1px solid #ccc;
  padding: 1em;
  max-width: 700px;
}
#payment .furikomi .l-area {
  margin-right: 3.5em;
}
#payment .furikomi .l-area dl {
  margin-bottom: 0.8em;
  display: flex;
  justify-content: flex-start;
}
#payment .furikomi .l-area dl dt {
  width: 150px;
}
#payment .furikomi .fig img {
  max-width: 250px;
  width: auto;
  height: auto;
}

/* 送料・配達について*/
#delivery .guide-menu ul li a.m-delivery {
  background: #1c1c3a;
  color: #fff;
}
#delivery .txt dl {
  margin: 1em 0;
}
#delivery .txt ul {
  margin-left: 1em;
  list-style-type: disc;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
#delivery .txt ul li {
  margin-right: 3em;
}
#delivery .in-box a {
  text-decoration: underline;
  color: #0355b8;
}
#delivery .in-box a:hover {
  text-decoration: none;
  color: #ff5f2f;
}

/* 返品・キャンセル */
#cancel .guide-menu ul li a.m-cancel {
  background: #1c1c3a;
  color: #fff;
}
#cancel .in-box ul {
  margin-left: 2em;
  list-style-type: disc;
}
#cancel .in-box address {
  margin-top: 2em;
  max-width: 400px;
  padding: 2em 3em;
  background: #fbfbfb;
  border: 1px solid #ccc;
}

/* 会員・ポイントについて */
#member .guide-menu ul li a.m-member {
  background: #1c1c3a;
  color: #fff;
}
#member .read {
  width: 98%;
  margin: 0 auto 2em;
}
#member h3.t-tokuten {
  font-size: 1.1rem;
  background: #fbfbfb;
  margin-bottom: 1em;
  padding: 0.5em;
  border-top: 1px dotted #ccc;
  border-bottom: 1px dotted #ccc;
}
#member h3.t-tokuten span {
  margin-right: 0.5em;
  padding: 0.25em 1em;
  background: #ff5f2f;
  color: #fff;
  font-size: 0.7em;
}

/*===========================================================================*/
/*  media quary:767px  */
/*===========================================================================*/
@media screen and (max-width: 767px) {
  #container {
    margin-bottom: 0;
  }

  .guide-menu {
    margin-top: 2em;
    margin-bottom: 4em;
  }
  .guide-menu ul li {
    width: 100%;
    margin: 0;
  }
  .guide-menu ul li a {
    padding: 1em;
    border: none;
    border-top:0 ;
    border-left:0 ;
    border-right:0 ;
    border-bottom: 1px solid #ccc;
  }

  .guide-menu ul li a:hover {
    text-decoration: none;
    background: #ff5f2f;
    color: #fff;
    border-top:0 ;
    border-left:0 ;
    border-right:0 ;
    border-bottom: 1px solid #ccc;
  }

  .in-box .box .txt{
    width: 100%;
    float:none;
  }
  .in-box .box .img{
    width: 100%;
    float:none;
    padding-left:0px;
    margin-top:20px;
  }

  /* 会員・ポイントについて */
  #member .read {
    width: 98%;
    margin: 0 auto 2em;
  }
  #member h3.t-tokuten {
    font-size: 1rem;
    margin-bottom: 0.5em;
    padding: 0.25em;
  }
  #member h3.t-tokuten span {
    padding: 0.25em 0.5em;
    font-size: 0.7em;
  }

  /* お支払方法 */

  #payment .in-box .card img {
    max-width: 300px;
  }
  #payment .in-box ul {
    margin: 1em 0;
    list-style-type: disc;
    margin-left: 1.5em;
  }
  #payment .in-box table {
    width: 100%;
    max-width: 280px;
    margin: 1em auto 0 0;
    border: 1px solid #ccc;
  }
  #payment .in-box table th, #payment .in-box table td {
    width: 50%;
    padding: 0.5em;
    border-right: 1px solid #ccc;
    text-align: center;
    display: table-cell;
  }
  #payment .in-box table td {
    text-align: right;
  }
  #payment .furikomi {
    display: block;
    margin-top: 1em;
  }
  #payment .furikomi .l-area {
    margin-bottom: 20px;
  }
  #payment .furikomi .l-area dl dt {
    width: 100px;
  }
  #payment .furikomi .fig {
    max-width: inherit;
    width: 100%;
    text-align: center;
    margin: 0 auto;
  }
  #payment .furikomi .fig img {
    max-width: 190px;
  }
}