@charset "utf-8";

/*
關於CSS設定說明
CSS屬性是會繼承的，而且還是由上往下繼承。
同樣元素設定16px 後 12px 再 15px 最後會以最後設定的15px為準
但是有兩種情況除外:
1.絕對路徑命名. 如: .xx .yy .zz p {設定值;}
2.important.  如: .xx p {設定值 !important;}

CSS3選取器語法 :nth-child(n)

*/
/* logo */
.nav-brand h1{
    display: block;
    background: url(https://pic03.eapple.com.tw/ttwu/20220517_new_logo.svg);
    background-size: contain;
    width: 203px;
    height: 33px;
    background-repeat: no-repeat;
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
}

.nav-header {
    height: 100%;
}

a.nav-brand {
    padding: 2px 0;
    display: flex;
    height: 100%;
    width: 100%;
    align-items: center;
}

.navigation-portrait .nav-brand {
    justify-content: center;
}

@media screen and (max-width: 768px){
    .nav-header{padding: 2% 0;}}



/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */



/*上方選單解除滑動固定
.header_area.sticky { position:relative;}
*/


/*上方選單右邊設定 臉書/LINE/電話/信箱
.tp_links a:before {寬高大小設定}
.tp_links a.me_tp_fb {}
.tp_links a.me_tp_fb:before {背景換圖/建議.SVG}
.tp_links a.me_tp_line {}
.tp_links a.me_tp_line:before {背景換圖/建議.SVG}
.tp_links a.me_tp_call {}
.tp_links a.me_tp_call:before {背景換圖/建議.SVG}
.tp_links a.me_tp_mail {}
.tp_links a.me_tp_mail:before {背景換圖/建議.SVG}
*/

/* 首頁按鈕【案例報告書】隱藏 */
ul.nav-menu.align-to-right li:nth-child(3) {
    display: none;
}


.tp_links a:before {
    margin-bottom: -4px;
    margin-right: 5px;
    border-radius: 3px;
	background-size: contain;
	transition: all 0.3s;
}
.tp_links a:hover:before {transition: .8s ease-in-out; transform: rotateY(360deg);}

/*電腦LOGO
.nav-brand {}
*/
.nav-brand { padding-top: 5px;}
/*手機LOGO
.nav-brand-m {}
*/


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*預設解除背景輪播*/
#content_main { margin:0;}
.bannerindex { position:static; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;}
.swiper-slide img { height:auto;}
@media screen and (max-width: 768px) {
.bannerindex { padding:0; margin:0;}
}


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/* -- */
span.submenu-indicator-chevron {
    display: none;
}

/* -- */
.nav-menu>li:hover>a, .nav-menu>li.active>a, .nav-menu>li.focus>a{color: #006c60;}
.main_header_area {background:#fff; box-shadow: 0 2px 4px 0 rgb(0 0 0 / 10%);}

.nav-header{padding: 0;}
.nav-menu { margin: 0; }
.header_area{width: 100%;}

ul.nav-menu.align-to-right{margin: 0;}


.nav-menu>li a:not(li.tp_links a){padding: 10px 20px;height: 50px;margin: 0;}
.nav-menu>li a:not(li.tp_links a):hover{transition: ease-in-out 0.3s;background: #006c60;color: white;border-bottom:inset solid 2px #fff;}
.nav-menu>li a:not(li.tp_links){border-style: solid;border-color: #dddddd;line-height: 8vh;border-left-width: 1px;margin-right: 0; border-top: none;border-bottom: none;border-right: none;}
li.tp_links{ display: none;}



.nav-menu>li{position: relative;}
.nav-menu>li>a{text-align: center;font-weight: 600;display: block;position: relative;color: #333333;letter-spacing: 2px;font-size: 15px;padding: 0;}


/* -- */
header.header_area.sticky .nav-menu>li a{line-height: 6vh;transition: ease-in-out 0.5s;}
header.header_area.sticky{background:rgba(255,255,255,.8) ;}
/* -- */
/* 往兩邊放 */
.main_header_area .container {
    max-width: 1590px;
    margin: auto;
}



/* -- */

@media screen and (max-width: 768px){
    .nav-menu>li a:not(li.tp_links,.nav-menu>li>.nav-dropdown){line-height: 5vh;}
    .header_area{position: relative;}
}
/* 關掉 */
.tp_links a.me_tp_call:before { display:none; }
.tp_links a.me_tp_mail:before { display:none; }

.news_part {
    display: none;
}

.path{display: none;}

/* menu字 */
.nav-toggle:after{display: none;}

/* --- */

/* 小三角 */
.submenu-indicator{margin-top:25px}

/*下拉*/
.nav-menu>li>.nav-dropdown { border: none;text-align: center;}
.submenu-indicator-chevron {border-color: transparent #999999 #999999 transparent;margin-top: -2px;}
.nav-menu>li:hover>a .submenu-indicator-chevron, .nav-menu>.active>a .submenu-indicator-chevron, .nav-menu>.focus>a .submenu-indicator-chevron { border-color: transparent #000 #000 transparent;}
.nav-dropdown > li > a { line-height: 4vh !important;line-height: initial;color: #555555; border-bottom: 1px solid #f6f6f638; background: #fff; font-size: 15px;}
.nav-dropdown>li:hover>a, .nav-dropdown>li.focus>a { color: #006c60;}
.nav-dropdown > li > a:hover, .nav-dropdown > li > a:focus { line-height: initial;color: #ffffff; background: #006c60;}


/* ==== */

/* f========== */
/* f========== */
/*footer*/


.footer {
    background: #ffffff;
    padding-top: 60px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.copy {background: #006c60;margin-top: 44px;}
.footer_menu a {
    width: 48%;
    text-align: center;
    background: #ffffff;
	transition: all 0.3s;
}
.footer_menu a:hover { background: -webkit-linear-gradient(45deg, rgb(54 175 160 / 97%)35%, rgb(53 136 187)60%);}



/* -f_logo- */
.footer_logo img {
    max-width: 100%;
}

.footer_logo{width: 300px;}

/* .footer_info ul {
    width: calc(100% - 336px);
} */
.footer_logo{display:none;}

.footer_info{display: flex;justify-content: space-evenly;}


/* -footer和關鍵字-- */
@media screen and (max-width: 768px) {.footer_info {
    display: initial;}
    .footer_info ul{display: block;}
}

/*聯絡我們*/

.animated-arrow {
    background: #006c60;
    display: block;
    cursor: pointer;
    position: relative;
    transition: all .3s linear;
    padding-left: 90px;
}

svg.arrow.arrow--right{opacity: 0;}

.animated-arrow:hover {
    filter: brightness(1.2);
    transition: ease-in-out 0.3s;
    padding-left: 5%;
}

.animated-arrow:hover svg.arrow.arrow--right{opacity: 1;}





/*聯絡我們*/
/*大範圍*/
.contact_content .information_left{width: 100%;margin-top: 100px;text-align: center;}
.contact_content .information_right{width: 100%;text-align: center;padding-left: 0;}
.contact_content .style1{display: flex;flex-wrap: wrap;}
.blank_letter {border-bottom: 2px solid #a97300;padding: 5px 10px;letter-spacing: 5px;color: #515155;text-align: center;
	display: inline-block;font-weight: 500;}

/*聯絡資訊欄*/
.list_before{margin-top: 50px;}
.list_before .TEL{display: none;}
.list_before .ADD{display: none;}
.list_before li{margin: 0 0;}
.list_before.info li {padding-left: 0px;}

/*表單欄*/

.contact_form {width: 80%;margin: 100px auto;}
.contact_form li {border-bottom: 1px solid #ddd;padding-left: 0px; width: 100%;display: inline-block;
	margin-bottom: 10px;height: auto;margin: 5px;}
.contact_form li .form__label {width: 15%;margin-left: 0px;text-align: left;}
.contact_form li .form__insert {width: 80%;display: inline-block;text-align: left;}
.form select {background-color: rgba(0,0,0,0);border: 1px solid #ccc;width: 100%;transform: translateY(-5px);}
input[type="checkbox"], input[type="radio"] {margin: 0 5px 0 10px;}
.captcha{transform: translateY(-5px);outline: none;}
.noborder {outline: none;padding: 0;}
.note {font-size: 15px;margin-right: 10%;}
.red{color: #a97300;}
.contact_form li:nth-last-child(2) .noborder{background: #f7f7f7;height: 30px;border: 1px solid #eee;}
.contact_form li:nth-last-child(2) img{margin-left: 15px;}

.contact_content .information_left{display: none;}


/* -- */
.contact_content .information_left{display:initial;}
h4.blank_letter.i {
    display: none;
}

/* 地圖 */
.contact_page .main_part{max-width: 2000px;}

ul.list_before.info li:nth-child(-n+5){display: none;}
.list_before.info iframe{height: 30vh;}

@media screen and (max-width: 768px){
.list_before.info {
    max-width: 768px;
    width: 100%;
}}


.information_right.fadeInRight.animated15.delay5 {
    max-width: 1200px;
    flex-direction: column;
    align-items: center;
    margin: auto;
}





.information_left.fadeInLeft.animated15.clearfix {
    margin: 0;
padding: 0;
}

.list_before.info iframe {
    width: 100%;
}

.list_before {
    margin-top: 0px;
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*文章設定*/
/*一排呈現
.subbox_item { width:100%;}
*/

.subbox_item a:after { background: #30402947;}

.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category {
    background: #304029 !important;
}
.blog_back a.article_btn_back { background: #31a8ff;}
.blog_back a.article_btn_prev { background: #304029;}
.blog_back a.article_btn_next { background: #304029;}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
.album_page .show_content { padding-top: 50px;}
.show-list .show_name {text-align: center;}
.show-list .item:hover .show_name { color: #006c60;}

/*相本分類全版面 ( 限制最寬2000px
.work_page .main_part { max-width:2000px;}
.work_page .show_content { padding:0; width:100%;}
.work_page .show-list .item { width:33%; display:inline-block; float:none; margin:0; padding:0;}
@media screen and (max-width: 768px) {
.work_page .show-list .item { width:49%;}
}
@media screen and (max-width: 570px) {
.work_page .show-list .item { width:100%;}
}
.work_page .show-list .item a { max-width:100%;}
.work_page .show-list .show_pic { height:auto; line-height:0;}
.work_page .show-list .show_pic img { max-width:100%; max-height:100%;}
.work_page .show-list .show_name { position:absolute; top:50%; right:10%; width:80%; height:auto; line-height:160%; font-size: 20px; color: #FFFFFF !important; border: solid 1px #fff; text-align: center; margin: -20px 0 0 -120px; padding:5px 20px; transition:all ease-in .3s; opacity:0;}
.work_page .show-list .item:hover .show_name {opacity:1;}
*/


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
.album_info_page .show_content { padding-top: 50px;}
.other_album_choice li { background: #006c60; border-radius: 0;}
.other_album_choice li:hover {filter: opacity(0.8);}

/*相本列表
.work_info_page .main_part { max-width:2000px;}
.work_info_page .show_content { padding:0; width:100%;}
.work_info_page .subalbum-menu { text-align:center;}
.work_info_page .subalbum-menu h2 { float:none;}
.work_info_page .pic-list .item { margin:0; padding:10px; width:49%; float:none; display:inline-block;}
@media screen and (max-width: 768px) {
.work_info_page .pic-list .item { width:100%;}
}
.work_info_page .pic-list .show_pic { height:auto; line-height:0;}
.work_info_page .pic-list .show_pic img { max-width:100%; max-height:100%;}
.work_info_page .pic-list .item a { max-width:100%; pointer-events: none; cursor: default; } 取消連結被點擊效果
*/


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */





@media screen and (max-width: 768px) {
/* 開啟手機板下方按鈕所需設定 */
#bottom_menu {display: block; }
.footer.with_shopping_mode { padding:30px 0 70px; }
#to_top { bottom:60px;}
}

@media screen and (max-width: 600px) {
.banner { height: 260px;}
.banner h5 {
    font-size: 36px;
    top: 37%;
}
}



/* =======關掉===== */
 /* banner關掉 */
.banner{font-size: 0px;}
.banA{display: none;}
.banB{
    background-image:url(https://pic03.eapple.com.tw/ttwu/03_report_bg.png) ;
    height: 250px;
    background-position:left;
    background-size: cover;
    position: relative;
}
.banD{display: none;}
.banC{
    background-image:url(https://pic03.eapple.com.tw/ttwu/connect_bg.png) ;
    height: 250px;
    background-position:left;
    background-size: cover;
    position: relative;

}
.banE{display: none;}
.banF{display: none;}
.banG{display: none;}
.banner.banblog{display: none;}


.banner.banC h5:before {
    content: "與我們聯繫";
    /* font-size: 36px; */
    font-size: 23px;
    line-height: 41px;
    letter-spacing: 0px;
    position: absolute;
    top: 40%;
    left: 10%;
    text-shadow: none;
    color: #008173;

}


.banner.banC h5:after {
    content: "";
    width: 10%;
    height: 1%;
    background: #008173;
    position: absolute;
    top: 60%;
    left: 10%;
}

/* --- */
.banner.banB h5:before {
    content: "案例報告書";
    /* font-size: 36px; */
    font-size: 23px;
    line-height: 41px;
    letter-spacing: 0px;
    position: absolute;
    top: 40%;
    left: 10%;
    text-shadow: none;
    color: #008173;
}


.banner.banB h5:after {
    content: "";
    width: 10%;
    height: 1%;
    background: #008173;
    position: absolute;
    top: 60%;
    left: 10%;
}




/* --- */



@media screen and (max-width: 600px){
    .banner h5 {
        font-size: 0px;
    }

    .banner.banB h5:after {
        content: "";
        width: 20%;
        height: 1%;
        position: absolute;
        top: 70%;
        left: 10%;
    }

    .banner.banC h5:after {
        content: "";
        width: 20%;
        height: 1%;
        position: absolute;
        top: 70%;
        left: 10%;
    }


}


@media screen and (max-width: 425px) {
    .banC{
        height: 100px;

    }
    .banB{
        height: 100px;

    }
    }




/* ---------- */
/* 小撇步 */

.time,.other_promotion .pmtTime {
    display: none;
}


.promotion_title{border: none;}


.promotion_title h2{border-bottom: 2px solid #006c60;}

body.share_page .main_part {
    display: flex;
    flex-direction: column-reverse;
}

.other_promotion li:hover {
    /* box-shadow: 3px 4px 7px 0px #e3e3e3; */
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: solid 1px #60D0BA;
    border-radius: 10px;
    box-sizing: border-box;
    border-radius: 5px;
}

.other_promotion li:hover {
    border: solid 1px #60D0BA;
    background: #EAF6F3;
}


.other_promotion li {
    padding: 25px 15px;
    border-radius: 10px;
    border: solid 1px #60D0BA;
}

.pmtTitle {
    text-align: center;
}

.other_promotion li:hover h3 {
    text-decoration: none;
}

.other_promotion .pmtTitle h3{position: relative;}

.other_promotion li h3:after {
    content: '';
    display: inline-block;
    background-image: url(https://pic03.eapple.com.tw/ttwu/arrow_post1.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    width: 26px;
    height: 26px;
    right: 0px;
    top: 0;
    position: absolute;
    transition: all 0.5s ease;
    pointer-events: none;
}

.other_promotion li:hover h3:after {
    background-image: url(https://pic03.eapple.com.tw/ttwu/arrow_post2.png);
}


/* 空白刪除 */
.clearfix{order: 1;}
@media screen and (max-width: 425px){
.other_promotion li{padding: 7px 36px;margin: 5px 1%;}
/* ------ */


/* 分享文章背景 */

h5.blog_le_t{display: none;}

.blog_le .accordion {
    border: 1px #60D0BA solid;
}

.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category {
    background: #008974 !important;
}

.blog_search input[type=search] {
    border: solid 1px #60D0BA;
}

.share_page #content {
    background-image: url(https://pic03.eapple.com.tw/ttwu/share_page_bg.png);
    background-position: revert;
    background-size: cover;
    background-repeat: no-repeat;
}

.blog_page  #content {
    background-image: url(https://pic03.eapple.com.tw/ttwu/blog_page_bg.png);
    background-position: revert;
    background-size: cover;
    background-repeat: no-repeat;
}
/* ====icon資訊======== */
/*資訊icon*/
.footer_info li p{position: relative;padding-left: 22px;margin-left: 10px;}
.footer_info li p.tel:after{content: "";position: absolute;top: 3px;left: 0;width: 17px;height: 17px;background-size: contain !important;background: url(https://pic03.eapple.com.tw/ttwu/f_iconl_tele.svg);}
.footer_info li p.phone:after{content: "";position: absolute;top: 3px;left: 0;width: 17px;height: 17px;background-size: contain !important;background: url(https://pic03.eapple.com.tw/ttwu/f_iconl_call.svg);}
.footer_info li p.mail:after{content: "";position: absolute;top: 3px;left: 0;width: 17px;height: 17px;background-size: contain !important;background: url(https://pic03.eapple.com.tw/ttwu/f_iconl_email.svg);}
.footer_info li p.add:after{content: "";position: absolute;top: 3px;left: 0;width: 17px;height: 17px;background-size: contain !important;background: url(https://pic03.eapple.com.tw/ttwu/f_iconl_map.svg);}
.footer_info li p.fax:after{content: "";position: absolute;top: 3px;left: 0;width: 17px;height: 17px;background-size: contain !important;background: url(https://pic03.eapple.com.tw/ttwu/f_iconl_fax.svg);}
.footer_info li p.taxid:after{content: "";position: absolute;top: 3px;left: 0;width: 17px;height: 17px;background-size: contain !important;background: url(https://pic03.eapple.com.tw/ttwu/f_iconl_bill.svg);}