@charset "utf-8";

.access {
    .wrap {
        .contents {
            .contents_inner {
                display:grid;
                grid-template-columns:1fr 50%;
                grid-column-gap:5%;
                margin-bottom:90px;
                .detail {
                    iframe {
                        display:block;
                        width:100%;
                        aspect-ratio:3/2;
                    }
                    h3 {
                        font-size:2.0rem;
                        margin: 1.5em 0 1em;
                    }
                }
                & + .contents_inner {
                    grid-template-columns:50% 1fr;
                    .detail {
                        order:1;
                    }
                }
            }
            .office {
                display:grid;
                grid-template-columns:repeat(3,1fr);
                grid-column-gap:7%;
                grid-row-gap:90px;
                li {
                    display:grid;
                    grid-template-rows:auto auto 1fr auto;
                    height:100%;
                    img {
                        display:block;
                        & + p {
                            padding-top: 1em;
                        }
                    }
                    h3 {
                        font-size:2.0rem;
                        padding:1.5em 0 1em;
                        line-height:1.5;
                    }
                    p {
                        line-height:1.66;
                    }
                    .btn {
                        margin-top:1.5em;
                    }
                }
            }
        }
    }
}


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

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

    .access {
        .wrap {
            .contents {
                .contents_inner {
                    margin-bottom:60px;
                }
                .office {
                    grid-column-gap:4%;
                    grid-row-gap:50px;
                    li {
                        display:grid;
                        grid-template-rows:auto auto 1fr auto;
                        height:100%;
                        img {
                            display:block;
                        }
                        h3 {
                            font-size:1.8rem;
                        }
                    }
                }
            }
        }
    }
    
}

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

    .access {
        .wrap {
            .contents {
                .contents_inner {
                    grid-template-columns:1fr;
                    max-width:500px;
                    margin-left:auto;
                    margin-right:auto;
                    .detail {
                        display:contents;
                        iframe {
                            order:3;
                        }
                        h3 {
                            font-size:1.6rem;
                            order:1;
                        }
                        p {
                            order:2;
                            margin-bottom:1.5em;
                        }
                    }
                    & + .contents_inner {
                        grid-template-columns:1fr;
                    }
                }
                .office {
                    grid-template-columns:repeat(2,1fr);
                    grid-column-gap:5%;
                    li {
                        h3 {
                            font-size:1.5rem;
                            padding:1em 0 .66em;
                        }
                        .btn {
                            margin-top:1em;
                        }
                    }
                }
            }
        }
    }
 
}