.header{
    border:solid 5px;
    padding:5px;
    /*background-color:#FF9933;*/
    background: radial-gradient(circle farthest-side, #FFCC99, #FF9966, #FF9900);
}

body {
        background-image:url('/img/home_2.png');
        background-size: cover;
        background-repeat: repeat;
        /*height: 500vh;*/
        width:100vw;
        overflow-x: hidden;
        
    }





.other a{
    text-decoration-line:none; 
    color:white;
}



@media screen and (min-width: 767px) { /*ウィンドウ幅が767px以上の場合に適用（PC版）*/



/*スマホ用とPC用でデザインを変更する必要があります。*/

.subtitle{
    text-align: center;
    color:white;
}


.home_photo{
    width:100vw;
    height:auto;
}

.home_photo img{
    width:100vw;
    height:auto;
}

#artist_photo{
    width:562px;
    height:506px;
    border-radius: 50%;
}
    
.selfproduce{
    width:100vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top:5vw;
    margin-left:5vw;
    overflow:auto;
}

.artist_image{
   width: 40%; 
}

.artist_info{
    width: 55%; 
    color:white;
    line-height: 1.0;
    
 }

 .live_schedule{
    margin-top:5vw;
    width:100vw;
    color:white;
    margin-left:5vw;
 }

 .live_schedule .contents{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
    max-width: 90vw;
 }

 .live_schedule .contents .ivent{
    margin-right:1vw;
    flex: 1 1 auto;
    max-width: 100%;
 }

 .live_schedule img{
    height: 30vh;
    width: auto;
    margin-right:1vw;
    flex: 1 1 auto;
    max-width: 100%;
 }

 .songs{
    margin-top:5vh;
    color:white;
    margin: 0 auto ;
 }

 .songs .contents{
    display: flex;
  justify-content: center;
 }  



 /*
 .youtube{
    position: absolute;
    color:white;
    margin-left:10vw;        
}

.youtube .contents{
    display: flex;
    justify-content: flex-start;

}

.youtube .contents iframe {
    margin-left:5vw;
}
*/

.other_contents{
    margin-top:5vh;
    margin-left:5vw;
    width:100vw;
    color:white;

}

.other_contents .other_group{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    max-width: 90vw;
}
.other_contents .other_group .other{
    height: 30vh;
    width: auto;
    margin-right:1vw;
    flex: 1 1 auto;
    max-width: 100%;

}


.other_contents  .other a img{
    height:30vh;
  
}


/*

.footer{
    background-color: black;
    padding-right:10px;
    height:60px;
    text-align: right;
    padding-top:15px;
    
   
}

.footer a{
    background-color: black;
    padding-right:10px;
    height:60px;
    margin-right:700px;
    padding-top:15px;
    color:white;
    text-decoration-line:none; 
    font-size:30px;
}

.footer #btn{
    height:30px;
    width:150px;
    margin-top:10px;
    background-color:white;
    border-radius: 20px;
}
*/





}

/*レスポンシブデザイン（スマホ対応）は以下に記載します。 */
@media only screen and (max-width : 767px){

    .subtitle{
        color:white;
    }
    


    .home_photo{
        width:90vw;
        height:auto;
    }

    .home_photo img{
        width:90vw;
        height:auto;
    }

    
    #artist_photo{
        display:none;
        width:40vw;
        height:auto;
        border-radius: 50%;
    }
        
    .selfproduce{
        width:80vw;   
        margin-top:5vw;
       
    }
    
    .artist_image{
       display:none;
       width: 50vw; 
    }
    
    .artist_info{
        width: 80vw; 
        color:white;
        line-height: 1.0;
        
     }
    
     .live_schedule{
        margin-top:5vw;
        width:90vw;
        color:white;
        /*margin-left:5vw;*/
     }
    
     .live_schedule .contents{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 90%;
        max-width: 90vw;
     }
    
     .live_schedule .contents .ivent{
        /*margin-right:1vw;*/
        flex: 1 1 auto;
        max-width: 90%;
     }
    
     .live_schedule img{
        height: 30vh;
        width: auto;
       /* margin-right:1vw;*/
        flex: 1 1 auto;
        max-width: 100%;
     }
    
     .songs{
      
        color:white;
        
     }
    
     
    
     /*
     .youtube{
        position: absolute;
        color:white;
        margin-left:10vw;        
    }
    
    .youtube .contents{
        display: flex;
        justify-content: flex-start;
    
    }
    
    .youtube .contents iframe {
        margin-left:5vw;
    }
    */
    /*
    .other_contents{
        margin-top:5vh;
        margin-left:5vw;
        width:100vw;
        color:white;
    
    }*/
    
    .other_contents {
        width: 90%;
        color:white;
        
    }
    .other_contents .other_group .other{
        height: 30vh;
        width: auto;
        max-width: 80%;
    
    }
    
    
    .other_contents  .other a img{
        height:20vh;
      
    }
    
    
    /*
    
    .footer{
        background-color: black;
        padding-right:10px;
        height:60px;
        text-align: right;
        padding-top:15px;
        
       
    }
    
    .footer a{
        background-color: black;
        padding-right:10px;
        height:60px;
        margin-right:700px;
        padding-top:15px;
        color:white;
        text-decoration-line:none; 
        font-size:30px;
    }
    
    .footer #btn{
        height:30px;
        width:150px;
        margin-top:10px;
        background-color:white;
        border-radius: 20px;
    }
    */

}