/* ==================================================================================================================================
 voice/index.html
================================================================================================================================== */

/* ================================================================================
 voicePc / voiceSp
================================================================================ */
#voicePc {
	display:block;
}
#voiceSp {
	display:none;
}
/* ================================================================================
 contentsArea
================================================================================ */
#contentsArea {
	background:url(../../culture/voice/img/voice_body_bg.png) center top;
	background-attachment:fixed;
}

/* ================================================================================
 voice_h1
================================================================================ */
.voice_h1{
	padding:110px 0 0;
	position:relative;
	overflow:hidden;
}
#headlogo{
	width:425px;
	height:425px;
	padding-top:110px;
	margin:0 auto;
	margin-bottom:20px;
	position:relative;
	box-sizing:border-box;
}
#headlogo>*{
	position:absolute;
	left:0; top:0;
}
#headlogo_txt_eng{
	opacity:0;
}
#headlogo_circ{
	opacity:0;
}
#headlogo_tensen{
	opacity:0;
}
.headlogo_char{
	opacity:0;
}
#headlogo_char1{width:25.87238095%;height:24.98928571%;left:37.50428571%;top:15.5147619%;}
#headlogo_char2{width:24.5047619%;height:23.67857143%;left:27.17380952%;top:39.5147619%;}
#headlogo_char3{width:26.21452381%;height:25.78714286%;left:37.25380952%;top:57.73833333%;}
#headlogo_txt_anc{width:40%;height:9.153333333%;left:52.63833333%;top:45.65309524%;}
#headlogo_txt_anc{
	overflow:hidden;
}
#headlogo_txt_anc_img{
	height:100%;
	display:block;
	opacity:0;
}

/* ----------------------------------------
 headtxt
---------------------------------------- */
#headtxt{
	margin:0 auto;
	margin-bottom:90px;
	text-align:center;
	opacity:0;
}
#headtxt.anim{
	-webkit-animation:	slideinBtoT_headtxt 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s 1 normal forwards;
	animation:			slideinBtoT_headtxt 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s 1 normal forwards;
}
/* slideinBtoT_headtxt */
@-webkit-keyframes slideinBtoT_headtxt{
	0%{		-webkit-transform:translate3d(0px,75%,0px);	opacity:0;}
	100%{	-webkit-transform:translate3d(0px,0px,0px);		opacity:1;}
}
@keyframes slideinBtoT_headtxt{
	0%{		transform:translate3d(0px,75%,0px);	opacity:0;}
	100%{	transform:translate3d(0px,0px,0px);		opacity:1;}
}

/* ================================================================================
 h2
================================================================================ */
h2 {
	text-align:center;
	padding-top:85px;
	position:relative;
	background-repeat:no-repeat;
	background-position:0px 34px;
	background-size:100% 2px;
	overflow:hidden;
}
h2.anim{
	-webkit-animation:	fadein 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s 1 normal forwards;
	animation:			fadein 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s 1 normal forwards;
}
h2 .qicon{
	height:66px;
	margin:auto;
	display:block;
	position:absolute;
	left:0; right:0; top:0;
	opacity:0;
}
h2.anim .qicon{
	-webkit-animation:	roundZoomIn_qicon 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s 1 normal forwards;
	animation:			roundZoomIn_qicon 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s 1 normal forwards;
}
@-webkit-keyframes roundZoomIn_qicon{
	0%{
		-webkit-transform:scale(0) rotateZ(-360deg);
		opacity:0;
	}
	100%{
		-webkit-transform:scale(1) rotateZ(0);
		opacity:1;
	}
}
@keyframes roundZoomIn_qicon{
	0%{
		transform:scale(0) rotateZ(-360deg);
		opacity:0;
	}
	100%{
		transform:scale(1) rotateZ(0);
		opacity:1;
	}
}
h2 .txt{
	margin:0 auto;
	display:block;
	opacity:0;
}
h2.anim .txt{
	-webkit-animation:	slideinInsideBtoT_qtxt 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s 1 normal forwards;
	animation:			slideinInsideBtoT_qtxt 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s 1 normal forwards;
}
@-webkit-keyframes slideinInsideBtoT_qtxt{
	0%{		-webkit-transform:translate3d(0,100%,0);	opacity:0;}
	100%{	-webkit-transform:translate3d(0,0,0);		opacity:1;}
}
@keyframes slideinInsideBtoT_qtxt{
	0%{		transform:translate3d(0,100%,0);	opacity:0;}
	100%{	transform:translate3d(0,0,0);		opacity:1;}
}

/* ================================================================================
 Q1-4
================================================================================ */
.Q1,.Q2,.Q3,.Q4{
	overflow:hidden;
}


/* ================================================================================
 section
================================================================================ */
#voicePc section {
	width:960px;
	margin:0 auto 0 auto;
	position:relative;
}
#voicePc section p {
	position:absolute;
}



/* ==================================================================================================================================
 for PC
================================================================================================================================== */

/* ================================================================================
 Q1
================================================================================ */
#voicePc .Q1 {
	height:760px;
}
#voicePc .Q1 h2 {
	background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
}
/*Q1-01*/
#pc_Q1_01 {
	left:0px;
	top:48px;
}
/*Q1-02*/
#pc_Q1_02 {
	width:362px;
	height:214px;
	left:590px;
	top:76px;
}
/*Q1-03*/
#pc_Q1_03 {
	left:10px;
	top:362px;
}
/*Q1-04*/
#pc_Q1_04 {
	left:469px;
	top:352px;
}
/*Q1-05*/
#pc_Q1_05 {
	left:881px;
	top:419px;
}

/* ================================================================================
 Q2
================================================================================ */
#voicePc .Q2 {
	height:1358px;
}
#voicePc .Q2 h2 {
	background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
}
/*Q2-01*/
#pc_Q2_01 {
	left:0px;
	top:68px;
}
/*Q2-02*/
#pc_Q2_02 {
	left:203px;
	top:373px;
}
/*Q2-03*/
#pc_Q2_03 {
	left:0px;
	top:366px;
}
/*Q2-04*/
#pc_Q2_04 {
	left:208px;
	top:574px;
}
/*Q2-05*/
#pc_Q2_05 {
	left:199px;
	top:769px;
}
/*Q2-06*/
#pc_Q2_06 {
	left:451px;
	top:761px;
}
/*Q2-07*/
#pc_Q2_07 {
	left:856px;
	top:76px;
}
/*Q2-08*/
#pc_Q2_08 {
	left:672px;
	top:544px;
}
/*Q2-09*/
#pc_Q2_09 {
	left:6px;
	top:995px;
}
/*Q2-10*/
#pc_Q2_10 {
	left:633px;
	top:1000px;
}

/* ================================================================================
 Q3
================================================================================ */
#voicePc .Q3 {
	height:1056px;
}
#voicePc .Q3 h2 {
	background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
}
/*Q3-01*/
#pc_Q3_01 {
	left:0px;
	top:75px;
}
/*Q3-02*/
#pc_Q3_02 {
	left:231px;
	top:75px;
}
/*Q3-03*/
#pc_Q3_03 {
	left:227px;
	top:320px;
}
/*Q3-04*/
#pc_Q3_04 {
	left:430px;
	top:328px;
}
/*Q3-05*/
#pc_Q3_05 {
	left:430px;
	top:632px;
}
/*Q3-06*/
#pc_Q3_06 {
	left:860px;
	top:75px;
}

/* ================================================================================
 Q4
================================================================================ */
#voicePc .Q4 {
	height:735px;
}
#voicePc .Q4 h2 {
	background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
}
/*Q4-01*/
#pc_Q4_01 {
	left:7px;
	top:64px;
}
/*Q4-02*/
#pc_Q4_02 {
	left:7px;
	top:281px;
}
/*Q4-03*/
#pc_Q4_03 {
	left:132px;
	top:277px;
}
/*Q4-04*/
#pc_Q4_04 {
	left:132px;
	top:370px;
}
/*Q4-05*/
#pc_Q4_05 {
	left:900px;
	top:55px;
}
/*Q4-06*/
#pc_Q4_06 {
	left:482px;
	top:264px;
}


/* ==================================================================================================================================
 for SMARTPHONE
================================================================================================================================== */
@media screen and (max-width: 480px) {
	
	/*==============================	
	voice/index.html
	==============================*/
	#voicePc {
		display:none;
	}
	#voiceSp {
		display:block;
	}
	
	/* ----------------------------------------
	 contentsArea
	---------------------------------------- */
	#contentsArea {
		background-size:182px auto;
	}
	
	/* ----------------------------------------
	 headlogo
	---------------------------------------- */
	.voice_h1{
		padding:60px 0 0;
	}
	#headlogo{
		width:242px;
		height:242px;
		padding-top:53px;
		margin:0 auto;
		margin-bottom:15px;
	}
	#headlogo_txt_anc_img{
		width:auto;
		height:100%;
	}
	/* ----------------------------------------
	 headtxt
	---------------------------------------- */
	#headtxt{
		width: 325px;
		padding:0;
		margin-top:0 auto;
		margin-bottom:60px;
		text-align:center;
		opacity:0;
	}
	#headtxt.anim{
		-webkit-animation:	slideinBtoT_headtxt 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s 1 normal forwards;
		animation:			slideinBtoT_headtxt 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s 1 normal forwards;
	}
	/* ----------------------------------------
	 h2
	---------------------------------------- */
	h2 {
		background-position:0px 35px;
	}
	h2 .qicon{
		height:69px;
	}
	h2 .txt{
		margin:0 auto;
		display:block;
		opacity:0;
	}
	/* ----------------------------------------
	 section
	---------------------------------------- */
	#voiceSp section {
	}
	#voiceSp section p {
		margin-left:auto;
		margin-right:auto;
	}
	#voiceSp section p img {
		display:block;
	}
	
	/* ----------------------------------------
	 Q1
	---------------------------------------- */
	#voiceSp .Q1 {
		padding-bottom:60px;
	}
	#voiceSp .Q1 h2 {
		background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
	}
	#voiceSp .Q1 h2 .txt {
		width:252px;
	}
	/*Q1-01*/
	#sp_Q1_01 {
		width:289px;
		margin-top:37px;
	}
	/*Q1-02*/
	#sp_Q1_02 {
		width:240px;
		margin-top:38px;
	}
	/*Q1-03*/
	#sp_Q1_03 {
		width:271px;
		margin-top:43px;
	}
	/*Q1-04*/
	#sp_Q1_04 {
		width:240px;
		margin-top:47px;
	}
	/*Q1-05*/
	#sp_Q1_05 {
		width:70px;
		margin-top:47px;
	}
	
	/* ----------------------------------------
	 Q2
	---------------------------------------- */
	#voiceSp .Q2 {
		padding-bottom:60px;
	}
	#voiceSp .Q2 h2 {
		background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
	}
	#voiceSp .Q2 h2 img {
		width:193px;
	}
	/*Q2-01*/
	#sp_Q2_01 {
		width:246px;
		margin-top:45px;
	}
	/*Q2-02*/
	#sp_Q2_02 {
		width:337px;
		margin-top:37px;
	}
	/*Q2-03*/
	#sp_Q2_03 {
		width:275px;
		margin-top:36px;
	}
	/*Q2-04*/
	#sp_Q2_04 {
		width:340px;
		margin-top:35px;
	}
	/*Q2-05*/
	#sp_Q2_05 {
		width:240px;
		margin-top:45px;
	}
	/*Q2-06*/
	#sp_Q2_06 {
		width:338px;
		margin-top:43px;
	}
	/*Q2-07*/
	#sp_Q2_07 {
		width:303px;
		margin-top:47px;
	}
	/*Q2-08*/
	#sp_Q2_08 {
		width:338px;
		margin-top:50px;
	}
	/*Q2-09*/
	#sp_Q2_09 {
		width:311px;
		margin-top:40px;
	}
	/*Q2-10*/
	#sp_Q2_10 {
		width:289px;
		margin-top:42px;
	}
	
	/* ----------------------------------------
	 Q3
	---------------------------------------- */
	#voiceSp .Q3 {
		padding-bottom:60px;
	}
	#voiceSp .Q3 h2 {
		background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
	}
	#voiceSp .Q3 h2 img {
		width:322px;
	}
	/*Q3-01*/
	#sp_Q3_01 {
		width:330px;
		margin-top:50px;
	}
	/*Q3-02*/
	#sp_Q3_02 {
		width:290px;
		margin-top:40px;
	}
	/*Q3-03*/
	#sp_Q3_03 {
		width:333px;
		margin-top:42px;
	}
	/*Q3-04*/
	#sp_Q3_04 {
		width:290px;
		margin-top:45px;
	}
	/*Q3-05*/
	#sp_Q3_05 {
		width:334px;
		margin-top:44px;
	}
	/*Q3-06*/
	#sp_Q3_06 {
		width:334px;
		margin-top:44px;
	}
	
	/* ----------------------------------------
	 Q4
	---------------------------------------- */
	#voiceSp .Q4 {
		padding-bottom:60px;
	}
	#voiceSp .Q4 h2 {
		background-image:url(../../culture/voice/img/voice_q1_ttl_line.png);
	}
	#voiceSp .Q4 h2 img {
		width:251px;
	}
	/*Q4-01*/
	#sp_Q4_01 {
		width:328px;
		margin-top:40px;
	}
	/*Q4-02*/
	#sp_Q4_02 {
		width:222px;
		margin-top:30px;
	}
	/*Q4-03*/
	#sp_Q4_03 {
		width:170px;
		margin-top:38px;
	}
	/*Q4-04*/
	#sp_Q4_04 {
		width:240px;
		margin-top:35px;
	}
	/*Q4-05*/
	#sp_Q4_05 {
		width:280px;
		margin-top:44px;
	}
	/*Q4-06*/
	#sp_Q4_06 {
		width:208px;
		margin-top:38px;
	}
	
}