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

body {
	font-family: 'Noto Sans JP', sans-serif;
}

.m-breadcrumb {
	display: none;
}
/* */

.l-section {
	padding-bottom: 6.8vw;
}

#l-main {
	background: unset;
}

img.sp {
	display: none;
}

/* コーナーナビ */
#corner-nav {
	position: sticky;
	z-index: 100;
	width: 100%;
	top: var(--header-height,128px);
	background: linear-gradient(90.83deg, #E98B69 0%, #EC6FA0 100%);
	padding: .5em 0;
}
#corner-nav nav{
	font-size: 1.4rem;
	max-width: 800px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	color: #fff;
}
#corner-nav ul {
	display: flex;
	gap: 1em;
	justify-content: center;
}
#corner-nav ul a {
	color: #fff;
	text-decoration: none;
}

@media (min-width: 769px) {
	#corner-nav ul li a {
		display: inline-block;
		line-height: 1;
		padding-right: 1em;
	}
	#corner-nav ul li::after {
		content: "";
		display: inline-block;
		height: 14px;
		width: 1px;
		background: #fff;
	}
	#corner-nav ul li.kao::after {
		display: none;
	}
	#corner-nav ul li:last-child a {
		border: none;
	}

	/*#corner-nav ul li.active span {
		background: #fff;
		border-radius: 4px;
		padding: 2px 11px 2px 9px;
		color: #EC7398;
	}*/
	#sururimu #corner-nav ul li:nth-child(1) span,
	#onaka #corner-nav ul li:nth-child(2) span,
	#ninoude #corner-nav ul li:nth-child(3) span,
	#futomomo #corner-nav ul li:nth-child(4) span,
	#senaka #corner-nav ul li:nth-child(5) span,
	#kao #corner-nav ul li:nth-child(6) span {
		background: #fff;
		border-radius: 4px;
		padding: 2px 11px 2px 9px;
		color: #EC7398;
	}

}

@media (max-width: 768px) {
	#corner-nav {
		padding: 0;
		top: var(--header-height,17.0666666667vw);
	}
	#corner-nav nav {
		flex-direction: column;
		align-items: flex-start;
	}

	#corner-nav ul {
		display: none;
		background: #fff;
		width: 100%;
		flex-direction: column;
		gap: 0.5em;
	}

	#corner-nav ul li {
		line-height: 1.6;
		border-bottom: #CBCDDA 1px solid;
		/*padding: .5em 1em;*/
		position: relative;
	}
	#corner-nav ul li:last-child {
	}
	#corner-nav ul li::after {
		content: '';
		position: absolute;
		right: 0;
		top: 0;
		height: 100%;
		width: 40px;
		background: url("../img/sururimu/_jp/icn_arw.svg") center / 80% no-repeat;
	}
	#corner-nav p {
		cursor: pointer;
		font-weight: bold;
		position: relative;
		width: 100%;
		padding: .5em;
	}
	#corner-nav p::after {
		content: '';
		position: absolute;
		right: 0;
		top: 0;
		height: 100%;
		width: 40px;
		background: url("../img/sururimu/_jp/icn_pls.svg") center / 80% no-repeat;
	}
	#corner-nav .is-open p::after {
		background: url("../img/sururimu/_jp/icn_min.svg") center / 80% no-repeat;
	}
	#corner-nav.active ul {
		display: flex;
	}
	#corner-nav ul a {
		color: #000;
		display: block;
		width: 100%;
		padding: .5em 1em;
	}

	/*#corner-nav ul li.active {
		background-color: #FFF2F7;
	}*/
	#sururimu #corner-nav ul li:nth-child(1),
	#onaka #corner-nav ul li:nth-child(2),
	#ninoude #corner-nav ul li:nth-child(3),
	#futomomo #corner-nav ul li:nth-child(4),
	#senaka #corner-nav ul li:nth-child(5),
	#kao #corner-nav ul li:nth-child(6) {
		background-color: #FFF2F7;
	}
}


/* レイアウト */
.l-container {
	line-height: 1.5;
}
.l-container p.normalTxt {
	font-size: 1.6rem;
}
.l-container > article {
	margin-top: 3.3vw;
}
.l-container h2{
	position: relative;
	padding: 1.5em 0 1em;
	margin-bottom: .5em;
	color: #5697D5;
}
.l-container h2::before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 30px;
	height: 1px;
	background-color: #5697D5;
}
.l-container h2.type02 {
	color: #A299CE;
	font-size: 2.4rem;
	margin-top: 2em;
	line-height: 1.5;
}
.l-container h2.type02::before {
	display: none;
}

/* ページナビ */
#page-nav {
	background: #E5EEF1;
	padding: .7em;
	display: flex;
	justify-content: center;
	gap: .5em;
	flex-wrap: wrap;
}
#page-nav p {
	background: #fff;
	position: relative;
	flex-basis: 45vw;
	height: 3.2em;
	display: flex;
	justify-content: space-between;
	overflow: hidden;
}
#page-nav p::before{
	content: "";
	position: absolute;
	top: 50%;
	right: .5em;
	transform: translateY(-50%) rotate(90deg);
	width: 24px;
	height: 24px;
	background: url("../img/sururimu/_jp/icn_arw.svg") center / contain no-repeat;
}
#page-nav p a {
	font-size: 1.2rem;
	padding: 0 .8em;
	line-height: 1.3;
	border: 1px solid #64648C4D;
	border-radius: 4px;
	align-self: center;
	text-decoration: none;
	color: #64648C;
	display: flex;
	width: 100%;
	height: 100%;
}
#page-nav p a span {
	align-self: center;
}
#page-nav p a * {
	pointer-events:none;
}

/* パーツ */
.l-container > article > h3 {
	overflow: unset;
	line-height: unset;
	border: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.8rem;
}
.grade h3 {
	position: relative;
	margin: 2em 0 1em;
	font-size: 1.8rem;
	border-radius: 4px;
	padding: 15px 15px 15px 55px;
	background: linear-gradient(90deg, #F7E3EE 0%, #DBD5EF 100%);
	font-weight: 600;
	line-height: 1.5;
	color: #696677;

}
.grade h3 span {
	font-family:var(--minfont);
	font-size: 4.2rem;
	font-style: italic;
	position: absolute;
	top: -34px;
	left: -5px;
	color: #6966774D;
}
h3.copy01 {
	font-family:var(--minfont);
	color: #A299CE;
	background: unset;
	text-align: center;
	margin: 1em 0;
}
h3.copy03 ,
.l-container > article > h3.copy03 {
	font-family: var(--minfont);
	font-size: 2.4rem;
	border: none;
	text-align: center;
	color: #5697D5;
}
.imgWrap {
	text-align: center;
	margin: 1em 0;
}
.videoWrap {
	text-align: center;
	position: relative;
}
.videoWrap span {
	display: inline-block;
	margin-bottom: 10px;
	background: #A299CE;
	border-radius: 4px;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 700;
	padding: 5px 15px;
}


/* グラデーション背景のチェックボックス */
.arrowFlow {
	margin-top: 3em;
	padding-bottom: 2em;
	background: linear-gradient(180deg, #FFF 0%, #F1EFDE 10%, #E1EFF4 77.37%);
	/*clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 20px 100%, 0 calc(100% - 20px));*/
	clip-path: polygon(0 0, 100% 0, 100% 75%, 50% 100%, 50% 100%, 0 75%);
	text-align: center;
}
.onaka .arrowFlow ,
.ninoude .arrowFlow ,
.futomomo .arrowFlow ,
.kao .arrowFlow {
	clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 100%, 50% 100%, 0 85%);
}
.kao .arrowFlow {
	padding-bottom: 3em;
}
.arrowFlow .normalTxt {
	font-size: 1.6rem;
}
.sururim-check {
	display: inline-block;
	text-align: left;
	padding: 1em 0 1em;
}
.ninoude .sururim-check {
	padding: 0em 0 2em;
}
.futomomo .sururim-check ,
.kao .sururim-check {
	padding: 0;
}
.sururim-check li {
	font-size: 1.8rem;
	font-weight: 700;
	position: relative;
	margin: .6em 0;
}
.sururim-check li span {
	color: #EA8A6C;
}
.sururim-check li::before {
	position: absolute;
	left: -1.8em;
	top: 0;
	content: '';
	background: url("../img/sururimu/_jp/icn_chak.png") no-repeat;
	background-size: cover;
	width: 24px;
	height: 24px;
}
.senaka .sururim-check {
	margin-left: 2em;
	padding: 0em 0 1em;
}
.senaka .sururim-check li {
	font-size: 1.6rem;
}
.senaka .sururim-check li::before {
	width: 20px;
	height: 20px;
}

.copy02 {
	font-family:var(--minfont);
	font-size: 1.8rem;
	text-align: center;
	font-weight: 700;
	padding-top: 1em;
}
.copy02 span {
	color: #EC719E;
}
.copy04 {
	text-align: center;
	font-size: 1.6rem;
	font-weight: 700;
}


/* 悩み */
.worry-box {
	background: #F8F8F8 url("../img/sururimu/_jp/bg_nayami.png") no-repeat 98% 63% / 10%;
	padding: 1em;
	margin: 2em 0;
	text-align: center;
}
.kao .worry-box {
	background-position: 83% 83%;
}
.worry-box .title {
	font-size: 2.4rem;
	font-weight: 700;
	color: #A299CE;
	font-family:var(--minfont);
}
.worry-box strong {
	display: block;
	font-size: 1.6rem;
	font-weight: 700;
	margin: 2em 0 1em;
}
.worry-box ul {
	margin: 2em 0 1em 20%;
	text-align: left;
	padding-left: 1.2em;
}
.worry-box ul li {
	font-size: 1.4rem;
	font-weight: 700;
	margin-left: 1em;
	text-indent: -0.8em;
}
.worry-box ul li::before {
	content: "●";	
	font-size: .4em;
	color: #a299ce;
	vertical-align: middle;
	margin-right: 1em;
}

/* 症例 */
#results article {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	row-gap: 2em;
}
#results article figure {
}
.case-lead {
	font-size: 1.8rem;
	text-align: center;
	margin: 1em 0 2em;
}
.case-lead span {
	font-weight: 700;
	color: #EC719E;
}
.results {
	width: 600px;
	margin: 0 auto;
}
.results dl {
	font-size: 1.2rem;
	line-height: 1.5;
	color: #8696aa;
	margin-top: .5em;
}
.results dl dt {
	width: 8em;
	float: left; 
}
.results dl dd {
	width: calc(100% - 8em);
	display: inline-block;
}


/* 悩みを持つ人に */
.target-box {
	background: #FCF3F5 url("../img/sururimu/_jp/onaka/nayami.png") no-repeat 76% 100% / 15%;
	background-size: ;
	padding: 2em 1em 1em 1em;
	text-align: center;
	margin-top: 2em;
}
.ninoude .target-box {
	background: #FCF3F5 url("../img/sururimu/_jp/ninoude/nayami.png") no-repeat 76% 100% / 15%;
}
.futomomo .target-box {
	background: #FCF3F5 url("../img/sururimu/_jp/futomomo/nayami.png") no-repeat 74% 87% / 23%;
}
.senaka .target-box {
	background: #FCF3F5 url("../img/sururimu/_jp/senaka/nayami.png") no-repeat  84% 100% / 19%;
}
.kao .target-box {
	background: #FCF3F5 url("../img/sururimu/_jp/kao/nayami.png") no-repeat 79% 100%;
	background-size: 13%;
}
.target-box h2 {
	font-size: 1.8rem;
	color: #fff;
	background: #EB7790;
	border-radius: 99px;
	padding: .5em 2em;
	display: inline-block;
	overflow: unset;
}
.l-container .target-box h2::before {
	width: unset;
	height: unset;
	background: none;
	content: "";
	position: absolute;
	bottom: -7px; /* 三角の高さ */
	left: 50%;
	transform: translateX(-50%);
	border-width: 10px 10px 0 10px; /* 下側に向いた三角形 */
	border-style: solid;
	border-color: #EB7790 transparent transparent transparent;	
}
.target-box ul {
	margin-left: 200px;
	text-align: left;
	margin-top: 1em;
}
.target-box ul li {
	position: relative;
	margin: 1em 0;
}
.target-box ul li::before {
	position: absolute;
	left: -2em;
	top: 0;
	content: '';
	background: url("../img/sururimu/_jp/icn_q.png") no-repeat;
	background-size: cover;
	width: 24px;
	height: 24px;
}


/* 比較等テーブル系  */
table.hf_table {
	table-layout: fixed;
  width: 100%;
}
table.hf_table th ,
table.hf_table td {
	width: 50%;
  word-wrap: break-word;
}
table .w30 {
	width: 30%;
}
.table_frame table + p {
	margin-top: 1em;
	color: #979BA4;
}
.table_frame.hcenter > table th {
	text-align: center;
}
.table_frame > table th, .table_frame > table td {
	font-size: 1.3rem;
	border: 1px solid #DADCE5;
}
table.diet-comp th {
	text-align: center;
}
table.diet-comp th ,
table.diet-comp td {
	width: 20%;
	white-space: unset;
}
table.diet-comp th.opt {
	background: linear-gradient(99.09deg, #EA8A6C 0%, #EC719E 100%);
	color: #fff;
	font-weight: 700;
}
table.diet-comp td.opt {
	background: #FCF3F5;
}
.wrap-inside {
	white-space: normal;
	word-break: break-word;
	max-width: 8em;
}

/* 施術の流れ */
#flow {
	all: unset;
	display: block;
}
#flow .l-container h2 {
	color: #5697D5;
	margin-bottom: .5em;
}
.m-timeline-tertiary__group {
	margin-top: 2em;
}
.m-timeline-tertiary {
	background: #F9F4E9;
}
.m-timeline-tertiary__number {
	background: linear-gradient(127.49deg, #EA8675 18.49%, #EC739C 86.42%);
}
.m-timeline-tertiary__body {
	line-height: 2.0;
}
.m-timeline-tertiary__group::before {
	border-color: #EA8675;
}

/* 部位 リンク */
#bui-link #bui {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 15px;
}
#bui-link #bui p:first-child {
	flex-basis: 100%;	
}
#bui-link #bui p + p {
	flex-basis: 42vw;	
}



.pictPart {
	display: flex;
	gap: 1.5em;
	flex-direction: column-reverse;
	justify-content: space-between;
}



/************************
 * video関係
 ************************/
.videoWrapper {
	width: 100%;
	max-width: 600px;
	margin: 1.5em auto 1em;
}

.videoWrapper img,
.videoWrapper video {
	width: 100%;
	height: auto;
	display: block;
	cursor: pointer;
}

#unmuteButton {
	color: #fff;
}
#videoTitle {
	color: #fff;
	text-align: center;
	font-size: 2.2rem;
	margin-bottom: 10px;
}
#videoModal {
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	z-index: 9999;
	left: 0; top: 0;
	width: 100%; height: 100%;
	background: rgba(0, 0, 0, 0.7);
}

.modal-bg {
	position: absolute;
	width: 100%; height: 100%;
	cursor: pointer;
}

.modal-content {
	position: relative;
	width: 95%;
	max-width: 800px;
	color: white;
	padding: 1em;
	z-index: 10000;
}

.modal-content video {
	width: 100%;
	height: auto;
	border: 5px solid;
}

.close {
	position: absolute;
	top: 13px;
	right: 20px;
	color: white;
	font-size: 30px;
	cursor: pointer;
}

/* PC用 まとめ */
@media screen and (min-width: 769px) {
	#mc_pict {
		height: 527px;
		background: url("../img/sururimu/_jp/top/title_bg.png") 50% no-repeat,linear-gradient(to bottom,  rgba(249,244,232,1) 0%,rgba(252,244,244,1) 100%);
	}
	.onaka #mc_pict {
		background: url("../img/sururimu/_jp/onaka/title_bg.png") 50% no-repeat,linear-gradient(to bottom,  rgba(249,244,232,1) 0%,rgba(252,244,244,1) 100%);
	}
	.ninoude #mc_pict {
		background: url("../img/sururimu/_jp/ninoude/title_bg.png") 50% no-repeat,linear-gradient(to bottom,  rgba(249,244,232,1) 0%,rgba(252,244,244,1) 100%);
	}
	.futomomo #mc_pict {
		background: url("../img/sururimu/_jp/futomomo/title_bg.png") 100% no-repeat,linear-gradient(to bottom,  rgba(249,244,232,1) 0%,rgba(252,244,244,1) 100%);
	}
	.senaka #mc_pict {
		background: url("../img/sururimu/_jp/senaka/title_bg.png") 50% no-repeat,linear-gradient(to bottom,  rgba(249,244,232,1) 0%,rgba(252,244,244,1) 100%);
	}
	.kao #mc_pict {
		background: url("../img/sururimu/_jp/kao/title_bg.png") 100% no-repeat,linear-gradient(to bottom,  rgba(249,244,232,1) 0%,rgba(252,244,244,1) 100%);
	}
	#mc_pict img {
		height: min(100%,527px);
	}
	#mc_pict h1 {
		max-width: 1106px;
		margin-left: auto;
		margin-right: auto;
	}
	.l-container > article {
		margin-top: 36px;
	}
	h3.copy01 {
		font-size: 2.6rem;
	}
	#page-nav {
		flex-wrap: nowrap;
	}
	#page-nav p {
		flex-basis: 196px;
		cursor: pointer;
	}
	.pictPart {
		flex-direction: unset;
		justify-content: space-between;
	}
	.l-container h2::before{
		width: 60px;
	}
	.videoWrap span {
		font-size: 1.6rem;
	}
	.copy02 {
		font-size: 2.6rem;
	}
	#results article {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#results article figure {
		width: 49%;
	}
	#bui-link #bui p + p {
		flex-basis: 49%;	
	}
	.worry-box ul li {
		font-size: 1.6rem;
	}
}

/* SP用 調整まとめ */
@media (max-width: 768px) {
	img.pc {
		display: none;
	}
	img.sp {
		display: block;
	}
	.l-container h2 ,
	.l-container h2.type02 {
		font-size: 1.8rem;
	}
	#case-tgt {
		margin-top: 2em;
	}
	.case-lead {
		font-size: 1.6rem;
	}
	.grade h3 {
		font-size: 1.6rem;
		padding: 10px 15px 10px 50px;
	}
	.l-container p.normalTxt {
		font-size: 1.4rem;
	}
	#price h3.copy03 {
		font-size: 1.6rem;
	}
	.copy04 {
		font-size: 1.4rem;
	}
	.videoWrap span {
		font-size: 1.3rem;
	}
	.arrowFlow {
		padding-top: 1.5em;
		padding-bottom: 2.5em;
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		width: 100vw;
	}
	.onaka .arrowFlow, .ninoude .arrowFlow, .futomomo .arrowFlow, .kao .arrowFlow {
		clip-path: polygon(0 0, 100% 0, 100% 90%, 50% 100%, 50% 100%, 0 90%);
	}
	.ninoude .sururim-check {
		padding: 0em 0em 2em 1.8em;
	}
	.sururim-check {
		padding: 1em 3em 1em 4.8em;
	}
	.sururim-check li {
		font-size: 1.4rem;
	}
	.results { width: 100%; }
	.worry-box {
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		width: 100vw;
		text-align: left;
	}
	.worry-box .title {
		font-size: 1.8rem;
		text-align: center;
	}
	.worry-box strong {
		font-size: 1.4rem;
		margin-top: 1em;
	}
	.senaka .worry-box {
		background-size: 22%;
		background-position: 100% 30%;
	}
	.kao .worry-box {
		background-size: 20vw;
		background-position: 94% 83%;
	}
	.worry-box ul {
		margin: 1em;
		padding-right: 15vw;
	}
	.target-box ul {
		margin-left: 7vw;
	}
	.target-box {
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		width: 100vw;
	}
	.onaka .target-box {
		background-size: 27%;
		background-position: 90% 100%;
	}
	.senaka .target-box {
		background-size: 30%;
		background-position: 100% 100%;
	}
	.futomomo .target-box {
		background-size: 40%;
		background-position: 100% 87%;
	}
	.kao .target-box {
		background-size: 27%;
		background-position: 95% 100%;
	}
	.senaka .target-box li:nth-child(n+4) br {
		display: none;
	}
	.senaka .target-box li:nth-child(n+4){
		width: 50vw;
	}
	.kao .target-box li:last-child {
		width: 50vw;
	}

	table.diet-comp th, table.diet-comp td {
		white-space: nowrap;
	}
	table.diet-comp.spfix {
		table-layout: fixed;
		width: 650px;
	}
	table.diet-comp .col-h {
    width: 8em;
  }
}
