@charset "utf-8";
/* CSS Document */

.img img{width: 100%;}

.list li{
	float: left;
	width: 25%;
	list-style: none;
}
.feedback{
	width: 90%;
	margin: 2% auto;
	padding: 2%;
	border: dotted 1px #666666;
	border-radius: 10px;
	background:#CCCCCC;
}
.feedback dl{
	height: 42px;
}
.feedback dt{width: 20%;}
.feedback dd{width: 70%;}
.feedback dt,
.feedback dd{
	float: left;
	height: 32px;
	margin: 5px;
}
.feedback input{
	width: 90%;
	height: 26px;
}
.feedback .textarea{height: 80px;}
.feedback textarea{
	width: 90%;
	height: 78px;
}
.feedback input[type="checkbox"],
.feedback input[type="radio"]{
	width: 18px;
	height: 18px;
}
.feedback input[type="submit"]{
	height: 32px;
	border: solid #FFF 2px;
	background:#E94539;
	color: #FFF;
	font-size: 20px;
}

/**
   视频自动适配宽度
*/
.vedio-wrap{
    width:100%;
    position:relative;
    padding-bottom:56.25%;    /*需要用padding来维持16:9比例,也就是9除以16*/
    height: 0;
}
.vedio-wrap video{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%
}

#img-popup{
	position: fixed;
	left: 20px;
	top: 20px;
}
#img-popup .close{
	text-align: right;
	height: 24px;
}


/*
  对话
*/
.dialog{
	background:#FFF6EF;
	display: none;
}

.dialog .face{
	width: 40px;
	height: 40px;
	margin: 10px;
}
.dialog .face img{
	width: 40px;
	height: 40px;
}
.dialog .question{
	width: 60%;
	background: #FFF;
	margin: 10px;
	margin-left: 0;
	padding:5px;
}
.select{
	width: 90%;
	padding: 5%;
	background:#FFF6EF;
	display: none;
}
.select .opt{
	width: 40%;
	height: 40px;
	margin: 2% 4%;
	border: solid 1px #FFF;
	border-radius: 10px;
	background: #FF9D44;
}
.weixin-btn{
	width: 80%;
	height: 60px;
	margin:9%;
	border: solid 1px #FFF;
	border-radius: 10px;
	background: #22D96E;
	display: none;
}

/* 功能条 */
#top_menu{
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
}

@media screen and ( max-width: 640px){/*640px显示屏样式*/
   .main{width: 640px;}
}
@media screen and ( max-width: 540px){/*540px显示屏样式 摩托罗拉Droid3/4/Razr Atrix 4g*/
   .main{width: 540px;}
}
@media screen and ( max-width: 480px){/*480px显示屏样式 索尼MT27i Xperia sola*/
   .main{width: 480px;}
}
@media screen and ( max-width: 430px){/*430px显示屏样式 iphone 14 pro max */
  .main{width: 430px;}
}
@media screen and ( max-width: 424px){/*424px显示屏样式 LG 4X */
  .main{width: 424px;}
}
@media screen and ( max-width: 414px){/*414px显示屏样式 苹果6plus*/
  .main{width: 414px;}
}
@media screen and ( max-width: 400px){/*399px显示屏样式 三星galaxyNote*/
  .main{width: 400px;}
}
@media screen and ( max-width: 384px){/*384px显示屏样式 黑莓Z10 谷歌 Nexus 6 LG Optimus G*/
  .main{width: 384px;}
}
@media screen and ( max-width: 375px){/*375px显示屏样式 iphone X */
  .main{width: 375px;}
}
@media screen and ( max-width: 360px){/*360px显示屏样式 索尼Z1*/
  .main{width: 360px;}
}
@media screen and ( max-width: 320px){/*320px显示屏样式 苹果4/4S/5C/5S黑莓Z30 */
  .main{width: 320px;}
}
@media screen and ( max-width: 213px){/*213px显示屏样式 LG Optimus One*/
  .main{width: 213px;}
}


.guestbook{
	border: solid 1px #0000FF;
}
.guestbook ul{
	list-style: none;
}
.geustbook li{
	float: left;
	list-style: none;
	height: 40px;
	line-height: 40px;
	margin: 2px auto;
}

/* 遮罩层 */
#full-mask{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 998;
	background: #000000;
	opacity: 0.5;
	display: none;
}
#mask-content{
	position: fixed;
	top: 10%;
	left: 10%;
	width: 80%;
	z-index: 999;
	background:#CCC;
	display: none;
}
#mask-content .menu-bar{
	width: 100%;
	height: 40px;
	background: #5AB9C1;
}
#mask-content .menu-bar .title{
	float: left;
	width: 80%;
	font-size: 24px;
	line-height: 40px;
	text-align: center;
}
#mask-content .menu-bar .close{
	float: right;
	width: 38px;
	height: 38px;
	font-size: 24px;
	line-height: 40px;
	text-align: center;
	color: #FFFFFF;
	background: #F00;
	border: solid 1px #FF0000;
	border-radius: 5px;
	cursor: pointer;
}