@charset "UTF-8";


/* -------------------------------------------

header

------------------------------------------- */
#engagecros header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 2.5rem;
	height: 7.2rem;
	position: relative;
	z-index: 100;
	position: relative;
	position: sticky;
	top: 0;
	background: #fff;
	z-index: 999;
	box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.15);
}

@media screen and (max-width: 768px) {
#engagecros 	header {
		padding: 0 2rem;
		height: 6rem;
	}
}

#engagecros header h1 {
	width: 16rem;
	line-height: 1;
	margin-right: 2rem;
}

#engagecros header > div {
	display: flex;
	align-items: center;
}

#engagecros .header-tel {
	display: flex;
	align-items: center;
	font-size: 1rem;
	font-weight: 500;
}

#engagecros .header-tel a {
	display: flex;
	align-items: center;
	font-family: var(--font-oswald);
	font-weight: 600;
	font-size: 1.2rem;
}

#engagecros .header-tel a img {
	width: 1.5rem;
	margin-right: 0.5rem;
}

#engagecros .header-contact {
	margin-left: 1.2rem;
}

#engagecros .header-contact a {
	font-size: 1.2rem;
	border: solid 0.2rem var(--red);
	color: var(--red);
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 3.2rem;
	padding: 0 1rem;
}



/* -------------------------------------------

nav

------------------------------------------- 
#engagecros .gnav {
	position: relative;
}

#engagecros .gnav ul {
	display: flex;
	font-size: 1.2rem;
}

#engagecros .gnav ul li:not(:last-child) {
	margin-right: 1.7rem;
}

#engagecros .gnav ul li {
	display: flex;
	align-items: center;
	height: 7.2rem;
}

#engagecros .gnav ul li a:hover {
	opacity: 1;
	color: var(--red);
}

#engagecros .gnav-service-ttl {
	display: flex;
	align-items: center;
	transition: all .3s;
}

#engagecros .gnav-service-ttl:hover {
	color: var(--red);
	cursor: pointer;
}

#engagecros .gnav-service-ttl::after {
	content: "";
	width: 0;
	height: 0;
	border-left: 0.4rem solid transparent;
	border-right: 0.4rem solid transparent;
	border-top: 0.4rem solid #000;
	margin-left: 0.2rem;
	transition: all .3s;
}

#engagecros .gnav-service-ttl:hover::after {
	border-top: 0.4rem solid var(--red);
}
*/

/* gnav-service-content 
#engagecros .gnav-service-content {
	display: block;
	position: absolute;
	top: 7.2rem;
	left: 0;
	width: 100%;
	padding: 3rem 6rem;
	background: #fff;
	opacity: 0;
	transition: all .3s;
	transform: translateY(1rem);
	box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.15);
	z-index: 999;
	pointer-events: none;
}

#engagecros .gnav-service-content.open {
	opacity: 1;
	transform: translateY(0);
	pointer-events: all;
}

#engagecros .gnav-service-content img {
	width: 4.8rem;
	margin-right: 1.5rem;
}

#engagecros .gnav-service-content i {
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translate(0, -50%);
}

#engagecros .gnav-service-content > div {
	width: 32%;
}

#engagecros .gnav-service-content a {
	display: flex;
	align-items: center;
	position: relative;
	height: 8rem;
	padding: 2rem;
}

#engagecros .gnav-service-content a:hover {
	opacity: 1;
	background: rgba(248, 248, 248, 1);
}

#engagecros .gnav-service-content ul {
	display: flex;
	flex-wrap: wrap;
}

#engagecros .gnav-service-content ul li {
	width: 32%;
	margin-right: 2%;
}

#engagecros .gnav-service-content ul li:nth-child(3n) {
	margin-right: 0;
}

#engagecros .gnav-service-content a > span {
	display: flex;
	flex-direction: column;
}

#engagecros .gnav-service-content a > span > span:nth-child(1) {
	font-size: 1.2rem;
}

#engagecros .gnav-service-content a > span > span:nth-child(2) {
	font-family: var(--font-sofia);
	font-weight: 600;
	font-size: 1.8rem;
}
*/


/* -------------------------------------------

kv

------------------------------------------- */
#engagecros .kv {
	background: url(../../engagecros01-a/images/kv-bg.jpg) no-repeat center / cover;
	height: 54rem;
	margin-top: -54rem; 
  /* margin-top: -47rem;*/
	position: relative;
	color: #fff;
	z-index: -1;
}

@media screen and (max-width: 768px) {
#engagecros .kv {
		height: auto;
		margin: 0;
	}
}

/* breadcrumb */
#engagecros .breadcrumb {
	display: flex;
	font-size: 1.1rem;
	position: absolute;
	top: 1rem;
	left: calc((100% - 96rem) / 2);
}

#engagecros .breadcrumb a {
	color: #fff;
}

#engagecros .breadcrumb li {
	display: flex;
	align-items: center;
}

#engagecros .breadcrumb li:not(:last-child)::after {
	content: "";
	width: 0.4rem;
	height: 0.4rem;
	border-top: solid 0.12rem #fff;
	border-right: solid 0.12rem #fff;
	transform: rotate(45deg);
	display: block;
	margin: 0 0.8rem 0 0.5rem;
}

/* wrap */
#engagecros .kv .wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	height: 54rem;
	padding-top: 5rem;
}

#engagecros .kv h2 {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}

#engagecros .kv h2 > span:nth-child(1) {
	font-size: 3.6rem;
}

#engagecros .kv h2 > span:nth-child(2) {
	font-size: 8.8rem;
}

#engagecros .kv .wrap figure {
	width: 75%;
  margin: 0;
}

@media screen and (max-width: 768px) {
#engagecros .kv .wrap {
		height: auto;
		padding-top: 2.5rem;
	}

#engagecros .kv h2 {
		margin-bottom: 2.5rem;
	}

#engagecros .kv h2 > span:nth-child(1) {
		font-size: 2.2rem;
	}

#engagecros .kv h2 > span:nth-child(2) {
		font-size: 5.6rem;
	}
}



/* -------------------------------------------

slide

------------------------------------------- */
#engagecros .slide-bnr {
	padding-top: 2rem;
	padding-bottom: 6rem;
}

@media screen and (max-width: 768px) {
#engagecros .slide-bnr {
		padding-bottom: 4rem;
	}
}

#engagecros #loopslider,
#engagecros #loopslider2 {
	margin: 0 auto;
	width: 100%;
	height: 40px;
	text-align: left;
	position: relative;
	overflow: hidden;
}

#engagecros #loopslider ul,
#engagecros #loopslider2 ul {
	height: 40px;
	float: left;
	display: inline;
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
}

#engagecros #loopslider ul li,
#engagecros #loopslider2 ul li {
	width: 1215px;
	height: 40px;
	float: left;
	display: inline;
	overflow: hidden;
}

#engagecros #loopslider ul:after,
#engagecros #loopslider2 ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

#engagecros #loopslider ul,
#engagecros #loopslider2 ul {
	display: inline-block;
	overflow: hidden;
}




/* -------------------------------------------

trouble

------------------------------------------- */
/* wrap-1 */
#engagecros .trouble .wrap-1 {
	background: var(--bg-grey);
	position: relative;
	margin-bottom: 7rem;
	padding-bottom: 1rem;
}

#engagecros .trouble .wrap-1::before {
	content: "";
	width: 0;
	height: 0;
	border-left: 30rem solid transparent;
	border-right: 30rem solid transparent;
	border-top: 6rem solid var(--bg-grey);
	position: absolute;
	left: 0;
	bottom: -5.9rem;
}

@media screen and (max-width: 768px) {
#engagecros	.trouble .wrap-1 {
		width: 90vw;
		margin: 0 auto 4rem auto;
	}

#engagecros .trouble .wrap-1::before {
		border-left: 45vw solid transparent;
		border-right: 45vw solid transparent;
		border-top: 3.5rem solid var(--bg-grey);
		bottom: -3.4rem;
	}
}

#engagecros .trouble .wrap-1 > div {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	top: -3rem;
}

#engagecros .trouble .wrap-1 h2 {
	font-size: 2.3rem;
	font-weight: 500;
	padding-top: 2.5rem;
}

#engagecros .trouble .wrap-1 > div figure {
	width: 14rem;
	position: relative;
  margin: 0px;
}

@media screen and (max-width: 768px) {
#engagecros .trouble .wrap-1 > div {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
		top: -2rem;
		padding: 0 1.8rem;
	}

#engagecros .trouble .wrap-1 h2 {
		font-size: 1.45rem;
		padding: 1.6rem 0 0 0;
		white-space: nowrap;
	}

#engagecros .trouble .wrap-1 > div figure {
		width: 7rem;
	}
}

/* ul */
#engagecros .trouble ul {
	display: flex;
	justify-content: space-between;
	padding: 0 2rem;
	position: relative;
	top: -1.5rem;
}

@media screen and (max-width: 768px) {
#engagecros .trouble ul {
		top: -0.5rem;
	}
}

#engagecros .trouble ul li {
	width: 31%;
	background: #fff;
  list-style: none;
}

#engagecros .trouble ul li dt {
	background: var(--grey);
	color: #fff;
	width: 94%;
	margin: -1.8rem auto 1rem auto;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 3.6rem;
	font-weight: bold;
	padding-bottom: 0.15rem;
	font-size: 1.3rem;
	border-radius: 10rem;
	position: relative;
}

@media screen and (max-width: 768px) {
#engagecros .trouble ul {
		padding: 0 1.5rem;
	}

#engagecros .trouble ul li {
		width: 32%;
	}

#engagecros .trouble ul li dt {
		height: 2.8rem;
		font-size: 0.85rem;
		text-align: center;
		line-height: 1.2;
	}
}

#engagecros .trouble ul li dt::before {
	content: "";
	width: 0;
	height: 0;
	border-left: 0.7rem solid transparent;
	border-right: 0.7rem solid transparent;
	border-top: 1rem solid var(--grey);
	position: absolute;
	left: calc(50% - 1rem);
	bottom: -0.9rem;
}

#engagecros .trouble ul li figure {
	padding: 0 2rem;
}

#engagecros .trouble ul li dd span {
	display: block;
	padding: 0 2rem 1rem 2rem;
	margin-top: 0.5rem;
}

@media screen and (max-width: 768px) {
 #engagecros .trouble ul li figure {
		padding: 0 0.5rem;
	}

 #engagecros .trouble ul li dd span {
		padding: 0 0.8rem 1rem 0.8rem;
		font-size: 1.1rem;
		line-height: 1.4;
	}
}

/* wrap-2 */
#engagecros .trouble .wrap-2 h3 {
	text-align: center;
	font-weight: 500;
	color: var(--red);
	font-size: 2.8rem;
	margin-bottom: 3.5rem;
}

#engagecros .trouble .wrap-2 ul {
	top: 0;
}

#engagecros .trouble .wrap-2 ul li {
	border: solid 0.25rem var(--red);
	list-style: none;
}

#engagecros .trouble .wrap-2 ul li dt {
	background: var(--red);
}

#engagecros .trouble .wrap-2 ul li dt::before {
	border-top: 1rem solid var(--red);
}

@media screen and (max-width: 768px) {
	#engagecros .trouble .wrap-2 h3 {
		margin-bottom: 3rem;
	}
 	#engagecros .wrap-2 .mktoForm {
    max-width: 100% !important;
}
  #engagecros .wrap-2 select {
  min-height: 40px;
  padding: 1.6rem 2rem 1.5rem 2rem!important;
}
    
	#engagecros .wrap-2 .mktoFormRow:nth-of-type(2),
 	#engagecros .wrap-2 .mktoFormRow:nth-of-type(5),
  #engagecros .wrap-2 .mktoFormRow:nth-of-type(7) {
    margin-bottom: 6px !important;
}
#engagecros .wrap-2 .mktoFormRow:nth-of-type(14),
#engagecros .wrap-2 .mktoFormRow:nth-of-type(15){
    display: none;
}
}



/* -------------------------------------------

about

------------------------------------------- */
#engagecros .about .wrap {
	background: var(--bg-red);
	position: relative;
	padding: 3rem;
}

#engagecros .about figure {
	position: absolute;
	left: 1rem;
	top: -1.7rem;
	width: 19rem;
}

#engagecros .about h2 {
	text-align: center;
	font-size: 2.6rem;
	margin-bottom: 2.5rem;
	font-weight: 500;
}

@media screen and (max-width: 768px) {
	#engagecros .about .wrap {
		width: calc(100% - 4rem);
		margin: 0 auto;
		padding: 3rem 2.5rem 2.5rem 2.5rem;
	}

	#engagecros .about figure {
		position: absolute;
		left: 0.5rem;
		top: -0.7rem;
		width: 40%;
	}

	#engagecros .about h2 {
		font-size: 2.2rem;
		margin-bottom: 2.5rem;
		text-align: right;
	}

	#engagecros .about p {
		font-size: 1.3rem;
	}
}



/* -------------------------------------------

function

------------------------------------------- */
/* h3 */
#engagecros .function h3 {
	background: var(--red);
	color: #fff;
	font-size: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 4.8rem;
	padding-bottom: 0.2rem;
	overflow: hidden;
	position: relative;
}

#engagecros .function h3::before {
	content: "01";
	line-height: 1;
	font-family: var(--font-oswald);
	font-weight: 400;
	font-size: 4.8rem;
	color: #fff;
	position: absolute;
	right: 1.5rem;
	bottom: -0.9rem;
	opacity: 0.3;
}

#engagecros .function ul li:nth-child(2) h3::before {
	content: "02";
}

#engagecros .function ul li:nth-child(3) h3::before {
	content: "03";
}

#engagecros .function ul li:nth-child(4) h3::before {
	content: "04";
}

/* ul */
#engagecros .function ul {
    margin: 0;
    padding: 0;
}
#engagecros .function ul li {
	border: solid 0.5rem #f2f2f2;
  list-style: none;
}

#engagecros .function ul li:not(:last-child) {
	margin-bottom: 2rem;
}

#engagecros .function ul li > div {
	padding: 1.5rem;
	display: flex;
	justify-content: space-between;
}

#engagecros .function ul li > div > figure {
	width: 65%;
}

#engagecros .function ul li > div > p {
	width: 32%;
}

@media screen and (max-width: 768px) {
	#engagecros .function ul {
		padding: 0 2rem;
	}

	#engagecros .function ul li > div {
		padding: 2rem;
		display: block;
	}

	#engagecros .function ul li > div > figure {
		width: 100%;
	}

	#engagecros .function ul li > div > p {
		padding-left: 0;
		width: 100%;
	}
}



/* -------------------------------------------

comparison

------------------------------------------- */
@media screen and (max-width: 768px) {
	#engagecros .comparison {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}



/* -------------------------------------------

faq

------------------------------------------- */
#engagecros .faq > dl:not(:last-of-type) {
	margin-bottom: 2rem;
}

/* faq */
#engagecros .faq-ttl {
	background: var(--bg-grey);
	display: flex;
	align-items: center;
	position: relative;
	padding: 1.5rem 4.5rem 1.5rem 1.5rem;
	transition: all .3s;
}

#engagecros .faq-ttl:hover {
	opacity: 0.5;
	cursor: pointer;
}

#engagecros .faq-ttl > span:nth-child(1),
#engagecros .faq-content > span:nth-child(1) {
	width: 3.6rem;
	height: 3.6rem;
	color: #fff;
	background: var(--red);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-anton);
	font-size: 2rem;
	padding-left: 0.1rem;
}

#engagecros .faq-ttl > span:nth-child(2),
#engagecros .faq-content > span:nth-child(2) {
	width: calc(100% - 3.6rem);
	padding-left: 1rem;
	font-size: 1.5rem;
	line-height: 1.4;
}

#engagecros .faq-ttl i {
	width: 1.4rem;
	height: 1.4rem;
	border-bottom: solid 0.15rem #808080;
	border-right: solid 0.15rem #808080;
	transform: rotate(45deg);
	position: absolute;
	right: 2rem;
	top: calc(50% - 0.7rem);
	transition: all .3s;
}

#engagecros .faq-ttl.open i {
	transform: rotate(225deg);
	margin-top: 0.4rem;
}

#engagecros .faq-content {
	display: flex;
	padding: 1.5rem 1.5rem 0 1.5rem;
}

#engagecros .faq-content > span:nth-child(1) {
	border: solid 0.3rem var(--red);
	color: var(--red);
	background: #fff;
}

#engagecros .faq-content > span:nth-child(2) {
	font-size: 1.4rem;
	padding-top: 0.5rem;
}

#engagecros .faq-content a {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: var(--red);
	width: 24rem;
	height: 4.8rem;
	margin-top: 1rem;
	padding-left: 1rem;
	padding-bottom: 0.2rem;
}

#engagecros .faq-content a i {
	margin-left: 1rem;
	margin-top: 0.15rem;
}

@media screen and (max-width: 768px) {
	#engagecros .faq {
		padding-left: 2rem;
		padding-right: 2rem;
	}

	#engagecros .faq-ttl > span:nth-child(2) {
		font-size: 1.4rem;
	}
}



/* -------------------------------------------

contact

------------------------------------------- */
#engagecros #contact {
	display: block;
	padding-top: 7.2rem;
	margin-top: -7.2rem;
}

#engagecros .contact h2 + div {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 5.6rem;
	color: #fff;
	font-size: 1.6rem;
	padding-bottom: 0.2rem;
	width: 36rem;
	border-radius: 10rem;
	background: var(--red);
	margin: 0 auto;
	position: relative;
	margin-bottom: 3.5rem;
}

@media screen and (max-width: 768px) {
	#engagecros .contact h2 + div {
		width: 32rem;
	}
}

#engagecros .contact h2 + div::before {
	content: "";
	width: 0;
	height: 0;
	border-left: 1.4rem solid transparent;
	border-right: 1.4rem solid transparent;
	border-top: 1.4rem solid var(--red);
	position: absolute;
	left: calc(50% - 1.4rem);
	bottom: -1.3rem;
}

#engagecros .contact h2 + div + p {
	margin-bottom: 3rem;
}

@media screen and (max-width: 768px) {
	#engagecros .contact h2 + div + p {
		padding: 0 2rem;
	}
}

/* wrap-1 */
#engagecros .contact .wrap-1 {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 3rem;
}

#engagecros .contact .wrap-1 > figure {
	width: 42rem;
}

#engagecros .contact .wrap-1 a {
	display: flex;
	align-items: center;
}

#engagecros .contact .wrap-1 a img {
	width: 6rem;
	margin-right: 0.6rem;
}

#engagecros .contact .wrap-1 a > span {
	display: flex;
	flex-direction: column;
	padding-top: 2.5rem;
}

#engagecros .contact .wrap-1 a > span > span {
	line-height: 1;
	color: var(--red);
	font-family: var(--font-oswald);
	font-weight: 600;
	font-size: 4.8rem;
}

#engagecros .contact .wrap-1 a > span > i {
	display: block;
	padding: 0.3rem 0 0 1rem;
	font-size: 1.5rem;
}

@media screen and (max-width: 768px) {
	#engagecros .contact .wrap-1 > figure {
		width: 28rem;
	}

	#engagecros .contact .wrap-1 a {
		text-decoration: none;
	}

	#engagecros .contact .wrap-1 a img {
		width: 4.8rem;
	}

	#engagecros .contact .wrap-1 a > span > span {
		font-size: 4.4rem;
	}
}

/* dl */
#engagecros .contact dl {
	background: var(--bg-grey);
	padding: 2rem;
}

@media screen and (max-width: 768px) {
	#engagecros .contact dl {
		width: calc(100% - 4rem);
		margin: 0 auto;
	}
}

#engagecros .contact dl dt {
	text-align: center;
	font-weight: 500;
	font-size: 1.6rem;
	margin-bottom: 2rem;
}

#engagecros .contact dl ul li {
	display: flex;
	align-items: flex-start;
}

#engagecros .contact dl ul li:not(:last-child) {
	margin-bottom: 1.5rem;
}

#engagecros .contact dl ul li img {
	width: 1.6rem;
	margin-top: 0.3rem;
}

#engagecros .contact dl ul li > span {
	width: calc(100% - 2rem);
	padding-left: 1rem;
	font-size: 1.2rem;
}

#engagecros .contact dl + p {
	margin: 3rem 0 4rem 0;
	text-align: center;
	font-size: 1.1rem;
}

/* form */
#engagecros .contact form > div:not(:last-of-type) {
	margin-bottom: 2.5rem;
}

@media screen and (max-width: 768px) {
	#engagecros .contact form {
		padding: 0 2rem;
	}
}

#engagecros .contact form label {
	display: flex;
  padding-top: 0px;
	margin-bottom: 0.8rem;
	font-size: 1.6rem;
	align-items: flex-start;
}

#engagecros .contact form label span:nth-child(1) {
	background: var(--red);
	color: #fff;
	border-radius: 10rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.2rem 0 0.35rem 0;
	font-size: 1.2rem;
	width: 5rem;
}

#engagecros .contact form label span:nth-child(2) {
	width: calc(100% - 6rem);
	padding-left: 1rem;
}

#engagecros .contact form label span.nini {
	background: #6f6f6f;
}

#engagecros .checkbox ul li {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}

#engagecros input[type="text"],
#engagecros input[type="tel"],
#engagecros input[type="email"],
#engagecros textarea {
	padding: 1.6rem 2rem 1.5rem 2rem;
	background: #f9f9f9;
	border: none;
	box-shadow: inset 0 0 0.5rem rgba(0, 0, 0, 0.1);
	width: 100%;
  border-radius: 0;
}
#engagecros textarea {
    height: auto;
}
#engagecros input[type="text"]:focus,
#engagecros input[type="tel"]:focus,
#engagecros input[type="email"]:focus {
	font-size: 16px;
}

#engagecros input[type="text"]::placeholder,
#engagecros input[type="tel"]::placeholder,
#engagecros input[type="email"]::placeholder,
#engagecros textarea::placeholder {
	color: #9c9c9c;
}

#engagecros select {
	appearance: none;
	background: url(../images/ma/arrow.png) no-repeat center right 1.5rem;
	background-size: 1.2rem auto;
	background-color: #f9f9f9;
	border: none;
	box-shadow: inset 0 0 0.5rem rgba(0, 0, 0, 0.1);
	width: 100%!important;
	color: #9c9c9c;
  font-size: 1.3rem;
}

#engagecros .input-wrap {
	display: flex;
	justify-content: space-between;
}

#engagecros .input-wrap > input {
	width: 49%;
}

#engagecros .note {
	display: block;
	margin-top: 0.6rem;
	font-size: 1.1rem;
	color: #9c9c9c;
}

#engagecros .check-wrap {
	display: flex;
	align-items: center;
}

#engagecros .wrap-2 input[type="checkbox"] {
	position: relative;
	width: 11px;
	height: 11px;
	vertical-align: -5px;
	appearance: none;
	background-color: #f9f9f9;
	border: none;
	box-shadow: inset 0 0 0.5rem rgba(0, 0, 0, 0.1);
	margin: 0;
}

#engagecros .wrap-2 input[type="checkbox"]:checked:before {
	position: absolute!important;
	top: 0px;
	left: 3px;
	transform: rotate(50deg);
	width: 4px;
	height: 8px;
	border-right: 2px solid var(--red)!important;
	border-bottom: 2px solid var(--red)!important;
	content: "";
}

@media screen and (max-width: 768px) {
  #engagecros input[type="text"],
  #engagecros input[type="tel"],
  #engagecros input[type="email"],
  #engagecros textarea,
  #engagecros select,
  #engagecros .wrap-2 input[type="checkbox"]:checked:before {
    box-shadow: none;
    border: 1px solid rgba(0, 0, 0, 0.1);
  }
}



/* #engagecros .check-wrap label {
	margin-left: 1rem;
	margin-top: 6px;
}

#engagecros .check-wrap + span {
	display: block;
	font-size: 1.2rem;
	color: #353535;
}

#engagecros .check-wrap + span a {
	color: var(--red);
} */

[type="submit"] {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: url(../images/ma/arrow-2.png) no-repeat center right 1.5rem!important;
	background-size: 0.7rem auto!important;
	background-color: var(--red);
	appearance: none;
	border: none;
	height: 5.4rem;
	font-size: 1.8rem;
	border-radius: 1rem;
	width: 28rem;
	padding-bottom: 0.15rem;
	box-shadow: 0 0.8rem 0 #be000f;
	margin: 3rem auto 0 auto;
	transition: none;
}

[type="submit"]:hover {
	opacity: 0.5;
	cursor: pointer;
}

[type="submit"] {
	-webkit-appearance: button;
	appearance: button;
}

[type="submit"]::-webkit-search-decoration {
	display: none;
}



/* -------------------------------------------

footer

------------------------------------------- */
/* service */
/* .footer-service {
	padding: 6rem 0;
	background: #6e7787;
}

.footer-service .heading-1 {
	color: #fff;
}

.footer-service ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 112rem;
	margin: 0 auto;
}

.footer-service ul li {
	width: 32%;
}

.footer-service ul li:nth-child(n + 4) {
	margin-top: 1.5rem;
}

@media screen and (max-width: 768px) {
	.footer-service ul {
		flex-direction: column;
		width: auto;
		padding: 0 4rem;
	}

	.footer-service ul li {
		width: 100%;
	}

	.footer-service ul li:not(:last-child) {
		margin-bottom: 1.5rem;
	}

	.footer-service ul li:nth-child(n + 4) {
		margin-top: 0;
	}
}

.footer-service ul li a {
	background: #fff;
	display: flex;
	align-items: center;
	padding: 2rem 0 2rem 2rem;
	color: #000;
	border: solid 0.2rem #fff;
}

.footer-service ul li a:hover {
	opacity: 1;
	color: var(--red);
	border: solid 0.2rem var(--red);
}

.footer-service ul li img {
	width: 4.6rem;
	margin-right: 1rem;
}

.footer-service ul li a > span {
	font-size: 1.5rem;
	font-weight: bold;
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.footer-service ul li a > span > span {
	font-size: 1.2rem;
	font-weight: normal;
	margin-bottom: 0.8rem;
}*/

/* nav */
/*
footer .wrap {
	color: #fff;
	background: #242222;
}

footer .wrap a {
	color: #fff;
}

footer .wrap a:hover {
	opacity: 1;
	color: var(--red);
}

footer nav {
	width: 112rem;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	border-bottom: solid 0.12rem #fff;
	padding-bottom: 6rem;
	margin-bottom: 6rem;
}

.footer-nav-service {
	display: flex;
}

.footer-nav-service ul li span {
	font-size: 1.1rem;
	display: block;
}

.footer-nav-service ul li a {
	position: relative;
	display: flex;
	flex-direction: column;
	padding-left: 1.8rem;
}

.footer-nav-service ul li a::before {
	content: "";
	width: 0.5rem;
	height: 0.12rem;
	background: #fff;
	position: absolute;
	left: 0;
	top: 1rem;
}

.footer-nav-service > div:nth-of-type(1) {
	margin-right: 6rem;
}

.footer-nav-service ul li:not(:last-child) {
	margin-bottom: 1.5rem;
}

.footer-nav-other,
.footer-nav-ttl {
	font-weight: 500;
}

.footer-nav-ttl {
	margin-bottom: 1rem;
	display: block;
}

.footer-nav-other {
	display: flex;
}

.footer-nav-other > ul:nth-of-type(1) {
	margin-right: 6rem;
}

.footer-nav-other > ul > li:not(:last-child) {
	margin-bottom: 1.5rem;
}

.footer-nav-other > ul > li ul {
	font-weight: normal;
}

.footer-nav-other > ul > li ul li:not(:last-child) {
	margin-bottom: 0.5rem;
}

.footer-nav-other > ul > li ul li a {
	padding-left: 1.8rem;
}

.footer-nav-other > ul > li ul li a {
	position: relative;
}

.footer-nav-other > ul > li ul li a::before {
	content: "";
	width: 0.5rem;
	height: 0.12rem;
	background: #fff;
	position: absolute;
	left: 0;
	top: 1rem;
}

@media screen and (max-width: 768px) {
	footer nav {
		width: 85vw;
		padding: 0 1.5rem 4rem 1.5rem;
		display: block;
		margin-bottom: 4rem;
		margin-left: auto;
		margin-right: auto;
	}

	.footer-nav-service {
		display: block;
	}

	.footer-nav-service > div:nth-of-type(1) {
		margin-right: 0;
	}

	.footer-nav-other {
		display: block;
	}

	.footer-nav-other > ul:nth-of-type(1) {
		margin-right: 0;
		margin-top: 1.5rem;
	}
}
*/

/* subnav */
/*
footer .wrap > div {
	display: flex;
	justify-content: space-between;
	width: 112rem;
	margin: 0 auto 3rem auto;
}

@media screen and (max-width: 768px) {
	footer .wrap > div {
		display: block;
		width: 85vw;
		margin: 0 auto 3rem auto;
	}
}

.footer-subnav {
	display: flex;
}

.footer-subnav li:not(:last-child) {
	margin-right: 1.5rem;
}

@media screen and (max-width: 768px) {
	.footer-subnav {
		display: block;
		padding: 0 1.5rem;
	}

	.footer-subnav li:not(:last-child) {
		margin-right: 0;
		margin-bottom: 1.5rem;
	}
}
*/

/* sns */
/*
.sns {
	display: flex;
	align-items: center;
	font-size: 2rem;
}

.sns li:not(:last-child) {
	margin-right: 1rem;
}

@media screen and (max-width: 768px) {
	.sns {
		margin-top: 3rem;
		justify-content: center;
		font-size: 2.4rem;
	}
} */

/* small */
/*
footer small {
	width: 112rem;
	display: block;
	margin: 0 auto;
	text-align: right;
}

@media screen and (max-width: 768px) {
	footer small {
		width: auto;
		text-align: center;
		font-size: 1.2rem;
	}
}

@media screen and (max-width: 768px) {
	footer {
		padding-bottom: 5rem;
	}

	.thanx footer {
		padding-bottom: 0;
	}
}
*/


/* -------------------------------------------

float

------------------------------------------- */
.float-form {
	width: 28rem;
	height: 54rem;
	z-index: 10;
	margin-left: auto;
	margin-right: calc((100% - 96rem) / 2);
	padding: 1rem 0;
	position: relative;
	z-index: 0;
}

@media screen and (max-width: 768px) {
	.float-form {
		width: 90vw;
		height: auto;
		margin: 0 auto;
		padding: 0;
	}
}

.float-form > div {
	background: #fff;
	height: 40rem;
	box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.15);
	/*padding: 1.2rem 1.2rem 1.6rem 1.2rem;*/
  	padding: 0rem 1.2rem 0rem 1.2rem;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}

@media screen and (max-width: 768px) {
	.float-form > div {
		padding: 2rem;
		height: calc(100vh - 8rem);
		justify-content: flex-start;
		overflow-y: scroll;
	}
}

.float-form > div > div {
	text-align: center;
	line-height: 1;
	color: var(--red);
	font-weight: bold;
	font-size: 1.8rem;
	margin-bottom: 1.2rem;
  width: 100%;
}

@media screen and (max-width: 768px) {
	.float-form > div > div {
		font-size: 1.8rem;
		margin-bottom: 2rem;
	}
}

.float-form form > div:not(:last-of-type) {
	margin-bottom: 0.6rem;
}

.float-form input[type="text"],
.float-form input[type="email"] {
	padding: 0.5rem 1rem 0.6rem 1rem;
}

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

	.float-form input[type="text"],
	.float-form input[type="email"] {
		padding: 1rem 1.5rem;
	}
}

.float-form input[type="text"]::placeholder,
.float-form input[type="email"]::placeholder {
	font-size: 1rem;
}

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

	.float-form input[type="text"]::placeholder,
	.float-form input[type="email"]::placeholder {
		font-size: 1.6rem;
	}
}

.float-form .mktoForm .mktoButtonWrap.mktoSimple button.mktoButton {
	background-color: #6cb8c4!important;
	height: 3.6rem;
	font-size: 1.5rem;
	width: 100%;
	box-shadow: 0 0.5rem 0 #5b9ca6;
	margin: 0.5rem auto 0 auto;
	/* padding-top: 0.2rem; */
  display: flex;
  border: none;
  font-family: 'Noto Sans JP', sans-serif;
}
.float-form .mktoForm .mktoButtonWrap.mktoSimple button.mktoButton:hover {
  color: #FFF;
  background: #6cb8c4;
  border: none;
}

@media screen and (max-width: 768px) {
	.float-form .mktoForm .mktoButtonWrap.mktoSimple button.mktoButton {
		height: 4.8rem;
		font-size: 1.8rem;
	}
}

.float-form select {
	background: url(../images/ma/arrow.png) no-repeat center right 1rem;
	background-size: 0.8rem auto;
	background-color: #f9f9f9;
	padding: 0.5rem 1rem 0.6rem 1rem!important;
	font-size: 1rem!important;
}

@media screen and (max-width: 768px) {
	.float-form select {
		padding: 1rem 1.5rem;
		font-size: 1.6rem;
	}
}

.float-form .note {
	font-size: 0.9rem;
	line-height: 1.81;
}

.float-form .note a {
	color: #DB0025;
}

.float-form label {
	font-size: 0.9rem!important;
	line-height: 1.4;
	letter-spacing: 0.05em;
	display: flex;
	justify-content: space-between;
	margin-left: 1em;
}

.float-form .check-wrap label {
	margin-left: 0.6rem;
	margin-top: 0;
}

.required {
	position: relative;
}

.required::before {
	content: "*";
	position: absolute;
	top: -1px;
	left: -6px;
	color: #DB0025;
	font-size: 1.3rem;
}

label[for="privacy"] {
	cursor: pointer;
	font-weight: 700;
	margin-top: 1.6rem;

}

@media screen and (max-width: 768px) {
	/*.float-form .note*/
  .mktoHtmlText.mktoHasWidth span {
		font-size: 1.3rem;
	}

	.float-form label {
		font-size: 1.3rem;
		margin: 0.8rem 0 0.5rem 0;
	}
}

.float-form-contact {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}

.float-form-contact span {
  color: #000;
	margin: 0.8rem 0 0.4rem 0!important;
	font-size: 1.1rem!important;
	font-weight: normal;
}

.float-form-contact a {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: url(../images/ma/arrow-2.png) no-repeat center right 1.5rem;
	background-size: 0.7rem auto;
	background-color: var(--red);
	appearance: none;
	border: none;
	height: 3.6rem;
	font-size: 1.5rem;
  font-weight: normal;
	border-radius: 1rem;
	width: 100%;
	padding-bottom: 0.15rem;
	box-shadow: 0 0.5rem 0 #be000f;
}



/* -------------------------------------------

modal

------------------------------------------- */
#engagecros .float2 {
	position: sticky;
	top: 0rem;
	z-index: 100;
}

@media screen and (max-width: 768px) {
#engagecros	.float2 {
		position: relative;
		top: auto;
	}

#engagecros	.modal2 {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100000000;
		padding: 4rem 0 0 0;
	}

#engagecros	.modal2:not(:target) {
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.5s, visibility 0.5s;
	}

#engagecros	.modal2:target {
		opacity: 1;
		visibility: visible;
		transition: opacity 0.5s, visibility 0.5s;
	}

#engagecros	.modal2 .overlay {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		background-color: #000;
		opacity: 1;
		top: 0;
		left: 0;
		z-index: 0;
	}

#engagecros	.modal-close {
		position: absolute;
		top: 1rem;
		right: 1rem;
		text-decoration: none;
		font-size: 2rem;
		line-height: 1;
		color: #fff;
	}
}



/* -------------------------------------------

fixed

------------------------------------------- */
#engagecros .fixed {
	display: flex;
	font-weight: 500;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 9999;
  margin-bottom: 0px;
}

#engagecros .fixed li {
	width: 50%;
  list-style: none;
}

#engagecros .fixed li a {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 5rem;
	font-size: 1.2rem;
	color: #fff;
}

#engagecros .fixed li:nth-child(1) a {
	background: #6cb8c4;
}

#engagecros .fixed li:nth-child(2) a {
	background: var(--red);
}

#engagecros .fixed li img {
	width: 2rem;
	margin-right: 0.5rem;
}

#engagecros ul.fixed.sp {
    margin: 0px;
    padding: 0;
}


/* -------------------------------------------

markto form

------------------------------------------- */
/* マルケトフォームで必要なcss　*/

.mktoForm {
    padding: 0;
}
.mktoFieldDescriptor.mktoFormCol {
    margin: 0 !important;
}

#Lblc_consent.mktoLabel {
    width: unset !important;
}
.mktoHtmlText.mktoHasWidth span {
    font-size: 0.9rem !important;
    line-height: 1.81;
    color: #9c9c9c;
}
.mktoForm .mktoFormCol {
    min-height: 1em;
    margin-bottom: 0 !important;
}
.float-form .mktoCheckboxList {
display: inline-block;
    width: unset !important;
}
.float-form .mktoForm .mktoLabel {
    display: none;
}
/* label[for="privacy"] {
    cursor: pointer;
    font-weight: 700;
    margin-top: 0.4rem;
    padding: 0;
} */
.mktoForm label[for="c_consent"] {
    font-size: 0.9rem;
    line-height: 1.4;
    letter-spacing: 0.05em;
    /* display: flex!important;
    justify-content: space-between; */
    margin-left: 1em;
}
.mktoForm label[for="c_consent"] {
    cursor: pointer;
    font-weight: 700;
    margin-top: 0.6rem;
    padding: 0;
}
label#Lblcue {
    display: block;
    padding-top: 0;
}
.mktoLogicalField.mktoCheckboxList.mktoHasWidth.mktoRequired label {
    display: none;
}
select#cue {
    width: 100% !important;
}
.float-form .mktoForm div {
  line-height: 1;
}
.float-form  .form-note{
    /*position: absolute;
    width: 90%;
    left: 50%;
    transform: translateX(-50%);
    bottom: 17rem;*/
    font-size: 0.8rem;
    line-height: 1.4;
}
.float-form input[type="text"], .float-form input[type="email"], .float-form input[type=tel] {
    padding: 0.5rem 1rem 0.6rem 1rem !important;
    border: none;
    border-radius: 0;
}
.mktoForm .mktoFormCol {
    min-height: 0em!important;
    margin-bottom: 0 !important;
}
@media(min-width:751px){
/* .float-form .mktoFormRow:nth-of-type(9), 
.float-form .mktoFormRow:nth-of-type(10),
.float-form .mktoFormRow:nth-of-type(12),
.float-form .mktoFormRow:nth-of-type(13),
.float-form .mktoFormRow:nth-of-type(14) {
    display: none;
} */
}
.float-form .mktoFormRow:nth-of-type(2){
    margin-bottom: 0 !important;
}
.float-form .mktoFormRow:nth-of-type(9),
.float-form .mktoFormRow:nth-of-type(10),
.float-form .mktoFormRow:nth-of-type(11){
    display: none;
}
@media(max-width:750px){
.float-form .mktoForm #LblInterest__c.mktoLabel,
.float-form .mktoForm #LblInterest_Most__c.mktoLabel,
.float-form .mktoForm #LblRequest__c.mktoLabel,
.float-form .mktoForm #LblEnquiry_Questions__c.mktoLabel,
.float-form .mktoForm #LblTiming_Timing_of_Introducof_Introduction__c.mktoLabel {
    display: block !important;
    float: none;
}
}

.mktoButtonWrap.mktoSimple {
    margin-left: 0px !important;
}

/* 現行サイトから　*/
.mktoForm #c_consent.mktoField {
    width: unset!important;
  height: 1em;
}

.mktoForm.mktoLayoutAbove .mktoGutter {
  display: none;/* form2に入ってる　*/
}

.mktoForm .mktoButtonWrap.mktoSimple button.mktoButton:hover {
  color: #fff!important;
}
@media screen and (max-width: 768px) {
	/*.float-form .note*/
  .mktoHtmlText.mktoHasWidth span {
		font-size: 1.3rem !important;
	}
    .mktoForm .mktoButtonWrap.mktoSimple button.mktoButton {
    background-color: #DB0025 !important;
  }
}

#header .navbar .navbar-nav .dropdown-menu.show {
    font-size: 100%;
      padding: 24px;
}
#service-lineup .lineup-box {
    font-size: 16px;
    letter-spacing: 0px;
}

@media (min-width: 992px){
#header .navbar .navbar-nav .dropdown-menu.show .p-lg-4 {
    padding: 4.5rem !important;
  }
}

footer {
    color: #fff;
    font-size: 12px;
    text-align: center;
    border-top: 1px solid #222222;
    background-color: #222222;
    padding: 50px 0 100px;
}