@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@500&display=swap');

/* スライダー横スクロール修正　*/
.ti-widget-container {
  width: 100%;
  overflow: hidden;
}
/***********************/
:root {
  --main: #FF926B;
  --sub: #F49BAB;
  --accent: #3C2924;
  --text: #343131;
  --white: #FFFFFF;
  --gray: #F5F5F5;
  --bg1: #FFF7F1;
  --bg2: #FAF7F3;
  --font-size: 16px;
  --bold: 700;
  --content-width: 430px;
  --content-inner-width: 370px;
  --header-height: 52px;
  --font-en: "Montserrat", sans-serif;
  --font-serif: "Noto Serif JP", serif;
  --font18: clamp(16px, 4.62vw, 18px);
  --font20: clamp(16px, 5.2vw, 20px);
  --font22: clamp(16px, 5.65vw, 22px);
  --font24: clamp(16px, 6.2vw, 24px);
  --font26: clamp(16px, 6.7vw, 26px);
  --font28: clamp(16px, 6.7vw, 28px);
  --font32: clamp(16px, 7.2vw, 32px);
  --font36: clamp(16px, 9.3vw, 36px);
  --font42: clamp(16px, 10.8vw, 42px);
}

* { margin: 0; padding: 0; box-sizing: border-box;}
html { scroll-padding-top: var(--header-height);}
body {
  font-family: "Noto Sans JP", sans-serif;
  color: var(--text);
  font-size: var(--font-size);
  font-weight: 500;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
body.active { height: 100vh; overflow: hidden;}
ul, ol { list-style-type: none;}
h1, h2, h3, h4 { font-size: inherit; font-weight: inherit; word-break: auto-phrase;}
a { color: var(--text); text-decoration: none;}
a, a::before, a::after, a:hover, a:hover:before, a:hover:after { transition: all 0.5s ease;}
a:hover { opacity: 0.7;}
span { display: inline-block;}
em, small, mark {
  display: inline-block;
  color: inherit;
  font-style: normal;
  font-size: inherit;
  font-weight: inherit;
  background-color: transparent;
}
strong { font-style: normal; font-size: inherit; font-weight: var(--bold);}
img { width: 100%; height: auto; vertical-align: bottom;}
iframe, video { width: 100%; vertical-align: bottom;}
.wrapper {
  width: 100%;
  max-width: var(--content-width);
  min-width: 320px;
  padding-bottom: 70px;
  margin: auto;
  background-color: var(--white);
  box-shadow: 0 2px 14px -2px #00000040;
}
section { padding: 60px 0;}
.section-bg { background-color: var(--bg1);}
.section-inner-narrow {
  width: 100%;
  max-width: 370px;
  margin: auto;
  padding: 0 20px;
}
.section-inner {
  width: 90%;
  max-width: var(--content-inner-width);
  margin: auto;
}
.section-title { font-size: var(--font20); text-align: center;}
.section-title mark { background: linear-gradient( transparent 80%, #FFDA45 20%); line-height: 1.2;}
.section-title.section-title--line::before {
  content: "";
  display: block;
  width: 1px;
  height: 28px;
  background-color: var(--text);
  margin: 0 auto 4px;
}
.btn {
  display: inline-block;
  background-color: var(--main);
  color: var(--white);
  font-size: 12px;
  line-height: 1;
  position: relative;
}
.btn::before {
  content: "";
  width: 14px;
  height: 16px;
  background: url(../img/lp/icon-calender.png) no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 12px;
  margin: auto;
}
.btn::after {
  content: "";
  width: 5px;
  height: 5px;
  border-top: 1px solid var(--white);
  border-left: 1px solid var(--white);
  transform: rotate(135deg);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 8px;
  margin: auto;
}
.header { height: var(--header-height); display: flex; justify-content: space-between; align-items: center;}
.header-logo { width: 132px; margin-left: 20px;}
.header-link { margin-right: 2%;}
.header-link a { padding: 11px 21px 11px 35px; border-radius: 3px; }

.fv-main {
  background: url(../img/lp/first-view.jpg) no-repeat;
  background-size: cover;
  aspect-ratio: 393 / 578;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 30px 5%;
}
.fv-head {
  background-color: var(--bg1);
  font-family: var(--font-serif);
  line-height: 1;
  padding: 9px;
  text-align: center;
}
.fv-text-head { width: 90%; margin-bottom: 10px;}
.fv-text-top { width: 68%;}
.fv-text-bottom1 { width: 68%; margin-bottom: 6px;}
.fv-text-bottom2 { width: 76%; }
.cta-head { font-family: var(--font-serif); font-size: var(--font20); margin-bottom: 35px;}
.cta-head mark { background-color: var(--white); line-height: 1; margin-bottom: 6px; padding: 4px;}
.cta-img { margin-bottom: 20px;}
.cta-content { margin-bottom: 24px;}
.cta-price { margin-bottom: 40px;}
.cta-price-box { display: flex; justify-content: center;}
.cta-price-text .title {
  background-color: #F1ABAB;
  width: 50px;
  height: 50px;
  display: grid;
  place-content: center;
  color: var(--white);
  font-weight: var(--bold);
  line-height: 1.2;
  text-align: center;
  margin-right: 12px;
}
.cta-price-text .price { font-size: var(--font24); background: linear-gradient(transparent 80%, #FFDA45 20%);}
.cta-price-text .price strong {
  font-family: var(--font-en);
  font-size: clamp( var(--font-size), 12.8vw, 50px);
  line-height: 1;
  letter-spacing: 0.1em;
}
.cta-price-note { font-size: 12px; text-align: center; margin-top: 8px;}
.cta-link-item { text-align: center;}
.cta-link-note {
  width: max-content;
  font-size: 15px;
  line-height: 1;
  text-align: center;
  position: relative;
  margin: 0 auto 6px;
}
.cta-link-note::before,
.cta-link-note::after {
  content: "";
  width: 1px;
  height: 14px;
  background-color: var(--text);
  position: absolute;
  bottom: 0;
}
.cta-link-note::before { transform: rotate(-16deg); left: -10px;}
.cta-link-note::after { transform: rotate(16deg); right: -10px;}
.cta-link-item .btn {
  font-size: var(--font18);
  padding: 14px 43px 14px 54px;
  border-radius: 25px;
  box-shadow: 2px 3px 0 #722323;
  margin-bottom: 8px;
}

.cta-link-note.microcopy-tel{
	margin-top: 20px;
}

.btn.tel-btn{
	background: #5E936C;
}

.btn.tel-btn::before{
	background: url(../img/lp/call.png) no-repeat;
    background-size: contain;
	width: 18p !important;
	height: 18px !important;
	transform: translate(0 , 1px);
}

.cta-link-item .btn::before { width: 17px; height: 20px; left: 20px;}
.cta-link-item .btn::after { width: 7px; height: 7px; border-width: 2px; right: 18px;}
.cta-link-item small { font-size: 10px;}
.section-movie { padding-bottom: 0;}
.worry-item { margin-top: 30px;}
.worry-title {
  background-color: var(--accent);
  color: var(--white);
  font-size: var(--font18);
  padding: 8px 46px 8px 15px;
  position: relative;
}
.worry-title::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--white);
  border-left: 2px solid var(--white);
  transform: rotate(-135deg);
  position: absolute;
  top: 12px;
  right: 12px;
}
.worry-title.active::after { transform: rotate(45deg); top: 18px;}
.worry-content { font-weight: 400; display: none; margin-top: 8px;}
.section-ba { background-color: var(--bg2);}
.ba-box { margin-top: 56px;}
.ba-item { margin-top: 40px;}
.reason-item { box-shadow: 0 0 5px #00000026; padding: 40px 5%; margin-top: 70px; position: relative;}
.reason-no {
  background-color: var(--sub);
  color: var(--white);
  line-height: 1;
  padding: 8px 16px;
  position: absolute;
  left: 0;
  top: -16px;
}
.reason-title {
  color: var(--sub);
  font-size: var(--font18);
  font-weight: var(--bold);
  text-align: center;
  margin-bottom: 20px;
}
.reason-text::before {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 313 / 177;
  margin-bottom: 20px;
  background-repeat: no-repeat;
  background-size: cover;
}
.reason-item:nth-child(1) .reason-text::before { background-image: url(../img/lp/reason1.jpg);}
.reason-item:nth-child(2) .reason-text::before { background-image: url(../img/lp/reason2.jpg);}
.reason-item:nth-child(3) .reason-text::before { background-image: url(../img/lp/reason3.jpg);}
.section-qualm { background-color: #BDBDBD; color: var(--white); text-align: center;}
.qualm-head { font-size: var(--font22); font-weight: var(--bold); margin-bottom: 50px;}
.qualm-img { margin-bottom: 20px; padding: 0 3%;}
.qualm-text { font-size: var(--font18); letter-spacing: 0;}
.qualm-text mark { background: linear-gradient(transparent 60%, var(--accent) 40%);}
.section-relief { background: url(../img/lp/relief-bg.jpg) no-repeat; background-size: cover; padding-bottom: 20px;}
.relief-text { text-align: center; font-weight: 400; letter-spacing: 0; margin-top: 16px;}
.relief-box-head { font-size: var(--font18); text-align: center; margin-bottom: 30px;}
.relief-box {
  background-color: var(--white);
  letter-spacing: 0;
  box-shadow: 0 0 10px #0000001A;
  padding: 40px 5%;
  margin-top: 40px;
}
.relief-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 130px;
  margin-bottom: 40px;
  position: relative;
}
.relief-item::before {
  content: "";
  width: 130px;
  height: 100%;
  margin-right: 10px;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  bottom: 0;
}
.relief-item:last-of-type { margin-bottom: 0;}
.relief-item1::before { background-image: url(../img/lp/relief1.jpg);}
.relief-item2::before { background-image: url(../img/lp/relief2.jpg);}
.relief-item3::before { background-image: url(../img/lp/relief3.jpg);}
.relief-head { padding-left: 140px; color: var(--sub); font-weight: var(--bold); line-height: 1.25; margin-bottom: 4px;}
.relief-content { padding-left: 140px; font-size: 14px; font-weight: 400;}
.section-question { padding-bottom: 0; letter-spacing: 0;}
.section-question .section-title span {
  background-color: var(--accent);
  color: var(--white);
  font-size: var(--font18);
  line-height: 1;
  padding: 8px 10px;
  margin-bottom: 10px;
}
.question-img { margin-top: 24px;}
.question-text { margin-top: 24px; text-align: center; font-size: var(--font18); font-weight: 400;}
.section-program { background-color: var(--bg2);}
.section-program .section-title { font-size: var(--font18);}
.program-box { margin-top: 40px;}
.program-text { font-size: var(--font18); text-align: center; padding: 60px 0 30px;}
.flow-box { margin-top: 60px;}
.flow-title { font-size: var(--font18); line-height: 1; margin: 16px 0;}
.flow-title::before {
  content: attr(data-text);
  display: inline-block;
  background-color: var(--sub);
  color: var(--white);
  font-family: var(--font-en);
  padding: 4px 8px;
  margin-right: 12px;
}
.flow-content {
  border-left: 1px solid #563A32;
  padding-left: 24px;
  margin-left: 15px;
}
.flow-content::before {
  content: "";
  display: block;
  width: 90%;
  max-width: 244px;
  aspect-ratio: 244 / 150;
  margin-bottom: 16px;
  background-repeat: no-repeat;
  background-size: cover;
}
.flow-item:nth-child(1) .flow-content::before { background-image: url(../img/lp/flow1.jpg);}
.flow-item:nth-child(2) .flow-content::before { background-image: url(../img/lp/flow2.jpg);}
.flow-item:nth-child(3) .flow-content::before { background-image: url(../img/lp/flow3.jpg);}
.flow-item:nth-child(4) .flow-content::before { background-image: url(../img/lp/flow4.jpg);}
.flow-item:nth-child(5) .flow-content::before { background-image: url(../img/lp/flow5.jpg);}
.flow-content p { letter-spacing: 0;}
.flow-content .cta-link-item { text-align: left;}
.flow-content .btn {
  font-size: 12px;
  margin-top: 16px;
  padding: 10px 24px 10px 38px;
}
.flow-content .cta-link-item .btn::before { width: 12px; height: 14px; left: 14px;}
.flow-content .cta-link-item .btn::after { width: 4px; height: 4px; border-width: 1px; right: 8px;}
.section-access { background: url(../img/lp/access-bg.jpg) no-repeat; background-size: cover;}
.access-box { margin-top: 40px;}
.access-item { margin-bottom: 20px; font-size: var(--font18);}
.access-box::before {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 307 / 205;
  background: url(../img/lp/access.jpg) no-repeat;
  background-size: cover;
  margin-bottom: 24px;
}

.section-access.kuwana .access-box::before{
	 content: "";
  display: block;
  width: 100%;
  aspect-ratio: 307 / 205;
	background: url(https://www.mie-biyouhari.com/wp-content/uploads/2025/07/kuwana.png) no-repeat;
	background-size: cover;
  margin-bottom: 24px;
}

.access-title { margin-bottom: 12px;}
.access-title mark { background-color: var(--accent); color: var(--white); padding: 0 4px;}
.access-content { font-weight: 400;}
.access-content p + p { margin-top: 1em;}
.access-content strong { font-weight: var(--bold); display: block;}
.access-map { aspect-ratio: 309 / 209; margin-top: 30px;}
.access-map iframe { width: 100%; height: 100%;}
.sns-wrap { padding-top: 100px;}
.sns-title {
  font-size: var(--font18);
  font-weight: var(--bold);
  letter-spacing: 0;
  text-align: center;
  margin-bottom: 40px;
}
.qa-box { margin-top: 40px; letter-spacing: 0;}
.qa-item { margin-top: 24px;}
.qa-q {
  display: flex;
  background-color: var(--sub);
  color: var(--white);
  font-size: var(--font18);
  font-weight: var(--bold);
  padding: 8px 32px 8px 8px;
  position: relative;
}
.qa-q::before { content: "Q."; font-family: var(--font-en); margin-right: 6px;}
.qa-q::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--white);
  border-left: 2px solid var(--white);
  transform: rotate(-135deg);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 12px;
  margin: auto;
}
.qa-q.active::after { transform: rotate(45deg);}
.qa-a { line-height: 1.75; margin-top: 8px; display: none;}
.copy { font-size: 10px; text-align: center; padding: 16px;}
.footer-cta {
  width: 100%;
  max-width: var(--content-width);
  position: fixed;
  bottom: -70px;
  left: 0; right: 0;
  margin: auto;
  transition: all 0.5s ease;
  z-index: 10;
}
.footer-cta a {
  display: block;
  width: 100%;
  background-color: var(--main);
  color: var(--white);
  padding: 10px;
  box-shadow: 0 -2px 3px #0000001A;
}
.footer-cta .cta-link-note { color: var(--white); margin-bottom: 8px;}
.footer-cta .btn {
  font-size: var(--font22);
  border-radius: 0;
  box-shadow: none;
  margin: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.footer-cta .cta-link-note::before,
.footer-cta .cta-link-note::after { background-color: var(--white);}
.footer-cta.view { bottom: 0; transition: all 0.5s ease;}

.voice_inner {
	max-width: var(--content-inner-width);
  width: 100%;
    max-width: 370px;
    margin: auto;
    padding: 0 20px;
}

.section-voice .section-title{
	margin-bottom: 55px;
}

.section-voice .btn::before{
  background: initial;
}

.sb-feed-container ,
#sb-reviews-container-1,
.sb-feed-posts{
	padding: 0;
}

@media(min-width: 421px){
	.header{
		max-width: 420px;
		margin: 0 auto;
	}
	.first-view{
		max-width: 420px;
		margin: 0 auto;
	}
	.section-qualm{
		max-width: 420px;
		margin: 0 auto;
	}
	.section-relief{
		max-width: 420px;
		margin: 0 auto;
	}
	.section-access{
		max-width: 420px;
		margin: 0 auto;
	}
}

#basis .section-title{
  margin-bottom: 55px;
}

.basis-container{
  padding: 0 3%;
}

@media (min-width: 421px) {
  .basis-container {
      max-width: 420px;
      margin: 0 auto;
  }
}


.footer-cta.flex-box{
	display: flex;
}

.cta-link-item.flex-box .btn::before{
	width: 14px;
    height: 14px;
	left: 0;
}

.cta-link-item.flex-box .btn::after{
	right: 0;
}

.footer-cta.flex-box .cta-link-note{
	font-size: 12px;
	margin-bottom: 3px;
}

.footer-cta.flex-box .btn{
	font-size: 14px;
	padding: initial;
}

.flex-box .cta-link-note::before, .flex-box .cta-link-note::after{
	height: 11px;
}

.footer-cta .footer-tel-cta{
	background-color: #5E936C;
}

.footer-cta .footer-tel-cta .btn{
	background-color: #5E936C;
}

.footer-cta .footer-tel-cta .btn::before{
	background: url(../img/lp/call.png) no-repeat;
    background-size: contain;
}
