
.gua_a{
    padding: var(--pdy) var(--pdx) 0;
}
.gua_a01{
    text-align: center;
}
.gua_a01 > p::before{
    content: '';
    display: block;
    max-width: 8px;
    height: 8px;
    background-color: var(--colorMain);
    margin: 5px auto calc(.5vw + 30px);
    border-radius: 50px;
    animation: jump_effect 1s infinite linear;
}
.gua_a01 > p{
    line-height: 200%;
    letter-spacing: 0.1em;
    font-size: var(--f20);
    font-family: var(--Seriffont);
}
.gua_a01 > i{
    display: block;
    max-width: 1px;
    height: clamp(50px,15vw,180px);
    margin: calc(1vw + 30px) auto;
    background-color: var(--colorOther);
}
.gua_a > dl{
    display: flex;
    justify-content: center;
    align-items: center;
}
.gua_a > dl dd{
    width: 480px;
    margin: 0 8% 0 0;
}
.gua_a > dl dd p{
    letter-spacing: 0.1em;
}
.gua_a > dl dt{
    overflow: hidden;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.gua_b{
    padding: 0 5vw 0 5%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 30px auto 0;
}
.gua_b::before{
    content: '';
    width: 100%;
    height: 1px;
    background-color: var(--colorOther);
    margin: 0 30px 0 0;
}
.gua_b h4{
    font-size: var(--f120);
    color: var(--colorMain);
    font-family: var(--Cormfont);
    min-width: fit-content;
}
.gua_c{
    padding: var(--pdy) var(--pdx);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
}
.gua_c > figure{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: calc(100%/5 - 2%);
    margin: 2% 1%;
}
.gua_c > figure:nth-of-type(even){
    transform: translateY(-2vw);
}
.gua_c > figure > img{
    overflow: hidden;
    border-radius: 30px;
}
.gua_c > figure figcaption{
    margin: 0 0 0 15px;
}
.gua_c > figure figcaption p{
    letter-spacing: 0.1em;
    writing-mode: vertical-rl;
}

.gua_d{
    padding: calc(var(--pdy)*3) var(--pdx);
    background: url(../edit_image/about/gu_bg01.jpg);
    background-position: center;
    background-size: cover;
    text-align: center;
}
.gua_d > p{
    font-size: var(--f20);
    color: var(--colorText-white);
    letter-spacing: 0.1em;
    font-family: var(--Seriffont);
    line-height: 200%;
}

/* --- Media Queries --- */
@media (max-width: 1440px) {
    .gua_c > figure{width: calc(100%/3 - 2%);}
}
@media (max-width: 1024px) {}
@media (max-width: 992px) {
    .gua_a > dl{flex-direction: column;}
    .gua_a > dl dd{margin: 0 0 30px;}
}
@media (max-width: 768px) {
    .gua_c{justify-content: space-between;}
    .gua_c > figure{width: calc(100%/2 - 2%);}
}
@media (max-width: 576px) {}
@media (max-width: 480px) {
    .gua_c > figure{width: 100%;}
}
@media (max-width: 375px) {
    .gua_c > figure{flex-direction: column;margin:30px auto;max-width: fit-content;}
    .gua_c > figure figcaption{margin:15px auto 0;}
    .gua_c > figure figcaption p{writing-mode: unset;text-align: center;}
}