@charset "UTF-8";
/* ===========================================
 * CONTENTS（介護）
 * ======================================== */
.contentsWrap {
  padding-block: 40px;
  background-color: #FEF1DD;
}
.contentsInner {
  width: 1000px;
	margin-inline: auto;
}
@media screen and (max-width: 767px) {
.contentsWrap {
    padding-block: 15px;
  }
  .contentsInner {
    width: min(100%, 346px);
  }
}
/* Intoro */
/* ======================================== */
.contentsIntro {
  padding: 150px 0 240px 190px;
  position: relative;
  z-index: auto;
}
.contentsIntro::before {
  content: "";
  width: 245px;
  height: 415px;
  background: center / 245px 415px no-repeat url(../img/contents_intro_img.png);
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  right: 210px;
}
.contentsIntroText {
  font: 700 3.8rem / 1.3 var(--font_fm-main);
  letter-spacing: -0.05em;
  color: #F08300;
}
.contentsIntroText > span {
  font: 700 3.0rem / 1.1 var(--font_fm-main);
}
@media screen and (max-width: 767px) {
  .contentsIntro {
    padding: 50px  0 60px 15px;
  }
  .contentsIntro::before {
    width: 111px;
    height: 193px;
    background: center / 111px 193px no-repeat url(../img/contents_intro_img.png);
    top: 0;
    right: 30px;
  }
  .contentsIntroText {
    font: 700 2.0rem / 1.3 var(--font_fm-main);
    color: #F08300;
  }
  .contentsIntroText > span {
    font: 700 1.6rem / 1.1 var(--font_fm-main);
  }
}
/* Worry */
/* ======================================== */
.contentsWorryContainer {
  margin-bottom: 45px;
  display: grid;
  grid-template-columns: repeat(3, 300px);
  grid-template-rows: auto;
  align-items: flex-start;
  justify-content: space-between;
}
.contentsWorry {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto auto;
  gap: 15px;
}
.contentsWorry > p {
  font: 700 1.8rem / 1.2 var(--font_fm-main);
  color: #40210F;
}
@media screen and (max-width: 767px) {
  .contentsWorryContainer {
    margin-bottom: 5px;
    grid-template-columns: 100%;
    grid-template-rows: repeat(3, auto);
    justify-content: center;
    gap: 20px;
  }
  .contentsWorry {
    grid-template-columns: 150px auto;
    grid-template-rows: auto;
    align-items: center;
    gap: 10px;
  }
  .contentsWorry > p {
    font: 700 1.4rem / 1.2 var(--font_fm-main);
  }
}
/* Text */
/* ======================================== */
.contentsTextContainer {
  margin-bottom: 65px;
  display: grid;
  gap: 30px;
}
.contentsText01 {
  text-align: center;
  font: 700 5.0rem / 1.2 var(--font_fm-main);
  color: #005E2D;
}
.contentsText02 {
  text-align: center;
  font: 700 4.6rem / 1.2 var(--font_fm-main);
  color: #40210F;
}
.contentsText03 {
  text-align: center;
  font: 700 3.5rem / 1.2 var(--font_fm-main);
  color: #F08300;
}
@media screen and (max-width: 767px) {
  .contentsTextContainer {
    margin-bottom: 30px;
    gap: 15px;
  }
  .contentsText01 {
    font: 700 2.5rem / 1.2 var(--font_fm-main);
  }
  .contentsText02 {
    font: 700 1.8rem / 1.2 var(--font_fm-main);
  }
  .contentsText03 {
    font: 700 1.4rem / 1.2 var(--font_fm-main);
    letter-spacing: -0.05em;
  }
}
/* Section */
/* ======================================== */
.contentsSection {
  width: calc(100% - 50px);
  padding-inline: 50px;
  height: 140px;
  background-color: #005E2D;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.contentsSectionText {
  font: 700 3.2rem / 1.5 var(--font_fm-main);
  color: #F5D660;
  display: flex;
}
@media screen and (max-width: 767px) {
  .contentsSection {
    width: 315px;
    padding-inline: 22px;
    margin-left: -22px;
    height: 60px;
  }
  .contentsSectionText {
    font: 700 1.6rem / 1.5 var(--font_fm-main);
  }
}
/* Explain */
/* ======================================== */
.contentsExplain {
  padding-block: 25px 50px;
  padding-inline: 50px;
}
.contentsExplain:last-child .contentsExplainInner {
  grid-template-columns: 400px 100%;
}
.contentsExplainTitle {
  margin-bottom: 15px;
  font: 700 3.0rem / 1.3 var(--font_fm-main);
  color: #F08300;
  display: block;
}
.contentsExplainInner {
  display: grid;
  grid-template-columns: 400px 300px;
  grid-template-rows: auto;
  column-gap: 50px;
  align-items: center;
}
.contentsExplainImg {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
} 
.contentsExplainText {
  font: 700 1.8rem / 1.5 var(--font_fm-main);
  color: #40210F;
  grid-column: 2 / 3;
  grid-row: 1 / 2;
}
.contentsExplainCaution {
  margin-top: 1em;
  font: 700 1.4rem / 1.5 var(--font_fm-main);
  letter-spacing: -0.05em;
  color: #40210F;
  display: block;
}
@media screen and (max-width: 767px) {
  .contentsExplain {
    padding-block: 15px 30px;
    padding-inline: 15px;
  }
  .contentsExplain:last-child .contentsExplainInner {
    grid-template-columns: auto 150px;
  }
  .contentsExplain:last-of-type .contentsExplainInner .contentsExplainText {
    grid-column: 1 / 2!important;
  }
  .contentsExplain:last-of-type .contentsExplainInner .contentsExplainImg {
    grid-column: 2 / 3!important;
  }
  .contentsExplainTitle {
    font: 700 1.6rem / 1.3 var(--font_fm-main);
  }
  .contentsExplainInner {
    display: grid;
    grid-template-columns: 150px auto;
    grid-template-rows: auto auto;
    column-gap: 10px;
    row-gap: 1em;
  }
  .contentsExplainImg {
    margin-inline: auto;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }
  .contentsExplainText {
    font: 700 1.4rem / 1.5 var(--font_fm-main);
    grid-column: 2 / 3;
    grid-row: 1 / 2;
  }
  .contentsExplainCaution {
    margin-top: 0;
    font: 700 1.2rem / 1.5 var(--font_fm-main);
    grid-column: 1 / 3;
    grid-row: 2 / 3;
  }
}

/* ===========================================
 * VIOCE
 * ======================================== */
.vioceWrap {
  padding-block: 40px;
  background-color: #F6DCB6;
}
.vioceInner {
  width: 1000px;
	padding: 0 50px;
	margin-inline: auto;
}
.voiceTitle {
  width: fit-content;
  margin-inline: auto;
  text-align: center;
  font: 700 6.1rem / 1.5 var(--font_fm-main);
  color: #40210F;
}
.vioceBoxContainer {
  display: grid;
  gap: 15px;
}
.vioceBox {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
}
.vioceBox:last-child {
  flex-direction: row-reverse;
}
.vioceBoxImg {
  width: 280px;
}
.vioceBoxText {
  font: 700 2.0rem / 1.5 var(--font_fm-main);
  color: #40210F;
  flex: 1;
}
@media screen and (max-width: 767px) {
  .vioceWrap {
    padding-block: 20px;
  }
  .vioceInner {
    width: min(100%, 346px);
		padding: 0 0px;
  }
  .voiceTitle {
    margin-bottom: 25px;
    font: 700 2.0rem / 1.5 var(--font_fm-main);
  }
  .vioceBoxContainer {
    gap: 40px;
  }
  .vioceBox {
    gap: 13px;
  }
  .vioceBoxImg {
    width: 100px;
  }
  .vioceBoxText {
    font: 700 1.4rem / 1.5 var(--font_fm-main);
  }
}