/*//////////////////////////////////////

page-etcguide-torisetsu

///////////////////////////////////////*/

body .sec_1{
    font-family: heisei-kaku-gothic-std, sans-serif;
    color: #3f2513;
}

.breadcrumb {
    padding: clamp(20px, 1.046rem + 1.02vw, 30px) 0 clamp(30px, 4.166666vw, 50px);
    width: min(90vw, 1200px);
    max-width: 1200px;
    margin: 0 auto;
}

/* 本文 */
.guide-container {
    width: min(90vw, 1200px);
    margin: 0 auto;
}

.guide-container .tolisetsu-logo{
    max-width: 600px;
    padding-block: 30px clamp(60px, 2.285rem + 6.25vw, 100px);
}

.guide-container h3{
    font-size: clamp(20px, 0.812rem + 1.87vw, 30px);
    font-weight: 600;
    /* padding-block-end: clamp(20px, -0.404rem + 7.06vw, 50px); */
    letter-spacing: 2px;
}

.guide-container h4{
    font-size: 20px;
    font-weight: 600;
    padding-block-end: clamp(0px, -0.568rem + 2.42vw, 20px);
    text-indent: -1.3em;
    padding-left: 1.3em;
    line-height: 1.4;
}


.guide-container .torisetsu-item .scrollhint {
    overflow-x: auto;
    white-space: nowrap; /* 子要素を横並びにする */
    max-width: 100%;
    width: 800px;
    margin: 10px 0 30px;
    display: flex;
}

.guide-container .torisetsu-item{
    padding-block-start: clamp(50px, 2.273rem + 3.64vw, 80px);
}



.guide-container .torisetsu-item .scrollhint .torisetsu-img{
    border-collapse: collapse;
    text-align: center;
    width: 3200px;
}

.guide-container .torisetsu-item .scrollhint ul {
    display: flex;
    gap: 30px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.guide-container .torisetsu-item .scrollhint ul li {
    flex: 0 0 auto; /* 子要素の幅を固定 */
    width:clamp(300px, 13.235rem + 23.53vw, 400px);
}

.scroll-hint.active {
    cursor: grabbing;
}

.scroll-hint {
    cursor: grab;
}

.scroll-hint img {
    pointer-events: none; /* 画像のドラッグを無効化 */
    user-select: none;
}

/* サイドバー */

.guide-container aside {
    width: auto;
    margin: 40px 0;
    max-width: 600px;
}

.guide-container aside .side_nav {
    width: 100%;
}

.guide-container aside .side_wrap .side_tit{
    font-family: heisei-kaku-gothic-std, sans-serif;
    font-weight: 900;
    color: rgba(63, 37, 19, 1);
    padding: 0 0rem 1.8rem;
}

.guide-container aside .side_wrap{
    background-color: #fff;
    /* border: 1px solid #e5e5e5; */
    border-radius: 10px;
}

.guide-container aside .side_wrap li{
    position: relative;
}

.guide-container aside .side_wrap li+li::before{
    content: "";
    right: 0;
    top: 0;
    margin: 0 auto;
    width: calc(100% - 35px);
    display: block;
    border-top: .4px solid rgb(63 37 19);
}

.guide-container aside .side_wrap li a{
    display: block;
    font-size: 15px;
    font-weight: 700;
    padding: 20px 32px 20px 16px;
    text-decoration: none;
    width: 100%;
    transition: opacity 0.2s ease-in-out;
    color: #3f2513;
    font-family: heisei-kaku-gothic-std, sans-serif;
    line-height: 1.3;
}

.guide-container aside .side_wrap li a:before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: calc(100% - 16px);
    display: block;
    border-top: 1px solid #e5e5e5;
}

.guide-container aside .side_wrap li a:first-child::before{
    display:none;
}

.guide-container aside .side_wrap li a::after{
    background-image: url(../imgs/etcguide/under/side_allow.png);
    background-size: contain;
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    position: absolute;
    right: 8px;
    top: 50%;
    width: 15px;
    height: 13px;
    transform: translateY(-50%);
}

.guide-container aside .side_wrap a{
    display: block;
}


/*///////////////////////////////////////

page-etcguide-torisetsu tb 1

////////////////////////////////////////*/

@media (min-width: 520px) {


}

/*////////////////////////////////////////

page-etcguide-torisetsu tb 2

/////////////////////////////////////////*/

@media (min-width: 768px) {

.guide-container .torisetsu-item:last-child{
    padding-block-end: 150px;
}

}

/*/////////////////////////////////////////

page-etcguide-torisetsu pc

/////////////////////////////////////////*/

@media (min-width: 960px) {


}


@media (min-width: 1130px) {
.guide-container {
        display: grid;
        grid-template-columns: auto 250px;
        gap: 40px;
    }
}