@charset "UTF-8";

#contents .footer_wrap_v2,
#bread-crumb,
#content,
.header_bnr{
	display: none;
}
#main-column .page_cpn h2{
	padding: 0;
	position: relative;
}

.page_cpn{
	font-family: "Noto Sans JP", sans-serif;
	background: #fff;
}
.page_cpn *{
	box-sizing: border-box;
}
#itemList_wrap #pager-top{
	display: none;
}
.page_cpn .btn{
	position: relative;
	color: #fff;
	display: block;
	background: #ccc;
	border-bottom: 2px solid #ebebeb;
	text-align: center;
	padding: 25px 0 25px;
	font-size: 20px;
	border-radius: 100px;
	line-height: 1;
}
.page_cpn .btn:after{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 30px;
	margin: auto;
	width: 10px;
	height: 10px;
	transform: rotate(45deg);
	border: solid #fff;
	border-width: 2px 2px 0 0;
}

.page_cpn .ttl_cpn{
	text-align: center;
	font-size: 38px;
	color: #0097e0;
	letter-spacing: .2rem;
	margin-bottom: 70px;
}
.page_cpn .roboto{
	font-family: "Roboto", sans-serif;
	font-weight: 500;
}
.page_cpn .ttl_cpn span:before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -300px;
	margin: auto;
	width: 250px;
	height: 2px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fffffe+0,0097e0+30,0097e0+70,fffffe+100&0+0,1+30,1+70,0+100 */
background: linear-gradient(to right,  rgba(255,255,254,0) 0%,rgba(0,151,224,1) 30%,rgba(0,151,224,1) 70%,rgba(255,255,254,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page_cpn .ttl_cpn span:after{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: -300px;
	margin: auto;
	width: 250px;
	height: 2px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fffffe+0,0097e0+30,0097e0+70,fffffe+100&0+0,1+30,1+70,0+100 */
background: linear-gradient(to right,  rgba(255,255,254,0) 0%,rgba(0,151,224,1) 30%,rgba(0,151,224,1) 70%,rgba(255,255,254,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page_cpn .read{
	text-align: center;
	line-height: 1.8;
	margin: 0 auto 120px;
}
.page_cpn .read .roboto{

}
.page_cpn .read .txt{
	margin: 70px 0 50px;
}
.page_cpn .read .txt strong{
	display: block;
	color: #0097e0;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 40px;
}
.page_cpn .read .txt span{
	display: block;
	color: #0097e0;
	font-size: 20px;
	font-weight: bold;
	margin: 30px 0 20px;
}
.page_cpn .read .txt small{
	font-size: 12px;
}
.page_cpn .read ul li{
	display: flex;
	position: relative;
	border: 2px solid #f1f9fe;
	width: 490px;
}
.page_cpn .read ul li:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	border-right: 480px solid transparent;
	border-top: 100px solid #f1f9fe; 
	height: 0;
	width: 0;
}
.page_cpn .read ul li img{
	position: relative;
	z-index: 1;
}
.page_cpn .read ul li p{
	text-align: left;
	padding: 20px 20px 0;
	position: relative;
	z-index: 1;
	font-size: 16px;
	line-height: 1.6;
}
.page_cpn .read ul li p strong{
	display: block;
	color: #0097e0;
	font-size: 20px;
	font-weight: bold;
	margin: 0 0 10px;
}

.page_cpn .faq{
	margin: 100px auto 0;
	padding-bottom: 100px;
	padding: 100px 0 100px;
}
.page_cpn .faq dl{
	line-height: 1.8;
	margin-bottom: 50px;
}
.page_cpn .faq dl span{
	position: absolute;
	top: 10px;
	left: 0;
	color: #fff;
	width: 38px;
	height: 38px;
	font-size: 22px;
	background: #0097e0;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.page_cpn .faq dl dt{
	padding: 15px 0 20px 50px;
	font-size: 18px;
	font-weight: bold;
	position: relative;
	cursor: pointer;
	color: #0097e0;
}
.page_cpn .faq dl dd{
	padding: 15px 0 20px 50px;
	font-size: 16px;
	position: relative;
	border-top: 1px solid #0097e0;
	display: none;
	line-height: 1.6;
	margin: 0 0 40px;
}
.page_cpn .faq dl dd span{
	top: 12px;
	left: 0;
}
.page_cpn .faq dl dd a{
	color: #0096e0;
}
.page_cpn .faq dl dd + dt{
	border-top: 1px solid #0097e0;
}
.page_cpn .faq .btn{
	width: 380px;
	background: #ff6e90;
	margin: auto;
}

.page_cpn .detail{
	background: #f1f8fd;
	padding: 100px 0;
	margin-bottom: 120px;
}
.page_cpn .detail .inner{
	background: #fff;
	border-radius: 20px;
	padding: 80px 40px 60px;
}
.page_cpn .detail dl{
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	align-items: flex-start;
	gap: 50px 0;
}
.page_cpn .detail dl dt{
	background: #0096e0;
	color: #fff;
	padding: 10px 0;
	width: 180px;
	text-align: center;
	border-radius: 50px;
}
.page_cpn .detail dl dd{
	width: 690px;
	line-height: 1.8;
}
.page_cpn .detail dl dd ul{
	margin-top: 20px;
	font-size: 16px;
}
.page_cpn .detail dl dd ul li{
	text-indent: -16px;
	margin-left: 16px;
}

.page_cpn .item{
	line-height: 1.8;
	padding-bottom: 140px;
}
.page_cpn .item h2{
	font-size: 28px;
	color: #0097e0;
	margin-bottom: 40px;
}
.page_cpn .item p{
	width: 490px;
	margin-bottom: 50px;
}
.page_cpn .item .btn{
	width: 380px;
	background: #59b9e6;
	padding: 15px 0 15px;
}


@media screen and (min-width: 769px) {

	.sp{
		display: none;
	}
	.page_cpn{

	}
	.page_cpn h1{
		text-align: center;
		background: url(https://www.e-oxygenizer.jp/img/campaign/202607/bg_opener.png) no-repeat top center;
		height: 652px;
		margin-bottom: 80px;
		padding: 40px 0 0;
	}
	.page_cpn .inner{
		width: 1000px;
		margin: auto;
		position: relative;
	}
	.page_cpn .read ul{
		display: flex;
		justify-content: space-between;
    	margin-bottom: 100px;
	}
	.page_cpn .ttl_cpn span{
		position: relative;
	}
	.page_cpn .item img{
		position: absolute;
		top: -50px;
		right: -60px;
	}

}


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

	.pc{
		display: none;
	}

	#main-column,
	#contents{
		padding: 0;
	}
	#main-column .page_cpn h2{
		width: calc(690 / 750 * 100vw);
		margin: 0 auto calc(80 / 750 * 100vw);
		font-size: calc(43 / 750 * 100vw);
	}
	.page_cpn .faq .btn{
		width: 80%;
		font-size: calc(30 / 750 * 100vw);
		padding: calc(30 / 750 * 100vw) 0;
	}
	.page_cpn .btn:after{
		right: 5vw;
		width: 2vw;
		height: 2vw;
	}
	.page_cpn{

	}
	#main-column .page_cpn h1{
		padding: 0 0 calc(40 / 750 * 100vw);
	}
	.page_cpn .inner{
		margin: 0 calc(40 / 750 * 100vw);
		position: relative;
	}
	.page_cpn .ttl_cpn{
		font-size: calc(43 / 750 * 100vw);
	}
	.page_cpn .ttl_cpn span:before{
		left: 0;
		width: calc(150 / 750 * 100vw);
	}
	.page_cpn .ttl_cpn span:after{
		right: 0;
		width: calc(150 / 750 * 100vw);
	}
	.page_cpn .read {
		margin: 0 calc(40 / 750 * 100vw) calc(100 / 750 * 100vw);
	}
	.page_cpn .read img{
		width: 50%;
	}

	.page_cpn .read .txt{
		margin: calc(50 / 750 * 100vw) 0 calc(50 / 750 * 100vw);
		font-size: calc(26 / 750 * 100vw);
	}
	.page_cpn .read .txt strong{
		font-size: calc(30 / 750 * 100vw);
		margin: 0 0 calc(40 / 750 * 100vw);
	}
	.page_cpn .read .txt span{
		margin: calc(50 / 750 * 100vw) 0 calc(20 / 750 * 100vw);
		font-size: calc(30 / 750 * 100vw);
	}
	.page_cpn .read .txt small{
		font-size: calc(20 / 750 * 100vw);
	}
	.page_cpn .read ul{

	}
	.page_cpn .read ul li{
		width: auto;
		align-items: flex-start;
	}
	.page_cpn .read ul li::before{
		border-right: 90vw solid transparent;
	}
	.page_cpn .read ul li + li{
		margin-top: calc(30 / 750 * 100vw);
	}
	.page_cpn .read ul li img{
		width: 40%;
	}
	.page_cpn .read ul li p{
		width: 60%;
		padding: 3vw 3vw 0;
		font-size: calc(24 / 750 * 100vw);
		line-height: 1.4;
	}
	.page_cpn .read ul li p strong{
		font-size: calc(28 / 750 * 100vw);
		margin: 0 0 calc(10 / 750 * 100vw);
	}

	.page_cpn .faq{
		padding: calc(100 / 750 * 100vw) 0 calc(120 / 750 * 100vw);
	}
	.page_cpn .faq dl span{
		width: 9vw;
  		height: 9vw;
		font-size: calc(34);
	}
	.page_cpn .faq dl dt{
		font-size: calc(28 / 750 * 100vw);
		padding: calc(25 / 750 * 100vw) 0 calc(30 / 750 * 100vw) calc(90 / 750 * 100vw);
	}
	.page_cpn .faq dl dd{
		padding: calc(30 / 750 * 100vw) 0 calc(30 / 750 * 100vw) calc(90 / 750 * 100vw);
		margin: 0 0 calc(30 / 750 * 100vw);
		font-size: calc(26 / 750 * 100vw);
	}

	.page_cpn .detail{
		padding: calc(100 / 750 * 100vw) 0 calc(120 / 750 * 100vw);
		margin-bottom: calc(100 / 750 * 100vw);
	}
	.page_cpn .detail .inner{
		padding: calc(80 / 750 * 100vw) calc(40 / 750 * 100vw);
	}
	.page_cpn .detail dl{
		flex-flow: column;
		gap: calc(50 / 750 * 100vw) 0;
	}
	.page_cpn .detail dl dt{
		width: 100%;
		font-size: calc(26 / 750 * 100vw);
		font-weight: bold;
	}
	.page_cpn .detail dl dd{
		width: auto;
		font-size: calc(26 / 750 * 100vw);
	}
	.page_cpn .detail dl dd ul{
		margin-top: calc(30 / 750 * 100vw);
		font-size: calc(26 / 750 * 100vw);
	}
	.page_cpn .detail dl dd ul li{
		text-indent: calc(-26 / 750 * 100vw);
		margin-left: calc(26 / 750 * 100vw);
	}

	.page_cpn .item {
		text-align: center;
		padding: 0 0 calc(120 / 750 * 100vw);
	}
	#main-column .page_cpn .item h2{
		font-size: calc(38 / 750 * 100vw);
		margin: 0 0 calc(50 / 750 * 100vw);
	}
	.page_cpn .item p{
		width: auto;
		margin-bottom: calc(50 / 750 * 100vw);
		font-size: calc(26 / 750 * 100vw);
	}
	.page_cpn .item img{
		width: 80%;
	}
	.page_cpn .item .btn{
		width: 80%;
		font-size: calc(30 / 750 * 100vw);
		padding: calc(30 / 750 * 100vw) 0;
		margin: calc(40 / 750 * 100vw) auto 0;
	}

}