@charset "utf-8";
.content__hero{
    background-image: url(../images/hero.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    width:calc((100% - var(--break-point)) / 2 + var(--break-point));
/* 	width:100%; */
    height: 70vh;
    margin-left:calc((105% - var(--break-point)) / 2);
    position: relative;
}
.content__all{
    position: absolute;
    left:-5%;
    top:50px;
}
.content__copy{
    font-size: clamp( 2rem, calc( 1rem + 4vw ), 4rem );
    font-weight: normal;
    color: var(--main-color);
}
.content__copy span{
    width: fit-content;
    display: block;
    background-color: white;
    padding: 20px;
    margin-top: 30px;

}
.content__lead {
    font-size:clamp( 1rem, calc( 0.53125rem + 1.875vw ), 1.9375rem );
    font-weight: normal;
    color: var(--main-color);  
}
.content__lead span{
    width: fit-content;
    display: block;
    background-color: white;
    padding: 20px;
    margin-top: 30px;
}

.content__iconAll{
    width: 80%;
    margin: 20px auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.content__item{
    color: var(--main-color);
    text-align: center;
    font-size: 1rem;
}
.content__item p{
    margin: 5px 0;
}

.aboutArea,.magazinArea{
    padding-top: 50px;
    background-color:var(--bg2-color);

}
.aboutArea .content__title,.magazinArea .content__title {
      background-color:var(--bg2-color);
}
.newsArea .content__title {
      background-color:white;
}
.aboutArea .content__lead{
    background-color: white;
    font-size: 1rem;
    width: 40%;
    padding: 30px;
    position: absolute;
    right: calc((100% - var(--break-point)) / 2);
    top:40px;
}
.aboutArea .content__image {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.aboutArea .content__image--item {
    text-align: center;
    color: var(--main-color);
}

/* 1個目の画像のサイズ固定 */
.content__image--item:nth-child(1) img {
    width: 500px; 
    height: auto;
}

/* 3個目の画像のサイズ固定 */
.content__image--item:nth-child(3) img {
    width: 500px;
    height: auto;
}


.aboutArea .content__image--item p {
    margin: 10px 0;
}
.newsArea {
  background-color:white;
}

@media (max-height: 1200px) {
  body .content__hero {
    height: 550px !important; /* 優先度を強制 */
  }

	
}

@media (width < 1200px) {
        .linkbtn{
        width: 90%;
        margin: 30px auto;
    }
    .content__all {
        position: relative;
        left:0;
        top:30px;
    }
    .content__copy span {
        margin-top: 15px;
    }
    .content__hero {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        width: 100%;
        height: 60vh;
        margin-left: 0;
        position: relative;
    }
    .content__copy {
        font-size:clamp(2rem, calc(1rem + 0.625vw), 4rem);
    }
	
.aboutArea .content__lead {
    font-size: clamp(1rem, calc(0.7rem + 0.5vw), 2rem); /* 少し小さめ */
  }
	
    .aboutArea .content__lead {
        position: relative;
        left: 0;
        top:0;
        width: 90%;
		padding: 20px;
		margin:20px auto;
    }
    .aboutArea .content__image {
		margin-top:60px;
        align-items: flex-start;
    }
    .content__iconAll{
        flex-wrap: wrap;
        row-gap: 1rem;
    }
    .content__item{
        width: 40%;
        padding: 5%;
    }
	
    .newslist{
        flex-direction: column;
        gap:1rem;
    }
    .date{
        width: fit-content;
    }
    .magazinItem{
        flex-direction: column;
        padding: var(--resp-padding);
    }
    .magazinItem h3{
        margin: 10px 0;
    }
}


@media (width < 780px) {
    .content__hero {
        background-image: url(../images/sm-hero.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        width: 100%;
        height: 90vh;
        margin-left: 0;
        position: relative;
    }
	
	  .aboutArea .content__lead {
        position: relative;
        left: 0;
        top:0;
        width: 100%;
		padding: 20px;
		margin:20px auto;
    }
}
