@charset "utf-8";


@import url(common.css);
@import url(layout.css);
@import url(font.css);

.innerConts { max-width: 1200px; margin: 0 auto;}

.sub-content { position: relative; padding-left: 430px; padding-right: 50px; padding-bottom: 100px; box-sizing: border-box;}
.sub-content .main-quick span { background: #0e68b2; }

.sidemenu { position: absolute; width: 100%; right:0; top: 270px; z-index: 100;}
.sidemenu li { position: relative; text-align: right; padding: 6px 30px 6px 0;}
.sidemenu li a { position: relative; width: 100%;  font-size: 17px; color: #fff; line-height: 120%; font-weight: 300; display: block; }
.sidemenu li a.on { color: #3cc896; font-weight: 500;}
.sidemenu li a.on::before { content: ''; position: absolute; left: 0; top: 6px; width: 20px; height: 3px; background: #3cc896;}

.side-title-wrap { position: fixed; left: 280px; height: 100%; background: #eee; width: 100px;}
.side-title { position: absolute; margin-top: 350px; transform: rotate(90deg); font-size: 42px; color: #222; width: 300px; height: 90px;  left: -120px; font-weight: 700;}
.side-title span { display: block; font-size: 16px; color: #222;}

.content-title { clear: both; padding-top: 90px; padding-bottom: 15px; position: relative; font-size: 40px; color: #222; display: inline-block; background: url(../img/title-bullet.png) left top no-repeat; font-weight: 300;}
.content-title:before { content: ''; position: absolute; left: 0; bottom: 10px; width: 100%; height: 1px; background: #e9e8e8;}
.content-title span { font-weight: 700;}

.content-title2 { clear: both; padding-top: 90px; padding-bottom: 15px; position: relative; font-size: 40px; color: #222; display: inline-block; font-weight: 300;}
.content-title2:before { content: ''; position: absolute; left: 0; bottom: 10px; width: 100%; height: 1px; background: #e9e8e8;}
.content-title2 span { font-weight: 700;}

.content-sub-title { clear: both; padding-top:20px; padding-bottom: 15px; position: relative; font-size: 20px; color: #222;}
.content-sub-title:before { content: ''; position: absolute; left: 0; bottom: 10px; width: 18px; height: 1px; background: #3cc896;}
.content-sub-title span { font-weight: 700;}


.content-top-title { font-size: 24px; color: #222; line-height: 150%;}


/* 소개 */
.ci-type { clear: both; padding: 5% 0; text-align: center;}
.about-service-txt { position: relative; z-index: 100; clear: both; margin-top: 5%; padding: 50px 40px 42px; background:linear-gradient(to right, #015294, #3bc696); border-radius: 35px;}
.about-service-txt p { color: #fff; font-size: 18px; line-height: 130%;}

.about-list { clear: both; padding-right: 10%; padding-left: 10%;}
.about-list dl { position: relative; clear: both; padding-left: 15%; margin-top:8%; padding-bottom:0;}
.about-list dl:before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -50px; width: 100px; height: 100px; border-radius: 25px; background: #3cc896;  z-index: 10;}
.about-list dl:after { content: ''; position: absolute; left: 50px; bottom: 50px; height: 200%; width: 2px; background: #eeeeee;}
.about-list dl dt { font-size: 24px; color: #222; font-weight: 700; line-height: 150%;}
.about-list dl dd { margin-top: 5px; font-size: 18px; color: #222; font-weight: 500; line-height: 120%; color: #666; }

.theme-3type { position: relative; clear: both; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 30px;}
.theme-3type dl { padding: 30px 0; flex: 0 0 calc(33.333333% - 30px); background: #eee; border-radius: 30px; border: 7px solid #f6f5f5; box-sizing: border-box;}
.theme-3type dl dt { padding: 0 30px; font-size:27px; color:#005096; text-align: right; padding-bottom: 15px; border-bottom: 1px solid #fff; margin-bottom: 20px;}
.theme-3type dl dd { padding: 0 30px; font-size:16px; color:#6c6c6c; text-align:left; line-height: 130%; font-family: 'Noto Sans KR'; text-align: justify;}

.about-conts-q { position: relative; padding-left: 55px; line-height: 150%; color: #fff; font-size: 18px; margin-bottom: 50px; border-bottom: 1px solid #999; display: inline-block; margin: 0 auto;}
.about-conts-q:before { content: 'Q'; position: absolute; left: 0; top: 50%; text-align: center; font-size: 24px; font-weight: 700; margin-top: -20px; width: 40px; line-height: 40px; height: 40px; background: #3bc696; border-radius: 100%;}
.about-conts-a { position: relative; padding-left: 55px; padding-top: 30px; line-height: 150%; color: #fff;}
.about-conts-a:before { content: 'A'; position: absolute; left: 0; top: 50%; text-align: center; font-size: 24px; font-weight: 700; margin-top: -30px; width: 40px; line-height: 40px; height: 40px; background: #fff; border-radius: 100%; color: #3bc696;}
.about-conts-a span { display: block;}
.about-conts-a span:first-child { color: #3bc696; font-size: 36px; font-weight: 700; font-family: 'Exo 2'; padding-bottom: 15px;}
.about-conts-a span:last-child { color: #fff; font-size: 24px; font-weight: 300; padding-top: 5px; padding-bottom: 15px;}


/* 개인정보취급방침 */
.privacy-conts { clear: both; position: relative; padding-top: 50px;}
.privacy-conts h5 { font-size: 18px; font-weight: 700; padding: 50px 0 20px; color: #333;}
.privacy-conts p { line-height: 160%; color: #666; margin-bottom: 5px;}
.privacy-conts p b { font-weight: 700; color: #222; padding-top: 10px;}
.privacy-conts ul { margin-left: 17px; margin-bottom: 15px;}
.privacy-conts ul li { line-height: 160%;}
.point { color: #fff; background: #666; padding: 6px 10px 2px; border-radius: 3px;}

.sub-tabmenu { clear: both; text-align: center; margin: 50px 5%; border-bottom: 1px solid #e9e8e8; background: rgba(238,238,238,0.2); border-radius: 7px; border:1px solid #e9e8e8; box-shadow: 0px 7px 0px rgba(238,238,238,0.3); }
.sub-tabmenu ul { display: flex; justify-content: space-around; align-items:center;}
.sub-tabmenu ul li { height: 100%;}
.sub-tabmenu ul li a { padding: 15px 30px 12px; display: inline-block; font-size: 17px; color: #333;}
.sub-tabmenu ul li a:hover { color: #0e68b2;}
.sub-tabmenu ul li a.on { position: relative; color: #0e68b2; height: 100%;}
.sub-tabmenu ul li a.on::after { content: ''; position: absolute; left: 0%; bottom: -2px; width: 100%; height: 4px; background: #0e68b2;}

/* 시스템 흐름도 */
.aps-process { padding: 30px 0 0 0; text-align: center;}

/* 과금정책 */
.business-theme-txt { text-align: center;}
.business-theme-txt p { line-height: 150%;}
.business-theme-txt p:nth-child(1) { padding-top: 50px; font-size: 30px; color: #2b2a2a;}
.business-theme-txt p:nth-child(2) { font-size: 16px; color: #6c6c6c; font-family: 'Noto Sans KR';}

.busi-box-wrap { display: flex; flex-wrap: wrap; justify-content: center; align-items:flex-start;}
.busi-box { background: #eeeeee; border-radius: 50px; border: 8px solid #f6f5f5; margin: 100px 3% 0; width:calc((30% - 50px)/1); min-width: 400px;}
.busi-b-title { font-size:28px; color:#005096; font-weight: 700; text-align:center; padding: 50px 30px 15px; border-bottom: 1px solid #fff;}
.busi-b-no { font-size: 24px; color: #000; letter-spacing: -1px; font-weight: 300;text-align: center; padding-bottom: 15px;}
.busi-b-no span { font-size: 40px; color: #000; font-weight: 700;}

.bullet-a { clear: both;}
.bullet-a li { position: relative; line-height: 150%; color: #666; font-size: 16px; /* font-family: 'Noto Sans KR'; */ padding-left: 30px; margin-top: 10px; margin-bottom: 5px; font-weight: 300;}
.bullet-a li span { font-weight: 700; color: #333;}
.bullet-a li:before { content: ''; position: absolute; left: 0; top: -3px; background: url(../img/bullet-navy.png) left 0px no-repeat; width: 25px; height: 26px;}

.bullet-b { clear: both;}
.bullet-b li { position: relative; line-height: 150%; color: #b33634; font-size: 16px; font-family: 'Noto Sans KR'; padding-left: 30px; margin-top: 5px; margin-bottom: 5px;}
.bullet-b li:before { content: ''; position: absolute; left: 0; top: 0; background: url(../img/bullet-red.png) center no-repeat; width: 25px; height: 24px;}

.busi-count-year { margin-top: 10px; border-radius: 30px; background: #3e5da0; padding: 10px 30px 5px; color: #fff;}
.busi-count-year span { display: block;}
.busi-count-year .count { position: relative; display:inline-block; padding: 0 10% 0 15px ; text-align: center; margin-left: 10%;}
.busi-count-year .count:before { content: ''; position: absolute; right: 0; top: 50%; width: 100%; height: 1px; background: #fff;}
.busi-count-year .count:after { content: ''; position: absolute; right: 0; top: 8px; background: url(../img/white-arrow.png) right center no-repeat; width: 24px; height: 15px;}
.busi-count-year .busi-year { text-align: right; font-size: 20px; color: #fbfe1f; font-weight: 700; padding-top: 12px; padding-right: 5%;}

.busi-quick { position: relative; text-align: right; font-size: 18px; color: #000000; padding: 50px 17px 0; z-index: 10;}
.busi-quick::before { content: ''; display: inline-block; background: url(../img/gray-arrow.png) center no-repeat; width: 44px; height: 19px; padding-right: 20px; vertical-align: middle; margin-bottom: 4px;}

.busi-quick-blue::after { content: ''; position: absolute; right: 0; bottom: -10px; background: #3e5da0; width: 36px; height: 36px; border-radius: 100%; z-index: -1;}
.busi-quick-green::after { content: ''; position: absolute; right: 0; bottom: -10px; background: #3cc896; width: 36px; height: 36px; border-radius: 100%; z-index: -1;}
.busi-quick-navy::after { content: ''; position: absolute; right: 0; bottom: -10px; background: #363c56; width: 36px; height: 36px; border-radius: 100%; z-index: -1;}
.busi-quick-red::after { content: ''; position: absolute; right: 0; bottom: -10px; background: #bc3e3d; width: 36px; height: 36px; border-radius: 100%; z-index: -1;}

.busi-bg-blue { background: #3e5da0;}
.busi-bg-green { background: #3cc896;}
.busi-bg-navy { background: #363c56;}
.busi-bg-red { background: #bc3e3d;}

.busi-txt-blue { color: #3e5da0;}
.busi-txt-green { color: #3cc896;}
.busi-txt-navy { color: #363c56;}
.busi-txt-red { color: #bc3e3d !important;}




/* 도입효과 */
.effect-list-conts { clear: both; position: relative; padding: 50px 5% 50px; display: flex; justify-content: flex-start; align-items:center;}
.effect-list-conts .left { padding-right: 5%;}
.effect-title { padding-bottom: 20px;}
.effect-title p:nth-child(1) { font-size: 30px; color: #222;}
.effect-title p:nth-child(1) span { background: #004a8d; color: #fff; padding: 3px 10px 0; margin-right: 5px;}
.effect-title p:nth-child(2) { padding-top: 5px; font-size: 18px; color: #6c6c6c; line-height:150%;}

.effect-list-point { text-align: left; font-size: 18px; color: #000; margin-top: 30px; display: flex; justify-content: center; align-items:center; line-height: 140%;}
.effect-list-point:before { content: ''; display: inline-block; width: 36px; height: 36px; border-radius: 100%; background: #004d92 url(../img/white-arrow-2.png) center no-repeat; margin-right: 15px;}

.line-bar { clear: both; width: 100%; height: 35px; text-align: center; position: relative; margin: 20px 0 0px;}
.line-bar:before { content: ''; position: absolute; left: 0; top: 75%; width: 100%; height: 100%; background: url(../img/down-arrow.png) center no-repeat; z-index: 100;}
.line-bar:after { content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 100%; background: url(../img/dot.png) left center repeat-x;}

.content-title-effect { clear: both; padding-top: 60px; padding-bottom: 15px; position: relative; font-size: 32px; color: #222; display: inline-block; font-weight: 500;}
.content-title-effect span { font-weight: 500;}
.content-ttl-no { width: 45px; height: 45px; border-radius: 100%; background: #0a2e41; color: #fff; display: inline-block; text-align: center; margin-right: 10px; font-family: 'Exo 2';}
.effect-sub-txt { font-size: 18px; color: #000000; line-height: 140%;}

/* 도입문의 */
.support-conts { clear: both; position: relative;}
.support-conts-top { clear: both; margin-top: 5%; background: #fbf9f9; border-radius: 30px; border:5px solid #f7f6f6; }
.support-top-title { text-align: center; font-size: 30px; color: #222; display: flex; justify-content: center; align-items:center; border-bottom: 1px solid #fff; margin-top: -60px; padding-bottom: 10px; }
.support-top-smart { font-size: 40px; color: #3e5da2; font-weight: 700;}
.support-top-manager { font-size: 40px; color: #bf4443; font-weight: 700;}
.support-top-logo { background: url(../img/support-ic.png) center no-repeat; width: 168px; height: 112px; display: flex; justify-content: center; align-items:center; text-align: center; color: #fff; font-size: 20px; margin-left: 20px; }
.support-info { padding-top: 30px; padding-bottom: 35px; overflow: hidden;}
.support-info dl { float: left; width: 45%; margin-left: 5%; box-sizing: border-box; position: relative; padding-left: 80px;display: flex; justify-content: flex-start; align-items:center;}
.support-info dl dt { font-size: 16px; color: #333; margin-right: 5px; font-weight: 300;}
.support-info dl dd { font-size: 24px; color: #333; font-weight: 700;}
.support-info-mail dt, .support-info-mail dd { float: left;}
.support-info-tel dt, .support-info-tel dd { float: left;}
.support-info-tel dd span { font-size: 17px; font-weight: 300;}
.support-info-mail:before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -35px; width: 68px; height: 68px; background: #fff url(../img/mail-ic2.png) center no-repeat; border-radius: 100%;}
.support-info-tel:before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -35px; width: 68px; height: 68px; background: #fff url(../img/tel-ic2.png) center no-repeat; border-radius: 100%;}
.support-top-stxt { font-weight: 300; margin-right: 10px;}

.support-conts-body { position: relative; margin-top: 100px;}
.support-body-wrap {  display: flex; flex-wrap: wrap; padding: 0 5%;}
.support-body-wrap .support-bodyconts-wrap { position: relative; width: 48%; /* display: flex; justify-content: center; align-items:center; */ margin: 1%;}
.support-bodyconts-wrap dl dt { font-size: 18px; color: #353c56; font-weight: 700; padding-bottom: 20px;}
.support-bodyconts-wrap dl dd { font-size: 16px; color: #000; font-weight: 300; line-height: 130%;}

.support-schedule { text-align: left; width: 100%; display: flex; justify-content: center; align-items:center;}
.support-schedule dl { padding-right: 7%;}
.support-schedule::after { content: ''; flex: none; display: inline-block; width: 235px; height: 235px; border-radius: 100%; background: #3e5da2 url(../img/schedule-img.png) center no-repeat; }

.support-ai { text-align: right; width: 100%; display: flex; justify-content: center; align-items:center;}
.support-ai dl { padding-left: 7%;}
.support-ai::before { content: ''; flex: none; display: inline-block; width: 235px; height: 235px; border-radius: 100%; background: #4ddbc4 url(../img/ai-img.png) center no-repeat;}

.support-modeling { text-align: left; width: 100%; display: flex; justify-content: center; align-items:center;}
.support-modeling dl { padding-right: 7%;}
.support-modeling:after { content: '';flex: none; display: inline-block; width: 235px; height: 235px; border-radius: 100%; background: #353c56 url(../img/modeling-img.png) center no-repeat;}

.support-report { text-align: right; width: 100%; display: flex; justify-content: center; align-items:center;}
.support-report dl { padding-left: 7%;}
.support-report:before { content: '';flex: none; display: inline-block; width: 235px; height: 235px; border-radius: 100%; background: #bf4443 url(../img/report-img.png) center no-repeat;}


.support-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: table; width: 212px; height: 212px; background: #fff; border-radius: 100%; box-shadow: 0px 10px 20px rgba(0,0,0,0.3); z-index: 100;}
.support-logo-conts { display: table-cell; vertical-align: middle;}
.support-logo-conts span { display: block; color:#353c56; text-align: center; line-height: 80%; }
.support-ci { font-size: 24px;}
.support-ci2 { font-size: 48px; font-weight: 700; font-family: 'Exo 2';}
.support-domain { font-size: 16px; font-family: 'Exo 2'; margin-top: 10px;}

.support-schedule-line { position: absolute; left: 0; bottom: 20%; width: 50%; height: 7px; background: #eee; border-radius: 15px;}
.support-schedule-line:before { content: ''; position: absolute; left: 0; bottom: 20%; width: 50%; height: 7px; background: #3e5da2; border-radius: 15px;}
.support-ai-line { position: absolute; left: 50%; bottom: 20%; width: 50%; height: 7px; background: #eee; border-radius: 15px;}
.support-ai-line:before { content: ''; position: absolute; right: 0; bottom: 20%; width: 50%; height: 7px; background: #4ddbc4; border-radius: 15px;}
.support-modeling-line { position: absolute; left: 0; bottom: 20%; width: 50%; height: 7px; background: #eee; border-radius: 15px;}
.support-modeling-line:before { content: ''; position: absolute; left: 0; bottom: 20%; width: 50%; height: 7px; background: #343b55; border-radius: 15px;}
.support-report-line { position: absolute; left: 50%; bottom: 20%; width: 50%; height: 7px; background: #eee; border-radius: 15px;}
.support-report-line:before { content: ''; position: absolute; right: 0; bottom: 20%; width: 50%; height: 7px; background: #bf4443; border-radius: 15px;}

/* 특장점 */
.pro-feature-top { clear: both; position: relative; text-align: center; line-height: 150%; margin-top: 5%; background: #fbf9f9; border-radius: 30px; border:5px solid #f7f6f6; padding: 55px 30px 35px;}
.pro-feature-top .pro-featuretop-ttl { font-size: 36px; color: #343b55; font-weight: 700; line-height: 120%;}
.pro-featuretop-txt { padding-top: 15px;}
.logo-i { font-weight: 500; font-size: 32px; color: #bf4443 !important;}
.logo-si { font-weight: 500; color: #bf4443 !important;}

.pro-feature-top-type { clear: both; position: relative; text-align: center; line-height: 150%; margin-top: 5%; background: #fbf9f9; border-radius: 30px; border:5px solid #f7f6f6; padding:30px 30px 5px;}
.pro-feature-top-type .pro-featuretop-ttl { font-size: 36px; color: #343b55; font-weight: 700; line-height: 120%;}
.pro-feature-top-type .content-top-title { padding-top: 10px; }

.pro-feature-body { clear: both;}
.pro-feature-bodywrap { display: flex; flex-wrap: wrap; padding-top: 8%; }
.pro-feature-conts { position: relative; flex: 0 0 calc(25% - 20px); margin-right: 20px; box-sizing: border-box; border-radius: 30px; border:1px solid #c5cee3; padding: 30px;}
.pro-feature-conts:last-child { margin-right: 0px;}
.pro-feature-conts span { display: block;}
.feature-box-ttl { text-align: center; font-weight: 700; font-size: 22px; padding: 30px 0;}
.feature-box-txt { line-height: 150%; color: #222;}
.feature-box-subtxt { margin-top: 30px; background: #fbf9f9; border-radius: 15px; text-align: center; padding: 10px 0 7px;}
.feature-box1 { border:1px solid #c5cee3;}
.feature-box1:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #3e5da2 url(../img/feature-ic1.png) center no-repeat; border-radius: 100%;}
.feature-box2 { border:1px solid #c2c4cc; background: #fbf9f9;}
.feature-box2:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #343b55 url(../img/feature-ic2.png) center no-repeat; border-radius: 100%;}
.feature-box2 .feature-box-subtxt, .feature-box4 .feature-box-subtxt { margin-top: 30px; background: #fff;}
.feature-box3 { border:1px solid #c1eee7;}
.feature-box3:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #3cc896 url(../img/feature-ic3.png) center no-repeat; border-radius: 100%;}
.feature-box4 { border:1px solid #ecc7c6; background: #fbf9f9;}
.feature-box4:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #bf4443 url(../img/feature-ic4.png) center no-repeat; border-radius: 100%;}

.feature-box5 { border:1px solid #c1eee7;; background: #fbf9f9;}
.feature-box5:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #3cc896 url(../img/feature-ic5.png) center no-repeat; border-radius: 100%;}
.feature-box6 { border:1px solid #ecc7c6; background: #fbf9f9;}
.feature-box6:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #bf4443 url(../img/feature-ic6.png) center no-repeat; border-radius: 100%;}

.feature-ic1 { border:1px solid #c2c4cc; background: #fbf9f9;}
.feature-ic1:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #3e5da2 url(../img/feature-ic3.png) center no-repeat; border-radius: 100%;}

.feature-ic2 { border:1px solid #c2c4cc; background: #fbf9f9;}
.feature-ic2:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #343b55 url(../img/feature-ic7.png) center no-repeat; border-radius: 100%;}

.feature-ic3 { border:1px solid #c2c4cc; background: #fbf9f9;}
.feature-ic3:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #3cc896 url(../img/feature-ic6.png) center no-repeat; border-radius: 100%;}

.feature-ic4 { border:1px solid #c2c4cc; background: #fbf9f9;}
.feature-ic4:before { content: ''; position: absolute; left: 50%; margin-left: -37px; top: -37px; width: 74px; height: 74px; background: #bf4443 url(../img/feature-ic8.png) center no-repeat; border-radius: 100%;}

.feature-ttl { position: relative; clear: both; margin-top:8%; text-align: center; }
.feature-ttl span { font-size: 24px; color: #353c56; font-weight: 600;}
.feature-ttl span:before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 100%; background: #c34544; margin-right: 10px; margin-bottom: 2px; vertical-align: middle;}
.feature-ttl span:after { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 100%; background: #c34544; margin-left: 10px; margin-bottom: 2px; vertical-align: middle;}
.feature-ttl:after { content: ''; position: absolute; left: 0; top: 50%; margin-top: -1px; width: 100%; height: 1px; background: #efecec; z-index: -1;}

.feature-3col-conts { display: flex; justify-content: center; align-items:stretch; border:1px solid #c5cee3; padding: 25px; border-radius: 30px; width: 80%; height: 100%; margin: 0 auto;}
.feature-3col-conts .feature-3col { width: 33.33%; text-align: center;}
.feature-3col-conts .feature-3col ul { padding: 0 2%; box-sizing: border-box;}
.feature-3col-conts .feature-3col li:first-child { font-size: 24px; color: #3e5da2; text-transform: uppercase; font-weight: 700; padding-bottom: 20px;}
.feature-3col-conts .feature-3col li:last-child { padding: 9px 0 5px; font-size:18px; color: #222222; text-transform: uppercase; font-weight: 500; margin-top: 20px; background: #fbf9f9; border-radius: 30px;}
.feature-3col-conts .feature-3col li:nth-child(2) { min-height: 150px; display: flex; justify-content: center; align-items:center;}

.feature-txt { position: relative; font-size: 16px; color: #222; padding-left: 32px; text-align: center; padding:20px 0; vertical-align: middle;}
.feature-txt:before { content: ''; display: inline-block; background: url(../img/bullet-navy.png) left 0px no-repeat; width: 25px; height: 24px; margin-right: 5px;  vertical-align: middle; vertical-align: middle;}

.feature-graphic { text-align: center;}
.feature-graphic span { display: block;}
.feature-graphic span:nth-child(2) { margin-top: 15px; font-size: 20px; color: #222; font-weight: 700;}

.feature-3col-logic { display: flex; justify-content: center; align-items:stretch; width: 80%; height: 100%; margin: 0 auto;}
.feature-3col-logic .feature-3col { flex: 0 0 calc(33.333333% - 15px); margin-right: 20px; border:1px solid #efecec; padding: 25px; border-radius: 30px;}
.feature-3col-title { font-size: 24px; color: #022222; font-weight: 700; text-transform: uppercase; text-align: center; padding-bottom: 20px;}
/* .feature-3col-title:after { content:''; display: inline-block; border-bottom: 1px solid #022222; width: 100%;} */
.feature-3col-logic .feature-3col li { position: relative; padding-left: 25px; font-size: 18px; color: #222; line-height: 150%;}
.feature-3col-logic .feature-3col li:before { content: ''; position: absolute; left: 0; top: 0; background: url(../img/bullet-navy-s.png) left center no-repeat; width: 21px; height: 21px;}


/* 기능소개 */
.system-conts { clear: both;}
.system-title { position: relative; clear: both; font-size: 40px; color: #000; font-weight: 500; padding-top: 20px; padding-left: 12px;}
.system-title::before { content: '-'; position: absolute; left: 0; top: 50%; margin-top: -5px; font-size: 20px; font-weight: 500; vertical-align: top; color: #c04443;}
.system-title span { font-size: 24px; font-weight: 300;}
.system-txt { clear: both; font-size: 20px; color: #000; font-weight: 300; padding-top: 5px; padding-bottom: 20px; line-height: 120%;}
.system-txt span { display: block; font-size: 20px; color: #000; font-weight: 300;}

.system-atype-img { display: flex; justify-content: center; align-items:center; margin-bottom: 100px;}
.system-atype-img span { width: 50%; padding: 10px 10px 0 0; box-sizing: border-box;}
.system-atype-img span:last-child { padding-right: 0;}
.system-atype-img span img { width: 100%;}


.main-bodyconts { position: relative;}


/* 메인 비주얼 */
.main-visual { text-align: center; box-sizing: border-box;}
.main-v-ttl { font-size: 48px; font-family: 'Exo 2';}
.main-v-txt { font-size: 24px; padding-top: 10px; font-weight: 300; padding-bottom: 1%;}
.v-txt-a { padding-top: 10%; }
.v-txt-b { padding-top: 7%;}
.v-txt-c { padding-top: 5%;}

.price-txt { font-weight: 600; font-size: 15px; margin-left: 10px;}


/* 로그인 타이틀 */
.login-title { text-align: center;}
.login-title p { font-size: 46px; color: #333; font-weight: 300;}
.login-conts { clear: both; max-width: 360px; margin: 0 auto; padding-top: 50px;}
.login-input { margin-bottom: 10px;}
.login-input .input-a { width:100%; height: 58px; border-radius: 5px; border:1px solid #f1f2f3;}
.login-input .input-a::-webkit-input-placeholder { color:rgba(0,0,0,0.2); font-family: 'GmarketSans';}
.login-input .input-a:-moz-placeholder { color:rgba(0,0,0,0.2); font-family: 'GmarketSans';}
.login-input .input-a::-moz-placeholder { color:rgba(0,0,0,0.2); font-family: 'GmarketSans';}
.login-input .input-a:-ms-input-placeholder { color:rgba(0,0,0,0.2); font-family: 'GmarketSans';}
.login-input .input-a::placeholder { color:rgba(0,0,0,0.2); opacity:  1; font-family: 'GmarketSans';}


.login-btn { clear: both; margin-top: 20px; width:100%; height: 58px; border-radius: 5px; background: #353c56; display: table;}
.login-btn a { text-align: center; color: #fff; font-size: 18px; display: table-cell; vertical-align: middle;}

.idpw-btn { position: relative; text-align: center; padding: 20px 0; font-size: 14px; color: #333;}
.idpw-btn:after { content: ''; position: absolute; left: 50%; margin-left: -5px; top: 50%; margin-top: -6px; background: #a1a1a1; width: 1px; height: 12px;}
.idpw-btn a { padding: 0 25px;}


/* 회원인증 */
.join-conts { clear: both; max-width: 400px; margin: 0 auto; }
.join-title { padding-bottom: 50px;}
.join-title p:nth-child(1) { font-size: 46px; color: #333; font-weight: 300;}
.join-title p:nth-child(2) { font-size: 36px; color: #333; font-weight: 300;}
.join-title p:nth-child(2) span { font-weight: 700;}

/* 약관 */
.privacy-list { clear: both; border-top: 1px solid #494949;}
.privacy-list ul li { position: relative; padding: 20px; font-size: 16px; color: #999; font-weight: 300; border-bottom: 1px solid #f0eeee; padding-right: 100px;}
.privacy-list ul li:first-child { background: #f6f5f5; color: #000;}
.privacy-title { padding-bottom: 50px;}
.privacy-title p:nth-child(1) { font-size: 30px; color: #333; font-weight: 300;}
.privacy-title p:nth-child(2) { font-size: 36px; color: #333; font-weight: 300;}
.privacy-title p:nth-child(2) span { font-weight: 700;}
a.check-view { position: absolute; right: 15px; top: 42%; font-size: 13px; color: #333;}
.privacy-txt { text-align: center; font-size: 13px; color: #333; padding: 20px 0 20px;}

.idpw-txt { font-size: 16px; color: #333; text-align: center; padding: 10px 0 20px;}

.idpw-ok { text-align: center; text-decoration: underline; color: #333; font-size: 17px;}
.idpw-checking { text-align: center; color: #0a74fe; font-size: 32px; padding: 30px 0 20px 0; font-weight: 500;}
.idpw-search { display: table; width:100%; height: 58px; border-radius: 5px; border:1px solid #f1f2f3; font-size: 18px; color: #ff7070; text-align: center;}
.idpw-search span { display: table-cell; vertical-align: middle;}

/* 약관 팝업 */
.popup_conts { position:absolute; top:45px; right:0; z-index:1000000; }
.layer_wrap { font-size: 13px; line-height: 160%; width:280px; max-height:200px; overflow-y: auto; display:block; background: #fff; border-radius:7px; border:1px solid #a9a9a9; padding: 10px; box-shadow: 5px 5px 5px rgba(169,169,169,0.3);}

/* 가입완료 */
.join-ok-wrap { text-align: center; width: 100%; height: 100%; }
.join-ok-conts { padding-top: 10%;}
.join-ok-ttl { clear: both;}
.join-ok-maintxt { font-size: 36px; color: #333; font-weight: 300; line-height: 120%;}
.join-ok-maintxt span { font-size: 36px; color: #333; font-weight: 500; line-height: 120%;}
.join-ok-subtxt { font-size: 26px; color: #333; font-weight: 500;line-height: 170%;}
.join-ok-subtxt span { font-size: 36px; color: #333; font-weight: 700;}
.join-ok-subtxt .logo-i { font-size: 28px;}
.join-ok-txt { font-size: 16px; font-weight: 300; color: #000; padding-top: 30px;}
.join-ok-box { width: 300px; height: 100px; margin:10px auto 0; background: #fff; display: table; border-radius: 5px; padding: 5px; border:1px solid rgba(238,238,238,0.8);}
.join-ok-box a {display: contents; }
.join-ok-id { margin-top: 20px; color: #fff; display: table-cell; vertical-align: middle; background: #353c56; border-radius: 5px;}
.join-ok-wrap .tbl-wrap { margin: 10px 10%;}

/* 박스 */
.myinfo-box { margin-top: 50px; background: #eeeeee; border-radius:20px; border: 8px solid #f6f5f5; }
.myinfo-b-title { font-size:30px; font-weight: 700; text-align: right; padding: 20px 30px 15px;}
.myinfo-b-no { font-size: 24px; color: #000; letter-spacing: -1; font-weight: 300;text-align: center; }
.myinfo-b-no span { font-size: 40px; color: #000; font-weight: 700;}
.myinfo-box-conts { display: flex; justify-content: center; align-items:center;}
.mypage-blank { padding: 0 30px 20px;}

.myinfo-radio .checkmark_radio { top: 3px;}

.myinfo-info { clear: both; padding-top: 30px;}
.myinfo-info span { display: block; line-height: 130%; }
.myinfo-info-ttl { font-size: 18px; font-weight: 700; color: #222; display: none;}
.myinfo-info-txt { font-size: 15px; color: #222;}



/* 사용자 리뷰 */
.user-review { clear: both; border-top: 2px solid #2e2e2e; margin-top: 50px;}
.user-review > ul > li { position: relative; padding: 35px 0; border-bottom: 1px solid #eaedee; min-height: 112px;}
.user-review-conts { width: 100%; padding: 0 30px; box-sizing: border-box;}
.user-review-photo { position: absolute; left: 20px; top: 30px; }
.user-review-photo img { width: 260px; height: 160px; border-radius:7px;}
.user-review-list { padding-left: 300px; }
.user-review-list dt { font-size: 18px; color: #333; padding-bottom: 10px; font-weight: 700;}
.user-review-list dd { font-size: 17px; color: #333; line-height: 130%; font-weight: 300;}
.user-review-list > dd > ul > li { clear: both; font-weight: 300; font-size: 15px; border-bottom: 1px solid rgba(238,238,238,0.8); padding: 10px 0 7px;}
.user-review-list > dd > ul > li span { font-size: 15px; font-weight: 500; margin-right: 10px;}
.user-review-list dd.review-after { padding: 15px 15px 0; font-size: 15px; line-height: 150%;}
.review-view { clear: both; width: 100%; height: 45px; line-height: 45px; text-align: center; margin-top: 30px; background: #f6f7f9; border: 1px solid rgba(238,238,238,0.8); color: #222;}
.bullet-review { clear: both;}
.bullet-review li { position: relative;}
.bullet-review li:before { content: 'ㆍ'; display: inline-block;}

.review-detail-conts { clear: both; border-top: 2px solid #2e2e2e; margin-top: 30px;}
.review-detail-conts > ul > li { border-bottom: 1px solid #d9e5e8; position: relative; padding: 30px 5px;}
.review-detail-conts .review-detail-list { padding: 0 0 25px; display: block; cursor: pointer; color: #333; line-height: 130%; font-size: 18px; user-select: none; box-sizing: border-box;}
.review-detail-conts .review-detail-view { position: relative; color: #666; background: #f6f8f9; padding: 25px 30px; line-height: 170%;}
.review-detail-img { padding:40px 0;}

.prev-btn { background: #0222; color: #222; width: 60px; height: 40px; line-height: 45px; border-radius:3px; text-align: center; margin-top: 15px;}

.feature-col2 { clear: both; display: flex; justify-content: center; align-items:center;}
.feature-col2 > div { float: left; width: 50%;}
.feature-col2 > div.ac img { width: 95%;}

.feature-list { clear: both; text-align: left; padding: 0 30px;}
.feature-list dl { margin-bottom: 15px;}
.feature-list dl dt { color: #353c56; font-weight: 700; padding-bottom: 5px;}
.feature-list dl dd { color: #000; font-weight: 500; line-height: 130%;}

/* 1206 과금정책 추가 */
.txt-option { font-size: 30px !important;}
.box-option { background:#fff; padding:25px 15px; overflow:hidden; margin-top:24px; border-radius:16px; border:1px solid #e0e0e0; box-sizing: border-box; height: 170px;}
.box-option li { line-height: 180%; padding-left: 15px; position: relative; color: #666;}
.box-option li::before { content: 'ㆍ'; position: absolute; left: 0; top: 0;}
.box-option li span.fl { font-weight: 600; color: #222; margin-right: 5px;}

.option-support { min-height: 120px; display: flex; justify-content: center; align-items:center;}

.aips-movie { text-align: center; clear: both; height: 45px; line-height: 45px; text-align: center; margin: 30px 5%; background: #005096; border: 1px solid rgba(238,238,238,0.8); color: #fff; border-radius:5px; font-size: 17px; padding-top: 3px;}
.aips-movie span { font-size: 13px; font-weight: 300; background: #053967; padding: 5px 15px 2px; border-radius: 15px;}


/* 인증서현황 20230104 */
.quality-list { clear: both; display: flex; margin-top: 50px;}
.quality-list ul { margin: 0 5%; }
.quality-list ul li { text-align: center;}
.quality-list ul li img { width: 100%; }
.quality-list ul li:first-child { background: #fbf9f9; border: 1px solid #f7f6f6; padding: 5px;}
.quality-list ul li:last-child { margin-top: 15px; font-size: 15px; color: #222; height: 50px;}



/****************************************************************************************/
/****************************************************************************************/
/*Media Query*/
/****************************************************************************************/
/****************************************************************************************/


@media (max-width:1400px) {	

    .sideconts { width: 220px;}
    .side-title-wrap { left: 220px;}
    .sub-content { padding-left: 360px;}    
    .side-title {margin-top: 270px;}

    .about-list { padding-left:20px; padding-right: 0;}

    .pro-feature-conts { padding: 15px 10px;}

    .imgwidth { width: 100%;}
    .imgwidth-2 { width: 100%;}

    .pro-feature-body.pad50lr { padding: 0 !important;}
    .bullet-a.pad50lr{ padding: 0 !important;}


    .support-schedule::after,
    .support-ai::before, 
    .support-modeling:after,
    .support-report:before { width: 180px; height: 180px;}
    .support-logo { width: 180px; height: 180px;}
    .support-schedule dl { padding-right: 15px;}
    .support-body-wrap { padding: 0;}
    
    .sidemenu { position: absolute; width: 100%; right:0; top: 23%; z-index: 100;}
    .sidemenu li { padding: 4px 30px 4px 0;}

    .imgwidth-2-5 img { width: 100%;}
    .support-schedule-line, .support-ai-line, .support-modeling-line, .support-report-line { bottom: 10%; }
    
}


@media (max-width:1024px) {	

    #aside { background: rgba(238,238,238,0.8);}
    .side-title { position: relative; margin-top:0px; font-size: 32px; left: 0; padding-top:10px; transform: rotate(0deg); width: 100%; box-sizing: border-box; text-align: center; height: 60px;}
    .side-title span { display: inline-block; font-size: 30px; font-weight: 300;}
    .content-title { padding-top:50px;}
    .innerConts { max-width: 100%; padding: 0;}
    .sub-content { padding-left: 15px; padding-right: 15px; padding-bottom: 150px;}

    .v-txt-a { padding-top: 20%;}

    .main-v-ttl { font-size: 36px;}
    .main-v-txt { font-size: 16px; padding: 0 30px; line-height: 130%; margin-top: 5px; padding-bottom: 10px;}

    .side-title-wrap { position: relative; background:rgba(238,238,238,0.8); left: 0; width: 100%; height: auto; z-index: 10000; }

    .about-service-txt { padding: 25px 25px 20px; border-radius: 25px;}
    .about-service-txt p { font-size: 16px; font-weight: 300;}

    .pro-feature-conts { margin-right: 10px; flex: 0 0 calc(25% - 10px); border-radius: 10px;}
    .pro-feature-top { padding: 25px 20px 20px;}
    
    .pro-feature-top .pro-featuretop-ttl { font-size: 24px;}
    .pro-feature-top-type .pro-featuretop-ttl { font-size: 24px;}
    .imgwidth-2 { width: auto;}

    .system-atype-img { display: block;}
    .system-atype-img span { width: 100%; display: block;}
    .system-title { font-size: 30px;}

    .effect-title p:nth-child(1) { font-size: 24px;}
    .effect-title { padding-bottom: 5px;}

    
    .support-ai dl, .support-report dl { padding-left: 5%;}
    .support-modeling dl { padding-right: 5%;}
    .support-bodyconts-wrap dl dd { font-size: 14px;}
    .support-bodyconts-wrap dl dt { padding-bottom: 7px;}
    .support-info dl dd { font-size: 17px;}
    .support-info-tel dd span { display: block;}

    .feature-col2 { display: block;}
    .feature-col2 > div { width: 100%;}
    .feature-list { padding: 0;}


    
    
}




@media (max-width: 1278px) and (min-width: 1024px) {

    .effect-list-conts { display: block;}
    .effect-list-conts .right { padding-top: 30px;}
    .effect-list-conts .left { padding-right: 3%;}

}


@media (max-width:1200px) {	
    .theme-3type { display: block; margin-top: 0;}
    .theme-3type dl dt { text-align: left;}
    .sub-tabmenu ul li a { padding-left: 5px; padding-right: 5px;}
    .pro-feature-conts { margin-right: 10px; flex: 0 0 calc(50% - 10px); border-radius: 10px; margin-bottom: 50px;}

    .feature-3col-conts { width: 92%;}

    /* 인증서현황 20230104 */
.quality-list { clear: both; display: flex; margin-top: 50px;}
.quality-list ul { margin: 0 1%; }
    
}



@media (max-width:767px) {	


    .about-list dl:before { width: 30px; height: 30px; border-radius: 100%; top: 0; margin-top: -3px;}
    .about-list dl:after { left: 15px;}
    .about-list dl { padding-left: 40px;}
    .about-list dl dt { font-size: 20px; font-weight: 500;}
    .about-list dl dd { font-weight: 300;}

    .box-Ctype .pad20a { padding: 0;}


    .sub-tabmenu ul li a { font-size: 14px;}
   
    .content-title { font-size: 30px;}

    .imgwidth-2 { width:100%;}

    .feature-3col-conts { display: block;}
    .feature-3col-conts .feature-3col { width: 100%; margin-bottom: 20px;}
    .feature-3col-conts .feature-3col li:nth-child(2) { height: auto;}

.feature-3col-logic { display: block; width: 100%;}
.feature-3col-logic .feature-3col { flex: 0 0 calc(100% - 0px); margin-right: 0px; margin-bottom: 10px;}

.pro-feature-top-type { padding: 20px 10px 15px;}
.content-top-title { font-size: 16px;}


.version-type { clear: both;}
.version-type thead th { display: block; display: none;}
.version-type tbody td { display: block;}
.version-type tbody th { background: #f9f7f7 !important;}
.business-theme-txt p:nth-child(1) { font-size: 20px;}

.support-info { padding: 0;}
.support-info dl { width: 100%; height: 75px;}
.support-top-logo { width:120px; height: 85px; border-radius: 15px;}
.support-top-title { margin-top: -40px; font-size: 24px;}

.support-body-wrap { display: block;}
.support-body-wrap .support-bodyconts-wrap { width: 100%;}
.support-logo { display: none;}
.support-conts-body { padding-top: 0px;}

.privacy-title { padding-bottom: 20px;}
.privacy-title p:nth-child(1), .privacy-title p:nth-child(2) { font-size: 20px;}
.privacy-list ul li { padding: 10px;}
.checkbox_css { font-size: 13px; padding-left: 30px;}

.join-ok-maintxt { font-size: 24px; color: #333; font-weight: 300; line-height: 120%;}
.join-ok-maintxt span { font-size: 24px; color: #333; font-weight: 500; line-height: 120%;}
.join-ok-subtxt { font-size: 22px; color: #333; font-weight: 500;line-height: 170%;}
.join-ok-subtxt span { font-size: 22px; color: #333; font-weight: 700;}
.join-ok-subtxt .logo-i { font-size: 20px;}

.join-ok-wrap .tbl-wrap { margin: 10px 0;}

.effect-list-conts { display: block;}
.effect-list-conts .right { padding-top: 30px;}

.sub-tabmenu ul li span { display: block;}

    /* 인증서현황 20230104 */
    .quality-list { clear: both; display: block; margin-top: 50px;}
    .quality-list ul { margin: 0 15%; }


    .user-review-list { padding-left: 0; padding-top: 200px;}


}


@media (max-width:480px) {	


    .pro-feature-conts { flex: 0 0 calc(100% - 0px); }
   
    .busi-box { min-width: 100%;width: 100%;}

    .join-ok-maintxt { font-size: 20px;}
    .join-ok-maintxt span { font-size: 20px;}
    .join-ok-subtxt { font-size: 18px;}
    .join-ok-txt { font-size: 14px;}

    .effect-list-point:before { flex: none;}
    .support-schedule, .support-ai, .support-modeling, .support-report { display: block; text-align:center;}
    .support-schedule-line, .support-ai-line, .support-modeling-line, .support-report-line { width: 100%; bottom: -5px; left: 0;}
    .support-schedule-line:before, .support-ai-line:before, .support-modeling-line:before, .support-report-line:before { width: 0%;}
    .support-body-wrap .support-bodyconts-wrap { margin-bottom: 50px;}
    .support-ai dl, .support-report dl { padding-left: 0;}
    .support-modeling dl { padding-right: 0;}
    .support-schedule dl { padding-right: 0;}
    
    .support-conts-top { margin-top: 15%;}
    .support-top-title { text-align: left; display: block;font-size: 25px; margin-top: -20px;}
    .support-top-title span { font-size: 25px;}
    .support-info dl { display: block; padding-left: 0; padding-top: 10px; height: auto;}
    .support-info dl dd { font-size: 15px;}
    .support-info-mail:before, .support-info-tel:before { content: ''; background: none;}

    .support-bodyconts-wrap dl dt { padding-bottom: 5px;}
}


@media (max-width:400px) {	

    .content-ttl-no { width: 35px; height: 35px;}
    .content-title-effect { font-size: 25px;}
    .effect-list-conts .left { padding-right:0;}
    .effect-list-conts .left img { width: 100%;}
    
    

}