.wow { animation: fadeIn 1.5s both; -webkit-animation: fadeIn 1.5s both; animation-duration: 1s; -webkit-animation-duration: 1s; }
#articleInfo16 {overflow: hidden;margin-bottom: 50px;}
#articleInfo16 .item {overflow: hidden;position: relative;margin: 0 auto;width: 100%;}
#articleInfo16 .item > div { animation-name: fadeInLeft; -webkit-animation-name: fadeInLeft; }
#articleInfo16 .item:nth-child(2n) > div { float: right; }
#articleInfo16 .item:nth-child(2n) .photo { animation-name: fadeInRight; -webkit-animation-name: fadeInRight; }
#articleInfo16 .item .photo { overflow: hidden; background-position: 50%; background-repeat: no-repeat; background-size: cover; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
#articleInfo16 .item .photo img { width: 100%; }
#articleInfo16 .item .info { margin: 0 0 0 5%; width: 60%; animation-name: fadeInRight; -webkit-animation-name: fadeInRight; }
#articleInfo16 .item:nth-child(2n) .info { animation-name: fadeInLeft; -webkit-animation-name: fadeInLeft; }
#articleInfo16 .item .info h5 { padding: 10px 15px; border-top: 2px #000 solid; border-bottom: 1px #000 solid; font-size: 14px; color: #444; }
#articleInfo16 .item .info h3 { padding: 15px; font-size: 20px; color: #87623e; }
#articleInfo16 .item .info article { margin: 0 15px; }

ul.spotList {margin: 0 auto;display: flex;}
ul.spotList li {overflow: hidden;display: flex;vertical-align: top;width: calc((100%/2) - 0px);padding: 0;cursor: pointer;flex-direction: column;}
ul.spotList .item {background-color: #222222;}
ul.spotList li.gmapppof iframe{
    width: 100%;
    height: 100%;
}
ul.spotList .item:hover { background-color: rgb(167 31 35); }
ul.spotList .item:hover .Txt h3 a,ul.spotList .item:hover .Txt p a { color: #ffffff; }
ul.spotList .item:hover .Txt p { color: #ffffff; }
ul.spotList .item:hover .Img img { opacity: 0.8; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); }
ul.spotList .Img { margin-right: 0; }
ul.spotList .Img a { overflow: hidden; width: 100%; height: 300px; display: block; }
ul.spotList .Img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease; }
ul.spotList .Txt {padding: 20px 30px 20px;overflow: hidden;}
ul.spotList .Txt h3 {font-size: 25px;color: #fff;}
ul.spotList .Txt h3 a { color: #b81c22; display: block; width: 100%; font-size: 20px; }
ul.spotList .Txt p {padding-top: 10px;font-size: 14px;color: #ebebeb;line-height: 1.8;}
ul.spotList .Txt p * { display: inline-block; word-wrap: break-word; word-break: break-word; }
ul.spotList .Txt b { display: none; margin-top: 10px; font-size: 12px; font-weight: normal; color: #8e0909; }

.button-container {display: flex; justify-content: center;}
.button-container a{margin: 20px 40px 40px; padding: 5px 20px; font-size: 24px; background-color: #444;}
.button-container a:hover{background-color: #8e0909;}

@media screen and (max-width: 768px) {
	#articleInfo16 .item .photo { position: absolute; width: 15%; top: 0; }
	#articleInfo16 .item:nth-child(2n) .photo { right: 0; }
	#articleInfo16 .item .info { margin: 0; width: 100%; }
	#articleInfo16 .item .info h5,#articleInfo16 .item .info h3 { margin: 0 0 0 auto; padding: 10px 2%; width: 76%; }
	#articleInfo16 .item .info h3 { padding: 15px 2%; }
	#articleInfo16 .item:nth-child(2n) .info h5,#articleInfo16 .item:nth-child(2n) .info h3 { margin: 0 auto 0 0; }
	ul.spotList li {width: calc(100% - 15px);padding: 5px;cursor: pointer;}
	ul.spotList{
	    display: flex;
	    flex-direction: column;
	}
	ul.spotList li.gmapppof {
    height: 350px;
}
}

@media screen and (max-width: 640px) {
	ul.spotList li { width: calc(100% - 15px); }
	.button-container a{margin: 20px 10px 40px;}
}
@media screen and (max-width: 480px) {
	#articleInfo16 .item > div,#articleInfo16 .item:nth-child(2n) > div { float: none; }
	#articleInfo16 .item .photo { position: relative; margin: 0 auto 10px; width: 60%; display: block; }
	#articleInfo16 .item .info h5,#articleInfo16 .item .info h3,#articleInfo16 .item:nth-child(2n) .info h5,#articleInfo16 .item:nth-child(2n) .info h3 { margin: 0; padding: 10px 2%; width: 96%; }
}