/* 企業サイト専用スタイル - WordPress統一スタイル */
/* フロントエンドとブロックエディター共通のスタイル */

/* ベーススタイル */
.company-front-page,
.wp-block-post-content,
.block-editor-block-list__layout,
.editor-styles-wrapper {
    font-family: 'Inter', 'Noto Sans JP', sans-serif;
}

/* ボタンスタイル */
.wp-block-button.btn-unified .wp-block-button__link,
.wp-block-button.is-style-enterprise-primary .wp-block-button__link, .c-fixBtn{
    background: linear-gradient(135deg, #007AFF 0%, #2196f3 100%) !important;
    color: white !important;
    padding: 0.75rem 1.5rem !important;
    border-radius: 2px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

.wp-block-button.btn-unified .wp-block-button__link:hover,
.wp-block-button.is-style-enterprise-primary .wp-block-button__link:hover,.c-fixBtn:hover {
    /* background: linear-gradient(135deg, #005BB5 0%, #1976d2 100%) !important; */
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important;
    background: #971320 !important;
}

/* セクションスタイル */
.wp-block-group.about-section,
.wp-block-group.is-style-enterprise-about {
    padding: 5rem 1.5rem !important;
    background-color: #f9fafb !important;
}

.wp-block-group.services-section,
.wp-block-group.is-style-enterprise-services {
    background: linear-gradient(180deg, #007AFF 0%, #2196f3 100%) !important;
    color: white !important;
    padding: 5rem 1.5rem !important;
    position: relative;
    z-index: 10;
}


.wp-block-group.contact-section,
.wp-block-group.is-style-enterprise-contact {
    background-image: url('https://asami-electric.jp/wp/wp-content/uploads/2025/07/hobi-industri-NLBJ2I0lNr4-unsplash-scaled.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    color: white !important;
    padding: calc(8rem + 200px) 1.5rem 8rem 1.5rem !important;
    position: relative;
    margin-top: -200px !important;
}

.wp-block-group.contact-section::before,
.wp-block-group.is-style-enterprise-contact::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.wp-block-group.contact-section>*,
.wp-block-group.is-style-enterprise-contact>* {
    position: relative;
    z-index: 2;
}

/* 見出しスタイル */
.section-title,
.wp-block-heading.is-style-enterprise-title {
    font-size: 2.25rem !important;
    font-weight: bold !important;
    text-align: center !important;
    margin-bottom: 3rem !important;
    color: #374151 !important;
}

.services-section .section-title,
.is-style-enterprise-services .section-title,
.services-section .wp-block-heading.is-style-enterprise-title,
.is-style-enterprise-services .wp-block-heading.is-style-enterprise-title {
    color: white !important;
}

.contact-section .section-title,
.is-style-enterprise-contact .section-title,
.contact-section .wp-block-heading.is-style-enterprise-title,
.is-style-enterprise-contact .wp-block-heading.is-style-enterprise-title {
    color: white !important;
}

.section-subtitle,
.wp-block-paragraph.is-style-enterprise-subtitle {
    font-size: 1rem !important;
    color: #007AFF !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    text-align: center !important;
    margin-bottom: 0.5rem !important;
    font-weight: 600 !important;
}

.services-section .section-subtitle,
.is-style-enterprise-services .section-subtitle,
.services-section .wp-block-paragraph.is-style-enterprise-subtitle,
.is-style-enterprise-services .wp-block-paragraph.is-style-enterprise-subtitle {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* カラムスタイル */
.wp-block-columns.service-cards .wp-block-column,
.wp-block-columns.is-style-enterprise-cards .wp-block-column {
    background: rgba(255, 255, 255, 0.1) !important;
    padding: 2rem 1.5rem !important;
    border-radius: 2px !important;
    text-align: center !important;
    margin-bottom: 2rem !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    transition: transform 0.3s ease !important;
}

.wp-block-columns.service-cards .wp-block-column:hover,
.wp-block-columns.is-style-enterprise-cards .wp-block-column:hover {
    transform: translateY(-5px) !important;
}

.wp-block-columns.service-cards h3,
.wp-block-columns.is-style-enterprise-cards h3 {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    margin-bottom: 1rem !important;
    color: white !important;
}

.wp-block-columns.service-cards p,
.wp-block-columns.is-style-enterprise-cards p {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* 画像スタイル */
.wp-block-image img,
.wp-block-image.is-style-enterprise-rounded img {
    border-radius: 2px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2) !important;
}

/* アニメーション */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease-out;
}

.fade-in.animate {
    opacity: 1;
    transform: translateY(0);
}

/* レスポンシブ */
@media (max-width: 768px) {

    .section-title,
    .wp-block-heading.is-style-enterprise-title {
        font-size: 1.875rem !important;
    }

    /* aboutセクション「さらに詳しく」ボタン中央揃え */
    .about-section .is-layout-flex {
        justify-content: center !important;
    }

    /* contactセクションのボタンを同じ幅に */
    .contact-section .wp-block-button__link,
    .is-style-enterprise-contact .wp-block-button__link {
        width: 220px !important;
        box-sizing: border-box !important;
    }
    .contact-section .is-layout-flex:not(.is-vertical).is-content-justification-center{
        gap: 24px;

    }
}

/* WordPress固有の調整 */
.company-front-page .wp-block-group {
    margin-top: 0;
    margin-bottom: 0;
}

.company-front-page .wp-block-cover {
    margin-top: 0;
    margin-bottom: 0;
}

/* アイコン用スタイル */
.enterprise-icon {
    width: 60px;
    height: 60px;
    border: 5px solid;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -2rem;
    left: 50%;
    transform: translateX(-50%);
    background-color: #007AFF;
    font-size: 1.5rem;
    color: white;
}

/* 企業ブロックスタイル（functions.phpで登録されているもの） */
.wp-block-group.is-style-enterprise-section {
    padding: 5rem 2rem;
}

/* エディター固有のスタイル調整 */
.editor-styles-wrapper .wp-block-group {
    margin-top: 0;
    margin-bottom: 0;
}

.editor-styles-wrapper .wp-block-cover {
    margin-top: 0;
    margin-bottom: 0;
}

/* ブロックエディター固有の調整 */
.block-editor-block-list__layout .wp-block {
    max-width: none;
    /* エディター内での幅制限を解除 */
}

/* エディター内でのブロック選択時のアウトライン調整 */
.wp-block-group.services-section.is-selected,
.wp-block-group.is-style-enterprise-services.is-selected {
    outline: 2px solid rgba(255, 255, 255, 0.8);
}

.wp-block-group.contact-section.is-selected,
.wp-block-group.is-style-enterprise-contact.is-selected {
    outline: 2px solid rgba(255, 255, 255, 0.8);
}

/* エディター用のセクション調整 */
.editor-styles-wrapper .wp-block-group.about-section,
.editor-styles-wrapper .wp-block-group.is-style-enterprise-about {
    padding: 3rem 1.5rem !important;
    /* エディター内では余白を調整 */
}

.editor-styles-wrapper .wp-block-group.services-section,
.editor-styles-wrapper .wp-block-group.is-style-enterprise-services {
    padding: 3rem 1.5rem !important;
}

.editor-styles-wrapper .wp-block-group.contact-section,
.editor-styles-wrapper .wp-block-group.is-style-enterprise-contact {
    padding: 4rem 1.5rem !important;
    /* エディター内では余白を調整 */
}

/* 会社情報フッターセクション */
.wp-block-group.company-footer-info {
    background-color: #ffffff !important;
    padding: 3rem 1.5rem 2rem !important;
}

.wp-block-group.company-footer-info .company-name {
    display: inline-block !important;
    margin-bottom: 1rem !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #374151 !important;
}

.wp-block-group.company-footer-info .company-address,
.wp-block-group.company-footer-info .company-tel,
.wp-block-group.company-footer-info .company-fax {
    font-size: 0.875rem !important;
    color: #374151 !important;
    margin-bottom: 0.25rem !important;
}

.wp-block-group.company-footer-info .menu-title {
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin-bottom: 1rem !important;
}

.wp-block-group.company-footer-info .footer-menu {
    list-style: none !important;
    padding-left: 0 !important;
    font-size: 0.875rem !important;
}

.wp-block-group.company-footer-info .footer-menu li {
    margin-bottom: 0.5rem !important;
}

.wp-block-group.company-footer-info .footer-menu a {
    color: #374151 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.wp-block-group.company-footer-info .footer-menu a:hover {
    color: #007AFF !important;
}

/* 2カラムレイアウト調整 */
.wp-block-group.company-footer-info .wp-block-columns {
    gap: 2rem !important;
    margin-bottom: 0 !important;
}

/* レスポンシブ調整 */
@media (max-width: 768px) {
    .wp-block-group.company-footer-info .wp-block-columns {
        flex-direction: column !important;
        gap: 1.5rem !important;
    }

    .wp-block-group.company-footer-info {
        padding: 2rem 1rem !important;
    }
}

/* 全幅セクション設定 */
.wp-block-group.services-section,
.wp-block-group.is-style-enterprise-services,
.wp-block-group.contact-section,
.wp-block-group.is-style-enterprise-contact,
.about-to-services-divider,
.services-to-contact-divider {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    max-width: none !important;
}

/* 全幅セクション内のコンテンツコンテナ */
.wp-block-group.services-section>.wp-block-group__inner-container,
.wp-block_group.is-style-enterprise-services>.wp-block-group__inner-container,
.wp-block_group.contact-section>.wp-block-group__inner-container,
.wp-block_group.is-style-enterprise-contact>.wp-block-group__inner-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

/* エディター内での全幅プレビュー調整 */
.editor-styles-wrapper .wp-block-group.services-section,
.editor-styles-wrapper .wp-block-group.is-style-enterprise-services,
.editor-styles-wrapper .wp-block-group.contact-section,
.editor-styles-wrapper .wp-block-group.is-style-enterprise-contact {
    width: calc(100% + 3rem) !important;
    margin-left: -1.5rem !important;
    margin-right: -1.5rem !important;
}

/* ブロックエディター用の幅制限解除 */
.block-editor-block-list__layout .wp-block-group.services-section,
.block-editor-block-list__layout .wp-block-group.is-style-enterprise-services,
.block-editor-block-list__layout .wp-block_group.contact-section,
.block-editor-block-list__layout .wp-block-group.is-style-enterprise-contact {
    max-width: none !important;
}

/* レスポンシブ調整 */
@media (max-width: 768px) {

    .wp-block-group.services-section>.wp-block-group__inner-container,
    .wp-block_group.is-style-enterprise-services>.wp-block-group__inner-container,
    .wp-block_group.contact-section>.wp-block-group__inner-container,
    wp-block_group.is-style-enterprise-contact>.wp-block-group__inner-container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* h3見出しのスタイル */
h3.wp-block-heading {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
}

/* ヘッダーの問い合わせボタン */
.c-gnav>.menu-item>a[href$="#contact"]>span.ttl {
    background: linear-gradient(90deg, #2196f3 0%, #007AFF 100%);
    color: #fff;
    padding: 16px;
}

.c-gnav>.menu-item>a[href$="#contact"]>span.ttl:hover {
    background: #971320;
}

/* Aboutセクションのカラム配置 */
.about-section .wp-block-columns,
.wp-block-group.is-style-enterprise-about .wp-block-columns {
    align-items: center !important;
}

/* メインビジュアル関連のスタイル */
.p-mainVisual__textLayer {
    background-color: rgb(0 0 0 / 0.5);
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    width: 100%;
    max-width: 870px;
    height: auto;
    padding: 3rem;
}

.p-mainVisual__slideTitle {
    font-size: 3.75rem;
    font-weight: bold;
}

@media (max-width: 768px) {
    .p-mainVisual__slideTitle {
        font-size: 30px;
    }
}

/* コンテンツの余白調整 */
.l-content {
    margin-bottom: 0 !important;
}


/* Aboutセクション→Servicesセクション間の斜め線 */
.about-to-services-divider {
    position: relative;
    height: 100px;
    overflow: hidden;
    background: linear-gradient(180deg, #007AFF 0%, #007AFF 100%);
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    max-width: none !important;
}

.about-to-services-divider::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f9fafb;
    transform: skewY(-3deg);
    transform-origin: bottom left;
}

.section-desc {
    max-width: 600px;
    margin: 0 auto;
}

/* Servicesセクション→Contactセクション間の斜め線 */
.services-to-contact-divider {
    position: relative;
    height: 100px;
    overflow: hidden;
    background: #ffffff00;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    max-width: none !important;
    z-index: 10;
}

.services-to-contact-divider::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #2196f3 0%, #2196f3 100%);
    transform: skewY(-3deg);
    transform-origin: top left;
}

/* レスポンシブ調整 */
@media (max-width: 768px) {

    .diagonal-divider,
    .about-to-services-divider,
    .services-to-contact-divider {
        height: 50px;
    }
}

/* エディター内での斜め区切り線の調整 */
.editor-styles-wrapper .about-to-services-divider,
.editor-styles-wrapper .services-to-contact-divider {
    width: calc(100% + 3rem) !important;
    margin-left: -1.5rem !important;
    margin-right: -1.5rem !important;
}

/* ブロックエディター用の斜め区切り線調整 */
.block-editor-block-list__layout .about-to-services-divider,
.block-editor-block-list__layout .services-to-contact-divider {
    max-width: none !important;
}

/* エディター画面ではAbout→ServicesおよびServices→Contactの斜め区切り線を非表示 */
.editor-styles-wrapper .about-to-services-divider,
.editor-styles-wrapper .services-to-contact-divider,
.block-editor-block-list__layout .about-to-services-divider,
.block-editor-block-list__layout .services-to-contact-divider {
    display: none !important;
}

/* エディター画面ではネガティブマージンを無効化 */
.editor-styles-wrapper .wp-block-group.contact-section,
.block-editor-block-list__layout .wp-block-group.contact-section {
    margin-top: 0 !important;
}

/* SP表示用改行クラス */
.br-sp {
    display: none !important;
}

@media (max-width: 768px) {
    .br-sp {
        display: block !important;
    }
}