@charset "utf-8";
/* 基本定義 */
*{-webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased; margin:0; padding:0; }
pre{white-space: pre-wrap;}
img{border:0;}
a, a:link, a:visited, a:active, a:hover, area {text-decoration: none; cursor:pointer; display: inline-block;}
table { width:auto; border-collapse: collapse; border-spacing: 0; }
.clear{ clear:both;}
:focus {outline: 0;}

/* 反白顏色(FF需另外定義'::-moz-selection') */
::selection {background:rgba(0,0,0,.4); color:#FFF;}
::-moz-selection {background:rgba(0,0,0,.4); color:#FFF;}

/* 單行文字超出範圍出現... */
.sampleOverflow{white-space: nowrap; overflow: hidden; text-overflow : ellipsis;}
.sampleOverflowMultiLine{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:2; overflow: hidden; text-overflow: ellipsis;}

/* scrollbar隱藏 */
.sampleHiddenScroll{height: 300px; overflow: -moz-scrollbars-none; overflow-y: auto; overflow-x:none;}
.sampleHiddenScroll::-webkit-scrollbar { width: 0 !important; height: 0 !important; }

/* 預設輸入文字，placeholder需要個別設定樣式否則無效 */
::placeholder{ color: #B4B4B4; }
::-webkit-input-placeholder { color: #B4B4B4;}
:-moz-placeholder { color: #B4B4B4;}
:-ms-input-placeholder { color: #B4B4B4;}

/* 陰影 box-shadow: x y blur spread color inset */
.sample-boxshadow{ box-shadow: 2px 2px 2px rgba(0,0,0,.4); }
/* drop-shadow 可以反應出偽元素的形狀 */
.sample-dropshadow {
/*    -webkit-filter: drop-shadow(6px 6px 7px rgba(0, 0, 0, 0.7));*/
    filter: drop-shadow(6px 6px 4px rgba(0, 0, 0, 0.4));
}

/* 背景透明模糊 */
.sampleBGopacity { background-color: rgba(255,255,255,.7); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);}

/* 文字遮罩 */
.sampleTextMask{ font-weight: 900; background-image: var(--gradient01); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-box-decoration-break: clone;}
/* 漸層 http://www.colorzilla.com/gradient-editor/ */