@charset "utf-8";


.main_media_sns {
    padding: var(--main-content-top) 0
}

.main_media_sns .media_sns_wrap {
    display: flex;
    gap: 0 40px
}

.main_media_sns .media_sns_wrap .main_media {
    flex: 1;
    position: relative;
    width: 100%
}

.main_media_sns .media_sns_wrap .main_media .media_list {
    display: grid;
    gap: 45px 10px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media {
    display: block;
    position: relative
}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media::after {
    /*
    display: block;
    content: "";
    position: absolute;
    right: 12px;
    bottom: -2px;
    width: 20px;
    height: 20px;
    background-image: url("");
    background-repeat: no-repeat !important;
    background-position: center center !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    opacity: 0
    */
}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media .img {
    display: block;
    width: 100%;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media .thumbnail {
    display: block;height: 0;padding-top: 55.6%;overflow: hidden;position: relative;
    border: 1px solid #eee;-webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;transition: all .2s ease-in-out}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media .thumbnail .img {
    display: block; max-width: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);
    -webkit-transition: all .3s ease-in-out;transition: all .3s ease-in-out}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media .title {
    display: block;margin-top: 10px;display: -webkit-box; -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;text-overflow: ellipsis;white-space: normal; overflow: hidden}

.main_media_sns .media_sns_wrap .main_media .media_list .btn_media .date {
    display: block;margin-top: 10px;font-size: 14px;color: #999}
@media(min-width: 1024px) {
 .main_media_sns .media_sns_wrap .main_media .media_list .btn_media .title {padding-left:15px;padding-right: 15px}
 .main_media_sns .media_sns_wrap .main_media .media_list .btn_media .date {padding-left: 15px}
 .main_media_sns .media_sns_wrap .main_media .media_list .btn_media:hover::after {opacity: 1;right: 8px;bottom: 2px}
 .main_media_sns .media_sns_wrap .main_media .media_list .btn_media:hover .thumbnail {
    box-shadow: 10px 10px 10px rgba(0,0,0,.3);border-color: #0068ff; top: -10px}
    .main_media_sns .media_sns_wrap .main_media .media_list .btn_media:hover .thumbnail .img {
   transform: translate(-50%, -50%) scale(1.05)}
 .main_media_sns .media_sns_wrap .main_media .media_list .btn_media:hover .title {color: #0068ff;}
}
.main_media_sns .media_sns_wrap .main_sns {flex: 0 0 360px;width: 360px}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap {position: relative;border: 1px solid #ededed;
    background: #f2f7fb;overflow: hidden}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_tab {display: flex;text-align: left !important;
    text-indent: -99999px !important;width: calc(100% + 2px)}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_tab .btn_tab {flex: 1;position: relative;margin-left: -1px;
    height: 48px;border: 1px solid #ededed; border-top: 0;background: #fff}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_tab .btn_tab::before {
    display: block;content: "";position: absolute;left: 0;top: 0;right: 0;bottom: 0; opacity: .3;
    background-size: 20px auto}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_tab .btn_tab.active {border-bottom-color: rgba(0,0,0,0);
    background: rgba(0,0,0,0)}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_tab .btn_tab.active::before {opacity: 1}
.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_content {display: none;padding: 20px;height: 530px;
    overflow: hidden;overflow-y: visible}

.main_media_sns .media_sns_wrap .main_sns .sns_wrap .sns_content.active {display: block}
.main_media_sns .media_sns_wrap .empty_box {padding: 40px 0; width: 100%}
.sns_wrap .sns_list a .sns_text .title, .card_wrap .card_list ul li .card .notice_title, .card_wrap .card_title, .board_view .prevnext_box ul li a p, .board_list table td .notice_title, .newsroom_wrap ul li a .notice_title, .main_news_notice .news_notice_wrap .main_notice .notice_list .notice_box .notice_title, .main_media_sns .media_sns_wrap .main_media .media_list .btn_media .title {
    font-size: 18px;color: #222;font-weight: 700;line-height: 1.3em;letter-spacing: -1.3px;}


@media(max-width:767px) {
    .main_media_sns .media_sns_wrap .main_media .media_list {display: block;}
    .main_media_sns .media_sns_wrap .main_media .media_list .btn_media {margin-bottom: 30px;font-size: 12px;}
}