html,
body {
  height: 100%;
  overflow: hidden;
  user-select: none;
}
.memorial {
  width:100%;
  height: 100%;
  background: url(../imgs/bg2.jpg) no-repeat center top /100% 100%;

}

.memorial .mark {
  position: absolute;
  right: 40px;
  top: 20px;
  width: 220px;
  height: 110px;
  margin: 0 auto;
  background: url(../imgs/bg_seal.png) no-repeat center / 100%;
}

.memorial .hide {
	display: none;
}

.memorial .container {
  position: absolute;
  left: 50%;
  top: 51%;
  width: 600px;
  height:399px;
  transform: translate(-50%, -50%);
  /*background: url(../imgs/bg_memorial.png) no-repeat 0 0 / cover;*/
}

.memorial .wreath {
  position: absolute;
  left: 50%;
  top: 66%;
  z-index:60;
  width: 100px;
  height: 155px;
  margin-left:15px;
  background: url(../imgs/xianhua.png) no-repeat center / 100%;
  transform: translate(-38%, -53%);
}

.memorial .add-soil {
  position: absolute;
  left: 50%;
  top: 62%;
  z-index:40;
  width: 300px;
  height: 80px;
  margin-left:-15px;
  background: url(../imgs/shuiguo.png) no-repeat center / 100%;
  transform: translate(-38%, -53%);
}

.memorial .candle {
  position: absolute;
  left: 50%;
  top: 64%;
  z-index:80;
  width: 120px;
  height: 77px;
  margin-left:10px;
  background: url(../imgs/lazhu.png) no-repeat center / 100%;
  transform: translate(-38%, -53%);
}


.memorial .bow {
  position: absolute;
  top: 51.5%;
  left: 50%;
  z-index:100;
  width: 311px;
  height: 400px;
  margin-top: -85px;
  margin-left: -130px;
  background: url("../imgs/grjugong.gif") no-repeat center / cover;
}

.memorial .message {
  position: absolute;
  bottom: 116px;
  padding: 1em;
  left: 48.8%;
  z-index: 999; 
    background: rgba(0, 0, 0, .5);
  color: #fff;
}

.memorial .message input{
	height: 36px;
	padding: 0 10px;
	border-radius: 5px;
}

.memorial .message span{
	margin-left: 6px;
	font-size: 16px;
	cursor: pointer;
}

.memorial .message::after {
  position: absolute;
  left: 12px;
  bottom: -16px;
  content: '';
  width: 0;
  height: 0;
  border-top: 8px solid rgba(0, 0, 0, .5);
  border-bottom: 8px solid transparent;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-radius: 2px;
}

.memorial .introduction {
  position: absolute;
  bottom: 116px;
  left: 59.2%;
  z-index: 999; 
  width: 300px;
  padding: 1em;
  background: rgba(0, 0, 0, .5);
  color: #fff;
  border-radius: 3px;
  font-size: 16px;
  text-align: justify;
  line-height: 1.4;
}

.memorial .introduction::after {
  position: absolute;
  left: 12px;
  bottom: -16px;
  content: '';
  width: 0;
  height: 0;
  border-top: 8px solid rgba(0, 0, 0, .5);
  border-bottom: 8px solid transparent;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-radius: 2px;
}

.memorial .weizhi {
  position: absolute;
  bottom: 116px;
  left: 53%;
  z-index: 9999; 
  padding: 1em;
  background: rgba(0, 0, 0, .5);
  color: #fff;
  border-radius: 3px;
  font-size: 16px;
  text-align: justify;
  line-height: 1.4;
}

.memorial .weizhi::after {
  position: absolute;
  left: 12px;
  bottom: -16px;
  content: '';
  width: 0;
  height: 0;
  border-top: 8px solid rgba(0, 0, 0, .5);
  border-bottom: 8px solid transparent;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-radius: 2px;
}

.memorial .pic {
	position: absolute;
	overflow: hidden;
	right: 30px;
	top: 22%;
	width: 140px;
	height: 500px;
	padding: 20px;
	background: rgba(0, 0, 0, .5);
}

.memorial .pic .box{
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.memorial .pic li{
	width: 140px;
	height: 140px;
	margin: 8px 0;
}

.memorial .pic li img{
	width: 100%;
	height: 100%;
}

.memorial .copyrights {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  text-align: center;
  background: url(../imgs/bg_foot01.png) no-repeat center / cover;
}

.memorial .copyrights .box {
  display: inline-block;
  margin-top: 46px;
}

.memorial .copyrights .box li {
  display: inline-block;
  margin: 0 10px;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
}

.memorial .copyrights .box li img {
  display: block;
  width: 60px;
  height: 60px;
  margin-bottom: 10px;
}