*, *::before, *::after { box-sizing: border-box;}

html, body, .page { width: 100%; min-height: 100%;}
body {
    background-color: #fffcf1;
    color: #231f20; font-size: 14px; line-height: 1.65;
    padding: 0; margin: 0;
    -webkit-font-smoothing: subpixel-antialiased
}
p { margin: 0;}
.lishu { font-family: '隶书';}
.num { font-family: Georgia, 'Times New Roman', Times, serif;}
.red { color: #790100;}

.page .bg2 { position: fixed; z-index: 0; width: 100%; height: 100%; pointer-events: none;}
.page .bg2 .boat { background: url('./images/boat.png') no-repeat 0 bottom; background-size: 70%; position: absolute; z-index: -1; bottom: 0; left: 0; width: 100%; height: 100%;}

.header { padding: 0px;}
.view { position: relative;}

/* 扫码页面 */
.page.qrcode {}
.page.qrcode .logo {
    background: none; width: 112px; height: 112px; display: block;
    margin: 0; float: none;
    position: fixed; left: 50%; top: 0; z-index: 1;
    transform: translate3d(-50%, 0, 0);
}
.page.qrcode .logo .logo-bg {
    background-image: linear-gradient(-45deg, #a97233 , #5f342d 22%, #5f342d 62%, #d9b985 88%);
    width: 112px; height: 112px;
}
.page.qrcode .logo::after {
    content: ''; display: block;
    position: absolute; top: 50%; left: 50%; z-index: 100;
    width: 76px; height: 76px;
    background: url('./images/logo2.png') no-repeat 0 0; background-size: cover;
    transform: translate3d(-50%, -50%, 0);
}

.page.qrcode .bg { position: fixed; z-index: 3; width: 100%; height: 100%; pointer-events: none;}
.page.qrcode .bg .linex { content: ''; background: url('./images/line-y.png') repeat-x 0 0; background-size: contain; position: absolute; left: 60px; right: 60px; height: 40px;}
.page.qrcode .bg .liney { content: ''; background: url('./images/line-x.png') repeat-y 0 0; background-size: contain; position: absolute; top: 60px; bottom: 60px; width: 40px;}
.page.qrcode .bg .connor { background: url('./images/connor.png'); background-size: cover; width: 40px; height: 40px; position: absolute;}
.page.qrcode .header { height: 0px; padding: 0; position: relative; z-index: 100;}
.page.qrcode .view {
    width: 100%; height: 100%; padding: 25px; overflow-y: scroll;
}
.page.qrcode .view::before {
    content: ''; background-color: rgba(255, 255, 255, 0.055); display: block; position: fixed; top: 25px; right: 25px; bottom: 25px; left: 25px; z-index: 0;
    -webkit-backdrop-filter: blur(1.5px);
    backdrop-filter: blur(1.5px);
}
.page.qrcode .view .viewer { position: relative; z-index: 1; padding: 110px 15px 25px; height: 100%; overflow-y: scroll;}
.page.qrcode .view .viewer .info { padding: 0 25px;}
.page.qrcode .view .viewer .item { padding: 10px 0; border-bottom: solid 1px rgb(154 101 50 / 60%); display: flex;}
.page.qrcode .view .viewer .item label { color: rgb(154 101 50); flex-shrink: 0;}
.page.qrcode .view .viewer form { margin: 45px 25px 45px; text-align: center;}
.page.qrcode .view .viewer form .title {
    font-size: 30px; color: #5f342d; margin-bottom: 8px;
    text-indent: -999em; overflow: hidden;
    background: url('./images/captcha_txt.png') no-repeat center center;
    background-size: 45%;
}
.page.qrcode .view .viewer form input {
    border: none; background-color: #f5ead6; color: #231f20; padding: 10px; text-align: center; font-size: 18px; width: 100%;
    margin-bottom: 15px;
    /*
    outline: solid #231f20 2px;
    border-radius: 5px;
    */
}
.page.qrcode .view .viewer .resulttip { margin-bottom: 8px; display: none; padding: 3px; text-align: left;}
.page.qrcode .view .viewer .resulttip::before {
    content: ''; width: 10px; height: 10px; border-radius: 100%; display: block; margin: 7px 10px 0 0; float: left;
}
.page.qrcode .view .viewer .resulttip.success::before { background-color: #5ce96a;}
.page.qrcode .view .viewer .resulttip.error::before { background-color: #790100;}

.page.qrcode .view .viewer form button {
    color: #fff;
    background-image: linear-gradient(88deg,  #5f342d, #ca996c 88%);
    display: block; color: #fff; font-size: 18px; border: none; padding: 10px 20px; margin: 0 auto; width: 100%;
}
.page.qrcode .view .viewer form button .loading { width: 21px; height: 21px; position: absolute; left: 80px; display: none; animation: fadenum 1.5s infinite;}
.page.qrcode .view .viewer form button span {
    display: block;
    text-indent: -999em; overflow: hidden;
    background: url('./images/submit_txt.png') no-repeat center center;
    background-size: 18%;
}
.page.qrcode .view .viewer .infoo {
    border-top: dashed 1px #333;
    border-bottom: dashed 1px #333;
    padding: 15px 0; margin-bottom: 35px;
}

.page.qrcode .view .viewer .imgPic { background-color: #333;}
.page.qrcode .view .viewer .imgPic img { max-width: 100%;}

.page.qrcode .view .telLink {
    width: 150px; display: block; margin-top: 4px;
    text-indent: -999em; overflow: hidden;
    background: url('./images/tel_txt.png') no-repeat 0 center;
    background-size: 80%;
}
.page.qrcode .view .aboutLink {
    color: #5f342d; display: block;
    font-size: 21px; text-decoration: none;
    position: relative;
}
.page.qrcode .view .aboutLink span {
    width: 100px; display: block;
    text-indent: -999em; overflow: hidden;
    background: url('./images/about_txt.png') no-repeat 0 center;
    background-size: 80%;
}
.page.qrcode .view .aboutLink::before {
    content: ''; display: block; width: 0; height: 0;
    border-color: transparent transparent transparent #5f342d; border-width: 5px;
    border-style: solid;
    position: absolute; left: -10px; top: 12px;
}
.page.qrcode .view .viewerMask {
    height: 160px;  background-image: linear-gradient( rgba(255, 252, 241, 1) 38%, rgba(255, 252, 241, 0));
    position: fixed; top: 0; left: 25px; right: 25px; z-index: 2;
    -webkit-filter: blur(3px);
    filter: blur(3px);
}
.page.qrcode .infoo .num { font-size: 20px; color: #744839; position: relative; top: -4px;}
.page.qrcode .infoo .num + .num { margin-left: 20px;}
.page.qrcode .qrcode { float: right; width: 35%; margin: -5px 0 0 0;}

@keyframes fadenum {
    100% {
        transform: rotate(360deg);
    }
}

/* 关于我们 */
.page.about {}
.page.about .header { padding: 25px 0 0;}
.page.about .header .logo {
    background: url('./images/logo.png') no-repeat 0 0; background-size: cover;
    width: 112px; height: 112px; display: block; margin: 0 auto;
}
.page.about .brand {
    text-align: center; font-size: 28px; font-weight: normal; padding: 0; margin: 15px 0 0;
    display: block;
    text-indent: -999em; overflow: hidden;
    background: url('./images/brand_txt.png') no-repeat center center;
    background-size: 62%;
}
.page.about .view { padding: 10px 25px 35px;}
.page.about .view .info {}
.page.about .view .info p { margin-bottom: 35px;}
.page.about .view .address {
    background-color: rgba(121, 1, 0, 0.68); color: #fff; padding: 15px 22px; margin-top: 50px;
    border-radius: 12px;

    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
.page.about .view .address p { margin-bottom: 10px;}
.page.about .view .address p:last-child { margin-bottom: 0;}


.indexLink { display: block; margin-top: 35px; border: solid 1px #333; padding: 4px 12px; display: none;}