@charset "utf-8";

@font-face {
	font-family: Noto Sans JP;
	font-weight: 300;
	src: url(fonts/NotoSansJP-Light.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 400;
	src: url(fonts/NotoSansJP-Regular.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 500;
	src: url(fonts/NotoSansJP-Medium.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 600;
	src: url(fonts/NotoSansJP-SemiBold.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 700;
	src: url(fonts/NotoSansJP-Bold.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 800;
	src: url(fonts/NotoSansJP-ExtraBold.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 900;
	src: url(fonts/NotoSansJP-Black.ttf) format('truetype');
	font-display: swap
}

/*share*/
/**********************/
.popup section *,
.withyou section * {
	font-family: 'Noto Sans JP', sans-serif;
}
.popup .center,
.withyou .center {
	text-align: center;
	display: flex;
	justify-content: center;
}
@media screen and (min-width: 1081px) {
	header #mainNavi > li > a.active::after {opacity: 1;}
	body[data-active="withyou"] header #mainNavi > li[data-active="withyou"] > a.active::after {opacity: 1;}
	body[data-active="popup"] header #mainNavi > li[data-active="popup"] > a.active::after {opacity: 1;}
}

/*mv*/
section.centerMv::before {
	background: none;
}
section.centerMv h2 {
	display: flex;
	justify-content: center;
}
section.centerMv h2 {
	animation:textDelay 0.8s ease 0.4s forwards normal;
	margin-bottom: min(2.75vw, 33px);
}
section.centerMv h3 {
	animation:textDelay 0.8s ease 0.8s forwards normal;
}
section.centerMv p {
	animation:textDelay 0.8s ease 1.6s forwards normal;
}
.centerMv .contactBtn {
	margin-bottom: 0;
	margin-top: min(3.75vw, 45px);
	text-shadow: none;
}
.centerMv .contactBtn a.btn_long {
	color: #fff;
	font-size: clamp(1.25rem, 2.552vw, 2.5rem);
	font-weight: 700;
	padding: .4em 0;
	background:#003244;
	border-radius: 7px;
	width: min(32.5vw, 426px);
}
.popup .centerMv .contactBtn a.btn_long {
	border: 1px solid #fff;
}
.centerMv .contactBtn a.btn_long:hover {
	text-decoration: none;
	opacity: .7;
}
.centerMv .contactBtn a.btn_long::after {display: none !important;}


@media screen and (max-width:640px) {
	section.centerMv > h3,
	section.centerMv > .read {
		width: 100%;
	}
	section.centerMv p.contactBtn a {
		font-size: clamp(2.1rem, 5.47vw, 4.2rem);
		text-align: center;
		width: auto;
		padding: .15em 1.2em .2em;
		border-radius: min(2vw, 15px);
	}
}
/*section*/
section.boxYellow {
	background-color: #fffad6;
	margin: 0;
	padding: 10px;
}
section.boxWhite {
	background-color: #fff;
	margin: 0;
	padding: 10px;
}
section.boxGray {
	background-color: #e8edeb;
	margin: 0;
	padding: 10px;
}

/*space slider*/
.ul_space {
	width: min(95vw, 900px);
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
.ul_space .box_space {
	width: min(43.25vw, 400px);
	background-color: #fff;
	margin:0 min(2vw, 25px) min(4vw, 48px);
	padding: min(1.8vw, 20px);
	border-radius: 10px;
}
.ul_space .dots-wrap {
	display: flex;
	justify-content: center;
}
.ul_space .dots-wrap li {
  width: 8px;
  height: 8px;
  margin: 12px 5px;
  background: #ccc;
  border-radius: 50%;
  cursor: pointer;
}
.ul_space .dots-wrap li:hover,
.ul_space .dots-wrap li.slick-active {
	background-color: #000;
}
.ul_space .dots-wrap li button {
  display: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
  border: none;
  background-color: transparent;
}
.ul_space * {
	font-family: 'Noto Sans JP', sans-serif;
}
.ul_space .space_name {
	font-size: clamp(1.1rem, 2.246vw, 2.2rem);
	font-weight: 700;
	border-top: 2px solid #c8c8c8;
	margin: 12px 0 5px;
	padding-top: 8px;
}
.ul_space .address {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	border-bottom: 2px solid #c8c8c8;
	padding-bottom: 10px;
	margin-bottom: 12px;
}
.ul_space .txt {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
}
.ul_space h5 {
	font-size: clamp(0.7rem, 1.43vw, 1.4rem);
	font-weight: 300;
	margin-top: .8em;
}
.ul_space .txt_s {
	font-size: clamp(0.7rem, 1.43vw, 1.4rem);
}
.ul_space .btnBox {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	margin-top: min(2vw, 20px);
}
.ul_space .btnBox p {
	width: 48%;
}

.ul_space .btn {
	color: #fff;
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	font-weight: 400;
	text-align: center;
	text-decoration: none;
	display: block;
	width: 100%;
	border-radius: 5px;
	padding: .3em 0;
}

.ul_space .contactBtn .btn {
	background-color: #00a0e9;
}
.ul_space .dtlBtn .btn {
	background-color: #e4007f;
}
.ul_space .contactBtn .btn:hover,
.ul_space .dtlBtn .btn:hover {
	opacity: .7;
}
.ul_space .spaceBtn .btn {
	color: #268dff;
	border: 1px solid #89c1ff;
	background-color: #fff;
}
.ul_space .spaceBtn .btn:hover {
	background-color: rgba(137,193,255, .2);
}

@media screen and (max-width:640px) {
	.ul_space {
		justify-content: center;
	}
	.ul_space .box_space {
		width: 88vw;
		padding: min(5.2vw, 39px);
		margin-bottom: min(9.2vw, 69px);
	}
	.ul_space .dots-wrap li {
		width: min(2vw, 15px);
		height: min(2vw, 15px);
		margin: min(4vw, 30px) min(1vw, 7.5px);
	}
	.ul_space .space_name {
		font-size: clamp(2.2rem, 5.73vw, 4.4rem);
	}
	.ul_space .txt,
	.ul_space .address {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
	}
	.ul_space h5,
	.ul_space .txt_s {
		font-size: clamp(1.4rem, 3.646vw, 2.8rem);
	}
	.ul_space .btn {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
	}
}



/*withyou*/
/******************/
/*mv*/
.withyou section.centerMv{
	background-color: #fff;
	background-position:center 0;
	background-size: 100% auto;
	background-repeat: no-repeat;
	height: auto;
	padding: min(25vw, 290px) 0 min(7.5vw, 90px);
	position: relative;
}
.withyou section.centerMv::after,
.withyou section.centerMv::before {
	content: '';
	display: block;
	width: 100%;
	height: min(14.84375vw, 190px);
	/*background-image:url(../img/withyou/mv_withyou.svg);*/
	background-size: auto 100%;
	background-position: 50% 0;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
}
.withyou section.centerMv::before {
	background-image:url(../img/withyou/mv_withy_bg.svg);
	background-repeat: repeat-x;
	z-index: 0;
}
.withyou section.centerMv::after {
	background-image:url(../img/withyou/mv_withy_ttl.svg);
	background-repeat: no-repeat;
	z-index: 1;
}

.withyou section.centerMv .h2_img {
	width: min(34vw, 408px);
	height: auto;
}
.withyou section.centerMv h3,
.withyou section.centerMv p {
	color: #323232;
	text-shadow:none;
}
.withyou section.centerMv h3 {
	font-weight: 700;
	font-size: clamp(1.6rem, 3.266vw, 3.2rem);
}
.withyou section.centerMv p {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	font-weight: 300;
}

@media screen and (min-width:1280px) {
	/*.withyou section.centerMv{
		background-size: auto;
		background-repeat: repeat-x;
	}*/
}

@media screen and (max-width:640px) {
	.withyou section.centerMv::after,
	.withyou section.centerMv::before {display: none;}
	.withyou section.centerMv{
		background-image:url(../img/withyou/mv_withyou_sp.png);
		background-position:center -1px;
		background-size: 100% auto;
		background-repeat: no-repeat;
		padding-top: min(65.6vw, 482px);
		padding-bottom: min(14.4vw, 81px);
	}
	section.centerMv .h2_img {
		width: min(54vw, 408px);
	}
	.withyou section.centerMv h3 {
		font-size: clamp(3.3rem, 8.6vw, 6.6rem);
		line-height: 1.5;
		margin-bottom: .6em;
	}
	.withyou section.centerMv p {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
		text-align: left;
		width: 95vw;
	}
}
@media screen and (max-width:360px) {
	.withyou section.centerMv h3 {
		font-size: clamp(3.1rem, 8.075vw, 6.2rem);
	}
}

/*cnt title*/
#caseStadies h3,
#space h3 {
	color: #323232;
	font-size: clamp(1.8rem, 3.674vw, 3.6rem);
	font-weight: 900;
	text-align: center;
	margin-bottom: min(3.5vw, 42px);
}
#space h3.mb0 {margin-bottom: 0;}
#caseStadies h3 + p.txt,
#space h3 + p.txt {
	margin-bottom: min(3.5vw, 42px);
}

@media screen and (max-width:640px) {
	#caseStadies h3,
	#space h3 {
		font-size: clamp(3.6rem, 9.374vw, 7.2rem);
		margin-bottom: min(7.2vw, 54px);
	}
	#caseStadies h3.mb0,
	#space h3.mb0 {margin-bottom: 0;}
	#caseStadies h3 + p.txt,
	#space h3 + p.txt {
		margin-bottom: min(7.2vw, 54px);
	}

}

/*space*/
#space {
	padding: min(7vw, 85px) 10px;
}

#space .moreBtn a {
	color: #fff;
	font-size: clamp(0.9rem, 1.838vw, 1.8rem);
	border-radius: 5px;
	background-color: #a1a1a1;
	padding: .3em 1.2em .5em;
}
#space .moreBtn._v2 {margin-top: 15px;}
#space .moreBtn._v2 a {
	color: #fff;
	background-color: #444;
}
#space .moreBtn a .txt_ss {
	font-size: clamp(0.5rem, 1.022vw, 1rem);
	display: block;
}
#space .moreBtn a[target="_blank"]::after {display: none;}
#space .moreBtn a:hover {
	text-decoration: none;
	opacity: .8;
}

@media screen and (max-width:640px) {
	#space {
		padding: min(12vw, 90px) 0;
	}
	#space .moreBtn a {
		font-size: clamp(2rem, 5.21vw, 4rem);
		border-radius: min(2vw, 15px)
	}
	#space .moreBtn a .txt_ss {
		font-size: clamp(1.2rem, 3.126vw, 2.4rem);
	}
}

/*caseStadies*/
#caseStadies {
	margin: 0;
	padding: min(7vw, 85px) 10px;
}
#caseStadies .txt_case {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	font-weight: 300;
}

#caseStadies .caseBox {
	padding: 0;
	margin: min(5.9375vw, 76px) auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#caseStadies .caseBox:last-of-type {margin-bottom: 0;}
#caseStadies .caseBox:nth-of-type(2n) {
	flex-direction: row-reverse;
}
#caseStadies .txtBox,
#caseStadies .case_slider {
	width: 50%;
}
#caseStadies .case_slider .dots-wrap {
	display: flex;
	justify-content: center;
}
#caseStadies .case_slider .dots-wrap li {
  width: 8px;
  height: 8px;
  margin: 12px 5px;
  background: #ccc;
  border-radius: 50%;
  cursor: pointer;
}
#caseStadies .case_slider .dots-wrap li:hover,
#caseStadies .case_slider .dots-wrap li.slick-active {
	background-color: #000;
}
#caseStadies .case_slider .dots-wrap li button {
  display: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
  border: none;
  background-color: transparent;
}

#caseStadies .txtBox {
	display: flex;
	justify-content: center;
}
#caseStadies .txtBox h4 {
	font-size: clamp(1.6rem, 3.266vw, 3.2rem);
	margin-bottom: min(1.25vw, 15px);
}
#caseStadies .txtBox p {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	line-height: 1.8;
}

@media screen and (max-width:640px) {
	#caseStadies .txt_case {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
		text-align: left;
	}
	#caseStadies .caseBox,
	#caseStadies .caseBox:nth-of-type(2n) {
		flex-direction: column;
		align-items: flex-start;
		margin-top: min(12vw, 90px);
	}
	#caseStadies .txtBox,
	#caseStadies .case_slider {
		width: 100%;
	}
	#caseStadies .case_slider .dots-wrap li {
		width: min(2vw, 15px);
		height: min(2vw, 15px);
		margin: min(4vw, 30px) min(1vw, 7.5px);
	}
	#caseStadies .txtBox {
		display: block;
	}
	#caseStadies .txtBox h4 {
		font-size: clamp(2.2rem, 5.73vw, 4.4rem);
	}
	#caseStadies .txtBox p {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
		line-height: 1.4;
	}
}


/*flow*/
section#flow.boxYellow .flowCaut{
	margin: 0 auto;
}
section#flow .flowCaut dd ul.nom_k {
	padding-left: 0;
}
section#flow .flowCaut dd ul.nom_k li {
	list-style: none;
	padding-left: 2.55em;
	text-indent: -2.55em;
}
section#flow .flowCaut dd + dt {
	margin-top: 2.5em;
}


/*popup*/
/*********************/
/*mv*/
.popup .centerMv {
	background-image:url(../img/withyou/mv_popup.jpg);
	background-position:center 0;
	background-size: cover;
	background-repeat: no-repeat;
}
.popup .centerMv .read,
.popup .centerMv h3{
	color: #fff;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}
.popup .centerMv h3 {
	font-size: clamp(1.6rem, 3.266vw, 3.2rem);
	font-weight: 700;
}
.popup .centerMv .read {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	font-weight: 400;
	margin-top: 0;
}

@media screen and (max-width:640px) {
	.popup .centerMv {
		background-image:url(../img/withyou/mv_popup_sp.jpg);
		background-position:center 0;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.popup .centerMv h3 {
		font-size: clamp(3.5rem, 9.12vw, 7rem);
		line-height: 1.57;
	}
	.popup .centerMv .read {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
	}
}

#space .listBtn {
	margin-top: min(4vw, 48px);
}
#space .listBtn a {
	color: #fff;
	font-size: clamp(1.25rem, 2.552vw, 2.5rem);
	border-radius: 7px;
	background-color: #003244;
	padding: .4em 4em .5em;
}
#space .listBtn a:hover {
	text-decoration: none;
	opacity: .8;
}
#space .listBtn a[target="_blank"]::after {display: none;}

@media screen and (max-width:640px) {
	#space .listBtn a {
		font-size: clamp(2rem, 5.21vw, 4rem);
		border-radius: min(2vw, 15px)
	}
}