@charset "UTF-8";
body{
	word-break: normal;
}
#container *, * ::after, * ::before {
	box-sizing: border-box;
}

#common_head.camp_header h1{
	padding: 20px 0 30px;
}
	#common_head.camp_header h1 img{
		max-width: 255px;
		width: 100%;
	}

.mb20{
	margin-bottom: 20px !important;
}

@media screen and (min-width: 1111px){
	.camp_top_header{
		display: none;
	}
	#common_head.camp_header h1{
		background-image : linear-gradient(to right, #5e6572, #5e6572 5px, transparent 5px, transparent 20px);
		background-size: 8px 1px;
		background-position: left bottom;
		background-repeat: repeat-x;
	}
}
@media screen and (min-width: 769px){
	#common_head.camp_header{
		height: auto;
	}
}
.contents{
	max-width: 1040px;
	width: 100%;
	padding: 0 20px;
	margin: 0 auto;
	text-align: center;
	line-height: 1.5;
	font-size: 16px;
	color: #23292e;
	word-wrap: break-word;
}
.flex{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}
figure{
	margin: 0;
}
	img{
		max-width: 100%;
		height: auto;
		width: auto;
	}

.app #main{
	height: 33.98vw;
	background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/mainVisual.jpg") no-repeat center center;
	background-size: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
#main h2{
	width: auto;
	height: auto;
	background: none;
}
	#main h2 img{
		padding: 0;
		max-width: 683px;
		width: 100%;
		height: auto;
	}

h3{
	margin-bottom: 40px;
}

.sp_br{
	display: none;
}

/* キャンプ用グロナビ */
.camp_header #menuList li a{
	border-bottom: none;
	font-size: 18px;
	font-weight: 700;
}
.camp_header #menuList li a:hover{
	text-decoration: none;
}
@media screen and (min-width: 1111px){
	#menuList{
		display: block !important;
	}
	.camp_header #menuList{
		margin: 0 auto;
		padding: 25px 0;
	}
		.camp_header #menuList nav ul{
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.camp_header #menuList nav ul li{
			margin: 0;
			width: calc(94% / 4);
		}
			.camp_header #menuList li.current a{
				border-bottom: solid 2px #5e6572;
			}
}
@media screen and (max-width: 1110px){
	#common_head.camp_header {
		position: relative;
	}
		#common_head.camp_header p{
			position: absolute;
			top: 50%;
			right: 10px;
			transform: translateY(-50%);
		}
	
	.camp_header #menuList{
		top: 100%;
		margin-top: 0;
	}
		.camp_header #menuList li.current{
			background: #f1f1f1;
		}
			.camp_header #menuList li a{
				display: block;
				line-height: 63px;
				font-size: 16px;
				font-weight: 700;
				color: #0d0d0d;
				padding: 0;
			}
}
@media screen and (max-width: 1024px){
	#main h2 img{
		width: 70%;
	}
}
@media screen and (max-width: 768px){
	#common_head.camp_header{
		height: auto;
	}
	#common_head.camp_header h1 {
		padding: 20px 0;
		position: inherit;
		top: auto;
		width: 100%;
	}
	#common_head.camp_header h1 img{
		width: 40%;
	}
}
@media screen and (max-width: 750px){
	.app #main{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/mainVisual_sp.jpg") no-repeat center center;
		background-size: 100%;
		max-height: 550px;
		height: 74vw;
	}
	#main h2 img{
		width: 92%;
	}
	h3{
		margin-bottom: 20px;
	}
	.pc_br{
		display: none;
	}
	.sp_br{
		display: block;
	}

}


/*   ABOUT
------------------------------------------*/
.l-about{
	padding: 100px 0 160px;
}
.l-about .lead{
	line-height: 1.8;
}

@media screen and (max-width: 767px){
	.l-about{
		padding: 10% 0 13%;
	}
	.l-about h3 img{
		max-width: 211px;
		width: 40%;
	}
}

/*   SCENE
------------------------------------------*/
.l-scene{
	max-width: 1200px;
	width: 95%;
	padding: 80px;
	margin: 0 auto;
	background: #f2f1ed;
	position: relative;
}
.l-scene::after{
	content: "";
	display: block;
	background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_04.png") no-repeat right bottom;
	background-size: contain;
	max-width: 102px;
	width: 20%;
	height: 100px;
	position: absolute;
	right: -15px;
	bottom: 10px;
}

.l-scene h3{
	margin-top: -110px;
	margin-bottom: 90px;
	padding-right: 9%;
	position: relative;
}
.l-scene h3::after{
	content: "";
	display: block;
	width: 2px;
	height: 30px;
	background: #5e6572;
	position: absolute;
	bottom: -50px;
	left: 50%;
	transform: translateX(-50%);
}
.sceneBox > li{
	max-width: 490px;
	width: 49%;
}
	.sceneBox .sceneImg{
		margin: 0 auto 25px;
		position: relative;
	}
		.sceneBox .sceneImg img{
			border-radius: 10px;
			overflow: hidden;
			width: 100%;
		}

	.sceneBox li.sceneBox01 .sceneImg::before{
		content: "";
		display: block;
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_03.png") no-repeat left bottom;
		background-size: contain;
		max-width: 99px;
		width: 50%;
		height: 82px;
		position: absolute;
		bottom: -15px;
		left: -12%;
	}
	.sceneBox li.sceneBox02 .sceneImg::before,
	.sceneBox li.sceneBox02 .sceneImg::after{
		content: "";
		display: block;
		position: absolute;
	}
	.sceneBox li.sceneBox02 .sceneImg::before{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_01.png") no-repeat left bottom;
		background-size: contain;
		max-width: 133px;
		width: 50%;
		height: 51px;
		top: -10px;
		right: -10px;
	}
	.sceneBox li.sceneBox02 .sceneImg::after{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_02.png") no-repeat left bottom;
		background-size: contain;
		max-width: 86px;
		width: 50%;
		height: 76px;
		bottom: -10px;
		right: -12%;
	}

.sceneBox li p{
	text-align: left;
}
	.sceneBox > li p.lead{
		margin-bottom: 20px;
	}

.sceneBox .linkBtn{
	border-radius: 5px;
	overflow: hidden;
	max-width: 350px;
	width: 100%;
	margin: 0 auto 50px;
	text-align: center;
}

.influencerBox p.label{
	margin-bottom: 40px;
}
	.influencerBox p.label img{
		width: 100%;
	}

ul.influencer{
	justify-content: space-between;
	padding: 0 20px;
}
ul.influencer li{
	width: 48%;
}
ul.influencer li a{
	display: block;
	margin: 0 auto 15px;
	max-width: 150px;
}
ul.influencer li figure{
	position: relative;
}
ul.influencer li figure img{
	border-radius: 10px;
	overflow: hidden;
	width: 100%;
}
ul.influencer li figure figcaption{
	position: absolute;
	top: -20px;
	left: 0;
	box-shadow: 4px 4px 0 0 #fff;
	background: #5e6572;
	color: #fff;
	font-weight: 700;
	padding: 3px 15px 2px;
}

@media screen and (max-width: 1240px){
	.l-scene{
		padding: 40px;
	}
	.l-scene h3{
		margin-top: -70px;
	}
}
@media screen and (max-width: 900px){
	ul.influencer{
		justify-content: space-between;
		padding: 0 10px;
	}
	.l-scene {
		padding: 20px 0;
	}
	.l-scene::after{
		bottom: -50px;
	}
	.l-scene h3 {
		margin-top: -50px;
	}
}
@media screen and (max-width: 767px){
	.l-scene::after{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_04_sp.png") no-repeat right bottom;
		background-size: contain;
		width: 17%;
		right: -9px;
		bottom: -10px;
	}
	.l-scene h3 img{
		max-width: 280px;
		width: 62%;
	}
	.sceneBox{
		display: block;
	}
	.sceneBox > li{
		width: 100%;
		margin: 0 auto;
	}
	.sceneBox > li p.lead{
		margin-bottom: 20px;
	}
	.sceneBox .linkBtn{
		margin: 0 auto 30px;
	}
	.sceneBox li.sceneBox01 .sceneImg::before{
		width: 20%;
		left: -17px;
	}
	.sceneBox li.sceneBox02 .sceneImg::before{
		background: url(/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_01.png) no-repeat left top;
		background-size: contain;
		width: 30%;
		top: -6px;
	}
	.sceneBox li.sceneBox02 .sceneImg::after{
		width: 19%;
		right: -6%;
	}
	.sceneBox .influencerBox p.label{
		margin-bottom: 25px;
	}
	ul.influencer{
		margin: 0 auto 40px;
	}
	ul.influencer li figure figcaption{
		font-size: 12px;
		top: -15px;
	}
}
@media screen and (max-width: 500px){
	.l-scene h3 {
		margin-top: -12%;
		margin-bottom: 40px;
	}
	.l-scene h3::after{
		height: 20px;
		bottom: -30px;
	}
	ul.influencer li{
		width: 47%;
	}
}

/*   DOWNLOAD
------------------------------------------*/
.l-download{
	padding: 120px 0 140px;
}
	.l-download h3{
		margin-bottom: 60px;
	}
	.l-download .lead{
		margin-bottom: 25px;
	}
.l-download .labelImg img{
	max-width: 709px;
	width: 100%;
}

.l-download ol{
	margin: 50px 0;
}
	.l-download ol li{
		max-width: 280px;
		width: calc(100% / 3);
		position: relative;
	}
	.l-download ol li:nth-child(2){
		margin: 0 40px;
	}
	.l-download ol li::after{
		content: "";
		display: block;
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_arrow_r.png") no-repeat center;
		background-size: contain;
		max-width: 26px;
		width: 10%;
		height: 54px;
		position: absolute;
		top: 55%;
		right: -20%;
		transform: translateY(-50%);
		z-index: 2;
	}
		.l-download ol li:last-child::after{
			content: none;
		}
			.l-download ol li img{
				width: 100%;
			}

.l-download figure.labelImg{
	margin: 0 0 60px;
}

.accordionBox{
	background: #fff;
	border: solid 2px #23292e;
	border-radius: 5px;
	padding: 5px 0;
	max-width: 980px;
	width: 100%;
	margin: 0 auto;
}
	.accordionBox .inner{
		border-top: dashed 2px #23292e;
		border-bottom: dashed 2px #23292e;
		padding: 0;
	}
		.accordionBox .accordionBtn{
			font-size: 20px;
			font-weight: 700;
			position: relative;
			padding: 20px 40px;
			cursor: pointer;
		}
			.accordionBox .accordionBtn::before{
				content: "";
				display: block;
				background: url("../img/icon_arrow_top.png") no-repeat center;
				background-size: contain;
				width: 20px;
				height: 15px;
				position: absolute;
				top: 50%;
				right: 30px;
				transform: translateY(-50%);
			}
			.accordionBox .accordionBtn.close::before{
				transform: translateY(-50%) rotate(180deg);
			}

.slideBox{
	margin-top: 10px;
	padding: 0 40px 40px;
	display: none;
}
	.slideBox .logo{
		margin-bottom: 20px;
	}
	.slideBox .hd_example{
		background: #5e6572;
		color: #fff;
		position: relative;
		font-size: 18px;
		font-weight: 700;
		letter-spacing: 2px;
		padding: 7px 7px 5px;
		margin: 45px 0 50px;
	}
		.slideBox .hd_example::before{
			content: "";
			width: 95%;
			height: 1px;
			border-top: dashed 2px #fff;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
		}
			.slideBox .hd_example span{
				background: #5e6572;
				position: relative;
				z-index: 1;
				padding: 0 20px;
				min-width: 235px;
				display: inline-block;
			}

.slideBox .iconBox{
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	max-width: 790px;
	margin: 0 auto 55px;
}
	.slideBox .iconBox li{
		margin: 0 30px 25px;
	}
		.slideBox .iconBox li img{
			width: 100%;
		}
		.slideBox .iconBox li.outdoor_sample04 img{
			padding-top: 7%;
		}
.slideBox .iconBox02{
	margin-bottom: 30px;
}
	.slideBox .iconBox02 li{
		margin: 0 30px 45px;
	}

.linkBtn{
	max-width: 500px;
	line-height: 60px;
	width: 100%;
	margin: 0 auto;
}
	.linkBtn a{
		display: block;
		font-size: 18px;
		font-weight: 700;
		color: #fff !important;
		background: #23292e;
		position: relative;
		text-align: center;
	}
	.linkBtn a:hover{
		text-decoration: none !important;
	}
		.linkBtn a::after{
			content: "";
			display: block;
			background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_arrow_rwh.png") no-repeat center;
			background-size: contain;
			width: 12px;
			height: 16px;
			position: absolute;
			top: 50%;
			right: 20px;
			transform: translateY(-50%);
		}

@media screen and (max-width: 960px){
	.l-download ol li::after{
		right: -13%;
		width: 8%;
	}
}
@media screen and (max-width: 900px){
	.slideBox .iconBox li{
		margin: 0 24px 25px;
	}
	.slideBox .iconBox02 li {
		margin: 0 28px 25px;
	}
}
@media screen and (max-width: 767px){
	.l-download{
		padding: 16% 0 18%;
	}
	.l-download h3{
		margin-bottom: 20px;
	}
	.l-download h3 img{
		max-width: 369px;
		width: 70%;
	}
	.l-download ol{
		margin: 30px 0 40px;
	}
		.l-download ol li:nth-child(2) {
			margin: 0;
		}
		.l-download ol li::after{
			background: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_arrow_r_2x.png") no-repeat center;
			background-size: contain;
			right: -3%;
			width: 15px;
		}
	
	.accordionBox .accordionBtn{
		font-size: 16px;
		padding: 20px 27px 20px 10px;
	}
	.accordionBox .accordionBtn::before{
		right: 8px;
		width: 14px;
	}
	.slideBox{
		padding: 0 10px 20px;
	}
	.slideBox .hd_example{
		margin: 20px 0;
	}
	.slideBox .hd_example span{
		font-size: 16px;
		min-width: 175px;
	}
	.slideBox .iconBox{
		margin-bottom: 20px;
	}
	.slideBox .iconBox li{
		margin-right: 4%;
		margin-bottom: 4%;
		margin-left: 0;
		width: calc(68%/4);
	}
	.slideBox .iconBox li:last-child,
	.slideBox .iconBox li:nth-child(4){
		margin-right: 0;
	}
	.linkBtn{
		line-height: 48px;
	}
		.linkBtn a{
			font-size: 16px;
		}
			.linkBtn a::after{
				right: 10px;
				width: 8px;
			}
}
@media screen and (max-width: 500px){
	.l-download figure.labelImg {
		margin: 0 0 40px;
	}
	.l-download ol{
		display: block;
	}
		.l-download ol li{
			width: 100%;
			margin: 0 auto 60px;
		}
		.l-download ol li:nth-child(2){
			margin: 0 auto 60px;
		}
		.l-download ol li:last-child{
			margin-bottom: 0;
		}
		.l-download ol li::after{
			top: auto;
			right: auto;
			bottom: -54px;
			left: 50%;
			transform: translate(-50%, 0) rotate(90deg);
			width: 15px;
		}
}
@media screen and (max-width: 374px){
	.l-download .linkBtn a{
		font-size: 4vw;
	}
}

/*   PRESENT
------------------------------------------*/
.l-present{
	padding-bottom: 10%;
}
.presentBox figure{
	max-width: 469px;
	width: 47%;
}
.presentBox figure img{
	width: 100%;
}
.presentBox .txtBox{
	margin-top: 7%;
	text-align: left;
	width: 51%;
}
.presentBox .txtBox .appli_btn{
	margin-top: 30px;
	text-align: right;
}

@media screen and (max-width: 767px){
	.l-present{
		padding-bottom: 80px;
	}
	.l-present h3 img{
		max-width: 273px;
		width: 53%;
	}
	.presentBox{
		display: block;
	}
	.presentBox figure{
		width: 100%;
		margin: 0 auto 20px;
	}
	.presentBox .txtBox{
		width: 100%;
		margin-top: 0;
	}
	.presentBox .txtBox .appli_btn{
		margin-top: 20px;
		max-width: 150px;
		width: 35%;
		margin: 20px auto 0;
	}
	.presentBox .txtBox .appli_btn img{
		width: 100%;
	}
}


/*   PRODUCTS
------------------------------------------*/
.l-products{
	background: #f2f1ed;
	padding: 60px 0 40px;
}
.l-products h3{
	margin-top: -82px;
	margin-bottom: 60px;
}
.l-products .productBox{
	justify-content: space-around;
}
.l-products .productBox > li{
	max-width: 195px;
	width: calc(98% / 3);
}
.l-products ul li a{
	display: block;
	border-radius: 50%;
	overflow: hidden;
	margin-bottom: 20px;
}
.l-products ul li figure img{
	width: 100%;
}
.l-products .txtBox{
	color: #0d0d0d;
	padding-left: 5px;
}
.l-products .txtBox .name{
	font-weight: 700;
	font-size: 20px;
	margin-bottom: 5px;
	text-align: left;
	letter-spacing: 1px;
}
.l-products .txtBox p{
	text-align: left;
	font-weight: 700;
	margin-bottom: 10px;
}

.labelBox{
	flex-wrap: wrap;
	justify-content: flex-start;
}
.labelBox li{
	background: #fff;
	font-weight: 700;
	font-size: 14px;
	text-align: center;
	padding: 5px 7px;
	margin-right: 7px;
	margin-bottom: 7px;
	border-radius: 2px;
}

.labelBox li.spLabel{
	display: none;
}

@media screen and (max-width: 767px){
	.l-products h3 img{
		max-width: 329px;
		width: 63%;
	}
}
@media screen and (max-width: 700px){
	.l-products .productBox{
		display: block;
	}
	.l-products .productBox > li{
		max-width: inherit;
		width: 100%;
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		margin-bottom: 10px;
	}
	.l-products ul li a{
		margin-right: 10px;
		width: 20%;
		min-width: 110px;
	}
	.l-products .txtBox .name{
		font-size: 18px;
	}
	.labelBox li{
		font-size: 11px;
		padding: 5px 6px;
		margin-right: 5px;
		margin-bottom: 5px;
	}
	.labelBox li.spLabel{
		display: block;
	}
	.labelBox li.pcLabel{
		display: none;
	}
}

@media screen and (max-width: 500px){
	.l-products{
		padding: 6% 0 4%;
	}
	.l-products .contents{
		padding: 0 15px;
	}
	.l-products h3{
		margin-top: -11%;
		margin-bottom: 30px;
	}
}
/*------------------------------------------*/

/*   ＃妄想万能スパイス、＃妄想ブランドギアのトップ

/*------------------------------------------*/
.app .camp_underPage #main{
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
	max-width: 1200px;
	width: 100%;
	margin: 0 auto 70px;
	max-height: 300px;
	min-height: 140px;
	height: 25vw;
}
/*＃妄想万能スパイス*/
.app .camp_underPage.spice #main{
	background-image: url("/-/media/cojp/product/labelwriter/special/cube/camp/spice/img/mv.jpg");
}
.camp_underPage.spice #main h2 img{
	max-width: 433px;
}
/*＃妄想ブランドギア*/
.app .camp_underPage.gear #main{
	background-image: url("/-/media/cojp/product/labelwriter/special/cube/camp/gear/img/mv.jpg");
	justify-content: flex-start;
	padding-left: 60px;
}
.camp_underPage.gear #main h2{
	text-align: left;
}
.camp_underPage.gear #main h2 img{
	max-width: 407px;
}

.l-influencer .txtContainer{
	padding: 0 40px;
}
.l-influencer .txtContainer p{
	margin-bottom: 30px;
	text-align: left;
	line-height: 1.8;
}
.l-influencer .influencerList{
	margin-top: 7%;
}
.l-influencer .influencerList .inner{
	align-items: center;
}

.l-influencer .influencerList li{
	border: dashed 2px #5e6572;
	border-radius: 5px;
	padding: 40px;
}
.l-influencer .influencerList li:nth-child(2){
	margin-top: 60px;
}
.l-influencer .influencerList li figure{
	max-width: 420px;
	width: 46%;
	border-radius: 5px;
	overflow: hidden;
}
.l-influencer .influencerList li figure img{
	width: 100%;
}
.l-influencer .influencerList li .txtBox{
	width: 49%;
	text-align: left;
}

.l-influencer .influencerList li .txtBox h3{
	font-size: 22px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 15px;
	position: relative;
}
	.l-influencer .influencerList li .txtBox h3::before{
		content: "";
		display: block;
		height: 47px;
		position: absolute;
		left: 0;
		bottom: 0;
	}
	.l-influencer .influencerList li.influencer01 .txtBox h3::before{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/spice/img/icon_num_01.png") no-repeat center;
		background-size: contain;
		width: 56px;
	}
	.l-influencer .influencerList li.influencer02 .txtBox h3::before{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/spice/img/icon_num_02.png") no-repeat center;
		background-size: contain;
		width: 66px;
	}

.l-influencer .influencerList li .txtBox.twoPerson h3.none::before,
.l-influencer .influencerList li .txtBox.twoPerson h3.none::after{
	content: none;
}

.l-influencer .influencerList li .txtBox.twoPerson h3:nth-of-type(2){
	margin-top: 30px;
}

.l-influencer .influencerList li .txtBox .txt{
	line-height: 1.6;
}
.l-influencer .influencerList li .txtBox .txt a{
	color: #2e62a6 !important;
	text-decoration: underline !important;
}
.l-influencer .influencerList li .txtBox .label{
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 30px;
	text-align: center;
}


@media screen and (max-width: 1024px){
	.camp_underPage #main h2 img{
		width: 100%;
	}
	.l-influencer .influencerList li.influencer01 .txtBox h3::before{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/spice/img/icon_num_01_2x.png") no-repeat center;
		background-size: contain;
	}
	.l-influencer .influencerList li.influencer02 .txtBox h3::before{
		background: url("/-/media/cojp/product/labelwriter/special/cube/camp/spice/img/icon_num_02_2x.png") no-repeat center;
		background-size: contain;
	}
}
@media screen and (max-width: 850px){
	.l-influencer .influencerList li{
		padding: 20px;
	}
	.l-influencer .influencerList li .txtBox .label br{
		display: none;
	}
}
@media screen and (max-width: 767px){
	.app .camp_underPage #main{
		margin: 0 auto 6%;
	}
	.app .camp_underPage.spice #main,
	.app .camp_underPage.gear #main{
		background-size: cover;
	}
	.app .camp_underPage.gear #main{
		padding-left: 20px;
	}
	.camp_underPage #main h2 img {
		width: 70%;
	}
	.l-influencer .txtContainer{
		padding: 0;
	}
	.l-influencer .txtContainer p{
		margin-bottom: 20px;
	}
	.l-influencer .influencerList .inner{
		flex-direction: column-reverse;
	}
	.l-influencer .influencerList li{
		padding: 20px 5px;
	}
	.l-influencer .influencerList li:nth-child(2) {
		margin-top: 20px;
	}
	.l-influencer .influencerList li figure,
	.l-influencer .influencerList li .txtBox{
		width: 100%;
	}
	.l-influencer .influencerList li .txtBox h3{
		margin: 15px 0;
		font-size: 20px;
	}
	.l-influencer .influencerList li .txtBox .label{
		font-size: 18px;
		margin: 15px 0 30px;
	}
}
@media screen and (max-width: 500px){
	.l-influencer .influencerList li.influencer01 .txtBox h3::before{
		width: 45px;
	}
	.l-influencer .influencerList li.influencer02 .txtBox h3::before{
		width: 50px;
	}

}

/*------------------------------------------*/

/*   ＃妄想万能スパイス、＃妄想ブランドギアの詳細 共通CSS

/*------------------------------------------*/
.l-detail{
	padding-bottom: 130px;
}
.l-detail .leadArea{
	padding: 0 40px;
	margin-bottom: 60px;
	overflow: hidden;
}
	.l-detail .topttl{
		font-size: 28px;
		font-weight: 700;
		line-height: 1.3;
		position: relative;
	}
		.l-detail .topttl span::before,
		.l-detail .topttl span::after{
			content: "";
			display: block;
			width: 78px;
			height: 14px;
			border-top: dashed 2px #23292e;
			border-bottom: dashed 2px #23292e;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
		}
		.l-detail .topttl span::before{
			left: -88px;
		}
		.l-detail .topttl span::after{
			right: -88px;
		}

		.l-detail .topttl span{
			position: relative;
			display: inline-block;
		}

.l-detail .leadArea p{
	margin-bottom: 15px;
	text-align: left;
	line-height: 1.8;
}
.profBox {
	background: #f2f1ed;
	padding: 30px;
	align-items: center;
	margin-bottom: 80px;
}

.profBox figure{
	max-width: 455px;
	width: 49%;
}
.profBox figure img{
	width: 100%;
}
.profBox .txtBox{
	width: 49%;
	text-align: left;
	line-height: 1.6;
}
.profBox .txtBox h4{
	font-weight: 700;
	font-size: 20px;
	margin-bottom: 15px;
}
.profBox .txtBox a{
	color: #2e62a6 !important;
	text-decoration: underline !important;
}
.detailWrap .reverse{
	flex-direction: row-reverse;
}
.detailWrap > li{
	margin-bottom: 100px;
}
.detailWrap > li:last-child{
	margin-bottom: 0;
}
.detailWrap li .txtBox{
	width: 49%;
	text-align: left;
	line-height: 1.8;
}
.detailWrap li.reverse .txtBox{
	width: 46.5%;
}
.detailWrap li .txtBox p{
	margin-bottom: 20px;
}
.detailWrap li .txtBox p:last-child{
	margin-bottom: 0;
}
.detailWrap li figure{
	padding-top: 60px;
	max-width: 488px;
	width: 49%;
	text-align: left;
}
.detailWrap li.reverse figure{
	text-align: right;
}
	.detailWrap li.two_lines figure{
		padding-top: 90px;
	}

.detailWrap li h5{
	font-size: 21px;
	font-weight: 700;
	margin-bottom: 15px;
}
.indent{
	margin: 15px 0;
}
.indent > li{
	padding-left: 1em;
	text-indent: -1em;
}

.detailContainer .l-download{
	background: #f2f1ed;
	padding: 70px 0 60px;
}
.detailContainer .l-download h3{
	margin-top: -92px;
}

/*.detailContainer .iconBox{
	max-width: 550px;
	width: 100%;
	margin: 0 auto;
	position: relative;
}
.detailContainer .iconBox::before,
.detailContainer .iconBox::after{
	content: "";
	display: block;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	width: 71px;
	height: 50px;
	position: absolute;
	bottom: 0;
}
.detailContainer .iconBox::before{
	background-image: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_05_l.png");
	left: -120px;
}
.detailContainer .iconBox::after{
	background-image: url("/-/media/cojp/product/labelwriter/special/cube/camp/img/icon_05_r.png");
	right: -120px;
}*/

.downloadBtn a{
	display: block;
	max-width: 608px;
	width: 100%;
	margin: 60px auto 0;
	font-size: 20px;
	font-weight: 700;
	position: relative;
	padding: 5px 0;
	border: solid 2px #23292e;
	border-radius: 5px;
	background: #fff;
	line-height: 50px;
}
	.downloadBtn a::before {
		content: "";
		display: block;
		background: url(../img/icon_arrow_top.png) no-repeat center;
		background-size: contain;
		width: 20px;
		height: 15px;
		position: absolute;
		top: 50%;
		right: 15px;
		transform: translateY(-50%) rotate(90deg);
	}

.downloadBtn a:hover{
	text-decoration: none !important;
}
.downloadBtn a span{
	display: block;
	border-top: dashed 2px #23292e;
	border-bottom: dashed 2px #23292e;
}
.detailContainer .l-influencer{
	padding: 70px 0 0;
}
.detailContainer .l-influencer .influencerList{
	margin-top: 0;
}

.detailContainer .l-influencer h3{
	margin-bottom: 50px
}

/*@media screen and (max-width: 900px){
	.detailContainer .iconBox::before{
		left: -90px;
	}
	.detailContainer .iconBox::after{
		right: -90px;
	}
}*/
@media screen and (max-width: 767px){
	.l-detail{
		padding-bottom: 20%;
	}
	.l-detail .topttl{
		font-size: 24px;
		border-top: dashed 2px #23292e;
		border-bottom: dashed 2px #23292e;
		padding: 8px 0 5px;
	}
	.l-detail .topttl span::before,
	.l-detail .topttl span::after{
		content: none;
	}
	.l-detail .leadArea{
		padding: 0;
		margin-bottom: 30px;
	}
	.profBox{
		display: block;
		padding: 20px;
		margin-bottom: 40px;
	}
	.profBox figure{
		margin: 0 auto 10px;
		width: 100%;
	}
	.profBox .txtBox{
		width: 100%;
	}
	.profBox .txtBox h4{
		margin-bottom: 10px;
	}
	.detailWrap > li,
	.detailWrap > .reverse{
		flex-direction: column;
	}
	.detailWrap > li{
		margin-bottom: 40px;
	}
	.detailWrap li .txtBox,
	.detailWrap li.reverse .txtBox{
		width: 100%;
	}
	.detailWrap li figure{
		padding: 0;
		width: 100%;
		margin: 10px auto 0;
		text-align: center;
	}
	.detailWrap li.reverse figure{
		text-align: center;
	}
	.detailWrap li.two_lines figure{
		padding: 0;
	}
	.detailWrap li .txtBox p{
		margin-bottom: 10px;
	}

	.detailContainer .l-download h3{
		margin-bottom: 40px;
	}
	.detailContainer .iconBox li{
		width: calc(75% / 4);
	}
	/*.detailContainer .iconBox::before,
	.detailContainer .iconBox::after{
		content: none;
	}*/
	.downloadBtn a{
		margin: 40px auto 0;
	}
	.downloadBtn a::before {
		right: 8px;
		width: 14px;
	}
	.detailContainer .l-influencer{
		padding: 12% 0 0;
	}
	.detailContainer .l-influencer h3 img{
		max-width: 171px;
		width: 34%;
	}
}
@media screen and (max-width: 750px){
	.detailContainer .l-influencer h3 {
		margin-bottom: 30px;
	}
	.downloadBtn a{
		font-size: 17px;
		line-height: 1.2;
	}
	.downloadBtn a span{
		padding: 10px 25px 10px 10px;
	}
}
@media screen and (max-width: 500px){
	.detailContainer .l-download{
		padding: 13% 0 10%;
	}
	.detailContainer .l-download h3{
		margin-top: -19%;
		margin-bottom: 40px;
	}
}


/*   #妄想万能スパイスの詳細
/*------------------------------------------*/
/*.l-spiceDetail01 .detailWrap li .txtBox01{
	width: 46.5%;
}
@media screen and (max-width: 767px){
	.l-spiceDetail01 .detailWrap li .txtBox01{
		width: 100%;
	}
}*/

/*   ＃妄想ブランドギアの詳細
/*------------------------------------------*/

.l-gearDetail01 .topttl .sp_br02{
	display: none;
}
	.l-gearDetail01 .leadArea > .flex {
		align-items: center;
		padding: 0 25px;
	}
		.l-gearDetail01 .leadArea > .flex figure{
			max-width: 455px;
			width: 49%;
		}
		.l-gearDetail01 .leadArea > .flex .txtBox{
			width: 49%;
		}

.movieBox{
	margin: 0 auto 60px;
	max-width: 640px;
	width: 100%;
}
.movieBox .inner{
	position: relative;
	padding-top: 56.25%;
}
	/*.movieBox video{
		max-width: 640px;
		width: 100%;
		margin: 0 auto;
	}*/
.movieBox .inner iframe,
.movieBox .inner img{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

.profBox2{
	align-items: stretch;
}
.l-gearDetail01 .profBox{
	padding: 20px;
	width: calc(100% / 2);
}
	.l-gearDetail01 .profBox figure{
		max-width: 217px;
		width: 48%;
	}
	.l-gearDetail01 .profBox .txtBox h4{
		font-size: 18px;
		margin-bottom: 10px;
	}
.useWrap{
	margin-top: 100px;
}
.useWrap li{
	margin-bottom: 10px;
}
.useWrap li.reverse{
	flex-direction: row-reverse;
}
.useWrap li.ttl{
	margin-bottom: 20px;
}
.useWrap li.ttl h5{
	font-size: 22px;
	font-weight: 700;
}
.useWrap li.flex{
	align-items: center;
}
.useWrap li figure{
	max-width: 440px;
	width: 44%;
}
.useWrap li .txtBox{
	width: 52%;
	text-align: left;
	line-height: 1.8;
}

.marginBox{
	margin-top: 80px;
}

@media screen and (max-width: 990px){
	.l-gearDetail01 .topttl span::before,
	.l-gearDetail01 .topttl span::after{
		content: none;
	}
	.l-gearDetail01 .leadArea .topttl{
		border-top: dashed 2px #23292e;
		border-bottom: dashed 2px #23292e;
		padding: 8px 0 5px;
	}
	.l-gearDetail01 .topttl .sp_br02{
		display: block;
	}
	.l-gearDetail01 .profBox{
		display: block;
	}
	.l-gearDetail01 .profBox .txtBox,
	.l-gearDetail01 .profBox figure{
		width: 100%;
	}
	.l-gearDetail01 .profBox figure{
		margin: 0 auto 10px;
	}

}
@media screen and (max-width: 767px){
	.l-gearDetail01 .leadArea > .flex{
		display: block;
		padding: 0;
	}
	.l-gearDetail01 .leadArea > .flex figure{
		width: 100%;
		margin: 0 auto 20px;
	}
	.l-gearDetail01 .leadArea > .flex .txtBox{
		width: 100%;
	}
	.l-gearDetail01 .profBox figure{
		width: 100%;
	}
	.movieBox {
		margin-bottom: 40px;
	}
	.useWrap,
	.marginBox{
		margin-top: 60px;
	}
	.useWrap li.flex{
		flex-direction: column;
		margin-bottom: 40px;
	}
	.useWrap li.ttl{
		margin-bottom: 0;
	}
	.useWrap li:last-child{
		margin-bottom: 0;
	}
	.useWrap li .txtBox{
		width: 100%;
		margin-bottom: 10px;
	}
	.useWrap li figure{
		width: 100%;
	}
	.l-gearDetail01 .detailWrap li h5 br{
		display: none;
	}
}
@media screen and (min-width: 501px) and (max-width: 767px){
	.l-gearDetail01 .profBox{
		padding: 10px;
	}
}
@media screen and (max-width: 500px){
	.profBox2{
		display: block;
		margin-bottom: 40px;
	}
	.l-gearDetail01 .profBox{
		width: 100%;
	}
	.l-gearDetail01 .profBox2 .profBox{
		margin-bottom: 20px;
	}
	/*.l-gearDetail01 .profBox{
		display: flex;
		align-items: center;
	}*/
}










