@charset "utf-8";

/** bootstrap **/
@import "bootstrap-4.2.1.css";

/** 文字icon **/
@import "font-awesome.min.css";

/** 手機選單 **/
@import url("slicknav.css") screen and (max-width:767px);

/** edm **/
@import "edm.css";

/** googlefont **/
@import "Exo+2.css";
@import "Noto+Sans+TC.css";

*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{width:100%; height:auto;}
body{background:#ffffff; margin:0; padding:0; width:100%; height:auto; font-size:medium;line-height: 1.6;font-family:'Exo 2', 'Noto Sans TC', sans-serif;word-break: break-word;}
a,a:hover{text-decoration:none;transition: all 0.5s ease 0s;}
img{border:0; vertical-align:middle; max-width:100%;}
input{vertical-align:middle;border-radius: 0; }
input:focus, select:focus, textarea:focus, button:focus{outline:0;}
/** 取消ios按鈕樣式 **/
input[type="button"], input[type="submit"], input[type="reset"], button[type="button"], button[type="submit"], button[type="reset"], a[type="button"], a[type="submit"], a[type="reset"], textarea{border-radius: 0; -webkit-appearance: none;-moz-appearance: none;appearance: none;}
.slicknav_menu{display:none;}

/** 表單預設文字顏色設定 **/
::-webkit-input-placeholder{color:#999999;}
::-moz-placeholder{color:#999999;}
:-ms-input-placeholder{color:#999999;}
input:-moz-placeholder{color:#999999;}
#field2::-webkit-input-placeholder{color:#999999;}
#field3::-webkit-input-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-webkit-input-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
#field2::-moz-placeholder{color:#999999;}
#field3::-moz-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-moz-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
.writing-mode-vertical{writing-mode:tb-lr; -ms-writing-mode:tb-lr; -webkit-writing-mode:vertical-lr; -moz-writing-mode:vertical-lr; -ms-writing-mode:vertical-lr; writing-mode:vertical-lr;}

/** 清除瀏覽器的默認選擇框樣式清除，隱藏拖動箭頭 
select {appearance:none;-moz-appearance:none;-webkit-appearance:none;background:#ffffff url(../images/form-select.png)no-repeat right 10px center;background-size: 10px;}
select::-ms-expand { display: none; }
**/

/** 反白 
::selection {background: #000000;color: #f92828;}
::-moz-selection {background:#000000;color: #f92828;}
**/

/** 手機選單、選單 色塊-變色 **/
.b-color, .slicknav_menu{}
.slicknav_icon-bar{background-color:#FFF;}
.b-color>li:hover, .b-color>li>ul>li>a:hover, .slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover{background:#ccad7a;}
.border-color{border-left:7px #A0A0A0 solid;}
.slicknav_nav .slicknav_arrow{font-family:Arial;}

/** 上版 **/
header{position: fixed;top: 0;left: 0; width: 100%;z-index: 10000;height: 132px;transition: all 0.5s ease 0s;}
.head-main{height:132px; padding:0; position:relative;transition: all 0.5s ease 0s;}
.head-main .logo{position:absolute; left:45px; top:30px; height:auto;width: 75px;transition: all 0.5s ease 0s;}
.head-main .logo a{display: block;}
.head-main .logo img{width:100%; height:auto;}
.header-height{height: 60px;background:rgba(0,0,0,.9);transition: all 0.5s ease 0s;}
.header-height .head-main{height:60px;transition: all 0.5s ease 0s; }
.header-height .head-main .logo{position:absolute; left:20px; top:7px;width: 46px;transition: all 0.5s ease 0s;}
@media screen and (max-width:767px){
    header{position:inherit;top:inherit;left: inherit; height:0px;}
	.head-main{position:inherit; height:0px; }
	.head-main .logo{position: fixed; left:15px; top:6px;width: 36px;z-index: 10000;}
    .header-height{height: 0px;}
    .header-height .head-main{height:0px;}
    .header-height .head-main .logo{ position: fixed; left:15px; top:6px;width: 36px;z-index: 10000;}
}

/** 主選單與下拉 **/
nav{margin: 0 15px 0 160px;transition: all 0.5s ease 0s;}
.menu{padding:0; list-style:none; position:relative; margin:0;padding:43.5px 0; display:flex;justify-content: flex-end;transition: all 0.5s ease 0s;}
.menu>li{width: auto;color:#ffffff; font-size:16px; text-align:center; position:relative;cursor:pointer; padding:0; margin:0;letter-spacing: 2px;}
.menu>li>a{color:#ffffff; display:block; padding:10px 26px; margin:0;position: relative;}
.menu>li>a:before{content: "";display: block;width:0px; height: 1px;background: #ffffff;position: absolute;top: 0;left: calc(50% - 0px);transition: all 0.3s ease 0s;}
.menu>li>a:hover{position: relative;color: #ffffff;}
.menu>li>a:hover:before{content: "";display: block;width: 32px; height: 1px;background: #ffffff;position: absolute;top: 0;left: calc(50% - 16px);transition: all 0.3s ease 0s;}
.menu>li.sub>ul.sub-menu{background:rgba(0,0,0,0.5); display:none; position:static; z-index:999; margin:0; padding:0; border-radius:0 0 5px 5px; overflow:hidden;}
.menu>li.sub:hover ul.sub-menu{position:absolute; display:block; width:100%; left:0; top:47px;}
.menu>li.sub>ul.sub-menu>li{display:block; border-top:1px #fff dotted;}
.menu>li.sub>ul.sub-menu>li>a{display:block; color:#fff; padding:5px 10px; margin:0;}
.menu>li.sub>ul.sub-menu>li>a:hover{background:#000000;}
.header-height nav{margin: 0 15px 0 80px;transition: all 0.5s ease 0s;}
.header-height .menu{padding:7.5px 0; transition: all 0.5s ease 0s;}
@media screen and (max-width:850px){
    .menu>li>a{ padding:10px 20px;}
}
@media screen and (max-width:767px){
	.slicknav_menu{display:none;}
	#menu{display:none;}
	.slicknav_menu{display:block;background:rgba(0,0,0,.9);position: fixed;top: 0;left: 0;z-index: 10000;width: 100%;}
}

/** edm輪播 **/
.edm{background:#ffffff; max-width:100%; margin:0 auto; position:relative;}
.edm:before{content: "";display: block;width: 100%;height:352px;background: url("../images/edm-before.png")repeat-x center top;background-size: contain; position: absolute;top: 0;left: 0;z-index: 2;}
.edm img{width: 100%;}
.edm .item{}
.edm .item h4{padding: 0;margin: 0;position: relative;line-height: 1.6;}
.edm .item h4 .edm-photo{}
.edm .item h4 .edm-photo img{width: 100%;}
.edm .item h4 .edm-font{font-size: 32px; color: #ffffff;font-weight: 700;background: rgba(0,0,0,.65);padding: 20px 45px;position: absolute;bottom:115px;left: 0;letter-spacing: 4px;}
.edm .active .edm-photo img{transform:scale(1);}
@keyframes edm-active
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
@-moz-keyframes edm-active /* Firefox */
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
@-webkit-keyframes edm-active /* Safari 和 Chrome */
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
@-o-keyframes edm-active /* Opera */
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
.edm .active .edm-photo img{
animation: edm-active linear 4.4s 1;
-moz-animation: edm-active linear 4.4s 1;	/* Firefox */
-webkit-animation: edm-active linear 4.4s 1;	/* Safari 和 Chrome */
-o-animation: edm-active linear 4.4s 1;	/* Opera */
}
@media screen and (max-width:1000px){
    .edm:before{height:250px;}
}
@media screen and (max-width:767px){
    .edm{padding: 47px 0 0 0;}
    .edm:before{height:100px;}
    .edm .item h4 .edm-font{font-size: 24px; padding: 15px 30px;bottom:60px;}
}
@media screen and (max-width:575px){
    .edm .item h4 .edm-font{font-size: 20px; padding: 10px 15px;bottom:30px;}
}

/** 配置 **/
.warpper{padding: 0 0 20px 0;overflow: hidden;}
.main{}
.i-title-main{position: relative;z-index: 1;padding: 0 15px;}
.i-title{max-width: 1250px; margin: 30px auto;font-weight: 400;position: relative;}
.i-title h2.i-title-ch{font-size: 32px; color: #333333;letter-spacing: 4.5px;line-height: 1.6;padding: 0;margin: 0;}
.i-title .i-title-en{font-size: 14px; color: #ccad7a;letter-spacing: 3px;line-height: 1.2;}
.i-more{position: absolute;top:16px;right: 0; font-size: 12px;color: #333333;text-transform: uppercase;letter-spacing: 1px;text-align: center;z-index: 1;}
.i-more a{color: #333333;border-bottom: 1px #333333 solid;padding: 8px 10px;position: relative;}
.i-more a:after{content: "";display: block;width: 3px; height: 3px;background: #333333;position: absolute;bottom: -2px;left: calc(50% - 1.5px);transition: all 0.3s ease 0s;}
.i-more a:hover{position: relative;}
.i-more a:hover:after{content: "";display: block;width: 100%; height: 3px;background: #333333;position: absolute;bottom: -2px;left: 0;transition: all 0.3s ease 0s;}
@media screen and (max-width:767px){
    .i-title{margin: 20px auto;}
    .i-title h2.i-title-ch{font-size: 28px; }
    .i-title .i-title-en{font-size: 13px; }
}
@media screen and (max-width:575px){
    .i-title h2.i-title-ch{font-size: 24px; }
    .i-title .i-title-en{font-size: 12px; }
}

/**首頁slogan **/
.i-slogan-main{padding: 0 15px;}
.i-slogan{padding:100px 0 80px 0; max-width: 1250px;margin: 0 auto;text-align: center;font-weight: 900;}
.i-slogan:after{content: ""; display:block; width: 216px; height: 5px;background: #ccad7a;margin:46px auto 0 auto;}
.i-slogan-font{font-size: 48px; color: #333333;letter-spacing: 10px;position: relative;z-index: 1;}
.i-slogan_bg{font-size: 60px; color: #f2f2f2;letter-spacing: 12px;margin: -122px 0 0 0;}
@media screen and (max-width:767px){
    .i-slogan{padding:80px 0 60px 0;font-weight:700;}
    .i-slogan-font{font-size: 42px;letter-spacing: 6px;}
    .i-slogan_bg{font-size: 52px;letter-spacing: 8px;margin: -108px 0 0 0;}
    .i-slogan:after{width: 180px; height: 4px;margin:36px auto 0 auto;}
}
@media screen and (max-width:575px){
    .i-slogan{padding:60px 0 40px 0;}
    .i-slogan-font{font-size: 28px;letter-spacing: 1px;}
    .i-slogan_bg{font-size: 32px;letter-spacing: 3px;margin: -70px 0 0 0;}
    .i-slogan:after{width: 160px; height: 3px;margin:28px auto 0 auto;}
}

/** 首頁玖原鑑賞 **/
.i-appreciation-main{position: relative;padding: 5px 0 40px 0;}
.i-appreciation-main:after{content: "";display: block;width:70%;height: 100%;background: #f2f2f2;position: absolute;top: 0;right: 0;z-index: 0;}
.i-appreciation{}
.i-appreciation .swiper-slide{}
.i-appreciation .swiper-slide a{display: block;transform:translateY(0px);transition: all 0.5s ease 0s;}
.i-appreciation .swiper-slide a:hover {transform:translateY(10px);transition: all 0.5s ease 0s;}
.i-appreciation .swiper-slide h3{font-weight: 300;font-size: 18px; color: #333333;padding: 0;margin:15px 0;text-align: center;line-height: 1.6;overflow: hidden;text-overflow: ellipsis;height: 28px;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.i-appreciation .swiper-slide .i-appreciation-photo{background-position: center center;background-repeat: no-repeat;background-size: contain;}
.i-appreciation .swiper-slide .i-appreciation-photo img{width: 100%;}
.i-appreciation .swiper-button-prev{display: flex;align-items: center;justify-content: center; width:50px;height: 50px; background:rgba(0,0,0,.75) url(../images/arrow-left-w.png)no-repeat center center;position: absolute;bottom:inherit;left:0;top: calc(50% - 25px); right: inherit;background-size: 16px;}
.i-appreciation .swiper-button-prev:hover{display: flex;align-items: center;justify-content: center;width:50px;height: 50px; background:rgba(255,255,255,.75) url(../images/arrow-left.png)no-repeat center center;background-size: 16px;}
.i-appreciation .swiper-button-prev:after{display: none;}
.i-appreciation .swiper-button-next {display: flex;align-items: center;justify-content: center;width:50px;height: 50px;background:rgba(0,0,0,.75) url(../images/arrow-right-w.png)no-repeat center center;position: absolute;bottom:inherit;left: inherit;top: calc(50% - 25px);right:0;background-size: 16px;}
.i-appreciation .swiper-button-next:hover{display: flex;align-items: center;justify-content: center;width:50px;height: 50px; background:rgba(255,255,255,.75)  url(../images/arrow-right.png)no-repeat center center;background-size: 16px;}
.i-appreciation .swiper-button-next:after{display: none;}
@media screen and (max-width:767px){
    .i-appreciation-main{padding: 5px 0 30px 0;}
    .i-appreciation-main:after{width:60%;}
    .i-appreciation .swiper-slide h3{font-size: 16px;height: 25px;margin:10px 0;}
    .i-appreciation .swiper-button-prev{width:40px;height: 40px; background:rgba(0,0,0,.75) url(../images/arrow-left-w.png)no-repeat center center;background-size:10px;}
    .i-appreciation .swiper-button-prev:hover{width:40px;height: 40px; background:rgba(255,255,255,.75) url(../images/arrow-left.png)no-repeat center center;background-size: 10px;}
    .i-appreciation .swiper-button-next {width:40px;height: 40px;background:rgba(0,0,0,.75) url(../images/arrow-right-w.png)no-repeat center center;background-size: 10px;}
    .i-appreciation .swiper-button-next:hover{width:40px;height: 40px; background:rgba(255,255,255,.75)  url(../images/arrow-right.png)no-repeat center center;background-size: 10px;}
}
@media screen and (max-width:575px){
    .i-appreciation-main:after{width:50%;}
    .i-appreciation .swiper-button-prev{width:30px;height: 30px; background:rgba(0,0,0,.75) url(../images/arrow-left-w.png)no-repeat center center;background-size:8px;}
    .i-appreciation .swiper-button-prev:hover{width:30px;height: 30px; background:rgba(255,255,255,.75) url(../images/arrow-left.png)no-repeat center center;background-size:8px;}
    .i-appreciation .swiper-button-next {width:30px;height: 30px;background:rgba(0,0,0,.75) url(../images/arrow-right-w.png)no-repeat center center;background-size: 8px;}
    .i-appreciation .swiper-button-next:hover{width:30px;height: 30px; background:rgba(255,255,255,.75)  url(../images/arrow-right.png)no-repeat center center;background-size: 8px;}
}

/** 影片分享 **/
.i-video-main{padding: 10px 15px 20px 15px;position: relative;}
.i-video-main:after{content: "";display: block;width:100%;height: 30%;background: #f2f2f2;position: absolute;top:40%;right: 0;z-index: 0;}
.i-video{max-width: 1250px; margin: 0 auto;}
.i-video .item{}
.i-video .item h4{padding:0 10px;margin: 0;position: relative;line-height: 1.6;}
.i-video .item h4 a{display: block;transform:translateY(0px);transition: all 0.5s ease 0s;}
.i-video .item h4 a:hover {transform:translateY(10px);transition: all 0.5s ease 0s;}
.i-video .item h4 .i-video-photo{background-position: center center;background-repeat: no-repeat;background-size: contain;}
.i-video .item h4 .i-video-photo img{width: 100%;}
.i-video .item h4 .i-video-font{font-size: 18px; color: #333333;font-weight: 300;padding: 0 10px;margin: 15px 0;line-height: 1.4;overflow: hidden;text-overflow: ellipsis;height: 50px;display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;}
.i-video-well{max-width: 1200px; margin: 0 auto;width: calc(100% - 30px);padding: 15px;background: #ffffff;position: relative;}
.i-video-container {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.i-video-container iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;}
button.fade_close{background: #ccad7a;font-size:20px;display: flex;align-items: center;justify-content: center; color: #ffffff;border: 0;border-radius: 50px; width: 40px; height: 40px;position: absolute;top:-10px;right:-10px;}
button.fade_close:hover{background:#000000 ;color: #ffffff;}
@media screen and (max-width:767px){
    .i-video-main{padding: 10px 15px 10px 15px;}
    .i-video-main:after{top:38%;}
    .i-video .item h4 .i-video-font{font-size: 16px; height: 44px;}
    .i-video-well{padding: 10px;}
    .i-video-container {padding-bottom: 60.25%;}
}
@media screen and (max-width:575px){
    .i-video-main:after{top:36%;}
    .i-video-container {padding-bottom: 64.25%;}
}


/** 內頁banner **/
.inside-banner-main{overflow: hidden;}
.inside-banner{background-position: center center;background-attachment: fixed;background-repeat: no-repeat; background-size: cover; padding:200px 0 100px 0;position: relative;}
.inside-banner:before{content: "";display: block;width: 100%;height:240px;background: url("../images/edm-before.png")repeat-x center top;background-size: contain; position: absolute;top: 0;left: 0;z-index: 0;}
.inside-banner .banner-title{max-width:1250px; font-size:30px; color:#ffffff; margin:0 auto; padding:0;line-height: 1.6;text-shadow: 1px 1px 12px rgba(0,0,0,.6);position: relative;z-index: 1;}
.slogan{font-size:42px; color:#ffffff;padding: 5px 15px;font-weight: 700;font-style: italic;letter-spacing: 6px;}
.slogan:after{content: "";display: block;width: 100px; height: 1px; background: #ffffff;margin: 5px 0 0 0;}
.main-title{font-size:30px; color:#ffffff;padding: 5px 15px;letter-spacing: 2px;display: flex;align-items: center;margin: 0;line-height: 1.6;font-weight: 400;}
.main-title span{font-size:14px;background:#ccad7a;color: #ffffff; display:inline-block;padding: 2px 15px;margin: 3px 0 0 10px;border-radius: 3px;text-shadow: 1px 1px 16px rgba(0,0,0,0);}
@media screen and (max-width:900px){
    .inside-banner{ padding:200px 0 50px 0;}
    .inside-banner:before{height:180px;}
    .slogan{font-size:36px; letter-spacing: 4px;}
    .main-title{font-size:24px; }
    .main-title span{font-size:12px;}
}
@media screen and (max-width:767px){
    .inside-banner{ padding:70px 0 20px 0;background-position: center top;background-attachment:inherit;}
    .inside-banner:before{height:150px;}
    .slogan{font-size:30px;}
}

/** 內頁架構 **/
.content-body{max-width:1250px; margin:0 auto; background:#ffffff; padding:20px 0;}
.page-title{font-size:32px; color:#333; padding:12px 0; margin:10px 0 10px 0;font-weight: 700;letter-spacing: 4.5px;line-height: 1.4;position: relative;z-index: 1;}
.page-title:before{content: "";display: block;width:70px; height:4px; background: #ccad7a;position: absolute;top: 0px;left:0px;z-index: -1;}
.page-main{padding:0; font-size:16px; color:#333;}
@media screen and (max-width:575px){
    .page-title{font-size:26px;padding:5px 0;}
    .page-title:before{width:60px; height:3px;}
}

/** 左邊分類 **/
.left-menu-title{background:#e9ecef; text-align:center; font-size:18px; font-weight:bold; padding:8px 0; border-radius:5px 5px 0 0; margin-bottom:3px; border-bottom:2px solid #6d6d6d; color:#525252;}
.in-left-menu-main{padding: 0 15px;background: #f2f2f2;}
.in-left-menu{}
.in-left-menu>ul{margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;justify-content: flex-end;}
.in-left-menu>ul>li{width: auto;min-width: 140px;text-align: center; font-size:16px; color:#333333; padding:0;margin: 0;font-weight: 300;position: relative;}
.in-left-menu>ul>li:after{content: "│";display: inline-block;position: absolute;top: 9px;right: -7.5px;}
.in-left-menu>ul>li:last-of-type:after{content: "";display:none;}
.in-left-menu>ul>li>a{color:#333;  display:block; padding:10px 10px; }
.in-left-menu>ul>li>a:hover{background: #ccad7a;color: #ffffff;position: relative;}
.in-left-menu>ul>li>.current{position: relative;color:  #ccad7a;}
.in-left-menu>ul>li>.current:before{content: "";display: block;background: #ccad7a;width:100%;height: 1px;position: absolute;bottom: 0;left: 0;}
.in-left-menu>ul>li>.current:after{content: "";display: block;background: #ccad7a;width:40%;height: 3px;position: absolute;bottom: -1px;left:calc(50% - 20%);}
.in-left-menu>ul>li>.current:hover{background:none; color:  #ccad7a;}
.in-left-menu>ul>li ul{margin:5px 0 0 30px; padding:0; list-style:square;}
.in-left-menu>ul>li ul li{border-top:1px #CCC dotted; padding:5px 5px 5px 0;}
.in-left-menu>ul>li ul li a{font-size:13px; color:#666; display:block;}
.in-left-menu>ul>li ul li a:hover{color:#71743D;}
.left-beautify img{width:100%; height:auto; margin-top:0px;}
.m_classLink{display:none;}
@media screen and (max-width:900px){
	.classBox{padding:15px 0;}
	ul.classLink{display:none;}
	.m_classLink{display:block; position:relative; background-color:#ffffff; border:1px solid #ccad7a;}
	.m_classLink a.main{display:block; background:none; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif; color:#333; position:relative; padding:8px;}
	.m_classLink a.main i{display:block; font-size:15px; background:#ccad7a; width:45px; height:100%; text-align:center; color:#FFF; line-height:40px; position:absolute; right:0; top:0;}
	.m_classLink a.main b{font-weight: 400;}
	.m_classLink ul{display:none; margin:0; padding:0; list-style:none; width:100%; background:#FFF; border:1px solid #ccad7a; position:absolute; left:0; top:100%; z-index:99; box-sizing:border-box;}
	.m_classLink ul li{margin:0; padding:0;}
	.m_classLink ul li a{display:block; padding:8px; border-top:1px solid #ccad7a; font-family:"Microsoft JhengHei", "新細明體", sans-serif; font-size:15px; color:#222;}
	.m_classLink ul li:first-child a{border:none;}
	.m_classLink ul li a:hover{background:#ccad7a;color: #ffffff;}
	.m_classLink ul li ul{display:block; margin:0 10px 10px 10px; padding:0; list-style:none; width:calc(100% - 20px); background:#FFF; border:1px solid #ccad7a; position:inherit; left:inherit; top:inherit; z-index:999; box-sizing:border-box;}
	.left-menu-title{display:none;}
	.left-beautify{display:none;}
}

/** 最新消息 **/
.news{}
.news ul{margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;}
.news ul li{width: 100%;margin:15px 0; padding: 0;}
.news ul li a{color:#333; display:flex; padding:0;}
.news ul li:nth-child(even) a{flex-direction: row-reverse;}
.news ul li a:hover{}
.news ul li .news-photo-main{flex: 1;padding:0;position: relative;}
.news ul li .news-photo{width: 100%; background-color: #f2f2f2; background-position: center center;background-repeat: no-repeat;background-size: cover;transform:scale(1);transition: all 0.8s ease 0s;}
.news ul li .news-photo img{width: 100%;}
.news ul li .news-photo-main:after{content: "";display: block;width:calc(100% - 0px);height:calc(100% - 0px);border: 1px #ccad7a solid;position: absolute;top:10px;left:10px;transition: all 0.8s ease 0s;}
.news ul li .news-information{width: 100%; padding:0 0 15px 0;flex: 1.5;margin: 5% 0 0 -5%;background: rgba(250,250,250,.9);position: relative;height: 100%;}
.news ul li .news-information h3{width: 100%; font-size: 20px; color: #000000;font-weight:500;padding: 0 15px;margin: 15px 0 15px 0;line-height: 1.4;overflow: hidden;text-overflow: ellipsis;height:28px;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.news ul li .news-information .news-date{font-size: 12px; color: #ffffff;margin:0 0 10px 0;padding: 5px 15px;display: table;text-transform: uppercase;background: #ccad7a;}
.news ul li .news-information .news-content{padding:0 15px; font-size: 16px; color: #666666;overflow: hidden;text-overflow: ellipsis;height:75px;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;width: 100%; }
.news ul li:hover .news-information{box-shadow: 4px 4px 0 0 rgba(0,0,0,.2);}
.news ul li:hover .news-photo{transform:scale(1.05);transition: all 0.8s ease 0s;}
.news ul li:hover .news-photo-main:after{content: "";display: block;width:calc(105% - 0px);height:calc(105% - 0px);border: 1px #ccad7a solid;position: absolute;top:0px;left:0px;transition: all 0.8s ease 0s;}
.news ul li:nth-child(even) .news-photo-main:after{left:inherit;right: 10px;}
.news ul li:nth-child(even) .news-information{margin: 5% -5% 0 0;display: flex;flex-wrap: wrap;justify-content: flex-end;}
.news ul li:nth-child(even) .news-information h3{text-align: right;}
.news ul li:nth-child(even) .news-information .news-content{text-align: right;}
.news ul li:nth-child(even):hover .news-photo-main:after{left:inherit;right: 0;}
.news ul li:nth-child(even):hover .news-information{box-shadow: -4px 4px 0 0 rgba(0,0,0,.2);}
.news-detail-date{color:#ffffff;font-weight: 300;font-size: 14px; padding:3px 15px; margin: 10px 0;background: #ccad7a;display: table;text-transform: uppercase;}
@media screen and (max-width:767px){
    .news ul li{width:calc(50% - 30px);margin:15px; }
	.news ul li a{display: block;position: relative;}
    .news ul li a:after{content: "";display: block;width:calc(100% - 0px);height:calc(100% - 0px);border: 1px #ccad7a solid;position: absolute;top:10px;left:10px;transition: all 0.8s ease 0s;}
    .news ul li .news-photo-main:after{display: none;}
    .news ul li .news-information{margin:0;}
    .news ul li .news-information h3{padding: 0 25px;}
    .news ul li .news-information .news-content{padding:0 25px;}
    .news ul li:nth-child(even) .news-information{margin: 0;display: block;}
    .news ul li:hover .news-photo{transform:scale(1);}
    .news ul li:hover .news-photo-main:after{display: none;}
    .news ul li:hover .news-information{background: #f2f2f2;box-shadow: 0 0 0 0 rgba(0,0,0,0);}
    .news ul li:nth-child(even):hover .news-information{box-shadow: 0 0 0 0 rgba(0,0,0,0);}
    .news ul li:nth-child(even) .news-information h3{text-align:left;}
    .news ul li:nth-child(even) .news-information .news-content{text-align:left;}
}
@media screen and (max-width:575px){
    .news ul li{width:calc(50% - 16px);margin:8px; }
    .news ul li a:after{top:5px;left:5px;}
    .news ul li .news-information h3{font-size: 16px;margin: 10px 0;padding: 0 12px;}
    .news ul li .news-information .news-date{margin: 0 auto 10px auto;padding: 3px 15px;display: block;text-align: center;}
    .news ul li .news-information .news-content{font-size: 15px;padding: 0 12px;}
}

/** 產品搜尋 **/
.search{padding:0;}
.search-input{padding:0px 0 10px 0; position:relative; color:#333;}
.search-input img{position:absolute; right:0; top:0px;}
.search input{background:#eeeeee; font-size:15px; color:#333; padding:5px 66px 5px 15px; width:100%; border:0; margin:0; vertical-align:middle; min-height:31px; font-family:"Microsoft JhengHei";}
.search img{vertical-align:middle;}
.pro-search-info{font-size:18px; color:#64691F; line-height:1.5em; border-bottom:1px #CCC dotted; margin-bottom:20px; text-align:center; padding-bottom:10px;}

/** 產品列表介紹 **/
.pro-store-info{font-size:15px; color:#666; padding:10px; margin-bottom:20px;}
.pro-list ul{margin:0 ; padding:0; list-style:none; display:flex; flex-wrap:wrap;}
.pro-list ul li{width:calc(100%/4 - 20px); margin:0 10px; padding:0px; text-align:center;}
.pro-list ul li:hover{}
.pro-list ul li .pro-case{position: relative;margin: 0 0 20px 0;overflow: hidden;}
.pro-list ul li .pro-case a{display: block;}
.pro-list ul li .pro-case .pro-photo{background-position: center center;background-repeat: no-repeat;background-size: cover;padding: 100% 0 0 0;}
.pro-list ul li .pro-case .pro-photo img{width: 100%;}
.pro-list ul li .pro-case .pro-photo02{background-position: center center;background-repeat: no-repeat;background-size: cover;padding:calc(200% + 20px) 0 0 0;}
.pro-list ul li .pro-case .pro-photo02 img{width: 100%;}
.pro-list ul li .pro-case a h4{font-size:18px; color:#ffffff;line-height: 1.6; padding:5px 15px;background:rgba(0,0,0,.8); margin:0;position: absolute;bottom: 0;left: 0;width: 100%;height: auto; font-weight: 500;transition: all 0.8s ease 0s;}
.pro-list ul li .pro-case:hover h4{color: #ccad7a; width: 100%; height: 100%;padding: 15px 15px 50px 15px; writing-mode:tb-lr; -ms-writing-mode:tb-lr; -webkit-writing-mode:vertical-lr; -moz-writing-mode:vertical-lr; -ms-writing-mode:vertical-lr; writing-mode:vertical-lr;display: flex;align-items:center;justify-content:flex-end;transition: all 0.8s ease 0s;letter-spacing: 4px;}
.pro-list ul li .pro-case:hover h4:after{content: "";display: block;width: 1px;height: 40px;background: #ccad7a; position: absolute;bottom: 0;left: calc(50% - 0.5px);}
@media screen and (max-width:900px){
    .pro-list ul li{width:calc(100%/2 - 20px);}
}
@media screen and (max-width:575px){
    .pro-list ul li{width:calc(100%/1 - 0px);margin:0;}
    .pro-list ul li .pro-case .pro-photo02{padding: 100% 0 0 0;}
}

/** 產品明細 **/
.pro-detaile-title{font-size:24px; color:#333; padding:5px; margin:0 0 10px 0; font-weight:normal;}
.pro-detaile-box{display:flex; flex-wrap:wrap; margin:0 0 20px 0;position: relative;padding: 5% 0 5% 0;z-index: 1;}
.pro-detaile-box:before{content: "";display: block;width: 180%;height: 50%;background: #f2f2f2; position: absolute;bottom:0%;left: 20%;z-index: -1;}
.pro-detaile-box:after{content: "";display: block;width: 90%;height: 90%;border: 1px #f2f2f2 solid;position: absolute;bottom:10%;left: 10%;z-index: -1;}
.pro-detaile-photo-box{width:calc(50% - 25px); margin:0 25px 0 0;}
.pro-detaile-spe-box{width:50%; position:relative; padding:5%;}
.pro-detaile .pro-photo-box{background:#fff; width:100%; margin:0; padding:0;}
.pro-detaile .pro-photo-box img{width:100%; height:auto;}
.pro-list-time{background:url(../images/time.png) left center no-repeat; font-size:12px; color:#968c69; padding-left:20px;}
.pro-specification{font-size:16px; color:#333; position:relative;}
.cart-info{position:absolute; width:100%; bottom:0;}
.cart-info .price{font-size:22px; font-weight:bold; color:#F00; vertical-align:middle; display:block; text-align:right;}
.cart-info .price.origin{font-size:smaller; color:#666; text-decoration:line-through;}
.cart-info .price.special{font-size:smaller; color:#000;}
h3.pro-introduce{background:#999; font-weight:normal; border-left:5px #111111 solid; padding:8px 10px; font-size:20px; color:#fff; margin:25px 0 15px 0;}
.pro-content{padding:0px 0; font-size:16px; color:#333; clear:both;position: relative;z-index: 1;}
.pro-banner-main{width: 100%; height: 780px;overflow: hidden;}
.pro-banner{background-position: center center;background-repeat: no-repeat;background-size: cover;height: 780px;transform:scale(1);}
.pro-banner:before{content: "";display: block;width: 100%;height:352px;background: url("../images/edm-before.png")repeat-x center top;background-size: contain; position: absolute;top: 0;left: 0;z-index: 2;}
@keyframes pro-banner
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
@-moz-keyframes pro-banner /* Firefox */
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
@-webkit-keyframes pro-banner /* Safari 和 Chrome */
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
@-o-keyframes pro-banner /* Opera */
{
0% {transform:scale(1.2);}
100%{transform:scale(1);}
}
.pro-banner{
animation: pro-banner linear 5s 1;
-moz-animation: pro-banner linear 5s 1;	/* Firefox */
-webkit-animation: pro-banner linear 5s 1;	/* Safari 和 Chrome */
-o-animation: pro-banner linear 5s 1;	/* Opera */
}
@media screen and (max-width:767px){
	.pro-detaile-box{display:block;padding: 0;}
	.pro-detaile-photo-box{width:100%; margin:0 0 15px 0;}
	.pro-detaile-spe-box{width:100%;padding: 0;}
	.cart-info{position:inherit; bottom:inherit;}
    .pro-detaile-box:before{display:none;}
    .pro-detaile-box:after{display:none;}
    .pro-banner-main{ height: 660px;}
    .pro-banner{height: 660px;}
    .pro-banner:before{display: none;}
}
@media screen and (max-width:575px){
    .pro-banner-main{ height: 400px;}
    .pro-banner{height: 400px;}
}

/** 產品明細圖片特效 **/
.pro-photo-box .item{}
.pro-photo-box .item h4{padding: 0;margin: 0;position: relative;line-height: 1.6;}
.pro-photo-box .item h4 .pro-b-photo{background-color: #f2f2f2; background-position: center center;background-repeat: no-repeat;background-size: contain;}
.pro-photo-box .item h4 .pro-b-photo img{width: 100%;}

/** 建物資料 **/
.build-case{position: relative;margin: 25px 0 0 0;}
.build-case ul{list-style: none;padding: 0;margin: 0;}
.build-case ul li{padding: 0;margin:0 0 25px 0;display: flex;}
.build-case ul li:last-of-type{margin:0 ;}
.build-case ul li .build-case-icon{width: 50px;}
.build-case ul li .build-case-content{flex: 1;margin: 0 0 0 20px;font-size: 16px;}
.build-case ul li .build-case-content span{display: block;color: #ccad7a;font-size: 17px;font-weight: 400;}
.build-case ul li .build-case-content span.build-case-content-note{display:inline-block;color: #333333;font-size: 14px;font-weight: 300;}
.sell-out{position: absolute;bottom:-20px;right: 0;width: 80%;height: 80%;transform: rotateZ(-15deg);z-index: -1;}
@media screen and (max-width:767px){
    .build-case{margin: 0;}
    .build-case ul li{margin:25px 0;}
    .build-case ul li:last-of-type{margin:25px 0 ;}
    .sell-out{bottom:inherit;top: 0; width: 40%;height: 40%;}
}
@media screen and (max-width:575px){
    .build-case ul li .build-case-icon{width:40px;}
    .sell-out{bottom:inherit;top: 0; width: 50%;height: 50%;}
}

/** 聯絡我們 **/
.contact-main{}
.contact-information{}
.contact-information ul{list-style: none;padding: 0;margin: 0;}
.contact-information ul li{padding:5px 0;margin: 0;color: #333333;display: flex;align-items: center;}
.contact-information ul li .contact-icon{padding:0 10px 0 0;font-size: 24px;width: 40px;height: 30px; display: flex;align-items: center;justify-content: center;}
.contact-information ul li .contact-content{flex: 1;padding: 2.5px 0;}
.contact-information a{color: #333333;}
.contact-information a:hover{text-decoration: underline;}
.contact-body{}
.contact-note{padding:10px 0; font-weight:bold; font-size:15px; color:#900;}
.googlemap {position: relative;padding-bottom: 72.1%;padding-top: 30px;height: 0;overflow: hidden;margin: 10px 0 0 0;}
.googlemap iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;}
@media screen and (max-width:767px){
	.googlemap {padding-bottom:50%;}
}
@media screen and (max-width:575px){
	.googlemap {padding-bottom:60%;}
}

/** 表單欄位 **/
label{margin-bottom: 0;min-width: 80px;}
.form-box input, .form-box img{vertical-align:middle;}
.opinion-main{display:flex; flex-wrap:wrap;}
.opinion{display:block; margin:5px; overflow:hidden;flex: 1;position: relative;}
.opinion-left01{width:100%;padding:5px 0; font-weight:300; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif; color:#333333; line-height:1.8; display:flex; align-items:center;}
.input-main-style01{flex:1; width:100%; border:1px #cccccc solid;background: #f2f2f2; margin:0; padding:5px 15px; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif;color:#333; line-height:1.8; min-height:40px;font-weight:300; }
.input-main-style02{border:1px #cccccc solid;background: #f2f2f2; flex:1; width:100%; margin:0; padding:5px 15px; font-size:16px;font-family:'Exo 2', 'Noto Sans TC', sans-serif; color:#333; line-height:1.8; min-height:40px;font-weight:300; }
.input-main-style03{background:#f4f8fb; flex:1; width:100%; border:0; margin:5px 0 0 0; padding:5px 15px; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif; color:#333; line-height:1.8; min-height:40px;}
.input-main-select{background:none; flex:1; width:100%; border:0; margin:0; padding:5px; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif; color:#333; line-height:1.8; display:flex; flex-wrap:wrap;font-weight:300; }
.input-main-select select{background:#f4f8fb; width:calc(50% - 2.5px); margin-right:5px; padding:5px 15px; line-height:1.8; border:0; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif;color:#333; min-height:40px;font-weight:300; }
.input-main-select select:nth-child(2){margin-right:0;}
.select-style{background:#8a6e0c; font-size:16px; color:#ffffff; line-height:20px; padding:5px 10px; border:0;font-weight:300; }
.input-style01{background:#f4f8fb; flex:1; width:100%; border:0; margin:0; padding:5px 15px; font-size:16px; font-family:'Exo 2', 'Noto Sans TC', sans-serif; color:#333; line-height:1.8; min-height:40px;font-weight:300; }
input:disabled{background-color:#fff; color:#2d7fb9; cursor:no-drop;}
.btn.openlink{margin:3px 0; padding:0 10px; text-align:center; font-size:16px; line-height:1.5; font-weight:300; background-color:#2d7fb9; color:#fff; border-radius:5px;}
.btn.openlink:hover{background-color:#ffbe00;}
img.code{width:100px; height:40px; margin:0; vertical-align:middle; display:inline-block;position: absolute;bottom: 0;right: 0;}
.input-main-style01:focus, .input-main-style02:focus{background: #ffffff;border: 1px #ccad7a solid;}
@media screen and (max-width:575px){
	.opinion-main{display:block; }
    .opinion{width: 100%;margin: 5px 0;;}
}

/** 按鈕 **/
.cart-btn{padding:0; text-align:center; margin-top:20px; display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; }
.cart-btn i{padding:0 10px 0 0;font-size: 20px;}
.btn-send{font-size:16px;}
a.btn-send{padding:8px 20px; text-align:center; font-size:16px; font-weight:400; color:#ffffff; min-width:100px; margin:5px; border-radius:0px;background: #ccad7a;}
a.btn-send:hover{background:#333333;}
a.btn-reset{background:#666666; padding:8px 20px; text-align:center; font-size:16px; color:#ffffff; font-weight:400; min-width:100px; margin:5px; border-radius:0px;}
a.btn-reset:hover{background:#999999; color:#fff; }
a.btn-send-over{background:#7ea2c5; padding:8px 20px; text-align:center; font-size:16px; color:#fff; min-width:100px; margin:5px; border-radius:0px; border:2px solid #7ea2c5;}
a.btn-send-over:hover{background:#96b9dc; border:2px solid #96b9dc;}
@media screen and (max-width:575px){
	a.btn-send{padding:8px 10px; width:calc(50% - 5px);margin: 5px 0 5px 5px;}
	a.btn-reset{padding:8px 10px; width:calc(50% - 5px);margin: 5px 5px 5px 0;}
	a.btn-send-over{padding:8px 10px; width:calc(50% - 10px);}
}

/** 頁次 **/
.page{font:14px/2.4 "Microsoft JhengHei"; color:#333; text-align:center; clear:both; margin:15px 0 0 0;}
.page a{background:#333333; color:#fff; padding:4px 10px;}
.page a:hover{background:#ccad7a; color:#fff;}
.page br{display:none;}
@media screen and (max-width:767px){
	.page br{display:block;}
}

/** 下版 **/
footer{background:#272727;padding:20px 15px;}
footer .footer{max-width:1250px; margin:0 auto;display: flex;}
footer .footer a{color: #ffffff;}
footer .footer a:hover{color: #ccad7a;}
footer .footer .footer-logo{width: 75px;padding: 13px 0;}
footer .footer .footer-logo img{width: 100%;}
footer .footer .footer-information{flex: 1;font-size: 15px ;color: #ffffff;font-weight: 300;letter-spacing: 2px;}
footer .footer .footer-information .footer-menu{width: 100%;padding: 0 0 0 30px;}
footer .footer .footer-information .footer-menu ul{list-style: none;padding: 0;margin: 0;display: flex;justify-content: flex-start;}
footer .footer .footer-information .footer-menu ul li{width: auto;padding: 0;margin: 0;}
footer .footer .footer-information .footer-menu ul li a{display: block;padding: 10px 25px;color: #ffffff;}
footer .footer .footer-information .footer-menu ul li a:hover{color: #ccad7a;}
footer .footer .footer-information .footer-content{display: flex;align-items: flex-end; width: 100%;padding: 0 0 0 55px;}
footer .footer .footer-information .footer-content .footer-contact{flex: 1;}
footer .footer .footer-information .footer-content .footer-contact span{padding: 0 15px 0 0;display: inline-block;}
footer .footer .footer-information .footer-content .copyright{flex: 1;font-size: 12px; color: #ffffff;letter-spacing: 1px;text-align: right;}
footer .footer .footer-information .footer-content .copyright span{padding: 0 0 0 15px;display: inline-block;}
@media screen and (max-width:850px){
    footer .footer{align-items: center;}
    footer .footer .footer-information .footer-menu{padding: 0 0 0 10px;}
    footer .footer .footer-information .footer-content{display: block;padding: 0 0 0 35px;}
    footer .footer .footer-information .footer-content .footer-contact{flex:initial;width: 100%;}
    footer .footer .footer-information .footer-content .copyright{flex:initial;width: 100%;text-align: left;margin: 3px 0 0 0 ;}
}
@media screen and (max-width:767px){
    footer .footer .footer-information .footer-menu ul li a{padding: 10px 15px;}
    footer .footer .footer-information .footer-content{padding: 0 0 0 25px;}
}
@media screen and (max-width:650px){
    footer .footer{display:block;}
    footer .footer .footer-logo{width: 75px;padding:0;margin: 0 auto 6px auto;}
    footer .footer .footer-information{flex:initial;width: 100%;}
    footer .footer .footer-information .footer-menu{padding: 0;}
    footer .footer .footer-information .footer-menu ul{justify-content:center;}
    footer .footer .footer-information .footer-menu ul li{text-align: center;}
    footer .footer .footer-information .footer-content{padding: 0;text-align: center;}
    footer .footer .footer-information .footer-content .footer-contact span{padding: 0 8px;}
    footer .footer .footer-information .footer-content .copyright{text-align: center;margin: 5px 0 0 0 ;}
    footer .footer .footer-information .footer-content .copyright span{padding: 0;display: block;width: 100%;}
}
@media screen and (max-width:575px){
    footer .footer .footer-information .footer-menu ul li a{padding: 10px 10px;}
}
@media screen and (max-width:500px){
    footer .footer .footer-information .footer-menu {margin: 0 0 6px 0;}
    footer .footer .footer-information .footer-menu ul{flex-flow: wrap;}
    footer .footer .footer-information .footer-menu ul li{width: calc(100%/3);}
    footer .footer .footer-information .footer-menu ul li a{padding:2px 10px; }
}
/** top **/
#scrollUp {background-image: url("../images/top.png");bottom: 55px;right: 0px;width: 34px;height: 86px;}
@media screen and (max-width:650px){
    #scrollUp {background-image: url("../images/top.png");background-size:30px; bottom: 180px;right: 0px;width: 30px;height: 76px;}
}
@media screen and (max-width:500px){
    #scrollUp {background-image: url("../images/top.png");background-size:30px; bottom: 198px;right: 0px;width: 30px;height: 76px;}
}