@charset "utf-8";


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

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

*/


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


/*上方選單解除滑動固定
.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}
*/
.tp_links a:before{display:none;}

/*電腦LOGO
.nav-brand {}
*/
.nav-brand { width: 100%;transition: all 0.8s;}

/*手機LOGO
.nav-brand-m {}
*/


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



/*banner*/

.bx_banner{height: 30vw;display: flex;flex-wrap: wrap;align-items: center;background-position: center;position: relative;background-size: cover;position: relative;}
.bx_figure{width: 100%;position: absolute;left: 0;}
.bx_figure figure{max-width: 100%;min-height: 30vw;width: 100%;height: 100%;background: url(../images/banner_cloud.png) repeat-x;-webkit-animation: animate2 500s linear infinite;animation: animate2 500s linear infinite;background-size: cover;}
@-webkit-keyframes animate2{from{background-position:0px;}to{background-position:30000px;}}
@keyframes animate2{from{background-position: 100%;}to{background-position: -30000px;}}

.bx_title{max-width: 1500px;width: 100%;margin: 0 auto;color: #FFF;padding: 0 4vw !important;position: relative;z-index: 9;}
.bx_title h4{padding: 5px 0 15px 25px;margin-bottom: 2.5vw;border-left: 4px solid #FFF;}
.bx_title h4 b{display: block;font-size: 50px;line-height: 100%;letter-spacing: 4px;font-style: italic;font-family: "Playfair Display", serif;text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);font-weight: normal;margin-bottom: 10px;}
.bx_title h4 span{display: block;font-size: 22px;font-style: italic;letter-spacing: 4px;font-weight: 500;text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);}
.bx_title p{max-width: 450px;width: 100%;}
.bx_title p b{display: block;font-size: 18px;line-height: 120%;margin-bottom: 20px;font-weight: 400;letter-spacing: 1px;text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);}
.bx_title p span{display: block;font-size: 14px;line-height: 160%;letter-spacing: 1px;text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);}

@media screen and (max-width: 1190px) {
    
.bx_banner{height: 400px;}
.bx_figure figure{min-height: 400px;}
.bx_title{max-width: 800px;padding: 0 30px !important;}
.bx_title h4{padding: 5px 0 10px 20px;margin-bottom: 2.5vw;}
.bx_title h4 b{font-size: 35px;margin-bottom: 10px;}
.bx_title h4 span{display: block;font-size: 20px;}
.bx_title p b{font-size: 16px;margin-bottom: 10px;}
.bx_title p span{font-size: 14px;line-height: 150%;}

}

@media screen and (max-width: 800px) {
    
.bx_banner{height: 350px;}
.bx_figure figure{min-height: 350px;}
.bx_title h4{padding: 5px 0 10px 15px;margin-bottom: 15px;}
.bx_title h4 b{font-size: 26px;}
.bx_title h4 span{font-size: 18px;}
.bx_title p b{font-size: 15px;}
.bx_title p span{font-size: 13px;}

}



/*預設解除背景輪播*/
#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;}
}

@media screen and (max-width: 768px) {
    /* 大圖調整 */
    .swiper-slide img {
        animation-fill-mode: none;
        -webkit-animation-fill-mode: none;}
    
    /* 新版最新消息內頁 */
    .blog_back {display: flex; justify-content: space-between; align-items: center; align-content: center;}
    .blog_back a {width:31.5%;}
    }


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
#content {
    background: url(https://pic03.eapple.com.tw/benxintravel/mir_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom center;
    padding: 130px 0 0 0;
}

.pageIndex .nav-menu {
    width: 100%;
    text-align: right;
    float: none;
}
.pageIndex .main_part {border-top: none;}
.pageIndex .main_header_area.animated {
    background: #FFF;
    box-shadow: none;
    filter: none;
}

.header_area {position: fixed; width: 100%;}

.nav-menu {
    width: 100%;
    text-align: right;
    padding: 0;
	transition: all 0.8s;
}
.nav-header {
    padding: 0;
    text-align: center;
    width: 400px;
	transition: all 0.8s;
}

/*sticky*/
.header_area.sticky .nav-brand {transition: all 0.8s;}
.header_area.sticky .nav-menu {transition: all 0.8s; transition-timing-function: cubic-bezier(0.43, 0.26, 0.48, 0.92);}
.header_area.sticky .main_header_area.animated { background-position-y: -10px;}


.nav-menu > li > a {
	position: relative;
    letter-spacing: 0.5px;
    font-size: 15px;
    font-weight: bold;
    padding: 10px 15px;border-bottom: 3px solid #FFF;}
.nav-menu>li:hover>a, .nav-menu>li.active>a, .nav-menu>li.focus>a {color: #FF005A;font-weight: bold;border-bottom: 3px solid #FF005A;}

/*下拉選單*/
.nav-menu>li>.nav-dropdown {border: none;}
.nav-dropdown>li:hover>a, .nav-dropdown>li.focus>a { color: #fff;background: #FF206F;transition: all 0.3s;}
.nav-dropdown > li > a:hover, .nav-dropdown > li > a:focus {  color: #fff;transition: all 0.3s;}
.nav-dropdown > li > a { font-size: 15px;}

/*送出按鈕*/
.animated-arrow {
    border-radius: 10px;
    background: #FF206F;
}


/*內頁BANNER 設定*/
.banner {
    height: 550px;
    padding: 150px 0;
    background: url(https://pic03.eapple.com.tw/benxintravel/ban.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.promotions_page .banner {background: url(https://pic03.eapple.com.tw/benxintravel/ban-promotions.jpg);}
.blog_page .banner {background: url(https://pic03.eapple.com.tw/benxintravel/ban-blog.jpg);}
.contact_page .banner {background: url(https://pic03.eapple.com.tw/benxintravel/ban-c.jpg);}

.banner h5 {
    padding-top: 140px;
    color: #fff;
    text-shadow: 0 0 6px #3f311b;
    letter-spacing: 6px;
    font-size: 38px;
	position:relative;
}
.banner h5:before {
    content: " ";
    display: block;
    font-size: 65px;
    letter-spacing: 0;
    margin-bottom: -21px;
    text-shadow: none;
    font-weight: normal;
    font-style: italic;
    font-family: 'Playfair Display', serif;
    background: linear-gradient(176deg, #ffffff3d, #ffffffd9);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.blog_page .banner h5:before { content: "Recommend";}
.promotions_page .banner h5:before { content: "News";}
.album_page .banner h5:before { content: "Travel Highlights";}
.contact_page .banner h5:before { content: "Contact Us";}

.banner.banA {}
.banner.banB {}
.banner.banC {}
.banner.banD {}
.banner.banE {}
.banner.banblog {}



/*footer*/
.footer {
  padding: 70px 0 0 0;
  background: url(https://pic03.eapple.com.tw/benxintravel/footer_bg-01.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  box-shadow: -3px 3px 15px rgba(0, 0, 0, 0.3);
}

.footer_center{
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 80px 0 20px;
}

.footer_info ul {padding: 2.5vw 0 0 5vw;}
.footer_info li p, .footer_info li p a { color: #444;}
.footer_menu a {
  width: 100%;
  text-align: center;
  background: transparent;
  color: #444;
}
.footer_menu a:hover {transition: all 0.3s;}

.footer_logo img {}
.footer_info li p.tel:before { content: '電話：';}
.footer_info li p.tel2:before { content: 'LINE：';}/*電話2*/
.footer_info li p.fax:before { content: '傳真：';}/*傳真*/
.footer_menu a { width: 100%; text-align: center;}
.copy {border-top: none; background-color: #220D7D;color: #FFF;}

/*下拉頁按鈕*/
.other_select_page .other_promotion.clearfix { display: none;}
.other_select_page .page { display: none;}

/*首頁最新消息插圖區*/
.news_part {
    display: none;
}
.i_blog_box { margin: 80px auto!important;display: none;}



/*聯絡我們*/
form.style1 { display: flex; flex-flow: wrap;}
/*.list_before.info li:nth-child(6) { padding-left: 0;}*/
.contact_content .information_left{width: 100%;display: flex;flex-wrap: wrap;align-items: center;}
.contact_content .information_right{width: 100%;}
.blank_letter {color: #444444;}

.information_text{width: 350px;}
.information_linkbox{width: calc(100% - 350px);display: flex;flex-wrap: wrap;}
.information_linkbox a{
  width: calc(25% - 30px);
  margin: 10px 15px;
  padding: 1.5vw 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
  text-align: center;
  position: relative;
  top: 0;
  transition: 0.5s;
}

.information_linkbox a:hover{top: -10px;}
.information_linkbox a b{width: 100%;color: #444;font-size: 16px;margin-top: 15px;}
.information_linkbox a span{width: 100%;color: #444;font-size: 14px;margin-top: 5px;}
.information_map{width: 100%;height: 340px;margin: 5vw auto;}
.information_map iframe{width: 100%;height: 100%;}

.TEL:before, .TEL2:before, .PHONE:before, .FAX:before, .TAXID:before, .MAIL:before, .ADD:before, .ADD2:before { width: auto;}
.TEL2:before { content: "LINE ID";}
.FAX:before { content: "微信 ID";}
.contact_form { margin-top: 5px;}
.contact_form li {padding-left: 0;}
.contact_form li .form__label{width: 120px;margin-left: 0;padding: 10px 25px 0 15px;text-align: right;}
.contact_form li .form__insert { width: calc(100% - 120px);}	
.noborder {  background: rgba(238,238,238,0.6);  width: 100%;}/*填寫欄*/
input[type="checkbox"], input[type="radio"] { margin-left: 10px;margin-right: 3px;}
input#item949_1, input#item950_1, input#item943_1, input#item945_1, input#item951_1 { margin-left: 0;}

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

/*促消方案*/
.promotion_title h2 { border-bottom: 2px solid #008cd6;}
.promotion_title {border-bottom: 1px solid #008cd6;}	
	

/*文章設定*/

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


/*相本分類全版面 ( 限制最寬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;}
*/
.overlay {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all .4s 100ms cubic-bezier(.42,0,.58,1);
    -webkit-transform: skewX( -50deg ) translateX(-50%);
    -ms-transform: skewX(-50deg) translateX(-50%);
    transform: skewX( -50deg ) translateX(-50%);
    -webkit-transition: all 2s;
    -o-transition: all 2s;
    transition: all 2s;
    background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 100%);
    background: linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 100%);
}
.show-list .item:hover .overlay {
    left: 130%;
    opacity: 1;
	z-index:3;
}

.show-list .show_pic img {
    display: inline-block;
    max-width: 100%;
    min-width: 100%;
    object-fit: cover;
    -moz-object-fit: cover;
    -ms-object-fit: cover;
    -o-object-fit: cover;
    -webkit-object-fit: cover;
    transform: scale(1);
	transition: all .8s ease-in-out;
    -webkit-transition: all .8s ease-in-out;
    -moz-transition: all .8s ease-in-out;
    -o-transition: all .8s ease-in-out;
    -ms-transition: all .8s ease-in-out;
}
.show-list .show_pic img:hover {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
}

.show-list .show_name {text-align: center;}
.show-list .item:hover .show_name { color: #F83777;}
/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
.other_album_choice li { border-radius: 10px 0; background: #342789;}
.other_album_choice li:hover {  background: #F85B90;}

/*相本列表
.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: 1100px) {

.footer_info li:nth-child(1) { width: 100%;}
.footer_info li:nth-child(2) { width: 100%;}
.footer{padding: 35px 0 0 0;}
.footer_logo{width: 100%;}
.footer_logo a{max-width: 380px;display: block;}
.footer_logo a img{width: 100%;}
.footer_logo p span{line-height: 160%;margin-top: 15px;}
.footer_logo p b{line-height: 160%;margin: 10px 0;}
.footer_center{max-width: 800px;padding: 0 20px;}
.footer_info li:nth-child(2){width: 100%;}
.footer_info ul{width: 100%;padding: 0;}
.footer_menu{display: flex;flex-wrap: wrap;}
.footer_menu a{width: auto;margin: 0;margin-right: 4px;}
.footer_link{margin: 15px auto;}
.footer_link a{margin-right: 10px;}
.copy{margin-top: 20px;}

.information_text{width: 100%;}
.information_linkbox{width: 100%;}
.information_linkbox a{width: calc(25% - 20px);margin: 10px;padding: 15px 10px;}
.information_linkbox a b{font-size: 16px;margin-top: 10px;}
.information_linkbox a span{font-size: 14px;margin-top: 5px;}
.information_map{height: 300px;margin: 50px auto;}

.contact_content .information_right ul{margin-top: 25px;}
.contact_form li{padding: 15px;}
.contact_form li .form__label{width: 90px;padding: 10px;}
.contact_form li .form__insert{width: calc(100% - 90px);}

}

@media screen and (max-width: 700px) {

  .information_linkbox a{width: calc(50% - 20px);}
  .information_map{height: 300px;margin: 30px auto;}

  .contact_form li{padding: 15px 0;}
  .contact_form li .form__label{width: 100%;text-align: left;padding: 10px 0;}
  .contact_form li .form__insert{width: 100%;}

}

@media screen and (max-width: 768px) {
/* 開啟手機板下方按鈕所需設定 */

#to_top { bottom:60px;}

/*header置中*/
.pageIndex .header_area {position: relative;}
.pageIndex .main_header_area.animated { padding: 7px 0 0 0;}
.pageIndex .nav-menu { width: 100%;  padding: 0 10px;  margin: 0;}

.header_area{position: relative;}
.nav-toggle:after {color: #444;font-weight: 600;}
.nav-toggle:before {background-color: #444;  box-shadow: 0 0.5em 0 0 #444, 0 1em 0 0 #444;}
.main_header_area.animated {filter: none;}
.nav-menu{margin: 0;}

/*選單logo*/
.nav-brand-m{display: block;text-align: left;padding: 15px 10px;}
.nav-brand-m img{max-width: 330px;width: 100%;}	

.footer_logo { padding-left: 0;}

.nav-dropdown>li:hover>a, .nav-dropdown>li.focus>a{color: #444;background: #FFF;}
.nav-dropdown > li > a:hover, .nav-dropdown > li > a:focus{color: #444;}

}

@media screen and (max-width: 1000px) {

    .nav-menu > li > a{padding: 10px 5px;}

}

@media screen and (max-width: 768px) { 

    #content{padding: 0;}


}