body{margin-left: auto;
margin-right: auto;
width: 100%;}

img{border: none;webkit-backface-visibility: hidden;}

.erase2{display:none;}

#menu{width: 100%;}

.readmore{
    position: relative;
    box-sizing: border-box;}

.readmore-content{
    position: relative;
    overflow: hidden;
    /*以下お好み*/
    /*高さの初期値*/
    height: 200px;
}
.readmore-content::before {
    display: block;
    position: absolute;
    bottom: 0;
    left: 15%;
    width: 70%;
    content: "";
    /*以下お好み グラデーションの色と高さ 高さはreadmoreのheight以下にすること*/
    height: 50px;
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0.8) 50%, #fff 100%);
    background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0.8) 50%, #fff 100%);}

/* 続きを読むボタン */
.readmore-label{
    display: table;
    bottom: 5px;
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    margin: 0 auto;
    z-index: 2;
    padding: 0 10px;
    background-color: #00cc00;
    border-radius: 10px;
    color: #FFF;}

.readmore-check{
    display: none;
}
/*チェック時にボタンを非表示*/
.readmore-check:checked ~ .readmore-label{
    position: static;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    /* 「続きを読む」を押した後、元に戻す必要がない場合は、上のオプションを消してこの1行だけにする */
    /* display: none; */
}

/*チェック時に高さを自動に戻す*/
.readmore-check:checked ~ .readmore-content{
    height: auto;
}
/*チェック時グラデーション等を削除*/
.readmore-check:checked ~ .readmore-content::before {
    display: none;}

h1{color: white;font-size: 25px;}
h2{color: yellow;font-size: 17px;margin-top: 0px;}

#main{background-color: #004080;
padding: 5px 0px 5px 0px;width: 100%;}

#time_publish, #time_modify{font-size: 10px;text-align: right;width: 96%;}
#time_publish2{background-color: black; color: white;font-weight: bold;padding: 1px 5px 1px 5px;}
#time_modify{text-align: right;}

#box{width: 100%;
padding: 20px 0px 20px 0px;}

#box2, #box3{width: 98%;}

.title{font-size: 17px;
font-weight: bold;
margin-bottom: 1.0em;
margin-left: 10px;
text-align: left;}

#beginning{margin: 5% 0px 5% 0px; width: 98%;}

#beginning, .explain, .left_box44, .right_box44{font-size: 15px;line-height: 2.0em; text-align: left;}
.explain{margin-bottom: 25px;}

.left_box44{text-align: left;}
.right_box44, .right_box44b{margin-left: 0px;width: 100%;}
.right_box44b{font-size: 15px; font-weight: bold;line-height: 1.5em;margin-top: 10%;padding-bottom: 5%;text-align: center;}

#left_box-jersey, #right_box-jersey{margin-top: 10%;width: 100%;}

.jersey{float: left;font-size: 12px;line-height: 1.5em;margin-left: 0px;text-align: center;width: 25%;}

#jersey1, #jersey2, #jersey3{border: solid 1px black;}
#jersey1{width: 29.4%;height: auto;}
#jersey2{width: 28%;height: auto;}
#jersey3{width: 26.8%;height: auto;}

#jersey4, #jersey5{width: 76%;height: auto;}
#jersey6{width: 67.8%;height: auto;}
#jersey7{width: 65%;height: auto;}

#jersey8{width: 79%;height: auto;}
#jersey9{width: 77%;height: auto;}
#jersey10{width: 58.4%;height: auto;}
#jersey11{width: 68.4%;height: auto;}

#jersey12{width: 94%;height: auto;}

#jersey13{width: 47.4%;height: auto;}
#jersey14{width: 52%;height: auto;}
#jersey15, #jersey16, #jersey17, #jersey18, #jersey19, #jersey20, #jersey21, #jersey22, #jersey23, #jersey24, #jersey25, #jersey26, #jersey27, #jersey28, .jersey29, .jersey31, #jersey32a, #jersey32b, #jersey32c{width: 100%;height: auto;}

#jersey30{width: 70%;height: auto;}

#jersey33a{width: 80%;height: auto;}
#jersey33b{width: 55.5%;height: auto;}
#jersey33c{width: 61.6%;height: auto;}

#jersey34a{width: 49.8%;height: auto;}
#jersey34b{width: 62%;height: auto;}
#jersey34c{width: 22.6%;height: auto;}

#jersey35a{width: 48%;height: auto;}
#jersey35b{width: 47%;height: auto;}
#jersey35c{width: 61%;height: auto;}
#jersey35d{width: 52%;height: auto;}
#jersey35e{width: 96%;height: auto;}

.hem, .neck, .tag, .collar, .sideline, .cloth, .other, #other1, #other2, #other3, .size{
font-weight: bold;
margin-left: 0px;
margin-top: 5%;
text-align: center;
width: 94%;}

.neck{border: 3px solid #00ffff;}
.tag{border: 3px solid #ff0000;}
.collar{border: 3px solid #ffd200;}
.sideline{border: 3px solid #0000ff;}
.cloth{border: 3px solid #ff8000;}
{margin-left: 9%;width: 21.1%;}
#other1, #other2, #other3{border: 3px solid #00ff00;}
.size{border: 3px solid #0080c0;}
.hem{border: 3px solid #ff00ff;}

.hem, .size{
font-size: 15px;
font-weight: bold;
margin-bottom: 20px;
float: right;}

.horizon, #horizon{margin: 8% 0px 8% 0px;}
#horizon{width: 88%;}

#logo2{margin-right: 1%;height: auto;width: 8%;vertical-align: middle;}

.back_blue{background-color: #00ffff;}
.back_yellow{background-color: #ffff00;}
.back_blue, .back_yellow{font-weight: bold;padding: 2px 20px 2px 20px;}

.brown{color: #cc0000;
font-weight: bold;}

.center{font-size: 15px;margin-left: 0px;text-align: center;}
.right{text-align: right;}
.left{text-align: left;}

.space0{clear: both;}
.space{height: 30px;}
.space2, .space2b50{clear: both;}
.space2b50{margin-left: 0px;height: 70px;}
.space3{clear: both;
font-size: 15px;
height: 70px;text-align: left;}

#tag{background-color: #ff0000;}
#collar{background-color: #ffd200;}
#sideline{background-color: #0000ff;}
#cloth{background-color: #ff8000;}
#size{background-color: #0080c0;}
#hem{background-color: #ff00ff;}
#other{background-color: #00ff00;}

#tag, #collar, #sideline, #cloth, #size, #hem, #other{
font-size: 17px;
font-weight: bold;
padding: 2px 20px 2px 20px;}

#tag, #sideline, #cloth, #size, #hem{color: white;}


.figure{
border: 2px solid #000000;
line-height: 1.7em;
margin-bottom: 40px;
padding: 0px 0px 5px 0px;
font-size: 15px;
width: 90%;}

.figure2{background-color: black;
color: white;
font-size: 17px;
font-style: italic;
font-weight: bold;
padding: 2px 15px 2px 15px;
text-align: left;}

.figure3, .figure4a, .figure4c, .figure3b, .figure3b2{
margin-left: 0px;
text-align: center;}

.figure3, .figure4a{width: 96%;}

.figure3{padding-top: 50px;}

.figure3a{text-align: center;
font-size: 30px;
font-weight: bold;
margin-left: 0px;
padding-bottom: 40px;
padding-top: 40px;}

.figure4{text-align: center;
padding-top: 30px;}

.figure4a, .figure4c{font-size: 25px;font-weight: bold;width: 100%;}
.figure4b{padding-top: 20px;}

.figure4b, .figure4b2{
margin-left: 0px;
width: 100%;}

.note{color: #0000ff;
font-size: 12px;
font-weight: bold;
vertical-align: super;}

#top{
background: rgba(204,204,204,0.5);
border: 1px solid #999999;
font-weight: bold;
padding: 5px;
display: block;
height: auto;
position: fixed;
padding: 3px;
bottom: 2%;
right: 1%;
text-align: center;
width: 40%;}

#top A:link {color:#000000 ; text-decoration:none;}
#top A:visited {color:#000000 ;  text-decoration:under-line;}
#top A:active {color:#ff0000 ;  text-decoration:under-line;}
#top A:hover {color:#00ffff ;  text-decoration:under-line;}

#close{
font-size: 20px;
font-weight: bold;
margin-bottom: 5%;
margin-left: 0px;
margin-top: 10%;
text-align: center;}

#close A:link {color:#000000 ;  text-decoration:underline ;display: block;width: 100%;}
#close A:visited {color:#800000 ;  text-decoration:underline ;}
#close A:active {color:#ff0000 ;  text-decoration:none ;}
#close A:hover {color:#00ffff ;  text-decoration:none ;}


#add{border: 1px solid #999999;font-size: 15px;text-align: left;margin-bottom: 50px;margin-top: 50px;padding: 5px;}
#addition{background-color: black;color: white;font-weight: bold;padding: 3px 5px 3px 5px;}

#add2 A:link {color:#000000 ; text-decoration:under-line;}
#add2 A:visited {color:#000000 ;  text-decoration:under-line;}
#add2 A:active {color:#ff0000 ;  text-decoration:under-line;}
#add2 A:hover {color:#00ffff ;  text-decoration:under-line;}

.correct{color: #ff0000;
font-size: 14px;
font-weight: bold;
vertical-align: super;}

.correct A:link {color:#ff0000 ; text-decoration:none ;}
.correct A:visited {color: #ff0000 ; text-decoration:none ;}
.correct A:active {color:#ff0000 ; text-decoration:none ;}
.correct A:hover {color:#00ffff ; text-decoration:none ;}

A:link {color:#000000 ; text-decoration:underline ;}
A:visited {color:#000000 ; text-decoration:underline ;}
A:active {color:#ff0000 ; text-decoration:none ;}
A:hover {color:#00ffff ; text-decoration:none ;}