/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    .order-bg{
        left: -250px;
    }
	.send-btn{
		padding: 7px 30px;
	}
	.why-item img{
		height: 45px;
	}
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
	.online-form-box .section-title,
	.form-ok .section-title{
		max-width: 585px;
	}
	.form-icon{
		right: 20px;
	}
	.ok{right: 50px;}
    .order-block p{
        max-width: none;
    }
    .why .flex{
        flex-flow: row wrap;
    }
    .why .flex .why-item{
        width: 100%;
    }
    .why-item p{
        margin-right: 25px;
    }
    .opacity{
        display: none!important;
    }
    .send-btn{
        margin: 20px auto 18px;
        padding: 30px 35px;
    }
    .form-phone{
        padding: 5px 0;
    }
    .not-list{
        margin-bottom: 25px;
    }
    .order-bg{
        left: 0;
        width: 100%;
        height: auto;
    }
	.order-btn{
		margin-bottom: 0;
	}
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	h1 {font-size: 46px;}
	.online-form-box .section-title{
		max-width: 520px;
	}
	.form-phone{
		font-size: 18px;
	}
    .form-ok .section-title {
	    font-size: 34px;
	    max-width: 400px;
    }
	.why-item img {
		top: 30px;
		right: 30px;
		height: 35px;
	}
	[type="checkbox"]+label{
		line-height: 16px;
	}
}

@media only screen and (max-width : 600px) {
	html{
		line-height: 1.2;
	}
	.logo{
		max-width: 110px;
		margin: 14px 0;
	}
	.logo img{
		max-width: 100%;
	}
	.phone{
		font-size: 18px;
		margin-top: 0;
	}
	.index-btn{
		padding: 3px 5px;
	}
	.small-btn{
		max-width: 60px;
		font-size: 10px;
	}
	.online-form-box, .form-ok{
		padding: 25px 20px;
	}
	.form-icon, .ok{
		width: 35px;
		height: 40px;
	}
	.ok{
		top: 25px;
	}
	.form-icon{
		top: 25px;
	}
	form p{
		margin-bottom: 0;
	}
	.online-form-box .sel-time li{
		margin-bottom: 0;
	}
    ._text-box ul,
    .time,
    .not-list li,
    .warning,
    p, label,
    .dropdown-content li>a,
    .dropdown-content li>span,
    .select-wrapper input.select-dropdown,
    .test-list-table li,
    .info-panel,
    .form-ok span,
    label,
    [type="checkbox"]+label{
	    font-size: 12px;
    }
    h1{
	    font-size: 23px;
	    margin: 15px 0;
    }
    h2{
	    font-size: 20px;
    }
    h3{
	    font-size: 15px;
    }
    .order-content h3{
	    margin: 0 0 1rem;
    }
	.form-ok span{
		margin-bottom: 25px;
	}
	input.form-field,
	.select-wrapper input.select-dropdown{
		height: 2rem;
		margin: 8px 0 10px 0;
		font-size: 12px;
	}
	.select-wrapper input.select-dropdown{
		font-size: 10px;
		padding-left: 5px;
	}
	.select-wrapper span.caret{
		font-size: 9px;
		right: 5px;
	}
	.send-btn.btn{
		font-size: 18px;
		padding: 15px 30px;
	}
	.form-phone{
		font-size: 11px;
		background-size: 30px 30px
	}
	.after-form{
		padding: 15px 20px;
	}
	.form-phone li{
		padding-left: 40px;
	}
	.test-list-table li{
		padding: 6px 0;
	}
	.btn {
		font-size: 12px;
		line-height: 15px;
		padding: 10px 20px;
	}
    .more-btn{
	    margin-top: 20px;
    }
	.order-btn img{
		width: 20px;
	}

	.works-time{
		padding: 15px 0;
	}
	.works-time .image img{
		width: 55px;
		margin-right: 20px;
	}
	.not-list li:before{
		width: 13px;
		height: 13px;
		background-size: 13px;
	}
	.not-list li{
		padding-left: 23px;
	}
	.warning{
		background-size: 16px;
		padding-left: 26px;
		/*background-position: 0 5px;*/
	}
	.works-time .content h2 {
		margin-bottom: 5px;
	}
	.section-title{
		margin: 20px 0;
	}
	.why{
		margin-bottom: 0;
	}
	.why-item {
		padding: 14px 8% 14px 14px;
		margin-bottom: 20px;
		min-height: inherit;
	}
	.why-item img {
		top: 14px;
		right: 14px;
		height: 27px;
	}
	.not-list{
		margin-bottom: 15px;
	}
	.specification{
		margin-bottom: 25px;
	}
	.info-panel{
		padding: 15px 20px;
		margin-bottom: 25px;
	}
	.info-panel ul li:first-child{
		margin-bottom: 10px;
	}
	.close-btn {
		right: 10px;
		top: 10px;
		width: 15px;
		height: 15px;
	}
	.form-ok .section-title{
		font-size: 20px;
	}
	.online-form-box form{
		margin-top: 15px;
	}
	.order-block p{
		margin-bottom: 10px;
	}
    .test-list .section-title{
	    padding-right: 25px;
    }
	.online-form-box span.error {
		left: 20px;
		top: 30px;
	}
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	.form-ok .section-title{
		max-width: 295px;
	}
	.ok{
		right: 30px;
	}
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}

/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .container{
        width: 95%;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 601px) {
    .container{
        width: 95%;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 993px) {
    .container{
        width: 970px;
    }
}

 /* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .container{
        width: 1170px;
    }
}