@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: #78c8ff; position: relative;}
img { border:0; display: block;}

html, body { height: 100%;}

.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%;}

/************ number of pages ************/
ul.page-num { clear: both; width: 100%; padding: 0; margin: 40px 0 0 0; list-style: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
ul.page-num li { padding: 0; margin: 0 2px 5px 2px;}
ul.page-num li a { padding: 8px 12px; color: #666; font-size: 0.8rem; line-height: 1rem; background-color: #eee; text-decoration: none; display: block;}
ul.page-num li a:hover { color: #fff; background-color: #999;}
ul.page-num li a.sel { color: #fff; background-color: #444;}


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

  /************ header ************/

  header#mo { display: none;}

  header#pc { clear: both; width: 100%; height: 198px; display: flex; justify-content: center;}
  
  .header-left { width: calc(50% - 600px); height: 198px; background-image: url("../images/header_bg_left.jpg"); background-repeat: repeat-x; display: block;}
  .header-right { width: calc(50% - 600px); height: 198px; background-image: url("../images/header_bg_right.jpg"); background-repeat: repeat-x; display: block;}
  .header-middle { width: 1200px;}
  .header-middle img.title-pc { }
  .header-middle img.title-pad { display: none;}
  .header-middle img.title-mo { display: none;}

  nav#mo { display: none;}

  nav#pc { clear: both; width: 100%; height: 60px; background-image: url("../images/nav_bg.jpg"); background-repeat: no-repeat;}
  nav#pc ul.nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: center;}
  nav#pc ul.nav li { padding: 0; margin: 10px 18px 0 18px;}
  nav#pc ul.nav li a.nav-1 { width: 146px; height: 41px; background-image: url("../images/nav_1.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-1:hover { background-image: url("../images/nav_1_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-2 { width: 165px; height: 41px; background-image: url("../images/nav_2.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-2:hover { background-image: url("../images/nav_2_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-3 { width: 110px; height: 41px; background-image: url("../images/nav_3.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-3:hover { background-image: url("../images/nav_3_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-4 { width: 110px; height: 41px; background-image: url("../images/nav_4.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-4:hover { background-image: url("../images/nav_4_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-5 { width: 146px; height: 41px; background-image: url("../images/nav_5.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-5:hover { background-image: url("../images/nav_5_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-6 { width: 110px; height: 41px; background-image: url("../images/nav_6.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-6:hover { background-image: url("../images/nav_6_over.png"); background-repeat: no-repeat;}

  .aside-nav-mo { display: none;}

  .aside-nav { width: 50px; position: fixed; top: 200px; right: 10px; z-index: 9999;}
  .aside-nav .icon-bt { width: 50px; height: 50px; margin: 0 0 10px 0; overflow: hidden;}
  .aside-nav .icon-bt a { width: 100%; height: 100%; color: #fff; font-size: 2em; text-decoration: none; border-radius: 10px; background-color: #ccab53; display: flex; justify-content: center; align-items: center;}


  /************ section #content ************/

  section#content { clear: both; width: 100%; min-height: 42vw; background-image: url("../images/section_cloud_bg.jpg"); background-repeat: no-repeat; background-position: center top;}


  /************ #sec-service ************/

  #sec-service-mo { display: none;}

  #sec-service { clear: both; width: 1200px; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start;}
  
  #sec-service .serv-column-lf { width: 335px; height: 301px; background-image: url("../images/hp_service_bg_left.png"); background-repeat: no-repeat;}
  #sec-service .serv-column-lf .title { width: 230px; height: 40px; padding: 5px 0 0 0; margin: 10px 0 0 10px; color: #fff; font-size: 1.4em; font-weight: 600; text-align: center; letter-spacing: 0.1em; box-sizing: border-box;}
  #sec-service .serv-column-lf ul.service-items { padding: 8px 0 0 60px; margin: 0; list-style: none; display: block;}
  #sec-service .serv-column-lf ul.service-items li { padding: 0; margin: 0; font-size: 1.2em; font-weight: 600; line-height: 1.7em;}
  #sec-service .serv-column-lf ul.service-items li font.icon { color: #ccab53;}
 
  #sec-service .serv-column-md { width: calc(100% - 366px); height: 301px; background-image: url("../images/hp_service_bg_md.png"); background-repeat: repeat-x;}
  #sec-service .serv-column-md .photos-slick { width: 100%; margin: 65px auto 0 auto; overflow: hidden;}
  #sec-service .serv-column-md .photos-slick .img { width: calc(100% / 3 - 20px); height: auto; padding: 0 10px; box-sizing: border-box;}
  #sec-service .serv-column-md .photos-slick .img img { width: 100%; height: auto;}
  
  .slider {
    width: 90%;
    margin: 0 auto;
  }

  .slick-slide {
    margin: 0px;
  }

  .slick-slide img {
    width: 100%;
  }

  .slick-prev:before,
  .slick-next:before {
    color: black;
  }

  .slick-slide {
    transition: all ease-in-out .3s;
    opacity: 1;
  }

  .slick-active {
    opacity: 1;
  }

  .slick-current {
    opacity: 1;
  }
  
  #sec-service .serv-column-rt { width: 31px; height: 301px; background-image: url("../images/hp_service_bg_right.png"); background-repeat: no-repeat;}


  /************ #sec-knowhow ************/

  #sec-knowhow { clear: both; width: 1200px; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  .media-record-bt-mo { display: none;}

  #sec-knowhow .lf-top, #sec-knowhow .rt-top { width: 43px; height: 99px;}
  #sec-knowhow .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_knowhow_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start; position: relative;}
  #sec-knowhow .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-knowhow .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-knowhow .top .media-record-bt { width: 260px; height: 44px; position: absolute; top: 14px; right: 0;}
  #sec-knowhow .top .media-record-bt a { width: 100%; height: 100%; padding: 5px 0 0 0; color: #414141; font-size: 1.4em; font-weight: 600; letter-spacing: 0.1em; text-align: center; text-decoration: none; border-radius: 30px; background-color: #fff000; display: block; box-sizing: border-box;}
  #sec-knowhow .top .media-record-bt a:hover { color: #fff; background-color: #97b61f;}
  #sec-knowhow .lf-md { width: 43px; background-image: url("../images/sec_knowhow_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .rt-md { width: 43px; background-image: url("../images/sec_knowhow_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-knowhow .middle .knowhow-list { width: calc(100% / 4 - 40px); margin: 20px;}
  #sec-knowhow .middle .knowhow-list a { color: #414141; font-size: 1.1em; text-decoration: none;}
  #sec-knowhow .middle .knowhow-list a span.icon { padding: 0 10px 0 0; color: #508512;}
  #sec-knowhow .middle .knowhow-list a:hover { border-bottom: 1px #414141 solid;}
  #sec-knowhow .lf-bt, #sec-knowhow .rt-bt { width: 43px; height: 45px;}
  #sec-knowhow .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_knowhow_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-about ************/

  #sec-about { clear: both; width: 1200px; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-about .lf-top, #sec-about .rt-top { width: 43px; height: 99px;}
  #sec-about .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_about_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-about .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-about .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-about .lf-md { width: 43px; background-image: url("../images/sec_about_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .rt-md { width: 43px; background-image: url("../images/sec_about_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-about .middle .content { width: 100%; padding: 20px; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box;}
  #sec-about .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_about_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-process ************/

  #sec-process { clear: both; width: 1200px; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-process .lf-top, #sec-process .rt-top { width: 43px; height: 99px;}
  #sec-process .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_process_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-process .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-process .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-process .lf-md { width: 43px; background-image: url("../images/sec_process_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .rt-md { width: 43px; background-image: url("../images/sec_process_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-process .middle .content { width: 100%; padding: 20px; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box; display: flex; justify-content: center;}
  #sec-process .middle .content .icon-text { width: 140px;}
  #sec-process .middle .content .icon-text .icon { width: 140px; height: 140px; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  #sec-process .middle .content .icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 0.8em; line-height: 1.2em; text-align: center;}
  #sec-process .middle .content .arrow { width: 100%; padding: 40px 0 0 0; color: #bc5555; font-size: 2.6em; text-align: center;}
  #sec-process .middle .content .arrow-mo { display: none;}
  #sec-process .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_process_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ page_1 ************/

  ul.page1-reason-list { width: 100%; padding: 0 0 0 24px; margin: 0; list-style-type: decimal; box-sizing: border-box; display: block;}
  ul.page1-reason-list li { padding: 0; margin: 0 0 30px 0; font-size: 1.2em; line-height: 2em;}
  ul.page1-reason-list li:last-child { margin: 0;}


  /************ page_2 ************/

  img.page2-pic { width: 100%; height: auto;}
  img.page2-pic-mo { display: none;}


  /************ page_3 ************/

  .page3-content { width: 100%; padding: 40px 0;}

  .page3-icon-text { width: 200px; margin: 0 auto;}
  .page3-icon-text .icon { width: 160px; height: 160px; margin: 0 auto; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  .page3-icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 1.2em; font-weight: 600; line-height: 1.4em; text-align: center;}
  .page3-arrow { width: 100%; margin: 20px 0; color: #bc5555; font-size: 2.6em; text-align: center;}


  /************ page_4 ************/

  .page4-case-table { clear: both; width: 100%; padding: 20px 0; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-1 { width: 100%; margin: 0 0 10px 0; color: #508512; font-size: 1.4em; font-weight: 600; box-sizing: border-box;}
  .page4-case-table .column-2 { width: calc(100% - 200px); padding: 0 20px 0 0; font-size: 1.1em; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-2 .title { width: 110px; font-weight: 600;}
  .page4-case-table .column-2 .infor { width: calc(100% - 110px);}
  .page4-case-table .column-3 { width: 200px; display: flex; justify-content: center; align-items: center;}
  .page4-case-table .column-3 img { width: 100%; height: auto;}

  
  /************ page_5 ************/

  .article-list-full { clear: both; width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .article-list-full .article-list { width: calc(100% / 4 - 20px); padding: 10px; margin: 0 10px 20px 10px; border: 1px #ccc solid; box-sizing: border-box;}
  .article-list-full .article-list a { color: #414141; text-decoration: none;}
  .article-list-full .article-list .pic { width: 100%; height: 100px; margin: 0 0 10px 0; overflow: hidden;}
  .article-list-full .article-list .pic img { width: 100%; height: auto;}
  .article-list-full .article-list .intro { width: 100%; font-size: 0.9em; line-height: 1.4em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}

  .article-content { clear: both; width: 100%;}
  .article-content .title { width: 100%; padding: 0 0 10px 0; font-size: 1.5em; font-weight: 600; border-bottom: 1px #ccc solid;}
  .article-content .date { width: 100%; padding: 10px 0 30px 0; color: #666; font-size: 0.9em; text-align: right;}
  .article-content .content { width: 100%; margin: 0 0 60px 0; font-size: 1.2em; line-height: 1.8em;}
  .article-content .content img { max-width: 100%; height: auto;}
  .article-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .article-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .article-content .goback-bt a:hover { background-color: #447011;}


  /************ page_6 ************/

  .page6-content { clear: both; width: 100%;}
  .page6-content .pic { width: 100%;}
  .page6-content .pic img { width: 100%; height: auto;}
  .page6-content .infor { width: 100%; margin: 40px 0 0 0; font-size: 1.4em; font-weight: 600; line-height: 2em; display: flex; justify-content: center;}


  /************ knowledge content ************/

  .knowledge-content { clear: both; width: 100%;}
  .knowledge-content .title { width: 100%; padding: 10px 0; color: #508512; font-size: 1.2em; font-weight: 600; border-bottom: 1px #ccc solid; box-sizing: border-box;}
  .knowledge-content .content { width: 100%; margin: 40px 0; font-size: 1.1em; line-height: 2em;}
  .knowledge-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .knowledge-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .knowledge-content .goback-bt a:hover { background-color: #447011;}


  /************ site map ************/

  ul.sitemap { clear: both; width: 100%; padding: 80px 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.sitemap li { padding: 0; margin: 0 20px;}
  ul.sitemap li a { color: #414141; font-size: 1.1em; font-weight: 600; text-decoration: none;}
  ul.sitemap li a:hover { border-bottom: 1px #414141 solid;}


  /************ sec-error ************/

  #sec-error { clear: both; width: 100%; padding: 100px 0;}

  .error-title { width: 100%; font-size: 3.4em; font-weight: bold; line-height: 3em; text-align: center;}

  .error-text { width: 100%; font-size: 2.4em; font-weight: 600; line-height: 2em; text-align: center;}

  .error-goback { width: 140px; margin: 80px auto 0 auto;}
  .error-goback a { width: 100%; padding: 5px 0; color: #fff; font-size: 1.1em; text-align: center; text-decoration: none; border-radius: 8px; background-color: #508512; display: block;}


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

  footer { clear: both; width: 100%; padding: 70px calc(50% - 600px) 40px calc(50% - 600px); background-color: #97b61f; background-image: url("../images/footer_bg_top.jpg"); background-repeat: repeat-x; background-position: left top; box-sizing: border-box;}

  ul.footer-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center;}
  ul.footer-nav li { padding: 0; margin: 0 20px;}
  ul.footer-nav li a { color: #fff; font-size: 1.2em; text-decoration: none;}
  ul.footer-nav li a:hover { border-bottom: 1px #fff solid;}

  hr.footer-line { clear: both; width: 100%; margin: 40px auto; border: 1px rgba(255,255,255,0.4) solid;}

  .footer-infor { clear: both; width: 90%; margin: 0 auto; display: flex; justify-content: flex-start;}
  .footer-infor .column-1 { width: 50%; color: #fff; line-height: 1.8em;}
  .footer-infor .column-1 span.title { font-size: 1.2em; font-weight: 600;}
  .footer-infor .column-2 { width: 50%; display: flex; justify-content: flex-end; align-items: flex-start;}
  .footer-infor .column-2 a.icon { color: #fff; font-size: 2.4em; text-decoration: none;}
  .footer-infor .column-2 img.qrcode { width: 100px; height: auto; margin: 0 30px 0 0;}
  

}

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

  /************ header ************/

  header#mo { display: none;}

  header#pc { clear: both; width: 100%; height: 198px; display: flex; justify-content: center; overflow: hidden;}
  
  .header-left { width: 40px; height: 198px; background-image: url("../images/header_bg_left.jpg"); background-repeat: repeat-x; display: block;}
  .header-right { width: calc(50% - 600px); height: 198px; background-image: url("../images/header_bg_right.jpg"); background-repeat: repeat-x; display: block;}
  .header-middle { width: 1200px;}
  .header-middle img.title-pc { }
  .header-middle img.title-pad { display: none;}
  .header-middle img.title-mo { display: none;}

  nav#mo { display: none;}

  nav#pc { clear: both; width: 100%; height: 60px; background-image: url("../images/nav_bg.jpg"); background-repeat: no-repeat;}
  nav#pc ul.nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: center;}
  nav#pc ul.nav li { padding: 0; margin: 10px 10px 0 10px;}
  nav#pc ul.nav li a.nav-1 { width: 146px; height: 41px; background-image: url("../images/nav_1.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-1:hover { background-image: url("../images/nav_1_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-2 { width: 165px; height: 41px; background-image: url("../images/nav_2.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-2:hover { background-image: url("../images/nav_2_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-3 { width: 110px; height: 41px; background-image: url("../images/nav_3.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-3:hover { background-image: url("../images/nav_3_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-4 { width: 110px; height: 41px; background-image: url("../images/nav_4.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-4:hover { background-image: url("../images/nav_4_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-5 { width: 146px; height: 41px; background-image: url("../images/nav_5.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-5:hover { background-image: url("../images/nav_5_over.png"); background-repeat: no-repeat;}
  nav#pc ul.nav li a.nav-6 { width: 110px; height: 41px; background-image: url("../images/nav_6.png"); background-repeat: no-repeat; display: block;}
  nav#pc ul.nav li a.nav-6:hover { background-image: url("../images/nav_6_over.png"); background-repeat: no-repeat;}

  .aside-nav-mo { display: none;}

  .aside-nav { width: 50px; position: fixed; top: 200px; right: 10px; z-index: 9999;}
  .aside-nav .icon-bt { width: 50px; height: 50px; margin: 0 0 10px 0; overflow: hidden;}
  .aside-nav .icon-bt a { width: 100%; height: 100%; color: #fff; font-size: 2em; text-decoration: none; border-radius: 10px; background-color: #ccab53; display: flex; justify-content: center; align-items: center;}


  /************ section #content ************/

  section#content { clear: both; width: 100%; padding: 0 40px; background-image: url("../images/section_cloud_bg.jpg"); background-repeat: no-repeat; background-position: center top; box-sizing: border-box;}


  /************ #sec-service ************/

  #sec-service-mo { display: none;}

  #sec-service { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start;}
  
  #sec-service .serv-column-lf { width: 335px; height: 301px; background-image: url("../images/hp_service_bg_left.png"); background-repeat: no-repeat;}
  #sec-service .serv-column-lf .title { width: 230px; height: 40px; padding: 5px 0 0 0; margin: 10px 0 0 10px; color: #fff; font-size: 1.4em; font-weight: 600; text-align: center; letter-spacing: 0.1em; box-sizing: border-box;}
  #sec-service .serv-column-lf ul.service-items { padding: 8px 0 0 60px; margin: 0; list-style: none; display: block;}
  #sec-service .serv-column-lf ul.service-items li { padding: 0; margin: 0; font-size: 1.2em; font-weight: 600; line-height: 1.7em;}
  #sec-service .serv-column-lf ul.service-items li font.icon { color: #ccab53;}

  #sec-service .serv-column-md { width: calc(100% - 366px); height: 301px; background-image: url("../images/hp_service_bg_md.png"); background-repeat: repeat-x;}
  #sec-service .serv-column-md .photos-slick { width: 100%; margin: 40px auto 0 auto; overflow: hidden;}
  #sec-service .serv-column-md .photos-slick .img { width: calc(100% / 2 - 40px); height: auto; padding: 0 20px; box-sizing: border-box;}
  #sec-service .serv-column-md .photos-slick .img img { width: 100%; height: auto;}
  
  .slider {
    width: 90%;
    margin: 0 auto;
  }

  .slick-slide {
    margin: 0px;
  }

  .slick-slide img {
    width: 100%;
  }

  .slick-prev:before,
  .slick-next:before {
    color: black;
  }

  .slick-slide {
    transition: all ease-in-out .3s;
    opacity: 1;
  }

  .slick-active {
    opacity: 1;
  }

  .slick-current {
    opacity: 1;
  }

  #sec-service .serv-column-rt { width: 31px; height: 301px; background-image: url("../images/hp_service_bg_right.png"); background-repeat: no-repeat;}


  /************ #sec-knowhow ************/

  #sec-knowhow { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  .media-record-bt-mo { display: none;}

  #sec-knowhow .lf-top, #sec-knowhow .rt-top { width: 43px; height: 99px;}
  #sec-knowhow .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_knowhow_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start; position: relative;}
  #sec-knowhow .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-knowhow .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-knowhow .top .media-record-bt { width: 260px; height: 44px; position: absolute; top: 14px; right: 0;}
  #sec-knowhow .top .media-record-bt a { width: 100%; height: 100%; padding: 5px 0 0 0; color: #414141; font-size: 1.4em; font-weight: 600; letter-spacing: 0.1em; text-align: center; text-decoration: none; border-radius: 30px; background-color: #fff000; display: block; box-sizing: border-box;}
  #sec-knowhow .top .media-record-bt a:hover { color: #fff; background-color: #97b61f;}
  #sec-knowhow .lf-md { width: 43px; background-image: url("../images/sec_knowhow_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .rt-md { width: 43px; background-image: url("../images/sec_knowhow_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-knowhow .middle .knowhow-list { width: calc(100% / 3 - 40px); margin: 20px;}
  #sec-knowhow .middle .knowhow-list a { color: #414141; font-size: 1.1em; text-decoration: none;}
  #sec-knowhow .middle .knowhow-list a span.icon { padding: 0 10px 0 0; color: #508512;}
  #sec-knowhow .middle .knowhow-list a:hover { border-bottom: 1px #414141 solid;}
  #sec-knowhow .lf-bt, #sec-knowhow .rt-bt { width: 43px; height: 45px;}
  #sec-knowhow .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_knowhow_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-about ************/

  #sec-about { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-about .lf-top, #sec-about .rt-top { width: 43px; height: 99px;}
  #sec-about .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_about_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-about .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-about .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-about .lf-md { width: 43px; background-image: url("../images/sec_about_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .rt-md { width: 43px; background-image: url("../images/sec_about_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-about .middle .content { width: 100%; padding: 20px; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box;}
  #sec-about .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_about_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-process ************/

  #sec-process { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-process .lf-top, #sec-process .rt-top { width: 43px; height: 99px;}
  #sec-process .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_process_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-process .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-process .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-process .lf-md { width: 43px; background-image: url("../images/sec_process_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .rt-md { width: 43px; background-image: url("../images/sec_process_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-process .middle .content { width: 100%; padding: 20px; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box; display: flex; justify-content: center; flex-wrap: wrap;}
  #sec-process .middle .content .icon-text { width: 140px; margin: 0 0 30px 0;}
  #sec-process .middle .content .icon-text .icon { width: 140px; height: 140px; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  #sec-process .middle .content .icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 0.8em; line-height: 1.2em; text-align: center;}
  #sec-process .middle .content .arrow { width: 100px; padding: 40px 0 0 0; color: #bc5555; font-size: 2.6em; text-align: center;}
  #sec-process .middle .content .arrow-mo { display: none;}
  #sec-process .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_process_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ page_1 ************/

  ul.page1-reason-list { width: 100%; padding: 0 0 0 24px; margin: 0; list-style-type: decimal; box-sizing: border-box; display: block;}
  ul.page1-reason-list li { padding: 0; margin: 0 0 30px 0; font-size: 1.2em; line-height: 2em;}
  ul.page1-reason-list li:last-child { margin: 0;}


  /************ page_2 ************/

  img.page2-pic { width: 100%; height: auto;}
  img.page2-pic-mo { display: none;}


  /************ page_3 ************/

  .page3-content { width: 100%; padding: 40px 0;}

  .page3-icon-text { width: 200px; margin: 0 auto;}
  .page3-icon-text .icon { width: 160px; height: 160px; margin: 0 auto; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  .page3-icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 1.2em; font-weight: 600; line-height: 1.4em; text-align: center;}
  .page3-arrow { width: 100%; margin: 20px 0; color: #bc5555; font-size: 2.6em; text-align: center;}


  /************ page_4 ************/

  .page4-case-table { clear: both; width: 100%; padding: 20px 0; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-1 { width: 100%; margin: 0 0 10px 0; color: #508512; font-size: 1.4em; font-weight: 600; box-sizing: border-box;}
  .page4-case-table .column-2 { width: calc(100% - 200px); padding: 0 20px 0 0; font-size: 1.1em; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-2 .title { width: 110px; font-weight: 600;}
  .page4-case-table .column-2 .infor { width: calc(100% - 110px);}
  .page4-case-table .column-3 { width: 200px; display: flex; justify-content: center; align-items: center;}
  .page4-case-table .column-3 img { width: 100%; height: auto;}


  /************ page_6 ************/

  .page6-content { clear: both; width: 100%;}
  .page6-content .pic { width: 100%;}
  .page6-content .pic img { width: 100%; height: auto;}
  .page6-content .infor { width: 100%; margin: 40px 0 0 0; font-size: 1.4em; font-weight: 600; line-height: 2em; display: flex; justify-content: center;}


  /************ page_5 ************/

  .article-list-full { clear: both; width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .article-list-full .article-list { width: calc(100% / 4 - 20px); padding: 10px; margin: 0 10px 20px 10px; border: 1px #ccc solid; box-sizing: border-box;}
  .article-list-full .article-list a { color: #414141; text-decoration: none;}
  .article-list-full .article-list .pic { width: 100%; height: 8vw; margin: 0 0 10px 0; overflow: hidden;}
  .article-list-full .article-list .pic img { width: 100%; height: auto;}
  .article-list-full .article-list .intro { width: 100%; font-size: 0.9em; line-height: 1.4em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}

  .article-content { clear: both; width: 100%;}
  .article-content .title { width: 100%; padding: 0 0 10px 0; font-size: 1.5em; font-weight: 600; border-bottom: 1px #ccc solid;}
  .article-content .date { width: 100%; padding: 10px 0 30px 0; color: #666; font-size: 0.9em; text-align: right;}
  .article-content .content { width: 100%; margin: 0 0 60px 0; font-size: 1.2em; line-height: 1.8em;}
  .article-content .content img { max-width: 100%; height: auto;}
  .article-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .article-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .article-content .goback-bt a:hover { background-color: #447011;}


  /************ knowledge content ************/

  .knowledge-content { clear: both; width: 100%;}
  .knowledge-content .title { width: 100%; padding: 10px 0; color: #508512; font-size: 1.2em; font-weight: 600; border-bottom: 1px #ccc solid; box-sizing: border-box;}
  .knowledge-content .content { width: 100%; margin: 40px 0; font-size: 1.1em; line-height: 2em;}
  .knowledge-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .knowledge-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .knowledge-content .goback-bt a:hover { background-color: #447011;}


  /************ site map ************/

  ul.sitemap { clear: both; width: 100%; padding: 80px 0 40px 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.sitemap li { padding: 0; margin: 0 20px 40px 20px;}
  ul.sitemap li a { color: #414141; font-size: 1.1em; font-weight: 600; text-decoration: none;}
  ul.sitemap li a:hover { border-bottom: 1px #414141 solid;}


  /************ sec-error ************/

  #sec-error { clear: both; width: 100%; padding: 100px 0;}

  .error-title { width: 100%; font-size: 3.4em; font-weight: bold; line-height: 3em; text-align: center;}

  .error-text { width: 100%; font-size: 2.4em; font-weight: 600; line-height: 2em; text-align: center;}

  .error-goback { width: 140px; margin: 80px auto 0 auto;}
  .error-goback a { width: 100%; padding: 5px 0; color: #fff; font-size: 1.1em; text-align: center; text-decoration: none; border-radius: 8px; background-color: #508512; display: block;}


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

  footer { clear: both; width: 100%; padding: 70px 40px 40px 40px; background-color: #97b61f; background-image: url("../images/footer_bg_top.jpg"); background-repeat: repeat-x; background-position: left top; box-sizing: border-box;}

  ul.footer-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.footer-nav li { padding: 0; margin: 0 15px 20px 15px;}
  ul.footer-nav li a { color: #fff; font-size: 1.2em; text-decoration: none;}
  ul.footer-nav li a:hover { border-bottom: 1px #fff solid;}

  hr.footer-line { clear: both; width: 90%; margin: 20px auto 40px auto; border: 1px rgba(255,255,255,0.4) solid;}

  .footer-infor { clear: both; width: 90%; margin: 0 auto; display: flex; justify-content: flex-start;}
  .footer-infor .column-1 { width: 50%; color: #fff; line-height: 1.8em;}
  .footer-infor .column-1 span.title { font-size: 1.2em; font-weight: 600;}
  .footer-infor .column-2 { width: 50%; display: flex; justify-content: flex-end; align-items: flex-start;}
  .footer-infor .column-2 a.icon { color: #fff; font-size: 2.4em; text-decoration: none;}
  .footer-infor .column-2 img.qrcode { width: 100px; height: auto; margin: 0 30px 0 0;}
  

}

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

  /************ header ************/

  header#mo { display: none;}
  
  header#pc { clear: both; width: 100%; overflow: hidden;}
  
  .header-left { display: none;}
  .header-right { display: none;}
  .header-middle { width: 100%;}
  .header-middle img.title-pc { display: none;}
  .header-middle img.title-pad { width: 100%; height: auto;}
  .header-middle img.title-mo { display: none;}

  nav#pc { display: none;}

  nav#mo { clear: both; width: 100%; background-color: #20a1db; background-image: url("../images/nav_bg_pad.jpg"); background-size: 100% auto; background-position: center top; background-repeat: no-repeat;}
  nav#mo .nav-icon { width: 50px; margin: 0 auto; color: #fff; font-size: 4vw; text-align: center;}
  nav#mo ul.nav { width: 100%; padding: 40px; margin: 0; list-style: none; background-color: #20a1db; box-sizing: border-box; display: none; z-index: 999;}
  nav#mo ul.nav li { width: 100%; padding: 0; margin: 0; border-bottom: 1px rgba(255,255,255,0.4) solid;}
  nav#mo ul.nav li:last-child { border-bottom: 0;}
  nav#mo ul.nav li a { width: 100%; padding: 15px 0; color: #fff; font-size: 1.4em; font-weight: 600; text-align: center; text-decoration: none; display: block;}

  .aside-nav-mo { display: none;}

  .aside-nav { width: 50px; position: fixed; top: 200px; right: 10px; z-index: 99;}
  .aside-nav .icon-bt { width: 50px; height: 50px; margin: 0 0 10px 0; overflow: hidden;}
  .aside-nav .icon-bt a { width: 100%; height: 100%; color: #fff; font-size: 2em; text-decoration: none; border-radius: 10px; background-color: #ccab53; display: flex; justify-content: center; align-items: center;}


  /************ section #content ************/

  section#content { clear: both; width: 100%; padding: 0 40px; background-image: url("../images/section_cloud_bg.jpg"); background-repeat: no-repeat; background-position: center top; box-sizing: border-box;}


  /************ #sec-service ************/

  #sec-service-mo { display: none;}

  #sec-service { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start;}
  
  #sec-service .serv-column-lf { width: 335px; height: 301px; background-image: url("../images/hp_service_bg_left.png"); background-repeat: no-repeat;}
  #sec-service .serv-column-lf .title { width: 230px; height: 40px; padding: 5px 0 0 0; margin: 10px 0 0 10px; color: #fff; font-size: 1.4em; font-weight: 600; text-align: center; letter-spacing: 0.1em; box-sizing: border-box;}
  #sec-service .serv-column-lf ul.service-items { padding: 8px 0 0 60px; margin: 0; list-style: none; display: block;}
  #sec-service .serv-column-lf ul.service-items li { padding: 0; margin: 0; font-size: 1.2em; font-weight: 600; line-height: 1.7em;}
  #sec-service .serv-column-lf ul.service-items li font.icon { color: #ccab53;}

  #sec-service .serv-column-md { width: calc(100% - 366px); height: 301px; background-image: url("../images/hp_service_bg_md.png"); background-repeat: repeat-x;}
  #sec-service .serv-column-md .photos-slick { width: 100%; max-height: 220px; margin: 40px auto 0 auto; overflow: hidden;}
  #sec-service .serv-column-md .photos-slick .img { width: calc(100% / 1 - 40px); height: auto; padding: 0 20px; box-sizing: border-box;}
  #sec-service .serv-column-md .photos-slick .img img { width: 100%; height: auto;}
  
  .slider {
    width: 80%;
    margin: 0 auto;
  }

  .slick-slide {
    margin: 0px;
  }

  .slick-slide img {
    width: 100%;
  }

  .slick-prev:before,
  .slick-next:before {
    color: black;
  }

  .slick-slide {
    transition: all ease-in-out .3s;
    opacity: 1;
  }

  .slick-active {
    opacity: 1;
  }

  .slick-current {
    opacity: 1;
  }
  
  #sec-service .serv-column-rt { width: 31px; height: 301px; background-image: url("../images/hp_service_bg_right.png"); background-repeat: no-repeat;}


  /************ #sec-knowhow ************/

  #sec-knowhow { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  .media-record-bt-mo { display: none;}

  #sec-knowhow .lf-top, #sec-knowhow .rt-top { width: 43px; height: 99px;}
  #sec-knowhow .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_knowhow_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start; position: relative;}
  #sec-knowhow .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-knowhow .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-knowhow .top .media-record-bt { width: 260px; height: 44px; position: absolute; top: 14px; right: 0;}
  #sec-knowhow .top .media-record-bt a { width: 100%; height: 100%; padding: 5px 0 0 0; color: #414141; font-size: 1.4em; font-weight: 600; letter-spacing: 0.1em; text-align: center; text-decoration: none; border-radius: 30px; background-color: #fff000; display: block; box-sizing: border-box;}
  #sec-knowhow .lf-md { width: 43px; background-image: url("../images/sec_knowhow_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .rt-md { width: 43px; background-image: url("../images/sec_knowhow_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-knowhow .middle .knowhow-list { width: calc(100% / 2 - 40px); margin: 20px;}
  #sec-knowhow .middle .knowhow-list a { color: #414141; font-size: 1.1em; text-decoration: none;}
  #sec-knowhow .middle .knowhow-list a span.icon { padding: 0 10px 0 0; color: #508512;}
  #sec-knowhow .middle .knowhow-list a:hover { border-bottom: 1px #414141 solid;}
  #sec-knowhow .lf-bt, #sec-knowhow .rt-bt { width: 43px; height: 45px;}
  #sec-knowhow .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_knowhow_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-about ************/

  #sec-about { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-about .lf-top, #sec-about .rt-top { width: 43px; height: 99px;}
  #sec-about .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_about_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-about .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-about .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-about .lf-md { width: 43px; background-image: url("../images/sec_about_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .rt-md { width: 43px; background-image: url("../images/sec_about_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-about .middle .content { width: 100%; padding: 20px; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box;}
  #sec-about .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_about_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-process ************/

  #sec-process { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-process .lf-top, #sec-process .rt-top { width: 43px; height: 99px;}
  #sec-process .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_process_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-process .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2.4em;}
  #sec-process .top .title { padding: 18px 0 0 0; color: #fff; font-size: 1.6em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-process .lf-md { width: 43px; background-image: url("../images/sec_process_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .rt-md { width: 43px; background-image: url("../images/sec_process_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-process .middle .content { width: 100%; padding: 20px; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box; display: flex; justify-content: center; flex-wrap: wrap;}
  #sec-process .middle .content .icon-text { width: 140px; margin: 0 0 30px 0;}
  #sec-process .middle .content .icon-text .icon { width: 140px; height: 140px; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  #sec-process .middle .content .icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 0.8em; line-height: 1.2em; text-align: center;}
  #sec-process .middle .content .arrow { width: 100px; padding: 40px 0 0 0; color: #bc5555; font-size: 2.6em; text-align: center;}
  #sec-process .middle .content .arrow-mo { display: none;}
  #sec-process .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_process_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ page_1 ************/

  ul.page1-reason-list { width: 100%; padding: 0 0 0 24px; margin: 0; list-style-type: decimal; box-sizing: border-box; display: block;}
  ul.page1-reason-list li { padding: 0; margin: 0 0 30px 0; font-size: 1.2em; line-height: 2em;}
  ul.page1-reason-list li:last-child { margin: 0;}


  /************ page_2 ************/

  img.page2-pic { width: 100%; height: auto;}
  img.page2-pic-mo { display: none;}


  /************ page_3 ************/

  .page3-content { width: 100%; padding: 40px 0;}

  .page3-icon-text { width: 200px; margin: 0 auto;}
  .page3-icon-text .icon { width: 160px; height: 160px; margin: 0 auto; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  .page3-icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 1.2em; font-weight: 600; line-height: 1.4em; text-align: center;}
  .page3-arrow { width: 100%; margin: 20px 0; color: #bc5555; font-size: 2.6em; text-align: center;}


  /************ page_4 ************/

  .page4-case-table { clear: both; width: 100%; padding: 20px 0; border-bottom: 1px #ccc solid; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-1 { width: 100%; margin: 0 0 10px 0; color: #508512; font-size: 1.4em; font-weight: 600; box-sizing: border-box;}
  .page4-case-table .column-2 { width: calc(100% - 200px); padding: 0 20px 0 0; font-size: 1.1em; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-2 .title { width: 110px; font-weight: 600;}
  .page4-case-table .column-2 .infor { width: calc(100% - 110px);}
  .page4-case-table .column-3 { width: 200px; display: flex; justify-content: center; align-items: center;}
  .page4-case-table .column-3 img { width: 100%; height: auto;}


  /************ page_5 ************/

  .article-list-full { clear: both; width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .article-list-full .article-list { width: calc(100% / 2 - 20px); padding: 10px; margin: 0 10px 20px 10px; border: 1px #ccc solid; box-sizing: border-box;}
  .article-list-full .article-list a { color: #414141; text-decoration: none;}
  .article-list-full .article-list .pic { width: 100%; height: 15vw; margin: 0 0 10px 0; overflow: hidden;}
  .article-list-full .article-list .pic img { width: 100%; height: auto;}
  .article-list-full .article-list .intro { width: 100%; font-size: 0.9em; line-height: 1.4em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}

  .article-content { clear: both; width: 100%;}
  .article-content .title { width: 100%; padding: 0 0 10px 0; font-size: 1.5em; font-weight: 600; border-bottom: 1px #ccc solid;}
  .article-content .date { width: 100%; padding: 10px 0 30px 0; color: #666; font-size: 0.9em; text-align: right;}
  .article-content .content { width: 100%; margin: 0 0 60px 0; font-size: 1.2em; line-height: 1.8em;}
  .article-content .content img { max-width: 100%; height: auto;}
  .article-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .article-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .article-content .goback-bt a:hover { background-color: #447011;}


  /************ page_6 ************/

  .page6-content { clear: both; width: 100%;}
  .page6-content .pic { width: 100%; overflow: hidden;}
  .page6-content .pic img { width: 140%; height: auto; margin: 0 0 0 -20%;}
  .page6-content .infor { width: 100%; margin: 40px 0 0 0; font-size: 1.4em; font-weight: 600; line-height: 2em; display: flex; justify-content: center;}


  /************ knowledge content ************/

  .knowledge-content { clear: both; width: 100%;}
  .knowledge-content .title { width: 100%; padding: 10px 0; color: #508512; font-size: 1.2em; font-weight: 600; border-bottom: 1px #ccc solid; box-sizing: border-box;}
  .knowledge-content .content { width: 100%; margin: 40px 0; font-size: 1.1em; line-height: 2em;}
  .knowledge-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .knowledge-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .knowledge-content .goback-bt a:hover { background-color: #447011;}


  /************ site map ************/

  ul.sitemap { clear: both; width: 100%; padding: 80px 0 40px 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.sitemap li { padding: 0; margin: 0 20px 40px 20px;}
  ul.sitemap li a { color: #414141; font-size: 1.1em; font-weight: 600; text-decoration: none;}
  ul.sitemap li a:hover { border-bottom: 1px #414141 solid;}


  /************ sec-error ************/

  #sec-error { clear: both; width: 100%; padding: 100px 0;}

  .error-title { width: 100%; font-size: 3.4em; font-weight: bold; line-height: 3em; text-align: center;}

  .error-text { width: 100%; font-size: 2.4em; font-weight: 600; line-height: 2em; text-align: center;}

  .error-goback { width: 140px; margin: 80px auto 0 auto;}
  .error-goback a { width: 100%; padding: 5px 0; color: #fff; font-size: 1.1em; text-align: center; text-decoration: none; border-radius: 8px; background-color: #508512; display: block;}


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

  footer { clear: both; width: 100%; padding: 70px 40px 40px 40px; background-color: #97b61f; background-image: url("../images/footer_bg_top.jpg"); background-repeat: repeat-x; background-position: left top; box-sizing: border-box;}

  ul.footer-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.footer-nav li { padding: 0; margin: 0 15px 20px 15px;}
  ul.footer-nav li a { color: #fff; font-size: 1.2em; text-decoration: none;}
  ul.footer-nav li a:hover { border-bottom: 1px #fff solid;}

  hr.footer-line { clear: both; width: 90%; margin: 20px auto 40px auto; border: 1px rgba(255,255,255,0.4) solid;}

  .footer-infor { clear: both; width: 90%; margin: 0 auto;}
  .footer-infor .column-1 { width: 100%; margin: 0 0 30px 0; color: #fff; line-height: 1.8em; text-align: center;}
  .footer-infor .column-1 span.title { font-size: 1.2em; font-weight: 600;}
  .footer-infor .column-2 { width: 100%;}
  .footer-infor .column-2 a.icon { color: #fff; font-size: 2.4em; text-decoration: none;}
  .footer-infor .column-2 iframe { margin: 0 0 0 calc(50% - 160px);}
  .footer-infor .column-2 img.qrcode { width: 100px; height: auto; margin: 0 auto 30px auto;}


}

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

  /************ header ************/

  header#pc { display: none;}

  header#mo { clear: both; width: 100%; overflow: hidden;}

  .header-title-mo { width: 100%; overflow: hidden;}

  .header-text-mo { clear: both; width: 100%; background-image: url("../images/header_text_bg_mo.jpg"); background-repeat: no-repeat;}
  .header-text-mo img { max-width: 100%; height: auto; margin: 0 auto;}
    
  nav#mo { clear: both; width: 100%; background-color: #20a1db; background-image: url("../images/nav_bg_pad.jpg"); background-position: center top; background-repeat: no-repeat;}
  nav#mo .nav-icon { width: 50px; margin: 0 auto; color: #fff; font-size: 2.4em; text-align: center;}
  nav#mo ul.nav { width: 100%; padding: 40px; margin: 0; list-style: none; background-color: #20a1db; box-sizing: border-box; display: none;}
  nav#mo ul.nav li { width: 100%; padding: 0; margin: 0; border-bottom: 1px rgba(255,255,255,0.4) solid;}
  nav#mo ul.nav li:last-child { border-bottom: 0;}
  nav#mo ul.nav li a { width: 100%; padding: 15px 0; color: #fff; font-size: 1.4em; font-weight: 600; text-align: center; text-decoration: none; display: block;}

  .aside-nav { display: none;}

  .aside-nav-mo { width: 100%; padding: 10px 0; display: flex; justify-content: center; align-items: center; position: fixed; bottom: 0; left: 0; z-index: 999;}
  .aside-nav-mo .icon-bt { width: 50px; height: 50px; margin: 0 10px; overflow: hidden;}
  .aside-nav-mo .icon-bt a { width: 100%; height: 100%; color: #fff; font-size: 2em; text-decoration: none; border-radius: 100%; background-color: #ccab53; display: flex; justify-content: center; align-items: center;}


  /************ section #content ************/

  section#content { clear: both; width: 100%; padding: 0 10px; background-image: url("../images/section_cloud_bg.jpg"); background-repeat: no-repeat; background-position: center top; box-sizing: border-box;}


  /************ #sec-service ************/

  #sec-service { display: none;}
  
  #sec-service-mo { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start;}
  
  .serv-column-mo { width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .serv-column-mo .items-lf-top, .serv-column-mo .items-rt-top { width: 33px; height: 53px;}
  .serv-column-mo .items-top { width: calc(100% - 66px); height: 53px; background-image: url("../images/hp_serv_item_top_mo.png"); background-repeat: repeat-x; display: block;}
  .serv-column-mo .items-top .title { width: 100%; padding: 15px 0 0 0; color: #fff; font-size: 1.4em; font-weight: 600; text-align: center; letter-spacing: 0.1em; box-sizing: border-box;}
  .serv-column-mo .items-lf-md { width: 33px; background-image: url("../images/hp_serv_item_lf-mid_mo.png"); background-repeat: repeat-y; display: block;}
  .serv-column-mo .items-rt-md { width: 33px; background-image: url("../images/hp_serv_item_rt-mid_mo.png"); background-repeat: repeat-y; display: block;}
  
  .serv-column-mo .items-md { width: calc(100% - 66px); background-color: #fff;}
  .serv-column-mo .items-md ul.service-items { width: 100%; padding: 10px 40px 0 40px; margin: 0; list-style: none; display: block; box-sizing: border-box;}
  .serv-column-mo .items-md ul.service-items li { padding: 0; margin: 0; font-size: 1.2em; font-weight: 600; line-height: 1.7em;}
  .serv-column-mo .items-md ul.service-items li font.icon { color: #ccab53;}
  .serv-column-mo .items-lf-bt, .serv-column-mo .items-rt-bt { width: 33px; height: 115px;}
  .serv-column-mo .items-bt { width: calc(100% - 66px); height: 115px; background-image: url("../images/hp_serv_item_bt_mo.png"); background-repeat: repeat-x; display: flex; justify-content: space-around;}
  .serv-column-mo .photos-lf-bt, .serv-column-mo .photos-rt-bt { width: 33px; height: 34px;}
  .serv-column-mo .photos-bt { width: calc(100% - 66px); height: 34px; background-image: url("../images/hp_serv_photo_bt_mo.png"); background-repeat: repeat-x; display: block;}

  .serv-column-mo .items-md .photos-slick { width: 100%; margin: 0 auto; overflow: hidden;}
  .serv-column-mo .items-md .photos-slick .img { width: calc(100% / 1 - 40px); height: auto; padding: 0 20px; box-sizing: border-box;}
  .serv-column-mo .items-md .photos-slick .img img { width: 100%; height: auto;}
  
  .slider {
    width: 80%;
    margin: 0 auto;
  }

  .slick-slide {
    margin: 0px;
  }

  .slick-slide img {
    width: 100%;
  }

  .slick-prev:before,
  .slick-next:before {
    color: black;
  }

  .slick-slide {
    transition: all ease-in-out .3s;
    opacity: 1;
  }

  .slick-active {
    opacity: 1;
  }

  .slick-current {
    opacity: 1;
  }


  /************ #sec-knowhow ************/

  #sec-knowhow { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  .media-record-bt-mo { clear: both; width: 260px; height: 44px; margin: 15px auto;}
  .media-record-bt-mo a { width: 100%; height: 100%; padding: 5px 0 0 0; color: #414141; font-size: 1.4em; font-weight: 600; letter-spacing: 0.1em; text-align: center; text-decoration: none; border-radius: 30px; background-color: #fff000; display: block; box-sizing: border-box;}

  #sec-knowhow .lf-top, #sec-knowhow .rt-top { width: 43px; height: 99px;}
  #sec-knowhow .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_knowhow_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-knowhow .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2em;}
  #sec-knowhow .top .title { padding: 12px 0 0 0; color: #fff; font-size: 1.4em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-knowhow .top .media-record-bt { display: none;}  
  #sec-knowhow .lf-md { width: 43px; background-image: url("../images/sec_knowhow_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .rt-md { width: 43px; background-image: url("../images/sec_knowhow_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-knowhow .middle { width: calc(100% - 86px); background-color: #fff;}
  #sec-knowhow .middle .knowhow-list { width: 100%; margin: 0 0 20px 0;}
  #sec-knowhow .middle .knowhow-list:last-child { margin: 0;}
  #sec-knowhow .middle .knowhow-list a { color: #414141; font-size: 1.1em; text-decoration: none;}
  #sec-knowhow .middle .knowhow-list a span.icon { padding: 0 10px 0 0; color: #508512;}
  #sec-knowhow .middle .knowhow-list a:hover { border-bottom: 1px #414141 solid;}
  #sec-knowhow .lf-bt, #sec-knowhow .rt-bt { width: 43px; height: 45px;}
  #sec-knowhow .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_knowhow_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-about ************/

  #sec-about { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-about .lf-top, #sec-about .rt-top { width: 43px; height: 99px;}
  #sec-about .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_about_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-about .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2em;}
  #sec-about .top .title { padding: 12px 0 0 0; color: #fff; font-size: 1.4em; line-height: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-about .lf-md { width: 43px; background-image: url("../images/sec_about_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .rt-md { width: 43px; background-image: url("../images/sec_about_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-about .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-about .middle .content { width: 100%; padding: 10px 0; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box;}
  #sec-about .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_about_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ #sec-process ************/

  #sec-process { clear: both; width: 100%; padding: 10px 0; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}

  #sec-process .lf-top, #sec-process .rt-top { width: 43px; height: 99px;}
  #sec-process .top { width: calc(100% - 86px); height: 99px; background-image: url("../images/sec_process_bg_tp.png"); background-repeat: repeat-x; display: flex; justify-content: flex-start;}
  #sec-process .top .icon { width: 50px; padding: 5px 0 0 0; color: #fff; font-size: 2em;}
  #sec-process .top .title { padding: 12px 0 0 0; color: #fff; font-size: 1.4em; font-weight: 600; letter-spacing: 0.1em;}
  #sec-process .lf-md { width: 43px; background-image: url("../images/sec_process_bg_lf-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .rt-md { width: 43px; background-image: url("../images/sec_process_bg_rt-md.png"); background-repeat: repeat-y; display: block;}
  #sec-process .middle { width: calc(100% - 86px); background-color: #fff; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  #sec-process .middle .content { width: 100%; padding: 10px 0; font-size: 1.2em; line-height: 1.8em; box-sizing: border-box;}
  #sec-process .middle .content .icon-text { width: 140px; margin: 0 auto 30px auto;}
  #sec-process .middle .content .icon-text .icon { width: 140px; height: 140px; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  #sec-process .middle .content .icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 0.8em; line-height: 1.2em; text-align: center;}
  #sec-process .middle .content .arrow { display: none;}
  #sec-process .middle .content .arrow-mo { width: 100px; padding: 20px 0; margin: 0 auto; color: #bc5555; font-size: 2.6em; text-align: center;}
  #sec-process .bottom { width: calc(100% - 86px); height: 45px; background-image: url("../images/sec_process_bg_bt.png"); background-repeat: repeat-x; display: block;}


  /************ page_1 ************/

  ul.page1-reason-list { width: 100%; padding: 0 0 0 24px; margin: 0; list-style-type: decimal; box-sizing: border-box; display: block;}
  ul.page1-reason-list li { padding: 0; margin: 0 0 30px 0; font-size: 1.1em; line-height: 1.8em;}
  ul.page1-reason-list li:last-child { margin: 0;}


  /************ page_2 ************/

  img.page2-pic-mo { width: 100%; height: auto;}
  img.page2-pic { display: none;}


  /************ page_3 ************/

  .page3-content { width: 100%; padding: 40px 0;}

  .page3-icon-text { width: 200px; margin: 0 auto;}
  .page3-icon-text .icon { width: 160px; height: 160px; margin: 0 auto; color: #fff; font-size: 4em; border-radius: 100%; background-color: #666; overflow: hidden; display: flex; justify-content: center; align-items: center;}
  .page3-icon-text .text { width: 100%; padding: 10px 0 0 0; font-size: 1.2em; font-weight: 600; line-height: 1.4em; text-align: center;}
  .page3-arrow { width: 100%; margin: 20px 0; color: #bc5555; font-size: 2.6em; text-align: center;}


  /************ page_4 ************/

  .page4-case-table { clear: both; width: 100%; padding: 20px 0; border-bottom: 1px #ccc solid;}
  .page4-case-table .column-1 { width: 100%; margin: 0 0 10px 0; color: #508512; font-size: 1.4em; font-weight: 600; box-sizing: border-box;}
  .page4-case-table .column-2 { width: 100%; padding: 0 20px 0 0; font-size: 1.1em; box-sizing: border-box; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page4-case-table .column-2 .title { width: 110px; font-weight: 600;}
  .page4-case-table .column-2 .infor { width: calc(100% - 110px);}
  .page4-case-table .column-3 { width: 100%; margin: 20px 0 0 0; display: flex; justify-content: center; align-items: center;}
  .page4-case-table .column-3 img { width: 100%; height: auto;}


  /************ page_5 ************/

  .article-list-full { clear: both; width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
  .article-list-full .article-list { width: 100%; padding: 10px; margin: 0 0 20px 0; border: 1px #ccc solid; box-sizing: border-box;}
  .article-list-full .article-list a { color: #414141; text-decoration: none;}
  .article-list-full .article-list .pic { width: 100%; height: 30vw; margin: 0 0 10px 0; overflow: hidden;}
  .article-list-full .article-list .pic img { width: 100%; height: auto;}
  .article-list-full .article-list .intro { width: 100%; font-size: 0.9em; line-height: 1.4em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}

  .article-content { clear: both; width: 100%;}
  .article-content .title { width: 100%; padding: 0 0 10px 0; font-size: 1.5em; font-weight: 600; border-bottom: 1px #ccc solid;}
  .article-content .date { width: 100%; padding: 10px 0 30px 0; color: #666; font-size: 0.9em; text-align: right;}
  .article-content .content { width: 100%; margin: 0 0 60px 0; font-size: 1.2em; line-height: 1.8em;}
  .article-content .content img { max-width: 100%; height: auto;}
  .article-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .article-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .article-content .goback-bt a:hover { background-color: #447011;}


  /************ page_6 ************/

  .page6-content { clear: both; width: 100%;}
  .page6-content .pic { width: 100%; overflow: hidden;}
  .page6-content .pic img { width: 180%; height: auto; margin: 0 0 0 -40%;}
  .page6-content .infor { width: 100%; margin: 40px 0 0 0; font-size: 1.4em; font-weight: 600; line-height: 2em; display: flex; justify-content: center;}


  /************ knowledge content ************/

  .knowledge-content { clear: both; width: 100%;}
  .knowledge-content .title { width: 100%; padding: 10px 0; color: #508512; font-size: 1.2em; font-weight: 600; border-bottom: 1px #ccc solid; box-sizing: border-box;}
  .knowledge-content .content { width: 100%; margin: 40px 0; font-size: 1.1em; line-height: 2em;}
  .knowledge-content .goback-bt { clear: both; width: 120px; margin: 0 auto;}
  .knowledge-content .goback-bt a { width: 100%; padding: 5px 0; color: #fff; font-size: 1rem; text-align: center; text-decoration: none; border-radius: 10px; background-color: #508512; display: block;}
  .knowledge-content .goback-bt a:hover { background-color: #447011;}


  /************ site map ************/

  ul.sitemap { clear: both; width: 100%; padding: 40px 0 10px 0; margin: 0; list-style: none; display: block;}
  ul.sitemap li { padding: 0; margin: 0 0 30px 0;}
  ul.sitemap li a { color: #414141; font-size: 1.1em; font-weight: 600; text-decoration: none;}
  ul.sitemap li a:hover { border-bottom: 1px #414141 solid;}


  /************ sec-error ************/

  #sec-error { clear: both; width: 100%; padding: 100px 0;}

  .error-title { width: 100%; font-size: 3.4em; font-weight: bold; line-height: 3em; text-align: center;}

  .error-text { width: 100%; font-size: 2.4em; font-weight: 600; line-height: 2em; text-align: center;}

  .error-goback { width: 140px; margin: 80px auto 0 auto;}
  .error-goback a { width: 100%; padding: 5px 0; color: #fff; font-size: 1.1em; text-align: center; text-decoration: none; border-radius: 8px; background-color: #508512; display: block;}


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

  footer { clear: both; width: 100%; padding: 70px 10px 80px 10px; background-color: #97b61f; background-image: url("../images/footer_bg_top.jpg"); background-repeat: repeat-x; background-position: left top; box-sizing: border-box;}

  ul.footer-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.footer-nav li { padding: 0; margin: 0 15px 20px 15px;}
  ul.footer-nav li a { color: #fff; font-size: 1.2em; text-decoration: none;}
  ul.footer-nav li a:hover { border-bottom: 1px #fff solid;}

  hr.footer-line { clear: both; width: 90%; margin: 20px auto 40px auto; border: 1px rgba(255,255,255,0.4) solid;}

  .footer-infor { clear: both; width: 100%; margin: 0 auto;}
  .footer-infor .column-1 { width: 100%; margin: 0 0 30px 0; color: #fff; line-height: 1.8em; text-align: center;}
  .footer-infor .column-1 span.title { font-size: 1.2em; font-weight: 600;}
  .footer-infor .column-2 { width: 100%;}
  .footer-infor .column-2 a.icon { color: #fff; font-size: 2.4em; text-decoration: none;}
  .footer-infor .column-2 iframe { margin: 0 0 0 calc(50% - 160px);}
  .footer-infor .column-2 img.qrcode { width: 100px; height: auto; margin: 0 auto 30px auto;}


}