@charset "utf-8";
/* core	================================================	*/

/* TOPIC NAV */
#topicNav {
	background: #151110;
	padding: 10px 10px;
	margin: 5px 0 15px 0;
	text-align: left;
}

#topicNav p,
#topicNav a,
#topicNav span{
	font-size: 10px;
	color: #656764;
}
#topicNav span.current{
	color: #ffffff;
}

#productsInner {
	padding: 0px 15px;
	position: relative;
}

#productsInner #productsCont {
	background: #000000;
	margin: 0;
	text-align: left;
}

/* サイドバー */
#sideNav {
	width: 100%;
}

/* サイドバー バナー */
#sideNav ul li.bnr {
	display: none;
}

#sideNav .point{
	display: inline;
	float: left;
	background: #000000;
	position: relative;
	width: 49.5%;
	float: left;
	height: 40px;
	margin: 0 1px 2px 0;
	text-align: left;
}

#sideNav .innerList {
	display: none;
	position: absolute;
	left: 0;
	top: 40px;
	z-index: 9999;
	width: 100%;
}

#sideNav .innerList ul,
#sideNav .innerList li,
#sideNav .innerList a,
#sideNav .innerList img{
	width: 100%;
}

#sideNav .point p{
	background: url(../img/products/sideNavBg.png) no-repeat 5px center;
	padding: 10px 0 13px 30px;
	border-bottom: 1px solid #222222;
}

#sideNav .point p img{
	height: 15px;
}
#sideNav .point p:hover{
	background-image: url(../img/products/sideNavBgOver.png)
}
#sideNav .opener p{
	background-image: url(../img/products/sideNavBgCurrent.png)
}
#sideNav .opener p:hover{
	background-image: url(../img/products/sideNavBgCurrent.png)
}
#sideNav .current p{
	background-color: #111111;
}

#sideNav .point p.bnbtn{
	background: none;
	padding: 0;
	border:none;
}

#sideNav .point p.bnbtn:hover{
	cursor: pointer;
}
#sideNav .point p.bnbtn img{
	height: auto;
}


/* SHARE */

.share{
	margin: 0 20px;
	padding-bottom: 30px;
	border-bottom: 1px dotted #ffffff;
	margin-bottom: 30px;
}

.share p{
	margin-bottom: 10px;
}

.share ul{
	float: left;
}

.share li{
	display: inline;
	width: 120px;
	float: left;
}



.pagetop {
	display: block;
	width: 100%;
	height: 30px;
	background: #111111;
	text-align: center;
	padding: 5px 0 10px 0;
}


#productsIn #productsFoot {
	display: none;
}


/* default */
.article_footer{
	width:100%;
	overflow:hidden;
	margin: 0;
	padding: 0;
	background:url(../images/contents/border.png) repeat-x 0 top;
}

.section_pagetop{
	float:none;
	margin: 80px 0 0;
	padding: 0;
	width: 100%;
	height:50px;
	overflow: hidden;
}
.section_pagetop a{
	width: 100%;
	height:50px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	display:block;
	background:#eee;
}
.section_pagetop a img{
	margin: 20px auto 0;
}


/* ------------------------------------------------------------
	1. section
------------------------------------------------------------ */

/* 	1.0. setting
------------------------------------------------------------ */

.section {
	padding:0;
	margin: 0 auto;
	overflow:hidden;
}
.section.section_end {
	margin-bottom: 20px;
}
.section .banner.type_single img {
	opacity: 1;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.section .banner.type_single img:hover {
	opacity: 0.7;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}
.title {
	width:700px;
	margin:0 0 20px;
}
.image {
	width:410px;
}
.image.noscale{
	width:auto;
}
.image.imageInfo{
	margin: 0;
}
.imageInfoList {
	overflow:hidden;
	margin: 0 0 20px;
}
.imageInfoList li{
	background:#111111;
	float: left;

}
.imageInfoList li .imageInfoListInner{
	border-right:1px solid #000;
	padding:10px 0;
}
.imageInfoList li.last .imageInfoListInner{
	border-right:none;
	border-left:1px solid #000;
}
.imageInfoList .imageTitle{
	font-size:14px;
	font-weight:bold;
	margin: 0 0 5px 10px;
}
.imageInfoList p{
	font-size:12px;
	line-height:150%;
	margin: 0 10px;
}
.text {
	margin: 0 0 20px;
}
.text.type_fullwidth_text{
	width:100%;
	clear:both;
}
.image.type_fullwidth_image{
	width:100%;
	clear:both;
	margin: 0 0 20px;
}
.cotion{
	font-size:10px;
	font-size:1.0rem;
	color:#666;
}
.question,
.sub{
	color:#999;
}
.image.imageInfo.type_fullwidth_image{
	margin: 0;
}



.section {
	overflow:hidden;
	padding:0;
	margin: 0 auto;
	overflow:hidden;
}
.section.section_end {
	margin-bottom: 20px;
}
.title {
	width: 100%;
	margin:0 0 20px;
}
.image {
	width: 100%;
	margin: 0 0 20px 0;
}

.section_inner .image {
	margin: 0;
}
.image.noscale{
	width:auto;
}
.image.imageInfo{
	margin: 0;
}
.imageInfoList {
	width: 100%;
}
.text {
	margin:0 0 20px;
}
.text.type_fullwidth_text{
	width:100%;
	clear:none;
}
.image.type_fullwidth_image{
	width:100%;
	clear:none;
	margin: 0 0 10px;
}
.image.imageInfo.type_fullwidth_image{
	margin: 0;
}

/* 	1.1. type_left_image
------------------------------------------------------------ */
.type_left_image {
}
.type_left_image .image {
	float:none;
	margin: 0 auto 20px;
}
.type_left_image .image.imageInfo {
	margin: 0 auto;
}
.type_left_image .text {
}
.type_left_image .imageInfoList.column_one {
	width:100%
}
.type_left_image .imageInfoList.column_one li{
	width:100%
}

/* 	1.2. type_right_image
------------------------------------------------------------ */

.type_right_image {
}
.type_right_image .image {
	float:none;
	margin: 0 auto 20px;
}
.type_right_image .image.imageInfo {
	margin: 0 auto;
}
.type_right_image .text {
}
.type_right_image .imageInfoList.column_one {
	width:100%
}
.type_right_image .imageInfoList.column_one li{
	width:100%
}
/* 	1.3. image.column_one
------------------------------------------------------------ */

.imageInfoList.column_one {
	width:100%;
}
.imageInfoList.column_one li{
	width:100%;
}

/* 	1.4. image.column_two
------------------------------------------------------------ */

.imageInfoList.column_two {
	width:100%;
}
.imageInfoList.column_two li{
	width:50%;
}

/* 	1.5. image.column_thr
------------------------------------------------------------ */

.imageInfoList.column_thr {
	width:100%;
}
.imageInfoList.column_thr li{
	width:33.4%;
}

.imageInfoList.column_thr li.last{
	width:33.2%;
}


/* 	1.6. talk
------------------------------------------------------------ */
.talk.column_one {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
}
.talk.column_two {
	width: 100%;
	margin: 0;
	overflow: hidden;
}
.talk.column_one p {
	width:100%;
	display: table;
}
.talk.column_two p {
	display: table;
	width: 100%;
	margin: 0 auto;
}
.talk p .name {
	font-weight: normal;
	border: none;
	padding: 0;
	margin: 0;
	font-size: 12px;
	font-size: 1.2rem;
	float: none;
	display: table-cell;
}
.talk p .utterance {
	font-size: 12px;
	font-size: 1.2rem;
	float: none;
	display: table-cell;
}
.talk.column_one p .name,
.talk.column_two p .name { 
	width: 25%;
	height: auto;
	/*display:table-cell;*/
	margin: 0 0% 0 0;
	float:left;
}
.talk.column_one p .utterance,
.talk.column_two p .utterance { 
	width: 73%;
	height: auto;
	/*display:table-cell;*/
	float:left;
}

.talk.column_two .image.type_left,
.talk.column_two .image.type_right {
	float: none;
	width: auto;
	margin: 20px 0;
}
.talk.column_two .text.type_left,
.talk.column_two .text.type_right {
	float: none;
	width: auto;
}

/* 	1.7. PC/SP separated banner
------------------------------------------------------------ */
.only_pc {
	display: none;
}


/* ------------------------------------------------------------
	2. section_nav
------------------------------------------------------------ */

/* 	2.0. setting
------------------------------------------------------------ */

.section_nav{
	padding:0;
	margin: 0 auto 20px;
	overflow:hidden;
}

.section_nav .btn{
	padding:0;
	margin: 0 0 40px;
	overflow:hidden;
	border:2px solid #1e1e1e;
	display:block;
}
.section_nav .btn.s_margin {
	margin-bottom: 10px;
}
.section_nav .btn.active,
.section_nav .btn:hover{
	border:2px solid #999;
}
.section_nav .text{
	text-align:center;
	line-height: 40px;
	margin: 0 auto;
}
.section_nav .text,
.section_nav .text span{
	font-size: 1.2rem;
	font-size: 12px;
	font-weight: bold;
}
.section_nav .btn.active .text,
.section_nav .btn:hover .text{
	color:#999;
	text-decoration:none;
}
.section_nav .text span{
	color:#de0000;
}
.section_nav .btn.active .text span,
.section_nav .btn:hover .text span{
	color:#ee7f7f;
}
.section_nav .link{
	background:#fff;
	text-align:center;
	overflow:hidden;
}
.section_nav .btn.active .link,
.section_nav .btn:hover .link{
	background:#999;
}
.section_nav .link img{
	margin: 12px auto 0;
}

.section_nav{
}

.section_nav .btn{
	padding:0;
	overflow:hidden;
	border:2px solid #999999;
	display:block;
}

.section_nav .text{
	text-align:center;
	line-height: 150%;
	padding: 10px 0;
	margin: 0 auto;
}

.section_nav .link{
	background:#fff;
	text-align:center;
}
.section_nav .btn.active .link,
.section_nav .btn:hover .link{
	background:#999;
}
.section_nav .link img{
	width:auto;
	margin: 12px auto 0;
}


/* 	2.1. column_one
------------------------------------------------------------ */

.section_nav.column_one{
	width:100%;
	height:auto;
}
.section_nav.column_one .btn{
	width:90%;
	height:auto;
	margin: 0 auto;
}
.section_nav.column_one .text{
	float:none;
	width:90%;
	height:auto;
	margin: 0 auto;
}
.section_nav.column_one .link{
	float:none;
	width:100%;
	height: 40px;
	overflow:hidden;
}
.section_nav.column_one .link img{
	height: auto;
}

.section_nav.column_one.type02{
	width:100%;
	height:auto;
}
.section_nav.column_one.type02 .btn{
	width:90%;
	height:auto;
	margin: 0 auto;
}
.section_nav.column_one.type02 .text{
	float:none;
	width:90%;
	height:auto;
	margin: 0 auto;
}
.section_nav.column_one.type02 .link{
	float:none;
	width:100%;
	height: 40px;
	overflow:hidden;
}
.section_nav.column_one.type02 .link img{
	height: auto;
}

/* 	2.2. column_two
------------------------------------------------------------ */

.section_nav.column_two{
	width:100%;
	height:auto;
}
.section_nav.column_two .btn,
.section_nav.column_two .btn.last{
	width:90%;
	height:auto;
	margin: 0 auto 20px;
	float:none;
}

.section_nav.column_two .text{
	float:none;
	width:90%;
	height:auto;
	margin: 0 auto;
}
.section_nav.column_two .link{
	float:none;
	width:100%;
	height: 40px;
	overflow:hidden;
}

.section_nav.column_two .link img{
	height: auto;
}



/* 	2.3. column_thr
------------------------------------------------------------ */






/* ------------------------------------------------------------
	3. section_column
------------------------------------------------------------ */

/* 	3.0. setting
------------------------------------------------------------ */

.section_column{
	padding:0;
	margin: 0 auto;
	overflow:hidden;
}

.section_column .section_inner{
	width: 340px;
	margin: 0 0 30px;
}
.section_inner.type_left{
	float:left;
}
.section_inner.type_right{
	float:right;
}

.section_column .title{
	margin: 0 0 10px;
	border-top:2px solid #fff;
	border-bottom:2px solid #fff;
}
.section_column .title img{
	width: auto;
	max-width: 100%;
}
.section_column .subimage{
	width: auto;
	padding: 10px 0 0;
	margin: 0 0 5px;
}
.section_column .subimage_single{
	width: auto;
	padding: 10px 0 10px;
}

.section_column .btns{
	width: 340px;
	overflow: hidden;
	margin: 0 0 5px;
}

.section_column .btn{
	overflow:hidden;
	background: #000;
	display:block;
}
.section_column .type_ex .btn{
	background: #fff;
	width: 336px !important;
	border: 2px solid #000;
}

.section_column .btnInner{
	overflow:hidden;
	margin-bottom: 2px;
	background: #ffffff;
}
.section_column .type_ex .btnInner{
	/*border: 2px solid #000;*/
}
*:first-child+html .section_column .type_ex .btn {
	display: block;
}
*:first-child+html .section_column .type_ex .btnInner {
	display: inline;
	zoom: 0;
}

.section_column .btn img{
	padding:5px 10px;
}
.section_column .btn:hover{
	background: #999;
}
.section_column .type_ex .btn:hover{
	background: #eee;
}
.section_column .btnInner.new{
	background: url(../img/contents/new.png) no-repeat right center #ffffff;
}

.section_column{
	width: 90%;
}

.section_column .section_inner{
	width: 100%;
	margin: 0 0 40px;
}
.section_inner.type_left,
.section_inner.type_right{
	float:none;
}

.section_column .title{
	width: 100%;
}
.section_column .title img{
	width: auto;
}

.section_column .text{
	width: 100%;
}

.section_column .image{
	width: 100%;
}
.section_column .subimage{
	width: auto;
}
.section_column .subtext{
	width: auto;
}
.section_column .btns{
	width: 100%;
}

.section_column .btn,
.section_column .btnInner{
	width: 100%;
}



/* 	3.1. btns.column_one
------------------------------------------------------------ */

.section_column .btns.column_one .btn,
.section_column .btns.column_one .btnInner{
	width: 100%;
}
.section_column .type_ex .btn{
	width: 98.5% !important;
}
.section_column .btns.column_one.type_ex .btnInner{
	width: auto;
	margin: 0;
	padding: 0 0 2px;
}

/* 	3.2. btns.column_two
------------------------------------------------------------ */
.section_column .btns.column_two .btn{
	width: 50%;
}
.section_column .btns.column_two .btnInner{
	width: auto;
	border-right:1px solid #FFF;
}
.section_column .btns.column_two.last .btnInner{
	border-left:1px solid #FFF;
}

/* ------------------------------------------------------------
	4. detail
------------------------------------------------------------ */

.productvis {
	width:100%;
}
.productvisInner {
	width:92%;
	margin:0 auto;
	overflow:hidden;
}
.productvis .mainImage {
	width:100%;
}
.productvis .copy {
	width:100%;
	padding: 20px 0;
}
.productvis .copy img {
	width: 92%;
	margin: 0 auto;
}
.productvis .text {
	width:100%;
	font-size:12px;
	font-size:1.2rem;
	font-weight:bold;
	line-height:140%;
}


/* ------------------------------------------------------------
	5. voice
------------------------------------------------------------ */

.mainvis {
	width:100%;
	overflow:hidden;
	padding:30px 0 20px;
	margin:0 0 30px;
	overflow:hidden;
	background: #111111;
}
.mainvisInner {
	width:700px;
	overflow:hidden;
	margin:0 auto;
	overflow:hidden;
}
.mainvisImage {
	float:right;
	width:385px;
	margin: 0 0 10px;
}
.mainvis .name {
	margin: 0 0 15px;
}
.mainvis .job {
	margin: 0 0 5px;
}
.mainvis .subtext {
	font-size: 1.2rem;
	font-size: 12px;
	width:300px;
	margin: 0 0 20px;
}
.mainvis .text {
	width:300px;
	margin: 0 0 10px;
}
.mainvis .info{
	width:700px;
}
.mainvis .info li{
	float:left;
	margin: 0 10px 10px 0;
	/*width: 350px;*/
}
.mainvis .info li a{
	margin: 0 0 0 10px;
}
.mainvis .info li a:hover{
	text-decoration: underline;
}
.mainvis .infoTitle{
	float:left;
	color: #fff;
	background: #666;
	padding: 0;
	display:block;
	width: 120px;
	text-align:center;
}

/* 	5.1. column_two
------------------------------------------------------------ */
.mainvis.column_two {
	width:100%;
	overflow:hidden;
	padding:30px 0 20px;
	margin:0 0 30px;
	overflow:hidden;
}
.mainvis.column_two .mainvisInner {
	width: 340px;
}
.mainvis.column_two .mainvisInner.type_left {
	float: left;
	margin: 0 0 0 30px;
}
.mainvis.column_two .mainvisInner.type_right {
	float: right;
	margin: 0 30px 0 0;
}
.mainvis.column_two .name {
	margin: 20px 0 15px 0;
}
.mainvis.column_two .subtext {
	margin: 0;
}
.mainvis.column_two .text {
	width: 100%;
	text-align: justify;
	margin-top: 20px;
}

/* 	5.2. item
------------------------------------------------------------ */

.item{
	background: #eee;
	width: 700px;
	overflow: hidden;
}
.item.section_end{
	margin-bottom: 40px;
}
.itemImage{
	float: left;
	width: 100px;
	margin: 30px 0 30px 30px;
}
.itemTitle{
	float: right;
	width: 510px;
	font-size:14px;
	font-size:1.4rem;
	line-height:150%;
	font-weight: bold;
	margin: 30px 30px 10px 0;
}
.itemText{
	float: right;
	width: 510px;
	font-size:12px;
	font-size:1.2rem;
	line-height:150%;
	margin: 0 30px 30px 0;
}
.itemText .boldText{
	font-weight: bold;
}



/* 	5.1. column_two
------------------------------------------------------------ */
.mainvis.column_two {
	width:100%;
	overflow:hidden;
	padding:10px 0 0 0;
	margin:0 0 20px 0;
	overflow:hidden;
}
.mainvis.column_two .mainvisInner.type_left,
.mainvis.column_two .mainvisInner.type_right {
	width: 95%;
	margin: 0 auto;
	padding: 0;
	float: none;
}
.mainvis.column_two .name {
	width:80%;
	margin: 0 10px 2%;
}
.mainvis.column_two .job {
	width:60%;
	margin: 0 10px 5px;
}
.mainvis.column_two .subtext {
	width:auto;
	margin: 0 10px 20px;
}
.mainvis.column_two .text {
	width:auto;
	margin: 0 10px 20px;
}

/* 	5.2. item
------------------------------------------------------------ */

.item{
	background: #eee;
	width: 90%;
}
.itemImage{
	float: none;
	width: 100px;
	margin: 30px auto 20px;
}
.itemTitle{
	float: none;
	width: 90%;
	margin: 0 auto 10px;
	/*text-align: center;*/
}
.itemText{
	float: none;
	width: 90%;
	margin: 0 auto 30px;
	/*text-align: center;*/
}
.itemText .boldText{
	font-weight: bold;
}

}

.mainvis {
	width:100%;
	overflow:hidden;
	padding:10px 0 20px;
	margin:0 0 30px;
	overflow:hidden;
	background: #eee;
}
.mainvisInner {
	width:auto;
	overflow:hidden;
	margin:0 10px;
	overflow:hidden;
}
.mainvisImage {
	float:none;
	width:100%;
	margin: 0 0 20px;
}
.mainvis .name {
	width:50%;
	margin: 0 10px 2%;
}
.mainvis .job {
/*	width:60%; */
	width:98%;
	margin: 0 10px 5px;
}
.mainvis .subtext {
	width:auto;
	margin: 0 10px 20px;
}
.mainvis .text {
	width:auto;
	margin: 0 10px 20px;
}
.mainvis .info{
	width:100%;
	margin: 0 0 10px 10px;
}
.mainvis .info li{
	float:none;
	width: 100%;
	margin: 0 0 10px;
}
.mainvis .info li a{
}
.mainvis .infoTitle{
}

.text span.attn {
	font-size: 14px;
	line-height: 1.4rem;
}

/* ------------------------------------------------------------
	6. movie
------------------------------------------------------------ */
#movie{
    padding: 10px 0 0;
	width:100%;
}
#movie .section{
	width:90%;
	overflow:hidden;
}
.movie{
	width:100%;
}
.media{
	width:100%;
}

img {
	max-width: 100%;
}