@charset "UTF-8";


/*****************************
setting
******************************/
#aboutContents{
  width: 100%;
  padding-bottom: 7rem;
  overflow: hidden;
}

#aboutContents picture,
#aboutContents figure{
  display: block;
  width: 100%;
  height: auto;
}

/**************************************
secTTL
**************************************/
#aboutContents .secTTL{
  display: block;
  font-size: 2.2rem;
  letter-spacing: 0.2em;
  line-height: 1.5;
  font-weight: 500;
  text-align: center;
}

#aboutContents .secTTL > span{
  display: block;
  font-size: 1.2rem;
  font-weight: 700;
  color: #FD873E;
  letter-spacing: 0.2em;
  line-height: 2;
}

#aboutContents .secTTL > span:not(:nth-last-child(1)){
  margin-bottom: 1.5rem;
}


/**************************************
fadeInBlock
**************************************/
#aboutContents .fadeInBlock{
  opacity: 0;
  transform: translateY(10rem);
  transition: transform .6s ease, opacity .6s ease;
}
#aboutContents .fadeInBlock.view{
  opacity: 1;
  transform: translateY(0);
}



/**************************************
mainVisual
**************************************/
#aboutContents .mvBlock{
	display: block;
  width: 100%;
  min-height: 40rem;
  position: relative;
}
#aboutContents .mvBlock::after{
  content: '';
  display: block;
  width: 100%;
  height: 8rem;
  background: url("../Contents/ThemeImage/about/mv_over_sp.svg") center bottom no-repeat;
  background-size: 100% auto;
  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: 3rem;
  font-size: 2.2rem;
  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: 2rem;
  font-size: 1.2rem;
  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: 30.765rem; 
  position: absolute;
  left: 3.3rem;
  bottom: -5rem;
  z-index: 3;
}



/**************************************
mainVisual
**************************************/
#aboutContents .firstLede{
  padding-top: 6.8rem;
  position: relative;
}

#aboutContents .firstLede > p{
  font-size: 1.4rem;
  text-align: center;
  letter-spacing: 0.12em;
  line-height: 2.8;
  font-weight: 500;
}


#aboutContents .firstLede .deco{
  display: block;
  width: 100%;
  margin-top: 2rem;
}

#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: 100%;
  padding: 0 3rem 0 2rem;
  margin: 0 auto 6rem;
}

#aboutContents .contentsNav > ul{
  display: block;
  border-top: 2px solid #EBE5E2;
  position: relative;
}



#aboutContents .contentsNav > ul > li{
  display: block;
  width: 100%;
  padding: 1.8rem 1.25rem;
  border-bottom: 2px solid #EBE5E2;
  position: relative;
}


#aboutContents .contentsNav > ul > li > a{
  display: block;
  text-decoration: none;
  position: relative;
}
#aboutContents .contentsNav > ul > li > a::after{
  content: '';
  display: block;
  width: 1.3rem;
  height: 0.8rem;
  background: url("../Contents/ThemeImage/about/icon_anchor.svg") center center no-repeat;
  background-size: 100% auto;
  position: absolute;
  right: 0.6rem;
  top: calc(50% - 0.4rem);
}

#aboutContents .contentsNav > ul > li > a > span:nth-of-type(1){
  display: block;
  margin-bottom: 0;
  font-size: 1.1rem;
  font-weight: 700;
  text-align: left;
  letter-spacing: 0.2em;
  line-height: 2.363636363636364;
  color: #FD873E;
}

#aboutContents .contentsNav > ul > li > a > span:nth-of-type(2){
  display: block;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.15em;
  color: #454140;
  text-align: left;
}

#aboutContents .contentsNav > ul > li > a > span:nth-of-type(2) > em{
  font-style: normal;
}

#aboutContents .contentsNav > ul > li > a[href="#vision"] > span:nth-of-type(2) > em{
  display: block;
  margin-bottom: -0.4rem;
  font-size: 1.2rem;
  line-height: 2;
}

/**************************************
contentsNav
**************************************/
#aboutContents #about{
  display: block;
  width: 100%;
  padding: 6rem 0 6rem;
  background: #FFFFFF;
  border-top: 4px solid #FD873E;
}

#aboutContents #about .secTTL{
  margin-bottom: 4rem;
}


#aboutContents #about > .lede{
  display: block;
  width: calc(100% - 7rem);
  margin: 0 auto 6rem;
}

#aboutContents #about > .lede > p.catch{
  display: block;
  margin-bottom: 3rem;
  font-size: 1.7rem;
  letter-spacing: 0.2em;
  line-height: 1.5;
  font-weight: 600;
  text-align: left;
}

#aboutContents #about > .lede > p:not(.catch){
  display: block;
  font-size: 1.4;
  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: 3rem;
}


#aboutContents #about > .massage{
  display: block;
  width: 100%;
  margin: 0 auto 6rem;
  padding: 4.3rem 3.5rem 4rem;
  
  border-radius: 20px;
  background: #FDF9F2;
  position: relative;
}

#aboutContents #about > .massage::before{
  content: '';
  display: block;
  width: 5rem;
  height: 0.4rem;
  background: #FD873E;
  position: absolute;
  top: 0;
  left: calc(50% - 2.5rem);
  z-index: 1;
}

#aboutContents #about > .massage > .ttl{
  display: block;
  margin-bottom: 2.7rem;
  font-size: 1.8rem;
  letter-spacing: 0.2em;
  line-height: 1.818181818181818;
  font-weight: 500;
  text-align: center;
}

#aboutContents #about > .massage > .inner{
  display: block;
  width: 100%;
}

#aboutContents #about > .massage > .inner > .text{
  display: block;
  margin-bottom: 2rem;
}

#aboutContents #about > .massage > .inner > .text > p{
  display: block;
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 2;
  text-align: left;
}
#aboutContents #about > .massage > .inner > .text > p.name{
  display: block;
  margin-top: 2rem;
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
}


#aboutContents #about > .massage > .inner > figure{
  display: block;
  width: 18rem;
  margin: 0 auto;
  border-radius: 50rem 50rem 0 0;
  overflow: hidden;
}

#aboutContents #about > .map{
  display: block;
  width: 100%;
  margin-bottom: 5rem;
}

#aboutContents #about > .map .overScrollArea{
  width: 100%;
  padding: 0 2rem;
}

#aboutContents #about > .map figure{
  display: block;
  width: 55rem;
}

#aboutContents #about > .map > .caution{
  padding: 0 1.5rem;
  margin-top: 1rem;
  text-align: left;
  font-size: 1.2rem;
  line-height: 1.5;
}


/*historySection **********************/
#aboutContents #about .historySection{
  display: block;
  width: 100%;
  margin: 0 0 0 auto;
  background: #FDF9F2;
  border-radius: 20px 0 0 20px;
  padding-top: 4rem;
  padding-bottom: 5rem;
  position: relative;
}

#aboutContents #about .historySection::before{
  content: '';
  display: block;
  width: 5rem;
  height: 0.4rem;;
  background: #FD873E;
  position: absolute;
  top: 0;
  left: calc(50% - 2.5rem);
  z-index: 1;
}

#aboutContents #about .historySection > .ttl{
  display: block;
  margin: 0 auto 3rem;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  line-height: 1.818181818181818;
  text-align: center;
}
    

/*historySlider **********************/
#historySlider{
  display: block;
  width: 100%;
  padding-bottom: 3.4rem;
  position: relative;
}

#historySlider > .historySlider{
  width: 100%;
  padding-left: 3rem;
  padding-right: 3rem;
  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: 1.5rem;
}

#historySlider > .historySlider .slider > dl{
  display: block;
  height: 100%;
  min-height: 23.4rem;
  padding-right: 0.5rem;
  position: relative;
}

#historySlider > .historySlider .slider:not(:nth-last-child(1)) > dl::after{
  content: '';
  display: block;
  width: calc(100% - 9.4rem - 1.5rem);
  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: 3.1rem;
  z-index: 2;
}

#historySlider > .historySlider .slider > dl > dt{
  display: block;
  height: 6.2rem;
  margin-bottom: 1rem;
  font-size: 4rem;
  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: 1rem;
  line-height: 2.363636363636364;
  font-weight: 700;
}

#historySlider > .historySlider .slider > dl > dd{
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  height: calc(100% - 7.2rem);
  padding: 1.5rem 0;
  background: #FFFFFF;
  border-radius: 10px;
}


#historySlider > .historySlider .slider > dl > dd > dl{
  display: block;
  width: 25rem;
  padding: 0 2rem;
  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: 1.2rem;
  font-size: 1.3rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.35;
  color: #FD873E;
}
#historySlider > .historySlider .slider > dl > dd > dl > dt > span{
  font-size: 2rem;
  line-height: 1.35;
}

#historySlider > .historySlider .slider > dl > dd > dl > dd{
  display: block;
  font-size: 1.2rem;
  line-height: 1.5;
  text-align: left;
  letter-spacing: 0.08em;
  font-weight: 500;
}
#historySlider > .historySlider .slider > dl > dd > dl > dd + dd{
  margin-top: 2rem;
}

#historySlider > .swiper-scrollbar{
  display: block;
  width: 24.5rem;
  height: 0.4rem;
  background: #EBE5E2;
  border-radius: 0.2rem;
  position: absolute;
  bottom: 0;
  left: 6.5rem;
}

#historySlider > .swiper-scrollbar .swiper-scrollbar-drag {
  background: #F5B489;
  border-radius: 0.2rem;
}



/**************************************
contentsNav
**************************************/
#aboutContents #numbers{
  display: block;
  width: 100%;
  padding: 6rem 0 6rem;
}

#aboutContents #numbers .secTTL{
  margin-bottom: 4.3rem;
}


#aboutContents #numbers .innerSection{
  display: block;
  width: 100%;
  padding: 0 3rem;
  margin: 0 auto;
}

#aboutContents #numbers .innerSection + .innerSection{
  margin-top: 5.5rem;
}

#aboutContents #numbers .innerSection > .ttl{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 1.5rem;
  width: 100%;
  margin-bottom: 8rem;
  font-size: 1.7rem;
  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: 1px;
  background-image: linear-gradient(to right, #FD873E 2px, transparent 5px);
  background-repeat: repeat-x;
  background-position: left bottom;
  background-size: 7px 1px;
}


#aboutContents #numbers .numCard{
  display: block;
  width: 100%;
}

#aboutContents #numbers .numCard > dl,
#aboutContents #numbers .numCard > .nutrition{
  display: block;
  width: 100%;
  background: #FFFFFF;
  border-radius: 20px;
  padding: 4rem 2.5rem 3rem;
  position: relative;
}

#aboutContents #numbers .numCard > dl.bg01{
  background-image: url("../Contents/ThemeImage/about/bg_colortry.svg");
  background-position: calc(100% - 3.1rem) calc(100% - 1.74rem);
  background-size: 6rem;
  background-repeat: no-repeat;
}

#aboutContents #numbers .numCard > dl.bg02{
  background-image: url("../Contents/ThemeImage/about/bg_japan.svg");
  background-position: center center;
  background-size: 19.5rem;
  background-repeat: no-repeat;
}

#aboutContents #numbers .numCard > dl.bg02:nth-of-type(1){
  margin-bottom: 14rem;
}

#aboutContents #numbers .numCard > dl.bg02 dd.outCaution{
  padding: 0 1rem;
  font-size: 1rem;
  position: absolute;
  left: 0;
  bottom: -1rem;
  transform: translateY(100%);
}



#aboutContents #numbers .numCard > dl.bg03{
  background-image: url("../Contents/ThemeImage/about/bg_gohan.svg");
  background-position: calc(100% - 2.5rem) calc(100% - 2.5rem);
  background-size: 12rem;
  background-repeat: no-repeat;
}
#aboutContents #numbers .numCard > dl.bg04{
  background-image: url("../Contents/ThemeImage/about/bg_weight.svg");
  background-position: calc(100% - 2.5rem) calc(100% - 3rem);
  background-size: 9rem;
  background-repeat: no-repeat;
}
#aboutContents #numbers .numCard > dl.bg05{
  background-image: url("../Contents/ThemeImage/about/bg_fire.svg");
  background-position: calc(100% - 3.6rem) calc(100% - 3.9rem);
  background-size: 6.4rem;
  background-repeat: no-repeat;
}

#aboutContents #numbers .numCard > dl + dl{
  margin-top: 8rem;
}


#aboutContents #numbers .numCard > dl.nutrition{margin-top: -4rem;}
#aboutContents #numbers .numCard > dl + dl.nutrition{
  margin-top: 2rem;
}

#aboutContents #numbers .numCard > dl > dt{
  display: block;
  position: absolute;
  top: -6rem;
  left: 50%;
  transform: translateX(-50%);
}

#aboutContents #numbers .numCard > dl.nutrition > dt{display: none;}

#aboutContents #numbers .numCard > dl > dt > span{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 1rem;
  margin-bottom: 1rem;
  font-size: 1.6rem;
  letter-spacing: 0.2em;
  line-height: 1;
  font-weight: 500;
}
#aboutContents #numbers .numCard > dl > dt > span::before{
  content: '';
  display: block;
  width: 3.5rem;
  height: 3.5rem;
}

#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: 18rem;
  height: 3rem;
  border-radius: 1.5rem;
  padding-left: 0.5rem;
  background: #FD6A3E;
  font-style: normal;
  font-size: 1.3rem;
  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: 1.5rem;
  font-size: 1.6rem;
  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: 1rem;
  font-size: 1.4rem;
  color: #A29791;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd{
  font-size: 1.4rem;
  letter-spacing: 0.2em;
  font-weight: 500;
  text-align: center;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd > strong{
  display: inline-block;
  margin-left: 1rem;
  margin-right: 1rem;
  font-size: 4rem;
  font-weight: 600;
  color: #FD873E;
  position: relative;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd > strong > span{
  font-size: 1.6rem;
  font-weight: 700;
}

#aboutContents #numbers .numCard > dl > dd.num > dl > dd > strong > span.upper{
  font-size: 1.2rem;
  font-weight: 500;
  color: #A29791;
  position: absolute;
  left: 0;
  top: -1.6rem;
}


#aboutContents #numbers .numCard > dl > dd.num > dl + dl{
  padding-top: 3rem;
  margin-top: 2.5rem;
  border-top: 2px solid #EBE5E2;
}

#aboutContents #numbers .numCard > dl > dd.caution{
  display: block;
  margin-top: 2rem;
  font-size: 1.3rem;
  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: 0.5rem 0;
}
#aboutContents #numbers .numCard > dl > dd.caution ul.cirlceList > li{
  padding-left: 1.6rem;
  text-align: left;
  font-size: 1.3rem;
  position: relative;
}
#aboutContents #numbers .numCard > dl > dd.caution ul.cirlceList > li::before{
  content: '';
  display: block;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background: #FD873E;
  position: absolute;
  left: 0;
  top: 0.7rem;
}


#aboutContents #numbers .numCard > dl > dd.cautionSmall{
  display: block;
  margin-top: 2rem;
  font-size: 1.2rem;
  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: 1.5rem;
}
#aboutContents #numbers .numCard.area > dl.business > dd.num > dl > dt{
  margin-bottom: 1.5rem;
}
*/

#aboutContents #numbers .numCard.nutrition > dl.bg05 > dd.num > dl > dt{
  margin-bottom: 4.1rem;
}


/**************************************
vision
**************************************/
#aboutContents #vision{
  display: block;
  width: 100%;
  padding: 6rem 0 6rem;
  background: #FFFFFF;
  overflow: hidden;
}

#aboutContents #vision .secTTL{
  margin-bottom: 4.3rem;
}



#aboutContents #vision > .innerSection{
  display: block;
  margin: 0 auto;
  position: relative;
}

#aboutContents #vision > .innerSection + .innerSection{
  margin-top: 4.5rem;
}


#aboutContents #vision > .innerSection > .img{
  display: block;
  width: 35rem;
  margin: 0 auto 4.15rem 0;
  transform: translate(-2rem,10rem);
}
#aboutContents #vision > .innerSection.customer > .img{
  margin: 0 0 3.43rem auto;
  transform: translate(2rem,10rem);
}

#aboutContents #vision > .innerSection > .img picture{
  display: block;
  width: 100%+
}

#aboutContents #vision > .innerSection > .img.view{transform: translate(-2rem,0);}
#aboutContents #vision > .innerSection.customer > .img.view{transform: translate(2rem,0);}

#aboutContents #vision > .innerSection > .img > .caution{
  width: 100%;
  font-size: 1rem;
  text-align: left;
  position: absolute;
  left: 0;
  bottom: -2rem;
  padding: 0 3rem;
  color: #888;
}

#aboutContents #vision > .innerSection.customer > .img > .caution{
  text-align: right;
}


#aboutContents #vision > .innerSection > .text{
  display: block;
  width: 30.5rem;
  margin: 0 auto;
}


#aboutContents #vision > .innerSection > .text > h3{
  display: block;
  margin: 0 auto;
}
#aboutContents #vision > .innerSection.customer > .text > h3{
  width: 28.078rem;
  margin-bottom: 3.21rem;
}
#aboutContents #vision > .innerSection.business > .text > h3{
  width: 25.163rem;
  margin-bottom: 3.63rem;
}


#aboutContents #vision > .innerSection > .text > .catch{
  display: block;
  margin-bottom: 2.5rem;
  font-size: 2rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-align: center;
  line-height: 1.8;
}

#aboutContents #vision > .innerSection > .text > .detail{
  display: block;
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-align: left;
  line-height: 2.3;
}

#aboutContents #vision > .innerSection > .text > .caution{
  display: block;
  margin-top: 1rem;
  font-size: 1.2rem;
  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: 15rem;
  left: 2rem;
  top: 32.1rem;
}

#aboutContents #vision > .innerSection.business > .decoText{
  width: 16rem;
  left: 18rem;
  top: 32.7rem;
}

/**************************************
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: 7.41rem;
  background: rgba(108,90,72,.2);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
#aboutContents .eyeCatch > .ttl > picture{
  width: 32.5rem;
}

#aboutContents .eyeCatch > .caution{
  display: block;
  font-size: 1rem;
  text-align: right;
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  z-index: 3;
  color: #FFFFFF;
}


#aboutContents .eyeCatch .bg{
  display: block;
  width: 100%;
}


/**************************************
tosafety
**************************************/
#aboutContents #tosafety{
  display: block;
  width: 100%;
  padding: 5rem 0 0;
  background: #FFFFFF;
}

#aboutContents #tosafety .secTTL{
  margin-bottom: 4rem;
}

#aboutContents #tosafety > .lede{
  display: block;
  margin-bottom: 4rem;
}

#aboutContents #tosafety > .lede > p{
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.8;
  text-align: center;
}


#aboutContents #tosafety > .safetyPoint{
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 4.1rem 1.5rem 3rem;
  border-radius: 30px 30px 0 0;
  background: #FDF9F2;
  position: relative;
}

#aboutContents #tosafety > .safetyPoint::before{
  content: '';
  display: block;
  width: 5rem;
  height: 0.4rem;
  background: #FD873E;
  position: absolute;
  top: 0;
  left: calc(50% - 2.5rem);
  z-index: 1;
}

#aboutContents #tosafety > .safetyPoint .pointTTL{
  display: block;
  text-align: center;
  margin-bottom: 3rem;
}

#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(1){
  display: block;
  margin-bottom: 1rem;
  font-size: 1.4rem;
  letter-spacing: 0.2em;
  line-height: 1.5;
  font-weight: 600;
}


#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(2){
  display: block;
  font-size: 2rem;
  letter-spacing: 0.2em;
  line-height: 1.5;
  font-weight: 600;
}

#aboutContents #tosafety > .safetyPoint .pointTTL > span:nth-of-type(2) > em{
  font-size: 3.5rem;
  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: 100%;
  margin: 0 auto;
  padding: 2.5rem 2rem;
  background: #FFFFFF;
}

#aboutContents #tosafety > .safetyPoint > .innerSection:nth-of-type(1):not(:nth-last-of-type(1)){
  padding-top: 4rem;
  border-radius: 30px 30px 0 0;
}

#aboutContents #tosafety > .safetyPoint > .innerSection:nth-last-of-type(1):not(:nth-of-type(1)){
  border-radius: 0 0 30px 30px;
  padding-bottom: 4rem;
}

#aboutContents #tosafety > .safetyPoint > .innerSection:nth-of-type(1):nth-last-of-type(1){
  border-radius: 30px;
  padding-bottom: 4rem;
}


#aboutContents #tosafety > .safetyPoint > .innerSection > .ttl{
  display: block;
  margin-bottom: 3rem;
  font-size: 1.8rem;
  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 2rem;
  width: 100%;
  margin-bottom: 3rem;
  font-size: 1.3rem;
  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 6px;
}


#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages{
  display: block;
  width: 100%;
  margin-bottom: 2.5rem;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > picture,
#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > figure{
  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 > picture + picture,
#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > figure + figure{
  margin-top: 0.5rem;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > .imgages > figure > figcaption{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: rgba(253,249,242,.9);
  border-radius: 3.2rem 0 0 3.2rem;
  padding: 0.4rem 1rem;
  font-size: 1rem;
  color: #888;
  position: absolute;
  right: 0;
  bottom: 1rem;
  z-index: 2;
}


#aboutContents #tosafety > .safetyPoint > .innerSection > .subttl{
  display: block;
  margin-bottom: 2rem;
  padding-top: 0.2rem;
  padding-left: 2rem;
  border-left: 0.3rem solid #FD873E;
  font-size: 1.6;
  text-align: left;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.2em;
}

#aboutContents #tosafety > .safetyPoint > .innerSection > p{
  display: block;
  font-size: 1.3rem;
  letter-spacing: 0.08em;
  line-height: 2;
  font-weight: 400;
  text-align: left;
}








