@charset "utf-8";
@import url("font.css");
/* style reset */

body {overflow-y: auto; overflow-x: hidden; position: relative; margin: 0; width:100%; color: #222; font-size: 16px; font-family:'Noto Sans KR', sans-serif; font-weight: 400; line-height: 26px; padding: 0 !important;}

.transparents-layer {display: none;}

button {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.btn {width: 180px; height: 68px; font-size: 22px; font-weight: 500;}
.btn2 {width: 110px; height: 48px; font-weight: 500;}
.btn3 {width: 80px; height: 34px; font-size: 14px; font-weight: 500;}
.btn4 {width: 150px; height: 42px; border-radius: 42px;}
.btn5 {width: 82px; height: 36px; font-size: 14px; font-weight: 500; border-radius: 36px;}
.btn_add {position: relative; width: 34px !important; height: 34px; border: 1px solid #888;}
.btn_add::after, .btn_add::before {content: ''; position: absolute; left: calc(50% - 10px); top: calc(50% - 1px); width: 20px; height: 2px; background-color: #444;}
.btn_add::before {transform: rotate(90deg);}
.btn_add.delete::before {transform: rotate(0);}
.btn_search {}
.btn_search .icon {position: relative; display: block; transform-origin: left top; width: 16px; height: 18px;}
.btn_search .icon::after, .btn_search .icon::before {content: ''; position: absolute;}
.btn_search .icon::after {left: 0; top: 0; width: 10px; height: 10px; border: 3px solid #666; border-radius: 100%;}
.btn_search .icon::before {right: -1px; bottom: 5px; width: 11px; height: 3px; background-color: #666; transform: rotate(49.2deg); border-radius: 3px;}
.btn_close {position: relative; width: 60px; height: 60px; display: flex; display:-webkit-flex; justify-content: center; align-items: center; background-color: #888;}
.btn_close .icon {position: relative; display: block; width: 22px; height: 22px;}
.btn_close .icon::after, .btn_close .icon::before {content: ''; position: absolute; left: -4px; top: 9px; width: 30px; height: 4px; background-color: #fff; border-radius: 4px;}
.btn_close .icon::after {transform: rotate(45deg);}
.btn_close .icon::before {transform: rotate(-45deg);}
.btn_more.bg_white6 {width: 280px; height: 68px; font-size: 20px; font-weight: 500;}
.btn_more.bg_white6 span {padding-right: 20px; background-repeat: no-repeat; background-position: right center; background-image: url('../../images/web/icon_arrow3.png');}


.bg_blue {color: #fff; background: linear-gradient( to right, #008ed7 10%, #004096 90%);}
.bg_blue:hover {background: linear-gradient( to right, #004096 0%, #004096 90%);}
.bg_blue2 {color: #fff; background-color: #008ed7;}
.bg_blue3 {color: #fff; background-color: #004096;}
.bg_white {color: #008ed7; border: 1px solid #008ed7; background-color: #fff;}
.bg_white2 {color: #444; border: 1px solid #d8d8d8;}
.bg_white3 {border: 1px solid #444;}
.bg_white4 {border: 1px solid #888;}
.bg_white5 {color: #666; border: 1px solid #666; background-color: #fff;}
.bg_white6 {color: #02973a; border: 1px solid #02973a; background-color: #fff;}
.bg_gray {color: #fff; background-color: #666;}
.bg_gray2 {color: #fff; background-color: #a8a8a8;}
.bg_gray3 {color: #fff; background-color: #888;}
.bg_gray4 {color: #444; background-color: #f8f8f8; border: 1px solid #d8d8d8;}
.bg_green {color: #fff; background-color: #02973a;}

.color_blue {color: #008ed7 !important;}
.color_blue2 {color: #004096 !important;}
.color_red {color: #ff0000 !important;}
.color_red2 {color: #ed1c24 !important;}
.color_green {color: #02973a !important;}
.color_green2 {color: #00a79d !important;}
.color_gray {color: #666 !important;}

.f_b {font-weight: 600 !important;}
.f_m {font-weight: 500 !important;}
.f_n {font-weight: 400 !important;}
.p_r {position: relative !important;}

.w_flex_only {display: flex !important; display:-webkit-flex;}
.m_flex_only {display: none !important; display:-webkit-none;}
.w_hidden {display: none !important;}
.m_hidden {display: block !important;}

u {text-underline-position: under;}

.padding0 {padding: 0 !important;}
.margin0 {margin: 0 !important;}
.mt60 {margin-top:60px !important}
.mt50 {margin-top:50px !important}
.mt40 {margin-top:40px !important}
.mt30 {margin-top:30px !important}
.mt20 {margin-top:20px !important}
.mt15 {margin-top:15px !important}
.mt10 {margin-top:10px !important}
.mt5 {margin-top:5px !important}
.mb2 {margin-bottom:2px !important}
.mb5 {margin-bottom:5px !important}
.mb10 {margin-bottom:10px !important}
.mb15 {margin-bottom:15px !important}
.mb20 {margin-bottom:20px !important}
.mb25 {margin-bottom:25px !important}
.mb30 {margin-bottom:30px !important}
.mb35 {margin-bottom:35px !important}
.mb40 {margin-bottom:40px !important}
.mb50 {margin-bottom:50px !important}
.mb55 {margin-bottom:55px !important}
.mb60 {margin-bottom:60px !important}
.mb65 {margin-bottom:65px !important}
.mb80 {margin-bottom:80px !important}
.mr5 {margin-right:5px !important}
.mr10 {margin-right:10px !important}
.mr15 {margin-right:15px !important}
.mr20 {margin-right:20px !important}
.mr25 {margin-right:25px !important}
.mr30 {margin-right:30px !important}
.mr35 {margin-right:35px !important}
.mr60 {margin-right:60px !important}
.ml5 {margin-left:5px !important}
.ml10 {margin-left:10px !important}
.ml20 {margin-left:20px !important}
.ml30 {margin-left:30px !important}
.pl10 {padding-left:10px !important}
.pl15 {padding-left:15px !important}
.pl20 {padding-left:20px !important}
.pl30 {padding-left:30px !important}
.pl40 {padding-left:40px !important}
.pl60 {padding-left:60px !important}
.pt10 {padding-top:10px !important}
.pt15 {padding-top:15px !important}
.pt20 {padding-top:20px !important}
.pt30 {padding-top:30px !important}
.pt33 {padding-top:33px !important}
.pt40 {padding-top:40px !important}
.pt50 {padding-top:50px !important}
.pb10 {padding-bottom:10px !important}
.pb40 {padding-bottom:40px !important}
.pr10 {padding-right: 10px !important}
.pr30 {padding-right: 30px !important}
.w50 {width: 50px !important;}
.w60 {width: 60px !important}
.w100 {width: 100px !important}
.w120 {width: 120px !important}
.w200 {width: 200px !important}
.w230 {width: 230px !important}
.w300 {width: 300px !important}
.w400 {width: 400px !important}
.w500 {width: 500px !important}
.w_25 {width: 25% !important}
.w_30 {width: 30% !important}
.w_35 {width: 35% !important}
.w_40 {width: 40% !important}
.w_45 {width: 45% !important}
.w_50 {width: 50% !important}
.w_60 {width: 60% !important}
.w_80 {width: 80% !important}
.w_100 {width: 100% !important}

.f_12 {font-size: 12px !important;} 
.f_13 {font-size: 13px !important;} 
.f_14 {font-size: 14px !important;} 
.f_18 {font-size: 18px !important;} 

.al {text-align: left !important;}
.ac {text-align: center!important;}
.ar {text-align: right!important;}
.vt {vertical-align: top!important;}
.vm {vertical-align: middle!important;}
.vb {vertical-align: bottom!important;}

.cl_bo {clear: both !important;}
.f_left {float: left !important;}
.f_right {float: right !important;}
.over_h {overflow: hidden !important;}
.wb_keep {word-break: keep-all !important;}

dl.skipnavi {position:relative;z-index: 500;}
dl.skipnavi dt {display:none}
dl.skipnavi dd a {position:absolute; left:0; top:-50px; font-size:0}
dl.skipnavi dd a:active, dl.skipnavi dd a:focus {display:block; left:0; top:0; z-index:51; width:400px; height:30px; padding-top:9px; text-align:center; background:#333; line-height:14px; text-decoration:none; color:#fff; font-size:12px; font-weight:bold}

/*서브공통*/
h4.h4 {position: relative; margin-bottom: 15px; padding-left: 22px; font-size: 16px; font-weight: 500;}
h4.h4::after {content: ''; position: absolute; left: 10px; top: 12px; width: 3px; height: 3px; background-color: #222; border-radius: 100%;}
.board_title {margin-bottom: 20px;}
.board_title h3 {font-size: 22px;}
.div_box {margin-bottom: 60px;}
.div_box:last-child {margin-bottom: 0;}
.list_type {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items: center;}
.list_type > li {position: relative; margin-right: 50px; padding-right: 50px; color: #666; font-size: 14px;}
.list_type > li::after {content: ''; position: absolute; right: 0; top: calc(50% - 8px); width: 1px; height: 16px; background-color: #888;}
.list_type > li:last-child {margin-right: 0 !important; padding-right: 0 !important;}
.list_type > li:last-child::after {display: none;}
.list_type2 > dl {position: relative; padding-left: 18px; display: flex; display:-webkit-flex;}
.list_type2 > dl:nth-child(2n) {}
.list_type2 > dl::after {content: ''; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; background-color: #004096; border-radius: 100%;}
.list_type2 > dl dt {width: 90px; flex: none; font-weight: 500; word-break: keep-all;}
.list_type2 > dl dd {width: 100%;}
.list_type3 > li {position: relative; padding-left: 17px;}
.list_type3 > li::after {content: ''; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; background-color: #000; border-radius: 100%;}
.list_type4 > li {position: relative; padding-left: 10px; font-weight:bold; text-decoration:underline;}
.list_type4 > li::after {content: '-'; position: absolute; left: 0; top: -2px;}
.num_list {padding-left: 17px;}
.num_list > li {list-style: decimal;}
.num_list2 {counter-reset: num;}
.num_list2 > li {position: relative; padding-left: 20px;}
.num_list2 > li::before {content: counter(num); counter-increment: num 1; position: absolute; left: 0; top: 5px; width: 15px; height: 15px; font-size: 12px; line-height: 14px; text-align: center; border: 1px solid rgba(0, 0, 0, 0.5); border-radius: 100%;}
/*
.num_list {counter-reset: num;}
.num_list > li {position: relative; padding-left: 22px;}
.num_list > li::before {content: counter(num); counter-increment: num 1; position: absolute; left: 0; top: 5px; width: 15px; height: 15px; font-size: 9px; line-height: 14px; text-align: center; border: 1px solid rgba(0, 0, 0, 0.5); border-radius: 100%;}
.num_list {padding-left: 17px;}
.num_list > li {list-style: decimal;}
.num_list2 {counter-reset: num;}
.num_list2 > li {position: relative; padding-left: 20px;}
.num_list2 > li::before {content: counter(num) " )"; counter-increment: num 1; position: absolute; left: 0; width: 16px; font-size: 13px;}*/
.hangul {padding-left: 22px;}
.hangul > li {list-style: hangul;}
.box_type {}
.img_box {text-align: center;}
.img_box img {max-width: 100%;}
.agree_area {margin-bottom: 60px;}
.agree_area .agree_box {overflow-y: auto; padding: 10px 20px; margin-bottom: 10px; height: 300px; font-size: 14px; line-height: 20px; border: 1px solid #888;}
.agree_area .agree_box .div_box {margin-bottom: 20px;}
.agree_area .agree_box .div_box .num_list2 > li::before {top: 3px; width: 12px; height: 12px; font-size: 10px; line-height: 11px;}
.agree_area .agree_box .tablebasic table tr th {padding: 10px;}
.agree_area .agree_box .tablebasic table tr td {padding: 10px; text-align: left;}
.agree_area .check_box {justify-content: flex-end;}
.tabmenu {position: relative; margin-bottom: 40px;}
.tabmenu > button {display: none;}
.tabmenu > button .dropdown-label {}
.tabmenu .menu {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.tabmenu .menu li {margin: 10px 15px 10px 0;}
.tabmenu .menu li:last-child {margin: 10px 0;}
.tabmenu .menu li button {padding: 0 30px; min-width: 154px; height: 54px; color: #444; line-height: 18px; word-break: keep-all; border: 1px solid #dddddd; border-radius: 54px;}
.tabmenu .menu li.active button, .tabmenu .menu li button[data-selected="selected"] {color: #fff; font-weight: 500; border: 1px solid #02973a; background-color: #02973a;}
.tabmenu .menu.type2 {flex-wrap: initial; -webkit-flex-wrap:initial; justify-content: space-between;}
.tabmenu .menu.type2 li {margin: 0 !important; width: 100%;}
.tabmenu .menu.type2 li button {position: relative; padding: 0 20px; min-width: 100%; width: 100%; height: 72px; font-size: 15px; word-break: keep-all; border: 0; border-radius: 0;}
.tabmenu .menu.type2 li button::before {content: ''; position: absolute; left: 0; top: 0; width: calc(100% - 1px); height: calc(100% - 2px); border: 1px solid #a8a8a8;}
.tabmenu .menu.type2 li.active button, .tabmenu .menu.type2 li button[data-selected="selected"] {color: #fff; background-color: #008ed7;}
.tabmenu .menu.type2 li.active button::before, .tabmenu .menu.type2 li button[data-selected="selected"]::before {border-color: #d5d5d5;}
.tabmenu .menu.type2 li:first-child button {border-radius: 72px 0 0 72px;}
.tabmenu .menu.type2 li:last-child button {border-radius: 0 72px 72px 0;}
.tabmenu .menu.type2 li:first-child button::before {border-radius: 72px 0 0 72px;}
.tabmenu .menu.type2 li:last-child button::before {border-radius: 0 72px 72px 0;}
.tabmenu.total .menu {flex-wrap: nowrap; -webkit-flex-wrap: nowrap;}
.tabmenu.total .menu li {width: 100%;}
.tabmenu.total .menu li button {width: 100%; min-width: 100%;}

.midarea .subtoparea {height: 230px; background-position: center center; background-repeat: no-repeat; background-size: cover;}
.midarea .subtoparea.sub1 {background-image: url('../../images/web/sub_visual01.jpg');} /*법률상담*/
.midarea .subtoparea.sub2 {background-image: url('../../images/web/sub_visual02.jpg');} /*프리랜서 교육*/
.midarea .subtoparea.sub3 {background-image: url('../../images/web/sub_visual03.jpg');} /*일감정보*/
.midarea .subtoparea.sub4 {background-image: url('../../images/web/sub_visual04.jpg');} /*커뮤니티,통합검색*/
.midarea .subtoparea.sub5 {background-image: url('../../images/web/sub_visual05.jpg');} /*소개*/
.midarea .subtoparea.sub6 {background-image: url('../../images/web/sub_visual06.jpg');} /*이용안내*/
.midarea .subtoparea.sub7 {background-image: url('../../images/web/sub_visual07.jpg');} /*멤버쉽*/
.midarea .subtoparea.sub8 {background-image: url('../../images/web/sub_visual08.jpg');} /*마이페이지*/
.midarea .subtoparea .title_area {margin: 0 auto; padding-top: 70px; max-width: 1280px; width: 100%; box-sizing:border-box;}
.midarea .subtoparea .title_area h2 {margin-bottom: 30px; color: #fff; font-size: 48px; line-height: 48px;}
.midarea .subtoparea .title_area .nav_area {display: flex; display:-webkit-flex;}
.midarea .subtoparea .title_area .nav_area li {padding-right: 65px; background-repeat: no-repeat; background-position: right 30px center; background-image: url('../../images/web/nav_arrow.png');}
.midarea .subtoparea .title_area .nav_area li:last-child {padding-right: 0; background: none;}
.midarea .subtoparea .title_area .nav_area li a {display: block; height: 100%; color: #ddd; font-size: 14px;}
.midarea .subtoparea .title_area .nav_area li a img {position: relative; top: 5px; display: block;}
.midarea .subtoparea .title_area .nav_area li span {color: #a6ffc7; font-size: 14px; font-weight: 600;}
.midarea .lnbarea {z-index: 300; position: relative; border-top: 1px solid #cecece; border-bottom: 1px solid #cecece;}
.midarea .lnbarea .lnbmenu {position: relative; margin: 0 auto; max-width: 1280px; width: 100%; border-left: 1px solid #cecece; border-right: 1px solid #cecece; box-sizing:border-box;}
.midarea .lnbarea .lnbmenu > button {display: none;}
.midarea .lnbarea .lnbmenu > button .dropdown-label {}
.midarea .lnbarea .lnbmenu .dropdown-menu {display: flex; display:-webkit-flex; height: 50px;}
.midarea .lnbarea .lnbmenu .dropdown-menu li {width: 100%; height: 100%; border-right: 1px solid #cecece;}
.midarea .lnbarea .lnbmenu .dropdown-menu li:last-child {border-right: 0;}
.midarea .lnbarea .lnbmenu .dropdown-menu li button {padding: 0 5px; width: 100%; height: 100%; color: #666; line-height: 18px; word-break: keep-all;}
.midarea .lnbarea .lnbmenu .dropdown-menu li.active {background-color: #004096;}
.midarea .lnbarea .lnbmenu .dropdown-menu li.active button {color: #fff; font-weight: 600;}

.contentsarea {margin: 0 auto; padding: 60px 0; max-width: 1280px; width: 100%; box-sizing:border-box;}
.contentsarea .subtit {margin-bottom: 40px; text-align: center;}
.contentsarea .subtit h2 {font-size: 32px; line-height: 32px;}

/*법률상담 소개*/
.con1 {}
.con1 .con1_1 {padding: 13px 0; display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; background: linear-gradient( to right, #008ed7 0%, #004197 100%);}
.con1 .con1_1 li {position: relative; margin: 13px 20px; padding: 30px 30px 30px 145px; width: calc(50% - 40px); word-break: keep-all; background-color: #fff; border-radius: 10px;}
.con1 .con1_1 li::after {content: ''; position: absolute; left: 10px; top: 0; width: 135px; height: 100%; background-repeat: no-repeat; background-position: center;}
.con1 .con1_1 li.icon1::after {background-image: url('../../images/web/icon_contents1_1_1.png');}
.con1 .con1_1 li.icon2::after {background-image: url('../../images/web/icon_contents1_1_2.png');}
.con1 .con1_1 li.icon3::after {background-image: url('../../images/web/icon_contents1_1_3.png');}
.con1 .con1_1 li.icon4::after {background-image: url('../../images/web/icon_contents1_1_4.png');}
.con1 .con1_1 li h4 {color: #333; font-size: 20px;}
.con1 .con1_1 li p {color: #333;}
.con1 .con1_2 {padding: 25px 30px; background-color: #f8f8f8;}
.con1 .con1_2 .list_type3 {}
.con1 .con1_2 .list_type3 > li {margin-bottom: 40px;}
.con1 .con1_2 .list_type3 > li > p {margin-bottom: 15px;}
.con1 .con1_2 .list_type3 > li .step {padding: 0 120px 0 100px; display: flex; display:-webkit-flex; justify-content: space-between;}
.con1 .con1_2 .list_type3 > li .step li {position: relative;}
.con1 .con1_2 .list_type3 > li .step li::before {content: ''; margin: 0 auto 15px; display: block; width: 150px; height: 150px; background-color: #fff; background-repeat: no-repeat; background-position: center; border: 1px solid #008ed7; border-radius: 100%;}
.con1 .con1_2 .list_type3 > li .step li.icon1::before {background-image: url('../../images/web/icon_contents1_2_1.png');}
.con1 .con1_2 .list_type3 > li .step li.icon2::before {background-image: url('../../images/web/icon_contents1_2_2.png');}
.con1 .con1_2 .list_type3 > li .step li.icon3::before {background-image: url('../../images/web/icon_contents1_2_3.png');}
.con1 .con1_2 .list_type3 > li .step li.icon4::before {background-image: url('../../images/web/icon_contents1_2_4.png');}
.con1 .con1_2 .list_type3 > li .step li h4 {color: #333; font-size: 16px; text-align: center;}
.con1 .con1_2 .list_type3 > li .step li.arrow {width: 44px; height: 150px; background-repeat: repeat-x; background-position: left center; background-image: url('../../images/web/icon_arrow4.png');}
.con1 .con1_2 .list_type3 > li .step li.arrow::before {display: none;}
.con1 .list_type3 > li {margin-bottom: 10px;}
.con1 .list_type3 > li:last-child {margin-bottom: 0 !important;}
.con1 .con1_3 {padding: 0 50px; display: flex; display:-webkit-flex; justify-content: space-between;}
.con1 .con1_3 > li {padding: 80px 40px 65px; width: calc(50% - 30px); border: 1px solid #888;}
.con1 .con1_3 > li .icon {margin-bottom: 55px; width: 100%; height: 152px; background-repeat: no-repeat; background-position: center center;}
.con1 .con1_3 > li p {font-size: 18px; text-align: center; word-break: keep-all;}
.con1 .con1_3 > li p span {display: block;}
.con1 .con1_3 > li .button_box button {width: 250px; height: 100px; font-size: 28px;}
.con3 .con3_1 {padding: 40px 10px 45px; background-color: #fafafa;}
.con3 .con3_1 h4 {position: relative; margin-bottom: 35px; padding-left: 12px; font-size: 16px;}
.con3 .con3_1 h4::after {content: ''; position: absolute; left: 0; top: 10px; width: 3px; height: 3px; background-color: #222; border-radius: 50%;}
.con3 .con3_1 ul {padding: 0 30px;  display: flex; display:-webkit-flex; justify-content: space-between;}
.con3 .con3_1 ul li.step {position: relative; padding-top: 160px; width: 140px; text-align: center; word-break: keep-all;}
.con3 .con3_1 ul li.step::after {content: ''; position: absolute; left: 0; top: 0; width: 134px; height: 134px; border: 3px solid #abc0d6; border-radius: 50%; background-repeat: no-repeat; background-position: center center;}
.con3 .con3_1 ul li.step.step1::after {background-image: url('../../images/web/icon_contents3_1_1.png');}
.con3 .con3_1 ul li.step.step2::after {background-image: url('../../images/web/icon_contents3_1_2.png');}
.con3 .con3_1 ul li.step.step3::after {background-image: url('../../images/web/icon_contents3_1_3.png');}
.con3 .con3_1 ul li.step.step4::after {background-image: url('../../images/web/icon_contents3_1_4.png');}
.con3 .con3_1 ul li.step.step5::after {background-image: url('../../images/web/icon_contents3_1_5.png');}
.con3 .con3_1 ul li.step.step6::after {background-image: url('../../images/web/icon_contents3_1_6.png');}
.con3 .con3_1 ul li.step.step7::after {background-image: url('../../images/web/icon_contents3_1_7.png');}
.con3 .con3_1 ul li.arrow {display: flex; display:-webkit-flex; align-items: center; height: 140px;}
.con3 .con3_1 ul li h5 {color: #1a2d5a; font-size: 16px; line-height: 22px;}
.con3 .con3_1 ul li p {margin-top: 15px; color: #444; font-size: 14px; line-height: 19px;}
.con3 .con3_2 {display: flex; display:-webkit-flex; justify-content: space-around;}
.con3 .con3_2 li {padding-top: 170px; width: 310px; height: 310px; text-align: center; border-radius: 10px; background-repeat: no-repeat; background-position: center top 77px, center center; background-size: auto, cover;}
.con3 .con3_2 li:nth-child(1) {background-image: url('../../images/web/icon_contents3_2_1.png'), url('../../images/web/bg_contents3_2_1.png');}
.con3 .con3_2 li:nth-child(2) {background-image: url('../../images/web/icon_contents3_2_2.png'), url('../../images/web/bg_contents3_2_2.png');}
.con3 .con3_2 li h4 {margin-bottom: 15px; color: #fff; font-size: 24px; font-weight: 600;}
.con3 .con3_2 li p {color: #fff;}
.con4 .con4_1 {position: relative; padding: 185px 0; background-color: #fafafa;}
.con4 .con4_1 ul {display: flex; display:-webkit-flex; align-items: center; justify-content: center;}
.con4 .con4_1 ul li {position: relative; margin-right: 20px; display: flex; display:-webkit-flex; justify-content: center; align-items: center; width: 215px; height: 215px; border-radius: 50px; border: 3px solid #888;}
.con4 .con4_1 ul li::after {content: ''; z-index: 6; position: absolute; right: -54px; top: calc(50% - 33px); width: 55px; height: 66px; background-color: #fafafa; background-repeat: no-repeat; background-position: left top; background-image: url('../../images/web/icon_contents5_1_arrow.png');}
.con4 .con4_1 ul li .text_box {padding-top: 80px; width: 100%; text-align: center; background-repeat: no-repeat; background-position: center top;}
.con4 .con4_1 ul li .text_box p {font-size: 18px; line-height: 22px;}
.con4 .con4_1 ul li .text_box p img {width: 110px;}
.con4 .con4_1 ul li.step1 .text_box {background-image: url('../../images/web/icon_contents5_1_1.png');}
.con4 .con4_1 ul li.step2 .text_box {background-image: url('../../images/web/icon_contents5_1_2.png');}
.con4 .con4_1 ul li.step3 .text_box {background-image: url('../../images/web/logo_back.png'); background-position: center 12px; background-size: 160px;}
.con4 .con4_1 ul li.step4 {margin-right: 0; width: 300px; height: 300px;}
.con4 .con4_1 ul li.step4::after {display: none;}
.con4 .con4_1 ul li.step4 .text_box {background-image: url('../../images/web/logo_back.png'); background-position:  center 18px; background-size: 220px;}
.con4 .con4_1 ul li.step4 .text_box p {font-size: 22px; font-weight: 600;}
.con4 .con4_1 .sb {position: absolute; padding: 25px 0; width: 103px; height: 103px; font-size: 18px; text-align: center;}
.con4 .con4_1 .sb::before {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: contain; background-repeat: no-repeat;}
.con4 .con4_1 .sb.sb1 {left: calc(50% + 125px); top: 80px;}
.con4 .con4_1 .sb.sb1::before {background-image: url('../../images/web/icon_contents5_1_sb1.png');}
.con4 .con4_1 .sb.sb2 {top: 110px; right: calc(50% - 610px);}
.con4 .con4_1 .sb.sb2::before {background-image: url('../../images/web/icon_contents5_1_sb2.png');}
.con4 .con4_1 .sb.sb3 {left: calc(50% + 125px); bottom: 80px;}
.con4 .con4_1 .sb.sb3::before {transform: rotate(-90deg); background-image: url('../../images/web/icon_contents5_1_sb1.png');}
.con4 .con4_1 .sb.sb4 {bottom: 110px; right: calc(50% - 610px);}
.con4 .con4_1 .sb.sb4::before {transform: rotate(90deg); background-image: url('../../images/web/icon_contents5_1_sb2.png');}

/*멤버쉽*/
.membership_area > p {margin-bottom: 15px; font-size: 18px;}
.membership_area > p span {color: #004096; font-weight: 600;}
.membership_area > ul li {margin-bottom: 20px; display: flex; display:-webkit-flex; justify-content: space-between;}
.membership_area > ul li:last-child {margin-bottom: 0;}
.membership_area .write_box li .inpbox, .membership_area .write_box li .optionbox {overflow: hidden; width: 100%;}
.membership_area .button_box button {margin-left: 18px;}
.membership_area .button_box {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.membership_area .button_box .btn {margin-bottom: 20px; margin-left: 40px; width: 100%; height: 100px; font-size: 28px; font-weight: 600;}
.membership_area .button_box .btn4 {}
.membership_area .button_box .btn_onepass {margin-top: 60px; width: 100%; height: 72px; background-color: #1c2674; border-radius: 10px;}
.membership_area.write {margin: 0 auto; width: 486px;}
.membership_area.write .write_box li .inpbox, .membership_area.write .write_box li .optionbox {height: 80px; border-radius: 10px;}
.membership_area.write .write_box li .inpbox input.txt, .membership_area.write .write_box li .optionbox select {padding: 0 20px; border-radius: 10px;}
.membership_area.write .write_box li .optionbox {background-image: url('../../images/web/arrow_select2.png');}
.membership_area.write .write_box li.tel div {width: calc(33.33% - 10px);}
.membership_area.type2 {padding: 100px 140px 100px 50%; background-color: #fafafa; background-repeat: no-repeat; background-position: 20% center;}
.membership_area.type2.result {background-image: url('../../images/web/icon_searchid.png');}
.membership_area.type2.finish {background-image: url('../../images/web/icon_finish.png');}
.membership_area.type2 .write_box li .inpbox {height: 60px; border: 1px solid #c6c6c6;}
.membership_area.type2 .write_box li .inpbox input.txt {font-size: 20px; font-weight: 500; text-align: center; background-color: transparent;}
.membership_area.type2 .button_box {display: flex; display:-webkit-flex; flex-wrap: nowrap; -webkit-flex-wrap: nowrap;}
.membership_area.type2 .button_box .btn {width: 250px; max-width: 100%;}
.membership_area.type2.certify {padding: 0; display: flex; display:-webkit-flex;}
.membership_area.type2.certify .certify_box {padding: 135px 40px 135px 250px; width: 100%; background-repeat: no-repeat; background-position: left 40px center;}
.membership_area.type2.certify .certify_box:nth-child(1) {background-image: url('../../images/web/icon_certify.png');}
.membership_area.type2.certify .certify_box:nth-child(2) {background-image: url('../../images/web/icon_certify2.png');}
.membership_area.type2.certify .certify_box h3 {margin-bottom: 20px; font-size: 24px;}
.membership_area.type2.certify .certify_box p {height: 80px;}
.membership_area.type2.certify .certify_box .button_box {margin-top: 0;}

.advice_area {margin-bottom: 60px; padding: 30px 40px; display: flex; display:-webkit-flex; justify-content: space-between; background-color: #fafafa;}
.advice_area .advice {position: relative; display: flex; display:-webkit-flex; justify-content: space-between;}
.advice_area .advice:nth-child(1) {width: calc(100% - 270px);}
.advice_area .advice:nth-child(2) {width: 190px;}
.advice_area .advice li {position: relative; text-align: center;}
.advice_area .advice li::before {content: ''; position: absolute; right: -100%; top: 50%; width: 100%; height: 1px; background-color: #adadad;}
.advice_area .advice li:last-child::before {display: none;}
.advice_area .advice li a {z-index: 30; position: relative; padding: 25px 0; display: block; width: 190px; border: 1px solid #a8a8a8; border-radius: 10px; background-color: #fff;}
.advice_area .advice li a p.num {margin: 10px 0; color: #a8a8a8; font-size: 36px; font-weight: 600; font-family: 'Tahoma', 'Noto Sans KR', sans-serif;}
.advice_area .advice li p.icon {width: 100%; height: 65px; background-repeat: no-repeat; background-position: center center;}
.advice_area .advice li.step1 p.icon {background-image: url('../../images/web/icon_advice1.png');}
.advice_area .advice li.step2 p.icon {background-image: url('../../images/web/icon_advice2.png');}
.advice_area .advice li.step3 p.icon {background-image: url('../../images/web/icon_advice3.png');}
.advice_area .advice li.step4 p.icon {background-image: url('../../images/web/icon_advice4.png');}
.advice_area .advice li.step5 p.icon {background-image: url('../../images/web/icon_advice5.png');}
.advice_area .advice li.active a {border-color: #008ed7; background-color: #008ed7;}
.advice_area .advice li.active a::after {content: ''; z-index: 32; position: absolute; left: calc(50% - 5px); top: 10px; width: 10px; height: 10px; background-color: #fff; border-radius: 100%;}
.advice_area .advice li.active p {color: #fff;}
.advice_area .advice li.active a p.num {color: #fff;}
.advice_area .advice li.step1.active p.icon {background-image: url('../../images/web/icon_advice1_on.png');}
.advice_area .advice li.step2.active p.icon {background-image: url('../../images/web/icon_advice2_on.png');}
.advice_area .advice li.step3.active p.icon {background-image: url('../../images/web/icon_advice3_on.png');}
.advice_area .advice li.step4.active p.icon {background-image: url('../../images/web/icon_advice4_on.png');}
.advice_area .advice li.step5.active p.icon {background-image: url('../../images/web/icon_advice5_on.png');}
.advice_area .advice.detail {width: 100% !important;}
.advice_area .advice.detail::before {content: ''; position: absolute; left: 0; top: 70px; width: 100%; height: 1px; background-color: #adadad;}
.advice_area .advice.detail li {width: 140px !important; text-align: center;}
.advice_area .advice.detail li::before {display: none}
.advice_area .advice.detail li .icon {margin-bottom: 20px; width: 100%; height: 140px; border: 1px solid #adadad; border-radius: 100%; background-color: #fafafa;}
.advice_area .advice.detail li.active p {color: #008ed7; font-weight: 500;}
.advice_area .advice.detail li.active .icon {border-color: #008ed7; background-color: #008ed7;}

@media screen and (max-width:1400px) {
    .board_title {padding: 0 10px;}
    
    .agree_area {padding: 0 10px;}
    .agree_area .board_title {padding: 0;}
    .tabmenu {padding: 0 10px;}
    
    .midarea .subtoparea .title_area {padding: 90px 20px 0; width: 100%;}
    .midarea .lnbarea .lnbmenu {width: 100%; border: 0;}
    
    .contentsarea {width: 100%;}
    
    .con1 .con1_3 {padding: 0 20px;}
    .con1 .con1_3 > li {padding: 60px 20px; width: calc(50% - 10px);}
    .con1 .con1_3 > li .button_box {padding: 0;}
    .con1 .con1_3 > li .button_box button {margin-left: 20px; width: 100%; height: 100px; font-size: 24px;}
    .con4 .con4_1 {padding: 100px 0;}
    .con4 .con4_1 ul {transform: scale(0.8);}
    .con4 .con4_1 .sb {transform: scale(0.8);}
    .con4 .con4_1 .sb.sb1 {left: calc(50% + 90px); top: 30px;}
    .con4 .con4_1 .sb.sb2 {top: 60px; right: calc(50% - 500px);}
    .con4 .con4_1 .sb.sb3 {left: calc(50% + 40px); bottom: 40px;}
    .con4 .con4_1 .sb.sb4 {bottom: 40px; right: calc(50% - 480px);}
    
    /*멤버쉽*/
    .membership_area.type2 {padding: 100px 50px 100px 50%; background-position: 17% center;}
}
@media screen and (max-width:1240px) {
    /*법률상담 소개*/
    .con1 .con1_2 .list_type3 > li .step {padding: 0 60px 0 40px;}
    .con3 .con3_1 ul {padding: 0;}
    
    .advice_area {padding: 30px;}
    .advice_area .advice:nth-child(1) {width: calc(100% - 210px);}
    .advice_area .advice:nth-child(2) {width: 160px;}
    .advice_area .advice li a {width: 160px;}
    
    .membership_area.type2.certify .certify_box {padding: 135px 20px 135px 210px; width: 100%; background-repeat: no-repeat; background-position: left 20px center;}
    .membership_area.type2.certify .certify_box .button_box {padding: 0;}
}
@media screen and (max-width:1200px) {
    body {line-height: 23px;}

    .btn {height: 60px; font-size: 20px;}
    .btn2 {width: 96px !important; height: 42px;}
    .btn5 {width: 65px; height: 20px; font-size: 12px !important; line-height: 18px;}
    .btn_close {width: 50px; height: 50px;}
    .btn_more.bg_white6 {width: 100%; height: 60px; font-size: 18px;}
        
    .w_flex_only {display: none !important; display:-webkit-none;}
    .m_flex_only {display: flex !important; display:-webkit-flex;}
    .w_hidden {display: block !important;}
    .m_hidden {display: none !important;}
    
    .mb60 {margin-bottom: 30px !important}
    
    h4.h4 {margin-bottom: 10px; padding-left: 12px;}
    h4.h4::after {left: 0; top: 10px;}
    .div_box {margin-bottom: 30px;}
    .board_title {margin-bottom: 10px;}
    .list_type li {padding: 0 17px 0 0; margin-right: 15px; color: #888; line-height: 23px;}
    .list_type li::after {right: 0; top: calc(50% - 1px); width: 2px; height: 2px; border-radius: 100%;}
    .list_type li:first-child {padding: 0 17px 0 0;}
    .list_type li:last-child {padding: 0; margin-right: 0;}
    .list_type2 > dl {padding-left: 10px; display: block; display:-webkit-block;}
    .list_type2 > dl::after {width: 3px; height: 3px;}
    .list_type2 > dl dt {width: 100%;}
    .list_type2 > dl dd {color: #888;}
    .num_list2 > li {}
    .box_type {}
    .agree_area {margin-bottom: 30px;}
    .agree_area .board_title h3 {font-size: 20px;}
    .agree_area .agree_box {padding: 10px;}
    .tabmenu .menu li {margin: 5px 10px 5px 0;}
    .tabmenu .menu li:last-child {margin: 5px 0;}
    .tabmenu .menu li button {padding: 0 20px; min-width: 120px; height: 50px;}
    .tabmenu .menu.type2 li button {padding: 0 5px;}
    
    .midarea .subtoparea {height: 130px;}
    .midarea .subtoparea .title_area {padding: 35px 10px 0;}
    .midarea .subtoparea .title_area h2 {margin-bottom: 10px; font-size: 36px; line-height: 36px;}
    .midarea .subtoparea .title_area .nav_area li {padding-right: 40px; background-position: right 15px center;}

    .contentsarea {padding: 40px 0;}
    .contentsarea .subtit {margin-bottom: 35px;}
    
    /*법률상담 소개*/
    .con1 .con1_1 {padding: 20px 10px; display: block; display:-webkit-block; background: #008ed7;}
    .con1 .con1_1 li {margin: 0 0 20px; padding: 10px; width: 100%; border-radius: 5px;}
    .con1 .con1_1 li:last-child {margin: 0;}
    .con1 .con1_1 li::after {left: 10px; top: 10px; width: 30px; height: 26px; background-position: left center; background-size: auto 26px;}
    .con1 .con1_1 li h4 {padding-left: 35px; margin-bottom: 5px; line-height: 26px;}
    .con1 .con1_1 li p {font-size: 14px; line-height: 20px;}
    .con1 .con1_2 {padding: 15px 0;}
    .con1 .con1_2 .list_type3 > li {margin-bottom: 20px; padding-left: 0;}
    .con1 .con1_2 .list_type3 > li > p {padding-left: 15px;}
    .con1 .con1_2 .list_type3 > li .step {padding: 0;}
    .con1 .con1_2 .list_type3 > li .step li {width: 85px;}
    .con1 .con1_2 .list_type3 > li .step li::before {margin: 0 auto 10px; width: 70px; height: 70px;}
    .con1 .con1_2 .list_type3 > li .step li.icon1::before {background-size: 36px;}
    .con1 .con1_2 .list_type3 > li .step li.icon2::before {background-size: 36px;}
    .con1 .con1_2 .list_type3 > li .step li.icon3::before {background-size: 35px;}
    .con1 .con1_2 .list_type3 > li .step li.icon4::before {background-size: 43px;}
    .con1 .con1_2 .list_type3 > li .step li h4 {font-size: 15px; line-height: 20px;}
    .con1 .con1_2 .list_type3 > li .step li.arrow {width: 11px; height: 70px; background-size: 11px;}
    .con1 .con1_2 .list_type3 > li .step li.arrow::before {display: none;}
    .con1 .list_type3 {padding: 0 10px;}
    .con1 .con1_3 > li {padding: 40px 20px;}
    .con1 .con1_3 > li .icon {margin-bottom: 30px; height: 110px; background-size: contain;}
    .con1 .con1_3 > li:nth-child(1) .icon {background-size: auto 85%;}
    .con1 .con1_3 > li p {font-size: 16px;}
    .con1 .con1_3 > li p span {display: initial;}
    .con1 .con1_3 > li .button_box button {margin-left: 0; margin-top: 10px; height: 60px; font-size: 20px;}
    .con1 .con1_3 > li .button_box button:first-child {margin-top: 0;}
    
    .con3 .con3_1 {padding: 15px 10px;}
    .con3 .con3_1 h4 {margin-bottom: 15px;}
    .con3 .con3_1 h4::after {top: 8px; width: 6px; height: 6px;}
    .con3 .con3_1 ul {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .con3 .con3_1 ul li.step {padding-top: 105px; width: 100px;}
    .con3 .con3_1 ul li.step::after {left: calc(50% - 50px); width: 96px; height: 96px; border: 2px solid #abc0d6; background-size: auto 40px;}
    .con3 .con3_1 ul li.arrow {height: 100px;}
    .con3 .con3_1 ul li p {margin-top: 5px;}
    .con3 .con3_2 li {padding: 80px 10px 15px; width: calc(50% - 20px); height: 155px; border-radius: 5px; background-position: center top 23px, center center; background-size: auto 45px, cover;}
    .con3 .con3_2 li h4 {margin-bottom: 10px;}

    .con4 .con4_1 {padding: 40px 0;}
    .con4 .con4_1 ul {display: block; display:-webkit-block; transform: scale(1);}
    .con4 .con4_1 ul li {margin: 0 auto 10px; width: 107px; height: 107px; border-radius: 30px; border: 2px solid #888;}
    .con4 .con4_1 ul li::after {right: calc(50% - 13px); top: 101px; width: 33px; height: 36px; transform: rotate(90deg); background-size: contain;}
    .con4 .con4_1 ul li .text_box {padding-top: 45px;}
    .con4 .con4_1 ul li .text_box p {font-size: 9px; line-height: 11px;}
    .con4 .con4_1 ul li .text_box p img {width: 55px;}
    .con4 .con4_1 ul li.step1 .text_box {background-size: 40px;}
    .con4 .con4_1 ul li.step2 .text_box {background-size: 35px;}
    .con4 .con4_1 ul li.step3 .text_box {background-position: center 12px; background-size: 80px;}
    .con4 .con4_1 ul li.step4 {margin: 0 auto; width: 150px; height: 150px;}
    .con4 .con4_1 ul li.step4 .text_box {background-position:  center 5px; background-size: 110px;}
    .con4 .con4_1 ul li.step4 .text_box p {font-size: 11px;}
    .con4 .con4_1 .sb {transform: scale(0.5);}
    .con4 .con4_1 .sb.sb1 {left: calc(50% - 150px); top: 330px;}
    .con4 .con4_1 .sb.sb2 {top: 330px; right: calc(50% - 150px);}
    .con4 .con4_1 .sb.sb3 {left: calc(50% - 150px); bottom: -20px;}
    .con4 .con4_1 .sb.sb4 {bottom: -20px; right: calc(50% - 150px);}
    
    /*멤버쉽*/
    .membership_area > p {text-align: center; word-break: keep-all;}
    .membership_area > ul li {margin-bottom: 10px;}
    .membership_area .button_box {padding: 0;}
    .membership_area .button_box button {margin-left: 0;}
    .membership_area .button_box .btn {margin-bottom: 10px; margin-left: 20px; height: 70px;}
    .membership_area .button_box .btn4 {width: calc(33.33% - 5px); font-size: 15px;}
    .membership_area .button_box .btn_onepass {margin-top: 20px; height: 40px; border-radius: 5px;}
    .membership_area .button_box .btn_onepass img {height: calc(100% - 10px);}
    .membership_area.write {width: 360px;}
    .membership_area.write .write_box li .inpbox, .membership_area.write .write_box li .optionbox {height: 55px; border-radius: 5px;}
    .membership_area.write .write_box li .inpbox input.txt, .membership_area.write .write_box li .optionbox select {padding: 0 10px; border-radius: 5px;}
    .membership_area.write .write_box li .optionbox {background-size: 20px;}
    .membership_area.write .write_box li.tel div {width: calc(33.33% - 5px);}
    .membership_area.type2 {padding: 120px 10px 40px 10px; background-position: center 40px;}
    .membership_area.type2.result {background-size: 130px;}
    .membership_area.type2.finish {padding: 195px 10px 40px 10px; background-size: 140px;}
    .membership_area.type2 .write_box li .inpbox {height: 50px;}
    .membership_area.type2 .button_box .btn {width: 100%;}
    .membership_area.type2.certify {display: block; display:-webkit-block;}
    .membership_area.type2.certify .certify_box {text-align: center; background-position: center 40px;}
    .membership_area.type2.certify .certify_box:nth-child(1) {padding: 220px 10px 20px 10px; background-size: 90px;}
    .membership_area.type2.certify .certify_box:nth-child(2) {padding: 180px 10px 40px 10px; background-size: 115px;}
    .membership_area.type2.certify .certify_box h3 {margin-bottom: 10px;}
    .membership_area.type2.certify .certify_box p {height: auto;}
    .membership_area.type2.certify .certify_box .button_box {margin-top: 20px;}
    
    .advice_area {margin-bottom: 40px; padding: 10px;}
    .advice_area .advice:nth-child(1) {width: 80%;}
    .advice_area .advice:nth-child(2) {width: calc(20% - 15px);}
    .advice_area .advice li {width: 100%; text-align: left; word-break: keep-all;}
    .advice_area .advice:nth-child(1) li {width: calc(25% - 15px);}
    .advice_area .advice li a {padding: 0 10px; display: flex; display:-webkit-flex; justify-content: space-between; align-items: center; width: 100%; height: 55px; font-size: 16px; line-height: 20px; border-radius: 3px;}
    .advice_area .advice li a p.num {margin: 0; padding-left: 10px; flex: none; font-size: 30px;}
    .advice_area .advice li a p.icon {display: none;}
    .advice_area .advice li.active a::after {display: none;}

}
@media screen and (max-width:784px) {
    .con3 .con3_1 ul {justify-content: flex-start;}
    .con3 .con3_1 ul li {margin: 10px 0;}
    .con3 .con3_1 ul li.step {width: calc(33.33% - 17px);}
    .con3 .con3_1 ul li.step::after {width: 96px; height: 96px; border: 2px solid #abc0d6; background-size: auto 40px;}
    .con3 .con3_1 ul li.arrow {height: 100px;}
    .con3 .con3_1 ul li p {margin-top: 5px;}
    
    .advice_area {display: block; display:-webkit-block;}
    .advice_area .advice {flex-wrap:wrap; -webkit-flex-wrap:wrap; width: 100% !important;}
    .advice_area .advice li {margin: 5px 0; width: calc(50% - 5px) !important;}
    .advice_area .advice li:nth-child(2n)::before {display: none;}
    .advice_area .advice.detail::before {top: 50px;}
    .advice_area .advice.detail li {margin: 0; display: flex; display:-webkit-flex; align-items: center; justify-content: center; width: 100px !important; height: 100px; font-size: 15px; line-height: 20px; border: 1px solid #adadad; border-radius: 100%; background-color: #fafafa;}
    .advice_area .advice.detail li .icon {display: none;}
    .advice_area .advice.detail li.active {border-color: #008ed7; background-color: #008ed7;}
    .advice_area .advice.detail li.active p {color: #fff;}
}
@media screen and (max-width:640px){
    .tabmenu {z-index: 99; position: relative; margin-bottom: 40px;}
    .tabmenu > button {position: relative; padding: 0 20px; display: block; width: 100%; height: 55px; color: #fff; text-align: left; background-color: #02973a; border-radius: 55px;}
    .tabmenu > button .arrow {position: absolute; right: 20px; top: calc(50% - 7px); width: 14px; height: 14px;}
    .tabmenu.open > button .arrow {transform: rotate(45deg);}
    .tabmenu > button .arrow::after, .tabmenu > button .arrow::before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 14px; height: 3px; background-color: #fff; border-radius: 3px; transform-origin: center;}
    .tabmenu > button .arrow::before {transform: translateY(-50%) rotate(90deg);}
    .tabmenu .dropdown-menu {display: none; display:-webkit-none;}
    .tabmenu.open .dropdown-menu {position: absolute; left: 10px; top: 67px; padding: 15px 20px; display: block; display:-webkit-block; width: calc(100% - 20px); border: 1px solid #02973a; border-radius: 20px; background-color: #fff;}
    .tabmenu .dropdown-menu li {margin: 0 0 5px; width: 100% !important;}
    .tabmenu .dropdown-menu li:last-child {margin: 0;}
    .tabmenu .dropdown-menu li button {padding: 0 !important; min-width: 100%; height: auto !important; color: #666 !important; text-align: left; border: 0 !important; border-radius: 0 !important;}
    .tabmenu .dropdown-menu li button::before {display: none;}
    .tabmenu .dropdown-menu li button[data-selected="selected"] {color: #02973a !important; background-color: transparent !important;}
    .tabmenu .menu.type2 li.active button, .tabmenu .menu.type2 li button[data-selected="selected"] {font-weight: 400; background-image: none; background-color: transparent;}

    .midarea .lnbarea .lnbmenu > button {position: relative; padding: 0 10px; display: block; width: 100%; height: 58px; color: #fff; font-weight: 600; text-align: left; background-color: #004096;}
    .midarea .lnbarea .lnbmenu > button .arrow {position: absolute; right: 10px; top: calc(50% - 6px); width: 22px; height: 12px;}
    .midarea .lnbarea .lnbmenu > button .arrow::after, .midarea .lnbarea .lnbmenu > button .arrow::before {content: ''; position: absolute; top: 4px; width: 16px; height: 3px; background-color: #fff; border-radius: 3px;}
    .midarea .lnbarea .lnbmenu > button .arrow::after {left: -2px; transform: rotate(45deg);}
    .midarea .lnbarea .lnbmenu > button .arrow::before {right: -2px; transform: rotate(-45deg);}
    .midarea .lnbarea .lnbmenu .dropdown-menu {position: absolute; left: 0; top: 59px; padding: 15px 10px; display: none; display:-webkit-none; width: 100%; height: auto; background-color: #f9f9f9; border-top: 2px solid #004096; border-bottom: 2px solid #004096;}
    .midarea .lnbarea .lnbmenu .dropdown-menu li {width: 100%; height: auto; border-right: 0; border-bottom: 1px solid #cecece;}
    .midarea .lnbarea .lnbmenu .dropdown-menu li:last-child {border-bottom: 0;}
    .midarea .lnbarea .lnbmenu .dropdown-menu li button {padding: 0; width: 100%; height: 40px; text-align: left;}
    .midarea .lnbarea .lnbmenu.open > button {color: #666; background-color: #fff;}
    .midarea .lnbarea .lnbmenu.open > button .arrow {transform: rotate(180deg);}
    .midarea .lnbarea .lnbmenu.open > button .arrow::after, .midarea .lnbarea .lnbmenu.open > button .arrow::before {background-color: #666;}
    .midarea .lnbarea .lnbmenu.open .dropdown-menu {display: block; display:-webkit-block;}
    
    .con1 .con1_3 {display: block; display:-webkit-block;}
    .con1 .con1_3 > li {margin-bottom: 20px; width: 100%;}
    .con1 .con1_3 > li:last-child {margin-bottom: 0;}
    
    .con3 .con3_2 {padding: 0 10px; display: block; display:-webkit-block;}
    .con3 .con3_2 li {width: 100%; height: auto;}
    .con3 .con3_2 li:first-child {margin-bottom: 10px;}
    .con3 .con3_2 li h4 {margin-bottom: 10px;}
    
}
@media screen and (max-width:480px){
    .con3 .con3_1 ul li.step {width: calc(50% - 17px);}
    
    .advice_area .advice.detail::before {top: 35px;}
    .advice_area .advice.detail li {width: 70px !important; height: 70px;}
}
@media screen and (max-width:360px){
    .btn_add {width: 17px !important; height: 17px;}
    .btn_add::after, .btn_add::before {left: calc(50% - 5px); top: 50%; width: 10px; height: 1px;}
    
    /*법률상담 소개*/
    .con1 .con1_2 .list_type3 > li:nth-child(2) .step li.arrow {display: none;}
    
    /*멤버쉽*/
    .membership_area .button_box li {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .membership_area .button_box .btn {margin-left: 0;}
    .membership_area.write {width: 100%;}
    .membership_area.write .write_box li.tel .optionbox {width: 40%;}
    .membership_area.write .write_box li.tel .inpbox {width: calc(30% - 10px);}
}
@media screen and (max-width:320px){
    /*멤버쉽*/
    .membership_area .button_box .btn4 {font-size: 14px; letter-spacing: -1px;}
    
    .advice_area .advice.detail::before {top: 30px;}
    .advice_area .advice.detail li {width: 60px !important; height: 60px; font-size: 12px; line-height: 16px;}
}