@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');

/*===== RESET =====*/
*{ margin: 0; padding: 0; outline: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

a{  
	outline: none;
	text-decoration: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
a:hover{ text-decoration: none; }
	  
img{ border: 0px; display: block; }
	  
ol,ul,li{ list-style-type: none; text-transform: none; }

body{
	margin: 0;
	padding: 0;
  background-color: #fff;
	font-family: 'Noto Sans TC', '微軟正黑體', 'Microsoft JhengHei', Helvetica, Arial, sans-serif;
	font-weight: 400;
}

/*===== COMMON =====*/
:root {
  --red: #b82837;
  --blue: #0f338b;
  --gray: #5e5e60;
  --txtBlack: #333333;
}

.wrap{
  width: 100%;
}
.mobile{ display: none!important;}

/*===== NAVIGATION =====*/
.header{
  width: 100%;
  height: 100px;
  padding: 0 60px;
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  top: 0;
  left: auto;
  right: auto;
  z-index: 99999;
  transition: all 0.5s ease-out;
}
.top_logo{
  width: 152px;
}
.top_logo img{ width: 100%;}

.menu_ctrl{ display: none;}
.menuBox{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.menu_inner{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.menu > li{
  margin: 0 20px;
  display: inline-block;
  font-size: 20px;
  font-weight: 500;
  color: var(--txtBlack);
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 100px;
  position: relative;
  cursor: pointer;
}
.menu > li > a.act{
  color: var(--red);
}
.menu > li span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 22px;
  vertical-align: -0.5px;
}
.menu > li > a{ display: block; color: var(--txtBlack);}
.menu > li > a:hover{ transition: all 0.25s ease-out;}
.menu > li:hover, .menu > li > a:hover{ color: var(--red);}

.social{
  margin: 0 0 0 10px;
}
.social > li{
  width: 40px;
  margin: 0 15px;
  display: inline-block;
}
.social > li a img{
  width: 100%;
}
.social > li a:hover{
  opacity: 0.85;
  transition: all 0.25s ease-out;
}

/*===== KV BANNER =====*/
.kv{
  width: 100%;
  height: 700px;
  margin-top: 100px;
}
.kv .banner{
  width: 100%;
}
.kv .banner .visuel{
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
.kv .banner .visuel img{
  width: 2560px;
}
/* Swiper dots */
.kv .swiper-pagination-bullets{
  display: none;
}

/*===== TITLE =====*/
.sceneTitle{
  margin-top: 90px;
}
.sceneTitle .title{
  display: flex;
  justify-content: center;
  position: relative;
}
.sceneTitle .title h1{
  display: inline-block;
  font-size: 48px;
  font-weight: 800;
  color: var(--txtBlack);
  text-align: center;
  letter-spacing: 0.2em;
  line-height: 1;
  position: relative;
  z-index: 0;
}
.sceneTitle .title h1 span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 54px;
  letter-spacing: 0.15em;
  line-height: 0;
  vertical-align: -1px;
}
.sceneTitle .title h1::before{
  content: '';
  width: 50px;
  height: 46px;
  transform: rotate(180deg);
  position: absolute;
  top: 2px;
  left: -75px;
  z-index: -1;
}
.sceneTitle .title h1::after{
  content: '';
  width: 50px;
  height: 46px;
  position: absolute;
  top: 2px;
  right: -75px;
  z-index: -1;
}
.sceneTitle .title h1.blue{
  background: -webkit-linear-gradient(#395db4, var(--blue));
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.sceneTitle .title h1.red{
  background: -webkit-linear-gradient(#c6535f, var(--red));
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.sceneTitle .title h1.blue::before{
  background: url(../images/titleLine_blue.png) no-repeat center center;
  background-size: 100%;
}
.sceneTitle .title h1.blue::after{
  background: url(../images/titleLine_blue.png) no-repeat center center;
  background-size: 100%;
}
.sceneTitle .title h1.red::before{
  background: url(../images/titleLine_red.png) no-repeat center center;
  background-size: 100%;
}
.sceneTitle .title h1.red::after{
  background: url(../images/titleLine_red.png) no-repeat center center;
  background-size: 100%;
}
.sceneTitle p{
  margin-top: 25px;
  font-size: 28px;
  font-weight: 400;
  color: var(--txtBlack);
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 40px;
}
/*===== FUND TAB =====*/
ul.tab{
  margin: 30px auto 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
ul.tab li{
  width: 320px;
  height: 124px;
  margin: 0 15px;
  padding: 15px 20px;
  background: url(../images/tabBG.png) no-repeat center top;
  background-size: 100%;
  cursor: pointer;
}
ul.tab li:hover{
  filter: brightness(105%);
  transition: all 0.25s ease-out;
}
ul.tab li h2{
  font-family: Helvetica, sans-serif;
  font-size: 40px;
  font-weight: 700;
  color: #5e5e60;
  text-align: center;
  letter-spacing: 0.05em;
  line-height: 1;
}
ul.tab li p{
  margin-top: 10px;
  font-size: 18px;
  font-weight: 500;
  color: #5e5e60;
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 1;
}
ul.tab li p.long{
  margin-top: 0;
  font-size: 14px;
  letter-spacing: 0.035em;
  line-height: 20px;
}
ul.tab li p span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 19px;
  letter-spacing: 0.05em;
  vertical-align: -0.5px;
}
ul.tab li p.long span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 15px;
  letter-spacing: 0.05em;
}
ul.tab li p span.warning{ color: var(--txtBlack);}
ul.tab.blue li.act{
  background: url(../images/tabBG_blue.png) no-repeat center top;
  background-size: 100%;
}
ul.tab.red li.act{
  background: url(../images/tabBG_red.png) no-repeat center top;
  background-size: 100%;
}
ul.tab.red l:n{
  padding: 15px 60px;
}
ul.tab li.act h2{ color: #fff;}
ul.tab li.act p{ color: #fff;}
ul.tab li.act p span.warning{ color: #fff4b7;}

/*===== Scene Title Animation =====*/
.fadeIn{
    transition-property: opacity, transform;
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(0.000, 0.295, 0.500, 1.000);
    opacity: 0;
    -webkit-transform: translate(0, 60px);
    transform: translate(0, 60px);
}
.fadeIn[data-delay="1"]{ transition-delay: 0.2s;}
.fadeIn[data-delay="2"]{ transition-delay: 0.4s;}
.fadeIn[data-delay="3"]{ transition-delay: 0.6s;}
.fadeIn[data-delay="4"]{ transition-delay: 0.8s;}
.fadeIn[data-delay="5"]{ transition-delay: 1s;}

.fadeIn.is_done{
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

/*===== ETF =====*/
.scene{
  background: url(../images/bgScene1.jpg) no-repeat center top;
  background-size: 2560px;
  background-color: #fff8e6;
}
.scene .etf{
  width: 1200px;
  margin: 0 auto;
  padding-left: 10px;
}
.fundBox{
  margin-top: 30px;
}
.fund{
  width: 100%;
}
.fund .card{
  border-radius: 15px 10px 15px 15px;
  position: relative;
  z-index: 1;
}
.card924{
  background: url(../images/fundBG_924.jpg) no-repeat center top;
  background-size: cover;
}
.card949{
  background: url(../images/fundBG_949.jpg) no-repeat center top;
  background-size: cover;
}
.card929{
  background: url(../images/fundBG_929.jpg) no-repeat center top;
  background-size: cover;
}
.card710{
  background: url(../images/fundBG_710.jpg) no-repeat center top;
  background-size: cover;
}
.card768{
  background: url(../images/fundBG_768.jpg) no-repeat center top;
  background-size: cover;
}
.card789{
  background: url(../images/fundBG_789.jpg) no-repeat center top;
  background-size: cover;
}
.fund.stocks .card{ height: 700px;}
.fund.bonds .card{ height: 680px;}
.card .fundName{
  width: 1200px;
  height: 110px;
  margin-left: -10px;
  padding-left: 50px;
  padding-bottom: 7px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.card .fundName h2.code{
  background: -webkit-linear-gradient(0deg,rgba(219, 216, 217, 1) 0%, rgba(172, 170, 170, 1) 46%, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 1) 100%);
  background: -moz-linear-gradient(0deg,rgba(219, 216, 217, 1) 0%, rgba(172, 170, 170, 1) 46%, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 1) 100%);
  background: linear-gradient(0deg,rgba(219, 216, 217, 1) 0%, rgba(172, 170, 170, 1) 46%, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 1) 100%);
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: Helvetica, sans-serif;
  font-size: 60px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
  filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.25));
}
.card .fundName p.name{
  margin-left: 30px;
  font-size: 32px;
  font-weight: 500;
  color: #fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}
.card .fundName p.name span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 34px;
  vertical-align: -0.5px;
}
.card .fundName p.name.long{
  font-size: 26px;
  line-height: 34px;
}
.card .fundName p.name.long span.eng{
  font-size: 27px;
}
.card .fundName p.name.long span.waring{
  font-weight: 700;
}
.card924 .fundName{
  background: url(../images/fundTitleBG_924.png) no-repeat center top;
  background-size: 100%;
}
.card949 .fundName{
  background: url(../images/fundTitleBG_949.png) no-repeat center top;
  background-size: 100%;
}
.card929 .fundName{
  background: url(../images/fundTitleBG_929.png) no-repeat center top;
  background-size: 100%;
}
.card710 .fundName{
  background: url(../images/fundTitleBG_710.png) no-repeat center top;
  background-size: 100%;
}
.card768 .fundName{
  background: url(../images/fundTitleBG_768.png) no-repeat center top;
  background-size: 100%;
}
.card789 .fundName{
  background: url(../images/fundTitleBG_789.png) no-repeat center top;
  background-size: 100%;
}
.fundIntro{
  width: 100%;
  height: 590px;
  padding: 0 302px 30px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  z-index: -1;
}
.boxShadow{ filter: drop-shadow(0 0 35px rgba(0, 0, 0, 0.35));}
.bonds .fundIntro{ height: 570px;}
/* 小標 */
.fundIntro h3{
  flex: 0 0 100%;
  margin-top: 15px;
  margin-left: 40px;
  padding-left: 20px;
  font-size: 28px;
  font-weight: 500;
  color: var(--txtBlack);
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
  position: relative;
}
.fundIntro h3::before{
  content: '';
  width: 7px;
  height: 30px;
  background-color: var(--red);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
/* 獎項 */
.fundIntro .award{
  flex: 0 0 100%;
  margin-top: 20px;
  margin-left: 40px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.fundIntro .award .item{
  margin-right: 10px;
  font-size: 18px;
  font-weight: 500;
  color: var(--blue);
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}
.fundIntro .award .item img{
  width: 18px;
  margin-right: 5px;
  display: inline-block;
  position: relative;
  top: 1.5px;
}
.fundIntro .award ul.prize{
  height: 22px;
  overflow: hidden;
}
.fundIntro .award ul.prize li{
  font-size: 18px;
  font-weight: 500;
  color:#d09b39;
  text-align: left;
  letter-spacing: 0.05em;
  line-height: 1;
}
.fundIntro .award ul.prize li span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 19px;
}
.fundIntro p.note{
  margin-left: 40px;
}
/* 圖表警語 */
p.note{
  margin-top: 5px;
  font-size: 14px;
  font-weight: 400;
  color: #666;
  text-align: justify;
  letter-spacing: 0.035em;
  line-height: 18px;
  word-break: break-all;
}
p.note span.highlight{
  font-weight: 700;
  color: var(--red);
}
p.note.tableNote{
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0;
}
/* 特點頁籤 */
.fundIntro ul.subTab{
  flex: 0 0 100%;
  margin-top: 20px;
  margin-left: 40px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.fundIntro ul.subTab li{
  margin-right: 15px;
  padding: 0 25px 1px 18px;
  border-radius: 32px;
  background-color: #ccc;
  font-size: 18px;
  font-weight: 500;
  color:#fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 32px;
  position: relative;
  cursor: pointer;
}
.fundIntro ul.subTab li.act{
  background-color: var(--red);
}
.fundIntro ul.subTab li::after{
  content: '';
  width: 5px;
  height: 10px;
  background: url(../images/icon_arrow.png) no-repeat center center;
  background-size: 100%;
  position: absolute;
  top: calc(50% - 4px);
  right: 13px;
}
/* 基金特點 */
.fundIntro .sheet{
  width: 100%;
  flex: 0 0 100%;
  margin-top: 15px;
  padding-left: 40px;
  padding-right: 40px;
}
.sheet .tipsBox{
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
.tipsBox .tips{
  width: 262px;
  margin-right: 10px;
  padding: 20px 15px 15px 15px;
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 0;
}
.tipsBox .tips::before{
  content: '';
  width: 212px;
  height: 212px;
  transform: rotate(45deg);
  position: absolute;
  top: -106px;
  left: -106px;
  z-index: -1;
}
.tipsBox .tips:last-of-type{ margin-right: 0;}
.tipsBox .tips.tips1{
  border: 2px solid #e5276d;
  background: -webkit-linear-gradient(180deg,rgba(255, 211, 216, 1) 0%, rgba(255, 239, 241, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(255, 211, 216, 1) 0%, rgba(255, 239, 241, 1) 100%);
  background: linear-gradient(180deg,rgba(255, 211, 216, 1) 0%, rgba(255, 239, 241, 1) 100%);
}
.tipsBox .tips.tips1::before{
  background: -webkit-linear-gradient(-225deg,rgba(218, 9, 86, 1) 40%, rgba(246, 100, 154, 1) 100%);
  background: -moz-linear-gradient(-225deg,rgba(218, 9, 86, 1) 40%, rgba(246, 100, 154, 1) 100%);
  background: linear-gradient(-225deg,rgba(218, 9, 86, 1) 40%, rgba(246, 100, 154, 1) 100%);
}
.tipsBox .tips.tips2{
  border: 2px solid #f2a208;
  background: -webkit-linear-gradient(180deg,rgba(252, 219, 194, 1) 0%, rgba(253, 236, 223, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(252, 219, 194, 1) 0%, rgba(253, 236, 223, 1) 100%);
  background: linear-gradient(180deg,rgba(252, 219, 194, 1) 0%, rgba(253, 236, 223, 1) 100%);
}
.tipsBox .tips.tips2::before{
  background: -webkit-linear-gradient(-225deg,rgba(242, 134, 8, 1) 40%, rgba(249, 204, 86, 1) 100%);
  background: -moz-linear-gradient(-225deg,rgba(242, 134, 8, 1) 40%, rgba(249, 204, 86, 1) 100%);
  background: linear-gradient(-225deg,rgba(242, 134, 8, 1) 40%, rgba(249, 204, 86, 1) 100%);
}
.tipsBox .tips.tips3{
  border: 2px solid #08a6e2;
  background: -webkit-linear-gradient(180deg,rgba(160, 215, 253, 1) 0%, rgba(216, 238, 253, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(160, 215, 253, 1) 0%, rgba(216, 238, 253, 1) 100%);
  background: linear-gradient(180deg,rgba(160, 215, 253, 1) 0%, rgba(216, 238, 253, 1) 100%);
}
.tipsBox .tips.tips3::before{
  background: -webkit-linear-gradient(-225deg,rgba(0, 139, 203, 1) 40%, rgba(109, 208, 246, 1) 100%);
  background: -moz-linear-gradient(-225deg,rgba(0, 139, 203, 1) 40%, rgba(109, 208, 246, 1) 100%);
  background: linear-gradient(-225deg,rgba(0, 139, 203, 1) 40%, rgba(109, 208, 246, 1) 100%);
}
.tipsBox .tips > .icon{
  width: 123px;
  position: absolute;
  top: 0;
  left: 0;
}
.tipsBox .tips > .icon img{ width: 100%;}
.tipsBox .tips > h4{
  flex: 0 0 auto;
  margin-bottom: 15px;
  padding-left: 123px;
  font-size: 24px;
  font-weight: 500;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 32px;
}
.tipsBox .tips1 > h4{ color: #d51a53;}
.tipsBox .tips2 > h4{ color: #e47b00;}
.tipsBox .tips3 > h4{ color: #1270ac;}
.card929 .tipsBox .tips3 > h4{
  padding-left: 108px;
  letter-spacing: 0.025em;
}
.tipsBox .tips > p{
  height: 160px;
  padding: 15px;
  background-color: #fff;
  border-radius: 8px;
  font-size: 18px;
  font-weight: 400;
  color: var(--txtBlack);
  text-align: justify;
  letter-spacing: 0.05em;
  line-height: 26px;
}
/* 績效表現 */
.sheet .number{
  width: 100%;
  margin: 0 auto;
  padding: 0 91px;
}
.number .numHead{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.number .numHead > div{
  width: 207px;
  background: -webkit-linear-gradient(180deg,rgba(111, 82, 66, 1) 0%, rgba(143, 112, 76, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(111, 82, 66, 1) 0%, rgba(143, 112, 76, 1) 100%);
  background: linear-gradient(180deg,rgba(111, 82, 66, 1) 0%, rgba(143, 112, 76, 1) 100%);
  font-size: 18px;
  font-weight: 500;
  color: #fff;
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 52px;
}
.number .numHead.fourCol > div{ width: 154.5px;}
.number .numHead > div:first-of-type{ border-top-left-radius: 10px;}
.number .numHead > div:last-of-type{ border-top-right-radius: 10px;}
.number .numItem{
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 2px solid #726658;
  border-radius: 0 0 10px 10px;
}
.number .numItem > div{
  width: 205px;
  background: -webkit-linear-gradient(180deg,rgba(255, 241, 222, 1) 0%, rgba(255, 255, 255, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(255, 241, 222, 1) 0%, rgba(255, 255, 255, 1) 100%);
  background: linear-gradient(180deg,rgba(255, 241, 222, 1) 0%, rgba(255, 255, 255, 1) 100%);
  font-family: Helvetica, sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: var(--txtBlack);
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 65px;
}
.number .numItem.fourCol > div{ width: 152.5px;}
.number .numItem > div:first-of-type{ border-bottom-left-radius: 10px;}
.number .numItem > div:last-of-type{ border-bottom-right-radius: 10px;}
.number:first-of-type{ margin-bottom: 15px;}
/* 十大持股 */
.sheet .element{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.element .elBox{
  flex: 0 0 50%;
}
.elBox .elHead{
  background: -webkit-linear-gradient(180deg,rgba(111, 82, 66, 1) 0%, rgba(143, 112, 76, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(111, 82, 66, 1) 0%, rgba(143, 112, 76, 1) 100%);
  background: linear-gradient(180deg,rgba(111, 82, 66, 1) 0%, rgba(143, 112, 76, 1) 100%);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.elBox:first-of-type .elHead{ border-top-left-radius: 10px;}
.elBox:nth-of-type(2) .elHead{ border-top-right-radius: 10px;}
.elBox .elHead > div{
  font-size: 18px;
  font-weight: 500;
  color: #fff;
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 37px;
  position: relative;
}
.elBox .elHead > div:nth-of-type(1){
  flex: 0 0 calc(62% - 2px);
}
.elBox .elHead > div:nth-of-type(2){
  flex: 0 0 38%;
}
.elBox .elHead > div:nth-of-type(1)::after,
.elBox:first-of-type .elHead > div:nth-of-type(2)::after{
  content: '';
  width: 1px;
  height: 27px;
  background-color: #fff;
  position: absolute;
  top: 5px;
  right: -1.5px;
}
.elBox .elItem{
  position: relative;
}
.elBox:first-of-type .elItem::before{
  content: '';
  width: 2px;
  height: calc(100% + 2px);
  display: block;
  background: -webkit-linear-gradient(180deg,rgba(143, 112, 76, 1) 0%, rgba(196, 104, 35, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(143, 112, 76, 1) 0%, rgba(196, 104, 35, 1) 100%);
  background: linear-gradient(180deg,rgba(143, 112, 76, 1) 0%, rgba(196, 104, 35, 1) 100%);
  position: absolute;
  top: 0;
  left: 0;
}
.elBox:nth-of-type(2) .elItem::before{
  content: '';
  width: 2px;
  height: calc(100% + 2px);
  display: block;
  background: -webkit-linear-gradient(180deg,rgba(143, 112, 76, 1) 0%, rgba(196, 104, 35, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(143, 112, 76, 1) 0%, rgba(196, 104, 35, 1) 100%);
  background: linear-gradient(180deg,rgba(143, 112, 76, 1) 0%, rgba(196, 104, 35, 1) 100%);
  position: absolute;
  top: 0;
  right: 0;
}
.elBox .elItem .row{
  margin-bottom: 2px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.elBox .elItem .row > div{
  font-size: 18px;
  font-weight: 400;
  color: var(--txtBlack);
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 37px;
}
.elBox .elItem .row > div:nth-of-type(1){
  margin-right: 2px;
  flex: 0 0 calc(62% - 2px);
}
.elBox .elItem .row > div:nth-of-type(2){
  flex: 0 0 38%;
  font-family: Helvetica, sans-serif;
}
.elBox .elItem .row:nth-of-type(odd) > div{
  background-color: #fff6e9;
}
.elBox .elItem .row:nth-of-type(even) > div{
  background-color: #fde8c7;
}
.elBox:nth-of-type(2) .elItem .row{
  margin-left: 2px;
}
.element .elTotal{
  flex: 0 0 100%;
  background: -webkit-linear-gradient(180deg,rgba(196, 104, 35, 1) 0%, rgba(208, 121, 56, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(196, 104, 35, 1) 0%, rgba(208, 121, 56, 1) 100%);
  background: linear-gradient(180deg,rgba(196, 104, 35, 1) 0%, rgba(208, 121, 56, 1) 100%);
  border-radius: 0 0 10px 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 18px;
  font-weight: 400;
  color: #fff;
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 37px;
}
.element .elTotal > div:nth-of-type(1){
  flex: 0 0 calc(81% - 2px);
  position: relative;
}
.element .elTotal > div:nth-of-type(1)::after{
  content: '';
  width: 1px;
  height: 27px;
  background-color: #fff;
  position: absolute;
  top: 5px;
  right: -1.5px;
}
.element .elTotal > div:nth-of-type(2){
  flex: 0 0 19%;
  font-family: Helvetica, sans-serif;
}
/* 按鈕 */
a.more{
  width: 200px;
  height: 50px;
  margin: 0 auto;
  padding: 0 65px 1px 55px;
  display: block;
  border-radius: 8px;
  align-self: flex-end;
  font-size: 18px;
  font-weight: 400;
  color:#fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 50px;
  position: relative;
}
a.more.blue{
  background-color: var(--blue);
}
a.more.red{
  background-color: var(--red);
}
a.more::after{
  content: '';
  width: 7px;
  height: 14px;
  background: url(../images/icon_arrow.png) no-repeat center center;
  background-size: 100%;
  position: absolute;
  top: calc(50% - 6px);
  right: 45px;
}
a.more:hover{
  filter: brightness(125%);
  transition: all 0.25s ease-out;
}
/* Swiper Arrows */
.swiper-button-prev.prev, .swiper-button-next.next{
  width: 22px;
  height: 22px;
  top: 38%;
  z-index: 999;
}
.swiper-button-prev.prev{
  background: url(../images/slideArrow.png) no-repeat center center;
  background-size: 100%;
  left: 13px;
}
.swiper-button-next.next{
  background: url(../images/slideArrow.png) no-repeat center center;
  background-size: 100%;
  right: 13px;
  transform: rotate(180deg);
}
.swiper-button-prev.prev.swiper-navigation-disabled, .swiper-button-next.next.swiper-navigation-disabled{
  opacity: 0.35;
}
.swiper-horizontal {
  .swiper-button-prev,
  .swiper-button-next,
  ~ .swiper-button-prev,
  ~ .swiper-button-next {
    top: 38%;
    margin-top: 0;
    margin-left: 0;
  }
  .swiper-button-prev,
  & ~ .swiper-button-prev,
  &.swiper-rtl .swiper-button-next,
  &.swiper-rtl ~ .swiper-button-next {
    left: 13px;
    right: auto;
  }
  .swiper-button-next,
  & ~ .swiper-button-next,
  &.swiper-rtl .swiper-button-prev,
  &.swiper-rtl ~ .swiper-button-prev {
    right: 13px;
    left: auto;
  }
}

/*===== 下載專區 =====*/
.scene2{
  background: url(../images/bgScene2.jpg) no-repeat center bottom;
  background-size: 2560px;
  background-color: #fff8e6;
}
.scene2 .dmBox{
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.dmBox .dm{
  width: 450px;
  height: 624px;
  margin: 50px 25px 66px 25px;
  padding: 475px 50px 40px 20px;
}
.dm:nth-of-type(1){
  background: url(../images/dmStocks.png) no-repeat center bottom;
  background-size: 100%;
}
.dm:nth-of-type(2){
  background: url(../images/dmBonds.png) no-repeat center bottom;
  background-size: 100%;
}
.dm:hover{
  filter: brightness(110%);
  transition: all 0.25s ease-out;
}
.dm h5{
  font-size: 32px;
  font-weight: 700;
  color:#fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}
.dm h5 br{ display: none;}
.dm h5 span.eng{
  font-family: Helvetica, sans-serif;
  font-size: 36px;
  vertical-align: -0.5px;
}
.dm p{
  margin-top: 10px;
  font-size: 24px;
  font-weight: 500;
  color:#fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}
.dm .btn{
  margin-top: 20px;
  float: right;
  font-size: 18px;
  font-weight: 400;
  color:#fff;
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
  position: relative;
}
.dm .btn::after{
  content: '';
  width: 7px;
  height: 14px;
  background: url(../images/icon_arrow.png) no-repeat center center;
  background-size: 100%;
  position: absolute;
  top: calc(50% - 6px);
  right: -20px;
}

/*===== FOOTER =====*/
.scene3{
  background-color: #eee;
}
.foot{
  width: 1100px;
  margin: 0 auto;
  padding-top: 50px;
  position: relative;
}
.foot h6{
  margin-bottom: 30px;
  font-size: 18px;
  color: var(--txtBlack);
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.5em;
  line-height: 1;
}
.jingyu p{
  font-size: 14px;
  font-weight: 700;
  color: var(--txtBlack);
  text-align: justify;
  letter-spacing: 0.075em;
  line-height: 22px;
}
.jingyu p.title{
  color: #e6994c;
}
.jingyu p span.waring{
  color: #963100;
}
.jingyu p a{
  color: var(--txtBlack);
  text-decoration: underline;
}
.jingyu p a:hover{
  color: #999;
  transition: all 0.5s ease-out;
}
.jingyu p span.red{
  color: var(--red);
}
.jingyu p span.red a{
  color: var(--red);
}
.jingyu p span.red a:hover{
  color: #db939b;
  transition: all 0.5s ease-out;
}
.corporation{
  padding: 50px 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.corporation .logo{
  width: 152px;
  margin-right: 50px;
}
.corporation .info .name{
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: 500;
  color: var(--txtBlack);
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}
.corporation .info .add{
  margin-bottom: 15px;
  font-size: 14px;
  font-weight: 400;
  color: var(--txtBlack);
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}
.corporation .info a{
  color: var(--txtBlack);
}
.corporation .info .branch{
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.corporation .info .branch p{
  font-size: 12px;
  font-weight: 400;
  color: var(--txtBlack);
  text-align: left;
  letter-spacing: 0.075em;
  line-height: 1;
}