@import url("../mainbanner-flexslider.css");
@charset "utf-8";

article {
  width: 100%; float:left;
  display: inline; /*防止IE6双边距*/
}
h2,h3{ font-size:inherit; }
figure{margin:auto;}
/* index */
.index .mobile-menu-wrapper {
        overflow:auto;-webkit-overflow-scrolling:touch
    }
    .index #gcse_bar {
        width: 237px;
        margin-top: 0;
        margin-bottom: 0;
        border: 0!important;
        margin-top: 19px!important;
		clear: both/*0420 解決干擾*/
    }
    .index .gsc-input-box table {
        margin: 0;
    }
    .index .gsc-search-button {
        padding: 0;
    }
    .index .gsc-input-box {
        height: inherit!important;
    }
    .index .gsc-result .gs-title {
        height: 2.2em!important;
    }
    .index table.gsc-search-box {
        border: 1px solid #e9e8e8!important;
    }
    .index table.gsc-search-box td {
        border: 0!important;
        padding: 0;
    }
    .index .gsc-search-box-tools .gsc-search-box .gsc-input {
        height: 29px!important;
    }

    .index .cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2 {
        padding: 6px 28px!important;
    }


.index a {
  color: #585a5c;
}
.index nav ul li {
  width: 20%;
}
.index .header-second-menu-link {
  margin-left: 0;
}

.index .mobile-news-title {
  display: none;
}

.index .mobile-bg-logo {
  display: none;
}

.index .section2-mobile-content-bg {
  display: none;
}
.index .section-3-mobile-content-bg {
  display: none;
}

.index .section4-mobile-content-bg {
  display: none;
}

.index .section5-mobile-content-bg {
  display: none;
}

.index body {
  overflow-x:hidden !important;
}

.index #section-0 {
  position: relative;
  min-height: 1250px;
}
.index #section-0 .section0-bg {
  position: absolute;
  top: 0;
}

.index #section-0 .section0-container {
  position: absolute;
  width: 100%;
  top: 15px;
}



.index .index-top-image-container img {
  position: relative;
  width: 100%;
}

.index #section-0 .index-top-image-container-bg {
  width: 1100px;
  margin: auto;
  margin-top: -200px;
  z-index: -1;
  text-align: right;
}

.index #section-0 .index-top-image-container-bg img {
  width: 350px;
}

.index .section-1 .section1-mobile-content-bg {
  display: none;
  margin-top:20px;
  padding-top:20px;
}
.index .section-1 .section1-mobile-girl{display:none;margon-top:0;padding-top:0;}

.index .index-top-news-container {
  width: 1000px;
  height: 650px;
  margin: auto;
  background-image: url(../../images/index/section0/section0-left-01-01-01.png);
  background-repeat: no-repeat;
  background-position: top 75px left 0;
  background-size: 37%;
  margin-top: -120px;
}

.index #section-0 .section0-left-01-02 {
  position: absolute;
  width: 40px;
  left: 49%;
  margin-top: 88px;
}

.index #section-0 .section0-left-01-03 {
  position: absolute;
  width: 25px;
  left: 35%;
  margin-top: 2%;
}

.index #section-0 .section0-left-01-04 {
  position: absolute;
  width: 60px;
  margin-top: 29%;
}

.index .index-top-news-content-container {
  width: 930px;
  margin-left: 120px;
  padding-top: 140px;
  color: #fff;
}

.index .index-top-news-content-title-container {
  font-size: 1.5em;
  border-bottom: 1px solid;
  padding-bottom: 5px;
}
.index .index-top-news-content-title-bottom-container {
  font-size: 2em;
  line-height: 1em;
  text-transform: uppercase;
  display:block;
  clear:both;
}

.index .index-top-news-item-container section{
	margin:15px auto;
	}
.index .index-top-news-item-container a {
  color: #585a5c!important;
}

.index .index-top-news-item-container a:hover {
  color: #585a5c!important;
}

/*--.index #section-0 table {
  width: 65%;
  display: table;
  float: right;
}

.index #section-0 table tr td {
  border: 0;
  text-align: left;
  color: #333;
}

.index #section-0 table tr:nth-of-type(2n+2) td {
  background: transparent;
  color: #333;
}
--*/
.index #section-0 dl {
  width: 63%;
  display: table;
  float: right;
  margin-bottom:20px;
}
.index #section-0 dl dt,.index #section-0 dl dd {
  border: 0;
  float: left;
  color: #333;
  line-height:2;
}
.index #section-0 dl dd {
	margin-left:40px;
	font-size:1em;
	}
.index span.badge {
  float: left;
  margin-right: 15px;
  margin-left: 0;
  border-radius: 12px;
  font-size: 0.9em;
  color: #fff;
  padding: 0 12px;
  height: 22px;
  line-height: 22px;
}

.index span.badge.b-activity {
  background-color: #91c24f;
}

.index span.badge.b-maintenance {
  background-color: #c1b721;
}

.index span.badge.b-news {
  background-color: #f57ba2;
}

.index span.badge.b-other {
  background-color: #1b9db5;
}

.index .collection {
  border: 0;
}


.index .collection .index-top-news-time {
  margin-right: 15px;
}
  .index .chip.know-more-link {
    height: 30px;
    line-height: 30px;
    padding: 0 30px;
    box-shadow: -3px 5px 6px 2px rgba(0,0,0,0.1), 0 3px 5px 0px rgba(0,0,0,0.1), 3px 4px 2px -1px rgba(0,0,0,0.05);
	background-color: #fff;
	margin-top: 10px;
  text-align: center!important;
  }
/*寬頻服務 上提 0413*/
.index .section-1 {
  position: relative;
  margin-top: -15%;
  z-index: 0;
}

.index .section-1 .section1-right-content-container-wrapper {
  width: 500px;
  height: 570px;
  background-image: url(../../images/index/section1/section1-right-01.png);

  background-position: top 9px left 100px;
  background-repeat: no-repeat;
  background-size: 68%;
}

.index .section-1 .section1-right-02 {
  position: absolute;
  width: 98px;
  top: 13px;
  left: 64px;
}
.index .section-1 .section1-right-03 {
  position: absolute;
  width: 52px;
  top: 198px;
  right: 0;
  margin-right: -10px;
}
.index .section-1 .section1-right-04 {
  position: absolute;
  width: 157px;
  bottom: 64px;
  right: 0;
}

.index .section1-content-container {
  position: relative;
  width: 500px;
  margin-top: -130px;
  margin-left: 51px;
}



.index .section1-left-container img {
  width: 145%;
  margin: 0 0 0 -39%;
}

.index .section1-right-container {
  padding-left: 10px;
}

.index .section1-right-content-container {
  position: absolute;
  top: 65px;
  left: 155px;
  color: #fff;
  text-align: right;
}

/*0420 修改寬度*/
.index .section1-right-content-container .collection {
  padding-left:0;
  width: 223px;
  text-align: right;
  color:#fff;
}

.index .section1-right-content-container .collection-header {
  text-align: right;
  font-size: 1em;
  margin-bottom:8px;
}

.index .section1-right-content-title-container {
  margin-bottom: 20px;
  font-size: 1.5em;
}

.index .section1-right-content-container .collection-header .section1-right-content-sub-title-container {
  display:block;
  font-size: 2em;
  border-bottom: 1px solid #fff!important;
  text-transform: uppercase;
  /*--line-height: 1.1em;--*/
  padding-bottom: 5px;
}

.index .section1-right-content-container .collection-header, .index .section1-right-content-container li {
  border-bottom: 0;
  padding-bottom: 9px;
}
.index .section1-right-content-container li.collection-item {
  font-size: 1em;
  opacity: 0.8;
}

.index .section1-checked-icon {
  width: 25px!important;
  margin-top: 0!important;
  margin-right: 5px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

.index .section1-icon-container {
  width: 628px;
  margin-left: -73px;
}


.index .section1-icon-holder {
  text-align: center;
  font-size: 0.6em;
  font-weight: 200;
}

.index .section1-icon-holder img {
  width: 65px;
}

/*FONT SIZE 0407*/
.index .section-1 .section1-icon-body {
  font-family: arial, helvetica,"微軟正黑體", sans-serif;
  font-size: 1.33em;
  line-height: 1.6em;
  text-align: left;
  font-weight:400;
}

.index .section1-icon-title {
  font-weight: 600;
  font-size: 1.8em;
  margin-bottom: 10px;
  margin-top: 10px;
  font-family: arial, helvetica, 微軟正黑體, sans-serif;
}


/*game位置 上提 0413*/
.index .section-2 {
  position: relative;
  min-height: 1200px;
  z-index: 0;
}
/*game位置 上提 0413*/
.index .section-2 .section2-big-l-bg {
  position: absolute;
  top: 0;
  margin: 0;
  width: 80%;
  max-height: 1200px;
  z-index: -1;
}

.index .section-2 .section2-big-r-bg {
  position: absolute;
  top: 0px;
  margin: 0 0 0 66%;
  width: 70%;
}

/*修改game pic 位置 0413 */
.index .section-2 .section2-left-container {
  /*--text-align: right;--*/
  position: relative;
  padding-top: calc(10% + .5vw);
}

.index .section-2 .section2-left-container .section2-left-container-wrapper{
  width: 500px;
  position: absolute;
  left: 48%;
  height: 630px;
  background-image: url(../../images/index/section2/section2-right01.svg);
  background-position: top 41px left 16px;
  background-repeat: no-repeat;
  background-size: 83%;
}
.index .section-2 .section2-left-container img {
  width: 500px;
}

.index .section-2 .section2-right02 {
  position: absolute;
  width: 80px!important;
  right: 0;
  bottom: 33%;
}

.index .section-2 .section2-right03 {
  position: absolute;
  width: 150px!important;
  left: 0;
  bottom: 0;
  margin-left: -36px;
}

.index .section-2 .section2-right04 {
  position: absolute;
  width: 70px!important;
  right: 88px;
  top: 31px;
}


/*修改game pic 位置 0413 */
.index .section-2 .section2-right-container {
  position: relative;
  padding-top: calc(15% + .5vw);
  height: 100%;
}

.index .section-2 .section2-right-container img {
  margin: 0 0 0 -4vw;
  position: absolute;
  z-index: -1;
  width: 690px;
  display: block;
}

.index .section2-left-content-container {
  position: absolute;
  top: 148px;
  left: 87px;
  color: #fff;
}

.index .section2-left-content-container .collection {
  padding-left:0;
  width: 223px;
  /*--text-align: left;--*/
}

.index .section2-left-content-container .collection-header {
  font-size: 1em;
}

.index .section-2 .collection.with-header .collection-item {
  padding-left: 5px;
}

.index .section2-left-content-title-container {
  margin-bottom: 20px;
  font-size: 1.5em;
}

.index .section2-left-content-container .collection-header .section2-left-content-sub-title-container {
  display:blcok;
  font-size: 2em;
  border-bottom: 1px solid #fff!important;
  text-transform: uppercase;
  /*--line-height: 1.1em;--*/
  padding-bottom: 5px;
}

.index .section2-left-content-container .collection-header, .index .section2-left-content-container li {
  border-bottom: 0;
}
.index .section2-left-content-container li.collection-item {
  font-size: 1em;
  opacity: 0.8;
}

.index .collection-item.know-more-link-li {
  margin-top: 20px!important;
  opacity: 1!important;
}



.index .chip.know-more-link.green-more a {
  color: #53bc48!important;
}

.index .chip.know-more-link.blue-more a {
  color: #1d9ab6!important;
}
.index .chip.know-more-link.yellow-more a {
  color: #d09502!important;
}

.index .chip.know-more-link.pink-more a {
  color: #ff83ac!important;
}

.index .chip.know-more-link.red-more a {
  color: #e8363c!important;
}

.index .section2-mobile-icon-container {
  margin-top: 10px;
  text-align:right;
}
.index .section-2 .section2-left-container .section2-mobile-icon-container img {
  width: 50px;
}
.index .section-2 .section2-left-container .section2-mobile-icon-container img:first-child {
  margin-right: 5px;
}


.index .section-3 {
  position: relative;
  z-index: 0;

  background: white;
  background: -webkit-linear-gradient(white 40%, #f9eeda 60%);
  background: -o-linear-gradient(white 40%, #f9eeda 60%);
  background: -moz-linear-gradient(white 40%, #f9eeda 60%);
  background: linear-gradient(white 40%, #f9eeda 60%);
}

.index .section-3 .section3-left-container-wrapper {
  height: 50vw;
  position: relative;
  width: 100%;
  max-height: 1000px;
}

.index .section-3 .section3-left-container-wrapper .section-3-man-img {
  width: 20vw;
  position: absolute;
  margin-left: 38%;
  margin-top: 15%;
  z-index: -1;
}
.index .section-3 .section3-left-container-wrapper .section-3-color-img {
  width: 100%;
  position: absolute;
  z-index: -1;
}
.index .section-3 .section3-left-container-wrapper .section-3-people-img {
  width: 100%;
  position: absolute;
  bottom: 0;
  margin-left: 37%;
  z-index: 1;
  max-width: 920px;
}

.index .section-3 .section3-right-container {
  position: relative;
}

/*0420 位置修正*/
.index .section-3 .section3-right-content-container {
  position: absolute;
  top: 80px;
  left: 100px;
  z-index: 1;
}
.index .section-3 .section-3-right-content-bg {
  width: 621px;
  z-index: -1;
}

.index .section3-right-content-container .collection {
  padding-left:0;
  width: 223px;
  /*--text-align: right;--*/
  color:#fff;
}

.index .section3-right-content-container .collection-header {
  font-size: 1em;
}

.index .section-3 .collection.with-header .collection-item {
  padding-left: 5px;
}

.index .section3-right-content-title-container {
  margin-bottom: 20px;
  font-size: 1.5em;
}

.index .section3-right-content-container .collection-header .section3-right-content-sub-title-container {
  display:block;
  font-size: 2em;
  border-bottom: 1px solid #fff!important;
  text-transform: uppercase;
  /*--line-height: 1.1em;--*/
  padding-bottom: 5px;
}

.index .section3-right-content-container .collection-header, .index .section3-right-content-container li {
  border-bottom: 0;
  text-align:right;
}
.index .section3-right-content-container li.collection-item {
  font-size: 1em;
  opacity: 0.8;
  text-align: left;
}

.index .section3-right-container .section3-right-content-container-wrapper {
  width: 500px;
  height: 570px;
  background-image: url(../../images/index/section3/section3-left-01.svg);
  background-position: top -1px left 17px;
  background-repeat: no-repeat;
  background-size: 75%;
  position: relative;
  margin-left: 10%;
}

.index .section-3 .section3-left-02 {
  position: absolute;
  width: 100px;
  left: 0;
  margin-left: -10px;
  top: 20px;
}

.index .section-3 .section3-left-03 {
  position: absolute;
  width: 70px;
  left: 450px;
  top: 30px;
}

.index .section-3 .section3-left-05 {
  position: absolute;
  width: 180px;
  left: 301px;
  bottom: 0;
}


.index .section-4  {
  position: relative;
  margin-bottom: 300px
}

.index .section-4 .section4-left-container {
  position: relative;
  /*--text-align: right;--*/
}
.index .section-4 .section4-left-container-wrapper {
  position: absolute;
  top: 67px;
  right: 40px;

  width: 500px;
  height: 570px;
  background-image: url(../../images/index/section4/section4-left-01.svg);
  background-position: top 25px left 47px;
  background-repeat: no-repeat;
  background-size: 70%;
}

.index .section-4 .section4-left-container-wrapper img {
  width: 500px;
}

.index .section-4 .section4-left-02 {
  position: absolute;
  top: 8px;
  width: 55px!important;
  right: 105px;
}
.index .section-4 .section4-left-03 {
  position: absolute;
  top: 24px;
  width: 96px!important;
  right: 10px;
}

.index .section-4 .section4-left-04 {
  position: absolute;
  width: 109px!important;
  bottom: 19px;
  left: 2px;
}

.index .section-4 .section4-left-content-container {
  position: absolute;
  top: 135px;
  left: 95px;
}

.index .section4-left-content-container .collection {
  padding-left:0;
  width: 223px;
  /*--text-align: left;--*/
  color: #fff;
}

.index .section4-left-content-container .collection-header {
  font-size: 1em;
}

.index .section-4 .collection.with-header .collection-item {
  padding-left: 5px;
}

.index .section-left-content-title-container {
  margin-bottom: 20px;
  font-size: 1.5em;
}

.index .collection-header .section-left-content-sub-title-container {
  display:block;
  width:100%;
  font-size: 2em;
  border-bottom: 1px solid #fff!important;
  text-transform: uppercase;
  /*--line-height: 1.1em;--*/
  padding-bottom: 5px;
}

.index .section4-left-content-container .collection-header, .index .section4-left-content-container li {
  border-bottom: 0;
}
.index .section4-left-content-container li.collection-item {
  font-size: 1em;
  opacity: 0.8;
}


.index .section-4 .section4-right-container img {
  width: 100%;
  min-width: 600px;
  max-width: 800px;
  margin-left: -180px;
}

.index .banner-container {
  text-align: center;
  padding: 20px;
}

.index .banner-item {
  box-shadow: 0 5px 2px 0 rgba(0,0,0,0.14), 0 3px 4px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
}




.index .section-5 {
  position: relative;
  z-index: 0;

	/*------------
  background: white;
  background: -webkit-linear-gradient(white 40%, #f9eeda 60%);
  background: -o-linear-gradient(white 40%, #f9eeda 60%);
  background: -moz-linear-gradient(white 40%, #f9eeda 60%);
  background: linear-gradient(white 40%, #f9eeda 60%);---------------*/
}

.index .section-5 .section5-left-container-wrapper {
  height: 35vw;
  position: relative;
  width: 100%;
  max-height: 900px;
}

.index .section-5 .section5-left-container-wrapper .section-5-man-img {
  width: 100%;
  position: absolute;
  margin-left: 25%;
  margin-top: -20px;
  z-index: -1;
}
.index .section-5 .section5-left-container-wrapper .section-5-color-img {
  width: 100%;
  position: absolute;
  z-index: -1;
  left:250px;
  top:-50px
}
.index .section-5 .section5-left-container-wrapper .section-5-people-img {
  width: 100%;
  position: absolute;
  bottom: -100px;
  left:-100px;
  margin-left: 37%;
  z-index: 1;
  max-width: 920px;
}

.index .section-5 .section5-right-container {
  position: relative;
}

/*0420 位置修正*/
.index .section-5 .section5-right-content-container {
  position: absolute;
  top: 80px;
  left: 100px;
  z-index: 1;
}
.index .section-5 .section-5-right-content-bg {
  width: 621px;
  z-index: -1;
}

.index .section5-right-content-container .collection {
  padding-left:0;
  width: 223px;
  /*--text-align: right;--*/
  color:#fff;
}

.index .section5-right-content-container .collection-header {
  font-size: 1em;
}

.index .section-5 .collection.with-header .collection-item {
  padding-left: 5px;
}

.index .section5-right-content-title-container {
  margin-bottom: 20px;
  font-size: 1.5em;
}

.index .section5-right-content-container .collection-header .section5-right-content-sub-title-container {
  display:block;
  font-size: 1.7em;
  border-bottom: 1px solid #fff!important;
  text-transform: uppercase;
  /*--line-height: 1.1em;--*/
  padding-bottom: 5px;
}

.index .section5-right-content-container .collection-header, .index .section5-right-content-container li {
  border-bottom: 0;
  text-align:right;
}
.index .section5-right-content-container li.collection-item {
  font-size: 1em;
  opacity: 0.8;
  text-align: left;
}

.index .section5-right-container .section5-right-content-container-wrapper {
  width: 500px;
  height: 570px;
  background-image: url(../../images/index/section5/section5-left-01.svg);
  background-position: top 0px left 30px;
  background-repeat: no-repeat;
  background-size: 75%;
  position: relative;
  margin-left: 10%;
}

.index .section-5 .section5-left-02 {
  position: absolute;
  width: 100px;
  left: 0;
  margin-left: 0px;
  top: 20px;
}

.index .section-5 .section5-left-03 {
  position: absolute;
  width: 70px;
  left: 450px;
  top: 30px;
}

.index .section-5 .section5-left-05 {
  position: absolute;
  width: 150px;
  left: 320px;
  bottom: 0;
}







.corporate .mobile-menu-title {
  background: #000;
  color: #fff;
  text-align: center;
}

@media only screen and (min-width: 1600px) {
  .corporate .slide-text-bg {
    width: 70%!important;
  }

  .corporate #section-5, .corporate .carousel.carousel-slider, .corporate #section-6 {
    min-height: 1000px;
  }

}

@media only screen and (min-width: 1500px) {
  .corporate #section-6 .section-content-container {
    right: 10%;
  }

}




@media only screen and (min-width: 1500px) {
  .corporate #section-0 {
    max-height: 900px;
  }

  .index .section-1 {
    margin-top: -35%;
  }
}

@media only screen and (min-width: 1700px) {
  .corporate #section-0 {
    max-height: 900px;
  }
}

@media only screen and (min-width: 2000px) {
  .corporate .slide-text-bg {
    width: 60%!important;
  }

  .index .section-1 {
    margin-top: -45%;
  }
}



@media only screen and (min-width: 1024px) {
  
    /* index */
  .index .section-4 {
    margin-top: 120px;
  }
  .index .section-1 { margin-top: -18%; }

  .index .section1-content-container {
    margin-left: 0;
  }
  .index .section1-content-container {
    width: auto;
    width: initial;
  }
  /*
  .index .section-2 {
  min-height: 1000px;
}
*/
  /* corporate */
  .corporate #section-1 .left-title-container {
    top: 10vw;
  }


  .corporate #section-1 .section-content-container, .corporate #section-3 .section-content-container {
    margin-top: -140px;
  }
  .corporate #section-3 .section-bg-bottom-left-omit.section-content-container-wrapper {
    padding: 150px 350px;
  }

}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .index .section3-right-container .section3-right-content-container-wrapper {
    background-size: auto;
  }
  .index .section-4 .section4-left-container-wrapper {
    background-position: 0%;
    background-size: auto;
  }
 .index .section5-right-container .section5-right-content-container-wrapper {
    background-size: auto;
  }	
	
	

}

@media only screen and (max-width: 1950px) {
  .index .section-3 {
    margin-top: -10%;
  }
  .index .section-5 {
    margin-top: -10%;
  }

}
@media only screen and (max-width: 1700px) {
  .index .section-2 .section2-left-container .section2-left-container-wrapper {
    left: 38%;
  }

  .index .section-3 {
    margin-top: -15%;
  }
 .index .section-5 {
    margin-top: -15%;
  }
}
@media only screen and (max-width: 1600px) {
  .index .section1-left-container img {
    width: 180%;
    margin: 0 0 0 -65%;
  }


}
@media only screen and (max-width: 1399px) {
  .index .section-2 .section2-left-container {
    padding-top: 19%;
  }

  .index .section-2 .section2-right-container img {
    margin: 0 0 0 -2vw;
  }

  .index .section-3 .section3-left-container-wrapper {
    height: 55vw;
  }

  .index .section-3 .section3-right-content-container-wrapper {
    position: absolute;
    right: 0;
  }
  .index .section-3 {
    margin-top: -20%;
  }
	
  .index .section-5 .section5-left-container-wrapper {
    height: 55vw; 
  }

  .index .section-5 .section5-right-content-container-wrapper {
    position: absolute;
    right: 0;
  }
  .index .section-5 {
    margin-top: -20%;
  }	
.index .section-5 .section5-left-container-wrapper .section-5-man-img {
  width: 150%;
  margin-left:-5%;
  margin-top: 15%;
}
.index .section-5 .section5-left-container-wrapper .section-5-color-img {
  width: 150%;
  left:100px;
  top:80px
}
.index .section-5 .section5-left-container-wrapper .section-5-people-img {
  width: 150%;
  bottom: 0px;
  left:-160px;
}	
	
	
	
}


@media only screen and (min-width: 601px) {
  .container {
    width: 90%;
    max-width: auto;
    max-width: initial;
  }
}
@media only screen and (min-width: 993px) {
  .container, .header-top-menu {
    width: 1000px;
  }
}

@media only screen and (max-width: 1025px) {


  /* index */

  .index #section-0 {
    overflow: hidden;
  }
  .index #section-0 .section0-bg {
    height: 1450px;
  }
  .index .section0-bg-line {
    display: none;
  }
  .index .section1-mobile-content-bg, .index .section1-mobile-girl {
    display: none;
  }
  

.index #section-0 dl dt,.index #section-0 dl dd {
  float: none;
  width:100%;
  text-align:left;
}
.index #section-0 dl dd {
	margin:auto;
	}
/*--
  .index #section-0 table td:nth-child(2) {
    white-space:nowrap
  }
 --*/
  .index .index-top-news-container {
    width: 100%;
    margin-top: 300px;
  }
  .index .index-top-news-content-container {
    width: auto;
    width: initial;
  }
 
  .index .section1-left-container img {
    width: 200%;
    margin: 0 0 0 -80%;
  }

  .index .section-2 .section2-left-container .section2-left-container-wrapper {
    left: 10vw;
  }

  .index .section-2 .section2-right-container img {
    margin: 0 0 0 -11vw;
  }
  .index .section1-icon-container {
    width: auto;
    width: initial;
  }

  .index .section-2 {
    /*--min-height: 125vh;--*/
  }
  .index .section-3 {
    margin-top: 0;
  }
  .index .section-3 .section-3-right-content-bg {
    width: 521px;
  }
  .index .section-3 .section3-right-content-container-wrapper {
    top: -20px;
  }
  .index .section-3 .section3-right-content-container {
    top: 75px;
    left: 84px;
  }
  .index .section-3 .section3-left-03 {
    right: 0;
    left: auto;
    left: initial;
  }

  .index .section-2 .section2-right-container img {
    z-index: 0;
  }
	
  .index .section-5 {
    margin-top: 0;
  }
  .index .section-5 .section-5-right-content-bg {
    width: 521px;
  }
  .index .section-5 .section5-right-content-container-wrapper {
    top: -20px;
  }
  .index .section-5 .section5-right-content-container {
    top: 75px;
    left: 84px;
  }
  .index .section-5 .section5-left-03 {
    right: 0;
    left: auto;
    left: initial;
  }
	
.index .section-5 .section5-left-container-wrapper .section-5-man-img {
  width: 120%;
  margin-left:-5%;
  margin-top: 15%;
}
.index .section-5 .section5-left-container-wrapper .section-5-color-img {
  width: 120%;
  left:100px;
  top:80px
}
.index .section-5 .section5-left-container-wrapper .section-5-people-img {
  width: 120%;
  bottom: 0px;
  left:-160px;
}
	
.index .section-4  {
  position: relative;
  margin-bottom: 20%
}	

  /* corporate */

  .corporate .right-title-container {
    font-size: 1.2em;
  }
  .corporate .left-title-container {
    font-size: 1.2em;
  }

  .corporate .right-title-container {
    top: 10vw;
  }

  .corporate .top-left-title-container, .corporate .right-header-container {
    width: 25%;
  }
  .corporate .section-3-title-container {
    top: 10vw;
  }
  .corporate #section-5 .left-title-container {
    top: 11vw;
    width: 81%;
  }
  .corporate .slide-content-image {
    width: 30%;
  }
  .corporate #section-5 .slide-image {
    width: 120%;
  }
  .corporate #section-6 {
    min-height: 700px;
  }

  .corporate #section-6 .section-content-container {
    display: block;
    top: 10%;
    right: 20%;
  }

  .corporate #section-6 .section-content-container-wrapper {
    padding: 30px 50px;
  }

  .corporate .section-6-icon-container {
    display: block;
    margin-top: 20px;
    padding-left: 0;
  }

  .corporate .section-6-icon {
    display: inline-block;
    margin-bottom: 0;
    width: 30%;
    border-bottom: 0;
  }

  /* history proposal */
  .history .history-title-wrapper {
    top: 11vw;
    font-size: 1.3em;
    left: 7vw;
  }
  .history .history-title-img {
    width: 30%;
  }

  .history .history-partial-image-container {
    margin: auto;
    right: 0;
    left: 0;
    width: 25%;
    top: -55px;
  }
  .history .history-partial-image-caption {
    font-size: 2vw;
  }

  .history .history-partial-header {
    height: 8vw;
  }
  .history .history-partial-image-container {
    top: -68px;
  }

  /* end history proposal */
 

}
@media only screen and (max-width: 993px) {

  nav .brand-logo {
    left: 0;
    position: initial;
    display: initial;
  }




  /* corporate */


  .corporate .section0-bottom-right-text-container {
    font-size: calc(4px + .5vw);
    min-width: auto;
    min-width: initial;
    right: calc(-17px + .5vw);
  }

  .corporate #home-svg {
    position: absolute;
    display: block;
    background-image: url(../../images/corporate/section0/index_cover2-1500x785.html);
    background-position: center bottom;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
  }



  .corporate .right-header-container {
    width: 35%;
  }

  .corporate .right-title-container {
    top: 15vw;
    font-size: 1.3em;
    right: 4%;
  }

  .corporate .top-left-title-container {
    width: 35%;
  }
  .corporate #section-5 .left-title-container {
    top: 15vw;
  }
  .corporate .section-3-title-container {
    top: 13vw;
  }

  .corporate .left-title-container {
    top: 15vw;
    font-size: 1.3em;
  }

  .corporate #section-0 .bottom-image-content {
    font-size: 0.7em;
  }
  .corporate #home-svg {
    background-position-y: -1px;
  }
  .corporate #section-1 .image-container {
    background-position-y: 1px;
  }
  .corporate #section-1 .image-container .people-img {
    width: 100%;
  }

  .corporate .section-bg-bottom-left-omit.section-content-container-wrapper {
    padding: 50px 15px;
  }
  .corporate #section-3 .content-title {
    letter-spacing: 0.1em;
  }
  .corporate .square-content {
    font-size: 0.8em;
  }

  .corporate .section-3-title-container {
    top: 11vw;
    line-height: 6vw;
  }

  .corporate .section-3-title-container .top-title-container {
    line-height: 4vw;
    padding-bottom: 5px;
  }

  .corporate .section6-title-container {
    right: 1%;
  }

  .corporate #section-0 {
    height: 55vh;
    min-height: 375px;
  }

  .corporate .flash-logo {
    font-size:2.6em;
    float:none;
  }

  .corporate #section-1 .content-body {
    padding: 0 15px;
  }

  .corporate #section-1 .image-container {
    width: 100%;
  }

  .corporate .section-2-people {
    width: 45%;
    top: 12%;
  }

  .corporate .section2-square1-container {
    top: 37%;
    left: 45%;
  }
  .corporate .section2-square2-container {
    top: 47%;
    left: 70%;
  }
  .corporate .section2-square3-container {
    top: 66%;
    left: 45%;
  }
  .corporate .section2-square4-container {
    top: 72%;
    left: 71%;
  }




  .corporate .mobile-dots {
    position: absolute;
    display: block;
    width: 20px;
    z-index: -2;
  }

  .corporate #section-3 .content-title {
    font-size: 2em;
  }
  .corporate #section-3 .content-body {
    font-size: 1em;
    opacity: 0.5;
  }
  .corporate #section-3 .image-container {
    background-size: 100%;
    width: 100%;
  }


  .corporate #section-3 .image-container .people-img {
    width: 90%;
    margin-top: 30px;
  }

  .corporate .section3-dot {
    display: block;
    position: absolute;
    width: 10%;
  }

  .corporate .section3-dot1 {
    top: 12%;
    left: 40%;
  }
  .corporate .section3-dot2 {
    top: 25%;
    right: 2%;
  }
  .corporate .section3-dot3 {
    top: 41%;
    left: 6%;
    opacity: 0.3;
  }
  .corporate .section3-dot4 {
    top: 35%;
    right: 43%;
    opacity: 0.5;
  }
  .section3-dot5 {
    top: 40%;
    left: 34%;
  }
  .corporate .section3-dot6 {
    top: 45%;
    right: 15%;
  }
  .corporate .section3-dot7 {
    top: 70px;
    left: 250px;
    opacity: 0.5;
  }

  .corporate #section-4 .section-4-big-bg {
    padding-top: 50%;
    text-align: center;
  }



  .corporate #section-4 .content-body {
    color: #000000!important;
  }



  .section4-building-bottom-cover {
    display: none;
  }
  .corporate #section-4 .section-content-container {
    position: static;
    position: initial;
    text-align: center;
    color: #585a5c;
    margin-bottom: 20px;
  }
  .corporate .building-cover {
    background-position: bottom;
  }
  .corporate .section-4-building {
    width: 50%;
    position: absolute;
    bottom: 0;
    top: auto;
    top: initial;
    transform: translate(0, 0);
  }

  .corporate .move_building {
    transform: translate(0, 0);
  }

  .corporate #section-5 .section-5-slide-bg {
    text-align: right;
  }

  .corporate .slide-content-image {
    width: 40%;
  }

  .corporate #section-5 .slide-image {
    width: 90%;
  }
  .corporate .carousel .indicators {
    bottom: 30px;
  }

  .corporate .desktop-break {
    display: block;
    display: initial;
  }

  .corporate .mobile-break {
    display: block;
    line-height: 1.8em;
  }

  .corporate #section-6 {
    min-height: 650px;
    padding-top: 160px;
  }

  .corporate #section-6 .section-content-container {
    position: static;
    position: initial;
  }
  .corporate #section-6 .image-container {
    position: relative;
  }

  .corporate #section-6 .image-container .people-img {
    width: 100%;
    margin-bottom: -6px;
  }

  .corporate .section-content-container-wrapper-wrapper {
    display: block;
  }
  .corporate .section-6-icon-container {
    margin-top: 15px;
  }
  .corporate .section-6-icon {
    width: 25%;
  }

  .corporate .section-6-icon {
    border-bottom: 0;
  }

  .corporate #section-6 .section-content-container-wrapper {
    padding: 40px 20px;
  }


}

@media only screen and (max-width: 900px) {
 /* btn */
 .btn_box{width:60%;margin:auto;}
 .btn{
	 margin-left:30px;
	 }
 .btn a{
	 display:block;
	 width:100%;
	 }
  /* csr */
  nav .nav-wrapper {
  }
  .breadcrumb {
    font-size: 1em;
  }
  .csr .new-item {
    display: none;
  }
  .csr .new-item:first-child {
    width: 100%;
    display: block;
  }

  .csr .news-item-container:first-child {
    display: table!important;
  }

  .csr .eco-container .new-item {
    width: 100%;
    display: block;
    margin-bottom: 25px;
  }
  .csr  .eco-container .news-item-date {
    width: 43px;
    min-width: 43px;
  }

  .csr .eco-container .news-item-body-wrapper {
    display: none;
  }

  .csr .care-news-container:first-child {
    display: table;
    width: 100%;
  }


  .csr .news-item-arrow {
    display: block;
  }

  .csr .news-item-date {
    border-bottom: 0!important;
    margin-bottom: 20px;
    display: table-cell;
    padding-right: 10px;

  }
  .csr .news-item-title {
    padding-top: 5px;
    border-left: 1px solid #ddefa0;
    padding-left: 10px;
    padding-right: 20px;
  }
  .csr .news-item-body {
    padding-left: 10px;
    height: 34px;
    overflow: hidden;
  }

  .csr .new-item.social-news-item {
    display: block!important;
  }
  .csr .news-item-arrow {
    width: 15px;
  }
  .csr .news-item-title-wrapper {
    display: table-cell;
    width: 100%;
  }
  .csr .care-container .news-item-title-wrapper {
    display: table;
    width: 100%;
  }

  .csr .care-container .row:last-child {
    display: none;
  }

  .csr .news-item-container {
    margin-bottom: 0;
  }
  .csr .mobile-arrow-container {
    display: table-cell;
    vertical-align: middle;
  }
  .csr .care-news-content-container {
    padding-top: 0;
  }
  .csr .care-news-content-title {
    padding-top: 0;
    border-top: 0;
    border-left: 1px solid red;
    padding-left: 10px;
  }
  .csr .care-news-content-body {
    height: 33px;
    overflow: hidden;
    padding-left: 10px;
  }

  .csr .pink-border-left {
    border-left: 1px solid #e60aa0;
  }

  .csr .care-news-container {
    display: none;
  }

  .csr .care-news-container:first-child {
    display: table;
  }

  .csr .news-item-date {
    display: table-cell;
    vertical-align: middle;
  }

  .csr .news-item-body-wrapper {
    display: table-row;
  }

  .csr .empty-grid {
    display: table-cell;
  }

  .csr .news-item-date-title-wrapper {
    display: table-row;
  }

  .csr .news-item-read-more {
    display: none;
  }

  .csr .care-desktop-image {
    display: none;
  }
  .csr .care-mobile-image {
    display: block;
    position: relative;
  }
  .csr .care-desktop-more {
    display: none;
  }
  .csr .care-mobile-more {
    display: block;
    position: absolute;
    right: 2%;
    bottom: 2%;
  }



  /* history proposal joinus news */

  .left-title-flag-wrapper {
    top: 11vw;
    font-size: calc(4px + 1.7vw);
  }

  .proposal .left-title-flag-wrapper {
    top: 14vw;
    font-size: calc(4px + 1.3vw);
  }
  .left-title-flag-img {
    width: 30%;
  }
  .top-full-image .desktop-image {
    display: none;
  }
  .top-full-image .mobile-image {
    display: block;
    width: 100%;
  }

  .csr .new-item {
    display: block;
  }
  .news .news-title-wrapper {
    top: 11vw;
    font-size: 1.3em;
    left: 7vw;
  }
  .news .news-title-img {
    width: 30%;
  }
  .csr .news-item-body-wrapper {
    display: none;
  }

  .news .news-date {
    display: block;
    padding-bottom: 10px;
    padding-left: 5px;
  }
  .news .news-content-container {
    padding: 0;
    width: 100%;
  }
  .news .news-content-container-wrapper {
    border: 0;
    padding: 0 10px 5px 5px;
  }
  .news table td .news-content-container-wrapper p {
    display: none;
  }
  .news .news-more {
    padding: 0;
    padding-bottom: 5px;
  }
  .news .news-more img {
    width: 15px;
  }

  .news table tr {
    margin-bottom: 20px;
    border-bottom: 1px solid #e9e8e8;
  }
  .news .select-wrapper input.select-dropdown {
    height: 2rem;
  }

  .history .history-partial-image-container {
    top: -55px;
  }

  .proposal .proposal-container {
    display: block;
  }
  .proposal .proposal-title-wrapper {
    top: 13vw;
    font-size: 1em;
  }
  .proposal .proposal-left-content {
    padding: 20px;
  }
  .proposal .proposal-right {
    width: 100%!important;
  }
  .proposal .proposal-main-container {
  }
  .proposal-title-img {
    width: 30%;
  }

  .joinus .joinus-container {
    display: block;
  }
  .joinus .benefit-lr-wrapper {
    width: 65%!important;
  }
  /*  end history proposal joinus news */




  /* index */
  .index .mobile-menu-wrapper #gcse_bar {
    float: none;
    width: 80%;
    margin: auto;
  }

  .index .mobile-menu-wrapper .gsc-control-cse {
    background: none!important;
  }

  .index .mobile-menu-wrapper table.gsc-search-box {
    border: 0!important;
    background: none!important;
  }

  .index .mobile-menu-wrapper .gsc-search-box-tools .gsc-search-box .gsc-input {
    background: none!important;
    width: 200px!important;
  }

  .index .mobile-menu-wrapper .gsc-input-box {
    background: none!important;
  }

  .index table#gs_id50 {
    border-bottom: 1px solid #e9e8e8;
  }
  .index .mobile-menu-wrapper .gsc-search-button {
    border-right: 0!important;
  }

  .index .mobile-menu-wrapper .gsc-results-wrapper-overlay {
    padding: 10px;
    width: 90%;
    margin: auto;
    right: 0;
    left: 0;
    top:10%;
  }

  .index .mobile-menu-wrapper table.gsc-above-wrapper-area-container {
    margin-top: 20px;
  }

  .index .mobile-menu-wrapper table.gsc-above-wrapper-area-container td {
    padding: 0 10px!important;
    display: block;
  }

  .index .mobile-menu-wrapper .gsc-orderby-container {
    text-align: center;
  }

  .index .mobile-menu-wrapper .gsc-modal-background-image {
    height: 250%;
  }

  .index .mobile-menu-wrapper .gsc-wrapper .mc_ {
    padding: 10px;
  }

  .index #section-0 {
    min-height: 925px;
  }

  .index .mobile-news-title {
    display: block;
  }

  .index .section0-left-01-02, .index .section0-left-01-03, .index .section0-left-01-03, .index .section0-left-01-04 {
    display: none;
  }

  .index .section1-pic-woman, .index .section1-right-02, .index .section1-right-03, .index .section1-right-04 {
    display: none;
  }
  .index .section1-mobile-content-bg, .index .section-1 .section1-mobile-girl {
    display: block!important;
  }

  .index .section2-right02,.index .section2-right03,.index .section2-right04 {
    display: none;
  }

  .index .section2-mobile-content-bg {
    display: block;
  }
  .index #section-0 .section0-bg {
    height: 450px;
  }

  .index .section-3-man-img, .index .section-3-color-img, .index .section3-left-02, .index .section3-left-03, .index .section3-left-05 {
    display: none;
  }
  .index .section-3-mobile-content-bg {
    display: block;
  }

  .index .section4-left-02, .index .section4-left-03, .index .section4-left-04 {
    display: none;
  }

  .index .section4-mobile-content-bg {
    display: block;
  }
	
  .index .section-5-man-img, .index .section-5-color-img, .index .section5-left-02, .index .section5-left-03, .index .section5-left-05 {
    display: none;
  }
  .index .section5-mobile-content-bg {
    display: block;
  }	
	
	
	
	
  .index #section-0 .section0-container {
    top: 0;
  }

  .index #section-0 .index-top-image-container {
    width: 100%; padding: 15px 20px 20px/*0424 AD PADDING*/;
  }
  .index .index-top-image-container img {
    width: 100%;
  }
  .index .index-top-news-container {
    margin-top: 0;
  }

  .index .index-top-news-content-title-bottom-container {
    display: none;
  }

  .index .mobile-news-title {
    width: 15vw;
    float: left;
    margin-right: 10px;
  }
  .index .index-top-news-content-title-top-container {
    color: #000;
    display: inline-block;
    line-height: 10vw;
	font-size:0.8em;
  }
  .index .index-top-news-content-container {
    width: 100%;
    margin-left: 0;
    padding-top: 0;
  }
  .index .index-top-news-container {
    background-image: none;
  }
  .index .index-top-news-content-title-container {
    width: 80%;
    margin: 20px auto;
    text-align: center;
    padding-bottom: 5px;
  }
  /*--
  .index #section-0 table {
    width: 100%;
    float: none;
  }

  .index #section-0 table td {
    text-align: center;
    display: block;
    padding-right: 10px;
    padding-left: 10px;
  }
  --*/
    .index #section-0 dl {
  width: 95%;
  float: none;
  margin:15px auto;
  
}
   .index #section-0 dl dt,.index #section-0 dl dd {
    text-align: center;
    display: block;
    padding-right: 10px;
    padding-left: 10px;
  }
  
/*--
  .index #section-0 table td:first-child {
    width: 100%;
    text-align: center;
    display: block;
    padding-bottom: 0;
  }
  .index #section-0 table td:nth-child(2) {
    text-align: center;
    display: block;
    padding-bottom: 20px;
  }
--*/
  .index span.badge {
    float: none;
  }

  .index .mobile-bg-logo {
    width: 30%;
    position: absolute;
    bottom: 0;
    right: 5%;
    z-index: -1;
  }

  .index .section-1 {
    background: white;
    background: -webkit-linear-gradient(white, white, white, white, white, white, #e5f3f7);
    background: -o-linear-gradient(white, white, white, white,white, white, #e5f3f7);
    background: -moz-linear-gradient(white, white, white, white, white, white, #e5f3f7);
    background: linear-gradient(white, white, white, white, white, white, #e5f3f7);
    overflow: hidden;
    margin-top: 10px;
  }
  .index .section-1 .section1-left-container {
    display: none;
  }

  .index .section-1 .section1-right-container {
    width: 100%;
    padding: 0;
  }

  .index .section-1 .section1-right-content-container-wrapper {
    background: none;
    width: 100%;
  }

  .index .section1-content-container img {
    width: 60%;
    margin: auto;
    margin-top: 20px;
  }
  .index .section-1 .section1-right-content-container-wrapper {
    height: auto;
    height: initial;
  }
  .index .section1-content-container {
    margin: 0;
    width: 100%;
    text-align: center;
  }
  .index .section1-right-content-container {
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    margin-top: -10px;
	text-align:left;
  }

  .index .section1-right-content-container .collection {
    width: 60%;
    margin: auto;
   /*-- margin-top: -25px;--*/
  }

  .index .section1-right-content-title-container {
    margin-bottom: 45px;
	margin-top:-10px;
    text-align: left;
    color: #00a0b5;
    font-size: 3em;
    margin-left: 5%;
  }
  .index .section1-right-content-container .collection-header .section1-right-content-sub-title-container {
    width: 60%;
    margin: auto;
  }
  .index .section1-right-content-container .collection-header {
    padding: 15px!important;
    padding-bottom: 17px!important;
  }
  .index .section1-right-content-container li.collection-item {
    font-size: 1.1em;
    opacity: 0.8;
    text-align: right;
    padding: 0 0 15px 0;
    width: 56%;
    margin: auto;
    letter-spacing: 2px;
  }

.index .section-1 .chip.know-more-link {
  margin-left: 20%;
  }

  .index .section1-icon-container {
    width: 93%;
    margin: auto;
  }
  .index .section1-icon-holder img {
    width: 70px;
  }

  .index .section1-mobile-girl {
    float: right;
    margin-top: -34% !important;
    z-index: 0;
    position: relative;
    margin-bottom: 10px!important;
    width: 74%!important;
  }

  .index .section1-icon-body {
    display: none;
  }
  
  .index .section1-icon-holder{
	  margin-top:20px;
	  } 
  
  .index .section-2 {
    min-height: 1200px;
    z-index: 0;
  }

  .index .section-2 .section2-left-container {
    width: 100%;
    padding: 0;
  }
  .index .section-2 .section2-left-container .section2-left-container-wrapper {
    background-image: none;
    position: relative;
    width: 100%;
    left: 0;
  }
  .index .section-2 .section2-left-container img {
    width: 60%;
    margin: auto;
  }

  .index .section2-left-content-title-container {
    margin-bottom: 25%;
    color: #46b128;
    text-align: right;
    font-size: 3em;
  }

  .index .section2-left-content-container {
    left: 0;
    right: 0;
    width: 99%;
    top: 10%;
  }

  .index .section2-left-content-container .collection-header .section2-left-content-sub-title-container, .index .section-2 .collection.with-header .collection-item {
    width: 77%;
	display:block;
  }
  .index .section2-left-content-container .collection {
    width: 60%;
    padding-left: 14%;
    margin: auto;
  }


  .index .section-2 .collection.with-header .collection-item {
	line-height: 1.6em;
	background-color: transparent;
  	padding: 5px;
  }

  .index .section-2 .collection-item.know-more-link-li {
    width: 100%;
  }

  .index .section-2 .section2-right-container {
    padding: 0;
    width: 100%;
    margin-top: -80px;
  }
  .index .section-2 .section2-right-container img {
      width: 100%;
      width: 97%; /*20170510 fix index game area*/
    margin: auto;
  }

  .index .section-2 .chip.know-more-link {
	margin-left: 43%;
	margin-top:20px;
  }

  .index .section-3 .row {
    display: flex;
    flex-flow: row wrap;
  }
 .index .section-5 .row {
    display: flex;
    flex-flow: row wrap;
  }	
	

  .index .section-2 .section2-big-r-bg {
    position: absolute;
    top: 0;
    margin: 0 0 0 36%;
    margin: 0 0 0 30%; /*20170510 fix index game area*/
    width: 70%;
  }
  .index .section-2 .section2-big-l-bg {
      left: -7%;
      left: 0%; /*20170510 fix index game area*/
    top: 6%;
    width: 140%;
    width: 100%; /*20170510 fix index game area*/
    max-height: 1300px;

  }
  .index .section-3 .section3-left-container-wrapper {
    height: 110vh;
  }

  .index .section-3 .section3-left-container-wrapper .section-3-people-img {
    margin-left: 0;
  }

  .index .section-3 .col.s6.section3-left-container {
    order: 2;
    width: 100%;
  }
  .index .section-3 .section3-right-container {
    order: 1;
    width: 100%;
  }

  .index .section-3 .section3-right-container {
    width: 100%;
    padding: 0;
  }
  .index .section-3 .section3-right-content-container-wrapper {
    width: 60%;
    left: 0;
    right: 0;
    margin: auto;
    background: none;
  }

  .index .section-3-mobile-content-bg {
    margin: auto;
    margin-top: 105px;
  }

  .index .section-3 .section3-right-content-container {
    margin: auto;
    right: 0;
    left: 0;
  }
  .index .section3-right-content-container .collection {
    width: 90%;
    margin: auto;
    top: 15px;
  }
  .index .section3-right-content-title-container {
    margin-bottom: 60px;
    text-align: left;
    color: #d99900;
    font-size: 3em;
  }
  .index .section3-right-content-container .collection-header .section3-right-content-sub-title-container {
    width: 60%;
    margin-left: 13%;
	display:block;
  }
  .index .section-3 .collection.with-header .collection-item{
    width: 60%;
    margin-left: 13%;
	background-color: transparent;
  	padding: 5px;
  }
  .index .section-3 .collection.with-header .collection-item {
   
    width: 60%;
  }
  .index .section-3 .chip.know-more-link {
  margin-left: 40%;
  }
	

	
 .index .section-5 .section5-left-container-wrapper {
    height: 110vh;
  }

  .index .section-5 .section5-left-container-wrapper .section-5-people-img {
    margin-left: 0; left:0; bottom:-50px; width: 100%;
  }

  .index .section-5 .col.s6.section5-left-container {
    order: 2;
    width: 100%;
  }
  .index .section-5 .section5-right-container {
    order: 1;
    width: 100%;
  }

  .index .section-5 .section5-right-container {
    width: 100%;
    padding: 0;
  }
  .index .section-5 .section5-right-content-container-wrapper {
    width: 60%;
    left: 0;
    right: 0;
    margin: auto;
    background: none;
  }

  .index .section5-mobile-content-bg {
    margin: auto;
    margin-top: 105px;
  }

  .index .section-5 .section5-right-content-container {
    margin: auto;
    right: 0;
    left: 0;
  }
  .index .section5-right-content-container .collection {
    width: 90%;
    margin: auto;
    top: 40px;
  }
  .index .section5-right-content-title-container {
    margin-top: 0px;
    text-align: left;
    color: #e8363c;
    font-size: 3em;
  }
  .index .section5-right-content-container .collection-header .section5-right-content-sub-title-container {
    width: 60%;
    margin-left: 13%;
	display:block;
  }
  .index .section-5 .collection.with-header .collection-item{
    width: 60%;
    margin-left: 13%;
	background-color: transparent;
  	padding: 5px;
  }
  .index .section-5 .collection.with-header .collection-item {
   
    width: 60%;
  }
  .index .section-5 .chip.know-more-link {
  margin-left: 40%;margin-top: 20%;
  }	
	
	
	
	
.index .section-4  {
  position: relative;
  margin-bottom:0px
}
  .index .section-4 .section4-left-container {
    width: 100%;
    padding: 0;
  }

  .index .section-4 .section4-left-container-wrapper {
    top: 15%;
    position: relative;
    right: auto;
    right: initial;
    left: 0;
    background: none;
    width: 100%;
  }
  .index .section-4 .section4-left-container-wrapper img {
    width: 60%;
    margin: auto;
  }
  .index .section-4 .section4-left-content-container {
    top: 15%;
    width: 60%;
    margin: auto;
    right: 0;
    margin-top: -81px;
  }
  .index .section4-left-content-container .collection {
    width: 100%;
  }

  .index .section-left-content-title-container {
    margin-bottom: 60px;
    font-size: 3em;
    text-align: right;
    padding-right: 10%;
    color: #ff83ad;
  }
  .index .section-4 .collection-header .section-left-content-sub-title-container {
  width: 75%;
  }

  .index .section-3-mobile-content-bg {
    margin-top: 45px;
  }
  .index .section-3 .section3-right-content-container {
    top:5px;
  }
	
  .index .section5-mobile-content-bg {
    margin-top: 45px;
  }
  .index .section-5 .section5-right-content-container {
    top:5px;
  }
	
	
  .index .section-4 .collection.with-header .collection-item {
    width: 71%;
	background-color: transparent;
  	padding: 5px;
	margin-left: 0;
  }
  .index .section-4 .section4-left-content-container {
    left: 10%;
    width: 60%;
  }

  .index .section-4 .section4-right-container {
    text-align: center;
    position: relative;
    width: 100%;
  }

  .index .section-4 .section4-right-container img {
    min-width: 90%;
    margin-top: -50%;
  }

  .index .section-4 .section4-right-container img {
    min-width: 60%;
    max-width: 60%;
    margin-top: -20%;
    margin-left: 0;
  }
.index .section-4 .chip.know-more-link {
  margin-left: 30%;
}
  /* corporate */
  .corporate #section-5 {
    min-height: 820px;
  }
  .corporate .carousel.carousel-slider {
    min-height: 820px;
  }
  .corporate #section-5 .section-5-slide-bg {
    text-align: center;
    display: block;
    width: 50%!important;
    position: relative;
    background-image: url(../../images/corporate/section5/mobile/section5-mobile-2-bg.html);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100%;
    margin: auto;
    height: 100%;
    padding: 0!important;
    margin-top: 50px;
  }

  .corporate .slide-content {
    float: none;
    float: initial;
  }
  .corporate .slide-text-bg {
    margin-top: 0;
    margin-left: 0;
  }
  .corporate .slide-content-wrapper {
    display: block;
    padding-top: 20%;
    font-size: 0.8em;
  }
  .corporate .slide-content-image {
    display: block;
    width: 100%;
  }
  .index .banner-item {
    width: 100%;
  }
}
@media only screen and (min-width: 668px) and (max-width: 768px) {
.index .section-1 .chip.know-more-link {
  margin-left: 38%;
}
.index .section-2 .chip.know-more-link {
  margin-left: 55%;
}
}

@media only screen and (max-width: 667px) {
  /* csr */
  .csr-detail .csr-detail-container {
    display: inline-flex;
    flex-direction: column;
  }
  .csr-detail .left-container {
    order: 2;position:  relative; top:0px
  }
  .csr-detail .right-container {
    order: 1;
    margin-top: 30px;
  }
 
  /* end csr */

  /* history proposal joinus news */
  .left-title-flag-wrapper {
    top: 14vw;
  }
  .left-title-flag-img {
    width: 35%;
  }

  .news .news-title-wrapper {
    top: 14vw;
    font-size: 0.9rem;
    left: 7vw;
  }
  .news .news-title-img {
    width: 40%;
  }
  .ball-bg-body-container > div {
    margin-top: 30px;
  }

  .history .history-title-wrapper {
    top: 14vw;
    font-size: 0.9rem;
    left: 7vw;
  }
  .history .history-title-img {
    width: 40%;
    margin: 30px 0 40px;
  }

  .history .history-partial-header {
    height: 50px;
    margin: 60px 0 40px 0;
  }
  .history .history-partial-image-container {
    width: 40%;
    top: -35px;
  }
  .history .history-partial-image-caption {
    font-size: 1em;
  }

  .history .history-partial-container .history-partial-body {
    padding: 0 0 0 50px;
  }

  .history .history-partial-content li {
    padding: 10px 0;
    display: table;
  }
  .history span.history-partial-content-item-month {
    display: table-cell;
    width: 20%;
  }
  .history .history-partial-container ~ .history-partial-container {
    padding: 0;
  }
  .history .history-partial-container .history-partial-body:last-child {
    padding-bottom: 0;
  }
  .history .history-partial-container .history-flower {
    top: 35px;
    left: -3.5%;
  }
  .history .history-partial-container .history-flower.first-flower {
    top: 16px;
  }
  .history .orange-border-left .history-partial-content-header {
    font-size: 1.7em;
  }

  .joinus .job-select.valign-wrapper {
    display: block;
  }
  .joinus .job-list-table-title {
    padding: 0;
    border-bottom: 1px solid #bfbaba;
  }
  .joinus .benefit-title .joinus .job-headline, .joinus .job-list-table-title {
    font-size: 1.5em;
    font-weight: 300;
  }
  .joinus .benefit-title {
    padding-left: 10px;
  }
  .joinus .job-list-table-title {
    padding-bottom: 10px;
  }
  .joinus .job-list-container {
    margin: auto;
  }

  .joinus .benefit-container {
    margin-bottom: 65px;
  }

  .joinus .job-count {
    display: none;
  }
  .joinus .job-title {
    display: block;
    font-size: 1.3em;
    color: forestgreen;
  }
  .joinus .job-category {
    display: none;
  }
  .joinus .job-experience {
    display: block;
  }
  .joinus .job-education {
    display: none;
  }
  .joinus .job-area {

  }
  .joinus .clickable-row {
    margin-top: 5px;
    padding-bottom: 5px;
  }

  .joinus .job-list-table thead {
    display: none;
  }

  .joinus .job-list-table .job-title {
    display: block;
  }

  .joinus .job-list-table table>tbody>tr>td {
    padding: 0;
  }

  .joinus .job-list-table table.striped>tbody>tr:nth-child(odd) {
    background: none;
  }

  .joinus .clickable-row {
    position: relative;
  }
  .joinus .job-more {
    display: block;
    position: absolute;
    right: 0;
    top: 40%;
  }
  .joinus .job-more img {
    width: 15px;
  }

  .joinus .pagination-container {
    margin-top: 20px;
  }

  .proposal .proposal-container {
    display: block;
  }
  .proposal .proposal-title-wrapper {
    top: 18vw;
    font-size: 0.6em;
  }
  .proposal-title-img {
    width: 40%;
  }
  .proposal .proposal-left {
    padding: 0;
  }

  /* end history proposal joinus news */

  /* index */
  .index #section-0 {
    min-height: 600px;
  }
  .collection-item {
    font-weight: 200;
  }
  .index .section1-right-content-container .collection {
    width: 100%;
  }
  .index .section-2 {
    min-height: 780px;
  }
  .index .section-2 .section2-left-container img {
    width: 90%;
    margin-top: 35px;
  }
  .index .section2-left-content-title-container {
    margin-bottom: 15%;
  }
  .index .section-2 .collection.with-header .collection-item {
    font-size: 1.1em;
  }
  .index .section2-left-content-container {
    top: 0;
  }
  .index .section2-left-content-container .collection {
    width: 90%;
    top: 15px;
  }
  .index .section-2 .section2-right-container {
    margin-top: -220px;
  }
  .index .section-2 .collection-item.know-more-link-li {
    margin-right: 0!important;
    text-align: center!important;
    margin-top: initial!important;
	display:block;
	width:32%;
	margin-left:30%;
  }

  .index .section-3 .section3-left-container-wrapper {
    height: auto;
    height: initial;
    min-height: 119px;
  }
  .index .section-3 .section3-right-content-container-wrapper {
    position: relative;
    height: auto;
    height: initial;
    width: 100%;
    top:0;
    background: none;
  }

  .index .section-3 .section3-right-content-container {
    top: -49px;
  }

  .index .section3-right-content-title-container {
    margin-left: 5%;
  }
	
	
 .index .section-5 .section5-left-container-wrapper {
    height: auto;
    height: initial;
    min-height: 85px;
  }
  .index .section-5 .section5-right-content-container-wrapper {
    position: relative;
    height: auto;
    height: initial;
    width: 100%;
    top:0;
    background: none;
  }

  .index .section-5 .section5-right-content-container {
    top: -75px;
  }

  .index .section5-right-content-title-container {
    margin-left: 5%;
  }


  .index .section1-content-container img {
    width: 90%;
  }
  .index .section-2 .collection-item.know-more-link-li {
    padding-top: 0!important;
  }
  .index .section-3-mobile-content-bg {
    margin-top: 50px;
  }
  .index .section3-right-content-title-container {
    margin-bottom: 15%;
  }
  .index .section-3 .collection.with-header .collection-item {
    font-size: 1.1em;
    text-align: left;
    line-height: 1.6em;
  }
	
	
   .index .section5-mobile-content-bg {
    margin-top: 50px;
  }
  .index .section5-right-content-title-container {
    margin-bottom: 15%;
  }
  .index .section-5 .collection.with-header .collection-item {
    font-size: 1.1em;
    text-align: left;
    line-height: 1.6em;
  }

  .index .section-4 .section4-left-container-wrapper img {
    width: 90%;

  }
  .index .section-3 .collection-item.know-more-link-li {
    margin-left: 53px!important;
    text-align: right!important;
    margin-top: 0!important;
  }
  .index .section-3 .section3-left-container-wrapper .section-3-people-img {
    width: 90%;
  }
	
  .index .section-5 .collection-item.know-more-link-li {
    margin-left: 53px!important;
    text-align: right!important;
    margin-top: 0!important;
  }
  .index .section-5 .section5-left-container-wrapper .section-5-people-img {
    width: 95%; 
	left: 0; 
	bottom: 0
  }

  .index .section-4 .section4-left-content-container {
    left: 10%;
    width: 90%;
  }
  .index .section4-left-content-container .collection {
    padding-left: 5%;
    top: -7px;
  }
  .index .section-4 .collection.with-header .collection-item {
    font-size: 1.1em;
    line-height: 1.6em;
  }

  .index .section-4 .collection-item.know-more-link-li {
    text-align: right!important;
    margin-top: 0!important;
    padding-top: 0px;
  }

  .index .section-4 .section4-right-container img {
    min-width: 90%;
    margin-top: -60%;
    position: relative;
  }

  .index .banner-container {
    text-align: center;
    padding: 0 5%;
  }


  /* corporate */

  .corporate .right-header-container {
    width: 50%;
  }

  .corporate .right-title-container {
    top: 21vw;
    font-size: 0.9em;
    font-weight: normal;
    right: 4%;
  }

  .corporate .top-left-title-container {
    width: 50%;
  }

  .corporate .left-title-container {
    top: 21vw;
    font-weight: normal;
    font-size: 1em;
  }

  .corporate .section-3-title-container .top-title-container {
    line-height: 5vw;
  }

  .corporate .flash-logo {
    top:35%;
    font-size:1.9em;
  }

  .corporate .flash-logo:nth-child(2) {
    top:45%;
    font-size:1.9em;
  }

  .corporate #section-0 .bottom-image-content {
    font-size: 0.4em;
    opacity: 1;
    font-weight: 200;
  }
  .corporate #section-0 .bottom-image-content {
    right: 5%;
    bottom: 5px;
  }

  .corporate #section-0 .bottom-image-container {
    width: 50%;
  }

  .corporate #section-2 {
    min-height: 940px;
  }

  .corporate .section-2-big-bg {
    position: absolute;
    width: 100%;
    bottom: 0;
  }

  .corporate .square-content {
    color: #585A59;
    font-size: 0.9em;
  }

  .corporate .section2-square2 {
    transform: rotate(5deg);
  }

  .section2-square4 {
    transform: rotate(5deg);
  }

  .corporate .rotate_to_0deg {
    will-change: transform;
    transform: rotate(0deg);
  }

  .corporate .rotate_to_5deg {
    will-change: transform;
    transform: rotate(5deg);
  }

  .corporate .section2-square1-container {
    width: 50%;
    top: 65px;
    left: 3%;
  }

  .corporate .section2-square2-container {
    width: 55%;
    top: 214px;
    right: 7%;
    left: auto;
    left: initial;
  }

  .corporate .section2-square3-container {
    width: 59%;
    top: 335px;
    left: 3%;
  }

  .corporate .section2-square4-container {
    width: 51%;
    top: 481px;
    right: 6%;
    left: auto;
    left: initial;
  }

  .corporate .section2-square2-content-body {
    right: 20%;
  }

  .corporate .section2-square4-content-body {
    right: 5%;
  }

  .corporate #section2 .people-cover {
    background-position: static;
    background-position: initial;
    background-repeat: no-repeat;
    background-position-y: 0;
  }

  .corporate .section2-poeple-bottom-cover {
    transform: translate(100px, 100px);
  }

  .corporate .people-cover {
    background-position: bottom;
  }
  .corporate .section-2-people {
    display: none;
  }

  .corporate .section-2-people-mobile {
    display: block;
    width: 75%;
    position: absolute;
    bottom: 0;
  }

  .corporate .section-4-big-bg {
    position: static;
    position: initial;
    padding-top: 27vh;
    text-align: center;
  }

  .corporate #section-5 .section-5-slide-bg {
    width: 90% !important;
    margin-top: 20%;
  }

  .corporate #section-5 .left-title-container {
    top:23vw;
    line-height: 2em;
  }

  .corporate #section-6 {
    padding-top: 45%;
  }



  .footer-icon {
    display: table;
    margin: 0 auto;
    margin-bottom: 10px;
    width: auto!important;
    width: initial!important;
    height: auto!important;
    height: initial!important;
    background: initial!important;
  }

  footer .footer-icon-container {
    margin-bottom: 0;
  }

  footer .icon-font {
    font-size: 24px;
    margin-bottom: 10px;
    margin-top: 0px;
    float: left;
    margin-right: 15px;
  }
  footer .icon-font span {
    line-height: 24px;
  }
}
@media only screen and (min-width: 360px) and (max-width: 425px) {
.index .section-2 .chip.know-more-link {
  margin-left: 40%;
}
.index .section-2 .collection.with-header .collection-item {
  width: 78%;}

.index .section-3 .chip.know-more-link {
  margin-left: 30%;
}
.index .section-3 .collection.with-header .collection-item {
  width: 65%;}
 .index .section-4 .chip.know-more-link {
  margin-left: 30%;
}
.index .section-4 .collection.with-header .collection-item {
  width: 77%;}
	
.index .section-5 .chip.know-more-link {
  margin-left: 30%;
}
.index .section-5 .collection.with-header .collection-item {
  width: 65%;}
	
}
	
	
@media only screen and (max-width: 330px) {
  .index .index-top-news-content-body-container,
  .index .section1-right-content-container .collection,
  .index .section2-left-content-container .collection,
  .index .section3-right-content-container .collection,
  .index .section5-right-content-container .collection,
  .index .section4-left-content-container .collection {
    font-size: 0.8em;
  }

  .index .section-1 {
    margin-top: 35px;
  }

  .index .section1-right-content-container .collection {
    margin-top: -35px;
  }
  /*--
  .index #section-0 table td:nth-child(2) {
    white-space: normal;
  }
  --*/

  .index .section1-icon-holder {
    padding: 0;
  }
  .index .section-2 {
    min-height: 670px;
  }
  .index .section-2 .row {
    margin-bottom: 0;
  }
  .index .section-2 .section2-right-container img {
    margin-top: -25%;
  }
  .index .section-3 .section3-left-container-wrapper {
    min-height: 114px;
  }
  .index .section-4 .section4-right-container img {
    margin-top: -75%;
  }
  .index .section-4 .section4-left-container-wrapper {
    margin-top: 17%;
  }
	
  .index .section-5 .section3-left-container-wrapper {
    min-height: 114px;
  }
	
	
}




/*----------------------------------
	table
----------------------------------*/
.red{ color:#F00; margin:0; padding:0}
table{margin:10px auto;width:100%; clear:both}
table th{
  vertical-align: middle; color:#4a454a;
  text-align: center;
  background:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2VjZWNlYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fff), color-stop(100%, #fbfafa));
  background: -webkit-linear-gradient(top, #fff, #fbfafa);
  background: -moz-linear-gradient(top, #fff, #fbfafa);
  background: -o-linear-gradient(top, #fff, #fbfafa);
  background: -ms-linear-gradient(top, #fff, #fbfafa);
  background: linear-gradient(top, #fff, #fbfafa);
  text-align:center;font-size:110%;color:#525252;}
table h4{
	line-height: 1.88em;
	padding-top: 10px;
	font-size: 0.95em;
	font-weight: 900;
}
table td.left{text-align:left; vertical-align: middle;padding: 10px 15px;}
table td.center{
	text-align: center;vertical-align: middle
}
table td ul{margin-top:10px;margin-left:15px;}
table td ul li{;margin-bottom:10px; text-align:left; padding-right:1%}
table td ul li.remark{ font-size:0.83em
}
table th {
  border: 1px solid #e9e8e8;
  padding: 15px 10px; font-size:0.95em; line-height:160%;
}
table td {
  border: 1px solid #e9e8e8;
  padding:10px 15px;
  line-height:2.0em; font-size:0.95em
}
table dl {
	width: 100%;
	float: left;
	text-align: left;	
}
table dl dt {width:100%;}
table dl dt img{float:left; width:auto; margin:5% auto; display: block;}
table dl dt h4{width:auto;font-size:0.95em;font-weight:bold;line-height:1.5em;display:block; padding-left:20%; }
table dl dd{ text-align:left; padding-left:20%;
}
table td p{margin:0 auto; text-align:left;}
table td p img{ float:left; display: block;}
table td p.span{ font-size:1.25em
}
table td p.center{
	text-align: center;vertical-align: middle;
}
@media screen and (max-width: 736px) {
table{margin:0; width:100%; clear:both}
table tr {
	display: block;
	
  }
table th {
	display: block;
	text-align: left;
	margin-bottom: 10px;
	background: #fff;
	padding: 10px 12px;
	color: #999;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: dotted;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #CCCCCC;
	border-left-color: #FFFFFF;	
  }


table td {
	display: marker;
	border: none;
	text-align: left;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #fff;
	padding-top: 0px;
	padding-right: 15px;
	padding-bottom: 30px;
	padding-left: 0px;
  }

table tr td.list {display:list-item;margin-left:0px;margin-top:0px;}
table tr td.state {
    font-weight: bold;
  }
table td.center{
	text-align: left;vertical-align: middle
}

	}
@media screen and (max-width: 540px) {
	}


input#code {
	width: 60%;
    color: rgb(153, 153, 153);
}

@media screen and (max-width: 540px) {
	width: 100%;}

	}
.left{float:left }/*---------影響TABLE----------*/

label{font-size:0.8rem;color:#9e9e9e}::-webkit-input-placeholder{color:#d1d1d1}:-moz-placeholder{color:#d1d1d1}::-moz-placeholder{color:#d1d1d1}:-ms-input-placeholder{color:#d1d1d1}
input:not([type]),input[type=text],input[type=password],input[type=email],input[type=url],input[type=time],input[type=date],input[type=datetime],input[type=datetime-local],input[type=tel],input[type=number],input[type=search],textarea.materialize-textarea{background-color:transparent;border:none;border-bottom:1px solid #9e9e9e;border-radius:0;outline:none;height:3rem;width:100%;font-size:1rem;margin:0 0 20px 0;padding:0;box-shadow:none;box-sizing:content-box;transition:all 0.3s}input:not([type]):disabled,input:not([type])[readonly="readonly"],input[type=text]:disabled,input[type=text][readonly="readonly"],input[type=password]:disabled,input[type=password][readonly="readonly"],input[type=email]:disabled,input[type=email][readonly="readonly"],input[type=url]:disabled,input[type=url][readonly="readonly"],input[type=time]:disabled,input[type=time][readonly="readonly"],input[type=date]:disabled,input[type=date][readonly="readonly"],input[type=datetime]:disabled,input[type=datetime][readonly="readonly"],input[type=datetime-local]:disabled,input[type=datetime-local][readonly="readonly"],input[type=tel]:disabled,input[type=tel][readonly="readonly"],input[type=number]:disabled,input[type=number][readonly="readonly"],input[type=search]:disabled,input[type=search][readonly="readonly"],textarea.materialize-textarea:disabled,textarea.materialize-textarea[readonly="readonly"]{color:rgba(0,0,0,0.26);border-bottom:1px dotted rgba(0,0,0,0.26)}input:not([type]):disabled+label,input:not([type])[readonly="readonly"]+label,input[type=text]:disabled+label,input[type=text][readonly="readonly"]+label,input[type=password]:disabled+label,input[type=password][readonly="readonly"]+label,input[type=email]:disabled+label,input[type=email][readonly="readonly"]+label,input[type=url]:disabled+label,input[type=url][readonly="readonly"]+label,input[type=time]:disabled+label,input[type=time][readonly="readonly"]+label,input[type=date]:disabled+label,input[type=date][readonly="readonly"]+label,input[type=datetime]:disabled+label,input[type=datetime][readonly="readonly"]+label,input[type=datetime-local]:disabled+label,input[type=datetime-local][readonly="readonly"]+label,input[type=tel]:disabled+label,input[type=tel][readonly="readonly"]+label,input[type=number]:disabled+label,input[type=number][readonly="readonly"]+label,input[type=search]:disabled+label,input[type=search][readonly="readonly"]+label,textarea.materialize-textarea:disabled+label,textarea.materialize-textarea[readonly="readonly"]+label{color:rgba(0,0,0,0.26)}input:not([type]):focus:not([readonly]),input[type=text]:focus:not([readonly]),input[type=password]:focus:not([readonly]),input[type=email]:focus:not([readonly]),input[type=url]:focus:not([readonly]),input[type=time]:focus:not([readonly]),input[type=date]:focus:not([readonly]),input[type=datetime]:focus:not([readonly]),input[type=datetime-local]:focus:not([readonly]),input[type=tel]:focus:not([readonly]),input[type=number]:focus:not([readonly]),input[type=search]:focus:not([readonly]),textarea.materialize-textarea:focus:not([readonly]){border-bottom:1px solid #b1b1b1;box-shadow:0 1px 0 0 #666666}





input:not([type]):focus:not([readonly])+label,input[type=text]:focus:not([readonly])+label,input[type=password]:focus:not([readonly])+label,input[type=email]:focus:not([readonly])+label,input[type=url]:focus:not([readonly])+label,input[type=time]:focus:not([readonly])+label,input[type=date]:focus:not([readonly])+label,input[type=datetime]:focus:not([readonly])+label,input[type=datetime-local]:focus:not([readonly])+label,input[type=tel]:focus:not([readonly])+label,input[type=number]:focus:not([readonly])+label,input[type=search]:focus:not([readonly])+label,textarea.materialize-textarea:focus:not([readonly])+label{color:#999999}
input:not([type]).valid,input:not([type]):focus.valid,input[type=text].valid,input[type=text]:focus.valid,input[type=password].valid,input[type=password]:focus.valid,input[type=email].valid,input[type=email]:focus.valid,input[type=url].valid,input[type=url]:focus.valid,input[type=time].valid,input[type=time]:focus.valid,input[type=date].valid,input[type=date]:focus.valid,input[type=datetime].valid,input[type=datetime]:focus.valid,input[type=datetime-local].valid,input[type=datetime-local]:focus.valid,input[type=tel].valid,input[type=tel]:focus.valid,input[type=number].valid,input[type=number]:focus.valid,input[type=search].valid,input[type=search]:focus.valid,textarea.materialize-textarea.valid,textarea.materialize-textarea:focus.valid{border-bottom:1px solid #4CAF50;box-shadow:0 1px 0 0 #4CAF50}


input:not([type]).valid+label:after,input:not([type]):focus.valid+label:after,input[type=text].valid+label:after,input[type=text]:focus.valid+label:after,input[type=password].valid+label:after,input[type=password]:focus.valid+label:after,input[type=email].valid+label:after,input[type=email]:focus.valid+label:after,input[type=url].valid+label:after,input[type=url]:focus.valid+label:after,input[type=time].valid+label:after,input[type=time]:focus.valid+label:after,input[type=date].valid+label:after,input[type=date]:focus.valid+label:after,input[type=datetime].valid+label:after,input[type=datetime]:focus.valid+label:after,input[type=datetime-local].valid+label:after,input[type=datetime-local]:focus.valid+label:after,input[type=tel].valid+label:after,input[type=tel]:focus.valid+label:after,input[type=number].valid+label:after,input[type=number]:focus.valid+label:after,input[type=search].valid+label:after,input[type=search]:focus.valid+label:after,textarea.materialize-textarea.valid+label:after,textarea.materialize-textarea:focus.valid+label:after{content:attr(data-success);color:#4CAF50;opacity:1}

input:not([type]).invalid,input:not([type]):focus.invalid,input[type=text].invalid,input[type=text]:focus.invalid,input[type=password].invalid,input[type=password]:focus.invalid,input[type=email].invalid,input[type=email]:focus.invalid,input[type=url].invalid,input[type=url]:focus.invalid,input[type=time].invalid,input[type=time]:focus.invalid,input[type=date].invalid,input[type=date]:focus.invalid,input[type=datetime].invalid,input[type=datetime]:focus.invalid,input[type=datetime-local].invalid,input[type=datetime-local]:focus.invalid,input[type=tel].invalid,input[type=tel]:focus.invalid,input[type=number].invalid,input[type=number]:focus.invalid,input[type=search].invalid,input[type=search]:focus.invalid,textarea.materialize-textarea.invalid,textarea.materialize-textarea:focus.invalid{border-bottom:1px solid #F44336;box-shadow:0 1px 0 0 #F44336}input:not([type]).invalid+label:after,input:not([type]):focus.invalid+label:after,input[type=text].invalid+label:after,input[type=text]:focus.invalid+label:after,input[type=password].invalid+label:after,input[type=password]:focus.invalid+label:after,input[type=email].invalid+label:after,input[type=email]:focus.invalid+label:after,input[type=url].invalid+label:after,input[type=url]:focus.invalid+label:after,input[type=time].invalid+label:after,input[type=time]:focus.invalid+label:after,input[type=date].invalid+label:after,input[type=date]:focus.invalid+label:after,input[type=datetime].invalid+label:after,input[type=datetime]:focus.invalid+label:after,input[type=datetime-local].invalid+label:after,input[type=datetime-local]:focus.invalid+label:after,input[type=tel].invalid+label:after,input[type=tel]:focus.invalid+label:after,input[type=number].invalid+label:after,input[type=number]:focus.invalid+label:after,input[type=search].invalid+label:after,input[type=search]:focus.invalid+label:after,textarea.materialize-textarea.invalid+label:after,textarea.materialize-textarea:focus.invalid+label:after{content:attr(data-error);color:#F44336;opacity:1}input:not([type]).validate+label,input[type=text].validate+label,input[type=password].validate+label,input[type=email].validate+label,input[type=url].validate+label,input[type=time].validate+label,input[type=date].validate+label,input[type=datetime].validate+label,input[type=datetime-local].validate+label,input[type=tel].validate+label,input[type=number].validate+label,input[type=search].validate+label,textarea.materialize-textarea.validate+label{width:100%;pointer-events:none}


input:not([type])+label:after,input[type=text]+label:after,input[type=password]+label:after,input[type=email]+label:after,input[type=url]+label:after,input[type=time]+label:after,input[type=date]+label:after,input[type=datetime]+label:after,input[type=datetime-local]+label:after,input[type=tel]+label:after,input[type=number]+label:after,input[type=search]+label:after,textarea.materialize-textarea+label:after{display:block;content:"";position:absolute;top:60px;opacity:0;transition:.2s opacity ease-out, .2s color ease-out}.input-field{position:relative;margin-top:1rem}

.input-field.inline{display:inline-block;vertical-align:middle;margin-left:5px}
.input-field.inline input,.input-field.inline .select-dropdown{margin-bottom:1rem}
.input-field.col label{left:0.75rem}
.input-field.col .prefix ~ label,.input-field.col .prefix ~ .validate ~ label{width:calc(100% - 3rem - 1.5rem)}
.input-field label{color:#9e9e9e;position:absolute;top:0.8rem;left:0;font-size:1rem;cursor:text;transition:.2s ease-out}
.input-field label.active{font-size:0.8rem;-webkit-transform:translateY(-140%);transform:translateY(-140%)}
.input-field .prefix{position:absolute;width:3rem;font-size:2rem;transition:color .2s}
.input-field .prefix.active{color:#999999 }
.input-field .prefix ~ input,.input-field .prefix ~ textarea,.input-field .prefix ~ label,.input-field .prefix ~ .validate ~ label,.input-field .prefix ~ .autocomplete-content{margin-left:3rem;width:92%;width:calc(100% - 3rem)}
.input-field .prefix ~ label{margin-left:3rem}
@media only screen and (max-width: 992px){.input-field .prefix ~ input{width:86%;width:calc(100% - 3rem)}}
@media only screen and (max-width: 600px){.input-field .prefix ~ input{width:80%;width:calc(100% - 3rem)}}
.input-field input[type=search]{display:block;line-height:inherit;padding-left:4rem;width:calc(100% - 4rem)}
.input-field input[type=search]:focus{background-color:#fff;border:0;box-shadow:none;color:#444}.
input-field input[type=search]:focus+label i,.input-field input[type=search]:focus ~ .mdi-navigation-close,.input-field input[type=search]:focus ~ .material-icons{color:#444}
.input-field input[type=search]+label{left:1rem}
.input-field input[type=search] ~ .mdi-navigation-close,.input-field input[type=search] ~ .material-icons{position:absolute;top:0;right:1rem;color:transparent;cursor:pointer;font-size:2rem;transition:.3s color}textarea{width:100%;height:3rem;background-color:transparent}

textarea.materialize-textarea{overflow-y:hidden;padding:.8rem 0 1.6rem 0;resize:none;min-height:3rem}

/*修正 合作提案顯示*/
label.required::after {
  content: ' *'!important;
  color: red!important;
  display: inline!important;
  position: static!important;
  top: 0!important;
  opacity: 1!important;
}

p.required-text::before {
  content: ' *'!important;
  color: red!important;
  display: inline!important;
  position: static!important;
  top: 0!important;
  opacity: 1!important;
}