@charset "UTF-8";

.contentpage .m_img_area .m_img {background-image: url("../images/kids/m_img@2x.jpg");}
.med_lead .com_lead_txt {background-image: url("../images/kids/parts1@2x.png");}

.med_point {background: #f8ebeb;}
.med_point .point_title {color: #786252;}

.med_index {background: #de95a1;}
.med_index .ft_dm {color: #f5e1e4;}
.med_boxlist .med_style2 dt::before {color: #de95a1;}



/*box1
---------------------------------------------------------*/
.box1 .med_boxlist,
.box2 .med_boxlist {
	max-width: 1180px;
}

.box1 .for_family {
	background-color: #fff3c9;
	padding: 0 2%;
}
.box1 .for_family .for_family_tit {
	width: 100%;
	max-width: 1060px;
	margin-left: auto;
	margin-right: auto;
	padding: 50px 0 40px;
	border-bottom: solid 1px #b29702;
	text-align: center;
	position: relative;
}
.box1 .for_family .for_family_tit .ft_min {
	color: inherit;
	margin-top: .8em;
}
.box1 .for_family .for_family_tit::before {
	position: absolute;
	z-index: 0;
	content: "";
	background: url(../images/kids/for_family_asb1@2x.png) no-repeat left top;
	background-size: 100% auto;
	width: 16%;
	max-width: 160px;
	aspect-ratio: 320 / 400;
	left: 5%;
	top: 0 ;
	transform: translateY(-15%);
}
.box1 .for_family .for_family_tit::after {
	position: absolute;
	z-index: 0;
	content: "";
	background: url(../images/kids/for_family_asb2@2x.png) no-repeat right bottom;
	background-size: 100% auto;
	width: 16%;
	max-width: 160px;
	aspect-ratio: 320 / 280;
	right: 5%;
	top: 50%;
	transform: translateY(-50%);
}
.box1 .for_family .for_family_tit > dl {
	color: #967900;
	font-size: min(150%,2.5vw);
	letter-spacing: 0.1em;
	line-height: 1.5em;
	position: relative;
	z-index: 1;
}
.box1 .for_family .for_family_tit > dl dt {
	font-size: 370%;
	letter-spacing: normal;
	line-height: 1em;
}
.box1 .for_family .for_family_con {
	padding: 40px 0 80px;
}
.box1 .for_family .for_family_con > p {
	text-align: center;
	font-size: 90%;
	letter-spacing: normal;
	line-height: 2.0em;
	color: #312f2f;
	margin-bottom: 40px;
}
.box1 .for_family .for_family_list {
	display: flex;
	justify-content: center;
	column-gap: 1.3333%;
}
.box1 .for_family .for_family_list li {
	width: 24%;
	text-align: center;
}
.box1 .for_family .for_family_list li > div {
	width: 85%;
	max-width: 210px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
.box1 .for_family .for_family_list li:first-child > div::before {
	position: absolute;
	content: "";
	background: url(../images/kids/for_family_asb3@2x.png)no-repeat right bottom;
	background-size: 100% auto;
	width: 100%;
	height: 100%;
	right: 0;
	bottom: 0;
	transform: translate(15%,15%);
}
.box1 .for_family .for_family_list li p {
	font-size: 105%;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	font-weight: bold;
	color: #333333;
	margin-top: 1.0em;
}
.box1 .for_family .for_family_con .com_link_style1 .com_arrow_link .arrow {
	background: #cca611;
}
.box1 .for_family .for_family_con .com_link_style1 .com_arrow_link .arrow::before,
.box1 .for_family .for_family_con .com_link_style1 .com_arrow_link .arrow::after {
    background: #ba9e37;
}
.box1 .for_family .for_family_con .com_link_style1 .com_arrow_link a::before {
    border-color: #b29702;
}
.box1 .med_lifebnr{
	margin-top: 60px;
}
.box1 .med_memo{
	font-size: 90%;
	margin-top: 30px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box1 .for_family {
	padding: 0 4%;
}
.box1 .for_family .for_family_tit{
	padding: 4% 0 3%;
}
.box1 .for_family .for_family_tit > dl {
	font-size: 130%;
}
.box1 .for_family .for_family_con{
	padding: 4% 0 5%;
}
.box1 .for_family .for_family_con > p {
	ont-size: 95%;
	letter-spacing: .05em;
	line-height: 2.0em;
	margin-bottom: 3%;
}
.box1 .for_family .for_family_list li p {
	font-size: 100%;
}
.box1 .med_lifebnr{
	margin-top: 5%;
}
.box1 .med_memo{
	font-size: 95%;
	margin-top: 2%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box1 .for_family {
	padding: 0 5%;
}
.box1 .for_family .for_family_tit {
	padding: 8% 0 6%;
}
.box1 .for_family .for_family_tit .ft_min {
	margin-top: .8em;
}
.box1 .for_family .for_family_tit::before {
	width: 20%;
	left: 0;
	top: 0;
	transform: translate(-20%,-15%);
}
.box1 .for_family .for_family_tit::after {
	width: 20%;
	right: 0;
	top: 10%;
	transform: translate(20%,0%);
}
.box1 .for_family .for_family_tit > dl {
	font-size: 110%;
	letter-spacing: 0.05em;
}
.box1 .for_family .for_family_tit > dl dt {
	font-size: 220%;
}
.box1 .for_family .for_family_con {
	padding: 6% 0 10%;
}
.box1 .for_family .for_family_con > p{
	font-size: 90%;
	line-height: 1.8em;
	margin-bottom: 3%;
	text-align: left;
}
.box1 .for_family .for_family_list {
    flex-wrap: wrap;
	column-gap: 3%;
	row-gap: 5vw;
}
.box1 .for_family .for_family_list li {
	width: 48.5%;
	max-width: none;
}
.box1 .for_family .for_family_list li p {
	font-size: 100%;
}
.box1 .for_family .for_family_list li di {
	width: 90%;
}

.box1 .med_lifebnr{
	margin-top: 6%;
}
.box1 .med_memo{
	font-size: 90%;
	margin-top: 4%;
}
}



/*box3
---------------------------------------------------------*/
.box3 .med_boxlist .col_3_img {
	display: flex;
	justify-content: space-between;
	margin-top: 1.5em;
}
.box3 .med_boxlist .col_3_img li{
	max-width: 340px;
	width: 31%;
	text-align:center;
}
.box3 .med_boxlist .col_3_img li p{
	font-size: 105%;
	color: #786252;
	font-weight: bold;
	margin-top: 0.5em;
}
.box3 .med_memo{
	font-size: 90%;
	margin-top: 30px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box3 .med_boxlist .col_3_img li p{
	font-size: 100%;
	margin-top: 0.4em;
}
.box3 .med_memo{
	font-size: 95%;
	margin-top: 2%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box3 .med_boxlist .col_3_img{
	display: block;
	margin-top: 6%;
}
.box3 .med_boxlist .col_3_img li{
	max-width:100%;
	width: 100%;
	text-align:center;
	margin: 0 auto 6%;
}
.box3 .med_boxlist .col_3_img li:last-child{
margin-bottom: 0;
}
.box3 .med_boxlist .col_3_img li div{
width: 60%;
margin: 0 auto;
}
.box3 .med_boxlist .col_3_img li p{
	font-size: 100%;
	margin-top: 0.3em;
}
.box3 .med_memo{
	font-size: 90%;
	margin-top: 4%;
}
}