@charset "utf-8";
/*
Theme Name:   NTT AI-CIX 2026
Theme URI: https://aicix.jp/
Description: 
Author: scitech
Tags: 
Version: 0.1.0
*/


/*----- ベース設定 -----*/
.page.buntant .wrapContent{
	--article_size: 750px;
	--white: #FFFFFF;
	--green: #2B815E;
	--orange: #D59A14;
	font-size: clamp(15px, 2vw, 16px);
}
.page.buntant .wrapPageHeader {
    display: none;
}

@media screen and (max-width: 960px){
	.page.buntant .mb30{margin-bottom: 20px !important;}
	.page.buntant .mb60{margin-bottom: 40px !important;}
}

/*----- カバー -----*/
.wrapContent .wp-block-cover{
    padding-top: 80px;
    padding-bottom: 80px;
}

/*----- コンテナサイズ -----*/
.article-size,
.container-size{
	width: 100%;
    position: relative;	
	margin: 0 auto;
}
.article-size{
    max-width: var(--article_size);
}
.container-size{
    max-width: 980px;
}

/*----- チェック背景 -----*/
.check-back .wp-block-cover__image-background{
    background-size: contain;
    opacity: 0.35;
}
.check-back .wp-block-cover__image-background{
    z-index: 0;
}
.check-back .wp-block-cover__background{
    z-index: -1;
}

/*----- 影ありBOX -----*/
.shadow-box{
    background: var(--white);
    padding: 3rem 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px #0815094d;
}
@media screen and (max-width: 960px){
	.shadow-box{
		padding: 2rem 1rem;
	}	
}

/*----- 見出しBOX -----*/
.label-column h3.wp-block-heading{
    width: fit-content;
    background: var(--green);
    color: var(--white);
    padding: 0.5rem 2rem 0.5rem 1rem;
    margin-bottom: 0;
    border-radius: 0 2rem 2rem 0;
}

.label-column .wp-block-column{
    display: flex;
    flex-direction: column;
}
.label-column .wp-block-group{
    background: #F1F7EA;
    padding: 1.5rem 1rem;
    border-radius: 0 0.5rem 0.5rem 0.5rem;
    flex-grow: 2;
}

@media screen and (max-width: 781px) and (min-width: 512px){
	.label-column .wp-block-column{
		max-width: 65%;
		margin: 0 auto;
	}	
}


/*----- 見出し -----*/
h2.wp-block-heading.title-lg,
h2.wp-block-heading.title-md{
    color: #081509;
    margin-bottom: 1em;	
	letter-spacing: 0.1em;
	text-align: center;
	overflow-wrap: break-word;
	word-break: keep-all;
}

h2.wp-block-heading.title-lg{
    font-size: clamp(22px, 3vw, 35px);
}
h2.wp-block-heading.title-md{
    font-size: clamp(22px, 3vw, 28px);
}

.grad-text,
h2.wp-block-heading small{
	display: block;
    width: fit-content;
    margin: 0 auto 0.5rem;
    padding: 0.5rem 1rem !important;
    background: linear-gradient(90deg, #5b9b36 0%, #d59a14 100%);
    font-size: clamp(14px, 2vw, 18px) !important;
    font-weight: bold;
    color: var(--white);
	text-align: center;
    letter-spacing: 0.1rem;
    border-radius: 0.5rem;
    opacity: 1;
}

h3.wp-block-heading{
	color: var(--green);
    font-size: clamp(1.2rem, 2vw, 22px);
	letter-spacing: 0.1rem;
	overflow-wrap: break-word;
	word-break: keep-all;
}


/*----- テキスト・リスト -----*/
.wrapContent strong{
	color: var(--green);
    font-size: 1.15em;
	font-weight: 800;
	line-height: 1.4;
}

.wrapContent .is-style-check_list li{
    position: relative;	
    padding-left: 1.5em;
}
.wrapContent .is-style-check_list li::before{
    content: "";
    display: block;
    width: 1.15em;
    height: 1.15em;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='_x32_' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='width: 256px; height: 256px; opacity: 1; fill:%23D59A14;' xml:space='preserve'%3E%3Cpath class='st0' d='M469.402,35.492C334.09,110.664,197.114,324.5,197.114,324.5L73.509,184.176L0,254.336l178.732,222.172 l65.15-2.504C327.414,223.414,512,55.539,512,55.539L469.402,35.492z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(0%, 30%);
}

@media screen and (max-width: 767px){
	.sp-left{
		text-align: left !important;
	}
	.sp-center{
		text-align: center !important;
		overflow-wrap: break-word;
    	word-break: keep-all;
	}	
}

/*----- CTA -----*/
.contact{
	overflow-wrap: break-word;
	word-break: keep-all;	
}
.contact h2.wp-block-heading > small{
    background: var(--white);
    color: #5b9b36;
}

.wp-block-buttons .wp-block-button__link{
    font-size: 1.15rem;
    font-weight: bold;
	overflow-wrap: break-word;
    word-break: keep-all;
}


/*----- FV -----*/
#fv{
	max-width: 1280px;
}

#fv h2.wp-block-heading > img{
	width: 100% !important;
	max-width: 550px;
}

#fv .fv-image{
	display: none;
}

#fv .fv-column{
    align-items: center !important;
    width: 95%;
    padding: 0.75rem 1rem !important;
    margin: 0 0 1rem 0;
	gap: 1rem;
}

@media screen and (min-width: 768px){
	.wrapContent .wp-block-cover:has(#fv){
		padding-top: 160px;
	}	
}
@media screen and (max-width: 960px){
	#fv .wp-block-media-text .wp-block-media-text__media{
		align-self: end;
	}
	#fv .wp-block-media-text .wp-block-media-text__content{
		/*margin-top: 40px;*/
		padding: 0;
	}
	#fv h2.wp-block-heading small{
		margin: 0 auto 1em;
	}	
	#fv .fv-column{
		width: 100%;
	}
}
@media screen and (max-width: 800px){
	#fv .wp-block-media-text{
	    grid-template-columns: 100% !important;	
        max-width: clamp(300px, 100%, 600px);
        margin: auto;
	}
	#fv .wp-block-media-text .wp-block-media-text__media{
		display: none;
	}
	#fv .fv-image{
		display: block;
		width: clamp(300px, 65vw, 500px);
        margin: auto;
	}
}


/*----- お悩み -----*/
.wrapContent .wp-block-cover:has(#problem){
	padding-bottom: 100vh;
}	

#problem{
    margin-bottom: 0 !important;
    position: relative;
    z-index: 1;
}
#problem::before{
	content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -10%);
    width: 240px;
    aspect-ratio: 3 / 1;
    background: var(--white);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    z-index: 2;
}

#problem .problem-column{
    margin: 0 auto;
    /*max-width: var(--article_size);*/
	gap: 0;
}
#problem .problem-column .wp-block-column{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
#problem .problem-column .wp-block-column:has(.wp-block-image){
    padding: 0 0.5rem;
}

#problem .problem-column .speech1,
#problem .problem-column .speech2,
#problem .problem-column .speech3{
    position: relative;
    margin: 0 1em;
    padding: 1em 0.75em;
    border: 6px solid var(--orange);
    border-radius: 10em;
    background-color: var(--white);
    font-size: 1.2rem;
    font-weight: bold;
}

#problem .problem-column .speech1::before,
#problem .problem-column .speech1::after,
#problem .problem-column .speech2::before,
#problem .problem-column .speech2::after,
#problem .problem-column .speech3::before,
#problem .problem-column .speech3::after {
    content: "";
    position: absolute;
    border-style: solid;
}

#problem .problem-column .speech1::before {
    top: 50%;
    right: 0;
    border-width: 30px 0 0 30px;
    border-color: transparent transparent transparent var(--orange);
    translate: 100% -50%;
}
#problem .problem-column .speech1::after {
    top: 50%;
    right: 0;
    border-width: 15.5px 0 0 15.5px;
    border-color: transparent transparent transparent var(--white);
    translate: 90% calc(-50% + 1.2px);
}

#problem .problem-column .speech2::before {
    top: 50%;
    right: 0;
    border-width: 0 0 30px 30px;
    border-color: transparent transparent transparent var(--orange);
    translate: 100% -50%;
}
#problem .problem-column .speech2::after {
    top: 50%;
    right: 0;
    border-width: 0 0 15.5px 15.5px;
    border-color: transparent transparent transparent var(--white);
    translate: 90% calc(-50% - 1.2px);
}

#problem .problem-column .speech3::before {
    top: 50%;
    left: 0;
    border-width: 15px 30px 15px 0;
    border-color: transparent var(--orange) transparent transparent;
    translate: -100% -50%;
}
#problem .problem-column .speech3::after {
    top: 50%;
    left: 0;
    border-width: 8.3px 16.6px 8.3px 0;
    border-color: transparent var(--white) transparent transparent;
    translate: -90% -50%;
}


@media (max-width: 781px) {
	#problem::before {
		width: 150px;
	}
	
	#problem .wp-block-group__inner-container{
    	max-width: clamp(300px, 65vw, 100%);
    	margin: 0 auto;
	}
	
	#problem .problem-column .wp-block-column:has(.wp-block-image){
		order: 1;
		max-width: 75%;
        margin: 0 auto;
	}
	#problem .problem-column .speech1,
	#problem .problem-column .speech2,
	#problem .problem-column .speech3{
		font-size: 1rem;
        margin: 0 0 2em;
        padding: 0.5em 0.75em;
	}
	#problem .problem-column .speech1::before,
	#problem .problem-column .speech3::before{
        top: auto;
        right: auto;
        bottom: 0;
        left: 75%;
        border-width: 30px 30px 0 0;
        border-color: var(--orange) transparent transparent;
        translate: -50% 100%;
	}
	#problem .problem-column .speech1::after,
	#problem .problem-column .speech3::after {
        top: auto;
        right: auto;
        bottom: 0;
        left: 75%;
        border-width: 15.5px 15.5px 0 0;
        border-color: var(--white) transparent transparent;
        translate: calc(-50% - 1.2px) 100%;
	}
	
	#problem .problem-column .speech2::before{
        top: auto;
        right: auto;
        bottom: 0;
        left: 25%;
        border-width: 30px 0 0 30px;
        border-color: var(--orange) transparent transparent;
        translate: -50% 100%;
	}	
	#problem .problem-column .speech2::after{
        top: auto;
        right: auto;
        bottom: 0;
        left: 25%;
        border-width: 15.5px 0 0 15.5px;
        border-color: var(--white) transparent transparent;
        translate: calc(-50% + 1.2px) 100%;
	}	
}



/*----- 解決 -----*/
#solution{
    position: relative;
    padding-top: clamp(70px, calc(100vw * 0.12), 100px);
    padding-bottom: clamp(70px, calc(100vw * 0.15), 120px);	
    margin-bottom: 200px;
}
#solution::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -40%);
    width: 100%;
	max-width: 70vw;
    aspect-ratio: 1 / 1;
    border-radius: 100%;
    background: linear-gradient(235deg, #5b9b36 0%, var(--green) 100%);
    z-index: 0;
}

#solution .wp-block-group__inner-container{
    position: relative;	
    z-index: 1;
}

#solution h2.wp-block-heading,
#solution h2.wp-block-heading strong{
	color: var(--white) !important;
}

#solution h2.wp-block-heading > img{
	display: inline-block;
    background: var(--white);
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    margin-right: 1rem;
}

#solution .wp-block-image{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
	max-width: 300px;
}

@media screen and (max-width: 960px){
	#solution h2.wp-block-heading > img{
	    width: clamp(200px, 35vw, calc(100% - 4.5em)) !important;	
	}
}

@media screen and (max-width: 512px){
	#solution{
    	padding-top: 60px;
        padding-bottom: clamp(60px, calc(100vw * 0.25), 120px);
        margin-bottom: clamp(100px, calc(100vw * 0.25), 200px);
	}
	#solution::before {
		transform: translate(-50%, calc(100vw * -0.2));
	    max-width: 100vw;	
	}
}

/*----- 強み -----*/
#strength{
    position: relative;
	padding-top: 120px;
	padding-bottom: 0;
	margin-top: calc(-100vh + 80px);
}
#strength .wp-block-cover__image-background{
    z-index: -1;
}
#strength .wp-block-cover__background{
    border-radius: 150% 150% 0 0;
    z-index: 0;
}

#strength h2.wp-block-heading{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2rem;
	margin-bottom: 0;
}

#strength h2.wp-block-heading > span{
	display: flex;
	justify-content: center;
    align-items: flex-end;
    width: fit-content;
	color: inherit;
    background: var(--white);
    padding: 0.25em 0.75em;
    margin-bottom: 0;
    border-radius: 0.25rem;
}

#strength h2.wp-block-heading img{
    margin-right: 1rem;
    margin-bottom: 0.5rem;
}
#strength h2.wp-block-heading strong{
    line-height: 1.6;
    font-size: 1.25em;
    margin-right: 0.25rem;
}

#strength h2.wp-block-heading br{
	display: none;
}


@media screen and (max-width: 960px){
	#strength{
		padding-top: 80px;
	}
	#strength h2.wp-block-heading{
		gap: 0;		
	}	
    #strength h2.wp-block-heading > span{
		flex-wrap: wrap;
		background: none;
		margin-top: -1rem;
	}
	
	#strength h2.wp-block-heading img{
	    width: clamp(200px, 35vw, calc(100% - 4.5em)) !important;
		background: var(--white);
		margin-left: 0;
		padding: 0.75rem 1rem;
		border-radius: 0.5rem;
	}	
}


.wrapContent .wp-block-cover:has(#point1) .wp-block-cover__background{
	z-index: 0;
}
@media screen and (max-width: 960px){
	.wrapContent .wp-block-cover:has(#point1){
		padding-top: 30px;
	}	
}


/*----- 特長・ポイント -----*/
#feature1 .wp-block-list,
#feature2 .wp-block-list,
#point1 .wp-block-list,
#point2 .wp-block-list,
#point3 .wp-block-list{
    width: fit-content;
    background: #F1F7EA;
    padding: 1rem;
    margin: 0 auto;
    border-radius: 0.5rem;
}
#feature1 .wp-block-list,
#feature2 .wp-block-list{
	margin-bottom: 2rem;
}

#feature1 .wp-block-list li,
#feature2 .wp-block-list li,
#point1 .wp-block-list li,
#point2 .wp-block-list li,
#point3 .wp-block-list li{
    margin-bottom: 0.5em;
    /*overflow-wrap: break-word;
    word-break: keep-all;*/
}


#feature1 .wp-block-image{
    max-width: 700px;
    margin: 0 auto;
}
#feature2 .wp-block-image{
    max-width: 600px;
    margin: 0 auto;
}
#feature1 .feature-img_sp,
#feature2 .feature-img_sp{
	display: none;
}

#point1 .wp-block-image,
#point2 .wp-block-image,
#point3 .wp-block-image{
    max-width: clamp(200px, 50vw, 300px);
    margin: 0 auto 2rem;
}

@media screen and (max-width: 960px){
	#feature1 .wp-block-list,
	#feature2 .wp-block-list,
	#point1 .wp-block-list,
	#point2 .wp-block-list,
	#point3 .wp-block-list{
		width: 100%;
	}
	#feature1 .wp-block-list br,
	#feature2 .wp-block-list br,
	#point1 .wp-block-list br,
	#point2 .wp-block-list br,
	#point3 .wp-block-list br{
		display: none;
	}	
}
@media screen and (max-width: 512px){
	#feature1 .feature-img_pc,
	#feature2 .feature-img_pc{
		display: none;
	}
	#feature1 .feature-img_sp,
	#feature2 .feature-img_sp{
		display: block;
	}
	#feature1 .wp-block-image{
		max-width: 450px;
		margin: 0 auto;
	}
	#feature2 .wp-block-image{
		max-width: 350px;
		margin: 0 auto;
	}	
}


/*----- スケジュール・サポート -----*/
#schedule .schedule-column{
    /*width: 70%;
    max-width: var(--article_size);*/
    background: #e9f2ee;
    padding: 1.5rem 1rem;
    margin: 0 auto 1rem;
    border-radius: 0.5rem;
    align-items: center !important;
	gap: 1rem;
}
#schedule .schedule-column:not(:last-of-type){
    position: relative;
    margin-bottom: 3rem;
}

#schedule .schedule-column:not(:last-of-type)::after{
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 50%);
    width: 5rem;
    aspect-ratio: 3 / 1;
    background: var(--orange);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
}

#schedule .schedule-column h3.wp-block-heading{
    margin-bottom: 0.5rem;
}


#support .label-column strong{
	color: #081509;
}

@media screen and (min-width: 768px){
	#support{
		overflow-wrap: break-word;
		word-break: keep-all;	
	}	
}
@media screen and (max-width: 960px){
	#schedule .schedule-column{
		width: 95%;
	}	
}