@charset "UTF-8";
section{position: relative;}
.top_title p{
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 144px;
letter-spacing: 0.01em;
color: #E4E4E4;
position: absolute;
z-index: 0;
line-height: 1em;
display: block;
opacity: 0.2;
}
h2 {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
text-align: center;
font-size: 30px;
font-weight: 700;
}

.beginning-part{
width: 90%;
max-width: 1080px;
margin: 80px auto;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
text-align: center;
}
#donation{padding: 100px 0;}
.donation__ttl p{
margin: 30px 0 60px 0;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 20px;
text-align: center;
}
#donation .top_title p{top: 0;left: 0;}
.donation__contents{
width: 90%;
max-width: 1080px;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 80px;
}
.donation__contents dt,.donation__contents dd{
width: 46%;
height: auto;
text-align: center;
color: #fff;
position: relative;
padding-bottom: 30px;
}
.donation__contents dt:before,.donation__contents dd:before{
content: "";
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 154px;
display: block;
position: relative;
margin-bottom: 30px;
}
.donation__contents dt:after,.donation__contents dd:after{
content: "";
width: 100%;
height: 75px;
position: absolute;
top:80px;
left: 0;
z-index: 0;
}
.donation__contents dt{background-color: #0071BB;}
.donation__contents dt:before{background-image: url("../images/top/cv_b.png");}
.donation__contents dt:after{background: linear-gradient(0deg, rgba(0,113,187,1) 0%,rgba(15,121,191,0.6) 40%, rgba(255,255,255,0) 70%);}
.donation__contents dd{background-color: #20B14A;}
.donation__contents dd:before{background-image: url("../images/top/cv_g.png");}
.donation__contents dd:after{background: linear-gradient(0deg, rgba(32,177,74,1) 0%,rgba(37,88,52,0.6) 40%, rgba(255,255,255,0) 70%);}
.donation__contents h3{
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 22px;
letter-spacing: 0.01em;
margin-bottom: 10px;
}
.donation__contents strong{font-size: 16px;font-weight: 700;}
.donation__contents p{font-size: 14px;line-height: 1.92em;}
.donation__contents p span{display: block;font-size: 12px;}
.donation__contents dt img {
width: 105px;
height: auto;
display: block;
margin: 10px auto 0 auto;
}
.donation__contents--link{
font-size: 12px;padding-bottom: 10px;
color: #fff;
font-weight: 500;
text-decoration: underline;
}
.apply,.contact_address{
width: 95%;
max-width: 1000px;
margin: 0 auto;
}
.apply h3,.contact_address h3{
font-size: 25px;
border-bottom: 1px solid #000;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
line-height: 4rem;
}
h4{
padding: 20px 0 10px 0;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 22px;
}
.page-donation .apply__monthly .btn{margin-top: 20px;}
.apply__monthly h5{
color: #0071BB;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 16px;
font-weight: 700;
}
.apply__one-off h5{
color: #20B14A;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 16px;
font-weight: 700;
}
.apply__one-off span{font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;font-weight: 700;}
.contact_address{margin-top: 80px;}
.contact_address__btn--phone,.contact_address__btn--mail{
position: relative;
padding-left: 50px;
max-width: 300px;
}
.contact_address__btn--phone::before{
background-image: url(../images/donation/phone.svg);
width: 30px;
height: 30px;
content: "";
background-repeat: no-repeat;
display: block;
position: absolute;
left: 70px;
top: 20px;
}
.apply__one-off{margin-top: 50px;}
.contact_address p a{text-decoration: underline;}
.contact_address__btn{display: flex;margin-top: 20px;}
.contact_address__btn--mail::before{
background-image: url(../images/donation/mail.svg);
width: 40px;
height: 30px;
content: "";
background-repeat: no-repeat;
display: block;
position: absolute;
left: 40px;
top: 20px;
}
.contact_address h5{
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;
font-size: 18px;
padding: 1em 0;
}
.contact_address__btn--phone{margin-right: 50px;}
.contact_address p{margin-top: 30px;font-weight: 400;}
.contact_address p span{font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", serif;font-size: 16px;}
.contact_address{margin-bottom: 100px;}

@media only screen and (max-width: 950px) {
#donation {
padding: 30px 0 100px 0;
margin-top: -30px;
overflow-x: hidden;
}
#donation .top_title p {
position: static;
margin-bottom: 20px;
font-size: 16.5vw;
}
.donation__ttl p {
font-size: 14px;
margin: 10px 0 30px 0;
padding: 0 2.5%;
}
.donation__contents {gap: 30px;}
.donation__contents dt, .donation__contents dd {width: 100%;}
}

@media only screen and (max-width: 768px) {
.page-donation .btn{
display: block;
max-width: 300px;
margin: 20px auto 0 auto;
}
.contact_address__btn{flex-direction: column;}
.contact_address__btn--phone {margin-right: 0px;}
.contact_address__btn--mail{margin-top: 20px;}
}