@charset "utf-8";

/***** トップページNEWS 4枠 *****/
/* news
------------------------------------------ */
.indexnews {
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
        padding: 80px 20px;

        @media screen and (max-width: 767px) {
                padding: 30px 20px;
        }

        ul {
                display: block;
                width: 100%;
                margin: 30px auto;
                box-sizing: border-box;

                @media screen and (max-width: 767px) {
                        margin: 10px auto;
                }

                li {
                        position: relative;
                        width: 100%;
                        padding: 30px 10%;
                        border-bottom: solid 1px rgba(255, 255, 255, 0.1);

                        @media screen and (max-width: 1060px) {
                                padding: 20px;
                        }

                        @media screen and (max-width: 767px) {
                                padding: 20px 0;
                        }

                        &::after {
                                /*position: absolute;
                                top: 50%;
                                transform: translateY(-50%);
                                right: 60px;
                                content: "\f178";
                                font-family: FontAwesome;
                                font-size: 16px;
                                font-weight: 400;
                                color: rgba(255, 255, 255, 0.1);*/
                                content: "";
                                position: absolute;
                                top: 50%;
                                transform: translateY(-50%);
                                right: 0;
                                width: 10%;
                                height: 1px;
                                background-color: rgba(255, 255, 255, 0.1);

                        }



                        .news_box {
                                position: relative;
                                display: flex;
                                justify-content: center;
                                align-items: center;

                                .left {
                                        width: 220px;
                                        margin-right: 40px;

                                        @media screen and (max-width: 767px) {
                                                width: 35%;
                                                margin-right: 0;
                                                padding-right: 15px;
                                        }
                                }

                                .right {
                                        width: calc(100% - 260px);

                                        @media screen and (max-width: 767px) {
                                                width: calc(100% - 35%);
                                        }

                                        h3.news_title {
                                                font-family: "source-han-serif-japanese", "游明朝", YuMincho, serif;
                                                display: block;
                                                width: 90%;
                                                font-weight: 400;
                                                font-size: 17px;
                                                text-align: left;
                                                line-height: 1.6;
                                                padding-top: 20px;
                                                letter-spacing: 0.1rem;

                                                @media screen and (max-width: 767px) {
                                                        width: 100%;
                                                        font-size: 14px;
                                                        padding-top: 10px;
                                                        letter-spacing: 0.03rem;
                                                }
                                        }
                                }

                        }
                }
        }
}

/**/
h2.news_title {
        font-family: "source-han-serif-japanese", "游明朝", YuMincho, serif;
        display: block;
        width: 90%;
        font-weight: 400;
        font-size: 25px;
        text-align: left;
        line-height: 1.6;
        padding: 15px 0 10px;

        @media screen and (max-width: 767px) {
                width: 100%;
                font-size: 18px;
                letter-spacing: 0.03rem;
        }
}

@media screen and (max-width: 1060px) {
        .indexnews ul li::after {
                right: 20px;
        }
}

@media screen and (max-width: 767px) {
        .indexnews ul li::after {
                content: none;
        }
}

.indexnews ul li .note {
        display: flex;
        align-items: center;

        .category {
                font-weight: 400;
                display: inline-block;
                padding: 2px 6px;
                box-sizing: border-box;
                border-radius: 10px;
                height: 16px;
                line-height: 16px;
                font-size: 10px;
                color: #222;
                background-color: #f5f4f2;
                text-align: center;
                letter-spacing: 0;
        }

        .days {
                box-sizing: border-box;
                font-weight: 300;
                color: rgba(255, 255, 255, 1.0);
                font-size: 11px;
                text-align: left;
                padding: 3px 0 0 15px;

                @media screen and (max-width: 767px) {
                        height: 15px;
                        line-height: 15px;
                        padding: 2px 0 0 15px;
                }
        }
}

.next_btn {
        display: block;
        width: 100%;
        max-width: 800px;
}

/* buttonMod10 */
.next_btn a.buttonMod10 {
        position: relative;
        display: inline-block;
        padding: 0;
        width: 40%;
        /*max-width: 240px;*/
        margin: 5%;
        height: 42px;
        background-color: rgba(0, 0, 0, 0.4);
        border: solid 1px #ccc;
        color: #F0F0F0;
        font-size: 13px;

        font-weight: 300;
        line-height: 42px;
        text-align: center;
        text-indent: 0.08em;
        letter-spacing: 0.08em;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;

        z-index: 1;
        float: left;
}

.next_btn a.buttonMod10:hover {
        animation: AnimeGrade 10s ease infinite;
        text-decoration: none;
        letter-spacing: 0.18em;
}

.next_btn a.buttonMod10::before {
        content: '';
        position: absolute;
        top: 20px;
        left: 0;
        width: 15px;
        height: 1px;
        background-color: #ccc;
        /*transition: .2s;*/
}

.next_btn a.buttonMod10:hover:before {
        width: 25px;
}

@media screen and (max-width: 767px) {
        .next_btn a.buttonMod10 {
                position: relative;
                display: block;
                margin: 20px auto;
                padding: 0;
                height: 30px;
                font-size: 11px;
                line-height: 30px;
                letter-spacing: 0.05em;
        }

        .next_btn a.buttonMod10::before {
                top: 14px;
        }
}

/* buttonMod11 */
.next_btn a.buttonMod11 {
        position: relative;
        display: inline-block;
        padding: 0;
        width: 40%;
        /*max-width: 240px;*/
        margin: 5%;
        height: 42px;
        background-color: rgba(0, 0, 0, 0.4);
        border: solid 1px #ccc;
        color: #F0F0F0;
        font-size: 13px;

        font-weight: 300;
        line-height: 42px;
        text-align: center;
        text-indent: 0.08em;
        letter-spacing: 0.08em;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;

        z-index: 1;
        float: right;
}

.next_btn a.buttonMod11:hover {
        animation: AnimeGrade 10s ease infinite;
        text-decoration: none;
        letter-spacing: 0.18em;
}

.next_btn a.buttonMod11::before {
        content: '';
        position: absolute;
        top: 20px;
        right: 0;
        width: 15px;
        height: 1px;
        background-color: #ccc;
        /*transition: .2s;*/
}

.next_btn a.buttonMod11:hover:before {
        width: 25px;
}

@media screen and (max-width: 767px) {
        .next_btn a.buttonMod11 {
                position: relative;
                display: block;
                margin: 20px auto;
                padding: 0;
                height: 30px;
                font-size: 11px;
                line-height: 30px;
                letter-spacing: 0.05em;
        }

        .next_btn a.buttonMod11::before {
                top: 14px;
        }
}

/***** NEWS個別ページ *****/

#news_page {
        position: relative;
        padding-bottom: 50px;

        @media screen and (max-width: 767px) {
                padding-bottom: 0;
        }
}

#news_page .news_intro {
        display: block;
        margin: 100px auto 0;
        text-align: center;

        @media screen and (max-width: 767px) {
                margin: 40px auto 0;
        }

        h2 {
                margin: 0 auto 50px;
                text-align: center;
                font-family: "source-han-serif-japanese", serif;
                font-weight: 500;
                font-size: 20px;
                line-height: 1;
                font-weight: normal;
                letter-spacing: 0.1em;
                color: #888;

                @media screen and (max-width: 768px) {
                        margin: 0 auto 20px;
                        font-size: 17px;
                }
        }
}

#news_page .news_intro h3 {
        font-size: 16px;
        font-weight: 400;
}

#news_page .box {
        position: relative;
        width: 90%;
        max-width: 1080px;
        margin: 30px auto;
}

#news_page .box .news_contents {
        width: 74%;
        float: left;

        @media screen and (max-width: 950px) {
                width: 100%;
                float: none;
        }
}

#news_page .box .news_contents ul {
        position: relative;
        width: 100%;
}


#news_page .box .news_contents ul li {
        position: relative;
        background-color: rgba(255, 255, 255, 1.0);
        color: #222;
        padding: 5%;
        z-index: 2;
}

#news_page .box .news_contents ul li h2le {
        font-family: "source-han-serif-japanese", serif;
        font-weight: 400;
        font-style: normal;
        font-size: 25px;
        font-weight: 500;
        letter-spacing: 0.06rem;
        line-height: 1.5;
        padding: 15px 0;

        @media screen and (max-width: 850px) {
                font-size: 20px;
        }
}

#news_page .box .news_contents ul li .note {
        display: flex;
        align-items: center;
}

#news_page .box .news_contents ul li .days {
        font-weight: 400;
        font-size: 11px;
        color: #666;
        text-align: left;
        padding: 4px 0 0 10px;
}

#news_page .box .news_contents ul li .category {
        display: inline-block;
        padding: 2px 6px;
        height: 16px;
        line-height: 16px;
        box-sizing: border-box;
        border-radius: 10px;
        color: #f0f0f0;
        background: #2B2B2B;
        font-size: 10px;
        font-weight: 400;
        letter-spacing: 0;
        text-align: center;
        margin-top: 2px;
        float: left;
        letter-spacing: 0;
}


#news_page .box .news_contents ul li .image {
        display: block;
        width: 100%;
        margin: 20px auto;
        text-align: center
}

#news_page .box .news_contents ul li .image img {
        width: 100%;
        height: auto;
}

#news_page .box .news_contents ul li h3.news_tit {
        width: 100%;
        margin: 0 auto 10px;
        font-weight: 400;
        font-size: 19px;
}

#news_page .box .news_contents ul li h3.news_tit span {
        font-weight: 700;
        font-size: 21px;
}

#news_page .box .news_contents ul li .news_text {
        width: 100%;
        margin: 0 auto 20px;
}

#news_page .box .news_contents ul li .info_box {
        position: relative;
        display: block;
        width: 100%;
        margin: 0 auto;
}

#news_page .box .news_contents ul li .info_box .info_txt {
        display: block;
        width: 100%;
        padding: 10px 0;
}

#news_page .box .news_contents ul li .info_box .info_txt .tit {
        display: block;
        vertical-align: middle;
        width: 25%;
        max-width: 120px;
        background: #555;
        color: #fff;
        font-size: 14px;
        text-align: center;
        float: left;
}

#news_page .box .news_contents ul li .info_box .info_txt .memo {
        display: inline-block;
        width: auto;
        margin-left: 15px;
        font-size: 15px;
}

#news_page .box .news_contents ul li .info_box .info_txt .memo a {
        color: #ED008E;
        border-bottom: 2px #bfbfbf dotted;
        margin: 0 5px;
        font-weight: bold;
}

#news_page .box .news_contents ul li .info_box .info_txt .memo a i {
        padding-left: 5px;
        font-weight: normal;
}

/*:::::::::*/
@media screen and (max-width: 767px) {
        #news_page .box .news_contents ul li {
                background-color: rgba(255, 255, 255, 1.0);
                color: #222;
        }

        #news_page .box .news_contents ul li {
                padding: 20px;
        }

        #news_page .box .news_contents ul li .image {
                display: block;
                width: 100%;
                margin: 20px auto;
                text-align: center
        }

        #news_page .box .news_contents ul li h3 {
                font-size: 115%;
                line-height: 1.7;
        }

        #news_page .box .news_contents ul li h3.news_tit {
                width: 100%;
                font-weight: 400;
                font-size: 17px;
                line-height: 1.4;
        }

        #news_page .box .news_contents ul li h3.news_tit span {
                font-weight: 700;
                font-size: 19px;
        }

        #news_page .box .news_contents ul li .news_text {
                width: 100%;
                margin: 0 auto 20px;
        }

        #news_page .box .news_contents ul li .info_box {
                position: relative;
                display: block;
                width: 100%;
                margin: 0 auto;
        }

        #news_page .box .news_contents ul li .info_box .info_txt .tit {
                display: block;
                vertical-align: middle;
                max-width: inherit;
                /*width: 90px;*/
                width: 100%;
                background: #999;
                color: #fff;
                font-size: 100%;
                line-height: 1.0;
                text-align: center;
                float: none;
                padding: 3px;
        }

        #news_page .box .news_contents ul li .info_box .info_txt .memo {

                display: block;
                width: 100%;
                margin-left: 0;
                font-size: 14px;
                background: #f8f8f8;
                padding: 10px;
                line-height: 1.4;
        }
}




/*****リストタイプ*****/

#news_page .box .news_list {
        width: 74%;
        padding: 30px 30px 0;
        background-color: #f8f8f8;
        float: left;

        @media screen and (max-width: 950px) {
                width: 100%;
                float: none;
        }
}

#news_page .box .news_list ul {
        position: relative;
        width: 100%;
}

#news_page .box .news_list ul li {
        display: block;
        margin: 0 auto 30px;
        color: #222;
}


#news_page .box .news_list ul li .boxin {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;

        @media screen and (max-width: 767px) {
                display: block;
        }
}


#news_page .box .news_list ul li .left {
        display: block;
        width: 46%;
        float: left;

        @media screen and (max-width: 767px) {
                width: 100%;
                float: none;
        }
}

#news_page .box .news_list ul li .left .image {
        width: 100%;
        text-align: center;
}

#news_page .box .news_list ul li .left .image img {
        width: 100%;
        height: auto;
}


#news_page .box .news_list ul li .right {
        display: block;
        width: 54%;
        float: right;
        padding-left: 25px;

        @media screen and (max-width: 767px) {
                width: 100%;
                float: none;
                padding-left: 0;
                margin: 20px auto;
        }
}

#news_page .box .news_list ul li h3.news_title {
        font-family: "source-han-serif-japanese", "游明朝", YuMincho, serif;
        display: block;
        width: 100%;
        font-weight: 400;
        font-size: 17px;
        text-align: left;
        line-height: 1.6;
        padding-top: 20px;
        letter-spacing: 0.1rem;
        color: #222;

        @media screen and (max-width: 767px) {
                padding-top: 5px;
        }
}


#news_page .box .news_list ul li .note {
        display: flex;
        align-items: center;

        .category {
                font-weight: 400;
                display: inline-block;
                padding: 2px 6px;
                box-sizing: border-box;
                border-radius: 10px;
                height: 16px;
                line-height: 16px;
                font-size: 10px;
                color: #f5f4f2;
                background-color: #2B2B2B;
                text-align: center;
                letter-spacing: 0;
        }


        .days {
                box-sizing: border-box;
                font-weight: 300;
                color: rgba(255, 255, 255, 1.0);
                font-size: 11px;
                text-align: left;
                padding: 4px 0 0 15px;
                color: #2B2B2B;

                @media screen and (max-width: 679px) {
                        height: 15px;
                        line-height: 15px;
                        font-size: 11px;
                        padding: 2px 0 0 10px;
                }
        }
}

/* buttonMod12 */
.buttonMod12 {
        position: relative;
        display: block;
        box-sizing: border-box;
        padding: 0;
        width: 90%;
        max-width: 300px;
        margin: 30px auto 0;
        height: 60px;
        background: transparent;
        border: solid 1px #222;
        color: #222;
        font-size: 18px;
        font-weight: 300;
        line-height: 60px;
        text-align: center;
        text-indent: 0.08em;
        letter-spacing: 0.08em;
        z-index: 1;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s;
}

.buttonMod12:hover {
        animation: AnimeGrade 10s ease infinite;
        text-decoration: none;
        letter-spacing: 0.18em;
}

.buttonMod12::before {
        content: '';
        position: absolute;
        top: 30px;
        right: 0;
        width: 15px;
        height: 1px;
        background-color: #222;
}

.buttonMod12:hover:before {
        width: 25px;
}

@media screen and (max-width: 767px) {
        .buttonMod12 {
                position: relative;
                display: block;
                margin: 20px auto;
                padding: 0;
                width: 100%;
                height: 40px;
                font-size: 13px;
                line-height: 40px;
                letter-spacing: 0.05em;
        }

        .buttonMod12::before {
                top: 20px;
        }
}


/*****もっと見る*****/
#news_page .box .news_list ul .andmore {
        display: block;
        width: 100%;
}

/* buttonMod13 */
.buttonMod13 {
        position: relative;
        display: block;
        padding: 0;
        width: 90%;
        max-width: 300px;
        margin: 15px auto;
        height: 44px;
        background: #222;
        color: #fff;
        font-size: 18px;
        line-height: 44px;
        text-align: center;
        text-indent: 0.08em;
        letter-spacing: 0.08em;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        border-radius: 22px;
        z-index: 1;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s;
}

.buttonMod13:hover {
        animation: AnimeGrade 10s ease infinite;
        text-decoration: none;
        letter-spacing: 0.18em;
}


@media screen and (max-width: 850px) {
        .buttonMod13 {
                position: relative;
                display: block;
                margin: 20px auto;
                padding: 0;
                width: 70%;
                height: 30px;
                font-size: 15px;
                line-height: 30px;
                border-radius: 15px;
        }

}

/*****サイド側*****/
.side_menu {
        background-color: rgba(0, 0, 0, 0.4);
        width: 22%;
        float: right;

        @media screen and (max-width: 950px) {
                width: 100%;
                display: block;
                float: none;
                margin: 20px auto 0;
                padding: 5px;
        }
}

.side_menu .side_link .text02 {
        display: block;

        font-weight: 700;
        font-size: 14px;
        letter-spacing: 0.07rem;
        color: rgba(130, 130, 130, 0.6);
}

.side_menu .side_link .text03 {
        display: block;
        font-size: 12px;
}


.side_menu .side_category {
        width: 100%;
        display: block;
        margin: 20px auto 10px;
        padding: 0 5px;


        @media screen and (max-width: 950px) {
                width: 48%;
                float: left;
        }
}


.side_menu .side_category .tit,
.side_menu .side_archive .tit {
        width: 100%;
        max-width: 240px;
        margin: 0 auto;
        font-family: "cormorant-garamond", serif;
        font-weight: 500;
        font-size: 14px;
        color: rgba(255, 255, 255, 0.4);
        border-top: 1px solid rgba(255, 255, 255, 0.2);
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        text-align: center;
}

.side_menu .side_category ul,
.side_menu .side_archive ul {
        display: block;
        width: 100%;
        max-width: 180px;
        margin: 10px auto;

        li {
                padding: 10px 0;

                a {
                        display: flex;
                        align-items: center;
                        justify-content: space-between;
                }
        }
}

.side_menu .side_category ul li a span,
.side_menu .side_archive ul li a span {
        background-color: rgba(255, 255, 255, 0.2);
        padding: 5px 4px 3px;
        border-radius: 2px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        color: #fff;
        font-size: 90%;
        box-shadow: -1px -1px 3px #666 inset;
        line-height: 1;
        vertical-align: baseline;
}

.side_menu .side_archive {
        width: 100%;
        display: block;
        margin: 20px auto 10px;
        padding: 0 5px;

        @media screen and (max-width: 950px) {
                width: 48%;
                float: right;
        }
}


/**/
.txt-center {
        text-align: center;
}

.txt-bold {
        width: 100%;
        margin: 15px auto;
        font-weight: 500;
        font-size: 16px;
        line-height: 1.5;

        @media screen and (max-width: 767px) {
                font-size: 16px;
        }
}

.link-btn {
        width: 100%;
        margin: 15px auto 0;
}

a.link {
        position: relative;
        display: block;
        text-align: center;
        width: 100%;
        max-width: 450px;
        margin: 30px auto;
        padding: 20px 0;
        border: solid 1px #222;
        color: #222;
}

a.link::after {
        content: '';
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        right: 0;
        width: 15px;
        height: 1px;
        background-color: #222;

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

.t-box {
        width: 90%;
        margin: 0 auto 10px;
}

.t-left {
        width: 46%;
        float: left;
}

.t-right {
        width: 46%;
        float: right;
}

table.type2 {
        margin: 20px 0 10px;
        border: solid 1px #fff;
        font-size: 110%;
}

.type2 th {
        background: #5269DD;
        color: #fff;
        padding: 10px;
        text-align: center;
        font-weight: bold;
        border-bottom: solid 1px #dcdcdc;
}

.thead th {
        background: #DD52A1;
        color: #fff;
        font-size: 105%;
}

.type2 td {
        background: #E9F6FA;
        padding: 10px 20px;
        text-align: center;
        border-bottom: solid 1px #dcdcdc;
        border-right: solid 1px #dcdcdc;
}

.type2 i,
.col-y {
        color: #FFE300;
}

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

        .link-btn,
        .t-box {
                width: 100%;
        }

        a.link {
                width: 100%;
                max-width: inherit;
        }

        table.type2 {
                width: 100%;
                margin: 15px 0 0;
        }

        .t-left {
                width: 100%;
                float: none;
                margin: 0 auto 20px;
        }

        .t-right {
                width: 100%;
                float: none;
        }
}

/****/
.black_line {
        display: block;
        padding: 12px 10px 10px 16px;
        margin: 10px 0;
        background: #F0F0F0;
        border-left: 6px solid #212121;
        font-size: 105%;
        font-weight: 500;
        font-family: "source-han-sans-japanese", sans-serif;
}