:root{
	--primary: #4376bb;
	--primary-active: hsla(215,47%,50%,0.6);
  --text-color: #5f5f5f;
  --text-color-active: hsla(0,0%,37%,0.6);

  --page-bg: #fff;
  --bg-color1: #f6f6f6;
  --bg-color2: #efefef;

  --gn-nav-height: 1.4rem;
  --gn-header-height: 1.7rem;
  --gn-color: #5d5d5d;

  --bottom-bar-height: 1.66rem;

  --sxico-image: url(../images/common/sxico.png);
  --sxico-bgsize: 1em auto;
  --sxico-size: 0.4rem;
  --sico-image: url(../images/common/sico.png);
  --sico-bgsize: 1em auto;
  --sico-size: 0.6rem;
  --mico-image: url(../images/common/mico.png);
  --mico-bgsize: 1em auto;
  --mico-size: 0.8rem;
  --hico-image: url(../images/common/hico.png);
  --hico-bgsize: 1em auto;
  --hico-size: 1rem;
  --gnico-image: url(../images/common/gnico.png);
  --gnico-bgsize: 1em auto;
  --gnico-size: 0.5rem;


  --c3-0: #303030;
  --c3-0-active: hsla(0,0%,19%,0.6);

	--white: #fff;
	--white-active: hsla(0,0%,100%,0.6);
	--white-0: rgba(255,255,255,0);
	--c3: hsla(0,0%,20%,1);
	--c3-active: hsla(0,0%,20%,0.6);
	--c6: hsla(0,0%,40%,1);
	--c6-active: hsla(0,0%,40%,0.6);
	--c8: hsla(0,0%,53%,1);
	--c8-active: hsla(0,0%,53%,0.6);
	--c9: hsla(0,0%,60%,1);
	--c9-active: hsla(0,0%,60%,0.6);
	--bg-active: rgba(0,0,0,0.05);
	--bd: 0.7px solid #dfdfdf;
	--bd-2: 0.7px solid #f1eded;
}

*{margin:0; padding:0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: rgba(0,0,0,0);}
html{font-size: 8.05152979vmin; font-family: "Helvetica Neue", Helvetica, STHeiTi, "Microsoft YaHei", Arial, sans-serif;
}
body{margin: 0 auto; min-width:320px; line-height: 1.5; font-size: 0.28em; color:#666; overflow-x: hidden; -webkit-overflow-scrolling: touch; -webkit-text-size-adjust: 100%!important; -ms-text-size-adjust: 100%!important; text-size-adjust: 100%!important;
}
html, body{scroll-behavior: smooth;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary{display: block;}
audio, canvas, progress, video{display: inline-block; vertical-align: baseline;}
audio:not([controls]){display: none; height: 0;}
[hidden], template{display: none;}
svg:not(:root){overflow: hidden;}
mark{background: #ff0; color: #000;}
small{font-size: 80%;}
sub, sup{font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup{top: -0.5em;}
sub{bottom: -0.25em;}

table{border-collapse:collapse;}
ul{ list-style:none;}
img{border: 0; max-width: 100%;}
a img{vertical-align: bottom;}
a{text-decoration: none; color:#666; background-color: transparent; -webkit-tap-highlight-color: transparent;}
a:focus{outline:thin dotted}
a:active,a:hover{outline:0; text-decoration:none;}
h1,h2,h3,h4,h5{font-weight: normal; font-size: 1.2em;}
[v-cloak]{display: none;}

::-webkit-scrollbar{display: none;}

.fl{float: left}
.fr{float: right}
.al{text-align: left;}
.ac{text-align: center;}
.ar{text-align: right;}
.hide{display: none}
.overhide{overflow: hidden;}
.t-hide{-webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}

.clear, .clr{display: block; clear: both; height: 0; line-height: 0; font-size: 0; overflow: hidden;}
.clearfix2::before,.clearfix2::after{content:""; display: table;}
.clearfix2::after{clear: both;}
.clearfix2, .clearfix{*zoom:1;}
.clearfix:after{display: block; content: ""; clear: both; height: 0; visibility: hidden;}


.white-bg{background-color: var(--white);}

.mask{position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.5); opacity: 0; visibility: hidden; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}

.block-img{display: block; width: 100%;}
.pos-r-cover-image,
.pos-a-cover-image{display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover;}
.pos-r-cover-image{position: relative;}
.pos-a-cover-image{position: absolute; top: 0; left: 0;}
.text-hide{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.hide-el{position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; opacity: 0;}
.nodata{display: block; text-align: center; padding: 0 0.24rem; font-size: 0.13rem; color: #ccc;}

.wbox, .wpbox{margin-bottom: 0.16rem; background-color: #fff; overflow: hidden;}
.wpbox{padding: 0 0.24rem;}

.d-flex, .wb, .flex-row{display: -webkit-box; display: flex;}
.wbc{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.align-center{-webkit-box-align: center; align-items: center;}
.flex-1, .wbw, .flex-main{-webkit-box-flex: 1; flex: 1; min-width: 0;}
.flex-side{margin-left: 0.2rem; position: relative; display: block; -webkit-box-flex: 1; flex: 1; min-width: 0; text-align: right;}
.self-top{-webkit-align-self: flex-start; align-self: flex-start;}
.self-center{-webkit-align-self: center; align-self: center;}
.self-end{-webkit-align-self: flex-end; align-self: flex-end;}


ins, .ins{text-decoration: none;}
ins + del{margin-left: 0.1rem;}


::-webkit-input-placeholder{color: #bbb;}
:focus::-webkit-input-placeholder{color: #999;}
::-moz-placeholder{color: #bbb;}
:-ms-input-placeholder{color: #bbb;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{-webkit-appearance: none!important; margin: 0;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration{-webkit-appearance: none;}
input[type="number"]{appearance: none; -moz-appearance: none; -webkit-appearance: none;}

/*表单字体*/
input,select,button,textarea,form{font-family: "Helvetica Neue", Helvetica, STHeiTi, "Microsoft YaHei", Arial, sans-serif; }


/*距离*/
.mt0, .my0, .m0{margin-top: 0!important;}.m0,.mb0,.my0{margin-bottom:0!important}.m0,.mx0,.ml0{margin-left:0!important}.m0,.mx0,.mr0{margin-right:0!important}.m10,.mt10,.my10{margin-top:0.1rem!important}.m10,.mb10,.my10{margin-bottom:0.1rem!important}.m10,.mx10,.ml10{margin-left:0.1rem!important}.m10,.mx10,.mr10{margin-right:0.1rem!important}.m20,.mt20,.my20{margin-top:0.2rem!important}.m20,.mb20,.my20{margin-bottom:0.2rem!important}.m20,.mx20,.ml20{margin-left:0.2rem!important}.m20,.mx20,.mr20{margin-right:0.2rem!important}.m30,.mt30,.my30{margin-top:0.3rem!important}.m30,.mb30,.my30{margin-bottom:0.3rem!important}.m30,.mx30,.ml30{margin-left:0.3rem!important}.m30,.mx30,.mr30{margin-right:0.3rem!important}.m40,.mt40,.my40{margin-top:0.4rem!important}.m40,.mb40,.my40{margin-bottom:0.4rem!important}.m40,.mx40,.ml40{margin-left:0.4rem!important}.m40,.mx40,.mr40{margin-right:0.4rem!important}.p0,.pt0,.py0{padding-top:0!important}.p0,.pb0,.py0{padding-bottom:0!important}.p0,.px0,.pl0{padding-left:0!important}.p0,.px0,.pr0{padding-right:0!important}.p10,.pt10,.py10{padding-top:0.1rem!important}.p10,.pb10,.py10{padding-bottom:0.1rem!important}.p10,.px10,.pl10{padding-left:0.1rem!important}.p10,.px10,.pr10{padding-right:0.1rem!important}.p20,.pt20,.py20{padding-top:0.2rem!important}.p20,.pb20,.py20{padding-bottom:0.2rem!important}.p20,.px20,.pl20{padding-left:0.2rem!important}.p20,.px20,.pr20{padding-right:0.2rem!important}.p30,.pt30,.py30{padding-top:0.3rem!important}.p30,.pb30,.py30{padding-bottom:0.3rem!important}.p30,.px30,.pl30{padding-left:0.3rem!important}.p30,.px30,.pr30{padding-right:0.3rem!important}.p40,.pt40,.py40{padding-top:0.4rem!important}.p40,.pb40,.py40{padding-bottom:0.4rem!important}.p40,.px40,.pl40{padding-left:0.4rem!important}.p40,.px40,.pr40{padding-right:0.4rem!important}.m25,.mt25,.my25{margin-top:0.25rem!important}.m25,.mb25,.my25{margin-bottom:0.25rem!important}.m25,.mx25,.ml25{margin-left:0.25rem!important}.m25,.mx25,.mr25{margin-right:0.25rem!important}.p25,.pt25,.py25{padding-top:0.25rem!important}.p25,.pb25,.py25{padding-bottom:0.25rem!important}.p25,.px25,.pl25{padding-left:0.25rem!important}.p25,.px25,.pr25{padding-right:0.25rem!important}

/*-------------------------结束公用样式--------------------------*/
body{background-color: var(--page-bg);}


.line-caret,
.solid-caret,
.l-line-caret{position: relative; display: inline-block; width: 0.75em; height: 1em; font-size: 0.4rem; color: var(--c3); vertical-align: top; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.line-caret::before{position: absolute; top: 50%; left: 50%; display: block; content: ""; width: 0.32em; height: 0.32em; -webkit-box-sizing: border-box; box-sizing: border-box; border-width: 0.03rem 0.03rem 0 0; border-style: solid; border-color: currentColor;}
.right.line-caret::before{-webkit-transform: translate(-75%,-50%) rotate(45deg); transform: translate(-75%,-50%) rotate(45deg);}
.down.line-caret::before{-webkit-transform: translate(-50%,-75%) rotate(135deg); transform: translate(-50%,-75%) rotate(135deg);}
.solid-caret::before{position: absolute; top: 50%; left: 50%; display: block; content: ""; width: 0.4em; height: 0.4em; -webkit-box-sizing: border-box; box-sizing: border-box; border: 0.2em solid var(--white-0); border-top-color: currentColor;}
.down.solid-caret::before{-webkit-transform: translate(-50%,-25%); transform: translate(-50%,-25%);}

.l-line-caret::before,
.l-line-caret::after{position: absolute; top: 50%; display: block; content: ""; width: 56%; height: 0.04rem; line-height: 0; background-color: currentColor; border-radius: 0.02rem; -webkit-transform-origin: 0 50%; transform-origin: 0 50%;}
.left.l-line-caret::before{left: 25%; margin-top: -0.025rem; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.left.l-line-caret::after{left: 25%; margin-top: -0.04rem; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.right.l-line-caret::before{left: 75%; margin-top: -0.025rem; -webkit-transform: rotate(-135deg); transform: rotate(-135deg);}
.right.l-line-caret::after{left: 75%; margin-top: -0.04rem; -webkit-transform: rotate(135deg); transform: rotate(135deg);}



[class*="btn"]:not(:disabled):not(.disabled):active [class*="ico"],
[class*="button"]:not(:disabled):not(.disabled):active [class*="ico"],
[class*="btn"]:not(:disabled):not(.disabled):active [class*="caret"],
[class*="button"]:not(:disabled):not(.disabled):active [class*="caret"]{opacity: 0.6;}





.sxico,
.sico,
.mico{display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-position-x: 0; vertical-align: -0.15em;}

.sxico{margin-right: 0.06rem; font-size: var(--sxico-size); background-image: var(--sxico-image); background-size: var(--sxico-bgsize);}
.gray-collect.sxico{background-position-y: 0;}
.gray-agree.sxico{background-position-y: -1em;}


.sico{margin-right: 0.1rem; font-size: var(--sico-size); background-image: var(--sico-image); background-size: var(--sico-bgsize);}
.search.sico{background-position-y: 0;}





/*--全局顶部--*/
.gn-nav{position: relative; z-index: 13; width: 100%; height: var(--gn-nav-height); line-height: 0.4rem; font-size: 0.28rem; color: var(--text-color); background: var(--bg-color2);}
.gn-nav--main{padding-left: 20%; padding-right: 20%; position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-align: center; height: var(--gn-nav-height); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gn-nav--title{font-size: 0.52rem;}
.gn-nav--l,
.gn-nav--r{position: absolute; top: 0; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: var(--gn-nav-height);}
.gn-nav--l{left: 0;}
.gn-nav--r{right: 0;}

.gn-nav--button{position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; padding: 1px; width: 0.8rem; height: 0.8rem; font-size: 0.28rem; color: currentColor; background-color: rgba(255,255,255,0.8); border: 0.7px solid var(--text-color); border-radius: 50%;}
.gn-nav--button:active{background-color: var(--white-active);}
.gn-nav--l .gn-nav--button{margin-left: 0.4rem;}
.gn-nav--r .gn-nav--button{margin-right: 0.4rem;}


.gnico{display: block; width: 1em; height: 1em; font-size: var(--gnico-size); background-image: var(--gnico-image); background-size: var(--gnico-bgsize); background-repeat: no-repeat; background-position-x: 0;}
.back.gnico{background-position-y: 0;}


.gn-header{position: relative; z-index: 13; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding-left: 0.2rem; padding-right: 0.2rem; width: 100%; height: var(--gn-header-height); line-height: 0.4rem; font-size: 0.28rem; color: var(--c3); background-color: var(--bg-color1); border: var(--bd-2);}
.gn-header--main{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-flex: 1; flex: 1; min-width: 0; padding-left: 0.2rem; padding-right: 0.2rem; height: var(--gn-header-height); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gn-header--logo{display: block;}
.gn-header--logo-image{display: block; height: 1.1rem; object-fit: contain;}

.gn-header--button{position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; padding: 1px 0.2rem; min-width: 0.8rem; height: var(--gn-header-height); font-size: 0.28rem; color: currentColor;}
.gn-header--button:active{background-color: var(--bg-active);}

.hico{display: block; width: 1em; height: 1em; font-size: var(--hico-size); background-image: var(--hico-image); background-size: var(--hico-bgsize); background-repeat: no-repeat; background-position-x: 0;}
.gn-header--button .back-caret{color: currentColor;}
.profile.hico{background-position-y: 0;}



.t1-search{display: block; width: 5.5rem;}
.t1-search--form{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.t1-search--group{position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: 1rem; border: 0.03rem solid var(--gn-color); border-radius: 0.5rem;}
.t1-search--group-input,
.t1-search--group-button{background-color: var(--white-0); border: none; border-radius: 0; outline: 0; box-shadow: none; -webkit-appearance: none; appearance: none;}
.t1-search--group-button{position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: 1px 0.3rem; height: 100%; line-height: 1.2;}
.t1-search--group-input{-webkit-box-flex: 1; flex: 1; min-width: 0; padding-left: 0.5rem; height: 0.9rem; line-height: 0.5rem; font-size: 0.32rem; color: var(--gn-color); font-weight: 300; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.t1-search--group-input::-webkit-input-placeholder{color: var(--gn-color);}
.t1-search--group-input:focus::-webkit-input-placeholder{color: #999;}
.t1-search--group-input::-moz-placeholder{color: var(--gn-color);}
.t1-search--group-input:-ms-input-placeholder{color: var(--gn-color);}




.menuico{position: relative; display: inline-block; width: 1em; height: 1em; font-size: 0.5rem; vertical-align: top;}
.menuico-line{position: absolute; top: 50%; left: 50%; margin: -0.5em 0 0 -0.5em; width: 1em; height: 1em; -webkit-transition: transform 0.1806s cubic-bezier(0.04, 0.04, 0.12, 0.96), -webkit-transform 0.1806s cubic-bezier(0.04, 0.04, 0.12, 0.96); transition: transform 0.1806s cubic-bezier(0.04, 0.04, 0.12, 0.96), -webkit-transform 0.1806s cubic-bezier(0.04, 0.04, 0.12, 0.96);}
.menuico-line::before{position: absolute; top: 50%; left: 5%; content: ""; width: 90%; height: 0.06rem; line-height: 0; font-size: 0; background-color: currentColor; border-radius: 0.03rem;}
.menuico-line:nth-of-type(1):before{transform: translateY(calc(0px - 50% - 0.16rem));}
.menuico-line:nth-of-type(2):before{transform: translateY(-50%);}
.menuico-line:nth-of-type(3):before{transform: translateY(calc(0px - 50% + 0.16rem));}

.t1-nav{
    margin-top:10px;
  --front-height: 0.7rem;
  position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: var(--front-height); background-color: var(--bg-color1);}
.t1-nav--front{-webkit-box-flex: 1; flex: 1; min-width: 0; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}
.t1-nav--front-list{margin-bottom: -0.1rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; padding: 0 0.4rem 0.1rem; height: calc(var(--front-height) + 0.1rem); overflow-y: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;}
.t1-nav--front-item{margin-left: 0.2rem; margin-right: 0.2rem; display: block; -webkit-box-flex: none; flex: none; min-width: 0; padding: 0.03rem 0 0; line-height: 0.4rem; font-size: 0.46rem; color: var(--c3-0); border-bottom: 0.03rem solid var(--white-0);}
.t1-nav--front-item:visited{color: var(--c3-0);}
.t1-nav--front-item:active{color: var(--c3-0-active);}
.on.t1-nav--front-item{color: var(--primary); border-bottom-color: var(--primary);}
.t1-nav--menu-button{margin-left: 0.2rem; margin-right: 0.4rem; position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; padding: 1px 0.2rem; height: var(--front-height);}
.t1-nav--back{position: absolute; top: 0; right: 0; display: none; width: 5rem; background-color: rgba(255,255,255,0.9); border-width: 0.7px 0 0.7px 0.7px; border-style: solid; border-color: #dfdfdf; border-radius: 0.3rem 0 0 0.3rem; overflow: hidden; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fade-in-left; animation-name: fade-in-left;}
.show.t1-nav{z-index: 99;}
.show.t1-nav .t1-nav--back{display: block;}
.t1-nav--back-item{
    display: block; 
    text-align: center; 
    padding: 0.2rem 0.2rem; 
    /*height: 1.7rem;*/ 
    /*line-height: 1;*/ 
    font-size: 0.5rem; color: var(--c3-0);}
.t1-nav--back-item:not(:last-child){border-bottom: var(--bd);}
.t1-nav--back-item:visited{color: var(--c3-0);}
.t1-nav--back-item:active,
.on.t1-nav--back-item{color: var(--white); background-color: var(--primary); border-bottom-color: var(--primary);}
.t-2.t1-nav--back-item{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; overflow: hidden; padding-top: 0.2rem; font-size: 0.5rem;}


@-webkit-keyframes fade-in-left{from{-webkit-transform:translate3d(100%,0,0);opacity:.3}to{-webkit-transform:translate3d(0,0,0);opacity:1}}@keyframes fade-in-left{from{transform:translate3d(100%,0,0);opacity:.3}to{transform:translate3d(0,0,0);opacity:1}}






.main{padding: 0.1px 0.4rem;}
.t1-section{margin-top: 0.4rem; margin-bottom: 0.4rem;}
.box-head{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: 1px 0.1rem; height: 1.4rem; background-color: var(--bg-color2);}
.t2-box-head{margin-top: 0.2rem; margin-bottom: 0.2rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; min-height: 0.5rem;}
.t3-box-head{display: -webkit-box; display: flex; -webkit-box-align: end; align-items: flex-end; padding-left: 0.1rem; padding-right: 0.1rem; padding-bottom: 0.25rem; border-bottom: var(--bd);}
.box-head--title-1{margin-left: 0.5rem; line-height: 1; font-size: 0.48rem; color: var(--primary); font-weight: 600;}
.box-head--title-2{line-height: 1; font-size: 0.48rem; color: #5e5e5e; font-weight: 600;}
.box-head--title-3{line-height: 1; font-size: 0.4rem; color: var(--c3-0); font-weight: 600;}

.box-head--button{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: 1px 0.35rem; height: 1rem; line-height: 1.2; font-size: 0.3rem; color: var(--text-color);}
.box-head--button:visited{color: var(--text-color);}
.box-head--button:active{color: var(--text-color-active);}
.box-head--arrow{margin-right: 0.25rem; display: block; width: 0.1rem; height: 0.6rem; line-height: 0; font-size: 0; background-color: var(--primary);}
.box-head--nav{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.box-head--nav-item{display: block; padding: 0 0.2rem; height: 0.4rem; line-height: 0.4rem; font-size: 0.32rem; color: var(--text-color); font-weight: lighter;}
.box-head--nav-item:not(:first-of-type){border-left: 0.7px solid #d7d7d7;}
.box-head--nav-item:visited{color: var(--text-color);}
.box-head--nav-item:active{color: var(--text-color-active);}

.x1-breadcrumb{display: -webkit-box; display: flex; padding-bottom: 0.25rem; line-height: 0.4rem; font-size: 0.4rem; color: var(--text-color); font-weight: 300; border-bottom: var(--bd);}
.x1-breadcrumb--dt{margin-right: 0.1rem;}
.x1-breadcrumb--dd{display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 1; flex: 1; min-width: 0;}
.x1-breadcrumb--item{margin-right: 0.1rem; color: var(--text-color);}
.x1-breadcrumb--item:visited{color: var(--text-color);}
.x1-breadcrumb--item:active{color: var(--text-color-active);}


.m1-box{margin-top: 0.4rem; margin-bottom: 0.4rem; display: block; background-color: var(--white); box-shadow: 0 0 0 0.7px #dfdfdf inset, 0 0.05rem 0.05rem rgba(48,48,48,0.04); border-radius: 0.1rem;}

.x2-tab{display: -webkit-box; display: flex; background-color: var(--bg-color2);}
.x2-tab--item{display: block; -webkit-box-flex: 1; flex: 1; min-width: 0; text-align: center; padding: 0.4rem 0.2rem; height: 1.4rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 0.6rem; font-size: 0.4rem; color: var(--c3-0); font-weight: 600;}
.x2-tab--item:visited{color: var(--c3-0);}
.x2-tab--item:active,
.on.x2-tab--item{color: var(--white); background-color: var(--primary);}
.on.x2-tab--item{font-size: 0.48rem;}



.glide{position:relative;width:100%;box-sizing:border-box}.glide *{box-sizing:inherit}.glide__track{overflow:hidden}.glide__slides{position:relative;width:100%;list-style:none;backface-visibility:hidden;transform-style:preserve-3d;touch-action:pan-Y;overflow:hidden;margin:0;padding:0;white-space:nowrap;display:flex;flex-wrap:nowrap;will-change:transform}.glide__slides--dragging{user-select:none}.glide__slide{width:100%;height:100%;flex-shrink:0;white-space:normal;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.glide__slide a{user-select:none;-webkit-user-drag:none;-moz-user-select:none;-ms-user-select:none}.glide__arrows{-webkit-touch-callout:none;user-select:none}.glide__bullets{-webkit-touch-callout:none;user-select:none}.glide--rtl{direction:rtl}



.t1-slide{position: relative; display: block; overflow: hidden;}
.t1-slide--arrows{position: absolute; z-index: 5; top: 0; left: 0; right: 0;}
.t1-slide--arrow,
.t1-slide--photo{padding-bottom: 44.75%;}
.t1-slide--arrow{position: absolute; padding-top: 0; width: 1.6rem; background-color: var(--white-0); border: none; border-radius: 0; outline: 0; box-shadow: none; -webkit-appearance: none; appearance: none;}
.t1-slide--arrow:active{background-color: rgba(0,0,0,0.1);}
.glide__arrow--left.t1-slide--arrow{left: 0;}
.glide__arrow--right.t1-slide--arrow{right: 0;}
.t1-slide--arrow-caret{position: absolute; top: 50%; left: 50%; margin-top: -0.5em; margin-left: -0.5em; display: block; width: 1em; font-size: 0.7rem; color: var(--white); -webkit-transform: scale(2); transform: scale(2);}
.t1-slide--produce{display: block;}
.t1-slide--photo{position: relative;}
.t1-slide--content{display: block; padding: 0.4rem 0.3rem;}

.d1-photo{position: relative; display: block; background-color: var(--c3-0);}
.d1-photo--image{display: block; width: 100%;}
.d1-photo:active .d1-photo--image{opacity: 0.6;}


.x1-news--item{display: -webkit-box; display: flex;}
.x1-news--sign{margin-right: 0.6rem; display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-box-align: center; align-items: center;  -webkit-justify-content: center; justify-content: center; text-align: center; padding: 1px; width: 1.2rem; height: 1.2rem; line-height: 1; font-size: 0.5rem; color: var(--white); font-weight: 600; text-shadow: 0 0.09rem 0.04rem rgba(203,37,37,0.79); background-color: #db4646; border-radius: 0.1rem;}
.x1-news--main{-webkit-box-flex: 1; flex: 1; min-width: 0; padding-top: 0.1rem;}
.x1-news--title,
.x1-news--text{display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.x1-news--title{margin-bottom: 0.1rem; line-height: 0.5rem; font-size: 0.44rem; color: #282828;}
.x1-news--text,
.x1-news--more{line-height: 0.4rem; font-size: 0.3rem; color: var(--text-color);}
.x1-news--more{text-align: right;}


.x1-hotkey{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: 1rem; line-height: 0.5rem; border-top: var(--bd); border-bottom: var(--bd);}
.x1-hotkey--dt{padding-left: 0.15rem; padding-right: 0.15rem; font-size: 0.42rem; color: var(--c3-0); font-weight: 600;}
.x1-hotkey--dd{-webkit-box-flex: 1; flex: 1; min-width: 0; overflow: hidden;}
.x1-hotkey--list{margin-bottom: -0.1rem; display: -webkit-box; display: flex; padding-bottom: 0.1rem; overflow-y: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;}
.x1-hotkey--item{display: block; padding-left: 0.28rem; -webkit-box-flex: none; flex: none; min-width: 0; font-size: 0.28rem; color: var(--text-color);}
.x1-hotkey--item:visited{color: var(--text-color);}
.x1-hotkey--item:active{color: var(--text-color-active);}
.s-2.x1-hotkey{height: 1.7rem;}

.r1-share{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; font-size: 0.32rem; color: var(--text-color);}
.r1-share--item{margin-left: 0.1rem; display: block; padding: 0.05rem; height: 0.5rem;}
.r1-share--item:active{opacity: 0.6;}
.r1-share--image{display: block; height: 0.4rem;}



.t1-contact{margin-bottom: 0.3rem;}
.t1-contact--item{margin-top: 0.2rem; padding-left: 0.6rem; padding-bottom: 0.2rem; line-height: 0.4rem; font-size: 0.28rem; color: var(--c3-0); border-bottom: var(--bd);}
.t1-contact--item:last-child{margin-bottom: 0.2rem; padding-bottom: 0; border-bottom: none;}
.t1-contact--title{margin-bottom: 0.2rem; font-weight: 600;line-height:0.6rem;}
.t1-contact--contacter{display: -webkit-box; display: flex;}
.t1-contact--contacter-name{margin-right: 0.1rem;line-height:0.6rem; font-size: 0.32rem; font-weight: 600;}
.t1-contact--contacter-dd{margin-left: -0.3rem;line-height:0.6rem; position: relative; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 1; flex: 1; min-width: 0; font-weight: 300;}
.t1-contact--contacter-dd>.itm{margin-left: 0.3rem;}
.t1-contact--contacter-dd>.full.itm{width: 100%;line-height:0.6rem;}


.t2-contact--item{margin-bottom: 0.1rem;}
.t2-contact--title{font-weight: 600;}
.t2-contact--contacter{margin-left: -0.5rem; position: relative; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.t2-contact--contacter>.itm{margin-left: 0.5rem;}


.t1-news--item{margin-top: 0.3rem; display: block;}
.t1-news--produce{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: 0.5rem;}
.t1-news--produce:active{opacity: 0.6;}
.t1-news--produce::before{margin-right: 0.28rem; display: block; content: ""; width: 0.15rem; height: 0.15rem; line-height: 0; font-size: 0; background-color: var(--text-color); border-radius: 50%;}
.t1-news--title{-webkit-box-flex: 1; flex: 1; min-width: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 0.5rem; font-size: 0.4006rem; color: var(--text-color);}



.t2-news--item{margin-top: 0.4rem; margin-bottom: 0.4rem;}
.t2-news--produce{display: -webkit-box; display: flex;}
.t2-news--produce:active{opacity: 0.6;}
.t2-news--photo{margin-right: 0.6rem; position: relative; display: block; width: 4.27rem; height: 2.52rem;}
.t2-news--main{display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-flex: 1; flex: 1; min-width: 0; padding-top: 0.08rem;}
.t2-news--title,
.t2-news--title-2{display: -webkit-box; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; line-height: 0.6rem; font-size: 0.48rem; color: var(--text-color); font-weight: 600;}
.t2-news--title{-webkit-line-clamp: 3; max-height: 1.8rem;}
.t2-news--title-2{-webkit-line-clamp: 2; max-height: 1.2rem;}
.t2-news--date{line-height: 0.4rem; font-size: 0.36rem; color: var(--text-color); font-weight: 300;}
.t2-news--text{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; overflow: hidden; max-height: 1rem; line-height: 0.5rem; font-size: 0.28rem; color: var(--text-color); font-weight: 300;}

.t2-news--line-list{
  --border: 0.7px solid #919191;
  margin-top: 0.4rem; margin-bottom: 0.4rem; border-top: var(--border); border-bottom: var(--border);}
.t2-news--line-list .t2-news--item{margin-top: 0.3rem; margin-bottom: 0; padding-bottom: 0.3rem; border-bottom: var(--border);}
.t2-news--line-list .t2-news--item:last-child{margin-bottom: 0.3rem; padding-bottom: 0; border-bottom: none;}

.t3-news--item{margin-top: 0.3rem; padding-bottom: 0.3rem; border-bottom: var(--bd);}
.t3-news--item:last-child{margin-bottom: 0.3rem; padding-bottom: 0; border-bottom: none;}
.t3-news--produce{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.t3-news--produce:active{opacity: 0.6;}
.t3-news--produce::before{margin-right: 0.45rem; margin-top: 0.39rem; -webkit-align-self: flex-start; align-self: flex-start; display: block; content: ""; width: 0.12rem; height: 0.12rem; line-height: 0; font-size: 0; background-color: var(--text-color); border-radius: 50%;}
.t3-news--main{display: block; -webkit-box-flex: 1; flex: 1; min-width: 0;}
.t3-news--title{margin-bottom: 0.1rem; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; height: 0.5rem; line-height: 0.5rem; font-size: 0.4rem; color: var(--text-color);}
.t3-news--info{line-height: 0.4rem; font-size: 0.28rem; color: var(--text-color); font-weight: 300;}
.t3-news--photo{margin-left: 0.65rem; position: relative; display: block; width: 2.6rem; height: 1.3rem;}

.t4-news--item{margin-top: 0.3rem; padding-bottom: 0.3rem; border-bottom: var(--bd);}
.t4-news--item:last-child{margin-bottom: 0.3rem; padding-bottom: 0; border-bottom: none;}
.t4-news--produce{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding-left: 0.1rem;}
.t4-news--produce:active{opacity: 0.6;}
.t4-news--main{display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-flex: 1; flex: 1; min-width: 0;}
.t4-news--title{margin-bottom: 0.1rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; overflow: hidden; max-height: 1rem; line-height: 0.5rem; font-size: 0.4rem; color: var(--text-color);}
.t4-news--info{line-height: 0.4rem; font-size: 0.28rem; color: var(--text-color); font-weight: 300;}
.t4-news--photo{margin-left: 1.8rem; position: relative; display: block; width: 3rem; height: 1.3rem;}


.l3-photo{margin-top: 0.25rem; margin-bottom: 0.25rem; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.l3-photo--item{margin-top: 0.2rem; display: block; width: calc((100% - 0.4rem)/3);}
.l3-photo--item:not(:nth-of-type(3n)){margin-right: 0.2rem;}
.l3-photo--item:nth-of-type(1),
.l3-photo--item:nth-of-type(2),
.l3-photo--item:nth-of-type(3){margin-top: 0;}
.l3-photo--produce{position: relative; display: block; padding-bottom: 45.3333%; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden; -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%;}
.l3-photo--produce:active{-webkit-transform: perspective(10rem) rotateX(8deg); transform: perspective(10rem) rotateX(8deg);}


.g4-video{margin-top: 0.2rem; margin-bottom: 0.2rem; display: -webkit-box; display: flex;}
.g4-video--col-1{position: relative; -webkit-box-flex: 1; flex: 1; min-width: 0; display: block;}
.g4-video--col-2{margin-left: 0.2rem; width: 3.75rem;display: flex; flex-direction:column;justify-content:space-between; }
.g4-video--item{position: relative; display: block; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}
.g4-video--col-1 .g4-video--item{position: relative; height: 100%;flex:1;}
.g4-video--col-2 .g4-video--item{height: 1.6rem;}
.g4-video--col-2 .g4-video--item:not(:first-of-type){margin-top: 0.2rem;}
.g4-video--item-video{position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: contain;}
.g4-video--cover{position: absolute; z-index: 2; top: 0; left: 0; display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-box-align: center; align-items: center;  -webkit-justify-content: center; justify-content: center; width: 100%; height: 100%; 
  /* pointer-events: none; */
}
.g4-video--play-button{display: block; width: 1em; height: 1em; font-size: 1rem; background-image: url(../images/common/black-play.png); background-size: cover;}
.g4-video--col-2 .g4-video--play-button{font-size: 0.6rem;}
.g4-video--item-title{position: absolute; z-index: 3; bottom: 0; left: 0; right: 0; padding: 0.1rem 0.25rem; height: 0.8rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 0.6rem; font-size: 0.4rem; color: var(--white); background-color: rgba(0,0,0,0.35);}
.g4-video--item-title:visited{color: var(--white-active);}
.playing.g4-video--item .g4-video--item-video{z-index: 5;}
.playing.g4-video--item .g4-video--cover,
.playing.g4-video--item .g4-video--item-title{opacity: 0;}

.t3-supply{margin-top: 0.25rem; margin-bottom: 0.25rem; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.t3-supply--item{margin-top: 0.25rem; display: block; width: calc((100% - 0.5rem)/3);}
.t3-supply--item:not(:nth-of-type(3n)){margin-right: 0.25rem;}
.t3-supply--item:nth-of-type(1),
.t3-supply--item:nth-of-type(2),
.t3-supply--item:nth-of-type(3){margin-top: 0;}
.t3-supply--produce{display: block; border: var(--bd); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden; -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%;}
.t3-supply--produce:active{-webkit-transform: perspective(10rem) rotateX(5deg); transform: perspective(10rem) rotateX(5deg);}
.t3-supply--photo{position: relative; display: block; padding-bottom: 100%; background-color: #f8f8f8;}
.t3-supply--main{display: block; text-align: center; padding: 0.25rem 0.25rem 1px; height: 1.6rem; line-height: 0.4rem; color: var(--text-color);}
.t3-supply--name,
.t3-supply--text{white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.t3-supply--name{font-size: 0.32rem;line-height: 0.6rem;}
.t3-supply--text{font-size: 0.28rem; font-weight: 300;}

.t2-text-enter{margin-top: 0.4rem; margin-bottom: 0.4rem; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.t2-text-enter--item{display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; padding: 0.5rem 0.4rem; min-height: 2rem; line-height: 1rem; font-size: 0.6rem; color: var(--white); font-weight: 600; background-color: #5d9cf8; border-radius: 0.1rem; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden; -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%;}
.t2-text-enter--item:active{-webkit-transform: perspective(10rem) rotateX(5deg); transform: perspective(10rem) rotateX(5deg);}
.t2-text-enter--item:nth-of-type(even){margin-left: 0.2rem;}
.t2-text-enter--item:visited{color: var(--white);}
.t2-text-enter--item-1{-webkit-box-flex: 1; flex: 1; min-width: 0; font-size: 0.4675rem; color: #ffce64; background-color: #d83838;}
.t2-text-enter--item-1:visited{color: #ffce64;}
.t2-text-enter--item-2{width: 4.3rem; font-style: italic;}

.d1-art{margin-top: 0.6rem; margin-bottom: 0.6rem;}
.d1-art--head{margin-bottom: 0.4rem;}
.d1-art--head-title{margin-bottom: 0.5rem; text-align: center; line-height: 1.3; font-size: 0.48rem; color: var(--c3-0); font-weight: 600;}
.d1-art--head-info{display: -webkit-box; display: flex; line-height: 0.4rem; font-size: 0.28rem; color: var(--c3-0); font-weight: lighter;}
.d1-art--head-info .itm{margin-right: 0.15rem;}
.d1-art--head-count{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.d1-art--head-button{margin-left: 0.25rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; color: var(--text-color);}
.d1-art--head-button:active{color: var(--text-color-active);}

.d1-art--berif{margin-bottom: 0.4rem; display: block; padding: 0.45rem 0.25rem; line-height: 0.5rem; font-size: 0.32rem; color: var(--text-color); background-color: #e2e2e2;}
.d1-art--berif>.dt{font-size: 0.36rem; font-weight: 600;}

.d1-art--main-points{margin-top: 0.7rem; margin-bottom: 0.7rem; display: block; padding-right: 30%;}
.d1-art--main-points-item{line-height: 1.8; font-size: 0.32rem; color: var(--c3-0); font-weight: 300;}

.d1-art--contents{
    padding: 0.7rem 0;
}

.d1-art--contents img{
    width:100%;
    height: auto;
}

.d1-art--details{margin-bottom: 0.7rem;}
.d1-art--details-item{margin-bottom: 0.15rem; line-height: 1.8; font-size: 0.32rem; color: var(--text-color);}
.d1-art--details-item-dt{font-weight: 600;}
.d1-art--details-item-dd{padding-left: 2em; font-weight: 300;}
.x.d1-art--details-item{display: -webkit-box; display: flex;}
.x.d1-art--details-item .d1-art--details-item-dd{padding-left: 0;}

.qrcode-330{position: relative; display: inline-block; width: 3.3rem; height: 3.3rem; vertical-align: bottom; overflow: hidden;}


.t1-textarea--box{display: block; border: 0.7px solid #ccc;}
.t1-textarea--wrap{padding: 0.2rem;}
.t1-textarea{display: block; width: 100%; min-height: 2rem; line-height: 0.5rem; font-size: 0.36rem; color: var(--text-color); background-color: var(--white-0); border: none; border-radius: 0; outline: 0; box-shadow: none; -webkit-appearance: none; appearance: none;}
.t1-textarea--action{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: end; justify-content: flex-end; padding: 0.1rem; min-height: 0.8rem; background-color: #e2e2e2;}

.l1-comment--item{margin-top: 0.4rem; display: -webkit-box; display: flex; padding-bottom: 0.4rem; border-bottom: var(--bd);}
.l1-comment--avator{margin-right: 0.5rem; position: relative; display: block; width: 1.3rem; height: 1.3rem; background-color: #dfdfdf; border-radius: 50%; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}
.l1-comment--main{-webkit-box-flex: 1; flex: 1; min-width: 0; padding-top: 0.1rem;}
.l1-comment--info{margin-bottom: 0.3rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; line-height: 0.4rem; font-size: 0.3rem; color: var(--text-color);}
.l1-comment--info .name{font-size: 0.32rem;}
.l1-comment--info .spc{margin-left: 0.15rem; margin-right: 0.15rem; font-size: 0.32rem; font-weight: 600;}
.l1-comment--info .time{font-weight: lighter;}
.l1-comment--text{line-height: 0.5rem; font-size: 0.32rem; color: var(--text-color);}











.t1-page--row{margin-top: 0.3rem; margin-bottom: 0.3rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; line-height: 0.4rem; font-size: 0.32rem; color: var(--c3-0);}
.t1-page--row a{
    margin: 0 0.15rem;
    color:#4376bb;
}
.t1-page--button{margin-left: 0.04rem; margin-right: 0.04rem; margin-top: 0.04rem; display: block; text-align: center; padding: 0.1rem 0.15rem; min-width: 1.28rem; height: 0.6rem; line-height: 0.4rem; font-size: 0.32rem; color: var(--c3-0); background-color: #f4f4f5; border-radius: 0.04rem; border: none; outline: 0; box-shadow: none; -webkit-appearance: none; appearance: none;}
.t1-page--button:visited{color: var(--c3-0);}
.t1-page--button:not(.disabled):not(:disabled):active,
.on.t1-page--button{color: var(--white); background-color: var(--primary);}
.prev.t1-page--button{margin-right: 0.3rem;}
.next.t1-page--button{margin-left: 0.3rem;}
.t1-page--go{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.t1-page--input{margin-left: 0.2rem; margin-right: 0.2rem; display: block; text-align: center; padding: 0.09rem 0.09rem; width: 0.9rem; height: 0.5rem; line-height: 0.4rem; font-size: 0.32rem; color: var(--c3-0); background-color: var(--white); border: var(--bd); border-radius: 0.04rem; outline: 0; box-shadow: none; -webkit-appearance: none; appearance: none; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}



/*bottom*/
.bottom-wrap,
.bottom-bar{height: var(--bottom-bar-height); height: calc(var(--bottom-bar-height) + constant(safe-area-inset-bottom)); height: calc(var(--bottom-bar-height) + env(safe-area-inset-bottom));}
.padding-bottom-safe-area .bottom-wrap{height: var(--bottom-bar-height);}
.bottom-wrap{display: block;}
.bottom-wrap-container{position: fixed; bottom: 0; left: 0; right: 0; z-index: 13;}

.bottom-bar{position: fixed; z-index: 13; bottom: 0; left: 0; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding-bottom: calc(0px + constant(safe-area-inset-bottom)); padding-bottom: calc(0px + env(safe-area-inset-bottom)); width: 100%; font-size: 0.36rem; color: var(--c3-0); background-color: var(--bg-color2);}

.bottom-bar--item{position: relative; display: block; -webkit-box-flex: 1; flex: 1; min-width: 0; text-align: center; padding-top: 0.2rem; height: var(--bottom-bar-height); color: currentColor;}
.bottom-bar--item::before{margin: 0 auto 0.04rem; display: block; content: ""; width: 1em; height: 1em; font-size: 0.8rem; background-image: url(../images/common/bottom-bar.png); background-repeat: no-repeat; background-size: 2em auto; background-position-x: 0;}
.on.bottom-bar--item::before{background-position-x: -1em;}
.bottom-bar--item:visited{color: currentColor;}
.bottom-bar--item:active{background-color: var(--bg-active);}
.on.bottom-bar--item{color: var(--primary); -webkit-animation: tabbar .15s linear; animation: tabbar .15s linear;}
@-webkit-keyframes tabbar{0%{-webkit-transform: scale(.5);}to{-webkit-transform: scale(1);}}
@keyframes tabbar{0%{transform: scale(.5);}to{transform: scale(1);}}
.home.bottom-bar--item::before{background-position-y: 0;}
.channel.bottom-bar--item::before{background-position-y: -1em;}
.contact.bottom-bar--item::before{background-position-y: -2em;}
.profile.bottom-bar--item::before{background-position-y: -3em;}






/*btn*/

.large-button,
.middle-s-button,
.small-x-button{
    -webkit-align-items: center; 
    align-items: center; 
    -webkit-justify-content: center; 
    justify-content: center; 
    text-align: center; 
    /*line-height: 1.1;*/ 
    border-radius: 0.1rem; border: none; outline: 0; -webkit-appearance: none; appearance: none; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s;}

.large-button{display: -webkit-box; display: flex;}
.middle-s-button,
.small-x-button{display: -webkit-inline-flex; display: inline-flex;}

.large-button{padding: 0.2rem; width: 100%; height: 0.9rem; font-size: 0.3rem;}
.radius.large-button{padding-left: 0.5rem; padding-right: 0.5rem; border-radius: 0.45rem;}
.middle-s-button{padding: 1px 0.2rem; height: 0.6rem; font-size: 0.38rem;}
.radius.middle-s-button{border-radius: 0.3rem;}
.small-x-button{padding: 1px 0.25rem; height: 0.6rem; font-size: 0.3rem;}
.radius.small-x-button{border-radius: 0.3rem;}


.primary-button:not(.plain){color: var(--white); background-color: var(--primary);}
.primary-button:not(.plain):visited{color: var(--white);}
.primary-button:not(.plain):not(:disabled):active{color: var(--white-active); background-color: var(--primary-active);}
.plain.primary-button{color: var(--c8); background-color: var(--white-0); border: 0.01rem solid var(--c8);}
.plain.primary-button:visited{color: var(--c8);}
.plain.primary-button:not(:disabled):active{color: var(--c8-active); background-color: var(--bg-active);}





/* maring\padding */
.padding-bottom-safe-area{padding-bottom: calc(0px + constant(safe-area-inset-bottom)); padding-bottom: calc(0px + env(safe-area-inset-bottom));}
.padding-bottom-safe-area-1{padding-bottom: calc(0.1px + constant(safe-area-inset-bottom)); padding-bottom: calc(0.1px + env(safe-area-inset-bottom));}



.my90, .mt90{margin-top: 0.9rem!important;}
.my90, .mb90{margin-bottom: 0.9rem!important;}
.my80, .mt80{margin-top: 0.8rem!important;}
.my80, .mb80{margin-bottom: 0.8rem!important;}
.my60, .mt60{margin-top: 0.6rem!important;}
.my60, .mb60{margin-bottom: 0.6rem!important;}
.my50, .mt50{margin-top: 0.5rem!important;}
.my50, .mb50{margin-bottom: 0.5rem!important;}
.mx50, .ml50{margin-left: 0.5rem!important;}
.mx50, .mr50{margin-right: 0.5rem!important;}
.px50, .pt50{padding-left: 0.5rem!important;}
.px50, .pb50{padding-right: 0.5rem!important;}
.mt25{margin-top: 0.25rem!important;}


/*font*/
.fz36{font-size: 0.36rem;}
.fz44{font-size: 0.44rem;}

/*color*/
.default-color, .default-color:visited{color: var(--text-color);}
.default-color:active{color: var(--text-color-active);}
.white-color, .white-color:visited{color: var(--white);}
.white-color:active{color: var(--white-active);}
.black-color, .black-color:visited{color: var(--c3-0);}
.black-color:active{color: var(--c3-0-active);}