@charset "utf-8";
/* CSS Document */
@import "font-awesome/font-awesome.min.css";
@import "https://use.fontawesome.com/releases/v5.9.0/css/all.css";
@import "https://use.fontawesome.com/releases/v5.9.0/css/v4-shims.css";
h3{font-size:2em; padding:0; margin:50px 0 20px 0; line-height: 120%;}
#custom-content{margin-bottom:2em;}
#custom-content .fa, .far, .fas{font:inherit;}
#custom-content .fa::before, #custom-content .far::before, #custom-content .fas::before{font:inherit; font-family:"Font Awesome 5 Free", FontAwesome;}
#custom-content .fas::before{font-weight:900;}
#IPO-table{width:100%; overflow:auto;}
#IPO-table table{width:100%; position:relative; margin: 0 auto; background: #FFF; border-radius: 5px; border: 1px solid #EEE; border-collapse: separate; font-size:.9rem;}
#IPO-table td {padding:1rem .5rem; border-top: 1px solid #F9F9F9; background: #FDFDFD; position:relative; font-weight:400;}
#IPO-table td:empty:after {content:"-";}
#IPO-table td small {display: block;line-height: normal;font-size:.7rem;white-space: normal;}
#IPO-table th {font-weight: 600; padding:1em 1em .75em 1em; border-bottom: 1px solid #FCFCFC; color: #777; line-height:130%; white-space:nowrap; height:5em;}
#IPO-table tr>*{text-align:center;}
#IPO-table tr>*:first-child{padding-left:1rem;}
#IPO-table tr>*:last-child{padding-right:1rem;}
#IPO-table thead tr:nth-child(2) th{padding:.2em 0 .5em 0; text-align:center; min-width:4em;}
#IPO-table tbody::before{content:attr(data-category);}
#IPO-table tbody td p{white-space:nowrap;font-size:.8rem;}
#IPO-table tbody td s{width:0; display:block; margin:.2em auto; border-left:1px solid #888; height:.6em;}
#IPO-table tr>*:nth-child(1){text-align:left;}
#IPO-table tbody td:nth-child(1){white-space:nowrap; padding-right:1rem;}
#IPO-table tbody td:nth-child(1)>div.related-doc{white-space:nowrap; padding:.5rem 0; margin:0 -.5em;}
#IPO-table tbody td:nth-child(1) a{display:inline-block; position:relative; padding:0 .5em; color:#AAA;}
#IPO-table tbody td:nth-child(1) a:hover{color:#666;}
#IPO-table tbody td:nth-child(1) a::before{font-size:1.5em; vertical-align:middle;}
#IPO-table tbody td:nth-child(1) a:not(:last-child):after{content:""; border-left:1px solid #DDD; vertical-align:middle; transform:rotate(30deg); transform-origin: center; display:inline-block; width:0; height:2em; position:relative; left:.75em; cursor:default;}
#IPO-table tbody td:nth-child(1) a:nth-child(2){color:#c00000;}
#IPO-table tbody td:nth-child(1) a:nth-child(2):hover{color:#B30000;}
#research-popup{position:fixed; text-align:center; background:#FFF; padding:2em; z-index:9999999999;}
@media screen and (orientation:landscape){
	#research-popup{box-shadow: 0 0 0 100vw rgba(0,0,0,.7);}
}
@media screen and (orientation:portrait){
	#research-popup{box-shadow: 0 0 0 100vh rgba(0,0,0,.7);}
}
	
#research-popup .fa-close{line-height:100%; padding:.5em .6em; margin:-2em; font-weight:600; float:right;}
#research-popup p{word-break:keep-all; white-space:nowrap; margin-top:.4em; line-height:150%;}
#research-popup p:nth-of-type(2){font-size:1.4rem;}
#research-popup p:nth-of-type(1){font-size:1rem;}
#research-popup p>a{white-space:nowrap; padding:0 .2em;}
#research-popup .fas{position:relative; width:1.8rem; transform-origin:top center; transform:scale(3); margin-bottom:4rem; color:#444; line-height:1.7rem;}
#research-popup .fas::before{font-size:1.35rem;}
@media screen and (min-width:26rem){
	#research-popup{
		left:calc(50vw - 12rem); width:24rem;
		top:calc(50vh - 8rem);
	}
}
@media screen and (max-width:25.9rem){
	#research-popup{
		left:1rem; width:calc(100vw - 2rem);
		top:calc(50vh - 8rem);
	}
}
#research-popup .fas::after,
#IPO-table tbody td:nth-child(1) a:nth-child(2)::after{content:"\f023"; font-family:"Font Awesome 5 Free",FontAwesome; font-weight:900; font-size:.7rem; width:1.35em; height:1.35em; line-height:1.35em; text-align:center; border-radius:50%; background:#FDFDFD; bottom:-.2em; right:-.1em; position:absolute;}
#IPO-table tbody td:nth-child(2){min-width:8rem;font-size:.95rem;text-align:left;}
#IPO-table tbody td var{font-style:normal; display:block; padding:0;}
#IPO-table tbody tr.new td var::after{content:""; display:inline-block; width:1.75em; height:1em; background:url(/home/img/icon/NEW.svg) no-repeat top right; background-size:auto 1em;}
#IPO-table tbody td p.UOB{color:#CB0000;}
#IPO-table tbody td p.UOB::before, #table-legend>p.UOB::before{content:"U"; display:inline-block; width:1.4em; height:1.4em; background:#CB0000; color:#FFF; font-weight:700; text-align:center; border-radius:50%; margin-right:.25em;}
#IPO-table tbody td:last-child p{text-align:left;}
#IPO-table tbody td[colspan="10"]{padding-top:.5rem; padding-bottom:.5rem; background:#FAFAFA; color:#777; font-size:1rem; border-top:1px solid #F6F6F6; border-bottom:1px solid #F6F6F6;}
#table-legend>p{display:inline-block; margin:0 2em 0 0; font-size:.8rem; padding:.6em 0;}
#IPO-calendar{display:flex; flex-flow:column nowrap; align-items:flex-end; position:relative; width:100%; margin:.5rem 0 3rem 0; overflow:hidden;}
#IPO-calendar>div{display:grid; width:100%; grid-auto-columns:5%; margin:0 0 0 auto;}
@media screen and (max-width:60rem){
	#IPO-calendar{overflow-x:auto;}
	#IPO-calendar>div{width:calc(60rem - 30px);}
}
@media screen and (max-width:636px){
	#custom-content{padding:0 15px;}
}
#IPO-calendar>div>*{display:inline-block; margin:0 .5px; text-align:center; grid-row-start:1; grid-row-span:1;}
#IPO-calendar>div#calendar-month>*{background:#74767b; color:#FFF; font-weight:100; padding:.25em 0; display:inline-flex; flex-flow:column;}
#IPO-calendar>div#calendar-month>*>*{margin:auto; display:block;}
#IPO-calendar>div#calendar-month>*:first-child{grid-column-start:1;}
#IPO-calendar>div#calendar-month>*:last-child{grid-column-end:21;}
#IPO-calendar>div#calendar-month>*:last-child>small{display:block; height:1.2em;}
#IPO-calendar>div#calendar-day{display:flex; flex-flow:row nowrap; position:relative;}
#IPO-calendar>div#calendar-day>*{width:5%; text-align:center; font-weight:100; font-size:.8rem; padding:.5em 0; background:#FFF; position:relative;}
#IPO-calendar>div#calendar-day>*:not(:last-child)::after {content:""; width:0; border-left: 1px solid rgba(0,0,0,.05); position:absolute; top:0; right:0;height:100vh;}
#IPO-calendar>div#calendar-day>*[class]{font-weight:400;}
#IPO-calendar>div#calendar-day>*::before{display: block;font-size: .8em;text-align:center;font-weight: bold;background: #ffffff;color: #c5c5c5;padding: .25em;line-height: 1em;}
#IPO-calendar>div#calendar-day>*.sat{color:#3cb700;}
#IPO-calendar>div#calendar-day>*.sun{color:#ea0000;}
#IPO-calendar>div#calendar-day>*.holiday{color:#ea0000;}
#IPO-calendar>div#calendar-day>*.mon::before{content:"一"}
#IPO-calendar>div#calendar-day>*.tue::before{content:"二"}
#IPO-calendar>div#calendar-day>*.wed::before{content:"三"}
#IPO-calendar>div#calendar-day>*.thu::before{content:"四"}
#IPO-calendar>div#calendar-day>*.fri::before{content:"五"}
#IPO-calendar>div#calendar-day>*.sat::before{content:"六"}
#IPO-calendar>div#calendar-day>*.sun::before{content:"日"}
#IPO-calendar>div#calendar-day>*.sun+b::before{content:"一"}
#IPO-calendar>div#calendar-day>*.sun+b+b::before{content:"二"}
#IPO-calendar>div#calendar-day>*.sun+b+b+b::before{content:"三"}
#IPO-calendar>div#calendar-day>*.sun+b+b+b+b::before{content:"四"}
#IPO-calendar>div#calendar-day>*.sun+b+b+b+b+b::before{content:"五"}
#IPO-calendar>div.ipo-record{padding:2rem 0 .5rem 0; z-index:3;}
#IPO-calendar>div.ipo-record-type{grid-auto-columns:100%; background:rgba(0,0,0,.03); font-size:.95rem; padding:.5em 1em; color:#666;}
#IPO-calendar>div.ipo-record:not(:last-child){border-bottom:1px dashed #EEE;}
#IPO-calendar>div.ipo-record:hover{background:rgba(255,255,255,.25);}
#IPO-calendar>div.ipo-record>*{margin:auto; align-self:center; position:relative;}
#IPO-calendar>div.ipo-record>*.opening{margin:auto 0; z-index:2;}
#IPO-calendar>div.ipo-record>*:not(.opening){grid-column-span:1; font-size:1.2rem; line-height:1em; padding:3px; z-index:3;}
#IPO-calendar>div.ipo-record>*.fas::before, #calendar-legend .fas::before{content:""; display:inline-block; background-size:100% auto; width:1em; height:1em;}
#IPO-calendar>div.ipo-record>*.closing-day, #IPO-calendar>div.ipo-record>*.settlement-day{background:#f3f5fa; border-radius:50%;}
#IPO-calendar>div.ipo-record>*.closing-day::before, #calendar-legend .closing-day::before{background-image:url(/home/img/icon/closing-day.svg);}
#IPO-calendar>div.ipo-record>*.settlement-day::before, #calendar-legend .settlement-day::before{background-image:url(/home/img/icon/settlement-day.svg);}
#IPO-calendar>div.ipo-record>*.refund-day::before, #calendar-legend .refund-day::before{background-image:url(/home/img/icon/refund-day.svg);}
#IPO-calendar>div.ipo-record>*.list-day::before, #calendar-legend .list-day::before{background-image:url(/home/img/icon/list-day.svg);}
#IPO-calendar>div.ipo-record>*.opening::before, #IPO-calendar>div.ipo-record>*.opening::after{display:block; left:0;}
#IPO-calendar>div.ipo-record>*.opening::before{content:attr(data-stock); position:absolute; padding:0 0 3px 0; bottom:.8rem; text-align:left; font-size:.875rem; white-space:nowrap; font-weight:100; text-overflow:ellipsis;}
#IPO-calendar>div.ipo-record>*.opening.new::before{padding-right:2.2em; background:url(/home/img/icon/NEW.svg) no-repeat top right; background-size:1.75em auto;}
#IPO-calendar>div.ipo-record>*.opening.closed::after{background:none;}
#IPO-calendar>div.ipo-record>*.opening:hover::before{overflow: visible;}
#IPO-calendar>div.ipo-record>*.opening::after, #calendar-legend .opening::before, #calendar-legend .range::before{content:""; position:relative; background:#c30000; height:.6rem; border-radius:.2rem;}
#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start:0"],#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start:-"],
#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start: 0"],#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start: -"],
#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start:0"],#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start:-"],
#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start: 0"],#IPO-calendar>div.ipo-record>*:not(.opening):not(.range)[style*="grid-column-start: -"]{display:none;}
#IPO-calendar>div.ipo-record>*.range{grid-column-start:1; width:calc(100% - 1em); margin-left:0; position:relative; z-index:1;}
#IPO-calendar>div.ipo-record>*.range::before{content:""; border-bottom:5px dotted #DDD; display:block; position:relative;}
#IPO-calendar>div.ipo-record.plan>*.list-day::before{background-image:url(/home/img/icon/list-day-plan.svg);}
#IPO-calendar>div.ipo-record.plan>*.range::before, #calendar-legend .range::before{border-radius:0; background:none; border-bottom:6px dotted #E4C296;}
#calendar-legend{font-size:.95rem; text-align:right; margin:2rem 0 0 0;}
#calendar-legend b{position:relative; font-weight:400; margin:0 0 0 1em;}
#calendar-legend b::before{background:none; display:inline-block; margin-right:.2rem; vertical-align:-.15em;}
#calendar-legend b.opening::before{width:1em; vertical-align:0;}
#calendar-legend b.range::before{width:1em; vertical-align:3px; border-width:3px;}
@media screen and (max-width:640px){
	#calendar-legend{text-align:left;}
	#calendar-legend b{font-weight:400; margin:0 1em .4em 0; display:inline-block;}
}
#hot-ipo{background: url(/home/img/tc/IPO/hot-ipo.jpg) no-repeat #fff center; background-size:cover; display:flex; flex-flow:column nowrap; align-items:center; padding:2rem; box-shadow:0 0 20px rgba(0,0,0,.05); position:relative;}
#hot-ipo>*{display:block; margin:0; width:100%; text-align:center;}
#hot-ipo>strong{font-size:2.2rem; color:#d80040; margin-top:auto; padding:.25em; line-height: 100%;}
#hot-ipo>small{font-size:0rem; color:#666; margin-bottom:auto; word-break:keep-all;}
#hot-ipo>a{width:auto; margin:.5em auto auto auto; padding:.4em 1.5em; font-size:1.2rem; color:#FFF; background:rgba(0,0,0,.6); border-radius:2px;}
#hot-ipo>a>b{padding:0 .15em;}
@media screen and (max-width:480px){
	#hot-ipo{padding:2em 1.5em;}
	#hot-ipo>small{font-size:0rem;}
	#hot-ipo>a{font-size:1.2rem; padding:.75em; width:100%;}
}
@media screen and (-ms-high-contrast: none), (-ms-high-contrast: active){
	#IPO-calendar{display:-ms-flexbox; -ms-flex-flow:column nowrap; align-items:flex-start;}
	#IPO-calendar>div#calendar-month>*{display:-ms-inline-flexbox; -ms-flex-flow:column;}
	#IPO-calendar>div#calendar-month>*:first-child{-ms-grid-column:1;}
	#IPO-calendar>div#calendar-month>*:last-child{grid-column-end:21;}
	#IPO-calendar>div#calendar-day{display:-ms-flexbox; -ms-flex-flow:row nowrap;}
	#hot-ipo{display:-ms-flexbox; -ms-flex-flow:column nowrap;}	
	#IPO-calendar>div{display:-ms-grid; -ms-grid-columns:5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5% 5%;}
	#IPO-calendar>div>*{-ms-grid-row:1; -ms-grid-row-span:1;}
	#IPO-calendar>div.ipo-record-type{-ms-grid-columns:100%;}
	#IPO-calendar>div.ipo-record>*.opening::before{top:-1.4em;}
	#IPO-calendar>div.ipo-record>*.opening::after{top:.5em;}
	#IPO-calendar>div.ipo-record>*:not(.opening){-ms-grid-column-span:1;}
	#IPO-calendar>div.ipo-record>*.range{-ms-grid-column:1;}
	#IPO-calendar>div.ipo-record>*.range::before{top:.4em;}
	#IPO-calendar>div.ipo-record>*.fas::before{margin:0 25%;}
}
#hint-rotate{display:none;}
@media screen and (orientation:portrait) and (max-width:480px){
	#hint-rotate{display:none; position:fixed; width:100vw; height:0; opacity:0; overflow:hidden; align-content:center; z-index:999999999; background:rgba(0,0,0,.75); font-size:24vw; color:#FFF;}
	#hint-rotate>*{display:inline-block; width:10rem; height:10rem; text-align:center; line-height:10rem; position:absolute; left:calc(50% - 5rem); top:calc(50% - 5rem); transform-origin:center;}
	#hint-rotate>*:nth-child(1){opacity:.1;}
	#hint-rotate>*:nth-child(2){opacity:.75; transform-origin:50% 60%; transform: rotate(90deg);}
	#hint-rotate>*:nth-child(3){transform:scale(.6) rotate(80deg);}
	#hint-rotate{animation:hint 8s;}
	#hint-rotate>*:nth-child(2){animation:hint-icon 3s ease-in 2;}
	#hint-rotate>*:nth-child(3){animation:hint-icon2 3s ease-in 2;}
}
@media screen and (max-width:768px){
	#custom-content{padding:0 1rem;}
	#IPO-calendar>div#calendar-month>*>*{max-width:calc(100vw - 2rem); margin:auto 0; text-align:center;}
	#IPO-calendar{box-shadow:inset -1em 0px 2em -1em rgba(0,0,0,.25);}
}
@media screen and (max-width:480px){
	#IPO-calendar{-webkit-mask-image:-webkit-gradient(linear, 75% 0%, 100% 0% , from(rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));}
	#IPO-calendar>div{padding-right:2rem !important;}
	#IPO-table thead{display:none;}
	#IPO-table td{display:block; text-align:left; padding:.5em;}
	#IPO-table tbody td:nth-child(1):not([colspan="10"]), #IPO-table tbody td:nth-child(2){display:inline-block; border-top:1px solid #EEE; height:4rem; padding-top:1em;}
	#IPO-table tbody td:nth-child(1){width:6rem;}
	#IPO-table tbody td:nth-child(2){width:calc(100% - 6rem);}
	#IPO-table tbody td s{width:.6em; display:inline-block; margin:.2em; border-left:0 none; border-bottom:1px solid #888; height:0; vertical-align:middle;}
	#IPO-table tbody td p{width:calc(100% - 8rem);}
	#IPO-table tbody td p:first-child{float:right;}
	#IPO-table tbody td p:not(:first-child){margin-left:8rem;}
	html #IPO-table tbody td::before{display:inline-block; width:8rem;}
	html[lang="tc"] #IPO-table tbody td:nth-child(3)::before{content:"招股時段";}
	html[lang="tc"] #IPO-table tbody td:nth-child(4)::before{content:"上市日期";}
	html[lang="tc"] #IPO-table tbody td:nth-child(5)::before{content:"價格（港元）";}
	html[lang="tc"] #IPO-table tbody td:nth-child(6)::before{content:"每手股數";}
	html[lang="tc"] #IPO-table tbody td:nth-child(7)::before{content:"孖展年利率";}
	html[lang="tc"] #IPO-table tbody td:nth-child(8)::before{content:"大華继显截止日";}
	html[lang="tc"] #IPO-table tbody td:nth-child(9)::before{content:"保薦人";}
	html[lang="tc"] #IPO-table tbody td:nth-child(10)::before{content:"超購倍數";}
	html[lang="sc"] #IPO-table tbody td:nth-child(3)::before{content:"招股时段";}
	html[lang="sc"] #IPO-table tbody td:nth-child(4)::before{content:"上市日期";}
	html[lang="sc"] #IPO-table tbody td:nth-child(5)::before{content:"价格（港元）";}
	html[lang="sc"] #IPO-table tbody td:nth-child(6)::before{content:"每手股数";}
	html[lang="sc"] #IPO-table tbody td:nth-child(7)::before{content:"孖展年利率";}
	html[lang="sc"] #IPO-table tbody td:nth-child(8)::before{content:"大華继显截止日";}
	html[lang="sc"] #IPO-table tbody td:nth-child(9)::before{content:"保荐人";}
	html[lang="sc"] #IPO-table tbody td:nth-child(10)::before{content:"超购倍数";}
	html[lang="en"] #IPO-table tbody td:nth-child(3)::before{content:"Offer Period";}
	html[lang="en"] #IPO-table tbody td:nth-child(4)::before{content:"Trading";}
	html[lang="en"] #IPO-table tbody td:nth-child(5)::before{content:"Price (HKD)";}
	html[lang="en"] #IPO-table tbody td:nth-child(6)::before{content:"Board Lot";}
	html[lang="en"] #IPO-table tbody td:nth-child(7)::before{content:"Indicative Interest Rate"; padding-right:1rem; vertical-align:middle;}
	html[lang="en"] #IPO-table tbody td:nth-child(8)::before{content:"UOBKH's Closing Date"; padding-right:1rem; vertical-align:middle;}
	html[lang="en"] #IPO-table tbody td:nth-child(9)::before{content:"Sponsor(s)";}
	html[lang="en"] #IPO-table tbody td:nth-child(10)::before{content:"Oversubscription";}
}
@keyframes hint{
	0% {height:100vmax;}
	5% {opacity:1;}
	95% {opacity:1;}
	100% {height:100vmax; opacity:0;}
}
@keyframes hint-icon{
	0% {transform: rotate(0deg); opacity:.25;}
	40% {transform: rotate(90deg);}
	80% {opacity:.75;}
	100% {transform: rotate(90deg);}
}
@keyframes hint-icon2{
	0% {transform:scale(.6) rotate(0deg);}
	20% {transform:scale(.6) rotate(0deg);}
	30% {transform:scale(.6) rotate(80deg);}
	100% {transform:scale(.6) rotate(80deg);}
}