/* 电子签名 */
#email_signatures_index #header{position: absolute;top: 0;left: 0;background-color: unset;}
#email_signatures_index #banner{height: 736px;background: url(/frontend/web/images/platform/email_signatures/banner_1.png) no-repeat center;display: flex;align-items: center;justify-content: center;box-shadow: 0 80px 100px rgba(210, 231, 253, 0.3);}
#email_signatures_index #banner .banner_box{display: flex;flex-direction: row;column-gap: 20px;align-items: center;justify-content: space-between;}
#email_signatures_index #banner .banner_box .banner_box_info{width: 45%;display: flex;align-items: flex-start;flex-direction: column;row-gap: 15px;}
#email_signatures_index #banner .banner_box .banner_box_info .title {font-size: 60px;font-weight: bold;color: #FFF;line-height: 1.25;}
#email_signatures_index #banner .banner_box .banner_box_info .desc {font-size: 20px;color: #FFF;line-height: 1.75;}
#email_signatures_index #banner .banner_box .banner_box_info a {margin-top: 20px;font-size: 18px;color: #000;background: #ffc55f;padding: 18px 30px;border-radius: 999px;cursor: pointer;font-weight: bold;}
@media screen and (max-width: 1330px) {
    #email_signatures_index #banner .banner_box .banner_box_info{width: 50%;}
}
@media (max-width: 1024px) {
    #email_signatures_index #header {position: relative;background-color: #434cd7;}
    #email_signatures_index #banner {height: auto;background: #434cd7;padding: 6vw 0;}
    #email_signatures_index #banner .banner_box{display: flex;flex-direction: column;row-gap: 4vw;align-items: center;}
    #email_signatures_index #banner .banner_box .banner_box_info{width: 100%;align-items: center;row-gap: 2vw;}
    #email_signatures_index #banner .banner_box .banner_box_info .title{font-size: 8vw;text-align: center;}
    #email_signatures_index #banner .banner_box .banner_box_info .desc{font-size: 5vw;text-align: center;}
    #email_signatures_index #banner .banner_box .banner_box_info a{font-size: 14px;padding: 2vw 4vw;margin-top: 0;}
}

#email_signatures_index #main #marketing_performance{background: #FFFFFF;padding: 65px 0 85px;}
#email_signatures_index #main #marketing_performance .title{margin: 0 auto;text-align: center;font-weight: bold;}
#email_signatures_index #main #marketing_performance .t_title_1{font-size: 40px;color: #000000;}
#email_signatures_index #main #marketing_performance .content{display: grid;-webkit-grid-template-columns: repeat(4, calc((100% - 3 * 20px) / 4));-ms-grid-columns: repeat(4, calc((100% - 3 * 20px) / 4));grid-template-columns: repeat(4, calc((100% - 3 * 20px) / 4));gap: 20px;margin: 30px 0 0;}
#email_signatures_index #main #marketing_performance .content .item{display: flex;align-items: center;justify-content: flex-start;flex-direction: column;row-gap: 5px;border-radius: 10px;background: #FFF;padding: 35px 25px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);text-align: center;}
#email_signatures_index #main #marketing_performance .content .item .item_value{font-size: 50px;color: #4f46e5;font-weight: bold;line-height: 1;}
#email_signatures_index #main #marketing_performance .content .item .item_title{font-size: 20px;color: #001335;font-weight: bold;margin-top: 15px;}
#email_signatures_index #main #marketing_performance .content .item .item_desc{font-size: 16px;color: #001335;line-height: 1.75;}
@media screen and (max-width: 1024px) {
    #email_signatures_index #main #marketing_performance {padding: 6vw 0;}
    #email_signatures_index #main #marketing_performance .t_title_1{font-size: 5.33vw;}
    #email_signatures_index #main #marketing_performance .content{-webkit-grid-template-columns: repeat(2, calc((100% - 1 * 2.66vw) / 2));-ms-grid-columns: repeat(2, calc((100% - 1 * 2.66vw) / 2));grid-template-columns: repeat(2, calc((100% - 1 * 2.66vw) / 2));gap: 2.66vw;margin: 4vw 0 0;}
    #email_signatures_index #main #marketing_performance .content .item{row-gap: 0.66vw;padding: 4.66vw 3.33vw;}
    #email_signatures_index #main #marketing_performance .content .item .item_value{font-size: 6.66vw;}
    #email_signatures_index #main #marketing_performance .content .item .item_title{font-size: 3.66vw;margin-top: 2vw;}
    #email_signatures_index #main #marketing_performance .content .item .item_desc{font-size: 3.22vw;}
}
@media screen and (max-width: 500px) {
    #email_signatures_index #main #marketing_performance .content{-webkit-grid-template-columns: repeat(1, 1fr);-ms-grid-columns: repeat(1, 1fr);grid-template-columns: repeat(1, 1fr);}
}

#email_signatures_index #main #creating_signature{background: #f8faff;padding: 55px 0 80px;}
#email_signatures_index #main #creating_signature .title{margin: 0 auto;text-align: center;font-weight: bold;}
#email_signatures_index #main #creating_signature .t_title_1{font-size: 40px;color: #000000;margin-bottom: 15px;}
#email_signatures_index #main #creating_signature .t_title_2{font-size: 20px;color: #001335;font-weight: normal;line-height: 1.75;width: 65%;margin: 0 auto;}
#email_signatures_index #main #creating_signature .content{margin-top: 30px;display: flex;flex-direction: column;row-gap: 100px;}
#email_signatures_index #main #creating_signature .content .item{display: flex;align-items: center;flex-direction: row;column-gap: 80px;text-align: center;justify-content: space-between;}
#email_signatures_index #main #creating_signature .content .item.right{flex-direction: row-reverse;}
#email_signatures_index #main #creating_signature .content .item .item_image,
#email_signatures_index #main #creating_signature .content .item .item_content{width: calc((100% - 80px) / 2);}
#email_signatures_index #main #creating_signature .content .item .item_image{font-size: 0;}
#email_signatures_index #main #creating_signature .content .item .item_content{display: flex;flex-direction: column;text-align: left;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_title{font-size: 30px;color: #000000;font-weight: bold;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_desc{font-size: 18px;color: #001335;line-height: 1.75;margin-top: 15px;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box{font-size: 16px;color: #001335;margin-top: 25px;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box .item_desc_out{display: flex;column-gap: 8px;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box .item_desc_out .desc_out_icon .icon_dui {width: 24px;height: 24px;display: inline-block;background: url(/frontend/web/images/icon_dui_3.png) no-repeat center / 24px;margin-top: 4px;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box .item_desc_out .desc_out_content{font-size: 18px;color: #001335;line-height: 1.75;}
#email_signatures_index #main #creating_signature .content .item .item_content .item_btn .button {display: inline-block;background-color: #2b69ff;color: #FFFFFF;padding: 14px 30px;font-size: 16px;font-weight: bold;border-radius: 999px;margin-top: 25px;cursor: pointer;}
@media (max-width: 1330px){
    #email_signatures_index #main #creating_signature .t_title_2{width: 80%;}
    #email_signatures_index #main #creating_signature .content{row-gap: 60px;}
    #email_signatures_index #main #creating_signature .content .item{column-gap: 40px;}
    #email_signatures_index #main #creating_signature .content .item .item_content{width: calc((100% - 40px) / 2);}
}
@media (max-width: 1024px){
    #email_signatures_index #main #creating_signature {padding: 6vw 0;}
    #email_signatures_index #main #creating_signature .t_title_1{font-size: 5.33vw;margin-bottom: 2vw;}
    #email_signatures_index #main #creating_signature .t_title_2{font-size: 2.66vw;width: 100%}
    #email_signatures_index #main #creating_signature .content{margin-top: 4vw;row-gap: 6vw;}
    #email_signatures_index #main #creating_signature .content .item{flex-direction: column-reverse;row-gap: 4.66vw;align-items: flex-start;}
    #email_signatures_index #main #creating_signature .content .item.right{flex-direction: column-reverse;}
    #email_signatures_index #main #creating_signature .content .item .item_image,
    #email_signatures_index #main #creating_signature .content .item .item_content{width: 100%;}
    #email_signatures_index #main #creating_signature .content .item .item_image{display: flex;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_title{font-size: 3.66vw;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_desc{font-size: 3.22vw;margin-top: 2vw;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box{margin-top: 3.33vw;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box .item_desc_out{column-gap: 1.06vw;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box .item_desc_out .desc_out_icon .icon_dui {width: 3.2vw;height: 3.2vw;display: inline-block;background: url(/frontend/web/images/icon_dui_3.png) no-repeat center / 3.2vw;margin-top: 1.2vw;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_desc_box .item_desc_out .desc_out_content{font-size: 3.22vw;}
    #email_signatures_index #main #creating_signature .content .item .item_content .item_btn .button {font-size: 14px;padding: 2vw 4vw;margin-top: 3.33vw;}
}

#email_signatures_index #main #seamless_integration{background: #4f46e5;padding: 60px 0 90px;}
#email_signatures_index #main #seamless_integration .title{margin: 0 auto;text-align: center;font-weight: bold;}
#email_signatures_index #main #seamless_integration .t_title_1{font-size: 40px;color: #FFFFFF;margin-bottom: 15px;}
#email_signatures_index #main #seamless_integration .t_title_2{font-size: 20px;color: #FFFFFF;font-weight: normal;}
#email_signatures_index #main #seamless_integration .content{display: grid;-webkit-grid-template-columns: repeat(6, calc((100% - 5 * 20px) / 6));-ms-grid-columns: repeat(6, calc((100% - 5 * 20px) / 6));grid-template-columns: repeat(6, calc((100% - 5 * 20px) / 6));gap: 20px;margin: 40px 0 0;}
#email_signatures_index #main #seamless_integration .content .item{display: flex;align-items: center;justify-content: flex-start;flex-direction: column;row-gap: 10px;border-radius: 18px;background: #FFF;padding: 30px;text-align: center;}
#email_signatures_index #main #seamless_integration .content .item .item_title{font-size: 18px;color: #001335;font-weight: bold;}
@media screen and (max-width: 1024px) {
    #email_signatures_index #main #seamless_integration {padding: 6vw 0;}
    #email_signatures_index #main #seamless_integration .t_title_1{font-size: 5.33vw;margin-bottom: 2vw;}
    #email_signatures_index #main #seamless_integration .t_title_1{font-size: 3.33vw;}
    #email_signatures_index #main #seamless_integration .content{-webkit-grid-template-columns: repeat(3, calc((100% - 2 * 2.66vw) / 3));-ms-grid-columns: repeat(3, calc((100% - 2 * 2.66vw) / 3));grid-template-columns: repeat(3, calc((100% - 2 * 2.66vw) / 3));gap: 2.66vw;margin: 5.33vw 0 0;}
    #email_signatures_index #main #seamless_integration .content .item{row-gap: 1.33vw;border-radius: 2.4vw;padding: 25px;}
    #email_signatures_index #main #seamless_integration .content .item .item_icon{width: 60px;height: 60px;}
    #email_signatures_index #main #seamless_integration .content .item .item_desc{font-size: 4vw;}
}
@media screen and (max-width: 500px) {
    #email_signatures_index #main #seamless_integration .content {-webkit-grid-template-columns: repeat(1, 1fr);-ms-grid-columns: repeat(1, 1fr);grid-template-columns: repeat(1, 1fr);}
    #email_signatures_index #main #seamless_integration .content .item {padding: 15px;}
}

#email_signatures_index #main #signature_templates{background: #FFFFFF;padding: 65px 0 45px;}
#email_signatures_index #main #signature_templates .title{margin: 0 auto;text-align: center;font-weight: bold;}
#email_signatures_index #main #signature_templates .t_title_1{font-size: 40px;color: #000000;}
#email_signatures_index #main #signature_templates .content{display: grid;-webkit-grid-template-columns: repeat(2, calc((100% - 20px) / 2));-ms-grid-columns: repeat(2, calc((100% - 20px) / 2));grid-template-columns: repeat(2, calc((100% - 20px) / 2));gap: 20px;margin: 40px 0 0;}
#email_signatures_index #main #signature_templates .content .item{display: flex;align-items: center;justify-content: flex-start;flex-direction: column;text-align: center;}
@media screen and (max-width: 1024px) {
    #email_signatures_index #main #signature_templates {padding: 6vw 0;}
    #email_signatures_index #main #signature_templates .t_title_1{font-size: 5.33vw;}
}
@media screen and (max-width: 768px) {
    #email_signatures_index #main #signature_templates .content{-webkit-grid-template-columns: repeat(1, 1fr);-ms-grid-columns: repeat(1, 1fr);grid-template-columns: repeat(1, 1fr);}
}
