@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap);

.header,
.footer{
	font-family: Roboto, 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic",  Helvetica, Arial, sans-serif;
}

.header ul.gnav li:nth-child(6),
.spHeadNav>ul>li:nth-child(6),
.pc-footer .ft_menu li:nth-child(7){
	display: none;
}

.HdMgn,
.noDisp{
	display: none;
}

.map-logo img {
				width: 100%;
}
/* -------- g-recaptcha -------- */
a.Btn_inBox.disable {opacity: 0.3;pointer-events: none;}
.g-recaptcha, p#warning {
	display: grid;
	justify-content: center;
	font-size: 1.4rem;
}
.errorValName{color: #f00;}
/* -------- Header -------- */
.wrapper,
.header{min-width: 980px;}
.header .header-outline .header-in {display: none;}
.header .header-outline{height: 36px;background: #17AFEC}

.header .logo{
	top: 0;
	padding: 0;
	width: 22px;
	position: relative;
	background: none;
}
.header .header-gnav {
	position: absolute;
	top: 0;
	background: none;
	font-size: 11px;
	font-size: 1.1rem;
	line-height: 1;
}

.header .header-in {
	width: 100%;
	/* max-width: 1280px; */
	max-width: 100%!important;
	padding: 0 20px;
}
.header ul.gnav{margin-left: 30px;
}

.header ul.gnav>li{
	height: 36px;
	padding-left: 0.3rem;
	}
.header ul.gnav>li.inquiry,
.header ul.gnav>li.support{
	margin-left: 1.2rem;
}
.header ul.gnav>li a{
	border: none;
	color: #fff;
	border-radius: 30px;
	font-weight: normal;
}
.header ul.gnav>li.inquiry a,
.header ul.gnav>li.support a{
	border: none;
	background-color: #fff;
	color: #17AFEC;
}

.header ul.gnav>li a:hover {
	border: none;
	color: #fff;
	background-color: #5FC5ED;
	border-bottom: none;
}


.header ul.gnav>li .submenu a {
	border-radius: 0;
}

.header ul.gnav>li.active a,
.header ul.gnav>li.gnav-drop:hover span a,
.header ul.gnav>li.on span a {
	border-bottom: none;
	color: #fff;
	background-color: #5FC5ED;
}
.header ul.gnav>li.gnav-drop span a{
	padding-right: 0.5rem;
}
.header ul.gnav>li.gnav-drop .submenu a {
	background-color: #fff;
	border-bottom: 3px solid #fff;
}
.header ul.gnav>li.gnav-drop .submenu a:hover {
	background-color: #fff;
	color: rgba(37,37,37,0.7);
	border-bottom: 3px solid #019bd9;
}


.header ul.gnav>li a>div {
	padding:  0.45rem 0rem;
	margin:  0.8rem 0.8rem;
}

.header ul.gnav>li a>div:not(.last){border: none;}
.header ul.gnav>li a{
	padding: 0;
	margin: 0;}

.header ul.menu-outline li a {
	padding: 1.5rem 2.5rem;
	color: #252525
}

.header ul.gnav>li.gnav-drop a {position: relative;}
.header ul.gnav>li.gnav-drop a div{padding:  0.4rem 0.8rem 0.4rem 0rem;}
.header ul.gnav>li.gnav-drop a div::after{
	content: '';
	position: absolute;
	width: 14px;
	height: 14px;
	top: 0.3rem;
	right: 0.5rem;
	/* background-image: url("/src/images/gnav/icon_arrow.svg");
	background-size: cover; */
	background: #fff;
	mask-position: center center;
	-webkit-mask-position: center center;
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-image:url("/src/images/gnav/icon_arrow.svg");
	mask-image: url("/src/images/gnav/icon_arrow.svg");
}
.header ul.gnav>li.gnav-drop:hover a div::after{transform: rotate(180deg);}
.header ul.menu-product li a {
	padding: 2.2rem 1.5rem 
}

.header ul.submenu-in{
	max-width: 980px;
}
.header ul.submenu-in li:not(:last-child):after{border-right: none;}

/* -------- Footer -------- */
.pc-footer {
	padding: 0 2rem 3rem;
	padding: 0;
	margin: 0;
	background: #5B5E66;
}
.pc-footer,
.pc-footer a,
.ft_menu a{
	color: #fff;
	text-decoration: none;
	min-width: fit-content;
}

.pc-footer .menu a{
	display: block;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: normal;
}


.pc-footer a:hover,
.ft_menu a:hover{
	color: #aeaeae;
	opacity: 0.6;
}

.pc-footer .menu h3{
	border-bottom: 1px solid #fff;
	padding: 1rem 0;
	margin-bottom: 1rem;
	position: relative;
	line-height: 1;
	text-align: left;
	font-weight: bold;
	font-size: 16px;
	font-size: 1.6rem;
}

#case .pc-footer .menu h3{
	color: #fff;
	/* font-weight: normal; */
	font-size: 20px;
	font-size: 2.0rem;
	letter-spacing: 0;
	margin-bottom: 0;
	text-align: left;
}

.pc-footer .menu h3::after{
	
	content: '';
	position: absolute;
	width: 12px;
	height: 12px;
	right: 	0.5rem;
	top: 0;
	bottom: 0;
	margin: auto;
	background: #fff;
	mask-position: center center;
	-webkit-mask-position: center center;
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-image:url("/src/images/gnav/icon_arrow.svg");
	mask-image: url("/src/images/gnav/icon_arrow.svg");
}

.pc-footer .menu ul{
	/* margin-left: 2rem; */
}
.pc-footer .menu li{
	/* list-style-type: disc; */
	line-height: 2.3;
}

.pc-footer .footer_in{
	position: relative;
	max-width: 980px;
	max-width: 1240px;
	min-width: 980px;
	margin: 0 auto;
	padding: 0 20px;
}

.pc-footer .footer_in .flex{
	letter-spacing: 0;
}

#page-top {
	display: block;
	position: absolute;
	/* z-index: 9999; */
	top: -18px;
	right: 0;
border-radius: 30px;
width: 40px;
height:40px;
background: #5B5E66;
cursor: pointer;
}
#page-top:hover {
	background: #5B5E66;
}
#page-top a{
	display: block;
	width: 100%;
	height:  100%;
}
#page-top a img{display: none;}
#page-top a:after{
	/* transition: all 0.3s; */
	content: '';
	position: absolute;
	width: 14px;
	height: 14px;
	left: 	14px;
	left: 	0;
	right: 	0;
	top: 0;
	bottom: 0;
	margin: auto;
	background: #fff;
	mask-position: center center;
	-webkit-mask-position: center center;
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-image:url("/src/images/gnav/icon_arrow_up.svg");
	mask-image: url("/src/images/gnav/icon_arrow_up.svg");
}
#page-top:hover a:after{
	top: -5px;
}



.footer-box{
				padding: 40px 0;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				justify-content: space-between;
				gap: 20px;
}

.footer-box .left{
	/* max-width: 724px; */
	width: 100%;
}
.footer-box .right{
	max-width: 228px;
	min-width: 228px;
	padding: 20px;
		background: #686B74;
		border-radius: 4px;
		height: auto;
		display: flex;
						justify-content: space-between;
						flex-direction: column;
	}
.footer-box .right .banner li{
	margin-bottom: 10px;
}
.footer-box .right .foot-tel{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}	
.footer-box .left .flex{
				display: flex;
				align-items: stretch;
			gap: 20px;
			justify-content: flex-start;
		}
	
.footer-box .left .flex .logo,
.footer-box .left .flex .corp{width: 100%;max-width:170px;margin-bottom: 30px}
.footer-box .left .flex .exp,
.footer-box .left .flex .service{
	width: 100%;
	/* max-width:536px; */
	margin-bottom: 30px
}

.footer-box .left .flex .logo{
	min-width: 160px;
}

.footer-box .left .flex .logo .company{
	padding: 10px 0;
	font-size: 0.8rem;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
}
.footer-box .left .flex .logo .company p{}
.footer-box .left .flex .logo .company img{margin: 0 5px 10px;}

.footer-box .left .flex .exp{
	background: #686B74;
	padding: 10px 10px 10px 10px;
	font-size: 1.1rem;
	line-height: 1.7;
	border-radius: 4px;
	display: flex;
		align-items: center;
}
.footer-box .left .flex .exp ul li{
	/* list-style-type: disc; */
	white-space: nowrap;
}


.footer-box .left .footer_btn{
	display: flex;
}
.footer-box .left .footer_btn li{
	width: 98%;
	padding: 0;
	position: relative;
	/* margin-right: 4% */
}
.footer-box .left .footer_btn li:last-child{
	margin-right: 0
}


.footer-box .left .footer_btn li a{
	display: block;
	border: 1px solid #fff;
	border-radius:90px;
padding: 10px 20px;
}
.footer-box .left .footer_btn li a::after{
content: '';
position: absolute;
width: 12px;
height: 12px;
top: 15px;
top: 0;
bottom: 0;
margin: auto;
right: 	20px;
background: #fff;
mask-position: center center;
-webkit-mask-position: center center;
mask-size: contain;
-webkit-mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
-webkit-mask-image:url("/src/images/gnav/icon_arrow_right.svg");
mask-image: url("/src/images/gnav/icon_arrow_right.svg");
}

.footer-box .left .footer_btn li a:hover{
	background: #696A73;
}

.pc-footer .ft_menu{
	background: #474A50;
	color: #fff;
	padding: 30px 0;
	font-size: 1.2rem;
	/* margin-top: 30px; */
}
.pc-footer .ft_menu .footer_in{
	width: 100%;
	max-width: 1280px;
	/* max-width: 980px; */
	margin: 0 auto;
}
.pc-footer .ft_menu .flex{
	letter-spacing: 0;
	justify-content: space-between;
}

.pc-footer .ft_menu li{
	margin-right: 1.4rem;
}

/* KS TOP */
body#wrap .wrapper .page .banner-area {
	padding: 0 0 6rem;
}


@media (max-width: 768px) {
	.wrapper, .header {min-width: auto;}
	.header .header-outline{height: 44px;}
	.header .header-in {
		max-width: 100vw;
		height: 36px;
		height: 44px;
		padding: 0;
	}
	.header .header-gnav .logo {
		width: 14px;
		top: 0;
		left: 20px;
		padding: 0;}
		
		.gnavbtn, .menu-trigger span, .menu-trigger span::after, .menu-trigger span::before, .menu-trigger span.is-open, .menu-trigger span.is-open::after, .menu-trigger span.is-open::before {
			width: 14px;
			height: 1px;
			background: #fff;
		}
		.menu-trigger {
			width: 14px;
			height: 12px;
		}
		.spHeadNav{
			top: 36px;
			top: 44px;
			padding: 0 6vw;
		}
		.spHeadNav.is-open{
			letter-spacing: normal;
		}
		.spHeadNav>ul{
			height: auto;
		}
		.spHeadNav>ul>li {
			text-align: left;
			
		}
		.spHeadNav>ul.snav>li:nth-last-child(1){
			border-bottom: none;
		}
		
		.spHeadNav>ul>li>a, .spHeadNav>ul>li>p {
			font-size: 14px;
			font-size: 1.4rem;
			display: block;
			padding: 1.6rem 0;
			color: #333;
			text-decoration: none;
		}
		.spHeadNav ul li p.selected {
			background: none;
			color: #333;
			-webkit-transition: 0;
			transition: 0;
		}
		.spHeadNav ul li p a:hover,
		.spHeadNav ul li p a:active,
		.spHeadNav ul li p a:focus{
			color: #333;
		}
		.spHeadNav ul.snav>li.gnav-exlink p,
		.spHeadNav ul.snav>li.gnav-drop p{
			position: relative
		}
		
		.spHeadNav ul.snav>li.gnav-exlink p::after,
		.spHeadNav ul.snav>li.gnav-drop p::after {
			content: '';
			position: absolute;
			width: 12px;
			height: 12px;
			top: 1.6rem;
			right: 0;
			background: #333;
			mask-position: center center;
			-webkit-mask-position: center center;
			mask-size: contain;
			-webkit-mask-size: contain;
			mask-repeat: no-repeat;
			-webkit-mask-repeat: no-repeat;
		}
		.spHeadNav ul.snav>li.gnav-drop p.selected::after{transform: rotate(180deg);}
		
		.spHeadNav ul.snav>li.gnav-drop p::after {
			-webkit-mask-image: url(/src/images/gnav/icon_arrow.svg);
			mask-image: url(/src/images/gnav/icon_arrow.svg);
		}
		.spHeadNav ul.snav>li.gnav-exlink p::after {
			-webkit-mask-image: url(/src/images/gnav/icon_exlink.svg);
			mask-image: url(/src/images/gnav/icon_exlink.svg);
		}
		ul.menu_inner_sp{
			padding-left: 1rem;
		}
		ul.menu_inner_sp li{
			width: 100%;
			border: none !important;
			text-align: left;
			list-style: disk	!important;
			list-style-type: 	disk	!important;
			color: #000;
		}
		.spHeadNav ul.snav2>li{
			width: 50%;
			border-bottom: none;
			/* text-align: center; */
			padding-right: 0.5em;
			position: relative;
		}
		.spHeadNav ul.snav2>li:nth-last-child(1){
			padding-right: 0;
			padding-left: 1.0rem;
		}
		
		.spHeadNav ul.snav2{
			display: flex;
		}
		.spHeadNav ul.snav2>li a{
			border: 1px solid #222;
			border-radius: 30px;
			padding: 1.0rem 0 1.0rem 2rem;
			
			font-size: 12px;
			font-size: 1.2rem;
		}
		
		.spHeadNav ul.snav2>li a::after {
			content: '';
			position: absolute;
			width: 12px;
			height: 12px;
			top: 1.0rem;
			right: 1.6rem;
			background: #333;
			mask-position: center center;
			-webkit-mask-position: center center;
			mask-size: contain;
			-webkit-mask-size: contain;
			mask-repeat: no-repeat;
			-webkit-mask-repeat: no-repeat;
			-webkit-mask-image: url(/src/images/gnav/icon_arrow_right.svg);
			mask-image: url(/src/images/gnav/icon_arrow_right.svg);
		}
		
		
		.spHeadNav .corp{
			font-size: 12px;
			font-size: 1.2rem;
		}
		.spHeadNav .corp img{
			max-width: 100px;
			padding: 32px 0 10px;
		}
		.spHeadNav .corp .number{
			font-family: 'Roboto';
			font-size: 2.4rem;
			padding: 4px 0 8px;
			display: inline-block;
			
		}
		
		.footer .footer_in {
			letter-spacing: 0;
		}
		
		.footer,
		.pc-footer .menu a{
		font-size: 3.3vw;
	}
	.pc-footer .menu li{
		line-height: 2.6;
	}
		.footer-box,
		.footer-box .left,
		.footer-box .left .flex {
						display: flex;
						flex-direction: column;
		}
.footer-box .left .flex .logo,
.footer-box .left .flex .corp{
			max-width: none;
			margin-bottom: 1.6vw;
		}
		.footer-box .left .flex .logo .company{
			height: auto;
		}
		.footer-box .left .flex .logo .company img{
			margin: 0 0 10px;
			max-width: none;
		}
		.footer-box .left .flex .logo .company a{padding: 0 5px;}
		
		.footer-box .left .footer_btn {
						display: flex;
						flex-direction: row;
						margin-bottom: 5vw;
		}
		
		.footer-box .left .flex .exp,
		.footer-box .left .flex .service{margin-block: 1vw;}
		
		.footer-box .left .footer_btn li a {
						border-radius: 90px;
						padding: 0.5em 1.2em;
		}
		
		.pc-footer .menu h3{
			font-weight: normal;
		}
		.pc-footer .menu h3::after{
			display: none;
		}
		
		
		.footer-box .right,
		.footer-box .left .flex .exp{
			display: none;
		}
		.pc-footer .ft_menu .footer_in{
			max-width: 100%;
		}
		.pc-footer .footer_in {
			min-width: auto;
			padding: 0 7vw;
		}
		
		.pc-footer .ft_menu .flex{
			display: block;
			text-align: center;
		}
		.pc-footer .ft_menu li{
			display: inline-block;
		}
		.pc-footer .ft_menu li a{
			line-height: 2.6;
		}
		
		.pc-footer .ft_menu .copyright{
			margin-top: 30px;
		}
	
}