@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/



/* PCヘッダー内のSNSアイコンを縦中央 */
/* .l-header__inner {
    display: flex;
    align-items: space-between; 
    justify-content: center; 
    height: 80px; 
    position: relative;
} */

/* SNSリスト自体も中央揃え */
/* SNSリスト（共通） */
.c-iconList {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 0px !important;
    margin: 0;
    padding: 0;
}

/* 各アイテムを中央寄せ */
.c-iconList__item,
.c-iconList__link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

/* 画像の大きさをそのまま使用 */
.c-iconList__img {
    display: block;
    height: auto;
    width: auto;
    max-width: none; /* SWELLの上書きを防ぐため */
    transition: opacity 0.3s ease;
}

.c-iconList {
    display: flex !important;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    gap: 0; /* gapは使わずマージンで調整 */
}

/* 1個目のアイコン */
.c-iconList__item:nth-child(1) {
    margin: 0 12px; /* 1と2の間隔 */
}

/* 2個目のアイコン */
.c-iconList__item:nth-child(2) {
    margin: 0 9px;  /* 1と2の間隔 */
}

/* 3個目のアイコン */
.c-iconList__item:nth-child(3) {
    margin: 0 14px;  /* 2と3の間隔 */
}

/* 4個目のアイコン */
.c-iconList__item:nth-child(4) {
    margin: 0 7.5px;   /* 3と4の間隔 */
}

/* ホバー時のアニメーション */
.c-iconList__link:hover .c-iconList__img {
    opacity: 0.7;
}

/* 時計の位置調整 */
.header-clock-widget {
    display: inline-block;
    vertical-align: middle;
    margin: 0 1px;
}

/* SPハンバーガー位置 */
.l-header__menuBtn.sp_ {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

/* フッターのSNSアイコン */
.c-iconList.l-footer__sns {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2px;
}

/* フッター内アイコン（画像サイズをそのまま） */
.l-footer .c-iconList__img {
    width: auto;
    height: auto;
    display: block;
    transition: opacity 0.3s ease;
}

.l-footer .c-iconList__link:hover .c-iconList__img {
    opacity: 0.7;
}