:root {
    --c-header: #162446;
    --c-footer: #273445;
    --c-text: #222;
    --c-muted: #666;
    --c-border: #e6e8ef;
    --c-btn-from: #0A1833;
    --c-btn-to: #1C3B70;
    --container-w: 1280px
}

* {
    box-sizing: border-box
}

html,body {
    height: 100%
}

body {
    margin: 0px;
    color: var(--c-text);
    font-family: Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
    line-height: 1.8;
    background: rgb(255,255,255)
}

img {
    display: block;
    max-width: 100%
}

.article-lead a {
    color: #162446
}

.container {
    width: min(var(--container-w),100%);
    margin-inline:auto;padding-inline:0px}

.site-header {
    position: sticky;
    top: 0px;
    z-index: 1000;
    background: var(--c-header);
    backdrop-filter: saturate(120%)blur(4px);
    color: rgb(255,255,255)
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px
}

.logo {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgb(255,255,255);
    text-decoration: none
}

.logo-mark {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: linear-gradient(rgb(111,167,255),rgb(55,85,170))
}

.logo-text {
    font-size: 12px;
    line-height: 1.1;
    letter-spacing: 0.4px
}

.gnav ul {
    display: flex;
    gap: 20px;
    list-style: none;
    margin: 0px;
    padding: 0px
}

.gnav a {
    color: rgb(255,255,255);
    text-decoration: none;
    font-size: 13px;
    letter-spacing: 0.2px;
    padding: 8px 4px;
    display: inline-block
}

.gnav a:hover {
    opacity: 0.85
}

.hamburger {
    display: none;
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    cursor: pointer
}

.hamburger span {
    display: block;
    width: 24px;
    height: 2px;
    background: rgb(255,255,255);
    margin: 6px auto;
    transition: transform 0.2s,opacity 0.2s
}

.hamburger.is-active span:nth-child(1) {
    transform: translateY(8px)rotate(45deg)
}

.hamburger.is-active span:nth-child(2) {
    opacity: 0
}

.hamburger.is-active span:nth-child(3) {
    transform: translateY(-8px)rotate(-45deg)
}

.spnav {
    display: none;
    background: var(--c-header)
}

.spnav.is-open {
    display: block
}

.spnav ul {
    list-style: none;
    margin: 0px;
    padding: 8px 24px 24px
}

.spnav a {
    color: rgb(255,255,255);
    text-decoration: none;
    display: block;
    padding: 14px 0px;
    border-bottom: 1px solid rgba(255,255,255,0.08)
}

.no-scroll {
    overflow: hidden
}

.hero {
    position: relative;
    color: rgb(255,255,255);
    background-image: url("assets/img/hero_pc.jpg");
    background-size: cover;
    background-position: center center;
    padding: 100px 0px 40px;
    isolation: isolate
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0px;
    z-index: -1
}

.hero-title {
    font-weight: 700;
    font-size: 42px;
    line-height: 1.35;
    letter-spacing: 0.04em;
    margin: 0px 0px 16px;
    text-shadow: rgb(0,0,0)1px 0px 10px
}

.hero-lead {
    max-width: 760px;
    margin: 0px 0px 80px;
    color: rgb(255,255,255);
    font-size: 15px;
    text-shadow: rgb(0,0,0)1px 0px 10px
}

.btn {
    display: block;
    width: 212px;
    height: 50px;
    line-height: 50px;
    margin: 20px auto 0px;
    text-align: center;
    border-radius: 0px;
    color: rgb(255,255,255);
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 0.04em;
    background: linear-gradient(180deg,var(--c-btn-from),var(--c-btn-to));
    box-shadow: rgba(10,24,51,0.25)0px 8px 16px;
    transition: transform 0.6s,filter 0.6s,background 0.1s,font-size 0.15s
}

.btn:hover,.btn:focus-visible {
    background: linear-gradient(180deg,var(--c-btn-to),var(--c-btn-from));
    font-size: 17px
}

.btn:active {
    transform: translateY(1px)
}

.btn--sm {
    width: 212px;
    height: 50px;
    line-height: 50px;
    margin: 20px auto 0px
}

.btn.btn--sm:hover,.btn.btn--sm:focus-visible {
    font-size: 17px
}

.voices-head-long {
    text-align: center;
    margin: 8px 0px 16px 0px
}

.section-title {
    text-align: center;
    font-weight: 400;
    letter-spacing: 0.1em;
    font-size: 24px;
    color: rgb(2,8,42);
    margin: 40px 0px 20px
}

.news-list {
    list-style: none;
    padding: 0px;
    margin: 0px auto 24px;
    max-width: 880px;
    border-top: 1px solid var(--c-border)
}

.news-list li {
    display: grid;
    grid-template-columns: 120px 1fr;
    align-items: center;
    gap: 16px;
    padding: 14px 8px;
    border-bottom: 1px solid var(--c-border)
}

.news-list time {
    color: var(--c-muted);
    font-size: 14px
}

.news-list a {
    color: rgb(34,34,34);
    text-decoration: none;
    font-size: 14px
}

.news-list a:hover {
    text-decoration: underline
}

.feature {
    padding: 64px 0px
}

.feature-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center
}

.feature-image img {
    width: 100%;
    object-fit: cover;
    border-radius: 0px;
    height: 420px !important
}

.feature-body {
    max-width: 560px;
    margin: 0px auto;
    text-align: left;
    padding: 20px 0px
}

.feature-title {
    font-family: Inter;
    font-size: 32px;
    line-height: 1.35;
    letter-spacing: 0.06em;
    margin: 0px 0px 12px;
    color: rgb(2,8,42);
    text-shadow: rgba(28,59,112,0.2)0px 2px 10px;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    text-align: center;
    font-weight: 400
}

.feature-desc {
    color: rgb(51,51,51);
    margin: 0px 0px 24px;
    font-size: 14px;
    line-height: 1.9
}

.feature--image-right .feature-inner {
    grid-template-columns: 1fr 1fr
}

.feature--image-right .feature-inner>.feature-body {
    order: 1
}

.feature--image-right .feature-inner>.feature-image {
    order: 2
}

.cta {
    padding: 56px 0px 80px;
    background: rgb(247,249,255)
}

.cta-inner {
    text-align: center
}

.cta-text {
    margin: 0px 0px 20px;
    font-size: 14px;
    padding: 10px
}

.site-footer {
    background: rgb(39,52,69);
    color: rgb(207,214,230)
}

.site-footer .footer-logo {
    display: block
}

@media(min-width: 769px) {
    .site-footer .footer-inner {
        display:grid;
        grid-template-columns: 260px 560px 240px;
        grid-template-areas: "brand center right";
        align-items: start;
        gap: 80px;
        width: min(var(--container-w),100%);
        margin-inline:auto;padding: 40px 24px 12px
    }

    .site-footer .footer-brand {
        grid-area: brand;
        display: flex;
        align-items: center;
        gap: 12px
    }

    .site-footer .footer-brand .footer-logo {
        height: 50px;
        width: auto
    }

    .site-footer .footer-nav {
        list-style: none;
        margin: 0px;
        padding: 0px;
        display: flex;
        flex-direction: column;
        gap: 16px
    }

    .site-footer .footer-nav--center {
        grid-area: center
    }

    .site-footer .footer-nav--right {
        grid-area: right
    }

    .site-footer .footer-nav a {
        color: rgb(255,255,255);
        text-decoration: none;
        font: 700 14px / 1.6 Inter,system-ui,sans-serif;
        letter-spacing: 0.02em
    }

    .site-footer .footer-nav a:hover {
        text-decoration: underline
    }

    .site-footer .footer-copy {
        width: min(var(--container-w),100%);
        margin: 22px auto 0px;
        padding: 14px 24px 0px;
        border-top: 1px solid rgba(255,255,255,0.36);
        text-align: center;
        font-size: 12px;
        color: rgb(205,213,230)
    }
}

@media(max-width: 768px) {
    .gnav {
        display:none
    }

    .hamburger {
        display: inline-block
    }

    .hero {
        padding: 84px 0px 100px
    }

    .hero-title {
        font-size: 30px;
        text-shadow: rgba(28,59,112,0.25)0px 2px 8px
    }

    .hero-lead {
        font-size: 14px
    }

    .news-list {
        max-width: 100%
    }

    .news-list li {
        grid-template-columns: 100px 1fr
    }

    .feature {
        padding: 48px 0px
    }

    .feature-inner {
        grid-template-columns: 1fr;
        gap: 28px
    }

    .feature-inner>.feature-image {
        order: 1 !important
    }

    .feature-inner>.feature-body {
        order: 2 !important
    }

    .feature-image img {
        height: 420px !important
    }

    .feature-body {
        max-width: none;
        padding: 12px 0px
    }

    .feature-title {
        font-size: 28px;
        text-shadow: rgba(28,59,112,0.22)0px 1px 6px
    }

    .site-footer .footer-inner {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        width: min(var(--container-w),100%);
        margin-inline:auto;padding: 28px 24px 12px
    }

    .site-footer .footer-brand {
        display: flex;
        align-items: center;
        gap: 12px
    }

    .site-footer .footer-brand .footer-logo {
        height: 50px;
        width: auto
    }

    .site-footer .footer-nav {
        list-style: none;
        margin: 0px;
        padding: 0px;
        display: flex;
        flex-direction: column;
        gap: 24px
    }

    .site-footer .footer-nav a {
        color: rgb(255,255,255);
        text-decoration: none;
        font: 700 14px / 1.8 Inter,system-ui,sans-serif;
        letter-spacing: 0.02em
    }

    .site-footer .footer-copy {
        width: min(var(--container-w),100%);
        margin: 16px auto 0px;
        padding: 12px 0px 0px;
        border-top: 1px solid rgba(255,255,255,0.36);
        text-align: center;
        font-size: 12px
    }

    p.newsletter-info {
        margin: 8px 24px 0px
    }
}

@media(max-width: 600px) {
    .feature-image img {
        height:300px !important
    }
}

@media(max-width: 430px) {
    .hero {
        background-image:url("assets/img/hero_sp_430.jpg");
        padding: 140px 0px 135px
    }

    .hero-title {
        font-size: 28px;
        text-shadow: rgb(0,0,0)1px 0px 10px
    }

    .news-list li {
        grid-template-columns: 1fr;
        gap: 6px
    }

    .news-list time {
        font-size: 13px
    }

    .feature-title {
        font-size: 24px;
        letter-spacing: 0.06em;
        line-height: 1.3
    }

    .feature-image img {
        border-radius: 0px;
        height: 240px !important
    }

    .site-footer .footer-inner {
        gap: 20px;
        padding: 24px 24px 10px
    }

    .site-footer .footer-nav {
        gap: 20px
    }
}

@media(max-width: 375px) {
    .hero {
        background-image:url("assets/img/hero_sp_375.jpg");
        padding: 140px 0px 135px
    }

    .hero-title {
        font-size: 28px;
        text-shadow: rgb(0,0,0)1px 0px 10px
    }

    .hero-lead {
        font-size: 13px
    }

    .site-footer .footer-inner {
        gap: 18px;
        padding: 22px 24px 8px
    }

    .site-footer .footer-nav {
        gap: 18px
    }

    .site-footer .footer-copy {
        padding-top: 10px
    }
}

@media(max-width: 768px) {
    .feature .feature-inner,.feature--image-right .feature-inner,.feature--image-left .feature-inner {
        gap:20px;
        grid-template-columns: 1fr !important
    }

    .feature-inner>.feature-image {
        order: 1 !important
    }

    .feature-inner>.feature-body {
        order: 2 !important
    }

    .feature-image {
        width: 100%
    }

    .feature-image img {
        width: 100%;
        height: auto;
        max-height: none;
        border-radius: 0px
    }

    .feature-body {
        max-width: none;
        padding: 8px 0px 0px;
        margin: 0px;
        text-align: left
    }

    .feature-title {
        font-size: 28px;
        letter-spacing: 0.04em;
        line-height: 1.3;
        margin: 12px 0px 10px;
        text-shadow: rgba(28,59,112,0.22)0px 1px 6px;
        word-break: normal;
        overflow-wrap: break-word;
        hyphens: manual
    }

    .feature-desc {
        font-size: 14px;
        line-height: 1.9;
        margin: 0px 0px 18px
    }

    .btn {
        margin: 16px auto 0px;
        width: 212px;
        height: 50px;
        line-height: 50px;
        border-radius: 0px
    }
}

@media(max-width: 500px) {
    .feature-title {
        font-size:21px;
        letter-spacing: 0.04em;
        line-height: 1.28;
        text-shadow: rgba(28,59,112,0.2)0px 1px 5px;
        word-break: normal;
        overflow-wrap: break-word
    }

    .feature-desc {
        margin: 4px 0px 18px
    }
}

@media(min-width: 769px)and(max-width:1279px) {
    .site-footer .footer-inner {
        grid-template-columns:clamp(160px,18vw,220px)minmax(0px,1fr)clamp(160px,16vw,220px);
        gap: clamp(24px,5vw,64px);
        padding: 32px 24px 10px
    }

    .site-footer .footer-brand .footer-logo {
        height: clamp(32px,6.2vw,50px);
        width: auto
    }

    .site-footer .footer-nav a {
        font-size: 13px;
        line-height: 1.6
    }

    .site-footer .footer-copy {
        margin-top: 18px;
        padding-top: 12px
    }
}

@media(min-width: 769px)and(max-width:980px) {
    .site-footer .footer-inner {
        grid-template-columns:clamp(160px,22vw,200px)1fr;
        grid-template-areas: "brand center" "brand right";
        gap: 24px clamp(24px,5vw,48px)
    }

    .site-footer .footer-brand {
        grid-area: brand
    }

    .site-footer .footer-nav--center {
        grid-area: center
    }

    .site-footer .footer-nav--right {
        grid-area: right
    }
}

.hero-inner {
    opacity: 0;
    animation: 0.3s ease-out 0.3s 1 normal forwards running topmv
}

.hero-title {
    opacity: 0;
    transform: translateX(-18px);
    transform-origin: left center;
    will-change: transform,opacity;
    animation: 1s cubic-bezier(0.2,0.7,0.2,1)0.6s 1 normal forwards running topmvcatch;
    backface-visibility: hidden;
    text-align: left;
    text-shadow: rgb(0,0,0)1px 0px 10px
}

.hero-lead {
    opacity: 0;
    transform: translateX(-14px);
    will-change: transform,opacity;
    animation: 1s cubic-bezier(0.2,0.7,0.2,1)1.2s 1 normal forwards running topmvtxt;
    backface-visibility: hidden
}

.hear-sub {
    text-align: center
}

.hero .btn {
    opacity: 0;
    transform: translateX(-10px);
    transform-origin: left center;
    will-change: transform,opacity;
    animation: 0.8s cubic-bezier(0.2,0.7,0.2,1)1.6s 1 normal forwards running topmvbtn;
    backface-visibility: hidden
}

.hero-inner {
    opacity: 0;
    transform: translateX(-8px);
    animation: 0.3s ease-out 0.3s 1 normal forwards running topmv
}

@keyframes topmv {
    0% {
        opacity: 0;
        transform: translateX(-8px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

@keyframes topmvcatch {
    0% {
        opacity: 0;
        transform: translateX(-18px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

@keyframes topmvtxt {
    0% {
        opacity: 0;
        transform: translateX(-14px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

@keyframes topmvbtn {
    0% {
        opacity: 0;
        transform: translateX(-10px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

@media(prefers-reduced-motion:reduce) {
    .hero-inner,.hero-title,.hero-lead,.hero .btn {
        animation: auto ease 0s 1 normal none running none !important;
        opacity: 1 !important;
        transform: none !important
    }
}

.reveal-target {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.7s,transform 0.7s;
    will-change: opacity,transform
}

.reveal-target.is-inview {
    opacity: 1;
    transform: none
}

.reveal-target .feature-image,.reveal-target .feature-body {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.7s,transform 0.7s
}

.reveal-target.is-inview .feature-image,.reveal-target.is-inview .feature-body {
    opacity: 1;
    transform: none
}

@media(prefers-reduced-motion:reduce) {
    .reveal-target,.reveal-target .feature-image,.reveal-target .feature-body {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important
    }
}

:root {
    --btn-grad-dur: 3.6s;
    --btn-grad-ease: cubic-bezier(.22,.61,.36,1)
}

.btn {
    transform: none;
    background-image: linear-gradient(180deg,var(--c-btn-from)0%,var(--c-btn-to)50%,var(--c-btn-from)100%);
    background-size: 100% 200%;
    background-position: 0px 0px;
    animation: btnGradPan var(--btn-grad-dur)var(--btn-grad-ease)infinite alternate;
    transition: font-size var(--btn-grad-dur)var(--btn-grad-ease),filter var(--btn-grad-dur)var(--btn-grad-ease);
    will-change: background-position,font-size
}

.btn:hover,.btn:focus-visible {
    font-size: 16px
}

@keyframes btnGradPan {
    0% {
        background-position: 0px 0px
    }

    50% {
        background-position: 0px 100%
    }

    100% {
        background-position: 0px 0px
    }
}

.hero.hero--contact {
    background-image: url("assets/img/hero_contact.jpg")
}

.page-contact .contact-head,.newsletter-head {
    max-width: 762px;
    margin: 40px auto 24px;
    padding: 0px 24px;
    text-align: center
}

.page-contact .contact-head .contact-title,.newsletter-title {
    font-weight: 600;
    font-size: 28px;
    letter-spacing: 0.02em;
    font-family: Inter;
    margin: 0px 0px 40px;
    color: rgb(2,8,42)
}

.page-contact .contact-head .contact-lead,.newsletter-lead {
    margin: 0px;
    color: rgb(51,51,51);
    font-size: 14px;
    line-height: 1.9
}

.page-contact .notice-box {
    position: relative;
    max-width: 750px;
    margin: 40px auto;
    padding: 18px 22px;
    border: 1px solid rgb(153,153,153);
    border-radius: 4px;
    background: rgb(255,255,255)
}

.page-contact .notice-box p {
    margin: 0px 0px 10px;
    font-size: 14px;
    line-height: 1.9
}

.page-contact .notice-box .notice-label {
    position: absolute;
    top: -12px;
    left: 22px;
    padding: 0px 10px;
    font-size: 15px;
    font-weight: bold;
    color: rgb(51,51,51);
    background: rgb(255,255,255)
}

.page-contact .notice-box ul {
    margin: 0px;
    padding-left: 1.2em;
    color: rgb(51,51,51);
    font-size: 14px;
    line-height: 1.9
}

.page-contact .gform-embed {
    max-width: 960px;
    margin: 20px auto 56px;
    padding: 0px 24px
}

.page-contact .gform-embed iframe {
    display: block;
    width: 100%;
    height: 1600px;
    border: 0px;
    background: transparent;
    box-shadow: none !important;
    border-radius: 0px !important
}

@media(max-width: 768px) {
    .page-contact .contact-head {
        margin:32px auto 18px;
        padding: 0px 16px
    }

    .page-contact .contact-head .contact-title {
        font-size: 20px;
        margin-bottom: 22px
    }

    .page-contact .notice-box {
        margin: 40px auto;
        padding: 14px 16px 16px;
        border-radius: 8px
    }

    .page-contact .notice-box .notice-label {
        left: 16px
    }

    .page-contact .gform-embed {
        padding: 0px 16px;
        margin: 16px auto 44px
    }

    .page-contact .gform-embed iframe {
        height: 1700px
    }
}

.page-contact .hero .hero-inner {
    text-align: center
}

.page-contact .hero .hero-title,.page-contact .hero .hero-lead {
    margin-left: auto;
    margin-right: auto
}

.page-contact .hero .btn {
    margin-left: auto;
    margin-right: auto
}

.page-contact .gform-embed {
    margin-bottom: 8px;
    padding-bottom: 0px
}

@media(min-width: 1280px) {
    .page-contact .gform-embed iframe {
        height:1200px
    }
}

@media(min-width: 769px)and(max-width:1279px) {
    .page-contact .gform-embed iframe {
        height:1250px
    }
}

@media(max-width: 768px) {
    .page-contact .gform-embed iframe {
        height:1375px
    }
}

.page-contact .hero {
    background-image: url("assets/img/hero-page.jpg");
    padding: 120px 0px 72px
}

.page-contact .hero .hero-inner {
    text-align: center
}

.page-contact .hero .hero-title,.page-contact .hero .hero-lead {
    margin-left: auto;
    margin-right: auto;
    text-align: center
}

.page-contact .hero .hero-sub {
    color: rgb(255,255,255);
    opacity: 0.95;
    font-weight: 600;
    letter-spacing: 0.12em;
    font-size: 14px;
    margin: 6px 0px 14px
}

@keyframes contactFadeUp {
    0% {
        opacity: 0;
        transform: translateY(12px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

@media(prefers-reduced-motion:reduce) {
    .page-contact .hero .hero-title,.page-contact .hero .hero-sub,.page-contact .hero .hero-lead,.page-contact .hero .btn {
        animation: auto ease 0s 1 normal none running none !important;
        opacity: 1 !important;
        transform: none !important
    }
}

@media(max-width: 768px) {
    .page-contact .hero {
        padding:96px 0px 64px
    }

    .page-contact .hero .hero-sub {
        font-size: 13px;
        margin: 4px 0px 12px
    }
}

.page-contact .gform-embed {
    margin-bottom: 8px;
    padding-bottom: 0px
}

.contact-hero {
    background-image: url("assets/img/hero-page.jpg")
}

.contact-hero .hero-title,.contact-hero .hero-lead {
    text-align: center;
    margin-left: auto;
    margin-right: auto
}

.contact-title {
    text-align: center;
    font-weight: 700;
    letter-spacing: 0.08em;
    font-size: 24px;
    color: rgb(2,8,42);
    margin: 32px 0px 12px;
    text-shadow: rgba(28,59,112,0.2)0px 2px 10px
}

.contact-intro,.contact-notes {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto
}

.contact-lead {
    max-width: 750px;
    margin: 0px auto 16px;
    font-size: 14px;
    line-height: 1.9;
    text-align: center
}

.contact-notes {
    text-align: left;
    background: rgb(255,255,255);
    border: 1px solid rgb(216,222,234);
    border-radius: 8px;
    padding: 16px 18px;
    box-shadow: none
}

.contact-notes .notes-head {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0px 0px 10px;
    font-weight: 700;
    color: rgb(27,44,85)
}

.contact-notes .notes-badge {
    display: inline-block;
    padding: 2px 8px;
    font-size: 12px;
    background: rgb(233,240,255);
    border: 1px solid rgb(203,216,255);
    border-radius: 999px
}

.contact-notes ul {
    margin: 0px;
    padding-left: 1.1em;
    font-size: 14px;
    line-height: 1.9
}

.contact-form {
    max-width: 750px;
    margin: 18px auto 24px
}

.contact-form iframe {
    display: block;
    max-width: 100%;
    width: 100% !important;
    border: 0px !important;
    box-shadow: none !important
}

@media(max-width: 768px) {
    .contact-title {
        font-size:22px
    }

    .contact-intro,.contact-lead,.contact-notes,.contact-form {
        max-width: 100%;
        padding-inline:24px}
}

.site-header {
    position: sticky;
    top: 0px;
    z-index: 1000;
    isolation: isolate;
    background-color: var(--c-header)!important;
    background-image: none !important
}

.site-header {
    backdrop-filter: none !important
}

.site-header .header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px
}

.site-header .brand-logo {
    display: block;
    height: var(--logo-h-header,36px);
    width: auto
}

.site-header .gnav a {
    color: rgb(255,255,255)!important
}

.hero {
    position: relative;
    z-index: 0
}

:root {
    --logo-h-header: 48px
}

@media(max-width: 1024px) {
    :root {
        --logo-h-header:42px
    }
}

@media(max-width: 768px) {
    :root {
        --logo-h-header:30px
    }
}

.site-header .logo img,.site-header .brand-logo {
    width: auto;
    display: block;
    height: var(--logo-h-header)!important
}

.site-header .header-inner {
    height: 64px
}

.site-header .logo img {
    height: 50px;
    width: auto;
    object-fit: contain
}

@media(max-width: 768px) {
    .site-header .logo img {
        height:50px
    }
}

.site-header .logo img {
    image-rendering: auto
}

@media(max-width: 768px) {
    .site-header .header-inner {
        height:64px
    }

    .site-header .logo {
        display: flex;
        align-items: center
    }

    .site-header .header-inner .logo>img {
        flex: 0 0 auto;
        height: 40px !important;
        width: auto !important;
        max-height: none !important
    }
}

.feature-sub {
    margin: -8px 0px 26px;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.04em;
    color: rgb(39,52,69);
    text-align: center;
    @media(max-width: 768px) {
        & .feature-sub {
            font-size:13px;
            margin: -6px 0px 14px
        }
    }
}

.page-hero--company {
    background-image: url("assets/img/hero-page.jpg");
    background-size: cover;
    background-position: center center;
    color: rgb(255,255,255);
    padding: 84px 0px 120px
}

.company-table-wrap {
    max-width: 750px;
    margin: 69px auto 150px
}

.company-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.9;
    color: var(--c-text);
    background: rgb(255,255,255);
    border: 1px solid var(--c-border);
    border-radius: 6px;
    overflow: hidden
}

.company-table th,.company-table td {
    padding: 16px 18px;
    vertical-align: top;
    background: rgb(255,255,255)
}

.company-table th {
    width: 32%;
    color: var(--c-muted);
    font-weight: 600;
    text-align: left;
    background: rgb(250,251,255)
}

.company-table tr + tr th,.company-table tr + tr td {
    border-top: 1px solid var(--c-border)
}

@media(max-width: 768px) {
    .company-table-wrap {
        margin:40px auto 64px;
        padding: 0px 16px
    }

    .company-table th,.company-table td {
        display: block;
        width: 100%
    }

    .company-table th {
        border-bottom: none;
        background: rgb(246,248,255);
        color: rgb(74,79,99)
    }

    .company-table td {
        padding-top: 10px
    }

    .company-table tr + tr td {
        border-top: none
    }

    .company-table tr + tr th {
        border-top: 1px solid var(--c-border)
    }
}

.visually-hidden {
    clip: rect(1px,1px,1px,1px);
    position: absolute !important;
    padding: 0px !important;
    border: 0px !important;
    height: 1px !important;
    width: 1px !important;
    overflow: hidden !important
}

.page-company .page-hero--company {
    background-image: url("assets/img/hero-page.jpg");
    background-size: cover;
    background-position: center center
}

.page-company .page-hero__inner {
    text-align: center;
    opacity: 0;
    transform: translateY(12px);
    animation: 0.8s cubic-bezier(0.2,0.7,0.2,1)0.15s 1 normal forwards running phFadeIn
}

.page-company .page-hero__title {
    margin: 0px 0px 6px;
    color: rgb(255,255,255);
    font-weight: 700;
    font-size: 40px;
    line-height: 1.25;
    letter-spacing: 0.18em;
    opacity: 0;
    transform: translateX(-18px);
    transform-origin: left center;
    will-change: transform,opacity;
    animation: 1s cubic-bezier(0.2,0.7,0.2,1)0.6s 1 normal forwards running topmvcatch;
    backface-visibility: hidden;
    text-shadow: rgb(0,0,0)1px 0px 10px
}

.page-company .page-hero__lead {
    margin: 0px;
    color: rgb(255,255,255);
    font-size: 14px;
    letter-spacing: 0.14em
}

@media(max-width: 768px) {
    .page-company .page-hero__inner {
        padding:84px 16px 100px
    }

    .page-company .page-hero__title {
        font-size: 32px
    }

    .page-company .page-hero__lead {
        font-size: 13px
    }
}

@keyframes phFadeIn {
    0% {
        opacity: 0;
        transform: translateY(12px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

.page-privacy .page-hero--privacy {
    background-image: url("assets/img/hero-page.jpg");
    background-size: cover;
    background-position: center center;
    color: rgb(255,255,255)
}

.page-privacy .page-hero__inner {
    text-align: center;
    padding: 96px 24px 120px;
    opacity: 0;
    transform: translateY(12px);
    animation: 0.8s cubic-bezier(0.2,0.7,0.2,1)0.15s 1 normal forwards running policyFade
}

.page-privacy .page-hero__title {
    margin: 0px 0px 8px;
    font-weight: 700;
    font-size: 40px;
    letter-spacing: 0.18em;
    text-shadow: rgba(0,0,0,0.35)0px 2px 10px
}

.page-privacy .page-hero__sub {
    margin: 0px;
    font-size: 14px;
    letter-spacing: 0.12em;
    opacity: 0.95
}

@keyframes policyFade {
    0% {
        opacity: 0;
        transform: translateY(12px)
    }

    100% {
        opacity: 1;
        transform: none
    }
}

.policy-wrap {
    max-width: 820px;
    margin: 40px auto 80px;
    padding: 0px 24px;
    font-size: 14px;
    line-height: 1.9;
    color: rgb(34,34,34)
}

.policy-meta {
    margin: 0px 0px 18px;
    color: rgb(102,102,102);
    font-size: 13px
}

.policy-section + .policy-section {
    margin-top: 28px
}

.policy-section h2 {
    margin: 0px 0px 10px;
    padding: 0px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: rgb(11,30,70);
    position: relative
}

.policy-section h3 {
    margin: 14px 0px 6px;
    font-size: 15px;
    font-weight: 600;
    color: rgb(27,44,85)
}

.policy-section p {
    margin: 0px 0px 10px
}

.policy-section ol {
    margin: 6px 0px 10px 1.4em;
    padding: 0px
}

.policy-section li {
    margin: 4px 0px
}

.policy-contact a {
    color: rgb(10,58,135);
    text-decoration: underline
}

.policy-end {
    margin-top: 8px
}

@media(max-width: 768px) {
    .page-privacy .page-hero__inner {
        padding:84px 16px 100px
    }

    .page-privacy .page-hero__title {
        font-size: 32px
    }

    .policy-wrap {
        padding: 0px 16px;
        margin-bottom: 64px
    }
}

.page-privacy .policy-wrap .policy-section:first-of-type h2 {
    text-align: center;
    font-weight: 600;
    font-size: 28px;
    letter-spacing: 0.02em;
    font-family: Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans JP",sans-serif;
    color: rgb(2,8,42);
    margin: 0px 0px 32px;
    text-shadow: rgba(28,59,112,0.2)0px 2px 10px
}

.page-privacy .policy-section h2::after {
    content: none !important;
    display: none !important
}

@media(max-width: 768px) {
    .page-privacy .policy-wrap .policy-section:first-of-type h2 {
        font-size:22px;
        margin-bottom: 22px
    }
}

@media print {
    .company-table-wrap {
        overflow: visible !important
    }

    .company-table.company-table--list {
        min-width: auto;
        font-size: 12pt
    }

    .company-table.company-table--list thead th {
        position: static;
        print-color-adjust: exact
    }
}

.hero {
    margin-bottom: 32px
}

.company-block .container {
    max-width: 1280px
}

.ra-list-wrap {
    overflow-x: auto
}

.ra-list-table {
    width: 100%;
    min-width: 1000px;
    border-collapse: collapse;
    table-layout: auto;
    font-size: 14px;
    line-height: 1.6;
    background: rgb(255,255,255)
}

.ra-list-table thead th,.ra-list-table td {
    padding: 12px 14px;
    border-bottom: 1px solid rgb(238,240,243);
    vertical-align: top
}

.ra-list-table thead th {
    background: rgb(246,247,249);
    font-weight: 600;
    white-space: nowrap
}

.ra-list-table tbody tr:nth-child(2n) {
    background: rgb(250,251,252)
}

.ra-list-table th:nth-child(1),.ra-list-table td:nth-child(1),.ra-list-table th:nth-child(2),.ra-list-table td:nth-child(2) {
    width: 140px;
    white-space: nowrap
}

.ra-list-table th:nth-child(3),.ra-list-table td:nth-child(3) {
    width: 260px;
    white-space: normal;
    word-break: keep-all
}

.ra-list-table th:nth-child(4),.ra-list-table td:nth-child(4) {
    width: 220px
}

.ra-list-table th:nth-child(5),.ra-list-table td:nth-child(5) {
    width: 180px
}

.ra-list-table th:nth-child(6),.ra-list-table td:nth-child(6) {
    width: 280px
}

.ra-list-table td:nth-child(4),.ra-list-table td:nth-child(5),.ra-list-table td:nth-child(6) {
    white-space: nowrap;
    word-break: keep-all
}

@media(max-width: 640px) {
    .ra-list-table {
        min-width:900px
    }

    .ra-list-table thead th,.ra-list-table td {
        padding: 10px 12px
    }
}

.ra-list-table th.sortable {
    cursor: pointer;
    position: relative;
    user-select: none
}

.ra-list-table th[aria-sort="ascending"]::after {
    content: "â–²";
    position: absolute;
    right: 10px
}

.ra-list-table th[aria-sort="descending"]::after {
    content: "â–¼";
    position: absolute;
    right: 10px
}

.ra-list-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 12px 0px 8px
}

.ra-sort-controls {
    display: flex;
    align-items: center;
    gap: 8px
}

.ra-sort-controls label {
    font-size: 14px;
    color: rgb(55,65,81)
}

.ra-sort-controls select,.ra-sort-controls button {
    font-size: 14px;
    line-height: 1;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgb(229,231,235);
    background: rgb(255,255,255)
}

.ra-sort-controls button {
    cursor: pointer
}

#ra-sort-order[data-order="asc"]::after {
    content: " â–²"
}

#ra-sort-order[data-order="desc"]::after {
    content: " â–¼"
}

#ra-sort-reset {
    background: rgb(249,250,251)
}

.ra-sort-status {
    font-size: 12px;
    color: rgb(107,114,128)
}

.ra-list-table th.sortable {
    cursor: pointer;
    position: sticky;
    top: 0px;
    z-index: 1;
    background: rgb(246,247,249);
    transition: background 0.15s;
    user-select: none
}

.ra-list-table th.sortable:hover {
    background: rgb(238,242,255)
}

.ra-list-table th.sortable::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: rgb(107,114,128)transparent transparent;
    border-image: initial;
    opacity: 0.35
}

.ra-list-table th[aria-sort="ascending"]::after {
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent rgb(17,24,39);
    border-image: initial;
    opacity: 1
}

.ra-list-table th[aria-sort="descending"]::after {
    border-width: 6px;
    border-style: solid;
    border-color: rgb(17,24,39)transparent transparent;
    border-image: initial;
    opacity: 1
}

.ra-csv-btn {
    display: inline-block;
    margin: 12px 0px 8px;
    padding: 8px 12px;
    font-size: 14px;
    border: 1px solid rgb(229,231,235);
    border-radius: 8px;
    background: rgb(255,255,255);
    cursor: pointer
}

.ra-csv-btn:hover {
    background: rgb(249,250,251)
}

.ra-list-header {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 8px 0px 6px
}

.ra-csv-btn {
    background: rgb(255,255,255);
    color: rgb(22,36,70);
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    padding: 10px 14px;
    border: 1px solid rgb(22,36,70);
    border-radius: 4px;
    cursor: pointer;
    box-shadow: rgba(0,0,0,0.05)0px 1px 2px;
    transition: filter 0.15s,transform 0.02s
}

.ra-csv-btn:hover {
    filter: brightness(1.08)
}

.ra-csv-btn:active {
    transform: translateY(1px)
}

.ra-csv-btn:focus-visible {
    outline: rgb(59,130,246)solid 2px;
    outline-offset: 2px
}

footer {
    width: 100%
}

.policy-wrap {
    min-height: 30vw
}

.ra-detail {
    margin: 24px 0px 64px;
    font-size: 14px;
    line-height: 1.8
}

.ra-detail__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px
}

.ra-detail__title {
    font-size: 22px;
    line-height: 1.3;
    font-weight: 700;
    margin: 0px
}

.ra-detail__back {
    font-weight: 600;
    text-decoration: none;
    color: rgb(22,36,70)
}

.ra-detail__back:hover {
    text-decoration: underline
}

.ra-detail__list {
    margin: 0px;
    padding: 0px;
    background: rgb(255,255,255);
    border: 1px solid rgb(249,249,249)
}

.ra-detail__row {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 0px;
    border-bottom: 1px solid rgb(238,240,243)
}

.ra-detail__row:last-child {
    border-bottom: none
}

.ra-detail__list dt,.ra-detail__list dd {
    margin: 0px;
    padding: 12px 14px
}

.ra-detail__list dt {
    background: rgb(246,247,249);
    font-weight: 600;
    color: rgb(17,17,17);
    white-space: nowrap
}

.ra-detail__list dd {
    color: rgb(34,34,34);
    word-break: break-word
}

.ra-detail__list dt {
    border-bottom: 0.5px solid rgb(255,255,255)
}

.ra-detail__list dd {
    border-bottom: 0.5px solid rgb(249,249,249)
}

@media(max-width: 640px) {
    .ra-detail__row {
        grid-template-columns:1fr
    }

    .ra-detail__list dt {
        border-bottom: 1px solid rgb(238,240,243)
    }
}

.ra-list-wrap {
    position: relative
}

.ra-list-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0px
}

.ra-list-table thead th {
    position: sticky;
    top: 0px;
    background: rgb(243,244,246);
    z-index: 1
}

.ra-pagination {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 12px;
    flex-wrap: wrap
}

.ra-pagination button {
    padding: 6px 10px;
    border: 1px solid rgb(229,231,235);
    background: rgb(255,255,255);
    border-radius: 6px;
    cursor: pointer
}

.ra-pagination button[disabled] {
    opacity: 0.5;
    cursor: default
}

.ra-pagination .is-current {
    background: rgb(17,24,39);
    color: rgb(255,255,255);
    border-color: rgb(17,24,39)
}

@media(max-width: 768px) {
    .ra-list-wrap {
        max-height:60vh;
        overflow: auto;
        border: 1px solid rgb(229,231,235);
        border-radius: 8px;
        background: rgb(255,255,255)
    }

    .ra-list-table thead th,.ra-list-table tbody td {
        white-space: nowrap
    }
}

.ra-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    align-items: center;
    justify-content: center;
    margin: 16px auto 0px;
    max-width: 100%;
    text-align: center
}

.ra-pagination button {
    padding: 6px 10px;
    border: 1px solid rgb(229,231,235);
    background: rgb(255,255,255);
    border-radius: 6px;
    cursor: pointer
}

.ra-pagination button[disabled] {
    opacity: 0.5;
    cursor: default
}

.ra-pagination .is-current {
    background: rgb(17,24,39);
    color: rgb(255,255,255);
    border-color: rgb(17,24,39)
}

.ra-page-info {
    width: 100%;
    order: -1;
    font-size: 12px;
    color: rgb(107,114,128);
    text-align: center;
    margin-bottom: 4px
}

.ra-list-table td:nth-child(1),.ra-list-table td:nth-child(4),.ra-list-table td:nth-child(5),.ra-list-table td:nth-child(6) {
    text-align: center
}

.ra-list-table th:nth-child(1),.ra-list-table td:nth-child(1),.ra-list-table th:nth-child(2),.ra-list-table td:nth-child(2),.ra-list-table th:nth-child(3),.ra-list-table td:nth-child(3),.ra-list-table th:nth-child(4),.ra-list-table td:nth-child(4) {
    width: auto;
    text-align: left
}

.ra-list-table thead th,.ra-list-table td {
    padding: 10px 12px;
    border-bottom: 1px solid rgb(238,240,243);
    vertical-align: top
}

.record-ex,.record-date,.ra-list-table--fluid {
    table-layout: fixed;
    font-size: clamp(11px,1.2vw,14px);
    line-height: 1.55;
    min-width: 0px !important
}

.record-date {
    text-align: right;
    margin-bottom: 8px
}

.record-ex {
    text-align: center;
    margin-top: 20px
}

.ra-list-table--fluid thead th,.ra-list-table--fluid tbody td {
    word-break: break-word;
    overflow-wrap: anywhere;
    padding: clamp(8px,1.2vw,12px)clamp(8px,1.6vw,14px);
    white-space: normal !important
}

.ra-list-table--fluid th:nth-child(1),.ra-list-table--fluid td:nth-child(1) {
    width: 4.2em;
    text-align: center;
    white-space: nowrap !important
}

.ra-list-table--fluid th:nth-child(2),.ra-list-table--fluid td:nth-child(2) {
    width: 34%
}

.ra-list-table--fluid th:nth-child(3),.ra-list-table--fluid td:nth-child(3) {
    width: 46%
}

.ra-list-table--fluid th:nth-child(4),.ra-list-table--fluid td:nth-child(4) {
    width: 20%;
    text-align: center;
    white-space: nowrap !important
}

@media(max-width: 1024px) {
    .ra-list-table--fluid {
        font-size:clamp(10.5px,1.3vw,13px)
    }
}

@media(max-width: 900px) {
    .ra-list-table--fluid {
        font-size:clamp(10px,1.6vw,12px)
    }
}

@media(max-width: 768px) {
    .ra-list-table--fluid {
        font-size:clamp(9.8px,2vw,11.5px)
    }

    .news {
        padding: 0px
    }
}

.page-newsletter .contact-title {
    text-align: center;
    font-weight: 600;
    margin: 2rem 0px 1rem;
    font-size: 1.4rem
}

.page-newsletter .contact-lead {
    text-align: center;
    line-height: 1.8;
    margin-bottom: 2.5rem
}

.newsletter-form {
    max-width: 600px;
    border: 1px solid rgb(255,255,255);
    font-size: 14px;
    box-shadow: rgb(225,225,225)0px 3px 10px;
    border-radius: 8px;
    padding: 24px;
    margin: 42px auto
}

.newsletter-form .form-group {
    margin-bottom: 1.5rem;
}

.newsletter-form label {
    display: block;
    font-weight: 400;
    margin-bottom: 0.45rem
}

.newsletter-form input[type="text"],.newsletter-form input[type="email"] {
    width: 100%;
    box-sizing: border-box;
    padding: 0.75rem 1rem;
    border: 1px solid rgb(204,204,204);
    border-radius: 4px;
    font-size: 14px
}

.newsletter-form .checkbox label {
    font-weight: 400;
    margin-top: 2rem
}

.badge {
    display: inline-block;
    margin-left: 0.5rem;
    margin-top: -0.05rem;
    padding: 0.25rem 0.55rem 0.15rem;
    border-radius: 3px;
    line-height: 1;
    vertical-align: text-top
}

.badge--required {
    background: rgb(229,57,53);
    color: rgb(255,255,255)
}

.badge--optional {
    background: rgb(243,156,18);
    color: rgb(255,255,255)
}

.nl-actions {
    text-align: center;
    margin-top: 3rem;
    margin-bottom: 3rem
}

.privacy-note {
    background: rgb(245,245,245);
    padding: 0.5rem 2rem;
    font-size: 0.9rem;
    line-height: 1.6;
    color: rgb(51,51,51);
    border-radius: 4px;
    max-width: 900px;
    margin: 0px auto 3rem
}

@media(max-width: 630px) {
    .page-newsletter .contact-title {
        font-size:1.2rem
    }

    .newsletter-form {
        padding: 20px 18px 0px;
        margin: 40px 24px
    }
}

html,body {
    height: 100%
}

body.page-contact {
    min-height: 100vh;
    display: flex;
    flex-direction: column
}

body.page-contact>#site-footer {
    margin-top: auto
}

body.page-contact .contact-head {
    padding-bottom: 40px
}

@media(max-width: 600px) {
    body.page-contact .contact-head {
        padding-bottom:24px
    }
}

html,body {
    height: 100%;
    margin: 0px
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh
}

main,.contact-head,.company-block {
    flex: 1 1 0%
}

#site-footer {
    margin-top: auto
}

html,body {
    height: 100%;
    margin: 0px;
    padding: 0px
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh
}

main,.contact-head,.company-block {
    flex: 1 1 0%
}

#site-footer {
    margin-top: auto
}

.contact-head,.company-block {
    margin-bottom: 0px !important;
    padding-bottom: 5rem
}

.container:last-child {
    margin-bottom: 0px
}

@media(max-width: 768px) {
    .contact-head,.company-block {
        padding-bottom:1.5rem
    }
}

.page-privacy body {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100dvh !important
}

.page-privacy #main {
    flex: 1 0 auto !important
}

.page-privacy #site-footer,.page-privacy .site-footer {
    position: static !important;
    bottom: auto !important;
    top: auto !important;
    margin-top: auto !important
}

.page-privacy .hero {
    margin-bottom: 32px !important
}

::placeholder {
    color: rgba(0,0,0,0.4)
}

input::-webkit-input-placeholder {
    color: rgba(0,0,0,0.4)
}

.article-head {
    max-width: 762px;
    margin: 40px auto 24px;
    padding: 0px 16px;
    text-align: left
}

.article-title {
    font-family: Inter;
    text-align: center;
    font-weight: 700;
    letter-spacing: 0.08em;
    font-size: 24px;
    color: rgb(2,8,42);
    margin: 40px 0px 24px;
    text-shadow: rgba(28,59,112,0.2)0px 2px 10px
}

.article-lead {
    margin: 0px;
    color: rgb(51,51,51);
    font-size: 14px;
    line-height: 1.9;
    text-align: left
}

@media(max-width: 768px) {
    .article-head {
        margin:32px auto 18px
    }

    .article-title {
        font-size: 20px;
        margin-bottom: 12px
    }
}

.voices {
    max-width: 750px;
    margin: 28px auto 12px
}

.voices-head {
    margin-bottom: 12px
}

.voices-title {
    display: inline-block;
    padding: 10px 16px;
    color: rgb(2,8,42);
    background: rgb(255,255,255);
    font-size: 1.2rem;
    letter-spacing: 0.06em;
    border-radius: 4px;
    line-height: 1.2;
    margin: 30px 0px 24px 0px
}

.voices-list {
    list-style: none;
    margin: 12px 0px 0px;
    padding-left: 0px;
    color: rgb(34,34,34);
    font-size: 14px;
    line-height: 1.9
}

.voices-list li {
    position: relative;
    padding-left: 1.2em;
    margin: 0px 0px 30px
}

.voices-list li::before {
    content: "・";
    position: absolute;
    left: 0px;
    top: 0px;
    line-height: 1.9;
    font-weight: 700;
    color: rgb(22,36,70)
}

body[data-page="article-qms-20251008"].container {
    max-width: 740px
}

body[data-page="article-qms-20251008"].article-head {
    max-width: 800px
}

body[data-page="article-qms-20251008"]:where(p,li,dd,dt) {
    font-size: 14px;
    line-height: 1.9
}

body[data-page="article-qms-20251008"].voices-list {
    font-size: 16px;
    line-height: 1.9
}

.article-notice-box {
    position: relative;
    max-width: 850px;
    margin: 40px auto;
    padding: 18px 22px;
    border: 1px solid rgb(221,221,221);
    border-radius: 4px;
    background: rgb(255,255,255)
}

.article-notice-box {
    margin: 50px 0px;
    border-radius: 8px
}

.article-notice-label {
    position: absolute;
    top: -12px;
    left: 22px;
    padding: 0px 10px;
    font-size: 15px;
    font-weight: bold;
    color: rgb(51,51,51);
    background: rgb(255,255,255)
}

.article-notice-label {
    left: 16px
}

body[data-page="article-qms-20251008"].article-text.container {
    max-width: 740px;
    padding-inline:0px;margin-left: auto;
    margin-right: auto
}

@media(max-width: 768px) {
    body[data-page="article-qms-20251008"].article-text.container {
        max-width:100%;
        padding-inline:0px}
}

@media(max-width: 768px) {
    body[data-page="article-qms-20251008"].article-notice-box {
        max-width:100%;
        margin: 30px 16px 44px
    }
}

body[data-page="article-qms-20251008"].voices-list {
    list-style: none;
    margin: 14px 0px 0px;
    border-radius: 8px;
    background: rgb(255,255,255);
    box-shadow: none;
    display: block !important;
    grid-template-columns: none !important;
    gap: 0px !important
}

@media(max-width: 768px) {
    body[data-page="article-qms-20251008"].voices-list {
        padding:0px 0px 0px
    }
}

body[data-page="article-qms-20251008"].voices-list li {
    position: relative;
    margin: 0px 16px 30px;
    padding: 1em 1.5em;
    background: rgb(242,242,242);
    border-radius: 8px
}

body[data-page="article-qms-20251008"].voices-list li:last-child {
    margin-bottom: 0px
}

body[data-page="article-qms-20251008"].voices-list li::before {
    position: absolute;
    left: 0px;
    top: 0px;
    line-height: 1.9;
    font-weight: 700;
    color: rgb(22,36,70);
    padding: 1em 0.5em;
    content: "" !important
}

.voices-head {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    margin: 28px 0px 10px;
    padding: 0px 32px
}

.voices-head .voices-title {
    display: inline-block;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    padding: 0
}

.voices-head .voices-rule {
    flex: 1 1 auto;
    height: 1px;
    background: currentcolor;
    opacity: 0.25
}

@media(max-width: 600px) {
    .article-title {
        font-size:18px;
        margin-bottom: 24px
    }
}

@media(max-width: 480px) {
    .voices-head {
        gap:8px
    }

    .voices-head .voices-title {
        font-size: 1.15rem
    }

    .voices-head .voices-rule {
        opacity: 0.3
    }

    .article-title {
        font-size: 16px;
        margin-bottom: 12px
    }
}

.qa-8 dt {
    margin-bottom: 1em;
    color: rgb(51,51,51)
}

.qa-8 dt::before,.qa-8 dd::before {
    margin-right: 0.4em
}

.qa-8 dt::before {
    content: "Q."
}

.qa-8 dd {
    margin: 1em 0px;
    padding: 1em 1.5em;
    background-color: rgb(242,242,242);
    color: rgb(51,51,51);
    border-radius: 8px
}

.qa-8 dd::before {
    content: "A."
}

.voices-list--panel li {
    position: relative;
    margin: 0px 0px 30px;
    padding: 1em 1.5em;
    background: rgb(243 243 243);
    border-radius: 8px
}

p.newsletter-privacy {
    font-size: 10px;
    background: rgb(241,241,241);
    padding: 10px 12px;
    margin-top: 40px;
    text-align: left;
    border-radius: 4px
}

.article-beforefooter {
    margin: 60px 24px
}

.article-lead2 {
    margin: 0px 16px 0px 16px
}

.article-end {
    font-size: 14px;
    max-width: 600px;
    margin: 42px auto
}

.qa-7 dt {
    margin-bottom: 1em;
    color: rgb(51,51,51)
}

.qa-7 dt::before,.qa-8 dd::before {
    margin-right: 0.4em
}

.qa-7 dt::before {
    content: ""
}

.qa-7 dd {
    margin: 1em 0px;
    padding: 1em 1.5em;
    background-color: rgb(242,242,242);
    color: rgb(51,51,51);
    border-radius: 8px;
    font-size: 14px
}

.qa-7 dd::before {
    content: ""
}

a {
    color: #0a3a87
}

.line-blue {
    background: linear-gradient(transparent 70%,#a7d6ff 70%)
}

.voices-head {
    text-align: center
}

.article-lead2 {
    font-size: 14px;
    text-align: center
}

.newsletter-form textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.6;
    box-sizing: border-box;
    background: #fff;
    resize: vertical;
    min-height: 140px
}

.voices-head-long .voices-title {
    display: inline-block;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    padding: 0px 4px;
    font-size: 20px
}

.voices-head-long .voices-rule {
    flex: 1 1 auto;
    height: 1px;
    background: currentcolor;
    opacity: 0.25
}

.newsletter-form .form-group .form-note {
    margin-top: 0px;
    color: #222222;
    font-size: 14px
}
.newsletter-form .radios {margin: 1.5rem 0;padding-left: 0;}
.newsletter-form .radios legend {
  display:block;
  font-weight: 400;
  margin-bottom:.45rem;
  font-size:14px;
}
.newsletter-form .radios .badge { margin-left:.5rem; }
.newsletter-form .radio input[type="radio"] { margin-right:.5rem; transform: translateY(1px); }

.newsletter-form .form-group + .form-group {
    margin-top: 16px;
    border: none;
}
.form-group radios{
    bodrer: none
}
label.form-group radios {
    background-color:#000
}
.seminar-table-wrap {
    max-width: 750px;
    margin: 20px auto 0px
}

.seminar-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.9;
    color: var(--c-text);
    background: #fff;
    overflow: hidden
}

.seminar-table th,.seminar-table td {
    padding: 12px 16px;
    vertical-align: top;
    background: #fff
}

.seminar-table th {
    width: 20%;
    color: #ffffff;
    font-weight: 600;
    text-align: left;
    background: #273445
}

.seminar-table tr {
    border: 1px solid #e9e9e9
}

@media(max-width: 768px) {
    .seminar-table-wrap {
        margin:20px auto 0px;
        padding: 0
    }

    .seminar-table th,.seminar-table td {
        display: block;
        width: 100%
    }

    .seminar-table th {
        border-bottom: none;
        background: #273445;
        color: #ffffff;
        border-top: 0.5px solid #f1f1f1
    }

    @media(max-width: 768px) {
        .seminar-table tr {
            border:none
        }
    }

    @media print {
        .seminar-table-wrap {
            overflow: visible !important
        }

        .seminar-table.seminar-table--list {
            min-width: auto;
            font-size: 12pt
        }

        .seminar-table.seminar-table--list thead th {
            position: static;
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact
        }
    }

    @media(max-width: 630px) {
        .article-end {
            margin:42px 24px
        }
    }
}

.container.voices,.balloon-section {
    overflow: visible !important
}

.balloon-left,.balloon-right {
    position: relative;
    width: 100%;
    max-width: 700px;
    padding: 20px 18px;
    border-radius: 20px;
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 32px;
    box-sizing: border-box;
    left: auto !important;
    right: auto !important
}

.balloon-left {
    background: #528db1;
    font-size: 18px;
    letter-spacing: 1px;
    color: #fff;
    margin: 0 auto 32px 0 !important;
}

.balloon-right {
    background: #d76f6f;
    margin: 0 0 32px auto !important;
    font-size: 18px;
    /* font-weight: 500; */
    color: #fff;
    letter-spacing: 1px;
}

@media(min-width: 769px) {
    .balloon-left::before,.balloon-left::after,.balloon-right::before,.balloon-right::after {
        content:"";
        position: absolute;
        display: block;
        border-radius: 50%
    }

    .balloon-left::before {
        width: 20px;
        height: 20px;
        bottom: 8px;
        left: -30px;
        background: #528db1c2;
    }

    .balloon-left::after {
        width: 12px;
        height: 12px;
        bottom: 5px;
        left: -51px;
        background: #528db196;
    }

    .balloon-right::before {
        width: 20px;
        height: 20px;
        bottom: 8px;
        right: -30px;
        background: #d76f6fba;
        left: auto
    }

    .balloon-right::after {
        width: 12px;
        height: 12px;
        bottom: 5px;
        right: -51px;
        background: #d76f6f8a;
        left: auto
    }
}

@media(max-width: 875px) {
    .voices {
        padding-left:16px !important;
        padding-right: 16px !important
    }

    .balloon-left,.balloon-right {
        max-width: 100% !important;
        margin: 0 0 28px 0 !important;
        border-radius: 8px;
        background: #f1f1f1;
        color: #000;
        font-size: 16px;
    }

    .balloon-left::before,.balloon-left::after,.balloon-right::before,.balloon-right::after {
        display: none !important
    }

    .balloon-left:where(input,textarea,select,button),.balloon-right:where(input,textarea,select,button) {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
        display: block
    }
}

@media(max-width: 600px) {

    .balloon-left,.balloon-right {
        max-width: 100% !important;
        margin: 0 0 28px 0 !important;
        border-radius: 8px;
        background: #f1f1f1;
        color: #000;
        font-size: 15px;
    }
}

@media(max-width: 500px) {

    .balloon-left,.balloon-right {
        max-width: 100% !important;
        margin: 0 0 28px 0 !important;
        border-radius: 8px;
        background: #f1f1f1;
        color: #000;
        font-size: 14px;
    }
}

.balloon-section {
    text-align: center
}

.speakers-list {
    list-style: none;
    margin: 24px auto 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 760px
}

.speakers-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 0px;
    background: #fff;
    border-radius: 4px
}

.speakers-figure {
    margin: 0;
    align-self: center;
    width: 100%;
    max-width: 320px
}

.speakers-figure img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: 4px
}

.speakers-body {
    min-width: 0
}

.speakers-name {
    margin: 2px 0 8px;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.5;
    color: rgb(2,8,42)
}

.speakers-bio {
    margin: 0;
    font-size: 12px;
    line-height: 1.9;
    color: #333;
    background: #f1f1f1;
    padding: 16px;
    word-break: break-word
}

.voices + .voices .speakers-list {
    margin-top: 12px
}

@media(min-width: 769px) {
    .speakers-card {
        display:grid;
        grid-template-columns: 220px 1fr;
        gap: 16px;
        padding: 18px;
        box-shadow: rgb(225,225,225)0px 2px 10px
    }

    .speakers-figure {
        align-self: start;
        max-width: none
    }
}

.voices-head-long .voices-title {
    display: inline-block;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    padding: 0px 4px;
    font-size: 20px
}

.voices-head-long {
    text-align: center;
    margin: 8px 0px 16px 0px
}

@media(max-width: 700px) {
    .voices-head-long .voices-title {
        display:inline-block;
        font-weight: 600;
        text-align: center;
        white-space: wrap;
        padding: 0px 4px;
        font-size: 20px
    }

    .voices-head-long {
        text-align: center;
        margin: 8px 0px 16px 0px
    }
}

.speakers-figure img[src*="profile_eijitakeda.jpg"] {
    aspect-ratio: 3 / 3;
    object-fit: cover;
    object-position: center 45%
}

.center-screen {
    display: flex;
    align-items: center;
    justify-content: center
}

.btn-cta {
    display: inline-block;
    border: none;
    margin: 20px 0px;
    padding: 12px 96px;
    color: #ffffff;
    background: #ff7828;
    font-weight: bolder;
    letter-spacing: 2px;
    border-radius: 4px;
    cursor: pointer;
    text-decoration: none;
    font-size: 15px;
    box-shadow: rgb(225,225,225)0px 3px 10px
}

.voices-head-long .seminar-head {
    display: inline-block;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    padding: 0px 4px;
    font-size: 20px;
    color: #02082A
}

.speaker1-notice-box {
    position: relative;
    max-width: 850px;
    margin: 40px auto;
    padding: 18px 22px;
    border: 1px solid rgb(221,221,221);
    border-radius: 4px;
    background: rgb(255,255,255)
}

.speaker1-notice-box {
    margin: 15px 0px 0px;
    border-radius: 8px;
    margin-bottom: 30px
}

.speaker1-notice-label {
    position: absolute;
    top: -12px;
    left: 22px;
    padding: 0px 10px;
    font-size: 14px;
    font-weight: bold;
    color: rgb(51,51,51);
    background: rgb(255,255,255)
}

.speaker1-notice-label {
    left: 16px
}

.speaker2-notice-box {
    position: relative;
    max-width: 850px;
    margin: 40px auto;
    padding: 18px 22px;
    border: 1px solid rgb(221,221,221);
    border-radius: 4px;
    background: rgb(255,255,255)
}

.speaker2-notice-box {
    margin: 40px 0px 30px;
    border-radius: 8px
}

.speaker2-notice-label {
    position: absolute;
    top: -12px;
    left: 22px;
    padding: 0px 10px;
    font-size: 14px;
    font-weight: bold;
    color: rgb(51,51,51);
    background: rgb(255,255,255)
}

.speaker2-notice-label {
    left: 16px
}

.talk-theme-notice-box {
    position: relative;
    max-width: 850px;
    margin: 40px auto;
    padding: 18px 22px;
    border: 1px solid rgb(221,221,221);
    border-radius: 4px;
    background: rgb(255,255,255)
}

.talk-theme-notice-box {
    margin: 40px 0px 0px;
    border-radius: 8px
}

.talk-theme-notice-box {
    position: absolute;
    top: -12px;
    left: 22px;
    padding: 0px 10px;
    font-size: 14px;
    font-weight: bold;
    color: rgb(51,51,51);
    background: rgb(255,255,255)
}

.talk-theme-notice-box {
    left: 16px
}

@media(max-width: 700px) {
    .voices-head-long .seminar-head {
        display:inline-block;
        font-weight: 600;
        text-align: center;
        white-space: wrap;
        padding: 0px 4px;
        font-size: 19px
    }

    .article-notice-box {
        position: relative;
        max-width: 850px;
        margin: 40px auto;
        padding: 18px 22px;
        border: 1px solid rgb(221,221,221);
        border-radius: 4px;
        background: rgb(255,255,255)
    }

    .article-notice-box {
        margin: 50px 0px;
        border-radius: 8px
    }

    .article-notice-label {
        position: absolute;
        top: -12px;
        left: 22px;
        padding: 0px 10px;
        font-size: 14px;
        font-weight: bold;
        color: rgb(51,51,51);
        background: rgb(255,255,255)
    }

    .article-notice-label {
        left: 16px
    }

    .speaker1-notice-box {
        position: relative;
        max-width: 850px;
        margin: 40px auto;
        padding: 18px 22px;
        border: 1px solid rgb(221,221,221);
        border-radius: 4px;
        background: rgb(255,255,255)
    }

    .speaker1-notice-box {
        margin: 15px 0px 0px;
        border-radius: 8px;
        margin-bottom: 30px
    }

    .speaker1-notice-label {
        position: absolute;
        top: -12px;
        left: 22px;
        padding: 0px 10px;
        font-size: 14px;
        font-weight: bold;
        color: rgb(51,51,51);
        background: rgb(255,255,255)
    }

    .speaker1-notice-label {
        left: 16px
    }

    .speaker2-notice-box {
        position: relative;
        max-width: 850px;
        margin: 40px auto;
        padding: 18px 22px;
        border: 1px solid rgb(221,221,221);
        border-radius: 4px;
        background: rgb(255,255,255)
    }

    .speaker2-notice-box {
        margin: 40px 0px 0px;
        border-radius: 8px
    }

    .speaker2-notice-label {
        position: absolute;
        top: -12px;
        left: 22px;
        padding: 0px 10px;
        font-size: 14px;
        font-weight: bold;
        color: rgb(51,51,51);
        background: rgb(255,255,255)
    }

    .speaker2-notice-label {
        left: 16px
    }

    .talk-theme-notice-box {
        position: relative;
        max-width: 850px;
        margin: 40px auto;
        padding: 18px 22px;
        border: 1px solid rgb(221,221,221);
        border-radius: 4px;
        background: rgb(255,255,255)
    }

    .talk-theme-notice-box {
        margin: 40px 0px 0px;
        border-radius: 8px
    }

    .talk-theme-notice-box {
        position: absolute;
        top: -12px;
        left: 22px;
        padding: 0px 10px;
        font-size: 14px;
        font-weight: bold;
        color: rgb(51,51,51);
        background: rgb(255,255,255)
    }

    .talk-theme-notice-box {
        left: 16px
    }

    .speakers-name {
        margin: 2px 0 8px;
        font-weight: 700;
        font-size: 14px;
        text-align: center;
        line-height: 1.5;
        color: rgb(2,8,42)
    }

    .speakers-bio {
        margin: 0;
        font-size: 12px;
        line-height: 1.9;
        color: #333;
        background: #f1f1f1;
        padding: 16px;
        word-break: break-word
    }

    .speakers-figure img[src*="profile_eijitakeda.jpg"] {
        aspect-ratio: 3 / 3;
        object-fit: cover;
        max-width: 60%;
        margin: 0 auto;
        object-position: center 45%
    }

    .speakers-figure {
        margin: 0;
        align-self: center;
        width: 100%;
        max-width: 320px
    }

    .speakers-figure img {
        display: block;
        max-width: 60%;
        height: auto;
        margin: 0 auto;
        aspect-ratio: 4 / 5;
        object-fit: cover;
        border-radius: 4px
    }
}
.newsletter-form .is-error input,
.newsletter-form .is-error textarea,
.newsletter-form .is-error .radio input {
  border-color: #d93025 !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(217,48,37,.12);
}
.newsletter-form .error-msg {
  margin: 6px 0 0;
  color: #d93025;
  font-size: 12px;
  line-height: 1.5;
}
.newsletter-form fieldset.radios.is-error {
  border: 1px solid #d93025;
  padding: 10px 12px 8px;
  border-radius: 6px;
}
.newsletter-form fieldset.radios legend {
  font-weight: 400;
}
.newsletter-form .radio {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-right: 1rem;
}
.newsletter-form .form-note-count {
  margin-top: 6px;
  font-size: 12px;
  color: #666;
}

input.is-error,
textarea.is-error,
select.is-error {
  border:solid 2px #d93025 !important;
}
.googlemap {
    width: auto;
    height: 200px;
    overflow: hidden;
}
.googlemap iframe {
    width: 100%;
    height: calc(100% + 300px);
    margin-top: -150px;
}
@media(min-width: 769px) {
.googlemap {
    width: 500px;
    height: 200px;
    overflow: hidden;
}
.googlemap iframe {
    width: 100%;
    height: calc(100% + 300px);
    margin-top: -150px;
}
}