@charset "utf-8";
/* CSS Document */

/*----------------------------------------------------------------------*/
/* 首頁輪播 */
.for_mob { display: none; }
.IndexSlider .text { font-size: min(max(1.25rem, 2vw), 1.875rem); }
.IndexSlider .name { font-size:1.125em; }
.IndexSlider .textBox { padding:45px 50px; box-sizing: border-box; background:rgba(160,143,120,.8); }

.IndexBlock_st1 .item { display: flex; }
.IndexBlock_st1 .imgBox { width: 66%; }
.IndexBlock_st1 .textBox { width: 34%; display: flex; justify-content: center; align-items: center; }

.IndexBlock_st2 .item { display: flex; flex-direction: row-reverse; }
.IndexBlock_st2 .imgBox { width: 66%; }
.IndexBlock_st2 .textBox { width: 34%; display: flex; justify-content: center; align-items: center; }

.IndexBlock_st3 .textBox { position:absolute; bottom:40px; left:0; width:100%; padding: 2.5% 8%; }

.IndexBlock_st4 .textBox { position:absolute; bottom:0; right:15%; padding: 20px 30px; }

/* SOCIAL WALL */
@media screen and (max-width: 1199px) {
	.IndexSW .item { float: left; width: 50%; padding: 0 1.5%; }
}
@media screen and (min-width: 1200px) {
	.IndexSW .item { float: left; width: 25%; padding: 0 1.5%; }
}


/*----------------------------------------------------------------------*/
/* 表單 */
table.FormTable > tbody > tr > th, table.FormTable > tbody > tr > td { border-bottom:1px solid #dddddd; vertical-align:top; }
table.FormTable > tbody > tr:last-child > th, table.FormTable > tbody > tr:last-child > td { border-bottom:0; }
table.FormTable > tbody > tr > th { border-right:1px solid #dddddd; width:150px; padding:15px 15px 15px 6px; text-align:right; }
table.FormTable > tbody > tr > th::after { position:absolute; top:14px; right:0; }
table.FormTable > tbody > tr > th:empty::after { display:none; }
table.FormTable > tbody > tr > td { padding:10px 15px 4px 15px; }


/*----------------------------------------------------------------------*/
/* select_location popup box */
.select_location .box_wrap { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.select_location .box_wrap > div { padding:0 40px }

/*----------------------------------------------------------------------*/
/* 內頁 */
.ToolBar, .ListPicText, .ProductList,
.editable_content, .articleTitle, .postdate, .post_info, .inPagination, 
.product_cat_title, .ProductCompare,
.ArtistsBrief, .ArtistsCont, .ContactUsForm, .RegForm, .dealer_search, .dealer_list,
.CatalogListWrap, .FAQsWrap, .HistoryList, .FindCont, #Breadcrumbs > div, .product_select { 
	padding-left:3.125vw; padding-right:3.125vw; 
	}

/*----------------------------------------------------------------------*/
/* 內頁元素 */
/* 分類下拉 */
.CatTitle h3 { float:left; }
.CatTitle h3 + .cat_select { float:right; }

/* 列表搜尋 */
.ListSearch > div { 
	padding:30px 30px 20px 30px; 
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	border-radius:20px;
	}
.ListSearch > div::before { top:7px; right:3px; width:24px; height:10px; }
.ListSearch > div::after { 
	content:''; display:block; position:absolute; bottom:-1px; left:-1px; width:24px; height:24px; background-color:#e7ded5;
	}
.ListSearch .item { font-size:1rem; }
.ListSearch .title { display:none; }
.ListSearch .BtnCommon input { padding-left:40px; padding-right:40px; font-size:1rem; }

/* 內頁顯示欄位 */
.content_info ul { display:table; }
.content_info li { display:table-row; }
.content_info li span { display:table-cell; vertical-align:top; padding:5px 0; }
.content_info li span.title { text-align:right; }

/* colorbox */
#colorbox_thum a { width:180px; height:135px; margin:10px; }

/* 延伸閱讀 */
.related_articles .title { font-size:1.375rem; font-family:'Noto Sans TC', sans-serif; font-weight:400 }

 
/*----------------------------------------------------------------------*/
/* 圖文列表 */
.ListPicText { margin-top:30px; margin-bottom:30px; }
.ListPicText > div { margin-left:-15px; margin-right:-15px; }
.ListPicText .item { padding-left:15px; padding-right:15px; margin-bottom:40px; }
.ListPicText .btn a { width:65px; margin-left:-39px; line-height:26px; }
.ListPicText .btn a:hover, .ListPicText .btn a:focus { margin-left:0; }
.ListPicText .btn a::before { top:0; }
.ListPicText .btn a::after { top:9px; }

/* list-view */
.ListPicText.list-view .img { float:left; width:360px; max-width:50%; }

/* grid-view */
.ListPicText.grid-view .cont { padding:15px 10px 0 10px; text-align:center; }

/* 單欄 */
.ListPicText.single .title { font-size:1.875rem; }
.ListPicText.single .date { font-size:1rem; }
.ListPicText.single .desc { font-size:1rem; }
.ListPicText.list-view.single .img { padding-right:20px; }
.ListPicText.list-view.single.staggered .item:nth-child(2n+2) .img { float:right; padding-right:0; padding-left:20px; }

/* 兩欄 */
.ListPicText.bisection .item { float:left; width:50%; }
.ListPicText.bisection .title { font-size:1.875rem; }
.ListPicText.bisection .date { font-size:1rem; }
.ListPicText.bisection .desc { font-size:1rem; }
.ListPicText.list-view.bisection .img { padding-right:20px; }

/* 三欄 */
.ListPicText.trisection .item { float:left; width:33.3333%; }
.ListPicText.trisection .title { font-size:1.625rem; }
.ListPicText.trisection .date { font-size:1rem; }
.ListPicText.trisection .desc { font-size:1rem; }
.ListPicText.list-view.trisection > div { margin-left:-10px; margin-right:-10px; }
.ListPicText.list-view.trisection .item { padding-left:10px; padding-right:10px; margin-bottom:20px; }
.ListPicText.list-view.trisection .img { padding-right:10px; }

/* 四欄 */
.ListPicText.quarters > div { margin-left:-10px; margin-right:-10px; }
.ListPicText.quarters .item { float:left; width:25%; padding-left:10px; padding-right:10px; margin-bottom:20px; }
.ListPicText.quarters .title { font-size:1.5rem; }
.ListPicText.quarters .date { font-size:0.9375rem; }
.ListPicText.quarters .desc { font-size:0.9375rem; }
.ListPicText.list-view.quarters .img { padding-right:10px; }


/*----------------------------------------------------------------------*/
/* 產品列表 */
.ProductList { margin-top:30px; margin-bottom:30px; }
.ProductList > div { margin-left:-25px; margin-right:-25px; }
.ProductList .item { float:left; width:33.3333%; padding-left:25px; padding-right:25px; margin-bottom:40px; }

/* Slider */
.ProductListSlider .img { float:right; width:50%;  }
.ProductListSlider .cont { position:absolute; top:0; left:0; width:50%; }
.ProductListSlider .cont .text { padding-right:15%; letter-spacing:0.5px; }
.ProductListSlider .cont .text .title { margin-bottom:20px; font-size:2rem; }
.ProductListSlider .cont .text .desc { font-size:1.25rem; }

/*----------------------------------------------------------------------*/
/* 產品內頁 */
.ProductWrap::after { content: ''; display: block; clear: both; }
.ProductWrap .col_l { width: 600px; float: left; }
.ProductWrap .col_r { width: calc(100% - 640px); float: right; }
.product_title { text-align: left; }
.ProductWrap .editable_content { padding-left: 0; padding-right: 0; }
.ProductWrap .editable_content blockquote { text-align: left; max-width: 100%; }

.ProductImage { position: relative; }
.ProductImage.sticky { position: fixed; top: 0px; width: 600px; }

@media screen and (max-width: 1279px) {
    .ProductWrap .col_l { width: 45vw; }
    .ProductWrap .col_r { width: 44vw; }
    .ProductImage.sticky { width: 45vw; }
}

/* 產品內容頁籤 */
.ProductCont .tab_cont { height:0; max-height:0; min-height:0; transform:scaleY(0); visibility:hidden; opacity:0; overflow:hidden; }
.ProductCont .tab_cont.active { height:auto; max-height:none; transform:scaleY(1); visibility:visible; opacity:1; }
.ProductCont .tab_cont > .title { display:none; }

/* 產品內容頁籤-比較表 */
.ProductCompareTable th:not(:first-child) { width:calc(100% - 150px / 3); }
.ProductCompareTable tr th:first-child { width:150px; }
.compare-table-wrapper .pinned { width:150px; }
div.compare-table-wrapper div.scrollable { margin-left:150px; }


/*----------------------------------------------------------------------*/
/* 藝人列表 */
.artists_select { padding-left:3.125vw; padding-right:3.125vw; max-width: 1200px; margin-left: auto; margin-right: auto; }

.ArtistsList > div { margin-left:-15px; margin-right:-15px; }
.ArtistsList .item { width:33.3333%; padding-left:15px; padding-right:15px; margin-bottom:30px; }
.ArtistsList .cont { bottom:-50px; }
.ArtistsList .item > div:hover .cont { bottom:0; }
.ArtistsList .img > div:hover { transform:scale(1.03); }

.ContentBlock .inner { padding-left:3.125vw; padding-right:3.125vw; }
.ContentBlock .inner > *:first-child { padding-top: 20px; }
.ContentBlock .inner > *:last-child { padding-bottom: 20px; }
@media screen and (max-width: 1279px) {
    .ArtistsList .title { font-size:1.5rem; }
}
@media screen and (min-width: 1280px) {
    .ArtistsList .title { font-size:1.625rem; }
}

/* 產品內頁 */
.ArtistsList.in_product > div { margin-left:-10px; margin-right:-10px; }
.ArtistsList.in_product .item { width:50%; padding-left:10px; padding-right:10px; }
@media screen and (max-width: 1279px) {
.ArtistsList.in_product .title { font-size:1.25rem; }
}
@media screen and (min-width: 1280px) {
.ArtistsList.in_product .title { font-size:1.375rem; }
}


/*----------------------------------------------------------------------*/
/* 藝人內頁 */
.ArtistsBrief .img > div { padding-bottom:105%; }
.ArtistsBrief .img { float:left; width:45%; }
.ArtistsBrief .cont { float:right; width:55%; }
@media screen and (max-width: 1279px) {
.ArtistsBrief .cont h3 { font-size:3rem; }
.ArtistsBrief .cont .quote { font-size:1.375rem; }
.ArtistsBrief .cont .quote { padding:25px 35px; }
.ArtistsBrief .cont .quote::before, .ArtistsBrief .cont .quote::after { font-size:64px; }
	.ArtistsBrief .cont .quote::before { top:-10px; }
	.ArtistsBrief .cont .quote::after { bottom:-34px; }
}
@media screen and (min-width: 1280px) {

.ArtistsBrief .cont h3 { font-size:3.75rem; }
.ArtistsBrief .cont .quote { font-size:1.5rem; }
.ArtistsBrief .cont .quote { padding:35px 40px; }
.ArtistsBrief .cont .quote::before, .ArtistsBrief .cont .quote::after { font-size:92px; }
	.ArtistsBrief .cont .quote::before { top:-14px; }
	.ArtistsBrief .cont .quote::after { bottom:-46px; }
}

.ArtistsCont .clom_left { float:left; width:calc(100% - 300px); padding-right:7.5%; }
.ArtistsCont .recommend_list .item:nth-child(odd) { padding-right:15px; }
.ArtistsCont .recommend_list .item:nth-child(even) { padding-left:15px; }
.ArtistsCont .recommend_list .img:hover { transform:scale(1.03); }

.ArtistsCont .recommend_list .item a { position:relative; }
.ArtistsCont .recommend_list .title { 
	position:absolute; bottom:-50px; left:0; width:100%; padding:0 10px; line-height:50px; color:#fff; box-sizing:border-box;
    background-color:rgba(162,144,121,0.8);
    -webkit-transition:all 0.5s ease;
    -moz-transition:all 0.5s ease;
    transition:all 0.5s ease;
	}
.ArtistsCont .recommend_list .item a:hover .title { bottom:0; }

.ArtistsCont .clom_right { float:right; width:300px; }
.ArtistsCont .thum a { width:50%; margin-bottom:20px; }
.ArtistsCont .thum a:nth-child(odd) { padding-right:10px; }
.ArtistsCont .thum a:nth-child(even) { padding-left:10px; }

.artists_select .form_btn { float: right; }
.artists_select .form_btn a { font-size: 1.25em; }
.artists_select .form_btn a, .artists_select .form_btn a::before {
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    transition: all 0.25s ease;
}
.artists_select .form_btn a:hover { color: #a29179; }
.artists_select .form_btn a:hover::before { width: 100%; }
.artists_select .form_btn a::before { content: ''; width: 0%; height: 1px; background: #a29179; position: absolute; bottom: -2px; }

/*----------------------------------------------------------------------*/
/* 聯絡我們 */
.ContactUsForm .block.left { float:left; width:50%; padding-right:20px; }
.ContactUsForm .block.right { float:right; width:50%; padding-left:20px; }
.ContactUsForm .first_name { float:left; width:50%; padding-right:10px; }
.ContactUsForm .last_name { float:right; width:50%; padding-left:10px; }
.ContactUsForm .msg textarea { height:200px; }

/*----------------------------------------------------------------------*/
/* 註冊 */
.RegForm .block.left { float:left; width:50%; padding-right:20px; }
.RegForm .block.right { float:right; width:50%; padding-left:20px; }

.RegForm .half { float:left; width:50%; padding-right:10px; }
.RegForm .half + .half { float:right; width:50%; padding-left:10px; padding-right:0; }
.RegForm .half + .item:not(.half) { clear:both; }
.RegForm .phone { float:left; width:50%; padding-right:10px; }
.RegForm .mobile { float:right; width:50%; padding-left:10px; padding-right:0; }
.RegForm .dmy select { float:left; width:32%; margin-right:2%; }
.RegForm .dmy select:last-child { margin-right:0; }

/* find product Serial Number popup box */
.find_sn_box .box_wrap { width:960px; height:96vh; margin:-48vh 0 0 -480px; padding:20px 0; }
.find_sn_box .box_wrap > div { padding:0 20px }

.RegForm .block_title.min { padding-top: 27px; }

/*----------------------------------------------------------------------*/
/* Find Us */
#dealer_map { height:65vh; }
.dealer_list { display:none; }

/*----------------------------------------------------------------------*/
/* Catalog列表 */
.catalog_list { padding-bottom: 20px; }
.catalog_list .item { width: 25%; }

/* 顯示效果 */
.catalog_list .icon-download { opacity: 0; visibility: hidden; margin-top:-40px; }
.catalog_list .item a:hover .img::before { background-color: rgba(0,0,0,0.3); }
.catalog_list .item a:hover .img > div { 
    transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);
}
.catalog_list .item a:hover .icon-download { opacity: 1; visibility: visible; margin-top: -25px; }

@media screen and ( min-width: 1500px ){
    .catalog_list { margin-left: -20px; margin-right: -20px; }
    .catalog_list .item { padding: 20px; } 
    .catalog_list .title { font-size: 1.5em; } 
}
@media screen and ( max-width: 1499px ){
    .catalog_list { margin-left: -15px; margin-right: -15px; }
    .catalog_list .item { padding: 15px; } 
    .catalog_list .title { font-size: 1.25em; } 
}

.catalog_list .title, .catalog_list .icon-download, .catalog_list .item .img > div, .catalog_list .img::before { 
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    transition:all 0.25s ease;
	}

/*----------------------------------------------------------------------*/
/* FAQs 問與答 */
.faqsBox .cont_block{ padding: 15px 4em 15px 4em; }
.faqsBox .cont_block .desc{ padding-left: 3.75em; }
.FAQsWrap .BoxOuter{ margin-bottom: 30px; }
.FAQsWrap .helpBox .title{ font-size: 2.1875em; margin-bottom: 20px; }
.FAQsWrap .helpBox .mail_btn a{ line-height: 60px; font-size: 1.375em; padding: 0 30px; }

@media screen and ( min-width: 1500px ){
    .faqsBox .faqTitle{ font-size: 1.75em; }
    .faqsBox .top_block .title{ font-size: 1.25em; } 
    .faqsBox .cont_block .editable_content { font-size: 1.125rem; }
}
@media screen and ( max-width: 1499px ){
    .faqsBox .faqTitle{ font-size: 1.5em; }
    .faqsBox .cont_block .editable_content{ padding-left: 0; padding-right: 0; }
    .faqsBox .top_block .title{ font-size: 1.188em; } 
    .faqsBox .cont_block .editable_content { font-size: 1.063rem; }
}

/*----------------------------------------------------------------------*/
/* 歷史沿革 */
.HistoryList { padding-left: 2.8vw; padding-right: 2.8vw; }
@media (max-width: 1200px) {
    .HistoryList .item::before { left: 45%; }
    .HistoryList .imgBox { width: 45%; }
    .HistoryList .textBox { width: 55%; }
    .HistoryList .textBox .box { padding-left: 50px; }
    .HistoryList .textBox .box::before { width: 20px; }
}

/*----------------------------------------------------------------------*/
/* Find Your Flute */
.FindCont .tab_container .item { display: flex; justify-content: space-around; align-items: center; flex-wrap: wrap; }
.FindCont .tab_container .item .item_title { width: 100%; }
.FindCont .tab_container .item .imgBox { width: 80%; }
.FindCont .tab_container .item .BtnCommon { width: 20%; margin: 0; padding: 10px 0; }