mingle-website/zh/services.html
68893236+KINDNICK@users.noreply.github.com 30cd06e9d6 feat: setup i18n build script and SEO optimizations
2026-03-01 14:56:52 +09:00

1067 lines
65 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html><html lang="zh"><head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-PPTNN6WD');</script>
<!-- End Google Tag Manager -->
<!-- Google tag (gtag.js) -->
<script async="" src="https://www.googletagmanager.com/gtag/js?id=G-R0PBYHVQBS"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-R0PBYHVQBS');
</script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>服务介绍 - Mingle Studio</title>
<!-- 파비콘 -->
<link rel="icon" type="image/x-icon" href="/images/logo/mingle-logo.ico">
<link rel="shortcut icon" href="/images/logo/mingle-logo.ico">
<link rel="icon" type="image/webp" href="/images/logo/mingle-logo.webp">
<!-- Canonical URL -->
<link rel="canonical" href="https://minglestudio.co.kr/zh/services.html">
<!-- Theme Color -->
<meta name="theme-color" content="#ff8800">
<!-- SEO 메타 태그 -->
<meta name="description" content="Mingle Studio服务介绍 - OptiTrack动作捕捉工作室场地租赁2人$150起/小时,全身/面部捕捉,专业动作录制">
<meta name="keywords" content="모션캡쳐 대관, OptiTrack, 스튜디오 요금, 모션 녹화, 모션캡쳐 스튜디오">
<meta name="author" content="밍글 스튜디오">
<!-- Open Graph -->
<meta property="og:title" content="服务介绍 - Mingle Studio">
<meta property="og:description" content="OptiTrack动作捕捉工作室场地租赁服务。全身/面部捕捉专业服务">
<meta property="og:url" content="https://minglestudio.co.kr/services.html">
<meta property="og:type" content="website">
<meta property="og:image" content="https://minglestudio.co.kr/images/logo/mingle-OG.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:locale" content="ko_KR">
<meta property="og:site_name" content="밍글 스튜디오">
<meta property="og:image:alt" content="밍글 스튜디오 - 모션캡처 녹화 서비스 요금안내">
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="서비스 소개 - 밍글 스튜디오">
<meta name="twitter:description" content="30대 OptiTrack 카메라로 전신/페이셜 모션캡처, 2인 200,000원~/시간. 스트리밍글 서비스 4시간 1,400,000원 / 6시간 2,000,000원 풀패키지 제공">
<meta name="twitter:image" content="https://minglestudio.co.kr/images/logo/mingle-OG.png">
<meta name="twitter:site" content="@mingle_studio">
<meta name="twitter:creator" content="@mingle_studio">
<!-- 폰트 -->
<link href="https://hangeul.pstatic.net/hangeul_static/css/nanum-square.css" rel="stylesheet">
<!-- 아이콘 폰트 (이모지 대체용) -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" rel="stylesheet">
<!-- CSS -->
<link rel="stylesheet" href="/css/common.css">
<link rel="stylesheet" href="/css/services.css">
<link rel="alternate" hreflang="ko" href="https://minglestudio.co.kr/services.html">
<link rel="alternate" hreflang="en" href="https://minglestudio.co.kr/en/services.html">
<link rel="alternate" hreflang="ja" href="https://minglestudio.co.kr/ja/services.html">
<link rel="alternate" hreflang="zh" href="https://minglestudio.co.kr/zh/services.html">
<link rel="alternate" hreflang="x-default" href="https://minglestudio.co.kr/services.html">
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PPTNN6WD"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<a href="#main-content" class="skip-to-content" data-i18n="common.skipToContent">跳转到正文</a>
<!-- 헤더 -->
<div id="header-placeholder">
<!-- 공통 헤더 컴포넌트 -->
<nav class="navbar" aria-label="메인 내비게이션">
<div class="nav-container">
<div class="nav-logo">
<a href="/zh/">
<img src="/images/logo/mingle-logo.webp" alt="밍글 스튜디오 로고">
<span data-i18n="header.studioName">Mingle Studio</span>
</a>
</div>
<ul id="nav-menu" class="nav-menu">
<li><a href="/zh/about" class="nav-link" data-i18n="header.nav.about">About</a></li>
<li><a href="/zh/services" class="nav-link" data-i18n="header.nav.services">Services</a></li>
<li><a href="/zh/portfolio" class="nav-link" data-i18n="header.nav.portfolio">Portfolio</a></li>
<li><a href="/zh/gallery" class="nav-link" data-i18n="header.nav.gallery">Gallery</a></li>
<li><a href="/zh/contact" class="nav-link" data-i18n="header.nav.contact">Contact</a></li>
<li><a href="/zh/qna" class="nav-link" data-i18n="header.nav.qna">Q&amp;A</a></li>
</ul>
<div class="nav-actions">
<div class="lang-switcher">
<button class="lang-btn" aria-label="选择语言" data-i18n-aria="header.langSelect">
<span class="lang-current">KO</span>
<svg class="lang-chevron" viewBox="0 0 10 6" width="10" height="6" aria-hidden="true">
<path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" fill="none" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</button>
<ul class="lang-dropdown">
<li><button data-lang="ko">🇰🇷 한국어</button></li>
<li><button data-lang="en">🇺🇸 English</button></li>
<li><button data-lang="zh">🇨🇳 中文</button></li>
<li><button data-lang="ja">🇯🇵 日本語</button></li>
</ul>
</div>
<button class="theme-toggle" id="themeToggle" aria-label="다크 모드 전환" title="다크/라이트 모드 전환">
<div class="theme-toggle-thumb">
<svg class="theme-toggle-icon theme-toggle-icon--sun" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
</svg>
<svg class="theme-toggle-icon theme-toggle-icon--moon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
</svg>
</div>
</button>
</div>
<button class="hamburger" aria-label="메뉴 열기" aria-expanded="false" aria-controls="nav-menu">
<span></span>
<span></span>
<span></span>
</button>
</div>
</nav>
</div>
<main id="main-content">
<!-- 페이지 헤더 -->
<section class="page-header">
<div class="container">
<h1 data-i18n="services.pageHeader.title">Services</h1>
<p data-i18n="services.pageHeader.desc">提供先进的动作捕捉设施和专业服务</p>
</div>
</section>
<!-- 주요 서비스 소개 -->
<section class="section">
<div class="container">
<div class="section-header">
<h2 data-i18n="services.packages.title">服务套餐</h2>
<p data-i18n="services.packages.desc">根据用途和规模提供最优动作捕捉录制服务</p>
<p class="vat-notice-inline" data-i18n="services.packages.vatNotice">※ 所有价格均不含增值税</p>
</div>
<!-- 서비스 1: 모션캡처 녹화 서비스 -->
<div class="service-package">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-bullseye" aria-hidden="true"></i></span>
<h3 data-i18n="services.service1.title">服务1: 动作捕捉录制服务</h3>
<span class="package-badge" data-i18n="services.service1.badge">基础型</span>
</div>
<!-- 가격 카드들 -->
<div class="pricing-cards-wrapper">
<div class="pricing-cards stagger-children">
<div class="pricing-card team reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-user-group" aria-hidden="true"></i></span>
<h4 data-i18n="services.service1.team">2人使用</h4>
<span class="popular-badge" data-i18n="services.service1.teamPopular">热门</span>
</div>
<div class="price-display">
<span class="price-amount" data-i18n="services.service1.teamPrice">$150</span>
<span class="price-unit" data-i18n="services.service1.teamUnit">/小时</span>
</div>
<div class="card-features">
<ul>
<li data-i18n="services.service1.teamFeature1">2人同步动作录制</li>
<li data-i18n="services.service1.teamFeature2">角色间互动录制</li>
<li data-i18n="services.service1.teamFeature3">团队项目协作</li>
</ul>
</div>
</div>
<div class="pricing-card extended reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-people-group" aria-hidden="true"></i></span>
<h4 data-i18n="services.service1.additional">额外人员</h4>
</div>
<div class="price-display">
<span class="price-amount" data-i18n="services.service1.additionalPrice">+$75</span>
<span class="price-unit" data-i18n="services.service1.additionalUnit">/人/小时</span>
</div>
<div class="card-features">
<ul>
<li data-i18n="services.service1.additionalFeature1">最多5人同步录制</li>
<li data-i18n="services.service1.additionalFeature2">多人动作捕捉</li>
<li data-i18n="services.service1.additionalFeature3">群体编舞/表演录制</li>
</ul>
</div>
</div>
</div>
<div class="service-info">
<div class="info-card">
<span class="info-icon"><i class="fa-solid fa-users" aria-hidden="true"></i></span>
<p data-i18n-html="services.service1.minPerson">最少使用人数: 2人</p>
</div>
<div class="info-card">
<span class="info-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<p data-i18n-html="services.service1.minTime">最少使用时间: 2小时</p>
</div>
<div class="info-card">
<span class="info-icon"><i class="fa-solid fa-users" aria-hidden="true"></i></span>
<p data-i18n-html="services.service1.maxPerson">最多同时使用: 5人</p>
</div>
</div>
</div>
<!-- 기술 사양 (컴팩트) -->
<div class="tech-specs-compact">
<h5 data-i18n="services.service1.techTitle">提供的技术与服务</h5>
<div class="specs-list">
<div class="spec-tag"><span><i class="fa-solid fa-video" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech1">OptiTrack 30台摄像头</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-robot" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech2">实时虚拟形象录制</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-user" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech3">全身/面部捕捉</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-chart-bar" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech4">实时监控</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-user-gear" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech5">专业操作员</span></div>
<div class="spec-tag"><span><i class="fa-solid fa-floppy-disk" aria-hidden="true"></i></span> <span data-i18n="services.service1.tech6">提供动作数据</span></div>
</div>
</div>
<div class="service-note">
<p data-i18n-html="services.service1.note">虚拟形象重定向服务不包含在基础服务中,如需后续对接可通过单独咨询提供。</p>
</div>
</div>
<!-- 결합상품 -->
<div class="service-package">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i></span>
<h3 data-i18n="services.combo.title">组合产品</h3>
<span class="package-badge" data-i18n="services.combo.badge">特色服务</span>
</div>
<div class="combo-services">
<div class="combo-card">
<h4 data-i18n="services.combo.mvTitle">音乐视频/短视频实时拍摄</h4>
<div class="combo-pricing">
<span class="price" data-i18n="services.combo.mvPrice">与动作捕捉相同费用</span>
</div>
<div class="combo-features">
<h5 data-i18n="services.combo.mvReqTitle">额外要求</h5>
<ul>
<li data-i18n="services.combo.mvReq1">需提前协商策划方案</li>
<li data-i18n="services.combo.mvReq2">角色/背景/道具需提前协商</li>
<li data-i18n="services.combo.mvReq3">如需聘请演员: $75 (每人每小时)</li>
</ul>
<div class="portfolio-preview">
<button class="portfolio-btn" onclick="openPortfolioPopup()">
<i class="fa-solid fa-film" aria-hidden="true"></i> <span data-i18n="services.combo.mvPortfolio">查看作品集</span>
</button>
</div>
</div>
</div>
<div class="combo-card">
<h4 data-i18n="services.combo.remoteTitle">远程拍摄</h4>
<div class="combo-pricing">
<span class="price" data-i18n="services.combo.remotePrice">与动作捕捉相同费用</span>
</div>
<div class="combo-features">
<h5 data-i18n="services.combo.remoteServiceTitle">服务内容</h5>
<ul>
<li data-i18n="services.combo.remoteService1">支持远程实时拍摄</li>
<li data-i18n="services.combo.remoteService2">可在线指导</li>
<li data-i18n="services.combo.remoteService3">实时直播推流</li>
</ul>
<h5 data-i18n="services.combo.remoteExtraTitle">额外费用</h5>
<ul>
<li data-i18n="services.combo.remoteExtra1">演员聘请费: $75 (每人每小时)</li>
</ul>
</div>
</div>
</div>
</div>
<!-- 서비스 2: 스트리밍글 서비스 -->
<div class="service-package featured">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-star" aria-hidden="true"></i></span>
<h3 data-i18n="services.service2.title">服务2: Streamingle 直播服务</h3>
<span class="package-badge featured" data-i18n="services.service2.badge">代表产品</span>
</div>
<!-- 스트리밍글 패키지 선택 -->
<div class="pricing-cards-wrapper">
<div class="pricing-cards stagger-children">
<div class="pricing-card team reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<h4 data-i18n="services.service2.pkg4h">4小时套餐</h4>
<span class="popular-badge" data-i18n="services.service2.pkg4hBadge">NEW</span>
</div>
<div class="price-display">
<span class="price-amount" data-i18n="services.service2.pkg4hPrice">$1,100</span>
<span class="price-unit" data-i18n="services.service2.pkg4hUnit">/ 1~5人使用</span>
</div>
<div class="card-features">
<ul>
<li data-i18n="services.service2.pkg4hFeature1">共4小时使用</li>
<li data-i18n="services.service2.pkg4hFeature2">场地租赁2小时 + 拍摄准备2小时</li>
<li data-i18n="services.service2.pkg4hFeature3">享受与6小时套餐相同的权益</li>
</ul>
</div>
</div>
<div class="pricing-card extended reveal" data-reveal="up">
<div class="card-header">
<span class="person-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<h4 data-i18n="services.service2.pkg6h">6小时套餐</h4>
</div>
<div class="price-display">
<span class="price-amount" data-i18n="services.service2.pkg6hPrice">$1,500</span>
<span class="price-unit" data-i18n="services.service2.pkg6hUnit">/ 1~5人使用</span>
</div>
<div class="card-features">
<ul>
<li data-i18n="services.service2.pkg6hFeature1">共6小时使用</li>
<li data-i18n="services.service2.pkg6hFeature2">场地租赁4小时 + 拍摄准备2小时</li>
<li data-i18n="services.service2.pkg6hFeature3">适合大型项目</li>
</ul>
</div>
</div>
</div>
</div>
<div class="streaming-package">
<p class="streaming-common-label"><i class="fa-solid fa-circle-info" aria-hidden="true"></i> <span data-i18n="services.service2.commonLabel">以下权益适用于4小时和6小时套餐</span></p>
<div class="package-features">
<div class="feature-column">
<h5 data-i18n="services.service2.benefitsTitle">通用包含权益</h5>
<ul>
<li data-i18n="services.service2.benefit1">每人1套角色免费设置</li>
<li data-i18n="services.service2.benefit2">现有背景中2个免费设置</li>
<li data-i18n="services.service2.benefit3">道具免费设置新道具最多6个现有道具不限量</li>
<li data-i18n="services.service2.benefit4">动作捕捉录制服务</li>
<li data-i18n="services.service2.benefit5">实时视频拍摄</li>
<li data-i18n="services.service2.benefit6">直播服务</li>
</ul>
</div>
<div class="feature-column">
<h5 data-i18n="services.service2.featuresTitle">服务特点</h5>
<ul>
<li data-i18n="services.service2.feature1">支持大型项目</li>
<li data-i18n="services.service2.feature2">提供综合拍摄环境</li>
<li data-i18n="services.service2.feature3">实时直播Streamingle专属</li>
<li data-i18n="services.service2.feature4">专业团队全程服务</li>
<li data-i18n="services.service2.feature5">1~5人自由选择</li>
</ul>
</div>
</div>
<div class="portfolio-preview">
<button class="portfolio-btn" onclick="openStreamingPortfolioPopup()">
<i class="fa-solid fa-circle" style="color: #ff0000" aria-hidden="true"></i> <span data-i18n="services.service2.livePortfolio">查看直播作品集</span>
</button>
</div>
</div>
</div>
<!-- 서비스 3: 뮤직비디오 제작 서비스 -->
<div class="service-package mv-production">
<div class="package-header">
<span class="package-icon"><i class="fa-solid fa-clapperboard" aria-hidden="true"></i></span>
<h3 data-i18n="services.service3.title">服务3: 音乐视频制作服务</h3>
<span class="package-badge" data-i18n="services.service3.badge">高级版</span>
</div>
<div class="mv-intro">
<p data-i18n="services.service3.intro">从策划到交付,全方位支持专业音乐视频制作的全过程。</p>
<div class="mv-price-summary">
<span class="price-range" data-i18n="services.service3.priceRange">预计总费用: $1,500 ~ $3,000</span>
<span class="price-note" data-i18n="services.service3.priceNote1">※ 以上费用为大致预估金额,具体报价可能根据项目规模和需求有所变动。</span>
<span class="price-note" data-i18n="services.service3.priceNote2">※ 费用会根据背景制作范围、分镜师费用、虚拟形象/道具数量、导演难度等因素浮动。</span>
</div>
</div>
<!-- 제작 프로세스 -->
<div class="mv-process">
<h4 data-i18n="services.service3.processTitle">制作流程7个阶段</h4>
<div class="process-steps">
<div class="mv-step">
<div class="step-icon">1</div>
<div class="step-details">
<h5 data-i18n="services.service3.step1Title">策划咨询(免费)</h5>
<p data-i18n="services.service3.step1Desc">音乐视频制作的起始阶段,梳理概念和风格。</p>
<p class="detail-note" data-i18n="services.service3.step1Note">※ 方向明确后,后续制作才能顺利推进。</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">2</div>
<div class="step-details">
<h5 data-i18n="services.service3.step2Title">背景制作</h5>
<p data-i18n="services.service3.step2Desc">可根据版权归属选择不同方案。</p>
<div class="pricing-options">
<div class="pricing-option">
<span class="option-type" data-i18n="services.service3.step2Opt1Type">使用现有背景</span>
<span class="option-price" data-i18n="services.service3.step2Opt1Price">$25/个</span>
<span class="option-note" data-i18n="services.service3.step2Opt1Note">版权: 归公司所有</span>
</div>
<div class="pricing-option">
<span class="option-type" data-i18n="services.service3.step2Opt2Type">全新制作(归公司所有)</span>
<span class="option-price" data-i18n="services.service3.step2Opt2Price">$80/个</span>
<span class="option-note" data-i18n="services.service3.step2Opt2Note">版权: 归公司所有(大型或特殊背景可能受限)</span>
</div>
<div class="pricing-option">
<span class="option-type" data-i18n="services.service3.step2Opt3Type">全新制作(归客户所有)</span>
<span class="option-price" data-i18n="services.service3.step2Opt3Price">$150 ~ $700/个</span>
<span class="option-note" data-i18n="services.service3.step2Opt3Note">版权: 归客户所有(根据规模和细节有所变动)</span>
</div>
</div>
<div class="process-note">
<p><i class="fa-solid fa-thumbtack" aria-hidden="true"></i> <span data-i18n="services.service3.step2ProcessNote">以Unity构建方式交付可确认摄像机视角</span></p>
</div>
</div>
</div>
<div class="mv-step">
<div class="step-icon">3</div>
<div class="step-details">
<h5 data-i18n="services.service3.step3Title">分镜脚本编写</h5>
<div class="step-pricing">
<span class="price-amount" data-i18n="services.service3.step3Price">$75起</span>
</div>
<p data-i18n="services.service3.step3Desc">由外部专业编剧将音乐视频的流程具象化。</p>
<p class="detail-note" data-i18n="services.service3.step3Note">※ 与客户共享,提前确认导演风格和镜头切换</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">4</div>
<div class="step-details">
<h5 data-i18n="services.service3.step4Title">虚拟形象设置与道具制作</h5>
<div class="step-pricing">
<span class="price-label" data-i18n="services.service3.step4AvatarLabel">虚拟形象设置:</span>
<span class="price-amount" data-i18n="services.service3.step4AvatarPrice">$40/个</span>
</div>
<div class="step-pricing">
<span class="price-label" data-i18n="services.service3.step4PropLabel">剧情用道具:</span>
<span class="price-amount" data-i18n="services.service3.step4PropPrice">$15/个</span>
</div>
<p data-i18n="services.service3.step4Desc">根据音乐视频环境优化虚拟形象。</p>
<p class="detail-note" data-i18n="services.service3.step4Note">※ 可进行虚拟形象修改和优化</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">5</div>
<div class="step-details">
<h5 data-i18n="services.service3.step5Title">动作捕捉</h5>
<div class="mv-mocap-pricing">
<h6 data-i18n="services.service3.step5StudioLabel">动作捕捉工作室场地租赁费用</h6>
<div class="step-pricing">
<span class="price-label" data-i18n="services.service3.step5Solo">1人使用:</span>
<span class="price-amount" data-i18n="services.service3.step5SoloPrice">$110/小时</span>
</div>
<div class="step-pricing">
<span class="price-label" data-i18n="services.service3.step5Duo">2人使用:</span>
<span class="price-amount" data-i18n="services.service3.step5DuoPrice">$150/小时</span>
</div>
<div class="step-pricing">
<span class="price-label" data-i18n="services.service3.step5Extra">额外人员:</span>
<span class="price-amount" data-i18n="services.service3.step5ExtraPrice">+$75/人/小时</span>
<span class="price-note" data-i18n="services.service3.step5ExtraNote">最多5人</span>
</div>
</div>
<div class="mv-mocap-pricing">
<h6 data-i18n="services.service3.step5ActorLabel">演员聘请费用</h6>
<div class="step-pricing">
<span class="price-label" data-i18n="services.service3.step5Actor">演员聘请:</span>
<span class="price-amount" data-i18n="services.service3.step5ActorPrice">$75/人/小时</span>
</div>
</div>
<p data-i18n="services.service3.step5Desc">根据分镜脚本录制动作。</p>
<p class="detail-note" data-i18n="services.service3.step5Note1">※ 拍摄周期: 约1~2天</p>
<p class="detail-note" data-i18n="services.service3.step5Note2">※ 最少使用: 2小时</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">6</div>
<div class="step-details">
<h5 data-i18n="services.service3.step6Title">视觉开发与导演</h5>
<div class="step-pricing">
<span class="price-amount" data-i18n="services.service3.step6Price">$360起</span>
</div>
<p data-i18n="services.service3.step6Desc">在Unity中进行后期处理、美术设计、摄像机运动等工作。</p>
<p class="detail-note" data-i18n="services.service3.step6Note">※ 根据导演复杂度和质量要求有所变动</p>
</div>
</div>
<div class="mv-step">
<div class="step-icon">7</div>
<div class="step-details">
<h5 data-i18n="services.service3.step7Title">最终反馈与交付</h5>
<p data-i18n="services.service3.step7Desc">完成的视频经客户反馈修改后进行最终交付。</p>
<p class="detail-note" data-i18n="services.service3.step7Note">※ 交付格式: mp4/mov等</p>
</div>
</div>
</div>
</div>
<div class="service-note">
<p data-i18n-html="services.service3.processNote">策划咨询(免费) → 整体报价 → 报价确认后开始制作第2~7阶段依次推进</p>
</div>
</div>
</div>
</section>
<!-- 추가 옵션 요금 -->
<section class="section bg-light">
<div class="container">
<div class="section-header">
<h2 data-i18n="services.options.title">附加选项费用</h2>
<p data-i18n="services.options.desc">适用于所有服务套餐的通用附加选项</p>
</div>
<div class="vat-notice-header">
<p><em data-i18n="services.options.vatNote">*不含增值税</em></p>
</div>
<div class="options-grid stagger-children">
<!-- 캐릭터 세팅 -->
<div class="option-card reveal" data-reveal="up">
<div class="option-header">
<span class="option-icon"><i class="fa-solid fa-palette" aria-hidden="true"></i></span>
<h3 data-i18n="services.options.charSetup">角色设置</h3>
</div>
<div class="option-pricing">
<div class="price">
<span class="price-amount" data-i18n="services.options.charPrice">$40起</span>
<span class="price-unit" data-i18n="services.options.charUnit">/ 每人1套</span>
</div>
<p class="option-description" data-i18n="services.options.charDesc">新角色设置工作</p>
</div>
</div>
<!-- 배경 세팅 -->
<div class="option-card reveal" data-reveal="up">
<div class="option-header">
<span class="option-icon"><i class="fa-solid fa-mountain-sun" aria-hidden="true"></i></span>
<h3 data-i18n="services.options.bgSetup">背景设置</h3>
</div>
<div class="option-content">
<div class="option-item">
<h4 data-i18n="services.options.bgExisting">使用现有背景</h4>
<div class="price">
<span class="price-amount" data-i18n="services.options.bgExistingPrice">$25起</span>
<span class="price-unit" data-i18n="services.options.bgExistingUnit">/ 1个</span>
</div>
<p class="option-note" data-i18n="services.options.bgExistingNote">仅收取设置费</p>
</div>
<div class="option-item">
<h4 data-i18n="services.options.bgNew">全新背景制作</h4>
<div class="price">
<span class="price-amount" data-i18n="services.options.bgNewPrice">$80起</span>
<span class="price-unit" data-i18n="services.options.bgNewUnit">/ 1个</span>
</div>
<p class="option-note" data-i18n-html="services.options.bgNewNote">设置费 + 制作费/购买费另计
可选择归属Mingle Studio或委托方</p>
</div>
</div>
</div>
<!-- 프랍 세팅 -->
<div class="option-card reveal" data-reveal="up">
<div class="option-header">
<span class="option-icon"><i class="fa-solid fa-masks-theater" aria-hidden="true"></i></span>
<h3 data-i18n="services.options.propSetup">道具设置</h3>
</div>
<div class="option-pricing">
<div class="price">
<span class="price-amount" data-i18n="services.options.propPrice">$15</span>
<span class="price-unit" data-i18n="services.options.propUnit">/ 1个</span>
</div>
<p class="option-description" data-i18n-html="services.options.propDesc">道具设置工作
Streamingle服务: 新道具最多6个现有道具不限量免费提供</p>
</div>
</div>
</div>
<!-- 이용 안내사항 -->
<div class="usage-notes">
<h3 data-i18n="services.usage.title">使用须知</h3>
<div class="notes-grid">
<div class="note-item">
<h4 data-i18n="services.usage.hours">营业时间</h4>
<p data-i18n-html="services.usage.hoursDesc">基本营业时间: 10:00 ~ 22:00
夜间使用费用按1.5倍计算</p>
</div>
<div class="note-item">
<h4 data-i18n="services.usage.minTime">最少使用时间</h4>
<p data-i18n-html="services.usage.minTimeDesc">所有服务最少2小时
Streamingle服务除外</p>
</div>
<div class="note-item">
<h4 data-i18n="services.usage.preparation">事前准备事项</h4>
<p data-i18n-html="services.usage.preparationDesc">拍摄音乐视频/短视频时
需提前协商策划方案和准备物品</p>
</div>
<div class="note-item">
<h4 data-i18n="services.usage.followUp">后续服务</h4>
<p data-i18n-html="services.usage.followUpDesc">虚拟形象重定向仅在后续工作对接时
提供(需单独咨询)</p>
</div>
</div>
</div>
</div>
</section>
<!-- 서비스 이용 안내 -->
<section class="section bg-light">
<div class="container">
<div class="section-header">
<h2 data-i18n="services.guide.title">服务使用指南</h2>
</div>
<!-- 스튜디오 대관 절차 -->
<div class="card card--flat reveal" data-reveal="fade">
<h3 data-i18n="services.guide.processTitle">场地租赁流程</h3>
<div class="process-flow">
<div class="process-step">
<div class="step-number">1</div>
<div class="step-content">
<h4 data-i18n="services.guide.step1">邮件咨询</h4>
<p data-i18n="services.guide.step1Desc">填写预约表格发送咨询</p>
</div>
</div>
<div class="process-arrow"></div>
<div class="process-step">
<div class="step-number">2</div>
<div class="step-content">
<h4 data-i18n="services.guide.step2">负责人确认与协商</h4>
<p data-i18n="services.guide.step2Desc">协调详细事项</p>
</div>
</div>
<div class="process-arrow"></div>
<div class="process-step">
<div class="step-number">3</div>
<div class="step-content">
<h4 data-i18n="services.guide.step3">全额支付</h4>
<p data-i18n="services.guide.step3Desc">完成支付</p>
</div>
</div>
<div class="process-arrow"></div>
<div class="process-step">
<div class="step-number">4</div>
<div class="step-content">
<h4 data-i18n="services.guide.step4">预约确认</h4>
<p data-i18n="services.guide.step4Desc">最终完成预约</p>
</div>
</div>
</div>
<div class="booking-buttons">
<button id="showEmailForm" class="btn btn-primary">
<span><i class="fa-solid fa-envelope" aria-hidden="true"></i></span> <span data-i18n="services.guide.btnEmail">发送邮件咨询</span>
</button>
<a href="https://m.booking.naver.com/booking/10/bizes/1468174/items/6949481" target="_blank" class="btn btn-secondary">
<span><i class="fa-solid fa-calendar" aria-hidden="true"></i></span> <span data-i18n="services.guide.btnNaver">前往Naver预约</span>
</a>
</div>
<p class="booking-note" data-i18n="services.guide.naverNote">※ 可通过Naver Place实时查看日程并预约</p>
<!-- 이메일 양식 -->
<div id="emailForm" class="email-form" style="display:none;">
<h4>이메일 문의 양식</h4>
<p>아래 양식을 복사하여 이메일로 문의해주세요:</p>
<div class="email-template">
<div class="email-field"><strong>제목:</strong> [스튜디오 대관 문의]</div>
<div class="email-field"><strong>받는 사람:</strong> help@minglestudio.co.kr</div>
<div class="form-section">
<h5>1. 성함 및 소속</h5>
<p class="form-help">(개인의 경우 성함만, 기업인 경우 이용자분 성함과 소속을 함께 적어주세요)</p>
<div class="form-placeholder">[여기에 작성해주세요]</div>
</div>
<div class="form-section">
<h5>2. 연락처</h5>
<p class="form-help">(전화번호, 이메일, 디스코드 중 택1)</p>
<div class="form-placeholder">[여기에 작성해주세요]</div>
</div>
<div class="form-section">
<h5>3. 이용 인원</h5>
<p class="form-help">(1~2인 권장, 최대 5인까지 가능)</p>
<div class="form-placeholder">□ 1명 □ 2명 □ 3명 □ 4명 □ 5명</div>
</div>
<div class="form-section">
<h5>4. 스튜디오 사용 용도</h5>
<div class="form-placeholder">□ 녹화 □ 기타: [여기에 작성해주세요]</div>
</div>
<div class="form-section">
<h5>5. 희망 대관 날짜</h5>
<p class="form-help">※ 최소 2주 전 예약을 권장합니다</p>
<div class="form-placeholder">[여기에 작성해주세요]</div>
</div>
<div class="form-section">
<h5>6. 희망 이용 시간</h5>
<p class="form-help">※ 응답 예시) 오전 10시~ 오후 3시(5시간)</p>
<p class="form-help">※ 새벽 대관(밤 10시~익일 8시) 이용 시 내부 규정에 따른 별도 요율이 적용됩니다</p>
<div class="form-placeholder">[여기에 작성해주세요]</div>
</div>
</div>
<div class="email-send">
<a href="mailto:help@minglestudio.co.kr?subject=[스튜디오 예약 문의] 밍글 스튜디오&amp;body=안녕하세요. 밍글 스튜디오 대관 예약 문의 드립니다.%0A%0A■ 기본 정보%0A- 이용 예정일: (예: 2024년 12월 25일)%0A- 이용 시간: (예: 오후 2시 ~ 4시, 2시간)%0A- 참여 인원: 명%0A- 연락처: %0A- 이메일: %0A%0A■ 촬영 정보%0A- 촬영 목적: (예: 모션캡처 녹화, 게임 제작, 뮤직비디오 제작 등)%0A- 예상 촬영 내용: %0A- 필요한 장비: (전신 모션캡쳐 / 페이셜 캡쳐 / 기타)%0A%0A■ 추가 요청사항%0A- 특별한 요구사항: %0A- 문의사항: %0A%0A■ 참고사항%0A- 최소 대관: 2시간 (2인 200,000원~/시간, VAT 별도)%0A- 인원 추가: 추가 인원 +100,000원~/명/시간%0A- 결제방법: 계좌이체 또는 현금 (카드결제 불가)%0A- 현금영수증/세금계산서 발행 가능%0A%0A빠른 시일 내에 답변 드리겠습니다.%0A감사합니다." class="btn btn-primary">
<i class="fa-solid fa-envelope" aria-hidden="true"></i> 이메일 바로 보내기
</a>
</div>
</div>
</div>
<!-- 예약 및 취소 규정 -->
<div class="grid grid-2">
<div class="card card--flat reveal" data-reveal="fade">
<h3 data-i18n="services.policy.reservationTitle">预约须知</h3>
<ul class="info-list">
<li data-i18n="services.policy.reservation1">建议在您希望使用的日期前至少2周进行预约申请。</li>
<li data-i18n="services.policy.reservation2">预约确认后因客户原因取消预约时,将根据取消政策收取违约金。</li>
</ul>
</div>
<div class="card card--flat reveal" data-reveal="fade">
<h3 data-i18n="services.policy.visitTitle">到访须知</h3>
<ul class="info-list">
<li data-i18n="services.policy.visit1">由于正式拍摄前需要穿戴动作捕捉服等准备工作请在预定拍摄时间前至少30分钟到达。准备时间不包含在使用时间内。</li>
<li data-i18n="services.policy.visit2">拍摄时请尽量避免佩戴眼镜、耳环等反光材质的配饰。</li>
</ul>
</div>
</div>
<!-- 취소 환불 규정 -->
<div class="card card--flat reveal" data-reveal="fade">
<h3 data-i18n="services.policy.refundTitle">取消退款政策</h3>
<div class="table-responsive">
<table class="refund-table">
<thead>
<tr>
<th scope="col" data-i18n="services.policy.refundColTime">取消时间</th>
<th scope="col" data-i18n="services.policy.refundColRate">退款比例</th>
</tr>
</thead>
<tbody>
<tr>
<td data-i18n="services.policy.refund7days">预约日7天前</td>
<td class="refund-100" data-i18n="services.policy.refund100">100%退款</td>
</tr>
<tr>
<td data-i18n="services.policy.refund3days">预约日3天前</td>
<td class="refund-70" data-i18n="services.policy.refund70">70%退款</td>
</tr>
<tr>
<td data-i18n="services.policy.refund1day">预约日1天前</td>
<td class="refund-50" data-i18n="services.policy.refund50">50%退款</td>
</tr>
<tr>
<td data-i18n="services.policy.refundSameDay">当天取消</td>
<td class="refund-0" data-i18n="services.policy.refundNone">不可退款</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="cta-section">
<div class="container text-center">
<h2>지금 바로 예약하세요</h2>
<p>최고의 모션캡쳐 경험을 제공해드립니다</p>
<div class="cta-buttons">
<a href="contact.html" class="btn btn-primary btn-lg">예약 문의하기</a>
<a href="gallery.html" class="btn btn-outline btn-lg">스튜디오 둘러보기</a>
</div>
</div>
</section>
</main>
<!-- 푸터 -->
<div id="footer-placeholder">
<!-- 공통 푸터 컴포넌트 -->
<footer class="site-footer">
<div class="container">
<div class="footer-grid">
<div class="footer-section">
<h3 class="footer-heading" data-i18n="footer.companyInfo">公司信息</h3>
<ul class="footer-list">
<li><strong data-i18n="footer.companyName">Mingle Studio</strong></li>
<li data-i18n="footer.ceo">代表: 김희진</li>
<li data-i18n="footer.businessNumber">营业执照号: 208-12-73755</li>
</ul>
</div>
<div class="footer-section">
<h3 class="footer-heading" data-i18n="footer.contact">联系方式</h3>
<ul class="footer-list">
<li><a href="tel:+82-10-9288-9190"><i class="fa-solid fa-phone" aria-hidden="true"></i> 010-9288-9190</a></li>
<li><a href="mailto:minglestudio@minglestudio.co.kr"><i class="fa-solid fa-briefcase" aria-hidden="true"></i> <span data-i18n="footer.businessInquiry">商务咨询</span></a></li>
<li><a href="mailto:help@minglestudio.co.kr"><i class="fa-solid fa-envelope" aria-hidden="true"></i> <span data-i18n="footer.reservationInquiry">预约咨询</span></a></li>
</ul>
</div>
<div class="footer-section">
<h3 class="footer-heading" data-i18n="footer.directions">交通指南</h3>
<ul class="footer-list">
<li><i class="fa-solid fa-location-dot" aria-hidden="true"></i> <span data-i18n="footer.address">仁川广域市富平区主夫吐路236</span></li>
<li data-i18n="footer.addressDetail">仁川科技谷U1中心 A栋 B105号</li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p data-i18n="footer.copyright">© 2025 Mingle Studio. All rights reserved.</p>
</div>
</div>
</footer>
</div>
<!-- 백업 푸터 (JavaScript 로드 실패 시) -->
<footer class="site-footer" id="backupFooter">
<div class="container">
<div class="footer-grid">
<div class="footer-section">
<h3 class="footer-heading">회사 정보</h3>
<ul class="footer-list">
<li><strong>밍글 스튜디오</strong></li>
<li>대표: 김희진</li>
<li>사업자등록번호: 208-12-73755</li>
</ul>
</div>
<div class="footer-section">
<h3 class="footer-heading">연락처</h3>
<ul class="footer-list">
<li><a href="tel:+82-10-9288-9190"><i class="fa-solid fa-phone" aria-hidden="true"></i> 010-9288-9190</a></li>
<li><a href="mailto:minglestudio@minglestudio.co.kr"><i class="fa-solid fa-briefcase" aria-hidden="true"></i> 비즈니스 문의</a></li>
<li><a href="mailto:help@minglestudio.co.kr"><i class="fa-solid fa-envelope" aria-hidden="true"></i> 예약 문의</a></li>
</ul>
</div>
<div class="footer-section">
<h3 class="footer-heading">오시는 길</h3>
<ul class="footer-list">
<li><i class="fa-solid fa-location-dot" aria-hidden="true"></i> 인천광역시 부평구 주부토로 236</li>
<li>인천테크노밸리 U1센터 A동 B105호</li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p>© 2025 밍글 스튜디오. All rights reserved.</p>
</div>
</div>
</footer>
<!-- 포트폴리오 팝업 -->
<div id="portfolioPopup" class="portfolio-popup" role="dialog" aria-label="뮤직비디오/숏폼 포트폴리오">
<div class="popup-overlay" onclick="closePortfolioPopup()"></div>
<div class="popup-content">
<div class="popup-header">
<h3>뮤직비디오/숏폼 포트폴리오</h3>
<button class="popup-close" onclick="closePortfolioPopup()" aria-label="팝업 닫기">×</button>
</div>
<div class="popup-body">
<div class="portfolio-section">
<h4><i class="fa-solid fa-music" aria-hidden="true"></i> 뮤직비디오 대표작</h4>
<div class="portfolio-grid">
<div class="portfolio-item">
<div class="video-wrapper">
<iframe src="https://www.youtube.com/embed/jQTi8adbvaM" title="돌림판" allowfullscreen=""></iframe>
</div>
<p>머쉬베놈 - 돌림판 (CROA COVER)</p>
</div>
<div class="portfolio-item">
<div class="video-wrapper">
<iframe src="https://www.youtube.com/embed/nH7IdgqhugQ" title="내 이름 맑음" allowfullscreen=""></iframe>
</div>
<p>QWER - 내 이름 맑음 (CROA COVER)</p>
</div>
</div>
</div>
<div class="portfolio-section">
<h4><i class="fa-solid fa-clapperboard" aria-hidden="true"></i> 숏폼 챌린지</h4>
<div class="portfolio-grid shorts-grid">
<div class="portfolio-item">
<div class="video-wrapper shorts-wrapper">
<iframe src="https://www.youtube.com/embed/ZWftEFNlvVc" title="일본 유행 챌린지" allowfullscreen=""></iframe>
</div>
<p>일본에서 유행하는 챌린지</p>
</div>
<div class="portfolio-item">
<div class="video-wrapper shorts-wrapper">
<iframe src="https://www.youtube.com/embed/xZS1e465wjc" title="Trouble 챌린지" allowfullscreen=""></iframe>
</div>
<p>Trouble 챌린지</p>
</div>
<div class="portfolio-item">
<div class="video-wrapper shorts-wrapper">
<iframe src="https://www.youtube.com/embed/X3a_4GWU3V8" title="그르르 챌린지" allowfullscreen=""></iframe>
</div>
<p>그르르 챌린지</p>
</div>
</div>
</div>
</div>
<div class="popup-footer">
<a href="portfolio.html" class="btn btn-primary">전체 포트폴리오 보기</a>
</div>
</div>
</div>
<!-- 스트리밍 포트폴리오 팝업 -->
<div id="streamingPortfolioPopup" class="portfolio-popup" role="dialog" aria-label="스트리밍글 서비스 포트폴리오">
<div class="popup-overlay" onclick="closeStreamingPortfolioPopup()"></div>
<div class="popup-content">
<div class="popup-header">
<h3>스트리밍글 서비스 포트폴리오</h3>
<button class="popup-close" onclick="closeStreamingPortfolioPopup()" aria-label="팝업 닫기">×</button>
</div>
<div class="popup-body">
<div class="portfolio-section">
<h4><i class="fa-solid fa-circle" style="color: #ff0000" aria-hidden="true"></i> 실시간 모션캡처 방송</h4>
<div class="portfolio-grid streaming-grid">
<div class="portfolio-item">
<div class="video-wrapper">
<iframe src="https://vod.sooplive.co.kr/player/159808721" title="미르 첫 모캡 방송" allowfullscreen=""></iframe>
</div>
<div class="streaming-info">
<p><strong>미르 첫 모캡 방송</strong></p>
<div class="stream-details">
<span class="platform">SOOP</span>
<span class="streamer">미르</span>
</div>
</div>
</div>
<div class="portfolio-item">
<div class="video-wrapper">
<iframe src="https://vod.sooplive.co.kr/player/159683673" title="춤짱자매즈 모캡 합방" allowfullscreen=""></iframe>
</div>
<div class="streaming-info">
<p><strong>춤짱자매즈 모캡 합방</strong></p>
<div class="stream-details">
<span class="platform">SOOP</span>
<span class="streamer">춤짱자매즈 × 호발</span>
</div>
</div>
</div>
<div class="portfolio-item">
<div class="video-wrapper">
<iframe src="https://vod.sooplive.co.kr/player/159205533" title="크로아 링피트 치요X마늘 3D 모션캡쳐 합방" allowfullscreen=""></iframe>
</div>
<div class="streaming-info">
<p><strong>[크로아] 링피트 치요X마늘 3D 모션캡쳐 합방</strong></p>
<div class="stream-details">
<span class="platform">SOOP</span>
<span class="streamer">치요 &amp; 마늘</span>
</div>
</div>
</div>
<div class="portfolio-item">
<div class="video-wrapper">
<iframe src="https://vod.sooplive.co.kr/player/169085307" title="크로아 링피트 치요X마늘 3D 모션캡쳐 합방" allowfullscreen=""></iframe>
</div>
<div class="streaming-info">
<p><strong>[크로아] 링피트 치요X마늘 3D 모션캡쳐 합방</strong></p>
<div class="stream-details">
<span class="platform">SOOP</span>
<span class="streamer">치요 &amp; 마늘</span>
</div>
</div>
</div>
<div class="portfolio-item chzzk-item">
<div class="video-wrapper">
<div class="chzzk-thumbnail">
<img src="https://livecloud-thumb.akamaized.net/chzzk/kr/live-rewind-image/record/45386630/represent/thumbnail/image_14810881_720_0.jpg" alt="이무지 탄생일 방송 썸네일" class="thumbnail-img">
<div class="thumbnail-overlay">
<div class="chzzk-logo">치지직</div>
<div class="chzzk-center-logo">
<img src="Logo icon/chzzk Icon.png" alt="치지직 로고" class="chzzk-logo-img">
</div>
</div>
<a href="https://naver.me/5dA2JoP5" target="_blank" class="thumbnail-link"></a>
</div>
</div>
<div class="streaming-info">
<p><strong>이무지 탄생일 ! 🧸💛</strong></p>
<div class="stream-details">
<span class="platform">치지직</span>
<span class="streamer">이무지</span>
</div>
</div>
</div>
</div>
</div>
<div class="streaming-features">
<h4><i class="fa-solid fa-sparkles" aria-hidden="true"></i> 스트리밍글 서비스 특징</h4>
<div class="features-grid">
<div class="feature-item">
<span class="feature-icon"><i class="fa-solid fa-video" aria-hidden="true"></i></span>
<p>실시간 모션캡처 스트리밍</p>
</div>
<div class="feature-item">
<span class="feature-icon"><i class="fa-solid fa-users" aria-hidden="true"></i></span>
<p>최대 5인 동시 방송</p>
</div>
<div class="feature-item">
<span class="feature-icon"><i class="fa-solid fa-clock" aria-hidden="true"></i></span>
<p>6시간 풀 패키지</p>
</div>
<div class="feature-item">
<span class="feature-icon"><i class="fa-solid fa-masks-theater" aria-hidden="true"></i></span>
<p>캐릭터 &amp; 배경 세팅</p>
</div>
</div>
</div>
</div>
<div class="popup-footer">
<a href="portfolio.html#individual" class="btn btn-primary">전체 포트폴리오 보기</a>
</div>
</div>
</div>
<!-- JavaScript -->
<script src="/js/i18n.js"></script>
<script src="/js/common.js"></script>
<script src="/js/services.js"></script>
</body></html>