@charset 'UTF-8';


.content-area
{
    background: url(../img/location/pc_bg_location.jpg) no-repeat center top;
}

@media screen and (max-width: 740px)
{
    .content-area
    {
        background: url(../img/location/sp_bg_location.jpg) no-repeat center top;
        background-size: 100% auto;
    }
}

/* mv
---------------------------------------- */
#mv .inner-area
{
    padding: 153px 0 131px 0;

    text-align: center;
}

@media screen and (max-width: 740px)
{
    #mv .inner-area
    {
        padding: 7.8125vw 0;
    }
    #mv .inner-area p
    {
        width: 100%;
        margin: 0 auto;
    }
}

/* panorama_tit
---------------------------------------- */
.panorama_tit .inner
{
    max-width: 1140px;
    margin: 0 auto;
    padding: 60px 0 40px 0;
}

.panorama_tit h3
{
    font-family: 游明朝, HonMincho-Book, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', HG明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 1.8;

    margin-bottom: 10px;

    text-align: center;
}

.panorama_tit .txt
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.8;

    text-align: center;
}

@media screen and (max-width: 1200px)
{
    .panorama_tit .inner
    {
        padding: 3.90625vw 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    .panorama_tit .inner
    {
        padding: 7.8125vw 3.125vw !important;
    }
    .panorama_tit h3
    {
        font-size: 1.8rem !important;

        text-align: center !important;
    }
}

/* panorama
---------------------------------------- */
.panorama
{
    border: 8px solid #eee;
}

.panorama,
.panorama-view
{
    overflow: hidden;

    width: 100%;
    max-width: 1700px;
    height: 500px;
    margin: 0 auto;
}

.panorama,
.panorama-container
{
    position: relative;

    cursor: col-resize;
}

.panorama-container img
{
    position: absolute;
    top: 0;
    left: 0;

    height: 100%;
}

.panorama a.prev
{
    left: 10px;
}

.panorama a.next
{
    right: 10px;
}

.panorama a.prev,
.panorama a.next
{
    font-size: 17px;

    position: absolute;
    z-index: 1000;
    top: 240px;

    padding: 6px;
    padding-top: 5px;
    padding-bottom: 7px;

    cursor: pointer;
    text-decoration: none;

    opacity: .6;
    color: #434343;
    border-radius: 3px;
    background-color: #000;

    filter: alpha(opacity=60);
}

.panorama a.prev:hover,
.panorama a.next:hover
{
    opacity: .8;

    filter: alpha(opacity=80);
}

@media screen and (max-width: 767px)
{
    .panorama,
    .panorama-view
    {
        width: 100%;
        height: 300px;
        margin: 0 auto;
    }
    .panorama
    {
        width: 94%;

        border: 4px solid #eee;
    }
    .panorama-container img
    {
        width: auto;
    }
    .panorama a.prev,
    .panorama a.next
    {
        top: 140px;
    }
}

/* map
---------------------------------------- */
#map
{
    padding: 0 0 90px 0;

    text-align: center;
}

#map .image
{
    margin-bottom: 28px;
}

@media screen and (max-width: 1200px)
{
    #map .inner
    {
        padding: 0 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    #map
    {
        padding: 0 0 14.0625vw 0;
    }
    #map .image
    {
        width: 80%;
        margin: 0 auto 20px auto;
    }
    #map .button
    {
        width: 60%;
        margin: 0 auto;
    }
    #map .button img
    {
        width: 100%;
    }
}

/* location
---------------------------------------- */
#location
{
    padding: 0 0 84px 0;
}

#location .inner
{
    max-width: 1140px;
    margin: 0 auto;
}

#location ul
{
    display: -webkit-flex;
    display:         flex;

    flex-wrap: wrap;
}

#location ul li
{
    width: 23.94%;
    margin: 20px 0 0 1.35%;
}

#location ul li:nth-child(-n + 4)
{
    margin-top: 0;
}

#location ul li:nth-child(4n + 1)
{
    margin-left: 0;
}

#location ul li .caption
{
    font-size: 1.3rem;

    padding: 8px 0 0 0;

    text-align: center;
}

@media screen and (max-width: 1200px)
{
    #location .inner
    {
        padding: 0 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    #location
    {
        padding: 0 0 13.125vw 0;
    }
    #location ul li
    {
        width: 48%;
        margin: 4.6875vw 0 0 2%;
    }
    #location ul li:nth-child(3),
    #location ul li:nth-child(4)
    {
        margin-top: 4.6875vw;
    }
    #location ul li:nth-child(2n + 1)
    {
        margin-left: 0;
    }
    #location ul li .image img
    {
        width: 100%;
    }
    #location ul li .caption
    {
        font-size: 2.8125vw;
    }
}

/* infomation
---------------------------------------- */
#infomation
{
    padding: 77px 0 66px 0;

    background-color: #f3f3f3;
}

#infomation .inner
{
    max-width: 1140px;
    margin: 0 auto;
}

#infomation h2
{
    margin: 0 0 56px 0;

    text-align: center;
}

#infomation .list-wrap
{
    display: -webkit-flex;
    display:         flex;

    -webkit-justify-content: space-between;
            justify-content: space-between;
}

#infomation .list-wrap .list
{
    width: 362px;
}

#infomation .list-wrap .list dl
{
    margin: 35px 0 0 0;
}

#infomation .list-wrap .list dl:first-of-type
{
    margin: 0;
}

#infomation .list-wrap .list dl dt
{
    font-size: 1.3rem;

    margin: 0 0 10px 0;
    padding: 5px 8px;

    color: #fff;
    background-color: #6d84bc;
}

#infomation .list-wrap .list dl dd
{
    position: relative;

    display: -webkit-flex;
    display:         flex;

    margin: 0 0 6px 0;

    -webkit-justify-content: space-between;
            justify-content: space-between;
    -webkit-align-items: center;
            align-items: center;
}

#infomation .list-wrap .list dl dd::before
{
    position: absolute;
    top: 50%;

    width: 100%;
    height: 1px;
    padding: 5px 0 0 0;

    content: '';

    border-top: 1px dashed #000;
}

#infomation .list-wrap .list dl dd span
{
    font-size: 1.3rem;

    position: relative;
    z-index: 1;

    display: inline-block;

    letter-spacing: -.08em;

    background-color: #f3f3f3;
}

#infomation .list-wrap .list dl dd .name
{
    margin: 0 10px 0 0;
    padding: 0 10px 0 0;
}

#infomation .list-wrap .list dl dd .distance
{
    padding: 0 0 0 10px;

    white-space: nowrap;
}

@media screen and (max-width: 1200px)
{
    #infomation .inner
    {
        padding: 0 3.125vw;
    }
    #infomation .list
    {
        width: 31%;
        margin-left: 3.5%;
    }
    #infomation .list:first-child
    {
        margin-left: 0;
    }
}

@media screen and (max-width: 740px)
{
    #infomation
    {
        padding: 13.28125vw 0 10.9375vw 0;
    }
    #infomation h2
    {
        width: 60%;
        margin: 0 auto 7.8125vw auto;
    }
    #infomation .list-wrap
    {
        display: block;
    }
    #infomation .list-wrap .list
    {
        width: 100%;
        margin: 0;
    }
    #infomation .list-wrap .list dl
    {
        margin: 5.46875vw 0 0 0;
    }
    #infomation .list-wrap .list dl:first-of-type
    {
        margin: 5.46875vw 0 0 0;
    }
    #infomation .list-wrap .list dl dt
    {
        font-size: 2.8125vw;
    }
    #infomation .list-wrap .list dl dd span
    {
        font-size: 2.8125vw;
    }
}

/* subway
---------------------------------------- */
#subway
{
    padding: 69px 0 0 0;
}

#subway .inner
{
    max-width: 1140px;
    margin: 0 auto;
}

#subway .wrap
{
    display: -webkit-flex;
    display:         flex;

    -webkit-justify-content: space-between;
            justify-content: space-between;
    -webkit-align-items: top;
            align-items: top;
    -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
}

#subway .text
{
    width: 100%;
    margin-bottom: 50px;

    text-align: center;
}

#subway .image
{
    width: 48%;
}

#subway .list
{
    display: -webkit-flex;
    display:         flex;

    width: 48%;

    -webkit-justify-content: space-between;
            justify-content: space-between;
    -webkit-align-items: top;
            align-items: top;
    -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
}

#subway .list li
{
    font-size: 1.3rem;
    line-height: 1.2;

    width: 46%;
    margin-bottom: 30px;
}

#subway .list li img
{
    width: 100%;
    margin-bottom: 5px;
}

@media screen and (max-width: 1200px)
{
    #subway .inner
    {
        padding: 0 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    #subway
    {
        padding: 10.78125vw 0 0 0;
    }
    #subway .wrap
    {
        display: block;
    }
    #subway .text
    {
        width: 100%;
        margin: 0 auto 4.6875vw auto;
        padding: 0;
    }
    #subway .image
    {
        width: 100%;
        margin: 0 auto 4.6875vw auto;
        padding: 0;
    }
    #subway .list
    {
        width: 100%;
        margin: 0 auto;
    }
    #subway .list li
    {
        font-size: 2.8125vw;

        width: 48%;
        margin: 0 auto 4.6875vw auto;
    }
}

/* note
---------------------------------------- */
.note .inner
{
    font-size: 1.1rem;

    max-width: 1540px;
    margin: 0 auto;
    padding: 10px 0 50px 0;

    color: #333;
}

@media screen and (max-width: 1540px)
{
    .note .inner
    {
        padding: 10px 3.125vw 50px 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    .note .inner
    {
        font-size: 2.8125vw;

        padding: 7.03125vw 3.125vw;
    }
}
