@charset "UTF-8";
/* basic common.css ver1.0.0 */
/*
    基準文字サイズ13px
    10px 77%    11px 85%
    12px 93%    13px 100%
    14px 108%   15px 116%
    16px 124%   17px 131%
    18px 139%   19px 147%
    20px 154%   21px 162%
    22px 169%   23px 177%
    24px 185%   25px 192%
    26px 200%
*/

html,
body {

}

html {
    overflow-y: scroll;
}

body {
    font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
    line-height: 1.5;
    text-align: center;
    font-size: 13px;
    color: #333;
    background: #ebebeb;
    transition: all 0.5s linear;
}

body.scrolled {
    padding-top: 88px;
}

body#home {
    background-color: #222;
}

#wrapper {}

.innerWrap,
.innerWrap02 {
    position: relative;
    width: 1200px;
    margin: auto;
    text-align: left;
}

.innerWrap {
    overflow: hidden;
}

#header {
    position: fixed;
    top: -100%;
    left: 0;
    z-index: 500;
    width: 100%;
    height: 88px;
    background-color: #fff;
    box-shadow: 0 5px 10px rgba(0,0,0,0.5);
    transition: all 0.5s linear;
}

    #logo {
        float: left;
        margin-top: 28px;
    }

    #gnav {
        float: right;
    }

        #gnav ul {
            margin-top: 38px;
        }

            #gnav ul li {
                float: left;
                margin-left: 24px;
            }

            #gnav ul li:first-child {
                margin-left: 0;
            }

                #gnav ul li a {
                    position: relative;
                    display: block;
                    color: #333;
                    font-size: 15px;
                    font-weight: 600;
                    text-decoration: none;
                    border-bottom: 5px solid #e0e8e8;
                }

                #gnav ul li a:after {
                    content: "";
                    position: absolute;
                    z-index: 10;
                    left: 0%;
                    top: 0;
                    width: 0%;
                    height: 100%;
                    border-bottom: 5px solid #21a9ac;
                    transition: all 0.3s linear;
                }

                #gnav ul li:hover a:after,
                #gnav ul li.current a:after {
                    width: 100%;
                }

body#home li#g01 a,
body#benefit li#g02 a,
body#about li#g03 a,
body#service li#g04 a,
body#contact li#g05 a,
body#recruit li#g06 a {border-bottom: 5px solid #21a9ac;}

body.scrolled #header {
    top: 0%;
}

.pagetop {
    cursor: pointer;
    transition: all 0.3s linear;
}

.pagetop:hover {
    opacity: 0.75;
}

#footer {
    position: relative;
    margin-top: 100px;
    background-color: #21a9ac;
    background-image: url(/common/img/bg-ft01.png);
    background-size: 16px;
    box-shadow: inset 0 5px 10px rgba(0,0,0,0.5);
}

#ft-pagetop {
/*
    position: absolute;
    top: -98px;
    right: 12px;
*/
    position: fixed;
    z-index: 5;
    bottom: 20px;
    right: 20px;
}

#ft-logo01 {
    padding: 40px 0;
}

#ft-bottom {
    overflow: hidden;
    padding: 36px 0 20px;
    background-color: rgba(0,0,0,0.35);
}

.ft-menu {
    float: left;
    width: 48.5%;
    margin-right: 1.5%;
}

    .ft-menu dt {
        height: 30px;
        /* margin-bottom: 12px; */
        padding-left: 40px;
        line-height: 30px;
        vertical-align: middle;
        color: #fff;
        font-weight: bold;
        background-image: url(/common/img/icon-logo01.png);
        background-repeat: no-repeat;
        background-position: left center;
    }

    .ft-menu dd {
        margin-top: 12px;
    }

        .ft-menu dd a {
            color: #fff;
            text-decoration: none;
            text-shadow: 4px 4px 6px rgba(0,0,0,0.75);
            transition: all 0.3s linear;
        }

        .ft-menu dd a:hover {
            opacity: 0.75;
        }

#ft-manu01 {}

    #ft-manu01 dd {
        display: inline-block;
        margin-right: 12px;
    }

#ft-manu02 {}

#copyright {
    clear: both;
    padding-top: 20px;
    text-align: center;
    color: #000;
}

/* adjustment */

sup {
    font-size: 60%;
}

.taL {text-align: left;}
.taC {text-align: center;}
.taR {text-align: right;}

.mt1r {margin-top: 1rem !important;}

.mt00 {margin-top: 0 !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}