
/* common */
#c1_wrap { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; padding-top: 90px; }
#c1_wrap .c_inner { width:100%; max-width: 1580px; margin: 0 auto; }


/* c1 */
#c1_wrap .c_inner { display: flex; }

.c1_list { font-size: 0; line-height: 1; }

.c1_list.li1 { width:1054px; display: flex; flex-wrap: wrap; }
.c1_list.li1 li { width:50%; }
.c1_list.li1 a { display: block; width:100%; }

.c1_list.li2 { width:526px; }
.c1_list.li2 li { width:100%; height: 100%; }
.c1_list.li2 a { display: block; }

.c1_list a { position:relative; }
.c1_list a .img { position:relative; }
.c1_list a .img::after { content:""; position:absolute; left:0; width:100%; top:0; height: 100%; background:no-repeat center / contain; opacity: 0; transition: all .3s; }
.c1_list a .txt { position:absolute; left:0; width:100%; padding:0 60px; bottom:55px; }
.c1_list a .txt b { font-size: 25px; color: #fff; font-weight: 300; }
.c1_list a .txt h2 { font-size: 36px; color: #fff; font-weight: bold; margin:12px 0 0; }

.c1_list.li1 li:nth-child(1) .img::after { background-image: url('../img/c1_bg1_ov.jpg'); }
.c1_list.li2 li:nth-child(1) .img::after { background-image: url('../img/c1_bg5_ov.jpg?v=221125'); }
.c1_list li:nth-child(2) .img::after { background-image: url('../img/c1_bg2_ov.jpg'); }
.c1_list li:nth-child(3) .img::after { background-image: url('../img/c1_bg3_ov.jpg'); }
.c1_list li:nth-child(4) .img::after { background-image: url('../img/c1_bg4_ov.jpg'); }






/* hover animation */
@media screen and (min-width:1024px) {
    .c1_list a:hover .img::after { opacity: 1; }
}


/* media query */
@media screen and (max-width: 1700px) {

    /* common */
    #c1_wrap .c_inner { max-width: 100%; padding:0 60px; }

    /* c1 */


}
@media screen and (max-width: 1420px) {

    /* common */
    #c1_wrap { padding-top: 80px; }

    /* c1 */
    .c1_list a .txt { padding: 0 40px; bottom: 35px; }
    .c1_list a .txt b { font-size: 20px; line-height: 1.3; }
    .c1_list a .txt h2 { font-size: 30px; margin: 10px 0 0; }


}
@media screen and (max-width: 1023px) {

    /* common */
    #c1_wrap { height: auto; padding: 80px 0; }
    #c1_wrap .c_inner { padding: 0 40px; }

    /* c1 */
    #c1_wrap .c_inner { flex-wrap: wrap; }

    .c1_list.li1 { width: 100%; }

    .c1_list.li2 { width: 100%; }
    .c1_list.li2 li { width: 100%;  }
    .c1_list.li2 li .img img { max-height: 300px; width: 100%; object-fit: cover; }



}
@media screen and (max-width: 767px) {

    /* common */
    #c1_wrap { padding: 60px 0; }
    #c1_wrap .c_inner { padding: 0 15px; }

    /* c1 */
    .c1_list.li1 li { width: 100%; border-bottom: 1px solid #ddd; }
    .c1_list.li1 li img { max-height: 250px; width: 100%; object-fit: cover; }

    .c1_list a .txt { padding: 0 30px; }
    .c1_list a .txt b { font-size: 18px; }
    .c1_list a .txt h2 { font-size: 24px; }

    .c1_list.li2 li .img img { max-height: 250px; }

}
@media screen and (max-width: 425px) {

    .c1_list.li2 li .img img { max-height: 220px; }

}
