@charset "UTF-8";

@media print, screen and (min-width: 641px){
    
/* cssここから */

/************************************************************
*
*　title : TVアニメ「白猫プロジェクト ZERO CHRONICLE（ゼロ・クロニクル）」公式サイト
*　date : 2020.01
*　version : 2.0
*
************************************************************/

/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　CONCEPT ART
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.sec_art_v2 {
    overflow: hidden;
    /*background-color: #eeeeee;*/
}

.sec_art_v2 .inner {
    width: 90%;
    min-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    margin-bottom: 100px;
}

.sec_art_v2 h3 {
    text-align: center;
    color: #000000;
    font-size: 30px;
    font-family: 'Spectral', serif;
    margin-bottom: 50px;
    margin-top: 100px;
}

.sec_art_v2 h3 hr {
    width: 80px;
    margin: 0 auto;
    margin-top: 20px;
    padding: 0;
    line-height: 0px;
    height: 5px;
    background-color: #000000;
    border: none;
    color: #000000;
}

.sec_art_v2 .big_left {
    overflow: hidden;
    background-color: #fff;
}

.sec_art_v2 .big_right {
    overflow: hidden;
    background-color: #fff;
}

.sec_art_v2 .big_right .big {
    float: right;
}

.sec_art_v2 .big {
    width: 50%;
    float: left;
    overflow: hidden;
}

.sec_art_v2 .big img {
    width: 100%;
}

.sec_art_v2 ul.list {
    width: 50%;
    float: left;
}

.sec_art_v2 ul.list li {
    width: 50%;
    float: left;
    text-align: center;
    overflow: hidden;
}

.sec_art_v2 ul li a img {
    width: 100%;
    height: auto;
    line-height: 0px;
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.sec_art_v2 ul li a img:hover {
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.sec_art_v2 ul li {
    position: relative;
}

.sec_art_v2 ul li .new {
    position: absolute;
    display: block;
    right: 0px;
    top: 0px;
    width: 50px;
    z-index: 5;
}

.sec_art_v2 ul li .new img {
    width: 100%;
    height: auto;
}

.sec_art_v2 ul.big li .new {
    width: 80px !important;
}

/* 点滅 */
.blinking{
    -webkit-animation:blink 1.0s ease-in-out infinite alternate;
    -moz-animation:blink 1.0s ease-in-out infinite alternate;
    animation:blink 1.0s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}


/**/

.hover {
    width: 100%;
    height: auto;
    overflow: hidden;
    position: relative;
}
.hover .caption {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    top: 50%;
    color: #fff;
    position: relative;
}
.hover .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    background-color: rgba(141,47,47,0.8);
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.hover:hover .mask {
    opacity: 1;
}





/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　POSTER
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.sec_poster {
    overflow: hidden;
    background-color: #fff;
}

.sec_poster .inner {
    width: 90%;
    min-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    margin-bottom: 100px;
}

.sec_poster h3 {
    text-align: center;
    color: #000000;
    font-size: 30px;
    font-family: 'Spectral', serif;
    margin-bottom: 50px;
    margin-top: 100px;
}

.sec_poster h3 hr {
    width: 80px;
    margin: 0 auto;
    margin-top: 20px;
    padding: 0;
    line-height: 0px;
    height: 5px;
    background-color: #000000;
    border: none;
    color: #000000;
}

.sec_poster ul {
    width: 100%;
    margin: 0 auto;
    margin-left: -20px;
}

.sec_poster ul li {
    float: left;
    width: calc(33.33% - 20px);
    margin-left: 20px;
    margin-bottom: 20px;
}

.sec_poster ul li img {
    width: 100%;
    height: auto;
}





/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　2020.06
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

section.bg_color:nth-child(odd) {
    background-color: #eeeeee;
}


/* list_full */

.sec_art_v2 ul.list_full {
    width: 100%;
    float: left;
}

.sec_art_v2 ul.list_full li {
    width: 25%;
    float: left;
    text-align: center;
    overflow: hidden;
}


/* list_logo */

.sec_art_v2 ul.list_logo {
    width: 100%;
    float: left;
    margin-left: -20px;
}

.sec_art_v2 ul.list_logo li {
    width: calc(25% - 20px);
    float: left;
    text-align: center;
    overflow: hidden;
    margin-left: 20px;
}









/* cssここまで */   
    
}