@font-face {
     font-family: 'AvantGardeCE-Light';
     src: url('../font/FONTS/FONTS/AvantGardeCE-Light.eot');
     src: url('../font/FONTS/AvantGardeCE-Light.eot?#iefix') format('embedded-opentype'), url('../font/FONTS/AvantGardeCE-Light.woff') format('woff'), url('../font/FONTS/AvantGardeCE-Light.ttf') format('truetype');
 }
 
 @font-face {
     font-family: 'AvantGardeCE-Book';
     src: url('../font/FONTS/AvantGardeCE-Book.eot');
     src: url('../font/FONTS/AvantGardeCE-Book.eot?#iefix') format('embedded-opentype'), url('../font/FONTS/AvantGardeCE-Book.woff') format('woff'), url('../font/FONTS/AvantGardeCE-Book.ttf') format('truetype');
 }

 @font-face {
     font-family: 'AvantGardeCE-Demi';
     src: url('../font/FONTS/AvantGardeCE-Demi.eot');
     src: url('../font/FONTS/AvantGardeCE-Demi.eot?#iefix') format('embedded-opentype'), url('../font/FONTS/AvantGardeCE-Demi.woff') format('woff'), url('../font/FONTS/AvantGardeCE-Demi.ttf') format('truetype');
 }

 @font-face {
     font-family: 'AvantGardeCE-Medium';
     src: url('../font/FONTS/AvantGardeCE-Medium.eot');
     src: url('../font/FONTS/AvantGardeCE-Medium.eot?#iefix') format('embedded-opentype'), url('../font/FONTS/AvantGardeCE-Medium.woff') format('woff'), url('../font/FONTS/AvantGardeCE-Medium.ttf') format('truetype');
 }

 @font-face {
     font-family: 'AvantGardeGothic-Demi';
     src: url('../font/FONTS/AvantGardeGothic-Demi.eot');
     src: url('../font/FONTS/AvantGardeGothic-Demi.eot?#iefix') format('embedded-opentype'), url('../font/FONTS/AvantGardeGothic-Demi.woff') format('woff'), url('../font/FONTS/AvantGardeGothic-Demi.ttf') format('truetype');
 }

 .headroom--pinned:not(.headroom--top) {
     position: fixed;
 }

 body {
     padding-top: 122px;
 }

 header nav a.active {
     color: #C0272D;
 }

 section.banner {
     padding: 0;
 }

 section.banner .swiper-pagination {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
 }

 section.banner .swiper-pagination-bullet {
     background: #fff;
     opacity: 1;
     width: 6px;
     height: 6px;
     margin-left: 0;
     margin-right: 15px;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 section.banner .swiper-pagination-bullet-active {
     background: #C0272D;
     width: 14px;
     height: 14px;
     border: 1px solid #fff;
 }

 section.banner .bg {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
 }

 section.banner .slide {
     position: relative;
     height: auto;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
 }

 section.banner .slide:before {
     content: "";
     display: block;
     padding-top: 33.33333333%;
 }

 section.banner .slide .txt_line .txt-wrap .txt {
     text-align: center;
 }

 section.banner .slide.short {
     position: relative;
     height: auto;
 }

 section.banner .slide.short:before {
     content: "";
     display: block;
     padding-top: 13.88888889%;
 }

 section.banner .slide.short .highlight-sharp {
     font-size: 3.143em;
 }

 section.banner .slide.left {
     -webkit-box-pack: start;
     -moz-box-pack: start;
     -ms-flex-pack: start;
     -webkit-justify-content: flex-start;
     justify-content: flex-start;
 }

 section.banner .slide.left .txt_line .txt-wrap .txt {
     text-align: left;
 }

 section.banner .slide.right {
     -webkit-box-pack: end;
     -moz-box-pack: end;
     -ms-flex-pack: end;
     -webkit-justify-content: flex-end;
     justify-content: flex-end;
 }

 section.banner .slide.right .txt_line .txt-wrap .txt {
     text-align: right;
 }

 section.banner .slide.center {
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
 }

 section.banner .slide.center .txt_line .txt-wrap .txt {
     text-align: center;
 }

 section.banner .container {
     width: auto;
     margin: 0;
 }

 section.banner .heading {
     position: relative;
     z-index: 1;
     opacity: 0;
 }

 section.banner .txt_line.row_1 {
     font-size: 3.938em;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     color: #fff;
     text-transform: uppercase;
 }

 section.banner .txt_line.row_1 .txt-wrap>span,
 section.banner .txt_line.row_1 .shadow {
     padding: 7px 20px;
 }

 section.banner .txt_line.row_1 .txt-wrap {
     background-color: #C0272D;
 }

 section.banner .txt_line.row_1 .txt-wrap:after {
     background-color: #C0272D;
 }

 section.banner-theme {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     background-color: #F8F5EE;
     padding: 0;
     text-align: center;
 }

 section.banner-theme .container {
     background-image: url('../image/bg_coffee.png');
     background-size: contain;
     background-position: 70px 0;
     background-repeat: no-repeat;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
 }

 section.banner-theme .bg {
     position: relative;
     height: auto;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
     padding: 10px 0;
     width: 100%;
     height: 100%;
 }

 section.banner-theme .bg:before {
     content: "";
     display: block;
     padding-top: 13.88888889%;
 }

 section.banner-theme .subhead {
     font-size: 1.571em;
     line-height: 120%;
     margin-bottom: 10px;
     text-transform: uppercase;
 }

 section.banner-theme .heading {
     font-size: 3.143em;
     line-height: 120%;
     text-transform: uppercase;
 }

 section.filledbg {
     padding: 85px 0;
     background-color: #F8F5EE;
 }

 section.filledbg .header {
     text-align: center;
     margin-bottom: 40px;
 }

 section.form .header {
     text-align: center;
     margin-bottom: 40px;
 }

 section.card {
     padding: 80px 0;
 }

 .btn-container {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
 }

 .btn-container.align {
     -webkit-box-pack: start;
     -moz-box-pack: start;
     -ms-flex-pack: start;
     -webkit-justify-content: flex-start;
     justify-content: flex-start;
 }

 .btn-container.align .btn {
     margin-right: 15px;
 }

 .com-row .row {
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .com-row .copy {
     padding-right: 25px;
     line-height: 160%;
 }

 .com-row .copy .head {
     font-size: 2.429em;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     line-height: 140%;
     margin-bottom: 20px;
     text-transform: uppercase;
 }

 .com-row .copy p:not(:last-child) {
     margin-bottom: 30px;
 }

 .com-row .pic {
     width: 90%;
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
     margin: 0 auto;
     z-index: 1;
 }

 .com-row .landscape1 .pic {
     position: relative;
     height: auto;
 }

 .com-row .landscape1 .pic:before {
     content: "";
     display: block;
     padding-top: 66.66666667%;
 }

 .com-row .landscape2 .pic {
     position: relative;
     height: auto;
 }

 .com-row .landscape2 .pic:before {
     content: "";
     display: block;
     padding-top: 66.66666667%;
 }

 .com-row .portrait .pic {
     position: relative;
     height: auto;
 }

 .com-row .portrait .pic:before {
     content: "";
     display: block;
     padding-top: 119.04761905%;
 }

 .com-row .portrait3 .pic {
     width: 100%;
     position: relative;
     height: auto;
 }

 .com-row .portrait3 .pic:before {
     content: "";
     display: block;
     padding-top: 117.64705882%;
 }

 .com-row .btn {
     margin-top: 40px;
 }

 .com-heading {
     margin: 10px 0;
 }

 .com-heading h2 {
     margin-bottom: 25px;
     text-align: center;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 2.429em;
     text-transform: uppercase;
     line-height: 100%;
 }

 .com-heading .desc {
     text-align: center;
     padding: 0 80px;
 }

 .com-intro {
     max-width: 787px;
     margin: 0 auto;
 }

 .com-intro .title {
     font-size: 1.571em;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     margin-bottom: 25px;
 }

 .com-intro p:not(:last-child) {
     margin-bottom: 30px;
 }

 .com-remarks {
     margin-top: 40px;
     margin-bottom: 0;
     max-width: 790px;
 }

 .com-remarks p {
     margin-bottom: 0;
 }

 .com-quote {
     margin: 20px 0;
 }

 .com-quote .pic-wrapper {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .com-quote .pic {
     position: relative;
     height: auto;
     width: 100%;
     height: 100%;
     border-radius: 50%;
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
 }

 .com-quote .pic:before {
     content: "";
     display: block;
     padding-top: 100%;
 }

 .com-quote .wrapper {
     padding: 18px 0 18px 30px;
 }

 .com-quote .desc {
     font-family: "Caveat", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 2.286em;
     line-height: 150%;
 }

 .com-quote .desc>span {
     position: relative;
 }

 .com-quote .desc>span:before {
     content: "";
     background-image: url("../image/quote.png");
     background-size: contain;
     background-position: center;
     background-repeat: no-repeat;
     width: 50px;
     height: 50px;
     position: absolute;
     left: -28px;
     top: -18px;
     z-index: -1;
 }

 .com-quote .name {
     text-transform: uppercase;
     color: #C0272D;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 1.714em;
     margin: 40px 0 15px 0;
 }

 .com-quote .title {
     text-transform: uppercase;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     color: #212121;
     letter-spacing: 1px;
 }

 .com-category {
     margin-bottom: 60px;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
 }

 .com-category.more .swiper-container {
     width: calc(100% - 20px);
     overflow: hidden;
 }

 .com-category .category {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 1.571em;
     position: relative;
     cursor: pointer;
 }

 .com-category .category:not(:last-child) {
     margin-right: 40px;
 }

 .com-category .category:after {
     content: "";
     height: 4px;
     width: 0;
     background-color: #C0272D;
     display: inline-block;
     position: absolute;
     bottom: -7px;
     right: 0;
     opacity: 0;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 .com-category .category.active,
 .com-category .category:hover {
     color: #C0272D;
 }

 .com-category .category.active:after,
 .com-category .category:hover:after {
     opacity: 1;
     left: 0;
     right: auto;
     width: 100%;
 }

 .com-category .swiper-container {
     width: 100%;
     overflow: visible;
 }

 .com-category .swiper-slide {
     width: auto;
 }

 .com-category .swiper-slide:last-child {
     margin-right: 0 !important;
 }

 .com-category .swiper-wrapper {
     -webkit-box-pack: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
 }

 .com-category .swiper-wrapper.more {
     -webkit-box-pack: start;
     -moz-box-pack: start;
     -ms-flex-pack: start;
     -webkit-justify-content: flex-start;
     justify-content: flex-start;
 }

 .com-category .swiper-button-next.swiper-button-disabled {
     display: none;
 }

 .com-category .swiper-button-next {
     background-image: url("../image/slide_right.svg");
     background-size: cover;
     width: 6px;
     height: 11px;
     position: relative;
     right: 0;
     top: 5px;
     transform: none;
 }

 .com-details .warning {
     font-size: 1.143em;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     min-height: 50px;
 }

 .com-product .wrapper {
     text-align: center;
     padding: 0 35px;
 }

 .com-product .wrapper .product {
     background-repeat: no-repeat;
     background-size: auto;
     background-position: center;
     position: relative;
     height: auto;
 }

 .com-product .wrapper .product:before {
     content: "";
     display: block;
     padding-top: 100%;
 }

 .com-product .wrapper .title {
     font-size: 1.571em;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
 }

 .com-video {
     margin: 90px 0 130px 0;
 }

 .com-video video {
     display: none;
 }

 .com-video .wrapper {
     position: relative;
     height: auto;
 }

 .com-video .wrapper:before {
     content: "";
     display: block;
     padding-top: 59.17159763%;
 }

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

 .com-video .pic {
     position: relative;
     height: auto;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     cursor: pointer;
 }

 .com-video .pic:before {
     content: "";
     display: block;
     padding-top: 59.17159763%;
 }

 .com-video .pic:hover:after {
     transform: translate(-50%, -50%) scale(1.03);
 }

 .com-video .pic:after {
     content: "";
     background-image: url("../image/play.svg");
     background-size: 100%;
     background-position: center;
     background-repeat: no-repeat;
     width: 107px;
     height: 107px;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -moz-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     -o-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
 }

 .com-line {
     border-top: 2px solid #C0272D;
     border-bottom: 2px solid #C0272D;
     padding: 60px 20px;
     text-align: center;
 }

 .com-line.full-width {
     padding-left: 90px;
     padding-right: 90px;
 }

 .com-line.onlySlogan .styling {
     margin-bottom: 0;
 }

 .com-line .styling {
     font-size: 2.286em;
     font-family: "Caveat", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     margin-bottom: 30px;
     line-height: 160%;
 }

 .com-line .copy {
     display: inline-block;
     margin-bottom: 40px;
 }

 .com-line .brand {
     margin: 0 10px 0 5px;
 }

 .com-line .brand img {
     position: relative;
     top: 7px;
 }

 .com-line .btn.outline-red {
     margin-top: 10px;
 }

 .com-news {
     margin-bottom: 60px;
 }

 .com-news .wrapper {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -moz-box-pack: justify;
     -ms-flex-pack: justify;
     -webkit-justify-content: space-between;
     justify-content: space-between;
 }

 .com-news .part {
     width: calc((100% - 40px)/2);
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-direction: normal;
     -moz-box-direction: normal;
     -webkit-box-orient: vertical;
     -moz-box-orient: vertical;
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
 }

 .com-news .part:last-of-type {
     padding-top: 130px;
 }

 .com-news-list .wrapper {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -moz-box-pack: justify;
     -ms-flex-pack: justify;
     -webkit-justify-content: space-between;
     justify-content: space-between;
 }

 .com-news-list .part {
     display: block;
     width: calc((100% - 40px)/2);
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-direction: normal;
     -moz-box-direction: normal;
     -webkit-box-orient: vertical;
     -moz-box-orient: vertical;
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
 }

 .com-news-list .content {
     display: none;
 }

 .com-news-card {
     position: relative;
     margin-bottom: 40px;
 }

 .com-news-card .pic {
     position: relative;
     height: auto;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
 }

 .com-news-card .pic:before {
     content: "";
     display: block;
     padding-top: 66.66666667%;
 }

 .com-news-card .pic.square {
     position: relative;
     height: auto;
 }

 .com-news-card .pic.square:before {
     content: "";
     display: block;
     padding-top: 100%;
 }

 .com-news-card .copy {
     background-color: #F8F5EE;
     padding: 32px 25px;
     width: 87%;
     margin: -40px auto 0 auto;
     position: relative;
     z-index: 1;
 }

 .com-news-card .copy .name {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 1.571em;
     text-transform: uppercase;
     margin-bottom: 18px;
     line-height: 150%;
 }

 .com-news-card .copy .title {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 1.571em;
     margin-bottom: 12px;
 }

 .com-news-card .copy .desc {
     padding-bottom: 10px;
 }

 .com-news-card .copy .desc p:not(:last-child) {
     margin-bottom: 5px;
 }

 .com-news-card .copy .more {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 0.857em;
     text-transform: uppercase;
     letter-spacing: 1px;
     margin-top: 10px;
 }

 .com-news-card .copy .more a {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .com-news-card .copy .more a:hover .icon {
     -webkit-transform: translateX(5px);
     -moz-transform: translateX(5px);
     -ms-transform: translateX(5px);
     -o-transform: translateX(5px);
     transform: translateX(5px);
 }

 .com-news-card .copy .more .icon {
     margin-left: 10px;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 .com-news-card .copy .more .text {
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 .com-news-card .copy table {
     margin: 10px 0;
 }

 .com-news-card .copy table tr td {
     line-height: 100%;
     font-size: 0.857em;
 }

 .com-news-card .copy table tr td:first-of-type {
     color: #C0272D;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     text-transform: uppercase;
     padding: 5px 20px 5px 0;
     letter-spacing: 1px;
 }

 .com-news-card .wrapper {
     width: 87%;
     margin: 0 auto;
 }

 .com-news-card .wrapper .box {
     margin: 10px 0;
 }

 .com-news-card .small-wrap {
     width: 90%;
     position: relative;
     margin-left: 0;
 }

 .com-news-card .polygon-wrapper {
     padding: 30px 0;
 }

 .com-list {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -moz-box-pack: justify;
     -ms-flex-pack: justify;
     -webkit-justify-content: space-between;
     justify-content: space-between;
 }

 .com-list .part {
     width: calc((100% - 40px)/2);
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-direction: normal;
     -moz-box-direction: normal;
     -webkit-box-orient: vertical;
     -moz-box-orient: vertical;
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
 }

 .com-list .com-card {
     position: relative;
     margin-bottom: 40px;
 }

 .com-list .com-line .styling {
     margin-bottom: 0;
 }

 .com-list .pic {
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     position: relative;
     height: auto;
 }

 .com-list .pic:before {
     content: "";
     display: block;
     padding-top: 100%;
 }

 .com-list .pic.landscape {
     position: relative;
     height: auto;
 }

 .com-list .pic.landscape:before {
     content: "";
     display: block;
     padding-top: 66.66666667%;
 }

 .com-list .pic.small {
     width: 65%;
 }

 .com-list .pic.right {
     float: right;
 }

 .com-list .name {
     text-transform: uppercase;
     position: absolute;
     left: -1px;
     bottom: -1px;
     background-color: #F8F5EE;
     padding: 20px 30px;
     font-size: 1.571em;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
 }

 .com-list .polygon-wrapper {
     padding: 30px 0;
 }

 section#related {
     padding-top: 0;
     background: linear-gradient(#fff 0%, #fff 40%, #F8F5EE 40%, #F8F5EE 100%);
 }

 section#related .header {
     margin-bottom: 40px;
 }

 section#related .swiper-slide:nth-child(1) .slide .highlight-sharp:nth-of-type(1) .highlight-bg>span,
 section#related .swiper-slide:nth-child(1) .slide .highlight-sharp:nth-of-type(1) .highlight-bg .desc {
     overflow: hidden;
     vertical-align: top;
     opacity: 0;
 }

 section#related .swiper-slide:nth-child(1) .slide .highlight-sharp:nth-of-type(1) .highlight-bg>span:after,
 section#related .swiper-slide:nth-child(1) .slide .highlight-sharp:nth-of-type(1) .highlight-bg .desc:after {
     content: "";
     background-color: #C0272D;
     width: 100%;
     height: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     z-index: 1;
     opacity: 0;
 }

 section#related .swiper-slide:nth-child(1) .slide .highlight-sharp:nth-of-type(1) .highlight-bg:after {
     content: "";
     background-color: #C0272D;
     width: 100%;
     height: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     z-index: -1;
 }

 section#related .swiper-slide:nth-child(2) .slide .highlight-sharp:nth-of-type(1) .highlight-bg>span,
 section#related .swiper-slide:nth-child(2) .slide .highlight-sharp:nth-of-type(1) .highlight-bg .desc {
     overflow: hidden;
     vertical-align: top;
     opacity: 0;
 }

 section#related .swiper-slide:nth-child(2) .slide .highlight-sharp:nth-of-type(1) .highlight-bg>span:after,
 section#related .swiper-slide:nth-child(2) .slide .highlight-sharp:nth-of-type(1) .highlight-bg .desc:after {
     content: "";
     background-color: #C0272D;
     width: 100%;
     height: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     z-index: 1;
     opacity: 0;
 }

 section#related .swiper-slide:nth-child(2) .slide .highlight-sharp:nth-of-type(1) .highlight-bg:after {
     content: "";
     background-color: #C0272D;
     width: 100%;
     height: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     z-index: -1;
 }

 section#related .swiper-slide:nth-child(3) .slide .highlight-sharp:nth-of-type(1) .highlight-bg>span,
 section#related .swiper-slide:nth-child(3) .slide .highlight-sharp:nth-of-type(1) .highlight-bg .desc {
     overflow: hidden;
     vertical-align: top;
     opacity: 0;
 }

 section#related .swiper-slide:nth-child(3) .slide .highlight-sharp:nth-of-type(1) .highlight-bg>span:after,
 section#related .swiper-slide:nth-child(3) .slide .highlight-sharp:nth-of-type(1) .highlight-bg .desc:after {
     content: "";
     background-color: #C0272D;
     width: 100%;
     height: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     z-index: 1;
     opacity: 0;
 }

 section#related .swiper-slide:nth-child(3) .slide .highlight-sharp:nth-of-type(1) .highlight-bg:after {
     content: "";
     background-color: #C0272D;
     width: 100%;
     height: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     z-index: -1;
 }

 .section-highlight-swiper .swiper-container {
     overflow: visible;
 }

 .section-highlight-swiper .swiper-wrapper {
     -webkit-box-pack: start;
     -moz-box-pack: start;
     -ms-flex-pack: start;
     -webkit-justify-content: flex-start;
     justify-content: flex-start;
 }

 .section-highlight-swiper .slide {
     width: 100%;
     cursor: pointer;
 }

 .section-highlight-swiper .slide .wrapper {
     position: relative;
     height: auto;
     overflow: hidden;
 }

 .section-highlight-swiper .slide .wrapper:before {
     content: "";
     display: block;
     padding-top: 66.66666667%;
 }

 .section-highlight-swiper .slide .bg {
     width: 100%;
     height: 100%;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     z-index: -1;
     position: absolute;
     left: 0;
     top: 0;
     -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
 }

 .section-highlight-swiper .slide:hover .bg {
     -webkit-transform: scale(1.03);
     -moz-transform: scale(1.03);
     -ms-transform: scale(1.03);
     -o-transform: scale(1.03);
     transform: scale(1.03);
 }

 .section-highlight-swiper .highlight {
     left: 0;
     bottom: 0;
     position: absolute;
     left: -20px;
     bottom: 20px;
     padding: 6px 10px;
 }

 .com-lg-swiper.title-type .slide .txt_line.row_1 {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
 }

 .com-lg-swiper .paragraph {
     display: none;
 }

 .com-lg-swiper .article {
     margin-top: 140px;
 }

 .com-lg-swiper .article p:not(:last-child) {
     margin-bottom: 35px;
 }

 .com-lg-swiper .slide {
     -webkit-transition: all 0.8s ease-in-out;
     -moz-transition: all 0.8s ease-in-out;
     -o-transition: all 0.8s ease-in-out;
     transition: all 0.8s ease-in-out;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -moz-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .com-lg-swiper .slide .image {
     width: 69%;
 }

 .com-lg-swiper .slide .image>span {
     position: relative;
     height: auto;
     width: 100%;
     display: block;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
 }

 .com-lg-swiper .slide .image>span:before {
     content: "";
     display: block;
     padding-top: 62.5%;
 }

 .com-lg-swiper .slide .copy {
     width: calc(31% + 60px);
     margin-left: -60px;
     position: relative;
     z-index: 2;
     opacity: 0;
 }

 .com-lg-swiper .slide .txt_line.row_1 {
     color: #212121;
     font-family: "AvantGardeCE-Book", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 1em;
     text-transform: initial;
     letter-spacing: 0;
     line-height: 160%;
 }

 .com-lg-swiper .slide .txt_line.row_1 .txt-wrap>span,
 .com-lg-swiper .slide .txt_line.row_1 .shadow {
     padding: 35px;
 }

 .com-lg-swiper .slide .txt_line.row_1 .txt-wrap {
     background-color: #F8F5EE;
 }

 .com-lg-swiper .slide .txt_line.row_1 .txt-wrap:after {
     background-color: #F8F5EE;
 }

 .com-lg-swiper .swiper-container {
     overflow: visible;
 }

 .com-lg-swiper .swiper-slide-active {}

 .com-lg-swiper .swiper-slide-active .overlay {
     width: 100%;
     height: 100%;
     background-color: #fff;
     z-index: 2;
     position: absolute;
     right: 0;
     top: 0;
 }

 .com-lg-swiper .swiper-pagination-fraction {
     font-size: 5.143em;
     text-align: left;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     left: 61%;
     bottom: -10px;
     width: auto;
 }

 .com-lg-swiper .swiper-button-next {
     top: auto;
     right: 0;
     bottom: -30px;
     -webkit-transform: translate(0);
     -moz-transform: translate(0);
     -ms-transform: translate(0);
     -o-transform: translate(0);
     transform: translate(0);
 }

 .com-lg-swiper .swiper-button-prev {
     top: auto;
     bottom: -30px;
     left: auto;
     right: 68px;
     -webkit-transform: translate(0);
     -moz-transform: translate(0);
     -ms-transform: translate(0);
     -o-transform: translate(0);
     transform: translate(0);
 }

 .accordion-head {
     margin-bottom: 60px;
     text-align: center;
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     font-size: 2.429em;
     text-transform: uppercase;
 }

 .com-tab .bg {
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     position: relative;
     height: auto;
 }

 .com-tab .bg:before {
     content: "";
     display: block;
     padding-top: 41.66666667%;
 }

 .com-tab .bg img {
     display: none;
 }

 .com-tab .details {
     display: none;
 }

 .com-tab .details p {
     margin-top: 20px;
 }

 .com-tab .details p:first-child {
     margin-top: 30px;
 }

 .com-tab .txt {
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
 }

 .com-tab .tab-menu {
     width: 27%;
     background-color: #fff;
     padding: 50px 20px 50px 0;
     margin-top: -120px;
     position: relative;
     z-index: 1;
 }

 .com-tab .tab-menu sup {
     margin-right: 10px;
     font-size: 1.091em;
     font-family: "Caveat", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     top: 0;
 }

 .com-tab .tab-menu .item {
     cursor: pointer;
     margin-bottom: 40px;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 .com-tab .tab-menu .item.active .head {
     color: #C0272D;
 }

 .com-tab .tab-menu .item.active .head span:after {
     opacity: 1;
     left: 0;
     right: auto;
     width: 100%;
 }

 .com-tab .tab-menu .item .head {
     font-size: 1.571em;
     display: -webkit-box;
     display: -moz-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
 }

 .com-tab .tab-menu .item .head span {
     font-family: "AvantGardeCE-Demi", "PingFang SC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
     position: relative;
 }

 .com-tab .tab-menu .item .head span:after {
     content: "";
     height: 4px;
     width: 0;
     background-color: #C0272D;
     display: inline-block;
     position: absolute;
     bottom: -7px;
     right: 0;
     opacity: 0;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 .com-tab .desc {
     width: 73%;
     padding: 50px 10px 50px 40px;
 }

 .com-tab .desc p:not(:last-child) {
     margin-bottom: 20px;
 }