@charset "UTF-8";
/* CSS Document */

section, article, aside, footer, header, nav, h2 { display:block;}

body { padding:0; margin:0 auto; color: #414141; font-size:1em; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; background-color: #fff; position: relative;}
img { border:0; display: block;}

html, body { height: 100%; overflow-x: hidden;}

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

div.brk { clear: both;}


/************ video box ************/
.video-container { position:relative; padding-bottom:56.25%; padding-top:30px; width:100%; height: 0px; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%;}


@media screen and (min-width: 1370px) {

  /************ header + nav ************/

  header { width: 100%; height: 100px; padding: 0 calc(50% - 685px); background-color: #fff; display: flex; justify-content: center; align-items: flex-start; box-sizing: border-box; position: relative; z-index: 99;}

  .header-logo-icons { width: 220px;}
  .header-logo-icons img.logo { width: 100%; height: auto; margin: 0 0 20px 0;}
  .header-logo-icons .icons { width: 100%; margin: 0 0 10px 0; display: flex; justify-content: center; align-items: center;}
  .header-logo-icons .icons img.icon { width: 30px; height: auto; margin: 0 5px;}
  .header-logo-icons .tel { width: 100%; color: #42210B; font-size: 1em; font-weight: 600; text-align: center; text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white}

  nav#mo { display: none;}

  nav#pc { width: calc(100% - 220px); margin: 30px 0 0 0;}
  nav#pc ul#nav-1c { padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: center;}
  nav#pc ul#nav-1c li { padding: 0 5px; margin: 0; border-right: 1px #C2986D solid; position: relative;}
  nav#pc ul#nav-1c li:last-child { border-right: 0;}
  nav#pc ul#nav-1c li a { padding: 0 35px 5px 35px; color: #534741; text-decoration: none; border-radius: 20px; background-color: #fff; display: block; cursor: pointer;}
  nav#pc ul#nav-1c li a span.en { font-size: 0.8em; line-height: 1em; font-weight: 300;}
  nav#pc ul#nav-1c li a span.cn { font-size: 1.2em; line-height: 1em; font-weight: 400;}
  nav#pc ul#nav-1c li a:hover { color: #fff; text-align: center; background-color: #42210B;}
  nav#pc ul#nav-1c li a:hover span.cn { font-weight: 600;}
  nav#pc ul#nav-1c li a.sel { color: #fff; text-align: center; background-color: #42210B;}
  nav#pc ul#nav-1c li a.sel span.cn { font-weight: 600;}
  nav#pc ul#nav-1c li ul#nav-2c { width: 140px; padding: 5px 10px; margin: 0; list-style: none; background-color: rgba(255,255,255,0.7); display: none; box-sizing: border-box; position: absolute; top: 50px; left: calc(50% - 70px);}
  nav#pc ul#nav-1c li ul#nav-2c li { width: 100%; padding: 5px 10px; margin: 0; text-align: center; border-bottom: 1px #42210B solid; border-right: 0; box-sizing: border-box;}
  nav#pc ul#nav-1c li ul#nav-2c li:last-child { border-bottom: 0;}
  nav#pc ul#nav-1c li ul#nav-2c li a { padding: 0; color: #42210B; font-size: 1.1rem; text-decoration: none; border-radius: 0; background-color: transparent;}
  nav#pc ul#nav-1c li ul#nav-2c li a:hover { color: #C2986D; background-color: transparent;}


  /************ section#sec-1 ************/

  section#sec-1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.sec-1-bg { width: 100%; height: auto;}
  img.sec-1-text { width: 22.5vw; height: auto; position: absolute; top: 13vw; left: 28vw;}
  img.sec-1-pic { width: 38vw; height: auto; position: absolute; top: 14vw; right: 8vw;}


  /************ section#sec-2 ************/

  section#sec-2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-2-bg { width: 100%; height: auto; margin: -26vw 0 0 0;}

  .sec-2-title { width: 100%; padding: 0 calc(50% - 685px); text-align: center; box-sizing: border-box; position: absolute; top: 20vw; left: 0;}
  .sec-2-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-2-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .sec-2-title .cn-desc { width: 100%; color: #fff; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .sec-2-desc-items { width: 100%; display: flex; justify-content: center; align-items: flex-start; position: absolute; top: 32vw; left: 0;}
  .sec-2-desc-items .item-box { width: 15.5vw; margin: 0 1.2vw;}
  .sec-2-desc-items .item-box img { width: 100%; height: auto;}
  .sec-2-desc-items .item-box .text-w { clear: both; width: 84%; margin: 1vw auto 0 auto; color: #fff; font-size: 1.2vw; line-height: 1.8vw; font-weight: 300; text-align: center;}
  .sec-2-desc-items .item-box .text-y { clear: both; width: 84%; margin: 1vw auto 0 auto; color: #C2986D; font-size: 1.2vw; line-height: 1.8vw; font-weight: 300; text-align: center;}

  .sec2-more-bt { width: 8vw; position: absolute; top: 58vw; left: calc(50% - 4vw);}
  .sec2-more-bt img { width: 100%; height: auto; margin: 0 auto;}

  .hp-about-sec5-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 36vw; left: 12vw;}
  .hp-about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .hp-about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .hp-about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .hp-about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .hp-about-se5-advantage { width: 43.5vw; position: absolute; top: 26vw; right: 12vw;}
  .hp-about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .hp-about-se5-advantage .text-1 { width: 11vw; color: #fff; font-size: 1.2vw; text-align: center; position: absolute; top: 14.5vw; left: 1vw;}
  .hp-about-se5-advantage .text-2 { width: 10vw; color: #fff; font-size: 1.2vw; text-align: center; position: absolute; top: 14.5vw; left: 16.7vw;}
  .hp-about-se5-advantage .text-3 { width: 10vw; color: #fff; font-size: 1.2vw; text-align: center; position: absolute; top: 14.5vw; left: 32vw;}


  /************ section#sec-3 ************/

  section#sec-3 { clear: both; width: 100%; padding: 10vw 0 0 0; margin: -11vw 0 0 0; background-color: #eee; position: relative; z-index: 7;}

  .sec-3-title { width: 100%; padding: 0 calc(50% - 685px); text-align: center; box-sizing: border-box;}
  .sec-3-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-3-title .en-desc-1 { width: 100%; color: #42210B; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-3-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .sec-3-title .cn-desc { width: 100%; color: #1D3757; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .sec-3-prods-list { clear: both; width: 64vw; margin: 2vw auto 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .sec-3-prods-list .prod-box { width: 28vw; margin: 0 2vw 4vw 2vw;}
  .sec-3-prods-list .prod-box .pic { width: 100%;}
  .sec-3-prods-list .prod-box .pic img { width: 100%; height: auto;}
  .sec-3-prods-list .prod-box .type-more { width: 100%; padding: 0.5vw 0; border-bottom: 1px #959595 solid; display: flex; justify-content: flex-start;}
  .sec-3-prods-list .prod-box .type-more .type { width: calc(100% - 8vw); padding: 0.2vw 0 0 0; color: #1D3757; font-size: 1.2vw;}
  .sec-3-prods-list .prod-box .type-more img.more { width: 8vw; height: auto;}
  .sec-3-prods-list .prod-box .name { width: 100%; padding: 0.5vw 7vw 0 0; color: #42210B; font-size: 1.6vw; line-height: 1.8vw; font-weight: 500; box-sizing: border-box;}

  .sec-3-bottom { clear: both; width: 100%; background-color: #fff; position: relative;}
  .sec-3-bottom img.sec-3-bottom-bg { width: 100%; height: auto;}
  .sec-3-bottom img.sec-3-more-bt { width: 2.6vw; height: auto; position: absolute; top: 0; left: calc(50% - 1.3vw);}


  /************ section#sec-4 ************/

  section#sec-4 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-4-bg { width: 100%; height: auto; margin: -5vw 0 0 0;}

  .sec-4-title { width: 38vw; position: absolute; top: 13vw; right: 0;}
  .sec-4-title .en-title { width: 100%; color: #F38F1E; font-size: 5.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-4-title .en-desc-1 { width: 100%; color: #42210B; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-4-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .sec-4-title .cn-desc { width: 100%; color: #1D3757; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .sec-4-news-list { width: 38vw; position: absolute; top: 14.4vw; left: 16vw;}
  .sec-4-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .sec-4-news-list .news-list .news-box { width: 100%; padding: 1.5vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .sec-4-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .sec-4-news-list .news-list .news-box .date { width: 20%; line-height: 1.5vw;}
  .sec-4-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 1.2vw;}
  .sec-4-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 2.4vw; font-weight: 500;}
  .sec-4-news-list .news-list .news-box .title { width: 80%; padding: 1.5vw 0 0 0; font-size: 1.8vw; font-weight: 500; line-height: 2vw;}
  .sec-4-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .sec-4-news-list .news-list .news-box .title a:hover { color: #42210B;}

  .sec-4-news-list img.news-more-bt { clear: both; width: 8vw; height: auto; margin: 3vw 0 0 0;}


  /************ section#sec-5 ************/

  section#sec-5 { clear: both; padding: 3vw 0; width: 100%; position: relative; z-index: 8;}

  .sec-5-title { width: 100%; padding: 0 0 3vw 13vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
  .sec-5-title .column-lf { width: 11vw;}
  .sec-5-title .column-lf .en-title { width: 100%; color: #F38F1E; font-size: 6.8vw; line-height: 6.8vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-5-title .column-rt { width: calc(100% - 11vw);}
  .sec-5-title .column-rt .en-desc-1 { width: 100%; color: #42210B; font-size: 1.1vw; line-height: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-5-title .column-rt .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; line-height: 0.8vw; font-weight: 300;}
  .sec-5-title .column-rt .cn-desc { width: 100%; color: #1D3757; font-size: 2.8vw; line-height: 2.8vw; font-weight: 700;}

  .sec-5-cases-slide { clear: both; width: 80vw; margin: 0 auto;}
  .sec-5-cases-slide .case-box { width: 40vw; padding: 0 0 1vw 0; position: relative;}
  .sec-5-cases-slide .case-box img.case-bg { width: 100%; height: auto; z-index: 1;}
  .sec-5-cases-slide .case-box .title-1 { width: 100%; height: 3.8vw; padding: 0.8vw 0 0 0; color: #42210B; font-size: 1.8vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .title-2 { width: 100%; height: 3.8vw; padding: 0.8vw 0 0 0; color: #fff; font-size: 1.8vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text { width: 100%; padding: 1vw 6vw 1vw 4vw; color: #000; font-size: 1.2vw; line-height: 2.2vw; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap; position: absolute; top: 4vw; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text .icon { width: 1.5vw;}
  .sec-5-cases-slide .case-box .text .list { width: calc(100% - 1.5vw);}
  .sec-5-cases-slide .case-box .more-bt { width: 2.8vw; position: absolute; bottom: 1.3vw; left: calc(50% - 1.4vw); z-index: 3;}
  .sec-5-cases-slide .case-box .more-bt img { width: 100%; height: auto;}


  /************ section#sec-6 ************/

  section#sec-6 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-6-bg { width: 100%; height: auto;}

  .sec-6-title { width: 38vw; position: absolute; top: 9vw; left: 15.5vw;}
  .sec-6-title .en-title { width: 100%; color: #F38F1E; font-size: 5.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-6-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-6-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .sec-6-title .cn-desc { width: 100%; color: #366B99; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}
  .sec-6-title .text-w { width: 100%; color: #fff; font-size: 1.4vw; font-weight: 300;}

  img.sec-6-more-bt { width: 8vw; height: auto; position: absolute; top: 29vw; left: 15.5vw;}


  /************ section#about ************/

  section#about-sec1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.about-sec1-bg { width: 100%; height: auto;}
  img.about-sec1-text { width: 22vw; height: auto; position: absolute; top: 7.3vw; right: 28vw;}

  section#about-sec2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.about-sec2-bg { width: 100%; height: auto; margin: -30.5vw 0 0 0;}

  .about-sec2-title { width: 100%; text-align: center; position: absolute; top: 30vw; left: 0;}
  .about-sec2-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec2-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .about-sec2-title .cn-desc { width: 100%; color: #fff; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .about-sec2-text { width: 45vw; color: #fff; font-size: 1.2vw; line-height: 2vw; font-weight: 300; text-align: center; position: absolute; top: 41.5vw; left: calc(50% - 22.5vw);}

  img.about-sec2-cert-logo { width: 6vw; height: auto; position: absolute; bottom: 10.5vw; left: calc(50% - 3vw);}
  img.about-sec2-pic { width: 30vw; height: auto; position: absolute; bottom: -10vw; right: 9vw;}

  section#about-sec3 { clear: both; width: 100%; padding: 11.5vw 0 4.5vw 18vw; margin: -10vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: no-repeat; background-position: left top; background-size: 100% auto; position: relative; z-index: 7;}

  .about-sec3-title { width: 100%; margin: 0 0 2vw 0;}
  .about-sec3-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec3-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec3-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .about-sec3-title .cn-desc { width: 100%; color: #17307D; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .about-sec3-features { width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
  .about-sec3-features .icon { width: 2vw; margin: 0 0.7vw 1.5vw 0;}
  .about-sec3-features .icon img { width: 100%; height: auto;}
  .about-sec3-features .feature { width: calc(100% - 2.7vw); margin: 0 0 1.5vw 0; font-size: 1.2vw; font-weight: 300; line-height: 1.3vw; letter-spacing: 0.1vw;}
  .about-sec3-features .feature span.red { color: #BD272D;}

  img.about-sec3-4-illu { width: 25.5vw; height: auto; position: absolute; bottom: -11.5vw; right: 8vw;}

  section#about-sec4 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec4-bg { width: 100%; height: auto;}

  .about-sec4-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 10vw; left: 45vw;}
  .about-sec4-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec4-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec4-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .about-sec4-title .cn-desc { width: 100%; color: #17307D; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .about-sec4-text { width: 39vw; font-size: 1.4vw; line-height: 2.2vw; position: absolute; top: 20.5vw; left: 45vw;}

  section#about-sec5 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec5-bg { width: 100%; height: auto;}

  .about-sec5-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 12vw; left: 12vw;}
  .about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .about-se5-advantage { width: 43.5vw; position: absolute; top: 5vw; right: 12vw;}
  .about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .about-se5-advantage .text-1 { width: 11vw; color: #fff; font-size: 1.2vw; text-align: center; position: absolute; top: 14.5vw; left: 1vw;}
  .about-se5-advantage .text-2 { width: 10vw; color: #fff; font-size: 1.2vw; text-align: center; position: absolute; top: 14.5vw; left: 16.7vw;}
  .about-se5-advantage .text-3 { width: 10vw; color: #fff; font-size: 1.2vw; text-align: center; position: absolute; top: 14.5vw; left: 32vw;}

  section#about-sec6 { clear: both; width: 100%; padding: 6vw 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  section#about-sec7 { clear: both; width: 100%; padding: 6vw 12vw; box-sizing: border-box; background-color: #eee; display: flex; justify-content: flex-start; align-items: flex-start; position: relative; z-index: 8;}

  .about-sec7-title { width: 35vw;}
  .about-sec7-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec7-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec7-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .about-sec7-title .cn-desc { width: 100%; color: #17307D; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .about-sec7-dl-list { width: calc(100% - 35vw);}
  .about-sec7-dl-list .list-box { width: 100%; border-bottom: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:first-child { border-top: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:hover { background-color: #fff;}
  .about-sec7-dl-list .list-box a { width: 100%; padding: 0.5vw; box-sizing: border-box; text-decoration: none; display: flex; justify-content: flex-start; align-items: flex-start;}
  .about-sec7-dl-list .list-box a .icon { width: 3vw; color: #F38F1E; font-size: 1.4vw;}
  .about-sec7-dl-list .list-box a .title { width: calc(100% - 3vw); color: #42210B; font-size: 1.4vw;}


  /************ section#certification ************/

  section#page-certification { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  .page-cert-content { clear: both; width: 100%; padding: 0 10vw; box-sizing: border-box;}
  .page-cert-content .certi-logos { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-logos img { width: auto; height: 5vw; margin: 0 0.5vw;}
  .page-cert-content .certi-papers { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-papers img { width: 14vw; height: auto; margin: 0 0.5vw; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);}


  /************ section#law-source ************/

  img.law-sec1-text { width: 22vw; height: auto; position: absolute; top: 7.3vw; right: 5vw;}

  section#law-source-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  .law-source-title { clear: both; width: 100%; text-align: center;}
  .law-source-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .law-source-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .law-source-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .law-source-title .cn-desc { width: 100%; color: #17307D; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .law-source-list-full { clear: both; width: 100%; padding: 0 10vw; box-sizing: border-box;}
  .law-source-list-full .law-class1 { width: 100%; margin: 4vw 0 2vw 0;}
  .law-source-list-full .law-class1 span.title { padding: 0.5vw 2vw; color: #fff; font-size: 1.4vw; border-radius: 2vw; background-color: #F38F1E;}
  .law-source-list-full .law-class2 { clear: both; width: 100%; margin: 0 0 1.5vw 0;}
  .law-source-list-full .law-class2 span.title { padding: 0.5vw 2vw; margin: 0 0 0 3vw; color: #fff; font-size: 1vw; border-radius: 2vw; background-color: #C2986D;}
  .law-source-list-full .law-class3-list { clear: both; width: calc(100% - 18vw); padding: 0.5vw 0; margin-left: 18vw; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .law-source-list-full .law-class3-list.up { margin-top: -3.5vw;}
  .law-source-list-full .law-class3-list .title { width: 6vw; font-size: 1vw;}
  .law-source-list-full .law-class3-list .text { width: calc(100% - 11vw); font-size: 1vw;}
  .law-source-list-full .law-class3-list .link { width: 5vw; text-align: right;}
  .law-source-list-full .law-class3-list .link a { color: #42210B; font-size: 1.4vw;}


  /************ section#service ************/

  section#service { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  .service-items { clear: both; width: 80vw; margin: 4vw auto 0 auto; display: flex; justify-content: flex-start;}
  .service-items .item-box { width: 20vw; padding: 0 1vw; box-sizing: border-box;}
  .service-items .item-box .photo { width: 18vw; height: 18vw; border-radius: 100%; border: 6px #F38F1E solid; background-color: #fff; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden;}
  .service-items .item-box .photo img { width: auto; height: 100%;}
  .service-items .item-box .title { width: 100%; margin: 1vw 0 0 0; color: #42210B; font-size: 1.4vw; font-weight: 500; text-align: center;}


  /************ section#news ************/

  img.news-sec1-text { width: 22vw; height: auto; position: absolute; top: 10vw; left: 28vw;}

  section#news-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  .page-news-list { clear: both; width: 60vw; margin: 4vw auto 0 auto;}
  .page-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .page-news-list .news-list .news-box { width: 100%; padding: 1.5vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .page-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .page-news-list .news-list .news-box .date { width: 8vw; line-height: 1.5vw;}
  .page-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 1.2vw;}
  .page-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 2.4vw; font-weight: 500;}
  .page-news-list .news-list .news-box .title { width: calc(100% - 8vw); padding: 1.5vw 0 0 0; font-size: 1.8vw; font-weight: 500; line-height: 2vw;}
  .page-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .page-news-list .news-list .news-box .title a:hover { color: #42210B;}

  ul#page-num { clear: both; width: 100%; padding: 0; margin: 4vw 0 0 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-num li { padding: 0; margin: 0 0.3vw 1vw 0.3vw;}
  ul#page-num li a { padding: 0.5vw; color: #fff; font-size: 1.2vw; border-radius: 0.5vw; background-color: #F38F1E; text-decoration: none; display: block;}
  ul#page-num li a:hover { background-color: #C2986D;}
  ul#page-num li a.sel { background-color: #42210B;}

  .page-news-content { clear: both; width: 60vw; margin: 4vw auto 0 auto;}
  .page-news-content .title { width: 100%; padding: 1vw 0; color: #F38F1E; font-size: 1.8vw; font-weight: 500; line-height: 2.2vw; border-bottom: 1px #F38F1E solid;}
  .page-news-content .date { width: 100%; padding: 1vw 0; color: #17307D; font-size: 1.2vw; text-align: right;}
  .page-news-content .text-content { width: 100%; margin: 4vw 0; font-size: 1.4vw; line-height: 2vw;}
  .page-news-content .text-content img { max-width: 100%; height: auto;}

  .go-back-bt { clear: both; width: 10vw; margin: 0 auto;}
  .go-back-bt a { width: 100%; padding: 0.5vw 0; color: #fff; font-size: 1.2vw; text-align: center; text-decoration: none; border-radius: 2vw; background-color: #F38F1E; display: block;}
  .go-back-bt a:hover { background-color: #C2986D;}


  /************ section#case ************/

  img.case-sec1-text { width: 22vw; height: auto; position: absolute; top: 3vw; left: 30vw;}

  section#case-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  .case-list-full { clear: both; width: 80vw; margin: 4vw auto 0 auto;}
  .case-list-full .column { padding: 0 1vw 2vw 1vw; box-sizing: border-box;}
  .case-list-full .column.grid-item { width: 50%; float: left;}
  .case-list-full .column .title { width: 100%; padding: 0.5vw 0; font-size: 2vw; font-weight: 500; text-align: center;}
  .case-list-full .column .title.top-style-1 { color: #42210B; background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .title.top-style-2 { color: #fff; background-color: #42210B;}
  .case-list-full .column .title.top-style-3 { color: #fff; background-color: #F38F1E;}
  .case-list-full .column .list { width: 100%; padding: 2vw; font-size: 1.2vw; line-height: 1.6vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .case-list-full .column .list.bg-style-1 { background-color: #eee;}
  .case-list-full .column .list.bg-style-2 { background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .list.bg-style-3 { background-color: #F38F1E;}
  .case-list-full .column .list .icon { width: 1.5vw; margin: 0 0 1vw 0;}
  .case-list-full .column .list .text { width: calc(100% - 1.5vw); margin: 0 0 1vw 0;}
  .case-list-full .column .list .text a { color: #000; text-decoration: none;}
  .case-list-full .column .list .text a:hover { border-bottom: 1px #000 dashed;}

  .case-title-bar { clear: both; width: 80vw; padding: 0.5vw 0; margin: 4vw auto 0 auto; border-bottom: 1px #42210B solid; text-align: center;}
  .case-title-bar span.big { color: #42210B; font-size: 2vw; font-weight: 500;}
  .case-title-bar span.small { color: #F38F1E; font-size: 1.4vw;}

  .case-photos-list { clear: both; width: 80vw; margin: 4vw auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .case-photos-list a { width: calc(100% / 4 - 2vw); height: 10vw; margin: 0 1vw 2vw 1vw; text-decoration: none; overflow: hidden; display: flex; align-items: center;}
  .case-photos-list a img { width: 100%; height: auto;}

  ul#page-cases-class-tab { clear: both; width: 80vw; padding: 0; margin: 4vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-cases-class-tab li { padding: 0; margin: 0 0.5vw 1vw 0.5vw;}
  ul#page-cases-class-tab li a { padding: 0.3vw 1vw; color: #42210B; font-size: 1.4vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-cases-class-tab li a:hover { background-color: #C2986D;}
  ul#page-cases-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-cases-list { clear: both; width: 80vw; margin: 0 auto;}
  .page-cases-list .case-list-x4 { width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .page-cases-list .case-list-x4 .case-list-box { width: calc(100% / 4); padding: 0 1vw; margin: 0 0 2vw 0; box-sizing: border-box;}
  .page-cases-list .case-list-x4 .case-list-box a { width: 100%; text-decoration: none; display: block;}
  .page-cases-list .case-list-x4 .case-list-box a .pic { width: 100%; height: 10vw; border: 5px #fff solid; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-sizing: border-box; display: flex; align-items: center; overflow: hidden;}
  .page-cases-list .case-list-x4 .case-list-box a .pic img { width: 100%; height: auto;}
  .page-cases-list .case-list-x4 .case-list-box a .title { width: 100%; padding: 0.5vw 0 0 0; color: #42210B; font-size: 1vw; font-weight: 500; line-height: 1.4vw; text-align: center;}


  /************ section#products ************/

  img.products-sec1-text { width: 22vw; height: auto; position: absolute; top: 4vw; left: 28vw;}

  section#products-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  ul#page-prod-class-tab { clear: both; width: 80vw; padding: 0; margin: 4vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-prod-class-tab li { padding: 0; margin: 0 0.5vw 1vw 0.5vw;}
  ul#page-prod-class-tab li a { padding: 0.3vw 1vw; color: #42210B; font-size: 1.4vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-prod-class-tab li a:hover { background-color: #C2986D;}
  ul#page-prod-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-prod-list { clear: both; width: 100%;}

  .page-prod-title { clear: both; width: 80vw; padding: 0.5vw 0; margin: 4vw auto; color: #42210B; font-size: 2.2vw; font-weight: 600; text-align: center; border-bottom: 2px #42210B solid;}

  .page-prod-photos-list { clear: both; width: 70vw; margin: 0 auto 4vw auto;}
  .page-prod-photos-list img { width: calc(35VW - 2VW); height: auto; padding: 0 1vw; box-sizing: border-box;}

  .page-prod-content { clear: both; width: 60vw; margin: 0 auto 4vw auto; font-size: 1.4vw; line-height: 2.4vw;}
  .page-prod-content span.title { padding: 0 2vw; color: #fff; font-size: 1.8vw; line-height: 4vw; font-weight: 500; border-radius: 0 1vw; background-color: #F38F1E;}
  .page-prod-content ul.dot { padding: 0 0 0 1.4vw; margin: 0; list-style-type: disc; display: block;}
  .page-prod-content ul.dot li { padding: 0; margin: 0;}
  .page-prod-content .prod-intro-video { width: 100%;}
  
  .page-prod-certifi { clear: both; width: 80vw; margin: 6vw auto; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  .page-prod-certifi img { width: auto; height: 6vw; margin: 0 1vw 2vw 1vw;}


  /************ section#dealer ************/

  section#dealer { clear: both; width: 100%; padding: 14vw 12VW 6vw 12VW; margin: -10vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; display: flex; justify-content: flex-start; align-items: flex-start; position: relative; z-index: 8;}

  .page-dealer-title { width: 26VW;}
  .page-dealer-title .en-title { width: 100%; color: #F38F1E; font-size: 4.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .page-dealer-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.1vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .page-dealer-title .en-desc-2 { width: 100%; color: #808080; font-size: 0.8vw; font-weight: 300;}
  .page-dealer-title .cn-desc { width: 100%; color: #17307D; font-size: 2.8vw; line-height: 3.2vw; font-weight: 700;}

  .page-dealer-content { width: calc(100% - 26vw);}
  .page-dealer-content img.dealer-map { max-width: 100%; height: auto; margin: -4vw 0 0 0;}

  .page-dealer-hire { width: 14vw; color: #ff0000; font-size: 3vw; line-height: 3.6vw; font-weight: 700; text-align: center; position: absolute; top: 30vw; left: 11vw;}


  /************ section#contact ************/

  section#contact { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  .contact-content { clear: both; width: 70vw; margin: 4vw auto 0 auto;}
  .contact-content .column-rt { width: 35vw; float: right;}
  .contact-content .column-rt form { width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
  .contact-content .column-rt form .caption { width: 10vw; margin: 0 0 1.5vw 0; color: #42210B; font-size: 1.4vw; text-align: right;}
  .contact-content .column-rt form .column { width: calc(100% - 10vw); margin: 0 0 1.5vw 0; color: #F38F1E; font-size: 1.2vw;}
  .contact-content .column-rt form .column input[type=text] { width: 100%; padding: 0.5vw 1vw; color: #F38F1E; font-size: 1.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column textarea { width: 100%; height: 6vw; padding: 0.5vw 1vw; color: #F38F1E; font-size: 1.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column img.con-code { width: 10vw; height: auto; margin: 0 0 0.5vw 0;}
  .contact-content .column-rt form .column input[type=submit] { padding: 0.5vw 1vw; color: #fff; font-size: 1.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 0; background-color: #F38F1E; box-sizing: border-box; cursor: pointer;}
  .contact-content .column-lf { width: 35vw; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; float: left;}
  .contact-content .column-lf .sub-title { width: 8.5vw; margin: 0 0 0.5vw 0; color: #42210B; font-size: 1.6vw; text-align: right;}
  .contact-content .column-lf .infor { width: calc(100% - 8.5vw); margin: 0 0 0.5vw 0; color: #F38F1E; font-size: 1.6vw;}
  .contact-content .column-lf img.qrcode { width: 40%; height: auto; margin: 2vw 0 0.5vw 0;}
  .contact-content .column-lf .line-id { width: 100%; color: #F38F1E; font-size: 1.6vw;}


  /************ sitemap ************/

  section#sitemap { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  ul#sitemap-nav { clear: both; width: 80vw; padding: 0; margin: 6vw auto 0 auto; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  ul#sitemap-nav li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#sitemap-nav li a { padding: 0.3vw; color: #42210B; font-size: 1.4vw; font-weight: 500; text-decoration: none; display: block;}
  ul#sitemap-nav li a:hover { border-bottom: 2px #42210B solid;}
  ul#sitemap-nav li ul.nav-2nd { padding: 0; margin: 0; list-style: none; display: block;}
  ul#sitemap-nav li ul.nav-2nd li { padding: 0; margin: 0; text-align: center;}
  ul#sitemap-nav li ul.nav-2nd li a { padding: 0 0 0.2vw 0; color: #F38F1E; font-size: 1.2vw; font-weight: 400;}
  ul#sitemap-nav li ul.nav-2nd li a:hover { border-bottom: 2px #F38F1E solid;}
  

  /************ footer ************/

  footer { clear: both; width: 100%;}

  .footer-logo-add { width: 100%; position: relative; z-index: 4;}
  .footer-logo-add img.footer-bg { width: 100%; height: auto;}
  .footer-logo-add .logo-slogan { width: 29vw; position: absolute; top: 5vw; left: 15.5vw; display: flex; justify-content: flex-start;}
  .footer-logo-add .logo-slogan img.logo { width: 9.5vw; height: auto; margin: 0 0.5vw 0 0;}
  .footer-logo-add .logo-slogan img.slogan { width: 18.5vw; height: auto;}
  .footer-logo-add .add-contact { width: 36vw; position: absolute; top: 5vw; right: 15.5vw; display: flex; justify-content: flex-start; align-items: flex-start;}
  .footer-logo-add .add-contact .column { width: 16vw; margin: 0 0 0 2vw; color: #42210B; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;} 
  .footer-logo-add .add-contact .column .icon { width: 2vw; margin: 0 0 0.5vw 0;}
  .footer-logo-add .add-contact .column .icon img { width: 1.5vw; height: auto;}
  .footer-logo-add .add-contact .column .city { width: calc(100% - 2vw); margin: 0 0 0.5vw 0; font-size: 1.8vw; font-weight: 500;}
  .footer-logo-add .add-contact .column .text { width: calc(100% - 2vw); margin: 0 0 0.5vw 0; font-size: 1.1vw;}

  .footer-brands { width: 100%; padding: 2vw 0; background-color: #fff; display: flex; justify-content: center; align-items: center;}
  .footer-brands img { width: auto; height: 4vw; margin: 0 1vw;}

  .footer-nav { width: 100%; padding: 2vw 0 3vw 0; background-color: #1D3757;}
  .footer-nav ul.footer-nav-1c { padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start;}
  .footer-nav ul.footer-nav-1c li { padding: 0; margin: 0 1.5vw;}
  .footer-nav ul.footer-nav-1c li a { color: #fff; font-size: 1.1vw; font-weight: 400; letter-spacing: 0.1vw; text-decoration: none;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c { padding: 0; margin: 0.5vw 0 0 0; list-style: none; display: block;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li { padding: 0; margin: 0 0 0.3vw 0; text-align: center;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li a { color: #ccc; font-size: 1.1vw; font-weight: 300; letter-spacing: 0;}

  .footer-copyright { width: 100%; padding: 0.5vw 0; font-size: 1vw; text-align: center; background-color: #fff;}

}

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

  /************ header + nav ************/

  header { width: 100%; height: 100px; padding: 0 10px; background-color: #fff; display: flex; justify-content: center; align-items: flex-start; box-sizing: border-box; position: relative; z-index: 99;}

  .header-logo-icons { width: 180px;}
  .header-logo-icons img.logo { width: 100%; height: auto; margin: 0 0 20px 0;}
  .header-logo-icons .icons { width: 100%; margin: 0 0 10px 0; display: flex; justify-content: center; align-items: center;}
  .header-logo-icons .icons img.icon { width: 30px; height: auto; margin: 0 5px;}
  .header-logo-icons .tel { width: 100%; color: #42210B; font-size: 0.9em; font-weight: 600; text-align: center; text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white}

  nav#mo { display: none;}

  nav#pc { width: calc(100% - 180px); margin: 30px 0 0 0;}
  nav#pc ul#nav-1c { padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: center;}
  nav#pc ul#nav-1c li { padding: 0 5px; margin: 0; border-right: 1px #C2986D solid; position: relative;}
  nav#pc ul#nav-1c li:last-child { border-right: 0;}
  nav#pc ul#nav-1c li a { padding: 0 20px 5px 20px; color: #534741; text-decoration: none; border-radius: 16px; background-color: #fff; display: block; cursor: pointer;}
  nav#pc ul#nav-1c li a span.en { font-size: 0.8em; line-height: 1em; font-weight: 300;}
  nav#pc ul#nav-1c li a span.cn { font-size: 1em; line-height: 1em; font-weight: 400;}
  nav#pc ul#nav-1c li a:hover { color: #fff; text-align: center; background-color: #42210B;}
  nav#pc ul#nav-1c li a:hover span.cn { font-weight: 600;}
  nav#pc ul#nav-1c li a.sel { color: #fff; text-align: center; background-color: #42210B;}
  nav#pc ul#nav-1c li a.sel span.cn { font-weight: 600;}
  nav#pc ul#nav-1c li ul#nav-2c { width: 100px; padding: 5px; margin: 0; list-style: none; background-color: rgba(255,255,255,0.7); display: none; box-sizing: border-box; position: absolute; top: 50px; left: calc(50% - 50px);}
  nav#pc ul#nav-1c li ul#nav-2c li { width: 100%; padding: 5px 10px; margin: 0; text-align: center; border-bottom: 1px #42210B solid; border-right: 0; box-sizing: border-box;}
  nav#pc ul#nav-1c li ul#nav-2c li:last-child { border-bottom: 0;}
  nav#pc ul#nav-1c li ul#nav-2c li a { padding: 0; color: #42210B; font-size: 1rem; text-decoration: none; border-radius: 0; background-color: transparent;}
  nav#pc ul#nav-1c li ul#nav-2c li a:hover { color: #C2986D; background-color: transparent;}


  /************ section#sec-1 ************/

  section#sec-1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.sec-1-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}
  img.sec-1-text { width: 28vw; height: auto; position: absolute; top: 13vw; left: 22vw;}
  img.sec-1-pic { width: 40vw; height: auto; position: absolute; top: 16vw; right: 6vw;}


  /************ section#sec-2 ************/

  section#sec-2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-2-bg { width: 120%; height: auto; margin: -26vw 0 0 -10%;}

  .sec-2-title { width: 100%; text-align: center; position: absolute; top: 20vw; left: 0;}
  .sec-2-title .en-title { width: 100%; color: #F38F1E; font-size: 7vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-2-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .sec-2-title .cn-desc { width: 100%; color: #fff; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .sec-2-desc-items { width: 100%; display: flex; justify-content: center; align-items: flex-start; position: absolute; top: 38vw; left: 0;}
  .sec-2-desc-items .item-box { width: 20vw; margin: 0 1.2vw;}
  .sec-2-desc-items .item-box img { width: 100%; height: auto;}
  .sec-2-desc-items .item-box .text-w { clear: both; width: 84%; margin: 1vw auto 0 auto; color: #fff; font-size: 1.6vw; line-height: 2.2vw; font-weight: 300; text-align: center;}
  .sec-2-desc-items .item-box .text-y { clear: both; width: 84%; margin: 1vw auto 0 auto; color: #C2986D; font-size: 1.6vw; line-height: 2.2vw; font-weight: 300; text-align: center;}

  .sec2-more-bt { width: 12vw; position: absolute; top: 68vw; left: calc(50% - 6vw);}
  .sec2-more-bt img { width: 100%; height: auto; margin: 0 auto;}

  .hp-about-sec5-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 37vw; left: 6vw;}
  .hp-about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .hp-about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .hp-about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .hp-about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .hp-about-se5-advantage { width: 53vw; position: absolute; top: 30vw; right: 6vw;}
  .hp-about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .hp-about-se5-advantage .text-1 { width: 13vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 1.4vw;}
  .hp-about-se5-advantage .text-2 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 19.2vw;}
  .hp-about-se5-advantage .text-3 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 37.8vw;}


  /************ section#sec-3 ************/

  section#sec-3 { clear: both; width: 100%; padding: 15vw 0 0 0; margin: -15vw 0 0 0; background-color: #eee; position: relative; z-index: 7;}

  .sec-3-title { width: 100%; text-align: center;}
  .sec-3-title .en-title { width: 100%; color: #F38F1E; font-size: 7vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-3-title .en-desc-1 { width: 100%; color: #42210B; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-3-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .sec-3-title .cn-desc { width: 100%; color: #1D3757; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .sec-3-prods-list { clear: both; width: 80vw; margin: 6vw auto 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .sec-3-prods-list .prod-box { width: 36vw; margin: 0 2vw 4vw 2vw;}
  .sec-3-prods-list .prod-box .pic { width: 100%;}
  .sec-3-prods-list .prod-box .pic img { width: 100%; height: auto;}
  .sec-3-prods-list .prod-box .type-more { width: 100%; padding: 0.5vw 0; border-bottom: 1px #959595 solid; display: flex; justify-content: flex-start;}
  .sec-3-prods-list .prod-box .type-more .type { width: calc(100% - 8vw); padding: 0.2vw 0 0 0; color: #1D3757; font-size: 1.8vw;}
  .sec-3-prods-list .prod-box .type-more img.more { width: 10vw; height: auto;}
  .sec-3-prods-list .prod-box .name { width: 100%; padding: 0.5vw 7vw 0 0; color: #42210B; font-size: 2.2vw; line-height: 2.4vw; font-weight: 500; box-sizing: border-box;}

  .sec-3-bottom { clear: both; width: 100%; background-color: #fff; position: relative;}
  .sec-3-bottom img.sec-3-bottom-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}
  .sec-3-bottom img.sec-3-more-bt { width: 4vw; height: auto; position: absolute; top: 0; left: calc(50% - 2vw);}


  /************ section#sec-4 ************/

  section#sec-4 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-4-bg { width: 120%; height: auto; margin: -6vw 0 0 -10%;}

  .sec-4-title { width: 36vw; position: absolute; top: 14.5vw; right: 0;}
  .sec-4-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-4-title .en-desc-1 { width: 100%; color: #42210B; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-4-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .sec-4-title .cn-desc { width: 100%; color: #1D3757; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .sec-4-news-list { width: 48vw; position: absolute; top: 16vw; left: 5vw;}
  .sec-4-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .sec-4-news-list .news-list .news-box { width: 100%; padding: 2vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .sec-4-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .sec-4-news-list .news-list .news-box .date { width: 20%; line-height: 1.5vw;}
  .sec-4-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 1.6vw; line-height: 3vw;}
  .sec-4-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 3vw; font-weight: 500;}
  .sec-4-news-list .news-list .news-box .title { width: 80%; padding: 2.5vw 0 0 0; font-size: 2.2vw; font-weight: 500; line-height: 2.6vw;}
  .sec-4-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .sec-4-news-list .news-list .news-box .title a:hover { color: #42210B;}

  .sec-4-news-list img.news-more-bt { clear: both; width: 12vw; height: auto; margin: 3vw 0 0 0;}


  /************ section#sec-5 ************/

  section#sec-5 { clear: both; padding: 4vw 0; width: 100%; position: relative; z-index: 8;}

  .sec-5-title { width: 100%; padding: 0 0 3vw 13vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
  .sec-5-title .column-lf { width: 16vw;}
  .sec-5-title .column-lf .en-title { width: 100%; color: #F38F1E; font-size: 10vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-5-title .column-rt { width: calc(100% - 16vw);}
  .sec-5-title .column-rt .en-desc-1 { width: 100%; color: #42210B; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-5-title .column-rt .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .sec-5-title .column-rt .cn-desc { width: 100%; color: #1D3757; font-size: 3.8vw; line-height: 3.8vw; font-weight: 700;}

  .sec-5-cases-slide { clear: both; width: 80vw; margin: 0 auto;}
  .sec-5-cases-slide .case-box { width: 40vw; padding: 0 0 1vw 0; position: relative;}
  .sec-5-cases-slide .case-box img.case-bg { width: 100%; height: auto; z-index: 1;}
  .sec-5-cases-slide .case-box .title-1 { width: 100%; height: 3.8vw; padding: 0.8vw 0 0 0; color: #42210B; font-size: 1.8vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .title-2 { width: 100%; height: 3.8vw; padding: 0.8vw 0 0 0; color: #fff; font-size: 1.8vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text { width: 100%; padding: 1vw 6vw 1vw 4vw; color: #000; font-size: 1.2vw; line-height: 2.4vw; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap; position: absolute; top: 4vw; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text .icon { width: 1.5vw;}
  .sec-5-cases-slide .case-box .text .list { width: calc(100% - 1.5vw);}
  .sec-5-cases-slide .case-box .more-bt { width: 2.8vw; position: absolute; bottom: 1.3vw; left: calc(50% - 1.4vw); z-index: 3;}
  .sec-5-cases-slide .case-box .more-bt img { width: 100%; height: auto;}


  /************ section#sec-6 ************/

  section#sec-6 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-6-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}

  .sec-6-title { width: 44vw; position: absolute; top: 9vw; left: 8vw;}
  .sec-6-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-6-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-6-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .sec-6-title .cn-desc { width: 100%; color: #366B99; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}
  .sec-6-title .text-w { width: 100%; color: #fff; font-size: 1.8vw; font-weight: 300;}

  img.sec-6-more-bt { width: 12vw; height: auto; position: absolute; top: 34vw; left: 8vw;}


  /************ section#about ************/

  section#about-sec1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.about-sec1-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}
  img.about-sec1-text { width: 28vw; height: auto; position: absolute; top: 7.3vw; right: 28vw;}

  section#about-sec2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.about-sec2-bg { width: 120%; height: auto; margin: -30.5vw 0 0 -10%;}

  .about-sec2-title { width: 100%; text-align: center; position: absolute; top: 30vw; left: 0;}
  .about-sec2-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec2-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .about-sec2-title .cn-desc { width: 100%; color: #fff; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .about-sec2-text { width: 60vw; color: #fff; font-size: 1.6vw; line-height: 2.4vw; font-weight: 300; text-align: center; position: absolute; top: 46vw; left: calc(50% - 30vw);}

  img.about-sec2-cert-logo { width: 8vw; height: auto; position: absolute; bottom: 15vw; left: calc(50% - 4vw);}
  img.about-sec2-pic { width: 36vw; height: auto; position: absolute; bottom: -9vw; right: 3vw;}

  section#about-sec3 { clear: both; width: 100%; padding: 10vw 0 6vw 8vw; margin: -10vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: no-repeat; background-position: center top; background-size: 120% auto; position: relative; z-index: 7;}

  .about-sec3-title { width: 100%; margin: 0 0 2vw 0;}
  .about-sec3-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec3-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec3-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .about-sec3-title .cn-desc { width: 100%; color: #17307D; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .about-sec3-features { width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
  .about-sec3-features .icon { width: 2.4vw; margin: 0 0.7vw 1.5vw 0;}
  .about-sec3-features .icon img { width: 100%; height: auto;}
  .about-sec3-features .feature { width: calc(100% - 3.1vw); margin: 0 0 1.5vw 0; font-size: 1.6vw; font-weight: 300; line-height: 1.6vw; letter-spacing: 0.1vw;}
  .about-sec3-features .feature span.red { color: #BD272D;}

  img.about-sec3-4-illu { width: 32vw; height: auto; position: absolute; bottom: -14vw; right: 4vw;}

  section#about-sec4 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec4-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}

  .about-sec4-title { width: 51vw; margin: 0 0 2vw 0; position: absolute; top: 10vw; left: 40vw;}
  .about-sec4-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec4-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec4-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .about-sec4-title .cn-desc { width: 100%; color: #17307D; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .about-sec4-text { width: 51vw; font-size: 1.8vw; line-height: 2.6vw; position: absolute; top: 26vw; left: 40vw;}

  section#about-sec5 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec5-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}

  .about-sec5-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 13vw; left: 6vw;}
  .about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .about-se5-advantage { width: 53vw; position: absolute; top: 5.5vw; right: 6vw;}
  .about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .about-se5-advantage .text-1 { width: 13vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 1.4vw;}
  .about-se5-advantage .text-2 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 19.2vw;}
  .about-se5-advantage .text-3 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 37.8vw;}

  section#about-sec6 { clear: both; width: 100%; padding: 6vw 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  section#about-sec7 { clear: both; width: 100%; padding: 6vw 8vw; box-sizing: border-box; background-color: #eee; display: flex; justify-content: flex-start; align-items: flex-start; position: relative; z-index: 8;}

  .about-sec7-title { width: 35vw;}
  .about-sec7-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec7-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec7-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .about-sec7-title .cn-desc { width: 100%; color: #17307D; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .about-sec7-dl-list { width: calc(100% - 35vw);}
  .about-sec7-dl-list .list-box { width: 100%; border-bottom: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:first-child { border-top: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:hover { background-color: #fff;}
  .about-sec7-dl-list .list-box a { width: 100%; padding: 0.5vw; box-sizing: border-box; text-decoration: none; display: flex; justify-content: flex-start; align-items: flex-start;}
  .about-sec7-dl-list .list-box a .icon { width: 3vw; color: #F38F1E; font-size: 1.8vw;}
  .about-sec7-dl-list .list-box a .title { width: calc(100% - 3vw); color: #42210B; font-size: 1.8vw;}


  /************ section#certification ************/

  section#page-certification { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -12vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 120% auto; position: relative; z-index: 8;}

  .page-cert-content { clear: both; width: 100%; padding: 0 4vw; box-sizing: border-box;}
  .page-cert-content .certi-logos { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-logos img { width: auto; height: 5vw; margin: 0 0.5vw;}
  .page-cert-content .certi-papers { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-papers img { width: 14vw; height: auto; margin: 0 0.5vw; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);}


  /************ section#download ************/

  section#download { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}


  /************ section#law-source ************/

  img.law-sec1-text { width: 28vw; height: auto; position: absolute; top: 7.3vw; right: 5vw;}

  section#law-source-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  .law-source-title { clear: both; width: 100%; text-align: center;}
  .law-source-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .law-source-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .law-source-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .law-source-title .cn-desc { width: 100%; color: #17307D; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .law-source-list-full { clear: both; width: 100%; padding: 0 6vw; box-sizing: border-box;}
  .law-source-list-full .law-class1 { width: 100%; margin: 4vw 0 2vw 0;}
  .law-source-list-full .law-class1 span.title { padding: 0.5vw 2vw; color: #fff; font-size: 1.8vw; border-radius: 2.4vw; background-color: #F38F1E;}
  .law-source-list-full .law-class2 { clear: both; width: 100%; margin: 0 0 1.5vw 0;}
  .law-source-list-full .law-class2 span.title { padding: 0.5vw 2vw; margin: 0 0 0 3vw; color: #fff; font-size: 1.4vw; border-radius: 2.4vw; background-color: #C2986D;}
  .law-source-list-full .law-class3-list { clear: both; width: calc(100% - 22vw); padding: 0.5vw 0; margin-left: 22vw; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .law-source-list-full .law-class3-list.up { margin-top: -3.5vw;}
  .law-source-list-full .law-class3-list .title { width: 7vw; font-size: 1.4vw;}
  .law-source-list-full .law-class3-list .text { width: calc(100% - 12vw); font-size: 1.4vw;}
  .law-source-list-full .law-class3-list .link { width: 5vw; text-align: right;}
  .law-source-list-full .law-class3-list .link a { color: #42210B; font-size: 1.8vw;}


  /************ section#service ************/

  section#service { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  .service-items { clear: both; width: 90vw; margin: 4vw auto 0 auto; display: flex; justify-content: flex-start;}
  .service-items .item-box { width: 22.5vw; padding: 0 1vw; box-sizing: border-box;}
  .service-items .item-box .photo { width: 20.5vw; height: 20.5vw; border-radius: 100%; border: 6px #F38F1E solid; background-color: #fff; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden;}
  .service-items .item-box .photo img { width: auto; height: 100%;}
  .service-items .item-box .title { width: 100%; margin: 1vw 0 0 0; color: #42210B; font-size: 1.7vw; font-weight: 500; text-align: center;}


  /************ section#news ************/

  img.news-sec1-text { width: 28vw; height: auto; position: absolute; top: 10vw; left: 28vw;}

  section#news-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  .page-news-list { clear: both; width: 70vw; margin: 4vw auto 0 auto;}
  .page-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .page-news-list .news-list .news-box { width: 100%; padding: 1.5vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .page-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .page-news-list .news-list .news-box .date { width: 9vw; line-height: 2vw;}
  .page-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 1.8vw;}
  .page-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 2.8vw; font-weight: 500;}
  .page-news-list .news-list .news-box .title { width: calc(100% - 9vw); padding: 1.9vw 0 0 0; font-size: 2.6vw; font-weight: 500; line-height: 2.8vw;}
  .page-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .page-news-list .news-list .news-box .title a:hover { color: #42210B;}

  ul#page-num { clear: both; width: 100%; padding: 0; margin: 4vw 0 0 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-num li { padding: 0; margin: 0 0.3vw 1vw 0.3vw;}
  ul#page-num li a { padding: 0.5vw 0.7vw; color: #fff; font-size: 1.6vw; border-radius: 0.5vw; background-color: #F38F1E; text-decoration: none; display: block;}
  ul#page-num li a:hover { background-color: #C2986D;}
  ul#page-num li a.sel { background-color: #42210B;}

  .page-news-content { clear: both; width: 70vw; margin: 4vw auto 0 auto;}
  .page-news-content .title { width: 100%; padding: 1.5vw 0; color: #F38F1E; font-size: 2.2vw; font-weight: 500; line-height: 2.8vw; border-bottom: 1px #F38F1E solid;}
  .page-news-content .date { width: 100%; padding: 1vw 0; color: #17307D; font-size: 1.6vw; text-align: right;}
  .page-news-content .text-content { width: 100%; margin: 4vw 0; font-size: 2vw; line-height: 2.8vw;}
  .page-news-content .text-content img { max-width: 100%; height: auto;}

  .go-back-bt { clear: both; width: 14vw; margin: 0 auto;}
  .go-back-bt a { width: 100%; padding: 0.5vw 0; color: #fff; font-size: 1.6vw; text-align: center; text-decoration: none; border-radius: 2vw; background-color: #F38F1E; display: block;}
  .go-back-bt a:hover { background-color: #C2986D;}


  /************ section#case ************/

  img.case-sec1-text { width: 28vw; height: auto; position: absolute; top: 6vw; left: 28vw;}

  section#case-content { clear: both; width: 100%; padding: 12vw 0 6vw 0; margin: -12vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  .case-list-full { clear: both; width: 80vw; margin: 4vw auto 0 auto;}
  .case-list-full .column { padding: 0 1vw 2vw 1vw; box-sizing: border-box;}
  .case-list-full .column.grid-item { width: 50%; float: left;}
  .case-list-full .column .title { width: 100%; padding: 0.6vw 0; font-size: 2.6vw; font-weight: 500; text-align: center;}
  .case-list-full .column .title.top-style-1 { color: #42210B; background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .title.top-style-2 { color: #fff; background-color: #42210B;}
  .case-list-full .column .title.top-style-3 { color: #fff; background-color: #F38F1E;}
  .case-list-full .column .list { width: 100%; padding: 2vw; font-size: 1.6vw; line-height: 2vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .case-list-full .column .list.bg-style-1 { background-color: #eee;}
  .case-list-full .column .list.bg-style-2 { background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .list.bg-style-3 { background-color: #F38F1E;}
  .case-list-full .column .list .icon { width: 2vw; margin: 0 0 1vw 0;}
  .case-list-full .column .list .text { width: calc(100% - 2vw); margin: 0 0 1vw 0;}
  .case-list-full .column .list .text a { color: #000; text-decoration: none;}
  .case-list-full .column .list .text a:hover { border-bottom: 1px #000 dashed;}

  .case-title-bar { clear: both; width: 80vw; padding: 0.6vw 0; margin: 4vw auto 0 auto; border-bottom: 1px #42210B solid; text-align: center;}
  .case-title-bar span.big { color: #42210B; font-size: 2.6vw; font-weight: 500;}
  .case-title-bar span.small { color: #F38F1E; font-size: 2vw;}

  .case-photos-list { clear: both; width: 80vw; margin: 4vw auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .case-photos-list a { width: calc(100% / 4 - 2vw); height: 10vw; margin: 0 1vw 2vw 1vw; text-decoration: none; overflow: hidden; display: flex; align-items: center;}
  .case-photos-list a img { width: 100%; height: auto;}

  ul#page-cases-class-tab { clear: both; width: 90vw; padding: 0; margin: 4vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-cases-class-tab li { padding: 0; margin: 0 0.8vw 1.6vw 0.8vw;}
  ul#page-cases-class-tab li a { padding: 0.5vw 1.5vw; color: #42210B; font-size: 1.8vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-cases-class-tab li a:hover { background-color: #C2986D;}
  ul#page-cases-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-cases-list { clear: both; width: 90vw; margin: 0 auto;}
  .page-cases-list .case-list-x4 { width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .page-cases-list .case-list-x4 .case-list-box { width: calc(100% / 4); padding: 0 1vw; margin: 0 0 2vw 0; box-sizing: border-box;}
  .page-cases-list .case-list-x4 .case-list-box a { width: 100%; text-decoration: none; display: block;}
  .page-cases-list .case-list-x4 .case-list-box a .pic { width: 100%; height: 12vw; border: 5px #fff solid; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-sizing: border-box; display: flex; align-items: center; overflow: hidden;}
  .page-cases-list .case-list-x4 .case-list-box a .pic img { width: 100%; height: auto;}
  .page-cases-list .case-list-x4 .case-list-box a .title { width: 100%; padding: 0.8vw 0 0 0; color: #42210B; font-size: 1.4vw; font-weight: 500; line-height: 1.8vw; text-align: center;}


  /************ section#products ************/

  img.products-sec1-text { width: 28vw; height: auto; position: absolute; top: 4vw; left: 24vw;}

  section#products-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  ul#page-prod-class-tab { clear: both; width: 80vw; padding: 0; margin: 4vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-prod-class-tab li { padding: 0; margin: 0 0.8vw 1.6vw 0.8vw;}
  ul#page-prod-class-tab li a { padding: 0.5vw 1.5vw; color: #42210B; font-size: 1.8vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-prod-class-tab li a:hover { background-color: #C2986D;}
  ul#page-prod-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-prod-list { clear: both; width: 100%;}

  .page-prod-title { clear: both; width: 80vw; padding: 0.5vw 0; margin: 4vw auto; color: #42210B; font-size: 3vw; font-weight: 600; text-align: center; border-bottom: 2px #42210B solid;}

  .page-prod-photos-list { clear: both; width: 70vw; margin: 0 auto 4vw auto;}
  .page-prod-photos-list img { width: calc(35VW - 2VW); height: auto; padding: 0 1vw; box-sizing: border-box;}

  .page-prod-content { clear: both; width: 80vw; margin: 0 auto 4vw auto; font-size: 1.8vw; line-height: 2.8vw;}
  .page-prod-content span.title { padding: 0 2vw; color: #fff; font-size: 2.2vw; line-height: 4.4vw; font-weight: 500; border-radius: 0 1.4vw; background-color: #F38F1E;}
  .page-prod-content ul.dot { padding: 0 0 0 1.8vw; margin: 0; list-style-type: disc; display: block;}
  .page-prod-content ul.dot li { padding: 0; margin: 0;}
  .page-prod-content .prod-intro-video { width: 100%;}
  
  .page-prod-certifi { clear: both; width: 80vw; margin: 6vw auto; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  .page-prod-certifi img { width: auto; height: 7vw; margin: 0 1vw 2vw 1vw;}


  /************ section#dealer ************/

  section#dealer { clear: both; width: 100%; padding: 14vw 8VW 6vw 8VW; margin: -10vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; display: flex; justify-content: flex-start; align-items: flex-start; position: relative; z-index: 8;}

  .page-dealer-title { width: 32VW;}
  .page-dealer-title .en-title { width: 100%; color: #F38F1E; font-size: 7.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .page-dealer-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.4vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .page-dealer-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.1vw; font-weight: 300;}
  .page-dealer-title .cn-desc { width: 100%; color: #17307D; font-size: 3.8vw; line-height: 4.2vw; font-weight: 700;}

  .page-dealer-content { width: calc(100% - 32vw);}
  .page-dealer-content img.dealer-map { max-width: 100%; height: auto; margin: -4vw 0 0 0;}

  .page-dealer-hire { width: 15vw; color: #ff0000; font-size: 3.6vw; line-height: 4.2vw; font-weight: 700; text-align: center; position: absolute; top: 32vw; left: 9vw;}


  /************ section#contact ************/

  section#contact { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 120% auto; position: relative; z-index: 8;}

  .contact-content { clear: both; width: 70vw; margin: 4vw auto 0 auto;}
  .contact-content .column-rt { width: 35vw; float: right;}
  .contact-content .column-rt form { width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
  .contact-content .column-rt form .caption { width: 10vw; margin: 0 0 1.5vw 0; color: #42210B; font-size: 1.4vw; text-align: right;}
  .contact-content .column-rt form .column { width: calc(100% - 10vw); margin: 0 0 1.5vw 0; color: #F38F1E; font-size: 1.2vw;}
  .contact-content .column-rt form .column input[type=text] { width: 100%; padding: 0.5vw 1vw; color: #F38F1E; font-size: 1.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column textarea { width: 100%; height: 6vw; padding: 0.5vw 1vw; color: #F38F1E; font-size: 1.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column img.con-code { width: 10vw; height: auto; margin: 0 0 0.5vw 0;}
  .contact-content .column-rt form .column input[type=submit] { padding: 0.5vw 1vw; color: #fff; font-size: 1.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 0; background-color: #F38F1E; box-sizing: border-box; cursor: pointer;}
  .contact-content .column-lf { width: 35vw; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; float: left;}
  .contact-content .column-lf .sub-title { width: 8.5vw; margin: 0 0 0.5vw 0; color: #42210B; font-size: 1.6vw; text-align: right;}
  .contact-content .column-lf .infor { width: calc(100% - 8.5vw); margin: 0 0 0.5vw 0; color: #F38F1E; font-size: 1.6vw;}
  .contact-content .column-lf img.qrcode { width: 40%; height: auto; margin: 2vw 0 0.5vw 0;}
  .contact-content .column-lf .line-id { width: 100%; color: #F38F1E; font-size: 1.6vw;}


  /************ sitemap ************/

  section#sitemap { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  ul#sitemap-nav { clear: both; width: 90vw; padding: 0; margin: 6vw auto 0 auto; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  ul#sitemap-nav li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#sitemap-nav li a { padding: 0.5vw; color: #42210B; font-size: 2vw; font-weight: 500; text-decoration: none; display: block;}
  ul#sitemap-nav li a:hover { border-bottom: 2px #42210B solid;}
  ul#sitemap-nav li ul.nav-2nd { padding: 0; margin: 0; list-style: none; display: block;}
  ul#sitemap-nav li ul.nav-2nd li { padding: 0; margin: 0; text-align: center;}
  ul#sitemap-nav li ul.nav-2nd li a { padding: 0 0 0.4vw 0; color: #F38F1E; font-size: 1.8vw; font-weight: 400;}
  ul#sitemap-nav li ul.nav-2nd li a:hover { border-bottom: 2px #F38F1E solid;}


  /************ footer ************/

  footer { clear: both; width: 100%;}

  .footer-logo-add { width: 100%; position: relative; z-index: 8;}
  .footer-logo-add img.footer-bg { width: 100%; height: auto;}
  .footer-logo-add .logo-slogan { width: 29vw; position: absolute; top: 4vw; left: 6vw; display: flex; justify-content: flex-start;}
  .footer-logo-add .logo-slogan img.logo { width: 11vw; height: auto; margin: 0 1vw 0 0;}
  .footer-logo-add .logo-slogan img.slogan { width: 20vw; height: auto;}
  .footer-logo-add .add-contact { width: 40vw; position: absolute; top: 4vw; right: 6vw; display: flex; justify-content: flex-start; align-items: flex-start;}
  .footer-logo-add .add-contact .column { width: 20vw; margin: 0 0 0 2vw; color: #42210B; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;} 
  .footer-logo-add .add-contact .column .icon { width: 2.8vw; margin: 0 0 0.5vw 0;}
  .footer-logo-add .add-contact .column .icon img { width: 1.8vw; height: auto;}
  .footer-logo-add .add-contact .column .city { width: calc(100% - 2.8vw); margin: 0 0 0.5vw 0; font-size: 2vw; font-weight: 500;}
  .footer-logo-add .add-contact .column .text { width: calc(100% - 2.8vw); margin: 0 0 0.5vw 0; font-size: 1.2vw;}

  .footer-brands { width: 100%; padding: 2vw 0; background-color: #fff; display: flex; justify-content: center; align-items: center;}
  .footer-brands img { width: auto; height: 5.5vw; margin: 0 1vw;}

  .footer-nav { width: 100%; padding: 2vw 0 3vw 0; background-color: #1D3757;}
  .footer-nav ul.footer-nav-1c { padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start;}
  .footer-nav ul.footer-nav-1c li { padding: 0; margin: 0 1.5vw;}
  .footer-nav ul.footer-nav-1c li a { color: #fff; font-size: 1.6vw; font-weight: 400; letter-spacing: 0.1vw; text-decoration: none;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c { padding: 0; margin: 0.5vw 0 0 0; list-style: none; display: block;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li { padding: 0; margin: 0 0 0.3vw 0; text-align: center;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li a { color: #ccc; font-size: 1.4vw; font-weight: 300; letter-spacing: 0;}

  .footer-copyright { width: 100%; padding: 1vw 0; font-size: 1.6vw; text-align: center; background-color: #fff;}

}

@media screen and (min-width: 768px) and (max-width: 1023px) {

  /************ header + nav ************/

  header { width: 100%; height: 80px; padding: 0 10px; background-color: #fff; display: flex; justify-content: center; align-items: flex-start; box-sizing: border-box; position: relative; z-index: 99;}

  .header-logo-icons { width: 180px;}
  .header-logo-icons img.logo { width: 100%; height: auto; margin: 0 0 20px 0;}
  .header-logo-icons .icons { width: 100%; margin: 0 0 10px 0; display: flex; justify-content: center; align-items: center;}
  .header-logo-icons .icons img.icon { width: 30px; height: auto; margin: 0 5px;}
  .header-logo-icons .tel { width: 100%; color: #42210B; font-size: 0.9em; font-weight: 600; text-align: center; text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white}

  nav#pc { display: none;}

  nav#mo { width: calc(100% - 180px);}
  nav#mo .nav-icon-open { width: 60px; height: 80px; color: #42210B; font-size: 3em; display: flex; justify-content: center; align-items: center; cursor: pointer; float: right;}
  nav#mo ul#nav-1c { width: 100%; padding: 20px 40px 40px 40px; margin: 0; background-color: #C2986D; list-style: none; box-sizing: border-box; display: block; position: absolute; top: 0; right: -100%;}
  nav#mo ul#nav-1c .nav-icon-close { width: 60px; color: #42210B; font-size: 3em; text-align: center; float: right;}
  nav#mo ul#nav-1c li { clear: both; width: 100%; padding: 0; margin: 0; border-bottom: 1px #906131 solid; position: relative;}
  nav#mo ul#nav-1c li:last-child { border-bottom: 0;}
  nav#mo ul#nav-1c li a { width: 100%; padding: 15px 0; color: #42210B; text-align: center; text-decoration: none; border-radius: 16px; display: block;}
  nav#mo ul#nav-1c li a span.en { font-size: 1em; line-height: 1em; font-weight: 300;}
  nav#mo ul#nav-1c li a span.cn { font-size: 1.4em; line-height: 1em; font-weight: 400;}
  nav#mo ul#nav-1c li a.sel { color: #fff; text-align: center;}
  nav#mo ul#nav-1c li a.sel span.cn { font-weight: 600;}
  nav#mo ul#nav-1c li .pop-icon { width: 30px; color: #42210B; font-size: 1.6em; position: absolute; top: 30px; right: calc(50% - 100px);}
  nav#mo ul#nav-1c li ul#nav-2c { width: 100%; padding: 0 20px; margin: 0 0 20px 0; list-style: none; background-color: rgba(255,255,255,0.2); display: none; box-sizing: border-box;}
  nav#mo ul#nav-1c li ul#nav-2c li { width: 100%; padding: 0; margin: 0; text-align: center; border-bottom: 1px #eee solid; border-right: 0; box-sizing: border-box;}
  nav#mo ul#nav-1c li ul#nav-2c li:last-child { border-bottom: 0;}
  nav#mo ul#nav-1c li ul#nav-2c li a { width: 100%; padding: 15px 0; color: #42210B; font-size: 1.2rem; text-decoration: none; border-radius: 0; background-color: transparent;}


  /************ section#sec-1 ************/

  section#sec-1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.sec-1-bg { width: 140%; height: auto; margin: 0 0 0 -20%;}
  img.sec-1-text { width: 38vw; height: auto; position: absolute; top: 35vw; left: 5vw;}
  img.sec-1-pic { width: 48vw; height: auto; position: absolute; top: 18vw; right: 5vw;}


  /************ section#sec-2 ************/

  section#sec-2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-2-bg { width: 140%; height: auto; margin: -40vw 0 0 -20%;}

  .sec-2-title { width: 100%; text-align: center; position: absolute; top: 22vw; left: 0;}
  .sec-2-title .en-title { width: 100%; color: #F38F1E; font-size: 9vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-2-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .sec-2-title .cn-desc { width: 100%; color: #fff; font-size: 4.4vw; line-height: 5vw; font-weight: 700;}

  .sec-2-desc-items { width: 100%; display: flex; justify-content: center; align-items: flex-start; position: absolute; top: 44vw; left: 0;}
  .sec-2-desc-items .item-box { width: 21vw; margin: 0 1.2vw;}
  .sec-2-desc-items .item-box img { width: 100%; height: auto;}
  .sec-2-desc-items .item-box .text-w { clear: both; width: 90%; margin: 1vw auto 0 auto; color: #fff; font-size: 1.8vw; line-height: 2.6vw; font-weight: 300; text-align: center;}
  .sec-2-desc-items .item-box .text-y { clear: both; width: 90%; margin: 1vw auto 0 auto; color: #C2986D; font-size: 1.8vw; line-height: 2.6vw; font-weight: 300; text-align: center;}

  .sec2-more-bt { width: 15vw; position: absolute; top: 79vw; left: calc(50% - 7.5vw);}
  .sec2-more-bt img { width: 100%; height: auto; margin: 0 auto;}

  .hp-about-sec5-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 45vw; left: 2vw;}
  .hp-about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .hp-about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .hp-about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .hp-about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .hp-about-se5-advantage { width: 53vw; position: absolute; top: 41vw; right: 2vw;}
  .hp-about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .hp-about-se5-advantage .text-1 { width: 13vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 1.4vw;}
  .hp-about-se5-advantage .text-2 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 19.2vw;}
  .hp-about-se5-advantage .text-3 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 37.8vw;}


  /************ section#sec-3 ************/

  section#sec-3 { clear: both; width: 100%; padding: 15vw 0 0 0; margin: -15vw 0 0 0; background-color: #eee; position: relative; z-index: 7;}

  .sec-3-title { width: 100%; text-align: center;}
  .sec-3-title .en-title { width: 100%; color: #F38F1E; font-size: 9vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-3-title .en-desc-1 { width: 100%; color: #42210B; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-3-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .sec-3-title .cn-desc { width: 100%; color: #1D3757; font-size: 4.4vw; line-height: 5vw; font-weight: 700;}

  .sec-3-prods-list { clear: both; width: 88vw; margin: 6vw auto 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .sec-3-prods-list .prod-box { width: 40vw; margin: 0 2vw 4vw 2vw;}
  .sec-3-prods-list .prod-box .pic { width: 100%;}
  .sec-3-prods-list .prod-box .pic img { width: 100%; height: auto;}
  .sec-3-prods-list .prod-box .type-more { width: 100%; padding: 0.5vw 0; border-bottom: 1px #959595 solid; display: flex; justify-content: flex-start;}
  .sec-3-prods-list .prod-box .type-more .type { width: calc(100% - 8vw); padding: 0.2vw 0 0 0; color: #1D3757; font-size: 2.2vw;}
  .sec-3-prods-list .prod-box .type-more img.more { width: 12vw; height: auto;}
  .sec-3-prods-list .prod-box .name { width: 100%; padding: 0.5vw 7vw 0 0; color: #42210B; font-size: 2.6vw; line-height: 2.8vw; font-weight: 500; box-sizing: border-box;}

  .sec-3-bottom { clear: both; width: 100%; background-color: #fff; position: relative;}
  .sec-3-bottom img.sec-3-bottom-bg { width: 140%; height: auto; margin: 0 0 0 -20%;}
  .sec-3-bottom img.sec-3-more-bt { width: 5vw; height: auto; position: absolute; top: 0; left: calc(50% - 2.5vw);}


  /************ section#sec-4 ************/

  section#sec-4 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-4-bg { width: 140%; height: auto; margin: -7vw 0 0 -20%;}

  .sec-4-title { width: 40vw; position: absolute; top: 14.5vw; right: 0;}
  .sec-4-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-4-title .en-desc-1 { width: 100%; color: #42210B; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-4-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .sec-4-title .cn-desc { width: 100%; color: #1D3757; font-size: 4.4vw; line-height: 5vw; font-weight: 700;}

  .sec-4-news-list { width: 50vw; position: absolute; top: 16vw; left: 3vw;}
  .sec-4-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .sec-4-news-list .news-list .news-box { width: 100%; padding: 2vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .sec-4-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .sec-4-news-list .news-list .news-box .date { width: 20%; line-height: 1.5vw;}
  .sec-4-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 1.6vw; line-height: 3vw;}
  .sec-4-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 3.4vw; font-weight: 500;}
  .sec-4-news-list .news-list .news-box .title { width: 80%; padding: 2.5vw 0 0 0; font-size: 2.6vw; font-weight: 500; line-height: 3vw;}
  .sec-4-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .sec-4-news-list .news-list .news-box .title a:hover { color: #42210B;}

  .sec-4-news-list img.news-more-bt { clear: both; width: 15vw; height: auto; margin: 3vw 0 0 0;}


  /************ section#sec-5 ************/

  section#sec-5 { clear: both; padding: 6vw 0; width: 100%; position: relative; z-index: 8;}

  .sec-5-title { width: 100%; padding: 0 0 3vw 13vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
  .sec-5-title .column-lf { width: 20vw;}
  .sec-5-title .column-lf .en-title { width: 100%; color: #F38F1E; font-size: 12vw; line-height: 12vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-5-title .column-rt { width: calc(100% - 20vw);}
  .sec-5-title .column-rt .en-desc-1 { width: 100%; color: #42210B; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-5-title .column-rt .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .sec-5-title .column-rt .cn-desc { width: 100%; color: #1D3757; font-size: 4.4vw; line-height: 5vw; font-weight: 700;}

  .sec-5-cases-slide { clear: both; width: 80vw; margin: 0 auto;}
  .sec-5-cases-slide .case-box { width: 80vw; padding: 0 0 1vw 0; position: relative;}
  .sec-5-cases-slide .case-box img.case-bg { width: 100%; height: auto; z-index: 1;}
  .sec-5-cases-slide .case-box .title-1 { width: 100%; height: 7.4vw; padding: 1.6vw 0 0 0; color: #42210B; font-size: 3.6vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .title-2 { width: 100%; height: 7.4vw; padding: 1.6vw 0 0 0; color: #fff; font-size: 3.6vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text { width: 100%; padding: 4vw 10vw 4vw 8vw; color: #000; font-size: 2.4vw; line-height: 4vw; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap; position: absolute; top: 7.4vw; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text .icon { width: 4vw;}
  .sec-5-cases-slide .case-box .text .list { width: calc(100% - 4vw);}
  .sec-5-cases-slide .case-box .more-bt { width: 5vw; position: absolute; bottom: 0.8vw; left: calc(50% - 2.6vw); z-index: 3;}
  .sec-5-cases-slide .case-box .more-bt img { width: 100%; height: auto;}


  /************ section#sec-6 ************/

  section#sec-6 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-6-bg { width: 140%; height: auto; margin: 0 0 0 -15%;}

  .sec-6-title { width: 44vw; position: absolute; top: 10vw; left: 4vw;}
  .sec-6-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-6-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-6-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .sec-6-title .cn-desc { width: 100%; color: #366B99; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}
  .sec-6-title .text-w { width: 100%; color: #fff; font-size: 2.4vw; font-weight: 300;}

  img.sec-6-more-bt { width: 15vw; height: auto; position: absolute; top: 42vw; left: 4vw;}


  /************ section#about ************/

  section#about-sec1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.about-sec1-bg { width: 140%; height: auto; margin: 0 0 0 -20%;}
  img.about-sec1-text { width: 38vw; height: auto; position: absolute; top: 9vw; right: 20vw;}

  section#about-sec2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.about-sec2-bg { width: 140%; height: auto; margin: -30.5vw 0 0 -20%;}

  .about-sec2-title { width: 100%; text-align: center; position: absolute; top: 30vw; left: 0;}
  .about-sec2-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec2-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .about-sec2-title .cn-desc { width: 100%; color: #fff; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .about-sec2-text { width: 75vw; color: #fff; font-size: 2vw; line-height: 3.4vw; font-weight: 300; text-align: center; position: absolute; top: 50vw; left: calc(50% - 37.5vw);}

  img.about-sec2-cert-logo { width: 10vw; height: auto; position: absolute; bottom: 18vw; left: calc(50% - 5vw);}
  img.about-sec2-pic { width: 40vw; height: auto; position: absolute; bottom: -9vw; right: 2vw;}

  section#about-sec3 { clear: both; width: 100%; padding: 10vw 4vw 6vw 4vw; margin: -10vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: no-repeat; background-position: center top; background-size: 140% auto; position: relative; z-index: 7;}

  .about-sec3-title { width: 100%; margin: 0 0 2vw 0;}
  .about-sec3-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec3-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec3-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .about-sec3-title .cn-desc { width: 100%; color: #17307D; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .about-sec3-features { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .about-sec3-features .icon { width: 3vw; padding: 0.6vw 0 0 0; margin: 0 0.7vw 1.5vw 0;}
  .about-sec3-features .icon img { width: 100%; height: auto;}
  .about-sec3-features .feature { width: calc(100% - 4.5vw); margin: 0 0 2vw 0; font-size: 2vw; font-weight: 300; line-height: 2.6vw; letter-spacing: 0.1vw;}
  .about-sec3-features .feature span.red { color: #BD272D;}

  img.about-sec3-4-illu { width: 36vw; height: auto; position: absolute; bottom: -16vw; right: 2vw;}

  section#about-sec4 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec4-bg { width: 140%; height: auto; margin: 0 0 0 -20%;}

  .about-sec4-title { width: 51vw; margin: 0 0 2vw 0; position: absolute; top: 12vw; left: 37vw;}
  .about-sec4-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec4-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec4-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .about-sec4-title .cn-desc { width: 100%; color: #17307D; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .about-sec4-text { width: 51vw; font-size: 2.2vw; line-height: 3vw; position: absolute; top: 32vw; left: 37vw;}

  section#about-sec5 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec5-bg { width: 120%; height: auto; margin: 0 0 0 -10%;}

  .about-sec5-title { width: 39vw; margin: 0 0 2vw 0; position: absolute; top: 13vw; left: 2vw;}
  .about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .about-se5-advantage { width: 53vw; position: absolute; top: 5.5vw; right: 2vw;}
  .about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .about-se5-advantage .text-1 { width: 13vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 1.4vw;}
  .about-se5-advantage .text-2 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 19.2vw;}
  .about-se5-advantage .text-3 { width: 14.4vw; color: #fff; font-size: 1.8vw; text-align: center; position: absolute; top: 17vw; left: 37.8vw;}

  section#about-sec6 { clear: both; width: 100%; padding: 8vw 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  section#about-sec7 { clear: both; width: 100%; padding: 8vw 4vw; box-sizing: border-box; background-color: #eee; display: flex; justify-content: flex-start; align-items: flex-start; position: relative; z-index: 8;}

  .about-sec7-title { width: 44vw;}
  .about-sec7-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec7-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec7-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .about-sec7-title .cn-desc { width: 100%; color: #17307D; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .about-sec7-dl-list { width: calc(100% - 44vw);}
  .about-sec7-dl-list .list-box { width: 100%; border-bottom: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:first-child { border-top: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:hover { background-color: #fff;}
  .about-sec7-dl-list .list-box a { width: 100%; padding: 1vw; box-sizing: border-box; text-decoration: none; display: flex; justify-content: flex-start; align-items: flex-start;}
  .about-sec7-dl-list .list-box a .icon { width: 5vw; color: #F38F1E; font-size: 2.8vw;}
  .about-sec7-dl-list .list-box a .title { width: calc(100% - 5vw); color: #42210B; font-size: 2.8vw;}


  /************ section#certification ************/

  section#page-certification { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -13vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 140% auto; position: relative; z-index: 8;}

  .page-cert-content { clear: both; width: 100%; padding: 0 4vw; box-sizing: border-box;}
  .page-cert-content .certi-logos { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-logos img { width: auto; height: 7.5vw; margin: 0 1vw 2vw 1vw;}
  .page-cert-content .certi-papers { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-papers img { width: 19vw; height: auto; margin: 0 0.5vw 2vw 0.5vw; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);}


  /************ section#download ************/

  section#download { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}


  /************ section#law-source ************/

  img.law-sec1-text { width: 38vw; height: auto; position: absolute; top: 7.3vw; right: 3vw;}

  section#law-source-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  .law-source-title { clear: both; width: 100%; text-align: center;}
  .law-source-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .law-source-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .law-source-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .law-source-title .cn-desc { width: 100%; color: #17307D; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .law-source-list-full { clear: both; width: 100%; padding: 0 6vw; box-sizing: border-box;}
  .law-source-list-full .law-class1 { width: 100%; margin: 4vw 0 2vw 0;}
  .law-source-list-full .law-class1 span.title { padding: 0.5vw 2vw; color: #fff; font-size: 2.2vw; border-radius: 2.8vw; background-color: #F38F1E;}
  .law-source-list-full .law-class2 { clear: both; width: 100%; margin: 0 0 1.5vw 0;}
  .law-source-list-full .law-class2 span.title { padding: 0.5vw 2vw; margin: 0 0 0 3vw; color: #fff; font-size: 1.8vw; border-radius: 2.8vw; background-color: #C2986D;}
  .law-source-list-full .law-class3-list { clear: both; width: calc(100% - 3vw); padding: 0.5vw 0; margin: 0 0 0 3vw; box-sizing: border-box; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .law-source-list-full .law-class3-list.up { margin-top: 0;}
  .law-source-list-full .law-class3-list .title { width: 10vw; font-size: 1.8vw;}
  .law-source-list-full .law-class3-list .text { width: calc(100% - 15vw); font-size: 1.8vw;}
  .law-source-list-full .law-class3-list .link { width: 5vw; text-align: right;}
  .law-source-list-full .law-class3-list .link a { color: #42210B; font-size: 2.2vw;}


  /************ section#service ************/

  section#service { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  .service-items { clear: both; width: 80vw; margin: 6vw auto 0 auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .service-items .item-box { width: 40vw; padding: 0 2vw; box-sizing: border-box;}
  .service-items .item-box .photo { width: 36vw; height: 36vw; border-radius: 100%; border: 6px #F38F1E solid; background-color: #fff; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden;}
  .service-items .item-box .photo img { width: auto; height: 100%;}
  .service-items .item-box .title { width: 100%; margin: 1vw 0 3vw 0; color: #42210B; font-size: 2.6vw; font-weight: 500; text-align: center;}


  /************ section#news ************/

  img.news-sec1-text { width: 38vw; height: auto; position: absolute; top: 14vw; left: 28vw;}

  section#news-content { clear: both; width: 100%; padding: 16vw 0 8vw 0; margin: -14vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  .page-news-list { clear: both; width: 80vw; margin: 4vw auto 0 auto;}
  .page-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .page-news-list .news-list .news-box { width: 100%; padding: 1.5vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .page-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .page-news-list .news-list .news-box .date { width: 10vw; line-height: 2.6vw;}
  .page-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 2.2vw;}
  .page-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 3.2vw; font-weight: 500;}
  .page-news-list .news-list .news-box .title { width: calc(100% - 10vw); padding: 2.6vw 0 0 0; font-size: 3vw; font-weight: 500; line-height: 3.2vw;}
  .page-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .page-news-list .news-list .news-box .title a:hover { color: #42210B;}

  ul#page-num { clear: both; width: 100%; padding: 0; margin: 4vw 0 0 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-num li { padding: 0; margin: 0 0.3vw 1vw 0.3vw;}
  ul#page-num li a { padding: 0.5vw 0.7vw; color: #fff; font-size: 2vw; border-radius: 0.8vw; background-color: #F38F1E; text-decoration: none; display: block;}
  ul#page-num li a:hover { background-color: #C2986D;}
  ul#page-num li a.sel { background-color: #42210B;}

  .page-news-content { clear: both; width: 80vw; margin: 5vw auto 0 auto;}
  .page-news-content .title { width: 100%; padding: 1.5vw 0; color: #F38F1E; font-size: 3vw; font-weight: 500; line-height: 3.6vw; border-bottom: 1px #F38F1E solid;}
  .page-news-content .date { width: 100%; padding: 1vw 0; color: #17307D; font-size: 2.2vw; text-align: right;}
  .page-news-content .text-content { width: 100%; margin: 5vw 0; font-size: 2.6vw; line-height: 3.4vw;}
  .page-news-content .text-content img { max-width: 100%; height: auto;}

  .go-back-bt { clear: both; width: 16vw; margin: 0 auto;}
  .go-back-bt a { width: 100%; padding: 0.6vw 0; color: #fff; font-size: 2.2vw; text-align: center; text-decoration: none; border-radius: 2.2vw; background-color: #F38F1E; display: block;}
  .go-back-bt a:hover { background-color: #C2986D;}


  /************ section#case ************/

  img.case-sec1-text { width: 38vw; height: auto; position: absolute; top: 6vw; left: 28vw;}

  section#case-content { clear: both; width: 100%; padding: 14vw 0 8vw 0; margin: -14vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  .case-list-full { clear: both; width: 90vw; margin: 5vw auto 0 auto;}
  .case-list-full .column { padding: 0 1vw 2vw 1vw; box-sizing: border-box;}
  .case-list-full .column.grid-item { width: 50%; float: left;}
  .case-list-full .column .title { width: 100%; padding: 0.8vw 0; font-size: 3.2vw; font-weight: 500; text-align: center;}
  .case-list-full .column .title.top-style-1 { color: #42210B; background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .title.top-style-2 { color: #fff; background-color: #42210B;}
  .case-list-full .column .title.top-style-3 { color: #fff; background-color: #F38F1E;}
  .case-list-full .column .list { width: 100%; padding: 2vw; font-size: 2.2vw; line-height: 2.6vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .case-list-full .column .list.bg-style-1 { background-color: #eee;}
  .case-list-full .column .list.bg-style-2 { background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .list.bg-style-3 { background-color: #F38F1E;}
  .case-list-full .column .list .icon { width: 3vw; margin: 0 0 1.5vw 0;}
  .case-list-full .column .list .text { width: calc(100% - 3vw); margin: 0 0 1.5vw 0;}
  .case-list-full .column .list .text a { color: #000; text-decoration: none;}
  .case-list-full .column .list .text a:hover { border-bottom: 1px #000 dashed;}

  .case-title-bar { clear: both; width: 90vw; padding: 0.6vw 0; margin: 5vw auto 0 auto; border-bottom: 1px #42210B solid; text-align: center;}
  .case-title-bar span.big { color: #42210B; font-size: 3.4vw; font-weight: 500;}
  .case-title-bar span.small { color: #F38F1E; font-size: 2.8vw;}

  .case-photos-list { clear: both; width: 90vw; margin: 5vw auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .case-photos-list a { width: calc(100% / 3 - 2vw); height: 16vw; margin: 0 1vw 2vw 1vw; text-decoration: none; overflow: hidden; display: flex; align-items: center;}
  .case-photos-list a img { width: 100%; height: auto;}

  ul#page-cases-class-tab { clear: both; width: 90vw; padding: 0; margin: 6vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-cases-class-tab li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#page-cases-class-tab li a { padding: 0.5vw 1.5vw; color: #42210B; font-size: 2.4vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-cases-class-tab li a:hover { background-color: #C2986D;}
  ul#page-cases-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-cases-list { clear: both; width: 90vw; margin: 0 auto;}
  .page-cases-list .case-list-x4 { width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .page-cases-list .case-list-x4 .case-list-box { width: calc(100% / 3); padding: 0 1.5vw; margin: 0 0 3vw 0; box-sizing: border-box;}
  .page-cases-list .case-list-x4 .case-list-box a { width: 100%; text-decoration: none; display: block;}
  .page-cases-list .case-list-x4 .case-list-box a .pic { width: 100%; height: 16vw; border: 5px #fff solid; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-sizing: border-box; display: flex; align-items: center; overflow: hidden;}
  .page-cases-list .case-list-x4 .case-list-box a .pic img { width: 100%; height: auto;}
  .page-cases-list .case-list-x4 .case-list-box a .title { width: 100%; padding: 1vw 0 0 0; color: #42210B; font-size: 1.8vw; font-weight: 500; line-height: 2.2vw; text-align: center;}


  /************ section#products ************/

  img.products-sec1-text { width: 38vw; height: auto; position: absolute; top: 4vw; left: 28vw;}

  section#products-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  ul#page-prod-class-tab { clear: both; width: 88vw; padding: 0; margin: 6vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-prod-class-tab li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#page-prod-class-tab li a { padding: 0.5vw 1.5vw; color: #42210B; font-size: 2.4vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-prod-class-tab li a:hover { background-color: #C2986D;}
  ul#page-prod-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-prod-list { clear: both; width: 100%;}

  .page-prod-title { clear: both; width: 90vw; padding: 1vw 0; margin: 5vw auto; color: #42210B; font-size: 3.8vw; font-weight: 600; text-align: center; border-bottom: 2px #42210B solid;}

  .page-prod-photos-list { clear: both; width: 80vw; margin: 0 auto 5vw auto;}
  .page-prod-photos-list img { width: 80vw; height: auto; box-sizing: border-box;}

  .page-prod-content { clear: both; width: 80vw; margin: 0 auto 4vw auto; font-size: 2.8vw; line-height: 3.8vw;}
  .page-prod-content span.title { padding: 0 2vw; color: #fff; font-size: 3.2vw; line-height: 5.4vw; font-weight: 500; border-radius: 0 2.4vw; background-color: #F38F1E;}
  .page-prod-content ul.dot { padding: 0 0 0 2.8vw; margin: 0; list-style-type: disc; display: block;}
  .page-prod-content ul.dot li { padding: 0; margin: 0;}
  .page-prod-content .prod-intro-video { width: 100%;}
  
  .page-prod-certifi { clear: both; width: 80vw; margin: 6vw auto; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  .page-prod-certifi img { width: auto; height: 9vw; margin: 0 1.5vw 3vw 1.5vw;}


  /************ section#dealer ************/

  section#dealer { clear: both; width: 100%; padding: 18vw 4VW 6vw 4VW; margin: -14vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; display: flex; justify-content: flex-start; align-items: flex-start; position: relative; z-index: 8;}

  .page-dealer-title { width: 38VW;}
  .page-dealer-title .en-title { width: 100%; color: #F38F1E; font-size: 9.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .page-dealer-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 1.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .page-dealer-title .en-desc-2 { width: 100%; color: #808080; font-size: 1.4vw; font-weight: 300;}
  .page-dealer-title .cn-desc { width: 100%; color: #17307D; font-size: 4.4vw; line-height: 5.2vw; font-weight: 700;}

  .page-dealer-content { width: calc(100% - 38vw);}
  .page-dealer-content img.dealer-map { max-width: 100%; height: auto; margin: -4vw 0 0 0;}

  .page-dealer-hire { width: 19vw; color: #ff0000; font-size: 4.6vw; line-height: 5.2vw; font-weight: 700; text-align: center; position: absolute; top: 44vw; left: 4vw;}


  /************ section#contact ************/

  section#contact { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  .contact-content { clear: both; width: 90vw; margin: 4vw auto 0 auto;}
  .contact-content .column-rt { width: 45vw; float: right;}
  .contact-content .column-rt form { width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
  .contact-content .column-rt form .caption { width: 15vw; margin: 0 0 2.5vw 0; color: #42210B; font-size: 2.2vw; text-align: right;}
  .contact-content .column-rt form .column { width: calc(100% - 15vw); margin: 0 0 2.5vw 0; color: #F38F1E; font-size: 2.2vw;}
  .contact-content .column-rt form .column input[type=text] { width: 100%; padding: 0.5vw 1vw; color: #F38F1E; font-size: 2.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column textarea { width: 100%; height: 6vw; padding: 0.5vw 1vw; color: #F38F1E; font-size: 2.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column img.con-code { width: 15vw; height: auto; margin: 0 0 0.5vw 0;}
  .contact-content .column-rt form .column input[type=submit] { padding: 0.5vw 2vw; color: #fff; font-size: 2.2vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 0; background-color: #F38F1E; box-sizing: border-box; cursor: pointer;}
  .contact-content .column-lf { width: 45vw; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; float: left;}
  .contact-content .column-lf .sub-title { width: 12vw; margin: 0 0 0.5vw 0; color: #42210B; font-size: 2.2vw; text-align: right;}
  .contact-content .column-lf .infor { width: calc(100% - 12vw); margin: 0 0 0.5vw 0; color: #F38F1E; font-size: 2.2vw;}
  .contact-content .column-lf img.qrcode { width: 50%; height: auto; margin: 3vw 0 0.5vw 0;}
  .contact-content .column-lf .line-id { width: 100%; color: #F38F1E; font-size: 2.2vw;}


  /************ sitemap ************/

  section#sitemap { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  ul#sitemap-nav { clear: both; width: 80vw; padding: 0; margin: 6vw auto 0 auto; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  ul#sitemap-nav li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#sitemap-nav li a { padding: 0.5vw; color: #42210B; font-size: 2.8vw; font-weight: 500; text-decoration: none; display: block;}
  ul#sitemap-nav li a:hover { border-bottom: 2px #42210B solid;}
  ul#sitemap-nav li ul.nav-2nd { padding: 0; margin: 0; list-style: none; display: block;}
  ul#sitemap-nav li ul.nav-2nd li { padding: 0; margin: 0; text-align: center;}
  ul#sitemap-nav li ul.nav-2nd li a { padding: 0 0 0.4vw 0; color: #F38F1E; font-size: 2.6vw; font-weight: 400;}
  ul#sitemap-nav li ul.nav-2nd li a:hover { border-bottom: 2px #F38F1E solid;}


  /************ footer ************/

  footer { clear: both; width: 100%;}

  .footer-logo-add { width: 100%; position: relative; z-index: 8;}
  .footer-logo-add img.footer-bg { width: 140%; height: auto; margin: 0 0 0 -20%;}
  .footer-logo-add .logo-slogan { width: 40vw; position: absolute; top: 5vw; left: 3vw; display: flex; justify-content: flex-start;}
  .footer-logo-add .logo-slogan img.logo { width: 15vw; height: auto; margin: 0 1vw 0 0;}
  .footer-logo-add .logo-slogan img.slogan { width: 25vw; height: auto;}
  .footer-logo-add .add-contact { width: 50vw; position: absolute; top: 5vw; right: 0; display: flex; justify-content: flex-start; align-items: flex-start;}
  .footer-logo-add .add-contact .column { width: 25vw; margin: 0 0 0 2vw; color: #42210B; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;} 
  .footer-logo-add .add-contact .column .icon { width: 3vw; margin: 0 0 0.5vw 0;}
  .footer-logo-add .add-contact .column .icon img { width: 2.2vw; height: auto;}
  .footer-logo-add .add-contact .column .city { width: calc(100% - 3vw); margin: 0 0 0.5vw 0; font-size: 2.4vw; font-weight: 500;}
  .footer-logo-add .add-contact .column .text { width: calc(100% - 3vw); margin: 0 0 0.5vw 0; font-size: 1.4vw;}

  .footer-brands { width: 100%; padding: 2.5vw 0; background-color: #fff; display: flex; justify-content: center; align-items: center;}
  .footer-brands img { width: auto; height: 6.5vw; margin: 0 1vw;}

  .footer-nav { width: 100%; padding: 2vw 0 3vw 0; background-color: #1D3757;}
  .footer-nav ul.footer-nav-1c { padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start;}
  .footer-nav ul.footer-nav-1c li { padding: 0; margin: 0 1.5vw;}
  .footer-nav ul.footer-nav-1c li a { color: #fff; font-size: 1.8vw; font-weight: 400; letter-spacing: 0.1vw; text-decoration: none;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c { padding: 0; margin: 0.5vw 0 0 0; list-style: none; display: block;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li { padding: 0; margin: 0 0 0.3vw 0; text-align: center;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li a { color: #ccc; font-size: 1.6vw; font-weight: 300; letter-spacing: 0;}

  .footer-copyright { width: 100%; padding: 1vw 0; font-size: 1.6vw; text-align: center; background-color: #fff;}


}

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

  /************ header + nav ************/

  header { width: 100%; height: 60px; padding: 0 10px; background-color: #fff; display: flex; justify-content: center; align-items: flex-start; box-sizing: border-box; position: relative; z-index: 99;}

  .header-logo-icons { width: 140px;}
  .header-logo-icons img.logo { width: 100%; height: auto; margin: 0 0 5px 0;}
  .header-logo-icons .icons { width: 100%; margin: 0 0 5px 0; display: flex; justify-content: center; align-items: center;}
  .header-logo-icons .icons img.icon { width: 30px; height: auto; margin: 0 5px;}
  .header-logo-icons .tel { width: 100%; color: #42210B; font-size: 0.8em; font-weight: 600; line-height: 1.2em; text-align: center; text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white}

  nav#pc { display: none;}

  nav#mo { width: calc(100% - 140px);}
  nav#mo .nav-icon-open { width: 60px; height: 60px; color: #42210B; font-size: 2.6em; display: flex; justify-content: center; align-items: center; cursor: pointer; float: right;}
  nav#mo ul#nav-1c { width: 100%; padding: 20px 40px 40px 40px; margin: 0; background-color: #C2986D; list-style: none; box-sizing: border-box; display: block; position: absolute; top: 0; right: -100%;}
  nav#mo ul#nav-1c .nav-icon-close { width: 60px; color: #42210B; font-size: 2.6em; text-align: center; float: right;}
  nav#mo ul#nav-1c li { clear: both; width: 100%; padding: 0; margin: 0; border-bottom: 1px #906131 solid; position: relative;}
  nav#mo ul#nav-1c li:last-child { border-bottom: 0;}
  nav#mo ul#nav-1c li a { width: 100%; padding: 15px 0; color: #42210B; text-align: center; text-decoration: none; border-radius: 16px; display: block;}
  nav#mo ul#nav-1c li a span.en { font-size: 1em; line-height: 1em; font-weight: 300;}
  nav#mo ul#nav-1c li a span.cn { font-size: 1.4em; line-height: 1em; font-weight: 400;}
  nav#mo ul#nav-1c li a.sel { color: #fff; text-align: center;}
  nav#mo ul#nav-1c li a.sel span.cn { font-weight: 600;}
  nav#mo ul#nav-1c li .pop-icon { width: 30px; color: #42210B; font-size: 1.6em; position: absolute; top: 30px; right: calc(50% - 100px);}
  nav#mo ul#nav-1c li ul#nav-2c { width: 100%; padding: 0 20px; margin: 0 0 20px 0; list-style: none; background-color: rgba(255,255,255,0.2); display: none; box-sizing: border-box;}
  nav#mo ul#nav-1c li ul#nav-2c li { width: 100%; padding: 0; margin: 0; text-align: center; border-bottom: 1px #eee solid; border-right: 0; box-sizing: border-box;}
  nav#mo ul#nav-1c li ul#nav-2c li:last-child { border-bottom: 0;}
  nav#mo ul#nav-1c li ul#nav-2c li a { width: 100%; padding: 15px 0; color: #42210B; font-size: 1.2rem; text-decoration: none; border-radius: 0; background-color: transparent;}


  /************ section#sec-1 ************/

  section#sec-1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.sec-1-bg { width: 180%; height: auto; margin: 0 0 0 -40%;}
  img.sec-1-text { width: 40vw; height: auto; position: absolute; bottom: 10vw; left: 4vw;}
  /*img.sec-1-pic { width: 54vw; height: auto; position: absolute; top: 18vw; right: 3vw;}*/
  img.sec-1-pic { width: 56vw; height: auto; position: absolute; top: 18vw; right: 3vw;}


  /************ section#sec-2 ************/

  section#sec-2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-2-bg { width: 280%; height: auto; margin: -60vw 0 0 -90%;}

  .sec-2-title { width: 100%; text-align: center; position: absolute; top: 23vw; left: 0;}
  .sec-2-title .en-title { width: 100%; color: #F38F1E; font-size: 11vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-2-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .sec-2-title .cn-desc { width: 100%; color: #fff; font-size: 5.4vw; line-height: 6vw; font-weight: 700;}

  .sec-2-desc-items { width: 100%; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; position: absolute; top: 55vw; left: 0;}
  .sec-2-desc-items .item-box { width: 36vw; margin: 0 2vw 2vw 2vw;}
  .sec-2-desc-items .item-box img { width: 100%; height: auto;}
  .sec-2-desc-items .item-box .text-w { clear: both; width: 88%; margin: 1vw auto 0 auto; color: #fff; font-size: 2.8vw; line-height: 3.6vw; font-weight: 300; text-align: center;}
  .sec-2-desc-items .item-box .text-y { clear: both; width: 88%; margin: 1vw auto 0 auto; color: #C2986D; font-size: 2.8vw; line-height: 3.6vw; font-weight: 300; text-align: center;}

  .sec2-more-bt { width: 20vw; position: absolute; bottom: 20vw; right: 5vw;}
  .sec2-more-bt img { width: 100%; height: auto; margin: 0 auto;}

  .hp-about-sec5-title { width: 100%; margin: 0 0 2vw 0; text-align: center; position: absolute; top: 64vw; left: 0;}
  .hp-about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .hp-about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .hp-about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .hp-about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .hp-about-se5-advantage { width: 90vw; position: absolute; top: 100vw; left: calc(50% - 45vw);}
  .hp-about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .hp-about-se5-advantage .text-1 { width: 20vw; color: #fff; font-size: 3vw; text-align: center; position: absolute; top: 30vw; left: 3.4vw;}
  .hp-about-se5-advantage .text-2 { width: 22vw; color: #fff; font-size: 3vw; text-align: center; position: absolute; top: 30vw; left: 34vw;}
  .hp-about-se5-advantage .text-3 { width: 22vw; color: #fff; font-size: 3vw; text-align: center; position: absolute; top: 30vw; left: 65.2vw;}


  /************ section#sec-3 ************/

  section#sec-3 { clear: both; width: 100%; padding: 16vw 0 0 0; margin: -26vw 0 0 0; background-color: #eee; position: relative; z-index: 7;}

  .sec-3-title { width: 100%; text-align: center;}
  .sec-3-title .en-title { width: 100%; color: #F38F1E; font-size: 11vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-3-title .en-desc-1 { width: 100%; color: #42210B; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-3-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .sec-3-title .cn-desc { width: 100%; color: #1D3757; font-size: 5.4vw; line-height: 6vw; font-weight: 700;}

  .sec-3-prods-list { clear: both; width: 100%; margin: 6vw 0 0 0;}
  .sec-3-prods-list .prod-box { width: 80vw; margin: 0 auto 6vw auto;}
  .sec-3-prods-list .prod-box .pic { width: 100%;}
  .sec-3-prods-list .prod-box .pic img { width: 100%; height: auto;}
  .sec-3-prods-list .prod-box .type-more { width: 100%; padding: 1vw 0; border-bottom: 1px #959595 solid; display: flex; justify-content: flex-start;}
  .sec-3-prods-list .prod-box .type-more .type { width: calc(100% - 20vw); padding: 0.5vw 0 0 0; color: #1D3757; font-size: 4vw;}
  .sec-3-prods-list .prod-box .type-more img.more { width: 20vw; height: auto;}
  .sec-3-prods-list .prod-box .name { width: 100%; padding: 0.5vw 7vw 0 0; color: #42210B; font-size: 4.6vw; line-height: 4.8vw; font-weight: 500; box-sizing: border-box;}

  .sec-3-bottom { clear: both; width: 100%; background-color: #fff; position: relative;}
  .sec-3-bottom img.sec-3-bottom-bg { width: 240%; height: auto; margin: 0 0 0 -70%;}
  .sec-3-bottom img.sec-3-more-bt { width: 10vw; height: auto; position: absolute; top: 0; left: calc(50% - 5vw);}


  /************ section#sec-4 ************/

  section#sec-4 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-4-bg { width: 240%; height: auto; margin: -13vw 0 0 -70%;}

  .sec-4-title { width: calc(100% - 10vw); position: absolute; top: 18vw; left: 5vw;}
  .sec-4-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-4-title .en-desc-1 { width: 100%; color: #42210B; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-4-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .sec-4-title .cn-desc { width: 100%; color: #1D3757; font-size: 5.4vw; line-height: 6vw; font-weight: 700;}

  .sec-4-news-list { width: calc(100% - 10vw); position: absolute; top: 50vw; left: 5vw;}
  .sec-4-news-list .news-list { width: 100%; border-top: 3px #333 solid; border-bottom: 3px #333 solid;}
  .sec-4-news-list .news-list .news-box { width: 100%; padding: 3vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .sec-4-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .sec-4-news-list .news-list .news-box .date { width: 15vw; line-height: 2.5vw;}
  .sec-4-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 2.6vw; line-height: 4vw;}
  .sec-4-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 4.4vw; font-weight: 500;}
  .sec-4-news-list .news-list .news-box .title { width: calc(100% - 15vw); padding: 3vw 0 0 0; font-size: 3.6vw; font-weight: 500; line-height: 4vw;}
  .sec-4-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .sec-4-news-list .news-list .news-box .title a:hover { color: #42210B;}

  .sec-4-news-list img.news-more-bt { clear: both; width: 20vw; height: auto; margin: 5vw 0 0 0;}


  /************ section#sec-5 ************/

  section#sec-5 { clear: both; padding: 4vw 0 8vw 0; width: 100%; position: relative; z-index: 8;}

  .sec-5-title { width: 100%; padding: 0 0 5vw 13vw; box-sizing: border-box;}
  .sec-5-title .column-lf { width: 100%;}
  .sec-5-title .column-lf .en-title { width: 100%; color: #F38F1E; font-size: 13vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-5-title .column-rt { width: 100%;}
  .sec-5-title .column-rt .en-desc-1 { width: 100%; color: #42210B; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-5-title .column-rt .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .sec-5-title .column-rt .cn-desc { width: 100%; color: #1D3757; font-size: 5.4vw; line-height: 6vw; font-weight: 700;}

  .sec-5-cases-slide { clear: both; width: 80vw; margin: 0 auto;}
  .sec-5-cases-slide .case-box { width: 80vw; padding: 0 0 1vw 0; position: relative;}
  .sec-5-cases-slide .case-box img.case-bg { width: 100%; height: auto; z-index: 1;}
  .sec-5-cases-slide .case-box .title-1 { width: 100%; height: 7.4vw; padding: 1.6vw 0 0 0; color: #42210B; font-size: 3.6vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .title-2 { width: 100%; height: 7.4vw; padding: 1.6vw 0 0 0; color: #fff; font-size: 3.6vw; font-weight: 600; text-align: center; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text { width: 100%; padding: 4vw 10vw 4vw 8vw; color: #000; font-size: 2.4vw; line-height: 4vw; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap; position: absolute; top: 7.4vw; left: 0; z-index: 2;}
  .sec-5-cases-slide .case-box .text .icon { width: 4vw;}
  .sec-5-cases-slide .case-box .text .list { width: calc(100% - 4vw);}
  .sec-5-cases-slide .case-box .more-bt { width: 7vw; position: absolute; bottom: 0; left: calc(50% - 3.5vw); z-index: 3;}
  .sec-5-cases-slide .case-box .more-bt img { width: 100%; height: auto;}


  /************ section#sec-6 ************/

  section#sec-6 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.sec-6-bg { width: 200%; height: auto; margin: 0 0 0 -50%;}

  .sec-6-title { width: calc(100% - 8vw); position: absolute; top: 12vw; left: 4vw;}
  .sec-6-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .sec-6-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .sec-6-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .sec-6-title .cn-desc { width: 100%; color: #366B99; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}
  .sec-6-title .text-w { width: 100%; color: #fff; font-size: 3.4vw; font-weight: 300;}

  img.sec-6-more-bt { width: 20vw; height: auto; position: absolute; top: 60vw; left: 4vw;}


  /************ section#about ************/

  section#about-sec1 { clear: both; width: 100%; position: relative; z-index: 9;}

  img.about-sec1-bg { width: 200%; height: auto; margin: 0 0 0 -50%;}
  img.about-sec1-text { width: 46vw; height: auto; position: absolute; top: 14vw; right: 10vw;}

  section#about-sec2 { clear: both; width: 100%; position: relative; z-index: 8;}

  img.about-sec2-bg { width: 200%; height: auto; margin: -30.5vw 0 0 -50%;}

  .about-sec2-title { width: 100%; text-align: center; position: absolute; top: 30vw; left: 0;}
  .about-sec2-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec2-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec2-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .about-sec2-title .cn-desc { width: 100%; color: #fff; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .about-sec2-text { width: 80vw; color: #fff; font-size: 4vw; line-height: 5.4vw; font-weight: 300; text-align: center; position: absolute; top: 57vw; left: calc(50% - 40vw);}

  img.about-sec2-cert-logo { width: 12vw; height: auto; position: absolute; bottom: 25vw; left: calc(50% - 6vw);}
  img.about-sec2-pic { width: 48vw; height: auto; position: absolute; bottom: -10vw; right: -6vw;}

  section#about-sec3 { clear: both; width: 100%; padding: 18vw 4vw 14vw 4vw; margin: -14vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: no-repeat; background-position: center top; background-size: 200% auto; position: relative; z-index: 7;}

  .about-sec3-title { width: 100%; margin: 0 0 6vw 0;}
  .about-sec3-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec3-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec3-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .about-sec3-title .cn-desc { width: 100%; color: #17307D; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .about-sec3-features { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .about-sec3-features .icon { width: 6vw; padding: 1.4vw 0 0 0; margin: 0 0.7vw 3vw 0;}
  .about-sec3-features .icon img { width: 100%; height: auto;}
  .about-sec3-features .feature { width: calc(100% - 7.5vw); margin: 0 0 3vw 0; font-size: 4vw; font-weight: 300; line-height: 5.6vw; letter-spacing: 0.1vw;}
  .about-sec3-features .feature span.red { color: #BD272D;}

  img.about-sec3-4-illu { width: 46vw; height: auto; position: absolute; bottom: -20vw; right: 2vw;}

  section#about-sec4 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec4-bg { width: 240%; height: auto; margin: 0 0 0 -70%;}

  .about-sec4-title { width: 64vw; margin: 0 0 2vw 0; position: absolute; top: 18vw; left: 28vw;}
  .about-sec4-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec4-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec4-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .about-sec4-title .cn-desc { width: 100%; color: #17307D; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .about-sec4-text { width: 64vw; font-size: 4vw; line-height: 5vw; position: absolute; top: 45vw; left: 28vw;}

  section#about-sec5 { clear: both; width: 100%; position: relative; z-index: 6;}

  img.about-sec5-bg { width: 280%; height: auto; margin: 0 0 0 -90%;}

  .about-sec5-title { width: 100%; margin: 0 0 2vw 0; text-align: center; position: absolute; top: 8vw; left: 0;}
  .about-sec5-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive;}
  .about-sec5-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .about-sec5-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .about-sec5-title .cn-desc { width: 100%; color: #fff; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .about-se5-advantage { width: 90vw; position: absolute; top: 38vw; left: calc(50% - 45vw);}
  .about-se5-advantage img.advantage-bg { width: 100%; height: auto; position: relative;}
  .about-se5-advantage .text-1 { width: 20vw; color: #fff; font-size: 3vw; text-align: center; position: absolute; top: 30vw; left: 3.4vw;}
  .about-se5-advantage .text-2 { width: 22vw; color: #fff; font-size: 3vw; text-align: center; position: absolute; top: 30vw; left: 34vw;}
  .about-se5-advantage .text-3 { width: 22vw; color: #fff; font-size: 3vw; text-align: center; position: absolute; top: 30vw; left: 65.2vw;}

  section#about-sec6 { clear: both; width: 100%; padding: 10vw 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  section#about-sec7 { clear: both; width: 100%; padding: 10vw 4vw; box-sizing: border-box; background-color: #eee; position: relative; z-index: 8;}

  .about-sec7-title { width: 100%; margin: 0 0 6vw 0;}
  .about-sec7-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; font-family: 'Big Shoulders Display', cursive; text-align: center;}
  .about-sec7-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw; text-align: center;}
  .about-sec7-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300; text-align: center;}
  .about-sec7-title .cn-desc { width: 100%; color: #17307D; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700; text-align: center;}

  .about-sec7-dl-list { width: 100%;}
  .about-sec7-dl-list .list-box { width: 100%; border-bottom: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:first-child { border-top: 1px #42210B dashed;}
  .about-sec7-dl-list .list-box:hover { background-color: #fff;}
  .about-sec7-dl-list .list-box a { width: 100%; padding: 1.5vw; box-sizing: border-box; text-decoration: none; display: flex; justify-content: flex-start; align-items: flex-start;}
  .about-sec7-dl-list .list-box a .icon { width: 7.5vw; color: #F38F1E; font-size: 5vw;}
  .about-sec7-dl-list .list-box a .title { width: calc(100% - 7.5vw); color: #42210B; font-size: 5vw;}


  /************ section#certification ************/

  section#page-certification { clear: both; width: 100%; padding: 14vw 0 10vw 0; margin: -18vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 200% auto; position: relative; z-index: 8;}

  .page-cert-content { clear: both; width: 100%; padding: 0 4vw; box-sizing: border-box;}
  .page-cert-content .certi-logos { width: 100%; margin: 8vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-logos img { width: auto; height: 17vw; margin: 0 3vw 6vw 3vw;}
  .page-cert-content .certi-papers { width: 100%; margin: 3vw 0 0 0; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .page-cert-content .certi-papers img { width: calc(50% - 2vw); height: auto; margin: 0 1vw 4vw 1vw; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);}


  /************ section#download ************/

  section#download { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -18vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}


  /************ section#law-source ************/

  img.law-sec1-text { width: 46vw; height: auto; position: absolute; top: 7.3vw; right: 3vw;}

  section#law-source-content { clear: both; width: 100%; padding: 18vw 0 8vw 0; margin: -18vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  .law-source-title { clear: both; width: 100%; text-align: center;}
  .law-source-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .law-source-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .law-source-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .law-source-title .cn-desc { width: 100%; color: #17307D; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .law-source-list-full { clear: both; width: 100%; padding: 0 4vw; box-sizing: border-box;}
  .law-source-list-full .law-class1 { width: 100%; margin: 8vw 0 4vw 0;}
  .law-source-list-full .law-class1 span.title { padding: 0.8vw 4vw; color: #fff; font-size: 4.2vw; border-radius: 3.8vw; background-color: #F38F1E;}
  .law-source-list-full .law-class2 { clear: both; width: 100%; margin: 0 0 3vw 0;}
  .law-source-list-full .law-class2 span.title { padding: 0.8vw 4vw; color: #fff; font-size: 3.8vw; border-radius: 3.8vw; background-color: #C2986D;}
  .law-source-list-full .law-class3-list { clear: both; width: 100%; padding: 2vw 0; box-sizing: border-box; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .law-source-list-full .law-class3-list.up { margin-top: 0;}
  .law-source-list-full .law-class3-list .title { width: 100%; font-size: 3.8vw; margin: 0 0 1vw 0;}
  .law-source-list-full .law-class3-list .text { width: calc(100% - 8vw); font-size: 3.8vw;}
  .law-source-list-full .law-class3-list .link { width: 8vw; text-align: right;}
  .law-source-list-full .law-class3-list .link a { color: #42210B; font-size: 4.4vw;}


  /************ section#service ************/

  section#service { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  .service-items { clear: both; width: 70vw; margin: 8vw auto 0 auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .service-items .item-box { width: 70vw;}
  .service-items .item-box .photo { width: 70vw; height: 70vw; border-radius: 100%; border: 6px #F38F1E solid; background-color: #fff; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden;}
  .service-items .item-box .photo img { width: auto; height: 100%;}
  .service-items .item-box .title { width: 100%; margin: 2vw 0 6vw 0; color: #42210B; font-size: 5vw; font-weight: 500; text-align: center;}


  /************ section#news ************/

  img.news-sec1-text { width: 46vw; height: auto; position: absolute; top: 180px; left: 4vw;}

  section#news-content { clear: both; width: 100%; padding: 16vw 0 8vw 0; margin: -14vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  .page-news-list { clear: both; width: 90vw; margin: 8vw auto 0 auto;}
  .page-news-list .news-list { width: 100%; border-top: 4px #333 solid; border-bottom: 4px #333 solid;}
  .page-news-list .news-list .news-box { width: 100%; padding: 1.5vw 0; border-bottom: 1px #333 solid; display: flex; justify-content: flex-start; align-items: flex-start;}
  .page-news-list .news-list .news-box:last-child { border-bottom: 0;}
  .page-news-list .news-list .news-box .date { width: 16vw; line-height: 3.6vw;}
  .page-news-list .news-list .news-box .date span.year { color: #17307D; font-size: 3.6vw;}
  .page-news-list .news-list .news-box .date span.day { color: #42210B; font-size: 5.4vw; font-weight: 500;}
  .page-news-list .news-list .news-box .title { width: calc(100% - 16vw); padding: 3vw 0 0 0; font-size: 5.6vw; font-weight: 500; line-height: 5.8vw;}
  .page-news-list .news-list .news-box .title a { color: #F38F1E; text-decoration: none;}
  .page-news-list .news-list .news-box .title a:hover { color: #42210B;}

  ul#page-num { clear: both; width: 100%; padding: 0; margin: 4vw 0 0 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-num li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#page-num li a { padding: 1vw 1.4vw; color: #fff; font-size: 5vw; border-radius: 1.2vw; background-color: #F38F1E; text-decoration: none; display: block;}
  ul#page-num li a:hover { background-color: #C2986D;}
  ul#page-num li a.sel { background-color: #42210B;}

  .page-news-content { clear: both; width: 90vw; margin: 6vw auto 0 auto;}
  .page-news-content .title { width: 100%; padding: 2.6vw 0; color: #F38F1E; font-size: 4.6vw; font-weight: 500; line-height: 5.2vw; border-bottom: 1px #F38F1E solid;}
  .page-news-content .date { width: 100%; padding: 2vw 0; color: #17307D; font-size: 3.8vw; text-align: right;}
  .page-news-content .text-content { width: 100%; margin: 6vw 0; font-size: 3.2vw; line-height: 5vw;}
  .page-news-content .text-content img { max-width: 100%; height: auto;}

  .go-back-bt { clear: both; width: 28vw; margin: 0 auto;}
  .go-back-bt a { width: 100%; padding: 0.6vw 0; color: #fff; font-size: 3.8vw; text-align: center; text-decoration: none; border-radius: 3.8vw; background-color: #F38F1E; display: block;}
  .go-back-bt a:hover { background-color: #C2986D;}


  /************ section#case ************/

  img.case-sec1-text { width: 46vw; height: auto; position: absolute; top: 6vw; left: 180px;}

  section#case-content { clear: both; width: 100%; padding: 20vw 0 10vw 0; margin: -18vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  .case-list-full { clear: both; width: 90vw; margin: 5vw auto 0 auto;}
  .case-list-full .column { margin: 0 0 3vw 0;}
  .case-list-full .column.grid-item { width: 100%;}
  .case-list-full .column .title { width: 100%; padding: 1.5vw 0; font-size: 5vw; font-weight: 500; text-align: center;}
  .case-list-full .column .title.top-style-1 { color: #42210B; background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .title.top-style-2 { color: #fff; background-color: #42210B;}
  .case-list-full .column .title.top-style-3 { color: #fff; background-color: #F38F1E;}
  .case-list-full .column .list { width: 100%; padding: 3vw; font-size: 4vw; line-height: 5vw; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .case-list-full .column .list.bg-style-1 { background-color: #eee;}
  .case-list-full .column .list.bg-style-2 { background:linear-gradient(to right, #d28d14 0%, #f9ec96 75%, #d28d14 100%);}
  .case-list-full .column .list.bg-style-3 { background-color: #F38F1E;}
  .case-list-full .column .list .icon { width: 5vw; margin: 0 0 3vw 0;}
  .case-list-full .column .list .text { width: calc(100% - 5vw); margin: 0 0 3vw 0;}
  .case-list-full .column .list .text a { color: #000; text-decoration: none;}
  .case-list-full .column .list .text a:hover { border-bottom: 1px #000 dashed;}

  .case-title-bar { clear: both; width: 90vw; padding: 1.5vw 0; margin: 5vw auto 0 auto; border-bottom: 1px #42210B solid; text-align: center;}
  .case-title-bar span.big { color: #42210B; font-size: 5vw; font-weight: 500;}
  .case-title-bar span.small { color: #F38F1E; font-size: 4vw;}

  .case-photos-list { clear: both; width: 90vw; margin: 5vw auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .case-photos-list a { width: calc(100% / 2 - 2vw); height: 24vw; margin: 0 1vw 2vw 1vw; text-decoration: none; overflow: hidden; display: flex; align-items: center;}
  .case-photos-list a img { width: 100%; height: auto;}

  ul#page-cases-class-tab { clear: both; width: 90vw; padding: 0; margin: 6vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-cases-class-tab li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#page-cases-class-tab li a { padding: 1vw 2.5vw; color: #42210B; font-size: 4vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-cases-class-tab li a:hover { background-color: #C2986D;}
  ul#page-cases-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-cases-list { clear: both; width: 90vw; margin: 0 auto;}
  .page-cases-list .case-list-x4 { width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .page-cases-list .case-list-x4 .case-list-box { width: calc(100% / 2); padding: 0 2vw; margin: 0 0 4vw 0; box-sizing: border-box;}
  .page-cases-list .case-list-x4 .case-list-box a { width: 100%; text-decoration: none; display: block;}
  .page-cases-list .case-list-x4 .case-list-box a .pic { width: 100%; height: 24vw; border: 5px #fff solid; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.4); box-sizing: border-box; display: flex; align-items: center; overflow: hidden;}
  .page-cases-list .case-list-x4 .case-list-box a .pic img { width: 100%; height: auto;}
  .page-cases-list .case-list-x4 .case-list-box a .title { width: 100%; padding: 2vw 0 0 0; color: #42210B; font-size: 3vw; font-weight: 500; line-height: 3.4vw; text-align: center;}


  /************ section#products ************/

  img.products-sec1-text { width: 46vw; height: auto; position: absolute; top: 8vw; left: 170px;}

  section#products-content { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  ul#page-prod-class-tab { clear: both; width: 80vw; padding: 0; margin: 6vw auto; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul#page-prod-class-tab li { padding: 0; margin: 0 1vw 2vw 1vw;}
  ul#page-prod-class-tab li a { padding: 1vw 2.5vw; color: #42210B; font-size: 4vw; font-weight: 600; border: 1px #42210B solid; background-color: #fff; text-decoration: none; display: block;}
  ul#page-prod-class-tab li a:hover { background-color: #C2986D;}
  ul#page-prod-class-tab li a.sel { color: #fff; background-color: #42210B;}

  .page-prod-list { clear: both; width: 100%;}

  .page-prod-title { clear: both; width: 90vw; padding: 2vw 0; margin: 6vw auto; color: #42210B; font-size: 5.6vw; font-weight: 600; text-align: center; border-bottom: 2px #42210B solid;}

  .page-prod-photos-list { clear: both; width: 80vw; margin: 0 auto 8vw auto;}
  .page-prod-photos-list img { width: 80vw; height: auto; box-sizing: border-box;}

  .page-prod-content { clear: both; width: 90vw; margin: 0 auto 6vw auto; font-size: 3.8vw; line-height: 6vw;}
  .page-prod-content span.title { padding: 0 3vw; color: #fff; font-size: 4.2vw; line-height: 9vw; font-weight: 500; border-radius: 0 3vw; background-color: #F38F1E;}
  .page-prod-content ul.dot { padding: 0 0 0 3.8vw; margin: 0; list-style-type: disc; display: block;}
  .page-prod-content ul.dot li { padding: 0; margin: 0;}
  .page-prod-content .prod-intro-video { width: 100%;}
  
  .page-prod-certifi { clear: both; width: 90vw; margin: 8vw auto; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  .page-prod-certifi img { width: auto; height: 12vw; margin: 0 2vw 4vw 2vw;}


  /************ section#dealer ************/

  section#dealer { clear: both; width: 100%; padding: 14vw 4VW 8vw 4VW; margin: -14vw 0 0 0; box-sizing: border-box; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 200% auto; position: relative; z-index: 8;}

  .page-dealer-title { width: 100%; margin: 0 0 8vw 0; text-align: center;}
  .page-dealer-title .en-title { width: 100%; color: #F38F1E; font-size: 11.4vw; line-height: 1em; font-family: 'Big Shoulders Display', cursive;}
  .page-dealer-title .en-desc-1 { width: 100%; color: #C2986D; font-size: 2.8vw; font-family: 'Big Shoulders Display', cursive; font-weight: bolder; letter-spacing: 0.1vw;}
  .page-dealer-title .en-desc-2 { width: 100%; color: #808080; font-size: 2.4vw; font-weight: 300;}
  .page-dealer-title .cn-desc { width: 100%; color: #17307D; font-size: 5.4vw; line-height: 6.2vw; font-weight: 700;}

  .page-dealer-content { width: 100%;}
  .page-dealer-content img.dealer-map { max-width: 100%; height: auto;}

  .page-dealer-hire { width: 100%; margin: 0 0 8vw 0; color: #ff0000; font-size: 6vw; line-height: 6.6vw; font-weight: 700; text-align: center;}


  /************ section#contact ************/

  section#contact { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: center top; background-size: 140% auto; position: relative; z-index: 8;}

  .contact-content { clear: both; width: 100%; padding: 0 4vw; margin: 8vw 0 0 0; box-sizing: border-box;}
  .contact-content .column-rt { width: 100%;}
  .contact-content .column-rt form { width: 100%;}
  .contact-content .column-rt form .caption { width: 100%; margin: 0 0 2vw 0; color: #42210B; font-size: 4vw;}
  .contact-content .column-rt form .column { width: 100%; margin: 0 0 4vw 0; color: #F38F1E; font-size: 4vw;}
  .contact-content .column-rt form .column input[type=text] { width: 100%; padding: 1vw 2vw; color: #F38F1E; font-size: 4vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column textarea { width: 100%; height: 20vw; padding: 0.5vw 1vw; color: #F38F1E; font-size: 4vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 1px #F38F1E solid; box-sizing: border-box;}
  .contact-content .column-rt form .column img.con-code { width: 20vw; height: auto; margin: 0 0 0.5vw 0;}
  .contact-content .column-rt form .column input[type=submit] { padding: 1vw 4vw; color: #fff; font-size: 4vw; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; border: 0; background-color: #F38F1E; box-sizing: border-box; cursor: pointer;}
  .contact-content .column-lf { width: 100%; margin: 0 0 6vw 0; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .contact-content .column-lf .sub-title { width: 20vw; margin: 0 0 0.5vw 0; color: #42210B; font-size: 4vw; text-align: right;}
  .contact-content .column-lf .infor { width: calc(100% - 20vw); margin: 0 0 0.5vw 0; color: #F38F1E; font-size: 4vw;}
  .contact-content .column-lf img.qrcode { width: 80%; height: auto; margin: 6vw auto 1vw auto;}
  .contact-content .column-lf .line-id { width: 100%; color: #F38F1E; font-size: 4vw; text-align: center;}


  /************ sitemap ************/

  section#sitemap { clear: both; width: 100%; padding: 10vw 0 6vw 0; margin: -10vw 0 0 0; background-image: url("../images/about_sec3_bg.png"); background-repeat: repeat-y; background-position: left top; background-size: 100% auto; position: relative; z-index: 8;}

  ul#sitemap-nav { clear: both; width: 90vw; padding: 0; margin: 6vw auto 0 auto; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  ul#sitemap-nav li { padding: 0; margin: 0 2vw 4vw 2vw;}
  ul#sitemap-nav li a { padding: 1.5vw; color: #42210B; font-size: 5vw; font-weight: 500; text-decoration: none; display: block;}
  ul#sitemap-nav li a:hover { border-bottom: 2px #42210B solid;}
  ul#sitemap-nav li ul.nav-2nd { padding: 0; margin: 0; list-style: none; display: block;}
  ul#sitemap-nav li ul.nav-2nd li { padding: 0; margin: 0; text-align: center;}
  ul#sitemap-nav li ul.nav-2nd li a { padding: 0 0 1vw 0; color: #F38F1E; font-size: 5.4vw; font-weight: 400;}
  ul#sitemap-nav li ul.nav-2nd li a:hover { border-bottom: 2px #F38F1E solid;}


  /************ footer ************/

  footer { clear: both; width: 100%;}

  .footer-logo-add { width: 100%; position: relative; z-index: 8;}
  .footer-logo-add img.footer-bg { width: 300%; height: auto; margin: 0 0 0 -100%;}
  .footer-logo-add .logo-slogan { width: 100%; position: absolute; top: 5vw; left: 0; display: flex; justify-content: center; align-items: flex-start;}
  .footer-logo-add .logo-slogan img.logo { width: 20vw; height: auto; margin: 0 3vw 0 0;}
  .footer-logo-add .logo-slogan img.slogan { width: 42vw; height: auto;}
  .footer-logo-add .add-contact { width: 100%; position: absolute; top: 30vw; left: 0; display: flex; justify-content: center; align-items: flex-start;}
  .footer-logo-add .add-contact .column { width: 38vw; margin: 0 0 0 2vw; color: #42210B; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;} 
  .footer-logo-add .add-contact .column .icon { width: 4vw; margin: 0 0 1vw 0;}
  .footer-logo-add .add-contact .column .icon img { width: 3.2vw; height: auto;}
  .footer-logo-add .add-contact .column .city { width: calc(100% - 5vw); margin: 0 0 1vw 0; font-size: 3.4vw; font-weight: 500;}
  .footer-logo-add .add-contact .column .text { width: calc(100% - 5vw); margin: 0 0 1vw 0; font-size: 2.4vw;}

  .footer-brands { width: 100%; padding: 20px 0 0 0; background-color: #fff; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  .footer-brands img { width: auto; height: 50px; margin: 0 10px 20px 10px;}

  .footer-nav { width: 100%; padding: 20px 0 10px 0; background-color: #1D3757;}
  .footer-nav ul.footer-nav-1c { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .footer-nav ul.footer-nav-1c li { padding: 0; margin: 0 10px 10px 10px;}
  .footer-nav ul.footer-nav-1c li a { color: #fff; font-size: 1em; font-weight: 400; text-decoration: none;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c { padding: 0; margin: 0; list-style: none; display: block;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li { padding: 0; margin: 0; text-align: center;}
  .footer-nav ul.footer-nav-1c li ul.footer-nav-2c li a { color: #ccc; font-size: 0.8em; font-weight: 300; letter-spacing: 0;}

  .footer-copyright { width: 100%; padding: 10px; font-size: 0.6em; line-height: 1.2em; text-align: center; background-color: #fff; box-sizing: border-box;}
  

}