@charset "UTF-8";

/* ========================================================
  
  FV

======================================================== */
.m_img {
    background-image: url(../images/spay-neuter/m_img@2x.jpg);
}



/* ========================================================
  
  content

======================================================== */

/*---------------------------------------------------------
 merit
---------------------------------------------------------*/
#merit {
	background-color: #e3e5e7;
}
#merit hgroup {
	padding-left: 4%;
}
#merit .txt_lead {
	padding-left: 8%;
	padding-right: 4%;
	margin-bottom: 6%;
}
.com_box__bg .com_h__en {
	position: absolute;
	color: #646b71;
	left: 1em;
	top: -0.5em;
}

.com_box__bg ol {
	list-style: none;
}
.com_box__bg ol > li {
	padding: 0 4.9% 5.8%;
	margin-bottom: 5.8%;
	border-bottom: 1px solid #ccc;
}
.com_box__bg ol > li:last-of-type {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
}
.com_box__bg ol .com_h__bld > span {
	font: var(--font_wed);
	font-size: 122%;
	margin-right: .5em;
}
.com_box__bg ol .com_h__bld > span > span {
	display: inline-block;
	font-size: 35%;
	letter-spacing: normal;
	padding-bottom: .4em;
	vertical-align: 0.5em;
	margin-right: 1em;
	border-bottom: 2px solid #646b71;
}

.com_box__bg .com_col_list,
.com_box__bg .dl_list {
	margin-top: 2.5%;
}
/* dl_list */
.com_box__bg .dl_list dl {
	font-size: min(1.8vw,112%);
	margin-top: .3em;
}
.com_box__bg .dl_list dt {
	text-align: center;
	color: #FFF;
	font-size: 112%;
	background-color: #646b71;
	box-sizing: border-box;
	padding: .2em 1em;
	border-radius: 2em;
}
.com_box__bg .dl_list dd {
	color: #646b71;
}
/* box__merit */
.box__merit .com_h__en {
	color: #ae9154;
}
.box__merit ol .com_h__bld > span > span {
	border-color: #ae9154;
}
.box__merit .com_col_list dl {
	background-color: #ae9154;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
/* dl_list */
.com_box__bg .dl_list dl {
	display: flex;
}
.com_box__bg .dl_list dt {
	width: 7em;
	margin-bottom: 0;
	margin-right: 1em;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#merit .txt_lead {
	margin-bottom: 10%;
}

.com_box__bg ol > li {
	padding: 0 1% 10%;
	margin-bottom: 9%;
}
.com_box__bg ol .com_h__bld {
	margin-bottom: .6em;
}
.com_box__bg ol .com_h__bld > span {
	display: block;
	margin-bottom: .4em;
}
.com_box__bg .com_col_list,
.com_box__bg .dl_list {
	margin-top: 5%;
}
/* dl_list */
.com_box__bg .dl_list dl {
	font-size: 105%;
	margin-top: 5%;
}
.com_box__bg .dl_list dt {
	font-size: 105%;
}
}

/*---------------------------------------------------------
 point
---------------------------------------------------------*/
#point hgroup {
	margin-bottom: 5%;
}
.poi_list .box_img {
	position: relative;
	margin: 0 auto 6%;
}
.poi_list .com_ccl_txt {
	position: absolute;
	color: #FFF;
	font-size: min(2vw,125%);
    width: min(7.4em);
    height: min(7.4em);
	border: 1px solid currentColor;
	right: 22%;
	top: 50%;
	translate: 50% -50%;
}
.poi_list .box_txt {
	width: 90%;
	max-width: 430px;
	margin-inline: auto;
}
.poi_list .com_h__bld {
	text-align: center;
	color: var(--color_dgrn);
	padding-bottom: .8em;
	border-bottom: 2px solid currentColor;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
.poi_list {
	max-width: 1100px;
	display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(2,49%);
	margin-inline: auto;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.poi_list > li:not(:last-of-type) {
	margin-bottom: 8%;
}
.poi_list .box_img {
	width: 95%;
}
.poi_list .com_ccl_txt {
	font-size: 3.5vw;
}
}

/*---------------------------------------------------------
 flow
---------------------------------------------------------*/
.flow_lead {
	position: relative;
	text-align: center;
	padding: 6% 0;
	border-top: 1px solid #ccc;
}
.flow_lead::after {
	position: absolute;
	content: "";
	background-color: #f8f9f9;
	width: 3.5em;
	height: 1.9em;
	inset: calc(100% - 1px) 0 auto 0;
	margin: auto;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
#flow .com_bg_color::before {
	background-color: #dbe5e9;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.flow_lead {
	padding: 10% 0;
}
.flow_lead::after {
	width: 3em;
	height: 1.5em;
}
.flow_lead p {
	text-align: left;
}
#flow .com_pdg {
	padding-top: 14%;
}
}

/*---------------------------------------------------------

---------------------------------------------------------*/

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {


}