@media screen and (min-width:961px) { .spOnly { display:none !important; } }
@media screen and (max-width:960px) { .pcOnly { display:none !important; } }

/************************************************************************
  * { box-sizing:border-box; }
************************************************************************/
html { color:#fff; }
img { vertical-align:bottom; border:0; width:100%;}
body { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo UI", Meiryo, sans-serif; color:#fff; min-height:100vh; font-size:16px; }


.pointer-events { pointer-events:none; }


/* SP */
@media screen and (max-width:960px){
body{ background:#000; font-size:3.5vw; }
}

/************************************************************************
  gothic
************************************************************************/
.yu-min { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo UI", Meiryo, sans-serif; }
/************************************************************************
  body
************************************************************************/
body { background-color:#ffffff; color:#333333; line-height:1; font-size:0; }

/************************************************************************
  
************************************************************************/
.dp-none { display:none; }
p.img { font-size:0 }
h2 { font-size:0; }

a { color:#b29a3e; }
a:hover { cursor:pointer !important; }
.mb60 { margin-bottom:60px !important; }

a.pe-none { pointer-events:none; }

.flex { display:flex; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

.mb60 { margin-bottom:calc(60px * 0.7) !important; }
}
/************************************************************************
  header
************************************************************************/
header { margin-bottom:0; height:1080px; background:url('../img/header.png') no-repeat top center transparent; background-size:auto 100%; font-size:0; }

header::before { content:''; /*padding-top:calc(1080/1500*100%);*/height:100%; width:100%; }

header h1 {  }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

header { margin-bottom:0; padding-top:0; height:calc(680/750*100vw); background:url('../img/main_image_sp.png') no-repeat; background-size:auto 100%; }
header h1 {  }

header::before { display:none; }

}
/************************************************************************
  #bg
************************************************************************/
#bg {
  background:url('../img/bg.png') no-repeat center top;
  background-size: cover;
  background-attachment: fixed;
  background-position:
  top center,
  top calc(9244px + (3000px * 0)) center,
  top calc(9244px + (3000px * 1)) center,
  top calc(9244px + (3000px * 2)) center,
  top calc(9244px + (3000px * 3)) center,
  top calc(9244px + (3000px * 4)) center,
  top calc(9244px + (3000px * 5)) center;
  background-repeat: no-repeat;
}

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#bg {
  background:url('../img/bg_sp.png');
  background-size:100% auto;
  background-position:
  top center,
  top calc(654.5vw + (200vw * 0)) center,
  top calc(654.5vw + (200vw * 1)) center,
  top calc(654.5vw + (200vw * 2)) center,
  top calc(654.5vw + (200vw * 3)) center,
  top calc(654.5vw + (200vw * 4)) center,
  top calc(654.5vw + (200vw * 4)) center,
  top calc(654.5vw + (200vw * 5)) center,
  top calc(654.5vw + (200vw * 6)) center,
  top calc(654.5vw + (200vw * 7)) center,
  top calc(654.5vw + (200vw * 7)) center,
  top calc(654.5vw + (200vw * 8)) center,
  top calc(654.5vw + (200vw * 9)) center,
  top calc(654.5vw + (200vw * 10)) center,
  top calc(654.5vw + (200vw * 11)) center,
  top calc(654.5vw + (200vw * 12)) center,
  top calc(654.5vw + (200vw * 13)) center,
  top calc(654.5vw + (200vw * 14)) center,
  top calc(654.5vw + (200vw * 15)) center;
  background-repeat: no-repeat;
  overflow:hidden;
}
#bg-fix { background-image:none; }

}

/************************************************************************
  main
************************************************************************/
main { margin:auto auto 0; color:#333333; padding-top: 3%;}


/* ============ smart phone ============ */
@media screen and (max-width:750px){

}
/************************************************************************
  .contents
************************************************************************/
.contents { margin:auto; width:950px; height:100%; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

.contents { width:100%; }

}
/************************************************************************
  .column
************************************************************************/
.column {  }

.column h2 {  }

.column h3 {  }

.column p { text-align:left; line-height:1.7894; font-size:17px; margin-bottom: 20px;}
.column p small { font-size:16px; }
.column a { color:#b29a3e; font-weight:bold; }
.column strong { font-weight:bold; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

.column {  }
.column p { margin-right:auto; margin-left:auto; line-height:calc(36/22); font-size:calc(22/750*100vw); }

}


/************************************************************************
  #update
************************************************************************/
#update {
    margin-bottom: calc(70px + 112px);
}
#update h3 {
    background-image: url(../img/h3_update.png);
    width: calc(962px /2);
    height: calc(116px / 2);
    left: 0;
    right: 0;
    margin: auto;
    top: calc(-109px + 30px);
}

#update .gold_line {
  margin-bottom: 40px;
}
#update .gold_line img {
  width: calc(1624px / 2);
}

#update h4 { margin-bottom:45px; text-align:center; }
#update h4 img { width:calc(1396px / 2); }


#update h5.h5_update1 { margin-bottom:28px; text-align:center; }
#update h5.h5_update1 img { width:calc(1640px / 2); }

#update h5.h5_update2 { margin-bottom:29px; margin-top: 55px; text-align:center; }
#update h5.h5_update2 img { width:calc(1752px / 2); }

#update h5.h5_update3 { margin-bottom:49px; margin-top: 55px; text-align:center; }
#update h5.h5_update3 img { width:calc(1386px / 2); }

#update .addto_text {
  margin-bottom: 20px;
}
#update .addto_text p {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo UI", Meiryo, sans-serif;
    font-size: 22px;
    text-align: left;
    font-weight: bold;
    padding-left: 1em;
    text-indent: -.45em;
}
#update .addto_text p::before {
    content: '\025c6';
    margin: 0 5px 0 0;
    color: #b29a3e;
    font-size: 12px;
    display: inline-block;
}

#update hr {
    margin: 0 0 50px;
    height: 0;
    border: 1px solid #f5f3f1;
}
#update .heading
{font-size: 23px;}

#update .up_text
{ font-family: system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo UI", Meiryo, sans-serif;}

/* ============ smart phone ============ */
@media screen and (max-width:750px){
#update {
    margin-bottom: calc((105 + 65)/750*100vw);
}
#update h3 {
    background-image: url(../img/h3_update_sp.png);
    width: calc(402/750*100vw);
    height: calc(53/750*100vw);
    background-size: 100% auto;
    top: calc((-110 + 35)/750*100vw)
}

#update .up_text
{
  width: calc(1000/750*100vw);
  height: calc(130/750*100vw);
}

#update .up_text2
{
  width: calc(1000/750*100vw);
  height: calc(610/750*100vw);
}

#update .up_text3
{
  width: calc(1000/750*100vw);
  height: calc(250/750*100vw);
}

#update .gold_line img {
  width: calc(615/750*100vw);
}
#update h4 {
  margin-bottom: calc(17/750*100vw);
}
#update h4 img {
    width: calc(615/750*100vw);
}
#update h5.h5_update1 img,
#update h5.h5_update2 img {
  width: calc(615/750*100vw);
}
#update h5.h5_update3 img {
  width: calc(550/750*100vw);
}
#update .btn-update img {
    width: 100%;
}
#update .addto_text p {
  font-size: calc(22/750*100vw);
}
#update .addto_text {
    margin-bottom: calc(10/750*100vw);
}
#update hr {
    margin: 0 0 calc(50/750*100vw);
}
#update .gold_line {
    margin-bottom:calc(40/750*100vw);
}
#update h5.h5_update1 {
  margin-bottom:calc(28/750*100vw);
}
#update h5.h5_update2,
#update h5.h5_update3 {
  margin-top: 0;
  margin-bottom:calc(49/750*100vw);
}
#update .heading {
font-size: calc(23/750*100vw);
}
}


/************************************************************************
  #game-update
************************************************************************/

#game-update  {
    margin-bottom: calc(150px + 112px);
}

#game-update2  {
  margin-bottom: calc(10px);
}
.bottom_space
{
  margin-bottom: calc(50px);
}

#game-update h2 {
    text-align: center;
}
#game-update h2 img {
    margin-bottom: -200px;
    width: calc(1844px / 2);
    height: auto;
}
#game-update  h3 {
    background-image: url(../img/h3_game-update.png);
    width: calc(1068px /2);
    height: calc(118px / 2);
    left: 0;
    right: 0;
    margin: auto;
    top: calc(-109px + 30px);
}
#game-update h4 { margin-bottom:51px; text-align:center; }
#game-update h4 img { width:calc(1448px / 2); }

#game-update h4.main_story { margin-bottom:56px; text-align:center; }
#game-update h4.main_story img { width:calc(1070px / 2); }


#game-update h5 {  text-align:center; }
#game-update h5 img { width:calc(902px / 2); }

#game-update p {
  font-size: 20px;
  text-align: left
}
#game-update .bottom
{
  margin-bottom: 40px;
}


#game-update .gold_line {
  margin: 41px 0 51px;
}
#game-update .gold_line img {
  width: calc(1624px / 2);
}

#game-update .main-visual-secound + p {
  text-align: left;
  font-family: 游明朝体, "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-weight: bold;
}

#game-update a.btn-game-update img { width:calc(1140px /2); }

#game-update .addto_text {
  margin-bottom: 30px;
  font-size: 20px;
}
#game-update .addto_text p {
    font-family: 游明朝体, "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-size: 20px;
    text-align: left;
    font-weight: bold;
    padding-left: 1em;
    text-indent: -.45em;
}
#game-update .addto_text p::before {
    content: '\025c6';
    margin: 0 5px 0 0;
    color: #b29a3e;
    font-size: 12px;
    display: inline-block;
}

/* ============ smart phone ============ */
@media screen and (max-width:750px){
#game-update {
    margin-bottom: calc((-50 + 65)/750*100vw);
    font-size: calc(22/750*100vw);
}

#game-update2 {
  margin-bottom: calc((-50 + 65)/750*100vw);
  font-size: calc(22/750*100vw);
}

.bottom_space
{
  margin-bottom: calc((-30 + 65)/750*100vw);
}

#game-update h2 img {
    margin-bottom: calc(20/750*100vw);
    width: calc(611/750*100vw);
}
#game-update h3 {
    background-image: url(../img/h3_game-update_sp.png);
    width: calc(446/750*100vw);
    height: calc(53/750*100vw);
    background-size: 100% auto;
    top: calc((-110 + 35)/750*100vw)
}
#game-update h4 img {
  width: calc(615/750*100vw);
}
#game-update h4.main_story img {
  width: calc(575/750*100vw);
}
#game-update h5 img {
  width: calc(400/750*100vw);
}
#game-update .gold_line img {
  width: calc(615/750*100vw);
}
#game-update .gold_line {
  margin: calc(41/750*100vw) 0 calc(51/750*100vw);
}
#game-update .main-visual-secound + p {
font-size: calc(22/750*100vw);
}

#game-update a.btn-game-update img {
    width: 100%;
}

}



/************************************************************************
  #campaign
************************************************************************/
#campaign { margin-bottom:calc(50px + 112px) }

#campaign .contents { width:957px; }

#campaign h2 { text-align:center; }
#campaign h2 img { margin-bottom:40px; width:calc(1184px / 2); height:auto; }

#campaign h3 { background-image:url('../img/h3_campaign.png');
                    width: calc(2000px /2);
                    height: calc(126px / 2);
                    left: 0;
                    right: 0;
                    margin: auto;
                    top: calc(-109px + 30px);
                  }

#campaign h4 { margin-bottom:45px; text-align:center; }
#campaign h4 img { width:calc(1424px / 2); height:auto; }

a.btn-campaign { padding:40px 0 0; display:block; }
a.btn-campaign img { width:calc(1138px /2); }

#campaign .gold_line {
  margin-bottom: 40px;
}
#campaign .gold_line img {
  width: calc(1624px / 2);
}
#campaign .addto_text {
  margin-bottom: 20px;
}
#campaign .addto_text p {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo UI", Meiryo, sans-serif;
    font-size: 22px;
    text-align: left;
    font-weight: bold;
    padding-left: 1em;
    text-indent: -.45em;
}
#campaign .addto_text p::before {
    content: '\025c6';
    margin: 0 5px 0 0;
    color: #b29a3e;
    font-size: 12px;
    display: inline-block;
}


/* ============ smart phone ============ */
@media screen and (max-width:750px){

#campaign { margin-bottom:calc((70 + 65)/750*100vw); }

#campaign .contents { width:auto; }
#campaign h2 { margin:auto; width:calc(401/750*100vw); }
#campaign h2 img {
  width:100%;
margin-bottom: calc(15/750*100vw);}

#campaign h3 {
    background-image: url('../img/h3_campaign_sp.png');
    width: calc(700/750*100vw);
    height: calc(347/750*100vw);
    background-size: 100% auto;
    top: calc((-110 + 35)/750*100vw)
}


#campaign h4 { margin-bottom:calc(40/750*100vw); }
#campaign h4 img { width:calc(607/750*100vw); }

a.btn-campaign { padding:calc(40/750*100vw) 0 0; display:block; }
a.btn-campaign img { width:calc(620/750*100vw); }

#campaign .gold_line {
  margin-bottom:calc(40/750*100vw);
}
#campaign .gold_line img {
  width: calc(615/750*100vw);
}
#campaign .addto_text p {
  font-size: calc(22/750*100vw);
}
#campaign .addto_text {
    margin-bottom: calc(10/750*100vw);
}
#campaign .up_text
{
  width: calc(1000/750*100vw);
  height: calc(60/750*100vw);
}
#campaign .up_text2
{
  width: calc(1000/750*100vw);
  height: calc(610/750*100vw);
}
#campaign .up_text3
{
  width: calc(1000/750*100vw);
  height: calc(400/750*100vw);
}

#campaign .up_text4
{
  width: calc(1000/750*100vw);
  height: calc(260/750*100vw);
}

#campaign .up_text5
{
  width: calc(1000/750*100vw);
  height: calc(300/750*100vw);
}
#campaign .up_text6
{
  width: calc(1000/750*100vw);
  height: calc(460/750*100vw);
}
}

/************************************************************************
  #campaign2
************************************************************************/
#campaign2 { margin-bottom:calc(50px + 112px) }

#campaign2 .contents { width:957px; }

#campaign2 h2 { text-align:center; }
#campaign2 h2 img { margin-bottom:40px; width:calc(1184px / 2); height:auto; }

#campaign2 h3 { background-image:url('../img/h3_campaign2.png');
                    width: calc(2000px /2);
                    height: calc(126px / 2);
                    left: 0;
                    right: 0;
                    margin: auto;
                    top: calc(-109px + 30px);
                  }

#campaign2 h4 { margin-bottom:45px; text-align:center; }
#campaign2 h4 img { width:calc(1424px / 2); height:auto; }

a.btn-campaign { padding:40px 0 0; display:block; }
a.btn-campaign img { width:calc(1138px /2); }

#campaign2 .gold_line {
  margin-bottom: 40px;
}
#campaign2 .gold_line img {
  width: calc(1624px / 2);
}
#campaign2 .addto_text {
  margin-top: -30px;
  margin-bottom: 20px;
}
#campaign2 .addto_text p {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo UI", Meiryo, sans-serif;
    font-size: 22px;
    text-align: left;
    font-weight: bold;
    padding-left: 1em;
    text-indent: -.45em;
}
#campaign2 .addto_text p::before {
    content: '\025c6';
    margin: 0 5px 0 0;
    color: #b29a3e;
    font-size: 12px;
    display: inline-block;
}


/* ============ smart phone ============ */
@media screen and (max-width:750px){

#campaign2 { margin-bottom:calc((70 + 65)/750*100vw); }

#campaign2 .contents { width:auto; }
#campaign2 h2 { margin:auto; width:calc(401/750*100vw); }
#campaign2 h2 img {
  width:100%;
margin-bottom: calc(15/750*100vw);}

#campaign2 h3 {
    background-image: url('../img/h3_campaign2_sp.png');
    width: calc(700/750*100vw);
    height: calc(347/750*100vw);
    background-size: 100% auto;
    top: calc((-105 + 35)/750*100vw)
}


#campaign2 h4 { margin-bottom:calc(40/750*100vw); }
#campaign2 h4 img { width:calc(607/750*100vw); }

a.btn-campaign { padding:calc(40/750*100vw) 0 0; display:block; }
a.btn-campaign img { width:calc(620/750*100vw); }

#campaign2 .gold_line {
  margin-bottom:calc(40/750*100vw);
}
#campaign2 .gold_line img {
  width: calc(615/750*100vw);
}
#campaign2 .addto_text p {
  font-size: calc(22/750*100vw);
}
#campaign2 .addto_text {
    margin-top: calc(-5/750*100vw);
    margin-bottom: calc(10/750*100vw);
}
#campaign2 .up_text
{
  width: calc(1000/750*100vw);
  height: calc(60/750*100vw);
}
#campaign2 .up_text2
{
  width: calc(1000/750*100vw);
  height: calc(610/750*100vw);
}
#campaign2 .up_text3
{
  width: calc(1000/750*100vw);
  height: calc(220/750*100vw);
}

#campaign2 .up_text4
{
  width: calc(1000/750*100vw);
  height: calc(260/750*100vw);
}

#campaign2 .up_text5
{
  width: calc(1000/750*100vw);
  height: calc(300/750*100vw);
}
}

/************************************************************************
  .frame
************************************************************************/
.frame { left: calc(-25px / 2); margin-bottom:110px; padding:0 0 40px; width:975px; background:url('../img/frame.png') repeat-y center top; background-size:100% auto; position:relative; top:112px; z-index:0; }

.frame::before { content:''; width: 975px;px; height:112px; background:url('../img/frame_top.png') no-repeat; background-size:100% auto; display:block; position:absolute; top:-112px; z-index:-1; }
.frame::after { content:''; width: 974px;px; height:85px; background:url('../img/frame_bottom.png') no-repeat; background-size:100% auto; display:block; position:absolute; bottom:-20px; z-index:-1; }

.frame h3 { width:calc(1680px /2); height:calc(120px / 2); background-repeat:no-repeat; background-size:100% auto; font-size:0; position:absolute; top:calc(-112px + 30px); left:67px; }

.frame .box { margin:0 auto; padding:40px 0 0; width:855px; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

.frame { left: inherit; margin:auto auto calc(90/750*100vw); padding:0 0 calc(65/750*100vw); width:calc(726/750*100vw); background-image:url('../img/frame_sp.png'); top:calc(110/750*100vw); }

.frame::before { width:calc(726/750*100vw); height:calc(110/750*100vw); background-image:url('../img/frame_top_sp.png'); top:calc(-110/750*100vw); }
.frame::after { width:calc(726/750*100vw); height:calc(85/750*100vw); background-image:url('../img/frame_bottom_sp.png'); bottom:calc(-20/750*100vw); }

.frame h3 { width:calc(586/750*100vw); height:calc(55/750*100vw); background-size:100% auto; top:calc((-110 + 35)/750*100vw); left:calc(70/750*100vw); }

.frame .box { margin:0 auto; padding:calc(40/750*100vw) 0 0; width:calc(610/750*100vw); }

}

/************************************************************************
  table.info
************************************************************************/
table.info { margin:0 0 50px; width:100%; }
table.info th { padding:0 0 30px; width:240px; vertical-align:top; }
table.info th img { width:100%; }

table.info td { padding:0 0 0 25px; vertical-align:top; font-family:"游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-weight:bold; font-size:24px; }
table.info td p { text-align:left; font-family:"游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; line-height:50px; font-weight:bold; font-size:24px; }
table.info td p small { line-height:calc(32/22); font-weight:bold; font-size:20px; display:inline-block; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){
/* #special table */
table.info { margin-bottom:calc(40/750*100vw); }
table.info th { padding-bottom:calc(30/750*100vw); width:calc(610/750*100vw); display:block; }
table.info td { padding:0 0 calc(50/750*100vw); width:calc(610/750*100vw); display:block; font-size:calc(28/750*100vw); }
table.info tr:last-child td { padding-bottom:0; } 

table.info td p { margin-bottom:calc(15/750*100vw); line-height:calc(28.5/28); font-size:calc(28/750*100vw); }
table.info td p small { line-height:calc(32/24); font-size:calc(24/750*100vw); }
}

/************************************************************************
  #bromide
************************************************************************/

.bromide_type {
  margin-bottom: 38px;
  -ms-justify-content: space-between;
  justify-content: space-between;
  font-family: 游明朝体, "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
.bromide_list {
  width: 100%;
}
.bromide_list:last-child {
  width: 100%;
}
.bromide_list h5 {
  text-align: center;
  margin: 0;
  color:  #fff;
  font-size: 18px;
  padding: 7px 0;
}
.bromide_list h5 span {
  font-size:  12px;
}
.bromide_list ul {
 background: #f0f0e6;
 margin: 0;
 padding: 15px 13px 12px 13px;
 min-height: 117.56px;
}
.bromide_list ul li {
  -ms-justify-content: center;
  justify-content: center;
  font-size: 20px;
  line-height: 1.8;
  white-space: nowrap;
}


.bromide_type  .bromide_picture h5 {
  background: #716950;
}
.bromide_type  .bromide_single h5,
.bromide_type  .bromide_set h5 {
  background: #a89c79;
}
.bromide_type  .bromide_picture .left {
    letter-spacing: -1px;
}

.bromide_type  .bromide_single ul {
  padding: 16px 13px 9px;
}
.bromide_type  .bromide_single li {
  font-size: 24px;
  -ms-flex-align: center;
    align-items: center;
}
.bromide_type  .bromide_single li .right {
  font-size: 17px;
}
.bromide_type  .bromide_single li:first-child {
  border-bottom: 2px dashed #fff;
}
.bromide_type  .bromide_single li span {
  font-weight: bold;
  font-size: 28px;
}

.bromide_type  .bromide_set li .left {
  letter-spacing: -1px;
}
.bromide_type  .bromide_set li span {
  font-size: 11px;
}


@media screen and (max-width: 750px) {

.bromide_type {
  -ms-flex-direction: row;
  flex-direction: row;
  margin-bottom:calc(18/750*100vw);
}
.bromide_list {
    width: 100%;
}
.bromide_list h5 {
  font-size: calc(22/750*100vw);
}
.bromide_list ul {
    padding: 12px 29px 12px 29px;
    min-height: auto;
}
.bromide_list ul li {
  font-size: calc(21.6/750*100vw);
}


.bromide_picture, .bromide_single {
  margin-bottom: 10px
}
.bromide_type .bromide_single ul {
  min-height: auto;
  display: flex;
  -ms-justify-content: center;
  justify-content: center;
  padding: 10px;
}
.bromide_type .bromide_single li {
    display: inline-flex;
    font-size: calc(24/750*100vw);
}
.bromide_type  .bromide_single li:first-child {
  border-bottom: none;
  margin-right: 10px;
}
.bromide_type .bromide_single li .right {
    font-size: calc(17/750*100vw);
}
.bromide_type .bromide_single li span {
  font-size: calc(28/750*100vw);
}
.bromide_type .bromide_single li .right::before {
 content: "/";
 display: inline-block;
 margin: 0 5px;
}
}

/************************************************************************
  ul.mark
************************************************************************/
ul.mark { margin:auto auto 40px; width:auto; }
ul.mark li { line-height:calc(34/20); font-size:18px; }
ul.mark li::before { content:'\025c6'; margin:0 10px 0 0; color:#b29a3e; vertical-align:middle; font-size:12px; display:inline-block; } 

/* ============ smart phone ============ */
@media screen and (max-width:750px){

ul.mark { width:100%; }
ul.mark li { line-height:calc(44/28); font-size:calc(28/750*100vw); }
ul.mark li::before { margin-right:calc(10/750*100vw); line-height:calc(36/22); font-size:calc(12/750*100vw); } 
ul.mark li h3 { line-height:calc(44/28); font-size:calc(28/750*100vw); }

}
/************************************************************************
  ul.note
************************************************************************/
ul.note { margin:auto; width:500px; }
ul.note li { padding-left:1.2em; line-height:calc(34/17); font-size:16px; font-weight:normal; }
ul.note li::before { content:'\203B'; margin:0 0 0 -1.2em; font-size:16px; } 

/* ============ smart phone ============ */
@media screen and (max-width:750px){

ul.note { width:100%; }
ul.note li { line-height:calc(44/24); font-size:calc(24/750*100vw); }
ul.note li::before { line-height:calc(44/24); font-size:calc(24/750*100vw); } 

}
/************************************************************************
  #download
************************************************************************/
#download { padding:25px 0; }
#download .contents { width:940px; display:flex; justify-content:space-between; align-items:center; }

/* #download table */
#download table { text-align:left; font-size:14px; }
#download table th { padding:0 1.5em 5px 0; position:relative; }
#download table th::after { content:'\0FF1A'; margin:0 5px 0 0; vertical-align:top; font-size:14px; display:inline-block; position:absolute; right:0; }
#download table td { padding:0 0 5px 0; }

#download .flex { align-items:center; }
#download .flex img { margin-right:30px; }

#download div ul { display:flex; }
#download div ul li { margin-left:10px; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#download .contents { width:calc(690/750*100vw); flex-direction:column; }

#download .flex { margin-bottom:calc(35/750*100vw); }
#download .flex img { margin-right:calc(45/750*100vw); width:calc(156/750*100vw); }

#download .flex ~ div { margin:0 auto; }

/* #download table */
#download table { font-size:calc(22/750*100vw); }

/* #download div ul */
#download div ul { justify-content:space-between; }
#download div ul li { margin-left:0; width:calc(331/750*100vw); }
#download div ul li img { width:100%; }

}
/************************************************************************
  .pagetop
************************************************************************/
.pagetop { width:104px; position:fixed; bottom:30px; right:55px; display:none; z-index:3; }
.pagetop a { height:100%; display:block; position:relative; z-index:3; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

.pagetop { display:none !important; }

}
/************************************************************************
  footer
************************************************************************/
footer { padding:25px 0 20px; height:auto; background-color:#333333; color:#ffffff; text-align:left; font-size:14px; box-sizing:border-box; }

footer .contents { width:940px; display:flex; justify-content:space-between; align-items:center; }

footer nav ul { margin-bottom:10px; display:flex; }
footer nav ul li { line-height:1; }
footer nav ul li::after { content:'|'; margin:0 0.5em; }
footer nav ul li:last-child::after { display:none; }

footer nav#SNS ul li::after { content:''; margin:0 15px 0 0; }
footer nav#SNS ul li:last-child::after {  margin-right:0; }

footer a { color:#ffffff; }
footer a:hover { color:#ffffff; text-decoration:underline; }

footer p img { margin-bottom:20px; }
p.copyright { line-height:calc(18/12); }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

footer { padding:calc(70/750*100vw) 0 calc(50/750*100vw); font-size:calc(24/750*100vw); }
footer .contents { width:auto; flex-direction:column; }

footer nav ul { margin-bottom:calc(30/750*100vw); flex-direction:column; justify-content:center; }
footer nav ul li { margin-bottom:1em; text-align:center; }
footer nav ul li::after { display:none; }

footer nav#SNS ul { flex-direction:row; }
footer nav#SNS ul li { margin-right:calc(40/750*100vw); }
footer nav#SNS ul li:last-child { margin-right:0; }

p.copyright { margin-bottom:calc(50/750*100vw); text-align:center; }
}
/************************************************************************
  #canvas
************************************************************************/
#canvas { background-color:transparent; position:fixed; z-index:1; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#canvas { display:none; }

}
/************************************************************************
  #nav-drawer
************************************************************************/
#nav-drawer { margin:auto; width:100%; height:auto; text-align:center; position:relative;  }
#nav-drawer a { color:#ffffff; transform:scale(0.95,1); font-weight:normal; letter-spacing:0.1em; }

/* input */
.nav-unshown { display:none; }

#nav-close { display:none; width:calc(17/1200*100vw); height:calc(17/1200*100vw); position:fixed; z-index:100; }

/* チェックが入ったら表示 */
#nav-input:checked ~ #nav-close { display:block; opacity:.5; }


/* #nav-open */
#nav-open { width:99px; height:99px; background:#c39203; position:fixed; top:0; right:0; z-index:100; display:flex; justify-content:center; align-items:center;  }
#nav-open:hover { cursor:pointer; }
#nav-open img { margin:auto; width:34px; height:20px; }

#nav-input:checked ~ #nav-open { width:99px; height:99px; background:#c39203; background-size:100% auto; z-index:10000; /*transition:1s ease-in-out;*/ }

#nav-input:checked ~ #nav-open img { display:none; }
#nav-input:checked ~ #nav-open span { width:25px; height:25px; background:url('../img/btn_close.svg') no-repeat; display:block; }


/* ============ smart phone ============ */
@media (max-width:750px){

#nav-open { width:calc(88/750*100vw); height:calc(88/750*100vw); }
#nav-open img { width:calc(27/750*100vw); height:calc(16/750*100vw); }

#nav-input:checked ~ #nav-open { width:calc(88/750*100vw); height:calc(88/750*100vw); }
#nav-input:checked ~ #nav-open span { width:calc(24/750*100vw); height:calc(24/750*100vw); background-size:100%; }

}
/************************************************************************
  #nav-drawer
************************************************************************/
#nav-drawer { width:100%; }

/************************************************************************
  #nav-content
************************************************************************/
#nav-content { margin:auto; padding:165px 50px 50px; width:100%; height:100vh; background-color:rgba(255,255,255,0.9); position:relative; z-index:9999; letter-spacing:0.2em; position:fixed; top:0; right:0; }

#nav-content { visibility:hidden; opacity:0; transition:.3s ease-in-out; }

#nav-content ul {
  max-width: 520px;
  margin: 0 auto;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-justify-content: space-between;
  justify-content: space-between;
}

#nav-content li {
  margin-bottom:calc(70/1200*100%);
  width: 50%;
}
#nav-content li:nth-child(even){
  padding-left: 3.3em;
}
#nav-content li:last-child {
    color: #8b7306;
    width: 100%;
    text-align: left;
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-weight: bold;
    font-size: 18px;
    margin-top: 50px;
}
#nav-content .nav-official-account img {
    margin-top: 14px;
    width: calc(1040px /2);
}

#nav-content li a { text-decoration:none; /*font-weight:bold;*/ font-size:14px; font-size:1.4rem; }

/* チェックが入ったら表示 */
#nav-input:checked ~ #nav-content { display:block; visibility:visible; opacity:1; transition:all 0.4s ease; }

/* ============ smart phone ============ */
@media (max-width:750px){

#nav-content {
  margin-bottom:calc(30/750*100vw);
  padding: calc(165/750*100vw) 50px 50px;
}

#nav-content ul {
  -ms-flex-direction: column;
  flex-direction: column;
}
#nav-content li,
#nav-content li:last-child {
  margin: auto auto calc(60/750*100vw);
  width: calc(520/750*100vw);
  font-size: calc(26/750*100vw);
}
#nav-content li:nth-child(even) {
    padding-left: 0;
}

#nav-content li.nav-update {
  order: 1;
}
#nav-content li.nav-campaign {
  order: 2;
}
#nav-content li.nav-broadcasting {
  order: 7;
}
#nav-content li.nav-profile-maker {
  order: 3;
}
#nav-content li.nav-art-contest {
  order: 8;
}
#nav-content li.nav-special {
  order: 6;
}
#nav-content li.nav-goods {
  order: 5;
}
#nav-content li.nav-sound {
  order: 4;
}
#nav-content li.nav-official-account {
  order: 9;
}


#nav-content li a { color:#ffffff; font-size:calc(24/750*100vw); }

}
/************************************************************************
  #nav-content
************************************************************************/
#nav-content li { text-align:left; font-size:20px; }

.nav-broadcasting img { width:calc(440px /2); }
.nav-profile-maker img { width:calc(480px /2); }
.nav-art-contest img { width:calc(383px /2); }
.nav-special img { width:calc(223px /2); }
.nav-update img { width:calc(218px /2); }
.nav-campaign img { width:calc(299px /2); }
.nav-goods img { width:calc(199px /2); }
.nav-sound img { width:calc(178px /2); }
.nav-profile-maker img { width:calc(442px /2); }
.nav-official-account img { margin-top:10px; width:calc(800px /2); }

ul#nav-content li.nav-information { margin-bottom:90px; }

/* ============ smart phone ============ */
@media (max-width:750px){

ul#nav-content li { margin:auto auto calc(60/750*100vw); width:calc(520/750*100vw); font-size:calc(26/750*100vw); }


.nav-broadcasting img { width: calc(319/750*100vw);}
.nav-profile-maker img { width: calc(319/750*100vw); }
.nav-art-contest img { width: calc(277/750*100vw); }
.nav-special img { width: calc(162/750*100vw); }
.nav-update img { width: calc(158/750*100vw); }
.nav-campaign img { width: calc(195/750*100vw); }
.nav-goods img { width: calc(141/750*100vw); }
.nav-sound img { width: calc(141/750*100vw); }
.nav-profile-maker img { width: calc(320/750*100vw); }


ul#nav-content li.nav-information { margin-bottom:calc(120/750*100vw); }

#nav-content .nav-official-account img { margin-top:calc(20/750*100vw); width:calc(520/750*100vw); }

}
/************************************************************************
  #loader-bg
************************************************************************/
#loader-bg { width:100%; height:100%; background:#000000; position:fixed; z-index:1000; display:flex; justify-content:center; align-items:center; flex-direction:column; }
#loader { margin:auto; text-align:center; z-index:1000; }
#loader-bg img { margin:0 auto 50px; width:328px; height:auto; }
#loader-bg p { margin:auto auto 10px; width:calc(244px /2); height:calc(31px /2); background:url('../img/now_loading.png') no-repeat; background-size:100% auto; }

#progress-box { width:100%; height:5px; background:#000000; position:relative; border-radius:10px; }
#progress-bar { width:0; height:5px; background:#ffffff; position:absolute; top:0; left:0; border-radius:10px; }