@charset "utf-8";

:root {
	--color-red:#F32840;
}

/*
GLOBAL
***************************************************************************/
html { 
	font-size: 62.5%; 
	-webkit-overflow-scrolling: touch;
}

body{
	width: 100%;
	height:100%;
	font-family:'Noto Sans JP', sans-serif;
	overflow-wrap: break-word;
	word-wrap: break-word;
	text-align: left;
	font-size: 1.6rem;
	line-height: 1.5;
	color:#fff;
	background-size:100% auto;
	font-weight:700;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	overflow-x: hidden;
	position:relative;
}


/*
DEFAULT
***************************************************************************/
body,
h1,h2,h3,h4,h5,h6,p,
ul,ol,li,dl,dt,dd,
form,fieldset,legend,pre,blockquote,figure {
	margin: 0;
	padding: 0;
	font-feature-settings: "normal";
	-webkit-font-feature-settings: "normal";
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,video {
	display: block;
}

*:focus { outline: none; }

.clearfix:after {
	display: block;
	clear: both;
	content: "";
	overflow: hidden;
}

li { list-style-type: none; }

table {
	width: 100%;
	border-collapse: collapse;
}

/* ▼LINK▼ */
a {
	color: var(--color-font);
	text-decoration: none;
	outline: none;
	transition-duration:0.3s;
}

/* ▼IMG▼ */
img, input[type="image"]{
	max-width: 100%;
	font-size: 0;
	line-height: 0;
	vertical-align: middle;
	border: none;
}

.pcview a:hover{opacity:0.6;}
.pcview a[href*="tel:"]{
	pointer-events: none;
	cursor: default;
}
.pcview a[href*="tel:"]:hover{opacity:1;}
.pcview .sp{display: none !important;}
.mobile .pc{display: none !important;}



/*
CONTENTS
***************************************************************************/
.container{ width:100%; }

/*******************KV*******************/
.kv{
	width:100%;
	height:170vw;
	position:relative;
}
.kv .img{
	width:100%;
	height:100%;
}
.kv .img img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.kv_txt{
	position:absolute;
	width:86.6vw;
	left:6.6vw;
	top:0;
}
.kv_txt > div{
	width:100%;
	position:relative;
}
.kv_txt h1{
	width:100%;
	padding-top:18vw;
}
.kv_txt .cp_date{
	position:absolute;
	right:0;
	top:0;
	width:16vw;
}
.kv_txt .cp_logo{
	padding-top:1vw;
	width: 10.9%;
}

@media screen and (min-width: 751px) {
	.kv{ height:50vw; }
	.kv_txt{
		width:100%;
		left:63.5%;
		transform:translateX(-50%);
	}
	.kv_txt h1{
		width:27%;
		padding-top:3.3%;
		}
	.kv_txt .cp_date{
		width:10%;
		right:35%;
	}
}

/*******************DOWNLOAD*******************/
.download {
	position:absolute;
	width:100%;
	top:135vw;
}
.mobile .download {
	top:125vw;
}

.dl_inner{
	width:88%;
	margin:0 auto;
	max-width:530px;
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.mobile .dl_inner{
	max-width:330px;
	flex-flow: column-reverse;
}

.dl_inner .dl_qr{
	flex:0 1 20%;
	position:relative;
}
.mobile .dl_inner .dl_qr {
	display:none;
}

.dl_inner .dl_app{
	flex:0 1 159px;
	margin:0 0 0 15px;
}
.dl_inner .dl_app a {
	display:block;
}
.dl_inner .dl_app .apple{ margin-bottom:10px; }
.mobile .dl_inner .dl_app{ margin:0 }
.mobile .dl_inner .dl_app .apple{ margin-bottom:0; }
.iphone .dl_inner a.google{ display:none; }
.android .dl_inner a.apple{ display:none; }

.dl_inner .dl_sns{
	flex:1 1 152px;
	display:flex;
}
.mobile .dl_inner .dl_sns{
	flex:1 1 100%;
	margin-bottom: 5vw;
	justify-content: space-between;
}

.dl_inner .dl_sns a{
	width:50px;
	margin-left:max(5px, min(3vw,16px));
	margin-left:clamp( 5px, 3vw, 16px);
}
.dl_inner .dl_vl {
	border-left: 1px solid;
	border-left-color: rgba(255, 255, 255, 0.2);
	height: 96px;
	margin-left: 16px;
}

@media screen and (min-width: 751px) {
	.download {
		position:absolute;
		width:100%;
		top:32vw;
	}
}

/*******************INTRO*******************/
.intro{
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/intro_bg_sp.png) no-repeat bottom;
	background-size:100%;
	width:auto;
	margin:8vw auto 0;
	box-sizing:border-box;
	position:relative;
	padding:0 6.4vw 70vw;
	font-size:max(1.6rem, min(4.3vw,2.4rem));
	font-size:clamp( 1.6rem, 4.3vw, 2.4rem);
	font-weight:400;
	line-height:1.8;
	text-align:center;
	color:#000;
}
.intro .txt1{
	font-size:max(2rem, min(4.3vw,2.4rem));
	font-size:clamp( 2rem, 4.3vw, 2.4rem);	font-size:max(2.2rem, min(6.9vw,3.6rem));
	font-size:clamp( 2.2rem, 6.9vw, 3.6rem);
	font-weight:700;
	color:#CA0000;

}
.intro .txt2{
	position:relative;
	padding:10px 0 15px;
	margin:4vw auto 30px;
	border:5px solid #CA0000;
	color:#CA0000;
	width:70.6vw;
	max-width:400px;
}
.intro .txt2 strong{
	font-size:max(2.6rem, min(7.5vw,3.6rem));
	font-size:clamp( 2.6rem, 7.5vw, 3.6rem);
	font-weight:900;
}
.intro .txt2:before,
.intro .txt2:after{
	content:"";
	position:absolute;
	width:0;
	height:0;
	margin:auto;
}
.intro .txt2:before{
	left:25px;
	bottom: -30px;
	border-style:solid;
	border-color:#CA0000 transparent transparent transparent;
	border-width:30px 30px 0 0;
}
.intro .txt2:after{
	left:30px;
	bottom:-19px;
	border-style:solid;
	border-color:#fff transparent transparent transparent;
	border-width:19px 19px 0 0;
	z-index:10;
}
.intro .txt3{
	color:#CA0000;
	font-weight:900;
	font-size:max(2.2rem, min(6.9vw,3.6rem));
	font-size:clamp( 2.2rem, 6.9vw, 3.6rem);
}
.intro .img picture{
	display:flex;
	justify-content: space-around; 
	margin:2.6vw auto;
}
.intro .img img{
	width:25.6vw;
	margin:0 10px;
}
@media screen and (min-width: 751px) {
	.intro{
		background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/intro_bg_pc.png) no-repeat bottom;
		background-size:100%;
	width:auto;
		padding:0 6.4vw 35vw;
		margin:4vw 0 0;
	}
	.intro .txt2{
		border:6px solid #CA0000;
		max-width:400px;
	}
	.intro .txt2:before{left:35px;}
	.intro .txt2:after{
		left:40px;
		bottom:-17px;
		border-width:17px 17px 0 0;
	}
	.intro .img picture{
		justify-content: center;
	}
	.intro .img img{
		max-width:240px;
	}
}

/*******************JOIN*******************/
.join{
	position:relative;
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/join_bg.png) no-repeat center bottom;
	padding:10.6vw 0 15vw;
	z-index:10;
	
}
.join .txt{
	text-align:center;
	font-size:max(1.6rem, min(4.3vw,2.4rem));
	font-size:clamp( 1.6rem, 4.3vw, 2.4rem);
	line-height:1.8;
}
.join .txt .txt1{
	font-size:max(2rem, min(6.4vw,3.2rem));
	font-size:clamp( 2rem, 6.4vw, 3.2rem);
}
.join .txt .txt2{
	font-weight:900;
	font-size:max(3.2rem, min(7.5vw,3.8rem));
	font-size:clamp( 3.2rem, 7.5vw, 3.8rem);
}
.join .img{
	display:block;
	width:12vw;
	max-width:94px;
	position:absolute;
	top:max(10px, min(5.3vw,25px));
	top:clamp( 10px, 5.3vw, 25px);
	right:max(10px, min(5.3vw,30px));
	right:clamp( 10px, 5.3vw, 30px);
}

@media screen and (min-width:751px) {
	.join{
		background-size:cover;
		padding:3.1vw 0 6.7vw;
	}

}


/*******************PRESENT*******************/
.present{
	padding:24vw 0 max(20px, min(10.6vw,70px));
	padding:24vw 0 clamp( 20px, 10.6vw, 70px);
	position:relative;
	background-color:#9D0000;
	margin-top:-20vw;
}
.present .lead{
	text-align:center;
	width:88%;
	max-width:600px;
	margin:0 auto 30px;
	font-size:max(1.6rem, min(4.3vw,2.4rem));
	font-size:clamp( 1.6rem, 4.3vw, 2.4rem);
	line-height:1.8;
	position:relative;
	z-index:10;
}
.present .lead strong{
	font-weight:900;
	font-size:max(3.2rem, min(7.5vw,3.8rem));
	font-size:clamp( 3.2rem, 7.5vw, 3.8rem);
}
.present ul{
	width:88%;
	max-width:600px;
	margin:0 auto 7vw;
	display:flex;
	justify-content:space-around;
	flex-wrap:wrap;
}
.present li{
	flex:0 1 46.5%;
	margin:0 0 max(10px, min(5vw,60px));
	margin:0 0 clamp( 10px, 5vw, 60px);
	position:relative;
}
.present li a{
	text-decoration:underline;
	font-size:max(1.1rem, min(3.7vw,1.8rem));
	font-size:clamp( 1.1rem, 3.7vw, 1.8rem);
	display:block;
}
.present li figure{
	display:block;
	margin:0 0 max(3px, min(1.3vw,10px));
	margin:0 0 clamp( 3px, 1.3vw, 10px);
	position:relative;
}
.present li figcaption{
	position:absolute;
	text-align:right;
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
	line-height:1;
	right:5px;
	bottom:max(2px, min(.8vw,8px));
	bottom:clamp( 2px, .8vw, 8px);
}
.present li .num{
	position:absolute;
	width:10.6vw;
	height:9.6vw;
	top:-5px;
	right:-5px;
	background-color:#000;
	color:#fff;
	border-radius:15px 15px 15px 0;
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
	text-align:center;
	display:flex;
	justify-content:center;
	align-items:baseline;
	padding-top:1vw;
}
.present li .num span{
	font-size:max(2rem, min(6.4vw,3.2rem));
	font-size:clamp( 2rem, 6.4vw, 3.2rem);
}

@media screen and (min-width: 751px) {
	.present{
		padding-bottom:3.1vw;
	}
	.present ul{ margin:0 auto 5px; }
	.present li{
		flex:0 1 30%;
		margin:0;
	}
	.present li .num{
		width:50px;
		height:50px;
		padding-top:0;
		font-size:1.4rem;
	}
	.present li .num span{
		font-size:3.2rem;
	}
}



/*******************MORE*******************/
.more{
	position:relative;
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/more_bg.png) no-repeat center center;
	padding:10.6vw 0;
	position:relative;
	background-color:#9D0000;
	text-align:center;
}
.more p{
	
	font-size:max(2rem, min(6.4vw,3.2rem));
	font-size:clamp( 2rem, 6.4vw, 3.2rem);
}
.more .ph{
	position:relative;
	width:280px;
	height:400px;
	margin:50px auto 0;	
}
.more .lead{
	font-size:max(1.6rem, min(4.3vw,2.4rem));
	font-size:clamp( 1.6rem, 4.3vw, 2.4rem);
	font-weight:400;
}
.more .lead span{
	font-size: max(2rem, min(6.4vw,3.2rem));
	font-size: clamp( 2rem, 6.4vw, 3.2rem);
	font-weight:600;
}
.more .ph_pc {
	max-width: 920px;
	margin: 20px auto;
}
.more .ph_sp{
	position:absolute;
	width:189px;
	left:0;
	right:0;
	top:0;
	margin:auto;
	z-index:1px;
}
.more .txt1{
	position:absolute;
	width:189px;
	bottom:-20px;
	left:-50px;
	z-index:10px;
}
.mobile .more .txt1 {
	position:absolute;
	width:189px;
	bottom:-20px;
	left:-50px;
	z-index:10px;
}

.more .txt2{
	position:absolute;
	top:-16px;
	left:-30px;
	background: #CA0000;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	padding:10px 15px;
	z-index:10px;
	display:inline-block;
}
.more .txt2:after{
	content:"";
	position:absolute;
	bottom: -15px;
	right:20px;
	width:0px;
	height:0px;
	margin:auto;
	border-style:solid;
	border-color:#CA0000 transparent transparent transparent;
	border-width:15px 0 0 15px;
}
.more .txt2 span{
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
}
.more .txt3{
	position:absolute;
	width:144px;
	height:144px;
	left:135px;
	bottom:40px;
	background: #fff;
	color:#CA0000;
	font-weight:900;
	border-radius:50% 50%;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	z-index:10px;
	display:flex;
	justify-content:center;
	align-items:center;
}
.more .txt3 strong{
	font-size:max(1.8rem, min(4.3vw,2.4rem)) ;
	font-size:clamp(1.8rem, 4.3vw, 2.4rem) ;
}

.more .more_desc p{
	margin-top: 20px;
	font-size: 1.2rem;
	font-weight: normal;
}
.pcview .more .more_desc p{
	margin-top: -40px;
}

.more .title01 span span:after{
	display:none;
	border:0;
}

@media screen and (min-width:751px) {
	.more{
		padding:3.1vw 0 6.7vw;
	}

}


/*******************PRIZE*******************/
.prize{
	background-color:#9D0000;
	padding:10.6vw 0 0;
}
.prize .title_02 span{
	width:auto;
}
.prize ul{
	width:88%;
	max-width:600px;
	margin:0 auto;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
.prize li{
	flex:0 1 46.5%;
	margin:max(5px, min(2.5vw,30px)) 0 max(10px, min(5vw,60px));
	margin:clamp( 5px, 2.5vw, 30px) 0 clamp( 10px, 5vw, 60px);
	font-size: max(1.4rem, min(3.8vw,2.0rem));
	font-size: clamp( 1.4rem, 3.8vw, 2.0rem);
	position:relative;
}
.prize li:first-of-type{
	flex-basis:100%;
}
.prize li a{
	text-decoration:underline;
	font-size:max(1.1rem, min(3.7vw,1.8rem));
	font-size:clamp( 1.1rem, 3.7vw, 1.8rem);
	display:block;
}
.prize li figure{
	display:block;
	margin:0 0 max(3px, min(1.3vw,10px));
	margin:0 0 clamp( 3px, 1.3vw, 10px);
	position:relative;
}
.prize li figcaption{
	position:absolute;
	text-align:right;
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
	line-height:1;
	right:5px;
	bottom:max(2px, min(.8vw,8px));
	bottom:clamp( 2px, .8vw, 8px);
}
.prize li span{
	font-size:max(1.6rem, min(5.3vw,2.4rem));
	font-size:clamp( 1.6rem, 5.3vw, 2.4rem);
}
.prize li .num{
	position:absolute;
	width:10.6vw;
	height:9.6vw;
	top:-20px;
	left:0px;
	background: #DAB93E;
	color:#000;
	text-align:center;
	display:flex;
	justify-content:center;
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
	align-items:baseline;
	padding-top:1vw;
}
.prize li .num span{
	font-size:max(2rem, min(6.4vw,3.2rem));
	font-size:clamp( 2rem, 6.4vw, 3.2rem);
	margin-top:-4px;
}
.prize li .txt{
	border:1px solid #fff;
	padding:10px 12px;
	margin:15px 0;
	font-weight:400;
	font-size:max(1.1rem, min(3.7vw,1.4rem));
	font-size:clamp( 1.1rem, 3.7vw, 1.4rem);
}
@media screen and (min-width:751px) {
	.prize{
		padding:6.2vw 0 0;
	}
	.prize ul{
		width:auto;
		max-width:950px;
		margin:0 auto;
		flex-wrap:nowrap;
	}
	.prize li{
		flex:0 1 215px;
		margin-right:10px;
	}
	.prize li:first-of-type{
		flex-basis:448px;
	}
	.prize li .num{
		width:60px;
		height:50px;
		padding-top:10px;
	}
}

/*******************FLOW*******************/
.flow{
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/flow_img.png) no-repeat center bottom #9D0000;
	background-size: auto 71.4vw;	
	padding:10.6vw 0 71.4vw;
}

.flow .title_02 span{
	width:auto;
}

.flow_subtitle{
	text-align: center;
	font-size: 1.6rem;
	margin: 0 6rem 10vw;
	font-weight: normal;
}

@media screen and (min-width:751px) {
	.flow_subtitle{
		text-align: center;
		font-size: 2.3rem;
		margin: 0 6rem;
		font-weight: normal;
	}
}


.flow .box{
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/flow_bg.png) no-repeat center bottom;
	background-size:100%;
	position:relative;
	color:#000;
	width:88%;
	margin:-20px auto 0;
	padding-bottom:12vw;
	text-align:center;
	filter:drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
	font-size:max(1.6rem, min(4.8w,2.4rem));
	font-size:clamp( 1.6rem, 4.8vw, 2.4rem);
	font-weight:400;
}
.flow .box:nth-of-type(1){
	z-index:10;
	margin-top:20px;
}
.flow .box:nth-of-type(2){
	z-index:8;
}
.flow .box:nth-of-type(3){
	z-index:6;
}
.flow .box:nth-of-type(4){
	z-index:4;
}
.flow .box .label{
	position:absolute;
	top:0;
	left:0;
	background-color:#000;
	color:#fff;
	padding:8px 13px;
	font-size:max(1.8rem, min(5.3vw,3.2rem));
	font-size:clamp( 1.8rem, 5.3w, 3.2rem);
}
.flow .box p{
	margin:1em 0;
}
.flow .box p.arrow{
	position:relative;
	margin-bottom:50px;
	margin-bottom: 42px;
}
.flow p.arrow:after {
	position: absolute;
	content: "";
	left:50%;
	bottom:-30px;
	width:15px;
	height:12px;
	margin-left: -6px;
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/arrow.png) no-repeat left top;
	background-size: 15px 12px;
}
.flow .box .num{
	position:absolute;
	top:15px;
	left:0;
	right:0;
	margin:auto;
	width:max(.30px, min(8vw,46px));
	width:clamp( 30px, 8vw, 46px);
	height:max(.30px, min(8vw,46px));
	height:clamp( 30px, 8vw, 46px);
	border-radius:100%;
	background-color:#CA0000;
	color:#fff;
	line-height:1;
	display:flex;
	justify-content:center;
	align-items:center;
}
.flow .box .txt1{
	position:relative;
	padding-top:50px;
	margin:10px 20px;
}

.flow .box .cap{
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
	margin:0;
	text-align:left;
}
.flow .box .btn{
	background:#EE7200;
	box-shadow:0px 3px 3px rgba(0, 0, 0, 0.5);
	padding:15px;
	margin:10px 0;
	border-radius:5px;
	font-weight:900;
	color:#fff;
}
.flow .box img{
	margin:10px 0;
	width:100%;
}
.flow .txt{
	width:calc(88% - 24px);
	border:1px solid #fff;
	padding:20px 12px;
	margin:15px auto;
	font-weight:400;
	font-size: max(1.4rem, min(3.8vw,1.4rem));
	font-size: clamp( 1.4rem, 3.8vw, 1.4rem);
}
.flow .ph{
	display:flex;
	justify-content:center;
	align-items:stretch;
	margin:30px 10px;
}
.flow .ph .ph_sp{
	position:relative;
	flex-basis:170px;
	margin:0;
	z-index:1px;
}
.flow .ph .txt1{
	position:absolute;
	width:108px;
	top:-10px;
	left:0;
	right:0;
	background: #fff;
	color:#CA0000;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	margin:auto;
	padding:10px 0;
	text-align:center;
	z-index:10px;
	display:inline-block;
}
.flow .ph .txt1:after{
	content:"";
	position:absolute;
	bottom: -15px;
	right:20px;
	width:0px;
	height:0px;
	margin:auto;
	border-style:solid;
	border-color:#fff transparent transparent transparent;
	border-width:15px 0 0 15px;
}
.flow .ph .txt1 span{
	font-size:max(.8rem, min(2vw,1.4rem));
	font-size:clamp( .8rem, 2vw, 1.4rem);
}
.flow .ph .prize {
	width:43%;
	max-width:170px;
	background-color:#fff;
	color:#000;
	border-radius:5px;
	padding:10px;
	margin-bottom:8px;
	font-size:max(.8rem, min(1vw,1rem));
	font-size:clamp( .8rem, 1vw, 1rem);
	font-weight:400;
}
.flow .ph .prize .prize_inner{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	border-top:1px dotted #ccc;
	padding:4px 0;
}
.flow .ph .prize .prize_inner:first-of-type{
	border:0;
}	
.flow .ph .prize h2{
	flex-basis:100%;
	background:#000;
	color:#fff;
	text-align:center;
	padding:5px 0;
}
.flow .ph .prize .num{
	background: #DAB93E;
	color:#000;
	flex-basis:27px;
	height:27px;
	text-align:center;
	margin:5px 0;
	display:flex;
	justify-content:center;
	align-items:center;
}
.flow .ph .prize .num span{
	font-size: max(1.4rem, min(3.8vw,2.0rem));
	font-size: clamp( 1.4rem, 3.8vw, 2.0rem);
	margin-top:-4px;
}
.flow .ph .prize .txt2{
	flex-basis:calc(90% - 30px);
	margin:5px;
}
.flow .ph .prize .txt2 span{
	font-size:1.4rem;
}

.pcview .flow .arrow_w{
	width: 20px;
	margin: 30px auto 30px;
	display: block;
}
.mobile .flow .arrow_w{
	width: 5%;
	margin: 7vw auto 0;
	display: block;
}

@media screen and (min-width:751px) {
	.flow{
	background-size:100%;	
	padding:3.1vw 0 38vw;
	}
	.flow .flow_inner{
		display: flex;
		width:640px;
		margin:0 auto;
		flex-wrap:wrap;
	}
	.flow .box{
		background-image:none;
		background-color:#fff;
		width:calc(50% - 20px);
		margin:10px;
		padding-bottom:0;
		text-align:center;
		box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25);
		font-size: max(1.4rem, min(3.8vw,2.0rem));
		font-size: clamp( 1.4rem, 3.8vw, 2.0rem);
		align-items:stretch;
	}
	.flow .box:nth-of-type(1){
		margin-top:10px;
	}
	.flow .box .label{
		font-size:1.8rem;
	}
	.flow .box .code{
		box-sizing:border-box;
		width:100%;
		border:solid #CA0000;
		border-width:15px 20px;
		border-radius:3px;
		padding:5px;
	}
	.flow .box .num{
		width:30px;
		height:30px;
	}
	.flow .box p {
		margin: .5em 0;
	}
	.flow .box img {
		width:266px;
		height:128px;
		object-fit:cover; 
}
	.flow .txt{
		width:605px;
	}
	.flow .box .txt1{
		padding-top:40px;
		margin:10px;
	}
	.flow .box:nth-of-type(4) .txt1{
		margin-top:30%;
	}
	.flow .box .cap{
		font-size:.8rem;
	}
	.flow .ph{
		margin:30px auto;
	}
	.flow .ph .prize{
		width:170px;
	}
}

/*******************FLOW PC********************/

.flow .flow_inner_pc {
	display: flex;
	justify-content: space-evenly;
	margin: auto;
	max-width: 920px;
}

.flow .flow_inner_pc img {
	margin: auto;
	display: block;
	max-width: 95%;
	flex: 0;
}

.flow .flow_inner_pc .flow_text {
	text-align: center;
	max-width: 95%;
	margin: auto;
	font-size: 1.6rem;
	font-weight: 400;
}
.flow .flow_inner_pc .flow_annotation {
	text-align: left;
	max-width: 95%;
	margin: auto;
	font-size: 1.3rem;
	font-weight: 400;
	margin-top: 10px;
}

.flow .flow_inner_pc .flow_title_b {
	width: 95%;
	margin: auto;
	position:relative;
	background-color:#000;
	color:#fff;
	font-weight:600;
	font-size: 18px;
	line-height:86px;
	height: 86px;
	text-align: center;
}
.flow .flow_inner_pc .flow_title_b span {
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
}

.flow .flow_inner_pc .flow_title_w {
	width: 95%;
	margin: auto;
	position:relative;
	background-color:#fff;
	color:#CA0000;
	font-weight:600;
	font-size: 16px;
	line-height:86px;
	height: 86px;
	text-align: center;
}
.flow .flow_inner_pc .flow_title_w span {
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
}

.flow .flow_inner_pc .flow_1 {
	flex: 0.253;
}

.flow .flow_inner_pc .flow_2 {
	flex: 0.377;
}

.flow .flow_inner_pc .flow_3 {
	flex: 0.377;
}

.flow .flow_inner_pc .flow_number {
	margin-top: 20px;
	margin-bottom: 20px;
}

.flow .flow_inner_pc .flow_img {

}

.flow .flow_inner_pc .flow_1 .flow_text {
	margin-top: 10px;
}

.flow .flow_inner_pc .flow_2 .flow_text {
	margin-top: 10px;
	margin-bottom: 20px;
}

.flow .flow_inner_pc .flow_3 .flow_text {
	margin-bottom: 10px;
}

.flow .flow_inner_pc .flow_2 .flow_annotation {
	width: 80%;
}

.flow .flow_inner_4 {
	width: 53.08%;
	max-width: 920px;
	margin: auto;
}

.flow .flow_inner_4 .flow_title_b {
	width: 95%;
	margin: auto;
	position:relative;
	background-color:#000;
	color:#fff;
	font-weight:600;
	font-size: 1.75rem;
	padding-top: 4px;
	padding-bottom: 8px;
	text-align: center;
}
.flow .flow_inner_4 .flow_title_b span {
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
}

.flow .flow_inner_4 img {
	margin: auto;
	display: block;
	/*max-width: 95%;*/
	/*flex: 0;*/
}

.flow .flow_inner_4 .flow_number {
	margin-top: 20px;
	margin-bottom: 20px;
}

.flow .flow_inner_4 p {
	margin-bottom: 20px;
	text-align: center;
	font-size: 2rem;
}

.flow .flow_inner_4 .flow_4_container {
	display: flex;
	justify-content: space-evenly;
	align-items: baseline;
}

/*******************DOWNLOAD*******************/
.flow_download{
	background-color:#FFFFFF;
	max-width: 468px;
	padding:15px 0;
	margin-left: auto;
	margin-right: auto;
	border-radius: 10px;
	margin-top: 3vw;
}

.mobile .flow_download {
	max-width: 448px;
	margin-left: 20px;
	margin-right: 20px;
}

.flow_dl_inner{
	width:88%;
	margin:0 auto;
	max-width:530px;
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.mobile .flow_dl_inner{ max-width:330px; }
.flow_dl_inner .flow_dl_qr{
	flex:0 1 35%;
	position:relative;
}
.pcview .flow_dl_inner .flow_dl_qr{
	flex:0 1 28%;
	position:relative;
}
.flow_dl_inner .flow_dl_qr_cmt{
	position: absolute;
	background-color: #000;
	width: 122px;
	text-align: center;
	height: 20px;
	line-height: 20px;
	font-size: 1rem;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
}
.flow_dl_inner .flow_dl_qr_cmt::after {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	position: absolute;
	bottom: -8px;
	left: 50%;
	margin-left: -4px;
	background: linear-gradient(to left bottom , rgba(0,0,0,1),rgba(0,0,0,1) 50%,rgba(0,0,0,0) 50%,rgba(0,0,0,0));
}
.flow_dl_inner .flow_dl_app{
	flex:0 1 55%;
}
.pcview .flow_dl_inner .flow_dl_app{
	flex:0 1 35%;
}


.flow_dl_inner .flow_dl_app a{display:block;}
.flow_dl_inner .flow_dl_app .apple{ margin-bottom:10px; }
.mobile .flow_dl_inner .flow_dl_app{ margin:0; }
.mobile .flow_dl_inner .flow_dl_app .apple{ margin-bottom:1.5vw; }
.iphone .flow_dl_inner a.google{ display:none; }
.android .flow_dl_inner a.apple{ display:none; }
.flow_dl_inner .flow_dl_directions{
	color: #CA0000;
	font-size: 1.45rem;
}

.pcview .flow_dl_inner .flow_dl_directions {
	flex:0 1 33%;
	margin-left: 10px;
	font-size: 1.55rem;
}

/*******************SYNCHROLIFE*******************/
.synchrolife{
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/synchrolife_mark.svg) no-repeat top center var(--color-red);
	background-size:134px auto;
	background-position-y: 20%;
	padding:max(40px, min(16vw,65px)) max(20px, min(8vw,50px)) max(40px, min(16vw,100px));
	padding:clamp( 40px, 16vw, 65px) clamp( 20px, 8vw, 50px) clamp( 40px, 16vw, 100px);
	text-align:center;
}
.synchrolife h2{
	font-weight:700;
	font-size:max(2rem, min(6.4vw,3.2rem));
	font-size:clamp( 2rem, 6.4vw, 3.2rem);
	margin-bottom:max(10px, min(5.9vw,25px));
	margin-bottom:clamp( 10px, 5.9vw, 25px);
}
.synchrolife p{
	font-weight:400;
	font-size:max(1.2rem, min(4.3vw,2.4rem));
	font-size:clamp( 1.2rem, 4.3vw, 2.4rem);
	letter-spacing:.01em;
}

.synchrolife .slife_btn {
	margin-top: 60px;
}
.mobile .synchrolife .slife_btn{
	margin-top: 12vw;
}


/*******************INSTALL*******************/
.install{
	background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/download_bg_sp.png) no-repeat center center;
	background-size:cover;
	padding:max(30px, min(12.8vw,80px)) 0 0 ;
	padding:clamp( 30px, 12.8vw, 80px) 0 0 ;
	text-align:center;
}
.install_inner{
	width:79%;
	max-width:670px;
	margin:0 auto;
}
.install_inner .txt{ margin:0 0 8.5vw; }
.install_inner h2{ margin:0 0 6vw; }
.install_inner h3{
	font-weight:400;
	font-size:max(1.8rem, min(5.8vw,2.2rem));
	font-size:clamp( 1.8rem, 5.8vw, 2.2rem);
	line-height:1.45;
	margin-bottom:10.6vw;
}
.install_link{
	width:100%;
	max-width:250px;
	margin:0 auto;
	display:flex;
	justify-content:space-between;
}
.mobile .install_link{ display:block; }
.install_link .install_qr{ flex:0 1 38.4%; }
.mobile .install_link .install_qr{ display:none; }
.install_link .install_app{ flex:0 1 54%; }
.install_link .install_app .apple{ margin-bottom:14px; }
.mobile .install_link .install_app{
	width:200px;
	margin:0 auto;
}
.install_link .install_app a,
.install_link .install_app img{
	display:block;
	width:100%;
}
.mobile .install_link .install_app .apple{ margin:0; }
.iphone .install_link .install_app .google{ display:none; }
.android .install_link .install_app .apple{ display:none; }
.install_inner .ph{ padding:0 9%; }

@media screen and (min-width: 751px) {
	.install{
		background:url(https://c.synchrolife.io/campaign/202111_niku/assets/img/download_bg_pc.png) no-repeat center center;
		background-size:cover;
	}
	.install_inner{
		display:flex;
		justify-content:space-between;
	}
	.install_inner .txt{
		margin:0;
		order:2;
		flex:0 1 350px;
		padding:68px 30px 0 ;
		box-sizing:border-box;
		max-width:350px;
	}
	.install_inner h2{ margin:0 0 15px; }
	.install_inner h3{ margin-bottom:24px; }
	.install_inner .ph{
		order:1;
		padding:0;
		flex:0 1 240px;
	}
}


/*******************FOOTER*******************/
footer{
	background-color:#FFF;
	border-top:1px #DFDFDF solid;
}
.f_sns{
	padding:4.3vw 0;
	border-bottom:1px #DFDFDF solid;
	display:flex;
	width:100%;
	margin:0 auto;
	justify-content:center;
}
.f_sns a{
	flex:0 1 10.6vw;
	margin:0 3.2vw;
}
.f_sns a img{width:100%;}
.f_inner .cr{
	color:#aaa;
	line-height:1;
	font-size:max(.8rem, min(2.7vw,1.4rem));
	font-size:clamp( .8rem, 2.7vw, 1.4rem);
	text-align:center;
	padding:4.3vw 0;
}

@media screen and (min-width: 751px) {
	.f_inner{
		display:flex;
		width:85%;
		max-width:1014px;
		margin:0 auto;
		padding:17px 0;
		align-items:center;
		justify-content:space-between;
	}
	.f_sns{
		padding:0;
		border-bottom:none;
		flex:0 1 136px;
		margin:0;
		order:2;
		justify-content:space-between;
	}
	.f_sns a{
		flex:0 1 24%;
		margin:0;
	}
	.f_inner .cr{
		text-align:left;
		padding:0;
		order:1;
	}
}



/*
COMMON PARTS
***************************************************************************/
/* ▼display▼ */
.block { display:block; }
.inline { display:inline; }
.none { display:none!important; }

/* ▼position▼ */
.posit_r { position:relative!important; }
.posit_a { position:absolute!important; }
.posit_f { position:fixed!important; }

.align_c { text-align:center!important; }
.align_r { text-align:right!important; }
.align_l { text-align:left!important; }

.disp_l { float:left!important; }
.disp_r { float:right!important; }

.va_top { vertical-align:top!important; }
.va_mid { vertical-align:middle!important; }
.va_btm { vertical-align:bottom!important; }

/* ▼width▼ */
.w5per { width:5%; }
.w10per { width:10%; }
.w15per { width:15%; }
.w20per { width:20%; }
.w25per { width:25%; }
.w30per { width:30%; }
.w35per { width:35%; }
.w50per { width:50%; }
.w55per { width:55%; }
.w60per { width:60%; }
.w70per { width:70%; }
.w75per { width:75%; }
.w80per { width:80%; }
.w100per { width:100%!important; }


/* ▼area▼ */


/* ▼font▼ */
.medium { font-weight:500!important; }
.regular { font-weight:400!important; }
.bold{font-weight:700!important;}
.black{font-weight:900!important;}

.c_black{color:#000;}

.size10 { font-size:1rem!important; }
.size11 { font-size:1.1rem!important; }
.size12 { font-size:1.2rem!important; }
.size13 { font-size:1.3rem!important; }
.size14 { font-size:1.4rem!important; }
.size16 { font-size:1.6rem!important; }
.size18 { font-size:1.8rem!important; }
.size20 { font-size:2.0rem!important; }
.size22 { font-size:2.2rem!important; }
.size24 { font-size:2.4rem!important; }
.size28 { font-size:2.8rem!important; }
.size30 { font-size:3.0rem!important; }

.lh2 { line-height:2!important; }
.lh18 { line-height:1.8!important; }
.lh16 { line-height:1.6!important; }
.lh15 { line-height:1.5!important; }
.lh14 { line-height:1.4!important; }

.txt_line{ background: linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,0) 75%,#ee815c 75%,#ee815c);  }


/* ▼link▼ */
a.line, .line { text-decoration:underline!important; }
a.no_line { text-decoration:none!important; }

/* ▼title▼ */
.title_01{
	margin-bottom:max(10px, min(8vw,30px)) ;
	margin-bottom:clamp( 10px, 8vw, 30px) ;
	text-align:center;
}
.title_01 span{
	position:relative;
	background-color:#000;
	color:#fff;
	font-weight:900;
	font-size:max(2rem, min(6.4vw,4.0rem)) ;
	font-size:clamp(2rem, 6.4vw, 4.0rem) ;
	line-height:1;
	padding:.8em 1.5em;
	display:inline-block;
}
.title_01 span:after{
	content:"";
	position:absolute;
	bottom: -15px;
	left:20px;
	width:0px;
	height:0px;
	margin:auto;
	border-style:solid;
	border-color:#000 transparent transparent transparent;
	border-width:15px 15px 0 0;
}
.title_01 span span{
	font-size:max(.8rem, min(1vw,1.4rem));
	font-size:clamp( .8rem, 1vw, 1.4rem);
}
.title_01 span span:after{
	border:0;
}
.title_02{
	margin-bottom:max(10px, min(8vw,30px)) ;
	margin-bottom:clamp( 10px, 8vw, 30px) ;
	text-align:center;
}
.title_02 span{
	position:relative;
	background-color:#000;
	color:#fff;
	font-weight:900;
	font-size:max(2rem, min(6.4vw,4.0rem)) ;
	font-size:clamp(2rem, 6.4vw, 4.0rem) ;
	line-height:1;
	padding:.8em 1em;
	display:inline-block;
	width:calc(88% - 2em);
}

/* ▼btn▼ */

/* ▼background▼ */
.bg_none { background:none!important; }

/* ▼border▼ */
.border_none { border:none!important; }