@charset "utf-8";
/* CSS Document */
.ls-mail-box{ background: url("../images/mail_bodybg.jpg") 0 0 repeat-x; padding: 21px 0 30px;}
.ls-mail-container{border-radius: 20px; background: #fff; padding: 30px;}
/*标题*/
.ls-mail-title{color: #C50001;}
.ls-mail-title h1{ height: 40px; background: url("../images/mail-titbg.png") center bottom no-repeat; line-height: 40px; text-align: center; font-size: 24px; font-weight: bold;}
.ls-mail-date{ margin-top: -3px; padding: 0 3px; text-align:right; line-height:0;}
.ls-mail-date span{display: inline-block; padding-left: 32px; background: url("../images/mail-date.png") 0 center no-repeat; line-height: 24px; font-size: 18px;}


/*概要*/
.ls-mail-notes{border-radius: 10px; border: 1px #f7ad9a dashed; background: #FFFAF5; padding:20px; font-size: 16px; line-height: 1.875; margin-top: 10px; text-align: center;}
.ls-mail-notes p{ text-indent: 2em;}
.ls-mail-notes .tit{font-weight: bold; color: #b00; font-size: 18px; padding: 0 0 5px; text-indent: 0;}
.ls-mail-noteinfo{ overflow: hidden; height: 156px; text-align: left; transition: 0.4s all;}
.ls-mail-noteinfo.active{height: auto; padding-bottom: 10px;}
.ls-mail-sbtn{ margin: 4px auto 0; display: inline-block; vertical-align: top; *vertical-align: middle; line-height: 22px; font-size: 16px; color: #000; padding-right: 16px; position: relative; cursor: pointer;}
.ls-mail-sbtn i{ display: block; position: absolute; right: 0; top: 50%; margin-top: -5px; width: 12px; height: 11px; background: url("../images/mail_arrow.png") 0 0 no-repeat;}
.ls-mail-sbtn:hover{ color: #d00;}
.ls-mail-sbtn:hover i{ background-position: right 0;}
.ls-btn-eretract i{background-position: 0 bottom;}
.ls-btn-eretract:hover i{background-position: right bottom;}

/*选项*/
.ls-mail-items li{ width: 530px; border-bottom: 1px dashed #D8D8D8; padding: 32px 0; float: left;}
.ls-mail-items li.num2,.ls-mail-items li.num4,.ls-mail-items li.num6,.ls-mail-items li.num8{float: right;}
.ls-mail-items li .ico{ width: 88px; height: 88px; float: left; background: url("../images/mail-ico.png") 0 0 no-repeat;}
.ls-mail-items li.num2 .ico{background-position: 0 -88px;}
.ls-mail-items li.num3 .ico{background-position: 0 -176px;}
.ls-mail-items li.num4 .ico{background-position: 0 -264px;}
.ls-mail-items li.num5 .ico{background-position: 0 -352px;}
.ls-mail-items li .infobox{ margin-left: 121px; padding: 3px 74px 0 0; height: 88px; position: relative;}
.ls-mail-items li .infobox .title{ line-height: 46px; font-size: 24px; font-weight: bold;}
.ls-mail-items li .infobox .info{ line-height: 20px; font-size: 18px; color: #888;}
.ls-mail-input{ position: absolute; display: block; top: 46px; width: 28px; height: 28px; border: 1px #cbcbcb solid; border-radius: 50%; right: 0; cursor: pointer;}
.ls-mail-input.selected{ background: #dfaf58 url("../images/mail-selected.png") center center no-repeat !important; border-color: #dfaf58;}
/*提交表单*/
.ls-mail-message{ background: #fffaf5; margin-top: 28px; padding: 35px 30px 30px;}
.ls-mail-message li{ padding-bottom: 25px;}
.ls-mail-message li p{float: left;}
.ls-mail-message li .tit{ font-size: 16px; padding-right: 5px; text-align: right; line-height: 46px; width: 357px;}
.ls-mail-message li .input{ line-height: 0; font-size: 0;}
.ls-mail-message li .input input{vertical-align: middle; padding: 0 10px; font-size: 16px; height: 44px; line-height: 44px; border: 1px solid #DCDCDC; width: 433px; background: #FFFFFF;}
.ls-mail-message li .input input:focus{border-color: #f0a207; outline: none; box-shadow: 0 0 5px rgba(240, 162, 7, 0.62);}
.ls-mail-message li .yzm input{width: 224px;}
.ls-mail-message li .imgcode{ cursor: pointer; height: 46px; width: auto; margin-left: 23px;}
.ls-mail-message li.btn_group{text-align: center; padding-bottom: 0; line-height: 0; font-size: 0;}
.ls-mail-message li.btn_group input{ vertical-align: middle; border-radius: 8px; line-height: 44px; border: 1px #d6d6d6 solid; font-size: 18px; background: #d6d6d6; padding: 0 40px; min-width: 28px; margin: 0 12px; transition: 0.4s all; outline-color: #d6d6d6;}
.ls-mail-message li.btn_group .btn-submit{ background: #f0a207; border-color: #f0a207; outline-color: #f0a207; color: #fff;}
.ls-mail-message li.btn_group input:focus{background: #c1c1c1; border-color: #c1c1c1; outline-color: #c1c1c1;}
.ls-mail-message li.btn_group .btn-submit:focus{background: #e87303; border-color: #e87303; outline-color: #e87303;}
/*订阅/退订成功*/
.ls-mail-subscribe{ padding: 132px 0 119px; text-align: center;}
.ls-mail-subscribefont{ padding: 236px 0 87px; font-size: 24px; line-height: 1.83; text-align: center; background: center 0 no-repeat; background-image: url("../images/mail-subscribe.png") !important;}
.ls-mail-unsubscribe .ls-mail-subscribefont{background-image: url("../images/mail-unsubscribe.png") !important;}
.ls-mail-goback{ line-height: 2.17; display: inline-block; color: #fff; padding: 0 25px; background: #C50001; border-radius: 8px; font-size: 24px;}
@media (min-width: 992px) and (max-width: 1199px){
.ls-mail-items li{width: 446px;}
.ls-mail-items li .infobox{padding-right: 54px;}
.ls-mail-message li .tit{width: 257px;}
}
@media(max-width: 991px){
.ls-mail-box{background-size: auto 100%; background-position: center bottom; padding: 10px 0 20px;}
.ls-mail-container{padding: 20px;}
.ls-mail-items li{width: auto; float: none !important;}
.ls-mail-items li .infobox{padding-right: 54px;}
.ls-mail-message li .tit{width: 117px;}
}
@media (max-width: 767px){
.ls-mail-box{padding:15px 10px 10px;}
.ls-mail-container{padding: 10px;}
.ls-mail-items li{ padding: 20px 0;}
.ls-mail-items li .infobox{margin-left: 100px;}
.ls-mail-message{ padding: 15px 10px; margin-top: 15px;}
.ls-mail-message li{padding-bottom: 0;}
.ls-mail-message li p{float: none; width: auto !important;}
.ls-mail-message li .tit{text-align: left;}
.ls-mail-message li .input input{box-sizing: border-box; max-width: 100%;}
.ls-mail-message li .yzm{float: left;}
.ls-mail-message li .yzm input{width: 114px;}
.ls-mail-message li .imgcode{margin-left: 10px;}
.ls-mail-message li.btn_group{margin-top: 15px;}
/*订阅/退订成功*/
.ls-mail-subscribe{ padding: 40px 0 30px;}
.ls-mail-subscribefont{ padding-bottom:30px; font-size: 20px;}
}
@media (max-width: 479px){
.ls-mail-items li{ padding: 20px 0;}
.ls-mail-items li .ico{float: none; margin: 0 auto; display: block;}
.ls-mail-items li .infobox{margin-left:0; padding-right: 34px; height: auto;}
.ls-mail-message li.btn_group input{padding: 0 20px; margin: 0 5px;}
.ls-mail-message li .imgcode{height: 34px; margin-top: 5px;}
}

