html, body {
        width: 100%;
        position: relative;
        text-decoration: none;
        list-style:none;
    }
    body {
    line-height: 1.8;
    font: 14px "Lato", "Arial", sans-serif, "微軟正黑體", "Microsoft JhengHei";
    letter-spacing: 2px;
    margin: 0px;
    }

input:focus{ 
outline: 0;
 }


select:focus{ 
outline: 0;
 }

    body a {
    text-decoration: none;
    }


ul {
      padding-left: 0px;
}


/* header */   

.navabar-menu-main {
  margin-top: 30px;
}



.logo img {
  margin: 25px 10px;
    width: 250px;
}


article { 
    width: 100%;
    height: 85px; 
    background-color: #f9f9f9;
 }


.first-menu {　
    height: 100%;
    width: 65%;
    float: left;
    font-size: 30px;
}



.href {
    text-align: center;
    width: 15%;
    float: left;
    padding: 50px 0; 
}


.href li {
    float: left;
    width: 25%;
    padding: 0 10px; 
}








 .navabar-menu-main li {
    padding: 0 45px !important;
}
 




@media  (max-width: 1410px) { 
.menu-one {
    width: 90% !important;
    float: right;
    text-align: center;
    margin: 10px 0;
}
 }


@media  (max-width: 1100px) { 
.navabar-menu-main li {
    padding: 0 30px !important;
}
 }

@media (max-width: 940px) { 
.navabar-menu-main li {
    padding: 0 25px !important;
}
}


@media  (max-width: 1772px) { 
  .navabar-menu-main li {
    letter-spacing: 5px !important;
}
.first-menu {
    width: 65%;
}
.href {
    width: 15%;
}
.logo img {
    width: 220px;
}
 }







@media only screen and (max-width: 768px) {  
article .logo img {  
  margin: 10px 0;
  width: 150px;
 }
.logo { 
  float: left;
  clear: left;
  text-align: center;
  width: 100%;
 }

}

@media only screen and (max-width: 300px) {  
article .logo img {  
  margin: 10px 0 10px 40px;
  width: 150px;
 }

}





@media only screen and (min-width: 768px) { 
article .logo img {  
  margin: 10px 0;
  width: 150px;
 }


.logo { 
  float: left;
  clear: left;
  text-align: right;
  width: 20%;
 }
}




.menu-one {  
  width: 80%;
  float: right;
  text-align: center;
  margin: 10px 0;
 }




.navabar-menu-main li {
    color: #092c58;
    float: left;
    padding: 0 1.5em;
    position: relative;
    letter-spacing: 0.3em;
    font-weight: bold;
}

.navabar-menu-main li:nth-child(1) {
    border-left: none;
}



.navabar-menu-main li a, .navabar-menu-main .navabar-menu-main-group-item a {
    color: #000000;
    font-size: 22px;
        text-decoration: none;
}


.navabar-menu-main li a:hover, .navabar-menu-main li .active {
    padding-bottom: 3px;
    border-bottom: 0.25em solid #ee5f26;
    text-decoration: none;
}



/* menu */

.fa-lightbulb-o {
  font-size: 28px !important;
  padding: 8px 10px;
}





label i {
    margin: 0 20px 0 0;
    font-size: 20px !important;
    border-radius: 100px;
    background: #ffffff;
    color: #000000;
    padding: 8px;
}

.wrapper {
  width: 100%;
  height: 100%;
}



@media only screen and (max-width: 1215px) {  
article .first-menu  {
    display: none;
}
}




 /* 左側 下拉選單 */



a:hover, a:focus {
  text-decoration:none !important;
}


.gn-menu-main a:hover { 
color:  #ee5f26;
 }


.member {
  padding: 10px!important;
  text-align: center;
}

.member i {
  color: #1d2974;
  margin: 0  10px;
}



.menu-down {　
  width: 100%;
  height: 100%;
  text-align: left;
  line-height: 250%;
}

 label {
    background: #ffffff;
    color: #000000;
    padding: 5px 10px;
    display: block;
    margin: 0;
}

input[type="checkbox"].on-off-1{
    display: none;
}

input[type="checkbox"].on-off-2{
    display: none;
}

input[type="checkbox"].on-off-3{
    display: none;
}
input[type="checkbox"].on-off-4{
    display: none;
}
input[type="checkbox"].on-off-5{
    display: none;
}
input[type="checkbox"].on-off-6{
    display: none;
}
input[type="checkbox"].on-off-7{
    display: none;
}
input[type="checkbox"].on-off-8{
    display: none;
}
input[type="checkbox"].on-off-9{
    display: none;
}
input[type="checkbox"].on-off-10{
    display: none;
}





.menu-down ul {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    margin: 0;
    padding: 0;
    list-style: none;
}

.menu-down li {
    padding: 5px;
}

input[type="checkbox"].on-off-1 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-1:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-2 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-2:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-3 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-3:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-4 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-4:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-5 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-5:checked + ul{
    height: 100px;
    padding-left: 70px;
    background-color: #ffffff;
}

input[type="checkbox"].on-off-6+ ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-6:checked + ul{
    height: 500px;
    padding: 0 60px;
    background-color: #ffffff;
}

input[type="checkbox"].on-off-7 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-7:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-8 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-8:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-9 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-9:checked + ul{
    height: 290px;
    padding: 0 30px;
}

input[type="checkbox"].on-off-10 + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off-10:checked + ul{
    height: 290px;
    padding: 0 30px;
}





/* menu icon */ 

.gn-menu2 {
  width: 100%;
  margin: 40px 0 40px 40px !important;
}

.gn-menu2 li {
  float: left;
    width: 25%;
}







/* footer */



footer { 
  width: 100%;
  clear: left; 
  color: #000000;
}


footer ul {
  padding-left: 0px;
}


footer div {
  float: left;
    width: 33.3%;
}

footer .qr-code li {
    float: left;
    width: 50%;
    text-align: center;
}

footer .text li {
    padding: 20px 0;
}



@media  (max-width: 912px) {  
footer div {
    float: none;
    width: 100%;
}
 }

footer div:nth-child(1) li {
  text-align: center;
}

footer div:nth-child(2) li {
  text-align: center;
}


/* top title */



@media only screen and (min-width: 769px) and (max-width: 1216px) { 
.data_1 { 
width: 600px;
 }
 }




.data_1 { 
width: 100%;
 }

 .data_1 .type_1 { 
width: 100%;
  }



@media only screen and (min-width: 769px) { 
.type_2 { 
display: none;
 }
 }


@media only screen and (max-width: 768px) { 
.type_1 { 
display: none;
 }
 }




.type_1 img {
  width: 100%;　
}


.type_2 img { 
margin-top: 60px;
width: 100%;
 }








/* news */ 

.news span {
    color: #0f2149;
    font-size: 23px;
    font-weight: bold;
}

.news {
      width: 100%;
    margin-top: 40px;
}


.news .news-img{
     float: left;
    width: 50%;
    text-align: right;
}


.news .news-text{
     float: left;
    width: 50%;
    padding-right: 200px;
    line-height: 30px;
    text-align: justify;
    font-size: 16px;
}




.news .news-img img{
        width: 620px;
    margin: 0 40px;
}




.news .news-text p{
    margin: 35px 0;
}

   
@media  (max-width: 1740px) {  
.news .news-img img {
    width: 715px;
}
 }




@media  (max-width: 1570px) {  
.news .news-img img {
    width: 650px;
}
 }


 @media  (max-width: 1542px) {  
.news .news-img img {
    width: 635px;
}
.news .news-text {
    padding-right: 40px;
}
 }





 @media  (max-width: 1420px) {  
.news .news-img img {
    width: 585px;
}
.news .news-text {
    line-height: 25px;
    font-size: 15px;
}
 }




 @media  (max-width: 1351px) {  
.news .news-text p {
    margin: 25px 0;
}
 }


  @media  (max-width: 1300px) {
.news .news-img img {
    width: 500px;
}
.news .news-text {
    line-height: 20px;
    font-size: 15px;
}
 }




  @media  (max-width: 1150px) {
.news .news-img img {
    width: 500px;
}
.news .news-text {
    line-height: 20px;
    font-size: 15px;
}
 }


   @media  (max-width: 1120px) {

.news .news-img{
     float: none;
    width: 100%;
    text-align: center;
}
.news .news-text{
     float: none;
    width: 100%;
    line-height: 30px;
    text-align: justify;
    font-size: 16px;
     padding: 40px 60px;

}
.news .news-img img {
       width: 80%;
      margin: 0;
}
 }


@media  (max-width: 1043px) {
 .news {
    width: 100%;
    margin-top: 120px;
}
 }