@charset "utf-8";
/*-----------------------------------------------------------------
	HTML5 elements, Reseting
-----------------------------------------------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main
{ display: block;}

html { font-size: 62.5%; overflow-y: scroll;}
body {
	background-color: #fff;
	color: #000;
	font-family: Osaka, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
	font-size: 17px;
	font-size: 1.7rem;
	line-height: 1.5;
	width: 100%;
	word-wrap: break-word;
	overflow-wrap: break-word;
	-webkit-text-size-adjust:100%;
}
body, div,/* pre, blockquote,*/ p, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, th, td, figure, figcaption
{ margin: 0; padding: 0;}
input, textarea
{ margin: 0; font-size: 100%;}
label
{ cursor: pointer;}
table
{ border-collapse: collapse; border-spacing: 0; font-size: 100%;}
fieldset, img
{ border: 0;}
img
{ max-width: 100%; height: auto; vertical-align: top; border: 0; image-rendering: -webkit-optimize-contrast; image-rendering: auto;}
.video
{ max-width: 100%; height: auto;}
address, caption, cite, code, dfn, em, th, var
{ font-style: normal; font-weight: normal;}
ul/*, ol*/
{ list-style: none;}
caption, th
{ text-align: left;}
h1, h2, h3, h4, h5, h6
{ font-size: 100%; font-weight: normal;}
q::after, q::before
{ content:'';}
/*a, input
{ outline: none; }*/
input, textarea
{ border-radius: 0; font-family: Osaka, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;}
input[type="button"],input[type="submit"]
{ -webkit-appearance: none; background: none; border: none; padding: 0; cursor: pointer;}
abbr, acronym
{ border: 0;}
*
{ box-sizing: border-box;}

pre { padding: 3px 7px;}
sup { font-size: 70%; vertical-align: top;}
sub { font-size: 70%; vertical-align: baseline;}

p {
	line-height: 1.6;
	word-wrap: break-word;
	overflow-wrap: break-word;
	margin-bottom: 1em;
}

li {
	line-height: 1.4;
	margin-bottom: .4em;
}

figure, .image {
	text-align: center;
	min-height: 1px; /* for IE11 */
}
figcaption, .caption {
	font-size: 93%;
	font-weight: bold;
	line-height: 1.3;
	padding: 4px;
}

/*-----------------------------------------------------------------
	clearfix
-----------------------------------------------------------------*/
.clearfix,
section, article, aside,
.bg_box_gray_r5, .border_box_gray_r5 {
	display: block;
}
.clearfix::after,
section::after, article::after, aside::after,
.bg_box_gray_r5::after, .border_box_gray_r5::after {
	clear: both;
	content:'';
	display: block;
}

/*-----------------------------------------------------------------
	基本構造・スタイル
-----------------------------------------------------------------*/
body {
	display: flex;
}
#body-layout {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	width: 100%;
	margin: 0 auto;
}
#header, #footer {
	flex-shrink: 0;
	width: 100%;
}
#content-wrapper {
	flex: 1 0 auto;
	min-height: 1px; /* for IE11(img resizing)*/
	margin-top: 80px; /* ヘッダーの高さに合わせて調整 */
  }
#content {
	background-color: #fff;
	text-align: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
}

/* inner
**************************/
.inner { 
	max-width: 1024px;
	margin: 0 auto;
	padding: 0 15px;
}

/* anchor
**************************/
a {
	color: #76b900;
	text-decoration: underline;
}
a:visited {}
/* hover */
a:hover, a:active, a:focus {text-decoration: none;}
@media (any-pointer:coarse), (hover:none) {a:hover, a:active, a:focus {text-decoration: underline;}}
a:hover, a:active, a:focus:not(:focus-visible) {outline: none;}

a:hover img, .rollover:hover,
a:focus img {
	opacity: .8;
}

#header a, #gnav a {
	text-decoration: none;
}

/*-----------------------------------------------------------------
	ヘッダ・グローバルナビ
-----------------------------------------------------------------*/
#header, #gnav-wrap {
	background-color: #fff;
	width: 100%;
	padding: 0;
	margin: 0 auto;
}
#header {
	box-shadow: 0 2px 5px rgba(0,0,0,.5);
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1000; /* ヘッダーが他の要素の上に表示されるようにする */
  }
  
#gnav-wrap {
	position: relative;
	padding-top: 10px;
}

#header .logo-wrap {
	display: flex;
	justify-content: flex-start; /* for IE11(bag:r-margin=auto) */
	align-items: center;
	width: 100%;
	height: 40px;
	margin: 0 auto 10px;
	padding-left: 8px;
}
#header .logo-sitename, #header .logo-scsk {
	line-height: 1.2;
	margin: 2px 0 0 0;
}
#header .logo-sitename {
	max-width: 150px;
}
#header .logo-scsk {
	max-width: 80px;
	margin-left: auto;
}

.header-buttons {
	display: block;
    text-align: center;
    margin-left: auto;
    color: #fff;
    text-decoration: none;
	border-radius: 4px;
	display: flex;
	align-items: center; /* 上下中央揃え */
	justify-content: center; /* 水平方向中央揃え */
  }
  
  .header-buttons li {
	display: inline-flex; /* ボタンを横並びにする */
	margin-left: 10px; /* ボタン間の間隔（任意の値） */
	margin-bottom: 0;
  }
  
  .header-buttons li:last-child {
	margin-left: 0; /* 最後のボタンの後に余分な間隔を防ぐため、0に設定 */
  }
  
  #header-button1, #header-button2, #header-button3 {
	padding: 10px 20px;
	background-color: #76b900;
	color: #fff;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	font-weight: bold;
	text-align: center;
	display: flex;
	align-items: center; /* 上下中央揃え */
	justify-content: center; /* 水平中央揃え */
	height: 50px; /* ボタンの高さを指定 */
	transition: opacity 0.3s ease; /* トランジションを追加して変化を滑らかに */
  }

   #header-button3 {
	margin-right: 30px;
  }
  
  #header-button1 a, #header-button2 a, #header-button3 a {
	display: flex;
	align-items: center;
	text-decoration: none;
	color: #fff;
	height: 100%; /* リンク要素の高さを親要素に合わせる */
  }
  
  #header-button1 img, #header-button2 img, #header-button3 img {
	margin-right: 0.5em;
	width: 24px; /* アイコンの幅を指定 */
	height: auto; /* アイコンの高さを自動調整 */
	transition: none; /* 画像のトランジションを無効に */
    opacity: 1; /* 画像のopacityを1に設定 */
  }
  
  #header-button1 .text, #header-button2 .text, #header-button3 .text {
	display: flex;
	align-items: center;
	height: 100%;
  }
  
  /* メディアクエリの追加 */
  @media screen and (max-width: 871px) {
	#header-button1, #header-button2, #header-button3 {
	  font-size: 0.875rem; /* フォントサイズを調整 */
	  padding: 0.75rem 1rem; /* ボタンのパディングを設定 */
	  box-sizing: border-box; /* パディングを含むようにボックスサイズを調整 */
	}
  }
  
  @media screen and (max-width:719px) {
    #header-button1, #header-button2, #header-button3 {
        display: none; /* 幅が375px以下の場合にボタンを非表示 */
    }
}

#header-button1:hover, #header-button2:hover, #header-button3:hover {
    opacity: 0.8; /* ボタン全体を半透明にする */
}




	/*-----------------------------------------
		ヘッダーのお問合せ・資料ダウンロード
	------------------------------------------*/
	  
	#contact-dl,
	#contact-dl-menu {
	  background-color: #76b900;
	}
	#contact-dl-menu li,
  #contact-dl-menu li a {
	  color: #fff;
	  margin-bottom: 0;
  }
	#contact-dl-menu {
	  display: flex;
	  justify-content: flex-end;
	  padding: 0;
	}
	#contact-dl-menu li {
	  position: relative;
	}
	#contact-dl-menu > li {
	  display: flex;
	  flex-grow: 1;
	}
  
	#contact-dl-menu > li > a{
	  display: flex;
	  flex-grow: 2;
	  justify-content: center;
	  align-items: center;
	  height: 100%;
	  width: 20%;
	}
	  #contact-dl-menu > li a{
		  font-size: 1.4rem;
		  text-align: center;
		  padding: 3px 6px 1px;
		  text-decoration: none;
		  font-weight: bold;
	  }
	  #contact-dl-menu > li a:hover{
		  opacity: .8;
	  }
	  
	  #contact-dl-menu > li .fzS {
		  display: block;
		  font-size: 75%;
	  }

  
	/* height & separator
	******************************/
	#contact-dl-menu > li,
	#contact-dl-menu > li::after,
	#contact-dl-menu > li.nav-home::before{
	  min-height: 3.4em;
		  width: 100%;
  max-width: 15.8%;
	}
	  #contact-dl-menu > li::after,
	  #contact-dl-menu > li.nav-home::before {
		  position: absolute;
		  content: '';
		  display: block;
		  top: 0;
		  width: 1px;
		  background-color: #fff;
	  }

	  #contact-dl-menu > li::before{
		  left: 0;
	  }

	  #contact-dl-menu > li:last-child{
		  border-right: 1px solid #fff;
	  }

		@media screen and (max-width:767px){
		  #contact-dl-menu > li,
		  #contact-dl-menu > li::after{
		max-width: 50%;
		  }
	  }



/*-----------------------------------------
	グローバルナビ
------------------------------------------*/
/* fixed */
.sticky-nav {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}

/* .open */
#gnav.navbar.open {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	overflow: auto;
	padding-bottom: 50px;
	z-index: 9999;	
}
#gnav.navbar.open .navbar-toggler-icon span {
	border: 1px solid #666;
}
#gnav.navbar.open #gnav-menu {
	display: block;
	padding-top: 60px;
}
#gnav .dropdown > .dropdown-menu { display: none;}
#gnav .dropdown.open > .dropdown-menu { display: block;}


/* #gnav
**************************/
#gnav,
#gnav-menu {
	width: 100%;
	margin: 0 auto;
}
	#gnav-menu li,
	#gnav-menu li a {
		color: #fff;
	}
#gnav-menu li {
	font-size: 1.6rem;
	line-height: 1.2;
	width: 100%;
	margin-bottom: 0;
}
#gnav-menu li a,
#gnav-menu .dropdown-toggle  {
	display: block;
	width: 100%;
	padding: .9em 10px .8em;
}

/* dropdown-menu */
#gnav-menu .dropdown-menu {
	width: 100%;
	overflow-y: auto;
	text-align: left;
	transition: all 0.3s ease 0s;
}

/* link arrow
***************************/
#gnav-menu li a {
	position: relative;
}
#gnav-menu a:not(.dropdown-toggle)::after {
	position: absolute;
	content:'';
	top: 0;
	bottom: 0;
	right: 10px;
	margin: auto;
	display: block;
	width: 6px;
	height: 6px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
}
#gnav-menu .dropdown-menu a:not(.dropdown-toggle) {
	padding-right: 2em;
}

/* ヘッダ・グローバルナビ */
@media screen and (max-width:767.98px) {
/*-----------------------------------------
	ヘッダ 767.98px以下
------------------------------------------*/
  #header .logo-scsk {
	margin-right: 50px;
  }
  #header .logo-sitename { max-width: 144px;}
  #header .logo-scsk { max-width: 70px;}

:root {
  --headerheight: 50px;
  scroll-padding-top: calc(var(--headerheight) + 10px);
}

/*-----------------------------------------
	グローバルナビ 767.98px以下
------------------------------------------*/
  #gnav .navbar-toggler {
	  display: block;
  }
  #gnav-menu {
	display: none;
	visibility:	visible;
	opacity:1;
  }
  
  #gnav,
  #gnav-menu {
	background-color: #444;
  }
  #gnav-menu li {
	font-weight: bold; 
  }  
  #gnav-menu .nav-item {
	border-bottom: 1px solid #666;
  }
  	#gnav-menu .nav-item.nav-home {
		border-top: 1px solid #666;
	}
  #gnav-menu .dropdown-menu {
	background-color: #fff;
  }
  #gnav-menu .dropdown-menu li {
	border-bottom: 1px solid #999;
  }
	#gnav-menu .dropdown-menu li:last-child {
		border-bottom: none;
	}
  #gnav-menu .dropdown-menu a {
	color: #000;
  }
  /* dropdown-menu link arrow */
  #gnav-menu .dropdown-menu a::after {
	border-color: #999;
  }
  /* dropdown-toggle */ 
  #gnav-menu .dropdown-toggle {
	position: relative;
	padding-right: 1.6em;
  }
  #gnav-menu .dropdown-toggle::after {
	position: absolute;
	content: '\FF0B';
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
	padding: 5px;
  }
  #gnav .dropdown.open .dropdown-toggle::after {content: '\FF0D';}


  /* Hamburger（toggle）
  ********************************/
  #gnav .navbar-toggler {
	position: absolute;
	content:'';
	top: 10px;
	right: 10px;
	background-color: #fff;
	border: none;
	cursor: pointer;
	padding: 0;
  }
  #gnav .navbar-toggler:focus:not(:focus-visible) {
	outline:0;
  }
  /* open anim : bar: top, bottom, center */
  #gnav.open .navbar-toggler-icon span span::before {top: 19px; transform: rotate(-45deg);}
  #gnav.open .navbar-toggler-icon > span::after { bottom: 18px; transform: rotate(-135deg);}
  #gnav.open .navbar-toggler-icon span span::after { display: none;}

  .navbar-toggler-icon {
	position: relative;
	display: block;
  }
  .navbar-toggler-icon span {
	display: block;
	background-color: #333;
	width: 40px;
	height: 40px;
  }
  .navbar-toggler-icon span span {
	display: block;
	overflow: hidden;
	width: 1px;
	height: 1px;
  }
  .navbar-toggler-icon span span::before,
  .navbar-toggler-icon span span::after,
  .navbar-toggler-icon span::after {
	position: absolute;
	left: 10px;
	content:'';
	width: 20px;
	height: 3px;
	background-color: #fff;
  }
  /* bar: top, bottom, center */
  .navbar-toggler-icon span span::before {top: 10px;}
  .navbar-toggler-icon span::after {bottom: 10px;}
  .navbar-toggler-icon span span::after {top: 18px;}
}
/* hover */
@media (max-width:767.98px) and (any-hover:hover) {
  #gnav-menu li a:hover {
	background-color: #f1f1f1;
	color: #76b900;
  }
  #gnav-menu li a:hover::after {
	border-color: #76b900;
  }

  #gnav-menu > li > a:hover,
  #gnav-menu .dropdown-toggle:hover {
	background-color: transparent;
	color: #fff;
	opacity: .8;
  }
  #gnav-menu > li > a:hover::after {
	border-color: #fff;
  }
}

/* ヘッダ・グローバルナビ */
@media screen and (min-width:768px) {
/*-----------------------------------------
	グローバルナビ 768px以上
------------------------------------------*/
:root {
  --headerheight: 6em;
  scroll-padding-top: calc(var(--headerheight));
}

  #gnav .navbar-toggler {
	display: none;
  }
  
  #gnav,
  #gnav-menu {
	background-color: #111;
  }
  #gnav {
	border-bottom: 5px solid #1a2792;
  }
  #gnav-menu {
	display: flex;
	justify-content: space-between;
	padding: 0;
  }
  #gnav-menu li {
	position: relative;
  }
  #gnav-menu > li {
	display: flex;
	flex-grow: 1;
  }
		#gnav-menu > li .fzS,
		#gnav-menu > li .dropdown-toggle span {
			white-space: nowrap;
		}
		#gnav-menu > li.nav-vgpu {
			min-width: 21%
		}

  #gnav-menu > li > a,
  #gnav-menu .dropdown-toggle {
	display: flex;
	flex-grow: 1;
	justify-content: center;
	align-items: center;
	height: 100%;
  }
    #gnav-menu > li a,
	#gnav-menu .dropdown-toggle {
		/* font-size: 1.4rem; */
		font-size: 1.3rem;
		text-align: center;
		padding: 3px 6px 1px;
    }
	#gnav-menu > li .fzS {
		display: block;
		font-size: 75%;
	}
	#gnav-menu .dropdown-toggle {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
	}
	#gnav-menu .dropdown-toggle::after {
		content: '\25BC';
		font-size: 60%;
		margin-left: 5px;
	}

  /* height & separator
  ******************************/
  #gnav-menu > li,
  #gnav-menu > li::after,
  #gnav-menu > li.nav-home::before,
  #gnav-menu .dropdown-toggle {
	min-height: 3.4em;
  }
	#gnav-menu > li::after,
	#gnav-menu > li.nav-home::before {
		position: absolute;
		content: '';
		display: block;
		top: 0;
		width: 1px;
		background-color: #444;
	}
	#gnav-menu > li::after {right: 0;}
	#gnav-menu > li.nav-home::before{left: 0;}

  #gnav-menu > li > .dropdown-menu {
	top: 3.4em;
  }
	#gnav-menu .dropdown-menu {
		position: absolute;
		left: 0;
		z-index: 10;
		overflow: auto;
	}
	#gnav-menu .dropdown-menu-right {
		right: 0;
		left: auto;
	}
	#gnav-menu > li.nav-vgpu > .dropdown-menu {
		width: 430px;
  	}
	#gnav-menu > li.nav-aisv > .dropdown-menu {
		width: 320px;
  	}

  /* dropdown-menu
  **************************/
  #gnav-menu .dropdown-menu {
	background-color: #1a2792;
	padding: .9em 10px .8em;
  }
  #gnav-menu .dropdown-menu a {
	color: #fff;
	font-weight: bold;
	text-align: left;
	padding: .8em 2em .8em 10px;
  }
  #gnav-menu .dropdown-menu li {
	border-bottom: 1px solid #666;
  }
  
  /* arrow setting
  ***************************/
  #gnav-menu > li > a:not(.dropdown-toggle)::after {
	  display: none;
  }

  /* hover, current
  ***************************/  
  /* hover */
  #gnav-menu > li:not(.current):hover > .nav-link {
	background-color: #666;
	color: #fff;
  }
  #gnav-menu li a:hover {
	background-color: #fff;
	color: #76b900;
  }
  /* arrow */
  #gnav-menu li a:hover::after {
	border-color: #76b900;
  }
  
  /* current */
  #gnav-menu > li.current,
  #gnav-menu > li > .nav-link:hover,
  #gnav-menu > li .dropdown-toggle:hover,
  #gnav-menu > li:not(.current):hover .dropdown-toggle{	
	background-color: #1a2792;
	color: #fff;
	font-weight: bold;
  }

}
@media screen and (min-width:992px) { 
  #gnav-menu > li a,
  #gnav-menu > li .dropdown-toggle {
	font-size: 1.5rem;
  }
}

/*-----------------------------------------------------------------
		パンくず
-----------------------------------------------------------------*/
.breadcrumb-wrap {
	background-color: #ccc;
	padding: 10px 0;
}
.breadcrumb, .breadcrumb a {
	color: #333;
}
.breadcrumb li {
	display: inline-block;
	font-size: 1.3rem;
	line-height: 1.2;
	list-style: none;
	text-align: left;
	margin: 0 .25em 5px 0;
}
.breadcrumb > .nav-item {
	position: relative;
	padding-left: 1.5em;
}
.breadcrumb > .nav-item::before {
	position: absolute;
	content:'';
	top: 0;
	bottom: 0;
	left: 2px;
	margin: auto;
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #999;
	border-right: 2px solid #999;
	transform: rotate(45deg);
}

/*-----------------------------------------------------------------
		上へ戻る
-----------------------------------------------------------------*/
.page-top {
	display: none;
    position: fixed;
	bottom: 8px;
    right: 2%;
	background-color: #999;
    color: #fff!important;
	transition: none!important;
	text-decoration: none!important;
    font-size: 18px;
	padding: 10px 14px;
    opacity: .8;
	z-index: 999;
}
@media (min-width:768px) {
  .page-top {
	bottom: 10px;
    right: 12px;
	font-size: 24px;
	padding: 10px 16px;
  }
}

/* hover */
@media (any-hover: hover) {
  a.page-top:hover {
	color: inherit;
	opacity: .6;
  }
}

/*-----------------------------------------------------------------
	フッタ
-----------------------------------------------------------------*/
#footer {
	background-color: #000;
	color: #fff;
	width: 100%;
	margin: 0 auto;
	padding: 1em 0;
}
#footer a { color: #fff;}
@media (hover:hover) and (pointer:fine) {
  #footer a:hover { opacity: .8;}
}

#footer .inner {
	text-align: center;
	padding: 0 8px;
}

#footer .scsk-links {
	margin-bottom: 1em;
}
#footer .scsk-links li {
	display: inline-block;
	font-size: 1.4rem;
	margin: 0 .5em .5em;
}
#footer .copyright {
	font-size: 1.3rem;
	margin: 0 .5em;
}

@media screen and (max-width:767.98px) {
 #footer .inner {
	text-align: left;
	margin-right: 68px; /* for page-top area */
 }
}

@media screen and (min-width: 768px){
 #footer {
	padding: 26px 0;
 }
}

/*----------------------------------------------------------------
	コンテンツ汎用設定
-----------------------------------------------------------------*/
	
/****************************************
	タイトルスタイル
*****************************************/
.headline02 {
	font-size: 125%;
	font-weight: bold;
	line-height: 1.2;
	margin: 1.5em 0 1em;
}

.headline02_bg-box {
	background-color: #000;
	color: #fff;
	font-size: 125%;
	font-weight: bold;
	line-height: 1.2;
	width: 100%;
	padding: 12px 15px 10px;
	margin: 1.5em 0 1em;
}

.title_bg-box {
	background-color: #eee;	
	border-radius: 5px;
	color: #76b900;
	font-size: 112%;
	font-weight: bold;
	line-height: 1.2;
	width: 100%;
	padding: 10px 12px 8px;
	margin: 1.5em 0 1em;
}

.title_bg-box_text {
    text-align: left;
}

.title_color {
	font-size: 112%;
	font-weight: bold;
	line-height: 1.2;
	color: #76b900;
	margin-bottom: .5em;
}

.title_bold {
	font-size: 106%;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: .5em;
}

/****************************************
	背景ボックス,ボーダーボックス
*****************************************/
.bg_box_gray_r5 {
	background-color: #eee;
	border-radius: 5px;
	width: 100%;
	padding: 15px;
}
.border_box_gray_r5 {
	border:1px solid #ccc;
	border-radius: 5px;
	width: 100%;
	padding: 15px;
}
	/*.bg_box_gray_r5 > p,
	.border_box_gray_r5 > p {
		margin-bottom: .5em;
	}*/
	.bg_box_gray_r5 > *:not(ul):last-child,
	.bg_box_gray_r5 > ul:last-child li:last-child,
	.border_box_gray_r5 > *:not(ul):last-child,
	.border_box_gray_r5 > ul:last-child li:last-child {
		margin-bottom: 0;
	}

/****************************************
	リンク,リスト,ラベル マーク各種
*****************************************/

/* arrow-double
***************************/
.arrow-double {
	position: relative;
	padding-left: 1.1em;
}
	.arrow-double::before {
		position: absolute;
		content:'\226B';
		top: 5%;
		left: 0;
		color: #2a4159;
		font-weight: bold;
		font-size: 93%;
		transform: translate(0, -50%);
	}
.arrow-double a:hover {
	color: #8cdb00;
}

/* arrow-single
***************************/
.arrow-single,
ul.arrow-single > li a {
	position: relative;
	list-style: none;
	line-height: 1.2;
	padding-left: 22px;
	text-decoration: none;
}
.arrow-single::before,
ul.arrow-single > li a::before {
	position: absolute;
	content:'';
	top: 0;
	bottom: 0;
	left: 6px;
	margin: auto;
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #76b900;
	border-right: 2px solid #76b900;
	transform: rotate(45deg);
}
	ul.arrow-single {
		position: static;
		padding-left: 0;
	}
	ul.arrow-single::before {
		position: static;
		border: none;
	}

/* chevron-right
***************************/
.chevron-right {
	background:url(../img/icon/icon_chevron-right.svg) no-repeat 0 center;
	background-size: .4em;
	padding-left: 1em;
	margin-left: .2em;
}


.chevron-right-top {
	background:url(../img/icon/icon_chevron-right.svg) no-repeat 0 top;
	background-size: .4em;
	padding-left: 1em;
	margin-left: .2em;
}

/* external-link
***************************/
.external-link {
	/*background:url(../img/icon/icon_external-link.svg) no-repeat 0 center;*/
	background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 24 24'%3E%3Cpath fill='%2376b900' d='M5 3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-6l-2-2v8H5V5h8l-2-2H5zm9 0 2.7 2.7-7.5 7.5 1.7 1.7 7.5-7.5L21 10V3h-7z'/%3E%3Cpath d='M0 0h24v24H0z' style='fill:none'/%3E%3C/svg%3E") no-repeat 0 center;
	background-size: 1em;
	width: 1em;
	height: 1em;
	padding-left: 1em;
}

/* list mark (disc, check)
***************************/
.mark-disc,
ul.mark-disc li {
	position: relative;
	list-style: none;
	line-height: 1.2;
	padding-left: 1em;
	margin-bottom: .4em;
}
	ul.mark-disc li:last-child {
		margin-bottom: 1em;
	}
.mark-disc::before,
ul.mark-disc li::before {
	position: absolute;
	content:'\25CF';
	speak: none;
	left: 0;
	color: #76b900;
	font-size: .8em;
	margin-top: .1em;
}
	ul.mark-disc{
		position: static;
		padding-left: 0;
	}
	ul.mark-disc::before {
		position: static;
		content: '';
	}

/* ポツ */
.mark-disc-s {
	position: relative;
	padding-left: 1em;
}
	.mark-disc-s::before {
		display: block;
		position: absolute;
		content:'・';
		speak: none;
		left: 0;
		color: #0a2986;
	}
	.mark-disc .mark-disc-s::before {
		content:'\2010'; /* - */
	}


.mark-check,
ul.mark-check li {
	background:url(../img/icon/icon_checkmark.svg) no-repeat 0 center;
	background-size: 25px;
	padding-left: 30px;
}
	ul.mark-check li {margin-bottom: 0.3em;}
	ul.mark-check li:last-child {margin-bottom: 1em;}

@media screen and (min-width:768px){
 .mark-check + .mark-check-pl { padding-left: 30px;}
}


/* category label
***************************/
.icon-label {
	display: inline-block;
	background-color: #1a2792;
	color: #fff;
	font-size: 1.1rem;
	font-style: normal;
	line-height: 1;
	text-align: center;
	min-width: 10em;
	padding: .4em;
}

/* text decoration
***************************/
.deco-lr-line {
	position: relative;
	display: inline-block;
	padding: 0 1.8em;
}
.deco-lr-line:before, .deco-lr-line:after {
	position: absolute;
	content: '';
	top: 45%;
	width: 1.5em;
	height: 1px;
	background-color: #000;
	display: inline-block;
}
.deco-lr-line:before {left:0;}
.deco-lr-line:after {right:0;}

/* option:white */
.deco-lr-line.c_fff:before, .deco-lr-line.c_fff:after {
	background-color: #fff;
}

/****************************************
	table
*****************************************/
table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 95%;
	width: 100%;
}
	/* reset */
	table p, 
	table .mark-disc li:last-child { margin-bottom: 0;}

@media screen and (max-width:767.98px) {
 table { font-size: 90%;}
}

table th,
table td {
	border: 1px solid #ccc;
	font-weight: normal;
	line-height: 1.3;
	text-align: left;
	vertical-align: middle;
	padding: 6px;
}
	table th {
		background-color: rgba(204,204,204, 0.3);
	}
	table thead th {
		background-color: #76b900;
		color: #fff;
		font-weight: bold;
		text-align: center;
	}
	table td {
		padding: 6px 8px;
	}

/* option */
table.taC th, table.taC td,
table.th-taC th, table.td-taC td { text-align: center;}
table.fzS { font-size: 90%;}
table .bg_dark { background-color:#666; color: #fff;}
table sup > a { text-decoration: none;}

.table-fixed { table-layout: fixed;}


/* table-scroll
***************************/
.table-scroll {
	display: block;
	overflow-x: scroll;
	/*-webkit-overflow-scrolling: touch;*/
}
.table-scroll table th,
.table-scroll table td {
	white-space: nowrap;
}
.table-scroll table img {
	max-width: none;
}
.table-scroll table.table-fixed {
	table-layout: auto;
}
	/* for scroll-hint.js gradation */
	.table-scroll table .bg_f1/*,
	.table-scroll table tbody th*/ {
		background-color: rgba(204,204,204, 0.3);
	}

/* option */
.table-scroll table th.word-wrap,
.table-scroll table td.word-wrap { white-space: normal;}


/****************************************
	youtube
*****************************************/
.youtube-player {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%; /* = aspect-ratio:16/9; */
}
.youtube-player iframe/*[src*="youtube.com"]*/ {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/****************************************
	accordion
  【右配置に変更】toggler right setting
*****************************************/
/* reset, setting */
.accordion-basic summary {
	display: block;
	cursor: pointer;
}
.accordion-basic summary::-webkit-details-marker {display: none;}
.accordion-basic summary:focus:not(:focus-visible) {outline: none;}

/* toggler */
.accordion-basic .toggler {
	position: relative;
	display: block;
	flex-shrink: 0;
	width: 2rem;
	margin: -.1em 10px 0 0;
	transform-origin: center 43%;
	transition: transform 0.4s;
}
.accordion-basic .toggler::before,
.accordion-basic .toggler::after {
	position: absolute;
	content: '';
	display: block;
	background-color: #76b900;
	width: 1.28rem;
	height: 4px;
}
.accordion-basic .toggler::before {left: 0; transform: rotate(45deg);}
.accordion-basic .toggler::after {right: 0; transform: rotate(-45deg);}

.summary-inner {
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	align-items: center;
	border-radius: 0;
	color: #000;
	width: 100%;
}

.c_green-summary-inner {
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	align-items: center;
	border-radius: 0;
	color: #76b900;
	width: 100%;
}


/* open setting */
.accordion-basic[open] .toggler { transform: rotate(180deg); margin-top: 0;}
.accordion-basic[open] .toggler::before,
.accordion-basic[open] .toggler::after{ background-color: #ccc;}
.accordion-basic[open] .summary-inner {
	background-color: #555;
	color: #fff;
}
.accordion-basic[open] .c_green-summary-inner {
	background-color: #555;
	color: #fff;
}


/*----------------------------------------------------------------
	ページレイアウト・コンテンツ（body.page）
-----------------------------------------------------------------*/

/****************************************
	page：トップタイトル
*****************************************/
#page-topvisual {
	background-color: #000;
	color: #fff;
	text-align: left;
	width: 100%;
	overflow: hidden;
}
#page-topvisual .inner {
	padding-top: 1.3em;
	padding-bottom: 1.3em;
}
#page-topvisual .headline01 {
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 1.1;
}
#page-topvisual .lead {
	display: block;
	font-size: 1.7rem;
	font-weight: normal;
	line-height: 1.3;
	margin-top: 3px;
}

@media screen and (min-width:768px){
 #page-topvisual .headline01 {
	font-size: 3.4rem;
 }
}

/****************************************
	目次
*****************************************/
#page-toc {list-style: none;}
#page-toc a {text-decoration: underline;}
#page-toc a:hover {text-decoration: none;}

#page-toc .toc-text {
	margin-bottom: .5em;
}
#page-toc .arrow-single::before {
	transform: rotate(135deg);
	top: -.2em;
	border-color: #999;
}

@media screen and (min-width:768px){
  #page-toc .toc-text {
	display: inline-block;
	margin: 0 2em .8em 0;
  }
}

/****************************************
	ポップアップバナー
*****************************************/
#inquiry-dl-banner .popup-banner {
	display: none;
}

.btn_banner-close {
	display: none;
	cursor: pointer;
	border: none;
	background: #fff url(../img/icon/icon_close.svg) no-repeat center center;
	box-shadow: 0 0 7px rgb(0 0 0 / 40%);
	width: 30px;
	height: 30px; 
}
.btn_banner-close:hover { background-color: #f1f1f1;}

/* banner fixed */
#inquiry-dl-banner.banner-fixed,
#inquiry-dl-banner.banner-fixed .popup-banner {
	padding: 0;
	margin: 0;
}
#inquiry-dl-banner.banner-fixed {
	position: fixed;
	bottom: 84px;
	right: 20px;
	max-width: 260px;
	z-index: 2;
	background-color: #fff;
}
#inquiry-dl-banner.banner-fixed,
#inquiry-dl-banner.banner-fixed .popup-banner,
#inquiry-dl-banner.banner-fixed .btn_banner-close {
	display: block;
}
	.btn_banner-close {
		position: absolute;
		content:'';
		top: -15px;
		right: -5px;
		z-index: 999;
	}

@media screen and (max-width:1199.98px) {
  #inquiry-dl-banner.banner-fixed {
	right: 12px;
  }
  .btn_banner-close {right: 0;}
}
@media screen and (max-width:991.98px) {
  #inquiry-dl-banner.banner-fixed {
	width: calc(100vw/4);
  }
}
@media screen and (max-width:767.98px) {
  #inquiry-dl-banner,
  #inquiry-dl-banner.banner-fixed {
	  display: none;
  }
}

/****************************************
	checkmark付きボーダーリスト
*****************************************/
.boxlist .checkmark.flex-shrink0 {
	width: 25px;
	margin-right: 5px;
}
.boxlist .img-svg img[src$=".svg"]{
	max-width: 60px;
	max-height: 60px;
}

/****************************************
	リンクボタン（ai-serverページ）
*****************************************/
/* 黒ベース */
.btn_linkbox a {
	position: relative;
	background: #fff url(../img/bg/bg_btn01.jpg) no-repeat right center / cover;
	border: 1px solid #eee;
	border-radius: 5px;
	box-shadow: 0 2px 5px rgba(0,0,0,.5);
	color: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-decoration: none;
	width: 100%;
	padding: 10px 15px;
}
.btn_linkbox a::before {
	position: absolute;
	content: '';
	top: 0;
	right: 0;
	background-image: linear-gradient(165deg, rgba(0, 0, 0, 0.8) 30%, transparent);
	border-radius: 5px;
	display: block;
	width: 100%;
	height: 100%;
}
	.btn_linkbox .text-wrap, .btn_linkbox .img {
		position: relative;
		z-index: 1;
	}
.btn_linkbox img {
	filter: drop-shadow(2px 2px 10px rgba(255, 255, 255, 0.4));
}

.btn_linkbox .text-wrap.chevron-right {
	background-size: .5em;
}
.btn_linkbox .icon-label {
	min-width: inherit;
	margin-bottom: 6px;
	padding: 4px 1em;
}
.btn_linkbox .text {
	font-size: 105%;
	font-weight: bold;
	line-height: 1;
	margin: 0 2px 2px 0;
}
.btn_linkbox .img {
	max-width: 100%;
}

@media (min-width:576px) {
  .btn_linkbox .col-1sm2 {
	width: calc((100%/2) - 8px);
  }
}
@media screen and (min-width:768px){
  .btn_linkbox a {
	  padding-right: 20px;
  }	
  .btn_linkbox a:hover::before {
	background-image: linear-gradient(165deg, rgba(0, 0, 0, 0.4) 30%, transparent);
  }
  .btn_linkbox a:hover img {
	opacity: 1;
  }
  .btn_linkbox .col-1sm2 {
	width: calc((100%/2) - 12px);
  }
  .btn_linkbox .icon-label {
	font-size: 1.2rem;
  }
  .btn_linkbox .text {
	font-size: 108%;
  }
}

/****************************************
	お問い合わせページ
*****************************************/
.btn_contact {
	margin: 0 auto;
}
.btn_contact a {
	display: block;
	background-color: #1a2792;
	color: #fff;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	padding: 10px;
}
.btn_contact a:hover {background-color: rgba(26,39,146,.8);}
.btn_contact a:hover img {opacity: 1;}

.btn_contact .img-svg {
	width: 1.2em;
}
.btn_contact .text {
	display: inline-block;
	font-size: inherit;
	margin: 3px 0 0 6px;
}

.mailto {
	font-size: 2.6rem;
	font-weight: bold;
}
.mailto a,
.mailto a:hover {
	color: #000;
	text-decoration: none;
}

@media screen and (min-width:576px){
 .btn_contact {
	width: 300px;
 }
}

/*----------------------------------------------------------------
	トップページレイアウト・コンテンツ（body.home）
-----------------------------------------------------------------*/

/**********************************************
	home：トップビジュアル,キャッチフレーズ
***********************************************/

/*-----------------------------------------
	トップビジュアル（slick slider）
------------------------------------------*/
#home-topvisual {
	width: 100%;
	max-width: 100%;
	overflow: hidden;
	padding-bottom: 26px;
}

/* slick slider setting */
.slick-slide {
    margin: 0;
    height: auto;
    transition: all ease-in-out .3s;
    opacity: 1; /* 初期状態の透明度 */
}
.slick-slide img {
    width: 100%;
    height: auto;
}

.slick-prev, .slick-next {
    z-index: 1;
}
.slick-prev:before, .slick-next:before {
    color: #000;
}
.slick-slide-wrap .slick-dots li button:before {
    font-size: 10px;
    top: 5px;
}
/* for fix（slick-dots bug） */
.slick-slide-wrap .slick-dots li:not(.slick-active) button:focus:before {
    opacity: .25;
}
/* loading setting */
.slick-slide-wrap {
    display: none;
}
.slick-slide-wrap.slick-initialized {
    display: block;
}
/* opacity change */
.slick-current, .slick-active {
    opacity: 1;
}
/* for fix（add class with js） */
.is-active-next {
    opacity: 1;
}
/* full width display */
.slick-slide-wrap .slick-list {
    overflow: visible;
}
.slick-slide-wrap.slider {
    max-width: calc(1020px + 40px); /* padding-lr */
    margin: 0 auto; /* 中央寄せ */
}

/* top slider link styles */
.top-slider-link {
    display: block;
    text-decoration: none;
    opacity: 1; /* 初期状態の透明度 */
}
.top-slider-link:hover .slick-slide,
.top-slider-link:hover .catchphrase_sub {
    opacity: 0.8; /* ホバー時の透明度 */
}
.top-slider-link .catchphrase_sub {
    color: #000;
    font-weight: bold;
}


/* slide01
************************/
.slide01{
	position: relative;/*親要素にrelative*/
}
.slide01 p{
	text-shadow:
	1px 1px 2px #000000,
	0 0 1em #000000,
	0 0 0.2em #000000;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1em;
	position: absolute;/*重ねたい子要素にabsolute*/
	top: 20%;
	left: 5%;
	text-align:left;
}
.slide01 .sub{
	color: #fff;
	font-size: 0.6em;
	line-height: 0.7em;
}
@media screen and (max-width:768px){
	.slide01 p{
		font-size: 1.2em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 18%;
		left: 5%;
	}
}
@media screen and (max-width:576px) {
	.slide01 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 10%;
		left: 5%;
	}
}
@media screen and (max-width:359px){
	.slide01 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 5%;
		left: 5%;
	}
   }

/* slide02
************************/
.slide02{
	position: relative;/*親要素にrelative*/
}
.slide02 p{
	text-shadow:
	1px 1px 2px #000000,
	0 0 1em #000000,
	0 0 0.2em #000000;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1em;
	position: absolute;/*重ねたい子要素にabsolute*/
	top: 20%;
	left: 5%;
	text-align:left;
}
.slide02 .sub{
	color: #fff;
	font-size: 0.6em;
	line-height: 0.7em;
}
@media screen and (max-width:768px){
	.slide02 p{
		font-size: 1.2em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 18%;
		left: 5%;
	}
}
@media screen and (max-width:576px) {
	.slide02 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 10%;
		left: 5%;
	}
}
@media screen and (max-width:359px){
	.slide02 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 5%;
		left: 5%;
	}
   }

/* slide03
************************/
.slide03{
	position: relative;/*親要素にrelative*/
}
.slide03 p{
	text-shadow:
	1px 1px 2px #000000,
	0 0 1em #000000,
	0 0 0.2em #000000;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1em;
	position: absolute;/*重ねたい子要素にabsolute*/
	top: 25%;/*二行しかないため少し下げている*/
	left: 5%;
	text-align:left;
}
.slide03 .sub{
	color: #fff;
	font-size: 0.6em;
	line-height: 0.7em;
}
@media screen and (max-width:768px){
	.slide03 p{
		font-size: 1.2em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 18%;
		left: 5%;
	}
}
@media screen and (max-width:576px) {
	.slide03 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 10%;
		left: 5%;
	}
}
@media screen and (max-width:359px){
	.slide03 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 5%;
		left: 5%;
	}
   }
/* slide04
************************/
.slide04{
	position: relative;/*親要素にrelative*/
}
.slide04 p{
	text-shadow:
	1px 1px 2px #000000,
	0 0 1em #000000,
	0 0 0.2em #000000;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1em;
	position: absolute;/*重ねたい子要素にabsolute*/
	top: 30%;/*一行しかないため少し下げている*/
	left: 5%;
	text-align:left;
}
.slide04 .sub{
	color: #fff;
	font-size: 0.6em;
	line-height: 0.7em;
}
@media screen and (max-width:768px){
	.slide04 p{
		font-size: 1.2em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 18%;
		left: 5%;
	}
}
@media screen and (max-width:576px) {
	.slide04 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 15%;
		left: 5%;
	}
}
@media screen and (max-width:359px){
	.slide04 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 10%;
		left: 5%;
	}
   }
	

   /* slide05
************************/
.slide05{
	position: relative;/*親要素にrelative*/
}
.slide05 p{
	text-shadow:
	1px 1px 2px #000000,
	0 0 1em #000000,
	0 0 0.2em #000000;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1em;
	position: absolute;/*重ねたい子要素にabsolute*/
	top: 30%;/*一行しかないため少し下げている*/
	left: 5%;
	text-align:left;
}
.slide05 .sub{
	color: #fff;
	font-size: 0.6em;
	line-height: 0.7em;
}
@media screen and (max-width:768px){
	.slide05 p{
		font-size: 1.2em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 18%;
		left: 5%;
	}
}
@media screen and (max-width:576px) {
	.slide05 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 15%;
		left: 5%;
	}
}
@media screen and (max-width:359px){
	.slide05 p{
		font-size: 0.9em;
		position: absolute;/*重ねたい子要素にabsolute*/
		top: 10%;
		left: 5%;
	}
   }
	

/* slide01_under
************************/
.slide01_under{
	position: relative;/*親要素にrelative*/
}
.slide01_under .catchphrase {
	background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
	padding: 20px 20px;
}
@media screen and (max-width:576px) {
	.slide01_under .catchphrase {
		background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
		padding: 0 15px;
	}
}
.slide01_under .catchphrase_sub{
	font-weight: bold;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

/* slide02_under
************************/
.slide02_under{
	position: relative;/*親要素にrelative*/
}
.slide02_under .catchphrase {
	background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
	padding: 20px 20px;
}
@media screen and (max-width:576px) {
	.slide02_under .catchphrase {
		background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
		padding: 0 15px;
	}
}
.slide02_under .catchphrase_sub{
	font-weight: bold;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

/* slide03_under
************************/
.slide03_under{
	position: relative;/*親要素にrelative*/
}
.slide03_under .catchphrase {
	background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
	padding: 20px 20px;
}
@media screen and (max-width:576px) {
	.slide03_under .catchphrase {
		background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
		padding: 0 15px;
	}
}
.slide03_under .catchphrase_sub{
	font-weight: bold;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

/* slide04_under
************************/
.slide04_under{
	position: relative;/*親要素にrelative*/
}
.slide04_under .catchphrase {
	background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
	padding: 20px 20px;
}
@media screen and (max-width:576px) {
	.slide04_under .catchphrase {
		background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
		padding: 0 15px;
	}
}
.slide04_under .catchphrase_sub{
	font-weight: bold;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}


/* slide05_under
************************/
.slide05_under{
	position: relative;/*親要素にrelative*/
}
.slide05_under .catchphrase {
	background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
	padding: 20px 20px;
}
@media screen and (max-width:576px) {
	.slide05_under .catchphrase {
		background: #dee0df url(../img/bg/bg_gray-img01.jpg) no-repeat center center / cover;
		padding: 0 15px;
	}
}
.slide05_under .catchphrase_sub{
	font-weight: bold;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}





/****************************************
	home：News & Topics
*****************************************/
#home-news .headline02 {
	font-size: 2.8rem;
	text-align: center;
	font-weight: normal;
}

/* news-list */
.news-list {
	overflow: auto;
	max-height: 300px;
}
.news-list li {
	display: flex;
	align-items: center;
	border-top: 1px solid #dbdbdb;
	width: 100%;
	padding: 2rem .8rem 0;
	margin-bottom: .1rem;
}
.news-list li a {
	display: block;
	color: inherit;
}
@media (hover:hover) and (pointer:fine) {
  .news-list li a:hover { color: #76b900;}
}

.news-date,
.news-tag,
.news-list .icon-label {
	flex-shrink: 0;
	margin-bottom: 1.5rem;
}
	.news-date {
		font-size: 1.5rem;
		width: 7em;
	}
	.news-tag {
		font-size: 1.4rem;
		font-weight: bold;
		margin-right: .8em;
	}
	.news-list .icon-label {
		margin-top: -.2rem;
		margin-right: 1em;
	}
.news-text {
	font-size: 1.6rem;
	text-align: left;
	margin-bottom: 1.5rem;
}

@media screen and (max-width:767.98px) {
  .news-list li {
	flex-wrap: wrap;
  }
 .news-text {
	width:100%;
  }
}

/* 「NEW!!」スタイル */
.text-new {
	display: inline-block;
	color: #f00;
	font-size: 83%;
	font-style: normal;
	font-weight: bold;
	margin: 0 .5em;
}

/****************************************
	home：コンテンツ
*****************************************/

#home-product-info {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}

#home-product-info .headline02 {
    margin: .2em 0 .5em;
}

#home-product-info .product-box-wrap {
    color: inherit;
    text-decoration: none;
    padding-top: 0;
    display: flex;
    flex-direction: column;
	justify-content: space-between;
}
#home-product-info .product-box-wrap:hover {
	border: 1px solid #76b900;
}
#home-product-info .product-img,
#home-product-info .product-text-wrap {
    padding-top: 15px;
}


#home-product-info .icon-label {
    font-size: 80%;
    min-width: inherit;
    padding: 5px;
    margin-bottom: 0;
}

#home-product-info .title {
    font-size: 1.5rem; /* 共通のフォントサイズ */
    font-weight: bold;
    line-height: 1.1;
    margin: .2em 0 .3em;
}




/* bg_box_gray_r5のスタイル */
#home-product-info .bg_box_gray_r5 {
    margin-bottom: 20px;
}

#home-product-info .bg_box_gray_r5 h2,
#home-product-info .bg_box_gray_r5 p {
	margin-bottom: 20px;
	text-align: left;
}


#home-product-info .bg_box_gray_r5 img {
    max-width: 100%;
    height: auto;
    margin-bottom: 20px;
}

#home-product-info .bg_fff {
    height: 310px;
}


/* メディアクエリ */
@media screen and (min-width: 576px) {
    #home-product-info .product-box-wrap {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
    }
    
    #home-product-info .product-text-wrap {
        flex-grow: 1;
    }

    #home-product-info .product-img {
        margin: auto 0 auto 10px;
    }
}

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

    #home-product-info {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    #home-product-info .bg_box_gray_r5 {
        width: calc((99% / 4) - 10px);
    }

    #home-product-info .bg_box_gray_r5,
    #home-product-info .product-box-wrap {
        display: flex;
        flex-direction: column;
    }

	
    #home-product-info .bg_box_gray_r5 > .section-lead {
        margin: auto 0;
    }

    #home-product-info .product-text-wrap > .lead {
		padding-left: 1.5em;
    }
}


	/* 768px 以上 992px 以下の画面幅に適用するスタイル */
	@media screen and (min-width: 768px) and (max-width: 992px) {
		#home-product-info .bg_box_gray_r5 img {
			height: 3em;
			width: auto;
		}
	}

	
@media screen and (max-width: 767.98px) {
    #home-product-info .bg_box_gray_r5 {
        width: calc((99% / 2) - 20px);
    }



    #home-product-info .bg_fff {
        height: 23rem;
    }

    #home-product-info .title-wrap.chevron-right {
        height: auto;
    }
}

@media screen and (max-width: 576px) {
    #home-product-info .bg_box_gray_r5 {
        width: 100%;
    }

    /* 高さを均等にするための追加 */
    #home-product-info .bg_box_gray_r5 {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
    }

    #home-product-info .bg_fff {
        height: auto;
    }
}


/****************************************
	casestudy_column-info 
*****************************************/


.casestudy_column-info .product-box-wrap {
    color: inherit;
    text-decoration: none;
    padding-top: 0;
    display: flex;
    flex-direction: column;
	justify-content: space-between;
}
.casestudy_column-info .product-box-wrap:hover {
	border: 1px solid #76b900;
}
.casestudy_column-info .product-img,
.casestudy_column-info .product-text-wrap {
    padding-top: 15px;
}


.casestudy_column-info::after {
    display: block;
    content: "";
	width: 32%;
   }

   .info-box{
	width: 32%;
}

.casestudy_column-info .icon-label {
    font-size: 80%;
    min-width: inherit;
    padding: 5px;
    margin-bottom: 0;
}

.casestudy_column-info .title {
    font-size: 1.5rem; /* 共通のフォントサイズ */
    font-weight: bold;
    line-height: 1.1;
    margin: .2em 0 .3em;
}


/* bg_box_gray_r5のスタイル */
.casestudy_column-info .info-box {
    margin-bottom: 20px;
}




.casestudy_column-info .info-box h2,
.casestudy_column-info .info-box p {
	margin-bottom: 20px;
	text-align: left;
}


.casestudy_column-info .info-box img {
    max-width: 100%;
    height: auto;
    margin-bottom: 20px;
}

.casestudy_column-info .bg_fff {
	/* height: 310px; */
	height: 100%;
}


/* メディアクエリ */
@media screen and (min-width: 576px) {
    .casestudy_column-info .product-box-wrap {
        display: flex;
        /* flex-direction: row-reverse; */
        justify-content: space-between;
    }
    
    .casestudy_column-info .product-text-wrap {
        flex-grow: 1;
    }

    .casestudy_column-info .product-img {
        /* margin: auto 0 auto 10px; */
    }
}

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

    .casestudy_column-info {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .casestudy_column-info .info-box {
        width: calc((99% / 3) - 10px);
    }

    .casestudy_column-info .info-box,
    .casestudy_column-info .product-box-wrap {
        display: flex;
        flex-direction: column;
    }

	
    /* .casestudy_column-info .info-box > .section-lead {
        margin: auto 0;
    }

    .casestudy_column-info .product-text-wrap > .lead {
		padding-left: 1.5em;
    } */
}


	/* 768px 以上 992px 以下の画面幅に適用するスタイル */
	@media screen and (min-width: 768px) and (max-width: 992px) {
		.casestudy_column-info .info-box img {
			/* height: 3em; */
			width: auto;
		}
	}

	
@media screen and (max-width: 767.98px) {
    .casestudy_column-info .info-box {
		width: calc((99% / 2) - 20px);
		width: 100%;
	}
	



    .casestudy_column-info .bg_fff {
        /* height: 23rem; */
    }

    .casestudy_column-info .title-wrap.chevron-right {
        height: auto;
    }
}

pre{
	/* white-space: pre-wrap;
	word-wrap: break-word; */
	overflow: auto;
  }


	/*-----------------------------------------
		見積もり シミュレーション
	------------------------------------------*/


	#estimate-lineup {
		width: 100%;
		padding-top: 20px;
		padding-bottom: 10px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	#estimate-lineup .headline02 {
		margin: .2em 0 .5em;
	}
	
	#estimate-lineup .product-box-wrap {
		color: inherit;
		text-decoration: none;
		padding-top: 0;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	
	#estimate-lineup .product-img,
	#estimate-lineup .product-text-wrap {
		padding-top: 15px;
	}
	
	
	#estimate-lineup .icon-label {
		font-size: 80%;
		min-width: inherit;
		padding: 5px;
		margin-bottom: 0;
	}
	
	#estimate-lineup .title {
		font-size: 1.5rem; /* 共通のフォントサイズ */
		font-weight: bold;
		line-height: 1.1;
		margin-top: 1em;
	}
	
	
	/* bg_box_gray_r5のスタイル */
	#estimate-lineup .estimate_lineup_case {
		margin-bottom: 20px;
	}
	
	#estimate-lineup .estimate_lineup_case h2,
	#estimate-lineup .estimate_lineup_case p {
		margin-bottom: 20px;
		text-align: left;
	}
	
	
	#estimate-lineup .estimate_lineup_case img {
		max-width: 100%;
		height: auto;
		margin-bottom: 20px;
	}

	
	/* メディアクエリ */
	@media screen and (min-width: 576px) {
		
		#estimate-lineup .product-text-wrap {
			flex-grow: 1;
		}

	}
	
	@media screen and (min-width: 768px) {	
		#estimate-lineup {
			display: flex;
			flex-wrap: wrap;
			/* justify-content: space-between; */
			justify-content: space-evenly; 
		}
	
		#estimate-lineup .estimate_lineup_case {
			width: calc((99% / 4) - 10px);
		}
	
		#estimate-lineup .estimate_lineup_case,
		#estimate-lineup .product-box-wrap {
			display: flex;
			flex-direction: column;
		}
	
		
		#estimate-lineup .estimate_lineup_case > .section-lead {
			margin: auto 0;
		}
	
		#estimate-lineup .product-text-wrap > .lead {
			padding-left: 1.5em;
		}
	}
	
	
		
	@media screen and (max-width: 767.98px) {
		#estimate-lineup .estimate_lineup_case {
			width: calc((99% / 2) - 20px);
		}
	
	
	
		#estimate-lineup .title-wrap.chevron-right {
			height: auto;
		}
	}
	
	@media screen and (max-width: 576px) {
		#estimate-lineup .estimate_lineup_case{
			width: 100%;
		}
	
		#estimate-lineup .bg_fff {
			height: auto;
		}
	}
	
	

	/*-----------------------------------------
		見積もり TOP
	------------------------------------------*/

	.title_estimate_bg-box {
		background-color: #eee;	
		border-radius: 5px;
		color: #76b900;
		font-size: 112%;
		font-weight: bold;
		line-height: 1.2;
		width: 100%;
		padding: 10px 12px 8px;
		margin: 1.5em 0 1em;
	}
	.title_estimate_bg-box a:hover{
		opacity: .8;
		
	}
	


	.estimate_box {
		display: flex;
		justify-content: space-between;
		margin: 20px 0;
		flex-wrap: wrap; /* 要素が折り返されるようにする */
	}
	
	.button_recommend_selection {
		background-color: #f8f8f8;
		border: 1px solid #ccc;
		border-radius: 5px;
		padding: 20px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
		font-size: 14px;
		text-align: center;
		text-decoration: none;
		color: #333;
		width: 30%;
		box-sizing: border-box;
		transition: background-color 0.3s, border-color 0.3s;
		margin-bottom: 10px; /* 下部にマージンを追加 */
	}
	
	.button_recommend_selection .name {
		display: block;
		font-size: 18px;
		font-weight: bold;
		margin-bottom: 10px;
	}

	
	.button_recommend_selection .mounted{
		font-weight: bold;
		font-size: 1.1em;
	}
	
	.button_recommend_selection .estimate_highend {
		color: #ff6600;
	}
	.button_recommend_selection .estimate_middle {
		color: #03997e;
	}
	.button_recommend_selection .estimate_entry {
		color: #5074cd;
	}
	
	.button_recommend_selection:hover {
		background-color: #e0e0e0;
		border-color: #bbb;
		text-decoration: none; /* ホバー時のアンダーラインを消す */
	}
	
	/* スマホサイズ用のメディアクエリ */
	@media (max-width: 768px) {
		.estimate_box {
			flex-direction: column; /* 縦一列に並べる */
			align-items: center; /* 要素を中央に揃える */
		}
		
		.button_recommend_selection {
			width: 90%; /* 幅を調整 */
		}
	}
	
	/*-----------------------------------------
		見積もり
	------------------------------------------*/

#mitsumori-js {
    background-color:#FFF;
    padding:20px;
	box-sizing:border-box;
	text-align: center;
}
#mitsumori-js table {
    border-collapse: collapse;
    border-spacing: 0;
}

#mitsumori-js .mitsumori-js-tbl {
    margin-bottom:15px;
}
#mitsumori-js .mitsumori-js-total-tbl {
	margin-left: auto;
	margin-bottom: 15px;
}
#mitsumori-js .mitsumori-js-total-tbl th {
    width:30%;
}
#mitsumori-js th,
#mitsumori-js td {
    border:1px solid #000;
    padding:12px;
}
#mitsumori-js th {
	background-color: #76b900;
	color: #fff;
	font-weight: bold;
}


.select-quantity {
	width: 100%;
	box-sizing: border-box; /* 選択メニューが親要素の幅にフィットするように */
  }




/* 小さな画面（スマートフォンなど）用のレスポンシブスタイル */
@media screen and (max-width: 767px) {
	table.mitsumori-js-tbl,
	table.mitsumori-js-tbl thead,
	table.mitsumori-js-tbl tbody,
	table.mitsumori-js-tbl th,
	table.mitsumori-js-tbl td,
	table.mitsumori-js-tbl tr {
	  display: block;
	}
  
	table.mitsumori-js-tbl thead tr {
	  position: absolute;
	  top: -9999px;
	  left: -9999px;
	}
  
	table.mitsumori-js-tbl tr {
	  margin: 0 0 1rem 0;
	}
  
	#mitsumori-js .item-name {
		background-color: #76b900;
		color: #fff;
		font-weight: bold;
		text-align: center;
	}

	table.mitsumori-js-tbl td {
	  border: none;
	  border-bottom: 1px solid #ddd;
	  position: relative;
	  padding-left: 50%;
	  text-align: right;
	}
  
	table.mitsumori-js-tbl td:before {
	  position: absolute;
	  top: 0;
	  left: 6px;
	  width: 45%;
	  padding-right: 10px;
	  white-space: nowrap;
	  text-align: left;
	  font-weight: bold;
	  content: attr(data-label); /* ヘッダーのラベルを表示 */
	}
  
	select.select-quantity {
	  width: 100%;
	  box-sizing: border-box;
	}
  }

.error-message {
	color: red;
    font-size: 14px; /* 適切なフォントサイズに調整してください */
    margin-top: 5px; /* 適切なマージンを設定してください */
    display: block; /* ブロック要素として表示 */
}


#mitsumori-js button{
	background-color: #76b900;
    color: white;
    padding: 15px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    font-size: 16px;
    display: inline-block;
	transition: background-color 0.3s ease;
	font-weight: bold;
}


#mitsumori-js button:hover {
	opacity: .8;
}

#mitsumori-js textarea{
    width: 100%;
    padding: 10px;
    margin: 5px 0 20px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
	field-sizing: content;
}



	/*-----------------------------------------
		イタリック文字
	------------------------------------------*/

.fst-italic{font-style: italic;}

	/*-----------------------------------------
		テキスト右寄せ
	------------------------------------------*/
.t-right{
	text-align: right;
}


/*-----------------------------------------------------------------
	HPE ProLiant／Cray XDシリーズ詳細6ページ追加につき追記
-----------------------------------------------------------------*/
.hpe-cta {
	margin-top: 40px;
}

.hpe-cta__list {
	gap: 24px;
}

.hpe-cta__list-item {
	margin: 0;
}

.hpe-cta__list-item a {
	display: flex;
	transition: opacity 0.3s ease;
	background-color: #76b900;
	padding: 16px 20px;
	border-radius: 5px;
}

.hpe-cta__list-item a:hover {
	opacity: 0.8;
}

.hpe-cta__list-item-img-1 {
	width: 20px;
	height: 15px;
}

.hpe-cta__list-item-img-2 {
	width: 15px;
	height: 15px;
}

.hpe-cta__list-item-text {
	color: #FFFFFF;
	text-decoration: none;
	line-height: 1;
	font-size: 16px;
	margin: 0;
	margin-left: 8px;
	letter-spacing: 0.06rem;
}

.hpe-cta__list-item-text span {
	font-size: 14px;
}

.hpe-cta__list-item-vector {
	margin-left: 12px;
	width: 10px;
	height: 9px;
}

@media screen and (max-width: 767px) {
	.hpe-cta__list {
		gap: 10px;
	}
	.hpe-cta__list-item {
		width: calc(305 / 375 * 100vw);
	}
	.hpe-cta__list-item a {
		padding: 16px 31px;
		border-radius: 5px;
		width: 100%;
		justify-content: space-between;
	}

	.hpe-cta__list-item-img-2 {
		width: 19px;
		height: 20px;
	}

	.hpe-cta__list-item-text {
		font-size: 15px;
		margin-left: 0px;
	}

	.hpe-cta__list-item-text span {
		font-size: 15px;
	}

	.hpe-cta__list-item-vector {
		margin-left: 0px;
	}
}

.other-series {
	margin: 80px auto 0;
	max-width: 780px;
}

.other-series__title {
	text-align: center;
	font-size: 18px;
}

.other-series__list {
	margin-top: 32px;
	gap: 20px 36px;
}

.other-series__list-item {
	margin: 0;
	width: 372px;
}

.br-sp {
	display: none;
}

.other-series__list-item-link {
	padding: 8px 24px;
	display: inline-block;
	border-radius: 5px;
	background-color: #111111;
	color: #FFFFFF;
	text-decoration: none;
	font-size: 16px;
	position: relative;
	width: 100%;
}

.other-series__list-item-link::after {
	content: '';
	position: absolute;
	width: 10px;
	height: 9px;
	top: 50%;
	transform: translateY(-50%);
	right: 24px;
	background: url(../img/hpe/link-vector.png)no-repeat center center / contain;
}

@media screen and (max-width: 809px) {
	.other-series__list-item {
		width: 100%;
	}
	.other-series__list-item-link {
		line-height: 160%;
	}
}

.hpe-content {
	padding-top: 0 !important;
}

.hpe-content .title_bg-box:first-child {
	margin: 0 0 20px;
}

.hpe-content .title_bg-box {
	margin: 48px 0 20px;
}

.hpe-fv {
	position: relative;
	padding: 78px 0 83px !important;
	overflow: visible;
}

.hpe-fv__cta {
	margin-top: 56px;
}

.hpe-fv__img {
	position: absolute;
	top: 50%;
}

.hpe-fv__img-proliant-dl380a-gen11 {
	right: -10%;
	transform: translateY(-53%);
	width: 50%;
}
.hpe-fv__img-proliant-compute-dl380a-gen12 {
	right: -8%;
	transform: translateY(-56%);
	width: 42%;
}
.hpe-fv__img-proliant-dl385-gen11 {
	right: -10%;
	transform: translateY(-49%);
	width: 50%;
}
.hpe-fv__img-proliant-compute-dl384-gen12 {
	right: -9%;
	transform: translateY(-54%);
	width: 46%;
}
.hpe-fv__img-cray-supercomputing-xd670 {
	right: -8%;
	transform: translateY(-62%);
	width: 42%;
}
.hpe-fv__img-cray-xd2000 {
	right: -10%;
	transform: translateY(-53%);
	width: 46%;
}

.hpe-fv__img-pc {
	display: block;
}

.hpe-fv__img-sp {
	display: none;
}

.hpe-fv-cta__text {
	font-size: 14px !important;
}

.hpe-fv-cta__text span {
	font-size: 12px !important;
}

@media screen and (max-width: 767px) {
	.br-pc {
		display: none;
	}
	.br-sp {
		display: block;
	}
	.hpe-fv__img-pc {
		display: none;
	}
	
	.hpe-fv__img-sp {
		display: block;
		width: 100%;
	}

	.hpe-fv {
		padding: 20px 15px !important;
	}

	.hpe-fv__title {
		line-height: 140% !important;
	}

	.hpe-fv__img {
		position: relative;
		top: auto;
		transform: none;
		right: auto;
		width: 100%;
	}

	.hpe-fv__img-proliant-dl380a-gen11 img {
		transform: scale(1.2) translate(9%, -3%);
	}

	.hpe-fv__img-proliant-compute-dl380a-gen12 img {
		transform: scale(1.2) translate(6%, -5%);
	}
	.hpe-fv__img-proliant-dl385-gen11 img {
		transform: scale(1.2) translate(9%, -3%);
	}
	.hpe-fv__img-proliant-compute-dl384-gen12 img {
		transform: scale(1.2) translate(9%, -3%);
	}
	.hpe-fv__img-cray-supercomputing-xd670 img {
		transform: scale(1.15) translate(10%, -5%);
	}
	.hpe-fv__img-cray-xd2000 img {
		transform: scale(1.1) translate(10%, -5%);
	}
	.hpe-fv__cta {
		margin-top: 0px;
		justify-content: center;
	}

	.hpe-fv-cta__text {
		font-size: 14.38px !important;
	}
	
	.hpe-fv-cta__text span {
		font-size: 14.38px !important;
	}
}

.hpe-kv {
	position: relative;
}

.hpe-kv__text {
	position: absolute;
	left: min(calc(32 / 1440 * 100vw),32px);
	top: min(calc(32 / 1440 * 100vw),32px);
	font-size: min(calc(28 / 1440 * 100vw),28px);
	left: 32px;
	top: 32px;
	font-size: 28px;
	font-weight: bold;
	color: #FFFFFF;
	margin: 0;
}

.hpe-kv__img {
	width: 100%;
}

.hpe-title_bg-box {
	font-size: 18px;
}

@media screen and (max-width: 767px) {
	.hpe-kv__text {
		width: calc(305 / 375 * 100vw);
		left: calc(24 / 375 * 100vw);
		top: calc(20 / 375 * 100vw);
		font-size: calc(22 / 375 * 100vw);
		/* left: 32px;
		top: 32px;
		font-size: 28px; */
	}
	.hpe-boxlist li p {
		font-size: 15px;
	}
}

.hpe-list__cta {
	margin-top: 24px;
}

.hpe-text {
	font-size: 18px;
	line-height: 160%;
	width: 95.5%;
	margin: 0 auto;
}

.hpe-accordion-title {
	margin: 48px 0 20px !important;
}

.hpe-specification-table {
	border-collapse: collapse;
}

.hpe-specification-table th, 
.hpe-specification-table td {
	padding: 6px;
	font-size: 16px;
	line-height: 160%;
	vertical-align: middle;
	background-color: #FFFFFF;
	border: 0.67px solid #CCCCCC;
}

.hpe-specification-table th {
	width: calc((240 / 954) * 100%);
}

/* ベース：常にコンテンツを表示 */
.accordion .accordion-content {
	display: block;
}

.hpe-accordion-subtitle-h3 {
	font-weight: bold;
	font-size: 17px;
	line-height: 160%;
	margin: 24px 0 8px;
}

.hpe-accordion-subtitle-h3:first-child {
	margin: 0 0 8px;
}

.hpe-accordion-subtitle-h4 {
	font-weight: bold;
	font-size: 16px;
	line-height: 160%;
	margin: 16px 0 4px;
}

.hpe-specification-table__top th {
	background-color: #76B900;
	color: #FFFFFF;
}

.hpe-specification-table__top th:first-child {
	width: calc((240 / 954) * 100%);
}
.hpe-specification-table__top th:not(:first-child) {
	width: calc((357 / 954) * 100%);
}


/* 画面767px以下だけアコーディオン化 */
@media (max-width: 767px) {
	.hpe-accordion {
		margin: 30px auto 0;
		max-width: 915px;
		width: 100%;
		position: relative;
		z-index: 1;
	}

	.hpe-accordion-title {
		position: relative;
		cursor: pointer;
		display: flex;
		align-items: center;
		flex-direction: row;
		gap: 10px;
		font-size: 18px;
	}
	/* 矢印アイコン */
	.hpe-accordion .toggler {
		position: relative;
		display: block;
		flex-shrink: 0;
		width: 2rem;
		transform-origin: center 43%;
		transition: transform 0.4s;
	}
	.hpe-accordion .toggler::before,
	.hpe-accordion .toggler::after {
		position: absolute;
		content: '';
		display: block;
		background-color: #76b900;
		width: 1.28rem;
		height: 4px;
	}
	.hpe-accordion .toggler::before {
		left: 0;
		transform: rotate(45deg);
	}
	.hpe-accordion .toggler::after {
		right: 0;
		transform: rotate(-45deg);
	}
	/* open 状態で回転 */
	.hpe-accordion .hpe-accordion-title.open .toggler {
		transform: rotate(180deg);
		margin-top: 0;
	}

	.hpe-accordion-content {
		display: none;
		overflow-x: scroll;
	}

	.hpe-specification-table th {
		width: calc((96 / 305) * 100%);
	}
	.hpe-specification-table-2 {
		min-width: 952px;
		table-layout: fixed;
	}
	.hpe-specification-table__top th:first-child {
		width: 240px;
	}
	.hpe-specification-table__top th:not(:first-child) {
		width: 357px;
	}
}