body{
margin:20px;
font: 14px/1.6 "Hiragino Kaku Gothic Pro",Osaka,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",Verdana,Arial,sans-serif;
}

.wrapper
{
    width: 1000px ;
	margin: 0 auto ;	/* 左右に[auto]を指定することで、真ん中に寄る */
	padding: 0 ;		/* 上下左右の余白を0にしておく */
	overflow: hidden ;		/* floatを解除する */
}
.about{
 width:400px;
 margin:0 0;
 padding:15px 20px;
 background:#fff;
 border:solid 2px #5fb3f5;
 border-radius:8px;
float: right ;	
}
.main{
float: left ;	
}


.talk{
position:relative;
margin:0 0 10px 0;

}

#talktable{
 width:425px;
 height:500px;
 background-image:url(bg.png); 
 background-color:#fff;
}
#hukidashi {
width:200px;
height:80px;}



#talk-text{
 position:absolute;
 top:-10px;
 left:0px;
 background-color:white;
 display:inline-block;
 margin:1.5em 15px 1.5em 10px;
 padding:7px 10px;
 min-width:340px;
 max-width:350px;
 color:#333;
 font-size:16px;
 background:#ffffff;
 border-radius:10px;
 text-align:left;
 z-index:1;
 }
#talk-text:before{
 content:"";
 position:absolute;
 top:99%;
 left:50%;
 margin-left:-20px;
 border:5px solid transparent;
 border-left:15px solid transparent;
 border-top:20px solid #ffffff;
}

#talk-text p{
 margin:0;
 padding:0;
}
#baseimg{
position:absolute;
bottom:0px;
left:70px;
}

#talk-img{
position:absolute;
 width:150px;
 height:auto;
top:110px;
left:101px;
z-index:0;
}

input[type="button"]{
 background-image:linear-gradient(0deg, #a7d9f5, #eaf6fd);
 border:1px solid #3c7fb1;
 border-radius:0.3em;
 height:30px;
 font-size:16px;
 padding:0 5px  0 5px;
 margin:0 0 8px 0;
 }
 
select{
 background:#eaf6fd;
 border:1px solid #3c7fb1;
 border-radius:0.3em;
 height:30px;
 font-size:16px;
 margin:0 0 8px 0;
 
 }
 .pc{display:block ; }
 .sp{display:none ; }
 
/* スマホだけに適用するCSS */
@media screen and ( max-width:479px )
{
body{
margin:0px;
}

.talk{
margin:0 0 5px 0;
}

img{
max-width:100%;
height:auto;
}

#talktable{
 width:100%;
 height:370px;
 }
 
 #hukidashi {
width:90%;
height:90px;}

#talk-text{
 top:-2%;
 min-width:250px;
 max-width:280px;
  font-size:13px;

 }
 
#baseimg{
position:absolute;
width:250px;
height:auto;
left:50px;

} 
 
 #talk-img{
 position:absolute;

 top:100px;
left:50px;
z-index:0;
}

.wrapper
	{
		width: auto ;
		padding: 0  ;		/* 左右の余白 */
	}

.main
	{
		
		float: none ;		/* floatを無効する */
	}
 
 .about
	{ margin:10px;
		width: auto ;
		float: none ;		/* floatを無効する */
	}
 .pc{display:none ; }
 .sp{display:block ; }
}