.wow {
	animation-name: fadeInDown;
	-webkit-animation-name: fadeInDown;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;	
}

#articleInfo7 {
	position: relative;
	display: grid;
	grid-template-columns: 60% 35%;
	align-items: center;
	justify-content: space-between;
}
#articleInfo7 .lefeBox  * {transition: unset;-webkit-transition:unset;}
#articleInfo7 .lefeBox{position:relative;-webkit-animation-name: fadeInLeft;}
#articleInfo7 .nowrap_box.arrow_box {width: 90%;display: flex;justify-content: space-between;position: absolute;z-index: 20;left: 5%;bottom: calc(20% - 35px);padding: 0;}
#articleInfo7 .arrow_box a {position: relative;box-sizing: border-box;width: 70px;height: 70px;display: flex !important;background: rgb(39 37 38 / 25%);border-radius: 50px;align-items: center;justify-content: center;}
#articleInfo7 .arrow_box a svg{width: 30px;fill: var(--white);}
#articleInfo7 .arrow_box a.prev {-webkit-transform: scaleX(-1);transform: scaleX(-1);}

#articleInfo7 .photoBox {
}

#articleInfo7 .photoBox img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}


#articleInfo7 .info {-webkit-animation-name: fadeInRight;}
#articleInfo7 .info h5 {font-size: 19px;color: #53545e;font-weight: 400;display: flex;flex-wrap: wrap;align-items: center;position: relative;}
#articleInfo7 .info h5:after{content:'';position: absolute;left: 0;height: 3px;width: 50px;background: var(--secondary);}
#articleInfo7 .info h5:before{content:'';background: #cec9c9;width: 120px;height: 1px;margin-right: 15px;}

#articleInfo7 .info h3 {
	font-size: 35px;
	color: #2d2c2c;
	margin-bottom: 20px;
	font-weight: 500;
	letter-spacing: 2px;
}
#articleInfo7 .info h3:first-letter{color:var(--secondary)}

#articleInfo7 .info p {
	font-size: 18px;
	animation-name: fadeInRight;
	-webkit-animation-name: fadeInRight;
	display: flex;
	align-items: center;
	margin: 6px 0;
}
#articleInfo7 .info p svg{
    width: 20px;
    height: 20px;
    margin-right: 10px;
    fill: #c5c0c0;
}
#articleInfo7 .info article {
	margin: 30px 0 10px 20px;
	line-height: 180%;
	animation-name: fadeInUp;
	-webkit-animation-name: fadeInUp;
}
#location_info img{width:100%}
#location_info .box{
    margin: 40px 0;
}
#location_info .trinfo p{
    margin: 10px 0 30px;
}
#location_info .box h3 {
	padding: 15px 0;
	font-size: 22px;
	color: #3f3d3c;
	text-align: center;
	font-weight: 500;
	letter-spacing: 2px;
}
#location_info .box a.ask{
    display: block;
    width: 200px;
    padding: 15px 0;
    margin: 5px auto;
    border-radius: 10px;
}
#location_info .box h3:after{content:'';display: block;width: 35px;height: 1px;background: #474849;margin: 15px auto 1.5vw;}
#location_info .box h5{background: #dfdfdf;padding: 10px 20px;font-size: 18px;font-weight: 400;margin-bottom: 15px;}
#location_info .box .infoo{display:grid;grid-template-columns: repeat(4, 1fr);margin: 15px 0 20px;}
#location_info .box .infoo p{border-left: 4px solid #dfdfdf;padding-left: 15px;margin: 10px 0;}


@media screen and (max-width: 1024px) {
	#articleInfo7{
    display: block;
}
	#articleInfo7 .info{margin-top:40px}
}
@media screen and (max-width: 768px) {
	#location_info .box .infoo{
    grid-template-columns: repeat(3, 1fr);
}
}


/* +width:480 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
	#location_info .box .infoo{
    grid-template-columns: repeat(2, 1fr);
}
}