#wrap_bg .member_main_box .slider_box .slick-prev {
  left:-20px;
  top: 30%;
}
#wrap_bg .member_main_box .slider_box .slick-next {
  right:-20px;
  top: 30%;
}
#wrap_bg .member_main_box  .slick-arrow {
  width:30px;
  height:30px;
}
@media screen and (max-width: 640px) {
#member_main_coupon .slider_box {
    padding: 0;
    display: -webkit-flex;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    width: 100%;
    position: relative;
}
#member_main_coupon .slider_box li {
    flex: 0 0 55%;
}
#member_main_coupon .slider_box img {
    max-width: 200px !important;
    width: 100%;
    height: auto;
}
}
/*====================================================*
 * 共通項目
 *====================================================*/
#wrap_bg {
  width: 100%;
  text-align: center;
  vertical-align: inherit;
  overflow: hidden;
  padding: 0;
  box-sizing: border-box;
  color: #333;
  background: #fff;
}
#wrap_bg a:hover {
  opacity: .5;
}
#wrap_bg p {
  line-height: 1.5;
}
#wrap_bg #wrap {
  width: 100%;
  margin: 0 auto;
  height: auto;
  font-size: 1.6rem;
  max-width: 1280px;
  background: #fff;
  padding: 0;
  box-sizing: border-box;
}
#wrap_bg section {
  box-sizing: border-box;
  width: 100%;
  text-align: left;
  margin: 0 auto;
  padding: 10px;
}
#wrap_bg .member_main_box {
  background: #efefef;
  padding: 20px;
  margin: 10px auto 0;
}
#wrap_bg .member_main_whitebox {
  box-sizing: border-box;
  background: #fff;
  padding: 10px;
  height: 100%;
}
#wrap_bg h1.member_h1 {
  font-size: 3rem;
  text-align: center;
  margin: 20px auto 0;
}
#wrap_bg h2.member_h2 {
  font-size: 2.4rem;
  letter-spacing: .05rem;
  padding: 0;
}
#wrap_bg .lpad5 {
  padding-left: 5px;
}
#wrap_bg .rpad5 {
  padding-right: 5px;
}
#wrap_bg .ptr_no {
  pointer-events: none;
}
#wrap_bg .nobr {
  display: inline-block;
}
/*----- 詳しくはこちら -----*/
#wrap_bg .member_more_link {
  line-height: 1.8;
}
#wrap_bg .member_more_link {
  text-align: right;
}
#wrap_bg .member_more_link a {
  display: inline-block;
  position: relative;
  font-size: 1.35rem;
  padding-left: 20px;
  color: #615757;
}
#wrap_bg .member_more_link a:hover {
  text-decoration: underline;
}
#wrap_bg .member_more_link a:after,
#wrap_bg .member_more_link a:before{
  content: " ";
  position: absolute;
}
#wrap_bg .member_more_link a:before {
  width: 15px;
  height: 15px;
  background-color: #f6ae18;
  border-radius: 50%;
  left: 0;
  top: 50%;
  margin-top: -7px;
}
#wrap_bg .member_more_link a:after {
  border-top: 1.5px solid #fff;
  border-right: 1.5px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 4px;
  height: 4px;
  top: 10px;
  left: 4px;
}
/*========== 1001px - xx ==========*/
@media screen and (min-width: 1001px) {
  #wrap_bg .member_more_link a:hover {
    color: #f6ae18;
  }
}
/*========== 0px - 640px ==========*/
@media screen and (max-width: 640px) {
  #wrap_bg .member_main_whitebox {
    height: auto;
  }
  #wrap_bg h2.member_h2 {
    font-size: 1.8rem;
  }
}
/*--------------------*
 * スクロールバー
 *--------------------*/
#wrap_bg .scroll_flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: scroll;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  width: 100%;
  position: relative;
}
#wrap_bg .scroll_flex {
  overflow: auto;
}
#wrap_bg .scroll_flex > li {
  flex: 0 0 auto;
  width: 100%;
}
#wrap_bg .scroll_flex::-webkit-scrollbar {
  height: 5px;
}
#wrap_bg .scroll_flex::-webkit-scrollbar-track {
  background: #f1f1f1;
}
#wrap_bg .scroll_flex::-webkit-scrollbar-thumb {
  background: #bcbcbc;
}
/*--------------------*
 * スライダー
 *--------------------*/
#wrap_bg .slider_box {
  width: 100%;
}
#wrap_bg .slider_box .slick-list {
  height: fit-content;
}
#wrap_bg .slider_box a {
  display: block;
  color: inherit;
}
#wrap_bg .slider_box li a .imgbox,
#wrap_bg .slider_box li a .textbox {
  display: block;
  width: 100%;
  margin: 0 auto;
  transition: .4s;
}
#wrap_bg .slider_box a img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  background: #fff;
}
#wrap_bg .slider_box .slick-next {
  right: 0;
  top: 50%;
}
#wrap_bg .slider_box .slick-prev {
  left: 0;
  top: 50%;
}
/*--------------------*
 * グリッド
 *--------------------*/
#wrap_bg .wrap_grid {
  box-sizing: border-box;
  display: grid;
  width: 100%;
}
#wrap_bg .wrap_grid.gridtemp_member {
  grid-template-columns: minmax(0,256px) minmax(0,1024px);
  grid-template-areas: 
    "area_top  area_top"
    "area_ren  area_ren"
    "area_menu area_login"
    "area_menu area_main"
    "area_menu area_nav"
    "area_menu area_hist"
    "area_menu area_fav"
    "area_menu area_cp"
    "area_menu area_cpn";
}
/*----- トップ -----*/
#wrap_bg .gridarea_top {
  grid-area: area_top;
}
/*----- ログイン -----*/
#wrap_bg .gridarea_login {
  grid-area: area_login;
}
/*----- 連絡帳 -----*/
#wrap_bg .gridarea_ren {
  grid-area: area_ren;
}
/*----- 会員メニュー -----*/
#wrap_bg .gridarea_menu {
  grid-area: area_menu;
}
/*----- 会員ページナビ -----*/
#wrap_bg .gridarea_nav {
  grid-area: area_nav;
}
/*----- 会員情報メイン -----*/
#wrap_bg .gridarea_main {
  grid-area: area_main;
}
/*----- 購入履歴 -----*/
#wrap_bg .gridarea_hist {
  grid-area: area_hist;
}
/*----- お気に入り -----*/
#wrap_bg .gridarea_fav {
  grid-area: area_fav;
}
/*----- クーポン -----*/
#wrap_bg .gridarea_cp {
  grid-area: area_cp;
}
/*----- キャンペーン -----*/
#wrap_bg .gridarea_cpn {
  grid-area: area_cpn;
}
/*========== 0px - 1000px ==========*/
@media screen and (max-width: 1000px) {
  #wrap_bg .wrap_grid.gridtemp_member {
    grid-template-columns: minmax(0,1fr);
    grid-template-areas: 
      "area_top"
      "area_ren"
      "area_login"
      "area_main"
      "area_nav"
      "area_hist"
      "area_fav"
      "area_cp"
      "area_cpn"
      "area_menu";
  }
}
/*====================================================*
 * トップ
 *====================================================*/
#wrap_bg #member_top_login {
  font-size: 1.4rem;
  padding: 0;
  text-align: center;
}
/*--------------------*
 * 戻るボタン
 *--------------------*/
#wrap_bg #member_top .member_back_link {
  width: 96%;
  margin: 20px auto 0;
}
#wrap_bg #member_top .member_back_link a {
  box-sizing: border-box;
  display: block;
  max-width: 450px;
  padding: 15px 0;
  margin: 0 auto;
  background: #fa0000;
  color: #fff;
  text-align: center;
  border-radius: 20px;
  position: relative;
  width: 100%;
  border: solid 3px #c40000;
}
#wrap_bg #member_top .member_back_link a span {
  position: relative;
  padding-left: 15px;
}
#wrap_bg #member_top .member_back_link a span:after {
  content: "";
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-right: 8px solid white;
  border-bottom: 8px solid transparent;
  left: 0;
  top: calc(50% - 8px);
  position: absolute;
}
/*====================================================*
 * 連絡帳
 *====================================================*/
#wrap_bg .member_midoku {
  box-sizing: border-box;
  width: 98%;
  padding: 10px;
  background: #fcc;
  text-align: center;
  margin: 0 auto;
}
/*====================================================*
 * 会員メニュー
 *====================================================*/
#wrap_bg #member_menu ul.member_menu_list > li {
  box-sizing: border-box;
  width: 100%;
  position: relative;
  padding: 0;
  margin-bottom: 10px;
}
#wrap_bg #member_menu ul.member_menu_list > li a {
  box-sizing: border-box;
  display: block;
  width: 100%;
  color: #333333;
  position: relative;
  padding: 10px 3em 10px 0;
}
#wrap_bg #member_menu ul.member_menu_list > li a:before {
  content: "";
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 1px #333;
  border-right: solid 1px #333;
  position: absolute;
  top: 50%;
  right: 1em;
  margin-top: -4px;
  transform: rotate(45deg);
}
/*----- 会員メニュー コメント -----*/
#wrap_bg #member_menu p.member_menu_note {
  border: solid 1px #333;
  padding: 10px;
  line-height: 1.2;
  font-size: .9em;
  margin: 20px auto;
}
/*----- 会員メニュー 列数 -----*/
#wrap_bg #member_menu .member_menu_flex {
  box-sizing: border-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  flex-flow: row wrap;
  width: 100%;
  margin: 0 auto;
}
#wrap_bg #member_menu .member_menu_flex > ul {
  box-sizing: border-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  margin: 0 auto;
}
/*========== 0px - 1000px ==========*/
@media screen and (max-width: 1000px) {
  /*----- 会員メニュー 下部へ移動時 -----*/
  #wrap_bg #member_menu {
    line-height: 1.8;
    padding: 0 .5em;
  }
}
/*========== 641px - 1000px ==========*/
@media screen and (max-width: 1000px) and (min-width: 641px) {
  /*----- 会員メニュー 下部へ移動時 2列 -----*/
  #wrap_bg #member_menu .member_menu_flex > ul > li {
    width: 48%;
    padding: 0 10px;
    margin: 0 1% 1%;
  }
}
/*========== 0px - 640px ==========*/
@media screen and (max-width: 640px) {
  /*----- 会員メニュー 下部へ移動時 1列 -----*/
  #wrap_bg #member_menu .member_menu_flex > ul > li {
    width: 98%;
    padding: 0 10px;
    margin: 0 1% 1%;
  }
}
/*====================================================*
 * 会員ページナビ
 *====================================================*/
/*----- ページナビ 表示 -----*/
#wrap_bg #member_nav {
  display: block;
}
/*========== 1000px - xx ==========*/
@media screen and (min-width: 1000px) {
  /*----- ページナビ 非表示 -----*/
  #wrap_bg #member_nav {
    display: none;
  }
}
#wrap_bg #member_nav .member_nav_box {
  box-sizing: border-box;
  width: 100%;
  padding: 0;
  margin: 0 auto;
}
#wrap_bg #member_nav ul.member_nav_list {
  box-sizing: border-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
}
#wrap_bg #member_nav ul.member_nav_list li {
  flex: 1 1 calc(100% / 3);
  max-width: 200px;
  padding: 0;
  position: relative;
  margin-bottom: 10px;
}
#wrap_bg #member_nav ul.member_nav_list > li a {
  box-sizing: border-box;
  display: block;
  width: 100%;
  color: #333;
  position: relative;
  padding: 0;
  text-align: center;
}
#wrap_bg #member_nav ul.member_nav_list > li a img {
  width: 80%;
}
/*====================================================*
 * 会員メイン：会員情報
 *====================================================*/
#wrap_bg #member_main_base .wrap_grid {
  grid-gap: 10px;
}
#wrap_bg #member_main_base .wrap_grid.gridtemp_base {
  grid-template-columns: 1fr 1.5fr;
  grid-template-areas: 
    "area_name   area_point"
    "area_rank   area_point"
    "area_rankup area_rankup";
}
#wrap_bg #member_main_base .wrap_grid .gridarea_name {
  grid-area: area_name;
}
#wrap_bg #member_main_base .wrap_grid .gridarea_rank {
  grid-area: area_rank;
}
#wrap_bg #member_main_base .wrap_grid .gridarea_point {
  grid-area: area_point;
}
#wrap_bg #member_main_base .wrap_grid .gridarea_rankup {
  grid-area: area_rankup;
}
#wrap_bg #member_main_base .wrap_grid.gridcol_1fr2fr {
  grid-template-columns: 1fr 2fr;
}
/*========== 0px - 1080px ==========*/
@media screen and (max-width: 1080px) {
  #wrap_bg #member_main_base .wrap_grid.gridtemp_base {
    grid-template-areas: 
      "area_name   area_rank"
      "area_point  area_point"
      "area_rankup area_rankup";
  }
}
/*--------------------*
 * 会員名
 *--------------------*/
#wrap_bg #member_main_name p {
  font-size: 2rem;
  font-weight: 500;
}
/*--------------------*
 * SMS認証
 *--------------------*/
#wrap_bg #member_main_sms p a {
  display: block;
  border-radius: 20px;
  padding: 5px;
  margin: 0 auto 0 0;
  background: #333;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  width: 100%;
  max-width: 8em;
}
#wrap_bg #member_main_sms p.on a {
  background: #2aaa93;
}
#wrap_bg #member_main_sms p.off a {
  background: #ff0e0e;
}
/*--------------------*
 * 会員ランク
 *--------------------*/
#wrap_bg #member_main_rank img {
  max-width: 100%;
  display: block;
  margin: 0 auto;
}
/*--------------------*
 * ランクアップ条件
 *--------------------*/
#wrap_bg #member_main_rankup dl {
  margin: 0 3%;
}
#wrap_bg #member_main_rankup dl > dd.rankup_txt1 {
  margin-bottom: 1em;
}
#wrap_bg #member_main_rankup dl > dd.rankup_txt2 {
  font-weight: 900;
  font-size: 2rem;
}
/*--------------------*
 * ポイント
 *--------------------*/
#wrap_bg #member_main_point .pointall_number {
  display: block;
  font-size: 2.8rem;
  color: #ff0000;
}
#wrap_bg #member_main_point dl {
  display: grid;
  width: 100%;
  margin: 10px 0;
}
#wrap_bg #member_main_point dl > dt.point_title {
  grid-row: 1;
  grid-column: 1;
}
#wrap_bg #member_main_point dl > dd.point_number {
  grid-row: 1;
  grid-column: 2;
}
#wrap_bg #member_main_point dl > dd.point_expire {
  grid-row: 2;
  grid-column: 1 / 3;
}
#wrap_bg #member_main_point dl > dd p {
  text-align: right;
}
#wrap_bg #member_main_point dl > dd.point_expire p {
  font-size: .9em;
}
/*========== 0px - 640px ==========*/
@media screen and (max-width: 640px) {
  /*----- グリッド 無効 -----*/
  #wrap_bg #member_main_base .wrap_grid {
    width: 100%;
    display: block;
  }
  /*----- 会員名 -----*/
  #wrap_bg #member_main_name p {
    text-align: center;
  }
  /*----- SMS認証 -----*/
  #wrap_bg #member_main_sms p a {
    margin: 10px auto;
  }
  /*----- ポイント -----*/
  #wrap_bg #member_main_point .pointall_title {
    display: block;
  }
  #wrap_bg #member_main_point .pointall_number {
    display: inline-block;
  }
}
/*====================================================*
 * 会員メイン：購入履歴
 *====================================================*/
#wrap_bg #member_main_history table td {
  padding: 5px;
  border: solid 1px #ccc;
}
#wrap_bg #member_main_history .scroll_flex > li {
  min-width: 640px;
}
/*====================================================*
 * 会員メイン：お気に入り
 *====================================================*/
#wrap_bg #member_main_favorite .slider_box li a .imgbox,
#wrap_bg #member_main_favorite .slider_box li a .textbox {
  width: 92%;
}
#wrap_bg #member_main_favorite .slider_box li a .textbox {
  font-size: .75rem;
  line-height: 1.4;
  margin-top: 10px;
}
#wrap_bg #member_main_favorite .slider_box .slick-dots {
  margin: 5px auto 0;
  padding: 0;
}
/*====================================================*
 * webクーポン
 *====================================================*/
#wrap_bg #member_main_coupon ul.member_main_coupon_note > li {
  font-size: 1.4rem;
  padding-left: 1em;
  text-indent: -1em;
}
#wrap_bg #member_main_coupon .slider_box {
  margin: 10px auto 20px;
  padding: 0;
}
#wrap_bg #member_main_coupon .slider_box li a .imgbox,
#wrap_bg #member_main_coupon .slider_box li a .textbox {
  width: 99%;
}
#wrap_bg #member_main_coupon .slick-slide {
  max-width: 147px;
}
/*--------------------*
 * クーポン一覧
 *--------------------*/
#wrap_bg #member_main_coupon ul.coupon_list {
  box-sizing: border-box;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(auto,180px) minmax(180px,1fr);
  grid-gap: 3px 0;
}
#wrap_bg #member_main_coupon ul.coupon_list > li {
  box-sizing: border-box;
  background-color: white;
  padding: 3px;
}
/*----- クーポン 画像 -----*/
#wrap_bg #member_main_coupon .coupon_img {
  box-sizing: border-box;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  max-width: 180px;
  min-width: 156px;
}
/*----- クーポン 詳細 -----*/
#wrap_bg #member_main_coupon .wrap_grid.gridtemp_coupon {
  grid-template-columns: 1.5fr 1fr;
  grid-template-rows: auto 1fr;
  grid-auto-flow: column;
  grid-gap: 0 20px;
    max-width: 500px;
}
#wrap_bg #member_main_coupon .wrap_grid.gridtemp_coupon li {
    margin-bottom: 5px;
}
#wrap_bg #member_main_coupon dl {
  box-sizing: border-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  font-size: 1.4rem;
}
#wrap_bg #member_main_coupon dl > dt {
  margin-right: auto;
  white-space: nowrap;
    font-weight: 900;
}
#wrap_bg #member_main_coupon dl > dd {
  margin-left: auto;
  white-space: nowrap;
}
#wrap_bg #member_main_coupon dl > dd font {
    font-size: 16px;
    font-weight: 900;
}
/*========== 0px - 640px ==========*/
@media screen and (max-width: 640px) {
  /*----- グリッド 無効 -----*/
  #wrap_bg #member_main_coupon .wrap_grid.gridtemp_coupon {
    display: block;
  }
  #wrap_bg #member_main_coupon dl {
    font-size: 1.25rem;
  }
}
/*====================================================*
 * キャンペーン
 *====================================================*/
.cpn_pr {
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0;
    /* max-width: 720px; */
    max-width: 1000px;
}
.cpn_pr h2 {
  font-size: 1.5em;
  font-weight: bolder;
  background: #efefef;
  color: #333;
  box-sizing: border-box;
  padding: .5em;
  margin: 15px auto 5px;
  text-align: center;
}
#ogp_bnr .cpn_pr ul {
  display: flex;
  padding: 0;
  flex-flow: row wrap;
  justify-content: left;
}
#ogp_bnr .cpn_pr ul li {
  margin: 0;
  padding: 1%;
  width: calc(100% / 3 - 2%);
}
#ogp_bnr .cpn_pr ul li img {
  width: 98%;
  border: solid 1px #ccc;
  max-width: 100%;
  height: auto;
  display: block;
  margin: auto;
}
/*========== 0px - 640px ==========*/
@media screen and (max-width: 640px) {
  #ogp_bnr .cpn_pr h2 {
    font-size: 1em;
  }
  #ogp_bnr .cpn_pr ul {
    margin: 0 auto;
  }
  #ogp_bnr .cpn_pr ul li {
    width: calc(100% / 2 - 2%);
  }
}
#login_area{
padding: 0 0 5vh;
box-sizing: border-box;
margin:0 auto;
width:100%;
max-width:1080px;
color:#333;
}
#login_area *{
box-sizing: border-box;
}
#login_area a{
color:#f6ae18;
text-decoration:underline;
}
#login_area #title h1{
font-size:30px;
margin-bottom:1em;
}


#login_clm{
display: flex;
flex-flow: row wrap;
justify-content:center ;
margin-bottom:5vh;
}

#login_clm_1,
#login_clm_2{
width:50%;
padding:0 2%;
margin:0 auto;
}

.login_clm_gray{
background:#efefef;
width:100%;
padding:10%;
margin:0 auto;
}

#login_clm h2{
font-size:20px;
margin-bottom:1em;
text-align:center;
}
.login_clm_input input[type="text"],
.login_clm_input input[type="email"],
.login_clm_input input[type="password"]{
width: 100%;
padding: 10px;
font-size: 16px;
border-radius: 10px;
border: 1px solid #ccc;
transition: 0.3s;
background:#fff;
height:40px;
margin:10px auto;
}

.login_clm_input input[type="text"]:focus,
.login_clm_input input[type="password"]:focus{
background:#fff;
}

.login_clm_input_button input[type="button"],
#login_area .new_btn a{
display: block;
width:90%;
color:#fff;
background:#f44434;
border-radius: 10px;
margin:10px auto;
border:none;
text-decoration:none;
height:40px;
padding:10px;
cursor:pointer;
}

#login_area .new_btn a{
background:#e29b00;
}

#LOGIN_MESSAGE {
color:red;
font-weight:bold;
}

.table_type{
width:100%;
margin:0 auto 2em;
display:table;
text-align:left;
}
.table_type li{
display:table-cell;
}
.table_type li:last-child{
width:90%;
}
.table_type li:first-child{
width:10%;
}
.login_clm_2_text{
margin:3em auto;
}

@media screen and (max-width: 480px){
#login_clm{
display: flex;
flex-flow: row wrap;
justify-content:center ;
margin-bottom:0;
}

#login_clm_1, #login_clm_2 {
    width: 100%;
    padding: 0 2%;
    margin: 0 auto 5vh;
}
.login_clm_gray{
padding:5%;
}

.login_clm_2_text {
margin:1em auto;
}
.login_clm_2_text br{
display:none;
}
p.title_text_sp {
display: block !important;
padding: .5em 1em;
}
}

#mv_section img,
#content_section img {
  max-width:100%;
  height:auto;
}
#contents_mv {
  max-width:2048px!important;
}
