@charset "utf-8";

@import url("font.css");
@import url("aos.css");
@import url("swiper.min.css");


:root {
	--intro-main:#24243D;
	--intro-dark:#2C244D;
	--intro-point:#4112FF;
}

/* Reset */
* {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; outline:none}
html {height:100%; overflow-y:scroll; -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; line-height:1.3}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0; padding:0;}
body {height:100%; font-family:"RedHatDisplay","Pretendard","Malgun Gothic", Dotum, Arial, sans-serif; height:100%; min-width:300px; font-size:16px; -webkit-font-smoothing:antialiased; -webkit-overflow-scrolling:touch; padding-top: constant(safe-area-inset-top); padding-bottom: constant(safe-area-inset-bottom); padding-top:env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); word-break:keep-all;}
h1,h2,h3,h4,h5,h6 {font-weight:normal; font-size:100%}
strong {font-weight:700;}
input, select, textarea, button, label {font-size:100%; vertical-align:middle}
select {width:100%; height:42px; padding:0 25px 0 15px; font-size:16px; font-family:"Pretendard", "Malgun Gothic", Dotum, Arial, sans-serif; color:var(--intro-main); border:none; -webkit-appearance:none;  -moz-appearance:none; appearance:none; border:1px solid #b7b7b7; background:#fff url(../images/icon/select_arrow.jpg) right 14px center no-repeat; transition:border-color .3s ease;}
select::-ms-expand {display:none;}
input {border:1px solid #eaeaea; font-size:16px;}
input:disabled {opacity:1; -webkit-text-fill-color: inherit}
input[type="text"], input[type="search"], input[type="password"], input[type="tel"], input[type="email"], input[type="number"], input[type="button"] {height:36px; font-size:16px; padding:0 10px; outline:none; font-family:"Pretendard", "Malgun Gothic", Dotum, Arial, sans-serif; -webkit-appearance: none;  -moz-appearance: none; appearance:none; border:1px solid #d4d4d4; background:#fff; transition:border-color .3s ease; cursor:pointer}
input[type="text"] {width:270px;}
input[type="text"]+input[type="text"] {margin-left:10px;}
input[type="text"]:focus, input[type="password"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="number"]:focus {border-color:#00b5ef;}
fieldset, img, iframe {border:0 none}
img {max-width:100%; height:auto; vertical-align:middle; border-style:none;}
textarea {width:100%; padding:15px; -webkit-box-sizing:border-box; box-sizing:border-box; resize:none; border:1px solid #ccc; font-family:"Pretendard", "Malgun Gothic", Dotum, Arial, sans-serif; -webkit-appearance: none; -moz-appearance: none; appearance:none;}
em, address {font-style:normal}
a {text-decoration:none; background-color:transparent; vertical-align:middle; -webkit-text-decoration-skip:objects; color:var(--intro-main); word-break: break-word}
a:hover, a:active, a:focus {text-decoration:none}
menu,li {list-style:none}
button {padding:0; margin:0; border:0; cursor:pointer; vertical-align:middle; background:none; font-family:"Pretendard", "Malgun Gothic", Dotum, Arial, sans-serif}
button, input {overflow:visible}
button, select {text-transform:none}
button, html [type="button"], [type="reset"],[type="submit"] {-webkit-appearance:button; cursor:pointer; font-family:"Pretendard", "Malgun Gothic", Dotum, Arial, sans-serif;}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {border-style:none; padding:0}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline:1px dotted ButtonText}
caption {width:0; height:0; font-size:0; line-height:0; overflow:hidden; visibility:hidden}
hr {display:none}
i,em,address{font-style:normal}
label {cursor:pointer}
table {width:100%; border-spacing:0; border-collapse:0; color:var(--intro-main); table-layout:fixed}
table td {word-wrap: break-word;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance:none; margin:0;}
::-webkit-input-placeholder {font-size:16px; color:#999; vertical-align:middle;}

.tac {text-align:center !important;}
.tal {text-align:left !important;}
.tar {text-align:right !important;}

/* margin */
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt35 {margin-top:35px !important;}
.mt40 {margin-top:40px !important;}
.mt45 {margin-top:45px !important;}
.mt50 {margin-top:50px !important;}
.mt55 {margin-top:55px !important;}
.mt60 {margin-top:60px !important;}
.mt65 {margin-top:65px !important;}
.mt70 {margin-top:70px !important;}
.mt75 {margin-top:75px !important;}
.mt80 {margin-top:80px !important;}
.mt85 {margin-top:85px !important;}
.mt90 {margin-top:90px !important;}
.mt95 {margin-top:95px !important;}
.mt100 {margin-top:100px !important;}

.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}
.mb35 {margin-bottom:35px !important;}
.mb40 {margin-bottom:40px !important;}
.mb45 {margin-bottom:45px !important;}
.mb50 {margin-bottom:50px !important;}
.mb55 {margin-bottom:55px !important;}
.mb60 {margin-bottom:60px !important;}
.mb65 {margin-bottom:65px !important;}
.mb70 {margin-bottom:70px !important;}
.mb75 {margin-bottom:75px !important;}
.mb80 {margin-bottom:80px !important;}
.mb85 {margin-bottom:85px !important;}
.mb90 {margin-bottom:90px !important;}
.mb95 {margin-bottom:95px !important;}
.mb100 {margin-bottom:100px !important;}

.ml5 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}
.ml15 {margin-left:15px !important;}
.ml20 {margin-left:20px !important;}
.ml25 {margin-left:25px !important;}
.ml30 {margin-left:30px !important;}
.ml35 {margin-left:35px !important;}
.ml40 {margin-left:40px !important;}
.ml45 {margin-left:45px !important;}
.ml50 {margin-left:50px !important;}
.ml55 {margin-left:55px !important;}
.ml60 {margin-left:60px !important;}
.ml65 {margin-left:65px !important;}
.ml70 {margin-left:70px !important;}
.ml75 {margin-left:75px !important;}
.ml80 {margin-left:80px !important;}
.ml85 {margin-left:85px !important;}
.ml90 {margin-left:90px !important;}
.ml95 {margin-left:95px !important;}
.ml100 {margin-left:100px !important;}

.mr5 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr15 {margin-right:15px !important;}
.mr20 {margin-right:20px !important;}
.mr25 {margin-right:25px !important;}
.mr30 {margin-right:30px !important;}
.mr35 {margin-right:35px !important;}
.mr40 {margin-right:40px !important;}
.mr45 {margin-right:45px !important;}
.mr50 {margin-right:50px !important;}
.mr55 {margin-right:55px !important;}
.mr60 {margin-right:60px !important;}
.mr65 {margin-right:65px !important;}
.mr70 {margin-right:70px !important;}
.mr75 {margin-right:75px !important;}
.mr80 {margin-right:80px !important;}
.mr85 {margin-right:85px !important;}
.mr90 {margin-right:90px !important;}
.mr95 {margin-right:95px !important;}
.mr100 {margin-right:100px !important;}

.w5p {width:5% !important;}
.w10p {width:10% !important;}
.w15p {width:15% !important;}
.w20p {width:20% !important;}
.w25p {width:25% !important;}
.w30p {width:30% !important;}
.w35p {width:35% !important;}
.w40p {width:40% !important;}
.w45p {width:45% !important;}
.w50p {width:50% !important;}
.w55p {width:55% !important;}
.w60p {width:60% !important;}
.w65p {width:65% !important;}
.w70p {width:70% !important;}
.w75p {width:75% !important;}
.w80p {width:80% !important;}
.w85p {width:85% !important;}
.w90p {width:90% !important;}
.w95p {width:95% !important;}
.w100p {width:100% !important;}

body {color:var(--intro-main); background:#F1F0F6; letter-spacing:-0.5px;}
#wrap {overflow-x:hidden;}

header {display:flex; justify-content:space-between; align-items:center; padding:26px 52px;}
header h1 a {display:block; width:195px; height:25px; text-indent:-9999px; background:url(../images/intro/ico_wrap_logo.svg) no-repeat left center;}

footer {display:flex; justify-content:space-between; align-items:center; padding:30px 50px 80px; color:#fff; background:#161623;}
footer .info {display:flex;}
footer .info > * {display:block; position:relative; color:#fff; padding-left:38px; line-height:32px;}
footer .info > * + * {margin-left:32px;}
footer .info > *:before {content:''; position:absolute; z-index:1; left:0; top:0; width:32px; height:32px;}
footer .info > *.tel:before {background-image:url(../images/intro/ico_foot_tel.svg);}
footer .info > *.mail:before {background-image:url(../images/intro/ico_foot_mail.svg);}
footer .info > *.fax:before {background-image:url(../images/intro/ico_foot_fax.svg);}

.wrapper {width:1192px; margin:0 auto;}
.wrapper_sm {width:1056px; margin:0 auto;}

.go_link {display:inline-block; padding:14px 48px 14px 24px; color:#fff; font-weight:700; border-radius:50px; background:#2C244D url(../images/intro/ico_top_arr.svg) no-repeat right 24px center; transition:background .3s ease;}
.go_link:hover {background-color:var(--intro-point);}
.go_link.big {padding:18px 60px 18px 32px; font-size:20px; background-size:20px 20px; background-position:right 32px center;}

.inquiry_btn {display:inline-block; padding:18px 32px 18px 68px; color:#fff; font-size:20px; font-weight:800; border-radius:50px; background:var(--intro-point) url(../images/intro/ico_inquiry.svg) no-repeat left 32px center; transition:background .3s ease;}
.inquiry_btn:hover {background-color:var(--intro-main);}

h2 {margin-bottom:88px; font-size:68px; font-weight:800; line-height:1.2; text-align:center;}
h2 em {display:block; margin-bottom:24px; font-size:22px; font-weight:500; line-height:1.5; color:#4112FF;}
h2 strong {color:var(--intro-point); font-weight:800;}

#container > section + section {padding-top:240px;}

.why {padding:80px 0; text-align:center; overflow-x:hidden;}
.why h2 {margin-bottom:40px;}
.why .why_txt {margin-bottom:48px; font-size:22px; font-weight:500; line-height:1.5;}
.why .why_txt strong {color:var(--intro-point)}
.why .client_talk {margin-top:120px;}
.why .client_talk .swiper-slide {width:376px; padding:40px 24px; background:#fff; border-radius:32px;}
.why .client_talk .swiper-slide > div {display:flex; flex-direction:column; align-items:flex-start;}
.why .client_talk .swiper-slide > div + div {margin-top:40px;}
.why .client_talk .swiper-slide > div .name {display:flex; flex-direction:column; align-items:flex-start; padding:6px 0 6px 60px; line-height:1; background-repeat:no-repeat; background-position:left center;}
.why .client_talk .swiper-slide > div .name strong {display:block; font-size:20px; font-weight:800; color:var(--intro-dark);}
.why .client_talk .swiper-slide > div .name span {margin-top:4px; color:#A189FF; font-size:12px; line-height:1;}
.why .client_talk .swiper-slide > div .talk {display:inline-flex; margin-top:12px; width:auto; max-width:85%; padding:14px 20px; border-radius:16px; line-height:1.5; text-align:left;}
.why .client_talk .swiper-slide > div[class^="client"] .talk {border-top-left-radius:0; color:#6F61A4; background:#F8F7FD;}
.why .client_talk .swiper-slide > div.client01 .name {background-image:url(../images/intro/ico_client01.svg);}
.why .client_talk .swiper-slide > div.client02 .name {background-image:url(../images/intro/ico_client02.svg);}
.why .client_talk .swiper-slide > div.client03 .name {background-image:url(../images/intro/ico_client03.svg);}
.why .client_talk .swiper-slide > div.client04 .name {background-image:url(../images/intro/ico_client04.svg);}
.why .client_talk .swiper-slide > div.client05 .name {background-image:url(../images/intro/ico_client05.svg);}
.why .client_talk .swiper-slide > div.client06 .name {background-image:url(../images/intro/ico_client06.svg);}
.why .client_talk .swiper-slide > div.wrapstudio {align-items:flex-end;}
.why .client_talk .swiper-slide > div.wrapstudio .name {align-items:flex-end; padding:6px 60px 6px 0; background-image:url(../images/intro/ico_wrapstudio.svg); background-position:right center;}
.why .client_talk .swiper-slide > div.wrapstudio .talk {border-top-right-radius:0; background:#F1EEFF; font-weight:500; color:#4112FF; text-align:right;}

.only ul {counter-reset:only; display:flex; margin:0 -16px; padding:48px 48px 32px; border-radius:32px;  background:#24243d linear-gradient(-45deg, #24243d, hsl(252deg 100% 54% / 10%))}
.only ul li {width:calc(33.33% - 48px); margin:0 24px; padding:24px 0; line-height:1.5; color:#fff; border-radius:32px;}
.only ul li:before {display:block; counter-increment:only; content:counter(only, decimal-leading-zero); font-size:24px; font-weight:700; margin-bottom:8px; opacity:0.5;}
.only ul li div {margin-top:24px; padding:24px 0; border-top:1px dashed rgba(255,255,255,0.3);}
/*
.only ul li:first-of-type strong {color:#5126FE;}
.only ul li:nth-of-type(2) strong {color:#6B26FE;}
.only ul li:nth-of-type(3) strong {color:#8526FE;}
*/
.only ul li strong {display:block; font-size:24px; font-weight:800;}
.only ul li em {display:block; margin:0 0 16px; font-size:18px; font-weight:500;}
.only ul li p {opacity:0.7;}

.review_wrap {text-align:center;}
.review_wrap .review {overflow-x:hidden; text-align:left;}
.review_wrap .review + .review {margin-top:32px; margin-left:-10%;}
.review_wrap .review .swiper-wrapper {align-items:stretch !important;}
.review_wrap .review .swiper-slide {width:336px; height:auto; padding:28px; border-radius:32px 32px 32px 0; background:#fff;}
.review_wrap .review .swiper-slide .name {display:flex; align-items:center; direction:ltr; color:#4112FF;}
.review_wrap .review .swiper-slide .name strong {padding-left:36px; font-size:20px; background:url(../images/intro/ico_review_star.svg) no-repeat left center;}
.review_wrap .review .swiper-slide .name span {margin-left:8px; font-size:13px;}
.review_wrap .review .swiper-slide .con {margin-top:16px; color:#6D6688; line-height:1.5; direction:ltr;}
.review_wrap .review .swiper-slide .con p + p {margin-top:16px}
.review_wrap .go_link {margin-top:80px;}

.expert {padding-bottom:100px;}
.expert .box_con {display:flex; flex-wrap:wrap; justify-content:space-between;}
.expert .box_con h3 {margin-bottom:12px; font-size:28px; font-weight:800; line-height:1.5;}
.expert .box_con h3 + p {font-size:16px; opacity:0.6; line-height:1.4;}
.expert .box_con .kmong {position:relative; display:flex; flex-direction:column; justify-content:center; width:100%; height:286px; margin-bottom:32px; padding:0 48px; color:#fff; border-radius:32px; background:#5126FE;}
.expert .box_con .kmong .img {position:absolute; z-index:1; right:100px; bottom:0;}
.expert .box_con .refund {width:424px; height:508px; padding:48px; color:#fff; border-radius:32px; background:#6B26FE;}
.expert .box_con .refund .pro {display:flex; margin-top:72px;}
.expert .box_con .refund .pro li {display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:128px; height:128px; padding-top:4px; font-size:18px; font-weight:700; line-height:1.4; text-align:center; border-radius:50%;}
.expert .box_con .refund .pro li:nth-of-type(1) {background:rgba(105,165,255,0.46);}
.expert .box_con .refund .pro li:nth-of-type(2) {background:rgba(105,111,255,0.6);}
.expert .box_con .refund .pro li:nth-of-type(3) {background:rgba(180,105,255,0.3);}
.expert .box_con .refund .pro li + li {margin-left:-28px;}
.expert .box_con .other {display:flex; flex-direction:column; justify-content:space-between; width:calc(100% - 456px); height:508px;}
.expert .box_con .other li {display:flex; align-items:center; height:148px; padding:35px 48px; border-radius:32px; background:#fff;}
.expert .box_con .other li h3 {margin-bottom:0; flex-shrink:0; width:196px; font-size:24px;}
.expert .box_con .other li h3 strong {display:block; color:#5126FE; font-weight:800;}
.expert .box_con .other li p {padding-top:2px; color:#6D6688; opacity:1;}

.info_txt {display:flex; justify-content:center; align-items:center; height:100vh; padding-top:0 !important; color:#fff; font-size:48px; font-weight:600; text-align:center; background:#5126FE url(../images/intro/bg_test.png) no-repeat center/cover; background-attachment:fixed; line-height:1.6}
.info_txt strong {display:inline-block; padding:0 28px; border-radius:100px; transition:background .7s ease .3s;}
.info_txt strong:nth-of-type(2) {transition-delay:.6s;}
.info_txt strong:nth-of-type(3) {transition-delay:.9s;}
.info_txt .aos-animate strong:first-of-type {background:#3513BF;}
.info_txt .aos-animate strong:nth-of-type(2) {background:#3BB7B7; transition-delay:1s;}
.info_txt .aos-animate strong:nth-of-type(3) {background:#4F98DB; transition-delay:1.5s;}

.process {padding-bottom:240px; background:#fff;}
.process ol {counter-reset:process;}
.process ol li {position:relative; display:flex; counter-increment:process; flex-direcion:column; justify-content:flex-start; align-items:center; height:360px;}
.process ol li + li {margin-top:120px;}
.process ol li:nth-of-type(even) {justify-content:flex-end;}
.process ol li div {width:374px;}
.process ol li div:before {content:'STEP ' counter(process, decimal-leading-zero); display:inline-block; margin-bottom:24px; padding:14px 24px 14px 44px; font-size:20px; font-weight:800; coloR:#fff; line-height:1; border-radius:50px; background:var(--intro-point) url(../images/intro/ico_process_star.svg) no-repeat left 16px center;}
.process ol li div:after {content:''; position:absolute; z-index:1; right:0; top:50%; width:512px; height:360px; border-radius:32px; background:#F7F6FA; transform:translateY(-50%);}
.process ol li:nth-of-type(even) div:after {right:initial; left:0;}
.process ol li h3 {margin-bottom:20px; color:#24243D; font-size:28px; font-weight:800; line-height:1.4;}
.process ol li h3 strong {display:block; color:var(--intro-point); font-weight:800;}
.process ol li p {color:#6D6688;}
.process ol li p + p {margin-top:16px;}

.product .pd_list {display:flex; justify-content:space-between; align-items:stretch; margin:0 -32px; width:calc(100% + 32px);}
.product .pd_list > li {display:flex; flex-direction:column; width:calc(33.33% - 32px); margin:0 16px; border-radius:32px; background:#fff;}
.product .pd_list > li .tit {text-align:right;}
.product .pd_list > li .tit em {line-height:48px; display:inline-block; padding:0 36px 20px 70px; color:#fff; border-radius:0 32px 0 0; background:#5126FE url(../images/intro/bg_product_radius.svg) no-repeat left top;}
.product .pd_list > li:nth-of-type(2) .tit em {background-color:#6B26FE;}
.product .pd_list > li:nth-of-type(3) .tit em {background-color:#8526FE;}
.product .pd_list > li .con {position:relative; z-index:1; flex-grow:1; margin-top:-19px; padding:50px 32px; border-radius:0 20px 0 0; background:#fff;}
.product .pd_list > li .con .name {margin-bottom:12px; font-size:22px; color:#24243D; font-weight:800; line-height: 1.6;}
.product .pd_list > li .con .name strong {color:#5126FE; font-weight:800;}
.product .pd_list > li .con ul li {position:relative; padding-left:12px; color:#6D6688; line-height:1.5;}
.product .pd_list > li .con ul li:before {content:'·'; position:absolute; z-index:1; left:0; top:0;}
.product .pd_list > li .con ul li b {color:#5126FE; font-weight:500;}
.product .pd_list > li .con ul li a {font-weight:500; text-decoration:underline; color:#5126FE;}
.product .pd_list > li .price {padding:0 32px 0; text-align:right; border-radius:0 0 32px 32px; background:#fff;}
.product .pd_list > li .price strong {display:block; padding:40px 0 56px; border-top:1px dashed rgba(81,38,254,0.2); font-size:32px; font-weight:800; color:#5126FE;}
.product .go_link {margin:80px auto 0;}

.benefit .bene_list ul {display:flex; flex-wrap:wrap; margin:-16px;}
.benefit .bene_list ul li {position:relative; width:calc(33.33% - 32px); margin:16px; padding:96px 32px 32px 32px; line-height:1.5; border-radius:32px; background:#fff;}
.benefit .bene_list ul li:before {content:''; position:absolute; z-index:1; left:24px; top:28px; width:64px; height:64px;}
.benefit .bene_list ul li strong {display:block; font-size:22px; font-weight:800; color:#24243d;}
.benefit .bene_list ul li p {padding-right:30px; margin-top:8px; color:#6d6688;}
.benefit .bene_list ul li.responsive:before {background-image:url(../images/intro/ico_bene_responsive.svg);}
.benefit .bene_list ul li.popup:before {background-image:url(../images/intro/ico_bene_pop.svg);}
.benefit .bene_list ul li.admin:before {background-image:url(../images/intro/ico_bene_admin.svg);}
.benefit .bene_list ul li.sns:before {background-image:url(../images/intro/ico_bene_sns.svg);}
.benefit .bene_list ul li.talk:before {background-image:url(../images/intro/ico_bene_talk.svg);}
.benefit .bene_list ul li.call:before {background-image:url(../images/intro/ico_bene_call.svg);}
.benefit .bene_list ul li.map:before {background-image:url(../images/intro/ico_bene_map.svg);}
.benefit .bene_list ul li.seo:before {background-image:url(../images/intro/ico_bene_seo.svg);}
.benefit .bene_list ul li.safe:before {background-image:url(../images/intro/ico_bene_safe.svg);}
.benefit .bene_list ul li.basic:before {background-image:url(../images/intro/ico_bene_license.svg);}
.benefit .bene_list ul li.gift:before {background-image:url(../images/intro/ico_bene_gift.svg);}
.benefit .bene_list ul li.seosc:before {background-image:url(../images/intro/ico_bene_seo_search.svg);}
.benefit .bene_list ul li.board:before {background-image:url(../images/intro/ico_bene_board.svg);}
.benefit .bene_list ul li.lang:before {background-image:url(../images/intro/ico_bene_lan.svg);}
.benefit .bene_list ul li.dev:before {background-image:url(../images/intro/ico_bene_dev.svg);}
.benefit .bene_list ul li.effect:before {background-image:url(../images/intro/ico_bene_effect.svg);}

.our_talk {display:flex; flex-direction:column; justify-content:center; align-items:center; padding-top:0 !important; margin-top:240px; height:920px; background:url(../images/intro/bg_btm_talk.png) no-repeat center/cover;}
.our_talk p {position:relative; display:block; margin-bottom:48px; font-size:68px; text-align:center; line-height:1.2; color:#fff;}
.our_talk p b {display:inline-block; mix-blend-mode:overlay;}
.our_talk p:before {content:'막연한 걱정을 확신으로!'; position:absolute; z-index:1; left:50%; top:0; opacity:0.3; white-space:nowrap; font-weight:800; transform:translateX(-50%);}
.our_talk p strong {display:block;}

.go_pf {position:fixed; z-index:9999; right:24px; bottom:-80px; text-align:center; padding:24px 40px; border-radius:100px; background:#6B26FE; color:#fff; transition:bottom .4s ease;}
.go_pf.on {bottom:40px;}
.go_pf span {font-size:20px; font-weight:800; padding-left:44px; background:url(../images/intro/ico_rocket.svg) no-repeat left center;}

.dp_mb {display:none;}

.popup_wrap {display:none; position:fixed; z-index:9999; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.3);}
.popup_wrap .popup {position:absolute; z-index:1; left:50%; top:50%; width:90%; max-width:1200px; padding:80px 60px; text-align:center; transform:translate(-50%,-50%); border-radius:24px; background:#fff;}
.popup_wrap .popup .pop_tit {display:block; font-size:48px; font-weight:800; color:#000; line-height:1.2;}
.popup_wrap .popup .pop_sub {margin-top:16px; font-size:16px; font-weight:500; color:#8a8a8a; line-height:1.6;}
.popup_wrap .popup .price_wrap {display:flex; justify-content:space-between; text-align:left; margin:60px -8px 50px; width:calc(100% + 16px); letter-spacing:0;}
.popup_wrap .popup .price_wrap > div {width:calc(33.33% - 16px); margin:0 8px; padding:36px; border-radius:16px; background:#F1F0F6;}
.popup_wrap .popup .price_wrap .price_top {padding-bottom:36px; border-bottom:1px solid #ddd;}
.popup_wrap .popup .price_wrap .price_top em {display:block; margin-bottom:16px; font-size:20px; font-weight:600; color:#000; font-family:'pretendard'; line-height:1;}
.popup_wrap .popup .price_wrap .price_top .price {margin-bottom:8px; height:36px; color:#000; line-height:1.2;}
.popup_wrap .popup .price_wrap .price_top .price strong {font-size:30px; font-weight:700;}
.popup_wrap .popup .price_wrap .price_top .price span {font-size:16px; font-weight:700;}
.popup_wrap .popup .price_wrap .price_top p {font-size:14px; line-height:1; color:#888;}
.popup_wrap .popup .price_wrap ul {padding:24px 0;}
.popup_wrap .popup .price_wrap ul li {padding-left:28px; font-size:15px; color:#666; line-height:1.5; background:url(../images/ico/ico_intro_price_chk.svg) no-repeat left top -2px;}
.popup_wrap .popup .price_wrap ul li.bold {font-weight:600; color:#000; background-image:url(../images/ico/ico_intro_price_chk_on.svg);}
.popup_wrap .popup .price_wrap ul li + li {margin-top:8px;}

.popup_wrap .popup .price_wrap > div.recommend {position:relative; padding:34px; border:2px solid #4B1FFF; background:#fff;}
.popup_wrap .popup .price_wrap > div.recommend .price_top em {color:#4B1FFF;}
.popup_wrap .popup .price_wrap > div.recommend:before {content:'잦은 수정이 필요한 분들께 추천해요!'; position:absolute; z-index:1; left:20px; top:-15px; padding:8px 16px; color:#fff; border-radius:100px; font-size:14px; font-weight:600; line-height:1; background:#4B1FFF;}
.popup_wrap .popup .close {position:absolute; z-index:1; right:40px; top:40px; width:50px; height:50px; text-indent:-9999px; background:url(../images/ico/ico_intro_pop_close.svg);}



/*********************************************************************************************************************************************/



@media all and (max-width:1820px){  
}

@media all and (max-width:1500px){ 
	header {padding:26px 30px;}
	h2 {font-size:58px; margin-bottom:50px;}
	h2 em {font-size:20px;}
	.why .why_txt {font-size:20px;}
	
	.info_txt {font-size:40px; line-height:1.5;}

	.our_talk p {font-size:58px;}
	footer {padding:30px 30px 80px;}
}

@media all and (max-width:1199px){  
	.wrapper {width:auto;}
	.wrapper_sm {width:auto;}

	.only ul {margin:0 24px; padding:38px 28px 22px;}

	.expert .box_con {padding:0 24px;}

	.product .pd_list {margin:0; width:100%; padding:0 24px;}
	.product .pd_list > li {width:calc(33.33% - 8px); margin:0; border-radius:24px;}

	.benefit .bene_list ul {margin:0; padding:0 24px;}	
	.benefit .bene_list ul li {width:calc(33.33% - 16px); margin:8px;}

	footer {flex-direction:column; font-size:15px; letter-spacing:0;}
	footer address {margin-bottom:12px; opacity:0.5; letter-spacing:0.5px;}
}

@media all and (max-width:1024px){
	.only ul {flex-direction:column; padding:0;}
	.only ul li {width:100%; margin:0; padding:40px; border-radius:0;}
	.only ul li br {display:none;}
	.only ul li:first-of-type {background:rgba(255,255,255,0.1);}
	.only ul li:nth-of-type(2) {background:rgba(255,255,255,0.05);}

	.expert .box_con .kmong {margin-bottom:24px;}
	.expert .box_con .kmong .img {width:400px; right:40px;}
	.expert .box_con .refund {display:flex; flex-direction:column; justify-content:center; position:relative; width:100%; height:286px; margin-bottom:24px;}
	.expert .box_con .refund .pro {position:absolute; z-index:1; right:40px; top:50%; margin-top:0; transform:translateY(-50%);}
	.expert .box_con .other {width:100%;}

	.info_txt {font-size:34px;}

	.product .pd_list {flex-direction:column;}
	.product .pd_list > li {width:100%; overflow:hidden;}
	.product .pd_list > li + li {margin-top:24px;}
	.product .pd_list > li .tit em {display:block; padding:8px 16px 28px; font-size:15px; font-weight:500; line-height:1.5; text-align:center; border-radius:0; background:#5126FE;} 
	.product .pd_list > li .con {border-radius:24px;}

	.benefit .bene_list ul li {width:calc(50% - 16px); margin:8px;}
	.benefit .bene_list ul li strong {font-size:20px;}
	
	.popup_wrap .popup {padding:50px; max-height:80%; overflow-y:auto;}
	.popup_wrap .popup .pop_tit {font-size:36px;}
	.popup_wrap .popup .close {right:20px; top:20px; width:40px; height:40px; background-size:100%;}
	.popup_wrap .popup .price_wrap {flex-direction:column; margin:50px 0; width:100%;}
	.popup_wrap .popup .price_wrap > div {width:100%; margin:0;}
	.popup_wrap .popup .price_wrap > div + div {margin-top:24px;}
}

@media all and (max-width:768px){
	header {padding:16px 20px 16px 24px;}
	header h1 a {width:150px; background-size:150px;}

	.go_link {font-size:14px; padding:12px 40px 12px 20px; background-position:right 18px center;}

	h2 {font-size:48px;}
	h2 em {font-size:18px;} 
	
	.why h2 {margin-bottom:24px;}
	.why .why_txt {font-size:18px; margin-bottom:40px;}
	.inquiry_btn {padding:16px 32px 16px 64px; font-size:16px; background-size:20px;}

	.expert .box_con .kmong {justify-content:flex-start; height:400px; padding:32px; text-align:center;}
	.expert .box_con .kmong .img {right:initial; left:50%; transform:translateX(-50%); margin-left:-25px;}
	.expert .box_con .refund {justify-content:flex-start; height:400px; padding:32px; text-align:center;}
	.expert .box_con .refund .pro {top:initial; right:initial; bottom:40px; left:50%; transform:translateX(-50%);}
	.expert .box_con .other {height:auto;}
	.expert .box_con .other li + li {margin-top:16px;}
	.expert .box_con .other li {flex-direction:column; align-items:center; height:auto; text-align:center;}
	.expert .box_con .other li h3 {width:100%; font-size:20px;}
	.expert .box_con .other li h3 strong {display:inline;}

	.info_txt {font-size:28px;}
	.info_txt strong {padding:0 16px;}

	.our_talk p {font-size:44px;}

	footer {padding:30px 24px 50px; font-size:14px; justify-content:flex-start; align-items:flex-start;}
	footer address {font-size:13px;}
	footer .info {flex-direction:column;}
	footer .info > * {padding-left:36px; line-height:24px;}
	footer .info > * + * {margin-left:0; margin-top:8px;}
	footer .info > *:before {width:24px; height:24px; background-size:100%;}
}

@media all and (max-width:640px){

	.info_txt {height:80vh; padding:0 24px; font-size:20px; line-height:1.8; background-image:url(../images/intro/bg_test_m.png); background-attachment:unset; background-size:cover;}
	.info_txt br {display:none;}

	.our_talk p {font-size:34px;}
	

}

@media all and (max-width:480px){
	.dp_mb {display:block;}

	header {padding:20px 24px;}
	header .go_link {display:none;}

	h2 {padding:0 16px; font-size:32px;}
	h2 br {display:none;}
	h2 em {margin-bottom:16px; font-size:16px;}
	#container > section + section {padding-top:100px;}

	.why {padding:60px 0;}
	.why .why_txt {font-size:15px;}
	.why .client_talk {margin-top:60px;}
	.why .client_talk .swiper-slide {width:320px; padding:30px 20px;}
	.why .client_talk .swiper-slide > div .name strong {font-size:16px;}
	.why .client_talk .swiper-slide > div .talk {font-size:14px;}
	.why .client_talk .swiper-slide > div .talk br {display:none;}
	.why .client_talk .swiper-slide > div + div {margin-top:20px;}

	.inquiry_btn {padding:14px 26px 14px 56px; background-position:left 26px center;}

	.only ul {margin:0 16px; border-radius:16px; background:transparent;}
	.only ul li {padding:32px; border-radius:16px;}
	.only ul li + li {margin-top:8px;}
	.only ul li:first-of-type {background:#3B395C;}
	.only ul li:nth-of-type(2) {background:#312F50;}
	.only ul li:nth-of-type(3) {background:#242342;}
	.only ul li:before {margin-bottom:0; font-size:16px;}
	.only ul li strong {font-size:20px;}
	.only ul li div {margin-top:16px; padding:16px 0 0;}
	.only ul li em {margin-bottom:12px; font-size:16px;}
	.only ul li p {font-size:15px;}

	.review_wrap .review .swiper-slide {width:320px; padding:24px;}	
	.review_wrap .review .swiper-slide .con {font-size:14px;}
	.review_wrap .review + .review {margin-left:-15%; margin-top:16px;}

	.review_wrap .go_link {margin-top:60px;}

	.go_link.big {padding:15px 60px 15px 32px; font-size:16px;}

	.info_txt {font-size:18px;}
	.info_txt strong {padding:0 10px; margin:0 2px;}
	
	.expert .box_con h3 {font-size:20px;}
	.expert .box_con h3 + p {font-size:14px;}
	.expert .box_con .kmong {height:310px; border-radius:24px; overflow:hidden; margin-bottom:16px;}
	.expert .box_con .kmong .img {width:290px; margin-left:0;}
	.expert .box_con .refund {height:310px; margin-bottom:16px;}
	.expert .box_con .refund .pro li {width:80px; height:80px; font-size:12px;}
	.expert .box_con .refund .pro li + li {margin-left:-8px;}

	.product .pd_list > li {border-radius:20px;}
	.product .pd_list > li .con {padding:30px; border-radius:20px;}
	.product .pd_list > li .con .name {font-size:18px;}
	.product .pd_list > li .con ul li {font-size:14px;}
	.product .pd_list > Li .price {text-align:left;}
	.product .pd_list > Li .price strong {padding:20px 0 30px; font-size:22px;}
	.product .go_link {margin-top:50px;}

	.benefit .bene_list ul {padding:0 16px; margin-top:-16px;}
	.benefit .bene_list ul li {width:100%; padding:70px 24px 24px 24px; font-size:14px; border-radius:24px}
	.benefit .bene_list ul li:before {left:16px; top:16px; width:50px; height:50px; background-size:100%;}
	.benefit .bene_list ul li strong {font-size:16px;}	
	
	.our_talk {margin-top:80px; height:400px;}
	.our_talk p {margin-bottom:24px; font-size:28px;  line-height:1.3;}
	.our_talk p:before {width:210px; white-space:wrap; opacity:0.1;}

	.go_pf {right:0px; top:-80px; bottom:initial; width:100%; padding:16px 24px; border-radius:0;}
	.go_pf.on {top:0px; bottom:initial;}
	.go_pf span {display:inline-block; padding-left:32px; font-size:15px; background-size:24px;}

	#ch-plugin .huQWSX {bottom:64px !important;}
	
	.popup_wrap .popup {padding:60px 24px;}
	.popup_wrap .popup .pop_tit {font-size:30px;}
	.popup_wrap .popup .pop_sub br {display:none;}
	.popup_wrap .popup .price_wrap > div {padding:30px;}
	.popup_wrap .popup .price_wrap ul {padding:24px 0 0 0;}
}

@media all and (max-width:374px){

}