@charset "utf-8";

/* ======================================================
* family - common.css
* ------------------------------------------------------
* Common
* - Reset
* - Vars
* - Override
* - Util
* - Layout
* - Parts
* @media print, screen and (min-width: 768px)
* - Override
* - Util
* - Layout
* - Parts
* PC Media Queries
* @media only screen and (max-width: 767px)
* - Override
* - Util
* - Layout
* - Parts
* SP Media Queries
* Print
====================================================== */

/* ======================================================
* Common
====================================================== */
/* ------------------------------------------------------
* import
------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* ------------------------------------------------------
* Reset
------------------------------------------------------ */

/* ------------------------------------------------------
* Vars
------------------------------------------------------ */
/* --- theme-color --- */
:root {
	--main-color: #1eace5;
	--bg-color: #fff;
	--bg-color2: #f5f5f5;
	--sub-color: #d5edff;
	--sub-color2: #fe921e;
	--sub-color3: #daebd0;
	--sub-color4: #faedc7;
	--sub-color5: #fcdbe3;
	--sub-color6: #e6dbf0;
	--sub-color7: #222;
	--sub-color8: #e6e9ee;
	--sub-color9: #c4dff3;
	--hover-color: #79ccf2;
	--hover-color2: #1d9bff;
	--bright-color: #fff;
	--accent-color: #0e0d6a;
	--accent-color2: #0066aa;
	--accent-color3: #d24430;
	--disable-color: #dde0e7;
	--text-color: #555566;
	--highlight-color: #ee8b16;
}
/* --- font --- */
:root {
	--font-family: "Noto Sans JP","Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}

/* ------------------------------------------------------
* Override
------------------------------------------------------ */
/* --- body直下 --- */
#family-page {
	overflow: hidden;
	position: relative;
	z-index: 100;
	word-wrap: break-word;
	word-break: break-word;
}

#family-page ul,
#family-page ol {
  margin: 10px 0 0;
}

.family-Main,
.family-Main * {
	box-sizing: border-box;
}
.family-Main img {
	min-width: 1px;
	max-width: 100%;
	height: auto;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	vertical-align: top;
	image-rendering: -webkit-optimize-contrast;
}


/* ------------------------------------------------------
* Util
------------------------------------------------------ */
.util-align-center {
	text-align: center;
}
.util-color-highlight {
	color: var(--highlight-color);
}
.util-sup,.util-sub {
	position: relative;
	font-size: 60%;
	line-height: 1;
}
.util-sup {
	top: -0.6em;
}
.util-sub {
	bottom: -0.1em;
}



/* ------------------------------------------------------
* Layout
------------------------------------------------------ */
/* --- Main --- */
.family-Main {
	background: var(--bg-color);
	font-family: var(--font-family);
}
/* --- Main_head --- */
.family-Main_head {
}
/* --- Main_body --- */
.family-Main_body {
}

.family-Main > *:first-child,
.family-Main_head > *:first-child,
.family-Main_body > *:first-child,
.family-Main_content > *:first-child,
.family-Main_foot > *:first-child
{margin-top: 0!important;}

/* --- Main_content --- */

/* ======================================================
* PC
====================================================== */
@media print, screen and (min-width: 768px) {
	/* ------------------------------------------------------
	* Override
	------------------------------------------------------ */
	/* --- body直下 --- */
	#family-page {
		min-width: 1224px;
	}
	/* --- Main --- */
	.family-Main {
		font-size: 15px;
	}

	a[href^="tel:"] {
		display: inline-block !important;
		text-decoration: none;
		cursor: default;
		pointer-events: none;
	}

	/* ------------------------------------------------------
	* Util
	------------------------------------------------------ */
	.util-pc-hidden { display: none!important; }

	/* ----- data-size-pc ----- */
	[data-size-pc] > * { width: 100%; }
	[data-size-pc="1per"]{width:1%!important;}[data-size-pc="2per"]{width:2%!important;}[data-size-pc="3per"]{width:3%!important;}[data-size-pc="4per"]{width:4%!important;}[data-size-pc="5per"]{width:5%!important;}[data-size-pc="6per"]{width:6%!important;}[data-size-pc="7per"]{width:7%!important;}[data-size-pc="8per"]{width:8%!important;}[data-size-pc="9per"]{width:9%!important;}[data-size-pc="10per"]{width:10%!important;}[data-size-pc="11per"]{width:11%!important;}[data-size-pc="12per"]{width:12%!important;}[data-size-pc="13per"]{width:13%!important;}[data-size-pc="14per"]{width:14%!important;}[data-size-pc="15per"]{width:15%!important;}[data-size-pc="16per"]{width:16%!important;}[data-size-pc="17per"]{width:17%!important;}[data-size-pc="18per"]{width:18%!important;}[data-size-pc="19per"]{width:19%!important;}[data-size-pc="20per"]{width:20%!important;}[data-size-pc="21per"]{width:21%!important;}[data-size-pc="22per"]{width:22%!important;}[data-size-pc="23per"]{width:23%!important;}[data-size-pc="24per"]{width:24%!important;}[data-size-pc="25per"]{width:25%!important;}[data-size-pc="26per"]{width:26%!important;}[data-size-pc="27per"]{width:27%!important;}[data-size-pc="28per"]{width:28%!important;}[data-size-pc="29per"]{width:29%!important;}[data-size-pc="30per"]{width:30%!important;}[data-size-pc="31per"]{width:31%!important;}[data-size-pc="32per"]{width:32%!important;}[data-size-pc="33per"]{width:33%!important;}[data-size-pc="34per"]{width:34%!important;}[data-size-pc="35per"]{width:35%!important;}[data-size-pc="36per"]{width:36%!important;}[data-size-pc="37per"]{width:37%!important;}[data-size-pc="38per"]{width:38%!important;}[data-size-pc="39per"]{width:39%!important;}[data-size-pc="40per"]{width:40%!important;}[data-size-pc="41per"]{width:41%!important;}[data-size-pc="42per"]{width:42%!important;}[data-size-pc="43per"]{width:43%!important;}[data-size-pc="44per"]{width:44%!important;}[data-size-pc="45per"]{width:45%!important;}[data-size-pc="46per"]{width:46%!important;}[data-size-pc="47per"]{width:47%!important;}[data-size-pc="48per"]{width:48%!important;}[data-size-pc="49per"]{width:49%!important;}[data-size-pc="50per"]{width:50%!important;}[data-size-pc="51per"]{width:51%!important;}[data-size-pc="52per"]{width:52%!important;}[data-size-pc="53per"]{width:53%!important;}[data-size-pc="54per"]{width:54%!important;}[data-size-pc="55per"]{width:55%!important;}[data-size-pc="56per"]{width:56%!important;}[data-size-pc="57per"]{width:57%!important;}[data-size-pc="58per"]{width:58%!important;}[data-size-pc="59per"]{width:59%!important;}[data-size-pc="60per"]{width:60%!important;}[data-size-pc="61per"]{width:61%!important;}[data-size-pc="62per"]{width:62%!important;}[data-size-pc="63per"]{width:63%!important;}[data-size-pc="64per"]{width:64%!important;}[data-size-pc="65per"]{width:65%!important;}[data-size-pc="66per"]{width:66%!important;}[data-size-pc="67per"]{width:67%!important;}[data-size-pc="68per"]{width:68%!important;}[data-size-pc="69per"]{width:69%!important;}[data-size-pc="70per"]{width:70%!important;}[data-size-pc="71per"]{width:71%!important;}[data-size-pc="72per"]{width:72%!important;}[data-size-pc="73per"]{width:73%!important;}[data-size-pc="74per"]{width:74%!important;}[data-size-pc="75per"]{width:75%!important;}[data-size-pc="76per"]{width:76%!important;}[data-size-pc="77per"]{width:77%!important;}[data-size-pc="78per"]{width:78%!important;}[data-size-pc="79per"]{width:79%!important;}[data-size-pc="80per"]{width:80%!important;}[data-size-pc="81per"]{width:81%!important;}[data-size-pc="82per"]{width:82%!important;}[data-size-pc="83per"]{width:83%!important;}[data-size-pc="84per"]{width:84%!important;}[data-size-pc="85per"]{width:85%!important;}[data-size-pc="86per"]{width:86%!important;}[data-size-pc="87per"]{width:87%!important;}[data-size-pc="88per"]{width:88%!important;}[data-size-pc="89per"]{width:89%!important;}[data-size-pc="90per"]{width:90%!important;}[data-size-pc="91per"]{width:91%!important;}[data-size-pc="92per"]{width:92%!important;}[data-size-pc="93per"]{width:93%!important;}[data-size-pc="94per"]{width:94%!important;}[data-size-pc="95per"]{width:95%!important;}[data-size-pc="96per"]{width:96%!important;}[data-size-pc="97per"]{width:97%!important;}[data-size-pc="98per"]{width:98%!important;}[data-size-pc="99per"]{width:99%!important;}[data-size-pc="100per"]{width:100%!important;}

	/* ----- data-col-pc ----- */
	[data-col-pc]:not([data-col-pc="1"]) {
		display: flex;
		flex-flow: row wrap;
	}
	[data-col-pc]:not([data-col-pc="auto"]) > * {
		margin: 20px 0 0 20px;
	}
	[data-col-pc="1"] > * {width: 100%;}
	[data-col-pc="2"] > * {width: calc((100% - (36px * 1)) / 2);}
	[data-col-pc="3"] > * {width: calc((100% - (36px * 2)) / 3);}
	[data-col-pc="4"] > * {width: calc((100% - (36px * 3)) / 4);}
	[data-col-pc="1"] > *,
	[data-col-pc="2"] > *:nth-child(2n+1),
	[data-col-pc="3"] > *:nth-child(3n+1),
	[data-col-pc="4"] > *:nth-child(4n+1) {
		margin-left: 0!important;
	}
	[data-col-pc="1"] > *:first-child,
	[data-col-pc="2"] > *:nth-child(-n+2),
	[data-col-pc="3"] > *:nth-child(-n+3),
	[data-col-pc="4"] > *:nth-child(-n+4) {
		margin-top: 0!important;
	}
	
	.util-link--blank {
		color: var(--accent-color2);
	}
	.util-link--blank::after {
		content: "";
		position: relative;
		display: inline-block;
		top: -2px;
		width: 12px;
		height: 12px;
		margin: 0 0.5em;
		background: url("/extlib/family/img/cmn_ic_001_03.svg") no-repeat 0 0 / contain;
		vertical-align: middle;
	}
	.util-link--blank:hover {
		color: var(--hover-color2);
		text-decoration: underline;
	}


	/* ------------------------------------------------------
	* Layout
	------------------------------------------------------ */
	/* --- BREADCRUMB --- */
	.TOPIC-PATH-INNER.family-breadcrumb {
		width: 1200px!important;
	}

	/* --- Main_head --- */
	.family-Main_head {
		width: 100%;
	}

	/* --- Main_content --- */
	.family-Main_content {
		max-width: 1224px;
		margin: 0 auto;
		padding: 5.3em 12px 6em;
	}

	/* --- family-header --- */
	.family-header {
		position: relative;
		width: 100%;
		margin: 0 auto;
	}
	.family-header .header_head {
		position: relative;
		width: 100%;
		background: linear-gradient(0deg, rgb(213,237,255) 6%, rgb(86,186,234) 64%, rgb(30,172,229) 100%);
		z-index: 1;
	}
	.family-header .header_head .head_image {
		position: relative;
		left: 50%;
		width: 1920px;
		transform: translateX(-50%);
	}
	.family-header .header_head .header_button {
		position: absolute;
		top: 135px;
		left: 50%;
		transform: translateX(-50%);
	}
	.family-header .header_head .header_button > [class*="button_link"] {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 8px 65px;
		border-radius: 22px;
		border: 2px solid var(--sub-color7);
		background: var(--bg-color);
		color: var(--text-color);
		font-size: 15px;
		font-weight: 500;
	}
	.family-header .header_head .header_button > [class*="button_link"]:hover {
		border-color: var(--main-color);
		color: var(--main-color);
	}
	.family-header .header_head .header_button > .button_link-back::before {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		left: 21px;
		width: 21px;
		height: 15px;
		background: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		background-size: contain;
		background-blend-mode: multiply;
		-webkit-mask: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		mask: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		background-color: var(--main-color);
		transform-origin: center;
		transform: translateY(-50%) rotate(180deg);
	}
	.family-header .header_body {
		position: relative;
		width: 1200px;
		margin: -45px auto 0;
		z-index: 2;
	}

	/* --- family-lnav --- */
	.family-lnav {
		width: 100%;
	}
	.family-lnav .lnav_list {
		display: flex;
	}
	.family-lnav .lnav_list > li {
		position: relative;
		width: calc((100% - (24px * 4))/5);
		margin: 0 0 0 24px;
	}
	.family-lnav .lnav_list > li:first-child {
		margin-left: 0;
	}
	.family-lnav .lnav_list > li > [class*="list_button"] {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		padding: 11px 5px;
		border-radius: 8px;
		border: 2px solid var(--main-color);
		background: var(--main-color);
		color: var(--bright-color);
		font-size: 20px;
		font-weight: 500;
		line-height: 1.6;
		text-align: center;
	}
	.family-lnav .lnav_list > li > [class*="list_button"]:hover {
		border-color: var(--hover-color);
		background: var(--hover-color);
	}
	.family-lnav .lnav_list > li > .list_button-blank .button_label::before {
		content: "";
		display: inline-block;
		position: relative;
		width: 13px;
		height: 12px;
		margin-right: 7px;
		background: url("/extlib/family/img/cmn_ic_001_02.svg") no-repeat 0 0;
		background-size: contain;
	}
	.family-lnav .lnav_list > li > [class*="list_button"] .button_icon {
		display: none;
	}
	.family-lnav .lnav_list > li.is-current > [class*="list_button"]:not(:hover) {
		background: var(--bg-color);
		color: var(--main-color);
	}
	.family-lnav .lnav_list > li.is-current > .list_button-blank:not(:hover) .button_label::before {
		background-blend-mode: multiply;
		-webkit-mask: url("/extlib/family/img/cmn_ic_001_02.svg") no-repeat 0 0;
		mask: url("/extlib/family/img/cmn_ic_001_02.svg") no-repeat 0 0;
		background-color: var(--accent-color);
	}
	.family-lnav .lnav_list > li.has-nest::after {
		content: "";
		display: none;
		position: absolute;
		top: calc(100% + 6px);
		left: 50%;
		border-style: solid;
		border-width: 0 18px 19px;
		border-color: transparent transparent var(--sub-color);
		transform: translateX(-50%);
	}
	.family-lnav .lnav_list > li.has-nest.is-current::after {
		display: block;
	}
	.family-lnav .lnav_nest {
		display: none;
		width: 100%;
		margin: 24px 0 0;
		padding: 15px 36px;
		border-radius: 8px;
		background: var(--sub-color);
	}
	.family-lnav .lnav_nest .nest_list {
		display: flex;
		flex-flow: row wrap;
	}
	.family-lnav .lnav_nest .nest_list > li {
		width: calc((100% - (36px * 2))/3);
		margin: 15px 0 0 36px;
	}
	.family-lnav .lnav_nest .nest_list > li:nth-of-type(-n+3) {
		margin-top: 0;
	}
	.family-lnav .lnav_nest .nest_list > li:nth-of-type(3n+1) {
		margin-left: 0;
	}
	.family-lnav .lnav_nest .nest_list > li > [class*="nest_button"] {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		padding: 8px;
		border-radius: 22px;
		border: 2px solid var(--main-color);
		background: var(--main-color);
		color: var(--bright-color);
		font-size: 15px;
		font-weight: 500;
		line-height: 1.6;
		text-align: center;
	}
	.family-lnav .lnav_nest .nest_list > li > [class*="nest_button"]:hover {
		border-color: var(--hover-color);
		background: var(--hover-color);
	}
	.family-lnav .lnav_nest .nest_list > li.is-current > [class*="nest_button"]:not(:hover) {
		background: var(--bg-color);
		color: var(--main-color);
	}

	/* --- family-trouble-carousel --- */
	.family-trouble-carousel {
		padding: 22px 12px 47px;
		background: var(--sub-color);
	}
	.family-trouble-carousel .carousel_inner {
		width: 1200px;
		margin: 0 auto;
	}
	.family-trouble-carousel .carousel_head {
	}
	.family-trouble-carousel .carousel_heading {
		font-size: 20px;
		font-weight: 500;
		line-height: 1.4;
		text-align: center;
	}
	.family-trouble-carousel .carousel_heading rt {
		font-size: 10px;
	}
	.family-trouble-carousel .carousel_body {
		position: relative;
		margin: 22px 0 0;
		padding: 0 36px;
	}
	.family-trouble-carousel .carousel_list {
		width: calc(100% + 24px);
		margin: 0 -12px;
		opacity: 0;
	}
	.family-trouble-carousel .carousel_list.slick-initialized {
		opacity: 1;
	}
	.family-trouble-carousel .carousel_list.slick-slider {
		overflow: hidden;
	}
	.family-trouble-carousel .carousel_item {
		height: 100%;
		padding: 0 12px;
	}
	.family-trouble-carousel .carousel_item > :first-child {
		margin-top: 0!important;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow {
		appearance: none;
		position: absolute;
		top: 50%;
		width: 51px;
		height: 51px;
		margin-top: -12px;
		border-radius: 50%;
		border: none;
		background: var(--main-color);
		white-space: nowrap;
		text-indent: -100vw;
		overflow: hidden;
		transform: translateY(-50%);
		cursor: pointer;
		z-index: 2;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow::before {
		content: "";
		display: block;
		position: absolute;
		box-sizing: border-box;
		top: 50%;
		width: 16px;
		height: 16px;
		border: solid var(--bright-color);
		transform-origin: center;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-prev {
		left: -36px;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-next {
		right: -36px;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-prev::before {
		left: 20px;
		border-width: 3px 0 0 3px;
		transform: translateY(-50%) rotate(-45deg) ;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-next::before {
		right: 20px;
		border-width: 3px 3px 0 0;
		transform: translateY(-50%) rotate(45deg) ;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow:hover {
		background: var(--hover-color);
	}

	/* ------------------------------------------------------
	* Parts
	------------------------------------------------------ */
	/* --- No.3 --- */
	.family-heading1 {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 4.8em auto 1.6em;
	}
	.family-Main .family-heading1 + * {
		margin-top: 24px;
	}
	.family-heading1 .heading_inner {
		text-align: center;
	}
	.family-heading1 .heading_subtitle {
		color: var(--main-color);
		font-size: 15px;
		font-weight: 500;
		line-height: 1.4;
	}
	.family-heading1 .heading_title {
		font-size: 30px;
		font-weight: 500;
		line-height: 1.8;
	}
	.family-heading1 .heading_subtitle + .heading_title {
		margin-top: 3px;
	}
	.family-heading1 .heading_title rt {
		font-size: 12px;
	}
	/* --- No.4 --- */
	.family-dotted {
		background-image: url("/extlib/family/img/cmn_ex_001.png");
		background-repeat: repeat;
		background-size: 7px 45px;
		margin: 1.6em auto 0;
		line-height: 3;
		text-align: center;
		font-size: 15px;
		width: 787px;
	}
	.family-dotted rt {
		font-size: 10px;
	}
	/* --- No.5 --- */
	.family-lead {
		margin: 1.6em 0 0;
		font-size: 18px;
		font-weight: 500;
		line-height: 1.8;
		text-align: center;
	}
	.family-lead rt {
		font-size: 10px;
	}
/* --- No.6 --- */
	.family-story {
		margin-top: 2.8em;
	}
	.family-story .family-story_heading {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		margin-bottom: 3.125em;
	}
	.family-story .family-story_heading  .heading_subtitle {
		display: inline-block;
		margin: 0 auto;
		padding: 0 20px;
		color: var(--text-color);
		font-size: 20px;
		font-weight: bold;
		background: var(--sub-color8);
		border-radius: 10px;
	}
	.family-story .family-story_heading  .heading_subtitle .subtitle_small {
		font-size: 14px;
	}
	.family-story .family-story_heading .heading_title {
		margin-top: .3636em;
		font-size: 22px;
		font-weight: bold;
		line-height: 1.4;
		color: var(--main-color);
		position: relative;
		display: inline-block;
	}
	.family-story .family-story_heading .heading_title rt {
		font-size: 10px;
		font-weight: 500;
	}
	.family-story .family-story_heading .heading_title::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: -8px;
		width: 100%;
		height: 4px;
		background-image: url("/extlib/family/img/cmn_ex_002.png");
		background-repeat: repeat-x;
		background-size: 8px 4px;
	}
	.family-story .family-story_video {
		background-color: var(--sub-color);
		padding: 15px 36px 36px;
		border-radius: 8px;
	}
	.family-story .family-story_video .video_caption {
		font-size: 13px;
		margin-bottom: 15px;
	}
	.family-story .family-story_video .video_iframe {
		position: relative;
		width: 100%;
		padding-top: 56.25%;
	}
	.family-story .family-story_video .video_iframe iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border: none;
	}
	.family-story .family-story_video .video_content {
		width: 100%;
		padding: 2em;
		border-radius: 0 0 8px 8px;
		background-color: var(--bright-color);
	}
	.family-story .video_rate {
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.family-story .video_rate > [class*="rate_item"] {
		display: flex;
		align-items: center;
		margin-left: 30px;
	}
	.family-story .video_rate > [class*="rate_item"]:first-child {
		margin-left: 0;
	}
	.family-story .video_rate .rate_label {
		display: inline-block;
		min-width: 89px;
		margin: 0 10px 0 0;
		padding: 9px 10px;
		border-radius: 16px;
		color: var(--bright-color);
		font-size: 14px;
		text-align: center;
		line-height: 1;
	}
	.family-story .video_rate .rate_star {
		display: flex;
	}
	.family-story .video_rate .rate_star .star_icon {
		display: inline-block;
		width: 30px;
		height: 30px;
		background: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		background-blend-mode: multiply;
		background-color: var(--disable-color);
		-webkit-mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		white-space: nowrap;
		text-indent: -100vw;
		overflow: hidden;
	}
	.family-story .video_rate .rate_star .star_icon + .star_icon {
		margin-left: 6px;
	}
	.family-story .video_rate > .rate_item-common .rate_label {
		background-color: var(--main-color);
	}
	.family-story .video_rate > .rate_item-dangerous .rate_label {
		background-color: var(--accent-color3);
	}
	.family-story .video_rate > .rate_item-common .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-story .video_rate > .rate_item-common .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-story .video_rate > .rate_item-common .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-story .video_rate > .rate_item-common .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-story .video_rate > .rate_item-common .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5) {
		background-color: var(--main-color);
	}
	.family-story .video_rate > .rate_item-dangerous .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-story .video_rate > .rate_item-dangerous .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-story .video_rate > .rate_item-dangerous .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-story .video_rate > .rate_item-dangerous .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-story .video_rate > .rate_item-dangerous .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5)  {
		background-color: var(--accent-color3);
	}
	.family-story .family-story_link {
		margin-top: 1.5em;
		text-align: right
	}
	.family-story .family-story_link .link_type {
		font-size: 15px;
		line-height: 1.6;
		color: var(--accent-color2);
		font-weight: 500;
		position: relative;
		padding-left: 9px;
	}
	.family-story .family-story_link .link_type:hover {
		color: var(--hover-color2);
		text-decoration: underline;
	}
	.family-story .family-story_link .link_type::before {
		content: "";
		display: block;
		position: absolute;
		top: 7px;
		left: 0;
		border-left: 6px solid var(--accent-color);
		border-top: 5px solid transparent;
		border-bottom: 5px solid transparent;
	}
	.family-story .family-story_link .link_type rt {
		font-size: 10px;
	}

	/* --- No.7 --- */
	.family-trouble-card-wrap {
		display: flex;
		flex-flow: row wrap;
		margin: 26px 0 0;
		padding: 36px;
		border-radius: 8px;
		background: var(--sub-color);
	}
	.family-trouble-card-wrap > .family-trouble-card {
		width: calc((100% - (24px*2))/3)!important;
		margin: 24px 0 0 24px!important;
	}
	.family-trouble-card-wrap > .family-trouble-card:nth-of-type(-n+3) {
		margin-top: 0!important;
	}
	.family-trouble-card-wrap > .family-trouble-card:nth-of-type(3n+1) {
		margin-left: 0!important;
	}
	.family-trouble-card {
		position: relative;
		width: 100%;
		margin: 2em 0 0;
	}
	.family-trouble-card .card_link {
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
		border-radius: 8px;
		background: var(--bg-color);
		overflow: hidden;
		z-index: 1;
	}
	.family-trouble-card .card_link::after {
		content: "";
		display: block;
		position: absolute;
		box-sizing: border-box;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border-radius: 8px;
		border: 2px solid var(--main-color);
		opacity: 0;
		pointer-events: none;
	}
	.family-trouble-card .card_head {
		width: 100%;
	}
	.family-trouble-card .card_image {
		width: 100%;
		text-align: center;
	}
	.family-trouble-card .card_body {
		padding: 0 20px 20px;
	}
	.family-trouble-card .card_label {
		position: relative;
		top: 0;
		left: -20px;
		display: inline-block;
		min-width: 93px;
		padding: 6px;
		border-radius: 0 0 8px 0;
		background: var(--sub-color8);
		color: var(--text-color);
		font-size: 15px;
		font-weight: 500;
		text-align: center;
		line-height: 1;
	}
	.family-trouble-card .card_label > em {
		font-style: normal;
		font-size: 20px;
	}
	.family-trouble-card .card_title {
		margin-top: 11px;
		padding: 7px 0 0 14px;
		color: var(--accent-color2);
		font-size: 20px;
		font-weight: 500;
	}
	.family-trouble-card .card_title .title_label {
		position: relative;
	}
	.family-trouble-card .card_title .title_label::before {
		content: "";
		display: block;
		position: absolute;
		top: .5em;
		left: -14px;
		border: solid transparent;
		border-width: 6px 0 6px 5px;
		border-left-color: var(--accent-color);
	}
	.family-trouble-card .card_title rt {
		font-size: 12px;
	}
	.family-trouble-card .card_rate {
		margin: 15px 0 0;
	}
	.family-trouble-card .card_rate > :first-child {
		margin-top: 0!important;
	}
	.family-trouble-card .card_rate > [class*="rate_item"] {
		display: flex;
		align-items: center;
		margin: 13px 0 0;
	}
	.family-trouble-card .card_rate .rate_label {
		display: inline-block;
		min-width: 89px;
		margin: 0 10px 0 0;
		padding: 9px 10px;
		border-radius: 16px;
		color: var(--bright-color);
		font-size: 14px;
		text-align: center;
		line-height: 1;
	}
	.family-trouble-card .card_rate .rate_star {
		display: flex;
	}
	.family-trouble-card .card_rate .rate_star .star_icon {
		display: inline-block;
		width: 30px;
		height: 30px;
		background: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		background-blend-mode: multiply;
		background-color: var(--disable-color);
		-webkit-mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		white-space: nowrap;
		text-indent: -100vw;
		overflow: hidden;
	}
	.family-trouble-card .card_rate .rate_star .star_icon + .star_icon {
		margin-left: 6px;
	}
	.family-trouble-card .card_rate > .rate_item-common .rate_label {
		background-color: var(--main-color);
	}
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_label  {
		background-color: var(--accent-color3);
	}
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5) {
		background-color: var(--main-color);
	}
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5)  {
		background-color: var(--accent-color3);
	}
	.family-trouble-card .card_link:hover::after {
		opacity: 1;
	}
	.family-trouble-card .card_link:hover .card_title {
		color: var(--hover-color2);
		text-decoration: underline;
	}

	/* --- No.8 --- */
	.family-heading2 {
		margin: 3em 0 1.2em;
		padding-bottom: .6em;
		border-bottom: 2px solid var(--sub-color8);
	}
	.family-heading2 + * {
		margin-top: 18px!important;
	}
	.family-heading2 .heading_title {
		font-size: 20px;
		line-height: 1.8;
		font-weight: bold;
		position: relative;
	}
	.family-heading2 .heading_title rt {
		font-size: 10px
	}
	.family-heading2 .heading_inner{
		position: relative;
		padding: 0 0 0 25px
	}
	.family-heading2 .heading_inner::after {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 8px;
		height: 100%;
		border-radius: 4px;
		background: var(--main-color);
		content: "";
	}

	/* --- No.9 --- */
	.family-button-wrap,
	.family-button-wrap--center {
		display: flex;
		flex-flow: row wrap;
		margin-top: 1.8em;
	}
	.family-button-wrap--center {
		justify-content: center;
	}
	.family-button {
		margin-top: 1.8em;
	}
	.family-button [class*="button_type"] {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		min-height: 68px;
		border-radius: 50px;
		padding: 0.6em 3.4em;
		background-color: var(--main-color);
	}
	.family-button [class*="button_type"]:hover{
		background-color: var(--hover-color);
	}
	.family-button .family-button_type::after {
		position: absolute;
		top: 50%;
		right: 21px;
		width: 21px;
		height: 15px;
		margin-top: -7px;
		background: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		content: '';
	}
	.family-button .family-button_type-blank::after {
		content: "";
		display: inline-block;
		position: absolute;
		top: 50%;
		right: 21px;
		width: 13px;
		height: 12px;
		margin-top: -6px;
		background: url("/extlib/family/img/cmn_ic_001_02.svg") no-repeat 0 0;
		background-size: contain;
	}
	.family-button .button_label{
		display: inline-block;
		font-size: 19px;
		line-height: 1.6;
		color: var(--bright-color);
	}
	.family-button .button_label rt{
		font-size: 10px;
	}
	/* --- No.10 --- */
	.family-colors-box {
		display: flex;
		flex-flow: row wrap;
		margin: 2em 0 0;
	}
	.family-colors-box > .box_item {
		width: calc((100% - (36px * 2)) / 3);
		margin-right: 24px;
	}
	.family-colors-box > .box_item:nth-child(3n) {
		margin-right: 0;
	}
	.family-colors-box > .box_item:nth-child(n+4) {
		margin-top: 1.8em;
	}
	.family-colors-box .box_item {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 164px;
		border-radius: 10px;
		padding: 1.6em 1em 1em;
		background-color: var(--sub-color);
	}
	.family-colors-box .box_item:nth-of-type(5n) {
		background-color: var(--sub-color6);
	}
	.family-colors-box .box_item:nth-of-type(5n+1) {
		background-color: var(--sub-color);
	}
	.family-colors-box .box_item:nth-of-type(5n+2){
		background-color: var(--sub-color3);
	}
	.family-colors-box .box_item:nth-of-type(5n+3) {
		background-color: var(--sub-color4);
	}
	.family-colors-box .box_item:nth-of-type(5n+4) {
		background-color: var(--sub-color5);
	}
	.family-colors-box .box_item .box_text {
		text-align: center;
		font-size: 18px;
		line-height: 1.8;
	}
	.family-colors-box .box_item .box_text rt {
		font-size: 10px;
	}
	.family-colors-box-v2 {
		display: flex;
		flex-flow: row wrap;
		margin: 2em 0 0;
	}
	.family-colors-box-v2 > .box_item {
		width: calc((100% - (36px * 2)) / 3);
		margin-right: 24px;
	}
	.family-colors-box-v2 > .box_item:nth-child(3n) {
		margin-right: 0;
	}
	.family-colors-box-v2 > .box_item:nth-child(n+4) {
		margin-top: 1.8em;
	}
	.family-colors-box-v2 .box_item {
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		padding: 24px 1em;
		background-color: var(--sub-color);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n) {
		background-color: var(--sub-color6);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+1) {
		background-color: var(--sub-color);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+2){
		background-color: var(--sub-color3);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+3) {
		background-color: var(--sub-color4);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+4) {
		background-color: var(--sub-color5);
	}
	.family-colors-box-v2 .box_item .box_text {
		text-align: center;
		font-size: 18px;
		line-height: 1.8;
	}
	.family-colors-box-v2 .box_item .box_text rt {
		font-size: 10px;
	}
		/* --- No.11 --- */
	.family-inquiry{
		margin-top: 2em;
	}
	.family-inquiry .family-inquiry_box{
		overflow: hidden;
		border-radius: 10px;
		border: 2px solid var(--sub-color2);
	}
	.family-inquiry .family-inquiry_box .family-inquiry_heading{
		padding: 1.4em 1.4em 0.8em;
		background: var(--sub-color2);
		color: var(--sub-color7);
	}
	.family-inquiry .family-inquiry_box .family-inquiry_title{
		text-align: center;
		font-size: 20px;
		line-height: 1.8;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_title rt{
		font-size: 10px;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_detail{
		padding: 1.4em;
		background: var(--bg-color);
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description > :first-child{
		margin-top: 0!important;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_text{
		margin: 15px 0 0;
		text-align: center;
		font-size: 16px;
		line-height: 1.8;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel{
		margin: 15px 0 0;
		text-align: center;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel a{
		display: inline-block;
		padding-left: 40px;
		background: url("/extlib/family/img/cmn_ic_004.svg") no-repeat left center/31px 33px;
		font-weight: bold;
		font-size: 38px;
		line-height: 1;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel a:link,
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel a:visited{
		color: inherit;
	}
	/* --- No.12 --- */
	.family-tab > .family-tab_head{
		margin: 3.0em 0;
	}
	.family-tab > .family-tab_foot{
		margin: 3.0em 0;
	}
	.family-tab .family-tab_list{
		display: flex;
		flex-flow: row wrap;
	}
	.family-tab .family-tab_list > li{
		width: calc((100% - (24px * 3)) / 4);
		margin-right: 24px;
	}
	.family-tab .family-tab_list > li:nth-child(4n){
		margin-right: 0;
	}
	.family-tab .family-tab_list > li a.family-tab_button{
		position: relative;
		display: flex;
		flex-flow: column wrap;
		align-items: center;
		height: 100%;
		border: 2px solid var(--sub-color);
		padding: 1.0em 1.0em 1.4em;
		border-radius: 10px;
		background: var(--sub-color);
		color: inherit;
	}
	.family-tab .family-tab_list > li a.family-tab_button:hover{
		border: 2px solid var(--main-color);
	}
	.family-tab .family-tab_list > li .family-tab_button .family-tab_number{
		width: 50px;
	}
	.family-tab .family-tab_list > li .family-tab_button .family-tab_text{
		display: inline-block;
		margin-top: 0.5em;
		font-size: 17px;
		line-height: 1.4;
	}
	.family-tab .family-tab_list > li .family-tab_button .family-tab_label{
		display: inline-block;
		margin-top: 0.6em;
		padding: 3px 11px;
		border-radius: 50px;
		background-color: var(--bg-color);
		line-height: 1.4;
	}
	.family-tab .family-tab_list > li.is-current a.family-tab_button{
		border: 2px solid var(--main-color);
		background: var(--bg-color);
		pointer-events: none;
	}
	.family-tab > .family-tab_head .family-tab_list > li.is-current a.family-tab_button::before{
		position: absolute;
		bottom: -20px;
		left: 50%;
		margin-left: -15px;
		border-top: 18px solid var(--main-color);
		border-right: 15px solid transparent;
		border-left: 15px solid transparent;
		content: '';
	}
	.family-tab > .family-tab_head .family-tab_list > li.is-current a.family-tab_button::after{
		position: absolute;
		bottom: -17px;
		left: 50%;
		margin-left: -15px;
		border-top: 18px solid var(--bg-color);
		border-right: 15px solid transparent;
		border-left: 15px solid transparent;
		content: '';
	}
	.family-tab > .family-tab_foot .family-tab_list > li.is-current a.family-tab_button::before{
		position: absolute;
		top: -20px;
		left: 50%;
		margin-left: -15px;
		border-bottom: 18px solid var(--main-color);
		border-right: 15px solid transparent;
		border-left: 15px solid transparent;
		content: '';
	}
	.family-tab > .family-tab_foot .family-tab_list > li.is-current a.family-tab_button::after{
		position: absolute;
		top: -17px;
		left: 50%;
		margin-left: -15px;
		border-bottom: 18px solid var(--bg-color);
		border-right: 15px solid transparent;
		border-left: 15px solid transparent;
		content: '';
	}
	.family-tab .family-tab_list > li.is-current .family-tab_button .family-tab_text{
		color: var(--main-color);
	}
	.family-tab .family-tab_list > li.is-current .family-tab_button .family-tab_label{
		background: var(--sub-color);
	}
	/* --- No.13 --- */
	.family-text {
		margin: 7px 0 0;
		line-height: 2;
		font-size: 15px;
	}
	.family-text rt {
		font-size: 10px;
	}
	/* --- No.14 --- */
	.family-box {
		margin: 1.8em 0 0 0;
		border: 2px solid var(--sub-color8);
		border-radius: 8px;
	}
	.family-box .family-box_head {
		padding: 1.6em 1.875em .6em;
	}
	.family-box .family-box_body {
		padding: .6em 1.875em 1.6em;
	}
	.family-box .family-box_head + .family-box_body {
		padding-top: 0;
	}
	.family-box .family-box_title {
		font-size: 17px;
		color: var(--main-color);
		font-weight: 500;
		line-height: 1.6;
	}
	.family-box .family-box_text {
		font-size: 15px;
		color: var(--text-color);
		line-height: 1.6;
	}
	/* --- No.15 --- */
	.classified-table .tabel_head {
		text-align: right;
		margin-bottom: 0.2em;
	}
	.classified-table .table_utility {
		position: relative;
		padding-left: 18px;
		display: inline-block;
	}
	.classified-table .table_utility li {
		font-size: 13px;
	}
	.classified-table .table_utility .utility_mark {
		width: 14px;
		position: absolute;
		left: 0;
		margin: 4px 0 0 0;
	}
	.classified-table .tabel_wrap {
		display: flex;
	}
	.classified-table .tabel_wrap .tabel_item {
		width: 590px;
	}
	.classified-table .tabel_wrap .tabel_item:nth-child(n+2) {
		margin-left: 20px;
	}
	/* --- No.16 --- */
	.comical-link {
		display: flex;
		margin: 2em 0 0;
	}
	.comical-link .link_item {
		width: calc((100% - 36px) / 2);
		padding: 28px 0 30px;
	}
	.comical-link .link_item + .link_item {
		margin-left: 36px;
	}
	.comical-link .link_item .item_inner {
		display: flex;
		align-items: center;
		width: 100%;
		height: 100%;
		min-height: 234px;
		padding: 0 30px;
		border-radius: 8px;
		background: var(--sub-color);
	}
	.comical-link .link_item .item_head {
		position: relative;
		flex-shrink: 0;
		width: 278px;
		height: 100%;
	}
	.comical-link .link_item .item_head::before {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		left: 0;
		width: 278px;
		height: 278px;
		border-radius: 50%;
		background: var(--bright-color);
		transform: translateY(-50%);
		z-index: 1;
	}
	.comical-link .link_item .item_image {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 2;
	}
	.comical-link .link_item:nth-of-type(1) .item_image {
		width: 302px;
	}
	.comical-link .link_item:nth-of-type(2) .item_image {
		width: 272px;
	}
	.comical-link .link_item .item_body {
		width: 100%;
		padding: 30px 0;
		margin-left: 30px;
	}
	.comical-link .link_item .item_body > :first-child {
		margin-top: 0!important;
	}

	/* --- No.17 --- */
	.family-ornament {
		display: flex;
		justify-content: center;
		margin: 2em 0 0;
	}
	.family-ornament .ornament_item {
		width: 148px;
	}
	.family-ornament .ornament_item + .ornament_item {
		margin-left: 30px;
	}


	/* --- .family-list-wrap --- */
	.family-list-wrap {
		display: flex;
		margin: 2em 0 0;
	}
	.family-list-wrap > :first-child {
		margin-top: 0!important;
	}

	/* --- .family-unorder-list --- */
	.family-unorder-list {
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.family-unorder-list > :first-child {
		margin-top: 0!important;
	}
	.family-unorder-list > li {
		position: relative;
		margin-top: 12px;
		padding: 0 0 0 24px;
		text-indent: -24px;
	}
	.family-unorder-list > li::before {
		content: "";
		display: inline-block;
		position: relative;
		top: 0;
		left: 0;
		width: 10px;
		height: 10px;
		margin-right: 14px;
		border-radius: 50%;
		background-color: var(--main-color);
	}
	.family-unorder-list > li rt {
		font-size: 10px;
	}

	/* --- .family-link-list --- */
	.family-link-list {
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.family-link-list > :first-child {
		margin-top: 0!important;
	}
	.family-link-list > li {
		position: relative;
		margin-top: 7px;
		padding: 0 0 0 14px;
		text-indent: -14px;
	}
	.family-link-list > li > [class*="link_type"] {
		color: var(--accent-color2);
		font-weight: 500;
	}
	.family-link-list > li > [class*="link_type"]:hover {
		color: var(--hover-color2);
		text-decoration: underline;
	}
	.family-link-list > li > [class*="link_type"]::before {
		content: "";
		display: inline-block;
		position: relative;
		top: 0;
		left: 0;
		margin-right: 8px;
		border-style: solid;
		border-width: 5px 0 5px 6px;
		border-color: transparent transparent transparent var(--accent-color);
	}
	.family-link-list > li > .link_type-blank::after {
		content: "";
		display: inline-block;
		position: relative;
		top: 1px;
		width: 12px;
		height: 12px;
		margin-left: 6px;
		background: url("/extlib/family/img/cmn_ic_001_03.svg") no-repeat 0 0 / contain;
	}
	.family-link-list > li rt {
		font-size: 10px;
	}

	/* --- .family-note-list --- */
	.family-note-list {
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.family-note-list > :first-child {
		margin-top: 0!important;
	}
	.family-note-list > li {
		position: relative;
		margin-top: 12px;
		padding: 0 0 0 16px;
		font-size: 13px;
		text-indent: -16px;
	}
	.family-note-list > li .note_mark {
		position: relative;
		top: 0;
		left: 0;
		margin-right: 3px;
	}
	.family-note-list > li rt {
		font-size: 10px;
	}

	/* --- .family-heading3 --- */
	.family-heading3 {
		margin: 36px 0 14px;
		padding-bottom: 10px;
		border-bottom: 2px solid var(--main-color);
	}
	.family-heading3 + * {
		margin-top: 14px!important;
	}
	.family-heading3 .heading_title {
		font-size: 18px;
		line-height: 1.4;
		font-weight: bold;
	}
	.family-heading3 .heading_title rt {
		font-size: 10px
	}

	/* --- .family-table --- */
	.family-table {
		margin: 24px 0 0;
		border-radius: 8px;
		border: 2px solid var(--sub-color9);
		overflow: hidden;
	}
	.family-table .table_matrix {
		width: 100%;
		border-collapse: collapse;
		border-spacing: 0;
		table-layout: fixed;
	}
	.family-table [class*="_cell"] {
		padding: .8em 1em;
		border-top: 2px solid var(--sub-color9);
		border-left: 2px solid var(--sub-color9);
		background-color: var(--bg-color);
		text-align: left;
		vertical-align: top;
	}
	.family-table tr:first-child [class*="_cell"] {
		border-top: none;
	}
	.family-table tr [class*="_cell"]:first-child {
		border-left: none;
	}
	.family-table [class*="_cell--lv1"] {
		background-color: var(--sub-color);
		font-weight: bold;
	}

}



/* ======================================================
* PC Media Queries
====================================================== */
@media screen and (min-width: 768px) and (max-width: 1224px) {
}

/* ======================================================
* SP
====================================================== */
@media only screen and (max-width: 767px) {
	/* ------------------------------------------------------
	* Override
	------------------------------------------------------ */

	/* ------------------------------------------------------
	* Util
	------------------------------------------------------ */
	.util-sp-hidden { display: none!important; }

	/* ----- data-size-sp ----- */
	[data-size-sp] > * { width: 100%; }
	[data-size-sp="1per"]{width:1%!important;}[data-size-sp="2per"]{width:2%!important;}[data-size-sp="3per"]{width:3%!important;}[data-size-sp="4per"]{width:4%!important;}[data-size-sp="5per"]{width:5%!important;}[data-size-sp="6per"]{width:6%!important;}[data-size-sp="7per"]{width:7%!important;}[data-size-sp="8per"]{width:8%!important;}[data-size-sp="9per"]{width:9%!important;}[data-size-sp="10per"]{width:10%!important;}[data-size-sp="11per"]{width:11%!important;}[data-size-sp="12per"]{width:12%!important;}[data-size-sp="13per"]{width:13%!important;}[data-size-sp="14per"]{width:14%!important;}[data-size-sp="15per"]{width:15%!important;}[data-size-sp="16per"]{width:16%!important;}[data-size-sp="17per"]{width:17%!important;}[data-size-sp="18per"]{width:18%!important;}[data-size-sp="19per"]{width:19%!important;}[data-size-sp="20per"]{width:20%!important;}[data-size-sp="21per"]{width:21%!important;}[data-size-sp="22per"]{width:22%!important;}[data-size-sp="23per"]{width:23%!important;}[data-size-sp="24per"]{width:24%!important;}[data-size-sp="25per"]{width:25%!important;}[data-size-sp="26per"]{width:26%!important;}[data-size-sp="27per"]{width:27%!important;}[data-size-sp="28per"]{width:28%!important;}[data-size-sp="29per"]{width:29%!important;}[data-size-sp="30per"]{width:30%!important;}[data-size-sp="31per"]{width:31%!important;}[data-size-sp="32per"]{width:32%!important;}[data-size-sp="33per"]{width:33%!important;}[data-size-sp="34per"]{width:34%!important;}[data-size-sp="35per"]{width:35%!important;}[data-size-sp="36per"]{width:36%!important;}[data-size-sp="37per"]{width:37%!important;}[data-size-sp="38per"]{width:38%!important;}[data-size-sp="39per"]{width:39%!important;}[data-size-sp="40per"]{width:40%!important;}[data-size-sp="41per"]{width:41%!important;}[data-size-sp="42per"]{width:42%!important;}[data-size-sp="43per"]{width:43%!important;}[data-size-sp="44per"]{width:44%!important;}[data-size-sp="45per"]{width:45%!important;}[data-size-sp="46per"]{width:46%!important;}[data-size-sp="47per"]{width:47%!important;}[data-size-sp="48per"]{width:48%!important;}[data-size-sp="49per"]{width:49%!important;}[data-size-sp="50per"]{width:50%!important;}[data-size-sp="51per"]{width:51%!important;}[data-size-sp="52per"]{width:52%!important;}[data-size-sp="53per"]{width:53%!important;}[data-size-sp="54per"]{width:54%!important;}[data-size-sp="55per"]{width:55%!important;}[data-size-sp="56per"]{width:56%!important;}[data-size-sp="57per"]{width:57%!important;}[data-size-sp="58per"]{width:58%!important;}[data-size-sp="59per"]{width:59%!important;}[data-size-sp="60per"]{width:60%!important;}[data-size-sp="61per"]{width:61%!important;}[data-size-sp="62per"]{width:62%!important;}[data-size-sp="63per"]{width:63%!important;}[data-size-sp="64per"]{width:64%!important;}[data-size-sp="65per"]{width:65%!important;}[data-size-sp="66per"]{width:66%!important;}[data-size-sp="67per"]{width:67%!important;}[data-size-sp="68per"]{width:68%!important;}[data-size-sp="69per"]{width:69%!important;}[data-size-sp="70per"]{width:70%!important;}[data-size-sp="71per"]{width:71%!important;}[data-size-sp="72per"]{width:72%!important;}[data-size-sp="73per"]{width:73%!important;}[data-size-sp="74per"]{width:74%!important;}[data-size-sp="75per"]{width:75%!important;}[data-size-sp="76per"]{width:76%!important;}[data-size-sp="77per"]{width:77%!important;}[data-size-sp="78per"]{width:78%!important;}[data-size-sp="79per"]{width:79%!important;}[data-size-sp="80per"]{width:80%!important;}[data-size-sp="81per"]{width:81%!important;}[data-size-sp="82per"]{width:82%!important;}[data-size-sp="83per"]{width:83%!important;}[data-size-sp="84per"]{width:84%!important;}[data-size-sp="85per"]{width:85%!important;}[data-size-sp="86per"]{width:86%!important;}[data-size-sp="87per"]{width:87%!important;}[data-size-sp="88per"]{width:88%!important;}[data-size-sp="89per"]{width:89%!important;}[data-size-sp="90per"]{width:90%!important;}[data-size-sp="91per"]{width:91%!important;}[data-size-sp="92per"]{width:92%!important;}[data-size-sp="93per"]{width:93%!important;}[data-size-sp="94per"]{width:94%!important;}[data-size-sp="95per"]{width:95%!important;}[data-size-sp="96per"]{width:96%!important;}[data-size-sp="97per"]{width:97%!important;}[data-size-sp="98per"]{width:98%!important;}[data-size-sp="99per"]{width:99%!important;}[data-size-sp="100per"]{width:100%!important;}

	/* ----- data-col-sp ----- */
	[data-col-sp]:not([data-col-sp="1"]) {
		display: flex;
		flex-flow: row wrap;
	}
	[data-col-sp]:not([data-col-sp="auto"]) > * {
		margin: 1rem 0 0 15px;
	}
	[data-col-sp="1"] > * {width: 100%;}
	[data-col-sp="2"] > * {width: calc((100% - (15px * 1)) / 2);}
	[data-col-sp="3"] > * {width: calc((100% - (15px * 2)) / 3);}
	[data-col-sp="4"] > * {width: calc((100% - (15px * 3)) / 4);}
	[data-col-sp="1"] > *,
	[data-col-sp="2"] > *:nth-child(2n+1),
	[data-col-sp="3"] > *:nth-child(3n+1),
	[data-col-sp="4"] > *:nth-child(4n+1) {
		margin-left: 0!important;
	}
	[data-col-sp="1"] > *:first-child,
	[data-col-sp="2"] > *:nth-child(-n+2),
	[data-col-sp="3"] > *:nth-child(-n+3),
	[data-col-sp="4"] > *:nth-child(-n+4) {
		margin-top: 0!important;
	}
	
	.util-link--blank {
		color: var(--accent-color2);
	}
	.util-link--blank::after {
		content: "";
		position: relative;
		display: inline-block;
		top: -1px;
		width: 11px;
		height: 11px;
		margin: 0 0.5em;
		background: url("/extlib/family/img/cmn_ic_001_03.svg") no-repeat 0 0 / contain;
		vertical-align: middle;
	}

	/* ------------------------------------------------------
	* Layout
	------------------------------------------------------ */
	/* --- Main_head --- */
	.family-Main_head {
		width: 100%;
	}

	/* --- Main_content --- */
	.family-Main_content {
		width: 100%;
		margin: 0 auto;
		padding: 2.5em 12px 3.57em;
	}

	/* --- family-header --- */
	.family-header {
		position: relative;
		width: 100%;
		margin: 0 auto;
	}
	.family-header .header_head {
		position: relative;
		width: 100%;
		background: linear-gradient(0deg, rgb(157,213,245) 0%, rgb(86,186,234) 54%, rgb(30,172,229) 100%);
		z-index: 1;
	}
	.family-header .header_head .head_image {
		position: relative;
		text-align: center;
	}
	.family-header .header_head .header_button {
		position: absolute;
		top: 30.4vw;
		left: 50%;
		transform: translateX(-50%);
	}
	.family-header .header_head .header_button > [class*="button_link"] {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5px 26px;
		border-radius: 18px;
		border: 1px solid var(--sub-color7);
		background: var(--bg-color);
		color: var(--text-color);
		font-size: 14px;
		font-weight: 500;
	}
	.family-header .header_head .header_button > .button_link-back {
		padding-left: 41px;
	}
	.family-header .header_head .header_button > .button_link-back::before {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		left: 14px;
		width: 16px;
		height: 12px;
		background: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		background-size: contain;
		background-blend-mode: multiply;
		-webkit-mask: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		mask: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		background-color: var(--main-color);
		transform-origin: center;
		transform: translateY(-50%) rotate(180deg);
	}
	.family-header .header_body {
	}

	/* --- family-lnav --- */
	.family-lnav {
		width: 100%;
	}
	.family-lnav .lnav_list {
		position: fixed;
		bottom: 0;
		left: 0;
		display: flex;
		width: 100%;
		height: 70px;
		border-radius: 8px 8px 0 0;
		background: var(--bg-color);
		overflow: hidden;
		z-index: 101;
	}
	.family-lnav .lnav_list > li {
		position: relative;
		width: calc((100% - (1px * 4))/5);
		height: 100%;
		margin: 0 0 0 1px;
	}
	.family-lnav .lnav_list > li:first-child {
		margin-left: 0;
	}
	.family-lnav .lnav_list > li > [class*="list_button"] {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		padding: 3px 5px 36px;
		background: var(--main-color);
		color: var(--bright-color);
		font-size: 10px;
		font-weight: 500;
		line-height: 1.4;
		text-align: center;
	}
	.family-lnav .lnav_list > li > .list_button-blank .button_label::before {
		content: "";
		display: inline-block;
		position: relative;
		width: 9px;
		height: 8px;
		margin-right: 3px;
		background: url("/extlib/family/img/cmn_ic_001_02.svg") no-repeat 0 0;
		background-size: contain;
	}
	.family-lnav .lnav_list > li > [class*="list_button"] .button_icon {
		position: absolute;
		bottom: 4px;
		left: 50%;
		width: 31px;
		height: 30px;
		transform: translateX(-50%);
	}
	.family-lnav .lnav_list > li > [class*="list_button"] .button_icon > img {
		object-fit: contain;
	}
	.family-lnav .lnav_nest {
		display: none;
		width: 100%;
		padding: 10px 15px;
		background: var(--sub-color);
	}
	.family-lnav .lnav_nest .nest_list {
		display: flex;
		flex-flow: row wrap;
	}
	.family-lnav .lnav_nest .nest_list > li {
		width: calc((100% - (5px * 2))/3);
		margin: 5px 0 0 5px;
	}
	.family-lnav .lnav_nest .nest_list > li:nth-of-type(-n+3) {
		margin-top: 0;
	}
	.family-lnav .lnav_nest .nest_list > li:nth-of-type(3n+1) {
		margin-left: 0;
	}
	.family-lnav .lnav_nest .nest_list > li > [class*="nest_button"] {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		padding: 12px 5px;
		border-radius: 8px;
		border: 1px solid var(--main-color);
		background: var(--main-color);
		color: var(--bright-color);
		font-size: 12px;
		font-weight: 500;
		line-height: 1.4;
		text-align: center;
	}
	.family-lnav .lnav_nest .nest_list > li.is-current > [class*="nest_button"] {
		background: var(--bg-color);
		color: var(--main-color);
	}

	/* --- family-trouble-carousel --- */
	.family-trouble-carousel {
		padding: 19px 15px 31px;
		background: var(--sub-color);
	}
	.family-trouble-carousel .carousel_inner {
		width: 100%;
		margin: 0 auto;
	}
	.family-trouble-carousel .carousel_head {
	}
	.family-trouble-carousel .carousel_heading {
		font-size: 16px;
		font-weight: 500;
		line-height: 1.4;
		text-align: center;
	}
	.family-trouble-carousel .carousel_heading rt {
		font-size: 10px;
	}
	.family-trouble-carousel .carousel_body {
		position: relative;
		margin: 15px 0 0;
		padding: 0 6px;
	}
	.family-trouble-carousel .carousel_list {
		width: calc(100% + 10px);
		margin: 0 -5px;
		opacity: 0;
	}
	.family-trouble-carousel .carousel_list.slick-initialized {
		opacity: 1;
	}
	.family-trouble-carousel .carousel_list.slick-slider {
		overflow: hidden;
	}
	.family-trouble-carousel .carousel_item {
		height: 100%;
		padding: 0 5px;
	}
	.family-trouble-carousel .carousel_item > :first-child {
		margin-top: 0!important;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow {
		appearance: none;
		position: absolute;
		top: 50%;
		width: 30px;
		height: 30px;
		margin-top: -11px;
		border-radius: 50%;
		border: none;
		background: var(--main-color);
		white-space: nowrap;
		text-indent: -100vw;
		overflow: hidden;
		transform: translateY(-50%);
		cursor: pointer;
		z-index: 2;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow::before {
		content: "";
		display: block;
		position: absolute;
		box-sizing: border-box;
		top: 50%;
		width: 9.5px;
		height: 9.5px;
		border: solid var(--bright-color);
		transform-origin: center;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-prev {
		left: -10px;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-next {
		right: -10px;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-prev::before {
		left: 12px;
		border-width: 2.5px 0 0 2.5px;
		transform: translateY(-50%) rotate(-45deg) ;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow.slick-next::before {
		right: 12px;
		border-width: 2.5px 2.5px 0 0;
		transform: translateY(-50%) rotate(45deg) ;
	}
	.family-trouble-carousel .carousel_arrows .slick-arrow:hover {
		background: var(--hover-color);
	}

	/* ------------------------------------------------------
	* Parts
	------------------------------------------------------ */
	/* --- No.3 --- */
	.family-heading1 {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 3em auto 1.6em;
	}
	.family-Main .family-heading1 + * {
		margin-top: 22.5px;
	}
	.family-heading1 .heading_inner {
		text-align: center;
	}
	.family-heading1 .heading_subtitle {
		color: var(--main-color);
		font-weight: 500;
		line-height: 1.4;
	}
	.family-heading1 .heading_title {
		font-size: 22px;
		font-weight: 500;
		line-height: 1.8;
	}
	.family-heading1 .heading_subtitle + .heading_title {
		margin-top: 3px;
	}
	.family-heading1 .heading_title rt {
		font-size: 11px;
	}

	/* --- No.4 --- */
	.family-dotted {
		background-image: url("/extlib/family/img/cmn_ex_001_sp.png");
		background-repeat: repeat;
		background-size: 6px 42px;
		margin: 1.6em auto 0;
		line-height: 3.05;
		text-align: center;
		font-size: 14px;
		width: 100%;
		max-width: 340px;
	}
	.family-dotted rt {
		font-size: 10px;
	}
	/* --- No.5 --- */
	.family-lead {
		margin: 1.6em 0 0;
		font-size: 15px;
		font-weight: 500;
		line-height: 1.8;
		text-align: center;
	}
	.family-lead rt {
		font-size: 10px;
	}
/* --- No.6 --- */
	.family-story {
		margin-top: 1.4em;
	}
	.family-story .family-story_heading {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		margin-bottom: 2em;
	}
	.family-story .family-story_heading .heading_subtitle {
		display: inline-block;
		padding: 0 18px;
		color: var(--text-color);
		font-size: 19px;
		font-weight: bold;
		background: var(--sub-color8);
		border-radius: 10px;
	}
	.family-story .family-story_heading .heading_subtitle .subtitle_small {
		font-size: 14px;
	}
	.family-story .family-story_heading .heading_title {
		margin-top: .72em;
		font-size: 18px;
		font-weight: bold;
		line-height: 1.4;
		color: var(--main-color);
		position: relative;
		display: inline-block;
	}
	.family-story .family-story_heading .heading_title rt {
		font-size: 11px;
		font-weight: 500;
	}
	.family-story .family-story_heading .heading_title::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: -8px;
		width: 100%;
		height: 4px;
		background-image: url("/extlib/family/img/cmn_ex_002_sp.png");
		background-repeat: repeat-x;
		background-size: 6.5px 4px;
	}
	.family-story .family-story_video {
		background-color: var(--sub-color);
		padding: 17px 15px 31px;
		margin: 0 -12px;
	}
	.family-story .family-story_video .video_caption {
		font-size: 12px;
		line-height: 1.6;
		margin-bottom: 0.7em;
	}
	.family-story .family-story_video .video_iframe {
		position: relative;
		width: 100%;
		padding-top: 56.25%;
	}
	.family-story .family-story_video .video_iframe iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border: none;
	}
	.family-story .family-story_video .video_content {
		width: 100%;
		padding: 1em 20px;
		border-radius: 0 0 8px 8px;
		background: var(--bg-color);
	}
	.family-story .family-story_video .video_rate {
		display: flex;
	}
	.family-story .family-story_video .video_rate > :first-child {
		margin-left: 0!important;
	}
	.family-story .family-story_video .video_rate > [class*="rate_item"] {
		width: calc((100% - 15px)/2);
		margin: 0 0 0 15px;
	}
	.family-story .family-story_video .video_rate .rate_label {
		display: inline-block;
		min-width: 88px;
		padding: 7px 4px;
		border-radius: 14px;
		color: var(--bright-color);
		font-size: 14px;
		text-align: center;
		line-height: 1;
	}
	.family-story .family-story_video .video_rate .rate_star {
		display: flex;
		margin: 10px 0 0;
	}
	.family-story .family-story_video .video_rate .rate_star .star_icon {
		display: inline-block;
		width: 20px;
		height: 20px;
		background: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		background-blend-mode: multiply;
		background-color: var(--disable-color);
		-webkit-mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		white-space: nowrap;
		text-indent: -100vw;
		overflow: hidden;
	}
	.family-story .family-story_video .video_rate .rate_star .star_icon + .star_icon {
		margin-left: 5px;
	}
	.family-story .family-story_video .video_rate > .rate_item-common .rate_label {
		background-color: var(--main-color);
	}
	.family-story .family-story_video .video_rate > .rate_item-dangerous .rate_label  {
		background-color: var(--accent-color3);
	}
	.family-story .family-story_video .video_rate > .rate_item-common .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-story .family-story_video .video_rate > .rate_item-common .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-story .family-story_video .video_rate > .rate_item-common .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-story .family-story_video .video_rate > .rate_item-common .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-story .family-story_video .video_rate > .rate_item-common .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5) {
		background-color: var(--main-color);
	}
	.family-story .family-story_video .video_rate > .rate_item-dangerous .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-story .family-story_video .video_rate > .rate_item-dangerous .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-story .family-story_video .video_rate > .rate_item-dangerous .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-story .family-story_video .video_rate > .rate_item-dangerous .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-story .family-story_video .video_rate > .rate_item-dangerous .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5)  {
		background-color: var(--accent-color3);
	}
	.family-story .family-story_link {
		margin: 13px -4px 0 0;
		text-align: right
	}
	.family-story .family-story_link .link_type {
		font-size: 14px;
		line-height: 1.6;
		color: var(--accent-color2);
		font-weight: 500;
		position: relative;
		padding-left: 6px;
	}
	.family-story .family-story_link .link_type:hover {
		color: var(--hover-color2);
		text-decoration: underline;
	}
	.family-story .family-story_link .link_type::before {
		content: "";
		position: absolute;
		top: 6px;
		left: 0;
		border-left: 6px solid var(--accent-color);
		border-top: 5px solid transparent;
		border-bottom: 5px solid transparent;
	}
	.family-story .family-story_link .link_type rt {
		font-size: 10px;
	}

	/* --- No.7 --- */
	.family-trouble-card-wrap {
		display: flex;
		flex-flow: row wrap;
		width: calc(100% + 24px);
		margin: 26px -12px 0;
		padding: 19px 12px 24px;
		border-radius: 8px;
		background: var(--sub-color);
	}
	.family-trouble-card-wrap > .family-trouble-card {
		width: calc((100% - (12px*1))/2)!important;
		margin: 12px 0 0 12px!important;
	}
	.family-trouble-card-wrap > .family-trouble-card:nth-of-type(-n+2) {
		margin-top: 0!important;
	}
	.family-trouble-card-wrap > .family-trouble-card:nth-of-type(2n+1) {
		margin-left: 0!important;
	}
	.family-trouble-card {
		position: relative;
		width: 100%;
		margin: 2em 0 0;
	}
	.family-trouble-card .card_link {
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
		border-radius: 8px;
		background: var(--bg-color);
		overflow: hidden;
		z-index: 1;
	}
	.family-trouble-card .card_head {
		width: 100%;
	}
	.family-trouble-card .card_image {
		width: 100%;
		text-align: center;
	}
	.family-trouble-card .card_body {
		padding: 0 15px 13px;
	}
	.family-trouble-card .card_label {
		position: relative;
		top: 0;
		left: -15px;
		display: inline-block;
		min-width: 58px;
		padding: 4px;
		border-radius: 0 0 8px 0;
		background: var(--sub-color8);
		color: var(--text-color);
		font-size: 11px;
		font-weight: 500;
		text-align: center;
		line-height: 1;
	}
	.family-trouble-card .card_label > em {
		font-style: normal;
		font-size: 14px;
	}
	.family-trouble-card .card_title {
		margin-top: 1px;
		padding: 6px 0 0 9px;
		color: var(--accent-color2);
		font-size: 16px;
		font-weight: 500;
		line-height: 1.8;
	}
	.family-trouble-card .card_title .title_label {
		position: relative;
	}
	.family-trouble-card .card_title .title_label::before {
		content: "";
		display: block;
		position: absolute;
		top: .5em;
		left: -9px;
		border: solid transparent;
		border-width: 5px 0 5px 6px;
		border-left-color: var(--accent-color);
	}
	.family-trouble-card .card_title rt {
		font-size: 10px;
	}
	.family-trouble-card .card_rate {
		margin: 10px 0 0;
	}
	.family-trouble-card .card_rate > :first-child {
		margin-top: 0!important;
	}
	.family-trouble-card .card_rate > [class*="rate_item"] {
		margin: 14px 0 0;
	}
	.family-trouble-card .card_rate .rate_label {
		display: inline-block;
		min-width: 88px;
		padding: 7px 4px;
		border-radius: 14px;
		color: var(--bright-color);
		font-size: 14px;
		text-align: center;
		line-height: 1;
	}
	.family-trouble-card .card_rate .rate_star {
		display: flex;
		margin: 10px 0 0;
	}
	.family-trouble-card .card_rate .rate_star .star_icon {
		display: inline-block;
		width: 20px;
		height: 20px;
		background: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		background-blend-mode: multiply;
		background-color: var(--disable-color);
		-webkit-mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		mask: url("/extlib/family/img/cmn_ic_002_01.svg") no-repeat center center / contain;
		white-space: nowrap;
		text-indent: -100vw;
		overflow: hidden;
	}
	.family-trouble-card .card_rate .rate_star .star_icon + .star_icon {
		margin-left: 5px;
	}
	.family-trouble-card .card_rate > .rate_item-common .rate_label {
		background-color: var(--main-color);
	}
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_label  {
		background-color: var(--accent-color3);
	}
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-trouble-card .card_rate > .rate_item-common .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5) {
		background-color: var(--main-color);
	}
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="1"] .star_icon:nth-of-type(-n+1),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="2"] .star_icon:nth-of-type(-n+2),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="3"] .star_icon:nth-of-type(-n+3),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="4"] .star_icon:nth-of-type(-n+4),
	.family-trouble-card .card_rate > .rate_item-dangerous .rate_star[data-rate-star="5"] .star_icon:nth-of-type(-n+5)  {
		background-color: var(--accent-color3);
	}

	/* --- No.8 --- */
	.family-heading2 {
		margin: 1.8em 0 .857em;
		padding-bottom: 5px;
		border-bottom: 2px solid var(--sub-color8);
	}
	.family-heading2 + * {
		margin-top: 12px!important;
	}
	.family-heading2 .heading_title {
		font-size: 17px;
		line-height: 1.8;
		font-weight: bold;
		position: relative;
	}
	.family-heading2 .heading_title rt {
		font-size: 10px
	}
	.family-heading2 .heading_inner{
		position: relative;
		padding: 0 0 0 15px;
	}
	.family-heading2 .heading_inner::after {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 6px;
		height: 100%;
		border-radius: 4px;
		background: var(--main-color);
		content: "";
	}
	/* --- No.9 --- */
	.family-button-wrap,
	.family-button-wrap--center {
		display: flex;
		flex-flow: row wrap;
		margin-top: 1.8em;
	}
	.family-button-wrap--center {
		justify-content: center;
	}
	.family-button {
		margin-top: 1.8em;
	}
	.family-button [class*="button_type"] {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		min-height: 65px;
		border-radius: 100px;
		padding: 1.15em 2.7em;
		background-color: var(--main-color);
	}
	.family-button .family-button_type::after {
		position: absolute;
		top: 50%;
		right: 14px;
		width: 15px;
		height: 12px;
		margin-top: -6px;
		background: url("/extlib/family/img/cmn_ic_001_01.svg") no-repeat 0 0;
		content: '';
	}
	.family-button .family-button_type-blank::before {
		content: "";
		display: inline-block;
		position: absolute;
		top: 50%;
		right: 14px;
		width: 13px;
		height: 12px;
		margin-top: -6px;
		background: url("/extlib/family/img/cmn_ic_001_02.svg") no-repeat 0 0;
		background-size: contain;
	}
	.family-button .button_label{
		display: inline-block;
		font-size: 17px;
		line-height: 1.6;
		color: var(--bright-color);
	}
	.family-button .button_label rt{
		font-size: 10px;
	}
	/* --- No.10 --- */
	.family-colors-box{
		display: flex;
		flex-flow: row wrap;
		margin: 16px 0 0;
	}
	.family-colors-box > .box_item{
		width: 100%;
	}
	.family-colors-box > .box_item:nth-child(n+2){
		margin-top: 1.0em;
	}
	.family-colors-box .box_item{
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 8px;
		padding: 1.6em 1.4em;
		background-color: var(--sub-color);
	}
	.family-colors-box .box_item:nth-of-type(5n){
		background-color: var(--sub-color6);
	}
	.family-colors-box .box_item:nth-of-type(5n+1){
		background-color: var(--sub-color);
	}
	.family-colors-box .box_item:nth-of-type(5n+2){
		background-color: var(--sub-color3);
	}
	.family-colors-box .box_item:nth-of-type(5n+3){
		background-color: var(--sub-color4);
	}
	.family-colors-box .box_item:nth-of-type(5n+4){
		background-color: var(--sub-color5);
	}
	.family-colors-box .box_item .box_text{
		text-align: center;
		font-size: 15px;
		line-height: 1.8;
	}
	.family-colors-box .box_item .box_text rt{
		font-size: 10px;
	}

	.family-colors-box-v2{
		display: flex;
		flex-flow: row wrap;
		margin: 16px 0 0;
	}
	.family-colors-box-v2 > .box_item{
		width: 100%;
	}
	.family-colors-box-v2 > .box_item:nth-child(n+2){
		margin-top: 1.0em;
	}
	.family-colors-box-v2 .box_item{
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 8px;
		padding: 17px 1em;
		background-color: var(--sub-color);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n){
		background-color: var(--sub-color6);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+1){
		background-color: var(--sub-color);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+2){
		background-color: var(--sub-color3);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+3){
		background-color: var(--sub-color4);
	}
	.family-colors-box-v2 .box_item:nth-of-type(5n+4){
		background-color: var(--sub-color5);
	}
	.family-colors-box-v2 .box_item .box_text{
		text-align: center;
		font-size: 15px;
		line-height: 1.8;
	}
	.family-colors-box-v2 .box_item .box_text rt{
		font-size: 10px;
	}
		/* --- No.11 --- */
	.family-inquiry{
		margin-top: 2em;
	}
	.family-inquiry .family-inquiry_box{
		overflow: hidden;
		border-radius: 10px;
		border: 2px solid var(--sub-color2);
	}
	.family-inquiry .family-inquiry_box .family-inquiry_heading{
		padding: 1.2em 1em 0.6em;
		background: var(--sub-color2);
		color: var(--sub-color7);
	}
	.family-inquiry .family-inquiry_box .family-inquiry_title{
		text-align: center;
		font-size: 15px;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_title rt{
		font-size: 10px;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_detail{
		padding: 1.2em 1em;
		background: var(--bg-color);
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_text{
		text-align: center;
		font-size: 14px;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel{
		text-align: center;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel a{
		display: inline-block;
		padding-left: 36px;
		background: url("/extlib/family/img/cmn_ic_004.svg") no-repeat left center/31px 33px;
		font-weight: bold;
		font-size: 34px;
	}
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel a:link,
	.family-inquiry .family-inquiry_box .family-inquiry_description_tel a:visited{
		color: inherit;
	}
	/* --- No.12 --- */
	.family-tab > .family-tab_head{
		margin: 3.0em 0;
	}
	.family-tab > .family-tab_foot{
		margin: 3.0em 0;
	}
	.family-tab .family-tab_list{
		display: flex;
		flex-flow: row wrap;
	}
	.family-tab .family-tab_list > li{
		width: calc((100% - (1px * 3)) / 4);
		margin-right: 1px;
	}
	.family-tab .family-tab_list > li:nth-child(4n){
		margin-right: 0;
	}
	.family-tab .family-tab_list > li a.family-tab_button{
		position: relative;
		display: flex;
		flex-flow: column wrap;
		align-items: center;
		height: 100%;
		border: 2px solid var(--sub-color);
		padding: 0.6em 0.6em 1.0em;
		background: var(--sub-color);
		color: inherit;
	}
	.family-tab .family-tab_list > li:nth-child(4n) a.family-tab_button{
		border-radius: 0 10px 10px 0;
		margin-right: 0;
	}
	.family-tab .family-tab_list > li:nth-child(4n+1) a.family-tab_button{
		border-radius: 10px 0 0 10px;
	}
	.family-tab .family-tab_list > li .family-tab_button .family-tab_number{
		width: 25px;
	}
	.family-tab .family-tab_list > li .family-tab_button .family-tab_text{
		display: inline-block;
		margin-top: 0.5em;
		text-align: center;
		font-size: 12px;
		line-height: 1.4;
	}
	.family-tab .family-tab_list > li .family-tab_button .family-tab_label{
		display: inline-block;
		margin-top: 0.6em;
		padding: 3px 10px;
		border-radius: 50px;
		background-color: var(--bg-color);
		text-align: center;
		font-size: 10px;
		line-height: 1.6;
	}
	.family-tab .family-tab_list > li.is-current a.family-tab_button{
		border: 2px solid var(--main-color);
		background: var(--bg-color);
		pointer-events: none;
	}
	.family-tab > .family-tab_head .family-tab_list > li.is-current a.family-tab_button::before{
		position: absolute;
		bottom: -11px;
		left: 50%;
		margin-left: -7px;
		border-top: 9px solid var(--main-color);
		border-right: 7px solid transparent;
		border-left: 7px solid transparent;
		content: '';
	}
	.family-tab > .family-tab_head .family-tab_list > li.is-current a.family-tab_button::after{
		position: absolute;
		bottom: -8px;
		left: 50%;
		margin-left: -7px;
		border-top: 9px solid var(--bg-color);
		border-right: 7px solid transparent;
		border-left: 7px solid transparent;
		content: '';
	}
	.family-tab > .family-tab_foot .family-tab_list > li.is-current a.family-tab_button::before{
		position: absolute;
		top: -11px;
		left: 50%;
		margin-left: -7px;
		border-bottom: 9px solid var(--main-color);
		border-right: 7px solid transparent;
		border-left: 7px solid transparent;
		content: '';
	}
	.family-tab > .family-tab_foot .family-tab_list > li.is-current a.family-tab_button::after{
		position: absolute;
		top: -8px;
		left: 50%;
		margin-left: -7px;
		border-bottom: 9px solid var(--bg-color);
		border-right: 7px solid transparent;
		border-left: 7px solid transparent;
		content: '';
	}
	.family-tab .family-tab_list > li.is-current .family-tab_button .family-tab_text{
		color: var(--main-color);
	}
	.family-tab .family-tab_list > li.is-current .family-tab_button .family-tab_label{
		background: var(--sub-color);
	}
	/* --- No.13 --- */
	.family-text {
		margin: 7px 0 0;
		line-height: 2;
		font-size: 14px;
	}
	.family-text rt {
		font-size: 10px;
	}
		/* --- No.14 --- */
	.family-box {
		margin: 1.4em 0 0 0;
		border: 2px solid var(--sub-color8);
		border-radius: 8px;
	}
	.family-box .family-box_head {
		padding: 1.2em 1em .6em;
	}
	.family-box .family-box_body {
		padding: .6em 1em 1.2em;
	}
	.family-box .family-box_head + .family-box_body {
		padding-top: 0;
	}
	.family-box_title {
		font-size: 15px;
		color: var(--main-color);
		font-weight: 500;
		line-height: 1.6;
	}
	.family-box_text {
		font-size: 14px;
		color: var(--text-color);
		line-height: 1.6;
	}
	/* --- No.15 --- */
	.classified-table .tabel_head {
		text-align: right;
		margin-bottom: 0.2em;
	}
	.classified-table .table_utility {
		position: relative;
		padding-left: 18px;
		display: inline-block;
	}
	.classified-table .table_utility li {
		font-size: 12px;
	}
	.classified-table .table_utility .utility_mark {
		width: 14.5px;
		position: absolute;
		left: 0;
		margin: 4px 0 0 0;
	}
	.classified-table .tabel_wrap .tabel_item {
		width: 100%
	}	/* --- No.16 --- */
	.comical-link {
		margin: 2em 0 0;
	}
	.comical-link .link_item {
		width: 100%;
		padding: 0;
	}
	.comical-link .link_item + .link_item {
		margin-top: 1.4em;
	}
	.comical-link .link_item .item_inner {
		width: 100%;
		height: 100%;
		padding: 0 1.4em 1em;
		border-radius: 8px;
		background: var(--sub-color);
	}
	.comical-link .link_item .item_head {
		position: relative;
		flex-shrink: 0;
		width: 100%;
		height: 163px;
	}
	.comical-link .link_item .item_head::before {
		content: "";
		display: block;
		position: absolute;
		top: -13px;
		left: 50%;
		width: 158px;
		height: 158px;
		border-radius: 50%;
		background: var(--bright-color);
		transform: translateX(-50%);
		z-index: 1;
	}
	.comical-link .link_item .item_image {
		position: relative;
		top: 0;
		left: 50%;
		width: 180px;
		transform: translateX(-50%);
		z-index: 2;
	}
	.comical-link .link_item:nth-of-type(1) {
		padding-top: 22px;
	}
	.comical-link .link_item:nth-of-type(1) .item_image {
		top: -22px;
	}
	.comical-link .link_item:nth-of-type(2) {
		padding-top: 30px;
	}
	.comical-link .link_item:nth-of-type(2) .item_image {
		top: -30px;
	}
	.comical-link .link_item .item_body {
		width: 100%;
		margin: 1em auto 0;
	}
	.comical-link .link_item .item_body > :first-child {
		margin-top: 0!important;
	}
	.comical-link .link_item .item_body .family-button-wrap {
		justify-content: center;
	}
	.comical-link .link_item .item_body .family-button-wrap .family-button {
		min-width: 165px;
		margin-top: 0;
	}

	/* --- No.17 --- */
	.family-ornament {
		display: flex;
		justify-content: center;
		margin: 2em 0 0;
	}
	.family-ornament .ornament_item {
		width: 89px;
	}
	.family-ornament .ornament_item + .ornament_item {
		margin-left: 14px;
	}


	/* --- .family-list-wrap --- */
	.family-list-wrap {
		display: flex;
		margin: 2em 0 0;
	}
	.family-list-wrap > :first-child {
		margin-top: 0!important;
	}

	/* --- .family-unorder-list --- */
	.family-unorder-list {
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.family-unorder-list > :first-child {
		margin-top: 0!important;
	}
	.family-unorder-list > li {
		position: relative;
		margin-top: 12px;
		padding: 0 0 0 18px;
		text-indent: -18px;
	}
	.family-unorder-list > li::before {
		content: "";
		display: inline-block;
		position: relative;
		top: 0;
		left: 0;
		width: 10px;
		height: 10px;
		margin-right: 8px;
		border-radius: 50%;
		background-color: var(--main-color);
	}
	.family-unorder-list > li rt {
		font-size: 10px;
	}

	/* --- .family-link-list --- */
	.family-link-list {
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.family-link-list > :first-child {
		margin-top: 0!important;
	}
	.family-link-list > li {
		position: relative;
		margin-top: 7px;
		padding: 0 0 0 12px;
		text-indent: -12px;
	}
	.family-link-list > li > [class*="link_type"] {
		color: var(--accent-color2);
		font-weight: 500;
	}
	.family-link-list > li > [class*="link_type"]::before {
		content: "";
		display: inline-block;
		position: relative;
		top: 0;
		left: 0;
		margin-right: 6px;
		border-style: solid;
		border-width: 5px 0 5px 6px;
		border-color: transparent transparent transparent var(--accent-color);
	}
	.family-link-list > li > .link_type-blank::after {
		content: "";
		display: inline-block;
		position: relative;
		top: 1px;
		width: 11px;
		height: 11px;
		margin-left: 6px;
		background: url("/extlib/family/img/cmn_ic_001_03.svg") no-repeat 0 0 / contain;
	}
	.family-link-list > li rt {
		font-size: 10px;
	}

	/* --- .family-note-list --- */
	.family-note-list {
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.family-note-list > :first-child {
		margin-top: 0!important;
	}
	.family-note-list > li {
		position: relative;
		margin-top: 12px;
		padding: 0 0 0 18px;
		font-size: 12px;
		text-indent: -18px;
	}
	.family-note-list > li .note_mark {
		position: relative;
		top: 0;
		left: 0;
		margin-right: 6px;
	}
	.family-note-list > li rt {
		font-size: 10px;
	}

	/* --- .family-heading3 --- */
	.family-heading3 {
		margin: 25px 0 12px;
		padding-bottom: 6px;
		border-bottom: 2px solid var(--main-color);
	}
	.family-heading3 + * {
		margin-top: 12px!important;
	}
	.family-heading3 .heading_title {
		font-size: 15px;
		line-height: 1.4;
		font-weight: bold;
	}
	.family-heading3 .heading_title rt {
		font-size: 10px
	}

	/* --- .family-table --- */
	.family-table {
		margin: 16px 0 0;
		border-radius: 8px;
		border: 2px solid var(--sub-color9);
		overflow: hidden;
	}
	.family-table .table_matrix {
		width: 100%;
		border-collapse: collapse;
		border-spacing: 0;
		table-layout: fixed;
	}
	.family-table col,
	.family-table tbody,
	.family-table tr,
	.family-table th,
	.family-table td {
		display: block;
		width: 100% !important;
	}
	.family-table [class*="_cell"] {
		padding: 7px 10px;
		border-top: 2px solid var(--sub-color9);
		background-color: var(--bg-color);
		text-align: left;
		vertical-align: top;
	}
	.family-table tr:first-child [class*="_cell"]:first-child {
		border-top: none;
	}
	.family-table [class*="_cell--lv1"] {
		background-color: var(--sub-color);
		font-weight: bold;
	}
}
/* ======================================================
* SP Media Queries
====================================================== */
@media only screen and (max-width: 340px) {
	/* --- No.4 --- */
	.family-dotted {
		width: calc(100% + 30px);
		margin-left: -15px;
		margin-right: -15px;
	}
}
@media only screen and (max-width: 480px) {
}

/* ======================================================
* Print
====================================================== */
@media print {
}