@font-face {
    font-family: 'Flama';
    src: url('../fonts/Flama-Light.woff2') format('woff2'),
        url('../fonts/Flama-Light.woff') format('woff'),
		url('Flama-Medium.woff2') format('woff2'),
		url('Flama-Medium.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
html, body {
	margin:0 auto;
	padding:0;
	background-color:#f9f8f5;
	font-family: 'Open Sans', sans-serif, "Microsoft JhengHei", "微軟正黑體", "Monotype Hei", "蒙納黑體", "PingFang HK";
	font-size:16px;
	max-width:1920px;
	min-width:355px;
	overflow-x:hidden;
}
a:hover {
	text-decoration:underline;
}
#animation_container {
	margin:0 auto;
	padding:150px 0 0 0;
	position:relative;
	max-width:1920px;
	background-color:#f9f9f6;
}

.desktop {
	display:block;
}
.quote.desktop {
	display:inline-block;
}
.mobile, .ceo-mobile, .quote-mobile {
	display:none;
}
.landing-mobile {
	margin:0;
	padding:70px 0 0 0;
	position:relative;
}
.mobile.landing-mobile {
	padding-top:0;
}
.landing-mobile img {
	width:100%;
	display:inline-block;
}
.header {
	margin:0 auto;
	padding:0;
	max-width:1920px;
	position:fixed;
	border-bottom:7px solid #34a344;
	line-height: 0;
	background-color:#fff;
	top:0;
	width:100%;
	z-index:100;
}
.header a.logo {
	margin:0;
	padding:0;
}

.pageFramework01 {
	margin:0 auto;
	padding:0;
	max-width:1920px;
	overflow:hidden;
}
.sFont {
    /*font-size: 85%;*/
	font-size:87.5%;
}
.dFont {
    font-size: 100%;
}
.bFont {
    /*font-size: 125%;*/
	font-size:112.5%;
}
.lang-nav {
    margin: 0;
    padding: 0;
	position:absolute;
	top:35px;
	right:24px;
	z-index:10;
}
.lang-nav ul {
	list-style-image:none;
	list-style-type:none;
	margin:0;
	padding:0;
}
.lang-nav ul:after {
	clear:both;
	content:".";
	display:block;
	height:0pt;
	visibility:hidden;
}
.lang-nav ul li {
	margin:0px;
	padding: 0 11px 0 0;
	float: left;
	color:#10110f;
	vertical-align: top;
	line-height: 1.3em;
	display: inline;
}
.lang-nav ul li.first {
	padding-left:0;
	min-width: 40px;
}
.lang-nav ul li.lang {
	margin-top:0px;
	padding-right:0;
	margin-left: 11px;
	/*font-family: PMingLiu;*/
	font-family: sans-serif, "Microsoft JhengHei", "微軟正黑體", "Monotype Hei", "蒙納黑體", "PingFang HK";
}
.lang-nav ul li.lang a.lang-padding {
	padding-left:5px;
}
.lang-nav ul li.separator {
	border-right:1px solid #b3b3b2;
}
.lang-nav ul li a {
	color:#10110f;
	margin:0px;
	padding:0px 0px 0px 0px;
	text-decoration:none;
}
.lang-nav ul li a:hover{
	text-decoration:underline;
}
.lang-nav ul li a.smallFont {
	font-size: 87.5%;
	cursor: pointer;
}
.lang-nav ul li a.defaultFont {
	font-size: 100%;
	cursor: pointer;
}
.lang-nav ul li a.bigFont {
	font-size: 125%;
	cursor: pointer;
}
.lang-nav ul li a.selected {
	text-decoration: underline;
}
.lang-nav ul li a:hover {
	color: #000;
}
.lang-nav ul li a.home:hover {
	color:#fff;
}
.lang-nav p {
	margin:0;
	padding:10px 0 0 0;
	text-align:right;
	color:#10110f;
	font-size:75%;
}
.lang-nav p.report-features {
	padding-bottom:10px;
	text-align:left;
}
.hsbc-logo {
	width: 140px;
}

p.stockcode {
	margin:0;
	padding:0;
	font-size:87.5%;
}
.title-container {
	margin:0;
	padding:0;
	position:absolute;
	top:180px;
	left:5.83%;
	z-index:10;
	-webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    transform-origin: top left;
    -ms-transform-origin: top left;
}
.mobile.title-container {
	position:relative;
	top:auto;
	left:auto;
	margin:100px 0 10px 0;
	padding:0 5.83%;
}
.title-container h1 {
	margin:0;
	padding:0;
	font-family:'Flama', Arial;
	font-size:375%;
	font-weight:100;
	color:#4aa147;
	line-height:1.1em;
}
.lang-tc .title-container h1 {
	font-family: 'Open Sans', sans-serif, "Microsoft JhengHei", "微軟正黑體", "Monotype Hei", "蒙納黑體", "PingFang HK";
	font-weight: 400;
}
.mobile.title-container h1 {
	font-size:220%;
}
.title-container p {
	margin:0;
	padding:0;
	font-size:175%;
	color:#58595b;
}
.mobile.title-container p {
	font-size:125%;
}
.title-container p.year {
	font-size:262.6%;
}
.mobile.title-container p.year {
	margin-top:-5px;
	font-size:150%;
}

.function-container {
	margin:0;
	padding:0;
	position:absolute;
	/*top:400px;*/
	top: 320px;
	left:5.83%;
	z-index:10;
	-webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    transform-origin: top left;
    -ms-transform-origin: top left;
}
.function-container p {
	font-size:112.5%;
	font-weight:bold;
}
.function-container-mobile {
	margin:0;
	padding:10px 0 0 0;
}

.function-container ul, .function-container-mobile ul {
	margin:0;
	padding:0;
	list-style-type:none;
    flex-direction: column;
    align-items: flex-start !important;
}
.function-container ul li {
	margin:0;
	padding:30px 0 30px 60px;
}
.function-container-mobile ul li {
	/*padding:15px 0 20px 60px;*/
	padding:15px 0 20px 58px;
}
.function-container ul li.icon1, .function-container-mobile ul li.icon1 {
	background: url('../images/icon-snapshot.png') no-repeat top left transparent;
}
.function-container-mobile ul li.icon1 {
	background-size:35px 53px;
}
.function-container ul li.icon2, .function-container-mobile ul li.icon2 {
	/*background: url('../images/icon-fullreport.png') no-repeat top left transparent;*/
	background: url('../images/icon-fullreport.png') no-repeat center left transparent;
}
.function-container-mobile ul li.icon2 {
	background-size:35px 53px;
}
.function-container ul li.icon3, .function-container-mobile ul li.icon3 {
	/*margin-top:30px;*/
	/*padding-top:0;*/
	/*background: url('../images/icon-feedback.png') no-repeat top left transparent;*/
	background: url('../images/icon-envelope.png') no-repeat center left transparent;
}
.function-container-mobile ul li.icon3 {
	background-size:35px 21px;
}
.function-container ul li a {
	margin:0;
	padding:0;
	color:#000;
	/*font-size:112.5%;*/
	text-decoration:none;
}
.function-container-mobile ul li a {
	font-size:100%;
}
.function-container ul li a:hover, .function-container-mobile ul li a:hover {
	text-decoration:underline;
}
p.down-arrow.unactive{
	/*display:none;*/
	visibility: hidden;
	opacity: 0;
}
p.down-arrow {
	transition: all 0.8s;
	margin:0;
	padding:0 0 10px 0;
	position:absolute;
	left:0;
	bottom:0px;
	text-align:center;
	width:100%;
	-webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    transform-origin: top left;
    -ms-transform-origin: top left;
	z-index:2;
	opacity: 1;
}
p.down-arrow a {
	padding:0;
	text-decoration:none;
}
p.down-arrow a img {
	max-width:69px;
}

/*
.ceo-msg-container {
	margin:0;
	padding:0 5.83%;
	background: url('../images/bg-ceo.jpg') no-repeat left top transparent;
	max-height:610px;
	background-size: cover;
	position:relative;
}
.ceo-msg-container h2 {
	margin:0;
	padding:0;
	font-family:'Flama';
	font-size:300%;
	font-weight:100;
	color:#4aa147;
}
.ceo-msg-container p {
	margin:0;
	padding:10px 0 0 40px;
	font-size:150%;
	color:#000;
}
.ceo-msg-row {
	margin:0 auto;
	padding:69px 0 0 0;
	max-width:1240px;
	position:relative;
}
.ceo-msg-row:after {
	clear:both;
	content:".";
	display:block;
	height:0pt;
	visibility:hidden;
}
.ceo-msg-row .ceo-msg-left-col {
	margin:0;
	padding:0;
	float:left;
	width:32%;
	border-right:1px solid #878786;
}
.ceo-msg-row .ceo-msg-left-col img {
	width:100%;
	max-width:401px;
	display:block;
}
.ceo-msg-row .ceo-msg-right-col {
	margin:0;
	padding:6% 0 0 2.39%;
	float:left;
	width:64.95%;
}
.ceo-msg-row .ceo-msg-right-col p.msg {
	background: url('../images/double-quote.png') no-repeat left 20px transparent;
	width:73%;
}
.ceo-msg-row .ceo-msg-right-col p img.quote {
	padding-left:20px;
}
.ceo-msg-row p.view-msg-p {
	padding-top:20px;
	color:#000;
}
.ceo-msg-row a.view-msg {
	margin:0;
	padding:0 30px 0 0;
	position:absolute;
	right:0;
	bottom:56px;
	background: url('../images/view-arrow.png') no-repeat right 5px transparent;
	font-size:62.5%;
	color:#000;
	text-decoration:none;
}
*/


.ceo-msg-container {
	margin:0;
	padding:0;
	position:relative;
	background: url('../images/bg-ceo.jpg') no-repeat right top transparent;
	background-size: cover;
}
.ceo-msg-container h2 {
	margin:0;
	padding:0;
	font-family:'Flama', Arial;
	font-size:137.5%;
	font-weight:100;
	color:#4aa147;
}
.lang-tc .ceo-msg-container h2 {
	font-family: 'Open Sans', sans-serif, "Microsoft JhengHei", "微軟正黑體", "Monotype Hei", "蒙納黑體", "PingFang HK";
	font-weight: 500;
}
.ceo-msg-container p {
	margin:0;
	padding:10px 0 0 40px;
	font-size:150%;
	color:#000;
}
.ceo-msg-row {
	margin:0;
	padding:0;
	position:relative;
}
.ceo-msg-row:after {
	clear:both;
	content:".";
	display:block;
	height:0pt;
	visibility:hidden;
}
.ceo-msg-row .ceo-msg-left-col {
	margin:0;
	padding:0;
	float:left;
	width:41.82%;
}
.ceo-msg-row .ceo-msg-right-col {
	margin:0;
	padding:5%;
	float:left;
	width:48.18%;
}
.ceo-msg-row .ceo-msg-left-col img {
	width:100%;
	max-width:803px;
	display:block;
}
.ceo-msg-row .ceo-msg-right-col p.msg {
	background: url('../images/double-quote.png') no-repeat left 14px transparent;
	width:77%;
	font-weight: 300;
}
.ceo-msg-row .ceo-msg-right-col p img.quote {
	padding-left:20px;
}
.ceo-msg-row p.view-msg-p {
	padding-top:20px;
	color:#000;
}
.ceo-msg-row a.view-msg {
	margin:0 7% 0 0;
	padding:0 22px 0 0;
	position:absolute;
	right:0;
	bottom:56px;
	background: url('../images/view-arrow@2x.png') no-repeat right 7px transparent;
	background-size:17px 14px;
	font-size:75%;
	color:#000;
	text-decoration:none;
}



.section-container {
	margin:0;
	padding:103px 11.71% 0;
	background: url('../images/bg-section.jpg') repeat-y left top transparent;
	background-size:cover;
}
.section-container .section-row {
	margin:0 auto;
	padding:0;
}
.section-container .section-row:after {
	clear:both;
	content:".";
	display:block;
	height:0pt;
	visibility:hidden;
}
.section-container .section-row .section-col {
	margin:0 1.56% 3.12%;
	padding:0;
	width:308px;
	height:489px;
	border:1px solid #a2a1a1;
	position:relative;
	background-color:#f6f5f1;
	float:left;
}
.section-container .section-row .section-col p {
	margin:0;
	padding: 0;
	padding-left: 2px;
	padding-right: 2px;
	text-align:center;
	font-size:172%;
}
.section-container .section-row .section-col img.section-img {
	padding-top:125px;

}
.section1 img.section-img {
	max-width:147px;
}

.section-container .section-row .section-col img.section-go {
	margin:0;
	padding:0;
	position:absolute;
	bottom:0;
	right:0;
	z-index:1;
}
.section-container .section-row .section-col .section a.clickable {
	margin:0;
	padding:0;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
}
.section-container .section-row .section-col.section1 p {
	color:#b28036;
}
.section-container .section-row .section-col.section2 p {
	color:#128870;
}
.section-container .section-row .section-col.section3 p {
	color: #9853A1;
}
.section-container .section-row .section-col.section4 p {
	color: #879B20;
}
.section-container .section-row .section-col.section5 p {
	color:#e1368a;
}
.section-container .section-row .section-col.section6 p {
	color: #CE772E;
}
.section-container .section-row .section-col.section7 p {
	color:#f37f47;
}
.section-container .section-row .section-col.section8 p {
	color:#03a532;
}
.section-container .section-row .section-col.section9 p {
	color: #68448E;
}
.section-container .section-row .section-col.section10 p {
	color: #0093A4;
}
.section-container .section-row .section-col.section11 p {
	color:#b52a4e;
}
.section-container .section-row .section-col.section12 p {
	color: #064792;
}
.section-container .section-row .section-col .section-content {
	margin:0;
	padding:0;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:3;
}
.section-container .section-row .section-col .section-content a.close {
	margin:0;
	padding:0;
	position:absolute;
	top:13px;
	right:10px;
	left:auto;
}

.section-container .section-row .section-col .section-content p.section-title {
	margin:0;
	padding:40px 0 9px 0;
	/*font-size:175%;*/
	font-size:113%;
	color:#fff;
	text-decoration:underline;
	line-height:1.2em;
}
.section-container .section-row .section-col #section-content1 {
	background-color:#b28036;
}
.section-container .section-row .section-col #section-content2 {
	background-color:#128870;
}
.section-container .section-row .section-col #section-content3 {
	background-color: #9853A1;
}
.section-container .section-row .section-col #section-content4 {
	background-color: #879B20;
}
.section-container .section-row .section-col #section-content5 {
	background-color:#e1368a;
}
.section-container .section-row .section-col #section-content6 {
	background-color: #CE772E;
}
.section-container .section-row .section-col #section-content7 {
	background-color:#f37f47;
}
.section-container .section-row .section-col #section-content8 {
	background-color:#03a532;
}
.section-container .section-row .section-col #section-content9 {
	background-color: #68448E;
}
.section-container .section-row .section-col #section-content10 {
	background-color: #0093A4;
}
.section-container .section-row .section-col #section-content11 {
	background-color:#b52a4e;
}
.section-container .section-row .section-col #section-content12 {
	background-color: #064792;
}

.section-container .section-row .section-col .section-content p.more-p {
	color:#fff;
	text-align:right;
	position:absolute;
	right:20px;
	bottom:20px;
	width:200px;
}
.section-container .section-row .section-col .section-content a.more {
	margin:0;
	padding:0 25px 0 0;
	background: url('../images/more.png') no-repeat right 3px transparent;
	font-size:0.5em;
	color:#fff;
	font-weight:bold;
	text-decoration:underline;
}
.section-container .section-row .section-col .section-content ul {
	margin:20px 0 0 0;
	padding:0 20px;
	list-style:none;
}
.section-container .section-row .section-col .section-content ul li {
	margin:0;
	padding:0 0 30px 30px;
	background: url('../images/section-bullet.png') no-repeat left top transparent;
	color:#fff;
	/*font-size:88%;*/
	font-size: 100%;
	line-height:1.3em;
}
.section-container .section-row .section-col .section-content ul li span {
	font-size:112%;
	font-weight:bold;
}

#section-content1 li,
#section-content2 li,
#section-content4 li {
	/*line-height: 3em;
    background-position: left .8em;*/
    line-height: 2.3em;
    background-position: left .5em;
}

.transform-container {
	margin:0;
	padding:50px 11.71% 50px;
	background: url('../images/bg-transform.jpg') no-repeat left top transparent;
	background-color:#fbfbfa;
	background-size:cover;
}
.transform-container h2 {
	margin:0;
	padding:0 0 38px;
	font-family:'Flama', Arial;
	font-size:300%;
	font-weight:100;
	color:#4aa147;
	text-align:center;
}
.lang-tc .transform-container h2 {
	font-family: 'Open Sans', sans-serif, "Microsoft JhengHei", "微軟正黑體", "Monotype Hei", "蒙納黑體", "PingFang HK";
	font-weight: 400;
}
.transform-container p {
	margin:0 auto;
	padding:0 20px;
	/*font-size:87.5%;*/
	text-align:center;
	color:#231f20;
}
.transform-container p.desc {
	max-width:547px;
}
p.desc span {
	display: block;
}
.transform-container p.circle {
	margin:0;
	padding:30px 0 0 0;
}
.transform-container p.full-version {
	margin:0;
	padding:30px 0 0 0;
}
.transform-container p.full-version a {
	color:#4aa147;
}

.footer-container {
	margin:0;
	padding:0 0 35px;
	background-color:#eeeeee;
}
.footer-container .footer {
	margin:0 4.48%;
	padding:15px 0 0 0;
}
.footer-container .footer:after {
	clear:both;
	content:".";
	display:block;
	height:0pt;
	visibility:hidden;
}
.footer-container .footer p {
	margin:0;
	padding:0;
	font-size:75%;
}
.footer-container .footer p.stockcode {
	font-size:62.5%;
}
.footer-container .footer p a {
	color:#231f20;
}
.footer-container .footer .footer-col-left {
	margin:0;
	padding:0;
	float:left;
	width:50%;
}
.footer-container .footer p {
	font-family:Arial,"Microsoft JhengHei","微軟正黑體",Verdana,Helvetica,sans-serif !important;
	padding-bottom:5px;
}
.footer-container .footer .footer-col-right {
	margin:0;
	padding:0;
	float:left;
	width:50%;
}
.footer-container .footer .footer-col-right p {
	text-align:right;
}

.float_menu{
	background-color: rgba(97, 97, 99, .9);
	padding:20px 0 20px 30px;
	position:absolute;
	left:-256px;
	top:0;
	-webkit-box-shadow: 5px 0px 14px -4px rgba(93,93,95,0.7);
	-moz-box-shadow: 5px 0px 14px -4px rgba(93,93,95,0.7);
	box-shadow: 5px 0px 14px -4px rgba(93,93,95,0.7);
	z-index:10;
	min-width:270px;
	min-height:323px;
}
.float_menu.active{
	left:0px !important;
}
.float_menu_arrow{
	position:absolute;
	top:90%;
	right:15px;
	transform: translateY(-50%);
	z-index:2;
}
.sidebar_text{
	position:absolute;
	top:0;
	right:0;
	color:#fff;
	z-index:2;
}
.sidebar_text img {
	color:#fff;
}
.float_menu_arrow span{
	width:17px;
	height:50px;
	background: url('../images/arrow_right.png') no-repeat center center;
	display: block;
}
.sidebar_button{
	width:44px;
	height:100%;
	position:absolute;
	top:0px;
	right:0px;
	z-index:8;
}
.sidebar_button a{
	display:block;
	height:100%;
	color:#ffffff;
}
.sidebar_button.bg{
	background-color: rgba(99, 99, 99, .9);
	z-index:1;
}

.float_menu_arrow span.inactive{
	background: url('../images/arrow_left.png') no-repeat center center;
}
.float_menu_padding{
	padding-right:35px;
}
.float_menu .headertitle{
	font-size:75%;
	font-weight:bold;
	padding-bottom:0;
}
.float_menu p, .float_menu a{
	font-size: 87.5%;
	color:#ffffff;
	margin:0;
	padding:0;
	text-decoration:none;
	display:block;
}
.float_menu ul{
	margin:0 0 0 56px;
	padding:0;
	list-style:none;
}
.float_menu ul li {
	padding-top:10px;
	padding-left:40px;
	padding-bottom:20px;
	border-bottom:1px solid #fff;
}
.arrow{
	margin: 0 auto;
    position: absolute;
    bottom: 0;
    z-index: 6;
	left:49%;
    text-align:center;
	width:2%;
	cursor:pointer;
}
.arrow.active img{
	-ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

/*
.pp-easing {
    -webkit-transition: all 1000ms cubic-bezier(0.550, 0.085, 0.000, 0.990);
    -moz-transition: all 1000ms cubic-bezier(0.550, 0.085, 0.000, 0.990);
    -o-transition: all 1000ms cubic-bezier(0.550, 0.085, 0.000, 0.990);
    transition: all 1000ms cubic-bezier(0.550, 0.085, 0.000, 0.990);
    
    -webkit-transition-timing-function: cubic-bezier(0.550, 0.085, 0.000, 0.990);
    -moz-transition-timing-function: cubic-bezier(0.550, 0.085, 0.000, 0.990);
    -o-transition-timing-function: cubic-bezier(0.550, 0.085, 0.000, 0.990);
    transition-timing-function: cubic-bezier(0.550, 0.085, 0.000, 0.990);
}
.stick{
	position:fixed;
	top:0;
}
*/

.content .border_bottom {
	border-bottom:1px solid #ffffff;
}
.border_bottom {
	padding:7px 0;
}
.box-middle ul li.item1{
    background: url("../../common/images/function-icon1.png") no-repeat left 8px;
}
.box-middle ul li.item2{
    background: url("../../common/images/function-icon2.png") no-repeat left 8px;
}
.box-middle ul li.item3{
    background: url("../../common/images/function-icon3.png") no-repeat left 8px;
}
img.menu, img.cross {
	width:30px;
}

.oneLine {
	display:block;
}

.sidenav {
	margin:0;
	padding:0;
	position:absolute;
	top:34px;
	right:0;
	/*width:121px;*/
	/*width: 96px;*/
	box-shadow: 1px 1px 11px 0 #ccc;
	background-color:#fff;
	border-radius:7px;
	max-height:0;
	transition: all 0.4s linear;
	-webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	overflow: hidden;
}
.sidenav ul {
	/*margin:0;
	padding: 6px;*/
	margin: 6px;
}
.sidenav.mobilenav {
	width: 200px;
}
.sidenav.mobilenav.slidein {
	max-height: 330px;
}
.sidenav.slidein {
	max-height: 50px;
	/*
	-webkit-animation-duration: 0.8s;
	-webkit-animation-name: slidein;
	
	-moz-animation-duration: 0.8s;
	-moz-animation-name: slidein;
	
	-o-animation-duration: 0.8s;
	-o-animation-name: slidein;
	
	animation-duration: 0.8s;
	animation-name: slidein;
	
    -webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
	*/
}
.sidenav > div > ul {
    display: flex;
    justify-content: center;
    align-items: center;
}
.sidenav.mobilenav > div > ul {
	justify-content: flex-end;
}
.sidenav.slideout {
	/*
	-webkit-animation-duration: 0.8s;
	-webkit-animation-name: slideout;
	
	-moz-animation-duration: 0.8s;
	-moz-animation-name: slideout;
	
	-o-animation-duration: 0.8s;
	-o-animation-name: slideout;
	
	animation-duration: 0.8s;
	animation-name: slideout;
	
    -webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
	*/
}

.no-bold {
	font-size: inherit !important;
	font-weight: inherit !important;
}

.large-line-height {
	/*line-height: 2.5em;*/
}

/*slidein*/
@-webkit-keyframes slidein {
	from {
		right:-255px;
	}

	to {
		right:0px;
	}
}

@-moz-keyframes slidein {
	from {
		right:-255px;
	}

	to {
		right:0px;
	}
}
@-o-keyframes slidein {
	from {
		right:-255px;
	}

	to {
		right:0px;
	}
}
@keyframes slidein {
	from {
		right:-255px;
	}

	to {
		right:0px;
	}
}

/*slideout*/
@-webkit-keyframes slideout {
	from {
		right:0px;
	}

	to {
		right:-255px;
	}
}

@-moz-keyframes slideout {
	from {
		right:0px;
	}

	to {
		right:-255px;
	}
}
@-o-keyframes slideout {
	from {
		right:0px;
	}

	to {
		right:-255px;
	}
}
@keyframes slideout {
	from {
		right:0px;
	}

	to {
		right:-255px;
	}
}

@media only screen and (max-width: 1919px) {
	.section-container .section-row {
		max-width:1030px;
	}
	
}

@media only screen and (max-width: 1356px) {
	.section-container .section-row {
		max-width:665px;
	}
}
/*@media only screen and (max-width: 1340px) {
	.section-container .section-row {
		max-width:665px;
	}
}*/

@media only screen and (max-width: 1050px) {
	.ceo-msg-row .ceo-msg-right-col {
		padding-top:4%;
		padding-bottom:0;
	}
}

@media only screen and (max-width: 1035px) {
	.ceo-msg-row a.view-msg {
		bottom:26px;
	}
}


@media only screen and (max-width: 880px) {
	/*
	.section-container .section-row {
		max-width:320px;
	}
	*/
	.section-container {
		/*padding-left:12%;*/
		padding-left:5.71%;
		padding-right:5.71%;
	}
}


@media only screen and (max-width: 1280px) {
	#animation_container {
		padding-top:130px;
	}
	.ceo-msg-container p {
		font-size:125%;
	}
	.function-container ul li a {
		font-size:150%;
	}
	.ceo-msg-row a.view-msg {
		background-position:right 5px;
	}
}

@media only screen and (max-width: 930px) {
	.ceo-desktop {
		display:none !important;
	}
	.ceo-mobile {
		display:block !important;
		width:100%;
	}
	.ceo-msg-row .ceo-msg-left-col {
		width:100%;
	}
	.ceo-msg-row .ceo-msg-right-col {
		padding:28px 0;
		width:100%;
	}
	.ceo-msg-row .ceo-msg-left-col img {
		max-width:none;
	}
	.ceo-msg-container {
		background:none;
		background-color:#e2e2e2;
	}
	.ceo-msg-container h2 {
		text-align:center;
	}
	.ceo-msg-container p {
		padding-left:0px;
	}
	.ceo-msg-row .ceo-msg-right-col p.msg {
		text-align:center;
		background:none;
		width:75%;
		margin:0 auto;
	}
	.quote-mobile {
		display:inline-block;
	}
	.ceo-msg-row .ceo-msg-right-col p img.quote {
		padding-left:10px;
	}
	.quote1 {
		padding-right:10px;
	}
	.quote.desktop {
		display:none;
	}
	.ceo-msg-row a.view-msg {
		position:static;
	}
	.ceo-msg-row p.view-msg-p {
		padding-top:40px;
		text-align:center;
	}
}

@media only screen and (max-width: 768px) {
	html, body {
		background-color:#fdfdfc;
	}
	p.desc span {
		display: inline;
	}
	.ceo-msg-row a.view-msg{
		margin:0;
	}
	.transform-container h2{
		font-size:220%;
	}
	.ceo-msg-row .ceo-msg-right-col p.msg{
		width:77%;
	}
	.desktop {
		display:none;
	}
	.mobile {
		display:block;
	}
	#animation_container {
		padding-top:20px;
	}
	.header {
		border-bottom:4px solid #34a344;
	}
	.header a.logo img {
		width:297px;
		height:60px;
	}
	.lang-nav {
		top:15px;
		right:13px;
	}
	.ceo-msg-container h2 {
		font-size:112.5%;
	}
	/*
	.ceo-msg-container p {
		font-size:87.5%;
	}
	*/
	.ceo-msg-row a.view-msg {
		position:relative;
		bottom:auto;
		/*font-size:100%;*/
	}
	p.view-msg-p {
		margin:0;
		padding:0 0 10px;
		text-align:right;
	}
	.section-container {
		background: url('../images/bg-section-mobile.jpg') repeat-y left top transparent;
	}
	.function-container {
		display:none;
	}
	.section-container {
		
	}
	.section-container .section-row {
		max-width:none;
		/*
		-webkit-transform-origin: top left;
		-moz-transform-origin: top left;
		transform-origin: top left;
		-ms-transform-origin: top left;
		*/
		margin:0 auto;
		/*width:545px;*/
	}
	.section-container .section-row .section-col {
		margin-bottom:30px;
		width:263px;
		height:416px;
	}
	/*
	.section-container .section-row .section-col .section-content p.section-title {
		font-size:3.5vw;
	}
	.section-container .section-row .section-col .section-content ul li {
		font-size:1.5vw;
	}
	*/
	.section-container .section-row .section-col img.section-img {
		padding-top:30%;
		/*width:70%;*/
		max-width: 100%;
		max-height: 120px;
	}
	/*
	.section-container .section-row .section-col p {
		font-size:4vw;
	}
	*/
	p.down-arrow a {
		font-size:75%;
	}
	.sidebar_text img {
		width:30px;
	}
	.float_menu_arrow, .float_menu_arrow span.inactive {
		right:5px;
	}
	.float_menu_arrow span, .float_menu_arrow span.inactive {
		background-size:30px;
	}
	.float_menu {
		left:-272px;
		min-height:100px;
	}
	p.down-arrow {
		bottom:0px;
	}
	.section-container .section-row .section-col .section-content p.more-p {
		right:10px;
		bottom:10px;
	}
	p.stockcode {
		top:70px;
		font-size:75%;
	}
	p.down-arrow a img {
		margin:0 auto;
		max-width:60px;
	}
	.ceo-msg-container h2 {
		font-weight:bold !important;
	}
	.section-container .section-row .section-col .section-content ul li {
		padding-bottom:20px;
		padding-left:22px;
		font-size:1.6vw;
		background-size:16px;
	}
	.section-container .section-row .section-col .section-content p.section-title {
		padding-bottom:0;
		font-size:3.5vw;
	}
}

@media only screen and (max-width: 700px) {
	.section-container .section-row .section-col .section-content ul li {
		padding-bottom:20px;
		padding-left:22px;
		font-size:1.6vw;
		background-size:16px;
	}
	.section-container .section-row .section-col .section-content p.section-title {
		padding-bottom:0;
		font-size:3.5vw;
	}
	
}

@media only screen and (max-width: 500px) and (min-width: 220px) {
	p.down-arrow a img{
		max-width: 28px;
	}
	.section-container {
		padding-top:40px;
	}
	.section-container .section-row {
		width:430px;
	}
	.section-container .section-row .section-col {
		margin-bottom:30px;
	}
	.section-container .section-row .section-col p {
		font-size:6vw;
	}
	.sFont .section-container .section-row .section-col p {
		font-size: 5.25vw;
	}
	.bFont .section-container .section-row .section-col p {
		font-size: 6.75vw;
	}
	.section-container .section-row .section-col img.section-img {
		padding-top:40%;
	}
	.section-container .section-row .section-col .section-content ul li {
		padding-bottom:10px;
		padding-left:20px;
		background-size:15px;
		font-size:3.3vw;
	}
	.sFont .section-container .section-row .section-col .section-content ul li {
		font-size: 2.8875vw;
	}
	.bFont .section-container .section-row .section-col .section-content ul li {
		font-size: 3.7125vw;
	}
	.section-container .section-row .section-col .section-content p.section-title {
		padding-top:25px;
		font-size:6vw;
		line-height:1.1em;
	}
	.section-container .section-row .section-col .section-content a.close {
		top:10px;
	}
	.section-content a.close img {
		width:20px;
	}
	.section-container .section-row .section-col .section-content a.more {
		background-position:right 3px;
	}
	p.down-arrow a {
		margin:0;
		padding:0;
		font-size:2.2vw;
		background-position:left 3px;
		background-size:13px 7px;
	}
	.section-container {
		padding-top:50px;
		padding-bottom:40px;
	}
	.ceo-msg-row a.view-msg {
		margin-right:0;
	}
	.section-container .section-row .section-col .section-content ul {
		margin-top:10px;
		padding:0 10px;
	}
	.twoLine {
		display:block;
	}
	
}

@media only screen and (max-width: 420px){
	.transform-container h2{
		font-size:170%;
	}
	.section-container .section-row {
		width:263px;
	}
	
}

@media only screen and (max-width: 375px){
	.section-container .section-row {
		width:263px;
	}
	.mobile.title-container h1 {
		font-size:175%;
	}
	.mobile.title-container p {
		font-size:100%;
	}
	.mobile.title-container p.year {
		font-size:125%;
	}
}

@media only screen and (max-width: 320px){
	.section-container .section-row {
		width:320px;
	}
}

@media all and (orientation:portrait) {
/* Style adjustments for portrait mode goes here */
}

@media all and (max-width: 768px) and (orientation:landscape) {
  .landing-mobile {
	  display:none;
  }
  .landing-desktop {
	  display:block;
  }
  #animation_container {
	  padding-top:100px;
  }
}

/* iPhone XS + XS Max */
@media only screen and (min-device-width: 375px) and (max-device-width: 414px) and (orientation: landscape) {
	.ceo-mobile {
		display: none !important;
	}

	.ceo-mobile-landscape {
		display: block !important;
		width: auto !important;
		margin: 0 auto;
		max-height: calc(100vh - 60px);
	}
}