@charset "UTF-8";
.banner_area {
  position: relative;
  width: 100%;
  margin-bottom: 0px;
}

.banner_area .banner_img {
  position: relative;
  width: 100%;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: transform 15s ease;
  -moz-transition: transform 15s ease;
  -o-transition: transform 15s ease;
  transition: transform 15s ease;
}

.banner_area.active .banner_img {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.banner_area .banner_img {
  overflow: hidden;
}

.bg2 { width: 750px;  margin: 0 auto; }


.riskbox {border: 1px solid #adadad; font-size: 14px; line-height:18px; color: #414042; padding: 15px; margin-bottom: 0px;}

.headline {font-size: 23px; text-align: center; color: #005948; font-weight: bold; }
.headline3 {font-size: 23px; text-align: left; color: #005948; font-weight: bold; }
.headline3 img {width: 55px; margin-top: -5px;}
.intro {font-size: 18px; line-height: 26px; margin-top: 20px; text-align: justify;}

.list_basic h1, .highlight_color {
    color: #2A8436!important;
}
.hidden .btn_tnc, .hidden .btn_tnc:focus {
    color: #696963!important;
}
.hsboxtop {background-color: #005948; border-top-left-radius: 15px;  border-top-right-radius: 15px; width: 750px; padding: 15px; margin: 0 auto; font-size: 25px; line-height: 30px; font-weight: bold; color: #ffffff; text-align: center;}
.hsbox {  border-left: 2px solid #005948; border-right: 2px solid #005948; border-bottom: 2px solid #005948; border-bottom-left-radius: 15px;  border-bottom-right-radius: 15px; padding: 30px; width: 750px; margin: 0 auto;}


p {font-size: 18px; line-height:22px; color: #414042;}


.linepoint {font-size: 18px; line-height:28px;}
.linepoint ul {list-style: none; margin-left: 20px;}
.linepoint li::before {
  content: "\2022";
  color: #006767;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
	margin-top: 10px;
}
.linepoint b {color: #c08138; font-size: 130%;}

.line {border-top: 2px solid #005948; width: 750px; margin: 0 auto; }
.head2 {font-size: 23px; line-height:30px;  color: #005948; font-weight: bold; width: 240px; margin: 0 auto; background-color: #ffffff; margin-top: -15px; text-align: center; }

.offer-area {width: 100%;  margin: 0 auto; text-align: center; }
.word {font-size: 18px; line-height: 30px;}
.word b {color: #005948; font-size: 25px;}

.offerword {font-size: 18px; line-height: 30px; margin-top: 30px;}
.offerword .offerpic {width: 110px; margin-right: 10px; margin-top: -2px; float: left;}
.offerword b {color: #ff6600; font-size: 20px;}
.offerw {padding-left: 120px;}

.yuu {color: #0f63ca; font-weight: bold; font-size: 20px;}

.hotword {color: #005948; font-size: 23px; font-weight: bold; text-align: center;}
.hotline {color: #005948; font-size: 23px; font-weight: bold;}

.desktop {display: block;}
.mobile {display: none;}

.pic {width: 100%; text-align: center; margin-top: 40px;}
.pic img {width: 600px;}

 @media screen and (max-width: 860px) {
.line {border-top: 2px solid #005948; width: 100%; margin: 0 auto; }	 
}
 @media screen and (max-width: 740px) {
.desktop {display: none;}
.mobile {display: block;}	

}
 @media screen and (max-width: 760px) {
.hsboxtop { border-top-left-radius: 15px;  border-top-right-radius: 15px; width: 100%; padding: 15px; margin: 0 auto; font-size: 22px; font-weight: bold; color: #ffffff; text-align: center;}
.hsbox { border-bottom-left-radius: 15px;  border-bottom-right-radius: 15px; padding: 10px; width: 100%; margin: 0 auto;}
.linepoint ul {list-style: none; margin-left: 30px;}	
.bg2 { width: 100%;  margin: 0 auto; }
}

.remark p {color: #000;}


.headline-img {text-align: center; margin-bottom: 22px; margin-top: 10px;}

.g_bg {background-color: #f6faeb;}
.offer img {width: 560px; margin: 10px 0;}

.act {width:50%; float:left; margin-right:0px;}
.act .btnr {text-align: right; margin-right: 10px;}
.act .btnl {text-align: left; margin-left: 10px;}	




.br2 {display: none;}
.m {display: block;}
.mc {display: none;}

.hidden.tnc .content {color: #222; padding: 15px;  height: auto; width: 100%; overflow: none; overflow-y: none;}



.bannertop {margin-top: -80px;}

.offernew {text-align: center; margin-top: 10px;}
.top {margin-top: 20px;}
.top1 {margin-top: 30px;}
.plan {float: right;}
.plan img {margin-top: -60px;}

 @media screen and (max-width: 970px) {	
.offer-area {width: 100%;  margin: 0 auto ;}	 
.detail .d-word {padding-left: 75px; padding-top: 0px;}	
.topm {margin-top: 15px; }	
.so-m {margin-left: 0px;}
.so-m1 {margin-left: 0px; margin-top: -18px; float: left;}
.so {margin-left: 0px; margin-top: -8px; float: left;}
.intro img {float: none; margin-left: 0px;}
.introword {margin-top: 10px;}
.m {display: none;}
.mc {display: block;}
.act {width:100%; float:none; margin-right:0px;}
.act .btnr {text-align: center; margin-bottom: 5px; margin-right:0px;}
.act .btnl {text-align: center; margin-left: 0px;}
.br1 {display: none;}
.br2 {display: block;}
.detailimg {text-align: center; margin-bottom: 15px; margin-top: 10px; float: none; margin-left: 0px;}
.break {display: none;}
	}

 @media screen and (max-width: 680px) {
.plan img {margin-top: -60px;}
.detail .d-word {padding-left: 75px; margin-top: 0px;}		 
.detail .d-word1 {padding-left: 75px; margin-top: 10px;}	 
.banner_title h1 {font-size: 23px; line-height:30px;}	
.banner_title h2 {font-size: 19px; line-height:24px;}
.banner_title {margin-top: -40px;}	 
.offer img {width: 80%; margin: 0px 0;} 
.detail-area {width: 100%; margin: 0 auto; margin-top: 20px;}	
	 
.intro {font-size: 16px; line-height: 28px; margin-top: 20px;}
.intro span {font-size: 23px;}
.intro b {font-size: 18px; font-weight: bold; color: #000;}
.intro strong {font-size: 18px; font-weight: normal;}	 
	}

.title_1 { background: url(word1_c.png) no-repeat center; width: 256px; height: 55px; display: block; margin-top: -30px; margin-bottom: 10; margin-left: auto; margin-right: auto;}
.title_2 { background: url(word2_c.png) no-repeat center; width: 166px; height: 55px; display: block; margin-top: -30px; margin-left: auto; margin-right: auto;}
.border-box-new {  margin: 0 0 10px 0; border: 2px solid #31aa3a; -webkit-border-radius: 15px;border-radius: 15px; padding: 0 30px 30px ;}
.border-box-new:after{display:table; clear:both; content:"";}
.topm {margin-top: 40px;}
.details_area { margin-top: 20px;}
.details_area li {margin-left: 20px; font-size: 18px; line-height:22px; color: #414042; margin-top: 10px;}
.dimg {margin-top: 15px; margin-right: 10px;}
.top2 {margin-top: -80px;}
.dimg1 img {margin-top: 95px;}

 @media screen and (max-width: 740px) {
.top2 {margin-top: 20px;}
.dimg1 img {margin-top: 10px;}	 
.dimg {margin-top: 0px; margin-right: 0px;}
.dimg img {margin-top: 15px;}	
}

.leftside img {width: 65px; float: left; margin-left: 20px;}
.tableword {padding-left: 65px; text-align: center; font-size: 18px; line-height:36px; color: #414042;}
.red1 {color: #eb0133; font-size: 190%;}
.large {font-size: 190%;}

.tableword img {margin-right: 20px; margin-top: -35px;}
.people {margin-top: 30px;}
.gline {border-bottom:2px solid #3ab54b; clear:both; margin: 20px 70px 20px 130px;}
.per {margin-top: 60px;}
.per img {width: 200px; margin-top: -60px;}

 @media screen and (max-width: 740px) {
.leftside img {width: 60px; float: left; margin-left: 0px;}	 
.gline {border-bottom:2px solid #3ab54b; clear:both; margin: 20px 0px;}
}

.o_bg {background-color: #f6faeb; padding: 25px; margin: 30px 0; text-align: center;}
.head {margin-bottom: 25px; text-align: center;}


.headline1 {font-size: 30px; line-height:40px; text-align: center; margin-bottom: 15px;}


.act1 {font-size: 22px; line-height:30px; font-weight: bold;}
.url {height: 22px;}



.btn_detail { color: #0d6c29; }
.btn_detail:hover { color: #20662A; }
.btn_detail:before { content: ' '; text-indent: -999em; background: url(https://www.hangseng.com/cms/emkt/pmo/common/img/icon_15px.png) no-repeat -30px -75px; width: 15px; height: 15px; margin-right: 5px; margin-top: -2px; display: inline-block; vertical-align: middle; }
.btn_detail:hover:before { background-position: -30px -75px; }

.btn_detail:after{
	content: "";
	width: 16px;
	height: 16px;
	background-image: url(ico_linkout.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	margin-right: 5px;
	display: inline-block;
	margin-left: 5px;
	margin-top: 0px;
}



.btn-green-ico{
	width: 290px;
	height: 52px;
	color: white;
	font-weight: bold;
	vertical-align: middle;
	font-size: 16px;
	position: relative;
	background-color: #000;
	/* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 10px; 
  /* Firefox 1-3.6 */
  -moz-border-radius: 10px; 
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 10px; 
}


.btn-green-ico:not(:lang(en)){
	font-size: 19px;
}

a .btn-green-ico::before{
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.15);
	border-radius: 7px;
	opacity: 0;
}

.btn-green-ico:hover::before{
	opacity: 1;
	-webkit-transition: 300ms;
	transition: 300ms;
}


.btn-green-ico span{
	position: relative;
	
}
.btn-green-ico .txt{
	text-align: left;
	display: inline-block;
	vertical-align: middle;
	margin-left: 5px;
	line-height: 1.3;
}


.btn-green-ico{
	background-image: url('green_btn_bg.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.btn-green-ico .ico{
	width: 22px;
	height: 22px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	display: inline-block;
	vertical-align: middle;
}


.btn-green-ico .ico-phone{
	background-image: url('ico_phone.svg');
}

.btn-green-ico .ico-loc{
	background-image: url('ico_location.svg');
}

.btn-green-ico .ico-mou{
	background-image: url('ico_mouse.svg');
}

.ico-linkout-white{
	background-image: url('ico_linkout_white.svg');
}

.ico-linkout-green{
	background-image: url('ico_linkout.svg');
}


.dbox {background-color: #ecf8ef; padding: 10px; margin-bottom: 20px; text-align: center; font-size: 18px; line-height: 30px; }

.btn_action {background-color:#005948;}
.btn_action:hover {background-color:#004312;}

.btn_action:after {
  background: url(icn_stroke_non_hase_link_white.svg) no-repeat;
  width: 22px;
  height: 22px;
  margin-left: 0;
  margin-top: -4px;
}

.green {background-color:#0d6c29;}
.green:hover {background-color:#00450b;}

.link {color:#0d6c29; text-decoration: underline; }
.link:hover {color:#00450b;}
.link1 {width: 15px; margin-top: -2px;}

.square {background-color: #005948; color: #ffffff; width:25px; height: 25px; font-size:18px; line-height:25px; font-weight: bold; display:inline-block; text-align: center; border-radius: 10%;}

.intro b {color: #005948;}

.tr {width: 13px; float: left;}
.tw {width: 100%; padding-left: 15px;}

.tick {width: 30px; float: left;}
.tick img {width: 25px; }
.tickword {width: 100%; padding-left: 35px;}
.notebox {border: 1px solid #adadad; padding: 10px; margin-bottom: 20px;  overflow: auto;  height: 160px;}

