/**
* 共通
**/
body{
    color: #222;
    font-family: 'UD デジタル 教科書体 NP-R', 'Meiryo', 'Hiragino Sans', sans-serif;
    line-height: 1.5;
    margin: 0;
}

button{
    font-family: 'UD デジタル 教科書体 NP-R', 'Meiryo', 'Hiragino Sans', sans-serif;
}

a{
    color: #0069ff;
    text-decoration: none;
}

img{
    max-width: 100%;
    vertical-align: top;
}

h1{
    margin-left: 2em;
}

rt{
    color: #ff0000;
    font-weight: bold;
    margin-bottom: .1em;
    transform: translateY(-.1em);
}

/* 一律にoutlineを消すので、必要に応じてStyleを当ててください */
input:focus {
    outline: none;
}

/* 狭幅のスマホで見たさいにページネーションが見切れるので対応*/
ul {
    padding-inline-start: 0;
}
.set_middle{
    vertical-align: middle;
}

.set_width{
    width: 30rem;
}

.consent{
    margin-left: 30px;
    margin-bottom: 30px;
}

.fsize_up{
    font-size:1.3rem;
}

/**
* 丸ボタン（ログイン）
**/
.btn_round{
    display: inline-block;
    width: 150px;
    height: 150px;
    margin: 1em auto;
    line-height: 150px;
    background-color: #e25c00;
    border-radius: 100%;
    font-size: 3rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    padding-top: 30%;
}

.btn_round:focus,
.btn_round:hover{
    color: #e25c00;
    opacity: .5;
}

.font_login{
    color: rgba(229, 218, 205, 1);
    font-size: 2rem;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}

/**
* 角丸ボタン（人気ベスト20）
**/
.el_roundedBtn{
    display: inline-block;
    width: 236px;
    max-width: 100%;
    line-height:90px;
    padding: 10px;
    background-color:#e25c00;
    border: 2px solid transparent;
    border-top-color: #d40152;
    border-bottom-color: #d40152;
    border-radius: 10px;
    color: rgba(229, 218, 205, 1);
    font-size: 2rem;
    text-align: center;
    text-decoration: none;
    transition: .25s;
    cursor: pointer;
}

.el_roundedBtn:focus,
.el_roundedBtn:hover{
    background-color: rgba(229, 218, 205, .55);
    border-color: currentColor;
    color: #e25c00;
}

.el_roundedBtn rt{
    color: #fff;
}

.el_roundedBtn:hover rt{
    color: #008b42;
}

/**
* 右矢印付きボタン（申請書）
**/
.el_btn{
    display: inline-block;
    width: 400px;
    max-width: 100%;
    padding: 5px 10px;
    background-color: #8b0000;
    border: 2px solid transparent;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
    color: #fff;
    font-size: 1.125rem;
    text-align: center;
    text-decoration: none;
    transition: .25s;
    margin: 20px 0 0 30px;
}

.el_btn:focus,
.el_btn:hover{
    background-color: #fff;
    border-color: #8b0000;
    color: #8b0000;
}

.el_btn.el_btn__arrowRight{
    position: relative;
    padding-right: 2em;
    padding-left: 1.38em;
}

.el_btn.el_btn__arrowRight::after{
    content: '\f061';
    position: absolute;
    top: 50%;
    right: .83em;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    transform: translateY(-50%);
}

/**
* 戻るボタン オレンジ (汎用性高)
**/
.multiBtns{
    margin-top: 20px;
    margin-left: 30px;
}

.multiBtns .btn_return{
    width: 120px;
    margin-top: 0;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 10px;
    background: rgba(226, 80, 15, .2);
    border: 2px solid #e2500f;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: bold;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
}

.multiBtns .btn_return:hover{
    opacity: .7;
}

/* 茶色 */
.multiBtns .btn_return.brown{
    background: rgba(139, 0, 0, .15);
    border: 2px solid #8b0000;
}

.multiBtns .btn_return.brown:hover{
    opacity: .7;
}

/* リセット用 */
.btn_return.middle{
    width: 200px;
}

.btn_return.long{
    width: 300px;
}

/**
* ログイン画面
**/
.user_login input,
.user_login button{
    font-size: 1rem;
    cursor: pointer;
}

/* 不要になったのでコメントアウト
.user_login input:focus,
.user_login button:focus{
    outline: none;
}*/

.user_login a,
.user_login a:visited,
.user_login a:active {
    text-decoration: none;
}

.user_login a:hover {
    text-decoration: none;
}

.user_login ::selection {
    background: #ed327b;
    color: #fff;
}

.user_login ::-moz-selection {
    background: #ed327b;
    color: #fff;
}

.user_login * {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.bl_login{
    background:#e2eba3;
    text-align: center;
}

.bl_login form{
    background:#fff;
    border-radius:6px;
    padding:20px;
    padding-top:30px;
    width:400px;
    margin:50px auto;
    box-shadow:15px 15px 0px rgba(0,0,0,.1);
}

.user_login h1{
    text-align:center;
    font-size:1.4em;
    font-weight:700;
    margin-bottom:24px;
}

.user_login input{
    width:100%;
    background:#f5f5f5;
    border:0;
    padding:20px;
    border-radius:6px;
    margin-bottom:10px;
    border:1px solid #eee;
}

.mypage_btn{
    position:relative;
    width:100%;
    padding:20px;
    border-radius:6px;
    border:0;
    background:#f26964;
    font-size:1.2em;
    color:#fff;
    text-shadow:1px 1px 0px rgba(0,0,0,.1);
    box-shadow:0px 3px 0px #c1524e;
    outline: none;
}

.mypage_btn:hover{
    background: #d1483e;
}

.mypage_btn:active {
    top:3px;
    box-shadow:none;
}

.form-footer{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1em;
    padding: 0.5em 0;
    text-align: center;
    margin-top: 20px;
}

.form-footer a{
    color: #8c8c8c;
    text-decoration: none;
    transition: border-color 0.3s;
}

.form-footer a:hover{
    border-bottom: 1px dotted #8c8c8c;
}

/**
* トルグスイッチ共通
**/
.cmn-toggle {
    position: absolute;
    margin-left: -9999px;
    visibility: hidden;
}
.cmn-toggle + label {
    display: block;
    position: relative;
    cursor: pointer;
    outline: none;
    user-select: none;
}

/* 丸いスタイル(トグルスイッチ) */
input.cmn-toggle-round + label {
    padding: 2px;
    width: 90px;/* 120px から 110px*/
    height: 45px;/* 60px */
    background-color: #dddddd;
    border-radius: 60px;
}
input.cmn-toggle-round + label:before,
input.cmn-toggle-round + label:after {
    display: block;
    position: absolute;
    top: 1px;
    left: 1px;
    bottom: 1px;
    content: "";
}
input.cmn-toggle-round + label:before {
    right: 1px;
    background-color: #f1f1f1;
    border-radius: 60px;
    transition: background 0.4s;
}
input.cmn-toggle-round + label:after {
    width: 48px;/* 58px スイッチ半径*/
    background-color: #fff;
    border-radius: 100%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    transition: margin 0.4s;
}
input.cmn-toggle-round:checked + label:before {
    background-color: #8ce196;
}
input.cmn-toggle-round:checked + label:after {
    margin-left: 45px;
}

/**
* ヘッダーのスタイリング
**/
.ly_header{
    padding-top: 20px;
    border-bottom: 1px solid #ddd;
}

.ly_header.ly_header__mypage{
    padding-top: 5px;
}

.ly_header_ttl{
    font-size: 30px;
    font-weight: bold;
    margin-top: 20px;
    text-align: center;
}

.ly_header_inner{
    max-width: 1230px;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    text-align: right;
}


/**
* タブナビゲーション
**/
.bl_tabNav_inner{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: -10px;
}

.bl_tabNav_inner li{
    list-style: none;
}

.bl_tabNav_inner li > a{
    display: inline-block;
    padding-right: 30px;
    padding-bottom: 10px;
    padding-left: 30px;
    margin-bottom: 10px;
    border-bottom: 4px solid #efefef;
    color: #777;
    text-decoration: none;
    transition: .25s;
}

.bl_tabNav_inner li > a:focus,
.bl_tabNav_inner li > a:hover{
    border-bottom-color: currentColor;
    color: #e25c00;
    opacity: .75;
}

/* 各ページを開いたときのナビの active */
.library, .info, .update{
    background-image: url(../img/dot.png), url(../img/happa.png), url(../img/risu.png);
    background-repeat: repeat-x, no-repeat, no-repeat;
    background-position: right top, 1050px 45px, 100px 35px;
    background-size: auto 20px, auto, auto;
}

.library .link1{
    border-bottom-color: currentColor;
    color: #e25c00;
}

.info .link2{
    border-bottom-color: currentColor;
    color: #e25c00;
}

.update .link3{
    border-bottom-color: currentColor;
    color: #e25c00;
}


/**
* フッターのスタイリング
**/
.ly_footer_inner{
    clear: both;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    padding:12px 0;
    background-color: #1e90ff;
}

.el_footerCopyright{
    font-size: 12px;
    color: #fff;
    background-color: #1e90ff;
}

/* 退会ボタン */
.footer_withdrawalBtn{
    display: inline-block;
    width: 250px;
    padding: 10px 10px;
    font-size: 14px;
    text-decoration: none;
    text-align: center;
    transition: 0.25s;
    border: 1px solid #000;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    color: #fff;
    background-color: #000;
    float: left;
    cursor: pointer;
}

.footer_withdrawalBtn:hover{
    color: #000;
    background-color: #fff;
}

/**
* コンテンツエリア（TOP PAGE）
**/
.ly_cont{
    max-width: 1230px;
    padding: 20px 15px; /* 元は 60px 15px */
    margin-right: auto;
    margin-left: auto;
}

.ly_cont.ly_cont__col{
    display: flex;
    justify-content: space-between;
}

.ly_cont_main{
    flex: 1;
/* これ消しちゃダメ？
    margin-left: 3.25203%;
*/
}

.ly_cont_side{
    flex: 0 0 270px;
}

/* これ消しちゃダメ？
.ly_cont_side.ly_cont_side__right{
    margin-right: 3.25203%;
}
*/

/**
* ページネーション
**/
.bl_pager{
    display: flex;
    overflow-x: auto;
}

.bl_pager_inner{
    display: flex;
    margin-right: auto;
    margin-left: auto;
    list-style: none;
}

.bl_pager_inner > *:last-child{
    margin-bottom: 0;
}

.bl_pager_inner > li{
    margin-right: 15px;
}

.bl_pager_link{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid currentColor;
    color: #e25c00;
    text-decoration: none;
    transition: .25s;
}

.bl_pager_link:focus,
.bl_pager_link:hover{
    background-color: #e25c00;
    color: #fff;
    opacity: .75;
}

.bl_pager_link.is_active{
    background-color: #e25c00;
    color: #fff;
    pointer-events: none;
}

.bl_pager_dot{
    color: #e25c00;
    line-height:50px;
}

/**
* 図書一覧
**/
.bl_card{
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
    margin: 0;
}

.bl_card_imgWrapper{
    position: relative;
    padding-top: 100%;
    overflow: hidden;
}

.bl_card_imgWrapper > img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    height: auto;
}

.bl_card_body{
    padding: 0 15px 15px 15px;
}

.bl_card_body > *:last-child{
    margin-bottom: 0;
}

.bl_card_ttl{
    margin-bottom: 5px;
    font-size: 1.125rem;
    font-weight: bold;
    line-height: 2;
}

.bl_card_txt{
    color: #777;
    line-height: 2;
}

a.bl_card{
    display: block;
    color: currentColor;
    text-decoration: none;
    transition: .25s;
}

a.bl_card .bl_card_ttl,
a.bl_card .bl_card_txt{
    transition: .25s;
}

a.bl_card:focus,
a.bl_card:hover{
    opacity: .75;
}

a.bl_card:focus .bl_card_ttl,
a.bl_card:focus .bl_card_txt,
a.bl_card:hover .bl_card_ttl,
a.bl_card:hover .bl_card_txt{
    color: #e25c00;
}

a.bl_card:focus .bl_card_ttl rt,
a.bl_card:focus .bl_card_txt rt,
a.bl_card:hover .bl_card_ttl rt,
a.bl_card:hover .bl_card_txt rt{
    color: #008b42;
}

/* ラッパーモジュールに対する指定 */
.bl_cardUnit{
    display: flex;
    flex-wrap: wrap;
}

.bl_cardUnit.bl_cardUnit__col3{
    margin-bottom: -30px;
}

/* 各図書に対する指定 */
.bl_cardUnit__col3 > .bl_card{
    width: 31.707%;
    margin-right: 2.43902%;
    margin-bottom: 30px;
}

.bl_cardUnit__col3 > .bl_card:nth-of-type(3n){
    margin-right: 0;
}

/**
* バッジ
**/
.bl_card_badge{
    position: relative;
}

.bl_card_badge::after{
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 0;
    height: 0;

    /* 三角形生成 */
    border-width: 2.75rem 2.75rem 0 0;
    border-style: solid;
    border-color: #e25c00 transparent transparent transparent;
}

.bl_card_badge_txt{
    position: absolute;
    z-index: 2;
    top: .4rem;
    left: .3rem;
    color: #fff;
    font-size: .7rem;
    font-weight: bold;
    transform: rotate(-45deg);
}

/**
* ジャンボトロン
**/
.bl_jumbotron{
    background-image: url('../img/dream.png');
    height: 50vw; /* 元は　calc(69.44444vw + -233.33333px) */
    background-position: center center;
    background-size: cover;
}

.ly_centerd{
    max-width: 1230px;
    /* レイアウトグループとしては、左右の padding が必要 */
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.bl_jumbotron_inner{
    position: relative;
    height: 100%;
    /* 左右の padding の打ち消し */
    margin-right: auto;
    margin-left: auto;
}

.bl_jumbotron_ttl{
    position: absolute;
    right:10%;
    padding: 40px 60px 15px 60px;
    margin-top: 15px;
    background-color: rgba(229, 218, 205, .9);
    color: #fff;
    font-size: 2rem;/*calc(1.81818vw + 14.18182px)*/
    white-space: nowrap;
    border-radius: 50px / 30px;
    /* 背景ぼかし */
    box-shadow: 0px 0px 10px  10px rgba(255, 255, 255, 1) inset;
    /* 縁取り */
    text-shadow: 2px 2px 0 #008000,
    -1px 1px 0 #008000,
    1px -1px 0 #008000,
    -1px -1px 0 #008000;
}

/**
* メッセージボード（サイド）
**/
.bl_side_board{
    display: block;
    background-image: url('../img/board.jpg');
    width: 260px;
    height: 380px;
    background-position: center center;
    background-size: cover;
    font-size: 1.2rem;
    margin-left: auto;
    margin-right: auto;
}

.bl_side_board ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

.bl_side_board li a{
    display: inline-block;
    margin-bottom: 10px;
    padding-left: 20px;
    text-decoration: none;
}

.bl_side_board li:first-child{
    padding-top: 70px;
}

.pin{
    width: 12%;
    height: auto;
    padding-left: 0px;
    padding-bottom: 0px;
    margin-right: 10px;
    vertical-align: text-bottom;
}

/**
* ログインボタン（サイド）
**/
.bl_side_login{
    margin-bottom: 30px;
}

.bl_side_login ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

.bl_side_login li a{
    display: block;
    margin-bottom: 10px;
    padding: 0;
    text-decoration: none;
}

.bl_side_login a{
    position: relative;
}

/**
* 人気ベスト20（サイド）
**/
.bl_side_fun20{
    margin-bottom: 30px;
    text-align: center;
}

.bl_side_fun20 ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

.bl_side_fun20 li a{
    display: block;
    margin-bottom: 10px;
    padding: 0;
    text-decoration: none;
}

.el_roundedBtn.el_roundedBtn__fun{
    padding: 10px 10px 0 10px;
}

/**
* 検索窓（サイド）
**/
.search_box {
    display: flex;
    margin-bottom: 1rem;
}

.search_container{
    box-sizing: border-box;
    position: relative;
    border: 1px solid #999;
    display: block;
    padding: 3px 10px;
    border-radius: 7px;
    height: 2.3em;
    width: 100%;
    overflow: hidden;
    margin-right: 0.3em;
}
.search_container input[type="text"]{
    border: none;
    height: 2.0em;
}
.search_container input[type="text"]:focus {
    outline: 0;
}
.search_container input[type="submit"]{
    cursor: pointer;
    font-family: 'Font Awesome 5 Free';
    border: none;
    background: #008442;
    color: #fff;
    position: absolute;
    width: 3.5em;
    height: 3.0em;
    right:0px;
    top: -3px;
    outline : none;
}

.search_container.orange input[type="submit"]{
    background: #e25c00;
}

.reset_free_word {
    text-align: center;
    width: 4em;
}

.btn_reset_free_word {
    cursor: pointer;
    display: inline-block;
    width: 160px;
    max-width: 100%;
    line-height: 15px;
    padding: 15% 0;
    background-color: #e25c00;
    border: 2px solid #d40152;
    border-radius: 10px;
    color: white;
    font-size: 0.8rem;
    text-align: center;
    text-decoration: none;
    transition: .25s;
}

.btn_reset_free_word:hover {
    background-color: rgba(229, 218, 205, .55);
    border-color: currentColor;
    color: #e25c00;
}


.btn_reset_free_word rt{
    color: white;
}

.btn_reset_free_word:hover rt{
    color: #008b42
}

/**
* 推薦図書検索（サイド）
**/
.bl_side_recommend ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

.bl_side_recommend h2{
    margin-top: 0;
    margin-bottom: 10px;
    border-bottom: dotted 2px #ddd;
    color: #666;
    font-size: 18px;
}

.bl_switch_wrapper{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.switch{
    display: inline-block;
    margin: 0 15px 0 auto;
}

.bl_switch_txt{
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
    font-size: 1.2em;
}

/**
* 利用者 図書詳細情報
**/
.user_book_detail {
    margin: 1rem 5%;
}

.user_book_table {
  margin: 0 auto;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  width: 100%;
}

.user_book_table th,
.user_book_table td{
  padding: 10px 0;
  text-align: center;
}

.user_book_table th {
    text-align: right;
    padding-right: 1rem;
    width: 40%;
}

.user_book_table td {
    text-align: left;
    padding-left: 1rem;
    width:60%;
}

.user_book_table tr:nth-child(odd){
  background-color: rgba(229, 218, 205, .3)
}


/**
* 利用者 図書詳細情報 : 表紙・操作情報
**/
.bl_coverBox{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    vertical-align: middle;
    margin: 10px 100px 0px 80px;
}

.bl_coverBox_img{
    padding-right: 50px;
}

.bl_coverBox_img > img{
    width: 150px;
    height: auto;
}

.bl_coverBox_access{
    display:inline-block;
    text-align: center;
    vertical-align: top;
    margin: 0 15px 0;
    cursor: pointer;
/*    height: 120px; */
}

.bl_coverBox_access a > img{
    height: 83px;
    width: auto
}

.bl_coverBox_access a > .bl_coverBox__imgDownload{
    width: 80px;
}

.user_bookTable__imgChattyBooks{
    width: 70px;
    height: auto;
}

.bl_coverBox_access a{
    text-decoration: none;
}

.bl_coverBox_accessTxt{
    /*font-size: .8rem;*/
    /*padding-top: 0;*/
    vertical-align: text-bottom;
}

.coverBox_introduction{
    padding: 0 10px 0 10px;
    background-color: #ffffe0;
}

.coverBox_txt{
    font-weight: bold;
}

/**
* 申請登録(表・ボタン:保護者・教師・支援者)
**/
.edit-individual-form {
}

.entryTable{
    margin:1rem auto;
    border: 2px solid #33ccff;
    border-collapse: collapse;
    width: 100%;
    max-width: 900px;
}

.entryTable th,
.entryTable td{
    padding: 5px 10px;
    border: 1px solid #33ccff;
}

.entryTable th{
    width: 15rem;
    background-color: #e0ffff;
    padding-right: 30px;
    text-align: right;
}

.type_hidden{
    display: block;
    padding:  5px 10px;
    box-sizing: border-box;
    font-size: 1rem;
}

.entryTable caption{
    font-size: 1.5rem;
    margin-bottom: 10px;
}

.cap_padding{
    padding-top: 25px;
}

.entryTable input[type="text"],
.entryTable input[type="email"],
.entryTable input[type="password"],
.entryTable input[type="number"],
.entryTable textarea{
    padding: 10px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-size: 1rem;
    box-shadow: none;
}

.entryTable input[type="number"] {
    width: 30%;
}

.entryTable input[type="number"]::-webkit-outer-spin-button,
.entryTable input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.ebtryTable input[type="number"] {
    -moz-appearance:textfield;
}

/* IEでの未入力時に表示されるスクロールを非表示 */
.entryTable textarea{
    overflow: auto;
}

/*
IEのみ以下のCSSが適用 --不要?
@media all and (-ms-high-contrast: none){
    textarea{
        width: 100%;
    }
    .entryTable{
        width: 55%;
    }
}

FireFoxのみ以下のCSSが適用
@-moz-document url-prefix() {
    textarea{
        width: 100%;
    }
    .entryTable{
        width: 55%;
    }
}
*/

.radio_label{
    display: block;
    padding: 7px;
    box-sizing: border-box;
    font-size: 1rem;
}

.entryTable select{
    padding: 10px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-size: 0.8rem;
}

.entryTable input[type="text"]:focus,
.entryTable input[type="email"]:focus,
.entryTable input[type="password"]:focus,
.entryTable textarea:focus{
    background-color: #ffffee;
    outline: none;
    border-left: 5px solid #ffa700;
}

input, textarea, select{
    cursor: pointer;
}

.btn-area {
    max-width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 1rem auto;
}

.pass_change {
    justify-content: space-evenly;
}

.pass_change_title {
    margin:1rem auto;
    width:560px;
    max-width: 100%;
}

.btn-area .btn_return {
    margin:0 0;
    min-width: fit-content;
}

.consent-confirmation,
.btn-area-confirmation {
    width: 760px;
    max-width:100%;
    margin: 1rem auto;
}

.editor-btn-area {
    width: 880px;
    max-width: 100%;
}

.entryBtns .entryBtn {
    width: 200px;
    margin-top: 0;
    padding: 10px;
    background: #afeeee;
    border: 2px solid #33ccff;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: bold;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
}

.entryBtns .entryBtn:hover{
    opacity: .7;
}

.withdrawalBtn {
    width: 200px;
    margin-top: 0;
    padding: 10px;
    background: pink;
    border: 2px solid crimson;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: bold;
    -webkit-appearance: none;
    cursor: pointer;
}

.withdrawalBtn:hover {
    opacity: .7;
}

.entryTable_ttl{
    font-size: 2rem;
}

/* 図書館 */
.entryTable.entryTable__library{
    border: 2px solid #f6bb9e;
}

.entryTable.entryTable__library th,
.entryTable.entryTable__library td{
    border: 1px solid #f6bb9e;
}

.entryTable.entryTable__library th{
    background-color: #ffeeee;
}

.entryBtns .entryBtn.library{
    border: 2px solid #f6bb9e;
}

.entryBtns .entryBtn.library{
    background: #fadccc;
}

/* 本人 */
.entryTable.entryTable__individual{
    border: 2px solid #f7ca11;
}

.entryTable.entryTable__individual th,
.entryTable.entryTable__individual td{
    border: 1px solid #f7ca11;
}

.entryTable.entryTable__individual th{
    background-color: #fffcda;
}

.entryBtns .entryBtn.individual{
    border: 2px solid #f7ca11;
}

.entryBtns .entryBtn.individual{
    background: #fdf0b6;
}

/* デイジー教科書利用者 */
.entryTable.entryTable__daisy{
    border: 2px solid #4699ca;
}

.entryTable.entryTable__daisy th,
.entryTable.entryTable__daisy td{
    border: 1px solid #4699ca;
}

.entryTable.entryTable__daisy th{
    background-color: #eaf2fa;
}

.entryBtns .entryBtn.daisy{
    border: 2px solid #4699ca;
}

.entryBtns .entryBtn.daisy{
    background: #eaf2fa;
}

.entry-daisy {
    max-width: 802px;
    margin: auto;
}

.entry-daisy .el_repeaterMore,
.entry-daisy .el_repeaterDel {
    margin-left: 0;
}

.entry-daisy2 {
    max-width: 930px;
    margin: auto;
}

.entry-daisy2 .el_repeaterMore,
.entry-daisy2 .el_repeaterDel {
    margin-left: 0;
}

/* jQuery repeater */
.el_repeaterDel{
    font-size: 1rem;
    padding: 5px 10px;
    color:#fff;
    background-color: rgba(228, 55, 74, 1);
    border: 2px solid rgba(228, 55, 74, 1);
    margin-left: 30px;
    margin-top: 20px;
    margin-bottom: 0px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.el_repeaterDel:focus,
.el_repeaterDel:hover {
    outline: none;
    background-color: #fff;
    border-color: rgba(228, 55, 74, 1);
    color: rgba(228, 55, 74, 1)
}

.el_repeaterMore{
    font-size: 1rem;
    padding: 5px 10px;
    color:#fff;
    background-color: rgba(98, 176, 227, 1);
    border: 2px solid rgba(98, 176, 227, 1);
    margin-left: 30px;
    margin-bottom: 20px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.el_repeaterMore:focus,
.el_repeaterMore:hover {
    outline: none;
    background-color: #fff;
    border-color: rgba(98, 176, 227, 1);
    color: rgba(98, 176, 227, 1)
}

/**
* モーダル(新年度更新確認)
**/
.overlay{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.3);
    display: none;
    z-index: 1
}

.modalWindow{
    width: 480px;
    height: 150px;
    position: fixed;
    border: 2px solid #D04255;
    background-color: #FFF;
    display: none;
    z-index: 2
}

.close{
    width: 150px;
    height: 40px;
    font-size: 1.2em;
    color: #D04255;
    background-color: #FFF;
    border: solid 2px #D04255;
    border-radius: 3px;
    transition: .4s;
    margin-top: 20px;
}

.close:hover {
    background: #D04255;
    color: #FFF;
}

.modal_txt{
    padding-top: 20px;
}


/**
* モーダル(おしらせ)
**/
.overlay_info {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.3);
    display: none;
    z-index: 1
}

.modalWindow_info {
    width: 70vw;
    height: 50vh;
    position: fixed;
    top: 15vh;
    left: 15vw;
    border: 2px solid #eea800;
    background-color: #FFF;
    display: none;
    z-index: 2
}

.open_info{
    width: 60%;
    height: auto;
    margin-left: 10px;
    border: none;  /* 枠線を消す */
    outline: none; /* クリックしたときに表示される枠線を消す */
    background: transparent; /* 背景の灰色を消す */
    cursor: pointer;
}

.close_info {
    width: 5rem;
    height: 2rem;
    font-size: .9rem;
    font-weight: bold;
    color: #008b42;
    padding: 0;
    background-color: #FFF;
    border: solid 2px #008b42;
    border-radius: 3px;
    transition: .4s;
    position: absolute;
    right: 1rem;
    bottom: 0.5rem;
}

.close_info:hover {
    background: #008b42;
    color: #fff;
}

.modal_infoTxt{
    color: #fafafa;
    padding: 0.5rem;
    display: inline-block;
    line-height: 1.3;
    background: #008442;
    vertical-align: middle;
    border-radius: 25px 0px 0px 25px;
    margin:0.5rem;
}

.modal_infoTxt:before {
    content: '●';
    color: white;
    margin-right: 8px;
}

/**
* モーダル（ログインを促すWindow）
**/

.login_prompt {
    height: 10rem
}

/**
* モーダル(利用者パスワードリセット押下)
**/
.overlay_reset{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.3);
    display: none;
    z-index: 1
}

.modalWindow_reset{
    width: 550px;
    height: 200px;
    position: fixed;
    border: 2px solid #da7f66;
    background-color: #FFF;
    display: none;
    z-index: 2
}

.close_reset{
    width: 150px;
    height: 40px;
    font-size: 1rem;
    font-weight: bold;
    color: #da7f66;
    background-color: #FFF;
    border: solid 2px #da7f66;
    border-radius: 3px;
    transition: .4s;
    margin-top: 20px;
    outline: none;
}

.close_resetRiha {
    width: 150px;
    height: 40px;
    font-size: 1rem;
    font-weight: bold;
    color: #da7f66;
    padding: 0;
    background-color: #FFF;
    border: solid 2px #da7f66;
    border-radius: 3px;
    transition: .4s;
    margin-top: 20px;
    outline: none;
    position: absolute;
    left: 200px;
    bottom: 30px;
}

.close_reset:hover, .close_resetRiha:hover{
    background: #da7f66;
    color: #FFF;
}

.modal_resetmail{
    font-size: 1rem;
    padding-top: 20px;
    text-align: center;
}


/**
* パスワード関連ボタン
**/
.pass_resetBtn{
    font-size: 16px;
    display: inline-block;
    font-weight: bold;
    padding: 0.5rem 1rem;
    margin-bottom:0;
    text-decoration: none;
    color: #4caacf;
    background: #ECECEC;
    transition: .4s;
    cursor:pointer;
    border: none;
}

.pass_changeBtn{
    font-size: 16px;
    display: inline-block;
    font-weight: bold;
    padding: 0.5rem 1rem;
    margin-bottom:0;
    text-decoration: none;
    color: #755132;
    background: #ECECEC;
    transition: .4s;
    cursor:pointer;
    border: none;
}

.entryTable .pass_changeBtn {
    margin-left: 2rem;
}

/**
* 年度替わり（マイページ：申請情報確認画面）
**/
.import_box{
    position: relative;
    padding: 2%;
    margin: 2% 18%;
    border: solid 5px #d7003a;
    border-radius: 8px;
}
.import_box .box_title{
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #d7003a;
    font-weight: bold;
}
.import_box p{
    margin: 0;
    padding: 0;
    margin: 0;
}

.entryBtns .yearBtn{
    width: 300px;
    margin-top: 0;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 10px;
    background: #fbe5e7;
    border: 2px solid #d7003a;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: bold;
    -webkit-appearance: none;
    cursor: pointer;
}

.entryBtns .yearBtn:hover{
    opacity: .7;
}


/**
* おしらせ（マイページ）
**/
.info_img{
    vertical-align: middle;
}

.info_title{
    margin-left: 2rem;
    color: #009854;
}

/**
* パスワードリセット
**/
.pass_dec{
    margin-left: 2em;
    font-size: 1.2em;
}

.pass_dec input[type=email]{
    width: 20em;
    height: 2.0em;
}

/**
* ChattyBooksOnline
**/
.bol_char{
    font-weight:bolder;
    font-size: 15px;
}

/*ChattyBooksOnlineへボタン*/
.online{
    text-align: center;
    display: inline-block;
    margin-left: 30px;
    padding: 10px 25px 10px 25px;
    border: solid 1px #aaaaaa;
    color: #4169e1;
    font-size: 13px;
    text-decoration: none;
    background-color:#fafad2;
}

.onlinelog{
    text-align: center;
    display: inline-block;
    margin-left: 30px;
    margin-bottom: 30px;
    padding: 10px 25px 10px 25px;
    border: solid 1px #aaaaaa;
    color: #4169e1;
    font-size: 13px;
    text-decoration: none;
    background-color:#a1d8e2;
}

/*ChattyBooksOnline確認画面*/
.check_online{
    text-align:center;
    padding-top: 20px;
/*    background-image:url('../img/waku.png');
    background-repeat:no-repeat;
    background-position: 53% 0%;
    background-attachment:fixed;
    padding:120px 0px 170px 0px;
    width:100%;
    margin:0 auto;*/
}

.online_font1{
    font-size: 1.4rem;
}

.online_font2{
    font-size: 1.2rem;
}

.online_font3{
    color: #0000cd;
    font-weight: bold;
}

.online_qr{
    vertical-align: middle;
    width: 5%;
    height: 5%;
}

/* ChattyBooksOnlineログイン画面 */
.online_form {
    margin:70px auto;
    background:#43a28c;
    border-radius: 6px;
    width:347px;
    text-align:center;
    padding:40px;
}

.online_form > h2 {
    color:#f6f7d0;
    text-shadow:1px 1px 0px rgba(0, 0, 0, 0.7);
    font-weight:400;
    margin-bottom:20px;
}

.online_input{
    background:#f6f7d0;
    color:#7c5341;
    text-shadow:1px 1px 0px rgba(206, 216, 102, 1);
    display:block;
    width:269px;
    padding:15px;
    margin-bottom:10px;
    margin-left: 25px;
    outline:none;
    border-radius: 6px;
    border: #f6f7d0;
}

.online_input:focus{
    background:rgba(0, 0, 0, 0.1);
    color: #f6f7d0;
}

.online_btn{
    position:relative;
    display:block;
    margin-top:15px;
    margin-bottom:15px;
    margin-left: 40px;
    padding:17px;
    width:270px;
    font-size:1.2em;
    background:#ffe873;
    border-radius: 6px;
    color:#7c5341;
    cursor:pointer;
    border: #ffe873;
    outline: none;;
}

.online_btn:hover{
    opacity:0.8;
}

.online_btn:active{
    top:3px;
    box-shadow:none;
}


/**
* selectスタイル
**/
.bl_select{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0;
}

.bl_select input{
    border:2px solid #e25c00;
}

.cp_ipselect {
    overflow: hidden;
    width: 30%;
    margin: 2em 1em;
    text-align: center;

}

.cp_ipselect select {
    width: 100%;
    padding-right: 1em;
    cursor: pointer;
    text-indent: 0.01px;
    text-overflow: ellipsis;
    border: none;
    outline: none;
    background: transparent;
    background-image: none;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
}
.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl04 {
    position: relative;
    border: 2px solid #e25c00;
    border-radius: 50px;
    background: #ffffff;
}
.cp_ipselect.cp_sl04::before {
    position: absolute;
    top: 0.8em;
    right: 0.8em;
    width: 0;
    height: 0;
    padding: 0;
    content: '';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #e25c00;
    pointer-events: none;
}
.cp_ipselect.cp_sl04 select {
    padding: 8px 38px 8px 8px;
    color: #000080;
}

.select_btn{
    color: #755132;
    background: rgba(223, 140, 145, .2);
}

.select_btn:hover{
    background: #df8c91;
    color: #fff;
}

.select_btn:hover{
    outline: none;
}

/* navエリア（ページネーション、select） */
.nav_set{
    display: flex;
    flex-direction: column;
}

/*
** modal topのお知らせ
*/
.modal_info_title {
    max-width: 70%;
    width: 10rem;
}
.modal_info_list {
    padding: 0;
    position: relative;
    margin: 1em auto;
    max-width: 90%;
}
.modal_info_list_item {
    border-left: solid 6px #e25c00;
    background: #fffad7;
    margin-bottom: 3px;
    line-height: 1.5;
    padding: 0.5em;
    list-style-type: none!important;
}

/*
** tableがあるページの横幅
*/
.edit_individual,
.password_change {
    margin:0 5%;
}

/*
** entry/indexも中央寄せに
*/
.entry_index {
    margin:0 5%;
    text-align: center;
}

.btn_entry_index {
    max-width: 467px;
    padding-left: 30px;
}

/*
** entry tableの電話番号モバイル対応
*/
.entry_table_td_tellnumbers {
    font-size: 0.3rem;
}

/*図書一覧のソートボックス*/
    .cp_ipselect {
        width: 35%;
        min-width: 15rem;
    }


.entry-daisy .import_box{
    margin:2% 0;
}


/* ロゴと文（ゆめ基金） */
.logo_box{
	text-align: center;
	overflow-x: auto;
	white-space: nowrap;
}

.logo_img{
	display:inline-block;
	vertical-align:middle;
}

.logo_text{
	display:inline-block;
	vertical-align:middle;
}

.logo_img > img{
	width:300px;
}


/**
* トップ画面におすすめ情報追加
**/

.book_info{
    border: 4mm ridge rgba(0, 123, 187, .6);/* #007bbb */
    max-width: 1230px;
/*    width: 80%;*/
    margin: 0 auto;
}

.book_info_ttl{
    margin-left: 30px;
    font-size: clamp(16px, 2vw, 25px);
    display: flex; align-items: center;
}

.book_info_card{
    width: 80%;
    height: auto;
    margin: 0 auto 30px;
}

.book_info_hr{
    border: 0;
    border-top: 2px dashed #84a2d4;width:90%;
}

.book_info_txt{
    width: 70%;
    margin: 30px auto;
    line-height: 2;
}

/** 紹介 モーダル **/
.overlay_info_book {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(193, 216, 172, 1);
    display: none;
    z-index: 1
}

.modalWindow_book {
    width: 400px;
    height: 650px;
    position: fixed;
    border: 2px solid #eea800;
    background-color: #FFF;
    display: none;
    z-index: 2
}

/** 同意書 **/
.consent_form{
    width: 740px;
    max-width:100%;
    border: solid 2px #dcdcdc;
    padding: 20px 30px;
    margin: 2rem auto;
}

/** ChattybookBox 登録確認 **/
.check_cbox{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    background-image: url("../img/waku.png");
    background-repeat:no-repeat;
    background-position: center;
    padding:120px 30px 200px 0px;
    width:100%;
    height: auto;
}

.check_cbox_text{
    display: block;
    text-align: center;
}

.cbox{
    text-align: center;
    display: inline-block;
    margin-left: 30px;
    padding: 10px 25px 10px 25px;
    border: solid 1px #aaaaaa;
    color: #4169e1;
    font-size: 13px;
    text-decoration: none;
    background-color:#fafad2;
}

.cbox:hover{
    background-color:#ddfcc5;
}

.cbox_char{
    font-weight:bolder;
    font-size: 15px;
}

.cbox_font{
    color: #0000cd;
    font-weight: bold;
}
.cbox_left{
    display: inline-block;
    text-align: left;
    margin: 10px 0 10px;
    padding-left: 25px;
}

/**
* メディアクエリ適用時
**/

/* ###### 1200px以上 ###### */
@media screen and (min-width: 1200px){
    /* ジャンボトロン */
    .bl_jumbotron{
        height: 600px;
    }
    .bl_jumbotron_ttl{
        top: 0;
        font-size: 3.25rem;
    }

}

/* ###### 376から786px ###### */
@media (min-width: 376px) and (max-width: 786px){
    /* コンテンツエリア */
    .ly_cont.ly_cont__col{
        flex-direction: column;
    }
    /* マイページタイトル */
    .ly_header_ttl{
        font-size: 35px;
    }
    .library, .info, .update{
        background-image: url(../img/dot.png), url(../img/happa.png), url(../img/risu.png);
        background-repeat: repeat-x, no-repeat, no-repeat;
        background-position: right top, 1050px 45px, 670px 35px;
        background-size: auto 20px, auto, auto;
    }
    /* ナビゲーション */
    .bl_tabNav{
        overflow-x: auto;
    }
    .bl_tabNav_inner{
        flex-wrap: nowrap;
        justify-content: flex-start;
        margin-bottom: 0;
        white-space: nowrap;
    }
    .bl_tabNav_inner > li{
        text-decoration: none;
    }
    /* コンテンツエリア */
    .ly_cont.ly_cont__col{
        justify-content: flex-start;
    }
    .ly_cont_main{
/*        margin-right: 5.25203%; */
        margin-bottom: 60px;
    }
    /* 各図書に対する指定 */
    .bl_cardUnit__col3 > .bl_card{
        width: 48%;
        margin-right: 2%;
        margin-bottom: 30px;
    }
    .bl_cardUnit__col3 > .bl_card:nth-of-type(3n){
        margin-right: 2%;
    }
    /* ジャンボトロン */
    .bl_jumbotron{
        height: 550px;
    }
    .bl_jumbotron_ttl{
        top:0;
        width: 70%;
        padding: 40px 30px 20px 30px;
        font-size: 1.5rem;
        text-align: center;
        white-space: nowrap;
        right: 5%;
    }
    /* 利用者 図書詳細情報 */
    .user_bookTable ul:nth-child(2){
        font-size: .6rem;
    }
    .user_bookTable ul:first-child{
        font-size: .6em;
        white-space: nowrap;
    }
    .bl_coverBox_accessTxt{
        font-size: 0.7rem;
    }

    .cp_ipselect {
        width: 60%;
    }
    .bl_select{
        display: flex;
        align-items: center;
        flex-direction: column;
        margin-top: 0;
    }

/* online送信 */
    .br::before{
        content: "\A";
        white-space: pre;
    }
}

/* ###### 376から750px ###### */
@media (min-width: 376px) and (max-width: 750px){
    .bl_switch_txt{
        margin-left: 100px;
    }
    .modal_infoTxt {
        font-size: .8rem;
        padding-left: 5px;
        padding-right: 5px;
    }

    text-align: center;
    margin: 0.5%;
}

/* ###### 375px以下 ###### */
@media screen and (max-width: 375px){
    /* マイページタイトル */
    .ly_header_ttl{
        font-size: 25px;
    }
    .library, .info, .update{
        background-image: url(../img/dot.png), url(../img/happa.png), url(../img/risu.png);
        background-repeat: repeat-x, no-repeat, no-repeat;
        background-position: right top, 1050px 45px, 1100px 35px;
        background-size: auto 20px, auto, auto;
    }
    /* ナビゲーション */
    .bl_tabNav{
        overflow-x: auto;
    }
    .bl_tabNav_inner{
        flex-wrap: nowrap;
        justify-content: flex-start;
        margin-bottom: 0;
        white-space: nowrap;
    }
    .bl_tabNav_inner > li{
        text-decoration: none;
    }
    /* コンテンツエリア */
    .ly_cont.ly_cont__col{
        flex-direction: column;
    }
    .ly_cont_main{
        margin-right: 0;
        margin-bottom: 60px;
    }
    /* カード */
    .bl_cardUnit__col3 > .bl_card{
        margin-bottom: -20px;
    }
    .bl_cardUnit > .bl_card{
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }
    /* ジャンボトロン */
    .bl_jumbotron{
        height: 300px;
    }
    .bl_jumbotron_ttl{
        top:0;
        width: 70%;
        padding: 30px 30px 20px 30px;
        font-size: 1.25rem;
        text-align: center;
        white-space: nowrap;
    }
    /* 利用者 図書詳細情報 */
    .user_bookTable ul:first-child{
        width: 30%;
        font-size: .6em;
        white-space: nowrap;
    }
    .user_bookTable ul:nth-child(2){
        width: 70%;
        font-size: .6rem;
    }
    .bl_coverBox{
        text-align: center;
        margin:0% 5%;
    }
    .bl_coverBox_img{
        padding-right: 0;
    }
    /* 退会ボタン */
    .footer_withdrawalBtn{
        width: 375px;
    }
    /* モーダル(おしらせ) */
    /*
    .modalWindow_info {
        width: 350px;
    }
    */
    .modal_infoTxt{
        font-size: .8rem;
        padding-left: 5px;
        padding-right: 5px;
    }

    .cp_ipselect {
        width: 80%;
    }

    .bl_select{
        display: flex;
        align-items: center;
        flex-direction: column;
        margin-top: 0;
    }

    /* ログインを促すModal*/
    .login_prompt {
        width: 18rem;
        height: 10rem;
        left: calc((100vw - 18rem)/2);
    }
}

/*
 * タブレット横以上のものについては、検索蘭が横並びになってほしい
 */
@media screen and (min-width:768px) {

    .form-search-books {
        display: flex;
    }

    .ly_cont_main {
        width: calc(100vw - 295px);
        max-width: calc(1230px - 295px);
    }

    .ly_cont_main_booklist {
        margin-left: 15px;
    }

/*申請情報変更 確認画面で*/
    .confirm_needed {
        margin-left: 2rem;
    }
}

/*
 * スマホの縦画面(~480px)のみ
 */
@media screen and (max-width: 480px) {

.bl_coverBox_img{
    padding-right: 0px;
}

/*数値入力フォームの横paddingを調整*/
    .entryTable input[type="number"] {
    padding:5px;
    }
/*マイページで出来ること項目をモバイル時に縦並び*/
    .bl_coverBox_access {
        width: 100%;
    }

/*申請情報変更画面のtableをレスポンシブ対応*/
    .edit-individual-form {
        margin:0 auto;
    }
    .entryTable .pass_changeBtn {
    margin-left: 0;
    }
    .entryTable {
        width: 100%;
        table-layout: fixed;
    }
    .entryTable th {
        width: 30%;
        font-size: .8rem;
        padding: 0;
        text-align: center;
    }
    .entryTable td {
        width: 70%;
    }
    .entryTable input,
    .entryTable textarea {
        width: 100%;
    }
    .entryTable input[type="checkbox" i]  {
        width: 10%;
    }
    #c_postalcode {
        width: 30%;
    }
    #l_postalcode {
        width: 50%;
    }
    #tel_number_f, #tel_number_s, #tel_number_t,
    #fax_number_f, #fax_number_s, #fax_number_t {
        width: 25%;
        padding: 10px 0;
        text-align: center;
    }
    .entryBtns {
        margin-left: 0;
    }
    .entryBtns .entryBtn,
    .withdrawalBtn {
        width: 135px;
    }

    .entryTable caption {
    font-size: 1.3rem;
    }

/* entry/indexのボタン横幅*/
    .entry_index .el_btn {
        width: 90%;
        margin: 0 0 30px 0;
        font-size: 1rem;
        padding-left: 0.3rem;
        padding-right: 1.7rem;
    }

    .entry_index h1 {
        margin-left: 0;
    }

    .btn_entry_index {
        padding-left: 0;
    }

/*図書一覧のソートボックス*/
    .cp_ipselect {
        width: 35%;
        min-width: 15rem;
    }

    /* コンテンツエリア */
    .ly_cont.ly_cont__col{
        flex-direction: column;
    }
    .ly_cont_main{
        margin-right: 0;
        margin-bottom: 60px;
    }
    /* カード */
    .bl_cardUnit__col3 > .bl_card{
        margin-bottom: -20px;
    }
    .bl_cardUnit > .bl_card{
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

/* online送信 */
    .check_online{
        font-size: 12px;
        white-space: nowrap;
        overflow-x: auto;
    }
    .br::before{
        content: "\A";
        white-space: pre;
    }
    .online_font1{
        font-size: 13px;
    }
    .online_font2{
        font-size: 12px;
    }
    .online_qr{
        width: 10%;
        height: 10%;
    }
}

/*パスワード変更ページのアナウンス*/
.announse_passwoord_update {
    margin:0 auto;
    padding: 1rem;
    max-width:769px;
}

.brk::after {
     content: "\A";
     white-space: pre;
 }

/*
** 便利な奴ら
*/

@media screen and (min-width: 680px){
  .br_pc { display:block; }
  .br_sp { display:none; }
}
@media screen and (max-width: 680px){
  .br_pc { display:none; }
  .br_sp { display:block; }
}