tolag3/mjon_git
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2024/01/23 문자온 모바일용 홍보페이지 퍼블리싱 추가

Browse Source
This commit is contained in:
ITN_디자인팀 2024-01-23 12:03:41 +09:00
parent 4225ebc32a
commit 7b48ed544f
2 changed files with 190 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/main/webapp/publish/publish_m/css/style.css
View File

@ -52,12 +52,27 @@ footer ul li a{color: #fff;}
footer ul li:last-child{margin: 0 auto;}
footer .iten{padding: 22px 0 40px 0; font-size: 26px; font-weight: 300; opacity: 40%;}
/*intro_03 내용 수정*/
.visual .banner_con ul{padding: 50px 20px;}
.visual .banner_con ul li{width:calc((100% - 15px)/2)}
.visual .banner_con ul .wrap{border: none;}
.visual .banner_con ul .wrap .inner_text{border-radius: 8px; font-weight: 700; padding: 15px 7px; line-height: 1.1; box-shadow: 0 0 20px rgba(0,0,0,0.3 );}
.visual .banner_con ul .wrap .inner_text span{font-size: 20px;}
.con .add_wrap .text .inner_sub{font-size: 30px; font-weight: 300;}
/*미디어쿼리_640x*/
@media screen and (max-width:640px){
.visual{background-image: url(/publish/publish_m/img/main_bg.png);}
}
/*미디어쿼리_500x*/
/*미디어쿼리_585px*/
@media screen and (max-width:585px){
/*intro_03 내용 수정*/
.visual .banner_con ul .wrap .inner_text{font-size: 18px;}
.visual .banner_con ul .wrap .inner_text span{font-size: 14px;}
}
/*미디어쿼리_500px*/
@media screen and (max-width:500px){
/*header*/
header .inner{border-radius: 0 0 20px 0; padding: 3px 20px;}
@ -91,11 +106,29 @@ footer .iten{padding: 22px 0 40px 0; font-size: 26px; font-weight: 300; opacity:
footer .title p{margin: 0 0 0 10px;}
footer ul li{width: 210px; margin: 0 auto 8px auto; border-radius: 8px; font-size: 22px; padding: 8px 0 5px 0;}
footer .iten{padding: 12px 0 20px 0; font-size: 13px;}
/*intro_03 내용 수정*/
.visual .banner_con ul .wrap{border: none;}
.visual .banner_con ul .wrap .inner_text{font-size: 18px; border-radius: 8px; font-weight: 700; font-size: 18px; padding: 15px 7px 13px 7px; line-height: 1.1; box-shadow: 0 0 20px rgba(0,0,0,0.3 );}
.visual .banner_con ul .wrap .inner_text span{font-size: 14px;}
.con .add_wrap .text .inner_sub{font-size: 15px;}
}
/*미디어쿼리_460pxx*/
/*미디어쿼리_460px*/
@media screen and (max-width:460px){
.visual{background-image: url(/publish//publish_m/img/main_bg_small_01.png);}
/*intro_03 내용 수정*/
.visual .banner_con ul .wrap .inner_text{font-size: 16px;}
}
/*미디어쿼리_383px*/
@media screen and (max-width:383px){
.visual .banner_con ul .wrap .second_te{padding: 15px 6px 13px 6px;}
}
/*미디어쿼리_382px*/
@media screen and (max-width:382px){
.visual .banner_con ul .wrap .second_te{padding: 15px 7px 13px 7px;}
}
/*미디어쿼리_360x*/
@ -107,10 +140,19 @@ footer .iten{padding: 22px 0 40px 0; font-size: 26px; font-weight: 300; opacity:
@media screen and (max-width:340px){
.visual .price ul .wrap .title{font-size: 13px;}
.visual .price ul{padding: 0 15px;}
/*intro_03 내용 수정*/
.visual .banner_con ul{padding: 40px 15px;}
}
/*미디어쿼리_310x*/
@media screen and (max-width:310px){
.visual .price ul .wrap .title{font-size: 12px;}
.visual .price ul{padding: 0 9px;}
/*intro_03 내용 수정*/
.visual .banner_con ul{padding: 40px 15px;}
}
/*미디어쿼리_310x*/
@media screen and (max-width:300px){
/*intro_03 내용 수정*/
.visual .banner_con ul .wrap .inner_text{font-size: 15px;}
}

146
src/main/webapp/publish/publish_m/munjaon_intro_03.html Normal file
View File

@ -0,0 +1,146 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>프리미엄 문자 발송 서비스 문자온</title>
<meta property="og:title" content="프리미엄 문자 발송 서비스 문자온">
<meta property="og:image" content="https://www.munjaon.co.kr/publish/publish_m/img/preview_logo.png">
<link rel="apple-touch-icon" sizes="57x57" href="/publish/images/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/publish/images/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/publish/images/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/publish/images/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/publish/images/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/publish/images/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/publish/images/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/publish/images/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/publish/images/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/publish/images/favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/publish/images/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/publish/images/favicon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/publish/images/favicon/favicon-16x16.png">
<link rel="manifest" href="/publish/images/favicon/manifest.json">
<link rel="stylesheet" href="/publish/publish_m/css/reset.css">
<link rel="stylesheet" href="/publish/publish_m/css/style.css">
</head>
<body>
<div class="con_wrap">
<header>
<div class="inner">
<a href="https://www.munjaon.co.kr">
<h1><img src="/publish/publish_m/img/header_logo.png" alt="문자온 로고"></h1>
<p>munjaon.co.kr</p>
</a>
</div>
</header>
<div class="visual">
<div class="inner">
<h2><span>프리미엄</span>&nbsp;문자<br>발송 서비스</h2>
<div class="button">
<a href="https://www.munjaon.co.kr">
<p>문자온 바로가기&nbsp;<span>(클릭)</span></p>
</a>
</div>
<div class="price banner_con">
<ul>
<li>
<div class="wrap">
<p class="inner_text">최저가 요금<span>(후불제 가능)</span></p>
</div>
</li>
<li>
<div class="wrap">
<p class="inner_text second_te">편리한 선거문자 시스템</p>
</div>
</li>
</ul>
</div>
</div>
</div>
<section>
<div class="con">
<div class="title">
<p class="num">1</p>
<p>특장점</p>
</div>
<div class="text_wrap add_wrap">
<div class="text">
<p class="te">편리한 20건 선거문자 발송</p>
<p class="inner_sub">(자동분류, 전체선택 가능)</p>
</div>
<div class="text">
<p class="te">업계 최저가 요금</p>
<p class="inner_sub">(현 요금보다 저렴하게 제공)</p>
</div>
<div class="text">
<p class="te">단문<span class="inner_sub">(SMS)</span>, 장문<span class="inner_sub">(LMS)</span>, 그림문자<span class="inner_sub">(MMS)</span>, 카카오 알림톡, 팩스 발송 기능 제공</p>
</div>
<div class="text">
<p class="te">최신 트렌드 반영 서비스 제공</p>
<div class="text_sub">
<p>- 주소록 입력 대행(무료)</p>
<p>- 예약발송 기능 제공(분 단위)</p>
<p>- 문자메시지 지도‧약도 자동 첨부 가능</p>
<p>- 그림문자 주문제작 서비스 제공</p>
<p>- 다양한 결제수단 제공(신용카드, 휴대폰 결제, 전용계좌, 즉시이체, 간편결제 등)</p>
<p>- 무제한 발송량 제공</p>
<p>- 특정 공통문구(이름, 일시, 비용 등) 일괄 변경 기능 제공</p>
</div>
</div>
<div class="text">
<p class="te">기업‧단체‧공공기관 B2B 전용라인 제공</p>
</div>
</div>
</div>
</section>
<section>
<div class="con">
<div class="title">
<p class="num">2</p>
<p>이용고객</p>
</div>
<div class="text_wrap add_wrap">
<div class="text">
<p class="te">개인<span class="inner_sub">(사업자)</span></p>
<div class="text_sub">
<p>- 동호회, 동문회, 향우회, 병원, 부동산, 음식점, 마트, 대리점, 숙박업, 전문직 사무실, 소셜커머스 사업자, 교육시설(학원, 학교, 유치원, 어린이집), 스포츠시설(골프장, 피트니스) 등</p>
</div>
</div>
<div class="text">
<p class="te">기업‧협회‧단체</p>
<div class="text_sub">
<p>- 기업(대‧중‧소기업), 협회, 조합, 비영리단체, 종교단체(교회, 사찰), 은행, 카드사, 쇼핑몰, 택배사, 보험사, 리서치사 등</p>
</div>
</div>
<div class="text">
<p class="te">공공</p>
<div class="text_sub">
<p>- 정부, 지방자치단체, 국회, 지방의회, 법원, 공공기관, 공직유관단체, 도서관, 미술관, 전시관, 공연시설, 영화관 등</p>
</div>
</div>
</div>
</div>
</section>
<footer>
<div class="title">
<img src="/publish/publish_m/img/tel_icon.png" alt="고객센터 아이콘">
<p>고객센터</p>
</div>
<ul>
<li>
<a href="tel:010-8432-9333">010-8432-9333</a>
</li>
<li>
<a href="tel:010-2290-4789">010-2290-4789</a>
</li>
</ul>
<p class="iten">주식회사 아이티앤</p>
</footer>
</div>
</body>
</html>