@charset "utf-8";
/* CSS Document */
/*CSS Import*/
@import url("fonts.css");
@import url("back-to-top.css");
@import url("helper-class.css");

body {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color: #555555;}
.loader {position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url('../images/ring-alt.gif') 50% 50% no-repeat rgb(249,249,249);}
.p { text-align: justify;}
/* ////////// Main Class ////////// */
#global-contents {margin-top: 0; background-image: url(../images/home_bg.png); background-repeat: no-repeat; background-position: 50% 0;}
#global-contents.except {background-image: none;}
.wrapper-slider {position: relative; overflow: hidden;}
.bx-slider1 .slide {overflow: hidden;}
.bx-slider1 .slide > a {display: block; width: 150%; position: relative; overflow: hidden; left: -25%;}
.bx-wrapper {max-width: 1500px; margin: 0 auto; margin-bottom: 0px !important; box-shadow: none; border: none !important; background: none !important;}
.bx-wrapper img {margin: 0 auto;}
.bx-viewport {max-width: 1500px !important; margin: 0 auto !important; overflow: visible !important;}
.bx-wrapper .bx-prev,
.bx-wrapper .bx-next,
#bx-pager a, .img-links .item a picture + figcaption:after, .category-links .item a picture + figcaption:after,
.category-Lhead a:after, .sidebar .menu > ul > li > a:before,

footer ul {text-align:left;}

.footer-page .relate > ul > li:not(:first-child) a:before, .modal-menu .content-modal .content .col a:after,
.footer-page .download p a:before, .footer-page .download p a:after,
.footer-page .relate > ul > li > a[target="_blank"]:after, .anclink li a:before,
.wrap-sitemap .map-group h2 a:before,
.wrap-sitemap .map-group ul li a:before {content: ""; display: inline-block; background-image: url(../images/sprite.png); background-repeat: no-repeat;}
.bx-wrapper .bx-prev,
.bx-wrapper .bx-next,
.bx-wrapper .bx-controls-direction > a  {width: 34px; height: 78px; display: inline-block;}
.bx-wrapper .bx-controls-direction > a {text-indent: -9999px; outline: none; opacity: 0.6; z-index: 2000;}
.bx-wrapper .bx-controls-direction > a.bx-prev {left: 50%; margin-left: -600px;}
.bx-wrapper .bx-controls-direction > a.bx-next {right: 50%; margin-right: -600px;}
.bx-wrapper .bx-prev, .bx-wrapper .bx-prev:hover, .bx-wrapper .bx-prev:focus {background-position: -70px -100px;}
.bx-wrapper .bx-next, .bx-wrapper .bx-next:hover, .bx-wrapper .bx-next:focus {background-position: -110px -100px;}
.bx-wrapper .bx-controls-direction > a:hover {opacity: 0.4; filter: alpha(opacity=40); -ms-filter: "alpha(opacity=40)"; zoom: 1;}
#bx-pager {text-align: center; margin: 20px 0 0px;}
#bx-pager a {width: 48px; height: 14px; text-indent: -9999px;}
#bx-pager a {background-position: -150px -120px;}
#bx-pager a.active {background-position: -150px -100px;}

.mainContent, .mainContent > .container {clear: both; position: relative; margin: 0 auto;}
/*Section bg color .mainWrapper(n) */
.mainWrapper {padding: 50px 0 60px;/*padding: 50px 0 40px; @index.php*/ clear: both;}
.mainWrapper.img {background: url(../images/bg_img.png)}
.mainWrapper.color-gradient {background: -webkit-linear-gradient(top, #f7f7f7 0%, #ffffff 50%, #ffffff 100%); background: -moz-linear-gradient(top, #f7f7f7 0%, #ffffff 50%, #ffffff 100%); background: -ms-linear-gradient(top, #f7f7f7 0%, #ffffff 50%, #ffffff 100%); background: -o-linear-gradient(top, #f7f7f7 0%, #ffffff 50%, #ffffff 100%); background: linear-gradient(to bottom, #f7f7f7 0%, #ffffff 50%, #ffffff 100%);}
.mainWrapper.wrap01 {padding: 0 0 45px 0;}
.mainWrapper.wrap02 {padding: 35px 0 50px 0;}
.mainContent .heading {margin: 0 0 10px 0; text-align: center;}
.mainContent .heading h2 {color: #000; margin-top: 0; font-size: 40px; position: relative;}
.wrapper-breadcrumb .breadcrumb {font-size: 12px; font-size: 1.2rem; background: none; padding-left: 0; padding-right: 0;}
.top-detail-menu {margin: 0 0 25px;}
.except .mainWrapper.first {padding-top: 15px;}
.except .mainWrapper.first-content {    margin-top: 100px; padding-top: 17px;}
.img-heading-title { margin-top: 80px;}
.img-heading-title.img01 {background-image: url(../images/bg-heading-01.jpg);}
.img-heading-title.wrap {clear: both; background-color: #d0edff; background-repeat: no-repeat; background-position: 50% 0;}
.img-heading-title.wrap .wrap-title {   display: table; width: 100%;}
.img-heading-title.wrap .wrap-title .title {display: table-cell; width: 100%; height: 200px; padding: 10px 0 0 0; text-align: center; vertical-align: middle;}
.img-heading-title.wrap .wrap-title .title h1 {color: #005ba1; font-size: 48px; font-size: 4.8rem; line-height: 1.25;}
.right-heading {position: absolute; top: -39px; right: 0; padding: 0 10px 0 0; margin-top: -7px; font-size: 13px;}
.right-heading ul li:first-child a {    display: inline-block; padding: 5px 15px; background-color: #aaaaaa; color: #fff; font-weight: bold; text-decoration: none !important; text-align: center;}
.right-heading ul li:first-child {padding-right: 0;}
.right-heading ul li:first-child a:hover {background: #555555}
.right-heading ul li:last-child a:hover img {opacity: 0.8;}
.right-heading.press {position: relative; top: 0; padding: 10px 0;}
.right-heading.topic {position: relative; top: 0; margin: 0; padding: 10px 0;}
.heading h2 + ul {position: absolute; margin-bottom: 0; right: 0; top: 10px;}
.heading h2 + ul li {}
.heading h2 + ul li a.button {}
.heading h2 + ul li a.rss {}
.btn-filter {padding: 13px 15px; border: none;}
.btn-filter:hover,
.btn-filter:focus {outline: 0; background: #ccc;}


.sidebar {}
.sidebar .menu {}
.sidebar .menu ul {padding: 0; list-style-type: none; text-align: left;}
.sidebar .menu > h2 {display: table; width: 100%; margin: 0;}
.sidebar .menu > h2 > a {display: table-cell; width: 100%; height: 66px; padding: 5px 10px; background-color: #005ca2; color: #fff; font-size: 18px; font-size: 1.8rem; text-decoration: none !important; text-align: center; vertical-align: middle;}
.sidebar .menu > h2 > a:hover {opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; zoom: 1;}
.sidebar .menu > ul > li {border-bottom: 1px solid #cccccc;}
.sidebar .menu > ul > li > a:hover {background-color: #f6f6f6; color: #005ba1;}
.sidebar .menu > ul > li:not(.active) > a:hover:before {background-position: 0px -40px;}
.sidebar .menu > ul > li.active > a:hover, 
.sidebar .menu > ul > li > ul > li.active > a:hover {color: #000000;}
.sidebar .menu > ul > li.active > a {font-weight: bold; color: #000000;}
.sidebar .menu > ul > li.active.open > a {font-weight: normal; color: #000000;}
.sidebar .menu > ul > li > a {position: relative; display: block; padding: 18px 10px 15px 20px; background-color: #fff; color: #555555; line-height: 1.25; text-decoration: none !important;}
.sidebar .menu > ul > li > a:before {position: absolute; left: 8px; top: 22px; width: 5px; height: 9px; background-position: -10px -40px;}

.sidebar .menu > ul > li > ul > li > a:hover {background-color: #f6f6f6; color: #005ba1;}
.sidebar .menu > ul > li > ul > li > a:hover:before {background-color: #005ba1;}
.sidebar .menu > ul > li > ul {display: none;}
.sidebar .menu > ul > li.active > ul {display: block;}
.sidebar .menu > ul > li > ul > li > a {position: relative; display: block; padding: 12px 10px 10px 40px; background-color: #fff; color: #555555; font-size: 13px; font-size: 1.3rem; line-height: 1.25; text-decoration: none !important;}
.sidebar .menu > ul > li > ul > li > a:before {content: ""; position: absolute; left: 27px; top: 19px; display: block; width: 6px; height: 2px; background-color: #777777;}
.sidebar .menu > ul > li > ul > li.active > a {font-weight: bold; color: #000000;}
.sidebar .menu > ul > li > ul > li.active > a:before {background-color: #000000;}

.footer-page {overflow: hidden; margin-bottom: 15px;}
.footer-page .back a {display: inline-block; padding: 5px 30px; background-color: #aaaaaa; color: #fff; font-weight: bold; text-decoration: none !important; text-align: center;}
.footer-page .back a:hover {background: #555555;}
.footer-page .relate, .footer-page .back {overflow: hidden; margin: 25px 0 0;}
.footer-page .relate > ul {list-style-type: none; padding: 0;}
.footer-page .relate > ul > li > h3 {position: relative; font-size: 14px; float: left; display: inline-block; margin: 0 28px 0 0; padding: 7px 17px 7px 20px; background-color: #005ca2; color: #fff; font-weight: bold;}
.footer-page .relate > ul > li > h3:after {content: ""; position: absolute; right: -8px; top: 0; display: inline-block; width: 0; height: 0; border-width: 29px 8px 0 0; border-style: solid; border-color: #005ca2 transparent transparent transparent;}
.footer-page .relate > ul > li:first-child, .footer-page .relate > ul > li:not(:first-child) {float: left;}
.footer-page .relate > ul > li:not(:first-child) {padding: 5px 17px 5px 20px;}
.footer-page .relate > ul > li > a {position: relative; display: inline-block}
.footer-page .relate > ul > li:not(:first-child) a {color: #005ba1; font-weight: bold;}
.footer-page .relate > ul > li:not(:first-child) a:before {position: absolute; left: -12px; top: 4px; width: 7px; height: 11px; background-position: 0px -60px;}
.footer-page .relate > ul > li > a[target="_blank"]:after {margin: 0 0 0 7px; width: 9px; height: 9px; background-position: 0px -200px;}
.footer-page .download {margin-top: 20px;}
.footer-page .download p a {color: #005ba1; position: relative; padding: 0 0 0 15px;}
.footer-page .download p a:before {position: absolute; left: 0; top: 0.35em; width: 5px; height: 9px; background-position: 0px -40px;}
.footer-page .download p a:after {margin: 0 0 0 7px; vertical-align: middle; width: 14px; height: 14px; background-position: 0px -240px;}

.home-tabs {}
.home-tabs > ul > li {/*767 responsive*/ width: 100%;}

/*desktop*/
.home-tabs ul.tabs-navi {border-bottom: 1px solid #dddddd; overflow: hidden; width: 390px; margin: 0 auto;}
/*mobile*/
.home-tabs > ul > li > p {float: left; margin: 0; font-size: 18px; font-weight: bold;} 
.home-tabs > ul > li > a,
.home-tabs > ul > li > a:hover,
.home-tabs > ul > li > a:focus, 
.home-tabs > ul > li.open > a,
.home-tabs > ul > li.open > a:focus,
.home-tabs > ul > li.open > a:hover,
.home-tabs > ul > li.active > a,
.home-tabs > ul > li.active > a:hover,
.home-tabs > ul > li.active > a:focus {float: right; padding: 5px 15px; border: none !important; border-radius: 0; background-color: #337db5; color: #fff; font-size: 12px;}
.home-tabs > ul > li > ul.dropdown-menu {left: 0; right: 0; float: none; margin: 8px -15px 0; padding: 0; border: none; -webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3); -ms-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3); -o-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3); box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);}
.home-tabs > ul > li > ul.dropdown-menu li {border-bottom: 1px solid #005ca2;}
.home-tabs > ul > li > ul.dropdown-menu li a {background: #337db5; color: #ffffff; padding: 5px 15px;}
.home-tabs > ul > li > ul.dropdown-menu li a:hover {    background-color: #398ac7;}
.home-tabs > ul.nav-tabs {}

.home-tabs ul.tabs-navi li {float: left; padding: 0; width: 130px; text-align: center;}
.home-tabs ul.tabs-navi li.active a {border-bottom: 3px solid #005ca2;}
.home-tabs ul.tabs-navi li a {padding: 10px 10px; font-size: 18px; color: #777777; display: block;     border-bottom: 3px solid rgba(255, 255, 255, 0);}
.home-tabs ul.tabs-navi li:not(.active) a:hover {color: #555555;}
.home-tabs ul.tabs-navi li:not(.active) a:hover,
.home-tabs ul.tabs-navi li:not(.active) a:focus {border-bottom: 3px solid #dddddd;}
.home-tabs ul.tabs-navi li.active a {font-weight: bold; color: #005ca2;}

.home-tabs ul.tabs-navi li a:hover {}
.home-tabs ul.tabs-navi li.active a:hover, 
.home-tabs ul.tabs-navi li.active a:focus {}

.wrap-tab-list {}
.wrap-tab-list .item {position: relative; margin-bottom: 25px; -webkit-box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3); -ms-box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3); -o-box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3); box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3);}
.wrap-tab-list .item > a .category {position: absolute; z-index: 100;}
.wrap-tab-list .item > a .category span {padding: 3px 8px 3px 13px; color: #ffffff; position: relative;    float: left;}
.wrap-tab-list .item > a .category span:first-child {background: rgba(236,64,122,0.8); font-weight: bold; font-size: 16px;}
.wrap-tab-list .item > a .category span:first-child:after {content: ""; position: absolute; right: -8px; top: 0; display: inline-block; width: 0; height: 0; border-style: solid; border-width: 28px 8px 0 0; border-color: rgba(236,64,122,0.8) transparent transparent transparent;}
.wrap-tab-list .item > a .category span:last-child {background: rgba(75,126,166,0.8); margin: 0 0 0 8px; font-size: 12px; padding: 5px 15px 6px 13px;}
.wrap-tab-list .item > a .category span:last-child:after {content: ""; position: absolute; left: -8px; top: 0; display: inline-block; width: 0; height: 0; border-width: 28px 8px 0px 0px; border-style: solid; border-color: transparent rgba(75,126,166,0.8) transparent transparent;}
.wrap-tab-list .item > a {display: block; padding: 2px;}
.wrap-tab-list .item > a .caption {position: absolute; top: 2px; left: 2px; right: 2px; bottom: 2px; /*background: rgba(0,0,0,0.3);*/ transition: all 0.2s;
background: rgba(255,255,255,0);
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.09) 29%, rgba(0,0,0,0.3) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(29%, rgba(255,255,255,0.09)), color-stop(100%, rgba(0,0,0,0.3)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.09) 29%, rgba(0,0,0,0.3) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.09) 29%, rgba(0,0,0,0.3) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.09) 29%, rgba(0,0,0,0.3) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.09) 29%, rgba(0,0,0,0.3) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0 );}
.wrap-tab-list .item > a:hover .caption {background-color: rgba(0,92,162,0.8); transition: all 0.2s;}
.wrap-tab-list .item > a .caption ul {color: #ffffff; position: absolute; bottom: 10px; padding: 0 20px; width: 100%; font-size: 16px; text-shadow: 1px 1px 0 rgba(0,0,0,0.8);}
.wrap-tab-list .item > a .caption h4 {font-size: 12px; font-weight: bold; display: inline-block;}
.wrap-tab-list .item > a .caption .title:first-letter {text-transform: uppercase; font-size: 22px; font-weight: bold;}
.wrap-tab-list .menu-list-news {background: #ffffff; padding-bottom: 20px;}
.wrap-tab-list .menu-list-news ul {margin-bottom: 0;}
.wrap-tab-list .menu-list-news ul li {border-bottom: 1px solid #333333;}
.wrap-tab-list .menu-list-news .collapse ul li:last-child {border-bottom: none;}

.btn-list-collapse {background: #ffffff;width: 100%; font-size: 16px; padding: 15px 10px; border-radius: 0; color: #000000; border: 1px solid #dddddd; font-weight: bold; overflow: hidden; -webkit-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -ms-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -o-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3);}
.btn-list-collapse:hover,
.btn-list-collapse:focus,
.btn-list-collapse:active,
.btn-list-collapse:active:hover,
.btn-list-collapse:active:focus {color: #000000; border: 1px solid #dddddd; background-color: #eef9ff; outline: none !important;}

.btn-list-collapse.news.en[aria-expanded="false"]:before  {content: "View More"; }
.btn-list-collapse.news.en[aria-expanded="true"]:before  {content: "Close"; }
.btn-list-collapse.news.en[aria-expanded="false"]:after,
.btn-list-collapse.news.en[aria-expanded="true"]:after {display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: 24px; position: relative; top: 3px; margin: 0 0 0 10px; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.btn-list-collapse.news.en[aria-expanded="false"]:after {content: "\f107";}
.btn-list-collapse.news.en[aria-expanded="true"]:after {content: "\f106";}

/*index img-links*/
.img-links {padding: 0 15px; -webkit-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -ms-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -o-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3);}
.img-links .item {padding: 0;}
.img-links .item a {display: table; width: 100%; padding: 0 1px 0 0; border-bottom: 1px solid rgba(204,204,204,1.0);  -webkit-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; -moz-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; -ms-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; -o-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset;}
.img-links .item a:hover, .img-links .item a:focus {text-decoration: none;}
.img-links .item a:hover img {opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; zoom: 1; transition: all 0.2s !important;}
.img-links .item a picture {margin: 0;}
.img-links .item a picture img {width: 100%;}
.img-links .item a picture + figcaption {position: relative; padding: 25px 25px 20px; background-color: #f5f5f5; min-height: 85px;}
.img-links .item a picture + figcaption:after {position: absolute; right: 0; bottom: 0; z-index: 2; width: 45px; height: 20px; background-position: -140px -60px;}
.img-links .item a picture + figcaption h3 {display: table-cell; color: #000; font-size: 20px; font-size: 2.0rem; line-height: 1.25; vertical-align: middle; height: 50px;}

/*index except (menu page)*/.except .img-links {padding: 0; box-shadow: none;}
.except .img-links .item {padding-left: 15px; padding-right: 15px; margin-bottom: 25px;}
.except .img-links .item a {padding: 0; border-bottom: none; -webkit-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -ms-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -o-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3)}
.except .img-links .item a:hover {-webkit-box-shadow: 0px 7px 11px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 7px 11px 0px rgba(0,0,0,0.4); -ms-box-shadow: 0px 7px 11px 0px rgba(0,0,0,0.4); -o-box-shadow: 0px 7px 11px 0px rgba(0,0,0,0.4); box-shadow: 0px 7px 11px 0px rgba(0,0,0,0.4);}
.except .img-links .item a picture + figcaption {position: absolute; min-height: 61px; padding: 15px 25px 15px; bottom: 0; left: 15px; right: 15px; background-color: rgba(0,0,0,0.6);}
.except .img-links .item a picture + figcaption h3 {color: #ffffff; height: 30px; font-size: 15px; font-size: 1.5rem;}
.except .img-links.sub-hilight .item a picture + figcaption:after {background-position: -90px -40px;}
.except .img-links .item a:hover picture + figcaption {background-color: rgba(0,0,0,0.5); transition: all 0.2s;}
.except .img-links.hilight {}
.except .img-links.hilight .item  a {margin: 0;}
.except .img-links.hilight .item  a:hover {}
.except .img-links.hilight .item  a picture {position: relative; padding: 0; display: table-cell; text-align: center; vertical-align: middle; z-index: 100;}

.except .img-links.hilight .item  a picture + figcaption {display: table;  padding: 20px 15px; min-height: 250px; background: none;}
.except .img-links.hilight .item  a picture + figcaption:after {right: 15px;}
.except .img-links.hilight .item  a picture:after {content: ""; position: absolute; left: 0; top: 0; display: inline-block; width: 0; height: 0; border-width: 250px 49px 0 0; border-style: solid; border-color: #fff transparent transparent transparent; border-right-color: rgba(255,255,255,0);}
.except .img-links.hilight .item a picture + figcaption h3 {display: table-cell; height: 203px; color: #000; font-size: 32px; font-size: 3.2rem; text-align: center;}
.except .img-links.hilight .item a picture + figcaption h3 > p {font-size: 14px; color: #555555; margin-top: 10px;}

.except .img-links.topic .item {padding-right: 15px; padding-left: 15px;}
.except .img-links.topic .item a picture + figcaption {display: table; position: relative; min-height: 120px; width: 100%; left: 0; right: 0; background: #ffffff;}
.except .img-links.topic .item a picture + figcaption h3 {color: #000; display: table-cell; height: 90px; font-size: 32px; font-size: 3.2rem; line-height: 1.25;}
.except .img-links.topic .item a picture + figcaption:after {background-position: -140px -60px;}
.btn-all-topic {display: inline-block; border: 1px solid #cccccc; background-color: #fff; color: #000; text-decoration: none !important; text-align: center; width: 100%; padding: 7px 15px 5px; margin-bottom: 30px; font-size: 14px; font-size: 1.4rem; font-weight: normal;}
.btn-all-topic:hover {background-color: #eef9ff;}

.category-Lhead {margin-top: 0; border-top: 2px solid #bbbbbb;}
.category-Lhead, .category-Lhead a {display: block; padding: 18px 15px 15px; color: #000; font-size: 28px; font-size: 2.8rem; line-height: 1.25; text-align: center}
.category-Lhead a:after {margin: -7px 0 0 16px; vertical-align: middle; width: 8px; height: 13px; background-position: -40px -40px;}
.category-links {padding: 0 15px; margin: 0 15px; -webkit-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -ms-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); -o-box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3); box-shadow: 0px 6px 11px 0px rgba(0,0,0,0.3);}
.category-links .item {padding: 0;}
.category-links .item a {display: block; width: 100%; padding: 0 1px 1px 0; -webkit-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; -moz-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; -ms-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; -o-box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset; box-shadow: -1px -1px 0px 0px rgba(204,204,204,1.0) inset;}
.category-links .item a:hover, .category-links .item a:focus {text-decoration: none;}
.category-links .item a:hover img, .category-links .item a:focus img {opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; zoom: 1;}
.category-links .item a picture {margin: 0;}
.category-links .item a picture + figcaption {position: relative; min-height: 56px; padding: 15px 35px 15px 25px; background-color: #f5f5f5;}
.category-links .item a picture + figcaption h4 {display: table-cell; color: #000; height: 48px; line-height: 22px; font-size: 16px; font-size: 1.6rem; vertical-align: middle;}
.category-links .item a picture + figcaption:after {position: absolute; right: 15px; top: 50%; margin: -5px 0 0 0; z-index: 2; width: 7px; height: 10px; background-position: -10px -60px;}

/*Press & CSR Page*/
.filter, .menu-list-news.press, .menu-list-news.topic {padding-right: 30px}
.filter .form-group > label {padding-right: 0; padding-top: 11px; text-align: left; font-weight: normal; font-size: 12px;}
/*.filter .form-group > div {padding-left: 0;}*/
.press-line-right, .topic-line-right {border-right: 1px solid #dddddd;}
.press-line-left, .topic-line-left {border-left: 1px solid #dddddd;} 
.press-pickup > h2 {position: relative; display: inline-block; margin: 0 0 30px -15px; padding: 5px 24px 5px; background-color: #f06695; color: #fff; font-size: 16px; font-size: 1.6rem; font-weight: bold; text-align: center;}
.press-pickup > h2:after {content: ""; position: absolute; right: 0; bottom: 0; display: inline-block; width: 0; height: 0; border-width: 0 0 28px 8px; border-style: solid; border-color: transparent transparent #fff transparent; border-left-color: rgba(255,255,255,0);}
.press-pickup .item {margin-bottom: 20px;}
.press-pickup .item figcaption {margin-top: 5px;}
.press-pickup .item a .detail {color: #333333;}
.press-pickup .item a .tag {background: #6f98b8; color: #fff; font-size: 12px; position: relative; display: inline-block; min-width: 88px; padding: 1px 5px 0; text-align: center; vertical-align: middle;}
.press-pickup .item a .tag:before {content: ""; position: absolute; left: 0; top: 0; display: inline-block; width: 0; height: 0; border-width: 17px 5px 0 0; border-style: solid; border-color: #fff transparent transparent transparent; border-right-color: rgba(255,255,255,0);}
.press-pickup .item a .tag:after {content: ""; position: absolute; right: 0; bottom: 0; display: inline-block; width: 0; height: 0; border-width: 0 0 17px 5px; border-style: solid; border-color: transparent transparent #fff transparent; border-left-color: rgba(255,255,255,0);}
.press-pickup .item a .date {color: #777777; font-size: 12px; font-weight: bold; display: inline-block; margin-bottom: 5px;}
.press-pickup .item a:hover {text-decoration: none;}
.press-pickup .item a:hover .detail {text-decoration: underline;}
.press-pickup .item a:hover img {opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; zoom: 1;}
.press-pickup .owl-carousel .owl-dots {margin-top: 0px !important;}
.press-pickup.topic h2 {background-color: #327bb3; font-size: 15px; font-size: 1.5rem; font-weight: normal;}

.press-pickup.rec > h2 {margin-left: 0; margin-bottom: 0px;}
.press-pickup.rec .wrap-rec {overflow: hidden; border: 1px solid #dddddd; border-top: none; border-bottom: none;}
.press-pickup.rec .item {font-size: 13px; margin-bottom: 0; padding-bottom: 15px;}
.press-pickup.rec .item h3 {font-size: 13px; font-weight: bold; margin-bottom: 6px; margin-right: 20px;}
.press-pickup.rec .item > a span {color: #666; display: block; font-size: 12px; line-height: 1.8;}
.press-pickup.rec .item > a:hover h3 {text-decoration: underline;}
.press-pickup.rec .item h3 span {font-weight: normal; color: #666666; position: absolute; top: 15px; float: right; display: block; right: 12px;}
.press-pickup.rec .item h3 span > i {color: #b9b9b9;}
.press-pickup.rec .owl-carousel .item:nth-child(odd) {    background: #f4f4f4;}

.heading-table {font-size: 13px; font-weight: bold; overflow: hidden; color: #9a9a9a; background: #f3f3f3; padding: 10px 0px 10px; margin-bottom: 10px;}
.panel-group .panel-job + .panel-job {margin-top: 10px;}
.panel-job {background: #f2f2f2; border-radius: 0 !important; border-left: none; border-right: none;}
.panel-job .panel-heading {padding: 0; background: #fff;}
.panel-job .panel-heading .panel-title {font-size: 13px;}
.panel-job .panel-heading .panel-title > a {position: relative; display: block; padding: 10px 15px; border-radius: 0;}
.panel-job .panel-heading .panel-title > a .job {font-size: 14px; font-weight: bold;}
.panel-job .panel-heading .panel-title > a > span {position: absolute; display: block; right: 10px; top: 50%; margin-top: -9px;}
.panel-job .panel-heading .panel-title > a > span:after {display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: 18px; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.panel-job .panel-heading .panel-title > a[aria-expanded="true"] > span:after {content: "\f106"; }
.panel-job .panel-heading .panel-title > a[aria-expanded="false"] > span:after {content: "\f107"; }
.panel-job .panel-heading .panel-title > a[aria-expanded="false"]:hover {background: #f2f2f2;}
.panel-job .panel-heading .panel-title > a[aria-expanded="true"] {background: #005ba1; color: #fff;}
.panel-job .panel-heading .panel-title > a[aria-expanded="true"] .job small {color: #fff;}
.panel-job .panel-body {font-size: 13px;}
.panel-job .panel-body h3 {font-size: 14px; margin-top: 20px; font-weight: bold; color: #555555;}
.panel-job .panel-body {padding-top: 0; padding-bottom: 25px;}
.panel-job .panel-body .content {font-size: 13px;}
.panel-job .panel-body .content {margin-bottom: 0;}
.panel-job .panel-body .content ul {margin-bottom: 0;}
.panel-job .panel-body .content.footer {padding-top: 15px; margin-top: 15px; border-top: 1px solid #888;}
.panel-job .panel-body .content a.apply-btn, a.apply-btn {display: inline-block; background: #005ba1; color: #fff; margin-top: 10px; padding: 13px 30px;}
.panel-job .panel-body .content a.apply-btn:hover, a.apply-btn:hover {background: #07406C;}
#modal_apply {}
#modal_apply .modal-title {font-size: 18px; margin: 10px 0; color: #005ba1;}

.menu-list-news.press ul {margin-bottom: 25px;}
.menu-list-news.press ul > li {border-bottom: 1px solid #dddddd;}
.menu-list-news.press h1.title {margin: 10px 0 25px; color: #000; font-size: 28px; font-size: 2.8rem; line-height: 1.25;}
.menu-list-news.press h3.heading {margin: 0; padding: 15px 0 20px 0; border-top: 2px solid #005ca2; text-align: left; border-bottom: 1px solid #dddddd; color: #000; font-size: 20px; font-size: 2.0rem; line-height: 1.25;}

.menu-list-news.topic ul {margin-bottom: 25px;}
.menu-list-news.topic ul > li {border-bottom: 1px solid #dddddd;}
.menu-list-news.topic h1.title {margin: 10px 0 25px; color: #000; font-size: 28px; font-size: 2.8rem; line-height: 1.25;}
.menu-list-news.topic .right-heading.topic ul > li {border-bottom: none;}

.menu-list-news.topic.content ul > li:first-child {border-top: 1px solid #dddddd; margin-top: 10px;}
.menu-list-news.topic.content h1.title {margin-bottom: 15px;}/*Year*/

/*content page*/
.content-title {margin: 0 0 25px; color: #005ba1; font-size: 32px; font-size: 3.2rem; line-height: 1.25;}
.content-title.search {margin-bottom: 5px;}
.content-title.search + p {color: #444444;}
.content-title.sub {color: #000000; padding-bottom: 15px; margin-top: 20px; border-bottom: 2px solid #005ca2;}
.sidebar-content-wrapper {color: #555555; margin-top: 20px;}
.only-content-wrapper {color: #555555;}
.only-content-wrapper .date-content {margin-bottom: 20px;}

.wrap-manage {padding: 0px 15px; background: #005ca2; color: #fff;}
.wrap-manage .detail {padding: 10px 0 10px 15px; display: table-cell; line-height: 1.8; height: 200px; vertical-align: middle;}

.modal-menu {margin-bottom: 20px;}
.modal-menu .first-modal {background: url(../images/heading-modal-template.jpg) no-repeat; height: 306px;}
.modal-menu .first-modal > .image {position: absolute; right: 20px; bottom: 0;}
.modal-menu .first-modal > p {font-size: 18px; line-height: 1.25; position: absolute; bottom: 20px; left: 65px; width: 600px; color: #ffffff;}
.modal-menu .content-modal .content {padding: 0 15px; overflow: hidden;}
.modal-menu .content-modal .content .col {padding: 0;}
.modal-menu .content-modal .content .col a {position: relative; display: block; text-decoration: none !important;}
.modal-menu .content-modal .content .col a:hover img {opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; zoom: 1;-webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}
.modal-menu .content-modal .content .col a:after {position: absolute; right: 0; bottom: 0; z-index: 2; width: 48px; height: 21px; background-position: -90px -70px;}
.modal-menu .content-modal .content .col a picture:after {content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background: url(../images/caption-shadow.png) repeat-x 0 100%;}
.modal-menu .content-modal .content.content-2 .row .col:last-child a picture:after,
.modal-menu .content-modal .content.content-2 .row .col:last-child img,
.modal-menu .content-modal .content.content-3 .row .col:last-child img {margin-left: 2px;}
.modal-menu .content-modal .content.content-3 {margin-top: 2px; margin-bottom: 2px;}
.modal-menu .content-modal .content.content-3 .row .col:first-child a picture:after,
.modal-menu .content-modal .content.content-3 .row .col:first-child img {margin-left: -2px;}
.modal-menu .content-modal .content.content-3 .row .col:last-child a picture:after {margin-left: 2px;}
.modal-menu .content-modal .content.content-3 .row .col:first-child a:after {right: 2px;}
.modal-menu .content-modal .content figcaption {position: absolute; left: 0; bottom: 0; width: 100%; padding: 0 20px 20px;}
.modal-menu .content-modal .content figcaption h2 {margin: 0; color: #fff; font-size: 26px; font-size: 2.6rem; line-height: 1.25;}

.contact-form {}
.contact-table {display: table; table-layout: fixed; width: 100%; border-top: 1px solid #cccccc; border-left: 1px solid #cccccc; margin-bottom: 30px;}
.contact-table .form-control {width: 100%;}
.contact-table > dl.row {display: table-row; width: 100%;}
.contact-table > dl.row > dt, .contact-table > dl.row > dd {text-align: left; vertical-align: middle;}
.contact-table > dl.row > dt {padding: 20px 40px; display: table-cell; width: 32%; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #f5f5f5;}
.contact-table > dl.row > dt > label {font-size: 1.5rem; font-weight: bold; vertical-align: middle}
.contact-table > dl.row > dt > label + span {display: inline-block; padding: 1px 3px 0; margin-left: 10px; /*background-color: #dc022b;*/ color: #dc022b; font-size: 13px;}
.contact-table > dl.row > dt > .remark {margin: 5px 0 0 0; font-size: 13px; font-weight: normal;}
.contact-table > dl.row > dd {padding: 20px 25px; display: table-cell; width: 68%; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #fff;}
.contact-table > dl.row > dd > input {width: 330px; display: inline-block;}
.contact-table > dl.row > dd > input[type="file"] {height: 40px;}
.contact-table > dl.row > dd > .wrap-upload {width: 260px;}
.contact-table > dl.row > dd > .wrap-upload .form-group {position: relative;}
.contact-table > dl.row > dd > .wrap-upload .form-group a {position: absolute; right: -30px; border-radius: 50px; top: 18px; border: 1px solid #ffa8a8; padding: 1px 6px; color: #d02525;}
.contact-table > dl.row > dd > .wrap-upload input[type="file"] {height: 40px;}
.contact-table > dl.row > dd > .help {font-size: 13px; display: inline-block; margin: 0 0 0 2em; vertical-align: middle;}
.contact-form .finish {display: inline-block; border: none; transition: 0.3s; padding: 20px 45px 17px; background-color: #005ca2; font-size: 20px; font-weight: bold; color: #ffffff;}
.contact-form .finish:hover {background-color: #337db5; text-decoration: none;}
.contact-form .panel-map .panel-body h3 {margin-top: 0; font-size: 14px; font-weight: bold;}
.contact-table.career {}
.contact-table.career > dl.row > dt {width: 32%;}
.contact-table.career > dl.row > dd {width: 68%;}
.contact-table.career .wrap-salary {width: 330px;}
.contact-table.career .wrap-salary input {width: 100%;}
.contact-table.career .wrap-salary label {position: absolute; left: -2px; top: 4px;}
.contact-table.career .form-group.name .input-group-addon,
.contact-table.career .form-group.score .input-group-addon {padding: 0 5px; width: 80px;}
.contact-table.career .form-group.name .input-group-addon + input,
.contact-table.career .form-group.score .input-group-addon + input {width: 210px;}
.contact-table.career .form-group.name .input-group-addon select,
.contact-table.career .form-group.score .input-group-addon select {width: 100%;}
.contact-table.career .name-group input {width: 125px;}

.add-upload {width: 260px; font-size: 13px; margin-bottom: 10px; margin-top: 15px;}
.add-upload a {display: block; text-align: center; padding: 5px 0; border: 1px dashed #005ba1; text-decoration: none;}
.add-upload a:hover {background: #cbe0f1; color: #3288ca;}

/*text editor*/
.anclink { margin-left: 10px; }
.anclink li {    margin: 0 40px 10px 0;}
.anclink li a {padding-left: 15px; position: relative;}
.anclink li a:before {position: absolute; left: 0; top: 0.5em; width: 11px; height: 6px; background-position: 0px -160px;}
.anclink-title {color: #000000; font-weight: normal; font-size: 26px;}
.anclink-title.notlink {font-size: 24px; margin-top: -20px;}
.anclink-sub {border-top: 2px solid #005ca2; margin-top: 30px; padding: 15px 0 0 0; color: #000; font-size: 20px;} 
.anclink-sub.notlink {margin-top: 20px;}

.table_style1 {font-size: 14px;}
.table_style1 .head_cell { background-color: #005ca2;  color: #fff;}
.table_style1 th {padding: 10px 15px; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #fff; text-align: left; vertical-align: top;}
.table_style1 tbody tr:first-child {border-top: 1px solid #ccc;}
.table_style1 td {padding: 10px 15px; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #fff}
.table_style1 tbody th, .table_style1 tbody td.v-align-mid, .table_style1 tbody td.v-align-top {border-left: 1px solid #ccc; background-color: #f5f5f5;}


.cell_01 {display: table; width: 100%;}
.cell_01 .img {float: right;}
.cell_01 .des {float: left;}
.cell_01 .des p {height: 180px; display: table-cell; vertical-align: middle;}

.content-align-mid1 {display: table-cell; vertical-align: middle; min-height: 130px; height: 130px;}

.list-blue {list-style: none;}
.list-blue li {position: relative;}
.list-blue li:before {content: ""; position: absolute; left: -15px; top: 0.65em; display: block; width: 4px; height: 4px; background-color: #005ca2;}

/*welcome page*/
.container.container-welcome {}
.panel-welcome {margin-top: 50px;}
.panel-welcome .panel-footer.primary {background: #005ca2;}
.panel-welcome .panel-body {padding: 5px;}
@media (min-width: 1200px) and (max-width: 1360px) and (min-height: 600px) and (max-height: 640px) {
  .container.container-welcome {width: 920px;}
  .panel-welcome {margin-top: 40px;}
}
@media (min-width: 1361px) and (max-width: 1400px) and (min-height: 641px) and (max-height: 690px) {
  .container.container-welcome {width: 1160px;}
  .panel-welcome {margin-top: 30px;}
}



/*search page*/
.search-option {margin: 15px 0 15px;}
.search-option .dropdown-menu {left: auto; right: 0; padding: 5px 0 15px;  background: rgba(0, 0, 0, 0.7); border-radius: 0;}
.search-option .dropdown-menu .btn-group {padding: 3px 20px;}
.search-option .dropdown-menu .dropdown-header {margin-top: 10px; color: #ffffff;}
.search-panel {margin: 20px 0 0; padding-bottom: 40px; border-bottom: 2px solid #eee;}
.search-panel .input-group input.form-control {width: 600px; height: 32px; border-right: none; background: #eeeeee; border-radius: 40px 0 0 40px;}
.search-panel .input-group input.form-control:focus {box-shadow: none; outline: 0; border: 1px solid #ccc; border-right: none;}
.search-panel .input-group-addon {padding: 0; border-radius: 0 40px 40px 0;}
.search-panel .input-group-addon button {margin: 0; padding: 7px 15px 7px; border: none; border-radius: 0 40px 40px 0; background: #eee; box-shadow: none;}
.search-result {}
.search-result .item {margin-bottom: 10px; padding: 20px 0; border-bottom: #eeeeee 2px solid;}
.search-result img {border-radius: 5px; border: 0px; -webkit-box-shadow: 0 0 8px #dddddd; -ms-box-shadow: 0 0 8px #dddddd; box-shadow: 0 0 8px #dddddd; -moz-transition-property: all; -ms-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -ms-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; cursor: pointer;}
.search-result .title h3 {margin: 0 0 10px 0;}
.search-result .title h3 a {color: #990033; font-size: 17px;}
.search-result .title p {margin-bottom: 10px;}
.search-result .link {    color: #999999; font-weight: bold; font-size: 13px;    word-break: break-word;}

/*Sitemap*/
.wrap-sitemap {}
.wrap-sitemap .row > div > .map-group {margin-top: 35px;}
.wrap-sitemap .row > div > .map-group:first-child {margin-top: 0;}
.wrap-sitemap .map-group h2 {font-size: 18px; font-weight: bold;}
.wrap-sitemap .map-group h2 a {position: relative; padding: 0 0 0 24px;}
.wrap-sitemap .map-group h2 a:before {position: absolute; left: 0; top: 0.2em; width: 14px; height: 14px; background-position: -70px -60px;}
.wrap-sitemap .map-group ul {margin-top: 20px; padding-left: 5px; list-style: none;}
.wrap-sitemap .map-group ul li {margin-top: 8px;}
.wrap-sitemap .map-group ul li a {position: relative; padding: 0 0 0 15px;}
.wrap-sitemap .map-group ul li a:before {width: 5px; height: 9px; background-position: -20px -40px; position: absolute; left: 0; top: 0.35em;}

.wrap-sitemap .map-group h2 a:visited,
.wrap-sitemap .map-group ul li a:visited {color: #7b4389; text-decoration: none;}

/*NEW CSS*/


.nestedcounter-list > ol {
	margin-left: -40px;
}
  
.nestedcounter-list > li:first-of-type {
  counter-reset: item;

}
.nestedcounter-list > li:before {
		
        content: counters(item, "-") "." " ";
        counter-increment: item;
        
}

.nestedcounter-list > li {
  list-style: none;
}



.list-mainmenu-mobile hr {
    border-top:0px;
    border-bottom:1px rgb(255, 255, 255, 0.3) solid;
    margin-top:5px;
    margin-bottom: 5px;
}

.modal-title {
    font-size: 24px;
    font-weight: 700;
    color: #333333;
    margin-bottom: 10px;
}

.modal-body {
    font-size: 13px;
    font-weight: 400;
    color: #333333;
    padding-bottom:50px;
}

.box-default {
    background: #eeeeee;
    padding: 20px;
    font-size: 12px;
}

.valign-middle {vertical-align: middle !important;}

.disclaimer-box {
    background: #f4d577;
    padding: 20px;
    font-size: 12px;
    color: #c83c43;
}

.wrap-title p {
    font-size:14px;
    font-weight:700;
    color: #333333;
}

.text-caption {
    font-size:12px;
}

.box-addon {
    background:#edf8fc;
    padding:15px;
    margin-bottom:20px;
}

.box-addon h3 {
    background:#edf8fc;
    padding:15px;
    margin-bottom:20px;
}

.text-darkblue {
    color: #005ba1;
}

h4.panel-title a {
    font-size: 14px;
    font-weight: 700;
    line-height:24px;
    color:#337ab7;
}

.mt0 {margin-top: 0px;}

.con li  { padding-bottom:10px; margin-left:-20px }

.sidebar-content-wrapper ol li  { padding-bottom:10px; margin-left:-20px; padding-left: 20px; }
.sidebar-content-wrapper ul li  { padding-bottom:10px; margin-left:-20px; padding-left: 20px; }
.bulletin ol li  { padding-bottom:10px; margin-left:-20px; padding-left: 20px; }
.bulletin ul li  { padding-bottom:10px; margin-left:-20px; padding-left: 20px; }

.quote { background: #eaf8fe; padding:20px; border-radius: 15px; }
.quote p { font-family: times new roman; font-size: 18px; font-style: italic; padding: 20px; }

.con-title { font-size: medium; font-weight: 700; }

blockquote {
  background: #eaf8fe;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 2.5em;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote:after {
  color: #ccc;
  content: close-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.8em;
}
blockquote p {
  display: inline;
  font-size: 18px; font-style: italic; padding: 0px;
}

.mega-dropdown p {text-align:left;}

/*//////////////////Media Query//////////////////*/
/*col-xss*/
@media (max-width: 480px) { 
  .btn-list-collapse {font-size: 13px;}
  .btn-list-collapse.news.en[aria-expanded="false"]:after, 
  .btn-list-collapse.news.en[aria-expanded="true"]:after {font-size: 20px;}
  .img-links .item a picture {display: table-cell; width: 107px; text-align: left; vertical-align: top}
  /*index except (menu page)*/.except .img-links .item a picture + figcaption {position: relative; left: 0;}
  
  .except .img-links.hilight .item a picture + figcaption {min-height: 140px !important; padding: 10px 10px;}
  .except .img-links.hilight .item a picture + figcaption h3 {height: 100px;}
  .except .img-links.sub-hilight .item a picture + figcaption {background-color: rgba(0,0,0,0.8);}
  .except .img-links.sub-hilight .item a:hover picture + figcaption {background-color: rgba(0,0,0,0.6);}
  
  .except .img-links.topic .item a picture {display: block; width: 100%;}
  .except .img-links.topic .item a picture + figcaption {display: block;}
  
  .btn-filter {width: 100%;}
  
  
  .contact-table.career .input-group-addon {vertical-align: top; padding-top: 6px;}
  .contact-table.career .form-group.name .input-group-addon {padding-top: 6px;}
  .contact-table.career .name-group input {width: 100% !important;}
  .contact-table.career .name-group input:first-child {margin-bottom: 15px;}

  blockquote {
    background: #eaf8fe;
    border-left: 5px solid #ccc;
    margin: 0.8em 5px;
    padding: 1.5em;
    }

  blockquote p {
    font-size: 14px;
    }
  
  
}

@media (min-width: 481px) and (max-width: 767px) { 
  .img-links .item a picture + figcaption {display: block !important;}
  .img-links .item a picture + figcaption h3 {height: 70px;}
}

@media (max-width: 640px) {
  .modal-menu {}
  .modal-menu .content-modal .content {margin: 0 -15px;}
  .modal-menu .content-modal .content .col a:after {background-image: url(../images/sprite%402x.png); background-size: 200px 400px;}
  
  .modal-menu .content-modal .content .col a {display: table; table-layout: fixed; width: 100%; margin-bottom: 1px;}
  .modal-menu .content-modal .content .col a picture {display: table-cell; width: 160px; /*text-align: left; */vertical-align: top;}
  .modal-menu .content-modal .content .col a picture:after {display: none;}
  .modal-menu .content-modal .content .col a picture img {width: 160px; height: auto;}
  .modal-menu .content-modal .content .col a figcaption {display: table-cell; position: static; /*text-align: left; */vertical-align: middle; padding: 12px; background-color: #f5f5f5; min-height: 85px;}
  .modal-menu .content-modal .content.content-2 .row .col:last-child a picture:after, 
  .modal-menu .content-modal .content.content-3 .row .col:first-child a picture:after,
  .modal-menu .content-modal .content.content-3 .row .col:last-child a picture:after {margin-left: 0;}
  
  .modal-menu .content-modal .content.content-2 .row .col:last-child img, 
  .modal-menu .content-modal .content.content-3 .row .col:first-child img, 
  .modal-menu .content-modal .content.content-3 .row .col:last-child img {margin: 0;}
  .modal-menu .content-modal .content.content-3 {margin-top: 0;}
  .modal-menu .content-modal .content .col a:after {content: ""; display: inline-block; width: 31px; height: 14px; background-position: -65px -60px;}
  .modal-menu .content-modal .content.content-3 .row .col:first-child a:after {right: 0;}
  
  .modal-menu .first-modal {height: 161px; margin-left: -15px; margin-right: -15px;}
  .modal-menu .first-modal .title {width: 300px; margin: 0 auto; padding-top: 15px;}
  .modal-menu .first-modal > p {width: 100%; margin: 0 auto; padding: 0 10px; text-align: center; left: 0; right: 0; bottom: 15px; font-size: 13px;}
  .modal-menu .first-modal > .image {width: 95px; top: 2px; left: 50%; margin-left: 55px;}
  .modal-menu .content-modal .content figcaption h2 {font-size: 15px; font-size: 1.5rem; text-align: center;}
  
  
  
}
@media (min-width: 641px) and (max-width: 767px) { 
  .modal-menu .first-modal {height: 210px;}
  .modal-menu .first-modal .title {width: 65%;}
  .modal-menu .first-modal > p {left: 40px; bottom: 15px; font-size: 15px}
  .modal-menu .first-modal > .image {width: 30%;}
  .modal-menu .content-modal .content figcaption h2 {font-size: 15px; font-size: 1.5rem;}
}
@media (min-width: 641px) {
  .modal-menu .content-modal .content figcaption {background: none !important;}
}

/*col-xs (Extra small devices)*/
@media (max-width: 767px) { 
   #global-contents {background-image: none;}
   .mainWrapper.wrap01 {padding: 0 0 15px 0;}
   .mainWrapper.wrap02 {padding: 5px 0 50px 0;}
   .except .mainWrapper.first-content {margin-top: 45px;}
   .img-heading-title.wrap .wrap-title .title {height: 100px; padding-top: 5px;}
   .img-heading-title.wrap .wrap-title .title h1 {font-size: 24px; font-size: 2.4rem;}
   .img-heading-title {margin-top: 45px; background-size: auto 133px;}
   .right-heading.press {margin: 0; padding-bottom: 0;}
   .right-heading.press ul {margin-bottom: 0;}
   .sidebar {margin: 30px -15px 0;}
   
   .wrapper-slider {margin-top: 45px;}
   
   .bx-wrapper .bx-prev,
   .bx-wrapper .bx-next,
   #bx-pager a, .home-tabs > ul > li > a:after, .img-links .item a picture + figcaption:after,
   .panel-link-mobile .panel-heading a:after, .wrap-panel-link .panel-link-mobile .panel-collapse > ul > li  a:after,
   .footer-page .relate > ul > li:not(:first-child) a:before,
   .footer-page .download p a:before {background-image: url(../images/sprite%402x.png); background-size: 200px 400px;} 
   .bx-wrapper .bx-prev,
   .bx-wrapper .bx-next,
   .bx-wrapper .bx-controls-direction > a {width: 17px; height: 39px;}
   .bx-wrapper .bx-controls-direction > a.bx-prev {left: 0%; margin-left: 0;}
   .bx-wrapper .bx-controls-direction > a.bx-next {right: 0%; margin-right: 0;}
   .bx-wrapper .bx-prev, .bx-wrapper .bx-prev:hover, .bx-wrapper .bx-prev:focus {background-position: -120px -70px;}
   .bx-wrapper .bx-next, .bx-wrapper .bx-next:hover, .bx-wrapper .bx-next:focus {background-position: -140px -70px;}
   
   #bx-pager a {width: 26px; height: 8px;}
   #bx-pager a {background-position: -120px -120px;}
   #bx-pager a.active {background-position: -120px -110px;}
   
   /*Section bg color .mainWrapper(n) */
   .mainWrapper {padding: 35px 0 40px;}
   .mainWrapper.xs-pb20 {padding-bottom: 20px;}
   .mainContent .heading h2 {font-size: 24px;}
   .right-heading {position: relative; top: 0; text-align: right; width: 100%; padding-right: 0; margin: 15px 0;}
   .home-tabs > ul.nav-tabs {margin: 0 -15px; background: #005ca2; color: #fff; padding: 10px 15px;}
   .home-tabs > ul > li > a:after {content: ""; position: relative; display: inline-block; width: 10px; height: 10px; top: 2px; left: 8px; background-repeat: no-repeat; background-position: 0px -300px;}
   .wrap-tab-list .item > a {padding: 0;}
   .wrap-tab-list .item > a .caption,
   .wrap-tab-list .item > a .caption ul {position: relative; top: 0; left: 0; right: 0; padding-bottom: 5px; background: none; color: #333333; text-shadow: none;}
   .wrap-tab-list .item > a .caption h4 {color: #777777;}
   .wrap-tab-list .item > a:hover .caption {background: none; }
   .wrap-tab-list .item > a:hover, .wrap-tab-list .item > a:focus {text-decoration: none;}
   
   /*index img-links*/
   .img-links .item a {padding-bottom: 0;}
   .img-links .item a picture + figcaption {display: table-cell; text-align: left; vertical-align: middle; padding: 12px;}
   .img-links .item a picture + figcaption h3 {font-size: 16px;}
   .img-links .item a picture + figcaption:after {position: absolute; right: 0; bottom: 0; z-index: 2; width: 31px; height: 14px; background-position: -65px -79px;}
   
   /*index except (menu page)*/.except .img-links .item a picture + figcaption:after {background-position: -65px -40px;}
   .except .img-links.sub-hilight .item a picture + figcaption:after {background-position: -65px -40px; width: 31px; height: 14px}
   .except .img-links.hilight .item a picture, 
   .except .img-links.hilight .item a picture + figcaption {position: relative; min-height: 159px; display: block !important; left: 0; right: 0;}
   .except .img-links.hilight .item a picture {min-height: 112px;}
   .except .img-links.hilight .item a picture:after {border-width: 0;}
   .except .img-links.hilight .item a picture + figcaption h3 {font-size: 19px; font-size: 1.9rem; text-align: left; height: 120px;}
   .except .img-links.hilight .item a picture + figcaption:after {right: 0; width: 31px; height: 14px; background-position: -65px -80px;}
   .except .img-links.topic .item a picture + figcaption {min-height: 120px;}
   .except .img-links.topic .item a picture + figcaption:after {width: 31px; height: 14px; background-position: -65px -80px;}
   .except .img-links.topic .item a picture + figcaption h3 {height: 90px; font-size: 19px; font-size: 1.9rem; display: table-cell; text-align: left}
   
   .category-links .item a picture + figcaption h4 {font-size: 13px;}
   .filter .form-group > div {padding-left: 15px;}
   .filter, .menu-list-news.press, .menu-list-news.topic {padding-right: 0;}
   .press-pickup {border-left: none;}
   .press-pickup > h2 {display: block; margin-left: 0;}
   .press-pickup > h2:before {content: ""; position: absolute; left: 0; top: 0; display: inline-block; width: 0; height: 0; border-width: 30px 8px 0 0; border-style: solid; border-color: #fff transparent transparent transparent; border-right-color: rgba(255,255,255,0);}
   .press-line-right, .press-line-left, .topic-line-right, .topic-line-left {border: none;}
   .owl-theme .owl-nav.disabled+.owl-dots {margin-bottom: 15px;}
   .menu-list-news.press h1.title, .menu-list-news.topic h1.title {font-size: 24px;}
   .menu-list-news.press h3.heading {font-size: 18px;}
   .menu-list-news.press a.news-list > .date, .menu-list-news.topic a.news-list > .date {font-size: 11px;}
   .menu-list-news.press a.news-list > .detail, .menu-list-news.topic a.news-list > .detail {font-size: 12px;}
   .menu-list-news.topic h1.title {margin: 30px 0 0; padding: 10px 0 17px 0;  border-top: 2px solid #005ca2; border-bottom: 1px solid #dddddd;}
   
   .menu-list-news.topic.content h1.title {border-bottom: none; margin-bottom: 0; margin-top: 5px; padding-bottom: 5px; border-top: none; text-align: center; font-size: 22px;}
   
   .wrap-panel-link /*or category-links for mobile*/ {margin: 0 -15px; border-bottom: 1px solid #cccccc;}
   .panel-link-mobile {border: none; margin-bottom: 0; box-shadow: none;}
   .panel-link-mobile .panel-heading {position: relative; border-top: 1px solid #cccccc; border-bottom: none; padding: 20px 15px;}
   .panel-link-mobile .panel-heading a {color: #000; display: block; text-decoration: none !important;}
   .panel-link-mobile .panel-heading a:after {content: ""; position: absolute; right: 15px; top: 50%; margin: -11px 0 0 0; width: 22px; height: 22px;}
   .panel-link-mobile .panel-heading a[aria-expanded="false"]:after {    background-position: -65px -340px;}
   .panel-link-mobile .panel-heading a[aria-expanded="true"]:after {background-position: -65px -370px;}
   .panel-link-mobile .panel-heading + .panel-link {margin-bottom: 0; border: none; box-shadow: none;}
   .wrap-panel-link .panel-link-mobile .panel-collapse > ul > li {padding: 0;  background-color: #f7f7f7;}
   .wrap-panel-link .panel-link-mobile .panel-collapse > ul > li  a {color: #000; padding: 13px 15px 13px 30px; display: block; text-decoration: none !important;}
   .wrap-panel-link .panel-link-mobile .panel-collapse > ul > li  a:after {content: ""; position: absolute; display: inline-block; right: 15px; top: 50%; margin: -5px 0 0 0; width: 7px; height: 10px; background-position: -10px -60px;}
   .wrap-panel-link .panel-link-mobile .panel-collapse > ul > li:first-child {border-top: 1px solid #cccccc !important;}
   
   /*content page*/
   .content-title {font-size: 23px; font-size: 2.3rem;}
   .sidebar-content-wrapper {font-size: 12px; margin-top: 5px;}
   .only-content-wrapper {font-size: 12px;}
   .only-content-wrapper .date-content {font-size: 12px;}
   
   .sidebar .menu > ul > li > a {padding-left: 15px; padding-right: 15px;}
   .sidebar .menu > ul > li > a:before {right: 15px; left: auto;}
   .sidebar .menu > ul > li.active > a {background-color: #dddddd; border-bottom: 1px solid #cccccc;}
   .sidebar .menu > ul > li.active.open > a {background: #ffffff;}
   .sidebar .menu > ul > li.active.open > a:hover {background-color: #f6f6f6;}
   .sidebar .menu > ul > li > ul > li.active > a {background-color: #dddddd;}
   
   .footer-page .relate > ul > li:not(:first-child) {width: 100%; padding: 7px 12px 7px 12px;}
   .footer-page .relate > ul > li:not(:first-child) a {font-size: 12px;}
   .footer-page .relate > ul > li:not(:first-child) a:before {content: ""; display: inline-block; width: 5px; height: 9px; background-position: 1px -40px;}
   .footer-page .relate > ul > li:first-child {width: 100%; margin-bottom: 5px;}
   .footer-page .relate > ul > li > h3 {font-weight: normal; width: 95%; margin: 0 8px; position: relative; text-align: center;}
   .footer-page .relate > ul > li > h3:before {content: ""; position: absolute; left: -8px; bottom: 0; display: inline-block; width: 0; height: 0; border-width: 0 0 29px 8px; border-style: solid; border-color: transparent transparent #005ca2 transparent;}
   .footer-page .download p {font-size: 12px;}
   .footer-page .download p a:before {position: absolute; left: 0; top: 0.35em; width: 5px; height: 8px; background-position: 0px -40px;}
   
   .contact-table > dl.row {display: block; margin: 0;}
   .contact-table > dl.row > dt, .contact-table.career > dl.row > dt {display: block; width: 100%; padding: 12px 11px 10px; text-align: center;}
   .contact-table > dl.row > dt > label + span {font-size: 10px;}
   .contact-table > dl.row > dt > .remark {font-size: 11px;}
   .contact-table > dl.row > dd, .contact-table.career > dl.row > dd {display: block; width: 100%; padding: 15px 11px;}
   .contact-table > dl.row > dd > input {width: 100%;}
   .contact-table > dl.row > dd > .help {font-size: 11px; margin-left: 0; margin-top: 5px;}
   .contact-table > dl.row > dd > .wrap-upload, .add-upload {width: 85%;}
   .contact-table > dl.row > dd > .wrap-upload .form-group a {top: 8px;}
   .contact-table.career .form-group {margin-bottom: 0;}
   .contact-table.career .wrap-salary, 
   .contact-table.career .form-group.name .input-group,
   .contact-table.career .form-group.score .input-group,
   .contact-table.career .form-group.name .input-group-addon + input,
   .contact-table.career .form-group.score .input-group-addon + input {width: 100%;}
   .contact-table.career .name-group input {width: 50%;}
   
   .contact-form .finish {width: 100%; text-align: center; font-size: 16px; font-weight: normal;}
   
   .search-panel .input-group input.form-control {width: 100%;}
   
   .panel-job .panel-heading .panel-title > a .job {margin-bottom: 5px;}
   .panel-job .panel-body h3 {font-size: 13px;}
   
   .wrap-manage .detail {height: auto; padding: 15px 0; display: block;}
   
   .anclink-title {font-size: 24px;}
   .anclink-title.notlink {font-size: 20px; margin-top: -15px;}
   .anclink-sub {font-size: 16px;}
   .anclink-sub.notlink {margin-top: 5px;}
   
   .table_style1 {font-size: 12px;}
   
   .content-align-mid1 {height: auto; min-height: auto; display: block;}
   
   /*sitemap*/
   .wrap-sitemap .map-group h2 {font-size: 16px;}
   .wrap-sitemap .map-group ul {margin-top: 15px;}
   .wrap-sitemap .row > div:last-child > .map-group:first-child {margin-top: 35px;}
   
}

/*col-sm (Small devices Tablets)*/	
@media (min-width: 768px) and (max-width: 991px) {
   .navbar-nav li.mega-dropdown > a, li.mega-dropdown.disable > a {padding-left: 20px; padding-right: 20px;}
   .img-heading-title.wrap .wrap-title .title h1 {font-size: 36px; font-size: 3.6rem;}
   .bx-wrapper .bx-controls-direction > a.bx-prev {margin-left: -384px;}
   .bx-wrapper .bx-controls-direction > a.bx-next {margin-right: -384px;}
   .wrap-tab-list .item > a {height: 200px;}
   .wrap-tab-list .item > a > img {width: auto; height: 100%;}
   
   .filter, .menu-list-news.press, .menu-list-news.topic {padding-right: 15px}
   
   /*index except (menu page)*/.except .img-links.hilight .item  a picture:after {border-top-width: 180px;}
   .except .img-links.hilight .item a picture + figcaption {min-height: 181px;}
   .except .img-links.hilight .item a picture + figcaption h3 {height: 141px; font-size: 25px; font-size: 2.5rem;}
   
   .except .img-links.topic .item a picture + figcaption h3 {font-size: 25px; font-size: 2.5rem;}
   
   .modal-menu .first-modal {height: 230px;}
   .modal-menu .first-modal > p {font-size: 16px;}
   .modal-menu .first-modal > .title {width: 65%;}
   .modal-menu .first-modal > .image {width: 30%;}
   .modal-menu .content-modal .content figcaption h2 {font-size: 19px; font-size: 1.9rem;}
   
   .wrap-manage .detail {font-size: 12px; height: 145px;}
   
   
}
@media (min-width: 768px) {
   .home-tabs > ul > li {width: 100%;}
}
@media (max-width: 991px) {
   .cell_01 .img {width: 100%; float: none;  text-align: center;}
   .cell_01 .des {float: none; text-align: center; width: 100%;}
   .cell_01 .des p {height: auto; display: block;}
}

/*col-md (Medium devices Desktops)*/
@media (min-width: 992px) and (max-width: 1199px) {
   .navbar-nav li.mega-dropdown > a, li.mega-dropdown.disable > a {padding-left: 34px; padding-right: 34px;}
   .bx-wrapper .bx-controls-direction > a.bx-prev {margin-left: -470px;}
   .bx-wrapper .bx-controls-direction > a.bx-next {margin-right: -470px;}
   .mainContent, .mainContent > .container {width: 940px;}
   
   /*index except (menu page)*/.except .img-links.hilight .item  a picture:after {border-top-width: 228px;}
   .except .img-links.hilight .item a picture + figcaption {min-height: 225px;}
   .except .img-links.hilight .item a picture + figcaption h3 {height: 185px;}
   
   .modal-menu .first-modal {height: 290px;}
   .modal-menu .first-modal .title {width: 65.4%;}
   .modal-menu .first-modal > p {bottom: 25px;}
   
   .wrap-manage .detail {height: 184px;}
}
/*col-lg (Large devices Desktops)*/
@media (min-width: 1200px) {
   .mainContent, .mainContent > .container,
   footer, footer > .container {width: 1030px;}
   .mainContent.search {width: 960px;}
}