@charset "utf-8";

.contact03 .contact__didscription {
    color: var(--text-color);
}
.contact03__list {
    display: grid;
    gap    : 27px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 20px;
}
.contact03__list:has(> li:last-of-type:nth-of-type(1)){
    display        : flex;
    justify-content: center;
}
.contact03__list:has(> li:last-of-type:nth-of-type(1)) li {
    width: calc(100% / 2);
}
.contact03__list:has(> li:last-of-type:nth-of-type(even)){
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.contact03__list:has(> li:last-of-type:nth-of-type(6)){
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.contact03__card {
    background-color: #fff;
    box-shadow: var(--box-shadow);
    padding: 30px 20px;
}
.contact03__list:has(> li:nth-of-type(5)){
    display        : flex;
    flex-wrap      : wrap;
    justify-content: center;
}
.contact03__list:has(> li:nth-of-type(5)) li {
    flex: 1;
    min-width: 362px;
    max-width: 362px;
}
.contact03__ttl {
    margin: 0 0 20px;
    display        : flex;
    gap            : 5px;
    align-items    : center;
    justify-content: center;
    font-size  : 20px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}
.contact03__ttl svg {
    width: 20px;
    height: 20px;
    margin: -4px 0 0;
}
.contact03__side {
    display: flex;
    gap    : 2px;
}
[class*="contact03__btn--"]{
    flex: 1;
    height: 60px;
    border-radius: 3px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-size  : 18px;
    font-weight: 700;
}
.contact03__btn--sub {
    color: var(--sub-font-color);
}
.contact03__btn--main {
    color: var(--main-font-color);
}
.contact03__btn--tel {
    border: 2px solid #D4D4D4;
    font-size: 20px;
    color: var(--text-color);
}
.contact03__btn--sub {
    background-color: var(--sub-color);
}
.contact03__btn--main {
    background-color: var(--main-color);
}
.contact03__btn--line {
    background-color: var(--sns-line);
}
.sns-list {
    display        : flex;
    gap            : 20px;
    align-items    : center;
    justify-content: center;
}