@charset "utf-8";

.column_target{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:30px;
	margin-top:25px;
}
.column_target div{
	padding:30px 30px 25px;
	border:2px solid #B6DADA;
	border-radius:8px;
}
.column_target h4{
	display:flex;
	align-items:center;
	min-height:90px;
	padding:10px 0 10px 110px;
	margin:0;
	background:no-repeat center left/90px;
	color:#0B8083;
	font-size:2.4rem;
	letter-spacing:1.44px;
	line-height:3.5rem;
}
.column_target div:first-child h4{background-image:url(/sangaku/img/about/icon_1_1.png);}
.column_target div:nth-child(2) h4{background-image:url(/sangaku/img/about/icon_1_2.png);}
.column_target ul{
	padding-top:20px;
	margin:30px 0 0;
	border-top:2px solid #B6DADA;
}
.column_target li{
	letter-spacing:0.48px;
	line-height:2.8rem;
}

.about_list{
	display:grid;
	grid-template-columns:1fr 1fr 1fr;
	gap:0 70px;
	padding:0;
	margin-top:30px;
}
.about_list li{
	display:flex;
	flex-direction:column;
	position:relative;
}
.about_list li:not(:last-child)::after{
	content:'';
	position:absolute;
	top:0;
	right:-36px;
	width:1px;
	height:100%;
	background:#EBEBEB;
}
.about_list h3{
	margin:25px 0 15px;
	font-size:2rem;
	font-weight:bold;
	letter-spacing:0.6px;
	line-height:2.9rem;
	text-align:center;
}
.about_list p{
	margin:0;
	font-size:1.5rem;
	letter-spacing:0.9px;
	line-height:2.4rem;
	text-align:center;
}
.about_list p:last-child{order:-1;}

.flow_list{
	padding:0;
	margin-top:25px;
}
.flow_list li{
	list-style:none;
	position:relative;
	margin:0;
}
.flow_list li + li{
	margin-top:75px;
	border:2px solid #0B8083;
	border-radius:8px;
}
.flow_list li + li::before{
	content:'';
	position:absolute;
	top:-75px;
	left:0;
	width:100%;
	height:75px;
	background:url(/sangaku/img/common/arrow_flow.svg) no-repeat center;
}
.flow_list li:nth-child(n+3){
	padding:30px 20px;
	color:#0B8083;
	font-size:2.4rem;
	font-weight:bold;
	letter-spacing:1.44px;
	line-height:3.5rem;
	text-align:center;
}
.flow_list .column_3{margin:0;}
.flow_list .column_3 div{
	padding:30px 25px 25px;
	border:2px solid #0B8083;
	border-radius:8px;
}
.flow_list .column_3 dt{
	padding:105px 0 15px;
	margin-bottom:15px;
	background:no-repeat top center/90px;
	border-bottom:2px solid #B6DADA;
	color:#0B8083;
	font-size:2rem;
	font-weight:bold;
	letter-spacing:1.2px;
	line-height:2.9rem;
	text-align:center;
}
.flow_list .column_3 div:first-child dt{background-image:url(/sangaku/img/about/icon_2_1.png);}
.flow_list .column_3 div:nth-child(2) dt{background-image:url(/sangaku/img/about/icon_2_2.png);}
.flow_list .column_3 div:nth-child(3) dt{background-image:url(/sangaku/img/about/icon_2_3.png);}
.flow_list .column_3 dd{
	letter-spacing:0.48px;
	line-height:2.8rem;
}
.flow_list .column_1{
	position:relative;
	padding:35px 20px;
}
.flow_list .column_1::before{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	left:40px;
	width:240px;
	height:180px;
	margin:auto;
	background:url(/sangaku/img/about/pic_1_1.png) no-repeat center/cover;
}
.flow_list .column_1::after{
	content:'';
	position:absolute;
	top:0;
	right:45px;
	bottom:0;
	width:240px;
	height:180px;
	margin:auto;
	background:url(/sangaku/img/about/pic_1_2.png) no-repeat center/cover;
}
.flow_list .column_1 dt{
	position:relative;
	padding-bottom:15px;
	margin-bottom:20px;
	color:#0B8083;
	font-size:2.4rem;
	font-weight:bold;
	letter-spacing:1.44px;
	line-height:3.5rem;
	text-align:center;
}
.flow_list .column_1 dt::after{
	content:'';
	position:absolute;
	right:0;
	bottom:0;
	left:0;
	width:35px;
	height:3px;
	margin:auto;
	background:#0B8083;
}
.flow_list .column_1 dd{
	font-weight:500;
	letter-spacing:0.48px;
	line-height:3.2rem;
	text-align:center;
}
.flow_list .column_1 dd span{color:#0B8083;}

.bg_box{
	position:relative;
	padding:1px 0 100px;
	margin-top:100px;
}
.bg_box::before{
	content:'';
	position:absolute;
	z-index:-1;
	top:0;
	left:calc(50% - var(--vw_50));
	width:var(--vw_100);
	height:100%;
	background:#F1F9FB;
}
.column_data{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:30px;
	margin-top:25px;
}
.column_data div{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	padding:25px 20px 30px;
	background:#fff;
	border-radius:8px;
}
.column_data dt{
	margin-bottom:10px;
	color:#0B8083;
	font-size:2.4rem;
	font-weight:bold;
	letter-spacing:1.44px;
	line-height:3.5rem;
	text-align:center;
}
.column_data dt span{
	display:block;
	margin-top:5px;
	color:#333;
	font-size:1.4rem;
	letter-spacing:0.42px;
	line-height:2rem;
}
.column_data dd{
	font-weight:bold;
	letter-spacing:0.48px;
}
.column_data dd span{
	position:relative;
	top:2px;
	margin:0 5px;
	color:#0B8083;
	font-family:var(--font_poppins);
	font-size:6.4rem;
	letter-spacing:0;
	line-height:6.4rem;
}

.bg_white{
	padding:60px 50px 35px;
	margin-top:25px;
	background:#fff;
	border-radius:8px;
}
.bg_white img{
	width:100%;
	max-width:960px;
	margin:auto;
}
.img_txt{
	display:flex;
	gap:30px;
}
.img_txt > p{
	flex-shrink:0;
	width:345px;
	margin:0;
}
.img_txt div{width:100%;}

.about_cta{
	margin:100px 0 50px;
	border-radius:8px;
	overflow:hidden;
}
.about_cta_top{
	display:grid;
	grid-template-columns:470px 1fr;
	align-items:center;
	gap:60px;
	padding:30px 50px;
	background:#F1F9FB;
}
.about_cta_top h2{margin:0 0 5px;}
.about_cta_top h2 span{color:#0B8083;}
.about_cta_top p{margin:0;}
.about_cta_top .bg_white{padding:15px 30px;}
.about_cta_top ul{margin:0;}
.about_cta_bottom{
	padding:45px 20px 50px;
	background:#0B8083;
}
.about_cta_bottom h3{
	margin:0 0 25px;
	color:#fff;
	text-align:center;
}
.about_cta_bottom .cta_list{
	max-width:780px;
	margin:auto;
}

.link_btn{min-width:280px;}
.cta_area{display:none;}

@media screen and (max-width:1080px){
.flow_list .column_1::before{left:0;}
.flow_list .column_1::after{right:0;}
}

@media screen and (max-width:1024px){
.column_target h4{
	min-height:70px;
	padding:12px 0 11px 83px;
	background:no-repeat center left/70px;
	font-size:2.1rem;
	letter-spacing:1.26px;
	line-height:3.5rem;
}
.about_list{gap:0 40px;}
.about_list li:not(:last-child)::after{right:-21px;}
.bg_white{padding:50px 30px 30px;}

.flow_list .column_1{
	position:relative;
}
.flow_list .column_1::before,.flow_list .column_1::after{z-index:-1;}

.about_cta_top{grid-template-columns:380px 1fr;gap:20px;padding:30px;}
.about_list h3{font-size:1.8rem;letter-spacing:0;}
.about_list p{font-size:1.4rem;line-height:1.5;}

.flow_list .column_3 dt{font-size:1.8rem;line-height:1.5;padding:70px 0 15px;background-size:60px;}
.flow_list .column_3 dd{
	line-height:1.5;
}
.flow_list .column_1 dd{text-shadow:0 0 10px rgba(255,255,255,1),0 0 10px rgba(255,255,255,1),0 0 10px rgba(255,255,255,1);}
.flow_list .column_1 dt,.flow_list li:nth-child(n+3){font-size:2.2rem;line-height:1.5;}
.column_data dt{font-size:2.2rem;}

}


@media screen and (max-width:767px){
.column_target{
	display:block;
}
.column_target div{
	padding:16px 20px 18px;
	margin-top:16px;
}
.column_target h4{
	min-height:70px;
	padding:12px 0 11px 83px;
	background:no-repeat center left/70px;
	font-size:2.1rem;
	letter-spacing:1.26px;
	line-height:3.5rem;
}
.column_target ul{
	padding-top:13px;
	margin:18px 0 0;
}
.column_target li{
	letter-spacing:0.42px;
	line-height:2.4rem;
	margin:0;
}

.about_list{
	display:block;
	margin:13px 0 34px;
}
.about_list li{
	margin-bottom:40px;
	display:block;
	min-height:170px;
	padding:0 0 0 310px;
}
.about_list li:not(:last-child)::after{
	width:100%;
	height:1px;
	left:0;
	top:auto;
	bottom:-21px;
}
.about_list img{
	position:absolute;
	top:0;
	left:0;
	width:290px;
	height:170px;
	border-radius:8px;
	overflow:hidden;
}
.about_list h3,.about_list p{text-align:left;}

.about_list h3{
	margin:5px 0;
	font-size:1.7rem;
	letter-spacing:0.51px;
	line-height:2.9rem;
}
.about_list p{
	font-size:1.4rem;
	letter-spacing:0.84px;
	line-height:2.2rem;
}

.flow_list{
	padding:0;
	margin-top:20px;
}
.flow_list li{
	list-style:none;
	position:relative;
	margin:0;
}
.flow_list li + li{
	margin-top:65px;
}
.flow_list li + li::before{
	top:-65px;
	height:65px;
	background:url(/sangaku/img/common/arrow_flow.svg) no-repeat center;
}
.flow_list li:nth-child(n+3){
	padding:14px 20px;
	font-size:1.7rem;
	letter-spacing:1.02px;
	line-height:3.2rem;
}
.flow_list .column_3{margin:0;gap:10px;}
.flow_list .column_3 div{
	padding:20px 20px 18px;
}
.flow_list .column_3 dt{
	padding:9px 0 23px 59px;
	margin-bottom:9px;
	background:no-repeat top left/50px;
	font-size:1.7rem;
	letter-spacing:1.02px;
	line-height:2.6rem;
	text-align:left;
}
.flow_list .column_3 dd{
	letter-spacing:0.48px;
	line-height:2.5rem;
}
.flow_list .column_1{
	position:relative;
	padding:22px 20px 20px;
}
.flow_list .column_1::before{
	top:auto;
	bottom:10px;
	left:15px;
	width:133px;
	height:100px;
	margin:auto;
	background:url(/sangaku/img/about/pic_1_1.png) no-repeat center/cover;
}
.flow_list .column_1::after{
	top:auto;
	right:15px;
	bottom:10px;
	width:133px;
	height:100px;
	margin:auto;
	background:url(/sangaku/img/about/pic_1_2.png) no-repeat center/cover;
}
.flow_list .column_1 dt{
	padding-bottom:10px;
	margin-bottom:16px;
	font-size:1.7rem;
	letter-spacing:1.02px;
	line-height:3.5rem;
}
.flow_list .column_1 dt::after{
	width:34px;
}
.flow_list .column_1 dd{
	letter-spacing:0.42px;
	line-height:2.8rem;
}

.bg_box{
	padding:1px 0 60px;
	margin-top:45px;
}
.bg_box h2{margin-bottom:28px;}
.bg_box p{margin-bottom:11px;}
.column_data{
	display:block;
	margin-top:12px;
}
.column_data div{
	padding:16px 20px 29px;
	margin-top:16px;
}
.column_data dt{
	font-size:2.1rem;
	letter-spacing:1.26px;
	line-height:3.5rem;
	margin-bottom:16px;
}
.column_data dt span{
	margin-top:2px;
}
.column_data dd span{
	margin:0 5px;
	font-size:5rem;
	line-height:6rem;
}

.bg_white{
	padding:20px 20px 22px;
}
.bg_white p:has(img){margin:0 -20px 20px;}
.img_txt{
	display:block;
}
.img_txt > p{
	width:100%;
	max-width:345px;
	margin:0 auto 20px;
}
.img_txt div{width:auto;}

.about_cta{
	margin:60px 0 35px;
}
.about_cta_top{
	display:block;
	padding:36px 20px;
}
.about_cta_top h2{margin:0 0 21px;text-align:center;}
.about_cta_top h2 span{display:block;}
.about_cta_top .bg_white{padding:17px 18px;margin:14px 0 16px;}
.about_cta_top ul li{line-height:2.2rem;margin-bottom:1px;}
.about_cta_bottom{
	padding:30px 20px 35px;
}
.about_cta_bottom h3{
	margin:0 0 20px;
}

.link_btn{min-width:240px;max-width:240px;display:block;margin:0 auto;}


.flow_list .column_1::before,.flow_list .column_1::after{display:none;}


}

@media screen and (max-width:500px){
.about_list li{
	margin-bottom:30px;
	display:flex;
	min-height:170px;
	padding:0;
}
.about_list li:not(:last-child)::after{display:none;}
.about_list img{position:relative;left:auto;top:auto;width:100%;height:auto;}
.about_list h3,.about_list p{text-align:center;}

}