@charset "utf-8";

.familysite_wrap{background-color:#232321;text-align:center;}
.familysite_wrap section .contents-title{position:relative;color:#fff;font-size: 50px; line-height:1.25;z-index:9;}
.familysite_wrap section .contents{width:1080px;margin:auto;}

.familysite_wrap .familysite-top{padding:180px 0 140px;}
.familysite_wrap .familysite-site:nth-child(n+3) {margin-top: 165px;}
.familysite_wrap .familysite-site:last-child {padding-bottom: 135px;}
.familysite_wrap .familysite-site .contents{width:100%;margin-top:-20px;padding-bottom: 85px; background-color:#1c1c1a;}
.familysite-site .familysite-list{width:1080px; padding-top:90px;margin:auto;font-size:0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.familysite-site .familysite-list li{display:inline-block;width:calc(33.3333% - 10px);height: 240px;margin-bottom: 20px;}
.familysite-site .familysite-list li a{width: 100%; height: 100%; display: flex;align-items: center; text-align:center;transition: all 300ms ease;background-color: #282828} 
.familysite-site .familysite-list li a:hover{background-color: #fff;}
.familysite-site .familysite-list li a:hover span{color: #000;}
.familysite-site .familysite-list li span{font-size:17px;color:#fff;line-height:1.8;margin: 0 auto;}

@media screen and (max-width: 1440px){
	.familysite_wrap section .contents{width:100%;}
	.familysite-site .familysite-list{max-width:95%;}
}
@media (max-width: 1080px){
	.familysite_wrap section .contents-title{font-size:5vw;}
	.familysite_wrap .familysite-top{padding:140px 0 85px;}
	.familysite-site .familysite-list li{width:calc(50% - 8px); height: 200px;margin-bottom: 16px;}
}
@media screen and (max-width: 768px){
	.familysite_wrap section .contents-title{font-size:9vw;}
	.logo.about img{width:12vw;}
	.familysite-site .familysite-list li{width:100%; height: 100px; margin-bottom: 8px;}
	.about .logo img {width: 12vw;}
	
}

@media screen and (max-width: 768px) and (orientation: landscape){
	.about .logo img {width: 12vw;}
}