@charset "UTF-8";
/* contact */

.contact__head { font-size: 1.6rem!important; color: var(--pink);}
.contact__item { margin-top: 24px;}
.contact__item dt { font-weight: 500;}
.contact__item dd { text-align: center; margin: 32px auto 0;}

.contact__item dd .phone-no { font-size: 24px; }
.contact__item .btn--primary { margin:auto;}
.contact__time {
    width: 256px;
    display: block;
    border: solid 1px var(--pink02);
    border-radius: 20px;
    font-size: 13px;
    line-height: 24px;
    text-align: center;
    margin: 16px auto 0;
}
.contact__item.contact__item--mail { margin-top: 32px;}
.contact__item.contact__item--mail dd{ text-align: left;}
.icon-hl:before { background-color: var(--pink);}
@media (max-width: 599px){.contact {padding-left: 8px;}}
@media (min-width: 768px){
.contact__item {
    display: grid;
    gap:32px;
    grid-template-columns: repeat(9, 1fr);
    align-items: start;
    }
    .contact__item + .contact__item { margin-top: 48px;}
    .contact__item dt { grid-column: 1 / span 3;}
    .contact__item dd { grid-column: 5 / span 3; text-align: center; margin: auto;}
    .contact__item.contact__item--mail dt { grid-column: 1 / span 2;}
    .contact__item.contact__item--mail dd { grid-column: 4 / -1; margin: 0;}
}
@media (min-width: 960px){
  .contact {padding-left: 32px;}
    .contact__time{width: 280px;}
    .contact__item.contact__item--mail dt {
        grid-column: 1 / span 3;
    }}