@charset"utf-8";
/*=========================================================================*/
/*                             　　　共通役物　　 　　                              */
/*=========================================================================*/
.bottom_specer{
clear:both;
padding-bottom:100px;
}

.dot_spece{
 width:100%;
 height:10px;
 margin-bottom:10px;
 border-bottom:1px dotted #333333;
}

#a_t_1 {
 width:90%;
 height:auto;
 border:1px solid #333333;
 border-collapse:collapse;
 margin:0px auto 10px auto;
 line-height:1.3em;
 font-size:90%;
 text-align:left;
 }
#a_t_1 td{border:1px solid #333333;padding:6px;vertical-align:top;}
#a_t_1 th{border:1px solid #333333;padding:6px;vertical-align:top;}
#a_t_1 tr:nth-child(odd)  td{
 background: rgba(201,202,202,0.6);
 color:#333333;
 }
#a_t_1 tr:nth-child(even) td{
 background: rgba(255,255,255,0.6);
 color:#333333;
 }
#a_t_1 .w1{width:100px;}
#a_t_1 .f_l_i{width:100px;float:left;margin-right:10px;}
#a_t_1 a{color:#333333;}
#a_t_1 a:hover{color:#009943;text-decoration:none;}

/*ページャーのコマ*/
.peg_com_1{width:32px;height:32px;line-height:32px;text-align:center;
           border:1px solid #595757;float:left;margin-right:6px;}
.peg_com_1 a{background-color:#72c3a0;display:block;
            color:#ffffff;}
.peg_com_1 a:hover{background-color:#b8ceaf;
            display:block;color:#ffffff;}

/*=========================================================================*/
/*　　　　　　　　　　　　　　　　　　　　　　   　　　　　各ページ指定部　　　　　　　　　　　　　　　　　  　 　　　　　　　　　　　　*/
/*=========================================================================*/
/* ---------------------------> top */
#top{
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }
 
/* ---------------------------> photo */
#photo{
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }
 
/* ---------------------------> copy */
#copy{
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }
 
/* ---------------------------> design */
#design{
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }

/* ---------------------------> web */
#web{
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }
 
/* ---------------------------> api */
#application{
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }

/* ---------------------------> aki */
#about {
 display:none;
 max-width:960px;
 width:100%;
 clear:both;
 position:relative;
 top:0px;
 overflow:hidden;
 }

/* ---------------------------> movie */
#movie {
 display:none;
}
.m_list_box{
 width:48%;
 height:110px;
 padding:6px 0px;
 border-bottom:1px dotted #008cd6;
 overflow:hidden;
 float:left;
 margin-left:2%;
 line-height:1.3em;
}
.movie_i{
 width:160px;
 height:90px;
 float:left;
 margin:0px 10px 10px 0px;
 }
 
.douga{
 width:800px;
 height:536px;
 margin:0px 0px 20px 80px;
}

/*=========================================================================*/
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　 　　パーツID指定部　　　　　　　　　　　　　　　　　　　     　　　　　　　　　*/
/*=========================================================================*/
#container{
 max-width:960px;
 width:100%;
 height:auto;
 overflow:hidden;
 margin:0px auto;
}

#container2{
 max-width:960px;
 width:100%;
 height:auto;
 overflow:hidden;
 margin:20px auto;
}

header{
 background-image:url(../images/hed_bak_01.png);
 width:100%;
 height:150px;
 background-repeat:no-repeat;
 background-size:100%;
}

#hed_btn{
 width:960px;
 height:100px;
}

.cat_but {
 width:320px;
 height:320px;
 float:left;
 }

.copy_box{
 width:318px;
 height:318px;
 float:left;
 line-height:1.5em;
 text-align:left;
 border:1px solid #231815;
 }
 
 .gray_box{
 width:319px;
 height:319px;
 float:left;
 line-height:1.5em;
 text-align:center;
 font-size:80%;
 line-height:1.4em;
 background-color:#eeefef;
 border-right:1px dotted #231815;
 border-bottom:1px dotted #231815;
 }
 
 /* ---------------------------> アニメーションメニュー */
 menu{
 width:auto;
 height:auto;
 overflow:hidden;
 /*z-index:1;*/
 float:right;
 position:fixed;
 top:60px;
 right:0px;
 }
 menu .bot_01{
 float:right;
 }
menu .menu1{
 clear:both;
 list-style-type:none;
 width:auto;
 height:auto;
 margin:0px;
 padding:80px;
 position:fixed;
 top:60px;
 right:-80px;
 opacity: 0;
}
menu .menu1 li a{
 width:120px;
 height:30px;
 text-align:left;
 padding-left:10px;
 line-height:30px;
 display:inline-block;
 font-size:80%;
 color:#005B43;
 font-weight:bold;
 background: rgba(190,223,194,0.9);
}
menu .menu1 li a:hover{
 color:#231815;
 background: rgba(255,255,255,0.9);
 transition: all 0.8s ease-in-out;
}
menu:hover .menu1{
  opacity: 1;
  transition: opacity 0.5s 0s ease-in-out;
 }
 
 /* ---------------------------> アニメーションボタン */
.div_cat_but{
 width:320px;
 height:320px;
 float:left;/*visible*/
 overflow:hidden;
 text-align:left;
 }

.info {
  width:320px;
  height:320px;
  position:relative;
  top:-320px;
  left:0px;
  z-index:1;
   opacity: 0;
   transition: opacity 0.3s 0s ease-in-out;
}

.div_cat_but:hover .mask {
  opacity: 1;
  background: rgba(0,0,0,0.5);
}

.info:hover  {
  opacity:1;
  transition-delay: 0.1s;
}
 
#bottom_specer{
 clear:both;
 width:100%;
 height:120px;
}

footer{
 width:100%;
 height:auto;
 position:fixed;
 bottom:0px;
 color:#ffffff;
 background-color:#231815;
 padding:10px 0px;
 font-size:80%;
 line-height:1.3em;
 z-index:20;
}

#login_form{
 display:none;
}
/* =========================================================================*/
/*                               全体指定部               　　                  */
/* =========================================================================*/

body{
 background-image:url(../images/pge_bak_02.jpg);
 background-repeat:no-repeat;
 background-size:100%;
}
.smafo{display:none;}
.pc{display:block;}