@charset "utf-8";
@charset "utf-8";

/*-----------------------------------

home.css
トップページレイアウト

-----------------------------------*/

ul, ol {
    margin: 0;
    padding: 0;
    list-style: none;
}


/*
メインレイアウト
-----------------------------------*/
#side {
    float: right;
    width: 280px;
    padding-top: 8px;
}
.aside { margin-bottom: 40px; }

/*
見出し
-----------------------------------*/
.side_heading01 {
    margin: 0 0 13px;
    color: #717171;
    font-size: 16px;
    font-weight: bold;
}


/*
サイド：共通タブ
-----------------------------------*/
.tab li {
    float: left;
    width: 50%;
}
.tab a {
    display: block;
    padding: 13px 0 10px;
    border-top: 2px solid transparent;
    border-bottom: 1px solid #ededed;
    background: #f7f7f7;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}
.tab a:hover { text-decoration: none; }
.tab .current {
    border-top-color: #46aaff;
    border-bottom-color: transparent;
    background: #fff;
}
/*
サイド：会員登録
-----------------------------------*/
#side .signup {
    padding: 20px 15px 30px;
    border: 1px solid #dedede;
    border-top:2px solid #46aaff;
}
#side .signup p {
    position: relative;
    margin: 0;
    padding-left: 38px;
    letter-spacing: 1.5px;
}
#side .signup p:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 26px;
    height: 26px;
    background: url(/images/tnews/home/sprite.png?20170804) no-repeat 0 -200px;
    content: " ";
}
#side .signup .button { margin-top: 24px; }

/*
サイド：ランキング
-----------------------------------*/
.list_ranking li {
    position: relative;
    height: 90px;
    padding: 14px 4px;
    border-bottom: 1px solid #d6d6d6;
}
.list_ranking p { margin: 0; }
.list_ranking a { font-size: 14px; }

/* 人気求人 */
#job_ranking li { padding-left: 34px; }
#job_ranking .rank {
    position: absolute;
    top: 14px;
    left: 4px;
    color: #46aaff;
    font-weight: bold;
}
#job_ranking a {
    color: #717171;
    font-weight: bold;
    letter-spacing: 1.5px;
    line-height: 16px;
    transition: 0.1s linear;
}
#job_ranking .bl-hover a { color: #46aaff; }
.list_ranking .area,
.list_ranking .salary {
    overflow: hidden;
    margin-top: 3px;
    color: #999999;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.list_ranking .area:before,
.list_ranking .salary:before {
    display: inline-block;
    width: 16px;
    height: 17px;
    margin-right: 10px;
    background: url(/images/tnews/home/sprite.png?20170804) no-repeat 2px -150px;
    content: " ";
    vertical-align: -3px;
}
.list_ranking .area:before { background-position: -48px -150px; }

/* 人気コラム */
#column_ranking li { padding-right: 68px; }
#column_ranking .rank {
    margin-bottom: 10px;
    font-weight: bold;
}
#column_ranking .tag { margin-left: 5px; }
#column_ranking a {
    line-height: 15px;
    letter-spacing: 1.5px;
    transition: 0.1s linear;
}
#column_ranking .bl-hover a { color: #46aaff; }

#column_ranking .image {
    position: absolute;
    top: 14px;
    right: 4px;
    overflow: hidden;
    width: 60px;
    height: 60px;
}

#column_ranking .image img {
    position: relative;
    left: 0;
    max-height: 60px;
}
#column_ranking .image.center img { left: -25%; }
#column_ranking .image.right img { left: -50%; }

/*
サイド：メルマガ
-----------------------------------*/
.list_magazine li {
    padding: 10px 0 15px;
    border-bottom: 1px solid #d6d6d6;
    letter-spacing: 1px;
}
.list_magazine .date {
    margin: 0 0 10px;
    color: #46aaff;
    font-weight: bold;
}
.list_magazine a {
    display: block;
    height: 32px;
    transition: 0.1s linear;
}


/*
サイド：PR
-----------------------------------*/
/* 記事PR */
.side_pr {
    margin-top: -40px;
    padding-top: 14px;
    border-bottom: 1px solid #d6d6d6;
}

.box_pr {
    position: relative;
    min-height: 60px;
    margin: 0 4px 14px;
    padding-right: 75px;
}
.box_pr p {
    margin: 0 0 10px;
    font-weight: bold;
}
.box_pr .tag { margin-left: 5px; }
.box_pr a {
    letter-spacing: 1px;
    line-height: 15px;
    transition: 0.1s linear;
}

.box_pr  .image {
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
    width: 60px;
    height: 60px;
}

.box_pr .image img {
    position: relative;
    left: 0;
    max-height: 60px;
}
.box_pr .image.center img { left: -25%; }
.box_pr .image.right img { left: -50%; }

/* メルマガPR */
#pr_magazine {
    padding: 8px;
    border: 1px solid #dedcdc;
    background: #f7f7f7;
}
#pr_magazine .inner {
    padding: 20px 10px 10px;
    background: #fff;
    letter-spacing: 0.5px;
}
#pr_magazine .title {
    margin: 0 0 20px;
    color: #8d8c8c;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
}
#pr_magazine .title img {
    margin-right: 3px;
    vertical-align: -4px;
}
#pr_magazine .title span {
    color: #46aaff;
    font-size: 17px;
}
#pr_magazine .point {
    color: #9f9f9f;
}
#pr_magazine .point li { margin-bottom: 25px; }
#pr_magazine .point p {
    margin: 0 0 5px;
    color: #717171;
    font-size: 15px;
    font-weight: bold;
    letter-spacing: 1.5px;
}
#pr_magazine .point p:before {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 5px;
    background: url(/images/tnews/home/sprite.png?20170804) no-repeat -100px -200px;
    content: " ";
    vertical-align: -5px;
}

/* バナー */
.box_banner a {
    display: block;
    margin: 40px 0 0;
    text-align: center;
}
.box_banner a:first-child { margin-top: 0; }


/*
ボタン
-----------------------------------*/
.button {
    display: block;
    padding: 15px 0;
    border: none;
    border-bottom: 2px solid #cbcccd;
    border-radius: 3px;
    background: #ededed;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    transition: 0.1s linear;
}
.button:hover {
    text-decoration: none;
    filter:alpha(opacity=70);
    opacity: 0.7;
}

/* 重要遷移ボタン */
.button_decision {
    border-bottom-color: #0b91d6;
    background: #46aaff;
    color: #fff;
}

/*
clearfix
-----------------------------------*/
header:after,
footer:after,
main:after,
section:after,
div:after,
ul:after,
ol:after,
dl:after,
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    font-size: 0;
    visibility: hidden;
}
header, footer, main, section, div, ul, ol, dl,.clearfix { display: inline-block; }
header, footer, main, section, div, ul, ol, dl, .clearfix { display: block; }