@charset "utf-8";

	/* ------  current page yellow border show ----- */
.menu-list > li:nth-child(2):after,
.sub-menu-list > li:nth-child(3) a:after {
	padding-top: 6px;
}
.ConsultationFeeTime main .wrap-area {
	max-width: 1200px;
	text-align: center;
}
.lead-sentence p {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.8;
}
.consul-fee dt,
.consul-fee dd:first-of-type > span,
.consul-fee dd:first-of-type > span em,
.consul-fee dd:last-of-type li > p span,
.consul-fee dd:last-of-type li > p > span em,
.consul-opentime dt,
.consul-opentime dd,
.consul-opentime dd span {
	font-family: 'M PLUS 1p', sans-serif;
}
	/* ------  .area-mainVisual start ----- */
.ConsultationFeeTime .breadcrumb {
	max-width: 1280px;
	padding: 0 16px;
	margin: 0 auto;
}
.ConsultationFeeTime .area-mainVisual {
	width: 100%;
	padding-bottom: 243px; 
}
.ConsultationFeeTime .area-mainVisual > div {
	width: 100%;
	height: 100%;
	background-image: url(../img/rinshin/feetime/fee_foreground.png), url(../img/rinshin/tree-left-noclip.png), url(../img/rinshin/tree-right-noclip.png), url(../img/rinshin/page-sky.png);
	background-repeat: no-repeat;
	background-position: center bottom, -2% bottom, 112% bottom, center 30px;
	background-size: 1920px auto, 300px auto, 631px auto, 1920px auto;
	margin-bottom: 0;
	z-index: 10;
}
.area-mainVisual .area-secound-title {
	width: 100%;
    text-align: center;
    color: #42210b;
    padding: 0 16px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -55%);
}
.ConsultationFeeTime .area-mainVisual .secound-title + div p {
	font-size: 1.8rem;
	font-weight: bold;
	width: 100%;
	text-shadow: 2px 2px 0 #ffffff, -2px -2px 0 #ffffff,
              	 -2px 2px 0 #ffffff, 2px -2px 0 #ffffff,
              	 0px 2px 0 #ffffff,  0 -2px 0 #ffffff,
              	 -2px 0 0 #ffffff, 2px 0 0 #ffffff;
}

	/* ------  .area-mainVisual end ----- */

	/* ------  .consul-fee start ----- */
/* .consul-fee */
.consul-fee,
.consul-fee-notes {
	font-size: clamp(16px, (22 / 768 * 100vw), 22px);
}
.consul-fee {
	width: 100%;
	margin: 30px 0 min(60px, (60 / 480 * 100vw)); 0;
}
.consul-fee dt {
	display: inline-block;
	width: 150px;
	color: #ffffff;
	background: #c1272d;
	margin-bottom: 20px;
	position: relative;
}
.consul-fee dt:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 8px solid #c1272d;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%, 0);
}
.consul-fee dd:first-of-type,
.consul-fee dd:last-of-type li {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	border: 2px solid #c4bfbb;
    border-radius: 10px;
    box-shadow: 4px 4px 0 #e7e1c9;
}
.consul-fee dd:first-of-type {
	height: min(100px, (100 / 900 * 100vw));
	align-items: center;
	margin-bottom: clamp(35px, (80 / 900 * 100vw), 80px);
	position: relative;
}
.consul-fee dd:first-of-type span,
.consul-fee dd:last-of-type li > p {
	flex-grow: 0;
	width: 100%;
}
.consul-fee dd:last-of-type ul {
	justify-content: center;
	gap: clamp(15px, (25 / 1168 * 100vw), 25px);
	line-height: 1.2;
}
.consul-fee dd:last-of-type li {
	width: min(275px, (275 / 900 * 100vw));
	padding: min(50px, (50 / 1168 * 100vw)) 0 min(30px, (30 / 1168 * 100vw));
}
.consul-fee dd {
	font-size: calc(22 / 22 * 1em);
}
.fee {
	font-size: calc(40 / 22 * 1em);
	line-height: 1;
}
.consul-fee dd:last-of-type li > p.consul-fee-itemNote {
	font-size: calc(14 / 22 * 1em);
	margin-top: calc(20 / 22 * 1em);
}
.consul-fee dd:last-of-type p > span {
	display: block;
}
.consul-fee dd:last-of-type li > p > span:first-child {
	height: calc(55 / 22 * 1em);
	margin-bottom: calc(20 / 22 * 1em);
	position: relative;
}
.consul-fee dd:last-of-type li > p > span:first-child:after {
    content: "";
    display: block;
    width: calc(30 / 22 * 1em);
    height: 5px;
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%, 0);
}
.consul-fee dd:last-of-type li:nth-child(odd) > p > span:first-child:after {
    background: #8be3e8;
}
.consul-fee dd:last-of-type li:nth-child(even) > p > span:first-child:after {
    background: #fbb03b;
}
.consul-fee dd:first-of-type:before {
	content: "";
	width: 100%;
	height: 0;
	position: absolute;
	left: 0;
	top: 139%;
	border-bottom: 1px dotted #8c6239;
}
.consul-fee dd:first-of-type:after {
	content: "";
	display: inline-block;
	width: min(65px, (65 / 900 * 100vw));
	aspect-ratio: 65 / 216;
	background: url(../img/rinshin/feetime/staff.png) no-repeat 0 0 / contain;
	position: absolute;
	right: 0;
	bottom: 0;
	transform: translate(20%, 13%);
}
.consul-fee dd .color-red {
	color: red;
}
.consul-fee-method {
	margin-top: min(50px, (50 / 480 * 100vw));
    margin-left: calc(27 / 22 * 1em);
    text-indent: calc(27 / 22 * -1em);
}
.consul-fee-method > strong {
/* "text-decoration"の一括指定がsafariでは反映されない為、個別に指定 */
	text-decoration-line: underline;
	text-decoration-style: wavy;
	text-decoration-color: #fbb03b;
	text-underline-offset:  5px;
}
/* .consul-fee-notes */
.consul-fee-notes div,
.consul-opentime > div {
    width: fit-content;
    text-align: initial;
    margin: 0 auto;
}
.consul-fee-notes p:before,
.consul-opentime p:before {
    content: "";
    display: inline-block;
    width: calc(18 / 22 * 1em);
    aspect-ratio: 1 / 1;
    background: #fbb03b;
    margin-right: calc(8 / 22 * 1em);
}
.consul-fee-notes p {
    margin-top: 10px;
    margin-left: calc(26 / 22 * 1em);
    text-indent: calc(26 / 22 * -1em);
}
.consul-aboutCancel {
	width: fit-content;
	text-align: initial;
	margin: min(50px, (50 / 480 * 100vw)) auto 0;
}
.consul-aboutCancel > dt {
	font-size: calc(24 / 22 * 1em);
    text-align: center;
    margin-bottom: 10px;
}
.underLine {
/* "text-decoration"の一括指定がsafariでは反映されない為、個別に指定 */
	text-decoration-line: underline;
	text-decoration-style: wavy;
	text-decoration-color: #ff4c6b;
	text-underline-offset:  4px;
	text-decoration-skip-ink: none;/* 線を途切れさせない */
}

	/* ------  .consul-fee end ----- */

	/* ------  .consul-opentime start ----- */
.consul-opentime-bg {
	padding: 80px 0;
	background: #f9f9ed;
}
.consul-opentime dl {
	max-width: 747px;
	justify-content: space-between;
	margin: 0 auto;
}
.consul-opentime dl > div {
	width: 334px;
	padding: 70px 0;
	background: #ffffff;
	position: relative;
}
.consul-opentime dl > div:after {
    content: "";
    display: block;
    width: 100%;
    padding-bottom: calc(5 / 334 * 100%);
    background: #c7b299;
    position: absolute;
    left: 0;
    top: 0;
}
.consul-opentime dl > div:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 20px solid #fbb03b;;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    position: absolute;
    left: 50%;
    top: 0%;
    transform: translate(-50%, 0);
}
.consul-opentime dt {
    font-size: 2.8rem;
}
.consul-opentime dd {
    font-size: 3.2rem;
    color: #872434;
}
.consul-opentime dd span {
    font-size: 4.8rem;
}
.consul-opentime > div {
    margin: 30px auto;
}
.consul-opentime p {
    margin-top: 10px;
    margin-left: 17px;
	text-indent: -17px;
}
.consul-opentime p:before {
    content: "";
    display: inline-block;
    width: 12px;
    padding-top: 12px;
    background: #fbb03b;
    margin-right: 5px;
}
.consul-opentime a {
    display: block;
    width: 365px;
    font-size: 2rem;
	font-family: 'Noto Sans JP', sans-serif;
    text-align: center;
    padding: 5px 0;
    background: #ffffff;
    border: 2px solid #c4bfbb;
    border-radius: 30px;
    margin: 30px auto;
}
.consul-opentime a .webFont:before {
    content: "\e904";
    display: inline-block;
	font-size: 2.4rem;
	color: #75d3c1;
    position: relative;
    top: 3px;
    margin-right: 20px;
}
	/* ------  .consul-opentime  end ----- */


	/* ------    screen width 1850px   start ----- */

@media screen and (max-width:1850px){

.ConsultationFeeTime .area-mainVisual > div {
	background-size: 1920px auto, 220px auto, 631px auto, 1920px auto;
	}

}
	/* ------    screen width 1850px   end ----- */

	/* ------    screen width 1300px   start ----- */

@media screen and (max-width:1300px){

.ConsultationFeeTime .area-mainVisual > div {
	background-position: center bottom, -2% bottom, 120% bottom, center 30px;
	background-size: 148%, 17%, 40%, 148%;
	}

}

	/* ------    screen width 1300px   end ----- */


	/* ------    screen width 768px   start ----- */

@media screen and (max-width:768px){

.ConsultationFeeTime .area-mainVisual {
    padding-bottom: 220px;
	}
.ConsultationFeeTime .area-mainVisual > div {
	background-position: center bottom, -11% bottom, 130% bottom, center 30px;
	background-size: 148%, 26%, 48%, 148%;
	}
.ConsultationFeeTime h2 {
    font-size: calc(40 / 768 * 100vw);
	}
.consul-opentime-bg {
    padding: 50px 0;
	}
.consul-opentime dl {
	justify-content: space-around;
	}
.consul-opentime dl > div {
    width: calc(334 / 736 * 100%);
	}

}

	/* ------    screen width 768px   end ----- */

	/* ------    screen width 640px   start ----- */

@media screen and (max-width:640px){

.consul-fee dd:last-of-type li:after {
	padding-bottom: calc(290 / 294 * 100%);
	}
.consul-fee dd:first-of-type > span:after {
    width: calc(65 / 608 * 100%);
    padding-bottom: calc(216 / 608 * 100%);
	}
.consul-opentime dl > div {
    padding: calc(70 / 608 * 100%) 0;
	}
.consul-opentime dt {
    font-size: calc(28 / 640 * 100vw);
	}
.consul-opentime dd {
    font-size: calc(32 / 640 * 100vw);
	}
.consul-opentime > div br {
    display: none;
	}

}

	/* ------    screen width 640px   end ----- */

	/* ------    screen width 480px   start ----- */

@media screen and (max-width:480px){

.menu-list > li:nth-child(2):after,
.sub-menu-list > li:nth-child(3) a:after {
	padding-top: 0;
	}
.ConsultationFeeTime .area-mainVisual {
    padding-bottom: calc(200 / 480 * 100%);
	}
.ConsultationFeeTime .area-mainVisual > div {
	background-position: center bottom, -15% bottom, 135% bottom, left 0;
	background-size: 148%, 32%, 48%, 148%;
	}
.ConsultationFeeTime h2 {
    font-size: calc(27 / 480 * 100vw);
	}
.lead-sentence p {
	font-size: 1.6rem;
	}
.consul-fee {
	font-size: min(24px, (24 / 480 * 100vw))
	}
.fee {
    font-size: calc(40 / 24 * 1em);
	}
.consul-fee dd:first-of-type {
    height: min(75px, (75 / 480 * 100vw));
    width: clamp(220px, (400 / 480 * 100vw), 400px);
    margin-left: auto;
    margin-right: auto;
	}
.consul-fee dd:first-of-type:after {
    width: min(48px, (48 / 480 * 100vw));
	}
.consul-fee dd:last-of-type ul {
	flex-direction: column;
	align-items: center;
	}
.consul-fee dd:last-of-type li {
	width: clamp(220px, (400 / 480 * 100vw), 400px);
	}
.consul-fee-method {
	text-align: initial;
	}
.consul-fee-notes p br {
	display: none;
	}
.consul-opentime-bg {
    padding: calc(50 / 480 * 100%) 0;
	}
.consul-opentime dl {
	flex-wrap: wrap;
    justify-content: center;
	}
.consul-opentime dl > div {
    width: calc(334 / 448 * 100%);
    max-width: 334px;
    min-width: 280px;
    padding: calc(50 / 448 * 100%) 0;
	}
.consul-opentime dl > div:not(:first-of-type) {
    margin-top: calc(30 / 448 * 100%);
	}
.consul-opentime dt {
    font-size: calc(33 / 480 * 100vw);
	}
.consul-opentime dd {
    font-size: calc(33 / 480 * 100vw);
	}
.consul-opentime dd span {
    font-size: calc(55 / 480 * 100vw);
	}
.consul-opentime a {
    width: 100%;
    font-size: 1.8rem;
	}
.consul-opentime a .webFont:before {
    font-size: 2.2rem;
    margin-right: calc(20 / 448 * 100%);
	}

}
	/* ------    screen width 480px   end ----- */
