/*------ ### スマートフォンレイアウトCSS ### -------------------------------*/

/*-- web全枠の指定 --*/ 


#top  {
     height: 0;
     }


#header {width: auto;
            position: relative;
            } 


/*-- DolphinBrain Top logo  -----------------------------------*/
#header h1    {
               width: 100%;
               float:right;
               margin:5px 18% 0 auto;
              }

#header img    {
               width: 45%;
               margin: 6% auto 0 41%;
               }

#header  p    {
              font-size: 10px; 
              float: left;
              position: relative;
              margin: 0;
              padding: 6px 0 0 31%;
              }


/*-- navi  ----------------------------------------------------*/

#nav         { 
              top: 80px;
              }


#nav  li a   {width: auto;
              padding: 10px 15px 10px 10px;
			  /*(上)(右)(下)(左)*/
			  } 
			  

/*-- ### TOPコンテンツ ###---------------------------------------*/ 			 				 
#content      {      
               margin-top: 38%;
               margin-left: auto;
               margin-right: auto;
               margin-bottom: 0%;
               } 

#content img   {
               width: 60%;
               } 



/*-- ### フッター ### -------------------------------------------*/			
			
#footer    { 
    		 background-color: rgba(25, 25, 25, 0.9);
             height:20%;
			 padding:0 0 0 12px;
			 /*(上)(右)(下)(左)*/
			 box-sizing: border-box;
			 -webkit-box-sizing: border-box;
			 -moz-box-sizing: border-box;
			 }

/* 社名 */
#footer p	{
             margin: 12px 0 0;
	         }
			 /*(上)(左右)(下)*/	

#footer small	{
         margin-bottom: 24px;
         } 

			 
/* SNSアイコンメニュー*/
				 
#iconmenu	    {
                 margin-right: 10px;
                 }	
				 
#iconmenu ul	{ 
                 margin-bottom:none;
	             }				 			 
			
#iconmenu img	{width: 30px;
                 height:30px;
				 margin-top: 0; 
				 padding: 15px 5px 0;
				 }


/* footer メニュー */									
#submenu ul	{
             font-size: 12px;
             margin: 0 0 18px;
	         padding: 0;
	         }

/* WEBカウンター */	
.style2  { width:30%; /*※幅を指定する必要あり */
	       display : table-cell;
		   word-wrap:break-word;
		   overflow-wrap : break-word;
		   text-align: right;
	       margin-bottom: 20px;
		   margin-right: 10px;
         }


/* コピーライト */		 
#footer .copy {
          margin-bottom: 5px;
           padding-left: 0;
              }
		 		 
/*--Page 2~ ## contents TOP title 共通--------------------------- */				

#title      {width: auto; 
                margin: 90px 0 0px;
				background-color:rgba(20, 20, 50, 0);
			    padding: 0 15px 0px; 
			} /* (上)　(左右)　(下)*/

#title  h3   {
                font-size: 20px;
                color: rgba(70, 210, 240, 0.8);
			    border-bottom: solid 1px rgba(70, 210, 240, 0.8);
			    line-height: 1.5;
                }


/*-- Page 2 ##about plofile ------------------------------------- */
							
#profile     {
                width: 80%;
                margin: 15px auto 135px;
				border-left: solid 1px rgba(250, 250, 250, 0.9); 
				background-color:rgba(10, 10, 30, 0.6);
			    padding: 10px 20px 10px;
             }


#profile  h2    {        
                font-size: 15px;
                margin-bottom: 10px;
                }

#profile  h3    {
                font-size: 9px;
				color:rgba(220, 220, 220, 1);
				line-height: 0.8;
                margin-top: 10px;
                 }

#profile  h5    {
                margin-top: 10px;
                line-height: 1.8;
                }

#profile  p    {font-size:12px;
				 color:rgba(250, 250, 250, 1);
				 line-height: 1.8;}
				 

#profile  img   { width:50%;
                   height:50%;
				   float:none; 
				   clear:left;
				   margin-top: 15px;
                  }


/*-- Page 3~ ## WORKS -------------------------------------------- */

/*--  WORKS Coming Soon page <スマホ用> --*/					
#ComingSoon    {
                width: auto;
                margin: 3% 5% 5%;
			    padding: 10px 30px 20px; 
			    } /* (上)　(左右)　(下)*/

#ComingSoon  h3   {
                 font-size:24px;
    			 line-height: 2.0;
                  }	


#ComingSoon  p   {
                 width: 100%;
                 text-align: left;
                 font-size: 13px;
                 margin: 0;
                 padding: 0px 5px;
     			 line-height: 1.5;
                 }


#oldsite        {
                 margin-top: 0;
                 margin-bottom: 10px;
                 }

#oldsite  p       {
                  text-align: center;
                  }



/* ---- portfolio -------------------------  */

#contentsbox   {  
              margin-top: 5%;
              margin-bottom: 36%; 
              }

#contentsbox h2 {
                 text-align: left;
                 margin-top: 10px;
                 margin-left: 15px;
                 font-size: 28px;
                 color: rgb(170, 170, 180);
				 line-height: 2.0;
                 }

#contentsbox h3 {width: 32%;
                 text-align: justify;
                 font-size: 19px;
                 margin-left: 14px;
                 margin-bottom: 10px;
				 line-height: 1.3;
                 }

#contentsbox h4 {width: 96.5%;
                 font-size: 18px;
                 margin-top: 10px;
                 margin-bottom: 10px;
				 line-height: 1.5;
                 }

#contentsbox p { 
				 line-height: 1.2;
                 }



.post {
       width: 35%;
       margin: 10px 16px;
       clear: both;    
       }



.icon img {
       width: 47.5%;
      }





/* ----page4 ### CONTACT フォーム枠 <スマホ用> -------------------------*/

#contact      {
              width: 85%;
              margin: 18px auto 25%;
              background-color:rgba(0, 0, 0, 0.3);
              }
							
#contact  p    {
                font-size: 13px;
                margin: 10px 5px;
                line-height: 1.8;
               }



#contact  .caution  {
                     margin:8px 0  0  8px;
				        }					

.tbl-layout {margin: 3px;
            }

/* Q-title */ 
.tbl-layout dt {
                font-size:13px;
                color:#5dd;
                width: 170px;
                padding: 10px 0px 8px 0px;
               }  /*(上)(右)(下)(左)*/

/*input*/
.tdl-layout dd {width: 162px;
                font-size: 12px;
				padding: 10px 0px 20px 0px; 
                border-bottom: 1px solid #099;
               }        /*(上)(右)(下)(左)*/

/*入力枠*/  
.tbl-layout .w300{
                  font-size: 12px;
                  width: 94%;
                  height: 20px;
				  margin-left: 0px;
                  }

/*詳細内容枠*/ 
.tbl-layout dd .textarea {font-size: 12px;
                         width: 95%;
						 height: 36px;
						 margin-left: 0px;
                         }
						 
/*選択項目枠*/						  
.tbl-layout .select { 
                    font-size: 13px;
 　　　　　　　       width: 50%;
                    padding: 2px;
 　　　　　　　　      height: 20px;
                    margin-left: 0px;
 　　　　　　　　      }

.btn       {
          margin-right:0px;
　　　     text-align: left;
          padding: 20px 0px 10px 20px; 
           }


input[type="submit"]	{color: #eee;
                         border-radius: 2px;
	                     background: #066;
	                     }
						 
input[type="reset"]	    {color: #333;
                         border-radius: 2px;
	                     background: #088;
	                     }	


/* ### finish page CSS ### */

#content8      {width: 80%;
				margin: 5% auto auto;
			    padding: 10px 25px;
                }
				
#content8 p    {
				 margin-left:auto;
				 margin-right:auto;
                 margin-bottom: 10px;
				 line-height: 1.8;
                }


/*--▲▲▲ all content ▲▲▲-------------------------------------------------------*/