*,
::before,
::after {
  box-sizing: border-box;
}

.kv {
  background-repeat: no-repeat;
}
@media screen and (min-width: 769px) {
  .kv {
    background-position: 50% 70%;
    display: flex;
    align-items: center;
    height: min(350px, 23.334vw);
    margin-top: 10rem;
    background-image: url(../img/mv.jpg);
    background-size: cover;
  }
}
@media screen and (max-width: 768px) {
  .kv {
    background-position: 50% 0;
    margin-top: 12rem;
    padding-top: 67rem;
    background-image: url(../img/sp/mv.jpg);
    background-size: contain;
  }
}

@media screen and (min-width: 769px) {
  .kv_content {
    width: min(1500px, 100vw);
    margin: 0 auto;
    padding-left: min(160px, 10.667vw);
  }
}
@media screen and (max-width: 768px) {
  .kv_content {
    padding: 3rem 3rem 0;
    background-color: #efefef;
  }
}

@media screen and (max-width: 768px) {
  .kv_content_inr {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 6.8rem 3rem 0;
    background-color: #fff;
  }
}

.kv_ttl {
  position: relative;
  display: flex;
  flex-direction: column;
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .kv_ttl {
    font-size: min(51px, 3.4vw);
    padding-bottom: min(5px, 0.334vw);
    letter-spacing: -0.05em;
  }
}
@media screen and (max-width: 768px) {
  .kv_ttl {
    font-size: 7rem;
    padding-left: 4.2rem;
    padding-bottom: 0.4rem;
  }
}
.kv_ttl::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background-color: #d90b18;
}
@media screen and (min-width: 769px) {
  .kv_ttl::before {
    left: min(-30px, -2vw);
    width: min(11px, 0.734vw);
  }
}
@media screen and (max-width: 768px) {
  .kv_ttl::before {
    left: 0;
    width: 1.5rem;
  }
}
.kv_ttl .en {
  fill: #d90b18;
}
@media screen and (min-width: 769px) {
  .kv_ttl .en {
    width: min(174px, 11.6vw);
    height: min(28px, 1.867vw);
    margin-top: min(10px, 0.667vw);
  }
}
@media screen and (max-width: 768px) {
  .kv_ttl .en {
    width: 28.1rem;
    height: 4.5rem;
    margin-top: 1.5rem;
  }
}

@media screen and (min-width: 769px) {
  .kv_txt {
    margin-top: min(25px, 1.667vw);
    letter-spacing: 0.1em;
    line-height: 1.778em;
    font-size: 1.8rem;
  }
  .kv_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .kv_txt > p:first-of-type {
    margin-top: -0.388em;
  }
  .kv_txt > p:last-of-type {
    margin-bottom: -0.388em;
  }
}
@media screen and (max-width: 768px) {
  .kv_txt {
    margin-top: min(48px, 3.2vw);
    line-height: 1.834em;
    font-size: 2.4rem;
  }
  .kv_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .kv_txt > p:first-of-type {
    margin-top: -0.416em;
  }
  .kv_txt > p:last-of-type {
    margin-bottom: -0.416em;
  }
}

.p_purpose {
  background-color: #efefef;
}
@media screen and (min-width: 769px) {
  .p_purpose {
    padding: min(100px, 6.667vw) 0;
  }
}
@media screen and (max-width: 768px) {
  .p_purpose {
    padding: 0 3rem 3rem;
  }
}

.p_purpose_inr {
  background-color: #fff;
  margin: 0 auto;
}
@media screen and (min-width: 769px) {
  .p_purpose_inr {
    width: min(1338px, 89.2vw);
    padding-top: min(82px, 5.467vw);
    padding-bottom: min(170px, 11.334vw);
  }
}
@media screen and (max-width: 768px) {
  .p_purpose_inr {
    padding: 5.8rem 0 3.5rem;
  }
}

.purpose_img01 {
  margin: 0 auto;
}
@media screen and (min-width: 769px) {
  .purpose_img01 {
    width: min(732px, 48.8vw);
  }
}
@media screen and (max-width: 768px) {
  .purpose_img01 {
    width: 50rem;
  }
}

@media screen and (min-width: 769px) {
  .purpose_img02 {
    width: min(966px, 64.4vw);
    margin: min(35px, 2.334vw) auto min(35px, 2.334vw);
  }
}
@media screen and (max-width: 768px) {
  .purpose_img02 {
    width: 68.2rem;
    margin: 3rem auto;
  }
}

@media screen and (min-width: 769px) {
  .purpose_img03 {
    width: min(919px, 61.267vw);
    margin: min(30px, 2vw) auto min(25px, 1.667vw);
    height: min(253px, 18vw);
    background: url(../img/bg.png) no-repeat;
    background-size: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 2rem;
  }
  .purpose_img03 a {
    width: 50% !important;
    height: 100%;
    display: flex !important;
    justify-content: center;
    align-items: center;
    font-size: 3.4rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    transition: all 0.4s ease;
    padding-left: 4.5rem;
  }
  .purpose_img03 a span {
    font-size: 70%;
    margin-top: 1rem;
  }
  .purpose_img03 a:nth-of-type(2) {
    padding-right: 4.5rem;
    flex-direction: column;
    transform: translateX(-1.4rem);
  }
}
@media screen and (min-width: 769px) and (max-width: 768px) {
  .purpose_img03 a:nth-of-type(2) {
    transform: translateX(-1.4rem);
  }
}
@media screen and (min-width: 769px) {
  .purpose_img03 a:hover {
    font-size: 3.7rem;
  }
}
@media screen and (max-width: 768px) {
  .purpose_img03 {
    width: 66.9rem;
    margin: 3.5rem auto;
    height: 25vw;
    background: url(../img/bg_sp.png) no-repeat;
    background-size: 89.3vw;
    display: flex;
    justify-content: space-between;
  }
  .purpose_img03 a {
    width: 50%;
    height: 100%;
    display: flex !important;
    justify-content: center;
    align-items: center;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    transition: all 0.4s ease;
    padding-left: 4.5rem;
  }
  .purpose_img03 a span {
    font-size: 70%;
  }
  .purpose_img03 a:nth-of-type(2) {
    padding-right: 6rem;
    flex-direction: column;
    transform: translateX(-1.05rem);
  }
  .purpose_img03 a:hover {
    font-size: 2.6rem;
  }
}

.lead_head {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .lead_head {
    padding-top: min(105px, 7vw);
  }
}
@media screen and (max-width: 768px) {
  .lead_head {
    padding-top: 8.5rem;
  }
}
.lead_head .head_group {
  order: 2;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 769px) {
  .lead_head .head_group .jp {
    line-height: 1;
    font-size: 5.4rem;
  }
  .lead_head .head_group .jp > h2 {
    line-height: inherit;
    font: inherit;
  }
  .lead_head .head_group .jp > h2:first-of-type {
    margin-top: 0em;
  }
  .lead_head .head_group .jp > h2:last-of-type {
    margin-bottom: 0em;
  }
}
@media screen and (max-width: 768px) {
  .lead_head .head_group .jp {
    line-height: 1;
    font-size: 4rem;
  }
  .lead_head .head_group .jp > h2 {
    line-height: inherit;
    font: inherit;
  }
  .lead_head .head_group .jp > h2:first-of-type {
    margin-top: 0em;
  }
  .lead_head .head_group .jp > h2:last-of-type {
    margin-bottom: 0em;
  }
}
@media screen and (min-width: 769px) {
  .lead_head .head_group .en {
    margin-top: min(20px, 1.334vw);
    line-height: 1;
    font-size: 3.5rem;
  }
  .lead_head .head_group .en > p {
    line-height: inherit;
    font: inherit;
  }
  .lead_head .head_group .en > p:first-of-type {
    margin-top: 0em;
  }
  .lead_head .head_group .en > p:last-of-type {
    margin-bottom: 0em;
  }
}
@media screen and (max-width: 768px) {
  .lead_head .head_group .en {
    margin-top: 2rem;
    line-height: 1;
    font-size: 2.7rem;
  }
  .lead_head .head_group .en > p {
    line-height: inherit;
    font: inherit;
  }
  .lead_head .head_group .en > p:first-of-type {
    margin-top: 0em;
  }
  .lead_head .head_group .en > p:last-of-type {
    margin-bottom: 0em;
  }
}
.lead_head .purpose_head {
  order: 1;
}
@media screen and (max-width: 768px) {
  .lead_head .purpose_head {
    margin-bottom: 3rem;
  }
}

.purpose_head {
  margin: 0 auto;
  background-color: #d90b18;
  color: #fff;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 769px) {
  .purpose_head {
    width: min(300px, 20vw);
    margin-bottom: min(45px, 3vw);
    padding: min(15px, 1vw) 0;
    line-height: 1;
    font-size: 2.4rem;
  }
  .purpose_head > h3 {
    line-height: inherit;
    font: inherit;
  }
  .purpose_head > h3:first-of-type {
    margin-top: 0em;
  }
  .purpose_head > h3:last-of-type {
    margin-bottom: 0em;
  }
}
@media screen and (max-width: 768px) {
  .purpose_head {
    width: 30rem;
    margin-bottom: 4rem;
    padding: 1.4rem 0;
    line-height: 1;
    font-size: 2.8rem;
  }
  .purpose_head > h3 {
    line-height: inherit;
    font: inherit;
  }
  .purpose_head > h3:first-of-type {
    margin-top: 0em;
  }
  .purpose_head > h3:last-of-type {
    margin-bottom: 0em;
  }
}
.purpose_head.mod {
  width: auto;
}
@media screen and (min-width: 769px) {
  .purpose_head.mod {
    padding: min(15px, 1vw) 1.5em;
  }
}
@media screen and (max-width: 768px) {
  .purpose_head.mod {
    padding: 1.4rem 1.5em;
  }
}

.purpose_txt {
  font-weight: 500;
}
@media screen and (min-width: 769px) {
  .purpose_txt {
    line-height: 2.334em;
    font-size: 1.8rem;
  }
  .purpose_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .purpose_txt > p:first-of-type {
    margin-top: -0.666em;
  }
  .purpose_txt > p:last-of-type {
    margin-bottom: -0.666em;
  }
  .purpose_txt {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .purpose_txt {
    padding: 0 3rem;
    line-height: 1.75em;
    font-size: 2.4rem;
  }
  .purpose_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .purpose_txt > p:first-of-type {
    margin-top: -0.375em;
  }
  .purpose_txt > p:last-of-type {
    margin-bottom: -0.375em;
  }
}

.purpose_next {
  position: relative;
  margin: 0 auto;
}
@media screen and (min-width: 769px) {
  .purpose_next {
    width: min(1000px, 66.667vw);
    margin: min(58px, 3.867vw) auto min(65px, 4.334vw);
    padding: min(84px, 5.6vw) 0 min(72px, 3.3vw);
  }
}
@media screen and (max-width: 768px) {
  .purpose_next {
    margin: 3rem auto 3.2rem;
    padding: 11rem 3rem 10.5rem;
  }
}
.purpose_next::before, .purpose_next::after {
  content: "";
  position: absolute;
}
.purpose_next::before {
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background-color: #000;
}
.purpose_next::after {
  bottom: 0;
  left: 50%;
  width: 1px;
  background-color: #000;
  transform-origin: 50% 100%;
  rotate: -44deg;
}
@media screen and (min-width: 769px) {
  .purpose_next::after {
    height: min(20px, 1.334vw);
  }
}
@media screen and (max-width: 768px) {
  .purpose_next::after {
    height: 2rem;
  }
}

.purpose_next_txt {
  position: relative;
  margin: 0 auto;
  font-weight: 700;
  padding: 1px;
  background: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 50%, rgb(230, 0, 18) 50%, rgb(230, 0, 18) 100%);
}
@media screen and (min-width: 769px) {
  .purpose_next_txt {
    width: min(562px, 37.467vw);
    line-height: 1;
    font-size: 3.4rem;
  }
  .purpose_next_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .purpose_next_txt > p:first-of-type {
    margin-top: 0em;
  }
  .purpose_next_txt > p:last-of-type {
    margin-bottom: 0em;
  }
}
@media screen and (max-width: 768px) {
  .purpose_next_txt {
    width: 56.2rem;
    line-height: 1;
    font-size: 3.5rem;
  }
  .purpose_next_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .purpose_next_txt > p:first-of-type {
    margin-top: 0em;
  }
  .purpose_next_txt > p:last-of-type {
    margin-bottom: 0em;
  }
}
.purpose_next_txt > p {
  background-color: #fff;
  text-align: center;
}
@media screen and (min-width: 769px) {
  .purpose_next_txt > p {
    padding: min(25px, 1.667vw) 0;
  }
}
@media screen and (max-width: 768px) {
  .purpose_next_txt > p {
    padding: 2.5rem 0;
    letter-spacing: -0.01em;
  }
}

.purpose_lead {
  text-align: center;
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .purpose_lead {
    line-height: 1.778em;
    font-size: 2.7rem;
  }
  .purpose_lead > p {
    line-height: inherit;
    font: inherit;
  }
  .purpose_lead > p:first-of-type {
    margin-top: -0.388em;
  }
  .purpose_lead > p:last-of-type {
    margin-bottom: -0.388em;
  }
}
@media screen and (max-width: 768px) {
  .purpose_lead {
    line-height: 1.634em;
    font-size: 3rem;
  }
  .purpose_lead > p {
    line-height: inherit;
    font: inherit;
  }
  .purpose_lead > p:first-of-type {
    margin-top: -0.316em;
  }
  .purpose_lead > p:last-of-type {
    margin-bottom: -0.316em;
  }
}

@media screen and (min-width: 769px) {
  .purpose_cont04 {
    padding-top: min(120px, 8vw);
  }
}
@media screen and (max-width: 768px) {
  .purpose_cont04 {
    padding-top: 7rem;
  }
}

.principle {
  display: grid;
}
@media screen and (min-width: 769px) {
  .principle {
    grid-template-columns: repeat(3, 1fr);
    -moz-column-gap: min(56px, 3.734vw);
         column-gap: min(56px, 3.734vw);
    width: min(1060px, 70.667vw);
    margin: 0 auto;
    padding-top: min(50px, 3.334vw);
  }
}
@media screen and (max-width: 768px) {
  .principle {
    row-gap: 3.2rem;
    width: 63.2rem;
    margin: 0 auto;
    padding-top: 4rem;
  }
}

.principle_item {
  position: relative;
}
@media screen and (min-width: 769px) {
  .principle_item {
    padding: 2px;
    clip-path: polygon(0 0, 81.5286624204% 0, 100% 20.4081632653%, 100% 100%, 0 100%);
    background: linear-gradient(136.5deg, rgb(215, 18, 24) 0%, rgb(215, 18, 24) 45%, rgb(0, 0, 0) 45%, rgb(0, 0, 0) 100%);
  }
}
@media screen and (max-width: 768px) {
  .principle_item {
    padding: 0.2rem;
    clip-path: polygon(0 0, 90.1898734177% 0, 100% 20.8333333333%, 100% 100%, 0 100%);
    background: linear-gradient(157deg, rgb(215, 18, 24) 0%, rgb(215, 18, 24) 47.5%, rgb(0, 0, 0) 47.5%, rgb(0, 0, 0) 100%);
  }
}

.principle_item_inr {
  height: 100%;
  background-color: #fff;
}
@media screen and (min-width: 769px) {
  .principle_item_inr {
    height: min(245px, 16.334vw);
    padding: min(35px, 2.334vw) min(30px, 2vw) 0;
    clip-path: polygon(0 0, 81.847133758% 0, 100% 20%, 100% 100%, 0 100%);
  }
}
@media screen and (max-width: 768px) {
  .principle_item_inr {
    display: grid;
    grid-template-columns: 28.6rem auto;
    align-items: center;
    height: 24rem;
    clip-path: polygon(0 0, 90.1898734177% 0, 100% 20.8333333333%, 100% 100%, 0 100%);
  }
}

.principle_item_head {
  text-align: center;
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .principle_item_head .head {
    line-height: 1.267em;
    font-size: 3rem;
  }
  .principle_item_head .head > h4 {
    line-height: inherit;
    font: inherit;
  }
  .principle_item_head .head > h4:first-of-type {
    margin-top: -0.133em;
  }
  .principle_item_head .head > h4:last-of-type {
    margin-bottom: -0.133em;
  }
}
@media screen and (max-width: 768px) {
  .principle_item_head .head {
    line-height: 1.185em;
    font-size: 3.8rem;
  }
  .principle_item_head .head > h4 {
    line-height: inherit;
    font: inherit;
  }
  .principle_item_head .head > h4:first-of-type {
    margin-top: -0.092em;
  }
  .principle_item_head .head > h4:last-of-type {
    margin-bottom: -0.092em;
  }
}
.principle_item_head .small {
  letter-spacing: -0.05em;
}
@media screen and (min-width: 769px) {
  .principle_item_head .small {
    line-height: 1.843em;
    font-size: 1.9rem;
  }
  .principle_item_head .small > span {
    line-height: inherit;
    font: inherit;
  }
  .principle_item_head .small > span:first-of-type {
    margin-top: -0.421em;
  }
  .principle_item_head .small > span:last-of-type {
    margin-bottom: -0.421em;
  }
}
@media screen and (max-width: 768px) {
  .principle_item_head .small {
    line-height: 1.731em;
    font-size: 2.6rem;
  }
  .principle_item_head .small > span {
    line-height: inherit;
    font: inherit;
  }
  .principle_item_head .small > span:first-of-type {
    margin-top: -0.365em;
  }
  .principle_item_head .small > span:last-of-type {
    margin-bottom: -0.365em;
  }
}

.principle_item_txt {
  text-align: justify;
}
@media screen and (min-width: 769px) {
  .principle_item_txt {
    margin-top: min(15px, 1vw);
    line-height: 1.75em;
    font-size: 1.6rem;
  }
  .principle_item_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .principle_item_txt > p:first-of-type {
    margin-top: -0.375em;
  }
  .principle_item_txt > p:last-of-type {
    margin-bottom: -0.375em;
  }
}
@media screen and (max-width: 768px) {
  .principle_item_txt {
    padding-right: 3rem;
    line-height: 1.864em;
    font-size: 2.2rem;
  }
  .principle_item_txt > p {
    line-height: inherit;
    font: inherit;
  }
  .principle_item_txt > p:first-of-type {
    margin-top: -0.431em;
  }
  .principle_item_txt > p:last-of-type {
    margin-bottom: -0.431em;
  }
}

.lead_head .head_group .en > p.yose {
  margin-left: -1em;
}
@media screen and (max-width: 768px) {
  .lead_head .head_group .en > p.yose {
    margin-left: 0;
  }
}

.purpose_img03 a {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.purpose_img03 a img {
  transition: all 0.4s ease;
}
.purpose_img03 a:hover img {
  transform: scale(1.1);
}

@media screen and (max-width: 768px) {
  .lead_head .head_group .jp > h2.yose {
    margin-left: 0.6em;
  }
}/*# sourceMappingURL=purpose.css.map */