
@charset "utf-8";

/* clearfix */
/*************************************************************/
.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  min-height: 1px;
}
* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

/* custom */
/*************************************************************/
#special_body {
	text-align: center;
}
#special_body img{
	max-width:100%;
	height:auto;
}
#special_body a:hover img {
  opacity:0.7;
  filter:alpha(opacity=70);
  -ms-filter:"alpha(opacity=70)";
}

#special_body .container {
	background-color:#000000;
}
#special_body .innner-container {
	background:url(/mop/special/2511_sampleb/images/bk.png) repeat-y;
	background-size: contain;
	padding-bottom:5%; 
}

#special_body section.ct1,
#special_body section.ct3,
#special_body section.ct4 {
	margin-top:5%;
}
#special_body section.ct2 {
	margin:5% 0;
}

#special_body section.ct2 h3,
#special_body section.ct2 h4 {
	margin-bottom:3%;
}
#special_body section.ct2 .txt {
	margin-top:3%;
}
#special_body section.ct2 .inner-ct {
	margin-bottom:5%;
}
#special_body section.ct2 .leftman {
	margin-left:5%;
	margin-bottom:3%;
}
#special_body section.ct2 .rightman {
	margin-right:5%;
	margin-bottom:3%;
}
#special_body section.ct2 .rightman-txt {
	float:right;
	margin:2% 8% 3% 0;
}

#special_body section.ct3,
#special_body section.ct4 {
	margin:0 5%;
	background-color:#000000;
	border:2px solid;
	border-image:linear-gradient(to right, #fad500, #f4a400) 1;
	position: relative;
}
#special_body section.ct3,
#special_body section.ct4 {
	margin-top: 5%;
	padding:5% 0;
}
#special_body section.ct4 h3 {
	margin-bottom:5%;
}
/*#special_body section.ct4 {
	margin-top:15%;
	padding:10% 0 5%;
}
#special_body section.ct4 h3 {
	position:absolute;
	top:-55px;
	left:100px;
	display:block;
	background: linear-gradient(0deg, #000000 50%, transparent 54%);
}*/
#special_body section.ct3 a,
#special_body section.ct4 a {
	display:block;
	margin-top:3%;
}

#specialContentsIn .float {
	width: 80%;/* バナーの横幅を指定 */
}
#specialContentsIn .floating-banner:hover {
	opacity: .9;/* ホバーで少し透過 */
}
#specialContentsIn .floating-banner {
	position: fixed;/* 追従 */
	z-index: 99999;/* 他の要素の下に隠れないように */
	bottom: 25%;/* バナーの上下の位置 */
	right: 2%;/* バナーの左右の位置 */
}

@media screen and (max-width: 640px) {

	#special_body section.ct1,
	#special_body section.ct2,
	#special_body section.ct3,
	#special_body section.ct4 {
		padding:0 5%;
	}
	#special_body section.ct2 .leftman,
	#special_body section.ct2 .rightman,
	#special_body section.ct2 .rightman-txt {
		width:47%;
	}
	#special_body section.ct2 .leftman {
		margin-left:0;
	}
	#special_body section.ct2 .rightman {
		margin-right:0;
	}
	#special_body section.ct2 .rightman-txt {
		margin:2% 0 3% 0;
	}
	#special_body section.ct2 .rightman-txt img {
		width: 80%;
	}
	#special_body section.ct2 .txt {
		display:block;
		margin:0 auto;
		width:70%;
	}
	#special_body section.ct3,
	#special_body section.ct4 {
		padding:5%;
	}
	#special_body h3.h-ct3 {
		margin:0 5%;
	}	
	/*#special_body section.ct3 {
		margin-top:15%;
		padding:12% 5% 5%;
	}
	#special_body section.ct3 h3 {
		position: absolute;
		top:-26px;
		left:50px;
		right:50px;
	}
	#special_body section.ct4 {
		margin-top:15%;
		padding:10% 5% 5%;
	}
	#special_body section.ct4 h3 {
		position:absolute;
		top:-19px;
		left:50px;
		right:50px;
		background: linear-gradient(0deg, #000000 56%, transparent 54%);
	}*/

	#specialContentsIn .float {
		width: 50%;/* バナーの横幅を指定 */
	}
	#specialContentsIn .floating-banner {
		bottom: 20%;/* バナーの上下の位置 */
		right: -5%;/* バナーの左右の位置 */
	}

}



