/*
Theme Name: SWELL CHILD
Version: 3.0.0
Template: kireilign-theme-2022
Tags: Tags: one-column,
custom-colors,
custom-menu,
custom-logo,
editor-style,
featured-images,
full-site-editing,
block-patterns,
rtl-language-support,
sticky-post,
threaded-comments,
translation-ready,
wide-blocks,
block-styles,
style-variations,
accessibility-ready,
blog,
portfolio,
news
Text Domain: Submedia
*/

/* ========================================
   親テーマのヘッダー・フッター・バーガーメニュー統合用スタイル
   ======================================== */

/* バーガーメニューのz-indexを確保 */
.a22-header {
    z-index: 9999 !important;
}

.a22-header .nav_b {
    z-index: 10000 !important;
}

/* バーガーメニューボタンのアクティブ時のスタイル */
.a22-header .btn_menu.active i {
    transform: rotate(90deg);
    transition: transform 0.3s ease;
}

/* モバイルナビゲーションのスムーズな開閉 */
.a22-header .nav_b {
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* フッターのスタイル調整 */
.l--footer {
    margin-top: 0;
}

/* ページトップボタンのスタイル */
.page--top-wrap {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
}

.page--top {
    display: block;
    width: 50px;
    height: 50px;
    background: #3CA7E6;
    border-radius: 50%;
    position: relative;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.page--top:hover {
    opacity: 0.8;
}

.page--top:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translate(-50%, -30%) rotate(-45deg);
}

/* スティッキーCTAボタンのスタイル調整 */
#kl_navigation_cta {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

/* スマホ用底部ナビゲーション */
.nav_bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #e0e0e0;
    z-index: 998;
}

/* 子テーマ独自のスタイル調整 */
@media (max-width: 768px) {
    /* モバイル時のヘッダー調整 */
    .a22-header {
        height: 60px;
    }
    
    /* モバイル時のコンテンツ余白調整 */
    body {
        padding-top: 60px;
    }
}
