@charset "UTF-8";

/*画像切り替え*/
#slideshow {
         /*position: relative;*/
         /*width:  700px; /* 画像の横幅に合わせて記述 */
         /*height: 400px; /* 画像の高さに合わせて記述 */
        }
#slideshow img {
         position: absolute;
         top: 20px;
         left: 100px;
         width: 700px; /* 画像の横幅に合わせて記述 */
         height: 465px; /* 画像の高さに合わせて記述 */
         z-index: 8;
         opacity: 0.0;
        }
#slideshow img.active {
         z-index: 10;
         opacity: 1.0;
        }
#slideshow img.last-active {
         z-index: 9;
        }

.main .title
        {
         position: absolute;  /* 親ボックスを基準 */
         top: 485px;
         left: 100px;
         width: 700px;
         background-color: rgba(0,0,0,0.3);
         box-sizing: border-box;
         color: #ffffff;
         font-size: 20px;
         font-weight: bold;
         padding: 0.5em 1em;
         margin: 0;
         /*height: 100px;*/
         text-align: center;
         text-shadow: 2px 2px 4px rgba(0,0,0,0.7);
         z-index: 11;    /* 表示の優先順位 */
        }

.blink {
        -webkit-animation: blink 1s ease infinite;
        animation: blink 1s ease infinite;
}
@-webkit-keyframes blink {
        0% {opacity: 0;}
        100% {opacity: 1;}
}
@keyframes blink {
        0% {opacity: 0;}
        100% {opacity: 1;}
}