@charset "utf-8";
@import "font-awesome.min.css";

body { background:#fff; width:100%; height:auto; margin:0; padding:0; font-family:"微軟正黑體"; font-size: 16px; line-height: 1.6;}
html { width:100%; height:auto;}

.warpper {}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}/* End hide from IE-mac */
a { text-decoration:none;transition: all 0.3s ease 0s;}
img { border:0; vertical-align:middle;max-width: 100%;}
input { vertical-align:middle;}
.slicknav_menu {display:none;}
input.select-box { border:1px #CBCBCB solid; padding:5px 3%; width:20px; height:20px; text-align:center; margin-bottom:5px; }


/*** padding and border no width ****/
*{
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
}


/***** 表單預設文字顏色設定 *****/
/* 通用 */
::-webkit-input-placeholder { color:#888888; }
::-moz-placeholder { color:#888888; } /* firefox 19+ */
:-ms-input-placeholder { color:#888888; } /* ie */
input:-moz-placeholder { color:#888888; }

/* webkit专用 */
#field2::-webkit-input-placeholder { color:#888888; }
#field3::-webkit-input-placeholder { color:#888888; background:lightgreen; text-transform:uppercase; }
#field4::-webkit-input-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#888888; }

/* mozilla专用 */
#field2::-moz-placeholder { color:#888888; }
#field3::-moz-placeholder { color:#888888; background:lightgreen; text-transform:uppercase; }
#field4::-moz-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#888888; }


/*** 手機選單、選單 色塊-變色  ***/
.b-color, .slicknav_menu { } /** 選單顏色 ***/
.slicknav_icon-bar { background-color: #36183d;} /** 手機選單ICON按鈕色 ***/
.slicknav_btn { } /** 手機選單ICON按鈕底色 ***/

.b-color>li:hover, .b-color>li>ul>li>a:hover, .slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover {  background: #36183d;color: #fff; } /** 選單滑入顏色 ***/
.slicknav_nav>li { border-bottom:1px #36183d dotted;} 
.border-color { border-left:7px #A0A0A0 solid;} /** 標題顏色 ***/


header {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e1e1e1+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(225,225,225,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(225,225,225,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(225,225,225,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e1e1e1',GradientType=0 ); /* IE6-9 */ border-bottom: 4px #000 solid;}
.header{background: url(../images/head_bg.png)no-repeat bottom right;padding: 0 10px;}
.head-main { max-width:1140px; margin:0 auto; height:122px;padding:0; position:relative; }

.head-main .logo { position:absolute; left:0px; top:14px; width:368px; height:auto;}
.head-main .logo a { color:#000000;}
.head-main .logo img { width:100%; height:auto;}
.home { display: block; position:absolute; top:-35px; right:0px; width:25px; height:auto;}
.home_w { display:none;}

.banner { background: #ffffff; position: relative; }
.banner img { vertical-align:middle; width:100%; height:auto; position:absolute;}
@media screen and (max-width:1100px){
.head-main .logo { width:300px;}
.head-main { height:106px;}
}
@media screen and (max-width:1000px){
.head-main .logo { width:250px;}
.head-main { height:92px;}
}
@media screen and (max-width:900px){
.head-main .logo { width:250px;position: inherit;top: inherit; left: inherit;margin: 0 auto;padding:8px 5px ;}
.head-main { height:122px;}
}
@media screen and (max-width:640px){
header {border-bottom:0 #000 solid;}
.head-main {position: inherit;height: 0;}
.head-main .logo { position:fixed; left:5px; top:5px; width:146px; height:auto;padding: 0;z-index: 1000;}
	.banner {padding: 51.38px 0 0 0;}
}
/***  選單與下拉  ***/
nav {margin: 0 0 0 400px;padding: 44px 0 0 0; }
 .menu { padding:0; list-style:none; position:relative;  margin: 0;display: flex;justify-content: flex-end;}
 .menu>li { color:#000000; font-size:18px; text-align:center; position:relative; cursor:pointer;}
 .menu>li>a { color:#000000; display:block;padding:3px 12px;border-radius: 5px;transition: all .1s ease 0s;}  
 .menu>li>a:hover {color: #fff;border-radius: 50px;transition: all .1s ease 0s;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ab579e+0,36183d+100 */
background: rgb(171,87,158); /* Old browsers */
background: -moz-linear-gradient(top, rgba(171,87,158,1) 0%, rgba(54,24,61,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(171,87,158,1) 0%,rgba(54,24,61,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(171,87,158,1) 0%,rgba(54,24,61,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ab579e', endColorstr='#36183d',GradientType=0 ); /* IE6-9 */}

 .menu>li.sub>ul.sub-menu { background:rgba(0,0,0,0.5); display: none; position:static; z-index:999; margin:0; padding:0; -webkit-border-radius:  0 0 5px 5px; -moz-border-radius:  0 0 5px 5px;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:hover li { display:block;}
 .menu>li.sub>ul.sub-menu>li>a { display:block; color:#fff;}
 .menu>li.sub>ul.sub-menu>li>a:hover { background: #000000;}
 
@media screen and (max-width:1100px){
nav {margin: 0 0 0 300px;padding: 36px 0 0 0;}
}
@media screen and (max-width:1000px){
nav {margin: 0 0 0 260px;padding: 32px 0 0 0;}
.menu>li>a {padding:3px 5px;}
}
@media screen and (max-width:900px){
nav {margin: 0 ;padding:4px 0 0 0;}
.menu {justify-content:center;}
.menu>li>a {padding:3px 10px;}
}
@media screen and (max-width:700px){
.menu>li>a {padding:3px 8px;}
}
@media screen and (max-width: 640px) {
	.slicknav_menu { display:none;}
	.js #menu {	display:none;}
	.js .slicknav_menu {display:block;background:#fff url(../images/head_bg.png)no-repeat bottom right;background-size:cover;position: fixed;width: 100%; z-index: 1000;border-bottom: 4px #000 solid;}
} 

/** 關於 **/
.about{font-size: 22px;color:#333;text-align: center;line-height: 1.8; padding:8% 0;}
.about-font{font-size: 26px;color:#fff;display:block;max-width: 430px;width: 100%; margin:10px auto;border-radius: 5px;padding: 2px 20px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ab579e+0,36183d+100 */
background: rgb(171,87,158); /* Old browsers */
background: -moz-linear-gradient(top, rgba(171,87,158,1) 0%, rgba(54,24,61,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(171,87,158,1) 0%,rgba(54,24,61,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(171,87,158,1) 0%,rgba(54,24,61,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ab579e', endColorstr='#36183d',GradientType=0 ); /* IE6-9 */}
@media screen and (max-width:640px){
.about{font-size:18px;padding:2% 0;}
	.about-font{font-size: 22px;}
}

/** 專業團隊 **/
.team {}
.team ul { padding:0; list-style:none;display: flex;flex-wrap: wrap;margin: 0;}
.team ul li {  width:100%; margin:8px 0;padding: 0;  }
.team ul li a{display: flex;padding:10px;margin: 0 3px 0 0; border: 1px #6f6571 solid;box-shadow: 3px 3px 0 0 #6f6571;}
.team ul li a:hover { background:rgba(171,87,158,.1);border: 1px #36183d solid;box-shadow: 3px 3px 0 0 #36183d;}
.team ul li .team-information { font-size:16px; color:#333;flex: 1;margin: 0 0 0 15px;}
.team ul li .team-information h4 { font-size:20px; color:#36183d;font-weight:bold; padding:0; margin:5px 0 10px 0; }
.team ul li .team-information .substandard { font-size:16px; color:#fff;background: #ab579e;display: table;padding:2px 15px;margin:0 0 15px 0 ;border-radius: 5px;}
.team ul li .team-information .team-content { font-size:16px; color:#333;height: 150px;overflow: hidden; }
.team-photo { width:250px; position: relative;height: 100%; display: flex;align-items: center;justify-content: center;}
.team-photo img.index-pro-img { width: auto; height: auto; flex-shrink:0; border:10px solid #fff; border-radius:500px;}
.team-detail{font-size:16px; color: #333;}
.team-detail h3.team-title{font-size:18px; color: #fff;padding: 4px 15px;margin: 20px 0 8px 0; font-weight: normal;background: #623b66; display: table;border-radius: 5px 0 0 5px;border-left: 5px #0d000e solid;position: relative;}
.team-detail h3.team-title:after{content: "";display:block;position: absolute;right:-15px;top: 0;width: 0;
height: 0;
border-style: solid;
border-width: 18px 0 18px 15px;
border-color: transparent transparent transparent #623b66;
}
.team-detail-img{float:left; width:45%; margin:20px 3% 20px 0; padding:10px; box-shadow:0 0 0 1px #cc6fbd; border-radius:500px;}
@media (max-width:640px){
	.team-detail-img{width:100%; margin-right:0;}
	.in-left-menu{display:none;}
}

.team-detail ol{display:inline-block; margin:0 0 0 35px; padding:0; list-style:decimal-leading-zero;}
.team-detail ol.top{max-width:calc(55% - 55px);}
@media screen and (max-width:640px){
	.team-detail ol.top{max-width:100%;}
}

.team-detail ol li{ padding:5px 0;margin: 0 ;}
@media screen and (max-width:640px){
.team ul li a{display:block;}
.team ul li .team-information {width: 100%;margin: 0;}
.team ul li .team-information .team-content { height:auto;}
.team-photo {width: auto;max-width: 250px; margin: 0 auto;}
}
/** 著作 **/
.book{margin: 20px 0;}
.book ul{list-style: none;padding: 0;margin: 0;}
.book ul li{padding:8px 5px;margin: 0;display: flex;color: #333;border-bottom: 1px #857283 dotted;}
.book ul li:first-of-type{font-weight: bold;background: #240021;color: #fff;text-align: center;border-bottom:0;padding:5px;}
.book ul li .numbering{width: 60px; display: flex; font-size: 16px;padding: 0 5px;text-align: center;justify-content: center;}
.book ul li .name{flex: 2;display: flex;font-size: 16px;padding: 0 5px;}
.book ul li .premises{flex: 1;display: flex;font-size: 16px;padding: 0 5px;text-align: center;justify-content: center;}
.book ul li .years{width: 120px; display: flex;font-size: 16px;padding: 0 5px;text-align: center;justify-content: center;}
.book ul li .book-title{display: none;}
.book ul li .book-content{flex: 1; font-size: 16px;color: #333;}
.book ul li:first-of-type .name{justify-content: center;}
@media screen and (max-width:750px){
.book ul li{display: block;}
.book ul li .numbering{width:100%;margin: 5px 0;}
.book ul li .name{width:100%;margin: 5px 0;}
.book ul li .premises{width:100%;margin: 5px 0;}
.book ul li .years{width:100%;margin: 5px 0;}
.book ul li .book-title{width: 110px; font-size: 16px;color: #fff;font-weight: bold;display: flex;align-items: center;justify-content: center; text-align: center;background: #240021;padding: 2px 15px;margin: 0 10px 0 0;}
	.book ul li:first-of-type{display:  none;}
	.book ul li .book-content{text-align: left;display: flex;align-items: center;}
}

/** 專業服務 **/
.service{font-size: 16px; color: #333;}
.service ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;border: 1px #36183d solid;}
.service ul li{padding: 0;margin: 0;width:100%;display: flex;border-bottom: 1px #36183d solid;}
.service ul li:last-of-type{border-bottom: 0px #36183d solid;}
.service ul li:nth-child(even){display: flex;flex-direction: row-reverse;}
.service ul li .service-title{width:220px;min-height:220px; font-size: 40px; color:#36183d; text-shadow:0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff; text-align: center;line-height: 1.2;padding: 5px 10px;display: flex;align-items: center;justify-content: center; background-size:cover; background-position:center center;}
.service ul li .service-content:first-letter{font-size:32px;color: #36183d;}
.service ul li .service-content{flex: 1; font-size: 16px; color: #333;padding: 10px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f2f2f2+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,242,242,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */}
@media screen and (max-width:500px){
	.service ul li{display: block;}
	.service ul li .service-title{width:100%;min-height:inherit; }
	.service ul li:nth-child(even){display: block;}
}

/** 成功案例 **/
.case {}
.case ul { margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;}
.case ul li {margin:5px; padding:10px;width: calc(50% - 10px); display: flex; }
.case ul li .case-date{width: 80px;min-width: 80px;height: 80px; margin: 0 15px 0 0; font-family: 'Ropa Sans', sans-serif;font-size: 15px ;color: #fff;text-align: center;background:#36183d;text-transform: uppercase;border-radius:5px;overflow: hidden;border: 1px #36183d solid;}
.case ul li .case-date .case-day{font-size:40px ;background: #fee9fb;line-height: 1.2;margin: 0 0 5px 0;color: #36183d;}
.case ul li .case-content {font-size: 16px ;color: #333;flex: 1;display: flex;align-items: center; }
@media screen and (max-width:640px){
.case ul li {margin:5px 0; padding:5px;width: calc(100% - 0px); }
}

/*****  最新消息  *****/
.news {}
.news ul { margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;justify-content: center;}
.news ul li {width:33.3333%; margin:5px 0; padding:0px; border-right:1px #b8acbb dashed; }
.news ul li:nth-child(3n){border-right:0; }
.news ul li:last-of-type{ border-right:0; }
.news ul li .news-date {width: 80px;min-width: 80px;height: 80px; margin: 0 auto; font-family: 'Ropa Sans', sans-serif;font-size: 15px ;color: #fff;text-align: center;background:#36183d;text-transform: uppercase;border-radius:50%;border:1px #36183d solid;line-height: 1;}
.news ul li .news-date:after{content: "";display: block;margin:10px auto 0 auto;width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #36183d transparent transparent transparent;}
.news ul li .news-date .news-day{font-size:40px ;line-height: 1;margin: 0;padding:8px 0 3px 0;}
.news ul li .news-content {font-size: 16px ;color: #552c5e;margin: 15px 0 ;}
.news ul li a { color:#333; display:block;padding: 10px;}
.news ul li a:hover { background:rgba(171,87,158,.1);}

.news-detail-date {display: table;margin: 0 0 10px 0; font-family: 'Ropa Sans', sans-serif;font-size: 15px ;color: #fff;text-align: center;background:#36183d;text-transform: uppercase;border-radius:5px;padding: 2px 15px;}
@media screen and (max-width:750px){
.news ul li {width:50%;}
	.news ul li:nth-child(3n){border-right:1px #b8acbb dashed; }
	.news ul li:nth-child(2n){border-right:0; }
}
@media screen and (max-width:550px){
.news ul li {width:100%; border-right:0; border-bottom:1px #b8acbb dashed;}
.news ul li:nth-child(3n){border-right:0; }
.news ul li:nth-child(2n){border-right:0; }
}



/** 諮詢 **/
.contact{margin: 0 0 30px 0 ;}
.contact ul{list-style:none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.contact ul li{padding: 0;margin:5px;width: calc(25% - 10px);text-align: center;}
.contact ul li .contact-icon{width: 80px; height: 80px; margin: 0 auto;color: #fff;background: #36183d; border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 30px;border: 2px #fff solid; box-shadow: 0 0 0 3px #36183d;}
.contact ul li .contact-title{position:relative; font-weight:bold; font-size:16px; margin-top:5px; padding-bottom:5px; text-transform: uppercase;}
.contact ul li .contact-title:after{content:""; position:absolute; left:calc(50% - 20px); bottom:0; display:inline-block; width:40px; height:1px; background-color:#ce9ac6;}
.contact ul li .contact-content{font-size:16px; color:#333;margin:5px 0 20px;padding: 5px;}
.contact ul li .contact-content a{color:#333;}
.contact ul li .contact-content a:hover{color:#36183d;text-decoration: underline;}
.map {display: block;position: relative;height: 0;overflow: hidden;padding: 0; padding-bottom:25%;}
.map iframe {position: absolute;height: 100%;width: 100%;left: 0;top: 0;}
.contact-body { padding:0;}
.contact-note { padding:10px 0; font-size:13px; color:#F00;}
.contact-left { }
.contact-left img { width:100%; height:auto; margin-top:0px; }
.cart-btn {display: flex;justify-content: flex-end;}

.btn-send { font-size:13px;} 
a.btn-send { background: #36183d;border: 1px #ffdbf9 solid;padding: 5px 15px; text-align:center; font-size:18px; color:#fff;  margin:2px 0 2px 2px;}
a.btn-send:hover { background: #602f6c;}
a.btn-reset { background:#565656;border: 1px #fff solid;  padding: 5px 15px; text-align:center; font-size:18px; color:#fff; margin:2px 0 2px 2px;}
a.btn-reset:hover { background:#828282;}


.btn-send{background:#36183d; border:1px solid #ffdbf9; padding:5px 15px; text-align:center; font-size:18px; color:#fff; margin:2px 0 2px 2px;}
.btn-send input{background:#36183d; margin:0; padding:0; border:0; text-align:center; font-size:18px; color:#fff;}
.btn-send:hover{background:#602f6c;}
.btn-send:hover input{background:#602f6c;}
.btn-reset{background:#565656; border:1px solid #fff; padding:5px 15px; text-align:center; font-size:18px; color:#fff; margin:2px 0 2px 2px;}
.btn-reset input{background:#565656; margin:0; padding:0; border:0; text-align:center; font-size:18px; color:#fff;}
.btn-reset:hover{background:#828282;}
.btn-reset:hover input{background:#828282;}



a.btn-send-over { background: #9c9c9b; padding: 5px 15px; text-align:center; font-size:18px; color:#fff;margin:2px 0 2px 2px;}
a.btn-send-over:hover { background: #b9b9b9;}
@media screen and (max-width:850px){
.contact ul li{width: calc(50% - 10px);}
.map {padding-bottom:50%;}
}
@media screen and (max-width:480px){
.contact ul li{width: calc(100% - 0px);margin: 5px 0;}
.map {padding-bottom:80%;}
}

/*****  內頁架構  *****/
.content-body {max-width: 1140px; margin:0 auto 50px auto;padding:20px;background: rgba(255,255,255,.8);border-radius: 20px;box-shadow:0 0 20px 0 rgba(0,0,0,.5);}
.page-title { background:url(../images/page-title.png) left 5px top no-repeat; font-size:20px; color:#2f0833; padding:5px 0px 5px 50px; margin:0px 0 15px 0; border-bottom:4px #2f0833 double; }
.page-main { padding: 0; font-size: 16px; color:#333;margin:0;}
@media screen and (max-width:750px){
	.content-body {margin:0 10px 50px 10px;}	
}
.left-menu-title { background:#8c8c8c; text-align:center; font-size:18px; color: #fff; padding:5px 0 10px 0;  
                   -webkit-border-radius:0 0 5px 0px; -moz-border-radius:0 0 5px 0px; border-radius:0 0 5px 0px;}
.in-left-menu { padding: 10px; margin:0; border: 1px #6f6571 solid; box-shadow: 3px 3px 0 0 #6f6571; background-color:#fff; }
.in-left-menu>ul { margin:0; padding:1px 0 0px 0; list-style:none; }
.in-left-menu>ul>li  { font-size:15px; color:#666; padding:0;}
.in-left-menu>ul>li>b { font-size: 16px; background: #662c73; padding: 2px 15px; color:#fff;  display:block; line-height:1.5em; text-align:center; border-radius:5px;}
.in-left-menu>ul>li ul { margin:0; padding:0; list-style:none;} 
.in-left-menu>ul>li ul li { }
.in-left-menu>ul>li ul li a {display:block; font-weight:bold; font-size:16px; color:#333; padding:10px 5px; line-height:1.5em;}
.in-left-menu>ul>li ul li a:hover, .in-left-menu>ul>li ul li a.active {color:#ab579e;}

.m_classLink{display:none;}
@media screen and (max-width:640px){
.classBox{padding:0 0 20px 0;}
ul.classLink{display:none;}
.m_classLink{display:block; position:relative; background-color:#eeeeee; border:1px solid #d1d1d1;}
.m_classLink a.main{display:block; background:none; font-size:15px; font-family:"微軟正黑體", "新細明體", sans-serif; color:#333; position:relative; padding:10px;}
.m_classLink a.main i{display:block; font-size:15px; background:#afafaf; width:45px; height:100%; text-align:center; color:#FFF; line-height:40px; position:absolute; right:0; top:0;}
.m_classLink ul{display:none; margin:0; padding:0; list-style:none; width:100%; background:#FFF; border:1px solid #d1d1d1; position:absolute; left:0; top:100%; z-index:999; box-sizing:border-box;}
.m_classLink ul li{margin:0; padding:0;}
.m_classLink ul li a{display:block; padding:15px 10px; border-top:1px solid #d1d1d1; font-family:"微軟正黑體", "新細明體", sans-serif; font-size:15px; color:#222;}
.m_classLink ul li:first-child a{border:none;}
.m_classLink ul li a:hover{background:#efeded;}
.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 #d1d1d1; position:inherit; left:inherit; top:inherit; z-index:999; box-sizing:border-box;}
}


/*****  內頁BANNER  *****/
.inside-banner {  }
.inside-banner .banner-title { max-width: 1140px; margin:0 auto;font-size:32px; color:#ffffff;line-height: 1.2;padding:20px 10px;}
.inside-banner .banner-title-en {font-size:22px; color:#f3d6ef;font-family: 'Ropa Sans', sans-serif;text-transform: uppercase;font-weight:normal;display: inline-block;padding: 0 0 0 10px;}
.inside-banner .banner-title:first-letter{font-size:60px;font-weight: bold;}
.inside-banner .banner-title-en:before{ content: "";display:inline-block; width:4px;background: #f3d6ef;height: 4px;margin: 0px 15px 4px 0;}
.inside-banner .banner-title-en:after{ content: "";display:inline-block; width:180px;background: #f3d6ef;height: 4px;margin: 0px 0 4px 15px;}
@media screen and (max-width:640px){
.inside-banner {padding: 51.38px 0 0 0; }
.inside-banner .banner-title { padding:10px;text-align: center;}
	.inside-banner .banner-title-en {display: block;}
	.inside-banner .banner-title-en:after{ content: "";display:inline-block; width:4px;background: #f3d6ef;height: 4px;margin: 0px 0 4px 15px;}
}

/*****  首頁產品  *****/
.index-pro { margin:0 auto;}
.index-pro-title {font-size:24px; color:#333; line-height:30px; padding-bottom:10px; text-align:center; font-weight:normal; border-bottom:3px #DFDFDF solid;} 
.index-pro ul {  margin:0 auto; padding:0; list-style:none;}
.index-pro ul li {  width:20%; padding:1%; text-align:center; float:left;}
.index-pro ul li:hover { background:#f8f6f6;}
.index-pro ul li h4 { font-size:15px; color:#504f4d; line-height:1.5em; font-weight:normal; padding:5px 0 5px 0; margin:0; }

.index-pro ul li .index-pro-store {color:#938c83; line-height:1.5em; padding:10px 0; display:block; text-decoration: line-through; }
.index-pro ul li .index-pro-price { color:#b83400; font-size:20px; padding:0 0 10px 0; display:block; font-family:Helvetica, Arial; }


a.cart { background:#ffffff; padding:5px 8px; color:#cecece; font-size:15px; display:block; border:1px #bbbbbb solid;  width:100%; text-align: center;}
a.cart img { padding-right:0px; vertical-align:middle;}
a.cart:hover { background: #ffffff; color:#333333;}

a.check { background:#ffffff; padding:5px 8px; color:#cecece; font-size:15px; display:block; border:1px #bbbbbb solid;  width:49%; margin-left:1%; float:left;}
a.check img { padding-right:0px; vertical-align:middle;}
a.check:hover { background: #ffffff; color:#5C0001;}

.index-more { max-width:1140px;  margin:50px auto 0 auto; position:relative; }
.index-more a { background:url(../images/index-more-pro.png) #2a2a2a bottom no-repeat; color:#ffffff; width:132px; padding: 10px 0 20px 0; display:block; margin:0 auto; text-align:center; }



/*****  首頁 搜尋 最新消息模組  *****/
.i-news-main {background: url(../images/news_bg.png)no-repeat center bottom;padding: 30px 10px 0 10px;}
.i-news-main:after {content: "";display: block;background: url(../images/news-shadow.png)no-repeat bottom center;background-size: contain; width: 100%; height: 15px;margin: -15px auto 0 auto;position: relative;z-index: -2;}
.i-news {max-width: 1140px; margin: 0 auto;}
.i-news h3 { background: url(../images/news-icon.png) no-repeat center top; color:#36183d; font-weight:normal; margin:0 0 30px 0; padding:38px 0 0 0; font-size: 40px;text-align: center;text-transform: uppercase;font-family: 'Ropa Sans', sans-serif;line-height: 1;}
.i-news h3 .news-title-ch { display:block; font-size:24px; color:#ab579e;font-family:"微軟正黑體";line-height: 1.2; }

.i-news ul { list-style: none; color:#333; padding:0px; margin:0;display: flex;flex-wrap: wrap; }
.i-news ul li {width: 33.3333%;padding: 0;margin: 0;border-right: 1px #e0e0e0 solid;}
.i-news ul li:last-of-type {border-right:0;}
.i-news ul li .i-date-main{width:93px; height: 93px;background: url(../images/news-date_bg.png)no-repeat bottom -1px right 3px;margin: 0 auto;}
.i-news ul li .i-date{font-family: 'Ropa Sans', sans-serif;width: 88px; height: 88px; margin: 0 auto;color: #fff;font-size: 16px;background: #36183d; border-radius: 50px 50px 0 50px;text-align: center;line-height: 1;text-transform: uppercase;display: flex;flex-wrap: wrap; align-content: center;justify-content: center;padding: 15px;position: relative;}
.i-news ul li .i-date:after{content: "";display: block;position: absolute; bottom: 2px;right:2px;width: 0;
height: 0;
border-style: solid;
border-width: 0 0 10px 10px;
border-color: transparent transparent #f1b0ec transparent;}
.i-news ul li .i-date .i-day{font-size: 50px;line-height: 1;}
.i-news ul li h4{font-size: 18px; color: #874a82;padding: 0;margin:10px 0 5px 0;font-weight: normal;height: 56px;overflow: hidden;}
.i-news ul li .i-news-content{font-size: 15px; color: #181818;height: 72px; overflow: hidden; }
.i-news ul li a {display: block; padding: 10px 15px;}
.i-news ul li a:hover {background:rgba(240,226,238,.2);}
.news-more{display: block;width: 66px; height: 34px; margin:30px auto 0 auto;text-align: center;font-size: 18px; color: #fff;}

.news-more a{display: block;width: 66px; height: 34px;position: relative;color: #fff;padding: 5px 0 0 0;}
.news-more a:after{content: "";display: block; width: 0;
height: 0;
border-style: solid;
border-width: 0 33px 34px 33px;
border-color: transparent transparent #ab579e transparent;position: absolute;bottom: 0;left: 0;z-index: -1;
}
.news-more a:hover{}
.news-more a:hover:after{content: "";display: block; width: 0;
height: 0;
border-style: solid;
border-width: 0 33px 40px 33px;
border-color: transparent transparent #761f68 transparent;position: absolute;bottom: 0;left: 0;z-index: -1;}
@media screen and (max-width:700px){
	.i-news ul li {width:100%;border-right:0px #e0e0e0 solid;border-bottom: 1px #e0e0e0 solid;}
	.i-news ul li:last-of-type {border-bottom:0;}
	.i-news ul li a {padding: 10px 0px;}
	.i-news ul li h4{height:auto;}
}


/***  版面欄位  ***/
.main { padding-top:0px;}
.col-100 {float:left; width:100%;}
.col-010 { width:9%; margin-right:1%; float:left;}
.col-015 { width:14%; margin-right:1%; float:left;}
.col-020 { width:19%; margin-right:1%; float:left;}
.col-025 { width:250px; margin-right:25px; margin-bottom:25px; float:left;}
.col-030 { width:29%; margin-right:1%; float:left;}
.col-040 { width:39%; margin-right:1%; float:left;}
.col-045 { width:44%; margin-right:1%; float:left;}
.col-050 { width:49%; margin-right:1%; float:left;}
.col-055 { width:54%; margin-right:1%; float:left;}
.col-060 { width:59%; margin-right:1%; float:left;}
.col-065 { width:64%; margin-right:1%; float:left;}
.col-070 { width:69%; margin-right:1%; float:left;}
.col-075 { width:74%; margin-right:1%; float:left;}
.col-080 { width:79%; margin-right:1%; float:left;}
.col-085 { width:84%; margin-right:1%; float:left;}

.cor-010 { width:10%; float:left;}
.cor-015 { width:15%; float:left;}
.cor-020 { width:20%; float:left;}
.cor-025 { width:25%; float:left;}
.cor-030 { width:30%; float:left;}
.cor-035 { width:35%; float:left;}
.cor-040 { width:40%; float:left;}
.cor-045 { width:45%; float:left;}
.cor-050 { width:50%; float:left;}
.cor-055 { width:55%; float:left;}
.cor-060 { width:60%; float:left;}
.cor-065 { width:55%; float:left;}
.cor-070 { width:70%; float:left;}
.cor-075 { width:calc(100% - 275px); float:right;}
@media screen and (max-width:750px){
.col-p-100 {width:100%;}
.col-p-015 { width:13%; margin-right:2%; float:left;}
.col-p-020 { width:18%; margin-right:2%; float:left;}
.col-p-025 { width:23%; margin-right:2%; float:left;}
.col-p-030 { width:28%; margin-right:2%; float:left;}
.col-p-040 { width:38%; margin-right:2%; float:left;}
.col-p-045 { width:43%; margin-right:2%; float:left;}
.col-p-050 { width:48%; margin-right:2%; float:left;}
.col-p-055 { width:53%; margin-right:2%; float:left;}
.col-p-060 { width:58%; margin-right:2%; float:left;}
.col-p-065 { width:63%; margin-right:2%; float:left;}
.col-p-070 { width:68%; margin-right:2%; float:left;}
.col-p-075 { width:73%; margin-right:2%; float:left;}
.col-p-080 { width:78%; margin-right:2%; float:left;}
.col-p-085 { width:83%; margin-right:2%; float:left;}

.cor-p-015 { width:15%; float:left;}
.cor-p-020 { width:20%; float:left;}
.cor-p-025 { width:25%; float:left;}
.cor-p-030 { width:30%; float:left;}
.cor-p-035 { width:35%; float:left;}
.cor-p-040 { width:40%; float:left;}
.cor-p-045 { width:45%; float:left;}
.cor-p-050 { width:50%; float:left;}
.cor-p-055 { width:55%; float:left;}
.cor-p-060 { width:60%; float:left;}
.cor-p-065 { width:55%; float:left;}
.cor-p-070 { width:70%; float:left;}
.cor-p-075 { width:75%; float:left;}
}
@media screen and (max-width:640px){
.col-m  { width:100%; margin-right:0%; float:none;}
.col-100 {}
.col-015, .col-020, .col-025, .col-030, .col-035, .col-040, .col-045, .col-050, .col-055, .col-060, .col-065, .col-070, .col-075, .col-080,.col-085 { width:100%; margin-right:0%;}
.cor-015, .cor-020, .cor-025, .cor-030, .cor-035, .cor-040, .cor-045, .cor-050, .cor-055, .cor-060, .cor-065, .cor-070, .cor-075, .cor-080,.cor-085 { width:100%;}
}

/** 免費諮詢 **/
.consultation-main{background: url(../images/consultation_bg.jpg)no-repeat left top;background-size:cover;min-height: 530px;}
.consultation{max-width:1140px; margin:0 auto ;padding: 0;}
.consultation-form{margin:0 0 0 50%;background: rgba(0,0,0,.8);padding:25px 15px;}
.consultation-form h3{background: url(../images/consultation-icon.png)no-repeat top 8px left 10px;font-weight: normal;text-transform: uppercase; margin:0 0 20px 0;padding: 0 0 0 55px;font-family: 'Ropa Sans', sans-serif;font-size: 40px;color: #fff;border-bottom: 1px #fff solid;line-height: 1.2; }
.consultation-form h3 .consultation-title-ch { display:inline-block; font-size:24px; color:#fff;font-family:"微軟正黑體";line-height: 1.2;padding: 0 8px ;margin: 0;position: relative;top: -1px; }
@media screen and (max-width:1075px){
.consultation-form h3 .consultation-title-ch {font-size:20px;}
}
@media screen and (max-width:1010px){
.consultation-form h3{background: url(../images/consultation-icon.png)no-repeat top 0 center;padding:35px 0 10px 0;text-align: center;}
.consultation-form h3 .consultation-title-ch {font-size:24px;display: block;padding: 0;}
}
@media screen and (max-width:750px){
	.consultation-form{margin:0;background: rgba(0,0,0,.7);}
}
/***  表單欄位  ***/
.form-box { min-width: 280px; }
.form-box input, .form-box img { vertical-align:middle;}
.form-style01 { font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; padding:5px 0 10px 0; line-height:20px; width:100%;}

.i-opinion { margin-bottom:12px;position: relative; }
.opinion { margin-bottom:35px;position: relative; }
.opinion-left01 { background: #ab579e; position: absolute;top:-21px;left:5px; padding:2px 10px; width:220px; font-size:18px; font-family:"微軟正黑體"; color:#ffffff; line-height:1.8;border-radius: 5px;}
				  			  
.opinion-left01 b {display:inline-block; margin-left:5px; font:normal 12px/15px Arial; color:rgba(255,255,255,.5); text-transform: uppercase;}
.input-main-style01 { background:#fff; width:100%; border:1px #ce9ac6 solid; margin:0; padding:14px 59px 2px 15px;  font-size:16px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:1.8;height: 44px;}
.input-main-style02 { background:#f6eff8; width:100%; border:1px #ce9ac6 solid; margin:0; padding:5px 15px;  font-size:18px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:1.8;height: 44px;}
.input-main-style03 { background:#fff; width:100%; border:1px #ce9ac6 solid; margin:0; padding:14px 159px 2px 15px;  font-size:16px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:1.8;height: 44px;}

.input-main-select { background:#eeeeee; float:left; width:70%; border: 0; margin:0; padding:0; font-size:16px; color:#4E4E4E;line-height:1.8;}
.input-main-select select { background:#eeeeee; width: 49%;padding:5px 15px; line-height:1.8; border: 0; font-family:"微軟正黑體";}

.select-style { background: #8a6e0c; font-size:16px; color:#ffffff; line-height:1.8;padding:5px 15px;  border: 0; }
.input-style01 { background:#f6eff8;border:1px #ce9ac6 solid;padding:5px 15px;line-height:1.8;font-size:18px; font-family:"微軟正黑體"; color:#4E4E4E; width:100%;min-height: 190px;}
.input-style02 { background:#fff;border:1px #ce9ac6 solid;padding:14px 59px 2px 15px;line-height:1.8;font-size:16px; font-family:"微軟正黑體"; color:#4E4E4E; width:100%;min-height: 190px;}

.input-main-style01 + label{position: absolute;top: 0;right: 0;background: #ce9ac6;font-size: 28px;display: flex;align-items: center; justify-content: center;width: 44px;height: 44px;color: #fff;padding:8px;}
.input-main-style02 + label{position: absolute;top: 0;right: 0;background: #ce9ac6;font-size: 28px;display: flex;align-items: center; justify-content: center;width: 44px;height: 44px;color: #fff;padding:8px;}
.input-main-style03 + label{position: absolute;top: 0;right: 0;background: #ce9ac6;font-size: 28px;display: flex;align-items: center; justify-content: center;width: 44px;height: 44px;color: #fff;padding:8px;}
.input-style01 + label{position: absolute;top: 0;right: 0;background: #ce9ac6;font-size: 28px;display: flex;align-items:flex-start; justify-content: center;width: 44px;color: #fff;height: 190px;padding: 8px;}
.input-style02 + label{position: absolute;top: 0;right: 0;background: #ce9ac6;font-size: 28px;display: flex;align-items:flex-start; justify-content: center;width: 44px;color: #fff;height: 190px;padding: 8px;}
.input-main-style01:focus + label{background:#67145a;}
.input-main-style02:focus + label{background:#ab579e;}
.input-main-style03:focus + label{background:#67145a;}
.input-style01:focus + label{background:#ab579e;}
.input-style02:focus + label{background:#67145a;}
.input-main-style02:focus, .input-style01:focus{outline: 0;border:1px #ab579e solid;background: #fff;}
.input-main-style01:focus, .input-main-style03:focus, .input-style02:focus {outline: 0;border:1px #67145a solid;background: #fff;}
img.code { width:100px; height:44px; margin:0 ; vertical-align:middle;position: absolute;top:0;right:44px;}

/* 頁次 */	
.page{ font:13px/40px "微軟正黑體"; color:#333; text-align: center; clear:both; margin-top:20px; }
  .page a { color:#fff; padding:5px 15px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#36183d+86,ab579e+86 */
background: rgb(54,24,61); /* Old browsers */
background: -moz-linear-gradient(45deg, rgba(54,24,61,1) 86%, rgba(171,87,158,1) 86%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(54,24,61,1) 86%,rgba(171,87,158,1) 86%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(54,24,61,1) 86%,rgba(171,87,158,1) 86%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#36183d', endColorstr='#ab579e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
  .page a:hover { color: #fff;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#36183d+87,36183d+87 */
background: rgb(54,24,61); /* Old browsers */
background: -moz-linear-gradient(45deg, rgba(54,24,61,1) 87%, rgba(54,24,61,1) 87%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(54,24,61,1) 87%,rgba(54,24,61,1) 87%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(54,24,61,1) 87%,rgba(54,24,61,1) 87%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#36183d', endColorstr='#36183d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
  .page br { display:none;}
@media screen and (max-width:640px){
.page br { display: block;}
}

/** 底部資訊 **/
.bottom-info-main {border-top: 1px #000000 solid;padding:10.5px 10px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e5e5e5+0,ffffff+100 */
background: rgb(229,229,229); /* Old browsers */
background: -moz-linear-gradient(top, rgba(229,229,229,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(229,229,229,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(229,229,229,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */}
.bottom-info {max-width: 1140px;margin: 0 auto;}
.bottom-info ul { list-style:none; margin:0; padding:0;display: flex;flex-wrap: wrap; line-height: 1;justify-content: center; }
.bottom-info ul li {font-size:18px;color:#36183d;}
.bottom-info ul li:after {content: "│";display: inline-block;}
.bottom-info ul li:last-of-type:after {display: none;}
.bottom-info ul li a { color:#36183d;padding:8px 10px;}
.bottom-info ul li a:hover { color:#fff;background: #36183d;}

footer { background:#000000; }
footer .footer { max-width:1140px; margin:0 auto;font-size: 14px; color: #ffffff;display: flex;}
footer .footer a{color: #ffffff;}
footer .footer a:hover{text-decoration: underline;}
footer .footer .f-logo{width: 288px; min-width: 288px;padding:12.5px 14px;background: #613e69;margin: 0 14px 0 0;display: flex;align-items: center;justify-content: center; }
footer .footer .f-information{flex: 1;width: 100%;font-size: 14px; color: #ffffff;padding:11px 0px;}
footer .footer .f-information span{padding: 0 20px 0 0;display: inline-block;}
footer .footer .copyright{position: relative;font-size: 12px; color: #929292;font-family: arial;text-transform: uppercase;padding: 5px 0 0 0;}
footer .footer .copyright .wd{position: absolute;bottom: 0; right: 0;font-size: 12px; color: #919191;font-family: 'Ropa Sans', sans-serif;}
footer .footer .copyright .wd a{color: #919191;}
footer .footer .copyright .wd a:hover{text-decoration: underline;}

/** top **/
/* Image style */
#scrollUp {background-image: url("../images/top.png");bottom: 62px;right: 20px;width: 62px;    /* Width of image */height: 62px;   /* Height of image */}

@media screen and (max-width:920px){
	footer .footer .f-logo{width: 200px; min-width: 200px;margin: 0 4px 0 0;}
	footer .footer .f-information{padding:11px 10px;}
footer .footer .copyright .wd{position:inherit;bottom:inherit; right:inherit;display: block;}
}
@media screen and (max-width:750px){
	.bottom-info ul li a {padding:8.5px 1px;}
footer .footer { display:block;}
	footer .footer .f-logo{width:100%; min-width:inherit;margin: 0 auto;padding:10px;}
	footer .footer .f-information{padding:10px;text-align: center;}
}
@media screen and (max-width:640px){
	.bottom-info-main {display: none;}
	#scrollUp {background-image: url("../images/top.png");background-size: 40px; bottom: 5px;right: 5px;width:40px;height: 40px;}

}