@charset "UTF-8";
/*
Theme Name: SWELL CHILD
Template: swell
*/

/* =========================================================================
   SWELL Child Theme Styles for Taiyo Tent
   Merged with Custom Designs (styleのコピー.css)
   
   Main Color: #004098 (Taiyo Blue)
   Accent Color: #E60012 (Attention Red)
   --------------------------------------------------
   Included Fonts: Poppins, Roboto Condensed
========================================================================= */

/* Imports from Copy */
@import url('https://fonts.googleapis.com/css2?family=Saira+Semi+Condensed:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Michroma&display=swap');

/* =========================================================================
   Variables & Aliases
========================================================================= */
:root {
    /* Taiyo Tent Brand Colors */
    --color-taiyo-main: #1c3ba3;
    --color-taiyo-accent: #fc0f0f;
    --color-taiyo-accent-gradient: linear-gradient(90deg, #fc0f0f, #ff9849);
    --color-taiyo-text: #333333;
    --color-taiyo-sub: #F7F9FC;

    /* Aliases for merged styles (Compatibility) */
    --color_main: var(--color-taiyo-main);
    --color_sub: var(--color-taiyo-accent);
    /* Red */
    --color_text: var(--color-taiyo-text);
    --color_htag: var(--color-taiyo-main);
    /* For headings */

    /* SWELL Specific Overrides */
    --swl-fz--huge: 1.2em;
    /* from copy */
}

/* =========================================================================
   1. Typography (Taiyo Base)
========================================================================= */
body {
    font-family: "Yugothic", "Yu Gothic", "Helvetica Neue", "Arial", sans-serif;
    color: var(--color-taiyo-text);
    font-feature-settings: "palt" 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Helper Classes */
/* ページ上下の余白を削除 */
.page .l-content {
    padding-top: 0;
}

.page .l-content {
    margin-bottom: 0 !important;
}

.font-condensed {
    font-family: 'Saira Semi Condensed', sans-serif;
    letter-spacing: 0.1em;
    font-style: normal;
}

.font-en {
    font-family: "Michroma", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

.en-font,
.number {
    font-family: 'Saira Semi Condensed', sans-serif;
}

/* 余白調整 */
@media (min-width: 600px) {
    div.has-background.pd4em {
        padding: 4em;
    }

    div.has-background.pd2em {
        padding: 2em;
    }
}


/* =========================================================================
   2. Header & Navigation
========================================================================= */
.l-header {
    background-color: #fff;
}

.l-header__inner.l-container,
.l-fixHeader__inner.l-container {
    max-width: 100%;
}

.gnav_menu_item .menu_label {
    color: var(--color-taiyo-text);
    font-weight: 600;
}

/* CV Button (Contact) */
.header__cta .swell-block-columns__inner {
    flex-wrap: nowrap;
}
.c-headNav__item.is-btn a {
    background-color: var(--color-taiyo-accent) !important;
    color: #fff !important;
    font-weight: bold;
    border-radius: 4px;
    box-shadow: 0 4px 0 #b3000e;
    transition: all 0.2s ease;
    padding: 0.8em 1.5em;
}

.c-headNav__item.is-btn a:hover {
    transform: translateY(2px);
    box-shadow: 0 2px 0 #b3000e;
}

/* Mobile & Menu Adjustments from copy */
.c-gnav>.menu-item>a {
    padding: 0 0.75em;
}

.c-gnav>.menu-item>a .ttl {
    font-weight: bold;
}

@media screen and (max-width: 1600px) {
    .c-gnav>.menu-item>a {
        padding: 0 0.5em;
    }
}

/* ◯番目以降をカット */
@media screen and (max-width: 1700px) {
    .c-gnav>li.menu-item:nth-child(9) {
        display: none;
    }
}

@media screen and (max-width: 1600px) {
    .c-gnav>li.menu-item:nth-child(8) {
        display: none;
    }
}

@media screen and (max-width: 1500px) {
    .c-gnav>li.menu-item:nth-child(7) {
        display: none;
    }
}

@media screen and (max-width: 1400px) {
    .c-gnav>li.menu-item:nth-child(6) {
        display: none;
    }
}

@media screen and (max-width: 1300px) {
    .c-gnav>li.menu-item:nth-child(6) {
        display: list-item;
    }

    .header_tel {
        display: none;
    }
}

/* =========================================================================
   3. Heading Designs
========================================================================= */
/* Deleted upon request: Use SWELL Customizer settings */

/* =========================================================================
   4. Footer
========================================================================= */
.l-footer {
    background-color: var(--color-taiyo-main) !important;
    color: #fff !important;
}

.l-footer a,
.l-footer .widget_title {
    color: #fff !important;
}

.w-beforeFooter {
    margin: 0 auto;
    margin-top: 0;
}

/* Merged from copy: Contact CTA in Footer */
.footer__cta__block {
    --the-border-color: var(--color_main) !important;
    max-width: 768px;
    margin: 0 auto;
}

.footer__cta__block .swell-block-box-menu__item:hover {
    background-color: var(--color_main);
    color: #fff;
}

.footer__cta__block .swell-block-box-menu__item:hover .swell-block-box-menu__figure svg {
    color: #fff;
}

.footer__cta__tel .swell-block-box-menu__text .u-fz-xl {
    font-family: 'Poppins', sans-serif;
    letter-spacing: 0.1em;
}

/* Fixed Bottom Menu (SP) */
#fix_bottom_menu .menu-item.sp-fixf_tel {
    background-color: var(--color_main);
    /* Was #2e9568 */
    color: #FFF;
}

#fix_bottom_menu .menu-item.sp-fixf_tel span:before {
    content: 'お急ぎの方はお電話で';
    font-size: 9px;
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    font-weight: normal;
}

/* Block Link Ribbon */
.block-link-rbn {
    position: relative;
}

.block-link-rbn:before {
    content: "";
    bottom: 0;
    right: 0;
    border-top: 3.5em solid transparent;
    border-right: 3.5em solid var(--color-taiyo-accent);
    position: absolute;
    z-index: 100;
    border-radius: 0 0 0.5rem 0;
    padding-top: 0;
}

.block-link-rbn:after {
    font-family: "FontAwesome";
    content: "\f002";
    display: block;
    bottom: 0;
    transform: rotate(0deg);
    color: #fff;
    right: 5px;
    position: absolute;
    z-index: 101;
    font-size: 17px;
}

/* =========================================================================
   5. Buttons & Components
========================================================================= */
.c-btn.is-style-main {
    background-color: var(--color-taiyo-main);
    color: #fff;
}

.c-btn.is-style-cv {
    background-color: var(--color-taiyo-accent);
    color: #fff;
    font-weight: bold;
    box-shadow: 0 4px 10px rgba(230, 0, 18, 0.3);
}

/* Circle Button (from copy) */
.is-style-btn_normal.btn_circle a,
.is-style-btn_normal.btn_circle a:hover {
    box-shadow: none;
}

.btn_circle a {
    background: transparent !important;
    color: var(--color_text) !important;
    transition: 0.3s;
    padding: 0;
}

.btn_circle a .__icon {
    fill: var(--color_main);
    background: transparent;
    border: 1px solid var(--color_main);
    border-radius: 50%;
    width: 2.5em;
    height: 2.5em;
    padding: 0.5em;
    margin-left: 0.5em;
    text-shadow: none;
    transition: 0.3s;
}

.btn_circle.is-style-btn_normal a:hover {
    color: var(--color_main);
}

.btn_circle.is-style-btn_normal a:hover .__icon {
    fill: #FFF;
    background: var(--color_main);
    box-shadow: 0 1rem 2rem -1rem rgb(90 115 130 / 40%);
    transform: scale(1.1);
}
.is-style-btn_line{
    --the-btn-radius: 0.5em;
}

.btn_white a{
    background: #FFF;
    color: #565656;
}
.btn_white a:hover{
    background: var(--color_main);
    color: #FFF;
}

@media(max-width:599px) {

    .is-style-btn_normal.btn_circle a,
    .is-style-btn_normal.btn_circle a:hover {
        padding: 0.5em;
    }

    .btn_circle a .__icon {
        width: 1.5em;
        height: 1.5em;
        padding: 0.25em;
    }

    .btn_circle a span {
        font-size: 0.8em;
    }
}

/* Used Stock Label */
.used-status-label {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--color-taiyo-accent);
    color: #fff;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 2px;
    z-index: 5;
    font-weight: bold;
}

/* Group hyperlink */
a.wp-block-tiptip-hyperlink-group-block {
    text-decoration: none;
    color: inherit;
    transition: 0.3s;
    margin-top: 0;
    margin-bottom: 0;
}

a.wp-block-tiptip-hyperlink-group-block:hover {
    opacity: 0.7;
}

/* =========================================================================
   6. Custom Layouts (Copy Content)
========================================================================= */

/* Main Visual Text Styling */
.mv__copy__en {
    color: var(--color_sub);
    font-size: 2em;
    font-family: 'Poppins', sans-serif;
    letter-spacing: 0.05em;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
    /* simplified */
}

.mv__copy__ttl {
    color: #fff;
    background-color: var(--color_main);
    font-size: 3em;
    display: inline-block;
    padding: 0.25em 0.5em 0.3em;
    line-height: 1;
    letter-spacing: 0.1em;
}
@media (max-width: 1199px) {
    .mv__copy_l{
    font-size: 1.75em !important;
    }
    .mv__copy_m{
        font-size: 1.25em !important;
    }
    .mv__copy_s {
        font-size: 1em !important;
    }
}
@media (max-width: 599px) {
    .mv__copy_l{
    font-size: 1.5em !important;
    }
    .mv__copy_m{
        font-size: 1.2em !important;
    }
    .mv__copy_s {
        font-size: 0.9em !important;
    }
}

@media (max-width:599px){
    .top_about figure img {
        max-width: 70vw;
        margin: 0 auto;
    }
}

/* Service Flow */
.service__flow::after {
    display: block;
    content: "";
    height: 32px;
    border-style: solid;
    border-color: #fff;
    border-width: 0 1px 1px 1px;
    width: 100%;
    margin-top: 2em;
}

.service__chart .swell-block-box-menu__link:before,
.service__chart .swell-block-box-menu__link:after {
    background-color: #FFF;
}

/* Rounded Corners & Utilities */
.kadomaru {
    border-radius: 0.75em;
}

.kadomaru_img img {
    border-radius: 0.75em;
}

.kadomaru_img figure {
    border-radius: 0.75em;
}

.clip_kadomaru {
    clip-path: inset(0 0 round 1em);
}

.kadomaru>.wp-block-group__inner-container {
    padding: .75em;
}

@media (max-width: 599px) {
    .kadomaru {
        padding: 1em !important;
    }

    .kadomaru>.wp-block-group__inner-container {
        padding: 0.5em 0;
    }

    .post_content h2.is-style-section_ttl {
        font-size: 1.4em;
    }

    .is-stacked-on-mobile>.wp-block-media-text__content {
        padding: 1em 0.5em !important;
    }

    :root {
        --swl-fz--huge: 1.2em;
        --wp--preset--font-size--large: 1.1em;
        --wp--preset--font-size--medium: 1em;
    }
}

.mw900 {
    max-width: 900px;
    margin: 0 auto;
}

/* Post List Columns Override */
@media (min-width: 960px) {
    .-col4 .-type-card.-pc-col3 .p-postList__item {
        width: calc(100% / 4);
    }
}

/* Tables */
.wp-block-table td,
.wp-block-table th {
    padding: 1.5em .75em;
}

.post_content .wp-block-table.table_spec th,
.post_content .wp-block-table.table_spec td {
    background-color: #fff;
    border: none;
    padding: 0.3em 0;
}

/* =========================================================================
   7. Added Component Styles
========================================================================= */

/* Subtitle Layout in Post List (Added Request) */
.p-postList__subtitle {
    display: block;
    font-size: 0.85rem;
    color: var(--color-taiyo-main);
    /* Matching brand color or lighter text */
    margin-top: 0.4em;
    letter-spacing: 0.1em;
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: bold;
}

/* Adjust title spacing to accommodate subtitle */
.p-postList__title {
    margin-bottom: 0.2em !important;
}

/* Tab Content */
.c-tabBody {
    margin-top: 1em;
}

@media (min-width: 600px) {
    .c-tabList__button {
        font-size: 1.25em;
        font-weight: bold;
    }
}


/* =========================================================================
   8. Missing Styles from Copy (Cover Block, Media, FAQ, Form)
========================================================================= */

/* Cover Block with Round Button */
.wp-block-cover .wp-block-cover__inner-container .txt-detail .swl-inline-icon {
    width: 2.2em;
    height: 2.2em;
    margin-left: .75em;
    vertical-align: middle;
    background: #fff;
    color: var(--color_main);
    border-radius: 50%;
}

.wp-block-cover .wp-block-cover__inner-container .txt-detail .swl-inline-icon:after {
    left: calc(50% - 0.5em);
}

@media (max-width: 599px) {
    .wp-block-cover .wp-block-cover__inner-container .txt-detail .swl-inline-icon {
        width: 1em;
        height: 1em;
        padding: 1em;
    }
}

/* Media Text Spacing */
@media (min-width: 1280px) {
    .wp-block-media-text {
        --swl-mediatext--space: 4rem;
    }
}

.wp-block-media-text {
    --swl-mediatext--space: 3rem;
}

@media (max-width: 599px) {
    .wp-block-media-text {
        --swl-mediatext--space: 2rem;
    }
}

/* FAQ Styling */
.swell-block-faq__item .faq_q {
    cursor: pointer;
    padding-right: 1rem;
}

.swell-block-faq__item .faq_q::after {
    position: absolute;
    top: 50%;
    right: 2em;
    display: block;
    width: 7px;
    height: 7px;
    margin: auto;
    content: '';
    transform: translate(0px, -2px) rotate(135deg);
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    transition: .5s;
}

.faq_q.faq-open::after {
    transition: .5s;
    transform: translate(0px, 2px) rotate(-45deg);
}

.faq_q:not(.faq-open)+.faq_a {
    padding-top: 0;
    padding-bottom: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: .5s;
}

.is-style-faq-stripe .faq_q:before,
.is-style-faq-stripe .faq_a:before {
    font-family: "Roboto Condensed";
    font-optical-sizing: auto;
    font-style: normal;
}

@media (max-width: 599px) {
    .is-style-faq-stripe .swell-block-faq__item:not(:last-child) {
        margin-bottom: 1em;
    }

    .swell-block-faq__item .faq_q {
        padding-right: 2em;
    }

    .swell-block-faq__item .faq_q::after {
        right: 1em;
    }

    .swell-block-faq__item {
        font-size: 0.9em;
    }

    .is-style-faq-stripe .faq_q:before,
    .is-style-faq-stripe .faq_a:before {
        top: 0.9em;
    }
}

/* Contact Form Styles (MW WP Form) */
.contact_form span.form_required {
    display: inline-block;
    margin-left: 1em;
    font-size: 0.75em;
    padding: 0.25em 1em;
    background-color: var(--color_main);
    color: #ffffff;
    position: absolute;
    right: 1em;
}

.post_content .td_to_th_.contact_form tbody tr>:first-child {
    padding-right: 4em;
}

.gcal-sunday a,
.gcal-sunday span {
    color: #f00 !important;
}

.gcal-saturday a,
.gcal-saturday span {
    color: #0af !important;
}

.special-holiday a,
.special-holiday span {
    color: #f00 !important;
}

.jp-holiday a,
.jp-holiday span {
    color: #f00 !important;
}

.mwform-tel-field input[type="text"] {
    width: 70px !important;
}

.submit_button {
    background: var(--color_main);
    border: 1px solid var(--color_main);
    color: #fff;
    border-radius: 0.25em;
    display: block;
    letter-spacing: 0.1em;
    line-height: 1.5;
    margin: 1.5em auto 0.5em;
    padding: 0.5em;
    position: relative;
    text-decoration: none;
    width: 300px;
}

.submit_button:hover {
    background: #FFF;
    border: 1px solid var(--color_main);
    color: var(--color_main);
}

input[name="submitBack"] {
    background: #FFF;
    border: 1px solid var(--color_main);
    color: var(--color_main);
    margin-top: 0;
}

input[name="submitBack"]:hover {
    background: #dedede;
    border: 1px solid var(--color_main);
    color: var(--color_main);
}

/* -------------------------------------------------------------------------
 * カスタムタクソノミー（used_status）のラベル色変更
 * ------------------------------------------------------------------------- */
span.c-postThumb__cat[data-cat-id="104"],
span.c-postList__cat[data-cat-id="104"] {
    background-color: #fc0f0f !important;
    color: #ffffff !important;
}
span.c-postThumb__cat[data-cat-id="106"],
span.c-postList__cat[data-cat-id="106"] {
    background-color: #1c3ba3 !important;
    color: #fff !important;
}
span.c-postThumb__cat[data-cat-id="105"],
span.c-postList__cat[data-cat-id="105"] {
    background-color: #fff !important;
    color: #fc0f0f !important;
}