@charset "UTF-8";
main img{
    width: 100%;
    height: auto;
}

main .inner{
    width: 93%;
}

header .pc{
    display: block;
    padding-top: 5px;
}

header .sp{
    display: none;
}

/* home */
.home main .visual {
    width: 100%;
    height: auto;
    padding: 50px 30px 150px;
}
/*ハンバーガーアイコン*/
header .btn-burger {
    cursor: pointer;
    display: block;
    width: 56px;
    height: 60px;
    position: absolute;
    top: 5px;
    right: 10px;
}
/*ハンバーガーアイコンを作る三本線*/
header .icon, .icon:before, .icon:after {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    height: 2px; /*線の太さ*/
    width: 35px; /*線の長さ*/
    background-color: #444;
    border-radius: 2px;
    display: block;
    content: '';
    cursor: pointer;
    margin: auto;
}
/*三本線の間隔*/
header .icon:before {
    transform: translateY(-6px);
}
header .icon:after {
    transform: translateY(6px);
}
/*チェックボックス非表示*/
header .nav-toggle {
    display: none;
}
/*アイコンをクリックしたら*/
header .nav-toggle:checked ~ .btn-burger .icon {
    background: transparent;
}
header .nav-toggle:checked ~ .btn-burger .icon:before {
    transform: rotate(-45deg);
    top: 0;
}
header .nav-toggle:checked ~ .btn-burger .icon:after {
    transform: rotate(45deg);
    top: 0;
}
.icon,
.icon:before,
.icon:after {
    transition: all .8s;
}
/*表示されるメニューの中身*/
header nav ul {
    list-style: none;
    display: none;
    margin: 0;
    padding-left: 20px;
}
header nav ul li {
    margin: 0;
    padding: 10px;
}
header .nav-toggle:checked ~ nav ul {
    display: block;
}
main .title{
    padding-bottom: 40px;
}
main .title h1{
    font-size: 40px;
    margin-bottom: 5px;
}
main .title ol{
    display:flex;
    overflow-x: scroll;
    word-break: keep-all;
    white-space: nowrap;
}
main .title ol li{
    font-size: 16px;
}

main .inner{
    margin-top: -10px;
}

/* スクロールできることを知らせるメッセージ */
.scroll-notice {
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

/* スクロールバーのデザイン調整 */
main .title ol::-webkit-scrollbar {
    height: 4px; /* Chrome, Safari のスクロールバー高さ */
}

main .title ol::-webkit-scrollbar-thumb {
    background: #ccc; /* スクロールバーの色 */
    border-radius: 2px;
}