@charset "utf-8";

/* トップ_経営理念 */
#value h1 {
    line-height: var(--line-m);
    max-width: 1072px;
    margin: 0 auto;
    padding: 16px 24px 64px 24px;
    color: var(--color-N0);
    background: url(../images/index/logo_bg.jpg);
    background-size: cover;
    text-align: center;
    text-shadow: 1px 1px 0 rgba(0,0,0,.4);
    font-size: var(--font-size-base);
    font-family: var(--font-serif);
}
#value h1 img {
    max-width: 480px;
    margin: 0 auto;
}
#value .container {
    background: url(../images/index/top_bg.jpg);
    background-position: center;
    background-size: cover;
}
#value p {
    font-family: var(--font-serif);
}
#value p strong,
#value p b {
    display: block;
    font-size: var(--font-size-title-m);
}
#value p + p {
    margin-top: 40px;
}
#value .btn_cta {
    margin: 40px auto;
    font-size: var(--font-size-base);
}
@media (min-width: 376px) {
#value p strong,
#value p b {
    font-size: var(--font-size-title-l);
}
}
#value .service {
    line-height: var(--line-m);
    font-size: var(--font-size-caption);
}
#value .service ul {
    margin-top: 16px;
}
#value .service ul li {
    margin-top: 8px;
}

/* プロの技術で応える、R-BODYの架装力 */
#intro {
    color: var(--color-N0);
    background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.9)), url(../images/index/intro_bg.jpg);
    background-size: cover;
    background-position: center center;
}
#intro .swiper {
    max-width: 480px;
    margin: 16px auto 0;
}
#intro .swiper img {
    border-radius: 32px;
}
#intro .swiper h3 {
    margin-top: 24px;
}
#intro .swiper p {
    margin-top: 16px;
    padding-bottom: 48px;
    font-size: var(--font-size-paragraph);
}
#intro .swiper .swiper-pagination-bullet {
    background: var(--color-N0);
}
#intro .swiper .swiper-pagination-bullet-active {
    background: var(--color-secondary);
}

/*代表者からのメッセージ*/
#message {
	padding: 48px 32px;
}
@media (min-width: 481px) {
#message {
	padding: 64px 56px;
}
}
#message .sign {
    display: flex;
    width: 100%;
    margin-top: 16px;
    flex-direction: row-reverse;
}
#message .sign img {
    width: 280px;
}

/* よくある質問 */
#faq .faq-item {
    display: flex;
    flex-direction: column;
    gap: 24px 0;
    margin-top: 24px;
    font-size: var(--font-size-paragraph);
}
#faq .faq-item h3 {
    color: var(--color-secondary);
}
#faq .faq-item h3 + * {
    margin-top: 8px;
}