@charset "utf-8";
/* CSS Document */

/* Table of Contents
-----------------------------------------------------------------------------
	1. Mobile
	2. Large Mobile
	3. iPad
	4. large desktop
	5. Other
*/

/* 1. Mobile responsive css 640px
------------------------------------------------------------------------------*/
@media (max-width:640px) {
/*--------- home page ------------*/
.banner-logo{ width: 44%; }

.container-area{ max-width: 320px; }
.layer-1{ top: 0px; width: 100%; }
.side-gun{ top: 273px; width: 45%; }
.title-1{ left: -15px; top: 327px; }
.text-layer .big-title{ font-size: 18px; line-height: 20px; }
.text-layer .small-title{ font-size: 13px; line-height: 16px; }
.text-layer{ padding: 12px 14px; }
.title-2{ right: -15px; top: 409px; left: 0; width: 151px; text-align: right; }
.title-3{ right: -15px; top: 652px; max-width: 150px; text-align: right; }
.title-4{ left: -15px; top: 643px; width: 170px; }
.gun-gallery .gallery-title{ font-size: 15px; line-height: 16px; margin-bottom: 6px; }
.guns-cell{ width: 70px; height: 70px; border: 2px solid #737577; margin-right: 9px;}
.gun-gallery{ left: -19px; bottom: -325px; }
.specification{ left: -15px; top: 1000px; width: 100%; }
.specification .big-title{ margin-bottom: 10px; }
.tank-cell{ margin-top: 340%; }

.gun-tan-section{ padding-top: 383px; }
.wave-cell{ top: 32%; }
.guns-cell figure{ width: 70px; height: 70px; }
.tag-cell{ margin-right: 3%; margin-top: 42%; }

.specification li{ display: block; margin-bottom: 10px; }
.specification li label{ width: 100%; } 
.specification li span{ width: 100%; }
.btm-info-layer{ position: relative; padding-left: 20px; padding-right: 20px; }
.btm-info-layer .top-layer ul li{ font-size: 11px; line-height: 13px; }
.btm-info-layer .mid-layer ul li{ font-size: 11px; line-height: 13px; }

.video-section{ width: 100%; top: 1713px; text-align: center; }
.video-section video{ width: 320px; height: 186px; display: block; margin: 0 auto; }


.title-1:before{ left: -80px; }
.title-2:before{ left: 40px; }
.title-3:before{ left: 40px; }
.title-4:before{ left: -70px; }

}

/* 2. Large Mobile responsive css 640px
------------------------------------------------------------------------------*/
@media (min-width:641px) and (max-width:767px) {
.banner-logo{ width: 44%; }

.container-area{ max-width: 550px; }
.layer-1{ top: -180px; }
.side-gun{ top: 60px; width: 45%; }
.title-1{ left: -15px; top: 236px; }
.text-layer .big-title{ font-size: 18px; line-height: 20px; }
.text-layer .small-title{ font-size: 13px; line-height: 16px; }
.text-layer{ padding: 12px 14px; }
.title-2{ right: -15px; top: 299px; }
.title-3{ right: -15px; top: 466px; max-width: 200px; }
.title-4{ left: -15px; top: 601px; }
.gun-gallery .gallery-title{ font-size: 15px; line-height: 16px; margin-bottom: 6px; }
.guns-cell{ width: 90px; height: 90px; border: 3px solid #737577; margin-right: 15px; }
.gun-gallery{ left: -19px; bottom: -139px; }
.specification{ left: -15px; top: 832px; width: 95%; }
.specification .big-title{ margin-bottom: 10px; }
.tank-cell{ margin-top: 47%; }

.gun-tan-section{ padding-top: 210px; }
.btm-info-layer{ position: relative; padding-left: 20px; padding-right: 20px; }
.btm-info-layer .top-layer ul li{ font-size: 11px; line-height: 13px; }
.btm-info-layer .mid-layer ul li{ font-size: 11px; line-height: 13px; }

.video-section{ width: 220px; top: 1180px; }
.video-section video{ width: 220px; height: 150px; }

.title-1:before{ left: -100px; }
.title-2:before{ left: 40px; }
.title-3:before{ left: 40px; }
.title-4:before{ left: -120px; }

}

/* 3. iPad responsive css 768px to 1023px
------------------------------------------------------------------------------*/
@media (min-width:768px) and (max-width:1023px) {
.banner-logo{ width: 44%; }
.container-area{ max-width: 600px; }
.layer-1{ top: -217px; }
.side-gun{ top: 7px; }
.title-1{ left: -15px; top: 160px; }
.text-layer .big-title{ font-size: 24px; line-height: 26px; }
.text-layer .small-title{ font-size: 15px; line-height: 19px; }
.text-layer{ padding: 12px 14px; }
.title-2{ right: -15px; top: 220px; }
.title-3{ right: -15px; top: 420px; max-width: 250px; }
.title-4{ left: -15px; top: 550px; }
.gun-gallery .gallery-title{ font-size: 15px; line-height: 16px; margin-bottom: 6px; }
.guns-cell{ width: 90px; height: 90px; border: 3px solid #737577; margin-right: 15px; }
.gun-gallery{ left: -19px; bottom: -139px; }
.specification{ left: -15px; top: 800px; width: 95%; }
.specification .big-title{ margin-bottom: 10px; }
.tank-cell{ margin-top: 47%; }
.gun-tan-section{ padding-top: 130px; }
.btm-info-layer{ position: relative; padding-left: 20px; }

.video-section{ width: 250px; top: 1166px; }
.video-section video{ width: 250px; height: 170px; }

}

/* 4. large desktop responsive css 1024px to 1199px
------------------------------------------------------------------------------*/
@media (min-width:1024px) and (max-width:1199px) {	

}