/*
------------------------------------
トップページ
------------------------------------
*/

.top_fv_section{
	padding-top: 0;
	background-color: var(--base_blue);
}

.top_fv_section .fv_flex{
	max-width: 1920px;
	margin-inline: auto;
	display: flex;
	
}

.top_fv_section .fv_left{
	width:50%;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	/* padding: */
	background-color: var(--base_blue);
	color:#fff;
}

.top_fv_section .fv_left_contents{
	position: relative;
	z-index: 1;
	padding-bottom: 24px;

}

.top_fv_section .fv_catch01{
	font-size: 32px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.top_fv_section .fv_catch02{
	font-size: 48px;
	font-weight: 700;
	line-height: 1.3;
}
.top_fv_section .fv_catch02 strong{
	font-size: 56px;
	font-weight: 700;
}

.top_fv_section .fv_deco{
	position: absolute;
}

.top_fv_section .fv_deco01{
	width:100%;
	top:0;
	left:0;
}

.top_fv_section .fv_deco02{
	width:100%;
	left:0;
	bottom:0;
}



.top_fv_section .fv_right{
	width:50%;
	position: relative;
	overflow: clip;
	background-color: #fff;
}

.top_fv_section .fv_bg_area{
	width:100%;
	height:100%;
	min-height: clamp(calc(620 / 1440 * 1440px) , calc(620 / 1440 * 100vw) , calc(620 / 1440 * 1920px));
}

.top_fv_section .fv_bg_item{
	position: absolute;
	width:100%;
	height:100%;
	
}

.top_fv_section .fv_bg_item.vanish{
	opacity: 0;
	transition-duration: 3s;
}

.top_fv_section .fv_bg_item img{
	width:100%;
	height:100%;
	object-fit: cover;
	object-position: left center;
	
}

.top_fv_section .fv_bg_item.move img{
	animation: fv_bg_move 10s linear forwards;
}

@keyframes fv_bg_move {
    from {
        object-position: left center;
    }
    to {
        object-position: right center;
    }
}


.top_fv_section .fv_right::before{
	content:'';
	width:100%;
	height:100%;
	background-color: #303030;
	opacity: 0.4;
	position: absolute;
	top:0;
	left:0;
	z-index: 2;
}

.top_fv_section .fv_right_contents_frame{
	position: absolute;
	width:100%;
	height:100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 3;
	top:0;
	left:0;
	padding:16px;
}

.top_fv_section .fv_logo{
	max-width: 378px;
	margin-inline: auto;

}

.top_fv_section .fv_text{
	max-width: 420px;
	margin-inline: auto;
	margin-top: 24px;
	text-shadow: 0 0 3px rgba(0, 0, 0, 0.30);
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.05em;
	color:#fff;
}
.top_fv_section .fv_button{
	width:fit-content;
	max-width: 90%;
	margin-inline: auto;
	margin-top: 20px;
	min-height: 50px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap:24px;
	border-radius: 9999px;
	background-color: var(--base_blue);
	border:1px solid var(--base_blue);
	padding:12px 24px;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	transition-duration: var(--c_duration);
}

.top_fv_section .fv_button::after{
	content:'';
	width:6px;
	aspect-ratio: 1 / calc(12 / 6);
	flex-shrink: 0;
	transition-duration: var(--c_duration);
	background-image: url('../img/common/icon_angle_right_white.svg');
}

@media (any-hover: hover) {
	.top_fv_section .fv_button:hover{
		background-color: #fff;
		color:var(--base_blue);
	}
	.top_fv_section .fv_button:hover::after{
		background-image: url('../img/common/icon_angle_right_blue.svg');
	}
}


@media screen and (max-width:1200px){
	.top_fv_section .fv_bg_area{
		width:100%;
		height:100%;
		min-height: calc(620 / 1100 * 100vw);
	}

	.top_fv_section .fv_logo {
		max-width: calc(378 / 1100 * 100vw);
		margin-inline: auto;
	}


	.top_fv_section .fv_catch01 {
		font-size: calc(32 / 1200 * 100vw);
	}
	.top_fv_section .fv_catch02 {
		font-size: calc(48 / 1200 * 100vw);
	}
	.top_fv_section .fv_catch02 strong{
		font-size: calc(56 / 1200 * 100vw);
	}
	
}/*@media screen and (max-width:1100px){*/



/*
------------------------------------
外断熱とは
------------------------------------
*/

.intro_guide_section{

}

.intro_guide_section .guide_flex{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap:24px;
}

.intro_guide_section .guide_left{
	width:100%;
	max-width: 424px;
}

.intro_guide_section .guide_head{
	min-height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding:6px 16px;
	background-color: var(--base_blue);
	font-weight: 500;
	font-size: 16px;
	color:#fff;
	letter-spacing: 0.05em;
}

.intro_guide_section .guide_text{
	margin-top: 16px;
	line-height: 2;
	letter-spacing: 0.05em;
}

.intro_guide_section .guide_right{
	flex-shrink: 0;
	width:calc(700 / 1200 * 100%);
}


.intro_about_section{

}

.intro_about_section .about_inner{
	max-width: 1120px;
	margin-inline: auto;
}

.intro_about_section .about_head{
	min-height: 110px;
	width: fit-content;
	margin-inline: auto;
	padding:5px	24px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--base_blue);
	color:#fff;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.05em;
	text-align: center;
}

.intro_about_section .about_flex{
	margin-top:var(--c_contents_space);
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap:40px calc(100 / 1120 * 100%);
}

.intro_about_section .about_left{
	width:530px;
	max-width: 100%;
}

.intro_about_section .about_right{
	display: flex;
	align-items: center;
}

.intro_about_section .about_item{
	display: flex;
	align-items: flex-start;
	gap:24px 0;
}

.intro_about_section .about_item + .about_item{
	margin-top: 64px;
}
.intro_about_section .about_head_area{
	flex-shrink: 0;
	width:220px;
	padding-right: 10px;
}

.intro_about_section .about_head01{
	font-size: 20px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.05em;
}
.intro_about_section .about_head01 strong{
	font-weight: 700;
	font-size: 32px;
}

.intro_about_section .about_head02{
	margin-top:4px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0.05em;
}

.intro_about_section .about_info{
	padding-top: 16px;
}

.intro_about_section .about_info li{
	position: relative;
	line-height: 1.75;
	padding-left: 16px;
}

.intro_about_section .about_info li::before{
	content:'・';
	line-height: 1.75;
	position: absolute;
	top:0;
	left:0;
}

/*
------------------------------------
工法一覧
------------------------------------
*/

.product_table_section{

}

.product_table_section .table_frame{
	width: fit-content;
	margin-inline: auto;
}

.product_table_section .product_table{
	border-collapse: collapse;
}

.product_table_section .product_table a{
	transition-duration: var(--c_duration);
}

@media (any-hover: hover) {
	.product_table_section .product_table a:hover{
		opacity: var(--c_hover_opa);
	}
}

.product_table_section .product_table th,
.product_table_section .product_table td{
	border:1px solid var(--base_black);
}

.product_table_section .product_table th{
	min-height: 45px;
	padding:4px 12px;
	background-color: var(--base_blue);
	
	color:#fff;
	font-size: 16px;
	font-weight: 500;
}

.product_table_section .product_table td{
	padding:16px;
	text-align: left;
	font-size: 15px;
	font-weight: 400;
	line-height: 2;
	letter-spacing: 0.05em;
	max-width: 340px;
}

.product_table_section .product_table td.center{
	text-align: center;
}

.product_table_section .product_block{
	width: fit-content;
	display: block;
	margin-inline: auto;
}


.product_table_section .product_name{
	font-weight: 700;
	text-align: center;
}

.product_table_section .product_pic{
	max-width: 105px;
	margin-inline: auto;
	margin-top: 8px;
}

/*
------------------------------------
仕上げ材から探す
------------------------------------
*/

.research_table_section{

}

.research_table_section .table_frame{
	width: 100%;
	width: fit-content;
	max-width: 100%;
	margin-inline: auto;
}

.research_table_section .research_table{
	border-collapse: collapse;
	min-width: 1100px;
}

.research_table_section .research_table a{
	transition-duration: var(--c_duration);
}

@media (any-hover: hover) {
	.research_table_section .research_table a:hover{
		opacity: var(--c_hover_opa);
	}
}

.research_table_section .research_table th,
.research_table_section .research_table td{
	border:1px solid var(--base_black);
}

.research_table_section .research_table th{
	min-height: 45px;
	padding:4px 12px;
	
	font-size: 16px;
	font-weight: 500;
}

.research_table_section .research_table th.on{
	background-color: var(--base_blue);
	color:#fff;
}

.research_table_section .research_table td{
	padding:16px ;
	text-align: left;
	font-size: 15px;
	font-weight: 400;
	line-height: 2;
	letter-spacing: 0.05em;
	min-width: 108px;
}

.research_table_section .research_table td.center{
	text-align: center;
}

.research_table_section .research_table td .radi{
	display: block;
	width:48px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	margin-inline: auto;
	background-color: #D5EBFF;
}

.research_table_section .product_block{
	width: fit-content;
	display: block;
	margin-inline: auto;
}


.research_table_section .product_name{
	font-weight: 700;
	text-align: center;
}

.research_table_section .product_pic{
	max-width: 105px;
	margin-inline: auto;
	margin-top: 8px;
}

/*
------------------------------------
ハイパート外断熱システム工法
------------------------------------
*/

.hi-part_method_section{

}

.hi-part_method_section .method_text{
	max-width: 900px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	line-height: 1.875;
	letter-spacing: 0.05em;
}

.hi-part_method_section .method_list{
	max-width: 820px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:calc(70 / 820 * 100%);
}

.hi-part_method_section .method_name{
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.67;
	letter-spacing: 0.05em;
}


.hi-part_structure_section{

}

.hi-part_structure_section .structure_contents{
	max-width: 900px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.hi-part_structure_section .structure_text{
	margin-top: 24px;
	line-height: 1.875;
	letter-spacing: 0.05em;
	font-size: 16px;
}

.hi-part_structure_section .structure_flex{
	margin-top: 24px;
	display: flex;
	align-items: center;
	gap:calc(58 / 900 * 100%);
}

.hi-part_structure_section .structure01{
	width:194px;
}
.hi-part_structure_section .structure02{
	width:320px;
}

.hi-part_construction_section{

}

.hi-part_construction_section .construction_contents{
	max-width: 900px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.hi-part_construction_section .construction_text{
	line-height: 1.875;
	letter-spacing: 0.05em;
}

.hi-part_construction_section .construction_img{
	max-width: 670px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.hi-part_flow_section{

}

.hi-part_flow_section .flow_contents{
	max-width: 940px;
	margin-inline: auto;	
	margin-top: var(--c_block_space);
}

.hi-part_flow_section .flow_list{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	gap:40px;
}

.hi-part_flow_section .flow_step{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.67;
	letter-spacing: 0.05em;
	text-align: center;
}

.hi-part_flow_section .flow_title{
	margin-top: 5px;
	line-height: 1.875;
	letter-spacing: 0.05em;
	text-align: center;
}

.hi-part_flow_section .flow_pic{
	margin-top: 12px;
	margin-inline: auto;
	width: fit-content;
	max-width: 100%;
}

.hi-part_flow_section .flow_pic img{
	width: auto;
	max-width: 100%;
	height:180px;
	object-fit: contain;
}



/*
------------------------------------
断熱パネル外断熱工法
------------------------------------
*/

.driving_method_guide_area{
	margin-top: var(--c_contents_space);
	max-width: 800px;
	margin-inline: auto;
}

.driving_method_guide_flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: calc(100 / 800 * 100%);
}

.driving_method_guide_right{
	flex-shrink: 0;
	width: calc(216 / 800 * 100%);
}

.driving_method_guide_left{
	width: 100%;
	display: flex;
	align-items: flex-end;
}

.driving_method_guide_head{
	font-size: 20px;
	font-weight: 700;
}

.driving_method_guide_text{
	margin-top: 44px;
	line-height: 1.875;
	letter-spacing: 0.05em;
}

.driving_method01_02_area .c_sub_head,
.driving_method03_04_area .c_sub_head,
.driving_method05_06_area .c_sub_head{
	margin-top: var(--c_block_space);
}

.driving_method01_02,
.driving_method03_04,
.driving_method05_06{
	justify-content: center;
	align-items: center;
	gap: 0 20px;
}

.driving_method01_02 .driving_method_left,
.driving_method03_04 .driving_method_left,
.driving_method05_06 .driving_method_left{
	width: 390px;
}

.driving_method01_02 .driving_method_right,
.driving_method03_04 .driving_method_right,
.driving_method05_06 .driving_method_right{
	width: 530px;
}

.driving_method07_08_09_area .c_sub_head{
	margin-top: var(--c_block_space);
}

.driving_method07_08_09_area .driving_method_list{
	max-width: 820px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:calc(60 / 820 * 100%);
}

.driving_method07_08_09_area .method_name{
	margin-top: 5px;
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
}

.driving_method10{
	max-width: 588px;
	margin-inline: auto;
}

.driving_method11 .driving_method_sub_head_detail{
	margin-top: var(--c_block_space);
	text-align: center;
}

.driving_method11 .c_img_block_inner{
	max-width: 600px;
	margin-inline: auto;
}

.driving_method11 .driving_method_sub_detail_area{
	margin-top: var(--c_block_space);
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
	max-width: 850px;
	margin-inline: auto;
}

.driving_method12_sec_head{
	margin-top: var(--c_contents_space);
}

.driving_method12 .c_img_block_inner{
	max-width: 600px;
	margin-inline: auto;
}

.driving_method12 .driving_method_sub_detail_area{
	max-width: 850px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
}

.retrofit_parts_guide_area{
	margin-top: var(--c_contents_space);
	max-width: 800px;
	margin-inline: auto;
}

.retrofit_parts_guide_flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: calc(100 / 1000 * 100%);
}

.retrofit_parts_guide_right{
	flex-shrink: 0;
	width: calc(216 / 800 * 100%);
}

.retrofit_parts_guide_left{
	width: 100%;
	display: flex;
	align-items: flex-end;
}

.retrofit_parts_guide_head{
	font-size: 20px;
	font-weight: 700;
}

.retrofit_parts_guide_text{
	margin-top: 44px;
	line-height: 1.875;
	letter-spacing: 0.05em;
}
.retrofit_parts01_02_area .c_sub_head,
.retrofit_parts03_04_area .c_sub_head,
.retrofit_parts05_06_area .c_sub_head{
	margin-top: var(--c_block_space);
}

.retrofit_parts01_02,
.retrofit_parts03_04,
.retrofit_parts05_06{
	justify-content: center;
	align-items: center;
	gap: 0 20px;
}

.retrofit_parts01_02 .retrofit_parts_left,
.retrofit_parts03_04 .retrofit_parts_left,
.retrofit_parts05_06 .retrofit_parts_left{
	width: 390px;
}

.retrofit_parts01_02 .retrofit_parts_right,
.retrofit_parts03_04 .retrofit_parts_right,
.retrofit_parts05_06 .retrofit_parts_right{
	width: 530px;
}

.retrofit_parts07_08_09_area .c_sub_head{
	margin-top: var(--c_block_space);
}

.retrofit_parts07_08_09_area .retrofit_parts_list{
	max-width: 830px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	display: grid;
	grid-template-columns: 350px 200px 200px;
	gap: 40px;
}

.retrofit_parts07_08_09_area .method_name{
	margin-top: 5px;
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
}

.retrofit_parts10{
	max-width: 588px;
	margin-inline: auto;
}

.retrofit_parts11 .c_sub_head{
	margin-top: var(--c_block_space);
}

.retrofit_parts11 .retrofit_parts_sub_head_detail{
	margin-top: var(--c_block_space);
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
}

.retrofit_parts11 .c_img_block_inner{
	max-width: 600px;
	margin-inline: auto;
}

.retrofit_parts11 .retrofit_parts_sub_detail_area{
	margin-top: var(--c_block_space);
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
	max-width: 850px;
	margin-inline: auto;
}

.retrofit_parts12_sec_head{
	margin-top: var(--c_contents_space);
}

.retrofit_parts12{
	max-width: 560px;
	margin-inline: auto;
}

.FRC_performance_section .performance01,
.FRC_performance_section .performance02{
	max-width: 486px;
	margin-inline: auto;
}

.FRC_performance_section .performance01 .c_sub_head,
.FRC_performance_section .performance02 .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
}

.FRC_performance_section .performance01 .c_img_block_inner,
.FRC_performance_section .performance02 .c_img_block_inner{
	margin-top: 10px;
}

.FRC_performance_section .performance_feature_list_head{
	margin-top: var(--c_sec_space);
}

.FRC_performance_section .performance_feature_list_head .c_sub_head{
	font-size: 25px;
	font-weight: 700;
	line-height: 30px;
	letter-spacing: 5px;
}

.FRC_performance_section .performance_feature_list_sub_head{
	margin-top: var(--c_block_space);
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
}

.FRC_performance_section .performance_feature_list {
	max-width: 863px;
}

.FRC_performance_section .performance_feature_list .feature_title{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
	display: flex;
	align-items: center;
}

.FRC_performance_section .performance_feature_list .feature_title .number_icon{
	font-size: 25px;
	line-height: 1;
}

.FRC_performance_section .performance_feature_list .feature_line{
	margin-top: var(--c_block_space);
	padding-left: 0;
}

.FRC_performance_section .performance_feature_list .feature_line::before{
	content: none;
}

.FRC_performance_section .performance03_04_area .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
}

.FRC_performance_section .performance03_04_area .performance_sub_head_detail{
	margin-top: var(--c_block_space);
	text-align: center;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.8px;
}

.FRC_performance_section .performance03_04{
	max-width: 760px;
	margin-inline: auto;
	justify-content: center;
	gap: 0 35px;
	margin-top: 0;
}

.FRC_performance_section .performance03_04 .c_flex_cols_img{
	margin-top: 10px;
}

.FRC_performance_section .performance05_06{
	max-width: 760px;
	margin-inline: auto;
	justify-content: center;
	gap: 0 35px;
	margin-top: 0;
}

.FRC_performance_section .performance05_06 .c_flex_cols_img{
	margin-top: 10px;
}

.FRC_finishing_section .FRC_finishing_sec_head_detail{
	margin-top: var(--c_block_space);
	max-width: 900px;
	margin-inline: auto;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.8px;
}

.FRC_finishing_section .c_sub_head{
	margin-top: var(--c_block_space);
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.8px;
}

.FRC_finishing_section .finishing_list{
	width: 100%;
}

.FRC_finishing_section .finishing_list .feature_img_area{
	width: 450px;
}

.FRC_finishing_section .finishing_list .feature_flex .feature_text_area{
	max-width: 380px;
}

.FRC_finishing_section .finishing_list .feature_flex .full_feature_text_area{
	max-width: none;
}

.FRC_finishing_section .finishing_list .feature_flex .feature_text_area .feature_text{
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
}

.finishing_feature_line_head{
	margin-top: var(--c_block_space);
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
	padding-left: 100px;
}

.finishing_feature_line_text{
	margin-top: var(--c_block_space);
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.7px;
	padding-left: 100px;
}


/*
------------------------------------
カパロール外断熱システム
------------------------------------
*/

.alsecco_feature_section .feature_img_area img{
	max-width: 214px;
}

.alsecco_feature_section .feature_img_area .feature_img_full{
	max-width: 100%;
}

.alsecco_feature_section .color_block{
	margin-top: 16px;
}

.alsecco_feature_section .color_head{
	line-height: 1.5;
	letter-spacing: 0.05em;
	margin-bottom: 6px;
}

.alsecco_method_section{

}

.alsecco_method_section .method_catch{
	margin-top: var(--c_block_space);
	font-size: 25px;
	text-align: center;
	line-height: 1.2;
	letter-spacing: 0.2em;
}

.alsecco_method_section .method_inner{
	margin-top: 32px;
	max-width: 800px;
	margin-inline: auto;
}

.alsecco_method_section .method_text{
	line-height: 1.875;
	letter-spacing: 0.2em;
}

.alsecco_method_section .method_flex{
	margin-top: 36px;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	gap:20px;
}

.alsecco_method_section .method_block{
	width:390px;
	max-width: 100%;
}

.alsecco_method_section .method_list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:20px 10px;
}

.alsecco_method_section .method_name{
	margin-top: 2px;
	font-size: 12px;
}

.alsecco_parts_section{

}

.alsecco_parts_section .guide_text{
	max-width: 800px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	line-height: 1.875;
	letter-spacing: 0.05em;
}
.alsecco_parts_section .parts_inner{
	max-width: 700px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.alsecco_parts_section .parts_list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:40px calc(64 / 700 * 100%);
}

.alsecco_parts_section .parts_pic{
	aspect-ratio: 1 / calc(157 / 180);
}

.alsecco_parts_section .parts_pic img{
	width:100%;
	height:100%;
	object-fit: cover;
}

.alsecco_parts_section .parts_text_area{
	margin-top: 8px;
}

.alsecco_parts_section .parts_head{
	font-size: 16px;
	line-height: 1.5;
	letter-spacing: 0.05em;
}

.alsecco_parts_section .parts_text{
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	margin-top: 6px;
}

.alsecco_parts_section .system_flex{
	margin-top: var(--c_contents_space);
	display: flex;
	justify-content: space-around;
	align-items: flex-start;
	gap:24px;
}

.alsecco_parts_section .system_left{
	width:350px;
}

.alsecco_parts_section .system_title{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.05em;
}

.alsecco_parts_section .system_guide{
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: 0.05em;
}

.alsecco_parts_section .system_pic{
	max-width: 274px;
	margin-top: 10px;
}

.alsecco_parts_section .system_right{
	width:334px;
}

.alsecco_parts_section .system_list li{
	position: relative;
	padding-left: 16px;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	counter-increment: cnt;
}

.alsecco_parts_section .system_list li::before{
	content: counter(cnt)".";
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	position: absolute;
	left:0;
	top:0;
}

.alsecco_parts_section .system_text{
	margin-top: 16px;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0.05em;
}

.alsecco_structure_section{

}

.alsecco_structure_section .structure{
	max-width: 700px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}


/*
------------------------------------
パッシブウォール［透湿タイプ］
------------------------------------
*/

.passive_guide_section{

}

.passive_guide_section .guide_img02{
	max-width: 560px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.passive_feature_section{

}

.passive_feature_section .feature_img_area img{
	max-width: 250px;
}

.passive_texture_section{
	
}

.passive_texture_section .texture_list{
	max-width: 900px;
	margin-inline: auto;
	margin-top: var(--c_contents_space);
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap:40px 0;
}

.passive_texture_section .texture_item{
	width:25%;
	padding-inline: 8px;
}

.passive_texture_section .texture_pic{
	width: 90%;
	max-width: 150px;
	margin-inline: auto;
}

.passive_texture_section .texture_name{
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: 0.2em;
	text-align: center;
}

.passive_example_section{

}

.passive_example_section .example_text{
	width: fit-content;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	letter-spacing: 0.2em;
	line-height: 1.5;
}

.passive_example_section .example{
	max-width: 750px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.passive_method_section .feature_img_area img{
	max-width: 250px;
}

/*
------------------------------------
そとだんかベメイト
------------------------------------
*/

.kabe_feature_section .kabe_list .feature_flex .full_feature_text_area{
	max-width: none;
}

.kabe_feature_section .kabe_list .feature_img_area{
	width: 282px;
}

.kabe_list_no_number .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
}

.kabe_list_no_number .feature_title{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
	display: flex;
	align-items: center;
}

.kabe_list_no_number .feature_title .number_icon{
	font-size: 25px;
	line-height: 1;
}

.kabe_list_no_number .feature_line{
	margin-top: var(--c_block_space);
}

.kabe_list_no_number .feature_line::before{
	content: none;
}

.kabe_list_no_number .feature_contents{
	margin-top: 0;
}

.kabe_list_no_number .feature_flex .full_feature_text_area{
	max-width: none;
}

.kabe_list_no_number .feature_img_area{
	width: 243px;
}

.kabe_method_example_head{
	margin-top: var(--c_contents_space);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.67;
	letter-spacing: 0.05em;
	text-align: center;
}

.kabe_method_example_contents{
	max-width: 940px;
	margin-inline: auto;
	margin-top: var(--c_contents_space);
}

.kabe_method_example_contents + .kabe_method_example_contents{
	margin-top: var(--c_block_space);
}

.kabe_method_example_kind{
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.8px;
	text-align: center;
	margin-bottom: 24px;
}

.kabe_method_example_list{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 32px calc(50 / 940 * 100%);
	flex-wrap: wrap;
}

.kabe_method_example_list:has(.kabe_method_example_item:nth-child(3)){
	justify-content: flex-start;
}

.kabe_method_example_item{
	width: calc(280 / 940 * 100%);
}

.kabe_method_example_sub_detail_area{
	margin-top: 4px;
	text-align: center;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.8px;
}

.kabe_fit_example_head{
	margin-top: var(--c_contents_space);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.67;
	letter-spacing: 0.05em;
	text-align: center;
}

.kabe_fit_example_sub_head{
	margin-top: var(--c_block_space);
	max-width: 760px;
	margin-inline: auto;
}

.kabe_fit_example01{
	max-width: 728px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.kabe_fit_example01 .c_img_block_inner{
	margin-top: 20px;
}

.kabe_fit_example01_02,
.kabe_fit_example03_04,
.kabe_fit_example05_06,
.kabe_fit_example07_08{
	max-width: 755px;
	margin-inline: auto;
	justify-content: center;
	gap: 0 45px;
	align-items: stretch;
}

.kabe_fit_example01_02 .kabe_fit_example_left,
.kabe_fit_example01_02 .kabe_fit_example_right,
.kabe_fit_example03_04 .kabe_fit_example_left,
.kabe_fit_example03_04 .kabe_fit_example_right,
.kabe_fit_example05_06 .kabe_fit_example_left,
.kabe_fit_example05_06 .kabe_fit_example_right,
.kabe_fit_example07_08 .kabe_fit_example_left,
.kabe_fit_example07_08 .kabe_fit_example_right{
	width: 355px;
	display: flex;
	flex-direction: column;
}

.kabe_fit_example01_02 .kabe_fit_example_left .c_flex_cols_img,
.kabe_fit_example01_02 .kabe_fit_example_right .c_flex_cols_img,
.kabe_fit_example03_04 .kabe_fit_example_left .c_flex_cols_img,
.kabe_fit_example03_04 .kabe_fit_example_right .c_flex_cols_img,
.kabe_fit_example05_06 .kabe_fit_example_left .c_flex_cols_img,
.kabe_fit_example05_06 .kabe_fit_example_right .c_flex_cols_img,
.kabe_fit_example07_08 .kabe_fit_example_left .c_flex_cols_img,
.kabe_fit_example07_08 .kabe_fit_example_right .c_flex_cols_img{
	margin-top: 20px;
	flex: 1;
	display: flex;
	align-items: center;
}

.kabe_fit_example_sub_head_detail{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
	text-align: center;
}

.kabe_performance_area .c_sub_head{
	margin-top: var(--c_block_space);
}

.kabe_performance_area .performance_sub_head_detail{
	margin-top: var(--c_block_space);
	text-align: center;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0.8px;
}

.kabe_performance01_02,
.kabe_performance03_04{
	max-width: 760px;
	margin-inline: auto;
	justify-content: center;
	gap: 0 35px;
	margin-top: 0;
}

.kabe_performance01_02 .c_flex_cols_img,
.kabe_performance03_04 .c_flex_cols_img{
	margin-top: 10px;
}

.kabe_structure_section .structure01{
	max-width: 464px;
	margin-inline: auto;
}

.kabe_structure_section .structure02{
	max-width: 855px;
	margin-inline: auto;
}

.kabe_structure_section .structure02 .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.kabe_structure_section .structure02 .c_img_block_inner{
	margin-top: 10px;
}

.kabe_structure_section .structure02 .structure_sub_detail_area{
	margin-top: 10px;
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
}

.kabe_structure_section .structure03{
	max-width: 855px;
	margin-inline: auto;
}

.kabe_structure_section .structure03 .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.kabe_structure_section .structure03 .c_img_block_inner{
	margin-top: 10px;
}

.kabe_structure_section .structure03 .structure_sub_detail_area{
	margin-top: 10px;
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
}

.kabe_structure_section .structure04{
	max-width: 776px;
	margin-inline: auto;
}

.kabe_structure_section .structure04 .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.kabe_structure_section .structure04 .c_img_block_inner{
	margin-top: 10px;
}

.kabe_structure_section .structure05{
	max-width: 776px;
	margin-inline: auto;
}

.kabe_structure_section .structure05 .c_sub_head{
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
}

.kabe_structure_section .structure05 .c_img_block_inner{
	margin-top: 10px;
}



/*
------------------------------------
HT外断熱システム工法
------------------------------------
*/

.HT_product_guide_section .guide02{
	max-width: 417px;
	margin-inline: auto;
}

/* -------- ページ内共通 -------- */
.HT_product_example_section .example_contents_2column{
	max-width: 610px;
	margin-inline: auto;
}

.HT_product_example_section .example_contents_2column .example_kind{
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
}

.HT_product_example_section .example_contents_2column .example_list{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px calc(50 / 940 * 100%);
}

.HT_product_example_section .example_contents_2column .example_item{
	width: auto;
}
/* ----------------------------- */

.HT_product_example_section .example_contents_01 .example_sub_title_area{
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
	margin-top: 15px;
}

.HT_product_example_section .example_contents_01 .example_list{
	align-items: flex-start;
}

.HT_product_example_section .example02,
.HT_product_example_section .example03,
.HT_product_example_section .example04{
	max-width: 672px;
	margin-inline: auto;
}

.HT_product_example_section .example03,
.HT_product_example_section .example04{
	margin-top: 12px;
}

.HT_example_contents_05 .example_title{
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 3.6px;
}

.HT_example_contents_05 .example_sub_title{
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	margin-top: 5px;
}

.HT_example_contents_05 .example_kind{
	text-align: left;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	max-width: 662px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.HT_product_example_section .example07{
	max-width: 800px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.HT_example_contents_08 .example_title{
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 3.6px;
}

.HT_example_contents_08 .example_sub_title{
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	margin-top: 5px;
}

.HT_example_contents_08 .example_kind{
	text-align: left;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	max-width: 662px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.example_contents_09 .kabe_method_example_sub_detail_area{
	text-align: left;
	font-size: 16px;
	font-weight: 400;
}

.HT_example_contents_11 .example_title{
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 3.6px;
}

.HT_example_contents_11 .example_sub_title{
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	margin-top: 5px;
}

.HT_example_contents_11 .example_kind{
	text-align: left;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	max-width: 662px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.HT_example_12_head{
	margin-top: var(--c_contents_space);
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 3.6px;
}

.HT_example_12 .c_feature_list{
	width: 100%;
	max-width: 980px;
}

.HT_example_12 .feature_flex .feature_text_area{
	width: auto;
	flex: 1;
}

.HT_example_contents_13 .example_sub_detail_area{
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-align: center;
	margin-top: 28px;
}

.HT_product_example_section .example14{
	max-width: 781px;
	margin-inline: auto;
}


.HT_product_example_section .example15_flex{
	margin-top: var(--c_contents_space);
	display: flex;
	justify-content: space-between;
	gap: calc(60 / 1000 * 100%);
}

.HT_product_example_section .example15_left{
	flex-shrink: 0;
	width: calc(500 / 1000 * 100%);
}

.HT_product_example_section .example15_right{
	width: 100%;
	display: flex;
	align-items: center;
}

.HT_product_example_section .example15_head{
	font-size: 20px;
	font-weight: 700;
}

.HT_product_example_section .example15_text{
	margin-top: 44px;
	line-height: 1.875;
	letter-spacing: 0.05em;
}

.HT_product_example_section .example16{
	max-width: 773px;
	margin-inline: auto;
}

.HT_product_example_section .example_sub_detail_area{
	margin-top: var(--c_block_space);
	font-size: 16px;
	font-weight: 400;
}

.HT_product_example_section .example17{
	max-width: 745px;
	margin-inline: auto;
}

.HT_product_example_section .example17_sub_title{
	font-size: 16px;
	font-weight: 400;
}

.HT_product_example_section .c_img_block_inner{
	margin-top: 0;
}

.HT_product_example_section .example_sub_detail_area{
	font-size: 16px;
	font-weight: 400;
	margin-top: 20px;
}

/* 動画埋め込み */
.HT_product_example_section .example18_video-wrapper{
	margin-top: var(--c_contents_space);
	max-width: 751px;
	margin-inline: auto;
}

.HT_product_example_section .example18_sub_title{
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
}

.HT_product_example_section .example18_video-wrapper video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
	margin-top: 25px;
	cursor: pointer;
}



/*
------------------------------------
ＬＬＨ外断熱通気層システム
------------------------------------
*/

.llh_guide_section{

}

.llh_guide_section .guide_img02{
	max-width: 636px;
	margin-inline: auto;
	margin-top: 40px;
}

.llh_feature_section{

}

.llh_feature_section .feature_img_area img{
	max-width: 306px;
}

.llh_method_section{

}

.llh_method_section .guide_text{
	max-width: 780px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
	line-height: 1.87;
	letter-spacing: 0.05em;
	font-size: 16px;
}

.llh_method_section .method_list{
	max-width: 640px;
	margin-inline: auto;
	margin-top: var(--c_contents_space);
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap:var(--c_block_space);
}

.llh_method_section .method_line{
	display: flex;
	align-items: center;
	gap:50px;
	counter-increment: cnt;
}

.llh_method_section .method_line::before{
	content: counter(cnt);
	display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    border: 1px solid var(--base_black);
    font-size: 25px;
    line-height: 1;
    padding-bottom: 4px;
    flex-shrink: 0;
}

.llh_method_section .method_contents{
	width:100%;
}

.llh_method_section .method_flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap:24px;
}

.llh_method_section .method_title{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.05em;
}

.llh_method_section .method_img{
	flex-shrink: 0;
	width:250px;
}

.llh_method_section .figure_area{
	margin-top: var(--c_contents_space);
}

.llh_method_section .figure_head{
	font-size: 18px;
	text-align: center;
	line-height: 1.67;
	letter-spacing: 0.2em;
}

.llh_method_section .figure_list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: flex-start;
	gap:40px 0;
	max-width: 840px;
	margin-inline: auto;
	margin-top: var(--c_block_space);
}

.llh_method_section .figure_item{
	padding-inline: 8px;
}

.llh_method_section .figure_title{
	display: flex;
	justify-content: center;
	font-size: 14px;
	line-height: 1.5;
	margin-bottom: 4px;
}

.llh_method_section .figure_pic{
	width:90%;
	max-width: 196px;
	margin-inline: auto;
}

.llh_tile_section{

}

.llh_tile_section .feature_area{
	margin-top: var(--c_contents_space);
}

.llh_tile_section .feature_head{
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0.2em;
}

.llh_tile_section .feature_list{
	width: fit-content;
	margin-inline: auto;
	margin-top: 32px;
}

.llh_tile_section .feature_line{
	position: relative;
	font-size: 14px;
	line-height: 2.14;
	letter-spacing: 0.2em;
	padding-left: 18px;
}

.llh_tile_section .feature_line .feature_num{
	position: absolute;
	top:0;
	left:0;
}

.llh_tile_section .process_area{
	margin-top: var(--c_contents_space);
}

.llh_tile_section .process_head{
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0.2em;
}

.llh_tile_section .process_list{
	max-width: 860px;
	margin-inline: auto;
	margin-top: 32px;
	display: grid;
	align-items: flex-end;
	grid-template-columns: repeat(4, 1fr);
	gap:24px 0;
}

.llh_tile_section .process_item{
	padding-inline: 8px;
}

.llh_tile_section .process_title{
	font-size: 14px;
	line-height: 1.5;
	display: flex;
	justify-content: center;
}

.llh_tile_section .process_pic{
	width:90%;
	max-width: 140px;
	margin-inline: auto;
	margin-top: 6px;
}

.llh_tile_section .put_flex{
	max-width: 825px;
	margin-inline: auto;
	margin-top: var(--c_contents_space);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.llh_tile_section .finish_area{
	margin-top: var(--c_contents_space);
}

.llh_tile_section .finish_head{
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0.2em;
}

.llh_tile_section .finish_list{
	max-width: 900px;
	margin-inline: auto;
	margin-top: 32px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:24px 0;
}

.llh_tile_section .finish_item{
	padding-inline: 8px;
}

.llh_tile_section .finish_title{
	font-size: 14px;
	line-height: 1.5;
	display: flex;
	justify-content: center;
}

.llh_tile_section .finish_pic{
	width:90%;
	max-width: 157px;
	margin-inline: auto;
	margin-top: 8px;
}

/*
------------------------------------
FAQ
------------------------------------
*/

/*
------------------------------------
FAQ
------------------------------------
*/

.faq_list_section{

}

.faq_list_section .sec_head{
	font-size: 32px;
	text-align: center;
	font-weight: 700;
}

.faq_list_section .guide_text{
	margin-top: 24px;
	width: fit-content;
	margin-inline: auto;
	font-size: 14px;
	font-weight: 700;
}

.faq_list_section .faq_list{
	max-width: 700px;
	margin-inline: auto;
	margin-top: 64px;
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap:32px;
}

.faq_list_section .faq_question{
	cursor: pointer;
	position: relative;
	padding-left: 40px;
	padding-right: 32px;
	
}

.faq_list_section .faq_question::before{
	content:'Q';
	font-size: 24px;
	font-weight: 700;
	color:var(--base_blue);
	position: absolute;
	left:0;
	top:-6px;
}

.faq_list_section .faq_question::after{
	content:'';
	display: block;
	width:16px;
	aspect-ratio: 1 / calc(9 / 16);
	background-image: url('../img/common/icon_faq_angle.svg');
	position: absolute;
	right:0;
	top:10px;
}

.faq_list_section .faq_question.active::after{
	transform: rotateZ(180deg);
}

.faq_list_section .faq_question_text{
	padding-bottom: 6px;
	border-bottom:2px solid var(--base_blue);
	font-size: 16px;
	font-weight: 700;
	padding-inline: 8px;
}

.faq_list_section .faq_answer{
	padding-top: 24px;
	padding-left: 40px;
	padding-right: 32px;
	display: none;
}

.faq_list_section .faq_answer_text{
	padding-left: 40px;
	position: relative;
	line-height: 1.75;
}

.faq_list_section .faq_answer_text::before{
	content:'A';
	font-size: 24px;
	font-weight: 700;
	color:var(--base_blue);
	position: absolute;
	left:0;
	top:-6px;
}

.faq_list_section .faq_answer_text a{
	border-bottom:1px solid;
}


.faq_list_section table{
	margin-top: 16px;
	border-collapse:collapse ;
}


.faq_list_section table th,
.faq_list_section table td{
	text-align: center;
	padding:4px 16px;
	border:1px solid #303030;
}
.faq_list_section table th{
	color:#fff;
	background-color: var(--base_blue);
}