@charset "utf-8";

/* 상단 비주얼 */
.subtop_visual01{background:#40424d url(../img/support/img_subtop_support01.jpg) no-repeat 50%;}
.subtop_visual02{background:#484848 url(../img/support/img_subtop_support02.jpg) no-repeat 50%;}
.subtop_visual03{background:#484848 url(../img/support/img_subtop_support03.jpg) no-repeat 50%;}
.subtop_visual04{background:#484848 url(../img/support/img_subtop_support04.jpg) no-repeat 50%;}
.subtop_visual05{background:#484848 url(../img/support/img_subtop_support05.jpg) no-repeat center center / cover}

/* 고객지원안내 */
.con_about_support{padding-top:75px;}
.con_about_support h2{color:#003767;font-size:45px;line-height:45px;letter-spacing:-2px;text-align:center;font-weight:500;}
.con_about_support h2:lang(en){letter-spacing:-1px;}
.con_about_support .sub_text{text-align:center;padding-top:30px;font-size:18px;line-height:26px;color:#666;font-weight:400;letter-spacing:-1px;}
.con_about_support .sub_text .option_text{display:block;padding-top:15px;}
.con_about_support .img_area{text-align:center;padding-top:65px;}
.con_about_support .search_area{width:520px;margin:25px auto 0;}
.graph_box { display:  inline-block;position: relative; padding-top:65px; width: 1000px;}
.graph_box h3{ font-size: 22px; line-height: 30px; color: #333333; font-weight: 500; padding-bottom: 20px;}
.graph_box li { float: left; width: 50%; text-align: center; padding: 10px 0;}
.graph_box li .graph_img{ text-align: center; padding-bottom:  10px;}
.graph_box li .graph_box{ display: inline-block;background:url(../img/support/gr_speech_bg.png) no-repeat; width: 340px; height: 158px; padding-top: 40px;}
.graph_box li .graph_text{ display: inline-block; padding-left: 10px; text-align: left; font-size: 16px; line-height: 24px; color: #333333; font-weight: 400; letter-spacing: -1px; padding-top: 8px; vertical-align: top;}

.search_area:after{content:"";display:block;clear:both;}
.search_area input[type=text]{float:left;width:410px;height:37px;border:1px solid #ddd;font-size:15px;line-height:19px;color:#333;}
.search_area input{vertical-align:middle;}
.search_area .btn_search{float:right;min-width:105px;}

.con_purchase_before{background:#eeeeee;}
.con_purchase_service{position:relative;width:1000px;margin:0 auto;}
.con_purchase_service h2{color:#003767;}
.con_purchase_service h2 .highlight{color:#1a9dff;}
.con_purchase_service .tab_area_type02{padding-top:80px;width:740px;margin:0 auto;}
.con_purchase_service ul.inner_list{padding-top:80px;}
.con_purchase_service ul.inner_list li{ width: 780px;margin:0 auto; height:420px;}
.con_purchase_service ul.inner_list li .demo_box{ clear: both; margin:0 auto; display: inline-block; width: 780px; position: relative;}
.con_purchase_service ul.inner_list li h4{ display: inline-block; vertical-align: top; color:#003767;font-size:35px;line-height:35px; padding-left: 30px;}
.con_purchase_service ul.inner_list li h5{ display: inline-block; vertical-align: top; color:#003767;font-size:24px;line-height:24px; padding-left: 30px; padding-top: 10px;}
.con_purchase_service ul.inner_list li .tw{ display:block; vertical-align: top; color:#003767;font-size:35px;line-height:35px; padding-left: 0px;}
.con_purchase_service ul.inner_list li .demo_box .tt_box{ float: left; width: 480px;}
.con_purchase_service ul.inner_list li .demo_box .img_area{  float: left; display: inline-block; width:260px; }
.con_purchase_service ul.inner_list li .demo_box .img_area_right{  position: absolute; top: 0; right: 20px; display: inline-block; width:260px; }
.con_purchase_service ul.inner_list li .demo_box .tt_box .text_area{ display: inline-block; padding-left: 30px; font-size:18px;line-height:28px;color:#333; vertical-align: top; padding-top:20px;}
.con_purchase_service ul.inner_list li .demo_box .tt_box .text_area_tw{ display: inline-block; font-size:18px;line-height:28px;color:#333; vertical-align: top; padding-top:20px;}
.con_purchase_service ul.inner_list li .demo_box .tt_box .caution_text{display: inline-block;padding:15px 0 0 30px;}
.con_purchase_service ul.inner_list li .demo_box .tt_box .caution_text p{width:480px;display:inline-block;font-size:13px;line-height:18px;text-align:left;}
.con_purchase_service ul.inner_list li .demo_box .tt_box .caution_text p:lang(en){padding-left:85px;}
.con_purchase_service ul.inner_list li .demo_box .tt_box .btn_area{ padding-left: 30px;padding-top:20px; }
.con_purchase_service ul.inner_list li .demo_box .tt_box .btn_area a{min-width:150px;text-align: center;}
.con_purchase_service ul.inner_list li .demo_box .tt_box .btn_area_tw{ padding-left: 0px;padding-top:20px; }
.con_purchase_service ul.inner_list li .demo_box .tt_box .btn_area_tw a{min-width:150px;text-align: center;}

.con_purchase_service .btn_nav_slide{width:100%;position:absolute;top:360px;left:0;}
.con_purchase_service .btn_nav_slide a{display:block;overflow:hidden;text-indent:-9999px;width:24px;height:42px;background:url(../img/common/btn_slide_leftright.png) no-repeat;}
.con_purchase_service .btn_nav_slide a.go_prev{background-position:0 0;position:absolute;top:0;left:0;}
.con_purchase_service .btn_nav_slide a.go_next{background-position:0 -42px;position:absolute;top:0;right:0;}


/* 정부지원사업 */
.gm_top_visual {position:relative;padding:75px 0 225px 0;background:url('../img/support/bg_gm_top_visual.jpg') #2a3947 top center no-repeat;color:#fff;}
.gm_top_visual:after {display:block;content:'';clear:both;position:absolute;bottom:0;left:50%;margin-left:-300px;width:600px;height:400px;background:url('../img/support/bg_deco_building.png') center bottom no-repeat;}
.gm_top_visual h3 {width:470px;height:44px;line-height:44px;margin:0 auto;background:#044f8c;color:#bcd2ea;font-size:17px;border-radius:50px;}
.gm_top_visual h3 em {padding:0 2px;}
.gm_top_visual h1 {padding:27px 0 22px 0;font-size:55px;font-weight:600 !important;line-height:106%;}
.gm_top_visual h1 span {display:block;font-size:35px;font-weight:300;}
.gm_top_visual .sub_text {font-size:23px;line-height:145%;font-weight:400;color:#fff;}

 /* 상단 비주얼 말풍선 */
.gm_top_visual .balloon_grp span {position:absolute;left:50%;z-index:1000;width:170px;font-size:23px;font-weight:400;}
.gm_top_visual .balloon_grp span.left_bx {margin-left:-180px;bottom:95px;height:93px;line-height:76px;background:url('../img/support/balloon_left.png') center top no-repeat;}
.gm_top_visual .balloon_grp span.right_bx {margin-left:18px;bottom:78px;height:85px;line-height:69px;background:url('../img/support/balloon_right.png') center top no-repeat;}
.gm_top_visual .balloon_grp span em {color:#f9faa8;}

/* .gm_top_visual .balloon_grp span {position:absolute;left:50%;z-index:1000;}
.gm_top_visual .balloon_grp span.left_bx {margin-left:-180px;bottom:190px;}
.gm_top_visual .balloon_grp span.right_bx {margin-left:45px;bottom:160px;}
.gm_top_visual .balloon_grp .checkbox_tooltip {width:auto;min-width:180px;font-size:20px;height:70px;line-height:60px;border-radius:0;background:#283745;border:2px solid #50616d;}
.gm_top_visual .balloon_grp .checkbox_tooltip:after, 
.gm_top_visual .balloon_grp .checkbox_tooltip:before {transform:rotate(180deg);top:63px;left:90px;}
.gm_top_visual .balloon_grp .checkbox_tooltip:after {border-bottom:solid #283745;margin:-10px 0 0 -15px;border-width:9px;}
.gm_top_visual .balloon_grp .checkbox_tooltip:before {margin:-10px 0 0 -15px; border-width:9px;} */


.gm_visual {position:relative;height:340px;background:url('../img/support/img_support_visual.png') center bottom no-repeat;}
.gm_visual ul {position:absolute;top:230px;left:50%;margin-left:-312px;width:624px;}
.gm_visual ul li {width:312px;float:left;text-align:center;font-size:22px;font-weight:500;color:#fff;line-height:130%;box-sizing:border-box;}
.gm_visual ul li:first-child {padding-left:60px;}

.con_purchase_service ul.gm_list li h4 {font-size:30px;padding-top:20px;}
.con_purchase_service ul.gm_list li {height:unset;padding-bottom:90px;}
.con_purchase_service ul.gm_list li:last-child {padding-bottom:10px !important;}
.con_purchase_service ul.gm_list li .btn_area {padding-top:26px !important;}
.con_purchase_service ul.gm_list li .demo_box .img_area {width:255px;margin-right:5px;}

.gm_pro_list {padding:60px 0 0 0;}
.gm_pro_list:after {display:block;content:'';clear:both;}
.gm_pro_list li {float:left; width:50%; /*width:33.3333%;*/text-align:center;padding:0 18px 18px 18px; box-sizing:border-box;}
.gm_pro_list li img {display:inline-block;vertical-align:top;}
.gm_pro_list li h5 {padding:22px 0 10px 0;font-size:19px;font-weight:500;line-height:130%;color:#333;}
.gm_pro_list li p {padding:0 0 27px 0;font-size:15px;line-height:150%;color:#333;}



/* 1대1 문의 */
.con_contactlist_area{padding:100px 0 80px;}
.con_contactlist_area ul{width:880px;margin:0 auto;}
.con_contactlist_area ul:after{content:"";display:block;clear:both;}
.con_contactlist_area ul li{float:left;width:33.333%;text-align:center;}
.con_contactlist_area ul li .icon_area{display:inline-block;width:80px;height:80px;background:url(../img/support/icon_contact_list.png) no-repeat;}
.con_contactlist_area ul li.list02 .icon_area{background-position:0 -80px;}
.con_contactlist_area ul li.list03 .icon_area{background-position:0 -160px;}
.con_contactlist_area ul li.list04 .icon_area{background-position:0 -240px;}
.con_contactlist_area ul li .tltle{font-size:18px;line-height:18px;padding:10px;font-weight:400;color:#333;}
.con_contactlist_area ul li .sub_text{font-size:15px;line-height:24px;padding-top:12px;min-height:110px;color:#333;}
.con_contactlist_area ul li .contact_info{font-size:32px;line-height:32px;color:#003767;font-weight:500;}
.con_contactlist_area ul li .btn_area .btn{min-width:130px;}

/* faq */
.con_faq_area{padding-top:90px;}
.con_faq_area .tab_area_type03{padding-bottom:35px;}
.con_faq_area table{width:100%;}
.con_faq_area table tr.list_area{cursor:pointer;}
.con_faq_area table th{padding:14px;}
.con_faq_area table td{padding:14px;text-align:center;}
.con_faq_area table td + td + td{text-align:left;}
.con_faq_area table td.answer_area{padding:0;overflow-y:auto;overflow-x:hidden;}
.con_faq_area table td.answer_area .inner{padding:50px;text-align:left;min-height:100px;max-height:500px;font-size:15px;line-height:24px;}
.con_faq_area .paginate_area{padding-top:50px;}

/* 접수 완료 페이지 */
.con_submit_complete{width:1000px;margin:0 auto;padding:150px 0 70px;min-height:560px;}
.con_submit_complete .img_area{text-align:center;padding-bottom:20px;}
.con_submit_complete .text_area{text-align:center;font-weight:400;}
.con_submit_complete .text_area .title{font-size:25px;line-height:36px;color:#003767;padding-bottom:12px;}
.con_submit_complete .text_area .text{font-size:15px;line-height:24px;color:#333;padding-bottom:12px;}
.con_submit_complete .text_area .text .option_text{display:block;padding-top:20px;color:#666;}
.con_submit_complete .btn_area{text-align:center;padding-top:35px;}
.con_submit_complete .btn_area .btn{min-width:180px;}

/* 무상 업데이트 */
.con_about_update{position:relative;width:1000px;margin:0 auto; padding-bottom: 120px;}
.con_about_update .step_area{width:900px;margin:0 auto;height:700px;background:url(../img/support/img_about_freeupdate01.png) no-repeat 50%;}
.con_about_update .step_area ul.list_step{font-size:18px;line-height:18px;color:#fff;}
.con_about_update .step_area ul.list_step:after{content:"";display:block;clear:both;}
.con_about_update .step_area ul.list_step li{float:left;width:25%;text-align:center;padding-top:30px;font-weight:500;}
.con_about_update .step_area ul.step01_list,.con_about_update .step_area ul.step02_list,.con_about_update .step_area ul.step03_list,.con_about_update .step_area ul.step04_list{font-size:14px;line-height:22px;color:#46413a;}
.con_about_update .step_area ul.step01_list li,.con_about_update .step_area ul.step02_list li,.con_about_update .step_area ul.step03_list li,.con_about_update .step_area ul.step04_list li{padding-left:8px;background:url(../img/common/icon_bullet_brown.png) no-repeat 0 10px;}
.con_about_update .step_area ul.step01_list{position:absolute;top:90px;left:80px;}
.con_about_update .step_area ul.step02_list{position:absolute;top:90px;left:280px;}
.con_about_update .step_area ul.step03_list{position:absolute;top:90px;left:500px;}
.con_about_update .step_area ul.step04_list{position:absolute;top:90px;left:720px;}
.con_about_update .large_text{padding-top:230px;font-size:45px;line-height:45px;letter-spacing:-2px;font-weight:500;color:#003767;text-align:center;}
.con_about_update .step_area ul.text_list{width:840px;margin:0 auto;padding-top:190px;font-size:19px;line-height:26px;color:#fff; font-weight: 500;}
.con_about_update .step_area ul.text_list:after{content:"";display:block;clear:both;}
.con_about_update .step_area ul.text_list li{float:left;text-align:center;}
.con_about_update .step_area ul.text_list li.list01{width:310px;}
.con_about_update .step_area ul.text_list li.list02{width:220px;}
.con_about_update .step_area ul.text_list li.list03{width:300px;}

.con_about_update .hidden-img { display: none;} 

/* 관리자 교육 */
.con_about_adminedu{width:1000px;margin:90px auto 110px;text-align:center;}
.con_about_adminedu h2{font-size:45px;line-height:45px;letter-spacing:-2px;font-weight:500;color:#003767;text-align:center;}
.con_about_adminedu .sub_text{font-size:18px;line-height:26px;color:#333;padding-top:20px;text-align:center;}

.con_about_adminedu ul.con_edulist{display:inline-block;padding:80px 0 0;}
.con_about_adminedu ul.con_edulist:after{content:"";display:block;clear:both;}
.con_about_adminedu ul.con_edulist > li{float:left;width:260px;height:250px;margin:0 10px;color:#fff;}
.con_about_adminedu ul.con_edulist > li.list01{background:#003767;}
.con_about_adminedu ul.con_edulist > li.list02{background:#114572;}
.con_about_adminedu ul.con_edulist > li.list03{background:#0c3253;}
.con_about_adminedu ul.con_edulist > li .icon{display:inline-block;width:80px;height:70px;background:url(../img/support/icon_adminedu_list.png) no-repeat;margin-top:50px;}
.con_about_adminedu ul.con_edulist > li.list02 .icon{background-position:0 -70px;}
.con_about_adminedu ul.con_edulist > li.list03 .icon{background-position:0 -140px;}
.con_about_adminedu ul.con_edulist > li .title{font-size:16px;line-height:22px;padding-top:10px;}
.con_about_adminedu ul.con_edulist > li ul.text_list{padding-top:10px;}
.con_about_adminedu ul.con_edulist > li > ul.text_list li{padding:4px 0;font-size:14px;line-height:14px;color:#fff;font-weight:300;}

/* 관리자지원센터 23.3.7 추가 */
.manage >div:first-of-type {padding-top: 0;}
.manage .con_about_adminedu {margin: auto; padding:100px 0;position: relative;}
.manage .con_about_adminedu:last-of-type {padding-bottom: 0;}
.manage .con_about_adminedu:first-of-type::before {content: ""; width: 100vw; height: 1px; background: #e0e0e0; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; }
.con_about_adminedu .sub_text span {display: block;color: #a6a6a6; font-size: 15px; margin: 5px 0 30px; }
.manage_support_list {display: flex;align-items: center;justify-content: center;margin: -20px -40px; margin-top: 70px; }
.manage_support_list > li {padding: 20px 40px;}
.manage_support_list > li .title {font-size: 18px; margin-top: 20px;}


/* 보안 세미나 */
.con_about_seminar{width:1000px;margin:90px auto 110px;text-align:center;}
.con_about_seminar h2{font-size:45px;line-height:45px;letter-spacing:-2px;font-weight:500;color:#003767;text-align:center;}
.con_about_seminar .sub_text{font-size:17px;line-height:26px;color:#333;padding-top:20px;text-align:center;}

.con_about_seminar .con_info{position:relative;width:866px;height:460px;margin:80px auto 0;background:url(../img/support/img_support_adminedu.jpg) no-repeat 50%;}
.con_about_seminar .con_info ul.text_list{position:relative;}
.con_about_seminar .con_info ul.text_list li{position:absolute;font-size:16px;line-height:22px;padding-top:30px;text-align:center;color:#003767;}
.con_about_seminar .con_info ul.text_list li.list01{top:12px;left:78px;}
.con_about_seminar .con_info ul.text_list li.list02{top:0;left:358px;}
.con_about_seminar .con_info ul.text_list li.list03{top:0;left:606px;}

.con_about_seminar .con_info p{width:100%;font-size:16px;line-height:16px;position:absolute;color:#fff;text-align:center;}
.con_about_seminar .con_info .item01{bottom:144px;}
.con_about_seminar .con_info .item02{bottom:102px;}
.con_about_seminar .con_info .item03{bottom:60px;}
.con_about_seminar .con_info .item04{bottom:16px;}

/* 사용설명회 */
.con_about_pre{width:1000px;margin:90px auto 110px;text-align:center;}
.con_about_pre h2{font-size:45px;line-height:45px;letter-spacing:-2px;font-weight:500;color:#003767;text-align:center;}
.con_about_pre .sub_text{font-size:17px;line-height:26px;color:#333;padding-top:20px;text-align:center;}

.con_about_pre .con_info{position:relative;width:866px;height:525px;margin:80px auto 0;background:url(../img/support/img_support_adminpre.png) no-repeat 50%;}
.con_about_pre .con_info ul.text_list{position:relative;}
.con_about_pre .con_info ul.text_list li{position:absolute;font-size:16px;line-height:22px;padding-top:150px;text-align:center;}
.con_about_pre .con_info ul.text_list li.list01{top:12px;left:57px;color:#687e95;}
.con_about_pre .con_info ul.text_list li.list02{top:12px;left:322px;color:#558fcc;}
.con_about_pre .con_info ul.text_list li.list03{top:0;left:608px;color:#194f88;}

.con_about_pre .con_info ul.text_top_list{width:840px;margin:0 auto;padding-top:180px;font-size:19px;line-height:26px;color:#fff; font-weight: 500;}
.con_about_pre .con_info ul.text_top_list:after{content:"";display:block;clear:both;}
.con_about_pre .con_info ul.text_top_list li{float:left;text-align:center;}
.con_about_pre .con_info ul.text_top_list li.item01{width:310px;}
.con_about_pre .con_info ul.text_top_list li.item02{width:220px;}
.con_about_pre .con_info ul.text_top_list li.item03{width:310px;}


/* 공지 & 새소식 */
.con_notice_area{padding-top:30px;}
.con_notice_area .tab_area_type03{padding-bottom:35px;}
.con_notice_area table{width:100%;}
.con_notice_area table tr.list_area{cursor:pointer;}
.con_notice_area table th{padding:14px;}
.con_notice_area table td{text-align:center;}
.con_notice_area table td > a{padding:14px;display:block;color:#333;}
.con_notice_area table td > a:hover{color:#003767;}
.con_notice_area table td + td + td{text-align:left;}
.con_notice_area table td + td + td + td{text-align:center;}
.con_notice_area .paginate_area{padding-top:50px;}
.con_notice_area .search_area:after{content:"";display:block;clear:both;}
.con_notice_area .search_area .inner{width:520px;padding-bottom:30px;float:right;}

.con_inquiry_area h2{font-size:45px;line-height:45px;letter-spacing:-2px;text-align:center;font-weight:500;color:#003767;}
.con_inquiry_area .inquiry_detail{width:550px;margin:40px auto;border:1px solid #003767;padding:20px;}
.con_inquiry_area .inquiry_detail .text01{font-size:16px;line-height:24px;color:#333;}
.con_inquiry_area .inquiry_detail .text02{font-size:14px;line-height:22px; /*margin-top: 15px;*/}
.con_inquiry_area .inquiry_detail + p {width: 550px;margin: auto;font-size: 15px;transform: translateY(-30px);}

.con_event_view .table_view01 table{width:100%;}
.con_event_view .table_view01{margin-top:50px;}
.con_event_view .table_view01 th{padding:20px;}
.con_event_view .table_view01 .view_area{padding:30px 20px;}
.con_event_view .table_view01 th .title_text{font-size:18px;line-height:21px;color:#003767;font-weight:400;}
.con_event_view .tag_text{display:inline-block;margin-right:10px;width:56px;height:24px; vertical-align: text-top;}
.con_event_view .notice .tag_text{background:url(../img/support/icon_tag_notice.png) no-repeat;}
.con_event_view .publish .tag_text{background:url(../img/support/icon_tag_publish.png) no-repeat;}
.con_event_view .press .tag_text{background:url(../img/support/icon_tag_press.png) no-repeat;}
.con_event_view .ok .tag_text{background:url(../img/support/icon_tag_ok.png) no-repeat;}

.topsample_box{width:1000px;margin:90px auto 110px;}
.topsample_box .list > li{ float: left; display: inline-block; border-bottom:2px solid #c1c1c1;  padding-bottom: 20px;}
.topsample_box .list { margin: 50px  auto; padding-bottom: 80px;height: 120px;}
.topsample_box .list li:first-child{ width: 300px;margin-left: 0px;}
.topsample_box .list li{ width: 300px;margin-left: 50px;  }
.topsample_box .list h4{font-size:25px;line-height:45px;letter-spacing:-2px;font-weight:600;color:#003767; padding-bottom: 20px;}
.topsample_box .list .title li{  margin-left: 0px;padding-bottom: 10px;}
.topsample_box .list .title a { position: relative; display: block;}
.topsample_box .list .title .ic_publish:before {content:""; position:absolute; right:10px; top:5px; width:40px; height:40px; background:url("../img/support/new_ico.png") 0 0 no-repeat; }
.topsample_box .list .title .ic_press:before  {content:""; position:absolute; right:10px; top:5px; width:40px; height:40px; background:url("../img/support/new_ico.png")0 -40px no-repeat; }
.topsample_box .list .title .ic_notice:before {content:""; position:absolute; right:10px; top:5px; width:40px; height:40px; background:url("../img/support/new_ico.png") 0 -80px no-repeat;}
.topsample_box .list .title .ic_ok:before {content:""; position:absolute; right:10px; top:5px; width:40px; height:40px; background:url("../img/support/new_ico.png") 0 -120px no-repeat;}
.topsample_box .list .title li a{display: inline-block; width: 300px; max-width: 95%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;color: #333333;}
.topsample_box .list .title li a .new{ display: inline-block; margin-left: 5px; background:url("../img/support/new_s.png") no-repeat;width:14px; height:14px; vertical-align:baseline;}
.topsample_box .list .title li a:hover{ text-decoration: underline;}
.topsample_box .list .title li em{ display: block; float: left; font-size:14px;line-height:18px;font-weight:300;letter-spacing: 0px; color:#555555; padding-left: 2px; }
.topsample_box .list .in_text{ float: left; font-size:17px;line-height:22px;letter-spacing:-1px;font-weight:400;color:#333333; padding-bottom: 10px; }

/* 게시판 list 페이지 */
.con_boardlist{ width:1000px; margin: 90px auto 110px;}
.con_boardlist h2{font-size:45px;line-height:45px;letter-spacing:-2px;font-weight:500;color:#003767;text-align:center;}
.con_boardlist .sub_text{font-size:18px;line-height:26px;color:#333;padding-top:20px;text-align:center;}
.con_boardlist .boardlist_area{padding-top:60px;}
.boardlist_area dl{ width:1000px; padding:25px 0;border-bottom:1px solid #e0e0e0;}
.boardlist_area dl:after{content:"";display:block;clear:both;}
.boardlist_area dl dt{float:left;width:450px;}
.boardlist_area dl dd{float:left;width:510px;padding-left:40px;}
.boardlist_area dl dd .text_title{width:510px;padding:20px 0 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#003767; letter-spacing: -1px;}
.boardlist_area dl dd .text_title span{vertical-align:middle;}
.boardlist_area dl dd .text_title .tag_text{display:inline-block;margin-right:10px;width:56px;height:24px;}
.boardlist_area dl.event_on dd .text_title .tag_text{background:url(../img/support/icon_tag_new.png) no-repeat;}
.boardlist_area dl.planned_on dd .text_title .tag_text{background:url(../img/support/icon_tag_planned.png) no-repeat;}
.boardlist_area dl.afterstory_on dd .text_title .tag_text{background:url(../img/support/icon_tag_afterstory.png) no-repeat;}
.boardlist_area dl.event_off dd .text_title .tag_text{background:url(../img/support/icon_tag_eventoff.png) no-repeat;}
.boardlist_area dl.ing dd .text_title .tag_text{background:url(../img/support/icon_tag_ing.png) no-repeat;}
.boardlist_area dl.end dd .text_title .tag_text{background:url(../img/support/icon_tag_end.png) no-repeat;}
.boardlist_area dl dd .text_title .title{display:inline-block;font-size:20px;line-height:22px;font-weight:400;letter-spacing:0;max-width: calc(100% - 68px);text-overflow: ellipsis;overflow: hidden;}
.boardlist_area dl dd .detail_text{padding-bottom:20px;color:#666;font-size:15px;line-height:22px;}
.boardlist_area dl dd .btn_more{background-color:#0059a6;border:2px solid #0059a6;color:#fff;}
.boardlist_area dl dd .btn_more:hover{background:#002a4e;border:2px solid #002a4e;color:#eee;}
.boardlist_area dl.event_on dd .text_title .title{color:#003767;}
.boardlist_area dl.planned_on dd .text_title .title{color:#003767;}
.boardlist_area dl.afterstory_on dd .text_title .title{color:#0059a6;}
.boardlist_area dl.event_off dd .text_title .title{color:#999;}
.boardlist_area dl.event_off dd .detail_text{color:#999;}
.boardlist_area dl.event_off dd a:hover .text_title .title{color:#999;}

.boardlist_area dl.event_off dd .btn_more{background-color:#ccc;border:2px solid #ccc;color:#fff;}

.boardlist_area .paginate_area{padding-top:50px;}

/* 게시판 view 페이지 */

.con_event_view .view_title{padding:22px;margin-top:58px;border-top:2px solid #003767;border-bottom:1px solid #e0e0e0;overflow:hidden;max-height:65px;text-overflow:ellipsis;white-space:nowrap;}
.con_event_view .view_title span{vertical-align:middle;}
.con_event_view .view_title span.sub_title{border:1px solid #003767;padding:1px 8px;font-size:14px;line-height:14px;color:#003767;margin-right:14px;}
.con_event_view .view_title .tag_text{display:inline-block;margin-right:10px;width:56px;height:24px;}
.con_event_view .planned_on .tag_text{background:url(../img/support/icon_tag_planned.png) no-repeat;}
.con_event_view .afterstory_on .tag_text{background:url(../img/support/icon_tag_afterstory.png) no-repeat;}
.con_event_view .event_off .tag_text{background:url(../img/support/icon_tag_eventoff.png) no-repeat;}
.con_event_view .event_on .tag_text{background:url(../img/support/icon_tag_new.png) no-repeat;}
.con_event_view .ing .tag_text{background:url(../img/support/icon_tag_ing.png) no-repeat;}
.con_event_view .end .tag_text{background:url(../img/support/icon_tag_end.png) no-repeat;}


.con_event_view .view_title span.title_text{font-size:18px;line-height:18px;color:#003767;font-weight:400;}
.con_event_view .view_area{font-size:16px;line-height:26px;}


.con_event_view .inner_sns{text-align:right;padding:40px 0 20px;}
.con_event_view .inner_sns ul{display:inline-block;}
.con_event_view .inner_sns ul:after{content:"";display:block;clear:both;}
.con_event_view .inner_sns ul li{float:left;padding-left:8px;}
.con_event_view .inner_sns ul li a{display:block;width:29px;height:29px;background:url(../img/common/btn_list_sns.png) no-repeat;}
.con_event_view .inner_sns ul li.facebook a{background-position:0 -29px;}
.con_event_view .inner_sns ul li.kakao a{background-position:0 -203px;}
.con_event_view .inner_sns ul li.twitter a{background-position:0 -87px;}
.con_event_view .inner_sns ul li.url a{background-position:0 -116px;}
.con_event_view .inner_sns ul li.blog a{background-position:0 0;}
.con_event_view .inner_sns ul li.mail a{background-position:0 -174px;}
.con_event_view .inner_sns ul li.in a{background-position:0 -145px;}


.con_event_view .go .btn_area{text-align:center;padding:25px 0 25px 0;}
.con_event_view .go .btn_area .btn_go{min-width:160px;text-align:center;}
.con_event_view .go .ttext{ display: block; margin:0 auto; text-align:center; font-size: 15px; line-height: 18px;padding:30px 0 30px 0;}
.con_event_view .btn_area{text-align:right;padding-top:25px;border-top:1px solid #e0e0e0;}
.con_event_view .btn_area .btn_go{min-width:100px;text-align:center;}

.con_event_view .link_list > a{display:block;padding:22px;font-size:16px;line-height:16px;color:#333;height:60px;box-sizing:border-box;-webkit-box-sizing:border-box;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-top:1px solid #e0e0e0;}
.con_event_view .link_list > a .tag_area{float:left;width:15%;text-align:center;}
.con_event_view .link_list > a .tag_area span{vertical-align:top;}
.con_event_view .link_list > a .tag_area .icon{display:inline-block;width:20px;height:14px;background:url(../img/common/icon_select_blue01.png) no-repeat;}
.con_event_view .link_list > a.go_before_list .tag_area .icon{display:inline-block;background-position:0 -14px;}
.con_event_view .link_list > a .title_text{float:left;width:85%;}



/* 상담 안내 - 하단 영역 */
.wrap_btminfo_area{display:table;width:100%;background:#40424d url(../img/product/img_subbottom_product01.jpg) no-repeat 50%;}
.btminfo_area{display:table-cell;width:1000px;height:390px;margin:0 auto;text-align:center;vertical-align:middle;}
.btminfo_area h2{padding-bottom:20px;}
.btminfo_area h2 .title_text{font-size:28px;line-height:42px;color:#fff;font-weight:300;vertical-align:top;}
.btminfo_area .text01{font-size:24px;line-height:24px;color:#fff;font-weight:300;padding-bottom:12px;letter-spacing:0;}
.btminfo_area .text01 span.highlight{font-weight:500;}
.btminfo_area .text02{font-size:14px;line-height:14px;color:#fff;font-weight:300;vertical-align:top;letter-spacing:0;}


/*공지사항 */
ul.v_notice_list > li.list_notice > a .listview_area{position:relative;width:100%;height:200px;overflow:hidden;text-align:center;background:#364e6b;}
ul.v_notice_list > li.list_publish > a .listview_area{position:relative;width:100%;height:200px;overflow:hidden;text-align:center;background:#5c5249;}
ul.v_notice_list > li.list_press > a .listview_area{position:relative;width:100%;height:200px;overflow:hidden;text-align:center;background:#555a49;}
ul.v_notice_list > li.list_ok > a .listview_area{position:relative;width:100%;height:200px;overflow:hidden;text-align:center;background:#2b5e80;}

ul.v_notice_list > li > a .listview_area .titleimg_item{position:absolute;top:0;left:0;width:327px;height:212px;
-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1);opacity:0.5;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;
background-size:320px 212px;}
ul.v_notice_list > li > a:hover .listview_area .titleimg_item{-webkit-transform:scale(1.12);-moz-transform:scale(1.12);transform:scale(1.12);opacity:0.6;}
ul.v_notice_list > li > a .listview_area .titleimg_item > img{width:327px;height:auto;}
ul.v_notice_list > li.list_notice > a .listview_area .titleimg_item{background:url(../img/support/img_default_notice.png) no-repeat 50%;}
ul.v_notice_list > li.list_publish > a .listview_area .titleimg_item{background:url(../img/support/img_default_publish.png) no-repeat 50%;}
ul.v_notice_list > li.list_press > a .listview_area .titleimg_item{background:url(../img/support/img_default_press.png) no-repeat 50%;}
ul.v_notice_list > li.list_ok > a .listview_area .titleimg_item{background:url(../img/support/img_default_ok.png) no-repeat 50%;}
ul.v_notice_list > li > a .listview_area .img_item{position:absolute;top:55px;left:130px;display:inline-block;width:100px;height:90px;background:url(../img/support/icon_list_notice.png) no-repeat;}

ul.v_notice_list > li > a .textview_area{display:block;height:92px;background:#fff ;border: 1px solid #c1c1c1;}
ul.v_notice_list > li > a .textview_area .subject_item{display:inline-block;font-weight:500;color:#0059a6;padding:10px 20px 0 20px;font-size:16px;line-height:20px;}
ul.v_notice_list > li > a .textview_area .title_item{font-weight:400;color:#333;padding:20px 20px 0 20px;width:320px; height: 80px; overflow:hidden;font-size:15px;line-height:20px;}
ul.v_notice_list > li.list_notice > a:hover .textview_area{background:#fff;border: 1px solid #0059a6;}
ul.v_notice_list > li.list_publish > a:hover .textview_area{background:#fff;border: 1px solid #756d64;}
ul.v_notice_list > li.list_press > a:hover .textview_area{background:#fff;border: 1px solid #707b74;}
ul.v_notice_list > li.list_ok > a:hover .textview_area{background:#fff;border: 1px solid #3a749c;}

ul.v_notice_list > li.list_notice > a .listview_area .img_item{background-position:0 0;}
ul.v_notice_list > li.list_publish > a .listview_area .img_item{background-position:0 -90px;}
ul.v_notice_list > li.list_press > a .listview_area .img_item{background-position:0 -180px;}
ul.v_notice_list > li.list_ok > a .listview_area .img_item{background-position:0 -270px;}


.con_other_v_list{padding-top:110px;position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;visibility:hidden;font-size:0;line-height:0;}
.con_other_v_list ul:after{content:"";display:block;clear:both;}
.con_other_v_list ul > li{float:left;width:25%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.con_other_v_list ul > li.list02,.con_other_list ul > li.list03{padding-left:6px;padding-right:6px;}
.con_other_v_list ul > li.list04{padding-left:6px;}
.con_other_v_list ul > li > a{display:block;}

.con_other_v_list ul > li.list_notice > a .listview_area{position:relative;width:100%;height:134px;overflow:hidden;text-align:center;background:#364e6b;}
.con_other_v_list ul > li.list_publish > a .listview_area{position:relative;width:100%;height:134px;overflow:hidden;text-align:center;background:#5c5249;}
.con_other_v_list ul > li.list_press > a .listview_area{position:relative;width:100%;height:134px;overflow:hidden;text-align:center;background:#555a49;}
.con_other_v_list ul > li.list_ok > a .listview_area{position:relative;width:100%;height:134px;overflow:hidden;text-align:center;background:#2b5e80;}

.con_other_v_list ul > li > a .listview_area .titleimg_item{position:absolute;top:0;left:0;width:249px;height:134px;
-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1);opacity:0.5;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;
background-size:239px 134px;}
.con_other_v_list ul > li > a:hover .listview_area .titleimg_item{-webkit-transform:scale(1.12);-moz-transform:scale(1.12);transform:scale(1.12);opacity:0.7;}
.con_other_v_list ul > li > a .listview_area .titleimg_item > img{width:249px;height:auto;}
.con_other_v_list ul > li.list_notice > a .listview_area .titleimg_item{background:url(../img/support/img_default_notice.png) no-repeat;background-size:249px 134px;}
.con_other_v_list ul > li.list_publish > a .listview_area .titleimg_item{background:url(../img/support/img_default_publish.png) no-repeat ;background-size:249px 134px;}
.con_other_v_list ul > li.list_press > a .listview_area .titleimg_item{background:url(../img/support/img_default_press.png) no-repeat;background-size:249px 134px;}
.con_other_v_list ul > li.list_ok > a .listview_area .titleimg_item{background:url(../img/support/img_default_ok.png) no-repeat ;background-size:249px 134px;}
.con_other_v_list ul > li > a .listview_area .img_item{position:absolute;top:25px;left:88px;display:inline-block;width:65px;height:90px;background:url(../img/support/icon_list_notice.png) no-repeat;}

.con_other_v_list ul > li > a .textview_area{width:100%;display:block;max-height:40px;background:#f0f1f2;font-size:14px;line-height:14px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;font-weight:400;color:#333;padding:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:#fff ;border: 1px solid #c1c1c1;}
.con_other_v_list ul > li.list_notice > a:hover .textview_area{background:#fff;border: 1px solid #0059a6;}
.con_other_v_list ul > li.list_publish  > a:hover .textview_area{background:#fff;border: 1px solid #756d64;}
.con_other_v_list ul > li.list_press  > a:hover .textview_area{background:#fff;border: 1px solid #707b74;}
.con_other_v_list ul > li.list_ok > a:hover .textview_area{background:#fff;border: 1px solid #3a749c;}

.con_other_v_list ul > li.list_notice > a .listview_area .img_item{background-position:0 0;}
.con_other_v_list ul > li.list_publish  > a .listview_area .img_item{background-position:0 -90px;}
.con_other_v_list ul > li.list_press > a .listview_area .img_item{background-position:0 -180px;}
.con_other_v_list ul > li.list_ok  > a .listview_area .img_item{background-position:0 -270px;}

/* 보안가이드 */
.con_about_security{width:1000px;margin:90px auto 110px;text-align:center;}
.con_about_security h2{font-size:45px;line-height:45px;letter-spacing:-2px;font-weight:500;color:#003767;text-align:center;}
.con_about_security .sub_text{font-size:17px;line-height:26px;color:#333;padding-top:20px;text-align:center;}
.con_about_security .img_area{ padding: 30px 0 10px 0; text-align:center;}

.con_purchase_security h2{color:#003767;}
.con_purchase_security ul.inner_list{padding-top:80px;}
.con_purchase_security ul.inner_list li{ width: 780px;margin:0 auto; height: auto; padding-top: 80px;}
.con_purchase_security ul.inner_list li:first-child{ padding-top: 0px;}
.con_purchase_security ul.inner_list li .demo_box{ clear: both; margin:0 auto; display: inline-block; width: 780px; position: relative;}
.con_purchase_security ul.inner_list li h4{ display: inline-block; vertical-align: top; color:#003767;font-size:35px;line-height:35px; padding-left: 30px;}
.con_purchase_security ul.inner_list li h5{ display: inline-block; vertical-align: top; color:#003767;font-size:24px;line-height:24px; padding-left: 30px; padding-top: 10px;}
.con_purchase_security ul.inner_list li .tw{ display:block; vertical-align: top; color:#003767;font-size:35px;line-height:35px; padding-left: 0px;}
.con_purchase_security ul.inner_list li .demo_box .tt_box{ float: left; width: 480px;}
.con_purchase_security ul.inner_list li .demo_box .img_area{  float: left; display: inline-block; width:260px; }
.con_purchase_security ul.inner_list li .demo_box .tt_box .text_area{ display: inline-block; padding-left: 30px; font-size:18px;line-height:28px;color:#333; vertical-align: top; padding-top:20px;}

.con_purchase_security .accordionMenu {margin: 0 auto; width: 780px;background: #fff;margin-top: 20px;}
.con_purchase_security .accordionMenu img {display: block; max-width: 100%; height: auto;text-align: center; padding:10px 0 10px 0;}
.con_purchase_security .accordionMenu h1 { width: 100%; text-align: center;padding:20px 0 20px 0;font-size: 28px; line-height: 28px; border-bottom: 2px solid #ddd; color: #333; font-weight: 500;}
.con_purchase_security .accordionMenu h4 { position:relative;width: 100%; font-size: 18px; line-height: 18px; padding:10px 0 10px 0; display: inline-block;border-bottom: 1px solid #e0e0e0;}
.con_purchase_security .accordionMenu h4 a span{ display: inline-block; position: absolute; width: 20px; right: 20px; height: 14px; background:url(../img/common/icon_select_blue_big.png) no-repeat;background-position:0 0px;}
.con_purchase_security .accordionMenu .active h4 a{font-weight: 500;}
.con_purchase_security .accordionMenu .active h4 a span{ display: inline-block; width: 20px; position: absolute; right: 20px; background:url(../img/common/icon_select_blue_big.png) no-repeat;background-position:0 -14px;}
.con_about_security .accordionMenu h4 a:hover { background: #fff;font-weight: 500;color: #333;}
.con_purchase_security .accordionMenu h4 a {width: 100%;display: inline-block;padding: 10px;font-size: 18px;font-weight: normal;text-decoration: none;background: #fff;color: #333;}
.con_purchase_security .accordionMenu p {margin: 0;padding: 0 10px;overflow: hidden;height: 0; /* 초기의 높이 */transition: height 0.5s ease-in;-webkit-transition: height 0.5s ease-in;-moz-transition: height 0.5s ease-in;-ms-transition: height 0.5s ease-in; -o-transition: height 0.5s ease-in;}
.con_purchase_security .accordionMenu .active p { /* 클릭된 id 하위의 p */ height: 480px;border-bottom: 1px solid #e0e0e0;}

/* 리스트 하단 다른글 네비게이션 
.con_use_view .view_title{padding:18px;margin-top:58px;border-top:2px solid #003767;border-bottom:1px solid #e0e0e0;overflow:hidden;max-height:65px;text-overflow:ellipsis;white-space:nowrap;}
.con_use_view .view_title span{vertical-align:middle;}
.con_use_view .view_title span.sub_title{border:1px solid #003767;padding:1px 8px;font-size:14px;line-height:14px;color:#003767;margin-right:14px;}
.con_use_view .view_title .tag_text{display:inline-block;margin-right:10px;width:56px;height:24px;}

.con_use_view .use .tag_text{background:url(../img/support/icon_tag_use.png) no-repeat;}
.con_use_view .tip .tag_text{background:url(../img/support/icon_tag_tip.png) no-repeat;}
.con_use_view .view_title span.title_text{font-size:18px;line-height:18px;color:#003767;font-weight:400;}
.con_use_view .view_area{font-size:16px;line-height:26px; padding: 50px;}
.con_use_view .view_area .vod_area{ display: block; text-align: center; margin: 0 auto; width: 820px; align-content: center;}
.con_use_view .view_area .text_area{ display: block;text-align: left; padding: 20px 0 30px 40px;}

.con_use_view .inner_sns{text-align:right;padding:40px 0 20px;}
.con_use_view .inner_sns ul{display:inline-block;}
.con_use_view .inner_sns ul:after{content:"";display:block;clear:both;}
.con_use_view .inner_sns ul li{float:left;padding-left:8px;}
.con_use_view .inner_sns ul li a{display:block;width:29px;height:29px;background:url(../img/common/btn_list_sns.png) no-repeat;}
.con_use_view .inner_sns ul li.facebook a{background-position:0 -29px;}
.con_use_view .inner_sns ul li.kakao a{background-position:0 -58px;}
.con_use_view .inner_sns ul li.twitter a{background-position:0 -87px;}
.con_use_view .inner_sns ul li.url a{background-position:0 -116px;}

.con_use_view .go .btn_area{text-align:center;padding:25px 0 25px 0;}
.con_use_view .go .btn_area .btn_go{min-width:160px;text-align:center;}
.con_use_view .go .ttext{ display: block; margin:0 auto; text-align:center; font-size: 15px; line-height: 18px;padding:30px 0 30px 0;}
.con_use_view .btn_area{text-align:right;padding-top:25px;border-top:1px solid #e0e0e0;}
.con_use_view .btn_area .btn_go{min-width:100px;text-align:center;}

.con_use_view .link_list > a{display:block;padding:22px;font-size:16px;line-height:16px;color:#333;height:60px;box-sizing:border-box;-webkit-box-sizing:border-box;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-top:1px solid #e0e0e0;}
.con_use_view .link_list > a .tag_area{float:left;width:15%;text-align:center;}
.con_use_view .link_list > a .tag_area span{vertical-align:top;}
.con_use_view .link_list > a .tag_area .icon{display:inline-block;width:20px;height:14px;background:url(../img/common/icon_select_blue01.png) no-repeat;}
.con_use_view .link_list > a.go_before_list .tag_area .icon{display:inline-block;background-position:0 -14px;}
.con_use_view .link_list > a .title_text{float:left;width:85%;}



.con_other_list{padding-top:110px;}
.con_other_list ul:after{content:"";display:block;clear:both;}
.con_other_list ul > li{float:left;width:25%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.con_other_list ul > li.list01{padding-right:6px;}
.con_other_list ul > li.list02,.con_other_list ul > li.list03{padding-left:6px;padding-right:6px;}
.con_other_list ul > li.list04{padding-left:6px;}
.con_other_list ul > li > a{display:block;}

.con_other_list ul > li > a .listview_area{position:relative;width:100%;height:134px;overflow:hidden;text-align:center;background:#1d415d;}

.con_other_list ul > li > a .listview_area .titleimg_item{position:absolute;top:0;left:0;width:249px;height:134px;
-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1);opacity:0.5;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;
background-size:239px 134px;}
.con_other_list ul > li > a:hover .listview_area .titleimg_item{-webkit-transform:scale(1.12);-moz-transform:scale(1.12);transform:scale(1.12);opacity:0.9;}
.con_other_list ul > li > a .listview_area .titleimg_item > img{width:249px;height:auto;}
.con_other_list ul > li.list_use > a .listview_area .titleimg_item{background:url(../img/support/img_default_use.png) no-repeat;background-size:249px 134px;}
.con_other_list ul > li.list_tip > a .listview_area .titleimg_item{background:url(../img/support/img_default_tip.png) no-repeat ;background-size:249px 134px;}
.con_other_list ul > li > a .listview_area .img_item{position:absolute;top:25px;left:88px;display:inline-block;width:65px;height:90px;background:url(../img/support/icon_list_use.png) no-repeat;}

.con_other_list ul > li > a .textview_area{width:100%;display:block;max-height:40px;background:#f0f1f2;font-size:14px;line-height:14px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;font-weight:400;color:#333;padding:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:#fff ;border: 1px solid #c1c1c1;}
.con_other_list ul > li > a:hover .textview_area{background:#fff;border: 1px solid #0059a6;}

.con_other_list ul > li.list_news > a .listview_area .img_item{background-position:0 0;}
.con_other_list ul > li.list_tip > a .listview_area .img_item{background-position:0 -90px;}

*/

.blind.active {width: 100%; height: 100%; visibility: visible; background: #000; opacity: .5; z-index: 5; }

.ok_class_wrap {display: flex;}
.ok_class h2 {font-size: 45px; line-height: 45px; font-weight: 500; letter-spacing: -2px; color: #003767; text-align: center;}
.ok_class .sub_text {font-size: 18px; line-height: 26px; color: #333; padding-top: 35px; text-align: center; margin-bottom: 100px;}
.ok_class_img {width: 440px; max-width: 100%; }
.ok_class_img img {width: 100%; max-width: 100%;}
.ok_class_txt {width: calc(100% - 440px); padding-left: 50px; font-size: 18px; line-height: 1.5; color: #333;}
.ok_class_txt .date {margin: 28px 0;}
.ok_class_txt .date span {display: inline-block; padding: 4px 8px; border: 1px solid #0059A6; color: #0059A6;border-radius: 2px; margin-right: 8px; font-size: 16px;}
.ok_class_txt .more-btn {display: inline-flex; align-items: center; justify-content: center; padding: 12px 65px;font-size: 20px; font-weight: 700;color: #fff; background: #0059A6; }
.ok_class_txt .more-btn img {margin-left: 20px; width: 9px;}
/* .sub_row_none.wt {border-color: #fff;} */
.sub_row_none.wt .con_boardlist .boardlist_area {padding-top: 0;}

/* 오 피스키퍼 보안클래스 뷰페이지 */
.ok-class-view {word-break: keep-all;}
.ok-class-view .layout {width: 875px; max-width: 100%;position: relative; margin: 0 auto;}
.ok-class-view img {max-width: 100%; }
.ok-class-view .title-wrap {margin-bottom: 40px; text-align: center; margin-bottom: 40px;}
.ok-class-view .title-wrap strong {font-size: 35px; color: #003A6C; font-weight: 800; line-height: 1.3;}
.ok-class-view .title-wrap p {color: #6B7280; margin-top: 40px; font-size: 18px;}
.ok-class-view * + .title-wrap {margin-top: 118px;}

.ok-class-view-logo {width: 113px; margin-left: 47px; margin-bottom: 114px;}
.ok-class-view #section01 {position: relative; padding: 40px 0 128px; background: #F2F6FE;}
/* .ok-class-view #section01::before {content: ""; width: 100%; height: 100%; background: #F2F6FE; position: absolute; top: 0; left: 0;} */
.ok-class-view #section01 .box-list {margin: auto; margin-top: 54px; display: flex; width: 620px; max-width: 100%; }
.ok-class-view #section01 .box-list > li {width: calc(100% / 3); background: #F2F6FE;box-shadow: 0px 1px 30px rgba(121, 152, 193, 0.3); padding: 20px 20px 40px 20px; font-size: 16px;color: #6B7280; position: relative;}
.ok-class-view #section01 .box-list > li:first-of-type {border-radius: 20px 0px 0px 20px;}
.ok-class-view #section01 .box-list > li:last-of-type {border-radius: 0px 20px 20px 0px;}
.ok-class-view #section01 .box-list > li img {position: absolute; width: 50px; bottom: 20px; right: 20px;}

.ok-class-view #section02 {position: relative;}
.ok-class-view #section02::before {content: ""; width: 100%; height: 80%; position: absolute; top: 0; left: 0; background: #F2F6FE;}
.ok-class-view #section02 table {box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
  border-radius: 24px; background: #fff; overflow: hidden; width: 100%;}
.ok-class-view #section02 table tbody th {padding: 25px; font-size: 16px; font-weight: 600; color: #fff;background: #3E6EB9;}
.ok-class-view #section02 table tbody td {padding: 20px 30px; font-size: 16px;color: 
  #4B5563;}
.ok-class-view #section02 table tbody td .popup-btn {display: inline-block; color: #6B7280; font-size: 12px; color: #6B7280 ;border: 1px solid #E7E9EC;border-radius: 6px;padding: 6px 14px; margin-left: 10px; line-height: 1.3;}
.ok-class-view #section02 table tbody tr {border-bottom: 1px solid rgb(177 177 177 / 25%);}
.ok-class-view #section02 table tbody tr:last-of-type {border-bottom: 0;}

html.active2::before {content: ""; width: 100vw;height: 100vh; background: #000; opacity: .4; position: absolute; top: 0; left: 0; z-index: 5;}
.ok-class-view .plan-popup {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 620px; max-width: 92% !important; background: #fff; padding: 50px 53px 20px 53px;text-align: center; z-index: 10; display: none; box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);}
.plan-popup-close {position: absolute; top: 20px; right: 20px;} 
.plan-popup-swiper-arrow {position: absolute; top: 50%; left: 0; width:100%; display: flex; justify-content: space-between; align-items: center; z-index: 1; padding: 0 10px;}
.plan-popup-swiper-arrow button {width: 40px; height: 40px !important;  border-radius: 50%; background: #fff;box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.06);display: flex; align-items: center; justify-content: center; }
.plan-popup-swiper-arrow button.swiper-button-disabled path {stroke: #9AA1B6;}
.plan-popup-swiper-arrow button svg {width: 17px; height: 20px !important;}

.ok-class-view #section03 {margin-top: 118px;}
.ok-class-view #section03 .sec3-list {display: flex; flex-wrap: wrap; margin: -15px -8px;}
.ok-class-view #section03 .sec3-list > li {width: calc(100% / 3); padding: 15px 8px; box-sizing: border-box;}
.ok-class-view #section03 .sec3-list > li > div {border-radius: 30px; overflow: hidden; box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.1); height: 100% !important; }
.ok-class-view #section03 .sec3-list-top {padding: 24px; color: #fff; min-height: 200px; position: relative;}
.ok-class-view #section03 .sec3-list > li:first-of-type .sec3-list-top {background: 
  #0059A6;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(2) .sec3-list-top {background: 
  #006299;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(3) .sec3-list-top {background: 
  #04347D;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(4) .sec3-list-top {background: 
  #0042A6;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(5) .sec3-list-top {background: 
  #0A4ECD;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(6) .sec3-list-top {background: 
  #5398FF; display: flex; flex-direction: column; align-items: center;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(6) .sec3-list-top > span {display: inline-block;background: #FFFFFF;border-radius: 15px;padding: 4px 16px; color: #5398FF;font-weight: 700; line-height: 1.2; margin-bottom: 20px;}
.ok-class-view #section03 .sec3-list-bottom {padding: 24px; background: #fff; min-height: 170px;}
.ok-class-view #section03 .sec3-list-top-top {display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;}
.ok-class-view #section03 .sec3-list-title-wrap {display: flex; align-items: center; margin-bottom: 10px;}
.ok-class-view #section03 .sec3-list-title-wrap strong {padding-right: 20px;}
.ok-class-view #section03 .sec3-list > li:first-of-type .sec3-list-top-top {color: #0059A6;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(2) .sec3-list-top-top {color: #006299;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(3) .sec3-list-top-top {color: #04347D;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(4) .sec3-list-top-top {color: #0042A6;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(5) .sec3-list-top-top {color: #0A4ECD;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(6) .sec3-list-top-top {color: #5398FF;}
.ok-class-view #section03 .sec3-list-num { width: 27px; height: 24px; text-align: center; background: #fff;border-radius: 4px; font-size: 16px; font-weight: 700; line-height: 1.4;}
.ok-class-view #section03 .sec3-list-label {background: #CCFF02; font-size: 14px; font-weight: 600; padding: 0 10px; border-radius: 20px;}
.ok-class-view #section03 .sec3-list-title {font-size: 22px; font-weight: 500; word-break: keep-all;}
.ok-class-view #section03 .sec3-list-date {margin-top: 10px; font-size: 14px; color: #F1F6FE;}
.ok-class-view #section03 .sec3-list-top img {position: absolute; right: 24px;}
.ok-class-view #section03 .sec3-list > li:first-of-type .sec3-list-top img{bottom: -10px;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(2) .sec3-list-top img {bottom:-10px ;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(3) .sec3-list-top img {bottom: -14px;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(4) .sec3-list-top img {bottom: -27px;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(5) .sec3-list-top img {bottom: -20px;}
.ok-class-view #section03 .sec3-list > li:nth-of-type(6) .sec3-list-top img {position: static;}

.ok-class-view #section03 .sec3-list-bottom >b {color: #374151; font-size: 16px; display: block; margin-bottom:8px ; line-height: 1.5; word-break: keep-all;}
.ok-class-view #section03 .sec3-list-bottom p {color: #6B7280; font-size: 14px; line-height: 1.5; word-break: keep-all;}
.ok-class-view #section03 .sec3-list-bottom a {display: inline-block; padding:0 14px; color: #0059A6;border: 1px solid #0059A6;
  border-radius: 6px; margin-top: 8px; font-size: 12px;}
.ok-class-view #section03 .sec3-list-bottom .btn-wrap {display: flex; justify-content: flex-end;}

.ok-class-view #section04 {padding-top: 140px; padding-bottom: 80px;}
.ok-class-view #section04 .profile-img {width: 100px; margin: auto; display: block; margin-bottom: 20px}
.ok-class-view #section04 .profile-name {font-size: 16px; text-align: center; margin-bottom: 20px;}
.ok-class-view #section04 .profile-name b {font-size: 20px ; color: #00315B; font-weight: 800; padding: 0 8px;}
.ok-class-view #section04 .profile {background: #F2F6FF;border-radius: 20px; font-size: 14px; color: #6B7280; padding: 20px 30px; display: flex;}
.ok-class-view #section04 .profile > div {width: 50%;}
.ok-class-view #section04 .profile > div > b {display: block;}
.ok-class-view #section04 .profile .dot-list {padding-left: 10px;}

.dot-list > li {position: relative; padding-left: 15px;}
.dot-list > li::before {content: ""; width: 3px; height: 3px; border-radius: 50%; background: #6B7280; position: absolute; top: 12px; left: 0;}
.txt-list > li {position: relative; padding-left: 10px;}
.txt-list > li::before {content: "-"; position: absolute; top: 0; left: 0;}

.con_form_area {word-break: keep-all;}
.con_form_area .title-label {display: inline-block; background: #E8F0FD;font-weight: 700; font-size: 18px;color: #0059A6;padding: 25px 55px; border: 2px solid #E8F0FD;box-shadow: 0px 1px 20px rgba(22, 104, 227, 0.12);border-radius: 24px 2px; margin-bottom: 54px;}
.ok-class-form h4 .title {font-size: 35px;color: #003A6C;font-weight: 800; margin-bottom: 54px; display: block; line-height: 1.3;}
.ok-class-form h4 + .dot-list {font-size: 14px; margin-bottom: 30px;}
.ok-class-form .btn_area .btn {padding: 20px 60px; display: inline-flex; align-items: center; }
.ok-class-form .btn_area .btn img {margin-left: 14px;}
.ok-class-form .privacy-btn {display: inline-block; margin-left: 10px; border: 1px solid #E7E9EC; border-radius: 6px; padding: 5px 14px; font-size: 12px; color: #6B7280; line-height: 1.2;}
.con_event_view .con_scrollarea_terms {padding: 24px; height: auto; overflow: visible;}
.con_event_view .con_scrollarea_terms label.icheck > em {font-size: 18px; font-weight: 700; }
.con_event_view .con_scrollarea_terms p {margin-top: 10px;}
.privacy-popup { position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 620px;max-width: 92% !important;background: #fff;padding:60px 40px 45px 40px;z-index: 10;box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15); display: none;}
.privacy-popup-txt {font-size: 14px; color: #4B5563;}
.privacy-popup-txt b {font-size: 16px;}

.ok-class-view #section06 {padding: 90px 0; background: #F1F6FE;}
.ok-class-view #section06 .sec6-list {display: flex; margin: -10px;}
.ok-class-view #section06 .sec6-list > li {width: 25%;padding: 10px;}
.ok-class-view #section06 .sec6-list > li > div {background: #F4F8FF;box-shadow: 0px 1px 100px rgba(22, 104, 227, 0.12);border-radius: 24px; padding: 40px 24px; height: 100% !important; display: flex; flex-direction: column; align-items: center; text-align: center; line-height: 1.5;}
.ok-class-view #section06 .sec6-list > li img {width: 100px; height: 100px; object-fit: contain; margin-bottom: 24px;}
.ok-class-view #section06 .sec6-list > li strong {font-size: 18px; font-weight: 600; color: #00315B; margin-bottom: 24px;}
.ok-class-view #section06 .sec6-list p {font-size: 14px;}
.ok-class-view #section06 .sec6-list .txt-list {font-size: 14px;}
.ok-class-view #section06 .sec6-list .blue {color: #3A4CA0;font-weight: 600;}

.ok-class-view #footer {padding: 70px 0; text-align: center;}
.ok-class-view #footer .foot-list {display: flex; align-items: center ; justify-content: center; font-size: 13px; margin: -5px -16px; line-height: 1.3;}
.ok-class-view #footer .foot-list > div {padding: 5px 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.ok-class-view #footer .foot-list > div:first-of-type {position: relative;}
.ok-class-view #footer .foot-list > div:first-of-type::before {content: ""; width: 1px; height: 15px; background: #E7E9EC; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.ok-class-view #footer .foot-list b {color: #00315B; font-size: 16px;}
.ok-class-view #footer .foot-list a {color: #00315B;  font-size: 16px; font-weight: 700;}
.ok-class-view #footer .foot-list a:first-of-type {margin-right: 14px;}
.ok-class-view #footer .foot-list a i {margin-right: 5px;}

label.icheck > span {height: 16px !important;}

@media (max-width:1024px) {
    .graph_box {
        width: 100%;
    }

    .graph_box li .graph_img img {
        max-width: 100%;
    }

    .graph_box li .graph_box {
        padding-left: 10px;
        padding-right: 10px;
    }

    .graph_box li .graph_text {
        width: calc(100% - 75px);
    }

    .con_about_support h2 {
        font-size: 35px;
    }

    .con_about_support .sub_text {
        font-size: 16px;
    }

	.con_event_list dl dt a img {
        max-width: 100%;
    }

    .con_event_list dl dd .text_title .title {
        white-space: normal;
    }

	.con_event_view .view_title {
		max-height: none !important;
        white-space: normal;
        position: relative;
	}

	.con_event_view .view_title span.title_text {
        display: block;
        padding-left: 66px;
    }

	.con_event_view .view_title .tag_text {
        position: absolute;
        left: 10px;
        top: 20px;
    }


    .con_purchase_service ul.inner_list li {
        width: 100%;
        height: auto;
        margin-bottom: 50px;
    }

    .con_purchase_service ul.inner_list li:last-of-type {
        margin-bottom: 0;
    }

    .con_purchase_service ul.inner_list li .demo_box {
        width: 100%;
        position: relative;
        padding-left: 260px;
    }

    .con_purchase_service ul.inner_list li .demo_box .img_area {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        overflow: hidden;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box {
        width: 100%;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box .caution_text p {
        width: 100%;
    }
    
    .con_purchase_service ul.inner_list li .demo_box .img_area_right {
        right: 0;
        position: absolute;
        height: 100%;
        overflow: hidden;
    }

    .con_purchase_after .con_purchase_service ul.inner_list li .demo_box {
        padding-left: 0;
        padding-right: 280px;
    }

	.con_submit_complete {
		width:100%;
		padding:60px 40px;
	}
	.con_submit_complete .text_area .text {
		margin-top:20px;
	}
	.con_submit_complete .text_area .title {
		line-height:1.3;
		padding-bottom:0;
	}

	.con_submit_complete .btn_area { 
		padding-top:15px; 
	}

    .con_contactlist_area ul {
        width: 100%;
        padding: 0 20px;
    }

    .con_contactlist_area ul li {
        padding: 0 20px;
    }

    .con_contactlist_area ul li .btn_area {
        margin-top: 20px;
    }

    .con_about_update {
        width: 100%;
        overflow: auto;
    }

    .con_about_update .step_area {
        position: relative;
        background-size: cover;
    }

    .con_boardlist {
        width: 100%;
        margin: 60px auto;
    }

    .con_boardlist h2 {
        font-size: 35px;
    }

    .con_boardlist .sub_text {
        font-size: 16px;
    }

    .boardlist_area dl {
        width: 100%;
    }

    .boardlist_area dl dt {
        width: 350px;
    }

    .boardlist_area dl dt a {
        display: block;
    }

    .boardlist_area dl dt a img {
        width: 100%;
    }

    .boardlist_area dl dd {
        width: calc(100% - 350px);
    }

    .boardlist_area dl dd .text_title {
        width: 100%;
        text-overflow: initial;
        padding: 7px 0 12px;
    }

    .boardlist_area dl dd .text_title .title {
        overflow: hidden;
		display:block;
        text-overflow: ellipsis;
        white-space: normal !important;
        width: 100% !important;
        padding-left: 0;
		margin-top:10px;
        margin-right: 0 !important;
    }

    .boardlist_area dl dd .text_title .tag_text {
        margin-right: -4px;
    }

    .con_tab_btn_area {
        width: 100%;
        text-align: center;
    }

    .con_tab_btn_area .tab_btn {
        display: inline-block;
    }

    .con_tab_btn_area .tab_btn ul {
        display: block;
    } 

    .con_tab_btn_area .tab_btn ul li {
        display: inline-block;
        float: none;
    }

    ul.use_list > li > a .textview_area .title_item {
        width: 100%;
    }

    ul.use_list > li > a .textview_area {
        width: 100%;
    }

    .cardlist.use_list {
        margin: 0 -6px;
    }

    ul.use_list > li > a .listview_area {
        height: auto;
    } 

    ul.use_list > li > a .listview_area .title_img {
        position: relative;
        height: auto;
        top: auto;
        left: auto;
    }

    .con_about_security {
        width: 100%;
    }

    .con_about_security h2 {
        font-size: 35px;
    }

    .con_about_security .sub_text {
        font-size: 16px;
    }

    .con_purchase_security .accordionMenu h1 {
        font-size: 24px;
    }

    .scroll_wrap {
        overflow: hidden;
    }

    .con_about_pre,
    .con_about_seminar {
        margin :60px 0;
        width: 100%;
    }

    .con_about_adminedu {
        width: 100%;
    }

    .con_about_adminedu ul.con_edulist > li {
        display: inline-block;
        float: none;
        vertical-align: top;
        margin: 10px;
    }

    .con_purchase_service ul.gm_list li {
        padding-bottom: 0;
    }

    .gm_top_visual {
        padding-left: 40px;
        padding-right: 40px;
    }

    .gm_top_visual h1 {
        font-size: 45px;
    }

    .gm_top_visual h1 span {
        font-size: 30px;
    }

    .gm_top_visual .sub_text {
        font-size: 20px;
    }

    /* 210812 */
    .con_about_pre .con_info {
        width: 100%;
        height: auto;
        background: transparent;
        margin: 40px auto 0;
    }

    .con_about_pre .sub_text,
    .con_boardlist .sub_text {
        font-size: 16px;
        line-height: 1.35;
    }

    .con_about_pre .con_info ul.text_top_list {
        width: 100%;
        padding-top: 0;
    }

    .con_about_pre .con_info ul.text_top_list li {
        width: 32.3333% !important;
        margin-right: 1%;
        padding: 20px 10px;
        padding-top: 80px;
        position: relative;
        font-size: ;
    }
    
    .con_about_pre .con_info ul.text_top_list li:nth-of-type(3n) {
        margin-right: 0;
    }

    .con_about_pre .con_info ul.text_top_list li::before {
        display: block;
        content: "";
        position: absolute;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% - 20px);
        height: 45px;
        background-size: contain;
        background-position: center 0;
        background-repeat: no-repeat;
    }

    .con_about_pre .con_info ul.text_top_list li.item01 {
        background: #687e95;
    }

    .con_about_pre .con_info ul.text_top_list li.item01::before {
        background-image: url(../img/support/about-pre1.png);
    }
    
    .con_about_pre .con_info ul.text_top_list li.item02 {
        background: #558fcc;
    }
    
    .con_about_pre .con_info ul.text_top_list li.item02::before {
        background-image: url(../img/support/about-pre2.png);
    }
    
    .con_about_pre .con_info ul.text_top_list li.item03 {
        background: #306094;
    }

    .con_about_pre .con_info ul.text_top_list li.item03::before {
        background-image: url(../img/support/about-pre3.png);
    }
    
    .con_about_pre .con_info ul.text_list {
        border: 2px solid #306094;
        border-radius: 30px;
        margin-top: 20px;
        padding: 10px 25px;
    }

    .con_about_pre .con_info ul.text_list li {
        position: relative;
        top: auto !important;                      
        left: auto !important;
        bottom: auto !important;
        right: auto !important;
        padding-top: 0;
        text-align: left;
        border-bottom: 1px solid #c9c9c9;
        padding: 15px 0;
        padding-left: 65px;
        min-height: 70px;
    }

    .con_about_pre .con_info ul.text_list li:last-of-type  {
        border-bottom: none;
    }

    .con_about_pre .con_info ul.text_list li::before {
        display: inline-block;
        content: "";
        width: 37px;
        height: 40px;
        position: absolute;
        top: 15px;
        left: 0;
    } 

    .con_about_pre .con_info ul.text_list li.list01::before {
        background: url(../img/support/about-pre4.png)no-repeat center center / cover;
    } 
    
    .con_about_pre .con_info ul.text_list li.list02::before {
        background: url(../img/support/about-pre5.png)no-repeat center center / cover;
    } 
    
    .con_about_pre .con_info ul.text_list li.list03::before {
        background: url(../img/support/about-pre6.png)no-repeat center center / cover;
    }
    
    .con_about_pre .con_info ul.text_list li br {
        display: none;
    }

    .con_about_adminedu .sub_text {
        font-size: 16px;
        line-height: 1.35;
    }

    .con_about_adminedu {
        margin: 60px 0;
    }

    .con_about_update {
        padding-bottom: 60px;
    }

    .con_about_update .hidden-img { display: block;} 

    .con_about_update .step_area { display: none; }

	.con_inquiry_area .inquiry_detail {
		padding:20px !important;
		max-width:100%;
	}
	.con_inquiry_area .inquiry_detail br {
		display:block !important;
	}

  .ok-class-view #section03 .sec3-list,
  .ok-class-view #section06 .sec6-list {
    max-width: none !important;
  }
}

@media (max-width:946px) {
/*     
    .con_about_pre .con_info{
        overflow: auto;
        width: 100%;
        background-size: cover;
    }

    .con_about_pre .con_info ul.text_top_list {
        width: 840px;
    }

    .con_about_pre .text_list {
        width: 840px;
        position: relative;
    }  */
}

@media (max-width:820px) {

    .graph_box li {
        width: 100%;
        float: none;
        padding: 30px 0;
    }

    .graph_box li .graph_img {
        padding-bottom: 0;
    }

    .con_purchase_security ul.inner_list li {
        width: 100%;
    }

    .con_purchase_security ul.inner_list li .demo_box {
        width: 100%;
        text-align: center;
    }

    .con_purchase_security ul.inner_list li .demo_box .img_area {
        float: none;
        display: block;
        margin: auto;
    }

    .con_purchase_security ul.inner_list li h4 {
        display: block;
        padding-left: 0;
        margin: 15px 0;
    }

    .con_purchase_security ul.inner_list li .demo_box .tt_box {
        display: block;
        float: none;
        width: 100%;
    }

    .con_purchase_security ul.inner_list li h5 {
        padding-left: 0;
    }

    .con_purchase_security ul.inner_list li .demo_box .tt_box .text_area {
        padding-left: 0;
    }

    .con_purchase_security .accordionMenu {
        width: 100%;
    }

    .con_purchase_security .accordionMenu :target p {
        height: auto;
    }

    .ok_class_wrap {
      flex-direction: column;
    }
    .ok_class_txt {
      width: 100%;
      padding-left: 0;
      margin-top: 40px;
    }
    .ok_class_img {
      width: 100%;
    }

    .ok-class-view .layout {
      padding: 0 20px;
    }
    .ok-class-view #section03 .layout, .ok-class-view #section04 .layout {
      padding: 0;
    }
    .ok-class-view #section01 .box-list {
      flex-direction: column;
    }
    .ok-class-view #section01 .box-list > li {
      width: 100%;
      padding: 20px 82px 40px 20px;
    }
    .ok-class-view #section01 .box-list > li:first-of-type {
      border-radius: 20px 20px 0 0;
    }
    .ok-class-view #section01 .box-list > li:last-of-type {
      border-radius: 0 0 20px 20px;
    }
    .ok-class-view #section03 .sec3-list > li {
      width: 50%;
    }
    .ok-class-view #section06 .sec6-list {flex-wrap: wrap;}
    .ok-class-view #section06 .sec6-list > li {
      width: 50%;
    }
    .ok-class-view #footer {padding: 50px 0;}
    .ok-class-view #footer .foot-list {flex-direction: column;}
    .ok-class-view #footer .foot-list > div:first-of-type::before {display: none;}
}

@media (max-width:768px) {

    .con_purchase_security ul.inner_list li {
        padding-top: 40px;
    }

    .con_purchase_security ul.inner_list li:nth-of-type(3) {
        padding-top: 0;
    }

    .con_purchase_service ul.inner_list li h4,
    .con_purchase_service ul.inner_list li .tw {
        font-size: 25px;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box .text_area,
    .con_purchase_service ul.inner_list li .demo_box .tt_box .text_area_tw {
        font-size: 16px;
        line-height: 24px;
    }

    .con_purchase_service ul.inner_list.gm_list li .demo_box .tt_box .text_area br {
        display: block !important;
    }

    .con_contactlist_area {
        padding: 60px 0;
    }

    .con_contactlist_area ul li {
        width: 100%;
        padding: 0;
        float: none;
        margin-bottom: 30px;
    }

    .con_contactlist_area ul li:last-oft-type {
        margin-bottom: 0;
    }

    .con_contactlist_area ul li .sub_text {
        min-height: initial;
    }

    .con_contactlist_area ul li .contact_info {
        margin-top: 10px;
    }

    .con_contactlist_area ul li .tltle {
        padding: 0;
    }

	.con_submit_complete {
		padding:50px 20px;
	}

    .con_about_support {
        padding-top: 60px;
    }

    .con_faq_area {
        padding-top: 40px;
    }
    
    .con_faq_area .table_style02 colgroup col:nth-of-type(1) {
        width: 30px;
    }  

    .con_faq_area table td {
        padding: 10px;
    }

    .graph_box {
        padding-top: 30px;
    }

    
    .con_form_area h4 .title + span {
        display: block;
        margin: 10px 0;
    }

    .con_form_area ul.terms_chk_area li {
        position: relative;
    }

    .con_cardlist_area ul.cardlist > li {
        width: 50%;
    }

    .con_about_security {
        margin: 60px auto;
    }

    .boardlist_area dl dt {
        width: 100%;
        float: none;
        margin-bottom: 20px;
    }

    .boardlist_area dl dd {
        width: 100%;
        float: none;
        padding-left: 0;
    }

    .boardlist_area dl dd .text_title .tag_text {
        display: block;
        margin-right: 0;
        font-size: 12px;
    }

    .boardlist_area dl.event_off dd .text_title .title {
        display: block;
        margin-right: 0;
        width: 100%;
        text-overflow: initial;
        padding-left: 0;
        margin-top: 10px;
        white-space: normal;
        font-size: 18px;
    }

    .boardlist_area dl.event_off dd .detail_text {
        font-size: 14px;
    }

    
    .con_boardlist .boardlist_area {
        padding-top: 0px;
    }

    .gm_top_visual {
        padding-left: 20px;
        padding-right: 20px;
    }

    .gm_top_visual h1 {
        font-size: 35px;
    }

    .gm_top_visual h1 span {
        font-size: 23px;
    }

    .gm_top_visual .sub_text {
        font-size: 18px;
    }

    .gm_pro_list li {
        width: 100%;
        padding: 0;
        margin-bottom: 40px;
    }

    .gm_pro_list li:last-of-type {
        margin-bottom: 0;
    }

    .scroll_wrap {
        overflow: hidden;
    }

    .con_about_seminar .con_info {
        width: 100%;
        height: auto;
        background: transparent;
        margin: 40px 0 0;
    }

    .con_about_seminar .con_info ul.text_list {
        margin-bottom: 100px;
    }

    .con_about_seminar .con_info ul.text_list::after {
        display: block;
        content: "";
        position: absolute;
        top: calc(100% + 25px);
        left: 0;
        width: 100%;
        height: 50px;
        background: url(/assets/img/support/people-arrow.png)no-repeat center center / contain;
    }

    .con_about_seminar .con_info ul.text_list {
        background: #003f78;
        border-radius:25px;
        padding: 25px;
    }

    .con_about_seminar .con_info ul.text_list li {
        position: relative;
        top: auto !important;
        left: auto !important;
        bottom: auto !important;
        right: auto !important;
        color: #fff;
        padding-top: 0;
        margin-bottom: 20px;
        text-align: left;
        padding-left: 70px;
        font-weight: 300;
        min-height: 50px;
        padding-top: 4px;
        font-size: 15px;
    }

    .con_about_seminar .con_info ul.text_list li br {
        display: none;
    }

    .con_about_seminar .con_info ul.text_list li::before {
        display: block;
        content: "";
        width: 50px;
        height: 50px;
        border-radius: 50%;
        position: absolute;
        top: 0;
        left: 0;
        background-color: #fff;
    }

    .con_about_seminar .con_info ul.text_list li:first-of-type::before {
        background: #fff url(/assets/img/support/people1.png)no-repeat center bottom 0 / contain;
    }
    
    .con_about_seminar .con_info ul.text_list li:nth-of-type(2)::before {
        background: #fff url(/assets/img/support/people2.png)no-repeat center bottom 0 / contain;
    }
    
    .con_about_seminar .con_info ul.text_list li:nth-of-type(3)::before {
        background: #fff url(/assets/img/support/people3.png)no-repeat center bottom 0 / contain;
    }

    .con_about_seminar .con_info ul.text_list li:last-of-type {
        margin-bottom: 0;
    }

    .con_about_seminar .con_info p {
        position: relative;
        top: auto !important;
        left: auto !important;
        bottom: auto !important;
        right: auto !important;
        font-size: 15px;
        color: #003f78;
        height: auto;
        line-height: 1.3;
        padding: 12px 10px;
        display: block;
        width: 100%;
        border: 1px solid #003f78;
        margin-bottom: 8px;
    }

    .con_about_seminar .con_info p:last-of-type {
        margin-bottom: 0;
    }

    .con_boardlist {
        margin: 40px 0;
    }

    
    .con_about_pre .con_info ul.text_top_list li {
        font-size: 16px;
        min-height: 126px;
        padding-bottom: 0;
        line-height: 1.2;
    }

    .con_about_adminedu ul.con_edulist {
        width: 100%;
        padding: 40px 0 0;
    }

    .con_about_adminedu ul.con_edulist > li {
        width: 100%;
        display: block;
        height:auto;
        margin: 0;
        padding: 20px;
        position: relative;
        margin-bottom: 10px;
        padding-left:150px;
        text-align: left;
    }

    .con_about_adminedu ul.con_edulist > li:last-of-type {
        margin-bottom: 0;
    }

    .con_about_adminedu ul.con_edulist > li .icon {
        position: absolute;
        top: 50%;
        left: 47px;
        transform: translateY(-50%);
        margin-top: 0;
        width: 63px;
        height: 55px;
        background-size: cover;
    }

    .con_about_adminedu ul.con_edulist > li.list02 .icon {
        background-position: 0 -55px;
    }

    
    .con_about_adminedu ul.con_edulist > li.list03 .icon {
        background-position: 0 -110px;
    }

    .con_about_adminedu ul.con_edulist > li .title {
        display: block;
        width: 100%;
        margin-right:-4px;
        padding-top: 0;
        font-size: 18px;
        line-height: 1.5;
    }

    .con_about_adminedu ul.con_edulist > li ul.text_list {
        padding-top: 0;
    }

    .con_about_adminedu ul.con_edulist > li > ul.text_list li {
        font-size: 12px;
        line-height: 12px;
        padding: 2px;
    }

    .con_about_update {
        padding-bottom: 30px;
    }

    .ok-class-view #section02 table tbody td br {
      display: block;
    }
}

@media (max-width:640px) {
    .con_form_area {
        width: 100%;
    }
    .manage_support_list {
        flex-direction: column;
    }
}

@media (max-width:587px) {

    .con_about_support {
        padding-top: 40px;
    }

    .graph_box {
        padding-top: 10px;
    }

    .con_about_support .sub_text {
        padding-top: 10px;
    }
    
    
    .con_purchase_service ul.inner_list li .demo_box,
    .con_purchase_after .con_purchase_service ul.inner_list li .demo_box {
        padding-left: 0;
        padding-right: 0;
    }

    .con_purchase_service ul.inner_list li .demo_box .img_area,
    .con_purchase_service ul.inner_list li .demo_box .img_area_right {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        height: auto;
        width: 100%;
        margin-bottom: 20px;
        float: none;
        display: none;
    }

    .con_purchase_service ul.inner_list li .demo_box .img_area img,
    .con_purchase_service ul.inner_list li .demo_box .img_area_right img {
        width: 100%;
    }

    .con_purchase_service ul.inner_list li h4,
    .con_purchase_service ul.inner_list li .demo_box .tt_box * {
        padding-left: 0 !important;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box .btn_s {
        padding-left: 14px !important;
    }

    
    .con_about_support .search_area {
        width: 100%;
    }

    .search_area input[type=text] {
        width: calc(100% - 105px);
    }
    
    .con_form_area ul.inner_list {
        width: 100%;
    }
    .con_form_area ul.inner_list li {
        padding-top: 0;
        padding-right: 20px;
    }

    .con_form_area ul.inner_list li.list_four {
        width: 50%;
        text-align: left;
    }
    
    .con_form_area .btn_area {
        padding-top: 40px;
    }

    .con_form_area .btn_area .caution_area span {
        line-height: 20px;
    }
    
    label.icheck {
        display: block;
        width: 100%;
    }
    
    label.icheck > span {
        margin-right: -4px;
        vertical-align: top;
    }

    label.icheck > span + em {
        width: calc(100% - 16px);
        margin-right: -4px;
        font-size: 14px;
        padding-left:15px;
        vertical-align: top;
        text-align: left;
    }

    .con_purchase_service ul.inner_list {
        padding-top: 30px;
    }

    .con_purchase_service ul.inner_list li {
        margin-bottom: 30px;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box .text_area {
        padding-top: 10px;
    }

    .con_purchase_service ul.inner_list li h4, .con_purchase_service ul.inner_list li .tw {
        font-size: 23px;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box .caution_text {
        padding: 5px 0 0 30px;
    }

    .con_purchase_service ul.inner_list li .demo_box .tt_box .btn_area {
        padding-top: 15px;
    }
/*     
    .con_about_security .img_area {
        width: 100%;
        overflow: auto;
    }

    .con_about_security .img_area img {
        width: 587px;
        max-width: initial;
    } */

    .con_purchase_security ul.inner_list li h5 {
        font-size: 20px;
    }

    .con_purchase_security ul.inner_list li .demo_box .tt_box .text_area {
        font-size: 16px;
    }

    .con_purchase_security ul.inner_list li .demo_box .tt_box .text_area br {
        display: none;
    }

    .checkbox_tooltip {
        position: relative;
    }

    .con_purchase_security .accordionMenu h4 a {
        font-size: 16px;
    }

    .gm_top_visual h3 {
        width: 100%;
        padding: 10px 15px;
        height: auto;
        line-height: 1.4;
    }

    .gm_top_visual h3 span {
        display: inline-block;
        margin-right: 5px;
        font-size: 15px;
    }

    .balloon_grp {
        position: relative;
    }

    .gm_top_visual .balloon_grp span {
        font-size: 18px;
    }

    .gm_top_visual .balloon_grp span.left_bx {
        width: 140px;
        height: 77px;
        background-size:cover;
        line-height: 64px;
        margin-left: -143px;
        bottom: auto;
        top: 50px;
    }
    
    .gm_top_visual .balloon_grp span.right_bx {
        width: 140px;
        height: 73px;
        background-size:cover;
        line-height: 59px;
        margin-left: 4px;
        bottom: auto;
        top: 73px;
    }

    .ok-class-view #section04 .profile {
      flex-direction: column;
    }
    .ok-class-view #section04 .profile > div {
      width: 100%;
    }
    .ok-class-view #section04 .profile > div:first-of-type {
      margin-bottom: 10px;
    }
}

@media (max-width:530px) {
    .con_cardlist_area ul.cardlist > li {
        width: 100%;
    }
    .ok-class-view-logo {margin-left: 20px; margin-bottom: 65px;}
    .ok-class-view #section02 table tbody td .popup-btn, .ok-class-form .privacy-btn {margin-left: 0; margin-top: 10px;}
    .ok-class-view #section02 table tbody td {padding: 20px;}
}


@media (max-width: 487px) {
    .graph_box li .graph_box {
        width: 280px;
        height: 130px;
        background-size: cover;
        padding: 0 10px;
         padding-top: 33px; 
    }

    .graph_box li .graph_box img {
        width: 40px;
        display: inline-block;
        margin-right: -4px;
        vertical-align: middle;
    }

    .graph_box li .graph_text {
        width: calc(100% - 40px);
        margin-right: -4px;
        font-size: 14px;
        padding-top: 0;
        vertical-align: middle;
    }

    .con_faq_area .table_style02 {
        overflow: auto;
    } 

    .con_faq_area .table_style02 table {
        width: 487px;
    }

    
    .con_about_seminar .con_info ul.text_list li br {
        display: block;
    }
    
    .con_about_adminedu ul.con_edulist > li {
        padding-left: 100px;
    }

    .con_about_adminedu ul.con_edulist > li .icon {
        left: 20px;
    }

    .con_about_adminedu ul.con_edulist > li .title{
        font-size: 17px;
    }

    .ok-class-view #section06 .sec6-list > li,
    .ok-class-view #section03 .sec3-list > li {
      width: 100%;
    }

    .ok-class-form .btn_area {padding-top: 20px !important;}
}

@font-face {
    font-family: 'KOHIBaeumOTF';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/KOHIBaeumOTF.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/* cyrillic */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/jost/v14/92zPtBhPNqw79Ij1E865zBUv7mxEIjVFNIg8mg.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/jost/v14/92zPtBhPNqw79Ij1E865zBUv7mxEIjVPNIg8mg.woff2) format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/jost/v14/92zPtBhPNqw79Ij1E865zBUv7mxEIjVBNIg.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

.specup {line-height: 1.3; box-sizing: border-box; overflow: hidden; word-break: keep-all;}
.specup .layout {width: 895px ; max-width: 100%; margin: auto; position: relative;}
.specup .blue {color: #4588ED;}

.specup #section01 {padding: 36px 0 100px;background: #4588ED; color: #fff; border-bottom: 3px solid #fff; position: relative; overflow: hidden;}
.specup #section01::before {content: ""; width: 415px; height: 120%; background: url(/assets/img/seminar/sec1-bg.png) no-repeat top / contain ; position: absolute; top: 0; right: 0;}
.specup #section01 .logowrap {display: flex;justify-content: space-between; padding: 0 36px; margin-bottom: 120px;  position: relative; z-index: 1;}
.specup #section01 .sec1-title strong {font-family: 'KOHIBaeumOTF';font-size: 45px; font-weight: 400; position: relative; z-index: 1;}
.specup #section01 .sec1-title strong::before {content: ""; width: 120px; height: 190px; background:url(/assets/img/seminar/section01-title.png) no-repeat center center / contain ; position: absolute; top: -50px; top: -85px; left: -30px; z-index: -1;}
.specup #section01 .sec1-title strong .small {font-size: 21px; display: block; margin-bottom: 20px; position: relative; z-index: 1;}
.specup #section01 .sec1-title strong .big {font-size: 65px;}
.specup #section01 .sec1-title img {margin-bottom: -14px;}
.specup #section01 .sec1-title strong .navy {color: #04347D;}
.specup #section01 .sec1-title strong .blue {color: #00FFFF;}
.specup #section01 .sec1-bottom {margin-top: 40px; width: 447px; max-width: 100%;}
.specup #section01 .sec1-bottom > p {font-size: 21px; padding-bottom:10px; border-bottom: 1px solid #fff;}
.specup #section01 .sec1-bottom-info {padding-top: 10px;}
.specup #section01 .sec1-bottom-info > p {margin-top: 27px; font-size: 14px; font-weight: 300;}
.specup #section01 .sec1-bottom-info > ul {display: flex; flex-wrap: wrap; margin: -5px;}
.specup #section01 .sec1-bottom-info > ul > li {width: 50%;font-size: 15px; padding: 5px; box-sizing: border-box;}
.specup #section01 .sec1-bottom-info > ul > li b {font-weight: 400; color: #00FFFF; position: relative; padding-right: 10px;}
.specup #section01 .sec1-bottom-info > ul > li b::before {content: ""; width: 1px; height: 60%; background: #00FFFF; position: absolute; top: 52%; transform: translateY(-50%); right: 5px;}
 
.specup #section02 {background: #C8DBF9; color: #374151; padding: 50px 0 110px;}
.specup #section02 .sec2-imglist {display: flex; align-items: center; justify-content: center; margin: -15px -30px; max-width: none !important;}
.specup #section02 .sec2-imglist > li {padding: 0 30px;text-align: center; width: 236px;}
.specup #section02 .sec2-imglist > li img {width: 100%;}
.specup #section02 .sec2-title1 {font-size: 45px;font-family: 'KOHIBaeumOTF';font-weight: 400; display: block;text-align: center; margin: 77px 0 20px}
.specup #section02 .sec2-title1 + p {width: 620px; max-width: 100%; margin: auto;font-size: 20px; padding: 4px 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff; font-weight: 700; text-align: center; line-height: 1.5;}
.specup #section02 .sec2-title1 + p br {display: none;}
.specup #section02 .sec2-title1 + p .navy {color: #1A4A8C;}
.specup #section02 .check-list {margin: 70px 0;}
.specup #section02 .check-list > li {text-align: center;font-size: 20px; font-weight: 700; margin-bottom: 15px;}
.specup #section02 .check-list > li:last-of-type {margin-bottom: 0;}
.specup #section02 .check-list > li span {font-size: 26px; color:#4588ED ;}
.specup #section02 .check-list > li em {position: relative;}
.specup #section02 .check-list > li em::before {content: ""; width: 100%; height: 1px; background: #fff; position: absolute; bottom: -1px; left: 0;}
.specup #section02 .sec2-title2 {font-size: 35px; display: block ; text-align: center;font-family: 'KOHIBaeumOTF';font-weight: 400;}
.specup #section02 .sec2-title2 + p {font-size: 20px; text-align: center; margin-top: 17px; font-weight: 700; margin-bottom: 50px;}
.specup #section02 .schedule {background: url(/assets/img/seminar/clock-img.png) no-repeat 110% 108% #fff;  border: 1px solid #fff; border-radius: 14px; padding: 40px; display: flex;}
.specup #section02 .schedule > strong {width: 110px; color: #04347D; font-size: 38px;letter-spacing: -0.03em; line-height: 1.1; padding-top: 15px; border-top: 6px solid #04347D;}
.specup #section02 .schedule-list {width: calc(100% - 110px); padding-left: 35px;}
.specup #section02 .schedule-list > li {border-bottom: 1px solid #D1D5DB; padding: 20px 0; display: flex;align-items: center; font-size: 18px;}
.specup #section02 .schedule-list > li:last-of-type {border-bottom: 0;}
.specup #section02 .schedule-list > li > b {width: 135px; font-family: 'Jost'; font-size: 20px; color:#4588ED ; border-right:1px solid #D1D5DB ; padding-right: 5px; box-sizing: border-box;}
.specup #section02 .schedule-list > li > p {width: calc(100% - 135px); padding-left: 15px;}
.specup #section02 .schedule-list > li > p > span {display: block; padding-top: 10px ; border-top: 1px dashed #374151; margin-top: 10px; font-size: 15.5px;}
.specup #section02 .btn-wrap {margin-bottom: 50px;}
.specup #section02 .btn-wrap a {display: inline-block; width: 322px;background: #3362FF; border: 0.6px solid #FFFFFF;box-shadow: 0px 4px 20px #A8BAD3;border-radius: 32.5px; padding: 15px;font-weight: 600;    font-size: 24px; color: #fff;}

.specup #section03 {background: #4588ED; padding: 110px 0 80px; color: #fff;}
.specup #section03 .title-img {text-align: center; margin-bottom: -3px;}
.specup #section03 .profile {padding: 25px 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff; display: flex; margin-bottom: 40px;}
.specup #section03 .profile > strong {width: 360px;font-size: 50px;font-family: 'KOHIBaeumOTF';font-weight: 400; padding-left: 70px; box-sizing: border-box; line-height: 1.2;}
.specup #section03 .profile-txt {width: calc(100% - 360px) ; padding-left: 60px; font-size: 17px;}
.specup #section03 .profile-txt > p {display: flex; align-items: center; margin-bottom: 10px;}
.specup #section03 .profile-txt > p img {margin-right: 5px;}
.specup #section03 .profile-txt ul > li {margin-bottom: 15px;}
.specup #section03 .profile-txt ul > li:last-of-type {margin-bottom: 0;}
.specup #section03 .profile-txt ul > li img {margin-right: 5px;}
.specup #section03 .center {text-align: center;}
.specup #section03 .sec3-title {display: block;font-size: 37px;font-family: 'KOHIBaeumOTF';font-weight: 400; margin-top: -50px;}
.specup #section03 .center > p {margin-top: 20px; font-size: 18px; line-height: 1.7;}
.specup #section03 .center > p span {text-decoration: underline; text-underline-position: under;}
.btn-wrap {text-align: center;}
.specup #section03 .btn-wrap {margin-top: 40px;}
.specup #section03 .btn-wrap a {display: inline-block ; background: #04347D;border: 1px solid #FFFFFF;box-shadow: 0px 4px 20px #005AE0; border-radius: 32.5px;font-size: 24px; color: #fff;padding:15px 43px; font-weight: 600; }
.specup #section03 .btn-wrap a i {padding-left: 10px;font-style: normal;}

.specup #section04 {background: #C8DBF9; padding: 80px 0 110px;}
.specup #section04 .sec4-title1 {font-size: 40px;font-family: 'KOHIBaeumOTF';font-weight: 400;color: #4588ED; display: block; text-align: center; margin-bottom: 70px;}
.specup #section04 .sec4-title1 br {display: none;}
.specup #section04 .sec4-title1 span {color: #04347D;}
.specup #section04 .benefit-list {display: flex; margin: -20px -10px; padding-bottom: 100px; border-bottom: 1px dashed #fff;}
.specup #section04 .benefit-list > li {width: 25%; padding: 20px 10px; text-align: center;}
.specup #section04 .benefit-list .txt-box {background: #F4F8FF;border: 2px solid #3983FD;box-shadow: 0px 1px 50px rgba(22, 104, 227, 0.15); border-radius: 24px; padding: 30px 15px; min-height: 243px; margin-top: -45px; position: relative;}
.specup #section04 .benefit-list .txt-box strong {color: #4588ED;font-size: 24px; padding-bottom: 24px; position: relative; border-bottom: 1px dashed #000; display: inline-block;}
.specup #section04 .benefit-list .txt-box p {margin-top: 24px;}
.specup #section04 .benefit-list .txt-box ul {margin-top: 15px;}
.specup #section04 .benefit-list .txt-box ul span {position: relative; padding-left: 13px;}
.specup #section04 .benefit-list .txt-box ul span::before {content: ""; width: 5px; height: 5px; border-radius: 50%; background: #666; position: absolute; top: 12px; left: 0;}
.specup #section04 .sec4-title2 {font-size: 40px;font-family: 'KOHIBaeumOTF';font-weight: 400;color: #04347D;   margin: 120px 0 20px; display: block; text-align: center;}
.specup #section04 .sec4-title2 + p {font-size: 22px; text-align: center; margin-bottom: 15px; color: #374151;}
.specup #section04 .map {width: 637px; max-width: 100%;margin: auto; padding: 9px; background: #fff; margin-bottom: 15px;}
.specup #section04 .map p {font-size: 15.7px;color: #374151; padding-top: 4px; font-weight: 500; text-align: center;}
.specup #section04 .map + p {text-align: center;}
.specup #section04 .foot-list {display: flex; align-items: center ; justify-content: center; font-size: 13px; margin: -5px -16px; line-height: 1.3; margin-top: 20px;}
.specup #section04 .foot-list > div {padding: 5px 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.specup #section04 .foot-list > div:first-of-type {position: relative;}
.specup #section04 .foot-list > div:first-of-type::before {content: ""; width: 1px; height: 15px; background: #374151; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.specup #section04 .foot-list b {color: #00315B; font-size: 16px;}
.specup #section04 .foot-list a {color: #00315B;  font-size: 16px; font-weight: 700;}
.specup #section04 .foot-list a:first-of-type {margin-right: 14px;}
.specup #section04 .foot-list a i {margin-right: 5px;}
.specup #section04 .btn-wrap {margin-top: 35px;}
.specup #section04 .btn-wrap a {display: inline-block; width: 322px;background: #3362FF; border: 0.6px solid #FFFFFF;box-shadow: 0px 4px 20px #A8BAD3;border-radius: 32.5px; padding: 15px;font-weight: 600;    font-size: 24px; color: #fff;}

.specup img {max-width: 100%;}

@media(max-width:1024px) {
    .specup .layout {padding: 0 15px;}
    .specup #section01 .logowrap {padding: 0 15px;}
}
@media(max-width:768px) {
    .specup #section01 .sec1-title strong {font-size: 25px;}
    .specup #section01 .sec1-title strong .big {font-size: 40px;}
    .specup #section01 .sec1-title strong .big::before {bottom: -30px;}
    .specup #section01 .sec1-title img {width: 55px;}
    .specup #section01 .sec1-title strong > br {display: block;}
    .specup #section01 .sec1-bottom-info > ul > li {width: 100%;}

    .specup #section02 .sec2-imglist {flex-direction: column; margin: 0;}
    .specup #section02 .sec2-title1, .specup #section02 .sec2-title2 {font-size: 30px;}
    /* .specup #section02 .sec2-title1 {margin-top: 40px;} */
    .specup #section02 .check-list > li em::before {display: none;}
    .specup #section02 .schedule {flex-direction: column; padding: 40px 20px; background-position: -54% 108%;}
    .specup #section02 .schedule > strong {width: 100%; border-bottom: 6px solid #04347D; border-top: 0; padding-top: 0; padding-bottom: 15px;}
    .specup #section02 .schedule > strong br {display: none;}
    .specup #section02 .schedule-list {width: 100%; padding-left: 0; margin-top: 20px;}

    .specup #section03 .profile {flex-direction: column;}
    .specup #section03 .profile > strong {padding-left: 0; width: 100%; font-size: 30px;}
    .specup #section03 .profile-txt {width: 100%; padding-left: 0; margin-top: 20px;}
    .specup #section03 .sec3-title {font-size: 30px;}
    
    .specup #section04 .sec4-title1 {font-size: 30px;}
    .specup #section04 .benefit-list {flex-wrap: wrap; max-width: none !important; margin: -20px -3px;}
    .specup #section04 .benefit-list > li {width: 50%; padding: 10px 3px;}
    .specup #section04 .benefit-list .txt-box {min-height: 231px !important; font-size: 14px; padding: 15px;}
    .specup #section04 .benefit-list .txt-box strong {font-size: 19px;}
    .specup #section04 .sec4-title2 {font-size: 30px;}
    .specup #section04 .sec4-title2 + p {font-size: 16px;}
    .specup #section04 .foot-list {flex-direction: column; margin: 0; margin-top: 20px;}
    .specup #section04 .foot-list > div:first-of-type::before {display: none;}
}
@media(max-width:580px) {
    .specup #section01::before {display: none;}
    .specup #section01 .sec1-bottom > p {font-size: 15px;}

    .specup #section02 .sec2-title1 .blue {display: block;}
    .specup #section02 .sec2-title1 + p {font-size: 17px;}
    .specup #section02 .sec2-title1 + p br {display: block;}
    .specup #section02 .sec2-title2 + p {font-size: 17px; line-height: 1.5;}
    .specup #section02 .schedule-list > li {flex-direction: column; }
    .specup #section02 .check-list {margin: 100px 0;}
    .specup #section02 .check-list > li {font-size: 16px; margin-bottom: 20px;}
    .specup #section02 .check-list > li span {font-size: 16px;}
    .specup #section02 .schedule-list > li > b {width: 100%;border-right:0;}
    .specup #section02 .schedule-list > li > p {width: 100%;padding-left: 0;margin-top: 15px;}
    .specup #section02 .schedule-list > li > p > span {font-size: 16px;}
    .specup #section02 .schedule > strong {font-size: 28px;}
    
    .specup #section03 .center > p {font-size: 16px;}
    .specup #section02 .btn-wrap a,
    .specup #section03 .btn-wrap a {font-size: 19px;}
    .specup #section03 .title-img {transform: scale(1.3); border-bottom: 1px solid #fff;}
    .specup #section03 .title-img img {margin-bottom: -4px;}
    .specup #section03 .profile {padding-top: 60px;}

    .specup #section04 .benefit-list {padding-bottom: 75px;}
    .specup #section04 .sec4-title2 {margin-top: 75px;}
    .specup #section04 .sec4-title1 br {display: block;}
}
@media(max-width:487px) {
    .specup #section03 .center > img:first-of-type {transform: scale(.7);}
    .specup #section03 .sec3-title + img {transform: scale(1.3);}
    .specup #section03 .center > p {margin-top: 35px;}

    /* .specup #section04 .benefit-list > li {width: 100%;}  */
    .specup #section04 .benefit-list .txt-box {min-height: auto;}
    .specup #section04 .map p {font-size: 13px; line-height: 1.5;}
}

.ok-mailgate {overflow: auto;}

/* pick&insight 보안세미나 랜딩페이지*/
.pick-insight img {max-width: 100%;}
.pick-insight .layout {width: 760px;max-width: 100%; margin: auto; position: relative;}
.pick-insight #section01 {background: #0C0848; padding: 24px 0 63px; }
.pick-insight .logowrap {display: flex;justify-content: space-between; padding: 0 24px; margin-bottom: 70px;  position: relative; z-index: 1;}
.pick-insight #section01 .layout {width: 765px;}
.pick-insight #section01 .visual {text-align: center; color: #fff;}
.pick-insight #section01 .visual > span {color: #9F6EFF;}
.pick-insight #section01 .visual-subtitle {font-size: 24px; margin-top: 42px; margin-bottom: 20px;}
.pick-insight #section01 .info {font-size: 15px;  padding-top: 2px; border-top: 1px solid rgba(255,255,255,.8); max-width: 670px; margin: auto;margin-top: 50px; display: flex;  justify-content: space-between;}
.pick-insight #section01 .info b {position: relative; padding-right: 10px;}
.pick-insight #section01 .info b::before {content: ""; width: 1px; height: 60%; background: #fff; position: absolute; top: 55%; transform: translateY(-50%); right: 2px;}

.pick-insight #section02 {background: #FAFAFA;  padding: 38px 0 77px; text-align: center; color: #1F2937;}
.pick-insight #section02 .sec2-desc {margin-bottom: 53px; font-size: 18px;}
.pick-insight #section02 .sec2-desc .underline {text-decoration: underline; text-underline-position: under;}
.pick-insight #section02 .list {display: flex; flex-direction: column; gap:17px ; margin-bottom: 66px;}
.pick-insight #section02 .list>li>span {display: inline-flex;align-items: center; padding: 9px 15px; background: #fff; border-radius: 30px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1)}
.pick-insight #section02 .list>li>span i {width: 21px; height: 21px !important; border-radius: 50%; background: #4E88FA; color: #fff; display: flex; align-items: center; justify-content: center; margin-right: 8px; flex-shrink: 0;}
.pick-insight #section02 .layout> span {font-size: 18px;}
.pick-insight #section02 .layout> span strong {font-size: 20px; text-decoration: underline; text-underline-position: under;}

.pick-insight .section-title {display: block; text-align: center; font-size: 28px ;font-weight: 800; color: #0042A6; margin-bottom: 50px;}
.pick-insight .section-title span {font-weight: 300}
.pick-insight #section03 {padding: 72px 0 133px;}
.pick-insight #section03 .timeline > li {border-bottom: 1px dashed #6B7280; padding: 7px 0; padding-left: 20px; display: flex; align-items: center;}
.pick-insight #section03 .timeline > li:first-of-type {border-top: 1px dashed #6B7280;}
.pick-insight #section03 .timeline > li > b {width: calc(88px + 22px); flex-shrink: 0; color: #1F2937;}
.pick-insight #section03 .timeline > li > p .hilight {background: #4E88FA1A; font-weight: 700; color: #1F2937; padding: 0 3px;}
.pick-insight #section03 .timeline > li > p .s-txt {font-size: 15px;font-weight: 400;}
.pick-insight .mt85 {margin-top: 85px;}
.pick-insight .mt130 {margin-top: 130px;}
.pick-insight .mt160 {margin-top: 160px;}
.pick-insight #section03 .speaker-list {display: flex; gap: 40px;}
.pick-insight #section03 .speaker-list>li {display: flex; flex-direction: column; align-items: center; width: 33.3333%;}
.pick-insight #section03 .speaker-list>li p {margin-top: 12px; color: #1F2937; text-align: center;}
.pick-insight #section03 .speaker-list>li p b {display: block;}
.pick-insight #section03 .speaker-list>li .bar-list {font-size: 14px; margin-top: 19px;letter-spacing: -1.5px;line-height: 1.5;}
.pick-insight .mt130.section-title + p {text-align: center; color: #1F2937;}
.pick-insight #section03 .product-list {display: flex; gap: 47px; margin-top: 60px; margin-bottom: 18px;}
.pick-insight #section03 .product-list > li {width: 33.333%; display: flex; flex-direction: column; align-items: center; text-align: center; background: #D9D9D929; padding: 26px 22px;}
.pick-insight #section03 .product-list > li > img {height: 158px;}
.pick-insight #section03 .product-list > li > strong {color: #1F2937; margin: 13px 0 5px;}
.pick-insight #section03 .product-list > li > p {font-size: 13px; line-height: 1.4;}
.pick-insight #section03 .product-list > li > a {display: inline-block; padding: 3px 22px; background: #1668E3; border-radius: 20px; color: #fff; font-size: 14px; margin-top: 15px; line-height: 1.3;}
.pick-insight #section03 .notice-list {font-size: 15px; line-height: 1.4; }
.pick-insight #section03 .contact-btn { display: inline-block; width: 187px; height: 43px !important; font-size: 18px; font-weight: 800; color: #fff; background: #4E88FA; border-radius: 20px; display: flex; align-items: center; justify-content: center; margin: auto;margin-top: 20px;box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.25);}
.pick-insight #section03 .review-list {display: flex; gap: 47px;}
.pick-insight #section03 .review-list > li {display: flex; flex-direction: column; align-items: center;background: rgba(78, 136, 250, 0.06); border-radius: 6px; width: 33.333%; padding: 33px;}
.pick-insight #section03 .review-list > li img:first-of-type {width: 120px;}
.pick-insight #section03 .review-list > li img {mix-blend-mode: multiply;}
.pick-insight #section03 .review-list > li div {font-size: 14px; text-align: center; line-height: 1.4; padding-top: 10px ;border-top: 1px dashed #6EA8FF; color: #1F2937;}


.pick-insight #section04 {padding-top: 58px;background: #F8FAFD;text-align: center; position: relative; z-index: 0;}
.pick-insight #section04 .map-title {margin-bottom: 15px;}
.pick-insight #section04 .map-title b {color: #1F2937; font-size: 18px;}
.pick-insight #section04 .list {margin-bottom: 10px;}
.pick-insight #section04 .list > li > span {position: relative; padding-left: 12px;}
.pick-insight #section04 .list > li > span::before {content: ""; width: 6px; height: 6px; background: #D4AA29; border-radius: 50%; position: absolute; left: 0; top: 9px;}
.pick-insight #section04 .ok-info {position: relative; padding: 25px 0;}
.pick-insight #section04 .ok-info::before {content: ""; width: 100vw; height: 100%; background: #fff; position: absolute; left: 50%; top: 0; transform: translateX(-50%);z-index: -1;}
.pick-insight #section04 .ok-info {display: flex; align-items: center ; justify-content: center; font-size: 13px; margin: -5px -16px; line-height: 1.3; margin-top: 20px;}
.pick-insight #section04 .ok-info > div {padding: 5px 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.pick-insight #section04 .ok-info > div:first-of-type {position: relative;color: #374151; }
.pick-insight #section04 .ok-info > div:first-of-type::before {content: ""; width: 1px; height: 15px; background: #374151; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.pick-insight #section04 .ok-info b {font-size: 16px;}
.pick-insight #section04 .ok-info a {color: #374151;  font-size: 16px; font-weight: 700;}
.pick-insight #section04 .ok-info a:first-of-type {margin-right: 14px;}
.pick-insight #section04 .ok-info a i {margin-right: 5px;}
.pick-insight br.mobile {display: none;}
@media(max-width:900px) {
  .pick-insight .layout {padding: 0 12px;}
}
@media(max-width:850px) {
  .pick-insight #section03 .product-list {flex-wrap: wrap; justify-content: center; gap: 20px;}
  .pick-insight #section03 .product-list > li {width: 40%;}
}
@media(max-width:768px) {
  .pick-insight br.mobile {display: block !important;}
}
@media(max-width:680px) {
  .pick-insight #section01 .info {flex-direction: column;}
  .pick-insight #section03 .review-list {flex-wrap: wrap; gap: 20px; justify-content: center;}
  .pick-insight #section03 .review-list > li {width: 40%;}
}
@media(max-width:550px) {
  .pick-insight #section03 .speaker-list {flex-direction: column;align-items: center;}
  .pick-insight #section03 .speaker-list >li {width: 100%;}
  .pick-insight #section03 .product-list > li {width: 100%;}
  .pick-insight #section04 .ok-info {flex-direction: column; margin: 0; margin-top: 20px;}
  .pick-insight #section04 .ok-info > div:first-of-type::before {display: none;}
}
@media(max-width:450px) {
  .pick-insight #section03 .timeline > li {flex-direction: column; padding-left: 0;}
  .pick-insight #section03 .timeline > li > b {width: 100%; margin-bottom: 5px;}
  .pick-insight #section03 .timeline > li > p {width: 100%;}
  .pick-insight #section03 .review-list > li {width: 100%;}
}