@charset "utf-8";
/*----------------------------------------------------------------------*/
/* 內頁元素 */
#MainBar { background-size:cover; background-position:center center; position: relative; }
#MainBar .inner { height: 100%; display: flex; justify-content: center; align-items: center; position: relative; }
#MainBar h2, #ProMainBar h2 { text-align:center; color: var(--main_color); text-transform:uppercase; }
#ProMainBar h2 { font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; font-weight: 700; }
#ProMainBar .desc { text-align: center; font-size: 1.25em; line-height: 1.25em; padding: 15px 0; max-width: 1128px; margin: 0 auto; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; font-weight: 400; }
#ProMainBar .banner { text-align: center; }
#ProMainBar .banner img { max-width: 100%; }
#ProMainBar #Breadcrumbs { padding-bottom: 15px; }
.ContentBlock .desc { text-align: center; font-size: 1.25em; line-height: 1.25em; padding-bottom: 4%; }

#Content { padding-top: 30px; }
#Content.products { padding-top: 0; }

/* Artist_bg */
.ContentBlock.bg_color01 {
	background: linear-gradient(to bottom, #0c0103 0%,#212121 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0c0103', endColorstr='#212121',GradientType=0 );
}

/*----------------------------------------------------------------------*/
/* 麵包列 */
#Breadcrumbs { text-align: center; text-transform:uppercase; }
#Breadcrumbs ul { display: flex; flex-wrap: wrap; }
#MainBar #Breadcrumbs { position: absolute; bottom: 15px; left: 30px; }
#MainBar #Breadcrumbs ul { justify-content: center; }
#Breadcrumbs ul li { color: #fff; font-weight: 500; }
#Breadcrumbs ul li a { color: #fff; }
#Breadcrumbs ul li::before { content: '>'; padding: 0 .25em; }
#Breadcrumbs ul li:first-child:before { display: none; }

/*----------------------------------------------------------------------*/
/* 標題 */
h2.PageTitle { font-family: 'Bank Gothic', 'sans-serif'; font-weight:400; }
h2.DetailPageTitle { font-size: 2em; font-weight:500; }
h3.articleTitle { font-size: 2.25em; font-weight: 500; }
.article_header { border-bottom: 1px solid #fff; margin-bottom: 20px; }
h3.listTitle { font-size: 2.5em; font-weight: 600; color: var(--main_color); margin-bottom: 20px; }

.tools { color: var(--main_color); }
.article_header .tools { padding: 5px 0; }
.tools .social_list { display: flex; flex-wrap: wrap; align-items: center; justify-content: end; }
.tools .social_list dt { font-size: 1.25em; margin-right: 10px; }
.tools .social_list dd { margin: 5px; }

.post_info { font-style: italic; font-size: 1.25em; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; font-weight: 300; }
.post_info span + span::before { content: '-'; padding: 0 5px; }

@media screen and (max-width: 639px) {
	#Center .inner { padding-left: 15px; padding-right: 15px; }

	#MainBar { height: 80px; }
	#MainBar .desc { display: none; }
	#MainBar #Breadcrumbs { bottom: 5px; left: 15px; font-size: .875em; }

	.Content h2 { font-size: 1.875em; }
	.Content h3 { font-size: 1.875em; }
	.Content h4 { font-size: 1.625em; }
	#MainBar .subTitle { font-size: 1.625em; margin-top: 5px; }
	.pro_list_title h3 { font-size: min(max(1.5rem, 8vw), 4.25rem); }
	.post_info { font-size: 1.125em }
	h3.listTitle { font-size: 2em; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	#Center .inner { padding-left: 25px; padding-right: 25px; }

	#MainBar { height: 120px; }
	#MainBar .desc { display: none; }
	.editable_content { font-size: 1.25em }

	#MainBar h2 { font-size: 2.875em; }
	h3.articleTitle { font-size: 3em; }
	.pro_list_title h3 { font-size: 2.875em; }
	#MainBar #Breadcrumbs { bottom: 7px; left: 25px; }

	/* colorbox */
	#colorbox_thum a { width:200px; margin:5px 10px; }
}
@media screen and (min-width: 1024px) {
	#Center .inner { padding-left: 30px; padding-right: 30px; }

	#MainBar .inner { padding-top: 10.41725%; padding-bottom: 10.41725%; }
    #ProMainBar .desc { padding: 35px 0 45px; }

	h2.PageTitle { font-size: 6.25em; }
	h2.DetailPageTitle { font-size: 4.25em; }
	h3.articleTitle { font-size: 4.25em; }
	.pro_list_title { padding: .576em 0; }
	.pro_list_title h3 { font-size: min(max(2.5rem, 5vw), 4.25rem); }
	h3.listTitle { margin-bottom: 0; }

	#Breadcrumbs { font-size: 1.25em; }

	#Content { padding-top: 5%; }
	#Content.products { padding-top: 0; }
	.editable_content { font-size: 1.25em }
}
@media screen and (min-width: 1024px) and (max-width: 1280px) {
	.pro_list_title { padding: 0; }
	.pro_list_title h3 { padding-top: 1px; padding-bottom: 1px; }
}

/*----------------------------------------------------------------------*/
/* 圖文列表 */
.ListPicText_inner { display: flex; flex-wrap: wrap; }
.ListPicText_inner > div { box-sizing: border-box; margin-bottom: 30px; }
.ListPicText .imgBox { width: 100%; height: 0; position: relative; overflow: hidden; }
.ListPicText .imgBox img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.ListPicText .imgBox a:hover { opacity: 0.7; }
.ListPicText .imgBox a:hover img { transform: scale(1.125); }
.ListPicText .cont { text-align: center; }
.ListPicText .title { font-size: min(max(1.25rem, 4vw), 1.5rem); text-transform: uppercase; }
.ListPicText .sub_text { font-size: min(max(1.125rem, 4vw), 1.5rem); text-transform: uppercase; font-style: italic; }
.ListPicText .title + .sub_text { margin-top: 4px; }
.ListPicText .title a, .ListPicText .imgBox a img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }

.ListPicText.NewsList .imgBox { padding-bottom: 84.212%; }
.ListPicText.NewsList .cont { padding: 20px 0; }
.ListPicText.NewsList .title a { color: #fff; }
.ListPicText.NewsList .title a:hover { color: var(--main_color); }

.ListPicText.ArtistList .imgBox { padding-bottom: 109.894%; }
.ListPicText.ArtistList .cont { background-color: #212121; padding: 5px; }
.ListPicText.ArtistList a { color: #fff; display: block; outline: 5px solid transparent; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.ListPicText.ArtistList a:hover { color: var(--main_color); outline: 5px solid var(--main_color); }

.ListPicText.MediaList .imgBox { padding-bottom: 56.25%; }
.ListPicText.MediaList .imgBox .time { position: absolute; right: 0; bottom: 0; background-color: #0c0103; display: inline-block; padding: 5px .5em; color: #fff; font-weight: 500; }
.ListPicText.MediaList .cont { padding: 20px 0; }
.ListPicText.MediaList .title a { color: #fff; }
.ListPicText.MediaList .title a:hover { color: var(--main_color); }

.ListPicText.DownloadList .imgBox { padding-bottom: 100%; }
.ListPicText.DownloadList .cont { padding: 20px 0; }
.ListPicText.DownloadList .title a { color: #fff; }
.ListPicText.DownloadList .title a:hover { color: var(--main_color); }

@media screen and (max-width: 639px) {
	.NewsList .ListPicText_inner { flex-direction: column; margin: 0 auto; }
	.NewsList .item { max-width: 475px; width: 100%; margin: 15px auto; }

	.ArtistList .item { max-width: 360px; width: 50%; padding: 0 3.5%; }

	.MediaList .ListPicText_inner { flex-direction: column; margin: 0 auto; }
	.MediaList .item { max-width: 475px; width: 100%; margin: 15px auto; }

	.DownloadList .item { max-width: 360px; width: 50%; padding: 0 3.5%; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.ListPicText_inner > div { width: 50%; padding: 0 24px; }

	.DownloadList { padding-top: 20px; }
	.DownloadList .ListPicText_inner .item_inner { max-width: 360px; margin: 0 auto; }
}
@media screen and (min-width: 1024px) {
	.ListPicText .title { font-size: 1.625em; }
	.ListPicText_inner { padding-top: 20px; }
	.ListPicText_inner .item { margin-left: calc(24px * 4 / 3); width: calc(100% / 4 - 24px); }
	.ListPicText_inner .item:nth-child(4n+1) { margin-left: 0; }

	/* Artists */
	.ListPicText.ArtistList { padding: 10px 2.5vw 20px; }
	.ArtistList .item { margin-bottom: 40px; }

	/* Media */
	.ListPicText.MediaList .imgBox .time { font-size: 1.25em; }
}

/*----------------------------------------------------------------------*/
/* 列表搜尋 */
.ListHeader { padding-bottom: 20px; }
.ListSearch { font-size: 1.875em; text-transform: uppercase; }
.ListSearch.FormElmt select, .ListSearch.FormElmt input[type="text"], .ListSearch.FormElmt button, .ListSearch .item > a {
	width: 100%; border-radius: 10px;
	box-shadow: 0 2px 2px rgb(12,1,3),
				0 -3px 10px 10px rgb(12,1,3), 
				0 3px 6px 3px rgba(255,255,255,.5),
				0 2px 2px 2px rgba(255,255,255,.5),
				0 0 3px 3px rgba(0,0,0,0.6) inset,
				0 -2px 4px 1px rgba(255,255,255,0.35) inset;
}
.ListSearch.FormElmt select, .ListSearch.FormElmt input[type="text"] { background: linear-gradient(#202020 48%, #141414 52%); }
.ListSearch.FormElmt select option { background: #202020; }
.ListSearch.FormElmt input[type="text"]::placeholder { color: #fff; }
.ListSearch .item > a { display: block; width: 100%; text-align: center; white-space: nowrap; background: linear-gradient(#49555c 48%, #262d30 52%); color: #fff; border-radius: 10px; padding: 0 .5em; box-sizing: border-box; text-transform: uppercase; }
.ListSearch .search_btn button { background: linear-gradient(#afb41f 48%, #616412 52%); border-radius: 10px; padding: 0 .5em; }
.ListSearch .btn > * { font-weight: 500; }
.ListSearch .input_text > * { text-align: center; }
.ListSearch .select-selected { padding: 0 .375em; }
.ListSearch .select-selected:after { border-width: 12px 8px 0 8px; right: 14px; margin-top: -4px; }
.ListSearch .select-selected.select-arrow-active:after { border-width: 0 8px 12px 8px; margin-top: -5px; }

.ListSearch.FormElmt select, .ListSearch.FormElmt input, .ListSearch.FormElmt button, .ListSearch .item > a, .ListSearch .select-selected { height:50px; }
.ListSearch .item > a, .ListSearch .select-selected { line-height: 50px; }

.ListHeader.for_news { display: flex; justify-content: center; align-items: center; }
.ListHeader.for_news .ListSearch { display: flex; }
.ListHeader.for_news .ListSearch > div { flex: 1; }
.ListHeader.for_news .ListSearch { margin-right: 20px; flex: 1; }

.ListHeader.for_artist .ListSearch { display: flex; flex-wrap: wrap; }

.ListHeader.for_media .ListSearch { display: flex; flex-wrap: wrap; }

.ListHeader.for_two_item .ListSearch { display: flex; flex-wrap: wrap; max-width: 850px; margin: 0 auto; }
.ListHeader.for_two_item .ListSearch > div { flex: 1; margin-left: 20px; }
.ListHeader.for_two_item .ListSearch > div:first-child { margin-left: 0; }

.ListHeader.for_dealer .ListSearch { display: flex; flex-wrap: wrap; }


@media screen and (max-width: 639px) {
	.ListHeader { padding-bottom: 20px; }
	.ListSearch { font-size: 1.375em; }
	.ListSearch.FormElmt select, .ListSearch.FormElmt input, .ListSearch.FormElmt button, .ListSearch .item > a, .ListSearch .select-selected { height:40px; }
	.ListSearch .item > a, .ListSearch .select-selected { line-height: 40px; }
	.ListSearch.FormElmt select, .ListSearch.FormElmt input[type="text"], .ListSearch.FormElmt button, .ListSearch .item > a, .select-selected {
		box-shadow: 0 2px 2px rgb(12,1,3),
					0 -4px 2px 6px rgb(12,1,3), 
					0 2px 5px 2px rgba(255,255,255,.3),
					0 0 2px 2px rgba(0,0,0,0.6) inset,
					0 -4px 6px rgba(255,255,255,0.3) inset;
	}

	.ListSearch .select-selected:after { border-width: 10px 6px 0 6px; margin-top: -4px; }
	.ListSearch .select-selected.select-arrow-active:after { border-width: 0 6px 10px 6px; margin-top: -5px; }

	.ListHeader.for_artist .ListSearch { flex-direction: column; }
	.ListHeader.for_artist .ListSearch .item { margin-bottom: 15px; }

	.ListHeader.for_media .ListSearch .item { flex: 2; }
	.ListHeader.for_media .ListSearch .item.btn { flex: 1; margin-left: 20px; }

	.ListHeader.for_two_item .ListSearch { flex-direction: column; }
	.ListHeader.for_two_item .ListSearch .item { margin-bottom: 15px; margin-left: 0; }

	.ListHeader.for_dealer .ListSearch { flex-direction: column; }
	.ListHeader.for_dealer .ListSearch .item { margin-bottom: 15px; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.ListSearch { font-size: 1.75em; }
	.for_artist .ListSearch > div { flex: 0 auto; margin-left: 2%; width: 32%; margin-bottom: 20px; }
	.for_artist .ListSearch > div:nth-child(3n+1) { margin-left: 0; }
	.for_artist .ListSearch .btn { width: auto; flex: 1; }

	.ListHeader.for_media .ListSearch .item { flex: 2; }
	.ListHeader.for_media .ListSearch .item.btn { flex: 1; margin-left: 20px; }

	.for_dealer .ListSearch > div { flex: 0 auto; margin-left: 2%; width: 48%; margin-bottom: 20px; }
	.for_dealer .ListSearch > div:nth-child(2n+1) { margin-left: 0; }
}
@media screen and (min-width: 1024px) {
	/* News */
	.ListHeader.for_news .ListSearch { max-width: 1000px; }
	@media screen and (min-width: 1500px) {
		.ListHeader.for_news .ListSearch { flex: 0 auto; }
		.ListHeader.for_news .ListSearch .item { width: 1000px; }
	}

	/* Artists */
	.ListHeader { padding-bottom: 35px; }
	.for_artist .ListSearch > div { flex: 1; margin-left: 20px; }
	.for_artist .ListSearch > div:first-child { margin-left: 0; }
	.for_dealer .ListSearch > div { flex: 1; margin-left: 20px; }
	.for_dealer .ListSearch > div.input_text { flex: 2; }
	.for_dealer .ListSearch > div:first-child { margin-left: 0; }

	/* Media */
	.ListHeader.for_media .ListSearch { justify-content: center; }
	.ListHeader.for_media .ListSearch .item { width: 645px; }
	.ListHeader.for_media .ListSearch .item.btn { width: 250px; margin-left: 20px; }
}

/*----------------------------------------------------------------------*/
/* 頁碼 */
#Pagination { padding-bottom: 20px; }
#Pagination .pages { display:flex; flex-wrap: wrap; justify-content: center; align-items: center; }
#Pagination a { 
	margin:0 5px; text-decoration:none; position:relative; 
	color:#eeeeee; padding: 5px;
    font-size: min(max(1.25rem, 4vw), 1.5rem);
	-webkit-border-radius:5px;
	-moz-border-radius:5px; 
	border-radius:5px; 
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	transition:all 0.3s ease;
	}
	#Pagination a:hover, #Pagination a:focus { color:var(--main_color); }
	#Pagination a.focuz { color:var(--main_color); }

#Pagination a.first, #Pagination a.last, #Pagination a.prev, #Pagination a.next { font-size: 0; width:30px; height:30px; padding: 0; }
#Pagination a.first::before, #Pagination a.first::after, #Pagination a.last::before, #Pagination a.last::after,
#Pagination a.prev::before, #Pagination a.next::before { 
	content:''; position:absolute; top:50%; width:6px; height:6px; border-top:1px solid #fff; border-left:1px solid #fff;
	}
#Pagination a.first::before, #Pagination a.first::after, #Pagination a.prev::before { 
    margin-top:-3px; 
	-webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
	}
#Pagination a.last::before, #Pagination a.last::after, #Pagination a.next::before { 
    margin-top:-3px; 
	-webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    transform: rotate(135deg);
	}
#Pagination a.first:hover::before, #Pagination a.first:hover::after, #Pagination a.last:hover::before, #Pagination a.last:hover::after,
#Pagination a.first:focus::before, #Pagination a.first:focus::after, #Pagination a.last:focus::before, #Pagination a.last:focus::after,
#Pagination a.prev:hover::before, #Pagination a.next:hover::before,
#Pagination a.prev:focus::before, #Pagination a.next:focus::before { 
	border-color:var(--main_color); 
	}
#Pagination a.first::before { left:14px; }
#Pagination a.first::after { left:22px; }
#Pagination a.prev::before { left:16px; }
#Pagination a.next::before { right:16px; }
#Pagination a.last::before { right:14px; }
#Pagination a.last::after { right:22px; }
	
#Pagination .setting { display:none; padding-top:10px; line-height:36px; }

@media (max-width: 1023px) {
	#Pagination a { display:none; }
	#Pagination a.first, #Pagination a.prev, #Pagination a.next, #Pagination a.last { display:inline-block; }
}
@media screen and (min-width: 1024px) {
	#Pagination { padding: 60px 0; }
}

/*----------------------------------------------------------------------*/
/* History */
.HistoryYears ul { display: flex; justify-content: center; flex-wrap: wrap; margin: 20px auto 0; max-width: 1200px; }
.HistoryYears li {
    border: 2px solid #fff; font-size: 1.5em; padding: 5px 1em; margin: 8px; cursor: pointer;
    -webkit-border-radius:50px; -moz-border-radius:50px; border-radius:50px; 
    -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease;
}
.HistoryYears li:hover { border-color: var(--main_color); background-color: var(--main_color); color: #0c0103; }

.HistoryList { padding-top: 30px; padding-bottom: 30px; }
.HistoryList img { max-width: 100%; }
.HistoryList .item { display: flex; position: relative; padding-bottom: 50px; }
.HistoryList .item::before {
    content: ''; display: inline-block; height: calc(100% - 61px); width: 1px; background: #fff;
    position: absolute; left: 500px; top: 51px;
}
.HistoryList .imgBox {
    width: 500px; display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end;
    padding-right: 35px; box-sizing: border-box;
    -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: start; align-content: flex-start;
}
.HistoryList .imgBox .img { padding: 10px 20px 10px 0; width: 100%; max-width: 315px; text-align: center; }
.HistoryList .textBox { width: calc(100% - 500px); padding-right: 20px; position: relative; box-sizing: border-box; }
.HistoryList .textBox::before, .HistoryList .textBox::after { content: ''; display: inline-block; position: absolute; border-radius: 50%; }
.HistoryList .textBox::before { background: rgba(255,255,255,.4); width: 36px; height: 36px; top: 3px; left: -18px; }
.HistoryList .textBox::after { background: var(--main_color); width: 12px; height: 12px; top: 15px; left: -6px; }
.HistoryList .textBox .box { padding-left: 95px; position: relative; }
.HistoryList .textBox .box::before {
    content: ''; display: inline-block; width: 50px; height: 1px; background-color: #fff;
    position: absolute; left: 30px; top: 22px;
}
.HistoryList .textBox .year {
    color: var(--main_color); display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 2.5em; font-weight: 600;
}
.HistoryList .textBox ul { font-size: 1.25em; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; }

.BlockTitle { margin-top: 50px; }
.BlockTitle h5 { font-size: 2rem; color: #333; line-height: 120%; margin-bottom: 5px; text-align: center; }

@media screen and (max-width: 639px) {
	.HistoryYears li { font-size: 1.125em; margin: 5px; }
	.HistoryList .item { flex-wrap: wrap; padding-bottom: 30px; }
	.HistoryList .item::before { left: 15px; top: 36px; height: calc(100% - 39px); }
	.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: 40px; }
	.HistoryList .textBox { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; width: 100%; }
	.HistoryList .textBox::before { top: 6px; left: 4px; width: 22px; height: 22px; }
	.HistoryList .textBox::after { top: 13px; left: 11px; width: 8px; height: 8px; }
	.HistoryList .textBox .box { padding-left: 40px; }
	.HistoryList .textBox .box::before { display: none; }
	.HistoryList .textBox ul { padding: 0; font-size: 1.125em; }
	.HistoryList .textBox .year { font-size: 2em; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.HistoryList .item { flex-wrap: wrap; }
	.HistoryList .item::before { left: 19px; top: 51px; }
	.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: 95px; }
	.HistoryList .textBox { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; width: 100%; }
	.HistoryList .textBox::before { left: 0; }
	.HistoryList .textBox::after { left: 12px; }
	.HistoryList .textBox .box::before { left: 45px; width: 40px; }
	.HistoryList .textBox ul { padding: 0; }
}
@media screen and (min-width: 1024px) {
	.HistoryYears { padding-bottom: 45px; }
	.HistoryYears li { font-size: 1.875em; padding: 0px 1.25em; }
	.HistoryList { padding-left: 2.8vw; padding-right: 2.8vw; }
	.HistoryList .imgBox .img { padding: 2px 20px 18px 0; }
}
@media screen and (min-width: 1024px) and (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 { display: none; }
}

/*----------------------------------------------------------------------*/
/* Airtist */
.bg_color01 + .artist_list_block { padding-top: 40px; }

.artist_imgBox { max-width: 1520px; margin: 0 auto; text-align: center; position: relative; }
.artist_imgBox img { max-width: 100%; }
.artist_imgBox .titleBox {
	position: absolute; bottom: 0; left: 0; width: 100%; text-transform: uppercase;
	background: linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 50px,rgba(0,0,0,.7) 100%);
}
.artist_name { font-size: min(max(1.875rem, 5vw), 4.25rem); color: var(--main_color); padding-top: 40px; }
.artist_name span { margin-right: .25em; display: inline-block; }
.artist_name .bold { font-weight: 600; }
.artist_band { font-size: min(max(1.125rem, 4vw), 2.75rem); margin-bottom: 20px; }
.artist_info { text-transform: uppercase; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; font-weight: 400; }
.artist_info dl { display: flex; flex-wrap: wrap; }
.artist_info dl.artist_about { font-size: min(max(1.25rem, 4vw), 1.5rem); margin-bottom: 10px; }
.artist_info dl.artist_about dt { margin-right: 0.125em; }
.artist_info dl.artist_about a { color: #fff; }
.artist_info dl.artist_about a:hover { color: var(--main_color); }
.artist_info dl.social_list { margin: 20px 0 15px; }
.artist_info dl.social_list dd { margin: 10px; }
.artist_info dl.social_list dd a::before { filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(302deg) brightness(106%) contrast(101%); }

.artist_contBox #Breadcrumbs { font-size: 1.375em; margin-bottom: 1em; position: relative; left: auto; bottom: auto; }
.artist_contBox #Breadcrumbs ul { justify-content: flex-start; }

@media screen and (max-width: 639px) {
	.artist_name { padding-top: 20px; }
	.artist_band { margin-bottom: 10px; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.artist_info dl.social_list dd { margin: 10px 20px 10px 10px; }
	.artist_info .social_list a, .artist_info .social_list a:before { width: 28px; height: 28px; }
	.artist_name { padding-top: 30px; }
}
@media screen and (min-width: 1024px) {
	.artist_info dl.social_list dd { margin: 10px 30px 10px 10px; }
	.artist_info .social_list a, .artist_info .social_list a:before { width: 32px; height: 32px; }
}

/*----------------------------------------------------------------------*/
/* Become Artist */
.form_titleBox { border-top: 2px solid #4b575e; border-bottom: 2px solid #4b575e; padding: 10px 0; margin-top: 4%; margin-bottom: 1%; }
.form_titleBox h5 { font-size: 1.875em; font-weight: 600; text-transform: uppercase; color: var(--main_color); }
.form_titleBox .desc { font-size: 1.25em; }
.form_titleBox h5 + .desc { margin-top: 5px; }

table.form_list_table { border-spacing: 0; width: 100%; max-width: 795px; margin-top: .75em; margin-bottom: .75em; }
table.form_list_table.wAuto { width: auto; }
table.form_list_table.wLarge { max-width: 850px; }
.form_list_table th, .form_list_table td { padding: 4px 5px; }
.form_list_table tr th:first-child, .form_list_table tr td:first-child { padding-left: 0; }
.form_list_table th { font-weight: 300; }

.form_table_st1 tr td:first-child { width: 8em; }
.form_table_st2 tr td:first-child { width: 2.5em; }

@media screen and (max-width: 639px) {
	.form_titleBox .desc { font-size: 1.25em; }
	table.form_list_table { margin-top: 0; }
	table.form_list_table tr, table.form_list_table th, table.form_list_table td { display: block; text-align: left; }
	table.form_list_table th, table.form_list_table td { padding: 5px 0; }
	table.form_list_table td.with_data::before { content: attr(data-title); padding-bottom: 5px; display: block; }
	table.form_list_table .mob_hide { display: none; }
	table.form_list_table .tr_title { margin-top: 0.5em; font-weight: 500; }
	table.form_list_table.wAuto { width: 100%; }
	.FormTable input.w230 { width: 100%; }
	.FormTable .control input.w230 { width: 230px; }
}

/*----------------------------------------------------------------------*/
/* FAQs 問與答 */
.faqsBox { padding-bottom: 30px; }
.faqsBox h3.faqTitle { margin-bottom: 20px; font-size: 1.875em; font-weight: 600; color: var(--main_color); }
.faqsBox .item { margin-bottom: 20px; background-color: #212121; }
.faqsBox .item a { color: #fff; }
.faqsBox .item a:hover { color: var(--main_color); }
.faqsBox .item:nth-last-of-type(1) { margin-bottom: 0; }
.faqsBox .item .icon-arrow {
	position: relative; width: 40px; height: 40px;
}
.faqsBox .item .icon-arrow::before {
	content: ''; position: absolute; right: 12px; top: 50%; margin-top: -10px;
	width: 14px; height: 14px; border-bottom: 2px solid #fff; border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);
    transition: transform 0.25s ease-out;
    -webkit-transition: transform 0.25s ease-out;
    -moz-transition: transform 0.25s ease-out;
}
.faqsBox .item.slideDown .icon-arrow::before {
	margin-top: -4px; border-color: var(--main_color);
    -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); transform: rotate(-135deg);
}
.faqsBox .top_block {
    position: relative; min-height: 50px; box-sizing: border-box; padding: 10px 1em 10px 2em;
	display: flex; align-items: center;
}
.faqsBox .top_block:hover { cursor: pointer; }
.faqsBox .item.slideDown .top_block { color: var(--main_color); }
.faqsBox .top_block .title { flex: 1; font-size: min(max(1.25rem, 4vw), 1.375rem); }

.faqsBox .cont_block { box-sizing: border-box; padding: 0 3em 10px 2em; }
.faqsBox .cont_block .editable_content { margin: 0; }
.faqsBox .cont_block .desc { position: relative; }

@media screen and (max-width: 639px) {
	.faqsBox h3.faqTitle { font-size: 2em; }
	.faqsBox .top_block { padding: 10px .5em 10px 1em; }
	.faqsBox .cont_block { padding: 0 1.5em 10px 1em; }
}

/*----------------------------------------------------------------------*/
/* Search Results */
.search_title { font-size: min(max(2rem, 4.5vw), 4.25rem); color: var(--main_color); padding-bottom: 1em; border-bottom: 10px solid #4b575e; font-family: 'Gotham', 'Gotham Condensed', 'sans-serif'; font-weight:600; }
.search_list { margin-bottom: 30px; }
.search_list > li { padding: 30px 0; border-bottom: 5px solid #4b575e; }
.search_list .title { font-size: min(max(1.25rem, 2.75vw), 1.875rem); font-weight: 600; padding-bottom: 10px; }
.search_list .title a { color: #fff; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease; }
.search_list .title a:hover { color: var(--main_color); }
.search_list .location ul { display: flex; flex-wrap: wrap; font-size: min(max(1.125rem, 2vw), 1.5rem); }
.search_list .location ul li:first-child:before { display: none; }
.search_list .location ul li::before { content: '>'; padding: 0 5px; }

@media screen and (min-width: 640px) and (max-width: 1023px) {
	.search_title { border-bottom: 14px solid #4b575e; }
	.search_list > li { padding: 4% 0; border-bottom: 7px solid #4b575e; }
}
@media screen and (min-width: 1024px) {
	.search_title { border-bottom: 20px solid #4b575e; font-size: 4.25em; }
	.search_list > li { padding: 8% 0; border-bottom: 10px solid #4b575e; }
}

/*----------------------------------------------------------------------*/
/* Find Us */
.dealer_map_wraper { position:relative; }
#dealer_map { width:100%; }

.dealer_info dt { margin-bottom:5px; font-size:18px; }
.dealer_info dt, .dealer_info dd { padding:2px 0; line-height:120%; }
.dealer_info a { color:#333; }
.dealer_info a:hover { color:var(--main_color); }
.dealer_info .go { margin-top:10px; text-align:right; }
.dealer_info .go a { font-size:18px; text-decoration:none; }

.dealer_list .item { border-bottom:1px solid #d4d0cd; padding:20px 10px 15px; position:relative; overflow:hidden; }
.dealer_list .item:first-child { border-top:1px solid #d4d0cd; }
.dealer_list dl { min-height:90px; }
.dealer_list dt { font-family:'Gotham XNarrow', sans-serif; font-weight:500; line-height:30px; font-size:1.375rem; }
.dealer_list dd { padding:5px 0; line-height:20px; }
.dealer_list dd:not(.web):not(.go) { word-break:break-all; }
.dealer_list a { color:#fff; }
.dealer_list a:hover { color:var(--main_color); }

@media screen and (max-width: 479px) {
	.dealer_list dd.web { float:left; width:50%; }
	.dealer_list dd.go { float:right; width:50%; text-align:right; }
}
@media screen and (min-width: 480px) and (max-width: 639px) {
	.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: 640px) 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) and (max-width: 1023px) {
    #dealer_map { height:100vh; }
}
@media screen and (min-width: 1024px) {
	#dealer_map { height:65vh; }
}
@media screen and (max-width: 767px) {
	.dealer_map_wraper { display:none; }
	.dealer_list { display:block; }
}
@media screen and (min-width: 768px) {
	.dealer_list { display:none; }
}

/*----------------------------------------------------------------------*/
/* Product */
.pro_list_title { background-color: #A8B400; color: #0c0103; display: flex; justify-content: center; align-items: center; }
.pro_list_title h3 { text-transform:uppercase; letter-spacing: .1em; padding-left: 0.1em; padding-top: .1em; padding-bottom: .1em; font-family: 'Bank Gothic', 'sans-serif'; font-weight:500; text-align: center; }

.pro_list { background-size: cover; background-position: center; }
.pro_list ul { display: flex; flex-wrap: wrap; justify-content: center; text-align: center; max-width: 1280px; margin: 0 auto; }
.pro_list ul li { width: 20%; display: flex; justify-content: center; align-items: center; }
.pro_list ul li .item { position: relative; width: 100%; margin: 10px; }
.pro_list .item_title { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.pro_list .item_title a { font-weight: 500; font-size: min(max(1.125rem, 4.5vw), 1.875rem); color: #fff; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; padding: 5px; box-sizing: border-box; text-transform: uppercase; }
.pro_list .imgBox { width: 100%; height: 0; padding-bottom: 100%; position: relative; overflow: hidden; }
.pro_list .imgBox img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.pro_list li .imgBox img, .pro_list .item_title, .pro_list .item_title a { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.pro_list .item:hover .imgBox img { filter: saturate(0%) brightness(55%); }
.pro_list .item:hover .item_title { background-color: rgba(0,0,0,.7); }
.pro_list .item:hover .item_title a { color: var(--main_color); }

.pro_sub_list { background-color: #fff; color: #0c0103; padding: 30px 5% 40px; }
.pro_sub_list ul { max-width: 1280px; margin: 0 auto; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; letter-spacing: .01em; }
.pro_sub_list ul li { margin-top: 30px; }
.pro_sub_list ul li:first-child { margin-top: 0; }
.pro_sub_list ul li:nth-child(even) { flex-direction: row-reverse; }
.pro_sub_list .title { padding: 15px 0; }
.pro_sub_list .title a { color: #0c0103; font-weight: 600; font-size: min(max(1.25rem, 4vw), 1.625rem); text-transform:uppercase; }
.pro_sub_list .title a:hover { color: var(--main_color); }
.pro_sub_list .imgBox { position: relative; overflow: hidden; text-align: center; padding: 10px 0; }
.pro_sub_list .imgBox img { max-width: 100%; }
.pro_sub_list .imgBox a:hover img { opacity: 0.8; }
.pro_sub_list .desc { font-size:min(max(1.125rem, 4vw), 1.375rem); line-height: 1.25em; }
.pro_sub_list .desc a { color: #0c0103; }
.pro_sub_list .desc a:hover { color: var(--main_color); }
.pro_sub_list .icon_more { display: inline-block; background: url(../images/icon_more_arrow.svg); width: 23px; height: 23px; vertical-align: middle; margin-left: 5px; font-size: 0; }
.pro_sub_list .icon_more:hover { opacity: 0.7; }
.pro_sub_list .cont a, .pro_sub_list .imgBox a img, .pro_sub_list .icon_more { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }

.pro_sub_list .more_btn { text-align: center; padding: 25px 0 10px; }
.pro_sub_list .more_btn a {
	font-size: 1.5em; font-weight: 500; text-transform: uppercase; padding: 9px 15px; display: inline-block; letter-spacing: .05em; width: 123px; height: 51px; box-sizing: border-box;
	-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;
	background: url(../images/product/more_btn_bg.png) no-repeat; background-size: contain;
}
.pro_sub_list .more_btn a:hover { color: var(--main_color); transform: translateY(8px); }

.pro_sub_list.reverse ul li:nth-child(odd) { flex-direction: row-reverse; }
.pro_sub_list.reverse ul li:nth-child(even) { flex-direction: row; }

/* 產品第二層的側選單 */
.pro_sub_menu_box { position: fixed; left: -350px; top: 0; z-index: 9990; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.pro_sub_menu_box.show { left: 0; }

.sub_menu_switch {
	background-color: var(--main_color); color: #000; font-size: 1.875rem; font-weight: 600; text-transform: uppercase;
	position: absolute; top: 40%; right: -60px; width: 60px; height: 180px;
	display: flex; justify-content: center; align-items: center; cursor: pointer;
	-webkit-writing-mode:vertical-lr; -moz-writing-mode:vertical-lr; -ms-writing-mode:vertical-lr; writing-mode:vertical-lr;
}
.sub_menu_switch::before {
	content: ''; display: inline-block; margin-bottom: 10px;
	width: 0; height: 0; border-style: solid; border-width: 14px 0 14px 24px; border-color: transparent transparent transparent #000000;
}
.pro_sub_menu_box.show .sub_menu_switch::before { border-width: 14px 24px 14px 0; border-color: transparent #000000 transparent transparent; }
.sub_menu_switch:hover::before { animation: icon_float .8s linear infinite; }
@-webkit-keyframes icon_float {
	0% { transform: translateX(0px); }
	70% { transform: translateX(4px); }
	100% { transform: translateX(0px); }
}

.sub_menu_body { background: rgba(33,33,33,.98); width: 350px; height: 100vh; padding: 75px 20px 20px 20px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; font-size: 1.5em; font-weight: 600; line-height: 1.25em; text-transform:uppercase; }
.sub_menu_body ul { overflow-y: auto; }
.sub_menu_body li { padding: 6px 0; cursor: pointer; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.sub_menu_body li:hover { color: var(--main_color); }

@media screen and (max-width: 639px) {
	.pro_list { padding: 7% 5%; }
	.pro_list ul li { width: 33.3333%; }

	.sub_menu_body { font-size: 1.25em; width: 250px; }
	.pro_sub_menu_box { left: -250px; }
	.sub_menu_switch { width: 40px; right: -40px; height: 100px; font-size: 1.5em; }
	.sub_menu_switch::before { border-width: 8px 0 8px 16px; margin-bottom: 5px; }
	.pro_sub_menu_box.show .sub_menu_switch::before { border-width: 8px 16px 8px 0; }
}
@media (max-width: 768px) and (orientation: landscape) {
	.sub_menu_body { font-size: 1.25em; width: 250px; }
	.pro_sub_menu_box { left: -250px; }
	.sub_menu_switch { width: 40px; right: -40px; height: 100px; font-size: 1.5em; }
	.sub_menu_switch::before { border-width: 8px 0 8px 16px; margin-bottom: 5px; }
	.pro_sub_menu_box.show .sub_menu_switch::before { border-width: 8px 16px 8px 0; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.pro_list { padding: 65px 5%; }
	.pro_list .item_title a { font-size: 1.25em; }
}
@media screen and (min-width: 1024px) {
	.pro_list { padding: 5%; }
	.pro_list ul li .item { margin: 15px; }
	.hardwared_list .item_title a { font-size: 1.75em; }
	.pro_sub_list .item_title a { font-size: 1.625em; }
	.pro_list .item_title a { font-size: 2.5em; }

	.pro_sub_list ul li { display: flex; justify-content: space-between; align-items: center; }
	.pro_sub_list .imgBox { width: 55%; max-width: 645px; }
	.pro_sub_list .cont { width: 45%; padding-left: 100px; }
	.pro_sub_list ul li:nth-child(even) .cont { padding-left: 0; padding-right: 100px; }
	.pro_sub_list.reverse ul li:nth-child(odd) .cont { padding-left: 0; padding-right: 100px; }
	.pro_sub_list.reverse ul li:nth-child(even) .cont { padding-left: 100px; padding-right: 0; }
}

/*----------------------------------------------------------------------*/
/* 產品內頁 - 白色區域 */
.pro_top_info { background-color: #fff; color: var(--bg_color); padding: 20px 0; }
.pro_top_info h3 { font-size: 2em; font-weight:500; text-transform: uppercase; }
.pro_top_info .model { font-size: 1.875em; font-weight: 600; color: var(--main_color); }
.photo_album { margin: 20px 0 30px; }
.pro_photograph { position: relative; overflow: hidden; margin: 0 auto 30px; max-width: 1160px; }
.pro_photograph .swiper-wrapper { align-items: center; }
.pro_photograph .imgBox { width: 100%; position: relative; overflow: hidden; text-align: center; }
.pro_photograph .imgBox img { max-width: 100%; }

.configurations { text-align: right; padding-bottom: 25px; }
.config_switch { cursor: pointer; font-size: 1.5em; box-shadow: 0 1px 0 var(--bg_color); transition: .3s; display: inline-block; }
.config_switch::after { content: ' >'; }
.config_switch:hover { color: var(--main_color); box-shadow: 0 1px 0 var(--main_color); }

.pro_info_bottom .col_l { padding-bottom: 30px; }
.hardware_title { font-size: 1.5em; font-weight: 500; text-transform: uppercase; padding-bottom: 10px; }
.pro_info_bottom.for_marching .hardware_title { font-size: 1.5em; font-weight: 600; }
.hardware_list ul { display: flex; overflow-x: auto; overflow-y: hidden; }
.hardware_list ul li { text-align: center; }
.hardware_list .item { position: relative; width: 160px; }
.hardware_list .imgBox { width: 100%; height: 0; padding-bottom: 62.5%; position: relative; overflow: hidden; }
.hardware_list .imgBox img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }
.hardware_list .item_title { position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-transform: uppercase; }
.hardware_list .item_title a { font-weight: 500; font-size: 1.5em; color: #fff; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; padding: 15px; box-sizing: border-box; visibility: hidden; }
.hardware_list .item_title span { font-weight: 500; font-size: 1.5em; color: #fff; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; padding: 15px; box-sizing: border-box; visibility: hidden; cursor: pointer; }
.hardware_list li .imgBox img, .hardware_list .item_title { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.hardware_list .item:hover .item_title, .hardware_list .active .item_title { background-color: rgba(0,0,0,.7); }
.hardware_list .item:hover .item_title a, .hardware_list .active .item_title a { visibility:visible; }
.hardware_list .item:hover .item_title span, .hardware_list .active .item_title span { visibility:visible; }
.hardware_list ul::-webkit-scrollbar { width: 10px; height: 10px; background-color: #d6d6d7; }
.hardware_list ul::-webkit-scrollbar-thumb { background-color: #b3b4b5; }
.hardware_list ul::-webkit-scrollbar-thumb:hover { background: var(--main_color); }
.pro_info_bottom .hardware_list .item { width: 128px; margin-right: 20px; }
.pro_info_bottom .hardware_list .imgBox { padding-bottom: 78.125%; }
.tab_cont .hardware_list .item { padding: 10px; box-sizing: border-box; }

.buy_btn { margin: 10px 0 20px; display: flex; justify-content: end; }
.buy_btn a, .buy_switch {
	background: linear-gradient(#afb41f 48%, #616412 52%); border-radius: 10px; padding: .3334em .5em; display: inline-block; text-align: center; max-width: 100%; width: 330px; cursor: pointer; position: relative;
	color: #fff; text-transform: uppercase; font-size: 2.25em; font-weight: 500; box-sizing: border-box;
	-webkit-transition: all 0.1s ease; -moz-transition: all 0.1s ease; transition: all 0.1s ease;
	box-shadow: 0 2px 2px rgba(255,255,255,.5),
				0 -3px 5px 2px rgb(183,183,183), 
				0 3px 6px 3px rgba(255,255,255,.5),
				0 2px 2px 2px rgba(255,255,255,.5),
				0 0 3px 3px rgba(126,126,126,0.6) inset,
				0 -2px 4px 1px rgba(255,255,255,.35) inset;
}
.buy_switch::before, .buy_switch::after { content: ''; position: absolute; top: 46%; right: 20px; width: 18px; height: 5px; background-color: #fff; }
.buy_switch::after { transform: rotate(90deg); opacity: 1; }
.buy_switch.show::after { opacity: 0; }
.buy_btn a:hover, .buy_switch:hover { transform: translateY(5px); }
.logo_list { width: 100%; margin-bottom: 30px; transform:scaleY(0); height:0; visibility:hidden; opacity:0; transition:opacity 0.3s ease; }
.logo_list.show { transform:scaleY(1); height:auto; visibility:visible; opacity:1; }
.logo_list ul { display: flex; flex-wrap: wrap; margin-left: -15px; margin-right: -15px; }
.logo_list ul li { width: 25%; padding: 15px; box-sizing: border-box; }
.logo_list .imgBox { height: 200px; }
.logo_list .imgBox a { background-color: #fff; box-shadow: 5px 5px 5px rgba(0,0,0,.3); width: 100%; height: 100%;  display: flex; justify-content: center; align-items: center; -webkit-transition: all 0.1s ease; -moz-transition: all 0.1s ease; transition: all 0.1s ease; }
.logo_list .imgBox img { max-width: 100%; max-height: 100%; }
.logo_list .imgBox:hover a { box-shadow: 3px 5px 20px rgba(0,0,0,.5); transform: translateY(-5px); }

/* 產品切換 */
.pro_tabs_group .tab_title { display: flex; margin-bottom: 20px; }
.pro_tabs_group .tab_title .item { cursor: pointer; color: #4b575e; font-weight: 400; width: 280px; margin-right: 7px; text-transform: uppercase; text-align: center; font-size: 1.5em; position: relative;  display: flex; align-items: center; justify-content: center; border-bottom: 2px solid #76777a; }
.pro_tabs_group .tab_title .item.active { color: var(--main_color); font-weight: 600; }

.pro_tabs_group .tab_cont { transform:scaleY(0); height:0; visibility:hidden; opacity:0; transition:opacity 0.3s ease; overflow:hidden; }
.pro_tabs_group .tab_cont.show { transform:scaleY(1); height:auto; visibility:visible; opacity:1; }

/*----------------------------------------------------------------------*/
/* 產品內頁 - 黑色區域 */
.pro_block_title { font-size: 1.875em; font-weight: 600; padding: .25em 0; margin: 4% 0 20px 0; text-transform: uppercase; color: var(--main_color); border-top: 2px solid var(--main_color); border-bottom: 2px solid var(--main_color); }

.sas_table_box { padding: 15px 0; }
.sas_table_box div { margin: 0; }
@media screen and (max-width: 639px) {
	.sas_table_box .dep { display: none; }
}
@media screen and (min-width: 640px) {
	.sas_table_box .mob { display: none; }
	.sas_table_box { overflow-x: auto; overflow-y: hidden; }
}

.spec_wrap { overflow:hidden; }
.spec_group { width:calc(100% + 2px); overflow-x: auto; padding: 10px 0; margin:0 -1px; }
.spec_group::-webkit-scrollbar { width: 12px; height: 12px; background: #212121; }
.spec_group::-webkit-scrollbar-thumb { background: #76777a; border-radius: 6px; min-width: 30px; min-height: 30px; }
.spec_group::-webkit-scrollbar-thumb:hover { background: var(--main_color); }
.spec_title { font-size: 1.375em; font-weight: 600; padding-bottom: .375em; }
.spec_table { width: 100%; border-top: 2px solid #fff; min-width: 960px; letter-spacing: .02em; font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; }
.spec_table th, .spec_table td { border-bottom: 1px solid rgba(255,255,255,.4); border-right: 1px solid rgba(255,255,255,.4); text-align: center; padding: 0 .5em; line-height: 1.5em; }
.spec_table td:first-child { white-space: nowrap; }
.spec_table th { font-size: 1.25em; font-weight: 600; }
.spec_table td { font-size: 1.125em; font-weight: 400; padding: 0.25em .5em; }
.spec_table th.model, .spec_table td.model { width: 4em; }
.spec_table th.size, .spec_table td.size { width: 8em; }
.spec_table th.ws, .spec_table td.ws { width: 6em; }
.spec_table.for_drum th, .spec_table.for_drum td { text-align: left; }
.spec_table.for_drum td { vertical-align: top; }
.spec_table.for_drum td .font_bold { font-size: 1.25rem; font-weight: 600; }
.spec_table li { padding-left: 1em; }
.spec_table li::before { content: '-'; margin-left: -0.25em; }

/* swiper設定 */
.videoSwiper { width: 100%; height: 100%; }
.videoSwiper .item { text-align: center; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.videoSwiper .item:hover { opacity: .7; }
.videoSwiper .swiper-slide img { max-width: 100%; max-height: 100%; }

/* swiper箭頭設定 */
.videoSwiper .swiper-button-prev, .videoSwiper .swiper-container-rtl .swiper-button-next { background-color: rgba(0,0,0,.5); background-image: none; left: 0; }
.videoSwiper .swiper-button-next, .videoSwiper .swiper-container-rtl .swiper-button-prev { background-color: rgba(0,0,0,.5); background-image: none; right: 0; }
.videoSwiper .swiper-button-next, .videoSwiper .swiper-button-prev { top: 0; height: 100%; margin-top: 0; width: 35px; }
.swiper-button-next::before, .swiper-button-prev::before { content:''; position:absolute; top:50%; margin-top:-10px; width:18px; height:18px; border-top:2px solid #A8B400; border-left:2px solid #A8B400; }
.swiper-button-next::before { right:12px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); transform: rotate(135deg); }
.swiper-button-prev::before { left:12px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); }
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { background-color:transparent; }

.pro_photograph .swiper-button-next, .pro_photograph .swiper-button-prev { background-image: none; }
.pro_photograph .swiper-button-next { right: 0; }
.pro_photograph .swiper-button-prev { left: 0; }
.pro_photograph .swiper-button-next::before, .pro_photograph .swiper-button-prev::before { border-color: var(--bg_color); }
.pro_photograph .swiper-slide { padding: 0 30px; box-sizing: border-box; }

/* swiper卷軸設定 */
.videoSwiper.swiper-container { padding-bottom: 20px; }
.videoSwiper .swiper-scrollbar { background-color: #212121; }
.videoSwiper .swiper-scrollbar-drag { background: #76777a; }
.videoSwiper.swiper-container-horizontal>.swiper-scrollbar { height: 10px; bottom: 0; }

/* 下載按鈕 */
.pro_download_list { display: flex; flex-wrap: wrap; }
.pro_download_list .item { margin: 0 20px 30px 0; }
a.download_btn { display: block; text-align: center; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; font-size: 1.25em; color: #fff; text-transform: uppercase; }
a.download_btn::before { content: ''; width: 54px; height: 70px; background: url(../images/product/PDF_icon.png) no-repeat; display: inline-block; background-size: contain; }
a.download_btn:hover { opacity: .6; }
a.download_btn .title { padding: 10px 0; }

@media screen and (max-width: 639px) {
	.pro_top_info .model { font-size: 1.5em; }
	.configuration_list .title { font-size: min(max(1.25rem, 4.5vw), 2.5rem); }
	.hardware_list .item { width: 120px; }
	.pro_info_bottom .hardware_list .item { width: 90px; }
	.hardware_list .item_title a { font-size: 1.125em; }
	.hardware_list .item_title span { font-size: 1.125em; }
	.buy_btn { justify-content: center; }
	a.download_btn::before { width: 39px; height: 50px; }
	.pro_slider { width: calc(27% - 20px); }
	.buy_btn a { font-size: 2em; }
	.tab_cont .hardware_list ul { display: grid; grid-auto-columns: min-content; grid-auto-flow: column; grid-template-rows: repeat(2, auto); }
	.pro_tabs_group .tab_title .item { font-size: min(max(1.125rem, 2.5vw), 1.875rem); }
	.hardware_list ul { overflow-x: scroll; }
	.spec_group { overflow-x: scroll; }
	.logo_list ul li { width: 50%; }
	.logo_list .imgBox { height: 100px; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.pro_top_info .model { font-size: 1.75em; }
	.configuration_list .title { font-size: 1.625em; }
	.hardware_list .item { width: 130px; }
	.pro_info_bottom .hardware_list .item { width: 100px; }
	.hardware_list .item_title a { font-size: 1.25em; }
	.hardware_list .item_title span { font-size: 1.25em; }
	.hardware_list ul { overflow-x: scroll; }
	.spec_group { overflow-x: scroll; }
	.logo_list .imgBox { height: 150px; }
	.sas_table_box .dep img { width: 1024px; max-width: inherit; }
}
@media screen and (min-width: 1024px) {
	.pro_info_bottom { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
	.sas_table_box .dep img { width: 1280px; max-width: 100%; }
	.pro_download_list .item { margin-right: 30px; }
	.pro_info_bottom .hardware_list .item { margin-right: 30px; }
}

.configuration_list { overflow-x: auto; }
.configuration_list li { margin-bottom: 20px; }
.configuration_list .title { font-size: 1.875em; font-weight: 600; color: var(--main_color); padding-bottom: .4em; }
.configuration_list .imgBox { position: relative; cursor: pointer; }
.configuration_list .item { padding: 15px; box-sizing: border-box; height: 100%; }
.configuration_list .item.active, .configuration_list .item:hover { background-color: #eee; }
.configuration_list img { max-width: 100%; }

/* config_popup_box */
.config_popup_box {
	opacity:0; visibility:hidden; -webkit-transition:opacity 0.3s, visibility 0.3s; transition:opacity 0.3s, visibility 0.3s; position:fixed; top:0; left:0; width: 100%; height: 100vh;
}
.config_popup_box.show { opacity:1; visibility:visible; z-index:9991; }
.config_popup_box a:hover { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.config_popup_box .overlay { background-color: rgba(0,0,0,.7); position:fixed; left: 0; top: 0; z-index: 0; width: 100vw; height: 100%; }
.config_popup_box .popup_body { position: relative; z-index: 5; box-sizing: border-box; background-color:#fff; line-height:1.5em;  padding:60px 20px 20px; height: 100%; }
.config_popup_box .popup_body a { text-decoration: none; }
.config_popup_box .close { position: absolute; z-index: 5; }
.config_popup_box .close a { position: absolute; display:block; text-decoration:none; font-size: 0; width: 40px; height: 40px; z-index: 9990; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.config_popup_box .close a:before, .config_popup_box .close a:after { display:block; content:''; position:absolute; top:0; left:50%; width:2px; height:100%; background-color:var(--main_color); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.config_popup_box .close a:hover:before, .config_popup_box .close a:hover:after { background-color:#fff; }
.config_popup_box .close a:before { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); }
.config_popup_box .close a:after { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); }

@media screen and (max-width: 639px) {
	.config_popup_box .close { width: 40px; height: 40px; right: 10px; top: 10px; }
	.config_popup_box .close a:hover::before, .config_popup_box .close a:hover::after { background-color: var(--bg_color); }
	.configuration_list { height: calc(100vh - 80px); }
	.configuration_list ul { display: flex; flex-wrap: wrap; }
	.configuration_list ul li { width: 46%; margin-right: 4%; margin-bottom: 4%; }
	.configuration_list ul li:nth-child(even) { margin-right: 0; }
	.configuration_list .title { font-size: 1.5em; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.config_popup_box .close { width: 40px; height: 40px; right: 10px; top: 10px; }
	.config_popup_box .close a:hover::before, .config_popup_box .close a:hover::after { background-color: var(--bg_color); }
	.configuration_list { height: calc(100vh - 80px); }
	.configuration_list ul { display: flex; flex-wrap: wrap; }
	.configuration_list ul li { width: 46%; margin-right: 4%; margin-bottom: 4%; }
	.configuration_list ul li:nth-child(even) { margin-right: 0; }
}
@media screen and (min-width: 1024px) {
	.configuration_list { height: calc(100vh - 60px); }
	.config_popup_box .popup_body { position: absolute; right: 6.25vw; top: 0; width: 28vw; min-width:400px; padding:30px 25px; }
	.config_popup_box .close { width: 6.25vw; height: 100vh; right: 0; top: 0; }
	.config_popup_box .close a { right: 50%; top: 50%; margin-top: -20px; margin-right: -20px; }
}

/* 卷軸區域 */ /* tinyscrollbar */
#scrollbarBox { clear:both; }
#scrollbarBox .viewport { overflow:hidden; position:relative; margin: 0; }
#scrollbarBox .overview { list-style:none; padding:0; margin:0; left:0; top:0; }
#scrollbarBox .scrollbar { position:relative; margin:15px 0; clear:both; height:4px; }
#scrollbarBox .track { background-color:#d6d6d7; height:5px; width:100%; margin: 0; position:relative; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#scrollbarBox .thumb { background-color:#212121; height:6px; cursor:pointer; overflow:hidden; position:absolute; top:-2px; left:0; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#scrollbarBox:hover .thumb { background-color:var(--main_color); }
#scrollbarBox .thumb .end { overflow:hidden; height:8px; width:5px; margin: 0; }
#scrollbarBox .disable { display:none; }

.editable_content #scrollbarBox1 * { margin: 0; }
#scrollbarBox1 .viewport { overflow:hidden; position:relative; margin: 0; }
#scrollbarBox1 .overview { list-style:none; padding:0; margin:0; left:0; top:0; }
#scrollbarBox1 .scrollbar { position:relative; margin:15px 0; clear:both; height:4px; }
#scrollbarBox1 .track { background-color:#d6d6d7; height:5px; width:100%; margin: 0; position:relative; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#scrollbarBox1 .thumb { background-color:#212121; height:6px; width: 8px; cursor:pointer; overflow:hidden; position:absolute; top:-2px; left:0; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#scrollbarBox1:hover .thumb { background-color:var(--main_color); }
#scrollbarBox1 .thumb .end { overflow:hidden; height:8px; width:5px; margin: 0; }
#scrollbarBox1 .disable { display:none; }

.tableWrap .viewport { overflow:hidden; position:relative; margin: 0; }
.tableWrap .overview { list-style:none; padding:0; margin:0; left:0; top:0; }
.tableWrap .scrollbar { position:relative; margin:15px 0; clear:both; height:4px; }
.tableWrap .track {	background-color:#dbdbdb; width:100%; height:2px; position:relative; margin: 0; }
.tableWrap .thumb {	background-color:#656565; height:6px; cursor:pointer; overflow:hidden; position:absolute; left:0; top:-2px; margin: 0;	border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}
.tableWrap:hover .thumb { background-color:#2b7fdd; }
.tableWrap .thumb .end { overflow:hidden; height:8px; width:5px; margin: 0; }
.tableWrap .disable { display:none; }
/* .noSelect { user-select:none; -o-user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; } */

/*----------------------------------------------------------------------*/
/* 產品內頁 - components */
.btn_bar { display: flex; justify-content: center; align-items: center; padding: 30px 0; }
.btn_bar .btn { cursor: pointer; border-radius: 10px; text-transform: uppercase; font-size: 1.5em; font-weight: 500; padding: 5px 20px; color: var(--main_color); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.btn_bar .btn.btn_switch { background-color: #4b575e; border: 3px solid var(--main_color); }
.btn_bar .btn.btn_switch:hover { background-color: var(--main_color); color: var(--bg_color); }
.btn_bar .btn.btn_close span { vertical-align: middle; }
.btn_bar .btn.btn_close::before { content: ''; display: inline-block; vertical-align: middle; background: url(../images/product/icon_close.svg); width: 20px; height: 20px; margin-right: 5px; }
.btn_bar .btn.btn_close:hover { background-color: #eeefef; }

.components_box { background-color: #fff; color: var(--bg_color); font-family: 'Gotham XNarrow','Gotham Condensed', 'sans-serif'; line-height: 1.25em; transform:scaleY(0); height:0; visibility:hidden; opacity:0; transition:opacity 0.3s ease; overflow:hidden; }
.components_box.show { transform:scaleY(1); height:auto; visibility:visible; opacity:1; }
.components_box h4 { margin: 4% 0 30px 0; color: var(--main_color); text-transform: uppercase; font-size: 1.5em; font-weight: 600; }

.components_list h5 { font-size: 1.25em; font-weight: 500; padding: 0 10px; }
.components_table { padding: 10px 0; }
.components_table table { width: 100%; }
.components_table caption { font-size: 1.25em; font-weight: 400; text-align: left; padding: 10px; }
.components_table th, .components_table td { padding: 7px 10px; width: 50%; }
.components_table th { background-color: #dcdddd; text-align: left; font-size: 1.125em; font-weight: 600; }
.components_table td { font-size: .875em; font-weight: 400; }
.components_table tr:nth-child(2n+2) td { background-color: #eeefef; }
.components_table td:first-child { font-weight: 500; }

@media screen and (max-width: 767px) {
	.components_list .item { padding-top: 30px; }
	.components_list .item:first-child { padding-top: 0; }
	.components_list h5 { padding: 0; }
}
@media screen and (min-width: 768px) {
	.components_list { display: flex; flex-wrap: wrap; }
	.components_list .item { width: 50%; box-sizing: border-box; padding: 0 10px; }
}