@charset "utf-8";

/* CSS Document */
html {
  height: 100%;
}

body {
  padding: 0;
  margin: 0;
  font-family: Microsoft JhengHei, Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 28px;
  height: 100%;
}

h1,
h2,
h3 {
  margin: 0;
  padding: 0;
}

p,
ul,
li {
  margin: 0;
  padding: 0;
}

#id_wrapper {
  /* 設定高度最小為100%, 如果內容區塊很多, 可以長大 */
  min-height: 100%;
  /* 位置設為relative, 作為footer區塊位置的參考 */
  position: relative;
  text-align: center;
}

.NAV_btn_wrap {
  display: none;
  position: absolute;
  width: 60px;
  top: 30px;
  right: 20px;
  z-index: 4;
}


#header {
  width: 100%;
  float: left;
  text-align: center;
}

#headercontent {
  display: inline-block;
  width: 1080px;
}

#logo {
  float: left;
  margin-top: 15px;
  width: 140px;
}

#toplink {
  float: right;
  color: #777777;
  font-size: 15px;
  padding-top: 30px;
  text-align: right;
}

#toplink a {
  color: #777777;
  text-decoration: none;
  margin-right: 20px;
}

#toplink a:hover {
  text-decoration: underline;
}

#menubg {
  float: left;
  width: 100%;
  background-color: #c41f1a;
  text-align: center;
  height: 40px;
  position: relative;
}

#menu {
  display: inline-block;
  margin: 0;
  width: 1080px;
  line-height: 40px;
  position: relative;
}

#menu ul {
  margin: 0;
  padding: 0;
  float: left;
}

#menu li {
  float: left;
  color: #fff;
  list-style: none;
  font-size: 18px;
  line-height: 40px;
  font-weight: bold;
}

#menu li a {
  color: #fff;
  display: block;
  text-decoration: none;
  padding: 0 25px;
}

#menu li a:hover {
  background-color: #aa0500;
}

#menu li.red a {
  color: #fff;
  display: block;
  text-decoration: none;
  font-weight: bold;
  background-color: #aa0500;
  padding: 0 25px;
}

#menu li.red a:hover {
  color: #fff;
  background-color: #aa0500;
}


#menu ul {
  /* 取消ul預設的內縮及樣式 */
  margin: 0;
  padding: 0;
  list-style: none;
  float: left;
  width: 100%;
  line-height: 40px;
  color: #fff;
  font-weight: bold;
}

#menu ul.drop-down-menu {
  display: inline-block;
  font-size: 18px;
  line-height: 40px;
}

#menu ul.drop-down-menu li {
  position: relative;
  white-space: nowrap;
  color: #fff;
  list-style: none;
  font-size: 18px;
  line-height: 40px;
  display: block;
}

#menu ul.drop-down-menu>li:last-child {
  border-right: none;
}

#menu ul.drop-down-menu>li {
  float: left;
  /* 只有第一層是靠左對齊*/
}

#menu ul.drop-down-menu a {
  line-height: 40px;
  color: #fff;
  display: block;
  text-decoration: none;
  padding: 0 25x;

}

#menu ul.drop-down-menu a:hover {
  /* 滑鼠滑入按鈕變色*/
  color: #fff;
}

#menu ul.drop-down-menu li:hover>a {
  /* 滑鼠移入次選單上層按鈕保持變色*/
  color: #fff;
}

#menu ul.drop-down-menu ul {
  border: #d3807e 1px solid;
  position: absolute;
  z-index: 99;
  left: -1px;
  top: 100%;
  width: 150px;
  font-size: 16px;

}

#menu ul.drop-down-menu ul li {
  line-height: 40px;
  border-bottom: #d3807e 1px solid;
  font-size: 16px;
  width: 180px;
  background-color: #c41f1a;
}

#menu ul.drop-down-menu ul li a:hover {
  /* 滑鼠滑入按鈕變色*/
  color: #fff;
  border-bottom: none;
  background-color: #aa0500;
}

#menu ul.drop-down-menu ul li:last-child {
  border-bottom: none;
}

#menu ul.drop-down-menu ul ul {
  /*第三層以後的選單出現位置與第二層不同*/
  z-index: 999;
  top: 10px;
  left: 90%;
}

#menu ul.drop-down-menu ul {
  /*隱藏次選單*/
  display: none;

}

#menu ul.drop-down-menu li:hover>ul {
  /* 滑鼠滑入展開次選單*/
  display: block;

}




#menuright {
  position: absolute;
  z-index: 3;
  top: 0px;
  right: 0px;
}

#menuright .greenbtn {
  float: left;
  font-size: 18px;
  color: #fff;
  line-height: 40px;
  font-weight: bold;
  background-color: #1aa946;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 25px 0px 25px;
  text-decoration: none;
}

#menuright .greenbtn:hover {
  background-color: #008100;
}

#menuright .yellowbtn {
  float: left;
  font-size: 18px;
  line-height: 40px;
  font-weight: bold;
}

#menuright .yellowbtn a {
  color: #fff;
  display: block;
  text-decoration: none;
  padding: 0 25px;
  background-color: #febf00;
}

#menuright .yellowbtn a:hover {
  background-color: #e59c00;
}

#platformbg {
  float: left;
  width: 100%;
  line-height: 40px;
  border-bottom: #b2b2b2 1px solid;
  clear: both;
}

#platform {
  margin: 0 auto;
  width: 1080px;
}

#platform .title {
  font-size: 16px;
  float: left;
  padding-right: 15px;
  margin-right: 15px;
  border-right: #b2b2b2 1px solid;
}

#platform .box {
  float: left;
  margin-right: 5px;
  height: 40px;
  padding-right: 0;
  line-height: 40px;
}

#platform .box a {
  font-size: 12px;
  line-height: 40px;
  color: #1e5daa;
  font-weight: bold;
}

#platform .box img {
  float: left;
  margin-right: 5px;
  margin-top: 10px;
}

#platform .tatal {
  float: right;
}


#Breadcrumbs {
  font-size: 16px;
  clear: both;
  height: 60px;
  line-height: 60px;
  margin: 0 auto;
  width: 1080px;
  display: inline-block;
  text-align: left;
}

#Breadcrumbs a {
  font-size: 16px;
  text-decoration: none;
  color: #bcbcbc;
}

/*----------index--------------*/

.fix_img_style1 {
  float: left;
  width: 100%;
  height: 300px;
}


.fix_img_style2 {
  float: left;
  width: 100%;
  height: 210px;
  margin-bottom: 20px;
}


.fix_img_style3 {
  display: inline-block;
  vertical-align: top;
  width: 64px;
  height: 64px;
}

.fix_img_style4 {
  display: inline-block;
  width: 100%;
  height: 275px;
}

.fix_img_style5 {
  display: inline-block;
  width: 100%;
  height: 197px;
}


#indexcontent {
  margin: 0 auto;
  width: 1080px;
  clear: both;
  margin-bottom: 100px;
  text-align: left;
}

#indexleft {
  float: left;
  width: 720px;
  margin-right: 30px;
}

#indexleft .bigbox {
  width: 100%;
  margin-bottom: 20px;
  ;
  color: #000;
  border: #d5dde1 1px solid;
  padding-bottom: 15px;
  margin-bottom: 30px;
  float: left;
}

#indexleft .bigbox p {
  padding: 20px;
  line-height: 28px;
  clear: both;
}

#indexleft .bigbox a {
  font-size: 20px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

.blue30 {
  font-size: 30px;
  line-height: 50px;
  color: #00a4ea;
  font-weight: bold;
}

#indexleft .bigbox a:hover {
  text-decoration: underline;
}

.lable_y {
  background-color: #ecbd00;
  line-height: 22px;
  text-align: center;
  float: left;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  padding: 0 10px;
}

.lable_g {
  background-color: #20894f;
  line-height: 22px;
  text-align: center;
  float: left;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  padding: 0 10px;
}

.lable_r {
  background-color: #eb3e46;
  line-height: 22px;
  text-align: center;
  float: left;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  padding: 0 10px;
}

.lable_b3 {
  background-color: #2b5ed0;
  line-height: 22px;
  text-align: center;
  float: left;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  padding: 0 10px;
}




.date {
  font-size: 13px;
  float: right;
  margin-right: 20px;
  line-height: 20px;
  color: #a9a9a9;
}

.date2 {
  font-size: 13px;
  float: right;
  line-height: 20px;
  color: #a9a9a9;
}

.date3 {
  font-size: 13px;
  float: left;
  line-height: 30px;
  display: block;
  width: 100%;
  color: #a9a9a9;
}

#indexleft .smallbox {
  width: 48%;
  margin-bottom: 20px;
  ;
  color: #000;
  border: #d5dde1 1px solid;
  padding-bottom: 15px;
  margin-bottom: 30px;
  float: left;
}

#indexleft .smallbox p {
  padding: 20px;
  line-height: 28px;
  clear: both;
}

#indexleft .smallbox a {
  font-size: 20px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

#indexleft .smallbox a:hover {
  text-decoration: underline;
}

#index_report {
  width: 100%;
  clear: both;
}

#index_report h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

#index_report .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 100%;
}

#index_report .box {
  width: 48%;
  color: #000;
  height: 380px;
  padding-bottom: 15px;
  margin-bottom: 15px;
  float: left;
}

#index_report .box .picbg {
  width: 340px;
  height: 210px;
  z-index: -1px;
  display: block;
}

#index_report .box p {
  padding: 10px 0 0 0;
  line-height: 28px;
  clear: both;
  font-size: 16px;
}

#index_report .box .title2 a {
  font-size: 20px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  margin-top: 15px;
  width: 100%;
}

#index_report .box .title2 a:hover {
  text-decoration: underline;
}

/*#index_report .box img{ }*/
#index_report .box .fix_img_style2 {
  border: #d5dde1 1px solid;
  margin-bottom: 10px;
}

.lable_b {
  background-color: #0377b7;
  line-height: 22px;
  text-align: center;
  float: left;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  padding: 0 20px;
  z-index: 999px;
  margin-top: 170px;
}

#index_report .box .more {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
}

#index_report .box a.more {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
  font-weight: bold;
}

#index_report .box a.more:hover {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: underline;
}



/*----------右--------------*/
#indexright {
  float: right;
  width: 320px;
}

#indexright .appbox {
  width: 100%;
  margin-bottom: 48px;
  margin-top: 30px;
}

#indexright .appbox img {
  margin-right: 10px;
  float: left;
  vertical-align: middle;
}

#indexright .appbox a {
  text-decoration: none;
  color: #000;
  line-height: 48px;
}

#indexright .appbox a:hover {
  text-decoration: underline;
  color: #000;
}

/*#indexright .appbox .bigbtn{ margin: 20px auto 0 auto; width: 200px; height: 60px; clear: both;}
#indexright .appbox .bigbtn img{ width: 100% !important; height: auto;}*/



#indexright .appbox .bigbtn {
  float: left;
  width: 165px;
  height: 48px;
  clear: both;
  margin-top: 45px;
}

#indexright .appbox .qrcode {
  float: right;
  width: 140px;
  height: 140px;
}



.banner_right {
  width: 100%;
  margin-bottom: 15px;
}

.banner_right img {
  width: 100%;
}

#indexright .latest {
  margin-bottom: 15px;
  width: 100%;
}

#indexright .latest h2 {
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
}

#indexright .latest .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 90px;
}

#indexright .latest .box {
  line-height: 22px;
  font-size: 16px;
  padding-top: 13px;
  width: 100%;
  margin-bottom: 20px;
}

#indexright .latest .box a {
  line-height: 22px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}

#indexright .latest .box a:hover {
  text-decoration: underline;
}


#indexright .second {
  margin-bottom: 5px;
}

#indexright .second h2 {
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
}

#indexright .second .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 90px;
}

#indexright .second .box .lable_y,
#indexright .second .box .lable_g,
#indexright .second .box .lable_r,
#indexright .second .box .lable_b3 {
  position: absolute;
  bottom: 0px;
  left: 70px;
  display: inline-block;
  white-space: nowrap;
}

#indexright .second .box .date2 {
  position: absolute;
  bottom: 0px;
  right: 0px;
  display: inline-block;
  white-space: nowrap;
}

#indexright .second .box {
  display: inline-block;
  width: 100%;
  line-height: 1.2;
  font-size: 16px;
  padding-top: 13px;
  color: #000;
  text-decoration: none;
  margin-bottom: 10px;
  position: relative;
}

#indexright .second .box a {
  line-height: 22px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: inline-block;
}

#indexright .second .box a span {
  width: 240px;
  line-height: 1.2;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: inline-block;
  vertical-align: top;
}

#indexright .second .box a:hover {
  text-decoration: underline;
}

#indexright select {
  /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
  border: solid 1px #ccc;
  height: 30px;
  width: 288px;
  padding-left: 10px;
  font-size: 16px;
  margin: 0 auto;
  display: block;
  margin-top: 24px;

  /*很关键：将默认的select选择框样式清除*/
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;

  /*在选择框的最右侧中间显示小箭头图片*/
  background: url("images/arrow.png") no-repeat scroll right center transparent;


  /*为下拉小箭头留出一点位置，避免被文字覆盖*/
  padding-right: 14px;
}


/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand {
  display: none;
}

#indexright .third {
  margin-bottom: 15px;
}

#indexright .third h2 {
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

#indexright .third .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 110px;
}

#indexright .third .box {
  height: 80px;
  line-height: 80px;
  font-size: 18px;
  color: #000;
  padding: 0 20px 0 30px;
  background-color: #eeeeee;
  border: #bdbdbd 1px solid;
  text-decoration: none;
  font-weight: bold;
  margin-bottom: 10px;
}

#indexright .third .box img {
  float: right;
  margin-top: 16px;
}

#indexright .third .box a {
  text-decoration: none;
  line-height: 80px;
  font-size: 18px;
  color: #000;
  float: left;
}

#indexright .third .box a:hover {
  text-decoration: none;
  color: #fff;
}

#indexright .third .box:hover {
  background-color: #cbcbcb;
}


/*----------public--------------*/
#indexleft .bigbox2 {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 20px;
  color: #000;
  border: #d5dde1 1px solid;
  height: auto;
  padding-bottom: 15px;
  margin-bottom: 30px;
  float: left;
}

#indexleft .bigbox2 p {
  padding: 20px;
  line-height: 28px;
  clear: both;
}

#indexleft .bigbox2 a {
  font-size: 30px;
  line-height: 40px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

#indexleft .bigbox2 a:hover {
  text-decoration: underline;
}

.lable_b2 {
  background-color: #0ab2c6;
  line-height: 22px;
  text-align: center;
  float: left;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  padding: 0 20px;
  height: 22px;
}

#indexleft .bigbox2 ul {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  list-style-type: none;
  width: 100%;
  margin: 0 auto;
  clear: both;
  float: left;
  padding: 20px;
}

#indexleft .bigbox2 li.h {
  list-style-type: none;
  height: auto;
  width: 100%;
  border-top: none;
}

#indexleft .bigbox2 li {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 12px 0px 5px 0px;
  list-style-type: none;
  height: auto;
  width: 100%;
  border-top: #e6e6e6 1px solid;
  float: left;
}

#indexleft .bigbox2 li a {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4;
  text-decoration: none;
  list-style-type: none;
  height: auto;
  float: left;
}

#indexleft .bigbox2 .date {
  float: right;
  margin-right: 0;
  margin-top: 12px;
  color: #a9a9a9;
}



#indexright .smallbox2 {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 20px;
  color: #000;
  border: #d5dde1 1px solid;
  height: auto;
  padding-bottom: 10px;
  margin-bottom: 30px;
  float: left;
}

#indexright .smallbox2 p {
  padding: 16px;
  line-height: 28px;
  clear: both;
}

#indexright .smallbox2 a {
  font-size: 18px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

#indexright .smallbox2 a:hover {
  text-decoration: underline;
}

#publicbottom {
  margin: 0 auto;
  width: 1080px;
  clear: both;
  margin-bottom: 20px;
}

#publicbottom .smallbox {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 30%;
  color: #000;
  padding-bottom: 15px;
  margin-bottom: 30px;
  margin-right: 5%;
  float: left;
  border: 0;
  text-align: left;
}

#publicbottom .smallbox:nth-child(3n) {
  margin-right: 0%;
}

#publicbottom .smallbox p {
  padding: 10px 0 0 0;
  line-height: 1.4;
  clear: both;
  font-size: 16px;
}

#publicbottom .smallbox img {
  margin-bottom: 0px;
  width: 100%;
  height: auto;
}

#publicbottom .smallbox .title2 a {
  font-size: 20px;
  line-height: 1.4;
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

#publicbottom .smallbox .title2 a:hover {
  text-decoration: underline;
}

#publicbottom .smallbox ul {
  list-style-type: none;
  margin-top: 10px;
  display: block;
  clear: both;
}

#publicbottom .smallbox li {
  display: inline-block;
  width: 100%;
  list-style-type: none;
  border-top: #e6e6e6 1px solid;
  position: relative;
}

#publicbottom .smallbox li.h {
  list-style-type: none;
  border-top: #e6e6e6 1px solid;
  position: relative;
  border-top: none;
}

#publicbottom .smallbox li a {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
  text-decoration: none;
  list-style-type: none;
  padding: 6px 0;
  display: block;
  color: #000;
}

#publicbottom .smallbox li.h a {
  font-size: 20px;
  font-weight: bold;
  line-height: 28px;
  text-decoration: none;
  list-style-type: none;
  padding: 6px 0;
  display: block;
  color: #000;
  padding: 10px 0;
}

#publicbottom .smallbox li a:hover {
  text-decoration: underline;
}

#publicbottom .smallbox li .date {
  width: 100%;
  font-size: 13px;
  float: left;
  line-height: 20px;
  color: #a9a9a9;
  margin-right: 0;
  position: relative;
  text-align: right;
}

#publicbottom .smallbox li.h .date {
  width: 100%;
  font-size: 13px;
  float: left;
  line-height: 20px;
  color: #a9a9a9;
  margin-right: 0;
  position: relative;
  text-align: right;
}


/*----------public內頁--------------*/

.time {
  font-size: 14px;
  line-height: 40px;
  color: #a9a9a9;
  clear: both;
  padding: 10px;
}

.like {
  height: 20px;
  padding: 20px 0;
}

.top {
  font-size: 16px;
  line-height: 26px;
  color: #6080a7;
  margin-bottom: 20px;
  letter-spacing: 1.5px;
}

#publiccontent {
  font-size: 16px;
  line-height: 26px;
  float: left;
  width: 720px;
  margin-right: 30px;
}

#publiccontent h1 {
  font-size: 32px;
  font-weight: bold;
  line-height: 40px;
}

#publiccontent h4 {
  font-size: 22px;
  font-weight: bold;
  line-height: 60px;
  margin: 0;
}

#publiccontent p {
  margin-bottom: 20px;
  letter-spacing: 1.5px;
}

#publiccontent img {
  margin: 15px 0;
  width: 700px;
  max-width: 100%;
  height: auto;
  border: #ccc 1px solid;
}




#keyword {
  width: 660px;
  padding: 30px;
  background-color: #f5f5f5;
  margin-top: 50px;
}

#keyword a {
  color: #e32c2b;
  text-decoration: none;
}

#keyword a:hover {
  text-decoration: underline;
}

#keyword .line {
  clear: both;
  border-bottom: 1px #d7d7d7 solid;
  height: 1px;
  margin: 20px 0;
}

#keyword .downleft {
  width: 660px;
  float: left;
  color: #30373e;
  font-size: 18px;
  margin-bottom: 40px;
}

#keyword .downleft p {
  float: right;
  width: 320px;
}

#keyword .downleft a {
  color: #30373e;
}

#keyword .downleft a:hover {
  text-decoration: underline;
  font-weight: bold;
}

#keyword .downleft .leftgray {
  color: #a2a2a2;
  margin-left: 10px;
}

#keyword .downleft .leftgray a {
  color: #a2a2a2;
  text-decoration: none;
}

#keyword .downleft .leftgray a:hover {
  text-decoration: underline;
  font-weight: bold;
}


#keyword .downright {
  width: 660px;
  float: right;
  color: #30373e;
  font-size: 18px;
  text-align: right;
}

#keyword .downright p {
  width: 320px;
}

#keyword .downright a {
  color: #30373e;
}

#keyword .downright a:hover {
  text-decoration: underline;
  font-weight: bold;
}

#keyword .downright .leftgray {
  color: #a2a2a2;
  margin-right: 10px;
}

#keyword .downright .leftgray a {
  color: #a2a2a2;
  text-decoration: none;
}

#keyword .downright .leftgray a:hover {
  text-decoration: underline;
  font-weight: bold;
}





/*----------specialty--------------*/
#specialty_top {
  width: 100%;
  margin: 0 auto;
  text-align: center;
  font-size: 20px;
  line-height: 30px;
  padding-top: 20px;
  padding-bottom: 50px;
}

#specialty_top h1 {
  line-height: 50px;
  font-size: 30px;
  font-weight: bold;
}

#specialty_title {
  height: 30px;
  background: url('images/grayline.png') repeat-x;
  clear: both;
  margin: 20px 0;
}

#specialty_title h2 {
  line-height: 30px;
  font-size: 24px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 140px;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
}

#specialty_title2 {
  height: 30px;
  background: url('images/greenline.png') repeat-x;
  clear: both;
  margin: 20px 0;
}

#specialty_title2 h2 {
  line-height: 30px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 320px;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
}

#specialty_leftbox {
  width: 525px;
  float: left;
  margin-bottom: 40px;
}

#specialty_leftbox img {
  width: 525px;
  height: auto;
}

#specialty_leftbox a {
  font-size: 18px;
  font-weight: bold;
  color: #000;
  text-decoration: none;
  line-height: 30px;
  text-align: left;
}

#specialty_leftbox a:hover {
  text-decoration: underline;
}

#specialty_right {
  width: 525px;
  float: right;
}

.specialty_rightbox {
  width: 250px;
  float: left;
  margin-bottom: 20px;
  margin-right: 25px;
}

.specialty_rightbox img {
  width: 250px;
  height: auto;
}

.specialty_rightbox a {
  font-size: 18px;
  font-weight: bold;
  color: #000;
  text-decoration: none;
  line-height: 30px;
  text-align: left;
}

.specialty_rightbox a:hover {
  text-decoration: underline;
}

#specialty_bottom {
  width: 100%;
  clear: both;
}

#specialty_bottom h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

#specialty_bottom .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 90px;
  float: left;
}

.gray {
  font-size: 20px;
  font-weight: bold;
  line-height: 36px;
  color: #a5a5a5;
}

#specialty_bottom .box {
  width: 525px;
  float: left;
  margin-right: 30px;
  font-weight: bold;
  margin-bottom: 30px;
}

#specialty_bottom .box img {
  margin-right: 10px;
  float: left;
  width: 153px;
  height: 120px;
}

#specialty_bottom .box .right {
  width: 350px;
  float: right;
  font-size: 15px;
  line-height: 20px;
  color: #a9a9a9;
}

#specialty_bottom .box .right h3 {
  font-size: 18px;
  line-height: 26px;
  font-weight: bold;
  color: #000;
  margin-bottom: 30px;
}

#specialty_bottom .box .right h3 a {
  font-size: 18px;
  font-weight: bold;
  color: #000;
  text-decoration: none;
  line-height: 24px;
  display: block;
}

#specialty_bottom .box .right h3:hover {
  text-decoration: underline;
}

#specialty_bottom .box .interval {
  width: 350px;
  margin-top: 0px;
  clear: both;
  font-size: 15px;
  line-height: 20px;
  color: #a9a9a9;
  float: right;
}

#specialty_bottom .more {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
  float: right;
}

#specialty_bottom a.more {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
  font-weight: bold;
}

#specialty_bottom a.more:hover {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: underline;
}


#specialty_topbox {
  width: 100%;
  margin: 0 auto 30px auto;
}

#specialty_topbox img {
  margin: 0 20px 20px 0;
  max-width: 100%;
  height: auto;
}

/*----------專長內頁--------------*/
#specialtycontent {
  float: left;
  width: 720px;
  margin-right: 30px;
}

#specialtycontent ul {
  background-color: #eeeeee;
  padding: 30px;
  margin-bottom: 30px;
}

#specialtycontent li {
  list-style-type: none;
  line-height: 40px;
  font-size: 20px;
  font-weight: bold;
}

#specialtycontent li a {
  color: #164e93;
  font-size: 20px;
  font-weight: normal;
}

#specialtycontent h1 {
  font-size: 30px;
  font-weight: bold;
  line-height: 60px;
  margin-bottom: 30px;
}

#specialtycontent {
  font-size: 16px;
  line-height: 24px;
}

#specialtycontent h2 {
  font-size: 22px;
  color: #164e93;
  font-weight: bold;
  line-height: 30px;
  margin: 40px 0 10px 0;
}

#specialtycontent h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
}

#specialtycontent h5 {
  font-size: 22px;
  font-weight: bold;
  line-height: 30px;
  margin: 40px 0 10px 0;
}

#specialtycontent p {
  margin-bottom: 15px;
}

#specialtycontent img {
  margin: 15px 0;
  width: 700px;
  max-width: 100%;
  height: auto;
  border: #ccc 1px solid;
}


#ninereport {
  width: 720px;
  display: block;
  margin: 20px 0;
  clear: both;
}

#ninereport h4 {
  font-size: 18px;
  font-weight: bold;
  padding: 0;
  margin-bottom: 10px;
}

#ninereport .box {
  width: 100%;
  clear: both;
  margin-bottom: 30px;
  clear: both;
}

#ninereport .box .header {
  width: 100%;
  background-color: #5e6b6e;
  line-height: 40px;
  color: #fff;
  height: 40px;
}

#ninereport .box .header .title {
  width: 100%;
  float: left;
  padding-left: 10px;
}

#ninereport .box .header .area {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  float: right;
  padding-right: 10px;
  text-align: right;
}

#ninereport .box img {
  width: 718px;
  max-width: 100%;
  height: auto;
  margin: 0;
  display: block;
}

#ninereport .box .find {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  background-color: #5e6b6e;
  line-height: 26px;
  color: #fff;
  text-align: left;
  padding: 10px 10px;
}





/*----------provide--------------*/

.providebox {
  width: 340px;
  margin-right: 30px;
  float: left;
}

.providebox .box {
  width: 340px;
  color: #000;
  border: #d5dde1 1px solid;
  height: 290px;
  margin-bottom: 10px;
  float: left;
}

.providebox .box img {
  width: 340px;
  height: 200px;
}

.providebox .box p {
  line-height: 22px;
  clear: both;
  text-align: center;
  color: #8b8b8b;
}

.providebox .box a {
  font-size: 20px;
  line-height: 32px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  display: block;
}

.providebox .box a:hover {
  text-decoration: underline;
}

.providebox h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

.providebox .title {
  line-height: 40px;
  border-bottom: #154df3 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 185px;
  float: left;
}

.providebox .box2 {
  width: 316px;
  color: #000;
  border: #d5dde1 1px solid;
  height: 60px;
  margin-bottom: 15px;
  float: left;
  padding-left: 24px;
  background-color: #f2f2f2;
  line-height: 60px;
}

.providebox .box2:hover {
  background-color: #cbcbcb;
}

.providebox .box2 a {
  font-size: 18px;
  line-height: 60px;
  color: #000;
  text-decoration: none;
}

.providebox .box2 a:hover {
  text-decoration: underline;
}

.providebox .more {
  color: #1e5daa;
  font-size: 14px;
  float: right;
}

.providebox .more a {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
}

.providebox .more a:hover {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: underline;
}

.providebox .box3 {
  height: 64px;
  line-height: 22px;
  font-size: 16px;
  padding: 10px 0;
  clear: both;
  border-bottom: #d5dde1 1px solid;
}

.providebox .box3 img {
  float: left;
  margin-right: 10px;
  width: 64px;
  height: 64px;
}

.providebox .box3 a {
  line-height: 60px;
  font-size: 18px;
  color: #000;
  text-decoration: none;
  display: block;
}

.providebox .box3 a:hover {
  text-decoration: underline;
}

#indexleft .bigbox3 {
  width: 100%;
  margin-bottom: 20px;
  ;
  color: #000;
  padding-bottom: 15px;
  margin-bottom: 30px;
  float: left;
}

#indexleft .bigbox3 p {
  padding: 10px 0 0 0;
  line-height: 28px;
  clear: both;
  width: 100%;
}

#indexleft .bigbox3 img {
  width: 100%;
  height: auto;
}

#indexleft .bigbox3 a {
  font-size: 30px;
  line-height: 40px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  margin-bottom: 0px;
}

#indexleft .bigbox3 a:hover {
  text-decoration: underline;
}

#indexleft .bigbox3 ul {
  list-style-type: none;
  width: 100%;
  margin: 20px auto 0 auto;
}

#indexleft .bigbox3 li {
  list-style-type: none;
  height: auto;
  width: 100%;
  border-top: #e6e6e6 1px solid;
}

#indexleft .bigbox3 li a {
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px 0px 5px 0px;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4;
  text-decoration: none;
  list-style-type: none;
  height: auto;
  width: 100%;
}

#provideright h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

#provideright .title {
  line-height: 40px;
  border-bottom: #73a4e0 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 260px;
  float: left;
}

#provideright .leftbox {
  width: 147px;
  margin: 10px;
  float: left;
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-align: center;
}

#provideright .leftbox img {
  width: 147px;
  height: auto;
}

#provideright .rightbox {
  width: 147px;
  margin: 10px 0 10px 0;
  float: left;
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-align: center;
}

#provideright .leftbox a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}

#provideright .leftbox a:hover {
  text-decoration: underline;
}

#providerbottom {
  width: 100%;
  clear: both;
}

#providerbottom_title2 {
  height: 30px;
  background: url('images/blueline.png') repeat-x;
  clear: both;
  margin: 20px 0;
}

#providerbottom_title2 h2 {
  line-height: 30px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 280px;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
}

#providerbottom .box {
  width: 30%;
  float: left;
  margin-right: 5%;
  margin-bottom: 28px;
  height: auto;
}

#providerbottom .box:nth-child(3n) {
  margin-right: 0%;
}

#providerbottom .box img {
  margin-bottom: 10px;
  width: 100%;
  height: auto;
  border: #EFEFEF 1px solid;
}

#providerbottom .rightbox {
  width: 249px;
  float: left;
  margin-right: 0;
  margin-bottom: 28px;
  height: 200px;
}

#providerbottom .rightbox img {
  margin-bottom: 10px;
  border: #EFEFEF 1px solid;
}

#providerbottom .box a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}

#providerbottom .rightbox a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}

/*----------報告內頁右邊--------------*/
.reportright {
  width: 320px;
  margin-right: 0;
  float: right;
}

.reportright h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 30px;
}

.reportright .title {
  line-height: 40px;
  border-bottom: #154df3 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 200px;
  float: left;
}

.reportright .box {
  height: 60px;
  line-height: 22px;
  font-size: 16px;
  padding: 8px 0;
  clear: both;
  border-bottom: #d5dde1 1px solid;
}

.reportright .box img {
  float: left;
  margin-right: 10px;
  width: 60px;
  height: 60px;
  border: #EFEFEF 1px solid;
}

.reportright .box a {
  line-height: 60px;
  font-size: 18px;
  color: #000;
  text-decoration: none;
  display: block;
}

.reportright .box a:hover {
  text-decoration: underline;
}

.reportright .more {
  color: #1e5daa;
  font-size: 14px;
  float: right;
}

.reportright .more a {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
}

.reportright .more a:hover {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: underline;
}




/*----------報告內頁加一塊--------------*/
#report_topgray {
  display: inline-block;
  width: 100%;
  height: 130px;
  margin-bottom: 20px;
  background: #f2f2f2 url('images/report_topgray.png') top left no-repeat;
  background-size: 86px 130px;
}

#report_topgray h5 {
  line-height: 36px;
  font-size: 26px;
  width: 85%;
  float: right;
  padding: 5px 0px;
  text-align: left;
  margin: 20px 0 0 0;
}

#report_topgray_left {
  width: 86px;
  height: 130px;
  font-size: 22px;
  color: #fff;
  line-height: 30px;
  padding: 15px 0px 0px 10px;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-writing-mode: vertical-lr;
  writing-mode: vertical-lr;
  letter-spacing: 5px;
}

#report_topgray p {
  width: 85%;
  float: right;
  line-height: 24px;
  text-align: left;
  padding: 0;
}




/*----------服務右邊--------------*/
.serviceright {
  width: 320px;
  margin-right: 0;
  float: right;
}

.serviceright h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 30px;
}

.serviceright .title {
  line-height: 40px;
  border-bottom: #154df3 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 130px;
  float: left;
}

.serviceright .box {
  height: 60px;
  line-height: 22px;
  font-size: 16px;
  padding: 8px 0;
  clear: both;
  border-bottom: #d5dde1 1px solid;
}

.serviceright .box img {
  float: left;
  margin-right: 10px;
  width: 60px;
  height: 60px;
  border: #EFEFEF 1px solid;
}

.serviceright .box a {
  line-height: 24px;
  font-size: 18px;
  color: #000;
  text-decoration: none;
  display: block;
}

.serviceright .box a:hover {
  text-decoration: underline;
}

.serviceright .more {
  color: #1e5daa;
  font-size: 14px;
  float: right;
}

.serviceright .more a {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: none;
}

.serviceright .more a:hover {
  color: #1e5daa;
  font-size: 14px;
  text-decoration: underline;
}


.serviceright .box2 {
  width: 294px;
  color: #000;
  border: #d5dde1 1px solid;
  height: 60px;
  margin-bottom: 15px;
  float: left;
  padding-left: 24px;
  background-color: #f2f2f2;
  line-height: 60px;
}

.serviceright .box2:hover {
  background-color: #cbcbcb;
}

.serviceright .box2 a {
  font-size: 18px;
  line-height: 60px;
  color: #000;
  text-decoration: none;
}

.serviceright .box2 a:hover {
  text-decoration: underline;
}



/*----------服務內頁--------------*/

#service #topbox {
  width: 100%;
  margin-bottom: 40px;
  margin-top: 30px;
}

#service #topbox img {
  width: 340px;
  max-width: 100%;
  height: auto;
  float: left;
  margin-right: 28px;
  border: #EFEFEF 1px solid;
  vertical-align: top;
  margin-top: 0;
}

#service h1 {
  line-height: 40px;
  font-size: 32px;
  font-weight: bold;
  width: 100%;
  margin-bottom: 10px;
  margin-top: 6px;
}

#service #topbox h3 {
  float: right;
  line-height: 1.4;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
  margin-top: 0px;
  width: 350px;
  white-space: nowrap;
}

#service #topbox p {
  float: right;
  width: 350px;
  margin-bottom: 10px;
  line-height: 1.4;
  text-align: left;
}




#servicebottom {
  width: 720;
  clear: both;
}

#servicebottom_title2 {
  height: 30px;
  background: url('images/blueline.png') repeat-x;
  clear: both;
  margin: 20px 0;
}

#servicebottom_title2 h2 {
  line-height: 30px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 160px;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
}

#servicebottom .box {
  width: 29%;
  float: left;
  margin-right: 5%;
  margin-bottom: 20px;
  text-align: center;
}

#servicebottom .box:nth-child(3n) {
  margin-right: 0%;
}

#servicebottom .box img {
  margin-bottom: 5px;
  width: 100%;
  height: auto;
  border: #EFEFEF 1px solid;
  margin-top: 0;
}

#servicebottom .box a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}

#servicebottom .rightbox {
  width: 230px;
  float: left;
  margin-bottom: 20px;
  text-align: center;
}

#servicebottom .rightbox img {
  margin-bottom: 5px;
  width: 230px;
  height: auto;
  border: #EFEFEF 1px solid;
  margin-top: 0;
}

#servicebottom .rightbox a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}



/*----------產品右邊--------------*/

.productbox {
  width: 320px;
  float: right;
}

.productbox h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

.productbox .title {
  line-height: 40px;
  border-bottom: #154df3 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 185px;
  float: left;
}

.productbox .box2 {
  width: 294px;
  color: #000;
  border: #d5dde1 1px solid;
  height: 60px;
  margin-bottom: 15px;
  float: left;
  padding-left: 24px;
  background-color: #f2f2f2;
  line-height: 60px;
}

.productbox .box2 a {
  font-size: 18px;
  line-height: 60px;
  color: #000;
  text-decoration: none;
}

.productbox .box2 a:hover {
  text-decoration: underline;
}

#publiccontent h5 {
  font-weight: bold;
  font-size: 18px;
  line-height: 30px;
  padding: 0;
  margin: 0;
}

#publiccontent .white {
  color: #fff;
}

#publiccontent .blackbig {
  font-weight: bold;
  font-size: 18px;
}

/*----------app--------------*/
.appbox2 {
  width: 720px;
  text-align: center;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: #EEEEEE 1px solid;
}

.appbox2 h2 {
  color: #c00001;
  font-weight: bold;
  font-size: 24px;
  line-height: 50px;
}

.appbox2 p {
  font-size: 18px;
  line-height: 30px;
  width: 420px;
  margin: 0 auto 30px auto;
}

.appbox2 img {
  width: 281px;
  height: auto;
  margin: 0 auto;
}

/*----------election--------------*/

.electionbox {
  width: 30%;
  color: #000;
  border: #d5dde1 1px solid;
  height: auto;
  margin-bottom: 50px;
  float: left;
  margin-right: 4%;
}

.electionbox:last-child {
  margin-right: 0%;
}

.electionbox img {
  width: 100%;
  height: auto;
}

.electionbox a {
  font-size: 20px;
  line-height: 50px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  display: block;
  text-align: center;
}

.electionbox a:hover {
  text-decoration: underline;
}

/*----------case--------------*/


#case {
  width: 720px;
  float: left;
  line-height: 30px;
}

#case .box {
  width: 30%;
  margin: 0px 5% 50px 0px;
  height: auto;
  position: relative;
  background-color: #D8D8D8;
  float: left;
}

#case .box .picbg {
  float: left;
  width: 100%;
  height: auto;
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
}

#case .box .picbg img {
  width: 100% !important;
  height: auto !important;
  margin: 0;
  float: left;
}

#case .box .top {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  text-align: left;
  color: #fff;
  background-image: url('images/casebg.png');
  background-size: cover;
  padding: 10px 10px;
  font-size: 18px;
  font-weight: bold;
  z-index: 2;
}

#case .box .top .downtxt {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: bottom;
  width: 100%;
  height: 40px;
  position: absolute;
  bottom: 0;
  display: block;
  z-index: 3;
}

#case .box .date {
  font-size: 13px;
  float: left;
  line-height: 30px;
  display: block;
  z-index: 4;
  position: absolute;
  top: 180px;
  color: #000;
}

#case #topbox {
  width: 720px;
  margin-bottom: 20px;
}

#case #topbox img {
  width: 300px;
  height: auto;
  float: left;
  margin-right: 28px;
  border: #EFEFEF 1px solid;
  vertical-align: top;
  margin-top: 0;
}

#case #topbox h1 {
  line-height: 40px;
  font-size: 30px;
  font-weight: bold;
  width: 390px;
  float: right;
  margin-bottom: 10px;
}

#case #topbox h2 {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 36px;
  font-size: 24px;
  background-color: #E7E7E7;
  width: 390px;
  float: left;
  font-weight: bold;
  margin-bottom: 10px;
  padding: 5px 10px;
  text-align: left;
}

#case #topbox p {
  width: 390px;
  float: right;
  margin-bottom: 10px;
  line-height: 24px;
}

#case #topbox .price {
  color: #ff8c00;
  width: 390px;
  float: right;
  font-weight: bold;
}

#case .description {
  width: 696px;
  height: 45px;
  line-height: 50px;
  padding-left: 24px;
  background-color: #f4f5f5;
  border-bottom: #c41f1a 4px solid;
  border-top: #d5dde1 1px solid;
  border-left: #d5dde1 1px solid;
  border-right: #d5dde1 1px solid;
  clear: both;
  margin-bottom: 10px;
  font-size: 20px;
}

#case .unit {
  border: #d5dde1 1px solid;
  padding: 24px 24px 24px 24px;
  width: 672px;
  clear: both;
  background-color: #f4f5f5;
  margin-bottom: 30px;
}

#case .unit h2 {
  line-height: 50px;
  font-size: 20px;
  font-weight: normal;
  border-bottom: #d5dde1 1px solid;
  color: #c41f1a;
  margin-bottom: 30px;
  margin-top: 0;
}

#case .unit h3 {
  line-height: 30px;
  font-size: 18px;
  font-weight: bold;
  color: #c41f1a;
}

#case .product {
  border: #d5dde1 1px solid;
  padding: 10px 24px 24px 24px;
  width: 672px;
  clear: both;
  background-color: #f4f5f5;
  margin-bottom: 30px;
  height: 420px;
}

#case .product h2 {
  line-height: 50px;
  font-size: 20px;
  font-weight: normal;
  border-bottom: #d5dde1 1px solid;
  color: #c41f1a;
  margin-bottom: 20px;
}

#case .product .box {
  margin-right: 20px;
  width: 210px;
  float: left;
  font-size: 16px;
  line-height: 24px;
  background-color: #f4f5f5;
}

#case .product .box img {
  width: 210px;
  height: auto;
}

#case .product .box .title {
  font-size: 18px;
  line-height: 30px;
  font-weight: bold;
}

#case .product .box a.buy {
  width: 100px;
  line-height: 32px;
  height: 32px;
  background-color: #333;
  color: #fff;
  display: block;
  padding: 0 10px;
  text-decoration: none;
  font-size: 15px;
  width: 115px;
  margin-top: 20px;
}

#case .product .box .buy img {
  width: 16px;
  height: 16px;
  margin-left: 5px;
  vertical-align: middle;
}

#case #menu {
  width: 720px;
  height: 40px;
  position: relative !important;
  text-align: left;
}

#case #menu a {
  height: 40px;
  line-height: 40px;
  background-color: #ccc;
  padding: 0 20px;
  font-size: 18px;
  font-weight: bold;
  margin-right: 8px;
  float: left;
  color: #000;
  text-decoration: none;
}

#case #menu a:hover {
  color: #fff;
  background-color: #c41f1a;
}

#case #menu a.red {
  background-color: #c41f1a;
  color: #fff;
}

#case .research {
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: #d5dde1 1px solid;
  padding: 20px 24px 24px 24px;
  width: 100%;
  clear: both;
  background-color: #f4f5f5;
  margin-bottom: 10px;
}

#case .research h2 {
  line-height: 50px;
  font-size: 20px;
  font-weight: normal;
  border-bottom: #d5dde1 1px solid;
  color: #c41f1a;
  margin-bottom: 20px;
}

#case .research h3 {
  line-height: 30px;
  font-size: 18px;
  font-weight: bold;
  color: #c41f1a;
  margin-bottom: 10px;
}

#case .research ul {}

#case .research li {
  line-height: 34px;
  font-size: 18px;
  font-weight: bold;
  color: #c41f1a;
  list-style-type: none;
}

#case .research li.s {
  line-height: 30px;
  font-size: 16px;
  padding-left: 93px;
  font-weight: normal;
  color: #000;
}

#case .research li.first {
  line-height: 30px;
  font-size: 16px;
  font-weight: normal;
  color: #000;
}

#case .research .red {
  color: #c41f1a;
}

#case .research img {
  width: 670px;
  max-width: 100%;
  height: auto;
  margin-top: 15px;
}

#case .research a {
  color: #000000;
  text-decoration: underline;
}


/*----------contact--------------*/
#contact {
  width: 800px;
  margin: 0 auto;
  font-size: 18px;
  line-height: 32px;
  display: inline-block;
  margin-left: 112px;
}

.contact_table {
  float: left;
  width: 100%;
}

.contact_table tbody {
  width: 100%;
}



#contact input {
  font-size: 16px;
  line-height: 24px;
  padding: 5px;
  font-family: "Helvetica", "Arial", "LiHei Pro", "黑體-繁", "微軟正黑體", sans-serif;
  color: #000000;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  margin-right: 5px;
}

.contact_table label {
  float: left;
  margin-top: 10px;
}

.contact_table td {
  padding-bottom: 20px;
}

.single_form {
  font-size: 16px;
  line-height: 24px;
  padding: 5px;
  font-family: "Helvetica", "Arial", "LiHei Pro", "黑體-繁", "微軟正黑體", sans-serif;
  color: #eee;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  width: 90%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.contact_table2 {
  float: left;
  width: 100%;
}

.contact_table2 td {
  width: 20%;
  font-size: 18px;
  line-height: 1.2;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px;
}

#contact .black {
  font-weight: bold;
}

#contact h2 {
  background-color: #E1E1E1;
  line-height: 40px;
  font-size: 18px;
  text-align: center;
  margin-bottom: 10px;
}

#contact .sendbtn {
  background-color: #000;
  line-height: 40px;
  font-size: 18px;
  text-align: center;
  padding: 0 30px;
}

#contact a.sendbtn {
  background-color: #000;
  line-height: 40px;
  font-size: 18px;
  text-align: center;
  padding: 0 30px;
  color: #fff;
  text-decoration: none;
  display: block;
  height: 40px;
  width: 200px;
  margin: 0 auto;
}

/*----------about--------------*/
#brand {
  width: 680px;
  padding: 20px;
}

#brand .brandbox {
  width: 280px;
  margin: 0 80px 80px 0;
  ;
  float: left;
  text-align: center;
  line-height: 30px;
  color: #000;
  text-decoration: none;
}

#brand .brandbox:hover {
  text-decoration: underline;
}

#brand .brandbox a {
  color: #000;
}

#brand .brandbox img {
  width: 280px;
  height: 280px;
  border: #EFEFEF 1px solid;
}





/*----------報告類型--------------*/
#reporttype {
  margin-bottom: 30px;
}

#reporttype .box {
  width: 230px;
  float: left;
  margin-right: 15px;
  margin-bottom: 15px;
}

#reporttype .box img {
  margin-bottom: 5px;
  width: 230px;
  height: auto;
  border: #EFEFEF 1px solid;
}

#reporttype .rightbox {
  width: 230px;
  float: left;
  margin-right: 0;
  margin-bottom: 15px;
}

#reporttype .rightbox img {
  margin-bottom: 5px;
  border: #EFEFEF 1px solid;
  width: 230px;
  height: auto;
}

#reporttype .box a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}

#reporttype .rightbox a {
  line-height: 24px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  display: block;
}


/*----------edm--------------*/
#edm {
  width: 680px;
  margin: 0 auto;
  text-align: center;
  font-size: 18px;
}

#edm #page {
  font-size: 18px;
  line-height: 60px;
  color: #999;
  margin-bottom: 20px;
}

#edm #page a {
  line-height: 60px;
  font-size: 18px;
  margin: 0 10px;
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

#edm #page a:hover {
  text-decoration: underline;
}

#edm h1 {
  line-height: 40px;
  font-size: 24px;
  font-weight: bold;
}

#edm p {
  line-height: 32px;
  font-size: 18px;
  width: 100%;
  margin: 0 auto 30px auto;
}

#edm img {
  width: 680px;
  max-width: 100%;
  height: auto;
}

.edm_content {
  float: left;
  width: 100%;
  display: none;
}


/*----------bottomad--------------*/

#bottomad {
  width: 1080px;
  margin: 0 auto;
  height: 200px;
  margin-bottom: 50px;
  text-align: left;
}

#bottomad #titlebg {
  width: 1080px;
  border-bottom: #d5dde1 1px solid;
  position: relative;
  margin-bottom: 40px;
  height: 20px;
}

#bottomad #title {
  font-size: 24px;
  line-height: 30px;
  font-weight: bold;
  position: absolute;
  left: 0;
  top: 8px;
  display: block;
  background-color: #fff;
  width: 180px;
  z-index: 1;
}

#bottomad #icon {
  float: left;
  margin-top: 40px;
  margin-left: 20px;
  width: 180px;
}

#bottomad #icon img {
  margin-right: 50px;
  float: left;
}

#bottomad #rightarea {
  float: right;
  width: 800px;
}

#bottomad #rightarea .box {
  height: 140px;
  margin-right: 20px;
  float: left;
  padding-left: 15px;
  width: 250px;
}

#bottomad #rightarea .box h1 {
  font-size: 22px;
  line-height: 30px;
  font-weight: normal;
  margin-bottom: 20px;
  color: #595a5a;
}

#bottomad #rightarea .box h1 a {
  color: #595a5a;
  text-decoration: none;
}

#bottomad #rightarea img {
  margin-right: 10px;
  vertical-align: middle;
}

#bottomad #rightarea .box a {
  text-decoration: none;
  color: #000;
}

#bottomad #rightarea .box a:hover {
  text-decoration: underline;
}


.clear {
  clear: both;
}






/*----------公部門--------------*/
#publicsector {
  display: inline-block;
  margin: 0 auto;
  width: 1080px;
  margin-bottom: 100px;
  visibility: hidden;
}

#publicsector.visible {
  visibility: visible;
}

#publicsector_left {
  float: left;
  width: 720px;
  margin-right: 30px;
}

#publicsector_left h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

#publicsector_left .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 24px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 150px;
}

.government {
  float: left;
  width: 100%;
  margin-bottom: 30px;
}

.government .sectitle {
  float: left;
  height: 50px;
  line-height: 40px;
  font-size: 18px;
  font-weight: bold;
  width: 100%;
  text-align: left;
}

.government .sectitle .time {
  line-height: 30px;
  height: 30px;
  float: right;
  font-size: 14px;
  color: #a9a9a9;
  font-weight: normal;
}

.government .pic {
  margin-bottom: 20px;
  width: 100%;
  float: left;
}

/*.government .pic img{ width: 233px; margin-right: 7px; height: auto; float: left;}*/
.gov_news {
  float: left;
  width: 100%;
}

.government .newsbox {
  display: table;
  width: 100%;
  color: #000;
  margin-bottom: 15px;
  float: left;
  height: 132px;
}

.government .newsBoxThumb {
  display: table-cell;
  width: 230px;
  height: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}


.government .newsBoxThumb .imgThumb {
  float: left;
  width: 230px;
  height: 100%;
  border: #d5dde1 1px solid;
}

.government .newsbox p {
  line-height: 24px;
  font-size: 16px;
  width: 100%;
  float: left;
  text-align: left;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 24px;
  height: 72px;
  word-break: break-all;
}

.government .newsbox .title2 {
  display: table-cell;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 30px;
}

.government .newsbox .title2 a {
  font-size: 20px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  text-align: left;
  float: left;
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
}

.government .newsbox .title2 a:hover {
  text-decoration: underline;
}

.government .newsbox .newsbox_light {
  width: 11px;
  height: 11px;
  border: 0;
  position: absolute;
  z-index: 0;
  left: 10px;
  top: 8px;
}

.government .newsbox .smalltime {
  width: 100%;
  line-height: 30px;
  height: 30px;
  float: left;
  font-size: 14px;
  color: #a9a9a9;
  text-align: left;
}

.government .newsbox .date3 {
  font-size: 14px;
  float: left;
  line-height: 30px;
  display: block;
  color: #a9a9a9;
  width: 100%;
}

.government .newsbox .source {
  font-size: 14px;
  line-height: 24px;
  color: #a9a9a9;
  margin-left: 20px;
}

.government .databox {
  width: 32%;
  margin-bottom: 10px;
  margin-right: 2%;
  float: left;
}

.government .databox:last-child {
  margin-right: 0%;
}

.government .databox .title3 {
  float: left;
  width: 100%;
  font-size: 16px;
  line-height: 40px;
  color: #000;
  font-weight: bold;
  text-align: left;
}

.government .databox .title3 img {
  float: left;
  width: 32px;
  height: 29px;
  margin-right: 10px;
}

.government .databox .databg {
  float: left;
  width: 100%;
  position: relative;
}

.government .databox .databg .bg {
  float: left;
  width: 100%;
  position: relative;
  z-index: 0;
}

.government .databox .databg span {
  position: absolute;
  z-index: 2;
  width: 100%;
  text-align: left;
  left: 0px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 15px;
}

.government .databox .databg .govertitle {
  top: 15px;
  font-size: 18px;
  line-height: 30px;
  font-weight: bold;
}

.government .databox .databg .alltitle {
  top: 45px;
  font-size: 15px;
  float: left;
  line-height: 30px;
}

.government .databox .databg .bignum {
  top: 75px;
  font-size: 26px;
  line-height: 30px;
  font-weight: bold;
  font-family: Arial;
}

.government .databox .databg .gov_icon {
  position: absolute;
  z-index: 1;
  height: 60%;
  top: 20%;
  right: 10px;
}


#publicsector_right {
  float: right;
  width: 320px;
}

#publicsector_right .taiwan100 {
  float: left;
  margin-bottom: 20px;
  width: 100%;
}

#publicsector_right .taiwan100 img {
  float: left;
  width: 100%;
  margin-bottom: 20px;
}

#publicsector_right .taiwan100 .titlebg {
  float: left;
  width: 100%;
  text-align: left;
  height: 40px;
  line-height: 40px;
  font-size: 18px;
  font-weight: bold;
}

#publicsector_right .taiwan100 .box {
  line-height: 22px;
  font-size: 16px;
  padding: 10px 0;
  width: 100%;
  border-bottom: 1px solid #eaeaea;
  float: left;
}

#publicsector_right .taiwan100 .box a {
  line-height: 22px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  float: left;
  width: 100%;
  text-align: left;
}

#publicsector_right .taiwan100 .box a:hover {
  text-decoration: underline;
}

#publicsector_right .taiwan100 .box .dates {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 13px;
  line-height: 24px;
  color: #a9a9a9;
}

#publicsector_right .taiwan100 .box .news {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 14px;
  line-height: 24px;
  color: #a9a9a9;
}




.tw_hotList {
  float: left;
  width: 100%;
}





/*----------輿情榜--------------*/
#ranking {
  display: inline-block;
  margin: 0 auto;
  width: 1080px;
  margin-bottom: 100px;
}

.backbtn {
  line-height: 40px;
  font-size: 16px;
  border-radius: 6px;
  background-color: #000;
  padding: 0 10px;
  float: right;
  clear: both;
  margin-bottom: 10px;
  color: #fff;
  height: 40px;
}

a.backbtn {
  line-height: 40px;
  font-size: 16px;
  border-radius: 6px;
  background-color: #000;
  padding: 0 10px;
  display: block;
  float: right;
  clear: both;
  color: #fff;
  text-decoration: none;
  height: 40px;
}

#ranking #redmenu {
  float: left;
  width: 100%;
  height: 40px;
  margin-bottom: 15px;
  border: #d6d6d6 1px solid;
}

#ranking #redmenu ul {
  width: 100%;
}

#ranking #redmenu li {
  float: left;
  width: 16.666%;
  list-style-type: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: #d6d6d6 1px solid;
}

#ranking #redmenu li a {
  background-color: #f6f6f6;
  font-size: 18px;
  text-align: center;
  height: 40px;
  line-height: 40px;
  width: 100%;
  color: #000;
  text-decoration: none;
  float: left;
}

#ranking #redmenu li:last-child {
  border-right: none;
}

#ranking #redmenu li a:hover {
  color: #fff;
  background-color: #b51e1e;
}

#ranking #redmenu li.red a {
  background-color: #b51e1e;
  color: #fff;
}


.top100_bar {
  float: left;
  width: 100%;
  margin-bottom: 30px;
  position: relative;
}

.top100_bar .bar_content {
  float: left;
  width: 100%;
  position: relative;
  z-index: 0;
  text-align: left;
}

.tw_100_icon {
  float: left;
  width: 179px;
  margin-right: 10px;
  margin-top: 10px;
}

#ranking h1 {
  font-size: 30px;
  line-height: 42px;
  margin-top: 10px;
}

#ranking h2 {
  font-size: 18px;
  line-height: 30px;
  font-weight: normal;
}

#weekranking {
  position: absolute;
  z-index: 1;
  right: 0px;
  bottom: 10px;
}

#weekranking .RankingBtn {
  display: inline-block;
  font-size: 18px;
  line-height: 30px;
  color: #000;
  margin-right: 30px;
  border-bottom: #000000 1px solid;
}

#weekranking .RankingBtn:last-child {
  margin-right: 0px;
}



#weekranking select {
  padding: 5px;
  line-height: 30px;
  font-size: 16px;
  font-family: Microsoft JhengHei;
}


#rankingform {
  float: left;
  width: 100%;
  background-color: #f0f0f0;
  padding: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#rankingform .tableStyle {
  float: left;
  width: 100%;
}

#rankingform .tableStyle th {
  color: #4f4f4f;
  font-size: 16px;
  line-height: 20px;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-bottom: 15px;
  padding-top: 10px;
}

#rankingform .tableStyle th.td_rank {
  width: 59px;
}

#rankingform .tableStyle th.td_name {
  width: 207px;
}

#rankingform .tableStyle th.td_value {
  width: 130px;
}

#rankingform .tableStyle th.td_social {
  width: 159px;
}

#rankingform .tableStyle td {
  background: #FFFFFF;
  height: 56px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 10px 0px 10px;
  border-bottom: 12px solid #f0f0f0;
  border-left: 2px solid #f0f0f0;
}

td.ct {
  text-align: center;
  vertical-align: top;
}

td.cm {
  text-align: center;
  vertical-align: middle;
}

td.lt {
  text-align: left;
  vertical-align: top;
}

td.lm {
  text-align: left;
  vertical-align: middle;
}




#rankingform .tdsec {
  border-left: none !important;
  /*  line-height: 40px; */
  font-size: 16px;
  font-weight: bold;
}

#rankingform .tdsec a {
  text-decoration: none !important;
  color: #000000;
}

#rankingform .num {
  float: left;
  text-align: center;
  width: 100%;
  margin-bottom: 0px;
  font-weight: bold;
}

#rankingform .arrow_icon {
  display: inline-block;
  width: 11px;
  margin-top: 0px;
}

#rankingform .picbg {
  border-radius: 50%;
  overflow: hidden;
  height: 56px;
  width: 56px;
  position: relative;
  float: left;
  margin-right: 20px;
  margin-top: 5px;
}

#rankingform .picbg img {
  height: 56px;
  width: 56px;
  z-index: 1;
  position: absolute;
  top: 0px;
  left: 0px;
}

#rankingform .nameTxt {
  float: left;
  padding: 0;
  width: 100%;
  text-align: left;
  font-size: 16px;
  font-weight: bold;
  line-height: 16px !important;
  margin: 3px 0px 5px 0px;
}

#rankingform .nametitle {
  line-height: 15px !important;
  font-size: 15px;
  color: #696969;
  margin: 0;
  padding: 0;
  float: left;
  width: 100%;
  text-align: left;
  font-weight: normal;
  margin: 3px 0px 5px 0px;
}


.td_status_bar {
  display: inline-block;
  width: 100%;
  height: 26px;
  margin-top: 10px;
}

.td_status_bar .valueBar {
  float: left;
  height: 26px;
  position: relative;
  text-align: left;
  line-height: 26px;
  font-size: 12px;
  color: #aaaaaa;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}


.td_status_bar .valueBar span {
  position: absolute;
  left: 0px;
}

.td_status_bar .valueBar.green span {
  position: absolute;
  left: 0px;
  bottom: -26px;
}

.td_status_bar .valueBar.red span {
  position: absolute;
  left: 0px;
  top: -26px;
}

.td_status_bar .valueBar.gray span {
  position: absolute;
  left: 0px;
  bottom: -26px;
}

.td_status_bar .valueBar.green {
  background: #3fc649;
  z-index: 3;
}

.td_status_bar .valueBar.red {
  background: #971820;
  z-index: 2;
}

.td_status_bar .valueBar.gray {
  background: #aaaaaa;
  z-index: 1;
}





/*----------輿情榜內頁--------------*/
#ranking_left {
  float: left;
  width: 760px;
  padding-top: 30px;
}

#ranking_left #name {
  float: left;
  width: 380px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 30px;
  text-align: left;
}

#ranking_left #name .picbg {
  height: 86px;
  width: 86px;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  overflow: hidden;
}

#ranking_left #name .picbg img {
  float: left;
  height: 86px;
  width: 86px;
  z-index: 1;
}

#ranking_left #name #nameGroup {
  display: inline-block;
  vertical-align: middle;
  width: 270px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 10px;
}

#ranking_left #name #uidName {
  float: left;
  width: 100%;
  font-size: 30px;
  line-height: 1.3 !important;
}

#ranking_left #name #uidTitle {
  float: left;
  width: 270px;
  font-size: 14px;
  line-height: 1;
  line-height: 1.3 !important;
}

#ranking_left #topranking {
  float: left;
  text-align: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 15px 10px 15px;
  border-radius: 6px;
  border: #efeff0 1px solid;
  height: 86px;
  width: 120px;
  line-height: 30px;
  font-size: 18px;
  margin-right: 30px;
}

#ranking_left #topranking .num {
  line-height: 40px;
  font-size: 28px;
  font-family: Arial;
}

#ranking_left #topranking .num img {
  vertical-align: middle;
  width: 11px;
  height: 11px;
  margin-bottom: 6px;
  margin-left: 10px;
}

#ranking_left #total {
  float: left;
  text-align: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 15px 10px 15px;
  border-radius: 6px;
  border: #efeff0 1px solid;
  height: 86px;
  width: 350px;
  line-height: 30px;
  font-size: 18px;
}

#ranking_left #total .num {
  line-height: 40px;
  font-size: 28px;
  font-family: Arial;
}

#ranking_left #all {
  width: 100%;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 15px 10px 15px;
  border-radius: 6px;
  border: #efeff0 1px solid;
  margin-bottom: 20px;
  text-align: left;
}

#ranking_left .chart_type {
  width: 100%;
  float: left;
  text-align: left;
  line-height: 30px;
  font-size: 18px;
}

#ranking_left #all .chart {
  float: left;
  width: 100%;
  margin-top: 10px;
}

#ranking_left #all .chart_des {
  float: left;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px;
  font-size: 12px;
  text-align: left;
  color: #000000;
  background: #f0f0f0;
  margin-bottom: 30px;
  margin-top: 30px;
  line-height: 1.4 !important;
}




#ranking_right {
  float: right;
  width: 280px;
  padding-top: 30px;
}

.detailRankingBanner {
  float: left;
  width: 100%;
  margin-bottom: 30px;
}

.detailRankingBanner img {
  float: left;
  width: 100%;
}

#ranking_right .top5 {
  float: left;
  margin-bottom: 20px;
  width: 100%;
}

#ranking_right .top5 .titlebg {
  float: left;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-bottom: 5px;
  border-bottom: #d5dde1 2px solid;
  line-height: 1.4;
  font-size: 18px;
  font-weight: bold;
  text-align: left;
  margin-bottom: 10px;
}

#ranking_right .top5 .titlebg span {
  margin-left: 5px;
  margin-right: 5px;
}

#ranking_right .top5 .box {
  float: left;
  width: 100%;
  line-height: 22px;
  font-size: 16px;
  border-bottom: 1px solid #eaeaea;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 0px 5px 0px;
  margin-bottom: 10px;
  text-align: left;
}

#ranking_right .top5 .box a {
  float: left;
  width: 100%;
  line-height: 22px;
  font-size: 16px;
  color: #000;
  text-decoration: none;
}

#ranking_right .top5 .box a:hover {
  text-decoration: underline;
}

#ranking_right .top5 .box .dates {
  float: left;
  width: 100%;
  font-size: 13px;
  line-height: 20px;
  color: #a9a9a9;
}

#ranking_right .top5 .box .news {
  float: left;
  width: 100%;
  font-size: 14px;
  line-height: 20px;
  color: #a9a9a9;
}

#ranking_right .of_backbtn {
  float: left;
  width: 100%;
  color: #fff;
  margin-bottom: 10px;
}

#ranking_right .of_backbtn img {
  float: left;
  width: 100%;
}

#ranking_right .of_backbtn:hover {
  background-color: #c41f1a;
}

.chartPeriodFunction {
  float: left;
  width: 100%;
  text-align: right;
  margin-bottom: 10px;
}

.chartPeriodFunction .period_btn {
  display: inline-block;
  font-size: 18px;
  line-height: 30px;
  color: #000;
  text-decoration: underline;
  margin-left: 10px;
  cursor: pointer;
}


.curve_chart {
  float: left;
  width: 100%;
  height: auto;
}






/*----------footer--------------*/

#footer {
  width: 100%;
  background-color: #4a4a4a;
  clear: both;
  color: #fff;
  line-height: 60px;
  font-size: 16px;
  padding-top: 40px;
  text-align: left;
}

#footercontent {
  width: 1080px;
  margin: 0 auto;
  height: 200px;
}

#footercontent h1 {
  font-size: 24px;
  color: #fff;
  line-height: 30px;
  font-weight: bold;
  margin-bottom: 20px;
}

#footercontent ul {
  float: left;
  padding: 0;
  text-decoration: none;
  margin: 0 80px 20px 0;
}

#footercontent ul ul {
  float: left;
  padding: 0;
  text-decoration: none;
  margin: 0px 20px 20px 0px !important;
}

#footercontent li.b {
  font-size: 16px;
  color: #fff;
  line-height: 30px;
  text-align: left;
  list-style: none;
}

#footercontent li.b a {
  font-size: 16px;
  color: #fff;
  line-height: 30px;
  text-align: left;
  list-style: none;
  text-decoration: none;
}

#footercontent li.s {
  list-style: none;
  line-height: 20px;
  margin-left: 0;
  padding: 0;
  text-align: left;
}

#footercontent li.s .linkStyle {
  color: #afafaf;
  font-size: 14px;
  line-height: 24px;
  list-style: none;
  text-decoration: none;
}

#footercontent li.s .linkStyle:hover {
  color: #fff;
}

#footercontent li.s2 {
  list-style: none;
  line-height: 20px;
  margin-left: 15px;
  padding: 0;
  text-align: left;
}

#footercontent li.s2 .linkStyle {
  color: #afafaf;
  font-size: 14px;
  line-height: 24px;
  list-style: none;
  text-decoration: none;
}

#footercontent li.s2 .linkStyle:hover {
  color: #fff;
}

#footercontent li .linkStyle_normal:hover {
  color: #afafaf !important;
}

#footer2 {
  background-color: #000;
  clear: both;
  color: #afafaf;
  text-align: center;
  width: 100%;
  height: 40px;
  font-size: 12px;
  line-height: 40px;
}

#footersec {
  width: 1080px;
  margin: 0 auto;
  height: auto;
  clear: both;
  text-align: center;
}

#footersec a {
  display: inline-block;
  font-size: 16px;
  color: #fff;
  line-height: 30px;
  text-align: left;
  list-style: none;
  text-decoration: none;
  margin-right: 40px;
}

#footersec a:last-child {
  margin-right: 0px;
}



.video-container {
  position: relative;
  padding-bottom: 56.25%;
  overflow: hidden;
  width: 100%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.api_service_table {
  float: left;
  width: 600px;
}


/*----------index_search--------------*/

#searResult_wrap {
  float: left;
  width: 100%;
}

#searchbanner {
  width: 100%;
  height: 650px;
  text-align: center;
  position: relative;
  display: table;
}

.search_bg {
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
  left: 0px;
  right: 0px;
}

#searchbanner .ct {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  text-align: center;
  position: relative;
}

.searchbarwrap {
  display: inline-block;
  width: 500px;
  position: relative;
  z-index: 1;
  margin-top: -50px;
}

#searchbanner .title {
  float: left;
  width: 100%;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 35px;
}

#searchbar {
  float: left;
  height: 60px;
  width: 100%;
  position: relative;
  z-index: 2;
  margin-bottom: 25px;
}

#searchbar input.searchInput {
  width: 380px;
  height: 60px;
  font-size: 18px;
  background-color: #f8f8f9;
  border-radius: 5px;
  background-image: url('images/icon_search.png');
  background-position: 15px 19px;
  padding: 0px 20px 0px 40px;
  background-repeat: no-repeat;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 0;
  float: left;
}

#searchbar .searchbtn {
  width: 110px;
  height: 60px;
  line-height: 60px;
  background-color: #000;
  color: #fff;
  text-align: center;
  font-size: 15px;
  border-radius: 5px;
  display: block;
  float: right;
  border: none;
  cursor: pointer;
}

#hotsearch {
  display: inline-block;
  position: relative;
  z-index: 2;
  width: 100%;
  background-color: #000;
  background: rgba(0, 0, 0, 0.4);
  padding: 15px 25px 15px 25px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#hotsearch h2 {
  color: #cecece;
  line-height: 50px;
  font-size: 20px;
  border-bottom: #cecece 1px solid;
  text-align: left;
  width: 100%;
  float: left;
  font-weight: normal;
}

#suggest {
  float: left;
  width: 100%;
  text-align: left;
}

#suggest div {
  height: 60px;
  margin-right: 20px;
  line-height: 60px;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  float: left;
  cursor: pointer;
}

#suggest div:last-child {
  margin-right: 0px;
}

#roll {
  position: absolute;
  z-index: 1;
  bottom: 0px;
  left: 0px;
  width: 100%;
  background-color: #000000;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px 35px 20px 35px;
}

#roll ul {
  float: left;
  width: 100%;
}

#roll ul li {
  border-right: #5e5e5e 1px solid;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-right: 20px;
  padding-left: 20px;
}

#roll .box {
  float: left;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: flex-start;
}

#roll .box .cover {
  float: left;
  height: 80px;
  width: 160px;
  position: relative;
}

#roll .box .txt {
  width: 250px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 20px;
  height: 80px;
  float: left;
}

#roll .box .txt h3 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  color: #fff;
  float: left;
  width: 100%;
  text-align: left;
}

#roll .box .txt p {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 24px;
  height: 48px;
  margin-top: 5px;
  text-align: left;
  overflow: hidden;
  font-size: 16px;
  color: #fff;
  float: left;
  width: 100%;
}

/* #roll .box .time{ 
  float: left;
  text-align: left;
  width: 100%;
  font-size: 13px; 
  color: #808080;
 } */


.search_block {
  display: inline-block;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px;
}

.search_block_title {
  display: inline-block;
  width: 100%;
  text-align: left;
  position: relative;
  margin-bottom: 20px;
}

.search_block_title:after {
  content: '';
  position: absolute;
  z-index: 0;
  width: 100%;
  top: 50%;
  left: 0px;
  height: 1px;
  background-color: #000000;
}

.search_block_title p {
  float: left;
  position: relative;
  z-index: 1;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 20px 10px 0px;
  background-color: #ffffff;
  font-size: 20px;
  color: #000000;
  font-weight: bold;
}




.search_block_news_slider {
  float: left;
  width: 100%;
}

.search_block_news_slider ul {
  float: left;
  width: 100%;
}

.search_block_news {
  display: inline-block;
  width: 100%;
  border: #b7b7b7 1px solid;
  position: relative;
  background-color: #ffffff;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.search_block_news .cover {
  float: left;
  width: 100%;
  height: 200px;
}

.search_block_news h3 {
  float: left;
  width: 100%;
  font-size: 18px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 24px;
  height: 48px;
  margin-top: 5px;
  text-align: left;
  overflow: hidden;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 10px;
  color: #000000;
}


.search_block_news .search_tag {
  float: left;
  margin-top: 10px;
  font-size: 14px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 10px 10px 10px;
  margin-top: 5px;
  text-align: center;
  color: #ffffff;
}

.search_block_news .search_date {
  position: absolute;
  bottom: 10px;
  right: 0px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-right: 20px;
  font-size: 14px;
  color: #a0a0a0;
}

.search_block_showcase {
  float: left;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: flex-start;
}

.search_block_showcase_item {
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: flex-start;
}

.search_block_showcase_item .cover {
  flex-grow: 1;
  width: 100%;
  height: 200px;
}

.search_block_showcase_item .des {
  flex-grow: 1;
  height: 200px;
  text-align: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 20px;
  padding-right: 20px;
}

.search_block_showcase_item .des h3 {
  float: left;
  width: 100%;
  font-size: 20px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 24px;
  height: 48px;
  margin-top: 5px;
  text-align: left;
  overflow: hidden;
  color: #000000;
}

.search_block_showcase_item .des p {
  float: left;
  width: 100%;
  font-size: 18px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-height: 24px;
  height: 96px;
  margin-top: 5px;
  text-align: left;
  overflow: hidden;
  color: #000000;
}

.search_block_showcase_item .des a {
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px 10px;
  font-size: 16px;
  background-color: red;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
}

@media screen and (max-width: 1024px) {

  .search_block_showcase {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: flex-start;
  }

  .search_block_showcase_item {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: flex-start;
    margin-bottom: 30px;
  }

  .search_block_showcase_item .des {
    flex-grow: 1;
    height: auto;
    text-align: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 0px;
  }

  .search_block_showcase_item .des p {
    float: left;
    width: 100%;
    font-size: 18px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-height: 24px;
    height: 96px;
    margin-top: 5px;
    text-align: left;
    overflow: hidden;
    color: #000000;
    margin-top: 10px;
    margin-bottom: 10px;
  }



}


#result_title {
  float: left;
  width: 100%;
  font-size: 18px;
  height: 60px;
  line-height: 60px;
  font-weight: bold;
  margin-top: 20px;
  text-align: center;
  margin-bottom: 10px;
}

.gray2 {
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
  color: #B3B3B3;
  font-size: 18px;
  font-weight: normal;
}

#resultarea {
  margin: 0 auto 40px auto;
  width: 1080px;
}


#result_banner {
  display: block;
  margin: 0 auto 40px auto;
  width: 1080px;
}

#result_banner img {
  float: left;
  width: 100%;
}

#resultarea #seemore {
  text-align: right;
  font-size: 18px;
  line-height: 40px;
  height: 40px;
  margin: 10px auto;
  width: 1060px;
  clear: both;
  background-image: url('images/arrow-1.png');
  background-position: right;
  background-repeat: no-repeat;
  padding-right: 20px;
}

#resultarea #seemore a {
  text-decoration: underline;
  color: #000;
}

#resultarea #seemore a:hover {
  text-decoration: underline;
}

#resultarea #left {
  width: 390px;
  float: left;
  margin-right: 30px;
}

#resultarea #left .box {
  width: 100%;
  margin-right: 20px;
}

#resultarea #left .box .k_result_img_style1 {
  float: left;
  width: 100%;
  height: 170px;
  margin-bottom: 6px;
}

#resultarea #left .box p {
  text-align: left;
  width: 100%;
  font-size: 16px;
  line-height: 24px;
  display: inline-block;
  text-align: left;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 48px;
  margin-top: 8px;
}

#resultarea #left .box a {
  float: left;
  width: 100%;
  font-size: 20px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  text-align: left;

  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 56px;
  margin-top: 8px;

}

#resultarea #left .box a:hover {
  text-decoration: underline;
}

#resultarea #left .box .time {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 13px;
  line-height: 20px;
  color: #a9a9a9;
  margin-top: 8px;
  margin-bottom: 20px;
}


#resultarea #middle {
  float: left;
  width: 340px;
}

#resultarea #middle .box {
  float: left;
  width: 100%;
  margin-bottom: 20px;
  display: block;
}

#resultarea #middle .box .k_result_img_style2 {
  width: 90px;
  height: 90px;
  float: left;
  margin-right: 20px;
  border: 1px solid #ebebeb;
}

#resultarea #middle .box .txt {
  width: 226px;
  float: right;
}

#resultarea #middle .box .txt a {
  font-size: 18px;
  line-height: 24px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  width: 226px;
  float: right;
  margin-bottom: 22px;
  text-align: left;

  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 48px;
}

#resultarea #middle .box .txt a:hover {
  text-decoration: underline;
}

#resultarea #middle .box .time {
  font-size: 13px;
  line-height: 20px;
  color: #a9a9a9;
  width: 226px;
  float: right;
  text-align: left;
}


#resultarea #right {
  width: 290px;
  float: right;
}

#resultarea #right .box .k_result_img_style3 {
  float: left;
  width: 100%;
  height: 170px;
  margin-bottom: 6px;
}

#resultarea #right .box {
  float: left;
  width: 100%;
}

#resultarea #right .box p {
  text-align: left;
  width: 100%;
  font-size: 16px;
  line-height: 24px;
  display: inline-block;
  text-align: left;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 48px;
  margin-top: 8px;
}

#resultarea #right .box a {
  float: left;
  width: 100%;
  font-size: 20px;
  line-height: 28px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  text-align: left;

  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 56px;
  margin-top: 8px;
}

#resultarea #right .box a:hover {
  text-decoration: underline;
}

#resultarea #right .box .time {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 13px;
  line-height: 20px;
  color: #a9a9a9;
  margin-top: 8px;
  margin-bottom: 20px;
}

.result_all_wrap {
  display: inline-block;
  width: 100%;
  display: none;
  visibility: hidden;
}

.result_all_wrap.visible {
  visibility: visible;
}



.result_show {
  display: none;
  width: 100%;
}

.result_noShow {
  display: none;
  width: 100%;
  text-align: center;
  font-size: 16px;
  color: #000000;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 10px 40px 0px;
}


.loadingWrap {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  z-index: 99;
  display: none;
}

.loadingWrap.show {
  display: table;
}


.loadingWrap .ct {
  width: 100%;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  position: relative;
  z-index: 1;
}

.loadingWrap .bg {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 0;
  top: 0px;
  left: 0px;
  background: #000000;
  opacity: .4;
}


.loadingWrap .ct img {
  width: 50px;
  height: 50px;
}




.timTxt {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}

.resulStatus {
  display: inline-block;
  vertical-align: middle;
}

.resulStatus .icon {
  display: inline-block;
  vertical-align: middle;
  width: 11px;
  height: 11px;
  margin-right: 5px;
}

.resulStatus span {
  display: inline-block;
  vertical-align: middle;
  font-size: 15px;
  color: #a9a9a9;
}



.chart_fix_top {
  margin-top: 40px;
}


#indexpublic_title {
  width: 1080px;
}

#indexpublic_title h2 {
  width: 100%;
  height: 40px;
  border-bottom: #d5dde1 2px solid;
  line-height: 40px;
  margin-bottom: 20px;
}

#indexpublic_title .title {
  line-height: 40px;
  border-bottom: #c41f1a 2px solid;
  padding-left: 5px;
  font-size: 20px;
  font-weight: bold;
  z-index: 999px;
  display: block;
  width: 150px;
}

/*--------------------------------------------------*/




@media screen and (max-width: 1100px) {


  #id_wrapper {
    /* 設定高度最小為100%, 如果內容區塊很多, 可以長大 */
    min-height: 100%;
    /* 位置設為relative, 作為footer區塊位置的參考 */
    position: relative;
    text-align: center;

    float: left;
    width: 100%;
  }




  .content {
    width: 100%;
    padding-left: 60px;
    margin: 0 auto;
    display: block;
    clear: both;
  }


  #header {
    width: 100%;
    float: left;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
  }

  #headercontent {
    display: inline-block;
    width: 100%;
  }

  #logo {
    float: none;
    display: inline-block;
    margin-top: 15px;
    width: 70px;
  }

  #logo img {
    width: 100%;
    height: auto;
  }

  #toplink {
    float: none;
    display: inline-block;
    color: #777777;
    font-size: 12px;
    padding-top: 0px;
    text-align: center;
  }

  #toplink a {
    color: #777777;
    text-decoration: none;
    margin-right: 5px;
    margin-left: 5px;
  }


  #menu {
    display: inline-block;
    margin: 0;
    width: 100%;
    height: 100%;
    line-height: 40px;
    background-color: #c41f1a;
    position: fixed;
    z-index: 10;
    top: -100%;
    left: 0px;
    overflow-y: scroll;
    -moz-transition: ease-in-out 0.3s;
    -o-transition: ease-in-out 0.3s;
    -webkit-transition: ease-in-out 0.3s;
    transition: ease-in-out 0.3s;
  }

  #menu.reveal {
    top: 0;
  }

  #menu ul {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
  }

  #menu li {
    float: left;
    width: 100%;
    color: #fff;
    list-style: none;
    font-size: 14px;
    line-height: 40px;
    font-weight: bold;
  }

  #menu li a {
    width: 100%;
    text-align: center;
    color: #fff;
    display: block;
    text-decoration: none;
    padding: 0 0px;
  }

  #menu li a:hover {
    background-color: #aa0500;
  }

  #menu li.red a {
    color: #fff;
    display: block;
    text-decoration: none;
    font-weight: bold;
    background-color: #aa0500;
    padding: 0 25px;
  }

  #menu li.red a:hover {
    color: #fff;
    background-color: #aa0500;
  }


  #menu ul {
    /* 取消ul預設的內縮及樣式 */
    margin: 0;
    padding: 0;
    list-style: none;
    float: center;
    width: 100%;
    line-height: 40px;
    color: #fff;
    font-weight: bold;
    background-color: #aa0500;
  }

  #menu ul.drop-down-menu {
    display: inline-block;
    font-size: 14px;
    line-height: 40px;
  }

  #menu ul.drop-down-menu li {
    position: relative;
    white-space: nowrap;
    color: #fff;
    list-style: none;
    font-size: 14px;
    line-height: 40px;
    display: block;
  }

  #menu ul.drop-down-menu>li:last-child {
    border-right: none;
  }

  #menu ul.drop-down-menu>li {
    float: left;
    /* 只有第一層是靠左對齊*/
  }

  #menu ul.drop-down-menu a {
    line-height: 40px;
    color: #fff;
    display: block;
    text-decoration: none;
    padding: 0 0px;

  }

  #menu ul.drop-down-menu a:hover {
    /* 滑鼠滑入按鈕變色*/
    color: #fff;
  }

  #menu ul.drop-down-menu li:hover>a {
    /* 滑鼠移入次選單上層按鈕保持變色*/
    color: #fff;
  }

  #menu ul.drop-down-menu ul {
    border: none;
    position: relative;
    z-index: 99;
    left: 0px;
    top: 100%;
    width: 100%;
    font-size: 14px;

  }

  #menu ul.drop-down-menu ul li {
    line-height: 40px;
    border-bottom: #d3807e 1px solid;
    font-size: 12px;
    width: 100%;
    background-color: #c41f1a;
  }

  #menu ul.drop-down-menu ul li a:hover {
    /* 滑鼠滑入按鈕變色*/
    width: 100%;
    color: #fff;
    border-bottom: none;
    background-color: #aa0500;
  }

  #menu ul.drop-down-menu ul li:last-child {
    border-bottom: #d3807e 1px solid;
  }

  #menu ul.drop-down-menu ul ul {
    /*第三層以後的選單出現位置與第二層不同*/
    z-index: 999;
    top: 10px;
    left: 90%;
  }

  #menu ul.drop-down-menu ul {
    /*隱藏次選單*/
    display: none;

  }

  #menu ul.drop-down-menu li:hover>ul {
    /* 滑鼠滑入展開次選單*/
    display: block;

  }


  #menuright {
    position: relative;
    z-index: 3;
    width: 100%;
    float: left;
    top: 0px;
    right: 0px;
  }

  #menuright .greenbtn {

    float: left;
    width: 100%;
    font-size: 18px;
    color: #fff;
    line-height: 40px;
    font-weight: bold;
    background-color: #1aa946;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 25px 0px 25px;
    text-decoration: none;
  }


  .NAV_btn_wrap {
    display: block;
    position: absolute;
    width: 60px;
    top: 9px;
    right: 10px;
    z-index: 12;
  }

  #nav-icon3 {
    width: 30px;
    height: 45px;
    position: relative;
    margin: 0px auto;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
  }

  #nav-icon3 span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    border-radius: 2px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;

  }

  #nav-icon3.light span {
    background: #ffffff;
  }

  #nav-icon3.dark span {
    background: #000000;
  }


  #nav-icon3 span:nth-child(1) {
    top: 0px;
  }

  #nav-icon3 span:nth-child(2),
  #nav-icon3 span:nth-child(3) {
    top: 10px;
  }

  #nav-icon3 span:nth-child(2) {
    display: none;
    top: 10px;
  }

  #nav-icon3 span:nth-child(4) {
    top: 20px;
  }

  #nav-icon3.open span {
    background: #ffffff;
  }

  #nav-icon3.open span:nth-child(1) {
    top: 18px;
    width: 0%;
    left: 50%;
  }

  #nav-icon3.open span:nth-child(2) {
    display: block;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  #nav-icon3.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  #nav-icon3.open span:nth-child(4) {
    top: 18px;
    width: 0%;
    left: 50%;
  }


  #platform {
    margin: 0 auto;
    width: 100%;
  }

  #platformbg {
    float: left;
    width: 100%;
    line-height: 30px;
    border-bottom: #b2b2b2 1px solid;
    clear: both;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 5px;
    padding-right: 5px;

  }

  #platform .title {
    font-size: 12px;
    float: left;
    padding-right: 5px;
    margin-right: 5px;
    border-right: #b2b2b2 1px solid;
  }

  #platform .box {
    float: left;
    margin-right: 5px;
    height: 30px;
    padding-right: 0;
    line-height: 30px;
  }

  #platform .box a {
    font-size: 12px;
    line-height: 30px;
    color: #1e5daa;
    font-weight: bold;
  }

  #platform .box img {
    float: left;
    margin-right: 5px;
    margin-top: 8px;
    width: 15px;
    height: 15px;
  }

  #platform .tatal {
    float: right;
    font-size: 12px;
    width: 100%;
    text-align: left;
  }

  #Breadcrumbs {
    font-size: 16px;
    clear: both;
    height: auto;
    line-height: 1.4;
    margin: 0 auto;
    width: 100%;
    display: inline-block;
    text-align: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
  }

  #Breadcrumbs a {
    font-size: 14px;
    text-decoration: none;
    color: #bcbcbc;
  }


  /*----------bottomad--------------*/

  #bottomad {
    float: left;
    width: 100%;
    margin: 0 auto;
    height: auto;
    margin-bottom: 50px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
  }

  #bottomad #titlebg {
    width: 100%;
    border-bottom: #d5dde1 1px solid;
    position: relative;
    margin-bottom: 40px;
    height: 20px;
    text-align: left;
  }

  #bottomad #title {
    font-size: 16px;
    line-height: 30px;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: 8px;
    display: block;
    background-color: #fff;
    width: 130px;
    z-index: 1;
  }

  #bottomad #icon {
    float: left;
    margin-top: 0px;
    margin-left: 20px;
    width: 180px;
  }

  #bottomad #icon img {
    margin-right: 50px;
    float: left;
  }

  #bottomad #rightarea {
    float: left;
    width: 100%;
    margin-top: 20px;
  }

  #bottomad #rightarea .box {
    height: auto;
    margin-right: 0px;
    float: left;
    padding-left: 0px;
    width: 42%;
    border: none !important;
    margin: 10px;
    font-size: 12px;
  }

  #bottomad #rightarea .box h1 {
    font-size: 16px;
    line-height: 1.4 !important;
    font-weight: normal;
    margin-bottom: 20px;
    color: #595a5a;
  }

  #bottomad #rightarea .box h1 a {
    color: #595a5a;
    text-decoration: none;
    line-height: 1.4 !important;
  }

  #bottomad #rightarea img {
    margin-right: 10px;
    width: 20px;
    height: auto;
    vertical-align: middle;
  }

  #bottomad #rightarea .box a {
    text-decoration: none;
    color: #000;
  }

  #bottomad #rightarea .box a:hover {
    text-decoration: underline;
  }


  .clear {
    clear: both;
  }

  /*----------footer--------------*/

  #footer {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    background-color: #4a4a4a;
    clear: both;
    color: #fff;
    line-height: 60px;
    font-size: 16px;
    padding-top: 40px;
    text-align: left;
  }

  #footercontent {
    width: 100%;
    margin: 0 auto;
    height: auto;
  }

  #footercontent h1 {
    font-size: 24px;
    color: #fff;
    line-height: 30px;
    font-weight: bold;
    margin-bottom: 20px;
  }

  #footercontent ul {
    float: left;
    padding: 0;
    width: 50% !important;
    text-decoration: none;
    margin: 10px 0px 0px 0px;
  }

  #footercontent li.b {
    font-size: 14px;
    color: #fff;
    line-height: 30px;
    text-align: left;
    list-style: none;
  }

  #footercontent ul div {
    float: left !important;
    width: 100% !important;
  }

  #footercontent li.b a {
    font-size: 14px;
    color: #fff;
    line-height: 30px;
    text-align: left;
    list-style: none;
    text-decoration: none;
  }

  #footercontent li.s {
    list-style: none;
    line-height: 20px;
    margin-left: 0;
    padding: 0;
    text-align: left;
  }

  #footercontent li.s .linkStyle {
    color: #afafaf;
    font-size: 12px;
    line-height: 24px;
    list-style: none;
    text-decoration: none;
  }

  #footercontent li.s .linkStyle:hover {
    color: #fff;
  }

  #footercontent li.s2 {
    list-style: none;
    line-height: 20px;
    margin-left: 15px;
    padding: 0;
    text-align: left;
  }

  #footercontent li.s2 .linkStyle {
    color: #afafaf;
    font-size: 12px;
    line-height: 24px;
    list-style: none;
    text-decoration: none;
  }

  #footercontent li.s2 .linkStyle:hover {
    color: #fff;
  }

  #footer2 {
    background-color: #000;
    clear: both;
    color: #afafaf;
    text-align: center;
    width: 100%;
    height: 40px;
    font-size: 12px;
    line-height: 40px;
  }

  #footersec {
    float: left;

    width: 100%;
    margin: 10px 0px 0px 0px;
    height: auto;
    clear: both;
  }

  #footersec a {
    display: inline-block;
    font-size: 14px;
    color: #fff;
    line-height: 30px;
    text-align: left;
    list-style: none;
    text-decoration: none;
    margin: 10px;
  }



  #indexcontent {
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
    margin: 0 auto;
    width: 100%;
    clear: both;
    margin-bottom: 100px;
    text-align: center;
  }




  #indexleft {
    float: none;
    display: inline-block;
    width: 720px;
    margin-right: 30px;
    text-align: left;
  }

  #indexright {
    float: none;
    display: inline-block;
    width: 320px;
    text-align: left;
  }

  #case {
    width: 720px;
    float: none;
    line-height: 30px;
    display: inline-block;
  }

  .reportright {
    width: 320px;
    margin-right: 0;
    float: none;
    display: inline-block;
  }


  #case #topbox {
    width: 100%;
    margin-bottom: 20px;
    text-align: left;
  }

  .electionbox a {
    font-size: 16px;
    line-height: 50px;
    color: #000;
    font-weight: bold;
    text-decoration: none;
    display: block;
    text-align: center;
  }


  #publiccontent {
    font-size: 16px;
    line-height: 26px;
    float: left;
    width: 720px;
    margin-right: 0px;
    display: inline-block;
    text-align: left;
  }

  #publiccontent h1 {
    font-size: 32px;
    font-weight: bold;
    line-height: 40px;
  }

  #publiccontent h4 {
    font-size: 22px;
    font-weight: bold;
    line-height: 60px;
    margin: 0;
  }

  #publiccontent p {
    margin-bottom: 20px;
    letter-spacing: 1.5px;
  }

  #publiccontent img {
    margin: 15px 0;
    width: 700px;
    max-width: 100%;
    height: auto;
    border: #ccc 1px solid;
  }


  /*----------app--------------*/
  .appbox2 {
    width: 720px;
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: #EEEEEE 1px solid;
    display: inline-block;
  }

  .appbox2 h2 {
    color: #c00001;
    font-weight: bold;
    font-size: 24px;
    line-height: 50px;
  }

  .appbox2 p {
    font-size: 18px;
    line-height: 30px;
    width: 100%;
    margin: 0 auto 30px auto;
  }

  .appbox2 img {
    width: 281px;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
  }


  /*----------產品右邊--------------*/

  .productbox {
    width: 320px;
    float: none;
    display: inline-block;
  }

  .productbox h2 {
    width: 100%;
    height: 40px;
    border-bottom: #d5dde1 2px solid;
    line-height: 40px;
    margin-bottom: 20px;
  }

  .productbox .title {
    line-height: 40px;
    border-bottom: #154df3 2px solid;
    padding-left: 0px;
    font-size: 20px;
    font-weight: bold;
    z-index: 999px;
    display: block;
    width: 185px;
    float: left;
  }

  .productbox .box2 {
    width: 100%;
    color: #000;
    border: #d5dde1 1px solid;
    height: 60px;
    margin-bottom: 15px;
    float: left;
    padding-left: 0px;
    background-color: #f2f2f2;
    line-height: 60px;
  }

  #publicbottom {
    margin: 0 auto;
    width: 100%;
    clear: both;
    margin-bottom: 20px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 10px 0px 10px;
    display: inline-block;
  }


  /*----------報告內頁右邊--------------*/
  .reportright {
    width: 320px;
    margin-right: 0;
    float: none !important;
    display: inline-block;
  }



  /*----------專長內頁--------------*/
  #specialtycontent {
    float: left;
    width: 100%;
    margin-right: 0px;
    text-align: left;
  }

  .serviceright {
    width: 320px;
    margin-right: 0;
    float: none !important;
    display: inline-block;
  }




  #specialty_leftbox {
    width: 525px;
    float: none;
    margin-bottom: 40px;
    display: inline-block;
  }

  #specialty_leftbox img {
    width: 525px;
    height: auto;
  }

  #specialty_right {
    width: 525px;
    float: none;
    display: inline-block;
  }

  .specialty_rightbox {
    width: 250px;
    float: left;
    margin-bottom: 20px;
    margin-right: 25px;
  }

  .specialty_rightbox img {
    width: 250px;
    height: auto;
  }




  #resultarea {
    display: block;
    margin: 0 auto 40px auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    width: 100%;
  }


  #result_banner {
    display: block;
    margin: 0 auto 40px auto;
    width: 100%;
  }




  #resultarea #seemore {
    text-align: right;
    font-size: 18px;
    line-height: 40px;
    height: 40px;
    margin: 10px auto;
    width: 100%;
    background-image: url('images/arrow-1.png');
    background-position: right;
    background-repeat: no-repeat;
    padding-right: 20px;
  }

  #resultarea #left {
    width: 100%;
    float: left;

    margin-right: 0px;
  }

  #resultarea #left .box {}

  #resultarea #middle {
    float: left;
    width: 100%;
  }

  #resultarea #middle .box .txt {
    width: 100%;
    float: left;
  }

  #resultarea #middle .box .k_result_img_style2 {
    width: 100%;
    height: 170px;
    float: left;
    margin-right: 0px;
    border: none;
  }

  #resultarea #middle .box .txt a {
    font-size: 18px;
    line-height: 24px;
    color: #000;
    font-weight: bold;
    text-decoration: none;
    width: 100%;
    float: left;
    margin-bottom: 22px;
    text-align: left;
  }

  #resultarea #middle .box .time {
    font-size: 13px;
    line-height: 20px;
    color: #a9a9a9;
    width: 226px;
    float: left;
    width: 100%;
    text-align: left;
  }

  #resultarea #right {
    width: 100%;
    float: right;
  }

  #indexpublic_title {
    width: 100%;
  }






  /*----------公部門--------------*/
  #publicsector {
    float: left;
    width: 100%;
    clear: both;
    margin-bottom: 100px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
  }


  #publicsector_left {
    display: inline-block;
    float: none;
    width: 720px;
    margin-right: 0px;
  }

  #publicsector_right {
    display: inline-block;
    float: none;
    width: 320px;
  }




  /*----------輿情榜--------------*/
  #ranking {
    display: inline-block;
    margin: 0 auto;
    width: 100%;
    margin-bottom: 100px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
  }



  #ranking_left {
    float: none;
    display: inline-block;
    width: 760px;
    padding-top: 30px;
  }

  #ranking_right {
    float: none;
    display: inline-block;
    width: 280px;
    padding-top: 30px;
  }



}

@media screen and (max-width: 820px) {

  #contact {
    width: 100%;
    margin: 0 auto;
    font-size: 18px;
    line-height: 32px;
    margin-left: 0px;
  }

  .single_form {
    float: left;
    width: 90%;
    font-size: 16px;
    line-height: 24px;
    padding: 5px;
    font-family: "Helvetica", "Arial", "LiHei Pro", "黑體-繁", "微軟正黑體", sans-serif;
    color: #eee;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .electionbox {
    width: 100%;
    color: #000;
    border: #d5dde1 1px solid;
    height: auto;
    margin-bottom: 50px;
    float: left;
    margin-right: 0%;
  }





  #ranking_left {
    float: none;
    display: inline-block;
    width: 100%;
    padding-top: 30px;
  }

  #ranking_right {
    float: none;
    display: inline-block;
    width: 100%;
    padding-top: 30px;
  }



  #ranking_left #name {
    float: left;
    width: 260px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 30px;
    text-align: left;
  }


  #ranking_left #topranking {
    float: left;
    text-align: left;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 15px 10px 15px;
    border-radius: 6px;
    border: #efeff0 1px solid;
    height: 86px;
    width: 120px;
    line-height: 30px;
    font-size: 18px;
    margin-right: 30px;
    margin-bottom: 10px;
  }


  #ranking_left #total {
    float: left;
    text-align: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 15px 10px 15px;
    border-radius: 6px;
    border: #efeff0 1px solid;
    height: 86px;
    width: 100%;
    line-height: 30px;
    font-size: 18px;
    margin-bottom: 10px;
  }









}

@media screen and (max-width: 740px) {

  #indexleft {
    float: none;
    display: inline-block;
    width: 100%;
    margin-right: 0px;
    text-align: left;
  }

  #indexright {
    float: none;
    display: inline-block;
    width: 100%;
    text-align: left;
  }

  #indexleft .smallbox {
    width: 100%;
    margin-bottom: 20px;
    color: #000;
    border: #d5dde1 1px solid;
    padding-bottom: 15px;
    margin-bottom: 30px;
    float: left;
  }

  #index_report .box {
    width: 100%;
    color: #000;
    height: auto;
    padding-bottom: 15px;
    margin-bottom: 15px;
    float: left;
  }



  #case {
    width: 100%;
    float: none;
    line-height: 30px;
    display: inline-block;
    text-align: left;
  }

  #case #topbox img {
    width: 300px;
    max-width: 100%;
    height: auto;
    float: left;
    margin-right: 28px;
    border: #EFEFEF 1px solid;
    vertical-align: top;
    margin-top: 0;
  }

  #case #topbox h1 {
    line-height: 40px;
    font-size: 30px;
    font-weight: bold;
    width: 100%;
    float: left;
    margin-bottom: 10px;
    text-align: left;
    margin-top: 20px;
  }

  #case #topbox h2 {
    display: inline-block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 36px;
    font-size: 24px;
    background-color: #E7E7E7;
    width: 100%;
    float: left;
    margin-bottom: 0px;
    margin-top: 10px;
    padding: 5px 10px;
    font-weight: bold;
    text-align: left;
  }

  #case #topbox p {
    width: 100%;
    float: right;
    margin-bottom: 10px;
    line-height: 24px;
  }


  #case #topbox .price {
    color: #ff8c00;
    width: 100%;
    float: left;
    text-align: left;
    font-weight: bold;
  }

  #case .description {
    display: inline-block;
    width: 100%;
    height: 45px;
    line-height: 50px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 24px;
    background-color: #f4f5f5;
    border-bottom: #c41f1a 4px solid;
    border-top: #d5dde1 1px solid;
    border-left: #d5dde1 1px solid;
    border-right: #d5dde1 1px solid;
    clear: both;
    margin-bottom: 10px;
    font-size: 20px;
  }



  #case .unit {
    display: inline-block;
    border: #d5dde1 1px solid;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 24px 24px 24px 24px;
    width: 100%;
    clear: both;
    background-color: #f4f5f5;
    margin-bottom: 30px;
  }

  #case .unit h2 {
    line-height: 50px;
    font-size: 20px;
    font-weight: normal;
    border-bottom: #d5dde1 1px solid;
    color: #c41f1a;
    margin-bottom: 30px;
    margin-top: 0;
  }

  #case .unit h3 {
    line-height: 30px;
    font-size: 18px;
    font-weight: bold;
    color: #c41f1a;
  }


  #case .product {
    display: inline-block;
    border: #d5dde1 1px solid;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 24px 24px 24px;
    width: 100%;
    clear: both;
    background-color: #f4f5f5;
    margin-bottom: 30px;
    height: auto;
  }

  #case .product h2 {
    line-height: 50px;
    font-size: 20px;
    font-weight: normal;
    border-bottom: #d5dde1 1px solid;
    color: #c41f1a;
    margin-bottom: 20px;
  }

  #case .product .box {
    margin-right: 0px;
    width: 100%;
    float: left;
    font-size: 16px;
    line-height: 24px;
    background-color: #f4f5f5;
    height: auto;
  }

  #case .product .box img {
    display: inline-block;
    width: 100%;
    height: auto;
  }

  #case .product .box .title {
    display: inline-block;
    width: 100%;
    font-size: 18px;
    line-height: 30px;
    font-weight: bold;
  }

  #case .product .box a.buy {
    width: 100px;
    line-height: 32px;
    height: 32px;
    background-color: #333;
    color: #fff;
    display: block;
    padding: 0 10px;
    text-decoration: none;
    font-size: 15px;
    width: 115px;
    margin-top: 20px;
  }

  #case .product .box .buy img {
    width: 16px;
    height: 16px;
    margin-left: 5px;
    vertical-align: middle;
  }


  .contact_table2 td {
    width: 20%;
    font-size: 16px;
    line-height: 1.2;
  }

  #publiccontent {
    font-size: 16px;
    line-height: 26px;
    float: left;
    width: 100%;
    margin-right: 0px;
    display: inline-block;
    text-align: left;
  }

  #publiccontent h1 {
    font-size: 32px;
    font-weight: bold;
    line-height: 40px;
  }

  #publiccontent h4 {
    font-size: 22px;
    font-weight: bold;
    line-height: 60px;
    margin: 0;
  }

  #publiccontent p {
    margin-bottom: 20px;
    letter-spacing: 1.5px;
  }

  #publiccontent img {
    margin: 15px 0;
    width: 700px;
    max-width: 100%;
    height: auto;
    border: #ccc 1px solid;
  }

  /*----------app--------------*/
  .appbox2 {
    width: 100%;
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: #EEEEEE 1px solid;
    display: inline-block;
  }

  .appbox2 h2 {
    color: #c00001;
    font-weight: bold;
    font-size: 24px;
    line-height: 50px;
  }

  .appbox2 p {
    font-size: 18px;
    line-height: 30px;
    width: 100%;
    margin: 0 auto 30px auto;
  }

  .appbox2 img {
    width: 281px;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
  }

  /*----------產品右邊--------------*/

  .productbox {
    width: 100%;
    float: none;
    display: inline-block;
  }

  .productbox h2 {
    width: 100%;
    height: 40px;
    border-bottom: #d5dde1 2px solid;
    line-height: 40px;
    margin-bottom: 20px;
  }

  .productbox .title {
    line-height: 40px;
    border-bottom: #154df3 2px solid;
    padding-left: 0px;
    font-size: 20px;
    font-weight: bold;
    z-index: 999px;
    display: block;
    width: 185px;
    float: left;
  }

  .productbox .box2 {
    width: 100%;
    color: #000;
    border: #d5dde1 1px solid;
    height: 60px;
    margin-bottom: 15px;
    float: left;
    padding-left: 0px;
    background-color: #f2f2f2;
    line-height: 60px;
  }

  #edm {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    font-size: 18px;
  }


  .api_service_table {
    float: left;
    width: 100%;
  }


  #providerbottom .box {
    width: 48%;
    float: left;
    margin-right: 4%;
    margin-bottom: 28px;
    height: auto;
  }

  #providerbottom .box:nth-child(3n) {
    margin-right: 4%;
  }

  #providerbottom .box:nth-child(2n) {
    margin-right: 0%;
  }


  /*----------provide--------------*/

  .providebox {
    width: 100%;
    margin-right: 0px;
    float: left;
  }

  .providebox .box {
    width: 100%;
    color: #000;
    border: #d5dde1 1px solid;
    height: auto;
    margin-bottom: 10px;
    float: left;
  }

  .providebox .box img {
    width: 100%;
    height: auto;
  }

  .providebox .box p {
    line-height: 22px;
    clear: both;
    text-align: center;
    color: #8b8b8b;
    margin-bottom: 10px;
  }

  .providebox .box a {
    font-size: 20px;
    line-height: 32px;
    color: #000;
    font-weight: bold;
    text-decoration: none;
    display: block;
  }

  .providebox .box a:hover {
    text-decoration: underline;
  }

  .providebox h2 {
    width: 100%;
    height: auto;
    border-bottom: #d5dde1 2px solid;
    line-height: 40px;
    margin-bottom: 20px;
  }

  .providebox .title {
    line-height: 40px;
    border-bottom: #154df3 2px solid;
    padding-left: 0px;
    font-size: 20px;
    font-weight: bold;
    z-index: 999px;
    display: block;
    width: 185px;
    float: left;
  }

  .providebox .box2 {
    width: 100%;
    color: #000;
    border: #d5dde1 1px solid;
    height: auto;
    margin-bottom: 15px;
    float: left;
    padding-left: 0px;
    background-color: #f2f2f2;
    line-height: 60px;
  }

  .providebox .box2:hover {
    background-color: #cbcbcb;
  }

  .providebox .box2 a {
    font-size: 18px;
    line-height: 60px;
    color: #000;
    text-decoration: none;
  }

  .providebox .box2 a:hover {
    text-decoration: underline;
  }

  #publicbottom .smallbox {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    color: #000;
    padding-bottom: 15px;
    margin-bottom: 30px;
    margin-right: 0%;
    float: left;
    border: 0;
    text-align: left;

  }

  #publicbottom .smallbox:nth-child(3n) {
    margin-right: 0%;
  }



  #publicbottom .smallbox li .date {
    width: 100%;
    font-size: 13px;
    float: left;
    line-height: 20px;
    color: #a9a9a9;
    margin-right: 0;
    position: relative;
    text-align: left;
  }

  #publicbottom .smallbox li.h .date {
    width: 100%;
    font-size: 13px;
    float: left;
    line-height: 20px;
    color: #a9a9a9;
    margin-right: 0;
    position: relative;
    text-align: left;
  }


  #keyword {
    display: inline-block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 30px;
    background-color: #f5f5f5;
    margin-top: 50px;
  }



  #keyword .downleft {
    width: 100%;
    float: left;
    color: #30373e;
    font-size: 18px;
    margin-bottom: 40px;
  }

  #keyword .downleft p {
    float: right;
    width: 100%;
  }

  #keyword .downright {
    width: 100%;
    float: right;
    color: #30373e;
    font-size: 18px;
    text-align: right;
  }

  #keyword .downright p {
    width: 100%;
  }

  /*----------報告內頁右邊--------------*/
  .reportright {
    width: 100%;
    margin-right: 0;
    float: none !important;
    display: inline-block;
  }

  #case .box {
    width: 100%;
    margin: 0px 0% 50px 0px;
    height: auto;
    position: relative;
    background-color: #D8D8D8;
    float: left;
  }

  #case .box .date {
    font-size: 13px;
    float: left;
    line-height: 30px;
    display: block;
    z-index: 4;
    position: absolute;
    top: inherit;
    bottom: -30px;
    color: #000;
  }



  .serviceright {
    width: 100%;
    margin-right: 0;
    float: none !important;
    display: inline-block;
  }

  #service #topbox h3 {
    float: left;
    line-height: 1.4;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 0px;
    width: 100%;
    white-space: nowrap;
  }

  #service #topbox p {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    line-height: 1.4;
    text-align: left;
  }

  #servicebottom {
    width: 100%;
    clear: both;
  }

  #servicebottom .box {
    width: 45%;
    float: left;
    margin-right: 10%;
    margin-bottom: 20px;
    text-align: center;
  }

  #servicebottom .box:nth-child(3n) {
    margin-right: 10%;
  }

  #servicebottom .box:nth-child(2n) {
    margin-right: 0%;
  }


  #specialty_leftbox {
    width: 100%;
    float: none;
    margin-bottom: 40px;
    display: inline-block;
  }

  #specialty_leftbox img {
    width: 100%;
    height: auto;
  }

  #specialty_right {
    width: 100%;
    float: none;
    display: inline-block;
  }

  .specialty_rightbox {
    width: 46%;
    float: left;
    margin-bottom: 20px;
    margin-right: 8%;
  }

  .specialty_rightbox:nth-child(2n) {
    margin-right: 0%;
  }

  .specialty_rightbox img {
    width: 100%;
    height: auto;
  }



  #specialty_bottom .title {
    line-height: 40px;
    border-bottom: #c41f1a 2px solid;
    padding-left: 5px;
    font-size: 20px;
    font-weight: bold;
    z-index: 999px;
    display: block;
    width: 90px;
    float: left;
  }

  .gray {
    font-size: 12px;
    font-weight: bold;
    line-height: 36px;
    color: #a5a5a5;
  }

  #specialty_bottom .box {
    width: 100%;
    float: left;
    margin-right: 0px;
    font-weight: bold;
    margin-bottom: 30px;
  }

  #specialty_bottom .box img {
    margin-right: 2%;
    float: left;
    width: 24%;
    height: auto;
  }

  #specialty_bottom .box .right {
    width: 74%;
    float: right;
    font-size: 12px;
    line-height: 1.4;
    color: #a9a9a9;
  }

  #specialty_bottom .box .right h3 {
    font-size: 12px;
    line-height: 1.4;
    font-weight: bold;
    color: #000;
    margin-bottom: 5px;
  }

  #specialty_bottom .box .right h3 a {
    font-size: 12px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    line-height: 24px;
    display: block;
  }

  #specialty_bottom .box .right h3:hover {
    text-decoration: underline;
  }

  #specialty_bottom .box .interval {
    width: 350px;
    margin-top: 0px;
    clear: both;
    font-size: 15px;
    line-height: 20px;
    color: #a9a9a9;
    float: right;
  }

  #specialty_bottom .more {
    color: #1e5daa;
    font-size: 14px;
    text-decoration: none;
    float: right;
  }

  #specialty_bottom a.more {
    color: #1e5daa;
    font-size: 14px;
    text-decoration: none;
    font-weight: bold;
  }

  #specialty_bottom a.more:hover {
    color: #1e5daa;
    font-size: 14px;
    text-decoration: underline;
  }


  #ninereport {
    width: 100%;
    display: block;
    margin: 20px 0;
    clear: both;
  }



  .searchbarwrap {
    display: inline-block;
    width: 100%;
    position: relative;
    z-index: 1;
    margin-top: -50px;
  }

  #searchbar input.searchInput {
    width: 200px;
    height: 60px;
    background-color: #f8f8f9;
    border-radius: 5px;
    background-image: url('images/icon_search.png');
    background-position: 15px 19px;
    padding: 0px 20px 0px 40px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-repeat: no-repeat;
    border: 0;
    float: none;
    display: inline-block;
  }



  #searchbar .searchbtn {
    width: 70px;
    height: 60px;
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 12px;
    line-height: 60px;
    border-radius: 5px;
    display: inline-block;
    float: none;
    border: none;
    cursor: pointer;
  }



  #resultarea #left .box {
    float: left;
    width: 100%;
    margin-right: 0px;
    margin-bottom: 20px;
  }


  #report_topgray {
    display: inline-block;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    background: #f2f2f2 url('images/report_topgray_m.png') top left no-repeat;
    background-size: 100% 60px;
  }

  #report_topgray h5 {
    line-height: 36px;
    font-size: 26px;
    width: 100%;
    float: left;
    padding: 10px;
    text-align: left;
    margin: 0px 0 0 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #report_topgray_left {
    width: 100%;
    height: 60px;
    font-size: 22px;
    color: #fff;
    line-height: 30px;
    padding: 7px 0px 0px 0px;
    float: left;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-writing-mode: unset;
    writing-mode: unset;
    letter-spacing: 5px;
  }

  #report_topgray p {
    width: 100%;
    float: right;
    line-height: 24px;
    text-align: left;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 10px;
  }

  #case #menu {
    width: 100%;
    height: 40px;
    position: relative !important;
    text-align: left;
    background: none;
  }

  #case #menu a {
    height: 40px;
    line-height: 40px;
    background-color: #ccc;
    padding: 0 20px;
    font-size: 18px;
    font-weight: bold;
    margin-right: 8px;
    float: left;
    color: #000;
    text-decoration: none;
  }

  #case #menu a:hover {
    color: #fff;
    background-color: #c41f1a;
  }

  #case #menu a.red {
    background-color: #c41f1a;
    color: #fff;
  }




  #publicsector_left {
    display: inline-block;
    float: none;
    width: 100%;
    margin-right: 0px;
  }

  .government .databox {
    width: 230px;
    margin-bottom: 10px;
    margin-right: 0%;
    float: left;
  }


  .government .newsbox {
    width: 100%;
    color: #000;
    margin-bottom: 15px;
    float: left;
    display: inline-block;
    height: auto;
  }

  .government .newsBoxThumb {
    display: inline-block;
    width: 100%;
    height: 132px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .government .newsBoxThumb .imgThumb {
    float: left;
    width: 100%;
    height: 132px;
    border: #d5dde1 1px solid;
  }

  .government .newsbox .title2 {
    display: inline-block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 30px;
    width: 100%;
    position: relative;
  }

  .government .newsbox .title2 a {
    float: left;
    width: 100%;
    font-size: 20px;
    line-height: 28px;
    color: #000;
    font-weight: bold;
    text-decoration: none;
    text-align: left;
    float: left;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
  }


  #publicsector_right {
    display: inline-block;
    float: none;
    width: 100%;
  }












  #ranking #redmenu {
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 15px;
    border-top: #d6d6d6 1px solid;
    border-left: #d6d6d6 1px solid;
    border-right: #d6d6d6 1px solid;
    border-bottom: none;
  }

  #ranking #redmenu li {
    float: left;
    width: 33.333%;
    list-style-type: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-right: #d6d6d6 1px solid;
    border-bottom: #d6d6d6 1px solid;
  }

  #ranking #redmenu li a {
    background-color: #f6f6f6;
    font-size: 18px;
    text-align: center;
    height: 40px;
    line-height: 40px;
    width: 100%;
    color: #000;
    text-decoration: none;
    float: left;
  }

  #ranking #redmenu li:nth-child(3n) {
    border-right: none;
  }

  #ranking #redmenu li:last-child {
    border-right: none;
  }

  .top100_bar {
    float: left;
    width: 100%;
    margin-bottom: 30px;
    position: relative;
  }

  .top100_bar .bar_content {
    float: left;
    width: 100%;
    position: relative;
    z-index: 0;
    text-align: left;
  }

  .tw_100_icon {
    float: left;
    width: 120px;
    margin-right: 10px;
    margin-top: 10px;
  }

  #ranking h1 {
    font-size: 18px;
    line-height: 1.6;
    margin-top: 5px;
  }

  #ranking h2 {
    font-size: 14px;
    line-height: 1.6;
    font-weight: normal;
  }

  #weekranking {
    position: relative;
    z-index: 1;
    width: 100%;
    right: 0px;
    bottom: 0px;
    margin-top: 10px;
    text-align: right;
  }

  #weekranking .RankingBtn {
    display: inline-block;
    font-size: 16px;
    line-height: 30px;
    color: #000;
    margin-right: 30px;
    cursor: pointer;
    border-bottom: #000000 1px solid;
  }

  #weekranking .RankingBtn:last-child {
    margin-right: 0px;
  }




  #rankingform .tableStyle th {
    color: #4f4f4f;
    font-size: 12px;
    line-height: 20px;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-bottom: 15px;
    padding-top: 10px;
  }

  #rankingform .tableStyle th.td_rank {
    width: 20px;
  }

  #rankingform .tableStyle th.td_name {
    width: 60px;
  }

  #rankingform .tableStyle th.td_value {
    width: 60px;
  }

  .td_social {
    display: none;
    width: 159px;
  }


  #rankingform .num {
    float: left;
    text-align: center;
    width: 100%;
    font-size: 12px;
    margin-bottom: 0px;
    font-weight: bold;
  }

  #rankingform .tdsec {
    border-left: none !important;
    line-height: 20px !important;
    font-size: 14px !important;
    font-weight: bold;
  }

  #rankingform .tableStyle td {
    background: #FFFFFF;
    height: 56px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 5px 0px 5px;
    border-bottom: 12px solid #f0f0f0;
    border-left: 2px solid #f0f0f0;
    font-size: 12px;
  }

  #rankingform .picbg {
    border-radius: 50%;
    overflow: hidden;
    height: 56px;
    width: 56px;
    position: relative;
    display: block;
    float: left;
    margin-right: 20px;
    display: none;
  }

  #rankingform .nametitle {
    line-height: 14px;
    font-size: 14px;
    color: #696969;
    display: block;
    font-weight: normal;
  }

  .td_status_bar .valueBar {
    float: left;
    height: 26px;
    position: relative;
    text-align: left;
    line-height: 26px;
    font-size: 12px;
    color: #aaaaaa;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }





}




/*----------0607產品修改--------------*/
#product_03_0607 .service_sec .box {
  display: inline-block;
  background-color: #fafafa;
  width: 460px;
  margin: 0 20px 20px 0;
  border: #ededed 1px solid;
  border-radius: 10px;
  padding: 30px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#product_03_0607 .service_sec .box img {
  float: left;
  margin-top: 36px;
  margin-right: 20px;
}

#product_03_0607 .service_sec .box .txt {
  float: right;
  width: 280px;
}

#product_03_0607 .service_sec .box .txt h3 {
  font-size: 20px;
  font-weight: bold;
  line-height: 30px;
  margin-bottom: 6px;
}

#product_03_0607 .service_sec .box .txt p {
  font-size: 15px;
  line-height: 22px;
  text-align: justify;
}




/**產品服務2024/4 Tom**/
.service_content_page {
  float: left;
  width: 100%;
  margin-top: 30px;
  margin-bottom: 50px;
}

.service_kv {
  display: inline-flex;
  width: 100%;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.service_kv .kv_slogan {
  text-align: left;
  align-self: center;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-right: 80px;
}

.service_kv .kv_slogan h2 {
  font-size: 32px;
  line-height: 1.4;
  font-weight: bold;
  color: #000;
}


.service_kv .kv_slogan p {
  font-size: 18px;
  line-height: 1.4;
  color: #000;
  margin-top: 10px;
  font-weight: normal;
}


.service_kv .kv_img {
  flex: 0 0 322px;
}

.service_kv .kv_img img {
  width: 100%;
}

.service_feature {
  display: inline-block;
  width: 100%;
  margin-top: 80px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 50px;
}

.service_title {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 40px;
}

.service_title span {
  display: inline-block;
  vertical-align: middle;
  font-size: 30px;
  color: #000000;
  font-weight: bold;
  line-height: 1.4;
}

.service_title .icon {
  display: inline-block;
  vertical-align: middle;
  width: 48px;
  margin-right: 10px;
}

.service_des {
  display: inline-block;
  width: 100%;
  text-align: center;
  font-size: 20px;
  font-weight: normal;
  color: #000;
  line-height: 1.7;
}

.service_content {
  display: inline-block;
  width: 100%;
  text-align: center;
  position: relative;
}

.service_feature_item {
  display: inline-block;
  vertical-align: top;
  width: 260px;
  text-align: center;
  margin: 0px 20px;
}

.service_feature_item.small {
  width: 200px;
}

.service_feature_item .icon {
  display: inline-flex;
  width: 110px;
  height: 110px;
  border-radius: 55px;
  background-color: #ffffff;
  justify-content: center;
  align-items: center;
}


.service_feature_item .icon img {
  width: 60px;
  height: 60px;
}

.service_feature_item .icon2 img {
  width: 100% !important;
  height: 100% !important;
}

.service_feature_item h3 {
  display: inline-block;
  width: 100%;
  text-align: center;
  font-size: 20px;
  color: #ffffff;
  font-weight: bold;
  margin-top: 10px;
}

.service_feature_item p {
  display: inline-block;
  margin-top: 10px;
  width: 100%;
  text-align: left;
  font-size: 16px;
  line-height: 1.4;
  font-weight: normal;
  color: #ffffff;
}

.service_sec {
  display: inline-block;
  width: 100%;
  margin-top: 80px;
}

.service_table {
  display: inline-block;
  width: 100%;
  border-radius: 20px;
  border: #CBCBCB 1px solid;
}

.service_table {
  display: inline-block;
  width: 100%;
  border-radius: 20px;
  border: #CBCBCB 1px solid;
  border-spacing: 0px;
  overflow: hidden;
}

.service_table thead th {
  text-align: left;
  vertical-align: top;
  font-size: 20px;
  line-height: 1.4;
  font-weight: bold;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px;
  color: #ffffff;
}

.service_table thead th:nth-child(odd) {
  background-color: #AB211E;
}

.service_table thead th:nth-child(even) {
  background-color: #BD2421;
}

.service_table thead th:nth-child(1) {
  background-color: #CBCBCB;
  width: 200px;
}

.service_table tbody td {
  text-align: left;
  vertical-align: top;
  font-size: 20px;
  line-height: 1.4;
  font-weight: normal;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px;
  color: #000000;
}


.service_table tbody tr:nth-child(odd) {
  background-color: #EFEFEF;
}

.service_table tbody tr:nth-child(odd) td:nth-child(odd) {
  background-color: #F7F7F7;
}

.service_table tbody tr:nth-child(even) {
  background-color: #E5E5E5;
}

.service_table tbody tr:nth-child(even) td:nth-child(odd) {
  background-color: #EFEFEF;
}

.service_bot {
  display: inline-block;
  width: 270px;
  margin: 10px 20px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #FAFAFA;
  border: 1px solid #E0E0E0;
  border-radius: 10px;
  padding: 40px 30px;
  text-align: left;
}

.service_bot h3 {
  display: inline-block;
  width: 100%;
  font-size: 20px;
  font-weight: bold;
  text-align: left;
}

.service_bot h3 span {
  font-size: 60px;
  margin-right: 10px;
}

.service_bot p {
  font-size: 16px;
  font-weight: bold;
  margin-top: 10px;
  line-height: 1.4;
}

.service_report_sample {
  display: inline-block;
  width: 100%;
  margin-top: 20px;
}

.service_report_sample_txt {
  display: inline-block;
  width: 100%;
  font-size: 14px;
  font-weight: normal;
  text-align: center;
  margin-top: 0px;
}

.service_block_intro {
  display: inline-block;
  vertical-align: top;
  background: #FAFAFA;
  border: 1px solid #E0E0E0;
  border-radius: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 20px;
  margin: 20px 10px;
  width: 300px;
}

.service_block_intro:nth-child(2) {
  width: 370px;
}

.service_block_intro h3 {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 20px;
  font-size: 20px;
  color: #7B459F;
  padding-bottom: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-bottom: #7B459F 5px solid;
}

.service_block_intro .s_helf {
  float: left;
  width: 50%;
}

.service_block_intro .service_block_subtitle {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #000;
}

.service_block_intro ul {
  display: inline-block;
  text-align: left;
}

.service_block_intro ul li {
  font-size: 16px;
  font-weight: normal;
  color: #000;
}



.service_case_intro {
  display: inline-block;
  vertical-align: top;
  background: #FAFAFA;
  border: 1px solid #E0E0E0;
  border-radius: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 20px;
  margin: 20px 10px;
  width: 300px;
}

.service_case_intro .cover {
  display: inline-block;
  width: 100%;
  margin-bottom: 20px;
  padding-bottom: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-bottom: #ff4858 5px solid;
}

.service_case_intro .cover img {
  display: inline-block;
  width: 100%;
}

.service_case_intro p {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #000;
}


.service_list_wrap {
  display: inline-block;
  vertical-align: top;
  background: #FAFAFA;
  border: 1px solid #E0E0E0;
  border-radius: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 20px;
  margin: 20px 10px;
  width: 300px;
}


.service_list_wrap h3 {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 20px;
  font-size: 20px;
  padding-bottom: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}


.service_list_wrap p {
  display: inline-block;
  width: 100%;
  text-align: left;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: normal;
  color: #000;
}

.service_list_wrap p.charge {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: normal;
  color: #000;
}

.service_list_wrap p.charge span {
  font-size: 30px;
  font-weight: bold;
}

.blue_theme {
  color: #39A1FF;
  border-bottom: #39A1FF 5px solid;
}

.yellow_theme {
  color: #FFB401;
  border-bottom: #FFB401 5px solid;
}

.peach_theme {
  color: #ff4858;
  border-bottom: #ff4858 5px solid;
}


.service_flow_wrap {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  vertical-align: middle;
  background: #FAFAFA;
  border: 1px solid #E0E0E0;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* padding: 40px 20px; */
  margin: 20px 10px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
}

.service_flow_wrap .icon {
  width: 70px;
}

.service_flow_wrap h3 {
  font-size: 20px;
  color: #39A1FF;
  font-weight: bold;
  margin-top: 5px;
}

.service_flow_wrap p {
  width: 80%;
  font-size: 16px;
  font-weight: normal;
  color: #000;
  line-height: 1.4;
  margin-top: 5px;
}

.service_arrow {
  display: inline-block;
  vertical-align: middle;
  width: 44px;
}

.brand_wall_img {
  display: inline-block;
  width: 100%;
}


.s_red {
  color: #C92622 !important;
}

.s_green {
  color: #00C85E !important;
}

.s_blue {
  color: #395795 !important;
}

.s_violet {
  color: #3E55C0 !important;
}

.s_l_blue {
  color: #39A1FF !important;
}

.s_yellow {
  color: #FFB000 !important;
}

.s_peach {
  color: #ff4857 !important;
}

.s_white {
  color: #ffffff !important;
}

.s_block {
  color: #000000 !important;
}

.red_gradient {
  background: linear-gradient(180deg, #E23934 0%, #BA221F 100%);
}

.blue_gradient {
  background: linear-gradient(180deg, #5577BE 0%, #395795 100%);
}

.violet_gradient {
  background: linear-gradient(180deg, #D564C5 0%, #1D2377 100%);
}

.lblue_gradient {
  background: linear-gradient(180deg, #6FBBFF 0%, #39A1FF 100%);
}

.yellow_gradient {
  background: linear-gradient(180deg, #FFB000 0%, #FFB400 100%);
}

.peach_gradient {
  background: linear-gradient(180deg, #ff6673 0%, #ff4857 100%);
}


.mb_show_line {
  width: 100%;
  height: 1px;
  display: none;
}



.app_intro {
  display: inline-table;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  margin-top: 70px;
}

.qrcode_box {
  display: table-cell;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  border-right: #000 1px solid;
  width: 300px;
}

.qrcode_box p {
  display: inline-block;
  width: 100%;
  font-size: 18px;
  color: #000;
  text-align: center;
  margin-bottom: 20px;
}

.qrcode_box img {
  display: inline-block;
  width: 140px;
}

.app_contact {
  display: table-cell;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 40px;
  vertical-align: middle;
  text-align: center;
}

.app_contact p {
  display: inline-block;
  width: 100%;
  font-size: 26px;
  color: #000;
  font-weight: bold;
  ;
}

.app_contact a {
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 40px;
  font-size: 24px;
  color: #ffffff;
  text-decoration: none;
  background-color: #ff4857;
  border-radius: 20px;
  margin-top: 20px;
}


.data_process {
  display: inline-block;
  width: 100%;
}



.data_gray_bg {
  background-color: #f2f3f5;
  padding: 80px 20px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.data_title {
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  font-size: 26px;
  color: #44546A;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
}

.data_behavier {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-top: 20px;
}

.data_behavier img {
  display: inline-block;
  width: 320px;
  margin: 40px;
}

.data_sec {
  margin-top: 40px;
}

.data_example_item {
  display: inline-block;
  width: 100%;
  margin-top: 30px;
}

.data_example_item h3 {
  display: inline-block;
  width: 100%;
  font-size: 26px;
  width: 100%;
  color: #44546A;
}

.data_example_item p {
  display: inline-block;
  width: 100%;
  font-size: 20px;
  width: 100%;
  color: #000000;
  margin-top: 10px;
}

.ex_img_wrap {
  display: inline-flex;
  width: 100%;
  align-self: center;
  flex-direction: row;
  margin-top: 10px;
}

.ex_img_wrap img {
  max-width: 50%;
}


.ta_half {
  float: left;
  width: 50%;
}

.ta_title {
  display: inline-block;
  width: 100%;
  font-size: 26px;
  width: 100%;
  color: #44546A;
}


.ta_list {
  display: inline-block;
  width: 100%;
}


.ta_list li {
  list-style-type: decimal;
  font-size: 20px;
  color: #44546A;
  list-style-position: outside;
  margin-left: 20px;
}

.ta_img {
  display: inline-block;
  width: 100%;
}








@media screen and (max-width: 1100px) {
  .service_content_page {
    float: left;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 0px;
  }
}

@media screen and (max-width: 768px) {
  .service_kv {
    display: inline-flex;
    width: 100%;
    flex-direction: column-reverse;
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  .service_kv .kv_slogan {
    text-align: left;
    align-self: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 0px;
    padding-top: 30px;
  }



  .service_kv .kv_img {
    flex: 0 0 auto;
    text-align: center;
  }

  .service_kv .kv_img img {
    width: 80%;
  }


  .service_feature_item {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    text-align: center;
    margin: 20px 0px;
  }


  .service_feature_item.small {
    width: 100%;
  }


  .service_table thead th {
    text-align: left;
    vertical-align: top;
    font-size: 16px;
    line-height: 1.4;
    font-weight: bold;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    color: #ffffff;
  }


  .service_table tbody td {
    text-align: left;
    vertical-align: top;
    font-size: 16px;
    line-height: 1.4;
    font-weight: normal;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    color: #000000;
  }

  .service_block_intro {
    display: inline-block;
    vertical-align: top;
    background: #FAFAFA;
    border: 1px solid #E0E0E0;
    border-radius: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 20px;
    margin: 10px 0px;
    width: 100%;
  }

  .service_block_intro:nth-child(2) {
    width: 100%;
  }


  .service_case_intro {
    display: inline-block;
    vertical-align: top;
    background: #FAFAFA;
    border: 1px solid #E0E0E0;
    border-radius: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 20px;
    margin: 20px 0px;
    width: 100%;
  }


  .service_arrow {
    display: inline-block;
    vertical-align: middle;
    width: 44px;
    transform: rotate(90deg);
  }

  .mb_show_line {
    display: inline-block;
  }


  #product_03_0607 .service_sec .box {
    display: inline-block;
    background-color: #fafafa;
    width: 100%;
    margin: 10px 0px 0px 0px;
    border: #ededed 1px solid;
    border-radius: 10px;
    padding: 30px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
  }

  #product_03_0607 .service_sec .box img {
    float: none;
    display: inline-block;
    margin-top: 36px;
    margin-right: 0px;
  }

  #product_03_0607 .service_sec .box .txt {
    float: none;
    display: inline-block;
    width: 100%;
  }

  #product_03_0607 .service_sec .box .txt h3 {
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
    margin-bottom: 6px;
  }

  #product_03_0607 .service_sec .box .txt p {
    font-size: 15px;
    line-height: 22px;
    text-align: justify;
  }


  .app_intro {
    display: inline-block;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    margin-top: 70px;
  }

  .qrcode_box {
    display: inline-block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    border-right: none;
    border-bottom: #000 1px solid;
    width: 100%;
  }


  .app_contact {
    display: inline-block;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 0px;
    vertical-align: middle;
    text-align: center;
    margin-top: 30px;
  }

  .data_behavier img {
    display: inline-block;
    width: 280px;
    margin: 20px 0px;
  }

  .ex_img_wrap {
    display: inline-flex;
    width: 100%;
    align-self: center;
    flex-direction: column;
    margin-top: 10px;
  }

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


  .ta_half {
    float: left;
    width: 100%;
  }

  .ta_list {
    display: inline-block;
    width: auto;
    margin-bottom: 30px;
  }


}





/**20240403文章搜尋**/

.news_result_item {
  float: left;
  width: 100%;
  margin-bottom: 20px;
  display: flex;
  border: #000 1px solid;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px;
}

.news_result_cover {
  flex: none;
  width: 140px;
  height: 140px;
  position: relative;
  overflow: hidden;
}

.news_result_cover img {
  position: absolute;
  height: 100%;
  top: 0px;
  left: 0%;
}

.news_result_info {
  flex: auto;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 20px;
  text-align: left;
}

.news_result_info h3 {
  display: inline-block;
  width: 100%;
  color: #000;
}

.news_result_info p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  color: #000;
}

.news_result_info span {
  font-size: 14px;
  color: #a6a6a6;
}


.news_search_wrap {
  float: right;
  width: 200px;
  position: relative;
  border-radius: 5px;
  border: #000 1px solid;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 10px;
  margin-top: 10px;
}

.news_search_wrap .search_input {
  position: relative;
  width: 144px;
  height: 30px;
  border: none;
  z-index: 0;
  float: left;
}

.news_search_wrap .search_input:focus {
  outline: none;
}


.news_search_wrap .search_btn {
  float: left;
  width: 30px;
  height: 30px;
  background: none;
  border: none;
  font-size: 12px;
  line-height: 30px;
}


.news_search_wrap .search_btn img {
  width: 20px;
  height: 20px;
  margin: 5px;
}



@media screen and (max-width: 768px) {


  .news_result_item {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
  }

  .news_result_cover {
    flex: none;
    width: 100%;
    height: 200px;
    position: relative;
    overflow: hidden;
  }

  .news_result_cover img {
    position: absolute;
    width: 100%;
    height: auto;
    top: 0px;
    left: 0%;
  }

  .news_result_info {
    flex: auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 0px;
    padding-top: 20px;
    text-align: left;
  }

  .news_search_wrap {
    float: left;
    width: 200px;
    position: relative;
    border-radius: 5px;
    border: #000 1px solid;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 10px;
    margin-top: 10px;
  }


}

/* 2024 new */

.bg_gary_2024 {
  background-color: rgb(242, 243, 245);

}

.mt-30_2024 {
  margin-top: 30px;
}

.container_2024 {
  box-sizing: border-box;
  width: 100%;
  max-width: 1080px;
  padding: 80px 20px;
}

.title_2024 {
  font-size: 34px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 30px;
}

.description_2024 {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;

}

.cards1_2024 {
  margin-top: 50px;
  display: flex;
  width: 100%;
  justify-content: space-around;
  flex-wrap: wrap;
  row-gap: 60px;
}

.cards1_2024 .card_2024 {
  width: 420px;
}

.cards1_2024 .card_2024 img {
  width: 100%;
  height: 215px;
  margin-bottom: 15px;
}

.cards1_2024 .card_2024 .card_title_2024 {
  color: #0037C4;
  font-family: Inter;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 20px;

}

.cards1_2024 .card_2024 .description_2024 {
  font-family: Inter;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;

}

#exportExample {
  padding: 20px 0;
}

/* #exportExample .title_2024 {
  -webkit-text-stroke: 1.5px #3E3765;
  color: #b0d0ee;
  font-weight: 900;
} */

#exportExample .description_2024 {
  font-size: 20px;
  margin-bottom: 60px;
}

#exportExample .imgBox {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

#exportExample .imgBox img {
  display: block;
  width: 141px;
}

.wraps_2024 {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 30px;
}

.wraps_2024:nth-child(even) {
  flex-direction: row-reverse;
}

.wraps_2024:last-child {
  margin-bottom: unset;
}

.wraps_2024 .left_2024 {
  width: 100%;
  max-width: 356px;
}


.wraps_2024 .right_2024 {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-wrap: wrap;
  width: calc(100% - 356px - 60px);
}

.wraps_2024 .right_2024 .title_2024 {
  display: flex;
  align-items: center;
  text-align: left;
  margin-bottom: unset;
  font-weight: 400;
  font-size: 26px;
  color: #0037c4;
  min-height: 105px;
  background-image: url(images/cloud.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left;
  padding-left: 20px;
}

.wraps_2024 .right_2024 .description_2024 {
  margin-bottom: unset !important;
  line-height: unset;
  text-align: left;
  margin-bottom: unset;
  padding-left: 20px;
}

@media (max-width:768px) {
  .wraps_2024 {
    flex-direction: column;
    gap: 20px;
    align-items: center;
    margin-bottom: 60px;
  }

  .wraps_2024:nth-child(even) {
    flex-direction: column;
  }

  .wraps_2024 .right_2024 {
    width: 100%;
    max-width: 420px;
  }
}

#contact_2024 {
  box-sizing: border-box;
  width: 100%;
  display: flex;
}

#contact_2024 .left_2024 {
  width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 60px;
}

#contact_2024 .left_2024 .text {
  font-weight: 700;
  font-size: 42px;
  line-height: 1.4;
  text-align: center;
}

#contact_2024 .left_2024 .link {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 348px;
  height: 90px;
  background-color: #d72a2a;
  color: #fff;
  font-weight: 700;
  font-size: 42px;
  border-radius: 50px;
  text-decoration: none;
}

#contact_2024 .right_2024 {
  width: 50%;
}

@media (max-width:768px) {
  #contact_2024 {
    flex-direction: column-reverse;
    align-items: center;
    gap: 30px;
  }

  #contact_2024 .right_2024,
  #contact_2024 .left_2024 {
    width: 100%;
  }
}




/* 2025 yen*/

@font-face {
  font-family: 'Arial Bold Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Arial Bold Italic'), url('ARIALBI.woff') format('woff');
}


#indexcontent.y2025 {
  width: 100%;
  line-height: 1.4;
  font-family: "Noto Sans TC", sans-serif;
}

.y2025 * {
  box-sizing: border-box;
  text-align: left;
  padding: 0;
  margin: 0;
}

html {
  scroll-behavior: smooth;
}

.y2025 img {
  display: block;
  width: 100%;
}

.y2025 .videoBox {
  width: 100%;
  padding: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  background-color: #fff;
}

.y2025 .videoBox video {
  width: 100%;
  height: 100%;
  border-radius: 10px;
}

.y2025 .mb_20 {
  width: 100%;
  margin-bottom: 20px;
}

#indexcontent.y2025 .container {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 0 10px;
}

#indexcontent.y2025 .box {
  width: 100%;
  max-width: 1080px;
  padding: 60px 0;
}

#indexcontent.y2025 .centerBox {
  display: flex;
  justify-content: center;
}

#indexcontent.y2025 .title {
  font-size: 36px;
  font-weight: 600;
}

#indexcontent.y2025 .kv_t {
  font-size: 40px;
  font-weight: 600;
}

#indexcontent.y2025 .des {
  font-size: 16px;
  font-weight: 300;
  text-align: justify;
  color: #53585e;
}

#indexcontent.y2025 .remark {
  font-size: 13px;
}

/* section title */
#indexcontent.y2025 .sectionTitle {
  width: 100%;
  border-bottom: 1px solid rgb(226, 226, 226);
  padding-bottom: 10px;
  position: relative;
  margin-bottom: 50px;
}

#indexcontent.y2025 .sectionTitle span {
  color: rgb(188, 50, 49);
}

#indexcontent.y2025 .sectionTitle::before {
  content: '';
  background-color: rgb(188, 50, 49);
  width: 200px;
  height: 5px;
  position: absolute;
  bottom: 0;
  left: 0;
}

/* float top title */
#indexcontent.y2025 .floatTopTitle {
  display: flex;
  align-items: center;
  gap: 10px;
}

#indexcontent.y2025 .floatTopTitle .num {
  /* 不要讓 num 被壓縮 */
  flex-shrink: 0;
  position: relative;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: inline-block;
  background-color: rgb(192, 192, 192);
}

#indexcontent.y2025 .floatTopTitle .text {
  font-family: Arial Bold Italic;
  font-size: 43px;
  position: absolute;
  transform: translate(-50%, -50%);
  top: 10%;
  left: 50%;
}

#indexcontent.y2025 .floatTopTitle .txt {
  font-size: 26px;
}

#indexcontent.y2025 .floatTopTitle .txt span {
  color: #c00000;
}

@media (max-width: 1100px) {
  #indexcontent.y2025 {
    padding-left: unset;
    padding-right: unset;
  }
}

@media (max-width:480px) {
  #indexcontent.y2025 .title {
    font-size: 24px;
  }

  #indexcontent.y2025 .kv_t {
    font-size: 26px;
  }

  #indexcontent.y2025 .sectionTitle::before {
    width: 100px;
  }

  #indexcontent.y2025 .floatTopTitle .txt {
    font-size: 20px;
  }
}

/* 環境設定結束 */

/* 重複 section */
/* product3 s5 */

#indexcontent.y2025 #normalQuestion .card {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#indexcontent.y2025 #normalQuestion .card .card_l {
  width: 100%;
  max-width: 428px;
}

#indexcontent.y2025 #normalQuestion .lists {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#indexcontent.y2025 #normalQuestion .lists .list {
  border: 1px solid rgb(228, 229, 231);
  padding: 10px 20px;
  width: 100%;
  max-width: 540px;
  cursor: pointer;
}

#indexcontent.y2025 #normalQuestion .lists .list .list_t {
  font-size: 16px;
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: .5s;
  border-bottom: 1px solid rgba(228, 229, 231, 0);
}

#indexcontent.y2025 #normalQuestion .lists .list .list_t .plus {
  width: 15px;
  height: 15px;
  position: relative;
}

#indexcontent.y2025 #normalQuestion .lists .list .list_t .plus::after,
#indexcontent.y2025 #normalQuestion .lists .list .list_t .plus::before {
  content: '';
  width: 100%;
  height: 4px;
  background-color: #000;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform-origin: center;
  transition: .5s;
}

#indexcontent.y2025 #normalQuestion .lists .list .list_t .plus::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

#indexcontent.y2025 #normalQuestion .lists .list.active .list_t .plus::after {
  transform: translate(-50%, -50%) rotate(0deg);

}

#indexcontent.y2025 #normalQuestion .lists .list.active .list_t {
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(228, 229, 231, 1);
}

#indexcontent.y2025 #normalQuestion .lists .list .list_des {
  overflow: hidden;
  max-height: 0;
  transition: 1s;
}

#indexcontent.y2025 #normalQuestion .lists .list.active .list_des {
  max-height: 150px;
}

@media (max-width:1002px) {
  #indexcontent.y2025 #normalQuestion .card {
    justify-content: center;
    gap: 60px;
  }
}

#indexcontent.y2025 #productServe {
  background-image: url(images/y2025/product3_s6_bg.png);
  background-size: cover;
  background-position: center;
}

#indexcontent.y2025 #productServe .title {
  color: #fff;
}

#indexcontent.y2025 #productServe .cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
}

#indexcontent.y2025 #productServe .cards .card {
  max-width: 320px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  background-color: #fff;
  text-decoration: none;
}

#indexcontent.y2025 #productServe .cards .card .icon {
  width: 95px;
}

#indexcontent.y2025 #productServe .cards .card .card_t {
  font-size: 20px;
  font-weight: 600;
  color: #4e4f50;
}

/* product3 s7 */
#indexcontent.y2025 #newArticle .cards {
  padding: 40px 0 60px;
}

#indexcontent.y2025 #newArticle .card {
  max-width: 250px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

#indexcontent.y2025 #newArticle .card .text {
  padding: 20px;
}

#indexcontent.y2025 #newArticle .card .card_t {
  margin-bottom: 20px;
  color: #4e4f50;
}

#indexcontent.y2025 #newArticle .card .remark {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#indexcontent.y2025 #newArticle .card .remark .label {
  padding: 10px;
  line-height: 1;
  color: #fff;

}

#indexcontent.y2025 #newArticle .card .remark .time {
  font-size: 14px;
  color: #828282;
  line-height: 1;

}

#indexcontent.y2025 #newArticle .card:nth-child(odd) .remark .label {
  background-color: #ea5b5b;
}

#indexcontent.y2025 #newArticle .card:nth-child(even) .remark .label {
  background-color: #63aa75;
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  text-align: center;
}

/* 被選中的 pagination 點點 */
.swiper-pagination-bullet-active {
  width: 14px;
  height: 14px;
  background: rgb(218, 63, 63);
  /* 紅色 */
}

#indexcontent.y2025 #contact {
  margin: unset;
}

#indexcontent.y2025 #contact .box {
  padding-top: unset;
}

/* 頁面設定 */

/* product3 kv */
#product3_2025 #kv {
  width: 100%;
  background-size: cover;
  background-position: center right;
  background-image: url(images/y2025/product3_kv.png);
}

#product3_2025 #kv .textBox {
  max-width: 520px;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  text-shadow: 0 0 5px #000;
}

#product3_2025 #kv .textBox .remark {
  font-size: 21px;
  text-align: center;
}

#product3_2025 #kv .textBox .des {
  font-size: 16px;
  color: #fff;
}

#product3_2025 #kv .textBox .link {
  width: 147px;
  height: 43px;
  border-radius: 8px;
  border: 1px solid #fff;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

/* product3 s1 */
#product3_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#product3_2025 #s1 .card {
  display: flex;
}

#product3_2025 #s1 .card .card_l,
#product3_2025 #s1 .card .card_r {
  width: 50%;
}

#product3_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#product3_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

@media (max-width:768px) {
  #product3_2025 #s1 .card {
    flex-direction: column-reverse;
  }

  #product3_2025 #s1 .card .card_l,
  #product3_2025 #s1 .card .card_r {
    width: 100%;
  }

  #product3_2025 #s1 .card .card_l {
    padding-top: 60px;
    padding-right: unset;
  }
}

/* product3 s2 */
#product3_2025 #s2 {
  background-color: rgb(247, 247, 247);
}

#product3_2025 #s2 .mainDes {
  margin-bottom: 60px;
}

#product3_2025 #s2 .imgBox {
  padding: 0 20px;
  width: 100%;
}

#product3_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 20px;
  justify-content: space-between;
}

#product3_2025 #s2 .cards .card {
  width: 100%;
  max-width: 330px;
}

#product3_2025 #s2 .cards .card .card_t {
  color: #1a1a1a;
  font-size: 20px;
  margin-bottom: 10px;
  position: relative;
  padding-left: 10px;
  font-weight: 700;
  border-left: 1px solid rgb(198, 86, 78);
}

#product3_2025 #s2 .cards .card .des {
  padding-left: 10px;
}

@media (max-width: 1064px) {
  #product3_2025 #s2 .cards {
    justify-content: flex-start;
  }
}

@media (max-width: 714px) {
  #product3_2025 #s2 .cards {
    padding-top: 30px;
    justify-content: center;
  }
}

/* product3 s3 */

#product3_2025 #s3 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

#product3_2025 #s3 .cards .card {
  width: 252px;

}

#product3_2025 #s3 .cards .card .des {
  position: relative;
  padding: 35px 24px 24px;
  border-radius: 0 0 8px 8px;
  border: 1px solid rgb(226, 226, 226);
  border-top: unset;
  min-height: 157px;
}

#product3_2025 #s3 .cards .card .des .label {
  position: absolute;
  top: 0;
  left: -1px;
  transform: translateY(-50%);
  width: 142px;
  height: 41px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  background-color: rgb(164, 1, 0);
}

@media (max-width:838px) {
  #product3_2025 #s3 .cards {
    justify-content: center;
  }
}

/* product3 s4 */

#product3_2025 #s4 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;
}

#product3_2025 #s4 .card {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 60px;
}

#product3_2025 #s4 .card .des {
  text-align: center;
  max-width: 908px;
}

#product3_2025 #s4 .link {
  width: 200px;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  border-radius: 12px;
  background-color: rgb(164, 1, 0);
  color: #fff;
  font-size: 18px;

}











/* product2 */

/* product2 kv */
#product2_2025 #kv {
  width: 100%;
  background-size: cover;
  background-position: center right;
  background-image: url(images/y2025/product2_kv.png);
}

#product2_2025 #kv .textBox {
  max-width: 600px;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  text-shadow: 0 0 5px #000;
}

#product2_2025 #kv .textBox .remark {
  font-size: 21px;
  text-align: center;
}

#product2_2025 #kv .textBox .des {
  font-size: 16px;
  color: #fff;
}

#product2_2025 #kv .textBox .link {
  width: 147px;
  height: 43px;
  border-radius: 8px;
  border: 1px solid #fff;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}


/* product2 s1 */

#product2_2025 #s1 .mainDes {
  margin-bottom: 30px;
}

#product2_2025 #s1 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 33px;
}

#product2_2025 #s1 .cards .card {
  width: 338px;
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
  border-radius: 8px;
}

#product2_2025 #s1 .cards .card .des {
  position: relative;
  padding: 50px 24px;
  border-radius: 0 0 8px 8px;
  border: 1px solid rgb(226, 226, 226);
  border-top: unset;
  min-height: 204px;
  line-height: 1.6;
}

#product2_2025 #s1 .cards .card .des span {
  color: #dc2a0b;
}

#product2_2025 #s1 .cards .card .des .huge {
  font-size: 20px;
  text-align: center;
  font-weight: 700;
}

#product2_2025 #s1 .cards .card .des .label {
  position: absolute;
  top: 0;
  left: 20px;
  transform: translateY(-50%);
  width: 60px;
}

@media (max-width:838px) {
  #product2_2025 #s1 .cards {
    justify-content: center;
  }
}

/* product2 s2 */
#product2_2025 #s2 {
  background-color: #b31705;
}

#product2_2025 #s2 .sectionTitle {
  color: #fff;
}

#product2_2025 #s2 .sectionTitle::before {
  background-color: #000;
}

#product2_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 60px;
  justify-content: center;
}

#product2_2025 #s2 .cards .card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 225px;
}

#product2_2025 #s2 .cards .card .iconBox {
  display: flex;
  justify-content: center;
}

#product2_2025 #s2 .cards .card .icon {
  height: 59px;
}

#product2_2025 #s2 .cards .card .card_t {
  text-align: center;
  font-size: 20px;
  color: #e9e75e;
}

#product2_2025 #s2 .cards .card .card_t span {
  display: block;
  color: #fff;
  font-size: 18px;
  text-align: center;
  height: 50px;
}

#product2_2025 #s2 .cards .card .des {
  color: #fff;
  text-align: center;
}

#product2_2025 #s2 .cards .card .des span {
  font-weight: 700;
}

/* product2 s3 */
#product2_2025 #s3 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;
}

#product2_2025 #s3 .card {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 60px;
}

#product2_2025 #s3 .card .des {
  text-align: center;
  max-width: 908px;
}









/* product4 */
#product4_2025 .centerBox {
  margin-top: 30px;
}

#product4_2025 .centerBox .link {
  width: 200px;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  border-radius: 12px;
  background-color: rgb(164, 1, 0);
  color: #fff;
  font-size: 18px;
}


/* product4 kv */
#product4_2025 #kv {
  width: 100%;
  background-size: cover;
  background-position: center right;
  background-image: url(images/y2025/product4_kv.png);
}

#product4_2025 #kv .textBox {
  max-width: 460px;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  text-shadow: 0 0 5px #000;
}

#product4_2025 #kv .textBox .remark {
  font-size: 21px;
  text-align: center;
}

#product4_2025 #kv .textBox .des {
  font-size: 16px;
  color: #fff;
  line-height: 1.6;
}

#product4_2025 #kv .textBox .link {
  width: 147px;
  height: 43px;
  border-radius: 8px;
  border: 1px solid #fff;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

/* product4 s1 */
#product4_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#product4_2025 #s1 .card {
  display: flex;
}

#product4_2025 #s1 .card .card_l,
#product4_2025 #s1 .card .card_r {
  width: 50%;
}

#product4_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#product4_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

@media (max-width:768px) {
  #product4_2025 #s1 .card {
    flex-direction: column-reverse;
  }

  #product4_2025 #s1 .card .card_l,
  #product4_2025 #s1 .card .card_r {
    width: 100%;
  }

  #product4_2025 #s1 .card .card_l {
    padding-top: 60px;
    padding-right: unset;
  }
}

/* product4 s2 */
#product4_2025 #s2 {
  background-color: #b31705;
}

#product4_2025 #s2 .sectionTitle {
  color: #fff;
}

#product4_2025 #s2 .sectionTitle::before {
  background-color: #000;
}

#product4_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

#product4_2025 #s2 .cards .card {
  width: 340px;
  border-radius: 8px;
}

#product4_2025 #s2 .cards .card .des {
  position: relative;
  padding: 40px 20px 20px;
  border-radius: 0 0 8px 8px;
  border: 1px solid rgb(226, 226, 226);
  border-top: unset;
  min-height: 260px;
  line-height: 1.6;
  background-color: #fff;
}

#product4_2025 #s2 .cards .card .card_t {
  font-size: 20px;
  color: #4e4f50;
  font-weight: 700;
  text-align: center;
  margin-bottom: 10px;
}

#product4_2025 #s2 .cards .card .des span {
  color: #dc2a0b;
}

#product4_2025 #s2 .cards .card .des .huge {
  font-size: 20px;
  text-align: center;
  font-weight: 700;
}

#product4_2025 #s2 .cards .card .des .label {
  position: absolute;
  top: 0;
  left: 20px;
  transform: translateY(-50%);
  width: 60px;
}

@media (max-width:838px) {
  #product4_2025 #s2 .cards {
    justify-content: center;
  }
}

/* product4 s3 */
#product4_2025 #s3 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;
}

#product4_2025 #s3 .btns {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 60px;
  margin-top: 50px;
}

#product4_2025 #s3 .btns .btn {
  width: 120px;
  text-decoration: none;
  height: 50px;
  border-radius: 50px;
  background-color: #6c7179;
  color: #fff;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#product4_2025 #s3 .btns .btn.active {
  background-color: #db2e2e;
}

#product4_2025 #s3 .pages {
  display: flex;
  align-items: center;
  flex-direction: column;
}

#product4_2025 #s3 .pages .page {
  width: 100%;
  max-width: 780px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
  background-color: #fff;
  border-radius: 15px;
  padding: 50px;
  position: relative;
  overflow: hidden;
  display: none;
}

#product4_2025 #s3 .pages .page.active {
  display: block;
}

#product4_2025 #s3 .pages .page::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #db2e2e;
}

#product4_2025 #s3 .pages .page .page_t {
  font-size: 20px;
  color: #4e4f50;
  font-weight: 500;
  margin-bottom: 60px;
}

#product4_2025 #s3 .pages .page .list {
  border-radius: 5px;
  background-color: #eee;
  margin-bottom: 20px;
  padding: 30px;
}

#product4_2025 #s3 .pages .page .list:last-child {
  margin-bottom: unset;
}

#product4_2025 #s3 .pages .page .list .list_t {
  color: #db2e2e;
  padding-left: 10px;
  font-weight: 600;
  border-left: 3px solid #db2e2e;
  font-size: 18px;
  margin-bottom: 5px;
}

#product4_2025 #s3 .pages .page .list .des span {
  font-weight: 500;
  color: #db2e2e;
}

@media (max-width:480px) {
  #product4_2025 #s3 .btns .btn {
    width: 100px;
    height: 45px;
    font-size: 18px;
  }
}





/* product three type kv */
#productThreeTypeKv {
  width: 100%;
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center left;
  background-image: url(images/y2025/productRoutine_kv.png);
  min-height: 390px;
}

#productThreeTypeKv .bg_circle {
  position: absolute;
  width: 600px;
  height: 600px;
  border: 1px solid #fff;
  transform: translateY(-50%);
  top: 0;
  left: -2%;
  border-radius: 50%;
  display: none;
}

#productThreeTypeKv .textBox {
  max-width: 460px;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  text-shadow: 0 0 5px #000;
  position: relative;
  z-index: 2;
}

#productThreeTypeKv .links {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
}

#productThreeTypeKv .link {
  width: 100px;
  position: absolute;
  transform: translate(-50%, -50%);
  height: 100px;
  border-radius: 50%;
  border: 1px solid #fff;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  background-color: #21415e;
  text-shadow: 0 0 0 #fff;
}

#productThreeTypeKv .link.active {
  background-color: #db2e2e;
}

@media (max-width:600px) {
  #productThreeTypeKv .link {
    width: 70px;
    height: 70px;
    font-size: 14px;
    text-align: center;
  }
}

/* product routine */


/* product routine s1 */
#productRoutine_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#productRoutine_2025 #s1 .card {
  display: flex;
}

#productRoutine_2025 #s1 .card .card_l,
#productRoutine_2025 #s1 .card .card_r {
  width: 50%;
}

#productRoutine_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#productRoutine_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

@media (max-width:768px) {
  #productRoutine_2025 #s1 .card {
    flex-direction: column-reverse;
  }

  #productRoutine_2025 #s1 .card .card_l,
  #productRoutine_2025 #s1 .card .card_r {
    width: 100%;
  }

  #productRoutine_2025 #s1 .card .card_l {
    padding-top: 60px;
    padding-right: unset;
  }
}


/* product routine s2 */
#productRoutine_2025 #s2 {
  background-color: #f7f7f7;
}

#productRoutine_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 50px;
}

#productRoutine_2025 #s2 .cards .card {
  display: flex;
  width: 100%;
  background-color: #fff;
  max-width: 514px;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

#productRoutine_2025 #s2 .cards .card .card_l {
  width: 22%;
}

#productRoutine_2025 #s2 .cards .card .card_l img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#productRoutine_2025 #s2 .cards .card .card_r {
  width: 78%;
  padding: 20px;
}

#productRoutine_2025 #s2 .cards .card .card_t {
  color: #53585e;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}

#productRoutine_2025 #s2 .cards .card .des {
  letter-spacing: 2px;
}

@media (max-width:480px) {
  #productRoutine_2025 #s2 .cards .card .card_l {
    width: 150px;
  }

  #productRoutine_2025 #s2 .cards .card .card_r {
    width: calc(100% - 150px);
  }
}

/* product routine s3 */
#productRoutine_2025 #s3 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;
}

#productRoutine_2025 #s3 .cards {
  margin-bottom: 50px;
}

#productRoutine_2025 #s3 .cards .card {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

#productRoutine_2025 #s3 .cards .card:nth-child(even) {
  flex-direction: row-reverse;
}

#productRoutine_2025 #s3 .cards .card .card_l {
  width: 48%;
  padding: 50px 10px 20px;
}

#productRoutine_2025 #s3 .cards .card .card_l .floatTopTitle {
  margin-bottom: 30px;
}

#productRoutine_2025 #s3 .cards .card .card_l .des {
  padding-left: 40px;
}

#productRoutine_2025 #s3 .cards .card .card_r {
  width: 48%;
}

#productRoutine_2025 #s3 .cards .card:nth-child(2) .card_r {
  transform: translateY(-50px);
}

#productRoutine_2025 #s3 .cards .card:nth-child(3) .card_r {
  transform: translateY(-90px);
}

#productRoutine_2025 #s3 .cards .card:nth-child(4) .card_r {
  position: relative;
}

#productRoutine_2025 #s3 .cards .card:nth-child(4) .card_r img {
  position: absolute;
  top: -150px;
}

#productRoutine_2025 #s3 .remark {
  display: flex;
}

#productRoutine_2025 #s3 .remark .remark_l {
  width: calc(100% - 200px);
  padding-right: 30px;
  color: #000;
}

#productRoutine_2025 #s3 .remark .remark_r {
  width: 200px;
}

#productRoutine_2025 #s3 .remark .remark_r .btn {
  width: 100%;
  height: 50px;
  font-size: 18px;
  color: #fff;
  background-color: #c00000;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  border-radius: 8px;
}

@media (max-width:1023px) {
  #productRoutine_2025 #s3 .cards .card:nth-child(4) .card_r img {
    top: -100px;
  }
}

@media (max-width:812px) {
  #productRoutine_2025 #s3 .cards .card:nth-child(3) .card_r {
    transform: translateY(-40px);
  }

  #productRoutine_2025 #s3 .cards .card:nth-child(4) .card_r img {
    top: -50px;
  }
}

@media (max-width:768px) {

  #productRoutine_2025 #s3 .cards .card .card_l,
  #productRoutine_2025 #s3 .cards .card .card_r {
    width: 100%;
  }

  #productRoutine_2025 #s3 .cards .card:nth-child(2) .card_r {
    transform: translateY(0);
  }

  #productRoutine_2025 #s3 .cards .card:nth-child(3) .card_r {
    transform: translateY(0);
  }

  #productRoutine_2025 #s3 .cards .card:nth-child(4) .card_r img {
    position: unset;
    top: unset;
  }
}

@media (max-width:480px) {
  #productRoutine_2025 #s3 .remark .remark_l {
    width: 100%;
    max-width: 350px;
    padding-right: unset;
  }

  #productRoutine_2025 #s3 .remark {
    flex-direction: column;
    align-items: center;
    gap: 30px;
  }
}




/* product theme */

/* product theme s1 */
#productTheme_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#productTheme_2025 #s1 .card {
  display: flex;
  margin-bottom: 60px;
}

#productTheme_2025 #s1 .card .card_l,
#productTheme_2025 #s1 .card .card_r {
  width: 50%;
}

#productTheme_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#productTheme_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

#productTheme_2025 #s1 .imgBox {

  width: 100%;
}

#productTheme_2025 #s1 .lists {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  column-gap: 60px;
  row-gap: 20px;
  justify-content: center;
}

#productTheme_2025 #s1 .lists .list {
  width: 100%;
  max-width: 180px;
}

#productTheme_2025 #s1 .lists .list .list_t {
  color: #1a1a1a;
  font-size: 20px;
  margin-bottom: 10px;
  position: relative;
  padding-left: 10px;
  font-weight: 700;
  border-left: 1px solid rgb(198, 86, 78);
}

#productTheme_2025 #s1 .lists .list .des {
  padding-left: 10px;
}


@media (max-width:768px) {
  #productTheme_2025 #s1 .card {
    flex-direction: column-reverse;
  }

  #productTheme_2025 #s1 .card .card_l,
  #productTheme_2025 #s1 .card .card_r {
    width: 100%;
  }

  #productTheme_2025 #s1 .card .card_l {
    padding-top: 60px;
    padding-right: unset;
  }
}





@media (max-width: 714px) {
  #productTheme_2025 #s1 .lists {
    padding-top: 30px;
    justify-content: center;
  }
}

/* product theme s2 */

#productTheme_2025 #s2 {
  background-color: #f7f7f7;
}

#productTheme_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 50px;
}

#productTheme_2025 #s2 .cards .card {
  display: flex;
  width: 100%;
  background-color: #fff;
  max-width: 514px;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.12) 0px 2px 16px 0px;
  padding: 30px;
  align-items: center;
  border-radius: 0 12px 12px 0;
  border-left: 2px solid #c00000;
}

#productTheme_2025 #s2 .cards .card .card_l {
  width: 95px;
}

#productTheme_2025 #s2 .cards .card .card_l img {
  width: 100%;
}

#productTheme_2025 #s2 .cards .card .card_r {
  width: calc(100% - 95px);
  padding-left: 30px;
}

#productTheme_2025 #s2 .cards .card .card_t {
  color: #53585e;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}

#productTheme_2025 #s2 .cards .card .des {
  letter-spacing: 2px;
}

@media (max-width:480px) {
  #productTheme_2025 #s2 .cards .card .card_l {
    width: 50px;
  }

  #productTheme_2025 #s2 .cards .card .card_r {
    width: calc(100% - 50px);
    padding-left: 20px;
  }
}

/* product theme s3 */
#productTheme_2025 #s3 {
  background-color: #d3d3d3;
}

#productTheme_2025 #s3 .des {
  margin-bottom: 30px;
}

#productTheme_2025 #s3 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

#productTheme_2025 #s3 .cards .card {
  border-radius: 12px;
  width: 300px;

}

#productTheme_2025 #s3 .cards .card:nth-child(2) {
  border-radius: 12px;
  width: 400px;
}

#productTheme_2025 #s3 .cards .card .imgBox {
  position: relative;
}

#productTheme_2025 #s3 .cards .card .imgBox img {
  object-fit: cover;
  height: 180px;
  border-radius: 12px 12px 0 0;
}

#productTheme_2025 #s3 .cards .card .imgBox div {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}

#productTheme_2025 #s3 .cards .card .textBox {
  padding: 30px;
  background-color: #fff;
  border-radius: 0 0 12px 12px;
  min-height: 205px;
}

#productTheme_2025 #s3 .cards .card .lists {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
}

#productTheme_2025 #s3 .cards .card .textBox .card_t {
  color: #53585e;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}

@media (max-width:405px) {

  #productTheme_2025 #s3 .cards .card,
  #productTheme_2025 #s3 .cards .card:nth-child(2) {
    width: 100%;
  }

}

/* product theme s4 */
#productTheme_2025 #s4 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;
}

#productTheme_2025 #s4 .des {
  padding-left: 40px;
}

#productTheme_2025 #s4 .card {
  margin-bottom: 50px;
}

#productTheme_2025 #s4 .flexBox {
  padding-left: 60px;
  display: flex;
  column-gap: 10px;
  row-gap: 30px;
  flex-wrap: wrap;
}

#productTheme_2025 #s4 .flexBox .w50 {
  width: calc(50% - 5px);
}

#productTheme_2025 #s4 .btnContainer {
  width: 100%;
  display: flex;
  justify-content: center;
}

#productTheme_2025 #s4 .btnContainer .btn {
  width: 200px;
  height: 55px;
  background-color: #c00000;
  color: #fff;
  text-decoration: none;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* product esg */

/* product esg s1 */
#productESG_2025 #s1 .cards {
  margin-top: 60px;
  display: flex;
  flex-wrap: wrap;
  row-gap: 20px;
  justify-content: center;
}

#productESG_2025 #s1 .cards .card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 0 20px;
  border-right: 1px solid #d3d3d3;
  width: 224px;
}

#productESG_2025 #s1 .cards .card:first-child {
  padding-left: 0;
  width: calc(224px - 20px);
}

#productESG_2025 #s1 .cards .card:last-child {
  padding-right: 0;
  width: calc(224px - 20px);
  border-right: unset;
}

#productESG_2025 #s1 .cards .card .card_t {
  color: #db2e2e;
  font-weight: 600;
  font-size: 20px;
}

#productESG_2025 #s1 .cards .card img {
  height: 60px;
  width: unset;
}

@media (max-width:1114px) {

  #productESG_2025 #s1 .cards .card:nth-child(4) {
    padding-right: 0;
    width: calc(224px - 20px);
    border-right: unset;
  }

  #productESG_2025 #s1 .cards .card:first-child {
    padding: 0 20px;
    width: 224px;
  }
}

@media (max-width:768px) {
  #productESG_2025 #s1 .cards .card:nth-child(3) {
    padding-right: 0;
    width: calc(224px - 20px);
    border-right: unset;
  }

  #productESG_2025 #s1 .cards .card:nth-child(4) {
    padding: 0 20px 0 0;
    width: calc(224px - 20px);
    border-right: 1px solid #d3d3d3;
  }

}

@media (max-width:480px) {
  #productESG_2025 #s1 .cards {
    gap: unset;
  }

  #productESG_2025 #s1 .cards .card:first-child,
  #productESG_2025 #s1 .cards .card:nth-child(2),
  #productESG_2025 #s1 .cards .card:nth-child(3),
  #productESG_2025 #s1 .cards .card:nth-child(4),
  #productESG_2025 #s1 .cards .card:last-child {
    padding: 20px 0;
    width: 224px;
    border-right: unset;
    border-bottom: 1px solid #d3d3d3;
  }

  #productESG_2025 #s1 .cards .card:last-child {
    border-bottom: unset;
  }

  #productTheme_2025 #s4 .flexBox {
    padding-left: 30px;
  }

  #productTheme_2025 #s4 .flexBox .w50 {
    width: 100%;
  }
}

/* product esg s2 */
#productESG_2025 #s2 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;
}

#productESG_2025 #s2 .timeLine {
  padding: 0 40px;
}

#productESG_2025 #s2 .cards {
  display: flex;
  margin-top: 60px;
  align-items: flex-start;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

#productESG_2025 #s2 .cards .card {
  width: 320px;
  border-radius: 15px;
  border-top: 1px solid #c00000;
  padding: 20px;
  background-color: #fff;
  display: block;
  text-decoration: none;
}

#productESG_2025 #s2 .cards .card.min_h {
  min-height: 290px;
}

#productESG_2025 #s2 .cards a:hover {
  background-color: #f8dcdc;

}

#productESG_2025 #s2 .cards .card.active {
  /* background-color: #f8dcdc; */
}

#productESG_2025 #s2 .cards .card .card_t {
  color: #db2e2e;
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: 600;
}

#productESG_2025 #s2 .cards .card .btnBox {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}

#productESG_2025 #s2 .cards .card .btnBox .btn {
  width: 27px;
}

#productESG_2025 #s2 .lists {
  display: flex;
  align-items: center;
  gap: 50px;
  flex-direction: column;
  margin-top: 60px;
}

#productESG_2025 #s2 .lists .list {
  max-width: 920px;
  background-color: #fff;
}

#productESG_2025 #s2 .lists .list .listContent {
  padding: 30px;
}

#productESG_2025 #s2 .listContent .list_card {
  display: flex;
  margin-bottom: 30px;
}

#productESG_2025 #s2 .listContent .list_card .picture {
  width: 300px;
}

#productESG_2025 #s2 .listContent .list_card .des {
  width: calc(100% - 300px);
  padding: 20px;
}

#productESG_2025 #s2 .listContent .motivation {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #f7f7f7;
}

#productESG_2025 #s2 .listContent .list_t {
  font-size: 20px;
  font-weight: 600;
  color: #dc2a0b;
  margin-bottom: 20px;
}

#productESG_2025 #s2 .listContent .des span {
  font-weight: 600;
}

#productESG_2025 #s2 .listContent .flexBox {
  display: flex;
}

#productESG_2025 #s2 .listContent .flexBox span {
  flex-shrink: 0;
}

#productESG_2025 #s2 .listContent .helper {
  margin-bottom: 20px;
}

#productESG_2025 #s2 .listContent .btnContainer {
  display: flex;
  justify-content: center;
}

#productESG_2025 #s2 .listContent .btnContainer .btn {
  width: 160px;
  height: 55px;
  font-size: 18px;
  background-color: #b8b8b8;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  color: #fff;
}

@media (max-width:767px) {
  #productESG_2025 #s2 .listContent .list_card {
    flex-direction: column;
  }

  #productESG_2025 #s2 .listContent .list_card .picture,
  #productESG_2025 #s2 .listContent .list_card .des {
    width: 100%;
  }

  #productESG_2025 #s2 .listContent .list_card .des {
    padding: unset;
    padding-top: 20px;
  }
}


@media (max-width:480px) {
  #productESG_2025 #s2 .cards .card.min_h {
    min-height: unset;
  }

  #productESG_2025 #s2 .listContent .flexBox {
    flex-direction: column;
  }
}







/* resolve */

/* resolve kv */

#resolveKv {
  width: 100%;
  background-size: cover;
  background-position: center right;
  background-image: url(images/y2025/resolveFame_kv.png);
  height: 300px;
}

#resolveKv .textBox {
  max-width: 600px;
  color: #fff;
  text-shadow: 0 0 5px #000;
  height: 100%;
  display: flex;
  align-items: flex-end;
}

#resolveKv .textBox .kv_t {
  font-size: 50px;
  font-weight: 700;
  display: flex;
  align-items: flex-end;
  gap: 10px;

}

#resolveKv .textBox .kv_t span {
  font-size: 40px;
  font-weight: 400;
}

@media (max-width:480px) {
  #resolveKv .textBox .kv_t {
    font-size: 40px;
  }

  #resolveKv .textBox .kv_t span {
    font-size: 30px;
  }
}

/* resolve fame */

/* resolve fame s1 */
#resolveFame_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#resolveFame_2025 #s1 .card {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

#resolveFame_2025 #s1 .card:nth-child(2) {
  flex-direction: row-reverse;
  margin-bottom: unset;
}

#resolveFame_2025 #s1 .card .card_l,
#resolveFame_2025 #s1 .card .card_r {
  width: 50%;
}

#resolveFame_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#resolveFame_2025 #s1 .card:nth-child(2) .card_l {
  padding-right: unset;
  padding-left: 60px;
}

#resolveFame_2025 #s1 .card .card_t {
  font-size: 20px;
  color: #db2e2e;
  font-weight: 600;
  margin-bottom: 20px;
}

#resolveFame_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

@media (max-width:768px) {

  #resolveFame_2025 #s1 .card,
  #resolveFame_2025 #s1 .card:nth-child(2) {
    flex-direction: column-reverse;
  }

  #resolveFame_2025 #s1 .card .card_l,
  #resolveFame_2025 #s1 .card .card_r {
    width: 100%;
  }

  #resolveFame_2025 #s1 .card .card_l,
  #resolveFame_2025 #s1 .card:nth-child(2) .card_l {
    padding: unset;
    padding-top: 20px;
  }
}

/* resolve fame s2 */
#resolveFame_2025 #s2 {
  background-color: #b31705;
}

#resolveFame_2025 #s2 .box {
  padding-bottom: 20px;
}

#resolveFame_2025 #s2 .sectionTitle {
  color: #fff;
}

#resolveFame_2025 #s2 .sectionTitle::before {
  background-color: #000;
}

#resolveFame_2025 #s2 .cards {
  display: flex;
  gap: 20px;
}

#resolveFame_2025 #s2 .cards .card {
  width: calc((100% - 40px) / 3);
  position: relative;
}

#resolveFame_2025 #s2 .cards .card .des {
  position: absolute;
  bottom: -60px;
  left: 0;
  width: 95%;
  padding: 25px;
  border-radius: 12px;
  background-color: #fff;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

@media (max-width:768px) {
  #resolveFame_2025 #s2 .cards {
    flex-direction: column;
    align-items: center;
  }

  #resolveFame_2025 #s2 .cards .card {
    width: 340px;

  }

  #resolveFame_2025 #s2 .cards .card .des {
    position: relative;
    bottom: unset;
    top: -50px;
  }
}

/* resolve fame s3 */
#resolveFame_2025 #s3 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;

}

#resolveFame_2025 #s3 .box {
  padding-top: 100px;
}

#resolveFame_2025 #s3 .box .card {
  display: flex;
  position: relative;
  min-height: 750px;
  gap: 20px;
}

#resolveFame_2025 #s3 .box .card .lists .list {
  width: 312px;
}

#resolveFame_2025 #s3 .box .card .lists .list.p_cb,
#resolveFame_2025 #s3 .box .card .lists .list.p_rb,
#resolveFame_2025 #s3 .box .card .lists .list.p_rc {
  position: absolute;
}

#resolveFame_2025 #s3 .box .card .lists .list.p_rc {
  top: 10%;
  right: 0;
}

#resolveFame_2025 #s3 .box .card .lists .list.p_cb {
  left: 30%;
  bottom: 15%;
}

#resolveFame_2025 #s3 .box .card .lists .list.p_rb {
  right: 0;
  bottom: 0;
}


#resolveFame_2025 #s3 .box .card .lists .list .list_num {
  color: #f4b8c0;
  font-size: 30px;
  font-weight: 700;
}

#resolveFame_2025 #s3 .box .card .lists .list:nth-child(2) .list_num {
  color: #ea9ba4;
}

#resolveFame_2025 #s3 .box .card .lists .list:nth-child(3) .list_num {
  color: #e28a97;
}

#resolveFame_2025 #s3 .box .card .lists .list:nth-child(4) .list_num {
  color: #ea9ba4;
}

#resolveFame_2025 #s3 .box .card .lists .list:nth-child(5) .list_num {
  color: #e28a97;
}

#resolveFame_2025 #s3 .box .card .lists .list .list_t {
  font-size: 26px;
  color: #262626;
  margin-bottom: 10px;
  font-weight: 600;
}

#resolveFame_2025 #s3 .box .card .picture {
  width: 100%;
  max-width: 570px;
}

@media (max-width:1099px) {
  #resolveFame_2025 #s3 .box .card {
    justify-content: center;
  }

  #resolveFame_2025 #s3 .box .card .lists .list.p_cb,
  #resolveFame_2025 #s3 .box .card .lists .list.p_rc {
    position: unset;
  }


}

@media (max-width:768px) {
  #resolveFame_2025 #s3 .box .card .lists .list.p_rb {
    position: unset;
  }

  #resolveFame_2025 #s3 .box .card {
    flex-direction: column-reverse;
    align-items: center;
  }

  #resolveFame_2025 #s3 .box .card .lists .list {
    margin-bottom: 20px;
  }

  #resolveFame_2025 #s3 .box .card .lists .list:last-child {
    margin-bottom: unset;
  }
}

/* resolve fame s4 */
#resolveFame_2025 #s4 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

#resolveFame_2025 #s4 .cards .card {
  width: 250px;
  background-color: #f7f4f4;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
}

#resolveFame_2025 #s4 .cards .card .icon img {
  height: 70px;
  width: unset;
}

#resolveFame_2025 #s4 .cards .card .card_t {
  font-size: 20px;
  font-weight: 600;
  color: #4e4f50;
}

@media (max-width:824px) {
  #resolveFame_2025 #s4 .cards {
    justify-content: center;
  }
}






/* resolve crisis */


#resolveCrisis_2025 #resolveKv {
  background-image: url(images/y2025/resolveCrisis_kv.png);
}



/* resolve crisis s1 */
#resolveCrisis_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#resolveCrisis_2025 #s1 .card {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

#resolveCrisis_2025 #s1 .card:nth-child(2) {
  flex-direction: row-reverse;
  margin-bottom: unset;
}

#resolveCrisis_2025 #s1 .card .card_l,
#resolveCrisis_2025 #s1 .card .card_r {
  width: 50%;
}

#resolveCrisis_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#resolveCrisis_2025 #s1 .card:nth-child(2) .card_l {
  padding-right: unset;
  padding-left: 60px;
}

#resolveCrisis_2025 #s1 .card .card_t {
  font-size: 20px;
  color: #db2e2e;
  font-weight: 600;
  margin-bottom: 20px;
}

#resolveCrisis_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

#resolveCrisis_2025 #s1 .card .card_l .des span {
  color: #dc2a0b;
}

@media (max-width:768px) {

  #resolveCrisis_2025 #s1 .card,
  #resolveCrisis_2025 #s1 .card:nth-child(2) {
    flex-direction: column-reverse;
  }

  #resolveCrisis_2025 #s1 .card .card_l,
  #resolveCrisis_2025 #s1 .card .card_r {
    width: 100%;
  }

  #resolveCrisis_2025 #s1 .card .card_l,
  #resolveCrisis_2025 #s1 .card:nth-child(2) .card_l {
    padding: unset;
    padding-top: 20px;
  }
}

/* resolve crisis s2 */
#resolveCrisis_2025 #s2 {
  background-color: #3b434f;
  height: 700px;
}

#resolveCrisis_2025 #s2 .sectionTitle {
  color: #fff;
}

#resolveCrisis_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

#resolveCrisis_2025 #s2 .cards .card {
  width: 100%;
  max-width: 525px;
  padding: 20px 20px 20px 150px;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: left;
  min-height: 282px;
  border-radius: 12px;
}

#resolveCrisis_2025 #s2 .cards .card .des {
  text-shadow: 0 0 10px #000;
}

#resolveCrisis_2025 #s2 .cards .card:first-child {
  background-image: url(images/y2025/resolveCrisis_s2_card1.png);
}

#resolveCrisis_2025 #s2 .cards .card:nth-child(2) {
  background-image: url(images/y2025/resolveCrisis_s2_card2.png);

}

#resolveCrisis_2025 #s2 .cards .card:nth-child(3) {
  background-image: url(images/y2025/resolveCrisis_s2_card3.png);

}

#resolveCrisis_2025 #s2 .cards .card:last-child {
  background-image: url(images/y2025/resolveCrisis_s2_card4.png);
}

#resolveCrisis_2025 #s2 .cards .card .des {
  color: #fff;
}

@media (max-width:1104px) {
  #resolveCrisis_2025 #s2 {
    height: unset;
  }

  #resolveCrisis_2025 #s2 .cards {
    justify-content: center;
  }
}

@media (max-width:480px) {
  #resolveCrisis_2025 #s2 .cards .card {
    padding: 20px;
    min-height: unset;
  }
}

/* resolve fame s3 */
#resolveCrisis_2025 #s3 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;

}

#resolveCrisis_2025 #s3 .box {
  padding-top: 100px;
}

#resolveCrisis_2025 #s3 .box .card {
  display: flex;
  position: relative;
  min-height: 761px;
  gap: 20px;
}

#resolveCrisis_2025 #s3 .box .card .lists .list {
  width: 320px;
  margin-bottom: 20px;
}

#resolveCrisis_2025 #s3 .box .card .lists .list:last-child {
  margin-bottom: unset;
}

#resolveCrisis_2025 #s3 .box .card .lists .list.p_cb,
#resolveCrisis_2025 #s3 .box .card .lists .list.p_rb,
#resolveCrisis_2025 #s3 .box .card .lists .list.p_rc {
  position: absolute;
}

#resolveCrisis_2025 #s3 .box .card .lists .list.p_rc {
  top: 10%;
  right: 0;
}

#resolveCrisis_2025 #s3 .box .card .lists .list.p_cb {
  left: 33%;
  bottom: 15%;
}

#resolveCrisis_2025 #s3 .box .card .lists .list.p_rb {
  right: 0;
  bottom: 0;
}


#resolveCrisis_2025 #s3 .box .card .lists .list .list_num {
  color: #f4b8c0;
  font-size: 30px;
  font-weight: 700;
}

#resolveCrisis_2025 #s3 .box .card .lists .list:nth-child(2) .list_num {
  color: #ea9ba4;
}

#resolveCrisis_2025 #s3 .box .card .lists .list:nth-child(3) .list_num {
  color: #e28a97;
}

#resolveCrisis_2025 #s3 .box .card .lists .list:nth-child(4) .list_num {
  color: #ea9ba4;
}

#resolveCrisis_2025 #s3 .box .card .lists .list:nth-child(5) .list_num {
  color: #e28a97;
}

#resolveCrisis_2025 #s3 .box .card .lists .list .list_t {
  font-size: 26px;
  color: #262626;
  margin-bottom: 10px;
  font-weight: 600;
}

#resolveCrisis_2025 #s3 .box .card .picture {
  width: 100%;
  max-width: 570px;
}

@media (max-width:1099px) {
  #resolveCrisis_2025 #s3 .box .card {
    justify-content: center;
  }

  #resolveCrisis_2025 #s3 .box .card .lists .list.p_cb,
  #resolveCrisis_2025 #s3 .box .card .lists .list.p_rc {
    position: unset;
  }


}

@media (max-width:768px) {
  #resolveCrisis_2025 #s3 .box .card .lists .list.p_rb {
    position: unset;
  }

  #resolveCrisis_2025 #s3 .box .card {
    flex-direction: column-reverse;
    align-items: center;
  }


}


/* resolve crisis s4 */
#resolveCrisis_2025 #s4 .cards {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

#resolveCrisis_2025 #s4 .cards .card {
  width: 100%;
  max-width: 337px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  border-radius: 12px;
  overflow: hidden;
}

#resolveCrisis_2025 #s4 .cards .card .text {
  position: relative;
  padding: 40px 20px;
}

#resolveCrisis_2025 #s4 .cards .card .text .icon {
  width: 55px;
  position: absolute;
  transform: translateY(-50%);
  top: 0;
  left: 20px;
}

#resolveCrisis_2025 #s4 .cards .card .card_t {
  color: #53585e;
  font-size: 20px;
  margin-bottom: 20px;
}



/* resolve crisis s5 */
#resolveCrisis_2025 #s5 {
  background-color: #f7f7f7;
}





/* resolve media */


#resolveMedia_2025 #resolveKv {
  background-image: url(images/y2025/resolveMedia_kv.png);
}

/* resolve media s1 */
#resolveMedia_2025 #s1 .sectionTitle {
  margin-bottom: 20px;
}

#resolveMedia_2025 #s1 .sectionTitle span {
  font-size: 20px;
  position: absolute;
  bottom: 100%;
  left: 160px;
}

#resolveMedia_2025 #s1 .card {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

#resolveMedia_2025 #s1 .card:nth-child(2) {
  flex-direction: row-reverse;
  margin-bottom: unset;
}

#resolveMedia_2025 #s1 .card .card_l,
#resolveMedia_2025 #s1 .card .card_r {
  width: 50%;
}

#resolveMedia_2025 #s1 .card .card_l {
  padding-right: 60px;
  padding-top: 30px;
}

#resolveMedia_2025 #s1 .card:nth-child(2) .card_l {
  padding-right: unset;
  padding-left: 60px;
}

#resolveMedia_2025 #s1 .card .card_t {
  font-size: 20px;
  color: #db2e2e;
  font-weight: 600;
  margin-bottom: 20px;
}

#resolveMedia_2025 #s1 .card .card_l .des {
  line-height: 2;
  letter-spacing: .5px;
}

#resolveMedia_2025 #s1 .card .card_l .des span {
  color: #dc2a0b;
  font-weight: 600;
}

@media (max-width:768px) {

  #resolveMedia_2025 #s1 .card,
  #resolveMedia_2025 #s1 .card:nth-child(2) {
    flex-direction: column-reverse;
  }

  #resolveMedia_2025 #s1 .card .card_l,
  #resolveMedia_2025 #s1 .card .card_r {
    width: 100%;
  }

  #resolveMedia_2025 #s1 .card .card_l,
  #resolveMedia_2025 #s1 .card:nth-child(2) .card_l {
    padding: unset;
    padding-top: 20px;
  }
}

@media (max-width:480px) {
  #resolveMedia_2025 #s1 .sectionTitle span {
    left: 90px;
  }
}

/* resolve media s2 */
#resolveMedia_2025 #s2 {
  background-color: #3b434f;
  height: 700px;
}

#resolveMedia_2025 #s2 .sectionTitle {
  color: #fff;
}

#resolveMedia_2025 #s2 .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

#resolveMedia_2025 #s2 .cards .card {
  width: 100%;
  max-width: 525px;
  padding: 20px 20px 20px 150px;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: left;
  min-height: 282px;
  border-radius: 12px;
}

#resolveMedia_2025 #s2 .cards .card .des {
  text-shadow: 0 0 10px #000;
}

#resolveMedia_2025 #s2 .cards .card:first-child {
  background-image: url(images/y2025/resolveMedia_s2_card1.png);
}

#resolveMedia_2025 #s2 .cards .card:nth-child(2) {
  background-image: url(images/y2025/resolveMedia_s2_card2.png);

}

#resolveMedia_2025 #s2 .cards .card:nth-child(3) {
  background-image: url(images/y2025/resolveMedia_s2_card3.png);

}

#resolveMedia_2025 #s2 .cards .card:last-child {
  background-image: url(images/y2025/resolveMedia_s2_card4.png);
}

#resolveMedia_2025 #s2 .cards .card .des {
  color: #fff;
}

@media (max-width:1104px) {
  #resolveMedia_2025 #s2 {
    height: unset;
  }

  #resolveMedia_2025 #s2 .cards {
    justify-content: center;
  }
}

@media (max-width:480px) {
  #resolveMedia_2025 #s2 .cards .card {
    padding: 20px;
    min-height: unset;
  }
}

/* resolve media s3 */
#resolveMedia_2025 #s3 {
  background-color: rgb(246, 246, 246);
  background-image: url(images/y2025/product3_s4_bg.png);
  background-size: cover;

}

#resolveMedia_2025 #s3 .box {
  padding-top: 100px;
}

#resolveMedia_2025 #s3 .box .card {
  display: flex;
  position: relative;
  min-height: 580px;
  gap: 20px;
}

#resolveMedia_2025 #s3 .box .card .lists .list {
  width: 320px;
  margin-bottom: 20px;
}

#resolveMedia_2025 #s3 .box .card .lists .list:last-child {
  margin-bottom: unset;
}

#resolveMedia_2025 #s3 .box .card .lists .list.p_rc,
#resolveMedia_2025 #s3 .box .card .lists .list.p_rt {
  position: absolute;
}

#resolveMedia_2025 #s3 .box .card .lists .list.p_rt {
  top: 0;
  right: 0;
}

#resolveMedia_2025 #s3 .box .card .lists .list.p_rc {
  right: 0;
  bottom: 7%;
}

#resolveMedia_2025 #s3 .box .card .lists .list .list_num {
  color: #f4b8c0;
  font-size: 30px;
  font-weight: 700;
}

#resolveMedia_2025 #s3 .box .card .lists .list:nth-child(2) .list_num {
  color: #ea9ba4;
}

#resolveMedia_2025 #s3 .box .card .lists .list:nth-child(3) .list_num {
  color: #e28a97;
}

#resolveMedia_2025 #s3 .box .card .lists .list:nth-child(4) .list_num {
  color: #d37184;
}


#resolveMedia_2025 #s3 .box .card .lists .list .list_t {
  font-size: 26px;
  color: #262626;
  margin-bottom: 10px;
  font-weight: 600;
}

#resolveMedia_2025 #s3 .box .card .picture {
  width: 100%;
  max-width: 400px;
}

@media (max-width:1099px) {
  #resolveMedia_2025 #s3 .box .card {
    justify-content: center;
  }

  #resolveMedia_2025 #s3 .box .card .lists .list.p_rt {
    position: unset;
  }

  #resolveMedia_2025 #s3 .box .card .lists .list.p_rc {
    right: 0;
    bottom: 5%;
  }

}

@media (max-width:768px) {
  #resolveMedia_2025 #s3 .box .card .lists .list.p_rc {
    position: unset;
  }

  #resolveMedia_2025 #s3 .box .card {
    flex-direction: column-reverse;
    align-items: center;
  }


}

/* resolve media s4 */
#resolveMedia_2025 #s4 {
  background-color: #b31705;
}

#resolveMedia_2025 #s4 .sectionTitle {
  color: #fff;
}

#resolveMedia_2025 #s4 .sectionTitle::before {
  background-color: #000;
}

#resolveMedia_2025 #s4 .cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px;
}

#resolveMedia_2025 #s4 .cards .card {
  width: 100%;
  max-width: 470px;
  background-color: #fff;
  border-radius: 16px;
  padding: 50px 50px 90px 90px;
  position: relative;
}

#resolveMedia_2025 #s4 .cards .card .card_t {
  color: #53585e;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}

#resolveMedia_2025 #s4 .cards .card .icon {
  border-radius: 50%;
  border: 5px solid #000;
  padding: 10px;
  position: absolute;
  transform: translateX(-50%);
  left: 0;
  top: 50px;
  width: 100px;
}

#resolveMedia_2025 #s4 .cards .card .icon2 {
  width: 70px;
  position: absolute;
  bottom: 30px;
  right: 20px;
}

@media (max-width:590px) {
  #resolveMedia_2025 #s4 .cards .card .icon {
    width: 60px;
    padding: 5px;
    transform: unset;
    top: 35px;
    left: 15px;
  }
}