@media screen and (max-width: 980px) {
	.topBox .waylink { margin-top: 0; }
	#contentMain { margin-top: -20px; }
	#mCenter .Cinfo .topDBtn h3 { margin-right: 20px; }
	#mCenter .Cinfo .topDBtn .serchDate { margin-left: 20px; }
	#mCenter .Cinfo #diary ul li > div { width: 20%; }
	#mCenter .Cinfo #diary ul li .info { width: 79%; }
	#appointment .myDetail { padding: 0 20px 20px; }
	#appointment .myDetail .row { margin-left: 0; margin: 10px; width: calc((100% - 45px)/2); }
	#appointment .myDetail .member { margin: 0 auto; width: 100%; display: block; }
	#mCenter .Cinfo #memberList ul#visitor li { width: 22%; }
}

@media screen and (max-width: 640px) {
	#mCenter .Cinfo .myBox , #mCenter .Cinfo .myPhoto { width: 100%; }
	#mCenter .Cinfo .myPhoto { margin-left: 10px; width: calc(100% - 20px); }
	#message .mssageBox { padding: 10px; }
	#message .mssageBox p.mood { text-align: left; }
	#wishtree ul#wishtreeList li:nth-child(1) .row { left: 30%; }
	#wishtree ul#wishtreeList li:nth-child(3) .row , #wishtree ul#wishtreeList li:nth-child(5) .row { left: 40%; }
	#wishtree ul#wishtreeList li:nth-child(7) .row { left: 45%; }
	#appointment .customer .info .cImg { width: 125px; }
	#appointment #form1 { padding: 20px 10px; }
	#appointment .myDetail { padding: 0 15px 20px; }
	#mCenter .Cinfo #memberList ul#visitor li a.photo:after { padding: 0 10px; }
}

@media screen and (max-width: 480px) {
	#mCenter .Cinfo .topDBtn .serchDate { margin-left: 0; margin: 10px 0; display: block; }
	#mCenter .Cinfo .topDBtn .serchDate input { width: 97%; }
	#mCenter .Cinfo .diaryLink a { margin: 0; padding: 10px 5px; }
	#mCenter .Cinfo #diary ul li .date , #mCenter .Cinfo #diary ul li .info { width: 100%; }
	#mCenter .Cinfo #diary ul li .date b { margin-right: 5px; font-size: 14px; }
	#mCenter .Cinfo #diary ul li .date b span { margin-right: 5px; display: inline-block; vertical-align: initial; }
	#mCenter .Cinfo #messageList ul li .mImg { margin: 0 auto 10px; display: block; }
	#mCenter .Cinfo #messageList ul li .mInfo { margin-left: 0; width: 100%; }
	#wishtree ul#wishtreeList li:nth-child(4) { background-position: 10% 50%; }
	#wishtree ul#wishtreeList li:nth-child(6) { background-position: 100% 50%; }
	#wishtree ul#wishtreeList li:nth-child(8) { background-position: 50%; }
	#wishtree ul#wishtreeList li:nth-child(1) .row { left: 20%; }
	#wishtree ul#wishtreeList li:nth-child(3) .row , #wishtree ul#wishtreeList li:nth-child(5) .row , #wishtree ul#wishtreeList li:nth-child(7) .row { left: 25%; }
	#appointment .customer { background-size: 70px auto; }
	#appointment .customer .info .cImg { width: 95px; }
	#appointment #form1 p.sRow , #appointment #form1 p.right { float: none; width: 100%; }
	#appointment .myDetail { padding: 0 0 20px; }
	#appointment .myDetail .row { margin: 10px 0; width: 100%; }
	#mCenter .Cinfo #memberList ul#visitor { text-align: center; }
	#mCenter .Cinfo #memberList ul#visitor li { width: 40%; }
	#mCenter .Cinfo #memberList ul#visitor li a.photo:after { left: 25%; }
}
	
@media screen and (max-width: 450px) {
	#mCenter .Cinfo .myData .change { width: 310px; left: 5px; }
	#mCenter .Cinfo .myData .change ul li { width: 48%; }
	#message ul li .mssageInfo { width: calc(100% - 85px); }
	#message ul li .mssageInfo p b { display: block; }
	#message ul li .mssageInfo:before , #message ul li .mssageInfo:after { display: none; }
	#wishtree ul#wishtreeList li { width: 100%; }
	#wishtree ul#wishtreeList li:nth-child(1) { background-position: 60% 50%; }
	#wishtree ul#wishtreeList li:nth-child(2) , #wishtree ul#wishtreeList li:nth-child(5) { background-position: 35% 50%; }
	#wishtree ul#wishtreeList li:nth-child(3) , #wishtree ul#wishtreeList li:nth-child(7) { background-position: 45% 50%; }
	#wishtree ul#wishtreeList li:nth-child(4) { background-position: 20% 50%; }
	#wishtree ul#wishtreeList li:nth-child(6) { background-position: 70% 50%; }
	#wishtree ul#wishtreeList li:nth-child(1) .row { left: 35%; }
	#wishtree ul#wishtreeList li:nth-child(2) .row { left: 20%; }
	#wishtree ul#wishtreeList li:nth-child(4) .row { left: 10%; }
	#wishtree ul#wishtreeList li:nth-child(6) .row { left: 26%; }
	#wishtree ul#wishtreeList li:nth-child(8) .row { left: 25%; }
	#appointment .customer .info { margin: 20px 0; width: 100%; display: block; }
	#appointment .customer .info:nth-child(2) { margin-top: 90px; }
	#mCenter .Cinfo #memberList ul#visitor li a.photo:after { left: 18%; }
}