/*
 * uigg 2.5 (build 20230225)
 * Project: https://ui.gg
 * Author: https://www.mixice.com
 * Github: https://github.com/mixice/uigg
 * license: MIT
 */

/* import */
@import url('ico/ico.css');

/* basic */
html,body,div,span,object,iframe,frame,
h1,h2,h3,h4,h5,h6,blockquote,pre,
abbr,address,cite,code,tt,hr,
del,dfn,em,img,ins,kbd,samp,
big,small,strong,sub,sup,var,
b,i,a,s,u,x,o,z,d,h,m,y,q,p,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,nav,section,summary,
button,input,select,textarea,optgroup,
time,mark,audio,video,marquee,
menu,menu-cont,menu-group,menu-list,
name,name-logo,name-search,
tab,tab-list,tab-cont,tab-group,
drop,drop-cont,drop-list,
chat,chat-title,chat-sider,chat-cont,chat-list,chat-message,chat-tool,chat-control,chat-tip,
pop,pop-main,pop-title,pop-cont,pop-solve,pop-choice,pop-sider,
hop,hop-cont,
fold,fold-group,fold-title,fold-cont,
countdown,tip,page,music,space,msie,rate,scaler,notify,empty,step,crumb,reminder,horn {margin: 0;padding: 0;border: 0;outline: 0;background: transparent center no-repeat;background-size: contain;box-sizing: border-box;font-family: uigg;border-color: var(--eee);border-style: solid;-webkit-tap-highlight-color: transparent;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary,
menu,menu-cont,menu-group,menu-list,
name,name-logo,name-search,
tab,tab-list,tab-cont,tab-group,
drop,drop-cont,drop-list,
chat,chat-title,chat-sider,chat-cont,chat-list,chat-message,chat-tool,chat-control,chat-tip,
pop,pop-main,pop-title,pop-cont,pop-solve,pop-choice,pop-sider,
hop,hop-cont,
fold,fold-group,fold-title,fold-cont,
countdown,tip,page,music,space,msie,rate,scaler,notify,empty,step,crumb,reminder,horn {display: block;}
.transition,.btn,a,button {transition-duration: .3s;}
html,body {height: 100%;}
html,body,.avatar,.upload-group,.swiper-slide,.parallax-bg {background-size: cover;}
html,body,input,select,textarea,button {font-size: 14px;}
html {-webkit-font-smoothing: antialiased;}
body,a {color: var(--333);}
a,a:hover,b,i,em,cite {text-decoration: none;font-style: normal;}
a,x,o,s,button,.btn,.smooth,.return,.mono-click,drop,fold-title {cursor: pointer;}
p {margin: 0;line-height: 180%;text-align: justify;}
ul,li {list-style: none;}
ul {overflow: hidden;}
hr {border-top-width: 1px;}
z {display: inline-block;}
u {flex: 1;}

::selection {background-color: var(--333);color: var(--ccc);text-shadow: none;}
::-webkit-scrollbar {background-color: transparent;width: 10px;}
::-webkit-scrollbar-thumb {background-color: var(--000-1);}

@media(max-width:640px){
	html,body,input,select,textarea,button {font-size: .2rem;}
	::-webkit-scrollbar {width: .03rem;}
    body::-webkit-scrollbar {width: 0;}
}

/* anime */
.anime {}
.anime-pulse,.anime-beat,.anime-rotate,
.anime-fade-in,.anime-fade-in-down,.anime-fade-in-left,.anime-fade-in-right,.anime-fade-in-up,
.anime-fade-out,.anime-fade-out-down,.anime-fade-out-left,.anime-fade-out-right,.anime-fade-out-up,
.anime-bounce-in,.anime-bounce-in-down,.anime-bounce-in-left,.anime-bounce-in-right,.anime-bounce-in-up,
.anime-bounce-out,.anime-bounce-out-down,.anime-bounce-out-left,.anime-bounce-out-right,.anime-bounce-out-up,
.anime-flip-in-x,.anime-flip-in-y,.anime-flip-out-x,.anime-flip-out-y,
.anime-zoom-in,.anime-zoom-out,.anime-zoom-in-enlarge,.anime-zoom-out-enlarge {animation-duration: .6s;animation-fill-mode: both;}
.anime-spasm {animation-duration: .3s;}
.anime-bounce-in,.anime-bounce-in-down,.anime-bounce-in-left,.anime-bounce-in-right,.anime-bounce-in-up {animation-timing-function: cubic-bezier(.215, .61, .355, 1);animation-duration: 1s;}
.anime-shrink-in,.anime-shrink-out,.anime-shrink-in-enlarge,.anime-shrink-out-enlarge {animation-duration: 2s;animation-fill-mode: both;}
.anime-flip-in-x,.anime-flip-in-y,.anime-flip-out-x,.anime-flip-out-y {backface-visibility: visible;}

.anime-pulse {animation-name: anime-pulse;}
.anime-beat {animation-name: anime-beat;}
.anime-spasm {animation-name: anime-spasm;}
.anime-rotate {animation-name: anime-rotate;animation-timing-function: linear;}
.anime-fade-in {animation-name: anime-fade-in;}
.anime-fade-in-down {animation-name: anime-fade-in-down;}
.anime-fade-in-left {animation-name: anime-fade-in-left;}
.anime-fade-in-right {animation-name: anime-fade-in-right;}
.anime-fade-in-up {animation-name: anime-fade-in-up;}
.anime-fade-out {animation-name: anime-fade-out;}
.anime-fade-out-down {animation-name: anime-fade-out-down;}
.anime-fade-out-left {animation-name: anime-fade-out-left;}
.anime-fade-out-right {animation-name: anime-fade-out-right;}
.anime-fade-out-up {animation-name: anime-fade-out-up;}
.anime-bounce-in {animation-name: anime-bounce-in;}
.anime-bounce-in-down {animation-name: anime-bounce-in-down;}
.anime-bounce-in-left {animation-name: anime-bounce-in-left;}
.anime-bounce-in-right {animation-name: anime-bounce-in-right;}
.anime-bounce-in-up {animation-name: anime-bounce-in-up;}
.anime-bounce-out {animation-name: anime-bounce-out;}
.anime-bounce-out-down {animation-name: anime-bounce-out-down;}
.anime-bounce-out-left {animation-name: anime-bounce-out-left;}
.anime-bounce-out-right {animation-name: anime-bounce-out-right;}
.anime-bounce-out-up {animation-name: anime-bounce-out-up;}
.anime-flip-in-x {animation-name: anime-flip-in-x;}
.anime-flip-in-y {animation-name: anime-flip-in-y;}
.anime-flip-out-x {animation-name: anime-flip-out-x;}
.anime-flip-out-y {animation-name: anime-flip-out-y;}
.anime-zoom-in {animation-name: anime-zoom-in;}
.anime-zoom-out {animation-name: anime-zoom-out;}
.anime-zoom-in-enlarge {animation-name: anime-zoom-in-enlarge;}
.anime-zoom-out-enlarge {animation-name: anime-zoom-out-enlarge;}
.anime-shrink-in {animation-name: anime-shrink-in;}
.anime-shrink-out {animation-name: anime-shrink-out;}
.anime-shrink-in-enlarge {animation-name: anime-shrink-in-enlarge;}
.anime-shrink-out-enlarge {animation-name: anime-shrink-out-enlarge;}

.infinite {animation-iteration-count: infinite;}
.alternate {animation-direction: alternate;}
.reverse {animation-direction: reverse;}

@keyframes anime-pulse {0% {transform: scale(1);}50% {transform: scale(1.05);}100% {transform: scale(1);}}
@keyframes anime-beat {0% {transform: translateY(0);}50% {transform: translateY(-50%);}100% {transform: translateY(0);}}
@keyframes anime-spasm {0% {transform: translate(0,0);}10% {transform: translate(5px,0);}20% {transform: translate(0,0);}30% {transform: translate(-5px,0);}40% {transform: translate(0,5px);}50% {transform: translate(0,0);}60% {transform: translate(0,-5px);}70% {transform: translate(0,0);}80% {transform: translate(5px,5px);}90% {transform: translate(0,0);}100% {transform: translate(-5px,-5px);}}
@keyframes anime-rotate {0% {transform: rotate(0);}100% {transform: rotate(360deg);}}
@keyframes anime-fade-in {0% {opacity: 0;}100% {opacity: 1;}}
@keyframes anime-fade-in-down {0% {opacity: 0;transform: translateY(-100%);}100% {opacity: 1;transform: translateY(0);}}
@keyframes anime-fade-in-left {0% {opacity: 0;transform: translateX(-100%);}100% {opacity: 1;transform: translateX(0);}}
@keyframes anime-fade-in-right {0% {opacity: 0;transform: translateX(100%);}100% {opacity: 1;transform: translateX(0);}}
@keyframes anime-fade-in-up {0% {opacity: 0;transform: translateY(100%);}100% {opacity: 1;transform: translateY(0);}}
@keyframes anime-fade-out {0% {opacity: 1;}100% {opacity: 0;}}
@keyframes anime-fade-out-down {0% {opacity: 1;}100% {opacity: 0;transform: translateY(100%);}}
@keyframes anime-fade-out-left {0% {opacity: 1;}100% {opacity: 0;transform: translateX(-100%);}}
@keyframes anime-fade-out-right {0% {opacity: 1;}100% {opacity: 0;transform: translateX(100%);}}
@keyframes anime-fade-out-up {0% {opacity: 1;}100% {opacity: 0;transform: translateY(-100%);}}
@keyframes anime-bounce-in {0% {opacity: 0;transform: scale(.3);}20% {transform: scale(1.1);}40% {transform: scale(.9);}60% {opacity: 1;transform: scale(1.03);}80% {transform: scale(.97);}100% {opacity: 1;transform: scale(1);}}
@keyframes anime-bounce-in-down {0% {opacity: 0;transform: translateY(-1000px);}60% {opacity: 1;transform: translateY(25px);}75% {transform: translateY(-10px);}90% {transform: translateY(5px);}100% {transform: translate(0);}}
@keyframes anime-bounce-in-left {0% {opacity: 0;transform: translateX(-1000px);}60% {opacity: 1;transform: translateX(25px);}75% {transform: translateX(-10px);}90% {transform: translateX(5px);}100% {transform: translate(0);}}
@keyframes anime-bounce-in-right {0% {opacity: 0;transform: translateX(3000px);}60% {opacity: 1;transform: translateX(-25px);}75% {transform: translateX(10px);}90% {transform: translateX(-5px);}100% {transform: translate(0);}}
@keyframes anime-bounce-in-up {0% {opacity: 0;transform: translateY(3000px);}60% {opacity: 1;transform: translateY(-20px);}75% {transform: translateY(10px);}90% {transform: translateY(-5px);}100% {transform: translate(0);}}
@keyframes anime-bounce-out {20% {transform: scale(.9);}50% {opacity: 1;transform: scale(1.1);}100% {opacity: 0;transform: scale(.3);}}
@keyframes anime-bounce-out-down {20% {transform: translateY(10px);}50% {opacity: 1;transform: translateY(-20px);}100% {opacity: 0;transform: translateY(1000px);}}
@keyframes anime-bounce-out-left {20% {opacity: 1;transform: translateX(20px);}100% {opacity: 0;transform: translateX(-1000px);}}
@keyframes anime-bounce-out-right {20% {opacity: 1;transform: translateX(-20px);}100% {opacity: 0;transform: translateX(1000px);}}
@keyframes anime-bounce-out-up {20% {transform: translateY(-10px);}50% {opacity: 1;transform: translateY(20px);}100% {opacity: 0;transform: translateY(-1000px);}}
@keyframes anime-flip-in-x {0% {transform: perspective(400px) rotate3d(1, 0, 0, 90deg);opacity: 0;}100% {transform: perspective(400px);opacity: 1;}}
@keyframes anime-flip-in-y {0% {transform: perspective(400px) rotate3d(0, 1, 0, 90deg);opacity: 0;}100% {transform: perspective(400px);opacity: 1;}}
@keyframes anime-flip-out-x {0% {transform: perspective(400px);opacity: 1;}100% {transform: perspective(400px) rotate3d(1, 0, 0, 90deg);opacity: 0;}}
@keyframes anime-flip-out-y {0% {transform: perspective(400px);opacity: 1;}100% {transform: perspective(400px) rotate3d(0, 1, 0, 90deg);opacity: 0;}}
@keyframes anime-zoom-in {0% {opacity: 0;transform: scale(0.3);}100% {opacity: 1;}}
@keyframes anime-zoom-out {0% {opacity: 1;}100% {opacity: 0;transform: scale(0.3);}}
@keyframes anime-zoom-in-enlarge {0% {opacity: 0;transform: scale(3);}100% {opacity: 1;}}
@keyframes anime-zoom-out-enlarge {0% {opacity: 1;}100% {opacity: 0;transform: scale(3);}}
@keyframes anime-shrink-in {0% {opacity: 0;filter: blur(20px);}100% {opacity: 1;filter: blur(0);}}
@keyframes anime-shrink-out {0% {opacity: 1;filter: blur(0);}100% {opacity: 0;filter: blur(20px);}}
@keyframes anime-shrink-in-enlarge {0% {opacity: 0;transform: scale(5);filter: blur(10px);}100% {opacity: 1;transform: scale(1);filter: blur(0);}}
@keyframes anime-shrink-out-enlarge {0% {opacity: 1;transform: scale(1);filter: blur(0);}100% {opacity: 0;transform: scale(5);filter: blur(10px);}}

/* frame */
.main,
.mobile {width: 100%;margin: auto;position: relative;}
.main {max-width: 1300px;padding: 0 10px;}
.mobile {max-width: 640px;min-height: 100%;}
.mobile img {width: 100%;}
.block {width: 100%;overflow: hidden;position: relative;}
[cover],.cover {object-fit: cover;background-size: cover;width: 100%;height: 100%;}
[contain],.contain {object-fit: contain;background-size: contain;width: 100%;height: 100%;}
[center],.center {display: flex !important;justify-content: center;align-items: center;}
[center] .ico,.center .ico {margin: auto 0;}
.clear {clear: both;}
.hide {display: none;}
.show {display: block;}
.hide-important {display: none !important;}
.show-important {display: block !important;}
.single {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;flex: 1;min-width: 0;}
.only-web {display: block;}
.only-mob {display: none;}
.float-left {float: left;}
.float-right {float: right;}
.float-left-important {float: left !important;}
.float-right-important {float: right !important;}
.flex {display: flex;}
.flex-auto {flex: 1;min-width: 0;}
.flex-column {display: flex;flex-direction: column;}
.wide {width: 100% !important;}
.full {width: 100% !important;height: 100% !important;}
.full-device {width: 100vw !important;height: 100vh !important;}
.fullscreen:after {content: '\e9f7';}
.fullscreen.active:after {content: '\e9f8';}
.transparent {opacity: 0;}
.absolute,.absolute-center,.absolute-left,.absolute-right,.absolute-top,.absolute-bottom,.absolute-top-left,.absolute-top-right,.absolute-bottom-left,.absolute-bottom-right,.absolute-top-center,.absolute-bottom-center,.absolute-left-center,.absolute-right-center {position: absolute;margin: auto;}
.fixed,.fixed-center,.fixed-left,.fixed-right,.fixed-top,.fixed-bottom,.fixed-top-left,.fixed-top-right,.fixed-bottom-left,.fixed-bottom-right,.fixed-top-center,.fixed-bottom-center,.fixed-left-center,.fixed-right-center {position: fixed;margin: auto;}
.absolute-center,.absolute-left,.absolute-top-left,.absolute-bottom-left,.absolute-top-center,.absolute-bottom-center,.absolute-left-center,
.fixed-center,.fixed-left-center,.fixed-left,.fixed-top-left,.fixed-bottom-left,.fixed-top-center,.fixed-bottom-center {left: 0;}
.absolute-right,.absolute-top-right,.absolute-bottom-right,.absolute-top-center,.absolute-bottom-center,.absolute-right-center,
.fixed-center,.absolute-center,.fixed-right,.fixed-top-right,.fixed-bottom-right,.fixed-top-center,.fixed-bottom-center,.fixed-right-center {right: 0;}
.absolute-center,.absolute-top,.absolute-top-left,.absolute-top-right,.absolute-top-center,.absolute-left-center,.absolute-right-center,
.fixed-center,.fixed-top,.fixed-top-left,.fixed-top-right,.fixed-top-center,.fixed-left-center,.fixed-right-center {top: 0;}
.absolute-center,.absolute-bottom,.absolute-bottom-left,.absolute-bottom-right,.absolute-bottom-center,.absolute-left-center,.absolute-right-center,
.fixed-center,.fixed-bottom,.fixed-bottom-left,.fixed-bottom-right,.fixed-bottom-center,.fixed-left-center,.fixed-right-center {bottom: 0;}

@media(max-width:640px){
	.main {padding: 0 .1rem;}
    .only-web {display: none;}
    .only-mob {display: block;}
}

/* special */
.corner {position: relative;}
.corner::after {content: '';width: 0;height: 0;border: 0 transparent solid;position: absolute;margin: auto;}
.shadow {position: relative;}
.shadow::after {width: calc(100% - 20px);height: 10px;border-radius: 100px;position: absolute;left: 0;right: 0;bottom: 0;margin: auto;opacity: .7;background-color: var(--color);box-shadow: 0 5px 10px var(--color);content: '';}
.adrift {filter: drop-shadow(0 10px 10px var(--color));}
.avatar {border-radius: 100%;display: block;overflow: hidden;}
.avatar img {object-fit: cover;width: 100%;height: 100%;}

[uigg="emot"] s {width: 50px;height: 50px;display: inline-block;background-size: 90%;vertical-align: middle;}
[uigg="emot"] s:hover {background-color: var(--eee);}
img[uigg="color"] {content-visibility: hidden;}

@media(max-width:640px){
	.shadow::after {width: calc(100% - .2rem);height: .1rem;}
    .adrift {filter: drop-shadow(0 .1rem .1rem var(--color));}
    [uigg="emot"] s {width: .6rem;height: .6rem;}
}

/* color */
:root {
    --color : var(--sapphire);

    --white: #fff;
    --fff: #fff;
    --f7: #f7f7f7;
    --eee: #eee;
    --ddd: #ddd;
    --ccc: #ccc;
    --bbb: #bbb;
    --999: #999;
    --666: #666;
    --333: #333;
    --222: #222;
    --111: #111;
    --000: #000;
    --black: #000;

    --brown: #8d1313;
    --red: #ff3b52;
    --pink: #ff3ea6;
    --purple: #d844d8;
    --sapphire: #6c62f9;
    --blue: #2e6efd;
    --cyan: #0df0f0;
    --green: #47DCA1;
    --lime: #af0;
    --yellow: #fe0;
    --orange: #fb0;
    --tomato: #f60;

    --fff-1: rgba(255,255,255,.1);
    --fff-2: rgba(255,255,255,.2);
    --fff-3: rgba(255,255,255,.3);
    --fff-4: rgba(255,255,255,.4);
    --fff-5: rgba(255,255,255,.5);
    --fff-6: rgba(255,255,255,.6);
    --fff-7: rgba(255,255,255,.7);
    --fff-8: rgba(255,255,255,.8);
    --fff-9: rgba(255,255,255,.9);

    --000-1: rgba(0,0,0,.1);
    --000-2: rgba(0,0,0,.2);
    --000-3: rgba(0,0,0,.3);
    --000-4: rgba(0,0,0,.4);
    --000-5: rgba(0,0,0,.5);
    --000-6: rgba(0,0,0,.6);
    --000-7: rgba(0,0,0,.7);
    --000-8: rgba(0,0,0,.8);
    --000-9: rgba(0,0,0,.9);
}

.co-white {color: var(--white) !important;}
.co-fff {color: var(--fff) !important;}
.co-f7 {color: var(--f7) !important;}
.co-eee {color: var(--eee) !important;}
.co-ddd {color: var(--ddd) !important;}
.co-ccc {color: var(--ccc) !important;}
.co-bbb {color: var(--bbb) !important;}
.co-999 {color: var(--999) !important;}
.co-666 {color: var(--666) !important;}
.co-333 {color: var(--333) !important;}
.co-222 {color: var(--222) !important;}
.co-111 {color: var(--111) !important;}
.co-000 {color: var(--000) !important;}
.co-black {color: var(--black) !important;}
.co-brown {color: var(--brown) !important;}
.co-red {color: var(--red) !important;}
.co-pink {color: var(--pink) !important;}
.co-purple {color: var(--purple) !important;}
.co-sapphire {color: var(--sapphire) !important;}
.co-blue {color: var(--blue) !important;}
.co-cyan {color: var(--cyan) !important;}
.co-green {color: var(--green) !important;}
.co-lime {color: var(--lime) !important;}
.co-yellow {color: var(--yellow) !important;}
.co-orange {color: var(--orange) !important;}
.co-tomato {color: var(--tomato) !important;}

.bg-white {background-color: var(--white) !important;}
.bg-fff {background-color: var(--fff) !important;}
.bg-f7 {background-color: var(--f7) !important;}
.bg-eee {background-color: var(--eee) !important;}
.bg-ddd {background-color: var(--ddd) !important;}
.bg-ccc {background-color: var(--ccc) !important;}
.bg-bbb {background-color: var(--bbb) !important;}
.bg-999 {background-color: var(--999) !important;}
.bg-666 {background-color: var(--666) !important;}
.bg-333 {background-color: var(--333) !important;}
.bg-222 {background-color: var(--222) !important;}
.bg-111 {background-color: var(--111) !important;}
.bg-000 {background-color: var(--000) !important;}
.bg-black {background-color: var(--black) !important;}
.bg-brown {background-color: var(--brown) !important;}
.bg-red {background-color: var(--red) !important;}
.bg-pink {background-color: var(--pink) !important;}
.bg-purple {background-color: var(--purple) !important;}
.bg-sapphire {background-color: var(--sapphire) !important;}
.bg-blue {background-color: var(--blue) !important;}
.bg-cyan {background-color: var(--cyan) !important;}
.bg-green {background-color: var(--green) !important;}
.bg-lime {background-color: var(--lime) !important;}
.bg-yellow {background-color: var(--yellow) !important;}
.bg-orange {background-color: var(--orange) !important;}
.bg-tomato {background-color: var(--tomato) !important;}
.bg-color {background-image: conic-gradient(at 50% 50%,var(--red) 0%,var(--orange) 25%,var(--green) 50%,var(--blue) 75%,var(--purple) 100%);}

.mono,.mono-click {filter: grayscale(100%);}
.mono-click {}
.mono-click:hover {filter: grayscale(0%);}
.mix-abrazine {backdrop-filter: blur(10px);}
.mix-hue {mix-blend-mode: hue;}
.mix-multiply {mix-blend-mode: multiply;}
.mix-screen {mix-blend-mode: screen;}
.mix-luminosity {mix-blend-mode: luminosity;}
.mix-difference {mix-blend-mode: difference;}

@media(max-width:640px){
    .mix-abrazine {backdrop-filter: blur(.1rem);}
}

/* media */
img {max-width: 100%;height: auto;vertical-align: middle;}
audio,canvas,video {display: inline-block;}
audio:not([controls]) {display: none;height: 0;}
video {object-fit: fill;}
canvas {user-select: none;}

a[title="到百度地图查看此区域"],
.BMap_cpyCtrl,
.anchorBL {display: none;}

@media(max-width:640px){
    img {width: 100%;}
}

/* touch */
.touch {}
.touch-up {}
.touch-down {}
.touch-left {}
.touch-right {}
.touch-all {}

/* ico */
.ico {display: inline-block;vertical-align: middle;}
.ico-load,
.ico-ringdot {animation: anime-rotate 5s infinite linear;}

@media(max-width:640px){
    .ico {font-size: .36rem;}
}

/* typeface */
@font-face {font-family: uigg;src: local('PingFang SC'),local('Microsoft Yahei');}
@font-face {font-family: yahei;src: local('Microsoft Yahei');}
@font-face {font-family: jhenghei;src: local('Microsoft JhengHei');}

.font-uigg {font-family: uigg;}
.font-yahei {font-family: yahei;}
.font-jhenghei {font-family: jhenghei;}
.font-nsimsun {font-family: nsimsun;}
.font-kaiti {font-family: kaiti;}
.font-lisu {font-family: lisu;}
.font-youyuan {font-family: youyuan;}
.font-fangsong {font-family: fangsong;}
.font-xingkai {font-family: STXingkai;}
.font-xinwei {font-family: STXinwei;}
.font-arial {font-family: arial;}
.font-tahoma {font-family: tahoma;}

h1,h2,h3,h4,h5,h6 {font-weight: bold;text-transform: capitalize;}
h1 {font-size: 26px;}
h2 {font-size: 22px;}
h3 {font-size: 20px;}
h4 {font-size: 18px;}
h5 {font-size: 16px;}
h6 {font-size: 14px;}

@media(max-width:640px){
	h1 {font-size: .32rem;}
	h2 {font-size: .28rem;}
	h3 {font-size: .26rem;}
	h4 {font-size: .24rem;}
	h5 {font-size: .22rem;}
	h6 {font-size: .2rem;}
}

/* pop */
pop,
pop > x {width: 100%;height: 100%;left: 0;top: 0;}
pop {position: fixed;background-color: var(--000-8);z-index: 3;display: none;}
pop > x {position: absolute;}
pop-main {width: 90%;max-width: 720px;overflow: hidden;position: relative;z-index: 1;}
pop-title {background-color: white;border-bottom-width: 1px;overflow: hidden;display: flex;align-items: center;}
pop-title h3 {width: 100%;line-height: 50px;padding: 0 20px;flex: 1;min-width: 0;font-size: 18px;}
pop-title h3:nth-child(2) {padding: 0;}
pop-title .ico {line-height: 50px;width: 50px;height: 50px;}
pop-title .close:after {content: '\e826';}
pop-cont {background-color: white;display: block;max-height: 70vh;overflow: auto;}
pop-solve {display: flex;}
pop-solve .btn {width: 100%;border-radius: 0;box-shadow: none;}
pop-solve .btn:hover {transform: translate(0);}
pop-choice,
pop-sider {overflow: hidden;position: absolute;z-index: 1;}
pop-choice {bottom: 0;width: 100%;}
pop-sider {top: 0;width: 300px;height: 100%;background-color: white;}
pop-sider {display: flex;flex-direction: column;}
pop-sider pop-cont {flex: 1;overflow: auto;}
pop[right] pop-sider {right: 0;}

@media(max-width:640px){
	pop-title h3 {line-height: .7rem;padding: 0 .2rem;font-size: .24rem;}
	pop-title .ico {line-height: .7rem;width: .7rem;height: .7rem;}
    pop-sider {width: 5rem;}
}

/* tip */
tip {position: fixed;top: 50%;left: 50%;z-index: 999;padding: 5px 10px;background-color: white;line-height: 24px;border-radius: 5px;box-shadow: 0 3px 6px var(--000-1);}
tip > * {padding: 5px;}

@media(max-width:640px){
	tip {padding: .05rem .1rem;line-height: .3rem;}
    tip > * {padding: .05rem;}
}

/* btn */
.btn {text-align: center;height: 50px;line-height: 50px;position: relative;background-color: var(--color);color: white;border-radius: 2px;text-transform: capitalize;display: flex;align-items: center;justify-content: center;padding: 0 20px;user-select: none;}
.btn .ico {margin: 5px;}
.btn .ico:first-child {margin-left: -5px;}
.btn .ico:last-child {margin-right: -5px;}
.btn:hover {transform: translateY(5px);}
.btn-flex {display: flex;justify-content: center;align-items: center;}
.btn-flex .btn,
.btn-flex button {flex: 1;}
.btn-empty {background-color: transparent !important;border: 1px solid;color: var(--color);}
.btn-empty .ico {color: var(--color);}
.btn[disabled] {filter: grayscale(100%);}
.btn[disabled]:hover {transform: translateY(0);cursor: no-drop;}

@media(max-width:640px){
	.btn {height: .8rem;line-height: .8rem;padding: 0 .2rem;}
	.btn:hover {transform: translateY(0);}
    .btn .ico {margin: .05rem;}
    .btn .ico:first-child {margin-left: -.5rem;}
    .btn .ico:last-child {margin-right: -.5rem;}
}

/* nav */
nav {width: 100%;display: flex;position: fixed;left: 0;bottom: 0;z-index: 3;background-color: white;box-shadow: 0 0 6px var(--000-1);}
nav li {width: 100%;padding: 8px;}
nav li a {display: block;padding: 8px 0;position: relative;border-radius: 5px;}
nav li .ico {display: block;margin: 0 auto 5px;font-size: 32px;}
nav li span {display: block;text-align: center;line-height: 100%;text-transform: capitalize;}

@media(max-width:640px){
    space {height: 1.4rem;}
    nav li {padding: .08rem;}
    nav li a {padding: .08rem 0;}
    nav li .ico {margin: 0 auto .02rem;font-size: .32rem;}
    nav li span {font-size: .18rem;}
}

/* menu */
menu {text-transform: capitalize;}
menu x.ico {display: none;float: right;}
menu x.ico:after {content: '\e961';}
menu-cont {text-align: center;}
menu-cont li {cursor: pointer;position: relative;display: inline-block;}
menu-cont li:hover menu-group {display: block;}
menu-cont li a {display: block;user-select: none;}
menu-cont li > a {padding: 0 10px;}
menu-group {position: absolute;left: 0;display: none;width: 100%;background-color: white;box-shadow: 0 3px 6px var(--000-1);overflow: hidden;}
menu-group a {line-height: 40px;}
menu-list h6 {line-height: 50px;}

@media(max-width:640px){
    menu x.ico {display: block;width: .8rem;height: .8rem;line-height: .8rem;font-size: .42rem;}
    menu-cont {position: absolute;left:0;top: .8rem;background-color: var(--000-9);width: 100vw;display: none;}
    menu-cont li {width: 100%;height: auto;display: block;overflow: hidden;}
    menu-cont li:not(:last-child) {border-bottom: 1px var(--333) solid;}
    menu-cont li,
    menu-cont li a {color: white;}
    menu-cont li a {line-height: .7rem;padding: 0 .2rem;}
    menu-cont li:hover menu-group {display: none;}
    menu-group {width: 100%;background-color: var(--333);padding: 0;position: static;}
    menu-list h6 {color: white;line-height: .7rem;}
}

/* title */
.title {text-align: center;}
.title h3,
.title em {display: inline-block;vertical-align: middle;}
.title span {display: block;}
.title-flex {display: flex;}
.title-flex h3 {flex: 1;min-width: 0;padding: 0 10px;}

@media(max-width:640px){
    .title-flex h3 {padding: 0 .1rem;}
}

/* toggle */
o {font-family: ico !important;font-size: 24px;font-style: normal;font-weight: normal;text-decoration: none;text-align: center;vertical-align: middle;justify-content: center;margin: auto;line-height: 1;text-transform: none;display: inline-block;direction: ltr;letter-spacing: normal;word-wrap: normal;white-space: nowrap;color: var(--color);}
o.radio:after {content: '\e9ce';}
o.radio.active:after {content: '\e9c6';}
o.radio-done:after {content: '\e9ce';}
o.radio-done.active:after {content: '\e9c5';}
o.checkbox:after {content: '\e7da';}
o.checkbox.active:after {content: '\e7dc';}
o.checkbox-done:after {content: '\e7da';}
o.checkbox-done.active:after {content: '\e7d7';}
o.checkbox-cancel:after {content: '\e7da';}
o.checkbox-cancel.active:after {content: '\e7d8';}
o.checkbox-all {}
o.favorite:after {content: '\e917';}
o.favorite.active:after {content: '\e90b';}
o.star:after {content: '\ea62';}
o.star.active:after {content: '\ea65';}
o.visibility:after {content: '\eb5a';}
o.visibility.active:after {content: '\eb5d';}
o.password:after {content: '\eb5a';}
o.password.active:after {content: '\ebc6';}
o.mic:after {content: '\e97b';}
o.mic.active:after {content: '\e971';}
o.volume:after {content: '\eb5b';}
o.volume.active:after {content: '\eb60';}
o.muzak:after {content: '\e98c';}
o.muzak.active:after {content: '\e990';}
o.phonecard:after {content: '\e9ab';}
o.phonecard.active:after {content: '\e9a8';}
o.telecamera:after {content: '\eb20';}
o.telecamera.active:after {content: '\eb23';}
o.camera:after {content: '\e7be';}
o.camera.active:after {content: '\e7c0';}
o.aim:after {content: '\e70f';}
o.aim.active:after {content: '\e707';}
o.semaphore:after {content: '\e9fe';}
o.semaphore.active:after {content: '\ea01';}
o.suitcase:after {content: '\eb07';}
o.suitcase.active:after {content: '\eb01';}
o.toggle:after {content: '\eb34';}
o.toggle.active:after {content: '\eb35';}
o.toggle {font-size: 36px;}

@media(max-width:640px){
    o {font-size: .36rem;margin: 0;}
}

/* form */
button,input,optgroup,select,textarea {outline: none;border-radius: 0;}
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="time"],
input[type="week"],
input[type="month"],
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="range"],
input[type="range"]::-webkit-slider-thumb,
input[type="search"]::-webkit-search-cancel-button,
select,
textarea,
progress,
::-webkit-outer-spin-button,
::-webkit-inner-spin-button {-webkit-appearance: none;appearance: none;}
::-webkit-input-placeholder {color: var(--ccc);text-transform: capitalize;}
::-webkit-progress-bar {background-color: var(--f7);height: 4px;}
::-webkit-progress-value {background-color: var(--color);}
progress {height: 4px;}

input[type="range"],
input[type="file"],
input[type="color"] {padding: 0;background: none !important;border: 0;}
input[type="range"]::-webkit-slider-runnable-track {height: 4px;background-color: var(--color);}
input[type="range"]::-webkit-slider-thumb {width: 24px;height: 24px;background-color: var(--color);border-radius: 100%;margin-top: -10px;box-shadow: 0 3px 6px var(--color);}
input[type="file"]::-webkit-file-upload-button {background-color: var(--color);border: 0;cursor: pointer;height: 50px;color: white;border-radius: 3px;text-transform: capitalize;padding: 0 20px;}
input[type="color"] {width: 50px;}
input[type="color"]::-webkit-color-swatch-wrapper {padding: 0;}
input[type="color"]::-webkit-color-swatch {border: none;border-radius: 2px;}

::-webkit-calendar-picker-indicator {transform: scale(2);}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="week"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator {opacity: 0;}
input[type="date"]::before,
input[type="datetime-local"]::before,
input[type="time"]::before,
input[type="week"]::before,
input[type="month"]::before,
.select::after {position: absolute;right: 10px;font-family: ico !important;font-size: 24px;line-height: 50px;}
input[type="date"]::before {content: '\e7b2';}
input[type="datetime-local"]::before {content: '\e7bc';}
input[type="time"]::before {content: '\eb32';}
input[type="week"]::before {content: '\e7b7';}
input[type="month"]::before {content: '\e7bb';}
input::before,
.select::after {color: var(--color);}

.select,
select,
.input,
input {width: 100%;height: 50px;position: relative;}
.input i,
.input o {line-height: 50px;position: absolute;top: 0;right: 10px;}
textarea {width: 100%;padding: 10px;line-height: 160%;min-height: 120px;resize: none;}
input {padding: 0 10px;}
.select::after {content: '\e70a';pointer-events: none;}
.input input,
select {padding: 0 50px 0 10px;}

.form li > * {margin:5px;float: left;}
.form select,
.form input,
.form textarea {background-color: var(--f7);}
.form .input o,
.form li .input input,
.form li .select select {margin: 0;}
.form {overflow: hidden;}
.form span,
.form cite,
.form li,
.form o {line-height: 50px;}
.form li {display: flex;align-items: center;width: 100%;}
.form li.resolve {padding-left: 110px;}
.form li.resolve .btn:not(:last-child) {margin-right: 10px;}
.form li .code {width: 140px;height: 50px;border-radius: 4px;overflow: hidden;display: flex;align-items: center;justify-content: center;}
.form li .code img {width: 100%;height: 100%;}
.form li > span:first-child {width: 100px;text-transform: capitalize;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.form .btn span {margin: 0;}
.form .min {width: 10%;}
.form .sml {width: 20%;}
.form .med {width: 30%;}
.form .lag {width: 50%;}
.form .big {width: 60%;}
.form .max {width: 80%;}
.form scaler input {margin: 0 10px;}

.upload {float: left;flex: 1;min-width: 0;}
.upload-group,
.upload-add {width: 100px;height: 100px;float: left;margin: 0 5px 5px 0;background-color: var(--f7);line-height: 100px;font-size: 36px;color: var(--000-2);}
.upload-group {position: relative;}
.upload-group input[type="file"] {width: 100%;height: 100%;position: absolute;top: 0;left: 0;opacity: 0;}
.upload-group horn {background-color: var(--red);}
.upload-group:after {content: '\e75b';}
.upload horn:after {content: '\e826';}
.upload-add:after {content: '\e6f3';}

@media(max-width:640px){
    ::-webkit-progress-bar {height: .05rem;}
    progress {height: .05rem;}

    input[type="range"]::-webkit-slider-runnable-track {height: .05rem;}
    input[type="range"]::-webkit-slider-thumb {width: .35rem;height: .35rem;margin-top: -.15rem;}
    input[type="file"]::-webkit-file-upload-button {height: .7rem;padding: 0 .2rem;}
    input[type="color"] {width: .7rem;flex: none !important;}

    input[type="date"]::before,
    input[type="datetime-local"]::before,
    input[type="time"]::before,
    input[type="week"]::before,
    input[type="month"]::before,
    .select::after {right: .1rem;font-size: .32rem;line-height: .7rem;}

    .select,
    select,
    .input,
    input {height: .7rem;}
    .input i,
    .input o {line-height: .7rem;}
    textarea {padding: .1rem;min-height: 2rem;}
    input {padding: 0 .1rem;}
    .input input,
    select {padding: 0 .7rem 0 .1rem;}

    .form li > * {margin: 0;}
    .form .select,
    .form select,
    .form .input,
    .form input,
    .form textarea {background-color: transparent;flex: 1;min-width: 0;}
    .form span,
    .form cite,
    .form li,
    .form li .code,
    .form o {line-height: .7rem;}
    .form li,
    .form li.resolve {padding: .1rem 0;}
    .form li:not(:last-child) {border-bottom-width: 1px;}
    .form li.resolve {border: 0;}
    .form li.resolve .btn {width: 100%;}
    .form li.resolve .btn:not(:last-child) {margin-right: .1rem;}
    .form li .code {width: 1.6rem;height: .7rem;font-size: .2rem;}
    .form li span {padding: 0 .05rem;}
    .form li > span:first-child {width: 1.5rem;}
    .form .btn,
    .form button {width: 100%;}
    .form cite {display: none;}
    .form .min,
    .form .sml,
    .form .med,
    .form .lag,
    .form .big,
    .form .max {width: auto;flex: 1;min-width: 0;}
    .form scaler {width: 100%;}
    .form scaler .btn {width: .7rem;}
    .form scaler input {margin: 0;}

    .upload-group,
    .upload-add {width: 1.1rem;height: 1.1rem;margin: 0 .05rem .05rem 0;line-height: 1.1rem;font-size: .42rem;}
    .upload x {width: .5rem;height: .5rem;padding: 0 0 .1rem .1rem;}
}

/* page */
page .ico,
page * {height: 50px;border-radius: 2px;text-align: center;margin: 2px;line-height: 50px;}
page,
page ul {display: flex;align-items: center;justify-content: center;}
page ul a,
page span,
page input {font-size: 16px;}
page a,
page button {background-color: var(--f7);width: 50px;user-select: none;}
page ul {margin: 0;overflow: inherit;}
page ul a {display: none;}
page span {padding: 0 10px;}
page input {border-width: 1px;width: 80px;}
page a:hover,
page a.active,
page button:hover {background-color: var(--color);color: white;}
page[min] span,
page[min] input,
page[min] button {display: none;}

@media(max-width:640px){
    page .ico,
    page * {height: .7rem;border-radius: .02rem;margin: .02rem;line-height: .7rem;}
    page ul a,
    page span,
    page input {font-size: .22rem;}
    page a,
    page button {width: .7rem;}
    page ul {display: none;}
    page span {padding: 0 .1rem;}
    page input {width: .7rem;}
}

/* tab */
tab {}
tab-list {overflow: hidden;}
tab-list li {display: block;float: left;text-align: center;}
tab-list li a {display: block;font-weight: bold;padding: 0 20px;}
tab-group {display: none;}
tab-group.active {display: block;}

@media(max-width:640px){
    tab-list li a {padding: 0 .2rem;}
}

/* table */
.table {}
.table table {width: 100%;border-collapse: separate;border-spacing:0;background-color: white;}
.table table th,
.table table td {vertical-align: middle;text-align: center;height: 50px;padding: 0 10px;}
.table table th {text-transform: capitalize;}
.table table thead th,
.table table thead td {font-weight: bold;text-transform: capitalize;border-bottom: 2px var(--color) solid;}
.table table tbody tr:nth-child(2n) {background-color: var(--f7);}
.table table tbody tr:hover {background-color: var(--eee);}
.table table tfoot tr:first-child th,
.table table tfoot tr:first-child td {border-top: 1px var(--color) solid;}

@media(max-width:640px){
    .table {overflow: auto;}
    .table table {max-width: 15rem;}
    .table table th,
    .table table td {height: .7rem;padding: 0 .1rem;}
    .table table tbody tr:hover {background-color: transparent;}
}

/* swiper */
.swiper {width: 100%;height: 100%;}
.swiper-slide {width: 100%;height: 100%;}
.swiper-button-next,.swiper-button-prev {width: 50px;height: 50px;font-size: 40px;line-height: 50px;color: var(--color);margin-top: -25px;display: flex;}
.swiper-button-next {right: 0;}
.swiper-button-prev {left: 0;}
.swiper-button-prev:after,
.swiper-button-next:after {font-family: 'ico';content: '';}
.swiper-pagination .swiper-pagination-bullet-active {background-color: var(--color);}
.swiper-anime {display: none;animation-delay: .3s;}
.swiper-animate .swiper-slide-active .swiper-anime {display: block;}

.parallax-bg {position: absolute;left: 0;top: 0;width: 130%;height: 100%;}
.lug-thumbs a {display: inline-block;}
.gallery-top,
.relative-top {margin-bottom: 10px;}

@media(max-width:640px){
    .swiper-button-next,.swiper-button-prev {width: .5rem;height: .5rem;font-size: .4rem;line-height: .5rem;margin-top: -.25rem;}
    .gallery-top,
    .relative-top {margin-bottom: .1rem;}
}

/* name */
name,
name h2,
name-logo,
name-search {display: flex;align-items: center;justify-content: center;}
name {height: 80px;position: relative;z-index: 1;box-shadow: 0 0 6px var(--000-1);background-color: white;}
name h2,
name h3,
name-logo,
name-search {flex: 1;min-width: 0;text-align: center;}
name h2,
name h3 {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 26px;}
name h2,
name-logo {position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
name h3 {text-align: left;border-left: 1px var(--eee) solid;padding: 0 20px;}
name .ico {font-size: 36px;width: 80px;position: relative;z-index: 1;}
name-logo {padding: 15px;}
name-logo img {height: 100%;width: auto;}
name-logo h1 {text-transform: uppercase;font-size: 30px;padding-left: 10px;}
name-search {position: relative;margin: 10px 0;background-color: var(--000-1);border-radius: 30px;}
name-search input {text-align: inherit;font-size: 24px;color: inherit;padding: 0 80px 0 0;}
name-search input::-webkit-input-placeholder {color: var(--000-2);}

@media(max-width:640px){
    name {height: .8rem;}
    name h2,
    name h3 {font-size: .3rem;}
    name h3 {margin: .2rem 0;padding: 0 .25rem;}
    name .ico {font-size: .42rem;width: .8rem;}
    name-logo {padding: .15rem;}
    name-logo h1 {font-size: .32rem;padding-left: .1rem;}
    name-search {margin: .1rem 0;border-radius: .3rem;}
    name-search input {font-size: .24rem;height: .6rem;padding: 0 .8rem 0 0;}
}

/* load */
load {width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;z-index: 999;background-color: white;}
load::after {width: 50px;height: 50px;border-radius: 100%;background-color: var(--999);content: '';position: absolute;left: 0;top: 0;right: 0;bottom: 0;margin: auto;animation: anime-zoom-in 1s infinite alternate;filter: opacity(.3);}

@media(max-width:640px){
    load::after {width: .7rem;height: .7rem;}
}

/* browser */
msie {width: 100vw;height: 100vh;display: flex;justify-content: center;align-items: center;position: fixed;top: 0;left: 0;font-size: 50px;font-weight: lighter;text-transform: uppercase;color: whitesmoke;}

@media(max-width:640px){
    msie {font-size: .3rem;}
}

/* top */
.top {opacity: 0;z-index: 1;}
.top.btn {position: fixed;right: 0;bottom: 0;margin: 30px;width: 50px;font-size: 24px;font-weight: normal;padding: 0;}
.top.btn:hover {transform: translateY(-5px);}

@media(max-width:640px){
    .top.btn {width: .7rem;height: .7rem;margin: .2rem;font-size: .32rem;}
    .top.btn:hover {transform: translateY(0);}
}

/* scaler */
scaler {display: flex;}
scaler a.btn {width: 50px;}
scaler input {flex: 1;min-width: 0;text-align: center;margin: 0 5px;}

@media(max-width:640px){
	scaler a.btn {width: .7rem;height: .7rem;}
    scaler input {margin: 0 .1rem;}
}

/* list */
.list {overflow: hidden;}
.list li:not(:last-child) {border-bottom-width: 1px;}

@media(max-width:640px){}

/* countdown */
countdown {}
countdown s {text-decoration: none;}

/* music */
music {animation: muzak 10s infinite linear;border-radius: 100%;z-index: 999;width: 50px;height: 50px;position: fixed;top: 0;background-color: var(--color);color: white;display: none;}
music.ico {line-height: 50px;margin: 30px;}
music[pause] {animation: none;}
music:after {content: '\e98c';}
music[pause]:after {content: '\e990';}
@keyframes muzak {
    0% {transform: rotate(0);}
    100% {transform: rotate(360deg);}
}

@media(max-width:640px){
    music {width: .8rem;height: .8rem;}
    music.ico {line-height: .8rem;font-size: .48rem;margin: .3rem;}
}

/* drop */
drop {width: 100%;height: 50px;line-height: 50px;position: relative;background-color: var(--f7);}
drop x {position: fixed;width: 100vw;height: 100vh;top: 0;left: 0;}
drop i.ico {position: absolute;top: 0;right: 0;line-height: 50px;width: 50px;}
drop > i.ico {transform: rotate(90deg);}
drop-cont {width: 100%;height: 100%;overflow: hidden;position: relative;}
drop-list {display: none;position: absolute;top: 50px;left: 0;background-color: white;width: 100%;box-shadow: 0 3px 6px var(--000-1);max-height: 50vh;}
drop ul {overflow: visible;}
drop li {position: relative;}
drop li:not(:last-child) {border-bottom-width: 1px;}
drop li drop-list {right: -100%;top: 0;left: auto;}
drop li drop-list x {display: none;}
drop a {padding: 0 20px;display: block;user-select: none;}
drop li:hover > a {color: white;background-color: var(--color);}
drop li:hover > drop-list {display: block;}
drop li:hover > i {color: white;}
drop.active > drop-list {display: block;}
drop.active > i {transform: rotate(-90deg);}

@media(max-width:640px){
    drop {height: .7rem;line-height: .7rem;}
    drop i.ico {line-height: .7rem;width: .7rem;}
    drop-list {top: .7rem;}
    drop a {padding: 0 .2rem;}
}

/* rate */
rate {}
rate i {color: var(--orange);cursor: pointer;}
rate i.active::before {content:'\ea65';}

/* notify */
notify {position: fixed;top: 0;right: 0;margin: 0 10px;z-index: 999;}
notify.bottom {top: auto;bottom: 0;}
notify li {width: 300px;padding: 30px 20px 20px;border-radius: 5px;background-color: white;box-shadow: 0 3px 6px var(--000-1);position: relative;margin: 10px 0;transition: .3s;}
notify li x.ico {position: absolute;top: 0;right: 0;margin:  7px;}

@media(max-width:640px){
    notify {margin: 0 .1rem;}
    notify li {width: 4rem;padding: .4rem .2rem .2rem;border-radius: .1rem;margin: .1rem 0;}
    notify li x.ico {margin: .08rem;}
}

/* empty */
empty {height: 100%;display: flex;align-items: center;justify-content: center;padding: 10px;}
empty.default {font-size: 30px;color: var(--000-1);text-transform: capitalize;text-transform: uppercase;}
empty.default:after {content: 'empty';}
empty * {margin: 10px;text-transform: none;}
empty .ico {display: block;font-size: 72px;margin: inherit;}
empty div {text-align: center;}

@media(max-width:640px){
    empty {font-size: .36rem;padding: .2rem;}
    empty * {margin: .1rem;}
    empty .ico {font-size: .8rem;}

}

/* hop */
hop {position: relative;}
hop x {width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;display: none;}
hop a {height: 50px;line-height: 50px;display: block;text-align: center;user-select: none;}
hop-cont {position: absolute;box-shadow: 0 3px 6px var(--000-1);border-radius: 5px;display: none;}
hop-cont a {background-color: white;border-bottom-width: 1px;text-transform: capitalize;white-space: nowrap;padding: 0 20px;}
hop-cont a:first-child {border-radius: 5px 5px 0 0;}
hop-cont a:last-child {border-radius: 0 0 5px 5px;border: 0;}
hop-cont a:hover {background-color: var(--color);color: white;}
hop[right] hop-cont {right: 0;}
hop[bottom] hop-cont {bottom: 50px;}

@media(max-width:640px){
    hop a {height: .7rem;line-height: .7rem;min-width: .7rem;}
    hop-cont {border-radius: .05rem;}
    hop-cont a {padding: 0 .2rem;}
    hop-cont a:first-child {border-radius: .1rem .1rem 0 0;}
    hop-cont a:last-child {border-radius: 0 0 .1rem .1rem;}
    hop[bottom] hop-cont {bottom: .7rem;}
}

/* chat */
chat {height: 100%;display: flex;position: relative;}
chat ::-webkit-scrollbar {width: 3px;}
chat .ico {width: 50px;height: 50px;line-height: 50px;}
chat s {width: 50px;height: 50px;display: inline-block;background-size: 90%;vertical-align: middle;cursor: pointer;}
chat chat-title .ico:hover,
chat chat-tool .ico:hover {background: var(--eee);}
chat .avatar {width: 50px;height: 50px;}
chat pop img {max-height: 100%;}
chat aside {word-break: break-all;}
chat aside * {white-space: normal;}
chat aside img {max-width: 200px;border-radius: 5px;cursor: pointer;min-width: 50px;min-height: 50px;}
chat aside video {max-width: 300px;}
chat a[download] {background-color: var(--orange);display: inline-block;border-radius: 5px;padding-right: 20px;}
chat a[download] .ico-file {width: 50px;height: 50px;background-color: transparent;}
chat a[download]:hover .ico-file:before {content: '\e74e';}

chat-title {height: 50px;display: flex;align-items: center;border-bottom-width: 1px;position: relative;z-index: 1;}
chat-title h3 {font-size: 16px;flex: 1;padding: 0 10px;}
chat-title input {flex: 1;min-width: 0;}
chat-title x.ico-close {background: var(--red) !important;color: white;display: none;}
chat-sider {width: 240px;display: flex;flex-direction: column;border-right-width: 1px;}
chat-sider hop {position: static;}
chat-sider hop-cont {width: 100%;}
chat-sider hop-cont a {border-radius: 0 !important;}

chat-list {flex: 1;overflow: auto;}
chat-list li {}
chat-list li a {display: flex;align-items: center;padding: 10px;}
chat-list li .avatar {margin-right: 5px;}
chat-list li h6,
chat-list li span {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
chat-list li h6 {flex: 1;min-width: 0;}
chat-list li span {color: var(--ccc);display: block;}
chat-list li a.disable {filter: grayscale(100%);}
chat-list li a.active {background-color: var(--f7);}
chat-list li a:hover {background-color: var(--eee);}

chat-cont {flex: 1;min-width: 0;display: flex;flex-direction: column;background-color: white;position: relative;z-index: 1;}
chat-message {flex: 1;border-bottom-width: 1px;overflow: auto;}
chat-message li {padding: 10px 70px;position: relative;overflow: hidden;}
chat-message li .avatar {position: absolute;left: 0;top: 0;margin: 10px;}
chat-message li cite {display: block;margin-bottom: 5px;color: var(--ccc);}
chat-message li aside {background-color: var(--f7);border-radius: 0 10px 10px 10px;padding: 10px;display: inline-block;}
chat-message li.mine {}
chat-message li.mine .avatar {left: auto;right: 0;}
chat-message li.mine cite {text-align: right;}
chat-message li.mine aside {background-color: aliceblue;border-radius: 10px 0 10px 10px;float: right;}

chat-tool {height: 50px;position: relative;}
chat-tool > a {float: left;position: relative;}
chat-tool > a input[type="file"]{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;}
chat-tip {position: absolute;bottom: 50px;left: 0;background-color: white;border-width: 1px 0;width: 100%;overflow: auto;padding: 10px;display: none;}

chat-control {height: 150px;position: relative;overflow: hidden;}
chat-control aside {height: 100%;padding: 0 70px 0 10px;overflow: auto;-webkit-user-modify: read-write;}
chat-control aside * {-webkit-user-modify: read-only;}
chat-control .ico-paperplane {margin: 10px;background-color: var(--color);color: white;border-radius: 100%;position: absolute;right: 0;bottom: 0;}

@media(max-width:640px){
    chat {display: block;}
    chat .ico {width: .7rem;height: .7rem;line-height: .7rem;}
    chat s {width: .6rem;height: .6rem;}
    chat .avatar {width: .6rem;height: .6rem;}

    chat aside img {max-width: 3rem;border-radius: .05rem;min-width: .7rem;min-height: .7rem;}
    chat aside video {max-width: 3rem;}
    chat a[download] {border-radius: .05rem;padding-right: .2rem;}
    chat a[download] .ico-file {width: .7rem;height: .7rem;}

    chat-title {height: .7rem;}
    chat-title h3 {font-size: .22rem;padding: 0 .1rem;}
    chat-title x.ico-close {display: block;}
    chat-sider {width: 100%;height: 100%;border-right-width: 0;}
    chat-list li a {padding: .15rem;}
    chat-list li .avatar {margin-right: .1rem;}

    chat-cont {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: none;}
    chat-message li {padding: .1rem .8rem;}
    chat-message li .avatar {margin: .1rem;}
    chat-message li cite {margin-bottom: .05rem;}
    chat-message li aside {border-radius: 0 .1rem .1rem .1rem;padding: .1rem;}
    chat-message li.mine aside {border-radius: .1rem 0 .1rem .1rem;}

    chat-tool {height: .7rem;}
    chat-emot {bottom: .7rem;padding: .1rem;}

    chat-control {height: 2rem;}
    chat-control aside {padding: 0 .9rem 0 .1rem;}
    chat-control .ico-paperplane {margin: .1rem;}
}

/* fold */
fold {}
fold-title {border-bottom-width: 1px;display: flex;align-items: center;padding: 10px;}
fold-title *:not(.ico) {flex: 1;min-width: 0;}
fold-title h5 {line-height: 30px;}
fold-title .ico {width: 40px;margin: inherit;}
fold-cont {display: none;padding: 10px;}
fold-group.active fold-cont {display: block;}
fold-group.active fold-title s {transform: rotate(180deg);}

@media(max-width:640px){
    fold-title {padding: .1rem;}
    fold-title h5 {line-height: .35rem;}
    fold-title .ico {width: .5rem;}
    fold-cont {padding: .1rem;}
}

/* step */
step {width: 100%;padding: 20px;}
step aside {position: relative;display: flex;align-items: center;justify-content: space-around;}
step aside cite {width: 100%;height: 50%;position: absolute;top: 0;left: 0;border-bottom-width: 1px;}
step aside i {width: 60px;height: 60px;background-color: white;border-radius: 100%;display: flex;align-items: center;justify-content: center;position: relative;border: 2px solid;color: var(--color);font-size: 26px;margin: 10px;}
step ul {display: flex;justify-content: space-around;}
step ul li {flex: 1;font-size: 16px;text-align: center;font-weight: bold;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}

step[column] {display: flex;}
step[column] aside {flex-direction: column;width: 100px;}
step[column] aside cite {border-width: 0 1px 0 0;height: 100%;width: 50%;}
step[column] aside i {width: 50px;height: 50px;font-size: 22px;}
step[column] ul {flex: 1;flex-direction: column;}
step[column] ul li {text-align: left;display: flex;align-items: center;}

@media(max-width:640px){
    step {padding: .2rem;}
    step aside i {width: .6rem;height: .6rem;border-width: .03rem;font-size: .24rem;margin: .1rem;}
    step ul li {font-size: .2rem;}
    step[column] aside {width: 1rem;}
    step[column] aside i {width: .6rem;height: .6rem;font-size: .26rem;}
}

/* crumb */
crumb {display: flex;align-items: center;width: 100%;white-space: nowrap;overflow: hidden;text-transform: capitalize;}
crumb li {display: flex;align-items: center;}
crumb li i.ico {font-size: 20px;}
crumb li a {padding: 0 5px;}
crumb li a:hover {color: var(--color);}

@media(max-width:640px){
    crumb li i.ico {font-size: .3rem;}
    crumb li a {padding: 0 .05rem;}
}

/* clue */
clue {position: absolute;top: calc(100% + 15px);left: 0;right: 0;margin: auto;background-color: var(--000-8);border-radius: 5px;display: none;text-align: center;width: fit-content;min-width: 70px;padding: 10px;max-width: 300px;word-break: break-all;font-size: 14px;font-weight: normal;color: white;line-height: 150%;}
clue.corner {position: absolute;}
clue.corner::after {border-width: 0 10px 10px 10px;border-bottom-color: var(--000-8);top: -10px;left: 0;right: 0;}
*[clue] {position: relative;cursor: pointer;}
*[clue]:hover clue {display: block;}

@media(max-width:640px){
    clue {top: calc(100% + .15rem);border-radius: .1rem;min-width: 1rem;max-width: 3rem;font-size: .2rem;}
    clue.corner::after {border-width: 0 .1rem .1rem .1rem;top: -.09rem;}
}

/* reminder */
reminder {padding: 10px;border-width: 1px;background-color: var(--f7);margin: 20px 0;border-radius: 5px;}
reminder > * {padding: 10px;}

@media(max-width:640px){
    reminder {padding: .1rem;margin: .2rem 0;border-radius: .05rem;}
    reminder > * {padding: .1rem;}
}

/* tinymce */
.tox-tinymce {border-width: 1px !important;border-radius: 0 !important;flex: 1;min-width: 0;}
.tox:not(.tox-tinymce-inline) .tox-editor-header {box-shadow: none !important;border-bottom: 1px var(--eee) solid !important;}
.tox-simple + .tox-tinymce .tox-statusbar {display: none;}
.tox-selectimage input[type="file"] {font-size: 14px;}
.tox-selectimage input[type="file"]::-webkit-file-upload-button {height: 32px;}

.tox-dialog {padding: 8px 0 !important;border-radius: 5px !important;}
.tox-dialog__header {padding-right: 5px !important;}
.tox-dialog__title {font-weight: bold !important;}
.tox-dialog__body-nav-item {padding: 5px !important;border: 0 !important;border-radius: 3px;}
.tox-dialog__body-nav-item:focus,
.tox-dialog__body-nav-item--active {color: white!important;background-color: var(--color) !important;}
.tox-dialog__footer-end .tox-button {background-color: var(--color) !important;border: 0 !important;}

.tox .tox-tbtn:hover,
.tox .tox-tbtn:active,
.tox .tox-tbtn:focus,
.tox .tox-collection--list .tox-collection__item--active {background: var(--eee) !important;}
.tox .tox-tbtn--enabled, .tox .tox-tbtn--enabled:hover {background: var(--ddd) !important;}
.tox .tox-split-button:hover {box-shadow: 0 0 0 !important;}
.tox .tox-split-button:focus {background: var(--ddd) !important;}
.tox .tox-button {border-radius: 3px !important;}
.tox .tox-button--secondary,
.tox .tox-button--icon {background-color: transparent !important;border-width: 1px !important;}

.tox-listbox--select,
.tox-textarea,
.tox-textfield {border-radius: 0 !important;}
.tox-listbox--select:focus,
.tox-textarea:focus,
.tox-textfield:focus {border: 1px var(--eee) solid !important;box-shadow: 0 0 0 !important;}
.tox-collection__item,
.tox-listbox__select-label {font-size: 14px !important;}

/* horn */
horn {position: absolute;top: 0;right: 0;border-radius: 0 0 0 100px;background-color: var(--color);color: white;padding: 10px 10px 10px 20px;}
horn.ico {padding: 5px 5px 10px 10px;cursor: pointer;}
horn[left] {border-radius: 0 0 100px 0;right: auto;left: 0;padding: 10px 20px 10px 10px;}
horn[left].ico {padding: 5px 10px 10px 5px;}

@media(max-width:640px){
    horn {padding: .1rem .1rem .1rem .2rem;border-radius: 0 0 0 1rem;}
    horn.ico {padding: .05rem .05rem .1rem .1rem;}
    horn[left] {border-radius: 0 0 1rem 0;right: auto;left: 0;padding: .1rem .2rem .1rem .1rem;}
    horn[left].ico {padding: .05rem .1rem .1rem .05rem;}
}

/* article */
article {}
article > * {margin: 10px 0;}
article .btn {display: inline-block;}
article ul {padding-left: 20px;}
article ul li {list-style: disc;line-height: 200%;}

@media(max-width:640px){
    article > * {margin: .1rem 0;}
    article ul {padding-left: .2rem;}
}