/*
 * cmn_layout.css
 *
 */


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

body {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Verdana, sans-serif;
    -webkit-text-size-adjust: 100%;
    background: #fff;
    color: #333333;
    line-height: 200%;
    word-wrap: break-word;
    text-align: center;
}

@media all and (-ms-high-contrast:none) {
    body {
        font-family: "メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    }
}

.mincho {
    font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

#wrapper,
#contents {
    position: relative;
    width: 100%;
    margin:0 auto;
    padding:0;
    }

a{
    color: #333333;
    text-decoration: none;
}


@-webkit-keyframes slick_move {
    to {
        -webkit-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
    }
}

@keyframes slick_move {
    to {
        -webkit-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
    }
}


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

    body {
        font-size: 16px;
    }

    #wrapper{
        min-width: 1280px;
        padding: 100px 0 0 0;
    }

    /* !共通
    ---------------------------------------------------------- */
    .pcNone{
        display:none !important;
        }

    a:hover{
        opacity: 0.8;
    }

    .list-flex{
        display:-webkit-box !important;
        display:-moz-box !important;
        display:-ms-box !important;
        display:-webkit-flexbox !important;
        display:-moz-flexbox !important;
        display:-ms-flexbox !important;
        display:-webkit-flex !important;
        display:-moz-flex !important;
        display:-ms-flex !important;
        display:flex !important;
        -webkit-box-lines:multiple !important;
        -moz-box-lines:multiple !important;
        -webkit-flex-wrap:wrap !important;
        -moz-flex-wrap:wrap !important;
        -ms-flex-wrap:wrap !important;
        flex-wrap:wrap !important;
    }


    /* !header ヘッダー
    ---------------------------------------------------------- */
    header {
        position: absolute;
        top: 25px;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 1280px;
        min-width: 1030px;
        margin: auto;
        padding: 0 0 0 20px;
        text-align: left;
        z-index: 10;
    }

    header > h1 > a > img {
        width: 84px;
    }

    header > img.menu {
        position: fixed;
        top: 25px;
        right: 50px;
        width: 50px;
        z-index: 10;
    }

    /* #menu メニュー
    ---------------------------------------------------------- */
    #menu {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        padding: 60px 0 0 0;
        text-align: center;
        z-index:99998;
        background-color: rgba(255,255,2550,0.9);
    }

    #menu > img.menu-close {
        position: absolute;
        top: 25px;
        right: 50px;
        width: 50px;
        z-index: 10;
    }

    #menu > p {
        width: 100%;
        font-size: 20px;
        font-weight: bold;
        color: #003434;
    }

    #menu > ul {
        width: 470px;
        margin: 20px auto 0 auto;
        border-top: #a2d0a2 1px solid;
    }

    #menu > ul > li {
        margin: 0 auto;
        border-bottom: #a2d0a2 1px solid;
    }

    #menu > ul > li > a {
        display: block;
        padding: 12px 0;
        font-size: 16px;
        color: #003434;
    }

    #menu > ul > li:nth-of-type(9) {
        padding: 12px 0 0 0;
        border-bottom: none;
    }

    #menu > ul > li:nth-of-type(9) > img {
        width: 296px;
        margin: 10px 0;
    }


    /* メイン画像
    ---------------------------------------------------------- */
    .mainImage {
        position: relative;
        width: 1280px;
        height: 645px;
        margin: 0 auto;
    }

    .mainImage .img_list {
        width: 851px;
        height: 645px;
        margin: 0 0 0 429px;

    }

    .mainImage .img_list .slick-list {
        height: 100%;
        height: 645px;
        overflow: hidden;
        border-radius: 10px;
    }

    .mainImage .img_list .slick-track {
        height: 100%;
    }

    .mainImage .img_list .item_wrap {
        overflow: hidden;
        position: relative;
    }

    .mainImage .img_list .item_wrap:nth-of-type(1) .item {
        background: url(../images/main_img01.png) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap:nth-of-type(2) .item {
        background: url(../images/main_img02.png) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap:nth-of-type(3) .item {
        background: url(../images/main_img03.png) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap:nth-of-type(4) .item {
        background: url(../images/main_img04.png) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap .item {
        height: 100%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    .mainImage .img_list .slick_scale {
        -webkit-animation: slick_move 8s linear;
        animation: slick_move 8s linear;
    }

    .mainImage img.main-title {
        position: absolute;
        top: 75px;
        left: 103px;
        width: 124px;
        z-index: 999;
    }


    /* コンテンツ部分
    ---------------------------------------------------------- */
    #contents{
        width:100%;
        min-width: 1280px;
    }

    a {
        opacity: 1;
        filter: alpha(opacity=100);
        -ms-filter: "alpha(opacity=100)";
        zoom: 1;
        transition: opacity 0.5s ease;
    }


    /*フェアワークス下野ってどんなところ？*/
    #about {
        width: 100%;
        margin: 100px auto 0 auto;
    }

    #about > img.about-icon {
        width: 46px;
    }

    #about > h2 {
        position: relative;
        width: 769px;
        height: 36px;
        margin: 30px auto 0 auto;
    }

    #about > h2 > img {
        position: absolute;
        height: 36px;
    }

    #about > h2 > img.title01 {
        top: 0;
        left: 0;
    }

    #about > h2 > img.title02 {
        top: 0;
        left: 44px;
    }

    #about > h2 > img.title03 {
        top: 0;
        left: 87px;
    }

    #about > h2 > img.title04 {
        top: 0;
        left: 132px;
    }

    #about > h2 > img.title05 {
        top: 0;
        left: 155px;
    }

    #about > h2 > img.title06 {
        top: 0;
        left: 199px;
    }

    #about > h2 > img.title07 {
        top: 0;
        left: 245px;
    }

    #about > h2 > img.title08 {
        top: 1px;
        left: 285px;
    }

    #about > h2 > img.title09 {
        top: 1px;
        left: 328px;
    }

    #about > h2 > img.title10 {
        top: 1px;
        left: 378px;
    }

    #about > h2 > img.title11 {
        top: 2px;
        left: 427px;
    }

    #about > h2 > img.title12 {
        top: 0;
        left: 466px;
    }

    #about > h2 > img.title13 {
        top: 0;
        left: 516px;
    }

    #about > h2 > img.title14 {
        top: 0;
        left: 560px;
    }

    #about > h2 > img.title15 {
        top: -2px;
        left: 607px;
    }

    #about > h2 > img.title16 {
        top: -1px;
        left: 656px;
    }

    #about > h2 > img.title17 {
        top: 0;
        left: 698px;
    }

    #about > h2 > img.title18 {
        top: 0;
        left: 740px;
    }

    #about > h2 > img.title19 {
        top: 0;
        left: 788px;
    }

    #about > p:nth-of-type(1) {
        margin: 60px auto 0 auto;
    }

    #about > p.img01 {
        margin: 180px auto 0 auto;
    }

    #about > p.img01 > img {
        width: 693px;
    }

    #about > p.img02 {
        width: 100%;
        margin: 250px auto 0 auto;
    }

    #about > p.img02 > img {
        width: 100%;
    }

    #about > div:nth-of-type(1) {
        width: 1280px;
        margin: 200px auto 0 auto;
    }

    #about > div:nth-of-type(1) > div:nth-of-type(1) {
        float: right;
        width: 640px;
        padding: 60px 0 0 40px;
        text-align: left;
    }

    #about > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
        margin: 0 0 25px 0;
        font-size: 30px;
        color: #1ea821;
        line-height: 150%;
    }

    #about > div:nth-of-type(1) > div:nth-of-type(2) {
        float: left;
        width: 640px;
        padding: 0 0 0 47px;
    }

    #about > div:nth-of-type(1) > div:nth-of-type(2) > img {
        width: 584px;
    }

    #about > div:nth-of-type(2) {
        width: 1280px;
        margin: 150px auto 0 auto;
    }

    #about > div:nth-of-type(2) > div:nth-of-type(1) {
        float: left;
        width: 607px;
        padding: 130px 0 0 150px;
        text-align: left;
    }

    #about > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
        margin: 0 0 25px 0;
        font-size: 30px;
        color: #1ea821;
        line-height: 150%;
    }

    #about > div:nth-of-type(2) > div:nth-of-type(2) {
        float: right;
        width: 673px;
    }

    #about > div:nth-of-type(2) > div:nth-of-type(2) > img:nth-of-type(1) {
        float: left;
        width: 332px;
        margin: 100px 0 0 0;
    }

    #about > div:nth-of-type(2) > div:nth-of-type(2) > img:nth-of-type(2) {
        float: right;
        width: 332px;
    }

    #about > div:nth-of-type(3) {
        width: 1280px;
        margin: 150px auto 0 auto;
    }

    #about > div:nth-of-type(3) > div:nth-of-type(1) {
        float: right;
        width: 640px;
        padding: 130px 0 0 40px;
        text-align: left;
    }

    #about > div:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(1) {
        margin: 0 0 25px 0;
        font-size: 30px;
        color: #1ea821;
        line-height: 150%;
    }

    #about > div:nth-of-type(3) > div:nth-of-type(2) {
        float: left;
        width: 640px;
        padding: 0 0 0 220px;
    }

    #about > div:nth-of-type(3) > div:nth-of-type(2) > img {
        width: 347px;
    }

    #about > div:nth-of-type(4) {
        width: 1280px;
        margin: 200px auto 0 auto;
    }

    #about > div:nth-of-type(4) > div:nth-of-type(1) {
        float: left;
        width: 545px;
        padding: 10px 0 0 150px;
        text-align: left;
    }

    #about > div:nth-of-type(4) > div:nth-of-type(1) > p:nth-of-type(1) {
        margin: 0 0 25px 0;
        font-size: 30px;
        color: #1ea821;
        line-height: 150%;
    }

    #about > div:nth-of-type(4) > div:nth-of-type(2) {
        float: right;
        width: 735px;
        text-align: left;
    }

    #about > div:nth-of-type(4) > div:nth-of-type(2) > img {
        width: 584px;
    }


    /*フェアワークス下野のご利用案内*/
    #guide {
        width: 100%;
        max-width: 1400px;
        margin: 120px auto 0 auto;
        padding: 0 1%;
    }

    #guide > img.guide-icon {
        width: 46px;
    }

    #guide > h2 {
        margin: 30px auto 0 auto;
        font-size: 40px;
        letter-spacing: 0.15em;
    }

    #guide > div {
        width: 49.5%;
        padding: 30px;
        text-align: left;
    }

    #guide > div > div {
        height: 100%;
        padding: 80px 50px 0 50px;
        background-color: rgba(255,255,255,0.8);
    }

    #guide > div > div > p:nth-of-type(1) {
        margin: 0 0 25px 0;
        font-size: 30px;
        font-weight: bold;
    }

    #guide > div:nth-of-type(1) {
        float: left;
        height: 425px;
        margin: 90px 0 0 0;
        background: url(../images/guide_bg01.jpg) center center no-repeat;
        background-size: cover;
    }

    #guide > div:nth-of-type(2) {
        float: right;
        height: 660px;
        margin: 250px 0 0 0;
        background: url(../images/guide_bg02.jpg) center center no-repeat;
        background-size: cover;
    }

    #guide > div:nth-of-type(2) > div > p:nth-of-type(2) {
        line-height: 170%;
    }

    #guide > div:nth-of-type(2) > div {
        padding: 40px 50px 0 50px;
    }

    #guide > div:nth-of-type(3) {
        float: left;
        height: 425px;
        margin: 10px 0 0 0;
        background: url(../images/guide_bg03.jpg) center center no-repeat;
        background-size: cover;
    }

    #guide > div:nth-of-type(4) {
        float: right;
        height: 340px;
        margin: 10px 0 0 0;
        background: url(../images/guide_bg04.jpg) center center no-repeat;
        background-size: cover;
    }


    /*1日の流れ*/
    #flow {
        position: relative;
        width: 940px;
        margin: 90px auto 0 auto;
    }

    #flow > div.flow-box {
        position: relative;
        width: 940px;
        text-align: left;
    }

    #flow > div.flow-box > div:nth-of-type(1) {
        float: left;
        width: 470px;
        border-right: #2abc22 3px solid;
    }

    #flow > div.flow-box > div:nth-of-type(2) {
        float: right;
        width: 470px;
    }

    #flow > div.flow-box table {
        width: 300px;
        text-align: left;
    }

    #flow > div.flow-box table th {
        width: 70px;
        padding: 0 0 4px 0;
        font-size: 16px;
        font-weight: bold;
        color: #003333;
    }

    #flow > div.flow-box:nth-of-type(1) > div:nth-of-type(1) {
        padding: 80px 0 0 0;
    }

    #flow > div.flow-box:nth-of-type(1) > div:nth-of-type(2) {
        padding: 160px 0 0 80px;
    }

    #flow > div.flow-box p.title {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 184px;
        height: 54px;
        padding: 14px 0 0 0;
        font-size: 30px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 10px;
    }

    #flow > div.flow-box p.gozen {
        position: absolute;
        top: 80px;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 70px;
        height: 70px;
        padding: 20px 0 0 0;
        font-size: 15px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 35px;
    }

    #flow > div.flow-box:nth-of-type(2) {
        margin: -40px 0 0 0;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(1) {
        height: 344px;
        padding: 80px 0 0 20px;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(1) > div > p {
        width: 380px;
        margin: 5px 0 0 0;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(2) {
        padding: 0 0 0 125px;
    }

    #flow > div.flow-box p.ohiru {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 70px;
        height: 70px;
        padding: 20px 0 0 0;
        font-size: 15px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 35px;
    }

    #flow > div.flow-box:nth-of-type(3) {
        margin: -40px 0 0 0;
    }

    #flow > div.flow-box:nth-of-type(3) > div:nth-of-type(1) {
        height: 424px;
    }

    #flow > div.flow-box:nth-of-type(3) > div:nth-of-type(2) {
        padding: 100px 0 0 80px;
    }

    #flow > div.flow-box p.gogo {
        position: absolute;
        top: -80px;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 70px;
        height: 70px;
        padding: 20px 0 0 0;
        font-size: 15px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 35px;
    }

    #flow > div.flow-box p.maru {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 30px;
        height: 30px;
        background-color: #2abc22;
        border-radius: 15px;
    }

    #flow img.flow-icon {
        position: absolute;
        top: -270px;
        left: -90px;
        width: 302px;
    }

    #flow img.kumo01 {
        position: absolute;
        top: -70px;
        left: 175px;
        width: 87px;
    }

    #flow img.kumo02 {
        position: absolute;
        top: 200px;
        right: -20px;
        width: 87px;
    }

    #flow img.kumo03 {
        position: absolute;
        top: 515px;
        left: -170px;
        width: 87px;
    }

    #flow img.kumo04 {
        position: absolute;
        top: 810px;
        right: -170px;
        width: 87px;
    }

    #flow img.kumo05 {
        position: absolute;
        top: 1115px;
        left: -170px;
        width: 87px;
    }

    #flow img.kumo06 {
        position: absolute;
        bottom: 100px;
        right: 130px;
        width: 87px;
    }


    /*バス*/
    #bus {
        position: relative;
        width: 100%;
        margin: 90px auto 0 auto;
        text-align: center;
    }

    #bus > img.bus-title {
        position: relative;
        display: block;
        width: 442px;
        margin: 0 auto;
        z-index: 3;
    }

    #bus > img.bus {
        position: relative;
        display: block;
        width: 362px;
        margin: 30px auto 0 auto;
        z-index: 3;
    }

    #bus > div {
        position: absolute;
        top: 105px;
        left: 0;
        width: 100%;
        height: 100px;
        background: url(../images/bg_green.jpg) center center repeat;
        z-index: 2;
    }

    #bus > img.kumo {
        position: absolute;
        top: 70px;
        left: 600px;
        right: 0;
        margin: 0 auto;
        width: 87px;
        z-index: 1;
    }


    /*フェアワークス下野の作業内容・活動*/
    #work {
        position: relative;
        width: 980px;
        margin: 80px auto 0 auto;
    }

    #work > img.work-icon {
        width: 41px;
    }

    #work > h2 {
        margin: 30px auto 0 auto;
        font-size: 40px;
        letter-spacing: 0.15em;
    }

    #work > img.img {
        position: absolute;
        top: 135px;
        right: -150px;
        width: 274px;
    }

    #work > ul {
        margin: 105px 0 0 0;
        text-align: left;
    }

    #work > ul > li {
        width: 300px;
        margin: 0 40px 80px 0;
    }

    #work > ul > li:nth-of-type(3n) {
        margin: 0 0 80px 0;
    }

    #work > ul > li > p:nth-of-type(1) {
        display: inline-block;
        min-width: 70px;
        margin: 20px 0 0 0;
        padding: 7px;
        font-size: 12px;
        color: #fff;
        text-align: center;
        background-color: #1ea821;
        border-radius: 5px;
        line-height: 100%;
    }

    #work > ul > li > p:nth-of-type(2) {
        margin: 10px 0 0 0;
        font-size: 20px;
        font-weight: bold;
        line-height: 140%;
    }

    #work > ul > li > p:nth-of-type(3) {
        margin: 5px 0 0 0;
    }


    /*フォトギャラリー*/
    #gallery {
        position: relative;
        width: 100%;
        margin: 20px auto 0 auto;
    }

    .gallery-inner {
        width: 100%;
        padding: 0 0 50px 0;
        overflow: hidden;
    }

    .gallery-inner > div.bg01, .gallery-inner > div.bg02 {
        width: 100%;
        height: 30px;
        background: url(../images/bg_green.jpg) center center repeat;
    }

    .gallery-inner > div.bg02 {
        margin: -1px auto 0 auto;
    }

    .gallery-inner .bx-viewport {
        background: transparent !important;
        border: 0;
        overflow: visible !important;
    }

    #gallery > img.img {
        position: absolute;
        width: 310px;
        bottom: -135px;
        right: 50px;
    }


    /*よくあるご質問*/
    #faq {
        position: relative;
        width: 940px;
        margin: 100px auto 0 auto;
    }

    #faq > img.faq-icon {
        width: 48px;
    }

    #faq > h2 {
        margin: 30px auto 70px auto;
        font-size: 40px;
        letter-spacing: 0.15em;
    }

    #faq > div {
        margin: 0 auto 40px auto;
        text-align: left;
    }

    #faq > div > div:nth-of-type(1) {
        position: relative;
        font-size: 20px;
        padding: 0 0 0 35px;
    }

    #faq > div > div:nth-of-type(1):before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 25px;
        height: 25px;
        background-image: url(../images/faq_q.png);
        background-repeat: no-repeat;
        background-size: contain
    }

    #faq > div > div:nth-of-type(2) {
        position: relative;
        margin: 20px 0 0 0;
        padding: 30px 45px;
        background-color: #f9ecc0;
    }

    #faq > div > div:nth-of-type(2):before {
        position: absolute;
        top: -10px;
        left: 35px;
        content: '';
        width: 19px;
        height: 11px;
        background-image: url(../images/faq_a.png);
        background-repeat: no-repeat;
        background-size: contain
    }


    /*法人概要 事業所概要*/
    #overview {
        position: relative;
        width: 1280px;
        margin: 140px auto 0 auto;
    }

    #overview > div {
        width: 628px;
        padding: 60px 80px 150px 80px;
        background-color: #f9f9f9;
    }

    #overview img.company-icon {
        width: 27px;
    }

    #overview img.information-icon {
        width: 28px;
        margin: 60px auto 0 auto;
    }

    #overview img.office-icon {
        width: 28px;
    }

    #overview h2 {
        margin: 30px auto 70px auto;
        font-size: 40px;
        letter-spacing: 0.15em;
    }

    #overview > div > table {
        width: 100%;
        text-align: left;
    }

    #overview > div > table th {
        width: 190px;
        padding: 12px 0;
        font-weight: bold;
        border-bottom: #20a936 1px solid;
        vertical-align: top;
        line-height: 140%;
    }

    #overview > div > table td {
        padding: 12px 0 12px 15px;
        border-bottom: #dadada 1px solid;
        vertical-align: top;
        line-height: 160%;
    }

    #overview > div:nth-of-type(1) {
        margin: 0 24px 0 0;
    }

    #overview > div:nth-of-type(1) > p {
        margin: 0 0 80px 0;
        text-align: left;
    }

    #overview > div:nth-of-type(1) > table td img.mail {
        width: 220px;
        margin: 10px 0 0 0;
    }

    #overview > div:nth-of-type(1) > ul {
        width: 440px;
        margin: 50px auto 0 auto;
    }

    #overview > div:nth-of-type(1) > ul > li {
        float: left;
        width: 200px;
        margin: 0 10px 35px 10px;
    }

    #overview > div:nth-of-type(1) > ul > li img {
        display: block;
        width: 49px;
        margin: 0 auto;
    }

    #overview > div:nth-of-type(1) > ul > li p {
        margin: 15px 0 0 0;
        line-height: 150%;
        text-decoration: underline;
    }

    #overview > div:nth-of-type(2) > p {
        margin: 40px 0 10px 0;
        text-align: left;
        font-weight: bold;
    }

    #overview > div:nth-of-type(2) > p:nth-of-type(1) {
        margin: 0 0 10px 0;
    }


    /*採用情報*/
    #recruit {
        position: relative;
        width: 100%;
        margin: 140px auto 0 auto;
        padding: 35px 60px;
        background: url(../images/recruit_bg.jpg) center center no-repeat;
        background-size: cover;
    }

    #recruit > div {
        padding: 30px 0;
        background-color: rgba(255,255,255,0.8);
    }

    #recruit > div > img.recruit-icon {
        width: 43px;
    }

    #recruit > div > h2 {
        margin: 30px auto 0 auto;
        font-size: 40px;
        letter-spacing: 0.15em;
    }

    #recruit > div > table {
        width: 600px;
        margin: 30px auto 0 auto;
        text-align: left;
    }

    #recruit > div > table th {
        width: 110px;
        padding: 0 0 5px 0;
        font-weight: bold;
    }

    #recruit > div > table td {
        padding: 0 0 5px 0;
    }

    #recruit > div > p:nth-of-type(1) {
        margin: 20px 0 0 0;
    }

    #recruit > div > p:nth-of-type(2) {
        margin: 10px 0 0 0;
    }

    #recruit > div > p:nth-of-type(2) img {
        width: 248px;
    }

    #recruit > div > p:nth-of-type(3) {
        margin: 10px 0 0 0;
    }

    /*マップ インドアビュー*/
    .gmap {
        width:100% !important;
        height: 480px !important;
    }

    .gmap > iframe {
        width:100% !important;
        height: 480px !important;
        margin: 0;
        padding: 0;
    }



    /* !footer フッター
    ----------------------------------------------------------*/
    footer {
        width:100%;
        margin: 0 auto;
        padding: 40px 0;
        text-align: center;
        background-color: #1ea821;
    }

    address {
        color: #fff;
        line-height: 100%;
    }


/* !page-top
---------------------------------------------------------- */
    #pageTop {
        position:fixed;
        display:none;
        bottom: 30px;
        right: 40px;
        width: 101px;
        z-index: 99999;
    }

}

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

    body {
        font-size: 15px;
    }

    #wrapper {
        width:100%;
        height:100%;
        display:block;
        position:relative;
        padding-top: constant(safe-area-inset-top);
        padding-right: constant(safe-area-inset-right);
        padding-bottom: constant(safe-area-inset-bottom);
        padding-left: constant(safe-area-inset-left);
    }

/* !共通
---------------------------------------------------------- */
    .spNone{
        display:none !important;
        }

    .sp-list-flex{
        display:-webkit-box !important;
        display:-moz-box !important;
        display:-ms-box !important;
        display:-webkit-flexbox !important;
        display:-moz-flexbox !important;
        display:-ms-flexbox !important;
        display:-webkit-flex !important;
        display:-moz-flex !important;
        display:-ms-flex !important;
        display:flex !important;
        -webkit-box-lines:multiple !important;
        -moz-box-lines:multiple !important;
        -webkit-flex-wrap:wrap !important;
        -moz-flex-wrap:wrap !important;
        -ms-flex-wrap:wrap !important;
        flex-wrap:wrap !important;
    }


    /* !header ヘッダー
    ---------------------------------------------------------- */
    header {
        width: 100%;
        padding: 10px 0 10px 20px;
        text-align: left;
    }

    header > h1 > a > img {
        width: 52px;
    }

    header > img.menu {
        position: fixed;
        top: 10px;
        right: 20px;
        width: 40px;
        z-index: 9999;
    }


    /* #menu メニュー
    ---------------------------------------------------------- */
    #menu {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width:100%;
        height: 100%;
        padding: 50px 0 0 0;
        z-index:99998;
        background-color: rgba(255,255,2550,0.9);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    #menu > img.menu-close {
        position: absolute;
        top: 10px;
        right: 20px;
        width: 40px;
        z-index: 10;
    }

    #menu > p {
        font-size: 15px;
        font-weight: bold;
        color: #003434;
    }

    #menu > ul {
        width: 100%;
        height: 100%;
        margin: 20px auto 0 auto;
        padding: 0 0 200px 0;
        overflow-y: auto;
    }

    #menu > ul > li {
        width: 80%;
        margin: 0 auto;
        font-size: 12px;
        text-align: center;
        border-bottom: #a2d0a2 1px solid;
    }

    #menu > ul > li:nth-of-type(1) {
        border-top: #a2d0a2 1px solid;
    }

    #menu > ul > li > a {
        display: block;
        padding: 8px 0;
        color: #003434;
    }

    #menu > ul > li:nth-of-type(9) {
        padding: 12px 0 0 0;
        border-bottom: none;
    }

    #menu > ul > li:nth-of-type(9) > a {
        padding: 0;
    }

    #menu > ul > li:nth-of-type(9) > a > img {
        width: 148px;
    }


    /* メイン画像
    ---------------------------------------------------------- */
    .mainImage {
        position: relative;
        width: 100%;
        height: 505px;
        margin: 0 auto;
    }

    .mainImage .img_list {
        width: 100%;
        height: 505px;
        margin: 0 auto;
    }

    .mainImage .img_list .slick-list {
        height: 100%;
        height: 505px;
        margin: 0 auto;
        overflow: hidden;
    }

    .mainImage .img_list .slick-track {
        height: 100%;
    }

    .mainImage .img_list .item_wrap {
        overflow: hidden;
        position: relative;
    }

    .mainImage .img_list .item_wrap:nth-of-type(1) .item {
        background: url(../images/main_img01_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap:nth-of-type(2) .item {
        background: url(../images/main_img02_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap:nth-of-type(3) .item {
        background: url(../images/main_img03_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap:nth-of-type(4) .item {
        background: url(../images/main_img04_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    .mainImage .img_list .item_wrap .item {
        height: 100%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    .mainImage .img_list .slick_scale {
        -webkit-animation: slick_move 8s linear;
        animation: slick_move 8s linear;
    }

    .mainImage img.main-title {
        position: absolute;
        top: 30px;
        left: 45px;
        width: 69px;
        z-index: 999;
    }


    /*フェアワークス下野ってどんなところ？*/
    #about {
        width: 100%;
        margin: 80px auto 0 auto;
    }

    #about > img.about-icon {
        width: 35px;
    }

    #about > h2 {
        position: relative;
        width: 293px;
        height: 57px;
        margin: 15px auto 0 auto;
    }

    #about > h2 > img {
        position: absolute;
        height: 22px;
    }

    #about > h2 > img.title01 {
        top: 0;
        left: 0;
    }

    #about > h2 > img.title02 {
        top: 0;
        left: 26px;
    }

    #about > h2 > img.title03 {
        top: 1px;
        left: 54px;
    }

    #about > h2 > img.title04 {
        top: 0;
        left: 85px;
    }

    #about > h2 > img.title05 {
        top: 1px;
        left: 102px;
    }

    #about > h2 > img.title06 {
        top: -1px;
        left: 130px;
    }

    #about > h2 > img.title07 {
        top: 0;
        left: 158px;
    }

    #about > h2 > img.title08 {
        top: 1px;
        left: 184px;
    }

    #about > h2 > img.title09 {
        top: 0;
        left: 213px;
    }

    #about > h2 > img.title10 {
        top: 0;
        left: 244px;
    }

    #about > h2 > img.title11 {
        top: 2px;
        left: 273px;
    }

    #about > h2 > img.title12 {
        top: 35px;
        left: 40px;
    }

    #about > h2 > img.title13 {
        top: 35px;
        left: 71px;
    }

    #about > h2 > img.title14 {
        top: 36px;
        left: 97px;
    }

    #about > h2 > img.title15 {
        top: 35px;
        left: 125px;
    }

    #about > h2 > img.title16 {
        top: 35px;
        left: 155px;
    }

    #about > h2 > img.title17 {
        top: 35px;
        left: 182px;
    }

    #about > h2 > img.title18 {
        top: 35px;
        left: 209px;
    }

    #about > h2 > img.title19 {
        top: 35px;
        left: 240px;
    }

    #about > p:nth-of-type(1) {
        width: 94%;
        margin: 40px auto 0 auto;
        text-align: left;
    }

    #about > p.img01 {
        width: 94%;
        margin: 30px auto 0 auto;
    }

    #about > p.img01 > img {
        width: 100%;
    }

    #about > p.img02 {
        width: 100%;
        margin: 50px auto 0 auto;
    }

    #about > p.img02 > img {
        width: 100%;
    }

    #about > div {
        width: 94%;
        margin: 100px auto 0 auto;
    }

    #about > div > div:nth-of-type(1) {
        width: 100%;
        text-align: left;
    }

    #about > div > div:nth-of-type(1) > p:nth-of-type(1) {
        margin: 0 auto 10px auto;
        font-size: 20px;
        color: #1ea821;
        text-align: center;
        line-height: 150%;
    }

    #about > div > div:nth-of-type(2) {
        width: 100%;
        margin: 20px auto 0 auto;
    }

    #about > div > div:nth-of-type(2) > img {
        width: 100%;
    }


    /*フェアワークス下野のご利用案内*/
    #guide {
        width: 94%;
        margin: 50px auto 0 auto;
    }

    #guide > img.guide-icon {
        width: 33px;
    }

    #guide > h2 {
        margin: 15px auto 0 auto;
        font-size: 25px;
        letter-spacing: 0.15em;
    }

    #guide > div {
        width: 100%;
        padding: 15px;
        text-align: left;
    }

    #guide > div > div {
        height: 100%;
        padding: 35px 15px;
        background-color: rgba(255,255,255,0.8);
    }

    #guide > div > div > p:nth-of-type(1) {
        margin: 0 0 10px 0;
        font-size: 20px;
        font-weight: bold;
    }

    #guide > div:nth-of-type(1) {
        margin: 25px auto 0 auto;
        background: url(../images/guide_bg01_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    #guide > div:nth-of-type(2) {
        margin: 10px auto 0 auto;
        background: url(../images/guide_bg02_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    #guide > div:nth-of-type(3) {
        margin: 10px 0 0 0;
        background: url(../images/guide_bg03_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    #guide > div:nth-of-type(4) {
        margin: 10px 0 0 0;
        background: url(../images/guide_bg04_sp.jpg) center center no-repeat;
        background-size: cover;
    }


    /*1日の流れ*/
    #flow {
        position: relative;
        width: 100%;
        margin: 35px auto 0 auto;
    }

    #flow img.flow-icon {
        width: 187px;
        margin: 0 auto;
    }

    #flow > div.flow-box {
        position: relative;
        width: 100%;
        margin: 45px auto 0 auto;
        text-align: left;
        z-index: 2;
    }

    #flow > div.flow-box > div:nth-of-type(1) {
        width: 50%;
        text-align: right;
        border-right: #2abc22 3px solid;
    }

    #flow > div.flow-box > div:nth-of-type(1) > img {
        width: 100%;
        max-width: 140px;
        margin: 0 30px 0 0;
    }

    #flow > div.flow-box > div:nth-of-type(2) {
        width: 50%;
    }

    #flow > div.flow-box table {
        width: 140px;
        font-size: 12px;
        text-align: left;
    }

    #flow > div.flow-box table th {
        width: 45px;
        font-weight: bold;
        color: #003333;
        line-height: 180%;
    }

    #flow > div.flow-box table td {
        line-height: 180%;
    }

    #flow > div.flow-box:nth-of-type(1) > div:nth-of-type(1) {
        padding: 110px 0 0 0;
    }

    #flow > div.flow-box:nth-of-type(1) > div:nth-of-type(2) {
        padding: 115px 0 0 35px;
    }

    #flow > div.flow-box p.title {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 188px;
        height: 44px;
        padding: 9px 0 0 0;
        font-size: 20px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 5px;
    }

    #flow > div.flow-box p.gozen {
        position: absolute;
        top: 100px;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 40px;
        height: 40px;
        padding: 6px 0 0 0;
        font-size: 10px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 20px;
    }

    #flow > div.flow-box:nth-of-type(2) {
        margin: 0 auto;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(1) {
        padding: 45px 30px 0 0;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(1) > div {
        float: right;
        width: 140px;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(1) > div > p {
        float: right;
        width: 140px;
        margin: 5px 0 0 0;
        font-size: 12px;
        text-align: left;
        line-height: 180%;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(2) {
        position: relative;
    }

    #flow > div.flow-box:nth-of-type(2) > div:nth-of-type(2) > img {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 30px;
        margin: auto;
        width: 100%;
        max-width: 140px;
    }

    #flow > div.flow-box p.ohiru {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 40px;
        height: 40px;
        padding: 6px 0 0 0;
        font-size: 10px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 20px;
    }

    #flow > div.flow-box:nth-of-type(3) {
        margin: 0 auto;
    }

    #flow > div.flow-box:nth-of-type(3) > div:nth-of-type(1) {
        padding: 50px 0;
    }

    #flow > div.flow-box:nth-of-type(3) > div:nth-of-type(2) {
        padding: 80px 0 0 30px;
    }

    #flow > div.flow-box p.gogo {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 40px;
        height: 40px;
        padding: 6px 0 0 0;
        font-size: 10px;
        font-weight: bold;
        color: #fff;
        text-align: center;
        background-color: #2abc22;
        border-radius: 20px;
    }

    #flow > div.flow-box p.maru {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 15px;
        height: 15px;
        background-color: #2abc22;
        border-radius: 8px;
    }

    #flow img.kumo01 {
        position: absolute;
        top: 24%;
        left: 20px;
        width: 44px;
        z-index: 1;
    }

    #flow img.kumo02 {
        position: absolute;
        top: 39%;
        right: 20px;
        width: 44px;
        z-index: 1;
    }

    #flow img.kumo03 {
        position: absolute;
        top: 60%;
        left: 20px;
        width: 44px;
        z-index: 1;
    }

    #flow img.kumo04 {
        position: absolute;
        top: 75%;
        right: 20px;
        width: 44px;
        z-index: 1;
    }

    #flow img.kumo05 {
        position: absolute;
        top: 92%;
        left: 20px;
        width: 44px;
        z-index: 1;
    }

    #flow img.kumo06 {
        position: absolute;
        bottom: 100px;
        right: 20px;
        width: 44px;
        z-index: 1;
    }


    /*バス*/
    #bus {
        position: relative;
        width: 100%;
        margin: 40px auto 0 auto;
        text-align: center;
    }

    #bus > img.bus-title {
        position: relative;
        display: block;
        width: 221px;
        margin: 0 auto;
        z-index: 3;
    }

    #bus > img.bus {
        position: relative;
        display: block;
        width: 181px;
        margin: 10px auto 0 auto;
        z-index: 3;
    }

    #bus > div {
        position: absolute;
        top: 53px;
        left: 0;
        width: 100%;
        height: 40px;
        background: url(../images/bg_green.jpg) center center repeat;
        z-index: 2;
    }

    #bus > img.kumo {
        position: absolute;
        top: 30px;
        right: 20px;
        margin: 0 auto;
        width: 44px;
        z-index: 1;
    }


    /*フェアワークス下野の作業内容・活動*/
    #work {
        position: relative;
        width: 94%;
        margin: 40px auto 0 auto;
    }

    #work > img.work-icon {
        width: 24px;
    }

    #work > h2 {
        margin: 15px auto 0 auto;
        font-size: 25px;
        letter-spacing: 0.15em;
    }

    #work > img.img {
        margin: 40px auto 0 auto;
        width: 167px;
    }

    #work > ul {
        margin: 0 auto;
    }

    #work > ul > li {
        width: 100%;
        margin: 50px auto 0 auto;
    }

    #work > ul > li:nth-of-type(1) {
        margin: 25px auto 0 auto;
    }

    #work > ul > li > img {
        width: 100%;
    }

    #work > ul > li > p:nth-of-type(1) {
        display: inline-block;
        min-width: 70px;
        margin: 20px 0 0 0;
        padding: 7px;
        font-size: 12px;
        color: #fff;
        text-align: center;
        background-color: #1ea821;
        border-radius: 5px;
        line-height: 100%;
    }

    #work > ul > li > p:nth-of-type(2) {
        margin: 7px 0 0 0;
        font-size: 15px;
        font-weight: bold;
        line-height: 140%;
    }

    #work > ul > li > p:nth-of-type(3) {
        margin: 5px 0 0 0;
        text-align: left;
    }


    /*フォトギャラリー*/
    #gallery {
        width: 100%;
        margin: 35px auto 0 auto;
    }

    .gallery-inner {
        width: 100%;
        padding: 0 0 40px 0;
        overflow: hidden;
    }

    .gallery-inner > div.bg01, .gallery-inner > div.bg02 {
        width: 100%;
        height: 25px;
        background: url(../images/bg_green.jpg) center center repeat;
    }

    .gallery-inner > div.bg02 {
        margin: -1px auto 0 auto;
    }

    .gallery-inner .bx-viewport {
        background: transparent !important;
        border: 0;
        overflow: visible !important;
    }

    .gallery-inner .bx-viewport img {
        width: 100%;
    }

    #gallery > img.img {
        width: 190px;
        margin: 20px auto 0 auto;
    }


    /*よくあるご質問*/
    #faq {
        position: relative;
        width: 94%;
        margin: 45px auto 0 auto;
    }

    #faq > img.faq-icon {
        width: 36px;
    }

    #faq > h2 {
        margin: 15px auto 40px auto;
        font-size: 25px;
        letter-spacing: 0.15em;
    }

    #faq > div {
        margin: 0 auto 30px auto;
        text-align: left;
    }

    #faq > div > div:nth-of-type(1) {
        position: relative;
        font-size: 15px;
        padding: 0 0 0 25px;
    }

    #faq > div > div:nth-of-type(1):before {
        position: absolute;
        top: 5px;
        left: 0;
        content: '';
        width: 16px;
        height: 16px;
        background-image: url(../images/faq_q.png);
        background-repeat: no-repeat;
        background-size: contain
    }

    #faq > div > div:nth-of-type(2) {
        position: relative;
        margin: 15px 0 0 0;
        padding: 20px 15px;
        background-color: #f9ecc0;
    }

    #faq > div > div:nth-of-type(2):before {
        position: absolute;
        top: -10px;
        left: 25px;
        content: '';
        width: 19px;
        height: 11px;
        background-image: url(../images/faq_a.png);
        background-repeat: no-repeat;
        background-size: contain
    }


    /*法人概要 事業所概要*/
    #overview {
        position: relative;
        width: 94%;
        margin: 50px auto 0 auto;
    }

    #overview > div {
        width: 100%;
        padding: 35px 15px;
        background-color: #f9f9f9;
    }

    #overview img.company-icon {
        width: 23px;
    }

    #overview img.information-icon {
        width: 25px;
        margin: 60px auto 0 auto;
    }

    #overview img.office-icon {
        width: 28px;
    }

    #overview h2 {
        margin: 15px auto 40px auto;
        font-size: 25px;
        letter-spacing: 0.15em;
    }

    #overview > div table {
        width: 100%;
        font-size: 12px;
        text-align: left;
    }

    #overview > div table th {
        width: 115px;
        padding: 10px 0;
        font-weight: bold;
        text-align: center;
        border-bottom: #20a936 1px solid;
        vertical-align: middle;
        line-height: 140%;
    }

    #overview > div table th.th01 {
        border-top: #20a936 1px solid;
    }

    #overview > div table td {
        padding: 12px 0 12px 15px;
        border-bottom: #dadada 1px solid;
        vertical-align: top;
        line-height: 160%;
    }

    #overview > div table td.td01 {
        border-top: #dadada 1px solid;
    }

    #overview > div:nth-of-type(1) {
        margin: 0 24px 0 0;
    }

    #overview > div:nth-of-type(1) > p {
        margin: 0 0 30px 0;
        text-align: left;
    }

    #overview > div:nth-of-type(1) > table td img.mail {
        width: 220px;
        margin: 10px 0 0 0;
    }

    #overview > div:nth-of-type(1) > ul {
        width: 100%;
        margin: 30px auto 0 auto;
    }

    #overview > div:nth-of-type(1) > ul > li {
        width: 45%;
        margin: 0 auto 20px auto;
    }

    #overview > div:nth-of-type(1) > ul > li img {
        display: block;
        width: 49px;
        margin: 0 auto;
    }

    #overview > div:nth-of-type(1) > ul > li p {
        margin: 15px 0 0 0;
        font-size: 12px;
        line-height: 150%;
        text-decoration: underline;
    }

    #overview > div:nth-of-type(2) {
        margin: 10px auto 0 auto;
    }

    #overview > div:nth-of-type(2) > p {
        margin: 40px 0 20px 0;
        text-align: center;
        font-weight: bold;
    }

    #overview > div:nth-of-type(2) > p:nth-of-type(1) {
        margin: 0 0 10px 0;
    }


    /*採用情報*/
    #recruit {
        position: relative;
        width: 100%;
        margin: 15px auto 0 auto;
        padding: 15px;
        background: url(../images/recruit_bg_sp.jpg) center center no-repeat;
        background-size: cover;
    }

    #recruit > div {
        padding: 40px 0;
        background-color: rgba(255,255,255,0.8);
    }

    #recruit > div > img.recruit-icon {
        width: 33px;
    }

    #recruit > div > h2 {
        margin: 15px auto 0 auto;
        font-size: 25px;
        letter-spacing: 0.15em;
    }

    #recruit > div > table {
        width: 80%;
        margin: 20px auto 0 auto;
        text-align: left;
    }

    #recruit > div > table th {
        display: block;
        width: 100%;
        font-weight: bold;
    }

    #recruit > div > table td {
        display: block;
        width: 100%;
        padding: 0 0 15px 0;
    }

    #recruit > div > p:nth-of-type(1) {
        margin: 20px 5px 0 5px;
    }

    #recruit > div > p:nth-of-type(2) {
        margin: 10px 0 0 0;
    }

    #recruit > div > p:nth-of-type(2) img {
        width: 185px;
    }

    #recruit > div > p:nth-of-type(3) {
        margin: 10px 0 0 0;
    }


    /*マップ インドアビュー*/
    .gmap {
        width:100% !important;
        height: 500px !important;
    }

    .gmap > iframe {
        width:100% !important;
        height: 500px !important;
        margin: 0;
        padding: 0;
    }


    /* !footer フッター
    ----------------------------------------------------------*/
    footer {
        width:100%;
        margin: 0 auto;
        padding: 15px 0;
        text-align: center;
        background-color: #1ea821;
    }

    address {
        font-size: 12px;
        color: #fff;
        line-height: 100%;
    }


/* !page-top
---------------------------------------------------------- */
    #pageTop {
        position:fixed;
        display:none;
        bottom:30px;
        right:18px;
        width: 62px;
        z-index:100;
    }


}