@charset "utf-8";
/* CSS Document */

/*--------------------------------------reset 此區塊請勿更動*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, /*p, */blockquote, pre,
/*a, */abbr, acronym, address, big, cite, code,
del, dfn, em, /*img,*/ ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin:0; padding:0; border:0;
font-size:100%; font:inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content: ''; content:none;}
table { border-collapse:collapse; border-spacing:0;}
/*---------------------------------------------------------------------*/

a {color: #fff; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; 
/* for Firefox */hlbr:expression(this.onFocus=this.blur()); /* for IE */}
a:hover {text-decoration:none;}
a:focus{ -moz-outline-style: none;}
 *:focus{outline:none;}

body { background:#ebf6ef url(../images/hsbc_2019Q3_bg.jpg) center top no-repeat;}	

img {margin:0; padding:0; border:none;}
#head {width:960px; height:350px; margin:0 auto; padding:0;}
#head h1 { height:70px;background:url(../images/hsbc_h1.jpg) no-repeat}
#head h2 { height:280px;background:url(../images/hsbc_2019Q3_h2.jpg) no-repeat}

#head h1, #head h2, #head h3 {width:960px; margin:0; padding:0; text-indent:-9999px; left:0;}
#content {width:960px; margin:0 auto; padding:0; background:url(../images/cbg.gif) repeat-y;  text-align:left;}
#content .box a {display:block ;width:100% ;height:100%;}
#content .side img { margin-top:10px}
#content .side {float:left; width:250px; _width:245px; text-align:center;}


/* -----------------------------style1---------------------------- */
.style1 {height:597px; background:url(../images/hsbc_2019Q3_C1.jpg)}	
.style1 ol{padding:0 0 0 50px;}
.style1 strong{
 display:block; margin:100px 30px 8px 78px; line-height:20px; font-size:16px;}
.style1 li{display:block; margin:-2px 0px 0 20px; line-height:20px;}
.style1 li p {width:580px; display:block; font-size:16px; margin:5px 0 0 10px; text-indent:-13px;}
.style1 li p1 {margin:15px 0 0 0px; width:270px;}
.style1 li p2 {margin:15px 0 0 60px; width:280px;}
.style1 li p3 {width:600px; display:block; margin:280px 0 0 0px; padding:0 10px 0 10px; font-family:Arial,"新細明體"; font-size:13px;}
.style1 li .m2 {color:#F8070B;}

.style1 li .st3 a{ 
 width:50%; display:block; margin:20px 0px 18px 130px; padding:10px 10px; font-size:18px; font-family:Arial,"微軟正黑體"; line-height:22px;  text-align:center; 
 color:#ffffff;  background-color:#d8080d; border:1px solid #d8080d; border-radius:8px; text-decoration:none;}
.style1 li .st3 a:hover{background-color:#ff663f; border:1px solid #ff663f; color:#fffff;}


.style1 li p1, .style1 li p2
{ padding:0 10px 0 10px; float: left; font-family:Arial,"微軟正黑體"; font-size:16px; line-height:23px; font-weight: bold;}
.style1 strong, .style1 li p{font-family:Arial,"微軟正黑體"; color:#010101; }



/* -----------------------------note---------------------------- */
.note {
 margin:10px 20px; padding:10px 20px; background-color:#EBEBEB;
 font-size:0.8em;  line-height:1.6em; color:#666666;}
.note ol {margin:5px 0 10px 30px; padding:0; list-style:decimal;}
.note strong {font-weight:bold;}
.note li strong {color:#199700;}
.note li {margin:3px 0; padding:0;}
.note p {display:block; text-indent:-25px; padding:0px 0px 0px 25px; margin:0px;}
.note p1 {
 display:block; text-indent:-18px; 
 padding:5px 0px 5px 15px; margin:0px; font-weight:bold; color:#FB0206;}
.note a:link, .note a:visited { color:#bc630a; text-decoration: underline}
.note a:hover, .note a:active { text-decoration:none}
.warning {
 width:710px; height:70px; margin:0; padding:0; overflow:hidden; 
 text-indent:-2000px; background:url(../images/warn.gif) no-repeat;}
.warning a {display:block ;width:100% ;height:100% ;}

.note ol, .note li, .note strong, .note p1{font-family:Arial,"新細明體";}

/* -----------------------------最小寬度850px---------------------------- */

@media only screen and (min-width:850px) {
#content .main {
 width:710px; margin:0 0 0 250px; _margin:0 0 0 246px;
 padding:0;   background:#FFFFFF; position:relative;}
#content .box {
 width:710px; margin:0 auto; padding:0; 
 white-space:nowrap; overflow:hidden; position:relative;}	
#content .box p{text-indent:-9999px;}
#content .box ol{list-style:none;}
.style3 li .m1, .location{display:none;}
.style2 strong, .style3 strong, .style4 strong{display:none;}
.style1 li .m1{display:none;}
}


/* -----------------------------手機版型---------------------------- */
@media screen and (max-width:849px) {
*{box-sizing:border-box; }	
html,body{-webkit-text-size-adjust:none;}
#content {min-width:320px; margin: 0 auto;}
	
#head{
 background-image:url(../images/hsbc_2019Q3_960.jpg);
 height:auto; margin:0 auto; border:none;
 width:100%;  padding-bottom:45%; background-size:cover; 
 background-position:center center; text-indent:-9999px;}
	
h1, h2, h3 {display:none;}
#content .side,.ct2{display:none;}
#content {width:100%; height:100%; margin:0 auto;}
#content, .style1 {background:#9fcfd8;}	

/* -----------------------------.style1手機---------------------------- */
.style1 {height:100%;}	
.style1 strong{
 display:block; margin:-2px 30px 0 30px; padding:10px 20px 10px 30px;  background-color:#019dbe;
 font-family:Arial,"微軟正黑體";  line-height:20px; font-size:16px; color:#ffffff;}	
.style1 ol{margin:0 30px 20px 30px; padding:10px 30px 10px 30px; background-color:#ffffff;}
.style1 li p {width:100%; display:block; font-size:15px; text-indent:-13px; margin:5px 0 0 0; line-height:23px;}
	
.style1 li p1, .style1 li p2
{width:100%; display:block; margin:5px 0 0 0; padding:0 0; float:none; font-family:Arial,"新細明體"; font-size:15px; text-indent:-13px; font-weight:normal;}
.style1 li p3 {width:100%; display:block; margin:5px 0 0 0; font-size:13px;text-indent:-18px;}
.style1 li .m1 {font-size:15px; color:#010101;}
.style1 li .m2 {color:#F8070B;}
	
.style1 li .st3 a{ width:100%;  display:block; border-radius:8px; margin:10px 0px 18px 0px; padding:3px 3px; font-size:18px; line-height:35px; 
 color:#ffffff;  background-color:#d8080d; border:1px solid #d8080d; text-decoration:none;text-align:center;}
.style1 li .st3 a:hover{background-color:#ff663f; border:1px solid #ff663f; color:#fffff;}	
		
.style1 li p, .style1 li p3, .style1 li .m1 {font-family:Arial,"新細明體"; color:#010101;}


	
	
/*注意事項*/
.note {width:100%; margin:0 auto; padding:15px 20px;}
.warning {display:none;}
}


/*201908 串接新版左側MENU而做的修改*/
#content {
	background: none;
	background-color: #bf7a67;
}
#NAV, .pushy {
	font-family: verdana, "微軟正黑體" !important;
}
#NAV ul {
	margin: 0px 0 0 !important;
	font-size: 14px !important;
	font-weight: Verdana, "微軟正黑體" !important;
}
#NAV li {
	margin: 0 !important;
	padding: 0 10px !important;
}
#NAV li a {
	width: auto !important;
	height: auto !important;
	text-indent: 0 !important;
	text-align: left;
}
.main-con {
    padding:20px;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
}
.menu-box {
    clear: both;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
    padding:0 9px;
    width: 100%;
}
.menu-box:hover {
	background: #b14d32;
}
.menu-box a {
    width: 100%;
    display: table;
	padding: 15px 10px !important;
	border-bottom: 1px solid rgba(255, 229, 222, 0.2) !important;
}
.menu-pic {
    width: 25px;
    display: table-cell;
    vertical-align: middle;
}
.menu-box img {
	width: 100%;
	margin-top: 0px !important;
}
.menu-title {
    text-align: left;
    color:#ffffff;
    text-shadow: #ffffff 0em 0em 0em;
    font-size: 14px;
    line-height: 22px;
    display: table-cell;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 8px;
    vertical-align: top;
}
.menu-title span {
    color:#fff100;
    text-shadow: #fff100 0em 0em 0em;
}

	/*手機menu設定*/
	.pushy-index {
		font-size: 13px;
		color: #ffffff;
		text-align: right;
	}
	
	.pushy .pushy-index a {
		padding: 5px 10px 10px 10px;
		font-size: 13px;
		border: 0;
		font-family: Verdana,'微軟正黑體';
	}
	
	.icon-blankicon:after {
		content: "\e932";
		width: 13px;
		height: 13px;
		font-size: 11px;
		margin-left: 5px;
	}


	.pushy, .block-menu {
		background:#bf7a67 !important;
	}
	.main-bigtitle, .main-bigtitle span {
		color: #b14d32 !important;
	}
	.menu-btn {
		background:#b14d32 !important;
	}
	.pushy a:hover {
		background:#b14d32 !important;
	}
	.main-but a, .main-smalltitle a {
		background:#b14d32 !important;
		box-shadow: 0px 2px 0px #b14d32 !important;
	}
	.main-but a:hover, .main-smalltitle a:hover {
		background:#bf7a67 !important;
		box-shadow: 0px 2px 0px #b14d32 !important;
	}
	
@media screen and (max-width: 768px) {
	.menu-box {padding: 0;}
	.menu-pic {display: none;}
	.menu-title {padding: 0;}
}