@charset "utf-8";
/*-------------------header_eara------------------------*/


.top_topi{
  background:#D2D5DB ;
  text-align: center;
 padding: 7px 0;
 font-size: 14px;
}

.h_menu{
  padding:0 3%;
}

.menu{
    align-items: baseline;
}
.navIn01{
  width: 70%;
  margin-left: 3%;
}
.navIn01 .h_menu:first-child{
  padding:0;
}
.navIn01 .en a{
  font-size: 18px;
}
.navIn02{
  width: 20%;
  margin-right: 3%;

    align-items: center;
}
.navIn02 img {
 padding: 0 0px;
}
 .navIn02 li{
    margin-right: 5px;
}
.navIn02 .insta_ico img{
width: 15px;
}
.navIn02 .fb_ico img{
width: 15px;
height: 16px;
}
.navIn02 .youtube_ico img{
width: 15px;
}
.navIn01, .navIn02{
  padding: 19px 0;
}
.en a{
  font-family: 'Poppins', sans-serif;
}
.navIn02 .sns{
margin-bottom: 5px;
}

#header_bx {
  /* position: fixed;   */
  top: 0;           
  left: 0;          
  width: 100%;     
  z-index: 999;     
  background-color: #fff; 
  box-shadow: 0 2px 5px rgba(0,0,0,0.1); 
}

@media (max-width:1100px) {
  .h_menu{
    padding:0 2%;
  }
  .navIn01 .en a {
    font-size: 16px;
  }
}
@media (max-width:1000px) {
  .navIn01{
    width: 69%;
    margin-left: 1%;
  }
  .h_menu{
    padding:0 1%;
  }
  .navIn02{
    width: 29%;
    margin-right: 1%;
  }
}

.viewmore{
    width: 100px;
    margin-top: 15px;
}
/*-------------------header_eara_END------------------------*/


/*-------------------top------------------------*/
/* 
main{
  margin-top: 100px;
} */

.news_box{
    width: 70px;
    background-color: #000;
    padding: 2px 5px 3px;
    text-align: center;
    margin-right: 15px;
}
.news_txt .tit_span{
  margin-left: 5px;
      padding-bottom: 3px;
}
.news_txt .dmy{
    margin: 0 14px 0 0px;
}
.news_txt a{
  text-decoration: underline;
}
.top_p{
    justify-content: flex-start;
align-items: flex-end;
}
.top_p .en{
  width: 365px;
  margin-right: 20px;
}
.fnt10{
  font-size: 10px;
}
.fnt22{
  font-size: 22px;
}
.mgt15{
  margin-top: 15px;
}
.border_b{
  border-bottom: 1px solid ;
}
.inline_b{
  display: inline-block;
}
.white_line{
background: #fff;
padding: 16px 40px;
  position: absolute;
  top: 5%;
  right: 0;
}
.posi_rela{
 position: relative;
}

.has_w_b{
  border-left: 2px solid #fff;
  padding-left: 10px;
  margin-bottom: 18px;
}
.top_txt{
    position: absolute;
  bottom: 5%;
  left: 5%;
}
.white_btn{
  border: 1px solid #fff;
  text-align: center;
  padding: 7px 0;
 
}
.width62{ width: 218px;}

/* メインスライダー */
.slider_wrapper {
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}

.slider_track {
  display: flex;
  transition: transform 0.6s ease;
}

.slinder_main {
  min-width: 100%;
  box-sizing: border-box;
  position: relative;
}

.slinder_main img.main_img {
  width: 100%;
  display: block;
}


.slider_dots{
  text-align: center;
  margin-top: 15px;
}
.slider_dots button {
  width: 70px;   
  height: 2px;  
  border-radius: 2px; 
  border: none;
  background: #ccc;
  margin: 0 5px;
  cursor: pointer;
}

.slider_dots button.active {
  background: #333;
}

.slider_dots button.active {
  background: #333;
}
/* メインスライダーEND */



.view_all{
  background: #000;
  text-align: center;
  margin-left: 10px;
  padding: 0px 11px 4px 13px;
  margin-right: 35px;
}
.view_all a,.view_all span{
  line-height: 1em;
}
.view_all span{
  color: #fff;
  display: inline-block;
  font-size: 0.9em;
  margin-left: 4px;
}

.topi_tit .dmy::before {
  content: "";
  display: inline-block;
  width: 15px;    
  height: 1px;     
  background: #000; 
  margin-right: 8px;
   vertical-align: middle;
}
.cate{
  background: #ECEEF2;
  text-align: center;
  display: inline-block;
  line-height: 1em;
  margin: 0 10px;
  padding: 5px 10px;
}

.tit_span{
  font-size: 0.7em;
  vertical-align: middle;
  display: inline-block;
}


.com_b_h1{
  padding-bottom: 20px;
  border-bottom: 1px solid #000;
  display: inline-block;
  font-weight: 800;
}
.com_h2{letter-spacing: 0.1em;}
.mgt40{
  margin-top: 40px;
}
.mgb40{
  margin-bottom: 40px;
}

.com_bg{
    background: #ECEEF2;
     text-align: center;
  display: inline-block;
  line-height: 1em;
  padding: 5px 10px;
font-size: 12px;
position: absolute;
top:0;
left: 5px;
}




/* itemスライダー */

.carousel_slider {
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}

.carousel_track {
  display: flex;
  transition: transform 0.6s ease;
  padding-bottom: 50px;
}

/* PC: 4枚表示 */
.carousel_track li {
  flex: 0 0 25%; /* 100% ÷ 4 */
  list-style: none;
  padding: 0 5px; /* スライド間の余白 */
}

/* タブレット: 3枚表示 */
@media (max-width: 798px) {
  .carousel_track li {
    flex: 0 0 33.3333%;
  }
}

/* スマホ: 2.5枚表示 */
@media (max-width: 498px) {
  .carousel_track li {
    flex: 0 0 calc(100% / 2.5); /* 約40% */
  }
}

.carousel_track img {
  width: 100%;
  display: block;
}

.carousel_slider img {
  display: block;
  width: 100%;
}

/* 矢印 */
.carousel_prev, .carousel_next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  z-index: 10;
}
.carousel_prev { left: 10px; }
.carousel_next { right: 10px; }


.slider_long_dots {
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: center;
}
.slider_long_dots button {
  display: inline-block;
 width: 10%;
  height: 2px;
  margin: 0 0px;
  background: #ccc;
  border: none;
  cursor: pointer;
  vertical-align: middle;
  border-radius: 2px;
}
.slider_long_dots button.active {
  background: #333;
}

/* itemスライダー 　END*/



.has_mgl {
  width: calc(100% - ((100% - 1200px) / 2));
  margin-left: calc((100% - 1200px) / 2);
}

@media screen and (max-width: 1250px) {
  .as_mgl {
    margin-left: 5%; 
  }
}

.center_btn{

  text-align: center;
}
 .btn_style{
  display: inline-block;
  width: 267px;
}
.black_btn{
  background-color: #000;
  text-align: center;
padding: 6px 0 7px;
}
.black_btn a{
  color: #fff;
}

.jp_font_style{
  line-height: 2.2em;
  letter-spacing: 0.07em;
}

.en.font_b{
  font-weight: 500;
}
.btn_style.has_pd_btn{
 padding: 9px 0 10px;
}



.event .item_tit{
  line-height: 1.5em;
  letter-spacing: 0.01em;
}
.day_mark{
  background: #ECEEF2;
  text-align: center;
  display: inline-block;
  line-height: 1em;
  padding: 5px 10px;
  font-size: 12px;
}
.day_txt{display: inline-block;margin: 0px 8px;font-size: 14px;}
.event .com_bg{
  left:0;
}

.blackline_btn{
  border: 1px solid #000;
  text-align: center;
  padding: 7px 0;
}

.google_btn img{
  width: 23px;
  display: inline-block;
  vertical-align: middle;
  padding: 0 0 4px 0px;
  margin-right: 6px;
}
.event .black_btn {
  padding: 8px 0 9px;
}


.top_serv{
  width: 60%;
  margin: 20px auto 40px ;
}

@media (max-width:1100px) {
.top_serv{
  width: 80%;
}
}
@media (max-width: 950px) {

}

.bg_pd{
  padding: 30px;
}

.carousel-item{
  position: relative;
}


.carousel-item .bg_gray{
  position: absolute;
  bottom:-50px;
    text-align: left;

    width: 330px;
    right: -30px;
}
/* 
.carousel {
  position: relative;
  width: 70%;
  margin: 0 auto;
  perspective: 1000px;
  height: 900px;
}

.carousel-item {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2em;
  transition: all 0.5s ease;
  border-radius: 10px;
  z-index: 1;
}

.carousel-item.center {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  z-index: 3;
}

.carousel-item.left {
  transform: translate(-120%, -50%) scale(0.8);
  opacity: 0.7;
  z-index: 2;
}

.carousel-item.right {
  transform: translate(30%, -50%) scale(0.8);
  opacity: 0.7;
  z-index: 2;
} */

.carousel {
  position: relative;
  width: 70%;
  margin: 0 auto;
  perspective: 1000px;
  height: 900px;
}

.carousel-item {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2em;
  transform: translate(-50%, -50%) scale(0.7);
  opacity: 0.5;
  transition: all 0.5s ease;
  border-radius: 10px;
  z-index: 1;
}

.carousel-item.center {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  z-index: 3;
}

.carousel-item.left {
  transform: translate(-120%, -50%) scale(0.8);
  opacity: 0.7;
  z-index: 2;
}

.carousel-item.right {
  transform: translate(30%, -50%) scale(0.8);
  opacity: 0.7;
  z-index: 2;
}
.tab-button{
  color: #999;
}
.carousel-buttons {
  display: flex;
  justify-content: center;
  margin-top: 50px;
  list-style: none;
  gap: 30px;
  
}

.carousel-buttons li.active {
  font-weight: bold;
  color: rgb(13, 13, 13);
}

@media (max-width:498px) {
  .bg_pd{
    padding: 15px 10px;
  }
  .viewmore {
    width: 80px;
  }
  .carousel-item .mgt15 {
    margin-top: 5px;
    font-size: 12px;
}
.carousel-buttons li{
  text-align: center;
}
}


.logo_wrap {
  position: relative;
}

.combg_img {
  display: block;
  width: 100%; 
  height: auto;
}


.sdgs_li{
    margin-top: -60px;
}
.sdga_ul{
      align-items: center;
}
.sdgs_img img{
  width: 80%;
  margin: 0 auto;
}
.center_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 280px;

}
.left_logo{
   position: absolute;
  bottom: 15%;
  right: 5%; 
      width: 185px;
}
.company_btn{
  position: absolute;
  bottom: 5%;
  right: 5%;
  padding: 8px 50px;
  letter-spacing: 0.1em;
}
@media (min-width:1800px) {
.company_btn {
  right: 13%;
}
}

/*-------------------top_END------------------------*/




/*-------------------SUB page COMMON------------------------*/

.sub_com_h1{
padding-bottom: 0px;
    padding-top: 70px;
    letter-spacing: 0.05em;
    font-weight: 500;
    font-size: 80px;
    line-height: 1em;
} 

.ja_com_h2{    font-size: 12px; margin-top: 25px;
    position: relative;
padding-left: 20px;
    margin-left: 10px;
}
.ja_com_h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 10px;       
    height: 1px;       
    background: #000000; 
    transform: translateY(-50%);
}

.ja_has_b_tit{
  font-size: 12px;
font-weight: 500;
border-bottom: 1px solid #ECEEF2;
letter-spacing: 0.15em;
line-height: 2em;
padding-bottom: 6px;
}

.about_eara .company_label{
  line-height: 1.5em;
}
.pan_nav p ,.pan_nav a {
  letter-spacing: 0.1em;
}
.pan_nav span{
  font-size: 0.5em;
  padding: 0 5px;
}

/*-------------------SUB page COMMON END------------------------*/

/*------------------abouty page------------------------*/

.id_nav ul{
  border-bottom: 1px solid;
gap: 35px;
    padding-bottom: 17px;
    margin-bottom: 30px;
}
.id_nav ul li a{
  font-size: 20px;
  letter-spacing: 0.1em;
  font-weight: 500;
}
.id_nav ul li span{
  font-size: 0.5em;
}
.up_ja{
  display: block;
  font-size:12px;
    margin-bottom: 4px;
}
.com_about_tit{
  font-size:40px ;

    line-height: 1em;
}
.width30{
   width: 30%;
}
.width70{
   width: 70%;
}
.fnt35{
  font-size: 35px;
}
.width50{
   width: 50%;
}
.pre_img{
  width:235px;
  margin-top: 100px;
}
.common_aboutsec .common_inner{
  border-bottom: 1px solid #D2D5DC;
  padding-bottom: 100px;
  margin-bottom: 100px;
}

#concept{
  background: url(../img/his_bg.png) no-repeat;
      background-size: contain;
}
 .no {
    font-size: 60px;
    vertical-align: middle;
    padding-right: 23px;
    letter-spacing: -0.01em;
    font-weight: 500;
}
@media screen and (max-width: 1100px) {
.no{
  font-size: 50px;
}
}
.pdt100{
  padding-top: 100px;
}
@media screen and (max-width:  798px) {
.pdt100{
  padding-top: 50px;
}
#concept p{
    letter-spacing: 0.1em;
}
}



.timeline {
  display: flex;
  flex-direction: column;
  gap: 40px; /* 各項目の間隔 */
  position: relative;
}

.timeline-item {
  display: grid;
      grid-template-columns: 130px 60px 1fr;

  align-items: flex-start;
  position: relative;
}

.timeline-year {
  font-weight: 500;
  font-size: 30px;
  padding-top: 4px;font-family: 'Poppins', sans-serif;
}

.timeline-point {
  width: 10px;
  height: 10px;
  background: #000;
  border-radius: 50%;
  margin: 0 auto;
  position: relative;
  top: 10px;
}

/* ● の縦線（上下を自動で伸ばす） */
.timeline-point::before,
.timeline-point::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 1px;
  background: #000;
  transform: translateX(-50%);
}

/* 上へ伸びる線 */
.timeline-item:not(:first-child) .timeline-point::before {
  top: -42px;  /* gap と同じ値にするとキレイに繋がる */
  height: 40px;
}

/* 下へ伸びる線 */
.timeline-item:not(:last-child) .timeline-point::after {
    top: 7px;
    height: 185px;
}
/* .timeline-item:last-child .timeline-point::after {
    top: 7px;
    height: 55px;
} */
.timeline-content {
  font-size: 16px;
     line-height: 1.7;
    padding: 28px 0;
        border-bottom: 1px solid #eee;
}


.width368{
  width: 368px;
}

/*------------------about page END------------------------*/

.border{
  border: 1px solid;
}
.radi{
  border-radius: 10px;
}
.pd_radi{
  padding: 20px;
}

/*------------------service------------------*/

.has_b_b{
border-bottom: 1px solid;
}

.more-text {
  display: none;
}

.more-text.is-open {
  display: inline;
}

/* ボタンの見た目はお好みで */
.more-toggle {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}

.youtube_box{

}

/*------------------service------------------*/


/*-----shop-----*/
/* タブボタン */
.tabs button {
  padding: 10px 20px;
  cursor: pointer;
  border: none;
  margin-right: 5px;
}
.tabs button.active {
  text-decoration: underline;
}

/* タブコンテンツ */
.tabcontent {
  display: none;
  margin-top: 20px;
}
.tabcontent.active {
  display: block;
}

/* 店舗リスト */
.store-detail{
  padding-bottom: 100px;
}
.store {
  display: flex;
  gap: 24px;
  align-items:center;
  margin-bottom: 40px;

}

/* 左：店舗名（30%） */
.store-name {
  width: 30%;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.3;
  /* 上中央にしたいときは align-items を変更/追加 */
}

/* 右：70%（縦に上段/下段） */
.store-right {
  width: 70%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* 上段：写真＋住所等を横並びに */
.store-top {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

/* 写真 */
.store-photo {
  flex: 0 0 95px; /* 固定幅にする場合 */
}
.store-photo img {
  width: 100%;
  height: auto;
  display: block;
}

/* メタ情報（住所・TELなど） */
.store-meta {
  flex: 1; /* 残り幅を使う */
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.address {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.gmap-icon {
  width: 119px;
  height: 20px;
  display: inline-block;
}
.tel, .hours, .closed-day ,.hours span{
  margin: 0;
    letter-spacing: 0.1em;

}
.store-desc p{
  font-size: 14px;
}

/* 下段：説明は store-right の幅いっぱいに広がる */
.store-desc p {
  margin: 0 0 10px 0;
  line-height: 1.7;
}
.tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.tag {
  display: inline-block;
  padding: 7px 40px;
  border: 1px solid #ccc;
  font-size: 0.85rem;
  border-radius: 4px;
}
.tabs button::after {
  content: "▶︎";
  margin-left: 6px;
  font-size: 0.8em; /* ← ここで大きさを変える */
  color: #000000;
  display: inline-block;
}
.shopeara{
width: 106px;
  display: inline-block;
}
.tel a{
  text-decoration: underline;
}
.tabs{
  display: flex;
  align-items: center;
}
.tab_box {
border-top: 1px solid #000;
padding-top: 50px;
padding-bottom: 100px;
}
.erea_tit{
  font-size: 35px;
  font-weight: 500;
  padding-top: 30px;
  padding-bottom: 60px;
}
/* モバイル対応（小さい画面では縦並び） */
@media (max-width: 768px) {
  .store {
    flex-direction: column;
  }
  .store-name {
    width: 100%;
    margin-bottom: 8px;
  }
  .store-right {
    width: 100%;
  }
  .store-top {
    flex-direction: column;
  }
  .store-photo {
    width: 100%;
    flex: none;
  }
  .store-photo img { max-width: 400px; }
}

/*------------------リクルート page ------------------------*/
.mgb20 {
    margin-bottom: 20px;
}

.staff-wrap {
  gap: 10px; 
      justify-content: flex-start;
      margin-top: 30px;

}

.staff-wrap img {
  width: calc((100% - 30px) / 4); 
  height: auto;
  object-fit: cover; 
  flex-shrink: 0;   
}
.width263{
  width: 263px;
  
}
.width403{
  width: 403px;
}
.youtube-wrap{
   gap: 30px; 
      justify-content: flex-start;
}
 .youtube-wrap p {
  width: calc((100% - 60px) / 3); 
  height: auto;
  object-fit: cover; 
  flex-shrink: 0;   
}


 .youtube-wrap p  span{
    background: #EBEEF1;
    color: #9F9FA0;
    padding: 6px 11px;
    display: inline-block;
    margin-right: 7px;
}

@media (max-width: 798px) {
.youtube-wrap{
   gap: 15px; 
      justify-content: flex-start;
}
 .youtube-wrap p {
  width: calc((100% - 30px) / 3); 
  height: auto;
  object-fit: cover; 
  flex-shrink: 0;   
}
.youtube-wrap p span {
    display: block;
    margin-right: 0px;
    text-align: center;
}
.width403 {
    width: 100%;
}

}
.rec_masse{
background: url(../img/recruit_message.png) no-repeat;
background-size: cover;

}
.fnt62{
  font-size: 62px;
}

 .on_span{
    display: block;
    margin-bottom: 20px;
}
.pdb100{
  padding-bottom: 100px;
}

/*------------------company page ------------------------*/


.txt_abu{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 32%;
}

.flex_txt{
width: 58%;
}
.flex_img{
  width: 38%;
}
@media screen and (min-width: 1600px) {
  .flex_img {
    width: 50%;
    margin-right: -14%;
  }
}
.sub_com_h2{
font-size: 70px;
  font-weight: 600;
  line-height: 1.25em;
}
.flex_img {
  position: relative;   
  display: inline-block; 
}

.flex_img img {
  display: block;   
  max-width: 100%;   
  height: auto;
}

.txt_abu {
  position: absolute;
  bottom: 20px; 
  left: 0;
  right: 0;
  padding: 6px 10px;
  font-size: 12px;
  text-align: center;
  z-index: 2;      
}

.bg_fff {
  background-color: rgba(255,255,255,1); 
}
/* .company-info{
 margin-left: 36%;
} */
/* @media screen and (min-width: 1700px) {.company-info {
  width: 58%;
}
}
@media screen and (max-width: 1699px) {
.company-info{
 margin-left: 30%;
   width: 65%;
}
}
*/
@media screen and (max-width: 1300px) {
.company-info{
 margin-left: 25%;
}
}
@media screen and (max-width: 1200px) {
.company-info{
 margin-left: 20%;
}
}

.company-info {
  display: flex;
  flex-direction: column; 
  gap: 12px; 
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  
}

.info-row {
  display: flex;   
border-bottom: 1px solid #D2D5DC;
  padding-bottom: 50px;
  margin-bottom: 50px;align-items: baseline;
}

.company_label {
  width: 250px;      
letter-spacing: 0.1em;
 font-weight: 500;
}

.company_value {
  flex: 1;    
    font-weight: 500;
  letter-spacing: 0.2em;
line-height: 1.5em;
}
.company_value .com_eara{display: block;
   font-weight: 500;
letter-spacing: 0.18em;
  letter-spacing: 0.2em;
line-height: 1.5em;}
.com_eara::before {
  content: "- "; 
}
.company_value a{
  text-decoration: underline;
   font-family: 'Noto Sans JP', sans-serif;
/* 
  color: #626771; */
   font-weight: 500;letter-spacing: 0.18em;
}
.company_value p {
  padding-left: 35px;
}

.line_btn {
  border: 1px solid #000;
  text-align: center;
  padding: 7px 0;
}

.line_btn img {
  width: 22px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}


/*------------------company page END------------------------*/



/*------------------initiatives------------------*/

.width40{
  width: 40%;
}
.width55{
  width: 55%;
}

.js_btween{
  justify-content: space-between;
}
.sdgs_inc{
  background: url(../img/sdgs_inc.png) no-repeat;
  background-position: center;
  background-size: cover;
  padding-bottom: 100px;
}
.sdgs_black{
  width: 388px;
  margin: 50px auto 100px;
}
.sdgs_span{
padding-bottom: 20px;
}
.sdgs_flex{

}

#qa .info-row{
  border-bottom: none;
  display: flex;
  flex-direction: column;
  margin-bottom: 50px;
  padding-bottom: 30px;

  border-bottom: 1px solid #D2D5DC;
}

#qa .company_label {
  width: 100%;
  margin-bottom: 15px;
  font-weight: 600;
  position: relative; 
  padding-left: 0px; 
  cursor: pointer;
  color: #000;
  margin-left: 29px;
}
#qa .company_value{
    color: #000;
}
#qa .company_label::before {
  content: "—";
  position: absolute;
  left: -26px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: #707070;
}
#qa .company_label::after {
  content: "+";
  position: absolute;
  right: 29px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  transition: transform 0.3s ease;
}

#qa .info-row.active .company_label::after {
  transform: translateY(-50%) rotate(45deg);
}

#qa .company_value {
  max-height: 0;
  overflow: hidden;
  transition:
    max-height 0.4s ease,
    padding 0.3s ease,
    margin 0.3s ease,
    opacity 0.3s ease;
  margin-bottom: 0;
  padding: 0 20px  0 0;
  opacity: 0;
}

#qa .info-row.active .company_value {

  opacity: 1;
}


/*------------------qae END------------------------**/

/*------------------privacy------------------------**/

#privacy .info-row{
  border-bottom: none;
  flex-direction: column;
}


#privacy .company_label{
  width: 100%;
font-size: 28px;
color: #000;
padding-bottom: 20px;
margin-bottom: 50px;
border-bottom: 1px solid #D2D5DC;

  font-weight: 500;
}
#privacy .company_value{
  width: 100%;
    line-height: 1.75em;
margin-bottom: 100px;
  font-weight: 500;
color: #000;
  }
  .has_dot{
    margin-left: 50px;
  }
  
  .has_dot li {
    position: relative;
    margin-bottom: 0.5em;
    font-weight: 500;
    letter-spacing: 0.1em;
  padding-bottom: 3px;
  }
  
  .has_dot li::before {
    content: "•";           
    position: absolute;
    left: -1em;    
    top: 3px;
    color: #000;
    font-size: 12px;
    line-height: 1;
  }
  .company-info-box {
    border-left: 1px solid #000; 
    padding-left: 15px;             
    margin: 20px 3px;                 
  }
  .company_value .company-info-box{
  padding-left: 17px;
}
  .company-info-box p{
    padding-left: 5px;
  }
  
  .has_decimal {
    margin-left: 30px;
}
  .has_decimal  li {
    position: relative;
    margin-bottom: 0.5em;
    list-style: decimal;
    line-height: 1.5em;
    letter-spacing: 0.1em;
    font-weight: 500;
}
.has_decimal .has_dot li{
  list-style: none;
}
#privacy .company_label .pop{
  font-size: 28px;
}
.com_tit{
letter-spacing: 0.15em;
}
#privacy .company_value.last_label{
  margin-bottom: 0;
}
/*------------------privacyEND------------------------**/
/*------------------tandc ------------------------**/

#privacy.tandc .company_label .pop{
  font-size: 32px;
}
 
.tandc .company_label{
  font-weight: 500;
}
.tandc .company_value li{
  font-weight: 500;
}
#privacy.tandc .company_label {
  margin-bottom: 38px;
}
#privacy.tandc .company_value p {
  padding-left: 0px;
}
.font_w_500{
  font-weight: 500;
}
#privacy.tandc .company_value p.company-info-box {
  padding-left: 15px;
}



/*------------------tandc END------------------------**/

/*------------------guide ------------------------**/

.guide_tit{
  margin-bottom: 10px;
  letter-spacing: 0.1em;
}

.has_hifun{
  position: relative;
  margin-left: 17px;
  margin-top: 3px;
  font-weight: 500;
  letter-spacing: 0.1em;
}
.has_hifun::before{
  content: "—";
  position: absolute;
  left: -15px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 8px;
  color: #000;
  font-weight: 900;
}
.guide_txt{
  margin-left: 15px;
  letter-spacing: 0.1em;
  font-weight: 500;
  line-height: 1.75em;
}
.guide_tit.mgt30{
  margin-top: 35px;
}

/*------------------guide END------------------------**/

#legalnotice .has_dot {
  margin-left: 10px;
}



/*-------------------contact_eara------------------------*/

.con_read a{
color: #000;
  text-decoration: underline;
    font-weight: 500;
    letter-spacing: 0.2em;
}
.contact_box{align-items: stretch;
}
.contact_box li{
  padding: 4%;
min-height: 304px;
  border: 1px solid #D2D5DC;
}
@media (max-width:1150px) {
.contact_box li{
  padding: 2%;
  min-height: 260px;
  margin-right: 0%;
}
.contact_box .fnt20{
  font-size: 18px;
}
}
@media (max-width:950px) {
.flex03 li {
  width: 48%;
}
.flex03 li:nth-child(3){
  margin-top: 30px;
}
}
@media (max-width:498px) {
.flex03 li {
  width: 100%;
}
.flex03 li{
  margin-top: 20px;
}
}
.bag{
  width: 50px;
  margin: 20px auto 20px;
}
.pre_img {
  margin-top: 0px;
}

.contact_box li a{
  text-decoration: underline;
  font-size: 12px;
  font-weight: 500;
}
.contact_box li a span{
  font-size: 10px;
  display: inline-block;
  margin-left: 10px;
}
.con_tit a{
  color: #000;
  text-decoration: underline;
  font-weight: 500;
}
.contact_info{
  background: #ECEEF2;
  padding: 15px 20px;
}
.Form .flex {
  justify-content: flex-start;
}


.Form .Form-Item-Label {
  width: 25%;
font-weight: 600;
  padding-left: 10px;
  padding-top: 15px;
  vertical-align: -webkit-baseline-middle;
  display: block;
  margin-right: 15px;
    letter-spacing: 0.1em;
}

.Form .hissu img{
  width: 8px;
  display: inline-block;
     vertical-align: text-top;
  margin-left: 3px;
}

.Form input,
.Form textarea,
.Form select {
  margin-left: 3px;
  padding: 11px 19px 15px;
  font-size: 16px;
  vertical-align: text-top;
  border: 1px solid #aaaaaa;
  border-radius: 10px;
  margin-bottom: 40px;
  vertical-align: unset;
}
.Form select{
    border: 1px solid #000;
}
.Form [type=email],
.Form textarea,.Form select, 
.Form [type=text]{
width: 100%;
}
.width70 {
  width: 70%;
}




.Form .btn input{
  margin-bottom: 100px;
  text-align: center;
  background: #000;
color: #fff;
  border-radius: 0px;
  padding: 10px 75px;
  letter-spacing: 0.1em;
  font-weight: 500;
}


button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  width: 291px;
  height: 63px;
  background: url(../../img/form_sub.png) no-repeat;
  text-indent: -9999px;
  border: 0;
  border-radius: 0;
}


.post-content{
  min-height: 500px;
}
.navigation.pagination {
  margin-top: 40px;
  text-align: center;
}

.nav-links a,
.nav-links span {
  display: inline-block;
  margin: 0 6px;
}
.page-numbers{
  color: #7f7f7f;
}
.page-numbers:hover{
  
}
.current ,.next ,.prev{
color: #000;
}

footer .footer_flex{
align-items: baseline;
}
.footer_flex .logo_eara ,.footer_flex .f_menu{
  width: 50%;
  padding-top: 80px;
  margin-top: 20px;
margin-bottom: 20px;
}
.footer_flex .logo_eara {

padding-bottom: 100px;
  padding-top: 200px;
}
 .logo_flex{
  align-items: center;
  flex-direction: column;
}
footer .logo_img{
  width: 110px;
}
.logo_child{
    margin-top: 4px;
}
 .logo_child a{
letter-spacing: 0.12em;
}
footer.bg_gray{
      background: #D2D5DC;
}
footer .sns_flex img{
  width: 16px;
  height: 16px;
  margin-left: 15px;
}
footer .btn_style {
    display:block;
    width: 380px;
    margin: 30px auto 0;
}
@media (max-width:498px) {
.Form input, .Form textarea, .Form select {
    margin-bottom: 20px;
}
}
.openico{
  width: 20px;
  display: inline-block;
  margin-left: 5px;
  vertical-align: middle;
}
.border_f_t{
  border-top: 1px solid #ECEEF2;
  padding-top: 15px;
}
.border_f_t img{
  width: 64%;
  margin:  0 auto;
}
footer .copy{
  text-align: center;
  margin-top: 13px;
}

.f_guide span{
  display: block;
  margin-left: 30px;
line-height: 1.5em;
}
.f_guide span a{
  letter-spacing: 0.05em;
}
.f_menu .flex li{
  width: 30%;
  font-size: 12px;
  margin-right: 20px;
}

.breadcrumb { font-size: 12px; }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: inline-flex; align-items: center; gap: 6px; }
.breadcrumb-item a { text-decoration: none; color: #333; }
.breadcrumb-item[aria-current="page"] { color: #666; }
.breadcrumb-sep { color: #999; user-select: none; }
@media (max-width:1200px) {
.f_menu .flex {
  justify-content: space-around;
}

.Form .Form-Item-Label {
  font-size: 14px;
}
}

@media (max-width:1100px) {
.flex_txt .fnt28 {
  font-size: 25px;
}
.width30 .fnt30 {
  font-size: 25px;
}
}

@media (max-width:798px) {
  .fnt28 {
    font-size: 20px;
}
.mgb100 {
    margin-bottom: 50px;
}
.fnt62 {
    font-size: 26px;
}
  #form .Form-Item {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 19px;
    padding-bottom: 0;
    flex-wrap: wrap;
  }


  .Form th span {
    margin-right: 5px;
    padding: 3px;
    margin-top: -2px;
  }

  #form .Form input,
  .Form textarea {
    margin-left: 11px;
    padding: 9px 0px 14px 15px;
    font-size: 9px;
    vertical-align: text-top;
    width: 73%;
  }

  #form .Form input.ch_b {
    width: 13px;
    margin-right: 5px;
    font-size: 10px;
    display: inline-block;
  }

  #form .form_text {
    text-align: left;
    font-size: 14px;
    width: 90%;
    margin: 0 auto;
  }

  #form .form_text li {
    font-size: 12px;
  }

  .Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }

  #form .Form input,
  .Form textarea {
    margin-left: 11px;
    padding: 9px 0px 14px 15px;
    font-size: 11px;
    vertical-align: text-top;
    width: 96%;
    margin-bottom: 7px;
  }

  #form [type="submit"] {
    margin-top: 15px;
  }

}
@media only screen and (max-width: 798px) {

  .post-content{
  min-height: 300px;
}

  #header_bx {
    position: fixed;
          top: 0%;
        width: 100%;
        padding: 9px 0;
}
  

  .nav {
    position: fixed;
    right: -350px;
    /* 右から出てくる */
    top: 0;
    width: 300px;
    /* スマホに収まるサイズ */
    height: 100vh;
    padding-top: 15px;
    background-color: #fff;
    transition: all .6s;
    z-index: 200;
    overflow-y: auto;
    /* メニューが多くなったらスクロールできるように */
  }

.nav .navIn01 li:first-child img {
  width: 60px;
}
.nav .navIn01 li{
  padding: 4px 1%;
  border-bottom: 1px solid #ddd;
  padding-bottom: 4px;
  margin-bottom: 10px;
}
.nav .navIn01 li:first-child{
  margin-bottom: 15px;
  border-bottom: none;
}
.navIn01 .en a {
  font-size: 18px;
}
  .hamburger {
    position: absolute;
   right: 10px;
        top: 5px;
    width: 35px;
    height: 38px;
    cursor: pointer;
    z-index: 300;
    background: #fff;
  }

  .nav_list {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .nav_item {
    text-align: center;
    padding: 0 14px;
  }

  .nav_item a {
    display: block;
    padding: 8px 0;
    text-decoration: none;
  }

  .nav_item a:hover {
    background-color: #eee;
  }

  .hamburger_border {
    position: absolute;
    left: 11px;
    width: 21px;
    height: 2px;
    background-color: #333;
    transition: all .6s;
  }

  .hamburger_border_top {
    top: 14px;
  }

  .hamburger_border_center {
    top: 20px;
  }

  .hamburger_border_bottom {
    top: 26px;
  }

  .black_bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: all .6s;
    cursor: pointer;
  }

  .nav-open .nav {
    right: -10px;
  }


  .nav-open .black_bg {
    opacity: .8;
    visibility: visible;
  }

  .nav-open .hamburger_border_top {
    transform: rotate(45deg);
    top: 20px;
  }

  .nav-open .hamburger_border_center {
    width: 0;
    left: 50%;
  }

  .nav-open .hamburger_border_bottom {
    transform: rotate(-45deg);
    top: 20px;
  }

  .mgb40 {
    margin-bottom: 20px;
}

.mgt40 {
    margin-top: 20px;
}
.mgt70 {
  margin-top: 30px;
}
.dmy.fnt14 ,.topi_tit.fnt14{
  font-size: 12px;
}
h1.fnt30 {
  font-size: 24px;
  margin-top: 35px;
}
.com_b_h1 {
  padding-bottom: 13px;
  border-bottom: 1px solid #000;
  display: inline-block;
  font-weight: 800;
}
.topi_tit .dmy::before {
  display: inline-block;
  width: 10px;}


.fnt18 {
  font-size: 16px;
}
.cate {
  margin: 0 5px;
  padding: 3px 7px;
  font-size: 10px;
}
.view_all {
  background: #000;
  text-align: center;
  margin-left: 10px;
  padding: 0px 7px 3px 9px;
  margin-right: 25px;
}

.sp_flex_direction{
  flex-direction: column;
}
.event ul.flex03 li:first-child {
  width: 100%;
  order: 1;
  margin: 0 auto 30px;
}
.event ul.flex03 li:nth-child(2), .event ul.flex03 li:nth-child(3) {
  width: 100%;
  order: 2;
  margin-bottom: 50px;
}
    .sub_com_h1 {
        padding-bottom: 5px;
        padding-top: 5px;
    }
.width30{
  margin-top: 30px;
   width: 100%;
}
.width70{
  margin-top: 30px;
   width: 100%;
}
.fnt35{
  margin-top: 30px;
  font-size: 22px;
}
.width50{
  margin-top: 30px;
   width: 100%;
}
.width55 {
  margin-top: 30px;
    width: 100%;
}

.width40{
  margin-top: 30px;
   width: 100%;
}
.sub_com_h1 {

    font-size: 50px;
  }
.center_logo {
  position: absolute;
  top: 40%;
  width: 140px;
}
.ja_com_h2 {
  margin-bottom: 30px;
}
.id_nav{
  margin-top: 30px;
}
.id_nav ul li a {
  font-size: 14px;
}
.timeline-item {
  grid-template-columns: 60px 60px 1fr;

}
.timeline-content {
  font-size: 14px;
  line-height: 1.5;
  padding: 12px 0;
}
.timeline-year {
  font-size: 20px;
}
.com_about_tit {
  font-size: 30px;
  line-height: 1em;
}
.youtube_box{
  width: 100% !important;
  height: auto !important;
}
 .no {
    font-size: 40px;
  }
  footer .btn_style {
            width: 90%;
}
.online_link{
  margin-bottom: 20px;
  margin-left: 23px;
}
.company_btn {
  position: absolute;
  bottom: 5%;
  right: 8%;
  padding: 0px 30px;
  letter-spacing: 0.1em;
  
}
.company_btn a{
  font-size: 12px;
}

.youtube_box{
    position: relative;
    width: 100%;
    height: auto;
    cursor: pointer;
}
.footer_flex .logo_eara {
  padding-bottom: 100px;
  padding-top: 100px;
}
.footer_flex .logo_eara {
  border-right: none;
  padding-bottom: 0px;
  padding-top: 100px;
}
.footer_flex .logo_eara, .footer_flex .f_menu {
  width: 100%;
  padding-top: 20px;
  margin-top: 0px;
  margin-bottom: 20px;
}
.nav {
  position: fixed;
  right: -350px;
  top: 0;
}
.navIn01 {
  width: 81%;
  margin-left: 5%;
}
.sp_reverse {
    flex-direction: column-reverse;
}
.flex.navIn01 {
  display: block;}
  .h_menu {
    padding: 4px 3%;
    width: 100%;
}
.h_menu img{
  width: 90px;
}
.navIn02 {
  width: 100%;}
  .navIn02 img.menber_img {
    padding: 0 5px;
    width: 126px;
    margin-top: 10px;
    margin-right: 0;
}
.navIn02 li:nth-child(2){
  width: 28px;
}
.navIn02 li:nth-child(3){
  width: 14px;
}
.nav-open .nav {
  flex-direction: column;
          justify-content: flex-start;
}
.navIn02 {width: 86%;
        align-items: anchor-center;
        justify-content: center;
}
.navIn02 .h_menu {
  padding: 4px 3%;
  width: 47%;
}
main {
    margin-top: 72px;
}
.top_p .en {
    width: 65%;
    margin-right: 20px;
}
.ja_has_b_tit {
  font-size: 20px;}
  .company-info {
    margin-left: 0;
}

.top_about .fnt22 {
    font-size: 16px;
    line-height: 1.5em;
}
#history .width30 {
    margin-top: 0px;
  }
  .flex li.width70 .fnt35 {
    margin-top: 0px;
  }
.company_label {
  width: 120px;
  font-size: 14px;
  font-weight: 500;
}
.company_value {
  font-size: 14px;
}
.common_aboutsec .common_inner {
  border-bottom: 1px solid #D2D5DC;
  padding-bottom: 30px;
  margin-bottom: 30px;
}
.info-row {
  padding-bottom: 25px;
  margin-bottom: 25px;}
  .en_no.fnt30 {
    font-size: 24px;}
    .tab-button {
      cursor: pointer;
      padding: 10px 4px;
}
.tab-content img {
  margin: 25px auto;
}
.mgt80 {
  margin-top: 50px;
}
.sub_com_h1 {
padding-bottom: 5px;
    padding-top: 26px;
}
.letter_s012 {
  letter-spacing: 0.12em;
  padding-bottom: 50px;
}
.sub_com_h2
 {
    font-size: 45px;}
    .flex_txt {
      width: 47%;
  }
  .flex_img {
    width: 51%;
}
.mgb50 {
  margin-bottom: 30px;
}
.txt_abu {
  width: 39%;
}
.flex_txt .fnt28 {
  font-size: 22px;
}

/* sp */

/* 最新のsafari用*/

  ::-webkit-full-page-media, :future, :root #form .Form input, .Form textarea {
    width: 100%;
  }

  ::-webkit-full-page-media, :future, :root #recruit .mw_wp_form .horizontal-item input {
    margin-left: 31px;
    width: auto !important;
  } 
  ::-webkit-full-page-media, :future, :root #form .mw_wp_form .horizontal-item input {
    width: auto !important;
  }
  ::-webkit-full-page-media, :future, :root #recruit #form .Form [type="radio"]{
    width: auto !important;
  }
  .carousel {
    height: 630px;
}
.carousel-buttons {
    gap: 15px;
}
.sdgs_li {
    margin-top: 60px;
}
.left_logo {
    bottom: 24%;
    width: 125px;
}
.sdgs_inc{
  padding-bottom: 50px;
}
  .common_aboutsec .common_inner {
    border-bottom: none;
  }
.Form .Form-Item-Label {
  width: 100%;
} 
.Form .btn input {
  margin-top: 20px;
} 
#privacy .company_label {
  font-size: 22px;
}

  .tabs {
    flex-wrap: wrap;
  }

  .tabs .shopeara {
    width: 100%;
    text-align: center;
  }
 .tabs .shopeara img{    width: 100px;}
  .tabs button {
    flex: 1 1 auto;
            padding-left: 0;
  }
}
@media only screen and (max-width: 498px) {
      .top_p .en {
        width: 65%;
        margin-right: 20px;
        line-height: 1.2em;
        font-size: 8px;
    }
  h1.fnt30 {
    font-size: 24px;
  }
      .fnt35 {
        margin-top: 15px;
        font-size: 18px;
    }
    .carousel {
    height: 460px;
  }
 .carousel-item {
  top: 41%;
} 
  .carousel-item .bg_gray {
  bottom: -161px;
         width: 200px;
        right: -14px;
}
  .tab-button {
    padding: 10px 0px;
  }
  .flex li .fnt35 {
    margin-top: 30px;
    font-size: 18px;
    line-height: 1.25em;
  }
      .top_serv {
        width: 100%;
    }
    .sdgs_img img {
  width: 100%;
  margin: 0 auto;
}
 .company_btn {
    padding: 0px 30px 5px;
    line-height: 1em;
  }
  .flex_txt {
    width: 100%;
  }
  .flex_img {
    width: 100%;
    margin: 30px 0;
  }
.reverse.flex02 li {
        width: 100%;
        margin-top: 30px;
    }

  .ja_has_b_tit {
    font-size: 18px;
}
  .info-row {
    flex-direction: column;
  }
    .company_label {
    width: 100%;
    margin-bottom: 10px;
    font-size: 14px;
  }
    .company_value {
    width: 100%;
    font-size: 14px;
  }
  .f_menu .flex li {
  width: 45%;
  margin: 0 2%;
}

footer .footer_flex {
  margin-top: 60px;
}

  .timeline-content {
    font-size: 13px;
    line-height: 1.5;
    padding: 0 0 5px;
  }
.width30{
  margin-top: 15px;
}
.width70{
  margin-top: 15px;
}

.width50{
  margin-top: 15px;
}
.width55 {
  margin-top: 15px;
}

.width40{
  margin-top: 15px;
}
#privacy .company_label {
  font-size: 18px;
}
#privacy .company_label .pop {
  font-size: 22px;
  margin-right: 10px;
}
#originalproducts .fnt25 {
  font-size: 16px;
}
.no {
  font-size: 22px;
  vertical-align: middle;
  padding-right: 4px;
}
.border.pd_radi {
  padding: 10px 8px;
}
.border .fnt20 {
  font-size: 17px;
}
.fnt62 {
    font-size: 18px;
}
}