@charset "UTF-8";

/*
/* hero_banner
/* -------------------------------------------------- */

.hero_banner { position: relative; background-repeat: no-repeat; background-position: center; }
.hero_banner_link { position: relative; }
.hero_banner_button { position: absolute; background: #001968; transition: all .2s linear; }
.hero_banner_button:hover,
.hero_banner_button:focus,
.hero_banner_button:active { background: #203988; text-decoration: none; }

@media screen and (min-width: 700px), print {
.hero_banner { width: 640px; height: 100px; background-size: 100%; }
.hero_banner_link { width: 640px; height: 100px; }
.hero_banner_button { top: 48px; left: 210px; width: 135px; height: 36px; }
.hero_banner_button:nth-of-type(2) { left: 355px; }
}

@media only screen and (max-width: 699px) {
.hero_banner { width: 100vw; height: calc((100vw / 64) * 10); background-size: cover; }
.hero_banner_link { width: 100vw; height: calc((100vw / 64) * 10); }
.hero_banner_button { top: 7.5vw; left: 32vw; width: 22vw; height: 6vw; font-size: 2.8vw; }
.hero_banner_button:nth-of-type(2) { left: 55vw; }
}