@charset "utf-8";
.ttl1_new::before,
.ttl1_list::before{
	position: absolute;
	top: 50%;
	left: 10px;
	overflow: hidden;
	width: 35px;
	height: 35px;
	margin-top: -18px;
	background-image: url(../images/manga/icon-top.png);
	background-size: 35px 70px;
	content: "";
}
.ttl1_new,
.ttl1_list{
  background: #ffd76b;
}
.ttl1_list::before{
  background-position: 0 -35px;
}
h2[class^="ttl1_"],
.ttl1_new,
.ttl1_list{
	position: relative;
  font-size: 16px;
  height: 50px;
  padding-left: 55px;
  box-shadow: 0 2px 0 #ffa320 inset;
  line-height: 50px;
}
.ttl_gray{
  color: #fff;
  height: 40px;
  line-height: 40px;
  background: #4c4c4b;
  border-top: 2px solid #333;
  margin-bottom: 10px;
  padding-left: 10px;
}

.item{
  width: 100%;
  display: table;
  padding:10px 30px 10px 10px;
  position:relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.item+.item{
  border-top: 1px solid #d2d2d2;
}
.item>*{
  display: table-cell;
  vertical-align: top;
}
.item:before{
  content: "";
  width:10px;
  height: 10px;
  border-top:2px solid #c3c3c3;
  border-right:2px solid #c3c3c3;
  transform:rotate(45deg);
  position:absolute;
  top:50%;
  right:10px;
  margin-top: -6px;
}
.item_r{
  width: 100%;
  padding-left: 10px;
}
.item_r>*+*{
  margin-top: 10px;
}
.item_r .cat,
.item_r .number{
  color: #fff;
  font-size: 12px;
  height: 14px;
  line-height: 14px;
  background: #4c4c4b;
  border-radius: 3px;
  margin-right: 10px;
  padding: 1px 10px;
}
.item_r .date{
  font-size:12px;
  display: inline-block;
  vertical-align: middle;
}
.item_data>*+*{
  margin-left: 10px;
}
.item_r .ttl{
  font-weight: bold
}

.li_top_li{
  padding: 15px 10px 0;
}
.li_top_li>*{
  margin-bottom: 15px;
  padding: 5px;
  border:1px solid #ffd76b;
  border-radius: 5px;
  background:#fff6de;
}
.newest{
  position: relative;
  overflow: hidden;
  max-height: 538px;
}
.overlay{
  width: 100%;
  background: rgba(0, 0, 0, .5);
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}
.newest .overlay{
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  height: 45px;
  font-size: 16px;
  line-height: 45px;
}
.newest .overlay:before{
  position: absolute;
  right: 15px;
  bottom: 15px;
  width:10px;
  height: 10px;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
  transform:rotate(45deg);
  content: "";
}
.newest .overlay a{
  display: block;
  color: #fff;
  text-decoration: none;
}

.top_li{
  margin-bottom: 20px;
}
.li_top_li .info{
  padding: 10px 5px;
  background: #fff;
}
.li_top_li .ttl{
  margin-bottom: 10px;
}
.li_top_li .ttl a{
  font-size: 16px;
  color: #fb5e83;
  text-decoration: none;
}
.li_top_li .btn_manga{
  display: block;
  width: 170px;
  height:40px;
  margin: 10px auto 0;
  border:1px solid #ffac2d;
  border-radius: 5px;
  box-shadow: 0 2px 0 #fff inset, -2px 0 0 #fff inset, 0 -2px 0 #fff inset, 2px 0 0 #fff inset;
  background:#ffac2d;
  color: #fff;
  font-weight: bold;
  text-align:center;
  line-height: 40px;
  cursor: pointer;
}

/* details */
.ttl2{
  font-size: 14px;
  text-align: center;
  background: #ffd76b;
  border-top: 2px solid #ffa320;
  padding: 10px;
}

/* pager */
.pagination_manga{
  padding: 20px 10px;
}
.pagination_manga>*{
  float: left;
  text-align: center;
  position: relative;
  border: 1px solid #d8c8b8;
  border-radius: 5px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 85px;
}
.pagination_manga>*+*{
  margin-left: 5%;
}
.pagination_manga>* a{
  display: block;
  height: 60px;
  color: #a02200;
  font-size: 12px;
  font-weight: bold;
}
.pagination_manga>*.disabled{
  border: 1px solid #a7a7a7;
}
.pagination_manga>*.disabled:before{
  border-color: #a7a7a7;
}
.pagination_manga>*.disabled a{
  cursor: default;
  color: #a7a7a7;
}
.page_item_prev,
.page_item_next{
  width: 35%;
}
.page_item_menu{
  width: 20%;
  background: url(../images/manga/icon_menu.png) no-repeat center 10px;
  background-size: 15px 19px;
}
.page_item_prev:before,
.page_item_next:before{
  position:absolute;
  top: 10px;
  left: 50%;
  width:10px;
  height: 10px;
  border-top:2px solid #a02200;
  border-right:2px solid #a02200;
  content: "";
}
.page_item_prev:before{
  transform:rotate(-135deg);
  margin-left: -2px;
}
.page_item_next:before{
  transform:rotate(45deg);
  margin-left: -10px;
}
.pagination_mangaIndex{
  border-bottom: 1px solid #ffd76b;
}
.pagination_mangaIndex>*{
  float: left;
  text-align: center;
  width: 50%;
  height: 60px;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 60px;
}
.pagination_mangaIndex>*+*{
  border-left: 1px solid #ffd76b;
}
.pagination_mangaIndex>* a{
  display: block;
  position: relative;
  color: #5f99eb;
  font-weight: bold;
  text-decoration: underline;
}
.pagination_mangaIndex>* a:before{
  position:absolute;
  top: 50%;
  right: 15px;
  width:8px;
  height: 8px;
  margin-top: -6px;
  border-top:2px solid #c3c3c3;
  border-right:2px solid #c3c3c3;
  content: "";
}
.pagination_mangaIndex>* a:before{
  transform:rotate(45deg);
}

.cartoonist{
  padding: 10px 10px 10px 76px;
  margin: 0 10px 20px;
}
.mokori{
  background: #f1f0e4 url(../images/manga/mokori.png) no-repeat 10px center;
  background-size: 56px 56px;
}
.cartoonist .name{
  margin-bottom: 10px;
  padding-left: 25px;
  border-bottom: 1px solid #919191;
  background: url(../images/manga/icon_cartoonist.png) no-repeat 0 bottom;
  background-size: 15px 15px;
  font-weight: bold;
}

/* backNumber */
.backNumber{
  margin-bottom: 20px;
}
.backNumber .li_item_backNumber{
  border: 1px solid #c5c5c5;
  margin: 0 10px;
}
.backNumber .item:after{
  content: "";
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-right: 5px solid #ffa320;
  border-bottom: 5px solid #ffa320;
  position: absolute;
  right: 0;
  bottom: 0;
}
.backNumber .item a{
  color: #5f99eb;
  text-decoration: underline;
}
.mangaIndex_summary dt{
  font-weight: bold;
  height: 40px;
  line-height: 40px;
  background: url(../images/manga/icon_summary.png) no-repeat 10px center;
  background-size: 18px 12px;
  border-bottom: 1px solid #ffd76b;
  margin-bottom: 10px;
  padding-left: 38px;
}
.mangaIndex_summary dd{
  margin: 0 10px 20px;
}

/* character */
.character{
  margin-bottom: 20px;
}
.li_item_character{
  border-bottom: 1px solid #c3c3c3;
  padding: 0 10px;
}
.li_item_character>.item+.item{
  border-top: 1px dashed #d2d2d2;
}
.li_item_character .item{
  padding: 10px;
}
.li_item_character .item:before{
  content: none;
}
.li_item_character .name{
  margin-bottom: 10px;
}
.li_item_character .name span{
  margin-right: 10px;
  font-weight: bold;
}

/* recruit */
.searchJob_recommend{
  margin-bottom: 10px;
}
.searchJob_nationwide{
  margin-bottom: 20px;
}
h2[class^="ttl_searchJob_"]{
  font-size: 16px;
  text-align: center;
  height: 40px;
  line-height: 40px;
  margin-bottom: 10px;
  padding: 0 10px;
}
h2[class^="ttl_searchJob_"]:before{
  display: inline-block;
  margin: -2px 10px 0 0;
	background-image: url(../images/manga/icon-sub.png);
	background-size: 18px 30px;
  vertical-align: middle;
  content: "";
}
.ttl_searchJob_recommend{
  color: #f9b552;
  border-top: 2px solid #f9b552;
  border-bottom: 2px solid #f9b552;
}
.ttl_searchJob_nationwide{
  color: #58c794;
  border-top: 2px solid #58c794;
  border-bottom: 2px solid #58c794;
}
.ttl_searchJob_recommend:before{
  width: 18px;
  height: 15px;
}
.ttl_searchJob_nationwide:before{
  width: 15px;
  height: 15px;
  background-position: 0 -15px;
}

/* searchJob_recommend */
.item_searchJob_recommend{
  background: #fffcad;
  border: 1px solid #f8b551;
  border-radius: 5px;
  padding: 5px;
}
.item_searchJob_recommend .box{
  background: #fff;
  border-radius: 5px;
  padding: 10px 5px;
}
.item_searchJob_recommend .box>*+*{
  margin-top: 10px;
}
.li_search_data{
  font-size: 0;
  height: 15px;
	line-height: 15px;
	white-space: nowrap;
}
.li_search_data>*+*{
  margin-left: 5px;
}
span[class^="item_search_data"]{
	font-size:10px;
	font-weight:normal;
	text-align:center;
	display:inline-block;
	vertical-align:top;
	border-radius:3px;
	padding:0 5px;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
.item_search_data1{
	background:#fff387;
}
.item_search_data2{
	background:#fff9c3;
}
.item_search_data3{
	border:1px solid #f3dd87;
}
.li_searchJob_recommend{
  margin: 0 10px;
}
.li_searchJob_recommend>*+*{
  margin-top: 10px;
}
.li_searchJob_recommend .row{
  width: 100%;
  display: table;
}
.li_searchJob_recommend .row>*{
  display: table-cell;
  vertical-align: top;
}
.item_searchJob_recommend .img{
  padding-right: 10px;
}
.item_searchJob_recommend .shop{
  width: 100%;
}
.item_searchJob_recommend .shop a{
  color: #ff6686;
  font-size: 12px;
  text-decoration: underline;
}

/* searchJob_area */
.li_searchJob_area{
  margin-top: -10px;
  padding: 5px 5px 0;
}
.li_searchJob_area>*{
  float: left;
  width: 50%;
  padding: 5px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.li_searchJob_area>* a{
  font-size: 12px;
  font-weight: bold;
  height: 40px;
  line-height: 40px;
  border: 2px solid #6ee1ac;
  border-radius: 3px;
  display: block;
  padding: 0 10px;
  position: relative;
}
.li_searchJob_area>* a:before{
  content: "";
  width: 7px;
  height: 12px;
  background: url(../images/common/arrow/arrow_r_14_24.png);
  background-size: 7px 12px;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -6px;
}
.fade{
  opacity: 0;
  transition: 3s ease-out;
}
.fade_in{
  opacity: 1;
}
.manga_link a{
	display: block;
	width: 260px;
	height: 40px;
	margin: 0 auto 20px;
	border-radius: 40px;
	background: #646464;
	line-height: 40px;
	color: #fff;
	text-align: center;
	text-decoration: none;
}
.manga_link a:before{
	display: inline-block;
	width: 0;
	height: 0;
	margin: 0 15px 0 0;
	border: 6px solid transparent;
	border-right: 6px solid #fff;
	vertical-align: middle;
	content: "";
}
.coming_soon::before{
	display: none;
}
.coming_soon .ttl{
	color: #483427;
}