@charset "utf-8";

@import url('default.css');

/*common*/
.btn_quick {position: fixed; bottom: 15px; right: 15px; z-index: 10;}
#MOVE_TOP_BTN{position: fixed; right:30px; bottom: 117px; display: none; z-index:999;}
.wrap {position: relative; min-width: 1200px; overflow: hidden;}
.inner {width:1200px; margin:0 auto; position: relative;}
.con_tit {padding-bottom:60px}
.con_tit h3 {font-size:50px; line-height:60px; text-align: center; margin-bottom:25px; font-weight: 700;}
.con_tit h3 .sub {font-size:30px; font-weight: 200;}
.con_tit .txt {font-size:20px; line-height: 30px; text-align: center;}

/* Header */
header {padding:20px 100px; position: relative; display: flex; justify-content: space-between; align-items: center; align-items: flex-end; z-index: 10;}
header h1 {position: relative; display: block; width: 158px; height: 45px;}
header h1 img {position: absolute; top: 7px; left: 0px;}
header nav {position: relative;}
header nav ul {display: flex; font-size:18px; text-align: center; align-items: flex-end; position: relative;}
header nav ul li {margin-right:80px}
header nav ul li:last-child {margin-right:0px}
header nav a:hover {text-decoration: underline;}
header nav .speech-bubble {font-size:12px; color:#fff; display: inline-block; position: absolute; background: #ff7700; border-radius:300px; padding:2px 12px; line-height:16px; left:80px; top:-22px;}
header nav .speech-bubble:after {content: ''; position: absolute; bottom: 0; left: 52%; width: 0; height: 0; border: 6px solid transparent; border-top-color: #ff7700; border-bottom: 0; border-left: 0; margin-left: 50px; margin-bottom: -6px;}
header .member .list {display: flex; font-size: 14px; color:#666666;}
header .member .list li:first-child {margin-right:10px}
header .member .list .menu li {margin-right:0 !important}
header .member .list li a {border:1px solid #ccc; border-radius: 300px; padding:2px 12px; display: inline-block; }
header .member .list .btn_crm {padding:2px 30px 2px 30px; background: -moz-linear-gradient(left,  #ff7700 20%, #ffbe05 100%); background: -webkit-linear-gradient(left,  #ff7700 20%,#ffbe05 100%); background: linear-gradient(to right,  #ff7700 20%,#ffbe05 100%); color:#fff; border:none !important}
header .member .list .btn_crm:hover {color:#fff;}
header .member .list .crm .btn_crm {padding:2px 30px 2px 12px; display: inline-block; background: -moz-linear-gradient(left,  #ff7700 20%, #ffbe05 100%); background: -webkit-linear-gradient(left,  #ff7700 20%,#ffbe05 100%); background: linear-gradient(to right,  #ff7700 20%,#ffbe05 100%); color:#fff; border:none !important; position: relative; cursor: pointer;}
header .member .list .crm .btn_crm:hover {color:#fff;}
header .member .list .crm .arrow-down {background: url(../img/common/ico_select.png) no-repeat; width: 8px; background-size: 8px; height: 5px; display: inline-block; right: 12px; position: absolute; top: 12px;}
header .member .list .crm .arrow-up {background: url(../img/common/ico_select_up.png) no-repeat; width: 8px; background-size: 8px; height: 5px; display: inline-block; right: 12px; position: absolute; top: 12px;}
header .member .list .crm .menu { display: none; position: absolute;background: #fff;box-sizing: border-box; max-width:250px; padding:10px 15px; top: 67px; border-radius: 10px; z-index: 100; border: 1px solid #cccccc;}
header .member .list .crm .menu li a {color:#777; padding: 0 !important; border: none; display: block;}
header .member .list .crm .menu li:last-child{padding: 10px 0 2px 0px;font-size: 15px;font-weight: 600;text-align: center;}
header .member .list .crm .menu li:last-child a{color:#000000;}
header .member .list .crm .menu li a:hover {color:#ff7700}
header .member .list .crm .menu .auth_progress {color:#1ab1ff}
header .member .list .crm .menu .auth_reject {color:#ff5900}
header .member .list .user .btn_user {background:#fff; border:1px solid #ccc; border-radius: 300px; padding:2px 30px 2px 12px; display: inline-block; max-width:200px; box-sizing: border-box; position: relative;}
header .member .list .user .arrow-down {background: url(../img/common/ico_select.png) no-repeat; width: 8px; background-size: 8px; height: 5px; display: inline-block; right: 12px; position: absolute; top: 12px;}
header .member .list .user .arrow-up {background: url(../img/common/ico_select_up.png) no-repeat; width: 8px; background-size: 8px; height: 5px; display: inline-block; right: 12px; position: absolute; top: 12px;}
header .member .list .user .menu { display: none; position: absolute;background: #fff;box-sizing: border-box; width:107px; padding:10px 15px; top: 67px; border-radius: 10px; text-align: center; z-index: 100; border: 1px solid #cccccc;}
header .member .list .user .menu li a {color:#777; padding: 0 !important; border: none; display: block;}
header .member .list .user .menu li a:hover {color:#ff7700}

/* 버튼 */
.btn01 {min-width:200px; display:inline-block; font-size:18px; color:#fff; padding:20px 60px; border-radius: 10px; background: -moz-linear-gradient(left,  #ff7700 45%, #ffbe05 100%); background: -webkit-linear-gradient(left,  #ff7700 45%,#ffbe05 100%); background: linear-gradient(to right,  #ff7700 45%,#ffbe05 100%); box-sizing: border-box; text-align: center;}
.btn01:hover,.btn02:hover,.btn03:hover {color:#fff;}
.btn02 {min-width:200px; display:inline-block; font-size:18px; color:#fff; padding:20px 60px; border-radius: 10px; background: -moz-linear-gradient(left,  #ff9e05 45%, #ffdc36 100%); background: -webkit-linear-gradient(left,  #ff9e05 45%,#ffdc36 100%); background: linear-gradient(to right,  #ff9e05 45%,#ffdc36 100%); box-sizing: border-box; text-align: center;} 
.btn03 {min-width:200px; display:inline-block; font-size:18px; color:#fff; padding:20px 60px; border-radius: 10px; background: -moz-linear-gradient(left,  #4abbff 45%, #61e3ff 100%); background: -webkit-linear-gradient(left,  #4abbff 45%,#61e3ff 100%); background: linear-gradient(to right,  #4abbff 45%,#61e3ff 100%); box-sizing: border-box; text-align: center;}
.btn04 {display:inline-block; font-size:18px; color:#ff7700; padding:20px 40px; border-radius: 10px; background: transparent; border: 2px solid #ff7700; text-align: center;}
.btn04:hover {color:#ff7700;}
.btn05 {display:inline-block; font-size:18px; padding:17px 40px; border-radius: 5px; background: transparent; min-width: 200px; border:1px solid #fff; color:#fff; box-sizing: border-box; transition: all 0.3s; text-align: center;}
.btn05:hover {background: #fff;}

/* Footer */
footer {background-color: #2f2f2f; padding:90px 0px 30px}
footer a, footer a:hover {color:#fff;}
footer .left, footer .right {color:#fff;font-weight: 200; }
footer .left .tit {font-size:30px; font-weight: 200; margin-bottom:30px;}
footer .right {display: flex; }
footer .right dl {margin-right:130px;}
footer .right dl:last-child {margin-right:0px;}
footer .right dt {margin-bottom:25px}
footer .right dd {margin-bottom:10px}
footer .copyright::before {content:''; width:100%; height:1px; background: #444; position:absolute;}
footer .copyright {padding-top:70px}
footer .copyright .inner {padding-top:35px}
footer .copyright li a {color:#fff; margin-right:30px}
footer .copyright address {color:#999; font-size:14px; margin-top:20px}
footer .copyright address dl {position: relative;}
footer .copyright address dt {display: inline-block;}
footer .copyright address dd {display: inline-block; margin-right:15px}
footer .copyright p {font-size:12px; color:#666666; margin-top:15px}

/* 메인 - 슬라이드 */
.main_visual .swiper {width: 100%; height: 1000px; margin-top: -85px}
.main_visual .swiper .bg01 {background:url('../img/main_visual_bg01.jpg') top center no-repeat; background-size: cover; }
.main_visual .swiper .bg02 {background:url('../img/main_visual_bg02.jpg') top center no-repeat; background-size: cover; }
.main_visual .swiper .bg03 {background:url('../img/main_visual_bg03.jpg') top center no-repeat; background-size: cover; }
.main_visual .swiper .bg01 .img {position: absolute; right: -160px; top: -60px;}
.main_visual .swiper .bg02 .img {position: absolute; right: -40px; top: -130px;}
.main_visual .swiper .bg03 .img {position: absolute; right: -270px; top: -55px;}
.main_visual .swiper-slide .txt {margin-top:280px;}
.main_visual .swiper-slide .txt .sub {font-size:22px; font-weight:600; text-decoration: underline; margin-bottom:30px;}
.main_visual .swiper-slide .txt .tit {font-size:70px; line-height: 85px; font-weight:500; margin-bottom:30px;}
.main_visual .swiper-slide .txt span {font-size:20px; line-height: 30px; display: block; }
.main_visual .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover;}

/* 메인 - 리뷰 */
.main_review {padding:150px 0px; width:1200px; margin:auto; }
.main_review ul li {width:31.5%; border-radius: 30px; padding:50px 35px 50px 35px; background-color: #fffbf9; border:1px solid #ffbf99; box-sizing: border-box;}
.main_review ul li:nth-child(2) {background-color: #f9fdfd; border:1px solid #9adce1; box-sizing: border-box;}
.main_review ul li .tit {font-size:22px; font-weight: 500; line-height: 30px; margin:30px 0px 25px;}

/* 메인 - 프랜시스파커 CRM */
.main_crm {background-color: #f6f7f8; padding:130px 0px 150px}
.main_crm .tab {width: 1000px; cursor: pointer; margin: auto}
.main_crm .tab .swiper-slide {text-align:center; font-size:18px; padding:12px 0px; box-sizing: border-box; border-radius: 300px; background-color: #fff; border:1px solid #ff7700; color:#ff7700}
.main_crm .tab .swiper-slide-thumb-active {background-color: #ff7700; color:#fff;}
.main_crm .mySwiper2 {margin-top:30px; overflow: hidden;}
.main_crm .mySwiper2 .swiper-slide {background:#fff; width:1200px; box-sizing: border-box; border:1px solid #e5e5e5; border-radius: 30px; padding:50px; display: block; text-align:center}
.main_crm .mySwiper2 .swiper-slide li {width:32.5%; margin-top:50px; border:1px solid #eee; text-align: left; padding:30px; border-radius: 15px; box-sizing: border-box;}
.main_crm .mySwiper2 .swiper-slide .two li {width:49.4% !important}
.main_crm .mySwiper2 .swiper-slide li i {background: #ff7700; color:#fff; font-size:14px; font-weight: 600; width: 32px; height: 32px; line-height: 32px; text-align: center; border-radius: 5px; display: inline-block; margin-bottom:20px}
.main_crm .mySwiper2 .swiper-slide li .tit {font-size:22px; font-weight:600; padding-bottom:15px}
.main_crm .mySwiper2 .swiper-slide li .txt {font-size:16px;}

/* 메인 - 프랜시스파커 */
.main_joa {padding:130px 0px 150px; background: -moz-linear-gradient(top,  #ffffff 0%, #fff7e4 35%); background: -webkit-linear-gradient(top,  #ffffff 0%,#fff7e4 35%); background: linear-gradient(to bottom,  #ffffff 0%,#fff7e4 35%);}
.main_joa .tabnav {display:flex; justify-content: center; margin-bottom:30px;}
.main_joa .tabnav li{display: inline-block;}
.main_joa .tabnav li:first-child {margin-right:10px}
.main_joa .tabnav li a{text-align:center; font-size:18px; display:inline-block; padding:12px 20px; width:160px; box-sizing: border-box; border-radius: 300px; background-color: #fff; border:1px solid #ff9c00; color:#ff9c00}
.main_joa .tabnav li a.active{background:#ff9c00; color:#fff;}
.main_joa .tabcontent {background:#fff; width:1200px; box-sizing: border-box; border:1px solid #e5e5e5; border-radius: 30px; padding:50px; display: block;}
.main_joa .tabcontent .info {width:615px;flex-wrap: wrap; gap:15px;/*align-items: flex-start;*/}
.main_joa .tabcontent .info li {width: 300px; border:1px solid #eee; border-radius: 10px;box-sizing: border-box; padding:40px 30px}
.main_joa .tabcontent .info li:nth-child(1),.main_joa .tabcontent .info li:nth-child(4),.main_joa .tabcontent .info li:nth-child(5),.main_joa .tabcontent .info li:nth-child(8) {background:#f8f8f8; } 
.main_joa .tabcontent .info li .tit {font-size:22px; font-weight:600; padding-bottom:15px}
.main_joa .tabcontent .info li .txt {font-size:16px;}
.main_joa .download {border-top:1px solid #eee; padding-top:50px; margin-top:50px; text-align: center;}
.main_joa .download p {font-size:20px; font-weight:600; margin-bottom:8px; position: relative;}
.main_joa .comming {color:#fff; font-size:14px; line-height: 22px; background:#aaa; border-radius: 300px; font-weight: 200; padding:0px 10px; display: inline-block; position: relative; margin-left:8px; top: -3px;}
.btn_store {margin:auto}
.btn_store .google {text-align: center; width: 180px; box-sizing: border-box; background:url('../img/common/ico_google.png') left 30px center no-repeat; border:1px solid #000; padding:15px 0px 15px 35px; display: inline-block; border-radius: 5px; margin-right:10px}
.btn_store .apple {text-align: center; width: 180px; box-sizing: border-box; background:url('../img/common/ico_apple.png') left 30px center no-repeat; border:1px solid #000; padding:15px 0px 15px 30px; display: inline-block; border-radius: 5px;}

/* 메인 - 프랜시스파커 */
.main_findew {padding:130px 0px 150px}
.main_findew .con_tit {padding: 0 !important;}
.main_findew .con_tit h3,.main_findew .con_tit .txt {text-align: left}
.main_findew ul {display: flex;margin-top:50px;flex-wrap: wrap}
.main_findew li {width:50%; background-color: #edf8ff; border-radius: 15px; padding:50px; box-sizing: border-box;flex: 1 1 40%; margin:0px 15px 30px}
.main_findew li:first-child,.main_findew li:nth-child(3) {margin-left:0 !important;}
.main_findew li:nth-child(2),.main_findew li:nth-child(4) {margin-right:0 !important}
.main_findew li:nth-child(2),.main_findew li:nth-child(3) {background:#f5f5f5}
.main_findew li .tit span {display: block; font-weight: 200;}
.main_findew li .tit {font-size:22px; font-weight: 500; line-height: 32px; margin:30px 0px 20px}

/* 서브 공통 */
#Accordion_wrap {border-top:1px solid #e5e5e5;border-left:1px solid #e5e5e5;border-right:1px solid #e5e5e5;}
#Accordion_wrap .que{position: relative; padding: 30px; cursor: pointer; background:#fff; border-bottom: 1px solid #e5e5e5; box-sizing: border-box;}
#Accordion_wrap .que .bullet {font-size:14px; padding:5px 10px; color:#fff; border-radius: 3px;font-weight: 200; display: inline-block; line-height: normal; margin-right:5px }
#Accordion_wrap .anw {display: none; overflow: hidden; background-color: #f9f9f9; padding:30px; border-bottom: 1px solid #e5e5e5; box-sizing: border-box;}  
#Accordion_wrap .arrow-wrap {position: absolute; top:50%; right: 30px; transform: translate(0, -50%);}
#Accordion_wrap .que .arrow-top {display: none; width:12px;}
#Accordion_wrap .que .arrow-bottom {display: block; width:12px;}
#Accordion_wrap .que .arrow-bottom {width:12px;}
#Accordion_wrap .que.on .arrow-bottom {display: none;}
#Accordion_wrap .que.on .arrow-top {display: block;}
.sub_wrap .area {padding:140px 0px 150px}
.sub_wrap .con_tit h3 {margin-bottom:20px; font-weight: 200;}
.sub_wrap .con_tit strong {font-weight: 500;}
.sub_wrap .con_tit .txt {font-size:18px; line-height: 28px; text-align: center;}
.sub_wrap.crm .qna .que .bullet {background-color: #ff7700;}
.sub_wrap.crm .que .arrow-top,.sub_wrap.crm .que .arrow-bottom {fill: #ff7700;}
.sub_wrap .banner .sub {font-size: 20px; color: #fff; font-weight: 500; padding-top:120px}
.sub_wrap .banner .tit {font-weight: 200; color: #fff; font-size: 40px; line-height: normal; margin-top: 30px;}
.sub_wrap .visual .txt .sub {font-size:22px; font-weight:500; margin-bottom:30px;}
.sub_wrap .visual .txt .tit {font-size:60px; line-height: 70px; font-weight:500; margin-bottom:30px;}
.sub_wrap .visual .txt span {font-size:18px; line-height: 28px; display: block; }
.sub_wrap .special {padding:150px 0px; width:1200px; margin:auto; }
.sub_wrap .special ul {flex-wrap: wrap; justify-content: space-between; display: flex;}
.sub_wrap .special ul li {flex: 1 1 30%; border-radius: 30px; padding:50px 0px; text-align: center; margin:15px}
.sub_wrap .special ul li .tit {font-size:22px; font-weight: 300; line-height: 30px; margin:15px 0px 15px;}
.sub_wrap .special li img {width:50px; mix-blend-mode: multiply;}
.sub_wrap .info .mySwiper2 .swiper-slide .txt .tit {font-size:30px; line-height:normal; margin-bottom:15px; position: relative;}
.sub_wrap .info .mySwiper2 .swiper-slide .txt dl {color:#666; font-size:14px; line-height:20px; margin-top:20px}
.sub_wrap .info .mySwiper2 .swiper-slide .txt dt {margin-bottom:5px;position: relative; padding-left:10px}
.sub_wrap .info .mySwiper2 .swiper-slide .txt dd {position: relative; padding-left:10px}
.sub_wrap .info .mySwiper2 .swiper-slide .txt dt::before {content: ''; width:2px; height:2px; background-color:#aaa; position:absolute; top:8px; left:0px;}

/* 서브 - CRM */
.sub_wrap.crm .visual {background:url('../img/sub/crm_bg.jpg') no-repeat; width:100%; height:800px; margin-top:-85px;background-size: cover;}
.sub_wrap.crm .visual .img {position: absolute; right: -110px; top: 130px;}
.sub_wrap.crm .visual .txt {margin-top:205px}
.sub_wrap.crm .special ul li {background-color: #fffcf9; border:1px solid #ffc999; box-sizing: border-box; }
.sub_wrap.crm .special ul li:nth-child(even) {background-color: #f9fdfd; border:1px solid #9adce1; box-sizing: border-box;}
.sub_wrap.crm .info {background-color: #f6f7f8; padding:130px 0px 150px}
.sub_wrap.crm .info .tab {cursor: pointer;}
.sub_wrap.crm .info .tab .swiper-slide {text-align:center; font-size:18px; box-sizing: border-box; border-radius: 300px; color:#000}
.sub_wrap.crm .info .tab i {    position: relative; width:100px; height:100px; display:block; background-color: #fff; border-radius: 300px; margin:0px 12px 20px auto;}
.sub_wrap.crm .info .tab i svg {width:50px; fill:#696a6c; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.sub_wrap.crm .info .tab .swiper-slide-thumb-active {color:#ff7700}
.sub_wrap.crm .info .tab .swiper-slide-thumb-active i {position: relative; width:100px; height:100px; display:block; background: -moz-linear-gradient(45deg,  #ff7700 0%, #f14e7b 100%); background: -webkit-linear-gradient(45deg,  #ff7700 0%,#f14e7b 100%); background: linear-gradient(45deg,  #ff7700 0%,#f14e7b 100%); border-radius: 300px; margin:0px 12px 20px auto;}
.sub_wrap.crm .info .tab .swiper-slide-thumb-active i svg {width:50px; fill:#ffffff;}
.sub_wrap.crm .info .mySwiper2 {margin-top:50px;}
.sub_wrap.crm .info .mySwiper2 .swiper-slide {box-sizing: border-box; display: flex; align-items: center;}
.sub_wrap.crm .info .mySwiper2 .swiper-slide .txt {margin-left:30px}
.sub_wrap.crm .info .comming {background-color:#696a6c; color:#fff; display: inline-block; font-size:12px; border-radius: 300px; line-height: normal; position: absolute; top:7px; padding:5px 10px; margin-left:10px}
.sub_wrap.crm .info .swiper-button-next, .swiper-rtl .swiper-button-prev {right:-70px; top:72%; background:url('../img/common/swiper-next.png')no-repeat; width:41px; height:33px;  }
.sub_wrap.crm .info .swiper-button-prev, .swiper-rtl .swiper-button-next {left:-70px; top:72%; background:url('../img/common/swiper-prev.png')no-repeat; width:41px; height:33px;}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {content: '' !important;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {content: '' !important;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {background:url('../img/common/swiper-prev.png')no-repeat; opacity: 0.3 !important;}
.sub_wrap.crm .guide ul {display: flex;}
.sub_wrap.crm .guide ul li {width:263px; border:1px solid #e5e5e5; border-radius: 15px; box-sizing: border-box; text-align: center; padding:60px 15px; position: relative; margin-right:50px}
.sub_wrap.crm .guide ul li:last-child {margin-right:0;}
.sub_wrap.crm .guide ul li img {width:50px; mix-blend-mode: multiply;}
.sub_wrap.crm .guide ul li::after {content: ''; background:url('../img/common/swiper-next.png') no-repeat; background-size:25px; width:25px; height:19px; position: absolute; right:-39px;top: 50%; transform: translate(0%, -50%);}
.sub_wrap.crm .guide ul li:last-child:after {content: ''; background:none}
.sub_wrap.crm .guide ul li .tit {font-size:22px; margin:20px 0px 15px}
.sub_wrap.crm .guide .inquiry {display: flex; justify-content: center; margin-top:60px}
.sub_wrap.crm .guide .inquiry dt,.sub_wrap.crm .guide .inquiry dd {display: inline-block;}
.sub_wrap.crm .guide .inquiry dt {font-weight: 600;}
.sub_wrap.crm .guide .inquiry .call { background:url('../img/common/ico_call.png') 40px center no-repeat; padding:15px 40px 15px 70px ; border-radius: 300px; border:1px solid #ff7700; color:#ff7700}
.sub_wrap.crm .guide .inquiry .mail { background:url('../img/common/ico_mail.png') 40px center no-repeat; padding:15px 40px 15px 70px ; border-radius: 300px; border:1px solid #f14e7b; color:#f14e7b}
.sub_wrap.crm .qna {background:#fff;}
.sub_wrap.crm .banner {background:url('../img/sub/crm_banner_img01.jpg') no-repeat; width:100%; height:492px; background-size: cover; text-align: center;}
.sub_wrap.crm .banner .btn05:hover {color:#ff7700;}

/* 서브 - 프랜시스파커 */
.sub_wrap.joa .visual {background:url('../img/sub/joa_bg.jpg') no-repeat; width:100%; height:800px; margin-top:-85px;background-size: cover;}
.sub_wrap.joa .visual .img {position: absolute; right: -90px; top: 110px;}
.sub_wrap.joa .visual .txt {margin-top:205px}
.sub_wrap.joa .special ul li {background-color: #fffdf9; border:1px solid #ffce99; box-sizing: border-box; }
.sub_wrap.joa .special ul li:nth-child(even) {background-color: #f9fdfd; border:1px solid #9adce1; box-sizing: border-box;}
.sub_wrap.joa .tabnav {display:flex; justify-content: center; margin-bottom:50px; flex-wrap: wrap;}
.sub_wrap.joa .tabnav li{flex: 1 1 40%;}
.sub_wrap.joa .tabnav li a{text-align:center; font-size:24px; font-weight:600; display:inline-block; box-sizing: border-box; background-color: #f5f6f7; border:1px solid #e5e5e5; border-radius: 20px; width:100%; padding: 40px 0px 0px;}
.sub_wrap.joa .tabnav li a.active{background:#fff7eb; border:3px solid #fdcc7f; color:#ff9c00}
.sub_wrap.joa .tabnav li:first-child img {margin-left:-94px}
.sub_wrap.joa .info {background:url('../img/sub/joa_info_bg.png') no-repeat;width: 100%; background-size: cover; margin-bottom:150px; margin-top:150px}
.sub_wrap.joa .info .tabcontent {background:#fff; width:1200px; box-sizing: border-box; border:1px solid #e5e5e5; border-radius: 15px; padding:50px; display: block;}
.sub_wrap.joa .info .tabcontent .tit {font-size:30px;}
.sub_wrap.joa .info .tabcontent .tit p {font-size:16px; color:#666; margin-top:15px}
.sub_wrap.joa .info .tabcontent .tab {cursor: pointer; margin:30px 0px}
.sub_wrap.joa .info .tabcontent .tab .swiper-slide {text-align:center; padding:7px 0px; box-sizing: border-box; border-radius: 300px; background-color: #fff;border:1px solid #e5e5e5; color:#000 }
.sub_wrap.joa .info .tabcontent .tab .swiper-slide-thumb-active {border:1px solid #ff9d00; color:#ff9d00}
.sub_wrap.joa .info .mySwiper2  {background:#f8f9fa; border-radius: 15px; padding:50px 0px}
.sub_wrap.joa .info .mySwiper2 .swiper-slide {box-sizing: border-box; display: flex; align-items: center; justify-content: center;}
.sub_wrap.joa .info .mySwiper2 .swiper-slide img {margin-left:50px; margin-right: 50px;}
.sub_wrap.joa .info .mySwiper2 .swiper-slide .txt {margin-right:50px}
.sub_wrap.joa .info .comming {background-color:#696a6c; color:#fff; display: inline-block; font-size:12px; border-radius: 300px; line-height: normal; position: absolute; top:7px; padding:5px 10px; margin-left:10px}
.sub_wrap.joa .info .download::after{background:url('../img/sub/joa_img00.png') no-repeat; content: ''; width: 260px; height: 217px; position: absolute; right: 45px; bottom: 0px; z-index: 1;}
.sub_wrap.joa .info .download {margin-top:50px; font-size:30px; color:#02a8b4; padding:80px 50px; border:1px solid #b3e5e8; background-color: #f7fcfd; border-radius: 15px; display: flex; justify-content: space-between; align-items: center;}
.sub_wrap.joa .info .download span {display: block; margin-top:20px}
.sub_wrap.joa .info .download .btn_store {font-size:16px; position: relative; z-index: 10;}
.sub_wrap.joa .qna {background:#fef9f3;}
.sub_wrap.joa .qna .que .bullet {background-color: #ff9c00;}
.sub_wrap.joa .que .arrow-top,.sub_wrap.joa .que .arrow-bottom {fill: #ff9c00;}
.sub_wrap.joa .banner {background:url('../img/sub/joa_banner_img01.jpg') no-repeat; width:100%; height:492px; background-size: cover; text-align: center;}
.sub_wrap.joa .banner .btn05:hover {color:#ff9c00;}

/* 서브 - 프랜시스파커 */
.sub_wrap.findew .visual {background:url('../img/sub/findew_bg.jpg') no-repeat; width:100%; height:800px; margin-top:-85px;background-size: cover;}
.sub_wrap.findew .visual .img {position: absolute; right: -170px; top: 140px;}
.sub_wrap.findew .visual .txt {margin-top:205px}
.sub_wrap.findew .visual .btn_store {justify-content: flex-start;}
.sub_wrap.findew .tab {width: 848px; cursor: pointer;}
.sub_wrap.findew .tab .swiper-slide {text-align: left; font-size: 18px; padding: 18px 20px 18px 60px; box-sizing: border-box; border-radius: 300px; background-color: #fff; border: 1px solid #1ab1ff; width: auto !important; color: #1ab1ff;}
.sub_wrap.findew .tab .swiper-slide i {background: #1ab1ff; width: 40px; height: 40px; border-radius: 300px; position: absolute; top: 10px; left:10px;}
.sub_wrap.findew .tab .swiper-slide i svg {width:20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); fill: #fff;}
.sub_wrap.findew .tab .swiper-slide-thumb-active {background-color: #1ab1ff; color:#fff;}
.sub_wrap.findew .tab .swiper-slide-thumb-active i {background: #fff; width: 40px; height: 40px; border-radius: 300px; position: absolute; top: 10px; left:10px;}
.sub_wrap.findew .tab .swiper-slide-thumb-active i svg {width:20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); fill: #1ab1ff;}
.sub_wrap.findew .info.area {padding-bottom:80px !important}
.sub_wrap.findew .mySwiper2 {margin-top:50px;}
.sub_wrap.findew .mySwiper2 .swiper-slide {background:#f7f8fa; width:1200px; box-sizing: border-box; border:1px solid #e5e5e5; border-radius: 30px; padding:50px; display: flex;align-items: center; justify-content: center;}
.sub_wrap.findew .mySwiper2 .txt {margin-left:50px}
.sub_wrap.findew .mySwiper2 .txt span {color:#1ab1ff; font-size:18px; font-weight: 500; display: inline-block; margin-bottom:15px }
.sub_wrap.findew .mySwiper2 .txt .tit {font-size:32px; line-height: normal; margin-bottom: 25px !important;}
.sub_wrap.findew .download {background:url('../img/sub/findew_img06.png') center no-repeat; width:100%; height:394px; color:#fff; box-sizing: border-box; margin-bottom:150px}
.sub_wrap.findew .download .txt {padding:155px 0px 0px 100px}
.sub_wrap.findew .download .tit {font-size:35px; margin-bottom:20px; font-weight: 200;}
.sub_wrap.findew .download .btn_store {justify-content:flex-start}
.sub_wrap.findew .download .btn_store .google {background:url('../img/common/ico_google.png') left 30px center no-repeat #ffffff; border:#fff;}
.sub_wrap.findew .download .btn_store .apple {background:url('../img/common/ico_apple.png') left 30px center no-repeat #ffffff; border:none;}
.sub_wrap.findew .qna {background:#f3fbff;}
.sub_wrap.findew .qna .bullet {background-color: #1ab1ff;}
.sub_wrap.findew .banner {background:url('../img/sub/findew_banner_img01.jpg') center no-repeat; width:100%; height:650px; color:#fff; display: flex; align-items: center; overflow: hidden;background-size: cover;}
.sub_wrap.findew .banner .tit {font-size:50px; line-height: normal; font-weight: 200;}
.sub_wrap.findew .banner .txt {font-size:18px; line-height: 26px; margin-top:30px}
.sub_wrap.findew .banner a:hover {color:#1ab1ff}
.sub_wrap.findew .banner .simply-scroll-container {position: relative;}
.sub_wrap.findew .banner .simply-scroll-clip {position: relative; overflow: hidden;}
.sub_wrap.findew .banner .txt_wrap {float:left; margin-top:145px;}
.sub_wrap.findew .banner .vert {width: 560px; height: 650px; float:right;}
.sub_wrap.findew .banner .vert .simply-scroll-clip {width: 560px; height: 650px;}
.sub_wrap.findew .banner .vert .simply-scroll-list li {width: calc(270px - 20px); height: 170px; background:#fff; border-radius: 15px;color:#000; display:flex; justify-content: center; align-items: center; font-size:22px; font-weight: 600; float:left;}
.sub_wrap.findew .banner .vert .simply-scroll-list li:nth-child(even) {margin-top:20px; margin-left:20px;}

/* 서브 - 신청문의 */
.sub_wrap.inquiry .visual {background:url('../img/sub/inquiry_bg.jpg') no-repeat; width:100%; height:800px; margin-top:-85px;background-size: cover;}
.sub_wrap.inquiry .visual .img {position: absolute; right: -100px; top: 170px;}
.sub_wrap.inquiry .visual .txt {margin-top:205px}
.sub_wrap.inquiry .form .con_tit img {width:50px}
.sub_wrap.inquiry .form_table {border-top:2px solid #000;}
.sub_wrap.inquiry .form_table .w50 {float:left;}

/* 입력폼 */
.form_table .radio_type {display: flex;}
.form_table .radio_type li {margin-right:30px}
.form_table dl {display: table; width: 100%; border-bottom: 1px solid #e5e5e5;}
.form_table dl dt {display: table-cell; width: 180px; vertical-align: middle; padding: 28px 15px; box-sizing: border-box; }
.form_table dl dd {display: table-cell; width: calc(100% - 180px); vertical-align: middle; padding: 15px 20px 15px 0px; box-sizing: border-box; }
.form_table dd .textarea {width: 100%; height: 250px; background-color:#fcfcfc; border: 1px solid #e5e5e5; box-sizing: border-box; border-radius: 3px; padding: 10px 15px;}
.form .privacy {border-bottom:1px solid #000; padding:30px 15px 30px}
.form .privacy_agree {color:#666; margin-bottom:15px}
.form .btn_confirm {background-color:#ff9c00; min-width:200px; display:inline-block; font-size:18px; color:#fff; padding:20px 60px; border-radius: 5px; border:none; cursor: pointer; transition: all 0.3s;}
.form .btn_confirm:hover {background-color:#ff7700;}

/* 로그인 & 회원가입 */
.wrap.member {width: 100%; height: 100%; text-align: center; background-color:#f0f1f3; overflow: unset !important;}
.wrap.member:before {display: inline-block; height: 100%; vertical-align: middle; content: '';}
.wrap.member .btn_home {border:1px solid #ccc; border-radius: 300px; padding:2px 12px; font-size:14px; position: absolute; top: 20px; right: 20px;}
.wrap.member .btn_home::after {clear: both;}
.wrap.member .box {width:550px; background-color:#fff; border-radius: 20px; padding:50px; box-sizing: border-box; box-shadow: 0px 25px 45px 0px rgba(63, 77, 105, 0.1); z-index: 10; display: inline-block; text-align: left; vertical-align: middle; position: relative;}
.wrap.member .boxsignup {width:650px !important; }
.wrap.member .box h1 {text-align: center; margin-bottom:45px; font-size:32px; line-height: normal; }
.wrap.member .box h1 span {font-size:16px; font-weight: 300; display: block; margin-top:10px}
.wrap.member .box .column {display:flex; flex-wrap: wrap;}
.wrap.member .box .column .group {display:flex; width:100%; margin-bottom:10px}
.wrap.member .box .column .inputbtn {flex-shrink: 0; width:120px; background-color: #4785f6; border:1px solid #1977f3; color:#fff; border-radius: 3px; margin-left: 10px;}
.wrap.member .box .column .disabled {background-color:#bec6d4; border:1px solid #adb5c2; }
.wrap.member .box .column .input {flex-grow: 1;}
.wrap.member .result {background-color:#f8f8f8; border:1px solid #e5e5e5; box-sizing: border-box; border-radius: 5px; padding:30px; text-align: center;}
.wrap.member .box .info {font-size:14px; color:#1ab1ff; display: block; margin-top:-5px}
.wrap.member .box .time {color:#ee2f3c; position: absolute; right: 12px; top: 13px; font-size: 14px;}
.wrap.member .btn {background-color: #00341E; width:100%; color:#fff; padding:18px 0px; cursor: pointer; border-radius: 3px; border:1px solid #000000; margin-top:20px; transition: all 0.3s;}
.wrap.member .btn:hover {background-color:#042215;}
.wrap.member .btn_francis {background-color: #ff9c00; width:100%; color:#fff; padding:18px 0px; cursor: pointer; border-radius: 3px; border:1px solid #ff9c00; margin-top:20px; transition: all 0.3s;font-weight: 400;}
.wrap.member .btn_francis:hover {background-color:#ff7700;}
.wrap.member footer {background:none; padding: 0 !important; position: fixed; bottom:20px; width:100%; text-align: center; font-size:12px; color:#aaa; z-index: 1;}
.wrap.member .link {display: flex;justify-content: center; margin:25px 0px 30px}
.wrap.member .link a {color:#666}
.wrap.member .link li + li a:before {margin: 5px 10px 0px 10px; height: 12px; width: 1px; background: #ddd; display: inline-block; content: ""; vertical-align: top;}
.wrap.member .sns {margin-top:20px; border-top:1px solid #eee; padding-top:30px; }
.wrap.member .sns ul {display: flex;flex-wrap: wrap; justify-content: center;}
.wrap.member .sns li {flex: 1 1 30%; margin-right:10px;}
.wrap.member .sns li:last-child {margin-right:0}
.wrap.member .sns .btn_naver {padding:18px; display: block;background:url('../img/common/ico_sns_naver.png') 35px center no-repeat; background-color:#00c300; color:#fff; padding-left:65px; border-radius: 3px;}
.wrap.member .sns .btn_kakao {padding:18px; display: block;background:url('../img/common/ico_sns_kakao.png') 35px center no-repeat; background-color:#fae300; color:#391b1b; padding-left:67px; border-radius: 3px; }
.wrap.member .sns .btn_fb {padding:18px; display: block;background:url('../img/common/ico_sns_fb.png') 27px center no-repeat; background-color:#1977f3; color:#fff; padding-left:60px; border-radius: 3px; }
.wrap.member .sns .btn_email {padding:18px; display: block;background:url('../img/common/ico_mail.png') 35px center no-repeat; background-color:#ffffff; color:#000; padding-left:60px; border-radius: 3px; border:1px solid #d6d6d6;}
.wrap.member .join .sns {width:100%;  border-top:none; margin-top:0 !important; padding:0 !important; display: flex; flex-direction: column; gap:10px}

.wrap.member .join .btn_naver {padding:18px; display: block;background:url('../img/common/ico_sns_naver.png') 25px center no-repeat; background-color:#00c300; color:#fff; padding-left:60px; border-radius: 3px;}
.wrap.member .join .btn_kakao {padding:18px; display: block;background:url('../img/common/ico_sns_kakao.png') 25px center no-repeat; background-color:#fae300; color:#391b1b; padding-left:60px; border-radius: 3px; }
.wrap.member .join .btn_fb {padding:18px; display: block;background:url('../img/common/ico_sns_fb.png') 25px center no-repeat; background-color:#1977f3; color:#fff; padding-left:60px; border-radius: 3px; }
.wrap.member .join .btn_email {padding:18px; display: block;background:url('../img/common/ico_mail.png') 25px center no-repeat; background-color:#ffffff; color:#000; padding-left:60px; border:1px solid #d6d6d6; border-radius: 3px; }
.wrap.member .join .link {margin:25px 0px 0px !important}

.wrap.member .signup h1 {margin-bottom:0px}
.wrap.member .signup ul {width:100%}
.wrap.member .signup ul li {margin-right:0 !important; margin-bottom:10px}
.wrap.member .signup .sns {border-top:none}
.wrap.member .signup .link {margin: 25px 0px 0px;}

.wrap.member .progress ul {display: flex; justify-content: center; align-items: center; margin-bottom:15px}
.wrap.member .progress li.active {background-color: #313743; width: 40px; height: 40px; border-radius: 300px; text-align: center; line-height: 40px; font-weight: 600; color: #fff; text-indent: 0;}
.wrap.member .progress li {width: 15px; height: 15px; background-color: #d5d6d9; border-radius: 300px; text-indent: -300em; margin-right:10px}
.wrap.member .progress li:last-child {margin-right:0;}
.wrap.member .search h1 {border-bottom:1px solid #e5e5e5; padding-bottom:30px; margin-bottom:30px}
.wrap.member .search .list ul {border:1px solid #e5e5e5; height: 353px; overflow-y: scroll;}
.wrap.member .search .list ul::-webkit-scrollbar {width:5px; background-color:#f0f0f0;}
.wrap.member .search .list ul::-webkit-scrollbar-thumb {background-color:#ddd}
.wrap.member .search .list ul::-webkit-scrollbar-track {background-color:#f0f0f0;}
.wrap.member .search .list li {border-bottom:1px solid #e5e5e5; box-sizing: border-box; padding:20px; display: flex; align-items: center; justify-content: space-between;}
.wrap.member .search .list li:last-child {border-bottom:none !important}
.wrap.member .search .list li .name {font-size:18px; font-weight:500; margin-bottom:5px}
.wrap.member .search .list li .txt {width:84%}
.wrap.member .search .listbtn {background-color: #4785f6; border: 1px solid #1977f3; color: #fff; border-radius: 300px; padding: 2px 0px; font-size: 14px; width: 50px; height: 30px; box-sizing: border-box;}
.wrap.member .infotxt {background: url('../img/common/ico_info.png') top center no-repeat; text-align: center; padding-top:60px}
.wrap.member .infolist {background-color:#f8f8f8; border:1px solid #e5e5e5; box-sizing: border-box; border-radius: 5px; padding:20px; color:#666; font-size:14px; line-height: 20px; margin-bottom:10px}
.wrap.member .infolist li {position: relative; padding-left:7px; margin-bottom:5px}
.wrap.member .infolist li:last-child {margin-bottom:0px}
.wrap.member .infolist li::before {content: ''; width:2px; height:2px; position: absolute; top:8px; left:0px; background-color:#aaa; }
.wrap.member .agreement ul {border: 1px solid #e5e5e5; border-radius: 5px; box-sizing: border-box;}
.wrap.member .agreement li {border-bottom: 1px solid #e5e5e5; padding: 20px;}
.wrap.member .agreement li:last-child {border-bottom:none;}
.wrap.member .agreement .gray {display: inline-block; font-size:14px; line-height: 20px; margin-left:31px; margin-top:5px; color:#999999 !important}
.wrap.member .agreement li .viewbtn {display: inline-block; font-size: 14px; color: #666; text-decoration: underline;}


/*개인정보수정 */
.sub_wrap.modify {width:500px; margin:auto; padding:80px 0px;}
.sub_wrap.modify h2 {font-size:40px; text-align: center; line-height:normal; margin-bottom:50px}
.sub_wrap.modify dl {margin-bottom:20px}
.sub_wrap.modify dt {margin-bottom:5px}
.sub_wrap.modify dd {display:flex; gap:10px; width:100%;}
.sub_wrap.modify .inputbtn {flex-shrink: 0; width:120px; background-color: #4785f6; border:1px solid #1977f3; color:#fff; border-radius: 3px;}
.sub_wrap.modify .disabled {background-color:#bec6d4; border:1px solid #adb5c2; }
.sub_wrap.modify .input {flex-grow: 1;}
.sub_wrap.modify .time {color:#ee2f3c; position: absolute; right: 12px; top: 13px; font-size: 14px;}
.sub_wrap.modify .ico_naver {position: absolute; right: 12px; top: 10px; background: url(../img/common/ico_sns_naver.png) center no-repeat #00c300; width: 30px; height: 30px; background-size: 12px; border-radius: 3px;}
.sub_wrap.modify .ico_kakao {position: absolute; right: 12px; top: 10px; background: url(../img/common/ico_sns_kakao.png) center no-repeat #fae300; width: 30px; height: 30px; background-size: 16px; border-radius: 3px;}
.sub_wrap.modify .ico_fb {position: absolute; right: 12px; top: 10px; background: url(../img/common/ico_sns_fb.png) center no-repeat #1977f3; width: 30px; height: 30px; background-size: 17px; border-radius: 3px;}
.sub_wrap.modify .info {font-size:14px; color:#1ab1ff; display: block; margin-top:5px}
.sub_wrap.modify .btn {background-color: #1ab1ff; width:100%; color:#fff; padding:18px 0px; cursor: pointer; border-radius: 3px; border:1px solid #329afd; margin-top:0px; transition: all 0.3s;}
.sub_wrap.modify .btn:hover {background-color:#277dff;}
.withdrawal {display: block; font-size: 14px; color: #aaa; text-decoration: underline; text-align: right; margin-top: 10px;}

/* 약관 */
.sub_wrap.term {width:1200px; margin:auto; padding:80px 0px;}
.sub_wrap.term h2 {font-size:40px; text-align: center; line-height:normal; margin-bottom:50px}
.sub_wrap.term pre {color: #000; font-family: 'SUIT', 'Malgun Gothic', '돋움', dotum, arial, sans-serif; font-size: 16px; line-height: 24px; font-weight: 300; white-space: pre-wrap; word-break: keep-all;}

/* popup */
.popup {display:none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: none; padding: 50px; z-index: 999;}
.popup .close {width: 50px; height: 50px; text-indent: -999em; position: absolute; right: 0px; background: #000; border: none; cursor: pointer; display: inline-block; top: 0px; z-index: 10;} 
.popup .close:before, .close:after {position: absolute; top: 10px; left: 27px; content: ''; height: 30px; width: 2px; background-color: #fff;}
.popup .close:before {transform: rotate(45deg);} 
.popup .close:after {transform: rotate(-45deg);}
.popup-wrap{width: 100%; max-width: 1000px; background-color: #ffffff; overflow: hidden; box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 30%); position: relative; left:50%; top:50%; transform: translate(-50%, -50%); padding:50px 0px; z-index: 1000; overflow-y: auto; max-height: 90%;}
.popup-wrap .popup-body{width: calc(100% - 100px); background-color: #ffffff; overflow-y: auto; height: 100%; position: relative; padding: 0px 50px;}
.popup-wrap .popup-body .body-contentbox{word-break:break-word; position: relative;}
.popup-wrap::-webkit-scrollbar {width: 5px;} 
.popup-wrap::-webkit-scrollbar-track { background-color: #f0f0f0; border-radius: 100px;}
.popup-wrap::-webkit-scrollbar-thumb { background-color: #cccccc; border-radius: 100px;} 
.popup-wrap .info {text-align: center; padding: 20px; background: #f5f5f5; border-bottom: 1px solid #ddd;}
.popup-wrap .body-contentbox img {position:relative; z-index: 100;}
.popup-wrap .name {font-size:32px; font-weight:800; position: absolute; left: 350px; top: 120px;}
.popup-wrap .history {background: #f5f5f5; padding: 40px 0px 40px 190px; width: calc(690px - 135px); z-index: 10; margin-top:190px; margin-left:-150px}
.popup-wrap li {position: relative; padding-left:10px; margin-bottom:5px}
.popup-wrap li::before {content: ''; width:2px; height:2px; background:#000; position: absolute; top:10px; left:0px}
.popup-wrap .popup-body .body-title {font-size:28px; line-height: normal; margin-bottom:15px;}
.popup .dim {z-index: 999; width: 100%; height: 100%; position: fixed; opacity: 0.5; top:0; left:0; background-color: black;}