@charset "UTF-8";

/* ===================================================================
CSS information
file name  :  style.css
style info : LPスタイル
=================================================================== */
html {
	scroll-behavior: smooth;
}
body {
    color: #000;
	background-color: #f2f2f2;
	font-family: 'Noto Sans JP', sans-serif, "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-feature-settings: "palt";
	
}
.content--bg--gray {
    background-color: #f2f2f2;
    padding-bottom: 5em;
}
.content {
	width: 750px;
	overflow-x: hidden;
	max-width: 100%;
	margin: 0 auto;
	text-align: center;
	-webkit-box-shadow: 0 0 10px 2px #d6d6d6;
	-moz-box-shadow: 0 0 10px 2px #d6d6d6;
	box-shadow: 0 0 10px 2px #d6d6d6;
	background: url(../img/fv_bg.png?241111)no-repeat center top/ 100%, url(../img/bg_02.png?241111)no-repeat center bottom/ 100%, url(../img/about_bg.png)no-repeat center top 26%/ 100%;
}

main {
	padding:min(calc(205/750 * 100vw), 205px) 0 8.8%;
	box-sizing: border-box;
}

.pink {
	color: #e3005b;
}

sup {
	font-size: min(calc(16/750 * 100vw), 16px);
}

header {
	position: fixed;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	display: flex;
	justify-content: space-between;
	max-width: 750px;
	width: 100%;
	z-index: 99;
}

header h1 {
	width: 100%;
	padding: 0;
}

header p {
	width: calc(71/750 * 100vw);
	max-width: 71px;
}

.header_bnr {
	transition: .3s;
	display: none;
}
.header_bnr.show {
	transition: .3s;
	display: block;
}

.nami {
	background: url(../img/nami_bg.png) repeat-x center top / 100%;
	animation: wave 20s linear infinite;
	background-size: auto min(calc(1414/750 * 100vw), 1414px);
}

@keyframes wave {
	0%, 100% {
		background-position: 10% top;
	}

	50% {
		background-position: 90% top;
	}
}

/* ------------fv------------*/
.fv {
	position: relative;
	margin: 0 auto 11%;
}

.fv h2 {
	margin: 0 auto 0;
	width: calc(750/750 * 100vw);
	max-width: 750px;
	position: relative;
	z-index: 2;
}

.fv_main {
	display: flex;
	justify-content: flex-start;
	padding: 0% 3% 0 3%;
}

.fv_btn {
	position: relative;
	z-index: 3;
	margin: -6% auto 0;
}

.fv_btn h3 {
	width: calc(586/750 * 100vw);
	max-width: 586px;
	margin: 0 auto;
}

.btn01 {
	margin: 4% 0 0 3%;
}

.btn01 a img{
	width: calc(722/750 * 100vw);
	max-width: 722px;
}

.btn01_icon {
	position: absolute;
	top: 41%;
	left: 10%;
	width: calc(146/750 * 100vw);
	max-width: 146px;
}

.btn a {
	display: block;
	-webkit-animation: move_btn 2s ease-in infinite;
	animation: move_btn 2s ease-in infinite;
}

.fv_pic {
	width: calc(416/750 * 100vw);
	max-width: 416px;
	z-index: 3;
	margin-top: 5.3%;
}

.fv_text_l {
	width: calc(135/750 * 100vw);
	max-width: 135px;
	z-index: 2;
	margin: 9% 1.5% 0 0;
}

.fv_text_l img{
	width: 100%;
	height: auto;
}

.fv_text_r {
	width: calc(63/750 * 100vw);
	max-width: 63px;
	z-index: 2;
	margin: 10% 0 0 3%;
}

.fv_bottom_text {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	bottom: -4%;
	width: calc(750/750 * 100vw);
	max-width: 750px;
	z-index: 2;
}

.fv_bottom {
	position: absolute;
	bottom: 4%;
	z-index: 2;
}

.fv_top {
	position: absolute;
	top: 0;
	z-index: 2;
}

.arrow-wrap {
	position: absolute;
	top: 84%;
	left: 48.2%;
	width: calc(29/750 * 100vw);
	max-width: 29px;
	z-index: 3;
}

/* ------------fv slide------------*/
.slide-container {
	width: calc(67/750 * 100vw);
	max-width: 67px;
	height: calc(1400/750 * 100vw);
	max-height: 1400px;
	overflow: hidden;
	flex-direction: column;
	position: absolute;
	z-index: 1;
	right: 0;
	top: 1%;
	display: flex;
}

.slide-left {
	left: 0;
	width: calc(67/750 * 100vw);
	max-width: 67px;
	display: flex;
	align-items: end;
}

.slide-mini-l {
	width: calc(100/750 * 100vw);
	max-width: 100px;
	height: calc(1030/750 * 100vw);
	max-height: 1030px;
	top: 13%;
	left: 16%;
	z-index: 1;
}

.slide-mini-r {
	width: calc(100/750 * 100vw);
	max-width: 100px;
	height: calc(1030/750 * 100vw);
	max-height: 1030px;
	top: 13%;
	right: 16%;
	z-index: 1;
	display: flex;
	align-items: end;
}

.slide-mini-r .slide-wrapper,
.slide-left .slide-wrapper {
	display: flex;
	flex-direction: column;
	animation: slide-flow 10s infinite;
}

.slide-mini-l .slide-wrapper,
.slide-right .slide-wrapper {
	display: flex;
	flex-direction: column;
	animation: slide-flow02 10s infinite;
}

.slide {
	animation: dance 1.5s linear infinite 0.5s;
}

.slide-wrapper img {
	margin: 100% 0;
}

.slide-right img {
	margin: 100% 0 100% auto;
}

.slide-left img {
	margin: 60% auto;
}

.slide-mini-r img {
	margin: 60% auto;
}

.slide {
	max-width: 100%;
	object-fit: cover;
}

.fv_food_right01 {
	width: calc(73/750 * 100vw);
	max-width: 73px;
}

.fv_food_right02 {
	width: calc(61/750 * 100vw);
	max-width: 61px;
}

.fv_food_right03 {
	width: calc(68/750 * 100vw);
	max-width: 68px;
}

.fv_food_right04 {
	width: calc(74/750 * 100vw);
	max-width: 74px;
}

.fv_food_left01 {
	width: calc(107/750 * 100vw);
	max-width: 107px;
}

.fv_food_left02 {
	width: calc(124/750 * 100vw);
	max-width: 124px;
}

.fv_food_left03 {
	width: calc(132/750 * 100vw);
	max-width: 132px;
}

.fv_food_left04 {
	width: calc(109/750 * 100vw);
	max-width: 109px;
}

.fv_food_mini01 {
	width: calc(61/750 * 100vw);
	max-width: 61px;
}

.fv_food_mini02 {
	width: calc(68/750 * 100vw);
	max-width: 68px;
}

.fv_food_mini03 {
	width: calc(74/750 * 100vw);
	max-width: 74px;
}

.fv_food_mini04 {
	width: calc(107/750 * 100vw);
	max-width: 107px;
}

.fv_food_mini05 {
	width: calc(124/750 * 100vw);
	max-width: 124px;
}

.fv_food_mini06 {
	width: calc(132/750 * 100vw);
	max-width: 132px;
}

@keyframes slide-flow {
	0% {
		transform: translateY(0);
	}

	40% {
		transform: translateY(-50%);
	}

	100% {
		transform: translateY(-100%);
	}
}

@keyframes slide-flow02 {
	100% {
		transform: translateY(0);
	}

	40% {
		transform: translateY(-50%);
	}

	0% {
		transform: translateY(-100%);
	}
}

/* ------------nayami------------*/
.nayami li {
	display: flex;
	justify-content: center;
}

.nayami_txt {
	font-size: min(calc(36/750 * 100vw), 36px);
	line-height: 1.67;
	letter-spacing: 3.6px;
	text-align: left;
	text-decoration: underline;
	text-underline-offset: 39%;
}

.nayami {
	margin: 9% auto 0;
}

.nayami li:first-child .nayami_txt {
	margin: 3.8% 3% 0 0;
}

.nayami li:first-child figure {
	width: calc(181/750 * 100vw);
	max-width: 181px;
	animation: floating-y 1.8s ease-in-out infinite alternate-reverse;
}

.nayami li:first-child figure img {
	animation: floating-x 4.2s ease-in-out infinite alternate-reverse;
}

.nayami li:nth-child(2) .nayami_txt {
	margin: 2.9% 0 0 3.8%;
}

.nayami li:nth-child(2) figure {
	width: calc(248/750 * 100vw);
	max-width: 248px;
	animation: floating-y02 1.8s ease-in-out infinite alternate-reverse;
}

.nayami li:nth-child(2) figure img {
	animation: floating-x02 4.2s ease-in-out infinite alternate-reverse;
}

.nayami li:nth-child(3) .nayami_txt {
	margin: 3.0% 1.5% 0 0;
}

.nayami li:nth-child(3) figure {
	width: calc(210/750 * 100vw);
	max-width: 210px;
	animation: floating-y03 1.8s ease-in-out infinite alternate-reverse;
}

.nayami li:nth-child(3) figure img {
	animation: floating-x03 4.2s ease-in-out infinite alternate-reverse;
}

.nayami li:nth-child(4) .nayami_txt {
	margin: 5.2% 0 0 3.4%;
}

.nayami li:nth-child(4) figure {
	width: calc(172/750 * 100vw);
	max-width: 172px;
	animation: floating-y04 1.8s ease-in-out infinite alternate-reverse;
}

.nayami li:nth-child(4) figure img {
	animation: floating-x04 4.2s ease-in-out infinite alternate-reverse;
}

@keyframes floating-x {
	0% {
		transform: rotate(10deg);
	}

	100% {
		transform: rotate(-10deg);
	}
}

@keyframes floating-y {
	0% {
		transform: translateY(-15%);
	}

	100% {
		transform: translateY(15%);
	}
}

@keyframes floating-x04 {
	0% {
		transform: translateX(-5%);
	}

	100% {
		transform: translateX(5%);
	}
}

@keyframes floating-y04 {
	0% {
		transform: translateY(15%);
	}

	100% {
		transform: translateY(-15%);
	}
}

@keyframes floating-x03 {
	0% {
		transform: translateX(15%);
	}

	100% {
		transform: translateX(-5%);
	}
}

@keyframes floating-y03 {
	0% {
		transform: rotate(-15deg);
	}

	100% {
		transform: rotate(15deg);
	}
}

@keyframes floating-x02 {
	0% {
		transform: translateY(-10%);
	}

	100% {
		transform: translateY(15%);
	}
}

@keyframes floating-y02 {
	0% {
		transform: rotate(15deg);
	}

	100% {
		transform: rotate(-15deg);
	}
}

/* ------------about------------*/
.about h2 {
	margin: 0 auto 6%;
	width: calc(606/750 * 100vw);
	max-width: 606px;
	z-index: 3;
	position: relative;
}

.about_pic {
	width: calc(357/750 * 100vw);
	max-width: 357px;
	padding: 2% 0 0;
	margin: 0 0 0 -4.1%;
	opacity: 0;
}

.about_box {
	padding: 0 calc(35/750 * 100vw) 0 calc(33/750 * 100vw);
	display: flex;
	justify-content: center;
}

.about_box h3 {
	width: calc(204/750 * 100vw);
	max-width: 204px;
}

.about_text {
	font-size: min(calc(28/750 * 100vw), 28px);
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.79;
	margin: 4% auto 3% -7%;
}

.about_mini_text {
	font-size: min(calc(24/750 * 100vw), 24px);
	margin: 1% auto 0;

}

/* ------------cv------------*/
.cv {
	scroll-margin-top: min(calc(190/750 * 100vw), 190px);
}

.cv_banner {
	width: min(calc(670/750 * 100vw), 670px);
	margin: auto;
}
.cv01 {
	background: url(../img/cv_bg_01.png?241111) no-repeat top center/ 100%;
	margin: 0 5.5% 3.5%;
	padding: 0 0 2%;
	position: relative;
}

.cv01 h2 {
	margin: 0 auto 7%;
	width: calc(529/750 * 100vw);
	max-width: 529px;
}

.cv01 figure {
	width: calc(291/750 * 100vw);
	max-width: 291px;
	margin: 4.6% 0 0 5.6%;
}

.cv_flex {
	display: flex;
	justify-content: center;
	font-size: min(calc(21.5/750 * 100vw), 21.5px);
	line-height: 1.12;
	letter-spacing: 2px;
}

.cv_grid {
	display: grid;
	position: relative;
}

.cv_grid .cv_pic {
	grid-area: 1 / 1 / 2;
}

.cv_grid .cv_conts {
	grid-area: 1 / 1 / 2;
}

.cv_text {
	text-align: left;
	margin: 1% 0 0 0;
}

.cv_text h3 {
	margin: 0 auto 5%;
	width: calc(343/750 * 100vw);
	max-width: 343px;
}

.cv_sub {
	margin: 0 auto 8%;
}

.cv_name {
	margin: 0 auto 8%;
}

.cv_sitei {
	margin: 0 auto 4.5% 0;
	width: calc(189/750 * 100vw);
	max-width: 189px;
}

.cv_price {
	position: relative;
	width: calc(245/750 * 100vw);
	max-width: 245px;
}

.cv_officon {
	position: absolute;
	width: calc(145/750 * 100vw);
	max-width: 145px;
}
.cv_99 {
	right: -6%;
	bottom: 0%;
}
.cv_5 {
	width: calc(122/750 * 100vw);
	max-width: 122px;
	left: max(calc(-40/750 * 100vw), -40px);
	bottom: 0%;
}
.cv_10 {
	width: calc(122/750 * 100vw);
	max-width: 122px;
	right: max(calc(-40/750 * 100vw), -40px);
	bottom: 0%;
}


.cv01 .cv_icon01 {
	position: absolute;
	top: -4%;
	left: -5.4%;
	width: calc(177/750 * 100vw);
	max-width: 177px;
}

.cv01 .cv_icon02 {
	position: absolute;
	top: -4%;
	right: -3.4%;
	width: calc(164/750 * 100vw);
	max-width: 164px;
}

.cv02 .cv_icon01 {
	position: absolute;
	top: -6%;
	left: 3.6%;
	width: calc(133/750 * 100vw);
	max-width: 133px;
}

.cv02 .cv_icon02 {
	position: absolute;
	top: -2%;
	right: 5.6%;
	width: calc(115/750 * 100vw);
	max-width: 115px;
}

.cv_about {
	width: min(calc(646/750 * 100vw), 646px);
	margin: min(calc(50/750 * 100vw), 50px) auto 0;
}

.btn02 {
	position: relative;
	margin-top: min(calc(44/750 * 100vw), 44px);
}

.btn02 a {
	margin: 0 0 0 4%;
}

.btn02 a img{
	width: calc(632/750 * 100vw);
	max-width: 632px;
}

.btn02 .uiba_dance {
	position: absolute;
	top: max(calc(-30/750 * 100vw), -30px);
	left: min(calc(16/750 * 100vw), 16px);
	width: min(calc(160/750 * 100vw), 160px);
}
.cv_note {
	font-size: min(calc(16/750 * 100vw), 16px);
	line-height: 1.5;
	text-align: right;
	padding-right: 5%;
}

.cv02 {
	margin: 8.5% 5.5% 2.5%;
	padding: 8.5% 0 4%;
	background: url(../img/cv_bg_02.png) no-repeat top center/ 100%;
}

.cv02 h2 {
	width: calc(329/750 * 100vw);
	max-width: 329px;
}

.cv02 figure {
	width: calc(294/750 * 100vw);
	max-width: 294px;
	padding: 0 0 0 2.5%;
}

.cv02 .cv_text {
	margin: 3% 0 0 -1%;
	width: calc(343/750 * 100vw);
	max-width: 343px;
}

.cv02 .cv_price {
	width: calc(256/750 * 100vw);
	max-width: 256px;
}

.cv_88 {
	position: absolute;
	width: calc(141/750 * 100vw);
	max-width: 141px;
	right: -57%;
	top: -51%;
}

.btn03 {
	position: relative;
}

.btn03 a {
	margin: 0 0 0 4%;
}

.btn03 a img{
	width: calc(632/750 * 100vw);
	max-width: 632px;
}

.btn03 p {
	position: absolute;
	top: -11%;
	left: 5%;
	width: calc(106/750 * 100vw);
	max-width: 106px;
}

/* ------------voice------------*/
.voice_h2 {
	position: relative;
	margin: 12.9% auto 1%;
	width: calc(566/750 * 100vw);
	max-width: 566px;
	z-index: 2;
}

.voice_sub {
	font-size: min(calc(24/750 * 100vw), 24px);
	line-height: 1.67;
	margin: 0 auto 2.2%;
}

.voice_name {
	font-size: min(calc(48/750 * 100vw), 48px);
	line-height: 0.71;
	text-align: center;
}

.voice_name span {
	font-size: min(calc(36/750 * 100vw), 36px);
}

.voice_sub_wrap {
	margin: 0 auto 7.8%;
}

.coment {
	position: relative;
	z-index: 1;
	margin: 0 auto min(calc(120/750 * 100vw), 122px);
}

.coment h3 {
	margin: 0 auto 5%;
	width: calc(581/750 * 100vw);
	max-width: 581px;
}

.coment_text {
	font-size: min(calc(28/750 * 100vw), 28px);
	line-height: 1.79;
	text-align: center;
	margin: 0 auto 2.5%;
}

.coment_note {
	font-size: min(calc(16/750 * 100vw), 16px);
	line-height: 1.5;
}

/* ------------marker------------*/
.marker {
	position: absolute;
	width: 96%;
	height: calc(62/750 * 100vw);
	max-height: 62px;
	background: #fff;
	z-index: -1;
	animation: mark 1s ease;
	top: 6%;
	left: 3%;
}

.marker02 {
	position: absolute;
	width: 94%;
	height: calc(62/750 * 100vw);
	max-height: 62px;
	background: #fff;
	z-index: -1;
	animation: mark02 1s ease;
	top: 51%;
	left: 3%;
}

.marker03 {
	position: absolute;
	width: 73.2%;
	height: calc(62/750 * 100vw);
	max-height: 62px;
	background: #fff;
	z-index: -1;
	animation: mark03 1s ease;
	top: 4%;
	left: 13%;
}

.marker04 {
	position: absolute;
	width: 63.2%;
	height: calc(62/750 * 100vw);
	max-height: 62px;
	background: #fff;
	z-index: -1;
	animation: mark04 1s ease;
	top: 33%;
	left: 18%;
}

@keyframes mark {
	0% {
		width: 20%;
	}

	100% {
		width: 96%;
	}
}

@keyframes mark02 {
	0% {
		width: 20%;
	}

	100% {
		width: 94%;
	}
}

@keyframes mark03 {
	0% {
		width: 20%;
	}

	100% {
		width: 73.2%;
	}
}

@keyframes mark04 {
	0% {
		width: 20%;
	}

	100% {
		width: 63.2%;
	}
}

.border-r02,
.border-r01 {
	position: absolute;
	width: calc(2/750 * 100vw);
	max-width: 2px;
	height: 99%;
	background: #e3005b;
	z-index: 1;
	animation: border-r01 1.8s ease;
	top: 0;
	left: 42%;

}

.border-r02 {
	height: 72%;
	animation: border-r02 1.5s ease;
	left: 109%;
}

@keyframes border-r01 {
	0% {
		height: 0%;
	}

	100% {
		width: 99%;
	}
}

@keyframes border-r02 {
	0% {
		height: 0%;
	}

	100% {
		width: 72%;
	}
}

/* ------------asa------------*/
.asa {
	position: relative;
	margin: 0 auto 5%;
}

.asa h2{
	width: calc(673/750 * 100%);
	max-width: 673px;
	margin: 0 auto;
}

.asa h2 img{
	width: 100%;
	height: auto;
}

.asa_ttl {
	position: absolute;
	top: 33%;
	left: 30%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	width: calc(286/750 * 100vw);
	max-width: 286px;
	opacity: 0;
}

/* ------------merit------------*/
.merit {
	margin: 0 auto 11%;
}

.merit_sub_wrap {
	display: flex;
	justify-content: center;
	position: relative;
	margin: 0 auto;
}

.merit_sub {
	margin: 4.5% 2% 0;
	width: calc(548/750 * 100vw);
	max-width: 548px;
}

.merit_sub_wrap p:nth-child(1){
	width: calc(51/750 * 100vw);
	max-width: 51px;
}

.merit_sub_wrap p:nth-child(3){
	width: calc(55/750 * 100vw);
	max-width: 55px;
}

.merit h2 {
	margin: -2.6% auto 7.7%;
	width: calc(572/750 * 100vw);
	max-width: 572px;
}

/* ------------circle------------*/
.circle {
	position: relative;
	margin: 0 auto 10.1%;
}

.cir_text {
	position: absolute;
	width: calc(608/750*100vw);
	max-width: 608px;
	top: 56%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index: 1;
}

.cir_text img {
	animation: rotateAnim 20s linear infinite;
}

@keyframes rotateAnim {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.cir_ttl {
	position: absolute;
	width: calc(443/750*100vw);
	max-width: 443px;
	top: 44.5%;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	z-index: 4;
}

.circle h3 {
	position: relative;
	z-index: 3;
	width: calc(671/750*100vw);
	max-width: 671px;
	margin: 0 auto;
}

.awa_01 {
	position: absolute;
	width: calc(92/750*100vw);
	max-width: 92px;
	bottom: 18.5%;
	left: 50.4%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	z-index: 3;
}

.awa_01 img {
	animation: awa 2s ease-in-out infinite alternate-reverse both;
}

@keyframes awa {
	0% {
		transform: scaleY(-1) translateY(0) rotateX(0deg);
	}

	100% {
		transform: scaleY(-1) translateY(10%) rotateX(30deg);
	}
}

.cir_icon01 {
	position: absolute;
	width: calc(74/750*100vw);
	max-width: 74px;
	top: 1%;
	left: 45.4%;
	z-index: 3;
}

.cir_icon02 {
	position: absolute;
	width: calc(92/750*100vw);
	max-width: 92px;
	top: 84.6%;
	left: 19.5%;
	z-index: 3;
}

.cir_icon03 {
	position: absolute;
	width: calc(159/750*100vw);
	max-width: 159px;
	top: 84%;
	right: 13%;
	z-index: 3;
}

.cir_note {
	font-size: min(calc(16/750 * 100vw), 16px);
	line-height: 1.5;
	text-align: right;
	padding: 0 5.2%;
}

/* ------------comp_wrap------------*/
.comp_wrap li {
	margin: 0 auto 6.8%;
}

.comp_wrap li:nth-child(2) {
	margin: 0 auto 6.4%;
}

.comp_wrap li:nth-child(3) {
	margin: 0 auto 8.2%;
}

.support_sub {
	width: calc(570/750 * 100vw);
	max-width: 570px;
	margin: 0 auto;
}

.support_sub img{
	width: 100%;
}

.support h2 {
	margin: 4.5% auto 6.5%;
	width: calc(513/750 * 100vw);
	max-width: 513px;
}

.support div {
	position: relative;
	display: flex;
	padding: 0 4% 0 3.5%;
	margin: 0 auto 1.8%;
}

.support div figure {
	margin-right: 3.4%;
	width: calc(291/750 * 100vw);
	max-width: 291px;
}

.support_note {
	font-size: min(calc(16/750 * 100vw), 16px);
	line-height: 1.5;
	text-align: right;
	padding-right: 5%;
}

.support_text {
	font-size: min(calc(26/750 * 100vw), 26px);
	line-height: 1.77;
	letter-spacing: 0.1em;
	text-align: left;
	width: 55%;
	left: 365px;
}

.support_icon {
	position: absolute;
	width: calc(88/750 * 100vw);
	max-width: 88px;
	bottom: 4%;
	left: 24.8%;
}

.mikata h2 {
	margin: 4.5% auto 5.5%;
	width: calc(632/750 * 100vw);
	max-width: 632px;
}

.mikata_sub {
	width: calc(303/750 * 100vw);
	max-width: 303px;
	margin: 0 auto;
}

.mikata div {
	position: relative;
	display: flex;
	padding: 0 3.5% 0 5.2%;
	margin: 0 auto 1.8%;
}

.mikata div figure {
	margin: 0 0 0 auto;
	width: calc(291/750 * 100vw);
	max-width: 291px;
}

.mikata_text {
	font-size: min(calc(26/750 * 100vw), 26px);
	line-height: 1.77;
	letter-spacing: 1.3px;
	text-align: left;
	width: 56%;
	max-width: 370px;
}

.mikata_icon {
	position: absolute;
	width: calc(92/750 * 100vw);
	max-width: 92px;
	bottom: 1%;
	right: 28.8%;
}

.happy_sub {
	width: calc(347/750 * 100vw);
	max-width: 347px;
	margin: 0 auto;
}

.happy h2 {
	margin: 4.2% auto 6.5%;
	width: calc(544/750 * 100vw);
	max-width: 544px;
}

.happy div {
	position: relative;
	display: flex;
	padding: 0 4% 0 3.5%;
	margin: 0 auto 1.8%;
}

.happy div figure {
	margin-right: 3.4%;
	width: calc(291/750 * 100vw);
	max-width: 291px;
}

.happy_text {
	font-size: min(calc(26/750 * 100vw), 26px);
	line-height: 1.77;
	letter-spacing: 1.3px;
	text-align: left;
	margin: 2.5% 0 0 0.4%;
	width: 55%;
	max-width: 359px;
}

.happy_icon {
	position: absolute;
	width: calc(159/750 * 100vw);
	max-width: 159px;
	bottom: -11%;
	left: 4.8%;
}

.happy_sub02_wrap {
	display: flex;
	justify-content: space-evenly;
	margin: 0 auto 5%;
}

.happy_sub02_wrap p:nth-child(1),
.happy_sub02_wrap p:nth-child(3) {
	margin: 8% 0 0;
}

.happy_sub02_wrap p:nth-child(1) {
	width: calc(199/750 * 100vw);
	max-width: 199px;
}

.happy_sub02 {
	position: relative;
	width: calc(114/750 * 100vw);
	max-width: 114px;
}

.happy_sub02_wrap p:nth-child(3) {
	width: calc(195/750 * 100vw);
	max-width: 195px;
}

/* ------------fade------------*/
/* その場で */
.fadeIn {
	animation-name: fadeInAnime;
	animation-duration: 1s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeInAnime {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* 左から */
.fadeLeft {
	animation-name: fadeLeftAnime;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeLeftAnime {
	from {
		opacity: 0;
		transform: translateX(-100px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* 右から */
.fadeRight {
	animation-name: fadeRightAnime;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeRightAnime {
	from {
		opacity: 0;
		transform: translateX(100px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* ダンス */
.dance {
	animation: dance_icon 1.5s linear infinite 0.5s;
}

.dance02 {
	animation: dance 1.5s linear infinite 0.5s;
}

.dance03 {
	animation: dance03 1.5s linear infinite 0.5s;
}

.dance04 {
	animation: dance04 1.5s linear infinite 0.5s;
}

@keyframes dance_icon {
	0%, 100% {
		transform: rotate(-10deg);
	}

	50% {
		transform: rotate(10deg);
	}
}

@keyframes dance03 {
	0%, 100% {
		transform: rotate(10deg) scale(1.1);
	}

	50% {
		transform: rotate(-10deg) scale(1);
	}
}

@keyframes dance04 {
	0%, 100% {
		transform: rotate(10deg) scale(1);
	}

	50% {
		transform: rotate(-10deg) scale(1.1);
	}
}

/* 下からとダンス */
.fadeUpdance {
	animation: fadeUpdance 0.7s forwards, dance 1.5s linear infinite 0.5s;
	/* 0.5s delay added here */
	opacity: 0;
}

@keyframes fadeUpdance {
	from {
		opacity: 0;
		transform: translateY(100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes dance {
	0%, 100% {
		transform: rotate(10deg);
	}

	50% {
		transform: rotate(-10deg);
	}
}

/* 下から */
.fadeUp {
	animation: fadeUpAnime 0.7s forwards;
	opacity: 0;
}

@keyframes fadeUpAnime {
	from {
		opacity: 0;
		transform: translateY(100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 上から */
.fadeDown {
	animation-name: fadeDownAnime;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeDownAnime {
	from {
		opacity: 0;
		transform: translateY(-100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 拡大 */
.zoomIn {
	animation-name: zoomInAnime;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

@keyframes zoomInAnime {
	from {
		transform: scale(0.6);
		opacity: 0;
	}

	to {
		transform: scale(1);
		opacity: 1;
	}
}

/* 縮小 */
.zoomOut {
	animation-name: zoomOutAnime;
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-delay: 0.5s;
}

@keyframes zoomOutAnime {
	from {
		transform: scale(1.2);
	}

	to {
		transform: scale(1);
	}
}

/* ------ move_btn_anime ------ */
@keyframes move_btn {
	20%, 53%, 80%, from, to {
		transform: translate3d(0, 0, 0);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1);
	}

	40%, 43% {
		transform: translate3d(0, -10px, 0);
		animation-timing-function: cubic-bezier(.755, .050, .855, .060);
	}

	70% {
		transform: translate3d(0, -4px, 0);
		animation-timing-function: cubic-bezier(.755, .050, .855, .060);
	}

	90% {
		transform: translate3d(0, 0, 0);
	}
}
@media only screen and (max-width: 750px) {
	.support_icon {	
		bottom: 19%;
	}
	.cv02 {
		padding: 9.8% 0 8%;
	}
	main {
		padding: 27% 0 8%;
	}
}
.ec-layoutRole .ec-layoutRole__contents {
    max-width: 100%;
}
#form {
    max-width: 780px;
    margin: auto;
}