
/*================================================*/
@media screen and (min-width: 768px), print {
/*================================================*/

/*----------------------------------------*/
.upd-s-kv.with-extrabanner {
    position: relative;
}
.upd-s-kv.with-extrabanner .floating-banner {
    position: fixed;
    left: 0;
    bottom: 105px;
    width: 100%;
    height: 0;
    z-index: 2;
}
/*--------*/
.upd-s-kv.with-extrabanner .floating-banner .area-object {
    position: absolute;
    right: 30px;
    top: 0;
    width: 80px;
    height: auto;
    aspect-ratio: 1/1;
}
.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%;
    transition-property: left;
    transition-duration: 0.2s;
    transition-timing-function: linear;
}
.upd-s-kv.with-extrabanner .floating-banner.act-expand .area-object .each .skin {
    left: -200px;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each .base {
    display: none;
    position: absolute;
    left: -17px;
    top: -42px;
    width: 320px;
    aspect-ratio: 364/160;
}
.upd-s-kv.with-extrabanner .floating-banner.act-expand .area-object .each .base {
    display: block;
}
.upd-s-kv.with-extrabanner .floating-banner .area-object .each .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.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 */
/*================================================*/
