/* ------------------ 🔽🔽🔽 特定ポインター環境で非表示 🔽🔽🔽　------------------ */

body:is(.--CLIENT-USE-TOUCH, .--CLIENT-USE-PEN) .shown-while-pointer-is-mouse {
    display: none !important;
}

/* ------------------ 🔽🔽🔽 ダークテーマ 🔽🔽🔽　------------------ */

:is(html, body):has(body.dark-theme) {
    background-color: #151515 !important;
}
body.dark-theme:not(.--CLIENT-USE-TOUCH, .--CLIENT-USE-PEN) {
    #sidebar-sns-container .sns-icon:hover {
        background-color: rgba(255,255,255, 0.2);
    }
}
body.dark-theme {

    .public-page, .main, .sidebar, .footer, #content, #container, #content-in {
        background-color: #151515 !important;
        color: #bbb !important;
    }
    #ts-sidebar {
        border-color: #2d2d2d;

        .rac-title, .sidebar-guide-item a, .sns-icon a {
            color: #bbb;
        }
    }

    #navi-footer .menu-item a {
        background-color: transparent;
        transition: all 0.15s ease-in-out;
        color: #bbb;
    }
    #navi-footer .menu-item a:hover {
        background-color: transparent;
        color: rgba(0, 0, 0, 0.2);
    }
    .navi-footer-in>.menu-footer li {
        border-color: #2d2d2d;
    }

    #user-menu li.user-menu-title {
        border-color: #2d2d2d;
    }

    #user-menu.ts-dropdown-menu {
        background-color: #182121;
        color: #dddddd;
        box-shadow: 0px 1px 3px 1px #000000, 0px 1px 2px 0px #000000;
        li a {
            color: #dddddd;
        }
        .split {
            background-color: rgba(255, 255, 255, 0.1);
        }
    }
    .user-menu.menu-logged-in #user-notification-container {
        #notification-box {
            background-color: #182121;
            color: #dddddd;
            box-shadow: 0px 1px 3px 1px #000000, 0px 1px 2px 0px #000000;
            .notification-loading-image {
                filter: none;
            }
            .notification-wrapper {
                .notification-unread-indicator {
                    color: #d93;
                }
                .notification-content {
                    .notification-datetime {
                        color: gray;
                    }
                }
                
            }
            .notification-wrapper:has(+div) {
                border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            }
            .notification-aleart {
                color: gray;
            }
          
        }
    }
}




/* ------------------ 🔽🔽🔽 全体スタイル 始 🔽🔽🔽　------------------ */

a {
    -webkit-user-drag:none;
    -khtml-user-drag:none;   
}

#content-in {
    padding-top: 15px;
    display: flex;
    flex-direction: row-reverse;
    #ts-sidebar {
        width: 30%;
        max-width: 376px;
    }
}
/* 833px以下 */
@media screen and (max-width: 834px){
    #content-in {
        #ts-sidebar {
            display: none;
        }
        main {
            width: 100%;
        }
    }
}
button {
    font-size: 1em;
}
/* 834px以上 */
@media screen and (min-width: 835px){
    #content-in { 
        main { width: 70%; }
    }
}


#main {
    padding-top: 0;
}

.bold-bold {
    font-weight: bold;
}
.italic-italic {
    font-style: italic;
}
.line-underline {
    text-decoration: underline;
}
.line-strikethrough {
    text-decoration: line-through;
}
.size-small {
    font-size: 0.7em;
}
.size-large {
    font-size: 1.3em;
}
.ts-modern_anchor {
    text-decoration: none;
    color: gray;
}
#main {
    margin: 0 !important;
    border: none !important;
}
.serif {
    font-family: serif;
}

/*834px以下*/
@media screen and (max-width: 834px){
    #post-35 {
        margin-bottom: 0;
    }
    #sidebar {
        padding-top: 0 !important;
    }
    #content {
        margin-top: 50px;
    }
    #main {
        padding-bottom: 0 !important;
    }
}

/* pc表示 */
@media screen and (min-width: 835px) {
    #content {
        margin-top: 60px;
    }
    .only-mobile {
        display: none;
    }
}



/* ------------------ 🔼🔼🔼 全体スタイル 終 🔼🔼🔼　------------------ */

/* ------------------ 🔽🔽🔽 自作アイコン関係 始 🔽🔽🔽　------------------ */


@font-face {
    font-family: 'original_icon';
    src:  url('/fonts/original_icon.eot?eaja7w');
    src:  url('/fonts/original_icon.eot?eaja7w#iefix') format('embedded-opentype'),
        url('/fonts/original_icon.ttf?eaja7w') format('truetype'),
        url('/fonts/original_icon.woff?eaja7w') format('woff'),
        url('/fonts/original_icon.svg?eaja7w#original_icon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'original_icon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-skin:before {
    content: "\ea20";
}
.icon-creeper_face:before {
    content: "\ea21";
}
.icon-clear:before {
    content: "\ea22";
}
.icon-dehaze:before {
    content: "\ea23";
}
.icon-menu:before {
    content: "\ea24";
}
.icon-link:before {
    content: "\ea25";
}
.icon-youtube:before {
    content: "\ea26";
}

/* ------------------ 🔽🔽🔽 スライドショー 始 🔽🔽🔽　------------------ */

/* ------------------ 🔽🔽🔽 ヘッダーメニュー始 🔽🔽🔽　------------------ */
/*834px以下*/
@media screen and (max-width: 834px){
    .header-container-in.hlt-top-menu .logo-header img {
        margin-top: 2.5px;
        height: 45px;
    }
    /* スマホヘッダー高さ */
    #header-container {
        padding: 0px 0;
        height: 50px !important;
    }
    .site-name.site-name-text-link {
      padding-left: 5px;
    }
    #navi {
      display: none;
    }
}

/*835px以上*/
@media screen and (min-width: 835px){
  #header {
    transition: all 0.15s;
  }
    
    /* pcヘッダー高さ */
    #header-container {
        padding: 0px 0;
        height: 60px !important;
        background: linear-gradient(to right, #2d2d2d 0%, #2d2d2d 50%, rgb(26, 105, 103) 50%, rgb(26, 105, 103) 100%);
    }
    #header-container .navi {
      background-color: transparent;
    }
    .site-logo-image.header-site-logo-image {
        /* モバイル画像高さ */
        height: 50px !important;
        margin-top: 5px;
    }
    #navi {
      background-color: transparent;
    }
}
#header-container {
    width: 100%;
    z-index: 10;
    position: fixed;
    top: 0;
}
#header-container-in {
    height: 100%;
}
#container:has(.user-menu.menu-not-logged-in) #navi {
    margin-right: 115px;

    .menu-item {
        height: 100% !important;
        width: calc(100% / 6) !important;
        /* margin-top: 5px; */
    }
}
#container:has(.user-menu.menu-logged-in) #navi {
    margin-right: 172px;

    #menu-item-2796 {
      display: none;
    }
    .menu-item {
        height: 100% !important;
        width: 20% !important;
        /* margin-top: 5px; */
    }
}
#navi, #navi-in {
    height: 100%;
}
.menu-top.menu-mobile {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 100%;
}



            

#navi .item-label {
    i, span {
        font-size: 1.3em;
    }
    div {
        font-size: smaller;
        line-height: 15px;
    }
}

#menu-item-2793 {
    background-color: #2B3434;
}
#menu-item-2794 {
    background-color: #2A3B3B;
}
#menu-item-2798 {
    background-color: #284242;
}
#menu-item-2795 {
    background-color: #264949;
}
#menu-item-2797 {
    background-color: #245050;
}
#menu-item-2796 {
    background-color: #e18008;
}
#navi .navi-in a {
    transition: all 0.15s ease-in-out;
}
.item-label {
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.item-label span {
    margin: 0;
    height: fit-content;
    line-height: 1em;
}
.ts-header-menu-item-up {
    font-size: 0.9em;
}
.header-container-in.hlt-top-menu {
    display: flex;
    flex-direction: row;
}
.caption-wrap {
    height: 100%;
}
.header-container-in.hlt-top-menu {
    display: flex;
    align-items: start;
}
.ts-header-menu-item-down {
    font-size: 1em;
}
/*メニュー非表示*/
@media screen and (max-width: 480px) {
    #header-container .navi {
        display:none;
    }
}

/* ------------------ 🔽🔽🔽 フッター 🔽🔽🔽　------------------ */

#footer {
    margin-top: 0px !important;
    padding-top: 30px !important;
    height: 0px !important;
}
.widget_text.widget.widget-content-bottom.widget_custom_html {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
#footer-in {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.footer-widgets.cf {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.footer-left {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.footer-center {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.footer-right {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.footer-bottom.fdt-up-and-down.fnm-text-width.cf {
    height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.source-org.copyright {
    margin-top: 20px;
}
.navi-footer-in a {
    color: var(--cocoon-text-color);
    transition: all 0s !important;
    background-color: transparent !important;
}

/*上フッター調整*/
hr.page-bottom-hr {
    z-index: 20;
}
/*フッター下にスペース*/
.footer-bottom.fdt-up-and-down .footer-bottom-content {
	  padding-bottom: 2em;
}
/*サイドバー新着記事*/
.widget-sidebar-title.widget-title {
    text-align: center;
    background-color: #fff;
    border-bottom: 2px solid #333;
}

/* ------------------ 🔽🔽🔽 見出しスタイル 始 🔽🔽🔽　------------------ */

/*タイトルh1*/
h1.entry-title {
    padding: 10px 10px 10px 20px;
    border-left: 6px double #2d2d2d;
    color: #2d2d2d
}

/*H2見出し*/
main h2.wp-block-heading {
    background-color: #fff;
    color: #000;/*文字色（黒）*/
    font-size: 20px;/*文字サイズ*/
    padding: 10px 30px;/*文字回りの余白（上下 左右）*/
    margin: 30px 0;
    border-top: 2px solid #000;/*上線（太さ 実線 色）*/
    border-bottom: 2px solid #000;/*下線（太さ 実線 色）*/
    position: relative;
    display: block;
}

main h2.wp-block-heading:before,
main h2.wp-block-heading:after {
    background: #000;/*左右線の色（黒）*/
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;/*左右線の太さ（幅）*/
    height: calc(100% + 20px);
}

main h2.wp-block-heading:before {
    left: 10px;
}

main h2.wp-block-heading:after {
    right: 10px;
}

/*H3見出し*/
main h3.wp-block-heading {
    color: #000;/*文字色（黒）*/
    font-size: 18px;/*文字サイズ*/
    padding: 10px 20px 10px 30px;/*文字回りの余白（上 右 下 左）*/
    display: block;
    border-bottom: 1px solid #000;/*下線（太さ 実線 色）*/
    position: relative;
}

main h3.wp-block-heading:before {
    content: "";
    display: block;
    position: absolute;
    bottom: -14px;
    left: 10px;
    width: 1px;/*左線の太さ（幅）*/
    height: 80%;/*左線の高さ*/
    background: #000;/*左線の色*/
}

/*H4見出し*/
main h4.wp-block-heading {
    color: #000;/*文字色（黒）*/
    font-size: 16px;/*文字サイズ*/
    padding: 7px 30px;/*文字回りの余白（上下 左右）*/
    display: block;
    position: relative;
}

/* ------------------ 🔼🔼🔼 見出しスタイル 🔼🔼🔼　------------------ */



/* バッジ */
.user-badge-22 {
    display: flex;
    gap: 5px;

    .badge-icon {
      position: relative;
      width: 22px; height: 22px;

        .badge-bg {
            font-size: 22px;
            line-height: 22px;
            color: #888;
        }
        .badge-symbol {
            position: absolute;
            left: 50%; top: 50%;
            transform: translate(-50%, -50%);
            color: #fff;
            font-size: 10px;
        }
    }
    .badge-label {
        line-height: 22px;
    }
}
.user-badge-28 {
    display: flex;
    gap: 5px;

    .badge-icon {
      position: relative;
      width: 28px; height: 28px;

        .badge-bg {
            font-size: 28px;
            line-height: 28px;
            color: #888;
        }
        .badge-symbol {
            position: absolute;
            left: 50%; top: 50%;
            transform: translate(-50%, -50%);
            color: #fff;
            font-size: 14px;
        }
    }
    .badge-label {
        line-height: 28px;
    }
}