@charset "utf-8";
/* CSS Document */
@import url("fonts.css");

/* content */
.content { margin: 0; padding: 80px 0; width: 100%; position: relative; }
.content h1 { font-family: 'tenagabold', Arial, sans-serif; font-size: 60px; line-height: 50px; text-transform: uppercase; color: #f44336; }
.content h2 { margin: 5px 0 0 0; font-family: 'tenagabold', Arial, sans-serif; font-size: 26px; text-transform: uppercase; color: #f44336; }
.c_row { margin: 50px auto 0 auto; padding: 0; width: 1000px; position: relative; text-align: left; }
.c_last_row { margin: 0 auto; padding: 0; width: 1000px; position: relative; }
.c_last_row .m_ani_img { display: none; }
.al { float: right; }
.top_space { margin-top: 120px; }
.item_info { margin: 0; padding: 0 70px 0 0; width: 500px; }
.left_space { padding: 0 0 0 70px; } 
.item_info h3 { font-family: 'tenagabold', Arial, sans-serif; font-size: 26px; line-height: 30px; color: #4d4d4d; text-transform: uppercase; }
.item_info p { margin: 20px 0 0 0; font-family: 'tenaga', Arial, sans-serif; font-size: 18px; line-height: 32px; color: #4d4d4d; }
.item_info a { margin: 30px 0 0 0; padding: 15px 0; width: 160px; color: #fff; font-family: 'tenagabold', Arial, sans-serif; font-size: 16px; text-align: center; -webkit-border-radius: 0px 20px 0px 20px; -moz-border-radius: 0px 20px 0px 20px; border-radius: 0px 20px 0px 20px; background-color: #f44336; text-transform: uppercase; display: block; }
.item_info a:hover { color: #fff; background-color: #005da9; } 
.item_img { margin: 0; padding: 0; position: relative; background: center center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-border-radius: 0px 40px 0px 40px; -moz-border-radius: 0px 40px 0px 40px; border-radius: 0px 40px 0px 40px; width: 500px; height: 450px; }
.m_item_img { margin: 0; padding: 0; position: relative; background: center center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; -webkit-border-radius: 0px 20px 0px 20px; -moz-border-radius: 0px 20px 0px 20px; border-radius: 0px 20px 0px 20px; background-size: cover; display: none; }

/* only for safari and chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	#wrapper { /*padding-top: 20px;*/ padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); } 
}

/* only for IE10 or above */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}

@media only screen and (min-width: 1024px) and (max-width: 1170px) {
	.content { padding: 20px 20px 80px 20px; width: auto; }
	.c_row { margin: 40px 20px 0 20px; width: auto; }
	.top_space { margin-top: 60px; }
	.item_info { margin: 0; padding: 0 40px 0 0; width: 470px; }
	.left_space { padding: 0 0 0 40px; } 
	.item_img { width: 470px; }
}

@media only screen and (min-width: 991px) and (max-width: 1023px) {
	/* content */
	.content { padding: 20px 20px 80px 20px; width: auto; }	
	.content h1 { font-size: 40px; line-height: 40px; }
	.c_row { margin: 20px auto 0 auto; width: 100%; }
	.c_last_row { margin: 40px auto 0 auto; padding: 0 0 80px 0; width: 100%; }
	.al { float: none; }	
	.top_space { margin-top: 40px; }
	.item_info { margin: 10px auto 0 auto; padding: 0; }
	.left_space { padding: 0; } 
	.item_img { display: none; }
	.m_item_img { margin: 0 auto; width: 500px; height: 450px; display: block; }		
}

@media only screen and (min-width: 768px) and (max-width: 990px) {
	/* content */
	.content { padding: 20px 20px 80px 20px; width: auto; }	
	.content h1 { font-size: 40px; line-height: 40px; }
	.c_row { margin: 20px auto 0 auto; width: 100%; }
	.c_last_row { margin: 40px auto 0 auto; padding: 0 0 80px 0; width: 100%; }
	.al { float: none; }
	.top_space { margin-top: 40px; }
	.item_info { margin: 10px auto 0 auto; padding: 0; }
	.left_space { padding: 0; } 
	.item_img { display: none; }
	.m_item_img { margin: 0 auto; width: 500px; height: 450px; display: block; }		
}

@media only screen and (min-width: 641px) and (max-width: 767px) {	
	/* content */
	.content { padding: 20px 20px 80px 20px; width: auto; }	
	.content h1 { font-size: 40px; line-height: 40px; }
	.c_row { margin: 20px auto 0 auto; width: 100%; }
	.c_last_row { margin: 40px auto 0 auto; padding: 0 0 80px 0; width: 100%; }
	.c_last_row .m_ani_img { display: block; width: 100%; height: auto; }
	.al { float: none; }
	.spriteanim_10 { display: none; }	
	.top_space { margin-top: 40px; }
	.item_info { margin: 10px auto 0 auto; padding: 0; }
	.left_space { padding: 0; } 
	.item_img { display: none; }
	.m_item_img { margin: 0 auto; width: 500px; height: 260px; display: block; }	
}

/* Smartphones (other smartphones portrait) */
@media only screen and (min-width: 481px) and (max-width: 640px) {
	/* content */
	.content { padding: 20px 20px 80px 20px; width: auto; }
	.content h1 { font-size: 40px; line-height: 40px; }
	.c_row { margin: 20px auto 0 auto; width: 100%; }
	.c_last_row { margin: 40px auto 0 auto; padding: 0 0 80px 0; width: 100%; }
	.c_last_row .m_ani_img { display: block; width: 100%; height: auto; }
	.al { float: none; }
	.spriteanim_10 { display: none; }	
	.top_space { margin-top: 40px; }
	.item_info { margin: 10px 0 0 0; padding: 0; width: 100%; }
	.left_space { padding: 0; } 
	.item_img { display: none; }
	.m_item_img { width: 100%; height: 260px; display: block; }	
}

/* Smartphones (Landscape) */
@media only screen and (min-width: 321px) and (max-width: 480px) {
	/* content */
	.content { padding: 20px 20px 80px 20px; width: auto; }
	.content h1 { font-size: 30px; line-height: 35px; }
	.content h2 { font-size: 20px; line-height: 20px; }
	.c_row { margin: 20px auto 0 auto; width: 100%; }
	.c_last_row { margin: 40px auto 0 auto; padding: 0 0 80px 0; width: 100%; }
	.c_last_row .m_ani_img { display: block; width: 100%; height: auto; }
	.al { float: none; }
	.spriteanim_10 { display: none; }	
	.top_space { margin-top: 40px; }
	.item_info { margin: 10px 0 0 0; padding: 0; width: 100%; }
	.left_space { padding: 0; } 
	.item_info h3 { font-size: 24px; line-height: 30px; }
	.item_info p {font-size: 16px; line-height: 26px; }
	.item_img { display: none; }
	.m_item_img { width: 100%; height: 240px; display: block; }	
}

/* Smartphones (portrait) */
@media only screen and (max-width : 320px) {
	/* content */
	.content { padding: 20px 20px 80px 20px; width: auto; }
	.content h1 { font-size: 30px; line-height: 35px; }
	.content h2 { font-size: 20px; line-height: 20px; }
	.c_row { margin: 20px auto 0 auto; width: 100%; }
	.c_last_row { margin: 40px auto 0 auto; padding: 0 0 80px 0; width: 100%; }
	.c_last_row .m_ani_img { display: block; width: 100%; height: auto; }
	.al { float: none; }
	.spriteanim_10 { display: none; }
	.top_space { margin-top: 40px; }
	.item_info { margin: 10px 0 0 0; padding: 0; width: 100%; }
	.left_space { padding: 0; } 
	.item_info h3 { font-size: 24px; line-height: 30px; }
	.item_info p { margin: 10px 0 0 0; font-size: 16px; line-height: 26px; }
	.item_img { display: none; }
	.m_item_img { width: 100%; height: 240px; display: block; }
}