*{
    margin: 0;
    padding: 0;
}

a{
    text-decoration: none;
    color: #FFF;
}

body{
    text-align: center;
    color: #FFF;
    font-size: 24px;
    font-family: serif;
    -webkit-text-size-adjust: 100%;
}

#entrance:before{
    content: "";
    display: block;
    position: fixed;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: url(../image/back/entrancekb.jpg) top no-repeat;
    background-size: cover;
}

#header{
    width: 100%;
    height: 50px;
    margin: 0 auto;
    background: rgba(0,0,0,0.5);
    float: none;
    font-size: 24px;
    display: flex;
    justify-content: center;
    position: fixed;
    z-index: calc(infinity);
}

.menu a{
    display: block;
    margin: 0;
    padding: 0;
    height: 50px;
    width: 250px;
    line-height: 50px;
    text-decoration: none;
    color: #FFF;
    transition: 1s;
}

.menu a:hover{
    background: rgba(255,255,255,0.5);
    transition: 0.5s;
	cursor: pointer;
}

h1{
    font-size: 34px;
    line-height: 70px;
}

#ingli{
    font-size: 20px;
}

#foot{
    width: 100%;
    padding: 24px 0 12px 0;
    font-size: 20px;
    background: rgba(0,0,0,0.5);
}

#cont{
    width: 1000px;
    margin: 0 auto;
    line-height: 110%;
    padding: 60px 0;
}

#title{
    position: relative;
    width: 1000px;
    height: 130px;
    margin: 10px 0 40px;
}

.sub1{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}

.sub2{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
    transition: 1s;
}

.sub2:hover{
    opacity: 1;
    transition: 0.5s;
}

.accord{
    width: 1000px;
    text-align: left;
    margin: 0 auto 60px;
}

.accord label{
    display: block;
    width: 930px;
    height: 44px;
    margin: 5px 10px;
    padding: 5px 25px;
    line-height: 44px;
    background: rgba(0,0,0,0.5);
    cursor: pointer;
}

.accord input{ display: none; }

.accord li{
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.accord ul{
    margin: 5px 10px;
    list-style: none;
}

.article{
    width: 920px;
    margin: 0;
    padding: 30px 30px 40px;
    font-size: 28px;
    line-height: 160%;
    color: #FFF;
    background: rgba(0,0,0,0.5);
}

.Ltitle{
    width: 808px;
    float: left;
}

.more{
    width: 120px;
    float: left;
    font-size: 20px;
    text-align: right;
    position: relative;
    top: 6px;
    animation: blink 2s ease-in-out infinite alternate;
}

@keyframes blink {
    0% {opacity: 0.5;}
    50% {opacity: 1;}
    100% {opacity: 1;}
}

.artlink{
    margin: 0 0.5em;
    animation: blink 2s ease-in-out infinite alternate;
    transition: 0.5s;
}

.artlink:hover{
    text-shadow: 5px 5px 10px rgba(255,255,255,0.5), -5px 5px 10px rgba(255,255,255,0.5), -5px -5px 10px rgba(255,255,255,0.5), 5px -5px 10px rgba(255,255,255,0.5);
    transition: 0.5s;
}

#merit1:checked ~ #Mlinks01 li{
    height: 740px;
    margin-top: 15px;
    opacity: 1;
}

#merit2:checked ~ #Mlinks02 li{
    height: 1320px;
    margin-top: 15px;
    opacity: 1;
}

#merit3:checked ~ #Mlinks03 li{
    height: 1150px;
    margin-top: 15px;
    opacity: 1;
}

#merit4:checked ~ #Mlinks04 li{
    height: 620px;
    margin-top: 15px;
    opacity: 1;
}

#merit5:checked ~ #Mlinks05 li{
    height: 1200px;
    margin-top: 15px;
    opacity: 1;
}

#merit6:checked ~ #Mlinks06 li{
    height: 720px;
    margin-top: 15px;
    opacity: 1;
}

#merit7:checked ~ #Mlinks07 li{
    height: 880px;
    margin-top: 15px;
    opacity: 1;
}

#merit8:checked ~ #Mlinks08 li{
    height: 1280px;
    margin-top: 15px;
    opacity: 1;
}

#demerit1:checked ~ #Dlinks01 li{
    height: 1280px;
    margin-top: 15px;
    opacity: 1;
}

#demerit2:checked ~ #Dlinks02 li{
    height: 540px;
    margin-top: 15px;
    opacity: 1;
}

#demerit3:checked ~ #Dlinks03 li{
    height: 480px;
    margin-top: 15px;
    opacity: 1;
}

#choice1:checked ~ #choose01 li{
    height: 1840px;
    margin-top: 15px;
    opacity: 1;
}

#choice2:checked ~ #choose02 li{
    height: 1660px;
    margin-top: 15px;
    opacity: 1;
}

#choice3:checked ~ #choose03 li{
    height: 1620px;
    margin-top: 15px;
    opacity: 1;
}

#choice4:checked ~ #choose04 li{
    height: 2040px;
    margin-top: 15px;
    opacity: 1;
}

#choice5:checked ~ #choose05 li{
    height: 1560px;
    margin-top: 15px;
    opacity: 1;
}

#choice6:checked ~ #choose06 li{
    height: 2420px;
    margin-top: 15px;
    opacity: 1;
}

#choice7:checked ~ #choose07 li{
    height: 1300px;
    margin-top: 15px;
    opacity: 1;
}

#buy1:checked ~ #Blinks01 li{
    height: 2240px;
    margin-top: 15px;
    opacity: 1;
}

#buy2:checked ~ #Blinks02 li{
    height: 1440px;
    margin-top: 15px;
    opacity: 1;
}

#buy3:checked ~ #Blinks03 li{
    height: 1080px;
    margin-top: 15px;
    opacity: 1;
}

#buy4:checked ~ #Blinks04 li{
    height: 2780px;
    margin-top: 15px;
    opacity: 1;
}

#buy5:checked ~ #Blinks05 li{
    height: 1260px;
    margin-top: 15px;
    opacity: 1;
}

#buy6:checked ~ #Blinks06 li{
    height: 1200px;
    margin-top: 15px;
    opacity: 1;
}

#buy7:checked ~ #Blinks07 li{
    height: 1380px;
    margin-top: 15px;
    opacity: 1;
}

#buy8:checked ~ #Blinks08 li{
    height: 1180px;
    margin-top: 15px;
    opacity: 1;
}

#buy9:checked ~ #Blinks09 li{
    height: 2000px;
    margin-top: 15px;
    opacity: 1;
}

#sell1:checked ~ #Slinks01 li{
    height: 3180px;
    margin-top: 15px;
    opacity: 1;
}

#sell2:checked ~ #Slinks02 li{
    height: 3500px;
    margin-top: 15px;
    opacity: 1;
}

#sell3:checked ~ #Slinks03 li{
    height: 2960px;
    margin-top: 15px;
    opacity: 1;
}

#summary1:checked ~ #sumalinks01 li{
    height: 640px;
    margin-top: 15px;
    opacity: 1;
}

#self1:checked ~ #intro01 li{
    height: 2300px;
    margin-top: 15px;
    opacity: 1;
}

#self2:checked ~ #intro02 li{
    height: 1720px;
    margin-top: 15px;
    opacity: 1;
}

#self3:checked ~ #intro03 li{
    height: 2400px;
    margin-top: 15px;
    opacity: 1;
}

.painter{ margin-left: 30px; }

.painter th{
    font-weight: normal;
    text-align: left;
}

.painter td{ text-align: right; }

.frame450{
    width: 450px;
    height: 80px;
    line-height: 80px;
    margin: 40px auto;
    font-size: 30px;
    text-align: center;
    background: url(../image/icon/frame450.png) center no-repeat;
    transition: 0.5s;
}

.frame450:hover{
    background: url(../image/icon/frame450s.png) center no-repeat;
    transition: 0.5s;
}

.fframe{ background: rgba(0,0,0,0.5); }

.inprod{
    width: 920px;
    height: 360px;
    Line-height: 360px;
    margin: 0 10px;
    padding: 20px 30px;
    background: rgba(0,0,0,0.5);
}

#outer{
    width: 980px;
    margin: 10px;
    padding: 30px 0 50px 0;
    background: rgba(0,0,0,0.5);
}

.mattar{
    width: 900px;
    margin: 0 10px;
    padding: 0 30px;
    font-size: 26px;
    text-align: left;
}

.sageru{ margin-left: 30px; }

.subtitle{ margin: 40px 0 20px 0; }

.sukima{ margin-top: 20px; }

.para{ font-size: 22px; }

h2{
    font-size: 36px;
    text-align: left;
    background: rgba(0,0,0,0.5);
    margin-bottom: 10px;
    padding: 15px 20px;
    line-height: 36px;
}

h3{
    font-size: 32px;
    font-weight: normal;
    transition: 0.5s;
}

h3:hover,.accord > label:has(:checked) > h3{
    text-shadow: 5px 5px 10px rgba(255,255,255,0.5), -5px 5px 10px rgba(255,255,255,0.5), -5px -5px 10px rgba(255,255,255,0.5), 5px -5px 10px rgba(255,255,255,0.5);
    transition: 0.5s;
}

.red{ color: red; }

.yellow{ color: yellow; }

.blue{ color: blue; }


@media screen and ( max-width: 767px )
{
    body{
        width: 1000px;
    }

    #foot{
        width: 928px;
        padding: 24px 36px 12px 36px;
        margin: 0 auto;
    }

    body:before{
        background-position: center;
    }
}