@charset "utf-8";

/* container */
#container{
	font-size: 14px;
	color: #7f7fff;
  background: #eff7ff url(../img/portal/portalBG.png);
}
#container.kuku{
	color: #6b3f31;
  background: #ffe5ff url(../kuku/img/common/kukuComBG.png);
}
#container.shura{
  color: #6b3f31;
  background: #f2e5ff url(../shura/img/common/shuraComBG.png);
}
#container.mail{
  color: #6b3f31;
  background-color: transparent;
  background-image: none;
}

/* contents */
.contents{
  max-width: 1000px;
  margin: 0 auto;
}

/* header */
#header{
  text-align: center;
}
#header img{
  margin: 10px auto;
}
.shura #header{
  background: url(../shura/img/common/headerImg.png) repeat-x center top;
}
.shura #header img{
  margin: 20px auto 10px;
}
#hMenu{
  width: 30px; height: 30px;
  background: url(../img/common/hamMenuIcon.png) no-repeat;
  position: fixed; top: 15px; right: 15px;
}
.kuku #hMenu{background-position: -30px 0px;}
.shura #hMenu{background-position: -60px 0px;}
@media(max-width:499px){/* for mobile */
  #hMenu{
    top: 10px; right: 10px;
  }
  #header img{
    max-width: 70%;
    height: auto; 
  }
}

/* pankuzu */
.pankuzu{
  /*background: #ccffcc;*/
}
.pankuzu p{
  padding: 10px;
  text-align: left;
}
@media(max-width:599px){/* for mobile */
  .pankuzu p{
    font-size: 12px;
  }
}
.pankuzu a:link,
.pankuzu a:visited{
	color: #7f7fff;
	text-decoration: underline;
}
.pankuzu a:hover{
	color: #ff7f7f;
	text-decoration: none;
}
.pankuzu a:active{
	color: #7f7fff;
}

/* slider auto */
ul.auto li{
  margin: 20px;
}
ul.auto li div{
  width: 16px; height: 16px;
  background: url(../img/portal/pickup/autoIcon.png) no-repeat 0px 0px;
}
ul.auto li div.stop{
  background-position: 0px -16px;
}

/* movePageTop */
#movePageTop{
	position: fixed;
	right: 40px;
	bottom: -105px;
	z-index: 100;
	opacity: 0;
}
#movePageTop a{
	display: block;
	width: 100px;
	height: 105px;
	background: url(../img/common/goPageTopImgB.png) no-repeat 0px 0px;
}
#movePageTop.shura a{
  background: url(../img/common/goPageTopImgBS.png) no-repeat 0px 0px;
}
#movePageTop a:hover{
	background-position: 0px -105px;
}
#movePageTop.show{
	-webkit-animation: topAni 2s infinite ease-in-out alternate;
	-moz-animation: topAni 2s infinite ease-in-out alternate;
}
@keyframes topAni{
	0%{bottom:30px;}
	100%{bottom:10px;}
}
@-webkit-keyframes topAni{
	0%{bottom:30px;}
	100%{bottom:10px;}
}
@-moz-keyframes topAni{
	0%{bottom:30px;}
	100%{bottom:10px;}
}
@media(max-width:699px){/* for mobile */
  #movePageTop{
    right: 20px;
    bottom: -50px;
  }
  #movePageTop a{
    width: 50px;
    height: 50px;
    background: url(../img/common/goPageTopImg.png) no-repeat 0px 0px;
  }
  #movePageTop a:hover{
    background-position: 0px -50px;
  }
  #movePageTop.kuku a{
    background-position: -50px 0px;
  }
  #movePageTop.kuku a:hover{
    background-position: -50px -50px;
  }
  #movePageTop.shura a{
    background: url(../img/common/goPageTopImg.png) no-repeat -100px 0px;
  }
  #movePageTop.shura a:hover{
    background-position: -100px -50px;
  }
  #movePageTop.show{
    -webkit-animation: none;
    -moz-animation: none;
  }
}

/* footer */
#footer{
	min-height: 100px;
	background: #6b3f31 url(../img/portal/portalFootImg.png) repeat-x -40px top;
  color: #ffffff;
  text-align: center;
}
#footer.kuku{
  min-height: 120px;
  background: #24140e url(../kuku/img/common/footerImg.png) repeat-x center top;
}
#footer.shura{
  min-height: 130px;
  background: #6b3f31 url(../shura/img/common/shuraFoot.png) repeat-x center top;
}
#footer.mail{
  min-height: auto;
  background-color: transparent;
  background-image: none;
  color: #6b3f31;
}
#footer ul.menu{
  padding-top: 140px;
}
#footer ul.menuKuku,
#footer ul.menuShura{
  padding-top: 160px;
}
#footer ul.banner{
  padding-top: 20px;
}
#footer ul li{
  margin: 0px 15px 20px;
}
#footer a:link,
#footer a:visited,
#footer a:active{
	color: #ff7f7f;
	text-decoration: none;
}
#footer a:hover{
	color: #ffe5e5;
	text-decoration: none;
}
#copyRight{
	font-family: Arial, Helvetica, sans-serif;
  padding-bottom: 20px;
}

/* common tag */
p{
  line-height: 2; text-align: center;
}
p.title{
  font-size: 24px;
  font-weight: bold;
  padding: 10px;
}
p.title.small{
  font-size: 18px;
  padding-top: 16px;
}
img{
  max-width: 100%;
  height: auto;
}

/* table */
table{
	border-top: 1px solid #24140e;
	border-left: 1px solid #24140e;
}
table tr{
	border-bottom: 1px solid #24140e;
}
table tr td{
	border-right: 1px solid #24140e;
}

/* common */
.parts{
  width: 100%;
}
.mb{
  margin-bottom: 20px;
}
.ofhid{
  overflow: hidden;
}
.inVisible,
.flexbox.inVisible{
  display:none;
}
.bFont{
	font-weight: bold;
}
.uLine{
	text-decoration: underline;
}
.focus:hover{
  opacity: 0.8;
}
.point{
  cursor: pointer;
}
.blue{
	color: #8484ff; font-weight: bold;
}
.red{
	color: #ee1111; font-weight: bold;
}
.cText{
  text-align: center;
}
.noSupP{
  font-weight: bold;
  font-size: 12px;
  padding-top: 10px;
}

/* commonBox */
.commonBox{
  /*background: #dddddd;*/
  box-sizing: border-box;
}
.commonBox div.box{
  margin: 10px 50px 30px;
  background: #ffffff;
  border: solid 2px #ccccff;
}
.commonBox div.box.kuku{
  margin-bottom: 0px;
  border: solid 2px #ffcccc;
}
@media(max-width:767px){/* for mobile */
  .commonBox div.box{
    margin: 10px 20px 30px;
  }
}

/* tmp */
.tmp div.box{
  margin-top: 30px;
}

/* siteInfo */
#siteInfo .box{
  max-width: 600px;
  margin: 0px auto 30px;
  padding: 20px;
  font-size: 12px;
}
@media(max-width:767px){/* for mobile */
  #siteInfo .box{
    max-width: none;
    margin: 0px 20px 30px;
  }
}
#siteInfo p{
  text-align: left;
}
#siteInfo p.msg{
  margin-bottom: 12px;
}

/* flexbox */
.flexbox{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

/* todo */
li.adviS{
  display: none;
}

/* for mobile */
@media(max-width:600px){
  
}
