@charset "Shift_JIS";

/* content
------------------------------------------*/

#content {
margin-bottom: 0px;
position: relative;
font-size: 100%;
}
#content p {
line-height: 1.8;
letter-spacing: 1px;
}
#content #mainArea{
}
#content #mainArea:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content .mainImg{
	width:950px;
	height:203px;
}
#content .mainImgS {
display: none;	
}
@media screen and (max-width: 640px) {
#content {
}
#content img{
vertical-align: bottom;
}
#content p {
letter-spacing: 0;
}
#content #mainArea{
	width:100%;
	height:auto;
}
#content .mainImg {
display: none;	
}

#content .mainImgS {
margin: 0;
display: block;	
}
#content .mainImgS img{
	width: 100%;
	height: auto;
}
}
/*---------- headSnsList ----------*/
#content .headSnsList{
margin: 0;
padding: 0;
}
#content .headSnsList li{
margin: 0;
padding: 0;
list-style-type: none;
line-height: 1;
font-size: 1px;
position: absolute;
top: 9px;
}
#content .headSnsList li.fb {
right: 9px;
}
#content .headSnsList li.tw {
right: 33px;	
}
@media screen and (max-width: 640px) {
#content .headSnsList li{
top: 13px;
}
#content .headSnsList li.fb {
right: 6px;
}
#content .headSnsList li.tw {
right: 30px;	
}
}

/*---------- #navArea ----------*/
#content #navArea{
width: 950px;
height: 102px;
}
#content #navArea:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content .nav .nav01 h3 span,
#content .nav .nav02 h3 span,
#content .nav .nav03 h3 span {
display: none;
}
#content .nav li{
	float:left;
}
#content .nav li.nav01 {
width: 316px;
height: 102px;
}
#content .nav li.nav02 {
width: 317px;
height: 102px;
}
#content .nav li.nav03 {
width: 317px;
height: 102px;
}
#content .nav li.nav01 a{
	background: url(../images/nav01.jpg) no-repeat 0 0;
	display:block;
	width: 316px;
	height: 102px;
}
#content .nav li.nav02 a{
	background: url(../images/nav02.jpg) no-repeat 0 0;
	display:block;
	width: 317px;
	height: 102px;
}
#content .nav li.nav03 a{
	background: url(../images/nav03.jpg) no-repeat 0 0;
	display:block;
	width: 317px;
	height: 102px;
}
#content .nav li.nav01 a.active,
#content .nav li.nav02 a.active,
#content .nav li.nav03 a.active{
background-position: 0 -102px;
}
#content .nav li.nav01 a:hover,
#content .nav li.nav02 a:hover,
#content .nav li.nav03 a:hover{
background-position: 0 -102px;
}
#content p.smp{
	display:none;
}
#content p.smp img{
	display:none;
}
@media screen and (max-width: 640px) {
#content #navArea{
position:static;
width:100%;
height: auto;
background: #000;
}
#content ul.nav {
	position: static;
}

#content .nav li.nav01{
width: 33%;
height: auto;
}
#content .nav li.nav02{
width: 33%;
height: auto;
}
#content .nav li.nav03{
width: 33%;
height: auto;
}
#content .nav li.nav01 a{
	background: none;
	display:block;
	width: 100%;
	height: auto;
}
#content .nav li.nav02 a{
	background: none;
	display:block;
	width: 100%;
	height: auto;
}
#content .nav li.nav03 a{
	background: none;
	display:block;
	width: 100%;
	height: auto;
}
#content .nav li.nav01 a:hover,
#content .nav li.nav02 a:hover,
#content .nav li.nav03 a:hover{
background-position: 0 0;
}
#content p.smp{
	display:block;
}
#content p.smp img{
	display:block;
	width: 100%;
height: auto;
}
}
/*---------- #projectMember ----------*/
#content #projectMember{
/*width: 941px;*/
height: 208px;
border-left: #000 4px solid;
border-right: #000 5px solid;
}
@media screen and (max-width: 640px) {
#content #projectMember{
position:static;
height: auto;
}
#content #projectMember img{
width: 100%;
height: auto;
}
}
/*---------- #titleArea ----------*/
#content #titleArea{
/*width: 941px;*/
border-left: #000 4px solid;
border-right: #000 5px solid;
}
@media screen and (max-width: 640px) {
#content #titleArea{
position:static;
height: auto;
overflow: hidden;
}
#content #titleArea img{
width: 130%;
height: auto;
}
}
/*---------- #interviewArea ----------*/
#content #interviewArea{
/*width: 881px;*/
padding: 0 30px 60px 30px;
border-left: #000 4px solid;
border-right: #000 5px solid;
border-bottom: #000 7px solid;
}
#content #interviewArea:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
@media screen and (max-width: 640px) {
#content #interviewArea{
position:static;
padding: 5px 0 35px 3%;
border-bottom: #000 7px solid;
}
}
/*---------- #interviewArea section----------*/
#content #interviewArea .section{
	position: relative;
	margin-top: 0px;
	width:881px;
}
#content #interviewArea .section:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content #interviewArea .section{
	padding-top: 50px;
}
#content #interviewArea .section h4{
	float:left;
	width: 600px;
	padding:0 0 0px 0;
	margin:0;
	font-weight: bold;
	font-size: 18px;
	font-family:"ヒラギノ角ゴ Pro W6","HiraKakuPro-W6","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#content #interviewArea .section p.answer{
	clear:both;
	float:left;
	padding:35px 0 0 0;
	margin:0;
	width:600px;
}
#content #interviewArea .section p.answer em{
	float:left;
	display:block;
	width:60px;
	padding:0;
	margin:0;
	font-size:16px;
	font-style:normal;
	font-weight: bold;
	font-family:"ヒラギノ角ゴ Pro W6","HiraKakuPro-W6","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#0099ff;
}
#content #interviewArea .section p.answer span{
	float:left;
	width:540px;
	display:block;
	font-size: 14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	padding:0;
	margin:0;
}
#content #interviewArea .section h4.S{
	float:left;
	width: 510px;
	padding:0 0 0px 0;
	margin:0;
	font-weight: bold;
	font-size: 18px;
	font-family:"ヒラギノ角ゴ Pro W6","HiraKakuPro-W6","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#content #interviewArea .section p.answerS{
	clear:both;
	float:left;
	padding:35px 0 0 0;
	margin:0;
	width:515px;
}
#content #interviewArea .section p.answerS em{
	float:left;
	display:block;
	width:60px;
	padding:0;
	margin:0;
	font-size:16px;
	font-style:normal;
	font-weight: bold;
	font-family:"ヒラギノ角ゴ Pro W6","HiraKakuPro-W6","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#0099ff;
}
#content #interviewArea .section p.answerS span{
	float:left;
	width:455px;
	display:block;
	font-size: 14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	padding:0;
	margin:0;
}
#content #interviewArea .section h4.L{
	float:left;
	width: 880px;
	padding:0 0 0px 0;
	margin:0;
	font-weight: bold;
	font-size: 18px;
	font-family:"ヒラギノ角ゴ Pro W6","HiraKakuPro-W6","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#content #interviewArea .section p.answerL{
	clear:both;
	float:left;
	padding:35px 0 0 0;
	margin:0;
	width:880px;
}
#content #interviewArea .section p.answerL em{
	float:left;
	display:block;
	width:60px;
	padding:0;
	margin:0;
	font-size:16px;
	font-style:normal;
	font-weight: bold;
	font-family:"ヒラギノ角ゴ Pro W6","HiraKakuPro-W6","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#0099ff;
}
#content #interviewArea .section p.answerL span{
	float:left;
	width:820px;
	display:block;
	font-size: 14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	padding:0;
	margin:0;
}
#content #interviewArea .section .imageBox p.caption{
	width: 251px;
	padding: 0;
	font-size: 14px;
}
#content #interviewArea .section .imageBox{
	position: absolute;
	width: 251px;
	height: auto;
	top: 50;
	right:0;
}
#content #interviewArea .section .imageBox:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
/*------*/
#page01 #content #interviewArea .section01 .imageBox01{
	position: absolute;
	width: 251px;
	height: auto;
	top: 50px;
	right:0;
}
#page01 #content #interviewArea .section01 .imageBox02{
	position: absolute;
	width: 251px;
	height: auto;
	top: 250px;
	right:0;
}
#page01 #content #interviewArea .section01 .imageBox01:after,
#page01 #content #interviewArea .section01 .imageBox02:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
/*------*/
#page02 #content #interviewArea .section02 .imageBox{
	position: absolute;
	width: 353px;
	height: auto;
	top: 50px;
	right:0;
}
#page02 #content #interviewArea .section03 .imageBox{
	position: absolute;
	width: 251px;
	height: auto;
	top: 50px;
	right:0;
}
#page02 #content #interviewArea .section05 .imageBox{
	position: absolute;
	width: 251px;
	height: auto;
	top: 50px;
	right:0;
}
#page02 #content #interviewArea .section02 .imageBox:after,
#page02 #content #interviewArea .section03 .imageBox:after,
#page02 #content #interviewArea .section05 .imageBox:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
/*------*/
#page02 #content #interviewArea .section06 h4{
	width: 780px;
}
/*------*/
#page03 #content #interviewArea .section04 .imageBox01{
	position: absolute;
	width: 251px;
	height: auto;
	top: -92px;
	right:0;
}
#page03 #content #interviewArea .section04 .imageBox02{
	position: absolute;
	width: 251px;
	height: auto;
	top: 170px;
	right:0;
}
#page03 #content #interviewArea .section06 .imageBox{
	position: absolute;
	width: 251px;
	height: auto;
	top: -174px;
	right:0;
}
#page03 #content #interviewArea .section07{
	padding-bottom: 30px;
}
#page03 #content #interviewArea .section07 .imageBox01{
	position: absolute;
	width: 251px;
	height: auto;
	top: 50px;
	right:0;
}
#page03 #content #interviewArea .section07 .imageBox02{
	position: absolute;
	width: 335px;
	height: auto;
	top: 488px;
	right:0;
}
#page03 #content #interviewArea .section04 .imageBox01:after,
#page03 #content #interviewArea .section04 .imageBox02:after,
#page03 #content #interviewArea .section06 .imageBox:after, 
#page03 #content #interviewArea .section07 .imageBox01:after,
#page03 #content #interviewArea .section07 .imageBox02:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
/*------*/
@media screen and (max-width: 640px) {
#content #interviewArea .section{
	position: static;
	margin-top: 0px;
	width:100%;
}
#content #interviewArea .section{
	padding-top: 0px;
}
#content #interviewArea .section h4,
#content #interviewArea .section h4.S,
#content #interviewArea .section h4.L,
#page02 #content #interviewArea .section06 h4{
	float:none;
	width: 90%;
	padding:30px 0 0px 0;
	margin:0;
	font-size: 18px;
}
#content #interviewArea .section p.answer,
#content #interviewArea .section p.answerS,
#content #interviewArea .section p.answerL{
	clear:both;
	float:none;
	padding:30px 0 0 0;
	margin:0;
	width:100%;
}
#content #interviewArea .section p.answer em,
#content #interviewArea .section p.answerS em,
#content #interviewArea .section p.answerL em{
	float:left;
	display:block;
	width:50px;
	padding:0;
	margin:0;
	font-size:16px;
}
#content #interviewArea .section p.answer span,
#content #interviewArea .section p.answerS span,
#content #interviewArea .section p.answerL span{
	float:left;
	width:78%;
	display:block;
	font-size: 14px;
	padding:0;
	margin:0;
}
#content #interviewArea .section .imageBox,
#page01 #content #interviewArea .section01 .imageBox01,
#page02 #content #interviewArea .section02 .imageBox,
#page02 #content #interviewArea .section03 .imageBox, 
#page02 #content #interviewArea .section05 .imageBox,
#page03 #content #interviewArea .section04 .imageBox01,
#page03 #content #interviewArea .section06 .imageBox,
#page03 #content #interviewArea .section07 .imageBox01 {
	position: relative;
	clear: both;
	width: 100%;
	height: auto;
	text-align: center;
	padding: 30px 0 0 0;
	top: 0;
	right:0;
}
#page01 #content #interviewArea .section01 .imageBox02{
	position: relative;
	clear: both;
	width: 100%;
	height: auto;
	text-align: center;
	padding: 5px 0 0 0;
	top: 0;
	right: 0;
}
#page03 #content #interviewArea .section04 .imageBox02,
#page03 #content #interviewArea .section07 .imageBox02{
	position: relative;
	clear: both;
	width: 100%;
	height: auto;
	text-align: center;
	padding: 5px 0 0 0;
	top: 0;
	right: 0;
}
#content #interviewArea .section .imageBox img,
#content #interviewArea .section .imageBox01 img,
#content #interviewArea .section .imageBox02 img{
	width:50%;
	height:auto;
}
#page03 #content #interviewArea .section07 .imageBox02 img{
	width:70%;
	height:auto;
}
#page03 #content #interviewArea .section07{
	padding-bottom:0;
}
#content #interviewArea .section .imageBox p.caption,
#content #interviewArea .section .imageBox01 p.caption,
#content #interviewArea .section .imageBox02 p.caption{
	position: relative;
	width: 100%;
	height: auto;
	font-size: 100%;
	text-align: center;
}
}
/*---------- #nextArea ----------*/
#content #nextArea{
	width: 950px;
height: 86px;
}
#content #nextArea a{
width: 950px;
height: 86px;
display: block;
background: #000;
}
#content #nextArea a:hover{
	opacity:0.9;
	background: #FFF;
}
@media screen and (max-width: 640px) {
#content #nextArea{
position:static;
width: 100%;
height: auto;
overflow:hidden;
}
#content #nextArea a{
width: 100%;
height: auto;
}
#content #nextArea a img{
width: 170%;
height: auto;
}
}
/*---------- #productArea ----------*/

#content #productArea{
}
#content #productArea:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content #productArea .leftSide{
	float:left;
	width: 435px;
	height: 108px;
	background: #000;
	padding-left: 18px;
	padding-right: 22px;
	padding-top: 15px;
	line-height:0;
}
#content #productArea.leftSide:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content #productArea .rightSide{
	float:left;
	width: 445px;
	height: 108px;
	background: #000;
	padding-left: 18px;
	padding-right: 12px;
	padding-top: 15px;
	line-height:0;
}
#content #productArea.rightSide:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content #productArea .innarLeft{
	width:180px;
	float: left;
	height: 108px;
}
#content #productArea .innarLeft .copy{
	float:left;
	width:170px;
	height: 46px;
}
#content #productArea .leftSide .innarRight{
	width:190px;
	height: 95px;
	float: right;
	text-align: right;
	margin-top: 10px;
}
#content #productArea .rightSide .innarRight{
	width:190px;
	height: 95px;
	float: right;
	text-align: right;
	margin-top: -5px;
}
#content #productArea span {
display: block;
font-size: 1em;
clear: both;
background: url(../images/btn-product.gif) 0 0 no-repeat;
width: 80px;
height: 21px;
padding:1px 0 0 17px;
margin-top: 15px;
float:left;
line-height:1.5;
}

@media screen and (max-width: 640px) {
#content #productArea{
	background-color: #000;
}
#content #productArea .leftSide{
	float:left;
	width: 50%;
	height: auto;
	background: #000;
	padding:0;
}
#content #productArea .rightSide{
	float:left;
	width: 50%;
	height: auto; 
	background: #000;
	padding:0;
}
#content #productArea .innarLeft{
	width: 70%;
	float: left;
	height: auto;
	padding-left:15px;
	padding-bottom: 5%;
}
#content #productArea .leftSide .innarRight{
	display:none;
}
#content #productArea .rightSide .innarRight{
	display:none;
}
#content #productArea .innarLeft .copy{
	float:left;
	margin-top: 12px;
	width: 100%;
	height: auto;
}
#content #productArea .innarLeft .copy img{
	width:90%;
	height:auto;
}
#content #productArea span {
	margin-left:0px;
	margin-top: 8%;
}
#content #productArea span {
line-height:1.4;
}
}

/*---------- #snsArea ----------*/

#content #snsArea{
	width:273px;
	height:88px;
	margin: 0 auto;
	padding-top: 30px;
}
#content #snsArea:after {
	content:'';
	display:block;
	clear:both;
	height:0;
}
#content #snsArea ul{
	width:273px;
	height:88px;
}
#content #snsArea ul li{
	float: left;
	width: 130px;
	height: 88px;
	margin:0 3px;
	display: inline;
}
#content #snsArea ul li a{
	float: left;
	width: 130px;
	height: 88px;
	display: block;
}