@charset "UTF-8";
/* books2206.css
  /shared/css/books2206.css
  for /hanbai/books/...
  2022-06-22 - CQ Publishing Co.,Ltd./mng
       07-29 - add search button
  2022-12-13 - clamp font-size
       
  bootstrap5 breakpoints
    sm   576px  small  - smartphone
    md   768px  medium - tablet
    lg   992px  large  - pc
*/


html {
  min-width: 260px;
  max-width: 960px;
  margin: 0 auto;
  background: gainsboro;
  
}

#wrapper {
  /* containter-fluid */
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  
  padding: 0 0 60px 0; /* 10px + 50px */
  
  min-height: 100vh;
  position: relative;
}

#footer {
  background-color: #333333;
  margin-top: 10px;
  line-height: 50px;
  
  font-size: 0.8rem;
  font-size: clamp(12px, 0.8rem, 18px);
  
  color: #cccccc;
  white-space: nowrap;
  overflow: hidden;
  
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
  z-index: 5;
}


/* font-family */
body {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothinc ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.ffsans {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothinc ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.ffserif {
  font-family: "Times New Roman", "Hiragino Mincho ProN",  "YuMincho", serif;
}


/* back to top button */
#btn-back-to-top {
  position: fixed; 
  /*position: relative;*/
  bottom: 1%; /* 8px; */
  right: 1%; /* 8px; */
  display: none;
  z-index: 10;
}


/* ---- import form hanbai_css.css */
.categorylist {
  margin-bottom: 2px;
  margin-left: 20px;
  font-size: 1.2em;
}

.categorylist li {
  display: inline;
  margin-right: 8px;
  list-style-type: none;
}

#header {
  font-size: 16px;
  
}

#navmenu1 {
  font-size: clamp(12px, 0.9rem, 18px);
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  /*margin-bottom: 0.5rem;*/
  margin-bottom: 0.5em;
  /*box-shadow: 0 0.125rem 0.25rem #cccccc;*/
  box-shadow: 0 0.125em 0.25em #cccccc;
  background-color: #999999;
  /*font-size: 0.9rem;*/
}

#navmenu1 .dropdown-menu {
  font-size: clamp(12px, 0.9rem, 18px);
  min-width: 10em;
  padding: 0.5em 0;
  border-radius: 0.25em;
}

#navmenu1 .dropdown-item {
  padding: 0.25em 1em;
}

#navmenu1 .container-fluid {
  padding-left: .75em;
  padding-right: .75em;
}

#navmenu1 .navbar-brand {
  font-size: 16px;
  padding: 0;
  margin: 0;
}

#navmenu1 .navbar-toggler {
  font-size: 1.25em;
  border-radius: 0.25em;
}


#navmenu1 .nav-link {
  color: #eeeeee;
  text-shadow: 0.5px 0.5px 0.2px #000000;
  /*font-size: 0.9rem;*/
  
  padding: 0.5em 1em;
/*  text-shadow: 1px 1px 0.2px #cccccc;*/
}

#navmenu1 .nav-link:hover, #navmenu1 .nav-link:focus {
  color: #ffffff;
  text-shadow: 0.5px 0.5px 0.8px #333366;
  /*font-size: 0.9rem;*/
}

#navmenu1 .dropdown-item {
  /*font-size: 0.9rem;
  font-size: clamp(12px, 0.9rem, 20px);*/
}


/* navbar override 2022-08-23 */
#navmenu1.navbar {
  padding-top: 2px ;/* 0.3rem;*/
  padding-bottom: 2px ;/* 0.3rem;*/
}

/*
#navmenu1 li.dropdown {
  border: 1px solid #ffffff;
}
*/

#navmenu1 button.navbar-toggler {
  /* padding: 0.2rem 0.6rem; */
  padding: 0.2em 0.6em;
  margin: 1px;
  border-color: rgba(255,255,255, 0.2); /* 0.3*/
}


#navmenu1 button.navbar-toggler:focus {
  box-shadow: 0 0 0 0; /*0.05rem;*/
}


#navmenu1 .navbar-toggler-icon {
/*  width: 1.2rem;
  height: 1.2rem;*/
}

#navmenu1 .dropdown-menu {
  /*padding: .125rem 0;*/
  padding: .125em 0;
}

#navmenu1 .dropdown-menu[data-bs-popper] {
  /* margin-top: -0.25rem; */
  margin-top: -0.25em;
}

#navmenu1 .dropdown-divider {
  /* margin: .125rem 0; */
  margin: .125em 0;
}

/* ヘッダ部分スタイル詳細 */
div#site-logo {
  float:left;
  width: 180px;
  height: 50px;
  margin: 0;
  padding-top: 4px;
  padding-left: 8px;
  
}


div#util-sec {
  float: right;
  width: auto;
  height: 50px;
  margin: 0;
  padding: 8px 0 0 0;
}

div#search-sec {
  float: left;
  /*width: 32px;*/
  width: 40px;
  padding-top: 4px;
  padding-right: 6px;
}

div#util-sec ul {
  float: left;
  /*width: 180px;*/
  width: 90px;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: small;
  line-height: 1.0;
}

div#util-sec ul li {
  float: left;
  height: 20px;
  overflow: hidden;
  text-indent: -9999px;
}

div#util-sec ul li a {
  display: block;
  text-decoration: none;
  height: 20px;
}

div#util-sec ul li#util-contact {
  width: 80px;
  /*margin-right: 8px;*/
  background: url(../images/top_images2206_2.png) left -50px no-repeat;
}

div#util-sec ul li#util-webshop {
  width: 63px;
  background: url(../images/top_images2206_2.png) -87px -50px no-repeat;
}

div#util-sec ul li#util-security {
  width: 105px;
  background: url(../images/top_images2206_2.png) -167px -50px no-repeat;
}

div#util-sec ul li#util-sitemap {
  width: 80px;
  background: url(../images/top_images2206_2.png) -323px -50px no-repeat;
}

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

#book_main .book_info {
  margin-bottom: 1rem;
}


#book_main .coverimage {
  padding: 0.5rem;
  margin-bottom: 1rem;
}

#book_main .extlinks {
  margin-bottom: 1rem;
}
#book_main .extlinks a {
  box-shadow: 0 .125rem .25rem #c0c0c0;
}

#book_main .title {
  font-size: 1.5rem;
  font-weight: bold;
  color: #663333;
}

#book_main .status {
  font-weight: bold;
  color: red;
}

#book_main .information {
  font-size: 1.2rem;
  font-weight: bold;
  color: blue;
  text-align: center;
}

/*
  #book_main 以下のクラス
  book_detail
    book_info
      series
      subtitle1
      title
      subtitle2
      author
      size
      attach
      price
      JAN
      publish_day
      status
    coverimage
    extlinks
    ainfo0
      information  売り切れ
      sample
    ainfo1
    intro
    ainfo2
    contents
    ainfo3
    related
      relatedhead

*/

#book_main .ainfo0,
#book_main .ainfo1,
#book_main .ainfo2,
#book_main .ainfo3 {
  margin: 1rem 0.5rem;
}

#book_main .intro {
  margin: 1rem 1rem;
}

#book_main .contents {
  margin: 1rem 1rem;
}

#book_main .related {
  margin: 1rem 1rem;
}

#book_main .sample {
  /*width: 50%;
  margin: auto;*/
  /*display:flex;
  align-items: center;*/
  /* margin-left: auto;
  margin-right: auto; */
}

#book_main .relatedlead {
  font-weight: bold;
  color: #663333;
  margin-bottom: 0.25rem;
}

/* book_list 
  
  lead0 近刊用
  lead1 新刊用
  lead2 ○年○月用
  
  item
    series
    subtitle1
    subtitle2
    title
    information
    price
      img
    intro
  
  list
    series
    seriesnum
    subtitle1
    subtitle2
    title
    information
    sample
     img
     price
  
  
*/

#book_list .lead2 {
  color: #996633;
  font-weight: bold;
  font-size:     1rem;
  margin-top:    1rem;
  margin-bottom: 0.5rem;
  margin-left:   1rem;
  margin-right:  1rem;
}

#book_list .lead0 {
  color: #993399;
  font-weight: bold;
  font-size:     1rem;
  margin-top:    2rem;
  margin-bottom: 1rem;
  margin-left:   1rem;
  margin-right:  1rem;
}
#book_list .lead1 {
  color: #339933;
  font-weight: bold;
  font-size:     1rem;
  margin-top:    2rem;
  margin-bottom: 1rem;
  margin-left:   1rem;
  margin-right:  1rem;
}


#book_list .item, #book_list .list {
  background-color: #eeeeee;
  margin: 0.6rem 0rem;
  padding: 0.4rem 0.6rem;
}

#book_list .information {
  float: left;
  font-weight: bold;
  color: #993333;
}

#book_list .intro {
  font-size: 0.8rem;
  /*text-align: center;*/
  margin: 0.4rem 0.4rem;
}

#book_list .subtitle1, 
#book_list .subtitle2 {
  font-size: 0.8rem;
  color: #000066;
  font-weight: bold;
}

#book_list .list .sample, 
#book_list .list .title {
  display: inline;
}

#book_list .series, 
#book_list .seriesnum {
  font-size: 0.8rem;
  color: #330033;
}

#book_list .title {
  font-size: 1.3rem;
  font-weight: bold;
}

#book_list .head_intro {
  font-size: 0.9rem;
  /*text-align: center;*/
}

h1.head {
  text-align: center;
  font-size: 1.5rem;
  font-weight: bold;
  /*color: #663333;*/
  color: #a52a2a; /* brown */
}

#hmenu .guide {
  text-align: center;
}

/* ご案内 */
#hmenu .nav2 {
  margin: 1.5rem 1rem;
}

#hmenu .nav2 li {
  display: block;
  float: left;
  margin-left: 1rem;
}


#hmenu .nav3 {
  font-size: 0.8rem;
}

/*
#hmenu .nav3 li {
  display: block;
  float: left;
  margin-left: 1rem;
}
*/

#hmenu hr {
  clear: both;

}


#hmenu .searchbox{
  background-color: #0066ff;
  padding: 0.5rem;
  
}
#hmenu .searchtitle {
  font-size: 0.8rem;
  color: white;
}

#hmenu .newbook, #hmenu .magazine, #hmenu .series, #hmenu .yearly, #hmenu .fields, #hmenu .products {
  font-size: 1.2rem;
  font-weight: bold;
  color: #336699;
  padding: 0 0 0 44px;
  height: 24px;
  line-height: 24px;
  margin-top: 1.5rem;
  margin-bottom: 1rem;
}

#hmenu .newbook {
  background-image: url(../images/books2206/bookicon1_red.png);
  background-repeat: no-repeat;
}

#hmenu .magazine {
  background-image: url(../images/books2206/bookicon2_green.png);
  background-repeat: no-repeat;
}

#hmenu .series, #hmenu .yearly, #hmenu .fields, #hmenu .products {
  background-image: url(../images/books2206/bookicon3_blue.png);
  background-repeat: no-repeat;
}

#hmenu .magazines li {
  font-size: 0.8rem;
}

#hmenu .magazines a {
  font-size: 1.0rem;
  margin: 0 0.5rem;
}

#hmenu .seriesnav {
  font-size: 0.8rem;
}

#hmenu .serieslist .flex-row {
  /*margin-top: 0.5rem;*/
  margin-bottom: 1rem;
}

#hmenu .serieslist .seriesgrp {
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
  font-weight: bold;
}

#hmenu .fieldlist .lead0 {
  margin-top: 1rem;
  font-weight: bold;

}

#hmenu .fieldlist ul,
#hmenu .serieslist ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}


#hmenu .fieldlist li:before,
#hmenu .serieslist li:before {
  content: "■";
  color: #4A62B0;
  margin-right: 0.2rem;
}

#hmenu .serieslist .seriesinfo {
  font-size: 0.8rem;
  margin-left: 0.2rem;
  margin-right: 0.5rem;
}

#hmenu .serieslist .seriesinfo li {
  font-size: 1.0rem;
}


#hmenu .serieslist img {
  margin: 0rem 0.5rem;
  border: none;/*   1px solid;  */
  box-shadow: 1px 1px 4px;
  width: 48px;
  height: auto;
}


#book_images blockquote {
  margin-bottom: 100px;
  
}

#book_images img {
  width: 100%;
  height: auto;
  border: 1px solid black;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
  /*margin-left: 20px;*/
}

#book_images div.images {
  padding: 0.15rem;
  position: relative;
  /*width:100%;
  height: auto;*/
  margin-top: -80px;
  /*margin-left: -10px;*/
  /*top: -50%;*/
}

/* sitemap  */

#sitemap .head
{
  /* text-align: center; */
  font-size: 1.5rem;
  font-weight: bold;
  color: #663333;
}

#sitemap ul {
  margin-bottom: 1rem;
}

#sitemap .extitem:after {
  font-size: 0.5rem;
  content: "《外部リンク》";
  margin-left: 0.1rem;
}



/* newbook_idx 20220810 */
#newbook_idx {
  width: 100%;
  height: 4rem;
  border: dashed 1px #aaaaaa;
  padding: 0.2rem;
  padding-left: 18px;
  /* overflow: scroll hidden; */
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  
}

#newbook_idx a {
  text-decoration: none;
  color: #000000;
}


#newbook_idx a:hover {
  color: #0000ff;
}
/*
#newbook_exp a:link,
#newbook_exp a:visited {
  color: #000000;
}
*/

#newbook_idx img {
  max-width: 90px;
  height: auto;
  margin-right: 4px;
  margin-left: -15px;
  /* margin-top: 1.5rem; */
  /* border: solid #000000 1px; */
  box-shadow: 1px 1px 4px;
  vertical-align: top;
  /* clear: both; */
  /*filter: sepia(50%);*/

}

#newbook_idx .lead4 {
  margin-left: -20px;
  font-size: 0.8rem;
  /* font-weight: 300; */
  /* float: left; */
}

#newbook_idx .more {
  /*position: absolute;
  right: 100px;
  top: 0px;*/
  /* float: right; */
  font-size: 0.8rem;
  /*display:block;*/
  position: absolute;
  bottom: 4px;
  right: 4px;
  display: block;
  width: 6rem;
  height: 1.6rem;
  line-height: 1.6rem;
  background-color: rgba(255,255,255,0.9);
  text-align: center;
  vertical-align: middle;
  color: #000000;
}


#newbook_idx .clear {
  clear: both;
}



/* infopage */
#infopage {
  
}

#infopage a {
  text-decoration: none;
}

#infopage img {
  border: 0;
}

#infopage h3 {
  font-size: 1.1rem;
  font-weight: bold;
  /* color: #9f0000; */
  color: #a52a2a; /* brown */
  margin-top: 1.5rem;
  line-height: 1.2;

}

#infopage h4 {
  font-size: 1rem;
  font-weight: bold;
  /* color: #9f0000; */
  color: #8b0000; /* darkred */
  line-height: 1.2;

}


#infopage .module0 {
  margin-left: 2.5%;
  margin-right: 2.5%;
  
  font-size: 0.9rem;
  line-height: 1.1;
}

#infopage .module0 table {
  border-collapse: separate;
  caption-side: top;
  /*border-spacing: 2px;
  border-width: 1px;*/
}

#infopage .module0 table td, 
#infopage .module0 table th {
  border-width: 1px;
  padding: 2px;
  margin: 1px;
}

#infopage .module0 ul {
  line-height: 1.4;

}

#infopage .tablelike {
  padding: 8px;
  border: 1px solid #666666;
  margin: 0.2rem 1rem;
  
}

#infopage .emp1 {
  font-size: 1.0rem;
  font-weight: bold;
}

#infopage .noborder {
  border: 0;
}

#infopage .noborder tr,
#infopage .noborder td,
#infopage .noborder th {
  border: 0;
}

#infopage .nav2 {
  margin: 1rem 1rem;
}

#infopage .nav2 li {
  display: block;
  float: left;
  margin-left: 1rem;
}

#infopage .clar {
  clear: both;
}

#infopage .nav3 {
  font-size: 0.8rem;
}

#infopage .nav4 {
  font-size: 0.8rem;
}

#infopage .nav4 .list-group-item {
  padding: .4rem .4rem;
  /* white-space: nowrap; */
}


/* infopage2 - pppage */
#infopage2 h1 {
  font-size: 1.2rem;
}

#infopage2 .module0 {
  margin-left: 2.5%;
  margin-right: 2.5%;
  
  font-size: 1rem;
  line-height: 1.5;
  
}

#infopage2 br,
#infopage2 hr {
  clear: both;
}

#infopage2 blockquote {
  margin-left: 3%;
  margin-right: 1%;
}

/* table page */



/* toppage */
.topmds {
  width: 100%;
  font-size: 0.75rem;
  background: #333;
  color: white;
  /*box-shadow: 0 0.075rem 0.125rem #666666;*/
  text-shadow: 0.3px 0.3px 0.5px #888888;
  
  margin-bottom: 0.2rem;
  padding: 0.3rem 0.5rem;
}

.binder {
  width :100%;
  margin-bottom: 1rem;
}

.binder img {
  width: 100%;
  height: auto;
}

.binder p {
  margin-bottom: 0.1rem;
}

#servicebtn img {
  width: 100%;
  height: auto;
}

#adarea1 img {
  width: 100%;
  height: auto;
  padding: 0.2rem 0;
}

#cover {
  margin-bottom: 8px;
}

/* override */
#homesub .note1 {
  line-height: 1.3;
  font-size: 0.75rem;
  font-weight: bold;
}

#homesub .info {
  line-height: 0.5;
}

#homesub .info p {
  margin-bottom: 0.1rem;
  margin-left: 0.3rem;
  margin-right: 0.3rem;
}


#homesub .info a {
  text-decoration: none;
  color: #333;
}

#topbtm0 img {
  border: 1px solid #ccc;
  margin-bottom: 0.3rem;
}