@charset "utf-8";

.fmenu_sp li a.sp_culture:link span { color:#00E0E0; }
.fmenu_sp li a.sp_culture:link em { color:#00E0E0; }
.fmenu_sp li a.sp_culture:visited span { color:#00E0E0; }
.fmenu_sp li a.sp_culture:visited em { color:#00E0E0; }

#g-nav.panelactive ul li a.a_culture:link span { color:#FFFF02;}
#g-nav.panelactive ul li a.a_culture:visited span { color:#FFFF02;}

footer a.f_culture:link::after {
  content: ''; /* コンテンツを空にする */
  position: absolute; /* 絶対位置指定 */
  bottom:10px;
  left: 50%; /* 左端から中央に配置 */
  transform: translate(-50%, -50%); /* 中央揃え */
  width:50px; /* 要素の幅と同じ */
  height:20px; /* 要素の高さと同じ */
  background-image: url('../../img/color.png');
  background-size: contain; /* 画像を要素に合わせて表示 */
  opacity: 1; /* 初期状態は不透明 */
  transition: opacity 0.3s ease; /* フェードのアニメーション */
  margin:0 auto; 
}

#g-nav-list ul li a.a_works { }
#g-nav-list ul li a.a_works strong { }
#g-nav-list ul li a.a_works:link { }
#g-nav-list ul li a.a_works span.btnarrow::before{content: '';position: absolute;bottom:-8px;left:15%; width: 85%; height: 1px;  }
#g-nav-list ul li a.a_works span.btnarrow::afer{content: '';position: absolute;bottom:-3px;right:0;width: 15px;height:1px;transform: rotate(35deg);}
.fmenu_sp .sp_works:link em {} 
.fmenu_sp .sp_works:link span {} 
.fmenu_sp .sp_works:visited em {} 
.fmenu_sp .sp_works:visited span {} 
.fmenu_sp li a.sp_works img {}  

.inlin_pc { display:none; } 
.inlin_sp { display:block; } 
@media screen and (min-width: 840px) {
    .inlin_pc { display:block; } 
    .inlin_sp { display:none; } 
    #text-container strong.josefin-sans .fade-in { margin: -6px; }
    
}

span.sp_h2 { margin-bottom:10px; margin-top:10px; }
@media screen and (min-width: 840px) {
  span.sp_h2 { margin-bottom:30px; margin-top:0; }
}




/* 共通 */
.contents img { max-width:100%; max-height:100%; height:auto; }
.mask-wrap .mask { margin-bottom:-10px; }
h3 { margin-bottom:10px; } 
h3::before { content: '●'; color:#00E0E0; display:inline-block; width:1em; margin-right: 0.5em; }

@media screen and (min-width: 840px) {
    .contents { padding:50px 0; }
}

/*トップ*/
.ul_top li.li_photo { margin-top:10px; }
.img_back { width:100%; overflow:hidden; }
.top_wrap { padding-bottom:30px; }
.ul_top li.li_photo p { width:90%; margin: 0 auto; margin-top:15px; text-align: left; text-align: justify;}

/* トップの下共通 */
.culture_wrap_gray { width: 100%; background:#f7f7f7; }
.culture_wrap_gray h3 { text-align:left; }
.cultureContentsText  { text-align:left; }
.cultureContentsImg li img { max-width:100%; max-height:100%; height:auto; width:auto; }
.cultureContentsImg li:first-child { margin-bottom: 10px; }

@media screen and (min-width: 840px) {
    .culture { display:flex; margin-top: 70px; gap:5%; }
    .worksContents { width:70%; }
    .cultureContentsImg { width:40%; }
}

/* 100年必要とされる */
.culture:first-child { margin-bottom:40px; }

@media screen and (min-width: 840px) {
    .culture:first-child h3 { font-size:28px; }
    .culture:first-child .worksContents { width:40%; }
    .culture:first-child .cultureContentsImg { width:55%; }
}

/* 時代が変化 */
@media screen and (min-width: 840px) {
    .ul_top li.li_photo p { width:100%; font-size:18px; }
    .culture:nth-child(2) h3 { font-size:24px; }
}


/* 私たちの使命 */
.contents strong { text-align:center; }
.contents_wrap.gray {text-align: center; }
.StrongText { text-align:left; display:inline-block; margin-top: 20px;}

@media screen and (min-width: 840px) {
    .contents strong { font-size:28px; }
    .contents_wrap.gray h2{ line-height:2.0em; }
    .contents_wrap.gray strong { font-size:28px; }
    .StrongText { width:70%; margin: 0 auto; margin-top:20px; display:block; }
    .StrongImg { max-width:1090px; margin:0 auto; display:block; }
} 


 /* ビジョン */
 .VisionImg li { margin-bottom:10px; }
 @media screen and (min-width: 840px) {
    .VisionImg { display: flex; gap: 10px; margin-top: 30px;}
    .EducationImg { width:70%; }
 }

 /* 表 */
 .welfare { width:100%; padding: 10px 20px; display:flex; align-items: center; background: #F8F8F8; color: #fff; ine-height: 1.2; }
 .WelfareTytle { width:100%;padding: 10px 20px; align-items:center; background:#F8F8F8; font-weight:bold; }
 .WelfareLine {width: 100%; padding: 10px 5% 20px 5%; flex-wrap: wrap; align-items: center; display:flex; }
 .WelfareContents { width:100%; padding:5px; }
 .WelfareImg{width:100%;display: flex;justify-content: space-between;}
 .WelfareImg{width:100%;display: block;}
 .WelfareImg img{width:100%;}

 @media screen and (min-width: 840px) {
    .WelfareTytle { text-align:left; padding: 10px 5%; }
    .WelfareLine { display:flex; flex-wrap:wrap; }
    .WelfareContents { width:25%; text-align:left; }
    .WelfareImg{display: flex;justify-content: space-between;}
    .WelfareImg img{width:33%;}
 }


 /*棒グラフ*/
  .bar-graph { max-width:1090px; display:flex; justify-content:space-between; align-items:flex-end; height:300px; margin-top:-50px; }
  .bar { position:relative; width:18%; background-color:#00E0E0; text-align:center; transition:height 1s ease; height:0; overflow:hidden; }
  .bar-label { position:absolute; bottom:0; left:0; right:0; font-size:12px; line-height:20px; color:#fff; }
/*棒グラフ上書き250621*/
  .bar-graphNew { margin-right:5%; }
  .barNew { width:8%; overflow:visible; }
  .bar1 { background-color:#E9CD33; color:#000; }
  .bar2 { background-color:#E9E933; color:#000; }
  .bar3 { background-color:#7AD18E; color:#000; }
  .bar4 { background-color:#3FA5AD; color:#000; }
  .bar5 { background-color:#2E84CE; color:#fff; }
  .bar6 { background-color:#00245D; color:#fff; }
  .bar7 { background-color:#873E85; color:#fff; }
  .bar8 { background-color:#DC2D5C; color:#fff; }
  .bar9 { background-color:#BA0000; color:#fff; }
  .barNew-label { width:auto; height:300px; margin:auto 0 10px 0; display:flex; justify-content:right; align-items:center; color:inherit; font-weight:bold; font-size:14px; line-height:1.2; writing-mode:vertical-rl; text-align:left; }
  @media screen and (min-width: 840px) {
    .bar-graphNew { margin-right:0; }
    .barNew { width:10%; }
    .bar4 { color:#fff; }
    .bar9 { margin-left:0; }
    .barNew-label { font-size:16px; }
    .bar4 .barNew-label { margin-bottom:30px; }
    .bar5 .barNew-label { margin-bottom:40px; }
    .bar6 .barNew-label { margin-bottom:40px; }
    .bar7 .barNew-label { margin-bottom:50px; }
    .bar8 .barNew-label { margin-bottom:60px; }
    .bar9 .barNew-label { margin-bottom:60px; }
  }

  .bar-label em { width:100%; text-align:center; font-style:normal; font-weight:bold; display:inline-block;font-size:9px; line-height:1.2em; letter-spacing:0.15em; padding-bottom:10px; }
  @media screen and (min-width: 840px) {
    .bar-label em {font-size:18px; }
  }

  .bar-label small { font-weight:bold; font-size:16px; letter-spacing:0.15em;  font-family: "Josefin Sans", sans-serif; margin-top:10px; display:inline-block; margin-bottom:15%;}
  .ul_graph { width:100%; display:flex; margin-top:10px; justify-content: space-between;}
  .ul_graph li { width:18%; text-align:center; }
  .ul_graph li strong { width:auto; margin:0 auto; display:inline-block; font-size:10px; line-height:15px; font-weight:bold; color:#00E0E0; font-family: "Josefin Sans", sans-serif;}
  @media screen and (min-width: 840px) {
    .ul_graph { padding-bottom:0; }
    .ul_graph li strong { font-size:16px; }
  }

/*棒グラフ上書き250621*/
  .ul_graphNew { width:102%; display:flex; margin-top:10px; justify-content: space-between;}
  .ul_graphNew li { width:18%; text-align:center; }
  .ul_graphNew li strong { width:auto; margin:0 auto; display:inline-block; font-size:10px; line-height:1.2; font-weight:bold; color:#000; font-family: "Josefin Sans", sans-serif;}
  @media screen and (min-width: 840px) {
    .ul_graphNew { width:100%; padding-bottom:0; }
    .ul_graphNew li { width:22.5%; text-align:center; }
    .ul_graphNew li:last-child { width:10%; }
    .ul_graphNew li strong { font-size:14px; }
  }


  .st_caution { margin-bottom:50px; display:block; }
  @media screen and (min-width: 840px) {
    .st_caution { display:none; }
  }

  .ul_graph li strong img { display:none; }
  @media screen and (min-width: 840px) {
  .ul_graph li strong img { width:10px; margin-right:5px; display:inline-block; }
  }

  .bar-label em {
    position: relative; /* 相対位置指定 */
    display: inline-block; /* インラインブロック要素として配置 */
  }
  
  .bar-label em::after {
    content: ''; /* コンテンツを空にする */
    position: absolute; /* 絶対位置指定 */
    left: 25%; /* テキストの中央に配置するための調整 */
    bottom: -2px; /* テキストの下に2pxの余白を設定 */
    width: 50%; /* テキストの幅の50%に設定 */
    height: 1px; /* 下線の高さ */
    background-color: #fff; /* 下線の色 */
    z-index: 5; /* 必要に応じて、他の要素との重なり順を調整 */
  }

  .bar-graph div:nth-child(2) small { margin-bottom:40px; }
  .bar-graph div:nth-child(3) small { margin-bottom:60px; }
  .bar-graph div:nth-child(4) small { margin-bottom:70px; }
  .bar-graph div:nth-child(5) small { margin-bottom:90px; }

  .ul_education { width:100%; display:flex; flex-wrap:wrap; justify-content: space-between; margin-top:-2.5px; margin-bottom:50px; }
  .ul_education li { width:33%; }
  .ul_education li img { width:100%; }
  @media screen and (min-width: 840px) {

  }

  @media screen and (min-width: 840px) {
    #text-container span.japan { margin-top: -270px; }
  }

  .contents { padding:0; }
  @media screen and (min-width: 840px) {
    .contents { padding:50px 0; }
  }

  .WelfareLine.last { margin-bottom:100px; }



  .culture_wrap_gray { margin-bottom:50px; }
  @media screen and (min-width: 840px) {
    .culture_wrap_gray { margin-bottom:50px; }
  }

  .ul_column3  { margin-bottom:50px; }
  .ul_column3 li.li_long { width:100%; position:relative; margin-bottom:10px; }
  .ul_column3 li.li_long mask { position:absolute; left:0; }
  @media screen and (min-width: 840px) {
    .ul_column3 li { width:32.7%; }
  }

  .contents strong.st_graph { width:100%; text-align:center; font-size:18px; display:block; padding-top:50px; }

  .sp_h2{ margin-bottom:30px; }
  @media screen and (min-width: 840px) {

  }