@charset "utf-8"; /* 임시작업 (tteum 230328) #rumipopup_sub_port{display: block !important;} */ /* ---------------------------------------- Setting (html) ---------------------------------------- */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap'); @import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css'); html{overflow-x:hidden;} body{margin: 0;color:#000;letter-spacing:-0.05em;font-family:'Noto Sans KR', sans-serif;word-break:keep-all;} /* ---------------------------------------- Setting (Dnew) ---------------------------------------- */ .mobile{display:none;} /* 여백부여 */ .mt-1{margin-top:10px;}.mt-2{margin-top:20px;}.mt-3{margin-top:30px;}.mt-4{margin-top:40px;}.mt-5{margin-top:50px;}.mt-6{margin-top:60px;}.mt-7{margin-top:70px;}.mt-8{margin-top:80px;}.mt-9{margin-top:90px;}.mt-10{margin-top:100px;}.mt-11{margin-top:110px;}.mt-12{margin-top:120px;}.mt-13{margin-top:130px;}.mt-14{margin-top:140px;}.mt-15{margin-top:150px;}.mt-20{margin-top:200px;} .mb-1{margin-bottom:10px;}.mb-2{margin-bottom:20px;}.mb-3{margin-bottom:30px;}.mb-4{margin-bottom:40px;}.mb-5{margin-bottom:50px;}.mb-6{margin-bottom:60px;}.mb-7{margin-bottom:70px;}.mb-8{margin-bottom:80px;}.mb-9{margin-bottom:90px;}.mb-10{margin-bottom:100px;}.mb-11{margin-bottom:110px;}.mb-12{margin-bottom:120px;}.mb-13{margin-bottom:130px;}.mb-14{margin-bottom:140px;}.mb-15{margin-bottom:150px;}.mb-20{margin-bottom:200px;} .pt-1{padding-top:10px;}.pt-2{padding-top:20px;}.pt-3{padding-top:30px;}.pt-4{padding-top:40px;}.pt-5{padding-top:50px;}.pt-6{padding-top:60px;}.pt-7{padding-top:70px;}.pt-8{padding-top:80px;}.pt-9{padding-top:90px;}.pt-10{padding-top:100px;}.pt-11{padding-top:110px;}.pt-12{padding-top:120px;}.pt-13{padding-top:130px;}.pt-14{padding-top:140px;}.pt-15{padding-top:150px;}.pt-20{padding-top:200px;} .pb-1{padding-bottom:10px;}.pb-2{padding-bottom:20px;}.pb-3{padding-bottom:30px;}.pb-4{padding-bottom:40px;}.pb-5{padding-bottom:50px;}.pb-6{padding-bottom:60px;}.pb-7{padding-bottom:70px;}.pb-8{padding-bottom:80px;}.pb-9{padding-bottom:90px;}.pb-10{padding-bottom:100px;}.pb-10{padding-bottom:100px;}.pb-11{padding-bottom:110px;}.pb-12{padding-bottom:120px;}.pb-13{padding-bottom:130px;}.pb-14{padding-bottom:140px;}.pb-15{padding-bottom:150px;}.pb-20{padding-bottom:200px;} .padding-1{padding:10px;}.padding-2{padding:20px;}.padding-3{padding:30px;}.padding-4{padding:40px;}.padding-5{padding:50px;} .margin-1{padding:10px;}.margin-2{margin:20px;}.margin-3{margin:30px;}.margin-4{margin:40px;}.margin-5{margin:50px;} .box-1{padding:10px;border:1px solid #ebeceb;}.box-2{padding:20px;border:1px solid #ebeceb}.box-3{padding:30px;border:1px solid #ebeceb}.box-4{padding:40px;border:1px solid #ebeceb}.box-5{padding:50px;border:1px solid #ebeceb} .border-1{border:1px solid #ebeceb;}.border-2{border:2px solid #ebeceb;}.border-3{border:3px solid #ebeceb;}.border-4{border:4px solid #ebeceb;}.border-5{border:5px solid #ebeceb;}.border-6{border:6px solid #ebeceb;}.border-7{border:7px solid #ebeceb;}.border-8{border:8px solid #ebeceb;}.border-9{border:9px solid #ebeceb;}.border-10{border:10px solid #ebeceb;} /* 마우스오버 */ .over-zoom{overflow:hidden;} .over-zoom img { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); -webkit-transition:.3s; -moz-transition:.3s; -ms-transition:.3s; -o-transition:.3s; transition:.3s; } .over-zoom:hover img { -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); -o-transform:scale(1.2); transform:scale(1.2); } .over-dark {background:#000;} .over-dark img{opacity:1;transition:all 0.5s} .over-dark:hover img{opacity:0.9;transition:all 0.5s} .over-light {background:#fff;} .over-light img{opacity:1;transition:all 0.5s} .over-light:hover img{opacity:0.9;transition:all 0.5s} .over-gray img{-webkit-filter:gray(100%);filter:gray;transition:all 0.5s} .over-gray:hover img{-webkit-filter:grayscale(100%);filter:none;transition:all 0.5s} .over-blur img{-webkit-filter:blur(3px);filter:blur(3px);transition:all 0.5s} .over-blur:hover img{-webkit-filter:none;filter:none;transition:all 0.5s} .over-color img{-webkit-filter:none;filter:none;transition:all 0.5s} .over-color:hover img{-webkit-filter:saturate(3);filter:saturate(3);transition:all 0.5s} /* 기타 */ .ee{display:block;height:1px;} .thumb img::before{display:block;text-align:center;line-height:100px;content:'이미지 준비중';opacity:.3;font-size:2em;} /* ---------------------------------------- Setting (Bootstrap) ---------------------------------------- */ .lead{font-size:21px} .dl-horizontal dt{overflow:hidden;float:left;clear:left;width:160px;text-align:right;white-space:nowrap;text-overflow:ellipsis}.dl-horizontal dd{margin-left:180px} .container{max-width:1200px;width:95%;} @media screen and (max-width:767px){.table-responsive{width:100%;border:1px solid #ddd;margin-bottom:15px;overflow-y:hidden;-ms-overflow-style:-ms-autohiding-scrollbar}.table-responsive>.table{margin-bottom:0}.table-responsive>.table>tbody>tr>td,.table-responsive>.table>tbody>tr>th,.table-responsive>.table>tfoot>tr>td,.table-responsive>.table>tfoot>tr>th,.table-responsive>.table>thead>tr>td,.table-responsive>.table>thead>tr>th{white-space:nowrap}.table-responsive>.table-bordered{border:0}.table-responsive>.table-bordered>tbody>tr>td:first-child,.table-responsive>.table-bordered>tbody>tr>th:first-child,.table-responsive>.table-bordered>tfoot>tr>td:first-child,.table-responsive>.table-bordered>tfoot>tr>th:first-child,.table-responsive>.table-bordered>thead>tr>td:first-child,.table-responsive>.table-bordered>thead>tr>th:first-child{border-left:0}.table-responsive>.table-bordered>tbody>tr>td:last-child,.table-responsive>.table-bordered>tbody>tr>th:last-child,.table-responsive>.table-bordered>tfoot>tr>td:last-child,.table-responsive>.table-bordered>tfoot>tr>th:last-child,.table-responsive>.table-bordered>thead>tr>td:last-child,.table-responsive>.table-bordered>thead>tr>th:last-child{border-right:0}.table-responsive>.table-bordered>tbody>tr:last-child>td,.table-responsive>.table-bordered>tbody>tr:last-child>th,.table-responsive>.table-bordered>tfoot>tr:last-child>td,.table-responsive>.table-bordered>tfoot>tr:last-child>th{border-bottom:0}} @media screen and (-webkit-min-device-pixel-ratio:0){input[type=date],input[type=time],input[type=datetime-local],input[type=month]{line-height:34px}.input-group-sm input[type=date],.input-group-sm input[type=time],.input-group-sm input[type=datetime-local],.input-group-sm input[type=month],input[type=date].input-sm,input[type=time].input-sm,input[type=datetime-local].input-sm,input[type=month].input-sm{line-height:30px}.input-group-lg input[type=date],.input-group-lg input[type=time],.input-group-lg input[type=datetime-local],.input-group-lg input[type=month],input[type=date].input-lg,input[type=time].input-lg,input[type=datetime-local].input-lg,input[type=month].input-lg{line-height:46px}} .form-inline .form-group{display:inline-block;vertical-align:middle;margin-bottom:0}.form-inline .form-control{display:inline-block;width:auto;vertical-align:middle}.form-inline .form-control-static{display:inline-block}.form-inline .input-group{display:inline-table;vertical-align:middle}.form-inline .input-group .form-control,.form-inline .input-group .input-group-addon,.form-inline .input-group .input-group-btn{width:auto}.form-inline .input-group>.form-control{width:100%}.form-inline .control-label{vertical-align:middle;margin-bottom:0}.form-inline .checkbox,.form-inline .radio{display:inline-block;vertical-align:middle;margin-top:0;margin-bottom:0}.form-inline .checkbox label,.form-inline .radio label{padding-left:0}.form-inline .checkbox input[type=checkbox],.form-inline .radio input[type=radio]{position:relative;margin-left:0}.form-inline .has-feedback .form-control-feedback{top:0} .form-horizontal .control-label{text-align:right;padding-top:7px;margin-bottom:0} .form-horizontal .form-group-lg .control-label{padding-top:14.33px} .form-horizontal .form-group-sm .control-label{padding-top:6px} .navbar-right .dropdown-menu{right:0;left:auto}.navbar-right .dropdown-menu-left{right:auto;left:0} .nav-tabs.nav-justified>li{display:table-cell;width:1%}.nav-tabs.nav-justified>li>a{margin-bottom:0} .nav-tabs.nav-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus,.nav-tabs.nav-justified>.active>a:hover{border-bottom-color:#fff} .nav-justified>li{display:table-cell;width:1%}.nav-justified>li>a{margin-bottom:0} .nav-tabs-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:focus,.nav-tabs-justified>.active>a:hover{border-bottom-color:#fff} .navbar{border-radius:4px} .navbar-header{float:left} .navbar-collapse{width:auto;border-top:0;-webkit-box-shadow:none;box-shadow:none}.navbar-collapse.collapse{display:block!important;visibility:visible!important;overflow:visible!important;height:auto!important;padding-bottom:0}.navbar-collapse.in{overflow-y:visible}.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse{padding-right:0;padding-left:0} .container-fluid>.navbar-collapse,.container-fluid>.navbar-header,.container>.navbar-collapse,.container>.navbar-header{margin-right:0;margin-left:0} .navbar-static-top{border-radius:0} .navbar-fixed-bottom,.navbar-fixed-top{border-radius:0} .navbar>.container .navbar-brand,.navbar>.container-fluid .navbar-brand{margin-left:-15px} .navbar-toggle{display:none} .navbar-nav{float:left;margin:0}.navbar-nav>li{float:left}.navbar-nav>li>a{padding-top:15px;padding-bottom:15px} .navbar-form .form-group{display:inline-block;vertical-align:middle;margin-bottom:0}.navbar-form .form-control{display:inline-block;width:auto;vertical-align:middle}.navbar-form .form-control-static{display:inline-block}.navbar-form .input-group{display:inline-table;vertical-align:middle}.navbar-form .input-group .form-control,.navbar-form .input-group .input-group-addon,.navbar-form .input-group .input-group-btn{width:auto}.navbar-form .input-group>.form-control{width:100%}.navbar-form .control-label{vertical-align:middle;margin-bottom:0}.navbar-form .checkbox,.navbar-form .radio{display:inline-block;vertical-align:middle;margin-top:0;margin-bottom:0}.navbar-form .checkbox label,.navbar-form .radio label{padding-left:0}.navbar-form .checkbox input[type=checkbox],.navbar-form .radio input[type=radio]{position:relative;margin-left:0}.navbar-form .has-feedback .form-control-feedback{top:0} .navbar-form{width:auto;border:0;padding-top:0;padding-bottom:0;margin-right:0;margin-left:0;-webkit-box-shadow:none;box-shadow:none} .navbar-text{float:left;margin-right:15px;margin-left:15px} .navbar-left{float:left!important}.navbar-right{float:right!important;margin-right:-15px}.navbar-right~.navbar-right{margin-right:0} @media screen and (min-width:768px){.jumbotron{padding:48px 0}.container .jumbotron,.container-fluid .jumbotron{padding-right:60px;padding-left:60px}.jumbotron .h1,.jumbotron h1{font-size:63px}} .modal-dialog{width:600px;margin:30px auto}.modal-content{-webkit-box-shadow:0 5px 15px rgba(0,0,0,.5);box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal-sm{width:300px} @media (min-width:992px){.modal-lg{width:900px}} @media all and (transform-3d),(-webkit-transform-3d){.carousel-inner>.item{-webkit-transition:-webkit-transform .6s ease-in-out;-o-transition:-o-transform .6s ease-in-out;transition:transform .6s ease-in-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;perspective:1000}.carousel-inner>.item.active.right,.carousel-inner>.item.next{left:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.carousel-inner>.item.active.left,.carousel-inner>.item.prev{left:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.carousel-inner>.item.active,.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right{left:0;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}} @media screen and (min-width:768px){.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev{width:30px;height:30px;margin-top:-15px;font-size:30px}.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev{margin-left:-15px}.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next{margin-right:-15px}.carousel-caption{right:20%;left:20%;padding-bottom:30px}.carousel-indicators{bottom:20px}} /* ---------------------------------------- Setting (Gnuboard) ---------------------------------------- */ /* ie6 이미지 너비 지정 */ .img_fix{width:100%;height:auto} /* Mobile화면으로 */ #device_change{display:none;top:0px;left:0;width:100vw;padding:5vw;text-align:center;font-size:6vw;} @media (min-width:1024px){ #device_change{display:none;} } /* 팝업 */ #hd_pop{position:relative;z-index:1000;height:0;margin:0 auto} #hd_pop h2{overflow:hidden;position:absolute;font-size:0;line-height:0} .hd_pops{overflow:hidden;z-index:20;min-width:300px;-webkit-border-radius:10px 10px 10px 10px;-moz-border-radius:10px 10px 10px 10px;border-radius:10px 10px 10px 10px; -webkit-box-shadow:0px 5px 15px 0px rgba(0,0,0,0.1);box-shadow:0px 5px 15px 0px rgba(0,0,0,0.1);/*position:absolute;*/} .hd_pops:hover{box-shadow:0px 5px 15px 0px rgba(0,0,0,0.3);} .hd_pops_con img {width:100%;} .hd_pops_footer{position:relative;background:#fff;letter-spacing:-1px;margin-top:-5px;} .hd_pops_footer .hd_pops_reject{display:inline-block;cursor:pointer;font-size:12px;line-height:16px;} .hd_pops_footer .hd_pops_reject strong{font-weight:normal;} .hd_pops_footer .hd_pops_close{position:absolute;right:0px;border:none;background:none;font-size:16px;line-height:14px;} .hd_pops_footer>*{padding:15px 20px;transition-duration:0.7s;transition-delay:0s;} .hd_pops_footer>*:hover{color:#006ff2;transition-duration:0.7s;transition-delay:0s;} .hd_pops_bg{position:fixed;top:0px;left:0px;z-index:99999;width:100%;height:100%;background:#000;opacity:0.5;} /* 댓글 스타일 */ .cnt_cmt{display:inline-block;margin:0 0 0 3px;font-weight:bold} /* 기본테이블 */ .tbl_wrap table{width:100%;border-collapse:collapse;border-spacing:0} .tbl_wrap caption{padding:10px 0;text-align:left;font-weight:bold} .tbl_head01{margin:0 0 10px} .tbl_head01 caption{overflow:hidden;padding:0;font-size:0;line-height:0} .tbl_head01 thead th{padding:12px 0;background:#f9f9f9;color:#383838;text-align:center;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;font-size:0.95em;} .tbl_head01 thead a{color:#383838} .tbl_head01 thead th input{vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head01 tfoot th,.tbl_head01 tfoot td{padding:10px 0;background:#d7e0e2;text-align:center;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5} .tbl_head01 tbody th{padding:8px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head01 td{padding:8px 5px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;line-height:1.5em;word-break:break-all} .tbl_head02{margin:0 0 10px} .tbl_head02 caption{overflow:hidden;padding:0;font-size:0;line-height:0} .tbl_head02 thead th{padding:5px 0;background:#f9f9f9;color:#383838;text-align:center;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;font-size:0.95em;} .tbl_head02 thead a{color:#383838} .tbl_head02 thead th input{vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head02 tfoot th,.tbl_head02 tfoot td{padding:10px 0;background:#d7e0e2;text-align:center;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5} .tbl_head02 tbody th{padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head02 td{padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;line-height:1.4em;word-break:break-all} /* 폼 테이블 */ .tbl_frm01{margin:0 0 20px;font-size:1.2em;} .tbl_frm01 table{width:100%;border-collapse:collapse;border-spacing:0;} .tbl_frm01 tr{display: flex;align-items: center;padding: 15px 0;} .tbl_frm01 tr:last-child{border: none;display: none;} .tbl_frm01 th{width:14%;padding: 0 10px 0 0;text-align:left;} .tbl_frm01 td{padding: 0;width: 100%;} .tbl_frm01 textarea,.frm_input{border:1px solid #e4eaec;background:#f9f9f9;color:#555;vertical-align:middle;line-height:2em} .tbl_frm01 textarea{width:100%;height:100px;padding:2px 2px 3px} .tbl_frm01 fieldset{border:0px;} .frm_input{padding:3px;} .tbl_frm01 a{text-decoration:none} .tbl_frm01 .frm_file{display:block;margin-bottom:5px} .tbl_frm01 .frm_info{display:block;padding:0 0 5px;line-height:1.4em} /* 폼 테이블 (문의하기) : 인풋 */ /* skin/board/modal_write */ .tbl_frm01 .form-control{height: auto;padding:1em;font-size:1em;} .tbl_frm01 #wr_content{border:1px solid #ccc;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;background:#;padding:1em;} .tbl_frm01 .mkit-agree{text-align: center;} .tbl_frm01 .mkit-agree #prv-agree{padding:1.5em;font-size:14px;text-align:left;} /* 자료 없는 목록 */ .empty_table{padding:50px 0 !important;text-align:center} .empty_list{padding:20px 0 !important;text-align:center} /* 필수입력 */ .required,textarea.required{background:url('../img/wrest.gif') top right no-repeat !important} /* 테이블 항목별 정의 */ .td_board{width:120px;text-align:center} .td_category{width:80px;text-align:center} .td_chk{width:30px;text-align:center} .td_date{width:60px;text-align:center} .td_datetime{width:110px;text-align:center} .td_group{width:100px;text-align:center} .td_mb_id{width:100px;text-align:center} .td_mng{width:80px;text-align:center} .td_name{width:100px;text-align:left} .td_nick{width:100px;text-align:center} .td_num{width:50px;text-align:center} .td_numbig{width:80px;text-align:center} .td_stat{width:60px;text-align:center} .txt_active{color:#5d910b} .txt_done{color:#e8180c} .txt_expired{color:#aaa} .txt_rdy{color:#8abc2a} /* 새창 기본 스타일 */ .new_win .tbl_wrap{margin:0 20px} .new_win #win_title{margin:0 0 10px;padding:20px;background:#fff;border-top:3px solid #333;border-bottom:1px solid #dde4e9;font-size:1.2em} .new_win #win_title .sv{font-size:0.75em;line-height:1.2em} .new_win .win_ul{margin:-20px 0 20px 0;padding:0 20px;background:#484848;border-bottom:1px solid #455255;list-style:none;zoom:1} .new_win .win_ul:after{display:block;visibility:hidden;clear:both;content:""} .new_win .win_ul li{float:left;margin-left:-1px} .new_win .win_ul a{display:block;padding:10px 10px 8px;color:#fff;text-decoration:none;border-right:1px solid #455255;border-left:1px solid #455255;font-family:dotum;font-weight:bold} .new_win .win_desc{padding:20px} .new_win .win_btn{clear:both;padding:20px;text-align:center} /* 새창용 */ .new_win .win_btn button{display:inline-block;height:30px;padding:0 10px;border:0;background:#006ff2;color:#fff;line-height:2em;cursor:pointer} .new_win .win_btn input{height:30px;padding:0 10px;line-height:2em} .new_win .win_btn a{display:inline-block;height:30px;padding:0 10px;background:#006ff2;color:#fff;vertical-align:middle;line-height:2.4em} .new_win .win_btn a:focus,.new_win .win_btn a:hover{text-decoration:none} /* 검색결과 색상 */ .sch_word{color:#006ff2} /* 자바스크립트 alert 대안 */ #validation_check{width:500px;margin:100px auto} #validation_check h1{margin-bottom:20px;font-size:1.3em} #validation_check p{padding:30px 20px;border:1px solid #e9e9e9;background:#fff;margin-bottom:20px} /* 사이드뷰 */ .sv_wrap{display:inline-block;position:relative;font-weight:normal} .sv_wrap .sv{display:none;z-index:1000;margin:5px 0 0;border:1px solid #283646} .sv_wrap .sv a{display:inline-block;width:94px;margin:0;padding:3px;background:#111;color:#fff !important;border-bottom:1px solid #283646} .sv_wrap a:focus,.sv_wrap a:hover,.sv_wrap a:active{text-decoration:none} .sv_on{display:block !important;position:absolute;top:10px;left:20px;width:auto;height:auto} .sv_nojs .sv{display:block} /* 페이징 */ .pg_wrap{clear:both;margin:0 0 20px;padding:20px 0 0;text-align:center} .pg_page,.pg_current{display:inline-block;height:30px;width: 30px;color:#333;letter-spacing:0;vertical-align:middle;line-height:30px;border-radius: 50%;} .pg_start,.pg_end{border-radius: 100px;padding: 0 10px;width: auto;} .pg a:focus,.pg a:hover{text-decoration:none} .pg_page{background:#EEE;text-decoration:none} .pg_current{display:inline-block;margin:0 4px 0 0;background:#006ff2;color:#fff;font-weight:normal} /* 게시판 일괄적용 */ #bo_v_atc_title{overflow:hidden;position:absolute;width:0;margin:0;padding:0;text-indent:-9999em;font-size:0;line-height:0} #container_title{display:none;} #bo_v_act{display:none;} /* 게시판용 버튼 */ /* 목록 버튼 가림 */ a.btn_b01,a.btn_b02,a.btn_admin,.btn_bo_adm input{display:inline-block;padding:7px 10px;color:#303231;text-decoration:none;vertical-align:middle;border-radius:3px} a.btn_b01,.btn_bo_adm input{border:1px solid #ebeceb;background:#fff;} a.btn_b01:hover,.btn_bo_adm input:hover{background:#edeeed;color:#000;transition:all 0.3s} a.btn_b02{border:1px solid #006ff2;background:#006ff2;color:#fff} a.btn_b02:hover{background:#006ff2;transition:all 0.3s} a.btn_admin{border:1px solid #f3b15f;background:#f1c161;color:#fff} a.btn_admin:hover{background:#f3b15f;transition:all 0.3s} /* 게시물 선택복사 선택이동 */ .btn_bo_adm {float:left;width:auto;} .copymove_current{float:right;color:#006ff2} .copymove_currentbg{background:#006ff2} /* 게시판 리스트 */ #bo_list_total{display:none;float:left;width:auto;margin:13px 0 10px 0;font-size:0.9em;} /*게시물수*/ .bo_fx ul{margin:0 0 7px 0;padding:0;} /*버튼줄*/ .bo_fx li{display:inline-block;margin:0 1px;padding:0;list-style-type:none;} .btn_bo_user{float:right;width:auto;} #bo_list thead th{padding:15px 0;background:none;} /*테이블*/ #bo_list .td_cnt {width:100px;color:#fff;text-align:center;border-radius:3px;} #bo_list .td_cnt span {display:block;width:100%;padding:5px 0;} #bo_list .td_name{text-align:center;} #bo_sch{width:100%;text-align:center;}/* 검색 */ /* 게시판 쓰기 */ /* 임시저장 */ #autosave_wrapper {position:relative} #autosave_pop {display:none;position:absolute;top:24px;right:117px;z-index:10;width:350px;height:auto !important;height:180px;padding:8px;border:1px solid #565656;background:#fff;max-height:180px;overflow-y:scroll} html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */ #autosave_pop strong {overflow:hidden;position:absolute;font-size:0;line-height:0} #autosave_pop div {text-align:right} #autosave_pop button {margin:0;padding:0;border:0;background:transparent} #autosave_pop ul {margin:10px 0;padding:0;border-top:1px solid #e9e9e9;list-style:none} #autosave_pop li {padding:8px 5px;border-bottom:1px solid #e9e9e9;zoom:1} #autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""} #autosave_pop a {display:block;float:left} #autosave_pop span {display:block;float:right} .autosave_close {cursor:pointer} .autosave_content {display:none} #btn_autosave{margin-top:5px;} /* ckeditor 단축키 */ .cke_sc{display:none;} /* 기타 */ .margin-auto{margin:0 auto;} /* 게시판 보기 */ /* 게시판 댓글 */ #bo_vc {margin:0 0 10px;padding:20px 20px 10px;border:1px solid #ebeceb;background:#fdfdfd} #bo_vc h4 {margin-bottom:1em;font-size:1.2em;} #bo_vc section {padding:0 0 10px;border-top:1px solid #ebeceb} #bo_vc header {position:relative;padding:15px 0 5px} /*작성자이름*/ #bo_vc header .icon_reply {position:absolute;top:15px;left:-20px} #bo_vc .sv_wrap {margin-right:15px} #bo_vc .member, #bo_vc .guest, #bo_vc .sv_member, #bo_vc .sv_guest {font-weight:bold} #bo_vc .bo_vc_hdinfo {display:none;margin:0 15px 0 5px} #bo_vc h1 {overflow:hidden;position:absolute;font-size:0;line-height:0} #bo_vc p {padding:0 0 5px;line-height:1.8em} #bo_vc p a {text-decoration:underline} #bo_vc p a.s_cmt {text-decoration:none} #bo_vc_empty {margin:0;padding:20px !important;text-align:center} #bo_vc #bo_vc_winfo {float:left} #bo_vc footer {zoom:1} #bo_vc footer:after {display:block;visibility:hidden;clear:both;content:""} #bo_vc .bo_vc_act {float:right;margin:0;list-style:none;zoom:1} #bo_vc .bo_vc_act:after {display:block;visibility:hidden;clear:both;content:""} #bo_vc .bo_vc_act li {float:left;margin-left:5px;font-size:0.8em;opacity:0.9;} /*댓글쓰기*/ #bo_vc_w {position:relative;margin:0 0 10px;} #bo_vc_w h2 {overflow:hidden;position:absolute;font-size:0;line-height:0} #bo_vc_w #char_cnt {display:block;margin:0 0 5px} #bo_vc_w .tbl_frm01{margin:0;} #bo_vc_w th,#bo_vc_w td{padding:10px 0;border-bottom:none;} #bo_vc_w .btn_confirm{margin:0;text-align:right;} #bo_vc_sns {margin:0;padding:0;list-style:none;zoom:1} #bo_vc_sns:after {display:block;visibility:hidden;clear:both;content:""} #bo_vc_sns li {float:left;margin:0 20px 0 0} #bo_vc_sns input {margin:0 0 0 5px} /* ---------------------------------------- ★엠킷 헤더 ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 헤더 */ #header{overflow:hidden;position:fixed;top:0px;left:0;z-index:9;width:100%;padding:40px 50px;transition-duration:.7s;transition-delay:0s;} #header .header_bottom{position:relative;} #header .logo{display:inline-block;position:relative;} #header .logo a{display: flex;align-items: flex-end;} #header .logo a img{position: relative;max-height:55px;transition-duration:.7s} #header .logo a .logo_tit{font-size: clamp(18px, 1.5vw, 20px);margin-left: 12px;transition-duration: .7s;font-weight: 500;} #header.active{padding: 20px 30px;background-color: #FFF;min-height: 90px;box-shadow: 0 1px 5px rgba(0,0,0,0.1);} #header.active .logo a img{max-height: 45px;} #header.active .logo a .logo_tit{font-size: 16px;margin-left: 15px;color:#333;} #header form{position:absolute;top:0;right:0px;height: 100%;} #header .h_ask_btn{display:block;position: absolute; top: 50%;right:0;transform: translateY(-50%); width:120px;margin:0;border: 1px solid #006ff2;background-color:#006ff2; border-radius:20px;line-height:40px;transition-duration:.7s;color:#FFF;max-height: 40px;} #header .h_ask_btn img{display: none;} #header .price_compare{display:block;position: absolute; top: 50%; right:135px;transform: translateY(-50%);width:150px;margin:0; border:1px solid #006ff2;color: #006ff2;border-radius:20px;line-height:40px;transition-duration:.7s;max-height: 40px;} #header .price_compare img{display: none;} #header .fa-bars{display:none !important;} /* 윈도우 (width:768px) 헤더 */ @media (max-width:768px){ #header{position:sticky;padding:10px 20px;background-color: #FFF;} #header.active{padding: 10px 20px;background-color: #FFF;min-height: auto;} #header .logo a img{position: relative;max-height:40px;} #header.active .logo a img{max-height: 40px;} #header .logo a .logo_tit{display: none;} #header.active .h_ask_btn{top: 50%;} #header.active .price_compare{top: 50%;} #header form{position:absolute;top:0;right:0px;height: 100%;} #header .h_ask_btn{right:0;width:100px;margin:0;border-radius:20px;line-height:30px;max-height: 30px;} #header .price_compare{right:110px;width:100px;margin:0;border-radius:20px;line-height:30px;max-height: 30px;} } /* 윈도우 (width:500px) 헤더 */ @media (max-width:500px){ #header{padding:15px;} #header.active{padding:15px;} #header .logo a img{max-height:32px;} #header.active .logo a img{max-height: 32px;} #header .h_ask_btn{right:0;width:90px;margin:0;border-radius:20px;line-height:30px;max-height: 30px;} #header .price_compare{right:100px;width:90px;margin:0;border-radius:20px;line-height:30px;max-height: 30px;} } /* GNB */ #gnb{position:absolute;z-index:999;margin-left:auto;} #gnb .gnb_wrap{position:relative;margin:0 auto;} #gnb ul:after {display:block;visibility:hidden;clear:both;content:""} #gnb #gnb_1dul {display:flex;text-align:center;transition-duration:.5s;} .gnb_1dli{display:block;position:relative;margin-right:60px;line-height:90px;} .gnb_1dli .bg{display:none;overflow:hidden;width:10px;height:10px;text-indent:-999px} .gnb_1da {display:block;position:relative;color:#222;font-size:16px;font-weight:700;} .gnb_1da::after{display:block;position:absolute;bottom:0;left:50%;width:0%;height:2px;content:'';background-color:#006ff2;transform:translateX(-50%);transition-duration:.3s;} .gnb_1dli:hover .gnb_1da::after{display:block;width:100%;} .gnb_1dli_over .gnb_1da {color:#006ff2;} .gnb_2dli{line-height:40px;} .gnb_2dul {display:none;position:absolute;padding:5px 0;background:#fff;min-width:180px;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;-webkit-box-shadow:n;-moz-box-shadow: 0 1px 10px rgba(0,0,0,0.1);box-shadow:0 1px 10px rgba(0,0,0,0.1);} .gnb_1dli_over .gnb_2dul {display:block;left:50%;margin-left:-90px;} .gnb_2da {display:block;position:relative;padding:0px 20px;text-align:center;text-decoration:none;font-size:16px;opacity:0.8;} .gnb_2da::after{display:block;position:absolute;top:50%;left:30px;width:0;height:0;content:'';border-radius:50%;background-color:#006ff2;transition-duration:.3s;transform:translate(-50%,-50%);} .gnb_2da:hover::after{display:block;width:6px;height:6px;} .gnb_2da:focus, .gnb_2da:hover {opacity:1;} .gnb_wrap .gnb_empty {width:100%;padding:10px 0;text-align:center;line-height:2em} .gnb_wrap .gnb_empty a{text-decoration:underline} .gnb_wrap .gnb_al_ul .gnb_empty, .gnb_wrap .gnb_al_ul .gnb_empty a{color:#555} #gnb .gnb_menu_btn{display:none;position:absolute;top:15px;left:2px;width:40px;height:40px;padding:0;border:0;background:url(../img/menu_btn.png);} #gnb .gnb_close_btn{display:none;position:fixed;top:28px;left:28px;z-index:9997;width:34px;height:34px;border:0;background:#006ff2;color:#fff;vertical-align:top;font-size:18px;} .fa-times{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);} #gnb_all{display:block;position:absolute;top:0;left:0;z-index:99;width:320px;} #gnb_all .gnb_al_ul:after {display:block;visibility:hidden;clear:both;content:""} #gnb_all .gnb_al_ul{position:fixed;top:0;left:-70%;z-index:9997;width:70%;height:100vh;padding:80px 10px 30px 20px;background:#fff;} #gnb_all .gnb_al_li{float:none;width:100%;background:#fff;} #gnb_all .gnb_al_li .gnb_al_a{display:block;position:relative;padding:10px 20px;color:#006ff2;margin-bottom:10px;border-bottom:1px solid #ededed;font-size:16px;font-weight:700} #gnb_all .gnb_al_li li {padding-left:20px;line-height:3em;font-size:14px;} #gnb_all .gnb_al_li li i{position:relative;color:#006ff2;} #gnb_all .gnb_al_li li i::before{position:absolute;top:-7px;left:-7px;width:5px;height:5px;content:'';border-radius:50%;background-color:#006ff2;} #gnb_all .bg-cover{display:none;position:fixed;top:0%;left:0px;z-index:9998;width:100vw;height:100vh;background:#000;opacity:0.7;} /* ---------------------------------------- ★엠킷 (Footer) ---------------------------------------- */ #fnb .container>*>ul{float:left;width:14%;vertical-align:top;} #fnb .container>*>ul>li a{display:block;width:100%;padding:5px 0;} #fnb .container .fnb_depth1 ul a{padding-bottom:20px;font-weight:600;} #footer{padding:35px 0 45px;background:#FFF;color:#555;text-align: center;} #footer li a{display:inline-block;padding:5px 10px;color:#555} #footer li:first-child a{padding-left:0;} #quick{display:none;} @media (min-width:1024px){ #quick{display:initial;} } /* ---------------------------------------- ★엠킷 (Index) ---------------------------------------- */ /* ---------------------------------------- ★엠킷 메인비주얼 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 메인비주얼 */ .slider, .slick-list, .slick-track, .slick-slide{position: relative;width: 100%;height: 100%;} #main_visual{overflow:hidden;position:relative;height:90vh;max-height:1080px;} #main_visual .item{} #main_visual .item.slick-active{animation-name: slidein;animation-duration: 3s;} #main_visual .bg_motion_0{background:url(../img/main_visual_bg_1.png) center / cover;} #main_visual .bg_motion_1{background:url(../img/main_visual_bg_2.png) center / cover;} #main_visual .bg_motion_2{background:url(../img/main_visual_bg_3.png) right -60px center / cover;} @media screen and (min-width:1201px) { #main_visual .bg_motion_2{background:url(../img/main_visual_bg_3.png) center / cover;} } @keyframes slidein { from { transform: scale(1.1);} to { transform: scale(1);} } #main_visual .container{max-width: 1800px;width: 100%;height: 100%;padding: 0 8vw 0;} #main_visual .slider .item .main_circle_bg{position: absolute;top: -50vh;right:-20vh;width: 100vh;height: 100vh;border-radius:50%;background-color:#cfe9ff;z-index: -20;} #main_visual .slider .item .img_box{position:absolute;bottom:50%;right:0;transform: translateY(50%); z-index:-1;width:70vh;max-width: 700px;} #main_visual .slider .item:first-child .img_box{top: auto;bottom: auto;} #main_visual .slider .item .img_box img{display:block;width:100%;} #main_visual .slider .item .img_box img.pc_img{display: block;} #main_visual .slider .item .img_box img.mob_img{display: none;} #main_visual .slider .item .main_visual_inner{margin-top:30vh;width: 100%;} #main_visual .slider .item .main_visual_inner .main_tit{letter-spacing:-0.1em;line-height:80px} #main_visual .slick-list{overflow: visible;} #main_visual .slider_wrap {position: relative;} #main_visual .slick-slide > div {font-size: 0;} #main_visual .slick-slide .item {overflow: hidden;} #main_visual .slick-slide .img_box {position: relative;display: block; width: 100%; } /* transition: all 1s cubic-bezier(0.7, 0, 0.3, 1); */ #main_visual .slick-slide:first-child .img_box {bottom: -150px;right: 0;} #main_visual .slick-slide .img_box {right: -150px;} #main_visual .slick-slide:first-child.slick-active .img_box {animation: 2s ease-in-out forwards slickAni_bottom;} #main_visual .slick-slide.slick-active .img_box {animation: 2s ease-in-out forwards slickAni_right;} /* 메인비주얼 텍스트 */ #main_visual .slider .item .main_tit{position: relative;font-size: clamp(70px, 5vw, 100px);margin-bottom: 2.5vw;} #main_visual .slider .item .main_sub_tit{position: relative;top: 20px;opacity: 0;font-size: clamp(24px, 2vw, 40px);} #main_visual .slider .item .main_txt{position: relative;opacity: 0;} #main_visual .slick-slide.slick-active .main_tit{animation: 1s forwards slickAni_tit;} #main_visual .slick-slide.slick-active .main_sub_tit{animation: 1s forwards .5s slickAni_sub_tit;} #main_visual .slick-slide.slick-active .main_txt{animation: 1s forwards 1s slickAni_txt;} @keyframes slickAni_top {from {top: -30vh;} to {top: 0;}} @keyframes slickAni_bottom {from {bottom: 10vh;} to {bottom: 50%;}} @keyframes slickAni_right {from {right:-30vh;} to {right:0;}} @keyframes slickAni_tit {from {top:20px;} to {top:0px;}} @keyframes slickAni_sub_tit {from {top:20px;opacity: 0;} to {top:0px;opacity: 1;}} @keyframes slickAni_txt {from {opacity:0;} to {opacity:1;}} /* 메인비주얼 슬라이드 버튼 */ #main_visual .progress {position: absolute;left: 50%;bottom: 0;max-width: 600px;width: 90%;height: 100px;transform:translateX(-50%); background: none;text-align: center;box-shadow:none;border-radius:0;margin-bottom:0;} #main_visual .progress div {float: left;width: 32%;padding: 0;cursor: pointer;margin-right: 2%;color: #333;} #main_visual .progress div h3{opacity: .4;} #main_visual .progress div.active h3{opacity: 1;} #main_visual .progress div:last-child {margin-right: 0;} #main_visual .progress div span.progressBar {display: block;width: 100%;height: 4px;background-color: rgba(0, 0, 0, 0.05);} #main_visual .progress div span.progressBar .inProgress {display: block;width: 0%;height: 4px;background-color: #006ff2;} /* 윈도우 (width:1200px) 메인비주얼 */ @media (max-width:1200px){ #main_visual .container{padding: 0 6vw 0;} #main_visual .slider .item .img_box{max-width: 600px;} #main_visual .img_box{width:70vh;} } /* 윈도우 (width:1000px) 메인비주얼 */ @media (max-width:1000px){ #main_visual .container{padding: 0 5vw 0;} #main_visual .slider .item .img_box{max-width: 500px;} #main_visual .img_box{width:60vh;} } /* 윈도우 (width:768px) 메인비주얼 */ @media (max-width:768px){ /* 메인 비주얼 */ #main_visual{overflow:hidden;position:relative;height:50vh;max-height:auto;text-align: left;} #main_visual .container{padding: 0;} #main_visual .slider .item .main_visual_inner{margin-top:15vh;padding-left:20px;} #main_visual .slider .item:first-child .img_box{top: 0;bottom: auto;} #main_visual .slider .item .img_box{position:absolute;bottom:0;right:50%;z-index:-1;width:40vh;transform: translateX(50%);} #main_visual .slider .item .img_box img{position: relative;display:block;width:100%;} #main_visual .slider .item:first-child .img_box{top: auto;bottom: 0;} /* 메인비주얼 텍스트 */ #main_visual .slider .item .main_tit{font-size: 36px !important;line-height: 40px !important;} #main_visual .slider .item .main_sub_tit{font-size: 18px !important;} #main_visual .slider .item .main_txt{font-size: 16px;} @keyframes slickAni_top {from {top: -100px;} to {top: 0;}} @keyframes slickAni_bottom {from {bottom: -100px;} to {bottom: 70px;}} @keyframes slickAni_right {from {right:-100px;} to {right:0;}} @keyframes slickAni_tit {from {top:20px;} to {top:0px;}} @keyframes slickAni_sub_tit {from {top:20px;opacity: 0;} to {top:0px;opacity: 1;}} @keyframes slickAni_txt {from {opacity:0;} to {opacity:1;}} #main_visual .slider .item .img_box img.pc_img{display: none;} #main_visual .slider .item .img_box img.mob_img{display: block;} #main_visual .slider .item .img_box {top: auto;bottom:-150px;right: 50%;} #main_visual .slider .item.slick-active .img_box {animation: 2s ease-in-out forwards slickAni_bottom;} #main_visual .slider .item .main_circle_bg{position: absolute;top: -30vh;right:50%;width: 70vh;height: 70vh;transform:translateX(50%)} /* 메인비주얼 슬라이드 버튼 */ #main_visual .progress{height: 60px;} #main_visual .progress h3{font-size: 14px;} } /* ---------------------------------------- ★엠킷 메인비주얼 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 병원마케팅 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 병원마케팅 */ #mkit_marketing{position:relative;padding:80px 0;background-color:#FFF;} #mkit_marketing .market_circle_wrap{position: relative;height: 730px;margin-top: 200px;} /* 점선 원 bg */ #mkit_marketing .market_circle_wrap::before{display: block;position: absolute;top: 50%;left: 50%;z-index: 1;width: 700px;height: 700px; border: 1px dashed #d9d9d9;content: '';transform: translate(-50%,-50%);border-radius: 50%; transition-duration: .7s;margin-top: -80px;} #mkit_marketing .market_circle_wrap::after{display: block;position: absolute;top: 50%;left: 50%;z-index: 1;width: 600px;height: 600px; border: 1px dashed #d9d9d9;content: '';transform: translate(-50%,-50%);border-radius: 50%; transition-duration: .7s;margin-top: -80px;} /* 중앙 로고 */ #mkit_marketing .market_circle_wrap .market_logo{position: absolute;top: 50%;left: 50%;z-index: 20;width: 200px;height: 200px;transform: translate(-50%,-50%);background-color: #FFF;border-radius: 50%;margin-top: -70px;transition-duration: .7s;} #mkit_marketing .market_circle_wrap .market_logo::before{display: block;position: absolute;top: 50%;left: 50%;width: 200px;height: 200px;border: 4px solid #358df1;content: '';transform: translate(-50%,-50%);border-radius: 50%;transition-duration: .7s;} #mkit_marketing .market_circle_wrap .market_logo img{display: block;position: absolute;top: 50%;left: 50%;width: 120px;transform: translate(-50%,-50%);transition-duration: .7s;} /* 삼각형 */ #mkit_marketing .market_circle_wrap .market_circle_box{position: absolute;top: 50%;left: 50%;z-index: 10;transform: translate(-50%,-50%);width: 50%;} #mkit_marketing .market_circle_wrap .market_circle_box li{position: absolute;top: 50%;left: 50%;z-index: 20; width: 350px;height: 350px;text-align: center;transform: translate(-50%,-50%);opacity: 0.3;transition-duration: .7s;background-repeat: no-repeat;background-position: center;background-size: cover;cursor: pointer;} #mkit_marketing .market_circle_wrap .market_circle_box li.active{opacity: 1;} #mkit_marketing .market_circle_wrap .market_circle_box li::before{transition-duration: .7s; content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-size: cover;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1)::before{margin-top: -324px;background-image: url(../img/market_list1.png);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2)::before{margin-left: -196px;background-image: url(../img/market_list2.png);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3)::before{margin-left: 196px;background-image: url(../img/market_list3.png);} /* 삼각형 bg */ #mkit_marketing .market_circle_wrap .market_circle_bg{position: absolute;top: 50%;left: 50%;z-index: 2;transform: translate(-50%,-50%);} #mkit_marketing .market_circle_wrap .market_circle_bg li{position: absolute;top: 50%;left: 50%;z-index: 1; width: 350px;height: 350px;text-align: center;transform: translate(-50%,-50%);transition-duration: .7s;background-repeat: no-repeat;background-position: center;background-size: cover;} #mkit_marketing .market_circle_wrap .market_circle_bg li::before{transition-duration: .7s; content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-size: cover;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1)::before{margin-top: -324px;background-image: url(../img/market_list1_bg.png);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2)::before{margin-left: -196px;background-image: url(../img/market_list2_bg.png);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3)::before{margin-left: 196px;background-image: url(../img/market_list3_bg.png);} /* 아이콘, 텍스트 */ #mkit_marketing .market_circle_wrap .market_circle_box li img{ display: block;position: absolute;top: 50%;left: 50%;width: 64px;transform: translate(-50%,-50%);transition-duration: .4s;opacity: 0;margin-top: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li.active img{width: 64px; margin-top: -25px;opacity: 1;} #mkit_marketing .market_circle_wrap .market_circle_box li p{position: absolute;top: 50%;left: 50%;white-space: nowrap;transform: translate(-50%,-50%);transition-duration: .4s;} #mkit_marketing .market_circle_wrap .market_circle_box li.active p{margin-top: 30px;} #mkit_marketing .market_circle_wrap .market_circle_box li .con_box{position: absolute; top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 99;} /* 삼각형 위치 */ #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_1::before{margin-top: -324px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_2::before{margin: 60px 0 0 228px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_3::before{margin: 60px 0 0 -228px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_1::before{margin-left: -196px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_2::before{margin: -270px 0 0 34px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_3::before{margin: 60px 0 0 162px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_1::before{margin-left: 196px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_2::before{margin: 60px 0 0 -162px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_3::before{margin: -268px 0 0 -34px;transform: rotate(240deg);} /* 삼각형bg 위치 */ #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_1::before{margin-top: -324px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_2::before{margin: 60px 0 0 228px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_3::before{margin: 60px 0 0 -228px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_1::before{margin-left: -196px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_2::before{margin: -270px 0 0 34px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_3::before{margin: 60px 0 0 162px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_1::before{margin-left: 196px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_2::before{margin: 60px 0 0 -162px;;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_3::before{margin: -268px 0 0 -34px;transform: rotate(240deg);} /* 아이콘 위치 */ #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_1 .con_box{margin: -320px 0 0 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_2 .con_box{margin: 60px 0 0 220px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_3 .con_box{margin: 60px 0 0 -220px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_1 .con_box{margin: 60px 0 0 -220px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_2 .con_box{margin: -320px 0 0 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_3 .con_box{margin: 60px 0 0 220px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_1 .con_box{margin: 60px 0 0 220px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_2 .con_box{margin: 60px 0 0 -220px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_3 .con_box{margin: -320px 0 0 0;} /* 부가 설명 위치 */ #mkit_marketing .market_txt_wrap{display: block; position: absolute;top: 0;left: 0;transition-duration: .7s;z-index: 9;width: 100%;height: 100%;} #mkit_marketing .market_txt_wrap .txt_box{display: block; position: absolute;top: 0;left: 0;width: 100%;height: 100%;} #mkit_marketing .market_txt_wrap .txt_box.active{display: block;} #mkit_marketing .market_txt_wrap .market_list_wrap{position: absolute;top: 0;left: 0; width: 100%;height: 100%;margin-top: -130px;} #mkit_marketing .market_txt_wrap .market_list_wrap li{position: absolute;top: 0;left: 50%;transform: translateX(-50%); width: 100%;line-height: 60px;max-width: 200px;color: #FFF;padding: 0 5px;border-radius: 200px;text-align: center;transition-duration: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li{opacity: 0;margin-right: -50px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2n){margin-right: 50px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li{margin-right: 0;opacity: 1;transition-delay: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(1){margin: 0 0 0 -350px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2){margin: 125px 0 0 -350px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(3){margin: 250px 0 0 -400px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(4){margin: 0 0 0 350px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(5){margin: 125px 0 0 350px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(6){margin: 250px 0 0 400px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(1){margin-left: -300px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(2){margin-left: -400px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(3){margin-left: -350px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(4){margin-left: 300px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(5){margin-left: 400px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(6){margin-left: 350px;} #mkit_marketing .market_txt_wrap .txt_box:nth-of-type(1) .market_list_wrap .market_tit{background-color: #e39595;} #mkit_marketing .market_txt_wrap .txt_box:nth-of-type(2) .market_list_wrap .market_tit{background-color: #82a7d0;} #mkit_marketing .market_txt_wrap .txt_box:nth-of-type(3) .market_list_wrap .market_tit{background-color: #70a194;} /* 윈도우 (width:1200px) 병원마케팅 */ @media (max-width:1200px){ /* 부가 설명 위치 */ #mkit_marketing .market_txt_wrap .market_list_wrap{position: absolute;top: 0;left: 0; width: 100%;height: 100%;margin-top: -130px;} #mkit_marketing .market_txt_wrap .market_list_wrap li{position: absolute;top: 0;left: 50%;transform: translateX(-50%); width: 100%;line-height: 55px;max-width: 180px;color: #FFF;padding: 0 5px;border-radius: 200px;text-align: center;transition-duration: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li{opacity: 0;margin-right: -50px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2n){margin-right: 50px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li{margin-right: 0;opacity: 1;transition-delay: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(1){margin: 0 0 0 -330px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2){margin: 125px 0 0 -330px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(3){margin: 250px 0 0 -380px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(4){margin: 0 0 0 330px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(5){margin: 125px 0 0 330px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(6){margin: 250px 0 0 380px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(1){margin-left: -280px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(2){margin-left: -380px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(3){margin-left: -330px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(4){margin-left: 280px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(5){margin-left: 380px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(6){margin-left: 330px;} } /* 윈도우 (width:1000px) 병원마케팅 */ @media (max-width:1000px){ /* 부가 설명 위치 */ #mkit_marketing .market_txt_wrap .market_list_wrap{position: absolute;top: 0;left: 0; width: 100%;height: 100%;margin-top: -130px;} #mkit_marketing .market_txt_wrap .market_list_wrap li{position: absolute;top: 0;left: 50%;transform: translateX(-50%); width: 100%;line-height: 60px;max-width: 160px;color: #FFF;padding: 0 5px;border-radius: 200px;text-align: center;transition-duration: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li{opacity: 0;margin-right: -50px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2n){margin-right: 50px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li{margin-right: 0;opacity: 1;transition-delay: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(1){margin: 0 0 0 -280px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2){margin: 125px 0 0 -240px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(3){margin: 250px 0 0 -320px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(4){margin: 0 0 0 280px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(5){margin: 125px 0 0 240px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(6){margin: 250px 0 0 320px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(1){margin-left: -230px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(2){margin-left: -290px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(3){margin-left: -270px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(4){margin-left: 230px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(5){margin-left: 290px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(6){margin-left: 270px;} } /* 윈도우 (width:768px) 병원마케팅 */ @media (max-width:768px){ #mkit_marketing{padding: 80px 0;overflow: hidden;} #mkit_marketing .market_circle_wrap{position: relative;height: 500px;margin-top: 150px;} #mkit_marketing .market_circle_wrap::before{width: 450px;height: 450px;margin-top: -80px;} #mkit_marketing .market_circle_wrap::after{width: 350px;height: 350px; margin-top: -80px;} #mkit_marketing .market_circle_wrap .market_logo{width: 170px;height: 170px;margin-top: -55px;} #mkit_marketing .market_circle_wrap .market_logo::before{width: 160px;height: 160px;border-width: 3px;} #mkit_marketing .market_circle_wrap .market_logo img{width: 90px;} #mkit_marketing .market_circle_wrap .market_circle_box li{width: 220px;height: 220px;} #mkit_marketing .market_circle_wrap .market_circle_box li img{width: 48px;} #mkit_marketing .market_circle_wrap .market_circle_box li.active img{width: 48px;margin-top: -20px;} #mkit_marketing .market_circle_wrap .market_circle_box li.active p{margin-top: 20px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1){margin-top: -230px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2){margin-left: -136px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3){margin-left: 136px;} #mkit_marketing .market_circle_wrap .market_circle_bg li{width: 220px;height: 220px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1){margin-top: -230px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2){margin-left: -136px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3){margin-left: 136px;} /* 768px 이하 반응형 삼각형 위치 */ #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_2::before{margin: 266px 0 0 156px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_3::before{margin: 266px 0 0 -156px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_2::before{margin:-194px 0 0 156px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_3::before{margin: 36px 0 0 252px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_2::before{margin: 36px 0 0 -252px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_3::before{margin: -194px 0 0 -158px;transform: rotate(240deg);} /* 768px 이하 삼각형 bg */ #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_2::before{margin: 266px 0 0 156px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_3::before{margin: 266px 0 0 -156px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_2::before{margin:-194px 0 0 156px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_3::before{margin: 36px 0 0 252px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_2::before{margin: 36px 0 0 -252px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_3::before{margin: -194px 0 0 -158px;transform: rotate(240deg);} /* 768px 이하 아이콘 위치 */ #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_1 .con_box{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_2 .con_box{margin: 264px 0 0 150px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_3 .con_box{margin: 264px 0 0 -150px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_1 .con_box{margin: 34px 0 0 -10px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_2 .con_box{margin: -220px 0 0 134px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_3 .con_box{margin: 34px 0 0 284px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_1 .con_box{margin: 34px 0 0 10px;;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_2 .con_box{margin: 34px 0 0 -284px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_3 .con_box{margin: -220px 0 0 -134px;} /* 768px 이하 부가 설명 위치 */ #mkit_marketing .market_txt_wrap .market_list_wrap{position: absolute;top: 0;left: 0; width: 100%;height: 100%;margin-top: -90px;} #mkit_marketing .market_txt_wrap .market_list_wrap li{position: absolute;top: 0;left: 50%;transform: translateX(-50%); width: 100%;line-height: 40px;max-width: 110px;color: #FFF;padding: 0 5px;border-radius: 200px;text-align: center;transition-duration: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li{opacity: 0;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li{opacity: 1;transition-delay: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(1){margin: 0 0 0 -170px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2){margin: 75px 0 0 -135px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(3){margin: 150px 0 0 -225px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(4){margin: 0 0 0 170px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(5){margin: 75px 0 0 135px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(6){margin: 150px 0 0 225px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(1){margin-left: -120px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(2){margin-left: -185px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(3){margin-left: -175px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(4){margin-left: 120px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(5){margin-left: 185px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(6){margin-left: 175px;} } /* 윈도우 (width:500px) 병원마케팅 */ @media (max-width:500px){ #mkit_marketing{padding: 80px 0;overflow: hidden;} #mkit_marketing .market_circle_wrap{position: relative;height: 350px;margin-top: 100px;} #mkit_marketing .market_circle_wrap::before{width: 260px;height: 260px;margin-top: -40px;} #mkit_marketing .market_circle_wrap::after{width: 200px;height: 200px; margin-top: -40px;} #mkit_marketing .market_circle_wrap .market_logo{width: 100px;height: 100px;margin-top: -45px;} #mkit_marketing .market_circle_wrap .market_logo::before{width: 90px;height: 90px;border-width: 2px;} #mkit_marketing .market_circle_wrap .market_logo img{width: 58px;} #mkit_marketing .market_circle_wrap .market_circle_box li{width: 150px;height: 150px;} #mkit_marketing .market_circle_wrap .market_circle_box li.active{width: 150px;height: 150px;} #mkit_marketing .market_circle_wrap .market_circle_box li img{width: 32px;} #mkit_marketing .market_circle_wrap .market_circle_box li.active img{width: 32px;margin-top: -15px;} #mkit_marketing .market_circle_wrap .market_circle_box li p{font-size: 16px;} #mkit_marketing .market_circle_wrap .market_circle_box li.active p{margin-top: 15px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1){margin-top: -160px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2){margin-left: -85px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3){margin-left: 85px;} #mkit_marketing .market_circle_wrap .market_circle_bg li{width: 150px;height: 150px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1){margin-top: -160px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2){margin-left: -85px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3){margin-left: 85px;} /* 500px 이하 반응형 삼각형 위치 */ #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_2::before{margin: 184px 0 0 98px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_3::before{margin: 184px 0 0 -98px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_2::before{margin:-134px 0 0 98px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_3::before{margin: 24px 0 0 156px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_2::before{margin: 24px 0 0 -156px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_3::before{margin: -134px 0 0 -98px;transform: rotate(240deg);} /* 500px 이하 삼각형 bg */ #mkit_marketing .market_circle_wrap .market_circle_bg li::before{width: 150px;height: 150px;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_2::before{margin: 184px 0 0 98px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(1).position_3::before{margin: 184px 0 0 -98px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_2::before{margin:-134px 0 0 98px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(2).position_3::before{margin: 24px 0 0 156px;transform: rotate(240deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_1::before{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_2::before{margin: 24px 0 0 -156px;transform: rotate(120deg);} #mkit_marketing .market_circle_wrap .market_circle_bg li:nth-of-type(3).position_3::before{margin: -134px 0 0 -98px;transform: rotate(240deg);} /* 500px 이하 아이콘 위치 */ #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_1 .con_box{margin: 0;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_2 .con_box{margin: 180px 0 0 94px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(1).position_3 .con_box{margin: 180px 0 0 -94px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_1 .con_box{margin: 20px 0 0 -6px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_2 .con_box{margin: -156px 0 0 84px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(2).position_3 .con_box{margin: 20px 0 0 174px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_1 .con_box{margin: 20px 0 0 6px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_2 .con_box{margin: 20px 0 0 -174px;} #mkit_marketing .market_circle_wrap .market_circle_box li:nth-of-type(3).position_3 .con_box{margin: -156px 0 0 -84px;} /* 500px 이하 부가 설명 위치 */ #mkit_marketing .market_txt_wrap .market_list_wrap{position: absolute;top: 0;left: 0; width: 100%;height: 100%;margin-top: -60px;} #mkit_marketing .market_txt_wrap .market_list_wrap li{position: absolute;top: 0;left: 50%;transform: translateX(-50%); width: 100%;line-height: 40px;max-width: 110px;color: #FFF;padding: 0 5px;border-radius: 200px;text-align: center;transition-duration: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li{opacity: 0;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li{opacity: 1;transition-delay: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(1){margin: 0 0 0 -150px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2){margin: 60px 0 0 -200px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(3){margin: 120px 0 0 -190px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(4){margin: 0 0 0 150px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(5){margin: 60px 0 0 200px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(6){margin: 120px 0 0 190px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(1){margin-left: -100px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(2){margin-left: -150px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(3){margin-left: -140px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(4){margin-left: 100px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(5){margin-left: 150px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(6){margin-left: 140px;} /* 윈도우 (width:420px) 병원마케팅 */ @media (max-width:420px){ /* 500px 이하 부가 설명 위치 */ #mkit_marketing .market_txt_wrap .market_list_wrap{position: absolute;top: 0;left: 0; width: 100%;height: 100%;margin-top: -60px;} #mkit_marketing .market_txt_wrap .market_list_wrap li{position: absolute;top: 0;left: 50%;transform: translateX(-50%); width: 100%;line-height: 40px;max-width: 100px;color: #FFF;padding: 0;border-radius: 0;text-align: center;transition-duration: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li{opacity: 0;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li{opacity: 1;transition-delay: .7s;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(1){margin: 0 0 0 -120px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(2){margin: 60px 0 0 -170px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(3){margin: 120px 0 0 -160px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(4){margin: 0 0 0 120px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(5){margin: 60px 0 0 170px;} #mkit_marketing .market_txt_wrap .txt_box .market_list_wrap li:nth-of-type(6){margin: 120px 0 0 160px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(1){margin-left: -70px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(2){margin-left: -120px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(3){margin-left: -110px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(4){margin-left: 70px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(5){margin-left: 120px;} #mkit_marketing .market_txt_wrap .txt_box.active .market_list_wrap li:nth-of-type(6){margin-left: 110px;} #mkit_marketing .market_txt_wrap .txt_box:nth-of-type(1) .market_list_wrap .market_tit{color: #e39595;background-color: rgba(0,0,0,0);} #mkit_marketing .market_txt_wrap .txt_box:nth-of-type(2) .market_list_wrap .market_tit{color: #82a7d0;background-color: rgba(0,0,0,0);} #mkit_marketing .market_txt_wrap .txt_box:nth-of-type(3) .market_list_wrap .market_tit{color: #70a194;background-color: rgba(0,0,0,0);} } } /* ---------------------------------------- ★엠킷 병원마케팅 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 무료진단 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 무료진단 */ #mkit_diagnosis{margin:0 auto;padding:0 0 5em 0;background:#f7faff;} #mkit_diagnosis .diagnosis_list{position:relative;max-width:1200px;} #mkit_diagnosis .diagnosis_list_fix{transform:translate3d(0px,0px,0px) !important;} #mkit_diagnosis .diagnosis_list>li{overflow:hidden;position:relative;width:380px !important;height:440px;background:#fff;margin-right:30px;padding: 0 20px;} #mkit_diagnosis .diagnosis_list>li:last-child{margin-right:0;} #mkit_diagnosis .diagnosis_list>li .list_top{padding:30px 0 15px;} #mkit_diagnosis .diagnosis_list>li .free_txt{padding:10px 20px;background-color: #4294f1;color:#FFF;position: absolute;top: 0;left: 0;line-height: 1.2em;transition-duration: .7s;} #mkit_diagnosis .diagnosis_list>li.on .free_txt{background-color: #006ff2;} #mkit_diagnosis .diagnosis_list>li .list_img_box{display:flex;width:100%;padding:0 20px;justify-content:center;flex-wrap: wrap;} #mkit_diagnosis .diagnosis_list>li .list_img_box li{position: relative; margin-left: 20px;z-index: 1;} #mkit_diagnosis .diagnosis_list>li .list_img_box li img{display: block;opacity: 1;transition-duration: .4s;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.active img{opacity: 0;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.ml_none{margin-left: 0;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.mt_on{margin-top:20px;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.mr_on{margin-right: 20px;} /* 공통 백그라운드 이미지 */ #mkit_diagnosis .diagnosis_list>li .list_img_box li::after{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-position: top center;background-repeat: no-repeat;z-index: -1;opacity: 0;transition-duration: .4s;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.active::after{opacity: 1;} /* 이미지 사이즈 */ #mkit_diagnosis .diagnosis_list>li .list_img_box li.size_type1 img{height: 36px;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.size_type2 img{height: 36px;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.size_type3 img{height: 50px;} /* 백그라운드 사이즈 */ #mkit_diagnosis .diagnosis_list>li .list_img_box li.size_type1::after{background-size: 84px 36px;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.size_type2::after{background-size: 36px 36px;} #mkit_diagnosis .diagnosis_list>li .list_img_box li.size_type3::after{background-size: 52px 50px;} /* 마우스 오버 시 각 백그라운드 이미지 */ #mkit_diagnosis .diagnosis_list>li .list_img_box1 li:nth-of-type(1)::after{background-image: url(../img/list1_logo_1.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box1 li:nth-of-type(2)::after{background-image: url(../img/list1_logo_2.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box1 li:nth-of-type(3)::after{background-image: url(../img/list1_logo_3.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box1 li:nth-of-type(4)::after{background-image: url(../img/list1_logo_4.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box1 li:nth-of-type(5)::after{background-image: url(../img/list1_logo_5.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(1)::after{background-image: url(../img/list2_logo_1.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(2)::after{background-image: url(../img/list2_logo_2.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(3)::after{background-image: url(../img/list2_logo_3.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(4)::after{background-image: url(../img/list2_logo_4.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(5)::after{background-image: url(../img/list2_logo_5.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(6)::after{background-image: url(../img/list2_logo_6.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(7)::after{background-image: url(../img/list2_logo_7.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(8)::after{background-image: url(../img/list2_logo_8.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(9)::after{background-image: url(../img/list2_logo_9.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box2 li:nth-of-type(10)::after{background-image: url(../img/list2_logo_10.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(1)::after{background-image: url(../img/list_icon1.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(2)::after{background-image: url(../img/list_icon2.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(3)::after{background-image: url(../img/list_icon3.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(4)::after{background-image: url(../img/list_icon4.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(5)::after{background-image: url(../img/list_icon5.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(6)::after{background-image: url(../img/list_icon6.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(7)::after{background-image: url(../img/list_icon7.png);} #mkit_diagnosis .diagnosis_list>li .list_img_box3 li:nth-of-type(8)::after{background-image: url(../img/list_icon8.png);} #mkit_diagnosis .diagnosis_list>li .list_btn{display:block;position:absolute;bottom:25px;left:50%;width:160px;height:44px;transform:translateX(-50%);border-radius:22px;line-height:44px;background-color:#333;transition-duration: .7s;} #mkit_diagnosis .diagnosis_list>li.on .list_btn{background-color: #000;} #mkit_diagnosis .diagnosis_list>li .list_btn img{margin:-3px 0 0 3px;vertical-align:middle;} #mkit_diagnosis .diagnosis-pager{display:none;text-align:center;margin-top:20px;} #mkit_diagnosis .diagnosis-pager .swiper-pagination-bullet{margin:0 2px !important;padding:20px 60px;border-radius:4px;} #mkit_diagnosis .diagnosis-pager .swiper-pagination-bullet{position:relative;} #mkit_diagnosis .diagnosis-pager .swiper-pagination-bullet:nth-of-type(1){padding:20px 40px;} #mkit_diagnosis .diagnosis-pager .swiper-pagination-bullet:nth-of-type(2){padding:20px 40px;} #mkit_diagnosis .diagnosis-pager span::before{display:block;position:absolute;top:50%;left:50%;color:#FFF;white-space:nowrap;transform:translate(-50%,-50%);font-size:12px;} #mkit_diagnosis .diagnosis-pager span:nth-of-type(1)::before{content:'온라인 광고';} #mkit_diagnosis .diagnosis-pager span:nth-of-type(2)::before{content:'모바일 광고';} #mkit_diagnosis .diagnosis-pager span:nth-of-type(3)::before{content:'오프라인 매체 광고';} #mkit_diagnosis .diagnosis-pager .swiper-pagination-bullet-active{background-color:#006ff2;} /* 윈도우 (width:1420px) 무료진단 */ @media (max-width:1420px){ #mkit_diagnosis{width:100%;} #mkit_diagnosis .diagnosis_list{width:1200px !important;} } /* 윈도우 (width:1200px) 무료진단 */ @media (max-width:1200px){ #mkit_diagnosis .diagnosis-pager{display:block;} } /* 윈도우 (width:1000px) 무료진단 */ @media (max-width:1000px){ #mkit_diagnosis .diagnosis_list>li{width:30% !important;height:430px;} #mkit_diagnosis .diagnosis_list>li .list_img_box li{margin-left: 10px;} } /* 윈도우 (width:768px) 무료진단 */ @media (max-width:768px){ #mkit_diagnosis .diagnosis_list>li .list_img_box{padding: 0;} #mkit_diagnosis .diagnosis_list>li{width:26% !important;height:400px;margin:0 10px 0;} #mkit_diagnosis .diagnosis_list>li:last-child{margin-right:10px;} #mkit_diagnosis .diagnosis_list>li.swiper-slide-active .free_txt{background-color: #006ff2;} #mkit_diagnosis .diagnosis_list>li.swiper-slide-active .list_btn{background-color: #000;} #mkit_diagnosis .diagnosis_list>li.swiper-slide-active .list_img_box li img{opacity: 0;} #mkit_diagnosis .diagnosis_list>li.swiper-slide-active .list_img_box li::after{opacity: 1;} } /* ---------------------------------------- ★엠킷 무료진단 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 미드배너 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 미드배너 */ #mkit_mid_banner{position: relative;padding: 120px 0;background:url('../img/mid_banner_bg.png') center no-repeat;background-size: cover;} /* 윈도우 (width:1420px) 미드배너 */ @media (max-width:1420px){ #mkit_mid_banner{padding: 100px 0;} } /* 윈도우 (width:1200px) 미드배너 */ @media (max-width:1200px){ #mkit_mid_banner{padding: 80px 0;} } /* 윈도우 (width:768px) 미드배너 */ @media (max-width:768px){ #mkit_mid_banner{position: relative;background:url('../img/mid_banner_bg.png') center no-repeat;} } /* ---------------------------------------- ★엠킷 미드배너 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 마케팅매니저(탭 배너) Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 마케팅매니저(탭 배너) */ #mkit_youtube{overflow:hidden;position:relative;background-color:#f7faff;padding-top:120px;} /* 탭버튼 */ .mediaSwiper{position:relative;width:1200px;margin-left:auto;margin-right:auto;} .mediaSwiper ul{justify-content:center;} .mediaSwiper ul li{width:auto !important;padding:0 30px;text-align:center;cursor:pointer;} .mediaSwiper ul li.active a{color:#006ff2;font-weight:bold;font-weight:700;} .mediaSwiper ul li a{display:block;width:100%;color:#999;font-weight:400;} #mkit_youtube .banner_con{ display: flex;position: relative;width: 100%;margin: 0 auto;max-width: 1200px;flex-wrap: wrap;transition-duration: .4s;} #mkit_youtube .banner_con .con_w{overflow: hidden;position: relative; width: 50%;background-color: #FFF;} .youtube_box .txt_box li{position:relative;padding-left:10px;} .youtube_box .txt_box li::before{display:block;position:absolute;top:50%;left:0;width:4px;height:4px;content:'';background-color:#006ff2;border-radius:50%;transform:translateY(-50%);} .youtube_box .txt_box li:first-child{padding-left:0;} .youtube_box .txt_box li:first-child:before{display:none;} /* 키워드 모션 */ .keyword_con .img_bg{position: absolute;top: 0;left: 0;z-index: 10;width: 100%;} .keyword_con ul li img{position: relative;z-index: -1;} /* 바이럴 모션 */ .viral_con{position: relative;} .viral_con .img_bg{position: absolute;top: 0;left: 0;z-index: 10;width: 100%;} .viral_con ul li img{z-index: -1;} /* 앱 모션 */ .app_con{position: relative;} .app_con .app_wrap{position: relative;margin: 85px 15px;} .app_con .app_wrap .app_box{display: flex;justify-content: center;margin-bottom: 2%;} .app_con .app_wrap .app_box:last-child{margin-bottom: 0;} .app_con .app_wrap .app_box li{overflow: hidden;position: relative;width: 23.5%;height: 23.5%; border: 2px solid #000;border-radius: 15px;background-color: #FFF;margin-left: 2%;box-shadow: 3px 3px 7px rgba(0,0,0,0.15);} .app_con .app_wrap .app_box li:first-child{margin-left: 0;} /* 보도자료 모션 */ .news_con{position: relative;padding: 0;} .news_con .img_logo{position: absolute;left: 50%; bottom: 30px;transform: translateX(-50%);} .news_con .swiper-slide-shadow{background:none !important;} /* 홈페이지 모션 */ /* .homepage_con{position: relative;padding: 90px 20px;} .homepage_con .homepage_show{overflow: hidden;position: relative; margin: 0 auto 20px;} .homepage_con .homepage_list{display: flex;} .homepage_con .homepage_list li{position: relative; width: 23.5%;border: none;margin-left: 2%; cursor: pointer;opacity: .5;} .homepage_con .homepage_list li:hover{opacity: 1;} .homepage_con .homepage_list li.active{border: 2px solid #F00;opacity: 1;} .homepage_con .homepage_list li:first-child{margin-left: 0;} */ /* 영상 모션 */ .media_con{position: relative;} .media_con .swiper-slide{padding:140px 20px;} .media_con .swiper-slide .media_show{position: relative; overflow: hidden;} .media_con .swiper-slide .media_show video{width: 100%;} /* 디자인 모션 */ .design_con{position: relative;} .design_con .design_wrap{position: relative;} .design_con .design_wrap .design_box{display: flex;flex-wrap: wrap;justify-content: center;} .design_con .design_wrap .design_box li{width: 25%;height: 25%;} /* 오프라인매체 모션 */ .offad_con{position: relative;} .offad_con .offad_wrap{position: relative;height: 100%;} .offad_con .offad_wrap .offad_box{position: relative;height: 100%;padding: 40px;} .offad_con .offad_wrap .offad_box::after{display: block;clear: both;content: '';} .offad_con .offad_wrap .offad_box li{float: left;margin: 0 2% 2% 0; border: 1px solid #333;} .offad_con .offad_wrap .offad_box li:nth-of-type(1){width: 100%;height: 47.5%;margin-right: 0;} .offad_con .offad_wrap .offad_box li:nth-of-type(2){width: 29%;height: 50%;margin-bottom: 0;} .offad_con .offad_wrap .offad_box li:nth-of-type(3){width: 33%;height: 35%;} .offad_con .offad_wrap .offad_box li:nth-of-type(4){width: 34%;height: 35%;margin-right: 0;} .offad_con .offad_wrap .offad_box li:nth-of-type(5){width: 69%;height: 13%;margin: 0;} /* 마케팅 설명 */ .explan{position:relative;padding:110px 0;} .explan>li{display:flex;} .explan>li:nth-of-type(2){text-align:right;flex-direction:row-reverse;} .explan>li:nth-of-type(2) .txt_box{margin:70px 30px 0 0;} .explan>li .txt_box{margin:70px 0 0 30px;} .explan .thumb{overflow:hidden;width:290px;height:290px;border-radius:50%;} /* 마케팅매니저(탭 배너) 애니메이트 */ .video_con{width: 100%; outline: none !important;border: none !important;} .tap_app_motion{ animation: tap_app_motion 0.8s /* 속도 */ ease 0s /* */ } .tap_app_motion2{ animation: tap_app_motion2 0.8s /* 속도 */ ease 0s /* */ } @keyframes tap_app_motion { 0% {top: 30px;} /* 처음 위치 */ 100% {top: 0px;} /* 마지막 위치 */ } @keyframes tap_app_motion2 { 0% {top: -30px;} /* 처음 위치 */ 100% {top: 0px;} /* 마지막 위치 */ } .tap_design_motion{ animation: tap_design_motion 0.6s /* 속도 */ ease 0s /* */ } @keyframes tap_design_motion { 0% {transform: scale(0)} /* 처음 위치 */ 100% {transform: scale(1)} /* 마지막 위치 */ } .tap_motion_right{ animation: tap_motion_right 0.8s /* 속도 */ ease 0s /* */ } @keyframes tap_motion_right { 0% {margin-top: -70px;} /* 처음 위치 */ 100% {margin-top: 0px;} /* 마지막 위치 */ } .tap_motion_left{ animation: tap_motion_left 0.5s /* 속도 */ ease 0s /* */ } @keyframes tap_motion_left { 0% {opacity: 0.5;} 100% {opacity: 1;} } /* 윈도우 (width:1420px) 마케팅매니저(탭 배너) */ @media (max-width:1420px){ .mediaSwiper ul li{width:auto;padding:0 30px;} } /* 윈도우 (width:1200px) 마케팅매니저(탭 배너) */ @media (max-width:1200px){ .mediaSwiper{width:900px;} .mediaSwiper ul li{width:auto;padding:0 20px;} .youtube_box{position:relative;width:950px;margin:0 auto;} #mkit_youtube .banner_con{max-width: 950px;} } /* 윈도우 (width:1000px) 마케팅매니저(탭 배너) */ @media (max-width:1000px){ #mkit_youtube{position:relative;background-color:#F7F8FF;padding-top:80px;} .mediaSwiper{width:730px;} .mediaSwiper ul li{width:auto;padding:0 15px;} .youtube_box{position:relative;width:730px;margin:0 auto;} #mkit_youtube .banner_con{max-width: 600px;} #mkit_youtube .banner_con .con_w{width: 100%;} .explan{position:relative;padding:80px 0;} .explan>li{display:flex;justify-content:center;} .explan>li:nth-of-type(2){text-align:right;flex-direction:row-reverse;} .explan>li:nth-of-type(2) .txt_box{margin:30px 30px 0 0;} .explan>li .txt_box{width:50%;margin:30px 0 0 30px;} .explan .thumb{overflow:hidden;width:270px;height:270px;border-radius:50%;} .explan .thumb img{width:100%;} } /* 윈도우 (width:768px) 마케팅매니저(탭 배너) */ @media (max-width:768px){ #mkit_youtube{position:relative;background-color:#F7F8FF;padding-top:80px;} .mediaSwiper{width:90%;margin-top:30px;} .mediaSwiper ul{justify-content:left;} .mediaSwiper ul li{width:auto;padding:10px 15px;margin-top:10px;font-size:13px;} .mediaSwiper ul li.active{border:1px solid #006ff2;background-color:#006ff2;} .mediaSwiper ul li.active a{color:#FFF;font-weight:bold;font-weight:700;} .mediaSwiper ul li{height:42px;border:1px solid #DDD;background-color:none;margin-right:5px;border-radius:21px;} .mediaSwiper ul li a{display:block;width:100%;color:#999;font-weight:400;} .youtube_box{position:relative;width:94%;margin:0 auto;} #mkit_youtube .banner_con{width: 94%; max-width: none;} .explan{position:relative;padding:30px 0;} .explan>li{display:flex;height:180px;text-align:left !important;align-items:center;} .explan>li:nth-of-type(2){flex-direction:row;} .explan>li .txt_box{width:65%;margin:0 0 0 20px !important;} .explan .thumb{overflow:hidden;width:120px;height:120px;margin:0 auto;border-radius:50%;} /* 영상 모션 */ .media_con .swiper-slide{padding:40px 10px 60px;} } /* 윈도우 (width:420px) 마케팅매니저(탭 배너) */ @media (max-width:420px){ .explan .thumb{overflow:hidden;width:80px;height:80px;margin:0 auto;border-radius:50%;} } /* ---------------------------------------- ★엠킷 마케팅매니저(탭 배너) End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 플랜 선택 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 플랜 선택 */ .price_list>li:nth-of-type(1).on::before{background-color: #ff7348;} .price_list>li:nth-of-type(2).on::before{background-color: #01c8d5;} .price_list>li:nth-of-type(3).on::before{background-color: #8176ff;} .plan_mkit_col{color: #ff7348;} .plan_plus_col{color: #01c8d5;} .plan_mega_col{color: #8176ff;} .plan_mkit_bg_col{background-color: #ff7348;} .plan_plus_bg_col{background-color: #01c8d5;} .plan_mega_bg_col{background-color: #8176ff;} /* #mkit_price .price_list li>h3{background-color: #e4e4e4;transition-duration: .7s;} #mkit_price .price_list li.on>h3{background-color: #006ff2;} */ .price_stit span{position:relative;color:#222;font-size:18px !important;font-weight:700;} .price_txt_btn{display:none;} .price_keyword{display:flex;justify-content:center;} .price_keyword>li{padding:3px 10px;border: 1px solid #006ff2;color: #006ff2;margin-left:4px;border-radius: 4px;} .price_keyword>li:first-child{margin-left:0;} .price_list{display:flex;justify-content:space-evenly;} .price_list>li{display:flex;position:relative;top:0;width:380px;height:auto;padding:35px 25px 25px;border:1px solid #e4e4e4;flex-wrap:wrap;flex-direction: column; margin-left:30px;transition-duration:.4s;} .price_list>li>h3{width: 100%;color:#FFF;text-align: center;line-height: 2em;max-height: 60px;} .price_list>li form{width: 100%;} .price_list>li::before{display:block;position:absolute;top:0;left:50%;z-index: 1;width:0;height:5px;content:'';transform:translateX(-50%);background-color:#e4e4e4;transition-duration:.7s;} .price_list>li.on::before{width: 100%;} .price_list>li::after{display:block;position:absolute;top:0;left:50%;width:100%;height:5px;content:'';transform:translateX(-50%);background-color:#e4e4e4;} .price_list>li.on{top:-10px;box-shadow:2px 2px 10px 0px rgba(0,0,0,0.1);} .price_list>li:first-child{margin-left:0;} .price_list .m_price_txt{display:none;} .price_list .price_txt{position:relative;width:100%;height:auto;padding-bottom: 10px;} .price_list .price_txt>li{position:relative;margin-bottom:4px;} .price_list .price_txt>li.break{display: block;} .price_list_txt{height:80px;margin-left: auto;margin-right: 5px;} .price_box{display: flex;justify-content:flex-end;align-items: flex-end;margin-top:20px;line-height:30px;} .price_box>p{font-family: 'NanumSquare';} .price_btn{display:block;height:44px;margin:auto auto 0;line-height:44px;border-radius: 22px; background-color:#000;transition-duration:.4s;} .price_btn img{margin:-3px 0 0 3px;vertical-align:middle;} .price_list .add_box{display:none;position:absolute;top:50px;right:-50px;z-index:10;width:100%;padding:20px 15px;border:1px solid #999;background-color:#FFF;} .price_list .add_box::before{display:block;position:absolute;top:0;left:50%;z-index:1;width:24px;height:14px;content:'';background-color:#FFF;margin-left: -12px;} .price_list .add_box::after{display:block;position:absolute;top:-7px;left:50%;width:14px;height:14px;border:1px solid #999;content:'';background-color:#FFF;transform:rotate(45deg);margin-left: -7px;} .price_list .add_box .price_txt{height:auto;} .price_list .add_box .price_txt .price_stit{font-weight:700;} .price_list .m_add_box{display:none;position:absolute;top:50px;right:0;z-index:10;width:90%;padding:15px 10px;border:1px solid #999;background-color:#FFF;} .price_list .m_add_box::before{display:block;position:absolute;top:0;left:0;z-index:1;width:24px;height:14px;content:'';background-color:#FFF;margin-left: 17px;} .price_list .m_add_box::after{display:block;position:absolute;top:-7px;left:0;width:14px;height:14px;border:1px solid #999;content:'';background-color:#FFF;transform:rotate(45deg);margin-left: 22px;} .price_list .m_add_box .price_txt{display: block;height:auto;} .price_list .m_add_box .price_txt .price_stit{font-weight:700;} /* 윈도우 (width:1420px) 플랜 선택 */ @media (max-width:1420px){ .price_list{display:flex;margin:0 auto;justify-content:center;} .price_list>li{display:flex;width:350px;height:auto;padding:35px 25px 25px;border:1px solid #e4e4e4;flex-wrap:wrap;margin-left:20px;} .price_list>li:first-child{margin-left:0;} .price_list>li>h3{line-height: 45px;height: 45px;} .price_list .price_list_txt{margin:auto 0 0 auto;} .price_box{display: flex;align-items: flex-end;line-height: ;} .price_box>p{font-family: 'NanumSquare';} .price_btn{display:block;height:44px;margin:auto auto 0;line-height:44px;} } /* 윈도우 (width:1200px) 플랜 선택 */ @media (max-width:1200px){ .price_list{display:flex;margin:0 auto;justify-content:center;} .price_list>li{display:flex;width:300px;height:auto;padding:35px 25px 25px;border:1px solid #e4e4e4;flex-wrap:wrap;margin-left:20px;} .price_list>li:first-child{margin-left:0;} .price_list form{width:100%;} .price_list form a{width:100%;} .price_list .price_list_txt{margin:auto 0 0 auto;} .price_btn{display:block;height:44px;margin:auto auto 0;line-height:44px;} .price_list_txt{height:100px;} } /* 윈도우 (width:1000px) 플랜 선택 */ @media (max-width:1000px){ .price_list{display:flex;margin:0 auto;justify-content:space-evenly;flex-wrap:nowrap;} .price_list>li{display:flex;width:31%;height:auto;padding:25px 15px 15px;border:1px solid #e4e4e4;flex-wrap:wrap;margin-left:1% !important;min-width: 235px;} .price_list>li:first-child{margin-left:0 !important;} .price_list .price_txt{width:100%;} .price_list .price_list_txt{width:100%;margin:auto 0 0 auto;} .price_list .add_box{right:-30px;} .price_list .add_box::after{margin-left: -50px;} .price_list .add_box::before{margin-left: -55px;} .price_box{display: flex;justify-content: right;align-items: flex-end;line-height: ;} .price_box>p{font-family: 'NanumSquare';} .price_btn{display:block;height:44px;margin:auto auto 0;line-height:44px;} /* 보도자료 모션 */ .news_con{padding: 0px 0 200px;} } /* 윈도우 (width:768px) 플랜 선택 */ @media (max-width:768px){ #mkit_price h2{letter-spacing:-0.06em;} .price_keyword{display:none;} .price_list{display:flex;margin:0 auto;justify-content:space-evenly;flex-wrap:wrap;} .price_list>li{display:flex;width:94%;height:auto;margin:30px auto 0 !important;padding:35px 25px 25px;border:1px solid #e4e4e4;flex-wrap:wrap;} .price_list>li.on{top: 0;box-shadow: none;} .price_list>li.active{box-shadow:2px 2px 10px 0px rgba(0,0,0,0.1);} .price_list>li:nth-of-type(1).on::before{background-color: #e4e4e4;} .price_list>li:nth-of-type(2).on::before{background-color: #e4e4e4;} .price_list>li:nth-of-type(3).on::before{background-color: #e4e4e4;} .price_list>li:nth-of-type(1).active::before{background-color: #ff7348;} .price_list>li:nth-of-type(2).active::before{background-color: #01c8d5;} .price_list>li:nth-of-type(3).active::before{background-color: #8176ff;} .price_list>li>h3{} .price_list>li::before{display:block;position:absolute;top:0;left:50%;z-index: 1;width:100%;height:5px;content:'';transform:translateX(-50%);background-color:#e4e4e4;transition-duration:.6s;} .price_list>li::after{display:block;position:absolute;top:0;left:50%;width:100%;height:5px;content:'';transform:translateX(-50%);} .price_list>li.active::before{background-color: rgba(0,0,0,0);} .price_list>li:hover{top:0;} .price_list>li:first-child{margin:0 auto !important;} .price_txt_btn{display:block;position:absolute;top:42px;right:38px;} .price_list .price_txt{display:none;} .price_list .m_price_txt>li.break{display: none;} .price_list .m_price_txt{display: none;position:relative;width:100%;height:auto;} .price_list>li.active .m_price_txt{display: block;} .price_list .m_price_txt>li{position:relative;margin-bottom:4px;} .price_list .price_list_txt{margin:auto 0 0 auto;} .price_list .price_list_txt{margin-bottom:10px;height:auto;} .price_box{} .price_box>p{font-family: 'NanumSquare';} .price_btn{display:block;height:44px;margin:auto auto 0;line-height:44px;} /* 보도자료 모션 */ .news_con{padding: 0px 0 35vw;} } /* ---------------------------------------- ★엠킷 플랜 선택 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 문의접수 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 문의접수 선택 */ #mkit_ask{position:relative;height:280px;padding:40px 100px;background-color:#f8f8f8;background-image:url(../img/ask_bg.png);background-repeat:no-repeat;background-position:right bottom;} .btn_box{display:flex;} .btn_box>a img{margin:-3px 0 0 10px;vertical-align:middle;} .btn_box>button {padding:0px;border-width:0px;} .btn_box>button img{margin:-3px 0 0 10px;vertical-align:middle;} .ask_btn{display:block;width:160px;height:44px;background-color:#006ff2;border-radius:22px;line-height:44px;margin-right:10px;} .ask_btn img{margin:-3px 0 0 3px;vertical-align:middle;} .faq_btn{display: block;width: 160px;height: 44px;border: 1px solid #555; border-radius: 22px;line-height: 44px;background-color: #f4f4f4;} .faq_btn img{margin:-3px 0 0 3px !important;vertical-align:middle;} /* 윈도우 (width:1200px) 문의접수 */ @media (max-width:1200px){ #mkit_ask{position:relative;height:280px;padding:40px 100px;background-color:#f4f4f4;background-image:url(../img/ask_bg.png);background-repeat:no-repeat;background-position:right bottom;background-size:65%;} .btn_box{display:flex;} .btn_box>a img{margin:-3px 0 0 10px;vertical-align:middle;} .ask_btn{display:block;width:160px;height:44px;border-radius:22px;line-height:44px;margin-right:10px;} .faq_btn{display: block;width: 160px;height: 44px;border: 1px solid #555; border-radius: 22px;line-height: 44px;} } /* 윈도우 (width:1000px) 문의접수 */ @media (max-width:1000px){ #mkit_ask{position:relative;height:400px;padding:40px 0;text-align:center;background-color:#f4f4f4;background-image:url(../img/ask_bg.png);background-repeat:no-repeat;background-position:center bottom;background-size:550px;} .btn_box{display:flex;width:350px;margin:0 auto;justify-content:center;} .btn_box>a img{margin:-3px 0 0 10px;vertical-align:middle;} .ask_btn{display:block;width:160px;height:44px;border-radius:22px;line-height:44px;margin-right:10px;} .faq_btn{display: block;width: 160px;height: 44px;border: 1px solid #555; border-radius: 22px;line-height: 44px;} } /* 윈도우 (width:768px) 문의접수 */ @media (max-width:768px){ #mkit_ask{position:relative;height:350px;padding:40px 0;text-align:center;background-color:#f4f4f4;background-image:url(../img/ask_bg.png);background-repeat:no-repeat;background-position:center bottom;background-size:350px;} .btn_box{display:flex;width:300px;margin:0 auto;justify-content:center;} .btn_box>a img{margin:-3px 0 0 10px;vertical-align:middle;} .ask_btn{display:block;width:120px;height:44px;border-radius:22px;line-height:44px;margin-right:10px;} .faq_btn{display: block;width: 120px;height: 44px;border: 1px solid #555; border-radius: 22px;line-height: 44px;} } /* ---------------------------------------- ★엠킷 문의접수 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 푸터 배너 Start ---------------------------------------- */ #mkit_ft_banner{position: relative;padding: 20px;border-top: 1px solid #e0e0e0;} /* ---------------------------------------- ★엠킷 푸터 배너 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 공통 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 공통 */ /* 너비 */ .w1200{width:1200px;margin-left:auto;margin-right: auto;} .w1420{width:1420px;margin-left:auto;margin-right: auto;} /* 색상 */ .C_white{color:#FFF;} .C_main{color:#006ff2;} .C_111{color:#000;} .C_111{color:#111;} .C_222{color:#222;} .C_333{color:#333;} .C_444{color:#444;} .C_555{color:#555;} .C_666{color:#666;} .C_777{color:#777;} .C_888{color:#888;} .C_999{color:#999;} .C_AAA{color:#AAA;} .C_BBB{color:#BBB;} .C_CCC{color:#CCC;} .C_DDD{color:#DDD;} .C_EEE{color:#EEE;} .BC_main{background-color:#006ff2;} /* 텍스트 정렬 */ .txt_C{text-align:center;} .txt_L{text-align:left;} .txt_R{text-align:right;} /* 폰트 사이즈 */ .fs12{font-size:12px;} .fs14{font-size:14px;} .fs15{font-size:15px;} .fs16{font-size:16px;} .fs18{font-size:18px;} .fs20{font-size:20px;} .fs22{font-size:22px;} .fs24{font-size:24px;} .fs26{font-size:26px;} .fs28{font-size:28px;} .fs32{font-size:32px;} .fs40{font-size:40px;} .fs48{font-size:48px;} .fs60{font-size:60px;} /* 폰트 두께 */ .fw_L{font-weight:300;} .fw_R{font-weight:400;} .fw_M{font-weight:500;} .fw_B{font-weight:700;} .fw_BB{font-weight:800;} /* 행간 */ .LH_26{line-height:26px;} .LH_28{line-height:28px;} /* 줄 나눔(모바일) */ .line_br{display:none !important;} /* 서브페이지 타이틀 */ .portfolio_tit{margin-top:190px;} /* 루미타이틀 수정 */ .rumiTitle .diagnosis_txt h3, .rumiTitle .plan_txt h3{line-height:1em;} .rumiTitle .diagnosis_txt span, .rumiTitle .plan_txt span{display: inline-block;padding: 2px 10px;vertical-align: 4px;} /* 윈도우 (width:1420px) 공통 */ @media (max-width:1420px){ .fs12{font-size:12px;} .fs14{font-size:13px;} .fs15{font-size:14px;} .fs16{font-size:15px;} .fs18{font-size:16px;} .fs20{font-size:18px;} .fs22{font-size:19px;} .fs24{font-size:20px;} .fs26{font-size:22px;} .fs28{font-size:24px;} .fs32{font-size:26px;} .fs40{font-size:30px;} .fs48{font-size:36px;} .fs60{font-size:48px;} .w1200{width:94%;} .w1420{width:94%;} } /* 윈도우 (width:1000px) 공통 */ @media (max-width:1000px){ .fs12{font-size:12px;} .fs14{font-size:12px;} .fs15{font-size:13px;} .fs16{font-size:14px;} .fs18{font-size:15px;} .fs20{font-size:16px;} .fs22{font-size:17px;} .fs24{font-size:18px;} .fs26{font-size:20px;} .fs28{font-size:22px;} .fs32{font-size:24px;} .fs40{font-size:28px;} .fs48{font-size:30px;} .fs60{font-size:42px;} } /* 윈도우 (width:768px) 공통 */ @media (max-width:768px){ .fs12{font-size:12px;} .fs14{font-size:12px;} .fs15{font-size:13px;} .fs16{font-size:14px;} .fs18{font-size:15px;} .fs20{font-size:16px;} .fs22{font-size:17px;} .fs24{font-size:18px;} .fs26{font-size:20px;} .fs28{font-size:20px;} .fs32{font-size:22px;} .fs40{font-size:26px;} .fs48{font-size:28px;} .fs60{font-size:30px;} .LH_26{line-height:18px;} .LH_28{line-height:20px;} .section_tit{line-height:36px;} .section_stit{line-height:28px;} .section_sub_tit{line-height:26px;} /* 서브페이지 타이틀 */ .portfolio_tit{margin-top:50px;} } /* 윈도우 (width:420px) 공통 */ @media (max-width:420px){ .line_br{display:block !important;} } /* ---------------------------------------- ★엠킷 공통 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 퀵메뉴 Start ---------------------------------------- */ /* 윈도우 (width:1420px 이상) 퀵메뉴 */ #quick_wrap{position:fixed;right:20px;bottom:20px;z-index:999;} #m_quick_btn{display:block;position:relative;bottom:-80px;width:70px;height:70px;border-radius:50%;background-color:#333;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;} #m_quick_btn.active{display:block;bottom:0;} #m_quick_btn>a{display:block;position:relative;width:100%;height:100%;} #m_quick_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;display: block;transition-duration: .4s;} #m_top_btn{display:block;position:relative;bottom:-120px;width:70px;height:70px;margin-top:10px;border-radius:50%;background-color:#FFF;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;opacity:0;} #m_top_btn.active{display:block;bottom:0px;opacity:1;} #m_top_btn>a{display:block;position:relative;width:100%;height:100%;} #m_top_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_quick_btn .m_quick_menu{display:block;position:absolute;top:-420px;right:0;transition-duration:.7s;} #m_quick_btn .m_quick_menu.active{top:-470px;} #m_quick_btn .m_quick_menu>li{display:none;position:relative;width:200px;border:1px solid #e9e9e9;background-color:#FFF;border-radius:35px;box-shadow:0 4px 6px rgb(0 0 0 / 6%);margin-bottom:5px;} #m_quick_btn .m_quick_menu>li.quick_tit{border:none;background-color:#0a5ebe;} #m_quick_btn .m_quick_menu>li.quick_tit a{color:#FFF;} #m_quick_btn .m_quick_menu>li:last-child{margin-bottom:0;} #m_quick_btn .m_quick_menu>li a{display:block;width:100%;height:100%;padding:0 0 0 30px;line-height:50px;} #m_quick_btn .m_quick_menu>li a img{margin:-4px 10px 0 0;vertical-align:middle;width: 26px;} /* 윈도우 (width:1000px) 퀵메뉴 */ @media (max-width:1000px){ #quick_wrap{position:fixed;right:25px;bottom:40px;} #m_quick_btn{display:block;position:relative;bottom:-80px;width:60px;height:60px;border-radius:50%;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;} #m_quick_btn.active{display:block;bottom:0;} #m_quick_btn>a{display:block;position:relative;width:100%;height:100%;} #m_quick_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_top_btn{display:block;position:relative;bottom:-120px;width:60px;height:60px;margin-top:10px;border-radius:50%;background-color:#FFF;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;opacity:0;} #m_top_btn.active{display:block;bottom:0px;opacity:1;} #m_top_btn>a{display:block;position:relative;width:100%;height:100%;} #m_top_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_quick_btn .m_quick_menu{display:block;position:absolute;top:-320px;right:0;transition-duration:.5s;} #m_quick_btn .m_quick_menu.active{top:-490px;} #m_quick_btn .m_quick_menu>li{display:none;position:relative;width:190px;height:55px;border:1px solid #e9e9e9;background-color:#FFF;border-radius:35px;box-shadow:0 4px 6px rgb(0 0 0 / 6%);margin-bottom:5px;} #m_quick_btn .m_quick_menu>li:last-child{margin-bottom:0;} #m_quick_btn .m_quick_menu>li a{display:block;width:100%;height:100%;padding:0 30px;line-height:55px;} #m_quick_btn .m_quick_menu>li a img{margin:-4px 10px 0 0;vertical-align:middle;} } /* 윈도우 (width:768px) 퀵메뉴 */ @media (max-width:768px){ #quick_wrap{position:fixed;right:10px;bottom:40px;} #m_quick_btn{display:block;position:relative;bottom:-60px;width:30px;height:30px;border-radius:50%;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;} #m_quick_btn.active{display:block;bottom:-20px;} #m_quick_btn>a{display:block;position:relative;width:100%;height:100%;} #m_quick_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_top_btn{display:block;position:relative;bottom:-120px;width:30px;height:30px;margin-top:10px;border-radius:50%;background-color:#FFF;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;opacity:0;} #m_top_btn.active{display:block;bottom:-20px;opacity:1;} #m_top_btn>a{display:block;position:relative;width:100%;height:100%;} #m_top_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_quick_btn .m_quick_menu{display:block;position:absolute;top:-260px;right:0;transition-duration:.5s;} #m_quick_btn .m_quick_menu.active{top:-405px;} #m_quick_btn .m_quick_menu>li{display:none;position:relative;width:180px;height:45px;border:1px solid #e9e9e9;background-color:#FFF;border-radius:35px;box-shadow:0 4px 6px rgb(0 0 0 / 6%);margin-bottom:5px;} #m_quick_btn .m_quick_menu>li:last-child{margin-bottom:0;} #m_quick_btn .m_quick_menu>li a{display:block;width:100%;height:100%;padding:0 25px;line-height:45px;} #m_quick_btn .m_quick_menu>li a img{margin:-4px 10px 0 0;vertical-align:middle;} } /* 윈도우 (height:750px) 퀵메뉴 */ @media (max-height:750px){ #main_visual .container{max-width: 1400px;} #main_visual .slider .item .main_tit{position: relative;font-size: clamp(70px, 5vw, 60px);margin-bottom: 2.5vw;} #main_visual .slider .item .main_sub_tit{position: relative;top: 20px;opacity: 0;font-size: clamp(24px, 2vw, 32px);} #quick_wrap{position:fixed;right:20px;bottom:20px;} #m_quick_btn{display:block;position:relative;bottom:-40px;width:40px;height:40px;border-radius:50%;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;} #m_quick_btn.active{display:block;bottom:-0px;} #m_quick_btn>a{display:block;position:relative;width:100%;height:100%;} #m_quick_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_top_btn{display:block;position:relative;bottom:-120px;width:40px;height:40px;margin-top:10px;border-radius:50%;background-color:#FFF;box-shadow:0 4px 10px rgb(0 0 0 / 8%);transition-duration:.7s;opacity:0;} #m_top_btn.active{display:block;bottom:0px;opacity:1;} #m_top_btn>a{display:block;position:relative;width:100%;height:100%;} #m_top_btn>a img{position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;} #m_quick_btn .m_quick_menu{display:block;position:absolute;top:-260px;right:0;transition-duration:.5s;} #m_quick_btn .m_quick_menu.active{top:-270px;} #m_quick_btn .m_quick_menu>li{display:none;position:relative;width:130px;height:30px;border:1px solid #e9e9e9;background-color:#FFF;border-radius:35px;box-shadow:0 4px 6px rgb(0 0 0 / 6%);margin-bottom:3px;} #m_quick_btn .m_quick_menu>li:last-child{margin-bottom:0;} #m_quick_btn .m_quick_menu>li a{display:block;padding:0px 0 0 15px;font-size:12px;line-height:30px;} #m_quick_btn .m_quick_menu>li a img{margin:-4px 10px 0 0;vertical-align:middle;max-height:20px;} } /* ---------------------------------------- ★엠킷 퀵메뉴 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 팝업 모바일 스타일 Start ---------------------------------------- */ /* 윈도우 (width:768px) 팝업 */ @media (max-width:768px){ #hd_pops_1{position: fixed !important; top: 30px;left: 50% !important;transform: translateX(-50%); margin: 0 !important;width: 80% !important;min-width: 260px !important; max-width: 400px !important;} } /* ---------------------------------------- ★엠킷 팝업 모바일 스타일 End ---------------------------------------- */ /* ---------------------------------------- ★엠킷 (Content) ---------------------------------------- */ #content{margin-bottom:80px;} #content #s-title{padding:15px 0;text-align:center;margin-bottom:1em;border-bottom:1px solid #ebeceb;font-family:"Nanum Square";font-size:2em;} #content .container{max-width:1000px;} /* ---------------------------------------- ★엠킷 (Board) ---------------------------------------- */ .full_input { width:100%; } /* ---------------------------------------- ★엠킷 (Sub:Layout) ---------------------------------------- */ /* 서브 비주얼 */ .sub-visual{display:none;} /* 서브네비 2depth */ .snb{display:none;} .snb li{display:inline-block;list-style-type:none;} .snb li a{display:block;padding:15px;} .snb li.on a{color:#006ff2;font-weight:700;} .snb li.on:first-child a{background:#006ff2 top;color:#fff} /* 서브네비 3depth */ .ssnb{display:none;} .ssnb li{display:inline-block;} .ssnb li a{display:block;padding:15px;} /* 서브네비 location */ .s-location li{display:inline-block;} .s-location li a{display:block;padding:15px;} /* ---------------------------------------- ★엠킷 (Sub:Basic Setting) ---------------------------------------- */ /* _SUB_ 폰트설정 */ .sub h2,.sub h3,.sub h4,.sub h5{letter-spacing:-0.05em;font-weight:300;} .sub h2{font-size:60px;} .sub h3{font-size:40px;} .sub h4{font-size:35px;} .sub h5{font-size:1.6em;} .sub h6{font-size:1.2em;} .sub p{margin-bottom:5px;font-size:1.1em;} #bo_gall .gall_li_dim .gall_img::before{/*content: '로그인 후 이용하실 수 있습니다.';*/display: block; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);font-size: 16px;color: #FFF;z-index: 1;} #bo_gall .gall_li_dim .gall_img::after{content: '';display: block; position: absolute;top: 0;left: 0;width: 100%;height: 100%;/*background-color: rgba(0,0,0,0.8);*/} #bo_gall .gall_li_dim .gall_img img{filter: blur(3px);} #bo_gall .gall_li_dim .gall_img:hover img{filter: blur(2px);} /* 문의/진단/신청 팝업 UI 조정 */ .custom-tr{flex-wrap:wrap;} .custom-th{width: 100% !important;} .agree_input_wrap{text-align:center;} @media screen and (min-width:769px) { .custom-tr{flex-wrap:nowrap;} .custom-th{width: 14% !important;} .agree_input_wrap{text-align:left;} }