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

/*----------------------------------------------------------------------*/
/* Header */


/*----------------------------------------------------------------------*/
/* Key visual */
@media screen and (max-width: 767px) {
    #KeyVisual .play_btn { width:70px; height:70px; border:3px solid #fff; }
    #KeyVisual .play_btn::before { border-width: 20px 0 20px 30px; }
}
@media screen and (min-width: 768px) {
    #KeyVisual .play_btn { width:100px; height:100px; border:5px solid #fff; }
    #KeyVisual .play_btn::before { border-width: 25px 0 25px 40px; }
}


/*----------------------------------------------------------------------*/
/* 首頁輪播 */
.IndexSlider .text { font-size:1.25em; }
.IndexSlider .textBox { padding:25px; }
.IndexSlider .bx-wrapper .textBox { padding:25px 25px 45px; }
.IndexSlider { background:rgba(160,143,120,.8); }

@media screen and (max-width: 767px) {
    .for_desktop { display: none; }    
}
@media screen and (min-width: 768px) {
    .for_mob { display: none; }
}

/* SOCIAL WALL */
.IndexSW .item { float: left; width: 50%; padding: 0 2%; }


/*----------------------------------------------------------------------*/
/* 表單 */
@media screen and (max-width: 767px) {
.FormGroup, .FromSubGroup { padding:20px 10px 10px; }
.FormGroup .FormTable, FromSubGroup .FormTable { margin-left:-10px; margin-right:-10px; width:auto; }

table.FormTable { border-top:1px solid #e7e7e7; }
table.FormTable , table.FormTable > tbody, table.FormTable > tbody > tr, table.FormTable > tbody > tr > th, table.FormTable > tbody > tr > td { display:block; }
table.FormTable > tbody > tr { padding:10px 10px 4px 10px; border-bottom:1px solid #d4d0cd; }
table.FormTable > tbody > tr > th, .FormTable > tbody > tr > td { border-bottom:0; }
table.FormTable > tbody > tr > th { text-align:left; }

.FormElmt input[type="file"] { width:100%; }
}
@media screen and (min-width: 768px) {
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; }
}

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

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

/* 列表搜尋 */
.ListSearch > div { 
	padding:20px 20px 10px 20px;  
	-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:0.875rem; }
.ListSearch .title { display:none; }
.ListSearch .BtnCommon input { padding-left:20px; padding-right:20px; font-size:0.875rem; }

/* 頁碼 */
#Pagination a { display:none; }
#Pagination a.first, #Pagination a.prev, #Pagination a.next, #Pagination a.last { display:inline-block; }

/* 內頁顯示欄位 */
.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:160px; height:120px; margin:10px; }


/*----------------------------------------------------------------------*/
/* 圖文列表 */
.ListPicText { margin-top:20px; margin-bottom:20px; }
.ListPicText > div { margin-left:-10px; margin-right:-10px; }
.ListPicText .item { padding-left:10px; padding-right:10px; margin-bottom:30px; }
.ListPicText .btn a { line-height:32px; }
.ListPicText .btn a::before { top:3px; }
.ListPicText .btn a::after { top:12px; }

/* list-view */
.ListPicText.list-view.single.staggered .item:nth-child(2n+2) .img { float:right; padding-right:0; padding-left:20px; }
.ListPicText.list-view .img { float:left; width:360px; max-width:50%; padding-right:15px; }

@media screen and (max-width: 799px) {
.ListPicText .title { font-size:1.5rem; }
.ListPicText .date { font-size:0.9375rem; }
.ListPicText .desc { font-size:0.9375rem; }

/* list-view 一律以單欄顯示 */

/* grid-view 一律以兩欄顯示 */
.ListPicText.grid-view .item { float:left; width:50%; }
.ListPicText.grid-view .cont { padding:10px 10px 0 10px; text-align:center; }
}

@media screen and (min-width: 800px) {
.ListPicText .title { font-size:1.5rem; }
.ListPicText .date { font-size:0.9375rem; }
.ListPicText .desc { font-size:0.9375rem; }

/* list-view 一律以單欄顯示 */

/* grid-view 一律以三欄顯示 */
.ListPicText.grid-view .item { float:left; width:33.3333%; }
.ListPicText.grid-view .cont { padding:15px 10px 0 10px; text-align:center; }
}


/*----------------------------------------------------------------------*/
/* 產品列表 */
.product_select { padding-left:20px; padding-right:20px; }

.ProductList { margin-top:20px; margin-bottom:20px; }
.ProductList > div { margin-left:-20px; margin-right:-20px; }
.ProductList .item { float:left; padding-left:20px; padding-right:20px; margin-bottom:30px; }
@media screen and (max-width: 799px) {
.ProductList .item { width:50%;  }
}
@media screen and (min-width: 800px) {
.ProductList .item { width:33.3333%; }
}

/* Slider */
.ProductListSlider .img { float:right; width:50%;  }
.ProductListSlider .cont { position:absolute; top:0; left:0; width:50%; }
.ProductListSlider .cont .text { padding-right:30px; letter-spacing:0.25px; }
@media screen and (max-width: 767px) {
.ProductListSlider .cont .text .title { margin-bottom:10px; font-size:1.5rem; }
.ProductListSlider .cont .text .desc { font-size:1rem; }
}
@media screen and (min-width: 768px) {
.ProductListSlider .cont .text .title { margin-bottom:20px; font-size:2rem; }
.ProductListSlider .cont .text .desc { font-size:1.125rem; }
}


/*----------------------------------------------------------------------*/
/* 產品內頁 */
/* 產品內容頁籤 */
@media screen and (max-width: 767px) {
.ProductCont .tabs { display:none; }
.ProductCont .tab_cont .cont { height:0; transform:scaleY(0); visibility:hidden; opacity:0; overflow:hidden; }
.ProductCont .tab_cont.active .cont { height:auto; transform:scaleY(1); visibility:visible; opacity:1; }
}
@media screen and (min-width: 768px) {
.ProductCont .tab_cont > .title { display:none; }
.ProductCont .tab_cont { height:0; transform:scaleY(0); visibility:hidden; opacity:0; }
.ProductCont .tab_cont.active { height:auto; transform:scaleY(1); visibility:visible; opacity:1; }
}

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


/*----------------------------------------------------------------------*/
/* 藝人列表 */
.artists_select { padding-left:20px; padding-right:20px; }
.ArtistsList > div { margin-left:-15px; margin-right:-15px; }
.ArtistsList .item { float:left; padding-left:15px; padding-right:15px; margin-bottom:30px; }
.ArtistsList .title { font-size:1.5rem; }
@media screen and (max-width: 767px) {
	.ArtistsList .item { width:50%; }
}
@media screen and (min-width: 768px) {
	.ArtistsList .item { width:33.3333%; }
}

/* 產品內頁 */
@media screen and (max-width: 767px) {
.ArtistsList.in_product .item { width:33.3333%; }
.ArtistsList.in_product > div { margin-left:-5px; margin-right:-5px; }
.ArtistsList.in_product .item { padding-left:5px; padding-right:5px; }
.ArtistsList.in_product .title { font-size:1.25rem; }
}
@media screen and (min-width: 768px) and (max-width: 899px) {
.ArtistsList.in_product .item { width:33.3333%; }
.ArtistsList.in_product > div { margin-left:-10px; margin-right:-10px; }
.ArtistsList.in_product .item { padding-left:10px; padding-right:10px; }
.ArtistsList.in_product .title { font-size:1.375rem; }
}
@media screen and (min-width: 900px) {
.ArtistsList.in_product .item { width:25%; }
.ArtistsList.in_product > div { margin-left:-10px; margin-right:-10px; }
.ArtistsList.in_product .item { padding-left:10px; padding-right:10px; }
.ArtistsList.in_product .title { font-size:1.25rem; }
}


/*----------------------------------------------------------------------*/
/* 藝人內頁 */
@media screen and (max-width: 767px) {
.ArtistsBrief .img { float:left; width:36%; }
.ArtistsBrief .img > div { padding-bottom:150%; }
.ArtistsBrief .cont { float:right; width:64%; }
.ArtistsBrief .cont h3 { font-size:3rem; }
.ArtistsBrief .cont .quote { font-size:1.25rem; }
.ArtistsBrief .cont .quote { padding:15px 30px; }
.ArtistsBrief .cont .quote::before, .ArtistsBrief .cont .quote::after { font-size:48px; }
	.ArtistsBrief .cont .quote::before { top:-8px; }
	.ArtistsBrief .cont .quote::after { bottom:-26px; }
}
@media screen and (min-width: 768px) {
.ArtistsBrief .img { float:left; width:45%; }
.ArtistsBrief .img > div { padding-bottom:105%; }
.ArtistsBrief .cont { float:right; width:55%; }
.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; }
}

.ArtistsCont .recommend_list .item:nth-child(odd) { padding-right:10px; }
.ArtistsCont .recommend_list .item:nth-child(even) { padding-left:10px; }
.ArtistsCont .recommend_list a:hover .title { color:#A29079; }

@media screen and (max-width: 767px) {
.ArtistsCont .photo { float:left; width:calc(100% - 250px); padding-right:20px; }
.ArtistsCont .thum a { width:80px; margin-right:10px; margin-bottom:10px; }
.ArtistsCont .video { float:right; width:250px; }
}
@media screen and (min-width: 768px) {
.ArtistsCont .clom_left { float:left; width:calc(100% - 250px); padding-right:4%; }
.ArtistsCont .clom_right { float:right; width:250px; }
.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 a { display: inline-block; background-color: #eee; line-height: 40px; padding: 0 20px; border-radius: 5px; }
.artists_select .form_btn a::after { content: '\f178'; font-family: 'Font Awesome 5 Pro'; font-weight: 300; padding-left: 5px; }


/*----------------------------------------------------------------------*/
/* 聯絡我們 */
@media screen and (max-width: 767px) {
.ContactUsForm .block.left { float:left; width:50%; padding-right:10px; }
.ContactUsForm .block.right { float:right; width:50%; padding-left:10px; }
.ContactUsForm .msg textarea { height:280px; }
}
@media screen and (min-width: 768px) {
.ContactUsForm .block.left { float:left; width:50%; padding-right:10px; }
.ContactUsForm .block.right { float:right; width:50%; padding-left:10px; }
.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.right { margin-top:40px; }
.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:96vw; height:96vh; margin:-48vh 0 0 -48vw; padding:20px 0; }
.find_sn_box .box_wrap > div { padding:0 20px }


/*----------------------------------------------------------------------*/
/* Find Us */
@media screen and (max-width: 767px) {
.dealer_map_wraper { display:none; }
.dealer_list { display:block; }
.dealer_list dd:not(.web):not(.go) { padding-right:100px; }
.dealer_list dd.web, .dealer_list dd.go { position:absolute; right:10px; }
	.dealer_list dd.web { top:50px; }
	.dealer_list dd.go { top:80px; }
}
@media screen and (min-width: 768px) {
#dealer_map { height:100vh; }
.dealer_list { display:none; }
}

/*----------------------------------------------------------------------*/
/* Catalog列表 */
.catalog_list .item { width: 33.33333%; padding: 15px; }
.catalog_list .title { font-size: 1.25em; }
.catalog_list .icon-download { display: none; }

/*----------------------------------------------------------------------*/
/* FAQs 問與答 */
.faqsBox .top_block .title{ font-size: 1.188em; }
.faqsBox .faqTitle{ font-size: 1.5em; }
.faqsBox .cont_block .editable_content { font-size: 1.063rem; padding-left: 0; padding-right: 0; }
.faqsBox .cont_block{ padding: 15px 50px 15px 0; }
.faqsBox .cont_block .desc{ padding-left: 3.75em; }
.faqsBox .editable_content p, .faqsBox .editable_content ul, .faqsBox .editable_content ol{
    margin-bottom: 10px;
}
.FAQsWrap .BoxOuter{ margin-bottom: 10px; }
.FAQsWrap .helpBox .title{ font-size: 1.75em; margin-bottom: 20px; }
.FAQsWrap .helpBox .mail_btn a{ line-height: 50px; font-size: 1.25em; padding: 0 20px; }

/*----------------------------------------------------------------------*/
/* 歷史沿革 */
.HistoryList .item { flex-wrap: wrap; }
.HistoryList .item::before { left: 20px; top: 43px; }
.HistoryList .imgBox { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; width: 100%; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-left: 90px; }
.HistoryList .textBox { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; width: 100%; }
.HistoryList .textBox::before { left: 5px; }
.HistoryList .textBox::after { left: 16px; }
.HistoryList .textBox .box::before { left: 45px; width: 40px; }
.HistoryList .textBox ul { padding: 0; }

/*----------------------------------------------------------------------*/
/* 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 10px 20px; box-sizing: border-box; flex-shrink: 0; }