@charset "utf-8";

a {
	outline:none;
}
a:focus{
	outline:none;
}
*{ box-sizing:border-box; margin:0; padding:0; border:0; }
html { -webkit-text-size-adjust: 100%; font-size: 62.5%; font-family: 'Noto Sans JP', sans-serif; font-weight:300; line-height:1.6;}

body, html { min-height: 100% }

body {
	height: 100%;
}




#loader-bg { 
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-image: url("images/loading_bg.jpg"); background-size: cover; background-position: center;
  z-index: 19999;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 100px;
  margin-top: -50px;
  margin-left: -100px;
  text-align: center;
  color:#25bbf0;
  z-index: 20000;
}

.loader { font-size: 0.8em;
  display: inline-block; margin-bottom: 1.5em;}
  
@-webkit-keyframes ball-scale-multiple {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0; }
  5% {
    opacity: 1; }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0; } }

@keyframes ball-scale-multiple {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0; }
  5% {
    opacity: 1; }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0; } }

.ball-scale-multiple {
  position: relative;
  -webkit-transform: translateY(-30px);
          transform: translateY(-30px); }
  .ball-scale-multiple > div:nth-child(2) {
    -webkit-animation-delay: -0.4s;
            animation-delay: -0.4s; }
  .ball-scale-multiple > div:nth-child(3) {
    -webkit-animation-delay: -0.2s;
            animation-delay: -0.2s; }
  .ball-scale-multiple > div {
    background-color: #25bbf0;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    margin: 2px;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
    position: absolute;
    left: -30px;
    top: 0px;
    opacity: 0;
    margin: 0;
    width: 60px;
    height: 60px;
    -webkit-animation: ball-scale-multiple 1s 0s linear infinite;
            animation: ball-scale-multiple 1s 0s linear infinite; }


.topbg { background-color: #fff; background-image: url("img/topbg.jpg"); background-position: top center; background-repeat: repeat-x; background-size: 100% 100%;  }

#mainarea { display: flex; min-width:1000px; }
.leftside { width:320px; min-width:320px; height: auto; padding: 10px; }
.mainv { flex: 1; width: auto; max-width:1200px; min-width:600px; height: auto; position: relative; }
.mainv img { width: 100%; }

@media screen and (max-width: 767px) {
#mainarea { display: block; min-width: inherit; }
.leftside { display: none; }
.mainv {  width: 100%; max-width:1200px; height: auto; position: relative; }
}


img.bg {
  position: relative;
  margin: 0 auto;
  width:100%;
display:block;
}




.mainv ul.bxslider {
        width: 100%; min-width:725px;
        height: auto; min-height:1020px !important;
        list-style:none;
        padding:  0;
        margin: 0;
        display:block;
}
.mainv ul.bxslider li{
        width: 100%;
        height: auto;
        list-style:none;
        padding: 0;
        margin: 0;
        display:block; border:none; pointer-events: none !important;
}
.mainv ul.bxslider li img {
        width: 100%; min-width:725px;
        height: auto; 
}






#right-side { width: 720px; position: absolute; bottom: 35px; right: 0px; border-top: #1cbeff 1px solid; border-bottom: #1cbeff 1px solid; background: #fff; z-index: 300; box-sizing: content-box !important; min-height:30px;  }
.ticker { display: block;
	text-align: left;
	padding: 0px !important;
	width: 100%;
	overflow: hidden; height: 30px; box-sizing: content-box !important;
}
.flol { z-index: 1000; position: absolute; top: 0; left:0;  }
ul.topicsul { list-style:none; width: 100%; position: relative; margin-left: 110px; box-sizing: content-box !important; }
ul.topicsul li { color:#333; width: 100%; display: none; vertical-align: baseline; box-sizing: content-box !important; height: 30px; padding: 1em 0;}
ul.topicsul li a { font-size:1.2em!important;  line-height: 1em; min-height: 3em !important; text-decoration: none; white-space: nowrap; padding: 1em 0; box-sizing: content-box !important; }

.bunner { width: 200px; position: absolute; bottom: 70px; right: 10px; z-index: 300; box-sizing: content-box !important; height:40px; }





#sp-menu { display:block; position: fixed; top:10px; right:15px; background-color: rgba(255,255,255,0.80); border-radius: 50%; width:60px; height:60px; z-index: 500; padding: 14px 10px; }

.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .2s;
  box-sizing: border-box; 
}
.menu-trigger {
  position: relative; 
  width: 40px;
  height: 32px;
}
.menu-trigger span { z-index: 500;
  position: absolute;
  left: 0;
  width: 100%;
  height: 5px;
  background-color: #1cbeff;
  border-radius: 5px;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 14px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}
.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(14px) rotate(-45deg);
  transform: translateY(14px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-14px) rotate(45deg);
  transform: translateY(-14px) rotate(45deg);
}

.mlogo {position: absolute; bottom:15px; right:0; height: auto; width: 60%; z-index: 2000; }
.mlogo img {width:100%; margin: 0; text-align: right; }

#sp-comment {display:none;}




#pc-comment { position: absolute; z-index: 400; bottom:25px; left:20px; clear : both; background: none; width: 300px; padding: 0; display: block; }
#pc-comment img {width:100%;}

@media screen and (min-width: 1050px) {
#pc-comment { bottom:25px;  }
}

.l-logo {margin-bottom: 1.5em;}
.l-logo img { width:100%; }
.l-bnr {margin-bottom:1.5em;}
.l-bnr a {margin:0.3em 0;}
.l-bnr img { width:100%; }

#pc-nenga { position: absolute; z-index: 400; bottom:110px; left:20px; clear : both; background: none; width: 300px; padding: 0; display: block; }
#pc-nenga img {width:100%;}


@media screen and (max-width: 767px) {
#mainv { min-height:0;}
img.bg { display:none; }
.mlogo { display: block; position: absolute; bottom:20px; right:0; }
.mlogo img {}


#sp-comment {display:block; text-align: center; padding: 10px 0;}
#sp-comment img { padding: 5px 0 0; width: 700px; }
#pc-comment {display:none;}
#pc-nenga {display:none;}
	

#right-side { display: none; }

}/*767*/



.opa:hover img { opacity: 0.8; }
.font12{ font-size:12px; }

#wap {
}
div.section {
	margin-top:20px;
	margin-bottom:20px;
	clear: both;
}
ul {
	list-style: none;
}

ul#nav2{
	margin-left: 12px;
}
ul#nav2 li { position: relative;
	margin-left: 0;
	width: 230px;
	height: 25px;
	overflow: hidden;
	margin-bottom: 10px;
}
ul#nav2 li img {
	position: absolute;
	top: 1px;
	height:50px;
}

div#container { margin: 0 auto; width: auto;
	height: auto;
	position: relative;
	padding: 15px;
	min-height: 380px;
}


div#subarea { margin: 0 auto; width: auto;
	height: auto;
	position: relative;
	padding: 15px;
	display: flex; align-items: flex-start;
}

div#subarea .twit_box { width:290px; margin: 0;  border:1px solid #0066cc; padding: 8px; }
div#subarea .news_box { flex: 1; flex-direction: column; }


div#subarea .news_box .infomation { display:block; margin: 0 0 3em; width: 100%;
	position: relative;
	padding: 0 0 0 2em; height: auto;
}

.leftside .infomation { display:block; margin: 0 5px 20px; width: auto;
	position: relative;
	padding: 15px; height: auto; background-color: rgba(255,255,255,0.8); border-radius: 10px;
}

.topics_title {border-bottom:1px solid #25bbf0; padding: 0; line-height: 0;}
.topics { z-index: inherit; position: relative;  background: #1cbeff; padding: 0;  }
ul.spcsul { list-style:none; width: 100%; position: relative; margin: 10px 0; box-sizing: content-box !important; }
ul.spcsul li { font-size:1.2em!important; color:#333; width: 100%; display: block;  box-sizing: content-box !important; height: auto; padding: 0.5em 0; border-bottom: 1px dotted #ccc;}
ul.spcsul li a { font-size:1.2em!important;  line-height: 1.3em; text-decoration: none;  padding: 0.3em 0.2em 0.2em; box-sizing: content-box !important; display: block; }

div#subarea .news_box .bnr_box { display:block; margin: 1em 0 2em; width: 100%;
	position: relative;
	padding: 0 0 0 2em; height: auto; text-align: center;
}


@media screen and (max-width: 767px) {
div#subarea { margin: 0 auto; width: auto;
	height: auto;
	position: relative;
	padding: 15px;
	display: block;
}
div#subarea .twit_box { width: 100%; margin: 0 auto 3em; border:1px solid #0066cc; padding: 8px; }
div#subarea .news_box { width: 100%; }
div#subarea .news_box .infomation { padding: 0 0 0 0; }
div#subarea .news_box .bnr_box { padding: 0 0 0 0; }
}



.twit_w { width:310px; margin: 0 0; height: 360px; position: absolute; top: 17px; left:15px; border:1px solid #0066cc; padding: 5px; }
.bnr_w { margin-left:330px; width: auto; }

div#side_left { position: fixed; z-index: 400; top:0; left:0; clear : both; height: 100%; min-height: 100vh; background: rgba(255,255,255,0.90); width: 100%; display: none; padding:40px 10px;}
ul#nav2 li { width: 368px; height: 40px; margin-bottom: 15px; }
ul#nav2 li img { height:80px; }

	
div#side_left.fin { 
  animation: fadein 1s linear 0s 1 normal;
}
div#side_left.fout { 
  animation: fadeout 1s linear 0s  1 normal;
}
.sponly { display: none !important;}
.pconly { display: block !important;}

#spnews { display: none; }


@media screen and (max-width: 767px) {
div#container { padding: 10px; }
.twit_w { display: none; }
.bnr_w { margin-left:0; width: auto; }
#spnews { display:block; margin: 0 auto 25px; width: auto;
	position: relative;
	padding: 10px; height: auto;
}
.topics { z-index: inherit; position: relative; background: #1cbeff; padding: 0;  }
ul.spcsul { list-style:none; width: 100%; position: relative; margin: 10px 0; box-sizing: content-box !important; }
ul.spcsul li { font-size:2.0em!important; color:#333; width: 100%; display: block;  box-sizing: content-box !important; height: auto; padding: 0.5em 0; border-bottom: 1px dotted #ccc;}
ul.spcsul li a { font-size:1.1em!important;  line-height: 1.3em; text-decoration: none;  padding: 0.3em 0.2em 0.2em; box-sizing: content-box !important; display: block; }

.sponly { display: block !important; }
.pconly { display: none !important; }
	
}/*767*/



@-webkit-keyframes fadein {
	0% {
        display: none;
        opacity: 0;
      }
 
      1% {
        display: block;
        opacity: 0;
      }
 
      100% {
        display: block;
        opacity: 1;
      }
}
@-webkit-keyframes fadeout {
	0%{ opacity:1; }
	100% { opacity:0; }
}

div#side_sns
{
		width:100%;
	margin-top:5px;
	margin-left:5px;
	margin-bottom:00px;

  clear : both;

}

div#side_l
{

width:300px;
float:left;
}

.twt{
	width:350px;
	margin: 0 10px;
}




div#side_r
{
  width:381px;
  float:right;

}

.day926{
	margin-bottom:10px;
	margin-right:10px;
}


div#topics{
	background-image: url(images/ARIA_topics.png);
	background-repeat:no-repeat;
	width:251px;
	height:217px;
	padding-top:8px;
	margin:10px;
	margin-left: 15px;

}
iframe{
	margin-top:10px;
	width:245px;
	height:200px;
	margin-left: 5px;	
	
}

/* フッターの背景 */
div#footer { width: 100%; clear : both; }

ul.aria_br li { display:inline-block; padding:2px; }

div#footer_r {
 width:300px;
  float:right;

}
.footer_text { text-align:center; padding:15px 0; font-size: 1.0em; }
.left{
    text-align: left;
}
.center{
    text-align: center;
}
.right{
    text-align: right;
}




#wrapper.fixed { position: fixed; width: 100%; height: 100%; left: 0; }
#popup { width:100%; height:100%; background-image: url(img/pop_bg.jpg); background-size: cover; position: fixed; z-index: 5000; display: none; background-position: center bottom; box-align: center; }
.popw { width:100%; height:100%; background-color: #fff; z-index: 52; }
#popup ul.popt { display: block; width: 100%; max-width: 1100px; position: relative; height: auto; margin: auto; z-index: 70; top:5%; left:0; bottom:0; right:0;}
#popup ul.popt li.popl { position: absolute; top:0; left:0; width: auto;  height: auto; display: none; z-index: 75; 
}
#popup ul.popt li.popl img { display: block; width: 100%; }	
	

#popup .close { display: block; width: 50px; height:50px; right: 5px; top: 5px; position: absolute; z-index: 50; background-image: url("img/controlx.png"); background-position: 0 0px; cursor: pointer; }
#popup .close:hover { background-position: 0 -50px; }


/* =======================================
	ClearFixElements
======================================= */
.clearfix:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
	overflow: hidden;
}

