@charset "UTF-8";

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
	
}

/*  Desktop  : 1920px */
@media only screen and ( min-width: 1151px ){
   .anons dl:nth-child(4n+1) {
		clear: left;
		margin-left: 0;
	}
}	

/*  TABLET  : 1024px */
@media only screen and ( max-width: 1150px ){
   .headerBody {
		margin: 28px 15px 0;
		width: auto;
	}
	.homeTop {
		margin:0;
		
		font-size: 21px;
		padding-top: 60px;
	}
	.content {
		width: auto;
		margin: 64px 15px 50px;
	}
	.footerBody {
		width: auto;
		margin: 0 15px 0px;
	}
	.wrapper div {
		margin: 0 15px;
		width: auto;
	}
	
}	

/* TABLET  : 768px */
@media only screen and (max-width: 985px) and (min-width: 788px){
	.anons dl:nth-child(3n+1) {
		clear: left;
		margin-left: 0;
	}
  
}

/*  Phone  : 480px */
@media only screen and (max-width: 787px) and (min-width: 540px){

	.bodyArticle .menu-mobile{
		clear: both;
	}
	.bodyArticle .headerBody h1 {
		font-size: 40px;
		margin: 13px;
	}
	.bodyArticle .headerBody .quote {
		margin: 24px 0 0;
	}
	.anons dl:nth-child(2n+1) {
		clear: left;
		margin-left: 0;
	}
	.homeTop {
		font-size: 21px;
		padding-top: 60px;
	}
	
	.mainMenu{
		display:none;
	}
	.menu-mobile{
		display:block;
	}
	
	.social {
		display: block;
		float: none;
		list-style: outside none none;
		margin: 0 auto;
		padding: 0;
		width: 272px;
	}
	
	.footerBody  .copyring{
		clear: both;
		display: block;
		float: none;
		margin: 4px auto;
		padding-top: 27px;
		width: 168px;
	}
	.footerBody .menu-links {
		float: none;
		margin: 0 auto;
		width: 215px;
	}
}

/* Phone  : 320px */
@media only screen and (max-width: 539px){
	.bodyArticle .headerBody {
		background: none;
	}
	.bodyArticle .menu-mobile{
		clear: both;
	}
	.bodyArticle .headerBody h1 {
		font-size: 30px;
		margin: 13px;
	}
	.bodyArticle .headerBody .quote {
		margin: 24px 0 0;
		font-size:20px
	}
	.homeTop {
		font-size: 18px;
		padding-top: 38px;
	}
	.header, .footer{
		min-width: 300px;
	}
	.content, .wrapper{
		min-width: 270px;
	}
	.wrapper div {
		min-width:270px;
	}
	.mainMenu{
		display:none;
	}
	.menu-mobile{
		display:block;
	}
	
	.anons dt a img{
		width:100%;
		max-width: 100%;
	}
	.anons dl {
		width:auto;
	}
	
	.social {
		display: block;
		float: none;
		list-style: outside none none;
		margin: 0 auto;
		padding: 0;
		width: 272px;
	}
	.footerBody  .copyring{
		clear: both;
		display: block;
		float: none;
		margin: 4px auto;
		padding-top: 27px;
		width: 168px;
	}
	.footerBody .menu-links {
		float: none;
		margin: 0 auto;
		width: 215px;
	}
	.anons dl {
		clear: left;
		margin-left: 0;
	}
}