@charset "utf-8";
/*BASE*/

/*SP*/
@media screen and (max-width: 767.98px) {

/*BASE*/
section {
	padding:4rem 2rem;
}
section .message-box h2 {
	font-size:16px;
	margin-bottom:1rem;
}
section .message-box strong { font-size:16px; font-weight:normal;}
section .message-box .cite { text-align:right; }

/*子供の歯を守るための母親教室*/
#flow {
	padding-top:2rem;
}
#flow .summary {
	font-size:16px;
	text-align:center;
	padding:1.5rem 0;
}
#flow .content-box > div > .img-box img {
	width:100%;
	border-radius:10px;
}
#flow .content-box > div > .txt-box {
	padding:1.5rem .5rem;
}

/*なぜ母親教室が必要なのでしようか?*/
#why {
	background: linear-gradient(180deg,rgba(255, 239, 243, 1) 0%, rgba(255, 246, 198, 1) 100%);
}
#why .hgroup {
	color:#8b5171;
	margin-bottom:1.5rem;
}
#why .img-box {
	border-radius:10px;
	overflow:clip;
	margin-bottom:1rem;
}
#why .img-box img {
	width:100%;
}
#why .txt-box {
	color:#4d0505;
	text-align:justify;
}
#why .txt-box .message-box p:not(last-of-type) {
	margin-bottom:1rem;
}

/*痛くない歯科治療*/
#initiative {
	background-color:#e7f5e7;
}
#initiative .hgroup {
	color:#0d8181;
}
#initiative .key-box {
	padding:1.5rem 0;
}
#initiative .key-box .img-box {
	border-radius:10px;
	overflow:clip;
	margin-bottom:1rem;
}
#initiative .key-box .img-box img {
	width:100%;
}
#initiative .key-box .txt-box {
	font-size:16px;
	text-align:justify;
}
#initiative .initiative > li {
	text-align:justify;
	padding:0 0 calc(2rem + 4px) 0;
	margin-bottom:2rem;
	position:relative;
}
#initiative .initiative > li:last-child {
	padding-bottom:0;
	margin-bottom:0;
}
#initiative .initiative > li:not(:last-child)::before,
#initiative .initiative > li:not(:last-child)::after {
	content:"";
	display:block;
	width:100%;
	height:4px;
	position:absolute;
	left:0;
}
#initiative .initiative > li:not(:last-child)::before {
	background: linear-gradient(90deg,rgba(92, 204, 139, 1) 0%, rgba(222, 204, 67, 1) 100%);
	bottom:0px;
}
#initiative .initiative > li:not(:last-child)::after {
	background:url(../images/hahaoya/initiative_line_dot.svg) left center repeat-x;
	bottom:0;
}
#initiative .initiative > li h2 {
	display:flex;
	font-size:16px;
	margin-bottom:1rem;
}
#initiative .initiative > li h2::before {
	content:"●";
	color:#75D586;
}
#initiative .initiative > li .message-box {
	padding-left:1.25em;
}

/*治療にあたってお母さんへのおねがい*/
#request {
	background-color:#FFF;
}
#request .hgroup {
	margin-bottom:1.5rem;
}
#request .request > li {
	text-align:justify;
	padding:0 20px calc(2rem + 4px) 20px;
	margin-bottom:2rem;
	position:relative;
}
#request .request > li:last-child {
	padding-bottom:0;
	margin-bottom:0;
}
#request .request > li:not(:last-child)::before,
#request .request > li:not(:last-child)::after {
	content:"";
	display:block;
	width:100%;
	height:4px;
	position:absolute;
	left:0;
}
#request .request > li:not(:last-child)::before {
	background: linear-gradient(90deg,rgba(189, 61, 90, 1) 0%, rgba(222, 204, 67, 1) 100%);
	bottom:0px;
}
#request .request > li:not(:last-child)::after {
	background:url(../images/tmpl/line_dot.svg) left center repeat-x;
	bottom:0;
}

}


/*PC NPC TAB*/
@media screen and (min-width: 768px), print {

/*BASE*/
section {
	padding:80px 60px;
}
section .container {
	max-width:1440px;
	margin:auto;
}
section .hgroup h1 {
	text-align:center;
	padding-right:74px;
}
section .content-box {
	max-width:1280px;
	margin:auto;
}
section .message-box h2 {
	font-size:clamp(20px, 2vw, 26px);
	margin-bottom:1rem;
}
section .message-box strong { font-size:clamp(20px, 2vw, 26px); font-weight:normal;}
section .message-box .cite {
	text-align:right;
}

/*子供の歯を守るための母親教室*/
#flow .summary {
	font-size:clamp(20px, 2vw, 26px);
	text-align:center;
	padding:60px 0;
}
#flow .content-box > div {
	display:flex;
}
#flow .content-box > div:nth-of-type(even) {
	flex-direction:row-reverse;
}
#flow .content-box > div > .img-box,
#flow .content-box > div > .txt-box {
	flex: 1 0 50%;
}
#flow .content-box > div > .img-box img {
	width:100%;
	object-fit: cover;
}
#flow .content-box > div > .txt-box {
	display:flex;
	align-items:center;
	padding:40px;
	text-align:justify;
}
#flow .content-box > div:nth-of-type(odd) > .txt-box {
	padding-right:0;
}
#flow .content-box > div:nth-of-type(even) > .txt-box {
	padding-left:0;
}

/*なぜ母親教室が必要なのでしようか?*/
#why {
	background: linear-gradient(180deg,rgba(255, 239, 243, 1) 0%, rgba(255, 246, 198, 1) 100%);
}
#why .hgroup {
	color:#8b5171;
	margin-bottom:60px;
}
#why .img-box {
	border-radius:10px;
	overflow:clip;
	margin-bottom:40px;
}
#why .img-box img {
	width:100%;
}
#why .txt-box {
	color:#4d0505;
	text-align:justify;
}
#why .txt-box .message-box p:not(last-of-type) {
	margin-bottom:1rem;
}

/*痛くない歯科治療*/
#initiative {
	background-color:#e7f5e7;
}
#initiative .hgroup {
	color:#0d8181;
}
#initiative .key-box {
	display:flex;
	padding:60px 0;
}
#initiative .key-box .img-box,
#initiative .key-box .txt-box {
	flex: 1 0 50%;
}
#initiative .key-box .img-box img {
	width:100%;
	object-fit: cover;
}
#initiative .key-box .txt-box {
	display:flex;
	align-items:center;
	padding:40px;
	text-align:justify;
	padding-right:0;
	font-size:clamp(16px, 1.6vw, 18px)
}
#initiative .initiative > li {
	text-align:justify;
	padding:0 20px calc(2rem + 4px) 20px;
	margin-bottom:2rem;
	position:relative;
}
#initiative .initiative > li:last-child {
	padding-bottom:0;
	margin-bottom:0;
}
#initiative .initiative > li:not(:last-child)::before,
#initiative .initiative > li:not(:last-child)::after {
	content:"";
	display:block;
	width:100%;
	height:4px;
	position:absolute;
	left:0;
}
#initiative .initiative > li:not(:last-child)::before {
	background: linear-gradient(90deg,rgba(92, 204, 139, 1) 0%, rgba(222, 204, 67, 1) 100%);
	bottom:0px;
}
#initiative .initiative > li:not(:last-child)::after {
	background:url(../images/hahaoya/initiative_line_dot.svg) left center repeat-x;
	bottom:0;
}
#initiative .initiative > li h2 {
	display:flex;
	font-size:clamp(16px, 1.6vw, 18px);
	margin-bottom:1rem;
}
#initiative .initiative > li h2::before {
	content:"●";
	color:#75D586;
}
#initiative .initiative > li .message-box {
	padding-left:clamp(16px, 1.6vw, 18px);
}

/*治療にあたってお母さんへのおねがい*/
#request {
	background-color:#FFF;
}
#request .hgroup {
	margin-bottom:60px;
}
#request .request > li {
	text-align:justify;
	padding:0 20px calc(2rem + 4px) 20px;
	margin-bottom:2rem;
	position:relative;
}
#request .request > li:last-child {
	padding-bottom:0;
	margin-bottom:0;
}
#request .request > li:not(:last-child)::before,
#request .request > li:not(:last-child)::after {
	content:"";
	display:block;
	width:100%;
	height:4px;
	position:absolute;
	left:0;
}
#request .request > li:not(:last-child)::before {
	background: linear-gradient(90deg,rgba(189, 61, 90, 1) 0%, rgba(222, 204, 67, 1) 100%);
	bottom:0px;
}
#request .request > li:not(:last-child)::after {
	background:url(../images/tmpl/line_dot.svg) left center repeat-x;
	bottom:0;
}

}