/* ===================================
   Asitano.jp カスタムヘッダー & インフォメーションバー
   =================================== */

/* インフォメーションバーのカスタマイズ */
.o--informationbar.d--information-type-textonlywithlink {
    padding: 0px 40px !important;
    background-color: #1d98b7 !important;
}

.o--informationbar.d--information-type-textonlywithlink a {
    color: #fff !important;
    text-decoration: none !important;
}

.c--informationbar {
    text-align: left !important;
    justify-content: flex-start !important;
}

/* 新しいヘッダースタイル */
#commonHeader,
.l-header,
header,
#commonHeader.d--transparent {
    background-color: #fff !important;
    background: #fff !important;
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
}

/* ヘッダー背景のグラデーション等を無効化 */
.a--header-style-parts {
    display: none !important;
}

.l-header__inner {
    position: relative;
    width: 100%;
    color: var(--color_header_text, #333);
    z-index: 1;
}

.l-container {
    margin-left: auto;
    margin-right: auto;
    max-width: calc(1200px + 64px);
    padding-left: 32px;
    padding-right: 32px;
}

/* デスクトップヘッダー */
@media (min-width: 960px) {
    .l-header__inner {
        align-items: stretch;
        display: flex;
        justify-content: space-between;
    }
}

/* ロゴスタイル */
.l-header__logo {
    display: flex;
    align-items: center;
}

.c-headLogo {
    margin: 0;
}

.c-headLogo__link {
    display: block;
    text-decoration: none;
}

.c-headLogo__img {
    display: block;
    height: auto;
    max-width: 100%;
}

@media (min-width: 960px) {
    .c-headLogo__img {
        max-width: 142px !important;
        height: 40px !important;
    }
}

@media (max-width: 959px) {
    .c-headLogo__img {
        max-width: 160px;
        height: auto;
    }
}

/* グローバルナビゲーション */
#globalMenu {
    display: flex !important;
    align-items: center !important;
    margin-left: auto !important;
}

@media (max-width: 959px) {
    #globalMenu {
        display: none !important;
    }
}

.l-header__gnav {
    display: flex !important;
    align-items: center !important;
}

@media (min-width: 960px) {
    .l-header__gnav {
        display: flex !important;
        align-items: center !important;
    }
}

.c-gnav {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
}

.c-gnav > li {
    position: relative;
    margin: 0;
    padding: 0;
}

#commonHeader .c-gnav > li > a,
#commonHeader .c-gnav > li > a:link,
#commonHeader .c-gnav > li > a:visited {
    display: block !important;
    padding: 32px 20px !important;
    color: #333 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.3s ease !important;
}

#commonHeader .c-gnav > li > a .ttl,
#commonHeader .c-gnav > li > a:link .ttl,
#commonHeader .c-gnav > li > a:visited .ttl {
    color: #333 !important;
}

.c-gnav > li > a:hover {
    color: #1d98b7;
}

.c-gnav .ttl {
    display: block;
}

/* ドロップダウンメニュー */
.c-gnav .sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    list-style: none;
    margin: 0;
    padding: 10px 0;
    min-width: 250px;
    z-index: 1000;
}

.c-gnav li:hover > .sub-menu {
    display: block;
}

.c-gnav .sub-menu li {
    margin: 0;
    padding: 0;
}

#commonHeader .c-gnav .sub-menu li a,
#commonHeader .c-gnav .sub-menu li a:link,
#commonHeader .c-gnav .sub-menu li a:visited {
    display: block !important;
    padding: 12px 20px !important;
    color: #333 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: background-color 0.3s ease !important;
}

.c-gnav .sub-menu li a:hover {
    background-color: #f5f5f5;
}

/* 検索とハンバーガーメニューのスタイル調整 */
#headerSearch {
    display: flex;
    align-items: center;
}

/* PCで検索バーを非表示 */
@media (min-width: 960px) {
    #headerSearch {
        display: none !important;
    }
}

#headerSearchIcon {
    cursor: pointer;
    font-size: 20px;
    color: #333;
}

/* スマホビュー */
@media (max-width: 959px) {
    .l-header__inner {
        align-items: center;
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
    }

    .l-container {
        padding-left: 16px;
        padding-right: 16px;
    }

    /* スマホでインフォメーションバーを非表示 */
    .o--informationbar.d--information-type-textonlywithlink {
        display: none;
    }
}

/* スマホでのヘッダー調整 */
@media (max-width: 959px) {
    #commonHeaderInner {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    #headerSearch {
        display: flex !important;
        align-items: center !important;
        margin-left: auto !important;
        margin-right: 4px !important;
    }

    #hamburgerMenu {
        display: flex !important;
        align-items: center !important;
    }

    /* ハンバーガーメニューの色を濃く */
    .c--menu-bar .a--menu-bar {
        background-color: #333 !important;
    }

    .c-headLogo__img {
        max-width: 100px !important;
        height: auto !important;
    }
}

/* 551px以下でヘッダーの高さを調整 */
@media (max-width: 551px) {
    #commonHeaderInner {
        height: 46px !important;
    }
}

/* ===================================
   パン屑リストのリンク色
   =================================== */

#breadCrumb a {
    color: #0066cc;
    text-decoration: none;
}

#breadCrumb a:hover {
    color: #0052a3;
    text-decoration: underline;
}

/* パンくずの＞を黒く */
#breadCrumb .a--breadcrumb-parts {
    color: #000;
}

/* ===================================
   吹き出しアイコンを円形に
   =================================== */

/* .sayブロックのアイコンを円形にクロップ */
.say .img-inner {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.say .img-inner img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 50%;
}

