@media only screen and (min-width : 501px) {
body {
background: url("images/pc_bg.jpg") no-repeat top center;
background-size: cover;
background-attachment: fixed;
}
}
main{
background: #fff;
}
.main-kv{
width: 100%;
position: relative;
}
.main-ttl{
position: absolute;
width: 100%;
text-align: center;
top: 23%;
left: 0;
}
.main-ttl img{
width: 76%;
}
.main-lead{
position: absolute;
width: 94%;
left: 3%;
bottom: 4%;
background: #45ae34;
border-radius: 2.6vw;
padding: 4% 3%;
}
.main-lead p{
color: #fff;
font-weight: 500;
font-size: clamp(12px, 3.2vw, 16px);
}

.anchor-box{
width: 90%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 5% 0;
}
.anchor-once{
width: 47.5%;
}


.sec01{
padding: 5% 5%;
background: url("images/sec01_bg.jpg") no-repeat top center;
background-size: cover;
}
.sec02{
padding: 5% 5%;
background: url("images/sec02_bg.jpg") no-repeat top center;
background-size: cover;
}
.sec03{
padding: 5% 5%;
background: url("images/sec03_bg.jpg") no-repeat top center;
background-size: cover;
}
.sec04{
padding: 5% 5%;
background: url("images/sec04_bg.jpg") no-repeat top center;
background-size: cover;
}
.sec05{
padding: 5% 5%;
background: url("images/sec05_bg.jpg") no-repeat top center;
background-size: cover;
}
.sec06{
padding: 5% 5%;
background: url("images/sec06_bg.jpg") no-repeat top center;
background-size: cover;
}
.gr-box{
position: relative;
margin: 0 0 6%;
}
.gr01{
position: absolute;
width: 85%;
bottom:6%;
left: 6.8%;
}
.gr02{
position: absolute;
width: 87%;
bottom:6.5%;
left: 4.4%;
}
.gr03{
position: absolute;
width: 86%;
bottom:6.5%;
left: 5.9%;
}
.gr04{
position: absolute;
width: 87%;
bottom:6.5%;
left: 5.15%;
}
.gr05-1{
position: absolute;
width: 89%;
top:32%;
left: 5.4%;
}
.gr05-2{
position: absolute;
width: 86%;
top:8.3%;
left: 5.4%;
}
.gr05-3{
position: absolute;
width: 86%;
top:8.8%;
left: 5.4%;
}
.gr06{
position: absolute;
width: 83%;
bottom:6.5%;
left: 8.5%;
}
.gr01-ill{
position: absolute;
width: 23%;
bottom: -3%;
right: 5.5%;
}
.gr02-ill{
position: absolute;
width: 24%;
bottom: -2%;
right: 8%;
}
.gr03-ill{
position: absolute;
width: 25.7%;
bottom: -1%;
right: 8%;
}
.gr04-ill{
position: absolute;
width: 23.7%;
bottom: -5%;
right: 9%;
}
.gr05-ill{
position: absolute;
width: 36.5%;
bottom: -11.5%;
right: 2%;
}
.gr06-ill{
position: absolute;
width: 29.5%;
bottom: 0.5%;
right: 3.5%;
}
.comment-box{
display: flex;
justify-content: space-between;
}
.comment-av{
width: 17.5%;
}
.comment-text-box{
width: 80%;
}
.add-t1{
padding: 0 17% 0 2%;
}
.add-t2{
padding: 0 2% 0 2%;
}
.comment-text-box p{
background: #fff;
padding: 4% 4%;
font-size: clamp(12px, 3vw, 15px);
line-height: 1.5;
border-radius: 2.6vw;
position: relative;
z-index: 1;
}
/*
.comment-text-box p::after{
position: absolute;
content: '';
width: 7%;
height: 80%;
left: -4%;
top:15%;
background: url("images/arrow-t01.svg") no-repeat top center;
background-size: 100% auto;
z-index: 0;
}
*/
.comment-text-box p span{
font-size: clamp(12px, 3vw, 15px);
color: #45ae34;
font-weight: 700;
}
.sec06-sub-ttl{
background: #ffff00;
font-weight: 700;
font-size: clamp(12px, 5.1vw, 25px);
text-align: center;
border-radius: 100px;
line-height: 1.4;
padding: 2% 0;
}

.sec05 .comment-box{
position: absolute;
width: 90%;
left: 5%;
bottom: 7%;
display: flex;
justify-content: space-between;
}
.comment-av.add-ajust{
width: 22%;
}
.comment-text-box.add-ajust{
width: 84%;
}
.add-t2{
padding: 0 0 0 2%;
}
.add-t3{
padding: 0 0 0 14%;
}
.sec05 .comment-text-box p{
background: none;
padding: 0 0 0 2%;
font-size: clamp(12px, 3vw, 15px);
line-height: 1.5;
}
.ill-av01{
width: 100%;
position: relative;
left: -10%;
}
.ill-av02{
width: 106%;
position: relative;
right: -10%;
}
.ill-av03{
width: 100%;
position: relative;
left: -18%;
}


@media only screen and (min-width : 501px) {
.main-lead,
.comment-text-box p{
border-radius: 16px;
}
}