@charset "utf-8";

body{ font-family:"微軟正黑體", "新細明體", "Arial Unicode MS"}

.container-fluid{ max-width:1280px;}

.footer{
	color:#fff;
	background-color:#003652;
	text-align:center;
	padding:24px 0;
}
.share{margin:8px 0;}
.share img{margin:0 2px;}

.backtop{
	position:fixed;
	z-index:15;
	width:48px;
	height:48px;
	left:100%;
	top:100%;
	margin-top:-64px;
	margin-left:-64px;
	padding:5px;
	background-color:rgba(000,000,000,0.5);
	text-align:center;
	color:#fff;
	font-size:1.3rem;
	border-radius:4px;
	cursor:pointer;
	-webkit-transition: background 0.3s; /* Safari */ 
	transition: background 0.3s;
}
.backtop:hover{ background-color:#0097d0;}


.title_line{
	width:64px;
	height:6px;
	background-color:#0097d0;
	margin:30px auto;
}


.navbar{ padding:0px;}
.navbar-brand{ margin-left:15px;}
@media (min-width:768px){.navbar-brand{ margin-left:0;}}
.navbar-toggler{ margin:15px;}
.navbar-nav .nav-item .nav-link{ padding:15px;}
.navbar-nav .nav-item .nav-link:hover{ background-color:#999;}



.menu_header{ position:fixed; z-index:900; top:0; left:0; width:240px; height:100%; background-color:#003652; -webkit-transition: margin 0.3s; /* Safari */ transition: margin 0.3s; overflow-y: auto;}

.menu_header img{ margin:12px 0;}

.menu_close{ left:100%; margin-left:0px;}
.menu_open{ left:100%; margin-left:-240px;}

.menu_header .container-fluid{ padding:0; position:relative; max-width:1280px;}


@media (min-width:992px){
	.menu_header{ position:fixed; width:100%; height:auto; background:#fff; border-top:30px solid #003652; overflow-y:visible; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
	.menu_open, .menu_close{ left:0; margin-left:0;}
	.menu_header .container-fluid{ padding:0 15px;}
}

.logo_big{ display:none}
.logo_big img{ -webkit-transition: all 0.3s; /* Safari */ transition: all 0.3s; width:320px; height:auto; margin-top:15px;}
@media (min-width:992px){
	.logo_big{ display: block; text-align:center;  float:left;}
	.logo_big img{ width:280px; margin-top:18px; padding-bottom:5px;}
}
@media (min-width:1200px){
	.logo_big img{ width:320px; margin-top:15px; padding-bottom:0px;}
}


.menu_ul{list-style:none; padding:0;}
.menu_ul li{ border-bottom:1px dotted #0097d0;}

.menu_ul li a{ color:#fff; display:block; font-size:1.1rem; -webkit-transition: background 0.3s; /* Safari */ transition: background 0.3s;  padding:15px;}
.menu_ul li a:hover, .menu_ul li a:focus{ text-decoration:none; background-color:#0097d0;}

.menu_ul li a span{ display:block; font-size:0.8rem;}


@media (min-width:992px){
	.menu_ul{ text-align:center; border-radius:4px; height:32px; float:right; margin-top:26px;}
	.menu_ul li{ float:left; border:none; position:relative;}
	.menu_ul li a{ color:#555; font-size:0.9rem; width:auto; text-align:center; padding:12px 10px 30px 10px;}
	.menu_ul li a:hover, .menu_ul li a:focus{ color:#003652; background-color:transparent;}
	.menu_ul .mobile_home{ display:none;}
}
@media (min-width:1200px){
	.menu_ul{margin-top:24px; height:32px;}
	.menu_ul li a{ font-size:1rem; width:auto; text-align:center; padding:12px 18px 30px 18px;}
}


.mobile_hide{ background-color:#000; opacity:0; position:fixed; z-index:899; top:0; left:0; width:100%; height:100%;}

.mobile_header{ background-color:#fff; position:fixed; z-index:890; height:88px; width:100%; border-top:8px solid #003652;}

.mobile_header img{ margin:20px 0 0 15px;}

.iconbar{float:right; width:48px; height:36px; margin:24px 15px 0 15px; border:2px solid #525269; border-radius:4px; cursor:pointer; background-position:center; background-repeat:no-repeat;-webkit-transition: background 0.2s; /* For Safari 3.1 to 6.0 */ transition: background 0.2s;}

.iconbar_open{background-image:url(../../images/iconbar.png);}
.iconbar_close{background-image:url(../../images/iconbar2.png); border-color:#003652;}

.menu_title{ margin:3px 15px; padding-top:23px; padding-bottom:16px; color:#fff; font-family:Verdana, Geneva, sans-serif;}

@media (min-width:992px){
	.mobile_hide{ display:none;}
	.mobile_header{ display:none;}
	.iconbar_close{ display:none;}
	.menu_title{ display:none;}
}

.menu_ul .mobile_language{ color:#fff; margin:10px 15px; border:none;}
.menu_ul .mobile_language a{ display:inline-block; padding:10px 16px; font-size:0.9rem; border:1px solid #fff; border-radius:5px;}
.menu_ul .mobile_language a:hover,
.menu_ul .mobile_language a.active{ background-color:#fff; color:#003652;}
@media (min-width:992px){
	.menu_ul .mobile_language{ display:none;}
}

.search_nav{ display:none;}
@media (min-width:992px){
	.search_nav{ position:absolute; padding:0; list-style:none; top:-28px; left:100%; width:400px; margin-left:-430px; text-align:right; display:block;}
	.search_nav li{ display:inline-block; font-size:0.8rem; margin-left:15px; color:#fff;}
	.search_nav li a{ color:#fff;}
	.search_nav li a:hover{ color:#FC6; text-decoration:none;}
}
@media (min-width:1200px){
	.search_nav{ margin-left:-445px;}
}

.menu_ul .sub_nav{ display:none;}
@media (min-width:992px){
	.menu_ul .sub_nav{ position:absolute; top:60px; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
	.menu_ul .sub_nav a{ background-image:none; padding:10px 10px; margin:0; border-top:1px solid #ddd; background-color:#fff; width:140px; margin-left:-32px; font-size:0.9rem;}
	.menu_ul .sub_nav a:hover{background-color:#003652; color:#fff;}
}
@media (min-width:1200px){
	.menu_ul .sub_nav a{width:160px; margin-left:-30px;}
}

@media (min-width:992px){
	.drop1:hover .sub_nav1{ display:block;}
	.drop2:hover .sub_nav2{ display:block;}
	.drop3:hover .sub_nav3{ display:block;}
	.drop4:hover .sub_nav4{ display:block;}
	.drop6:hover .sub_nav6{ display:block;}
	.drop7:hover .sub_nav7{ display:block;}
}
.zoomIn {
  -webkit-animation: zoomIn 0.4s; /* Safari 4+ */
  -moz-animation:    zoomIn 0.4s; /* Fx 5+ */
  -o-animation:      zoomIn 0.4s; /* Opera 12+ */
  animation:         zoomIn 0.4s; /* IE 10+, Fx 29+ */
}


.top_blank{ height:88px;}
@media (min-width:992px){.top_blank{ height:115px;}}

.view_lg{ display:none;}
@media (min-width:992px){
	.view_sm{ display:none;}
	.view_lg{ display:block;}
}


.scroll_down{ 
	display:none; 
	-webkit-transition: box-shadow 0.3s, text-shadow 0.3s; /* Safari */ 
	transition: box-shadow 0.3s, text-shadow 0.3s; 
	text-shadow: 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 15px #999; 
	box-shadow: 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 15px #999;
}
.scroll_down:hover{ 
	box-shadow: 0px 0px 10px #036, 0px 0px 15px #09C, 0px 0px 20px #09F, 0px 0px 25px #0CF; 
	text-shadow: 0px 0px 10px #036, 0px 0px 15px #09C, 0px 0px 20px #09F, 0px 0px 25px #0CF;
}

@media (min-width:992px){.scroll_down{ position:absolute; top:100%; left:50%; z-index:1000; margin-left:-40px; margin-top:-150px; height:80px; width:80px; border:4px solid #fff; border-radius:50%; text-align:center; color:#fff; padding-top:16px; cursor:pointer; display:block;}}

.scroll_down2{ 
	display:none; 
	-webkit-transition:all 0.3s; /* Safari */ 
	transition: all 0.3s; 
	text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff; 
	box-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff;
}
.scroll_down2:hover{ 
	box-shadow: 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 20px #fff, 0px 0px 25px #fff; 
	text-shadow: 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 20px #fff, 0px 0px 25px #fff;
	color:#003652;
	border:4px solid #003652;
}

@media (min-width:992px){.scroll_down2{ position:absolute; top:100%; left:50%; z-index:1000; margin-left:-40px; margin-top:-150px; height:80px; width:80px; border:4px solid #0097d0; border-radius:50%; text-align:center; color:#0097d0; padding-top:16px; cursor:pointer; display:block;}}


.top_news_block{ background-color:#003652;}

.v-slick{ margin:0 25px 0 0;}
.v-slick div{ line-height:2rem; font-size:1rem;}
@media (min-width:992px){.v-slick div{font-size:1.1rem;}}
.v-slick div a{
	display:block;
	color:#fff;
	padding:15px 0; 
	white-space:nowrap;
	text-overflow:ellipsis;
	-o-text-overflow:ellipsis;
	overflow: hidden;
}
.v-slick div a:hover{ text-decoration:none; color:#FC6;}
.v-slick div a span{ margin-right:10px;}
.v-slick div a p{ display:block; margin:0;}
@media (min-width:768px){.v-slick div a p{ display:inline-block;}}


.top_news_block .slick-prev:before, .top_news_block .slick-next:before { font-family: FontAwesome; font-size: 0.9rem; line-height: 1; color: #fff; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } 

.top_news_block .slick-prev
{
    left: 100%;
	margin-left:5px;
	margin-top:-10px;
}
[dir='rtl'] .top_news_block .slick-prev
{
    right: -25px;
    left: auto;
}
.top_news_block .slick-prev:before
{
    content: "\f077"
}
[dir='rtl'] .top_news_block .slick-prev:before
{
    content: "\f078";
}

.top_news_block .slick-next
{
    right: -25px;
	margin-top:10px;
}
[dir='rtl'] .top_news_block .slick-next
{
    right: auto;
    left: 100%;
}
.top_news_block .slick-next:before
{
    content: "\f078";
}
[dir='rtl'] .top_news_block .slick-next:before
{
    content: "\f077"
}




.top_title_pic{ margin:15px 0; text-align:center;}

.more{ margin:30px 0;}
.more a{ padding:10px 30px; background-color:#0097d0; color:#fff; border-radius:20px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.more a:hover{ text-decoration:none; background-color:#003652;}

.top_concept_block{ padding:128px 0 200px 0; background-image:url(../../images/top_bg.jpg); background-position:center; background-size:cover; position:relative;}
.top_concept_block h1{ text-align:center;}
.top_concept_block .row .col-md-4{ position:relative;}

.top_concept_con{ text-align:center; padding:64px 15px 15px 15px; background-color:#fff; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray; border-radius:15px; background-image:url(../../images/card_bg.jpg); background-position:top center; background-repeat:no-repeat; margin:15px 0;}
.top_concept_con h3{ margin:15px 0; color:#1e3046; font-size:2rem;}
.top_concept_con p{ color:#333; margin:15px 0; line-height:1.8rem;}

.top_concept_pic{ margin:15px 0; width:120px; height:120px; background-color:#fff; margin:15px auto; padding:15px; border-radius:50%;}
.top_concept_pic img{ max-width:100%; height:auto; width:80px; height:auto;}



/*@media (min-width:768px){
	.top_concept_con p{ padding-bottom:64px;}
	.top_concept_block .more{ position:absolute; top:100%; left:50%; margin-top:-70px; margin-left:-72px;}
}*/

.top_concept_block .scroll_down{ 
	display:none; 
	-webkit-transition: all 0.3s; /* Safari */ 
	transition: all 0.3s;
	box-shadow: 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 20px #fff, 0px 0px 25px #fff; 
	text-shadow: 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 20px #fff, 0px 0px 25px #fff;
}
.top_concept_block .scroll_down:hover{
	box-shadow: 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 20px #fff, 0px 0px 25px #fff; 
	text-shadow: 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 20px #fff, 0px 0px 25px #fff;
	border:4px solid #003652;
	color:#003652;
}

@media (min-width:992px){.top_concept_block .scroll_down{ position:absolute; top:100%; left:50%; z-index:1000; margin-left:-40px; margin-top:-150px; height:80px; width:80px; border:4px solid #0097d0; border-radius:50%; text-align:center; color:#0097d0; padding-top:16px; cursor:pointer; display:block;}}


/* set slider arrow color ! */
.top_concept_block .slick-prev:before, .top_concept_block .slick-next:before {
    color:#003652 !important;
}
.top_concept_block .top_concept_slick{
	margin:0 24px 0 24px;
}
.top_concept_block .top_concept_slick .top_concept_con{
	margin:8px 16px 8px 8px;
}

.top_concept_slick .top_concept_con .top_concept_pic{ margin:15px 0; width:120px; height:120px; background-color:#fff; margin:15px auto; padding:15px; border-radius:50%;}
.top_concept_slick .top_concept_con .top_concept_pic img{ max-width:100%; height:auto; width:80px; height:auto; margin-left:5px;}

.top_concept_slick .top_concept_con p{ min-height:180px;}
@media (min-width:768px){
	.top_concept_slick .top_concept_con p{ padding-bottom:0px;  min-height:180px;}
}

.slick_more{ margin:30px 0;}
.slick_more a{ padding:10px 30px; background-color:#0097d0; color:#fff; border-radius:20px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.slick_more a:hover{ text-decoration:none; background-color:#003652;}


.top_core_title{ padding:30px 0; margin:0; background-color:#003652; color:#fff; text-align:center;}


.top_core_block .container-fluid{ max-width:none;}

.top_core_pic1{ height:360px; position:relative; background-position:center; background-size:cover;}
.top_core_pic1 a{ background-color:#000; color:#fff; opacity:0; position:absolute; z-index:10; top:0; left:0; width:100%; height:100%; font-size:2rem; text-align:center; padding-top:120px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.top_core_pic1 a:hover{ opacity:0.8; text-decoration:none;}
.top_core_pic1 a i{ font-size:4rem;}
@media (min-width:992px){
	.top_core_pic1{ height:720px; position:relative; background-position:center; background-size:cover;}
	.top_core_pic1 a{ background-color:#000; color:#fff; opacity:0; position:absolute; z-index:10; top:0; left:0; width:100%; height:100%; font-size:2rem; text-align:center; padding-top:280px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
}


.top_core_pic2{ height:360px; position:relative; background-position:center; background-size:cover;}
.top_core_pic2 a{ background-color:#000; color:#fff; opacity:0; position:absolute; z-index:10; top:0; left:0; width:100%; height:100%; font-size:2rem; text-align:center; padding-top:120px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.top_core_pic2 a:hover{ opacity:0.8; text-decoration:none;}
.top_core_pic2 a i{ font-size:4rem;}

.top_core_text{ position:absolute; z-index:9; top:100%; left:0; width:100%; height:64px; margin-top:-64px; background-color:rgba(000,000,000,0.8); color:#fff; font-size:1.3rem; padding:15px;}
.top_core_text i{ color:#0097d0;}

.top_core_slick{ margin:0 -15px;}
.top_core_slick_con{ position:relative; height:480px; background-position:center; background-size:cover; text-align:center; padding:20px;}
.top_core_slick_con a{ background-color:#000; color:#fff; opacity:0; position:absolute; z-index:10; top:0; left:0; width:100%; height:100%; font-size:2rem; text-align:center; padding-top:180px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.top_core_slick_con a:hover{ opacity:0.8; text-decoration:none;}
.top_core_slick_con a i{ font-size:4rem;}

.top_core_slick_con .top_core_text{font-size:1.4rem; height:96px; margin-top:-96px; padding:36px;}

.top_core_block .slick-prev {
    left: 32px;
	z-index:1;
	
}
.top_core_block .slick-next {
    right: 32px;
}

.top_core_block .slick-prev:before,
.top_core_block .slick-next:before
{
  font-family: 'slick';
  font-size: 32px;
  line-height: 1;

  opacity: .75;
  color: white;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


.top_about_block{ padding:128px 0; text-align:center; background-image:url(../../images/top_bg2.jpg); background-position:center; background-size:cover;}
.top_about_block .container-fluid{ max-width:720px;}

.top_about_block h1{ margin:15px 0;}
.top_about_block p{ color:#777; margin:15px 0; line-height:1.8rem;}





.top_contact_block{ padding:32px 0; background-color:#6f8fa6;}

.top_contact_text{ text-align:center;}
@media (min-width:992px){ .top_contact_text{ text-align:left;}}
.top_contact_text ul{ list-style:none; padding:0; font-size:0.95rem; margin-top:10px; color:#fff;}



.site_map{ display:none;}
@media (min-width:992px){.site_map{ display:block;}}
.site_map_con h5 a{color:#003652; font-size:1.1rem;}
.site_map_con ul{ list-style:none; padding:0; font-size:0.95rem;}
.site_map_con ul li a{color:#fff;}

.site_map_con h5 a:hover,
.site_map_con ul li a:hover{ color:#FC6; text-decoration:none;}


.guide{ margin-top:32px; margin-bottom:32px;}
.guide a{ color:#fff; background-color:#003652; padding:10px 18px; border-radius:20px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.guide a:hover{ text-decoration:none; background-color:#0097d0; color:#fff;}
@media (min-width:768px){.guide{ display:none;}}



.page_bread{ background-color:#003652; margin:0; font-size:0.9rem; display:table; width:100%;}
.page_bread .breadcrumb { background:none; float:right; text-align:left;   padding:15px 0 0 0;}
.page_bread .breadcrumb li{ border-radius:0; color:#fff;}
.page_bread .breadcrumb li::before{ color:#fff;}
.page_bread .breadcrumb a{ color:#fff;}
.page_bread .breadcrumb a:hover{color:#FC6; text-decoration:none;}

.side_nav{ -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
.side_nav h3{ border-bottom:4px solid #0092dd; padding:18px 30px; background-color:#003652; color:#fff; margin:0; font-size:1.5rem;}

.side_nav ul{ list-style:none; padding:0; margin-bottom:30px; background-color:#ededed;}
.side_nav ul li{ padding:15px 0; border-bottom:1px solid #ddd;}
.side_nav ul li a{ color:#555; padding-left:30px; padding-right:15px; background-position:-15px 6px; background-repeat:no-repeat; background-image:url(../images/arrow1.png); display:block; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s; font-weight:bold; font-size:1.1rem;}
.side_nav ul li a:hover{ color:#0092dd; text-decoration:none; background-image:url(../images/arrow2.png); background-position:8px 7px;}
.side_nav ul li a.active{ color:#0092dd; background-image:url(../images/arrow2.png); background-position:8px 7px;}



.side_nav .side_sub_ul{ margin:0;}
.side_nav .side_sub_ul li{ border-bottom:none; padding:0 0 0 1rem; margin:0;}
.side_nav .side_sub_ul li a{ font-size:0.9rem; color:#777; font-weight:normal;}
.side_nav .side_sub_ul li a:hover{ color:#0092dd; text-decoration:none; background-image:url(../images/arrow2.png); background-position:8px 6px;}
.side_nav .side_sub_ul li a.active{ color:#0092dd; background-image:none; background-position:8px 6px;}


.side_nav .side_sub_ul2{ margin:2px 42px 4px 42px; border-radius:4px;}
.side_nav .side_sub_ul2 li{ border-bottom:none; padding:0 0 0 0; margin:0; border-bottom:1px dashed #ccc;}
.side_nav .side_sub_ul2 li a{ font-size:0.6rem; color:#777; font-weight:normal;}
.side_nav .side_sub_ul2 li a:hover{ color:#0092dd; text-decoration:none; background-image:url(../images/arrow2.png); background-position:8px 5px;}
.side_nav .side_sub_ul2 li a.active{ color:#0092dd; background-image:none; background-position:8px 6px;}


/*@media (min-width:768px){.page_content{ border-left:1px solid #ccc;}}*/


.page_content h1{ color:#003652;}
.page_content p{ color:#333; font-size:1rem;}
.page_content img{ max-width:100%; height:auto; margin:15px 0;}
.page_title_line{ height:2px; margin:15px 0; background-image:url(../images/page_title_line.jpg); background-position:left;}

.page_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}


.page_solution_con{ border-top:4px solid #0097d0; padding:15px; margin:10px 0; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
.page_solution_con h3{ color:#003652; padding-left:36px; background-position:0 2px; background-repeat:no-repeat; background-size:28px;}
.page_solution_con h6{ padding-bottom:5px; margin-bottom:5px; border-bottom:1px solid #003652; color:#003652;}
.page_solution_con a{ padding:5px 20px; background-color:#0097d0; border-color:#0097d0;}
.page_solution_con a:hover{ background-color:#003652; border-color:#003652;}

.solution_content_pic img{ max-width:100%;}

.solution_title1{ padding-left:48px; background-image:url(../images/icon_c1s.png); background-position:0 4px; background-repeat:no-repeat; background-size:40px;}
.solution_title2{ padding-left:48px; background-image:url(../images/icon_c2s.png); background-position:0 4px; background-repeat:no-repeat; background-size:40px;}
.solution_title3{ padding-left:48px; background-image:url(../images/icon_c3s.png); background-position:0 4px; background-repeat:no-repeat; background-size:40px;}

.page_intro_pic{ text-align:center;}

@media (min-width:992px){
	.solution_block .top_concept_con p{ padding-bottom:0px;  min-height:120px;}
}



.solution_waste .page_solution_con{ border-top:4px solid #48a1ae;}
.solution_waste .page_solution_con a{ background-color:#48a1ae; border-color:#48a1ae;}
.solution_waste .page_solution_con a:hover{ background-color:#31656d; border-color:#31656d;}

.solution_system .page_solution_con{ border-top:4px solid #0097d0;}
.solution_system .page_solution_con h3{ color:#003652; font-size:1.3rem; background-size:20px; padding-left:28px;}
.solution_system .page_solution_con a{ background-color:#0097d0; border-color:#0097d0;}
.solution_system .page_solution_con a:hover{ background-color:#003652; border-color:#003652;}
.solution_system .page_solution_con .page_title_line{ background-image:url(../images/page_title_line.jpg);}


.solution_form_title{ color:#003652; border-bottom:1px solid #003652; padding-bottom:10px; margin-bottom:10px;}
.solution_block .page_content form .form-group button{ background-color:#0097d0; border-color:#0097d0;}
.solution_block .page_content form .form-group button:hover{background-color:#003652;}


.solution_inqury p{ font-size:1.2rem;}

.solution_open_btn{ cursor:pointer;}
.solution_open_btn i{ color:#0097d0;}


.finance_concept{ background-color:#eee; border-top:4px solid #0097d0; padding:15px; margin:10px 0;}
.finance_concept h4{ border-bottom:1px solid #003652; padding-bottom:10px; margin-bottom:10px; color:#003652;}
.finance_concept ul{ list-style:none; padding:0;}
.finance_concept ul li{ border-bottom:1px dashed #ccc;}
.finance_concept ul li a{ 
	padding:5px 0;
	display:block;
	color:#0097d0;
	white-space:nowrap;
	text-overflow:ellipsis;
	-o-text-overflow:ellipsis;
	overflow: hidden;
}
.finance_concept ul li a:hover{ text-decoration:none; color:#003652;}
.finance_concept .btn-sm{ background-color:#003652; border-color:#003652;}
.finance_concept .btn-sm:hover{ background-color:#0097d0; border-color:#0097d0}


.finance_contact{ border-top:1px dashed #777; padding-top:10px; margin-top:10px;}
.finance_contact ul{ padding:0; list-style:none;}

.investor_cate{ border:1px solid #0097d0; color:#0097d0; display:block; text-align:center; padding:10px 0; margin:5px 0; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.investor_cate:hover,
.investor_cate.active{ background-color:#0097d0; color:#fff; text-decoration:none;}

.investor_block .news_year_ul{ margin-top:10px;}
.investor_block .page_content h3{ color:#0097d0;}


.investor_table table tr th{ background-color:#003652; color:#fff;}
.investor_table table tr a{ color:#0097d0;}
.investor_table table tr a:hover{ color:#003652; text-decoration:none;}
.revenue_bar{ background-color:#0097d0; height:1rem; float:left; margin-right:10px; margin-top:4px;}


.annual_report_con{ border-top:4px solid #0097d0; margin:10px 0; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
.annual_report_pic{ background-position:center; background-size:cover; height:240px;}
.annual_report_text{ padding:15px; text-align:center; background-color:#fff;}
.annual_report_text h4{ color:#003652;}
.annual_report_text a{ padding:5px 20px; margin:20px 0 10px 0; background-color:#0097d0; border-color:#0097d0;}
.annual_report_text a:hover{ background-color:#003652; border-color:#003652}


.shareholder_concept{ background-color:#eee; border-top:4px solid #0097d0; padding:15px; margin:10px 0;}
.shareholder_concept h4{ border-bottom:1px solid #003652; padding-bottom:10px; margin-bottom:10px; color:#003652;}
.shareholder_concept p{ min-height:120px;}
.shareholder_concept .btn-sm{ background-color:#003652; border-color:#003652;}
.shareholder_concept .btn-sm:hover{ background-color:#0097d0; border-color:#0097d0}


.dividend_ol{ padding:15px 30px; background:#eee;}

.meeting_title{ padding:20px 15px; background-color:#003652; color:#fff;}

.meeting_wrapper{-moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray; margin-bottom:30px;}
.meeting_content{ padding:15px;}
.meeting_content .investor_table table{ border:1px solid #eee;}
.meeting_content .investor_table table tr th{ background-color:#6f8fa6; color:#fff;}

.major_list_date{ text-align:right; margin:30px 0;}

.session_con{ margin:15px 0; padding:15px; background-color:#eee;}

.session_pic{width:100%; height:200px; background-size:cover; background-position:center; margin-bottom:10px; position:relative;}
.session_pic a{ position:absolute; width:100%; height:100%; background-color:#fff; opacity:0; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.session_pic a:hover{ opacity:0.4;}
.session_text h4 a{ color:#003652;}
.session_more{ border-top:1px solid #ccc; padding-top:15px; color:#777;}
.session_more a{ float:right; margin-top:-8px; margin-left:5px; padding:5px 20px; background-color:#0097d0; border-color:#0097d0;}
.session_more a:hover{ background-color:#003652; border-color:#003652}
@media (min-width:992px){
	.session_pic{ width:200px; height:140px; float:left;}
	.session_text{ margin-left:220px;}
}
.session_more a.btn-danger{ background-color:#C00; border-color:#C00;}
.session_more a.btn-danger:hover{ background-color:#600; border-color:#600;}


.director_con{ border-left:4px solid #0097d0; padding:15px 30px; margin:10px 0; background-color:#eee;}
.director_con h3{ color:#0097d0;}
.director_con h5{ color:#960d80;}
.director_con a{ padding:5px 20px; background-color:#0097d0; border-color:#0097d0;}
.director_con a:hover{ background-color:#003652; border-color:#003652;}

.source_list{ list-style:none; padding-left:2rem;}
.source_list a{ color:#960d80;}
.source_list a:hover{ color:#636; text-decoration:none;}
.source_list i{ margin-right:10px;}

.price_table tr:nth-child(odd){ background-color:#eee;}
.price_table tr td{ vertical-align:middle;}
.price_table h6 span{ color:#c00; font-weight:bold;}




.news_year_ul{ padding:0; list-style:none;}
.news_year_ul li{ display:inline-block; color:#003652;}
.news_year_ul li::after{ content:" │"}
.news_year_ul li a{ color:#6f8fa6;}
.news_year_ul li a:hover,
.news_year_ul li a.active{ color:#0097d0; text-decoration:none; font-weight:bold;}

.page_news_con{ border-bottom:1px dashed #ccc; padding-bottom:15px; padding-top:10px; margin-bottom:15px;}

.page_news_pic{width:100%; height:200px; background-size:cover; background-position:center; margin-bottom:10px; position:relative;}
.page_news_pic a{ position:absolute; width:100%; height:100%; background-color:#fff; opacity:0; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.page_news_pic a:hover{ opacity:0.4;}
.page_news_text h4 a{ color:#003652;}
.page_news_more{ border-top:1px solid #ccc; padding-top:15px; color:#777;}
.page_news_more a{ float:right; margin-top:-8px; padding:5px 20px; background-color:#0097d0; border-color:#0097d0;}
.page_news_more a:hover{ background-color:#003652; border-color:#003652}
@media (min-width:992px){
	.page_news_pic{ width:200px; height:140px; float:left;}
	.page_news_text{ margin-left:220px;}
}

.pagination .page-item .page-link{ color:#0097d0;}
.pagination .page-item.active .page-link{ color:#fff; background-color:#0097d0;}

.page_news_content_date{ color:#777;}
.page_news_content_date .badge{ background-color:#0097d0;}



.contact_block .page_content h3{ color:#003652; margin-top:10px;}
.contact_block .page_content h5{ color:#6f8fa6;}
.contact_block .page_content ul{ padding:0 0 0 0; list-style:none;}

.contact_block .page_content form .form-group button{ background-color:#0097d0; border-color:#0097d0;}
.contact_block .page_content form .form-group button:hover{background-color:#003652;}


/*2021-09-22-update*/

.investor_pdf_item{ margin:10px 0;}
.investor_pdf_item a{ display:block; padding:20px 15px; border:1px solid #ccc; color:#555; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden;}
.investor_pdf_item a i{ margin-right:10px;}
.investor_pdf_item a:hover{ background-color:#0097d0; border-color:#0097d0; color:#fff; text-decoration:none;}

.hr_sub_title{ border-left:8px solid #0097d0; padding-left:15px;}


.invest_organization_table thead{ background-color:#003652; color:#fff;}
.invest_organization_table thead tr th{ text-align:center; vertical-align:middle;}
.invest_organization_table tbody tr td{ text-align:center; vertical-align:middle; border:1px solid #fff;}
.invest_organization_table tbody tr td:nth-child(1){ background-color:#003652; color:#fff; font-weight:900;}
.invest_organization_table tbody tr:nth-child(even){ background-color:#ededed;}


.prev-alt{ border:1px solid #999; color:#999; position:absolute; z-index:555; cursor:pointer; top:50%; left:0%; padding:10px 15px 12px 15px; transform:translate(0,-50%); opacity:1;}
.prev-alt:hover{ background-color:#0097d0; border-color:#0097d0; color:#fff;}
.next-alt{ border:1px solid #999; color:#999; position:absolute; z-index:555; cursor:pointer; top:50%; left:100%; padding:10px 15px 12px 15px; transform:translate(-100%,-50%); opacity:1;}
.next-alt:hover{ background-color:#0097d0; border-color:#0097d0; color:#fff;}


.page_hr_content{ position:relative;}
.page_hr_content p{ text-align:justify;}
.page_hr_content ol li,
.page_hr_content il li{ text-align:justify;}

.hr_life_intro_wrapper{ position:relative; overflow:hidden;}
.hr_life_intro_pic{ height:320px; background-position:center; background-size:cover; background-image:url(../images/hr_life_company1s.jpg)}
.hr_life_intro_text{ padding:30px; background-color:#ededed;}
.hr_life_intro_line{ position:absolute; z-index:8; top:15px; left:15px; width:calc(100% - 30px); height:calc(100% - 30px); border:1px solid #fff;}


.hr_life_office{ text-align:center; margin-bottom:30px;}
.hr_life_office h6{ font-size:0.9rem;}
.hr_life_office_pic{ height:128px; background-position:center; background-size:cover;}
.hr_life_office_pic2{ display:none;}

.hr_life_con{ border-top:none; padding:0; position:relative;}
.hr_life_line{ position:absolute; z-index:6; top:15px; left:15px; width:calc(100% - 30px); height:calc(100% - 30px); border:1px solid #fff;}

.hr_life_divide{ margin:30px 0; height:1px; border-bottom:1px dashed #ccc;}

.hr_life_slick{ padding:0; margin:0 0 0 0;}
.hr_life_slick img{ margin:0; padding:0;}
.hr_life_text{ padding:30px; background-color:#ededed;}
.hr_life_text h4{ margin:15px 0;}

.hr_life_slick_item{ padding:0; margin:0;}

.hr_life_slick .slick-dots {
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 1rem 0;
	
	list-style-type: none;
}
.hr_life_slick .slick-dots li {
	margin: 0 0.25rem;
}
	
.hr_life_slick .slick-dots button {
	display: block;
	width: 0.7rem;
	height: 0.7rem;
	padding: 0;
	margin-top:-60px;
	position:absolute;
	z-index:9;
		
	border: none;
	border-radius: 100%;
	background-color:rgba(000,000,000,0.5);
			
	text-indent: -9999px;
}
	
.hr_life_slick .slick-dots li.slick-active button {
	background-color: #0097d0;
}

@media (min-width:992px){
	.hr_life_intro_wrapper{ height:360px;}
	.hr_life_intro_pic{ position:absolute; z-index:6; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s; background-image:url(../images/hr_life_company1.jpg)}
	.hr_life_intro_wrapper:hover .hr_life_intro_pic{ width:110%; height:110%;}
	.hr_life_intro_text_bg{ position:absolute; z-index:7; top:0; left:50%; width:50%; height:100%; background-image:url(../images/hr_life_company1w.jpg); background-position:center; background-size:cover;}
	.hr_life_intro_text{  position:absolute; z-index:9; top:50%; left:50%; transform:translateY(-50%); padding:30px; background-color:transparent;}
	
	.hr_life_office_pic2{ display:block; height:540px;}
	
	.hr_life_slick{ float:left; width:360px;}
	.hr_life_text{ position:absolute; z-index:10; top:50%; left:400px; transform:translateY(-50%); padding-right:60px; background-color:transparent;}
	.hr_life_text_bg{ position:absolute; z-index:5; top:0; left:360px; height:100%; width:calc(100% - 360px); background-position:center; background-size:cover;}
	
	.hr_life_con2 .hr_life_slick{ float:right; width:360px;}
	.hr_life_con2 .hr_life_text{ padding-right:400px; left:60px;}
	.hr_life_con2 .hr_life_text_bg{ left:0;}
}

.hr_vacancies_nav .nav-item{text-align:center; width:50%; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
.hr_vacancies_nav .nav-item .nav-link{text-algn:center; color:#555; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_vacancies_nav .nav-item .nav-link:hover,
.hr_vacancies_nav .nav-item .nav-link.active{ background-color:#0097d0; color:#fff;}
.hr_vacancies_nav .nav-item .nav-link img{max-width:150px; width:100%; height:auto; margin:0 auto 15px auto;}
@media (min-width:992px){
	.hr_vacancies_nav { margin:0 -5px;}
	.hr_vacancies_nav .nav-item{width:calc(25% - 10px); margin:0 5px;}
}

.hr_vacancies_pic{}
.hr_vacancies_pic img{ width:100%; height:100%;}
.hr_vacancies_table{ overflow-x:scroll;}
.hr_vacancies_table table{ min-width:800px;}
.hr_vacancies_table tr td ol{ padding:0 0 0 20px; margin:0;}
.hr_vacancies_table tr td{ vertical-align:middle;}
.hr_vacancies_table tr th{ vertical-align:middle; text-align:center;}
.hr_vacancies_more{margin:15px 0 15px 0;}
.hr_vacancies_more a{ padding:15px 15px; width:100%; display:block; text-align:center; background-color:#0097d0; color:#fff; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_vacancies_more a:hover{ background-color:#003652; text-decoration:none;}
.hr_vacancies_bottom a{color:#0097d0;}
.hr_radarchart_pic{ width:220px;}
.hr_radarchart_pic img{width:100%; height:auto; margin:0; paddiing:0;}

.hr_vacancies_interest{ display:block; width:120px; padding:8px; margin:10px auto; background-color:#6f8fa6; border:none; color:#fff; font-size:0.9rem; font-weight:normal;-webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_vacancies_interest:hover{ text-decoration:none; background-color:#42637b; color:#fff;}
@media (min-width:992px){
	.hr_vacancies_pic{width:200px; float:left;}
	.hr_vacancies_table{margin-left:220px; overflow-x:auto;}
	.hr_vacancies_table table{ min-width:480px;}
	.hr_radarchart_pic{width:220px;}
}


.hr_vacancies_tabcontent{ border-top:4px solid #0097d0; padding:15px; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}


/*#welfare_tab .nav-item{ width:50%; text-align:center;}
#welfare_tab .nav-item a{ color:#999;}
#welfare_tab .nav-item a.active,
#welfare_tab .nav-item a:hover{ color:#0097d0; background-color:transparent;}
#welfare_tab .nav-item a .fa{ margin-right:10px; width:40px; height:40px; border:1px solid #999; color:#999; border-radius:50%; padding-top:11px;}
#welfare_tab .nav-item a.active .fa,
#welfare_tab .nav-item a:hover .fa{ color:#fff; background-color:#0097d0; border-color:#0097d0;}*/

#welfare_tab{ margin:15px -10px}
#welfare_tab .nav-item{ width:50%; text-align:center; padding:0 10px; margin:10px 0; position:relative;}
#welfare_tab .nav-item a{ color:#555; text-align:center; border-radius:15px; border:8px solid #ccc;}
#welfare_tab .nav-item a .fa{ font-size:2rem; margin:0 auto 5px auto; display:block;}
#welfare_tab .nav-item a.active,
#welfare_tab .nav-item a:hover{ color:#fff; background-color:#0097d0; border-color:#0097d0;}
#welfare_tab .nav-item a .welfare_tab_crossover{ position:absolute; z-index:99; top:50%; left:100%; transform:translate(-50%,-50%); width:50px; height:20px; background-color:#ccc; border:5px solid #fff; border-radius:10px;}
#welfare_tab .nav-item a.active .welfare_tab_crossover,
#welfare_tab .nav-item a:hover .welfare_tab_crossover{background-color:#0097d0; }
.welfare_tab_crossover2,
.welfare_tab_crossover4{ display:none;}

.hr_welfare_slick_item{ text-align:center;}
.hr_welfare_slick{ padding:0 30px; height:480px;}
.hr_welfare_slick_pic{ background-position:center; background-size:cover; height:160px; width:160px; border-radius:50%; margin:0 auto;}
.hr_welfare_slick_text{ padding:30px;}
.hr_welfare_slick_text h4{color:#0097d0; margin-bottom:15px;}
.hr_welfare_slick_text p{ text-align:center;}

.hr_bonus_sm_con{ margin:15px 0; text-align:center;}
.hr_bonus_sm_icon img{ border-radius:50%;}
.hr_bonus_sm_text h6{ font-size:1.2rem;}
.hr_bonus_sm_text p{ text-align:center;}

@media (min-width:480px){
	.hr_welfare_slick{  height:400px;}
	#welfare_tab .nav-item{ width:33.3%; text-align:center;}
	.welfare_tab_crossover3{ display:none;}
	.welfare_tab_crossover2,
	.welfare_tab_crossover4{ display:block;}
}
@media (min-width:1200px){
	#welfare_tab .nav-item{ width:16.6%; text-align:center;}
	.welfare_tab_crossover3{ display:block;}
	
	#welfare_tab_content4,
	#welfare_tab_content5{ overflow:hidden;}
	#welfare_tab_content4 .hr_welfare_slick{ width:100%; margin-left:14.5%; }
}

.hf_welfare_future_con{text-align:center;}
.hf_welfare_future_pic{ background-position:center; background-size:cover; width:200px; height:200px; border-radius:50%; margin:0 auto 15px auto;}
.hf_welfare_future_text h4{color:#0097d0; margin-bottom:15px;}
@media (min-width:992px){
	.hf_welfare_future_con{text-align:left; height:430px;}
	.hf_welfare_future_pic{float:left;}
	.hf_welfare_future_text{margin-left:240px;}
}



.hr_welfare_event_wrapper{ position:relative; overflow:hidden; margin:15px 0; border-top:4px solid #0097d0; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_welfare_event_wrapper:hover{border-top:4px solid #ff931f;}
.hr_welfare_event_photo{background-position:center; background-size:cover; height:320px; }
/*.hr_welfare_event_link{position:absolute; z-index:15; left:0; top:0; width:100%; height:100%;}*/
.hr_welfare_event_wrapper a{ position:absolute; z-index:16; left:0; top:0; width:100%; height:100%;}

/*.hr_welfare_event_slick{ margin:30px 0 0 0; padding:0;}
.hr_welfare_event_item{text-align:center; padding:0; margin:0; position:relative;}
.hr_welfare_event_item h6{ position:absolute; top:100%; left:50%; transform:translate(-50%,-92px); color:#fff; text-shadow: 0px 0px 5px #000, 0px 0px 10px #333, 0px 0px 15px #555;}
.hr_welfare_event_pic{background-position:center; background-size:cover; height:320px; margin-bottom:15px; position:relative;}
.hr_welfare_event_pic a{ position:absolute; z-index:15; left:0; top:0; width:100%; height:100%;}*/

.hr_welfare_event_white{ position:absolute; z-index:9; left:0; top:0; width:100%; height:100%; background-color:#fff; opacity:0.7; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_welfare_event_wrapper:hover .hr_welfare_event_white{ transform:translateY(240px);}
/*.hr_welfare_event_white.active,
.hr_welfare_event_item:hover .hr_welfare_event_white{ transform:translateY(220px);}*/

.hr_welfare_event_row{ position:relative;}
.hr_welfare_event_caption{ position:absolute; z-index:10; top:270px; left:50%; font-size:1.4rem; transform:translateX(-50%); color:#000; font-weight:900;}

.hr_welfare_event_slick .slick-dots {
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 1rem 0;
	list-style-type: none;
}
.hr_welfare_event_slick .slick-dots li {
	margin: 0 0.25rem;
}	
.hr_welfare_event_slick .slick-dots button {
	display: block;
	width: 0.7rem;
	height: 0.7rem;
	padding: 0;
	margin-top:-80px;
	position:absolute;
	z-index:9;	
	border: none;
	border-radius: 100%;
	background-color:rgba(000,000,000,0.5);			
	text-indent: -9999px;
}	
.hr_welfare_event_slick .slick-dots li.slick-active button {
	background-color: #0097d0;
}


.hr_process_nav{ padding:0; list-style:none;}
.hr_process_nav .nav-item{ float:left; width:20%; text-align:center; background-image:url(../images/hr_process_bg.png); background-position:center; background-repeat:repeat-x;}
.hr_process_nav .nav-item:first-child{ background-image:url(../images/hr_process_bg_first.png);}
.hr_process_nav .nav-item:last-child{ background-image:url(../images/hr_process_bg_last.png);}
.hr_process_nav .nav-item .nav-link{ display:block; width:48px; height:48px; border-radius:50%; background-color:#ededed; color:#555; font-size:0.8rem; padding:9px; margin:0 auto; line-height:0.9rem;}
.hr_process_nav .nav-item .nav-link.active{ background-color:#0097d0; color:#fff;}

.hr_process_nav .nav-item #hr_process_nav1.active{ background-color:#77d9f7;}
.hr_process_nav .nav-item #hr_process_nav2.active{ background-color:#4dc5f3;}
.hr_process_nav .nav-item #hr_process_nav3.active{ background-color:#1889c7;}
.hr_process_nav .nav-item #hr_process_nav4.active{ background-color:#005392;}
.hr_process_nav .nav-item #hr_process_nav5.active{ background-color:#03386f;}

#hr_process_content1,
#hr_process_content2,
#hr_process_content3,
#hr_process_content4,
#hr_process_content5{ position:relative;}

.hr_process_more{text-align:center; width:160px; margin-left:auto;}
.hr_process_more a{ display:block; padding:15px; background-color:#0097d0; color:#fff; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_process_more a:hover{ background-color:#003652; text-decoration:none;}

.hr_process_sublist_span{ display:block; margin-left:3rem; text-indent:-3rem;}
.hr_process_sublist_span strong{ }

.hr_process_pic{ height:240px; background-position:center; background-size:cover; margin-bottom:15px;}
.hr_process_text ol{ padding-left:22px;}
.hr_process_text .hr_process_title{ color:#0097d0;}
@media (min-width:1200px){
	.hr_process_pic{ width:320px; height:300px; float:left;}
	.hr_process_text{ margin-left:340px;}
	
	.hr_process_nav .nav-item .nav-link{ width:80px; height:80px; padding:20px 0 0 0; font-size:1rem; line-height:1.2rem;}
	
	.hr_process_more{ position:absolute; top:calc(100% - 15px); left:calc(100% - 15px); transform:translate(-100%,-100%); }
}




.hr_interview_title{ color:#0097d0; font-size:1.3rem; padding-left:30px; position:relative;}
.hr_interview_title span{ position:absolute; top:0; left:0; display:block; background-color:#0097d0; color:#fff; font-size:0.9rem; width:24px; height:24px; text-align:center; padding-top:4px; border-radius:4px;}
.hr_interview_p{ margin-left:30px;}
.hr_interview_p span{ color:#0097d0; display:block; font-size:0.9rem; margin-left:0.9rem; text-indent:-0.9rem;}

.hr_letter_wrapper .hr_letter_content .hr_interview_h5{ color:#000; margin-bottom:15px; line-height:1.8rem;}
.hr_letter_wrapper .hr_letter_content ol{ padding-left:48px;}

.hr_letter_wrapper{ -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
.hr_letter_envelope{ display:none;}

.hr_letter_head img,
.hr_letter_foot img{ margin:0; padding:0;}
.hr_letter_logo{}
.hr_letter_content{ padding:0 15px; margin-top:0; background-color:#fff;}

@media (min-width:992px){
	.hr_letter_content{ padding:0 30px; margin-top:0px;}
	
	.hr_letter_wrapper{ position:absolute; top:0; left:0; z-index:5; width:80%;}

	.hr_letter_envelope{ width:80%; margin-left:auto; padding-top:120px; display:block;}
	.hr_letter_envelope img{width:100%; height:auto;}
}
@media (min-width:1200px){
	.hr_letter_content{ padding:0 45px;}
}

.hr_faq_accordion .card{ border:none;}
.hr_faq_accordion .card-header{ padding:0; margin:0; background-color:transparent; border:none; width:100%;}
.hr_faq_accordion .card-header h2{ width:100%;}
.hr_faq_accordion .card-header .btn-link{ padding:0 0 15px 30px; margin:0; font-size:1.3rem; color:#555; font-weight:900; position:relative; width:100%; text-align:left; word-wrap:break-word; white-space: pre-line;}
.hr_faq_accordion .card-header .btn-link span{ position:absolute; top:25px; left:0; display:block; background-color:#0097d0; color:#fff; font-size:0.8rem; width:24px; height:24px; text-align:center; padding-top:4px; border-radius:50%;}
.hr_faq_accordion .card-header .btn-link:hover,
.hr_faq_accordion .card-header .btn-link:focus,
.hr_faq_accordion .card-header .btn-link:active{ text-decoration:none; color:#0097d0;}

.hr_faq_accordion .card-body{ position:relative; padding:15px; background-color:#ededed; margin-left:30px; border-radius:10px;}
.hr_faq_accordion .card-body p{ margin-bottom:0px;}
.hr_faq_accordion .card-body ol{ margin-bottom:0px; padding-left:20px;}
/*.hr_faq_accordion .card-body span{ position:absolute; top:15px; left:0; display:block; background-color:#0097d0; color:#fff; font-size:0.8rem; width:24px; height:24px; text-align:center; padding-top:2px; border-radius:50%;}
.hr_faq_accordion .card-body p{ margin-left:30px; color:#777;}*/

.hr_faq_accordion_arrow{ position:absolute; top:-10px; left:60px; color:#ededed;}

.page_hr_content form input[type="radio"]{ margin:7px 0 0 0;}
.page_hr_content form .form-check-inline label{}
.form_check_pic{ margin:10px auto; width:100%; height:160px; background-position:center; background-size:cover;}
.page_hr_content form .form-check{ text-align:center; position:relative;}
.page_hr_content form .form-check p{ font-size:1.2rem;font-weight:900;}

.page_hr_content form .form-group button{ padding:8px 30px; border:none;}

.form_check_title{ padding:15px; text-align:center; font-size:1.2rem; font-weight:900; color:#fff;}
#form_title1{ background-color:#0097d0}
#form_title2{ background-color:#708ea8}
#form_title3{ background-color:#003652}
.page_hr_content form i{color:#0097d0;}
.form_group_check_title{ position:relative;}
#form_check_title_anchor{ position:absolute; top:-96px;}
@media (min-width:992px){
	#form_check_title_anchor{top:-160px;}
}


.form_radio_wrapper .form-check-label{ display:block; width:100%; text-align:center; margin:0 auto; padding:0;}
.form_radio_wrapper .form-check-label p{ text-align:center; margin:0 auto;}
.form_radio_wrapper .form-check-input{ position:absolute; top:196px; left:50%; transform:translateX(-60px);}
.form_radio_wrapper  #exampleRadios2{ transform:translateX(-70px);}

.form_radio_wrapper1,
.form_radio_wrapper2,
.form_radio_wrapper3{padding:15px; margin-bottom:20px; border-radius:15px; position:relative;}
.form_radio_wrapper1 i,
.form_radio_wrapper2 i,
.form_radio_wrapper3 i{ position:absolute; top:100%; left:50%; font-size:2.4rem; transform:translate(-50%,-15px); opacity:0;}

.form_radio_wrapper1.active label p,
.form_radio_wrapper2.active label p,
.form_radio_wrapper3.active label p{ color:#fff;}

.form_radio_wrapper1.active{ background-color:#0097d0;}
.form_radio_wrapper1.active i{ color:#0097d0; opacity:1;}
.form_radio_wrapper2.active{ background-color:#708ea8;}
.form_radio_wrapper2.active i{ color:#708ea8; opacity:1;}
.form_radio_wrapper3.active{ background-color:#003652;}
.form_radio_wrapper3.active i{ color:#003652; opacity:1;}

.hr_learn_subtitle{ color:#0097d0;}
.hr_learn_target_item{ margin:15px 0; text-align:center;}
.hr_learn_target_item h6{ font-size:1.2rem; font-weight:900;}
.hr_learn_target_pic img{ width:100%; height:auto; max-width:128px;}
.hr_learn_plan_pic{ text-align:center;}
.hr_learn_plan_pic img{ margin-top:15px; width:100%; height:auto; max-width:800px;}

.hr_learn_event_pic{ margin:15px 0;}
.hr_learn_event_pic img{ widows:100%; height:auto;}

.hr_learn_slick_item{ padding:15px;}

.hr_safe_item{ margin:0 0 15px 0; padding:15px; border-bottom:1px dashed #ccc;}
.hr_safe_pic{ float:left; text-align:center;}
.hr_safe_pic img{ margin:0; width:100%; height:auto; max-width:96px;}
.hr_safe_text{ margin-left:106px;}
.hr_safe_text ol{ padding-left:20px; font-size:0.9rem; color:#777;}

.hr_safe_iso_pic img{ width:100%; height:auto; max-width:300px;}
.hr_safe_iso_text ol{ padding-left:20px;}
.hr_safe_more{ margin-top:45px; margin-bottom:30px;}
.hr_safe_more a{ padding:15px 40px; background-color:#0097d0; color:#fff; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.hr_safe_more a:hover{ text-decoration:none; background-color:#003652;}
.hr_safe_chart{ text-align:center;}
.hr_safe_chart img{ width:100%; height:auto; max-width:800px;}

.hr_safe_prevention_head img{ padding:0; margin:0;}
.hr_safe_prevention_content{ margin:0; padding:15px; background-color:#f9f2de;}
.hr_safe_prevention_content ol{ margin:0; padding-left:20px; color:#333;}
.hr_safe_prevention_foot img{ padding:0; margin:0;}
@media (min-width:992px){
	.hr_safe_prevention_content{ height:360px;}
}
@media (min-width:1200px){
	.hr_safe_prevention_content{ padding:30px;}
}



#hr_safe_modal .modal-header{ background-color:#0097d0;}
#hr_safe_modal .modal-header .modal-title{ color:#fff;}
#hr_safe_modal .modal-header button{ color:#fff; opacity:1;}
#hr_safe_modal .modal-body img{ border:4px solid #ccc;}
@media (min-width:992px){
	.hr_safe_iso_text h6{ margin:96px 0 30px 0;}
	#hr_safe_modal .modal-body{ height:600px}
}



.page_stakeholder_content p,
.page_stakeholder_content ol li,
.page_stakeholder_content ul li{ text-align:justify;}

.stakeholder_number_title{ padding-left:30px; position:relative;}
.stakeholder_number_title strong{  position:absolute; top:2px; left:0; display:block; background-color:#0097d0; color:#fff; font-size:0.9rem; width:20px; height:20px; text-align:center; padding-top:0px; border-radius:4px;}
.stakeholder_number_ol{ padding-left:30px; list-style:none;}
.stakeholder_number_ol li{ padding-left:30px; position:relative;}
.stakeholder_number_ol li strong{  position:absolute; top:2px; left:0; display:block; background-color:#6f8fa6; color:#fff; font-size:0.8rem; width:24px; height:20px; text-align:center; padding-top:0px; border-radius:4px;}

.stakeholder_table table thead tr th{ background-color:#003652; color:#fff; text-align:center; vertical-align:middle; border-bottom:1px solid #9dc3e6; border-top:1px solid #9dc3e6;}
.stakeholder_table table tbody tr td{ vertical-align:middle; border-bottom:1px solid #9dc3e6;}
.stakeholder_table table tbody tr td:nth-child(1){background-color:#708ea8; color:#fff;}
.page_content .page_stakeholder_content .stakeholder_table table tbody tr td ul{ padding-left:25px; list-style:disc;}
.page_content .page_stakeholder_content .stakeholder_table table tbody tr td ol{ padding-left:20px;}

.stakeholder_table{overflow-x: scroll; padding:0; margin:0;}
.stakeholder_table table{ min-width:880px; padding:0; margin:0;}

.stakeholder_table table tbody tr td h6{ text-align:center; font-weight:900;}
.stakeholder_table_pic img{width:100%; height:auto; max-width:128px; border-radius:0;}

@media (min-width:992px){
	.stakeholder_table{overflow-x:auto;}
	.stakeholder_table table{ min-width:none;}
}




/*2025-01-07-update*/

.hrj_wrapper{ padding:15px 0; margin-bottom: 15px; border-bottom:1px solid #ccc;  }
.hrj_text h4{ font-weight:700; font-size:1.2rem; }
.hrj_text p{ font-size:0.9rem; }
@media (min-width:992px){
	.hrj_wrapper{ position:relative; }
	.hrj_pic{ position:absolute; top:0; left:0;}
	.hrj_text{ margin-left:280px; }
}