@charset "utf-8";
/*-----------------------------------------------------------------------------------

    Theme Name: yyyy
    Theme URI: https://www.ina-research.co.jp/
    Description: 
    Author: Hackusha, Inc.
    Author URI: https://hackusha.jp/
    Version: 3.2
    Requires at least: 7.0
    Requires PHP: 8.3

-----------------------------------------------------------------------------------*/

#ina2019 .button-border-arrow {
    display: inline-block;
    padding: 0.5em 2em;
    border: 2px
    solid #009be2;
    font-weight: bold;
    position: relative;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    font-size: 18px;
}
#ina2019 .button-border-arrow:hover {
    text-decoration: none;
    background-color: #09f;
    color: white;
}
#ina2019 .button-border-arrow a {
    color: #09f;
    text-decoration: none;
}
#ina2019 .button-border-arrow:hover a {
    color: white;
    text-decoration: none;
}

#ina2019 .button-border-arrow::after {
    content: "▶︎";
    width: 14px;
    height: 21px;
    font-size: 12px;
    line-height: 1.5;
    position: absolute;
    top: 0px;
    right: 5px;
    bottom: 0px;
    color: rgb(0, 155, 226);
    margin: auto;
}
#ina2019 .button-border-arrow:hover::after {
    color: white;
}

.yyyy-home-hero {
    position: relative;
    width: 100%;
    min-height: 254px;
    max-height: 678px;
    aspect-ratio: 1280 / 678;
    overflow: hidden;
    background: #f2f2f2;
}
.yyyy-home-hero__slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: yyyy-home-hero-cycle 20s linear infinite;
    animation-delay: calc(var(--yyyy-hero-index) * -4s);
}
@keyframes yyyy-home-hero-cycle {
    0%, 18% { opacity: 1; }
    20%, 98% { opacity: 0; }
    100% { opacity: 1; }
}
.yyyy-home-hero__caption {
    position: absolute;
    z-index: 2;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 24px;
    color: #111;
    text-align: center;
    pointer-events: none;
    text-shadow: 0 1px 4px rgba(255, 255, 255, .9);
}
.yyyy-home-hero__caption h1 {
    max-width: 90%;
    margin: 0 0 1.5em;
    font-size: clamp(24px, 3.2vw, 40px);
    line-height: 1.5;
}
.yyyy-home-hero__caption p {
    max-width: 90%;
    margin: 0;
    font-size: clamp(13px, 1.2vw, 16px);
}
@media (prefers-reduced-motion: reduce) {
    .yyyy-home-hero__slide { animation: none; }
    .yyyy-home-hero__slide:first-child { opacity: 1; }
    .yyyy-home-hero__slide:not(:first-child) { display: none; }
}
@media (max-width: 576px) {
    .yyyy-home-hero__caption { padding: 16px; }
    .yyyy-home-hero__caption h1 { margin-bottom: 1em; }
}
