a:focus,
*:focus {
    outline: none;
}

body {
    margin-top: 50px;
    margin-bottom: 50px;
    background: #000;
    font: 110% 'Lucida Grande',
        'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',
        Meiryo, メイリオ, sans-serif;
    color: #000000;
}

img {
    max-width: 100%;
    height: auto;
}

span {
    font-weight: 700;
}

ul,
ol {
    padding: 10px;
}

.container .row {
    background: rgba(255, 255, 255, 0.9);
    max-width: 100%;
    padding: 0;
    margin: 0 0 100px 0;
    font-size: 1.3em;
}

.col-md-6 {
    width: 100%;
    padding: 20px;
}

.c-text {
    text-align: center;
    padding-bottom: 10px;
}

.col-md-6 ul li {
    list-style-type: none;

}

h1,
h2 {
    margin: .67em 0;
    font-size: 1.2em;
    font-weight: 700;
    text-align: center;
}

.news {
    background: url(../img/news.jpg) #000 no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.live {
    background: url(../img/live.jpg) #000 no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.disco {
    background: url(../img/disco.jpg) #000 no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


@media only screen and (max-width: 768px) {

    .news {
        background: url(../img/news-vertically.jpg) #000 no-repeat center center ;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        display: block;
        height: 100%;
    }

    .live {
        background: url(../img/live-vertically.jpg) #000 no-repeat center center ;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        display: block;
        height: 100vh; /*iPhoneのバグ回避がわからないからスクロールするようになったら100%に変更*/
    }

    .disco {
        background: url(../img/disco-vertically.jpg) #000 no-repeat center center ;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        display: block;
        height: 100%;
    }
}


.navbar {
    background: rgba(0, 0, 0, 0.85);
    border: 0;
    padding: 10px 0;
}

.navbar .navbar-brand {
    color: #fff;

}

.navbar .nav li a {
    text-align: center;
    font-weight: 700;
    color: #fff;
    font-size: 0.9em;
}

.navbar .nav li a:hover {

    font-weight: 700;
    color: #fff;
    text-decoration: underline;
}


.navbar-header .navbar-toggle {
    border-color: #FFF;
    background: rgba(0, 0, 0, 0.30);
}

.navbar-header .navbar-toggle:hover {
    background: rgba(0, 0, 0, 0.30);
}

.navbar-header .navbar-toggle:focus {
    background: rgba(0, 0, 0, 0.30);
}


.navbar-collapse {

    border-top: 0px solid transparent;
    box-shadow: inset 0 0px 0 rgba(255, 255, 255, 1);
}

.logo {
    margin-left: 10px;
    margin-top: 0;
}

.line {
    width: 80%;
}

textarea {
    width: 100%;
    resize: none;
}

input.button {

    padding: 5px;
    background-color: #000;
    color: #fff;
    border-style: none;
}

input.button:hover {

    background-color: #666;
    color: #fff;
}

@media(min-width:768px) {
    .navbar .nav {
        float: right;
        border: 0;
    }

    .logo {
        margin-left: 10px;
        margin-top: 10px;
    }
}

@media(min-width:1024px) {
    .container .row {
        background: rgba(255, 255, 255, 0.9);
        max-width: 40%
    }
}