@charset "utf-8";

/* family */

#family{
padding: 3% 0 5% 0;
}
#family .family-area{
padding:7% 10% 3%;
}
#family .family-area-top{
/* position: relative;
flex-wrap: wrap;
display: flex;
justify-content: space-between; */
padding:0 0 30px 0;
}
.family-text-wrapper{
width:100%;
height:400px;
background:url("../../family/img/family-main.jpg") no-repeat;
background-size: 50%;
background-position:right 0% bottom 70%;
/* padding:0 0 5% 0; */
}

#family .family-area section{
width:100%;
}
#family .family-area section h2{
line-height:1.35;
}
#family .family-area .midashi{
font-size:2.5rem;
line-height:1.35;
font-weight:bold;
word-break:break-all;
text-align:justify;
margin-bottom:20px;
filter: drop-shadow(0px 0px 2px #000);
}
#family .family-area section h3{
font-size:clamp(1.2rem, 1.14rem + 0.3vw, 1.35rem);
line-height:1.7;
margin-bottom:30px;
filter: drop-shadow(0px 0px 2px #000);
}
#family .family-area section .tips {
width:100%;
margin:20px 0;
}
#family .family-area section li{
width:100%;
padding:15px 30px;
margin: 15px 0;
border-radius:50px;
}
#family .family-area section li p{
font-size:1.2rem;
line-height:1.5;
text-align:center;
font-weight:bold;
}

/* page-gallery */

#page-gallery{
margin: 0 0 0 0;
}
#page-gallery li{
width:100%;
overflow: hidden;
}
#page-gallery li .green{
background:#00bfa6;
padding:10px 20px;
}
#page-gallery li p{
font-size:1rem;
line-height:1.5;
font-weight:bold;
text-align:center;
}
#page-gallery li p span{
font-size:0.8rem;
font-weight:bold;
display:block;
}


@media screen and (max-width:1280px) {
#family .family-area{
padding:8% 8% 3%;
}
}

@media screen and (max-width:1024px) {
#family .family-area{
padding:8% 8% 3%;
}
.family-text-wrapper{
height:350px;
background-position:right 0% bottom 70%;
}
}
@media screen and (max-width:960px) {
#family .family-area{
padding:10% 5% 0;
}
.family-text-wrapper{
height:auto;
background:none;
margin: 0 auto 50px;
}
#family .family-area section{
width:100%;
margin: 5% auto 25px;
padding: 0 10%;
text-align:center;
}
#family .family-area .midashi{
text-align:center;
}
#page-gallery li p{
font-size:0.85rem;
line-height:1.5;
}
}
@media screen and (max-width:840px) {
.family-text-wrapper{
/* height:47vh; */
}
#family .family-area section{
padding: 0 8%;
}
}

/* 端末横向き処理 */
@media (orientation: landscape) and (max-width: 960px){
#family .family-area section{
padding: 0 15px;
}
#family .family-area .midashi .w440-block{
display:none;
}
#family .family-area section h3 .w440-block{
display:none;
}
}

@media screen and (max-width:640px) {
#family{
padding: 0;
}
#family .family-area section{
margin: 20% auto 25px;
padding: 0 5%;
}
#family .family-area .midashi{
font-size:2rem;
line-height:1.35;
}
#family .family-area section h3{
/* font-size:1.5rem; */
line-height:1.5;
}
}

@media screen and (max-width:440px) {
#family{
padding: 0 0 50px 0;
}
#family .family-area section h3{
font-size:1rem;
line-height:1.8;
}
}