/*
Theme Name: kyabe2 craft
Theme URI: https://kyabe2.com/themes/kyabe2-craft
Author: kyabe2
Author URI: https://kyabe2.com/
Description: kyabe2
Version: 1.0
*/ 

        /* チェックボックスオンの時 */
        .check:checked ~ .contents {
            -webkit-transform: translateX(-180px);
            -ms-transform: translateX(-180px);
            transform: translateX(-180px);
            overflow: hidden;
            opacity: 1 !important;
        }
       
        /* ドロワー */
        .drawer-menu {
            z-index: 10;
            position: absolute;
            position: fixed;
            visibility: visible !important;
            top: 0;
            left: 0;
            width: 180px;
            height: 100%;
            background: #FFF;
            opacity: 1 !important;
            box-shadow: inset 0 0 3px 3px #DDD;
            -webkit-transform: perspective(500px) rotateY(-90deg);
            transform: perspective(500px) rotateY(-90deg);
            transition-duration: .3s;
            transform:translate(-180px,0px)
        }


        /* チェックボックスオンの時 */
        .check:checked ~ .drawer-menu {
            -webkit-transform: none;
            -ms-transform: none;
            transform: none;
            opacity: 1;
        }

        /* チェックボックスを非表示 */
        .check {
            display: none;
        }

        /* メニューボタン(label) */
        .ls-button,
        .menu-btn {
            position: absolute;
            position: relative;
            display: inline-block;
            padding: 8px 10px;
            margin: 7px 10px 0px 10px;
            border: 1px solid #dcdcdc;
            background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #f6f6f6) );
            border-radius: 4px;
            cursor: pointer;
            z-index: 7;
            font-weight: normal;
            color: #515151;
            font-size: 14px;
        }

        ul.bogo-language-switcher {
            list-style: none;
        }

        .inline-block{
            background-color:  #ccc;
            background: white;
        }

        div.spacer1{
            position: relative;
            right: 2.5px;
        }

        /* コンテンツの閉じる。普段は非表示(label)*/
        .close-menu {
            z-index: 2;
            position: relative;
            display: block;
            float: right;
            width: 40px;
            height: 40px;
            margin: 5px 7px 0px 0px;
            font-size: 26px;
            font-weight: 400;
            color: #515151;
            border: 1px solid #dcdcdc;
            background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #f6f6f6) );
            border-radius: 4px;
            cursor: pointer;
        }

        div .close-area {
            z-index: 99998;
            position: fixed;
            border: 0px solid #dcdcdc;
            right: 100%;
            width: 1000%;
            height: 100vh;
            height: 100%;
            margin: 0px;
            background: transparent;
            -webkit-transform: perspective(500px) rotateY(-90deg);
            transform: perspective(500px) rotateY(-90deg);
            transition-duration: .3s;
        }

        .check:checked ~ .close-menu {
            -webkit-transition-duration: 1s;
            transition-duration: 1s;
            -webkit-transition-delay: .3s;
            transition-delay: .3s;
            background: rgba(0,0,0,.5);
            visibility: visible;
            opacity: 1;
            z-index: 3;
        }

        /* チェックボックスオンの時 */
        .check:checked ~ .close-menu {
            visibility: visible;
            opacity: 1;
            z-index: 3;
        }

    /* タイトル */
        .inline-block{
            background-color:  #ccc;
            background: white;
            height: 0px;
        }

        ul {
            margin-block-start: 0px;
            margin-block-end: 0px;
            padding-left: 0px;
        }

        h6 {
            position: absolute;
            font-weight: bold;
            font-size: 22px;
            letter-spacing: 4px;
            /* padding: 80px 0px 50px 10px; */
            width: auto;
            background: #ccc;
            background: white;
            font-family: 'Dosis', sans-serif;
            color: #515151;
            float: bottom;
        }

        .cleartext {
            text-indent:100%;
            white-space:nowrap;
            overflow:hidden;
            display: none;
        }

        
        /* nav {
            position: absolute;
            font-weight: bold;
            font-size: 22px;
            letter-spacing: 4px;
            padding: 80px 0px 50px 10px;
            width: auto;
            background: #ccc;
            background: white;
            font-family: 'Dosis', sans-serif;
            color: #515151;
            float: bottom;
        } */

        a.glink:hover,
        a.glink:focus {
            color: rgb(255, 170, 170);
        }

    /* 翻訳 */
        .glink-box {
            float: right;
        }

        a.glink {
            padding: 8px 10px;
            margin: 7px 10px 0px 0px;
            text-decoration: none;
            border: 1px solid #dcdcdc;
            background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #f6f6f6) );
            border-radius: 4px; 
            display: inline-block;
            /* font-size: 14px; */
        }

        a.englink {
            padding: 8px 10px;
            margin: 7px 10px 0px 0px;
            text-decoration: none;
            border: 1px solid #dcdcdc;
            background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #f6f6f6) );
            border-radius: 4px; 
            display: inline-block;
            /* font-size: 14px; */
        }