@charset "UTF-8";

.topMain {
    margin-left: auto;
    margin-right: auto;
    padding: 10px 2.94vw 0;
    border-radius: 32px
}

@media only screen and (min-width:1081px) {
    .topMain {
        max-width: 1600px;
        border-radius: 16px;
        margin-left: auto;
        margin-right: auto
    }
}

@media only screen and (max-width:1081px) {
    .topMain {
        padding: 10px 4vw 0
    }
}

.topMain .topSlideWrap {
    position: relative;
    border-radius: 32px
}

@media only screen and (max-width:1081px) {
    .topMain .topSlideWrap {
        border-radius: 16px
    }
}

.topMain .topSlideWrap h1 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 32px 56px 32px 12px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 6px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    left: -1px;
    bottom: -74px;
    position: absolute;
    border-radius: 0 32px 32px 0;
    background: #FBF4E4;
    z-index: 2
}

@media only screen and (max-width:1081px) {
    .topMain .topSlideWrap h1 {
        padding: 24px 34px 28px 26px;
        gap: 2px;
        bottom: -34px
    }
}

@media only screen and (max-width:681px) {
    .topMain .topSlideWrap h1 {
        padding: 24px 28px 28px 22px
    }
}

@media only screen and (max-width:440px) {
    .topMain .topSlideWrap h1 {
        padding: 24px 24px 28px 18px
    }
}

.topMain .topSlideWrap h1 span.eng {
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1em;
    font-size: clamp(40px, 12.4vw, 66px);
    text-transform: uppercase
}

@media only screen and (max-width:1081px) {
    .topMain .topSlideWrap h1 span.eng {
        font-size: clamp(40px, 8.4vw, 66px)
    }
}

@media only screen and (max-width:440px) {
    .topMain .topSlideWrap h1 span.eng {
        font-size: clamp(32px, 8.4vw, 60px)
    }
}

.topMain .topSlideWrap h1 span:not(.eng) {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px
}

.topMain .topSlideWrap h1 span:not(.eng):before {
    content: "";
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 2px;
    background-image: radial-gradient(circle, #000 1px, transparent 1px);
    background-repeat: repeat-x;
    background-position: left center;
    background-size: 8px 2px
}

.topMain .topSlideWrap h1:after,
.topMain .topSlideWrap h1:before {
    content: "";
    display: block;
    width: 34px;
    height: 34px;
    position: absolute;
    left: -2px;
    top: -32px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2234%22%20height%3D%2234%22%20viewBox%3D%220%200%2034%2034%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M2%200C2%2017.6731%2016.3269%2032%2034%2032V34L0%2034L0%200L2%200Z%22%20fill%3D%22%23FBF4E4%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

.topMain .topSlideWrap h1:after {
    bottom: 72px;
    top: auto;
    left: auto;
    right: -32px
}

@media only screen and (max-width:1081px) {
    .topMain .topSlideWrap h1:after {
        bottom: 32px
    }
}

.topMain .topSlideWrap h1.h1-eng span.eng {
    padding-bottom: 10px;
    position: relative
}

.topMain .topSlideWrap h1.h1-eng span.eng:before {
    content: "";
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -10px;
    height: 2px;
    background-image: radial-gradient(circle, #000 1px, transparent 1px);
    background-repeat: repeat-x;
    background-position: left center;
    background-size: 8px 2px
}

.topMain .topSlideWrap .slide-media {
    border-radius: 32px;
    overflow: hidden;
    aspect-ratio: 322/123
}

@media only screen and (max-width:1081px) {
    .topMain .topSlideWrap .slide-media {
        aspect-ratio: 168/100
    }
}

@media only screen and (max-width:681px) {
    .topMain .topSlideWrap .slide-media {
        aspect-ratio: 1/0.88
    }
}

.topMain .topSlideWrap .slide-media picture {
    width: 100%;
    display: block;
    width: 100%;
    height: 100%;
    position: relative
}

.topMain .topSlideWrap .slide-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.btnList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 16px 8px;
    margin-bottom: 128px
}

@media only screen and (max-width:1081px) {
    .btnList {
        margin-bottom: 64px;
        gap: 8px;
        width: 100%
    }
}

.btnList li {
    width: calc((100% - 8px) / 2)
}

@media only screen and (max-width:681px) {
    .btnList li {
        width: 100%
    }
}

.btnList li.btn a {
    width: 100%;
    max-width: none
}

.btnList li.btn.btnActive a {
    background: #2E6F40;
    color: #fff
}

.btnList li.btn.btnActive a span:before {
    background: #fff
}

.btnList li.btn.btnActive a span:after {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2211%22%20height%3D%229%22%20viewBox%3D%220%200%2011%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M6.41071%207.625L9.62499%204.125L6.41071%200.625%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M0.625%204.125L9.625%204.125%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

.btnList li.btn.btnActive a:hover {
    background: #fff;
    color: #2E6F40
}

.btnList li.btn.btnActive a:hover span:before {
    background: #2E6F40
}

.btnList li.btn.btnActive a:hover span:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2211%22%20height%3D%229%22%20viewBox%3D%220%200%2011%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M6.41071%207.625L9.62499%204.125L6.41071%200.625%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M0.625%204.125L9.625%204.125%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

.contentsWrap #contents {
    margin-top: -120px;
    padding-top: 120px
}

.contentsSub {
    max-width: 1260px;
    width: 90%;
    margin-left: auto;
    margin-right: auto
}

.contentsSub h2 {
    font-size: 2.4rem;
    margin-bottom: 48px;
    font-weight: 600
}

@media only screen and (max-width:1081px) {
    .contentsSub h2 {
        margin-bottom: 32px;
        font-size: 2rem
    }
}

.contentsSub h2 span {
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1em;
    font-size: 4.8rem;
    display: block;
    line-height: 1.2em;
    margin-bottom: 12px
}

@media only screen and (max-width:1081px) {
    .contentsSub h2 span {
        font-size: 3.2rem;
        margin-bottom: 4px
    }
}

.contentsSub h2.booksH2 {
    margin-bottom: 16px
}

.contentsSub h3 {
    font-size: 3.2rem;
    font-weight: 500;
    padding-top: 16px;
    border-top: 1px solid #010010;
    position: relative;
    margin-bottom: 32px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 18px;
    line-height: 1.5;
    padding-left: 40px
}

@media only screen and (max-width:1081px) {
    .contentsSub h3 {
        padding-left: 28px
    }
}

.contentsSub h3 .newIcon {
    background: #2E6F40;
    color: #fff;
    font-size: 1.6rem;
    font-weight: 800;
    line-height: 1;
    border-radius: 4px;
    padding: 5px 10px 6px;
    margin-left: 6px;
    position: relative
}

.contentsSub h3 .newIcon:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-right: 5px solid #2E6F40;
    border-left: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    left: -5px
}

@media only screen and (max-width:1081px) {
    .contentsSub h3 {
        font-size: 2rem;
        gap: 10px
    }
}

.contentsSub h3:before {
    content: "";
    display: block;
    width: 26px;
    height: 20px;
    position: absolute;
    top: 32px;
    left: 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2226%22%20height%3D%2220%22%20viewBox%3D%220%200%2026%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M24.9059%201.09053C21.5192%20-0.331137%2017.7222%20-0.364199%2014.3193%200.999613C13.4666%201.3385%2012.5334%201.3385%2011.6807%200.999613C8.2698%20-0.364199%204.48082%20-0.331137%201.09406%201.09053C0.482673%201.34677%200%202.13199%200%202.7767V19.1755C0%2019.8202%200.482673%2020.093%201.09406%2019.8368C4.48082%2018.4151%208.27785%2018.382%2011.6807%2019.7458C12.5334%2020.0847%2013.4666%2020.0847%2014.3193%2019.7458C17.7302%2018.382%2021.5192%2018.4151%2024.9059%2019.8368C25.5173%2020.093%2026%2019.8285%2026%2019.1755C26%2013.712%2026%208.24022%2026%202.7767C26%202.13199%2025.5173%201.34677%2024.9059%201.09053Z%22%20fill%3D%22%232E6F40%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

@media only screen and (max-width:1081px) {
    .contentsSub h3:before {
        width: 16px;
        height: 12px;
        background-size: 16px;
        top: 24px
    }
}

.attentionCap {
    display: inline-block;
    background: #BF2121;
    color: #fff;
    border-radius: 4px;
    font-weight: 800;
    font-size: 2rem;
    margin-bottom: 20px;
    padding: 2px 20px
}

@media only screen and (max-width:1081px) {
    .attentionCap {
        font-size: 1.8rem
    }
}

.booksDetail {
    font-size: 1.2rem;
    margin-bottom: 48px
}

.newBooksBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 40px 80px
}

@media only screen and (max-width:1081px) {
    .newBooksBox {
        gap: 30px 80px
    }
}

.newBooksBox .photoBox {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (max-width:1081px) {
    .newBooksBox .photoBox {
        -webkit-box-flex: 0;
        -ms-flex: none;
        flex: none;
        width: 100%;
        text-align: center
    }
}

.newBooksBox .photoBox img {
    -webkit-box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.25)
}

@media only screen and (max-width:1081px) {
    .newBooksBox .photoBox img {
        max-width: 180px
    }
}

.newBooksBox .txtBox {
    -webkit-box-flex: 1.8;
    -ms-flex: 1.8;
    flex: 1.8
}

@media only screen and (max-width:1081px) {
    .newBooksBox .txtBox {
        -webkit-box-flex: 0;
        -ms-flex: none;
        flex: none;
        width: 100%
    }
}

.newBooksBox .txtBox>p {
    margin-bottom: 40px
}

@media only screen and (max-width:1081px) {
    .newBooksBox .txtBox>p {
        margin-bottom: 20px
    }
}

.newBooksBox .txtBox .btn.btnBlank {
    margin-top: 48px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto
}

.newBooksBox .txtBox .btn.btnBlank a {
    max-width: none;
    padding: 19px 20px 19px 24px
}

.newBooksBox .txtBox .btn.btnBlank a span:before {
    display: none
}

.newBooksBox .txtBox .btn.btnBlank a span:after {
    content: "";
    display: block;
    width: 23px;
    height: 23px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M15.8977%2020.0283L15.8977%2021.625L0.625%2021.625L0.624999%206.35227L2.18004%206.35227%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M6.35229%200.624977V15.8977L21.625%2015.8977V0.624976L6.35229%200.624977Z%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A");
    background-repeat: no-repeat
}

.newBooksBox .txtBox .btn.btnBlank a:hover span:after {
    width: 23px;
    height: 23px;
    background-size: 23px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M13.8409%2017.3814L13.8409%2018.75L0.75%2018.75L0.749999%205.65909L2.08289%205.65909%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M5.65918%200.749911V13.8408L18.7501%2013.8408V0.749911L5.65918%200.749911Z%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

dl.booksOutline {
    -webkit-box-shadow: 1px 8px 24px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 1px 8px 24px 0 rgba(0, 0, 0, 0.15);
    border-radius: 16px;
    overflow: hidden
}

dl.booksOutline>dt a {
    background: #fff;
    display: block;
    position: relative;
    color: #2E6F40;
    font-size: 2rem;
    padding: 24px 44px 24px 24px;
    text-decoration: underline;
    text-underline-offset: 2px
}

dl.booksOutline>dt a:before {
    content: "";
    display: block;
    width: 23px;
    height: 23px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 20px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M15.8977%2020.0283L15.8977%2021.625L0.625%2021.625L0.624999%206.35227L2.18004%206.35227%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M6.35229%200.624977V15.8977L21.625%2015.8977V0.624976L6.35229%200.624977Z%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

@media only screen and (max-width:1081px) {
    dl.booksOutline>dt a:before {
        width: 20px;
        height: 20px;
        background-size: 20px
    }
}

dl.booksOutline>dd {
    background: #f7f7f7;
    padding: 24px 44px 24px 24px;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    position: relative
}

dl.booksOutline>dd:before {
    content: "";
    display: block;
    width: 23px;
    height: 23px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 20px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M15.8977%2020.0283L15.8977%2021.625L0.625%2021.625L0.624999%206.35227L2.18004%206.35227%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M6.35229%200.624977V15.8977L21.625%2015.8977V0.624976L6.35229%200.624977Z%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

@media only screen and (max-width:1081px) {
    dl.booksOutline>dd:before {
        width: 20px;
        height: 20px;
        background-size: 20px
    }
}

dl.booksOutline>dd a {
    color: #2E6F40;
    text-decoration: underline;
    text-underline-offset: 2px
}

dl.booksOutline>dd dl {
    overflow: hidden;
    margin-top: 10px;
    line-height: 1.4
}

dl.booksOutline>dd dl dt {
    width: 5em;
    float: left;
    clear: both;
    position: relative
}

dl.booksOutline>dd dl dt:after {
    content: "：";
    display: inline-block;
    position: absolute;
    top: 0;
    right: 10px
}

dl.booksOutline>dd dl dt:not(:last-of-type) {
    margin-bottom: 10px
}

dl.booksOutline>dd dl dd {
    width: calc(100% - 5em);
    float: right
}

dl.booksOutline>dd dl dd:not(:last-of-type) {
    margin-bottom: 10px
}

dl.booksOutline a.txtLink {
    color: #2E6F40;
    text-decoration: underline;
    text-underline-offset: 2px
}

dl.booksOutline.booksOutlineWorking>dt {
    cursor: pointer;
    background: #fff;
    font-weight: 800;
    font-size: 2rem;
    padding: 24px 44px 24px 24px;
    position: relative
}

dl.booksOutline.booksOutlineWorking>dt:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 20px;
    width: 32px;
    height: 32px;
    background: #2E6F40;
    border-radius: 32px
}

dl.booksOutline.booksOutlineWorking>dt:after {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 28px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.75%206.75L12.75%206.75%22%20stroke%3D%22white%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M6.75%2012.75V0.75%22%20stroke%3D%22white%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

dl.booksOutline.booksOutlineWorking>dt.active:before {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15)
}

dl.booksOutline.booksOutlineWorking>dt.active:after {
    height: 2px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2214%22%20height%3D%222%22%20viewBox%3D%220%200%2014%202%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.75%200.75L12.75%200.75%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

dl.booksOutline.booksOutlineWorking>dd {
    display: none
}

dl.booksOutline.booksOutlineWorking>dd:before {
    right: 22px
}

dl.booksOutline.booksOutlineWorking>dd+dt {
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.booksContents>section:not(:last-of-type) {
    margin-bottom: 80px
}

@media only screen and (max-width:1081px) {
    .booksContents>section:not(:last-of-type) {
        margin-bottom: 64px
    }
}

.oldBooksList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 40px 24px
}

.oldBooksList>li {
    width: calc((100% - 120px) / 6)
}

@media only screen and (max-width:1081px) {
    .oldBooksList>li {
        width: calc((100% - 72px) / 4)
    }
}

@media only screen and (max-width:681px) {
    .oldBooksList>li {
        width: calc((100% - 48px) / 3)
    }
}

@media only screen and (max-width:440px) {
    .oldBooksList>li {
        width: calc((100% - 24px) / 2)
    }
}

.oldBooksList>li a {
    padding: 16px;
    text-align: center;
    display: block;
    -webkit-box-shadow: 1px 8px 24px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 1px 8px 24px 0 rgba(0, 0, 0, 0.15);
    background: #fff;
    border-radius: 8px
}

.oldBooksList>li a img {
    margin-bottom: 12px;
    -webkit-box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.25);
    width: 100%
}

.oldBooksList>li a p {
    font-size: 1.2rem
}

.oldBooksList>li a p span {
    display: block;
    color: #2E6F40;
    text-decoration: underline;
    text-underline-offset: 2px;
    font-size: 1.6rem
}

.oldBooksList>li .sub_text {
    display: none
}

.oldBooksList>li.hidden {
    display: none
}

.moreBtn {
    width: 400px;
    margin: 40px auto 0
}

@media only screen and (max-width:440px) {
    .moreBtn {
        width: 100%
    }
}

.moreBtn>span {
    display: block;
    background: #fff;
    border: 1px solid #2E6F40;
    color: #fff;
    line-height: 1.2em;
    padding: 15px 36px 15px 24px;
    font-weight: 800;
    border-radius: 100px;
    position: relative;
    cursor: pointer;
    color: #2E6F40
}

@media only screen and (max-width:1081px) {
    .moreBtn>span {
        font-size: 1.4rem;
        max-width: 265px;
        margin-left: auto;
        margin-right: auto
    }
}

.moreBtn>span:before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 24px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 12px;
    background: #2E6F40
}

.moreBtn>span:after {
    content: "";
    display: block;
    width: 11px;
    height: 9px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    right: 19px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2211%22%20height%3D%229%22%20viewBox%3D%220%200%2011%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M6.41071%207.625L9.62499%204.125L6.41071%200.625%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M0.625%204.125L9.625%204.125%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

.moreBtn>span:hover {
    background: #2E6F40;
    color: #fff
}

.moreBtn>span:hover:before {
    background: #fff
}

.moreBtn>span:hover:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2211%22%20height%3D%229%22%20viewBox%3D%220%200%2011%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M6.41071%207.625L9.62499%204.125L6.41071%200.625%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M0.625%204.125L9.625%204.125%22%20stroke%3D%22%232E6F40%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

.breadcrumbs {
    max-width: 1260px;
    width: 90%;
    margin: 0 auto 60px
}

.breadcrumbs ul {
    font-size: 1.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.breadcrumbs ul li:last-of-type {
    font-weight: 800
}

.breadcrumbs ul li a {
    font-weight: normal;
    color: rgba(0, 0, 0, 0.8)
}

.breadcrumbs ul li:not(:last-of-type) {
    padding-right: 15px
}

.breadcrumbs ul li:not(:first-of-type) {
    position: relative;
    padding-left: 15px
}

.breadcrumbs ul li:not(:first-of-type):before {
    content: "";
    display: block;
    width: 4px;
    height: 7px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    left: 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%224%22%20height%3D%227%22%20viewBox%3D%220%200%204%207%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.5%206.5L3.5%203.5L0.5%200.5%22%20stroke%3D%22%23010010%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A")
}

# sourceMappingURL=books.css.map