@charset "utf-8";
/* CSS Document */
#page{
	margin: 0;
	padding: 0;
	color: #222;
	background-attachment: fixed;
	background-size: cover;
	font-family: "Noto Sans Japanese","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","Osaka","ＭＳ Ｐゴシック", "MS P Gothic",Verdana,Arial, Helvetica, sans-serif; 
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}
.width{
	width:960px;
	margin:0 auto;
}


#logo_in{
	width:350px;
	margin:0 auto !important;
	float:left;
}
#btn_top{
	margin:5px auto 0 !important;
	float:right;
	border:1px solid #0115a0;
	font-size:17px;
	text-align: center;
	width:300px;
	padding:16px;
	color:#0115a0;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
}
#btn_top a{
	color:#fff !important;
	text-decoration:none;
}

#btn_top:hover{
	border:1px solid #0115a0;
	background:#0115a0;
	text-align: center;
	width:300px;
	padding:16px;
	margin-top:20px;
	color:#fff !important;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
}
#btn_top a:hover{
	color:#0115a0 !important;
	text-decoration:none;
}
.width{
	width:960px;
	margin:0 auto;
}

#title{
	background:#4d5279;
	width:100%;
	color:#fff;
	font-weight:bold;
	text-align:center;
	font-size:28px;
	padding:88px 0 0;
}
#title p{
	font-size:17px;
	padding:10px 0 15px;
	text-align:center;
}

#title_txt{
	text-align:center;
	font-size:18px;
	padding:10px 0 15px;
	line-height:150%;
	font-weight: bold;
	color: #e40046;
}
#menu{
	text-align:center;
	width:960px;
	margin:20px auto;
	overflow:hidden;
}
#menu li{
	float:left;
	border:1px solid #4d5279;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
	width: calc((100% - 30px)/3);
	color: #4d5279;
	padding:8px 0;
	font-size:19px;
	background: #fff;
}
#menu li:hover{
	background:#4d5279;
	color:#fff;
}

.menu_s{
	margin-left:12px;
}
#menu ul{
	margin:8px 0;
}
#field{
	background:url("../img/interview/back.png") no-repeat center center;
	width:960px;
	margin:40px auto;
	overflow:hidden;

}
.field_left{
	width:440px;
	border:1px solid #8689a3;
	text-align:center;
	float:left;
	background-color: rgba(255 , 255 , 255 , 0.6);
	margin-bottom:30px;
}
.field_left img{

}
.field_right{
	width:440px;
	border:1px solid #8689a3;
	text-align:center;
	float:right;
	background-color: rgba(255 , 255 , 255 , 0.6);
	margin-bottom:30px;
}
.cate{
	font-weight:bold;
	font-size:32px;
	margin:20px 0;
	color: #4d5279;
	text-align:center;
}
.name{
	font-size:18px;
	margin-bottom:10px;
	font-weight:bold;
	text-align:center;
}
.name_in{
	font-size:18px;
	padding:0 30px;
	margin-bottom:15px;
	text-align:left;
	line-height:150%;
	margin: 5px 15px 15px;
}
.btn{
	border:1px solid #4d5279;
	background:#4d5279;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
	color: #fff;
	font-size:16px;
	padding:8px;
	width:230px;
	margin:0 auto 25px;
}
a .btn{
	text-decoration: none !important;
}
#human{	
	position: absolute;
	top:230px;
	left: 0;
	right: 28px;
	bottom: 0;
	margin: auto;
	height:313px;
	width:242px;
}
.interview_img{
text-align:center;
}


@media only screen and (min-width: 641px){
#menu_sp{
	display:none;
}
}

@media only screen and (max-width: 640px){
#logo{
	padding:0 0 10px 0;
}
#logo img{
	width:100%;
}
#logo_in{
	padding:10px;
	width:70%;
}
#menu,#field,#logo,.width{
	width:100%;
}
#btn_top,#btn_top:hover{
	width:90%;
	padding:15px;
}
.field_left,.field_right{
	width:96%;
	margin:10px 2%;
}
.name_in{
	line-height:150%;
}
#title_txt{
	font-size:16px;
	padding:10px 0;
}
#title_in p{
	font-style: italic !important; 
}
#title_in{
	font-size:90%;
}
#menu{
	display:none;
}
#menu_sp{
	overflow:hidden;
}
#menu_sp li{
	float:left;
	border:1px solid #01083e;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
	width: calc((100% - 30px)/3);
	color: #01083e;
	padding:8px 0;
	font-size:15px;
}
#menu_sp li:hover{
	background:#01083e;
	color:#fff;
}
#menu_sp li{
	width: calc((100% - 3%)/2);
	text-align:center;
}
#menu_sp ul{
	margin-top:5px;
}
.menu_s{
	margin-left:1%;
}
#field{
}
.cate{
	margin-bottom:0;
	font-size:27px;
}
.name{
	margin-bottom:0;
	padding:1%;
}
#human{
	display:none;
}
#field{
	margin:20px 0;
}
.name_in{
	padding:0 5px;
}
.interview_img img{
	width:50%;
}
#title{
	padding:17px 0 0;
}
#title p{
	font-size:15px;
}
}


@media only screen and (min-width: 641px) and (max-width: 960px) {
	
#logo{
	width:100%;
}
.width{
	width:98%;
}
#human{
	display:none;
}
#field{
	width:100%;
}
#menu{
	width:98%;
}
#menu ul li{
	font-size:18px;
}
.field_left,.field_right{
	width:49%;	
}
#title_txt{
	line-height:130%;
}
.cate{
	font-size:28px;
}
.name_in{
	line-height:130%;
}
}