@charset "utf-8";

main {
    background: url(../images/access.png) no-repeat top right;
    background-size: 85%;
    padding: 60% 0 0 20%;
}

.access .text,
.root .text {
    position: relative;
    padding: 35px;
    margin: 3% 15% 50px 0;
    max-width: 80%;
    background: rgb(255 255 255 / 0.6);
    border-radius: 6px;
}

span {
    display: inline-block;
}

dt {
	font-size: 1.125rem; /*18px相当*/
    font-weight: bold;
    text-indent: 0.25rem;
}

iframe {
    max-width: 100%;
}

.access dt {
    border-left: 5px solid #391700;
    line-height: 1.25rem;
    margin-bottom: 8px;
}

.root {
    margin-bottom: -15%;
}

.root dt {
    background: linear-gradient(transparent 50%, #ffc6c1 50%);
}

.root dd {
    margin: 1.5rem 0;
}

@media (max-width: 600px){
    main {
        background-size: 92%;
    }

    .access .text,
    .root .text {
        position: relative;
        padding: 30px 20px;
        margin: 7% 10% 50px -5%;
        max-width: 95%;
    }

    iframe {
        max-height: 300px;
    }
}