@charset "utf-8";
/* CSS Document */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}
body {
    line-height: 30px;
    width: 100%;
    color: #595757;
    background: url('../images/website_image/bg.webp')no-repeat;
    background-attachment: fixed;
    background-position: center bottom;
    background-size: cover;
}
ol,
ul {
    list-style: none;
}
blockquote,
q {
    quotes: none;
}
blockquote:before,
blockquote:after {
    content: "";
    content: none
}
q:before,
q:after {
    content: "";
    content: none
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
* {
    font-family: "微軟正黑體";
    box-sizing: border-box
}
a {
    text-decoration: none
}
img {
    max-width: 100%
}
button:focus,
input:focus,
select:focus,
textarea:focus {
    outline: none
}
#tinymce p {
    color: #fff;
}
#container {
    width: 100%;
    margin: 0 auto;
}
/*header*/
header {
    z-index: 999;
    position: fixed;
    width: 100%;
    top: 0;
}
header .header_logo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    padding: 30px 7vw 40px;
    background: url('../images/website_image/header_bg.png')no-repeat top center;
    background-size: cover;
    transition: .5s;
}
header .header_logo .logo {
    line-height: 0px;
    width: 150px;
}
header .header_logo .header_hemberger_btn {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    color: #FFFFFF;
    font-size: 22px;
    z-index: 5;
}
nav {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 2;
}
nav>.nav_box {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
nav>.nav_box>.nav_logo {
    width: 145px;
    margin-right: 9vw;
}
nav>.nav_box>ul {
    border-left: 1px #504F50 solid;
    padding-left: 55px;
}
nav>.nav_box>ul>li {
    position: relative;
}
nav>.nav_box>ul>li ul.sul{
    position: absolute;
    top: 0;
    left: 160px;
}
nav>.nav_box>ul>li ul.sul li {
    color: #FFFFFF;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    font-size: 22px;
    padding: 12px 0px;
}
nav>.nav_box>ul>li ul.sul li a {
    display: block;
    transition: .5s;
    position: relative;
    overflow: hidden;
    color: #FFFFFF;
    padding-left: 20px;
    white-space: nowrap;
}
nav>.nav_box>ul>li ul.sul li a::before {
    content: "»";
    position: absolute;
    color: #fff;
    display: inline-block;
    width: 22px;
    height: 22px;
    top: 2px;
    left: 0;
    line-height: 1;
    font-size: 22px;
}
nav>.nav_box>ul>li ul.sul li a b {
    opacity: 1;
    transition: .5s;
    font-weight: normal;
}
nav>.nav_box>ul>li ul.sul li a span {
    position: absolute;
    width: auto;
    top: 30px;
    left: 20px;
    transition: .5s;
    color: #D1A76F;
    font-weight: 600;
}
nav>.nav_box>ul>li ul.sul li:hover a b {
    opacity: 0;
}
nav>.nav_box>ul>li ul.sul li:hover a span {
    top: 0px;
}
nav>.nav_box>ul>li>a {
    color: #FFFFFF;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    font-size: 22px;
    padding: 12px 0px;
}
nav>.nav_box>ul>li>a>.btn_icon {
    width: 22px;
    line-height: 0px;
    margin-right: 20px;
}
nav>.nav_box>ul>li>a>.btn_icon>img {}
nav>.nav_box>ul>li>a>.btn_word {
    display: block;
    transition: .5s;
    position: relative;
    overflow: hidden;
    width: calc(100% - 42px);
}
nav>.nav_box>ul>li>a>.btn_word>.word_en {
    opacity: 1;
    transition: .5s;
}
nav>.nav_box>ul>li:hover>a>.btn_word>.word_en {
    opacity: 0;
}
nav>.nav_box>ul>li>a>.btn_word>.word_tw {
    position: absolute;
    width: 100%;
    top: 30px;
    transition: .5s;
    color: #D1A76F;
    font-weight: 600;
}
nav>.nav_box>ul>li:hover>a>.btn_word>.word_tw {
    top: 0px;
}
@media screen and (max-width: 768px) {
    header .header_logo {
        padding: 15px 4vw 20px;
    }
    header .header_logo .header_hemberger_btn {
        font-size: 18px;
    }
    nav>.nav_box>.nav_logo {
        width: 120px;
        margin-right: 4vw;
    }
    nav>.nav_box>ul {
        padding-left: 15px;
    }
    nav>.nav_box>ul>li>a , nav>.nav_box>ul>li ul.sul li{
        font-size: 18px;
        padding: 10px 0px;
    }
    nav>.nav_box>ul>li ul.sul {
        left: 140px;
    }
    nav>.nav_box>ul>li>a>.btn_icon {
        width: 18px;
        margin-right: 10px;
    }
    nav>.nav_box>ul>li>a>.btn_word {
        width: calc(100% - 28px);
    }
}
@media screen and (max-width: 500px) {
    header .header_logo {
        padding: 10px 5px 10px 15px;
        background: #504F50;
    }
    header .header_logo .logo {
        width: 125px;
        z-index: 5;
    }
    nav>.nav_box>.nav_logo {
        display: none;
    }
    nav>.nav_box {
        top: 70px;
        transform: translate(-50%, 0%);
    }
    nav>.nav_box>ul {
        padding-left: 0px;
        border: unset;
        width: 220px;
    }
    #contactButton {
        font-size: 14px;
        padding: 10px 5px;
    }
    .header_btn_inq {
        margin-left: 5px;
    }
    nav>.nav_box>ul>li>a>.btn_word>.word_tw {
        top: 60px;
    }
}
/*Banner*/
#banner {
    position: relative;
    overflow: hidden;
    z-index: 99;
}
#banner .img {
    white-space: nowrap;
    position: absolute;
}
#banner .img img {
    vertical-align: top;
}
#banner_control {
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: center;
    z-index: 100;
}
#banner_control img {
    width: 25px;
}
#banner #banner_control span {
    cursor: pointer;
    padding: 0 10px;
}
#banner #banner_control span img:nth-child(2) {
    display: none;
}
#banner #banner_control span img:nth-child(1) {
    display: inline-block;
}
#banner #banner_control span:active img:nth-child(1),
#banner #banner_control span.now img:nth-child(1) {
    display: none;
}
#banner #banner_control span:active img:nth-child(2),
#banner #banner_control span.now img:nth-child(2) {
    display: inline-block;
}
@media screen and (max-width: 500px) {
    #banner {
        padding-top: 61px;
    }
    #banner_control {
        bottom: 5px;
    }
    #banner_control img {
        width: 17px;
    }
}
/*Banner End*/
.bg {
    padding: 65px 10%;
}
.bg.s {
    padding-left: 20px;
    padding-right: 20px;
}
@media screen and (max-width: 1024px) {
    .bg {
        padding: 50px 10%;
        width: 100%;
        overflow: hidden;
    }
    .title_bg_text{width: 100%;}
}
@media screen and (max-width: 500px) {
    .bg {
        padding: 40px 10%;
    }
}
.black_bg {
    background: #26282D;
}
.title {
    text-align: center;
    line-height: 18px;
}
.title img {
    width: 455px;
}
.index_about_box .title img {
    width: 555px;
}
.title .title_word {
    color: #FFFFFF;
    font-size: 24px;
    letter-spacing: 5px;
}
@media screen and (max-width: 500px) {
    .title img {
        width: 256px;
    }
    .title .title_word {
        font-size: 17px;
        letter-spacing: 0px;
    }
}
.title_bg {
    position: relative;
    width: 100%;
    height: 25vw;
}
.title_bg::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
}
.title_bg_text {}
.about_title_bg {
    background: url('../images/mine/title_bg/title_bg_about.webp')no-repeat center center;
    background-size: cover;
}
.marketing_title_bg {
    background: url('../images/mine/title_bg/title_bg_marketing.webp')no-repeat center center;
    background-size: cover;
}
.concept_title_bg {
    background: url('../images/mine/title_bg/title_bg_concept.png')no-repeat center center;
    background-size: cover;
}
.service_title_bg {
    background: url('../images/mine/title_bg/title_bg_service.png')no-repeat center center;
    background-size: cover;
}
.service01_title_bg {
    background: url('../images/mine/title_bg/title_bg_service01.png')no-repeat center center;
    background-size: cover;
}
.service02_title_bg {
    background: url('../images/mine/title_bg/title_bg_service02.png')no-repeat center center;
    background-size: cover;
}
.service03_title_bg {
    background: url('../images/mine/title_bg/title_bg_service03.png')no-repeat center center;
    background-size: cover;
}
.service04_title_bg {
    background: url('../images/mine/title_bg/title_bg_service04.png')no-repeat center center;
    background-size: cover;
}
.service05_title_bg {
    background: url('../images/mine/title_bg/title_bg_service05.png')no-repeat center center;
    background-size: cover;
}
.service06_title_bg {
    background: url('../images/mine/title_bg/title_bg_service06.png')no-repeat center center;
    background-size: cover;
}
.special_title_bg {
    background: url('../images/mine/title_bg/title_bg_special.png')no-repeat center center;
    background-size: cover;
}
.special01_title_bg {
    background: url('../images/mine/title_bg/title_bg_special01.png')no-repeat center center;
    background-size: cover;
}
.special02_title_bg {
    background: url('../images/mine/title_bg/title_bg_special02.png')no-repeat center center;
    background-size: cover;
}
.special03_title_bg {
    background: url('../images/mine/title_bg/title_bg_special03.webp')no-repeat center center;
    background-size: cover;
}
.new_title_bg {
    background: url('../images/mine/title_bg/title_bg_new.png')no-repeat center center;
    background-size: cover;
}
.member_title_bg {
    background: url('../images/mine/title_bg/title_bg_member.png')no-repeat center center;
    background-size: cover;
}
.contact_title_bg {
    background: url('../images/mine/title_bg/title_bg_contact.png')no-repeat center center;
    background-size: cover;
}
.personal_title_bg {
    background: url('../images/mine/title_bg/title_bg_personal.webp')no-repeat center center;
    background-size: cover;
}
.corporate_title_bg {
    background: url('../images/mine/title_bg/title_bg_corporate.webp')no-repeat center center;
    background-size: cover;
}
.mergers_title_bg {
    background: url('../images/mine/title_bg/title_bg_mergers.webp')no-repeat center center;
    background-size: cover;
}
.business_title_bg {
    background: url('../images/mine/title_bg/title_bg_business.webp')no-repeat center center;
    background-size: cover;
}
.service9_title_bg {
    background: url('../images/mine/title_bg/title_bg_service9.webp')no-repeat center center;
    background-size: cover;
}
.service10_title_bg {
    background: url('../images/mine/title_bg/title_bg_service10.webp')no-repeat center center;
    background-size: cover;
}
.service11_title_bg {
    background: url('../images/mine/title_bg/title_bg_service11.webp')no-repeat center center;
    background-size: cover;
}
.service12_title_bg {
    background: url('../images/mine/title_bg/title_bg_service12.webp')no-repeat center center;
    background-size: cover;
}
.service13_title_bg {
    background: url('../images/mine/title_bg/title_bg_service13.webp')no-repeat center center;
    background-size: cover;
}
.service14_title_bg {
    background: url('../images/mine/title_bg/title_bg_service14.webp')no-repeat center center;
    background-size: cover;
}
.service15_title_bg {
    background: url('../images/mine/title_bg/title_bg_service15.webp')no-repeat center center;
    background-size: cover;
}
.service16_title_bg {
    background: url('../images/mine/title_bg/title_bg_service16.webp')no-repeat center center;
    background-size: cover;
}
.service17_title_bg {
    background: url('../images/mine/title_bg/title_bg_service17.webp')no-repeat center center;
    background-size: cover;
}
.service18_title_bg {
    background: url('../images/mine/title_bg/title_bg_service18.webp')no-repeat center center;
    background-size: cover;
}
.title_bg_text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
@media screen and (max-width: 1024px) {
    .title_bg {
        height: 30vw;
    }
}
@media screen and (max-width: 768px) {
    .title_bg {
        height: 40vw;
    }
}
@media screen and (max-width: 500px) {
    .title_bg {
        height: 30vw;
        margin-top: 61px;
    }
    .title_phone_padding {
        padding-top: 61px;
    }
}
/* 首頁按鈕區 */
.index_btn_bg {
    background: #26282D;
    padding-bottom: 40px;
}
@media screen and (max-width: 1024px) {
    .index_btn_bg {
        padding-bottom: 30px;
    }
}
@media screen and (max-width: 500px) {
    .index_btn_bg {
        padding-bottom: 40px;
    }
}
.index_btn_bg .btn_hide {
    overflow: hidden;
    width: 100%;
    position: relative;
}
.index_btn_bg .btn_box {
    /* width: 1740px; */
    display: flex;
    width: 200%;
    position: relative;
    transition: .5s;
    right: 0px;
}
.index_btn_bg .btn_box a {
    display: inline-block;
    margin: 0px 0.5%;
    width: 24%;
}
.index_btn_bg .btn_box a .btn_pic {
    line-height: 0px;
}
.index_btn_bg .btn_box a .btn_pic img {}
.index_btn_bg .btn_box a .btn_name {
    color: #FFFFFF;
    padding: 8px 0px 0px;
    transition: .5s;
}
.index_btn_bg .btn_box a:hover .btn_name {
    color: #D1A76F;
}
.index_btn_bg .btn_box a .btn_name .line {
    width: 30px;
    height: 1px;
    background: #D1A76F;
    margin-top: 8px;
    transition: .5s;
}
.index_btn_bg .btn_box a:hover .btn_name .line {
    width: 100%;
}
.btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    z-index: 2;
    cursor: pointer;
}
.btn img {}
.btn_left {
    left: 0;
}
.btn_right {
    right: 0;
}
@media screen and (max-width: 768px) {
    .index_btn_bg .btn_box a {
        margin: 0px 0.6%;
        width: 32%;
    }
    .index_btn_bg .btn_box {
        width: 269.6%;
    }
}
@media screen and (max-width: 500px) {
    .index_btn_bg .btn_box a {
        margin: 0px;
        width: 100%;
    }
    .index_btn_bg .btn_box {
        width: 800%;
    }
    .index_btn_bg .btn_box a .btn_pic img {
        width: 100%;
    }
    .index_btn_bg .btn_box a .btn_name {
        text-align: center;
    }
    .index_btn_bg .btn_box a .btn_name .line {
        margin: 8px auto 0px;
    }
}
/* 首頁關於我們 */
.index_about_box {
    color: #fff;
}
.index_about_box .Txt {
    margin: 30px 0 20px;
    font-size: 18px;
}
.index_about_box .Img {
    position: relative;
    overflow: hidden;
}
.index_about_box .Img a img {
    transition: transform 0.3s ease-in-out;
}
.index_about_box .Img a:hover img {
    filter: brightness(1.15);
}
/* 首頁服務項目 */
.index_service_bg {
    padding-top: 150px;
    position: relative;
    overflow: hidden;
}
@media screen and (max-width: 1024px) {
    .index_service_bg {
        padding-top: 120px;
    }
}
@media screen and (max-width: 768px) {
    .index_service_bg {
        padding-top: 90px;
    }
}
@media screen and (max-width: 500px) {
    .index_service_bg {
        padding-top: 50px;
    }
}
.index_service_bg::before {
    content: '';
    display: inline-block;
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 80px 960px 0 960px;
    border-color: #26282D transparent transparent transparent;
    left: 50%;
    top: 0px;
    transform: translate(-50%);
}
@media screen and (max-width: 1500px) {
    .index_service_bg::before {
        border-width: 100px 750px 0 750px;
    }
}
@media screen and (max-width: 1024px) {
    .index_service_bg::before {
        border-width: 60px 512px 0 512px;
    }
}
@media screen and (max-width: 768px) {
    .index_service_bg::before {
        border-width: 40px 384px 0 384px;
    }
}
@media screen and (max-width: 500px) {
    .index_service_bg::before {
        display: none;
    }
}
.index_service_bg .index_service_box {
    margin-top: 30px;
}
.index_service_bg .index_service_box .index_service_s_box {
    background: #FFFFFF;
    margin-bottom: 20px;
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
}
.index_service_bg .index_service_box .index_service_s_box .index_service_pic {
    width: calc(100% - 385px);
}
.index_service_bg .index_service_box .index_service_s_box:nth-of-type(even) .index_service_pic {
    order: 1;
}
.index_service_bg .index_service_box .index_service_s_box .pic01 {
    background: url('../images/mine/s_pic/s_pic_08.webp')no-repeat center right;
    background-position: center;
    transition: all 0.3s ease-out;
    background-size: 125vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic02 {
    background: url('../images/mine/s_pic/s_pic_09.webp')no-repeat center center;
    background-position: center;
    transition: all 0.3s ease-out;
    background-size: 125vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic03 {
    background: url('../images/mine/s_pic/s_pic_10.webp')no-repeat center center;
    background-size: cover;
    transition: all 0.3s ease-out;
    background-size: 125vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic04 {
    background: url('../images/mine/s_pic/s_pic_11.webp')no-repeat center center;
    background-size: cover;
    transition: all 0.3s ease-out;
    background-size: 125vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic05 {
    background: url('../images/mine/s_pic/s_pic_12.webp')no-repeat center center;
    background-size: cover;
    transition: all 0.3s ease-out;
    background-size: 125vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic06 {
    background: url('../images/mine/s_pic/s_pic_13.webp')no-repeat center center;
    background-size: cover;
    transition: all 0.3s ease-out;
    background-size: 125vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic01:hover {
    background-size: 130vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic02:hover {
    background-size: 130vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic03:hover {
    background-size: 130vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic04:hover {
    background-size: 130vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic05:hover {
    background-size: 130vh;
}
.index_service_bg .index_service_box .index_service_s_box .pic06:hover {
    background-size: 130vh;
}
.index_service_bg .index_service_box .index_service_s_box .index_service_text {
    width: 385px;
    padding: 50px 3.5vw;
}
.index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_title {
    color: #706762;
    font-size: 22px;
    font-weight: 600;
}
.index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_title .line {
    width: 35px;
    height: 1px;
    background: #D1A76F;
    margin: 8px 0px 15px;
}
.index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_word {}
@media screen and (max-width: 1500px) {
    .index_service_bg .index_service_box .index_service_s_box .index_service_pic {
        width: 66%;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text {
        width: 34%;
        padding: 40px 3vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06:hover {
        background-size: 80vw;
    }
}
@media screen and (max-width: 1024px) {
    .index_service_bg .index_service_box .index_service_s_box .index_service_pic {
        width: 50%;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text {
        width: 50%;
        padding: 35px 5vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06 {
        background-size: 70vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05:hover {
        background-size: 80vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06:hover {
        background-size: 80vw;
    }
}
@media screen and (max-width: 768px) {
    .index_service_bg .index_service_box .index_service_s_box {
        flex-wrap: wrap;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_pic {
        width: 100%;
        height: 40vw;
    }
    .index_service_bg .index_service_box .index_service_s_box:nth-of-type(even) .index_service_pic {
        order: -1;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text {
        width: 100%;
        padding: 30px 6vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_title {
        text-align: center;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_title .line {
        margin: 8px auto 15px;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06:hover {
        background-size: 110vw;
    }
}
@media screen and (max-width: 500px) {
    .index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_title {
        font-size: 18px;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text .index_service_title .line {
        margin: 5px auto 8px;
        width: 25px;
    }
    .index_service_bg .index_service_box .index_service_s_box .index_service_text {
        padding: 20px 6vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06 {
        background-size: 100vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic01:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic02:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic03:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic04:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic05:hover {
        background-size: 110vw;
    }
    .index_service_bg .index_service_box .index_service_s_box .pic06:hover {
        background-size: 110vw;
    }
}
/* about */
.about_box {
    color: #FFFFFF;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    padding: 20px 0px;
}
.about_box .about_text {
    width: calc(79% / 4);
    padding-top: 20px;
}
.about_box .about_margin_left {
    margin-right: 7%;
    position: relative;
}
.about_box .about_margin_left::before{
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 50%;
    top: 25%;
    right: -17%;
    background-color: rgba(255, 255, 255, 0.2);
}
.about_box .about_margin_left:last-child::before{display: none;}
.about_box .about_margin_left:last-child{
    margin-right: 0;
}
.about_box .about_margin_left:nth-child(even){
    padding-top: 50px;
}
.about_box .about_text .about_s_title {
    color: #FFF;
    text-align: center;
    font-size: 24px;
    line-height: 1;
    font-weight: 600;
    background: linear-gradient(135deg, #252260, #4B90AA);
    position: relative;
    padding: 10px;
    margin: 0 0px 20px;
}
.about_box .about_text .about_s_title .line {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
}
.about_box .about_text .about_s_title .line::before,
.about_box .about_text .about_s_title .line::after {
    content: "";
    display: block;
    position: absolute;
    background: #252260;
}
.about_box .about_text .about_s_title .line::before {
    width: 50px;
    height: 1px;
    top: -5px;
    left: -5px;
}
.about_box .about_text .about_s_title .line::after {
    width: 1px;
    height: 20px;
    top: -5px;
    left: -5px;
}
.about_box .about_text .about_s_title .line2 {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
}
.about_box .about_text .about_s_title .line2::before,
.about_box .about_text .about_s_title .line2::after {
    content: "";
    display: block;
    position: absolute;
    background: #4B90AC;
}
.about_box .about_text .about_s_title .line2::before {
    width: 50px;
    height: 1px;
    bottom: -5px;
    right: -5px;
}
.about_box .about_text .about_s_title .line2::after {
    width: 1px;
    height: 20px;
    bottom: -5px;
    right: -5px;
}
.about_box .about_text p {
    padding: 0 10px 25px;
    font-size: 17px;
    letter-spacing: 1px;
}
.about_box .about_text p.about_icon {
    padding-bottom: 10px;
    padding-top: 10px;
    text-align: center;
}
.about_box .about_text p.about_icon img {
    width: 67px;
}
.about_box .about_pic {
    width: 30%;
    line-height: 0px;
}
.about_box .about_pic img {
    transform: scale(1, 1);
    transition: all 0.3s ease-out;
}
.about_box .about_pic img:hover {
    transform: scale(1.05, 1.05);
}
.about_box .about_text .about_s_title2 {
    font-size: 18px;
    font-weight: 600;
    padding-bottom: 30px;
}
.about_box .about_text .about_s_text {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}
.about_box .about_text .about_s_text .dot {
    width: 5px;
    height: 5px;
    background: #D1A76F;
    margin: 13px 10px;
}
.about_box .about_text .about_s_text .dot_text {
    width: calc(100% - 25px);
}
@media screen and (max-width: 1500px) {
    .about_box {
        flex-wrap: wrap;
    }
    .about_box .about_text {
        width: calc(91% / 4);
    }
    .about_box .about_pic {
        width: 38%;
    }
    .about_box .about_margin_left {
        margin-right: 3%;
    }
    .about_box .about_margin_left:last-child {
        margin-right: 0;
    }
    .about_box .about_margin_left::before {
        right: -6%;
    }
}
@media screen and (max-width: 1024px) {
    .about_box .about_text {
        width: 100%;
    }
    .about_box .about_text .about_s_title2 {
        text-align: center;
    }
    .about_box .about_margin_left {
        margin-right: 0px;
    }
    .about_box .about_pic {
        width: 100%;
        text-align: center;
    }
    .about_box:nth-of-type(2) .about_pic {
        order: 1;
        margin-top: 20px;
    }
    .about_box .about_margin_left:nth-child(even) {
        padding-top: 20px;
    }
    .about_box .about_margin_left::before {
        display: none;
    }
}
/* marketing */
.marketing_bg {
    background: url(../images/website_image/marketing_bg.webp) no-repeat;
    background-position: bottom 35% right;
}
.marketing_box {
    width: 100%;
}
.marketing_box>div {
    color: #FFFFFF;
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    align-content: flex-start;
    flex-wrap: wrap;
    padding: 30px 0px;
    position: relative;
}
.marketing_text_top::before,.marketing_text_center::before, .marketing_text_bottom::before{
    content: "";
    display: block;
    position: absolute;
    top: 20px;
    left: 0;
    width: 0;
    height: 0;
    border-right: 30px solid transparent;
    border-top: 30px solid #666;
    z-index: 5;
}
.marketing_text_top::after{
    content: "";
    display: block;
    position: absolute;
    bottom: 20px;
    right: 0;
    width: 0;
    height: 0;
    border-left: 30px solid transparent;
    border-bottom: 30px solid #666;
    z-index: 5;
}
.marketing_text_center::before{
    left: 7%;
}
.marketing_text_bottom::before{
    left: 14%;
}
.marketing_box>div.marketing_text_center {
    padding-left: 7%;
}
.marketing_box>div.marketing_text_bottom {
    padding-left: 14%;
}
.marketing_box .marketing_Txt {
    width: 100%;
}
.marketing_box .marketing_text {
    width: 33.33%;
    position: relative;
    padding: 20px 30px;
    font-size: 18px;
    background-color: rgba(0, 0, 0, 0.38);
}
.marketing_box .marketing_text::before {
    content: "";
    display: block;
    background-color: #666;
    position: absolute;
    top: 25%;
    right: 0;
    width: 1px;
    height: 50%;
}
.marketing_box .marketing_text:last-child::before {
    display: none;
}
.marketing_s_title {
    background-color: #36373a;
    display: inline-block;
    text-align: center;
    position: relative;
    margin: 0 auto 10px;
    padding: 5px 20px;
    color: #e1c299;
    font-weight: 600;
    font-size: 20px;
}
.marketing_s_title .line {
    position: absolute;
    content: "";
    display: block;
    width: 50px;
    height: 2px;
    bottom: 0;
    right: calc(50% - 25px);
    background-color: #e1c299;
}
.marketing_box .marketing_text p.marketing_icon {
    padding-bottom: 10px;
    padding-top: 10px;
    text-align: center;
}
.marketing_box .marketing_text p.marketing_icon img{
    width: 80px;
}
.marketing_video {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    background-color: #26282D;
}
.marketing_video .bg{
    width: 100%;
}
.marketing_video .marketing_video_title {
    width: 100%;
    margin-top: -87px;
    text-align: center;
    margin-bottom: 50px;
}
.marketing_video h3 {
    display: inline-block;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
  background-color: transparent;
  }
.marketing_video h3 strong {
    color: #000;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  background-color: rgba(255, 255, 255, 0.8);
  position: relative;
  padding: 12px 24px;
  margin: 0;
  display: inline-block;
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
  }
  .marketing_video .btn_link {
    width: 100%;
    text-align: center;
    margin-top: 40px;
  }
.marketing_video .btn_link  > span a {
    background-color: rgba(0, 0, 0, 0.7);
    padding: 13px 7%;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    position: relative;
    border-right: 8px #D1A76F solid;
    z-index: 1;
}
.marketing_video .btn_link  > span a::before {
    content: '';
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #706661;
    transform-origin: center right;
    transform: scaleX(0);
    transition: transform 0.5s ease-in-out;
    display: block;
}
.marketing_video .btn_link  > span a:hover::before {
    transform-origin: center left;
    transform: scaleX(1);
}
  /**/
  .shorts-wrapper {
    position: relative;
    padding: 1rem 2rem;
  }
  .shorts-viewport {
    overflow: hidden;
  }
.shorts-scroll {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.shorts-scroll::-webkit-scrollbar {
  display: none;
}
.shorts-scroll .video-wrapper {
  flex: 0 0 33.3333%;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  scroll-snap-align: start;
}
.shorts-scroll .video-wrapper.instagram {
  background: #000;
}
.shorts-scroll .video-wrapper iframe {
  position: absolute;
  top: 50%; left: 50%;
  width: 100%; height: auto;
  min-height: 100%;
  transform: translate(-50%, -50%);
  border: none;
}
.shorts-scroll .video-wrapper iframe[src*="instagram.com"] {
    aspect-ratio: 9 / 16;
    flex: 0 0 auto;
    width: auto;
    height: 100%;
    max-height: 100%;
}
  /**/
  .scroll-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.6);
    color: white;
    border: none;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    cursor: pointer;
    z-index: 10;
    font-size: 20px;
  }
  .scroll-left {
    left: 0;
  }
  .scroll-right {
    right: 0;
  }
  @media (max-width: 768px) {
    .shorts-scroll iframe {
      flex: 0 0 50%;
    }
  }
/**/
.marketing_video_itembox {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.marketing_video .marketing_video_item {
    margin: 20px 20px;
    padding: 5px;
    border: 1px dashed #fff;
    border-radius: 50%;
    width: 82px;
    height: 82px;
    position: relative;
    z-index: 5;
}
.marketing_video .marketing_video_item a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
.marketing_video .marketing_video_item img{
    width: 70%;
    margin: 0 auto;
}
.marketing_video .marketing_video_item:nth-child(even) {
    top: 20px;
}
.marketing_video .marketing_video_item:hover {
    border: 1px dashed #D1A76F;
    animation: breath 2s linear infinite
}
.marketing_video .marketing_video_item a:hover img {
    filter: brightness(1.3);
}
@-webkit-keyframes breath {
    50% {
        transform: scale(1.05);
        -webkit-transform: scale(1.05);
    }
}
@keyframes breath {
    50% {
        transform: scale(1.05);
        -webkit-transform: scale(1.05);
    }
}
@media screen and (max-width:1024px) {
    .marketing_bg{
        padding: 35px 20px;
    }
    .marketing_box>div.marketing_text_center {
        padding-left: 0%;
    }
    .marketing_text_center::before {
        left: 0%;
    }
    .marketing_box>div.marketing_text_bottom {
        padding-left: 0%;
    }
    .marketing_text_bottom::before {
        left: 0%;
    }
    .marketing_box .marketing_text {
        padding: 20px 20px;
        font-size: 16px;
    }
    .marketing_video .bg{
        overflow: visible;
        padding: 50px 20px;
    }
    .marketing_video .marketing_video_item {
        margin: 20px 10px;
        width: 65px;
        height: 65px;
    }
}
@media screen and (max-width:768px) {
    .marketing_bg {
        background-image: none;
    }
    .marketing_box .marketing_text{
        width: 100%;
    }
    .marketing_box .marketing_text::before {
        top: auto;
        bottom: 0;
        right: 25%;
        width: 50%;
        height: 1px;
    }
    .marketing_video_itembox {
        justify-content: center;
    }
    .marketing_video .bg {
        padding: 30px 10px;
    }
    .marketing_video .marketing_video_item {
        width: 42px;
        height: 42px;
        margin: 0px 5px;
    }
    .marketing_video .marketing_video_item img {
        width: 80%;
    }
    .marketing_video .marketing_video_item:nth-child(even) {
        top: 0px;
    }
    .marketing_video h3 strong {
        font-size: 20px;
        padding: 8px 24px;
    }
    .marketing_video .marketing_video_title {
        margin-top: -50px;
        margin-bottom: 25px;
    }
}
/* concept */
.concept_box1 {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: wrap;
}
.concept_box1 .concept_s_box1 {
    text-align: center;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 18px;
    width: 18%;
    margin: 0px 1%;
    border: 1px #D1A76F solid;
    padding: 3vw;
    transition: .5s;
}
.concept_phone {
    display: none;
}
.concept_box1 .concept_s_box1:hover {
    background: #D1A76F;
}
.value-2-center{
    text-align: center;
}
.concept_box1 .concept_s_box1 .concept_pic {
    line-height: 0px;
    width: 60px;
    margin: auto;
}
.concept_box1 .concept_s_box1 .concept_text {
    padding-top: 10px;
}
.concept_box2 {
    width: 80%;
    margin: auto;
}
.concept_box2 .concept_s_box2 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    padding: 30px 0px;
    /* animation */
    animation-name: going_up;
    animation-duration: 1s;
}
.concept_box2 .concept_s_box2 .concept_pic {
    width: 80px;
    margin-right: 15px;
    line-height: 0px;
    /* animation */
    animation-name: going_up-img;
    animation-duration: 1.3s;
    position: relative;
}
.concept_box2 .concept_s_box2 .concept_pic::before {
    content: '';
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transform-origin: center;
    transform: scale(0.9);
    border-radius: 50%;
}
.concept_box2 .concept_s_box2:hover .concept_pic::before {
    transition: all 0.5s ease-in-out;
    transform-origin: center;
    transform: scale(1.1);
    opacity: 0;
    animation-name: click;
    animation-duration: 0.5s;
}
@keyframes click {
    0% {
        border: 0px #D1A76F solid;
    }
    100% {
        border: 4px #D1A76F solid;
    }
}
.concept_box2 .concept_s_box2 .concept_text {
    color: #FFFFFF;
    width: calc(100% - 95px);
}
.concept_box2 .concept_s_box2 .concept_text .concept_title {
    color: #D1A76F;
    font-size: 28px;
    font-weight: 600;
}
@media screen and (max-width: 1024px) {
    .concept_box2 {
        width: 100%;
    }
}
@media screen and (max-width: 768px) {
    .concept_box1 .concept_s_box1 {
        width: 45%;
        margin: 2.5%;
        padding: 6vw;
    }
    .concept_phone {
        display: block;
        width: 400px;
        margin: auto;
    }
    .concept_pc {
        display: none;
    }
}
@media screen and (max-width: 500px) {
    .concept_box1 .concept_s_box1 {
        width: 90%;
        margin: 10px 5%;
        padding: 8vw;
    }
    .concept_phone {
        width: 100%;
    }
    .concept_box2 .concept_s_box2 {
        flex-wrap: wrap;
        padding: 15px 0px;
    }
    .concept_box2 .concept_s_box2 .concept_pic {
        margin: 0px auto 10px;
    }
    .concept_box2 .concept_s_box2 .concept_text {
        width: 100%;
        text-align: center;
    }
    .concept_box2 .concept_s_box2 .concept_text .concept_title {
        font-size: 20px;
    }
}
/* 服務項目列表頁 */
.service_list_box {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-start;
    color: #FFFFFF;
}
.service_list_s_box {
    width: 30%;
    margin: 20px 1%;
}
.service_list_box .service_list_s_box {}
.service_list_box .service_list_s_box .service_list_pic {
    line-height: 0px;
    text-align: center;
    overflow: hidden;
}
.service_list_box .service_list_s_box .service_list_pic img {
    transform: scale(1, 1);
    transition: all 0.3s ease-out;
}
.service_list_box .service_list_s_box .service_list_pic img:hover {
    transform: scale(1.05, 1.05);
}
.service_list_box .service_list_s_box .service_list_text {
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    padding-top: 15px;
}
@media screen and (max-width: 1024px) {
    .service_list_box {
        flex-wrap: wrap;
    }
    .service_list_box .service_list_s_box {
        width: 29%;
        margin: 30px 2.1%;
    }
}
@media screen and (max-width: 768px) {
    .special_list_box {}
    .service_list_s_box {}
    .service_list_box .service_list_s_box {
        width: 45%;
        margin: 25px 1%;
    }
}
@media screen and (max-width: 500px) {
    .service_list_box .service_list_s_box {
        width: 100%;
        margin: 20px 0px;
    }
    .service_list_box .service_list_s_box .service_list_text {
        font-size: 20px;
    }
}
/* 服務項目內頁 */
.service {
    color: #FFFFFF;
    width: 85%;
    margin: auto;
}
.service .service_p {
    text-align: center;
    padding: 20px 0px 0px;
}
.service .service_box {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: wrap;
    padding-top: 55px;
}
.member_service .service_box {
    padding-top: 10px;
}
.service .service_box .service_s_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    background: #26282D;
    border-right: 8px #D1A76F solid;
    width: 46.5%;
    margin: 12px 0px;
    padding: 25px 2vw;
    position: relative;
    z-index: 1;
}
.value3.service .service_box .service_s_box{
    width: 100%;
    flex-wrap: wrap;
}
.value3.service .service_box .service_s_box.video::after{
    display: none;
}
.value3.service .service_box .service_s_box:nth-of-type(odd) {
    margin-right: 0%;
}
.value3.service .service_box .service_s_box p{
    width: 100%;
    display: block;
}
.value3.service .service_box .service_s_box a{
    color: #fff;
    word-break: break-all;
}
.value3.service .service_box .service_s_box a:hover{
    color: #D1A76F;
}
.service_box_food {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 0 0 10% 0;
    overflow: hidden;
}
.service_box_m_food {
    width: 60%;
    margin: 40px 0;
    background: #26282D;
}
.service_title_food {
    width: 100%;
    margin: 50px auto 20px auto;
    font-size: 30px;
    text-align: center;
    color: #D1A76F;
    font-weight: bold;
}
.service_title_s_food {
    width: 100%;
    margin: 2%;
    padding: auto 5%;
    color: #ffffff;
    text-align: left;
}
.service_pic_food01 {
    width: 38%;
    margin-right: 2%;
    overflow: hidden;
}
.service_pic_food02 {
    width: 38%;
    margin-left: 2%;
    overflow: hidden;
    order: 1;
}
.service_pic_food01 img {
    width: 100%;
    transform: scale(1, 1);
}
.service_pic_food02 img {
    width: 100%;
    transform: scale(1, 1);
}
.service_pic_food01:hover img {
    transform: scale(1.05, 1.05);
    transition: all 0.3s ease-out;
}
.service_pic_food02:hover img {
    transform: scale(1.05, 1.05);
    transition: all 0.3s ease-out;
}
.service_text_food span {
    width: 30px;
}
.service_text_food span img {
    width: 20px;
}
.service_text_food {
    width: 100%;
    margin: auto 0;
    padding: 2% 3%;
    line-height: 40px;
    color: #D1A76F;
}
.service_text_food a {
    padding: 0 10px;
    font-size: 22px;
    font-weight: bold;
    text-decoration: underline;
}
/* .service_box_m_food:nth-of-type(odd) .service_text_food{
	order: -1;
} */
@media screen and (max-width: 1500px) {}
@media screen and (max-width: 1024px) {
    .service_box_m_food {
        width: 100%;
    }
    .service_title_food {
        width: 100%;
        margin: 50px auto 20px auto;
    }
    .service_pic_food01 {
        width: 100%;
        margin-right: 0%;
    }
    .service_pic_food02 {
        width: 100%;
        margin-left: 0%;
        order: 0;
    }
}
@media screen and (max-width: 500px) {}
.service .service_box .service_s_box::before {
    content: '';
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #443E3B;
    transform-origin: center right;
    transform: scaleX(0);
    transition: transform 0.5s ease-in-out;
}
.service .service_box .service_s_box:hover::before {
    transform-origin: center left;
    transform: scaleX(1);
}
.member_service .service_box .service_s_box {
    border: 1px #D1A76F solid;
    border-right: 8px #D1A76F solid;
}
.service .service_box .service_s_box:nth-of-type(odd) {
    margin-right: 7%;
}
.service_photo {
    width: 40%;
}
.service_photo img {}
.service .service_box .service_s_box .service_icon {
    line-height: 0px;
    width: 55px;
    margin-right: 15px;
}
.service .service_box .service_s_box .service_icon img {}
.service .service_box .service_s_box .service_text {
    width: calc(100% - 70px);
}
@media screen and (max-width: 1200px) {
    .service {
        width: 100%;
    }
}
@media screen and (max-width: 1024px) {
    .service .service_photo {
        width: 90%;
    }
    .service .service_box .service_s_box {
        width: 100%;
    }
    .service .service_box .service_s_box .service_photo {
        width: 100%;
    }
    .service .service_box .service_s_box:nth-of-type(odd) {
        margin-right: 0px;
    }
}
@media screen and (max-width: 768px) {
    .service .service_photo {
        width: 100%;
    }
    .service .service_box {
        padding-top: 40px;
    }
    .service .service_box .service_s_box {
        padding: 25px 4vw;
    }
}
@media screen and (max-width: 500px) {
    .service .service_p {
        padding: 10px 0px 0px;
    }
    .service .service_box {
        padding-top: 30px;
    }
    .service .service_box .service_s_box {
        flex-wrap: wrap;
        border-right: unset;
        border-bottom: 3px #D1A76F solid;
    }
    .service .service_box .member_s_box {
        border-right: 1px #D1A76F solid;
    }
    .service .service_box .service_s_box .service_text {
        width: 100%;
        text-align: center;
    }
    .service .service_box .service_s_box .service_icon {
        margin: 0px auto 5px;
    }
}
/* 加值服務列表頁 */
.special_list_box {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}
.special_list_box .special_list_s_box {
    position: relative;
    width: 49%;
    margin: 20px 0.5%;
}
.special_list_box .special_list_s_box .special_list_pic {
    line-height: 0px;
    overflow: hidden;
}
.special_list_box .special_list_s_box .special_list_pic img {
    transform: scale(1, 1);
    transition: all 0.3s ease-out;
}
.special_list_box .special_list_s_box .special_list_pic img:hover {
    transform: scale(1.05, 1.05);
}
.special_list_box .special_list_s_box .special_list_text {
    position: absolute;
    bottom: 15px;
    right: 15px;
    background: rgba(0, 0, 0, 0.8);
    text-align: center;
    padding: 1.1vw;
    width: 44%;
}
.special_list_box .special_list_s_box:nth-of-type(2) .special_list_text {
    left: 28%;
    right: unset;
}
.special_list_box .special_list_s_box:nth-of-type(3) .special_list_text {
    left: 15px;
    right: unset;
}
.special_list_box .special_list_s_box .special_list_text .special_icon {
    width: 70px;
    margin: auto;
    line-height: 0px;
}
.special_list_box .special_list_s_box .special_list_text .special_icon img {}
.special_list_box .special_list_s_box .special_list_text .special_word {
    color: #FFFFFF;
    font-weight: 600;
    font-size: 24px;
}
@media screen and (max-width: 1024px) {
    .special_list_box .special_list_s_box .special_list_text {
        padding: 15px;
        width: 180px;
        bottom: 10px;
        right: 10px;
    }
    .special_list_box .special_list_s_box:nth-of-type(2) .special_list_text {
        left: 10px;
    }
}
@media screen and (max-width: 768px) {
    .special_list_box {
        flex-wrap: wrap;
    }
    .special_list_box .special_list_s_box {
        position: relative;
        width: 100%;
        margin: 10px 0px;
    }
    .special_list_box .special_list_s_box .special_list_text {
        padding: 6vw 0px;
        width: 60%;
        bottom: 50%;
        right: 50%;
        transform: translate(50%, 50%);
    }
    .special_list_box .special_list_s_box:nth-of-type(2) .special_list_text {
        left: unset;
        right: 50%;
    }
}
@media screen and (max-width: 500px) {
    .special_list_box .special_list_s_box {
        margin: 5px 0px;
    }
    .special_list_box .special_list_s_box .special_list_text {
        padding: 10px;
        width: 180px;
    }
    .special_list_box .special_list_s_box .special_list_text .special_word {
        font-size: 18px;
    }
}
/* 加值服務-優質秘書服務 */
.service .special01_padding {
    padding-top: 20px;
}
.service .service_box .special01_s_box {
    border: 1px #D1A76F solid;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.service .service_box .special01_s_box::before {
    display: none;
}
.service .service_box .special01_s_box:hover::before {
    display: none;
}
.service .service_box .special01_s_box::after {
    content: '';
    z-index: -1;
    background-color: hsla(0, 0%, 100%, 0.1);
    position: absolute;
    top: -50%;
    bottom: -50%;
    width: 1.25em;
    transform: translate3d(-650%, 0, 0) rotate(50deg);
}
.service .service_box .special01_s_box:hover::after {
    transition: transform 0.6s ease-in-out;
    transform: translate3d(4000%, 0, 0) rotate(50deg);
}
.service .service_box .special01_s_box .service_icon {
    width: 45px;
    margin-right: 10px;
    position: relative;
    z-index: 1;
    position: relative;
}
.service .service_box .special01_s_box .service_icon::before {
    content: '';
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border: 4px #D1A76F solid;
    transform-origin: center;
    transform: scale(1);
    border-radius: 50%;
}
.service .service_box .special01_s_box:hover .service_icon::before {
    transition: all 0.75s ease-in-out;
    transform-origin: center;
    transform: scale(1.25);
    opacity: 0;
}
.service .service_box .special01_s_box .service_text {
    width: calc(100% - 55px);
}
@media screen and (max-width: 768px) {
    .service .special01_padding {
        padding-top: 0px;
    }
}
@media screen and (max-width: 500px) {
    .service .service_box .special01_s_box .service_text {
        width: 100%;
    }
    .service .service_box .special01_s_box .service_icon {
        margin: 0 auto 5px;
    }
}
/* 加值服務-商業服務 */
.special02_pic {
    line-height: 0px;
    text-align: center;
    width: 43%;
    margin: auto;
    display: block;
}
.special02 {}
.special02 {}
.special02 .concept_s_box1 {
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: unset;
    padding: 3vw 1vw;
    transition: .5s;
}
.special02 .concept_s_box1:hover {
    background: #D1A76F;
}
@media screen and (max-width: 1366px) {
    .special02_pic {
        width: 465px;
    }
}
@media screen and (max-width: 1024px) {
    .special02 .concept_s_box1 {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}
@media screen and (max-width: 768px) {
    .special02_pic {
        width: 100%;
    }
}
/*more*/
.more {
    text-align: left;
    margin-top: 20px;
}
.more a {
    font-size: 18px;
    text-decoration: none;
    color: #FFFFFF;
    background: #D1A76F;
    padding: 3px 15px;
    transition: .5s;
}
.more a:hover {
    background: #706762;
}
.more a .line {
    width: 30px;
    height: 1px;
    background: #FFFFFF;
    display: inline-block;
    margin: 7px 0px;
    margin-left: 7px;
}
@media screen and (max-width: 768px) {
    .more {
        text-align: center;
    }
}
@media screen and (max-width: 500px) {
    .more {
        margin-top: 10px;
    }
}
.service_more {
    text-align: center;
    margin-top: 10px;
}
.service_more a {
    color: #3E4044;
    background: #D9D9D9;
}
.service_more a:hover {
    color: #FFFFFF;
    background: #D1A76F;
}
.service_more a .line {
    background: #3E4044;
    transition: .5s;
}
.service_more a:hover .line {
    background: #FFFFFF;
}
.special_more {
    text-align: center;
    margin-top: 10px;
}
@media screen and (max-width: 500px) {
    .special_more {
        margin-top: 5px;
    }
}
.back {
    text-align: right;
}
.back a .line {
    margin-left: 0px;
    margin-right: 7px;
}
@media screen and (max-width: 768px) {
    .back {
        text-align: center;
    }
}
/*top*/
#gotop {
    display: none;
    position: fixed;
    right: 15px;
    bottom: 70px;
    cursor: pointer;
    z-index: 9999;
}
#gotop img {
    width: 65px;
    height: auto;
}
/*水平線*/
hr {
    height: 1px;
    width: 100%;
    margin: 0;
    border: none;
    border-bottom: 2px solid #E6E6E6;
}
/*頁碼*/
.page {
    text-align: center;
    margin: 25px 0px;
    font-size: 16px;
}
.page ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.page ul li {
    display: inline-block;
}
.page ul li a {
    padding: 0px 6px;
    margin: 0px 15px;
    display: block;
    text-decoration: none;
    color: #FFFFFF;
    line-height: 22px;
}
.page ul li .select,
.pagenumber a:hover {
    color: #26282D;
    background: #D1A76F;
    border-radius: 50%;
}
.page ul li a i.fa-angle-left::before {
    content: "";
    display: inline-block;
    background: url('../images/website_image/page_prev.png')no-repeat;
    background-size: cover;
    width: 20px;
    height: 20px;
    margin: -3px 0px;
}
.page ul li a i.fa-angle-right::before {
    content: "";
    display: inline-block;
    background: url('../images/website_image/page_next.png')no-repeat;
    background-size: cover;
    width: 20px;
    height: 20px;
    margin: -3px 0px;
}
/* new-list */
.new_box {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    padding-top: 35px;
    color: #FFFFFF;
}
.new_box aside {
    text-align: center;
    width: 145px;
    margin-right: 4%;
}
.new_box aside .name {
    color: #D1A76F;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 2px;
    padding-bottom: 5px;
}
.new_box aside .mobile_arrow {}
.new_box aside>ul {}
.new_box aside>ul>li {
    padding: 3px 0px;
}
.new_box aside>ul>li>a {
    display: block;
    color: #FFFFFF;
}
.new_box aside>ul>li>a:hover {
    border: 1px #D1A76F solid;
    color: #D1A76F;
}
.new_box .lists {
    width: calc(96% - 145px);
}
.new_box .lists .list {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    background: #26282D;
    color: #FFFFFF;
    padding: 35px 3vw;
    margin-bottom: 25px;
    /* transition: .5s; */
    /* animation */
    animation-name: going_up;
    animation-duration: 1s;
}
@keyframes going_up {
    0% {
        transform: translate3d(0, 100%, 0);
        opacity: 0;
    }
    100% {
        transform: none;
        opacity: 1;
    }
}
.new_box .lists .list:hover {
    background: #171819;
}
.new_box .lists .list .pic {
    width: 100px;
    margin-right: 6%;
    line-height: 0px;
}
.new_box .lists .list .pic img {
    /* animation */
    animation-name: going_up-img;
    animation-duration: 1.3s;
}
@keyframes going_up-img {
    0% {
        transform: translate3d(0, 100%, 0);
        opacity: 0;
    }
    100% {
        transform: none;
        opacity: 1;
    }
}
.new_box .lists .list .text {
    width: calc(94% - 100px);
    /* animation */
    animation-name: going_up-text;
    animation-duration: 1.5s;
}
@keyframes going_up-text {
    0% {
        transform: translate3d(0, 100%, 0);
        opacity: 0;
    }
    100% {
        transform: none;
        opacity: 1;
    }
}
.new_box .lists .list .text .new_title {
    padding-bottom: 5px;
}
.new_box .lists .list .text .new_title .name {
    color: #D1A76F;
    font-weight: 600;
    font-size: 18px;
}
.new_box .lists .list .text .new_title .date {
    background: #D1A76F;
    padding: 0px 15px;
    border-radius: 50px;
    display: inline-block;
    line-height: 22px;
}
.new_box .lists .list .text .new_title .new_mark {
    color: #E60012;
    display: inline-block;
}
@media screen and (max-width: 1024px) {
    .new_box {
        flex-wrap: wrap;
    }
    .new_box aside {
        width: 50%;
        margin: auto;
        position: relative;
    }
    .new_box aside .mobile_arrow {
        background: url('../images/website_image/arrow_btn.png')no-repeat center center;
        background-size: 100%;
        width: 15px;
        height: 15px;
        position: absolute;
        top: 7px;
        right: 15%;
    }
    .new_box aside>ul {
        display: none;
    }
    .new_box .lists {
        width: 100%;
        padding-top: 15px;
    }
}
@media screen and (max-width: 768px) {
    .new_box aside {
        width: 70%;
    }
    .new_box .lists .list {
        flex-wrap: wrap;
        padding: 35px 5vw;
    }
    .new_box .lists .list .pic {
        margin: 0px auto 10px;
    }
    .new_box .lists .list .text {
        width: 100%;
    }
    .new_box .lists .list .text .new_title {
        text-align: center;
    }
    .new_box .lists .list .text .new_title .name {
        width: 100%;
        display: block;
    }
    .new_box .lists .list .text .new_title .new_mark {
        display: block;
        line-height: 20px;
    }
}
@media screen and (max-width: 500px) {
    .new_box aside {
        width: 100%;
    }
    .new_box .lists .list {
        padding: 35px 8vw;
    }
}
/* new-detail */
.lists .new_detail_title {
    padding-bottom: 10px;
    border-bottom: 1px #706762 solid;
    margin-bottom: 25px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}
.lists .new_detail_title .date {
    background: #D1A76F;
    display: inline-block;
    padding: 2px 10px;
    line-height: 22px;
    margin: 4px 0px;
    margin-right: 10px;
}
.lists .new_detail_title .date img {
    width: 22px;
    margin: -5px 0px;
    margin-right: 5px;
}
.lists .new_detail_title .name {
    font-weight: 600;
    font-size: 24px;
    width: calc(100% - 145px);
}
.lists .new_pic {
    text-align: center;
    margin: auto;
    width: 100%;
}
.lists .new_pic img {}
.lists .new_text {
    width: 100%;
    margin: 20px 0px;
}
.lists .new_text ul{
    margin: 30px 5%;
}
.coursesBox .ipbox_detail_spic{
    width: 100%;
}
.coursesBox .ipbox_detail_spic ul{
    text-align: center;
}
.coursesBox .ipbox_detail_spic ul li{
    display: inline-block;
}
.coursesBox .gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    padding:20px 5px;
  }
  .coursesBox .gallery a {
    display: block;
    position: relative;
    width: 120px;
    max-height: 80px;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
    z-index: 1;
}
.coursesBox .gallery.new_pic a{
    width: auto;
    max-height: 400px;
}
.coursesBox .gallery a::before{
    content: "";
    display: block;
    position: absolute;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    top: 0;
    left: 0;
    border: 4px solid #fff;
    z-index: 5;
}
  .coursesBox .gallery a:hover {
    transform: scale(1.05);
  }
  .coursesBox .gallery img {
    width: 100%;
    height: auto;
    display: block;
    z-index: 3;
  }
.coursesBox .new_pic.gallery img {
    width: 100%;
    height: 100%;
    display: block;
    z-index: 3;
    object-fit: contain;
    max-height: 400px;
}
/* 課程及活動的影片 */
.youtube-shorts-container {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: center;
    padding: 20px;
  }
  .youtube-short {
    flex: 1 1 480px;
    max-width: 560px;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
    background-color: #000;
  }
  .youtube-short:hover {
    transform: scale(1.02);
  }
  .youtube-short::before {
    content: "";
    display: block;
    padding-top: 56.25%;
  }
  .youtube-short iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
  }
@media screen and (max-width: 768px) {
    .bg.coursesBox{
        padding: 20px 20px;
    }
    .lists .new_detail_title{
        flex-flow: column;
    }
    .lists .new_detail_title .name {
        font-size: 20px;
        width: 100%;
    }
    .lists .new_detail_title .date {
        font-size: 14px;
    }
    .lists .new_detail_title .date img {
        width: 20px;
        margin: -4px 0px;
    }
    .coursesBox .gallery a {
        width: 80px;
        max-height: 60px;
    }
}
@media screen and (max-width: 600px) {
    .lists .new_detail_title {
        flex-wrap: wrap;
    }
    .lists .new_detail_title .name {
        width: 100%;
        padding-top: 5px;
    }
}
@media screen and (max-width: 500px) {
    .lists .new_detail_title .name {
        padding-top: 0px;
        font-size: 20px;
    }
}
/* 會員專區-會員須知 */
.member_btn_box {
    display: flex;
    justify-content: center;
    align-items: stretch;
    align-content: stretch;
}
.member_btn_box .member_btn {
    color: #FFFFFF;
    text-align: center;
    display: inline-block;
    border: 1px #D1A76F solid;
    margin: 20px 15px;
    width: 280px;
    padding: 12px;
    transition: .5s;
}
.member_btn_box .member_btn:hover {
    background: #D1A76F;
}
.member_btn_box .member_btn .member_line {
    padding: 3.5vw 0px;
    transition: .5s;
}
.member_btn_box .member_btn:hover .member_line {
    border: 1px #26282D solid;
}
.member_btn_box .member_btn .member_line img {
    width: 80px;
}
.member_btn_box .member_btn .member_line .member_btn_name {
    color: #FFFFFF;
    font-size: 18px;
    padding-top: 10px;
}
.member_btn_box .on {
    background: #D1A76F;
}
.member_btn_box .on .member_line {
    border: 1px #26282D solid;
}
@media screen and (max-width: 1024px) {
    .member_btn_box .member_btn {
        width: 220px;
        padding: 10px;
    }
    .member_btn_box .member_btn .member_line {
        padding: 3vw 0px;
    }
}
@media screen and (max-width: 768px) {
    .member_btn_box .member_btn {
        margin: 10px;
    }
}
@media screen and (max-width: 650px) {
    .member_btn_box .member_btn {
        margin: 5px;
        width: 230px;
        padding: 5px;
    }
}
@media screen and (max-width: 600px) {
    .member_btn_box {
        flex-wrap: wrap;
    }
    .member_btn_box .member_btn {
        width: 65%;
        padding: 10px;
        margin: 10px;
    }
    .member_btn_box .member_btn .member_line {
        padding: 6vw 0px;
    }
    .member_btn_box .member_btn .member_line .member_btn_name {
        padding-top: 0px;
        font-size: 16px;
    }
}
@media screen and (max-width: 500px) {
    .member_btn_box .member_btn {
        width: 80%;
    }
}
.member_s_btn_box {
    text-align: center;
    border-bottom: 1px #706762 solid;
    padding-bottom: 50px;
}
.member_s_btn_box .member_s_btn {
    background: #FFFFFF;
    display: inline-block;
    color: #D1A76F;
    font-weight: 600;
    width: 190px;
    padding: 2px 0px;
    margin: 0px 15px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
    transition: .5s;
}
.member_s_btn_box .member_s_btn:hover {
    color: #FFFFFF;
    background: #D1A76F;
}
@media screen and (max-width: 1024px) {
    .member_s_btn_box {
        padding-bottom: 40px;
    }
}
@media screen and (max-width: 768px) {
    .member_s_btn_box .member_s_btn {
        width: 160px;
        margin: 0px 10px;
    }
}
@media screen and (max-width: 500px) {
    .member_s_btn_box .member_s_btn {
        width: 65%;
        margin: 10px 0px;
    }
}
.member_list_box {
    color: #FFFFFF;
    margin: 80px auto 0px;
    width: 78%;
}
.member_list_box .member_list_mark {
    text-align: center;
    color: #D1A76F;
    font-size: 20px;
    border: 1px #D1A76F solid;
    padding: 15px 10px;
    margin-bottom: 35px;
}
.member_list_box .member_list {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    padding: 15px 0px;
}
.member_list_box .member_list .number {
    color: #D1A76F;
    width: 20px;
    height: 20px;
    border: 1px #D1A76F solid;
    border-radius: 50%;
    line-height: 18px;
    text-align: center;
    margin: 5px 0px;
    margin-right: 15px;
}
.member_list_box .member_list .member_list_word {
    width: calc(100% - 35px);
}
.member_list_box_line {
    border: 3px #D1A76F solid;
    border-radius: 60px;
    padding: 60px 5vw;
    margin-bottom: 40px;
}
.member_title {
    text-align: center;
    color: #D1A76F;
    font-size: 25px;
    font-weight: 600;
}
.member_title .line {
    width: 35px;
    height: 1px;
    background: #D1A76F;
    margin: 15px auto 20px;
}
.member_list_box .member_text {
    text-align: center;
}
.member_list_box .member_text_mark {
    color: #D1A76F;
    padding-top: 30px;
}
@media screen and (max-width: 1500px) {
    .member_list_box {
        width: 85%;
    }
}
@media screen and (max-width: 1024px) {
    .member_list_box {
        width: 100%;
        margin: 60px auto 0px;
    }
    .member_list_box .member_list_mark {
        font-size: 18px;
        margin-bottom: 25px;
    }
    .member_list_box .member_text_mark {
        padding-top: 20px;
    }
    .member_list_box_line {
        padding: 50px 6vw;
        margin-bottom: 30px;
    }
}
@media screen and (max-width: 768px) {
    .member_list_box .member_title {
        font-size: 22px;
    }
    .member_list_box_line {
        padding: 40px 6vw;
        border-radius: 40px;
    }
}
@media screen and (max-width: 500px) {
    .member_title {
        font-size: 20px;
    }
    .member_title .line {
        margin: 10px auto 20px;
    }
    .member_list_box {
        margin: 50px auto 0px;
    }
    .member_list_box .member_list {
        padding: 10px 0px;
    }
    .member_list_box_line {
        padding: 0px;
        border: unset;
        margin-bottom: 20px;
    }
    .member_list_box .member_text_mark {
        padding-top: 10px;
    }
}
.member_list_box2 {
    margin: 25px auto 0px;
}
/*footer*/
footer.bg {
    background: #D9D9D9;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding-top: 25px;
    padding-bottom: 25px;
}
@media screen and (max-width: 500px) {
    footer.bg {
        padding: 25px 3vw;
    }
}
footer .ft_top {
    text-align: center;
    width: 255px;
}
footer .ft_top .ft_logo {
    width: 210px;
    margin: auto;
}
footer .ft_top .ft_logo img {}
footer .ft_top .media {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
}
footer .ft_top .media a {
    width: 42px;
    margin: 0px 3px;
    padding-top: 5px;
}
footer .ft_top .media a img {}
footer .footer_info {
    border-left: 1px #8E8582 solid;
    padding-left: 40px;
    margin-left: 50px;
    width: 395px;
}
footer .footer_info .ft_text {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}
footer .footer_info .ft_text .ft_icon {
    line-height: 0px;
    width: 16px;
    margin: 7px 0;
    margin-right: 10px;
}
footer .footer_info .ft_text .ft_icon img {}
footer .footer_info .ft_text .ft_word {
    width: calc(100% - 26px);
}
footer .footer_info .ft_text .ft_word a {
    color: #595757;
}
footer .footer_info .ft_text .ft_word span {
    display: inline-block;
}
address {
    width: 100%;
    font-style: normal;
    line-height: 25px;
    color: #FFFFFF;
    text-align: center;
    background: #3E4044;
    padding: 5px 0px;
}
address a {
    color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
    footer .ft_top {
        width: 220px;
    }
    footer .ft_top .ft_logo {
        width: 180px;
    }
    footer .footer_info {
        margin-left: 40px;
        width: calc(100% - 260px);
    }
}
@media screen and (max-width: 768px) {
    footer.bg {
        flex-wrap: wrap;
    }
    footer .ft_top {
        width: 260px;
    }
    footer .ft_top .ft_logo {
        width: 200px;
    }
    footer .footer_info {
        margin-left: 0px;
        width: 360px;
        border: unset;
        padding-left: 0px;
        margin-top: 5px;
    }
}
@media screen and (max-width: 500px) {
    footer .footer_info {
        width: 100%;
    }
}
/* 影片RWD */
iframe {
    width: 100%;
    height: 314px
}
/* contact-us */
.trans {
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}
.trans .trans_left {
    width: 46%;
}
.trans .trans_left .logo {
    text-align: center;
}
.trans .trans_left .logo>img {
    width: 200px;
}
.trans .trans_left .left_text {
    color: #fff;
}
.trans_info {
    text-align: center;
}
.contact_text {
    padding-top: 50px;
    color: #FFFFFF;
    text-align: left;
}
.contact_text .c_media {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    line-height: 20px;
    margin: 5px 0px;
}
.contact_text .c_media>img {
    width: 20px;
    margin-right: 10px;
}
.contact_text .c_media span {
    display: inline-block;
    color: #fff;
}
.trans .trans_right {
    width: 46%;
    margin-left: 8%;
}
/* trans from */
.trans .trans_right form .transtyle {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    color: #fff;
    margin: 10px 0px;
}
.trans .trans_right form .transtyle>span {
    width: 90px;
    margin-top: 4px;
}
.trans .trans_right form .transtyle>div {
    display: flex;
    align-content: flex-start;
    align-items: flex-start;
    justify-content: flex-start;
    width: calc(100% - 90px);
}
.trans .trans_right form .transtyle>div>.radio_sex {
    width: 30%;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: flex-start;
    margin-right: 2%;
    cursor: pointer;
}
.trans .trans_right form .transtyle>label {
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: flex-start;
}
.trans .trans_right form .transtyle>label>img {
    width: 117px;
}
.trans .trans_right form .transtyle>label>input {
    width: 150px;
    border-radius: 0px;
    display: inline-block;
    padding: 6px 5px;
    margin-left: 20px;
}
.radio_box {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    background: #fff;
    /* border: 1px #000 solid; */
    margin-right: 10px;
}
.radio_box .radio_click {
    width: 14px;
    height: 14px;
    background: #595757;
    display: none;
}
.trans .trans_right form .transtyle>input {
    width: calc(100% - 90px);
    border-radius: 0px;
    padding: 6px 5px;
}
.trans .trans_right form .transtyle>select {
    width: calc(100% - 90px);
    border-radius: 0px;
    padding: 6px 5px;
}
.trans .trans_right form .transtyle>textarea {
    width: calc(100% - 90px);
    border-radius: 0px;
    padding: 6px 5px;
}
.trans .trans_btn {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    margin-top: 35px;
}
.trans .trans_btn .reset_btn {
    border: none;
    background: #706762;
    color: #fff;
    display: block;
    padding: 7px 30px;
    margin-right: 30px;
    font-size: 18px;
    transition: 0.5s;
}
.trans .trans_btn .reset_btn:hover {}
.trans .trans_btn .submit_btn {
    background: #D1A76F;
    color: #fff;
    padding: 4px 30px;
    font-size: 18px;
    cursor: pointer;
    transition: 0.5s;
}
.trans .trans_btn .submit_btn:hover {}
@media screen and (max-width: 1024px) {
    .trans .trans_right {
        width: 50%;
        margin-left: 4%;
    }
    .trans .trans_right form .transtyle>span {
        width: 70px;
    }
    .trans .trans_right form .transtyle>input {
        width: calc(100% - 70px);
    }
    .trans .trans_right form .transtyle>textarea {
        width: calc(100% - 70px);
    }
    .trans .trans_right form .transtyle>label>input {
        margin-left: 10px;
        width: 100px;
    }
}
@media screen and (max-width: 850px) {
    .trans {
        flex-wrap: wrap;
    }
    .trans .trans_left {
        width: 100%;
    }
    .trans .trans_right {
        width: 100%;
        margin-left: 0px;
        margin-top: 30px;
    }
    .trans .trans_right form .transtyle>label>input {
        width: 160px;
    }
}
@media screen and (max-width: 500px) {
    .trans .trans_right form .transtyle>input {
        width: 100%;
    }
    .trans .trans_right form .transtyle>textarea {
        width: 100%;
    }
    .trans .trans_right form .transtyle>div {
        width: 100%;
    }
    .trans .trans_right form .transtyle>label>input {
        width: 110px;
    }
    .trans .trans_btn .reset_btn {
        padding: 7px 20px;
        margin-right: 10px;
    }
    .trans .trans_btn .submit_btn {
        padding: 4px 20px
    }
}
@media screen and (max-width: 400px) {
    .contact_text .c_media {
        justify-content: flex-start;
    }
}
/*product*/
.pro {
    /* padding-top: 30px; */
    z-index: 10;
    position: relative;
}
.pro_bg {
    padding: 2em 1vw 40px;
}
.app_pro_class {
    display: none;
    text-align: center;
    padding: 20px;
    color: #ffffff;
}
.pro_main {}
.pro_home_lists {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: wrap;
    width: 100%;
}
.pro_list {
    width: 23%;
    /* margin: 0px 1% 30px;
    padding: 1.5%; */
    background: #ffffff;
    transition: 0.5s;
    position: relative;
    padding-bottom: 200px;
}
.pro_list:hover {
    background: #f08518;
}
.pro_list:hover .pro_name {
    color: #ffffff;
}
.pro_list:hover .pro_price>.price {
    color: #ffffff;
}
.pro_pic {
    position: relative;
    bottom: 12%;
    box-shadow: 10px 10px 20px -2px rgba(0, 0, 0, 0.5);
    padding-bottom: -50px;
}
.pro_list .pro_pic {
    width: 100%;
    overflow: hidden;
    /* height: 200px; */
}
.pro_list .pro_pic img {
    width: 100%;
    transform: scale(1);
    transition: 0.5s;
    vertical-align: middle;
    max-width: 100%;
    border: 2px #cccccc outset;
    margin: 1% 0 0;
    background-size: cover;
    background: #cfcfcf;
    box-shadow: 3px 8px 12px #cfcfcf;
}
.pro_list:hover .pro_pic img {}
.pro_list .pro_name {
    font-size: 14px;
    color: #3b342e;
    line-height: 1.5em;
    /* padding: 5px 0px; */
}
.pro_list .pro_price {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    align-content: flex-end;
    width: 100%;
    flex-wrap: wrap;
    /* margin-top: 10px; */
    text-align: right;
}
.pro_list .pro_price .price {
    font-size: 20px;
    font-weight: 800;
    color: #f08518;
}
@media screen and (max-width: 1366px) {
    .pro_list .pro_pic {
        /* height: 18vw; */
    }
}
@media screen and (max-width: 1100px) {
    .pro_list {
        width: 30.333333%;
        margin: 0px 1.5% 60px;
        padding: 2%;
    }
    .pro_list .pro_pic {
        /* height: 22vw; */
    }
}
@media screen and (max-width: 768px) {
    .pro {
        /* margin-top: 20px; */
    }
    .pro_list {
        width: 47%;
        margin: 0px 1.5% 60px;
        padding: 3%;
    }
    .pro_list .pro_pic {
        /* height: 36vw; */
    }
    @media screen and (max-width: 1100px) {}
}
@media screen and (max-width: 600px) {
    .pro_list .pro_price .price {
        width: 100%;
    }
}
@media screen and (max-width: 500px) {
    .pro_list {
        width: 95%;
        margin: 0px 2.5% 20px;
        padding: 6%;
    }
    .pro_list .pro_pic {
        /* height: 70vw; */
    }
}
.pro_flex_box {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    padding: 0%;
}
.pro_class_title {
    text-align: center;
    margin: 15px 0;
    font-size: 24px;
    color: #040000;
    font-weight: 800;
    position: relative;
}
.pro_class_title::after {
    content: '';
    display: block;
    position: absolute;
    width: 120px;
    border-bottom: 8px solid #f08518;
    left: 24%;
    bottom: 1px;
    z-index: -1;
}
.app_aside {
    display: none;
}
aside {
    width: 245px;
    margin-right: 5%;
    margin-left: 5%;
}
aside>ul {
    background: #f08518;
    padding: 15px 0px;
}
aside>ul>li {}
aside>ul>li>a {
    display: block;
    background: #f08518;
    color: #ffffff;
    padding: 0px 10px;
    font-size: 15px;
    text-align: center;
    font-weight: 800;
    margin-bottom: 5px;
    cursor: pointer;
    transition: 0.5s;
}
aside>ul>li>a:hover {
    color: #040000;
}
aside>ul>li>ul {
    display: none;
    margin: 6px 0px 10px;
}
aside>ul>li>ul>li {}
aside>ul>li>ul>li>a {
    color: #ffffff;
    font-size: 14px;
    line-height: 20px;
    padding: 5px 10px;
    text-align: center;
    display: block;
    transition: 0.5s;
}
aside>ul>li>ul>li>a:hover {
    color: #040000;
}
.pro_flex_box .pro_home_lists {
    width: calc(95% - 245px);
}
.pro_flex_box .pro_home_lists .pro_list {
    width: 30.333333%;
    margin: 0px 1.5% 60px;
    padding: 2%;
}
.pro_flex_box .pro_home_lists .pro_list .pro_pic {
    /* height: 160px; */
}
/* @media screen and (max-width: 1200px) {
.pro_flex_box .pro_home_lists .pro_list .pro_price .price {
    width: 100%;
}
} */
@media screen and (max-width: 1100px) {
    .pro_flex_box .pro_home_lists .pro_list {
        width: 45%;
        margin: 0px 2.5% 5em;
        padding: 0 4%;
        display: block;
    }
    .pro_flex_box .pro_home_lists .pro_list .pro_pic {
        /* height: 25vh; */
    }
    .pro_flex_box {
        padding: 0;
    }
}
@media screen and (max-width: 1024px) {
    .pro_flex_box .pro_home_lists .pro_list {
        margin: 4% 3% 5%;
        padding: 0% 6% 4%;
        display: block;
        width: 42%;
    }
    .pro_flex_box {
        flex-wrap: wrap;
        flex-direction: column;
    }
    .pro_flex_box .pro_home_lists {
        width: 100%;
    }
    .pro_flex_box .pro_home_lists .pro_list .pro_price .price {
        width: unset;
    }
    aside {
        display: none;
        width: 250px;
        margin: 0px auto 0px;
    }
    .new_box aside {
        display: block;
    }
    .pro_class_title {
        display: none;
    }
    .pro_flex_box .pro_home_lists .pro_list .pro_pic {
        /* height: 24vh; */
    }
    .app_pro_class {
        width: 100%;
        display: block;
        background-color: #f08518;
    }
    .app_aside {
        display: block;
        width: 100%;
        position: relative;
    }
    .app_aside>.pul {
        position: absolute;
        width: 100%;
        z-index: 20;
        opacity: 0.9;
        display: none;
    }
}
@media screen and (max-width: 768px) {
    .pro_flex_box .pro_home_lists .pro_list .pro_pic {
        bottom: 10%;
    }
}
.pro_top {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    width: 100%;
}
.pro_top .main_pic {
    width: 50%;
    margin: 2%;
}
.pro_top .main_pic .big_pic {
    text-align: center;
    width: 100%;
}
.pro_top .main_pic .big_pic img {
    max-width: 100%;
    border: 1px #ababab outset;
    vertical-align: middle;
    margin: 1%;
    box-shadow: 3px 3px 12px grey;
}
.pro_s_data img {
    max-width: 100%;
    border: 3px #ababab outset;
    vertical-align: middle;
    margin: 3%;
    box-shadow: 3px 3px 12px rgb(228, 224, 224);
}
.pro_top .main_pic ul {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}
.pro_top .main_pic ul li {
    width: 31.33%;
    margin: 0px 1% 10px;
    line-height: 0px;
}
.pro_top .pro_data {
    width: 55%;
    padding: 0 2.5%;
}
.pro_top .pro_data .pro_name {
    color: #3b342e;
    font-weight: 600;
    font-size: 22px;
    padding: 20px 0px;
    margin-bottom: 20px;
    border-bottom: 1px #f08518 solid;
}
.pro_top .pro_data .pro_data_text {
    padding-top: 10px;
    display: flex;
}
.pro_top .pro_data .pro_data_text>span {
    width: 50%;
}
.pro_top .pro_data .pro_data_text .pro_s_data {
    font-size: 14px;
    width: calc(100% - 45px);
}
.pro_s_data {
    max-width: 100%;
}
.pro_top .pro_data .pro_data_price {
    display: flex;
    margin-top: 10px;
    text-align: left;
    font-size: 16px;
}
.pro_top .pro_data .pro_data_price .pro_price {
    color: #f08518;
    font-weight: 800;
    font-size: 25px;
}
.pro_text {
    margin: 20px 0px;
    border-top: 1px #ebecf1 solid;
    border-bottom: 1px #ebecf1 solid;
    width: 100%;
}
@media screen and (max-width: 768px) {
    .pro_top .main_pic {
        width: 45%;
    }
    .pro_top .pro_data {
        width: 50%;
    }
}
@media screen and (max-width: 600px) {
    .pro_top {
        flex-wrap: wrap;
    }
    .pro_top .pro_data {
        width: 100%;
    }
    .pro_top .main_pic {
        width: 70%;
        margin: auto;
    }
}
@media screen and (max-width: 500px) {
    .pro_top .main_pic {
        width: 85%;
    }
    .pro_top .pro_data .pro_data_text .pro_s_data {
        /* margin-top: 20px; */
    }
    .pro_top .pro_data .pro_data_price {
        margin-top: 20px;
    }
    .pro_text {
        padding: 0px 3vw;
    }
}
.pro_text_14 {
    font-size: 14px;
}
.albumlist {
    position: relative;
    display: flex;
}
.albumlist ul {
    position: relative;
    display: flex;
    /* justify-content: center; */
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
}
.albumlist li {
    padding: 10px;
    width: 25%;
    display: inline-flex;
}
.albumlist li a {
    display: block;
    border-radius: 0;
    width: 100%;
    padding: 10px;
    border: 2px #dedede solid;
    background-color: #fff;
    -moz-box-shadow: 3px 3px rgba(20%, 20%, 40%, 0.2);
    -webkit-box-shadow: 3px 3px rgba(20%, 20%, 40%, 0.2);
    box-shadow: 4px 4px rgb(100, 100, 100);
}
.albumlist li a:hover {
    background-color: #fff1b2;
    border: 2px #fff solid;
    text-decoration: none;
}
.albumlist img {
    text-align: center;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    top: 0;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.albumlist .pic {
    height: 200px;
    width: 100%;
    background-color: #f3f3f3;
    vertical-align: middle;
    text-align: center;
    position: relative;
}
.albumlist .pic::before {
    content: '';
    display: inline-block;
    height: 100%;
    width: 0;
    vertical-align: middle;
}
.albumlist .txt {
    color: #333;
    text-align: left;
    margin: 3px 0 0 0;
}
@media (max-width: 990px) {
    .albumlist li {
        width: 33.333%;
    }
}
@media (max-width: 768px) {
    .albumlist li {
        width: 50%;
    }
}
@media (max-width: 580px) {
    .albumlist li {
        width: 100%;
    }
    .albumlist .pic {
        height: auto;
    }
}
/*★★★★★★★ 以下是案例分享內容頁 view\case_show\case_show_list.php 的 CSS Document ★★★★★★★*/
.case_showlist {
    position: relative;
    display: flex;
    padding: 0 15px;
    background-color: rgba(0, 0, 0, 0.38);
}
.case_showlist ul {
    position: relative;
    display: flex;
    /* justify-content: center; */
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
}
.case_showlist li {
    padding: 30px 15px;
    width: 33.33%;
    display: inline-flex;
    position: relative;
    border-top: 1px dashed #454545;
}
.case_showlist li:nth-child(-n+3){
    border-top: 0px;
}
.case_showlist li a {
    display: block;
    border-radius: 0;
    width: 100%;
    padding: 10px;
    background: rgba(0, 0, 0, 0.38);
}
.case_showlist li a:hover {
    background: #36373a;
    text-decoration: none;
}
.case_showlist img {
    text-align: center;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    top: 0;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.case_showlist .pic {
    /* height: 200px; */
    width: 100%;
    vertical-align: middle;
    text-align: center;
    position: relative;
}
.case_showlist .pic::before {
    content: '';
    display: inline-block;
    height: 100%;
    width: 0;
    vertical-align: middle;
}
.case_showlist .txt {
    color: #fff;
    text-align: left;
    margin: 3px 0 0 0;
}
@media (max-width: 990px) {
    .case_showlist li {
        width: 33.333%;
    }
}
@media (max-width: 768px) {
    .case_showlist li {
        width: 50%;
    }
}
@media (max-width: 580px) {
    .case_showlist li {
        width: 100%;
    }
    .case_showlist .pic {
        height: auto;
    }
}
/*★★★★★★★ 以上是案例分享內容頁 view\case_show\case_show_list.php 的 CSS Document ★★★★★★★*/
/* 以下是課程及活動內容頁 view\product\product_detail.php 的 CSS Document */
.editor {
    padding: 5px;
    font-size: 100%;
    font-family: "微軟正黑體" !important;
    line-height: 26px;
}
.ed_line01 {
    border-bottom: 1px #cecece dashed;
    margin: 20px 0;
}
/*內文區塊*/
.editor .ed_box01 {
    width: 60%;
    padding-right: 30px;
    display: inline-table;
}
.editor .ed_box02 {
    width: 39%;
    display: inline-table;
}
.editor .ed_box03 {
    text-align: center;
}
.editor .ed_box03 .rowlist {
    width: 32.5%;
    display: inline-table;
    padding: 0 15px;
}
.editor .ed_box04 {}
/*圖片*/
.editor img {
    max-width: 100%;
    display: block;
}
.editor span {
    text-align: left;
    display: block;
    padding-top: 5px;
}
.editor .ed_pic01 {
    float: left;
    margin: 0 20px 5px 0;
    padding: 10px;
    border: 1px #CCC solid;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
    max-width: 320px !important;
    width: 100%;
}
.editor .ed_pic01 img {
    width: 100%;
}
.editor .ed_pic02 {
    float: left;
    margin: 0 20px 5px 0;
    max-width: 200px !important;
    width: 100%;
}
.editor .ed_pic02 img {
    width: 100%;
}
.editor .ed_pic03 {
    margin: 0 20px 5px 0;
    padding: 10px;
    border: 1px #CCC solid;
    width: 100%;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
}
.editor .ed_pic03 img {
    width: 100%;
}
.editor .ed_pic04 {
    margin: auto;
    padding: 10px;
    border: 1px #CCC solid;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
    width: 100%;
}
.editor .ed_pic04 img {
    width: 100%;
}
.editor .ed_pic05 {
    float: right;
    margin: 0 0 5px 20px;
    padding: 10px;
    border: 1px #CCC solid;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
    max-width: 320px !important;
    width: 100%;
}
.editor .ed_pic05 img {
    width: 100%;
}
.editor .ed_pic06 {
    text-align: center;
}
.editor .ed_pic06 .pic {
    display: inline-block;
    padding: 10px;
    border: 1px #CCC solid;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
    max-width: 600px;
}
.editor .ed_pic06 img {
    width: 100%;
}
/*內文文章段落*/
.editor .ed_w01 {
    margin: 10px 0;
}
.editor .ed_w02 {
    margin: 10px 0;
}
.editor .ed_w01 p,
.editor .ed_w02 p {
    text-indent: 2em;
    padding: 0 0 10px 0;
}
.editor .ed_box03 .rowlist .ed_txt01 {
    text-align: left;
}
/*標題字*/
.editor .ed_t1 {
    font-size: 120%;
    color: #761c11;
    font-weight: 600;
    margin: 15px 0 10px 0;
    border-left: 3px #761c11 solid;
    padding: 0 0 0 10px;
}
.editor .ed_t2 {
    font-size: 120%;
    color: #761c11;
    font-weight: 600;
    margin: 15px 0 10px 0;
    text-align: left;
}
.editor .ed_t3 {
    background-image: url(../images/svg/arrow01.svg);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 9px;
    padding: 0 0 0 25px;
    font-size: 120%;
    color: #761c11;
    font-weight: 600;
    margin: 20px 0;
}
/*** 表格 start ***/
.editor .table0 th {
    white-space: nowrap;
    background-color: #67a2c3;
    border-right: #ddd 1px solid;
    text-align: center;
    color: #fff;
}
.editor .table0 th:nth-of-type(2n) {
    background-color: #81b2ce;
}
.editor .rwd-table,
.editor .table0 {
    background: rgb(255, 255, 255);
    overflow: hidden;
}
.editor .rwd-table tr:nth-of-type(2n),
.editor .table0 tr:nth-of-type(2n) {
    background: rgb(255, 251, 244);
}
.editor .table0 td:nth-of-type(1) {
    border-top: #ddd 1px solid;
}
.editor .rwd-table th,
.editor .rwd-table td {
    margin: 0.5em 1em;
}
.editor .rwd-table {
    min-width: 100%;
    line-height: 160%;
}
.editor .rwd-table caption,
.editor .table0 caption {
    text-align: center;
    background-color: #761c11;
    padding: 15px 5px;
    color: #fff;
    border-bottom: 1px #fff dotted;
    font-size: 120%;
}
.editor .rwd-table th {
    display: none;
}
.editor .rwd-table td {
    display: block;
    border-right: 1px #e4e4e4 solid;
    border-bottom: 1px #e4e4e4 solid;
}
.editor .rwd-table td:before {
    content: attr(data-th) " : ";
    font-weight: bold;
    margin-right: 5px;
    color: #2b69aa;
    display: inline-block;
}
.editor .rwd-table th,
.editor .rwd-table td:before {
    font-weight: bold;
}
.editor .table0 td {
    border-right: #ddd 1px solid;
    border-bottom: #ddd 1px solid;
    border-top: #ddd 1px solid;
    padding: 5px;
    margin: 5px;
}
.editor .table0 td:nth-of-type(1) {
    border-left: #ddd 1px solid;
}
@media (min-width: 700px) {
    .editor .rwd-table td:before {
        display: none;
    }
    .editor .rwd-table th,
    .editor .rwd-table td {
        display: table-cell;
        padding: 0.25em 0.5em;
    }
    .editor .rwd-table th:first-child,
    .editor .rwd-table td:first-child {
        padding-left: 0;
    }
    .editor .rwd-table th:last-child,
    .editor .rwd-table td:last-child {
        padding-right: 0;
    }
    .editor .rwd-table th,
    .editor .rwd-table td,
    .editor .table0 th,
    .editor .table0 td {
        padding: 10px !important;
    }
}
/*** 表格 end ***/
@media (max-width: 800px) {
    .editor .ed_pic02 img {
        float: none;
        max-width: inherit !important;
        margin: 0 0 10px 0;
    }
}
@media (max-width: 640px) {
    .editor .ed_pic01,
    .editor .ed_pic02,
    .editor .ed_pic05 {
        max-width: 100% !important;
        float: inherit;
        margin: inherit;
    }
    .editor .ed_pic06 .pic {
        width: 100%;
    }
    .editor .ed_box01 {
        width: 100%;
        padding-right: 0;
    }
    .editor .ed_box02 {
        width: 100%;
    }
    .editor .ed_box03 .rowlist {
        width: 100%;
        display: inline-table;
        padding: 0 0 20px 0;
    }
}
/*20210323*/
.editor .ed_w02 {
    position: relative;
}
.editor .ed_w02 .picbox div {
    padding: 10px;
    border: 1px solid #CCC;
    margin-bottom: 15px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
}
.editor .ed_w02 .picbox img {
    width: 100%;
}
/*20210414*/
.editor .ed_pic03 a {
    height: 220px;
    width: 100%;
    background-color: #ececec;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    text-align: center;
    overflow: hidden;
    box-shadow: 0 0 2px 2px rgb(0 0 0 / 10%);
    border: 6px #ffffff solid;
}
.editor .ed_pic03 img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    width: auto;
}
.editor .ed_pic01 .picimg a {
    display: block;
}
/* 以上是課程及活動內容頁 view\product\product_detail.php 的 CSS Document */
/* 個人財富管理及財富傳承規劃諮詢 */
.personal_box {
    color: #FFFFFF;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 20px 0px;
}
.personal_box .personal_text {
    width: 100%;
    padding-top: 20px;
}
.personal_text1{
    text-align: center;
    margin-bottom: 30px;
}
.personal_box .personal_text ul {
    margin: 0;
    padding: 0;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.personal_box .personal_text ul li {
    position: relative;
    text-align: left;
    width: 35%;
    margin: 10px 5% 10px 10%;
    font-size: 20px;
    letter-spacing: 1px;
}
.personal_box .personal_text ul li:after {
    content: "";
    position: absolute;
    top: 11px;
    left: -1em;
    width: 10px;
    height: 10px;
    background: #D1A76F;
}
.personal_box .personal_text ul li > span{
    color: #D1A76F;
    font-weight: bold;
}
.personal_box .personal_text.personal_text2{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: #EAD5B4;
    padding: 0;
    color: #333;
}
.personal_text2 .left{
    width: 50%;
    margin: -50px 0;
}
.personal_text2 .right{
    width: 50%;
    padding: 40px 5%;
    font-size: 16px;
}
.personal_text2 .left img{
    width: 100%;
}
.personal_text2 .right h3{
    font-size: 24px;
    line-height: 2;
    margin: 15px 0;
}
.personal_text2 .right h3 strong{
    position: relative;
    display: inline-block;
}
.personal_text2 .right h3 strong::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #D1A76F;
    width: 45%;
    height: 3px;
    border-radius: 3px;
}
.personal_text2 .right p{
    font-size: 18px;
    line-height: 1.8;
    margin: 15px 0;
}
.personal_box .personal_text.personal_text3{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 50px 0;
    z-index: 1;
    position: relative;
}
.personal_text3 .Img{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    z-index: 3;
    position: relative;
    background-color: #EDF0F2;
    padding: 50px 0 30px;
}
.personal_text3 .Img p{
    width: 50%;
}
.personal_box .personal_text.personal_text3 .Txt {
    padding: 40px 5% 40px;
    background-color: rgba(0, 0, 0, 0.3);
    width: 90%;
    margin: 0px 5% -27px;
    display: block;
    z-index: 5;
    position: relative;
    font-size: 18px;
    line-height: 2;
}
@media screen and (max-width:1024px) {
    .personal_box .personal_text {
        padding-top: 0px;
    }
    .personal_box .personal_text ul li {
        width: 100%;
        margin: 10px 0% 10px 6%;
        font-size: 18px;
        letter-spacing: 0;
    }
    .personal_text2 .right h3 {
        font-size: 21px;
    }
    .personal_text2 .right p {
        font-size: 16px;
    }
    .personal_text2 .left {
        width:100%;
        margin: 0;
    }
    .personal_text2 .right {
        width: 100%;
        padding: 20px 5%;
        font-size: 16px;
    }
    .personal_box .personal_text.personal_text3 {
        margin: 0px 0;
    }
    .personal_text3 .Img p {
        width: 100%;
    }
}
/* 企業投資架構暨整體財務規劃與諮詢 */
.corporate_box {
    color: #FFFFFF;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 20px 0px;
}
.corporate_box .corporate_text {
    width: 100%;
    padding-top: 20px;
}
.corporate_text h3{
    font-size: 24px;
    line-height: 1.5;
    margin: 0px 0 15px;
    padding-bottom: 10px;
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100px;
    position: relative;
    color: rgb(220, 165, 92);
}
.corporate_text h3::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(209, 167, 111, 0.5);
    width: 45%;
    height: 3px;
    border-radius: 3px;
}
.corporate_text p{
    font-size: 18px;
    line-height: 1.8;
    margin: 15px 0;
}
.corporate_text.corporate_text1{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.corporate_text1 .facItem {
    width: 33.3333333333%;
    padding: 40px 30px;
}
.corporate_text1 .item {
    -webkit-box-shadow: 0px 0px 57px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 57px 0px rgba(0, 0, 0, 0.1);
    width: 100%;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}
.corporate_text1 .Txt {
    padding: 30px;
}
.corporate_text1 .Txt .title {
    font-size: 25px;
    font-weight: 600;
    color: #000;
}
.corporate_text1 .Txt .text {
    color: #262626;
    font-size: 16px;
    line-height: normal;
    line-height: 1.5;
    letter-spacing: 1px;
    margin-top: 20px;
}
.corporate_text1 .Img{
    display: flex;
}
.corporate_text1 .Img img{
    width: 100%;
}
@media screen and (max-width:1400px) {
    .corporate_box .bg{
        padding: 65px 2%;
    }
}
@media screen and (max-width:1024px) {
    .corporate_box .bg{
        padding: 0;
    }
    .corporate_text1 .facItem {
        width: 100%;
        padding: 20px 30px;
    }
    .corporate_text h3{
        min-height: auto;
    }
}
/* 企業併購諮詢與規劃 */
.mergers_box {
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 20px 0px;
    position: relative;
    width: 100%;
}
.mergers_box .mergers_text {
    width: 100%;
    max-width: 1366px;
    margin: 0 auto;
    padding-top: 20px;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.mergers_box .mergers_text .facItem{
    position: relative;
    width: 100%;
    padding-left: 25px;
    margin-bottom: 35px;
}
.mergers_box .mergers_text .facItem::before{
    content: "";
    position: absolute;
    display: block;
    width:1px;
    height: 50%;
    top: 0;
    left: -17px;
    background: linear-gradient(to bottom, rgba(255,255,255,0.3), rgba(255,255,255,0));
}
.mergers_box .mergers_text .facItem::after {
    content: "";
    position: absolute;
    display: block;
    border-radius: 50%;
    width: 7px;
    height: 7px;
    top: -5px;
    left: -20px;
    background-color: rgba(255, 255, 255, 0.5);
}
.mergers_text h3{
    font-size: 24px;
    line-height: 1.5;
    margin: 2px 0 15px -25px;
    padding-bottom: 10px;
    width: 100%;
    position: relative;
    letter-spacing: 1px;
}
.mergers_text h3 strong{
    display: inline-block;
    background-color: #3C405F;
    padding: 7px 30px;
    position: relative;
}
.mergers_text h3 strong::after {
    content: "";
    position: absolute;
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    top: 0;
    right: -24px;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    border-left: 25px solid #3C405F;
}
.mergers_text p{
    font-size: 18px;
    line-height: 1.8;
    margin: 15px 0;
}
.mergers_text ul{
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}
.mergers_text ul li{
    width: 25%;
    font-size: 20px;
    line-height: 2;
    position: relative;
    color: #EAD5B4;
    font-weight: bold;
    padding-left: 25px;
}
.mergers_text ul li::before {
    content: "";
    position: absolute;
    display: block;
    top: 17px;
    left: 4px;
    width: 9px;
    height: 9px;
    background-color: #EAD5B4;
}
.mergers_text ul li::after {
    content: "";
    position: absolute;
    display: block;
    top: 13px;
    left: 0;
    width: 15px;
    height: 15px;
    border: 1px solid #EAD5B4;
}
.mergers_text .Img{
    width: 100%;
    text-align: center;
}
.mergers_text .Img img{
    max-width: 100%;
}
.mergers_text .ItemImg .Txt{
    background-color: rgba(255, 255, 255, 0.2);
    width: 86%;
    margin: 0 7% -30px;
    padding: 40px 5%;
}
.mergers_text .ItemImg .Txt p{
    font-weight: bold;
    font-size: 22px;
}
@media screen and (max-width:1024px) {
    .mergers_box .bg{
        padding: 25px;
    }
    .mergers_text h3 {
        font-size: 18px;
        margin: 2px 0 15px -25px;
        padding-bottom: 10px;
    }
    .mergers_text p {
        font-size: 16px;
    }
    .mergers_text h3 strong::after {
        right: -19px;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-left: 20px solid #3C405F;
    }
    .mergers_text .ItemImg .Txt {
        padding: 20px 5% 40px;
    }
    .mergers_text ul li {
        width: 50%;
        font-size:16px;
        padding-left: 17px;
    }
    .mergers_text .ItemImg .Txt p {
        font-size: 18px;
    }
    .mergers_text ul li::after {
        top: 11px;
        left: 0;
        width: 10px;
        height: 10px;
    }
    .mergers_text ul li::before {
        top: 14px;
        left: 3px;
        width: 6px;
        height: 6px;
    }
}
/**/
.serviceBox{
    background-color: rgba(0, 0, 0, 0.8);
    position: relative;
    margin-top: 30px;
}
.serviceBox .bg{
    padding: 0px 0;
    overflow: visible;
}
.serviceBox .service_title {
    width: 100%;
    text-align: center;
    position: relative;
    top: -30px;
}
.service_title h3 {
    display: inline-block;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
  background-color: transparent;
  }
.service_title h3 strong {
    color: #000;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  background-color: rgba(255, 255, 255, 0.8);
  position: relative;
  padding: 12px 24px;
  margin: 0;
  display: inline-block;
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
  }
.service_list_newbox{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin:40px 0;
    background-color: #EAD5B4;
    position: relative;
}
.service_list_newbox::before{
    content: "";
    position: absolute;
    display: block;
    width: 80%;
    height: 1px;
    bottom: -40px;
    left: 10%;
    border-bottom: 1px dashed #666;
}
.service_list_newbox:last-child::before{
    display: none;
}
.service_list_newbox:first-child{
    margin-top: 0;
}
.service_list_newbox:nth-child(even){
    background-color: rgb(80, 79, 80);
    color: #fff;
}
.serviceBox .service_list_newbox:nth-child(even) .service {
    color: #fff;
}
.service_list_newbox .service_list_s_box {
    width: 27%;
    margin: 0;
    position: relative;
    z-index: 1;
}
.service_list_newbox .service_list_pic{
    z-index: 3;
    position: relative;
}
.service_list_newbox .service_list_s_box .service_list_text{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 5;
}
.service_list_newbox .service_list_s_box .service_list_text > span{
    background-color: rgba(0, 0, 0, 0.7);
    padding: 13px 7%;
    color: #fff;
}
.service_list_newbox .service_main{
    width: 73%;
    padding: 0 20px;
}
.serviceBox .service_list_box{
    color: #333;
}
.serviceBox .service{
    color: #333;
}
.serviceBox .service .service_box .service_s_box .service_text {
    color: #fff;
}
.serviceBox .service .service_box {
    padding-top: 15px;
}
.serviceBox .service .service_box .service_s_box {
    width: 46.5%;
    margin: 12px 0px;
    padding: 8px 2vw;
}
.serviceBox .service .service_box .service_s_box:nth-child(odd){
    margin-right: 3.5%;
}
.serviceBox .service_list_box .service_list_s_box .service_list_pic img{
    width: 100%;
}
.serviceBox .service_list_box .service_list_s_box .service_list_pic img:hover {
    transform: none;
}
.serviceBox .service_list_box{
    overflow: hidden;
}
.eatbox.service_list_newbox {
    background: url(../images/mine/title_bg/title_bg_service06_bk.webp) no-repeat top center;
    background-size: 100% auto;
    margin: 100px 10% 0;
    width: 80%;
    position: relative;
    padding: 70px 0 0;
}
.eatbox.service_list_newbox::before{
    content: "";
    display: block;
    width: 126%;
    height:calc(100% + 100px);
    position: absolute;
    top:-100px;
    left: -13%;
    background-color: #d7c5bc;
    z-index: -1;
}
.eatbox .service_box_m_food {
    background: #181311;
}
.eatbox.service_list_newbox .service_title{
    position: absolute;
}
.eatbox.service_list_newbox .service_list_s_box .service_list_text {
    position: relative;
    height: auto;
}
.eatbox.service_list_newbox .service_list_s_box {
    width: 100%;
    margin-bottom: 20px;
}
.eatbox.service_list_newbox .service_main {
    width: 100%;
}
.eatbox.service_list_newbox .service_list_s_box .service_list_pic img {
    width: auto;
}
@media screen and (max-width:768px) {
    .service_list_newbox .service_list_s_box {
        width: 100%;
        padding: 0px 10%;
    }
    .service_list_newbox .service_main {
        width: 100%;
        padding: 0 20px;
    }
    .service .service_box {
        justify-content: center;
    }
    .eatbox.service_list_newbox {
        margin: 60px 0% 0;
        width: 100%;
    }
    .eatbox.service_list_newbox::before {
        height: calc(100% + 60px);
        top: -60px;
    }
}

/*商業服務-子選項*/
.service_box .bg {
    padding: 0px 10% 20px;
    width: 100%;
}
.personal_box.service_box .personal_text.personal_text3 .Txt{
    padding: 25px 5% 25px;
    margin: 0px 5% 0px;
}
.personal_box.service_box .personal_text.personal_text3 .Txt p{
    margin: 15px 0;
}
.service_box .s_title {
    font-size: 28px;
    color: #D1A76F;
    font-weight: bold;
    margin-bottom: 50px;
}
.service_box .btn_link {
    width: 100%;
    text-align: center;
    margin: 70px 0 40px;
  }
.service_box .btn_link  > span a {
    background-color: rgba(0, 0, 0, 0.3);
    padding: 13px 7%;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    position: relative;
    border-right: 8px #D1A76F solid;
    z-index: 1;
}
.service_box .btn_link > span a::before {
    content: '';
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.3);
    transform-origin: center right;
    transform: scaleX(0);
    transition: transform 0.5s ease-in-out;
    display: block;
}
.service_box .btn_link > span a:hover::before {
    transform-origin: center left;
    transform: scaleX(1);
}