@charset "utf-8";

body{ background: #fff;
}

.MainTop{ width:100%; margin: 0 auto; height: auto; position: relative; }
.MainTop img{ display: block; width: 100%; height: auto;}
.MainTop .Photo{ background: url(../images/22243.png); background-size:100% 100% ; width: 9.52rem; height: 6.5rem; position: absolute; left: .67rem; top: 11.3rem; }
.MainTop .Photo img{ object-fit: cover; display: block; width: 100%; height: 100%;}
.MainTop .text{ padding: 0.45rem 0 0 .3rem; width:100%; position: absolute; right: .11rem; top: 0;  box-sizing: border-box; height: 8.8rem;}


.MainTop .text .layer1{ font-family: dymht; text-align: center; margin-top: 0.5rem; font-size: .70rem; font-weight: normal; color: #000000; line-height: 1.00rem; margin-bottom: .5rem;}
.MainTop .text .layer{ width: 100%; text-align: left;}


.MainTop .text .layer2 p{ font-family: dymht; color: #000000; text-align: center; line-height: .8rem; font-size: .49rem; }
.MainTop .text .layer3{font-family: dymht; margin: .5rem 0 .7rem 0; text-align: center; font-size: .44rem; color: #000000; text-align: center;}
.MainTop .text .layer3 span{font-family: dymht; display: inline-block; margin: 0 .7rem;font-size: .44rem; color: #000000;}

.MainTop .text .layer4{font-family: dymht; text-align: center; color: #92A7B1; font-size: .44rem; margin-bottom: .4rem; margin-top: -.5rem;}
.MainTop .text .layer5{font-family: dymht; margin-bottom: .7rem;}
.MainTop .text .layer5 p{font-family: dymht;line-height: .72rem; font-size: .49rem; color: #000000; text-align: center;}
.MainTop .text .layer6{font-family: dymht;text-align: center; color: #000000; font-size: .63rem; margin-bottom: .4rem;}

/* --------------index-start-------------- */
.MainTop .text .layer5{ margin-top: .1rem; width: 100%; text-align: center; font-size: .26rem; color: #e0c698; text-align: center;}
.MainTop .text .layer6{overflow: hidden; padding: 0 .45rem; box-sizing: border-box; } 
.MainTop .text .layer6 .bt{ float: left;font-size: .26rem; color: #e0c698; line-height: .3rem; width: .68rem;}

.MainTop .text .layer6 p{ width: calc(100% - .84rem); float: left; line-height: .3rem;}
.MainTop .text .layer6 p span{ display: block; font-size: .26rem; color: #e0c698;}
.MainTop .text .layer8{ padding: .25rem 0;}
.MainTop .text .layer8 p{ text-align: center; font-size: .26rem;letter-spacing: .02rem; color: #e0c698; white-space:pre-wrap; line-height: .44rem;}
.MainTop .text .layer7{ height: .26rem; line-height: .26rem;  width: 100%; position: absolute; text-align: right; font-size: .26rem; color: #e0c698; padding-right: .45rem; box-sizing: border-box; bottom: .3rem;}
.MainTop .text .layer7 span{ font-size: .26rem;}

.MainList{ width: 100%; padding: .5rem; box-sizing: border-box;}
.MainList ul{ width: 100%; overflow: hidden;}
.MainList ul li{ position: relative; float: left; color: #e0c698; margin-bottom: .2rem; line-height: .46rem; font-size: .28rem; padding:.15rem;  text-align: center; width: 100%; height: auto; border:.02rem solid #e0c698; box-sizing: border-box; border-radius:.1rem;}
.MainList ul li:nth-child(1){ text-align: center;}
.MainList ul li span{ font-size: .28rem;}

.PopFixed{ 
    display: none; 
    width: 100%; 
    background: rgba(0,0,0,0.7);  
    position: fixed; 
    left: 0; 
    top: 0; 
    height: 100vh;
}
.PopFixed .NrBox{ 
    padding-bottom: .6rem; 
    border-radius:.2rem ; 
    width:9rem;  
    background: #82292b; 
    height: auto; 
    position: absolute; 
    left: 50%; 
    top: 50%; 
    transform: translate(-50%,-50%);
}
.PopFixed .NrBox .close{ 
    text-align: center; 
    width: 1rem; 
    height: 1rem; 
    float: right; 
    font-size: .6rem; 
    color: #fff;
}
.PopFixed .NrBox input{
    position: relative; 
    opacity: 1;  
    background: none; 
    border-radius:.1rem ; 
    display: block; 
    width: 80%; 
    border: .02rem solid #e0c698; 
    margin: 0 auto; 
    height: auto; /* 改为自动高度或根据需要设置固定高度 */
    min-height: 1rem; /* 设置最小高度 */
    padding: 0 .15rem; 
    box-sizing: border-box; 
    color: #e0c698; 
    font-size: .26rem;
    white-space: normal; /* 允许文本换行 */
    overflow: visible; /* 内容溢出时可见 */
    word-wrap: break-word; /* 允许长单词换行 */
}

.PopFixed .NrBox input::placeholder{ 
    color:#e0c698 ;
}
.PopFixed .NrBox .enter{ 
    font-size: .26rem; 
    width: 100%; 
    margin: .2rem auto 0 auto; 
    width: 80%; 
    border-radius:.1rem ; 
    background: #e0c698; 
    color: #fff; 
    text-align: center; 
    line-height: 1rem;
}


.textarea-like {
    min-height: 1.6rem;
    padding: .15rem;
    font-size: .3rem;
    border: .02rem solid #e0c698;
    border-radius: .1rem;
    color: #e0c698;
    white-space: pre-wrap;
    outline: none;
}
.caiqie{ display: none; width: 100%; height: 100vh; background:#000; position: fixed; left: 0; top: 0;}
.caiqie .bg.bg1{ z-index: 9; width: 100%; height:4rem; background: rgba(0,0,0,0.7); position: absolute; left: 0; top: 0;}
.caiqie .bg.bg2{ z-index: 9; width: 100%; height: calc(100vh - 7.44rem - 4rem); background: rgba(0,0,0,0.7); position: absolute; left: 0; bottom: 0;}
.caiqie .bg.bg3{ z-index: 9; width: calc((100% - 6.26rem) / 2); height: 7.44rem; background: rgba(0,0,0,0.7); position: absolute; left: 0; top: 4rem; }
.caiqie .bg.bg4{ z-index: 9; width: calc((100% - 6.26rem) / 2); height: 7.44rem; background: rgba(0,0,0,0.7); position: absolute; right: 0; top: 4rem; }
.caiqie .icon{ width: 6.26rem; height: 7.44rem; position: absolute; left: 50%; top:4rem; transform: translate(-50%,0); background: none; border: .02rem solid #e0c698; box-sizing: border-box;}
.caiqie .icon img{ height: 110%; width: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

.photoClick input{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0;}

.top{ background: #fff; font-size: .32rem; color: #333; width: 100%; height: .9rem; line-height: .9rem; text-align: center;}
.top .back{ width: .9rem; height: .9rem; display: block; position: absolute; left: 0; top: 0; background: url(../images/top_03.jpg) center center no-repeat; background-size:.28rem .28rem;}
.top .more{ width: .9rem; height: .9rem; display: block; position: absolute; right: 0; top: 0; background: url(../images/top_06.jpg) center center no-repeat; background-size:.36rem .08rem;}

.Container{ width: 100%; padding: .25rem .3rem 0 .3rem; box-sizing: border-box; background: #d8d9ea;}
.Container .serach{ overflow: hidden; width: 100%; height: .72rem; border-radius:.36rem; background: #fff;}
.Container .serach input{ opacity: 1; position: relative; display: block; width: calc(100% - .86rem); float: left; box-sizing: border-box; outline: none; border: none; height: 100%; font-size: .26rem;}
.Container .serach button{ width: .86rem; height: 100%; background: url(../images/a1.png) center center no-repeat; background-size:.26rem .26rem; border: none; outline: none; float: left;}
.Container .banner{ border-radius:.15rem; overflow: hidden; width: 100%; margin-top: .25rem;}
.Container .banner img{ display: block; width: 100%; height: auto;}

.Container .Tips{ width: 100%; margin-top: .25rem; height: .64rem; background:url(../images/a3.png) .26rem center no-repeat #edf7ff; border: .02rem solid #b1d9fc; box-sizing: border-box; border-radius:.15rem; padding-left: .9rem; box-sizing: border-box; background-size:.48rem .48rem;}
.Container .Tips p{ width: 100%; height: 100%; line-height: .64rem; font-size: .26rem; color: #333;}


.Container .layer1{ width: 100%; padding: .5rem 0 0 0; }
.Container .layer1 .hd{position: relative; width: 4.1rem; height: .76rem; margin: 0 auto; border-radius:.38rem; background: #f5f5f5;}
.Container .layer1 .hd ul{ width: 100%; height: 100%; position: relative; z-index: 2; overflow: hidden;}
.Container .layer1 .hd ul li{ width: 50%; height: 100%; float: left; line-height: .76rem; text-align: center; font-size: .28rem; color: #777;}
.Container .layer1 .hd ul li.on{ color: #333;}
.Container .layer1 .hd span{ display: block; width: 50%; transition: 0.5s; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background: #fff; border-radius:.76rem; box-shadow: 0 0 .1rem rgba(0,0,0,0.1);}
.Container .layer1 .bd{ height: 3.6rem; margin-top: .5rem; width: 100%; overflow: hidden; position: relative;}
.Container .layer1 .bd .bdWarp{ transition: 0.5s; overflow: hidden; width: 200%; height: 3.6rem; position: absolute; left: 0; top: 0;}
.Container .layer1 .bd .bdBox{ position: relative; background: url(../images/a4.png); height: 3.6rem; width: 50%; background-size:100% 100% ; float: left;}

.Container .layer1 .bd .bdBox .PmBox{ position: absolute; width: 33.33%;}
.Container .layer1 .bd .bdBox .PmBox .bt{ background: url(../images/a18.png); width: 1.16rem; height: .4rem; background-size:100% 100%; text-align: center; line-height: .4rem; font-size: .2rem; color: #fff; font-weight: bold; margin: 0 auto;}
.Container .layer1 .bd .bdBox .PmBox.Top1{ left: 50%; top: 0; transform: translateX(-50%);}
.Container .layer1 .bd .bdBox .PmBox.Top2{ right: 0; top: .4rem; }
.Container .layer1 .bd .bdBox .PmBox.Top3{ left: 0; top: .4rem; }
.Container .layer1 .bd .bdBox .PmBox .icon{ position: relative; margin: .4rem auto 0 auto; width: 1.15rem; height: 1.15rem; border-radius:50%; background: #ddd;}
.Container .layer1 .bd .bdBox .PmBox .icon .bg{ position: absolute; top: -.2rem; left: 50%; transform: translateX(-50%);}
.Container .layer1 .bd .bdBox .PmBox .icon img.pic{ border-radius:50% ; display: block; width: 100%; height: 100%; background: #ddd;}
.Container .layer1 .bd .bdBox .PmBox.Top1 .icon .bg{ background: url(../images/a5.png); width: 1.4rem; height: 1.4rem; background-size:100% 100% ;}
.Container .layer1 .bd .bdBox .PmBox.Top2 .icon .bg{ background: url(../images/a6.png); width: 1.4rem; height: 1.4rem; background-size:100% 100% ;}
.Container .layer1 .bd .bdBox .PmBox.Top3 .icon .bg{ background: url(../images/a7.png); width: 1.4rem; height: 1.4rem; background-size:100% 100% ;}
.Container .layer1 .bd .bdBox .PmBox.Top1 .bt{}
.Container .layer1 .bd .bdBox .PmBox.Top2 .bt{background: url(../images/a17.png);  background-size:100% 100%;}
.Container .layer1 .bd .bdBox .PmBox.Top3 .bt{background: url(../images/a16.png);  background-size:100% 100%;}
.Container .layer1 .bd .bdBox .PmBox h2{ text-align: center; height: .72rem; line-height: .72rem; font-size: .28rem; color: #000;}
.Container .layer1 .bd .bdBox .PmBox p{ text-align: center; font-size: .22rem; color: #b9b9b9;}



.Container .layer2{ margin-top: .3rem; overflow: hidden; width: 100%; border-radius:.3rem; background: #fff; padding: 0 0 0 0; box-sizing: border-box;}
.Container .layer2 ul{ text-align: left; width: 100%; overflow-x: scroll;}
.Container .layer2 ul li{ text-align: left; width: 1.3rem; display: inline-block;}
.Container .layer2 ul li .icon{ width: 100%; height: 1.3rem; background: #ddd;}
.Container .layer2 ul li .icon img{ display: block; width: 100%; height: 100%;}
.Container .layer2 p.on{ background: #ef9d4a; border-radius:.3rem; color: #fff;}

.Container .layer2 .icon{ width: 1.3rem; height: 1.3rem; position: relative;}
.Container .layer2 .icon img{ width: 100%; height: 100%;}
.Container .layer2 p{ width: 100%; text-align: center; height: .6rem; line-height: .6rem; font-size: .26rem; color: #333;}
.Container .layer2 .icon span{ background: #16da05; border: .02rem solid #b3ffad; display: block; width: .2rem; height: .2rem; display: block; border-radius:50%; position: absolute; right: .1rem; top: .1rem; box-sizing: border-box;}
.Container .layer3{ width: 100%; padding-top: .3rem;}
.Container .layer3 ul{ overflow: hidden;}
.Container .layer3 ul li{ margin-bottom: .15rem; border: .1rem solid #fff; box-sizing: border-box; position: relative; overflow: hidden; width: 49%; float: left; margin-right: 2%; height: 3rem; background: #fff; border-radius:.15rem ;}
.Container .layer3 ul li:nth-child(2n){ margin-right: 0;}
.Container .layer3 ul li img{ position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%);}


/**/
.cover-wrap{
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background: rgba(0, 0, 0, 0.4);
	z-index: 10000000;
	text-align:center;
}
.cover_box{
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	width: inherit;
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
#clipBtn{
	background: #0A59F8;
    border-radius: 20px;
    padding: 9px 32px;
    color: #fff;
    font-size: 1.1rem;
    letter-spacing: 1px;
    display: block;
    cursor: pointer;
	margin: 3% auto;
    box-shadow: 1px 2px 5px rgb(56 119 199 / 20%);
	position: fixed;
	left: 50%;
	bottom: 5%;
	-webkit-transform: translate(-50%,-0%);
	transform: translate(-50%,-0%);
}
#clipArea{
	height: inherit;
}
button{
	box-shadow: none;
	border: none;
	font-size: 12px;
}
 
img{
	width: 100%;
	display: block;
}
.img_up {
    position: relative;
    background: #eee;
    width: 500px;
    height: 300px;
    border: 1px solid #f0f0f0;
    box-sizing: border-box;
    border-radius: 5px;
	margin: auto;
    overflow: hidden;
}
input {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
	background: none;
	border: none;
	box-shadow: none;
}
.img_up span {
    font-size: 16px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.photo-clip-layer{ width: 6.26rem!important; height: 7.48rem!important;}
#clipBtn{ background: #82272c; width: 4rem; height: .8rem; text-align: center; line-height: .8rem; font-size: .28rem; color: #e0c698; padding: 0;}

.MainList .enter{ border-radius:.5rem ; display: block; width: 100%; height: 1rem; line-height: 1rem; text-align: center; font-size: .3rem; color: #e0c698; background:#82272c ;}
.preImage{ display: none; background: #000; width: 100%; height: 100vh; background: #000; position: fixed; z-index: 99; top: 0;}
.preImage img{ display: block; width: 100%; height: auto; position: absolute; top: 50%; transform: translateY(-50%);}
.altFix{ display: none; text-align: center; width: 100%; position: fixed; z-index: 100; top: 3rem; font-size: .3rem; color: #fff;}
.backIcon{ display: none; width: 5rem; height: 1rem; line-height: 1rem; border-radius:.5rem; position: fixed; left: 50%; transform: translateX(-50%); text-align: center; font-size: .3rem; color: #e0c698; z-index: 100; bottom: 3rem; background: #82272c;}
 .tips{ width: 100%; position: absolute; text-align: center; font-size: .26rem; bottom: 4rem; color: #fff;}