@charset "utf-8";



/* CMS Template(CSS編集はCMS管理画面から)

/common/css/common.css

 Update:  <mt:Date format="%Y-%m-%d %p %I:%M"> */





/* ----------------------------------------------------
 全端末共通
---------------------------------------------------- */

/* common reset ==== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, ection, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
html {
	overflow-y: scroll;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
input, textarea {
	margin: 0;
	padding: 0;
	vertical-align: middle;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {
	text-align: left;
}
a:focus {
	outline: none;
}
a {
	-webkit-tap-highlight-color: transparent;
}
main {
	display: block;
	overflow: hidden;
}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
/* common ==== */

html {
	-webkit-text-size-adjust: 100%;
	/* フォントサイズ自動調整OFF */
	font-size: 62.5%;
	/* 10px */
	overflow-x: hidden;
}


body {
	color: #333333;
	/* letter-spacing : 0.04em; */
	font-size: 14px;
	font-size: 1.4rem;
	/* 14px */
	line-height: 1;
	position: relative;
	/* page top ボタン用 */
	overflow: hidden;
	font-family: 'Roboto', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "M+ 1p", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
button, input, select, textarea, option {
	font-family: inherit;
}
@media all and (-ms-high-contrast:none) {
	body {
		font-family: -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, YuGothic, "Original Yu Gothic", "Yu Gothic", sans-serif;
	}
}
/* clearFix ==== */
.cf:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.cf {
	min-height: 1px;
}
* html .cf {
	height: 1px;
	/*¥*/
	/*/
	height: auto;
	overflow: hidden;
	/**/
}

/* particular case ==== */
.fl {
	float: left;
}
.fr {
	float: right;
}
.cl {
	clear: both;
}

.tc {
	text-align: center !important;
}
.tl {
	text-align: left;
}
.tr {
	text-align: right !important;
}
.vt {
	vertical-align: top;
}

.mt-1 {
	margin-top: -1px !important;
}
.mt-15 {
	margin-top: -15px !important;
}
.mt-30 {
	margin-top: -30px !important;
}
.mt0 {
	margin-top: 0px !important;
}
.mt10 {
	margin-top: 10px !important;
}
.mt15 {
	margin-top: 15px !important;
}
.mt20 {
	margin-top: 20px !important;
}
.mt30 {
	margin-top: 30px !important;
}
.mb0 {
	margin-bottom: 0 !important;
}
.mb5 {
	margin-bottom: 5px !important;
}
.mb10 {
	margin-bottom: 10px !important;
}
.mb15 {
	margin-bottom: 15px !important;
}
.mb20 {
	margin-bottom: 20px !important;
}
.mb30 {
	margin-bottom: 30px !important;
}
.mb50 {
	margin-bottom: 50px !important;
}
.mr0 {
	margin-right: 0 !important;
}
.mr5 {
	margin-right: 5px !important;
}
.mr10 {
	margin-right: 10px !important;
}
.mr15 {
	margin-right: 15px !important;
}
.mr20 {
	margin-right: 20px !important;
}
.mr30 {
	margin-right: 30px !important;
}
.mr50 {
	margin-right: 50px !important;
}
.ml0 {
	margin-left: 0 !important;
}
.ml10 {
	margin-left: 10px !important;
}
.ml15 {
	margin-left: 15px !important;
}
.ml20 {
	margin-left: 20px !important;
}
.ml40 {
	margin-left: 40px !important;
}
.ml-20 {
	margin-left: -20px !important;
}
.pr40 {
	padding-right: 40px !important;
}
.pt0 {
	padding-top: 0 !important;
}
.pt15 {
	padding-top: 15px !important;
}
.pl0 {
	padding-left: 0 !important;
}
.pl30 {
	padding-left: 30px !important;
}
.pr0 {
	padding-right: 0 !important;
}
.pb0 {
	padding-bottom: 0 !important;
}
.pb15 {
	padding-bottom: 15px !important;
}

/*アニメーション-------------*/

/*スライド*/
.inSlide {
	opacity: 0;
	-webkit-transition: all 1.0s;
	transition: all 1.0s;
}
.fadeSlide {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
}

/*フェードイン*/
.infadeIn {
	opacity: 0;
	transition: 1.5s;
}
.fadeIn {
	opacity: 1.0;
}

/*フェードイン 上スライド*/
.infadeUp {
	opacity: 0;
	-webkit-transform: translate(0, 30px);
	transform: translate(0, 30px);
	transition: .8s;
}
.fadeInUp {
	opacity: 1.0 !important;
	-webkit-transform: translate(0, 0) !important;
	transform: translate(0, 0) !important;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
input[type="text"]:focus, button {
	outline: 0;
}
/* ----------------------------------------------------
メディアクエリ設定 All
---------------------------------------------------- */
header {
	font-family: 'Roboto', 'Noto Sans JP', sans-serif;
}
.link-list li {
	margin-bottom: 8px;
}
.link-list li a {
	font-size: 1.3rem;
	color: #4d4d4d;
	display: inline-flex;
	font-weight: 500;
}
.link-list li a.ico-window {
	background: url(/common/img/ico_window_r.png) right 0.3em / 8px auto no-repeat;
	padding-right: 15px;
}
.link-list li a::before {
	content: "";
	display: block;
	flex-shrink: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3px 0 3px 3px;
	border-color: transparent transparent transparent #c12c1f;
	margin: 4px 6px 0 1px;
}
.link-list li a:hover {
	text-decoration: underline;
}
.subnavi .src-area input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-size: 1.6rem;
	border: 1px solid #eee !important;
	outline: none;
	border-radius: 3px;
	padding: 5px 35px 7px 8px !important;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.85 14.85'%3E%3Cg id='search_2' data-name='search 2'%3E%3Cg id='text'%3E%3Cpath d='M6,12.09a6,6,0,1,1,6.05-6A6,6,0,0,1,6,12.09ZM6,2a4,4,0,1,0,4.05,4A4,4,0,0,0,6,2Z' style='fill:%23c12c1f'/%3E%3Crect x='11' y='8.97' width='2' height='6.06' transform='translate(-4.97 12) rotate(-45)' style='fill:%23c12c1f'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center right 10px / 15px no-repeat, #fff !important;
	text-indent: 0px;
	width: 100% !important;
}

.subnavi .h-lang {
	position: relative;
	font-size: 1.4rem;
	padding: 0 6px;
}
.subnavi .h-lang p {
	cursor: pointer;
	display: flex;
	align-items: center;
}
.subnavi .h-lang p::before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	margin-right: 10px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0'%3E%3Cg id='lang_2' data-name='lang 2'%3E%3Cg id='text'%3E%3Cpath d='M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0ZM3,3A6.93,6.93,0,0,1,5.64,1.4,7.32,7.32,0,0,0,4.46,3.55H2.58A5.57,5.57,0,0,1,3,3ZM2,4.3H4.22a13.47,13.47,0,0,0-.47,3.3H1A6.9,6.9,0,0,1,2,4.3Zm0,7.35a6.9,6.9,0,0,1-1-3.3H3.75a13.47,13.47,0,0,0,.47,3.3Zm1,1.26a5.57,5.57,0,0,1-.46-.51H4.47a8.86,8.86,0,0,0,.44,1,6.19,6.19,0,0,0,.73,1.12A6.93,6.93,0,0,1,3,12.91Zm4.56,2-.35,0a2.75,2.75,0,0,1-.54-.35A5.34,5.34,0,0,1,5.26,12.4H7.6v2.54Zm0-3.29H5a12.76,12.76,0,0,1-.51-3.3H7.6v3.3Zm0-4.05H4.5A12.34,12.34,0,0,1,5,4.3H7.6V7.6Zm0-4H5.27a4.82,4.82,0,0,1,.31-.69A4.61,4.61,0,0,1,6.71,1.38,2.75,2.75,0,0,1,7.25,1L7.6,1V3.55Zm6.31.75a6.9,6.9,0,0,1,1,3.3H12.2a13.47,13.47,0,0,0-.47-3.3ZM12.91,3a5.57,5.57,0,0,1,.46.51H11.48a8.86,8.86,0,0,0-.44-1,6.19,6.19,0,0,0-.73-1.12A6.93,6.93,0,0,1,12.91,3ZM8.35,1,8.7,1a2.75,2.75,0,0,1,.54.35,5.34,5.34,0,0,1,1.45,2.17H8.35Zm0,3.29H11a12.76,12.76,0,0,1,.51,3.3H8.35Zm0,4.05h3.1a12.34,12.34,0,0,1-.51,3.3H8.35Zm.89,6.22a2.75,2.75,0,0,1-.54.35l-.35,0V12.4h2.33a4.82,4.82,0,0,1-.31.69A4.61,4.61,0,0,1,9.24,14.57Zm3.67-1.66a6.93,6.93,0,0,1-2.6,1.64,7.32,7.32,0,0,0,1.18-2.15h1.88A5.57,5.57,0,0,1,12.91,12.91Zm1-1.26H11.73a13.47,13.47,0,0,0,.47-3.3h2.74A6.9,6.9,0,0,1,13.91,11.65Z' style='fill:%23111'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 0 0/ contain no-repeat;
}
.subnavi .h-lang p::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 3px 0 3px;
	border-color: #111 transparent transparent transparent;
	margin-left: 10px;
}
.subnavi .h-lang ul {
	width: 100%;
	left: 0;
	background: #fff;
	position: absolute;
	text-align: center;
	margin-top: 12px;
	display: none;
}
.subnavi .h-lang a {
	color: #111;
	text-decoration: none;
	display: block;
	padding: 6px 0;
}
.subnavi .h-lang a:hover {
	background: #eee;
}
.subnavi .h-lang.on ul {
	display: block;
}
.pagetop {
	right: 15px;
	z-index: 100;
}

footer {
	background: #3a3a3a;
}
.f-navi {
	max-width: 1000px;
	margin: 0 auto;
	overflow: hidden;
	padding: 100px 0;
	display: flex;
	justify-content: space-between;
	line-height: 1.2;
	color: #fff;

}
.f-navi a {
	color: #fff;
	text-decoration: none;
}
.f-navi a:hover {
	text-decoration: underline;
}
.f-navi .ico_window {
	background: url(/common/img/ico_window.png) right center no-repeat;
	padding-right: 15px;
}
.f-navi dt {
	font-weight: bold;
	font-size: 1.6rem;
	margin-bottom: 10px;
}
.f-navi dd li {
	display: flex;
	flex-wrap: wrap;
}
.f-navi dd li ul {
	width: 100%;
	margin: 5px 0 5px 1em;
}
.f-navi dd li + li {
	margin-top: 5px;
}
.f-navi dd li a {
	font-size: 1.2rem;
}
.f-navi dd li::before {
	content: "・";
	display: block;
	flex-shrink: 0;
	margin-right: 5px;
}
.f-box01 {
	max-width: 210px;
	flex-shrink: 0;
}
.f-box01 ul + ul,
.f-box02 dd + dt {
	margin-top: 30px;
}
.f-box02 {
	width: 180px;
	flex-shrink: 0;
	margin: 0 30px;
}
.f-box03 {
	max-width: 450px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.f-box03 dd {
	display: flex;
	flex-wrap: wrap;
}
.f-box03 dd ul:first-child {
	margin-right: 8%;
}
.f-box03 .btn-area ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: -15px;
}
.f-box03 .btn-area li {
	width: 48%;
	margin-bottom: 15px;
}
.f-box03 .btn-area a {
	display: block;
	font-size: 1.2rem;
	text-align: center;
	background-color: #585858;
	background-position: right 15px center;
	padding: 15px 30px;
	border-radius: 60px;
	transition: .3s;
}
.f-box03 .btn-area a:hover {
	text-decoration: none;
	opacity: 0.7;
}
.f-sub {
	border-top: 1px solid #4d4d4d;
	border-bottom: 1px solid #4d4d4d;
	padding: 30px 0 20px;
}
.f-sub ul,
.f-other ul {
	display: flex;
	justify-content: center;
	font-size: 1.2rem;
	line-height: 1.5;
	flex-wrap: wrap;
}
.f-sub li {
	margin-bottom: 10px;
}
.f-sub li + li,
.f-other li + li {
	margin-left: 3em;
}
.f-sub a, .f-other a {
	color: #fff;
	text-decoration: none;
}
.f-sub a:hover, .f-other a:hover {
	text-decoration: underline;
}
.f-other {
	padding: 20px 0 60px;
}
.f-other .sns {
	margin-top: 40px;
}
.f-other .sns li + li {
	margin-left: 0.5em;
}
.f-logo {
	display: none;
}
.copy {
	background: #2c2c2c;
	text-align: center;
	font-size: 10px;
	font-size: 1.0rem;
	padding: 100px 0;
	color: #fff;
}
.ico-tw img, .ico-fb img, .ico-note img {
	width: 20px;
	margin-right: 10px !important;
}
@keyframes fade-in {
	0% {
		display: none;
		opacity: 0;
		transform: scale(0.1, 1);
	}
	90% {
		display: block;
		opacity: 1;
		transform: scale(1, 1);
	}
	100% {
		display: block;
		opacity: 1;
		transform: scale(1, 1);
	}
}
@keyframes fade-in02 {
	0% {
		opacity: 0;
	}
	90% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fade-out {
	0% {
		display: block;
		opacity: 1;
		transform: scale(1, 1);
	}
	1% {
		display: block;
		opacity: 1;
		transform: scale(1, 1);

	}
	100% {
		display: none;
		opacity: 0;
		transform: scale(0.1, 1);

	}
}
/*All END*/


/* ----------------------------------------------------
メディアクエリ設定 (PC) 1000px～
---------------------------------------------------- */
@media screen and (min-width: 1001px) {


	header h1, header .logo {
		width: 173px;
		background: #CD2B1E;
		text-align: center;
		float: left;
		position: relative;
		z-index: 10;
	}
	.h-wrapper {
		display: flex;
		flex-wrap: wrap;
	}
	.h-wrapper nav {
		width: calc(100% - 173px);
		position: relative;
	}
	.drawer-overlay {
		background: rgba(0, 0, 0, 0.7);
		top: 112px;
	}
	.drawer-hamburger {
		display: none;
	}
	.drawer--right .drawer-nav {
		background: none;
		top: auto;
		left: auto;
		max-height: none;
		position: relative;
		right: 0;
		width: 100%;
	}
	.gnavi {
		height: 70px;
		display: flex;
		align-items: center;
		position: relative;
		font-weight: 300;
	}
	.gnavi a {
		text-decoration: none;
		font-weight: 500;

	}
	.gnavi > li {
		display: flex;
		height: 100%;
		cursor: pointer;
	}
	.gnavi > li > a {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		color: #111111;
		font-size: 1.6rem;
		padding: 0 21px;
	}
	.gnavi > li > a[data-toggle="dropdown"] {
		pointer-events: none;
	}
	.gnavi > li:first-child > a {
		padding-left: 38px;
	}

	.gnavi > li > a > span {
		padding-bottom: 9px;
		font-weight: 500;
		position: relative;
	}
	.gnavi > li > a > span::before {
		content: "";
		position: absolute;
		bottom: 0;
		width: 100%;
		height: 3px;
		display: block;
		background: rgba(193, 44, 31, 0);
		transform: scaleX(0);
		transition: .3s;
	}
	.gnavi > li > a > span::after {
		right: 0;
	}
	.gnavi > .active > a > span::before,
	.gnavi > li > a:hover > span::before {
		background: rgba(193, 44, 31, 1);
		transform: scaleX(1);
	}

	.drawer-nav {
		overflow: inherit;
	}
	.drawer-dropdown-menu {
		display: none;
		background: #fff;
		top: 70px;
		width: 100%;
		position: absolute;
		line-height: 1.6;
		padding: 23px 0 25px 37px;
	}
	.drawer-dropdown.active .drawer-dropdown-menu {
		display: block;
		opacity: 1;
		z-index: 999;
		animation: fade-in02 0.25s;
	}
	.drawer-dropdown-menu > li {
		display: flex;
		opacity: 0;
	}
	.drawer-dropdown-menu.on > li {
		opacity: 1;
		transition: .5s;
	}
	.drawer-dropdown-menu p {
		margin-bottom: 15px;
	}
	.drawer-dropdown-menu p span {
		color: #c12c1f;
		font-size: 1.6rem;
		font-weight: 500;
	}
	.drawer-dropdown-menu dt {
		font-size: 1.3rem;
		font-weight: 500;
		color: #999999;
		margin-bottom: 4px;
	}
	.drawer-dropdown-menu li {
		line-height: 1.3;
	}
	.nav-box {
		padding: 12px 0;
	}
	.nav-box + .nav-box {
		border-left: 1px solid #e6e6e6;
		padding: 12px 37px;
	}

	/*製品*/
	.nav-pro .drawer-dropdown-menu {
		left: 0;
	}
	.nav-pro .nav-box {
		width: 19.4%;
	}
	.nav-pro .src-pro {
		width: 41.8%;
	}
	.nav-pro .src-pro p {
		width: 100%;
	}
	.nav-pro .src-pro dd + dt {
		margin-top: 24px;
	}
	.nav-pro .src-pro .flbox {
		display: flex;
	}
	.nav-pro .src-pro .flbox dl:first-of-type {
		margin-right: 13%;
	}
	.nav-pro .src-pro .flbox dl + dl {
		margin: 0 2.5% 0 0%;
	}
	.nav-pro .src-pro dd .flbox li + li {
		margin-left: 24px
	}
	.nav-pro .src-pro li a {
		font-size: 1.5rem;
	}
	.nav-pro .src-pro li a::before {
		margin-top: 5px;
	}
	.nav-pro .src-pro li ul {
		margin: 8px 0 0 1em;
	}
	.nav-pro .src-job ul,
	.nav-pro .src-subj ul {
		margin-top: -3px;
	}
	/* .nav-pro .src-job li + li,
	.nav-pro .src-subj li + li {
		margin-top: 8px;
	} */
	.nav-pro .src-job ul + ul {
		margin-top: 35px;
	}
	.nav-pro .src-subj li a {
		font-size: 1.2rem;
	}
	.nav-pro .src-other {
		margin: -23px 0 -25px;
		padding: 35px 25px;
		border: none;
		background: #f5f5f5;
	}
	.nav-pro .src-other li {
		margin-bottom: 14px;
	}

	/*パートナー*/
	.nav-part .drawer-dropdown-menu {
		width: 45%;
		max-width: 465px;
		left: 70px;
	}
	.nav-part .src-prat {
		padding-right: 37px;
	}


	/*ユーザー*/
	.nav-user .drawer-dropdown-menu {
		width: auto;
		left: 192px;
	}
	.nav-user .drawer-dropdown-menu > li {
		display: block;
	}
	.nav-user .nav-box + .nav-box {
		padding-left: 0;
		border: none;
	}
	.nav-user .src-cmn li a {
		font-size: 1.4rem;
	}

	/*企業情報*/
	.nav-company .drawer-dropdown-menu {
		left: 70px;
		max-width: 1060px;
	}
	.nav-company .src-com01 {
		padding-right: 37px;
	}

	.nav-company ul + p {
		margin-top: 30px;
	}
	.nav-company .src-com03 {
		width: 17%;
	}
	.nav-company .src-com03 ul + p {
		margin-top: 50px;
	}
	.nav-company .src-com04 {
		position: relative;
		width: 24em;
	}
	/* .nav-company .src-com04 .sp-panel {
		display: flex;
		flex-direction: column;
	} */
	.nav-company .src-com04 .scr-policy {
		margin-top: 30px;
	}


	/*サブナビ*/
	.subnavi {
		position: absolute;
		right: 15px;
		top: 37px;
		width: 330px;
		display: flex;
		align-items: center;
	}
	.subnavi .h-search {
		transition: 3s;

	}
	.subnavi .src-btn {
		width: 32px;
		height: 32px;
		position: relative;
		cursor: pointer;
		margin: 0 5px 0 20px;

	}
	.subnavi .src-btn::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
		display: block;
		width: 15px;
		height: 15px;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.85 14.85'%3E%3Cg id='search_2' data-name='search 2'%3E%3Cg id='text'%3E%3Cpath d='M6,12.09a6,6,0,1,1,6.05-6A6,6,0,0,1,6,12.09ZM6,2a4,4,0,1,0,4.05,4A4,4,0,0,0,6,2Z' style='fill:%23111'/%3E%3Crect x='11' y='8.97' width='2' height='6.06' transform='translate(-4.97 12) rotate(-45)' style='fill:%23111'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center center / contain no-repeat;
	}
	.subnavi .on .src-btn::before {
		opacity: 0;
	}
	.subnavi .src-area {
		position: absolute;
		top: 1px;
		right: 50px;
		width: 25vw;
		display: none;
		transition: 3s;
	}
	.subnavi .on .src-area {
		transition: 3s;
		display: block;
		animation: fade-in 1s cubic-bezier(0.16, 1, 0.3, 1);
	}
	.subnavi .fade .src-area {
		transition: 3s;
		animation: fade-out 1s cubic-bezier(0.16, 1, 0.3, 1);
	}
	.subnavi .src-area div {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		overflow: hidden;
	}
	.subnavi .src-area form {
		flex: 1;
	}

	.subnavi .src-area .close {
		display: block;
		width: 14px;
		height: 14px;
		margin-left: 10px;
		flex-shrink: 0;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.03' height='15.03' viewBox='0 0 15.03 15.03'%3E%3Cg id='close_2' data-name='close 2'%3E%3Cg id='text'%3E%3Cline x1='0.71' y1='0.71' x2='14.33' y2='14.33' style='fill:none;stroke:%23111;stroke-miterlimit:8;stroke-width:2px'/%3E%3Cline x1='0.71' y1='14.33' x2='14.33' y2='0.71' style='fill:none;stroke:%23111;stroke-miterlimit:8;stroke-width:2px'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center center / contain no-repeat;
		opacity: 0;
	}
	.subnavi .on .src-area .close {
		opacity: 1;
		transition: 1s;
		transition-delay: 0.2s;
		cursor: pointer;
	}
}
@media only screen and (max-width: 950px) {
	.f-sub ul {
		flex-wrap: wrap;
		justify-content: center;

	}


}
@media only screen and (max-width: 1300px) {
	.drawer-dropdown-menu {
		padding: 1vw 0 1.5vw 2vw;
	}
	.drawer-dropdown-menu p span {
		font-size: 1.3vw;
	}
	.drawer-dropdown-menu dt, .link-list li a {
		font-size: 1vw;
	}
	.nav-box + .nav-box {
		padding: 1vw 1.5vw;
	}
	.nav-pro .src-pro .flbox dl + dl {
		margin: 0 1vw 0 2vw;
	}
	.nav-pro .src-pro li a {
		font-size: 1.2vw;
	}
	.nav-pro .src-subj li a {
		font-size: 0.9vw;
	}
	.nav-pro .src-other {
		margin: -1vw 0 -1.5vw;
		padding: 2vw 1.5vw;
	}
}

/* ----------------------------------------------------
メディアクエリ設定 (tablet and PC) 769px～
---------------------------------------------------- */
@media only screen and (min-width: 769px) {

	.sp-only {
		display: none !important;
	}

	/*tablet PC END*/
}



/* ----------------------------------------------------
メディアクエリ設定 (smartPhone only)   0～999px
---------------------------------------------------- */
@media screen and (max-width: 1000px) {

	header {
		height: 56px;
		background: #fff;
		z-index: 10;
		font-weight: 500;
	}
	header h1, header .logo {
		padding: 10px 0 0 10px;
	}
	header h1 img, header .logo img {
		display: none;
	}
	header h1 a, header .logo a {
		display: block;
		background: url(/common/img/logo_sp.png) center center / 120px auto no-repeat;
		width: 120px;
		height: 31px;
	}
	.drawer-hamburger {
		background: #c12c1f;
		padding: 17px 15px 27px;
		font-size: 0;
		z-index: 9999;
	}
	.drawer-hamburger:hover {
		background: #c12c1f;
	}
	.drawer--right.drawer-open .drawer-hamburger {
		right: 0;
	}
	.drawer-hamburger-icon, .drawer-hamburger-icon::after,
	.drawer-hamburger-icon::before {
		background: #fff;
		width: 105%;
	}

	.drawer--right.drawer-open header {
		background: #c12c1f;
	}
	.drawer--right.drawer-open header h1 a,
	.drawer--right.drawer-open header .logo a {
		background-image: url(/common/img/logo_sub.png);
	}
	.drawer--right.drawer-open #js-header {
		position: fixed !important;
	}
	.drawer-nav {
		width: 100%;
		right: 0 !important;
		background: #111;
		z-index: 9999;
		top: 56px;
		opacity: 0;
		display: none;
		transition: .3s;
	}
	.drawer--right.drawer-open .drawer-nav {
		top: 56px;
		opacity: 1;
		z-index: 999;
		transition: .3s;
		overflow-y: auto;
		display: block;
		height: 100%;
		right: 0;
	}
	.drawer-menu {
		height: 100%;
		padding-bottom: 30%;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}
	.drawer-nav a {
		color: #fff;
		text-decoration: none;
		display: block;
		line-height: 1.5;
	}
	.gnavi {
		width: 100%;
	}
	.gnavi > li > a {
		padding: 20px 10px 20px;
		border-bottom: 1px solid #e6e6e6;
		font-size: 1.6rem;
	}
	.gnavi > li > a span {
		font-weight: 500;
		display: block;
		position: relative;
	}
	.gnavi > li > a span::before,
	.gnavi > li > a span::after,
	.drawer-dropdown-menu p span::before,
	.drawer-dropdown-menu p span::after {
		content: "";
		bottom: 0;
		top: 0;
		right: 5px;
		margin: auto;
		position: absolute;
		display: block;
		background: #fff;
	}
	.gnavi > li:not(.drawer-dropdown) > a span::before {
		background: none;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		width: 10px;
		height: 10px;
		right: 10px;
		transform: rotate(45deg);
	}
	.gnavi > .drawer-dropdown > a span::before,
	.drawer-dropdown-menu p span::before {
		width: 13px;
		height: 1px;
		transition: .3s;
	}
	.gnavi > .drawer-dropdown > a span::after,
	.drawer-dropdown-menu p span::after {
		height: 13px;
		width: 1px;
		right: 11px;
		transition: .3s;
	}
	.gnavi > .drawer-dropdown.open a span::before,
	.drawer-dropdown-menu p span.open::before {
		transform: rotate(180deg);
	}
	.gnavi > .drawer-dropdown.open a span::after,
	.drawer-dropdown-menu p span.open::after {
		transform: rotate(90deg);
	}
	.drawer-dropdown-menu {
		padding: 0;
		background: #fff;
	}
	.drawer-dropdown-menu p {
		padding: 20px 10px 20px 10px;
		border-bottom: 1px solid #c12c1f;
	}
	/*.drawer-dropdown-menu .nav-box:last-of-type p,*/
	.drawer-dropdown-menu .nav-box:last-of-type .sp-panel:last-child {
		border: none;
	}
	/* .drawer-dropdown-menu .nav-box:last-of-type p:last-of-type {
		border-top: 1px solid #c12c1f;

	} */
	.drawer-dropdown-menu p span {
		display: block;
		width: 100%;
		font-size: 1.4rem;
		font-weight: 500;
		color: #c12c1f;
		position: relative;
	}
	.drawer-dropdown-menu p span::before,
	.drawer-dropdown-menu p span::after {
		background: #c12c1f;
	}
	.drawer-dropdown-menu .sp-panel {
		display: none;
		border-bottom: 1px solid #c12c1f;
		padding: 20px 15px 10px;
	}
	/* .drawer-dropdown-menu .sp-panel.open {
		display: block;
		border-bottom: 1px solid #c12c1f;
		padding: 20px 15px 15px;
	} */
	.nav-box + .nav-box,
	.gnavi .nav-box dl {
		padding: 0 !important;
		margin: 0 !important;
	}
	.link-list li {
		margin-bottom: 10px;
	}
	.link-list li a {
		font-size: 1.3rem !important;
		color: #111;
	}
	.link-list li a::before {
		margin-top: 7px;
	}

	.gnavi .flbox dt {
		font-size: 1.2rem;
		font-weight: 500;
		color: #999;
		margin-bottom: 10px;
	}
	.nav-pro .src-other {
		background: #f5f5f5;
	}

	/*製品*/
	.nav-pro .src-pro dd + dt {
		margin-top: 20px;
	}
	.nav-pro .src-pro dl + dl {
		margin-top: 25px !important;
	}
	.nav-pro dd .flbox {
		display: flex;
		margin-bottom: -5px;
	}
	.nav-pro dd .flbox li + li {
		margin-left: 20px;
	}
	.nav-pro .src-job ul + ul {
		margin-top: 30px;
	}
	.nav-pro .src-pro li ul {
		margin: 8px 0 0 1em;
	}
	.nav-pro .src-other {
		background: #f5f5f5;
		padding: 20px 15px !important;
		display: flex;
	}
	.nav-pro .src-other ul + ul {
		margin-left: 25px;
	}
	.subnavi .src-area {
		padding: 30px 15px 15px;
	}
	.subnavi .h-lang {
		margin-top: 30px;
	}
	.subnavi .h-lang ul {
		width: 10em;
		right: 0;
		margin: 10px auto 0;
	}
	.subnavi .h-lang p {
		color: #fff;
		justify-content: center;
	}
	.subnavi .h-lang a {
		font-size: 1.1rem;
		padding: 4px 0;
	}

	.subnavi .h-lang p::before {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0'%3E%3Cg id='lang_2' data-name='lang 2'%3E%3Cg id='text'%3E%3Cpath d='M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0ZM3,3A6.93,6.93,0,0,1,5.64,1.4,7.32,7.32,0,0,0,4.46,3.55H2.58A5.57,5.57,0,0,1,3,3ZM2,4.3H4.22a13.47,13.47,0,0,0-.47,3.3H1A6.9,6.9,0,0,1,2,4.3Zm0,7.35a6.9,6.9,0,0,1-1-3.3H3.75a13.47,13.47,0,0,0,.47,3.3Zm1,1.26a5.57,5.57,0,0,1-.46-.51H4.47a8.86,8.86,0,0,0,.44,1,6.19,6.19,0,0,0,.73,1.12A6.93,6.93,0,0,1,3,12.91Zm4.56,2-.35,0a2.75,2.75,0,0,1-.54-.35A5.34,5.34,0,0,1,5.26,12.4H7.6v2.54Zm0-3.29H5a12.76,12.76,0,0,1-.51-3.3H7.6v3.3Zm0-4.05H4.5A12.34,12.34,0,0,1,5,4.3H7.6V7.6Zm0-4H5.27a4.82,4.82,0,0,1,.31-.69A4.61,4.61,0,0,1,6.71,1.38,2.75,2.75,0,0,1,7.25,1L7.6,1V3.55Zm6.31.75a6.9,6.9,0,0,1,1,3.3H12.2a13.47,13.47,0,0,0-.47-3.3ZM12.91,3a5.57,5.57,0,0,1,.46.51H11.48a8.86,8.86,0,0,0-.44-1,6.19,6.19,0,0,0-.73-1.12A6.93,6.93,0,0,1,12.91,3ZM8.35,1,8.7,1a2.75,2.75,0,0,1,.54.35,5.34,5.34,0,0,1,1.45,2.17H8.35Zm0,3.29H11a12.76,12.76,0,0,1,.51,3.3H8.35Zm0,4.05h3.1a12.34,12.34,0,0,1-.51,3.3H8.35Zm.89,6.22a2.75,2.75,0,0,1-.54.35l-.35,0V12.4h2.33a4.82,4.82,0,0,1-.31.69A4.61,4.61,0,0,1,9.24,14.57Zm3.67-1.66a6.93,6.93,0,0,1-2.6,1.64,7.32,7.32,0,0,0,1.18-2.15h1.88A5.57,5.57,0,0,1,12.91,12.91Zm1-1.26H11.73a13.47,13.47,0,0,0,.47-3.3h2.74A6.9,6.9,0,0,1,13.91,11.65Z' style='fill:%23fff'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	}
	.subnavi .h-lang p::after {
		border-color: #fff transparent transparent transparent;
	}

	.contact-navi a {
		display: block;
		background: #fff url(/common/img/arrow_red.png) 95% center / 7px auto no-repeat;
		padding: 40px 0 40px 20px;
		text-decoration: none;
		color: #000;
		position: relative;
		z-index: 10;
		font-size: 13px;
		font-size: 1.3rem;
	}
	
	.contact-navi a + a {
		margin-top: 10px;
	}
	/*smartPhone END*/
}

/* ----------------------------------------------------
メディアクエリ設定 (smartPhone only)   0～768px
---------------------------------------------------- */
@media screen and (max-width: 768px) {
	body {
		font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	}
	.pc-only {
		display: none;
	}
	.pagetop {
		right: 0;
	}
	.pagetop img {
		width: 70%;
	}
	.f-navi, .f-sub, .f-other {
		display: none;
	}
	.f-logo {
		background: #98000d;
		padding: 20px 0;
		text-align: center;
	}
	footer .contact-navi {
		background: #f2f2f2;
		padding: 20px;
	}
	footer .contact-navi a {
		text-align: center;
		font-weight: bold;
		padding-left: 0;
		z-index: 1;
	}
	.f-logo img {
		max-width: 120px;
	}
	.copy {
		background: #79000a;
		text-align: center;
		color: #fff;
		padding: 30px 0;
		font-size: 10px;
		font-size: 1.0rem;
	}

	/*smartPhone END*/
}