Files
sechskies/concert/concert.html
T
2026-06-03 16:08:53 +08:00

900 lines
57 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SECHSKIES Concert Archive</title>
<link rel="stylesheet" href="../assets/css/concert.css">
<link rel="stylesheet" href="../assets/css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<link rel="stylesheet" href="../assets/css/tablet.css">
<!-- 本頁:#stage-now=同一奶油區(全站 section 外殼);con-14 白卡疊在區內 -->
<style>
body.concert-page #stage-now {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 0 !important;
}
body.concert-page #stage-now>.con-1,
body.concert-page #stage-now>.con-2,
body.concert-page #stage-now>.con-3,
body.concert-page #stage-now>.con-4 {
width: 100%;
max-width: 100%;
box-sizing: border-box;
flex: 0 0 auto;
}
body.concert-page #stage-now>.con-4:last-child {
margin-bottom: 0;
}
body.concert-page .con-4.con-access-denied[data-tour="ACCESS"]::before {
z-index: 4;
}
body.concert-page .con-4[data-tour="ACCESS"]::after {
z-index: 5;
}
/* 巡迴搜尋:輸入列 + 結果列表(黑底區,白字) */
.concert-search-box {
width: 100%;
max-width: 920px;
padding: 0 20px;
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
}
.concert-search-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 10px;
width: 100%;
}
.concert-search-row .search-input {
flex: 1 1 200px;
width: auto;
max-width: 320px;
margin: 0;
}
.concert-search-row .search-input:focus {
width: auto;
max-width: 340px;
transform: translateY(-2px);
}
.concert-search-btn {
flex: 0 0 auto;
padding: 12px 22px;
border: 2px solid #ffcc00;
border-radius: 30px;
font-size: 1rem;
font-weight: 700;
background-color: #ffcc00;
color: #2f2f2f;
cursor: pointer;
outline: none;
transition: all 0.3s ease;
white-space: nowrap;
}
.concert-search-btn:hover {
border-color: #e6b800;
box-shadow: 0 4px 15px rgba(255, 204, 0, 0.25);
}
.concert-search-btn:focus {
box-shadow: 0 0 10px rgba(255, 204, 0, 0.35);
}
/* 說明區暫隱:要恢復顯示時取消以下註解,並取消 HTML 內說明區塊註解
.concert-search-panel {
width: 100%;
max-width: 720px;
background: #fff8df;
border: 1px solid #e9d99d;
border-radius: 16px;
padding: 18px 20px 16px;
box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);
}
.concert-search-guide-title {
margin: 0 0 14px;
text-align: center;
font-size: 0.95rem;
font-weight: 700;
letter-spacing: 0.12em;
color: #4a4a4a;
}
.concert-search-guide-list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 12px;
}
.concert-search-guide-item {
background: #fff;
border: 1px solid #eadfb2;
border-radius: 12px;
padding: 12px 14px;
}
.concert-search-guide-item .guide-label {
display: block;
margin: 0 0 6px;
text-align: center;
font-size: 0.88rem;
font-weight: 700;
color: #65510e;
}
.concert-search-guide-item .guide-desc {
margin: 0;
text-align: left;
font-size: 0.84rem;
line-height: 1.65;
color: #5a5a5a;
}
.concert-search-guide-item .guide-desc em {
font-style: normal;
color: #7f6712;
font-weight: 600;
}
.concert-search-guide-steps {
margin: 14px 0 0;
padding-top: 12px;
border-top: 1px dashed #e0d4a8;
text-align: center;
font-size: 0.82rem;
line-height: 1.6;
color: #6a6a6a;
}
.concert-search-result--in-panel {
margin: 14px 0 0;
padding-top: 14px;
border-top: 1px solid #eadfb2;
}
*/
.concert-search-result {
display: block;
width: 100%;
max-width: 720px;
}
.concert-search-summary {
margin: 0 0 10px;
text-align: center;
font-size: 0.92rem;
line-height: 1.65;
color: #fff;
}
.concert-search-hits {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 8px;
text-align: left;
}
.concert-search-hits li {
padding: 10px 12px 10px 14px;
background: rgba(255, 255, 255, 0.06);
border: none;
border-left: 3px solid rgba(255, 204, 0, 0.55);
border-radius: 0 10px 10px 0;
font-size: 0.88rem;
line-height: 1.5;
}
.concert-search-hits li.concert-search-hit-jump {
cursor: pointer;
transition: background 0.2s ease, border-color 0.2s ease;
}
.concert-search-hits li.concert-search-hit-jump:hover,
.concert-search-hits li.concert-search-hit-jump:focus-visible,
.concert-search-hits li.concert-search-hit-jump.is-active {
background: rgba(255, 204, 0, 0.12);
border-left-color: #ffcc00;
outline: none;
}
.concert-search-hits .hit-track {
display: block;
font-weight: 700;
color: #ffdd00;
}
.concert-search-hits .hit-meta {
display: block;
margin-top: 4px;
color: rgba(255, 255, 255, 0.72);
font-size: 0.8rem;
line-height: 1.5;
}
.concert-search-hits .hit-more {
text-align: center;
border-left-style: dashed;
color: rgba(255, 255, 255, 0.75);
cursor: default;
}
.track-item.is-search-hit .track {
color: #c9a100;
font-weight: 700;
}
</style>
</head>
<body class="concert-page">
<!-- HTML 結構 -->
<header class="inner-page-header">
<div class="header-inner site-header-inner">
<h1 class="main-title">巡迴演唱會列表</h1>
<div class="subtitle-wrap">
<span class="sub-title">SECHSKIES CONCERT ARCHIVE</span>
</div>
</div>
</header>
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
<canvas id="particles"></canvas>
<div class="search-section">
<div class="concert-search-box">
<div class="concert-search-row">
<input type="text" class="search-input" id="concert-query" value="" placeholder="搜尋曲目或場次">
<input type="text" class="search-input" id="concert-member" value=""
placeholder="成員或 ENCORESolo…(可空白)">
<button type="button" class="concert-search-btn" id="concert-search-btn">查詢</button>
</div>
<!-- 說明區暫隱:恢復時取消註解,並把 #concert-search-result 移入 .concert-search-panel 內
<div class="concert-search-panel">
<section class="concert-search-guide" id="concert-search-hint" aria-label="搜尋說明">
<h2 class="concert-search-guide-title">怎麼搜尋</h2>
<ul class="concert-search-guide-list">
<li class="concert-search-guide-item">
<span class="guide-label">曲目或場次</span>
<p class="guide-desc">比對曲名、巡演名或場地。例:<em>COUPLE</em>、<em>釜山</em>、<em>YELLOW NOTE</em></p>
</li>
<li class="concert-search-guide-item">
<span class="guide-label">成員或段落</span>
<p class="guide-desc">可留白。要縮小範圍可填成員名,或歌單標記(安可、小分隊、Solo)。例:<em>殷志源</em>、<em>ENCORE</em>、<em>BLACKKIES</em></p>
</li>
</ul>
<p class="concert-search-guide-steps"><strong>①</strong> 查詢或 Enter 顯示結果列表 <strong>②</strong> 點列表某一列,跳到下方該場次與曲目(兩格都有填時須同時符合)</p>
</section>
</div>
-->
<div id="concert-search-result" class="concert-search-result" aria-live="polite"></div>
</div>
</div>
<div class="concert-container">
<!-- 永恆的重逢:2016 首場回歸演唱會 → 二十週年巡演 -->
<section id="stage-now" aria-label="永恆的重逢">
<div class="con-1" data-tour=" YELLOW NOTE">
<span class="title">2016&nbsp;&nbsp;|&nbsp;&nbsp;YELLOW NOTE&nbsp;&nbsp;首場回歸演唱會</span>
<img src="../assets/images/concert/2016.jpg" alt="">
<div class="con-yk-1 attended" data-date1="09.10">
<span class="location">首爾 | 首爾奧林匹克體操競技場</span>
<input type="checkbox" id="expand-yk-1" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">COM' BACK</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">폼생폼사 / 品生品死</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">배신감(BAD GIRL/ 背叛感</span></div>
<div class="track-item"><span class="track">사랑하는 너에게(DEAR LOVE)/ 給親愛的你</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">너를 보내며(LET U GO)/ 送你離開</span></div>
<div class="track-item"><span class="track">8t. TRUCK 殷志源</span></div>
<div class="track-item"><span class="track">DOUBLE J 李宰鎮</span></div>
<div class="track-item"><span class="track">A+ 金在德</span></div>
<div class="track-item"><span class="track">그대로 멈춰 / 就那樣停止- BLACKKIES(殷志源、李宰鎮、金在德)</span></div>
<div class="track-item"><span class="track">SAY WHITEKIES(姜成勳、張水院)</span></div>
<div class="track-item"><span class="track">SUDDENLY 張水院</span></div>
<div class="track-item"><span class="track">MY GIRL 姜成勳</span></div>
<div class="track-item"><span class="track">무모한 사랑(RECKLESS LOVE/ 不可能的愛</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">ENCORE:학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">기사도 / 騎士道</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
<div class="track-item"><span class="track">DOUBLE ENCORE:(2016年9月11日)</span></div>
<div class="track-item"><span class="track">사랑하는 너에게(DEAR LOVE)/ 給親愛的你</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
</div>
<label for="expand-yk-1" class="expand-btn"></label>
</div>
<div class="con-yk-2">
<span class="location">大邱 | 大邱會展中心</span>
<input type="checkbox" id="expand-yk-2" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">COM' BACK</span></div>
<div class="track-item"><span class="track">학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">배신감(BAD GIRL/ 背叛感</span></div>
<div class="track-item"><span class="track">사랑하는 너에게(DEAR LOVE)/ 給親愛的你</span></div>
<div class="track-item"><span class="track">너를 보내며(LET U GO)/ 送你離開</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">어기야 디야(한배를 타고)+ 8t. TRUCK - 殷志源</span></div>
<div class="track-item"><span class="track">RIGOLETTO 李宰鎮</span></div>
<div class="track-item"><span class="track">A+ 金在德</span></div>
<div class="track-item"><span class="track">그대로 멈춰 / 就那樣停止- BLACKKIES(殷志源、李宰鎮、</span></div>
<div class="track-item"><span class="track">金在德)</span></div>
<div class="track-item"><span class="track">프라프치노(FRAPPUCCINO)- 張水院</span></div>
<div class="track-item"><span class="track">어떻게 사랑이 그래요 / 愛情怎麼可以這樣 + 샤방샤방 / 閃亮閃亮 - 姜成勳</span>
</div>
<div class="track-item"><span class="track">하얀 밤에(CLOSE YOUR EYES/ 白色夜裏</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">폼생폼사 / 品生品死</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">기사도 / 騎士道</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
</div>
<label for="expand-yk-2" class="expand-btn"></label>
</div>
<div class="con-yk-3 attended" data-date1="12.23" data-date2="12.24">
<span class="location">釜山 | 釜山會展中心</span>
<input type="checkbox" id="expand-yk-3" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">COM' BACK</span></div>
<div class="track-item"><span class="track">학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">배신감(BAD GIRL/ 背叛感</span></div>
<div class="track-item"><span class="track">사랑하는 너에게(DEAR LOVE)/ 給親愛的你</span></div>
<div class="track-item"><span class="track">너를 보내며(LET U GO)/ 送你離開</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">어기야 디야(한배를 타고)+ 8t. TRUCK - 殷志源</span></div>
<div class="track-item"><span class="track">RIGOLETTO 李宰鎮</span></div>
<div class="track-item"><span class="track">A+ 金在德</span></div>
<div class="track-item"><span class="track">그대로 멈춰 / 就那樣停止- BLACKKIES(殷志源、李宰鎮、</span></div>
<div class="track-item"><span class="track"> 金在德)</span></div>
<div class="track-item"><span class="track">프라프치노(FRAPPUCCINO)- 張水院</span></div>
<div class="track-item"><span class="track">어떻게 사랑이 그래요 / 愛情怎麼可以這樣 + 샤방샤방 / 閃亮閃亮 - 姜成勳</span>
</div>
<div class="track-item"><span class="track">하얀 밤에(CLOSE YOUR EYES/ 白色夜裏</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">폼생폼사 / 品生品死</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">기사도 / 騎士道</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
</div>
<label for="expand-yk-3" class="expand-btn"></label>
</div>
<div class="con-yk-4">
<span class="location">首爾 | 蠶室室內體育館</span>
<input type="checkbox" id="expand-yk-4" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">COM' BACK</span></div>
<div class="track-item"><span class="track">배신감(BAD GIRL/ 背叛感</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">사랑하는 너에게(DEAR LOVE)/ 給親愛的你</span></div>
<div class="track-item"><span class="track">너를 보내며(LET U GO)/ 送你離開</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">문득(MEMORY)+ 트라우마(TRAUMA)- 殷志源</span></div>
<div class="track-item"><span class="track">RIGOLETTO 李宰鎮</span></div>
<div class="track-item"><span class="track">SAY + MY LOVE 姜成勳</span></div>
<div class="track-item"><span class="track">프라프치노(FRAPPUCCINO+ 여우비(UNFORGETTABLE)-
J-Walk</span></div>
<div class="track-item"><span class="track">하얀 밤에(CLOSE YOUR EYES/ 白色夜裏</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">ENCORE:그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
<div class="track-item"><span class="track">DOUBLE ENCORE</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
</div>
<label for="expand-yk-4" class="expand-btn"></label>
</div>
</div>
<!-- <div class="con-2" data-tour="20TH ANNIV.">
<span class="title">2017-2018&nbsp;&nbsp;|&nbsp;&nbsp;20TH ANNIVERSARY</span>
<img src="../assets/images/concert/2017.jpg" alt="">
<div class="con-2-1">
<span class="location">首爾:高尺天空巨蛋</span>
<input type="checkbox" id="expand-con-2-1" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">약속된 운명(아마게돈) / 約定的命運</span></div>
<div class="track-item"><span class="track">학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">폼생폼사 / 品生品死</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">탈출 / 逃離</span></div>
<div class="track-item"><span class="track">기사도 / 騎士道</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">SAY</span></div>
<div class="track-item"><span class="track">너를 보내며(LET U GO/ 送你離開</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">공허해 / 空虛 + REALLY REALLY WINNER</span></div>
<div class="track-item"><span class="track">COM' BACK</span></div>
<div class="track-item"><span class="track">뫼비우스의 띠 / 麥比烏斯帶</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">현기증(VERTIGO</span></div>
<div class="track-item"><span class="track">웃어줘(SMILE</span></div>
<div class="track-item"><span class="track">오랜만이에요(IT'S BEEN A WHILE</span></div>
<div class="track-item"><span class="track">아프지마요(BE WELL</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
<div class="track-item"><span class="track">슬픈 노래(SAD SONG/ 悲歌</span></div>
<div class="track-item"><span class="track">ENCORE</span></div>
<div class="track-item"><span class="track">特別해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">백허그(BACK HUG</span></div>
<div class="track-item"><span class="track">술끊자(DRINKING PROBLEM</span></div>
</div>
<label for="expand-con-2-1" class="expand-btn"></label>
</div>
<div class="con-2-2">
<span class="location">光州 | 光州女大世大運體育館</span>
<input type="checkbox" id="expand-con-2-2" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">오랜만이에요(IT'S BEEN A WHILE</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">웃어줘(SMILE</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">SAY</span></div>
<div class="track-item"><span class="track">네가 필요해(NEED U</span></div>
<div class="track-item"><span class="track">백허그(BACK HUG</span></div>
<div class="track-item"><span class="track">술끊자(DRINKING PROBLEM</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">고백(Go Back)- 李宰鎮</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">현기증(VERTIGO</span></div>
<div class="track-item"><span class="track">DANCE MEDLEY</span></div>
<div class="track-item"><span class="track">COM' BACK + 폼생폼사 / 品生品死 + ROAD FIGHTER +</span>
</div>
<div class="track-item"><span class="track">기사도 / 騎士道 + 학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">아프지마요(BE WELL</span></div>
<div class="track-item"><span class="track">슬픈 노래(SAD SONG/ 悲歌</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">ENCORE:그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
</div>
<label for="expand-con-2-2" class="expand-btn"></label>
</div>
<div class="con-2-3">
<span class="location">高陽 | 韓國國際展覽中心</span>
<input type="checkbox" id="expand-con-2-3" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">오랜만이에요(IT'S BEEN A WHILE</span></div>
<div class="track-item"><span class="track">약속된 운명(아마게돈) / 約定的命運</span></div>
<div class="track-item"><span class="track">DANCE MEDLEYCOM' BACK + 폼생폼사 + ROAD FIGHTER+기사도 /
騎士道 +
학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">웃어줘(SMILE</span></div>
<div class="track-item"><span class="track">겨울이야기 / 冬天的故事 + White Love 姜成勳(12月23日)</span>
</div>
<div class="track-item"><span class="track">Beautiful 張水院(12月24日)</span></div>
<div class="track-item"><span class="track">악마의 연기 / 惡魔的煙氣 - 殷志源(12月30日)</span></div>
<div class="track-item"><span class="track">네가 필요해(NEED U</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">슬픈 노래(SAD SONG/ 悲歌</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">현기증(VERTIGO</span></div>
<div class="track-item"><span class="track">아프지마요(BE WELL</span></div>
<div class="track-item"><span class="track">사랑하는 너에게 DEAR LOVE/ 給親愛的你</span></div>
<div class="track-item"><span class="track">백허그(BACK HUG</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">술끊자(DRINKING PROBLEM</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
<div class="track-item"><span class="track">ENCORE:세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
</div>
<label for="expand-con-2-3" class="expand-btn"></label>
</div>
<div class="con-2-4">
<span class="location">釜山 | 釜山會展中心</span>
<input type="checkbox" id="expand-con-2-4" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">오랜만이에요(IT'S BEEN A WHILE</span></div>
<div class="track-item"><span class="track">약속된 운명(아마게돈) / 約定的命運</span></div>
<div class="track-item"><span class="track">DANCE MEDLEYCOM' BACK + 폼생폼사 + ROAD FIGHTER+기사도 /
騎士道 +
학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">웃어줘(SMILE</span></div>
<div class="track-item"><span class="track">겨울이야기 / 冬天的故事 + White Love 姜成勳(12月23日)</span>
</div>
<div class="track-item"><span class="track">Beautiful 張水院(12月24日)</span></div>
<div class="track-item"><span class="track">악마의 연기 / 惡魔的煙氣 - 殷志源(12月30日)</span></div>
<div class="track-item"><span class="track">네가 필요해(NEED U</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">슬픈 노래(SAD SONG/ 悲歌</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">현기증(VERTIGO</span></div>
<div class="track-item"><span class="track">아프지마요(BE WELL</span></div>
<div class="track-item"><span class="track">사랑하는 너에게 DEAR LOVE/ 給親愛的你</span></div>
<div class="track-item"><span class="track">백허그(BACK HUG</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">술끊자(DRINKING PROBLEM</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
<div class="track-item"><span class="track">ENCORE:특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">DANCE MEDLEY</span></div>
<div class="track-item"><span class="track">COM' BACK + 폼생폼사 / 品生品死 + ROAD FIGHTER +</span>
</div>
<div class="track-item"><span class="track">기사도 / 騎士道 + 학원별곡(RISE UP/ 學園別曲</span></div>
</div>
<label for="expand-con-2-4" class="expand-btn"></label>
</div>
<div class="con-2-5">
<span class="location">大邱 | 大邱會展中心</span>
<input type="checkbox" id="expand-con-2-5" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">오랜만이에요(IT'S BEEN A WHILE</span></div>
<div class="track-item"><span class="track">약속된 운명(아마게돈) / 約定的命運</span></div>
<div class="track-item"><span class="track">DANCE MEDLEY</span></div>
<div class="track-item"><span class="track">COM' BACK + 폼생폼사 / 品生品死 + ROAD FIGHTER +</span>
</div>
<div class="track-item"><span class="track">기사도 / 騎士道 + 학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">연정(HEARTBREAK/ 戀情</span></div>
<div class="track-item"><span class="track">기억해줄래 / 請記得好嗎</span></div>
<div class="track-item"><span class="track">웃어줘(SMILE</span></div>
<div class="track-item"><span class="track">겨울이야기 / 冬天的故事 + White Love 姜成勳</span></div>
<div class="track-item"><span class="track">RIGOLETTO 李宰鎮</span></div>
<div class="track-item"><span class="track">Beautiful 張水院</span></div>
<div class="track-item"><span class="track">악마의 연기 / 惡魔的煙氣 殷志源</span></div>
<div class="track-item"><span class="track">Solo舞蹈:Forbes 金在德</span></div>
<div class="track-item"><span class="track">네가 필요해(NEED U</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">COME TO ME BABY</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">슬픈 노래(SAD SONG/ 悲歌</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">현기증(VERTIGO</span></div>
<div class="track-item"><span class="track">아프지마요(BE WELL</span></div>
<div class="track-item"><span class="track">ENCORE</span></div>
<div class="track-item"><span class="track">사랑하는 너에게 DEAR LOVE/ 給親愛的你</span></div>
<div class="track-item"><span class="track">백허그(BACK HUG</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">술끊자(DRINKING PROBLEM</span></div>
<div class="track-item"><span class="track">DOUBLE ENCORE</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">무모한 사랑(RECKLESS LOVE/ 不可能的愛</span></div>
<div class="track-item"><span class="track">기사도 / 騎士道</span></div>
<div class="track-item"><span class="track">DANCE MEDLEYCOM' BACK + 폼생폼사 / 品生品死 + ROAD FIGHTER
+기사도
/ 騎士道 + 학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天</span></div>
</div>
<label for="expand-con-2-5" class="expand-btn"></label>
</div>
</div> -->
<!-- 演唱會 03 -->
<div class="con-3" data-tour="NOW・HERE・AGAIN.">
<span class="title">2018&nbsp;&nbsp;|&nbsp;&nbsp;NOW・HERE・AGAIN</span>
<img src="../assets/images/concert/2018.jpg" alt="">
<div class="con-3-1 attended" data-date1="10.13" data-date2="10.14">
<span class="location">首爾:首爾奧林匹克體操競技場</span>
<input type="checkbox" id="expand-con-3-1" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">약속된 운명(아마게돈) / 約定的命運</span></div>
<div class="track-item"><span class="track">FLYING LOVE(천상비애)/ 天上飛愛</span></div>
<div class="track-item"><span class="track">무모한 사랑(RECKLESS LOVE/ 不可能的愛</span></div>
<div class="track-item"><span class="track">COM' BACK</span></div>
<div class="track-item"><span class="track">학원별곡(RISE UP/ 學園別曲</span></div>
<div class="track-item"><span class="track">ROAD FIGHTER</span></div>
<div class="track-item"><span class="track">LAST</span></div>
<div class="track-item"><span class="track">세 단어(THREE WORDS/ 三個詞</span></div>
<div class="track-item"><span class="track">少女 張水院</span></div>
<div class="track-item"><span class="track">Now 殷志源</span></div>
<div class="track-item"><span class="track">Egoist 李宰鎮</span></div>
<div class="track-item"><span class="track">Solo舞蹈:We Still In This Bitch 金在德</span></div>
<div class="track-item"><span class="track">오랜만이에요(IT'S BEEN A WHILE</span></div>
<div class="track-item"><span class="track">네겐 보일수 없었던 세상 / 不能讓你看到的世界</span></div>
<div class="track-item"><span class="track">슬픈 노래(SAD SONG/ 悲歌</span></div>
<div class="track-item"><span class="track">특별해(SOMETHING SPECIAL</span></div>
<div class="track-item"><span class="track">느낌이 와(FEELING</span></div>
<div class="track-item"><span class="track">현기증(VERTIGO</span></div>
<div class="track-item"><span class="track">아프지마요(BE WELL</span></div>
<div class="track-item"><span class="track">ENCORE</span></div>
<div class="track-item"><span class="track">예감(GOT A FEELING/ 預感</span></div>
<div class="track-item"><span class="track">그대로 멈춰 / 就那樣停止</span></div>
<div class="track-item"><span class="track">커플(COUPLE/ 戀人</span></div>
<div class="track-item"><span class="track">사랑하는 너에게 (DEAR LOVE)/ 給親愛的你(10月14日)</span></div>
<div class="track-item"><span class="track">그날까지(TOGETHER FOREVER/ 直到那一天(10月14日)</span></div>
</div>
<label for="expand-con-3-1" class="expand-btn"></label>
</div>
</div>
<!-- 演唱會 04:與 con-2con-3 同結構 — title → img → con-4-1ACCESS 樣式用 con-access-deniedCANCELED 水印為 ::before::after 保留給 data-tour 緞帶) -->
<div class="con-4 con-access-denied" data-tour="ACCESS">
<span class="title">2020&nbsp;&nbsp;|&nbsp;&nbsp;CONCERT [ACCESS]</span>
<img src="../assets/images/concert/2020.jpg" alt="">
<div class="con-4-1 canceled" data-date1="03.06" data-date2="03.08">
<span class="location">首爾:慶熙大學 平和殿堂</span>
<div class="track-list access-denied-message">
<div class="track-item denied-text">
<span>系統錯誤:無法建立連結 (Connection Failed)</span>
</div>
<div class="track-item denied-text">
<span>原因:COVID-19 疫情擴散致演場會取消</span>
</div>
<div class="track-item denied-text">
<span>STATUS: 403 FORBIDDEN - ACCESS DENIED</span>
</div>
</div>
</div>
</div>
</section>
<!-- 燦爛的最初(九十年代)/錨點 #stage-past -->
<section id="stage-past" aria-label="燦爛的最初">
<div class="con-1" data-tour="CLASSIC LIVE">
<span class="title">九十年代經典巡迴</span>
<div class="stage-past-era">
<span class="tour-era-heading">1997&nbsp;|&nbsp;Sechky的Christmas</span>
<div class="con-1-1">
<span class="location">1997.12.21 | 首爾 | 韓國 | 世宗文化會館</span>
<input type="checkbox" id="expand-con-1-1" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-1" class="expand-btn"></label>
</div>
</div>
<div class="stage-past-era">
<span class="tour-era-heading">1998&nbsp;|&nbsp;Encore Concert</span>
<div class="con-1-2">
<span class="location">1998.02.22 | 首爾 | 韓國 | 首爾奧林匹克體操競技場</span>
<input type="checkbox" id="expand-con-1-2" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-2" class="expand-btn"></label>
</div>
</div>
<div class="stage-past-era">
<span class="tour-era-heading">1998&nbsp;|&nbsp;全國巡迴演唱會</span>
<p class="tour-era-meta">1998年2月28日 — 4月5日・韓國・共 6 場</p>
<div class="con-1-3">
<span class="location">1998.02.28 | 釜山 | 韓國 | 釜山 KBS Hall</span>
<input type="checkbox" id="expand-con-1-3" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-3" class="expand-btn"></label>
</div>
<div class="con-1-4">
<span class="location">1998.03.08 | 蔚山 | 韓國 | 蔚山 KBS Hall</span>
<input type="checkbox" id="expand-con-1-4" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-4" class="expand-btn"></label>
</div>
<div class="con-1-5">
<span class="location">1998.03.14 | 光州 | 韓國 | 光州廣域市綜合體育館</span>
<input type="checkbox" id="expand-con-1-5" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-5" class="expand-btn"></label>
</div>
<div class="con-1-6">
<span class="location">1998.03.22 | 富川 | 韓國 | 富川室內體育館</span>
<input type="checkbox" id="expand-con-1-6" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-6" class="expand-btn"></label>
</div>
<div class="con-1-7">
<span class="location">1998.03.28 | 大邱 | 韓國 | E·WORLD</span>
<input type="checkbox" id="expand-con-1-7" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-7" class="expand-btn"></label>
</div>
<div class="con-1-8">
<span class="location">1998.04.05 | 大田 | 韓國 | CMB Expo Art Hall</span>
<input type="checkbox" id="expand-con-1-8" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-8" class="expand-btn"></label>
</div>
</div>
<div class="stage-past-era">
<span class="tour-era-heading">1998&nbsp;|&nbsp;Sechky的Christmas Concert</span>
<div class="con-1-9">
<span class="location">1998.12.24 | 釜山 | 韓國 | 社稷棒球場</span>
<input type="checkbox" id="expand-con-1-9" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-9" class="expand-btn"></label>
</div>
</div>
<div class="stage-past-era">
<span class="tour-era-heading">1999&nbsp;|&nbsp;Sechskies Live Concert</span>
<p class="tour-era-meta">1999年2月6日 — 2月27日・韓國・共 6 場</p>
<div class="con-1-10">
<span class="location">1999.02.06 · 場次 1 | 蔚山 | 韓國 | 蔚山 KBS Hall</span>
<input type="checkbox" id="expand-con-1-10" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-10" class="expand-btn"></label>
</div>
<div class="con-1-11">
<span class="location">1999.02.06 · 場次 2 | 蔚山 | 韓國 | 蔚山 KBS Hall</span>
<input type="checkbox" id="expand-con-1-11" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理(同日第二場/詳記待考)</span></div>
</div>
<label for="expand-con-1-11" class="expand-btn"></label>
</div>
<div class="con-1-12">
<span class="location">1999.02.21 | 大邱 | 韓國 | 慶北大學</span>
<input type="checkbox" id="expand-con-1-12" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-12" class="expand-btn"></label>
</div>
<div class="con-1-13">
<span class="location">1999.02.25 | 首爾 | 韓國 | KBS88 體育館</span>
<input type="checkbox" id="expand-con-1-13" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-13" class="expand-btn"></label>
</div>
<div class="con-1-14">
<span class="location">1999.02.26 | 首爾 | 韓國 | KBS88 體育館</span>
<input type="checkbox" id="expand-con-1-14" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-14" class="expand-btn"></label>
</div>
<div class="con-1-15">
<span class="location">1999.02.27 | 首爾 | 韓國 | KBS88 體育館</span>
<input type="checkbox" id="expand-con-1-15" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-15" class="expand-btn"></label>
</div>
</div>
<div class="stage-past-era">
<span class="tour-era-heading">2000&nbsp;|&nbsp;SECHSKIES 2000 LIVE CONCERT</span>
<div class="con-1-16">
<span class="location">2000.02.28 | 首爾 | 韓國 | 首爾奧林匹克體操競技場</span>
<input type="checkbox" id="expand-con-1-16" class="expand-trigger">
<div class="track-list">
<div class="track-item"><span class="track">演出曲順待整理</span></div>
</div>
<label for="expand-con-1-16" class="expand-btn"></label>
</div>
</div>
</div>
</section>
</div>
<footer>
<p>SECHSKIES Fanpage &copy; 2026 - 黃色氣球永遠飄揚</p>
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
Design by <span class="mark_b">Jekkinoopy Studio</span>
</a>
</footer>
<!-- <link rel="stylesheet" href="search.css"> -->
<script src="search.js"></script>
<script>
const canvas = document.getElementById('particles');
const ctx = canvas.getContext('2d');
function resizeCanvas() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
}
resizeCanvas();
let particles = [];
class Particle {
constructor() {
this.x = Math.random() * canvas.width;
this.y = Math.random() * canvas.height;
this.size = Math.random() * 4 + 1;
this.speedX = Math.random() * 0.5 - 0.25;
this.speedY = Math.random() * 0.5 + 0.2;
}
update() {
this.x += this.speedX;
this.y += this.speedY;
if (this.y > canvas.height) this.y = 0;
}
draw() {
ctx.fillStyle = '#FFDD00';
ctx.globalAlpha = 0.6;
ctx.beginPath();
ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
ctx.fill();
}
}
function init() {
particles = [];
for (let i = 0; i < 80; i++) particles.push(new Particle());
}
function animate() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
for (const p of particles) {
p.update();
p.draw();
}
requestAnimationFrame(animate);
}
window.addEventListener('resize', () => {
resizeCanvas();
init();
});
init();
animate();
</script>
<script src="../assets/js/portal-nav.js"></script>
</body>
</html>