@charset "UTF-8";


/* ========================================================
  
  common

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


/*---------------------------------------------------------
 header
---------------------------------------------------------*/
header {
	position: absolute;
}
/* PC
------------------------------------------*/
@media only screen and (min-width: 960px) {

}

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

}


/*---------------------------------------------------------
 m_nav_area
---------------------------------------------------------*/
.m_nav_area {
	position: absolute;
	width: 70%;
	max-width: 920px;
	left: 7%;
	bottom: 7%;
}



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

======================================================== */
.fv_area {
	width: 100svw;
	height: 100vh;
	min-height: min(calc(100vw * 0.6), 800px);
}
.m_copy {
	position: absolute;
	width: 55%;
	max-width: max-content;
	left: 7%;
	bottom: 14%;
	filter: drop-shadow(0 0 10px rgba(0,0,0,0.1));

	opacity: 0;
	transition: opacity .8s .2s;
}
.m_copy::before {
	position: absolute;
	display: block;
	content: "";
	background: url(../images/common/frame@2x.png) no-repeat center center;
	background-size: contain;
	width: 17%;
	aspect-ratio: 1;
	left: 29%;
	top: 50%;
	translate: -50% -50%;

	opacity: 0;
	scale: 1.08;
	will-change: scale;

	transition: opacity .8s, scale .8s;
	transition-delay: .6s;
}

.m_img.anime_on .m_copy {
	opacity: 1;
}
.m_img.anime_on .m_copy::before {
	opacity: 0.2;
	scale: 1;
}

.m_logo {
	position: absolute;
	width: 15%;
	max-width: 222px;
	right: 6.5%;
	bottom: 5%;
}
.h_txt {
	position: absolute;
	font-weight: var(--fw-bold);
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	right: 7.2%;
	top: 24%;
}

@media only screen and (min-width: 768px) and (max-width: 1430px) {

.m_copy {
	bottom: 18%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.fv_area {
	min-height: calc(100vw * 1.4);
	max-height: calc(100vw * 1.8);
}
.m_copy {
	width: 56%;
	inset: 76% 3% auto auto;
	translate: 0 -50%;
}
.m_copy::before {
	width: 35%;
	left: 63%;
	top: 40%;
}

.m_logo {
	width: 26vw;
	inset: auto auto 12% 5%;
}
.h_txt {
	inset: 26vw auto auto 5%;
}
}

/*---------------------------------------------------------
 m_slide
---------------------------------------------------------*/
.m_slide,
.m_slide .splide__track,
.m_slide .splide__list,
.m_slide .splide__slide {
	width: 100%;
	height: 100%;
}
.m_slide .splide__slide {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.m_slide .slide1 {background-image: url(../images/top/fv-bg01@2x.jpg);}
.m_slide .slide2 {background-image: url(../images/top/fv-bg02@2x.jpg);}
.m_slide .slide3 {background-image: url(../images/top/fv-bg03@2x.jpg);}
.m_slide .slide4 {background-image: url(../images/top/fv-bg04@2x.jpg);}
.m_slide .slide5 {background-image: url(../images/top/fv-bg05@2x.jpg);}

.m_slide .splide__pagination {
	display: none;
}

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

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

.m_slide .slide1 {background-image: url(../images/top/fv-bg01-sp@2x.jpg);}
.m_slide .slide2 {background-image: url(../images/top/fv-bg02-sp@2x.jpg);}
.m_slide .slide3 {background-image: url(../images/top/fv-bg03-sp@2x.jpg);}
.m_slide .slide4 {background-image: url(../images/top/fv-bg04-sp@2x.jpg);}
.m_slide .slide5 {background-image: url(../images/top/fv-bg05-sp@2x.jpg);}
}



/* ========================================================
  
  main

======================================================== */
main {
	padding-top: min(8vw,120px);
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

}


/*---------------------------------------------------------
 announce
---------------------------------------------------------*/
#announce {
	width: 80%;
	max-width: max-content;
	text-align: center;
	margin-inline: auto;
}
.btn_preview {
	display: block;
	max-width: 800px;
	font: var(--font-min);
	font-size: 130%;
	line-height: 1.4;
	background-color: rgba(76,146,102,0.1);
	border-radius: 2em;
	padding: .6em 2em;
	margin-inline: auto;
}
.btn_preview:hover {
	background-color: rgba(76,146,102,0.2);
}
.btn_preview div::after {
	display: inline-block;
	content: "";
	background: url(../images/common/icon-zoom.svg) no-repeat;
	width: 1.1em;
	height: 1.1em;
	vertical-align: -0.1em;
	margin-left: .4em;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

#announce {
	width: 90%;
}
.btn_preview {
	font-size: 105%;
}
}


/*---------------------------------------------------------
 sp_menu_area
---------------------------------------------------------*/
.sp_menu_area {
	padding: 0 5%;
}
.sp_menu_area .open_btn::before {
	display: none;
}
.sp_menu_area .open_btn .icon_open {
	position: absolute;
	left: .4em;
    top: 50%;
    translate: 0 -50%;
}
.sp_menu_area .open_btn .icon_open::before,
.sp_menu_area .open_btn .icon_open::after {
	height: 2px;
}
.sp_menu_area .open_box {
	display: none;
	position: absolute;
	width: 100vw;
	background-color: #fafafa;
	padding: 5%;
	left: 50%;
	translate: -50% 0;
	z-index: 1;
}




/*---------------------------------------------------------
 info
---------------------------------------------------------*/
.info_box {
	max-width: 1030px;
	background-color: #f6f7f5;
	padding: 5%;
	border-radius: 2em;
	margin-inline: auto;
}
.info_box .com_timetable {
	margin-top: 1em;
}
.info_box address {
	font-weight: var(--fw-bold);
	margin-bottom: .3em;
}
.info_box .map {
	position: relative;
	cursor: pointer;
}
.info_box .map .com_link__en {
	position: absolute;
	right: 3.5%;
	top: 7%;
	margin: 0;
}
.info_box .map .com_link__en a {
	color: var(--color-grn);
	background-color: #FFF;
	padding: .4em 1.8em .4em .6em;
	border-radius: 2em;
	box-shadow: 0 0 .6em rgba(0,0,0,0.1);
}
.info_box .map .com_link__en i {
	right: .4em;
}
.info_box .map:hover .com_link__en a {
	color: #FFF;
	background-color: var(--color-grn);
}

.info_box .com_ctc_btn.btn__cal > a:not(:hover) {
	background-color: #fff;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {
.info_col_wrap {
	display: grid;
	justify-content: space-between;
	grid-template-columns: 48% 48%;
}
.info_box .com_ctc_list.type__content .com_ctc_btn a {
	font-size: min(1.7vw,1.08rem);
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.info_box {
	padding: 8% 6%;
	border-radius: 7vw;
}
.info_box address {
	font-size: 80%;
	margin-top: 4%;
}
.info_box .map .com_link__en {
	font-size: 78%;
}
.info_box .com_ctc_list {
	margin-top: 6%;
}
}



/*---------------------------------------------------------
 CYCLE
---------------------------------------------------------*/
#cycle {
	position: relative;
	padding-bottom: 0;
}
#cycle::before {
	position: absolute;
	content: "";
	background: linear-gradient(to top, var(--color-bei), transparent);
	width: 100vw;
	height: 510px;
	left: 0;
	bottom: -1px;
	z-index: -1;
}
.cycle_copy_wrap .com_h__en span:nth-of-type(n+9) {
	color: var(--color-grn);
}
.cycle_copy {
	font-size: min(4vw,300%);
}
.cycle_inbox p {
	font-feature-settings: "palt";
	line-height: 2.5;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.cycle_inbox {
	position: relative;
	padding-right: 50%;
}
.cycle_bg {
	position: relative;
	width: 58%;
	margin-top: -80px;
	z-index: -1;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

#cycle {
	padding-bottom: 0;
}
#cycle::before {
	background: linear-gradient(to bottom, #FFF, var(--color-bei));
	top: 100%;
	bottom: auto;
}
.cycle_copy_wrap {
	text-align: center;
}
.cycle_copy {
	font-size: 170%;
}
.cycle_inbox p {
	text-align: center;
	line-height: 2;
}

.cycle_bg {
	margin-top: 8%;
}
}

/*CYCLE: cycle_obj_wrap
---------------------------------------------------------*/
.cycle_obj_wrap {
	position: relative;
}
.cycle_obj_bg {
	position: relative;
}
.cycle_obj_bg::before,
.cycle_obj_bg::after {
	position: absolute;
	content: "";
	background: url(../images/top/cycle-obj@2x.png) no-repeat center center;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.cycle_obj_bg img {
	position: relative;
	z-index: -1;
	transition-delay: 0.8s;
}
.cycle_obj_bg::before {
	background-size: 65% auto;
	transition-delay: .4s;
}
.cycle_obj_bg::after {
	background-size: 32% auto;
}
.cycle_obj_bg img,
.cycle_obj_bg::before,
.cycle_obj_bg::after {
	opacity: 0;
	scale: 0.6;
	transition-property: opacity, scale;
	transition-duration: 1.5s;
}
.cycle_obj_wrap.anime_on .cycle_obj_bg img,
.cycle_obj_wrap.anime_on .cycle_obj_bg::before,
.cycle_obj_wrap.anime_on .cycle_obj_bg::after {
	opacity: 1;
	scale: 1;
}

.cycle_obj_txt li {
	position: absolute;
	left: 0;
	top: 0;
	pointer-events: none;
}

.cycle_obj_img li {
	position: absolute;
	width: 24.5%;
	max-width: max-content;
	translate: -50% -50%;
}
.cycle_obj_img li:nth-of-type(1) {
	left: 16%;
	top: 54%;
}
.cycle_obj_img li:nth-of-type(2) {
	left: 77.8%;
	top: 24.4%;
}
.cycle_obj_img li:nth-of-type(3) {
	left: 90%;
	top: 90%;
}
.cycle_obj_img img {
	border-radius: 26%;
	box-shadow: 0 10px 9px rgba(0,0,0,0.15);
}

.cycle_obj_wrap ul > li {
	transition-duration: 3s;
}
.cycle_obj_wrap ul > li:nth-of-type(1) {transition-delay: .5s}
.cycle_obj_wrap ul > li:nth-of-type(2) {transition-delay: 1s}
.cycle_obj_wrap ul > li:nth-of-type(3) {transition-delay: 1.5s}

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

.cycle_obj_wrap {
	position: absolute;
	width: 52%;
	max-width: 639px;
	left: 50%;
	top: 0;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.cycle_obj_wrap {
	margin-bottom: 6%;
}
}



/*---------------------------------------------------------
 kodawari
---------------------------------------------------------*/
#kodawari .com_bg__color {
	background-color: var(--color-bei);
}

/*kodawari: kdwr_tit_wrap
---------------------------------------------------------*/
.kdwr_anchor li {
	max-width: 300px;
	font-size: min(2vw,186%);
}
.kdwr_anchor a {
	display: flex;
	justify-content: center;
	flex-direction: column;
	aspect-ratio: 1;
	border-radius: 3.2em;
	color: #FFF;
	text-align: center;
	font-weight: var(--fw-bold);
	line-height: 1.2;
	letter-spacing: .12em;
	background: url(../images/top/kdwr-anchor01@2x.jpg) no-repeat center center;
	background-size: cover;
	overflow: hidden;
	text-shadow: 0 0 .3em rgba(0,0,0,0.3);
}
.kdwr_anchor a span {
	display: block;
	font: var(--font-en);
	font-size: 42%;
	letter-spacing: .2em;
	margin-top: 1em;
}
.kdwr_anchor a::after {
	display: block;
	font-family: 'fontello';
	content: '\e800';
	font-weight: normal;
	rotate: 90deg;
	font-size: 70%;
	margin-top: 1em;
	margin-bottom: -1em;
}
.kdwr_anchor .slide1 a p {
	line-height: 2.4;
	translate: 0 0.2em;
}

.kdwr_anchor .com_corner_wrap {
	width: 72%;
	height: 72%;
}
.kdwr_anchor .com_corner {
	filter: drop-shadow(0 0 .3em rgba(0,0,0,0.3));
}

.kdwr_anchor .slide2 a {background-image: url(../images/top/kdwr-anchor02@2x.jpg);}
.kdwr_anchor .slide3 a {background-image: url(../images/top/kdwr-anchor03@2x.jpg);}
.kdwr_anchor .slide4 a {background-image: url(../images/top/kdwr-anchor04@2x.jpg);}

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

#kodawari {
	padding-top: 40px;
}
.kdwr_tit_wrap {
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	column-gap: 3.8%;
	margin-bottom: 6.5%;
}
.kdwr_title {
	width: 44%;
}
.kdwr_anchor_wrap {
	position: relative;
	width: calc(54% + (100vw - 100%) / 2);
	margin-left: calc(50% - 50vw);
	overflow: hidden;
}
.kdwr_anchor .splide__track {
	overflow: visible;
}
.kdwr_anchor li {
	width: 10.72em !important;
	margin-left: 1em;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.kdwr_tit_wrap {
	margin-bottom: 8%;
}
.kdwr_title {
	width: 90%;
	margin: 0 auto 6%;
}

.kdwr_anchor .splide__list {
	display: grid !important;
	justify-content: space-between;
	grid-template-columns: repeat(2,48%);
	row-gap: .8em;
}
.kdwr_anchor li {
	font-size: 105%;
}
}

/*kodawari: kdwr_box
---------------------------------------------------------*/
#kodawari-ceramic {--kdwr-accent-color: var(--color-lgrn); }
#kodawari-pro {--kdwr-accent-color: #3fc0ca; }
#kodawari-personalize {--kdwr-accent-color: #d5ac55; }

.kdwr_box {
	--kdwr-accent-color: var(--color-grn);

	background-color: #fff;
	padding: 5.4% 6% 6.5%;
	border-radius: 50px;
	margin-bottom: 3.8%;
}
.kdwr_box:last-of-type {
	margin-bottom: 0;
}
.kdwr_box .com_corner {
	color: var(--kdwr-accent-color);
}

.kdwr_box_inner {
	max-width: 1100px;
	margin-inline: auto;
}

.kdwr_box .com_h__en {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding-top: 2.8em;
	margin-bottom: 3.8em;
}
.kdwr_box .com_h__en .no {
	position: relative;
	display: inline-block;
	color: var(--kdwr-accent-color);
	font-size: 120%;
	padding-right: 1.2em;
	margin-right: 1em;
}
.kdwr_box .com_h__en .no::after {
	position: absolute;
	display: block;
	content: "";
	background-color: var(--color-bdr);
	width: 1px;
	height: .8em;
	right: 0;
	top: 45%;
	translate: 0 -50%;

	opacity: 0;
	transition: opacity .5s;
}
.kdwr_box .com_h__en.anime_on .no::after {
	opacity: 1;
}
.kdwr_box .com_h__en::before {
	right: 0;
	color: var(--kdwr-accent-color);
	font-size: 140%;
	margin: auto;
}

.kdwr_index {
	font-size: min(1.8vw,133%);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	letter-spacing: .12em;
}
.kdwr_index .com_h__min {
	font-size: min(4.3vw,300%);
	white-space: nowrap;
}
.kdwr_index .com_h__min span {
	color: var(--kdwr-accent-color);
}

.kdwr_box .com_h__bld span {
	color: var(--kdwr-accent-color);
}

.kdwr_box .com_btn__bdr a:hover .com_arw {
	background-color: var(--kdwr-accent-color);
}

.kdwr_box_col {
	display: grid;
}
.kdwr_box_col.col__2 .box_img {
	position: relative;
	max-width: max-content;
	margin: 0 auto 5%;
}
.kdwr_box_col.col__2 .box_img img:first-of-type {
	border-radius: 8% / 15.2%;
}
.kdwr_box_col.col__2 .box_img .abs_txt {
	position: absolute;
	width: 30.2%;
	left: 4%;
	bottom: 6%;
}
.kdwr_box_col.col__2 .com_btn__bdr {
	text-align: center;
}

.kdwr_flt {
	margin-top: 5%;
}
.kdwr_flt .illust {
	position: absolute;
	width: 20%;
	max-width: max-content;
	left: 0;
	top: 0;
	translate: -20% -70%;
}
.kdwr_flt .img_r {
	width: 55%;
}

.kdwr_img_max {
	max-width: 1050px;
	margin: 0 auto 5%;
}

/* kodawari01 */
.kdwr_point_list {
	position: relative;
	width: 70%;
	max-width: 535px;
	display: flex;
	column-gap: 3%;
	margin: 1.6% 0 -5% auto;
	z-index: 1;
}
.kdwr_point_list > li {
	flex: 1;
	filter: drop-shadow(0 10px 9px rgba(0,0,0,0.15));
}
.kdwr_box .tic_slide .splide__slide {
	width: 50vw !important;
	max-width: 750px;
}

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

.kdwr_box_col {
	justify-content: space-between;
	grid-template-columns: 46% 49%;
}
.kdwr_box_col.col__2 {
	grid-template-columns: repeat(2,min(48%,500px));
	row-gap: 3em;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.kdwr_box {
	padding: 10% 6% 14%;
	border-radius: 8vw;
	margin-bottom: 5%;
}

.kdwr_box .com_h__en {
	margin-bottom: 2.5em;
}

.kdwr_index {
	font-size: 105%;
	letter-spacing: .08em;
}
.kdwr_index .com_h__min {
	font-size: 160%;
}

.kdwr_box_col.col__2 {
	row-gap: 2.5em;
}
.kdwr_box_col .box_img {
	width: 95%;
	margin: 0 auto 6%;
}

.kdwr_flt {
	display: flex;
	flex-direction: column-reverse;
	margin-top: 8%;
}
.kdwr_flt .illust {
	width: 32%;
	translate: -10% -70%;
}
.kdwr_flt .img_r {
	width: 100%;
	margin: 5% auto 0;
}

.kdwr_img_max {
	width: 95%;
}

/* kodawari01 */
.kdwr_point_list {
	width: 100%;
	column-gap: 3%;
	margin: 4% 0 -5% auto;
	z-index: 1;
}
.kdwr_box .tic_slide .splide__slide {
	width: 80vw !important;
}
}




/*---------------------------------------------------------
 TREATMENT
---------------------------------------------------------*/
#treatment .trt_bg_area {
	background: url(../images/top/bg-splay-yel-t@2x.png) no-repeat right top,
				url(../images/top/bg-splay-yel-b@2x.png) no-repeat left bottom;
	background-size: 67% auto;
}
#treatment .com_bg__color {
	background-color: var(--color-pgrn);
}
#treatment .com_h__min.has-icon {
	position: absolute;
	color: var(--color-grn);
	padding-left: 1.5em;
	left: 6.6%;
	bottom: 1.2em;
	margin-bottom: 0;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

#treatment .com_h__min.has-icon {
	left: 6.6%;
	bottom: .8em;
}
}

/*TREATMENT: trt_tit_wrap
---------------------------------------------------------*/
/* trt_title */
.trt_title {
	position: relative;
	font: var(--font-min);
	font-size: min(3vw,277%);
	line-height: 1.2;
	letter-spacing: .08em;
	z-index: 1;
}
.trt_title > span {
	display: inline-block;
}
.trt_title > span:first-of-type {
	font-size: 240%;
}
.trt_title > span:last-of-type {
	display: block;
	font-size: 192%;
	letter-spacing: .14em;
	margin-left: 2.4em;
	margin-top: .3em;
}
.trt_title span.corner {
	position: relative;
	color: var(--color-grn);
	font-size: 133%;
	margin: 0 .25em 0 .15em;
}
.trt_title span.corner::before {
	position: absolute;
	content: "";
	background: url(../images/common/frame-grn@2x.png) no-repeat center center;
	background-size: contain;
	width: 1.42em;
	aspect-ratio: 1;
	left: 48%;
	top: 54%;
	translate: -50% -50%;
	opacity: 0;
	scale: 1.06;

	transition: opacity .5s, scale .5s;
	transition-delay: .5s;
}
.trt_title.anime_on span.corner::before {
	opacity: 1;
	scale: 1;
}
/* trt_slide */
.trt_slide {
	width: 50vw;
}
.trt_slide li {
	width: 44vw;
	max-width: 656px;
	margin-right: 8px;
}

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

.trt_tit_wrap {
	display: grid;
	grid-template-columns: 50% 50%;
}
.trt_tit_wrap .com_h__en {
	font-size: 106%;
	margin-bottom: 5em;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.trt_tit_wrap .com_h__en {
	margin-bottom: 3em;
}
/* trt_title */
.trt_title {
	max-width: max-content;
	font-size: 130%;
	margin: 0 auto -0.5em;
}
/* trt_slide */
.trt_slide {
	width: 100vw;
	margin-inline: calc(50% - 50vw);
}
.trt_slide li {
	width: 64vw;
	margin-right: 4px;
}
}

/*TREATMENT: com_menu__med
---------------------------------------------------------*/
#treatment .com_menu__med a {
	align-items: center;
	text-align: center;
	font-size: 106%;
	font-weight: normal;
	line-height: 1.4;
	height: 15em;
	border-radius: 3.1em;
}
#treatment .com_menu__med a > div {
	font: var(--font-min);
	font-size: 175%;
	line-height: 1;
	white-space: nowrap;
	margin-top: .3em;
}
#treatment .com_menu__med a > div small {
	display: block;
	font-size: 82%;
}

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

#treatment .com_menu__med a > div {
	height: 1.8em;
	box-sizing: content-box;
	padding-left: 0;
	padding-top: 2.7em;
}
#treatment .com_menu__med a > div::before {
	width: 2.8em;
	height: 2.2em;
	left: 50%;
	top: .2em;
	translate: -50% 0;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

#treatment .com_menu__med a {
	height: 8em;
	border-radius: 2.5em;
}
#treatment .com_menu__med a > div {
	text-align: left;
	font-size: 135%;
	margin-top: .5em;
}
}

/*TREATMENT: trt_col_wrap
---------------------------------------------------------*/
.trt_col_wrap > div {
	position: relative;
	--trt-col-color: #ffffc9;
	color: #FFF;

	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding: min(15%,110px) 12%;
}
.trt_col_wrap .com_corner {
	color: var(--trt-col-color);
}

.trt_col_wrap .com_h__bld {
	font-size: min(2.4vw,180%);
	text-shadow: 0 0 .4em rgba(0,0,0,0.5);
	margin-bottom: .3em;
	z-index: 1;
}
.trt_col_wrap .com_h__min {
	display: block;
	font-size: min(4.8vw,433%);
	padding-left: 1.2em;
	text-shadow: 0 0 .3em rgba(0,0,0,0.7);
	margin-bottom: .2em;
	z-index: 1;
}
.trt_col_wrap .com_h__min .com_arw {
	position: absolute;
	width: 2.2em;
	height: 1.8em;
	line-height: 1.8;
	color: var(--color-base);
	background-color: var(--trt-col-color);
	font-size: 44%;
	text-shadow: none;
	box-shadow: 0 0 .5em rgba(0,0,0,0.3);
	left: 0;
	top: 50%;
	translate: 0 -50%;
}

.trt_col_inner > p {
	font-feature-settings: "palt";
	text-shadow: 0 0 5px rgba(0,0,0,0.1);
}

.trt_col_wrap .abs_img {
	position: absolute;
	width: 30%;
	max-width: max-content;
	right: 15%;
	top: 0;
	translate: 0 -7%;
}

.trt_col_wrap .box_kids {
	background-image: url(../images/top/treatment-kids-bg@2x.jpg);
}
.trt_col_wrap .box_implant {
	--trt-col-color: #d6dbff;
	background-image: url(../images/top/treatment-implant-bg@2x.jpg);
}

/* trt_bnr */
.trt_bnr {
	position: relative;
	width: 100%;
	max-width: 495px;
	display: flex;
	align-items: center;
	column-gap: 1.4em;
	color: var(--color-base);
	font-size: min(1.3vw,106%);
	font-weight: var(--fw-bold);
	line-height: 1.6;
	letter-spacing: .1em;
	font-feature-settings: "palt";
	background-color: var(--trt-col-color);
	border-radius: 1.4em;
	padding: 10px;
	padding-right: 3em;
	margin: 6% auto 0;
}
.trt_bnr img {
	width: 11.1em;
	max-width: 177px;
	border-radius: .7em;
	margin: 0;
}
.trt_bnr .com_arw {
	position: absolute;
	color: var(--color-base);
	font-size: 94%;
	background-color: #fff;
	box-shadow: 0 0 .5em rgba(0,0,0,0.2);
	right: 1em;
	top: 50%;
	translate: 0 -50%;
}
.trt_bnr:hover .com_arw {
	color: #FFF;
	background-color: var(--color-base);
}
.box_kids .trt_bnr p span {	color: #edab2b;}
.box_implant .trt_bnr p span {	color: #8b88d6;}

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

.trt_col_wrap {
	display: grid;
	grid-template-columns: 50% 50%;
	column-gap: 1px;
}
.trt_col_wrap > div {
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 4;
}

.trt_col_wrap .trt_col_inner {
	max-width: 500px;
	margin-inline: auto;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

/* trt_bnr */
.trt_bnr {
	font-size: 1.45vw;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.trt_col_wrap > div {
	padding: 12% 8%;
	margin-top: 1px;
}

.trt_col_wrap .com_h__bld {
	font-size: 105%;
}
.trt_col_wrap .com_h__min {
	font-size: 240%;
}

.trt_col_wrap .abs_img {
	width: 30%;
}

/* trt_bnr */
.trt_bnr {
	font-size: 90%;
	line-height: 1.4;
}
.trt_bnr img {
	width: 8em;
}
.trt_bnr .com_arw {
	position: absolute;
	color: var(--color-base);
	background-color: #fff;
	box-shadow: 0 0 .5em rgba(0,0,0,0.2);
	right: 1em;
	top: 50%;
	translate: 0 -50%;
}
}



/*---------------------------------------------------------
 CASE
---------------------------------------------------------*/
.case_tit_wrap {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 3%;
}
.case_title {
	display: flex;
	align-items: center;
	column-gap: 1.6em;
	color: var(--color-grn);
}
.case_title .com_h__bld,
.case_title .com_h__en {
	margin-bottom: 0;
}
.case_tit_wrap .com_btn__icon {
	margin-top: 0;
}
.case_tit_wrap .com_btn__icon .com_arw {
	color: var(--color-grn);
	text-shadow: none;
	box-shadow: 0 0 .5em rgba(0,0,0,0.2);
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.case_tit_wrap .com_btn__icon {
	position: absolute;
	right: 0;
	bottom: 0;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.case_tit_wrap {
	margin-bottom: 8%;
}
.case_title {
	display: block;
}
}

/*CASE: case_slide
---------------------------------------------------------*/
.case_slide .splide__slide {
	display: block;
	max-width: 510px;
	padding-bottom: .8em;
	border-bottom: 1px solid rgba(58,80,55,0.2);
}
.case_slide .splide__slide::before {
	position: absolute;
	content: "";
	background-color: rgba(58,80,55,0.5);
	width: 100%;
	height: 1px;
	left: 0;
	bottom: 0;
	transition: transform .4s;
	transform-origin: right top;
    transform: scaleX(0);
}
.case_slide .splide__slide:hover::before {
	transform-origin: left top;
    transform: scaleX(1);
}
.case_slide .ba_wrap {
	display: grid;
	justify-content: space-between;
	grid-template-columns: 49% 49%;
}
.case_slide .ba_wrap > div {
	position: relative;
	overflow: hidden;
	padding-bottom: 6%;
}
.case_slide .ba_wrap > div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.case_slide .ba_wrap p {
	position: absolute;
	width: 8em;
	text-align: center;
	font: var(--font-en);
	font-size: 94%;
	color: var(--color-grn);
	background-color: var(--color-pgrn);
	padding: .6em;
	border-radius: 2em;
	left: 50%;
	bottom: 0;
	translate: -50% 0;
}
.case_slide .title {
	position: relative;
	font-size: 106%;
	font-weight: var(--fw-bold);
	line-height: 1.5;
	margin-top: 1em;
	padding-right: 2em;
}
.case_slide .title::before {
	position: absolute;
	display: block;
	font-family: 'fontello';
	content: '\e800';
	font-weight: normal;
	right: .4em;
	top: 0;
	text-shadow: none;
	transition: right .5s;
}
.case_slide a:hover .title::before {
	right: 0;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.case_slide {
	width: 100vw;
}
.case_slide .splide__slide {
	margin-right: 60px;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.case_slide .ba_wrap > div {
	padding-bottom: 10%;
}
.case_slide .title {
	font-size: 90%;
	margin-top: .5em;
}
}



/*---------------------------------------------------------
 trt_bnr_area
---------------------------------------------------------*/
.trt_bnr_area {
	background: url(../images/top/bg-splay-s@2x.png) no-repeat right bottom;
	background-size: auto 100%;
	background-color: #93bea3;
}
.trt_bnr_area .bnr_wrap > li {
	position: relative;
}
.trt_bnr_area .bnr_wrap > li::after {
	position: absolute;
	content: "";
	background-color: rgba(255,255,255,0.8);
	width: 1px;
	height: 60%;
	right: 0;
	top: 20%;
}
.trt_bnr_area .bnr_wrap > li:last-of-type:after {
	display: none;
}
.trt_bnr_area .bnr_wrap a {
	display: flex;
	align-items: center;
	column-gap: 7%;

	color: #FFF;
	font-size: min(1.5vw,106%);
	font-weight: var(--fw-bold);
	line-height: 1.5;
}
.trt_bnr_area .bnr_wrap .com_hov_img {
	width: 9em;
	max-width: max-content;
	border-radius: 50%;
}
.trt_bnr_area .bnr_wrap .ft_en {
	position: relative;
	display: inline-block;
	font-size: 250%;
	letter-spacing: .16em;
	padding-right: 1.2em;
	margin-bottom: .2em;
}
.trt_bnr_area .bnr_wrap .com_arw {
	position: absolute;
	font-size: 40%;
	right: 0;
	top: 50%;
	translate: 0 -50%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.trt_bnr_area .bnr_wrap {
	display: flex;
	column-gap: 6%;
}
.trt_bnr_area .bnr_wrap > li {
	position: relative;
	width: 100%;
}
.trt_bnr_area .bnr_wrap > li:first-of-type a {
	padding-right: 5%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.trt_bnr_area {
	background-size: 80% auto;
}
.trt_bnr_area .bnr_wrap > li::after {
	position: relative;
	display: block;
	width: 90%;
	height: 1px;
	inset: 0;
	margin: 7% auto;
}
.trt_bnr_area .bnr_wrap a {
	font-size: 90%;
	letter-spacing: .1em;
	padding: 0 5%;
}
.trt_bnr_area .bnr_wrap .com_hov_img {
	width: 7.2em;
}
.trt_bnr_area .bnr_wrap .ft_en {
	font-size: 180%;
}
}




/*---------------------------------------------------------
 MESSAGE
---------------------------------------------------------*/
#message {
	position: relative;
}
#message .com_bg__color {
	background-color: var(--color-ivo);
}

/*MESSAGE: msg_inbox
---------------------------------------------------------*/
.msg_bg_img {
	position: absolute;
	background: #f1f1dc url(../images/top/message-bg@2x.jpg) no-repeat center center;
	background-size: cover;
	width: 100vw;
	height: calc(100% + 130px);
	left: 0;
	top: 0;
	z-index: -2;
}
.msg_bg_img::before,
.msg_bg_img::after {
	position: absolute;
	content: "";
	background: linear-gradient(to bottom, rgba(68,111,46,0.1), rgba(68,111,46,0));
	width: 100%;
	height: 400px;
	left: 0;
}
.msg_bg_img::before {
	top: 0;
}
.msg_bg_img::after {
	bottom: 0;
	scale: 1 -1;
}

.msg_inbox .com_h__en,
.msg_inbox .com_h__min span {
	color: var(--color-grn);
}
.msg_inbox .com_h__min {
	font-size: min(4vw,281%);
	line-height: 1.6;
}

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

.msg_inbox {
	max-width: 1100px;
	padding: 0 8%;
	box-sizing: content-box;
	margin-inline: auto;
}
.msg_inbox .com_h__en {
	font-size: 113%;
}
.msg_inbox p {
	width: 60%;
	max-width: 610px;
	line-height: 2.8;
	font-feature-settings: "palt";
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

.msg_inbox p {
	width: 65%;
	line-height: 2.2;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.msg_bg_img {
	background-image: url(../images/top/message-bg-sp@2x.jpg);
	/* background-size: contain; */
}
.msg_inbox {
	padding: 0 8%;
}
.msg_inbox .com_h__min {
	font-size: 150%;
}
}

/*MESSAGE: msg_bgbox
---------------------------------------------------------*/
.msg_bgbox {
	width: 96%;
	max-width: 1350px;
	background-color: var(--color-ivo);
	padding: 4.8%;
	border-radius: 20px;
	margin-inline: auto;
}
.msg_bgbox .dr_prof {
	display: grid;
	grid-template-columns: 40% 55%;
	column-gap: 6%;
}
.msg_bgbox .dr_img img {
	border-radius: 10px;
}
.msg_bgbox .dr_name {
	font: var(--font-min);
	line-height: 1.4;
	letter-spacing: .15em;
	white-space: nowrap;
}
.msg_bgbox .dr_name dt i {
	color: var(--color-grn);
	font-size: 90%;
	margin-right: .5em;
}
.msg_bgbox .dr_name dd {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: .4em;
	font-size: min(3.2vw,226%);
	letter-spacing: .2em;
	margin-top: .4em;
}
.msg_bgbox .dr_name dd > span {
	display: block;
	color: var(--color-grn);
	font: var(--font-en);
	font-size: 42%;
	letter-spacing: .14em;
	margin-bottom: .5em;
}
.msg_bgbox .dr_name dd > span > span {
	color: var(--color-mgrn);
}
.msg_bgbox .dr_prof ul {
	row-gap: .1em;
	font-size: 94%;
	opacity: 0.7;
	margin-top: 1em;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.msg_bg_inner {
	max-width: 1030px;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 5%;
	margin-inline: auto;
}
.msg_bgbox .dr_prof {
	width: 73%;
	padding-right: 2%;
	border-right: 1px solid rgba(58,80,55,0.2);
}
.msg_bgbox .dr_img {
	grid-column: 1/2;
	grid-row: 1/3;
}
.msg_bgbox .dr_prof .dr_name {
	grid-column: 2/3;
	grid-row: 1/2;
}
.msg_bgbox .dr_prof ul {
	grid-column: 2/3;
	grid-row: 2/3;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.msg_bgbox {
	width: 92%;
	padding: 6% 6% 0;
	border-radius: 20px;
}
.msg_bgbox .dr_prof {
	align-items: center;
	grid-template-columns: 45% 50%;
}
.msg_bgbox .dr_img {
	grid-column: 1/2;
	grid-row: 1/2;
}
.msg_bgbox .dr_prof .dr_name {
	grid-column: 2/3;
	grid-row: 1/2;
}
.msg_bgbox .dr_prof ul {
	grid-column: 1/3;
	grid-row: 2/3;
}

.msg_bgbox .dr_name dd {
	flex-wrap: wrap;
	font-size: 160%;
}
.msg_bgbox .dr_prof ul {
	font-size: 90%;
}
.msg_bgbox .com_btn__icon {
	padding-top: 8%;
	margin-top: 6%;
	border-top: 1px solid rgba(58,80,55,0.2);
}
.msg_bgbox .com_btn__icon a {
	margin-inline: auto;
}
}


/*---------------------------------------------------------
 WP
---------------------------------------------------------*/
#news {	--wp-accent-color: var(--color-news);}
#calendar {	--wp-accent-color: var(--color-grn);}
#blog {	--wp-accent-color: var(--color-blog);}

.wp_tit_wrap {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 1.5em;
}
#news .scl_area {
	--scr-bar-color: var(--color-news);
	--scr-bg-color: rgba(63,181,165,0.3);
}
#blog .scl_area {
	--scr-bar-color: var(--color-blog);
	--scr-bg-color: rgba(213,172,85,0.3);
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.wp_wrap {
	display: grid;
	justify-content: space-between;
	grid-template-columns: 48% 48%;
	row-gap: 5em;
}

#news {
	grid-column: 1/2;
	grid-row: 1/2;
}
#calendar {
	grid-column: 2/3;
	grid-row: 1/2;
}
#blog {
	display: flex;
	column-gap: 5%;

	grid-column: 1/3;
	grid-row: 2/3;
}
#blog .wp_tit_wrap {
	display: block;
}
#blog .com_btn__icon {
	margin-top: 2em;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.wp_wrap > *:nth-of-type(n+2){
	margin-top: 10%;
}
}

/*WP: wp_list
---------------------------------------------------------*/
.wp_list a {
	display: block;
}
.wp_list .date {
	display: inline-block;
	color: var(--wp-accent-color);
	font: var(--font-en);
	font-size: 106%;
	margin-bottom: .6em;
}
.wp_list .title {
	position: relative;
	font-size: min(1.6vw,126%);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	margin-bottom: .2em;

	transition: color .3s;
}
.wp_list a:hover .title {
	color: var(--wp-accent-color);
}
.wp_list p {
	font-size: 94%;
	line-height: 1.6;
}
.wp_list .com_hov_img {
	border-radius: 7.7% / 12%;
	margin: 0 auto 8%;
}
/* news */
#news .scl_area {
	max-height: 400px;
	overflow-x: visible;
	overflow-y: scroll;
	padding-right: 4%;
}
#news .wp_list a {
	padding: 4% 5%;
	border-radius: 10px;
}
#news .wp_list > li:nth-of-type(even) a {
	background-color: #f0f3ec;
}
/* blog */
#blog .wp_list {
	max-width: 840px;
	display: flex;
	column-gap: 3.5%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

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

.wp_list .date {
	font-size: 90%;
}
.wp_list .title {
	font-size: 95%;
}
.wp_list p {
	font-size: 90%;
}
/* news */
#news .scl_area {
	height: 80vw;
}
#news .wp_list a {
	padding: 5% 6%;
}
/* blog */
#blog .wp_list {
	width: 160vw;
}
}



/*---------------------------------------------------------
 topi_bnr_wrap
---------------------------------------------------------*/
.topi_bnr_wrap {
	display: grid;
	row-gap: 1.5em;
}
/* com_bnr_insta */
.topi_bnr_wrap .com_bnr_insta b {
	display: block;
	font-size: 94%;
	margin-bottom: .5em;
}
.topi_bnr_wrap .com_bnr_insta .ft_en {
	font-size: 166%;
}
.topi_bnr_wrap .com_bnr_insta .com_arw {
	font-size: 110%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.topi_bnr_wrap {
	justify-content: space-between;
	grid-template-columns: 70% 24%;
}
/* com_bnr_rec */
.topi_bnr_wrap .com_bnr_rec a {
	background-image: url(../images/top/recruit-bg@2x.jpg);
	height: 18em;
	padding: 3% 9%;
}
.topi_bnr_wrap .com_bnr_rec .ft_min {
	font-size: 360%;
}
.topi_bnr_wrap .com_bnr_rec .ft_en {
	font-size: 200%;
	padding-right: 1.6em;
}
.topi_bnr_wrap .com_bnr_rec .com_arw {
	font-size: 54%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

/* com_bnr_rec */
.topi_bnr_wrap .com_bnr_rec a {
	height: 38vw;
	font-size: 80%;
	background-image: url(../images/top/recruit-bg-sp@2x.jpg);
}
.topi_bnr_wrap .com_bnr_rec .rec_txt {
	display: block;
}
/* com_bnr_insta */
.topi_bnr_wrap .com_bnr_insta {
	width: 90%;
	margin-inline: auto
}
.com_bnr_insta a {
	font-size: 90%;
	padding: 8% 5%;
}
.topi_bnr_wrap .com_bnr_insta .insta_txt {
	position: relative;
	display: inline-block;
	text-align: left;
	padding-left: 4em;
}
.topi_bnr_wrap .com_bnr_insta .insta_txt::before {
	position: absolute;
	left: 0;
	top: 50%;
	translate: 0 -50%;
}
}




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

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

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


}




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

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

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


}