@charset "UTF-8";
html, body, form {
  height: 100%;
  /*宣告高支援100%*/ }

.carousel {
  height: 100%; }

.item, .active, .carousel-inner {
  height: 100%; }

/* 
寬度固定 */
.fixed-width-carousel .carousel {
  height: 755px; }

.half {
  /* 矮版 */
  height: 375px; }

.fixed-width {
  /* 寬度固定 */
  max-width: 1140px;
  max-height: 755px;
  margin: 0 auto; }

@media (max-width: 1200px) {
  .fixed-width-carousel .carousel {
    height: 600px; } }

/* 
寬度滿版 */
.fill {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-size: cover; }

.carousel-item {
  height: 100%;
  /*高度需設100%輪播圖滾動才會連續, 設vh背景圖無法等比例縮放*/
  min-height: 350px;
  background: no-repeat center center scroll;
  background-size: cover; }

#carousel1 .left.carousel-control img,
#carousel1 .right.carousel-control img {
  position: absolute;
  top: 45%; }

#carousel1 .left.carousel-control img {
  right: 50%; }

#carousel1 .right.carousel-control img {
  left: 50%; }

@media (max-width: 1400px) {
  .carousel {
    height: 600px;
    /*margin-top: 70px;*/ }
  .half {
    height: 300px; } }

@media (max-width: 992px) {
  .carousel,
  .fixed-width-carousel .carousel {
    height: 550px; }
  .half {
    height: 275px; }
  #carousel1 .left.carousel-control img, #carousel1 .right.carousel-control img {
    -webkit-transform: scale(0.8);
        -ms-transform: scale(0.8);
            transform: scale(0.8); }
  #carousel1 .left.carousel-control img {
    right: 30%; }
  #carousel1 .right.carousel-control img {
    left: 30%; } }

@media (max-width: 768px) {
  .carousel,
  .fixed-width-carousel .carousel {
    height: 450px; }
  .half {
    height: 225px; }
  #carousel1 .left.carousel-control img, #carousel1 .right.carousel-control img {
    -webkit-transform: scale(0.6);
        -ms-transform: scale(0.6);
            transform: scale(0.6); }
  #carousel1 .left.carousel-control img {
    right: 20%; }
  #carousel1 .right.carousel-control img {
    left: 20%; } }

@media (max-width: 560px) {
  .half {
    height: 180px; }
  .half .carousel-item {
    min-height: 180px; } }

input[type="range"] {
  margin: auto;
  -webkit-appearance: none;
  outline: none;
  overflow: hidden;
  height: 40px;
  width: 200px;
  cursor: pointer;
  border-radius: 50px; }
  input[type="range"]::-webkit-slider-runnable-track {
    background: #ddd;
    height: 20px; }
  input[type="range"]::-webkit-slider-thumb {
    margin-top: -10px;
    -webkit-appearance: none;
    width: 40px;
    height: 40px;
    background: #009999;
    border: 2px solid #009999;
    border-radius: 50%;
    -webkit-box-shadow: -5px 0 0 -10px #40d7d7, -6px 0 0 -10px #40d7d7, -7px 0 0 -10px #40d7d7, -8px 0 0 -10px #40d7d7, -9px 0 0 -10px #40d7d7, -10px 0 0 -10px #40d7d7, -11px 0 0 -10px #40d7d7, -12px 0 0 -10px #40d7d7, -13px 0 0 -10px #40d7d7, -14px 0 0 -10px #40d7d7, -15px 0 0 -10px #40d7d7, -16px 0 0 -10px #40d7d7, -17px 0 0 -10px #40d7d7, -18px 0 0 -10px #40d7d7, -19px 0 0 -10px #40d7d7, -20px 0 0 -10px #40d7d7, -21px 0 0 -10px #40d7d7, -22px 0 0 -10px #40d7d7, -23px 0 0 -10px #40d7d7, -24px 0 0 -10px #40d7d7, -25px 0 0 -10px #40d7d7, -26px 0 0 -10px #40d7d7, -27px 0 0 -10px #40d7d7, -28px 0 0 -10px #40d7d7, -29px 0 0 -10px #40d7d7, -30px 0 0 -10px #40d7d7, -31px 0 0 -10px #40d7d7, -32px 0 0 -10px #40d7d7, -33px 0 0 -10px #40d7d7, -34px 0 0 -10px #40d7d7, -35px 0 0 -10px #40d7d7, -36px 0 0 -10px #40d7d7, -37px 0 0 -10px #40d7d7, -38px 0 0 -10px #40d7d7, -39px 0 0 -10px #40d7d7, -40px 0 0 -10px #40d7d7, -41px 0 0 -10px #40d7d7, -42px 0 0 -10px #40d7d7, -43px 0 0 -10px #40d7d7, -44px 0 0 -10px #40d7d7, -45px 0 0 -10px #40d7d7, -46px 0 0 -10px #40d7d7, -47px 0 0 -10px #40d7d7, -48px 0 0 -10px #40d7d7, -49px 0 0 -10px #40d7d7, -50px 0 0 -10px #40d7d7, -51px 0 0 -10px #40d7d7, -52px 0 0 -10px #40d7d7, -53px 0 0 -10px #40d7d7, -54px 0 0 -10px #40d7d7, -55px 0 0 -10px #40d7d7, -56px 0 0 -10px #40d7d7, -57px 0 0 -10px #40d7d7, -58px 0 0 -10px #40d7d7, -59px 0 0 -10px #40d7d7, -60px 0 0 -10px #40d7d7, -61px 0 0 -10px #40d7d7, -62px 0 0 -10px #40d7d7, -63px 0 0 -10px #40d7d7, -64px 0 0 -10px #40d7d7, -65px 0 0 -10px #40d7d7, -66px 0 0 -10px #40d7d7, -67px 0 0 -10px #40d7d7, -68px 0 0 -10px #40d7d7, -69px 0 0 -10px #40d7d7, -70px 0 0 -10px #40d7d7, -71px 0 0 -10px #40d7d7, -72px 0 0 -10px #40d7d7, -73px 0 0 -10px #40d7d7, -74px 0 0 -10px #40d7d7, -75px 0 0 -10px #40d7d7, -76px 0 0 -10px #40d7d7, -77px 0 0 -10px #40d7d7, -78px 0 0 -10px #40d7d7, -79px 0 0 -10px #40d7d7, -80px 0 0 -10px #40d7d7, -81px 0 0 -10px #40d7d7, -82px 0 0 -10px #40d7d7, -83px 0 0 -10px #40d7d7, -84px 0 0 -10px #40d7d7, -85px 0 0 -10px #40d7d7, -86px 0 0 -10px #40d7d7, -87px 0 0 -10px #40d7d7, -88px 0 0 -10px #40d7d7, -89px 0 0 -10px #40d7d7, -90px 0 0 -10px #40d7d7, -91px 0 0 -10px #40d7d7, -92px 0 0 -10px #40d7d7, -93px 0 0 -10px #40d7d7, -94px 0 0 -10px #40d7d7, -95px 0 0 -10px #40d7d7, -96px 0 0 -10px #40d7d7, -97px 0 0 -10px #40d7d7, -98px 0 0 -10px #40d7d7, -99px 0 0 -10px #40d7d7, -100px 0 0 -10px #40d7d7, -101px 0 0 -10px #40d7d7, -102px 0 0 -10px #40d7d7, -103px 0 0 -10px #40d7d7, -104px 0 0 -10px #40d7d7, -105px 0 0 -10px #40d7d7, -106px 0 0 -10px #40d7d7, -107px 0 0 -10px #40d7d7, -108px 0 0 -10px #40d7d7, -109px 0 0 -10px #40d7d7, -110px 0 0 -10px #40d7d7, -111px 0 0 -10px #40d7d7, -112px 0 0 -10px #40d7d7, -113px 0 0 -10px #40d7d7, -114px 0 0 -10px #40d7d7, -115px 0 0 -10px #40d7d7, -116px 0 0 -10px #40d7d7, -117px 0 0 -10px #40d7d7, -118px 0 0 -10px #40d7d7, -119px 0 0 -10px #40d7d7, -120px 0 0 -10px #40d7d7, -121px 0 0 -10px #40d7d7, -122px 0 0 -10px #40d7d7, -123px 0 0 -10px #40d7d7, -124px 0 0 -10px #40d7d7, -125px 0 0 -10px #40d7d7, -126px 0 0 -10px #40d7d7, -127px 0 0 -10px #40d7d7, -128px 0 0 -10px #40d7d7, -129px 0 0 -10px #40d7d7, -130px 0 0 -10px #40d7d7, -131px 0 0 -10px #40d7d7, -132px 0 0 -10px #40d7d7, -133px 0 0 -10px #40d7d7, -134px 0 0 -10px #40d7d7, -135px 0 0 -10px #40d7d7, -136px 0 0 -10px #40d7d7, -137px 0 0 -10px #40d7d7, -138px 0 0 -10px #40d7d7, -139px 0 0 -10px #40d7d7, -140px 0 0 -10px #40d7d7, -141px 0 0 -10px #40d7d7, -142px 0 0 -10px #40d7d7, -143px 0 0 -10px #40d7d7, -144px 0 0 -10px #40d7d7, -145px 0 0 -10px #40d7d7, -146px 0 0 -10px #40d7d7, -147px 0 0 -10px #40d7d7, -148px 0 0 -10px #40d7d7, -149px 0 0 -10px #40d7d7, -150px 0 0 -10px #40d7d7, -151px 0 0 -10px #40d7d7, -152px 0 0 -10px #40d7d7, -153px 0 0 -10px #40d7d7, -154px 0 0 -10px #40d7d7, -155px 0 0 -10px #40d7d7, -156px 0 0 -10px #40d7d7, -157px 0 0 -10px #40d7d7, -158px 0 0 -10px #40d7d7, -159px 0 0 -10px #40d7d7, -160px 0 0 -10px #40d7d7, -161px 0 0 -10px #40d7d7, -162px 0 0 -10px #40d7d7, -163px 0 0 -10px #40d7d7, -164px 0 0 -10px #40d7d7, -165px 0 0 -10px #40d7d7, -166px 0 0 -10px #40d7d7, -167px 0 0 -10px #40d7d7, -168px 0 0 -10px #40d7d7, -169px 0 0 -10px #40d7d7, -170px 0 0 -10px #40d7d7, -171px 0 0 -10px #40d7d7, -172px 0 0 -10px #40d7d7, -173px 0 0 -10px #40d7d7, -174px 0 0 -10px #40d7d7, -175px 0 0 -10px #40d7d7, -176px 0 0 -10px #40d7d7, -177px 0 0 -10px #40d7d7, -178px 0 0 -10px #40d7d7, -179px 0 0 -10px #40d7d7, -180px 0 0 -10px #40d7d7, -181px 0 0 -10px #40d7d7, -182px 0 0 -10px #40d7d7, -183px 0 0 -10px #40d7d7, -184px 0 0 -10px #40d7d7, -185px 0 0 -10px #40d7d7, -186px 0 0 -10px #40d7d7, -187px 0 0 -10px #40d7d7, -188px 0 0 -10px #40d7d7, -189px 0 0 -10px #40d7d7, -190px 0 0 -10px #40d7d7, -191px 0 0 -10px #40d7d7, -192px 0 0 -10px #40d7d7, -193px 0 0 -10px #40d7d7, -194px 0 0 -10px #40d7d7, -195px 0 0 -10px #40d7d7, -196px 0 0 -10px #40d7d7, -197px 0 0 -10px #40d7d7, -198px 0 0 -10px #40d7d7, -199px 0 0 -10px #40d7d7, -200px 0 0 -10px #40d7d7;
            box-shadow: -5px 0 0 -10px #40d7d7, -6px 0 0 -10px #40d7d7, -7px 0 0 -10px #40d7d7, -8px 0 0 -10px #40d7d7, -9px 0 0 -10px #40d7d7, -10px 0 0 -10px #40d7d7, -11px 0 0 -10px #40d7d7, -12px 0 0 -10px #40d7d7, -13px 0 0 -10px #40d7d7, -14px 0 0 -10px #40d7d7, -15px 0 0 -10px #40d7d7, -16px 0 0 -10px #40d7d7, -17px 0 0 -10px #40d7d7, -18px 0 0 -10px #40d7d7, -19px 0 0 -10px #40d7d7, -20px 0 0 -10px #40d7d7, -21px 0 0 -10px #40d7d7, -22px 0 0 -10px #40d7d7, -23px 0 0 -10px #40d7d7, -24px 0 0 -10px #40d7d7, -25px 0 0 -10px #40d7d7, -26px 0 0 -10px #40d7d7, -27px 0 0 -10px #40d7d7, -28px 0 0 -10px #40d7d7, -29px 0 0 -10px #40d7d7, -30px 0 0 -10px #40d7d7, -31px 0 0 -10px #40d7d7, -32px 0 0 -10px #40d7d7, -33px 0 0 -10px #40d7d7, -34px 0 0 -10px #40d7d7, -35px 0 0 -10px #40d7d7, -36px 0 0 -10px #40d7d7, -37px 0 0 -10px #40d7d7, -38px 0 0 -10px #40d7d7, -39px 0 0 -10px #40d7d7, -40px 0 0 -10px #40d7d7, -41px 0 0 -10px #40d7d7, -42px 0 0 -10px #40d7d7, -43px 0 0 -10px #40d7d7, -44px 0 0 -10px #40d7d7, -45px 0 0 -10px #40d7d7, -46px 0 0 -10px #40d7d7, -47px 0 0 -10px #40d7d7, -48px 0 0 -10px #40d7d7, -49px 0 0 -10px #40d7d7, -50px 0 0 -10px #40d7d7, -51px 0 0 -10px #40d7d7, -52px 0 0 -10px #40d7d7, -53px 0 0 -10px #40d7d7, -54px 0 0 -10px #40d7d7, -55px 0 0 -10px #40d7d7, -56px 0 0 -10px #40d7d7, -57px 0 0 -10px #40d7d7, -58px 0 0 -10px #40d7d7, -59px 0 0 -10px #40d7d7, -60px 0 0 -10px #40d7d7, -61px 0 0 -10px #40d7d7, -62px 0 0 -10px #40d7d7, -63px 0 0 -10px #40d7d7, -64px 0 0 -10px #40d7d7, -65px 0 0 -10px #40d7d7, -66px 0 0 -10px #40d7d7, -67px 0 0 -10px #40d7d7, -68px 0 0 -10px #40d7d7, -69px 0 0 -10px #40d7d7, -70px 0 0 -10px #40d7d7, -71px 0 0 -10px #40d7d7, -72px 0 0 -10px #40d7d7, -73px 0 0 -10px #40d7d7, -74px 0 0 -10px #40d7d7, -75px 0 0 -10px #40d7d7, -76px 0 0 -10px #40d7d7, -77px 0 0 -10px #40d7d7, -78px 0 0 -10px #40d7d7, -79px 0 0 -10px #40d7d7, -80px 0 0 -10px #40d7d7, -81px 0 0 -10px #40d7d7, -82px 0 0 -10px #40d7d7, -83px 0 0 -10px #40d7d7, -84px 0 0 -10px #40d7d7, -85px 0 0 -10px #40d7d7, -86px 0 0 -10px #40d7d7, -87px 0 0 -10px #40d7d7, -88px 0 0 -10px #40d7d7, -89px 0 0 -10px #40d7d7, -90px 0 0 -10px #40d7d7, -91px 0 0 -10px #40d7d7, -92px 0 0 -10px #40d7d7, -93px 0 0 -10px #40d7d7, -94px 0 0 -10px #40d7d7, -95px 0 0 -10px #40d7d7, -96px 0 0 -10px #40d7d7, -97px 0 0 -10px #40d7d7, -98px 0 0 -10px #40d7d7, -99px 0 0 -10px #40d7d7, -100px 0 0 -10px #40d7d7, -101px 0 0 -10px #40d7d7, -102px 0 0 -10px #40d7d7, -103px 0 0 -10px #40d7d7, -104px 0 0 -10px #40d7d7, -105px 0 0 -10px #40d7d7, -106px 0 0 -10px #40d7d7, -107px 0 0 -10px #40d7d7, -108px 0 0 -10px #40d7d7, -109px 0 0 -10px #40d7d7, -110px 0 0 -10px #40d7d7, -111px 0 0 -10px #40d7d7, -112px 0 0 -10px #40d7d7, -113px 0 0 -10px #40d7d7, -114px 0 0 -10px #40d7d7, -115px 0 0 -10px #40d7d7, -116px 0 0 -10px #40d7d7, -117px 0 0 -10px #40d7d7, -118px 0 0 -10px #40d7d7, -119px 0 0 -10px #40d7d7, -120px 0 0 -10px #40d7d7, -121px 0 0 -10px #40d7d7, -122px 0 0 -10px #40d7d7, -123px 0 0 -10px #40d7d7, -124px 0 0 -10px #40d7d7, -125px 0 0 -10px #40d7d7, -126px 0 0 -10px #40d7d7, -127px 0 0 -10px #40d7d7, -128px 0 0 -10px #40d7d7, -129px 0 0 -10px #40d7d7, -130px 0 0 -10px #40d7d7, -131px 0 0 -10px #40d7d7, -132px 0 0 -10px #40d7d7, -133px 0 0 -10px #40d7d7, -134px 0 0 -10px #40d7d7, -135px 0 0 -10px #40d7d7, -136px 0 0 -10px #40d7d7, -137px 0 0 -10px #40d7d7, -138px 0 0 -10px #40d7d7, -139px 0 0 -10px #40d7d7, -140px 0 0 -10px #40d7d7, -141px 0 0 -10px #40d7d7, -142px 0 0 -10px #40d7d7, -143px 0 0 -10px #40d7d7, -144px 0 0 -10px #40d7d7, -145px 0 0 -10px #40d7d7, -146px 0 0 -10px #40d7d7, -147px 0 0 -10px #40d7d7, -148px 0 0 -10px #40d7d7, -149px 0 0 -10px #40d7d7, -150px 0 0 -10px #40d7d7, -151px 0 0 -10px #40d7d7, -152px 0 0 -10px #40d7d7, -153px 0 0 -10px #40d7d7, -154px 0 0 -10px #40d7d7, -155px 0 0 -10px #40d7d7, -156px 0 0 -10px #40d7d7, -157px 0 0 -10px #40d7d7, -158px 0 0 -10px #40d7d7, -159px 0 0 -10px #40d7d7, -160px 0 0 -10px #40d7d7, -161px 0 0 -10px #40d7d7, -162px 0 0 -10px #40d7d7, -163px 0 0 -10px #40d7d7, -164px 0 0 -10px #40d7d7, -165px 0 0 -10px #40d7d7, -166px 0 0 -10px #40d7d7, -167px 0 0 -10px #40d7d7, -168px 0 0 -10px #40d7d7, -169px 0 0 -10px #40d7d7, -170px 0 0 -10px #40d7d7, -171px 0 0 -10px #40d7d7, -172px 0 0 -10px #40d7d7, -173px 0 0 -10px #40d7d7, -174px 0 0 -10px #40d7d7, -175px 0 0 -10px #40d7d7, -176px 0 0 -10px #40d7d7, -177px 0 0 -10px #40d7d7, -178px 0 0 -10px #40d7d7, -179px 0 0 -10px #40d7d7, -180px 0 0 -10px #40d7d7, -181px 0 0 -10px #40d7d7, -182px 0 0 -10px #40d7d7, -183px 0 0 -10px #40d7d7, -184px 0 0 -10px #40d7d7, -185px 0 0 -10px #40d7d7, -186px 0 0 -10px #40d7d7, -187px 0 0 -10px #40d7d7, -188px 0 0 -10px #40d7d7, -189px 0 0 -10px #40d7d7, -190px 0 0 -10px #40d7d7, -191px 0 0 -10px #40d7d7, -192px 0 0 -10px #40d7d7, -193px 0 0 -10px #40d7d7, -194px 0 0 -10px #40d7d7, -195px 0 0 -10px #40d7d7, -196px 0 0 -10px #40d7d7, -197px 0 0 -10px #40d7d7, -198px 0 0 -10px #40d7d7, -199px 0 0 -10px #40d7d7, -200px 0 0 -10px #40d7d7; }

/****************** 基本 ******************/
html,
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft JhengHei", Roboto, "Helvetica Neue", Arial, sans-serif; }

body {
  font-weight: 400;
  line-height: 1.8;
  color: #777777;
  color: #323232;
  background-color: #ffffff;
  height: 100%;
  position: relative; }

hr {
  border-top: 1px solid #afafaf; }

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000;
  font-weight: 400; }

p {
  margin-bottom: 1.5em; }

a {
  color: #009999;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s; }

a:hover,
a:active,
a:focus,
a:visited {
  color: #006464;
  outline: none;
  text-decoration: none; }

ul {
  list-style-type: none;
  -webkit-padding-start: 0px;
          padding-inline-start: 0px; }

img,
object,
embed,
video {
  max-width: 100%; }

select {
  background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%3E%3Ctitle%3Edown-arrow%3C%2Ftitle%3E%3Cg%20fill%3D%22%23000000%22%3E%3Cpath%20d%3D%22M10.293%2C3.293%2C6%2C7.586%2C1.707%2C3.293A1%2C1%2C0%2C0%2C0%2C.293%2C4.707l5%2C5a1%2C1%2C0%2C0%2C0%2C1.414%2C0l5-5a1%2C1%2C0%2C1%2C0-1.414-1.414Z%22%20fill%3D%22%23000000%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat;
  background-position: right 5px top 50%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }

select::-ms-expand {
  display: none; }

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  background: #000;
  opacity: .2; }

/*
--- 按鈕 btn ---*/
.btn {
  border-radius: 0px; }
  .btn:hover, .btn:active, .btn:focus {
    background: #393e46 !important;
    color: #ffffff;
    outline: none !important; }

.btn.btn-primary {
  background: #009999;
  color: #ffffff;
  border: none !important;
  border: 2px solid transparent !important;
  display: inline-block; }

.btn.btn-outline-primary {
  color: #009999;
  border-color: #009999;
  border: 2px solid #009999 !important; }
  .btn.btn-outline-primary:hover {
    color: #ffffff;
    background-color: #6dc5c5 !important; }

.btn.btn-lg {
  line-height: 1.2; }

@media screen and (max-width: 576px) {
  .btn.btn-lg {
    line-height: 1.5;
    font-size: 1rem; } }

@media screen and (max-width: 576px) and (max-width: 375px) {
  .btn.btn-lg {
    margin-top: .75rem; } }

/****************** 輪播 carousel ******************/
.carousel-indicators li {
  width: 10px;
  height: 10px;
  opacity: .8;
  border-radius: 50px;
  border: 1px solid #dedede;
  background-color: #bbbbbb; }

.carousel-indicators .active {
  background-color: #009999; }

/*
--- 首頁輪播 ---*/
.act-1 {
  background-image: url("../images/top1.jpg") !important; }

.act-2 {
  background-image: url("../images/top2.jpg") !important; }

.act-3 {
  background-image: url("../images/top3.jpg") !important; }

.act-4 {
  background-image: url("../images/top4.jpg") !important; }

@media screen and (max-width: 576px) {
  .act-1 {
    background-image: url("../images/top1_m.jpg") !important; }
  .act-2 {
    background-image: url("../images/top2_m.jpg") !important; }
  .act-3 {
    background-image: url("../images/top3_m.jpg") !important; }
  .act-4 {
    background-image: url("../images/top4_m.jpg") !important; } }

/****************** 導覽列 navbar ******************/
.navbar {
  background-color: #f8f8f8;
  border-bottom: 1px solid #f8f8f8;
  padding: 0; }

.mainNav {
  width: 100%;
  background: #f1f1f1; }
  .mainNav .nav {
    width: 100%;
    -ms-flex-pack: distribute;
        justify-content: space-around; }

/*
--- 聯邦LOGO navbar-brand ---*/
.navbar .navbar-brand {
  padding-right: 0;
  margin-right: 20px;
  margin-left: 20px;
  width: 250px;
  height: 70px;
  background: url(../images/logo_100.jpg) no-repeat 0 50%;
  vertical-align: middle; }
  .navbar .navbar-brand img {
    width: 90%; }
  @media all and (min-width: 768px) and (max-width: 991px) {
    .navbar .navbar-brand {
      background-size: contain;
      width: 210px;
      height: 60px; } }
  @media all and (min-width: 320px) and (max-width: 576px) {
    .navbar .navbar-brand {
      background-size: contain;
      width: 200px;
      height: 50px; }
      .navbar .navbar-brand img {
        width: 80%; } }

.navbar-light .navbar-toggler {
  border: none; }

.navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 153, 153, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); }

.navbar-light .search-toggler {
  display: none;
  font-size: 1.45rem;
  color: rgba(0, 153, 153, 0.7);
  padding: 0.25rem 1rem;
  background-color: transparent; }
  @media screen and (max-width: 767px) {
    .navbar-light .search-toggler {
      display: block; } }

.navbar-light .navbar-toggle,
.navbar-light .search-toggler {
  margin-top: 13px;
  margin-bottom: 15px;
  border: 0px;
  border-radius: 0px; }
  .navbar-light .navbar-toggle:hover, .navbar-light .navbar-toggle:focus,
  .navbar-light .search-toggler:hover,
  .navbar-light .search-toggler:focus {
    background-color: #f8f8f8; }
  .navbar-light .navbar-toggle .icon-bar,
  .navbar-light .search-toggler .icon-bar {
    background-color: #009999; }

.navbar-light .navbar-nav .nav-link {
  color: rgba(0, 0, 0, 0.9); }

.navbar-light .navbar-nav > li > a {
  display: block;
  margin-left: 15px;
  position: relative;
  /*hover 底線*/ }
  .navbar-light .navbar-nav > li > a:hover, .navbar-light .navbar-nav > li > a:focus {
    color: #009999;
    background-color: transparent; }
  .navbar-light .navbar-nav > li > a:before {
    content: '';
    bottom: .4rem;
    left: .5rem;
    position: absolute;
    width: 82%;
    height: 2px;
    background: #009999;
    -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    -o-transition: transform .5s;
    transition: transform .5s;
    transition: transform .5s, -webkit-transform .5s; }
    @media screen and (max-width: 768px) {
      .navbar-light .navbar-nav > li > a:before {
        display: none; } }

.navbar-light .navbar-nav > li:hover > a:before {
  -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
          transform: scaleX(1); }

/* 
--- 導覽列下拉 dropdown-menu ---*/
.dropdown-menu {
  background-color: rgba(255, 255, 255, 0.9);
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); }

/* searchBar 搜尋列 */
.searchTop {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-right: 1.75rem; }
  @media screen and (max-width: 767px) {
    .searchTop {
      margin: 0; } }

.searchBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  @media screen and (max-width: 767px) {
    .searchBar {
      margin-bottom: 10px;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; } }
  .searchBar [type='text'], .searchBar [type='search'] {
    min-width: 80%; }
  .searchBar .btn.btn-primary {
    white-space: nowrap; }
  .searchBar .input-group {
    position: relative;
    min-width: 250px; }
    .searchBar .input-group .form-control {
      font-size: 1rem;
      margin-right: .5rem; }
  .searchBar .input-group-append {
    position: absolute;
    width: 12px;
    height: 34px;
    right: 2.4rem; }
    .searchBar .input-group-append .btn {
      color: #999999;
      line-height: 1.25; }
      .searchBar .input-group-append .btn:hover {
        color: #ffffff; }

/*
--- 使用者資訊 user-login-nav ---*/
.user-login-nav {
  background-color: #d2e4e4; }
  .user-login-nav .user-info {
    padding: .5rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end; }
    @media all and (min-width: 320px) and (max-width: 576px) {
      .user-login-nav .user-info {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; } }
    .user-login-nav .user-info li {
      font-size: .75rem;
      padding-left: 0.75rem; }
  .user-login-nav .login-time {
    color: #ce0000; }

/****************** 版面 Container ******************/
.gridContainer {
  width: 100%;
  clear: none;
  float: none;
  margin-left: auto;
  margin-right: auto;
  background-size: cover; }

@media only screen and (max-width: 768px) {
  .gridContainer {
    width: 100%;
    margin: 0 auto;
    clear: none;
    float: none;
    margin-left: auto;
    background-size: cover; } }

/*
--- 版權宣告footer ---*/
footer {
  background-color: #575757;
  color: #ffffff;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  text-align: center; }
  footer a {
    color: #d2d1d1;
    text-decoration: none; }
    footer a:hover, footer a:focus, footer a:visited {
      text-decoration: none;
      color: #ffffff; }
  footer ul {
    line-height: 1.2; }
  footer .copyright {
    font: 62.5%/1.6em Arial, Helvetica, Verdana, sans-serif;
    color: #ffffff;
    padding-top: 20px;
    padding-bottom: 20px; }
    footer .copyright nav {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; }
      footer .copyright nav h3 {
        font-size: .75rem; }
        footer .copyright nav h3 a:after {
          content: '|';
          padding: 0 5px; }
        footer .copyright nav h3:last-of-type a:after {
          content: ''; }
  footer p {
    margin: 0; }

.footer-copyright {
  min-height: 50px;
  font-weight: 900;
  color: #5E5E5E;
  background: #DDDDDD;
  font-size: .9rem;
  padding-top: 20px;
  padding-bottom: 20px; }
  .footer-copyright p {
    text-align: left;
    color: #000000;
    font-weight: normal;
    margin-bottom: 0; }
    @media screen and (max-width: 576px) {
      .footer-copyright p {
        font-size: 0.75rem; } }
    .footer-copyright p a {
      color: #333333; }
  .footer-copyright > p {
    margin-bottom: .5rem; }
  .footer-copyright .gd_seal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: .5rem; }
    @media screen and (max-width: 768px) {
      .footer-copyright .gd_seal {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 1rem; } }
    .footer-copyright .gd_seal img {
      margin: 0 .75rem; }

.footer-notice {
  font-size: .95rem;
  line-height: 1.5;
  text-align: left; }

/*
--- menu ---*/
.menu ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  padding-top: 2rem;
  border-bottom: 1px solid #dff3f3; }

.menu li {
  width: 25%;
  text-align: center;
  margin-left: 1px;
  margin-right: 1px; }
  .menu li a {
    display: block;
    border-radius: 10px 10px 0 0;
    color: #009999;
    font-size: 1.5rem;
    font-weight: bold; }
    .menu li a:hover {
      background-color: #dff3f3; }
    .menu li a span {
      line-height: 3.5rem;
      vertical-align: middle; }
    .menu li a img {
      max-width: 50px; }
  .menu li .active {
    color: #ffffff;
    background-color: #009999; }
    .menu li .active:hover {
      color: #009999; }

@media all and (min-width: 768px) and (max-width: 991px) {
  .menu ul li a {
    font-size: 1.25rem; } }

@media all and (min-width: 576px) and (max-width: 768px) {
  .menu ul li a {
    font-size: 1.25rem; }
    .menu ul li a:hover {
      background-color: none; }
    .menu ul li a img {
      display: none; } }

@media all and (min-width: 320px) and (max-width: 576px) {
  .menu .container {
    padding-right: 0;
    padding-left: 0; }
  .menu ul {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    height: auto;
    padding-top: 0; }
    .menu ul li {
      width: 50%;
      margin: 0 auto; }
      .menu ul li a {
        border-radius: 0;
        font-size: 1.25rem; }
        .menu ul li a:hover {
          background-color: none; }
        .menu ul li a span {
          line-height: 4rem; }
        .menu ul li a img {
          display: none; } }

/*
--- mainArea ---*/
.mainArea {
  padding-bottom: 1.8rem; }

/*
--- 內文區塊 mainText ---*/
.mainText {
  font-size: 1.5rem;
  color: #545559;
  margin-top: 1rem;
  margin-bottom: 1rem;
  line-height: 3rem;
  border: 1px dotted #767272;
  background-color: #ffffff;
  padding: 1.8rem 1.25rem;
  text-align: center; }
  .mainText .title {
    text-align: center;
    font-weight: bold;
    color: #009999;
    padding-left: 10px;
    padding-right: 10px; }
  .mainText .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    font-size: 1.25rem;
    line-height: 1.8; }

.stepTitle h2 {
  color: #009999;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1.5rem; }

.stepTitle h3 {
  color: #009999;
  font-size: 1.375rem;
  font-weight: 600;
  padding-bottom: 10px;
  border-bottom: 3px solid #e4e2e2;
  margin-bottom: 1rem; }
  @media all and (min-width: 320px) and (max-width: 576px) {
    .stepTitle h3 {
      font-size: 1.125rem;
      padding-bottom: 9px; } }
  .stepTitle h3 span {
    padding-bottom: 8px;
    border-bottom: 3px solid #00859a; }

.stepTitle p {
  font-size: 1.2rem; }
  @media all and (min-width: 320px) and (max-width: 576px) {
    .stepTitle p {
      font-size: 1rem; } }

.red {
  color: #d60000; }

.footer-red {
  color: red; }

.reward {
  color: #d60000;
  margin-right: 3px;
  margin-left: 3px; }

/*
--- 表單 form ---*/
.form-control {
  color: #333333;
  font-size: 1.25rem;
  border-radius: 0;
  padding: 0 0 0 3px;
  border: 1px solid #a9a9a9; }

.main-bg {
  background-size: cover;
  background-attachment: fixed;
  background-position: center top; }

.form-bg {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 2rem 1.75rem; }

.formTitle h4 {
  color: #009999;
  font-weight: bold;
  font-size: 1.25rem;
  background-color: #ffffff;
  border-radius: 50%;
  margin-bottom: 1.25rem; }
  .formTitle h4:after {
    content: '';
    display: block;
    border-bottom: 3px solid #dff3f3;
    padding-top: .5rem; }

.text-muted {
  font-size: 87%; }

/* formList kyc */
ol.formList.kyc {
  padding: 0; }

.formList.kyc li {
  display: block; }
  .formList.kyc li > label {
    width: 100%; }
  .formList.kyc li select.form-control {
    width: 100%;
    max-width: 400px; }

.formList.kyc .form-control {
  display: inline-block; }

/*formList*/
.formList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-left: 0;
  /*手機 email*/
  /* 出現-補充說明項目-addItem */
  /* 活動項目-actItem */
  /* 驗證碼 */ }
  .formList li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 2rem; }
  .formList label {
    font-size: 1.25rem;
    margin-right: .75rem;
    margin-bottom: 0;
    color: #009999;
    font-weight: bold; }
    .formList label.min-w {
      min-width: 12rem;
      text-align: right; }
  .formList select {
    margin-left: 10px;
    margin-right: 5px;
    min-width: 60px; }
    .formList select.form-control {
      padding: .37rem 1.5rem .37rem .3rem; }
    .formList select:first-of-type {
      margin-left: 0; }
  .formList textarea.form-control {
    width: 100%;
    height: 200px; }
  .formList .form-check-label,
  .formList .custom-control-label {
    font-size: 1rem;
    color: #000000;
    font-weight: normal; }
  .formList a {
    display: inline-block;
    line-height: 1rem; }
  .formList .btn-modal {
    background: none;
    border: 0;
    padding: 0; }
    .formList .btn-modal:hover i {
      color: #009999; }
  .formList i {
    font-size: 1.25rem;
    color: #9e9e9e;
    padding-left: 5px; }
  .formList .form-control {
    padding: .37rem .3rem;
    width: auto; }
  .formList .form-control.m-wd-50 {
    min-width: 50%; }
    @media screen and (max-width: 768px) {
      .formList .form-control.m-wd-50 {
        min-width: 100%; } }
  .formList .form-row .form-control {
    width: 100%; }
  .formList .addItem {
    position: relative;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start; }
    .formList .addItem label {
      font-size: 1rem;
      text-align: left;
      color: #323232;
      font-weight: normal; }
  .formList .actItem {
    background-color: #e7f3f3;
    border: 1px solid #abd6d6;
    padding: 1.5rem; }
    .formList .actItem h3 {
      color: #009999;
      font-weight: bold;
      font-size: 1.25rem; }
  .formList .inCaptcha {
    margin-left: 8px; }
    .formList .inCaptcha i {
      font-size: .75rem;
      margin-right: .25rem; }
    .formList .inCaptcha img {
      max-height: 44px; }

@media all and (min-width: 576px) and (max-width: 768px) {
  .formTitle h4 {
    padding-top: 1rem;
    margin-bottom: 1rem; }
  .formList li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-bottom: 1rem; }
    .formList li select:first-of-type {
      margin-left: 0;
      min-width: 80px; }
    .formList li label {
      text-align: left; }
    .formList li select {
      margin-left: 5px;
      margin-right: 3px; }
    .formList li .form-control {
      padding: 0.37rem 0.3rem; } }

@media all and (min-width: 320px) and (max-width: 576px) {
  .form-bg {
    padding: 2rem 1rem 1rem; }
  .formList li select:first-of-type {
    width: 100%;
    min-width: auto;
    max-width: none; } }

/* 備註-注意事項 */
.memo {
  text-align: justify;
  font-size: 0.95rem;
  list-style-type: none;
  padding: 15px 5px 0; }
  @media all and (min-width: 320px) and (max-width: 576px) {
    .memo {
      font-size: .8rem; } }

/* formRange */
/*formLogin*/
.formLogin {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
  .formLogin label {
    min-width: 4rem; }
  .formLogin .form-group .form-control {
    max-width: 15rem; }
  .formLogin .inId .form-control {
    width: 17.5rem;
    max-width: none; }
  .formLogin .inDate {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    min-width: 18.2rem; }
  .formLogin .inCaptcha .form-control {
    min-width: none;
    max-width: 10.5rem; }
  .formLogin .inCaptcha i {
    font-size: .75rem;
    margin-right: .25rem; }
  .formLogin .inSelect .form-control {
    width: 18.2rem;
    max-width: none;
    padding: .37rem 1.5rem .37rem .3rem; }
  .formLogin .inSelect select + select {
    margin-left: 0;
    margin-top: 1rem; }
  .formLogin img {
    max-width: 120px;
    height: 44px;
    padding-left: 3px; }
  .formLogin .staff {
    min-width: 18.2rem;
    font-size: 1.25rem;
    color: #333333; }

/* 改變表格 altTable */
.caption h3 {
  color: #009999;
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 1rem; }

.caption span {
  padding: 0 5px; }

.altTable {
  width: 100%;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: 1px solid #d8d8d8;
  border-collapse: collapse;
  margin-bottom: 2rem;
  table-layout: fixed; }

.altTable tr {
  border-bottom: 1px solid #d8d8d8; }

.altTable th,
.altTable td {
  border-right: 1px solid #d8d8d8;
  padding: 10px 3px;
  text-align: center; }

.altTable thead th {
  color: #009999;
  background-color: #f4f4f4;
  vertical-align: middle; }

/* 
rwd-table */
.rwd-table tbody td[data-title="取消"] .form-check-input,
.rwd-table tbody td[data-title="刪除"] .form-check-input {
  margin-left: -.5rem; }

.rwd-table tfoot {
  border-top: 2px solid #e2e2e2;
  background-color: #f9faf8; }

.rwd-table tfoot td[data-title="總計"] {
  font-weight: bold; }

@media screen and (max-width: 991px) {
  .rwd-table thead th[scope="col"] {
    display: none; }
  .rwd-table tfoot {
    border-top: 0;
    background-color: transparent; }
  .rwd-table tbody td,
  .rwd-table tfoot td {
    display: block;
    text-align: left;
    padding: 0px 3px 3px;
    padding-left: 5.8em;
    text-indent: -5em; }
  .rwd-table tbody td:before,
  .rwd-table tfoot td:before {
    content: attr(data-title) "：";
    color: #838383;
    font-weight: bold; }
  .rwd-table tbody td:nth-child(odd),
  .rwd-table tfoot td:nth-child(odd) {
    background-color: #f4f4f4; }
  .rwd-table tbody td:first-child {
    color: #009999;
    font-weight: bold;
    background-color: #eeeeee;
    padding: 8px;
    padding-left: 12px;
    text-indent: 0;
    margin-bottom: 0.25rem; }
  .rwd-table tbody td.card {
    width: 100%;
    padding: 0;
    text-indent: 0;
    text-align: center;
    border: transparent; }
    .rwd-table tbody td.card:before {
      display: none; }
    .rwd-table tbody td.card .btn {
      font-size: 0.5rem;
      line-height: 1.2;
      width: 100%;
      margin-top: 0;
      background-color: #e0e0e0; }
      .rwd-table tbody td.card .btn:hover, .rwd-table tbody td.card .btn:active, .rwd-table tbody td.card .btn:focus {
        color: #333333;
        background-color: #e0e0e0 !important; }
      .rwd-table tbody td.card .btn i {
        max-height: 12px; }
  .rwd-table tbody td[data-title="基金名稱"]:before {
    content: '';
    color: #ffffff;
    width: auto; }
  .rwd-table tbody td[data-title="基金淨值"]:before {
    display: none; }
  .rwd-table tbody td[data-title="取消"],
  .rwd-table tbody td[data-title="刪除"],
  .rwd-table tbody td[data-title="選取"] {
    text-align: right;
    border-top: 3px solid #009999; }
    .rwd-table tbody td[data-title="取消"]:before,
    .rwd-table tbody td[data-title="刪除"]:before,
    .rwd-table tbody td[data-title="選取"]:before {
      content: '';
      color: #ffffff;
      width: auto; }
    .rwd-table tbody td[data-title="取消"]:after,
    .rwd-table tbody td[data-title="刪除"]:after,
    .rwd-table tbody td[data-title="選取"]:after {
      content: attr(data-title) "";
      margin-left: 1.5rem; }
    .rwd-table tbody td[data-title="取消"] .form-check-input,
    .rwd-table tbody td[data-title="刪除"] .form-check-input,
    .rwd-table tbody td[data-title="選取"] .form-check-input {
      margin-left: .3rem; }
  .rwd-table tfoot td[data-title="總計"] {
    background-color: #d2e4e4;
    text-align: center;
    padding: 8px;
    text-indent: 0; }
    .rwd-table tfoot td[data-title="總計"]:before {
      content: ''; }
  .altTable .text-md-right {
    text-align: left !important; }
  .altTable tbody td:last-child {
    padding-right: 0; } }

/*checkForm*/
.checkForm {
  margin-bottom: 3rem; }
  .checkForm a {
    display: inline-block;
    line-height: 1rem; }
    .checkForm a:hover i {
      color: #009999; }
  .checkForm i {
    font-size: 1.25rem;
    color: #9e9e9e;
    padding-left: 5px; }

/* 斷行 formWarp */
.formList .formWarp {
  display: block; }
  .formList .formWarp > label {
    text-align: left; }
  .formList .formWarp label.custom-control-label {
    font-size: 1rem;
    text-align: left;
    color: #323232;
    font-weight: normal; }

/* apply申請表單 */
.apply .formList {
  /* 帳戶 */ }
  .apply .formList > li {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
  .apply .formList select.form-control {
    padding: .37rem 1.5rem .37rem .3rem; }
  .apply .formList label {
    min-width: 12.5rem;
    text-align: left; }
  .apply .formList .custom-radio.cciTop .custom-control-label:before, .apply .formList .custom-radio.cciTop .custom-control-label:after {
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%); }
  .apply .formList .inOsn .custom-control-label {
    min-width: none; }
  .apply .formList .inManey {
    position: relative; }
    .apply .formList .inManey:after {
      content: '萬元';
      position: absolute;
      text-align: right;
      font-size: .95rem; }
  @media (max-width: 1199px) {
    .apply .formList .inBank label {
      width: 100%;
      min-width: none;
      display: block; } }

@media (max-width: 1199px) and (max-width: 991px) {
  .apply .formList .inBank select {
    width: 100%;
    min-width: auto;
    max-width: none;
    margin-left: 0; }
  .apply .formList .inBank select + select {
    margin-top: 1rem; } }

@media (min-width: 768px) {
  .apply .apply .form-control {
    width: calc(100% - 200px); }
  .apply .apply label {
    width: 100%; } }

.apply .text-muted {
  color: #e00000 !important; }
  .apply .text-muted i {
    vertical-align: middle;
    width: 0;
    height: 0;
    font-size: 0;
    border-left: 6px solid #777777;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent; }

/* 地址 */
.address {
  margin-top: 0.5rem; }
  .address .form-control {
    width: 100%;
    margin-bottom: 1rem; }
  .address .addressCol {
    max-width: 40px; }

.formList .address select:first-of-type {
  min-width: 120px; }

.labelCheck {
  font-size: 1.25rem; }

/* 公告 errAlert */
.errAlert {
  border: 1px solid #009999;
  background-color: #f4ffff;
  border-radius: 5px;
  padding: 1rem;
  margin-bottom: 3rem; }
  .errAlert h3 {
    font-size: 1.25rem;
    font-weight: bold;
    color: #009999;
    letter-spacing: 4px;
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid #9e9e9e; }
  .errAlert .fixY {
    height: 300px; }
  .errAlert .errMsg-date:after {
    content: '';
    padding-right: 5px; }
  @media only screen and (max-width: 768px) {
    .errAlert .fixY {
      height: auto; }
    .errAlert .errMsg li {
      border-bottom: 1px dotted #909090;
      margin-bottom: .25rem; }
    .errAlert .errMsg-date {
      display: block; } }

/* 投資宣導專區 lawInfo */
.lawInfoGZ .fixY {
  height: 212px; }

.lawInfoSF .fixY {
  height: 320px; }

@media only screen and (max-width: 768px) {
  .lawInfoGZ .fixY,
  .lawInfoSF .fixY {
    height: auto; } }

/* 動態鍵盤 */
#dyKey.input-group-btn {
  position: relative;
  font-size: 0;
  white-space: nowrap; }
  #dyKey.input-group-btn:after {
    content: '';
    display: block;
    clear: both; }
  #dyKey.input-group-btn i {
    font-size: 2rem;
    color: #009999;
    margin-left: 3px; }
  #dyKey.input-group-btn a img {
    min-width: 20px;
    margin-left: 15px;
    margin-right: 20px; }

.show-keyboard {
  background-position: 0 100%;
  text-indent: -99999px;
  cursor: pointer;
  background-image: url("../images/dykey/keyboard.png"); }

.keyBg {
  border-radius: 2px;
  width: 8%;
  height: 36px;
  cursor: pointer;
  background-color: #ffffff;
  background: #ffffff;
  -webkit-box-shadow: 0px 2px 0px 1px #AAA;
          box-shadow: 0px 2px 0px 1px #AAA;
  margin: 1px; }

@media only screen and (max-width: 375px) {
  .keyBg {
    width: 7%; }
    .keyBg:hover {
      background: yellow; }
    .keyBg:active {
      background: lightgreen;
      -webkit-box-shadow: 0px 2px 0px 1px #01859a;
              box-shadow: 0px 2px 0px 1px #01859a; } }

.keyTitleBar {
  text-align: center;
  padding: 10px 20px 0;
  color: #373737; }
  .keyTitleBar:after {
    content: '';
    display: block;
    clear: both; }
  .keyTitleBar label {
    float: left;
    color: #333333;
    font-weight: bold;
    text-align: left; }
  .keyTitleBar .btn {
    float: right; }

#dyKeyPanel {
  position: absolute;
  display: none;
  background-color: #d2e9ec;
  border-radius: 10px;
  margin-left: 0;
  margin-right: 0;
  padding: 0 0 10px 0;
  max-width: 475px;
  min-width: 260px;
  z-index: 5;
  top: 24%;
  left: 25%; }

#dyKeyClose {
  padding: 6px 10px;
  border: none;
  background-color: #ffffff; }

#dyKeyClose.btn:hover {
  background-color: #00859a !important; }

#keyAlter {
  padding: 0;
  width: 48px;
  height: 48px;
  background-color: #90ee90;
  border-color: #ffffff;
  border-width: 2px;
  border-radius: 10%; }

#keyAlterIcon {
  width: 100%;
  height: 100%; }

.txt-group {
  border: 2px solid #e4e2e2;
  padding: 1rem; }
  .txt-group p,
  .txt-group ul {
    margin-bottom: .5rem; }
  .txt-group .agree {
    background-color: #eeeeee;
    padding: 1rem 1rem 1.25rem; }

/* 風險評估 riskCard */
.riskArea {
  margin: 1.5rem auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  @media only screen and (max-width: 991px) {
    .riskArea {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; } }
  .riskArea .active {
    font-weight: bold;
    border: 2px solid #009999;
    position: relative; }
    .riskArea .active:before {
      content: "";
      background: url(../images/ok-wh.png) no-repeat center;
      background-size: contain;
      background-color: #7cd8d4;
      position: absolute;
      top: -10px;
      left: -10px;
      width: 40px;
      height: 40px;
      border: 2px solid #009999;
      border-radius: 50%; }
    .riskArea .active .card-title {
      font-weight: bold;
      background-color: #009999; }
      .riskArea .active .card-title h2,
      .riskArea .active .card-title h2 .score {
        color: #ffffff; }
    .riskArea .active h3 {
      font-weight: bold;
      color: #009999;
      background-color: #d2e4e4; }
  .riskArea .card {
    width: 33.333%;
    margin: .5rem;
    padding: .5rem;
    text-align: center; }
    @media only screen and (max-width: 991px) {
      .riskArea .card {
        width: 100%; } }
  .riskArea .card-title {
    padding: .5rem 0;
    background-color: #eeeeee; }
    .riskArea .card-title h3 {
      margin-top: .5rem;
      background-color: #ffffff; }
  .riskArea h2 {
    font-size: 1.5rem;
    font-weight: bold;
    color: #666666; }
    .riskArea h2 .score {
      display: block;
      font-size: 1rem;
      line-height: 2;
      color: #727272; }
  .riskArea h3 {
    font-size: 1rem;
    color: #666666;
    padding: 5px;
    background-color: #eeeeee;
    border-radius: 2rem;
    max-width: 150px;
    margin: 0 auto .5rem; }
  .riskArea p {
    margin-bottom: 1em; }

.rise {
  color: #ff0000; }

.fill {
  color: #008016; }

.infoArea {
  margin-bottom: 2rem;
  /* txt */ }
  .infoArea .infoTitle {
    margin-bottom: 1.5rem; }
    .infoArea .infoTitle h2 {
      color: #009999;
      font-size: 1.5rem;
      font-weight: bold; }
    .infoArea .infoTitle h3 {
      color: #009999;
      font-size: 1rem; }
    .infoArea .infoTitle .focus {
      font-size: 0.75rem;
      color: #ffffff;
      background-color: #f44336;
      padding: 3px 10px;
      margin-left: 5px;
      vertical-align: middle;
      white-space: nowrap; }
  .infoArea .infoDataList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    margin-bottom: 2rem;
    padding-left: 0; }
    .infoArea .infoDataList .item {
      width: 25%;
      min-height: 75px;
      padding: .5rem .75rem; }
      .infoArea .infoDataList .item:first-of-type {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1; }
      .infoArea .infoDataList .item:last-of-type {
        width: 15%;
        padding-top: 20px;
        text-align: center; }
      .infoArea .infoDataList .item h2 {
        font-size: 2rem;
        margin: 0; }
      .infoArea .infoDataList .item p {
        font-size: 0.75rem;
        margin: 0; }
      .infoArea .infoDataList .item .btn-modal {
        background: none;
        border: 0;
        padding: 0; }
        .infoArea .infoDataList .item .btn-modal i {
          font-size: 1rem;
          color: #9e9e9e; }
      .infoArea .infoDataList .item .crr {
        font-size: 0.75rem;
        color: #ffffff;
        background-color: #666666;
        padding: 3px 10px;
        vertical-align: middle;
        white-space: nowrap; }
      .infoArea .infoDataList .item + .item {
        border-left: 1px solid #cccccc; }
      .infoArea .infoDataList .item .btn {
        color: #fff;
        border-radius: 0;
        background-color: #009999; }
    @media only screen and (max-width: 991px) {
      .infoArea .infoDataList .item {
        font-size: .85rem;
        padding: .5rem .5rem; }
        .infoArea .infoDataList .item h2 {
          font-size: 1.75rem; }
        .infoArea .infoDataList .item .crr {
          padding: 3px 5px;
          margin-left: 5px; } }
    @media only screen and (max-width: 768px) {
      .infoArea .infoDataList {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
        .infoArea .infoDataList .item {
          width: 100%;
          min-height: auto;
          padding: 0 .75rem; }
          .infoArea .infoDataList .item:last-of-type {
            width: 100%;
            padding-top: 0; }
          .infoArea .infoDataList .item + .item {
            border: 0; }
          .infoArea .infoDataList .item .btn {
            width: 100%; } }
    @media only screen and (max-width: 576px) {
      .infoArea .infoDataList .item {
        font-size: .9rem;
        padding: 0; } }
  .infoArea .listNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0; }
  .infoArea .list-group {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    border-bottom: 1px solid #e4e3e3;
    padding: 0 15px; }
  .infoArea .list-group-item {
    font-size: .85rem;
    text-align: center;
    font-weight: bold;
    background-color: #f8f9fa;
    border: transparent;
    border-radius: 5px 5px 0 0; }
  .infoArea .list-group-item.active {
    background-color: #009999;
    border-radius: 5px 5px 0 0; }
  .infoArea .infoBtn {
    padding: 0;
    -ms-flex-item-align: center;
        align-self: center;
    text-align: center; }
  .infoArea ol.txt {
    -webkit-padding-start: 1em;
            padding-inline-start: 1em; }
  .infoArea ul.txt li {
    margin-bottom: .75rem; }
  .infoArea .txt h3 {
    font-size: 1.175rem;
    font-weight: bold; }
  .infoArea .txt h4 {
    font-size: 1rem; }
  .infoArea .txt-list {
    padding-left: 0; }
    .infoArea .txt-list .txt-list-item {
      margin-bottom: .25rem; }
      .infoArea .txt-list .txt-list-item:hover {
        background-color: rgba(0, 0, 0, 0.075); }
      .infoArea .txt-list .txt-list-item a {
        color: initial; }
        .infoArea .txt-list .txt-list-item a:hover {
          color: #009999; }
      .infoArea .txt-list .txt-list-item a:before {
        font-family: "Font Awesome 5 free";
        font-weight: 900;
        content: "\f56d";
        color: #006464;
        margin-left: -2rem;
        padding: 0 10px; }
    .infoArea .txt-list h4.txt-list-title {
      font-size: 1rem;
      line-height: 1.5; }
  .infoArea .txt-list.list-align {
    padding-left: 1.5rem; }
  @media screen and (max-width: 767px) {
    .infoArea .listNav {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
    .infoArea .list-group {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      padding-right: 0; }
    .infoArea .list-group-item {
      width: 50%;
      max-height: 50px; }
    .infoArea .list-group-item.list-group-3-item {
      width: 33.3333%; }
    .infoArea .infoBtn {
      margin: 0 auto .75rem;
      -webkit-box-ordinal-group: 0;
          -ms-flex-order: -1;
              order: -1; }
      .infoArea .infoBtn .btn {
        width: 100%; }
    .infoArea .listWhAuto .list-group-item {
      width: auto;
      padding: .75rem; } }
  @media only screen and (max-width: 576px) {
    .infoArea {
      font-size: .75rem; }
      .infoArea .infoTitle {
        text-align: left; }
        .infoArea .infoTitle h2 {
          font-size: 1.25rem; }
        .infoArea .infoTitle h3 {
          font-size: .8rem; }
      .infoArea .list-group {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center; }
      .infoArea .list-group-item {
        font-size: .75rem; }
      .infoArea .txt-list .txt-list-item {
        margin-bottom: .75rem; } }
  .infoArea .fixY {
    height: 295px; }
    @media only screen and (max-width: 991px) {
      .infoArea .fixY {
        height: 200px; } }
    @media only screen and (max-width: 768px) {
      .infoArea .fixY {
        height: auto; } }
  .infoArea .table th,
  .infoArea .table td {
    padding: 0.25rem; }
  .infoArea .table thead th {
    text-align: center;
    vertical-align: middle;
    color: #009999;
    background-color: #dff3f3; }
  .infoArea .table a {
    color: #000000; }
  .infoArea .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.03); }
  .infoArea .list-dw-btn .btn {
    margin-bottom: .5rem; }

.mainFooter {
  background-color: #efefef;
  padding: 2em 0; }
  .mainFooter .htList, .mainFooter .focusList {
    width: 48%;
    margin: 0 5px;
    padding: 1rem;
    background-color: #fff; }
    @media screen and (max-width: 767px) {
      .mainFooter .htList, .mainFooter .focusList {
        width: 100%;
        margin: 0 0 20px 0; } }
    .mainFooter .htList .item, .mainFooter .focusList .item {
      padding-bottom: 0.5rem;
      margin-bottom: .5rem;
      border-bottom: 1px solid #ebebeb; }
  .mainFooter h3 {
    font-size: 1.25rem;
    font-weight: bold; }
  .mainFooter p {
    font-size: .9rem;
    margin-bottom: 0; }

.newsArea {
  /* listWhAuto 分頁寬度自動*/
  /* Page navigation 頁數 */ }
  .newsArea .list-group {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row; }
  .newsArea .list-group-item {
    text-align: center;
    border: 0px; }
  .newsArea .list-group-item.active {
    font-weight: bold;
    background-color: #009999;
    border-radius: 5px 5px 0 0; }
  .newsArea .errAlert {
    border-radius: 0 0 5px 5px; }
  .newsArea .moreBtn {
    text-align: center; }
  .newsArea .btn {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #009999;
    background-color: #dff3f3;
    border-radius: 10px; }
    .newsArea .btn:hover {
      color: #ffffff;
      background-color: #009999 !important; }
  .newsArea .listWhAuto {
    display: inline; }
    .newsArea .listWhAuto .list-group-item {
      display: inline-block;
      padding: .5rem .75rem; }
  @media screen and (max-width: 767px) {
    .newsArea .listWhAuto .list-group-item {
      width: auto;
      padding: .75rem; } }
  .newsArea nav .pagination {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  .newsArea nav .page-link {
    margin: 0 .2rem;
    padding: .5rem .8rem;
    border-radius: 5px;
    border: 1px solid transparent;
    background-color: transparent; }
  .newsArea nav .page-item.active .page-link {
    background-color: #9e9e9e;
    border-color: #9e9e9e; }

/* 焦點基金 */
.focusArea {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .focusArea .item {
    width: 50%;
    padding: 10px;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden; }
    .focusArea .item:before {
      /*content: '▶';*/
      font-weight: bold;
      color: #1a7b7b;
      text-align: center;
      position: absolute;
      width: 30px;
      height: 30px;
      top: 7px;
      right: 10px;
      -webkit-transform: translateX(-10px);
          -ms-transform: translateX(-10px);
              transform: translateX(-10px);
      opacity: 0;
      -webkit-transition: all .3s;
      -o-transition: all .3s;
      transition: all .3s; }
    .focusArea .item:hover {
      border-radius: 5px;
      border: 1px solid #009999;
      text-decoration: none;
      background: #f4ffff; }
      .focusArea .item:hover::before {
          text-decoration: none;
        -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
                transform: translateX(0);
        opacity: 1; }
    .focusArea .item h2 {
      font-size: 1.25rem;
      font-weight: bold;
      color: #009999; }
    .focusArea .item p {
      color: #000; }

@media only screen and (max-width: 768px) {
  .focusArea .item {
    width: 100%;
    border: none;
    border-bottom: 1px solid #009999;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    margin-bottom: .5rem; }
    .focusArea .item:before {
      opacity: 1;
      -webkit-transform: translateX(0);
          -ms-transform: translateX(0);
              transform: translateX(0); }
    .focusArea .item:hover {
      border-radius: 0;
      border: none;
      border-bottom: 1px solid #009999;
      background-color: transparent; }
    .focusArea .item:last-of-type {
      margin-bottom: 1.5rem; }
  .focusArea h2 {
    font-size: 1rem; }
  .focusArea p {
    margin-bottom: .5rem; } }

@media only screen and (max-width: 576px) {
  .focusArea .item:before {
    display: none; } }

.linkArea .btn {
  margin-bottom: .25rem; }

/* 常見問題-文字區塊 */
.txtArea {
  text-align: justify;
  /* 卡片 */ }
  .txtArea .card {
    font-size: 1rem;
    margin-bottom: 1.25rem; }
    .txtArea .card .stepTitle h3 {
      font-size: 1.25rem; }
    .txtArea .card [aria-expanded="false"]:after,
    .txtArea .card [aria-expanded="true"]:after {
      display: inline;
      font-family: "Font Awesome 5 free";
      font-size: 1.25rem;
      color: #009999;
      position: absolute;
      top: 1.5rem;
      right: 1rem;
      margin-top: -10px; }
    .txtArea .card [aria-expanded="false"]:after {
      content: '\f107'; }
    .txtArea .card [aria-expanded="true"]:after {
      content: '\f106'; }
  .txtArea .card-header {
    font-size: 1.25rem;
    margin-bottom: 0; }
    .txtArea .card-header[data-toggle="collapse"] {
      cursor: pointer;
      padding-right: 2rem; }
  @media only screen and (max-width: 576px) {
    .txtArea .card {
      font-size: .75rem; }
      .txtArea .card[data-toggle="collapse"] {
        padding-right: 1.25rem; }
      .txtArea .card .stepTitle h3 {
        font-size: 1.1rem; }
      .txtArea .card [aria-expanded="false"]:after,
      .txtArea .card [aria-expanded="true"]:after {
        font-size: 1rem;
        right: .75rem; }
      .txtArea .card .txt-list li {
        margin-bottom: .5rem; }
      .txtArea .card .txt-list .txt-list-title {
        font-size: .75rem;
        line-height: 1.2; }
    .txtArea .card-header {
      font-size: 1rem;
      padding: .75rem 1rem; }
    .txtArea .card-body {
      padding: .5rem 1rem; } }

/* 流程圖 flowChart */
/* 基金總覽 fund */
.formList.fund {
  padding: .75rem .5rem;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background-color: #f4f4f4; }
  .formList.fund .form-control,
  .formList.fund label,
  .formList.fund .btn {
    font-size: 1rem; }
  .formList.fund .btn-primary {
    background: #009999;
    color: #ffffff;
    border-radius: 0;
    line-height: 1.15; }
  .formList.fund .fundResult {
    font-weight: bold; }
    .formList.fund .fundResult p {
      margin: 0; }
    .formList.fund .fundResult span {
      font-size: 1.25rem;
      padding: 0 .25rem; }
  @media only screen and (max-width: 576px) {
    .formList.fund .btn {
      width: 100%;
      margin-top: .5rem; } }
  @media only screen and (max-width: 1024px) {
    .formList.fund {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; }
      .formList.fund label {
        min-width: 80px; } }
  .formList.fund li {
    margin-bottom: 0; }
    @media only screen and (max-width: 1024px) {
      .formList.fund li {
        margin-bottom: .5rem; } }
    @media only screen and (max-width: 768px) {
      .formList.fund li {
        -webkit-padding-start: 1.5em;
                padding-inline-start: 1.5em; } }
    @media only screen and (max-width: 576px) {
      .formList.fund li {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-padding-start: .5em;
                padding-inline-start: .5em; }
        .formList.fund li .form-control {
          width: 100%; } }
    .formList.fund li select.form-control {
      padding: .37rem 1.5rem .37rem .3rem; }
  .formList.fund .custom-control {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-right: .5rem; }
    .formList.fund .custom-control > .custom-control {
      padding-left: 0; }
      .formList.fund .custom-control > .custom-control:last-child:before {
        content: "-";
        margin-right: .5rem; }
    @media only screen and (max-width: 1199px) {
      .formList.fund .custom-control .btn {
        display: block;
        margin: 0 auto; } }
    @media only screen and (max-width: 768px) {
      .formList.fund .custom-control {
        display: inline-block;
        padding: .37rem 1.5rem .37rem .3rem; }
        .formList.fund .custom-control > .custom-control {
          padding-left: 0;
          margin-bottom: .5rem; } }

.formList.fundRange {
  font-size: .85rem;
  padding: .5rem 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .formList.fundRange label, .formList.fundRange i,
  .formList.fundRange .form-control {
    font-size: .85rem; }
  .formList.fundRange li {
    margin-bottom: 0; }
  .formList.fundRange input[type="date"] {
    min-width: 140px;
    margin-right: 5px; }
    .formList.fundRange input[type="date"] + input[type="date"] {
      margin-left: 5px; }
  .formList.fundRange .rangeSelect {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .formList.fundRange .rangeSelect .item {
      color: #a5a5a5;
      margin-right: 5px; }
      .formList.fundRange .rangeSelect .item + .item {
        padding-left: 5px;
        border-left: 1px solid #cccccc; }
    .formList.fundRange .rangeSelect .item.checked {
      font-weight: bold; }
      .formList.fundRange .rangeSelect .item.checked a {
        color: #333; }
  @media only screen and (max-width: 1199px) {
    .formList.fundRange {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; }
      .formList.fundRange li {
        margin-bottom: 1rem; }
      .formList.fundRange label {
        width: 60px; } }
  @media only screen and (max-width: 768px) {
    .formList.fundRange .rangeSelect {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
    .formList.fundRange li {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
    .formList.fundRange label {
      width: 100%; } }
  @media only screen and (max-width: 411px) {
    .formList.fundRange input[type="date"] {
      margin-right: 5px;
      margin-bottom: 5px; } }
  @media only screen and (max-width: 320px) {
    .formList.fundRange input[type="date"] + input[type="date"] {
      margin-left: 0; } }

@media only screen and (max-width: 1199px) {
  .formList.fundRecord {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    .formList.fundRecord li {
      margin-bottom: .5rem; }
    .formList.fundRecord .form-control {
      width: 100%; } }

@media only screen and (max-width: 768px) {
  .formList.fundRecord li {
    -webkit-padding-start: 0;
            padding-inline-start: 0; } }

.altTable.altTable-fund i {
  font-size: 1.5rem;
  vertical-align: middle; }

.altTable.altTable-fund td {
  vertical-align: middle; }

.altTable.altTable-fund tbody td[data-title="季推薦"] {
  color: #ffc107; }

.altTable.altTable-fund tbody td[data-title="定時定額"] {
  color: #7dcece; }
  @media screen and (max-width: 991px) {
    .altTable.altTable-fund tbody td[data-title="定時定額"] i {
      text-indent: 0; } }

@media screen and (max-width: 991px) {
  .altTable.altTable-fund tbody td[data-title="季推薦"] {
    text-align: center;
    background-color: #ffffff; }
  .altTable.altTable-fund tbody td[data-title="月報"] {
    text-align: center; }
  .altTable.altTable-fund tbody td[data-title="季推薦"]:before,
  .altTable.altTable-fund tbody td[data-title="月報"]:before,
  .altTable.altTable-fund tbody td[data-title="定時定額"]:before {
    content: ''; }
  .altTable.altTable-fund tbody td[data-title="季推薦"] i:after,
  .altTable.altTable-fund tbody td[data-title="月報"] i:after,
  .altTable.altTable-fund tbody td[data-title="定時定額"] i:after {
    font-size: 1rem;
    margin-left: .5rem; }
  .altTable.altTable-fund tbody td[data-title="季推薦"] i:after {
    content: '季推薦'; }
  .altTable.altTable-fund tbody td[data-title="月報"] i {
    text-indent: 0;
    font-size: 1rem; }
    .altTable.altTable-fund tbody td[data-title="月報"] i:after {
      content: '月報'; }
  .altTable.altTable-fund tbody td[data-title="定時定額"] i {
    text-indent: 0;
    font-size: 1rem; }
    .altTable.altTable-fund tbody td[data-title="定時定額"] i:after {
      content: '定時定額'; } }

.altTable.altTable-fund tbody td[data-title="基金名稱"] {
  text-align: left; }
  .altTable.altTable-fund tbody td[data-title="基金名稱"] a {
    color: inherit; }
    .altTable.altTable-fund tbody td[data-title="基金名稱"] a:hover {
      color: #009999; }
  @media screen and (max-width: 991px) {
    .altTable.altTable-fund tbody td[data-title="基金名稱"] {
      padding-left: .75rem;
      text-indent: 0; } }

/*
基金篩選 optionList */
.option {
  display: block; }
  @media screen and (max-width: 577px) {
    .option {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      background: #fff;
      -webkit-box-shadow: 0 0 20px #ccc;
              box-shadow: 0 0 20px #ccc;
      padding: .75rem;
      z-index: 2;
      -webkit-transform: translateX(-600px);
          -ms-transform: translateX(-600px);
              transform: translateX(-600px);
      -webkit-transition: -webkit-transform .6s;
      transition: -webkit-transform .6s;
      -o-transition: transform .6s;
      transition: transform .6s;
      transition: transform .6s, -webkit-transform .6s; } }
  .option.show {
    -webkit-transform: translateX(0px);
        -ms-transform: translateX(0px);
            transform: translateX(0px); }
  .option .itemBtn {
    display: none;
    text-align: center;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 10px #808080;
            box-shadow: 0 0 10px #808080;
    margin-top: 3px; }
    @media screen and (max-width: 577px) {
      .option .itemBtn {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0; }
        .option .itemBtn .btn {
          width: 90%;
          margin: 20px 15px; } }

.optionBtn-close {
  display: none;
  color: #fff;
  text-align: right; }
  @media screen and (max-width: 577px) {
    .optionBtn-close {
      display: block; } }

.optionBtn {
  display: none;
  position: fixed;
  top: 210px;
  right: 0;
  text-align: center; }
  @media screen and (max-width: 577px) {
    .optionBtn {
      display: block;
      z-index: 2; } }
  .optionBtn i {
    display: block;
    font-weight: normal;
    color: #fff; }

.optionList {
  overflow: auto;
  padding-left: 0; }
  @media screen and (max-width: 577px) {
    .optionList {
      height: 600px;
      padding-bottom: 120px; } }
  .optionList .item {
    height: auto; }
    .optionList .item h3 {
      font-size: 1rem; }
    .optionList .item + .item {
      border-top: 1px solid #cccccc;
      margin-top: .5rem;
      padding-top: .5rem; }
    .optionList .item input[type="radio"],
    .optionList .item input[type="checkbox"] {
      display: none;
      -webkit-appearance: none;
         -moz-appearance: none;
              appearance: none;
      margin: 0;
      -webkit-box-sizing: inherit;
              box-sizing: inherit;
      border: none;
      background-color: inherit;
      padding: 0;
      cursor: pointer; }
      .optionList .item input[type="radio"] + span,
      .optionList .item input[type="checkbox"] + span {
        display: inline-block;
        cursor: pointer;
        color: #2bb4b4;
        background-color: #d2eaea;
        border: 1px solid #2bb4b4;
        padding: 3px 10px; }
      .optionList .item input[type="radio"]:disabled + span,
      .optionList .item input[type="checkbox"]:disabled + span {
        cursor: not-allowed;
        color: #777777;
        border: 1px solid #ccc;
        background-color: #ebebeb; }
      .optionList .item input[type="radio"]:checked + span,
      .optionList .item input[type="checkbox"]:checked + span {
        background-color: #2bb4b4;
        border-color: #009999;
        color: #ffffff; }
        .optionList .item input[type="radio"]:checked + span:after,
        .optionList .item input[type="checkbox"]:checked + span:after {
          content: 'X';
          font-size: .75rem;
          font-weight: bold;
          color: #009999;
          padding-left: 5px;
          vertical-align: text-top; }
      .optionList .item input[type="radio"]:hover + span,
      .optionList .item input[type="checkbox"]:hover + span {
        border-color: #025050; }
      .optionList .item input[type="radio"]:disabled:hover + span,
      .optionList .item input[type="checkbox"]:disabled:hover + span {
        border-color: #ccc; }

.tableMemo {
  font-size: .75rem; }
  @media screen and (max-width: 768px) {
    .tableMemo {
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
          -ms-flex-direction: column-reverse;
              flex-direction: column-reverse; } }

/*arrowBtn*/
.arrowBtn {
  display: block;
  position: relative;
  padding-right: 13px;
  color: #f4fcff;
  font-size: 12px;
  margin-bottom: 0; }
  .arrowBtn:after {
    font-family: "Font Awesome 5 free";
    content: '\f106';
    font-size: 10px;
    color: #2bb4b4;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -10px; }

.arrowBtn.active:after {
  color: #DCDEE1; }

.arrowBtn.desc:after {
  content: "\e998"; }

.arrowBtn:focus, .arrowBtn:hover {
  color: #f4fcff; }

.altTable.altTable-fund_o {
  font-size: .75rem; }
  .altTable.altTable-fund_o i {
    font-size: 1rem;
    vertical-align: middle; }
  .altTable.altTable-fund_o td {
    vertical-align: middle; }
  .altTable.altTable-fund_o thead th {
    color: #f4fcff;
    background-color: #009999;
    border-bottom: 0; }
  @media screen and (max-width: 991px) {
    .altTable.altTable-fund_o tbody td[data-title="月報"] {
      text-align: center; }
      .altTable.altTable-fund_o tbody td[data-title="月報"]:after {
        content: ''; }
      .altTable.altTable-fund_o tbody td[data-title="月報"] i {
        text-indent: 0;
        font-size: 1rem; }
        .altTable.altTable-fund_o tbody td[data-title="月報"] i:after {
          content: '月報下載';
          font-size: 1rem;
          margin-left: .5rem; } }

table {
  /* +++ collapse +++ */ }
  table .accordion-toggle {
    cursor: pointer; }
    table .accordion-toggle:hover {
      background-color: #efefef; }
    table .accordion-toggle td[data-title="級別"] {
      text-align: left;
      font-weight: bold;
      color: #009999; }
      table .accordion-toggle td[data-title="級別"]:before {
        font-family: "Font Awesome 5 free";
        font-weight: 900;
        content: "\f106";
        color: #006464;
        padding: 0 5px; }
  table [aria-expanded="true"] {
    background-color: #efefef; }
    table [aria-expanded="true"] td[data-title="級別"]:before {
      content: "\f107"; }
  table [aria-expanded="false"] .menu__icon--open {
    display: block; }
  table [aria-expanded="false"] .menu__icon--close {
    display: none; }
  table [aria-expanded="true"] .menu__icon--open {
    display: none; }
  table [aria-expanded="true"] .menu__icon--close {
    display: inline; }

@media screen and (max-width: 768px) {
  .wdTableWrap {
    overflow-x: auto;
    width: 100%; }
    .wdTableWrap .wdTable {
      min-width: 600px; }
      .wdTableWrap .wdTable thead th {
        white-space: nowrap; } }

/* chart Data */
.chartData {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-top: .5rem;
  margin-bottom: 2rem; }
  @media screen and (max-width: 991px) {
    .chartData {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; } }
  @media screen and (max-width: 768px) {
    .chartData {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; } }
  .chartData span {
    padding: 0 .5rem; }
  @media screen and (max-width: 768px) {
    .chartData span {
      padding: 0 .25rem; } }

/* 行事曆 fullCalendar*/
.fc-event {
  cursor: pointer; }

.fc table {
  font-size: .75em;
  line-height: 1.5; }

.fc th {
  color: #ffffff;
  background-color: #555555; }

.fc .fc-col-header-cell-cushion {
  padding: 6px 4px; }

.fc .fc-toolbar-title {
  font-size: 1.5em; }

.fc .btn.btn-primary {
  border: none !important; }

.event-gray {
  /* 暫停計價日*/
  background-color: #888888;
  border-color: #888888; }

.event-yellow {
  /* 配息基準日 */
  background-color: #ff9800;
  border-color: #ff9800; }

.event-green {
  /* 配息除息日 */
  background-color: #5bbbbb;
  border-color: #5bbbbb; }

.event-orange {
  /* 配息發放 */
  background-color: #ff5722;
  border-color: #ff5722; }

.event-blue {
  background-color: #1966f7;
  border-color: #1966f7; }

@media screen and (max-width: 768px) {
  .fc table {
    line-height: 1.2; }
  .fc .fc-daygrid-day-frame {
    min-height: 45px; } }

@media screen and (max-width: 576px) {
  .fc-daygrid-event {
    white-space: normal; } }

/* +++++ 20210331-goTop */
.goTop {
  cursor: pointer;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  font-size: 1.5rem;
  padding: 5px 20px;
  border-radius: 10px;
  color: #ffffff;
  background-color: #009999;
  -webkit-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
  position: fixed;
  height: auto;
  right: 1.875rem;
  bottom: 1.5rem;
  -webkit-transform: translateY(150px);
      -ms-transform: translateY(150px);
          transform: translateY(150px);
  -webkit-transition: .6s;
  -o-transition: .6s;
  transition: .6s;
  z-index: 999; }
  .goTop:after {
    content: "\f077"; }
  .goTop:hover {
    color: #009999;
    background-color: #bbeeee; }
  .goTop:focus {
    outline: none; }
  .goTop.active {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    -webkit-transition: .6s;
    -o-transition: .6s;
    transition: .6s; }

/*# sourceMappingURL=all.css.map */