@charset "utf-8";

@media screen and (max-width : 640px) {
.list_top_news .list_wrapper>li {
	flex-direction: column;
}
.list_top_news .list_wrapper>li:not(:last-of-type) {
    margin-bottom: 28px;
    padding-bottom: 32px;
}
.list_top_news .item_date {
    width: auto;
    margin: 0 0 10px;
    font-size: 87.5%;
}

.list_top_buttons {
    gap: 8px;
}
.list_top_buttons .button_common {
    width: calc(50% - 4px);
    max-width: 100%;
    display: table;
}
.list_top_buttons .button_common a {
    height: 72px;
}
.list_top_buttons .button_common:not(:nth-child(2n+1):last-child) a {
    padding-right: 52px;
}
.list_top_buttons .button_common:not(:nth-child(2n+1):last-child) a::after {
    right: 52px;
}
.list_top_buttons .button_common:nth-child(2n+1):last-child {
    width: calc(100% - 54px);
}

.contents_top {
    flex-direction: column;
    gap: 0;
}
.contents_top .contents_wrapper {
    margin-bottom: 44px;
}
.contents_top .contents_wrapper_navigation,
.contents_top .contents_wrapper_event {
    width: 100%;
}
.contents_top .contents_wrapper_navigation {
    margin-bottom: 30px;
}
.contents_top .contents_wrapper_navigation .block_top_contents .block_heading::after,
.contents_top .contents_wrapper_event .block_top_contents .block_heading::after {
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/decoration_ribbon_02_sp.png);
}
.contents_top .contents_wrapper_navigation .block_top_contents:not(:last-of-type) {
    margin-bottom: 30px;
}
.contents_top .contents_wrapper_navigation .block_top_contents:nth-child(even) .block_heading {
    background-image: url(/shared/site_library_kids_rn/images/icon/icon_arrow_01.png)
}
.contents_top .contents_wrapper_navigation .block_top_contents:nth-child(even) .block_heading::after {
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/decoration_ribbon_01_sp.png);
}
.contents_top .contents_wrapper_navigation .block_top_contents .block_heading {
    height: 100px;
    padding: 10px 86px 15px 40px;
    background-image: url(/shared/site_library_kids_rn/images/icon/icon_arrow_01_alt.png);
    background-position: 12px center;
    background-size: 20px auto;
    font-size: 150%;
}
.contents_top .contents_wrapper_navigation .block_top_contents .block_heading::after {
    top: -21px;
    right: -5px;
}
.contents_top .contents_wrapper_navigation .block_top_contents .block_heading:hover .heading_wrapper::after {
    transform: scale(0, 1);
}
.contents_top .contents_wrapper_event .block_top_contents::after {
    width: 61px;
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/decoration_character_02_sp.png);
    right: 11px;
    bottom: -20px;
}
.contents_top .contents_wrapper_event .block_top_contents .block_heading {
    padding-right: 12px;
}
.contents_top .contents_wrapper_event .block_top_contents .block_heading::after {
    top: -21px;
    right: -4px;
}
.contents_top .contents_wrapper_event .block_top_contents .block_heading h2 {
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/pattern_border_03_sp.png);
    padding: 14px 36px 12px 0;
}
.contents_top .contents_wrapper_event .block_top_contents .block_wrapper {
    padding: 24px 12px 17px;
}
.contents_top .contents_wrapper_event .list_top_buttons {
    gap: 12px;
}
.contents_top .contents_wrapper_event .block_top_contents .block_footing {
    padding: 0 76px 20px 12px;
}

.card_top .card_wrapper {
    padding: 18px 10px 16px;
    background-position: calc(100% - 10px) 22px;
}
.card_top .card_wrapper:hover .card_title::after {
    transform: scale(0, 1);
}
.card_top .card_label {
    margin: 0 30px 12px 0;
    padding: 1px 7px;
    border-radius: 15px;
    font-size: 87.5%;
}
.card_top .card_title {
    margin-bottom: 3px;
    font-size: 125%;
}
.card_top .card_detail {
    font-size: 100%;
    line-height: 1.5;
}

.block_top_contents {
    border-top-right-radius: 32px;
}
.block_top_contents::after {
    width: 50px;
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/decoration_character_01_sp.png);
    right: 6px;
    bottom: -9px;
}
.block_top_contents .block_heading {
    padding: 0 12px;
}
.block_top_contents .block_heading::after {
    width: 45px;
    height: 64px;
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/decoration_ribbon_01_sp.png);
    top: -26px;
    right: -4px;
}
.block_top_contents .block_heading h2 {
    padding: 14px 36px 12px 0;
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/pattern_border_02_sp.png);
    font-size: 150%;
}
.block_top_contents .heading_sentence {
    display: block;
}
.block_top_contents .block_icon {
    width: 80px;
    right: 19px;
    bottom: -24px;
}
.block_top_contents .block_wrapper {
    padding: 24px 12px 28px 12px;
}
.block_top_contents .block_wrapper:has(.list_top_buttons .button_common:nth-child(even):last-child) {
    padding-bottom: 100px;
}

.section_top_news {
    padding: 40px 0;
    border-bottom-width: 1px;
    background-size: 0;
}
.section_top_news .link_simple a,
.contents_top .link_simple a {
	padding-bottom: 4px;
	font-size: 112.5%;
}
.section_top_news .section_title + .section_wrapper {
    margin-top: -26px;
}
.section_top_news .section_title h2 {
	margin: 0;
    padding: 4px 42px 7px 40px;
    border-radius: 30px;
    font-size: 150%;
}
.section_top_news .section_title h2::before {
    width: 27px;
    height: 41px;
    top: -11px;
    left: -3px;
}
.section_top_news .section_wrapper {
    padding: 53px 15px 41px;
}
.section_top_news .section_navigation {
    margin-top: 17px;
}
.section_top_news .section_navigation .link_simple {
	width: 100%;
    padding: 0 16px 0 121px;
	display: flex;
	justify-content: flex-end;
}
.section_top_news .section_navigation .link_simple::before {
    width: 101px;
    height: 108px;
    background-image: url(/shared/templates/library_kids_top_rn/images/icon/decoration_news_sp.png);
    top: -41px;
}

.section_top_contents {
    padding: 30px 0 81px;
}

/* ==================================================
accessibility
================================================== */
.fsize_small #tmp_wrapper .section_top_news .link_simple a,
.fsize_small #tmp_wrapper .contents_top .link_simple a {
    background-position: left 7px;
}
.no_javascript .card_top .card_wrapper .card_title:hover {
    text-decoration: none;
}
.color_blue #tmp_wrapper .contents_top .contents_wrapper_navigation .block_top_contents .block_heading,
.color_black #tmp_wrapper .contents_top .contents_wrapper_navigation .block_top_contents .block_heading,
.color_yellow #tmp_wrapper .contents_top .contents_wrapper_navigation .block_top_contents .block_heading {
    padding-left: 12px;
    padding-right: 110px;
}
.color_blue #tmp_wrapper .contents_top .contents_wrapper_navigation .block_top_contents .block_heading:hover .heading_wrapper,
.color_black #tmp_wrapper .contents_top .contents_wrapper_navigation .block_top_contents .block_heading:hover .heading_wrapper,
.color_yellow #tmp_wrapper .contents_top .contents_wrapper_navigation .block_top_contents .block_heading:hover .heading_wrapper,
.color_blue #tmp_wrapper .card_top .card_wrapper:hover .card_title,
.color_black #tmp_wrapper .card_top .card_wrapper:hover .card_title,
.color_yellow #tmp_wrapper .card_top .card_wrapper:hover .card_title {
    text-decoration: none;
}
.color_blue #tmp_wrapper .card_top .card_wrapper:has(.card_title:focus) .card_title,
.color_black #tmp_wrapper .card_top .card_wrapper:has(.card_title:focus) .card_title,
.color_yellow #tmp_wrapper .card_top .card_wrapper:has(.card_title:focus) .card_title {
    text-decoration: underline;
}
}