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

/*------------ form ------------*/
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
.reminder {
    text-align: center;
    font-size: 15px;
    color: #fff;
    position: relative;
    margin-bottom: 10px;
}

.reminder b {
    color: #e60012;
}


.qty-box {
    position: relative;
    display: inline-block;
    width: 70px;
    max-width: none;
    padding: 0 22px;
    box-sizing: border-box;
    border: 1px solid #D1B694;
}
.qty-box .form-control {
    position: relative;
    text-align: center;
    height: 22px;
    line-height: 22px;
    color: #777;
    background: #fff;
    border: 0;
    margin: 0;
    padding: 0 5px;
    z-index: 1;
    border-radius: 0;
}
.qty-box .form-control:focus {
    color: #777;
    background: #fff;
}
.qty-box .btn1 {
    width: 22px;
    height: 22px;
    line-height: 22px;
    font-size: 19px;
    color: #fff;
    position: absolute !important;
    z-index: 0;
    top: 0;
    background: #D1B694;
}
.qty-box .btn1:hover {
    color: #fff;
    background: #7B502F;
    border:1px solid #7B502F;
}
.qty-box .add {
    left: 0;
}
.qty-box .less {
    right: 0;
}

.form-control {
    display: block;
	color:#643a1c;
    width: 100%;
    height: 28px;
    line-height: 28px;
    padding: 0 10px;
    border: 1px solid #D1B694;
    background: #fff;
    border-radius: 0;
    box-sizing: border-box;
    margin-bottom: 6px;
}
.form-control:focus {
    outline: none;
    border-color: #772C2F;
}
textarea.form-control {
    padding: 8px 10px;
    line-height: 1.4;
    resize: vertical;
}
.static-control {
    line-height: inherit;
    color: #197292;
    font-weight: bold;
    font-size: 13px;
    margin: 0;
    padding: 0 5px;
}
.form-title {
    color: #197292;
    font-family: 'Lily Script One', cursive;
    font-size: 50px;
    text-align: center;
    line-height: 1.2;
}
.form-wrap {
    max-width: 1000px;
    margin: 20px auto 0 auto;
    background: rgba(255, 255, 255, 19);
	box-shadow:3px 3px 0px rgba(20%,20%,20%,0);
	border:solid #90c31f;
	border-width:3px 0;
}
.form-wrap:after {
    content: ' ';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 15px 0 15px;
    border-color: #90c31f transparent transparent transparent;
    display: block;
    margin-bottom: -2.2%;
    right: 0;
    margin-left: 45%;
}
.form-wrap:before {
    content: ' ';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 10px 15px;
    border-color: transparent transparent #90c31f transparent;
    display: block;
    margin-top: -2.2%;
    right: 0;
    margin-left: 45%;
}
.form-wrap .btn-box {
    padding: 15px 15px 45px;
	text-align:center;
}
.form-box {
    max-width: 1050px;
    margin: 0 10px;
    padding: 30px;
}
.form-box .row {
    margin: 0 -24px;
}
.form-box .col {
    float: left;
    width: 50%;
    padding: 0 24px;
}
.form-box .required {
    position: relative;
}
.form-box .required:before {
    content: '*';
	color:#F00;
    display: inline-block;
    vertical-align: middle;
    background: url('../images/icons.png') 0px -140px no-repeat;
    width: 20px;
    height: 20px;
    margin: 0 0 4px 4px;
}
.input-group {
    position: relative;
	width:100%;
	display:inline-block;
    border-collapse: separate;
}
.form-box .form-group {
    padding: 2px 0;
    line-height: 36px;
}
.form-box .control-label {
    display: block;
    font-size: 14px;
    color: #222;
    line-height: inherit;
    padding-left: 5px;
}
.form-box .control-labelw {
    display: block;
    font-size: 14px;
    color: #222;
    float: left;
    width: 120px;
    text-align: left;
    line-height: inherit;
    clear: left;
}

.form-box .control-box {
    position: relative;
}
.form-box .control-boxw {
    position: relative;
    margin-left: 145px;
	color: #734f32;
}
.form-box .control-boxw span {
	color: #eb6100;
}
.form-box .control-boxw b {
	font-style:italic;
	color: #eb6100;
}
.form-box .control-box label {
    display: inline-block;
    line-height: inherit;
    margin: 0 10px 6px 5px;
}
.form-box .control-box2 {
    position: relative;
    width: 830px;
}
.form-box .control-boxw2 {
    position: relative;
    margin-left: 125px;
    padding: 8px 20px 8px 0;
    width: 50%;
}
.form-box .captcha .form-control {
    display: inline-block;
    width: 46%;
    max-width: 280px;
}
.form-box .captcha a {
    display: inline-block;
    color: #bbb;
    font-size: 20px;
    line-height: inherit;
    margin-left: 5px;
    margin-bottom: 6px;
    transition: all .3s ease;
}
.form-box .captcha a:hover {
    color: #FF732F;
}
.form-box .captcha a .icon.refresh {
    width: 30px;
    height: 30px;
    background-position: -270px -32px;
    margin-right: 5px;
    display: inline-block;
    vertical-align: middle;
    transition: transform .3s;
}
.form-box .captcha a:hover .icon.refresh {
    background-position: -300px -32px;
    transform: rotate(270deg);
}
.form-box .name .control-box {
    position: relative;
}
.form-box .name .radio-box {
    line-height: 36px;
    position: absolute;
    right: 0;
    bottom: 100%;
}
.form-box .name .radio-box label {
    display: inline-block;
    margin-bottom: 0;
}
.form-box .name2 .control-box {
    padding-right: 150px;
}
.form-box .name2 .radio-box {
    line-height: 36px;
    position: absolute;
    right: 0;
    bottom: 0;
}
.form-box .name2 .radio-box label {
    margin-bottom: 0;
}
.form-box .name3 .control-box {
    padding-right: 150px;
}
.form-box .name3 .radio-box {
    line-height: 36px;
    position: absolute;
    right: 0;
    bottom: 0;
}
.form-box .name3 .radio-box label {
    margin-bottom: 0;
}
.form-box .name4 .control-boxw2 {
    padding-right: 150px;
    max-width: 360px;
}
.form-box .name4 .radio-boxw2 {
    line-height: 36px;
    position: absolute;
    right: 0;
    bottom: 6px;
}
.form-box .name4 .radio-box label {
    margin-bottom: 0;
}
.form-box .tips {
    line-height: 3;
    margin-bottom: 6px;
    color: #337938;
    font-size: 13px;
    letter-spacing: 0px;
    padding: 0 5px;
}
.form-box.type2 .tips {
    min-height: 0;
}

.form-box .input-group {
    margin: 0 -3px;
}
.form-box .input-group:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: ' ';
    clear: both;
    height: 0;
}
.form-box .input-group .input-box {
    float: left;
    width: 50%;
    padding: 0 3px;
    box-sizing: border-box;
}
.form-box .input-group .input-box2 {
    float: left;
    width: 650px;
    padding: 0 3px;
    box-sizing: border-box;
}
.form-box .input-group .form-control {
    display: inline-block;
}
.form-box .name .control-box {
    position: relative;
}
.form-box .name .radio-box {
    line-height: 36px;
    position: absolute;
    right: 0;
    bottom: 100%;
}
.form-box .name .radio-box label {
    display: inline-block;
    margin-bottom: 0;
}

.form-box .address .input-box:last-child {
    width: 100%;
}
.form-box .address2 .input-box {
    width: 22%;
}
.form-box .address2 .input-box:last-child {
    width: 56%;
}

.form-box .send .input-box:first-child {
    width: 22%;
}
.form-box .send .input-box {
    width: 78%;
}
.form-box .send .input-box:last-child {
    width: 78%;
}



.form-radio,
.form-checkbox {
    display: inline-block;
    position: relative;
}
.form-radio input[type=radio],
.form-checkbox input[type=checkbox] {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0!important;
    visibility: hidden;
    outline: 0;
    z-index: 3;
    width: 17px;
    height: 17px;
}
.form-radio:before,
.form-checkbox:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    background: 50% 0 / 100% auto no-repeat;
    width: 16px;
    height: 16px;
    margin: 0 0 4px;
}
.form-radio:before {
    background-image: url('../images/form_radio.png');
}
.form-checkbox:before {
    background-image: url('../images/form_checkbox.png');
}
.form-radio.checked:before,
.form-checkbox.checked:before {
    background-position: 0 100%;
}

.success-wrap {
    border: 1px dashed #E8E8E8;
	text-align:left;
	max-width:500px;
	margin:0 auto;
    padding: 2% 15px;
}
.has-side .success-wrap {
    padding: 6% 15px 7%;
}
.success-box {
    text-align:left;
    line-height: 2;
}
.success-txt {
    color: #fefefe;
	font-size:15px;
}
.success-txt b{
    color: #f8b551;
}
.success-msg {
    max-width: 500px;
    border-bottom: 1px dashed #ccc;
    color: #267997;
    font-size: 24px;
    font-weight: bold;
    padding: 5px 0;
    line-height: 1.5;
    margin: 0 auto 20px;
}

.success-msg .icon {
    width: 32px;
    height: 32px;
    margin: 0 6px 7px 0;
}
.success-msg .icon.check {
    background-position: -192px 0;
}
.success-msg .icon.user {
    background-position: -224px 0;
}
.success-msg .icon.mail {
    background-position: -256px 0;
}
.success-msg .icon.file {
    background-position: -288px 0;
}
.success-msg .icon.lock {
    background-position: -320px 0;
}
.success-msg .icon.user-white {
    background-position: -352px 0;
}
.success-txt strong {
    display: inline-block;
    margin-bottom: 10px;
    font-size: 22px;
}
.success-txt a {
    text-decoration: underline;
    color: #F2856C;
}
.success-txt a:hover {
    text-decoration: none;
}

.btn.simple {
    background: #999;
    max-width: 250px;
    width: 100%;
    height: 35px;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 35px;
    border-radius: 0;
    position: relative;
    margin: 0 8px 10px;
}
.btn.simple:hover {
    background: #367d39;
}
.btn.simple.bg2 {
    background: url('../images/check_btn.png') no-repeat;
    width: 122px;
    height: 36px;
    line-height: 34px;
}
.btn.simple.bg2:hover {
    background: url('../images/check_btn.png') no-repeat;
    background-position: 0px -36px;
    width: 122px;
    height: 36px;
     line-height: 34px;
}

/*------------ / form ------------*/


@media screen and (max-width: 1480px) {  
    .form-box .control-labelw
     {
     float: none;
     width: auto;
     text-align: left;
    }
    
    .form-box .control-boxw{
      margin-left: 0;
      width: auto;
    }
	.form-wrap:after {
       margin-bottom: -2.8%;
    }
    .form-wrap:before {
       margin-top: -3%;
    }

    
}


@media screen and (max-width: 1300px) {  
    .form-box .control-labelw
     {
     float: none;
     width: auto;
     text-align: left;
    }
    
    .form-box .control-boxw{
      margin-left: 0;
      width: auto;
    }
	.form-wrap:after {
       margin-bottom: -3.2%;
    }
    .form-wrap:before {
       margin-top: -3.2%;
    }

    
}

@media screen and (max-width: 1200px) {  
    
	.form-wrap:after {
       margin-bottom: -3.4%;
    }
    .form-wrap:before {
       margin-top: -3.4%;
    }

    
}

@media screen and (max-width: 1000px) {  
    .form-box .control-labelw
     {
     float: none;
     width: auto;
     text-align: left;
    }
    
    .form-box .control-boxw{
      margin-left: 0;
      width: auto;
    }
	.form-wrap:after {
       margin-bottom: -2%;
    }
    .form-wrap:before {
       margin-top: -2.0%;
    }

    
}