@charset "UTF-8";
/* CSS Document */
@media screen and (max-width: 1330px) {
    #about-slider .flex-about-box {
        flex-flow: column;
        align-items: center;
        min-height: 530px;
    }
    #about-slider .slick-dots li button {
        max-width: 80%;
    }
    #about-slider .slick-dots li button:before {
        left: -29%;
    }
    #about-slider .flex-about-box p {
        width: 100%;
    }
    #aboutcenter .cap-wrap .gan-cap {
        width: 70%;
        margin: 0 auto;
        text-align: center;
    }
}
@media screen and (max-width: 1120px) {
    /*共通-------------------------------------------------------------*/
    .tb {
        display: block;
    }
    .youtube-area iframe {
        width: 100%;
        height: 340px;
    }
    /*外来-------------------------------------------------------------*/
    .gairai-wrap_btn {
        width: 100%;
    }
    /*がんとくらし-------------------------------------------------------------*/
    #life .flex-box_wrap {
        flex-flow: column-reverse;
    }
    .top-title_oren {
        width: 98%;
        margin: 0 auto 32px;
    }
    .top-title_oren::before {
        width: 60px;
    }
    #life .cap-wrap {
        width: 90%;
        margin: 0 auto;
        text-align: center;
    }
    #life .life-list {
        width: 90%;
        margin: 0 auto;
        gap: 16px;
    }
    .gairai-order {
        width: 100%;
    }
    /*がん治療センターとは-------------------------------------------------------------*/
    #aboutcenter .flex-box_wrap {
        gap: 0px;
    }
    .center-img {
        width: 100%;
    }
    .center-img img {
        border-radius: 0px;
    }
    #aboutcenter .flex-box_wrap {
        flex-flow: column;
    }
    #aboutcenter::after {
        background-image: none;
    }
    /*がん治療センタースライド-------------------------------------------------------------*/
    #about-slider {
        max-width: 98%;
        flex-flow: column-reverse;
        overflow: hidden;
        gap: 32px;
    }
    #about-slider .slick-list.draggable {
        width: 90%;
        margin: 0 auto;
    }
    #about-slider .about-slider_list {
        margin: 0px 0.1%;
        padding: 20px;
        height: auto;
        max-height: fit-content;
        min-height: 670px;
    }
    #about-slider .flex-about-box {
        flex-flow: column
    }
    #about-slider .box-about-img {
        width: 100%;
        max-width: 60%;
        height: fit-content;
        margin: 0 auto;
        padding: 30px 0 0 0;
    }
    #about-slider .slick-dots::before {
        top: 0;
    }
    #about-slider .flex-box_wrap p {
        font-size: 95%;
        line-height: 160%;
        text-align: left;
    }
    #about-slider .flex-about-box p {
        width: 100%;
    }
    #aboutcenter .cap-wrap {
        width: 100%;
        text-align: center;
    }
    #about-slider .slick-dots {
        width: 90%;
        margin: 0 auto;
        height: 190px;
        flex-wrap: revert-layer;
        align-items: self-end;
    }
    #about-slider .slick-dots::before {
        top: 0px;
    }
    #about-slider .slick-dots li button {
        width: 100%;
        height: 70px;
        font-size: 80%;
        padding: 4px;
        border-radius: 3px;
    }
    #about-slider .slick-dots li button:before {
        width: 100%;
        height: 40px;
        top: -86%;
        left: 0;
        font-size: 12px;
        line-height: 49px;
        letter-spacing: -1px;
        background-position: 48% 50%;
    }
    #about-slider .slick-dots li button::after {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        border-style: solid;
        border-width: 0 7.8px 15.5px 7.8px;
        border-color: transparent transparent #FFF5EF;
        translate: -50% -100%;
    }
    #about-slider .slick-dots li.slick-active button::after {
        transition: 0.3s;
        border-color: transparent transparent #FFC4A2;
    }
    #about-slider .slick-next, #about-slider .slick-prev {
        width: 25px;
        height: 25px;
        top: 70%;
    }
    #about-slider .slick-prev {
        left: 5%;
    }
    #about-slider .slick-next {
        right: 5%;
    }
    /*部門紹介-------------------------------------------------------------*/
    .br-sp-depa {
        display: none;
    }
    /*お知らせ-------------------------------------------------------------*/
    .news-year-selector {
        width: 98%;
    }
    .newsmenu-select {
        padding: 4px 16px 4px 4px;
        font-size: 90%;
        border: 2px solid #FC6821;
        border-radius: 3px;
    }
    .news-list_wrap {
        width: 90%;
        margin: 20px auto 0;
        padding: 20px;
        min-height: 300px;
    }
    .news-content {
        padding: 30px 10px;
    }
    .news-list-title {
        font-size: 90%;
        line-height: 180%;
    }
    .list-news_box {
        width: 60px;
        min-width: 60px;
        padding: 0px;
        margin: 0px 10px 0px 0px;
    }
    .news-content .news-day {
        font-size: 80%;
    }
    .news-content .news-category, .news-content .event-category, .news-content .active-category, .news-content .doctor-category {
        font-size: 80%;
    }
    .news-list-link a {
        font-size: 90%;
    }
    /*	カテゴリ*/
    .category_btn-list {
        width: 100%;
        flex-flow: wrap;
        gap: 8px;
    }
    .category_btn-list_item {
        width: calc(46% - -20px);
        padding: 4px;
        margin: 0;
        font-size: 90%;
    }
}
@media screen and (max-width: 960px) {
    /*ボタン-------------------------------------------------------------*/
    .quick-top_btn {
        gap: 20px;
    }
    .quick-top_btn li a {
        padding: 10px;
    }
    .quick-top_btn li a img {
        height: 60px;
    }
    .quick-top_btn li a p {
        line-height: 150%;
    }
    /*外来-------------------------------------------------------------*/
    .gairai-box {
        flex-flow: column;
    }
    .gairai-wrap_btn {
        width: 100%;
    }
    .gairai-cap {
        margin-bottom: 20px;
    }
    .gairai-wrap h3 {
        margin: 30px 0 0px;
    }
    .gairai-wrap h3, .gairai-wrap .attention {
        text-align: center;
    }
    #about-slider .slick-dots li {
        margin: 0;
        height: fit-content;
    }
    #Department .department-list li a {
        flex-flow: column;
    }
    #Department .sp-wrap {
        flex-flow: column;
    }
    #Department .depa-cap {
        width: 100%;
    }
    #Department .sp-wrap img {
        width: 80px;
        height: 80px;
        margin: 0 auto;
    }
    #Department .arrow-wrap {
        width: 100%;
        display: flex;
        justify-content: end;
    }
    /*動画-------------------------------------------------------------*/
    .youtube-area {
        position: relative;
        width: 100%;
        padding-top: 56.25%;
    }
    .youtube-area iframe {
        position: absolute;
        top: 0;
        right: 0;
        width: 100% !important;
        height: 100% !important;
    }
}
@media screen and (max-width: 700px) {
    /*共通-------------------------------------------------------------*/
    .tb {
        display: none;
    }
    .br-sp-depa {
        display: block;
    }
    .top_link-btn-w, .top_link-btn-oren {
        font-size: 90%;
    }
    .oren-bg::before {
        height: 180px;
    }
    section {
        margin: 80px auto;
    }
    .arrow-link_w, .arrow-link_o, .arrow-link_f {
        width: 25px;
        height: 25px;
    }
    .gairai-wrap::before, .news-list_wrap::after {
        height: 60px;
        top: -30px;
    }
    /*TOP画像-------------------------------------------------------------*/
    #top-main section {
        margin: 20px auto;
    }
    #top-main {
        margin: 0 auto;
    }
    #top-main .top-wrap {
        margin: 20px auto;
    }
    #top-main .top-wrap::after {
        width: 30%;
        height: 90%;
        top: 20px;
        left: 20px;
        background-image: url(../img/index/catchcopy_sp.svg);
        background-size: contain;
    }
    #top-main .top-wrap img {
        max-width: 1680px;
        width: 100%;
        height: 500px;
        object-fit: cover;
        border-radius: 10px;
    }
    #top-main .slick-dots {
        right: 10px;
        left: auto;
        bottom: 25px;
    }
    #top-main .slick-dots li {
        margin: 20% 0px 0;
    }
    #top-main .slick-dots li button:before {
        font-size: 14px;
    }
    /*ボタン-------------------------------------------------------------*/
    .quick-top_btn {
        margin: 20px auto 0;
        flex-wrap: wrap;
        gap: 14px 12px;
    }
    .quick-top_btn li {
        width: 47%;
        height: 100%;
    }
    .quick-top_btn li a {
        padding: 10px;
    }
    .quick-top_btn li a p {
        line-height: 150%;
        font-size: 70%;
		font-weight: 700;
    }
    .quick-top_btn li a img {
        height: 60px;
    }
    /*外来-------------------------------------------------------------*/
    .gairai-wrap {
        padding: 20px;
    }
    .gairai-wrap_btn li .kibou-btn, .gairai-wrap_btn li .kikan-btn {
        padding: 30px 14px;
        font-size: 80%;
        font-weight: 700;
        line-height: 220%;
        letter-spacing: 0;
        position: relative;
    }
    /*がんとくらし-------------------------------------------------------------*/
    .gairai-cap {
        text-align: left;
    }
    #life .life-list li {
        width: 100%;
    }
    #life .life-list li a {
        font-size: 80%;
    }
    .gairai-wrap .attention {
        margin: 0 0 10px 0;
        font-size: 76%;
    }
    #life .cap-wrap {
        text-align: left;
    }
    /*がん治療センターとは-------------------------------------------------------------*/
    #aboutcenter .cap-wrap {
        width: 90%;
    }
    #aboutcenter .flex-box_wrap {
        flex-flow: column;
    }
    #aboutcenter::after {
        background-image: none;
    }
    .center-img {
        display: flex;
        justify-content: end;
    }
    .center-img img {
        width: 90%;
        height: 100%;
        border-radius: 5px 0 0 5px;
    }
    #about-slider .flex-box_wrap {
        flex-flow: nowrap;
        gap: 10px;
    }
    #about-slider .slick-dots li button:before {
        background-position: 44% 50%;
    }
    #about-slider .slick-prev {
        left: 2%;
    }
    #about-slider .slick-next {
        right: 2%;
    }
    #about-slider .slick-list.draggable {
        width: 90%;
    }
    #about-slider .box-about-img {
        width: 100%;
        max-width: 100%;
        padding: 0;
        height: fit-content;
    }
    #aboutcenter .cap-wrap .gan-cap {
        width: 100%;
        text-align: left;
    }
    .gan-cap_wrap::before {
        width: 90px;
        height: 80px;
        position: absolute;
        right: 2%;
    }
    #about-slider .slick-dots li button {
        max-width: 90%;
    }
    /*挨拶と医療関係者-----------*/
    .gaibu-wrap_btn {
        width: 90%;
        margin: 0 auto;
        flex-flow: column;
        gap: 20px;
    }
    .gaibu-btn {
        padding: 4px 10px;
        align-items: center;
    }
    /*部門紹介-------------------------------------------------------------*/
    #Department .department-list {
        width: 90%;
        margin: 0 auto;
    }
    #Department .department-list li a {
        flex-flow: column;
        padding: 10px;
        justify-content: space-between;
        gap: 0px;
        position: relative;
    }
    #Department .depa-cap {
        width: 100%;
        text-align: center;
    }
    #Department .department-list li img {
        width: 60px;
        height: 60px;
    }
    #Department .department-list .arrow-wrap img {
        width: 25px;
        height: 25px;
    }
    #Department .arrow-wrap {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        position: absolute;
        bottom: 10px;
        right: 10px;
    }
    #Department .department-list li a span {
        font-size: 100%;
        line-height: normal;
    }
    #Department .sp-wrap {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        flex-flow: column-reverse;
        align-items: center;
        gap: 10px;
    }
    #Department .sp-none_i {
        display: none;
    }
    .category_btn-list_item {
        width: calc(43% - -10px);
    }
    /*	お知らせ*/
    .news-list_wrap, .new-list-box {
        width: 100%;
    }
    .new-list-box li {
        display: flex;
        flex-flow: column;
    }
    .list-news_box {
        width: 100%;
        min-width: 0;
        padding: 0px;
        margin: 0;
    }
    /*	カテゴリ*/
    .category_btn-list {
        gap: 14px;
    }
    /*	リンク*/
    #link .linsks-list {
        max-width: 100%;
        gap: 20px;
    }
    #link .linsks-list li {
        width: calc(40% - 0px);
    }
    #link .linsks-list li a img {
        width: 100%;
        height: 100%;
    }
}