/*css reset*/
@charset "UTF-8";
* { -webkit-tap-highlight-color: transparent; outline: 0; margin: 0; padding: 0; vertical-align: baseline; }
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin: 0; padding: 0; vertical-align: baseline; }
img { border: 0 none; vertical-align: top; }
i, em { font-style: normal; }
ul { list-style: none; }
input, select, button, h1, h2, h3, h4, h5, h6 { font-size: 100%; font-family: inherit; }
table { border-collapse: collapse; border-spacing: 0; }
a { text-decoration: none; color: #666; }
body { margin: 0 auto; min-width: 320px; max-width: 640px; height: 100%; font-size: 14px; font-family: -apple-system,Helvetica,sans-serif; line-height: 1.5; color: #666; -webkit-text-size-adjust: 100% !important; text-size-adjust: 100% !important; }

input[type="text"], input[type="button"], input[type="submit"], input[type="file"], textarea, button, select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/*page css*/

/*首页样式*/
body,button{
  font-family: "微软雅黑";
}
#indexPage {
    position: relative;
}
html, body, .container {
    width: 100%;
    height: 100%;
}

.container{ background: #EFF7FF; padding: 10px;position:absolute; box-sizing: border-box;}
.banner{box-shadow: 0px 2px 4px #CEE4FF;border-radius: 10px;}
.banner img{ border-radius: 10px;}
.nav{box-shadow: 0px 2px 4px #CEE4FF;border-radius: 10px; margin-top: 10px; background: #ffffff; min-height: 200px;}
.nav ul{ display: flex; flex-wrap:wrap; padding: 10px 0;}
.nav ul li{ width: 50%; }
.nav ul li a{ justify-content: center; margin: 20px 0;  display: flex;height: 55px;}
.nav ul li a img{ width: 55px; display: block; margin-right: 10px;}
.nav ul li a div { }
.nav ul li a div h1{  font-size: 14px; margin-top: 5px;}
.nav ul li a div span{  font-size: 12px;}


.gift{background:url(../img/bg.jpg) 0 / cover fixed; position:relative; box-sizing: border-box;width: 100%; min-height:100%;
    }
.gift-img img{ width: 100%; height: auto; }
.gift-btn a{ bottom:0; left: 0; display: block; position: fixed; width: 100%; height: 50px; text-align: center; background: #FDA13E; color: #ffffff; line-height: 50px; font-size: 18px;}

.top{ height: 46px; line-height: 46px; width: 90%; background: #ffffff; position: fixed; top:0; left: 0%; justify-content: space-between;  display: flex; padding: 0 5%; box-shadow: 0px 0px 3px #E7E7E7; z-index:99999;}
.top a.history{ color: #FF8746}
.top a i{ display: inline-block; width: 8px; margin-right: 5px; }
.top a i img{ margin-top: 16px;}
.gift-box{ padding: 60px 10px 10px 10px;}
.gift-tip,.gift-nr{ background: #FFF5E4;border-radius: 10px; padding: 15px; color: #E8473B;}
.gift-form{ margin-top: 10px;}
.gift-nr h1{ color: #FDA13E}
.z_input {
    width: 100%;
    padding: 0 10px;
    border-radius: 3px;
    margin-bottom: 10px;
    box-sizing: border-box;
    color: #666;
	border: none;
	height: 12vw;
	box-shadow: 0px 2px 4px #f2eabd;
	font-size:4vw;
}
.gift-number{margin-top: 10px; margin-bottom:60px;}
.gift-number-title{ display: flex; justify-content: space-between;}
.gift-number-title a{  border-radius: 100px; border: solid 1px #FDA13E; padding: 1px 15px;color: #FDA13E}
.gift-number ul { display: flex; flex-wrap:wrap; }
.gift-number ul li{ width: 48%;margin-top: 15px;}
.gift-number ul li:nth-of-type(even){ margin-left: 4%;}
.gift-number ul li a{ border-radius: 10px; width: 100%; height: 40px; line-height: 40px; text-align: center; background: #ffffff; display: block;box-shadow: 0px 2px 4px #f2eabd; font-size: 18px;color: #FDA13E; font-weight: bold;}
.gift-number ul li a.active{ background: #FDA13E; color: #fff;}
.gift-pay{ display: flex; justify-content: space-between; position: fixed; width: 100%; height: 50px; background: #ffffff;
left: 0; bottom:0; line-height: 50px; }
.money{ padding-left: 5%; font-size: 26px; color: #000;}
.money span{ font-size: 12px; padding: 0 3px;}
.gift-pay a{ width: 40%; color: #fff; text-align: center; background: #FDA13E; font-size: 18px;}


.img-replace {
  /* replace text with an image */
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  color: transparent;
  white-space: nowrap;
}

/* -------------------------------- 

Main components 

-------------------------------- */
.cd-popup-trigger {
 
}
@media only screen and (min-width: 1170px) {
  
}

/* -------------------------------- xpopup -------------------------------- */
.cd-popup {
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  transition: opacity 0.3s 0s, visibility 0s 0.3s;
}
.cd-popup.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
  transition: opacity 0.3s 0s, visibility 0s 0s;
}

.cd-popup-container {
  position: relative;
  width: 90%;
  max-width: 300px;
  margin: 30% auto;
  background: #FDA13E;
  border-radius: .25em .25em .4em .4em;
  text-align: center;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -o-transform: translateY(-40px);
  transform: translateY(-40px);
  /* Force Hardware Acceleration in WebKit */
  -webkit-backface-visibility: hidden;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
	padding-bottom: 20px;
}
.cd-popup-container h1 {
  height: 80px; line-height: 80px; background: url(../img/jilu.png) no-repeat; background-size:  auto 50px; background-position: 60px 25px; color: #ffffff; font-size: 24px; 
}
.cd-popup-container div{ background: #ffffff; margin:0 15px; line-height: 28px; font-size: 16px; padding: 15px; text-align: left; border-radius: 10px; color: #FDA13E;margin-top: -10px;}
.cd-popup-container div span{ color: #000000;}

.cd-popup-container .cd-popup-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 30px;
  height: 30px;
	
}
.cd-popup-container .cd-popup-close::before, .cd-popup-container .cd-popup-close::after {
  content: '';
  position: absolute;
  top: 12px;
  width: 14px;
  height: 3px;
  background-color: #ffffff;
}
.cd-popup-container .cd-popup-close::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  left: 8px;
}
.cd-popup-container .cd-popup-close::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  right: 8px;
}
.is-visible .cd-popup-container {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}
@media only screen and (min-width: 1170px) {
  .cd-popup-container {
    margin: 8em auto;
  }
}


.topimg img{ display: block; margin-top: 45px;}
.pagetitle{ color: #000000; font-size: 24px; padding: 20px 20px 0px 20px;}
.content{ margin-top: 50px;color: #4A4A4A; font-size: 16px; padding: 20px; line-height: 200% }
.content img { max-width: 100%; display: block; margin: 10px auto;}

.pagetop{ position: fixed;}

.land{ padding: 15px;}
.land>button{ width: 100%; height: 40px; color: #fff; background: #FDA13E; border-radius: 10px; border:none;}

.yuyue-index{ background:#E7E7E7;}
.yuyue-button{bottom:0; left: 0; display: block; position: fixed; width: 100%; height: 15vw; text-align: center; background: #51ABF4; color: #ffffff; line-height: 15vw; font-size: 5vw;}
.yuyue-button a{ display:block; width:100%; color:#ffffff;}
.gift-nr.yuyue-box{ background:#ffffff;}
.yuyue-box .z_input{ background:#f7f7f7; box-shadow:none;}
.yuyue-bg{ position:relative; z-index:1; margin-top:46px;}
.yuyue-nr{ position:absolute; top:42vw; z-index:999;}
.fd-link{ padding-left:5px;}
.fd-link a{ display:inline-block; margin-right:20px; color:#51ABF4; font-size:16px;}