@charset "UTF-8";
/* CSS Document */

*{ font-family:'微软雅黑', Arial, sans-serif; letter-spacing:1px;}
body { background:#fff; overflow-x:hidden; line-height:1.8; font-size:14px; color:#1f2233; text-shadow:none;}
body.maroad-offcanvas { overflow:hidden;}
html, body { width:100%; height:100%; margin:0 auto;}
a { -webkit-transition:0.25s; -o-transition:0.25s; transition:0.25s;}
a:hover { text-decoration:none !important;}
p,ul,ol { margin-bottom:1.5em; color:#52585b;}
h1,h2,h3,h4,h5,h6 { font-weight:400;}
i, em{ font-style:normal;}
figure { margin-bottom:2em;}

::-webkit-selection { color:#fcfcfc; background:#f05050;}
::-moz-selection { color:#fcfcfc; background:#f05050;}
::selection { color:#fcfcfc; background:#f05050;}

#marod-header{ position:fixed; width:100%; height:70px; background:#ffffff !important; top:0; left:0; z-index:99999;}
.top-btn{ float:left; margin:15px 25px 0 20px;}

@media screen and (max-width:768px) { 
.top-btn{ margin:0;}
.top-btn a{ margin-bottom:25px;}
}

#marod-primary-menu .marod-sub-menu a { letter-spacing:0; padding:0 15px; font-size:14px; line-height:24px; color:#575757 !important; text-transform:none; background:none;}
#marod-work-section,
#marod-content-section,
#marod-work-section_2,
#marod-blog-section { width:100%; padding:7em 0; float:left;}

@media screen and (max-width:768px) { 
#marod-work-section,
#marod-content-section,
#marod-work-section_2,
#marod-blog-section { padding:3em 0;}
}

#marod-subscribe-section{ width:100%; float:left; padding:30px 0;}
.marod-bg-red { background:#f05050 !important;}
.marod-bg-gray { background:#f9faff !important;}
.marod-bg-dark { background:#e7e7ee !important;}
.marod-bg-purple { background:#7e68bd !important;}
.marod-bg-white { background:#ffffff !important;}

.marod-standblock{ padding:7em 0;}
.marod-testimonial { position:relative; background:#fff; padding:4em 0; border-radius:3px; -webkit-box-shadow:5px 10px 50px rgba(0, 0, 0, .08); -moz-box-shadow:5px 10px 50px rgba(0, 0, 0, .08); box-shadow:5px 10px 50px rgba(0, 0, 0, .08);}
@media screen and (max-width:768px) { .marod-testimonial { border-right:0; margin-bottom:80px;}
}
.marod-testimonial h2 { font-size:16px; letter-spacing:2px; font-weight:bold; margin-bottom:50px;}
.marod-testimonial figure { position:absolute; top:-50px; left:50%; margin-left:-44px; margin-bottom:20px; background-size:cover;}
.marod-testimonial figure img { width:88px; height:88px; border:10px solid #fff; background-size:cover; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; border-radius:50%;}
.marod-testimonial blockquote { border:none; margin-bottom:20px;}
.marod-testimonial blockquote p { font-size:14px; line-height:2; color:#505869;}
.marod-testimonial span { font-style:italic; font-size:18px;}

#marod-start-project-section { padding:7em 0; background:#f64e8b;}
#marod-start-project-section h2 { color:white; font-size:60px; font-weight:300;}
@media screen and (max-width:768px) { #marod-start-project-section h2 { font-size:30px;}
}
#marod-start-project-section a:hover, #marod-start-project-section a:focus, #marod-start-project-section a:active { color:white !important;}

#map { width:100%; height:500px; position:relative;}
@media screen and (max-width:768px) { #map { height:200px;}
}

.marod-social-icons > a { padding:4px 10px; color:#f05050;}
.marod-social-icons > a i { font-size:26px;}
.marod-social-icons > a:hover, .marod-social-icons > a:focus, .marod-social-icons > a:active { text-decoration:none; color:#5a5a5a;}

.btn { -webkit-transition:0.25s; -o-transition:0.25s; transition:0.25s;}
.btn { letter-spacing:2px; -webkit-transition:0.25s; -o-transition:0.25s; transition:0.25s;}
.btn.btn-primary { background:#f05050; color:#fff; border:none !important; border:2px solid transparent !important;}
.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus { box-shadow:none; background:#f05050; color:#ffffff !important;}
.btn:hover, .btn:active, .btn:focus { background:#393e46 !important; color:#fff; outline:none !important;}
.btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-default:active { border-color:transparent;}

.js .animate-box { opacity:0;}
#marod-wrapper { overflow-x:hidden; position:relative;}
.marod-offcanvas { overflow:hidden;}
.marod-offcanvas #marod-wrapper { overflow:hidden !important;}
#marod-page { position:relative; -webkit-transition:0.25s; -o-transition:0.25s; transition:0.25s;}
.marod-offcanvas #marod-page { -moz-transform:translateX(-240px); -webkit-transform:translateX(-240px); -ms-transform:translateX(-240px); -o-transform:translateX(-240px); transform:translateX(-240px);}

@media screen and (max-width:768px) { 
#marod-menu-wrap { display:none;}
}

#offcanvas-menu { position:fixed; top:0; bottom:0 !important; z-index:99; background:#222222; right:-240px; width:240px; padding:20px; overflow-y:scroll !important; z-index:999999;}
#offcanvas-menu ul { padding:0; margin:0;}
#offcanvas-menu ul li { padding:0; margin:0 0 10px 0; list-style:none;}
#offcanvas-menu ul li a { font-size:18px; color:rgba(255, 255, 255, 0.4);}
#offcanvas-menu ul li > .marod-sub-menu { margin-top:9px; padding-left:20px;}
#offcanvas-menu ul .marod-sub-menu { display:block !important;}

.marod-nav-toggle { cursor:pointer; text-decoration:none;}
.marod-nav-toggle.active i::before, .marod-nav-toggle.active i::after { background:#fff;}
.marod-nav-toggle.dark.active i::before, .marod-nav-toggle.dark.active i::after { background:#fff;}
.marod-nav-toggle:hover, .marod-nav-toggle:focus, .marod-nav-toggle:active { outline:none; border-bottom:none !important;}
.marod-nav-toggle i { position:relative; display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline; width:30px; height:2px; color:#f05050; font:bold 14px/.4 Helvetica; text-indent:-55px; background:#fff; transition:all .2s ease-out;}
.marod-nav-toggle i::before, .marod-nav-toggle i::after { content:''; width:30px; height:2px; background:#fff; position:absolute; left:0; -webkit-transition:0.25s; -o-transition:0.25s; transition:0.25s;}
.marod-nav-toggle.dark i { position:relative; color:#000000; background:#000000; transition:all .2s ease-out;}
.marod-nav-toggle.dark i::before, .marod-nav-toggle.dark i::after { background:#000000; -webkit-transition:0.25s; -o-transition:0.25s; transition:0.25s;}
.marod-nav-toggle i::before { top:-7px;}
.marod-nav-toggle i::after { bottom:-7px;}
.marod-nav-toggle:hover i::before { top:-10px;}
.marod-nav-toggle:hover i::after { bottom:-10px;}
.marod-nav-toggle.active i { background:transparent;}
.marod-nav-toggle.active i::before { top:0; -webkit-transform:rotateZ(45deg); -moz-transform:rotateZ(45deg); -ms-transform:rotateZ(45deg); -o-transform:rotateZ(45deg); transform:rotateZ(45deg);}
.marod-nav-toggle.active i::after { bottom:0; -webkit-transform:rotateZ(-45deg); -moz-transform:rotateZ(-45deg); -ms-transform:rotateZ(-45deg); -o-transform:rotateZ(-45deg); transform:rotateZ(-45deg);}
.marod-nav-toggle { position:absolute; top:0px; right:0px; z-index:9999; display:block; margin:0 auto; display:none; cursor:pointer;}
@media screen and (max-width:768px) { 
.marod-nav-toggle { display:block; top:0px; margin-top:2em;}
}


.border-bottom { border-bottom:1px solid rgba(0, 0, 0, 0.06);}
.lead { line-height:1.8;}
.no-js #loader { display:none;}
.js #loader { display:block; position:absolute; left:100px; top:0;}
.marod-loader { position:fixed; left:0px; top:0px; width:100%; height:100%; z-index:9999; background:url(../images/hourglass.svg) center no-repeat #222222;}

.marod-subbox span{ width:100%; float:left; text-align:center;}
.marod-subbox span input{ width:300px; height:60px; border:none; border-radius:3px; box-shadow:0 5px 25px rgba(0,0,0,.05); outline:none !important; font-size:16px; margin-right:10px; text-indent:20px; transition:all 0.25s; color:#52585b;}
.marod-subbox span input:hover{ box-shadow:0 5px 30px rgba(0,0,0,.12);}
.marod-subbox span input, .marod-subbox span a{ display:inline-block; margin:8px 5px;}

@media screen and (max-width:768px) { 
.marod-subbox span input, .marod-subbox span a{ width:91%; margin:8px 4%;}
}

.marod-topblock{ width:100%; float:left; padding:7em 0;}
.marod-topbox{ width:100%; max-width:1200px; margin:0 auto}
.marod-topinner{ width:100%; float:left;}
.marod-topinner span{ width:100%; float:left; letter-spacing:1.6px; text-align:center; font-weight:300;}
.marod-topinner span.ltt { font-size:36px; color:#fff; margin-bottom:10px; line-height:1.4;}
.marod-topinner span.mtt { font-size:32px; color:#fff; margin-bottom:20px; line-height:1.4;}
.marod-topinner span.stt { font-size:16px; color:#fff; line-height:2;}
.marod-imgfull{ width:100%; float:left; margin-bottom:30px;}
.marod-imgfull img{ width:100%; height:auto;}
.marod-solubox{ width:100%; float:left; background:#fff; box-shadow:0 5px 35px rgba(0,0,0,.08); border-radius:3px; margin-bottom:30px;}
.marod-solubox:hover{ box-shadow:0 8px 35px rgba(0,0,0,.12); transition:all 0.25s;}
.marod-solubox .image-popup{ padding:0 25px 35px 25px;}
.marod-solubox img{ border-radius:5px 5px 0 0 !important; height:240px !important;}

.services { margin-bottom:1em;}
.services span{ display:block; text-align:center;}
.services span i { display:inline-block; width:90px; height:90px; background:#fff; font-size:52px; line-height:90px; color:#7e68bd; margin:40px 0 30px 0; border-radius:30%;}
.services h3 { font-size:20px; color:#fff; margin-bottom:1em;}
.services p{ font-size:12px; color:#fff; line-height:1.8;}

.marod-stand-box{ width:100%; float:left; height:100vh; padding:0 100px; background:#fff;}
.marod-stand-inner{ width:100%; float:left;}
.marod-stand-pic{ width:50%; float:left; height:100vh;}
.marod-stand-picbox{ position:relative; top:50%; transform:translateY(-50%); float:left;}
.marod-stand-txt{ width:40%; float:left; height:100vh;}
.marod-stand-txtbox{ position:relative; top:50%; transform:translateY(-50%); width:400px; margin:0 auto;}
.marod-stand-all{ width:100%; float:left; height:100vh; padding:50px 0;}
.marod-stand-allbox{ position:relative; top:50%; transform:translateY(-50%);}

.allcon-box{ width:100%; min-height:570px; display:table; vertical-align:middle;}
.allcon-inner{ width:100%; display:table-cell; vertical-align:middle;}
.allcon-right{ float:right;}

.marod-partner-box{ width:100%; float:left; background:#fff; box-shadow:0 5px 35px rgba(0,0,0,.08); border-radius:3px; padding:25px; margin-bottom:20px;}
.marod-partner-box:hover{ box-shadow:0 8px 35px rgba(0,0,0,.12); transition:all 0.25s;}
.pd-textbox{ padding:28% 15% 0 15%;}
.pd-textbox2{ padding:5% 10%;}

@media screen and (max-width:768px) {
.marod-topinner{ width:90%; float:left; margin:0 5%;}
.allcon-right{ float:left;}	
.pd-textbox{ padding:0 5%;}
.allcon-box{ min-height:auto !important; text-align:center !important;}
.allcon-none{ display:none;}
.marod-content-box{ width:100%; float:left; padding:3em 0;}
}

@media screen and (max-width:768px) { 
.marod-stand-box{ height:auto !important; padding:50px 5%;}
.marod-stand-pic{ width:100%; height:auto !important;}
.marod-stand-txt{ width:100%; height:auto !important;}
.marod-stand-picbox{ top:0; transform:none;}
.marod-stand-txtbox{ width:94%; top:0; transform:none; padding:0 3%;}
}

.table-purple{ width:100%; border:1px solid #ddd; background-color:transparent; border-collapse:collapse; border-spacing:0;}
.table-purple th, .table-purple td{ text-align:center; border:1px solid #eaeaea; background:#fff; padding:10px;}
.table-purple th{ background:#7dd79a; color:#fff; font-weight:bold;}
.table-white th{ font-size:20px; color:#f05050;}
.table-white td{ padding:10px 0 !important; border:solid 1px #fff;}

.Appoint-block{ width:100%; max-width:560px; margin:0 auto;}
.Appoint-box{ width:100%; float:left; background:#fff; box-shadow:0 10px 40px rgba(0,0,0,.06);}
.Appoint-inner{ width:84%; float:left; margin:25px 8%;}
.Appoint-top, .Appoint-mid, .Appoint-btom{ width:100%; float:left; margin:10px 0;}
.Appoint-top span{ width:100%; float:left; text-align:center; line-height:2; margin-bottom:10px;}
.Appoint-top span.ltt{ font-size:36px; line-height:1.2;}
.Appoint-mid span{ width:100%; float:left; text-align:left;}
.Appoint-mid span.infoword{ color:#999db0; margin:10px 0 5px 0;}
.Appoint-mid span input{ width:100%; border:solid 1px #e0e1e7; outline:none !important; text-indent:8px; line-height:32px; color:#171922; border-radius:3px; padding:0;}
.Appoint-mid span input:focus{ border:solid 1px #c0c1c7;}
.Appoint-mid span input.sty1{ width:70%; float:left;}
.Appoint-mid span a{ width:28%; float:right; height:34px; line-height:34px; background:#f3f3f3; text-align:center; border-radius:3px; background:#fff; border:solid 1px #7e68bd;}
.Appoint-mid span a:hover{ background:#7e68bd; color:#fff;}
.Appoint-btom{ margin-top:20px;}

.bg-side1{ position:fixed; right:-30px; top:-50px;}
.bg-side2{ position:fixed; left:0; top:50%;}
.logo-side{ position:fixed; left:15px; top:15px;}
.logo-side a{ width:170px; float:left;}
.logo-side img{ width:100%;}

@media screen and (max-width:1200px) { 
.Appoint-block{ margin-top:70px;}
}
@media screen and (max-width:768px) { 
.Appoint-block{ margin-top:70px;}
.bg-side1{ right:-180px;}
}
.hello-block{ width:100%; max-width:900px; margin:0 auto;}

/* New Styles 180913 */

.marod-conbox{ width:100%; float:left;}
.marod-conbox-tt{ width:100%; float:left;}
.marod-conbox-tt span{ width:100%; float:left; font-size:13px; line-height:1.8;}
.marod-conbox-tt span.stt{ font-size:24px; margin-bottom:10px; font-weight:300;}


.ma-column-3 a.probox{ color:#1f2233; transform:all 0.3s;}
.ma-column-3 a.probox:hover .marod-pro-info span.tt{ color:#f05050;}

.ma-nodata-block{ width:100%; float:left; height:calc(100% - 90px); margin-top:90px;}
.ma-nodata-box{ width:100%; height:100%; vertical-align:middle; display:table;}
.ma-nodata-inner{ width:100%; height:100%; vertical-align:middle; display:table-cell;}

.maroad-iconbox{ width:100%; float:left; margin-bottom:20px;}
.maroad-iconbox-left{ width:50px; float:left;}
.maroad-iconbox-right{ width:calc(100% - 60px); float:right;}

.kf5-chatSupport-style1{box-shadow:0 !important;}