@charset 'utf-8';
.cf:before,
.cf:after {
    display: table;
    content: '';
}

.cf:after {
    clear: both;
}

/* For IE 6/7 (trigger hasLayout) */

.cf {
    zoom: 1;
}



.text-block {
    display: block;
    margin:0 auto;
    width: 100%;
}

.top-title-container{
    position: relative;
    width: 100%;
    height: 100%;
}
.movie-area {
    position: fixed;
    z-index: 0;
    top: -40px;
    width: 100%;
    height: calc(100% + 80px);/* hide youtube */
    box-sizing: border-box;
    padding-left: 258px;
    left: 0;
}

.m-contents_inner {
    position: relative;
    z-index: 0;
    margin-bottom: 0;
}

.top-contents {
    position: relative;
}

.movie-area img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.toptitle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
}

/*--newsの微調整-*/
.m-list_news{
    margin-top: -80px;
}
.m-list_news .tag {
    width: 72px;
    margin-right: 5px;

}

.top_btn {
    font-size: 1.4rem;
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 230px;
    margin: 27px auto;
    padding: 13px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background-color: #4489d0;
}
.top_btn:hover{
    background-color: #5da1e7;
}

.top-list_box {
    display: block;
    padding: 0 0 40px 0;
}


.top-pickupContainer {
    margin: 0 auto;
    padding: 116px 15px 73px;
}

.top-block {
    padding: 73px 15px 73px;
}

.top-panel_inner {
    background-color: #fff;
}

.top-panel_txt {
    font-weight: 500;
    line-height: 1.6;
    overflow: hidden;
}

.top-panel {
    position: relative;

    text-decoration: none;
}

.top-panel p{
    margin: 0px 5px !important;
}

.top-panel .tag{
    margin: 0px 5px 4px 5px !important;
}

.tab-container {
    font-size: .9rem;
}

.top-pickupContainer {
    background-color: #f5f5f5;
}

.top-pickup_title {
    font-weight: bold;
    position: relative;
}

.top-pickup {
    background-color: #fff;
    transition : 0.1s linear;
}
.top-pickup:hover {
    background-color: #d6e7f0;
}
.top-pickup_link {
    font-weight: 500;
    color: #4489d0;
}

.top-pickup_link:after {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-top: -2px;
    margin-left: 3px;
    content: '';
    vertical-align: middle;
    text-decoration: none;
    background: url(../img/icon-link.png);
    background-size: contain;
}



.top-pickupBlock {
    max-width: 1024px;
    margin-right: auto;
    margin-left: auto;
}


.top-block {
    background-color: #fff;
}

.top-block-title {
    font-size: 3.0rem;
    position: relative;
    padding-bottom: 13px;
    text-align: center;
}

.title-rect:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    display: block;
    width: 22px;
    height: 6px;
    margin-left: -11px;
    content: '';
    background: linear-gradient(to right, #4489d0 32%, #16496a 32%);
}

.top-block-title-en {
    margin-top: 14px;
    margin-bottom: 40px;
    text-align: center;
}

.top-block-title-en img {
    width: 89px;
}

.top-businessPanelList {
    max-width: 940px;
    /* margin-top: 40px; */
    margin-right: auto;
    margin-left: auto;
}


.top-bnrList_item img{
    transition : 0.1s linear;
}
.top-bnrList_item img:hover{
    opacity: 0.7;
}
.jackarea-contents{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
#top{
    position: relative;
}
@media screen and (min-width: 1120px) {
    .top-pickup-about {
        float: left;
    }
    .top-pickup-1min {
        float: left;
    }
    .top-pickup-business {
        float: left;
    }
}

@media screen and (min-width: 768px) {

    .top-block .m-panelList .m-panel {
        width: 25%;
        padding: 0 5px 10px;
        transition:0.1s linear;
    }
    .top-block .top-recommendPanelList .m-panel {
        width: 33.33%;
    }
    p.m-panel_ttl {
        font-size: 14px;
    }

    .top-panelList {
        overflow: hidden;
        max-width: 859px;
        margin: 0 auto;
    }
    .top-panelList .top-panelList_item {
        float: left;
        box-sizing: border-box;
        width: 33.333%;
        padding: 15px;
      }
      /*--画像拡大--*/
      .top-panelList_item .top-panel_inner {
        overflow: hidden;
        width: 100%;
        display: block;
      }
      .top-panelList_item .top-panel_inner .top-panel_thumb{
        overflow: hidden;
        height: 171px;
      }
      .top-panelList_item .top-panel_inner .top-panel_thumb img {
        transition: 0.5s;
        text-align: center;
      }

     .top-panelList_item .top-panel_inner .top-panel_thumb img:hover {
        -moz-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        -o-transform: scale(1.1,1.1);
        -ms-transform: scale(1.1,1.1);
      }
      /*--*/
    .top-front {
        position: relative;
    }

    .top-panel {
        padding-bottom: 10px;
    }
    /*-news影響回避-*/
    .top-panelList .top-panel{
        padding-bottom:0px;
    }
    .top-panel_txt {
        font-size: 1.4rem;
        position: relative;
        padding: 14px 15px 40px 15px;
    }
    .tab-container {
        position: absolute;
        bottom: 10px;
        width: auto;
    }
    .text-block {
    letter-spacing: 3px;
    }
    .top-block-recommend {
        padding-top: 0;
    }


}

@media screen and (min-width: 1124px) {
    .top-pickupContainer {
        /* width: 800px; */
        padding: 80px 10px;
    }
    .top-block .m-panelList .m-panel {
        width: 25%;
    }


    .top-pickup_thumb{
        width:33%;
        margin:10px auto 20px;
    }
    .top-bnr {
        padding-right: 15px;
        /* padding-bottom: 80px; */
        padding-left: 15px;
    }
    .top-pickup {
        width: 280px;
        padding: 20px
    }
    .top-pickup h4{
        padding: 20px 0;
        font-size: 1.8rem;
    }
    .top-pickup-about {
        float: left;
        margin-right: 30px;
    }
    .top-pickup-1min {
        float: left;
        margin-right: 30px;
    }
    .top-pickup-business {
        float: left;
    }
    .top-pickupBlock {
        max-width: 1024px;
        margin-right: auto;
        margin-left: auto;
    }
    .top-pickupContainer {
        padding: 40px 15px 40px;
    }
    .top-pickup .title-rect:after{
        position: absolute;
        bottom: 14%;
        left: 4%;
    }
}



@media screen and (min-width: 1700px) {
    .top-panelList {
        max-width: 1146px;
    }
    .top-panelList .top-panelList_item {
        width: 25%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(5),
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }

}

@media screen and (min-width: 1800px) {
    .top-panelList {
        max-width: 1433px;
    }
    .top-panelList .top-panelList_item {
        width: 20%;
    }
    .top-panelList .top-panelList_item:nth-child(5){
        display: block;
    }
}

.top-bnr {
    background-color: #f5f5f5;
}

.top-bnrList {
    overflow: hidden;
}

.top-bnrList_item {
    float: left;
    box-sizing: border-box;
    width: 25%;
    padding: 0 5px;
}

.top-bnrList {
    margin-right: -5px;
    margin-left: -5px;
}

.top-bnr_inner {
    max-width: 500px;
    margin: 0 auto;
}

.top-bnr {
    padding: 20px 0;
}

.link-panel:hover .top-pickup_link{
    text-decoration: underline !important;
}


@media screen and (max-width: 1123px) and (min-width: 768px) {
    .top-block .m-panelList .m-panel {
        width: 33.33%;
    }
    .top-businessPanelList {
        max-width: 700px;
    }

    .top-pickup_thumb{
        width:40%;
        margin:10px auto;
    }
    .top-bnr {
        padding-right: 15px;
        /* padding-bottom: 80px; */
        padding-left: 15px;
    }
    .top-pickup {
        width: 186px;
        padding: 20px
    }
    .top-pickup h4{
        padding: 20px 0;
        font-size: 1.8rem;
    }
    .top-pickup-about {
        float: left;
        margin-right: 10px;
    }
    .top-pickup-1min {
        float: left;
        margin-right: 10px;
    }
    .top-pickup-business {
        float: left;
    }
    .top-pickupBlock {
        max-width: 700px;
    }
    .top-pickupContainer {
        padding: 40px 15px 40px;
    }
    .top-pickup .title-rect:after{
        position: absolute;
        bottom: 14%;
        left: 4%;
    }
}

@media screen and (max-width: 1365px) {
    .movie-area{
        padding-left: 0;
        top: 20px;
    }

}
@media screen and (max-width: 1023px) {
    .movie-area{
        top: -26px;
    }
    .ua-ie .is-globalNavOpen .movie-area{
        left: -270px;
    }

    .ua-ie .is-globalNavOpenComplete .m-slideNav{
      z-index: 20;
    }
}
@media screen and (max-width: 767px) {


    .top-pickup {
        position: relative;

        padding-top: 66px;
        padding-right: 20px;
        padding-bottom: 20px;
        padding-left: 20px;
    }
    .top-pickup-about, .top-pickup-1min {
        margin-bottom: 100px;
    }
    .top-pickup_title {
        font-size: 2.0rem;
        margin-bottom: 15px;
        padding-bottom: 16px;
        text-align: center;
    }
    .top-pickup_description {
        font-size: 1.3rem;
        margin-bottom: 10px;
    }
    .top-pickup_thumb {
        position: absolute;
        top: -55px;
        left: 50%;

        -webkit-transform: translate(-50%, 0);
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
    }

    .top-pickup_thumb img {
        width: 112px;
        height: auto;
    }

    .top-pickup_title:before {
        left: 50%;
        margin-left: -8px;
    }
    .top-pickup_title:after {
        left: 50%;

        margin-right: -14px;
    }
     .movie-area{
        height: 302px;
        top: 30px;

    }

    .top-overlay:after {
        height: 390px;

    }
    .top-overlay:before {
        display: none;
    }


    .movie-area{
        height: 282px;
    }
    .movie-area img {
        height: 400px;
    }

    .top-block .m-panelList .m-panel {
        width: 100%;
    }
    .m-contents_inner {
        padding: 0;
    }
    .top-list_box {
        /* padding: 120px 15px 10px 15px; */
        margin: 0;
    }
    .top_btn {
        margin-top: 40px;
        margin-bottom: 0;
    }
    .m-list_news {
        position: relative;
        background-color: #fff;
    }
    .top-panel_inner {
        position: relative;
        overflow: hidden;
        padding: 15px 15px;
        border-bottom: 1px solid #e3e3e3;
    }
    .top-panel_thumb {
        float: right;
        width: 80px;
        height: 80px;
    }
    .top-panel_thumb img {
        font-family: 'object-fit: cover;';
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .top-panel_txt {
        font-size: 1.3rem;
        line-height: 1.46;
        padding-right: 10px;
    }

    .top-block {
        padding: 51px 15px 73px;
    }
    .tab-container {
        position: absolute;
        bottom: 15px;
        width: auto;
    }

    .top-block-title {
        font-size: 2.6rem;
    }

    .top-block-recommend {
        padding-top: 0;
    }
    .top-bnrList_item {
        width: 50%;
        margin-top: 10px;
    }
    .top-bnr {
        padding-right: 15px;
        padding-bottom: 50px;
        padding-left: 15px;
    }
    .top-bnr_inner {
        width: 232px;
    }


    .link-panel{
        text-decoration: none;
    }


    div.m-panel_txt {
        padding-left: 15px;
    }

}

/*--トップのタイトル文章画像の設定--*/
    .toptitle_inner {
        width: 100%;
        display: block;
        margin: 0 auto;
    }
    .toptitle_inner .pcimg{
        display: inline-block;
    }
    .toptitle_inner .spimg{
        display: none;
    }

    @media (min-width: 0px) and (max-width: 1023px) {

        .toptitle_inner {
            width: 100%;

        }
        .toptitle_inner .pcimg{
            display: none;
        }
        .toptitle_inner .spimg{
            display: inline-block;
        }
    }
    @media screen and (max-width: 767px) {

        .toptitle_inner {
            display: block;
            height: 100%;
        }

    }
    @media (min-width: 768px) and (max-width: 1023px) {
        .text-block{
            width: 317px;
        }
    }
    @media (min-width: 375px) and (max-width: 767px) {
        .toptitle_inner .spimg{
            width:260px;
            margin: 0 auto;
        }
    }
    @media (min-width: 0px) and (max-width: 375px) {
        .toptitle_inner .spimg{
            width:240px;
            margin: 0 auto;
        }
    }



    .toptitle_inner{
        position: relative;
    }
    .text-block{
        position: absolute;
        top: 50%;
        left: 50%;
        opacity:0;
        transform: translate(-50%,-50%);
        transition: 1.0s opacity linear;
    }
    .toptitle_inner .pcimg{
        max-width: none;
    }
     .is-show{
        opacity:1;
     }

     @media screen and (min-width: 768px) {
        .text-block{
            top: calc(50% - 40px);
        }
    }

     @media screen and (min-width:1366px){
        #size-detect{
            font-family: "large"
        }
     }
     @media screen and (min-width:1024px) and (max-width:1365px){
        #size-detect{
            font-family: "normal"
        }
     }

     @media screen and (max-width:1023px){
        #size-detect{
            font-family: "small"
        }
        .m-contents{
            padding-top: 0;
        }
    }

    @media screen and (max-width:767px){
        .m-contents{
            padding-top: 54px;
        }
    }


/* panel出しわけ */
@media screen and (min-width: 1898px) {
    .top-panelList{
        max-width: 1415px;
    }
    .top-panelList .top-panelList_item {
        width: 20%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }
}
@media screen and (min-width: 1610px) and (max-width: 1897px) {
    .top-panelList{
        max-width: 1132px;
    }
    .top-panelList .top-panelList_item {
        width: 25%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(5),
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }
}
@media screen and (min-width: 1366px) and (max-width: 1609px) {
    .top-panelList{
        max-width: 848px;
    }
    .top-panelList .top-panelList_item {
        width: 33.33%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(4),
    .top-panelList .top-panelList_item:nth-child(5),
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }
}
@media screen and (min-width: 1280px) and (max-width: 1365px) {
    .top-panelList{
        max-width: 1132px;
    }
    .top-panelList .top-panelList_item {
        width: 25%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(5),
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
    .top-panelList{
        max-width: 848px;
    }
    .top-panelList .top-panelList_item {
        width: 33.33%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(4),
    .top-panelList .top-panelList_item:nth-child(5),
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }
}

.text-block-1 .pcimg{
    width: 369px;
}
.text-block-1 .spimg{
    width: 206px;
}
.text-block-2 .pcimg{
    width: 705px;
}
.text-block-2 .spimg{
    width: 274px;
}
.text-block-3 .pcimg{
    width: 756px;
}
.text-block-3 .spimg{
    width: 256px;
}
.text-block-4 .pcimg{
    width: 609px;
}
.text-block-4 .spimg{
    width: 223px;
}
.text-block-5 .pcimg{
    width: 705px;
}
.text-block-5 .spimg{
    width: 250px;
}
.text-block-6 .pcimg{
    width: 637px;
}
.text-block-6 .spimg{
    width: 192px;
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .top-panelList{
        max-width: 566px;
    }
    .top-panelList .top-panelList_item {
        width: 50%;
        padding: 15px;
    }
    .top-panelList .top-panelList_item:nth-child(3),
    .top-panelList .top-panelList_item:nth-child(4),
    .top-panelList .top-panelList_item:nth-child(5),
    .top-panelList .top-panelList_item:nth-child(6){
        display: none;
    }

    .text-block-1 .spimg{
        width: 392px;
    }

    .text-block-2 .spimg{
        width: 515px;
    }

    .text-block-3 .spimg{
        width: 480px;
    }

    .text-block-4 .spimg{
        width: 414px;
    }

    .text-block-5 .spimg{
        width: 470px;
    }

    .text-block-6 .spimg{
        width: 367px;
    }
}



.text-block{
    text-align: center;
    width: 100%;
}