@charset "UTF-8";


.ftr_recruit_wrap{
  overflow: hidden;
}

/*******************************
*　共通
********************************/
/*タイトル*/
.tt2{
  font-family: "Zen Maru Gothic", sans-serif;
  position: relative;
}
.cmn_uses_title_txt:before,
.tt2:before{
  content: "";
  display: block;
  width: 31px;;
  aspect-ratio:31 / 27;
  background-image: url(/system_panel/uploads/images/tt_before.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: -26px;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
}
.cmn_uses_title_txt:before{
  top: -20px;
}
.tt2_ja{
  font-size: 22px;
  font-weight: 500; 
  line-height: 1;
}
.service_sub_item .tt2_ja{
  line-height: 1.388;
}
.tt2_en{
  font-size: 16px;
  font-weight: 500; 
  line-height: 1;
  color: var(--sub-color);
  margin-top: 16px;
}

/* ボタン */
.read_more{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 30px;
  margin-left: -5px;
  margin-right: -5px;
}
.read_more a{
  width: 255px;
  font-size: 15px;
  font-weight: 500;
  font-family: "Zen Maru Gothic", sans-serif;
  text-align: center;
  border: 2px solid var(--main-color);
  background:#fff;
  /*border-radius: 27px;*/
  color: #3d3732;
  padding: 12px 20px;
  margin: 5px 5px;
  position: relative;
  z-index: 1;
  transition: 0.2s all;
  border-radius: 22.5px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.read_more a p{
  /*letter-spacing: 0;*/
}
.read_more a:after{
  content: "→";
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 18px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  transition: 0.2s all;
}
.read_more a:hover{
  color: #FFF;
  background: var(--sub-color);
}
.read_more a:hover:after{
  margin-right: -5px;
}

/*横並びitem*/
.contents_items{
  display: flex;
  flex-wrap: wrap;
  margin-top: 50px;
  position: relative;
  z-index: 1;
}
.contents_item{
  width: 100%; 
  position: relative;
}
.contents_item:nth-child(n+2){
  margin-top: 50px;
}
.contents_item_outer:after{
  /*  content: "";
    display: block;
    width: 100%;
    height: 70%;
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 0;*/
}
.contents_items.three .contents_item{

}
.contents_items.two .contents_item{

}
.contents_item_box{
  position: relative;
  border:1px solid #eeece6;
  border-top: 0;
  padding-top: 14px;
}
.contents_item_box:before{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  position: absolute;
  top: 0;;
  left: 0;
}
.contents_item_outer{
  position: relative;
}
/*.contents_item_outer:before{
  content: "";
  display: block;
  width: 100%;
  height: 79.25%;
  background: #fff;
  border: 1px solid #edebe5;
  border-radius: 100px 100px 10px 10px;
  position: absolute;
  top: 110px;
  bottom: 0;
  z-index: 0;
}*/
.contents_item_img{
  position: relative;
}
.contents_item_img:before{
  content: "";
  display: block;
  width: 100%;
  aspect-ratio:540 / 260;
  background-image: url(/system_panel/uploads/images/sssssss.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  left: 0;
}
.contents_item_img img{
  -webkit-mask-image: url(/system_panel/uploads/images/img1_bg.png);
  aspect-ratio: 350 / 238;
  max-width: none;
  /*  position: absolute;
    z-index: 1;
    top: 0;
  */    -webkit-mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}

.contents_item_img .img_fit{
  -webkit-mask-image: url(/system_panel/uploads/images/img1_bg.png);
  -webkit-mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  z-index: 2;
}
.contents_item_img .img_fit img{
  -webkit-mask-image: none;
}

.contents_item_img .img_fit:before{
  padding-top: 68%;
}
.contents_item_img:after{
  content: "";
  display: block;
  width: 98.85%;
  aspect-ratio:346 / 244;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: -7px;
  left: -2px;
}
.contents_item_img.color1:after{
  background-image: url(/system_panel/uploads/images/color1.png);
}
.contents_item_img.color2:after{
  background-image: url(/system_panel/uploads/images/color2.png);
}
.contents_item_img.color3:after{
  background-image: url(/system_panel/uploads/images/color3.png);
}
.contents_item_inner{
  padding: 18px 29px;
  position: relative;
  z-index: 1;
}
.contents_item_tt{
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  font-family: "Zen Maru Gothic", sans-serif;
  position: relative;
  z-index: 1;
  margin-top: 0;
}
.content_desc{
  font-size: 16px;
  font-weight: 500;
  line-height: 2.125em;
  text-align: justify;
  margin-top: 20px;
}
.content_desc p{
  letter-spacing: 0.05em;
}

/*エリア*/
.home_area_box{
  display: flex;
  justify-content: flex-start;
  position: relative;
  border: 1px solid #edebe5;
  background: #fff;
  border-radius: 15px;
  padding: 30px 16px 250px;
  margin-top: 50px;
  z-index: 1;
}
.home_area_box1{
  width: 100%;
}
.home_area_box1 .content_desc{
  margin-top: 0;
}
.content_desc .caution{
  color: #fb6c6c;
}
.home_area_box2{
  width: 65%;
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
}
.home_area_img{

}

/*サービス*/
.service_main_box{
  margin-top: 50px;
}
.service_main_inner .tt2:before{
  display: none;
}
.service_main_img{

}
.service_main_img:before{
  padding-top: 34.59%;
}
.service_main_img img{
  -webkit-mask-image: url(/system_panel/uploads/images/service1.png);
  aspect-ratio: 1110 / 382;
  max-width: none;
  -webkit-mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}

.service_main_img_fr{
  position: absolute;
  z-index: 1;
  top: 0;
  width: 100%;
  -webkit-mask-image: url(/system_panel/uploads/images/service1.png);
  aspect-ratio: 1110 / 382;
  max-width: none;
  -webkit-mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}
.service_main_img_fr img{
  -webkit-mask-image: none;
}

.bg_color{
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
}
.service_main_color1{
  width: 29.54%;
  aspect-ratio:328 / 311;
  background-image: url(/system_panel/uploads/images/service_color1.png);
  bottom: -13.02%;;
  left: -10.45%;
}
.service_main_color2{
  width: 43.6%;
  aspect-ratio:484 / 443;
  background-image: url(/system_panel/uploads/images/service_color2.png);
  top: -44.79%;;
  right: -17.65%;;
}
.service_main_inner{
  background: #fff;
  border-radius: 50px;
  position: relative;
  top: -16px;
  z-index: 1;
  padding: 33px 16px;
}

/*左右交互レイアウト*/
.service_sub_items{
  margin-top: 10px;
}
.service_sub_item{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.service_sub_item:nth-child(n+2){
  margin-top: 10px;
}
.service_sub_box1{
  width: 100%;
  position: relative;
}
.service_sub_box1_img{

}
.service_sub_box1_img img{
  -webkit-mask-image: url(/system_panel/uploads/images/sub_bg.png);
  aspect-ratio: 760 / 430;
  max-width: none;
  -webkit-mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}

/**/
.service_sub_box1_img_fr{
  position: absolute;
  z-index: 2;
  top: 0;
  width: 100%;
  aspect-ratio: 760 / 430;
  overflow: hidden;
  -webkit-mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-image: url(/system_panel/uploads/images/sub_bg.png);
}
.service_sub_box1_img_fr img{
  -webkit-mask-image:none;
}

.service_sub_box1_img:before{
  padding-top: 57.06%;
}
.service_sub_box2{
  width: 100%;
  background: #fff;
  border-radius: 50px;
  padding: 28px 16px;
  position: relative;
  z-index: 2;
  top: -30px;
}
.service_sub_box2 .tt2:before{
  display: none;
}
.service_sub_box2 .content_desc{
  font-weight: 400;
}

/*左右交互レイアウト（背景色）*/
.service_bg{
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
}
.service_color1{
  width: 58.28%;;
  aspect-ratio:443 / 409;
  background-image: url(/system_panel/uploads/images/service_bg_color1.png);
  top: -16.27%;
  left: -29.73%;
}
.service_color2{
  width:58.42%; ;
  aspect-ratio:444 / 425;
  background-image: url(/system_panel/uploads/images/service_bg_color2.png);
  top: -17.67%;
  right: -13.42%;
  z-index: 1;
}
.service_color3{
  width: 68.28%;;
  aspect-ratio:519 / 343;
  background-image: url(/system_panel/uploads/images/service_bg_color3.png);
  bottom: -18.6%;
  left: -33.68%;
  z-index: 1;
}
.service_color4{
  width:71.31%;;
  aspect-ratio:542 / 538;
  background-image: url(/system_panel/uploads/images/color4.png);
  bottom: -9.2%;
  right: -20.39%;
  z-index: 1;
}
.service_color5{
  width: 55.52%;;
  aspect-ratio:422 / 371;
  background-image: url(/system_panel/uploads/images/color5.png);
  bottom: -18.6%;
  left: -28.94%;
  z-index: 1;
}
.service_color1.color6{
  bottom: -18.6%;
  right: -33.68%;
  left: auto;
  z-index: 1;
}

.service_sub_item:nth-child(2) .service_sub_box1{
  z-index: 1;
}
.service_sub_item:nth-child(2) .service_sub_box2{
  z-index: 2;
}
.service_sub_item:nth-child(3) .service_sub_box1{
  z-index: 0;
}
.service_sub_item:nth-child(3) .service_sub_box2{
  z-index: 0;
}

/*スタッフ*/
.person{
  position: absolute;
  z-index: 3;
}
.person1{
  width: 84px;
  top: 50%;
  left: calc(50% + 90px);
  transform: translateY(-50%);
}
.person2{
  width: 91px;
  top: 50%;
  left: calc(50% - 173px);
  transform: translateY(-50%);
}
.person3{
  width: 85px;
  bottom: -50px;
  left: 0;
}
.person4{
  width: 90px;
  bottom: -55px;
  right: 0;
}
.person5{
  width: 90px;
  bottom: -56px;
  left: 0;
}

.body_family .home_news_wrap.family{
  display: block;
}
/* コピー用 */
@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){
  .contents_item_outer:before{
    height: 83.25%;
  }

  /*news*/
  .home_news_wrap .read_more{
    width: 100%;
  }

  .home_area_box{
    flex-wrap: wrap;
    padding: 30px 16px 70px;
  }
  .home_area_box2{
    position: relative;
  }
}
@media (min-width:768px){
  /*タイトル*/
  .tt2{

  }
  .tt2:before{

  }
  .tt2_ja{
    font-size: 30px;
    font-size: 28px;
  }
  .tt2_en{
    font-size: 18px;
    margin-top: 21px;
  }

  .tt2.left{
    text-align: left;
  }
  .tt2.left:before{
    left: 0;
    transform: translateY(-50%) translateX(0);
  }
  /* ボタン */
  .read_more{
    margin-top: 38px;
  }
  .read_more.center{
    justify-content: center;
  }
  .read_more.left{
    justify-content: flex-start;
  }
  .read_more.right{
    justify-content: flex-end;
  }
  .read_more a{
    width: 254px;
    font-size: 15px;
    padding: 12px 20px;
    margin: 5px 5px;
  }
  .read_more a:after{
    content: "→";
    top: 50%;
    right: 18px;
  }
  .read_more a:hover:after{
    margin-right: -5px;
  }

  /*横並びitem*/
  .contents_items{
    margin-inline:-15px;
    margin-top: 60px;
  }
  .contents_item{
    width: 50%;
    padding: 0 15px;
  }
  .contents_item:nth-child(n+2){
    margin-top: 0;
  }
  .contents_item:nth-child(n+3){
    margin-top: 50px;
  }
  .contents_items.three .contents_item{

  }
  .contents_items.two .contents_item{

  }
  .contents_item_outer{

  }
  .contents_item_outer:before{
    height: 83.25%;
  }
  .contents_item_img{

  }
  .contents_item_img:before{

  }
  .contents_item_img:after{

  }
  .contents_item_inner{

  }
  .contents_item_tt{
    font-size: 18px;
  }
  .contents_item_tt.left{
    text-align: left;
    padding-left: 29px;
  }
  .contents_item .content_desc{
    margin-top: 13px;
  }

  /*エリア*/
  .home_area_box{
    padding: 20px 30px;
    margin-top: 60px;
  }
  .home_area_box1{
    width: 61.22%;
  }
  .home_area_box1 .content_desc{

  }
  .content_desc .caution{

  }
  .home_area_box2{
    width: 37.67%;
    top: 50%;
    bottom: auto;
    left: auto;
    right: -1.5%;
    transform: translateY(-50%) translateX(0);;
  }
  .home_area_img{

  }

  /*サービス*/
  .service_main_box{
    margin-top: 60px;
  }
  .service_main_img{

  }
  .service_main_img:before{
    padding-top: 380px;
  }
  .service_main_color1{

  }
  .service_main_color2{

  }
  .service_main_inner{
    top: -180px;
    padding: 33px 16px;
  }

  /*左右交互レイアウト*/
  .service_sub_items{

  }
  .service_sub_item{

  }
  .service_sub_item:nth-child(n+2){
    margin-top: 0;
  }
  .service_sub_box1{

  }
  .service_sub_box1_img{

  }
  .service_sub_box1_img img{

  }
  service_sub_box1_img:before{

  }
  .service_sub_box2{
    padding: 26px 10px 33px 32px;
    top: -50px;
  }
  .service_sub_box2 .tt2:before{

  }
  .service_sub_box2 .content_desc{

  }
  .service_sub_box2 .read_more{
    margin-top: 23px;
  }

  /*スタッフ*/
  .person{
    position: absolute;
  }
  .person1{
    width: 100px;
    top: 50%;
    left: calc(50% + 132px);
    transform: translateY(-50%);
  }
  .person2{
    width: 100px;
    top: 50%;
    left: calc(50% - 277px);
    transform: translateY(-50%);
  }
  .person3{
    width: 144px;
    bottom: 10px;
    left: 0;
  }
  .person4{
    width: 157px;
    bottom: 36px;
    right: -28px;
  }
  .person5{
    width: 156px;
    bottom: 0;
    left: 0;
  }
}
@media (min-width:1024px){
  /*タイトル*/
  .tt2{

  }
  .tt2:before{

  }
  .tt2_ja{
    /*font-size: 36px;*/
  }
  .tt2_en{

  }

  /*横並びitem*/
  .contents_items{
    margin-top: 88px;
  }
  .contents_item{

  }

  .contents_items.three .contents_item{
    width: 33.33%;
  }
  .contents_items.three .contents_item:nth-child(n+2){
    margin-top: 0;
  }
  .contents_items.three .contents_item:nth-child(n+4){
    margin-top: 30px;;
  }
  .contents_items.two .contents_item{
    width: 50%;
  }
  .contents_items.two .contents_item:nth-child(n+3){
    margin-top: 50px;
  }
  .contents_item_outer{

  }
  .contents_item_outer:before{
    height: 79.25%;
  }
  .contents_item_img{

  }
  .contents_item_img:before{

  }
  .contents_item_img:after{

  }
  .contents_item_inner{
    padding: 0 32px 39px;
  }
  .contents_item_tt{
    font-size: 18px;
  }
  .contents_item_tt.left{
    padding-left: 32px;
  }

  .pg_visit .section.sec3 .contents_item_tt{
    font-size: 18px;
  }
  .content_desc{

  }
  .content_desc.center{
    text-align: center;
  }

  /*エリア*/
  .home_area_box{
    padding: 27px 65px 30px;
    margin-top: 75px;
  }
  .home_area_box1{

  }
  .home_area_box1 .content_desc{

  }
  .content_desc .caution{

  }
  .home_area_box2{
    width: 25.67%;
    top: 50%;
    right: 8.5%;
    transform: translateY(-50%);
  }
  .home_area_img{

  }

  /*サービス*/
  .service_main_box{
    margin-top: 80px;
  }
  .service_main_img{

  }
  .service_main_img:before{
    padding-top: 380px;
  }
  .service_main_color1{

  }
  .service_main_color2{

  }
  .service_main_inner{
    width: 82.88%;
    margin-inline:auto;
    top: -100px;
  }

  /*左右交互レイアウト*/
  .service_sub_items{

  }
  .service_sub_item{
    position: relative;
  }
  .service_sub_item:nth-child(n+2){
    margin-top: 20px;
  }
  .pg_visit .service_sub_items,
  .pg_support .service_sub_items{
    margin-top: 78px;
  }
  .pg_visit .service_sub_item:nth-child(n+2),
  .pg_support .service_sub_item:nth-child(n+2){
    margin-top: 40px;
  }
  .service_sub_item:nth-child(odd){
    justify-content: flex-end;
  }
  .service_sub_item:nth-child(even) {
    justify-content: flex-start;
  }
  .service_sub_box1{
    width: 68.46%;
    position: absolute;
    top: 0;
    z-index: 0;
  }
  .service_sub_item:nth-child(odd) .service_sub_box1{
    left: 0;
  }

  .service_sub_item:nth-child(even) .service_sub_box1{
    right: 0;
  }

  .service_sub_box1_img{

  }
  .service_sub_box1_img img{

  }
  service_sub_box1_img:before{

  }
  .service_sub_box2{
    width: 45.94%;
    position: relative;
    z-index: 0;
    padding: 26px 10px 33px 32px;
    margin-top: 100px;
    top: auto;
  }

  .service_sub_item:nth-child(even) .service_sub_box2{
    padding-left: 0;
  }

  .service_sub_box2 .tt2:before{

  }
  .service_sub_box2 .content_desc{

  }
  .service_sub_item:nth-child(even) .content_desc{
    padding-right: 36px;
  }

  /*スタッフ*/
  .person{
    position: absolute;
  }
  .person1{
    width: 131px;
    top: 64%;
    left: calc(50% + 132px);
    transform: translateY(-50%);
  }
  .person2{
    width: 144px;
    top: 26%;
    left: calc(50% - 277px);
    transform: translateY(-50%);
  }
  .person3{
    width: 144px;
    bottom: -55px;
    left: 0;
  }
  .person4{
    width: 157px;
    bottom: -80px;
    right: -13px;
  }
  .person5{
    width: 156px;
    bottom: -117px;
    left: -12px;
  }
}
@media (min-width:1200px){
  .contents_item_tt{
    font-size: 20px;
  }

  .tt2_ja{
    font-size: 35px;
  }

  .service_main_inner{
    top: -50px;
  }

  .pg_visit .section.sec3 .contents_item_tt{
    font-size: 21px;
  }
}