@charset "utf-8";

/* ----------------------------- mobile ------------------------------- */
.mainImg {
	background-image: url(../images/information/main_img.jpg);
}
#main .innerBox {
	padding-top: 70px;
	margin-bottom: 155px;
}
#main .point {
	position: relative;
}
#main .point::before {
	width: 190px;  
	height: 270px;
	background-image: -webkit-linear-gradient( 90deg, rgb(250,112,154) 0%, rgb(252,169,109) 53%, rgb(254,225,64) 100%);
	opacity: 0.4;
	border-radius: 50px;
	position: absolute;  
	top: 0;
	right: -65px;  
	content: ""; 
}
#main .point::after {
	width: 215px;  
	height: 71px;
	border-radius: 50px;
	background-image: -webkit-linear-gradient( 180deg, #96fbc4 0%, #f9f586 100%);
	opacity: 0.4;
	position: absolute;  
	bottom: -14px;
	right: -35px;  
	content: ""; 
}
#main .imgBox {
	margin-bottom: 177px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	position: relative;
}
#main .imgBox:last-child {
	margin-bottom: 0;
}
#main .imgBox .photoBox {
	margin: 3px 75px 0 0;
	width: calc(50% - 156px);
}
#main .imgBox .photoBox img {
	width: 100%;
	border-radius: 0 160px 0 0;
}
#main .imgBox .textBox {
	flex: 1;
	padding: 0 20px 0 0;
	position: relative;
}
#main .imgBox .textBox:after {
	width: calc(100vw - 344px);  
	background-color: #EFF1F2;
	border-radius: 160px 0 0 0;
	position: absolute;  
	top: -89px;
	right: 0;  
	bottom: 0;
	z-index: -1;
	content: ""; 
}
#main .imgBox .textBox .subBox {
	padding-bottom: 79px;
	max-width: 600px;
	position: relative;
	z-index: 1;
}
#main .imgBox p {
	letter-spacing: 0.05em;
	font-weight: 300;
	line-height: 1.75;
	text-align: justify;
}
#main .imgBox02 {
	padding-bottom: 10px;
	position: relative;
}
#main .imgBox02:after {
	width: 105px;  
	height: 179px;
	background-image: -webkit-linear-gradient( 90deg, rgb(196,113,245) 0%, rgb(223,113,225) 49%, rgb(250,113,205) 100%);
	opacity: 0.2;
	border-radius: 50px;
	position: absolute;  
	top: -131px;
	left: -54px;  
	content: ""; 
}
#main .imgBox02 .photoBox {
	order: 2;
	margin-right: 0;
	margin-left: 150px;
	width: calc(50% - 138px);
}
#main .imgBox02 .photoBox img {
	border-radius: 160px 0 0 0;
}
#main .imgBox02 .textBox {
	display: flex;
	justify-content: flex-end;
}
#main .imgBox02 .textBox .subBox {
	max-width: 485px;
}
#main .imgBox02 .textBox::after {
	right: auto;
	left: 0;
	border-radius: 0 160px 0 0;
}
#main .gallery {
	padding: 113px 0 157px;
	position: relative;
	background-color: #EDF1F3;
}
#main .facilitySec {
	padding: 155px 0 137px;
	position: relative;
}
#main .facilitySec .content {
	max-width: 940px;
}
#main .facilitySec:after {
	width: 176px;  
	height: 198px;
	background-image: -webkit-linear-gradient( 90deg, rgb(32,226,215) 0%, rgb(141,240,190) 49%, rgb(249,254,165) 100%);
	border-radius: 42px;
	opacity: 0.4;
	position: absolute;  
	top: 158px;
	left: -88px;  
	content: ""; 
}
#main .access {
	position: relative;
}
#main .access:after {
	width: 105px;  
	height: 255px;
	border-radius: 50px;
	background-image: -webkit-linear-gradient( 90deg, rgb(250,113,205) 0%, rgb(182,179,210) 51%, rgb(113,245,215) 100%);
	opacity: 0.2;
	position: absolute;  
	top: -3px;
	right: -51px;  
	content: ""; 
}
#main .access .map {
	margin: -25px 0 120px;
	height: 549px;
}
#main .access .map iframe {
	border: none;
	width: 100%;
	height: 100%;
}
#main .access .list {
	margin-bottom: 176px;
	display: flex;
	flex-wrap: wrap;
}
#main .access .list li {
	text-align: center;
	padding: 0 30px;
}
#main .access .list li:first-child {
	padding-left: 0;
	flex: 1;
}
#main .access .list li:last-child {
	padding-right: 0;
	flex: 1;
}
#main .access .list li:first-child p {
	text-align: left;
}
#main .access .list li:last-child p {
	text-align: right;
}
#main .access .list li p {
	line-height: 1.75;
	font-weight: 300;
	letter-spacing: 0.05em;
}
#main .access .list li .ttl {
	font-size: 28px;
	margin-bottom: 15px;
	color: #368c9b;
}
#main .access .list li .photo {
	min-height: 75px;
	margin: -8px 0 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
#main .access .list li:nth-child(3n-1) {
	width: 38%;
	border-left: 1px solid #368C9B;
	border-right: 1px solid #368C9B;
}
#main .access .list li:first-child .photo {
	padding-right: 65px;
}
#main .access .list li:last-child .photo {
	padding-left: 68px;
}


@media only screen and (max-width: 768px) {
	#main .point::before { 
		width: 190px;
		height: 166px;
		top: -22px;
		right: -149px;
		border-radius: 45px;
	}
	#main .innerBox {
		margin-bottom: 80px;
		padding-top: 12px;
	}
	#main .imgBox {
		margin-bottom: 62px;
		display: block;
	}
	#main .imgBox .photoBox {
		width: auto;
		margin: 0 20px 40px 0; 
	}
	#main .imgBox .textBox::after { 
		display: none !important;
	}
	#main .imgBox .textBox {
		padding: 0 19px;
		display: block !important;
	}
	#main .imgBox .textBox .subBox {
		padding-bottom: 0;
		max-width: inherit !important;
	}
	#main .imgBox p {
		line-height: 2;
		text-align: left;
	}
	#main .imgBox02 {
		padding-bottom: 20px;
	}
	#main .imgBox02::after {
		display: none;
	}
	#main .imgBox02 .photoBox {
		margin-right: 0;
		margin-left: 20px;
	}
	#main .point::after {
		display: none;
	}
	#main .gallery {
		padding: 55px 0 63px;
		background-color: rgba(54, 140, 155, 0.1);
	}
	#main .facilitySec {
		padding: 52px 0;
	}
	#main .facilitySec .headLine01 {
		margin-bottom: 61px;
	}
	#main .facilitySec::after {
		display: none;
	}
	#main .access {
		padding: 24px 0;
	}
	#main .access .map {
		margin: -20px 0 0;
		height: 90vw;
	}
	#main .access .map img {
		height: 100%;
		width: 100%;
	}
	#main .access .list {
		margin-bottom: 46px;
		display: block;
	}
	#main .access .list li {
		width: auto !important;
		padding: 23px 0;
		display: flex;
		align-items: center;
		text-align: left;
		justify-content: space-between;
		border-bottom: 1px solid #368C9B;
	}
	#main .access .list li:nth-child(3n-1) {
		border-left: none;
		border-right: none;
	}
	#main .access .list li:last-child {
		border: none;
	}
	#main .access .list li .photo {
		min-height: inherit;
		padding: 0 !important;
		display: block;
		margin: 0 18px 0 0;
		width: 60px;
	}
	#main .access .list li .photo img {
		width: auto;
		max-height: 49px;
	}
	#main .access .list li .textBox {
		flex: 1;
	}
	#main .access .list li p {
		line-height: 2;
		text-align: left !important;
	}
	#main .access .list li .ttl {
		font-size: 20px;
		margin: 0 5px -2px;
		letter-spacing: 0.05em;
	}
	#main .bigPhoto img {
		width: 100%;
	}
	#main .access:after {
		display: none;
	}
}
