

/*汎用にするための基*/
@media (min-width:750px){
.top_explain {
  width:750px;
  height:auto;
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_main_bg.jpg") no-repeat scroll top center transparent;
  margin:0 auto;
  box-sizing:border-box;
}
.top_explain_bottom {
  width:750px;
  height:auto;
  margin:0 auto;
}

.top_explain_title {
  width:100%;
  height:auto;
  margin:20px auto;
  box-sizing:border-box;
}
.top_image_box {
  display:flex;
  width:660px;
  height:auto;
  margin:0 auto;
  box-sizing:border-box;
}
.top_image_box #imgbox {
  width:215px;
  height:160px;
  margin:2px;
  float:left;
/*  overflow-x: hidden;scroll;*/
  overflow-y: hidden;
  box-sizing:border-box;
}
.exp_con {
  width:98%;
  height:auto;  
  box-sizing:border-box;
}
.exp_box {
  width:98%;
  height:auto;  
  box-sizing:border-box;
  margin-top:8px;
}
.exp_box #ttls{
  width:96%;
  height:auto;
  margin:0 auto;
  box-sizing:border-box;
}
.exp_box #imgs{
  width:320px;
  height:auto;  
  box-sizing:border-box;
  float:left;
  margin-left:30px;
}
.exp_box #txts{
  width:370px;
  height:auto;
  padding:8px;
  box-sizing:border-box;
  float:left;
}
}

@media (max-width:749px){
.top_explain {
  width:100%;
  height:auto;
  background:#fff;
  border:solid 2px #ccc;
  box-sizing:border-box;
}
.top_explain_title {
  width:96%;
  height:auto;
  margin:20px auto;
}
.top_image_box {
  width:340px;/*98%*/
  height:auto;
  margin:0 auto;
  box-sizing:border-box;
}
.top_image_box #imgbox {
  width:108px;/*215*/
  height:80px;/*160*/
  margin:2px;
  float:left;
  overflow-x: hidden;
  overflow-y: hidden;
  box-sizing:border-box;
}
.exp_con {
  width:98%;
  height:auto;  
  box-sizing:border-box;
}
.exp_box {
  width:98%;
  height:auto;  
  box-sizing:border-box;
  margin-top:8px;
}
.exp_box #ttls{
  width:96%;
  height:auto;
  margin:0 auto;
  box-sizing:border-box;
}
.exp_box #imgs{
  width:50%;
  height:auto;  
  margin:0 auto;
  box-sizing:border-box;
  margin-left:30px;
}
.exp_box #txts{
  width:90%;
  height:auto;
  padding:8px;
  margin:0 auto;
  box-sizing:border-box;
}
.top_explain_bottom {
  display:none;
  /*width:750px;
  height:auto;
  margin:0 auto;*/
}
}

/* shogi_TOP_EXPLAIN                     */

/* 説明部全体 + 330px */
#contents_eacloud_title_shogi {
  /*height: 2750px;*/
  height:auto;
  box-sizing:border-box;  
}

@media (min-width:980px) {
.shogi_top_explain {
  width: 750px;
  height: auto;/*2050*/
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_main_bg.jpg") no-repeat scroll 0 0 transparent;
  margin: 0 auto;
  box-sizing:border-box;  
}
.shogi_top_explain_title {
  position: absolute;
  width:660px;
  height:172px;
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_main.png") no-repeat scroll 0 0 transparent;
  top:40px; left:158px;
  box-sizing:border-box;  
}
.top_images { position: relative; left: 20px; top: 235px; width: 710px; height: 160px; }
}
@media (max-width:979px) {
.shogi_top_explain {
  width: 100%;
  height: auto;/*2050*/
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_main_bg.jpg") no-repeat scroll 0 0 transparent;
  margin: 0 auto;
  background-scale:100%;
  box-sizing:border-box;  
}
.shogi_top_explain_title {
  /*position: absolute;*/
  width:100%;
  height:172px;
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_main.png") no-repeat scroll 0 0 transparent;
  background-scale:100%;
  box-sizing:border-box;  
}
.top_images { 
  position: relative; left: 20px; top: 235px; width: 100%; height: auto; 
  background-scale:100%;
}
}

#top_images_01 {
  position: absolute;
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_top_image_01.jpg") no-repeat scroll transparent;
  left:23px; width:215px; height:160px;
}
#top_images_01:hover {
  background-position: 0px -160px; 
  width:215px;
}
#top_images_01 a {
  display: block;
  height: 160px; width: 215px;
}

#top_images_02 {
  position: absolute;
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_top_image_02.jpg") no-repeat scroll transparent;
  left:248px; width:215px; height: 160px;
}
#top_images_02:hover {
  background-position: 0px -160px; 
  width:215px;
}
#top_images_02 a {
  display: block;
  height: 160px; width: 215px;
}

#top_images_03 {
  position: absolute;
  background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_top_image_03.jpg") no-repeat scroll transparent; 
  left:473px; width:215px; height: 160px;
}
#top_images_03:hover {
  background-position: 0px -160px; 
  width:215px;
}
#top_images_03 a {
  display: block;
  height: 160px; width: 215px;
}

.explain_container { position: relative; left: 20px; top: 255px; width: 710px; height: 1560px; }

.explain_container .box { position: relative;  top:  0px;  left:   20px;  width: 670px;  height: 330px; }
#explain_box_size_1 { height: 260px; }
#explain_box_size_2 { height: 260px; }
#explain_box_size_3 { height: 260px; }
#explain_box_size_4 { height: 260px; }
#explain_box_size_5 { height: 260px; }
#explain_box_size_6 { height: 260px; }

.explain_container .box .header { position: absolute;  top:  0px;  left:   0px;  width: 683px;  height:  77px; }
#title_x {}
#title_1 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_sub_01.png") no-repeat scroll 0 0 transparent; }
#title_2 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_sub_02.png") no-repeat scroll 0 0 transparent; }
#title_3 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_sub_03.png") no-repeat scroll 0 0 transparent; }
#title_4 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_sub_04.png") no-repeat scroll 0 0 transparent; }
#title_5 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_sub_05.png") no-repeat scroll 0 0 transparent; }
#title_6 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_title_sub_06.png") no-repeat scroll 0 0 transparent; }

.explain_container .box .thumb { position: absolute;  top: 85px;  left:   0px;  width: 320px; }
#explain_box_thumb_1 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_image_01.jpg") no-repeat scroll 0 0 transparent;  height: 150px; }
#explain_box_thumb_2 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_image_02.jpg") no-repeat scroll 0 0 transparent;  height: 150px; }
#explain_box_thumb_3 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_image_03.jpg") no-repeat scroll 0 0 transparent;  height: 150px; }
#explain_box_thumb_4 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_image_04.jpg") no-repeat scroll 0 0 transparent;  height: 150px; }
#explain_box_thumb_5 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_image_05.jpg") no-repeat scroll 0 0 transparent;  height: 150px; }
#explain_box_thumb_6 { background: url("https://eacache.s.konaminet.jp/game/shogi/eacloud/p/images/common/game_shogi_image_06.jpg") no-repeat scroll 0 0 transparent;  height: 150px; }

.explain_container .box .help_text { position: absolute;  top: 85px;  left:   330px;  width: 340px;  height: 150px; }
.explain_container .box .help_text p { margin: 0; padding: 0; position: relative; color: #000000; }
.explain_container .box #help_text_1 p { top: 50%; margin-top: -2.5em;}
.explain_container .box #help_text_2 p { top: 50%; margin-top: -1em;}
.explain_container .box #help_text_3 p { top: 50%; margin-top: -1em;}
.explain_container .box #help_text_4 p { top: 50%; margin-top: -2.5em;}
.explain_container .box #help_text_5 p { top: 50%; margin-top: -1em;}
.explain_container .box #help_text_6 p { top: 50%; margin-top: -2em;}

