﻿@charset "utf-8";
/* ■■■TOP 共有■■■*/
.sttl01 {
padding-top: 15px;
}

.sttl02 {
padding-top: 15px;
color: #FFF;
}

h3.title01,
h4.title02,
h6.title03,
h3.title04 {
font-size: 36px;
line-height: 40px;
}

.pickupArea ul li a:hover img,
.catgo01 ul li a:hover img,
.catgo02 ul li a:hover img {
filter: alpha(opacity=80);
-moz-opacity:0.8;
opacity:0.8;
}

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.sttl01,
.sttl02 {
font-size: 14px;
padding-top: 10px;
}

h3.title01,
h4.title02,
h6.title03,
h3.title04 {
font-size: 26px;
line-height: 30px;
}


}
/* max-width: 768px @end */

/* ■■■メインイメージ■■■*/

#top_imgArea h2 {
position: absolute;
left: 50%;
top: 55%;
transform: translate(-50%, -55%);
}

#top_imgArea .ty01 img {
vertical-align: top;
}

/* max-width: 1060px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1060px){
#top_imgArea h2 {
top: 60%;
transform: translate(-50%, -60%);
}

}
/* max-width: 1060px @end */


/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
#top_imgArea {
margin-top: 48px;
}

#top_imgArea h2 {
top: 50%;
transform: translate(-50%, -50%);
width: 400px;
}

#top_imgArea h2 img {
width: 100%;
height: auto;
}



}
/* max-width: 768px @end */


/* max-width: 426px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 426px){
#top_imgArea h2 {
width: 280px;
}

}
/* max-width: 426px @end */



/* ■■■PICK UP■■■*/
.pickupArea {
background-image : url(../common/images/bg02.png);
background-position : 0 0;
background-size: 100% auto;
background-repeat: no-repeat;
}

.pickupArea .ty01 img {
vertical-align: top;
}

.pickupArea .title01 {
background-image : url(../images/ttl_icon01.png);
background-position : center 0;
background-size: 120px auto;
background-repeat: no-repeat;
color: #3D63AF;
font-weight: bold;
padding: 140px 0 0 0;
}



.pickupArea ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
line-height: 150%;
}

.pickupArea ul li {
border: 5px solid #DBDBDB;
max-width: 506px;
width: 31.6%;
background-color: #FFF;
padding: 5px 5px 15px 5px;
margin: 20px 0;
}


.pickupArea ul li a {
text-decoration: none;
display: block;
}

.pickupArea ul li a:hover {
color: #000;
}


.pickupArea ul li:hover {
background-color: #F5F7F9;
}

.pickupArea .pickup_ttl {
color: #3D63AF;
font-size: 20px;
font-weight: bold;
padding-top: 20px;
}

.pickupArea .pickup_contents {
padding: 0 10px;
text-align: left;
}

.pickupArea .pickup_address_ttl,
.pickupArea .pickup_salary_ttl {
background-image : url(../images/sttl_bg.png);
background-position : 0 bottom;
background-size: cover;
background-repeat: no-repeat;
padding: 7px 0 7px 15px;
margin-top: 15px;
}

.pickupArea .pickup_address_ttl span {
background-image : url(../images/sttl_icon01.png);
background-position : 0 center;
background-size: 12px auto;
background-repeat: no-repeat;
color: #FFF;
font-weight: bold;
font-size: 14px;
padding: 2px 0 2px 25px;
}

.pickupArea .pickup_address {
padding-top: 15px;
}


.pickupArea .pickup_salary_ttl span {
background-image : url(../images/sttl_icon02.png);
background-position : 0 center;
background-size: 17px auto;
background-repeat: no-repeat;
color: #FFF;
font-weight: bold;
font-size: 14px;
padding: 2px 0 2px 25px;
}

.pickupArea .pickup_salary {
padding-top: 15px;
}

/* max-width: 1617px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1617px){
.pickupArea {
background-position : center 0;
background-size: cover;
}

.pickupArea ul li {
border: 5px solid #DBDBDB;
max-width: 506px;
width: 48%;
background-color: #FFF;
padding: 5px 5px 15px 5px;
margin: 20px 0;
}


}
/* max-width: 1617px @end */


/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){
.pickupArea ul li img{
width: auto;
max-height: 304px;
}


}
/* min-width: 769px @end */



/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.pickupArea .title01 {
background-size: 80px auto;
padding: 90px 0 0 0;
}

.pickupArea ul li {
max-width: 100%;
width: 100%;
font-size: 14px;
margin: 10px 0;
}

.pickupArea .pickup_ttl {
font-size: 18px;
padding-top: 10px;
}

.pickupArea .pickup_address_ttl,
.pickupArea .pickup_salary_ttl {
margin-top: 10px;
}

.pickupArea .pickup_address,
.pickupArea .pickup_salary {
padding-top: 10px;
}

.pickupArea ul li img{
width: 100%;
max-height: auto;
}


}
/* max-width: 768px @end */

/* ■■■JOB SEARCH■■■*/

.jobsearchArea {
background-image : url(../images/bg01.png);
background-position : right 0 top 80px;
background-size: 430px auto;
background-repeat: no-repeat;
background-color: #3D63AF;
padding: 80px 0;
}

.jobsearchArea .title02 {
background-image : url(../images/ttl_icon02.png);
background-position : center 0;
background-size: 120px auto;
background-repeat: no-repeat;
color: #FFF;
font-weight: bold;
padding: 140px 0 0 0;
}


.search_ty01 h5,
.search_ty02 h5 {
font-size: 24px;
color: #60CFFF;
font-weight: bold;
}


.jobsearchArea ul {
display: flex;
justify-content: space-between;
margin-top: 40px;
}

.jobsearchArea ul li {
border: 5px solid #EEE;
background-color: #FFF;
}

.jobsearchArea .search_ty01 {
margin-top: 40px;
}

.jobsearchArea .search_ty02 {
margin-top: 70px;
}

.jobsearchArea .search_ty01 ul li {
width: 24%;
}

.jobsearchArea .search_ty02 ul li {
width: 19%;
}

.jobsearchArea ul li a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 128px;
padding-top: 20%;
font-weight: bold;
text-decoration: none;
}

.jobsearchArea ul li:hover {
background-color: #F5F7F9;
}


.jobsearchArea .t_icon01 {
background-image : url(../images/t_icon01.png);
background-position : center top 25%;
background-size: 38px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon02 {
background-image : url(../images/t_icon02.png);
background-position : center top 25%;
background-size: 41px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon03 {
background-image : url(../images/t_icon03.png);
background-position : center top 30%;
background-size: 45px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon04 {
background-image : url(../images/t_icon04.png);
background-position : center top 25%;
background-size: 41px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon11 {
background-image : url(../images/t_icon11.png);
background-position : center top 25%;
background-size: 45px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon12 {
background-image : url(../images/t_icon12.png);
background-position : center top 25%;
background-size: 45px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon13 {
background-image : url(../images/t_icon13.png);
background-position : center top 25%;
background-size: 45px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon14 {
background-image : url(../images/t_icon14.png);
background-position : center top 30%;
background-size: 47px auto;
background-repeat: no-repeat;
}

.jobsearchArea .t_icon15 {
background-image : url(../images/t_icon15.png);
background-position : center top 25%;
background-size: 45px auto;
background-repeat: no-repeat;
}

/* max-width: 977px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 977px){
.jobsearchArea {
background-position : right 0 top 80px;
background-size: 280px auto;
background-repeat: no-repeat;
background-color: #3D63AF;
padding: 80px 0;
}

.jobsearchArea ul li a {
padding-top: 40%;
}

}
/* min-width: 977px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.jobsearchArea {
background-position : right 5px bottom 5px;
background-size: 146px auto;
padding: 40px 0;
}

.jobsearchArea .title02 {
background-size: 80px auto;
padding: 90px 0 0 0;
}

.search_ty01 h5,
.search_ty02 h5 {
font-size: 20px;
}



.jobsearchArea ul li {
font-size: 14px;
}

.jobsearchArea .search_ty01 {
margin-top: 20px;
}

.jobsearchArea .search_ty02 {
margin-top: 40px;
}

}
/* max-width: 768px @end */

/* max-width: 650px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 650px){
.jobsearchArea ul {
flex-wrap: wrap;
margin-top: 20px;
}

.jobsearchArea ul li {
margin: 10px 0;
}

.jobsearchArea .search_ty01 ul li {
width: 48%;
}

.jobsearchArea .search_ty02 ul li {
width: 48%;
}

.jobsearchArea ul li a {
height: 120px;
padding-top: 30%;
}

}
/* max-width: 650px @end */

/* max-width: 426px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 426px){
.jobsearchArea ul li a {
padding-top: 40%;
}

}
/* max-width: 426px @end */


/* ■■■カテゴリ別■■■*/

.catgo01 {
padding: 80px 0 40px 0;
}

.catgo02 {
padding: 80px 0 40px 0;
background-color: #E7EFF6;
}

.catgo_ttl01,
.catgo_ttl02,
.catgo_ttl03,
.catgo_ttl04 {
float: left;
width: 11%;
}


.catgo_ttl01 .ty01,
.catgo_ttl02 .ty01,
.catgo_ttl03 .ty01,
.catgo_ttl04 .ty01 {
padding-top: 70px;
}


.catgo_ttl01 .ty01 img,
.catgo_ttl02 .ty01 img,
.catgo_ttl03 .ty01 img,
.catgo_ttl04 .ty01 img {
width: 100px;
height: auto;
}

.catgo01 h5,
.catgo02 h5,
.catgo03 h5,
.catgo04 h5 {
writing-mode: vertical-rl;
letter-spacing: 0.4em;
color: #3D63AF;
font-weight: bold;
font-size: 24px;
display: flex;
align-items: center;
width: 100%;
}



.search_ty03 {
float: right;
width: 82%;
text-align: left;
}

.search_ty03 ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.search_ty03 ul li {
width: 240px;
padding-bottom: 40px;
}

/* max-width: 977px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 977px){
.catgo_ttl01,
.catgo_ttl02,
.catgo_ttl03,
.catgo_ttl04 {
float: none;
width: 100%;
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}

.catgo01 h5,
.catgo02 h5,
.catgo03 h5,
.catgo04 h5 {
writing-mode: horizontal-tb;
letter-spacing: 0.2em;
position: relative;
padding-left: 30px;
}

.catgo01 h5:before,
.catgo02 h5:before,
.catgo03 h5:before,
.catgo04 h5:before {
content: '';
position: absolute;
top: 50%;
left:0;
display: inline-block;
width: 20px;
height: 2px;
background-color: #3D63AF;
}

.catgo_ttl01 .ty01,
.catgo_ttl02 .ty01,
.catgo_ttl03 .ty01,
.catgo_ttl04 .ty01 {
padding-top: 0;
}

.search_ty03 {
float: none;
width: 100%;
}

.search_ty03 ul li {
width: 220px;
padding-bottom: 20px;
}

}
/* min-width: 977px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.catgo01,
.catgo02 {
padding: 40px 0 20px 0;
}

.catgo01 h5,
.catgo02 h5,
.catgo03 h5,
.catgo04 h5 {
font-size: 20px;
}

.search_ty03 ul li {
width: 48%;
font-size: 14px;
}


}
/* max-width: 768px @end */

/* ■■■リンク■■■*/

.linkArea .ty01 img {
vertical-align: top;
}

.linkArea  .title03 {
background-image : url(../images/ttl_icon03.png);
background-position : center 0;
background-size: 120px auto;
background-repeat: no-repeat;
color: #3D63AF;
font-weight: bold;
padding: 140px 0 0 0;
}

.linkArea ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 40px 0;
}

.linkArea ul li {
width: 23%;
padding: 10px;
}

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.linkArea  .title03 {
background-size: 80px auto;
padding: 90px 0 0 0;
}

.linkArea ul {
margin: 10px 0;
}


.linkArea ul li {
width: 48%;
padding: 10px 0;
}

}
/* max-width: 768px @end */


/* ■■■企業様登録フォーム■■■*/

.registrationArea {
background-image : url(../images/bg02.png);
background-position : left 20px top 80px;
background-size: 430px auto;
background-repeat: no-repeat;
background-color: #3D63AF;
padding: 80px 0;
}

.registrationArea  .title04 {
background-image : url(../images/ttl_icon04.png);
background-position : center 0;
background-size: 120px auto;
background-repeat: no-repeat;
color: #FFF;
font-weight: bold;
padding: 140px 0 0 0;
}


/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.registrationArea {
background-position : right 5px bottom 5px;
background-size: 183px auto;
padding: 40px 0 180px 0;
}

.registrationArea  .title04 {
background-size: 80px auto;
padding: 90px 0 0 0;
}


}
/* max-width: 768px @end */