@charset "utf-8";

@media only screen and (min-width: 0px) and (max-width: 1500px) {

.contents #character .block .flex h3 {
    font-size: calc(100vw * 70 / 1500);
}
.contents #character .block ul.txt {
    font-size: calc(100vw * 18 / 1500);
    padding: 0 calc(100vw * 55 / 1500);
    margin-right: calc(100vw * 150 / 1500);
    background-color: rgba(255,255,255,0.60);
}

/* 個別設定 */
.contents #character .block#shopping ul.txt {
    width: calc(100vw * 520 / 1500);
    height: calc(100vw * 220 / 1500);
    padding-top: calc(100vw * 40 / 1500);
    margin-top: calc(100vw * -40 / 1500);
}
.contents #character .block#car ul.txt {
    width: calc(100vw * 410 / 1500);
    height: calc(100vw * 220 / 1500);
    margin-top: calc(100vw * -180 / 1500);
}
.contents #character .block#community ul.txt {
    width: calc(100vw * 560 / 1500);
    height: calc(100vw * 180 / 1500);
    padding-top: calc(100vw * 30 / 1500);
    margin-top: calc(100vw * -30 / 1500);
}
.contents #character .block#nature ul.txt {
    width: calc(100vw * 520 / 1500);
    height: calc(100vw * 200 / 1500);
    padding-top: calc(100vw * 30 / 1500);
    margin-top: calc(100vw * -30 / 1500);
}
.contents #character .block#facility ul.txt {
    width: calc(100vw * 410 / 1500);
    height: calc(100vw * 200 / 1500);
    padding-top: calc(100vw * 30 / 1500);
    margin-top: calc(100vw * -30 / 1500);
    
}
.contents #character .block#life ul.txt {
    width: calc(100vw * 410 / 1500);
    height: calc(100vw * 150 / 1500);
    padding-top: calc(100vw * 25 / 1500);
    margin-top: calc(100vw * -25 / 1500);
}

.contents h5 {
    font-size: calc(100vw * 42 / 1500);
}
.contents h5 em {
    font-size: calc(100vw * 80 / 1500);
}


}



@media only screen and (min-width: 0px) and (max-width: 640px) {

.contents #intro {
    padding: 10.0rem 0;
}
.contents #intro dl dt {
    font-size: 4.0rem;
    margin: 0 auto 5.0rem;
}
.contents #intro dl dd {
    font-size: 2.0rem;
    line-height: 2;
    letter-spacing: 0.05em;
}
.contents #start {
    margin: 0 auto 6.0rem;
}
.contents p#txt-goto {
    font-size: 2.0rem;
    letter-spacing: 0.05em;
    margin: 0 auto 6.0rem;
}
.contents #character .block {
    margin: 0 auto 5.0rem;
}
.contents #character .block.reverse {
    text-align: right;
}
.contents #character .block .flex {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.contents #character .block .flex p.subimage {
    width: 30.0rem;
}
.contents #character .block .flex p.subimage span.caption {
    font-size: 10px;
    right: 1.0rem;
    bottom: 1.0rem;
}
.contents #character .block.reverse .flex p.subimage span.caption {
    left: 1.0rem;
    right: auto;
}
.contents #character .block .flex h3 {
    font-size: 3.6rem;
    margin-top: 0;
    margin-left: 8.0rem;
}
.contents #character .block.reverse .flex h3 {
    text-align: right;
    margin-left: 0;
    margin-right: 8.0rem;
}
.contents #character .block .mainimage {
    width: 100%;
    margin-top: 1.5rem;
    margin-bottom: 4.0rem;
}
.contents #character .block .mainimage span.caption {
    font-size: 10px;
    left: 1.0rem;
    bottom: 1.0rem;
}
.contents #character .block.reverse .mainimage span.caption {
    right: 1.0rem;
}
.contents #character .block ul.txt {
    font-size: 2.0rem;
    padding: 0;
    margin: 0 0 0 4.0rem;
    border: none;
    display: block;
}
.contents #character .block.reverse ul.txt {
    display: inline-block;
    text-align: left;
    margin: 0;
}

/* 個別設定 */
.contents #character .block#shopping ul.txt {
    width: auto;
    height: auto;
    padding: 0;
    margin: 0 0 0 4.0rem;
}
.contents #character .block#car ul.txt {
    width: auto;
    height: auto;
    margin: 0 4.0rem 0 0;
}
.contents #character .block#community ul.txt {
    width: auto;
    height: auto;
    padding: 0;
    margin: 0 0 0 4.0rem;
}
.contents #character .block#nature ul.txt {
    width: auto;
    height: auto;
    padding: 0;
    margin: 0 4.0rem 0 0;
}
.contents #character .block#facility ul.txt {
    width: auto;
    height: auto;
    padding: 0;
    margin: 0 0 0 4.0rem;
}
.contents #character .block#life ul.txt {
    width: auto;
    height: auto;
    padding: 0;
    margin: 0 4.0rem 0 0;
}

.contents h4 {
    width: 56.6rem;
    margin: 6.0rem auto;
}
.contents p#banner-swan {
    width: 45.0rem;
    margin: 0 auto 10.0rem;
}

.contents h5 {
    font-size: 2.6rem;
    line-height: 1.5;
    margin: 0 auto 10.0rem;
}
.contents h5 em {
    font-size: 4.4rem;
    padding-top: 1.0rem;
}
.contents h5 span.notice {
    width: 1.2rem;
}

}