@charset "UTF-8";
/* CSS Document */

/* contents ======================================= */

.scroll_anime {
	position: relative;
	top:50px;
	opacity: 0;
}
.contentL {
	background:#ffffff;
}
#contents {
	width: 100%;
	min-width:1280px;
	font-family: "Noto Sans Japanese", sans-serif;
}
#contents a:hover {
	opacity: 0.7;
}
#main {
	width:100%;
}
#main img {
	width:100%;
}
#contents .catch {
	padding:60px 0 40px;
}
#contents .catch p {
	text-align: center;
}
#contents .section1 {
	background:url(../img/bg_pc.jpg) no-repeat center top;
	background-size:100% auto;
	padding:60px 0;
}
#contents .section1 .info {
	width:1100px;
	margin:0 auto 60px;
	background:
		linear-gradient(45deg,  transparent 10px, rgba(255,255,255,0.75) 10px),
		linear-gradient(315deg, transparent 10px, rgba(255,255,255,0.75) 10px),
		linear-gradient(225deg, transparent 10px, rgba(255,255,255,0.75) 10px),
		linear-gradient(135deg, transparent 10px, rgba(255,255,255,0.75) 10px);
	background-position: bottom left, bottom right, top right, top left;
	background-size: 50% 50%;
	background-repeat: no-repeat;
	position: relative;
	padding:40px 0 60px;
}
#contents .section1 .info::after {
	content:"";
	background:url(../img/logo_deco_pc.png);
	top:-225px;
	left:-72px;
	position: absolute;
	width:1198px;
	height:1049px;
}
#contents .section1 .info .inner {
	width:72.7273%;
	margin:0 auto;
}
#contents .section1 .info .inner .title1 {
	width:733px;
	margin:0 0 30px 67px;
}
#contents .section1 .info .inner .text1 {
	width:100%;
	text-align: center;
	font-size:18px;
	color:#4c4c4c;
	line-height: 1.4444;
	letter-spacing: -0.04em;
	margin-bottom: 60px;
}
#contents .section1 .info .inner .text1 span{
	font-size:14px;
}
#contents .section1 .info .inner .img1 {
	float:left;
	width:18.75%;
	margin-left:10.5%;
}
#contents .section1 .info .inner .title2 {
	clear:both;
	padding-top:20px;
	width:62.5%;
	margin:0 auto 30px;
}
#contents .section1 .info .inner .text2 {
	font-size:12px;
	line-height: 1.6667;
	margin-bottom:30px;
}
#contents .section1 .info .inner .img {
	width:465px;
	margin:0 auto;
}
#contents .section1 .secret {
	background: rgba(255,255,255,0.5);
	padding:100px 0 60px;
}
#contents .section1 .secret .inner {
	width:1100px;
	margin:0 auto;
	padding:60px 140px;
	background:
		linear-gradient(45deg,  transparent 10px, rgba(255,255,255,0.75) 10px),
		linear-gradient(315deg, transparent 10px, rgba(255,255,255,0.75) 10px),
		linear-gradient(225deg, transparent 10px, rgba(255,255,255,0.75) 10px),
		linear-gradient(135deg, transparent 10px, rgba(255,255,255,0.75) 10px);
	background-position: bottom left, bottom right, top right, top left;
	background-size: 50% 50%;
	background-repeat: no-repeat;
	position: relative;
}
#contents .section1 .secret .inner .title1 {
	width:99.25%;
	margin:0 auto;
	position: relative;
}
#contents .section1 .secret .inner .title1 img {
	position: absolute;
	top:-116px;
}
#contents .section1 .secret .inner .text1 {
	width:370px;
	font-size:18px;
	line-height: 1.6667;
	letter-spacing: -0.04em;
}
#contents .section1 .secret .inner .text1 span{
	font-size:12px;
	display: block;
	padding-top:8px;
}
#contents .section1 .secret .inner .img1 {
	position: absolute;
	padding-top:60px;
	width: 34.910%;
    right: 14%;
}
#contents .section1 .howto {
	padding:70px 0 20px;
}
#contents .section1 .howto .inner {
	width:1100px;
	margin:0 auto;
	position: relative;
}
#contents .section1 .howto .inner .title1 {
	width:100%;
	margin:0 auto;
	position: relative;
}
#contents .section1 .howto .inner .title1 img {
}
#contents .section1 .howto .inner ul {
	overflow: hidden;
	width:100%;
	margin:0 auto;
}
#contents .section1 .howto .inner ul li {
	float:left;
	width:25%;
	padding:0 5px;
}
#contents .section1 .howto .inner ul li .img {
}
#contents .section1 .howto .inner ul li .text {
	font-size:18px;
	line-height: 1.6667;
	letter-spacing: -0.04em;
	text-align: left;
}
#contents .section2 {
	background:url(../img/bg2_pc.jpg) no-repeat center top;
	background-size:100% auto;
	padding:60px 0;
}
#contents .section2 .img1 {
	width:280px;
	margin:0 auto 20px;
}
#contents .section2 .text {
	font-size:24px;
	line-height: : 1.8;
	font-weight: bold;
	text-align: center;
}
#contents .section2 .text .style1 {
	font-size:20px;
}
#contents .section2 .text .style2 {
	font-size:18px;
	font-weight: 400;
}
#contents .section2 .text .style3 {
	font-size:18px;
	font-weight: 300;
}
#contents .section2 .price {
	font-size:24px;
	text-align: center;
	margin-bottom:20px;
}
#contents .section2 .price span {
	font-size:14px;
	font-weight: 400;
}
#contents .section2 .btn {
	text-align: center;
}

@media screen and (max-width:1280px) {
	#contents {
		min-width:0;
	}
	#contents .catch {
		padding:4.6875vw 0 40px;
	}
	#contents .catch p {
		text-align: center;
	}
	#contents .section1 {
		background:url(../img/bg_pc.jpg) no-repeat center top;
		background-size:1280px auto;
		padding:4.6875vw 0;
	}
	#contents .section1 .info {
		width:85.9375vw;
		margin:0 auto 4.6875vw;
		background:
			linear-gradient(45deg,  transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(315deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(225deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(135deg, transparent 10px, rgba(255,255,255,0.75) 10px);
		background-position: bottom left, bottom right, top right, top left;
		background-size: 50% 50%;
		background-repeat: no-repeat;
		position: relative;
		padding:3.125vw 0 4.6875vw;
	}
	#contents .section1 .info::after {
		content:"";
		background:url(../img/logo_deco_pc.png);
		background-size:100% auto;
		top:-17.5781vw;
		left:-5.625vw;
		position: absolute;
		width:93.5938vw;
		height:81.9531vw;
	}
	#contents .section1 .info .inner {
		width:72.7273%;
		margin:0 auto;
	}
	#contents .section1 .info .inner .title1 {
		width:57.2656vw;
		margin:0 0 2.3438vw 5.2344vw;
		text-align: center;
	}
	#contents .section1 .info .inner .text1 {
		font-size:1.4062vw;
		line-height: 1.4444;
		letter-spacing: -0.04em;
		margin-bottom: 4.6875vw;
	}
	#contents .section1 .info .inner .text1 span{
		font-size:1.0938vw;
	}
	#contents .section1 .info .inner .img1 {
		float:left;
		width:18.75%;
		margin-left:10.5%;
	}
	#contents .section1 .info .inner .title2 {
		clear:both;
		padding-top:1.5625vw;
		width:62.5%;
		margin:0 auto 2.3438vw;
	}
	#contents .section1 .info .inner .text2 {
		font-size:12px;
		line-height: 1.6667;
	}
	#contents .section1 .info .inner .text2 p {
		margin-left:1em;
		text-indent: -1em;
	}
	#contents .section1 .info .inner .img {
		width: 36.3281vw;
		margin: 0 auto;
	}
	#contents .section1 .secret {
		background: rgba(255,255,255,0.5);
		padding:7.8125vw 0 4.6875vw;
	}
	#contents .section1 .secret .inner {
		width:85.9375vw;
		margin:0 auto;
		padding:4.6875vw 10.9375vw;
		background:
			linear-gradient(45deg,  transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(315deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(225deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(135deg, transparent 10px, rgba(255,255,255,0.75) 10px);
		background-position: bottom left, bottom right, top right, top left;
		background-size: 50% 50%;
		background-repeat: no-repeat;
		position: relative;
	}
	#contents .section1 .secret .inner .title1 {
		width:99.25%;
		margin:0 auto;
		position: relative;
	}
	#contents .section1 .secret .inner .title1 img {
		position: absolute;
		top:-9.0625vw;
	}
	#contents .section1 .secret .inner .text1 {
		width:28.9062vw;
		font-size:1.4062vw;
		line-height: 1.6667;
		letter-spacing: -0.04em;
	}
	#contents .section1 .secret .inner .text1 span{
		font-size:0.9375vw;
		display: block;
		padding-top:0.625vw;
	}
	#contents .section1 .secret .inner .img1 {
		position: absolute;
		padding-top:4.6875vw;
		width: 34.910%;
    	right: 14%;
	}
	#contents .section1 .howto {
		padding:7.0312vw 0 1.5625vw;
	}
	#contents .section1 .howto .inner {
		width:85.9375vw;
		margin:0 auto;
		position: relative;
	}
	#contents .section1 .howto .inner .title1 {
	}
	#contents .section1 .howto .inner .title1 img {
	}
	#contents .section1 .howto .inner ul {
	}
	#contents .section1 .howto .inner ul li {
		padding:0 0.3906vw;
	}
	#contents .section1 .howto .inner ul li .img {
	}
	#contents .section1 .howto .inner ul li .text {
		font-size:1.4062vw;
		line-height: 1.6667;
		letter-spacing: -0.04em;
		text-align: left;
	}
	#contents .section2 {
		background:url(../img/bg2_pc.jpg) no-repeat center top;
		background-size:100% auto;
		padding:4.6875vw 0;
	}
	#contents .section2 .img1 {
		width:21.875vw;
		margin:0 auto 1.5625vw;
	}
	#contents .section2 .text {
		font-size:1.875vw;
		line-height: : 1.8;
		font-weight: bold;
		text-align: center;
	}
	#contents .section2 .text .style1 {
		font-size:1.5625vw;
	}
	#contents .section2 .text .style2 {
		font-size:1.4062vw;
		font-weight: 400;
	}
	#contents .section2 .text .style3 {
		font-size:1.4062vw;
		font-weight: 300;
	}
	#contents .section2 .price {
		font-size:1.875vw;
		text-align: center;
		margin-bottom:1.5625vw;
	}
	#contents .section2 .price span {
		font-size:1.0938vw;
		font-weight: 400;
	}
	#contents .section2 .btn {
		text-align: center;
	}
}

/* MEDIA QUERY ======================================= */

@media screen and (max-width:767px) {
	
	body {
		-webkit-text-size-adjust: none;
	}
	
	#main {
		width:100%;
	}
	.contentL {
		padding:0;
	}
	#contents {
		padding: 0 !important;
		min-width: 100%;
	}
	
	img {
		width:100%;
		height:auto;
	}

	p,li {
		font-size:14px;
	}
	.contents {
		padding: 0 !important;
	}
	.contents img {
		max-width:none;
	}
	
	
	/*-----------  contents -------------*/
	
	#contents .catch {
		padding:7.3333vw 0 0;
	}
	#contents .catch p {
		width:43.4667vw;
		margin:0 auto;
	}
	#contents .section1 {
		background:url(../img/bg_sp.jpg) no-repeat center top;
		background-size:100% auto;
		padding:7.6vw 0 0;
	}
	#contents .section1 .info {
		width:92vw;
		margin:0 auto 9.8667vw;
		background:
			linear-gradient(45deg,  transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(315deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(225deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(135deg, transparent 10px, rgba(255,255,255,0.75) 10px);
		background-position: bottom left, bottom right, top right, top left;
		background-size: 50% 50%;
		background-repeat: no-repeat;
		position: relative;
		padding:3vw 0 8.8667vw;
	}
	#contents .section1 .info::after {
		content:"";
		background:url(../img/logo_deco_sp.png);
		background-size:100% auto;
		top:-37.5781vw;
		left:-4vw;
		position: absolute;
		width:100vw;
		height:165.2vw;
	}
	#contents .section1 .info .inner {
		width:100%;
		margin:0 auto;
	}
	#contents .section1 .info .inner .title1 {
		width:84.6667vw;
		margin:0 0 5.0667vw 8.4667vw;
	}
	#contents .section1 .info .inner .text1 {
		float:none;
		width:68vw;
		margin:0 auto 4vw;
		font-size:3.4333vw;
		line-height: 1.4167;
		letter-spacing: -0.04em;
		text-align: center;
	}
	#contents .section1 .info .inner .text1 span{
		font-size:2.6667vw;
	}
	#contents .section1 .info .inner .img1 {
		float:none;
		width:32.5333vw;
		margin:0 auto;
	}
	#contents .section1 .info .inner .title2 {
		clear:both;
		padding-top:1.3062vw;
		width:85.6vw;
		margin:0 auto 3.6667vw;
	}
	#contents .section1 .info .inner .text2 {
		width:76vw;
		font-size:2.4vw;
		line-height: 1.6667;
		margin:0 auto 7.3333vw;
	}
	#contents .section1 .info .inner .text2 p {
		font-size: 2.6667vw;
	}
	#contents .section1 .info .inner .img {
		width:76vw;
		margin:0 auto;
	}
	#contents .section1 .secret {
		background: rgba(255,255,255,0.5);
		padding:16vw 0 8vw;
	}
	#contents .section1 .secret .inner {
		width:92vw;
		margin:0 auto;
		padding:7.6vw 8vw;
		background:
			linear-gradient(45deg,  transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(315deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(225deg, transparent 10px, rgba(255,255,255,0.75) 10px),
			linear-gradient(135deg, transparent 10px, rgba(255,255,255,0.75) 10px);
		background-position: bottom left, bottom right, top right, top left;
		background-size: 50% 50%;
		background-repeat: no-repeat;
		position: relative;
	}
	#contents .section1 .secret .inner .title1 {
		width:99.25%;
		margin:0 auto;
		position: relative;
	}
	#contents .section1 .secret .inner .title1 img {
		position: absolute;
		top: -28.5625vw;
		width: 92vw;
		left: -8vw;
	}
	#contents .section1 .secret .inner .text1 {
		width:100%;
		font-size:3.2vw;
		line-height: 1.6667;
		letter-spacing: -0.04em;
		margin-bottom:4vw;
	}
	#contents .section1 .secret .inner .text1 span{
		font-size:2.4vw;
		display: block;
		padding-top:0.625vw;
	}
	#contents .section1 .secret .inner .img1 {
		position: static;
		padding-top:0;
		width: 102%;
    	right: 0;
	}
	#contents .section1 .howto {
		padding:4vw 0 10.6667vw;
	}
	#contents .section1 .howto .inner {
		width:100%;
		margin:0 auto;
		position: relative;
		padding:0 0 3.3333vw;
	}
	#contents .section1 .howto .inner .title1 {
		width:100%;
		position: relative;
		margin-bottom:6.6667vw;
	}
	#contents .section1 .howto .inner .title1 img {
	}
	#contents .section1 .howto .inner ul {
		overflow: hidden;
		width:94.6667vw;
		margin:0 auto;
	}
	#contents .section1 .howto .inner ul li {
		float:left;
		width:50%;
		padding:0 1.3333vw;
		margin-bottom: 2.6666vw;
	}
	#contents .section1 .howto .inner ul li:nth-of-type(3) {
		clear:both;
	}
	#contents .section1 .howto .inner ul li .img {
	}
	#contents .section1 .howto .inner ul li .text {
		font-size:3.2vw;
		line-height: 1.6667;
		letter-spacing: -0.04em;
		text-align: left;
		padding-left:6%;
	}
	#contents .section2 {
		background:url(../img/bg2_sp.jpg) no-repeat center top;
		background-size:100% auto;
		padding:13.3333vw 0 8vw;
	}
	#contents .section2 .img1 {
		width:37.3333vw;
		margin:0 auto 3.4667vw;
	}
	#contents .section2 .text {
		font-size:3.2vw;
		line-height: : 1.8;
		font-weight: bold;
		text-align: center;
	}
	#contents .section2 .text .style1 {
		font-size:2.6667vw;
	}
	#contents .section2 .text .style2 {
		font-size:2.4vw;
		font-weight: 400;
	}
	#contents .section2 .text .style3 {
		font-size:2.4vw;
		font-weight: 300;
	}
	#contents .section2 .price {
		font-size:3.2vw;
		text-align: center;
		margin-bottom:4vw;
	}
	#contents .section2 .price span {
		font-size:2.4vw;
		font-weight: 400;
	}
	#contents .section2 .btn {
		width:64vw;
		margin:0 auto;
	}
}