@charset "UTF-8";
/* 共通
--------------------------------- */
body{
 position: relative;
}
.pc-only{
 display:block !important;
}

.sp-only{
 display:none !important;
}

h1,H1{
 line-height:0;
}

@media screen and (max-width: 768px){

  .pc-only{
   display:none !important;
  }

  .sp-only{
   display:block !important;
  }

}

.ex-link::after {
  content: '';
  position: absolute;
  background-image: url("/materials/common/img/ex-link.svg");
  background-repeat: no-repeat;
  background-size: contain;
  bottom: 3px;
  right: -14px;
  width: 12px;
  height: 12px;
}

@media screen and (max-width: 768px){
 .ex-link::after {
  display:inline-block;
  position: static;
  margin-left:2px;
  }
}


.ykl-red-color{
 color:#E62334;
}


/* ヘッダー
--------------------------------- */
.p-header{
 width:100%;
 height:80px;
 display: flex;
 justify-content: space-between;
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 background-color: #fff;
 z-index: 20;
 margin-right:auto;
}
@media screen and (max-width: 768px){
 .p-header{
  height:55px;
  flex-wrap: wrap;
  
 }
 .p-header.close{
  flex-wrap: wrap;
  transition: all .3s;
 }
}

.p-header_logos{
 max-width:430px;
 width:auto;
 padding:0 0 0 18px;
}

@media screen and (max-width: 768px){
  .p-header_logos{
   max-width:80%;
   width:auto;
   padding:10px 0 10px 10px;
   display: flex;
   padding-left: 10px;
   height:55px;
  }

}

.p-header_logo{
 display:flex;
 justify-content: space-between;
 align-items: center;
 height:80px;
}

.p-header_logo .yakult-logo{
 margin-right:30px;
}

@media screen and (max-width: 768px){
 .p-header_logo{
  height: auto;
 }
 .p-header_logo .yakult-logo{
  margin-right:8px;
 }

}

.p-header_logos .yakult-logo{
 max-width:146px;
 width:100%;
}

@media screen and (max-width: 768px){
.p-header_logos .yakult-logo{
  max-width:96px;
 }
}

.p-header_logos .text-logo{
 max-width:272px;
 width:100%;
}

@media screen and (max-width: 768px){
 .p-header_logos .text-logo{
  max-width:178px;
 }
}


.p-header_links{
 margin-left: auto;
}
@media screen and (max-width: 768px){
 .p-header_links{
  display:none;
  width: 100%;
  padding: 0 15px;
  background:#FFF;
 }
 .p-header_links.close{
  background:#FFF;
  /* max-height: 100vh; */
  overflow-y: auto;
  padding: 0 15px;
  text-align: center;
  /* margin-top: 4px;*/
   margin-top: 0;
  border-top:1px solid #DDDDDD;
 }
 .p-header_links.close:after{
  content:"";
  display:block;
  padding-bottom: 0;
 }

}

.p-header_nav ul{
 display: flex;
 align-items: center;
 text-align:center;
 font-size:16px;
 font-weight:bold;
 height:80px;
 justify-content:center;
}
@media screen and (max-width: 768px){
 .p-header_nav ul{
  font-size:14px;
  transition: all .3s;
  background:#FFF;
  }
}
.p-header_nav ul li {
 margin-right:50px;
 height: 100%;
 display: flex;
 align-items: center;
}
@media screen and (max-width: 1300px){
.p-header_nav ul{
 margin-right:30px;
}
.p-header_nav ul li {
 margin-right:10%;
 max-width: 100px;
 flex-shrink: 0;
 }

}

@media screen and (max-width: 768px){
.p-header_nav ul li {
 margin-right:0;
 max-width: initial;
 width:100%;
 padding:30px 0;
 border-bottom: 1px solid #DDDDDD;
 position:relative;
 }
 
 .p-header_nav ul li:after {
  content:url(/materials/common/img/sp_arrow.svg);
  position: absolute;
  right: 0;
 }
 .p-header_nav ul li:last-child{
  border-bottom:none;
 }
}
.p-header_nav ul li a{
 height: 100%;
 display: flex;
 align-items: center;
 position: relative;

}

@media screen and (max-width: 768px){
 .p-header_nav ul li a{
  height: 100%;
 display: block;
 width: 100%;
 /* padding: 20px 0; */
 text-align: left;
 }

}


@media screen and (min-width: 1300px){
 .pc-br{
  display:block;
 }

}


.p-header_nav ul li a:hover {
  text-decoration: none;
  color: #f95a6f;
}

  .p-header_nav ul li a:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -100%;
    width: 100%;
    height: 3px;
    background-color: #f95a6f;
    -webkit-transition: 300ms ease-out;
    transition: 300ms ease-out;
    -webkit-animation: navLink-off 300ms forwards;
            animation: navLink-off 300ms forwards;
    opacity: 0 !important;
  }
  

  .p-header_nav ul li a:hover:before {
    -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-animation: navLink-on 300ms forwards;
            animation: navLink-on 300ms forwards;
     opacity: 1 !important;
  }

  .p-header_nav.firstview.inview ul li a:before {
    opacity: 1 !important;
  }



@media screen and (max-width: 768px){
 .p-header_nav ul li a:before{
  content:none;
 }

}

@-webkit-keyframes navLink-off {
  0% {
    opacity: 1;
    left: 0;
  }
  99% {
    opacity: 1;
    left: 100%;
  }
  100% {
    opacity: 0;
    left: 100%;
  }
}

@keyframes navLink-off {
  0% {
    opacity: 1;
    left: 0;
  }
  99% {
    opacity: 1;
    left: 100%;
  }
  100% {
    opacity: 0;
    left: 100%;
  }
}

@-webkit-keyframes navLink-on {
  0% {
    left: -100%;
  }
  100% {
    left: 0;
  }
}

@keyframes navLink-on {
  0% {
    left: -100%;
  }
  100% {
    left: 0;
  }
}



.p-header .button_sp{
 display:none;
}



@media screen and (max-width: 768px){
  .p-header .button_sp{
   display:block;
   width:50px;
   position: relative;
   z-index: 21;
  }
  .p-header .button_sp span{
   position: absolute;
    display: inline-block;
    -webkit-transition: all .4s;
    transition: all .4s;
    left: 18px;
    height: 2px;
    background: #E83847;
    width: 55px;
  }
  .p-header .button_sp span:nth-of-type(1) {
    top: 21px;
    left: 16px;
    width:20px;
    
  }
  .p-header .button_sp span:nth-of-type(2) {
    top: 27px;
    left: 16px;
    width:20px;
  }
  .p-header .button_sp span:nth-of-type(3) {
    top: 34px;
    left: 16px;
    width:20px;
  }
  .p-header .button_sp.close span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    -webkit-transform: translateY(6px) rotate(-45deg);
            transform: translateY(6px) rotate(-45deg);
    width: 35%;
  }
  .p-header .button_sp.close span:nth-of-type(2) {
    opacity: 0;
  }
  .p-header .button_sp.close span:nth-of-type(3) {
    top: 30px;
    left: 18px;
    -webkit-transform: translateY(-6px) rotate(45deg);
            transform: translateY(-6px) rotate(45deg);
    width: 35%;
  }
  
  /* 
  .header-megadrop-menu {
    -webkit-transform: translateX(100vw);
            transform: translateX(100vw);
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    position: fixed;
    top: 55px;
    right: 0;
    z-index: 1;
  }
  .header-megadrop-menu.close {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  */
  
  .sp_only_nav{
   display:none;
   width:100%;
  }
  .sp_only_nav.close{
   display:block;
   width:100%;
  }
  .p-header_nav ul{
   flex-direction: column;
    width: 100%;
    height: 100%;
   margin-bottom:0;
   
  }
  .sp-only.button_long{
    display:flex !important;
    justify-content: center;
    align-items: center;
    margin-bottom:10px;
    padding:0 20px;
    font-size:16px;
    font-weight:700;
    height:56px;
  }
  .sp-only.button_long.button_entry_long{
   background:url(/materials/common/img/button_entry_long.svg);
   background-repeat: no-repeat;
   background-size:contain;
   background-position: center;
   color:#FBF6EC;
   margin-left:10px;
   margin-right:10px;
  }
  .sp-only.button_long.button_entry_long img{
   width:30px;
   height:auto;
   margin-right:9px;
   padding:14px 0;
  }
  .sp-only.button_long.button_doc_long{
   background:url(/materials/common/img/button_doc_long.svg);
   background-repeat: no-repeat;
   background-size:contain;
   background-position: center;
   color:#E62334;
   margin-left:10px;
   margin-right:10px;
  }
  .sp-only.button_long.button_doc_long img{
   width:28px;
   height:auto;
   margin-right:9px;
   padding:11px 0;
  }

}

/* フッター
--------------------------------- */
.p-footer{
 width:100%;
}

.p-footer_banners{
 display:flex;
 max-width:980px;
 margin:auto;
 padding:30px 0;
}
@media screen and (max-width: 768px){
 .p-footer_banners{
  flex-wrap:wrap;
  padding: 15px 15px 0;
 }
}

.p-footer_links{
 width:100%;
 background:#FBF6EC;
 padding:40px 0 45px;
}

@media screen and (max-width: 768px){
 .p-footer_links{
  padding:0 0 20px;
  }
}

.p-footer_banners .p-footer_banner{
 margin-right:28px;
}
.p-footer_banners .p-footer_banner:last-child{
 margin-right:0;
}
@media screen and (max-width: 768px){
.p-footer_banners .p-footer_banner{
  margin-right:0;
  width: calc((100% - 15px) / 2);
  margin-bottom:15px;
 }
 .p-footer_banners .p-footer_banner:nth-of-type(odd){
  margin-right:15px;
 }
}

/* 応募する・保育園を探す
----------------------------- */
.p-footer_jobs{
 width:100%;
 background-color:#E62334;
 background-image:
 url(/materials/common/img/p-footer_jobs_l.png),
 url(/materials/common/img/p-footer_jobs_r.png)
 ;
 background-position:center left,center right;
 background-repeat: repeat-y;
 padding:60px 0;
}
@media screen and (max-width: 768px){
 .p-footer_jobs{
  padding: 55px 0;
  background-size: 50%;
  background-position: -109px 59px,159% 47px;
 }
}
.p-footer_job{
 color:#fff;
 margin:0 auto 35px;
 max-width:980px;
 width:100%;
 text-align:center;
}
@media screen and (max-width: 768px){
 .p-footer_job{
  padding:0 26px 26px;
  margin: 0 auto ;
  font-size:14px;
 }
}

.p-footer_job_h3{
 font-size:20px;
 font-weight:bold;
 margin-bottom:10px;
}
@media screen and (max-width: 768px){
 .p-footer_job_h3{
  font-size:18px;
  text-shadow: 0px 0px 8px #e62334;
 }
}
.p-footer_job a{
 color:#fff;
 text-decoration: underline;
 transition: all .3s;
}

.p-footer_job a:hover{
 opacity:0.5;
 transition: all .3s;
}


.p-footer_job.job_botton{
 display:flex;
 max-width:860px;
 justify-content: space-between;
 margin-bottom:0;
}

@media screen and (max-width: 768px){
 .p-footer_job.job_botton{
  display:block;
  padding:0 26px;
 }
}

.p-footer_job.job_botton a{
 display:flex;
 color:#E62334;
 background:#fff;
 max-width:420px;
 width: 100%;
 padding:20px;
 transform: skewX(-15deg);
 align-items: center;
 justify-content: center;
 transition: all .3s;
 text-decoration: none;
}

@media screen and (max-width: 768px){
 .p-footer_job.job_botton a{
   max-width:initial;
   padding:14px;
   margin-bottom:20px;
  }
  .p-footer_job.job_botton a:last-child{
   margin-bottom:0;
   padding:11px;
  }
}

.p-footer_job.job_botton a:hover{
 opacity:0.5;
 transition: all .3s;
}
.p-footer_job.job_botton a span{
 display: flex;
 align-items: center;
 justify-content: center;
 transform: skewX(15deg);
 font-weight: 700;
 font-size: 20px;
 line-height:1;
}

@media screen and (max-width: 768px){
 .p-footer_job.job_botton a span{
  font-size: 16px;
 }
}

.p-footer_job.job_botton a span img{
 margin-right:20px;
}
@media screen and (max-width: 768px){
 .p-footer_job.job_botton a span img{
  margin-right:12px;
 }
 .p-footer_job.job_botton a span img.job_entry{
  max-width:36px;
 }
 .p-footer_job.job_botton a span img.job_search{
  max-width:42px;
 }
}

/* フッターリンク
----------------------------- */
.p-footer_link{
 max-width:1000px;
 width:100%;
 margin:auto;
 display:flex;
}



.p-footer_link_logo{
 max-width:335px;
 width:100%;
}

.p-footer_link_logo .logo{
 max-width:190px;
}

.p-footer_link_logo .logo-text{
 max-width:235px;
 margin-top:22px;
}
@media screen and (max-width: 768px){
 .p-footer_link_logo .logo-text{
  margin-top:0;
 }

}

.p-footer_recruit{
 padding-left:0;
}


@media screen and (max-width: 768px){
 .p-footer_recruit{
  order:1;
  /* background: #fff; */
  border-bottom: 1px solid #E1E1E1;
  text-align:center;
  padding:20px 0;
  line-height: 1;
 }
 .p-footer_recruit a{
  display: inline-block;
 }

}

.p-footer_recruit-banner{
 max-width:160px;
}
.p-footer_recruit a{
 transition:0.3s all;
}
.p-footer_recruit a:hover{
 opacity:0.5;
 transition:0.3s all;
}

@media screen and (max-width: 768px){
 .p-footer_link{
  max-width:initial;
  flex-direction: column;
 }
 .p-footer_link_logo{
   max-width:initial;
   order: 3;
  }
  .p-footer_link_logo img{
   max-width:140px;
   margin: auto;
   padding-top:24px;
  }
}

.p-footer_link_menu_l,
.p-footer_link_menu_m,
.p-footer_link_menu_r
{
 /* max-width:144px;
 width:100%; */
 padding-right:60px;
 font-size:14px;
}
.p-footer_link_menu_l li,
.p-footer_link_menu_m li,
.p-footer_link_menu_r li
{
 padding-bottom:29px;
}

@media screen and (max-width: 768px){
   .p-footer_link_menu_l,
   .p-footer_link_menu_m,
   .p-footer_link_menu_r
   {
    max-width:initial;
    padding-right:0;
    order:2;
   }
   .p-footer_link_menu_l ul,
   .p-footer_link_menu_m ul,
   .p-footer_link_menu_r ul
   {
    display:flex;
    flex-wrap:wrap;
    width:100%;
   }
   .p-footer_link_menu_l li,
   .p-footer_link_menu_m li,
   .p-footer_link_menu_r li
   {
    width:50%;
    padding:16px;
    border-bottom:1px solid #E1E1E1;
    display: flex;
    align-items: center;
   }
   .p-footer_link_menu_l li:nth-of-type(odd),
   .p-footer_link_menu_m li:nth-of-type(odd),
   .p-footer_link_menu_r li:nth-of-type(odd)
   {
    
    border-right:1px solid #E1E1E1;
   }


}


.p-footer_link_menu_l a,
.p-footer_link_menu_m a,
.p-footer_link_menu_r a
{
 color:#323232;
 font-weight:500;
 position:relative;
}
.p-footer_link_menu_l a:hover,
.p-footer_link_menu_m a:hover,
.p-footer_link_menu_r a:hover
{
 color: #f95a6f;
}




.p-footer_copyright{
 background:#222222;
 color:#fff;
 text-align:center;
 line-height:initial;
 font-size:10px;
 padding:3px 0;
}

/* TOPへボタン
--------------------------------- */
.p-toTopBtn{
 display:none;
 max-width:50px;
 max-height:50px;
 z-index: 10;
 position: fixed;
 bottom: 10%;
 right: 10px;
 cursor: pointer;
}




/*  共通
---------------------------------------- */

/* 共通ボタン形状------------------ */

.std_btn a{
 display: block;
 color: #fff;
 font-size:10px;
 background: #E62334;
 max-width: 380px;
 width: 100%;
 height:70px;
 padding: 20px;
 position:relative;
 margin: auto;
 border-radius: 50px
}
@media screen and (max-width: 768px){
 .std_btn a{
  max-width: 305px;
  font-size:16px;
  height:56px;
  line-height: 1;
 }
}

.std_btn a::after{
 content: url(/materials/common/img/btn_arrow.svg);
 position: absolute;
 right: 20px;
 top: 42%;
}

.std_btn a:hover{
 opacity:0.5;
}

.std_btn a .text{
 display: flex;
 align-items: center;
 justify-content: center;
 font-weight: 700;
 font-size: 20px;
}

@media screen and (max-width: 768px){
 .std_btn a .text{
  font-size: 16px;
 }
}

/* TOP H2 ------------------ */
h2,h2 img{
 display:block;
 margin:auto;
}

/* ぱんくず
 ------------------ */
.pankuzu{
  font-weight: normal;
  display:flex;
  font-size:14px;
  max-width:980px;
  margin:auto;
  padding:20px 0 20px 0;
}
.pankuzu-slash{
 margin: 0 8px;
}
@media screen and (max-width: 768px){

.pankuzu{
  max-width:initial;
  padding:10px 0 15px;
 }

}

/* ヘッダー追加 */
#hoiku_menu{
 display:block;
 position:relative;
}
#hoiku_menu a{
 justify-content:center;
 padding:0 20px;
}
#hoiku_menu .hoiku_menu_child{
 display:none;
 transition: all .3s;
}
@media screen and (min-width: 769px){
  #hoiku_menu:hover .hoiku_menu_child{
     display: block;
     background: #fff;
     transition: all .3s;
     position:absolute;
     left: calc(50% - (170px / 2));
  }
}

#hoiku_menu .hoiku_menu_child a{
 display:block;
 padding:20px 20px;
 transition: all .3s;
 width:170px;
}
#hoiku_menu .hoiku_menu_child a:first-child{
 border-bottom:1px solid #ccc;
}
#hoiku_menu .hoiku_menu_child a:before{
 content:none;
}

@media screen and (max-width: 768px){
  #hoiku_menu .hoiku_menu_child a:first-child{
   border-bottom:none;
  }
  .p-header_nav ul li#hoiku_menu a:hover{
   color:#3C3C3C;
  }
  .p-header_nav ul li#hoiku_menu{
   padding:0;
  }
  .p-header_nav ul li#hoiku_menu:after{
   content:none;
  }
  #hoiku_menu > a{
   padding:20px;
   position:relative;
  }
  #hoiku_menu > a:before{
   transform: rotate(0deg);
    right: 20px;
    opacity:1 !important;
    animation: none;
    left: initial;
  }
  #hoiku_menu > a:after {
    transform: rotate(90deg);
    right: 20px;
    transition: .5s;
  }
  #hoiku_menu > a.close:after {
    transform: rotate(0deg);
  }
  
  #hoiku_menu > a:before, #hoiku_menu > a:after {
    position: absolute;
    content: '';
    width: 15px;
    height: 2px;
    background-color: #E62334;
    top: 50%;
  }
  
  #hoiku_menu > div{
   display: none;
  }
  
  #hoiku_menu .hoiku_menu_child {
    display:block;
    position:static;
    transition:unset;
  }
  
  #hoiku_menu .hoiku_menu_child a{
   width:100%;
   border-top: 1px solid #E62334;
   transition:unset;
   position:relative;
   text-indent: 14px;
  }
  #hoiku_menu .hoiku_menu_child a:before{
   animation: none;
   content: "";
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: #E62334;
   position: absolute;
   opacity: 1 !important;
   left: 16px;
   top: calc(50% - 3px);
  }
}