@charset "utf-8";
/* CSS Document */


/*===============================

    common

================================*/
:root { font-size: 62.5%; }/* 1(r)em = 10px */

body {
  color: #333;
  font-family:YuGothic , '游ゴシック' , 'Hiragino Kaku Gothic ProN' , 'ヒラギノ角ゴ ProN' , Meiryo , 'メイリオ' , sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  height: 100%;
  text-align: left;
  width: 100%;
}

#cont { margin: 0; }

.wrapper {
  margin: 20px auto 0;
  /*overflow:hidden;*/
  text-align: left;
  width: 980px;
}

.u_fw-bold { font-weight: bold; }

/*===============================

    コンテンツ

================================*/
.container {
  float: right;
  width: 730px;
}

.trendWordContainer {}

.headerTtl {
  margin-bottom: 20px;
  position: relative;
}

.headerTtl > img { display: block; }

.flatTxtBox {
  font-size: 16px;
  line-height: 1.5;
}

.flexCont {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin: 35px 0;
}

.flexCont_inner {
  margin-bottom: 40px;
  width: 45%;
}

/*
    見出し
================================*/
.headingTtl {}

.headingTtl-gradation {
  background-image: linear-gradient(white, #DCDDDD);
  font-family: "游明朝", sans-serif;
  font-size: 25px;
  font-weight: 700;
  margin: 80px 0 30px;
  padding: 10px 0;
  text-align: center;
}

.headingTtl-gradation > span {
  font-size: 16px;
  display: block;
  line-height: 1.5;
}


/*
    今月のトレンドワード
================================*/
.mainTopicContainer {
  margin-bottom: 50px;
}

.mainTopic {
  background-color: #192746;
  color: #fff;
  float: left;
  margin-top: -70px;
  padding: 20px;
  position: relative;
  width: 53%;
}

.mainTopic_ttl {
  color: #fff;
  font-family: "游明朝", sans-serif;
  font-size: 25px;
  margin-bottom: 10px;
}

.mainTopic_ttl > span {
  font-size: 50px;
}

.mainTopic_subTtl {
  color: #fff; 
  font-family: "游明朝", sans-serif;
  font-size: 35px;
  margin-bottom: 10px;
}

.mainTopic_txt {
  font-size: 13px;
  line-height: 1.5;
}

.mainTopic_txt + .mainTopic_txt { margin-top: 20px; }

.mainTopic a {
  color: #fff;
}

.mainTopic a:hover {
  color#fff;
  text-decoration: underline;
}


/* Pick Up */
.pickUpBox {
  float: right;
  margin: 25px 0;
  width: 43%;
}

.pickUpBox_ttl {
  border-bottom: 1px solid #333;
  font-family: "游明朝", sans-serif;
  font-size: 21px;
  display: inline-block;
  margin-bottom: 20px;
}

.pickUpBox_list {}

.pickUpBox_list_wrap {}

.pickUpBox_list_wrap + .pickUpBox_list_wrap { margin-top: 10px; }

.pickUpBox_list_ttl {
  line-height: 1.3;
  margin-bottom: 10px;
  /*padding-left: 1em;
  text-indent: -1em;*/
}


/* ul */
.pickUpList {}

.pickUpList_item {
  font-size: 13px;
  line-height: 1.3;
  padding-left: 1em;
  text-indent: -1em;
}

.pickUpList_item > a {
  color: #3864ce;
  transition: .3s;
}

.pickUpList_item > a:hover {
  opacity: .6;
  text-decoration: none;
}


.pickUpList_item + .pickUpList_item { margin-top: 5px; }


/*
    ランキング
================================*/
.rankingCatTtl {
  color: #192746;
  font-family: "游明朝", sans-serif;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
  position: relative;
}

.rankingCatTtl > span {
  background-color: #fff;
  display: inline-block;
  padding: 10px 15px 10px 0;
  position: relative;
  z-index: 2;
}


.rankingCatTtl::after {
  border-top: 1px solid #192746; 
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 100%;
  z-index: 1;
}

.rankingList {}

/* トレンドキーワード10 */
.rankingList.column {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr 10px 1fr 10px 1fr 10px 1fr 10px 1fr;
  grid-template-rows: repeat(5, 1fr);
  -ms-grid-columns: 1fr 10px 1fr;
  grid-template-columns: repeat(2, 1fr);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  grid-auto-flow: column;
  grid-gap: 10px 10px;
  margin-bottom:30px;
  width: 100%;
}.rankingList.column > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}.rankingList.column > *:nth-child(2) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}.rankingList.column > *:nth-child(3) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}.rankingList.column > *:nth-child(4) {
  -ms-grid-row: 7;
  -ms-grid-column: 1;
}.rankingList.column > *:nth-child(5) {
  -ms-grid-row: 9;
  -ms-grid-column: 1;
}.rankingList.column > *:nth-child(6) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}.rankingList.column > *:nth-child(7) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}.rankingList.column > *:nth-child(8) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}.rankingList.column > *:nth-child(9) {
  -ms-grid-row: 7;
  -ms-grid-column: 3;
}.rankingList.column > *:nth-child(10) {
  -ms-grid-row: 9;
  -ms-grid-column: 3;
}

.rankingList_item {
  font-family: "游明朝", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: relative;
}

.rankingList_item + .rankingList_item { margin-top: 10px; }

/*.rankingList_item:first-of-type,
.rankingList_item:nth-of-type(2),
.rankingList_item:nth-of-type(3) {
  font-size: 20px;
}*/


.column .rankingList_item::before {
  height: 31px;
  width: 64px;
}

.rankingList_item::before {
  background-size: contain;
  background-repeat: no-repeat;
  content: "";
  display: inline-block;
  height: 26px;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  width: 54px;
}
.rankingList_item:first-of-type::before { background-image: url("../../img/ranking/trend-keyword-01.png");}
.rankingList_item:nth-of-type(2)::before { background-image: url("../../img/ranking/trend-keyword-02.png");}
.rankingList_item:nth-of-type(3)::before { background-image: url("../../img/ranking/trend-keyword-03.png");}
.rankingList_item:nth-of-type(4)::before { background-image: url("../../img/ranking/trend-keyword-04.png");}
.rankingList_item:nth-of-type(5)::before { background-image: url("../../img/ranking/trend-keyword-05.png");}
.rankingList_item:nth-of-type(6)::before { background-image: url("../../img/ranking/trend-keyword-06.png");}
.rankingList_item:nth-of-type(7)::before { background-image: url("../../img/ranking/trend-keyword-07.png");}
.rankingList_item:nth-of-type(8)::before { background-image: url("../../img/ranking/trend-keyword-08.png");}
.rankingList_item:nth-of-type(9)::before { background-image: url("../../img/ranking/trend-keyword-09.png");}
.rankingList_item:nth-of-type(10)::before { background-image: url("../../img/ranking/trend-keyword-10.png");}


.column .rankingList_item > a {
  border-bottom: 1px solid transparent;
  color: #333;
  display: inline-block;
  line-height: 1.2;
  padding: 10px 0 10px 80px;
  width: 100%;
}

.rankingList_item > a {
  border-bottom: 1px solid transparent;
  color: #333;
  display: inline-block;
  line-height: 1.2;
  padding: 10px 0 10px 70px;
  width: 100%;
}

.rankingList_item > a:hover {
  border-bottom: 1px solid #333;
  text-decoration: none;
}


/*
    ランキングのバックナンバー
================================*/
.backnumberListBox {
  display: inline-block;
  font-family: "游明朝", sans-serif;
  padding: 10px;
  vertical-align: top;
  width: calc(100% / 5);
}

.backnumberListBox_ttl {
  border-bottom: 1px solid #333;
  display: inline-block;
  font-size: 21px;
  margin-bottom: 15px;
  padding-bottom: 3px;
}


.backnumberList {
  font-size: 1.5rem;
  margin-bottom: 30px;
}

.backnumberList > li {}

.backnumberList > li + li { margin-top: 10px; }

.backnumberList > li > a {
  color: #333;
  transition: .3s;
}

.backnumberList > li > a:hover {
  opacity: .6;
  text-decoration: none;
}


/*.backnumberListBox {
  display: inline-block;
  font-family: "游明朝", sans-serif;
  padding: 10px;
  vertical-align: top;
  width: calc(100% / 5);
}

.backnumberListBox_ttl {
  border-bottom: 1px solid #333;
  display: inline-block;
  font-size: 21px;
  margin-bottom: 15px;
  padding-bottom: 3px;
}


.backnumberList {
  font-size: 1.5rem;
  margin-bottom: 30px;
}

.backnumberList > li {}

.backnumberList > li + li { margin-top: 10px; }

.backnumberList > li > a {
  color: #333;
  transition: .3s;
}

.backnumberList > li > a:hover {
  opacity: .6;
  text-decoration: none;
}*/




/*
    新作研修のバックナンバー
================================*/
.headingTtl-new {
  font-size: 25px;
  margin: 40px 0 30px;
  text-align: center;
}

.headingTtl-new::after {
  content: url("../../img/ranking/toreken_new.png");
  height: 39px;
  padding-left: 20px;
  width: 53px;
}

.p_w500{width:500px;letter-spacing:-0.5em;margin:-10px;}
.w600 > #contact_box{width:500px;margin:0 auto;}
.p_w100per{width:100%;}
.p_cat_list{font-size:10px;}
.p_indetnt-bottomList{padding-left:3.1em;text-indent:-3.1em;}
.p_va-tag{vertical-align:-2px;}
.is_dropdown_btn:hover{cursor:pointer;text-decoration:underline;}
.is_new_training_list a:before{content:"[派遣]";}
.is_new_training_list a[href*="/bup/"]:before{content:"[公開]";}
.p_w100per > .c_col_2{display:inline-block;vertical-align:top;width:20%;padding:10px;}
.kenshu_flow_banner dt b {padding: 8px 0px 7px 0px;margin-bottom: 0;font-size: 14px;}
.p_display_bl{display:block;}
.p_fs_13 { font-size: 13px; line-height: 1.3; }
.p_fs_18 { font-size: 18px; font-weight: 700; line-height: 1.8; }

/*===============================

    ★★レスポンシブ

================================*/
@media screen and (max-width:768px) {
.wrapper { width: 100%; }

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

.trendWordContainer p {
  text-align: justify;
  text-justify: inter-ideograph;
  word-break: break-all;
}

.rankingList {
  margin-bottom: 0;
  width: 100%;
}


}/* @media */
@media screen and (max-width: 768px) {
  #cont { margin: 0 10px; }
}

@media screen and (max-width:600px) {
.rankingList.column { display:block; }
.flexCont_inner { width: 100%; }
}/* @media */

@media screen and (max-width:599px) {
.mainTopic { float: none;margin-top: 0;width: 100%; }
.pickUpBox { float: none;width: 100%; }
.backnumberListBox { width: auto; }
}/* @media */