@charset "utf-8";

#MEDIA-CENTER_PRESS-RELEASE .gu_contents_wrap{ padding-top:112px;}
#MEDIA-CENTER_PRESS-RELEASE .gu_search_box .gu_sort_area .gu_selectbox{width:auto;}

#MEDIA_NEWS {max-width:1118px;margin:0 auto 200px;}

/* news top */
#MEDIA_NEWS .news_top { font-size:0; padding-bottom:70px; margin-bottom:100px;border-bottom:1px solid #e5e5e5;}
#MEDIA_NEWS .news_top>div{ display:inline-block; vertical-align:top;}
#MEDIA_NEWS .news_top>div.img_area{ margin-right:60px;width:624px;}
#MEDIA_NEWS .news_top>div.img_area img {width:100%;}
#MEDIA_NEWS .news_top>div.text_area{width:calc(100% - 684px);}
#MEDIA_NEWS .news_top>div.text_area .type{ font-size:19px;color:var(--link-color);}
#MEDIA_NEWS .news_top>div.text_area .title{ font-size:24px; line-height:36px;margin:20px 0;}
#MEDIA_NEWS .news_top>div.text_area .content{ font-size:19px; line-height:32px;}
#MEDIA_NEWS .news_top>div.text_area .date{ font-size:16px; line-height:32px;color:#666; margin-top:40px;}
#MEDIA_NEWS .news_top>div.text_area .title.ellipsis_line{max-height:144px;-webkit-line-clamp: 4;}
#MEDIA_NEWS .news_top>div.text_area .content.ellipsis_line{ max-height:96px;-webkit-line-clamp: 3;}

/* news list */
#MEDIA_NEWS .news_list .gu_search_box{ margin-bottom:50px;}
#MEDIA_NEWS .news_list ul {font-size: 0;}
#MEDIA_NEWS .news_list ul li {display: inline-block;vertical-align:top;width: calc(50% - 12px);margin-right: 24px;position: relative;margin-bottom: 72px;
    visibility: hidden;opacity: 0;
    -webkit-transform: translateY(200px);
    -moz-transform: translateY(200px);
    -ms-transform: translateY(200px);
    -o-transform: translateY(200px);
    transform: translateY(200px);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;}
#MEDIA_NEWS .news_list ul li:nth-child(2n){margin-right: 0;}
#MEDIA_NEWS .news_list ul li a{display: block}
#MEDIA_NEWS .news_list ul li .img_area{position: relative;overflow: hidden}

#MEDIA_NEWS .news_list ul li .img_area:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 5px;
    padding-left: 24px;
    font-size: 16px;
    color: #fff;
    line-height: 64px;
    z-index: 2;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;}
#MEDIA_NEWS .news_list ul li .img_area:before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.15);visibility: hidden;opacity: 0;z-index: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;}
#MEDIA_NEWS .news_list ul li .img img{width: 100%}
#MEDIA_NEWS .news_list ul li .img{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);;
    -webkit-transition: all 0.6s;
    -moz-transition: all 0.6s;
    -ms-transition: all 0.6s;
    -o-transition: all 0.6s;
    transition: all 0.6s;}
#MEDIA_NEWS .news_list ul li.type_news .img_area:after{background: #00bf8f}
#MEDIA_NEWS .news_list ul li.type_yt .img_area:after{background: var(--link-color)}
#MEDIA_NEWS .news_list ul li a:hover{}
#MEDIA_NEWS .news_list ul li a:hover .img{
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);}

#MEDIA_NEWS .news_list ul li a:hover .img_area:after {
    height: 100%;
}
#MEDIA_NEWS .news_list ul li a:hover .img_area:before{visibility: visible;opacity: 1}

#MEDIA_NEWS .news_list ul li.type_news a .icon_yt {
    display: none
}

#MEDIA_NEWS .news_list ul li.type_news a .icon_more_arrow {
    display: block
}

#MEDIA_NEWS .news_list ul li.type_yt a .icon_yt {
    display: block
}

#MEDIA_NEWS .news_list ul li.type_yt a .icon_more_arrow {
    display: none
}

#MEDIA_NEWS .news_list ul li a .icon_yt {
    position: absolute;
    bottom: 11px;
    left: 16px;
    width: 40px;
    display: inline-block;
    vertical-align: middle;
    z-index: 3
}

#MEDIA_NEWS .news_list ul li a .icon_yt img {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
}

#MEDIA_NEWS .news_list ul li a .icon_more_arrow {
    position: absolute;
    bottom: 20px;
    left: 22px;
    width: 28px;
    display: inline-block;
    vertical-align: middle;
    z-index: 3;
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
}

#MEDIA_NEWS .news_list ul li a .icon_more_arrow img {
    display: inline-block;
    vertical-align: middle;
    width: 28px;
}

#MEDIA_NEWS .news_list ul li.type_news a:hover .img_area:after {
    background: rgba(0, 135, 101, .75)
}

#MEDIA_NEWS .news_list ul li.type_yt a:hover .img_area:after {
    background: rgba(23, 59, 235, .75)
}

#MEDIA_NEWS .news_list ul li.type_news a:hover .icon_more_arrow {
    opacity: 1
}

#MEDIA_NEWS .news_list ul li .copy_box_in{}
#MEDIA_NEWS .news_list ul li .copy_box_in .inner{padding: 30px 0}
#MEDIA_NEWS .news_list ul li .copy_box_in .type{font-size: 18px;color: var(--link-color);margin-bottom: 18px;}
#MEDIA_NEWS .news_list ul li .copy_box_in .title{font-size: 20px;line-height: 32px;max-height:64px;-webkit-line-clamp: 2;margin-bottom: 30px;}
#MEDIA_NEWS .news_list ul li .copy_box_in .date{font-size: 16px;color: #666}


#MEDIA_NEWS .news_list .btn_area {text-align: center;display: none}
#MEDIA_NEWS .news_list .btn_area a {position: relative; padding-right: 20px; font-weight: 600; font-size: 24px;}
#MEDIA_NEWS .news_list .btn_area a img {margin-top: 15px; margin-left: 16px;}

/* set inmotion news */
#MEDIA_NEWS .news_list ul li.on {visibility: visible;opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

#MEDIA_NEWS .news_list ul li.no_data { width:100%; text-align:center; font-size:24px;margin:120px 0 50px; -webkit-transform:none; -moz-transform:none; -ms-transform:none; -o-transform:none; transform:none; -webkit-transition:none; -moz-transition:none; -ms-transition:none; -o-transition:none; transition:none;}
#MEDIA_NEWS .news_list ul li.no_data .count {color:var(--link-color)}

.fclear .gu_sort_area { float: left; }



/* ================================== Laptop css ================================== */
@media all and (max-width: 1280px) {
    #MEDIA-CENTER_PRESS-RELEASE .gu_contents_wrap{ padding-top:104px;}
}

/* ================================== Tablet css ================================== */
@media all and (max-width: 1080px) {
    #MEDIA_NEWS{margin:0 auto 100px;}
    #MEDIA-CENTER_PRESS-RELEASE .gu_contents_wrap{ padding-top:56px;}
    #MEDIA_NEWS .news_top{ margin-bottom:45px; padding-bottom:50px;}
    #MEDIA_NEWS .news_top>div.img_area{ width:326px; margin-right:40px;}
    #MEDIA_NEWS .news_top>div.text_area{ width:calc(100% - 366px);}
    #MEDIA_NEWS .news_top>div.text_area .type{ font-size:16px;}
    #MEDIA_NEWS .news_top>div.text_area .title{ font-size:20px; line-height:28px;margin:15px 0;}
    #MEDIA_NEWS .news_top>div.text_area .title.ellipsis_line{max-height:140px;-webkit-line-clamp: 5;}
    #MEDIA_NEWS .news_top>div.text_area .content.ellipsis_line{ display:none;}
    #MEDIA_NEWS .news_top>div.text_area .date{ font-size:12px; line-height:16px;margin-top:30px;}
    #MEDIA_NEWS .news_list .gu_search_box{ margin-bottom:70px;}
    #MEDIA_NEWS .news_list ul li {margin-bottom: 40px;width: calc(50% - 16px);margin-right: 16px;}
    #MEDIA_NEWS .news_list ul li:nth-child(2n){margin-right: 0;}
    #MEDIA_NEWS .news_list ul li .copy_box_in .inner{padding: 22px 0 0;}
    #MEDIA_NEWS .news_list ul li .copy_box_in .type{font-size: 14px;margin-bottom: 13px;}
    #MEDIA_NEWS .news_list ul li .copy_box_in .title{font-size: 16px;line-height: 26px; max-height: 78px;-webkit-line-clamp: 3;margin-bottom: 24px;}
    #MEDIA_NEWS .news_list ul li .copy_box_in .date{font-size: 12px;}
    #MEDIA_NEWS .news_list ul li a .img_area:before{display: none}
    #MEDIA_NEWS .news_list ul li a:hover .img{
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
    #MEDIA_NEWS .news_list ul li .img_area:after{height: 3px}
    #MEDIA_NEWS .news_list ul li a:hover .img_area:after{height: 3px}
    #MEDIA_NEWS .news_list ul li.type_news a:hover .img_area:after{background: #00bf8f}

    #MEDIA_NEWS .news_list ul li.type_yt a:hover .img_area:after {
        background: var(--link-color)
    }

    #MEDIA_NEWS .news_list ul li a:hover .icon_yt img.off {
        opacity: 1
    }

    #MEDIA_NEWS .news_list ul li.type_news a:hover .icon_more_arrow {
        opacity: 0
    }
}

/* ================================== Mobile css ================================== */
@media all and (max-width: 766px) {

    #MEDIA-CENTER_PRESS-RELEASE .gu_contents_wrap{ padding-top:64px;}
    #MEDIA_NEWS .news_top>div.img_area{width:100%;}
    #MEDIA_NEWS .news_top>div.text_area{ width:100%; margin-top:30px;}
    #MEDIA_NEWS .news_top>div.text_area .title{ margin:10px 0;}
    #MEDIA_NEWS .news_top>div.text_area .date{ margin-top:20px;}
    #MEDIA_NEWS .news_list .gu_search_box{ margin-bottom:35px;}
    #MEDIA_NEWS .news_list ul{margin-bottom: 0}
    #MEDIA_NEWS .news_list ul li{width: 100%;margin-left: 0}
    #MEDIA_NEWS .news_list ul li:nth-child(4n+1){margin-left: 0}
    #MEDIA_NEWS .news_list ul li:nth-child(3n+1){margin-left: 0}
    #MEDIA_NEWS .news_list ul li .copy_box_in .inner{padding:  24px 0 0}
    #MEDIA_NEWS .news_list ul li .copy_box_in .type{font-size: 14px;margin-bottom: 12px;}
    #MEDIA_NEWS .news_list ul li .copy_box_in .title{font-size: 16px;line-height: 26px;margin-bottom: 20px;}
    #MEDIA_NEWS .news_list ul li .copy_box_in .title.ellipsis_line{max-height: 130px;}

    .gu_search_box .gu_sort_area {float: none;}


}
