@charset "UTF-8";

/*
//共通部分/////////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
html
{
    font-size: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout:none;
}
body
{
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif;
    line-height: 1.7;
    color: #3c3c3c;
    background-color: #fff;
    -webkit-touch-callout:none; /* リンク長押しのポップアップを無効化 */
    -webkit-user-select:none; /* テキスト長押しの選択ボックスを無効化 */
}
a
{
    text-decoration: none;
}
img
{
    max-width: 100%;
}

/*ラッパー*/
.wrapper
{
    max-width: 1100px;
    margin: 0 auto;
    background-color: #fdf2e8;
}


.sidebarL {
    width: calc((100% - 1100px)/2);
    position: absolute;
    top: 0px;
    left: 0px;
    /*border: 2px solid #00F;*/
}
.sidebarL_box {
    width: 160px;
    margin: 0 auto;
    /*border: 2px solid #F00;*/
}

.sidebarL2 {
    width: calc((100% - 1100px)/2);
    position: absolute;
    top: 610px;
    left: 0px;
    /*border: 2px solid #00F;*/
}
.sidebarL2_box {
    width: 160px;
    margin: 0 auto;
    /*border: 2px solid #F00;*/
}

.sidebarR {
    width: calc((100% - 1100px)/2);
    position: absolute;
    top: 0px;
    right: 0px;
    /*border: 2px solid #00F;*/
}
.sidebarR_box {
    width: 160px;
    margin: 0 auto;
    /*border: 2px solid #F00;*/
}

.sidebarR2 {
    width: calc((100% - 1100px)/2);
    position: absolute;
    top: 610px;
    right: 0px;
    /*border: 2px solid #00F;*/
}
.sidebarR2_box {
    width: 160px;
    margin: 0 auto;
    /*border: 2px solid #F00;*/
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


/*
//ヘッダー全般///////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
header
{
    width: 100%;
    height: 210px;
    border-top: 30px solid #419A6B;
    background: #fdf2e8;
    border-bottom: solid 4px #419A6B;
}

/*ヘッダーコンテナ*/
.header_nav
{
    position: absolute;
    top: 0px;
    display: flex;
    justify-content: space-evenly;
}
/*ヘッダー文字*/
.header_nav h1
{
    position: absolute;
    top: 0px;
    color: #fff;
    font-size: 17px;
    line-height: 30px;
}

/*PC用のロゴ画像*/
.header_logoImg
{
    position: relative;
    top: 70px;
    left: 20px;
    width: 180px;
}
.header_logoImg a img
{
    width: 180px;
}

/*ヘッダー用のアニメーション*/
.header_animation
{
    position: relative;
    top: 30px;
    width: 700px;
}
.header_animation iframe
{
    width: 100%;
    height: 100%;
}

/*PC用のタブ*/
.header_tabs
{
    margin-left: 20px;
    position: relative;
    top: 5px;
    width: 580px;
    font-size: 15px;
    text-align: center;
}
.header_tabs .nav-tabs
{
    color: #419A6B;
    border-bottom-color: #419A6B;
}
.header_tabs .nav-tabs .nav-item
{
    width: 115px;
}
.header_tabs .nav-tabs > li > a
{
    color: #419A6B;
}
.header_tabs .nav-tabs .nav-link
{
    font-size: 0.9rem;
    color: #000;
    font-weight: bold;
    cursor: pointer;
    background-color: #FFF;
    border: 2px solid #419A6B;
    border-bottom: 2px solid #419A6B;
}
/*.header_tabs .nav-tabs .nav-link.ALL_BTN
{
    background-color: #ba55d3;
}
.header_tabs .nav-tabs .nav-link.PAZZLE_BTN
{
    background-color: #75A9FF;
}
.header_tabs .nav-tabs .nav-link.ACTION_BTN
{
    background-color: #FF5192;
}
.header_tabs .nav-tabs .nav-link.ANOTHER_BTN
{
    background-color: #ffa500;
}
.header_tabs .nav-tabs .nav-link.NEWS_BTN
{
    background-color: #D3D3D3;
}
.header_tabs .nav-tabs .nav-link.MEDAL_BTN
{
    background-color: #FFD700;
}
.header_tabs .nav-tabs .nav-link.VILLAGE_BTN
{
    background-color: #CD853F;
}
.header_tabs .nav-tabs .nav-link.RANKING_BTN
{
    background-color: #EE82EE;
}
.header_tabs .nav-tabs .nav-link.SETTING_BTN
{
    background-color: #77EEFF;
}*/
.header_tabs .nav-tabs .nav-link.active
{
    font-size: 1rem;
    color: #FFF;
    font-weight: bold;
    cursor: default;
    background-color: #419A6B;
    border: 1px solid #419A6B;
    border-bottom-color: rgb(221, 221, 221);
    border-bottom-color: transparent;
}


/*PC用　ユーザー画面*/
.header_user
{
    position: relative;
    top:27px;
    left: -30px;
    width: 250px;
    height: 152px;
    border: 3px solid #419A6B;
    padding: 0 5px;
    background: #FFF;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.header_user .userMedal
{
    position: relative;
    top:-15px;
    margin-top: 0px;
    border: solid 1px #419A6B;
}
.header_user .user_btns
{
    text-align:center;
    position:absolute;
    bottom:0;
    margin-left: 8px;
    margin-bottom: 5px;
}
.userName span
{
    font-size: 20px;
    font-weight: bold;
}
.medalCnt
{
    font-weight: bold;
    font-size: 20px;
}
.medalCare
{
    color: #F00;
}
.user_btns button
{
    display:inline-block;
}


/*SP用　ユーザー画面*/
.header_user_sp
{
    position:relative;
    top: 0px;
    width: 100%;
    height: 120px;
    display: none;

    border-top: 2px solid #419A6B;
    border-right: 5px solid #419A6B;
    border-left: 5px solid #419A6B;
    border-right: 5px solid #419A6B;
    border-bottom: 5px solid #419A6B;
    padding: 0 5px;
    background: #FFF;
}
.header_user_sp .userMedal
{
    position: relative;
    top:-10px;
}
/*SP用のロゴ画像*/
.header_user_sp .header_logoImg_sp
{
    position:absolute;
    right: 10px;
    top: 0px;
    width: 120px;
}
.header_user_sp .user_btns
{
    text-align:center;
    position:absolute;
    right: 0;
    bottom:0;
    margin-right: 8px;
    margin-bottom: 5px;
}

/*SP用のタブ*/
.header_tabs_sp
{
    position:relative;
    top: 0px;
    display: none;
}
.header_tabs_sp .btn-group
{
    width: 100%;
    background-color: #419A6B;
    margin: 0;
    padding: 0;
}
.header_tabs_sp .btn-group button
{
    width: 100%;
    height: 40px;
    font-size: 0.7rem;
    border: solid 1px #419A6B;
    border-bottom: solid 4px #419A6B;
    background: #FFF;
}
.header_tabs_sp .btn-group:first-child {
    border-left: solid 4px #419A6B;
}
.header_tabs_sp .btn-group:last-child {
    border-right: solid 4px #419A6B;
}

/*.header_tabs_sp .btn-group .ALL_BTN
{
    background-color: #ba55d3;
}
.header_tabs_sp .btn-group .PAZZLE_BTN
{
    background-color: #75A9FF;
}
.header_tabs_sp .btn-group .ACTION_BTN
{
    background-color: #FF5192;
}
.header_tabs_sp .btn-group .ANOTHER_BTN
{
    background-color: #ffa500;
}
.header_tabs_sp .btn-group .NEWS_BTN
{
    background-color: #D3D3D3;
}
.header_tabs_sp .btn-group .MEDAL_BTN
{
    background-color: #FFD700;
}
.header_tabs_sp .btn-group .VILLAGE_BTN
{
    background-color: #CD853F;
}
.header_tabs_sp .btn-group .RANKING_BTN
{
    background-color: #EE82EE;
}
.header_tabs_sp .btn-group .SETTING_BTN
{
    background-color: #77EEFF;
}*/


.header_tabs_sp .btn-group .active
{
    font-size: 1rem;
    color: #FFF;
    font-weight: bold;
    cursor: default;
    background: #419a6b;
}

/*パンくず*/
#breadcrumb {
  margin-top: 10px;
  margin-bottom: 2%;
}

.breadcrumb {
  margin: 0;
  padding: 0;
  list-style: none;
}
.breadcrumb li {
  position: relative;
  display: inline-block;/*横に並ぶように*/
  list-style: none;
  font-weight: bold;/*太字*/
  margin-right: 0.3em;
}
.breadcrumb li:not(:last-child):after {
  content: "";
  position: absolute;
  top: 7px;
  right: -19px;
  border-style: solid;
  border-color: transparent;
  border-left-color: #419A6B;
  border-width: 7px 12px;
  width: 0;
  height: 0;
}
.breadcrumb li a {
  display: inline-block;
  padding: 0 7px;
  height: 28px;
  line-height: 28px;
  text-decoration: none;
  color: #FFF;
  background: #419A6B;
  font-size: 13px;
  border-radius: 20px;
  transition: 0.3s;
}
.breadcrumb li:last-child a {
    color: #000;
}
.breadcrumb li:not(:last-child):hover {
  transform: translateY(-3px);
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


/*
//ゲーム一覧///////////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
.game_grid
{
    display: grid;
    grid-gap: 26px;
    grid-template-columns: repeat(auto-fit, minmax(320px,1fr));/*1fr 1fr 1fr;*/
    margin-top: 2%;
    margin-bottom: 2%;
}
.game_grid_item
{
    width: 320px;
    height: 320px;
    position: relative;/*相対配置*/
    margin: 0 auto;
    overflow: hidden;
    border-radius: 20px;
    cursor: pointer;
    text-align: center;
    border: double 5px #8BC34A;
    background-color: #419A6B;
}

.game_grid_item.categorybg1
{
    background-color: #75A9FF;
}
.game_grid_item.categorybg2
{
    background-color: #FF5192;
}
.game_grid_item.categorybg5
{
    background-color: #ffa500;
}
.game_grid_item.categorybg9
{
    background-image: -webkit-linear-gradient(to top left, #F7DE05, #DA8E00, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03);
    background-image: -moz-linear-gradient(to top left, #F7DE05, #DA8E00, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03);
    background-image: -ms-linear-gradient(to top left, #F7DE05, #DA8E00, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03);
    background-image: -o-linear-gradient(to top left, #F7DE05, #DA8E00, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03);
    background-image: linear-gradient(to top left, #F7DE05, #DA8E00, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03);
}
.game_grid_item:hover
{
   transform: scale(1.025, 1.025);
}
.game_grid_item img
{
    position: absolute;/*絶対配置*/
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    max-width: 340px;
    max-height: 340px;
}
.game_grid_item_wide img
{
    top: 41%;
}

.game_grid_item.ad img
{
    top: 3%;
    left: 50%;
    -ms-transform: translate(-50%,-3%);
    -webkit-transform: translate(-50%,-3%);
    transform: translate(-50%,-3%);
}

.game_grid_item p
{
    pointer-events: none;
    position: absolute;/*絶対配置*/
    top: 91%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin:0;
    padding:1% 6%;
    width: 100%;
    font-weight: bold;
    font-size: 1.4rem;
    color: #FFF;
    background: rgba(0, 0, 0, 0.9);
    line-height: 120%;
}
.game_grid_item p .description
{
    font-weight: normal;
    font-size: 1rem;
}

.gameSubName {
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: center;
    padding: 0.1em;/*文字周りの余白*/
    color: #000;/*文字色*/
    font-weight: bold;
    background: #eaf3ff;/*背景色*/
    border-top: solid 3px #516ab6;/*下線*/
    border-bottom: solid 3px #516ab6;/*下線*/
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/



/*
//ニュース一覧////////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
.NEWS_DISPLAY {
    margin-top: 2%;
    display: flex;
    justify-content: center;
    height: 500px;
    overflow: auto;
}
.NEWS_DISPLAY ul{
    width:90%;
    padding-top: 10px;
    padding-bottom: 10px;

    border-radius: 20px;
    border: double 5px #419A6B;
    background: #FFF;
    overflow: auto;
}
.NEWS_DISPLAY ul li{
    border-bottom:1px solid #ccc;
    list-style:none;
    margin-right: 30px;
}
.NEWS_DISPLAY ul li a{
    text-decoration:none;
    display: block;
    padding: 10px 10px;
    padding-left: 10px;
}
.NEWS_DISPLAY ul li a:hover{
    background-color:#ccc;
}

.NEWS_DISPLAY ul li a span{
    background-color:#2388b8;
    border-radius:3px;
    color:#fff;
    display:inline-block;
    margin-right:20px;
    padding:5px;
}
.NEWS_DISPLAY ul li a time{
    display: inline-block;
    font-weight: bold;
    margin-right:40px;
}
.NEWS_DISPLAY ul li a p{
    color: #131313;
    display: inline-block;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    font-weight: bold;
}
.NEWS_DISPLAY ul li a p.new::after{
    content:"NEW";
    color: #d10606;
    font-size: 1.1rem;
    border: 1px solid #d10606;
    padding: 4px 8px;
    margin: 0 0 0 20px;
    display: inline-block;
    line-height: 1;
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/



/*
ーーーーーーーーーーーーーーーーーーーーーーー
マイページ
///////////////////////////////////////////////////////////////////////////*/
.mypageDisp {
    display: none;
}

/*ヘッダー用のアニメーション*/
.village_animation
{
    width: 100%;
    height: 500px;
    
    /*border: solid 1px #FF0000;*/
}

.village_animation iframe {
    width: 100%;
    height: 100%;
   /*background-color: #fdf2e8;*/
}

.village_pager_parent {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    height: 50px;
}
.village_pager
{
    padding-left: 0;
    list-style: none;
    margin-top: 10px;
}
.village_pager li
{
    display: inline;
    padding:10px 15px;
    border:1px #ccc solid;color:#000053;
    border-radius: 5px / 5px;
    background-color:#FFF;
}
.village_pager .village_pager_active
{
    background-color:#777;
    color:#fff;
}

.village_edit {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    height: 60px;
}
.village_edit a {
    margin-top: 0px;
}

.village_item_list {
    width: 90%;
    margin: 3% auto;
    text-align: center;
}
.village_item_list_area {
    border: inset 4px #999;
}
.village_item_list_tx_al_left{
    text-align: left;
}

/*アイテム交換所*/
.itemShop {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    text-align: center;
}

.itemShop::before,
.itemShop::after {
    content: '';
    width: 70px;
    height: 3px;
    background-color: #419a6b;
}

.itemShop::before {
    margin-right: 20px;
}
.itemShop::after {
    margin-left: 20px;
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/



/*
//フッター全般///////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
footer
{
    width: 100%;
    height: 100px;
    background: #419A6B;
}
footer .explanation {
    padding-top: 10px;
    display: flex;
    justify-content: center;
}
footer .explanation_item {
    font-size: 1rem;
    padding: 0px 3%;
    text-align: center;
}
footer .explanation_item:first-child {
   margin-right: 5%;
}
footer .explanation_item:last-child {
   margin-left: 5%;
}
footer hr {
    margin-top: 10px;
    margin-bottom: 0px;
}
footer .corp {
    text-align: center;
    position: relative;/*絶対配置*/
    top: 10px;
    color: #FFF;
}
footer a,
footer a:link,
footer a:visited,
footer a:active{
    color: #FFF;
}

footer a:hover{
    color: #F00;
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


/*
//確認ポップ/////////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
.popup_overlay
{
    display: flex;
    justify-content: center;
    overflow: auto;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 9999;
}
.popup_content {
    position: absolute;
    align-self: center;
    width: 90%;
    max-width: 800px;
    max-height: 500px;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.4em;
    transition: 0.5s;
    border-radius: 12px;
    box-shadow: 0 0 5px rgba(94, 94, 94, 0.7);

    display:flex;
    flex-flow: column;
}
.popup_header
{
    position: relative;
    width: 100%;
    margin-top: 0px;
    background: #419a6b;
    border-radius: 12px 12px 0px 0px;
}
.popup_header h1
{
    margin-top: 10px;
    font-size: 2rem;
    text-align: center;
    color: #fff;
    font-weight: bold;
}
.popup_footer
{
    padding: 10px 0;
    clear: both;
    position: relative;
    width: 100%;
    margin-bottom: 0px;
    text-align: center;
    background: #419a6b;
    border-radius: 0px 0px 12px 12px;
}
.popup_footer a
{
    position: relative;
    display: inline-block;
    padding: 0.5em 0.8em;
    text-decoration: none;
    background: #fdf2e8;/*背景色*/
    color: #11271b;/*=背景色*/
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2);
    border-bottom: solid 2px #666;
    border-radius: 4px;
    font-weight: bold;
    text-shadow: -1px -1px rgba(255, 255, 255, 0.44), 1px 1px rgba(0, 0, 0, 0.38);
}
.popup_footer a:hover
{
    color: #419a6b;/*=背景色*/
}
.popup_footer a:active
{
    border-bottom: solid 2px #beb5ac;
    background: #beb5ac;/*背景色*/
    color: #214d36;/*=背景色*/
    box-shadow: none;
    text-shadow: -1px -1px rgba(255, 255, 255, 0.3), 1px 1px rgba(0, 0, 0, 0.3);
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


/*
//ゲーム確認ポップ/////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
#gamePop
{
    display: none;
}
.gamePop_popup_content
{
    height: 75%;
    justify-content:space-between;
}
.gameInfo
{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
    background: #fdf2e8;
}
.gameImgs
{
    display: flex;
    justify-content: space-between;
    position: relative;
    width: 50%;
    height: auto;
    margin-top: 1%;
    margin-left: 1%;
    margin-right: 2%;
    float: left;
}
.gameImgs_wide
{
    flex-flow: column;
}
.gameImgs img
{
    padding: 2px;
    width: 50%;
    height: 50%;
    box-shadow: 2px 10px 10px #666666;
}
.gameImgs_wide img
{
    margin-left: 9%;
    width: 82%;
    height: 82%;
}
.gameInfo p
{
    margin: 2% 10px 10px 52%;
    font-size: 1.2rem;
    background: rgba(255, 255, 255, 0.8);
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


#explanationPop
{
    display: none;
}
#explanationDetail
{
    height: 100%;
    overflow: auto;
}
#explanationDetail div {
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    font-size: 1.2rem;
    color: #000;
    font-weight: 120;
    line-height: 130%;
}
#explanationDetail div p{
    display: inline-block;
    text-align: left;
    padding-left: 2%;
    padding-right: 2%;
}
#explanationDetail .under{
    background: linear-gradient(transparent 70%, #0bd 100%);
}
#explanationDetail .under2{
    background: linear-gradient(transparent 70%, #Fa0 100%);
}
#explanationDetail .red{
    font-weight: bold;
    color: #F00;
}


#privacyPop
{
    display: none;
}
#privacyDetail
{
    height: 100%;
    overflow: auto;
}
#privacyDetail div {
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    font-size: 1.2rem;
    color: #000;
    font-weight: 120;
    line-height: 130%;
}
#privacyDetail div p{
    display: inline-block;
    text-align: left;
    padding-left: 2%;
    padding-right: 2%;
}


#administratorPop
{
    display: none;
}
#administratorDetail
{
    height: 100%;
    overflow: auto;
}
#administratorDetail div {
    position: relative;
    width: 80%;
    margin: 0 auto;
    text-align: center;
    font-size: 1.1rem;
    color: #000;
    font-weight: 120;
}
#administratorDetail div table tr th{
    padding-left: 5%;
    text-align: left;
}
#administratorDetail div table tr td{
    padding-left: 15%;
    text-align: left;
}

/*
//ニュース確認ポップ/////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
#newsPop
{
    display: none;
}
.newsPop_popup_content
{
    background: #fdf2e8;
}

#newsDetail
{
    height: 100%;
    overflow: auto;
}

#newsDetail h3 {
    text-align:center;
    text-decoration:underline;
    text-decoration-color:#FF0000;
}
#newsDetail div {
    /*position: relative;
    width: 100%;
    display:grid;
    grid-template-columns: repeat(auto-fit,120px);
    justify-content:center;*/
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    font-size: 1.2rem;
    color: #000;
    font-weight: 120;
    line-height: 130%;
}
#newsDetail div p{
    /*border: solid 2px #0000FF;
    position: relative;
    width: 100%;*/
    display: inline-block;
    text-align: left;
    padding-left: 2%;
    padding-right: 2%;
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


/*
//ログイン確認ポップ/////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
#loginPop
{
    display: none;
}
.loginPop_popup_content
{
    background: #fdf2e8;
}
.loginHeader
{
    margin-bottom: 10px;
}

/*ログイン画面*/
#loginForm
{
    width: 100%;
    height: 180px;
    color:#000;
    font-weight:bold;
    font-size: 20px;
    margin: 0px auto;
    padding: 0px 20px 0px 20px;
    text-decoration: none;
}
#loginForm input[type="text"],
#loginForm input[type="password"]
{
    width: 70%;
    padding: 4px;
    font-size: 14px;
}
#loginForm p
{
    font-size: 14px;
    margin-bottom: 0px;
}
.loginInputArea
{
    width: 96%;
    margin-top: 0px;
    margin-bottom: 20px;
    margin-left: 2%;
    border: solid 2px #419a6b;
}
.loginFooter
{
    height: 60px;
}
/*
ーーーーーーーーーーーーーーーーーーーーーーー
///////////////////////////////////////////////////////////////////////////*/


/*
//フゲーム確認ポップ/////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
#entryPop
{
    display: none;
}
.entryPop_popup_content
{
    background: #fdf2e8;
}
.entryHeader
{
    margin-bottom: 10px;
}

/*ログイン画面*/
#entryForm
{
    width: 100%;
    height: 180px;
    color:#000;
    font-weight:bold;
    font-size: 20px;
    margin: 0px auto;
    padding: 0px 20px 0px 20px;
    text-decoration: none;
}
#entryForm input[type="email"]
{
    width: 70%;
    padding: 4px;
    font-size: 14px;
}
#entryForm p
{
    font-size: 14px;
    margin-bottom: 0px;
}
.loginInputArea
{
    width: 96%;
    margin-top: 0px;
    margin-bottom: 20px;
    margin-left: 2%;
    border: solid 2px #419a6b;
}

#accordion
{
    width: 100%;
    margin: 0 auto;
}
.accordion-wrap
{
    position: relative;
    width: 100%;
    height: 100%;
    background: #fdf2e8;
}
.accordion-click
{
    background-color: #4060B8;
    color: #fff;
    cursor: pointer;
}
.accordion-content
{
    font-size:14px;
    font-weight:normal;
    width: 95%;
    margin: 0 auto;
    margin-top: 10px;
}
.accordion-click,
.accordion-content
{
    padding: 2px;
}

.entryFooter
{
    height: 90px;
}
.check
{
    color: #FFF;
    margin-bottom: 8px;
}

/*
//レスポンシブ対応///////////////////////////////////////////////////////////////
ーーーーーーーーーーーーーーーーーーーーーーー*/
@media (max-width:1420px)
{
    .sidebarL
    {
        display: none;
    }

    .sidebarL2
    {
        display: none;
    }
}

@media (max-width:1100px)
{
    .sidebarR
    {
        display: none;
    }

    .sidebarR2
    {
        display: none;
    }

    .header_nav h1
    {
        position: absolute;
        left: 0px;
        padding-left: 5px;
    }

    .header_nav .header_animation
    {
        width: 100vw;
    }

    .header_nav .header_logoImg
    {
        display: none;
    }

    .header_nav .header_tabs
    {
        margin: 0 auto;
        width: 580px;
        top: 5px;
    }

    .header_nav .header_user
    {
        display: none;
    }

    .header_user_sp
    {
        display: block;
    }


    .gameInfo p{
        font-size: 1rem;
    }
}

@media (max-width:640px)
{
    .header_nav h1
    {
        font-size: 0.8rem;
    }
    .header_nav .header_tabs
    {
        display: none;
    }

    .header_tabs_sp {
       display: block;
    }

    header
    {
        height: 180px;
    }

    .gameInfo p{
        font-size: 0.8rem;
        clear: left;
        clear: both;
        margin: 5% 10px 10px 3%;
    }

    .gameImgs
    {
        width: 80%;
        clear: left;
        clear: both;

        padding-Left: 15%;
        margin-bottom: 5%;
    }

    .game_grid_item p .description
    {
        font-size: 0.9rem;
    }

    .village_animation
    {
        height: 400px;
    }

    footer .explanation_item {
        font-size: 0.75rem;
    }

    #newsDetail div {
        font-size: 1rem;
    }
    #explanationDetail div {
        font-size: 1rem;
    }
}

@media (max-width:400px)
{
    footer .explanation_item {
        font-size: 0.6rem;
    }

    #newsDetail div {
        font-size: 0.9rem;
    }
    #explanationDetail div {
        font-size: 0.9rem;
    }
}
/*------------*/

.SETTING_DISPLAY {
    margin: 0 auto;
    width: 90%;
}

.SETTING_DISPLAY form{
    padding-left: 30px;
}

.SETTING_DISPLAY form label,
.SETTING_DISPLAY form legend{
    font-weight: bold;
}


.underBlue{
    font-weight: bold;
    background: linear-gradient(transparent 70%, #0bd 100%);
}
.underYellow{
    font-weight: bold;
    background: linear-gradient(transparent 70%, #Fa0 100%);
}
.underRed{
    font-weight: bold;
    background: linear-gradient(transparent 70%, #F00 100%);
}
.underGreen{
    font-weight: bold;
    background: linear-gradient(transparent 70%, #0F9 100%);
}


#randomGame
{
    position: relative;
    width: 60%;
    height: auto;
    min-width: 400px;
    max-width: 800px;
    margin: 0 auto;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 0 5px rgba(94, 94, 94, 0.7);
    box-sizing: border-box;
}
#randomGame .popup_header
{
    margin-top: 4px;
    padding: 2px 0;
    background: #ff7f50;
}
#randomGame .popup_header h1
{
    margin-bottom: 0px;
}
#randomGame p
{
    font-size: 1rem;
}
#randomGame .popup_footer
{
    padding: 3px 0;
    background: #ff7f50;
}
@media (max-width:720px)
{
    #randomGame .popup_header h1
    {
        font-size: 1.5rem;
    }
    #randomGame p
    {
        font-size: 0.8rem;
    }
}
@media (max-width:640px)
{
    #randomGame p
    {
        display: none;
    }
}