/* CSS Document */
/*----- last up date 20220125 -----*/

input[type="submit"], input[type="button"], input[type="reset"] {
  -webkit-appearance: none;
  border-radius: 0;
}

#content .content-area {
	margin: 0 auto;
	width: 100%;
	position: relative;
}
	
#content .content-area section {
	margin: 0 auto;
	width: 100%;
	position: relative;
}

#content .content-area section .mv01{opacity:0; transform: translate(0, 150px); transition: 0.5s;}
#content .content-area section .mv02{opacity:0; transform: translate(0, 150px); transition: 0.8s;}
#content .content-area section .mv03{opacity:0; transform: translate(0, 150px); transition: 1.5s;}
#content .content-area section .mv04{opacity:0; transform: translate(-300px , 0); transition: .9s;}
#content .content-area section .mv05{opacity:0; transform: translate(500px, 0); transition: .9s;}

#content .content-area section .mv01.active,
#content .content-area section .mv02.active,
#content .content-area section .mv03.active,
#content .content-area section .active .mv04,
#content .content-area section .active .mv05{opacity:1; transform: translate(0, 0);}

#content .content-area section.contents01 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_01.jpg) repeat-x center center;
	height: 650px;
	width: 100%;
}

#content .content-area section.contents01.contact {
	height: 150px;
	width: 100%;
}

#content .content-area section.contents01 div.icon {
	max-width: 94px;
	position: absolute;
	top: 30px;
	margin: auto;
	left: 0;
	right: 0;
	width: 16%;
}
#content .content-area section.contents01 h2 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/txt_bg_01.png) repeat-x center center;
	width: 690px;
	height: 527px;
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	bottom: -150px;
	padding: 140px 0px;
	z-index: 12;
}
#content .content-area section.contents01 h2 span {
	color: #fff;
	display: block;
	text-align: center;
	width: 100%;
	line-height: 2;
	letter-spacing: 5px;
}

#content .content-area section.contents02.container {
	background:
	url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_05.png) no-repeat left top 650px,
	url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_04.png) no-repeat right bottom 650px,
	#d5e9ff;
	width: 100%;
	height: 1999px;
	padding-top: 360px;
	overflow: initial !important;
}

#content .content-area section.contents02 canvas:last-of-type {
	bottom: 0px;
	left: 0px;
	position: absolute;
	top: -130px;
	z-index: 10;
}

#content .content-area section.contents02 h2 {
	font-size: 24px;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 240px;
	z-index: 2;
}
#content .content-area section.contents02 h2::before {
	content: "About Works";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	color: #7caab8;
	width: 100%;
	text-align: center;
	font-size: 20px;
	letter-spacing: 2px;
}

#content .content-area section.contents02 ul.worksIcon {
	width: 100%;
	height: 100%;
	margin: auto;
	position: relative;
	overflow: hidden;
}

#content .content-area section.contents02 ul.worksIcon li figure{position:absolute;	z-index: 16; cursor:pointer;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(1) figure{top:50%; left:20%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(2) figure{top:70%; left:50%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(3) figure{top:40%; left:10%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(4) figure{top:60%; left:80%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(5) figure{top:10%; left:10%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(6) figure{top:90%; left:20%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(7) figure{top:40%; left:30%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(8) figure{top:30%; left:50%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(9) figure{top:20%; left:80%;}
#content .content-area section.contents02 ul.worksIcon li figure{margin:0; position:absolute;}

#content .content-area section.contents02 dl dd {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 70%;
	height: 70vh;
	display: flex;
	background: rgb(255, 255, 255,1);
	padding: 30px;
	transform: scale(0%, 0%);
	-webkit-transform: scale(0, 0);
	opacity: 0;
	z-index: 20;
	justify-content: space-around;
	box-shadow: 3px 3px 7px #555;
}

#content .content-area section.contents02 dl dd.select{
	transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
	opacity:1;
}

#content .content-area section.contents02 dl dd div {
	width: 55%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 170px 0;
}

#content .content-area section.contents02 dl dd div h3 {
	font-size: 28px;
	width: 100%;
	color: #2f57b1;
}

#content .content-area section.contents02 dl dd div p {
	font-size: 17px;
	line-height: 2;
	padding: 0;
	text-align: left;
	margin: 0 0 50px;
}

#content .content-area section.contents02 dl dd a.closeBth {
	font-size: 40px;
	position: absolute;
	top: 0;
	right: 20px;
	cursor:pointer;
}

#content .content-area section.contents02 dl dd figure {
	width: 45%;
	position: relative;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 0;
}

#content .content-area section.contents02 dl dd figure img{max-width:344px;}
#content .content-area section.contents02 dl dd figure p {
	position: absolute;
	left: 0;
	bottom: 0;
	color: #2f57b1;
	font-size: 28px;
}

#content .content-area section.contents02 div.wave {
	position: absolute;
	bottom: -200px;
	left: 0;
	z-index: 19;
	transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
	animation-name: wavw;
	animation-duration: 5s;
	animation-timing-function: ease-in;
	animation-delay: 1s;
	animation-iteration-count: 2;
	animation-direction: alternate;
	animation-fill-mode: forwards;
	animation-play-state: running;
	animation-iteration-count: infinite;
}

@keyframes wavw{
  0%{
    transform: scale(100%, 130%);
	-webkit-transform: scale(1, 1.3);
  }
  100%{
    transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
  }
}
#content .content-area section.contents02 > p:last-of-type {
	color: #beb463;
	position: absolute;
	bottom: -2%;
	margin: auto;
	right: 22%;
	white-space: nowrap;
	z-index: 22;
	text-align: center;
	line-height: 3;
	letter-spacing: 5px;
}
canvas.background {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	z-index: 15;
}
.bubble {
	position: absolute;
	border-radius: 100%;
	border: 1px solid #fff;
	bottom: 1px;
	z-index: 13;
}
#content .content-area section.contents03 {
	/* background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center; */
	width: 100%;
	padding-top: 150px;
	top: 0;
	/* padding-bottom: 290px; */
}

/*

#content .content-area section.contents03::before {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-line_01.png) repeat center center;
	width: 500px;
	height: 290px;
	position: absolute;
	left: 20vw;
	bottom: 0;
	content: "";
}

*/

#content .content-area section.contents03 h2 {
	font-size: 24px;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
}
#content .content-area section.contents03 h2::before {
	content: "Sample Desing";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	color: #7caab8;
	width: 100%;
	text-align: center;
	font-size: 20px;
	letter-spacing: 2px;
}

#content .content-area section.contents03 .rouletteWrap {
	width: 90%;
	max-width: 1200px;
	max-height: 860px;
	height: 100vh;
	background: #fff;
	margin: auto;
	position: relative;
}

/*

#content .content-area section.contents03 .rouletteWrap .rouletteResult.start figure.rouletteImg{animation:.4s linear infinite rotation;}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop figure.rouletteImg{animation:3s ease-out infinite rotation;}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result01 figure.rouletteImg{ transform:rotate(20deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result02 figure.rouletteImg{ transform:rotate(50deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result03 figure.rouletteImg{ transform:rotate(70deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result04 figure.rouletteImg{ transform:rotate(220deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result05 figure.rouletteImg{ transform:rotate(120deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result06 figure.rouletteImg{ transform:rotate(300deg);}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.result01 figure.rouletteImg{ transform:rotate(520deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result02 figure.rouletteImg{ transform:rotate(750deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result03 figure.rouletteImg{ transform:rotate(570deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result04 figure.rouletteImg{ transform:rotate(3220deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result05 figure.rouletteImg{ transform:rotate(2120deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result06 figure.rouletteImg{ transform:rotate(100deg);}

@keyframes rotation{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

*/

#content .content-area section.contents03 .rouletteWrap .rouletteResult {
	position: absolute;
	max-width: 530px;
	width: 80%;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 530px;
	transform: translate(0%, 0%) scale(100%, 100%);
	-webkit-transform: translate(0%, 0%) scale(1, 1);
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.result02Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result03Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result04Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result05Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result06Conts {
	transform: translate(80%, 50%) scale(70%, 70%);
	-webkit-transform: translate(80%, 50%) scale(.7, .7);
}


#content .content-area section.contents03 .rouletteWrap .rouletteResult.result01Conts{
	transform: translate(0%, 160%) scale(500%, 500%);
	-webkit-transform: translate(0%, 160%) scale(5, 5);
}
#content .content-area section.contents03 .rouletteWrap .rouletteResult::before {
	content: "▼";
	position: absolute;
	top: -10px;
	left: 0;
	right: 0;
	width: 27px;
	margin: auto;
	font-size: 28px;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult figure.rouletteImg {
	-webkit-transition: 3s ease all;
	-moz-transition: 3s ease all;
	-o-transition: 3s ease all;
	transition: 3s ease all;
	transition-duration: 3.3s;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult a {
	width: 135px;
	height: 33px;
	position: absolute;
	top: -30px;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	opacity: 1;
	z-index: 1;
	cursor: pointer;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop a{opacity:0;}
#content .content-area section.contents03 .rouletteWrap > img {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: block;
	margin: auto;
}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(1) {
	width: 65px;
	height: 70px;
	top: -480px;
	left: -230px;
	animation: 3s ease-out infinite fortune01;
}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(2) {
	width: 146px;
	height: 96px;
	top: -690px;
	right: 60px;
	animation: 5s ease-out infinite fortune02;
}


@keyframes fortune01{
  0%{ transform: translate(0%, 0%); }
  50%{ transform: translate(0%, 10%); }
  100%{ transform: translate(0%, 0%); }
}


@keyframes fortune02{
  0%{ transform: translate(0%, 0%) rotate(-10deg); opacity:1;}
  20%{opacity:.5; }
  50%{ transform: translate(10%, 10%) rotate(-10deg); }
  40%{opacity:1; }
  100%{ transform: translate(0%, 0%) rotate(-10deg); }
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt {
	transform: scale(30%, 30%);
	-webkit-transform: scale(.3 , .3);
	opacity: 0;
	left: -100%;
	position: fixed;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt h3{
	font-size:22px;
	text-align:center;
	padding:20px 0;
	position:relative;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	left: 0%;
	height: 100vh;
	background-color: rgba(255,255,255,.9);
	z-index: 50;
	overflow: hidden;
	right: 0;
	margin: auto;
	top: min(3vw , 30px);
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active .slick-list {
	position: relative;
	display: block;
	overflow: initial;
	margin: 0;
	padding: 0;
	width: 100%;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active figure:nth-of-type(2){
	position:absolute;
	top:0;
	left:0;
	transform: scale(30%, 30%);
	-webkit-transform: scale(.3 , .3);
	opacity:0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active.active02 figure:nth-of-type(2){
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
}


#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider {
	width: 100%;
	margin: auto;
	justify-content: flex-start;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider li {
	margin: 10px 40px;
	width: 350px;
	max-height: 500px;
	position: relative;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li {
	margin: 10px 40px;
	width: 520px;
	max-height: 500px;
	box-shadow: 0 0 1px #ccc;
	position: relative;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li figure {
	width: 100%;
	overflow: auto;
	height: 500px;
	scrollbar-width: none;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li p{
	position: absolute;
	top: min(150vw , 430px);
	left: 0;
	width: 100%;
	background: rgba(00,00,00,.7);
	height: 15vw;
	max-height: 70px;
	color: #fff;
	line-height: min(15vw , 70px);
	text-align: center;
	font-size: min(3vw , 15px);
	transition:.5s;
	transform:translate(0  , -30px);
	opacity:0;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.rouletteCntnt03 ul.dsignSlider .slick-track li p {
	position: absolute;
	top: min(68vw , 290px);
	left: 0;
	width: 100%;
	background: rgba(00,00,00,.7);
	height: 15vw;
	max-height: 70px;
	color: #fff;
	line-height: min(15vw , 70px);
	text-align: center;
	font-size: min(3vw , 15px);
	transition: .5s;
	transform: translate(0 , -30px);
	opacity: 0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider .slick-track li.slick-active p{
	transform:translate(0  , 0);
	opacity:1;
	}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li::-webkit-scrollbar{display: none;}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li::-webkit-scrollbar{display: none;}



#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider .slick-track li img {
	width: 100%;
	height: auto;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.rouletteCntnt03 ul.dsignSlider .slick-track li img{transform: translate(0%, 0%);}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.rouletteCntnt03 ul.dsignSlider .slick-track li img:hover{transform: translate(0%, -10%);}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.rouletteCntnt04 > p{
	position: absolute;
	top: 0;
	right: -22vw;
	width: 20vw;
	bottom: 0;
	margin: auto;
	height: 4em;
	font-weight: bold;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt a.closeBth {
	font-size: 40px;
	position: absolute;
	top: 0;
	right: 20px;
	cursor:pointer;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt div.mainMovie {
	width: 90vw;
	max-width: 700px;
	margin: 0 auto min(20vw , 50px);
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt div.mainMovie p
	font-size: min(4vw , 25px);
	text-align: center;
	margin-top: 3vw;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt div.mainMovie iframe{
	max-height: 500px;
	width: 100%;
	height: 400px;
	display: block;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider02 li {
	margin: 0 min(2vw , 7px);
	max-width: 200px;
	width: 30vw;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider02 li img{width:100%;}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider02 li p{
	font-size: min(3vw , 15px);
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots {
	width: 950px;
	margin: 60px auto 0;
	justify-content: flex-start;
	display: flex;
	flex-wrap: wrap;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots li {
	margin: 10px;
	width: calc(100% / 10);
	cursor: pointer;
	max-height: 150px;
	overflow: hidden;
	transition:.3s;
	border:solid 1px #fff;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots li:hover,
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots li.slick-active {border:solid 1px #829ddd;}

#content .content-area section.contents04 {
	/*background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center;*/
	width: 100%;
	padding-top: 0;
	top: 0;
	padding-bottom: 100px;
}

#content .content-area section.contents04.contact,
#content .content-area section.contents04.contentThanks {overflow:hidden;}

#content .content-area section.contents04 h2 {
	font-size: 24px;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 80px;
	z-index: 2;
}
#content .content-area section.contents04 h2::before {
	content: "Contact";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	color: #7caab8;
	width: 100%;
	text-align: center;
	font-size: 20px;
	letter-spacing: 2px;
}
#content .content-area section.contents04.contact h2::before {
	content: "Contact Confirm";
}
#content .content-area section.contents04 div.contactWrap {
	width: 90%;
	max-width: 1200px;
	min-height: 900px;
	height: 1250px;
	background: #fff;
	margin: auto;
	padding: 220px 0 0;
}
#content .content-area section.contents04.contentThanks div.contactWrap {
	min-height: auto;
	height: 420px;
}

#content .content-area section.contents04::before,
#content .content-area section.contents04::after {
	content: "";
	background: no-repeat right center/40%;
	position: absolute;
	top: 0;
	height: 84vw;
	margin: auto;
}

#content .content-area section.contents04::before {
	background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_wood_01.png);
	width: 30%;
	right: 0;
	z-index: 2;
	top: 0;
}
#content .content-area section.contents04::after {
	background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_wood_03.png);
	width: 35%;
	left: 0;
	top: 0;
	background-position: left center;
}

#content .content-area section.contents04 div.contactWrap figure.woodImage {
	width: 279px;
	height: 598px;
	position: absolute;
	top: 400px;
	left: 0;
	margin: auto;
	z-index: 6;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 411px;
	left: 70px;
}

#content .content-area section.contents04 div.contactWrap figure.contactIcon a {
	display: block;
	z-index: 9;
	width: 50px;
	position: relative;
	height: 50px;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon img{position:absolute; left:0; top:0;}
#content .content-area section.contents04 div.contactWrap figure.contactIcon img:nth-of-type(1) {
	width: 45px;
	height: 56px;
	top: 0;
	left: 0;
	z-index: 4;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon img:nth-of-type(2) {
	width: 46px;
	height: 150px;
	z-index: 7;
	top: -40px;
	left: -50px;
	opacity: 0;
	transform: rotate(20deg);
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon:hover img:nth-of-type(2) {opacity:1; transform: rotate(0deg);}

#content .content-area section.contents04 div.contactWrap > p {
	font-size: 16px;
	color: #b8b7b7;
	position: absolute;
	top: -30px;
	right: -1000px;
	left: 0;
	margin: auto;
	width: 300px;
}

#content .content-area section.contents04 div.contactWrap > p.contentTxt {
	font-size: 20px;
	color: #555d74;
	position: static;
	margin: auto;
	width: 50%;
}

#content .content-area section.contents04.contact form{position:relative;}
#content .content-area section.contents04.contact form::after {
	content: "";
	height: 760px;
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
}

#content .content-area section.contents04 form dl{width:840px; margin:auto;}
#content .content-area section.contents04 form dl dt {
	width: 100px;
	color: #b8b7b7;
	height: 70px;
	display: flex;
	align-items: center;
	margin-bottom: 50px;
	padding-left: 28px;
}
#content .content-area section.contents04 form dl dt.check {background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_icon_flower.png) no-repeat left center;}
#content .content-area section.contents04 form dl dt:nth-of-type(5) {width: 150px; padding-left: 20px;}
#content .content-area section.contents04 form dl dd:not(:nth-of-type(5)) {
	width: 300px;
	height: 70px;
	background: no-repeat left center;
	margin-bottom: 50px;
}
#content .content-area section.contents04 form dl dd:nth-of-type(1){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_01.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(2){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_02.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(3){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_04.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(3) input {width:290px;}
#content .content-area section.contents04 form dl dd:nth-of-type(4){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_03.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5){width:calc(96% - 150px);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control{width:100%; display:flex;}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control span input[type='radio']{display:none;}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label {
	height: 70px;
	line-height: 70px;
	display: block;
	position: relative;
	padding-left: 60px;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label::before {
	width: 40px;
	height: 40px;
	background: no-repeat center center;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(1) .wpcf7-list-item-label:before{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_05.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(2) .wpcf7-list-item-label:before{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_06.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(3) .wpcf7-list-item-label:before{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_07.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span input[type="radio"]:checked + .wpcf7-list-item-label::after {
	width: 14px;
	height: 14px;
	background: no-repeat center center;
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 14px;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(1) input[type='radio']:checked + .wpcf7-list-item-label:after{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_dotted.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(2) input[type='radio']:checked + .wpcf7-list-item-label:after{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_dotted.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(3) input[type='radio']:checked + .wpcf7-list-item-label:after{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_dotted.png);}

#content .content-area section.contents04 form dl dd:nth-of-type(6){width:calc(96% - 100px); height:360px;}
#content .content-area section.contents04 form dl dd:nth-of-type(6){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_08.png);}

#content .content-area section.contents04 form dl dd input{
	font-size: 16px;
	width: 230px;
	border: none;
	height: 50px;
	margin: 10px 15px;
	background: none;
}
#content .content-area section.contents04 form dl dd textarea {
	font-size: 16px;
	width: 85%;
	border: none;
	height: 270px;
	margin: 45px 35px;
	background: none;
}

#content .content-area section.contents04 form dl dd.formBtn {
	width: 100%;
	display: flex;
	justify-content: center;
}
#content .content-area section.contents04 form dl dd.formBtn input {
	width: 250px;
	height: 70px;
	background:no-repeat center center/100%;
}
#content .content-area section.contents04 form dl dd.formBtn input:nth-of-type(1) {background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_02.png);}
#content .content-area section.contents04 form dl dd.formBtn input:nth-of-type(2) {background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_04.png);}
#content .content-area section.contents04 form .wpcf7 form .wpcf7-response-output {
	margin: 2em 0.5em 1em;
	padding: 0.2em 1em;
	border: 2px solid #00a0d2;
	width: 70%;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 160px;
	border-radius: 20px;
}

#content .content-area section.contents05 {
	width: 100%;
	padding-top: 0;
	bottom: 120px;
	padding-bottom: 100px;
	position: absolute;
	z-index: 5;
	transform: scale(30%, 30%);
	-webkit-transform: scale(.3 , .3);
	opacity: 0;
	right: -100%;
}

#content .content-area section.contents05 a.aboutBtn {
	cursor: pointer;
	position: absolute;
	top: 80px;
	right: 130px;
	background: rgba(255,255,255,.6);
	width: 50px;
	height: 50px;
	font-size: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
}

#content .content-area section.contents05.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity:1;
	right:0;
	}

#content .content-area section.contents05 div.contactWrap {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/about_bg.png) no-repeat center center;
	width: 954px;
	height: 1105px;
	margin: auto;
	padding: 0;
	position: relative;
}

#content .content-area section.contents05 div.contactWrap h2 {
	position: absolute;
	bottom: -1050px;
	text-align: right;
	right: -830px;
	left: 0;
	margin: auto;
	width: 80px;
	top: 0;
	height: 30px;
}

#content .content-area section.contents05 div.contactWrap h3 {
	font-size: 30px;
	letter-spacing: 13px;
	font-weight: lighter;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 130px;
	top: 400px;
}

#content .content-area section.contents05 div.contactWrap table {
	width: 700px;
	margin: auto;
	position: absolute;
	left: 0;
	right: 0;
	top: 520px;
}

#content .content-area section.contents05 div.contactWrap table tr{}
#content .content-area section.contents05 div.contactWrap table tr:hover{background:rgba(255,255,255,.4);}
#content .content-area section.contents05 div.contactWrap table tr th {
	width: 30%;
	padding: 35px 20px;
	text-align: right;
}
#content .content-area section.contents05 div.contactWrap table tr td {
	text-align: center;
}

#content .content-area section.contents05 div.contactWrap table tr td span{font-size:80%;}

#content .content-area section.contents06 {
	width: 100%;
	padding-top: min(35vw , 300px);
	top: 0;
}

#content .content-area section.contents06 div.contactWrap {
	width: 90%;
	max-width: 1200px;
	background: #fff;
	margin: auto;
	padding: 0;
}

#content .content-area section.contents06 div.contactWrap h2 {
	font-size: 24px;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
}
#content .content-area section.contents06 div.contactWrap h2::before {
	content: "News";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	color: #7caab8;
	width: 100%;
	text-align: center;
	font-size: 20px;
	letter-spacing: 2px;
}

#content .content-area section.contents06 div.contactWrap ul {
	margin: min(10vw , 50px) auto 0;
	width: 100%;
	max-width: 1200px;
}
#content .content-area section.contents06 div.contactWrap ul li {
	width: calc(96% / 3);
	border: 1px solid #ddd;
	border-radius: min(3vw , 15px);
	margin: min(2vw , 10px) auto;
	text-align: center;
	cursor: pointer;
}
#content .content-area section.contents06 div.contactWrap ul li:not(.toLink),
#content .content-area section.contents06 div.contactWrap ul li.toLink a {
	display: flex;
	align-items: center;
	padding: min(2vw , 15px) min(3vw , 15px);
	justify-content: center;
	flex-wrap: wrap;
}
#content .content-area section.contents06 div.contactWrap ul li:not(.toLink){position:relative;}

#content .content-area section.contents06 div.contactWrap ul li:hover{
	background:#f8b62a;
	transform:translate(0% , 10%);
	}

#content .content-area section.contents06 div.contactWrap ul li a{width:100%; height:100%; display:block;}
#content .content-area section.contents06 div.contactWrap ul li span:not(.close) {
	font-size: 80%;
	display: inline-block;
	border-bottom: min(0.7vw , 3px) #ddd dotted;
}

#content .content-area section.contents06 div.contactWrap ul li h4{width:100%;}
#content .content-area section.contents06 div.contactWrap ul li span.close {
	position: absolute;
	top: 102%;
	left: 4px;
	opacity: 0;
	transition: .8;
	transform: translate(0 . -20%);
	z-index: 11;
}
#content .content-area section.contents06 div.contactWrap ul li.active span.close{opacity:1; transform:translate(0 . 0);}
#content .content-area section.contents06 div.contactWrap ul li p {
	display: flex;
	transition: .5s;
	position: absolute;
	background: #d5e9ff;
	z-index: 10;
	box-shadow: 3px 3px 3px #bbb;
	padding: min(3vw , 15px);
	border-radius: 5px;
	left: 0;
	transform: scale(0 ,0);
	top: 0;
	width: 130%;
	min-height: 160px;
	align-items: center;
	justify-content: space-around;
}

#content .content-area section.contents06 div.contactWrap ul li.active p {
	top: 100%;
	text-align: left;
	transform: scale(1 ,1);
}


@media only screen and (max-height:900px){

#content .content-area section.contents02 dl dd {height: 90vh;}
#content .content-area section.contents02 dl dd div {padding: 8vh 0;}
#content .content-area section.contents02 dl dd figure img {
	max-width: initial;
	width: auto;
	max-height: 60vh;
}
#content .content-area section.contents02 > p:last-of-type {bottom: -8vw; line-height: 2;}

#content .content-area section.contents02 ul.worksIcon li:nth-of-type(1) figure{width:17%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(2) figure{width:10%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(3) figure{width:25%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(4) figure{width:25%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(5) figure{width:8%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(6) figure{width:15%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(7) figure{width:18%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(8) figure{width:10%;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(9) figure{width:15%;}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(2) {top: -630px;}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active {height: 100vh;}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li {max-height: 60vh;}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots {margin: 1vh auto 0;}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots li {max-height: 15vh;}
#content .content-area section.contents04 form dl {z-index: 20; position: relative;}
#content .content-area section.contents04 div.contactWrap > p {right: -860px;}
#content .content-area section.contents04 div.contactWrap figure.woodImage {
	width: 150px;
	height: 278px;
	position: absolute;
	top: 640px;
	left: 60px;
	margin: auto;
	z-index: 6;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 631px;
	left: 50px;
}


	
}

@media only screen and (max-width:1500px){}

@media only screen and (max-width:1250px){
}


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

header {
	width: 100%;
	margin: auto;
	height: 30vw;
	position: relative;
}

header h2 {
	font-size: 4vw;
	text-align: center;
	font-weight: lighter;
	position: absolute;
	right: 5%;
	top: 8vw;
	bottom: initial;
	margin: auto;
	height: 18vw;
}

#content .content-area section.contents01 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_01.jpg) repeat-x center center / 400%;
	height: 120vw;
	width: 100%;
}

#content .content-area section.contents01 h2 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/txt_bg_01.png) repeat-x center center/100%;
	width: 90%;
	height: 110vw;
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	bottom: -30vw;
	padding: 35vw 0px;
	z-index: 2;
}

#content .content-area section.contents02.container {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center , url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_03.jpg) no-repeat center bottom -20px / 360%;
	width: 100vw;
	height: 380vw;
	padding-top: 50vw;
}
#content .content-area section.contents02 h2 {
	font-size: 4vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 35vw;
	z-index: 5;
}
#content .content-area section.contents02 h2::before {
	content: "About Works";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 2vw;
	letter-spacing: 2px;
}
#content .content-area section.contents02 ul.worksIcon li figure img{
	width:60%;
}

#content .content-area section.contents02 dl dd {
	margin: auto;
	width: 90%;
	height: 73vh;
	padding: 0;
	flex-wrap: wrap;
}

#content .content-area section.contents02 dl dd figure {
	width: 60%;
	position: relative;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 0;
}
#content .content-area section.contents02 dl dd figure img {
	max-width: 344px;
	width:60%;
}

#content .content-area section.contents02 dl dd figure p {
	position: absolute;
	left: -20%;
	top: 6vw;
	color: #2f57b1;
	font-size: 3.5vw;
	bottom: initial;
}

#content .content-area section.contents02 ul.worksIcon canvas {
	bottom: 0px;
	left: 0px;
	position: absolute;
	top: 0;
	z-index: 1;
}
#content .content-area section.contents02 canvas:last-of-type {
	bottom: 0px;
	left: 0px;
	position: absolute;
	top: -24vw;
	z-index: 10;
	width: 100%;
}
#content .content-area section.contents02 div.bubbleWrap {
	width: 95vw;	
	overflow: hidden;
	position: absolute;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
}
	
#content .content-area section.contents02 dl dd div {
	width: 90%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0;
}

#content .content-area section.contents02 dl dd div h3 {
	font-size: 3vw;
	width: 100%;
	color: #2f57b1;
}

#content .content-area section.contents02 dl dd div p {
	font-size: 2vw;
	line-height: 2;
	padding: 0;
	text-align: left;
	margin: 0;
}

#content .content-area section.contents02 div.wave {
	position: absolute;
	bottom: -15vw;
	left: 0;
	z-index: 2;
	transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
	animation-name: wavw;
	animation-duration: 5s;
	animation-timing-function: ease-in;
	animation-delay: 1s;
	/* animation-iteration-count: 2; */
	animation-direction: alternate;
	animation-fill-mode: forwards;
	animation-play-state: running;
	animation-iteration-count: infinite;
}

#content .content-area section.contents02 > p:last-of-type {display:none;}

#content .content-area section.contents03 {
	/* background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center; */
	width: 100vw;
	padding-top: 35vw;
	top: 0;
	/* padding-bottom: 30vw; */
	overflow: hidden;
}

#content .content-area section.contents03 h2 {
	font-size: 3.5vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	}

#content .content-area section.contents03 h2::before {
	content: "Sample Desing";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 2vw;
	letter-spacing: 2px;
}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(1) {
	width: 17vw;
	height: 18vw;
	top: -60vw;
	left: -60vw;
	animation: 3s ease-out infinite fortune01;
	max-width: 65px;
	max-height: 70px;
}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(2) {
	width: 28vw;
	height: 19vw;
	top: -70vw;
	right: -60vw;
	animation: 5s ease-out infinite fortune02;
	max-width: 183px;
	max-height: 121px;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult figure.rouletteImg {
	-webkit-transition: 3s ease all;
	-moz-transition: 3s ease all;
	-o-transition: 3s ease all;
	transition: 3s ease all;
	transition-duration: 3.3s;
	margin: 0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult {
	position: absolute;
	max-width: 530px;
	width: 80%;
	margin: auto;
	top: 0vw;
	bottom: 0;
	left: 0;
	right: 0;
	height: 64vw;
	transform: translate(0%, 0%) scale(100%, 100%);
	-webkit-transform: translate(0%, 0%) scale(1, 1);
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult a {
	width: 135px;
	height: 33px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	opacity: 1;
	z-index: 1;
	cursor: pointer;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult::before {
	content: "▼";
	position: absolute;
	top: -5vw;
	left: 0;
	right: 0;
	width: 27px;
	margin: auto;
	font-size: 6vw;
}

#content .content-area section.contents03 .rouletteWrap {
    width: 90%;
    max-width: 1200px;
    max-height: initial;
    height: 90vh;
    background: #fff;
    margin: auto;
    position: relative;
}
/*
#content .content-area section.contents03::before {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-line_01.png) no-repeat center center/100%;
	width: 53vw;
	height: 30vw;
	position: absolute;
	left: 10vw;
	bottom: 0;
	content: "";
}
*/
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt h3 {
	font-size: 4vw;
	text-align: center;
	padding: 0 0 5vw;
	position: relative;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.dsignSlider li {
	margin: 5vw 10vw;
	max-width: 350px;
	max-height: 500px;
	width: 80vw;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots {
	width: 100vw;
	margin: 2vw auto 0;
	justify-content: flex-start;
	display: flex;
	flex-wrap: wrap;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots li {
	padding: 0 1% 2vw;
	width: calc(100% / 6);
	max-height: 20vw;
	margin: 0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	left: 0%;
	background: #fff;
	height: 130vh;
	z-index: 30;
	overflow: hidden;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	padding: 12vh 0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li {
	margin: 0 5vw;
	max-width: 90vw;
	max-height: 50vh;
	box-shadow: 0 0 1px #ccc;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li figure {
	width: 100%;
	overflow: auto;
	height: 50vh;
	scrollbar-width: none;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt:not(.rouletteCntnt03) ul.dsignSlider .slick-track li p {
	position: absolute;
	top: min(93vw , 430px);
	left: 0;
	width: 100%;
	background: rgba(00,00,00,.7);
	height: 15vw;
	max-height: 70px;
	color: #fff;
	line-height: min(15vw , 70px);
	text-align: center;
	font-size: min(3vw , 15px);
	transition: .5s;
	transform: translate(0 , -30px);
	opacity: 0;
}
	
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt a.closeBth {
	font-size: 6vw;
	position: absolute;
	top: 16vw;
	right: 20px;
	cursor: pointer;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt div.mainMovie iframe {
	max-height: 500px;
	width: 100%;
	height: 60vw;
	display: block;
}
	
#content .content-area section.contents04 {
	/* background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center; */
	width: 100%;
	padding-top: 0;
	top: 0;
	padding-bottom: 20vw;
}



#content .content-area section.contents04 div.contactWrap figure.woodImage,
#content .content-area section.contents04 div.contactWrap > p {display: none;}

#content .content-area section.contents04::before,
#content .content-area section.contents04::after {
	content: "";
	background: no-repeat center bottom / 30%;
	position: absolute;
	top: 0;
	height: 245vw;
	margin: auto;

}

#content .content-area section.contents04::before {
	background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_wood_01.png);
	width: 100vw;
	right: 0;
	z-index: 2;
	top: 0;
	background-position: right center;
}
#content .content-area section.contents04::after {
	background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_wood_03.png);
	width: 100vw;
	left: 0;
	top: 0;
	background-position: left center;
}



#content .content-area section.contents04 h2 {
	font-size: 4vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 20vw;
	z-index: 5;
}
#content .content-area section.contents04 h2:before {
	content:"Contact";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 2vw;
	letter-spacing: 2px;
}

#content .content-area section.contents04 div.contactWrap {
	max-width: 1200px;
	min-height: initial;
	height: auto;
	background: #fff;
	margin: auto;
	padding: 40vw 0 10vw;
	position: relative;
	z-index: 15;
	background: rgba(255,255,255,.7);
	width: 100%;
}
	
#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 0;
	left: 5vw;
}
	
#content .content-area section.contents04 form dl {
	width: 90%;
	margin: auto;
}
#content .content-area section.contents04 form dl dt {
	width: 100%;
	color: #b8b7b7;
	height: 70px;
	display: flex;
	align-items: center;
	margin-bottom: 0;
	padding-left: 28px;
	margin-left: 5vw;
}

#content .content-area section.contents04 form dl dd:not(:nth-of-type(5)) {
	width: 100%;
	height: 70px;
	background: no-repeat left center / 35%;
	margin-bottom: 0;
	margin: 0 4vw 2vw;
}

#content .content-area section.contents04 form dl dt {
	width: 100%;
	color: #b8b7b7;
	height: initial;
	display: flex;
	align-items: center;
	margin-bottom: 0;
	padding-left: 0;
	margin-left: 5vw;
	font-size: 3vw;
}

#content .content-area section.contents04 div.contactWrap > p.contentTxt {
	font-size: 4vw;
	color: #555d74;
	position: static;
	margin: auto;
	width: 80%;
	display: block;
}

#content .content-area section.contents04 form dl dd input {
	font-size: 3vw;
	width: 90%;
	height: 10vw;
	margin: 10px 15px;
	background: none;
	border: solid #6688b8 1px;
	border-radius: 50px;
	padding: 0 5vw;
}

#content .content-area section.contents04 form dl dd:not(:nth-of-type(5)) {
	width: 100%;
	height: 60px;
	background: none;
	margin-bottom: 0;
	margin: 0 0 7vw;
}

#content .content-area section.contents04 form dl dt.check {background: none;}
#content .content-area section.contents04 form dl dt.check:after {
	content:"※";
	color:#f36171;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5),
#content .content-area section.contents04 form dl dt:nth-of-type(5) {
	width: 100%;
	padding-left: 0;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5){padding-bottom:7vw;}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control .wpcf7-list-item {
	display: block;
	margin: 0 0 0 1em;
	width: 100%;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label {
	height: 11vw;
	line-height: 11vw;
	display: block;
	position: relative;
	padding-left: 8vw;
	font-size: 3vw;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label::before {
	width: 6vw;
	height: 6vw;
	background: no-repeat center center/100%;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span input[type="radio"]:checked + .wpcf7-list-item-label::after {
	width: 3vw;
	height: 3vw;
	background: no-repeat center center/100%;
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 2vw;
}

#content .content-area section.contents04 form dl dd:nth-of-type(6) {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_08.png) no-repeat left center / 100%;
	width: 100%;
	height: 41vw;
	margin-bottom: 3vw;
}

#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 0;
	left: 0;
}

#content .content-area section.contents04 form dl dd textarea {
	font-size: 16px;
	width: 89%;
	border: none;
	height: 32vw;
	margin: 5vw;
	background: none;
}
#content .content-area section.contents04 form dl dd.formBtn input {
	width: 60%;
	height: 7vw;
	background: #fff no-repeat center center/100%;
}

#content .content-area section.contents04 form dl dd.formBtn input:nth-of-type(1),
#content .content-area section.contents04 form dl dd.formBtn input:nth-of-type(2) {
	background-image: none;
	color: #333;
	font-weight: normal;
	font-size: 2.5vw;
}

#content .content-area section.contents04 form dl dd.formBtn .wpcf7-spinner {position: absolute;}
#content .content-area section.contents04 form dl dd:nth-of-type(6) {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_08.png) no-repeat left center / 100%;
	width: 100%;
	height: 41vw;
	margin-bottom: 0vw;
}

#content .content-area section.contents04 form dl dd:last-of-type {
	width: 100%;
	height: auto;
	background: none;
	margin-bottom: 0;
	margin: 5vw 0;
	flex-wrap: wrap;
}

#content .content-area section.contents05 {
	width: 100%;
	padding-top: 0;
	bottom: -50vw;
	padding-bottom: 10vw;
	position: absolute;
	z-index: 5;
	transform: scale(0%, 0%);
	-webkit-transform: scale(0 , 0);
	opacity: 0;
	right: 0;
}
#content .content-area section.contents05.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	right: 0;
	bottom: 190vw;
}

#content .content-area section.contents05.contactThants.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	right: 0;
	bottom: 0;
}

#content .content-area section.contents05 div.contactWrap {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/about_bg.png) no-repeat center center / 100%;
	width: 96%;
	height: 120vw;
	margin: auto;
	padding: 0;
	position: relative;
}

#content .content-area section.contents05 a.aboutBtn {
	cursor: pointer;
	position: absolute;
	top: 13vw;
	right: 10vw;
	background: rgba(255,255,255,.6);
	width: 6vw;
	height: 6vw;
	font-size: 5vw;
	display: flex;
	justify-content: center;
	align-items: center;
}

#content .content-area section.contents05 div.contactWrap h3 {
	font-size: 4vw;
	letter-spacing: 13px;
	font-weight: lighter;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 100%;
	top: 30vw;
	text-align: center;
}
#content .content-area section.contents05 div.contactWrap table {
	width: 100%;
	margin: auto;
	position: absolute;
	left: 0;
	right: 0;
	top: 40vw;
}
#content .content-area section.contents05 div.contactWrap table tr th {
	width: 30%;
	padding: 3vw 4vw;
	text-align: right;
	vertical-align: top;
}

#content .content-area section.contents05 div.contactWrap table tr td {
	text-align: left;
	padding: 2vw 2vw;
}

#content .content-area section.contents05 div.contactWrap h2 {
	display: none;
}



#content .content-area section.contents06 h2 {
	font-size: 3.5vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	}

#content .content-area section.contents06 h2::before {
	content: "News";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 2vw;
	letter-spacing: 2px;
}

#content .content-area section.contents06 div.contactWrap ul li {
	width: calc(96% / 2);
	border: 1px solid #ddd;
	border-radius: min(3vw , 15px);
	margin: min(2vw , 10px) auto;
	text-align: center;
	cursor: pointer;
}

#content .content-area section.contents06 div.contactWrap ul li p {
	display: flex;
	transition: .5s;
	position: absolute;
	background: #d5e9ff;
	z-index: 10;
	box-shadow: 3px 3px 3px #bbb;
	padding: min(3vw , 15px);
	border-radius: 5px;
	left: 10%;
	transform: scale(0 ,0);
	top: 0;
	width: 80vw;
	min-height: 25vw;
	align-items: center;
	justify-content: space-around;
}

#content .content-area section.contents06 div.contactWrap ul li:nth-of-type(even) p {left: -80%;}
#content .content-area section.contents06 div.contactWrap ul li:nth-of-type(odd) p {left: 20%;}


footer {
	/*background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center;*/
	width: 100%;
	padding-top: 0;
	top: 0;
	padding-bottom: 0;
	position: relative;
}

footer nav ul.fe {
	width: 100%;
	margin: auto;
	justify-content: flex-start;
	border-top: 1px #2f57b1 solid;
}

footer nav ul li {
	width: 50%;
	line-height: 15vw;
	border-bottom: 1px #2f57b1 solid;
}

footer nav ul li:nth-of-type(odd) {
	border-right: 1px #2f57b1 solid;
}

footer nav ul li a {
	position: relative;
	display: block;
	padding: 0 5vw;
	cursor: pointer;
}

small {
	text-align: left;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 50vw;
	line-height: 15vw;
	border-bottom: 1px #2f57b1 solid;
	height: 15vw;
	top: initial;
	padding-left: 5vw;
	padding-top: 0;
}


}


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

/* CSS Document */
/*----- last up date 20220125 -----*/

#content .content-area {
	margin: 0 auto;
	width: 100%;
	position: relative;
}
	
#content .content-area section {
	margin: 0 auto;
	width: 100%;
	position: relative;
}

#content .content-area section .mv01{opacity:0; transform: translate(0, 150px); transition: 0.5s;}
#content .content-area section .mv02{opacity:0; transform: translate(0, 150px); transition: 0.8s;}
#content .content-area section .mv03{opacity:0; transform: translate(0, 150px); transition: 1.5s;}
#content .content-area section .mv04{opacity:0; transform: translate(-300px , 0); transition: .9s;}
#content .content-area section .mv05{opacity:0; transform: translate(500px, 0); transition: .9s;}

#content .content-area section .mv01.active,
#content .content-area section .mv02.active,
#content .content-area section .mv03.active,
#content .content-area section .active .mv04,
#content .content-area section .active .mv05{opacity:1; transform: translate(0, 0);}

#content .content-area section.contents01 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_01.jpg) repeat-x center center;
	height: 650px;
	width: 100%;
}

#content .content-area section.contents01.contact {
	height: 150px;
	width: 100%;
}

#content .content-area section.contents01 div.icon {
	max-width: 94px;
	position: absolute;
	top: 30px;
	margin: auto;
	left: 0;
	right: 0;
	width: 16%;
}
#content .content-area section.contents01 h2 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/txt_bg_01.png) repeat-x center center;
	width: 690px;
	height: 527px;
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	bottom: -150px;
	padding: 140px 0px;
	z-index: 2;
}
#content .content-area section.contents01 h2 span {
	color: #fff;
	display: block;
	text-align: center;
	width: 100%;
	line-height: 2;
	letter-spacing: 0;
	font-size: 3.5vw;
}

#content .content-area section.contents02.container {
	background:
	url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center ,
	url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_03.jpg) no-repeat center bottom -20px;
	width: 100%;
	height: 1999px;
	padding-top: 360px;
}
#content .content-area section.contents02 h2 {
	font-size: 24px;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 240px;
	z-index: 2;
}
#content .content-area section.contents02 h2::before {
	content: "About Works";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 3vw;
	letter-spacing: 2px;
}

#content .content-area section.contents02 ul.worksIcon {
	width: 100%;
	height: 100%;
	margin: auto;
	position: relative;
	overflow: hidden;
}

#content .content-area section.contents02 ul.worksIcon li figure {
	position: absolute;
	z-index: 20;
	cursor: pointer;
}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(1) figure{top:50%; left:20%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(2) figure{top:70%; left:50%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(3) figure{top:40%; left:10%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(4) figure{top:60%; left:80%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(5) figure{top:10%; left:10%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(6) figure{top:90%; left:20%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(7) figure{top:40%; left:30%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(8) figure{top:30%; left:50%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li:nth-of-type(9) figure{top:20%; left:80%; width:auto;}
#content .content-area section.contents02 ul.worksIcon li figure{margin:0; position:absolute;}

#content .content-area section.contents02 dl dd {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 70%;
	height: 70vh;
	display: flex;
	background: rgb(255, 255, 255,1);
	padding: 30px;
	transform: scale(0%, 0%);
	-webkit-transform: scale(0, 0);
	opacity: 0;
	justify-content: space-around;
	box-shadow: 3px 3px 7px #555;
}

#content .content-area section.contents02 dl dd.select{
	transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
	opacity:1;
}

#content .content-area section.contents02 dl dd div {
	width: 55%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 170px 0;
}

#content .content-area section.contents02 dl dd div h3 {
	font-size: 4vw;
	width: 100%;
	color: #2f57b1;
}

#content .content-area section.contents02 dl dd div p {
	font-size: 3vw;
	line-height: 2;
	padding: 0;
	text-align: left;
	margin: 0 0 50px;
}

#content .content-area section.contents02 dl dd a.closeBth {
	font-size: 40px;
	position: absolute;
	top: 0;
	right: 20px;
	cursor:pointer;
}

#content .content-area section.contents02 dl dd {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 90%;
	height: 94vh;
	display: flex;
	background: rgb(255, 255, 255,1);
	padding: 0;
	transform: scale(0%, 0%);
	-webkit-transform: scale(.0, .0);
	opacity: 0;
	justify-content: space-around;
	box-shadow: 3px 3px 7px #555;
	flex-wrap: wrap;
}

#content .content-area section.contents02 dl dd figure {
	width: 70%;
	position: relative;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 0;
}
#content .content-area section.contents02 dl dd figure img {
	max-width: 344px;
	width: 70%;
}

#content .content-area section.contents02 dl dd figure p {
	position: absolute;
	left: -15%;
	top: 4vw;
	color: #2f57b1;
	font-size: 4vw;
	bottom: initial;
}

#content .content-area section.contents02 div.wave {
	position: absolute;
	bottom: -180px;
	left: 0;
	z-index: 2;
	transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
	
  animation-name:wavw;
  animation-duration:5s;
  animation-timing-function:ease-in;
  animation-delay:1s;
  animation-iteration-count:2;
  animation-direction:alternate;
  animation-fill-mode:forwards;
  animation-play-state:running;
  animation-iteration-count:infinite;
}

@keyframes wavw{
  0%{
    transform: scale(100%, 130%);
	-webkit-transform: scale(1, 1.3);
  }
  100%{
    transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
  }
}
#content .content-area section.contents02 > p:last-of-type {
	color: #beb463;
	position: absolute;
	bottom: -2%;
	margin: auto;
	right: 5%;
	white-space: nowrap;
	z-index: 2;
}
#content .content-area section.contents02 ul.worksIcon canvas {
	bottom: 0px;
	left: 0px;
	position: absolute;
	top: -110px;
	z-index: 1;
}
canvas.background {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	z-index: 15;
}
.bubble {
  position: absolute;
  border-radius: 100%;
  border: 1px solid #fff;
  bottom: 1px;
	z-index: 15;
}
#content .content-area section.contents02 canvas:last-of-type {
	bottom: 0px;
	left: 0px;
	position: absolute;
	top: -34vw;
	z-index: 10;
	width: 100%;
}

#content .content-area section.contents02 div.bubbleWrap {
	width: 95vw;	
	overflow: hidden;
	position: absolute;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#content .content-area section.contents03 {
/* background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center; */
    width: 100%;
    padding-top: 35vw;
    top: 0;
/* padding-bottom: 290px; */
}
/*
#content .content-area section.contents03::before {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-line_01.png) repeat center center;
	width: 500px;
	height: 290px;
	position: absolute;
	left: 20vw;
	bottom: 0;
	content: "";
}
*/

#content .content-area section.contents04 h2 {
	font-size: 4vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 20vw;
	z-index: 20;
}

#content .content-area section.contents03 h2::before {
	content: "Sample Desing";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 3vw;
	letter-spacing: 2px;
}

#content .content-area section.contents03 .rouletteWrap {
	width: 90%;
	max-width: 1200px;
	max-height: 860px;
	height: 70vh;
	background: #fff;
	margin: auto;
	position: relative;
}

/*

#content .content-area section.contents03 .rouletteWrap .rouletteResult.start figure.rouletteImg{animation:.4s linear infinite rotation;}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop figure.rouletteImg{animation:3s ease-out infinite rotation;}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result01 figure.rouletteImg{ transform:rotate(20deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result02 figure.rouletteImg{ transform:rotate(50deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result03 figure.rouletteImg{ transform:rotate(70deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result04 figure.rouletteImg{ transform:rotate(220deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result05 figure.rouletteImg{ transform:rotate(120deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop.result06 figure.rouletteImg{ transform:rotate(300deg);}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.result01 figure.rouletteImg{ transform:rotate(520deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result02 figure.rouletteImg{ transform:rotate(750deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result03 figure.rouletteImg{ transform:rotate(570deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result04 figure.rouletteImg{ transform:rotate(3220deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result05 figure.rouletteImg{ transform:rotate(2120deg);}
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result06 figure.rouletteImg{ transform:rotate(100deg);}

@keyframes rotation{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

*/

#content .content-area section.contents03 .rouletteWrap .rouletteResult {
	position: absolute;
	max-width: 530px;
	width: 80%;
	margin: auto;
	top: 0vw;
	bottom: 0;
	left: 0;
	right: 0;
	height: 80vw;
	transform: translate(0%, 0%) scale(100%, 100%);
	-webkit-transform: translate(0%, 0%) scale(1, 1);
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.result02Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result03Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result04Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result05Conts,
#content .content-area section.contents03 .rouletteWrap .rouletteResult.result06Conts {
	transform: translate(80%, 50%) scale(70%, 70%);
	-webkit-transform: translate(80%, 50%) scale(.7, .7);
}


#content .content-area section.contents03 .rouletteWrap .rouletteResult.result01Conts{
	transform: translate(0%, 160%) scale(500%, 500%);
	-webkit-transform: translate(0%, 160%) scale(5, 5);
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult::before {
	content: "▼";
	position: absolute;
	top: -6vw;
	left: 0;
	right: 0;
	width: 27px;
	margin: auto;
	font-size: 5vw;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult figure.rouletteImg {
	-webkit-transition: 3s ease all;
	-moz-transition: 3s ease all;
	-o-transition: 3s ease all;
	transition: 3s ease all;
	transition-duration: 3.3s;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult a {
	max-width: 135px;
	max-height: 33px;
	position: absolute;
	top: -5vw;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	opacity: 1;
	z-index: 1;
	cursor: pointer;
	width: 25vw;
	height: auto;
}

#content .content-area section.contents03 .rouletteWrap .rouletteResult.stop a{opacity:0;}
#content .content-area section.contents03 .rouletteWrap > img {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: block;
	margin: auto;
}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(1) {
	width: 17vw;
	height: 18vw;
	top: -80vw;
	left: -60vw;
	animation: 3s ease-out infinite fortune01;
	max-width: 65px;
	max-height: 70px;
}

#content .content-area section.contents03 .rouletteWrap > img:nth-of-type(2) {
	width: 28vw;
	height: 19vw;
	top: -90vw;
	right: -60vw;
	animation: 5s ease-out infinite fortune02;
	max-width: 183px;
	max-height: 121px;
}

@keyframes fortune01{
  0%{ transform: translate(0%, 0%); }
  50%{ transform: translate(0%, 10%); }
  100%{ transform: translate(0%, 0%); }
}


@keyframes fortune02{
  0%{ transform: translate(0%, 0%) rotate(-10deg); opacity:1;}
  20%{opacity:.5; }
  50%{ transform: translate(10%, 10%) rotate(-10deg); }
  40%{opacity:1; }
  100%{ transform: translate(0%, 0%) rotate(-10deg); }
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt {
	transform: scale(30%, 30%);
	-webkit-transform: scale(.3 , .3);
	opacity: 0;
	left: -100%;
	position: absolute;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt h3 {
	font-size: 4vw;
	text-align: center;
	padding: 0 0 5vw;
	position: relative;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	left: 0%;
	background: #fff;
	height: 130vh;
	z-index: 30;
	overflow: hidden;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	padding: 5vh 0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active figure:nth-of-type(2){
	position:absolute;
	top:0;
	left:0;
	transform: scale(30%, 30%);
	-webkit-transform: scale(.3 , .3);
	opacity:0;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt.active.active02 figure:nth-of-type(2){
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots {
	width: 100vw;
	margin: 5vw auto 0;
	justify-content: flex-start;
	display: flex;
	flex-wrap: wrap;
}
#content .content-area section.contents03 .rouletteWrap .rouletteCntnt ul.slick-dots li {
	margin: 0 2vw;
	width: calc(96vw / 6);
	max-height: 20vw;
}

#content .content-area section.contents03 .rouletteWrap .rouletteCntnt a.closeBth {
	font-size: 40px;
	position: absolute;
	top: 0;
	right: 20px;
	cursor:pointer;
}

#content .content-area section.contents04 {
	/* background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center; */
	width: 100%;
	padding-top: 0;
	top: 0;
	padding-bottom: 100px;
}

#content .content-area section.contents04.contact,
#content .content-area section.contents04.contentThanks {overflow:hidden;}

#content .content-area section.contents04 h2 {
	font-size: 24px;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 80px;
	z-index: 2;
}
#content .content-area section.contents04 h2::before {
	content: "Contact";
	font-family: 'メイリオ', 'Meiryo', sans-serif;
	width: 100%;
	text-align: center;
	font-size: 3vw;
	letter-spacing: 2px;
}
#content .content-area section.contents04.contact h2::before {
	content: "Contact Confirm";
}

#content .content-area section.contents04 div.contactWrap {
	width: 90%;
	max-width: 1200px;
	min-height: initial;
	height: auto;
	background: #fff;
	margin: auto;
	padding: 40vw 0 10vw;
	position: relative;
	z-index: 15;
	background: rgba(255,255,255,.7);
	width: 100%;
}

#content .content-area section.contents04.contentThanks div.contactWrap {
	min-height: auto;
	height: 420px;
}

#content .content-area section.contents04::before,
#content .content-area section.contents04::after {
	content: "";
	background: no-repeat center center / 40%;
	position: absolute;
	top: 0;
	height: 277vw;
	margin: auto;

}

#content .content-area section.contents04::before {
	background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_wood_01.png);
	width: 100vw;
	right: 0;
	z-index: 2;
	top: 0;
	background-position: right center;
}
#content .content-area section.contents04::after {
	background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_wood_03.png);
	width: 100vw;
	left: 0;
	top: 0;
	background-position: left center;
}

#content .content-area section.contents04 div.contactWrap figure.woodImage {
	width: 279px;
	height: 598px;
	position: absolute;
	top: 400px;
	left: 0;
	margin: auto;
	z-index: 6;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 411px;
	left: 70px;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon img{position:absolute; left:0; top:0;}
#content .content-area section.contents04 div.contactWrap figure.contactIcon img:nth-of-type(1) {
	width: 45px;
	height: 56px;
	top: 0;
	left: 0;
	z-index: 4;
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon img:nth-of-type(2) {
	width: 46px;
	height: 150px;
	z-index: 7;
	top: -40px;
	left: -50px;
	opacity: 0;
	transform: rotate(20deg);
}
#content .content-area section.contents04 div.contactWrap figure.contactIcon:hover img:nth-of-type(2) {opacity:1; transform: rotate(0deg);}

#content .content-area section.contents04 div.contactWrap > p {
	font-size: 20px;
	color: #b8b7b7;
	position: absolute;
	top: -30px;
	right: -970px;
	left: 0;
	margin: auto;
	width: 300px;
}

#content .content-area section.contents04 div.contactWrap > p.contentTxt {
	font-size: 20px;
	color: #555d74;
	position: static;
	margin: auto;
	width: 50%;
}

#content .content-area section.contents04.contact form{position:relative;}
#content .content-area section.contents04.contact form::after {
	content: "";
	height: 760px;
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
}

#content .content-area section.contents04 form dl{width:840px; margin:auto;}
#content .content-area section.contents04 form dl dt {
	width: 100px;
	color: #b8b7b7;
	height: 70px;
	display: flex;
	align-items: center;
	margin-bottom: 50px;
	padding-left: 28px;
}
#content .content-area section.contents04 form dl dt.check {background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_icon_flower.png) no-repeat left center;}
#content .content-area section.contents04 form dl dt:nth-of-type(5) {width: 150px; padding-left: 20px;}
#content .content-area section.contents04 form dl dd:not(:nth-of-type(5)) {
	width: 300px;
	height: 70px;
	background: no-repeat left center;
	margin-bottom: 50px;
}
#content .content-area section.contents04 form dl dd:nth-of-type(1){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_01.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(2){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_02.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(3){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_04.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(3) input {width:290px;}
#content .content-area section.contents04 form dl dd:nth-of-type(4){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_03.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5){width:calc(96% - 150px);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control{width:100%; display:flex;}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control span input[type='radio']{display:none;}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label {
	height: 70px;
	line-height: 70px;
	display: block;
	position: relative;
	padding-left: 60px;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label::before {
	width: 40px;
	height: 40px;
	background: no-repeat center center;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(1) .wpcf7-list-item-label:before{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_05.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(2) .wpcf7-list-item-label:before{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_06.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(3) .wpcf7-list-item-label:before{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_07.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span input[type="radio"]:checked + .wpcf7-list-item-label::after {
	width: 14px;
	height: 14px;
	background: no-repeat center center;
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 14px;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(1) input[type='radio']:checked + .wpcf7-list-item-label:after{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_dotted.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(2) input[type='radio']:checked + .wpcf7-list-item-label:after{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_dotted.png);}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span:nth-of-type(3) input[type='radio']:checked + .wpcf7-list-item-label:after{background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_dotted.png);}

#content .content-area section.contents04 form dl dd:nth-of-type(6){width:calc(96% - 100px); height:360px;}
#content .content-area section.contents04 form dl dd:nth-of-type(6){background-image: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_08.png);}

#content .content-area section.contents04 form dl dd input{
	font-size: 16px;
	width: 230px;
	border: none;
	height: 50px;
	margin: 10px 15px;
	background: none;
}
#content .content-area section.contents04 form dl dd textarea {
	font-size: 16px;
	width: 85%;
	border: none;
	height: 270px;
	margin: 45px 35px;
	background: none;
}

#content .content-area section.contents04 form dl dd.formBtn {
	width: 100%;
	display: flex;
	justify-content: center;
}
#content .content-area section.contents04 form dl dd.formBtn input {
	width: 100%;
	height: 10vw;
	background: #fff no-repeat center center/100%;
}
#content .content-area section.contents04 form dl dd.formBtn input:nth-of-type(1),
#content .content-area section.contents04 form dl dd.formBtn input:nth-of-type(2) {
	background-image: none;
	color: #333;
	font-weight: normal;
	font-size: 3.5vw;
}

#content .content-area section.contents04 form .wpcf7 form .wpcf7-response-output {
	margin: 2em 0.5em 1em;
	padding: 0.2em 1em;
	border: 2px solid #00a0d2;
	width: 70%;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 160px;
	border-radius: 20px;
}

#content .content-area section.contents05 {
	width: 100%;
	padding-top: 0;
	bottom: 120px;
	padding-bottom: 100px;
	position: absolute;
	z-index: 5;
	transform: scale(30%, 30%);
	-webkit-transform: scale(.3 , .3);
	opacity: 0;
	right: -100%;
}

#content .content-area section.contents05 a.aboutBtn {
	cursor: pointer;
	position: absolute;
	top: 80px;
	right: 130px;
	background: rgba(255,255,255,.6);
	width: 50px;
	height: 50px;
	font-size: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
}

#content .content-area section.contents05.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity:1;
	right:0;
	}

#content .content-area section.contents05 div.contactWrap {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/about_bg.png) no-repeat center center;
	width: 954px;
	height: 1105px;
	margin: auto;
	padding: 0;
	position: relative;
}

#content .content-area section.contents05 div.contactWrap h2 {
	position: absolute;
	bottom: -1050px;
	text-align: right;
	right: -830px;
	left: 0;
	margin: auto;
	width: 80px;
	top: 0;
	height: 30px;
}

#content .content-area section.contents05 div.contactWrap h3 {
	font-size: 30px;
	letter-spacing: 13px;
	font-weight: lighter;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 130px;
	top: 400px;
}

#content .content-area section.contents05 div.contactWrap table {
	width: 700px;
	margin: auto;
	position: absolute;
	left: 0;
	right: 0;
	top: 520px;
}

#content .content-area section.contents05 div.contactWrap table tr{}
#content .content-area section.contents05 div.contactWrap table tr:hover{background:rgba(255,255,255,.4);}
#content .content-area section.contents05 div.contactWrap table tr th {
	width: 30%;
	padding: 35px 20px;
	text-align: right;
}
#content .content-area section.contents05 div.contactWrap table tr td {
	text-align: center;
}

#content .content-area section.contents05 div.contactWrap table tr td span{font-size:80%;}

}



@media only screen and (max-width:1250px){}


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

header {
	width: 100%;
	margin: auto;
	height: 30vw;
	position: relative;
}

header h2 {
	font-size: 4vw;
	text-align: center;
	font-weight: lighter;
	position: absolute;
	right: 5%;
	top: 8vw;
	bottom: initial;
	margin: auto;
	height: 18vw;
}

#content .content-area section.contents01 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_01.jpg) repeat-x center center / 400%;
	height: 120vw;
	width: 100%;
}

#content .content-area section.contents01 h2 {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/txt_bg_01.png) repeat-x center center/100%;
	width: 90%;
	height: 110vw;
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	bottom: -30vw;
	padding: 35vw 0px;
	z-index: 12;
}

#content .content-area section.contents02.container {
	background:
		url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_05.png) no-repeat left top 80vw / 60%,
		url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_04.png) no-repeat right bottom 80vw / 60%,
		#d5e9ff;
	width: 100vw;
	height: 380vw;
	padding-top: 50vw;
}
#content .content-area section.contents02 h2 {
	font-size: 4vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 35vw;
	z-index: 5;
}

#content .content-area section.contents02 ul.worksIcon li figure img{
	width:60%;
}

#content .content-area section.contents02 ul.worksIcon canvas {
	bottom: 0px;
	left: 0px;
	position: absolute;
	top: 0;
	z-index: 1;
}


	
#content .content-area section.contents02 dl dd div {
	width: 90%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0;
}



#content .content-area section.contents02 div.wave {
	position: absolute;
	bottom: -15vw;
	left: 0;
	z-index: 20;
	transform: scale(100%, 100%);
	-webkit-transform: scale(1, 1);
	animation-name: wavw;
	animation-duration: 5s;
	animation-timing-function: ease-in;
	animation-delay: 1s;
	/* animation-iteration-count: 2; */
	animation-direction: alternate;
	animation-fill-mode: forwards;
	animation-play-state: running;
	animation-iteration-count: infinite;
}

#content .content-area section.contents02 > p:last-of-type {display:none;}





#content .content-area section.contents04 {
	/* background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center; */
	width: 100%;
	padding-top: 0;
	top: 0;
	padding-bottom: 20vw;
}
#content .content-area section.contents04 div.contactWrap figure.woodImage,
#content .content-area section.contents04 div.contactWrap > p {display: none;}

#content .content-area section.contents04 h2 {
	font-size: 4vw;
	width: 100%;
	text-align: center;
	letter-spacing: 4px;
	position: absolute;
	top: 20vw;
	z-index: 20;
}
	
#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 0;
	left: 5vw;
}
	
#content .content-area section.contents04 form dl {
	width: 90%;
	margin: auto;
}
#content .content-area section.contents04 form dl dt {
	width: 100%;
	color: #b8b7b7;
	height: 70px;
	display: flex;
	align-items: center;
	margin-bottom: 0;
	padding-left: 28px;
	margin-left: 5vw;
}

#content .content-area section.contents04 form dl dd:not(:nth-of-type(5)) {
	width: 100%;
	height: 70px;
	background: no-repeat left center / 35%;
	margin-bottom: 0;
	margin: 0 4vw 2vw;
}

#content .content-area section.contents04 form dl dt {
	width: 100%;
	color: #555d74;
	height: initial;
	display: flex;
	align-items: center;
	margin-bottom: 0;
	padding-left: 0;
	margin-left: 5vw;
	font-size: 3vw;
}

#content .content-area section.contents04 div.contactWrap > p.contentTxt {
	font-size: 4vw;
	color: #555d74;
	position: static;
	margin: auto;
	width: 80%;
	display: block;
}

#content .content-area section.contents04 form dl dd input {
	font-size: 3vw;
	width: 90%;
	height: 10vw;
	margin: 10px auto;
	background: none;
	border: solid #6688b8 1px;
	border-radius: 50px;
	padding: 0 5vw;
	background: #fff;
}

#content .content-area section.contents04 form dl dd:not(:nth-of-type(5)) {
	width: 100%;
	height: 60px;
	background: none;
	margin-bottom: 0;
	margin: 0 0 7vw;
}

#content .content-area section.contents04 form dl dt.check {background: none;}
#content .content-area section.contents04 form dl dt.check:after {
	content:"※";
	color:#f36171;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5),
#content .content-area section.contents04 form dl dt:nth-of-type(5) {
	width: 100%;
	padding-left: 0;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5){padding-bottom:7vw;}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control .wpcf7-list-item {
	display: block;
	margin: 0 0 0 1em;
	width: 100%;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label {
	height: 11vw;
	line-height: 11vw;
	display: block;
	position: relative;
	padding-left: 8vw;
	font-size: 3vw;
}

#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span .wpcf7-list-item-label::before {
	width: 6vw;
	height: 6vw;
	background: no-repeat center center/100%;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
#content .content-area section.contents04 form dl dd:nth-of-type(5) span.wpcf7-form-control > span input[type="radio"]:checked + .wpcf7-list-item-label::after {
	width: 3vw;
	height: 3vw;
	background: no-repeat center center/100%;
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 2vw;
}

#content .content-area section.contents04 form dl dd:nth-of-type(6) {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_08.png) no-repeat left center / 100%;
	width: 100%;
	height: 41vw;
	margin-bottom: 3vw;
}

#content .content-area section.contents04 div.contactWrap figure.contactIcon {
	position: absolute;
	width: 45px;
	height: 45px;
	top: 0;
	left: 0;
}

#content .content-area section.contents04 form dl dd textarea {
	font-size: 16px;
	width: 89%;
	border: none;
	height: 32vw;
	margin: 5vw;
	background: none;
}

#content .content-area section.contents04 form dl dd.formBtn .wpcf7-spinner {position: absolute;}
#content .content-area section.contents04 form dl dd:nth-of-type(6) {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/form_bg_08.png) no-repeat left center / 100%;
	width: 100%;
	height: 41vw;
	margin-bottom: 0vw;
}



#content .content-area section.contents05 {
	width: 100%;
	padding-top: 0;
	bottom: -50vw;
	padding-bottom: 10vw;
	position: absolute;
	z-index: 25;
	transform: scale(0%, 0%);
	-webkit-transform: scale(0 , 0);
	opacity: 0;
	right: 0;
}
#content .content-area section.contents05.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	right: 0;
	bottom: 190vw;
}

#content .content-area section.contents05.contactThants.active {
	transform: scale(100%, 100%);
	-webkit-transform: scale(1 , 1);
	opacity: 1;
	right: 0;
	bottom: 0;
}

#content .content-area section.contents05 div.contactWrap {
	background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/about_bg.png) no-repeat center center / 100%;
	width: 96%;
	height: 120vw;
	margin: auto;
	padding: 0;
	position: relative;
}

#content .content-area section.contents05 a.aboutBtn {
	cursor: pointer;
	position: absolute;
	top: 13vw;
	right: 10vw;
	background: rgba(255,255,255,.6);
	width: 6vw;
	height: 6vw;
	font-size: 5vw;
	display: flex;
	justify-content: center;
	align-items: center;
}

#content .content-area section.contents05 div.contactWrap h3 {
	font-size: 4vw;
	letter-spacing: 13px;
	font-weight: lighter;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 100%;
	top: 30vw;
	text-align: center;
}
#content .content-area section.contents05 div.contactWrap table {
	width: 100%;
	margin: auto;
	position: absolute;
	left: 0;
	right: 0;
	top: 40vw;
}
#content .content-area section.contents05 div.contactWrap table tr th {
	width: 30%;
	padding: 3vw 4vw;
	text-align: right;
	vertical-align: top;
}

#content .content-area section.contents05 div.contactWrap table tr td {
	text-align: left;
	padding: 2vw 2vw;
}

#content .content-area section.contents05 div.contactWrap h2 {
	display: none;
}

footer {
	/*background: url(https://myff.co.jp/site/wp-content/themes/twentytwentyone-myff/assets/images/top/t-bg_02.png) repeat center center;*/
	width: 100%;
	padding-top: 0;
	top: 0;
	padding-bottom: 0;
	position: relative;
}

footer nav ul.fe {
	width: 100%;
	margin: auto;
	justify-content: flex-start;
	border-top: 1px #2f57b1 solid;
}

footer nav ul li {
	width: 50%;
	line-height: 15vw;
	border-bottom: 1px #2f57b1 solid;
}

footer nav ul li:nth-of-type(odd) {
	border-right: 1px #2f57b1 solid;
}

footer nav ul li a {
	position: relative;
	display: block;
	padding: 0 5vw;
	cursor: pointer;
	font-size: 3.5vw;
}
small {
	text-align: left;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 50vw;
	line-height: 15vw;
	border-bottom: 1px #2f57b1 solid;
	height: 15vw;
	top: initial;
	padding-left: 5vw;
	padding-top: 0;
}

}


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




}