.md-contact-1.md33870 { padding-top: 1rem; padding-bottom: 1rem; overflow: hidden; position: relative; } .md-contact-1.md33870 .layout { margin-left: auto; margin-right: auto; width: 16rem; max-width: 92%; } .md-contact-1.md33870 .h2 { line-height: 1; } .md-contact-1.md33870 .desc { line-height: 1.2; margin-top: 0.1rem; } .md-contact-1.md33870 .md { position: absolute; left: 0; top: -1.5rem; } .md-contact-1.md33870 .map { display: block; padding-top: calc( 584 / 960 * 100%); } .md-contact-1.md33870 .box-le { width: 5.6rem; } .md-contact-1.md33870 .box-ri { width: 9.6rem; } .md-contact-1.md33870 .list { margin-top: 0.3rem; } .md-contact-1.md33870 .li { margin-bottom: 0.7rem; } .md-contact-1.md33870 .li:last-child { margin-bottom: 0; } .md-contact-1.md33870 .icon { width: 1em; height: 1em; box-shadow: 0 0 0 1px inset rgba(0, 0, 0, 0.1); border-radius: 50%; display: inline-flex; justify-content: center; align-items: center; flex-shrink: 0; margin-right: 0.2rem; } .md-contact-1.md33870 .icon img { width: 100%; height: 100%; } .md-contact-1.md33870 .t11 { line-height: 1; } .md-contact-1.md33870 .t12 { margin-top: 0.12rem; line-height: calc(24 / 18); } @media screen and (max-width: 900px) { .md-contact-1.md33870 .box-le { width: 100%; } .md-contact-1.md33870 .box-ri { width: 100%; margin-top: 0.4rem; } } .md-contact-2.md33871 { padding-top: 0.88rem; padding-bottom: 1rem; background-color: rgba(241, 244, 246, 0.6); overflow: hidden; position: relative; } .md-contact-2.md33871 .layout { margin-left: auto; margin-right: auto; width: 16rem; max-width: 92%; } .md-contact-2.md33871 .h2 { line-height: 1; } .md-contact-2.md33871 .desc { line-height: 1.2; margin-top: 0.1rem; } .md-contact-2.md33871 .md { position: absolute; left: 0; top: -1.5rem; } .md-contact-2.md33871 .form { margin-top: 0.3rem; } .md-contact-2.md33871 .fitem { width: calc( 520 / 1600 * 100%); margin-right: calc( 20 / 1600 * 100%); margin-bottom: 0.2rem; } .md-contact-2.md33871 .fitem:nth-child(3n) { margin-right: 0; } .md-contact-2.md33871 .ww100 { width: 100%; margin-right: 0; } .md-contact-2.md33871 .fi-active .placehold { display: none; } .md-contact-2.md33871 .inp { position: relative; } .md-contact-2.md33871 .ta { position: relative; } .md-contact-2.md33871 .ip { width: 100%; height: calc( 50em / 16); background-color: #fff; border: solid 1px #e7e7e7; padding: 0 0.4rem; } .md-contact-2.md33871 .textarea { display: block; width: 100%; height: 1.2rem; background-color: #fff; border: solid 1px #e7e7e7; padding: 0.16rem 0.4rem; } .md-contact-2.md33871 .placehold { color: #666; position: absolute; left: 0; top: 0; width: 100%; height: calc( 50em / 16); display: flex; align-items: center; padding: 0 0.4rem; pointer-events: none; } .md-contact-2.md33871 .placehold span { color: #ff0000; } .md-contact-2.md33871 .code { position: absolute; top: 10%; right: 0; height: 80%; } .md-contact-2.md33871 .btns { margin-top: 0.4rem; } .md-contact-2.md33871 .submit { height: calc(60em / 18); padding: 0 0.75rem; border: none; background-image: linear-gradient(90deg, #8b64d9 0%, #8b64d9 36%, var(--theme) 100%); cursor: pointer; } @media screen and (max-width: 900px) { .md-contact-2.md33871 .fitem { width: 100%; } }