diff --git a/src/main/webapp/publish/publish_text/publish_text/css/reset.css b/src/main/webapp/publish/publish_text/publish_text/css/reset.css new file mode 100644 index 00000000..33230acd --- /dev/null +++ b/src/main/webapp/publish/publish_text/publish_text/css/reset.css @@ -0,0 +1,54 @@ +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, font, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td { + margin: 0; + padding: 0; + border: 0; + outline: 0; + font-size: 100%; + vertical-align: baseline; + background: transparent; +} +body { + line-height: 1; + font-family: 'Noto Sans KR', sans-serif; + color: #222222; + font-size: 20px; + box-sizing: border-box; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} + +/* remember to define focus styles! */ +:focus { + outline: 0; +} + +/* remember to highlight inserts somehow! */ +ins { + text-decoration: none; +} +del { + text-decoration: line-through; +} + +/* tables still need 'cellspacing="0"' in the markup */ +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/src/main/webapp/publish/publish_text/publish_text/css/style.css b/src/main/webapp/publish/publish_text/publish_text/css/style.css new file mode 100644 index 00000000..a7488e61 --- /dev/null +++ b/src/main/webapp/publish/publish_text/publish_text/css/style.css @@ -0,0 +1,334 @@ +@charset "utf-8"; +html{scroll-behavior: smooth; min-width: 280px;} + +*{margin: 0; padding: 0; word-break: keep-all;} +a{text-decoration: none;color: #222222;} + +/* 메인비주얼 */ +.multi-text-wrap{width: 100%; height: 100%; max-width: 1920px; margin: 0 auto; background-color: #fff;} +.multi-text-wrap .banner-wrap a{display: block; width: calc(100% - 120px); margin: 0 auto;} +.multi-text-wrap .banner-wrap a img{position: absolute; margin: 30px 0 0 0; z-index: 1;} +.multi-text-wrap .banner{position: relative;} +.multi-text-wrap .banner img{width: 100%; height: 60vh; object-fit: cover;} + +.multi-text-wrap .banner .title{display: inline-block; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 50%; left: 50%; width: 55%; transform: translate(-50%,-50%); text-align: center; align-items: center; font-family: 'Noto Sans KR', sans-serif; padding: 80px 0;} + +.multi-text-wrap .banner .title p{font-size: 48px; font-weight: 700; color: #222; line-height: 1.5;} +.multi-text-wrap .banner .title span{display: block; font-size: 30px; font-weight: 700; color: #002c9a;} + + + +/* 목차 */ +.multi-text-wrap .list{max-width: 1320px; width: calc(100% - 60px); border: 6px solid #f3f6fb; border-radius: 20px; overflow: hidden; margin: 0 auto; margin-top: 73px; padding: 2% 0;} +.multi-text-wrap .list p{text-align: center; font-weight: 700; font-size: 39px; margin-bottom: 2%; letter-spacing: -1.5px;} +.multi-text-wrap .list ul{padding: 0 36%; font-size: 28px; font-weight: 400; white-space: nowrap; line-height: 49px; letter-spacing: -1.5px;} + +/*안내문*/ +.multi-text-wrap .text{max-width: 1320px; width: 98%; overflow: hidden; margin: 60px auto 60px auto;} +.multi-text-wrap .text p{text-align: center; font-weight: 400; font-size: 25px; line-height: 43px; letter-spacing: -1.5px; padding: 0 5%;} +.multi-text-wrap .text p:nth-child(2){padding: 0 13%; word-break: keep-all;} +.multi-text-wrap .text p:nth-child(1){margin-bottom: 45px; word-break: keep-all;} + +/*컨텐츠 시작*/ +.multi-text-wrap .multi-text-box{max-width: 1320px; width: 98%; overflow: hidden; margin: 0 auto; background-color: #e3e8f0; box-shadow: 0 0 5px rgba(0,0,0,0.2); border-radius: 20px; margin-bottom: 6%;} +.multi-text-wrap .multi-text-box .content{padding: 6% 6% 0 6%; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1.5px;} + +/*갤럭시 시작*/ +.multi-text-wrap .multi-text-box .content #galaxy{background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.2); border-radius: 10px;} + +/*갤럭시 타이틀*/ +.multi-text-wrap #galaxy .title p:nth-child(1){font-weight: 700; font-size: 28px; letter-spacing: 0; padding: 28px 0 0 54px;} +.multi-text-wrap #galaxy .title p:nth-child(2){font-weight: 700; font-size: 20px; color: #e52c18; margin-top: 13px; padding: 0 0 28px 90px; letter-spacing: 0;} +.multi-text-wrap #galaxy .title p:nth-child(2) span{vertical-align: sub;} +.multi-text-wrap #galaxy .line{width: 100%; height: 1px; background-color: #e5e8ed;} + +/*갤럭시-내용*/ +.multi-text-wrap #galaxy .con{padding: 0 7%; margin-top: 30px;} +.multi-text-wrap #galaxy .con ul{display: flex; flex-wrap: wrap; justify-content: center;} +.multi-text-wrap #galaxy .con li{position: relative;display: flex;flex-flow: column; margin: 0 40px 0 0;} + +.multi-text-wrap #galaxy .con li:nth-child(3){margin: 0;} +.multi-text-wrap #galaxy .con li:nth-child(4){margin-top: 10%; margin-left: 45px;} +.multi-text-wrap #galaxy .con li:nth-child(5){margin-top: 10%; margin-left: -18px;} +.multi-text-wrap #galaxy .con img{width: 100%;} + +.multi-text-wrap #galaxy .con .step{width: 100px; height: 33px; line-height: 33px; color: #fff; background-color: #002c9a; border-radius: 20px; text-align: center; position: relative; margin: 35px auto 0 auto; margin-top: 35px; z-index: 2;} + +.multi-text-wrap #galaxy .con .step p{font-weight: 300; font-size: 18px;} + +.multi-text-wrap #galaxy .con .step p span{font-weight: 700; font-size: 18px;} +.multi-text-wrap #galaxy .con .step-text{position: relative; max-width: 290px; min-height: 110px; font-size: 18px; font-weight: 500; text-align: center; height: 100%; margin: 0 auto;} + +.multi-text-wrap #galaxy .con .text-02 p{width: 290px;} + + +.multi-text-wrap #galaxy .con .step-c::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -40px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} +.multi-text-wrap #galaxy .con .step-cc::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -150px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} +.multi-text-wrap #galaxy .con .step-text p{padding: 32px 30px 32px 30px; background-color: #f3f6fb; border-radius: 20px; box-shadow: 0 0 5px rgba(0,0,0,0.2); line-height: 27px; margin-top: -18px; display: block; box-sizing: border-box; height: 100%; word-break: keep-all; display: flex; align-items: center; justify-content: center;} +.multi-text-wrap #galaxy .con .text-04 p{width: 520px; margin-left: -120px; display: inline-block; padding-top: 9%;} +.multi-text-wrap #galaxy .con .text-04 p span{display: block; color: #002c9a; font-weight: 300; font-size: 17px;} + +/*갤럭시 순서*/ +.multi-text-wrap #galaxy .number{font-size: 18px; font-weight: 500; line-height: 35px; padding: 40px 7%;} +.multi-text-wrap #galaxy .number ul li:nth-child(5){font-size: 16px; font-weight: 300; margin: -8px 0 7px 23px;} +/*.multi-text-wrap #galaxy .number ul li:nth-child(5) span{vertical-align: sub;}*/ +.multi-text-wrap #galaxy .number ul li:nth-child(6){margin-top: -8px;} +/*갤럭시 끝*/ + + + +/*아이폰 시작*/ +.multi-text-wrap .multi-text-box .content #iphone{background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.2); border-radius: 10px;} + +/*아이폰 타이틀*/ +.multi-text-wrap #iphone .title p:nth-child(1){font-weight: 700; font-size: 28px; padding-top: 28px; padding-left: 54px; letter-spacing: 0;} +.multi-text-wrap #iphone .title p:nth-child(2){font-weight: 700; font-size: 20px; color: #e52c18; margin-top: 13px; padding-bottom: 28px; padding-left: 90px; letter-spacing: 0;} +.multi-text-wrap #iphone .title p:nth-child(2) span{vertical-align: sub;} +.multi-text-wrap #iphone .line{width: 100%; height: 1px; background-color: #e5e8ed;} + +/*아이폰-내용*/ +.multi-text-wrap #iphone .con{padding: 0 9%; margin-top: 30px;} +.multi-text-wrap #iphone .con ul{display: flex; flex-wrap: wrap; justify-content: center;} +.multi-text-wrap #iphone .con li{position: relative;display: flex;flex-flow: column; margin: 0 30px 0 0;} +.multi-text-wrap #iphone .con li:nth-child(1){margin-left: 60px;} +.multi-text-wrap #iphone .con li:nth-child(2){margin-left: 15px;} +.multi-text-wrap #iphone .con li:nth-child(3){margin-left: 50px; margin-top: 10%;} +.multi-text-wrap #iphone .con li:nth-child(4){margin-left: 18px; margin-top: 10%;} +.multi-text-wrap #iphone .con img{width: 100%;} + +.multi-text-wrap #iphone .con .step{width: 100px; height: 33px; line-height: 33px; color: #fff; background-color: #002c9a; border-radius: 20px; text-align: center; position: relative; margin: 35px auto 0 auto; margin-top: 35px; z-index: 2;} +.multi-text-wrap #iphone .con .step p{font-weight: 300; font-size: 18px;} +.multi-text-wrap #iphone .con .step p span{font-weight: 700;font-size: 18px;} +.multi-text-wrap #iphone .con .step-text{position: relative; max-width: 290px; min-height: 110px; font-size: 18px; font-weight: 500; text-align: center; height: 100%;} +.multi-text-wrap #iphone .con .step-c::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -42px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} +.multi-text-wrap #iphone .con .step-text p{padding: 32px 30px 32px 30px; background-color: #f3f6fb; border-radius: 20px; box-shadow: 0 0 5px rgba(0,0,0,0.2); line-height: 27px; margin-top: -18px; display: block; box-sizing: border-box; height: 100%; word-break: keep-all; display: flex; align-items: center; justify-content: center;} +.multi-text-wrap #iphone .con .text-04 p{display: inline-block; padding-top: 9%;} +.multi-text-wrap #iphone .con .text-04 p span{display: block; color: #002c9a; font-weight: 300; font-size: 17px; line-height: 1.4; padding-bottom: 4%;} + +/*아이폰 순서*/ +.multi-text-wrap #iphone .number{font-size: 18px; font-weight: 500; line-height: 35px; padding: 40px 7%;} +.multi-text-wrap #iphone .number ul li:nth-child(4){font-size: 16px; font-weight: 300; margin: -8px 0 7px 23px;} +/*.multi-text-wrap #iphone .number ul li:nth-child(4) span{vertical-align: sub;}*/ +.multi-text-wrap #iphone .number ul li:nth-child(5){margin-top: -8px;} +/*아이폰 끝*/ + + +/*한계 시작*/ +.multi-text-wrap .multi-text-box .content #limit{background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.2); border-radius: 10px;} + +/*한계 타이틀*/ +.multi-text-wrap #limit .title p{font-weight: 700; font-size: 28px; letter-spacing: 0; padding: 28px 54px 28px 54px; } +.multi-text-wrap #limit .line{width: 100%; height: 1px; background-color: #e5e8ed;} + +/*한계-내용*/ +.multi-text-wrap #limit .con{padding: 0 18%;} + +.multi-text-wrap #limit .con img{margin-top: 40px; width: 51px; height: 59px;} +.multi-text-wrap #limit .con p{font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; margin-top: -52px; margin-left: 55px; margin-bottom: 37px;} + +/*한계-테이블*/ +.multi-text-wrap #limit .con .table{padding: 0 6%;} + +.multi-text-wrap #limit .con table{width: 100%; table-layout: fixed; border-collapse: collapse; background-color: #fff; border-radius: 10px; box-shadow: 0 0 5px rgba(0,0,0,0.2);} +.multi-text-wrap #limit .con table colgroup col:nth-child(1){width: 35%;} +.multi-text-wrap #limit .con table colgroup col:nth-child(2){width: 65%;} +.multi-text-wrap #limit .con table thead th{position: relative; height: 60px; background-color: #002c9a; color: #fff; font-size: 18px; font-weight: 400; letter-spacing: -0.5px; line-height: 1.5; vertical-align: middle; word-break: keep-all;} +.multi-text-wrap #limit .con table thead th:first-child{border-radius: 10px 0 0 0;} +.multi-text-wrap #limit .con table thead th:last-child{border-radius: 0 10px 0 0;} +.multi-text-wrap #limit .con table thead th::after{position: absolute; content: " "; width: 1px; height: 15px; background-color: #fff; top: 50%; right: 0; transform: translateY(-50%);} +.multi-text-wrap #limit .con table thead th:last-child:after{display: none;} +.multi-text-wrap #limit .con table .first{width: 105px; height: 55px; background-color: #002c9a; line-height: 55px; text-align: center; border-right: 1px solid #fff; border-top-left-radius: 10px; color: #fff; font-weight: 500; font-size: 18px;} +.multi-text-wrap #limit .con table .first{height: 55px; background-color: #002c9a; line-height: 55px; text-align: center; border-right: 1px solid #fff; border-top-left-radius: 10px; color: #fff; font-weight: 500; font-size: 18px;} +.multi-text-wrap #limit .con table .second{height: 55px; background-color: #002c9a; line-height: 55px; text-align: center; border-right: 1px solid #fff; border-top-right-radius: 10px; color: #fff; font-weight: 500; font-size: 18px;} +.multi-text-wrap #limit .con table tbody tr{border-bottom: 1px solid #d5d5d5;} +.multi-text-wrap #limit .con table tbody .last{border-bottom: none;} +.multi-text-wrap #limit .con table tbody tr .dv{background-color: #f3f6fb; max-height: 68px; text-align: center; line-height: 68px; color: #444; font-weight: 400; font-size: 18px;} +.multi-text-wrap #limit .con table tbody tr .dv-last{border-bottom-left-radius: 10px;} +.multi-text-wrap #limit .con table tbody tr .tx{color: #666; font-weight: 300; font-size: 16px; padding-left: 25px;} +.multi-text-wrap #limit .con table tbody tr .tx-long{color: #666; font-weight: 300; font-size: 16px; padding-left: 25px; line-height: 20px; vertical-align: middle;} + +/*한계-덧붙여서*/ +.multi-text-wrap #limit .puls{padding: 0 20%; padding-bottom: 50px;} +.multi-text-wrap #limit .puls-ti p{width: 110px; height: 36px; background-color: #002c9a; color: #fff; text-align: center; line-height: 36px; border-radius: 18px; margin: 0 auto; position: relative; margin-top: 34px; font-weight: 300; font-size: 18px;} +.multi-text-wrap #limit .puls-ti p span{font-weight: 700; font-size: 18px;} + +.multi-text-wrap #limit .puls-tx{max-width: 655px; min-height: 57px; background-color: #f3f6fb; border-radius: 20px; box-shadow: 0 0 5px rgba(0,0,0,0.2); text-align: center; margin: 0 auto; margin-top: -20px; padding: 0 20px 20px 20px;} +.multi-text-wrap #limit .puls-tx p{padding-top: 30px;} + +.multi-text-wrap #limit .puls-tx{max-width: 640px; min-height: 57px; background-color: #f3f6fb; border-radius: 20px; box-shadow: 0 0 5px rgba(0,0,0,0.2); text-align: center; margin: 0 auto; margin-top: -20px; padding: 15px 7px 15px 7px;} +.multi-text-wrap #limit .puls-tx p{padding-top: 20px; font-size: 18px;} +/*한계 끝*/ + +/*발송 시작*/ +.multi-text-wrap .multi-text-box .content #send{background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.2); border-radius: 10px; margin-bottom: 6%;} +/*발송 타이틀*/ +.multi-text-wrap #send .title p{font-weight: 700; font-size: 28px; letter-spacing: 0; padding: 28px 54px 28px 54px;} +.multi-text-wrap #send .line{width: 100%; height: 1px; background-color: #e5e8ed;} + +/*발송-내용*/ +.multi-text-wrap #send .con{padding: 0 14%;} +.multi-text-wrap #send .con > img{margin-top: 40px; width: 51px; height: 59px;} +.multi-text-wrap #send .con p{font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; margin-top: -52px; margin-left: 55px; margin-bottom: 57px;} +.multi-text-wrap #send .con .send{max-width: 640px; width: 100%; margin: 0 auto;} +.multi-text-wrap #send .con .send img{width: 100%; margin: 0;} + +/*발송_스텝*/ +.multi-text-wrap #send .send-step{padding: 0 20%; margin-bottom: 108px;} +.multi-text-wrap #send .step-ti p{width: 110px; height: 36px; background-color: #002c9a; color: #fff; text-align: center; line-height: 36px; border-radius: 18px; margin: 0 auto; position: relative; margin-top: 34px; font-weight: 300; font-size: 18px;} +.multi-text-wrap #send .step-ti p span{font-weight: 700;font-size: 18px;} + +.multi-text-wrap #send .step-tx{max-width: 640px; min-height: 57px; background-color: #f3f6fb; border-radius: 20px; box-shadow: 0 0 5px rgba(0,0,0,0.2); text-align: center; margin: 0 auto; margin-top: -20px; padding: 15px 7px 15px 7px;} +.multi-text-wrap #send .step-tx p{padding-top: 20px; font-size: 18px;} + +/*발송_01*/ +.multi-text-wrap #send .send-tx-01{min-height: 80px; padding: 15px 7px 15px 7px;} +.multi-text-wrap #send .send-tx-01 p{padding-top: 13px; line-height: 27px; display: inline-block;} +.multi-text-wrap #send .send-tx-01 p span{font-weight: 300; color: #002c9a; display: block; font-size: 17px;} +/*발송_04*/ +.multi-text-wrap #send .send-tx-04{min-height: 80px; padding: 15px 7px 15px 7px;} +.multi-text-wrap #send .send-tx-04 p{padding-top: 13px; line-height: 27px; display: inline-block;} +.multi-text-wrap #send .send-tx-04 p span{font-weight: 300; color: #002c9a; display: block; font-size: 17px;} + +/*발송_05*/ +.multi-text-wrap #send .send-tx-05{max-width: 600px; min-height: 144px; text-align: left;padding: 0 27px 20px 27px;} +.multi-text-wrap #send .send-tx-05 p{padding-top: 29px; line-height: 27px; text-align: center;} +.multi-text-wrap #send .send-tx-05 span{font-weight: 300; color: #002c9a; font-size: 17px; line-height: 27px;} +.multi-text-wrap #send .send-05{margin-bottom: 0;} + +/*발송 순서*/ +.multi-text-wrap #send .number{font-size: 18px; font-weight: 500; line-height: 35px; padding: 40px 7%; margin-top: 20px;} +.multi-text-wrap #send .number ul li:nth-child(2){font-size: 16px; font-weight: 300; margin: -8px 0 7px 23px;} +.multi-text-wrap #send .number ul li:nth-child(3){margin-top: -8px;} +/*.multi-text-wrap #send .number ul li:nth-child(2) span{vertical-align: sub;}*/ +.multi-text-wrap #send .number ul li:nth-child(6){font-size: 16px; font-weight: 300; margin: -8px 0 7px 23px;} +.multi-text-wrap #send .number ul li:nth-child(7){margin-top: -7px;} +.multi-text-wrap #send .number ul li:nth-child(8){font-size: 16px; font-weight: 300; margin: -8px 0 0 23px;} + +/*메인화면 이동 버튼*/ +.multi-text-wrap .bt-button{margin: 70px 0; text-align: center;} +.multi-text-wrap .bt-button a{background-color: #002c9a; border-radius: 10px; font-size: 24px; color: #fff; padding: 15px 100px;} +.multi-text-wrap .bt-button a:hover{box-shadow: 0 0 10px rgba(0,0,0,0.6);} + + + +/*미디어쿼리 시작*/ +/*미디어쿼리_1340px*/ +@media screen and (max-width:1340px) { + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 60px;} + .multi-text-wrap #galaxy .con ul{display: flex; flex-wrap: wrap; justify-content: center;} + .multi-text-wrap #galaxy .con li{position: relative;display: flex;flex-flow: column; margin: 0 40px 0 0;} + .multi-text-wrap #galaxy .con li:nth-child(3){margin: 0;} + .multi-text-wrap #galaxy .con li:nth-child(4){margin-top: 109px;} + .multi-text-wrap #galaxy .con li:nth-child(5){margin-top: 109px; margin-left: -14px;} + .multi-text-wrap #galaxy .con img{width: 100%;} +} + +/*미디어쿼리_1280px*/ +@media screen and (max-width:1280px){ + /*메인비주얼*/ + .multi-text-wrap .banner .title{width: 60%; padding: 80px 0px;} + .multi-text-wrap .banner .title p:nth-child(1){font-size: 40px;} + + /*목록*/ + .multi-text-wrap .list p{font-size: 35px;} + .multi-text-wrap .list ul{font-size: 24px; padding: 0 37%;} + + /*안내문*/ + .multi-text-wrap .text p{font-size: 25px;} + .multi-text-wrap .text p:nth-child(1){padding: 0 3%;} + .multi-text-wrap .text p:nth-child(2){padding: 0 12%;} + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 3%;} + .multi-text-wrap #galaxy .con .step-text p{width: 94%;} + .multi-text-wrap #galaxy .con .step-c::after{right: -4.2%;} + .multi-text-wrap #galaxy .con .step-c::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -28px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} + .multi-text-wrap #galaxy .con .step-cc::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -152px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} + + .multi-text-wrap #galaxy .con .step-01{margin-left: 35%;} + .multi-text-wrap #galaxy .con .step-02{margin-left: 31%;} + .multi-text-wrap #galaxy .con .step-03{margin-left: 31%;} + .multi-text-wrap #galaxy .con .step-05{margin-left: 31%;} + + + .multi-text-wrap #galaxy .con ul li:nth-child(1){margin-left: 5px;} + .multi-text-wrap #galaxy .con ul li:nth-child(2){margin-left: 0px;} + .multi-text-wrap #galaxy .con ul li:nth-child(3){margin-left: -8px;} + .multi-text-wrap #galaxy .con .text-01{margin-right: -10px;} + .multi-text-wrap #galaxy .con .text-01 p{padding-top: 13%;} + .multi-text-wrap #galaxy .con .text-02{margin-right: -20px; width: 100%;} + .multi-text-wrap #galaxy .con .text-02{margin-right: 0px; width: 100%;} + .multi-text-wrap #galaxy .con .text-04 p{width:520px;} + + /*아이폰*/ + .multi-text-wrap #iphone .con .step-c::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -45px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} + .multi-text-wrap #iphone .con li{position: relative;display: flex;flex-flow: column; margin: 0 33px 0 0;} + .multi-text-wrap #iphone .con li:nth-child(1){margin-left: 60px;} + .multi-text-wrap #iphone .con li:nth-child(2){margin-left: 15px;} + .multi-text-wrap #iphone .con li:nth-child(3){margin-left: 60px; margin-top: 10%;} + .multi-text-wrap #iphone .con li:nth-child(4){margin-left: 20px; margin-top: 10%;} + + /*한계*/ + .multi-text-wrap #limit .con img{margin-top: 40px; margin-left: -20px;} + .multi-text-wrap #limit .con p{font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; margin: -52px -20px 37px 36px;} + .multi-text-wrap #limit .send-step{padding: 0 5%;} + + /*발송*/ + .multi-text-wrap #send .con img{margin-top: 40px; margin-left: -20px;} + .multi-text-wrap #send .con p{font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; margin: -52px -24px 37px 37px;} + .multi-text-wrap #send .send-tx-05 {padding-left: 27px; padding-right: 27px;} + .multi-text-wrap #send .send-step{padding: 0 5%;} + +} + + + +/*미디어쿼리_1230px*/ +@media screen and (max-width:1230px){ + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 2%;} +} + +/*미디어쿼리_1210px*/ +@media screen and (max-width:1210px){ + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 1%;} +} + +/*미디어쿼리_1180px*/ +@media screen and (max-width:1180px){ + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 0.5%;} +} + +/*미디어쿼리_1143px*/ +@media screen and (max-width:1143px){ + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 1%;} + .multi-text-wrap #galaxy .con li{width: 28%} + .multi-text-wrap #galaxy .con li:nth-child(3){margin-right: -10px;} + .multi-text-wrap #galaxy .con li:nth-child(4){width: 53%; margin-left: 55px;} + .multi-text-wrap #galaxy .con li:nth-child(5){margin-left: 10px;} + .multi-text-wrap #galaxy .con .text-04 p{width:490px; margin-left: -100px;} + .multi-text-wrap #galaxy .con .step-cc::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -145px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} +} + +/*미디어쿼리_1090px*/ +@media screen and (max-width:1090px){ + + .multi-text-wrap .text{margin: 50px auto;} + /*갤럭시*/ + .multi-text-wrap #galaxy .con{padding: 0 1%;} + .multi-text-wrap #galaxy .con li{width: 28%} + .multi-text-wrap #galaxy .con li:nth-child(4){width: 53%; margin-left: 40px;} + .multi-text-wrap #galaxy .con li:nth-child(5){margin-left: 20px; margin-right: 20px;} + .multi-text-wrap #galaxy .con .text-04 p{width:490px; margin-left: -100px;} + .multi-text-wrap #galaxy .con .step-cc::after{position: absolute;content: "";width: 35px;height: 35px;background-image: url(/publish/publish_adv/img/arrow.svg);right: -140px;top: 38%;transform: translateY(-50%); z-index: 100; border-radius: 20px;} + .multi-text-wrap #galaxy .number,.multi-text-wrap #iphone .number,.multi-text-wrap #send .number{padding: 10px 7% 40px 7%;} +} + + + + + + diff --git a/src/main/webapp/publish/publish_text/publish_text/img/banner.jpg b/src/main/webapp/publish/publish_text/publish_text/img/banner.jpg new file mode 100644 index 00000000..ea52a09d Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/banner.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/logo.jpg b/src/main/webapp/publish/publish_text/publish_text/img/logo.jpg new file mode 100644 index 00000000..d8daf6b2 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/logo.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_fail.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_fail.jpg new file mode 100644 index 00000000..e3eb0741 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_fail.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_sample.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_sample.jpg new file mode 100644 index 00000000..789ba876 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_sample.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_sample_02.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_sample_02.jpg new file mode 100644 index 00000000..73c2a3db Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_sample_02.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send.jpg new file mode 100644 index 00000000..75dd7848 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_02.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_02.jpg new file mode 100644 index 00000000..cc0908a0 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_02.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_03.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_03.jpg new file mode 100644 index 00000000..1501ea47 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_03.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_04.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_04.jpg new file mode 100644 index 00000000..c973b23d Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_04.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_05.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_05.jpg new file mode 100644 index 00000000..670b79d7 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_05.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_06.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_06.jpg new file mode 100644 index 00000000..cfe89d0d Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_06.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_07.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_07.jpg new file mode 100644 index 00000000..47d897d1 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_07.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_08.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_08.jpg new file mode 100644 index 00000000..e5519164 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_08.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_09.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_09.jpg new file mode 100644 index 00000000..6ed17485 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_09.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_10.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_10.jpg new file mode 100644 index 00000000..f1a4b873 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_10.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_send_event.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_send_event.jpg new file mode 100644 index 00000000..4bcd8161 Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_send_event.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/img/text_service.jpg b/src/main/webapp/publish/publish_text/publish_text/img/text_service.jpg new file mode 100644 index 00000000..9aae3c6f Binary files /dev/null and b/src/main/webapp/publish/publish_text/publish_text/img/text_service.jpg differ diff --git a/src/main/webapp/publish/publish_text/publish_text/multi_text.html b/src/main/webapp/publish/publish_text/publish_text/multi_text.html new file mode 100644 index 00000000..196f6689 --- /dev/null +++ b/src/main/webapp/publish/publish_text/publish_text/multi_text.html @@ -0,0 +1,147 @@ + + + + + + + 단체문자 - 문자온 + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+
+

단체문자발송

+

휴대폰으로도 단체문자를 보낼 수 있지만, 한 번에 보낼 수 있는 단체 문자의 수가 제한됩니다. 보통은 수백명 이하이며, 갤럭시의 경우 인원수 제한을 초과하는 경우 메시지가 전송되지 않을 수 있습니다. 또한, 인터넷 문자사이트를 이용하여 대량 전송하는 것보다 요금 또한 매우 비쌉니다.

+

문자온은 단체문자 및 대량문자 전송을 위한 특화된 인터넷 문자사이트로 별도의 프로그램 설치 없이 컴퓨터로 단체 및 대량 문자 전송이 가능하며, 특정문구 일괄변환, 무료 문자 포토에디터, 그림문자 맞춤제작, 주소록 등록 무료 대행, 080 수신거부 무료 제공, 문자메시지 내 제목 및 약도 추가, 자동화 기반 비용처리 등이 가능하여 누구나 쉽고 편리하게 문자를 대량으로 발송할 수 있습니다.

+ 단체문자발송 +
+
+

단체 및 대량문자 샘플

+

+ 인터넷문자 사이트 문자온은 대량문자·단체문자 발송을 위한 다양한 문자 샘플을 무료로 제공합니다. +

+

+ - 기념일문자, 경조문자, 부고문자, 조문문자, 결혼문자, 행사문자, 병원문자, 선거문자, 응원문자, 홍보문자 등 다양한 웹문자 기반 단체문자&대량문자 샘플 제공 +

+ 문자발송 샘플 +
+
+

문자온 문자사이트 장점 및 혜택

+

+ o 대량 및 단체문자 일괄 발송 : 별도의 프로그램 설치 없이 웹문자로 100만건 이상 끊김 없는 대량 전송 가능
+ ※ 발송오류율 0%, 문자전송 실패 시 100% 보상 및 재적립(단문문자, 장문문자, 그림문자) +

+

+ o 엑셀 일괄 업로드 및 다운로드 : 엑셀로 한 번에 주소록 업로드 및 다운로드 가능 +

+

+ o 치환 : 주소록, 엑셀, TXT 등 입력된 문자내용을 수신자마다 다르게 전송할 수 있는 특정문구 일괄 변환(치환) 기능 제공 +

+

+ o 주소록 : 쉽고 편리한 주소록 관리 모듈 및 폰주소록 등록 기능 제공 +

+

+ o 예약문자 : 특정 날짜 및 시간에 문자 전송 내역을 저장하여 일괄 발송 기능 제공 +

+

+ o 그림 및 사진문자 발송 : 그림문자 3장 일괄 전송 지원 +

+

+ o 발신번호 변경 및 관리 : 다양한 본인인증(휴대폰, 일반전화, 서류 등) 및 결제수단 제공 +

+

+ o 포토에디터 : 국내 최초 자사 기술로 개발한 문자 포토에디터 무료 제공 +

+

+ o 최고의 디자이너가 직접 제작하는 나만의 그림문자 맞춤제작 서비스 제공 +

+ 장점 및 혜택 +
+
+

문자사이트 선택의 5가지 기준

+

+ o 속도, 성능, 기능, 보안, 가격이 보장되는가? +

+

+ o 회원가입, 발신번호 인증이 쉽고 빠르며, 대량문자를 전송하기에 UI/UX가 편리한가? +

+

+ o 최신 IT 기술과 트렌드를 반영시키고 있는가? +

+

+ o 결제, 정산, 환불, 계산서 발행 등 업무가 자동화되어 있고 편리한가? +

+

+ o 매일 매일 문자샘플 콘텐츠가 업데이트 되고, CS 및 기술응대가 실시간적으로 잘 이뤄지고 있는가? +

+

+ 문자온은 특화된 인공지능‧자동화 기술 및 공신력과 검증된 기술력(GS 1등급, 호환성 Lv2, 이노비즈. 메인비즈, 우수기술기업 인증 등)을 보유한 우수기술 인증 종합 IT 벤처기업이 작정하고 만든 세상에서 제일 쉽고 똑똑한 프리미엄 대량 및 단체문자 전송 플랫폼입니다. +

+ 5가지 기준 +
+
+

문자온 이벤트

+

+ o 첫결제 국내 최저가(단문 : 7.5원, 장문 : 32원, 그림 : 59원) 이벤트 진행 중! +

+

+ o 결제금액의 2% 포인트 추가 적립 및 포인트 1만점 이상 적립 시 현금 페이백 이벤트 진행 중! +

+

+ o 문자온 알림톡, 대한민국 최저가 이벤트 진행 중!(조건 없이 누구나 무조건 6.9원) +

+ 이벤트 +
+
+
+
+ 단체문자 +
+
+ + diff --git a/src/main/webapp/publish/publish_text/publish_text/send_text.html b/src/main/webapp/publish/publish_text/publish_text/send_text.html new file mode 100644 index 00000000..231e2e0f --- /dev/null +++ b/src/main/webapp/publish/publish_text/publish_text/send_text.html @@ -0,0 +1,95 @@ + + + + + + + 문자보내기 - 문자온 + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+
+

인터넷으로 문자보내기

+

갤럭시나 아이폰 등 휴대폰으로 문자를 발송하는 것이 아닌, PC나 컴퓨터 등 인터넷 문자사이트를 통해 문자를 단체로 대량 발송하는 행위

+ 문자보내기 +
+
+

컴퓨터로 문자보내기

+

인터넷문자 사이트를 통해 문자발송하는 행위 중 특히 컴퓨터(PC)를 통해 문자를 발송하는 행위

+ 컴퓨터로 문자보내기 +
+
+

단체문자보내기 주의할 점

+

+ 1. 문자사이트에서 인터넷으로 단체문자를 보낼 때에는 회신번호(발신번호)로 사용하는 번호가 이동통신사 “번호도용방지서비스”에 가입되어 있는지 확인하는 것이 중요합니다. 해당 서비스에 가입되어 있을 경우 문자발송사이트를 통해 문자메세지를 발송하실 수 없습니다. +

+

+ 2. 문자전송사이트에서 전송하는 모든 문자에는 반드시 웹발신(WEB발신) 문구가 포함되어야 합니다. +

+

+ 3. 회신번호(발신번호) 없이 또는 변작(변조)하여 문자를 대량으로 전송할 수 없으며, 반드시 사전에 회신번호(발신번호)를 등록하여 사용해야 합니다. +

+ 단체문자보내기 주의점 +
+
+

번호도용방지서비스?

+

이동통신사 번호도용 문자차단 서비스는 웹에서 발송되는 스미싱, 스팸문자에 내 번호가 회신번호로 악용되는 것을 방지해주는 서비스로 해당 서비스에 가입되어 있는 경우 인터넷을 통해 본인 휴대폰 번호로 문자 발송이 자동 차단되게 됩니다. 이동통신사에 '번호도용 문자차단서비스' 서비스 해지를 요청할 경우 정상 발송까지 3~7일 정도가 소요됩니다.

+ 번호도용방지 +
+
+

광고문자/홍보문자 보내기 주의할 점

+

홍보 및 광고문자의 경우에는 광고성 문자규정을 반드시 준수하여야 합니다. 문자온은 문자전송 화면에 광고문자 필수 표기사항 자동입력 기능 및 광고문자 전송 규정 안내를 제공하고 있으므로 규정에 맞게 편리하게 이용하실 수 있습니다.

+
+
+
+
+ 문자보내기 +
+
+ + diff --git a/src/main/webapp/publish/publish_text/publish_text/text_send.html b/src/main/webapp/publish/publish_text/publish_text/text_send.html new file mode 100644 index 00000000..c979acf2 --- /dev/null +++ b/src/main/webapp/publish/publish_text/publish_text/text_send.html @@ -0,0 +1,104 @@ + + + + + + + 문자발송 - 문자온 + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+
+

단체문자발송

+

단체문자 및 대량문자전송 사이트 문자온을 통해 아주 쉽고 간단하게 문자를 발송할 수 있습니다. 문자전송 메뉴에는 문자를 대량발송하기 위한 광고문자 규정 문구 자동 입력 기능, 받는 사람마다 내용을 달리할 수 있는 특정문구 일괄변환 기능, 문자내용을 저장해두고 사용할 수 있는 내문자함 기능, 사진(그림)을 편집할 수 있는 포토에디터 기능, 자주 사용하는 수신번호를 관리할 수 있는 주소록 불러오기 기능 및 엑셀 불러오기 기능, 다양한 문자샘플 및 지도/약도URL 기능 등 대량문자발송을 위한 다양한 기능을 무료로 제공하고 있습니다.

+ 단체문자발송 +
+
+

문자발송 샘플

+

+ 웹문자 사이트 문자온은 대량문자·단체문자 발송을 위한 다양한 SMS/LMS/MMS 샘플을 무료로 제공하고 있습니다. +

+

+ - 경조문자, 부고문자, 광고문자, 홍보문자, 조문문자, 결혼문자, 예약문자, 사진문자, 그림문자, 병원문자, 위로문자, 응원문자, 행사문자, 기념일문자 등 다양한 단문문자, 장문문자 문구 및 그림문자 이미지 제공 +

+ 문자발송 샘플 +
+
+

문자 예약발송

+

+ 문자온은 단체문자전송을 위한 예약문자 발송 기능을 제공하고 있습니다. 문자를 발송할 날짜, 시간 및 분할 횟수를 지정하여 예약할 경우 해당 시간에 맞춰 문자가 자동발송되며, 예약취소 및 변경이 가능합니다. 단, 예약 취소는 문자예약전송 시간이 5분 이상 남아있을 경우에만 가능합니다. +

+ 문자 예약발송 +
+
+

문자발송 실패

+

수신자의 휴대폰 번호 변경, 서비스 일시 정지, 발신자의 번호도용방지서비스 가입 등 다양한 사유가 존재하며 발송에 실패한 문자메시지에 대해서는 해당요금 전액 잔액으로 반환(환불)됩니다.

+ 문자발송 실패 +
+
+

문자발송 대기

+

수신자의 휴대폰이 꺼져있거나, 수신지역 이탈 등 다양한 사유가 존재하며 대기 상태일 경우 최대 72시간까지 문자발신을 시도(통신사마다 1~3일 소요)합니다. 최종적으로 수신자가 문자를 받을 수 없을 경우 실패 처리되며 해당요금은 잔액으로 반환됩니다.

+ 문자발송 대기 +
+
+

문자발송 성공이나 수신 안되는 경우

+

한국인터넷진흥원 불법스팸대응센터에서 스팸종합대책을 마련함에 따라, 각 이동통신사는 스팸차단서비스(스팸필터링서비스)를 운영하고 있습니다. 이동통신사는 각각 보유한 알고리즘을 지속적으로 업데이트 하면서 자동으로 스팸문자를 판단하여 해당 통신사 스팸보관함에 보관합니다. 이 때 문자 발송은 성공한 것으로 처리하기 때문에 정상과금 처리가 됩니다. 따라서 정상적으로 문자를 발송하였는데도 수신자가 받지 못했을 경우에는 수신자를 통해 스팸차단서비스에 의해 차단되었는지를 확인해 보시길 바랍니다.

+ 성공이나 수신 안되는 경우 +
+
+

문자발송사이트 문자온

+

문자비용이 고민된다면 문자온의 첫결제이벤트를 통해 웹문자를 발송해보세요. 최저 문자요금 7.5원(부가세 별도)! 파격 특가를 지금 만나실 수 있습니다.

+
+
+
+
+ 문자발송 +
+
+ +