@charset "UTF-8";
/* CSS Document */

#introBox {}
#introBox .flex {}
#single #titBox #introBox {
    padding: 20px 20px 20px;
    margin-bottom: 30px;
}
#single .addBox .flex .rightBox .btnBox a {
    margin: 3px;
}
#introBox .flex .centerBox {
	flex: 1;
}
#single .sec h2.noBorder {
	border: none;
	padding-bottom: 0;
	margin-bottom: 0;
}
a.aLine {
	text-decoration: underline;
}
a.aLine:hover {
	opacity: 0.4;
}
.h5desc {
	font-size: 20px;
	font-weight: 500;
}
.h5desc::before {
	content: "●";
	color: #ea5c71;
}
.swiperP p {
	color: #0066a3;
	font-size: 18px;
}
.swiper-3d .swiper-slide-shadow {
    background: rgba(0,0,0,.0)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left,rgba(0,0,0,.0),rgba(0,0,0,0))
}
.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right,rgba(0,0,0,.0),rgba(0,0,0,0))
}
#introBox .flex .centerBox .snsBox {
	justify-content: flex-end;
}

#single #titBox #introBox .flex .iconBox {
	margin-top: -0px;
	margin: 0 5px;
}

.cmnt {
	background-color: #e9f3fb;
	padding: 3%;
	position: relative;
	margin-top: 50px;
}
.cmnt::after {
	content: "";
	width: 50px;
	height: 30px;
	position: absolute;
	left: calc(50% - 25px);
	bottom: 100%;
	border-bottom: #e9f3fb solid 30px;
	border-left: transparent solid 25px;
	border-right: transparent solid 25px;
}
.cmnt .imgBox {
	width: 100px;
}
.cmnt .imgBox p {
	text-align: center;
}
.cmnt dl {
	flex: 1;
	margin-left: 2em;
}
.cmnt dt {
	font-weight: 600;
	font-size: 21px;
	padding-bottom: 0.3em;
}
.cmnt dd {
	font-size: 18px;
}

.desc {
	margin-bottom: 2em !important;
}
.flexDesc {
	gap:0 30px;
	margin-bottom: 30px;
	
}
.flexDesc .imgBox {
	width: 120px;
	height: 120px;
	border-radius: 100%;
	overflow:visible;
	margin-top: 0;
/*	border-radius: 100%;*/
	border: #ccc solid 1px;
	position: relative;
}
.flexDesc .imgBox p {
	position: absolute;
	left: 0;
	top: 102%;
	width: 100%;
	text-align: center;
}
.flexDesc p.desc {
	flex: 1;
	margin-left: 10px;
	background-color: #eaeae2;
	padding: 1em 2em !important;
	line-height: 1.6;
	border-radius: 15px;
	position: relative;
	display: flex;
align-items: center;
}
p.desc a {
/*	pointer-events: none;*/
	color: #000;
}
.flexDesc p.desc::after {
	content: "";
	width: 25px;
	height: 30px;
	position: absolute;
	top: 50px;
	right: 100%;
	border-right: #eaeae2 solid 25px;
	border-top: transparent solid 15px;
	border-bottom: transparent solid 15px;
}
#single h3.h3Aqua {
	font-size: 28px;
	font-weight: 600;
	border: none;
	text-align: center;
	background-color: #fdf9d9;
	display: flex;
justify-content: center;
align-items: center;
	height: 2.6em;
	padding: 0;
	border-left: #f3a9aa solid 10px;
	border-right: #f3a9aa solid 10px;
	margin: 0;
}
#introBox .btnGmap {
  width: 100%;
  height: 40px;
  display: flex;
justify-content: center;
align-items: center;
  background-color: #000;
  color: #fff;
  font-size: 16px;
  border-radius: 99px;
	margin-top: 10px;
}
#introBox .btnGmap:hover {
  opacity: 0.6;
}
#introBox .btnGmap .map {
  width: 25px;
  margin: 0 10px;
}
#introBox .btnGmap .try {
  width: 10px;
  margin: 0 10px;
}
#sec03 .desc {
	padding-bottom: 0!important;
	margin-bottom: 0!important;
}

#sec04-1 .addBox {
	padding-bottom: 30px;
}

@media screen and (max-width : 959px ){
#single #titBox #introBox {
    padding: 20px 20px 20px;
    margin-bottom: 30px;

	}
	#introBox .flex {
		display: block;
		}
		#introBox .flex .imgBox {

			margin: 0 auto;
	}
	#introBox .flex .centerBox {
		width: 100%;
		max-width: 460px;
		margin: 0 auto;
	}
	#introBox .flex .rightBox {
		width: 80%;
		max-width: 320px !important;
		margin: 0 auto;
		margin-top: 0px;
	}
	#introBox .flex .centerBox .snsBox {
		width: 100%;
    justify-content: flex-end;
	}
	#single #titBox #introBox .flex .iconBox {
    margin-top: 0px;
		margin: 0;
	}
}


@media screen and (max-width : 599px ){
	.cmnt {
		display: block;
	}
	.cmnt .imgBox {
	width: 100px;
		margin: 20px auto;
}
.cmnt dl {
	flex: 0;
	width: 100%;
	margin-left: 0em;
}
.cmnt dt {
	font-size: 18px;
	font-size: clamp(17px, 4.8vw, 19px);
	text-align: center;
}
.cmnt dd {
	font-size: clamp(15px, 4.3vw, 17px);
  line-height: 1.6;
 padding: 0em 1em 1em;
}
	
	
	#descBox dt {
		font-size: 5.9vw;
		font-size: clamp(21px, 5.9vw, 23px);
	}
	#descBox dd {
		font-size: 4.3vw;
		font-size: clamp(15px, 4.3vw, 17px);
	}
	.flexDesc {
		margin-bottom: 30px;
	}
	.flexDesc .imgBox {
		width: 100px;
		height: 100px;
		border-radius: 100%;
		overflow: hidden;
		margin-top: 0;
		border-radius: 100%;
		border: #ccc solid 1px;
	}
	.flexDesc p.desc {
		flex: none;
		width: 100%;
		margin-left: 0px;
		background-color: #eaeae2;
		padding: 1em 2em !important;
		line-height: 1.6;
		border-radius: 15px;
		position: relative;
		display: flex;
	align-items: center;
		margin-top: 30px!important;
	}
	.flexDesc p.desc::after {
		content: "";
		width: 30px;
		height: 20px;
		position: absolute;
		left: calc(50% - 15px);
		top: auto;
		bottom: 100%;
		border-bottom: #eaeae2 solid 20px;
		border-left: transparent solid 15px;
		border-right: transparent solid 15px;
	}
	#single #titBox #introBox .flex dd {
		word-break: break-all;
	}
	#introBox .flex .centerBox .snsBox {
    width: 100%;
		gap: 0px 6px;
    justify-content: center;
		margin-top: 10px;
  }
	
	#single h3.h3Aqua {
		font-size: clamp(21px, 5.9vw, 23px);
		height: 4em;
	}
	#single.oshihamo .putihamo .imgBox {
    padding-bottom: 0px;
	}
}