@charset "utf-8";
/* common */
.wrap_ai_letter {min-width:360px;background:var(--white)}
.wrap_ai_letter .section_inner {text-align:center}
.wrap_ai_letter :not(.section06):not(.section08) .section_inner {width:320px;margin:0 auto}
.wrap_ai_letter .btn_buy {width:100%;font-weight:bold}
.wrap_ai_letter .box_head {color:var(--gray120);font-size:24px;line-height:34px}
.wrap_ai_letter .box_head .txt_desc {display:block;margin-top:16px;color:var(--gray100);font-size:15px;font-weight:normal;line-height:22px}
.wrap_ai_letter .img_max {max-width:100%;height:auto}
.wrap_ai_letter .swiper-container-horizontal>.swiper-pagination {position:static;display:flex;align-items:center;justify-content:center;gap:4px;width:100%;margin-top:16px}
.wrap_ai_letter .swiper-pagination-bullet {width:6px;height:6px;opacity:1}
.wrap_ai_letter .swiper-pagination-bullet-active {width:12px;height:12px}
.wrap_float .btn_buy {position:fixed;bottom:12px;left:20px;z-index:20;width:calc(100% - 40px);color:#0D061A;background:#15F3FF;box-shadow:0 2px 6px 0 rgba(0,0,0,.30)}
.wrap_float .btn_share {position:fixed;bottom:120px;right:16px;z-index:20;width:40px;height:40px;background:var(--violet100);border-radius:50%}
.wrap_float .btn_share .box_btn {display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px}
.wrap_float .btn_share svg {width:20px;height:20px;color:var(--white)}
/* section */
.section01 {padding:56px 0 32px;background:linear-gradient(180deg, #150335 0%, #5518C3 100%)}
.section01 .box_head {position:relative;color:var(--white);font-size:28px;line-height:38px;background:url(//www.saraminimage.co.kr/sri/mobile/ai_letter/section1_line.png) no-repeat top 27px left calc(50% - 30px) / 162px 20px}
.section01 .box_head .txt_point {position:relative;background:linear-gradient(180deg, #B288FF 5.92%, var(--white) 59.21%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.section01 .box_head .txt_point svg {position:absolute;top:-11px;left:-16px;width:24px;height:24px;color:#BB95FF}
.section01 .box_head .txt_desc {margin-top:12px;color:var(--white);font-size:16px;line-height:24px}
/* animation fade in */
.section01 img {display:block;margin:32px auto 0;opacity:0}
.section01 img.ani {animation:fadeIn 1s forwards;animation-delay:0.1s}
.section02 {padding:40px 0 0;background:linear-gradient(180deg, #5518C3 29.77%, #985EFF 100%)}
.section02 .box_head {color:var(--white)}
.section02 img {display:block;margin:40px auto 0}
.section03 {padding:40px 0}
.section03 .box_cont {display:flex;flex-direction:column;gap:16px;margin-top:24px}
.section03 .box_cont li {overflow:hidden;width:100%;padding-bottom:32px;background:var(--violet20);border:1px solid var(--violet30);border-radius:16px;box-sizing:border-box}
.section03 .box_cont .img_max {margin-bottom:16px}
.section03 .box_cont .txt_title {display:block;font-size:20px;font-weight:600;line-height:28px;background:linear-gradient(89deg, #00A1F8 0.78%, #7F38FD 99.22%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.section03 .box_cont .txt_desc {display:block;margin-top:8px;color:var(--gray100);font-size:15px;line-height:22px}
.section03 .list_badge[data-animated='true'] {width:max-content}
.section03 .list_badge {display:flex;flex-wrap:wrap;gap:7px}
.section03 .list_badge:first-of-type {padding-top:32px}
.section03 .list_badge:first-of-type,
.section03 .list_badge:last-child {margin-left:26px;animation:wordFlow 20s forwards linear infinite}
.section03 .list_badge:nth-of-type(2) {animation:wordFlow 20s reverse linear infinite}
.section03 .list_badge:last-child {margin-bottom:32px}
.section03 .list_badge+.list_badge {margin-top:8px}
.section03 .list_badge span {flex-shrink:0;display:inline-flex;align-items:center;gap:4px;height:36px;padding:0 10px;color:var(--gray120);font-size:12px;background:var(--white);border:1px solid var(--gray40);border-radius:18px;box-sizing:border-box;box-shadow:8px 8px 16px 0 rgba(110,78,185,.15)}
.section03 .list_badge .is_active {color:var(--blue90);font-weight:bold;border-color:var(--blue90)}
.section03 .list_badge .is_active svg {width:14px;height:14px;color:var(--blue90)}
.section04 {position:relative;width:100%;padding:120px 0;background:var(--violet20)}
.section04 {overflow:hidden;position:relative;width:100%;padding:40px 0;background:var(--violet20)}
.section04 .box_head .txt_desc_sub {display:block;margin-top:8px;color:var(--blue90);font-size:12px;line-height:18px}
.section04 .swiper-slide {background:var(--white)}
.section04 .swiper-pagination-bullet {background:#D6C4FF}
.section04 .swiper-pagination-bullet-active {background:#8744FF}
.section04 .box_cont {margin-top:54px}
.section04 .box_cont .swiper-slide {overflow:hidden;position:relative;border-radius:16px;box-shadow:8px 8px 16px 0 rgba(110,78,185,.15)}
.section04 .box_cont .swiper-slide .area_txt {position:absolute;left:0;top:32px;display:flex;flex-direction:column;width:100%;color:var(--gray100);font-size:15px;line-height:22px}
.section04 .area_txt span {margin-bottom:8px;color:var(--gray120);font-size:20px;font-weight:600;line-height:28px}
.section05 {overflow:hidden;padding:40px 0}
.section05 .box_head svg {width:24px;height:24px;margin-top:16px;color:var(--gray70)}
.section05 .box_cont {margin-top:32px;display:flex;flex-direction:column;gap:24px}
.section05 dl+dl {padding-top:24px;border-top:1px solid var(--gray30)}
.section05 dl dt {color:var(--gray100);font-size:15px;line-height:22px}
.section05 dl dt span {display:block;margin-bottom:8px;color:var(--gray120);font-size:20px;font-weight:600;line-height:28px}
.section05 dl dd {position:relative;margin-top:32px}
.section05 dl dd .swiper-slide {overflow:hidden;height:400px;border-radius:16px;box-sizing:border-box}
.section05 dl dd.area01 .swiper-slide {background:var(--violet20);border:1px solid var(--violet30)}
.section05 dl dd.area02 .swiper-slide {background:var(--yellow10);border:1px solid var(--yellow30)}
.section05 dl dd.area03 .swiper-slide {background:var(--skyBlue10);border:1px solid var(--skyBlue30)}
.section05 dl dd .txt_title {position:absolute;bottom:32px;left:0;width:100%;color:var(--gray120);font-size:15px;font-weight:600;line-height:22px}
.section05 .area01 .swiper-pagination-bullet {background:#D6C4FF}
.section05 .area01 .swiper-pagination-bullet-active {background:#8744FF}
.section05 .area02 .swiper-pagination-bullet {background:var(--yellow50)}
.section05 .area02 .swiper-pagination-bullet-active {background:var(--yellow110)}
.section05 .area03 .swiper-pagination-bullet {background:var(--skyBlue50)}
.section05 .area03 .swiper-pagination-bullet-active {background:#00B2E5}
.section06 {padding:40px 20px;background:var(--violet20)}
.section06 .box_cont {margin-top:24px}
.section06 .list_tab {overflow-x:auto;display:flex;gap:12px;margin:0 -20px;padding:0 20px}
.section06 .list_tab button {flex-shrink:0;display:inline-flex;align-items:center;gap:4px;height:38px;padding:0 16px;color:#8744FF;font-size:15px;font-weight:bold;background:#E9DDFF;border-radius:30px}
.section06 .list_tab button.is_active {color:var(--white);background:#8744FF}
.section06 [class*='ico_'] {display:inline-block;width:20px;height:20px;background:url(//www.saraminimage.co.kr/sri/mobile/ai_letter/spr_ico.png) 200px 56px / 1000%}
.section06 .ico_ai {background-position:0 0}
.section06 .ico_align {background-position:-36px 0}
.section06 .ico_heading {background-position:-72px 0}
.section06 .ico_translation {background-position:-108px 0}
.section06 .ico_speller {background-position:-144px 0}
.section06 .ico_plagiarism {background-position:-180px 0}
.section06 .is_active .ico_ai {background-position:0 -36px}
.section06 .is_active .ico_align {background-position:-36px -36px}
.section06 .is_active .ico_heading {background-position:-72px -36px}
.section06 .is_active .ico_translation {background-position:-108px -36px}
.section06 .is_active .ico_speller {background-position:-144px -36px}
.section06 .is_active .ico_plagiarism {background-position:-180px -36px}
.section06 .list_panel {width:320px;margin:24px auto 0}
.section06 .panel_tab {overflow:hidden;position:relative;display:none;background:var(--white);border-radius:16px;box-shadow:8px 8px 16px 0 rgba(110,78,185,0.15)}
.section06 .panel_tab.is_active {display:block}
.section06 .panel_tab .area_txt {position:absolute;top:32px;left:0;width:100%;color:var(--gray100);font-size:15px;line-height:22px}
.section06 .panel_tab .area_txt span {display:block;margin-bottom:8px;color:var(--gray120);font-size:20px;font-weight:600;line-height:28px}
.section07 {padding:40px 0}
.section07 .box_cont {display:flex;flex-direction:column;justify-content:center;gap:16px;margin-top:40px;text-align:left}
.section07 .box_cont li {display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:24px;color:var(--gray100);font-size:15px;line-height:22px;background:var(--white);border:1px solid var(--gray40);border-radius:16px;box-shadow:8px 8px 16px 0 rgba(110, 78, 185, 0.15);box-sizing:border-box}
.section07 .box_cont li.is_best {position:relative; border:3px solid var(--violet80)}
.section07 .box_cont li.is_best .badge_summary {position:absolute;top:-15px;left:29px;padding:0 16px;font-weight:bold}
.section07 .box_cont li.is_best .txt_title {color:var(--violet90)}
.section07 .box_cont .badge {display:inline-flex;align-items:center;height:28px;padding:0 10px;color:var(--white);font-size:14px;background:var(--violet80);border-radius:16px}
.section07 .box_cont .txt_title {display:block;margin-bottom:4px;color:var(--gray120);font-size:20px;line-height:28px}
.section07 .box_cont .box_price {display:flex;flex-direction:column;align-items:flex-start;width:100%;margin-top:16px}
.section07 .box_cont .txt_item {color:var(--gray120);font-weight:bold}
.section07 .box_cont .area_price {display:flex;align-items:center;gap:8px;margin-top:4px;color:var(--gray120);font-size:20px;font-weight:bold;line-height:28px}
.section07 .box_cont del {color:var(--gray70);font-size:13px;line-height:18px;text-decoration:line-through}
.section07 .box_cont .btn_buy {width:100%;margin-top:16px;color:var(--white);background:var(--violet90);border-color:var(--violet90)}
.section08 {padding:40px 20px;background:linear-gradient(0deg, var(--violet20) 0%, var(--violet20) 100%), var(--white)}
.section08 .box_head {font-size:20px;line-height:28px}
.section08 .tbl_info {width:100%;margin-top:26px;text-align:left}
.section08 .tbl_info td {padding:8px;color:var(--gray120);font-size:13px;line-height:20px;vertical-align:top}
.section08 .tbl_info th~th,
.section08 .tbl_info td~td {border-left:1px solid var(--violet30)}
.section08 .tbl_info thead th {padding:12px 8px;color:var(--violet90);font-size:13px;font-weight:bold;line-height:18px;background:#E3D1FF;border-top:1px solid #AA83F0;border-bottom:1px solid #AA83F0}
.section08 .tbl_info tbody td {background:var(--white)}
.section08 .tbl_info tfoot td {background:var(--violet20);border-bottom:1px solid #AA83F0}
.section08 .tbl_info tfoot .txt_desc {margin-top:4px;color:var(--violet90)}
.section09 {padding:40px 0;background:#833EFF}
.section09 .box_head {color:var(--white)}
.section09 .box_cont {margin-top:24px}
.section09 .btn_letter {color:#833EFF;font-weight:bold;background:var(--white);border-color:var(--white)}
.section09 .btn_letter svg {width:16px;height:16px;margin-top:1px;vertical-align:text-top}
.wrap_faq {padding:40px 20px;background:var(--gray20)}
.wrap_faq .box_cont {margin-top:24px;border-bottom:1px solid var(--gray40);line-height:22px;text-align:left}
.wrap_faq .box_cont dt {display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 8px;color:var(--gray120);font-size:15px;font-weight:bold;border-top:1px solid var(--gray40);box-sizing:border-box;cursor:pointer}
.wrap_faq .box_cont dt svg {width:16px;height:16px}
.wrap_faq .box_cont dd {display:none;color:var(--gray100);margin:0 8px;padding:12px 0 16px;font-size:14px;border-top:1px solid var(--gray30);text-align:left}
.wrap_faq .box_cont dt.is_active {padding:16px 8px 12px}
.wrap_faq .box_cont dt.is_active svg {transform:scaleY(-1)}
.wrap_faq .box_cont dt.is_active+dd {display:block}
.wrap_caution {padding:40px 20px;background:var(--gray30)}
.wrap_caution .box_cont {line-height:22px;text-align:left}
.wrap_caution .box_cont .txt_title {color:var(--gray120);font-size:15px;font-weight:bold}
.wrap_caution .box_cont ul {display:flex;flex-direction:column;gap:4px;margin-top:8px;color:var(--gray100);font-size:14px}
.wrap_caution .box_cont ul li {position:relative;padding-left:10px}
.wrap_caution .box_cont ul li:before {position:absolute;top:12px;left:0;width:2px;height:2px;background:var(--gray100);border-radius:50%;content:''}
/* 이벤트종료후제거 { */
.wrap_caution .box_cont+.box_cont {margin-top:24px}
.section_event {text-align:center}
.section_event ol {display:flex;flex-direction:column;gap:8px;width:100%;margin:0 auto;counter-reset:count}
.section_event ol li {overflow:hidden;width:100%;border-radius:16px;box-sizing:border-box;counter-increment:count}
.section_event ol li .area_txt {text-align:left}
.section_event ol li .area_txt .txt_title {display:block}
.section_event ol li .txt_desc {font-size:13px;line-height:18px}
.wrap_event_summary {padding:40px 0;color:var(--white);background:#833EFF}
.wrap_event_summary .box_head {color:var(--white);font-size:15px;font-weight:normal;line-height:22px}
.wrap_event_summary .box_head img {display:block;margin:0 auto}
.wrap_event_summary .box_head span {display:block;color:#15F3FF;font-weight:600}
.wrap_event_summary .box_head .txt_date {margin-bottom:32px}
.wrap_event_summary .box_head .txt_title {margin:32px auto 8px;font-size:18px;line-height:26px}
.wrap_event_summary ol {margin-top:13px}
.wrap_event_summary .box_cont li {position:relative;display:flex;align-items:center;justify-content:flex-end;font-size:15px;line-height:22px;background:#420082}
.wrap_event_summary .box_cont li .area_txt {position:absolute;top:50%;left:24px;transform:translateY(-50%)}
.wrap_event_summary .area_txt:before {display:block;font-size:20px;font-weight:bold;line-height:28px;content:counter(count)'등'}
.wrap_event_summary .area_txt .txt_title {margin:8px 0;opacity:.8}
.wrap_event_summary .txt_desc {opacity:.5}
.wrap_event_summary .area_thumb .badge {position:absolute;top:20px;right:20px;display:inline-flex;align-items:center;height:34px;padding:0 12px;color:#420082;font-size:18px;font-weight:bold;background:#15F3FF;border-radius:30px}
.wrap_event_how {padding:40px 0;color:var(--white);background:#420082}
.wrap_event_how .box_cont {color:var(--white);font-size:14px;line-height:20px}
.wrap_event_how .box_cont .area_caution {opacity:.8}
.wrap_event_how .box_cont .txt_point {font-size:15px;font-weight:600;line-height:22px}
.wrap_event_how dl {display:flex;flex-wrap:wrap;gap:8px 24px;width:202px;margin:24px auto;font-size:16px;font-weight:bold;line-height:24px}
.wrap_event_how dl dt {color:#15F3FF}
.wrap_event_how ol {margin-top:30px}
.wrap_event_how li {background:var(--white)}
.wrap_event_how .area_txt {padding:24px;color:#0D061A}
.wrap_event_how .area_txt:before {display:inline-flex;align-items:center;height:24px;padding:0 8px;color:var(--white);font-size:13px;font-weight:bold;background:var(--skyBlue80);border-radius:4px;content:'STEP 'counter(count)}
.wrap_event_how .area_txt .txt_title {margin:8px 0 4px;color:#0D061A;font-size:16px;line-height:24px}
.wrap_event_how .txt_desc {opacity:.6}
.wrap_event_how .btn_event {display:inline-flex;align-items:center;justify-content:center;width:100%;height:56px;margin-top:24px;color:#0D061A;font-size:18px;font-weight:bold;background:#15F3FF;border-radius:32px}
/* } 이벤트종료후제거 */
/* animation */
@keyframes fadeIn {
    0% {opacity:0;transform:translateY(30px)}
    100% {opacity:1;transform:translateY(0)}
}
@keyframes wordFlow {
    to {transform:translate(calc(-50% - 10px))}
}