@charset "UTF-8";

/*************
FMT
*************/
.content_wrap {
	margin-top: 66px;
}
@media(min-width:751px){
	.content_wrap {
		margin-top: 90px;
	}
}
/*************
CONTENTS
*************/
#main {
	overflow: hidden;
}
.content {
	margin: 0 auto;
	max-width: 750px;
}
.content02 {
	margin: 0 auto;
	max-width: 670px;
}
.project {
	padding-bottom: min(12.67vw, 95px);
	background-color: #97DFD6;
}
.project .mainImg {
	position: relative;
    aspect-ratio: 750 / 854;
}
.project .mainImg .subSpan02 {
	position: absolute;
	top: 0;
	width: min(9.6vw,72px);
	right: min(4.7vw,35px);
}
.project .mainImg h1 {
	position: absolute;
	top: min(9.33vw,70px);
	left: calc(50% - min(6.93vw,52px));
	width: min(42.4vw,318px);
	transform: translateX(-50%);
}
.project .mainImg .date {
	position: absolute;
	bottom: min(10.8vw,81px);
	left: calc(50% - min(7.33vw,55px));
	transform: translateX(-50%);
	width: min(51.86vw,389px);
}
.project .scroll {
	position: absolute;
	bottom: 0;
	right: min(7.7333vw, 58px);
}
.project .scroll a {
	position: relative;
	display: block;
	padding: 0 0 min(4vw, 30px) min(0.8vw, 6px);
	width: min(2.2667vw, 17px);
	box-sizing: content-box;
}
.scrollbar {
	position: absolute;
	left: 0;
	bottom: 1px;
	height: min(10.9333vw, 82px);
	overflow: hidden;
	width: 10px;
}
.scrollbar .subSpan {
	position: absolute;
	bottom: 0;
	left: 0;
	height: min(10.9333vw, 82px);
	animation: liner 2.5s cubic-bezier(1, 0, 0, 1) infinite;
}
.scrollbar .subSpan::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 2px;
	height: 100%;
	background: #000;
}
.scrollbar .subSpan::before {
	width: min(1.6vw, 12px); 
	background-color: #000;
	position: absolute;  
	bottom: 3px;
	height: 2px;
	left: -1px;
	transform: rotate(-42deg);
	content: ""; 
}

/* @keyframes liner {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  30% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  70% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
} */

@keyframes liner {
	0% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(100%);
	}
	50.1% {
		transform: translateY(-100%);
	}
	100% {
		transform: translateY(0);
	}
  }

.project h2 {
	margin: max(-4.5vw,-34px) min(1.33vw, 10px) min(9.47vw, 71px) min(4.5vw,34px);
	width: min(78.36vw,583px);
}
.project .linkUl {
	padding: 0 min(6.7vw,50px) 0 min(5.73vw,43px);
	display: flex;
	flex-wrap: wrap;
	gap: min(4.93vw,37px) min(8.53vw,64px);
}
.project .linkUl li {
	width: calc((100% - min(8.53vw,64px)) / 2);
}
.installments {
	padding: min(14.4vw,108px) 0 min(10.27vw, 77px);
	background-color: #D1E9EB;
}
.installments .inner {
	margin-bottom: min(9.33vw, 70px);
	position: relative;
}
.installments .inner .photo {
	margin: 0 0 max(-14.8vw, -111px) min(14.8vw, 111px);
	width: min(53.87vw, 404px);
}
.installments .inner .textImg {
	width: min(85.87vw, 644px);
	margin-left: max(-1.2vw, -9px);
}
.installments .inner:not(.inner02) .textImg {
	position: relative;
	z-index: 1;
}
.installments .inner .ttl {
	z-index: 1;
	position: absolute;
	top: min(2.13vw, 16px);
	right: max(-0.27vw, -2px);
	width: min(18.53vw, 139px);
}
.installments .textImg02 {
	width: min(82.27vw, 617px);
	margin: 0 auto min(8vw, 60px);
}
.content_wrap .comLink {
	margin: 0 -1px min(6.4vw, 48px);
}
.content_wrap .comLink a {
	display: block;
	z-index: 1;
	position: relative;
}
.content_wrap .comLink a span {
	display: block;
	transition: all ease 0.3s;
}
.content_wrap .comLink a:after {
	background-color: #fff;
	border-radius: min(6.67vw, 50px);
	border: 2px solid #000000;
	position: absolute;  
	top: min(1.87vw, 14px);
	right: 0;  
	z-index: -1;
	left: 0;
	bottom: max(-1.87vw, -14px);
	content: ""; 
}
.content_wrap .comLink a::before {
	width: min(15.47vw, 116px);  
	aspect-ratio: 232 / 162;
	background: url(../img/arrow.png) no-repeat;
	background-size: 100% auto;
	position: absolute;  
	bottom: min(4.93vw, 37px);
	right: max(-2.4vw, -18px);  
	z-index: 1;
	content: ""; 
	transition: all ease 0.3s;
}
.content_wrap .textList {
	padding-bottom: min(5.07vw, 38px);
	margin-bottom: min(4.53vw, 34px);
	border-bottom: 2px solid #FFFFFF;
}
.content_wrap .textList:last-child {
	border: none;
	padding-bottom: 0;
	margin-bottom: 0;
}
.content_wrap .textList li {
	font-size: min(3.2vw, 24px);
	line-height: 1.583;
	text-indent: -1em;
	padding-left: 1em;
}
.content_wrap .textList li a {
	color: #2700FF;
	text-decoration: underline;
}
.content_wrap .textList li a:hover {
	opacity: 0.7;
}
.content_wrap .installmentsBox {
	margin-bottom: min(9.6vw, 72px);
}
.content_wrap .precautions .ttl {
	cursor: pointer;
	padding: min(1.33vw, 10px) min(3.33vw, 25px) min(2vw, 15px) min(1.33vw, 10px);
	box-sizing: border-box;
	width: min(58.53vw, 439px);
	margin: 0 auto;
	text-align: center;
	font-size: min(3.2vw, 24px);
	letter-spacing: 0.12em;
	color: #fff;
	position: relative;
	background-color: #000000;
}
.content_wrap .precautions .ttl:before,
.content_wrap .precautions .ttl:after {
	position: absolute;
	right: min(3.6vw, 27px);
	top: 50%;
	width: min(3.33vw, 25px);
	height: 2px;
	background-color: #fff;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	content: "";
}
.content_wrap .precautions .ttl:after {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}
.content_wrap .precautions .ttl.on:after {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	opacity: 0;
}
.content_wrap .precautions .jsBox {
	display: none;
	padding-top: min(6.4vw, 48px);
}
.content_wrap .precautions .textList {
	margin-right: max(-1.33vw, -10px);
}
.content_wrap .precautions .jsBox p {
	font-size: min(3.2vw, 24px);
	line-height: 1.583;
	letter-spacing: 0;
}
.content_wrap .precautions .jsBox p a {
	color: #2700FF;
	text-decoration: underline;
}
.content_wrap .precautions .jsBox p a:hover {
	opacity: 0.7;
}
.content_wrap .precautions {
	margin-bottom: min(13.33vw, 100px);
}
.installments .inner02 .photo {
	margin: 0 0 max(-22.4vw, -168px) min(0.67vw, 5px);
	z-index: 1;
	width: min(50.13vw, 376px);
	position: relative;
}
.installments .inner02 .textImg {
	width: min(78.67vw, 590px);
	position: relative;
	margin: 0 max(-2.67vw, -20px) max(-4.8vw, -36px) min(10.27vw, 77px);
}
.installments .inner02 .textImg:after {
	width: 100%;  
	aspect-ratio: 1179 / 985;
	background: url(../img/bg.png) no-repeat;
	background-size: 100% auto;
	position: absolute;  
	top: 0;
	left: 0;
	content: ""; 
}
.installments .inner02 .textImg span {
	position: relative;
	z-index: 2;
}
.installments .inner02 .txtImg02 {
	width: min(70.8vw, 531px);
	margin-left: auto;
	margin-right: max(-2.4vw,-18px);
	position: relative;
	z-index: 1;
}
.installments .inner02 {
	margin-bottom: min(10.67vw, 80px);
}
.content_wrap .frame h2 {
	width: fit-content;
	font-feature-settings: "palt";
	display: flex;
	font-size: min(5.6vw, 42px);
	font-weight: 700;
	letter-spacing: 0.14em;
	padding: 0 0 0 min(2vw, 15px);
	margin: 0 min(1.33vw, 10px) min(4vw, 30px);
	background: linear-gradient(transparent 60%, rgba(193, 143, 94, 0.5) 0, rgba(193, 143, 94, 0.5) 0);
	background-position: center bottom min(0.8vw, 6px);
}
.content_wrap .frame h2 .num {
	margin: min(0.67vw, 5px) min(2.67vw, 20px) 0 0;
	padding-left: min(0.4vw, 3px);
	box-sizing: border-box;
	flex-shrink: 0;
	width: min(7.07vw, 53px);
	height: min(7.07vw, 53px);
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	font-size: min(4.8vw, 36px);
	border-radius: 100%;
	line-height: 1;
	background-color: #000000;
	color: #D1E9EB;
	font-family: Arial, Helvetica, sans-serif;
}
.content_wrap .frame .txt {
	line-height: 1.59;
	font-weight: 700;
	letter-spacing: 0.1em;
	font-size: min(3.87vw, 29px);
	margin-bottom: min(2.93vw, 22px);
	padding: 0 min(1.33vw, 10px) min(3.33vw, 25px);
	border-bottom: 1px solid #000000;
}
.content_wrap .frame .txt .txtSpan {
	display: block;
	letter-spacing: 0.12em;
	padding-bottom: min(1.33vw, 10px);
}
.content_wrap .frame .txt .bigSpan {
	font-size: min(5.47vw, 41px);
	color: #C18F5E;
	line-height: 1;
}
.content_wrap .frame .txt small {
	letter-spacing: 0;
	display: block;
	margin: min(1.0667vw, 8px) 0 max(-0.6667vw, -5px);
	font-size: min(3.2vw, 24px);
	font-weight: 400;
}
.content_wrap .frame .date {
	margin: 0 min(1.6vw, 12px) min(8.666vw, 65px);
	width: min(69.87vw, 524px);
}
.content_wrap .frame .photo {
	width: min(82.67vw, 620px);
	margin: 0 auto min(4.4vw, 33px);
}
.content_wrap .frame .txt2 {
	text-align: center;
	margin-bottom: min(10.66vw, 80px);
	font-size: min(3.2vw, 24px);
	line-height: 1.833;
}
.content_wrap .frame .borderBox {
	margin: 0 min(0.67vw, 5px) min(8vw, 60px);
	padding: min(4.93vw, 37px) min(5.07vw, 38px);
	border: 3px solid #FFFFFF;
}
.content_wrap .frame .borderBox .ttl {
	margin-bottom: min(3.33vw, 25px);
	padding: min(1.07vw, 8px) min(1.33vw, 10px) min(1.33vw, 10px);
	font-size: min(4vw, 30px);
	letter-spacing: 0.1em;
	color: #fff;
	text-align: center;
	font-weight: 700;
	font-feature-settings: "palt";
	background-color: #C18F5E;
}
.content_wrap .frame .borderBox .list {
	margin: 0 max(-2vw, -15px) 0 max(-0.67vw, -5px);
}
.content_wrap .frame .borderBox .list li {
	display: flex;
	margin-bottom: min(2.53vw, 19px);
	font-size: min(3.73vw, 28px);	
	font-weight: 600;
	line-height: 1.64;
}
.content_wrap .frame .borderBox .list li:last-child {
	margin-bottom: 0;
}
.content_wrap .frame .borderBox .list li .num {
	flex-shrink: 0;
	color: #fff;
	margin: min(1.2vw, 9px) min(2.27vw, 17px) 0 0;
	font-size: min(3.2vw, 24px);
	width: min(4.8vw, 36px);
	height: min(4.8vw, 36px);
	background-color: #C18F5E;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: Arial, Helvetica, sans-serif;
}
.content_wrap .cauliflower {
	margin: 0 min(4.67vw, 35px) min(12.67vw, 95px);
}
.content_wrap .cauliflower .sub:not(:last-child) {
	margin-bottom: min(6.4vw, 48px);
}
.content_wrap .cauliflower h3 {
	width: min(65.33vw, 490px);
	margin-bottom: min(3.47vw, 26px);
}
.content_wrap .cauliflower .subPhoto {
	position: relative;
	margin-bottom: min(1.6vw, 12px);
}
.content_wrap .cauliflower .subPhoto .txtSpan {
	position: absolute;
	top: max(-10.67vw, -80px);
	right: min(2.67vw, 20px);
	width: min(18.53vw, 139px);
}
.content_wrap .cauliflower .textList li {
	line-height: 1.4;
}
.content_wrap .frame .borderBox2 .list li {
	margin-bottom: min(2vw, 15px);
}
.content_wrap .comLink.style a::before {
	bottom: min(11.2vw, 84px);
}
.content_wrap .precautions2 .ttl {
	padding-right: min(7.33vw, 55px);
}
.installments .inner03 .textImg {
	width: min(88.53vw, 664px);
	margin: 0 0 max(-8vw, -60px) min(1.07vw, 8px);
}
.installments .inner03 {
	padding-bottom: min(1.87vw, 14px);
	padding-top: min(2vw, 15px);	
}
.installments .inner03 .photo {
	width: min(66.67vw, 500px);
	margin: 0 min(1.07vw, 8px) 0 auto;
}
.installments .inner03 .ttl {
	right: auto;
	left: 0;
	top: min(39.6vw, 297px);
	width: min(18.4vw, 138px);
}
.content_wrap .fooBox {
	margin: 0 max(-5.33vw, -40px);
	margin-bottom: min(7.5vw, 56px);
}
.installments .slick-dots {
	text-align: center;
	margin-top: min(4vw, 30px);
}
.installments .slick-dots li {
	display: inline-block;
	cursor: pointer;
	margin: 0 min(2.8vw, 21px);
	width: min(2.9333vw, 22px);
	height: min(2.9333vw, 22px);
	background-color: #fff;
}
.installments .slick-dots li button {
	display: none;
}
.installments .slick-dots li.slick-active {
	background-color: #000000;
}
.content_wrap .fooBox p {
	font-size: min(4.53vw, 34px);
	margin: 0 min(5.33vw, 40px) min(2.13vw, 16px);
	font-weight: 600;
	letter-spacing: 0.04em;
}
.content_wrap .fooBox p small {
	display: block;
	font-size: min(3.47vw, 26px);
	margin-top: max(-0.53vw, -4px);
}
.content_wrap .participatingTtl {
	font-size: min(4.53vw, 34px);
	margin-bottom: min(3.47vw, 26px);
	letter-spacing: 0.04em;
	line-height: 1.53;
	text-align: center;
	font-weight: 700;
}
.content_wrap .information {
	padding: min(15.73vw, 118px) 0;
	background-color: rgba(223, 176, 174, 0.67);
}
.content_wrap .information h2 {
	width: min(66.4vw, 498px);
	margin: 0 auto max(-3.07vw, -23px);
	position: relative;
}
.content_wrap .information .photo {
	margin-bottom: min(12vw, 90px);
}
.content_wrap .information .photo img {
	width: 100%;
}
.content_wrap .information .dot {
	width: min(28vw, 210px);
	margin: 0 auto min(11.07vw, 83px);	
}
.content_wrap .information p {
	margin-bottom: min(14.27vw, 107px);
	font-size: min(3.2vw, 24px);
	text-align: center;
}
.content_wrap .information p:last-child {
	margin-bottom: 0;
}
.content_wrap .information .date {
	margin-bottom: min(1.07vw, 8px);
	font-size: min(4vw, 30px);
	font-weight: 700;
	line-height: 1.8;
	letter-spacing: 0.04em;
}
.content_wrap .information h3 {
	margin-bottom: min(5.33vw, 40px);
	font-size: min(5.6vw, 42px);
	text-align: center;
	font-weight: 600;
}
.content_wrap .information .photo2 {
	width: min(66.13vw, 496px);
	margin: 0 auto min(6.4vw, 48px);
}
.comLink02 {
	margin: 0 auto min(5.2vw, 39px);
	width: min(65.47vw, 491px);
	padding-right: min(1.33vw, 10px);
	position: relative;
	z-index: 1;
}
.comLink02 a {
	min-height: min(15.33vw, 115px);
	font-size: min(3.73vw, 28px);
	padding-right: min(2.67vw, 20px);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-weight: 600;
	letter-spacing: 0.04em;
	background: url(../img/icon01.png) no-repeat right min(4vw, 30px) center #fff;
	background-size: min(1.73vw, 13px) auto;
	border-radius: 100vmax;
	border: 1px solid #000;
	transition: all ease 0.3s;
	box-shadow: 0 min(2vw, 15px) 0 #000;
	position: relative;
}
.comPhoto {
	animation: rotate 1.2s step-end 1s infinite;
}
@-webkit-keyframes rotate {
	0% {
	  rotate:-3deg
	}
	50% {
	  rotate:3deg
	}
	to {
	  rotate:3deg
	}
  }
  @keyframes rotate {
	0% {
	  rotate:-3deg
	}
	50% {
	  rotate:3deg
	}
	to {
	  rotate:3deg
	}
  }
.content_wrap .frame .greenBox .ttl {
	background-color: #478550;
}
.content_wrap .frame .greenBox .list li .num {
	background-color: #478550;
}
@media(min-width:751px){
	.comLink a:hover img {
		opacity: 1;
	}
	.comLink a:hover span {
		transform: translateY(min(1.87vw, 14px));
	}
	.comLink a:hover::before {
		bottom: min(3.07vw, 23px);
	}
	.comLink02 a:hover {
		transform: translateY(min(2vw, 15px));
		box-shadow: 0 0 0 #000;
	}
}

@media(max-width:750px){
	.content {
		max-width: inherit;
	}
	.content02 {
		padding: 0 20px;
		max-width: inherit;
	}
	.scrollbar .subSpan::before {
		left: 0;
		bottom: 2px;
		height: 1px;
	}
	.content_wrap .information .photo {
		margin-bottom: 35px;
	}
	.installments .slick-dots {
		margin-top: 10px;
	}
	.scrollbar .subSpan::after {
		width: 1px;
	}
	.content_wrap .comLink a:hover img {
		opacity: 1 !important;
	}
}

.fadeInUp2,
.fadeInUp {
    opacity: 0;
	transform: translate(0,20px);
    transition: .5s ease;
}
.animate.on .fadeInUp2,
.fadeInUp.on {
    opacity: 1;
	transform: translate(0, 0);
}
.fadeInDown {
	opacity:0;
	transform:translateY(20px)
}
.fadeInDown.on {
	opacity:1;
	-webkit-transform:none;
	transform:none;
    transition: .5s ease;
}
.fadeIn {
	opacity: 0;
	transition: .5s ease;
}
.animate.on .fadeIn {
	opacity: 1;
}
.clipImg .subClipImg {
	display: block;
	clip-path: inset(0 0 100% 0);
	transition: 1s ease 0s;
}
.clipImg.on .subClipImg {
	clip-path: inset(0);
}
.clipImg .dely02 {
	transition-delay: 0.3s;
}
.clipImgLeft .clipImgLeftSpan {
	display: block;
	clip-path: inset(0 100% 0 0);
	transition: 1s ease 0s;
}
.clipImgLeft.on .clipImgLeftSpan {
	clip-path: inset(0);
}
.dely02 {
	transition-delay: 0.3s;
}
.dely03 {
	transition-delay: 0.6s;
}
.dely04 {
	transition-delay: 0.9s;
}
.pageTop2 {
	display: none;
	position: fixed;
	bottom: min(2.6667vw, 20px);  
	right: min(2.6667vw, 20px);
	width: min(9.6vw, 72px);
	z-index: 200;
}
.pageTop2 a:hover {
	opacity: 0.7;
}


.btmBtn {
	margin: 35px 4vw 100px;
}
.btmBtn a {
	display: block;
	border: 4px solid #000;
	background-color: #FFF;
	max-width: 750px;
	margin: 0 auto;
	text-align: center;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	border-radius: 10px;
	position: relative;
	padding: 16px;
	font-size: 20px;
	transition: .3s;
}
.btmBtn a:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 30px;
	height: 12px;
	width: 12px;
	border-top: 3px solid #000;
	border-right: 3px solid #000;
	transform: translateY(-50%) rotate(45deg);
	transition: all 0.3s;
}

@media(max-width:750px){
	.btmBtn {
		margin: 40px 6.5vw max(2.4vw,4px);
	}
	.btmBtn a {
		border-radius: min(15px,2.66vw);
		max-width: inherit;
		padding: min(10px,1.6vw) min(2.67vw);
		font-size: min(1.25rem,3.2vw);
		border-width: max(2px,0.6vw);
	}
	.btmBtn a::after {
		right: max(4.1vw,17px);
		width: min(1.86vw);
		height: min(1.86vw);
		border-top-width: max(0.5vw,1px);
		border-right-width: max(0.5vw,1px);
	}
}


@media(min-width:751px){
	.btmBtn a:hover {
		background-color: #000;
		color: #FFF;
		border-color: #000;
	}
	.btmBtn a:hover::after {
		border-color: #fff;
	}
	.content_wrap .comLink a::before {
		display: none;
	}
}








/*************
footer
*************/
.footer_container {
	font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Arial", "Verdana", "sans-serif";
	font-size: 16px;
	color: #000;
	line-height: 1.5;
	font-weight: 400;
	position: relative;
	z-index: 100;
	background-color: #FFF;
	padding-top: 1px;
}

/*************
メディアクエリ
*************/
@media(min-width:751px){
	.sp {
		display: none;
	}
}
@media(max-width:750px){
	.pc {
		display: none;
	}

}
	
