
.lastArea { overflow: hidden; clear: both; }
.lastPhoto { overflow: hidden; }
.lastP1 { position: absolute; bottom: 0; width: 60%; margin-left: -8vw; }
.lastText { font-size: 5.2vw; color: #333; margin-top: 6vw;   }
.lastContactTitle { font-size: 4vw; color: #333; margin-top: 8vw; margin-left: 45%;  }
.lastContact { padding: 2vw 2vw 1.5vw 2vw; background-color:#bfeea3; color:#017807; overflow: hidden; float: left; 
	margin-left: 45%; font-size: 3.8vw; }
.lastContact:hover { background-color: #3ace01; color: #000; }
.lastContactTel { padding: 2vw 2vw 1.5vw 2vw; color:#000; overflow: hidden; float: left; margin-top: 1.5vw;  margin-left: 45%; }
.lastLine { width: 8vw; height: 8vw; margin-right: 1.8vw; }
.lastTel { width: 8vw; height: 8vw; margin-right: 1.8vw; }
.lastLogo { position: absolute; bottom: 4vw; width: 52%; right: 4vw; opacity: 0.5; }

/* Credit */
.creditArea { overflow: hidden; clear: both; }
.creditPhoto { overflow: hidden; }
.creditP1 { position: absolute; bottom: 0; width: 65%; right: 2vw; }
.creditText { font-size: 5.8vw; color: #333; margin-top: 6vw; line-height: 1.3;   }
.creditContactTitle { font-size: 4vw; color: #333; margin-top: 8vw; margin-left: 0; margin-bottom: 1vw;  }
.creditContact { padding: 2vw 3vw 1.5vw 3vw; background-color:#bfeea3; color:#017807; overflow: hidden; float: left; 
	margin-left: 0; font-size: 4.5vw; clear: both; }
.creditContact:hover { background-color: #3ace01; color: #000; }
.creditContactTel { padding: 2vw 2vw 1.5vw 3vw; color:#000; overflow: hidden; float: left; margin-top: 1.5vw;  margin-left: 0; clear: both; font-size: 3.5vw; font-size: 4.2vw; }
.creditLine { width: 8vw; height: 8vw; margin-right: 1.8vw; }
.creditTel { width: 8vw; height: 8vw; margin-right: 2.5vw; vertical-align: -2.5vw; }
.creditLogo { position: absolute; bottom: 4vw; width: 52%; right: 4vw; opacity: 0.5; }

.howtoArea {  }
.howtoContactTitle { color: #000; font-size: 4vw; padding-left: 5vw; margin-top: 10vw;  }
.howtoContact { font-size: 3.5vw; color: #000; margin-top: 2vw; font-weight: 500; }
.howtoContact:hover { color: #006600;  }
.howtoContactTel { font-size: 3.5vw; color: #000; margin-top: 2vw; }
.howtoLine { width: 8vw; height: 8vw; margin-right: 3vw; padding-left: 5vw; }
.howtoTel { width: 8vw; height: 8vw; margin-right: 3vw; padding-left: 5vw; }


/* ความกว้าง ไม่ต่ำกว่า */ /* มือถือรุ่นเก่า จอสั้นๆ */
/* @media screen and ( min-aspect-ratio:0.6 ) and ( max-width: 400px ) */
@media screen and ( min-device-aspect-ratio:1/2 ) and ( max-width: 500px )
{ 
	.lastP1 { width: 48%; }
	
	/* Credit */
	.creditP1 { width: 50%; }
	
	.howtoArea {  }
	.howtoContactTitle { font-size: 3vw; padding-left: 5vw; margin-top: 5vw;  }
	.howtoContact { font-size: 3vw; margin-top: 1vw; }
	.howtoContactTel { font-size: 2.8vw; margin-top: 1vw; }
	.howtoLine { width: 6vw; height: 6vw; margin-right: 2vw; padding-left: 5vw; }
	.howtoTel { width: 6vw; height: 6vw; margin-right: 2vw; padding-left: 5vw; }
	
}

/* ============= Tablet แนวตั้ง ============= */
@media screen and ( min-aspect-ratio:768/1024 )
{
	.lastText { font-size: 3.5vw; margin-left: 45%; }
	.lastP1 { width: 48%; margin-left: -7.5vw; }
	.lastLogo { display: none; }
	.lastContact { font-size: 3vw; }
	.lastContactTel { font-size: 3.5vw; font-weight: 500; }
	.lastLine { width: 6vw; height: 6vw; }
	.lastTel { width: 6vw; height: 6vw; }
	
	/* Credit */
	.creditText { font-size: 4vw; }
	.creditP1 { width: 50%;  }
	.creditLogo { }
	.creditContact { font-size: 2.8vw; padding: 1.2vw 3vw 1vw 2vw; }
	.creditContactTel { font-size: 2.8vw; padding: 1.2vw 3vw 1vw 2vw; }
	.creditLine { width: 5vw; height: 5vw; vertical-align: -1.5vw; }
	.creditTel { width: 5vw; height: 5vw; vertical-align: -1.5vw; margin-right: 2vw; }
}

/* ============= มือถือจอ Flip จัตุรัส ============= */
@media screen and ( min-aspect-ratio:1/1 )
{
	
	.lastText { font-size: 3vw; margin-left: 40%; margin-right: 2%; margin-top: 4vw; }
	.lastP1 { width: 45%; margin-left: -7.8vw; }
	.lastLogo { display: none; }
	.lastContactTitle { margin-left: 40%; font-size: 2vw; margin-top: 4vw; }
	.lastContact { font-size: 2vw; padding: 1vw 2vw 1vw 1vw; margin-left: 40%; }
	.lastContactTel { font-size: 2.4vw; padding: 1vw 2vw 1vw 1vw; font-weight: 500; margin-left: 40%; margin-top: 0.3vw; }
	.lastLine { width: 4vw; height: 4vw; }
	.lastTel { width: 4vw; height: 4vw; }
	
	/* Credit */
	.creditText { font-size: 3vw; }
	.creditP1 { width: 45%; }
	.creditLogo { }
	.creditContactTitle { font-size: 2.5vw; }
	.creditContact { font-size: 2.5vw; padding: 1vw 2vw 1vw 2vw; }
	.creditContactTel { font-size: 2.5vw; padding: 1vw 2vw 1vw 2vw;  }
	.creditLine { }
	.creditTel { }
	
	.howtoArea {  }
	.howtoPhoto { width: 80%; padding-bottom: 2vw; border-bottom: 1px dashed #999; }
	.howtoContactTitle { font-size: 2.5vw; padding-left: 4vw; margin-top: 3vw;  }
	.howtoContact { font-size: 1.5vw; margin-top: 1vw; overflow: hidden; float: left; margin-right: 1vw; }
	.howtoContactTel { font-size: 1.5vw; margin-top: 1vw; }
	.howtoLine { width: 3.5vw; height: 3.5vw; margin-right: 1.2vw; padding-left: 4vw; }
	.howtoTel { width: 3.5vw; height: 3.5vw; margin-right: 1.2vw; padding-left: 4vw; }
	
}


/* ============= Teblet + iPad แนวนอน และจอ 4:3 พวก Surface & Macbook ============= */
/* @media screen and ( min-aspect-ratio:1024/768 ) */
@media screen and ( min-aspect-ratio:4/3 )
{	
	.lastText { font-size: 1.3vw; margin-top: 1.5vw; }
	.lastP1 { width: 36%; margin-left: -3.2vw; }
	.lastLogo { display: none; }
	.lastContactTitle { font-size: 1.2vw; margin-top: 1vw; }
	.lastContact { font-size: 1vw; padding: 0.6vw 0.8vw 0.4vw 0.8vw; float: left; margin-right: 1vw; }
	.lastContactTel { font-size: 1vw; padding: 0.6vw 0.8vw 0.4vw 0.8vw; float: left; margin-left: auto; margin-top: -0.1vw; }
	.lastLine { width: 1.5vw; height: 1.5vw; margin-right:  0.5vw; }
	.lastTel { width: 1.5vw; height: 1.5vw; margin-right:  0.5vw; margin-top: 0vw; }
	
	/* Credit */
	.creditText { font-size: 2vw; margin-top: 3vw; width: 50%; }
	.creditP1 { width: 40%; }
	.creditLogo { }
	.creditContactTitle { font-size: 1.5vw; margin-top: 3.5vw; margin-bottom: 0.5vw; }
	.creditContact { font-size: 1.2vw; padding: 0.5vw 1vw 0.5vw 1vw; clear: none; margin-right: 1.5vw; }
	.creditContactTel { font-size: 1.6vw; padding: 0.5vw 1vw 0.5vw 1vw; clear: none; margin-top: auto; }
	.creditLine { width: 3.2vw; height: 3.2vw; vertical-align: -1vw; margin-right: 1vw; }
	.creditTel { width: 3.2vw; height: 3.2vw; vertical-align: -1vw; margin-right: 1vw; }
	
	.howtoArea {  }
	.howtoPhoto { width: 65%; }
	.howtoContactTitle { font-size: 2vw; padding-left: 3vw; margin-top: 2vw;  }
	.howtoContact { font-size: 1.3vw; margin-top: 1vw; overflow: hidden; float: left; margin-right: 1vw; }
	.howtoContactTel { font-size: 1.3vw; margin-top: 1vw; }
	.howtoLine { width: 3.5vw; height: 3.5vw; margin-right: 1.2vw; padding-left: 2.9vw; }
	.howtoTel { width: 3.5vw; height: 3.5vw; margin-right: 1.2vw; padding-left: 2.9vw; }
	
}


/* ============= Notebook ============= */
@media screen and ( min-aspect-ratio:2/1)
{
	
	.lastText { font-size: 1.2vw; margin-top: 1.5vw; }
	.lastP1 { width: 40%; margin-left: -3.2vw; }
	.lastLogo { display: none; }
	.lastContactTitle { font-size: 1.2vw; margin-top: 1vw; }
	.lastContact { font-size: 0.8vw; padding: 0.6vw 0.8vw 0.4vw 0.8vw; float: left; margin-right: 1vw; }
	.lastContactTel { font-size: 1vw; padding: 0.6vw 0.8vw 0.4vw 0.8vw; float: left; margin-left: auto; margin-top: -0.1vw; }
	.lastLine { width: 1.5vw; height: 1.5vw; margin-right:  0.5vw; }
	.lastTel { width: 1.5vw; height: 1.5vw; margin-right:  0.5vw; margin-top: 0vw; }
	
	/* Credit */
	.creditText { font-size: 1.5vw; margin-top: 1vw; width: 50%; }
	.creditP1 { width: 45%; }
	.creditLogo { }
	.creditContactTitle { font-size: 1vw; margin-top: 2vw; margin-bottom: 0.5vw; }
	.creditContact { font-size: 1vw; padding: 0.3vw 1vw 0.3vw 1vw; clear: both; }
	.creditContactTel { font-size: 1vw; padding: 0.3vw 1vw 0.3vw 1vw; margin-top: 0.5vw; clear: both; }
	.creditLine { width: 2.5vw; height: 2.5vw; vertical-align: -0.9vw; margin-right: 0.8vw; }
	.creditTel { width: 2.5vw; height: 2.5vw; vertical-align: -0.9vw; margin-right: 0.8vw; }
	
	.howtoArea { position: relative;  }
	.howtoPhoto { width: 50%; border-bottom: none; margin-right: 6vw; overflow: hidden; float: left; margin-top: 0; }
	.howtoContactTitle { font-size: 1.2vw; font-weight: 800; padding-left: 0; margin-top: 18vw; overflow: hidden; float: left; }
	.howtoContact { font-size: 1.3vw; margin-top: 1vw; overflow: hidden; float: left; }
	.howtoContactTel { font-size: 1.3vw; margin-top: 1vw; overflow: hidden; float: left; }
	.howtoLine { width: 3vw; height: 3vw; margin-right: 1.2vw; padding-left: 0; }
	.howtoTel { width: 3vw; height: 3vw; margin-right: 1.2vw; padding-left: 0; }
	
}


/* ============= Full HD ============= */
@media screen and ( min-aspect-ratio:2/1 ) and (min-width: 1600px)
{
.lastP1 { width: 38%; margin-left: -3vw; }
.lastText { font-size: 1.2vw; }
.lastLogo { display: none; }
	.lastContactTitle { font-size: 1vw; margin-top: 2.5vw; }
	
/* Credit */	
.creditP1 { width: 42%; }
.creditText { font-size: 1.5vw; margin-top: 2vw; }
.creditLogo { }
}