*{
  border : solid px;
  font family: 新細明體;
  margin-left: auto;
  margin-right: auto;
}

#top {
	width: 60px;
	height: 60px;
	background-color: #000;
	color: #fff;
	text-decoration: none;
	text-align: center;
	line-height: 60px;
	display: block;
	position: fixed;
	right: 40px;
	bottom: 40px;
	z-index: 9999;
	font-family:"Century Gothic";
	font-weight: bold;
	border-radius:99em;
	/*box-shadow: .8px .8px 2px #333;*/
	font-size: 22px;
}

html,body{
  width: 100%; 
  padding: 0px ; margin: 0px;
  background-color: rgba(254, 224, 130, 1);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%230082bb' fill-opacity='0.4' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
}

/*整個*/
.all{
  width: 1010px;
}
 
li{
 display: inline-block; 
}

/*導覽列*/
.nav_999{
  position: relative;
background-color: rgba(10, 37, 67, 0.9);
  height:60px;
  width:1010px;
z-index:100000000;
}

.navlogoleft{
position: absolute;
left: 1%;
top: 10%;
}

.navlogoright{
position:absolute;
right: -1%;
top: 11%;
}

.navtxt{
font-size: 12px;
font-family:新細明體;
position:absolute;
right: 0%;
top: 65%;
color: white ;
}

/*主視覺*/
.one{
    position: relative;
    width: 1010px; height: 622px;
    background-image: url(http://www.ddc.com.tw/ec/event/2018/03/buddha-name-recitation/img/01_bg.png);
}

.onetitle{
  position:absolute;
  top: 5%;
  right: 2%;
}

.onetext{
  position:absolute;
  top: 11%;
  right: 21%;
}

.onediscount{
  position:absolute;
  top: 5%;
  left: 7%;
}

/*念佛有方法*/
.second{
  position: relative;
  width: 1010px;height: 1015px;
  background-image: url(http://www.ddc.com.tw/ec/event/2018/03/buddha-name-recitation/img/02_bg.png);
}

.secondtitle{
 position:absolute;
 right: 4%;
 top: 10%;
}

.seconddiscount{
  position:absolute;
 right: 3%;
 top: 39%;
}

.seconddiv{
  position: absolute; 
  left: 9.5%; top: 3.5%;
  width: 770px; height: 881px;
  }
  
.seconddiv li{
  text-align:center;
  font-size: 15px;
  margin: 38px 2px 0px 15px;
  width: 125px; height:175.5px;
}

/*念念自在念念吉祥*/
.sun{
    position: relative;
    width: 1010px;height: 610px;
    background-image: url(http://www.ddc.com.tw/ec/event/2018/03/buddha-name-recitation/img/03_bg.png);
}

.buddha{
  position: absolute; 
  left: -2%;
  top:-14.5%;
}

.item1{
  position: absolute; 
  left: 30%;
  top: 25%;
}

.item1_1{
  position: absolute; 
  left: 30.8%;
  bottom: 42%;
}

.item1_2{
  position: absolute; 
  left: 30.8%;
  bottom: 34.5%;
}

.item1grp{
  position: absolute; 
  left: 25%;
  bottom: 9%;
}

.item2{
  position: absolute; 
  right: 5%;
  bottom: 5%;
}

.item2_2{
  position: absolute; 
  right: 8%;
  bottom: 21%;
}

.item2_1{
  position: absolute; 
  right: 9.1%;
  bottom: 28%;
}

/*轉動心中的智慧*/
.see{
  position: relative;
  width: 1010px;height: 834px;
  background-image: url(http://www.ddc.com.tw/ec/event/2018/03/buddha-name-recitation/img/04_bg.png);
}

.item4_1{
 position: absolute; 
 left: 10%; top: 22%;
}

.item4_2{
 position: absolute; 
 bottom: 8%; left: 10%;
}
/*隨處念佛平安無事*/
.iiiii{
  position: relative;
  width: 1010px;height: 930px;
  background-image: url(http://www.ddc.com.tw/ec/event/2018/03/buddha-name-recitation/img/05_bg.png);
}

.fivediv{
position: absolute;
width:799px; height:600px;
top: 26%;
left: 15%;
text-align: center;


}
.fivediv ui{
display: inline-block;
}
.fivediv li{
margin: 0% 40px 0px 0px;
}



/* ---最後--- */
.fin{
width:1010px;
height:80px;  
background-color: rgba(10, 37, 67, 0.9);
font-size: 12px;
font-family:新細明體;
color:white;
text-align:center;
 }



/*2來亂*/
	h1{
		padding: 0px;
		margin: 0px;
	}
	.caption-style-2{
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		
	}
	.caption-style-2 li{
		float: left;
		margin: 38px 2px 0px 15px; /*品項間距*/
		position: relative;
		overflow: hidden;
	}
	.caption-style-2 li:hover .caption{
		opacity: 1;
		transform: translateY(-100px);
		-webkit-transform:translateY(-100px);
		-moz-transform:translateY(-100px);
		-ms-transform:translateY(-100px);
		-o-transform:translateY(-100px);
	}
	.caption-style-2 img{
		margin: 0px;
		padding: 0px;
		float: left;
		z-index: 4;
	}
	.caption-style-2 .caption{
		cursor: pointer;
		position: absolute;
		opacity: 0;
		top:57%;  /*彈出框框高度，數字越小上彈的位置越高*/
		-webkit-transition:all 0.15s ease-in-out;
		-moz-transition:all 0.15s ease-in-out;
		-o-transition:all 0.15s ease-in-out;
		-ms-transition:all 0.15s ease-in-out;
		transition:all 0.15s ease-in-out;
	}
	.caption-style-2 .blur{
		background-color: rgba(43,66,80,0.7);
		height: 175.5px;
		width: 125px;
		z-index: 5;
		position: absolute;
	}
	.caption-style-2 .caption-text h1{
		text-transform: uppercase;
		font-size: 18px;
	}

.caption-style-2 .caption-text p{
		text-transform: uppercase;
		font-size: 13px;
	}
	.caption-style-2 .caption-text{
		z-index: 10;
		color: #fff; /*文字顏色*/
		position: absolute;
		width: 125px;
		height: 175.5px;
		text-align: center;
		top:30px;  /*標題距離彈出邊框高度*/
	}

/*3*/
	.caption-style-3{
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		
	}
	.caption-style-3 li{
		
		margin: 0px 30px 0px 15px; /*品項間距*/
		position: relative;
		overflow: hidden;
	}

	.caption-style-3 li:hover .caption{
		opacity: 1;
		transform: translateY(-100px);
		-webkit-transform:translateY(-100px);
		-moz-transform:translateY(-100px);
		-ms-transform:translateY(-100px);
		-o-transform:translateY(-100px);
	}
	.caption-style-3 img{
		margin: 0px;
		padding: 0px;
		float: left;
		z-index: 4;
	}
	.caption-style-3 .caption{ /*滑動彈出效果*/
		cursor: pointer;
		position: absolute;
		opacity: 0;
		top: 67%;  /*彈出框框高度，數字越小上彈的位置越高*/
		-webkit-transition:all 0.15s ease-in-out;
		-moz-transition:all 0.15s ease-in-out;
		-o-transition:all 0.15s ease-in-out;
		-ms-transition:all 0.15s ease-in-out;
		transition:all 0.15s ease-in-out;
	}
	.caption-style-3 .blur{
		background-color: rgba(93,128,45,0.7); /*跳出透明底底色*/
		height: 150px;
		width: 150px;
		z-index: 5;
		position: absolute;
	}
	.caption-style-3 .caption-text h1{  /*H1標題文字調整*/
		text-transform: uppercase;
		font-size: 18px;
	}
	.caption-style-3 .caption-text{
		z-index: 10;
		color: #fff; /*文字顏色*/
		position: absolute;
		width: 150px;
		height: 150px;
		text-align: center;
		top:30px;  /*標題距離彈出邊框高度*/
	}