@charset "utf-8";

/* マイページナビボタン */

#mynavarea li {
  display: block;
  padding: 5px 0;
  margin: 0 auto;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  background: url("../img/mypage/icon_mgnav.png") no-repeat 98% 50%;
  border-bottom: 1px dotted #ccc;
}

form .custom-selectbox::before {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: block;
  width: 15px;
  height: 100%;
  padding: 0 0.35em;
  text-align: center;
  pointer-events: none;
  content: '';
  background: url(../img/mypage/select_arrow_all.png) no-repeat center center;
}

form .custom-regselectbox::before {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: block;
  width: 15px;
  height: 100%;
  padding: 0 0.35em;
  text-align: center;
  pointer-events: none;
  content: '';
  background: url(../img/mypage/select_arrow_all.png) no-repeat center center;
}

div#windowarea {
  width: 100%;
  margin: 15px auto 0 auto;
}

div#windowarea table {
  padding: 10px 0;
  margin-top: 10px;

  /*    width: 0;		*/
}

div#windowarea th {
  width: 90px;
  padding: 10px 0;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  background: #fff;
  border-bottom: 1px dotted #aaa;
}

div#mypagecolumn input[type="radio"],
div#mypagecolumn input[type="checkbox"] {
}



/* -----------------------------------------------
下層共通指定
----------------------------------------------- */
#mypagecolumn {
  width: 90%;
  padding: 3em 0 0;
  margin: 2% auto;
}


/* -----------------------------------------------
MYPAGE共通指定
----------------------------------------------- */
#mycontentsarea {
  float: right;
  width: 72%;
  padding: 1%;
  margin: 2% 0 0 1%;
  font-size: 14px;
}

#mycontentsarea table th.resulttd {
  text-align: right;
}

#mycontentsarea table.delivname { padding: 0; margin: 0 auto; }

#mycontentsarea table.delivname th {
  width: 30%;
  color: #555;
  text-align: left;
  background: #fff;
  border-bottom: 1px solid #ccc;
}

#mycontentsarea table.delivname td {
  padding: 10px 8px;
  line-height: 1.5rem;
  border-bottom: 1px solid #ccc;
}
.delivname p { padding: 5px 0; }

#mycontentsarea table caption {
  padding: 8px;
  font-weight: bold;
  color: #000;
  text-align: left;
  background-color: #f0f0f0;
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

#mycontentsarea .order_delchange input[type="button"] {
  position: relative;
  display: block;
  float: right;
  width: 150px;
  padding: 10px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: #313131;
  text-decoration: none;
  white-space: normal;
  white-space: normal;
  cursor: pointer;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  -webkit-border-radius: 1px;
  border-radius: 2px;
}

#mypagecolumn em {
  margin: 5px 0;
  font-size: 12px;
  font-style: normal;
  color: #e20000;
}

/* 回り込み
--------------------------------- */
#mypagecolumn .fl_r { float: right; }
#mypagecolumn .fl_l { float: left; }


/* 間隔
--------------------------------- */

/* パディング(内側) */
#mypagecolumn .pdr5,
#windowcolumn .pdr5 { padding-right: 5px; }

#mypagecolumn .pdl5,
#windowcolumn .pdl5 { padding-left: 5px; }

#mypagecolumn .pdl10,
#windowcolumn .pdl10 { padding-left: 10px; }

#mypagecolumn .pdlr5,
#windowcolumn .pdlr5 { padding-right: 5px; padding-left: 5px; }

#mypagecolumn .pdlr10,
#windowcolumn .pdlr10 { padding-right: 10px; padding-left: 10px; }

#mypagecolumn .pd10,
#windowcolumn .pd10 { padding: 10px; }

#mypagecolumn .pdtb10,
#windowcolumn .pdtb10 { padding: 10px 0; line-height: 1.3em; }

#mypagecolumn .pdt15,
#windowcolumn .pdt15 { padding-top: 15px; }

/* マージン(外側) */
#mypagecolumn .mgt10,
#windowcolumn .mgt10 { margin-top: 10px; }

#mypagecolumn .mgt20,
#windowcolumn .mgt20 { margin-top: 20px; }

#mypagecolumn .mgt30,
#windowcolumn .mgt30 { margin-top: 30px; }

#mypagecolumn .mgb10,
#windowcolumn .mgb10 { margin-bottom: 10px; }

#mypagecolumn .mgb15,
#windowcolumn .mgb15 { margin-bottom: 15px; }

#mypagecolumn .mgb20,
#windowcolumn .mgb20 { margin-bottom: 20px; }

#mypagecolumn .mgtb10,
#windowcolumn .mgtb10 { margin-top: 10px; margin-bottom: 10px; }

#mypagecolumn .mgtb15,
#windowcolumn .mgtb15 { margin-top: 15px; margin-bottom: 15px; }


/* 配置 */
#mypagecolumn .pst-10 { position: relative; top: -10px; }
#mypagecolumn .pst-7 { position: relative; top: -7px; }
#mypagecolumn .pst-5 { position: relative; top: -5px; }
#mypagecolumn .pst { position: relative; top: 0; }
#mypagecolumn .pst3 { position: relative; top: 3px; }
#mypagecolumn .pst4 { position: relative; top: 4px; }
#mypagecolumn .pst5 { position: relative; top: 5px; }
#mypagecolumn .pst7 { position: relative; top: 7px; }
#mypagecolumn .pst10 { position: relative; top: 10px; }
#mypagecolumn .pst13 { position: relative; top: 13px; }
#mypagecolumn .pst15 { position: relative; top: 15px; }
#mypagecolumn .pst20 { position: relative; top: 20px; }


/* フォント
--------------------------------- */
#mypagecolumn .ft-size120 { font-size: 100%; font-weight: bold; }

#mypagecolumn .cl_red {
  margin: 5px 0;
  font-size: 100%;
  font-style: normal;
  color: #e20000;
}

#mypagecolumn .red { color: #c30; }


/* select 装飾用
 --------------------------------- */
#mypagecolumn form .custom-selectbox,
#windowcolumn form .custom-selectbox {
  position: relative;
  z-index: 1;

  /* box-sizing */
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  vertical-align: middle;
  background-color: white;
  border: 1px solid #c8c8c8;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

#mypagecolumn form .custom-selectbox::before,
#windowcolumn form .custom-selectbox::before {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: block;
  width: 15px;
  height: 100%;
  padding: 0 0.35em;
  text-align: center;
  pointer-events: none;
  content: '';
  background: url(../img/mypage/select_arrow_all.png) no-repeat center center;
}

#mypagecolumn form .custom-selectbox select,
#windowcolumn form .custom-selectbox select {
  /* background:#fff; */

  /* box-sizing */
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 30px;
  padding: 0 10px !important;
  margin: 0;
  font-size: 1em;
  line-height: normal;
  border: 0 none;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}


/* select 装飾用(定期申込お届け変更用) */
#mypagecolumn form .custom-regselectbox {
  position: relative;
  z-index: 1;

  /* box-sizing */
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  vertical-align: middle;
  background-color: white;
  border: 1px solid #c8c8c8;

  /* border-radius */
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

#mypagecolumn form .custom-regselectbox::before {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: block;
  width: 15px;
  height: 100%;
  padding: 0 0.35em;
  text-align: center;
  pointer-events: none;
  content: '';
  background: url(../img/mypage/select_arrow_all.png) no-repeat center center;
}

#mypagecolumn form .custom-regselectbox select {
  /* background:#fff; */

  /* box-sizing */
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 30px;
  padding: 0 20px 0 10px !important;
  margin: 0;
  font-size: 1em;
  line-height: normal;
  border: 0 none;

  /* border-radius */
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}



/* 幅 */
#mypagecolumn .w10,
#windowcolumn .w10 { width: 10%; }

#mypagecolumn .w15,
#windowcolumn .w15 { width: 15%; }

#mypagecolumn .w20,
#windowcolumn .w20 { width: 20%; }

#mypagecolumn .w30,
#windowcolumn .w30 { width: 30%; }

#mypagecolumn .w40,
#windowcolumn .w40 { width: 40%; }

#mypagecolumn .w50,
#windowcolumn .w50 { width: 50%; }

#mypagecolumn .w60,
#windowcolumn .w60 { width: 60%; }

#mypagecolumn .w65,
#windowcolumn .w65 { width: 65%; }

#mypagecolumn .w70,
#windowcolumn .w70 { width: 70%; }

#mypagecolumn .w80,
#windowcolumn .w80 { width: 80%; }

#mypagecolumn .w90,
#windowcolumn .w90 { width: 90%; }

#mypagecolumn .w95,
#windowcolumn .w95 { width: 95%; }

#mypagecolumn .w98,
#windowcolumn .w98 { width: 98%; }

#mypagecolumn .w100,
#windowcolumn .w100 { width: 100%; }


/* インプットタイプ (マイページ全体)
----------------------------------------------- */
#mypagecolumn input[type="radio"] { font-size: x-large; }

#mypagecolumn input[type="radio"],
#mypagecolumn input[type="checkbox"] {
  display: inline-block;
  margin-right: 6px;
}

#mypagecolumn td input[type="radio"] {
  display: inline-block;
  margin-right: 10px;
}

#mypagecolumn input[type=radio] + label {
  position: relative;
  top: -1px;
  left: -27px;
  display: inline-block;
  margin-right: 12px;
  font-size: 14px;
  line-height: 30px;
  cursor: pointer;
}

#mypagecolumn input[type=checkbox] + label {
  position: relative;
  left: 0;
  display: inline-block;
  margin-right: 12px;
  font-size: 14px;
  line-height: 30px;
  cursor: pointer;
}

@media (min-width: 1px) {
  #mypagecolumn input[type=radio] {
    display: none;
    margin: 0;
  }

  #mypagecolumn input[type=checkbox] {
    display: none;
    margin: 0;
  }

  #mypagecolumn input[type=radio] + label {
    padding: 0 0 0 24px;
  }

  #mypagecolumn input[type=checkbox] + label {
    padding: 0 0 0 24px;
    line-height: 1.5em;
  }

  #mypagecolumn input[type=radio] + label::before,
  #mypagecolumn input[type=checkbox] + label::before {
    position: absolute;
    top: 50%;
    left: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    content: "";
    background: #fff;
  }

  #mypagecolumn input[type=radio] + label::before {
    border: 2px solid #ccc;
    border-radius: 30px;
  }

  #mypagecolumn input[type=checkbox] + label::before {
    border: 2px solid #ccc;
  }

  #mypagecolumn input[type=radio]:checked + label::after,
  #mypagecolumn input[type=checkbox]:checked + label::after {
    position: absolute;
    top: 50%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    content: "";
  }

  #mypagecolumn input[type=radio]:checked + label::after {
    left: 5px;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    background: #3e86fc;
    border-radius: 8px;
  }

  #mypagecolumn input[type=checkbox]:checked + label::after {
    left: 3px;
    width: 16px;
    height: 8px;
    margin-top: -8px;
    border-bottom: 3px solid #e71063;
    border-left: 3px solid #e71063;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}

#mypagecolumn input[type='text'] {
  height: 20px;
  font-size: 1rem;
  line-height: 1.1;
  border: 1px solid #c4ccce;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px !important;
  box-shadow: none;

  /*    width: 60%;	*/
}


/* お支払い方法 radio/checkbox
----------------------------------------------- */

/* payment_info */
#mypagecolumn .payment_info ul li input[type="radio"],
#mypagecolumn .payment_info ul li input[type="checkbox"] {
  display: none;
  margin-right: 5px;
}

#mypagecolumn .payment_info ul li input[type=radio] + label {
  position: relative;
  top: -1px;
  left: -27px;
  display: inline-block;
  margin-right: 12px;
  font-size: 14px;
  line-height: 30px;
  cursor: pointer;
}

#mypagecolumn .payment_info ul li input[type=checkbox] + label {
  position: relative;
  left: 0;
  display: inline-block;
  margin-right: 12px;
  font-size: 14px;
  line-height: 30px;
  cursor: pointer;
}

@media (min-width: 1px) {
  #mypagecolumn .payment_info ul li input[type=radio],
  #mypagecolumn .payment_info ul li input[type=checkbox] {
    display: none;
    margin: 0;
  }

  #mypagecolumn .payment_info ul li input[type=radio] + label,
  #mypagecolumn .payment_info ul li input[type=checkbox] + label {
    padding: 0 0 0 24px;
  }

  #mypagecolumn .payment_info ul li input[type=radio] + label::before {
    position: absolute;
    top: 50%;
    left: 30px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    content: "";
    background: #fff;
  }

  #mypagecolumn .payment_info ul li input[type=checkbox] + label::before {
    position: absolute;
    top: 50%;
    left: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    content: "";
    background: #fff;
  }

  #mypagecolumn .payment_info ul li input[type=radio] + label::before {
    border: 2px solid #ccc;
    border-radius: 30px;
  }

  #mypagecolumn .payment_info ul li input[type=checkbox] + label::before {
    border: 2px solid #ccc;
  }

  #mypagecolumn .payment_info ul li input[type=radio]:checked + label::after,
  #mypagecolumn .payment_info ul li input[type=checkbox]:checked + label::after {
    position: absolute;
    top: 50%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    content: "";
  }

  #mypagecolumn .payment_info ul li input[type=radio]:checked + label::after {
    left: 35px;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    background: #3e86fc;
    border-radius: 8px;
  }

  #mypagecolumn .payment_info ul liinput[type=checkbox]:checked + label::after {
    left: 3px;
    width: 16px;
    height: 8px;
    margin-top: -8px;
    border-bottom: 3px solid #e71063;
    border-left: 3px solid #e71063;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}


/* ラベル
----------------------------------------------- */
#mypagecolumn span.required,
#windowcolumn span.required {
  position: relative;
  top: -0.25em;
  padding: 0.1em 0.5em;
  margin: 0 0 0 1em;
  font-size: 70%;
  color: #fff;
  vertical-align: middle;
  background: #e54848;
  border-radius: 0.4em;
}

#mypagecolumn span.any,
#windowcolumn span.any {
  position: relative;
  top: -0.25em;
  padding: 0.1em 0.5em;
  margin: 0 0 0 1em;
  font-size: 70%;
  color: #fff;
  vertical-align: middle;
  background: #999;
  border-radius: 0.4em;
}

#mypagecolumn .attention,
#windowcolumn .attention { margin-left: 5px; font-size: 12px; line-height: 1.5rem; color: #d00000; }



/* 住所自動入力
----------------------------------------------- */
#mypagecolumn .zipimg,
#windowcolumn .zipimg { padding: 0; margin: 0; }

#mypagecolumn .zipimg img,
#windowcolumn .zipimg img { margin: 5px 0 0 0; }

#mypagecolumn .zipimg a,
#windowcolumn .zipimg a {
  color: #666;
  text-decoration: none;
}

#mypagecolumn .zipimg a:hover,
#windowcolumn .zipimg a:hover { color: #666; }

#mypagecolumn .zip_bt,
#windowcolumn .zip_bt {
  position: relative;
  padding: 5px 10px;
  margin: 0 0 0 5px;
  font-size: 100%;
  font-weight: noramal;
  line-height: 1rem;
  text-decoration: none;
  letter-spacing: 0.002rem;
  cursor: pointer;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ccc;

  /* border-radius */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}


/* マイページ テーブル
----------------------------------------------- */

#mypagecolumn table {
  width: 100%;

  /* margin: 0 auto 10px auto; */
  padding: 0;
  text-align: left;
  border-collapse: collapse;
}

#mypagecolumn table th {
  padding: 5px 5px;
  font-weight: normal;
  color: #fff;
  background: #666;
}

#mypagecolumn table td {
  padding: 15px 8px;
  border-bottom: 1px solid #ccc;
}




/* ヘッダー
----------------------------------------------- */
#mypagecolumn .head {
  padding: 0;
  margin: 5px auto 0;
  overflow: hidden;
  font-size: 150%;
  font-weight: normal;
  border-bottom: 1px solid #545454;

  /*    display:none;	*/
}

#mypagecolumn .head h2 {
  margin: 0;
  font-size: 100%;
  text-align: left;
}

#mypagecolumn .subhead {
  margin: 5px auto;
  font-size: 12px;
  font-weight: nomal;
  background-color: #f7f7f7;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 0 1px 6px #ccc;
  -webkit-box-shadow: 0 1px 6px #ccc;
  box-shadow: 0 1px 6px #ccc;
}

#mypagecolumn .t_mypage {
  padding: 0;
  font-weight: bold;
  color: #333;
}

#mypagecolumn .t_login {
  padding: 8px 40px;
  font-size: 16px;
  color: #000;
  background: url("../img/icon/icon_login.png") no-repeat 1% 48%;
}

#mypagecolumn .t_area {
  padding-bottom: 5px;
  margin: 0 0 10px 0;
  overflow: hidden;
}



/* タイトル
----------------------------------------------- */
#mypagecolumn .mycont_head {
  margin: 0 auto 10px auto;
  overflow: hidden;
  font-size: 100%;
  font-weight: bold;
}

#mypagecolumn .mycont_head h3 {
  padding: 0 0 5px 0;
  font-size: 1.8rem;
  font-weight: 800;
  color: #555;
}

#mypagecolumn .mycont_headttl {
  position: relative;
  padding: 5px;
  font-size: 14px;
  font-weight: normal;
  color: #313131;
  color: #313131;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  border-radius: 2px;
}

#mypagecolumn .mycont_headttl2 {
  position: relative;
  padding: 5px;
  overflow: hidden;
  font-size: 14px;
  font-weight: bold;
  color: #313131;
  color: #313131;
  border-bottom: 2px solid #666;
}

#mypagecolumn .mycont_headttl3 {
  position: relative;
  padding: 5px;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  background: #666;
  border-radius: 2px;
}

#mypagecolumn .ttl_blue {
  padding: 5px;
  overflow: hidden;
  color: #fff;
  background: #4a89be;
}

#mypagecolumn .have {
  padding: 2%;
  margin: 0 0;
  font-size: 16px;
  color: #000;
  font-wight: bold;
}

#mypagecolumn .d_have {
  padding: 2%;
  margin: 0 0;
  font-size: 16px;
  color: #000;
  font-wight: bold;
}




/* 段落
----------------------------------------------- */

.p_waku {
  display: inline-block;
  padding: 10px;
  margin: 10px auto;
  background: #fff;
  border: 1px solid #ccc;
}

.p_waku1 {
  padding: 10px;
  margin: 10px auto;
  background: #f6f6f6;
}

.p_waku2 {
  padding: 10px;
  margin: 10px auto;
  background: #fff;
  border: 1px solid #ccc;
}

.p_waku3 {
  padding: 10px;
  margin: 10px auto;
  background: rgb(235, 246, 255);
}


/* ページビュー
----------------------------------------------- */
.bg_pgnav { padding: 5px; line-height: 1.5rem; text-align: center; background: #f6f6f6; }
.pg_nav { margin: 5px 5px 10px 5px; text-align: right; }
.pg_nav a { color: #0073ea; }

/* ページ件数
----------------------------------------------- */
.pg_num { display: inline-block; float: left; padding: 0; margin: 10px 0; }


/* 共通指定ここまで---------------------------- */


/* -----------------------------------------------
ログイン
----------------------------------------------- */

#mypagecolumn .loginarea {
  width: 46%;
  padding: 1%;
  margin: 0 auto 80px;
  clear: both;
  text-align: center;

  /* min-height: 420px; */
  border: 1px solid #000;

  /* box-shadow: 0 2px 4px #ccc;
    -webkit-box-shadow: 0 2px 4px #ccc;
    -moz-box-shadow: 0 2px 4px #ccc; */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

#mypagecolumn .loginarea .inputtext {
  margin: 5% auto;
}

#mypagecolumn .loginarea .inputtext02 {
  margin: 5% auto 0 auto;
  font-size: 90%;

  /* float:left; */
}

#mypagecolumn .loginarea .inputbox {
  width: 90%;
  padding: 5%;
  margin: 3% auto;
}

#mypagecolumn .loginarea .inputbox .passwd {
  margin: 15px 0 0 0;
}

#mypagecolumn .loginarea .inputbox .box250 {
  width: 69%;
  padding: 5px;
  margin: 5px 0 0 0;
  border: 1px solid #ccc;
}

#mypagecolumn .loginarea .inputbox .box275 {
  position: relative;
  width: 69%;
  padding: 5px;
  margin: 5px 0 0 0;
  border: 1px solid #ccc;

  /* left:23px; */
}

#mypagecolumn .loginarea .inputbox02 {
  width: 460px;
  padding: 15px 20px;
  margin: 15px auto 0 auto;
  text-align: center;
}


/* -----------------------------------------------
マイページボタン
----------------------------------------------- */

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

/* 戻るボタン */
.btn_rpst3_1 {
  display: inline-block;
  width: 25%;
  padding: 0 3px;
  margin: 20px 0 10px 10px;
  font-size: 0.85em;
  background: #333;
}

.btn_rpst3_2 {
  /*    width: 25%;	*/
  float: left;
  font-size: 0.85em;
  background: #fff;
}

.btn_mgprev {
  padding: 0;
  margin: 0;
  text-align: left;
}

.btn_mgprev a {
  display: block;
  height: 25px;
  padding: 10px 5px 0 30px;
  margin: 10px 0;
  font-size: 15px;
  color: #333 !important;
  text-decoration: none;
  background: url("../img/icon/icon_prev.png") no-repeat 2% 50%;
}

.btn_mgprev a:hover {
  text-decoration: none;
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}

/* 定期コース申込詳細
----------------------------- */

/* ボタンエリア */
#mypagecolumn .course_dt {
  position: relative;
  top: -5px;
  float: right;
  padding: 0;
  margin: 0;
}

#mypagecolumn .course_dt span {
  display: inline-block;
  padding: 0;
  margin: 0 auto;
}

/* スキップ、一時停止、解約 */
#mypagecolumn .gbtn { width: 100px; padding: 3px; text-align: center; cursor: pointer; }

#mypagecolumn .gbtn a {
  position: relative;

  /* text-shadow: rgb(76, 76, 76) 2px 1px 2px; */
  display: block;
  padding: 3px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: #313131;
  text-decoration: none;
  cursor: pointer;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);

  /* background */
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  -webkit-border-radius: 1px;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

#mypagecolumn .gbtn a:hover,
#mypagecolumn .bbtn a:hover {
  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  opacity: 0.5;
}

/* 閉じるボタン */
#mypagecolumn .bbtn {
  width: 100px;
  padding: 3px;
  margin: 0 auto;
  text-align: center;
  cursor: pointer;
}

#mypagecolumn .bbtn a {
  position: relative;

  /* text-shadow: rgb(76, 76, 76) 2px 1px 2px; */
  display: block;
  padding: 3px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  background-color: #4a89be;
  border: 1px solid #ddd;
  -webkit-border-radius: 1px;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

#mypagecolumn input .regbtn {
  position: relative;
  display: block;
  padding: 3px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: 600;
  color: #666;
  text-decoration: none;
  text-decoration: none;
  white-space: normal;
  white-space: normal;
  cursor: pointer;

  /* background */
  background: #ddd;
  background: -moz-linear-gradient(top, #ddd 0%, #e8e8e8 100%);
  background: -webkit-linear-gradient(top, #ddd 0%, #e8e8e8 100%);
  background: linear-gradient(to bottom, #ddd 0%, #e8e8e8 100%);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ddd', endColorstr='#e8e8e8', GradientType=0);
  border: double 5px #f6f6f6;
  -webkit-border-radius: 1px;

  /* border-radius */
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;

  /* border-image */
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
}

/* 変更するボタン(サイクル、希望日、支払い方法) */
.mouosikomi_tb input[type="button"] {
  position: relative;
  display: block;
  width: 100px;
  height: 30px;
  padding: 3px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: #313131;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: -linear-gradient(top, #fff, #f1f1f1);
  -pie-bacms-linear-gradient(top,#fff,#f1f1f1)
  background: kground;
  backgroundbackground

  /* background */
  background-color: #f1f1f1;
  border: 1px solid #ddd;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

/* お届け先リスト
----------------------------- */

/* 新規追加ボタン */
#mypagecolumn .del_newbox {
  padding: 2%;
  margin: 0 auto 20px auto;
  overflow: hidden;
  line-height: 160%;
  background: #f0f0f0;
  border: 1px solid #ddd;
}

#mypagecolumn .deliv_newbt {
  position: relative;
  top: 3px;
  right: 10px;
  float: right;
  width: 260px;
  margin: 0 0 10px 0;
  text-align: center;
  background-color: #4a89be;
  border: 1px solid #ddd;

  /* border-radius */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

#mypagecolumn .deliv_newbt a {
  display: block;
  min-width: 100px;
  padding: 10px 20px;
  margin: 0;
  font-weight: normal;
  color: #fff;
  text-decoration: none;
}

#mypagecolumn .deliv_newbt a:hover {
  color: #fff;
  background: #61aeef;
}

/* 変更・削除ボタン */
#mypagecolumn .del_bt {
  width: 100px;
  height: 0;
  padding: 0;
  margin: 0 auto 25px auto;
  clear: both;
  font-size: 1em;
  line-height: 0;
  text-align: center;
}

#mypagecolumn .del_bt a {
  position: relative;
  display: block;
  padding: 15px 0;
  margin: 0;
  color: #313131;
  text-decoration: none;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /* border-radius */
  border-radius: 2px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

#mypagecolumn .del_bt a:hover {
  color: #fff;
  text-decoration: none;
  background: #d96040;
  border: 1px solid #ddd;
  border-radius: 2px;
}

/* ポイント・お気に入り
----------------------------- */

/* 詳細ボタン */

/* タブ縦以上用 */
@media only screen and (min-width: 768px) {
  #mypagecolumn .btn_fv {
    width: 80px;
  }
}

#mypagecolumn .btn_fv {
  height: 0;
  padding: 0;
  margin: 0 auto 25px auto;
  clear: both;
  font-size: 0.85em;
  line-height: 0;
  text-align: center;
}

#mypagecolumn .btn_fv a {
  position: relative;
  display: block;
  padding: 10px 0;
  margin: 0;
  color: #313131;
  text-decoration: none;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  border-radius: 2px;
}

#mypagecolumn .btn_fv a:hover {
  color: #fff;
  text-decoration: none;
  background: #d96040;
  border: 1px solid #ddd;
  border-radius: 2px;
}


/* お気に入り
----------------------------- */

/* チェックしたアイテムを一括削除ボタン */
#mypagecolumn .btn_fv2 {
  float: right;
  width: 240px;
  margin: 0 auto;
  font-size: 0.85em;
  line-height: 0;
  text-align: center;
}

#mypagecolumn .btn_fv2 a {
  position: relative;
  display: block;
  padding: 15px 0;
  margin: 0 auto;
  color: #313131;
  text-decoration: none;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  border-radius: 2px;
}

#mypagecolumn .btn_fv2 a:hover {
  color: #fff;
  text-decoration: none;
  background: #d96040;
  border: 1px solid #ddd;
  border-radius: 2px;
}


/* 購入履歴、定期申込一覧
----------------------------- */

/* 詳細エリア */
.list_area {
  /*
    margin: 0 auto;
    padding:2%;
    width: 100%;
	*/
}

.list_area ul {
  /*
    width: 100%;
    display: table;
	*/

  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -ms-flex-align: stretch;
}

.list_area ul li {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  align-items: center;

  /*
    display: table-cell;
    overflow: hidden;
	*/
  width: 48%;
  -ms-flex-align: center;
}

.list_area ul li a {
  color: #555;
  text-decoration: none;
}

.list_area {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -ms-flex-align: stretch;
}

.list_area a {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  width: 48%;
  padding: 8px 0;
  line-height: 1.2;
  color: #555;
  text-decoration: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -ms-flex-pack: center;
  -ms-flex-align: center;
}

.list_area a:nth-child(1) {
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ccc;
}

.list_area a:nth-child(2) {
  color: #fff;
  background-color: #777;
}

.list_area a:hover {
  color: #fff;
  background: #d96040;
}


/* 詳細ボタン */

/*
.mg_dtbtn {
    float: left;
    height: 40px;
    padding: 0 3px;
    width: 90%;
    line-height: 1rem;
    cursor: pointer;
    font-weight: noramal;
    font-size: 100%;
    letter-spacing: 0.002rem;
    text-decoration: none;
    position: relative;
    letter-spacing: 0.002rem;
    text-decoration: none;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    background: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#f1f1f1));
    background: -webkit-linear-gradient(top,#fff,#f1f1f1);
    background: -moz-linear-gradient(top,#fff,#f1f1f1);
    background: -ms-linear-gradient(top,#fff,#f1f1f1);
    background: -o-linear-gradient(top,#fff,#f1f1f1);
    background: linear-gradient(top,#fff,#f1f1f1);
    -pie-background: linear-gradient(top,#fff,#f1f1f1);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0,.1);
    -o-box-shadow: 0 1px 1px rgba(0,0,0,.1);
    box-shadow: 0 1px 1px rgba(0,0,0,.1);
}
*/
.mg_dtbtn {
  text-decoration: none;
  cursor: pointer;
}

/* お届け先変更ボタン */
.mg_dtbtn2 {
  position: relative;
  float: right;
  width: 80%;
  height: 40px;
  padding: 0;
  margin-right: 8px;
  font-size: 90%;
  font-weight: noramal;
  line-height: 1.2;
  color: #fff;
  text-decoration: none;
  letter-spacing: 0.002rem;
  cursor: pointer;
  background-color: #666;
  border: 1px solid #ccc;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.mg_dtbtn:hover,
.mg_dtbtn2:hover,
mg_dtbtn3:hover {
  color: #fff;
  text-decoration: none;
  background: #d96040;
  border: 1px solid #ddd;
  border-radius: 2px;

  /* border-radius */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.mg_dtbtn3 {
  position: relative;
  width: 50%;
  padding: 5px 20px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: noramal;
  line-height: 1rem;
  text-align: center;
  text-decoration: none;
  letter-spacing: 0.002rem;
  cursor: pointer;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ccc;
  -webkit-border-radius: 1px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.mg_dtbtn3 a {
  color: #555;
}

.btn_dt {
  display: inline-block;
  font-size: 90%;
  line-height: 1rem;
  text-align: center;
}

.btn_dt a {
  position: relative;
  display: block;
  padding: 7px 12px 5px 12px;
  margin: 0;
  color: #212121;
  color: #333;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4x;
  border-radius: 2px;
  border-radius: 4px;
}

.btn_dt a:hover {
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}

.btn_ch {
  display: inline-block;
  font-size: 90%;
  line-height: 1rem;
  text-align: center;
}

.btn_ch a {
  display: block;
  padding: 7px 5px 5px 5px;
  margin: 0;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background: #666;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4x;
  #mypagecolumn .reglar_list table td
    border-radius: 4px;.reglar_listtabletdborder-radius.reglar_listtabletdborder-radius.reglar_listtabletdborder-radius.reglar_listtabletdborder-radius
}

.btn_ch a:hover {
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}

.reg_btn {
  position: relative;
  display: inline-block;
  padding: 6px 12px 5px 12px;
  margin: 0 auto;
  font-size: 90%;
  font-weight: normal;
  line-height: 1rem;
  color: #333;
  text-decoration: none;
  cursor: pointer;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  -webkit-border-radius: 1px;
  -moz-border-radius: 4x;
  border-radius: 2px;
  border-radius: 4px;
}

.reg_btn:hover {
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}

/* 戻るボタン */
.mypage_back {
  padding: 10px 0;
  margin: 0 auto;
  border-top: 1px solid #ccc;
}

.mg_btnarea {
  padding: 3% 10%;
  margin: 0 auto;
  background: #f0f0f0;
  border: #ccc;
}


/* 支払方法変更,退会する
--------------------------- */

/* 決定ボタン */
.mg_newbtn {
  width: 350px;
  padding: 0;
  margin: 4% auto;
  font-size: 14px;
  line-height: 40px;
  text-align: center;
  list-style: none;
  background: #4a89be;
}

.mg_newbtn a {
  display: block;
  height: 40px;
  padding: 0;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mg_newbtn a:hover {
  text-decoration: none;
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}


/* 退会ボタン(NO) */
.refusal_no {
  position: relative;
  padding: 0;
  margin: 2% auto;
  clear: both;

  /* width: 350px; */
  font-size: 14px;
  line-height: 30px;
  color: #313131;
  text-align: center;
  list-style: none;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #ddd;
  border-radius: 2px;
}

.refusal_no a {
  display: block;
  height: 30px;
  padding: 0;
  overflow: hidden;
  color: #333;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.refusal_no a:hover {
  text-decoration: none;
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}

.mp_graybt { width: 180px; padding: 5px; color: #444; text-align: center; background: #ccc; }

/* カード情報
-----------------------------------------------/*
変更ボタン */
.cardch_bt {
  /*
    width: 200px;
    height: 0;
    margin: 0 5px 25px auto;
    padding: 0;
    font-size: 1em;
    text-align: center;
    line-height: 0;
    clear: both;
	*/
}

.cardch_bt a {
  display: block;
  padding: 4px 10px;
  margin: 0;
  color: #313131;
  text-decoration: none;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);

  /* backgroun */
  background-color: #f1f1f1;
  border: 1px solid #ddd;

  /* border-radius */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;

  /* box-shadow */
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.cardch_bt a:hover {
  color: #fff;
  text-decoration: none;
  background: #d96040;
  border: 1px solid #ddd;

  /* border-radius */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

/* 新規ボタン */
.cardnew_bt {
  /* float: right; */
  position: relative;
  top: -5px;
  margin: 0 0 10px 0;
  text-align: center;
  background: #4a89be;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.cardnew_bt a {
  display: block;
  min-width: 100px;
  padding: 10px 20px;
  margin: 0;
  font-weight: normal;
  color: #fff;
  text-decoration: none;
}

.cardnew_bt a:hover {
  color: #fff;
  background: #61aeef;
}


/* -----------------------------------------------
My Page Navigation */

#mypagecolumn #mynavarea {
  display: inline-block;
  width: 24%;

  /* margin: 10px 0;
    padding: 1%; */
  overflow: hidden;
}

/* マイページナビタイトル */
#mypagecolumn .titleCommon {
  /* background:#666; */
}

#mypagecolumn .titleCommon.sideColumn {
  padding: 3px 0 3px 3px;
  margin: 30px 0 0 0;
  font-family: "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5rem;
  color: #444;
  white-space: nowrap;
  border-bottom: 1px solid #ccc;
}


/* マイページナビボタン */

#mypagecolumn #mynavarea ul {
  padding: 0;
  margin: 0 auto;
  border-bottom: none;
}

#mypagecolumn #mynavarea li {
  display: block;
  padding: 5px 0;
  margin: 0 auto;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  background: none;
  border-bottom: 1px dotted #ccc;
  box-shadow: none;
}

#mypagecolumn #mynavarea li a {
  position: relative;
  display: block;
  width: 95%;
  height: auto;
  padding: 8px 0 10px 5px;
  margin: 0 auto;
  color: #444;
  text-decoration: none;
  background: url("../img/mypage/icon_mgnav.png") no-repeat 98% 50%;
}

#mypagecolumn #mynavarea li a:hover {
  font-weight: bold;
  color: #333;
  text-decoration: none;
  background-color: #eee;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

#mypagecolumn #mynavarea .mynav li {
  padding: 5px 0;
  overflow: hidden;
  border-bottom: 1px solid #eee;
}

#mypagecolumn #mynavarea ul.mynav p.menu {
  float: left;
  padding: 15px 0;
  margin-top: 1px;
  font-size: 110%;
  font-weight: normal;
  line-height: 1.3rem;
  cursor: pointer;
}

#mypagecolumn #mynavarea .nav_bt {
  float: right;
  padding: 10px 0;
  margin: 1px 0 1px 8px;
  text-align: left;
  cursor: pointer;
}

#mypagecolumn #mynavarea .nav_bt a {
  position: relative;
  display: block;
  width: 115px;
  padding: 5px 0 3px 5px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: rgb(255, 255, 255);

  /* -webkit-box-shadow: 2px 2px 1px #D4D4D4; */
  text-decoration: none;
  letter-spacing: 0.001rem;
  white-space: normal;
  cursor: pointer;
  background: #666; /* Old browsers */
  border: double 5px #f6f6f6;
  -webkit-border-radius: 5px;
}

#mypagecolumn #mynavarea .nav_bt a::after {
  position: absolute;
  top: 30%;
  right: 5%;
  display: block;
  width: 6px;
  height: 6px;
  font-weight: bold;
  content: '';
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#mypagecolumn .pg_num1 {
  /* padding: 10px; */
  overflow: hidden;
}

#mypagecolumn #mynavarea .sidememo {
  margin-left: 5px;
  font-size: 1.2rem;
  font-weight: normal;
  letter-spacing: 0.0001em;
}

/* -----------------------------------------------
welcome */

#mypagecolumn .welcome {
  float: right;
  font-size: 14px;
  font-weight: bold;
  font-weight: normal;
  line-height: 1.5rem;
  text-align: right;
}

#mypagecolumn .welcome span {
  padding: 0 5px;
  color: #d96040;
}

#mypagecolumn .welcome .w_point {
  padding: 3px;
  margin: 3px 0;
  color: #fff;
  text-align: center;
  border: 1px solid;
  #d96040background: #d96040;
}

#mypagecolumn .welcome .point_rank {
  display: inline-block;
}

/* スマ－トフォン縦用 */
@media only screen and (min-width: 0) and (max-width: 479px) {
  #mypagecolumn .head {
    border-bottom: none;
  }

  #mypagecolumn .head .t_mypage .ti {
    display: none;
  }

  #mypagecolumn .welcome {
    float: none;
    margin-bottom: 30px;
    text-align: left;
  }

  #mypagecolumn .welcome .point_rank {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-top: 10px;
    -ms-flex-pack: justify;
  }

  #mypagecolumn .welcome .point_rank > div {
    width: 48%;
  }
}

#mypagecolumn .welcome .re_point {
  display: inline-block;
  padding: 4px 10px;
  font-size: 13px;
  color: #fff;
  text-align: center;
  letter-spacing: 0.001rem;
  background: #d96040;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}




/* 購入履歴・定期申込一覧 */
.mptxt_area { padding: 10px 0; line-height: 1.5em; }
.new_area { margin: 10px 0; overflow: hidden; }

.new_area ul {
  display: table;
  width: 97%;
  padding: 10px;
  margin: 10px auto;
  overflow: hidden;
  background: #ffe5e5;
  border: #ff5c5c 2px solid;
}

.new_area ul li { display: table-cell; }

#mycontentsarea table.blue_tbl th {
  font-size: 100%;
  font-weight: normal;
  color: #fff;
  text-align: left;
  background: #4a89be;
}

#mypagecolumn .history_list {
  padding: 0;
  margin: 0 auto;
  overflow: hidden;
  clear: both;
}

#mypagecolumn .history_list table {
  width: 100%;
  padding: 0;
  margin: 0 auto;
  text-align: left;
  border-collapse: collapse;
}

#mypagecolumn .reglar_list table {
  width: 100%;
  padding: 0;
  margin-top: 10px;
  text-align: left;
  border-collapse: collapse;
}

#mypagecolumn .history_list table th,
#mypagecolumn .reglar_list table th {
  padding: 5px 8px;
  font-weight: normal;
  color: #fff;
  background: #666;
  border-bottom: none;
  -moz-box-shadow: 1px 2px 5px #d6d6d6;

  /* box-shadow: 1px 2px 5px #D6D6D6; */
  webkit-box-shadow: 1px 2px 5px #d6d6d6;
}

#mypagecolumn .history_list table td {
  padding: 8px;

  /* border-right: 1px solid #ccc; */
  border-bottom: 1px solid #ccc;
}

#mypagecolumn .reglar_list table td {
  padding: 0 8px;
  line-height: 1.5rem;
  border-bottom: none;
}

#mycontentsarea .reglar_list hr {
  margin-top: 10px;
  border: none;
  border-bottom: 1px solid #aaa;

  /* padding: 0; */
}

#mycontentsarea .mouosikomi_tb { margin: 0 auto 20px auto; }

#mycontentsarea .mouosikomi_tb table th {
  width: 100%;
  font-size: 100%;
  font-weight: normal;
  color: #fff;
  text-align: left;
  background: #4a89be;
  border-bottom: 1px solid #ccc;
}

#mycontentsarea .mouosikomi_tb table td {
  padding: 10px;

  /* width: 50%; */
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

#mycontentsarea .mouosikomi_tb table td.righttd {
  text-align: right;
  border-right: 1px solid #ccc;
}

#mycontentsarea .mouosikomi_tb table td:last-child {
  border-right: none;
}

.mouosikomi_tb dl { padding: 0; margin: 0 auto; }
.mouosikomi_tb dl dt { display: block; padding: 10px 0; clear: both; border-bottom: 1px solid #ccc; }

#mycontentsarea .mouosikomi_tb2 { margin: 20px auto; }

#mycontentsarea .mouosikomi_tb2 table th {
  padding: 5px;
  font-size: 100%;
  font-weight: normal;
  color: #333;
  background: #e7edee;

  /* border-bottom: 3px solid #aaa; */
}

#mycontentsarea .mouosikomi_tb2 table td {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

#mycontentsarea .mouosikomi_tb2 table td:last-child {
  border-right: none;
}

#mycontentsarea hr {
  padding: 0;
  margin: 0;
  border: none;
  border-bottom: 1px solid #aaa;
}



/* -----------------------------------------------
定期申込一覧 */

#mycontentsarea .regular_list dl { width: 100%; padding: 10px 0; margin: 0 auto; }

#mycontentsarea .regular_list dl dt ul {
  padding: 0 8px;
  margin: 0 auto;
  font-weight: normal;
  text-align: center;
  background: #f0f0f0;
  border-bottom: 5px solid #d4d4d4;
}

#mycontentsarea .regular_list dl dd { border-bottom: 1px solid #ccc; }
#mycontentsarea .regular_list dl dd ul { padding: 0; margin: 0 auto; }

#mycontentsarea .regular_list dl dt ul li { display: inline-block; width: 19.3%; padding: 10px 0; }

#mycontentsarea .regular_list dl dd ul li { display: inline-block; width: 19.3%; padding: 10px 0; }


/* 定期コース申込詳細 */
.app_list { width: 100%; }
.app_list table{}
.app_list td{}

.app_list th {
  padding: 5px 8px;
  font-weight: normal;
  background: #f0f0f0;
  border-bottom: 3px solid #4a89be;
}

.totalbg {
  background-color: #fef0f0;
  border: 5px solid #ffd4d4;
}

.righttd {
  text-align: right;
  border-right: 1px solid #ccc;
}

.appli_dt {
  padding: 3% 3% 0 3%;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #aaa;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: 1px 2px 5px #d6d6d6;
  box-shadow: 1px 2px 5px #d6d6d6;
  mamrgin: 5%;
  webkit-box-shadow: 1px 2px 5px #d6d6d6;
}

.appli_dt h3 { padding: 0 0 0 30px; }

.appli_dt .appli_head {
  margin: 0 0 20px 0;
  text-decoration: none;
  background: url("../img/mypage/reg_dticon.png") 0% 50% no-repeat;
}
.mouosikomi_tb .flr { float: right; }


/* 定期購入　サイクル変更 希望日変更 お届け先変更 */
#cycle_change_dialog table,
#nextdate_change_dialog table,
#deliv_list_table { width: 100%; border-collapse: collapse; }

/* サイクル変更 */
#cycle_change_dialog table th {
  position: relative;
  width: 100%;
  padding: 5px 5px;
  font-size: 120%;
  font-weight: normal;
  color: #313131;
  text-align: left;
}

#cycle_change_dialog table td {
  width: 100%;
  padding: 10px 0;
}

#cycle_change_dialog #set_date1,
#cycle_change_dialog #set_date2 {
  padding: 10px 20px;
  background: rgb(235, 246, 255);
}

#cycle_change_dialog table input[type="radio"] {
  position: background;
  padding: 0;
  margin: 0 auto;
  font-size: large;
  text-align: center;
}
#cycle_change_dialog p { padding: 0 0 10px 0; }

#cycle_change_dialog #set_date1 label,
#cycle_change_dialog #set_date2 label,
#cycle_change_dialog #set_date3 label { margin-left: 10px; font-size: 110%; }

#cycle_change_dialog select {
  float: none;
  margin-right: 5px;
  font-size: 1rem;
  background: #fff;
}


/* 希望日変更 */
#nextdate_change_dialog table th {
  position: relative;
  width: 100%;
  padding: 10px 5px;
  font-size: 120%;
  font-weight: normal;
  text-align: left;
}

#nextdate_change_dialog table td {
  width: 100%;
  font-size: 100%;
}

#nextdate_change_dialog select {
  float: none;
  margin-right: 5px;
  font-size: 1rem;
}


/* お届け先変更 */
#deliv_list_table th {
  position: relative;
  padding: 10px 5px;
  font-size: 120%;
  font-weight: normal;
  color: #313131;
  text-align: left;
}

#deliv_list_table td {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

#deliv_list_table td .other_deliv_bg {
  padding: 10px 20px;
  background: rgb(235, 246, 255);
}

#deliv_list_table input[type="radio"] {
  position: relative;
  left: 30px;
  padding: 0;
  margin: 0 auto;
  font-size: large;
  text-align: center;
}



/* -----------------------------------------------
購入履歴/詳細 */

#mycontentsarea h4 {
  margin: 20px 0 0 0;
  font-size: 14px;
  font-weight: normal;
}

#mycontentsarea table th {
}

#mycontentsarea p.myconditionarea {
  padding: 10px;
  margin: 0 auto 20px auto;
  clear: both;

  /* border: solid 1px #333; */

  /* background-color: #f6f6f6; */
  line-height: 1.5rem;
}

#mycontentsarea p.delivempty {
  padding: 20px;
  margin: 15px auto;
  clear: both;
  text-align: center;
  border: solid 1px #ccc;
}

.myconditionarea {
  padding: 0;
  background: #f6f6f6;
  -moz-box-shadow: 1px 2px 5px #ccc;
  box-shadow: 1px 2px 5px #ccc;
  webkit-box-shadow: 1px 2px 5px #ccc;
}

.myconditionarea p { line-height: 1.5rem; }

#mypagecolumn .myconditionarea table {
  width: 100%;
  padding: 0;
  margin: 0 auto;
  background: #fff;
}

#mypagecolumn .myconditionarea th {
  width: 30%;
  padding: 10px;
  font-weight: normal;
  color: #666;
  background: #f6f6f6;
  border-bottom: 1px dotted #ddd;
}

#mypagecolumn .myconditionarea td {
  height: 30px;
  padding: 0 10px;
  border-bottom: 1px dotted #ddd;
}
.myconditionarea dt:last-child { border: 0; }

.reg_change { padding: 0; margin: 0 auto; }
.reg_change ul { width: 100%; margin: 0 auto; text-align: center; }
.reg_change ul li { display: inline-block; width: 32.8%; }

.reg_change ul li input[type="button"] {
  position: relative;
  display: block;
  width: 100%;
  padding: 10px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: #fff;
  text-decoration: none;
  white-space: normal;
  white-space: normal;
  cursor: pointer;
  background: #4a89be;
  border: 1px solid #ddd;
  -webkit-border-radius: 1px;
  border-radius: 2px;
}


/* -----------------------------------------------
会員登録内容変更/退会 */

#mypagecolumn .mg_change table {
  width: 100%;
  padding: 0;
  margin: 0 auto 10px auto;
  text-align: left;
  border-collapse: collapse;
}

#mycontentsarea .mg_change th {
  width: 20%;
  min-width: 16vw;
  color: #555;
  text-align: left;
  background: #fff;
  border-bottom: 1px solid #ccc;
}

#mycontentsarea .box120 {
  width: 120px;
  padding: 5px;
  margin: 5px 0;
  border: 1px solid #ccc;
}

#mycontentsarea .box60 {
  width: 60px;
  padding: 5px;
  border: 1px solid #ccc;
}

#mycontentsarea .box300 {
  width: 300px;
  padding: 5px;
  margin: 5px 0 0 0;
  border: 1px solid #ccc;
}

#mycontentsarea .box260 {
  width: 260px;
  padding: 5px;
  margin: 5px 0 0 0;
  border: 1px solid #ccc;
}

#mycontentsarea .zipimg img {
  margin: 5px 0 0 0;
}

#mycontentsarea #completetext {
  width: 90%;
  padding: 4%;
  margin: 3% auto 0 auto;
  border: 2px solid #ccc;
}

div#completetext p.changetext {
  padding: 40px 0;
  text-align: center;
}


/* -----------------------------------------------
お届け先リスト一覧 */

.deliv_list {
  padding-bottom: 5px;
  margin: 0 0 10px 0;
  overflow: hidden;
}

.deliv_list h3 {
  padding: 0 0 0 30px;
}

.deliv_head {
  margin: 0 0 10px 0;
  text-decoration: none;
  background: url("../img/mypage/mg_delivicon.png") 0% 50% no-repeat;
}

#mypagecolumn .deliv_tb { margin-top: 20px; }
#mypagecolumn .deliv_tb table { margin-top: 10px; }

#mypagecolumn .deliv_tb th {
  padding: 5px 10px;
  font-weight: normal;
  color: #fff;
  background: #666;
}


/* -----------------------------------------------
カード情報 */

#mypagecolumn .card_tb {
  padding: 0;
  margin: 10px auto 30px auto;
  overflow: hidden;
}

#mypagecolumn .card_tb table {
  /* margin: 0 auto 20px auto; */
}

#mypagecolumn .card_tb table th {
  padding: 0;
  font-weight: normal;
  color: #666;
  background: #eee;
}

#mypagecolumn .card_tb table td {
  padding: 10px;
  color: #666;
  background: #fff;
}

.card_ttl {
  padding: 0;
  margin: 0;
  overflow: hidden;
  color: #555;
}

.card_ttl h3 {
  display: inline-block;
  padding: 10px;
  font-size: 100%;
  font-weight: normal;
  color: #4a89be;
}


/* カード情報の追加・変更 */
.info_change {
  margin: 0;
  font-size: 100%;
}

#mypagecolumn .info_change table {
  width: 100%;
  margin: 15px auto;

  /*    font-size: 0.85rem;	Commented by Rin 20200922	*/
  line-height: 1.5rem;
  text-align: left;
  border-collapse: collapse;
}

#mypagecolumn .info_change table th {
  padding: 15px 8px;
  font-weight: normal;
  color: #666;
  background: #fff;
  border-bottom: 1px solid #ccc;
}

#mypagecolumn .info_change table td {
  padding: 10px 8px;
  border-bottom: 1px solid #ccc;
}

#mypagecolumn .info_change table[summary="カード情報照会"] th {
  width: 13%;
}

#mypagecolumn .info_change table[summary="カード情報照会"] th div {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -ms-flex-align: center;
}


/* -----------------------------------------------
ポイント */

.use_point_area {
  padding: 0;
  margin: 5px 0;
  overflow: hidden;
  line-height: 150%;
  background: #fefefe;
}

#mypagecolumn .use_point_tb table { margin: 0; border-collapse: collapse; }

#mypagecolumn .use_point_tb th {
  padding: 5px 10px;
  font-weight: normal;
  color: #fff;
  background: #666;
}

/* スマ－トフォン縦用 */
@media only screen and (min-width: 0) and (max-width: 479px) {
  #mypagecolumn .use_point_tb th {
    padding: 4px 2px;
    font-size: 2.2vw;
  }

  #mypagecolumn .use_point_tb td {
    font-size: 2.2vw;
  }

  #mypagecolumn .pt_detail a,
  #mypagecolumn .pr_s {
    font-size: inherit;
  }
}

#mypagecolumn .use_point_tb {
  border-right: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

#mypagecolumn .use_point_tb td {
  padding: 10px 8px;
  line-height: 1.5rem;
  border-right: 1px solid #ccc;
  border-bottom: 0;
  border-bottom: 1px solid #ccc;
}

#mypagecolumn span.pr_s {
  display: block;
  margin-top: 8px;
}






/* 商品名 */
.pt_detail { width: 100%; padding: 0; margin: 0 auto; }
.pt_detail p { padding: 0; margin: 0 auto; }
.pt_detail a { font-size: 14px; color: #333; text-decoration: none; }

.pt_detail a:hover,
.pt_detail a img:hover {
  font-size: 14px;
  text-decoration: underline;
  zoom: 1;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;

  /* FF lt 1.5, Netscape */

  /* Safari 1.x */
}
.pt_detail a img { width: auto; height: 14px; padding: 0; margin: 0; }


/* ポイント利用・獲得 */

/* 利用 */
.pt_use { font-weight: 600; color: #2c7fef; }
.pt_usebg { font-weight: bold; color: #333; background: #def; }

/* 付与 */
.pt_get { font-weight: 600; color: #e30000; }
.pt_getbg { font-weight: bold; color: #333; background: #fde0e7; }

/* 調整 */
.pt_adjust { font-weight: 600; color: #43a84c; }
.pt_adjustbg { font-weight: bold; color: #333; background: #f2fbf2; }

/* 失効 */
.pt_lose { font-weight: 600; color: #666; }
.pt_losebg { font-weight: bold; color: #333; background: #ededed; }

#mypagecolumn .use_point_tb td:last-child {
  border-right: none;
}

/* 総合計 */

/*	#mypagecolumn .pr_s{ font-size:12px; }	*/

.pointo_popup {
  position: absolute;
}

/* 備考吹き出し */
#mypagecolumn .receipt_dt {
  position: relative;
  top: 100%;
  left: -13px;
  z-index: 10;
  padding: 10px;
  margin-top: 8px;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  color: #19283c;
  color: #333;
  text-align: left;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(4, 0, 0, 0.15);
}

#mypagecolumn .receipt_dt a { font-size: 12px; color: #09f; }

#mypagecolumn .receipt_dt::before {
  position: absolute;
  top: -11px;
  display: block;
  width: 0;
  height: 0;
  content: '';
  border-top: none;
  border-right: 6px solid transparent;
  border-bottom: 11px solid #cdcdcd;
  border-left: 6px solid transparent;
}

#mypagecolumn .receipt_dt::after {
  position: absolute;
  top: -9px;
  display: block;
  width: 0;
  height: 0;
  content: '';
  border-style: solid;
  border-width: 0 6px 6px 6px;
  border-top: none;
  border-right: 6px solid transparent;
  border-bottom: 11px solid #fff;
  border-left: 6px solid transparent;
}

/* タブ縦以上用 */
@media only screen and (min-width: 768px) {
  #mypagecolumn .receipt_dt::before,
  #mypagecolumn .receipt_dt::after {
    left: 20px;
  }
}

/* スマ－トフォン縦用 */
@media only screen and (min-width: 0) and (max-width: 479px) {
  .pointo_popup {
    right: 3%;
  }

  #mypagecolumn .receipt_dt::before,
  #mypagecolumn .receipt_dt::after {
    right: 20px;
  }
}




/* 閉じるボタン */
#mypagecolumn .receipt_dt .bbtn {
  width: 100px;
  padding: 3px;
  margin: 0 auto;
  text-align: center;
  cursor: pointer;
}

#mypagecolumn .receipt_dt .bbtn a {
  position: relative;
  display: block;
  padding: 3px;
  margin: 0 auto;
  font-size: 100%;
  font-weight: normal;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  background-color: #4a89be;
  border: 1px solid #ddd;
  -webkit-border-radius: 1px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.use_point_area li {
  padding: 10px 0;
  border-bottom: 1px #999 dotted;
}

.point_list {
  width: 60%;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

/* スマ－トフォン縦用 */
@media only screen and (min-width: 0) and (max-width: 479px) {
  .point_list {
    width: 100%;
  }
}

.point_list dl {
  display: table;
  width: 99%;
  margin: 0 auto 20px;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

.point_list dl dt,
.point_list dl dd {
  display: table-cell;
  width: 50%;
  padding: 20px 0;
  text-align: center;
  vertical-align: middle;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.point_list dl dt {
  background: #f0f0f0;
}

.point_list dl dd {
  font-size: 150%;
  color: #c30;
}


/* -----------------------------------------------
 マイクーポン */


/* 可能クーポン・詳細 */
.cpon { padding: 0 0 20px 0; margin: 0 auto; clear: both; border-bottom: 1px dotted #ccc; }
.cpon:last-child { border: 0; }

.area_coupon {
  padding: 0 0 10px 0;
  overflow: hidden;
}

#mypagecolumn .area_coupon table { padding: 0; margin: 0 auto; }

#mypagecolumn .area_coupon table th {
  padding: 5px 8px;
  font-weight: normal;
  color: #fff;
  background: #666;
  border-bottom: none;
}

.qp_wrap {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -ms-flex-align: center;
}

.qp_wrap > div {
  width: 48%;
}

.qp_wrap > div .c_price {
  line-height: 1.3;
}

/* スマ－トフォン縦用 */
@media only screen and (min-width: 0) and (max-width: 479px) {
  .qp_wrap {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .qp_wrap > div {
    width: 99%;
  }

  .qp_wrap > div:nth-child(1) {
    margin-bottom: 20px;
  }
}

.qp_box {
  border: 1px solid #666;

  /*
	margin: 10px 0 0 0;
	width: 47%;
	display: inline-block;
	*/
}

.qp_ttl {
  padding: 10px;
  font-size: 100%;
  font-weight: normal;
  color: #fff;
  background: #666;
}

.qp_box p {
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  line-height: 1.3rem;
}

.qp_dtl {
  /*
    display: inline-block;
    width: 50%;
    margin-left: 20px;

    position: relative;
    top: 5px;
    float: right;
		*/
}

.qp_dtl h3 { font-size: 100%; }
.qp_dtl ul { padding: 0; margin: 0 auto; }
.qp_dtl ul li { padding: 5px; border-bottom: 1px solid #ccc; text-aling: left; }
.expiration_date_diff { font-size: 18px; font-weight: normal; color: #c30; }



/* -----------------------------------------------
友達キャンペーン */

.friend_area { padding-bottom: 20px; margin: 0 auto; }
.fr_intro { padding: 10px 0; line-height: 200%; }
.fr_input { width: 400px; padding: 3px 5px; }
.friend_area ul { padding: 0; margin: 0 auto; }

.friend_area ul li {
  display: inline-block;
  width: 32.8%;
  margin-top: 10px;
}

.friend_area ul li a {
  position: relative;
  display: block;
  padding: 10px 0;
  margin: 10px 0;
  color: #555;
  text-align: center;
  text-decoration: none;
  -pie-background: linear-gradient(top, #fff, #f1f1f1);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1));
  background: -webkit-linear-gradient(top, #fff, #f1f1f1);
  background: -moz-linear-gradient(top, #fff, #f1f1f1);
  background: -ms-linear-gradient(top, #fff, #f1f1f1);
  background: -o-linear-gradient(top, #fff, #f1f1f1);
  background: linear-gradient(top, #fff, #f1f1f1);
  background-color: #f1f1f1;
  border: 1px solid #eee;
  border: 1px solid #ccc;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.friend_area ul li a:hover {
  color: #fff;
  background: #d96040;
}

.fr_attend { padding: 10px; line-height: 200%; border: 1px dashed #ccc; }



/* -----------------------------------------------
お気に入り */

#fv_list { width: 100%; padding: 0; margin: 0 auto; clear: both; }

#fv_list dl {
  display: inline-block;
  width: 19.3%;
  margin: 10px 0;
}

#fv_list dl dt {
  padding: 1%;
  text-align: center;
}

#fv_list dl dt img {
  width: auto;

  /* width: 100%; */
  max-height: 30vh;
  margin: 0 auto;
}

@-moz-document url-prefix() {
  .fv_list dl dt img { width: 100%; margin: 0 auto; }
}

#fv_list p {
  padding-top: 5px;
  font-size: 12px;
  line-height: 1.3em;
  text-align: left;
}
#fv_list p a { color: #555; text-decoration: none; }
#fv_list p .ft_bold { font-weight: bold; }

.all_delete { padding: 10px; overflow: hidden; background: #eee; }
.allcheck { position: relative; top: 0; left: 5px; display: inline-block; }

.item_check {
  left: 60px;
}

/* -----------------------------------------------
お支払い方法 */

.order_list { height: 50px; padding: 15px 0; margin: 0; }

.payment_info {
  padding: 3%;
  margin-top: 10px;
  border: 1px solid #ccc;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
.payment_info h3 { padding: 5px 0; }
.payment_info ul { padding: 0; margin: 0; list-syle: none; }
.payment_info ul li { padding: 5px 0; border-bottom: 1px solid #ccc; }
.payment_info ul li p { padding: 0 10px 0 30px; }

.credit_info { margin-top: 20px; margin-bottom: 1px; }

.credit_info h3 {
  padding: 5px 10px;
  margin-top: 10px;
  color: #fff;
  background: #666;
}

.credit_info dl {
  border-bottom: 1px solid #ccc;
}

.credit_info dt {
  float: left;
  width: 120px;
  background: #f0f0f0;
}

.credit_info dd {
  margin-left: 130px;
}

#mypagecolumn .order_info {
  margin: 0 0 5px 0;
}

#mypagecolumn .order_info table { margin: 0; border-collapse: collapse; }

#mypagecolumn .order_info th {
  padding: 5px 10px;
  font-weight: normal;
  color: #fff;
  background: #666;
}

#mypagecolumn .order_info td {
  padding: 0 8px;
  font-weight: normal;
  line-height: 1.5rem;
  border-bottom: 0;
}

#mypagecolumn .order_info hr {
  padding: 0;
  margin: 0;
  border: none;
  border-bottom: 1px solid #d2d2d2;
}


/* お支払方法>カード情報入力 */

#mypagecolumn .credit_info table {
  margin-top: 0;
  border-collapse: collapse;
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

#mypagecolumn .credit_info th {
  padding: 5px 10px;
  font-weight: normal;
  color: #555;
  background: #fff;
  border-bottom: 1px solid #ccc;
}

#mypagecolumn .credit_info td {
  padding: 10px 8px;
  font-weight: normal;
  line-height: 1.5rem;
  border-bottom: 0;
  border-bottom: 1px solid #ccc;
}

#mypagecolumn .credit_info hr {
  padding: 0;
  margin: 0;
  border: none;
  border-bottom: 1px solid #d2d2d2;
}


/* クレジット支払い確認・変更 */
.cd_ttl {
  padding: 10px 0 15px 0;
  font-size: 15px;
}

#card_change_card_list table {
  width: 100%;
  margin: 0 auto 20px auto;
  border-collapse: collapse;
  border-bottom: 1px solid #ccc;
}

#card_change_card_list table th {
  position: relative;
  width: 100%;
  padding: 0;
  font-size: 120%;
  font-weight: normal;
  color: #313131;
  text-align: left;
}

#card_change_card_list table td {
  width: 25％;
  padding: 8px 0;
  text-align: center;
}

#card_change_card_list table input[type="radio"] {
  position: background;
  padding: 0;
  margin: 0 auto;
  font-size: large;
  text-align: center;
}

#card_change_card_list .cd_use {
  float: right;
  width: 60px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  background: #2db312;
  border-radius: 3px;
}
#card_change_card_list .bg1 { background: #f6f6f6; }

#card_change_card_list .cd_ttl {
  padding: 0 0 10px 0;
  margin: 10px auto;
  font-size: 16px;
}

#card_change_card_list #set_date1,
#card_change_card_list #set_date2,
#card_change_card_list #set_date3 {
  height: 32px;
}

#card_change_card_list #set_date3 {
  height: auto;
}

#card_change_card_list .set_off {
  padding: 0 10px;
  background: #e3f0fc;
}

#card_change_card_list .set_on {
  padding: 0 5px 0 10px;
  background: #ffe8e8;
}

#card_change_card_list #set_date1 p,
#card_change_card_list #set_date2 p,
#card_change_card_list #set_date3 p { font-size: 14px; }

#card_change_card_list #set_date1 label,
#card_change_card_list #set_date2 label,
#card_change_card_list #set_date3 label {
  margin-left: 10px;
  font-size: 15px;
  letter-spacing: 0.001rem;
}

#mypagecolumn .drop_bt {
  position: relative;
  right: 10px;
  display: inline-block;
  float: right;
  width: 100px;
  height: 30px;
  font-size: 13px;
  line-height: 20px;
  color: #313131;
}

.change_message {
  line-height: 1.5rem;
  color: #fff;
  text-align: center;
  background: #d23f3f;
  border-radius: 60px;
}

.mypage_loading {
  width: 100%;
  height: 100px;
  background: url(../img/mypage/loader_01.gif) no-repeat center center;
}

#tab-menu {
  display: none;
}

#tab-btn ul {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -ms-flex-align: stretch;
}

#tab-btn li {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  width: 32%;
  text-align: center;
  background-color: #777;
  -ms-flex-pack: center;
  -ms-flex-align: center;
}

#tab-btn li a {
  display: block;
  width: 100%;
  padding: 5px 0;
  font-size: 3.2vw;
  color: #fff;
  text-decoration: none;
}

#tab-btn li a span {
  display: block;
  font-size: 80%;
}

#tab-btn li.active {
  background-color: #333;
}

#tab-cont {
  box-sizing: border-box;
  width: 100%;
  background: #fff;
  border-radius: 0 0 4px 4px;
}

#tab-cont ul li {
  background: url("../img/mypage/icon_mgnav.png") no-repeat 98% 50%;
  border-bottom: 1px solid #ddd;
}

#tab-cont ul li a {
  display: block;
  padding: 5px 0 5px 5px;
  color: #555;
  text-decoration: none;
}

#navmenu {
  margin-bottom: 30px;
}

.area_tab {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  cursor: pointer;
  -ms-flex-pack: justify;
  -ms-flex-align: stretch;
}

.area_tab p {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  width: 32%;
  color: #fff;
  text-align: center;
  background-color: #777;
  -ms-flex-pack: center;
  -ms-flex-align: center;
}

.area_tab p.active {
  background-color: #333;
}

ul.mynav li {
  background: url("../img/mypage/icon_mgnav.png") no-repeat 98% 50%;
  border-bottom: 1px solid #ddd;
}

ul.mynav li a {
  display: block;
  padding: 5px 0 5px 5px;
  color: #555;
  text-decoration: none;
}

.dlt_wrap {

}

.dlt_wrap dl {
  display: table;
  width: 100%;
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
}

.dlt_wrap dt,
.dlt_wrap dd {
  display: table-cell;
  padding: 10px;
  vertical-align: middle;
}

.dlt_28 dt {
  width: 20%;
}

.dlt_28 dd {
  width: 80%;
}

.dlt_wrap dt.require {
  position: relative;
  vertical-align: middle !important;
}

.dlt_wrap dt.require::after {
  position: absolute;
  top: 50%;
  right: 10px;
  padding: 3px 4px;
  font-size: 10px;
  font-weight: normal;
  line-height: 1;
  color: #fff;
  content: "必須";
  background-color: #e54848;
  border-radius: 4px;
  transform: translateY(-50%);
}

.dlt_cart {
  clear: both;
}

.dlt_cart .dlt_wrap {
  border-top: 1px solid #ccc;
}

.dlt_cart .dlt_wrap dl {
  padding: 0;
}

.dlt_cart .dlt_wrap dl dt {
  background-color: #f0f0f0;
}

#mypagecolumn .dlt_wrap dd input[type="radio"] {
  display: inline-block;
  margin-right: 10px;
}

.btn_bottom {
  margin-top: 30px;
  margin-bottom: 30px;
}

.btn_bottom ul {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -ms-flex-pack: start;
  -ms-flex-align: start;
}

.btn_bottom ul li {

}

.btn_bottom ul li a {
  line-height: 1;
  color: #333;
  text-decoration: none;
}

.btn_bottom ul li:nth-child(1) {
  margin-right: 110px;
}

.btn_bottom ul li:nth-child(2) a {
  display: block;
  padding: 20px 35px;
  color: #fff;
  background-color: #333;
}

.current_card_ti {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  width: 96% !important;
  padding: 0 2% !important;
  -ms-flex-pack: justify;
  -ms-flex-align: center;
}

.current_card {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 0 auto;
  -ms-flex-pack: justify;
  -ms-flex-align: center;
}

.current_card dl {
  text-align: center;
}

.disp_none,
.br_sp {
  display: none;
}



/* 大PC用 */
@media only screen and (min-width: 1441px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn table td p.ctrl {

  }

  #mypagecolumn table td p.ctrl input[type="text"] {
    width: 27%;
  }

  #mypagecolumn table td p.ctrl_short input[type="text"] {
    width: 25.5%;
  }
}

/* MacBook用 */
@media only screen and (min-width: 1367px) and (max-width: 1440px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn table td p.ctrl {

  }

  #mypagecolumn table td p.ctrl input[type="text"] {
    width: 26%;
  }

  #mypagecolumn table td p.ctrl_short input[type="text"] {
    width: 23.8%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 20%;
  }
}

/* PC Laptop用 */
@media only screen and (min-width: 1281px) and (max-width: 1366px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn table td p.ctrl {

  }

  #mypagecolumn table td p.ctrl input[type="text"] {
    width: 26%;
  }

  #mypagecolumn table td p.ctrl_short input[type="text"] {
    width: 23.8%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 20%;
  }
}

/* PC Laptop用 */
@media only screen and (min-width: 1025px) and (max-width: 1280px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn table td p.ctrl {

  }

  #mypagecolumn table td p.ctrl input[type="text"] {
    width: 26%;
  }

  #mypagecolumn table td p.ctrl_short input[type="text"] {
    width: 23.8%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 20%;
  }
}



/* PC タブレット横用 */
@media only screen and (min-width: 960px) and (max-width: 1024px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn table td p.ctrl {

  }

  #mypagecolumn table td p.ctrl input[type="text"] {
    width: 26%;
  }

  #mypagecolumn table td p.ctrl_short input[type="text"] {
    width: 23.8%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 25%;
  }
}


/* タブレット用 */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn .font_ctrl {
    font-size: 1.5vw !important;
  }

  .zipimg {
    display: inline-block;
  }

  .btn_bottom ul li:nth-child(1) {
    margin-right: 5%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 35%;
  }
}

/* スマ－トフォン横用 */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  #navmenu {
    display: none;
  }

  #mypagecolumn .font_ctrl {
    font-size: 1.5vw;
  }

  #mypagecolumn #mynavarea .mynav li {
    font-size: 1.7vw;
  }

  .mg_change {
    font-size: 1.7vw;
  }

  .zipimg {
    display: inline-block;
  }

  .btn_bottom ul li:nth-child(1) {
    margin-right: 6.5%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] {
    font-size: 1.8vw;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 34%;
  }

  #mycontentsarea .info_change .box300 {
    width: auto;
  }

  #mycontentsarea .info_change .box120 {
    width: 100px;
  }
}

/* スマ－トフォン縦用 */
@media only screen and (min-width: 0) and (max-width: 479px) {
  #mypagecolumn {
    padding: 2em 0 0;
  }

  #mypagecolumn #mynavarea {
    display: none;
  }

  #tab-btn {
    margin-bottom: 20px;
  }

  #tab-menu {
    display: block;
    margin-bottom: 30px;
  }

  #mycontentsarea {
    float: none;
    width: 100%;
    margin: 0;
  }

  #mypagecolumn .history_list,
  #mypagecolumn .reglar_list,
  #mypagecolumn .order_info {
    font-size: 2.2vw;
  }

  #mypagecolumn table td {
    padding: 2%;
  }

  #mypagecolumn table[summary="お届け先"] tr td:nth-child(1) {
    width: 5%;
  }

  #mypagecolumn table[summary="お届け先"] tr td:nth-child(2),
  #mypagecolumn table[summary="お届け先"] tr td:nth-child(3) {
    font-size: 3vw;
  }

  #mypagecolumn .del_bt {
    width: 44px;
    margin: 0 auto 25px auto;
    font-size: 3vw;
    line-height: 0;
  }

  #mypagecolumn form .custom-selectbox select {
    padding: 0 10px 0 4px !important;
    font-size: 3vw;
  }

  .area_tab {
    font-size: 3vw;
  }

  .area_tab p a {
    padding: 5px 0;
  }

  .ui-dialog {
    width: auto !important;
  }

  .resp_dl {
    width: 100%;
  }

  .resp_dl dt,
  .resp_dl dd {
    display: block !important;
    width: 100%;
  }

  .resp_dl dt {
    padding: 1% 1% 10px 1%;
  }

  .resp_dl dd {
    padding: 0 1% 1% 1%;
  }

  .resp_dl dt.disp_tc,
  .resp_dl dd.disp_tc {
    display: table-cell !important;
    width: auto;
  }

  .resp_dl dd.disp_tc {
    text-align: right;
  }

  .dlt_wrap dt.require::after {
    position: relative;
    right: 0;
    display: inline-block;
    margin-left: 10px;
  }

  .zipimg {
    display: inline-block;
  }

  #mycontentsarea .box300 {
    width: 96%;
  }

  /*
	.btn_area_n2 {
		width:auto;
		margin:0 auto;
		padding: 0;
		text-align: center;
	}
	.btn {
    width: 100%;
    margin: 0;
    padding: 0;
    float:none;
    font-size: 0.85em;
	}
	*/

  .btn_bottom ul {
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -ms-flex-pack: justify;
    -ms-flex-align: center;
  }

  .btn_bottom ul li {
    width: 45%;
  }

  .btn_bottom ul li a {
    display: block;
  }

  .btn_bottom ul li:nth-child(1) {
    margin-right: 0;
  }

  .btn_bottom ul li:nth-child(2) a {
    display: block;
    padding: 20px 35px;
    color: #fff;
    background-color: #333;
  }

  .appli_dt .appli_head {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -ms-flex-pack: justify;
    -ms-flex-align: center;
  }

  .appli_dt .appli_head strong {
  }

  #mypagecolumn .course_dt {
    position: relative;
    top: 0;
    float: none;
    padding: 0;
    margin: 0;
  }


  /* -----------------------------------------------
	カード情報 */

  .card_ttl {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 4px 10px;
    -ms-flex-pack: justify;
    -ms-flex-align: center;
  }

  .card_ttl h3 {
    padding: 10px 10px 10px 0;
    font-size: 90%;
  }

  #mypagecolumn .pst5 {
    position: relative;
    top: 0;
    font-size: 90%;
  }

  #mypagecolumn .pst4 {
    top: 0;
  }

  .box_30per {
    width: 30%;
  }



  /* -----------------
			カート
	----------------- */
  .tblareabtn p {
    font-size: 4vw;
  }

  /* -------------------------------
	 カート	セレクト装飾用
	------------------------------- */
  form .custom-selectbox {
    width: 50%;
  }

  .dlt_cart .dlt_wrap dl dt {
    background-color: #fff;
  }

  .txt_cent_sp {
    text-align: center;
  }

  .btn_next a.txt_smaller {
    font-size: 3vw;
  }

  .dlt_wrap .mini {
    margin-top: 10px;
  }

  .disp_block_sp {
    display: block;
  }

  #mypagecolumn .drop_bt {
    float: none;
    font-size: 100%;
  }

  .dlt_wrap .zipimg a {
    display: block;
  }

  .current_card_ti {
    width: 96% !important;
    padding: 0 2% !important;
  }

  .current_card {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 3.5vw;
  }

  .current_card dl {
    display: table;
    width: 100%;
    text-align: left;
  }

  .current_card dl dt,
  .current_card dl dd {
    display: table-cell;
    vertical-align: middle;
  }

  .current_card dl dt {
    width: 30%;
  }

  .current_card dl dd {
    width: 70%;
  }

  #card_change_card_list #set_date3 label {
    font-size: 3vw;
  }

  #card_change_card_list .cd_use {
    float: none;
    width: auto;
    padding: 0 7px;
    font-size: 3vw;
  }

  .ui-button-text {
    font-size: 3.5vw;
  }

  .w_ctrl {
    width: 25% !important;
  }

  .w_15_sp {
    width: 15%;
  }

  .w_95_sp {
    width: 95%;
    padding: 0;
  }

  .w_100_sp {
    width: 100% !important;
  }

  .mg_newbtn {
    width: 100%;
  }

  #mypagecolumn .custom-selectbox.w15.wider,
  #windowcolumn .custom-selectbox.w15.wider {
    width: 24%;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] {
    font-size: 3vw;
  }

  #mypagecolumn .info_change table[summary="カード情報照会"] th {
    width: 40%;
  }

  #mycontentsarea .info_change .box300 {
    width: auto;
  }

  #mycontentsarea .info_change .box120 {
    width: 100px;
  }

  .br_sp {
    display: block;
  }


  /*	AmazonPay SP modify	*/
  #addressBookWidgetDiv {
    width: 100% !important;
    padding-top: 30px;
  }

  /*	MyPage Point SP modify	*/
  #mypagecolumn .welcome .re_point {
    padding: 4px 0;
  }
}

.payment-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.payment__ttl {
  width: 100%;
  margin-bottom: 10px;
}

.payment-btns {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.payment-btns__item {
  width: calc(50% - 10px);
}

.mouosikomi_tb .payment-btns__item input[type="button"] {
  width: 100%;
}

@media only screen and (min-width: 1201px) {
  .payment-wrap {
    flex-wrap: nowrap;
    align-items: center;
  }

  .payment__ttl {
    width: 45%;
    margin-bottom: 0;
  }

  .payment-btns {
    width: 55%;
  }
}
