@charset "UTF-8";

/* ポートフォリオ　－　トップページ SP */

@media screen and (max-width: 767px) {

    #main_visual {
        padding-top: 40px;
        max-width: 100%;
        margin: 0 auto 60px auto;
    }

    /* Welcome */
    .slider_text {
        font-size: 1.5rem;
        top: 70px;
    }
    @keyframes slideInRight {
        0% {
            transform: translateX(50px);
            opacity: 0;
        }
        100% {
            transform: translateX(-73px);
            opacity: 1;
        }
    }

    /****************************************
    content (Menu・News）共通
    ****************************************/
    .content_title {
        font-size: 1.5rem;
        margin-bottom: 20px;
    }
    
    /****************************************
    Menu    (#menu_box)
    ****************************************/
    #menu_box {
        width: 100%;
        margin: 0 auto 80px auto;
    }
    .menu_inner {
        flex-direction: column;   
    }
    .menu_inner .flex_items {
        width: 85%;
        margin: 0 auto 40px auto;
    }
    .menu_inner .flex_items:last-child {
        margin-bottom: 0;
    }
    .menu_detail .menu_detail_title {
        height: 50px;
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 500px) {
    .menu_inner .flex_items {
        width: 100%;
        margin: 0 auto 40px auto;
    }
    .menu_detail .menu_detail_title {
        height: 40px;
    }
}

    /*****************************
    News    (#news_box)
    *****************************/
@media screen and (max-width: 767px) {
    #news_box {
        width: 100%;
        margin: 0 auto 80px auto;
    }
    .news_record {
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 10px 0;
    }

    /* 日付 */

    /* アイコン */
    .news_icon {
        padding: 3px 5px;
    }

    /* お知らせ文章 */
    .news_text {
        width: 100%;
        margin-top: 10px;
    }

    /*****************************
    News 内のアコーディオンメニュー
    *****************************/
    .news_record {
        font-size: 0.85rem;
    }

    /* 矢印アイコン */
    #news_box .icon {
        display: block;
        position: relative;
        margin-left: 10px;
        transform-origin: center 43%; /* 中心点の位置 */
    }
    #news_box .icon::before, 
    #news_box .icon::after {
        content: "";
        position: absolute;
        display: block;
        width: 15px;
        height: 3px;
        background-color: #164b09;
    }

    /* 吹き出し内の「→」以降のリンク */
    #news_box .accordion_link {
        font-size: 0.7rem;
    }

}