@charset "UTF-8";

#tit_area{
background: url("../images/main_recruit.jpg") no-repeat center center;
background-size: cover;
}

/*----------------------------------------------------------------------------------------------------------------------見出し・改行----------*/

.tit_jp{
font-size:30px;
font-weight:bold;
line-height:1.8;
letter-spacing:0.1em;
}

.tit_en{
font-size:17px;
color:#8dc21f;
letter-spacing:0.05em;
}

.br_pc{ display:inline; }

.br_sp{ display:none; }

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

.tit_jp{ font-size:24px; }	

.br_pc{ display:none; }

.br_sp{ display:inline; }

}


/*----------------------------------------------------------------------------------------------------------------------msg----------*/

#msg{
width:83.3%;
max-width:1200px;
margin:110px auto 0;
}

#msg .msg_txt{ 
width:90%;
margin-left:10%;
margin-top:50px;
}

#msg .msg_txt h2{ 
font-size:36px;
position:relative;
}

#msg .msg_txt h2:after{
position:absolute;
top:33px;
left:340px;
content: "";
width: 100px;
height: 1px;
background: #333;
}

#msg .msg_txt p{ margin-top:10px; }

#msg .ph{ margin-top:45px; }

#msg .ph img{ width:100%; height:auto; }


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

#msg{ 
margin:80px auto 0;
width:90%;
}

#msg .msg_txt{ margin-top:20px; }

#msg .msg_txt h2{ font-size:24px; }

#msg .msg_txt h2:after{
position:absolute;
top:22px;
left:225px;
content: "";
width: 50px;
height: 1px;
background: #333;
}

#msg .ph{ margin-top:30px; }

}


/*----------------------------------------------------------------------------------------------------------------------data----------*/

#wrapper{ 
background-color:#f6f6f6;
margin:150px auto 0;
}

#data{
width:83.3%;
max-width:1200px;
margin:0 auto;
padding:150px 0 0;
}

#data ul{ 
display:flex;
flex-wrap:wrap;
}

#data ul li{
width:30%;
margin-right:5%;
margin-top:45px;
}

#data ul li:nth-child(3n){
width:30%;
margin-right:0%;
}

#data ul li .ico{
background-color:#fff;
height:300px;
text-align:center;
padding-top:82px;
}

#data ul li h2{
margin-top:15px;
font-weight:bold;
font-size:18px;
line-height:1.6;
}

#data ul li h2 span{ 
color:#8dc21f;
font-size:36px;
}

@media screen and (max-width:767px){
	
#wrapper{ 
background-color:#f6f6f6;
margin:60px auto 0;
}
	
#data_point{ margin:80px auto 0; }

#data{
width:90%;
padding:60px 0 0;
}

#data ul{ 
display:flex;
width:90%;
margin-left:10%;
}

#data ul li{
width:100%;
margin-right:0%;
margin-top:40px;
}

#data ul li:nth-child(3n){
width:100%;
margin-right:0%;
}

#data ul li:nth-child(2n){
width:100%;
margin-right:0%;
}

#data ul li .ico{
height:240px;
padding-top:60px;
}

#data ul li .ico img{
width:120px;
height:auto;
}

}

/*----------------------------------------------------------------------------------------------------------------------#large_img----------*/

#large_img{
margin-top:150px;
width:91.63%;
}

#large_img img{ width:100%; height:auto; }

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

#large_img{
margin-top:100px;
width:95%;
}

}

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

#large_img{ margin-top:80px; }

}

/*----------------------------------------------------------------------------------------------------------------------point----------*/

#point{
width:83.3%;
max-width:1200px;
margin:0 auto;
padding:150px 0;
}

.box_point{
width:90%;
margin-left:10%;
margin-top:80px;
display:flex;
flex-direction: row-reverse;
}

.even{ flex-direction: row; }

.box_point .ph{ width:55%; }

.box_point .ph img{ width:100%; height:auto; }

.box_point .txt{ 
width:45%;
padding-right:5%;
padding-top:25px;
}

.even .txt{ 
padding-left:5%;
padding-right:0%;
}

.box_point .txt span{
font-size:28px;
font-weight:bold;
display:block;
}

.box_point .txt h2{
font-size:30px;
font-weight:bold;
color:#8dc21f;
padding-bottom:3px;
border-bottom:1px solid #ddd;
}

.box_point .txt p{ margin-top:17px; }


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

#point{
width:90%;
padding:80px 0;
}

.box_point{
margin-top:40px;
display:block;
}

.box_point .ph{ width:100%; }

.box_point .txt{ 
width:100%;
padding-right:0%;
padding-top:25px;
position:relative;
}

.even .txt{ padding-left:0%; }

.box_point .txt span{
font-size:15px;
position:absolute;
top:30px;
right:0;
}

.box_point .txt h2{
font-size:24px;
font-weight:bold;
line-height:1.6;
padding-bottom:5px;
}

.box_point .txt p{ margin-top:14px; }

}

/*----------------------------------------------------------------------------------------------------------------------voice----------*/

#voice{
width:83.3%;
max-width:1200px;
margin:150px auto 0;
display:flex;
}

#voice .tit_box{ width:20%; }

#voice #cont{ width:80%; }

.interview:nth-child(2){ margin-top:100px; }
.interview:nth-child(3){ margin-top:100px; }

.interview .ph{ display:flex; }

.interview .ph .main{ width:62.5%; }

.interview .ph .sub{ width:37.5%; }

.interview .ph img{ 
width:100%; height:auto;
display:block;
}

.interview .tit{ 
position:relative;
margin-top:50px;
}

.interview .tit h2{ 
font-size:30px;
line-height:1.6;
padding-bottom:13px;
border-bottom:1px solid #ddd;
letter-spacing:0.1em;
}

.interview .tit .en{
display:block;
position:absolute;
color:#8dc21f;
top:66px;
right:0;
font-size:12px;
}

.interview .tit h3{ 
font-size:18px;
font-weight:bold;
margin-top:20px;
}

.interview .tit h3 span{ 
color:#8dc21f;
font-size:14px;
padding-left:10px;
}

.interview p{ margin-top:20px; }


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

.interview .tit h2{ font-size:24px; }

.interview .tit .en{ top:50px;}

}

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

#voice{
width:90%;
margin:60px auto 0;
display:block;
}

#voice .tit_box{ width:100%; }

#voice #cont{ 
width:90%;
margin-left:10%;
}

.interview .ph{ display:block; }

.interview .ph .main{ width:100%; }

.interview .ph .sub{ 
width:100%;
display:flex;
}

.interview .ph .sub img{ 
width:50%;
display:block;
}

.interview .tit{ margin-top:30px; }

.interview{ margin-top:40px; }

.interview .tit h2{ font-size:20px; }

.interview .tit .en{ display:none; }

}


/*----------------------------------------------------------------------------------------------------------------------info----------*/

#info{
width:83.3%;
max-width:1200px;
margin:130px auto 0;
display:flex;
}

#info .tit_box{ width:30%; }

#info ul{ width:70%; }

#info ul li{
font-size:18px;
padding:30px 0 22px;
border-bottom:1px solid #ddd;
background:url("../images/cir_arrow_bl.png") no-repeat right center;
background-size:17px 17px;
}

#info ul a li{
transition: 0.2s;
}

#info ul a:hover li { 
color:#8dc21f;
border-bottom:1px solid #8dc21f;
}

@media screen and (max-width:767px){
	
#info{
width:90%;
margin:80px auto 0;
display:block;
}

#info .tit_box{ width:100%; }

#info ul{ 
width:90%;
margin-left:10%;
}


}

/*----------------------------------------------------------------------------------------------------------------------councel----------*/

#counsel {
margin:120px auto 0;
width:83.3%;
max-width:1200px;
}

#counsel h2{
width:100%;
font-weight:bold;
background-color:#f3f8ea;
border-top:1px solid #e5e5e5;
border-bottom:1px solid #e5e5e5;
padding:22px 0 17px 30px;
}

#counsel ul{
display:flex;
border-bottom:1px solid #e5e5e5;
}

#counsel ul li.tel{ 
width:30%;
font-weight:bold;
font-size:18px;
border-right:1px dotted #ccc;
margin:20px 0;
padding-left:30px;
letter-spacing:0.2em;
}

#counsel ul li.tel a{ cursor:default; }

#counsel ul li.tel span{ font-size:32px; }

#counsel ul li.time{ 
width:70%;
margin:25px 0;
padding-left:30px;
line-height:2;
}


#counsel ul li.time span{ 
font-weight:bold;
color:#8dc21f;
}

#counsel .more{
width:40%;
margin:70px auto;
}


@media screen and (max-width:1200px){
	
#counsel ul{ display:block; }

#counsel ul li.tel{ 
width:100%;
border-right:none;
margin:20px 0 0 0;
}

#counsel ul li.time{ 
width:100%;
margin:0 0 25px 0;
}

#counsel .more{
width:70%;
margin:40px auto;
}

}



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

#counsel {
margin:60px auto 0;
width:90%;
}

#counsel ul li.tel span{ font-size:24px; }

#counsel ul li.time{ padding-right:30px; }

}



