/*
Theme Name: Lightning Child Sample
Theme URI: 
Template: lightning
Description: 
Author: 
Tags: 
Version: 0.6.0
*/


/* SNSマークを丸く、透明にする */
.veu_socialSet .sb_icon.sb_facebook a,
.veu_socialSet .sb_icon.sb_twitter a,
.veu_socialSet .sb_icon.sb_x_twitter a,
.veu_socialSet .sb_icon.sb_hatena a,
.veu_socialSet .sb_icon.sb_line a,
.veu_socialSet .sb_icon.sb_pocket a,
.veu_socialSet .sb_icon.sb_copy button {
    background: rgba(255,255,255,.9);
    box-shadow: 0 0 0;
    transition: background .3s;
    border-radius: 20px;
}

.veu_socialSet .sb_icon.sb_facebook a:hover,
.veu_socialSet .sb_icon.sb_twitter a:hover,
.veu_socialSet .sb_icon.sb_x_twitter a:hover,
.veu_socialSet .sb_icon.sb_hatena a:hover,
.veu_socialSet .sb_icon.sb_line a:hover,
.veu_socialSet .sb_icon.sb_pocket a:hover,
.veu_socialSet .sb_icon.sb_copy button:hover {
    color: #fff;
    transform: none;
}

.veu_socialSet .sb_icon.sb_facebook a {
    color: #425dab;
    border: 1px solid #425dab;
}
.veu_socialSet .sb_icon.sb_facebook a:hover {
    background: #425dab;
}

.veu_socialSet .sb_icon.sb_twitter a {
    color: #00abec;
    border: 1px solid #00abec;
}
.veu_socialSet .sb_icon.sb_twitter a:hover {
    background: #00abec;
}

.veu_socialSet .sb_icon.sb_x_twitter a {
    color: #0f1419;
    border: 1px solid #0f1419;
}
.veu_socialSet .sb_icon.sb_x_twitter a:hover {
    background: #0f1419;
}

.veu_socialSet .sb_icon.sb_hatena a {
    color: #007fc5;
    border: 1px solid #007fc5;
}
.veu_socialSet .sb_icon.sb_hatena a:hover {
    background: #007fc5;
}
.veu_socialSet .sb_icon.sb_line a {
    color: #6ebd30;
    border: 1px solid #6ebd30;
}
.veu_socialSet .sb_icon.sb_line a:hover {
    background: #6ebd30;
}

.veu_socialSet .sb_icon.sb_pocket a {
    color: #ea4654;
    border: 1px solid #ea4654;
}
.veu_socialSet .sb_icon.sb_pocket a:hover {
    background: #ea4654;
}

.veu_socialSet .sb_icon.sb_copy button {
    color: #228b22;
    border: 1px solid #228b22;
}
.veu_socialSet .sb_icon.sb_copy button:hover {
    background: #228b22;
}

/* ボタンの並び順 */
li.sb_line { order: 1; }
li.sb_twitter { order: 2; }
li.sb_x_twitter { order: 2; }
li.sb_facebook { order: 3; }
li.sb_pocket { order: 4; }
li.sb_hatena { order: 5; }
li.sb_copy { order: 6; }




/* グローバルメニューの編集*/
@media (min-width: 992px) {

/* アイコンの下にメニューの文字を配置する（スクロールしていないとき） */
body:not(.header_scrolled) .global-nav-list>li .global-nav-name {
display: flex;
flex-direction: column;
}

/* アイコンのスタイル（スクロールしていないとき） */
body:not(.header_scrolled) .global-nav-list>li .global-nav-name i {
font-size: 1.5em;
margin-right: 0;
margin-bottom: 0.5em;
color: var(--vk-color-primary);
}

/* 個々のメニュー枠のスタイル（スクロールしていないとき） */
body:not(.header_scrolled) .vk-menu-acc li {
width: 100px;
margin-left: -1px;
border-right: 1px solid #ddd;
border-left: 1px solid #ddd;
}

/* 最後のメニュー項目だけ白抜き文字にする */
.vk-menu-acc li:last-child {
background-color: var(--vk-color-primary);
}
body:not(.header_scrolled) .global-nav-list>li:last-child .global-nav-name i,
.global-nav-list>li:last-child .global-nav-name i {
color: #fff;
}
.nav li:last-child a, nav li:last-child a {
color: #fff;
}

body:not(.header_scrolled) .global-nav--layout--float-right {
align-items: unset;
}

.header_scrolled .global-nav--layout--float-right {
width: 100%;
}

.header_scrolled .global-nav-list {
display: block;
width: unset; /* 2022.5.31 Lightning 14.21 にアップデートしたときのスクロール時のレイアウトくずれの対策として追加 */
}

/* 最後のメニュー項目だけ右端に配置（スクロール時） */
.header_scrolled .vk-menu-acc li:last-child {
float: right;
}

/* 2023.3.5 追加 - デフォルトの width: 100vw のままだとヘッダー幅がコンテナ幅に一致しない */
.header_scrolled .site-header {
    width: 100%;
}


}
15
16
17
18
19
20
21
22
23
24