/* top-footer */
.top-footer-wrap{padding:47px 0;border-bottom:10px solid #ffa200;background:url(../img/main/bg-top-footer01.gif) no-repeat 50% 50% / cover;}
.top-footer-box{margin:0 auto;max-width:1280px;}
.footer-quick-box > ul{display: flex;align-items: flex-start;flex-wrap: wrap;justify-content: space-between;}
.footer-quick-box > ul > li{position: relative;display: inline-block;padding:20px 10px 0;width:20%;box-sizing:border-box;}
.footer-quick-box > ul > li:nth-of-type(n):after{content:'';display:block;position:absolute;top:50%;right:0;width:1px;height:68px;background:url(../img/main/img-dotted02.png) repeat-y 0 0;transform:translateY(-50%);-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);}
.footer-quick-box > ul > li:nth-of-type(5n):after{display:none;}
.footer-quick-box > ul > li:last-of-type:after{display:none;}
.footer-quick-box > ul > li > a{display: block;position: relative;font-size: 18px;line-height: 26px;color: #fff;text-align: center;}
.footer-quick-box > ul > li > a:before{content:'';display:block;margin: 0 auto;width: 80px;height: 80px;border-radius:123px;background:#ececec;opacity:0.2;}
.footer-quick-box > ul > li > a:after{content:'';display:block;position:absolute;top:0;left: 50%;width: 80px;height: 80px;border-radius:123px;background-repeat:no-repeat;background-position:50% 50%;background-size: 50%;transform: translateX(-50%);}

.footer-quick-box > ul > li > a.play:after{background-image:url(../img/main/ico-foot-link01.png);}
.footer-quick-box > ul > li > a.book:after{background-image:url(../img/main/ico-foot-link04.png);}
.footer-quick-box > ul > li > a.school:after{background-image:url(../img/main/ico-foot-link03.png);}
.footer-quick-box > ul > li > a.face:after{background-image:url(../img/main/ico-foot-link02.png);}
.footer-quick-box > ul > li > a:hover:before{background:#ffa200;opacity:1;}
.footer-quick-box > ul > li > a.play:hover:after{background-image:url(../img/main/ico-foot-link01-on.png);}
.footer-quick-box > ul > li > a.book:hover:after{background-image:url(../img/main/ico-foot-link04-on.png);}
.footer-quick-box > ul > li > a.school:hover:after{background-image:url(../img/main/ico-foot-link03-on.png);}
.footer-quick-box > ul > li > a.face:hover:after{background-image:url(../img/main/ico-foot-link02-on.png);}
.footer-quick-box > ul > li > a span{position: relative;display: inline-block;padding: 20px 0 0 0px;min-height:44px;text-align: center;font-size: 17px;line-height: 22px;}


@media screen and (max-width: 1280px) {
	/* top-footer */
	.footer-quick-box > ul > li{width:25%;}
	.footer-quick-box > ul > li:nth-of-type(n):after{content:'';display:block;position:absolute;top:50%;right:0;width:1px;height:68px;background:url(../img/main/img-dotted02.png) repeat-y 0 0;transform:translateY(-50%);-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);}
	.footer-quick-box > ul > li:nth-of-type(4n):after{display:none;}
	.footer-quick-box > ul > li:last-of-type:after{display:none;}

}
@media screen and (max-width: 1024px) {
	/* top-footer */
	.top-footer-wrap{padding:0;}
	.footer-quick-box > ul > li{padding:35px 20px;width:50%;float: left;box-sizing:border-box;}
	.footer-quick-box > ul > li:nth-of-type(n):after{display:none;}
	.footer-quick-box > ul > li:first-of-type:after{display:block;top: 150%;height: 400px;}
	.footer-quick-box > ul{position:relative;}
	.footer-quick-box > ul:before{content:'';display:block;position:absolute;top: 33%;left:50%;width: 60%;height:1px;background:url(../img/main/img-dotted03.png) repeat-x 0 0;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:transform:translate(-50%,-50%);}
	.footer-quick-box > ul > li > a{font-size:16px;line-height:24px;}

	.footer-quick-box{position:relative}
	.footer-quick-box:before {content: '';display: block;position: absolute;top: 67%;left: 50%;width: 60%;height: 1px;background: url(../img/main/img-dotted03.png) repeat-x 0 0;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);}
}
@media screen and (max-width: 768px) {
	/* top-footer*/
	.footer-quick-box > ul:before{top: 34%;}
	.footer-quick-box > ul > li{padding:20px 10px;}
	.footer-quick-box > ul > li > a{font-size:14px;line-height:22px;}
	.footer-quick-box > ul > li > a span{padding:10px 0 0;min-height:unset;font-size:15px;line-height:20px;}
}