@charset "utf-8";
/*font-----------------------------------------------------------------------------------*/
html { font-family:  "Noto Sans TC", "Helvetica Neue", Helvetica, Arial, "SourceHanSansTW", "Microsoft JhengHei", "微軟正黑體", sans-serif;  }

/*universal-----------------------------------------------------------------------------------*/
.pc-show {display:block!important;}
.mo-show {display:none!important;}
@media only screen and (max-width : 768px) {
.pc-show {display:none!important;}
.mo-show {display:block!important;}
}
.clear { clear:both!important; }
.clearfix { overflow: auto; zoom: 1; }

/*物件對齊*/
.fl { float:left; }
.fr { float:right; }
.fm {margin:0 auto;}

/*文字對齊*/
.center {text-align: center;}
.tar {text-align: right!important;}
.tal {text-align: left!important;}
.tac {text-align: center!important;}
.vam {vertical-align: middle;}

/*文字大小*/
.f-n { font-weight: normal;}
.f-b { font-weight:600!important;}
.f-12 { font-size:12px; }
.f-13 { font-size:13px; }
.f-14 { font-size:14px; }
.f-15 { font-size:15px; }
.f-16 { font-size:16px; }
.f-18 { font-size:18px; }
.f-20 { font-size:20px; }
.f-24 { font-size: 24px; }
.f-28 {	font-size: 28px; }
.f-30 {	font-size: 30px; }
.f-36 {	font-size: 36px; }
.f-48 {	font-size: 48px; }
.f-60 {	font-size: 60px; }

.f-udl {text-decoration: underline; }

.f-blue { color:#0087d5; }
.f-green { color:#00b9af!important; }
.f-gray  {color:#999; }
.f-white {color:#fff;}
.f-white a:link, .f-white a:visited, .f-white a:hover {color:#fff; }
.f-pink  { color: #f77ebc!important; }
.f-orange {color: #fa8653!important; }
.f-green2 { color:#07b53b!important; } /*20211229*/
.f-orange2 { color: #ff6100!important; } /*20211229*/
.f-pink2 { color:#f21275!important; } /*20211229*/
.f-indigo { color: #00287C !important; } /*20230504*/

.lh140 { line-height: 140%; }
.lh160 { line-height: 160%; }
.lh180 { line-height: 180%; }
.lh200 { line-height: 200%; }

/*寬度(百分比)*/
.w100pct { width:100%; }
.w96pct { width:96%; }
.w90pct { width:90%; }
.w80pct { width:80%; }
.w60pct { width:60%; }
.w50pct { width:50%; }
.w40pct { width:40%; }
.w33pct { width:33%; }
.w24pct { width:25%; }

/*外間距*/
.mg5 {margin: 5px;}
.mg10 {margin: 10px;}
.mg15 {margin: 15px;}
.mg20 {margin: 20px;}
.mg30 {margin: 30px;}
.mg50 {margin: 50px;}
.mg80 {margin: 80px;}
.mb5 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb50 {margin-bottom: 50px;}
.mb80 {margin-bottom: 80px;}
.mt5 {margin-top: 5px;}
.mt10 {margin-top: 10px!important;}
.mt15 {margin-top: 15px!important;}
.mt20 {margin-top: 20px!important;}
.mt30 {margin-top: 30px!important;}
.mt50 {margin-top: 50px;}
.mt80 {margin-top: 80px;}

/*內間距*/
/*---------- Padding ----------*/
.pv5 {
  padding-top: 5px;
  padding-bottom: 5px; }
.pv10 {
  padding-top: 10px;
  padding-bottom: 10px;}
.pv15 {
  padding-top: 15px;
  padding-bottom: 15px;}
.pv20 {
  padding-top: 20px;
  padding-bottom: 20px;}
.pv25 {
  padding-top: 25px;
  padding-bottom: 25px;}
.pv40 {
  padding-top: 40px;
  padding-bottom: 40px;}
.ph25 {
  padding-left: 25px;
  padding-right: 25px;}
.ph20 {
  padding-left: 20px;
  padding-right: 20px;}
.ph15 {
  padding-left: 15px;
  padding-right: 15px;
}
.ph10 { padding-left: 10px; padding-right: 10px; }
.ph5 { padding-left: 5px; padding-right: 5px; }
.pb70 { padding-bottom: 70px;}
.pb10 {  padding-bottom: 10px;}
.pl15 {  padding-left: 15px;}
.pl20 {  padding-left: 20px;}
.ph0 {  padding-left: 0;  padding-right: 0; }

/*notice-------------------------------------------------------------------------------------*/
#show-notice {
  color: #666;
  display: block;
  width: 80%;
  padding: 10px;
  margin: 20px auto 50px auto;
  position: relative;
  cursor: pointer;
  border: 1px solid #c8c8c8;
  font-size: 14px;
  background: #ddd url(../img/arrowDown-white.png) no-repeat 105px 17px;
  background-size: 11px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#notice-content {
  margin: -51px auto 50px auto;
  padding: 10px 30px 10px 10px;
  width: 80%;
  font-size: 14px;
  line-height: 190%;
  border: 1px solid #c8c8c8;
  color: #999;
  background-color: #fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#notice-content ol, #notice-content ul {
  margin: 0 0 0 25px;
}
#notice-content ol li, #notice-content ul li {
  margin: 0 0 0 0px;
}
@media only screen and (max-width : 768px) {
#show-notice, #notice-content { width: 84%; }
}


/*color-------------------------------------------------------------------------------------*/
@-webkit-keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins
    More info at: http://lesselements.com
  ---------------------------------------------------*/
body {
  /*init--------------------------------------------------*/
  font-family: "Noto Sans TC", "Helvetica Neue", Helvetica, Arial, "SourceHanSansTW", "Microsoft JhengHei", "微軟正黑體", sans-serif;
  font-size: 15px;
}
body input:focus,
body select:focus,
body textarea:focus,
body form:focus,
body a:focus,
body button:focus {
  outline: 0;
}
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body input {
  font-family: "Noto Sans TC", "Helvetica Neue", Helvetica, Arial, "SourceHanSansTW", "Microsoft JhengHei", "微軟正黑體", sans-serif;
  margin: 0;
}
body button {
  font-family: "Noto Sans TC", "Helvetica Neue", Helvetica, Arial, "SourceHanSansTW", "Microsoft JhengHei", "微軟正黑體", sans-serif;
}
body a {
  text-decoration: none;
}
body .faq .fancybox-slide--iframe .fancybox-content {
  width: 660px; height:485px; padding: 30px 60px 40px 60px;
}
body .small_lightbox .fancybox-slide--iframe .fancybox-close-small:after {
}
body .small_lightbox .fancybox-slide--iframe .fancybox-content {
  width: 660px; height:485px; padding: 30px 60px 40px 60px;
}
body .alert .fancybox-slide--iframe .fancybox-content {
  width: 660px; height:485px; padding: 30px 45px 40px 60px;
}
body .alert_icon .fancybox-content:before {
  content: "";
  background-image: url('../svg/alert_icon.svg');
  width: 32px;
  height: 32px;
  background-color: transparent;
  position: absolute;
  top: -16px;
  left: calc(50% - 16px);
}
.fancybox-content {
  border: solid 2px #cbedfa;    /* it fix: popup border */
}
body .alert_icon .fancybox-slide--iframe .fancybox-content {
  width: 660px; height:485px; padding: 30px 60px 40px 60px;
}
body .alert_full .fancybox-slide--iframe .fancybox-content {
  width: 660px; height:485px; padding: 30px 60px 40px 60px;
}
body .investment .fancybox-slide--iframe .fancybox-content {
  width: 660px; height:485px;
}
body .loading,
.loadingPurchaseEmailIframe ,
.monthlyReportLoading {
  position: fixed;
  width:  100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.36);
  z-index: 100;
  top: 0;
  left: 0;
}
body .loading .fancybox-loading,
.loadingPurchaseEmailIframe .fancybox-loading,
.loadingKycEmailIframe .fancybox-loading ,
.monthlyReportLoading .fancybox-loading{
  border: 6px solid rgba(100, 100, 100, 0.4);
  border-top: 6px solid rgba(255, 255, 255, 0.6);
  border-radius: 100%;
  height: 50px;
  width: 50px;
  -webkit-animation: fancybox-rotate 0.8s infinite linear;
  animation: fancybox-rotate 0.8s infinite linear;
  background: transparent;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -30px;    /* it fix */
  margin-left: -30px;   /* it fix */
}
.fancybox-slide > .fancybox-loading {   /* it fix */
    padding: 0!important;
    margin-top: -30px!important;
    margin-left: -30px!important;
}
.fancybox-show {
  overflow-x: initial;
}
.fancybox-slide--iframe .fancybox-content {
-webkit-box-shadow: 0 4px 12px 0 rgba(25,25,25,0.08);
box-shadow: 0 4px 12px 0 rgba(25,25,25,0.08);
width: 660px; height:485px;
font-size:16px;
line-height: 180%;
}

.fancybox-slide--iframe .fancybox-close-small {
  pointer-events: auto;
  right:0!important;
  top:0!important;
  width: 0!important;
  height: 0!important;
}
.fancybox-slide--iframe .fancybox-close-small:after, .fancybox-slide--iframe .fancybox-close-small:hover:after {
  right: -3px!important; top:-38px!important;
  width: 26px;
  height: 26px;  cursor: pointer;
  background: url(../img/close-popup.svg) no-repeat left center;
  background-size: 26px 26px;
}

.fancybox-bg {
  background-color: black;
  z-index: 9; /* it fix: 測試修正下方按鈕搶圖層問題 */
}
.fancybox-is-open .fancybox-bg {
  -moz-opacity: 0.6;
  -khtml-opacity: 0.6;
  -webkit-opacity: 0.6;
  opacity: 0.6;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
  filter: alpha(opacity=60);
  height: 100vh;
}
.fancybox-iframe,
.fancybox-image {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.hide {
  display: none;
}



.section-100 {
  min-height: 100vh;
}

/*color-------------------------------------------------------------------------------------*/
@-webkit-keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins
    More info at: http://lesselements.com
  ---------------------------------------------------*/


/*color-------------------------------------------------------------------------------------*/
@-webkit-keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins
    More info at: http://lesselements.com
  ---------------------------------------------------*/
@media screen and (max-width: 992px) {
  body .investment .fancybox-slide--iframe .fancybox-content {
    width: 96%;
  }
  .fancybox-slide--iframe .fancybox-content {
    width: 96%;
  }
} /* 補下花刮號，怕每次都漏掉，以註解標記 */

/*color-------------------------------------------------------------------------------------*/
@-webkit-keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins
    More info at: http://lesselements.com
  ---------------------------------------------------*/
@media screen and (max-width: 600px) {
  body .faq .fancybox-slide--iframe .fancybox-content {  border:0px solid pink!important;
    width: calc(100% - 40px) !important;
	padding: 30px 10px 40px 10px;
  }
  body .alert .fancybox-slide--iframe .fancybox-content {
    border: solid 2px #cbedfa;    /* it fix: popup border */
    min-width: 0 !important;
    margin: 0;
    width: calc(100% - 40px) !important;
	padding: 30px 10px 40px 10px;
  }
  body .alert_icon .fancybox-slide--iframe .fancybox-content {
    border: solid 2px #cbedfa;    /* it fix: popup border */
    min-width: 0 !important;
    margin: 0;
    width: calc(100% - 40px) !important;
	padding: 30px 10px 40px 10px;
  }
  body .alert_full .fancybox-slide--iframe .fancybox-content {
    border: solid 2px #cbedfa;    /* it fix: popup border */
    margin: 0;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
	padding: 30px 10px 40px 10px;
  }
body .alert_full .fancybox-slide--iframe .fancybox-content .fancybox-close-small {
  pointer-events: auto;
  right:0!important;
  top:0!important;
  width: 0!important;
  height: 0!important;
}
body .alert_full .fancybox-slide--iframe .fancybox-close-small:after, body .alert_full .fancybox-slide--iframe .fancybox-close-small:hover:after {
  right: 2px!important; top:7px!important;
  width: 26px;
  height: 26px;  cursor: pointer;
  background:#0087d5 url(../img/close-popup-white.svg) no-repeat center center;
  background-size: 16px!important;
}

  body .investment .fancybox-slide--iframe .fancybox-content { border:0px solid pink!important;
    margin: 0;
    max-width: 310px !important;
    width: 100% !important;
	padding: 30px 10px 40px 10px;
  }

.fancybox-slide--iframe .fancybox-close-small {
  pointer-events: auto;
  right:0!important;
  top:0!important;
  width: 0!important;
  height: 0!important;
}
.fancybox-slide--iframe .fancybox-close-small:after, .fancybox-slide--iframe .fancybox-close-small:hover:after {
  right: -3px!important; top:-38px!important;
  width: 26px;
  height: 26px;  cursor: pointer;
  background: url(../img/close-popup.svg) no-repeat left center;
  background-size: 26px 26px;
}

  body .alert_full .fancybox-iframe,
  body .alert_full .fancybox-image {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
  }
}

.pcshow {display:block!important;}
.moshow {display:none!important;}

@media only screen
and (min-device-width : 320px)
and (max-device-width : 736px)
and (orientation : portrait) {
.pcshow {display:none!important;}
.moshow {display:block!important;}
} /*iphone 6.7.8 plus in portrait*/

div.noticePink,
.content .dialog section div.noticePink,
.content .dialog section div > ul > li > ul > li p.noticePink,
span.noticePink,
.content .dialog > ul ~ p.noticePink {
	color: #f77ebc;
	display: inline;
	font-weight: bold;
	text-decoration: underline;
}
.content .dialog section div.noticePink{
	padding-right: 0px;
    margin-right: 0px;
}
span.noticeBlue, li.noticeBlue{
	color: #316fc9;
}
span.underline{
	text-decoration: underline;
}
span.bold{
	font-weight: bold;
}
.content .read-more > div > ol > li > ol > li.secondLayerDisplayInline{
	display:inline;
}

/*uxi-design popup style change 20211019*/
.iframe-pop h1 {
    display: block;
    font-size: 24px;
    font-weight: bold;
    line-height: 36px;
    text-align: center;
    color: black;
    margin:0 auto 20px auto!important; }
.iframe-pop {
  padding: 0 5px 0 0;
  text-align: left;
  font-size: 16px;
  color:#000;
  line-height: 150%;
  font-weight: 400; /* 美工給600太粗, 改為400 */
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
}
@media screen and (max-width: 414px) {
.iframe-pop { font-size: 14px; }
}

.iframe-pop ol, .iframe-pop ul { margin: 8px auto; width: 100%; }
.iframe-pop ol li, .iframe-pop ul li { text-align: left; margin: 0 0 10px -20px; }

/*popup btn*/
.iframe-pop .popup-btn-wrap { text-align: center!important; width:100%!important;  }
.iframe-pop .popup-btn { display: inline-block;
    width: 140px;
    height: 48px;
    border: solid 1px #01b1b1;
    border-radius: 100px;
    line-height: 48px;
    background-color: #ffffff;
    color: #01b1b1;
  font-size:15px;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.iframe-pop .popup-btn a:nth-child(1) {
  color: #01b1b1;
  background-color: transparent;
  border: solid 1px #01b1b1;
}
.iframe-pop .popup-btn a:nth-child(2) {
  color: #fff;
  background-image: linear-gradient(to right, #093e7e, #2ad2b8);
}

 /*stockfeel popup style 20211018*/
.popups table, .iframe-pop table  { border-collapse: collapse; margin:0 auto; width:100%; }
.popups table th, .popups table td, .iframe-pop table th, .iframe-pop table td {
	background-color: #fff;
	border: solid 1px #cbedfa;
	padding: 9px 10px;
    text-align: center;
    font-size: 16px;
	font-weight:400;
    vertical-align: middle;
    line-height: 18px; }

.popups .f-green, .iframe-pop .f-green {
  color: #15bd7a
}
.popups .f-blue, .iframe-pop .f-blue {
  color: #0087d5
}
.popup-main table .fc-gray {
  color: #828282;
  font-size: 0.875em
}
.fz-small { font-size: 14px; font-weight:300; margin-top: 8px; line-height: 160%; }
.fc-gray { color: #828282; }

/*stockfeel scrollContainer fix*/
.scrollContent  {
  /* margin:20px 0 0 0; */
  weight:400;
  line-height: 160%;
  /* padding-top: 60px; */
  /* padding-top: 30px; */ /* fix fails */
  padding-bottom:30px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: url('../svg/invalid-name-geometry.svg') #011b4e center;
 }

/*jquery.fancybox.min.css fix*/
.fancybox-close-small:after {
  content: ""!important;
}
@media screen and (max-width: 591px) {  /* it fix: parent css width */
.fancybox-slide--iframe .fancybox-content {
  border: solid 2px #cbedfa;    /* it fix: popup border */
  max-width: calc(100% - 40px)!important;
  width: calc(100% - 40px)!important;
  /* height:485px!important; */ /* it fix: 註解掉，避免影響小網 pop up 高度 */
  padding: 30px 10px 30px 10px!important;
  overflow: visible;
}
}

/* ===== Scrollbar CSS ===== *//*20211105*/
.scroll::-webkit-scrollbar {
  width: 5px;
}
.scroll::-webkit-scrollbar-track {
  /* background: #fff; */
  background: transparent;
}
.scroll::-webkit-scrollbar-thumb {
  background: #ccc;
}

/********** 以下為 IT 修改 **********/
/*
 * 強制改變首頁popup高寬
 */
/* .loginPopupContent {
    width: 500px!important;
    height: 480px!important;
}
.fancybox-close-small:after {
    border-radius: 0!important;
}
.loginPopupIframe {
    min-height: 100%!important;
    height: 100%!important;
}
*/

/*20211018 全站loading*/
#loading-wrap {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(20, 40, 38, 0.4);
  z-index: 999;
}

#loading-wrap .lds-ring {
  display: inline-block;
  position: absolute;
  top: calc(50% - 40px);
  left: calc(50% - 40px);
  width: 80px;
  height: 80px;
}

#loading-wrap .lds-ring div {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  margin: 8px;
  border: 8px solid #fff;
  border-radius: 50%;
  -webkit-animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
          animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #fff transparent transparent transparent;
}

#loading-wrap .lds-ring div:nth-child(1) {
  -webkit-animation-delay: -0.45s;
          animation-delay: -0.45s;
}

#loading-wrap .lds-ring div:nth-child(2) {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s;
}

#loading-wrap .lds-ring div:nth-child(3) {
  -webkit-animation-delay: -0.15s;
          animation-delay: -0.15s;
}

@-webkit-keyframes lds-ring {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes lds-ring {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

/* 上線按鈕新文案置中 */
#sidebar > a {
    text-align: center;
}
/** 活動用 **/
/* 無活動: 預設 */
.sideBarCostDefault {
    height: 110px;
}
@media (max-width: 1279px) {
  .sideBarCostDefault {
      height: unset;
  }
  .sideBarCostDefault .btn-desc:after {
      content: '';
  }
}
@media screen and (max-width: 360px) {
  .cost2PercentDefault  {
    zoom: 0.9;
    padding-top: 8px!important;
  }
}
/* 有活動 */
@media (max-width: 1279px) {
    .cost2Percent {
        height: auto;
    }
    .cost2Percent .btn-desc:after {
        content: '\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0';
    }
}
@media screen and (max-width: 360px) {
  .cost2Percent  {
    zoom: 0.9;
    padding-top: 8px!important;
  }
}

/** fancybox 相關修正 **/
/* 全域修正 fancybox popup 造成 body 捲軸寬度推移問題 */
body {
    --scrollbar-width: calc(100vw - 100%);
}
body.fancybox-active {
    margin-right: -(calc(100vw - var(--scrollbar-width)));
}
/** 修正 ios 裝置 fancybox back to top 問題**/
body.fancybox-iosfix {
    /* position: fixed;
    top: 0;
    left: 0; */
    /* 以上預設樣式造成, 以下為修正 */
    overflow: visible!important;
    position: relative !important;
}
/* fancybox 關閉按鈕虛線 outline 取消 */
.fancybox-close-small:after {
    outline: none!important;
}
/* 小網登入 popup 滿版則不顯示邊框 */
@media screen and (max-width: 600px) {
    .loginPopupContent {
        border: 0px!important;
    }
}
/* 除產品一二號頁以外的 fancybox popup 彈出時 背景 scroll lock */
.-htmlNotScroll {
    overflow: hidden!important;
}

/*20220107*/
button.info-ico, button.info {
  display: inline-block;
  border: 0;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin: 0 3px;; padding:0;
  background: url(../img/ico_info.png) no-repeat -3px -6px;
  background-size: 24px 24px;
}

a:link.popup-close-btn, a:visited.popup-close-btn, a:hover.popup-close-btn {display:block; margin:30px auto 10px auto; color:#fff; padding:10px; width:250px; max-width: 300px; text-align: center; font-size:16px; background: linear-gradient(to right, #093e7e, #2ad2b8); border-radius:50px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;  }

/*20220106*/
/* nmif0202, nmif0302, nmif0402, nmif0502, nmif0506 契約下拉按鈕 */
.quick-read {
  display: block;
  width: 95%;
  height: 25px;
  margin: 8px auto 8px -2px;
  background-color: #e0e0e0;
  border: 1px solid #e0e0e0;
  border-radius: 20px;
  color: #000;
  font: bold 12px/140% "Lucida Grande", sans-serif;
  padding: 1px 5px 5px 5px;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* 契約條款區塊 */
.contract-checkbox-block {
  padding-top: 10px;
}

/* 契約條款 checkbox */
.contract-checkbox {
  display: inline !important;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  margin-bottom: 3px;
}

/* 契約條款說明文字 */
.contract-confirm-text {
  margin-left: 6px !important;
  font-size: 14px;
}

/* 契約條款區塊分割線 */
.contract-dividing-line {
  border-top: lightgray 1px solid;
  margin-top: 50px;
}

/****
@media screen and (max-width: 599px)
body .btn-container .btn {
    width: 120px;
    margin: 0 8px;
}
****/

.parameterPopup .btn-container {
    text-align: center;
}

.parameterPopup .btn-container .btn.cancel {
    color: #01b1b1;
    background-color: transparent;
    border: solid 1px #01b1b1!important;
}

.parameterPopup .btn-container .btn.confirm {
    color: #ffffff;
    background-image: linear-gradient(to right, #093e7e, #2ad2b8);
}

.parameterPopup .btn-container .btn {
    border: none;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 1px;
    text-align: center;
    width: 50%;
    height: 48px;
    margin: 0 20px;
    box-sizing: border-box;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    cursor: pointer;
    outline: none;
}

.redemptionConfirmPopup .btn-container,
.agingCustomerPopup .btn-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.redemptionConfirmPopup .btn-container .btn,
.agingCustomerPopup .btn-container .btn {
  border: none;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 1px;
  text-align: center;
  width: 140px;
  height: 48px;
  margin: 0 px;
  box-sizing: border-box;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  border-radius: 24px;
  cursor: pointer;
  outline: none;
  white-space: nowrap;
}
.redemptionConfirmPopup .btn-container .btn.cancel,
.agingCustomerPopup .btn-container .btn.cancel {
  color: #01b1b1;
  background-color: transparent;
  border: solid 1px #01b1b1;
}
.redemptionConfirmPopup .btn-container .btn.confirm,
.agingCustomerPopup .btn-container .btn.confirm {
  color: #ffffff;
  background-image: linear-gradient(to right, #093e7e, #2ad2b8);
}
#agingCustomerTest {
    font-size: 20px;
    line-height: 28px;
    font-weight: normal;
    color: #191919;
    line-height: 25px;
}
#agingCustomerTest .error {
    color: #f77ebc;
    font-weight: bold;
}
#agingCustomerTest > div[data-type=MATH] .questionContent {
    text-align: center;
    font-size: 32px;
}
#agingCustomerTest > div[data-type=MATH] input  {
    color: #0087d5;
    outline: none; border: none;
    border-bottom: 1px solid #0087d5;
    padding: 5px;
    width: 60px;
    text-align: center;
}
#agingCustomerTest > div > ul {
    list-style-type: none;
}
#agingCustomerTest > div > ul > li {
    margin: 8px 0;
}
#agingCustomerTest > div {
    margin: 20px 0;
}
.agingCustomerPopup .list li {
    font-size: 20px!important;
    line-height: 28px!important;
}
@media screen and (max-width: 600px) {
    .agingCustomerPopup .list li {
        font-size: 18px!important;
        line-height: 22px!important;
    }
    #agingCustomerTest {
        font-size: 18px;
        line-height: 22px;
    }
}