@charset "UTF-8";

/*===============================================
●共通
===============================================*/



/*===============================================
●画面の横幅が641px以上(タブレット・PC)
===============================================*/
@media screen and (min-width: 641px) {

    /* h2 */
    h2{
        width:730px;
        height:40px;
        margin:0px auto 0px auto;
        padding:14px 0px 0px 25px;
        font-size:16px;
        font-weight:bold;
        color:#FFF;
        text-align:left;
        background-color:#069;
    }

    h3{
        width:700px;
        height:30px;
        margin:20px auto 0px auto;
        padding:9px 0px 0px 10px;
        font-size:14px;
        font-weight:bold;
        color:#FFF;
        text-align:left;
        background-color:#8cc63f;
    }

    #user_check{
        width:1020px;
        margin:20px auto 40px auto;
        padding-bottom:10px;
        background-color:#FFF;
    }

    #user_check ul{
        width:950px;
        margin:20px auto 0px auto;
    }



    #user_check ul li{
        float:left;
        width:180px;
        height:190px;
        margin:0px 5px 10px 5px;
        text-align:center;
        border:#CCC 1px solid;
    }

    #user_check ul li p.user_check_type{
        width:150px;
        margin:10px auto 0px auto;
        text-align:left;
        font-size:10px;
        color:#099;
    }

    #user_check ul li p.user_check_img{
        width:150px;
        height:110px;
        margin:10px auto 0px auto;
        overflow:hidden;
    }

    #user_check ul li p.user_check_img img{
        max-width:150px;
        max-height:110px;
    }

    #user_check ul li p.user_check_title{
        width:150px;
        height:35px;
        margin:10px auto 0px auto;
        font-weight:bold;
        text-align:left;
        line-height:150%;
        overflow:hidden;
    }

    /* 求人リスト */
    p.job_box_title{
        display:inline-block;
        padding:12px 20px 10px 20px;
        color:#FFF;
        font-size:16px;
        font-weight:bold;
        background-color:#F33;
    }

    .job_box01{
        width:1020px;
      /*height:620px;*/
        margin:0px 0px 40px 0px;
      padding: 0 0 20px 0;
        background-color:#FFF;
        border:#ccc 1px solid;
    }

  .job-list{
        width: 980px;
    margin: 0 auto;
    /*
        height:550px;
        overflow-y:auto;*/
    }

  .job-list > div {
        width:480px;
        height:200px;
        margin: 10px 20px 10px 0;
        text-align:left;
    }

  .job-list > div:nth-of-type(2n) {
    margin:10px 0 10px 0;
  }

  .job-list > div > a{
    display: block;
    width:480px;
    height:200px;
    padding:5px;
    text-decoration:none;
    border:#ccc 1px solid;
    overflow-y: auto;
  }

  .job-list > div > a:hover{
    background-color:#FFC;
  }

  .job-list > div table td p.td_title{
        margin:5px 0px 0px 5px;
        line-height:150%;
        font-weight:bold;
        font-size:15px;
    }

  .job-list > div table td p.td_msg{
        margin:5px 0px 0px 5px;
        color:#C00;
        line-height:150%;
    }

  .job-list > div table td.td01{
        width:170px;
        padding-top:10px;
        text-align:center;
    }

  .job-list > div table td.td01 img{
        max-width:150px;
        max-height:100px;
    }

  .job-list > div table td.td02{
        vertical-align:top;
        letter-spacing:0.1em;
    }

  .job-list > div table td.td02 table{
        margin:10px 0px 0px 0px;
    }

  .job-list > div table td.td02 table th{
        width:45px;
        padding-bottom:5px;
        color:#099;
    }

  .job-list > div table td.td02 table td{
        padding: 0 0 5px 0;
        line-height:150%;
        text-align: left;
    }

  .job-list > div table td.td03{
        padding: 10px !important;
    }

  .job-list > div table td.td_photo{
        width: 460px;
        text-align: center;
    }

  .job-list > div table td.td_photo img{
        height:160px;
        margin: 0 auto;
    }


    /*----- イベント情報　SNS -----*/

    #box_info {
        width:1020px;
        margin: 0 auto;
    }

    #box_info_01{
        width:500px;
        height:460px;
        margin:20px 0px 0px 0px;
        font-size:14px;
        float:left;
        background-color:#FFF;
    }

    #box_info_01_info {
        width:460px;
        height:320px;
        margin:20px 20px 0px 20px;
        scrollbar-base-color: #FFFFFF;
        scrollbar-track-color: #FFFFFF;
        scrollbar-arrow-color: #c8c8c8;
        scrollbar-highlight-color: #c8c8c8;
        scrollbar-shadow-color: #c8c8c8;
        scrollbar-darkshadow-color: #FFFFFF;
        scrollbar-3dlight-color: #FFFFFF;
        scrollbar-darkshadow-color: #FFFFFF;
        overflow-y:scroll;
        overflow-x:hidden;
        padding: 5px;
        text-align: left;
        border:solid 1px #BBBBBB;
        background-color:#FFF;
    }

    #box_info_01_info a {
        text-decoration:none;
    }

    #box_info_01_info div.event {
        width:430px;
        padding:15px 10px;
        border-bottom:#CCC 1px solid;
    }

    #box_info_01_info div.event:hover{
        background-color:#FFC;
    }

    #box_info_01_info p.event_date {
        color:#099;
    }

    #box_info_01_info p.event_date img {
        margin:3px 8px 0px 0px;
    }

    #box_info_01_info p.event_area {
        margin:10px 0px 0px 0px;
    }

    #box_info_01_info p.event_title {
        margin:10px 0px 0px 0px;
        font-weight:bold;
    }

    #box_info_btn {
        margin:20px 0px 0px 0px;
        text-align:center;
    }

    #box_info_btn img {
        width:200px;
        margin:0px 5px;
    }

    #box_info_02 {
        width:500px;
        height:460px;
        margin:20px 0px 0px 10px;
        float:right;
        background-color:#FFF;
    }

    #box_sns {
        width:460px;
        margin:20px 20px 0px 20px;
    }

    .fb-page {
        width:460px !important;
        height:310px !important;
    }

}

/*===============================================
●画面の横幅が640px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 640px) {

    /* 共通 */
    body {
        background:none;
    }


    /* !コンテンツ
    ---------------------------------------------------------- */
    #contents {
        width:100%;
        height:100%;
        margin:0px auto 0px auto;
    }

    /* h2 */
    h2{
        width:100%;
        height:40px;
        margin:10px auto 0px auto;
        padding:14px 0px 0px 25px;
        font-size:16px;
        font-weight:bold;
        color:#FFF;
        text-align:left;
        background-color:#069;
    }

    h3{
        width:100%;
        height:30px;
        margin:20px auto 10px auto;
        padding:9px 0px 0px 10px;
        font-size:14px;
        font-weight:bold;
        color:#FFF;
        text-align:left;
        background-color:#8cc63f;
    }

    /* チェックした求人 */
    #user_check{
        width:100%;
        margin:0px auto 20px auto;
        padding-bottom:10px;
        background-color:#FFF;
    }

    #user_check ul{
        width:100%;
        margin:20px auto 0px auto;
    }

    #user_check ul li{
        float:left;
        width:47%;
        height:190px;
        margin:0px 1% 10px 1%;
        text-align:center;
        border:#CCC 1px solid;
    }

    #user_check ul li p.user_check_type{
        width:95%;
        margin:10px auto 0px auto;
        text-align:left;
        font-size:10px;
        color:#099;
    }

    #user_check ul li p.user_check_img{
        width:130px;
        height:110px;
        margin:10px auto 0px auto;
        overflow:hidden;
    }

    #user_check ul li p.user_check_img img{
        max-width:130px;
        max-height:110px;
    }

    #user_check ul li p.user_check_title{
        width:95%;
        height:35px;
        margin:10px auto 0px auto;
        font-size:12px;
        font-weight:bold;
        text-align:left;
        line-height:150%;
        overflow:hidden;
    }

    /* 求人リスト */
    p.job_box_title{
        display:inline-block;
        margin-left:2px;
        padding:10px 10px 8px 10px;
        color:#FFF;
        font-size:14px;
        font-weight:bold;
        background-color:#F33;
    }

    .job_box01{
        width:100%;
        height:500px;
        margin: 0px 0px 40px 0px;
        background-color:#FFF;
        border-bottom:#CCC 1px solid;
    }

  .job-list{
        width:100%;
        height:380px;
        overflow-y:auto;
        text-align:center;
    }

  .job-list > div {
        width:95%;
        margin: 10px auto;
        text-align:left;
    }

  .job-list > div > a{
    display: block;
    width: 100%;
    height: 100%;
    padding:5px;
    border:#ccc 1px solid;
    text-decoration:none;
  }

  .job-list > div table{
        width: 100%;
    }

  .job-list > div table td p.td_title{
        margin:5px 0px 0px 5px;
        line-height:150%;
        font-weight:bold;
    }

  .job-list > div table td p.td_msg{
        margin:5px 0px 0px 5px;
        color:#C00;
        font-size:12px;
        line-height:150%;
    }

  .job-list > div table td.td01{
        width:100px;
        padding-top:10px;
        text-align:center;
    }

  .job-list > div table td.td01 img{
        max-width:100px;
        max-height:100px;
    }

  .job-list > div table td.td02{
        vertical-align:top;
        letter-spacing:0.1em;
    }

  .job-list > div table td.td02 table{
        margin:10px 0px 0px 0px;
    }

  .job-list > div table td.td02 table th{
        width: 45px;
        white-space: nowrap;
        padding-left:5px;
        padding-bottom:5px;
        color:#099;
        font-size:12px;
    }

  .job-list > div table td.td02 table td{
        padding: 0 0 5px 0;
        line-height:150%;
        font-size:12px;
        text-align: left;
    }

  .job-list > div table td.td_photo{
        width: 100%;
        text-align: center;
    }

  .job-list > div table td.td_photo img{
        width: 60%;
        margin: 0 auto;
    }

    .btn_part{
        position:fixed;
        width:60px;
        bottom:130px;
        right:0px;
        padding:10px 0px 8px 0px;
        text-align:center;
        color:#FFF;
        font-size:12px;
        font-weight:bold;
        background-color:#F33;
    }

    .btn_full{
        position:fixed;
        width:60px;
        bottom:90px;
        right:0px;
        padding:10px 0px 8px 0px;
        text-align:center;
        color:#FFF;
        font-size:12px;
        font-weight:bold;
        background-color:#F33;
    }


    /*----- イベント情報　SNS -----*/

    #box_info {
        width:95%;
        margin:0px;
    }

    #box_info_01{
        width:100%;
        height:460px;
        margin:20px 0px 0px 0px;
        font-size:14px;
        background-color:#FFF;
    }

    #box_info_01_info {
        width:100%;
        height:320px;
        margin:20px 5px 0px 5px;
        scrollbar-base-color: #FFFFFF;
        scrollbar-track-color: #FFFFFF;
        scrollbar-arrow-color: #c8c8c8;
        scrollbar-highlight-color: #c8c8c8;
        scrollbar-shadow-color: #c8c8c8;
        scrollbar-darkshadow-color: #FFFFFF;
        scrollbar-3dlight-color: #FFFFFF;
        scrollbar-darkshadow-color: #FFFFFF;
        overflow-y:scroll;
        overflow-x:hidden;
        padding: 5px;
        text-align: left;
        border:solid 1px #BBBBBB;
        background-color:#FFF;
    }

    #box_info_01_info a {
        text-decoration:none;
    }

    #box_info_01_info div.event {
        width:100%;
        padding:15px 10px;
        border-bottom:#CCC 1px solid;
    }

    #box_info_01_info p.event_date {
        color:#099;
    }

    #box_info_01_info p.event_date img {
        margin:4px 8px 0px 0px;
    }

    #box_info_01_info p.event_area {
        margin:10px 0px 0px 0px;
    }

    #box_info_01_info p.event_title {
        margin:10px 0px 0px 0px;
        font-weight:bold;
    }

    #box_info_btn {
        margin:20px 0px 0px 0px;
        text-align:center;
    }

    #box_info_btn img {
        width:130px;
        margin:0px 5px;
    }

    #box_info_02 {
        width:100%;
        height:460px;
        margin:20px 5px 0px 5px;
        background-color:#FFF;
    }

    #box_sns {
        width:100%;
        margin:20px 0px 0px 0px;
        text-align:center;
    }

    .fb-page {
        width:95% !important;
    }


}