/* --------------------------------------*/
/* TOP                                   */
/* --------------------------------------*/

a {text-decoration:none;}

/* --------------------------------------*/
/* CONTENTS_TOP_PAGE                     */
/* --------------------------------------*/
#top_boxPick{
  position: relative;
  height:auto;
  width:100%;
  margin:0 auto;
}
@media(min-width:501px){
#top {
  background:#fff6;
}
.gameboxPick {
  display: flex;
  align-content: stretch;
  justify-content: space-around;
  flex-wrap: wrap;
  background:#fe02;
  text-shadow:0px 0px 1px #000;
  position: relative;
  padding:0px 16px 1px 16px;
  border:dotted 1px #ddd;
  box-sizing:border-box;
  height: auto;
  width: 100%;
  border-radius: 0px 0px 10px 10px ;
}
.pickBox {
  display: flex;
    align-content: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    flex-direction: column;
    align-items:center;
  width:auto;
  height: auto;
  margin:10px auto;
  text-align:center;
}
}
@media(max-width:500px){
#top {
  background:#fff6;
}
.gameboxPick {
  display: flex;
  align-content: stretch;
  justify-content: space-around;
  flex-wrap: wrap;
  background:#ff02;
  text-shadow:0px 0px 1px #000;
  position: relative;
  padding:0px;
  border:dotted 1px #ddd;
  box-sizing:border-box;
  height: auto;
  width: 100%;
  border-radius: 0px 0px 10px 10px ;
}
.pickBox {
  display: flex;
    align-content: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    flex-direction: column;
    align-items:center;
  width:auto;
  height: auto;
  margin:0px auto;
  text-align:center;
}
}
.box_ttl_sky {
  width:100%;
  height:auto;
  padding:4px 10px;
    background:#f80;
  background:linear-gradient(to right, #fff0, #8cf, #fff0);
  box-sizing:border-box;
  border-radius:10px 10px 0px 0px;
  margin-top:6px;
}
.box_ttl_red {
  width:100%;
  height:auto;
  padding:4px 10px;
    background:#f00;
  background:linear-gradient(to right, #fff0, #f00, #fff0);
  box-sizing:border-box;
  border-radius:10px 10px 0px 0px;
  margin-top:6px;
}
.box_ttl_orange {
  width:100%;
  height:auto;
  padding:4px 10px;
    background:#f80;
  background:linear-gradient(to right, #fff0, #f80, #fff0);
  box-sizing:border-box;
  border-radius:10px 10px 0px 0px;
  margin-top:6px;
}
.box_ttl_lime {
  width:100%;
  height:auto;
  padding:4px 10px;
    background:#6f8;
  background:linear-gradient(to right, #fff0, #6f8, #fff0);
  box-sizing:border-box;
  border-radius:10px 10px 0px 0px;
  margin-top:6px;
}
.box_gamettl_black {
  width:100%;
  height:auto;
  padding:10px;
  background:black;
  margin:0;
  box-sizing:border-box;
  border-left:dotted 1px #ddd;
  border-right:dotted 1px #ddd;
}
.text_top {
  text-shadow:#000 2px 2px 2px;
  font-size:14pt;
  color:#fff;
  text-align:center;
}
.text_tip {
  text-shadow:#000 2px 2px 2px;
  font-size:10pt;
  color:#fff;
}
.text_men {
  float:left;
  font-size:10pt;
  color:#fff;
  padding-right:6px;
}

@media (min-width:840px){
#top_page {
  position: relative;
  width:100%;
  height:auto;
}
#top_page #main {
  position: relative;
  width: 100%;
  height:auto;
}
#main .inner {
  position: relative;
  width: 100%;
  height: auto;
}
#main #eacloud {
}
#main #mfc {
}
#container2_mfc {
}}

@media (max-width:839px){
#top_page {
  position: relative;
  width:100%;
  height:auto;
}
#top_page #main {
  position: relative;
  width: 100%;
  height:auto;
}
#main .inner {
  position: relative;
  width:100%;
  height: auto;
}
#main #eacloud {
}
#main #mfc {
}
#container2_mfc {
}}




@media (min-width:740px){
#play_bg {
  position: relative;
  width:735px;
  height: 335px;
  display:block;
  float:left;
  margin:0 auto 40px;
  box-sizing:border-box;
}
#play {
  position: relative;
  top:5px;
  left:5px;
  width:725px;
}

.top_slider_common {
  width:725px;
  height: 325px;
  margin:0;
  box-sizing:border-box;
}
.top_slider_common a {
  display: block;
  height: 325px;
  width: auto;
}
.top_slider_common:hover {
  width:725px;
}
}

@media (max-width:739px) and (min-width:300px){
#play_bg {
  position: relative;
  display: block;
  width:100%;  
  height:auto;
  margin:0 auto 20px;
}
#play {
  display: block;
  position: relative;
  top:3px;
  width:100;
  height:auto;
  margin:10px auto 50px;
}

.top_slider_common {
  display: block;
  width: 100%;
  height:calc(100vw * 0.448);
  background-size: cover;

}
.top_slider_common a {
  display: block;
  width: 100%;
}
}

@media (max-width:299px){
#play {
  display: none;
}}






/*
@media (min-width:620px){
#play_bg {
  position: relative;
  background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/common/top_main_banner_bg.png") no-repeat scroll transparent; 
  width:735px;
  height: 335px;
  float:left;
  display:block;
  margin:10px 0 30px;
  box-sizing:border-box;
}
#play {
  position: relative;
  top:5px;
  left:5px;
  width:725px;
}

.top_slider_common {
  width:725px;
  height: 325px;
  margin:0;
  box-sizing:border-box;
}
.top_slider_common a {
  display: block;
  height: 325px;
  width: auto;
}
.top_slider_common:hover {
  width:725px;
}}

@media (max-width:619px) and (min-width:400px){
#play {
  display: block;
  position: relative;
  top:3px;
  width:90%;
  height:auto;
  min-height:200px;
  margin:0 auto 30px;
}

.top_slider_common {
  display: block;
  width: 100%;
  height:auto;
}
.top_slider_common a {
  display: block;
  width: 100%;
}
#play_bg {
  position: relative;
  display: block;
  width:100%;  
  height:auto;
  margin:0 auto 20px;
}
#top_slider_02 { background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/game/top_main_banner_mfc.png") no-repeat scroll transparent; 
  width:100%; height:266px;
  background-size:100%;
}
#top_slider_03 { background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/game/top_main_banner_shogi.png") no-repeat scroll transparent; 
  width:100%; height:266px;
  background-size:100%;
}
#top_slider_iidx { background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/game/top_main_banner_iidx.png") no-repeat scroll transparent; 
  width:100%; height:266px;
  background-size:100%;
}
#top_slider_sdvx { background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/game/top_main_banner_sdvx.png") no-repeat scroll transparent; 
  width:100%; height:266px;
  background-size:100%;
}
#top_slider_app { background: url("https://eacache.s.konaminet.jp/game/eacloud/top_banner/slide_bnr_PC.png") no-repeat scroll transparent; 
  width:100%; height:266px;
  background-size:100%;
}

#top_slider_konast_cp { background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/cm/top_konast_cp735.png") no-repeat scroll transparent;
  width:100%; height:266px;
  background-size:100%;
}
#top_slider_qma { background: url("https://eacache.s.konaminet.jp/game/eacloud/p/images/game/top_main_banner_qma1.png") no-repeat scroll transparent;
  width:100%; height:266px;
  background-size:100%;
}
}

@media (max-width:399px){
#play {
  display: none;
}}*/

/* --------------------------------------*/
/*                                       */
/* --------------------------------------*/
#side_container {
  position: relative;
  top:0px;
  width:240px;
  height: 335px;
  float:left;
}


.news_li {
  margin:0;
  box-sizing:border-box;
}

.news_list {
  width:100%;
  height:auto;
  border-bottom:dotted 1px #ccc;
  margin:3px;
  padding:4px;
  box-sizing:border-box;
}
.news_head {
  height:auto;
  margin-top:4px;
  box-sizing:border-box;
}
.news_link {
  padding:0 1em;
  letter-spacing:-1px;
  box-sizing:border-box;
  text-border:none;
}

/*@media (min-width:840px){*/
.news_titleL {
  width:49%;
  margin:0;
  box-sizing:border-box;
  float:left;
}
.news_titleR {
  width:49%;
  margin-left:4px;
  box-sizing:border-box;
  float:left;
}
#news_scroll #news_inner {
  overflow-x: hidden;
  overflow-y: scroll;
  position: relative;
  top: 0px;
  height: 300px;
  background:#fff;
  border-bottom: outset 1px #ccc;
  border-left: outset 1px #ccc;
  //line-height:1.7em;
  text-indent:1em;
}
/*}
@media (max-width:839px){
.news_titleL {
  width:92%;
  height:auto;
  margin:0 auto;
}
.news_titleR {
  width:92%;
  height:auto;
  margin:0 auto;
}
#news_scroll #news_inner {
  overflow-x: hidden;
  overflow-y: scroll;
  position: relative;
  top: 0px;
  height: 200px;
  background:#fff;
  border-bottom: outset 1px #ccc;
  border-left: outset 1px #ccc;
  //line-height:1.7em;
  text-indent:1em;
}
}*/
.news_titleL_head {
  width:100%; background:#adf; height:20px; font-weight:bold; line-height:1.8em;
}
.news_titleR_head {
  width:100%; background:#fc8; height:20px; font-weight:bold; line-height:1.8em;
}

#news_inner ul li {
  margin: 5px 0px;
}

#news_inner ul li a {
  margin: 0;
  color: #00f;
  /*text-decoration:underline;*/
}

.news_tab_box {
  width:100%;
  height:760px;
  margin:0;
  padding:0;
}
.news_tab_head_news {
  width:100%;
  height:auto;
  background:#adf;
  margin:0;
  padding:6px 1em;
  font-weight:bold;
  box-sizing:border-box;
}
.news_tab_head_mente {
  width:100%;
  height:auto;
  background:#fc8;
  margin:0;
  padding:6px 1em;
  font-weight:bold;
  box-sizing:border-box;
}
.news_tab_box_inc {
  width:100%;
  height:340px;
  margin:0;
  padding:0.5em 1em;
  /*border-left:1px solid #ccc;*/
  box-sizing:border-box;
}
.news_tab_box #news_head_all {
  width:99%;
  height:auto;
  background:#ae8;
  padding:4px;
  margin:2px;
  /*border:solid #fa0 1px;*/
  font-weight:bold;
  box-sizing:border-box;
}
.cp_tab *, .cp_tab *:before, .cp_tab *:after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.cp_tab {
  margin: 1px auto;
  position: relative;
}
.cp_tab input[type='radio'] {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  outline: none;
  background: none;
  -webkit-appearance: none;
          appearance: none;
  display: none;
}
.cp_tab .cp_tabpanel {
  display: none;
}
/*トップに20タイトルも出すかどうかは置いといてとりあえず設定はしておく*/
.cp_tab > input:first-child:checked ~ .cp_tabpanels > .cp_tabpanel:first-child,
.cp_tab > input:nth-child(3):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(2),
.cp_tab > input:nth-child(5):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(3),
.cp_tab > input:nth-child(7):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(4),
.cp_tab > input:nth-child(9):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(5),
.cp_tab > input:nth-child(11):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(6),
.cp_tab > input:nth-child(13):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(7),
.cp_tab > input:nth-child(15):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(8),
.cp_tab > input:nth-child(17):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(9),
.cp_tab > input:nth-child(19):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(10),
.cp_tab > input:nth-child(21):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(11),
.cp_tab > input:nth-child(23):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(12),
.cp_tab > input:nth-child(25):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(13),
.cp_tab > input:nth-child(27):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(14),
.cp_tab > input:nth-child(29):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(15),
.cp_tab > input:nth-child(31):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(16),
.cp_tab > input:nth-child(33):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(17),
.cp_tab > input:nth-child(35):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(18),
.cp_tab > input:nth-child(37):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(19),
.cp_tab > input:nth-child(39):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(20),
.cp_tab > input:nth-child(41):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(21),
.cp_tab > input:nth-child(43):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(22),
.cp_tab > input:nth-child(45):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(23),
.cp_tab > input:nth-child(47):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(24),
.cp_tab > input:nth-child(49):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(25),
.cp_tab > input:nth-child(51):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(26),
.cp_tab > input:nth-child(53):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(27),
.cp_tab > input:nth-child(55):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(28),
.cp_tab > input:nth-child(57):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(29),
.cp_tab > input:nth-child(59):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(30) {
  display: block;
}
.cp_tab .cp_tabpanels {
  position: absolute;
  top:0;
  left: 10em;
  display: block;
  min-height: 320px;
  border-top:1px solid #ccc;
  border-right:1px solid #ccc;
  border-bottom:1px solid #ccc;
  box-sizing:border-box;
}
.cp_tab > input + label {
  position: relative;
  z-index: 100;
  top: 0px;
  left: 1px;
  display: block;
  width: 10em;
  margin-bottom: 2px;
  padding: 5px;
  cursor: pointer;
  border: 1px solid #ccc;
  border-right: 0;
  border-radius: 6px 0 0 6px;
  background:#ddd;
}
.cp_tab > input + label:last-of-type {
  margin-bottom: 100px;
}
.cp_tab > label:hover,
.cp_tab > input:focus + label {
  color: #0066cc;
  background:#fff;
}
.cp_tab > input:checked + label {
  border-color: #ccc;
  border-right: 1px solid #fff;
  background:#fff;
}
.cp_tab .cp_tabpanel {
  padding: 0.5em 1em;
  border-left: 1px solid #ccc;
  min-height: 320px;
}


@media (min-width:980px){
.side_menu {
  width:240px;
//  height:360px;
  margin-left:5px;
  float:left;
/*  overflow-x: hidden;
  overflow-y: scroll;*/
  
}
}
@media (max-width:979px){
.side_menu {display:none;}
}

.box_contents_txt {
  width:auto;
  color:#eee;
  font-size:12px;
  letter-spacing:0.1em;
  text-align:left;
  line-height:1em;
  padding:3px;
  margin:0;
}

@media (min-width:840px){
.box_contents_txt #txtC { float:left; margin-top:43px; margin-left:8px;}
.box_contents_txt #txtC2 { float:left; margin-top:43px; margin-left:8px;}
}