@font-face {
    font-family: 'libel_suitregular';
    src: url('fonts/libel-suit-rg-webfont.woff2') format('woff2'),
         url('fonts/libel-suit-rg-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*-- Member Payment Wrapper -- */
#memberHolder{ position:fixed; display:none; text-align:center; width:100%; font-family:'libel_suitregular'; color:#000;}
#memberHolder .descColor{ color:#333;}
#memberHolder .memberInnerContent{ position:absolute; padding:2% 0 0;}

#memberHolder input{ font-family:"libel_suitregular"; text-align:center; width:30%; color:#333;}
#memberHolder .label{ margin-top:1%;}
#memberHolder .errMsg{ margin:.5% 0; color:#C00;}
#memberHolder .row{ width:53%; margin:1% auto;}
#memberHolder .column{ width:50%; float:left; text-align:left;}
#memberHolder .column input{ width:85%; text-align:left;}
#memberHolder .scoreDisplay{ width:50%; text-align:center; border:#999 solid 1px; margin:1% auto; }
#memberHolder .scoreDisplay tr, #memberHolder .scoreDisplay td{ border:#999 solid 1px; }
#memberHolder .scoreDisplay td{ width:50%; }
#memberHolder .hideChance{ width:30%; }
#memberHolder .hideChance .columnChance{ display: none; }

#memberHolder .scoreboardDisplay{ width:80%; text-align:center; border:#999 solid 1px; margin:1% auto; }
#memberHolder .scoreboardDisplay tr, #memberHolder .scoreboardDisplay td{ border:#999 solid 1px; }
#memberHolder .scoreboardDisplay .columnRank{ width: 10%; }
#memberHolder .scoreboardDisplay .columnName{ width: 58%; text-align: left; padding-left: 2%; }
#memberHolder .scoreboardDisplay .columnScore{ width: 30%; }
#memberHolder .actionScoreboard{ position:relative; width:100%; }
#memberHolder .actionScoreboard .floatL{ position:absolute; left:10%; top:0;}
#memberHolder .actionScoreboard .floatR{ position:absolute; right:10%; top:0;}

#memberHolder .tableBuyOption{ width:30%; margin:auto; position:relative; }
#memberHolder .tableBuyOption .buyOption{ width:100%; text-align:left; cursor: pointer;}
#memberHolder .tableBuyOption .buyOption .radioOpt{ width:10%; vertical-align:middle; margin-right:5%; }
#memberHolder .tableBuyOption .buyOption .textOpt{ vertical-align:middle; }

#memberHolder .tableBuyOption .buyProduct{ width:50%; float:left; text-align:left; vertical-align: middle;}
#memberHolder .tableBuyOption .buyPrice{ width:30%; float:left; text-align:center; vertical-align: middle;}
#memberHolder .tableBuyOption .buyCheck{ width:50%; float:left; text-align:left; vertical-align: middle;}
#memberHolder .tableBuyOption .buySelected{ background:#CCC; }
#memberHolder .twoButton{ width:73%; margin:auto; margin-top:2%; display: flex; }
#memberHolder .threeButton{ width:73%; margin:auto; margin-top:2%; display: flex; }

#memberHolder #rewardWrapper{ position:relative; width:65%; margin:auto; border-bottom:2px solid #000; padding-bottom:2%; }
#memberHolder #rewardLists{ position:relative; width:100%; margin:auto; border:#999 solid 1px; }
#memberHolder #rewardLists tr, #memberHolder #rewardLists td{ border:#999 solid 1px; }
#memberHolder .columnReward{ width:25%; padding:2%; }
#memberHolder .redeem_points{ color:#F30; }
#memberHolder .btnRedeemLeft{ position:absolute; top:40%; left:11%; width:4%;  cursor:pointer; }
#memberHolder .btnRedeemRight{ position:absolute; top:40%; right:11%; width:4%;  cursor:pointer; }
#memberHolder .redeemListNo{ position:absolute; top:10%; left:18%; }
#memberHolder .redeemPoints{ position:absolute; top:10%; right:18%; text-align:right; }
#memberHolder #rewardListSingle{ width:20%; margin:auto; margin-top:1%; }
#memberHolder #rewardListSingle tr, #memberHolder #rewardListSingle td{ border:#999 solid 1px; }
#memberHolder #redeemListSingle{ width:20%; margin:auto; margin-top:1%; }
#memberHolder #redeemListSingle tr, #memberHolder #redeemListSingle td{ border:#999 solid 1px; }
#memberHolder .columnRewardSingle{ padding:7% 10%; }

#memberHolder .button{ width:20%; margin:auto; cursor:pointer; }
#memberHolder .buttonSmall{ width:15%; margin:auto; cursor:pointer; }
#memberHolder .twoButton .button{ width:47%; float:left; margin: 0 1.5%; }
#memberHolder .threeButton .button{ width:31%; float:left; margin: 0 1.1%; }
#memberHolder .buttonRedeem{ width:110%; cursor:pointer; margin:5% -5%; }
#memberHolder .additional{ position:relative; width:60%; margin:auto; margin-top:2%; border-top:2px solid #000; padding-top:1%; }
#memberHolder .additionalRedeem{ position:relative; width:40%; margin:auto; padding-top:2%; }
#memberHolder .additionalRedeemCode{ position:relative; width:40%; margin:auto; padding-top:7%; }
#memberHolder .additional .button{ width:30%; }

#memberHolder .redemptionHistoryDisplay{ width:80%; text-align:center; border:#999 solid 1px; margin:1% auto; }
#memberHolder .redemptionHistoryDisplay tr, #memberHolder .redemptionHistoryDisplay td{ border:#999 solid 1px; }
#memberHolder .redemptionHistoryDisplay .columnHistoryNo{ width: 10%; }
#memberHolder .redemptionHistoryDisplay .columnHistoryName{ width: 50%; text-align: left; padding-left: 2%; }
#memberHolder .redemptionHistoryDisplay .columnHistoryPoint{ width: 20%; }
#memberHolder .redemptionHistoryDisplay .columnHistoryDate{ width: 20%; }
#memberHolder .actionRedemptionHistory{ position:relative; width:100%; }
#memberHolder .actionRedemptionHistory .floatL{ position:absolute; left:10%; top:0;}
#memberHolder .actionRedemptionHistory .floatR{ position:absolute; right:10%; top:0;}

#memberHolder #buttonSignup{ width:50%; margin:auto; cursor:pointer; }
#memberHolder .buttonClose{ position:absolute; top: 21%; right: 17%; cursor:pointer; width:7%; }
#memberHolder .extraBottom{ margin-bottom:1%; }
#memberHolder .extraTop{ margin-top:1.5%; }
#memberHolder .extraTopContent{ margin-top:6%; }
#memberHolder .extraTopContentL{ margin-top:12%; }

#memberHolder .loader{ padding:18% 0 0;}
#memberHolder .loadingList{ padding:10% 0 10%;}

a{ color:#333;}
.fitImg img{ width:100%; height:auto;}
.ignorePadding{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

#memberHolder.portrait .row{ width:45%; }
#memberHolder.portrait .button{ width: 16%; }
#memberHolder.portrait .twoButton{ width:35%; }
#memberHolder.portrait .threeButton{ width:50%; }
#memberHolder.portrait .twoButton .button{ width:47%; }
#memberHolder.portrait .threeButton .button{ width:31%; }
#memberHolder.portrait .additional .button{ width:30%; }
#memberHolder.portrait .singleButton .button{ width:29%; }
#memberHolder.portrait .additional{ width:50%; }

#memberHolder.portrait #rewardWrapper{ width:40%; }
#memberHolder.portrait .buttonRedeem{ width:75%; margin:5% auto; }
#memberHolder.portrait .btnRedeemLeft{ left:25%; width:4%; }
#memberHolder.portrait .btnRedeemRight{ right:25%; width:4%; }
#memberHolder.portrait .redeemListNo{ top:8%; left:6%; }
#memberHolder.portrait .redeemPoints{ top:8%; right:30%; }
#memberHolder.portrait .mobileScroll{ max-width: 60%; margin: auto; overflow-x: auto; }

#memberHolder.portrait .actionRedemptionHistory .floatL{ left:25%; }
#memberHolder.portrait .actionRedemptionHistory .floatR{ right:25%; }
#memberHolder.portrait .actionScoreboard .floatL{ left:25%; }
#memberHolder.portrait .actionScoreboard .floatR{ right:25%; }
#memberHolder.portrait .descColor{ width: 50%; margin: auto; }