/* BASIC css start */
/* =========================================================
   AKKINARA STORE GUIDE
========================================================= */

#akstore {
    width: 100%;
    max-width: 600px;

    margin: 0 auto;
    padding: 0 16px 40px;

    box-sizing: border-box;

    color: #252825;
}

#akstore,
#akstore * {
    box-sizing: border-box;
}

#akstore a {
    text-decoration: none;
}


/* =========================================================
   TITLE
========================================================= */

#akstore .akstore-title {
    margin: 0 -16px 18px;
    padding: 18px 16px;

    border-bottom: 1px solid #e4dfd8;

    background: #fff;
}

#akstore .akstore-title h3 {
    margin: 0;

    color: #252825;

    font-size: 20px;
    line-height: 1.4;
    font-weight: 700;
}


/* =========================================================
   INTRO
========================================================= */

#akstore .akstore-intro {
    margin-bottom: 28px;

    text-align: center;
}

#akstore .akstore-intro .eyebrow {
    display: block;

    margin-bottom: 5px;

    color: #8a5a44;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
}

#akstore .akstore-intro h2 {
    margin: 0 0 8px;

    color: #252825;

    font-size: 22px;
    line-height: 1.4;
    font-weight: 800;
}

#akstore .akstore-intro p {
    margin: 0;

    color: #777b77;

    font-size: 11px;
    line-height: 1.7;
}


/* =========================================================
   SECTION
========================================================= */

#akstore .akstore-section {
    margin-top: 32px;
}

#akstore .akstore-section-head {
    margin-bottom: 12px;

    text-align: center;
}

#akstore .akstore-section-head span {
    display: block;

    margin-bottom: 4px;

    color: #a07863;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .05em;
}

#akstore .akstore-section-head h4 {
    margin: 0;

    color: #5d4437;

    font-size: 17px;
    line-height: 1.5;
    font-weight: 700;
}

#akstore .akstore-section-head p {
    margin: 7px 0 0;

    color: #797b78;

    font-size: 10px;
    line-height: 1.65;
}


/* =========================================================
   PHOTO PLACEHOLDER
========================================================= */

#akstore .akstore-photo {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;
   

    padding: 10px;

    border: 1px dashed #cfc5bc;
    border-radius: 10px;

    background: #f8f5f1;

    color: #9a8b80;

    text-align: center;

    font-size: 11px;
    line-height: 1.6;
}



#akstore .akstore-photo-grid {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 7px;

    margin-top: 7px;
}

#akstore .akstore-photo-grid .akstore-photo {
    min-height: 145px;
}

#akstore .akstore-photo img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   STORE COPY
========================================================= */

#akstore .akstore-copy {
    margin: 10px 0 0;

    color: #777b77;

    font-size: 10px;
    line-height: 1.7;

    text-align: center;
}


/* =========================================================
   STORE INFO
========================================================= */

#akstore .akstore-info {
    overflow: hidden;

    margin-top: 12px;

    border: 1px solid #e4dfd8;
    border-radius: 10px;

    background: #fff;
}

#akstore .akstore-info-title {
    padding: 13px 14px;

    border-bottom: 1px solid #e4dfd8;

    background: #f8f5f1;

    color: #5f4539;

    font-size: 13px;
    font-weight: 700;
}

#akstore .akstore-info dl {
    display: grid;

    grid-template-columns: 76px 1fr;

    margin: 0;

    border-bottom: 1px solid #eee9e3;
}

#akstore .akstore-info dl:last-child {
    border-bottom: 0;
}

#akstore .akstore-info dt,
#akstore .akstore-info dd {
    margin: 0;
    padding: 11px 12px;

    font-size: 10px;
    line-height: 1.55;
}

#akstore .akstore-info dt {
    background: #faf8f5;

    color: #77716c;

    font-weight: 700;
}

#akstore .akstore-info dd {
    color: #454845;

    word-break: keep-all;
}


/* =========================================================
   ACTION BUTTONS
========================================================= */

#akstore .akstore-actions {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 7px;

    margin-top: 10px;
}

#akstore .akstore-actions a {
    display: flex;

    align-items: center;
    justify-content: center;

    height: 44px;

    border-radius: 7px;

    font-size: 11px;
    font-weight: 700;
}

#akstore .akstore-actions .primary {
    border: 1px solid #8a5a44;

    background: #8a5a44;

    color: #fff;
}

#akstore .akstore-actions .secondary {
    border: 1px solid #d9d2cb;

    background: #fff;

    color: #555854;
}


/* =========================================================
   STORE HOURS
========================================================= */

#akstore .akstore-hours {
    overflow: hidden;

    border: 1px solid #e4dfd8;
    border-radius: 10px;

    background: #fff;
}

#akstore .akstore-hours-row {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 12px;

    min-height: 46px;

    padding: 0 13px;

    border-bottom: 1px solid #eee9e3;
}

#akstore .akstore-hours-row:last-child {
    border-bottom: 0;
}

#akstore .akstore-hours-row strong {
    color: #555854;

    font-size: 11px;
    font-weight: 700;
}

#akstore .akstore-hours-row span {
    color: #8a5a44;

    font-size: 11px;
    font-weight: 700;

    text-align: right;
}

#akstore .akstore-hours-row .closed {
    color: #9a6761;
}


/* =========================================================
   MAP
========================================================= */

#akstore .akstore-map {
    overflow: hidden;

    width: 100%;
    height: 320px;

    border: 1px solid #e4dfd8;
    border-radius: 10px;

    background: #f5f5f5;
}

#akstore .akstore-map iframe {
    display: block;

    width: 100%;
    height: 100%;

    border: 0;
}


/* =========================================================
   DIRECTIONS
========================================================= */

#akstore .akstore-route {
    margin-top: 12px;
}

#akstore .akstore-route-card {
    margin-bottom: 8px;
    padding: 13px;

    border: 1px solid #e4dfd8;
    border-radius: 9px;

    background: #fff;
}

#akstore .akstore-route-card:last-child {
    margin-bottom: 0;
}

#akstore .akstore-route-card strong {
    display: block;

    margin-bottom: 5px;

    color: #8a5a44;

    font-size: 12px;
}

#akstore .akstore-route-card p {
    margin: 0;

    color: #666a66;

    font-size: 10px;
    line-height: 1.65;
}

#akstore .akstore-route-time {
    display: inline-block;

    margin-top: 7px;

    color: #317db5;

    font-size: 18px;
    line-height: 1.2;
    font-weight: 800;
}


/* =========================================================
   PARKING
========================================================= */

#akstore .akstore-parking {
    margin-top: 12px;
    padding: 15px 13px;

    border-radius: 10px;

    background: #f8f5f1;

    text-align: center;
}

#akstore .akstore-parking strong {
    display: block;

    margin-bottom: 7px;

    color: #8a5a44;

    font-size: 14px;
    line-height: 1.4;
}

#akstore .akstore-parking p {
    margin: 0;

    color: #656865;

    font-size: 10px;
    line-height: 1.7;
}

#akstore .akstore-parking .akstore-parking-tel {
    margin-top: 5px;
}

#akstore .akstore-parking a {
    color: #8a5a44;

    font-weight: 700;
}


/* =========================================================
   FAQ
========================================================= */

#akstore .akstore-faq {
    overflow: hidden;

    border: 1px solid #e4dfd8;
    border-radius: 10px;

    background: #fff;
}

#akstore .akstore-faq details {
    margin: 0;

    border-bottom: 1px solid #eee9e3;
}

#akstore .akstore-faq details:last-child {
    border-bottom: 0;
}

#akstore .akstore-faq summary {
    position: relative;

    display: block;

    padding: 14px 42px 14px 13px;

    color: #404440;

    font-size: 11px;
    line-height: 1.55;
    font-weight: 700;

    cursor: pointer;

    list-style: none;
}

#akstore .akstore-faq summary::-webkit-details-marker {
    display: none;
}

#akstore .akstore-faq summary::before,
#akstore .akstore-faq summary::after {
    position: absolute;

    top: 50%;
    right: 15px;

    width: 12px;
    height: 1px;

    background: #8a5a44;

    content: "";
}

#akstore .akstore-faq summary::after {
    transform: rotate(90deg);
}

#akstore .akstore-faq details[open] summary::after {
    transform: rotate(0deg);
}

#akstore .akstore-faq details[open] summary {
    color: #8a5a44;
}

#akstore .akstore-faq-answer {
    padding: 0 13px 14px;

    color: #777b77;

    font-size: 10px;
    line-height: 1.75;

    word-break: keep-all;
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width: 380px) {

    #akstore {
        padding-left: 12px;
        padding-right: 12px;
    }

    #akstore .akstore-title {
        margin-left: -12px;
        margin-right: -12px;

        padding-left: 12px;
        padding-right: 12px;
    }

    #akstore .akstore-photo-large {
        min-height: 230px;
    }

    #akstore .akstore-photo-grid .akstore-photo {
        min-height: 125px;
    }

    #akstore .akstore-map {
        height: 280px;
    }

}
/* BASIC css end */