@charset "shift_jis";

/*--- Base CSS ---*/
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  min-height: 1px;
}
* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}


#container {
	max-width: 1200px;
	margin: 20px auto;
	text-align: left;
}

/*--- 拡大画像スタイル（slimbox2） ---*/
#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	cursor: pointer;
}
#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #fff;
}
.lbLoading {
	background: #fff url(../images/loading.gif) no-repeat center;
}
#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #fff;
	background-repeat: no-repeat;
}
#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}
#lbPrevLink {
	left: 0;
}
#lbPrevLink:hover {
	background: transparent url(../images/prevlabel.gif) no-repeat 0 50%;
}
#lbNextLink {
	right: 0;
}
#lbNextLink:hover {
	background: transparent url(../images/nextlabel.gif) no-repeat 100% 50%;
}
#lbBottom {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #fff;
	border-top-style: none;
}
#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(../images/closelabel.gif) no-repeat center;
	margin: 5px 0;
	outline: none;
}
#lbCaption, #lbNumber {
	margin-right: 71px;
}
#lbCaption {
	font-size: 11px;
	line-height: 1.2;
	margin-bottom: 3px;
}
/* ------------------------------------------------------------------ */

/* Article CSS */
.left { float: left; }
.right { float: right; }
.mBtm50 { margin-bottom: 50px !important; }
sup { font-size: 85%; vertical-align: 2px; }

/* Contents CSS */
#mainContents {
	padding-bottom: 20px;
}
.mainTitle * {
/*	text-indent: -9999px;*/
}
.mainTitle p {
/*	max-width: 820px;
	height: 295px;
	background: url(../images/mainCatch.jpg) no-repeat top right;*/
}
.mainTitle p img,.mainTitle h2 img {
	max-width:100%;
	height:auto;
	display:block;
	margin:0 auto;
}
.mainTitle h2 {
/*	max-width: 820px;
	height: 120px;
	background: url(../images/mainTitle.jpg) no-repeat top right;*/
}
@media screen and (max-width: 1024px){
.mainTitle p img,.mainTitle h2 img {
	width:100%;
}

}
.lead {
/*	font-size: 108%;*/
	line-height: 1.9;
	padding: 35px 18px 0;
}
@media screen and (max-width: 640px){
   .lead {
   	padding: 35px 0 0;
   }
}
.contentBody h3 {
/*	font-size: 28px;*/
	font-weight: normal;
	line-height: 1.4;
	border-left: 10px solid #57423e;
	padding: 5px 0 2px 13px;
	margin-bottom: 35px;
}
.article {
	padding: 0 18px;
}
.article p {
/*	font-size: 108%;*/
	line-height: 1.9;
	margin-bottom: 25px;
}
.article .note {
/*	font-size: 85%;*/
	color: #999;
	margin: -20px auto 28px;
}
@media screen and (max-width: 640px){
   .contentBody h3 br {
      display: none;
   }
   .article {
   	padding: 0 0px;
   }
}

.reviewBox {
	max-width: 636px;
	margin: 0 auto 50px;
}
.reviewBox ul {
	background: #f2efed;
	padding: 30px 35px 30px 30px;
	margin-bottom: 15px;
}
.reviewBox li {
	background: url(../images/user01.gif) no-repeat 3px center;
/*	font-size: 108%;*/
	line-height: 1.8;
	padding: 10px 0 10px 60px;
	list-style-type:none;
}
.reviewBox li.user02 {
	background: url(../images/user02.gif) no-repeat 3px center;
}
.reviewBox li.user03 {
	background: url(../images/user03.gif) no-repeat 3px center;
}
.reviewBox li.user04 {
	background: url(../images/user04.gif) no-repeat 3px center;
}
.reviewBox li.user05 {
	background: url(../images/user05.gif) no-repeat 3px center;
}
.reviewBox li span {
	display: block;
	border-left: 1px dotted #000;
	padding: 5px 0 5px 20px;
}
@media screen and (max-width: 640px){
   .reviewBox li {
      background-position: top center !important;
      padding:50px 0 0px 0px;
   }
   .reviewBox li span {
      border-left: 0;
      border-top: 1px dotted #000;
   	padding: 10px 0 30px;
   }
}
.article .reviewBox .note {
/*	font-size: 85%;*/
	margin: 0;
}


.innerBnr {
	text-align: center;
	margin: 50px auto;
}

@media screen and (max-width: 640px){
	.innerBnr img {
		width:100%;
		height:auto;
	}
}

.matome {
	width: 728px;
	background: url(../images/matomeBg.jpg) no-repeat 0 0;
	border: 1px solid #a59e9d;
	margin: 0 auto 70px;
	box-sizing: border-box;
	padding: 40px 43px;
	color: #57423e;
}
@media screen and (max-width: 800px){
	.matome {
		width: 100%;
	}
}
@media screen and (max-width: 640px){
   .matome {
   	padding: 10% 5%;
   }
}
.matome h4 {
	font-size: 24px;
	font-weight: normal;
}

.matome h4 span {
	padding-left: 3px;
}
.matome p {
/*	font-size: 108%;*/
	line-height: 1.9;
	margin-top: 25px;
}

.itemBox {
	max-width: 730px;
	margin: 0 auto;
}
@media screen and (max-width: 640px){
	.itemBox {
		width: 100%;
	}
}
.itemBox h4 {
	height: 36px;
	background: #57423e;
	font-size: 18px;
	font-weight: normal;
	color: #fff;
	line-height: 38px;
	padding: 0 15px;
	margin-bottom: 45px;
}
.itemBox .clearfix {
	padding: 0 36px;
}
.itemBox .left,
.itemBox .right {
	width: 286px;
	text-align: center;
}

.itemBox a h5 {
	font-size: 24px;
	margin-top: 15px;
}
@media screen and (max-width: 640px){
   .itemBox h4 {
   	margin-bottom: 0;
   }
   .itemBox .clearfix {
   	padding: 0;
   }
   .itemBox .left,
   .itemBox .right {
      margin-top: 10%;
      width: 100%;
   }
   .itemBox img {
      width: 100%;
      height: auto;
   }
   .itemBox a h5 {
   	margin-bottom: 1%;
   }
}
.itemBox div > a {
	color: #57423e;
	text-decoration: none;
}
.itemBox div > a {
	color: #765b56;
}
.itemBox .btn {
	margin-top: 15px;
}

/* ImgBox CSS */
.imgBox01 {
	max-width: 600px;
   overflow: hidden;
}
.imgBox01.singleImg{
	float: left;
   margin: 0 20px 0 0;
}
.imgBox01 img {
	vertical-align: bottom;
}
.singlePara {
   line-height: 1.7;
}

.imgBox01.except {
	margin: 50px auto 0 ;
}
.imgBoxOuter {
   background: #f3f4f6;
   padding: 2%;
   margin: 0 auto 30px;
   overflow: hidden;
}
@media screen and (max-width: 900px){
   .imgBoxOuter.largerImg {}
   .imgBoxOuter.largerImg .imgBox01 {
      width: 100%;
      margin: 0 auto;
      float: none;
   }
   .imgBoxOuter.largerImg .imgBox01 img {
      margin: 0 auto 10px;
   }
   .imgBoxOuter.largerImg .singlePara {
      float: right;
      clear: both;
   }
}


@media screen and (max-width: 640px){
	.imgBox01 {
		max-width: 100%;
	}
   .imgBox01.singleImg{
   	float: none;
      margin: 0 auto;;
   }
	.imgBox01 img {
		margin:0 auto;
		display:block;
		width:100%;
		height:auto;
	}
}
.imgBox02 {
	max-width: 100%;
	margin: 0 auto 0px;
	overflow: hidden;
}
.imgBox02 img {
	vertical-align: bottom;
}
.imgBox02.except {
	margin: 0 auto 50px;
}
.imgBox02 .left,
.imgBox02 .left2,
.imgBox02 .right {
	width: 300px;
   margin: 0 20px 0 0;
}

@media screen and (max-width: 768px){
   .imgBox02 .left,
   .imgBox02 .right {
   	width: 49%;
      /*max-width: auto;*/
   }
   .imgBox02 .left img,
   .imgBox02 .right img {
   	width: 100%;
      height: auto;
   }
}

@media screen and (max-width: 640px){
	.imgBox02 {
		width:100%;
	}
	.imgBox02 img {
		width:100%;
		height:auto;
	}
	.imgBox02 .left,
	.imgBox02 .right {
		width: 100%;
	}
}
.capTxt {
/*	font-size: 93%;*/
	line-height: 1.7;
	margin-top: 15px;
}
.right.capTxt {
	margin-top: -2px;
}
.imgBox01 a:hover img,
.imgBox02 a:hover img {
	filter:alpha(opacity=80);
	opacity: 0.8;
}
.matome h4 {
	margin:0;
}
.matome p {
	margin:25px auto 0;
}
#container .article p {
	margin:0 auto 25px;
}
.mainTitle p,.mainTitle h2 {
	margin:0 auto;
}

.productsBottomButton {
   text-align: center;
   overflow: hidden;
   clear: both;
}
@media screen and (max-width: 640px){
   .productsBottomButton {
      padding: 10% 0 0;
   }
}
.imgBoxOuter .clearfix{
   position: relative;
}
.zoomin {
   position: relative;
}
.zoomin a:after {
   content:url("/active-speaker/special/review/cas-1/images/zoom-white.png");
   position: absolute;
   top:5px;
   left:5px;
}
.zoomin.black a:after {
   content:url("/active-speaker/special/review/cas-1/images/zoom-black.png");
}

/* start added anchor */
.c5-columns {
   overflow: hidden;
}
.c5-single {
   width:32.3%;
   margin: 0 .5%;
   float: left;
   text-align: left;
   font-size: .875rem;
   height: 60px;
   vertical-align: middle;
   display: table;
   background: #fff;
}
.c5-single a {
   display: table-cell;
   vertical-align: middle;
   background:#e4e7ec;
   line-height: 1.4;
   position: relative;
   margin: 0 1%;
   padding: 0 3% 0 10%;
   text-decoration: none;
}
.c5-single a:hover {
   filter:alpha(opacity=80);
   opacity: 0.8;
}
.c5-single a:before {
   content: "\f0d7";
   font-family: 'icon';
   speak: none;
   position: absolute;
   top:35%;
   top:20px\9 !important;
   left:4%;
}
@media all and (-ms-high-contrast: none){
   .c5-single a:before {
      top:20px !important;
   }
}
@media screen and (max-width: 640px){
   .c5-single {
      width: 100%;
      margin: 0 0;
      float: none;
      clear: both;
      height: auto;;
      display: block;
      margin: 3% 0;
   }
   .c5-single a {
      display: block;
      margin: 0 1%;
      padding:2% 3% 2% 10%;
   }
   .c5-single a:before {
      top:30%;
   }
}
/* new end */
