@charset "UTF-8";


/*****************************
setting
******************************/
.c-breadcrumb > ol{
  max-width: calc(1360px + 4rem);
}
/*****************************
setting
******************************/
#aboutContents{
  --setsize: ((100vw - (100vw - 100cqw)) / 1400);
  width: 100%;
  padding-bottom: calc(70 * var(--setsize));
  overflow: hidden;
}

#aboutContents picture,
#aboutContents figure{
  display: block;
  width: 100%;
  height: auto;
}

/**************************************
secTTL
**************************************/
#aboutContents .secTTL{
  display: block;
  font-weight: 500;
  font-size: calc(32 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-align: center;
}

#aboutContents .secTTL > span{
  display: block;
  font-size: calc(12 * var(--setsize));
  font-weight: 700;
  color: #FD873E;
  letter-spacing: 0.2em;
  line-height: 2;
}

#aboutContents .secTTL > span:not(:nth-last-child(1)){
  margin-bottom: calc(16 * var(--setsize));
}


/**************************************
fadeInBlock
**************************************/
#aboutContents .fadeInBlock{
  opacity: 0;
  transform: translateY(calc(100 * var(--setsize)));
  transition: transform .6s ease, opacity .6s ease;
}
#aboutContents .fadeInBlock.view{
  opacity: 1;
  transform: translateY(0);
}



/**************************************
mainVisual
**************************************/
#aboutContents .mvBlock{
	display: block;
  width: 100%;
  min-height: calc(100 * var(--setsize));
  position: relative;
}
#aboutContents .mvBlock::after{
  content: '';
  display: block;
  width: 100%;
  height: calc(100 * var(--setsize));
  background: url("../Contents/ThemeImage/about/mv_over.svg") center bottom no-repeat;
  background-size: auto 100%;
  position: absolute;
  left: 0;
  bottom: -1px;
  z-index: 2;
}

#aboutContents .mvBlock .mainTTL{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-bottom: calc(30 * var(--setsize));
  font-size: calc(36 * var(--setsize));
  font-weight: 600;
  letter-spacing: 0.2em;
  line-height: 1.11111111111;
  color: #FFFFFF;
  background: rgba(108,90,72,.2);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}

#aboutContents .mvBlock .mainTTL > span{
  display: block;
  margin-bottom: calc(20 * var(--setsize));
  font-size: calc(14 * var(--setsize));
  color: #FD873E;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1;
}


#aboutContents .mvBlock .bg{
  display: block;
  width: 100%;
}

#aboutContents .mvBlock .deco{
  display: block;
  width: calc(413.38 * var(--setsize));
  position: absolute;
  right: calc(47.2 * var(--setsize));
  top: calc(323.5 * var(--setsize));
  z-index: 3;
}



/**************************************
mainVisual
**************************************/
#aboutContents .firstLede{
  padding-top: calc(69 * var(--setsize));
  padding-bottom: calc(133 * var(--setsize));
  position: relative;
}

#aboutContents .firstLede > p{
  font-size: calc(16 * var(--setsize));
  text-align: center;
  letter-spacing: 0.12em;
  line-height: 2.8;
  font-weight: 500;
}


#aboutContents .firstLede .deco{
  display: block;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

#aboutContents .firstLede .deco > picture{
  display: block;
  width: 100%;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1s ease .4s;
}
#aboutContents .firstLede.view .deco > picture{
  clip-path: inset(0);
}

/**************************************
contentsNav
**************************************/
#aboutContents .contentsNav{
  display: block;
  width: calc(1200 * var(--setsize));
  margin: 0 auto calc(53 * var(--setsize));
}

#aboutContents .contentsNav > ul{
  display: flex;
  justify-content: center;
  align-items: stretch;
  height: calc(150 * var(--setsize));
  position: relative;
}

#aboutContents .contentsNav > ul::before{
  content: '';
  display: block;
  width: 2px;
  height: calc(80 * var(--setsize));
  background: #EBE5E2;
  position: absolute;
  left: 0;
  top: calc(24 * var(--setsize));
}

#aboutContents .contentsNav > ul > li{
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 calc(9.4 * var(--setsize));
  position: relative;
}
#aboutContents .contentsNav > ul > li::after{
  content: '';
  display: block;
  width: 2px;
  height: calc(80 * var(--setsize));
  background: #EBE5E2;
  position: absolute;
  right: 0;
  top: calc(24 * var(--setsize));
}

#aboutContents .contentsNav > ul > li > a{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  text-decoration: none;
}
#aboutContents .contentsNav > ul > li > a::after{
  content: '';
  display: block;
  width: calc(13 * var(--setsize));
  height: calc(8 * var(--setsize));
  margin: calc(15 * var(--setsize)) auto 0;
  background: url("../Contents/ThemeImage/about/icon_anchor.svg") center center no-repeat;
  background-size: 100% auto;
}

#aboutContents .contentsNav > ul > li > a > span:nth-of-type(1){
  display: block;
  margin-bottom: calc(7 * var(--setsize));
  font-size: calc(11 * var(--setsize));
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.2em;
  line-height: 2.363636363636364;
  color: #FD873E;
}

#aboutContents .contentsNav > ul > li > a > span:nth-of-type(2){
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(47 * var(--setsize));
  font-size: calc(17 * var(--setsize));
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.15em;
  line-height: 1.411764705882353;
  color: #454140;
}

#aboutContents .contentsNav > ul > li > a > span:nth-of-type(2) > em{
  display: block;
  font-style: normal;
  font-size: calc(15 * var(--setsize));
  line-height: 1.6;
}

/**************************************
contentsNav
**************************************/
#aboutContents #about{
  display: block;
  width: 100%;
  padding: calc(100 * var(--setsize)) 0 calc(140 * var(--setsize));
  background: #FFFFFF;
}

#aboutContents #about .secTTL{
  margin-bottom: calc(80 * var(--setsize));
}


#aboutContents #about > .lede{
  display: block;
  width: calc(900 * var(--setsize));
  margin: 0 auto calc(60 * var(--setsize));
}

#aboutContents #about > .lede > p.catch{
  display: block;
  margin-bottom: calc(30 * var(--setsize));
  font-size: calc(24 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1.5;
  font-weight: 600;
  text-align: left;
}

#aboutContents #about > .lede > p:not(.catch){
  display: block;
  font-size: calc(16 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.8;
  text-align: left;
}

#aboutContents #about > .lede > p:not(.catch) + p:not(.catch){
  margin-top:  calc(30 * var(--setsize));
}


#aboutContents #about > .massage{
  display: block;
  width: calc(900 * var(--setsize));
  margin: 0 auto calc(80 * var(--setsize));
  padding: calc(34 * var(--setsize)) calc(60 * var(--setsize)) calc(50 * var(--setsize));
  
  border-radius: 40px;
  background: #FDF9F2;
  position: relative;
}

#aboutContents #about > .massage::before{
  content: '';
  display: block;
  width: calc(70 * var(--setsize));
  height: calc(4 * var(--setsize));
  background: #FD873E;
  position: absolute;
  top: 0;
  left: calc(50% - 35 * var(--setsize));
  z-index: 1;
}

#aboutContents #about > .massage > .ttl{
  display: block;
  margin-bottom: calc(20 * var(--setsize));
  font-size: calc(22 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1.818181818181818;
  font-weight: 500;
  text-align: center;
}

#aboutContents #about > .massage > .inner{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
}

#aboutContents #about > .massage > .inner > .text{
  display: block;
  width: calc(100% - 240 * var(--setsize));
}

#aboutContents #about > .massage > .inner > .text > p{
  display: block;
  font-size: calc(14 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 2;
  text-align: left;
}
#aboutContents #about > .massage > .inner > .text > p.name{
  display: block;
  margin-top: calc(25 * var(--setsize));
  font-size: calc(15 * var(--setsize));
  font-weight: 600;
  text-align: right;
}


#aboutContents #about > .massage > .inner > figure{
  display: block;
  width: calc(180 * var(--setsize));
  border-radius: calc(500 * var(--setsize)) calc(500 * var(--setsize)) 0 0;
  overflow: hidden;
}

#aboutContents #about > .map{
  display: block;
  width: calc(900 * var(--setsize));
  margin: 0 auto calc(62 * var(--setsize));
}


#aboutContents #about > .map > .caution{
  margin-top: calc(15 * var(--setsize));
  text-align: right;
  font-size: calc(12 * var(--setsize));
}


/*historySection **********************/
#aboutContents #about .historySection{
  display: block;
  width: calc(100% - 100 * var(--setsize));
  margin: 0 0 0 auto;
  background: #FDF9F2;
  border-radius: 40px 0 0 40px;
  padding-top: calc(44 * var(--setsize));
  padding-bottom: calc(60 * var(--setsize));
  position: relative;
}

#aboutContents #about .historySection::before{
  content: '';
  display: block;
  width: calc(70 * var(--setsize));
  height: calc(4 * var(--setsize));
  background: #FD873E;
  position: absolute;
  top: 0;
  left: calc(50% - 35 * var(--setsize) - 50 * var(--setsize));
  z-index: 1;
}

#aboutContents #about .historySection > .ttl{
  display: block;
  margin: 0 auto calc(50 * var(--setsize));
  padding-right: calc(100 * var(--setsize));
  font-size: calc(22 * var(--setsize));
  font-weight: 500;
  letter-spacing: 0.2em;
  line-height: 1.818181818181818;
  text-align: center;
}
    

/*historySlider **********************/
#historySlider{
  display: block;
  width: 100%;
  padding-bottom: calc(36 * var(--setsize));
  position: relative;
}

#historySlider > .historySlider{
  width: 100%;
  padding-left: calc(100 * var(--setsize));
  padding-right: calc(140 * var(--setsize));
  overflow: hidden;
}

#historySlider > .historySlider .sliderWrapper{
  align-items: stretch;
}

#historySlider > .historySlider .slider{
  width: auto;
  height: auto;
}
#historySlider > .historySlider .slider:not(:nth-last-child(1)){
  margin-right: calc(20 * var(--setsize));
}

#historySlider > .historySlider .slider > dl{
  display: block;
  height: 100%;
  min-height: calc(276 * var(--setsize));
  padding-right: calc(40 * var(--setsize));
  position: relative;
}

#historySlider > .historySlider .slider:not(:nth-last-child(1)) > dl::after{
  content: '';
  display: block;
  width: calc(100% - 142 * var(--setsize) - 20 * var(--setsize));
  height: 1px;
  background-image: linear-gradient(to right, #FD873E 2px, transparent 4px);
  background-repeat: repeat-x;
  background-position: left bottom;
  background-size: 6px 1px;
  position: absolute;
  right: 0;
  top: calc(58 * var(--setsize));
  z-index: 2;
}

#historySlider > .historySlider .slider > dl > dt{
  display: block;
  height: calc(88 * var(--setsize));
  margin-bottom: calc(15 * var(--setsize));
  font-size: calc(60 * var(--setsize));
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1;
  color: #FD873E;
  text-align: left;
}

#historySlider > .historySlider .slider > dl > dt > span{
  display: block;
  font-size: calc(11 * var(--setsize));
  line-height: 2.363636363636364;
  font-weight: 700;
}

#historySlider > .historySlider .slider > dl > dd{
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  height: calc(100% - 103 * var(--setsize));
  padding: calc(20 * var(--setsize)) 0 calc(20 * var(--setsize));
  background: #FFFFFF;
  border-radius: 10px;
}


#historySlider > .historySlider .slider > dl > dd > dl{
  display: block;
  width: calc(240 * var(--setsize));
  padding: 0 calc(20 * var(--setsize));
  position: relative;
}

#historySlider > .historySlider .slider > dl > dd > dl:not(:nth-last-of-type(1))::after{
  content: '';
  display: block;
  width: 1px;
  height: 100%;
  background: #EBE5E2;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}


#historySlider > .historySlider .slider > dl > dd > dl > dt{
  display: block;
  margin-bottom: calc(10 * var(--setsize));
  font-size: calc(15 * var(--setsize));
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #FD873E;
}
#historySlider > .historySlider .slider > dl > dd > dl > dt > span{
  font-size: calc(24 * var(--setsize));
  line-height: 1.125;
}

#historySlider > .historySlider .slider > dl > dd > dl > dd{
  display: block;
  font-size: calc(13 * var(--setsize));
  line-height: 1.5;
  text-align: left;
  letter-spacing: 0.08em;
  font-weight: 500;
}
#historySlider > .historySlider .slider > dl > dd > dl > dd + dd{
  margin-top: calc(15 * var(--setsize));
}

#historySlider > .swiper-scrollbar{
  display: block;
  width: calc(1000 * var(--setsize));
  height: calc(4 * var(--setsize));
  background: #EBE5E2;
  border-radius: calc(2 * var(--setsize));
  position: absolute;
  bottom: 0;
  left: calc(100 * var(--setsize));
}

#historySlider > .swiper-scrollbar .swiper-scrollbar-drag {
  background: #F5B489;
  border-radius: calc(2 * var(--setsize));
}



/**************************************
contentsNav
**************************************/
#aboutContents #numbers{
  display: block;
  width: 100%;
  padding: calc(100 * var(--setsize)) 0 calc(120 * var(--setsize));
}

#aboutContents #numbers .secTTL{
  margin-bottom: calc(60 * var(--setsize));
}


#aboutContents #numbers .innerSection{
  display: block;
  width: calc(920 * var(--setsize));
  margin: 0 auto;
}

#aboutContents #numbers .innerSection + .innerSection{
  margin-top: calc(82 * var(--setsize));
}

#aboutContents #numbers .innerSection > .ttl{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 calc(20 * var(--setsize));
  width: 100%;
  margin-bottom: calc(70 * var(--setsize));
  font-size: calc(25 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1;
  font-weight: 600;
  color: #FD873E;
  white-space: nowrap;
}

#aboutContents #numbers .innerSection > .ttl::before,
#aboutContents #numbers .innerSection > .ttl::after{
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  background-image: radial-gradient(circle farthest-side, #FD873E, #FD873E 50%, transparent 50%, transparent);
  background-repeat: repeat-x;
  background-position: left bottom;
  background-size: 6px 4px;
}


#aboutContents #numbers .numCard{
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
}

#aboutContents #numbers .numCard > dl,
#aboutContents #numbers .numCard > .nutrition{
  display: block;
  width: calc(50% - 20 * var(--setsize));
  background: #FFFFFF;
  border-radius: 30px;
  padding: calc(50 * var(--setsize)) calc(40 * var(--setsize)) calc(50 * var(--setsize));
  position: relative;
}

#aboutContents #numbers .numCard > dl.bg01{
  background-image: url("../Contents/ThemeImage/about/bg_colortry.svg");
  background-position: calc(100% - 40 * var(--setsize)) calc(100% - 30 * var(--setsize));
  background-size: calc(70.19 * var(--setsize));
  background-repeat: no-repeat;
}

#aboutContents #numbers .numCard > dl.bg02{
  background-image: url("../Contents/ThemeImage/about/bg_japan.svg");
  background-position: center calc(56 * var(--setsize));
  background-size: calc(300 * var(--setsize));
  background-repeat: no-repeat;
  
  margin-bottom: calc(40 * var(--setsize));
}

#aboutContents #numbers .numCard > dl.bg02 dd.outCaution{
  padding: 0 calc(10 * var(--setsize));
  font-size: calc(10 * var(--setsize));
  position: absolute;
  left: 0;
  bottom: calc(-10 * var(--setsize));
  transform: translateY(100%);
}


#aboutContents #numbers .numCard > dl.bg03{
  background-image: url("../Contents/ThemeImage/about/bg_gohan.svg");
  background-position: calc(100% - 40 * var(--setsize)) calc(100% - 30 * var(--setsize));
  background-size: calc(170 * var(--setsize));
  background-repeat: no-repeat;
}
#aboutContents #numbers .numCard > dl.bg04{
  background-image: url("../Contents/ThemeImage/about/bg_weight.svg");
  background-position: calc(100% - 34 * var(--setsize)) calc(100% - 33 * var(--setsize));
  background-size: calc(110 * var(--setsize));
  background-repeat: no-repeat;
}
#aboutContents #numbers .numCard > dl.bg05{
  background-image: url("../Contents/ThemeImage/about/bg_fire.svg");
  background-position: calc(100% - 30 * var(--setsize)) calc(100% - 33 * var(--setsize));
  background-size: calc(90 * var(--setsize));
  background-repeat: no-repeat;
}


#aboutContents #numbers .numCard > dl > dt{
  display: block;
  position: absolute;
  top: calc(-57 * var(--setsize));
  left: 50%;
  transform: translateX(-50%);
}

#aboutContents #numbers .numCard > dl.nutrition{margin-top: calc(-37 * var(--setsize));}
#aboutContents #numbers .numCard > dl.nutrition > dt{display: none;}

#aboutContents #numbers .numCard > dl > dt > span{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 calc(10 * var(--setsize));
  margin-bottom: calc(5 * var(--setsize));
  font-size: calc(18 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1;
  font-weight: 500;
}
#aboutContents #numbers .numCard > dl > dt > span::before{
  content: '';
  display: block;
  width: calc(40 * var(--setsize));
  height: calc(40 * var(--setsize));
}

#aboutContents #numbers .numCard > dl.customer > dt > span::before{
  background: url("../Contents/ThemeImage/about/icon_ouchi.svg") center center no-repeat;
  background-size: 100% auto;
}

#aboutContents #numbers .numCard > dl.business > dt > span::before{
  background: url("../Contents/ThemeImage/about/icon_kaigo.svg") center center no-repeat;
  background-size: 100% auto;
}

#aboutContents #numbers .numCard > dl > dt > em{
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(180 * var(--setsize));
  height: calc(30 * var(--setsize));
  border-radius: calc(15 * var(--setsize));
  background: #FD6A3E;
  font-style: normal;
  font-size: calc(13 * var(--setsize));
  font-weight: 500;
  letter-spacing: 0.2em;
  line-height: 1;
  color: #FFFFFF;
  text-align: center;
}
#aboutContents #numbers .numCard > dl.business > dt > em{
  background: #113D79;
}


/*中身　************/
#aboutContents #numbers .numCard > dl > dd.num{
  display: block;
}

#aboutContents #numbers .numCard > dl > dd.num > dl{
  display: block;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dt{
  display: block;
  margin-bottom: calc(30 * var(--setsize));
  font-size: calc(20 * var(--setsize));
  font-weight: 500;
  letter-spacing: 0.2em;
  line-height: 1;
  text-align: center;
}
#aboutContents #numbers .numCard > dl > dd.num > dl > dt > span{
  display: block;
  margin-top: calc(10 * var(--setsize));
  font-size: calc(15 * var(--setsize));
  color: #A29791;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd{
  font-size: calc(20 * var(--setsize));
  letter-spacing: 0.2em;
  font-weight: 500;
  text-align: center;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd > strong{
  display: inline-block;
  margin-left: calc(10 * var(--setsize));
  margin-right: calc(10 * var(--setsize));
  font-size: calc(60 * var(--setsize));
  font-weight: 600;
  color: #FD873E;
  position: relative;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd > strong > span{
  font-size: calc(28 * var(--setsize));
  font-weight: 700;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd > strong > span.upper{
  font-size: calc(14 * var(--setsize));
  font-weight: 500;
  color: #A29791;
  position: absolute;
  left: 0;
  top: calc(-20 * var(--setsize));
}


#aboutContents #numbers .numCard > dl > dd.num > dl + dl{
  padding-top: calc(30 * var(--setsize));
  margin-top: calc(25 * var(--setsize));
  border-top: 2px solid #EBE5E2;
}

#aboutContents #numbers .numCard > dl > dd.caution{
  display: block;
  margin-top: calc(30 * var(--setsize));
  font-size: calc(12 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.625;
  text-align: center;
}

#aboutContents #numbers .numCard > dl > dd.caution ul.cirlceList{
  display: inline-flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: calc(5 * var(--setsize)) 0;
}
#aboutContents #numbers .numCard > dl > dd.caution ul.cirlceList > li{
  padding-left: calc(16 * var(--setsize));
  text-align: left;
  font-size: calc(14 * var(--setsize));
  position: relative;
}
#aboutContents #numbers .numCard > dl > dd.caution ul.cirlceList > li::before{
  content: '';
  display: block;
  width: calc(6 * var(--setsize));
  height: calc(6 * var(--setsize));
  border-radius: 50%;
  background: #FD873E;
  position: absolute;
  left: 0;
  top: calc(9 * var(--setsize));
}


#aboutContents #numbers .numCard > dl > dd.cautionSmall{
  display: block;
  margin-top: calc(16 * var(--setsize));
  font-size: calc(12 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.5;
  text-align: left;
}


/**　枠単位調整　******************/
#aboutContents #numbers .numCard.area > dl.customer > dd.num > dl > dt{
  margin-bottom: calc(9 * var(--setsize));
}
#aboutContents #numbers .numCard.area > dl.business > dd.num > dl > dt{
  margin-bottom: calc(84 * var(--setsize));
}

#aboutContents #numbers .numCard.nutrition > dl.bg05 > dd.num > dl > dt{
  margin-bottom: calc(45 * var(--setsize));
}


/**************************************
vision
**************************************/
#aboutContents #vision{
  display: block;
  width: 100%;
  padding: calc(100 * var(--setsize)) 0 calc(120 * var(--setsize));
  background: #FFFFFF;
}

#aboutContents #vision .secTTL{
  margin-bottom: calc(108 * var(--setsize));
}



#aboutContents #vision > .innerSection{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: calc(1040 * var(--setsize));
  margin: 0 auto;
  position: relative;
}

#aboutContents #vision > .innerSection + .innerSection{
  margin-top: calc(110 * var(--setsize));
}


#aboutContents #vision > .innerSection > .img{
  display: block;
  width: calc(480 * var(--setsize));
  position: relative;
}
#aboutContents #vision > .innerSection.customer > .img{order: 2;}


#aboutContents #vision > .innerSection > .img picture{
  display: block;
  width: 100%;
}

#aboutContents #vision > .innerSection> .img > .caution{
  width: 100%;
  font-size: calc(10 * var(--setsize));
  text-align: center;
  position: absolute;
  left: 0;
  bottom: calc(-20 * var(--setsize));
  color: #888;
}


#aboutContents #vision > .innerSection > .text{
  display: block;
  width: calc(100% - 540 * var(--setsize));
}

#aboutContents #vision > .innerSection.customer > .text{order: 1;}

#aboutContents #vision > .innerSection > .text > h3{
  display: block;
  margin: 0 auto;
}
#aboutContents #vision > .innerSection.customer > .text > h3{
  width: calc(414.3 * var(--setsize));
  margin-bottom: calc(47.8 * var(--setsize));
}
#aboutContents #vision > .innerSection.business > .text > h3{
  width: calc(371.26 * var(--setsize));
  margin-bottom: calc(54.4 * var(--setsize));
}


#aboutContents #vision > .innerSection > .text > .catch{
  display: block;
  margin-bottom: calc(20 * var(--setsize));
  font-size: calc(24 * var(--setsize));
  font-weight: 600;
  letter-spacing: 0.2em;
  text-align: center;
  line-height: 1.8;
}

#aboutContents #vision > .innerSection > .text > .detail{
  display: block;
  font-size: calc(16 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  text-align: left;
  line-height: 2.3;
}

#aboutContents #vision > .innerSection > .text > .caution{
  display: block;
  margin-top: calc(10 * var(--setsize));
  font-size: calc(13 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  text-align: left;
  line-height: 1.5;
}


#aboutContents #vision > .innerSection > .decoText{
  display: block;
  position: absolute;
  z-index: 1;
}

#aboutContents #vision > .innerSection.customer > .decoText{
  width: calc(250 * var(--setsize));
  left: calc(-80 * var(--setsize));
  top: calc(-48 * var(--setsize));
}

#aboutContents #vision > .innerSection.business > .decoText{
  width: calc(240 * var(--setsize));
  right: calc(-80 * var(--setsize));
  top: calc(-30 * var(--setsize));
}

/**************************************
vision
**************************************/
#aboutContents .eyeCatch{
	display: block;
  width: 100%;
  position: relative;
}

#aboutContents .eyeCatch > .ttl{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-top: calc(113 * var(--setsize));
  background: rgba(108,90,72,.2);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
#aboutContents .eyeCatch > .ttl > picture{
  width: calc(635 * var(--setsize));
}

#aboutContents .eyeCatch > .caution{
  display: block;
  font-size: calc(10 * var(--setsize));
  text-align: right;
  color: #FFFFFF;
  position: absolute;
  right: calc(10 * var(--setsize));
  bottom: calc(10 * var(--setsize));
  z-index: 3;
}


#aboutContents .eyeCatch .bg{
  display: block;
  width: 100%;
}


/**************************************
tosafety
**************************************/
#aboutContents #tosafety{
  display: block;
  width: 100%;
  padding: calc(100 * var(--setsize)) 0 calc(120 * var(--setsize));
  background: #FFFFFF;
}

#aboutContents #tosafety .secTTL{
  margin-bottom: calc(60 * var(--setsize));
}

#aboutContents #tosafety > .lede{
  display: block;
  margin-bottom: calc(80 * var(--setsize));
}

#aboutContents #tosafety > .lede > p{
  font-size: calc(16 * var(--setsize));
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.8;
  text-align: center;
}


#aboutContents #tosafety > .safetyPoint{
  display: block;
  width: calc(1200 * var(--setsize));
  margin: 0 auto;
  padding: calc(60 * var(--setsize)) 0 calc(100* var(--setsize));
  border-radius: 40px;
  background: #FDF9F2;
  position: relative;
}

#aboutContents #tosafety > .safetyPoint::before{
  content: '';
  display: block;
  width: calc(70 * var(--setsize));
  height: calc(4 * var(--setsize));
  background: #FD873E;
  position: absolute;
  top: 0;
  left: calc(50% - 35 * var(--setsize));
  z-index: 1;
}

#aboutContents #tosafety > .safetyPoint .pointTTL{
  display: block;
  text-align: center;
  margin-bottom: calc(40 * var(--setsize));
}

#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(1){
  display: block;
  margin-bottom: calc(5 * var(--setsize));
  font-size: calc(18 * var(--setsize));
  letter-spacing: 0.1em;
  line-height: 1.6;
  font-weight: 600;
}


#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(2){
  display: block;
  font-size: calc(25 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1.152;
  font-weight: 600;
}

#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(2) > em{
  font-size: calc(40 * var(--setsize));
  font-style: normal;
  color: #FD873E;
}

#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(2) > span{
  color: #FD873E;
}


/*innerSection*************/
#aboutContents #tosafety > .safetyPoint > .innerSection{
  display: block;
  width: calc(1000 * var(--setsize));
  margin: 0 auto;
  padding: calc(30 * var(--setsize)) calc(125 * var(--setsize)) calc(30 * var(--setsize));
  background: #FFFFFF;
}

#aboutContents #tosafety > .safetyPoint > .innerSection:nth-of-type(1):not(:nth-last-of-type(1)){
  padding-top: calc(60 * var(--setsize));
  border-radius: 40px 40px 0 0;
}

#aboutContents #tosafety > .safetyPoint > .innerSection:nth-last-of-type(1):not(:nth-of-type(1)){
  border-radius: 0 0 40px 40px;
  padding-bottom: calc(80 * var(--setsize));
}

#aboutContents #tosafety > .safetyPoint > .innerSection:nth-of-type(1):nth-last-of-type(1){
  border-radius: 40px;
  padding-bottom: calc(80 * var(--setsize));
}


#aboutContents #tosafety > .safetyPoint > .innerSection > .ttl{
  display: block;
  margin-bottom: calc(35 * var(--setsize));
  font-size: calc(22 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1.363636363636364;
  font-weight: 600;
  text-align: center;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .ttl > span{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 calc(20 * var(--setsize));
  width: 100%;
  margin-bottom: calc(30 * var(--setsize));
  font-size: calc(15 * var(--setsize));
  letter-spacing: 0.2em;
  line-height: 1;
  font-weight: 600;
  color: #FD873E;
  white-space: nowrap;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .ttl > span::before,
#aboutContents #tosafety > .safetyPoint > .innerSection > .ttl > span::after{
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  background-image: radial-gradient(circle farthest-side, #FD873E, #FD873E 50%, transparent 50%, transparent);
  background-repeat: repeat-x;
  background-position: left bottom;
  background-size: 6px 4px;
}


#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 calc(10 * var(--setsize));
  margin-bottom: calc(35 * var(--setsize));
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > picture,
#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > figure{
  flex-shrink: 1;
  display: block;
  width: 100%;
  aspect-ratio: 370 / 240;
  overflow: hidden;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > picture > img,
#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > figure > img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > figure > figcaption{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: rgba(253,249,242,.9);
  border-radius: calc(32 * var(--setsize)) 0 0 calc(32 * var(--setsize));
  padding: calc(4 * var(--setsize)) calc(10 * var(--setsize));
  font-size: calc(10 * var(--setsize));
  color: #888;
  position: absolute;
  right: 0;
  bottom: calc(10 * var(--setsize));
  z-index: 2;
}


#aboutContents #tosafety > .safetyPoint > .innerSection > .subttl{
  display: block;
  margin-bottom: calc(25 * var(--setsize));
  padding-top: calc(2 * var(--setsize));
  padding-left: calc(16 * var(--setsize));
  border-left: calc(4 * var(--setsize)) solid #FD873E;
  font-size: calc(20 * var(--setsize));
  text-align: left;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.2em;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > p{
  display: block;
  font-size: calc(14 * var(--setsize));
  letter-spacing: 0.08em;
  line-height: 2;
  font-weight: 400;
  text-align: left;
}

/**************************************
rerationSiteBlock
**************************************/
#aboutContents .rerationSiteBlock{
  display: block;
  width: calc(1200 * var(--setsize));
  max-width: none;
  padding: calc(50 * var(--setsize)) 0 0;
  position: relative;
  z-index: 1;
}


#aboutContents .rerationSiteBlock > .inner{
  display: block;
  width: calc(1200 * var(--setsize));
  max-width: none;
  margin: 0 auto;
  position: relative;
}

#aboutContents .rerationSiteBlock .ttl{
  display: block;
  margin-bottom: calc(30 * var(--setsize));
  font-size: calc(20 * var(--setsize));
  text-align: center;
  letter-spacing: 0.2em;
  line-height: 1.62;
  font-weight: 600;
}



#aboutContents .rerationSiteBlock .rerationSiteList{
  display: block;
  width: calc(1200 * var(--setsize));
  margin: 0 auto;
  padding: calc(50 * var(--setsize)) calc(60 * var(--setsize));
  background: #FFFFFF;
  border-radius: 40px;
}


#aboutContents .rerationSiteBlock .rerationSiteList > ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  gap: calc(30 * var(--setsize))  calc(30 * var(--setsize));
}


#aboutContents .rerationSiteBlock .rerationSiteList > ul > li{
  display: block;
  width: calc((100% - 60 * var(--setsize)) / 3);
}

#aboutContents .rerationSiteBlock .rerationSiteList > ul > li > a{
  display: block;
  text-decoration: none;
}

#aboutContents .rerationSiteBlock .rerationSiteList > ul > li > a > picture{
  display: block;
  width: 100%;
  border-radius: 10px;
  border: 1px solid #EEEEEE;
  overflow: hidden;
}