/* CSS Document */
/*==============================	
interview/index.html
one-day/index.html
==============================*/
/*----------------------------------------
h1
----------------------------------------*/
h1 {
	background:url(../../work/common/interview_ttl_h1.png) center center no-repeat, url(../../work/common/work_ttl_bg.png) center top;
	background-size:206px auto, auto auto;
	height:107px;
	text-indent:-10000px;
}


/*----------------------------------------
visualArea
----------------------------------------*/
#visualArea {
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url(../../work/common/interview_h1_bg.jpg);
	height:550px;
	position:relative;
}
#visualArea>div {
	width:960px;
	margin:0 auto 0 auto;
	position:relative;
	height:550px;
	background-position:right top;
	background-repeat:no-repeat;
}
#visualArea>div img {
	display:block;
}

/*PERSON*/
#visualArea>div p:nth-child(1) {
	padding-top:120px;
}
/*lead text*/
#visualArea>div h2:nth-child(2) {
	padding-top:25px;
}
/*direction*/
#visualArea>div p:nth-child(3) {
	padding-top:40px;
}
/*PROFILE title*/
#visualArea>div p:nth-child(4) {
	padding-top:55px;
	
	display:none;
	
}
/*PROFILE text*/
#visualArea>div p:nth-child(5) {
	padding-top:12px;
	font-size:13px;
	width:390px;
}


/*prev, next*/
#visualArea .prev,
#visualArea .next {
	position:absolute;
	top:calc(50% - 40px);
	width:80px;
	height:80px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:auto 60px;
	text-indent:-10000px;
	border-radius:100px;
	outline:none;
	
	transition: background-color 0.3s ease-out;
}
#visualArea .prev {
	left:5px;
	background-image:url(../../work/common/interview_arw_prev.png);
}
#visualArea .next {
	right:5px;
	background-image:url(../../work/common/interview_arw_next.png);
}

#visualArea .prev:hover,
#visualArea .next:hover {
	/*background-color:rgba(33,68,84,0.1);*/
}





#person01 #visualArea>div {
	background-image:url(../../work/interview01/img/person01_main_ttl_pht.png);
}
#person02 #visualArea>div {
	background-image:url(../../work/interview02/img/person02_main_ttl_pht.png);
}
#person03 #visualArea>div {
	background-image:url(../../work/interview03/img/person03_main_ttl_pht.png);
}


/*----------------------------------------
personNav
----------------------------------------*/
.personNav {
	width:960px;
	margin:63px auto 0 auto;
	height:90px;
	position:relative;
}
.personNav ul li {
	position:absolute;
	top:0;
	left:0;
	width:50%;
}
.personNav ul li:last-child {
	left:50%;
}
.personNav ul li a {
	display:block;
	border:3px #214454 solid;
	height:90px;
	text-indent:-10000px;
	box-sizing:border-box;
	transition:background-color 0.3s ease-out;
	position:relative;
}
.personNav ul a:hover {
	background-color:#eee !important;
}

/*tab
------------------------------------*/
.personNav ul li a {
	background-position:center top 20px, center top 35px, center top 74px;
	background-repeat:no-repeat;
	background-size:52px auto, auto 24px, 6px auto;
}
/*navBtm*/
#navBtm.personNav {
	margin-top:100px;
	padding-bottom:100px;
}
#navBtm.personNav ul li a {
	background-position:center top 31px, center top 45px, center top 13px;
}

/*tab - message -
------------------------------------*/
/*off*/
.personNav ul li:first-child a {
	background-image:url(../../work/common/interview_nav_01_a_off.png), url(../../work/common/interview_nav_01_b_off.png), url(../../work/common/interview_nav_arw_btm_off.png);
}
#navBtm.personNav ul li:first-child a {
	background-image:url(../../work/common/interview_nav_01_a_off.png), url(../../work/common/interview_nav_01_b_off.png), url(../../work/common/interview_nav_arw_up_off.png);
}
/*on*/
.interview .personNav ul li:first-child a {
	background-image:url(../../work/common/interview_nav_01_a_on.png), url(../../work/common/interview_nav_01_b_on.png), url(../../work/common/interview_nav_arw_btm_on.png);
	background-color:#214454;
	pointer-events: none;
}
.interview #navBtm.personNav ul li:first-child a {
	background-image:url(../../work/common/interview_nav_01_a_on.png), url(../../work/common/interview_nav_01_b_on.png), url(../../work/common/interview_nav_arw_up_on.png);
}

/*tab  - in focus -
------------------------------------*/
/*off*/
.personNav ul li:last-child a {
	background-image:url(../../work/common/interview_nav_02_a_off.png), url(../../work/common/interview_nav_02_b_off.png), url(../../work/common/interview_nav_arw_btm_off.png);
}
#navBtm.personNav ul li:last-child a {
	background-image:url(../../work/common/interview_nav_02_a_off.png), url(../../work/common/interview_nav_02_b_off.png), url(../../work/common/interview_nav_arw_up_off.png);
}
/*on*/
.focus .personNav ul li:last-child a {
	background-image:url(../../work/common/interview_nav_02_a_on.png), url(../../work/common/interview_nav_02_b_on.png), url(../../work/common/interview_nav_arw_btm_on.png);
	background-color:#214454;
	pointer-events: none;
}
.focus #navBtm.personNav ul li:last-child a {
	background-image:url(../../work/common/interview_nav_02_a_on.png), url(../../work/common/interview_nav_02_b_on.png), url(../../work/common/interview_nav_arw_up_on.png);
}


/*----------------------------------------
qaArea
----------------------------------------*/
.qaArea {
	width:960px;
	margin:80px auto 0 auto;
}
.qaArea div h3 {
	font-size:23px;
	font-weight:normal;
	color:#214454;
	letter-spacing:1px;
	padding-bottom:30px;
}
.qaArea div .pht {
	margin-top:55px;
}


.qaArea div {
	background-repeat:no-repeat;
}

/*Q1*/
.qaArea div:nth-child(1) {
	min-height:400px;
	padding-left:230px;
	background-image:url(../../work/common/interview_ttl_q1_mark.png), url(../../work/common/interview_ttl_q1_txt.png), url(../../work/common/interview_ttl_q_line.png);
	background-size:64px auto, 20px auto, 1px 345px;
	background-position:37px 0px, 59px 80px, 0px 0px;
}

/*Q2*/
.qaArea div:nth-child(2) {
	margin-top:110px;
	min-height:345px;
	padding-right:230px;
	background-image:url(../../work/common/interview_ttl_q2_mark.png), url(../../work/common/interview_ttl_q2_txt.png), url(../../work/common/interview_ttl_q_line.png);
	background-size:64px auto, 20px auto, 1px 345px;
	background-position:right 37px top 0px, right 59px top 80px, right 0px top 0px;
}

/*Q3*/
.qaArea div:nth-child(3) {
	margin-top:110px;
	min-height:410px;
	padding-left:230px;
	background-image:url(../../work/common/interview_ttl_q3_mark.png), url(../../work/common/interview_ttl_q3_txt.png), url(../../work/common/interview_ttl_q_line.png);
	background-size:64px auto, 20px auto, 1px 410px;
	background-position:37px 0px, 59px 80px, 0px 0px;
}

/*Q4*/
.qaArea div:nth-child(4) {
	margin-top:110px;
	min-height:360px;
	padding-right:230px;
	background-image:url(../../work/common/interview_ttl_q4_mark.png), url(../../work/common/interview_ttl_q4_txt.png), url(../../work/common/interview_ttl_q_line.png);
	background-size:64px auto, 20px auto, 1px 360px;
	background-position:right 37px top 0px, right 59px top 80px, right 0px top 0px;
}


/*----------------------------------------
timeArea
----------------------------------------*/
.timeArea {
	width:960px;
	margin:80px auto 0 auto;
}
.timeArea div h3 {
	font-size:23px;
	font-weight:normal;
	color:#214454;
	letter-spacing:1px;
	padding-bottom:10px;
}



.timeArea div {
	padding-left:240px;
	padding-bottom:70px;
	margin-top:10px;
	position:relative;
	background-repeat:no-repeat;
	background-size:40px auto, auto 18px, 10px auto, 10px 1000px;
	background-position:0px 0px, 45px 11px, 16px bottom, 16px 48px;
}
.timeArea div:last-child {
	padding-bottom:20px;
}

.timeArea div.pht {
	padding-right:460px;
	min-height:285px;
}
.timeArea div.pht p:last-child {
	position:absolute;
	right:0px;
	top:0px;
}



/*person01 time
------------------------------------*/
/*time 01*/
#person01 .timeArea div:nth-child(1) {
	background-image:url(../../work/common/person_time_0830_img.png), url(../../work/common/person_time_0830_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 02*/
#person01 .timeArea div:nth-child(2) {
	background-image:url(../../work/common/person_time_0930_img.png), url(../../work/common/person_time_0930_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 03*/
#person01 .timeArea div:nth-child(3) {
	background-image:url(../../work/common/person_time_1000_img.png), url(../../work/common/person_time_1000_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 04*/
#person01 .timeArea div:nth-child(4) {
	background-image:url(../../work/common/person_time_1100_img.png), url(../../work/common/person_time_1100_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 05*/
#person01 .timeArea div:nth-child(5) {
	background-image:url(../../work/common/person_time_1200_img.png), url(../../work/common/person_time_1200_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 06*/
#person01 .timeArea div:nth-child(6) {
	background-image:url(../../work/common/person_time_1300_img.png), url(../../work/common/person_time_1300_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 07*/
#person01 .timeArea div:nth-child(7) {
	background-image:url(../../work/common/person_time_1500_img.png), url(../../work/common/person_time_1500_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 08*/
#person01 .timeArea div:nth-child(8) {
	background-image:url(../../work/common/person_time_1800_img.png), url(../../work/common/person_time_1800_txt.png);
}


/*person02 time
------------------------------------*/
/*time 01*/
#person02 .timeArea div:nth-child(1) {
	background-image:url(../../work/common/person_time_0830_img.png), url(../../work/common/person_time_0830_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 02*/
#person02 .timeArea div:nth-child(2) {
	background-image:url(../../work/common/person_time_0900_img.png), url(../../work/common/person_time_0900_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 03*/
#person02 .timeArea div:nth-child(3) {
	background-image:url(../../work/common/person_time_1000_img.png), url(../../work/common/person_time_1000_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 04*/
#person02 .timeArea div:nth-child(4) {
	background-image:url(../../work/common/person_time_1200_img.png), url(../../work/common/person_time_1200_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 05*/
#person02 .timeArea div:nth-child(5) {
	background-image:url(../../work/common/person_time_1300_img.png), url(../../work/common/person_time_1300_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 06*/
#person02 .timeArea div:nth-child(6) {
	background-image:url(../../work/common/person_time_1700_img.png), url(../../work/common/person_time_1700_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 07*/
#person02 .timeArea div:nth-child(7) {
	background-image:url(../../work/common/person_time_1800_img.png), url(../../work/common/person_time_1800_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 08*/
#person02 .timeArea div:nth-child(8) {
	background-image:url(../../work/common/person_time_1900_img.png), url(../../work/common/person_time_1900_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}


/*person03 time
------------------------------------*/
/*time 01*/
#person03 .timeArea div:nth-child(1) {
	background-image:url(../../work/common/person_time_0900_img.png), url(../../work/common/person_time_0900_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 02*/
#person03 .timeArea div:nth-child(2) {
	background-image:url(../../work/common/person_time_1000_img.png), url(../../work/common/person_time_1000_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 03*/
#person03 .timeArea div:nth-child(3) {
	background-image:url(../../work/common/person_time_1200_img.png), url(../../work/common/person_time_1200_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 04*/
#person03 .timeArea div:nth-child(4) {
	background-image:url(../../work/common/person_time_1400_img.png), url(../../work/common/person_time_1400_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 05*/
#person03 .timeArea div:nth-child(5) {
	background-image:url(../../work/common/person_time_1600_img.png), url(../../work/common/person_time_1600_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 06*/
#person03 .timeArea div:nth-child(6) {
	background-image:url(../../work/common/person_time_1730_img.png), url(../../work/common/person_time_1730_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}

/*time 07*/
#person03 .timeArea div:nth-child(7) {
	background-image:url(../../work/common/person_time_1800_img.png), url(../../work/common/person_time_1800_txt.png), url(../../work/common/interview_time_arw.png), url(../../work/common/interview_time_arw_line.png);
}










/*==========================================================================================	
for SMARTPHONE
==========================================================================================*/

@media screen and (max-width: 480px) {


/*==============================	
interview/index.html
one-day/index.html
==============================*/
/*----------------------------------------
h1
----------------------------------------*/
h1 {
	background:url(../../work/common/interview_ttl_h1.png) center center no-repeat, url(../../work/common/work_ttl_bg.png) center top;
	background-size:150px auto, auto auto;
	height:82px;
	text-indent:-10000px;
}


/*----------------------------------------
visualArea
----------------------------------------*/
#visualArea {
	background-position:80% top;
	background-repeat:no-repeat;
	background-size:auto 260px;
	height:auto;
	position:relative;
	min-width:100%;
}
#visualArea>div {
	width:100%;
	margin:0 auto 0 auto;
	position:relative;
	height:390px;
	background-position:right 20px top;
	background-repeat:no-repeat;
	background-size:auto 260px;
}
#visualArea>div img {
	display:block;
}

/*PERSON*/
#visualArea>div p:nth-child(1) {
	padding-top:0px;
	position:absolute;
	top:70px;
	left:55px;
	width:72px;
	border-bottom:1px #214454 solid;
	padding-bottom:7px;
}
/*lead text*/
#visualArea>div h2:nth-child(2) {
	padding-top:0px;
	position:absolute;
	top:285px;
	left:5%;
	width:95%;
}
/*direction*/
#visualArea>div p:nth-child(3) {
	padding-top:0px;
	position:absolute;
	top:110px;
	left:55px;
	width:72px;
}
/*PROFILE title*/
#visualArea>div p:nth-child(4) {
	
	display:none;
	
}
/*PROFILE text*/
#visualArea>div p:nth-child(5) {
	padding-top:0px;
	position:absolute;
	top:170px;
	left:55px;
	font-size:13px;
	width:auto;
	margin:0 auto 0 auto;
	line-height:1.5;
}


/*prev, next*/
#visualArea .prev,
#visualArea .next {
	position:absolute;
	top:110px;
	width:40px;
	height:40px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:auto 30px;
	text-indent:-10000px;
	border-radius:100px;
	
	transition: background-color 0.3s ease-out;
}
#visualArea .prev {
	left:5px;
	background-image:url(../../work/common/interview_arw_prev.png);
}
#visualArea .next {
	right:5px;
	background-image:url(../../work/common/interview_arw_next.png);
}

#visualArea .prev:hover,
#visualArea .next:hover {
	background-color:rgba(33,68,84,0.1);
}





/*----------------------------------------
personNav
----------------------------------------*/
.personNav {
	width:90%;
	margin:0px auto 0 auto;
	height:75px;
	position:relative;
}
.personNav ul li {
	position:absolute;
	top:0;
	left:0;
	width:50%;
}
.personNav ul li:last-child {
	left:50%;
}
.personNav ul li a {
	display:block;
	border:2px #214454 solid;
	height:75px;
	text-indent:-10000px;
	box-sizing:border-box;
	transition:background-color 0.3s ease-out;
	position:relative;
}
.personNav ul a:hover {
	background-color:#eee !important;
}

/*tab
------------------------------------*/
.personNav ul li a {
	background-position:center top 16px, center top 32px, center top 58px;
	background-repeat:no-repeat;
	background-size:61px auto, auto 16px, 5px auto;
}
/*navBtm*/
#navBtm.personNav {
	margin-top:50px;
	padding-bottom:50px;
}
#navBtm.personNav ul li a {
	background-position:center top 25px, center top 40px, center top 10px;
}



/*----------------------------------------
qaArea
----------------------------------------*/
.qaArea {
	width:90%;
	margin:45px auto 0 auto;
	font-size:14px;
}
.qaArea div h3 {
	font-size:17px;
	font-weight:normal;
	color:#214454;
	letter-spacing:1px;
	padding-bottom:20px;
}
.qaArea div .pht {
	display:none;
}


.qaArea div {
	background-repeat:no-repeat;
	min-height:inherit !important;
	padding-left:50px !important;
	padding-right:0 !important;
	background-size:25px auto, 15px auto !important;
	background-position:3px 0px, 8px 33px !important;
}

/*Q1*/
.qaArea div:nth-child(1) {
	background-image:url(../../work/common/interview_ttl_q1_mark.png), url(../../work/common/interview_ttl_q1_txt.png);
}

/*Q2*/
.qaArea div:nth-child(2) {
	margin-top:50px;
	background-image:url(../../work/common/interview_ttl_q2_mark.png), url(../../work/common/interview_ttl_q2_txt.png);
}

/*Q3*/
.qaArea div:nth-child(3) {
	margin-top:50px;
	background-image:url(../../work/common/interview_ttl_q3_mark.png), url(../../work/common/interview_ttl_q3_txt.png);
}

/*Q4*/
.qaArea div:nth-child(4) {
	margin-top:50px;
	background-image:url(../../work/common/interview_ttl_q4_mark.png), url(../../work/common/interview_ttl_q4_txt.png);
}


/*----------------------------------------
timeArea
----------------------------------------*/
.timeArea {
	width:90%;
	margin:45px auto 0 auto;
	font-size:14px;
}
.timeArea div h3 {
	font-size:17px;
	font-weight:normal;
	color:#214454;
	letter-spacing:1px;
	padding-bottom:5px;
}



.timeArea div {
	padding-left:50px;
	padding-bottom:35px;
	margin-top:7px;
	position:relative;
	background-repeat:no-repeat;
	background-size:27px auto, auto 9px, 5px auto, 5px 1000px;
	background-position:4px 0px, 0px 32px, 15px bottom, 15px 50px;
}


.timeArea div.pht {
	padding-right:0px;
	min-height:inherit;
}
.timeArea div.pht p:last-child {
	position:static;
	right:0px;
	top:0px;
	margin-top:20px;
}







}
