@charset "utf-8";

/*------------------------------------------------------------
　共通
-------------------------------------------------------------*/

section[id^="knowhow_"] {
  background: #eeebe6;
}

.top-lead {
  word-break: normal;
  background: #fffefa;
  padding: 15px 10px;
}

section[id^="knowhow_"]>section, #pager {
  padding: 15px 10px 0;
}

section[id^="knowhow_"]>#new>dl>dt, section[id^="sub0"] .tit, section[id^="knowhow_"]>#interview .tit, section[id^="knowhow_"]>#naka .tit, section[id^="knowhow_"]>#recommended>.tit {
  text-indent: -15px;
  text-align: center;
  height: 38px;
  line-height: 38px;
  background: #fff;
  border-radius: 5px;
  position: relative;
  padding: 4px;
  margin: 4px 4px 24px;
}

section[id^="sub0"] .tit h3 {
  font-size: 16px;
}

#new>dl>dt {
  color: #00a0cd;
  border: 2px solid #b2dcec;
}

section[id^="sub0"] .tit {
  color: #e58041;
  border: 2px solid #f2bfa0;
}

#sub02 .tit {
  color: #87d1aa;
  border: 2px solid #c3e8d4;
}

#interview .tit h3, #naka .tit h3, #recommended .tit h3 {
  font-size: 16px;
}

#interview .tit {
  color: #ff8888;
  border: 2px solid #ffc3c3;
}

#naka .tit {
  color: #dc9aea;
  border: 2px solid #edccf4;
}

#recommended .tit {
  color: #f77f64;
  border: 2px solid #fbbfb1;
}

section[id^="knowhow_"]>#new>dl>dt:before, section[id^="knowhow_"]>section[id^="sub0"] .tit:before, section[id^="knowhow_"]>#interview .tit:before, section[id^="knowhow_"]>#naka .tit:before, section[id^="knowhow_"]>#recommended .tit:before {
  content: "";
  width: 100%;
  height: 46px;
  border: 4px solid #fff;
  border-radius: 10px;
  position: absolute;
  top: -6px;
  left: -6px;
  padding: 2px;
}

.icon_contents {
  display: inline-block !important;
  vertical-align: middle;
  margin: -5px 0 0 0;
}

section[id^="knowhow_"]>#new>dl>dt:after, section[id^="knowhow_"]>section[id^="sub0"] .tit:after, section[id^="knowhow_"]>#interview .tit:after, section[id^="knowhow_"]>#naka .tit:after, section[id^="knowhow_"]>#recommended .tit:after {
  content: "";
  width: 21px;
  height: 10px;
  background: url(../images/knowhow/tit_arrow.png) no-repeat;
  background-size: 21px 10px;
  position: absolute;
  bottom: -16px;
  left: 50%;
  margin-left: -10px;
}

li[class$="item"] dl, #column .data {
  overflow: hidden;
}

li[class$="item"] dt, #column .data dt {
  float: left;
}

li[class$="item"] dd, #column .data dd {
  float: left;
  font-size: 12px;
  margin: 0 15px 0 5px;
}

.cat_posi {
  position: absolute;
  top: -8px;
  right: 4px;
}

/*------------------------------------------------------------
　スライダー
-------------------------------------------------------------*/

.slider li {
  color: #a02200;
  font-size: 10px;
  text-align: center;
  width: 78px;
  height: 55px;
  border-right: 1px solid #dacbbc;
  border-bottom: 1px solid #dacbbc;
}

.slider li a {
  color: #a02200;
  display: block;
}

.slider li:first-child {
  border-left: 1px solid #dacbbc;
}

.slider li img {
  margin: 10px auto 0;
}

.slider li:not(.on) {
  background: url(../images/knowhow/bg_nav.png) repeat-x;
  background-size: 1px 55px;
}

li.on {
  background: url(../images/knowhow/bg_navOn.png) repeat-x;
  background-size: 1px 55px;
}

.swiper-container {
  width: 100%;
  height: 55px;
  color: #fff;
  text-align: center;
  background: url(../images/knowhow/bg_nav.png) repeat-x;
  border-bottom: 1px solid #dacbbc;
}

.top-lead+.swiper-container {
  border-top: 1px solid #dacbbc;
}

.swiper-slide {
  color: #a02200;
  font-size: 10px;
  text-align: center;
  height: 55px;
  border-right: 1px solid #dacbbc;
  border-bottom: 1px solid #dacbbc;
  box-sizing: border-box !important;
}

.swiper-slide img {
  display: block;
}

.swiper-slide a {
  color: #a02200 !important;
  display: block;
}

.swiper-wrapper>li:first-child {
  border-left: 1px solid #dacbbc;
}

.swiper-wrapper>li img {
  margin: 10px auto 0;
}

.swiper-wrapper>li:not(.on) {
  background: url(../images/knowhow/bg_nav.png) repeat-x;
  background-size: 1px 55px;
  padding-right: 1px;
}

.swiper-wrapper>li.on {
  background: url(../images/knowhow/bg_navOn.png) repeat-x;
  background-size: 1px 55px;
}

/*------------------------------------------------------------
　最新記事
-------------------------------------------------------------*/

#new>dl>dt {
  font-size: 16px;
  font-weight: bold;
}

#new li[class$="item"] {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
}

#new li[class$="item"]+li {
  margin-top: 15px;
}

#new li[class$="item"] dl {
  margin-bottom: 15px;
}

li[class$="item"] h3 {
  margin-bottom: 10px;
}

li[class$="item"] h3 a {
  color: #a02200;
  font-size: 14px;
  text-decoration: underline;
}

.item {
  position: relative;
  padding: 15px 30px 15px 15px;
}

.item:before {
  content: "";
  width: 10px;
  height: 16px;
  background: url(../images/common/icon_next_bbbbbb.png);
  background-size: 10px 16px;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -8px;
}

.item .clear {
  display: table;
}

.item .clear>img {
  border: 1px solid #a02200;
  display: table-cell;
  vertical-align: top;
}

.item .box_r {
  display: table-cell;
  vertical-align: top;
  padding-left: 15px;
}

/* 最新記事 */

.new_item {
  padding: 15px;
}

.new_item>img {
  border: 1px solid #a02200;
  float: left;
  margin: 0 15px 5px 0;
}

.new_item .tit_list {
  clear: both;
  background: #fffcdf;
  border: 1px solid #e9dbd6;
  border-radius: 10px;
  padding: 10px 10px 8px;
  margin-top: 15px;
}

.new_item .tit_list a {
  color: #f668a8;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.new_item .btn01_1 {
  margin-top: 15px;
}

.new_item .tit_list dl {
  overflow: visible !important;
  margin-bottom: 0 !important;
}

.new_item .tit_list dt {
  color: #f668a8;
  font-weight: bold;
  width: 100%;
  margin-bottom: 10px;
}

.new_item .tit_list dd {
  margin: 0;
}

.tit_list dt, .tit_list dd {
  float: none !important;
}

.new_item ol li {
  color: #f668a8;
  font-size: 14px;
  font-weight: bold;
  list-style-type: decimal;
  margin-left: 25px;
}

.new_item ol li+li {
  margin-top: 5px;
}

.new_item .btn01_1 {
  clear: both;
  height: 38px;
  line-height: 38px;
}

.new_item h3+.btn01_1 {
  margin-top: 54px;
}

.new_item .non_display {
  display: none;
}


/*------------------------------------------------------------
　ページャー
-------------------------------------------------------------*/

#pager {
  text-align: center;
}

#count {
  color: #fff;
  text-align: center;
  background: #4c4c4c;
  border-radius: 20px;
  display: inline-block;
  padding: 5px 18px;
}

#btn_group {
  width: 100%;
  display: table;
  border-collapse: separate;
  border-spacing: 10px 0;
  padding-top: 20px;
}

#btn_group a {
  color: #a02200 !important;
  font-size: 12px;
  width: 50%;
  height: 46px;
  line-height: 46px;
  background: #fff;
  border: 2px solid #d8c8b8;
  border-radius: 5px;
  display: table-cell;
}

#btn_group #prev:before, #btn_group #next:after {
  content: "";
  width: 10px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
}

#btn_group #prev:before {
  background: url(../images/interview/prev.gif) no-repeat;
  background-size: 10px 16px;
  margin: -2px 10px 0 0;
}

#btn_group #next:after {
  background: url(../images/interview/next.gif) no-repeat;
  background-size: 10px 16px;
  margin: -2px 0 0 10px;
}

#pager+#sub01, #new+#sub01 {
  border-top: 1px solid #d3c6af;
  margin-top: 15px;
}

/*------------------------------------------------------------
　よく読まれている記事
-------------------------------------------------------------*/

section[id^="sub0"] ul {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
  padding: 0 15px;
}

.sub_item {
  width: 100%;
  display: table;
  padding: 15px 0;
}

.sub_item>img {
  display: table-cell;
  vertical-align: top;
  padding-right: 10px;
}

.sub_item .box_r {
  width: 100%;
  display: table-cell;
  vertical-align: top;
}

.sub_item .box_r a {
  color: #a02200;
  font-weight: bold;
  text-decoration: underline;
}

.sub_item dl {
  margin-top: 4px;
}

.sub_item+li {
  border-top: 1px dashed #d3c6af;
}

/*------------------------------------------------------------
　インタビュー 中の人 共通
-------------------------------------------------------------*/

#interview .interview_box, #naka .naka_box {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
  padding: 15px;
}

#interview li .clear, #naka li .clear {
  display: table;
}

#interview li .clear>img, #naka li .clear>img {
  display: table-cell;
  vertical-align: top;
}

#interview li .box_r, #naka li .box_r {
  display: table-cell;
  vertical-align: top;
}

#interview li img+.box_r {
  padding-left: 10px;
}

#interview li .box_r a, #naka li .box_r a {
  color: #a02200;
  font-size: 16px;
  font-weight: bold;
  text-decoration: underline;
  display: block;
  margin-bottom: 10px;
}

#interview li .clear~div, #naka li .clear~div {
  font-size: 12px;
}

#interview .box, #naka .box {
  border-top: 1px dashed #d3c6af;
  padding-top: 15px;
  margin-top: 15px;
}

#interview .btn01_1, #naka .btn01_1 {
  heigth: 38px;
  line-height: 38px;
}

/*------------------------------------------------------------
　インタビュー
-------------------------------------------------------------*/

#interview li .box_r a span {
  font-size: 14px;
}

#interview li .box_r dl {
  display: table;
  margin-bottom: 5px;
}

#interview li .box_r dt {
  display: table-cell;
  vertical-align: top;
}

#interview li .box_r dd {
  display: table-cell;
  padding-left: 4px;
}

/*------------------------------------------------------------
　中の人
-------------------------------------------------------------*/

#naka li .box_r div {
  margin-bottom: 5px;
}

/*------------------------------------------------------------
　今日のおすすめ求人
-------------------------------------------------------------*/

#recommended ul {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
  padding: 0 15px;
}

#recommended li {
  padding: 15px 0;
}

#recommended li+li {
  border-top: 1px dashed #d3c6af;
}

#recommended a {
  color: #a02200;
  font-weight: bold;
  text-decoration: underline;
  background: #fff5b6;
  display: block;
  padding: 10px;
}

#recommended .data {
  font-size: 12px;
  margin: 10px 0;
}

#recommended img {
  margin-bottom: 10px;
}

/*------------------------------------------------------------
　ナビ
-------------------------------------------------------------*/

#knowhow_nav {
  background: #fffefa;
  padding: 15px 10px 20px;
  margin-top: 15px;
}

#knowhow_nav li {
  color: #a02200;
  font-weight: bold;
  text-indent: 35px;
  height: 48px;
  line-height: 48px;
  border: 1px solid #dacbbc;
  border-radius: 10px;
  position: relative;
  padding: 2px;
}

#knowhow_nav li+li {
  margin-top: 5px;
}

#knowhow_nav li:before {
  content: "";
  width: 8px;
  height: 13px;
  background: url(../images/common/icon_next_a02200.png) no-repeat;
  background-size: 8px 13px;
  position: absolute;
  top: 50%;
  left: 20px;
  margin-top: -7px;
}

#knowhow_nav li:after {
  content: "";
  width: 43px;
  height: 31px;
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -16px;
}

#nav00:after {
  background: url(../images/knowhow/icon_category00.png) no-repeat;
  background-size: 43px 31px;
}

#nav01:after {
  background: url(../images/knowhow/icon_category01.png) no-repeat;
  background-size: 43px 31px;
}

#nav02:after {
  background: url(../images/knowhow/icon_category02.png) no-repeat;
  background-size: 43px 31px;
}

#nav03:after {
  background: url(../images/knowhow/icon_category03.png) no-repeat;
  background-size: 43px 31px;
}

#knowhow_nav li a {
  color: #a02200;
  font-weight: bold;
  background: #f7f4ee;
  border-radius: 7px;
  display: block;
}

/*------------------------------------------------------------
　リスト
-------------------------------------------------------------*/

#knowhow_list h2[id^="tit_cat"] {
  color: #fff;
  font-size: 16px;
  text-align: center;
  height: 64px;
  line-height: 64px;
}

#tit_cat10 {
  text-indent: 26px;
  background: #fffefa url(../images/knowhow/tit_cat01.png) no-repeat center bottom;
  background-size: 300px 54px;
}

#tit_cat20 {
  text-indent: 19px;
  background: #fffefa url(../images/knowhow/tit_cat02.png) no-repeat center bottom;
  background-size: 300px 54px;
}

#tit_cat30 {
  text-indent: 29px;
  background: #fffefa url(../images/knowhow/tit_cat03.png) no-repeat center bottom;
  background-size: 300px 54px;
}

/*------------------------------------------------------------
　詳細
-------------------------------------------------------------*/

#knowhow_details {
  padding-top: 15px;
}

#column {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
  padding: 25px 15px;
  margin: 0 10px;
}

#column h2 {
  color: #a02200;
  font-size: 16px;
}

.clock {
  font-size: 12px;
  text-align: center;
  height: 25px;
  line-height: 25px;
  background: #f5f3f0;
  margin-bottom: 15px;
}

.clock:before {
  content: "";
  width: 15px;
  height: 15px;
  background: url(../images/knowhow/icon_clock.png) no-repeat;
  background-size: 15px 15px;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 5px 0 0;
}

.clock span {
  color: #dd0000;
  font-size: 14px;
  font-weight: bold;
  margin: 0 4px;
}

#column .data {
  margin: 15px 0;
}

#column+section[id^="sub0"] {
  border-top: 1px solid #d3c6af;
  margin-top: 15px;
}

/*------------------------------------------------------------
　コラム
-------------------------------------------------------------*/

#column .tit_list {
  clear: both;
  color: #f668a8;
  font-weight: bold;
  background: #fffcdf;
  border: 1px solid #e9dbd6;
  border-radius: 5px;
  padding: 10px;
}

#column .tit_list dt {
  margin-bottom: 10px;
}

.tit_list dd+dt {
  margin-top: 20px;
}

.column_nav li+li .column_head {
  display: inline-block;
  margin-top: 20px;
}

.column_subHead {
  display: inline-block;
  margin: 10px 0 0 20px;
}

.column_subHead li a {
  font-size: 12px;
}

.column_p {
  display: block;
}

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

#column ol li {
  list-style-type: decimal;
  margin-left: 25px;
}

#column ol li+li {
  margin-top: 5px;
}

#column p span {
  font-weight: bold;
}

.list_disc li {
  list-style-type: disc;
  margin-left: 20px;
}

.list_disc li+li {
  margin-top: 25px;
}

#column h3 {
  color: #934b30;
  font-size: 14px;
  font-weight: bold;
  background: url(../images/knowhow/tit_column.png) center 0;
  border-bottom: 4px solid #934b30;
  padding: 10px;
  margin-top: 30px;
}

#column h4 {
  color: #934b30;
  font-size: 14px;
  background: #fefced;
  border: 1px solid #fae3a7;
  padding: 10px;
}

#column .img_box img {
  margin: 0 auto;
}

.comparison {
  display: table;
}

.comparison dt {
  color: #934b30;
  font-weight: bold;
  white-space: nowrap;
  display: table-cell;
  padding-right: 10px;
}

.comparison dd {
  display: table-cell;
}

#column>*+*, #column #midashi_start>*+* {
  margin-top: 25px;
}

.matome {
  margin-top: 30px !important;
}

#column .btn01_1 {
  height: 38px;
  line-height: 38px;
  display: block;
}

#column p a {
  color: #a02200;
  text-decoration: underline;
}

.related_article {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 10px;
}

.related_article dt {
  background: url(../images/knowhow/icon_related.png) no-repeat;
  background-size: 18px 18px;
  padding-left: 25px;
  margin-bottom: 10px;
}

.related_article li {
  border-top: 1px dashed #ddd;
  list-style-type: none !important;
  padding-top: 10px;
  margin-left: 0 !important;
}

.related_article li+li {
  margin-top: 15px !important;
}

.related_article li a {
  font-weight: normal;
}

#column a {
  color: #a02200;
  text-decoration: underline;
}

#column .tit_list a {
  color: #f668a8;
}

.disc {
  padding-left: 1.5em;
}

.disc>* {
  list-style-type: disc;
}

.c_m {
  margin-top: 20px;
}

.mt10 {
  margin-top: 10px !important;
}

/*------------------------------------------------------------
　特集エリアリンク
-------------------------------------------------------------*/

.feature {
  border: 1px solid #cfcfcf;
}

.feature li {
  display: table;
  padding: 10px;
}

.feature li+li {
  border-top: 1px solid #cfcfcf;
}

.box_table {
  width: 100%;
  display: table-cell;
  vertical-align: top;
  padding-left: 10px;
}

.box_table a {
  font-weight: bold;
  display: block;
  padding-bottom: 5px;
}

.box_table div {
  font-size: 12px;
}

/*------------------------------------------------------------
　詳細ページ next,prev
-------------------------------------------------------------*/

.knowhow_changedPage {
  width: 100%;
}

.knowhow_changedPage a {
  text-align: center;
}

.knowhow_changedPage a {
  width: 48%;
  height: 50px;
  line-height: 48px;
  border: 2px solid #ccc;
  border-radius: 5px;
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.knowhow_changedPage a+a {
  margin-left: 6px;
}

.knowhow_changedPage a:first-child:before {
  content: "<";
  font-size: 16px;
  display: inline-block;
  margin: 0 5px 0 0;
}

.knowhow_changedPage a:last-child:after {
  content: ">";
  font-size: 16px;
  display: inline-block;
  margin: 0 0 0 5px;
}

.knowhow_changedPage_none {
  visibility: hidden;
}

.center {
  text-align: center;
}

.link_top img {
  margin-top: 15px;
}

/* blog */

.row {
  width: 100%;
  display: table;
}

.box_blog .img {
  width: 52px;
  height: 52px;
  overflow: hidden;
}

.box_blog .box_r {
  width: 100%;
  display: table-cell;
  vertical-align: top;
}

.box_blog .img+.box_r {
  padding-left: 20px;
}

.box_blog .box_r>*+* {
  margin-top: 10px;
}

.box_blog .ttl a {
  font-size: 16px;
  font-weight: bold;
}

.item_blog .data {
  font-size: 12px;
  margin-top: 10px;
}

/*------------------------------------------------------------
　フリーワード検索
-------------------------------------------------------------*/

.top_search_free {
  border-top: 1px solid #d6d6d6;
  padding: 30px 10px;
}

.search_free {
  display: table;
  border-spacing: 10px 0;
}

div[class^="search_free_"] {
  display: table-cell;
  vertical-align: top;
}

.search_free_l {
  width: 100%;
}

input[name="qs"] {
  width: 100%;
  height: 30px;
  border: 1px solid #bfbfbf;
  padding: 0 10px;
}

.btn_search_free {
  width: 70px;
  height: 30px;
  text-indent: -100px;
  overflow: hidden;
  background: url(../images/qa/btn_search.png) no-repeat;
  background-size: 70px 30px;
  display: block;
}

/*------------------------------------------------------------
　検索結果
-------------------------------------------------------------*/

.comp, .search_results {
  text-align: center;
  background: #fff;
  border: 1px solid #dcdbd7;
  border-radius: 5px;
  padding: 20px 0;
}

.comp {
  margin: 20px 10px 0;
}

.search_results {
  position: relative;
  margin: 20px 10px;
}

.arrow:before {
  content: "";
  width: 24px;
  height: 22px;
  background: url(../images/qa/arrow_results.png) no-repeat;
  background-size: 9px 9px;
  position: absolute;
  bottom: -22px;
  left: 50%;
  margin-left: -5px;
}

.comp h2, .search_results h2 {
  font-size: 12px;
  font-weight: normal;
  line-height: 28px;
  padding: 0 20px;
}

.comp h2 span, .search_results h2 span {
  font-size: 16px;
  font-weight: bold;
  margin: 0 2px;
}

.qa_em {
  color: #ff3d94;
}

.comp_txt, .search_results_txt {
  font-size: 12px;
  border-top: 2px dashed #dcdcdc;
  padding-top: 20px;
  margin: 20px 20px;
}

.search_results_txt span {
  color: #ff3d94;
  font-size: 14px;
  font-weight: bold;
  margin-right: 5px;
}