.access{
    background-image: url(../img/access/access_bg.jpg);
    background-repeat: no-repeat;
    background-position: top;
    padding: 27.5rem 0 0 0;
}

.access ul{
    background: #fff;

    box-shadow: 0 0 5px rgb(153,153,153,.38);
}

.access ul li:nth-of-type(1),
.access ul li:nth-of-type(2){
    margin: 0 0 5rem 0;
}

@media screen and (min-width: 768px) and (max-width: 1024px){
    .access .flex{
        flex-direction: unset;
    }    
}
@media screen and (min-width: 768px) and (max-width: 1224px) {
.access ul li{
    width: 30vw;
}
}

@media screen and (min-width: 1025px) and (max-width: 1440px) {
.access ul li{
    width: calc(100% - 52%);
}
}

@media screen and (min-width: 1441px)  {
.access ul li{
    width: 37rem;
}
}

.access ul li a{
    color: #000;
}

@media screen and (min-width: 768px) and (max-width: 1440px) {
.map iframe{
    width: 100%;
    height: 30vw;
}
}
@media screen and (min-width: 1441px)  {
.map iframe{
    width: 100%;
    height: 41.1rem;
}
}


@media screen and  (min-width: 768px){
    .access ul{
        margin: 0 4rem;
    padding: 4rem 5.5rem;        
    }
}

@media screen and  (max-width: 767px){
    .access{
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    }
    .access ul{
        margin: 0 2rem;
        padding: 2rem 2.75rem;
    }
    .access ul li{
        margin: 0 0 3rem 0;
    }
    .map iframe{
    width: 100%;
    height: 20rem;
}
}