@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: "Helvetica Neue", Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	font-size: 17px;
	font-size: 1.7rem;
	line-height: 1.6;
	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: "Helvetica Neue", Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, 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.7;
	word-wrap: break-word;
	overflow-wrap: break-word;
	margin-bottom: 1em;
}

li {
	line-height: 1.4;
	margin-bottom: .8em;
}

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, article, aside {
	display: block;
}
.clearfix::after, article::after, aside::after {
	clear: both;
	content:'';
	display: block;
}

/*-----------------------------------------------------------------
	基本構造・スタイル
-----------------------------------------------------------------*/
body {
	display: flex;
	color: var(--body-black);
}
#bodyLayout {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	width: 100%;
	margin: 0 auto;
}
#header, #footer {
	flex-shrink: 0;
	width: 100%;
}
#contentWrap {
	flex: 1 0 auto;
	min-height: 1px; /* for IE11(img resizing)*/
}
#content {
	background-color: #fff;
	text-align: left;
	width: 100%;
	margin-top: 30px;
	margin-bottom: 40px;
}

:root {
	--fzLLL: 137%;
	--fzLL: 125%;
	--fzL: 112%;
	--fzS: 93%;
	--fzSS: 83%;
	--fzSSS: 69%;
	--main-blue: #2e6099;
	--light-blue: #239de8;
	--dark-blue: #2a4159;
	--blue-gray: #5c7899;
	--blue: #1377b4;
	--green: #41853a;
	--red: #f00;
	--delmia-yellow: #dfba23;
	--body-black: #333;
	--gray-d8: #d8d8de;
	--gray-e2: #e2e2e6;
	--gray-f1: #f1f1f1;
	--box-padding: 25px;
	--box-padding-s: 15px;

	--link-color: var(--dark-blue);
	--hover-color: var(--light-blue);
	--gnav-bg: var(--main-blue);
	--gnav-hover-bg: #3670b3;
	--gnav-line: var(--blue-gray);
	--footer-bg: var(--dark-blue);
	--table-th-bg: var(--gray-e2);
	--breadcrumb-bg: var(--gray-d8);
	--page-topvisual-bg: var(--gray-f1);
}

/* inner
**************************/
.inner { 
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 15px;
}

/* anchor
**************************/
a {
	color: var(--link-color);
	text-decoration: underline;
}
a:visited {}
a:hover, a:active, a:focus:not(:focus-visible) {outline: none;}
@media (hover:hover) and (pointer:fine) {
  a:hover, a:active, a:focus {
	/*color: var(--hover-color);*/
	text-decoration: none;
  }
  a:hover img, a:focus img { opacity:0.8;}
}

#header a, #gnav a {
	text-decoration: none;
}

/*-----------------------------------------------------------------
	ヘッダー・グローバルナビ
-----------------------------------------------------------------*/
#header, #gnavWrap {
	background-color: #fff;
	width: 100%;
	padding: 0;
	margin: 0 auto;
}
#header {
	box-shadow: 0 2px 5px rgba(0,0,0,.5);
}
#gnavWrap {
	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%;
	min-height: 40px;
	margin: 0 auto 10px;
	padding-left: 8px;
}
#header .logo-sitename, #header .logo-scsk {
	line-height: 1.2;
	margin: 0;
}
#header .logo-sitename {
	max-width: 180px;
}
#header .logo-scsk {
	max-width: 80px;
	margin: 5px 0 0 auto;
}

/*-----------------------------------------
	グローバルナビ
------------------------------------------*/
/* 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 #gnavMenu {
	display: block;
	padding-top: 60px;
}
/*#gnav.navbar.open .navbar-toggler-icon span {
	border: 1px solid var(--body-black);
}*/
#gnav .dropdown > .dropdown-menu { display: none;}
#gnav .dropdown.open > .dropdown-menu { display: block;}


/* #gnav
**************************/
#gnav,
#gnavMenu {
	width: 100%;
	margin: 0 auto;
}
	#gnavMenu li,
	#gnavMenu li a {
		color: #fff;
	}
#gnavMenu li {
	font-size: 1.6rem;
	line-height: 1.2;
	width: 100%;
	margin-bottom: 0;
}
#gnavMenu li a,
#gnavMenu .dropdown-toggle  {
	display: block;
	width: 100%;
	padding: .9em 10px .8em;
}

/* dropdown-menu */
#gnavMenu .dropdown-menu {
	width: 100%;
	overflow-y: auto;
	text-align: left;
}

/* link arrow
***************************/
#gnavMenu li a {
	position: relative;
}
#gnavMenu 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);
}
#gnavMenu .dropdown-menu a:not(.dropdown-toggle) {
	padding-right: 2em;
}

/* ヘッダ・グローバルナビ */
@media screen and (max-width:767.98px) {
/*-----------------------------------------
	ヘッダ 767.98px以下
------------------------------------------*/
  #header .logo-sitename { max-width: 144px;}
  #header .logo-scsk { max-width: 70px; margin-right: 50px;}
  
  /* for #header.sticky-nav */
  :root {
	--headerheight: 40px;
	scroll-padding-top: calc(var(--headerheight) + 10px);
  }
  #header .logo-wrap {height: var(--headerheight);}
  #header.sticky-nav #contentWrap { margin-top: calc(var(--headerheight) + 10px);}

/*-----------------------------------------
	グローバルナビ 767.98px以下
------------------------------------------*/
  #gnav .navbar-toggler {
	  display: block;
  }
  #gnavMenu {
	display: none;
	visibility:	visible;
	opacity:1;
  }
  
  #gnav,
  #gnavMenu {
	background-color: var(--gnav-bg);
  }
  #gnavMenu li {
	font-weight: bold; 
  }  
  #gnavMenu .nav-item {
	border-bottom: 1px solid var(--gnav-line);
  }
	#gnavMenu .nav-item.nav-home {
		border-top: 1px solid var(--gnav-line);
	}
  #gnavMenu .dropdown-menu {
	background-color: #fff;
  }
  #gnavMenu .dropdown-menu li {
	border-bottom: 1px solid #ccc;
  }
	#gnavMenu .dropdown-menu li:last-child {
		border-bottom: none;
	}
  #gnavMenu .dropdown-menu a {
	color: var(--body-black);
  }
  /* dropdown-menu link arrow */
  #gnavMenu .dropdown-menu a::after {
	border-color: #ccc;
  }
  /* dropdown-toggle */ 
  #gnavMenu .dropdown-toggle {
	position: relative;
	padding-right: 1.6em;
  }
  #gnavMenu .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: var(--body-black);
	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 (any-hover:hover) {
  #gnavMenu li a:hover {
	background-color: var(--gray-f1);
	color: var(--hover-color);
  }
  #gnavMenu li a:hover::after {
	border-color: var(--hover-color);
  }

  #gnavMenu > li > a:hover,
  #gnavMenu .dropdown-toggle:hover {
	background-color: transparent;
	color: #fff;
	opacity: .8;
  }
  #gnavMenu > li > a:hover::after {
	border-color: #fff;
  }
  }

}

/* ヘッダ・グローバルナビ */
@media screen and (min-width:768px) {
/*-----------------------------------------
	グローバルナビ 768px以上
------------------------------------------*/
  #gnav .navbar-toggler {
	display: none;
  }
  
  #gnav,
  #gnavMenu {
	background-color: var(--main-blue);
  }
  #gnavMenu {
	display: flex;
	justify-content: space-between;
	padding: 0;
  }
  #gnavMenu li {
	position: relative;
  }
  #gnavMenu > li {
	display: flex;
	flex-grow: 1;
  }
		#gnavMenu > li .fzS,
		#gnavMenu > li .dropdown-toggle span {
			white-space: nowrap;
		}
		#gnavMenu > li.nav-home {
			max-width: 10%;
		}
		#gnavMenu > li.nav-about,
		#gnavMenu > li.nav-delmia {
			min-width: 18%;
		}

  #gnavMenu > li > a,
  #gnavMenu .dropdown-toggle {
	display: flex;
	flex-grow: 1;
	justify-content: center;
	align-items: center;
	height: 100%;
  }
    #gnavMenu > li a,
	#gnavMenu .dropdown-toggle {
		font-size: 1.35rem;
		text-align: center;
		padding: 3px 6px 2px;
    }
	#gnavMenu > li .fzS {
		font-size: 75%;
	}
	#gnavMenu .dropdown-toggle {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
	}
	#gnavMenu .dropdown-toggle::after {
		content: '\25BC';
		font-size: 60%;
		margin-left: 5px;
	}

  /* height & separator
  ******************************/
  #gnavMenu > li,
  #gnavMenu > li::after,
  #gnavMenu > li.nav-home::before,
  #gnavMenu .dropdown-toggle {
	min-height: 3.4em;
  }
	#gnavMenu > li::after,
	#gnavMenu > li.nav-home::before {
		position: absolute;
		content: '';
		display: block;
		top: 0;
		width: 1px;
		background-color: var(--gnav-line);
	}
	#gnavMenu > li::after {right: 0;}
	#gnavMenu > li.nav-home::before{left: 0;}

  #gnavMenu > li > .dropdown-menu {
	top: 3.4em;
  }
	#gnavMenu .dropdown-menu {
		position: absolute;
		left: 0;
		z-index: 10;
		overflow: auto;
	}
	#gnavMenu > li.nav-delmia > .dropdown-menu {
		width: 420px;
		margin-left: -1px;
  	}

  /* dropdown-menu
  **************************/
  #gnavMenu .dropdown-menu {
	background-color: var(--gnav-hover-bg);
	padding: .9em 10px .8em;
  }
  #gnavMenu .dropdown-menu a {
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: left;
	padding: .8em 2em .8em 10px;
  }
  #gnavMenu .dropdown-menu li {
	border-bottom: 1px solid #999;
  }
  
  /* arrow setting
  ***************************/
  #gnavMenu > li > a:not(.dropdown-toggle)::after {
	  display: none;
  }

  /* hover, current
  ***************************/  
  /* hover */
  #gnavMenu > li:not(.current):hover > .nav-link,
  #gnavMenu > li:not(.current):hover .dropdown-toggle,
  #gnavMenu > li.dropdown.current:hover .dropdown-toggle {
	background-color: var(--gnav-hover-bg);
	color: #fff;
	transition: all .4s ease;
  }
  #gnavMenu li .dropdown-menu a:hover {
	background-color: #fff;
	color: var(--hover-color);
	transition: all .4s ease;
  }
  /* arrow */
  #gnavMenu li .dropdown-menu a:hover::after {
	border-color: var(--hover-color);
  }
  /* current */
  #gnavMenu > li.current {	
	background-color: var(--delmia-yellow);
	color: #fff;
  }
  
  /* hover,current */
  @media (any-pointer:coarse),(hover:none) {
  #gnavMenu .dropdown-menu {
	background-color: var(--gnav-bg);
  }
  #gnavMenu > li:not(.current):hover > .nav-link,
  #gnavMenu > li:not(.current):hover .dropdown-toggle,
  #gnavMenu > li.dropdown.current:hover .dropdown-toggle {
	background-color: inherit;
	color: inherit;
	transition: none;
  }
  /* current */
  #gnavMenu > li.dropdown.current:hover .dropdown-toggle {	
	background-color: var(--delmia-yellow);
	color: #fff;
  }
  }

}
@media screen and (min-width:992px) { 
  #gnavMenu > li a,
  #gnavMenu > li .dropdown-toggle {
	font-size: 1.5rem;
  }
}

/*-----------------------------------------------------------------
	フッター
-----------------------------------------------------------------*/
#footer {
	background-color: var(--footer-bg);
	color: #fff;
	width: 100%;
	margin: 0 auto;
	padding: 26px 0 20px;
}
#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;
 }
}

/*-----------------------------------------------------------------
	パンくず
-----------------------------------------------------------------*/
.breadcrumb-wrap {
	background-color: var(--breadcrumb-bg);
	padding: 12px 0 14px;
	line-height: 1.2;
}
.breadcrumb, .breadcrumb a {
	color: #444;
}
.breadcrumb li {
	display: inline-block;
	font-size: 1.3rem;
	line-height: 1.2;
	list-style: none;
	text-align: left;
	margin: 5px .25em 0 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;
  }
}

/*----------------------------------------------------------------
	コンテンツ汎用設定
-----------------------------------------------------------------*/
	
/****************************************
	タイトルスタイル
*****************************************/
.headline_bg-box {
	background-color: var(--delmia-yellow);
	color: #fff;
	font-size: 120%;
	font-weight: bold;
	line-height: 1.2;
	text-align: center;
	width: 100%;
	padding: 10px 5px 8px;
	margin: 1.5em 0 1em;
}
.headline_border-b {
	border-bottom: 4px solid var(--delmia-yellow);
	font-size: var(--fzLL); /* 125% */
	font-weight: bold;
	line-height: 1.2;
	padding-bottom: 4px;
	margin: 1.5em 0 1em;
}
@media screen and (min-width:768px){
 .headline_bg-box {
	font-size: var(--fzLL);
 }
 .headline_border-b {
	font-size: var(--fzLLL);
	margin-top: 2em;
  }
}
/* 除外 */
.product-title,
.entry-page-title {
	margin-top: auto;
}

.title_border-l {
	font-size: 120%;
	font-weight: bold;
	line-height: 1.2;
	border-left: 6px solid var(--delmia-yellow);
	padding-left: 0.5em;
	margin: 0 0 1em 2px;
}
.title_border-b_blue {
	display: inline-block;
	border-bottom: 1px dotted var(--main-blue);
	color: var(--main-blue);
	font-size: var(--fzL); /* 110% */
	font-weight: bold;
	line-height: 1.2;
	padding-bottom: 4px;
	margin-bottom: 1em;
}
.title_bold {
	font-size: var(--fzL);
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 1em;
}

/****************************************
	背景ボックス,ボーダーボックス
*****************************************/
.bg_box_gray_r5 {
	background-color: var(--gray-f1);
	border-radius: 5px;
	width: 100%;
	padding: var(--box-padding);
}
.border_box_gray_r5 {
	border:1px solid #ccc;
	border-radius: 5px;
	width: 100%;
	padding: var(--box-padding);
}
	.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;
	display: block;
	line-height: 1.2;
	padding-left: 1.1em;
}
	.arrow-double::before {
		position: absolute;
		content:'\226B';
		top: 50%;
		left: 1px;
		color: var(--link-color);
		font-weight: bold;
		font-size: 80%;
		transform: translate(0, -50%);
	}

/* 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 var(--delmia-yellow);
	border-right: 2px solid var(--delmia-yellow);
	transform: rotate(45deg);
}
	ul.arrow-single {
		position: static;
		padding-left: 0;
	}
	ul.arrow-single::before {
		position: static;
		border: none;
	}

/* for event access */
.anchor_box_arrow {
	position: relative;
	display: inline-block;
	font-size: 80%;
	line-height: 1;
	font-weight: bold;
	color: var(--link-color);
	padding: 5px 4px 4px 16px;
	border: 1px solid var(--link-color);
	text-decoration: none!important;
}
	.anchor_box_arrow::before {
		position: absolute;
		content:'\226B';
		left: 3px;
		color: var(--link-color);
	}
.anchor_box_arrow:hover {
	border: 1px solid var(--hover-color);
}
.anchor_box_arrow:hover,
.anchor_box_arrow:hover::before {
	color: var(--hover-color);
}

/* list mark (disc, check)
***************************/
.mark-disc,
ul.mark-disc li,
ol.mark-disc li{
	position: relative;
	list-style: none;
	padding-left: 1em;
}
	ul.mark-disc li:last-child,
	ol.mark-disc li:last-child{
		margin-bottom: 1em;
	}
.mark-disc::before,
ul.mark-disc li::before,
ol.mark-disc li::before{
	position: absolute;
	content:'\25CF';
	speak: none;
	left: 0;
	color: var(--light-blue);
}
	ul.mark-disc,
	ol.mark-disc{
		position: static;
		padding-left: 0;
	}
	ul.mark-disc::before,
	ol.mark-disc::before{
		position: static;
		content: '';
	}

.mark-check-circleblue {
	background:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23239de8' d='M11.707 15.707a.997.997 0 0 1-1.414 0l-4-4a.999.999 0 1 1 1.414-1.414L11 13.586l8.35-8.35A9.96 9.96 0 0 0 12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10a9.942 9.942 0 0 0-1.438-5.148l-8.855 8.855z'/%3E%3C/svg%3E") no-repeat 0 center;
	background-size: 1.3em;
	padding-left: 1.6em;
	margin: -0.15em 0 0 -1px;
}

/* external-link
***************************/
.external-link {
	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='%232a4159' 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;
}

/* button, icon
***************************/
/* btn */
.btn {
	display: block;
	box-shadow: 0px 5px 12px #cad4e2, -6px -6px 12px #fff;
	border-radius: 5px;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.2;
	text-decoration: none;
	min-height: 3.5em;
	padding: .8em 1em;
	margin: 0 auto;
	transition: all .4s ease;
}
@media (min-width:576px) {
  .btn { width: 75%;}
}
@media (min-width:768px) {
  .btn { width: 60%;}	
}
/* hover */
.btn:hover img {opacity: 1;}
@media(any-hover:hover){ 
  .btn:hover {opacity:.9;}
}

/* btn_blue */
.btn_blue { background-color: var(--light-blue);}
.btn_blue,
.btn_blue:hover {color: #fff;}

/*.btn + icon(svg) */
.icon-flex {
	display: flex;
	justify-content: center;
	align-items: center;	
}
.icon-flex > img {flex-shrink: 0;}
	/* icon(svg) */
	.icon_contact {
		width: 1.2em;
		margin: -.1em .6em 0 0;
	}
	.icon_arrow-right {
		width: 1em;
		margin: -.1em 0 0 .5em;
	}

/* カテゴリラベル */
.bg-label {
	display: inline-block;
	vertical-align: middle;
	background-color: var(--main-blue);
	color: #fff;
	font-size: var(--fzSSS);
	font-style: normal;
	line-height: 1;
	text-align: center;
	min-width: 8em;
	padding: .4em;
}

/* 「NEW!!」【終了】スタイル */
.text-new, .text-end {
	color: var(--red);
	font-style: normal;
	font-weight: bold;
}
	.text-new {
		display: inline-block;
		font-size: var(--fzSS);
		margin: 0 .5em;
	}

.mailto {
	display: inline-block;
}

/****************************************
	table
*****************************************/
table {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
}
/* reset */
table p { margin-bottom: 0;}


/* 上下グレーボーダー */
.table-border-tb-gray {
    border-top: 1px solid #ccc;
    margin-bottom: 20px;
}
.table-border-tb-gray th,
.table-border-tb-gray td {
	padding: 12px;
	font-size: 95%;
	vertical-align:middle;
	border-bottom: 1px solid #ccc;
}
	.table-border-tb-gray th {
		width: 26%;
		font-weight:bold;
		text-align: center;
		background-color: var(--table-th-bg);
	}
	.table-border-tb-gray td {
		font-weight:normal;
		text-align: left;
	}
/* option */
.table-border-tb-gray.taL th {
	text-align: left;
}
.bg_table-th { background-color: var(--table-th-bg); padding: 12px;}


/****************************************
	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%;
  border: none;
}

/*----------------------------------------------------------------
	ページレイアウト・コンテンツ（body.page）
-----------------------------------------------------------------*/

/****************************************
	page：トップタイトル
*****************************************/
#pageTopvisual {
	background-color: var(--page-topvisual-bg);
	text-align: left;
	width: 100%;
	padding: 1.3em 0;
}
#pageTopvisual .headline01 {
	font-size: 2.9rem;
	line-height: 1.2;
}
@media screen and (min-width:768px){
  #pageTopvisual .headline01 {font-size: 3.4rem;}
}

#pageTopvisual .headline01 > .lead {
	display: block;
	font-size: var(--fzSSS);
	line-height: 1.2;
}

/****************************************
	page：トップビジュアルイメージ
	画像1400*376（aspect-ratio＝27%）
	** bg_image（divにセット）
	** bg_image-fff-rgba（innerにセット）
	** bg_image-pos-setting（titleにセット）
*****************************************/
.bg_image {
	position: relative;
	max-width: 1920px;
	margin: 0 auto;
}
.bg_image.delmia { background: url(../img/sp/image_delmia_sp.jpg) no-repeat center top / contain;}
.bg_image.platform { background: url(../img/sp/image_platform_sp.jpg) no-repeat center top / contain;}

.bg_image #content {
	position: relative;
	z-index: 1;
	background-color: transparent;
	margin-top: 0;
	padding-top: 27%;
}
.headline_bg-box.bg_image-pos-setting { margin-top: 15px;}

@media (min-width:768px) {
  .bg_image.delmia { background-image: url(../img/image_delmia.jpg);}
  .bg_image.platform { background-image: url(../img/image_platform.jpg);}

  .bg_image::before {
    position: absolute;
	top: 0;
    left: 0;
	content: '';
    width: 100%;
    height: 100%;
	background: linear-gradient(transparent, #fff 200px);
  }
  .bg_image #content { padding-top: 185px;}
}
@media (min-width:1060px) {
  .bg_image::before { background: linear-gradient(transparent, #fff 260px);}
  .bg_image #content { padding-top: 200px;}

  .bg_image-fff-rgba {
	background-color: rgba(255,255,255,.4);
	padding-top: 15px;
  }
  .bg_image-fff-rgba .bg_image-pos-setting { margin-top: 8px;}
  .bg_image-fff-rgba .headline_bg-box.bg_image-pos-setting { margin-top: 0;}
}

/****************************************
	目次（delmia子ページ：各製品）
*****************************************/
.product-toc-list {	
	list-style: none;
	margin-bottom: 1.4em;
}
.product-toc-list > li {
	position: relative;
	line-height: 1.2;
	width: auto;
	padding-left: 22px;
	margin: 0 10px .8em;
}
.product-toc-list > li::before {
	position: absolute;
	content:'';
	top: -0.2em;
	bottom: 0;
	left: 6px;
	margin: auto;
	display: block;
	width: 6px;
	height: 6px;
	border-bottom: 3px solid var(--delmia-yellow);
	border-right: 3px solid var(--delmia-yellow);
	transform: rotate(45deg);
}

/* toc-col setting
***************************/
@media (min-width:576px) {
  #product-toc:not(.toc-col-12) > .product-toc-list {	
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
  }
  /* col-2 */
  #product-toc.toc-col-123 > .product-toc-list,
  #product-toc.toc-col-1234 > .product-toc-list {
	justify-content: space-between;
  }
  #product-toc.toc-col-123 li,
  #product-toc.toc-col-1234 li {
	min-width: calc(100%/2 - 20px);
  }
}
/* col-2 */
@media (min-width:768px) {
  #product-toc.toc-col-12 > .product-toc-list {	
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
  }
  #product-toc.toc-col-12 > .product-toc-list {
	justify-content: space-between;
  }
  #product-toc.toc-col-12 li {
	min-width: calc(100%/2 - 20px);
  }
}
/* col-3 */
@media (min-width:809px){
  #product-toc.toc-col-123 > .product-toc-list,
  #product-toc.toc-col-1234 > .product-toc-list {
	justify-content: start;
  }
  #product-toc.toc-col-123 li,
  #product-toc.toc-col-1234 li {
	min-width: auto;
	width: calc(100%/3 - 20px);
  }
}
/* col-4 */
@media (min-width:1024px) {
  #product-toc.toc-col-1234 li {
	width: calc(100%/4 - 20px);
  }

}

/* 各製品グレーボックス
****************************/
@media screen and (min-width:768px){
  .product-toc-item.bg_box_gray_r5 { padding: 30px;}
}

/****************************************
	ポップアップバナー
*****************************************/
#inquiry-dl-banner .popup-banner {
	display: none;
}

.btn_banner-close {
	display: none;
	cursor: pointer;
	border: none;
	background: #fff url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cdefs%3E%3Cstyle%3E.cls-2%7Bfill:none;stroke:%23000;stroke-linecap:round;stroke-linejoin:round;stroke-width:4px%7D%3C/style%3E%3C/defs%3E%3Cg%3E%3Cpath fill='none' d='M0 0h48v48H0z'/%3E%3Cg id='icon'%3E%3Cpath class='cls-2' d='m12.13 12.63 24 23.5M12.38 36.38l23.5-24'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 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;
  }
}

/****************************************
	イベント・セミナーページ
*****************************************/
.entry-date {
	display: inline-block;
	font-size: var(--fzS);
	color: #666;
}
.entry-list-wrap > .bg-label, .entry-tags > .bg-label
.entry-list-wrap > .entry-date, .entry-tags > .entry-date {
	margin-bottom: .4em;
}
	.entry-list-wrap > .bg-label, .entry-tags > .bg-label {
		/*width: 8em;*/
		margin-right: .6em;
	}

/* entry-list-wrap (index)
***************************/
.entry-list-wrap {
	border-bottom: 1px dashed #ccc;
	padding: 0 0 .7em;
}

.entry-list-wrap > .entry-content {
	display: inline;
}

.entry-list-wrap .entry-title,
.entry-list-wrap .entry-list {
	width: 100%;
}

/* a.entry-list-item */
.entry-list > .entry-list-item {
	display: flex;
	align-items: center;
	text-decoration: none;
	width: 100%;
	padding: 5px;
}	
.entry-list-item > img {
	width: 130px;
	padding-right: 10px;
}
.entry-list-item .entry-title {
	font-weight: bold;
	line-height: 1.2;
	text-decoration: underline;
	margin: 2px 0 4px;
}
.entry-list-item:hover .entry-title {
	text-decoration: none;
}
.entry-list-item .entry-date li,
.entry-list-item .entry-date li:last-child {
	line-height: 1.25;
	margin-bottom: 0;
}

@media (min-width:576px) {
 .entry-list-wrap {
	display: flex;
	align-items: center;
 }
.entry-list-wrap > .bg-label {
	flex-shrink: 0;
	margin-right: 1em;
 }
 .entry-list {
	margin-left: 6.1em;
 }
}

@media (min-width:768px) {
 .entry-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
 }
 .entry-list > .entry-list-item {
	width: calc((100%/2) - 5px);
 }
}

@media (any-pointer:coarse), (hover:none) {
 .entry-list-wrap a:hover {
	 color: inherit;
	text-decoration: underline;
 }
}

/*----------------------------------------------------------------
	トップページレイアウト・コンテンツ（body.home）
-----------------------------------------------------------------*/

/**********************************************
	home：トップビジュアル
***********************************************/
#homeTopvisual {
	position: relative;
	background: url(../img/sp/home_topvisual_sp.jpg) no-repeat center center / cover;
	color: #fff;
	width: 100%;
	height: auto;
	padding: 30px 0;
}
#homeTopvisual .headline01 {
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.2;
	margin-bottom: .5em;
}
#homeTopvisual .lead {
	font-weight: bold;
	line-height: 1.2;
}
@media screen and (min-width:768px){
 #homeTopvisual {
	background: url(../img/home_topvisual.jpg) no-repeat 38% center / cover;
	padding: 50px 0;
 }  
 #homeTopvisual .headline01 {
	font-size: 3.0rem;
 }
 #homeTopvisual .lead {
	font-size: 1.8rem;
 }
}

/****************************************
	home：コンテンツ
*****************************************/
body.home #section01 {
	width: 74%;
	margin: 0 auto;
}

/*-----------------------------------------------------------------
	メディアクエリ用ブレークポイント
-----------------------------------------------------------------*/
/*@media screen and (min-width:576px){
}
@media screen and (min-width:768px){
}
@media screen and (min-width:992px) {
}*/
