@charset "utf-8";

.mb30 {
	margin-bottom:3rem;
}
.mb15 {
	margin-bottom:1.5rem;
}
#ctt h4 {
	font-size:4rem;
	margin-bottom:4rem;
}
.intro {
	background:#e6f8fa;
	text-align:center;
	padding:7rem 5rem;
	border-radius:3rem;
	margin-bottom:5rem;
}

.intro .imgbox  {
	margin:0 auto;
	max-width:600px;
}


.intro .imgbox img {
	border-radius: 170px;
}

.intro.type01 {
	background:#e6f8fa;
}

.intro.type01 > p {
	font-size:3.4rem;
	font-weight:bold;
	margin:5rem 0;
}

.intro > p span{
	color:#01a6b5;
}
.intro .con {
	display:flex;
	justify-content:center;
	gap:2rem;
}
.intro .con > div {
	max-width:375px;	
	width:100%;
	background:#fff;
	padding:4rem 2rem;
	border-radius:2rem;
	border:1px solid #01a6b5;
}
.intro .con > div .tit{
	font-weight:bold;
	font-size:2.4rem;
	color:#01a6b5;
	margin-bottom:2rem;
}
.intro .con > div .txt{
	font-size:2.2rem;
	line-height:1.5;
	font-weight:bold;
}

.intro .con > div .txt span {
	font-size:1.8rem;
	color:#333;
	font-weight:normal;
}

.intro .con .more .txt {
	font-size:1.8rem;
	color:#333;
	font-weight:normal;
}
.type01 .con .more .txt span {
	color:#01a6b5;
}

.type01_tit {
	color:#01a6b5;
}

.intro.type01 > p span {
	color:#01a6b5;
}

/* type02 */

.type02_tit {
	color:#e35712;
}

.intro.type02 > p span{
	color:#e35712;
}
.intro.type02 .con > div .tit{
	color:#e35712;
}
.intro.type02 {
	background:#f8f1ed;
}
.intro.type02 .con > div {
	border:1px solid #e35712;
}

.type02 .con .more .txt span {
	color:#e35712;
}

.intro.type02 > p {
	font-size:3.4rem;
	font-weight:bold;
	margin-bottom:5rem ;
}

/* type03 */

.type03_tit {
	color:#86b512;
}

.intro.type03 > p span{
	color:#86b512;
}
.intro.type03 .con > div .tit{
	color:#86b512;
}
.intro.type03 {
	background:#f7fcea;
}

.intro.type03 > p {
	font-size:3.4rem;
	font-weight:bold;
	margin-bottom:5rem ;
}

.intro.type03 .con > div {
	border:1px solid #86b512;
}

#ctt h5 {
	font-size:3rem;
	margin-bottom:4rem;
}
.gallery {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:4rem;
	margin-bottom:8rem;
}

.gallery .conbox p {
	margin-top:30px;
	text-align:center;
	font-size:2rem;
	color:#333;s
}

.gallery img {
	width:100%;
	border-radius:30px;
}

@media all and (max-width:960px){
	.intro .con {
		display:block;
	}
	.intro .con > div {
		max-width:100%;
		margin-bottom:1rem;
	}
	.intro .con > div:last-child {
		margin-bottom:0;
	}

	.gallery  {
		grid-template-columns: none;
		grid-template-rows: 1fr 1fr;
	}
}