@charset "UTF-8";

/*!
Theme Name:x-t9 child
Template:x-t9
*/

.wp-block-navigation .wp-block-page-list,
.wp-block-navigation__container,
.wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container,
.wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-dialog{
    gap:0;
}

main{
    overflow-x:hidden;
}

.table{
    table-layout:fixed;
    max-width:630px;
    margin:0 auto;
    font-size:16px;
}
.table-th{
    width:230px;
    text-align:left;
}
.table-td{
    background:none !important;
}
.label{
    display:inline-block;
    margin-left:8px;
    padding:2px 8px 0;
    border-radius:4px;
    color:#fff;
}
.label-required{
    background:#c00;
}
.label-optional{
    background:#999;
}
.contact-btnarea{
    padding-left:48px;
}
.wpcf7-submit{
    margin-left:16px;
    border-radius:24px !important;
    font-size:18px;
}
input, textarea, select{
    font-size:16px;
}

.link{
        transition:opacity .1s;
}
@media (hover:hover) and (pointer:fine){
	.link:hover{
        opacity:.6;
	}
}

.vk_icon_frame a:where(:not(.wp-element-button)){
    text-decoration:none !important;
}

header{
    white-space:nowrap;
}
.wp-block-site-logo{
    margin-right:16px !important;
}

.mv{
    position:relative;
    overflow:hidden;
}
.mv:after{
    content:"";
    display:block;
    position:absolute;
    z-index:1;
    width:100%;
    height:80px;
    margin:auto;
    opacity:.5;
    top:0;
    right:0;
    bottom:0;
    background:#51c8e6;
}
.mv-text,
.mv-btn{
    position:absolute;
    z-index:2;
}
.mv-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    top:0;
    right:16px;
    bottom:0;
    left:16px;
}
.mv-text:before,
.mv-text:after{
    content:"";
    display:block;
    position:absolute;
    z-index:1;
    width:100%;
    height:80px;
    opacity:.5;
    transform:rotate(40deg);
}
.mv-text:before{
    top:0;
    right:0;
    background:#ef3a54;
}
.mv-text:after{
    bottom:0;
    left:0;
    background:#f0c23e;
}
.mv-copy{
    position:relative;
    z-index:2;
    line-height:1.2;
    margin-left:0 !important;
    color:#fff;
    font-size:9vw;
}
.mv-accent{
    font-size:10vw;
}
.mv-subcopy{
    position:relative;
    z-index:2;
    margin-left:0 !important;
}
.mv-btn{
    bottom:40px;
    right:0;
    left:0;
    margin:auto;
}

.vk_slider_7247a62c-2d56-491f-ab8e-419a5bb427fb .vk_slider_item.swiper-slide-active::before,
.vk_slider_7247a62c-2d56-491f-ab8e-419a5bb427fb .vk_slider_item.swiper-slide-duplicate-active::before{
    background-position:50% 20% !important;
}

.wp-block-cover{
    height:100%;
}
.sec-ttl-wrap{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    max-width:1100px;
    margin:0 auto;
}
.sec-ttl-wrap::before,
.sec-ttl-wrap::after{
    content:"";
    position:absolute;
    top:40px;
    margin:auto;
    background:#333;
    width:55%;
    height:2px;
}
.sec-ttl-wrap::before{
    left:-45px;
    transform:rotate(-15deg);
}
.sec-ttl-wrap::after{
    right:-45px;
    transform:rotate(15deg);
}
.sec-ttl{
    position:relative;
    z-index:1;
    display:inline-block;
    padding:0 16px;
}
.sec-ttl::before,
.sec-ttl::after{
    content:"";
    display:block;
    position:absolute;
    bottom:-4px;
    height:65%;
    width:1px;
    margin:0 auto;
    background:#333;
}
.sec-ttl::before{
    left:0;
    transform:rotate(-20deg);
}
.sec-ttl::after{
    right:0;
    transform:rotate(20deg);
}
.sec-ttl h2{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
.sec-ttl i{
    margin-right:0 !important;
    margin-bottom:4px;
}
.sec-ttl h2 + p{
    line-height:1;
    margin-top:0;
}

.subsec-ttl::before,
.subsec-ttl::after{
    content:"" !important;
    display:block;
    position:absolute;
}
.subsec-ttl::before{
    bottom:0;
    width:3px;
    height:90%;
    background:#333;
}
.subsec-ttl::after{
    border:3px solid;
    border-color:#333 #333 transparent transparent;
    transform:rotate(-45deg);
}
.subsec-ttl-r::before{
    left:0;
}
.subsec-ttl-r::after{
    top:-13px;
    left:4px;
    width:32px;
    height:24px;
}
.subsec-ttl-o::before{
    right:0;
}
.subsec-ttl-o::after{
    top:-17px;
    right:8px;
    width:24px;
    height:32px;
}
.subsec-ttl strong{
    display:block;
    padding:0 16px 8px;
}
.subsec-ttl strong::after{
    content:"";
    display:block;
    position:absolute;
    bottom:0;
    width:100vw;
    height:4px;
    background-size:auto;
    background-image:repeating-linear-gradient(-45deg, transparent, transparent 24px, rgba(255, 1, 1, 1) 24px, rgba(255, 1, 1, 1) 28px ),repeating-linear-gradient(-45deg, transparent, transparent 10px, rgba(42, 171, 204, 1) 10px, rgba(42, 171, 204, 1) 14px ),repeating-linear-gradient(-45deg, transparent, transparent 3px, rgba(240, 194, 62, 1) 3px, rgba(240, 194, 62, 1) 7px );
}
.subsec-ttl-r strong::after{
    left:0;
    margin-right:calc(50% - 50vw);
}
.subsec-ttl-o strong::after{
    right:0;
    margin-left:calc(50% - 50vw);
}

.service-col{
    position:relative;
}
.service-ttl{
    position:absolute !important;
    bottom:16px;
    width:100%;
    background-image:linear-gradient(90deg, transparent, #000000 50%, transparent);
    color:#fff !important;
}
.balloon{
    top:8px;
    z-index:4 !important;
    padding:7px 10px !important;
    background:#fff !important;
    border:solid 3px #333 !important;
}
.balloon:before,
.balloon:after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
}
.balloon:before{
    bottom:-22px !important;
    margin-left:-15px !important;
    border:12px solid transparent !important;
    border-top:12px solid #fff !important;
    z-index:3 !important;
}
.balloon:after{
    bottom:-28px !important;
    margin-left:-17px !important;
    border:14px solid transparent !important;
    border-top:14px solid #333 !important;
    z-index:2 !important;
}
.balloon .vk_inline-font-size{
    color:#ff0;
    -webkit-text-stroke:10px #333;
    paint-order:stroke;
}

.service-attention{
    background:url(../../../../files/bg_gradation.jpg);
}

#reason .sec-ttl-wrap::before,
#reason .sec-ttl-wrap::after,
#reason .sec-ttl::before,
#reason .sec-ttl::after{
    background:#fff;
}

#works .subsec-ttl-r::after{
    top:-5px;
}
#works .subsec-ttl-o::after{
    top:-13px;
}
#works h4.wp-block-heading{
    padding:0 8px;
    border-bottom:1px solid #333 !important;
    border-left:6px solid #333 !important;
}
#works .subsec-ttl,
#works .wp-block-column{
    z-index:1;
}
#works .wp-block-columns{
    position:relative;
}
#works .wp-block-group:not(.sec-ttl-wrap){
    background:#f6f4f2 !important;
}
#works .wp-block-group:not(.sec-ttl-wrap):after{
    content:"";
    display:block;
    position:absolute;
    top:0;
    width:100vw;
    height:100%;
    background:#f6f4f2;
}
#works .subsec-r:after{
    left:0;
    margin-right:calc(50% - 50vw);
}
#works .subsec-l:after{
    right:0;
    margin-left:calc(50% - 50vw);
}

.btn-insta .vk_button_link{
    background:linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
    border:0;
}

.cardlist .wp-block-group{
    display:flex;
    align-items:center;
    padding:24px;
    border-radius:6px;
    box-shadow:1px 1px 6px rgba(0,0,0,.1);
}
.cardlist .wp-block-group img{
    width:auto;
    max-height:80px;
}

.taglist{
    list-style:none;
    padding:0;
}
.taglist li{
    display:inline-block;
    margin:0 8px 8px 0;
    padding:6px 16px 4px;
    background:#333;
    color:#fff;
}

.cta{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
}
.cta-col{
    margin:8px 16px !important;
}

@media (max-width:599px) {
    #works .subsec-r:after{
        right:0;
        margin-left:calc(50% - 50vw);
    }
    #works .subsec-l:after{
        left:0;
        margin-right:calc(50% - 50vw);
    }
    #works .wp-block-column:first-child{
        order:1;
    }
}

/*576px以上*/
@media (min-width:576px){
    .table-th{
        text-align:right;
    }
}

/*600px以上*/
@media (min-width:600px){
	.link-tel{
		pointer-events:none;
		text-decoration:none;
	}
    .wp-block-navigation__responsive-container-open:not(.always-shown){
        display:block;
    }
    .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){
        display:none;
        position:fixed;
        right:0;
        top:0;
    }

    #works .subsec-r{
        padding-left:20px !important;
    }
    #works .subsec-l{
        padding-right:20px !important;
    }
}

/*768px以上*/
@media (min-width:768px){
    .mv:after{
        width:100%;
        height:160px;
    }
    .mv-text:before,
    .mv-text:after{
        height:160px;
    }
    .mv-text:before{
        top:-80px;
        right:-40px;
    }
    .mv-text:after{
        bottom:-80px;
        left:-40px;
    }
}

/*1120px以上*/
@media (min-width:1120px){
    .wp-block-navigation__responsive-container-open:not(.always-shown){
        display:none;
    }
    .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){
        background-color:inherit;
        display:block;
        position:relative;
        width:100%;
        z-index:auto
    }
}

/*1280px以上*/
@media (min-width:1280px){
    .mv-text:before{
        top:-320px;
        right:-60px;
    }
    .mv-text:after{
        bottom:-320px;
        left:-60px;
    }
    .mv-copy{
        font-size:5vw;
    }
    .mv-accent{
        font-size:6vw;
    }
    .balloon{
        top:48px;
    }
}