@charset "UTF-8";

.m_img {
    background-image: url(../images/family/m_img@2x.jpg);
}
/*---------------------------------------------------------
textstyle
---------------------------------------------------------*/
.cli_style1 {
	line-height: 1.6;
	letter-spacing: .15em;
	margin-bottom: .8em;
}
dt.cli_style1 {
	margin-bottom: .8em;
}
.cli_style1 b {
	display: block;
	color: #df7c00;
	font-size: 106%;
	margin-bottom: .6em;
}
.cli_style1 .ft_min {
	font-size: min(218%,3.1vw);
	letter-spacing: .12em;
	line-height: 1.6;
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.cli_style1 {
	letter-spacing: .12em;
}
.cli_style1 b {
	font-size: 100%;
	margin-bottom: .6em;
}
.cli_style1 .ft_min {
	font-feature-settings: "palt";
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.cli_style1 {
	letter-spacing: .06em;
}
.cli_style1 .com_deco_txt {
	font-size: 90%;
	margin-bottom: 1.2em;
}
.cli_style1 .ft_min {
	font-size: 150%;
	letter-spacing: .12em;
}
}
/*---------------------------------------------------------
layout
---------------------------------------------------------*/
/*fam_grid*/
.fam_grid {
	position: relative;
}
.fam_grid .com_deco_txt {
    text-align: left;
}
.fam_grid .box_img {
	position: relative;
}
.fam_grid .box_img .abs_txt {
	position: absolute;
	width: 15vw;
	max-width: 191px;
}
.fam_grid.col3 .box_img {/*col3*/
	max-width: 395px;
	margin: 0 auto 1.2em;
}
.fam_grid.col3 .box_img img {
    border-radius: 7.5% / 13.3%;
}
.fam_grid.col4 {/*col4*/
	text-align: center;
}
.fam_grid.col4 img {
	border-radius: 6.6%;
}
.fam_grid.col4 .cli_style1 {
	margin-top: 1em;
}
.fam_grid.col4 .cli_style1 .ft_min {
	font-size: min(2.2vw,187%);
	letter-spacing: .08em;
	line-height: 1.3;
	white-space: nowrap;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
/*fam_grid*/
.fam_grid {
	display: grid;
	grid-auto-columns: 1fr;
	justify-content: space-between;
	align-items: flex-start;
}
.fam_grid.col3 {
	grid-template-columns: repeat(3, min(31%,395px));
    max-width: 1300px;
    margin: 0 auto;
}
.fam_grid.col3 > div:nth-of-type(n+4) {
	margin-top: 60px;
}
.fam_grid.col4 {
	grid-template-columns: repeat(4, 23.5%);
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
/*fam_grid*/
.fam_grid .box_txt {
	width: 100%;
}
.fam_grid.col3 > div:nth-of-type(n+4) {
	margin-top: 50px;
}
.fam_grid.col4 .cli_style1 .ft_min {
	font-size: 2.4vw;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.fam_grid > div:not(:last-of-type) {
	margin-bottom: 10%;
}
.fam_grid .box_img {
	margin: 0 auto 1.5em;
}
.fam_grid .box_img .abs_txt {
	width: 28vw;
}
.fam_grid.col3 > div:not(:last-of-type) {
	padding-bottom: 8%;
	border-bottom: 1px solid #E6E6E6;
}
.fam_grid.col3 .box_img {/*col3*/
	width: 80%;
}
}
/*---------------------------------------------------------
bg
---------------------------------------------------------*/
.bg_yel {
    background-color: #FFFFD2;
    padding-bottom: 150px;
}
.bg_sun {
    position: relative;
}
.bg_sun::before {
    position: absolute;
    content: "";
    background: url(../images/common/bg_sun@2x.png) no-repeat;
    background-size: contain;
    width: min(36vw,529px);
    height: min(36vw,529px);
}
#lead.bg_sun::before {
    left: 75%;
    top: 50%;
    translate: 0 -50%;
}
#club .bg_sun::before {
    left: 55%;
    top: 60%;
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.bg_yel {
    padding-bottom: 14%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.bg_yel {
    padding-bottom: 16%;
}
.bg_sun::before {
    width: 50vw;
    height: 50vw;
}
#lead.bg_sun::before {
    left: 65%;
    top: 56vw;
    translate: 0;
}
#club .bg_sun::before {
    left: 45%;
    top: 75%;
}
}
/*---------------------------------------------------------
lead
---------------------------------------------------------*/
#lead .fam_grid .box_img {
    max-width: 647px;
}
#lead .fam_grid .box_img img {
    border-radius: 50%;
}
#lead .copy1 {
    position: relative;
    font-size: min(1.6vw,106%);
    font-weight: bold;
    letter-spacing: .12em;
    line-height: 1.5;
    white-space: nowrap;
    margin-top: -3em;
    margin-bottom: 1.5em;
}
#lead .copy1 .ft_jos {
    color: rgba(223,124,0,0.1);
    font-size: 484%;
    font-weight: 500;
    letter-spacing: .1em;
    line-height: 1;
}
#lead .copy1 p {
    position: absolute;
    left: 30%;
    bottom: 1.6em;
}
#lead .copy2 {
    font-size: min(4.5vw,325%);
    letter-spacing: .12em;
    line-height: 1.3;
}
#lead .copy2 img {
    display: inline-block;
    width: 4.2em;
    margin: 0;
    margin-right: .25em;
}
#lead .com_meteor {
    position: relative;
    translate: -30% 0;
    margin-top: -10%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
#lead .fam_grid {
    grid-template-columns: 50% 46%;
    max-width: 1300px;
    margin: 0 auto 50px;
}
#lead .fam_grid .box_img {
    max-width: 647px;
    translate: 0 -10%;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#lead .fam_grid .box_img img {
    width: 120%;
    max-width: max-content;
    margin-left: -20%;
}
#lead .copy1 {
    font-size: 100%;
    letter-spacing: .1em;
}
#lead .copy1 p {
    left: 15%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#lead .fam_grid .box_img {
    /* width: 80%;
    margin: 0 auto 5%; */    position: absolute;
    width: 65%;
    left: -15%;
    top: 20vw;
}
#lead .copy1 {
    font-size: 90%;
    letter-spacing: .08em;
    translate: 0 -2em;
    margin-top: 0;
}
#lead .copy1 .ft_jos {
    font-size: 400%;
}
#lead .copy1 p {
    position: relative;
    text-align: right;
    left: auto;
    bottom: auto;
    margin-top: -2.6em;
}
#lead .copy2 {
    position: relative;
    text-align: right;
    font-size: 160%;
    letter-spacing: .12em;
    line-height: 1.3;
    margin-right: 1em;
    margin-left: 30%;
    margin-top: 15vw;
}
#lead .copy2 img {
    display: inline-block;
    width: 4.2em;
    margin: 0;
    margin-right: .25em;
}
#lead .com_meteor {
    width: 90%;
    translate: 30% 0;
    margin-left: auto;
    margin-right: 0;
}
}
/*lead:ank_list
---------------------------------------------------------*/
#lead .ank_list a {
    position: relative;
    display: block;
    /* display: grid;
    justify-content: space-between;
    grid-template-columns: 42% 52%;
    align-items: center; */
    font-size: min(1.36vw,106%);
    letter-spacing: .14em;
    line-height: 1.5;
    white-space: nowrap;
    background-color: #fff;
    box-sizing: border-box;
    padding: 3em 6% 2em;
    border-radius: 1.7em;
    box-shadow: 0 0 10px rgba(0,0,0,0.06);
}
#lead .ank_list a:hover {
    background-color: rgba(255,255,255,0.7);
}
#lead .ank_list b {
    display: block;
    color: #DF7C00;
    margin-bottom: .5em;
}
#lead .ank_list .ft_min {
    font-size: 176%;
    letter-spacing: .12em;
}
#lead .ank_list .com_arw {
    margin-top: -1.5em;
    margin-left: auto;
}
#lead .ank_list img {
    border-radius: 50%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
#lead .ank_list {
    display: flex;
    justify-content: center;
}
#lead .ank_list > li {
    width: 48.6%;
    margin-right: 2.8%;
}
#lead .ank_list > li:last-of-type {
    margin-right: 0;
}
#lead .ank_list img {
    position: absolute;
    width: 37%;
    border-radius: 50%;
    left: 5%;
    top: -16%;
}
#lead .ank_list .txt {
    width: 56%;
    max-width: 300px;
    margin-left: auto;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#lead .ank_list a {
    font-size: 90%;
    letter-spacing: .12em;
    padding: 2em 6% 1em;
}
#lead .ank_list .ft_min {
    font-size: 2.4vw;
    letter-spacing: .1em;
}
#lead .ank_list img {
    width: 35%;
    top: -12%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#lead .ank_list > li {
    margin-top: 10%;
}
#lead .ank_list a {
    text-align: center;
    font-size: 100%;
    letter-spacing: .12em;
    padding: 0 8% 1.5em;
}
#lead .ank_list .ft_min {
    font-size: 150%;
    letter-spacing: .1em;
}
#lead .ank_list img {
    width: 50%;
    translate: 0 -12%;
}
}
/*---------------------------------------------------------
for
---------------------------------------------------------*/
/* #for {
    background-color: #FFFFD2;
} */
#for .com_title1 {
    text-align: left;
}
#for .com_arc_box {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 526" preserveAspectRatio="none"><path fill="%23FFFFD2" d="M50,263C50,100.5,0,0,0,0l0,263v0l0,263C0,526,50,425.5,50,263L50,263L50,263L50,263L50,263z" /></svg>'),url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 526" preserveAspectRatio="none"><path fill="%23FFFFD2" d="M0,263L0,263L0,263L0,263c0,162.5,50,263,50,263V263l0,0V0C50,0,0,100.5,0,263L0,263z" /></svg>');
}
/* waiting_room */
#waiting_room .box_img {
    max-width: 994px;
}
#waiting_room .box_img .abs_txt {
	left: 3%;
	bottom: 5%;
}
#waiting_room .ilst1 {
    position: absolute;
    width: 50%;
    max-width: 494px;
    right: -3%;
    bottom: 94%;
}
#waiting_room .img_sub {
    position: absolute;
    width: 24%;
    max-width: 268px;
    right: -2%;
    top: -28%;
    z-index: 1;
}
/* trt_room */
#trt_room .box_img {
    max-width: 716px;
}
#trt_room .img_sub {
    width: 75%;
    max-width: 363px;
    margin-left: auto;
    margin-bottom: 3%;
}
/* deco */
#for .ilst2 {
    position: absolute;
    width: 25%;
    max-width: 301px;
    left: 6%;
    bottom: 0;
    translate: 0 55%;
    z-index: 1;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
#for .com_arc_box {
    width: 89%;
    padding: 60px 0;
    margin: 0 auto;
}
#for .com_arc_box .fam_grid {
    width: 110%;
    margin-left: -5%;
}
/* waiting_room */
#waiting_room {
    align-items: flex-end;
    grid-template-columns: 77% min(50%,532px);
}
#waiting_room .box_txt {
    position: relative;
    background: linear-gradient(to right, #fff 60%, transparent 60%);
    box-sizing: border-box;
    padding: 65px 0 0 14%;
    translate: -42% 0;
    margin-left: -16%;
}
/* trt_room */
#trt_room {
    grid-template-columns: 40% 56%;
}
#trt_room .box_img {
    order: 2;
    margin-top: 5%;
}
#trt_room .box_txt {
    order: 1;
}
}
/* PC
------------------------------------------*/
@media only screen and (min-width: 960px) {
#waiting_room .box_txt {
    position: absolute;
    padding-left: 6%;
    width: 50%;
    max-width: 540px;
    right: 0;
    bottom: 0;
    translate: 0;
    margin-left: auto;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {/* waiting_room */
#waiting_room {
    align-items: flex-start;
}
#waiting_room .box_txt {
    margin-top: 20%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {#for .com_arc_box {
    padding-top: 14%;
    padding-bottom: 8%;
}
#for .fam_grid:not(.col3) .box_img {
    position: relative;
    width: 100vw;
    left: 50%;
    margin-left: -50vw;
    margin-bottom: 8%;
}
/* waiting_room */
#waiting_room .ilst1 {
    right: 1%;
}
#waiting_room .img_sub {
    width: 35%;
    right: 0;
    top: 38vw;
}
/* trt_room */
#trt_room .box_txt {
    display: flex;
    flex-direction: column;
}
#trt_room .img_sub {
    order: 3;
    width: 65%;
}
/* deco */
#for .ilst2 {
    width: 45%;
    left: 0;
    translate: 0 30%;
}
}
/*for:more
---------------------------------------------------------*/
#for .com_fuki_dash {
    font-size: min(2.2vw,156%);
    margin-top: 1.5em;
    margin-bottom: 1.5em;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
/* ！！！3列になったら解除！！！ */
#for .more .fam_grid {
    max-width: 1100px;
    grid-template-columns: 45% 45%;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#for .com_fuki_dash {
    font-size: 110%;
    margin-top: 1.5em;
    margin-bottom: 1.5em;
}
}
/*---------------------------------------------------------
club
---------------------------------------------------------*/
#club .bg {
    background-color: #FCECB0;
    padding: min(8.6%,130px) 4% 110px;
}
#club .inbox {
    position: relative;
    max-width: 1300px;
    padding: 60px 0 100px;
    margin: 0 auto;
}
#club .inbox::before {
	position: absolute;
	content: "";
	background-color: #FFF;
	width: 92%;
	height: 100%;
	left: 0;
	right: 0;
	top: 0;
	margin: auto;
	box-shadow: 0 0 20px rgba(0,0,0,0.08);
}
#club .inbox > * {
	position: relative;
}
#club .com_style2 > dt {
    font-size: min(250%, 3.8vw);
}
/* title */
#club .title {
    max-width: 597px;
    margin-bottom: 10%;
}
/* box_img */
#club .box_img {
    position: relative;
}
#club .img_main,
#club .img_sub {
    position: absolute;
}
#club .img_main {
    max-width: 647px;
}
#club .img_main img:not(.abs_txt) {
    position: relative;
	border-radius: 50%;
}
#club .img_main .abs_txt {
	position: absolute;
	width: 35%;
	max-width: 183px;
    left: 2%;
    bottom: 0;
}
#club .img_sub {
    max-width: 380px;
    /* margin: 5% 20% 0 10%; */
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
#club .title {
    translate: 16% 0;
}#club .box_txt {
	width: 52%;
}
#club .img_main {
    width: 50%;
    right: 0;
    top: -20%;
}
#club .img_sub {
    width: 38%;
    left: 58%;
    bottom: 8%;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#club .bg {
    padding: 10% 4%;
}
#club .inbox {
    padding: 6% 0 8%;
}
#club .box_txt {
	width: 60%;
}#club .img_main {
    top: -16%;
    right: -2%;
}
#club .img_main .abs_txt {
    left: 60%;
}
#club .img_sub {
    left: 62%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#club {
    margin-bottom: 20%;
}
#club .bg {
    padding: 12% 6% 18%;
}
#club .inbox {
    padding: 16% 0 12%;
}
#club .com_style2 > dt {
    font-size: 150%;
}
#club .title {
    width: 90%;
    margin-bottom: 6%;
}#club .img_main {
    width: 62%;
    right: -10%;
    top: -12%;
}
#club .img_main .abs_txt {
    width: 40%;
    left: 50%;
    bottom: -20%;
}
#club .img_sub {
    width: 60%;
    left: -5%;
    bottom: 0;
    translate: 0 75%;
}
}
/*---------------------------------------------------------
medical
---------------------------------------------------------*/
#medical .com_style1_txt {
    text-align: center;
    font-size: min(200%, 3vw);
    line-height: 1.7;
    margin-bottom: 1.2em;
}
#medical .bg_box {
    position: relative;
    background-color: #FCF9F5;
    box-sizing: border-box;
    padding: 65px 5.5%;
}
#medical .med_index {
	font-size: min(3.8vw,250%);
	line-height: 1.3;
	letter-spacing: .12em;
    margin-bottom: .4em;
}
#medical .med_index a {
	position: relative;
    display: inline-block;
	padding-right: 1.8em;
}
#medical .med_index .com_arw {
	position: absolute;
	font-size: 40%;
	right: 0;
	top: 50%;
	translate: 0 -50%;
}
.med_col2 .box_img {
    width: 90%;
    max-width: 460px;
	margin: 0 auto 1.8em;
}
#medical .bg_box .bg_point {
    position: relative;
    background-color: #FFF;
    box-sizing: border-box;
    padding: 45px 5%;
    margin-top: 50px;
}
#medical .bg_box .bg_point .img_l {
    max-width: 250px;
}
#medical .med_col2 > div:nth-of-type(1) .com_arw {	background-color: #F5A294;}
#medical .med_col2 > div:nth-of-type(2) .com_arw {	background-color: #74C8B2;}
#medical .med_col2 > div:nth-of-type(1):hover a {color: #F5817E;}
#medical .med_col2 > div:nth-of-type(2):hover a {color: #57BBA2;}
#medical .med_col2 > div:nth-of-type(1):hover .com_arw {background-color: #ED7E70;}
#medical .med_col2 > div:nth-of-type(2):hover .com_arw {background-color: #4DBA9B;}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {.med_col2 {
    display: grid;
    justify-content: space-between;
	grid-template-columns: repeat(2, min(48%,540px));
}
#medical .bg_box .bg_point .img_l {
    width: 30%;
}
#medical .bg_box .bg_point .com_btn1 {
    margin-top: 1.5em;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {#medical .bg_box {
    padding: 6% 5%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#medical .com_style1_txt {
    font-size: 120%;
}
#medical .bg_box {
    padding: 8% 6% 10%;
}
.med_col2 > div:not(:last-of-type) {
    margin-bottom: 10%;
}
#medical .med_index {
	font-size: 160%;
	letter-spacing: .1em;
}
.med_col2 .box_img {
	width: 85%;
	margin-bottom: 6%;
}
#medical .bg_box .bg_point {
    padding: 7% 6% 8%;
    margin-top: 8%;
}
#medical .bg_box .bg_point .img_l {
    width: 60%;
    margin: 0 auto 5%;
}
#medical .bg_box .bg_point .com_btn1 {
    margin-top: 1em;
}
}
/*---------------------------------------------------------
info
---------------------------------------------------------*/
#info {
    text-align: center;
}
#info .com_style1_txt {
    margin-bottom: .4em;
}
/*---------------------------------------------------------

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

/* 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) {
}
