
/*================================================*/
@media screen and (max-width: 767px) {
/*================================================*/

/*----------------------------------------*/
.upd-s-kv.with-extrabanner {
    position: relative;
    margin: 0 0 155px 0;
}
.upd-s-kv.with-extrabanner .floating-banner {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0;
}
/*--------*/
.upd-s-kv.with-extrabanner .floating-banner .area-object {
    position: relative;
    width: auto;
    height: 135px;
    aspect-ratio: 364/160;
    overflow: hidden;
    margin: 0 auto 0 auto;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .box-object {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition-property: rotate;
    transition-duration: 0.3s;
    transition-timing-function: linear;
    transform-origin: 50% 50%;
    rotate: x 0deg;
}
.upd-s-kv.with-extrabanner .floating-banner.act-next .area-object .box-object {
    rotate: x 90deg;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each:nth-of-type(1) {
    display: block;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each a {
    display: block;
    width: 100%;
    height: 100%;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each .skin {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each .base {
    width: 100%;
    height: 100%;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each .overlay {
    position: absolute;
    left: 16px;
    top: 40px;
    width: 75px;
    aspect-ratio: 1/1;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each.n1 .base .figelm.frame {
    background-image: url(/assets/upd/img/top/obj_exbnr_susteba_a.svg);
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each.n1 .overlay .figelm.circle {
    background-image: url(/assets/upd/img/top/obj_exbnr_susteba_b.svg);
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each.n1 .overlay .figelm.face {
    background-image: url(/assets/upd/img/top/obj_exbnr_susteba_c.svg);
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each.n2 .base .figelm.frame {
    background-image: url(/assets/upd/img/top/obj_exbnr_president_a.svg);
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each.n2 .overlay .figelm.face {
    background-image: url(/assets/upd/img/top/obj_exbnr_president_b.png);
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each a:hover {
    opacity: 1;
    transition-property: none;
}

/*================================================*/
} /* end of media query */
/*================================================*/
