*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:sans-serif;
    overflow-x:hidden;
}

/* レイアウト */

.layout{
    display:flex;
    align-items:flex-start;
}

.main{
    flex:1;
    min-width:0;
}

.sidebar{
    width:10%;
    min-width:140px;

    position:sticky;
    top:0;

    min-height:100vh;
    padding:20px 10px;

    display:flex;
    flex-direction:column;
    align-items:center;
}

/* アイマイダロゴ */

.logo{
    writing-mode:vertical-rl;
    text-orientation:upright;

    font-size:2rem;
    letter-spacing:0.3em;

    margin-top:20px;
    margin-bottom:60px;
}

.logo a{
    color:#000;
    text-decoration:none;
}

/* メニュー */

.sidebar nav{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.sidebar a{
    font-size:1.5rem;
    text-decoration:none;
    color:#000;
}

.sidebar a:hover{
    opacity:0.6;
}

/* 写真・動画 */

.item{
    width:100%;
    overflow:hidden;
}

.item img,
.item video{
    display:block;
    width:100%;
    max-width:100%;
    height:auto;
}

/* カレンダー */

.calenderbox{
    width:95%;
    margin:40px auto;
}

.contact{
    width:95%;
    margin:80px auto;
}

.contact h2{
    margin-bottom:20px;
}

.contact p{
    line-height:1.8;
}

/* スマホ */

@media screen and (max-width:720px){

    .layout{
        display:flex;
        flex-direction:column;
    }

    .sidebar{
        order:-1;

        width:100%;
        min-width:0;
        min-height:auto;

        position:relative;

        padding:20px;
    }
    
    .sidebar a{
    font-size:1.2rem;
    text-decoration:none;
    color:#000;
}

    .logo{
        writing-mode:horizontal-tb;
        text-orientation:mixed;

        font-size:1.5rem;
        text-align:center;

        margin:0 0 30px 0;
        letter-spacing:0.1em;
    }

    .sidebar nav{
        flex-direction:row;
        justify-content:center;
        gap:30px;
    }
    
.main{
        width:100%;
    }

.calenderbox{
        width:90%;
    }
}