/*******************************************************
 * for SYUKATSU CATEGORY PAGE
 *******************************************************/

/** Recruit-Points --------------------------**/
.recruit-points .mouth {
	padding: 1rem;
	background-color: #d5eef5;
	border-radius: 8px;
}
.recruit-points .mouth figure { margin-bottom: 0.5rem; }
.recruit-points .mouth.women {	background-color: #ffd9e4; }

.point-box2 .eyes figure { margin: 1.8rem 0 0.5rem 3.8em; }
.point-box2 .eyes p { margin-bottom: 1.5rem; margin-left: 3.8em; }

 @media screen and (max-width: 480px){
.point-box2 .eyes figure { margin: 1.5rem 0 0.8rem 0; }
.point-box2 .eyes p { margin-bottom: 0; margin-left: 0; }
 }


/** Recruit-Hairmake --------------------------**/
.recruit-hairmake .questions {
 margin-bottom: 4.5rem;
	padding-bottom: 0.7rem;
	background-color: #fdedec;
 position: relative;
}
.recruit-hairmake .questions::after {
 content: "";
 display: block;
 width: 3em;
 height: 3em;
 background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/icon_arrow-down.png") no-repeat;
 background-size: contain;
 position: absolute;
 bottom: -3.5rem;
 left:  50%;
 transform: translateX(-50%);
}

.recruit-hairmake .questions h2,
.recruit-hairmake .advices h2 {
	margin-bottom: 1.4rem;
	padding: 0.8rem;
	background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/bg_qa.png");
	border: 0;
	color: #fff;
	font-size: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);
	text-align: center;
	position: relative;
}
.recruit-hairmake .questions h2 span,
.recruit-hairmake .advices h2 span { color: #ffcc00; }
.recruit-hairmake .questions h2::before,
.recruit-hairmake .advices h2::before {
	content: "";
 position: absolute;
 top: 100%;
 left: 50%;
 margin-left: -15px;
 border: 15px solid transparent;
 border-top: 15px solid #ff5959;
}
.recruit-hairmake .questions h4,
.recruit-hairmake .advices h4 {
	margin: 0 1rem;
	display: flex;
	color: #ff5959;
	font-size: clamp(0.938rem, 0.878rem + 0.3vw, 1.1rem);
 align-items: center;
}
.recruit-hairmake .questions h4::before {
 display: block;
 content: "";
 margin-right: 0.5rem;
 width: 3em;
	min-width: 46px;
 height: 3em;
 background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/icon_1st.png") left no-repeat;
	background-size: contain;
}
.recruit-hairmake .questions h4:nth-of-type(2)::before {
	background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/icon_2nd.png") left no-repeat;
	background-size: contain;
}
.recruit-hairmake .questions h4:last-of-type::before {
	background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/icon_3rd.png") left no-repeat;
	background-size: contain;
}
.recruit-hairmake .questions p + h4,
.recruit-hairmake .advices p + h4 {
	padding-top: 0.5rem;
	border-top: 1px dotted #808080;
}
.recruit-hairmake .questions p,
.recruit-hairmake .advices p {	margin: 0 1rem 1.5rem 5.5em; }

.recruit-hairmake .advices {
	padding-bottom: 0.7rem;
	background-color: #d5eeee;
}
.recruit-hairmake .advices h2 {
	background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/bg_adv.png");
}
.recruit-hairmake .advices h2::before { border-top: 15px solid #41a9a9; }
.recruit-hairmake .advices h4 { color: #119493; }
.recruit-hairmake .advices h4::before {
 display: block;
 content: "";
 margin-right: 0.5rem;
 width: 3em;
	min-width: 46px;
 height: 3em;
 background: url("/wp/wp-content/themes/blocksy-child/img/common/icon_advice.png") left no-repeat;
	background-size: contain;
}

@media screen and (min-width: 768px){
.recruit-hairmake .questions h4,
.recruit-hairmake .advices h4 {	margin: 0 1.5rem; }
.recruit-hairmake .questions p,
.recruit-hairmake .advices p {	margin: 0 1.5rem 1.5rem 6em; }

}


.concept_tx strong {
	color: #fe8d8b;
	font-size: clamp(1.063rem, 0.994rem + 0.34vw, 1.25rem);
}
.concept_tx.blue strong { color: #5591ca; }

.checkpt-box.makeup {
 margin-top: 3.5rem;
 padding-bottom: 2rem;
 position: relative;
}
.checkpt-box.makeup::after {
 content: "";
 display: block;
 width: 3em;
 height: 3em;
 background: url("/wp/wp-content/themes/blocksy-child/img/syukatsu/icon_arrow-down.png") no-repeat;
 background-size: contain;
 position: absolute;
 bottom: -3.5rem;
 left:  50%;
 transform: translateX(-50%);
}
.checkpt-box.makeup .wp-block-column:first-of-type figure { text-align: center; }
.checkpt-box.makeup .wp-block-column:first-of-type figure img {
 margin: -75px 20px 0 0;
 width: 50%;
 max-width: 240px;
}
.checkpt-box.makeup .wp-block-column:last-of-type { margin-top: 1rem; }
.checkpt-box.makeup h5 {
 padding: 0.3rem 0.8rem;
 background-color: #119493;
 color:#fff;
 line-height: 1.2;
}
.checkpt-box.makeup ul { padding-left: 0; }
.checkpt-box.makeup li {
 margin-bottom: 0.2rem;
 padding-top: 0.2rem;
 color: #119493;
 font-size: clamp(0.875rem, 0.784rem + 0.45vw, 1.125rem);
 font-weight: bold;
 line-height: 1.5;
 list-style: none;
 display: flex;
}
.checkpt-box.makeup li::before {
 margin-top: -0.2rem;
 margin-right: 0.5rem;
 content: "\e834";
 font-size: 1.8em;
 font-family: "Material Symbols Outlined";
 font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24;
 line-height: 1;
}

@media screen and (min-width: 782px){
.concept_tx { padding-left: 20%; }
.checkpt-box.makeup { margin-top: 0; }
.checkpt-box.makeup .wp-block-column:first-of-type figure img {
 margin: -75px 0 0 -20px;
 width: 100%;
 max-width: 200px;
}
}


.case-adv {
	margin-bottom: 5rem;
	padding: clamp(1rem, 3vw ,2rem);
	background-color: #fdeded;
	border-radius: 8px;
}
.case-adv h4 {
	margin-bottom: 0.5rem;
	color: #ff3737;
	font-size: clamp(1.063rem, 0.994rem + 0.34vw, 1.25rem);
	display: flex;
	align-items: center;
}
.case-adv h4::before {
 display: block;
 content: "";
 margin-right: 0.5rem;
 width: 2.5em;
	min-width: 40px;
 height: 2.5em;
 background: url("/wp/wp-content/themes/blocksy-child/img/common/icon_advice.png") left no-repeat;
	background-size: contain;
}
.case-adv h4 + p {
	margin: 0 1rem 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px dotted #aaa;
}
.case-adv h4 + p > span.stx {
	display: block;
	margin-top: 0.5rem;
	color: #ff3737;
} 
.case-adv p.stx { padding-left: 0.7rem; color: #ff3737; }
.case-adv.blue { background-color: #e4ebf3; }
.case-adv.blue h4,
.case-adv.blue .stx { color: #4080bf; }

.case-adv .wp-block-columns { margin-left: 1rem; }


@media screen and (min-width: 782px){
.checkpt-box.makeup .wp-block-column:first-of-type figure img {
 margin: -75px 0 0 -20px;
 width: 100%;
 max-width: 200px;
}
}



/** Mail Template --------------------------**/
.modal__close { margin-top: -20px; }
.modal__title {
	margin-top: 0 !important;
	padding: 0.4rem 0.8rem;
	border: 3px solid #119493;
 color: #119493;
	font-weight: 700;
 font-size: 1.1rem;
	letter-spacing: 0.02em;
}
.modal__header .modal__close:before {
 content: "\2715";
 font-size: 150%;
 font-weight: bold;
}
.modal__footer .modal__btn {
	padding: 0.9rem 1.2rem;
	background-color: #119493;
 color: #fff;
	font-weight: 700;
}

.modal__footer button.modal__btn:focus-visible { outline-width: 0; }
.modal__footer .modal__btn:focus {
 -webkit-transform: none;
 transform: none;
}
.modal__footer .modal__btn + .modal__btn { margin-left: 1.4rem; }

.modal__footer .modal__btn:hover {
	color: var(--theme-button-text-hover-color);
 border-color: var(--theme-button-border-hover-color);
 background-color: var(--theme-button-background-hover-color);
	transform: var(--theme-button-transform, translate3d(0, -3px, 0));
}     
.modal__footer .modal__btn:before {
		display: var(--theme-button-shadow, block);
  position: absolute;
  z-index: -1;
  content: "";
  inset-inline: 10px;
  inset-block: 12px 0;
  opacity: 0;
  border-radius: inherit;
  background: inherit;
  transition: opacity .2s ease;
  filter: blur(11px);
 }
.modal__btn:hover:before { opacity: .8;}
.modal__footer .message {
	opacity: 0;
	margin-top: 1rem;
}
.modal__footer .message.is-active { opacity: 1; }