#box{width:980px; height:100%; float:left;}

#box1{width:980px; height:280px; float:left;}
.box1_main{width:590px; height:260px; background-color:blue; float:left;}
.box1_mainpic{display:block; width:590px; height:260px; float:left;}
.box1_mainpic img{width:590px; height:260px;}

.box1_main2{display:none;}

/*スライダー*/
.slider{width:590px; height:260px; overflow:hidden; position:relative;}
.slider::before,
.slider::after{content:""; position:absolute; top:50%; left:50%; display:block; width:6px; height:30px; background:#fff; z-index: 1; -webkit-transform: rotate(-1deg) scale(0);}
.slider::before{margin:-15px 0 0 -15px;}
.slider::after{margin:-15px 0 0 0px;}
.slider:hover::before,
.slider:hover::after{-webkit-transform: rotate(-1deg) scale(1);}
.slider:hover .slideli,
.slider:hover .progress,
.slider:hover .slide_mark li:nth-child(1),
.slider:hover .slide_mark li:nth-child(2),
.slider:hover .slide_mark li:nth-child(3),
.slider:hover .slide_mark li:nth-child(4)
{-moz-animation-play-state:paused;
-webkit-animation-play-state:paused;}
.slider:hover{-webkit-transform: rotate(1deg) scale(1.05); -webkit-transition: all 0.4s ease-in-out;}
.slider .slideli{position:absolute; top:0; left:0; width:2360px; height:260px; -webkit-animation:slide 35s infinite;}
.slider .slideli li{display:block; width:590px; height:260px; position:relative; float: left;}
@-webkit-keyframes slide{
0% {opacity:0;}
2% {opacity:1;}
20% {left:0px; opacity:1;}
22.5% {opacity:0.3;}
25% {left:-590px; opacity:1;}
45% {left:-590px; opacity:1;}
47.5% {opacity:0.3;}
50% {left:-1180px; opacity:1;}
70% {left:-1180px; opacity:1;}
72.5% {opacity:0.3;}
75% {left:-1770px; opacity:1;}
95% {opacity:1;}
98% {left:-1770px; opacity:0;}
100% {left:0px; opacity:0;}
}
.progress{width:590px; height:4px; background:#f98131; -webkit-animation:progress 35s infinite; position:absolute; bottom:0px; left:0;}
@-webkit-keyframes progress{
0% {width:0px; opacity:0;}
2% {width:0px; opacity:1;}
88% {width:590px; opacity:1;}
92% {width:590px; opacity:0;}
100% {width:0px; opacity:0;}
}
.slide_mark{margin:5px 15px 0 0; position:absolute; top:3px; right:0px;}
.slide_mark li{display:block; width:6px; height:6px; -webkit-border-radius:6px; margin-left:5px; background:#ccc; border:#fff 1px solid; float:left;}
.slide_mark li:nth-child(1){-webkit-animation:mark1 35s infinite;}
.slide_mark li:nth-child(2){-webkit-animation:mark2 35s infinite;}
.slide_mark li:nth-child(3){-webkit-animation:mark3 35s infinite;}
.slide_mark li:nth-child(4){-webkit-animation:mark4 35s infinite;}
@-webkit-keyframes mark1{0% {background:#f98131;}24%{background:#f98131;}25%{background:#ccc;}100% {background:#ccc;}}
@-webkit-keyframes mark2{0% {background:#ccc;}24%{background:#ccc;}25%{background:#f98131;}49%{background:#f98131;}50% {background:#ccc;}100% {background:#ccc;}}
@-webkit-keyframes mark3{0% {background:#ccc;}49%{background:#ccc;}50%{background:#f98131;}74%{background:#f98131;}75% {background:#ccc;}100% {background:#ccc;}}
@-webkit-keyframes mark4{0% {background:#ccc;}74%{background:#ccc;}75%{background:#f98131;}98%{background:#f98131;}99% {background:#ccc;}100% {background:#ccc;}}
/*ここまで　スライダー*/


.box1_side{width:390px; height:260px; background-color:#d5eaff; float:left;}
.box1_side img:hover{opacity:0.5; filter:alpha(opacity=50); /*Ie用*/ -webkit-transition: 0.6s; transition: 0.6s;}
.box1_kao{width:130px; height:130px; float:left;} 
.box1_kao2{display:none;} 


#box2{width:980px; height:285px; float:left;}
.box2_left{width:200px; height:246px; float:left;}
.box2_left_title{width:200px; height:20px;}
.box2_left_twbox{width:196px; height:220px; margin-top:3px; border:solid 2px #cccccc; float:left;}
.box2_left_tw{width:186px; height:207px; margin:5px;}

.box2_main{width:580px; height:250px; margin:0px; float:left;}
.box2_main_score{width:570px; height:175px; margin:0px 5px; background-image:url(../img/scoreboard.png); float:left;}
.box2_scoretitle{width:420px; height:20px; margin:2px 0px; overflow:hidden;}
.box2_scorewrapper{width:530px; height:81px; margin:34px 0px 0px 21px; float:left;}
.box2_score{width:530px; height:30px; margin-top:10px; float:left;}
.box2_score2{width:530px; height:30px; margin-top:10px; float:left;}
.box2_scoreteam{width:115px; height:30px; text-align:center; color:white; font-size:10px; overflow:hidden; float:left;}
.box2_scoreteam img{width:90px; height:20px;}
.box2_scorepoint{width:36px; height:30px; margin-left:3px; text-align:center; font-size:18px; color:white; float:left;}
.box2_scoretotalpoint{width:56px; height:30px; margin-left:3px; text-align:center; font-size:20px; color:white; float:left;}
.box2_pitcher{width:250px; margin-top:-25px; margin-left:110px; color:white; float:left;}
.box2_main_sky{width:160px; height:70px; margin:5px 15px 0px 20px; float:left;}
.box2_main_sky :hover{position:relative; top:1px; left:1px;}
.box2_main_text{width:308px; height:65px; margin-top:5px; margin-right:5px; float:left;}
.box2_main_4reispo{width:60px; height:70px; margin-top:5px; float:left;}
.box2_main_4reispo :hover{position:relative; top:1px; left:1px;}
.box2_main_4reispo2{display:none;}
.box2_right{width:200px; height:250px; float:left;}
.box2_right_team0{width:200px; height:60px;}
.box2_right_team0 :hover{position:relative; top:1px; left:1px;}
.box2_right_team0 img{width:200px; height:60px;}
.box2_right_team02{display:none;}
.box2_main_sky2{display:none;}
.box2_right_youtube{width:196px; height:183px; margin:3px 0px 0px 0px; border:solid 2px #cccccc;}

#box3{width:980px; height:565px; float:left;}
.box3_left{width:260px; height:550px; float:left;}
.box3_left li{width:260px; height:60px; margin-bottom:10px;}
.box3_left li:hover {opacity:0.5; filter:alpha(opacity=50); /*Ie用*/}
.box3_left img{width:260px; height:60px; float:left;}
.box3_main{width:420px; height:550px; margin:0px 20px; float:left;}
.box3_nextbox{width:420px; height:auto; float:left;}
.box3_nextgame_title{width:420px; height:auto; text-align:center; font-size:14px; color:white; border-top:solid 3px navy; background-color:#5f5f5f; float:left;}
.box3_taisenbox{width:420px; height:100px; margin-top:10px; float:left;}
.box3_reibox{width:100px; height:100px; float:left;}
.box3_vsbox{width:220px; height:100px; float:left;}
.box3_vs{width:80px; height:35px; margin:5px auto;}
.box3_yokokup_box{width:200px; height:55px; margin:0px auto;}
.box3_yokokupic{width:38px; height:53px; margin-left:5px; border:solid 1px navy; float:left;}
.box3_yokokupic img{width:38px; height:53px;}
.box3_yokoku_p{width:135px; height:45px; margin:10px 0px 0px 10px; float:left;}
.box3_banbox{width:100px; height:100px; float:left;}
.box3_banbox img{width:100px; height:100px;}
.box3_banbox :hover{position:relative; top:1px; left:1px;}
.box3_infobox_title{width:420px; height:20px; margin-top:20px; float:left;}
.box3_infobox{width:418px; height:345px; margin-top:5px; border-left:solid 1px #cccccc; border-right:solid 1px #cccccc; overflow:scroll; float:left;}
.box3_info{width:408px; margin:0px 10px 10px 0px;} 
.box3_infomark{width:50px; margin-left:7px; float:left;}
.box3_infomark img{width:40px; height:30px;}
.box3_article{width:338px; float:left;}
.box3_right{width:260px; height:550px; float:left;}






/* ウィンドウ幅が0～479pxの場合に適用するCSS */
@media screen and ( max-width:479px )
{

#box{width:100%; height:auto;}

#box1{max-width:100%; height:auto;}

.box1_main{display:none;}

.box1_main2{display:block; width:100%; height:auto; float:left;}
.box1_mainpic2{width:100%; height:auto;}
.box1_mainpic2 img{width:100%; height:auto;}

.box1_side{width:100%; height:auto; background-color:none;}
.box1_side img:hover{opacity:1; filter:alpha(opacity=100); /*Ie用*/}
.box1_kao{display:none;}
.box1_kao2{display:block; width:16.66%; height:auto; float:left;}
.box1_kao2 img{width:100%; height:auto;}

#box2{max-width:100%; height:auto;}
.box2_left{display:none;}

.box2_main{width:100%; height:auto; margin-top:10px;}
.box2_main_score{width:100%; height:auto; margin:0px; background-image:none; background-color:#80bfff;}
.box2_scoretitle{width:95%; height:auto; margin-left:2%; float:left;}
.box2_scorewrapper{width:94%; height:auto; margin-top:0%; margin-left:2%; margin-bottom:5%; background-color:#e9e9e9;}
.box2_score{width:99%; height:auto; margin-top:1%; padding:2px; border-bottom:solid 1px #80bfff;}
.box2_score2{width:99%; height:auto; margin-top:2%; padding:2px;}
.box2_scoreteam{width:22%; height:auto; color:#236ab1; font-size:70%;}
.box2_scoreteam img{max-width:90%; height:auto;}
.box2_scorepoint{width:7.4%; height:auto; margin-left:0%; color:#696969; }
.box2_scoretotalpoint{width:10%; height:auto; margin-left:0.5%; color:#0055aa; font-size:18px;}
.box2_pitcher{width:70%; height:auto; margin-top:2%; margin-left:2%; margin-bottom:2%; color:#696969;}

.box2_main_sky{display:none;}
.box2_main_text{width:92%; height:auto; margin-top:5px; padding:1%; margin-left:3%; border:solid 1px #dcdcdc;}
.box2_main_4reispo{display:none;}
.box2_main_4reispo2{display:block; width:90%; height:auto; margin-top:10px; margin-left:3%; padding:2%; font-size:1.5em; font-weight:bold; text-decoration:none; text-align:center; text-shadow:1px 1px 2px #002b55; border:solid 1px #004080; border-radius:7px; float:left;
background-image: 
 -webkit-gradient(linear, 0% 0%, 0% 100%, from(#006ad5), to(#eaf4ff));
 background: linear-gradient(#006ad5, #eaf4ff);}
.box2_main_4reispo2 a{text-decoration:none; color:#f4faff;}
.box2_main_4reispo2 a:link,.box1_indrank a:active,.box1_indrank a:visited{color:#f4faff;}
.box2_main_4reispo2 a:hover{color:#f4faff;}
.box2_right{width:100%; height:auto; margin-top:5px;}
.box2_main_sky2{display:block; width:90%; height:auto; margin-top:5px; margin-left:3%; padding:2%; font-size:1.5em; font-weight:bold; text-decoration:none; text-align:center; text-shadow:1px 1px 2px #002b55; border:solid 1px #004080; border-radius:7px; float:left; background-color:#eaf4ff;}
.box2_main_sky2 a{text-decoration:none; color:#f4faff;}
.box2_main_sky2 a:link,.box1_indrank a:active,.box1_indrank a:visited{color:#f4faff;}
.box2_main_sky2 a:hover{color:#f4faff;}
.box2_main_sky2 img{width:80%; height:auto;}
.box2_right_team0{display:none;}
.box2_right_team0 :hover{position:static;}
.box2_right_team0 img{width:85%; height:auto;}
.box2_right_team02{display:block; width:90%; height:auto; margin-top:5px; margin-left:3%; padding:2%; font-size:1.5em; font-weight:bold; text-decoration:none; text-align:center; text-shadow:1px 1px 2px #002b55; border:solid 1px #004080; border-radius:7px; background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#eaf4ff), to(#006ad5)); background: linear-gradient(#eaf4ff, #006ad5); float:left;}
.box2_right_team02 a{text-decoration:none; color:#f4faff;}
.box2_right_team02 a:link,.box1_indrank a:active,.box1_indrank a:visited{color:#f4faff;}
.box2_right_team02 a:hover{color:#f4faff;}
.box2_right_youtube{display:none;}

#box3{max-width:100%; height:auto; margin-top:10px; display:flex; flex-direction:column;}
.box3_main{width:100%; height:auto; margin:10px 0px 0px; order:1;}
.box3_nextbox{width:100%; height:auto;}
.box3_nextgame_title{width:100%; height:auto; margin:0px auto;}
.box3_taisenbox{width:auto; height:auto; margin-left:5%;}
.box3_reibox{width:25%; height:auto;}
.box3_reibox img{width:100%; height:auto;}
.box3_vsbox{width:50%; height:auto; margin:0px;}
.box3_vs{width:50%; height:auto; margin:0% auto;}
.box3_yokokup_box{width:100%; height:auto;}
.box3_yokokupic{width:auto; height:auto; margin-left:2%; border:none;}
.box3_yokoku_p{width:auto; height:auto; margin:3%;}
.box3_banbox{width:25%; height:auto;}
.box3_banbox :hover{position:static;}
.box3_banbox img{width:100%; height:auto;}
.box3_infobox{width:100%; height:auto; border:0px; overflow:visible;}
.box3_infobox_title{width:100%; height:auto;}
.box3_infobox_title img{width:100%; height:auto;}
.box3_info{width:98%; height:auto;}
.box3_infomark{display:none;}
.box3_article{width:95%; height:auto; margin-left:2%; padding:1%; margin-bottom:2%; border:solid 1px #dcdcdc;}
.box3_left{width:100%; height:auto; margin-top:10px; order:2;}
.box3_left li:hover {opacity:1; filter:alpha(opacity=100); /*Ie用*/}

.box3_left li{width:50%; height:auto;float:left;}
.box3_left img{width:100%; height:auto;}
.box3_right{display:none;}

}