.grid-horntimes {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.box-horntimes {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.news_article_horntimes{
	display: inline-grid;
    margin-right: 20px;
	width: 350px;
}

.main-horntimes{
    font-family:'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif !important;
}

.frame-wrapper_video_horntimes {
  position: relative;
  width: 100%;
  max-width: 800px;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  margin-bottom: 50px;
}

.frame-wrapper_video_horntimes iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.frame-wrapper_video_webpage {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  margin-bottom: 50px;
}

.frame-wrapper_video_webpage iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.br-pc { display:block; }
.br-sp { display:none; }



/*
玉置さんここに入れてください。



*/


@media (max-width: 599px) {

.main-horntimes h1{
    font-size: x-large;
}

.sp-title-horntimes{
    font-size: 19.2px;
}

.news_article_horntimes{
	width: 100%;
    margin-right: 0px;
}

.br-pc { display:none; }
.br-sp { display:block; }

.youtube650 {
  width: 100%;
  height: auto;
}

}

.sample_p {
  width: 650px;
  height: 500px;
  overflow: hidden;
}
.sample_p img {
  opacity: 0.7;
  width: 650px;
  transition: all 0.5s;
}
.sample_p img:hover {
  opacity: 1.0;
  transform: scale(1.1, 1.1);
}

.sample_pp {
  width: 325px;
  height: 500px;
  overflow: hidden;
}
.sample_pp img {
  opacity: 0.7;
  width: 523px;
  transition: all 0.5s;
}
.sample_pp img:hover {
  opacity: 1.0;
  transform: scale(1.1, 1.1);
}

/* --YouTubeサイズ調整-- */
.youtube {
position: relative;
height: 0;
padding: 30px 0 56.25%;
overflow: hidden;
}

.youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.youtube650 {
  width: 650px;
  height: auto;
}

.YouTube-movie {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.YouTube-movie iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% 
	height: 100% 
}

/* --レスポンシブ-- */

.movieWraper {
    position: relative
    width: calc(100% - 10px);
    margin: 0 auto;
}

.iframeWrap{
    height: 0;
　　padding: 30px 0 56.25%;
}

iframe {
    position: absolute;
    top: 0;
    left: 0;
}

/* --優レポ-- */

.toc-002 {
    margin-bottom: 30px;
    border: 2px solid #c8c8c8;
    border-radius: 3px;
}

.toc-002 div {
    display: flex;
    width: 800;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 10px 0;
    background-color: #c8c8c8;
    color: #fff;
    font-weight: 600;
    font-size: 1.1em;
}

.toc-002 div::before {
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 4H21V6H8V4ZM3 3.5H6V6.5H3V3.5ZM3 10.5H6V13.5H3V10.5ZM3 17.5H6V20.5H3V17.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E");
    content: '';
}

.toc-002 ol {
    list-style-type: disc;
    margin: 0;
    overflow: hidden;
}

.toc-002 > ol {
    padding: 1em 1em 1em 3em;
}

.toc-002 ol ol {
    margin-top: 5px;
    padding-left: 1.1em;
}

.toc-002 li {
    padding: 5px 0;
    font-weight: 600;
}

.toc-002 ol ol li {
    font-weight: 500;
    font-size: .9em;
}

.toc-002 a {
    color: #333;
    text-decoration: none;
}

.heading-41 {
    display: flex;
    width: 800;
    align-items: center;
    padding: .5em .7em;
    background-color: #c8c8c8;
    color: #333333;
}

.heading-41::before {
    display: inline-block;
    width: 5px;
    height: 1.5em;
    margin-right: .5em;
    background-color: #ffeb00;
    content: '';
}

.box-019 {
    position: relative;
    margin-top: 1em;
    padding: 1.8em 1.5em 1em 1.5em;
    border: 2px solid #72c9ee;
}

.box-019 > div {
    position: absolute;
    top: -1.15em;
    left: -.5em;
    padding: .4em 1.4em;
    border-radius: 25px;
    background-color: #72c9ee;
    color: #fff;
    font-size: .9em;
}

.box-019 > div::before {
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 8px;
    background-color: #72c9ee;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.box-019 p {
    margin: 0;
}

.box-020 {
    position: relative;
    margin-top: 1em;
    padding: 1.8em 1.5em 1em 1.5em;
    border: 2px solid #ee9d72;
}

.box-020 > div {
    position: absolute;
    top: -1.15em;
    left: -.5em;
    padding: .4em 1.4em;
    border-radius: 25px;
    background-color: #ee9d72;
    color: #fff;
    font-size: .9em;
}

.box-020 > div::before {
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 8px;
    background-color: #ee9d72;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.box-020 p {
    margin: 0;
}


/* --欧洲用-- */
/* YouTube動画埋込レスポンシブ */

.iframe-wrapperEAA {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  width: 100%;
}

.iframe-wrapperEAA iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: 600px;
  max-width: 415px;
}

@media (max-width: 767px) {
  .iframe-wrapperEAA {
  width: 90%;
  magin: 0 auto;
  }
}


/* --欧洲用-- */
/* GoogleMapForm埋込レスポンシブ */

.googlemapEAA {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.googlemapEAA iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.googleformEAA {
  position: relative;
  padding-bottom: 2500px;
  height: 0;
  overflow: hidden;
}

.googleformEAA iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* --欧洲用-- */
/* GoogleMapForm埋込レスポンシブ ここまで*/


/* --Q＆A用-- */

.qa-1 {
    max-width: 800px;
    margin-bottom: 40px;
    border: 1px solid #ffeb00;
    border-radius: 25px;
}

.qa-1 summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 2em 1em 3em;
    color: #333333;
    font-weight: 600;
    cursor: pointer;
}

.qa-1 summary::before,
.qa-1 p::before {
    position: absolute;
    left: 1em;
    font-weight: 600;
    font-size: 1.3em;
}

.qa-1 summary::before {
    color: #75bbff;
    content: "Q";
}

.qa-1 summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #333333b3;
    border-right: 3px solid #333333b3;
    content: '';
    transition: transform .5s;
}

.qa-1[open] summary::after {
    transform: rotate(225deg);
}

.qa-1 p {
    position: relative;
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: .3em 3em 1.5em;
    color: #333;
    transition: transform .5s, opacity .5s;
}

.qa-1[open] p {
    transform: none;
    opacity: 1;
}

.qa-1 p::before {
    color: #ff8d8d;
    line-height: 1.2;
    content: "A";
}

/* --Q＆A用ここまで-- */



/* --Q＆A　検索フォーム用ここから-- */


.search-form-1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
    border: 2px solid #d0c225;
    border-radius: 25px;
}

.search-form-1 input {
    width: 250px;
    height: 45px;
    padding: 5px 15px;
    border: none;
    box-sizing: border-box;
    font-size: 1em;
    outline: none;
}

.search-form-1 input::placeholder{
    color: #777777;
}

.search-form-1 button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 45px;
    border: none;
    background-color: #d0c225;
    cursor: pointer;
}

.search-form-1 button::after {
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    content: '';
}

/* --Q＆A　検索フォーム用ここまで-- */

/* --ここから　優レポ_kohara-- */

/* --テーブルの幅 100%なのでめいっぱい 1130-- */
table{
  width: 100%;
  border-spacing: 0;

}

/* --表の1行 テーブルロウ-- */
table tr{
  padding: 20px 0;
}


/* --表の1行目 テーブルヘッダー-- */
table th{
  border-bottom: solid 2px white;
  text-align: center;
  padding: 10px 0;
}


/* --表の2行目以降 テーブルデータ セル1つー-- */
table td{
  border-bottom: solid 2px #ddd;
  text-align: center;
  padding: 10px 0;
}



/* --セルの背景をHORNイエローにー-- */
.highlight_HORN_yellow {
  background-color: #ffeb00;
}

/* テーブルの一番上の行の背景色を変更 */
  .text:first-line {
    background-color: #5F5F5F;
  }


/* テーブルの一番左の列の背景色を変更 */
table td:first-child {
  background-color: #5F5F5F;
}

/* テーブルの一番左の列の文字色を変更 */
table td:first-child {
  color: #ffffff; 
}


/* テーブルの1列目の幅 */
.custom-table .col-1 {
  width: 40%;
}

/* テーブルの2列目の幅 */
.custom-table .col-2 {
  width: 30%;
}

/* テーブルの3列目の幅 */
.custom-table .col-3 {
  width: 30%;
}


/* --ラインアップ用　シンプルテーブル */

/* --テーブルの幅 565px-- */
table-simple{
  width: 565px;
  border-spacing: 0;

}

/* --表の1行 テーブルロウ-- */
table tr-simple{
  padding: 20px 0;
}


/* --表の1行目 テーブルヘッダー-- */
table th-simple{
  border-bottom: solid 2px black;
  text-align: center;
  padding: 10px 0;
}


/* --表の2行目以降 テーブルデータ セル1つー-- */
table td-simple{
  border-bottom: solid 2px white;
  text-align: center;
  padding: 10px 0;
}

/* シンプルテーブルの1列目の幅 */
.custom-table .col-1 {
  width: 40%;
}

/* シンプルテーブルの2列目の幅 */
.custom-table .col-2 {
  width: 30%;
}

/* シンプルテーブルの3列目の幅 */
.custom-table .col-3 {
  width: 30%;
}



/* フォントを指定 */
.font {
  font-family: "Noto Sans";
}

/* フォントを指定 */
.font_thin {
  font-family: "Noto Sans Regular";
  font-weight: 400;
}



/* --ここから　ユーザー吹き出し-- */

.balloon-009 {
    display: flex;
    justify-content: center;
    align-items: start;
    gap: 0 22px;
}

.balloon-009 img {
    max-width: 70px;
    height: 100%;
    border: 3px solid #f2f2f2;
    border-radius: 50%;
}

.balloon-009 p {
    position: relative;
    max-width: 900px;
    margin: 3px 0 0;
    padding: .8em 1em;
    border-radius: 5px;
    background-color: #f2f2f2;
    color: #333333;
}

.balloon-009 p::before {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 30px;
    background-color: #f2f2f2;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    content: '';
}

/* --ここまで　ユーザー吹き出し-- */


/* --ここから　HORN吹き出し-- */

.balloon-010 {
    display: flex;
    justify-content: center;
    align-items: start;
    gap: 0 22px;
}

.balloon-010 img {
    max-width: 70px;
    height: 100%;
    border: 3px solid #f2f2f2;
    border-radius: 50%;
}

.balloon-010 p {
    position: relative;
    max-width: 900px;
    margin: 3px 0 0;
    padding: .8em 1em;
    border-radius: 5px;
    background-color: #f2f2f2;
    color: #333333;
}

.balloon-010 p::before {
    position: absolute;
    right: -15px;
    width: 15px;
    height: 30px;
    background-color: #f2f2f2;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    content: '';
}



/* --ここまで　HORN吹き出し-- */



.float_test {
    float:  left;
   /* 回り込み指定 */
}


p {
  line-height: 2.5;
  margin-top: 8px;
  margin-bottom: 8px;
}

















/* --ここまで　優レポ_kohara-- */



/* --ここから　優レポ_kohara_gear broaching-- */


/* --テーブル加工情報-- */

/* テーブルの1列目の幅 */

/* テーブルの1列目の幅 */
.custom-table-machining-info .col-1 {
  width: 24%;
}

/* テーブルの2列目の幅 */
.custom-table-machining-info .col-2 {
  width: 76%;
}


/* --ここから　優レポ_Ugeo-- */



/* --ここから　箇条書き 点-- */

.list-11 {
    list-style-type: disc;
    padding: 1em 1em 1em 2.5em;
    border-left: 5px solid #ffeb00;
    background-color: #f2f2f2;
}

.list-11 li {
    padding: .3em .3em .3em 0;
}

.list-11 li::marker {
    color: #ffeb00;
    font-size: 1.1em;
}


/* --ここまで　箇条書き 点-- */


/* --テーブルの幅 コーティング-- */
.table-coating{
  width: 230px;
  border-spacing: 0;
  margin-left: auto;
  margin-right: 0;

}



mark {background-color: #ffeb00}




/* --工具寿命 棒グラフ-- */

.tool-life-chart {
  font-family: sans-serif;
  text-align: center;
}

/* グラフ全体コンテナ */
.tool-life-chart .chart-container {
  width: 90%;               /* ← 固定幅をやめる */
  max-width: 600px;         /* ← PCでは最大600px */
  margin: 50px auto;
}

.tool-life-chart .chart-title {
  font-size: 24px;
  margin-bottom: 30px;
  font-weight: bold;
}

/* グラフ本体：Y軸 + 棒グラフ */
.tool-life-chart .chart-body {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}

/* Y軸 */
.tool-life-chart .y-axis {
  position: relative;
  width: 40px;               /* スマホでも少し細く */
  height: 400px;
  font-size: 14px;
  text-align: right;
  padding-right: 5px;
  box-sizing: border-box;
}

.tool-life-chart .y-axis span {
  position: absolute;
  right: 10px;
  transform: translateY(50%);
}

.tool-life-chart .y-axis span:nth-child(1) { bottom: 400px; }
.tool-life-chart .y-axis span:nth-child(2) { bottom: 350px; }
.tool-life-chart .y-axis span:nth-child(3) { bottom: 300px; }
.tool-life-chart .y-axis span:nth-child(4) { bottom: 250px; }
.tool-li


/* --箇条書き　黄色　数字-- */


.list-2 {
　　width: 200px;
    list-style-type: none;
    padding: 1em;
    border: 2px solid #ffeb00;
    counter-reset: li;
}

.list-2 li {
    display: flex;
    align-items: center;
    padding: .3em;
}

.list-2 li::before {
    display: inline-block;
    min-width: 1.7em;
    margin-right: 10px;
    border-radius: 50%;
    background-color: #ffeb00;
    font-weight: bold;
    font-color: black;
    font-size: .75em;
    line-height: 1.7em;
    text-align: center;
    content: counter(li);
    counter-increment: li;
}

/* --箇条書き　黄色　数字　おわり-- */



.google form {
  width: 800px;
  height: 3000px;
}


:root {
  --chart-height: 300px;
  --max: 150;
  --val1: 120;
  --val2: 45;
}

.chart-body-font {
  font-family: sans-serif;
  text-align: center;
}

.chart-container {
  width: 90%;              /* 固定幅をやめて、画面に合わせる */
  max-width: 640px;        /* PCでは最大640pxまで */
  margin: 40px auto 80px;
}

.chart-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 18px;
}

.chart-body-graph {
  display: flex;
  align-items: flex-end;
  min-height: var(--chart-height);
  width: 100%;
  margin: 0 auto;
}

/* Y軸 */
.y-axis {
  position: relative;
  width: 40px;              /* スマホでも狭めに */
  height: var(--chart-height);
  margin-right: 8px;
  box-sizing: border-box;
}
.y-axis span {
  position: absolute;
  right: 0;
  transform: translateY(50%);
  font-size: 12px;
  color: #222;
}
.y-axis span:nth-child(1) { bottom: 100%; }
.y-axis span:nth-child(2) { bottom: 66.6667%; }
.y-axis span:nth-child(3) { bottom: 33.3333%; }
.y-axis span:nth-child(4) { bottom: 0%; }

/* グラフ領域 */
.bar-chart {
  flex: 1;
  height: var(--chart-height);
  border-left: 2px solid #111;
  border-bottom: 2px solid #111;
  box-sizing: border-box;
  display: flex;
  justify-content: space-around;
  align-items: flex-end;
  position: relative;
}

/* グリッド線 */
.grid-line {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: #ddd;
  z-index: 0;
}
.grid-50  { bottom: 33.3333%; }
.grid-100 { bottom: 66.6667%; }
.grid-150 { bottom: 100%; }

/* 棒セット */
.bar {
  width: 25%;               /* ← 固定幅(px)をやめて割合で指定 */
  min-width: 60px;          /* スマホでも最低限見える幅 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  z-index: 1;
}

/* 棒本体 */
.bar-inner {
  width: 100%;              /* ← 幅も棒に合わせて可変に */
  border-radius: 4px;
  box-shadow: 0 1px 0 rgba(0,0,0,0.08) inset;
}

.bar1 .bar-inner {
  height: calc(var(--val1) / var(--max) * var(--chart-height));
  background: #b0c4de;
}
.bar2 .bar-inner {
  height: calc(var(--val2) / var(--max) * var(--chart-height));
  background: #ffd700;
}

/* 値ラベル */
.value {
  margin-bottom: 8px;
  font-weight: 700;
}

/* 下ラベル */
.label {
  margin-top: 8px;
  font-weight: 700;
}

/* ✅ スマホ対応（600px以下） */
@media screen and (max-width: 600px) {
  :root {
    --chart-height: 220px;  /* 高さを少し低く */
  }

  .chart-title {
    font-size: 18px;
  }

  .y-axis span {
    font-size: 10px;
  }

  .bar {
    width: 35%;             /* スマホで少し広くして見やすく */
  }

  .value, .label {
    font-size: 12px;
  }
}


/* --フッターバグ解消用-- */
footer.footer {
  clear: both;
  margin-top: 80px;
}


/* --ここから　優レポ_5_サーキュラーミル-- */

/* --ここから　加工時間_棒グラフ-- */
.chart-wrap_sugurepo5{
  max-width:900px;
  margin:50px auto;
}

.chart-title_sugurepo5{
  font-size:36px;
  font-weight:700;
  padding-left:18px;
  border-left:6px solid #ffeb00;
  margin-bottom:30px;
}


.chart_sugurepo5{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:50px;

  height:350px;
  margin:50px auto;
  border-bottom:3px solid #333;
}

.item_sugurepo5{
  text-align:center;
}

.value_sugurepo5{
  font-size:36px;
  font-weight:bold;
  margin-bottom:10px;
}

.bar_sugurepo5{
  width:160px;
}

.bar1_sugurepo5{
  height:250px;
  background:#a7b7d1;
}

.bar2_sugurepo5{
  height:40px;
  background:#ffeb00;
}

.label_sugurepo5{
  margin-top:10px;
  font-size:28px;
  font-weight:bold;
}

.center_sugurepo5{
  align-self:center;
}

.badge_sugurepo5{
  background:#00a651;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 20px;
  border-radius:30px;
  margin-bottom:20px;
}

.speed_sugurepo5{
  background:#ff6600;
  color:#fff;
  font-size:22px;
  font-weight:bold;
  padding:10px 20px;
  border-radius:30px;
}
/* --ここまで　加工時間_棒グラフ-- */



/* --ここから　Vc切削速度比較-- */

/* --Vc切削速度比較-- */

.chart_sugurepo5_vc{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:60px;

  height:350px;
  margin:50px auto;
  border-bottom:3px solid #333;
}

.item_sugurepo5_vc{
  text-align:center;
}

.value_sugurepo5_vc{
  font-size:36px;
  font-weight:bold;
  margin-bottom:10px;
}

.bar_sugurepo5_vc{
  width:180px;
}

/* 他社工具 */
.bar1_sugurepo5_vc{
  height:28px;
  background:#a7b7d1;
}

/* HORN */
.bar2_sugurepo5_vc{
  height:280px;
  background:#ffeb00;
}

.label_sugurepo5_vc{
  margin-top:10px;
  font-size:28px;
  font-weight:bold;
}

.center_sugurepo5_vc{
  align-self:center;
}

.badge_sugurepo5_vc{
  background:#0066cc;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 25px;
  border-radius:30px;
  margin-bottom:20px;
}

.speed_sugurepo5_vc{
  background:#ff6600;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 25px;
  border-radius:30px
}

.chart-title_sugurepo5_vc{
  font-size:34px;
  font-weight:700;
  padding-left:18px;
  border-left:6px solid #ffeb00;
  margin-bottom:30px;
}


/* --ここまで　Vc切削速度比較-- */



/* --fz送り比較 はじまり-- */

.chart-wrap_sugurepo5_fz{
  width:100%;
  max-width:900px;
  margin:50px auto;
}

.chart-title_sugurepo5_fz{
  font-size:36px;
  font-weight:700;
  color:#1f2937;
  padding-left:18px;
  border-left:6px solid #ffeb00;
  margin-bottom:30px;
}

.chart_sugurepo5_fz{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:60px;

  height:350px;
  margin:50px auto;
  border-bottom:3px solid #333;
}

.item_sugurepo5_fz{
  text-align:center;
}

.value_sugurepo5_fz{
  font-size:36px;
  font-weight:bold;
  margin-bottom:10px;
}

.bar_sugurepo5_fz{
  width:180px;
}

/* 他社工具 */
.bar1_sugurepo5_fz{
  height:45px;
  background:#a7b7d1;
}

/* HORN */
.bar2_sugurepo5_fz{
  height:280px;
  background:#ffeb00;
}

.label_sugurepo5_fz{
  margin-top:10px;
  font-size:28px;
  font-weight:bold;
}

.center_sugurepo5_fz{
  align-self:center;
}

.badge_sugurepo5_fz{
  background:#0066cc;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 25px;
  border-radius:30px;
  margin-bottom:20px;
}

.speed_sugurepo5_fz{
  background:#ff6600;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 25px;
  border-radius:30px;
}

.chart_sugurepo5_fz{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:60px;

  height:350px;
  margin:50px auto;
  border-bottom:3px solid #333;

  width:100%;
  max-width:900px;
}

/* --fz送り比較 おわり-- */

/* --工具寿命比較-- */

.chart_sugurepo5_toollife{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:60px;

  height:350px;
  margin:50px auto;
  border-bottom:3px solid #333;
}

.item_sugurepo5_toollife{
  text-align:center;
}

.value_sugurepo5_toollife{
  font-size:36px;
  font-weight:bold;
  margin-bottom:10px;
}

.bar_sugurepo5_toollife{
  width:180px;
}

/* 他社製品 */
.bar1_sugurepo5_toollife{
  height:56px;
  background:#a7b7d1;
}

/* HORN */
.bar2_sugurepo5_toollife{
  height:280px;
  background:#ffeb00;
}

.label_sugurepo5_toollife{
  margin-top:10px;
  font-size:28px;
  font-weight:bold;
}

.center_sugurepo5_toollife{
  align-self:center;
}

.badge_sugurepo5_toollife{
  background:#0066cc;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 25px;
  border-radius:30px;
  margin-bottom:20px;
}

.speed_sugurepo5_toollife{
  background:#ff6600;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  padding:10px 25px;
  border-radius:30px;
}

.chart-title_sugurepo5_toollife{
  font-size:34px;
  font-weight:700;
  padding-left:18px;
  border-left:6px solid #ffeb00;
  margin-bottom:30px;
}

/* --ここまで　工具寿命比較-- */

/* --ここから　サブタイトル帯-- */

.sub_title_sugurepo{
    position: relative;
    font-size: 22px;
    font-weight: 700;
    color:#1f2d3d;

    margin:40px 0 20px;
    padding-left:18px;
    line-height:1.4;
}

.sub_title_sugurepo::before{
    content:"";
    position:absolute;
    left:0;
    top:4px;              /* 少し下げて中央寄せ */
    width:5px;
    height:24px;          /* 28px → 24px に短縮 */
    background:#ffeb00;
    border-radius:2px;
}

/* --ここまで　サブタイトル帯-- */