@charset "UTF-8";
/* CSS Document */

/* ---------- COMMON ---------- */

/* content title */
.content_title{
    color: #3e3a39;
    text-align: center;
}

/* gallery */
.photo_area img{
    position: absolute;
}

.thumb li{
    display: inline-block;
}

.thumb li img{
    opacity: 0.5;
    filter: alpha(opacity=50);
    width: 65px;
}

.thumb li.current img{
    opacity: 1;
    filter: alpha(opacity=100);
}

/* profile */
.profile h2{
    margin-bottom: 15px;
    text-align: center;
}

.profile p{
    margin-bottom: 1em;
}

.profile dl{
    border-bottom: solid 1px #cbcbcb;
    display: table;
    width:100%;
}

.profile dl:first-of-type{
    border-top: solid 1px #cbcbcb;
}

.profile dt,
.profile dd{
    display: table-cell;
    padding: 5px 0;
    vertical-align: bottom;
}

.profile dt{
    text-align: right;
    width: 45%;
}

.profile span{
    display: inline-block;
    text-align: center;
    width: 6em;
}

.profile dt:after{
    content:"／";
}

.profile dd {
    text-align: center;
}

/* stories */
.stories h2 {
    background: #e5e5e5;
    font-weight: 400;
    margin-bottom: 15px;
    padding: 5px 10px;
}

.stories ol{
    margin-left: 1.5em;
}

.stories ol li{
    margin-bottom: 10px;
}

/* shop info */
.shop_info{
    margin-bottom: 40px;
}
.shop_info h2{
    text-align: center;
    margin-bottom: 15px;
}

.shop_info dl{
    width:100%;
}

.shop_info dt,
.shop_info dd{
    text-align: center;
}

.shop_info dt{
    background: #E2E2E2;
    margin-bottom: 3px;
    padding:2px 4px;
}

.shop_info dd{
    margin-bottom: 3px;
    padding:2px 4px;
}

/* support */
.support{
    margin-bottom: 30px;
}

.support h2{
    text-align: center;
    margin-bottom: 15px;
}

/* plans */
.plans h2,
.floor-plan h2,
.gallery h2{
    color: #3e3a39;
    font-size: 130%;
    font-weight: 600;
    margin-bottom: 20px;
}

.plans p{
    margin-bottom: 20px;
}

.plans li{
    display: inline-block;
    list-style: none;
    padding-left:5px;
    padding-right: 5px;
    vertical-align: top;
}

.plans figcaption{
    font-size: 80%;
    line-height: 1.4em;
    text-align: left;
}

/* floor-plan */

.floor-plan ol{
    margin-left: 1.5em;
    margin-bottom: 20px;
}

.floor-plan ol li{
    margin-bottom: 10px;
}

.floor-plan figure{
    text-align: center;
}

.floor-plan img{
    max-width: 100%;
}

/* movie */
.movie{
    margin-bottom: 40px;
}
.movie h2 {
    font-size: 130%;
    margin-bottom: 20px;
}

.movie ul li {
    font-size: 90%;
    list-style: none;
    line-height: 1.2em;
    margin-bottom: 20px;
}

.movie video {
    max-width: 100%;
}

/* photo_gallery */
.photo_gallery li{
    display: inline-block;
    list-style: none;
}

.photo_gallery p{
    margin-bottom: 20px;
}

/* ---------- Mobile ---------- */
@media(max-width:737px) {
    #content-body{
        border-top: solid 1px #cbcbcb;
    }

    #content-body article{
        margin-left: 1.5em;
        margin-right: 1.5em;
    }

/* content title */
    .content_title{
        font-size: 140%;
        padding: 30px 0 15px 0;
    }

/* gallery */
    .photo_area{
        display: block;
        height: auto;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 15px;
    }

    .thumb{
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;
    }

    .thumb li{
        margin: 0 1px 2px 1px;
    }

    .thumb li img{
        width: 40px;
    }

/* gallery */
    .photo_gallery{
        margin-bottom: 30px;
        margin-left: 1.5em;
        margin-right: 1.5em;
    }

    .photo_gallery h2{
        font-size: 120%;
        margin-bottom: 15px;
    }

    .photo_gallery li img{
        width: 90px;
    }

    @media(max-width:413px) {
        .gallery ul{
            margin-left: auto;
            margin-right: auto;
            width: 278px;
        }
    }

/* profile */
    .profile{
        margin-bottom: 30px;
    }

    .profile dd{
        padding-left: 10px;
    }

/* stories */
    .stories{
        margin-bottom: 30px;
    }

    .stories p{
        margin-bottom: 15px;
    }

/* plans */
    .plans{
        margin-bottom: 30px;
    }

    .plans ul{
        text-align: center;
    }

    .plans li{
        margin-bottom: 15px;
    }

    .plans figure img{
        max-width: 100%;
    }

/* support */
    .support ul{
        margin-left: 1.5em;
    }

/* floor-plan */
    .floor-plan{
        margin-bottom: 30px;
    }

/* movie */
    .movie iframe{
        max-width: 100%;
    }

    .movie li{
        width: 100% !important;
    }

    .movie video{
        width: 100%;
    }

}

/* ---------- Portlate ---------- */
@media(max-width:567px) {

/* gallery */
@media(max-width:374px){
    .photo_area{
        height: 200px;
        width: 278px
    }

    .photo_area img{
        width: 278px;
    }

    .thumb{
        width: 272px;
    }

}

@media(max-width:413px) and (min-width:375px){
    .photo_area{
        height: 240px;
        width: 334px;
    }

    .photo_area img{
        width: 334px;
    }

    .thumb{
        width: 318px;
    }
}

@media(max-width:567px) and (min-width:414px){
    .photo_area{
        height: 265px;
        width: 373px;
    }

    .photo_area img{
        width: 373px;
    }

    .thumb{
        width: 364px;
    }

/* profile */
    .profile span{
        padding-right: 25%;
    }
}

}
/* ---------- landscape ---------- */
@media(max-width:767px) and (min-width: 568px){

/* gallery */
    .photo_area{
        height: 265px;
        width: 373px;
    }

    .photo_area img{
        width: 373px;
    }

    .thumb{
        width: 364px;
    }

/* profile */
    .profile{
        margin-left: auto;
        margin-right: auto;
        max-width: 400px;
    }

    .profile span{
        padding-right: 30%;
    }

/* support */
    .support ul{
        background: #f7f6f5;
        padding: 20px;
    }

    .support li{
        display: inline-block;
        margin-bottom: 5px;
        width: 32%;
    }

}


/* ---------- Tablet / PC ---------- */
@media (min-width: 737px) {

    #content-body article{
        margin-left: auto;
        margin-right: auto;
        width: 745px;
    }

/* content title */
    .content_title{
        font-size: 220%;
        line-height: 1.2em;
        padding-bottom: 35px
    }

/* gallery */
    .photo_area{
        height: 500px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 35px;
        width: 700px;
    }

    .thumb{
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px;
        width: 500px;
    }

/* photo_gallery */
    .photo_gallery{
        margin-bottom: 50px;
    }

    .photo_gallery h2{
        font-size: 130%;
        margin-bottom: 30px;
    }

/* profile */
    .profile,
    .stories{
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 40px;
        width: 550px;
    }

    .profile span{
        padding-right: 35%;
    }

/* stories */
    .stories p{
        margin-bottom: 20px;
    }

/* plans */
    .plans{
        margin-bottom: 30px;
    }

    .plans ul{
        text-align: center;
    }

    .plans li{
        margin-bottom: 15px;
    }

/* floor-plan */
    .floor-plan{
        margin-bottom: 70px;
    }

/* support */
    .support ul{
        background: #f7f6f5;
        padding: 20px;
    }

    .support li{
        display: inline-block;
        margin-bottom: 5px;
        width: 32%;
    }

/* movie */
    .movie ul{
        text-align: center;
    }
}

/* ---------- Tablet ---------- */
@media(max-width:1023px) and (min-width: 737px){

    /* content title */
    .content_title{
        padding-top: 60px;
    }
}

/* ---------- PC ---------- */
@media(min-width:1024px){

    /* content title */
    .content_title{
        padding-top: 90px;
    }
}