@charset "utf-8";

/* 基本色 */
:root {
  --smp--color--smp-green: rgb(0, 122, 76);
  --smp--color--black: #000000;
  --smp--color--white: #ffffff;
  --smp--color--site-white: rgb(252, 250, 250);
  --smp--color--site-glay: rgb(223, 223, 223);
  --smp--color--silver: #cbd5dc;
  --smp--color--gold: rgb(212, 181, 113);
  --smp--color--olive-green: hsl(103, 44%, 52%);
  --smp--color--bright-green: hsl(127, 34%, 81%);
  --smp--color--light-blue: hsl(207, 65%, 71%);
  --smp--color--medium-gray: rgb(167, 168, 170);
  --smp--color--purple: rgb(153, 151, 201);
  --smp--color--orange: hsl(27, 87%, 56%);
  --smp--color--pink: hsl(358, 77%, 78%);
  --smp--color--light-yellow: hsl(49, 100%, 74%);
}

/* グラデーション */
:root {
  --smp--gradient--light-green: linear-gradient(
    135deg,
    rgb(255, 255, 255),
    hsl(127, 34%, 90%)
  );
  /* --smp--gradient--light-green: linear-gradient(
    135deg,
    hsl(127, 34%, 95%),
    hsl(49, 100%, 95%)
  ); */
  /* --smp--gradient--light-green: linear-gradient(135deg, rgba(255, 254, 217, 1), rgba(217, 255, 214, 1)); */
  --smp--gradient--light-blue: linear-gradient(
    135deg,
    hsl(207, 65%, 90%),
    hsl(358, 77%, 90%)
  );
  --smp--gradient--light-red: linear-gradient(135deg, #fff, hsl(27, 87%, 90%));

  --smp--gradient--light-blue-to-purple: linear-gradient(
    135deg,
    rgba(132, 186, 229) 0%,
    rgb(153, 151, 201) 100%
  );
  --smp--gradient--light-white-to-blue: linear-gradient(
    135deg,
    #fff,
    hsl(207, 65%, 90%)
  );

  --smp--gradient--bright-green-to-olive-green: linear-gradient(
    135deg,
    rgb(190, 223, 194) 0%,
    rgb(109, 187, 79) 50%
  );
  --smp--gradient--light-yellow-to-orange: linear-gradient(
    135deg,
    rgba(255, 230, 122, 1) 0%,
    rgba(240, 131, 44, 1) 100%
  );

  --smp--gradient--orange-to-vivid-red: linear-gradient(
    135deg,
    rgba(240, 131, 44, 1) 0%,
    rgb(207, 46, 46) 100%
  );
  --smp--gradient--silver-to-medium-gray: linear-gradient(
    135deg,
    rgb(203, 213, 220) 0%,
    rgb(167, 168, 170) 100%
  );
  --smp--gradient--cool-to-warm-spectrum: linear-gradient(
    135deg,
    rgb(132, 186, 229) 0%,
    rgb(153, 151, 201) 20%,
    rgb(207, 42, 186) 40%,
    rgb(238, 44, 130) 60%,
    rgb(240, 131, 44) 80%,
    rgb(255, 230, 122) 100%
  );
  --smp--gradient--pinkt-purple: linear-gradient(
    135deg,
    rgb(242, 156, 159) 0%,
    rgb(153, 151, 201) 100%
  );
  --smp--gradient--blush-bordeaux: linear-gradient(
    135deg,
    rgb(254, 205, 165) 0%,
    rgb(254, 45, 45) 50%,
    rgb(107, 0, 62) 100%
  );
  --smp--gradient--luminous-dusk: linear-gradient(
    135deg,
    rgb(255, 230, 122) 0%,
    rgb(153, 151, 201) 50%,
    rgb(132, 186, 229) 100%
  );
  --smp--gradient--pale-ocean: linear-gradient(
    135deg,
    rgb(255, 230, 122) 0%,
    rgb(190, 223, 194) 50%,
    rgb(132, 186, 229) 100%
  );
  --smp--gradient--electric-grass: linear-gradient(
    135deg,
    rgb(190, 223, 194) 0%,
    rgb(109, 187, 79) 100%
  );
  --wp--preset--gradient--midnight: linear-gradient(
    135deg,
    rgb(2, 3, 129) 0%,
    rgb(132, 186, 229) 100%
  );
}

/* 基本サイズ */
:root{
  --size1-half: calc(var(--size1) / 2);
  --size1: 5vw;
  --size2: calc(var(--size1) * 2);
  --size3: calc(var(--size1) * 3);
  --size4: calc(var(--size1) * 4);
}
/* 基本サイズ22*/
:root{
  --smp--font-size--h1: 60px;
  --smp--font-size--h2: 45px;
  --smp--font-size--h3: 32px;
  --smp--font-size--h4: 24px;
  --smp--font-size--h5: 20px;
  --smp--font-size--main-text: 16px;
  --smp--font-size--sub-text: 14px;
  --smp--font-size--annotation: 13px;
  --smp--font-size--annotation2: 12px;
  --smp--letter-spacing: 0.07em;
  --smp--line-height--headline: 1.4;
  --smp--line-height--main: 1.9;
  --smp--spacing--15: 15px;
  --smp--spacing--24: 24px;
  --smp--spacing--30: 30px;
  --smp--spacing--45: 45px;
  --smp--spacing--60: 60px;
  --smp--spacing--90: 90px;
  --smp--spacing--120: 120px;
  --smp--spacing--150: 150px;
  --smp--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);
  --smp--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);
  --smp--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);
  --smp--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1),
    6px 6px rgba(0, 0, 0, 1);
  --smp--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);
}


/* Clamp */
*,
*::before,
*::after {
  /* 最小サイズ、最大サイズ、最小画面幅、最大画面幅 */
  --max-size: 80;
  --min-size: 32;
  --max-viewport: 1920;
  --min-viewport: 375;

  /* a 傾き */
  --slope: calc(
    (var(--max-size) - var(--min-size)) /
      (var(--max-viewport) - var(--min-viewport))
  );
  /* b 切片 */
  --intercept: calc(var(--min-size) - var(--slope) * var(--min-viewport));
  /* y = ax + b 可変サイズ */
  --fluid-size: calc(var(--slope) * 100vw + var(--intercept) / 16 * 1rem);

  /* clamp(最小サイズ, 可変サイズ, 最大サイズ) */
  --clamp-size: clamp(
    var(--min-size) / 16 * 1rem,
    var(--fluid-size),
    var(--max-size) / 16 * 1rem
  );
}

/* フォントカラー */
.smp-color-smp-green{
  color: var(--smp--color--smp-green);
}
.smp-color-white{
  color: var(--smp--color--white);
}
.smp-color-site-white{
  color: var(--smp--color--site-white);
}
.smp-color-light-yellow{
  color: var(--smp--color--light-yellow);
}
.smp-color-orange{
  color: var(--smp--color--orange);
}

.smp-glid-place-items-center{
  display: grid;
  place-items: center;
}
.smp-glid-align-items-center{
  display: grid;
  align-items: center;
}


a {
  color: #333;
}

a:hover {
  text-decoration: none;
}

/* headerを一時的に隠す */
._smp-brand .smp-hidden {
  display: none;
}

/* KVエリア */

/* ローディングアイコン */
#loader-bg {
  background: radial-gradient(
    circle,
    rgb(251, 251, 210) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  /* background: #fff; */
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 10;
}
#loader-bg img {	
  /* background: #fff; */
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 10;
}



#content {
  /* 表示したいコンテンツの要素は初期状態では非表示にする */
  visibility: hidden;
  opacity: 0;
}
.smp-b-lyt-kv-brand {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100vh;
  background: url(/profile/brand/assets/img/img-kv-brand02.webp) no-repeat
    center;
  background-size: cover;
  position: relative;
}

@media screen and (max-width: 768px) {
  .smp-b-lyt-kv-brand {
    display: grid;
    margin: 0 auto;
    width: 100%;
    background: url(/profile/brand/assets/img/img-kv-brand02-sp.webp) no-repeat
      center;
    background-size: auto 100%;
  }
}

.smp-c-hdg-kv {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #fff;
  background: radial-gradient(
    circle,
    /* rgba(2, 0, 36, 1) 0%, */
    rgb(251, 251, 210) 0%,
    /* hsl(127, 34%, 81%), */
    /* rgb(0, 122, 76), */
    rgba(255, 255, 255, 1) 100%
  );
  z-index: 2;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.smp-vision01 {
  padding: 0 24px;
  --min-size: 32;
  --max-size: 80;
  font-size: var(--clamp-size);
  line-height: var(--smp--line-height--headline);
  letter-spacing: var(--smp--letter-spacing);
  font-weight: 700;
  color: #2c3b3a;;
}
@media screen and (max-width: 768px) {
  .smp-vision01 {
    --min-size: 39;
    --max-size: 60.8;
  }
}

.smp-vision02 {
  display: flex;
  flex-wrap: wrap;
  padding: 24px;
  height: 100px;
  --min-size: 16;
  --max-size: 64;
  font-size: var(--clamp-size);
  line-height: var(--smp--line-height--headline);
  letter-spacing: var(--smp--letter-spacing);
  font-weight: 700;
  color: #2c3b3a;;
}

@media screen and (max-width: 768px) {
  .smp-vision02 {
    --min-size: 30;
    --max-size: 60.8;
  }
}

.smp-vision02 span {
  display: block;
}
/* KV ここまで */


/* scrolldown ここから */

/*スクロールダウン全体の場所*/
.smp-scrolldown {
  /*描画位置※位置は適宜調整してください*/
  position: absolute;
  left: 50%;
  bottom: 100px;

  /*全体の高さ*/
  height: 50px;
  z-index: 3;
}

/*Scrollテキストの描写*/
.smp-scrolldown span {
  /*描画位置*/
  position: absolute;
  left: -15px;
  top: -15px;
  /*テキストの形状*/
  color: #000;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
}

/* 線の描写 */
.smp-scrolldown::after {
  content: "";
  /*描画位置*/
  position: absolute;
  top: 0;
  /*線の形状*/
  width: 1px;
  height: 30px;
  background: #000;
  /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity: 0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove {
  0% {
    height: 0;
    top: 0;
    opacity: 0;
  }
  30% {
    height: 30px;
    opacity: 1;
  }
  100% {
    height: 0;
    top: 50px;
    opacity: 0;
  }
}
/* scrolldown ここまで */

/* フォント */

.smp-brand-font{
  --min-size: 24;
  --max-size: 45;
  font-size: var(--clamp-size);
  font-weight: bold;
  color: #2c3b3a;;
}
@media screen and (max-width: 768px) {
  .smp-brand-font{
    --min-size: 24;
    --max-size: 45;
  }
}
.smp-brand-font-dt{
  --min-size: 12;
  --max-size: 36;
  font-size: var(--clamp-size);
  font-weight: bold;
  color: #2c3b3a;;
}
@media screen and (max-width: 768px) {
  .smp-brand-font-dt{
    --min-size: 24;
    --max-size: 45;
  }
}
.smp-brand-font-white{
  --min-size: 24;
  --max-size: 45;
  font-size: var(--clamp-size);
  font-weight: bold;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .smp-brand-font{
    --min-size: 24;
    --max0size: 45;
  }
}
.smp-brand-font-small{
  --min-size: 24;
  --max-size: 32;
  font-size: var(--clamp-size);
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .smp-brand-font-small{
    --min-size: 20;
    --max-size: 32;
  }
}
.smp-brand-font-p{
  --min-size: 16;
  --max-size: 20;
  font-size: var(--clamp-size);
}
.smp-brand-font-annotation{
  --min-size: 12;
  --max-size: 16;
  font-size: var(--clamp-size);
}


/* レイアウト */

.smp-is-sp {
  display: none;
}
@media screen and (max-width: 768px) {
  .smp-is-pc {
    display: none;
  }
}


@media screen and (min-width: 1920px){
  .smp-column-width{
    max-width: 1920px;
    margin: 0 auto;
    padding-left: 90px;
    padding-right: 90px;
  }
}
@media screen and (max-width: 768px){
  .smp-column-width{
    width: 95%;
    margin: 0 auto;
  }
}

.smp-u-plr-5 {
  padding: 0 3vw !important;
}
@media screen and (max-width: 768px) {
  .smp-u-plr-3 {
    padding: 0 3vw !important;
  }
}

/* ボタンサイズ */

.c-btn-02{
  --min-size: 16;
  --max-size: 24;
 font-size: var(--clamp-size);
}

/* 両横マージン */
._smp-brand .c-lyt-column-01 {
  margin-inline: var(--smp--spacing--24);
}
@media screen and (max-width: 768px) {
  ._smp-brand .c-lyt-column-01 {
    margin-inline: 1.45%;
  }
}

/* box-shadow */

.smp-box-shadow{
  /* box-shadow: 2px 5px 18px -5px #d1d1d1; */
  /* border-color: #fff; */
  border: solid 1px #dfdfdf;
  border-radius: 20px;
}

.m-panel-nav-01.smp-border-radius li{
  border-radius: 20px 20px 0px 0px;
}

/* philosopyカラム */
.smp-column {
  display: flex;
  flex-direction: column;
  background: var(--smp--color--site-white);
  border-radius: 20px;
  align-items: center;
  justify-content: center;
  /* padding-block: 7em; */
  padding-block-start: 7em;
  padding-block-end: 5em;
  padding-inline: 2em;
  position: relative;
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .smp-column {
    padding: 90px 9px 60px 9px;
  }
}


._smp-brand h2 {
  margin-top: 30px;
  margin-bottom: 90px;
}
@media screen and (max-width: 768px) {
  ._smp-brand h2 {
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 9px;
  }
}

/* 行動宣言 */
.c-list-definition-01 dd, .c-list-definition-01 dt {
  padding-left: 1.25em;
  padding-bottom: 0.5em;
}
@media screen and (max-width: 768px) {
  .c-list-definition-01 dd, .c-list-definition-01 dt {
    padding-left: 1.25em;
    padding-bottom: 0.75em;
  }
}
.smp-num {
  position: absolute;
  top: 0;
  left: 0px;
  padding-right: 5em;
  font-size: inherit;
}
@media screen and (max-width: 768px) {
.smp-num {
    padding-right: 3em;
    font-size: inherit;
    font-weight: bold;
    padding-bottom: 1em;
  }
  .c-list-ordered-01 > li > strong {
    font-size: var(--smp--font-size--h4);
  }
}

/* 背景色 */
.l-content-03.smp-green {
  background-color: rgba(255, 255, 255, 0);
  border-radius: 0px 0px 0 0;
  box-shadow: none;
  position: relative;
  width: 100%;
}
@media screen and (max-width: 768px){
  .l-content-03.smp-green {
    padding-left: 0px;
    padding-right: 5px;
  }
}
.l-content-03.smp-blue {
  /* background-color: hsl(207, 65%, 98%); */
  border-radius: 0px 0px 0 0;
  position: relative;
  width: 100%;
  /* box-shadow: none; */
}
@media screen and (max-width: 768px){
  .l-content-03.smp-blue {
    padding-left: 0px;
    padding-right: 5px;
  }
}
.l-content-03.smp-red {

  /* background-color: hsl(27, 87%, 98%); */
  border-radius: 0px 0px 0 0;
  position: relative;
  width: 100%;

}
@media screen and (max-width: 768px){
  .l-content-03.smp-red {
    padding-left: 0px;
    padding-right: 5px;
  }
}
.l-content-03.smp-vision {

  background-color: hsl(127, 34%, 96%);
  border-radius: 0px 0px 0 0;
  box-shadow: none;
  position: relative;
  width: 100%;

}
@media screen and (max-width: 768px){
  .l-content-03.smp-vision {
    padding-left: 0px;
    padding-right: 5px;
  }
}
.l-content-03.smp-other {
  background-color: var(--smp--color--site-white);

  border-radius: 0px 0px 0 0;
  box-shadow: none;
  position: relative;
  width: 100%;
  padding-left: 0px;
  padding-right: 5px;
}

@media screen and (max-width: 768px) {
  .l-content-03.smp-green2 {
    padding: 0px;
    background-color: #fff;
  }
  /* .l-content-03.smp-red {
    padding: 0px;
  }
  .l-content-03.smp-blue {
    padding: 0px;
  }
  .l-content-03.smp-vision {
    padding: 0px;
  }
  .l-content-03.smp-other {
    padding: 0px;
  } */
}

/* ボックスデザイン*/

.smp-h4-gb {
  display: grid;
  place-items: center;
  background-color: none;
  color: var(--smp--color--white);
  mix-blend-mode: screen;
  height: 60px;
  width: 100%;
  border-radius: 50%;
  position: relative;
}

.smp-h4-gb::after {
  position: absolute;
  content: "";
  background: var(--smp--color--smp-green);
  width: 12vw;
  height: 12vh;
  border-radius: 50%;
  top: 20%;
  left: -10%;
  mix-blend-mode: overlay;
}


.c-lyt-column-01.smp-spacing-60 {
  margin-bottom: var(--smp--spacing--60);
}
.c-hdg-level2-01.smp-spacing-60 {
  margin-bottom: var(--smp--spacing--60);
}



.c-lyt-media-01 .smp-image{
width: 93%;
margin: 0 auto;
}

@media screen and (max-width: 768px) {
  ._smp-brand .column {
    margin: 0 auto;
    width: 100%;
    padding: 30px 0px;
  }
}


/* narrative */
.smp-narrative {
  width: 97.1%;
  margin: 0 auto;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 20px;
  box-shadow: 2px 5px 18px -5px #d1d1d1;
}

/* @media screen and (max-width: 768px) {
  .smp-narrative{
    width: 92%;
  }
} */


.c-box-content-02.smp-brand-column{
  padding: 3vw 5vw;
  margin-bottom: 60px;
  border: none;
  color: var(--smp--color--white);
}

.box-title-01.title{
  --min-size: 16;
  --max-size: 64;
  font-size: var(--clamp-size);
}


@media screen and (max-width: 768px) {
  .box-title-01.title{
    --min-size: 32;
  }
  .smp-brand-p {
    --min-size: 24;
  }
}
/* narrativeここまで */

/* philosphy */


.column.philosophy {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.side-navi h2{
  margin-left: 20%;
  writing-mode: vertical-rl;
  transform: rotate(-180deg);
  font-size: calc(70px + 70 * (100vh - 500px) / 1000);
  font-weight: bold;
  font-family: Montserrat, sans-serif;
  color: var(--smp--color--smp-green);
  line-height: 1em;
}


.smp-annotation{
  position: absolute;
  top:6em;
  left: 1em;
}

.mission.smp-column::after {
  position: absolute;
  content: "理念";
  top: 0%;
  left: 0%;
  padding-left: 12%;
  padding-right: 12%;
  /* mix-blend-mode:darken; */
  color: var(--smp--color--white);
  --min-size: 24;
  --max-size: 48;
  font-size: var(--clamp-size);
  font-weight: bold;
  z-index: 1;
  background-color: var(--smp--color--smp-green);
  border-radius: 20px 0 20px 0px;
}
@media screen and (max-width: 768px) {
  .mission.smp-column::after {
    font-size: 1.5em;
  }
}
.value.smp-column::after {
  position: absolute;
  content: "バリュー";
  top: 0%;
  left: 0%;
  padding-left: 12%;
  padding-right: 12%;
  /* mix-blend-mode:darken; */
  color: var(--smp--color--white);
  --min-size: 24;
  --max-size: 48;
  font-size: var(--clamp-size);
  font-weight: bold;
  z-index: 1;
  background-color: var(--smp--color--smp-green);
  border-radius: 20px 0 20px 0px;
}
@media screen and (max-width: 768px) {
  .value.smp-column::after {
    font-size: 1.5em;
  }
}

.declaration-of-conduct.smp-column::after {
  position: absolute;
  content: "行動宣言";
  top: 0%;
  left: 0%;
  padding-left: 12%;
  padding-right: 12%;
  /* mix-blend-mode:darken; */
  color: var(--smp--color--white);
  --min-size: 24;
  --max-size: 48;
  font-size: var(--clamp-size);
  font-weight: bold;
  z-index: 1;
  background-color: var(--smp--color--smp-green);
  border-radius: 20px 0 20px 0px;
}
@media screen and (max-width: 768px) {
  .declaration-of-conduct.smp-column::after {
    font-size: 1.5em;
  }
}

.slogan.smp-column::after {
  position: absolute;
  content: "スローガン";
  top: 0%;
  left: 0%;
  padding-left: 20%;
  padding-right: 20%;
  /* mix-blend-mode:darken; */
  color: var(--smp--color--white);
  --min-size: 24;
  --max-size: 48;
  font-size: var(--clamp-size);
  font-weight: bold;
  z-index: 1;
  background-color: var(--smp--color--smp-green);
  border-radius: 20px 0 20px 0px;
}
@media screen and (max-width: 768px) {
  .slogan.smp-column::after {
    font-size: 1.5em;
  }
}
.c-lyt-media-01.slogan {
  margin:0 auto;
  padding-top: 30px;
}

@media screen and (max-width: 768px) {
  .smp-column::after {
    font-size: 1em;
  }
}

.c-list-definition-01 {
  padding-inline-start: 2%;
  padding-inline-end: 2%;
}



/* navi-sp */


@media screen and (max-width: 768px) {
  .smp-is-sp.philosophy {
    display: flex;
    flex-direction: row;
    /* background-color: var(--smp--color--white); */
    color: var(--smp--color--smp-green);
    justify-content: space-around;
    margin-bottom: 30px;
    padding-block: 2%;
  }
  .header {
    font-weight: bold;
    background-color: var(--smp--color--smp-green);
    color: var(--smp--color--white);
    display: flex;
    justify-content: center;
    padding: 0;
    border-radius: 20px 20px 20px 20px;
  }
}
@media screen and (max-width: 768px) {
  .smp-is-pc .indexWrapper {
    display: none;
  }
}

/* strengths */

@media screen and (max-width: 768px) {
  .smp-is-sp.strengths {
    display: flex;
    flex-direction: row;
    background-color: var(--smp--color--white);
    color: var(--smp--color--smp-green);
    justify-content: space-around;
    padding-block: 2%;
  }
}
@media screen and (max-width: 768px) {
  .smp-is-pc .indexWrapper {
    display: none;
  }
}


/* Strengths bg-images */

.c-img-wrap-01._brand .text {
  font-size: 1.5em;
  color: #ffffff;
}

.l-inner-01 {
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

@media screen and (min-width: 769px) {
  .l-inner-01._brand {
    width: 100%;
  }
}
@media screen and (min-width: 1920px) {
  .l-inner-01._brand {
    width: initial;
  }
}

#smp-01.c-img-wrap-01:before {
  background-image: url(/profile/brand/assets/img/strengths_bg01.webp);
}
#smp-02.c-img-wrap-01:before {
  background-image: url(/profile/brand/assets/img/strengths_bg02.webp);
}
#smp-03.c-img-wrap-01:before {
  background-image: url(/profile/brand/assets/img/img-world_map.webp);
}

@media screen and (max-width: 768px) {
  #smp-01.c-img-wrap-01:before {
    background-image: url(/profile/brand/assets/img/strengths_bg01_sp.webp);
    background-repeat: no-repeat;
  }
  #smp-02.c-img-wrap-01:before {
    background-image: url(/profile/brand/assets/img/strengths_bg02_sp.webp);
    background-repeat: no-repeat;
  }
  #smp-03.c-img-wrap-01:before {
    background-image: url(/profile/brand/assets/img/strengths_bg03_sp.webp);
    background-repeat: no-repeat;
  }
}

@media screen and (min-width: 1920px) {
  .c-img-wrap-01._brand {
    width: 55vw;
    min-height: 580px;
  }
}

.smp-reagion-strategies{
  background-color: hsl(127, 34%, 90%);
  margin-top: 10px;
}

.smp-reagion-strategies-inner{
  padding: 15px 45px 5px;
}

.smp-reagion-strategies-list{
  display: flex;
  align-items: baseline;
  column-gap: 20px;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
    ._smp-brand .smp-reagion-strategies .column {
        margin: 0 auto;
        width: 100%;
        padding: 5px 0px;
    }
}

@media screen and (min-width: 769px) {
 .smp-reagion-strategies .c-lyt-column-01.col2 .column {
        width: 48.58569051580699%;
    }
}
@media screen and (min-width: 769px) {
 .smp-reagion-strategies .c-lyt-column-01.col2 .column+.column {
        width: 48.58569051580699%;
    }
}

/* vision */

.smp-bg-vision{
  background-color: var(--smp--color--site-white);
}
