@font-face {
    font-family: 'Noto Serif CJK JP';
    src: url('../fonts/NotoSerifCJKjp-Medium.otf') format("opentype");
}

body {
    display: block;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    height: 100%;
    font-family: 'Noto Serif CJK JP', serif;
    color: #d7e161;
    background-image: url(../images/background.jpg);
}

a.shop{
    color: #d7e161;
}

div.fixed_wrapper {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    height: 100%;
}

#loader-bg {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: #000;
    z-index: 1;
}

#loader {
    font-family: serif;
    display: none;
    position: fixed;
    top: 50%;
    left: 0%;
    right: 0%;
    text-align: center;
    color: #fff;
    z-index: 2;
}

#wrap {
    position: relative;
    width: 100%;
    height: 600px;
    overflow: hidden;
}

#anim01 {
    height: 20%;
    opacity: 0;
}

#title_box {
    padding-left: 5%;
    padding-top: 2%;
    width: 100%;
}
#title_table{
    height: 120px;
}

#title_img {
    width: 80%;
}

#title_img_mobile {
    display:none;
}

#jacket_box {
    width: 40%;
    height: 1px;
    padding-top: 4%;
    text-align: center;
    float: left;
}

#jacket_img {
    position: relative;
    width: 70%;
    box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.4);
}

#description_box {
    font-size: large;
    float: left;
    position: relative;
    padding: 0px 0px;
    overflow: hidden;
    width: 40%;
    height: 100%;
    opacity: 0;
    padding-top: 5%;
}

#tracklist {
    clear: both;
    width: 100%;
}

#tracklist tr {
    height: auto;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
}

#tracklist tr:hover {
    cursor:pointer;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
    color: #cb1d28;
}

#tracklist td {
    padding: 0;
}

#tracklist .composer {
    text-align: right;
}

#tracklist .twitter_link {
    text-align: right;
}

#play_button {
    width: 40%;
    margin: 5% 30%;
    text-align: center;
    border: 1px solid #d7e161;
    transition: 1s;
}

#play_button:hover {
    cursor:pointer;
    color: #0b0b1c;
    background-color: #d7e161;
    transition: 1s;
}

#copy_box {
    float: left;
    oveflow: hidden;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 50%;
    margin-left: -45px;
    text-align: center;
    width: 90px;
    opacity: 0;
    z-index: 3;
    /* position: relative; */
    /* padding: 0 50px 0 0; */
    /* width: 10%; */
}

#copy_img {
    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.4));
}
#infomation{
    text-align: center;
    height : 1px;
    overflow: hidden;
    display: block;
    /* background-color:#0b0b1c; */
    background-color: transparent;
}

.koumoku {
    width: 100%;
    border-bottom: solid 2px #d7e161
}

.centering_table{
    width: 40%;
    margin-left: 30%;
}

.centering_table tr td{
    width: 50%;
}
#footer {
    background-color:#0b0b1c;
    text-align: center;
}

@media screen and ( max-width:479px ){
    #anim01{
        height:auto;
    }
    
    #title_table{
        height: 60px;
    }

    #jacket_box {
        width:100%;
        float:none;
    }
    #description_box {
        display:block;
        width: 100%;
        margin: 0 0;
        font-size: small;
        text-align: left;
        height:auto;
    }

    #tracklist_box {
        width: 90%;
        margin: 0 0 0 5%;
    }

    #title_img {
        display:none;
    }
    #title_img_mobile {
        display:block;
        width:100%;
        height:1px;
    }
    #wrap {
        overflow: visible;
    }
    #infomation{
        background-color : transparent;
    }
    .centering_table{
        width: 100%;
        margin-left: 0%;
    }
    #play_button {
        width: 40%;
        margin: 5% 0 5% 30%;
    }
    #title_box {
        width: 80%;
    }
}